/* MAIN */
:root {
	--site-color-text: #f6f8fa;
	--site-color-main: #8d3bde;
	--site-color-main-light: #ba86ed;
	--site-color-main-transparent: rgba(141, 59, 222, 0.15);
    --site-color-bg-body: #0f0b1a;
    --site-color-bg-dark: #130d22;
    --site-color-bg-light: #1c1538;
	--site-color-bg-active: #271c4e;
	--site-color-bg-dark-transparent: rgba(19, 13, 34, 0.72);
	--site-color-bg-light-transparent: rgba(28, 21, 56, 0.64);
	--site-color-cta: #09b95b;
	--site-color-cta-hover: #08a451;
	
	--site-color-success: #2ee36f;
    --site-color-warning: #f6c453;
    --site-color-danger: #ff5f56;
    --site-color-info: #4ba3d3;
	
	--site-color-success-transparent: rgba(46, 227, 111, 0.5);
    --site-color-warning-transparent: rgba(246, 196, 83, 0.5);
    --site-color-danger-transparent: rgba(255, 95, 86, 0.5);
	
	--site-color-blue: #5b8bd9;
    --site-color-indigo: #3f6dd6;
    --site-color-purple: #4d6bff;
    --site-color-pink: #ff6aa9;
    --site-color-red: #ff5f56;
    --site-color-crimson: #ed143d;
	--site-color-orange: #ff9b3d;
    --site-color-yellow: #f6c453;
    --site-color-green: #2ee36f;
    --site-color-teal: #20c997;
    --site-color-cyan: #17a2b8;
    --site-color-white: #fff;
    --site-color-gray: #6c757d;
    --site-color-gray-light: #b8b8b8;
    --site-color-gray-dark: #343a40;
    --site-color-dark: #252525;
	
	--site-color-google: #ffffff;
    --site-color-facebook: #3b5998;
    --site-color-steam: #171a21;
    --site-color-twitter: #009ded;
	
	--site-color-level-steel: #77726d;
	--site-color-level-bronze: #d19f69;
	--site-color-level-silver: #bdc5d1;
	--site-color-level-gold: #fad84e;
	--site-color-level-diamond: #4eb2fa;

	--site-font-body: Arial, sans-serif;
	--site-font-display: Arial, sans-serif;

	--site-glass-bg: rgba(19, 13, 34, 0.65);
	--site-glass-bg-strong: rgba(19, 13, 34, 0.82);
	--site-glass-border: rgba(139, 92, 246, 0.12);
	--site-glass-highlight: rgba(255, 255, 255, 0.15);
	--site-glass-shadow: 0 18px 60px rgba(0, 0, 0, 0.55);
	--site-sidebar-width: 160px;
}

/* Interface copy behaves like application UI, not selectable document text. */
body,body p,body span,body small,body strong,body label,body h1,body h2,body h3,body h4,body h5,body h6,body li,body .table-column {
	cursor:default;
	user-select:none;
	-webkit-user-select:none;
}
body a,body button,body [role="button"],body [onclick],body select,body input[type="button"],body input[type="submit"],body input[type="checkbox"],body input[type="radio"],body input[type="range"] {
	cursor:pointer;
}
body input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),body textarea,body [contenteditable="true"],body pre,body code {
	cursor:text;
	user-select:text;
	-webkit-user-select:text;
}

/* Shared per-game audio control. Crash and Roulette retain their compact
   in-board variants; every other game receives this button in its top bar. */
.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle) { display:inline-flex; min-height:36px; align-items:center; justify-content:center; gap:7px; padding:0 12px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:rgba(255,255,255,.04); color:#a79ead; font:inherit; font-size:12px; font-weight:700; white-space:nowrap; cursor:pointer; transition:border-color .18s,background .18s,color .18s; }
.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle):hover { border-color:rgba(159,104,248,.4); background:rgba(130,69,226,.12); color:#fff; }
.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle).is-muted { border-color:rgba(244,201,93,.2); background:rgba(244,201,93,.07); color:#d9ccaa; }
.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle):focus-visible { outline:2px solid rgba(181,116,244,.9); outline-offset:2px; border-color:rgba(181,116,244,.62); color:#fff; }
.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle) i { width:14px; text-align:center; color:#bd8cf4; transition:color .18s,transform .18s; }
.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle):hover i { color:#d9b7ff; transform:scale(1.08); }
.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle).is-muted i { color:#e0bd67; }

@media (max-width:640px) {
	.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle) { width:36px; padding:0; }
	.game-sound-toggle:not(.cr-sound-toggle):not(.rl-sound-toggle) span { display:none; }
}

:root {
	--site-chat-width: 275px; /* 275px */
	--site-header-row-top-height: 30px;
	--site-header-row-bottom-height: 50px;
}

* {
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.rb:hover {
	opacity: .6;
}

input, input.focus, input:focus, textarea, textarea.focus, textarea:focus, button, button.focus, button:focus {
    color: var(--site-color-text);
    border: none;
	outline: unset;
	-moz-box-shadow: unset;
	-webkit-box-shadow: unset;
	box-shadow: unset;
	font-family: var(--site-font-body);
}


::-webkit-scrollbar {
	width: 9px;
}

::-webkit-scrollbar-track {
	border-radius: 100px;
	background: rgba(93, 103, 112, 0.1);
}

::-webkit-scrollbar-thumb {
	border-radius: 100px;
	background: rgba(93, 103, 112, 0.3);
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(93, 103, 112, 0.4);
}

::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(93, 103, 112, 0.1);
}

body {
	font-family: var(--site-font-body);
    color: var(--site-color-text);
    z-index: 50;
    background: radial-gradient(1200px circle at 10% -20%, rgba(139, 92, 246, 0.15), transparent 60%),
		radial-gradient(900px circle at 85% -10%, rgba(124, 58, 237, 0.1), transparent 55%),
		radial-gradient(1000px circle at 50% 120%, rgba(99, 51, 201, 0.12), transparent 65%),
		var(--site-color-bg-body);
    /*background: url(../img/bg.png) no-repeat 0 0 var(--site-color-bg-body);*/
    background-size: cover;
    background-attachment: fixed;
	font-size: 14px;
	width: 100%;
	padding: 0;
	margin: 0;
	position: relative;
	min-height: 100vh;
}

body::before,
body::after {
	content: "";
	position: fixed;
	width: 520px;
	height: 520px;
	border-radius: 50%;
	filter: blur(55px);
	opacity: 0.6;
	pointer-events: none;
	z-index: 0;
}

body::before {
	top: -180px;
	left: -120px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.4), transparent 70%);
}

body::after {
	top: 20px;
	right: -200px;
	background: radial-gradient(circle, rgba(109, 40, 217, 0.3), transparent 70%);
}

body > div.flex.column.height-full.width-full {
	position: relative;
	z-index: 1;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--site-font-display);
	letter-spacing: -0.01em;
}

a {
	color: var(--site-color-text) !important;
	text-decoration: none !important;
}

a:hover {
	/* color: var(--site-color-main) !important; */
}

.snowflake {
	color: #fff;
	font-size: 1em;
	font-family: Arial, sans-serif;
  }
  
  @-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s}



.disabled {
	cursor: no-drop !important;
	opacity: 0.5;
}

.disabled:active {
    pointer-events: none !important;
}

.disabled > * {
	pointer-events: none !important;
}

.items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.items-start {
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    align-items: flex-start;
}

.items-end {
    -webkit-box-align: flex-end;
    -ms-flex-align: flex-end;
    align-items: flex-end;
}

.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.justify-start {
    -webkit-box-pack: flex-start;
    -ms-flex-pack: flex-start;
    justify-content: flex-start;
}

.justify-end {
    -webkit-box-pack: flex-end;
    -ms-flex-pack: flex-end;
    justify-content: flex-end;
}

.justify-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.text-shadow {
	-webkit-text-shadow: -2px 2px 5px rgba(0,0,0,0.5);
	-moz-text-shadow: -2px 2px 5px rgba(0,0,0,0.5);
	text-shadow: -2px 2px 5px rgba(0,0,0,0.5);
}

.text-center {
    text-align: -webkit-center;
    text-align: -moz-center;
	text-align: center;
}

.text-left {
    text-align: -webkit-left;
    text-align: -moz-left;
	text-align: left;
}

.text-right {
    text-align: -webkit-right;
    text-align: -moz-right;
	text-align: right;
}

.text-upper {
	text-transform: uppercase;
}

.text-lower {
	text-transform: lowercase;
}

.text-bold {
	font-weight: bold;
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.flex.row {
	-webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.flex.column { 
	-webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.grid {
    display: -ms-grid;
    display: grid;
}

.grid.split-column-full { grid-template-columns: repeat( auto-fit, minmax(0px, 1fr)); }

.grid.split-column-2.gap-1 { grid-template-columns: calc((100% - 1 * 5px) / 2) calc((100% - 1 * 5px) / 2); }
.grid.split-column-3.gap-1 { grid-template-columns: calc((100% - 2 * 5px) / 3) calc((100% - 2 * 5px) / 3) calc((100% - 2 * 5px) / 3); }
.grid.split-column-4.gap-1 { grid-template-columns: calc((100% - 3 * 5px) / 4) calc((100% - 3 * 5px) / 4) calc((100% - 3 * 5px) / 4) calc((100% - 3 * 5px) / 4); }

.grid.split-column-2.gap-2 { grid-template-columns: calc((100% - 1 * 10px) / 2) calc((100% - 1 * 10px) / 2); }
.grid.split-column-3.gap-2 { grid-template-columns: calc((100% - 2 * 10px) / 3) calc((100% - 2 * 10px) / 3) calc((100% - 2 * 10px) / 3); }
.grid.split-column-4.gap-2 { grid-template-columns: calc((100% - 3 * 10px) / 4) calc((100% - 3 * 10px) / 4) calc((100% - 3 * 10px) / 4) calc((100% - 3 * 10px) / 4); }

.grid.split-column-2.gap-3 { grid-template-columns: calc((100% - 1 * 15px) / 2) calc((100% - 1 * 15px) / 2); }
.grid.split-column-3.gap-3 { grid-template-columns: calc((100% - 2 * 15px) / 3) calc((100% - 2 * 15px) / 3) calc((100% - 2 * 15px) / 3); }
.grid.split-column-4.gap-3 { grid-template-columns: calc((100% - 3 * 15px) / 4) calc((100% - 3 * 15px) / 4) calc((100% - 3 * 15px) / 4) calc((100% - 3 * 15px) / 4); }

.in-grid {
	grid-column-start: 1;
    grid-column-end: none;
	grid-row-start: 1;
    grid-row-end: none;
}

.inline-block {
    display: inline-block;
}

.inline-table {
    display: inline-table;
}

.inline-grid {
    display: inline-grid;
}

.overflow-a { overflow: auto; }
.overflow-h { overflow: hidden; }

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.top-0 { top: 0; }
.bottom-0 { bottom: 0; }
.left-0 { left: 0; }
.right-0 { right: 0; }

.ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.float-left{
	float: left;
}

.float-right{
	float: right;
}

.m-1 { margin: 5px; } 
.m-2 { margin: 10px; }
.m-3 { margin: 15px; }
.m-4 { margin: 20px; }

.m-a { margin: auto; }

.mb-1 { margin-bottom: 5px; }
.mb-2 { margin-bottom: 10px; }
.mb-3 { margin-bottom: 15px; }
.mb-4 { margin-bottom: 20px; }

.mt-1 { margin-top: 5px; }
.mt-2 { margin-top: 10px; }
.mt-3 { margin-top: 15px; }
.mt-4 { margin-top: 20px; }

.ml-1 { margin-left: 5px; }
.ml-2 { margin-left: 10px; }
.ml-3 { margin-left: 15px; }

.mr-1 { margin-right: 5px; }
.mr-2 { margin-right: 10px; }
.mr-3 { margin-right: 15px; }
.mr-4 { margin-right: 20px; }

.p-0 { padding: 0px !important; }
.p-1 { padding: 5px; }
.p-2 { padding: 10px; }
.p-3 { padding: 15px; }
.p-4 { padding: 20px; }

.pb-0 { padding-bottom: 0px !important; }
.pb-1 { padding-bottom: 5px; }
.pb-2 { padding-bottom: 10px; }
.pb-3 { padding-bottom: 15px; }
.pb-4 { padding-bottom: 20px; }

.pt-0 { padding-top: 0px !important; }
.pt-1 { padding-top: 5px; }
.pt-2 { padding-top: 10px; }
.pt-3 { padding-top: 15px; }
.pt-4 { padding-top: 20px; }

.pl-0 { padding-left: 0px !important; }
.pl-1 { padding-left: 5px; }
.pl-2 { padding-left: 10px; }
.pl-3 { padding-left: 15px; }
.pl-4 { padding-left: 20px; }

.pr-0 { padding-right: 0px !important; }
.pr-1 { padding-right: 5px; }
.pr-2 { padding-right: 10px; }
.pr-3 { padding-right: 15px; }
.pr-4 { padding-right: 20px; }

.transition-1 {
	-webkit-transition: all 100ms;
	-moz-transition: all 100ms;
	transition: all 100ms;
}

.transition-2 {
	-webkit-transition: all 200ms;
	-moz-transition: all 200ms;
	transition: all 200ms;
}

.transition-5 {
	-webkit-transition: all 500ms;
	-moz-transition: all 500ms;
	transition: all 500ms;
}

.transition-10 {
	-webkit-transition: all 1000ms;
	-moz-transition: all 1000ms;
	transition: all 1000ms;
}

.transition-1.linear, .transition-5.linear, .transition-10.linear {
	-webkit-transition-timing-function: linear;
	-moz-transition-timing-function: linear;
	transition-timing-function: linear;
}

.rounded-full{ border-radius: 50%; }
.rounded-0{ border-radius: 0.25rem; }
.rounded-1{ border-radius: 0.5rem; }
.rounded-2{ border-radius: 1rem; }

.b-d1{ border: solid 1px var(--site-color-bg-dark); }
.b-d2{ border: solid 2px var(--site-color-bg-dark); }
.b-d4{ border: solid 4px var(--site-color-bg-dark); }

.b-l1{ border: solid 1px var(--site-color-bg-light); }
.b-l2{ border: solid 2px var(--site-color-bg-light); }
.b-l4{ border: solid 4px var(--site-color-bg-light); }

.b-m1{ border: solid 1px var(--site-color-main); }
.b-m2{ border: solid 2px var(--site-color-main); }
.b-m4{ border: solid 4px var(--site-color-main); }

.bl-d2{ border-left: solid 2px var(--site-color-bg-dark); }
.br-d2{ border-right: solid 2px var(--site-color-bg-dark); }
.bt-d2{ border-top: solid 2px var(--site-color-bg-dark); }
.bb-d2{ border-bottom: solid 2px var(--site-color-bg-dark); }

.bl-l2{ border-left: solid 2px var(--site-color-bg-light); }
.br-l2{ border-right: solid 2px var(--site-color-bg-light); }
.bt-l2{ border-top: solid 2px var(--site-color-bg-light); }
.bb-l2{ border-bottom: solid 2px var(--site-color-bg-light); }

.bl-d4{ border-left: solid 4px var(--site-color-bg-dark); }
.br-d4{ border-right: solid 4px var(--site-color-bg-dark); }
.bt-d4{ border-top: solid 4px var(--site-color-bg-dark); }
.bb-d4{ border-bottom: solid 4px var(--site-color-bg-dark); }

.bl-l4{ border-left: solid 4px var(--site-color-bg-light); }
.br-l4{ border-right: solid 4px var(--site-color-bg-light); }
.bt-l4{ border-top: solid 4px var(--site-color-bg-light); }
.bb-l4{ border-bottom: solid 4px var(--site-color-bg-light); }

.text-indent-0 { text-indent: 0px; }
.text-indent-1 { text-indent: 30px; }
.text-indent-2 { text-indent: 60px; }

.text-space-1 { letter-spacing: 5px; }
.text-space-2 { letter-spacing: 10px; }

.coins {
    height: 25px;
    width: 25px;
    display: inline-flex;
    vertical-align: middle;
    background: url(../img/coins.png) no-repeat 50% 50%;
    background-size: contain;
}

.bg-main-transparent {
	background: linear-gradient(135deg, rgba(44, 212, 197, 0.18), rgba(75, 163, 211, 0.12));
}

.bg-light {
	background: var(--site-glass-bg);
	border: 1px solid var(--site-glass-border);
	box-shadow: var(--site-glass-shadow);
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
}

.bg-light-transparent {
	background: var(--site-color-bg-light-transparent);
	border: 1px solid var(--site-glass-border);
	backdrop-filter: blur(14px) saturate(135%);
	-webkit-backdrop-filter: blur(14px) saturate(135%);
}

.bg-dark {
	background: var(--site-glass-bg-strong);
	border: 1px solid var(--site-glass-border);
	box-shadow: var(--site-glass-shadow);
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
}

.bg-dark-transparent {
	background: var(--site-color-bg-dark-transparent);
	border: 1px solid var(--site-glass-border);
	backdrop-filter: blur(14px) saturate(135%);
	-webkit-backdrop-filter: blur(14px) saturate(135%);
}

.bg-danger {
	background: var(--site-color-danger);
}

.bg-success {
	background: var(--site-color-success);
}

.bg-info {
	background: var(--site-color-info);
}

.bg-warning {
	background: var(--site-color-warning);
}

.title-page{
	color: var(--site-color-main);
	font-size: 18px;
	width: 100%;
	text-transform: uppercase;
}

.title-page:before, .title-page:after {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	content: "";
	width: 20px;
	height: 3px; 
	background: var(--site-color-main);
	margin-left: 10px;
	margin-right: 10px;
}



.title{
	color: var(--site-color-gray-light);
	font-size: 14px;
}

.title:before, .title:after {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	content: "";
	width: 50%;
	height: 2px; 
	background: var(--site-color-gray-light);
	margin-left: 10px;
	margin-right: 10px;
}



.title-panel {
    text-transform: capitalize;
    font-size: 14px;
    font-weight: bold;
    background: var(--site-color-main-transparent);
}

.hidden {
	display: none !important;
}

img {
	vertical-align: middle;
}

.width-0 { width: calc((100% / 12) * 0); }
.width-1 { width: calc((100% / 12) * 1); }
.width-2 { width: calc((100% / 12) * 2); }
.width-3 { width: calc((100% / 12) * 3); }
.width-4 {width: calc((100% / 12) * 2);}
.width-5 { width: calc((100% / 12) * 5); }
.width-6 { width: calc((100% / 12) * 6); }
.width-7 { width: calc((100% / 12) * 7); }
.width-8 { width: calc((100% / 12) * 8); }
.width-9 { width: calc((100% / 12) * 9); }
.width-10 { width: calc((100% / 12) * 10); }
.width-11 { width: calc((100% / 12) * 11); }
.width-12 { width: calc((100% / 12) * 12); }

.font-1 { font-size: calc(1 * 2px); }
.font-2 { font-size: calc(2 * 2px); }
.font-3 { font-size: calc(3 * 2px); }
.font-4 { font-size: calc(4 * 2px); }
.font-5 { font-size: calc(5 * 2px); }
.font-6 { font-size: calc(6 * 2px); }
.font-7 { font-size: calc(7 * 2px); }
.font-8 { font-size: calc(8 * 2px); }
.font-9 { font-size: calc(9 * 2px); }
.font-10 { font-size: calc(10 * 2px); }
.font-11 { font-size: calc(11 * 2px); }
.font-12 { font-size: calc(12 * 2px); }
.font-13 { font-size: calc(13 * 2px); }
.font-14 { font-size: calc(14 * 2px); }
.font-15 { font-size: calc(15 * 2px); }
.font-20 { font-size: calc(20 * 2px); }
.font-25 { font-size: calc(25 * 2px); }
.font-35 { font-size: calc(30 * 2px); }

.font-weight-1 { font-weight: 400; }
.font-weight-2 { font-weight: 700; }
.font-weight-3 { font-weight: 900; }

.alerts-panel{
	background-color: var(--site-color-bg-dark);
	border-top: solid 1px var(--site-color-main);
	color: var(--site-color-text);
	font-size: 12px;
	text-align: center;
	font-weight: bold;
	position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
	z-index: 4;
}

.demiss-alert {
	right: 10px;
    position: absolute;
    cursor: pointer;
}

.demiss-alert:hover {
	color: var(--site-text-color-light) !important;
}

.pullout {
    position: fixed;
    z-index: 2;
    height: 93vh;
    border-right: solid 1px var(--site-glass-border);
	background: var(--site-glass-bg-strong);
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
    -webkit-box-flex: 1;
    flex: 1 1 0%;
    overflow: hidden;
}

.pullout-left {
	width: 210px;
	left: -210px;
	box-shadow: 0 18px 22px -4px #00000069;
	/*width: var(--site-chat-width);*/
	/*left: calc(var(--site-chat-width) * (-1));*/
}

.pullout-right {
	/* Keep the chat within 88% of the viewport so it does not cover content on tablets. */
	width: min(310px, 88vw) !important;
	right: calc(-1 * min(310px, 88vw));
	/*width: var(--site-chat-width);*/
    /*right: calc(var(--site-chat-width) * (-1));*/
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	.pullout-right {
		right: -310px !important; /* todo */
	}
}

.text-success { color: var(--site-color-success) !important; }
.text-warning { color: var(--site-color-warning) !important; }
.text-danger { color: var(--site-color-danger) !important; }
.text-info { color: var(--site-color-info) !important; }

.text-gray { color: var(--site-color-gray-light) !important; }
.text-color { color: var(--site-color-main) !important; }
.text-default { color: var(--site-color-main-light) !important; }

.gap-1 { gap: 5px; }
.gap-2 { gap: 10px; }
.gap-3 { gap: 15px; }
.gap-4 { gap: 20px; }

@keyframes page-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

#page_content2 {
	animation: page-in 480ms ease both;
}

.main-panel{
	position: absolute;
    right: 0;
	left: 0;
	z-index: 0;
	height: 100%;
	overflow: auto;
	overflow-x: hidden;
	padding: 40px 80px;
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	.main-panel {
		position: initial;
		padding: 20px;
		width: 100%;
		float: left;
		height: auto;
	}

	.wrapper-page {
		flex: none !important;
		display: block;
	}

	div.pullout[data-pullout="chat"] {
		display: block;
		position: initial;
		width: calc(100% - 40px) !important;
		flex: none !important;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 20px;
		float: left;
		height: 600px;
		transition: none;
		/*transform: translateY(-373px); /* 373 is height of footer */
		margin-top: -1073px;
		border-radius: 8px;
	}

	.footer {
		/*transform: translateY(600px); /* 600 is height of the footer */
		margin-top: 660px !important;
	}

	.main-panel {
		overflow: auto;
	}

	.pullout {
		z-index: 36;
	}
}

.site-button {
	
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    /*-ms-touch-action: manipulation;*/
    /*touch-action: manipulation;*/
    cursor: pointer;
    /*-webkit-user-select: none;*/
    /*-moz-user-select: none;*/
    /*-ms-user-select: none;*/
    user-select: none;
    line-height: 1.5;
    border-radius: 5px;
    padding: 7px 15px;
	background-color: transparent;
	transition: transform 200ms ease, box-shadow 200ms ease, filter 200ms ease;
}

.site-button.black {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    border-radius: 8px;
    padding: 0px 14px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    font-weight: 700;
    color: #0b1118;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    background-image: linear-gradient(135deg, rgba(44, 212, 197, 0.95), rgba(246, 196, 83, 0.95));
    box-shadow: 0 12px 26px rgba(44, 212, 197, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.site-button.black:hover {
	transform: translateY(-1px);
	filter: brightness(1.05);
	box-shadow: 0 16px 30px rgba(44, 212, 197, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.5);
}
.site-button.pink { background-color: rgb(41 149 84); }
.site-button.purple { background-color: var(--site-color-main); }
.site-button.green { background-color: var(--site-color-success); }
.site-button.orange { background-color: var(--site-color-warning); }
.site-button.red { background-color: var(--site-color-danger); }

.site-button i {
	line-height: 1.5;
}

.icon-small {
	/* height: 30px !important; */
	width: 30px !important;
}

.icon-medium {
	height: 40px !important;
	width: 40px !important;
}

.icon-medium-31 {
	height: 31px !important;
	width: 31px !important;
}

.icon-large {
	height: 60px !important;
	width: 60px !important;
}

.icon-huge {
	height: 120px !important;
	width: 120px !important;
}

.icon-small img, .icon-medium img, .icon-large img, .icon-huge img {
	width: 100%;
	height: 100%;
}

.width-full { width: 100% !important;}
.width-0 { width: 0% !important;}

.height-full { min-height: 100% !important;}
.height-0 { height: 0% !important;}

.progress-container {
    background: rgba(15, 22, 34, 0.7);
	border: 1px solid var(--site-glass-border);
	position: relative;
	overflow: hidden;
}

.progress-container.small { height: 20px; }
.progress-container.medium { height: 35px; }
.progress-container.large { height: 50px; }

.progress-content {
    position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	font-size: 14px;
}

.progress-bar {
	float: left;
    height: 100%;
    background: var(--site-color-main);
}

.progress-container.small.meter .progress-bar {
	animation: meter 500ms linear infinite;
    background-image: linear-gradient(-45deg, rgba(255,255,255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255, 0.15) 50%, rgba(255,255,255, 0.15) 75%, transparent 75%) !important;
    background-size: 20px;
    background-repeat: repeat-x;
}

@keyframes meter {
	0% {
		background-position: 0px 0px;
	}
	100% {
		background-position: 20px 0px;
	}
}

@-webkit-keyframes meter {
    0% {
		background-position: 0px 0px;
	}
	100% {
		background-position: 20px 0px;
	}
}

.avatar-field .level { 
	border: solid 2px var(--site-color-bg-light); 
	color: var(--site-color-bg-light); 
}

.avatar-field.tier-steel .level { background: var(--site-color-level-steel);}
.avatar-field.tier-bronze .level { background: var(--site-color-level-bronze);}
.avatar-field.tier-silver .level { background: var(--site-color-level-silver);}
.avatar-field.tier-gold .level { background: var(--site-color-level-gold);}
.avatar-field.tier-diamond .level { background: var(--site-color-level-diamond);}

.avatar-field.tier-steel .avatar { border: solid 4px var(--site-color-level-steel);}
.avatar-field.tier-bronze .avatar { border: solid 4px var(--site-color-level-bronze);}
.avatar-field.tier-silver .avatar { border: solid 4px var(--site-color-level-silver);}
.avatar-field.tier-gold .avatar { border: solid 4px var(--site-color-level-gold);}
.avatar-field.tier-diamond .avatar { border: solid 4px var(--site-color-level-diamond);}

.sop-small-left, .sop-small-right, .sup-small-left, .sup-small-right {
	height: 14px;
	width: 14px;
	position: absolute;
    font-size: 8px;
	overflow: hidden;
	font-weight: bold;
}

.sop-medium-left, .sop-medium-right, .sup-medium-left, .sup-medium-right {
	height: 20px;
	width: 20px;
	position: absolute;
    font-size: 10px;
	overflow: hidden;
	font-weight: bold;
}

.sop-large-left, .sop-large-right, .sup-large-left, .sup-large-right {
	height: 30px;
	width: 30px;
	position: absolute;
    font-size: 14px;
	overflow: hidden;
	font-weight: bold;
}

.sop-huge-left, .sop-huge-right, .sup-huge-left, .sup-huge-right {
	height: 50px;
	width: 50px;
	position: absolute;
    font-size: 20px;
	overflow: hidden;
	font-weight: bold;
}

.sop-small-left img, .sop-small-right img, .sup-small-left img, .sup-small-right img,
.sop-medium-left img, .sop-medium-right img, .sup-medium-left img, .sup-medium-right img,
.sop-large-left img, .sop-large-right img, .sup-large-left img, .sup-large-right img,
.sop-huge-left img, .sop-huge-right img, .sup-huge-left img, .sup-huge-right img {
	height: 100%;
	width: 100%;
}

.sop-small-left {
	top: -4px;
	left: -4px;
}

.sop-small-right {
	top: -4px;
	right: -4px;
}

.sup-small-left {
	bottom: -4px;
	left: -4px;
}

.sup-small-right {
	bottom: -4px;
	right: -4px;
}

.sop-medium-left {
	top: -6px;
	left: -6px;
}

.sop-medium-right {
	top: -6px;
	right: -6px;
}

.sup-medium-left {
	bottom: -6px;
	left: -6px;
}

.sup-medium-right {
	bottom: -6px;
	right: -6px;
}

.sop-large-left {
	top: -8px;
	left: -8px;
}

.sop-large-right {
	top: -8px;
	right: -8px;
}

.sup-large-left {
	bottom: -8px;
	left: -8px;
}

.sup-large-right {
	bottom: -8px;
	right: -8px;
}

.sop-huge-left {
	top: -12px;
	left: -12px;
}

.sop-huge-right {
	top: -12px;
	right: -12px;
}

.sup-huge-left {
	bottom: -12px;
	left: -12px;
}

.sup-huge-right {
	bottom: -12px;
	right: -12px;
}

.hover-message {
    margin: auto;
    font-size: 14px;
    z-index: 0;
}

.hover-message .pointer{
	padding: 2px 4px;
	font-size: 10px;
	background: var(--site-color-white);
	color: var(--site-color-bg-dark);
	border-radius: 2px;
	z-index: 1;
}

.hover-message:before {
	content: "";
    width: 8px;
    height: 8px;
    background: var(--site-color-white);
    position: absolute;
    bottom: -4px;
    transform: rotateZ(45deg);
    transition: all 300ms;
}


.panel-histories {
	width: 100%;
	overflow: hidden;
	background-color: var(--site-color-bg-dark);
}

.panel-histories.small {
	height: 100px;
}

.panel-histories.medium {
	height: 125px;
}

.history-container.small {
    width: 150px;
    min-width: 150px;
}

.history-container.medium {
    width: 200px;
    min-width: 200px;
}

.history-container.success {
	border: 2px solid var(--site-color-success-transparent);
	background: linear-gradient(to top, var(--site-color-success-transparent) 0%, var(--site-color-bg-dark-transparent) 100%);
}

.history-container.danger {
	border: 2px solid var(--site-color-danger-transparent);
	background: linear-gradient(to top, var(--site-color-danger-transparent) 0%, var(--site-color-bg-dark-transparent) 100%);
}

.history-content {
    position: relative;
    width: 100%;
    height: 100%;
}

.history-content .image {
    position: absolute;
	top: 0;
}

.history-content .name {
    position: absolute;
	bottom: 15;
	font-size: 12px;
    width: 100%;
}

.history-content .price {
	position: absolute;
	bottom: 0;
	font-size: 10px;
    width: 100%;
}

.coins-mini {
    height: 15px;
    width: 15px;
    display: inline-flex;
    vertical-align: middle;
    background: url(../img/coins.png) no-repeat 50% 50%;
    background-size: contain;
}

.switch_panel.site-button.active{
	background-color: var(--site-color-bg-active) !important;
}

.pointer {
	cursor: pointer;
}

/* END MAIN */

/* LOADER */

.loader {
	position: relative;
	width: 65px;
}

.loader-part {
	height: 15px;
	width: 40px;
	background: transparent;
	position: absolute;
  
}

.loader-part, .loader-dot {
	animation-duration: 0.8s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
}

.loader-part-1 {
	left: 0;
}

.loader-part-2 {
	left: 25px
}

.loader-dot {
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: #ffffff;
	position: absolute;
}

.loader-dot-1 {
	left: 0px;  
}

.loader-dot-2 {
	right: 0px;
}

@keyframes loader-spin {
	0% { transform: rotate(0deg) }
	50% { transform: rotate(180deg) }
	100% { transform: rotate(180deg) }
}

@keyframes loader-hide {
	0% { opacity: 0; }
	49% { opacity: 0; }
	50% { opacity: 1; }
	100% { opacity: 1; }
}

.loader-part-1 {
	animation-name: loader-spin;
}

.loader-part-2 {
	animation-name: loader-spin;
	animation-direction: reverse;
}

.loader-part-1 .loader-dot-1 {
	opacity: 0;
	animation-name: loader-hide;
	animation-direction: reverse;
}

.loader-part-2 .loader-dot-2 {
	animation-name: loader-hide;
}

/* END LOADER */

/* FIRST */

#first_wellcome {
	z-index: 6;
}

/* END FIRST */

/* HEADER */

.header {
	width: 100%;
	background: rgba(12, 18, 28, 0.8);
	border-bottom: 1px solid var(--site-glass-border);
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
	box-shadow: 0 18px 40px rgba(5, 9, 16, 0.35);
	position: relative;
	top: 0;
	left: 0;
	z-index: 3;
}

.header-max .header.layout {
    display: grid;
    grid-template-columns: var(--site-chat-width) auto;
    grid-template-rows: var(--site-header-row-top-height) var(--site-header-row-bottom-height);
}

.header-min .header.layout {
	display: grid;
    grid-template-columns: 150px auto;
	grid-template-rows: 50px;
}

.logobg {
	position: absolute;
	left: 0;
	right: 0;
	width: unset;
	z-index: 6;
	width: 18%;
}

.header-max .header-logo {
	width: 100%;
	padding: 5px 10px;
	grid-row-start: 1;
	grid-row-end: span 2;
	display:flex;
	justify-content:center;
	align-items:center;
	height:100px; /* was 80 */
	position: relative;
	z-index: 7;
	/*margin: 15px 0 0;*/
	/* background: var(--site-color-bg-light); */
}

.header-min .header-logo {
	/*width: 100%;*/
	padding: 5px 10px;
}

.header-logo a, .header-logo img {
	/*height: 100%;*/
	/*width: calc(100% - 40px);*/
	/*width: 100%;*/
	transform: translateX(-8px);
}

.header-logo a {
	width: 100%;
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	.header-logo a, .header-logo img {
		width: unset;
		height: 26px;
		margin: 4px 0;
	}
}

.header-menu-bottom .header-menu-button {
	font-size: 12px;
    font-weight: 700;
}

.header-menu-top .header-menu-button {
	font-size: 12px;
    font-weight: 500;
}

.header-menu-center .header-menu-button {
	font-size: 12px;
	font-weight: 500;
	padding: 7px 0;
	float: left;
	width: 100%;
	background: rgba(18, 26, 36, 0.7);
	border: 1px solid var(--site-glass-border);
	backdrop-filter: blur(12px) saturate(130%);
	-webkit-backdrop-filter: blur(12px) saturate(130%);
	overflow: hidden;
	border-radius: .125rem;
	-webkit-transition: background-color .3s;
	transition: background-color .3s;
	margin-bottom: 1px;
	margin-top: 1px;
}

.header-menu-center .header-menu-button .header-side-button {
	font-size: 14px;
	-webkit-align-items: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	height: 30px;
	width: 100%;
	text-align: center;
	display: flex;
	justify-content: center;
}

.sidebar-footer {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
}

.header-menu-button.rewards {
	transform: translateX(-20px);
	width: calc(100% + 40px);
	padding: 9px 20px;
	margin: 0 0 5px;
	background: linear-gradient(90deg, rgba(246, 196, 83, 0.35), rgba(44, 212, 197, 0));
}

.header-side-button {
    cursor: pointer;
    color: rgb(113, 142, 152);
    font-weight: 600;

	/*text-transform: uppercase;*/
}

.header-side-button img,
.header-side-button i {
  /*filter: brightness(0) invert(1);*/
  height: 18px;
  width: 18px;
  /*opacity: .6;*/
  float: left;
  margin: 1px 0;
  margin-top: 1%;
}

.header-side-button i {
	font-size: 18px;
	color: #667b95;
}

.header-side-button .ml-1 {
	float: left;
	line-height: 22px;
	margin-left: 10px;
	
}

.header-side-button.active img{
    filter: unset;
    opacity: 1;
}

.header-side-button.active{
	border-left: 3px solid var(--site-color-main);
	border-radius: 0px 1px 1px 0px;
	opacity: 1;
	width: calc(100% + 42px);
	padding-left: 13px;
	/* margin: 0px 0px -4px -18px; */
	border-width: thin 3px;
	background: linear-gradient(to right, rgba(12, 18, 28, 0), rgba(32, 43, 60, 0.7) 100%);
	/*padding-top: 1%;*/
	padding: 7px 13px;
	background: transparent;
}

.header-side-button:hover img {
    /*filter: unset;*/
}

.header-side-button:hover {
    /*color: var(--site-color-main);*/
    color: #fff;
}

.header .header-panel {
    /*height: calc(100% - 20px);*/
}

.header-panel img {
	height: calc(100% - 6px);
}

.header .online {
	display: flex;
	margin-left: auto;
	padding: 0 30px;
}

.header .online div {
  border-radius: 50%;
  height: 10px;
  width: 10px;
  transform: scale(1);
  background: var(--site-color-main);
  box-shadow: 0 0 0 0 rgba(44, 212, 197, 0.6);
  animation: pulse-green 2s infinite;
  margin: 9px 5px 0;
  float: left;
}

.header .online p {
	float: left;
	line-height: 30px;
	height: 30px;
	margin: 0;
	font-size: 12px;
	color: var(--site-color-main-light);
	font-weight: 600;
}

.header .balance-box {
	/*background: var(--site-color-bg-dark);*/
	background: rgba(15, 22, 34, 0.7);
	padding: 0 15px;
	height: 40px;
	border-radius: 6px;
	font-weight: 600;
	border: 1px solid var(--site-glass-border);
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);

}

.progress-circle {
  position: relative;
  padding: 0;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  line-height: var(--size);
}

/* Text inside the control */

.left-half-clipper {
  /* a round circle */
  border-radius: 50%;
  width: var(--size);
  height: var(--size);
  position: absolute;
  /* needed for clipping */
  clip: rect(0, var(--size), var(--size), calc( var(--size) / 2 ));
  /* clips the whole left half*/
}


/* when p>50, don't clip left half*/
.progress-circle[data-progress="0"] {
	display: none;
}

.progress-circle[data-isover50="true"] .left-half-clipper {
  clip: rect(auto, auto, auto, auto);
}

.value-bar {
  /*This is an overlayed square, that is made round with the border radius,
   then it is cut to display only the left half, then rotated clockwise
   to escape the outer clipping path.*/
  position: absolute;
  /*needed for clipping*/
  clip: rect(0, calc( var(--size) / 2 ), var(--size), 0);
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  border: 2px solid var(--color);
  /*The border is 0.35 but making it larger removes visual artifacts */
  /*background-color: #4D642D;*/
  /* for debug */
  box-sizing: border-box;
}


/* Progress bar filling the whole right half for values above 50% */

.progress-circle[data-isover50="true"] .first50-bar {
  /*Progress bar for the first 50%, filling the whole right half*/
  position: absolute;
  /*needed for clipping*/
  clip: rect(0, var(--size), var(--size), calc( var(--size) / 2 ));
  background-color: var(--color);
  border-radius: 50%;
  width: var(--size);
  height: var(--size);
  display: none;
}

/*.progress-circle:not(.over50) .first50-bar {
  display: none;
}*/

/*.progress-circle.p0 .value-bar {
  display: none;
}*/

.progress-circle .value-bar {
  transform: rotate( calc(var(--progress) * 3.60deg) );
  display: none;
}

.wissman-gradient {
	float: left;
	position: relative;
	margin: 13px 60px 0 20px;
}

.wissman-gradient p {
	margin: 0;
	font-size: 12px;
	width: 100px;
	text-align: center;
	font-weight: 600;
}

.wissman-gradient .g {
	height: 7px;
	width: 100px;
	border-radius: 10px;
	border: 1px solid #2e4952;
}

.wissman-gradient .g div {
	float: left;
	height: 7px;
	border-radius: 10px;
	background: linear-gradient(90deg, #2c8c30 -20%, rgb(72 162 28) 100%);
}

.wissman-gradient img {
	/*display: none;*/
	height: 26px;
	position: absolute;
	top: 3px;
	right: -11px;
	width: 32%;
}

.user-av .drp {
	position: absolute;
	right: 0;
	bottom: -110px;
	background: var(--site-color-bg-body);
	box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
	padding: 10px 0;
	border-radius: 8px;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 300ms, transform 300ms;
	pointer-events: none;
}

.user-av .drp[data-active="true"] {
	opacity: 1;
	transform: translateY(0);
	pointer-events: all;
}

.user-av .drp div {
	padding: 5px 25px;
	color: #9ab0cd;
	font-size: 14px;
	text-align: center;
}

.user-av .drp div:hover {
	cursor: pointer;
	background: var(--site-color-bg-dark);
	color: #fff;
}

.user-dropdown {
	line-height: 50px !important;
	color: #5f7693;
	font-size: 16px;
	margin-left: -20px;
}

.user-dropdown:hover {
	opacity: .8;
	cursor: pointer;
}

.user-av .progress-circle {
	position: absolute;
	left: -2px;
	bottom: 6px;
	top: 6px;
}

.user-av {
	position: relative;
	margin: 0 20px;
}

.user-av .ml-2 {
	float: left;
	/*line-height: 50px;*/
	/*height: 50px;*/
	margin: 7px 0 0 10px;
}

.user-av .ml-2 p {
	margin: 0;
	float: left;
	width: 100%;
}

.user-av .ml-2 p.name {
	font-weight: 600;
	margin: 0 0 -4px;
}

.user-av .ml-2 p.level {
	font-size: 12px;
	font-weight: 600;
	color: var(--site-color-main);
}

.header .balance-box div i {
	color: var(--site-color-warning);
	margin: 4px 4px 0 0;
	float: left;
}

.header .balance-box .balance,
.header .balance-box .balance-hidden {
	float: left;
	line-height: 22px;
}

.header .balance-box a {
	float: left;
	/* background: var(--site-color-main); */
	width: 28px;
	height: 28px;
	text-align: center;
	border-radius: 4px;
	margin: 6px 0 0 12px;
	transition: transform 300ms, opacity 300ms;
	position: relative;
	display: flex;
	-webkit-box-align: center;
	/* align-items: center; */
	-webkit-box-pack: center;
	justify-content: center;
	border-radius: 3px;
	padding: 0px 14px;
	transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
	border-width: 0px 0px 2px;
	border-top-style: initial;
	border-right-style: initial;
	border-left-style: initial;
	border-image: initial;
	border-bottom-style: solid;
	font-family: var(--site-font-body);
	font-weight: 700;
	color: #0b1118;
	font-size: 14px;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	/* background-color: rgb(51, 193, 108); */
	border-color: rgba(255, 255, 255, 0.14);
	background-image: linear-gradient(135deg, rgba(44, 212, 197, 0.95), rgba(246, 196, 83, 0.95));
	box-shadow: 0 12px 26px rgba(44, 212, 197, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.header .balance-box a:hover {
	transform: translateY(-2px);
}

.header .balance-box i.fa-plus {
	font-size: 12px;
	margin: 9px 0 0;
}

.big-menu {
	background: rgba(12, 18, 28, 0.75);
	border-top: 1px solid var(--site-glass-border);
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
	margin-left: -10px;
}

.big-menu a.big-link {
	display: inline-block;
	font-size: 16px;
	font-weight: 600;
	/*margin: 0 20px 0 0;*/
	padding: 0 10px;
	opacity: .6;
	position: relative;
	line-height: 50px;
	overflow: hidden;
}

.big-menu a.big-link.active {
	opacity: 1;
}

.big-menu a.big-link:hover {
	/*opacity: .6 !important;*/
	color: #a3bcdb !important;
}

.big-menu a.big-link.active:after {
	/*width: 100%;*/
	height: 2px;
	background: linear-gradient(
90deg, #2c8c30 0%, #4aa31a 49.26%, rgba(11, 104, 192, 0) 100%, #33c16c 100%);
	/*box-shadow: 0px 0px 20px #0B68C0;*/
	content: ' ';
	position: absolute;
	left: -10px;
	right: -10px;
	bottom: 0;
}

.small-menu,
.big-menu {
	padding: 0 0 0 100px;
}

.small-menu .header-menu-button {
	opacity: .7;
	line-height: 30px;
}

.small-menu .header-menu-button.active {
	opacity: 1;
}

.menu-section-title {
	margin: 30px 0 5px;
	float: left;
	width: 100%;
	font-size: 17px; /* #222d3e */
}

.menu-section-title:hover {
	cursor: pointer;
}

.menu-section-title i {
	margin-left: 5px;
	color: var(--site-color-main);
	transition: opacity 300ms, transform 300ms;
}

.menu-section-title i:hover {
	cursor: pointer;
	opacity: .8;
}

.section-menu[data-hidden="true"] .menu-section-title i {
	transform: rotate(180deg);
}

/*.header .online p span {
	color: rgba(60, 161, 215);
	font-weight: 600;
}*/

@keyframes pulse-green {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(60, 161, 215, 0.7);
  }
  
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(60, 161, 215, 0);
  }
  
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(60, 161, 215, 0);
  }
}

.wrapper-page {
    overflow: visible;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
}

.login-icon {
	height: 100% !important;
	margin: 2px;
}

.level-bar {
	font-size: 10px;
}

.level-bar .progress-content {
	font-size: 8px;
}

.level-bar .progress-container {
	height: 10px;
	width: 150px;
}

/* END HEADER */

/* TOAST */
.toast {
	background-color: var(--site-color-bg-body) !important;
	opacity: 1 !important;
}

.toast-top-right {
    top: calc(var(--site-header-row-top-height) + var(--site-header-row-bottom-height) + 10px);
	right: 10px;
}

.toast-close-button {
	right: 0;
	top: 0;
}

.toast-progress{
	background-color: var(--main-text-color-light);
	opacity: 1;
}

#toast-container>div, #toast-container:hover>div{
	-webkit-border-radius: 0px;
    border-radius: 0px;
	-webkit-box-shadow: none;
    box-shadow: none;
	opacity: 0.9;
}

.toast-success {
    background-color: var(--site-color-bg-light);
    border-left: 5px solid var(--site-color-success);
}

.toast-error {
	background-color: var(--site-color-bg-light);
	border-left: 5px solid var(--site-color-danger);
}

.toast-info {
	background-color: var(--site-color-bg-light);
	border-left: 5px solid var(--site-color-info);
}

.toast-warning {
	background-color: var(--site-color-bg-light);
	border-left: 5px solid var(--site-color-warning);
}

@media (min-width: 241px) and (max-width: 768px) {
	#toast-container>div {
		width: 100%;
	}

	.toast-top-right {
		right: 20px !important;
		left: 20px !important;
		top: unset;
		bottom: 20px;
	}
}

/* END TOAST */

/* TABLE */

.table-container {
	display: block;
	border: solid 2px var(--site-color-bg-dark);
    border-radius: 0.5rem;
    overflow: hidden;
    /*padding: 0 20px;*/
}

.table-header, .table-body, .table-footer {
	display: block;
}

.table-header .table-row, .table-footer .table-row {
	background: var(--site-color-bg-dark);
	font-weight: 500;
}

.table-body .table-row {
	background: var(--site-color-bg-light);
	font-weight: 400;
}

.table-content {
	position: relative;
    width: 100%;
    height: 100%;
}

.table-row {
	gap: 5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	align-items: center;
	border-bottom: solid 2px var(--site-color-bg-dark);
}

.table-column {
	display: inline-block;
	text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.table-body .table-row .table-column:first-child { padding: 10px 0px 10px 10px; }
.table-body .table-row .table-column:last-child { padding: 10px 10px 10px 0px; }

.table-header .table-row .table-column:first-child, .table-footer .table-row .table-column:first-child { padding: 18px 0px 18px 10px; }
.table-header .table-row .table-column:last-child, .table-footer .table-row .table-column:last-child { padding: 18px 10px 18px 0px; }

/* .table-column:after { content: "."; clear: both; display: block; visibility: hidden; height: 0; } */

.table-row .table-column:first-child:nth-last-child(1), .table-row .table-column:first-child:nth-last-child(1) ~ .table-column { width: calc(100% / 1); }
.table-row .table-column:first-child:nth-last-child(2), .table-row .table-column:first-child:nth-last-child(2) ~ .table-column { width: calc(100% / 2); }
.table-row .table-column:first-child:nth-last-child(3), .table-row .table-column:first-child:nth-last-child(3) ~ .table-column { width: calc(100% / 3); }
.table-row .table-column:first-child:nth-last-child(4), .table-row .table-column:first-child:nth-last-child(4) ~ .table-column { width: calc(100% / 4); }
.table-row .table-column:first-child:nth-last-child(5), .table-row .table-column:first-child:nth-last-child(5) ~ .table-column { width: calc(100% / 5); }
.table-row .table-column:first-child:nth-last-child(6), .table-row .table-column:first-child:nth-last-child(6) ~ .table-column { width: calc(100% / 6); }
.table-row .table-column:first-child:nth-last-child(7), .table-row .table-column:first-child:nth-last-child(7) ~ .table-column { width: calc(100% / 7); }
.table-row .table-column:first-child:nth-last-child(8), .table-row .table-column:first-child:nth-last-child(8) ~ .table-column { width: calc(100% / 8); }
.table-row .table-column:first-child:nth-last-child(9), .table-row .table-column:first-child:nth-last-child(9) ~ .table-column { width: calc(100% / 9); }
.table-row .table-column:first-child:nth-last-child(10), .table-row .table-column:first-child:nth-last-child(10) ~ .table-column { width: calc(100% / 10); }

body! a:hover{
   background: red !important;
}

/* END TABLE */

/* LOGIN */
.login-button {
	padding: 7px 40px !important;
	margin: 0 10px !important;
	text-transform: uppercase;
}

.social-login {
	height: 50px;
	width: 50px;
}

.social-login:after {
	display: block;
    content: "";
    height: 30px;
    width: 30px;
}

.social-login.google { background: var(--site-color-google); }
.social-login.google:after {
	background: url(../img/social/google_icon.png) no-repeat 50% 50%;
    background-size: contain;
}

.social-login.facebook { background: var(--site-color-facebook); }
.social-login.facebook:after {
	background: url(../img/social/facebook_icon.png) no-repeat 50% 50%;
    background-size: contain;
}

.social-login.steam { background: var(--site-color-steam); }
.social-login.steam:after {
	background: url(../img/social/steam_icon.png) no-repeat 50% 50%;
    background-size: contain;
}

.social-login.twitter { background: var(--site-color-twitter); }
.social-login.twitter:after {
	background: url(../img/social/twitter_icon.png) no-repeat 50% 50%;
    background-size: contain;
}

/* END LOGIN */

/* FIELDS */

.input_field, .dropdown_field, .switch_field, .slider_field {
	position: relative;
    background-color: var(--site-color-bg-light);
    padding: 4px 8px;
    border-radius: 0.5rem;
    border: 2px solid var(--site-color-bg-dark);
	/*min-width: 350px;*/
	margin: 10px 0px;
    display: inline-block;
}

.input_field, .dropdown_field, .slider_field {
	width: 100%;
}

.dropdown_field{
	cursor: pointer;
	text-align: -webkit-left;
    text-align: -moz-left;
	text-align: left;
	width: 300px;
}

.dropdown_field .field_element_input{
	display: none;
}

.switch_field .field_element_input{
	display: none;
}

.switch_field .field_switch_bar {
	height: 6px;
	width: 100%;
	background: var(--site-color-danger);
	position: relative;
    display: flex;
	align-items: center;
    border-radius: 1rem;
    transition: all 300ms;
	cursor: pointer;
}

.switch_field .field_switch_bar:before {
	content: "";
    width: 16px;
    height: 16px;
    background: var(--site-color-white);
    position: absolute;
    left: 0px;
    border-radius: 50%;
    transition: all 300ms;
}

.field_element_input:checked + .field_switch .field_switch_bar {
	background: var(--site-color-success);
}

.field_element_input:checked + .field_switch .field_switch_bar:before {
	left: calc(100% - 16px);
}

.field_element_dropdowns{
	left: 0;
    right: 0;
	width: 100%;
	position: absolute;
	border: 2px solid var(--site-color-bg-dark);
	border-radius: 5px;
    background: var(--site-color-bg-light);
    z-index: 3;
	display: none;
	text-align: -webkit-left;
    text-align: -moz-left;
	text-align: left;
}

textarea.field_element_input {
	resize: none;
}

.slider_field .field_element_input {
    height: 6px;
	margin: 10px 0;
    background-color: var(--site-color-danger);
    background-image: linear-gradient(var(--site-color-success), var(--site-color-success));
    background-size: 50% 100%;
    background-repeat: no-repeat;
    border-radius: 10px;
    cursor: pointer;
    -webkit-appearance: none;
}

.slider_field .field_element_input::-webkit-slider-runnable-track {
    box-shadow: none;
    border: none;
    background: transparent;
    -webkit-appearance: none;
}

.slider_field .field_element_input::-moz-range-track {
    box-shadow: none;
    border: none;
    background: transparent;
}

.slider_field .field_element_input::-webkit-slider-thumb {
    width: 16px;
    height: 16px;
    /*background: var(--site-color-white);*/
    background: #fff;
    width: 2px;
    border-radius: 50%;
    -webkit-appearance: none;
}

.slider_field .field_cursor_content {
	height: 0;
	position: relative;
	margin: 0 8px;
}

.slider_field .field_cursor {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	position: absolute;
    width: 0;
    z-index: 2;
    bottom: 0;
}

.slider_field .field_cursor_text {
	position: absolute;
	top: 0;
	background: var(--site-color-bg-light);
	padding: 5px;
	border-radius: 5px;
}

.field_element_dropdowns.active{
	display: unset !important;
}

.field_caret{
	font-size: 16px;
	padding: 0 10px;
	height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
}
	
.field_element_dropdown{
	font-size: 14px;
    letter-spacing: 1px;
	color: #ffffffb3;
	padding: 10px;

}

.field_element_dropdown.active, .field_element_dropdown:hover{
	background-color: #c0c0c41a;
}

.field_content{
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    min-width: 100px;
	-webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.field_extra {
	display: inline-block;
    align-items: center;
    float: right;
}

.field_label {
	position: absolute;
	background-color: var(--site-color-bg-light);
    padding: 3px;
    border-radius: 5px;
	z-index: 0;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
	font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
	
	-webkit-transition: top 500ms, font-size 500ms;
	-moz-transition: top 500ms, font-size 500ms;
	transition: top 500ms, font-size 500ms;
}

.field_label.active {
    top: -5px;
    font-size: 10px;
}

.field_element_input, .field_dropdown, .field_switch {
	z-index: 1;
	position: relative;
	width: 100%;
	font-size: 14px;
    letter-spacing: 1px;
	color: #ffffffb3;
	text-align: -webkit-left;
    text-align: -moz-left;
	text-align: left;
}



.input_field .field_element_input, .field_dropdown, .field_switch {
	/*background: transparent !important;*/
	/*padding: 5px 10px;*/
	background: #00000073 !important;
    padding: 10px 10px;
    border-radius: 5px;
}

.transparent {
	background: transparent !important;
	padding: 10px 10px;
    border-radius: 5px;
}

.field_bottom{
	position: absolute;
    bottom: -5px;
    left: 0;
    right: 0;
    padding: 0px 4px;
    height: 0px;
    line-height: 1;
    word-break: break-all;
    z-index: 1;
    text-align: -webkit-left;
    text-align: -moz-left;
    text-align: left;
    font-size: 12px;
	color: var(--site-color-white);
}

.field_error:not(.active){
	display: none;
}

.field_error{
	word-break: break-word;
}

.field_container{
	width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.input_coins {
	-webkit-transition: 500ms all;
    -moz-transition: 500ms all;
    transition: 500ms all;
}

.field_label.active .input_coins {
	height: 10px;
    width: 10px;
}

/* END FIELDS */

/* MODAL */
#modal_auth .field_label,
#modal_auth .bet_input_field {
	background: var(--site-color-bg-light);
}

#modal_auth .bet_input_field {
	margin: 20px 0;
}

#modal_auth .field_bottom {
	padding: 0;
	bottom: -12px;
}

#modal_auth .switch_content {
	float: left;
}

#modal_auth .switch_content {
	/*width: calc(100% - 300px);*/
	width: 100%;
	padding: 25px;
	/*width: 100%;*/
	float: left;
	transform: translateY(-20px);
	border-radius: 15px;
	/*background: var(--site-color-bg-dark);*/
	/* background: #050e1a; */
}

#modal_auth .modal-body {
	position: relative;
	padding: 0 !important;
}

#modal_auth .login_thing {
	/*width: 400px;*/
	/*float: left;*/
	position: absolute;
	top: -20px;
	bottom: 0;
	right: -80px;
	/*display: none;*/
}

#modal_auth .login_thing2 {
	width: 350px;
	float: left;
	visibility: hidden;
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	#modal_auth .login_thing {
		display: none;
	}

	#modal_auth .switch_content {
		width: 100%;
		padding: 10px;
	}

	#modal_auth .modal-body {
		/*width: calc(100% - 40px);*/
		/*margin: 0 20px;*/
	}

	.modal .modal-content {
		max-width: calc(100% - 40px);
		margin: 0 20px;
	}

	.sa-btns a,
	.cl-btns button {
		width: 100% !important;
		margin: 0 0 10px !important;
	}

	.form_auth {
		margin: 45px 0 0 !important;
	}
}

.width25 {
	width: 25% !important;
}

.lgn {
	width: 100%;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}

.sa-btns,
.cl-btns {
	width: 100%;
	float: left;
}

.sa-btns a {
	/*box-shadow: 0px 0px 15px rgba(0, 132, 255, 0.4);*/
	border-radius: 6px;
	height: 40px;
	line-height: 40px;
	/*padding: 0 25px;*/
	font-size: 14px;
	font-weight: 600;
	display: block;
	float: left;
	margin: 0 20px 0 0;
	transition: transform 300ms, opacity 300ms;
	text-align: center;
	width: calc(50% - 0px - 10px);
}

.sa-btns a:hover,
.cl-btns button:hover {
	cursor: pointer;
	opacity: .8;
	transform: translateY(-3px);
}

.sa-btns a i {
	margin: 0 4px 0 0;
}

.sa-btns a span {
	opacity: .9;
}

.sa-btns a[data-type="steam"] {
	background: linear-gradient(92.68deg, #0478E4 0.45%, #05187A 100%);
	box-shadow: 0px 0px 15px #0084ff4d;
}

.sa-btns a[data-type="google"] {
	background: linear-gradient(92.68deg, #B6304D 0.45%, #080831 100%);
	box-shadow: 0px 0px 15px #84265c40;
}

.cl-btns button {
	display: block;
	float: left;
	height: 40px;
	line-height: 40px;
	font-size: 14px;
	font-weight: 600;
	margin: 0 20px 0 0;
	transition: transform 300ms, opacity 300ms;
	text-align: center;
	width: calc(50% - 0px - 10px);
	border-radius: 6px;
}

.cl-btns button.login {
	display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    border-radius: 3px;
    padding: 0px 14px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
    border-width: 0px 0px 2px;
    border-top-style: initial;
    border-right-style: initial;
    border-left-style: initial;
    border-image: initial;
    border-bottom-style: solid;
    /* font-family: "Proxima Nova", sans-serif; */
    font-weight: 200;
    color: rgb(255, 255, 255);
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    background-color: rgb(51, 193, 108);
    border-color: rgb(41, 149, 84);
    box-shadow: rgb(51 193 108 / 15%) 0px 4px 4px;
}

.cl-btns button.register {
	background: linear-gradient(92.68deg, #772046 0.45%, #B33BAB 100%);
}

.cl-btns {
	margin: 20px 0 0;
}

.form_auth .ftr {
	/*background: var(--site-color-bg-dark);*/
	background: #101924;
	float: left;
	width: calc(100% + 50px);
	text-align: center;
	margin: 30px -25px -40px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	padding: 10px 0;
}

.form_auth .ftr a {
	width: 34px;
	height: 34px;
	line-height: 34px;
	border-radius: 50%;
	float: left;
	margin: 0 6px;
}

.form_auth .ftr a[data-type="google"] {
	background: #FA455E;
}

.form_auth .ftr a[data-type="steam"] {
	background: #26282D;
}

.form_auth .ftr a i,
.form_auth .ftr a svg {
	font-size: 16px;
	margin: 9px 0;
	height: 16px;
}

.form_auth .ftr p {
	margin: 0 0 8px;
	color: #8f9bad;
}

.form_auth {
	width: 100%;
	float: left;
	/*margin: 85px 0 0;*/
}

.form_auth label {
	width: 100%;
	float: left;
	color: #8f9bad;
	font-size: 14px;
	font-weight: 600;
}

.form_auth input {
	width: 100%;
	float: left;
	outline: 0;
	border: 0;
	/*background: var(--site-color-bg-light);*/
	background: #101924;
	border-radius: 6px;
	padding: 10px;
	margin: 7px 0;
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1051;
    transition: trasform 300ms, opacity 300ms;
}

.modal:not(.active) {
	/*opacity: 0;*/
	/*pointer-events: none;*/
	display: none;
	/*opacity: 0 !important;
	pointer-events: none;
  transform: translateY(-100px) !important;*/
}

#modal_auth {
	opacity: 0;
	transform: translateY(-100px);
}

#modal_auth.active {
	opacity: 1;
	transform: translateY(0);
}

.modal .modal-dialog {
	background: #00000082;
	width: 100%;
  height: 100%;
}

.modal .modal-content {
	overflow: hidden;
    display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
	max-height: 80%;
	min-width: 350px;
	max-width: 100%;
	background: var(--site-glass-bg-strong);
	border: 1px solid var(--site-glass-border);
	-webkit-box-shadow: 0 24px 60px rgba(4, 9, 16, 0.55);
    box-shadow: 0 24px 60px rgba(4, 9, 16, 0.55);
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
	border-radius: 16px;
}

.modal.small .modal-content {
	width: 350px;
}

.modal.medium .modal-content {
	width: 600px;
}

.modal.large .modal-content {
	width: 1000px;
}

.modal .modal-header {
    padding: 15px;
    padding-bottom: 0px;
	color: var(--main-text-color);
}

.modal .modal-title {
	font-size: 16px;
	font-weight: 500;
}

.modal .modal-close {
    padding: 1px;
    width: 22px;
    height: 22px;
    background: rgba(12, 18, 28, 0.7);
	border: 1px solid var(--site-glass-border);
    font-size: 16px;
    cursor: pointer !important;
}

.modal .modal-body {
	overflow: hidden;
    display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
	padding: 15px;
	height: 100%;
}

.modal .modal-footer {
	padding: 15px;
}

/* END MODAL */
@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	.faqs,
	.faq-grid {
		width: 100% !important;
		margin: 0 0 20px !important;
	}
}
.faqs {
	float: left;
	display: block;
	width: 180px;
}

.faqs a {
	float: left;
	width: 100%;
	display: block;
	text-align: left;
	padding: 8px 10px;
	border-radius: 6px;
	font-weight: 600;
	color: #8f9bad !important;
}

.faqs a:hover {
	/*opacity: .8;*/
	color: #fff !important;
}

.faqs a.active {
	color: #fff !important;
	background: var(--site-color-bg-dark);
	border-left: 3px solid var(--site-color-main);
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.faq-grid {
	float: left;
	margin-left: 20px;
	width: calc(100% - 200px);
	text-align: left;
}

.faq-grid ol,
.faq-grid ul {
	padding: 0;
	margin: 0 0 0 14px;
}

.faq-grid li {
	color: #8f9bad;
	margin: 5px;
}

.faq-guide-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:16px 0 24px}.faq-guide-directory>a{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:11px 12px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:linear-gradient(145deg,rgba(31,23,43,.78),rgba(13,10,20,.82));color:#ddd!important;transition:border-color .18s,background .18s}.faq-guide-directory>a:hover{border-color:rgba(167,139,250,.32);background:rgba(124,58,237,.09)}.faq-guide-directory>a>i{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:rgba(139,92,246,.13);color:#b794f4}.faq-guide-directory span,.faq-guide-directory strong,.faq-guide-directory small{display:block}.faq-guide-directory strong{font-size:11px}.faq-guide-directory small{margin-top:3px;color:#81798b;font-size:8px}.faq-guide-directory a>b{color:#9c75d0;font-size:8px;text-transform:uppercase;white-space:nowrap}.faq-guide-directory a>b i{margin-left:4px}
.game-guide-page{width:min(1180px,calc(100% - 34px));margin:0 auto;padding:25px 0 50px;text-align:left}.game-guide-breadcrumbs{display:flex;align-items:center;gap:8px;margin-bottom:13px;color:#736b7d;font-size:9px}.game-guide-breadcrumbs a{color:#9b7ac4}.game-guide-hero{display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:18px;padding:25px;border:1px solid rgba(167,139,250,.18);border-radius:19px;background:radial-gradient(circle at 88% 0,rgba(124,58,237,.19),transparent 36%),linear-gradient(145deg,rgba(29,20,42,.96),rgba(13,10,21,.98));box-shadow:0 18px 48px rgba(5,2,12,.24)}.game-guide-icon{width:64px;height:64px;display:grid;place-items:center;border:1px solid rgba(245,196,82,.22);border-radius:18px;background:linear-gradient(145deg,rgba(245,158,11,.17),rgba(124,58,237,.16));color:#f1cb66;font-size:25px}.game-guide-hero>div:nth-child(2)>span{color:#ae7bec;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.game-guide-hero h1{margin:5px 0 7px;color:#fff;font-size:clamp(25px,3vw,38px);line-height:1.08}.game-guide-hero p{max-width:650px;margin:0;color:#a39aaa;font-size:12px;line-height:1.6}.game-guide-rtp{min-width:190px;padding:13px 15px;border:1px solid rgba(74,222,128,.18);border-radius:12px;background:rgba(34,197,94,.055)}.game-guide-rtp small,.game-guide-rtp strong,.game-guide-rtp em{display:block}.game-guide-rtp small{color:#6dd79c;font-size:8px;font-weight:850;text-transform:uppercase}.game-guide-rtp strong{margin:5px 0;color:#d6fae4;font-size:15px}.game-guide-rtp em{max-width:180px;color:#777f7a;font-size:8px;font-style:normal;line-height:1.35}.game-guide-layout{display:grid;grid-template-columns:minmax(0,1fr) 255px;gap:15px;margin-top:15px}.game-guide-content{display:grid;gap:11px}.game-guide-content>section,.game-guide-aside>div{padding:20px;border:1px solid rgba(255,255,255,.065);border-radius:14px;background:linear-gradient(145deg,rgba(25,19,34,.86),rgba(13,10,19,.9))}.game-guide-content h2{margin:0 0 10px;color:#ece6f2;font-size:17px}.game-guide-content p,.game-guide-content li{color:#938b9b;font-size:11px;line-height:1.72}.game-guide-content p{margin:0}.game-guide-content ol{display:grid;gap:7px;margin:0;padding-left:20px}.game-guide-content a{color:#b88af1}.game-guide-warning{display:flex;gap:9px;margin-top:13px;padding:10px;border-radius:9px;background:rgba(245,158,11,.07);color:#bca776;font-size:9px;line-height:1.5}.game-guide-warning i{margin-top:2px;color:#e7b94d}.game-guide-faq details{padding:11px 0;border-bottom:1px solid rgba(255,255,255,.055)}.game-guide-faq details:last-child{border-bottom:0}.game-guide-faq summary{color:#d6cedd;font-size:11px;font-weight:750;cursor:pointer}.game-guide-faq details p{margin-top:8px}.game-guide-aside{display:grid;align-content:start;gap:11px}.game-guide-play{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:11px;background:linear-gradient(135deg,#8b4dde,#6630b1);color:#fff!important;font-size:11px;font-weight:800}.game-guide-aside h3{margin:0 0 10px;color:#ddd5e4;font-size:12px}.game-guide-aside>div span,.game-guide-aside>div a{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05);color:#8b8293;font-size:9px}.game-guide-aside>div span:last-child,.game-guide-aside>div a:last-child{border:0}.game-guide-aside>div b{color:#b7aebf}
@media(max-width:760px){.faq-guide-directory{grid-template-columns:1fr}.game-guide-page{width:min(100% - 20px,1180px);padding-top:13px}.game-guide-hero{grid-template-columns:50px 1fr;padding:16px;gap:12px}.game-guide-icon{width:50px;height:50px;border-radius:14px;font-size:20px}.game-guide-rtp{grid-column:1/-1;width:100%;box-sizing:border-box}.game-guide-layout{grid-template-columns:1fr}.game-guide-aside{grid-row:1}.game-guide-aside>div:last-child{display:none}.game-guide-content>section{padding:16px}}

.title-page2 {
	text-align: left;
	font-weight: 600;
	font-size: 16px;
	color: var(--site-color-main);
}

.ff {
	line-height: 2em;
	color: #8f9bad;
}

.pf-container {
	width: 100%;
	float: left;
	display: grid;
	grid-template-columns: 1fr;
	grid-gap: 40px;
}

.pf-container .cntner {
	width: 100%;
	float: left;
	background: var(--site-color-bg-light);
	border-radius: 6px;
	padding: 15px;
	max-width: 100%;
}

.pf-container .cntner div {
	white-space: pre-wrap;
	word-break: break-all;
	width: 100%;
}

.pf-container .cntner .title2 {
	background: var(--site-color-bg-dark);
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	padding: 10px 15px;
	font-weight: 600;
	float: left;
	width: calc(100% + 30px);
	transform: translate(-15px, -15px);
	color: #8f9bad;
}

.pf-container .cntner .title2 p {
	float: left;
	margin: 0;
}

.pf-container .cntner .title2 a {
	float: right;
	font-size: 12px;
	line-height: 21px;
	color: var(--site-color-main) !important;
}

.pf-container .cntner .title2 a i {
	margin-left: 5px;
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	.pf-container {
		display: block;
	}

	.pf-container .cntner {
		margin: 0 0 20px;
	}
}

/* CHAT */
.rain_panel {
	background: var(--site-color-bg-body);
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	z-index: 30;
}

.rain-mini-event { position:fixed; z-index:10020; width:118px; height:92px; transition:opacity .2s ease,transform .2s ease; }
.rain-mini-event.hidden { display:none !important; }
.rain-catch-button { position:relative; width:118px; min-height:86px; padding:12px 8px 9px; overflow:hidden; color:#fff; border:1px solid rgba(250,204,21,.65); border-radius:22px; background:linear-gradient(145deg,#6d3cff,#2c176a); box-shadow:0 14px 38px rgba(17,8,45,.55),0 0 22px rgba(139,92,246,.45); cursor:pointer; animation:rainFloat 1.8s ease-in-out infinite; }
.rain-catch-button i { display:block; position:relative; color:#facc15; font-size:25px; text-shadow:0 0 14px rgba(250,204,21,.7); }
.rain-catch-button strong,.rain-catch-button small { display:block; position:relative; }
.rain-catch-button strong { margin-top:5px; font-size:13px; letter-spacing:.02em; }
.rain-catch-button small { margin-top:2px; color:#ddd6fe; font-size:10px; }
.rain-event-glow { position:absolute; inset:-30%; border-radius:50%; background:conic-gradient(transparent,rgba(250,204,21,.28),transparent 40%); animation:rainSpin 2.8s linear infinite; }
.rain-mini-event.is-caught .rain-catch-button { border-color:#4ade80; background:linear-gradient(145deg,#166534,#14532d); animation:none; transform:scale(.94); }
@keyframes rainFloat { 0%,100%{transform:translateY(0) rotate(-2deg)} 50%{transform:translateY(-8px) rotate(2deg)} }
@keyframes rainSpin { to{transform:rotate(360deg)} }
@media (prefers-reduced-motion:reduce){.rain-catch-button,.rain-event-glow{animation:none}}

.rain_panel i.fa {
	font-size: 20px;
	float: left;
	color: var(--site-color-main);
	margin: 2px 0;
}

.rain_panel .rain-title {
	float: left;
	/*line-height: 20px;*/
	margin: 0 0 0 10px;
	font-weight: 600;
	font-size: 16px;
}

.rain_panel .font-8 {
	font-size: 14px;
	width: 100%;
	float: left;
	opacity: .8;
	margin: 5px 0 0;
}


.rain_panel .rainJoin #join_rain {
	width: 100%;
	margin: 15px 0 0;
	padding: 8px 0;
}

#chat_message_commands:hover {
	color: var(--site-color-main-light);
}

.slider {
    position: absolute;
    z-index: 1;
    font-size: 20px;
    width: 50px;
    background: var(--site-color-main-transparent);
    border-bottom: 2px solid var(--site-color-main);
    border-top: 2px solid var(--site-color-main);
    cursor: pointer;
    transition: right 300ms linear, width 300ms;
}

.slider.slider-top{
	top: 100px;
}

.slider.slider-bottom{
	bottom: 10px;
}

.slider.slider-left{
	border-right: 2px solid var(--site-color-main);
	border-radius: 0 25% 25% 0;
	left: 0;
}

.slider.slider-left i{
	margin-left: auto;
}

.slider.slider-right{
	border-left: 2px solid var(--site-color-main);
	border-radius: 25% 0 0 25%;
	right: 0;
	border: 0;
	/* background: #25363c; */
}

.slider.slider-right i{
	margin-right: auto;
}

.slider:hover{
	width: 60px;
}

.pullout_view[data-isvisible="false"] {
	right: 0;
	top: 100px;
	position: fixed;
}

.pullout_view[data-isvisible="true"] {
	right: 300px;
	top: 100px;
	position: fixed;
}

.emojis-content img {
	height: 20px;
	margin: 3px;
	cursor: pointer;
}

.emojis-content div {
	background: transparent;
}

.emojis-content.all-emojis {
    padding: 10px;
    border: 1px solid rgba(139, 92, 246, .22);
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(109, 74, 255, .12), rgba(255,255,255,.025));
}

.emojis-content.all-emojis img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    padding: 3px;
    border-radius: 9px;
    transition: transform .15s ease, background .15s ease;
}

.emojis-content.all-emojis img:hover {
    transform: translateY(-2px) scale(1.08);
    background: rgba(255,255,255,.08);
}
@keyframes chatBadgeGlow { 0%,100%{filter:drop-shadow(0 2px 5px rgba(0,0,0,.35)) brightness(1) saturate(1)} 50%{filter:drop-shadow(0 0 7px rgba(167,139,250,.5)) brightness(1.18) saturate(1.15)} }

.avatar-field .level {
	display: none;
}

.flag {
	height: 30px;
    cursor: pointer;
    border: 2px solid transparent;
}

.flag img {
	height: calc(100% - 10px);
}

.flag.active, .flag:hover {
	border-color: var(--site-color-bg-light);
    background: var(--site-color-main-transparent);
}

.lang-select {
	float: left;
	width: 100%;
	position: relative;
	padding: 0 0 10px;
	margin: 0 0 -10px;
}

.lang-select .selected {
	background: var(--site-color-bg-dark);
	border: 2px solid #222d3e;
	border-radius: 8px;
	padding: 8px;
	position: relative;
	float: left;
	width: 100%;
	transition: opacity 300ms;
}

.lang-select .selected:hover {
	cursor: pointer;
	opacity: .8;
}

.lang-select img {
	height: 15px;
	float: left;
	margin: 3px 7px 3px 0;
	border-radius: 10px;
}

.lang-select p {
	float: left;
	/*line-height: 14px;*/
	margin: 0;
	line-height: 21px;
	font-size: 13px;
}

.lang-select i.drop {
	position: absolute;
	top: 12px;
	right: 15px;
	opacity: .65;
	transition: transform 300ms;
}

.lang-select[data-active="true"] i.drop {
	transform: rotate(180deg);
}

.lang-select .options {
	position: absolute;
	left: 0;
	right: 0;
	top: 51px;
	background: var(--site-color-bg-dark);
	border: 2px solid #222d3e;
	border-radius: 8px;
	z-index: 100;
	padding: 3px 0;
	transform: translateY(-10px);
	opacity: 0;
	pointer-events: none;
	transition: opacity 300ms, transform 300ms;
}

.lang-select[data-active="true"] .options {
	transform: translateY(0);
	opacity: 1;
	pointer-events: all;
}

.lang-select .options .opt {
	width: 100%;
	float: left;
	padding: 7px 15px;
	transition: background 300ms;
	position: relative;
}

.lang-select .options .opt i.check { 
	position: absolute;
	top: 11px;
	right: 15px;
	font-size: 12px;
	color: var(--site-color-main);
	opacity: 0;
	transition: opacity 250ms;
}

.lang-select .options .opt:hover {
	/*background: var(--site-color-bg-light);*/
	background: #222d3e;
	cursor: pointer;
}

.lang-select .options[data-activeroom="0"] .opt i.check[data-roomid="0"] {opacity: 1;}
.lang-select .options[data-activeroom="1"] .opt i.check[data-roomid="1"] {opacity: 1;}
.lang-select .options[data-activeroom="2"] .opt i.check[data-roomid="2"] {opacity: 1;}
.lang-select .options[data-activeroom="3"] .opt i.check[data-roomid="3"] {opacity: 1;}
.lang-select .options[data-activeroom="4"] .opt i.check[data-roomid="4"] {opacity: 1;}

#dice_bet,
#minesweeper_bet,
#minesweeper_cashout {
	background-image: linear-gradient(135deg, rgba(44, 212, 197, 0.95), rgba(246, 196, 83, 0.95));
    border-color: rgba(255, 255, 255, 0.14);
    border-radius: 12px;
    height: 40px;
    line-height: 40px;
    padding: 0;
    width: 100%;
    /* box-shadow: 0 18px 40px rgba(44, 212, 197, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.4); */
    margin: 10px 0 0;
    transition: opacity 300ms, transform 300ms, background 300ms, box-shadow 300ms;
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: 15px;
    top: unset !important;
    width: calc(100% - 30px);
	/*box-shadow: 0px 0px 15px rgba(60, 161, 215, 0.4);*/
}

#dice_bet:hover,
#minesweeper_bet:hover {
	opacity: 1;
}

#dice_bet.disabled,
#minesweeper_bet.disabled,
#minesweeper_cashout.disabled {
	pointer-events: none;
	opacity: .5;
}

#dice_bet.win,
#minesweeper_bet.win,
#minesweeper_cashout.win {
	box-shadow: 0 18px 40px rgba(46, 227, 111, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.4);
	background-image: linear-gradient(135deg, rgba(46, 227, 111, 0.95), rgba(34, 180, 111, 0.95));
}

#dice_bet.lose,
#minesweeper_bet.lose,
#minesweeper_cashout.lose {
	box-shadow: 0 18px 40px rgba(255, 95, 86, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.4);
	background-image: linear-gradient(135deg, rgba(255, 95, 86, 0.95), rgba(214, 54, 71, 0.95));
}

/*.table-container.dice-table * {*/
	/*text-align: center;*/
/*}*/
.lb-table * {
	text-align: center;
}

.lb-table .table-body .table-row img {
	margin-right: 5px;
}

.lb-table .table-body .table-row {
	font-weight: 600;
}

.lb-table .table-body .table-row .rank div {
	width: 60px;
	height: 30px;
	transform: skew(-20deg);
	border: 3px solid var(--site-color-bg-active);
    border-radius: 5px;
    position: relative;
    display: inline-block;
}

.lb-table .table-body .table-row .rank[data-rank="1"] div {
	background: #303029;
	border-color: #C99A17;
}

.lb-table .table-body .table-row .rank[data-rank="2"] div {
	background: #1C202F;
	border-color: #ABC2E3;
}

.lb-table .table-body .table-row .rank[data-rank="3"] div {
	background: #272630;
	border-color: #654E40;
}

.lb-table .table-body .table-row .rank div span {
	transform: skew(20deg);
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	line-height: 24px;
	margin: 0;
	font-weight: 600;
	text-align: center;
}


.lb-table .table-body .table-row .winn div {
	/*margin-top: -10px;*/
	/*font-size: 18px;*/
}

.lb-table .table-body .table-row .winn p {
	font-size: 12px;
	color: #8f9bad;
	margin: -2px 0 0;
}

.lb-table .table-body .table-row .winn p i.fa {
	color: #8f9bad;
}

.lb-table .table-body .table-row .winn i.fa {
	font-size: 14px;
}

.table-container.lb-table .table-body .table-row {
	padding: 5px 0 !important;
}

.dice_historyitem,
.minesweeper_historyitem,
.plinko_historyitem,
.tower_historyitem {
	color: #c2cceb;
	/*font-weight: 600 !important;*/
}

.dice_historyitem .profit,
.minesweeper_historyitem .profit,
.plinko_historyitem .profit,
.tower_historyitem .profit {
	font-weight: 600;
}

.dice_historyitem.isWin .profit,
.minesweeper_historyitem.isWin .profit,
.plinko_historyitem.isWin .profit,
.tower_historyitem.isWin .profit {
	color: #00cf51;
}

.dice_historyitem.isLose .profit,
.minesweeper_historyitem.isLose .profit,
.plinko_historyitem.isLose .profit,
.tower_historyitem.isLose .profit {
	color: #ff3030;
}
/* END HOME */

/* DEPOSIT / WITHDRAW */
.dp-title {
	width: 100%;
	float: left;
	margin: 20px 0 10px;
	/*opacity: .8;*/
}

.options-container-grid {
	width: 100%;
	float: left;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 20px;
}

.options-container {
	text-align: left;
	float: left;
	width: 100%;
	display: inline-flex;
}

@keyframes card-in {
	from { opacity: 0; transform: translateY(10px) scale(0.98); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

.options-container .option {
	float: left;
	background: var(--site-glass-bg);
	border-radius: 14px;
	padding: 10px 15px;
	width: 100%;
	/* margin: 0 15px 15px 0; */
	transition: opacity 300ms, transform 300ms, box-shadow 300ms;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	border: 1px solid var(--site-glass-border);
	box-shadow: var(--site-glass-shadow);
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
	animation: card-in 520ms ease both;
}

.options-container .option:nth-child(1) { animation-delay: 80ms; }
.options-container .option:nth-child(2) { animation-delay: 140ms; }
.options-container .option:nth-child(3) { animation-delay: 200ms; }
.options-container .option:nth-child(4) { animation-delay: 260ms; }

.options-container .option:hover {
	transform: translateY(-4px);
	opacity: .95;
	box-shadow: 0 18px 40px rgba(4, 9, 16, 0.55);
}

.options-container .option .img,
.options-container .option .text {
	float: left;
}

.options-container .option .img {
	height: 50px;
	width: 120px;
	border-radius: 5px;
	text-align: center;
	margin: 0 10px 0 0;
}

.options-container .option .img img {
	height: 30px;
	margin: 10px auto;
}

.options-container .option .text p {
	margin: 4px 0 -3px;
	font-weight: 600;
	font-size: 16px;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.options-container .option .text span {
	opacity: .75;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
/* END DEPOSIT / WITHDRAW */



/* FOOTER */
.footer {
	width: calc(100% + 160px);
	margin: 50px -80px -40px;
	float: left;
	background: rgba(12, 18, 28, 0.78);
	border-top: 1px solid var(--site-glass-border);
	box-shadow: 0 -20px 40px rgba(4, 9, 16, 0.4);
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
	padding: 20px 50px;
	text-align: left;
}

.footer .stats,
.footer .social,
.footer .links {
	/*width: 100%;*/
	/*float: left;*/
	/*display: inline-block;*/
	/*margin: 0 0 15px;*/
	/*float: left;*/
	display: flex;
	flex-direction: column;
	float: left;
	margin: 0 100px 0 0;
}

.footer .stats .c,
.footer .social a {
	/*display: inline-block;*/
	width: 100%;
	float: left;
	/*text-align: left;*/
	margin: 0 0 10px;
	transition: opacity 300ms;
}

.footer .social a {
	margin: 0 0 10px;
}

.footer .stats .val {
	font-weight: 600;
	font-size: 18px;
}

.footer .stats .desc {
	color: #8C92A8;
	font-weight: 600;
	text-transform: uppercase;
	margin: -3px 0 0;
	font-size: 12px;
}

.footer .social a:hover span {
	/*opacity: .8;*/
	color: #fff;
}

.footer .social i,
.footer .social svg {
	font-size: 18px;
	float: left;
	margin: 2px 0;
	height: 18px;
	width: 18px;
	color: var(--site-color-main) !important;
	fill: var(--site-color-main) !important;
}

.footer .social div {
	height: 22px;
	width: 22px;
	float: left;
	text-align: left !important;
	margin: 0 6px 0 0;
}

.footer .social span {
	float: left;
	line-height: 22px;
	color: #8C92A8;
}

.footer .links {
	list-style-type: none;
}

.footer .links li {
	margin: 0 0 10px;
}

.footer .links a {
	color: #8C92A8 !important;
	font-weight: 600;
	/*margin: 0 10px;*/
	transition: opacity 300ms;
}

.footer .links a:hover {
	/*opacity: .8;*/
	color: #fff !important;
}

.footer .crypto p {
	margin: 0 0 12px;
	font-weight: 600;
	color: #8C92A8 !important;
}

.footer .crypto img {
	height: 29px;
	margin: 0 7px 0 0;
	transition: transform 300ms;
}

.footer .crypto img:hover {
	cursor: pointer;
	transform: translateY(-3px);
}

.footer .license img {
	height: 40px;
	margin: 30px 0 0;
	float: left;
	filter: invert(42%);
	-webkit-filter: invert(42%);
}

.footer .license .r {
	float: left;
	margin: 30px 0 0 20px;
	/*height: 40px;*/
}

.footer .license .r p {
	font-size: 12px;
	margin: 0;
	color: #8f9bad;

}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	.footer {
		width: calc(100% + 40px);
		margin: 50px -20px -20px;
		padding: 20px;
	}

	.footer .stats, .footer .social, .footer .links, .footer .crypto {
		display: block;
		float: left;
		width: 100%;
		margin: 0;
	}

	.footer .stats, .footer .social {
		width: 50%;
	}

	.footer .links {
		list-style-type: none;
		text-align: center;
		margin: 0;
		padding: 0;
	}

	.footer .links li {
		display: inline-block;
		margin: 0 10px;
	}

	.footer .crypto {
		text-align: center;
		margin: 20px 0 0;
	}

	.footer .social div,
	.footer .social span {
		float: right;
	}

	.footer .social div {
		margin: 0 0 0 6px;
	}

	.footer .license {
		text-align: center;
	}

	.footer .license a {
		display: inline-block;
	}
}
/* END FOOTER */

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape){
	.width-1.responsive, .width-2.responsive, .width-3.responsive, .width-4.responsive, .width-5.responsive, .width-6.responsive, 
	.width-7.responsive, .width-8.responsive, .width-9.responsive, .width-10.responsive, .width-11.responsive, .width-12.responsive {
		width: 100% !important;
	}
	
	.grid.split-column-full.responsive { grid-template-columns: repeat( auto-fit, minmax(200px, 1fr)) !important; }
	
	.grid.split-column-2.responsive, .grid.split-column-3.responsive, .grid.split-column-4.responsive { grid-template-columns: 100% !important; }
	
	.flex.responsive, .dice-grid.responsive, .fair-grid.responsive {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;

		-webkit-box-orient: vertical !important;
		-webkit-box-direction: normal !important;
		-ms-flex-direction: column !important;
		flex-direction: column !important;
	}
	
	.header-max { display: none; }
}

@media (min-width: 768px){
	.header-min { display: none; }
}

/* deposit */
.deposit-page {
	max-width: 1120px;
	margin: 0 auto;
	padding: 34px 24px 56px;
	float: none;
	text-align: left;
}

.deposit-page .deposit-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	align-items: center;
	gap: 32px;
	margin-bottom: 22px;
	padding: 30px 32px;
	overflow: hidden;
	border: 1px solid rgba(161, 116, 255, .24);
	border-radius: 22px;
	background: radial-gradient(circle at 82% 12%, rgba(139, 78, 255, .26), transparent 37%), linear-gradient(135deg, rgba(31, 18, 57, .96), rgba(14, 12, 28, .97));
	box-shadow: 0 22px 60px rgba(7, 3, 18, .32), inset 0 1px rgba(255, 255, 255, .05);
}

.deposit-page .deposit-hero::after {
	content: '';
	position: absolute;
	right: -55px;
	top: -75px;
	width: 260px;
	height: 260px;
	border: 1px solid rgba(244, 201, 93, .13);
	border-radius: 50%;
	box-shadow: 0 0 0 34px rgba(139, 78, 255, .04), 0 0 0 68px rgba(139, 78, 255, .025);
	pointer-events: none;
}

.deposit-page .deposit-hero-copy { position: relative; z-index: 1; }
.deposit-page .deposit-eyebrow { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 12px; color: #c5a7ff; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.deposit-page .deposit-eyebrow i { color: #f4c95d; }
.deposit-page h1 { margin: 0 0 10px; color: #fff; font-size: clamp(30px, 4vw, 44px); line-height: 1.05; letter-spacing: -.035em; }
.deposit-page .deposit-hero-copy p { max-width: 660px; margin: 0; color: #aaa4ba; font-size: 14px; line-height: 1.65; }

.deposit-page .deposit-balance-card {
	position: relative;
	z-index: 1;
	padding: 18px 20px;
	border: 1px solid rgba(255, 255, 255, .09);
	border-radius: 16px;
	background: rgba(8, 6, 18, .48);
	box-shadow: inset 0 1px rgba(255, 255, 255, .04);
}
.deposit-page .deposit-balance-card > span { display: block; margin-bottom: 7px; color: #8e879c; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.deposit-page .deposit-balance-card strong { display: flex; align-items: center; gap: 8px; color: #fff; font-size: 27px; line-height: 1.2; }
.deposit-page .deposit-balance-card strong i { color: #f4c95d; font-size: 18px; }
.deposit-page .deposit-balance-card small { display: block; margin-top: 7px; color: #777184; font-size: 11px; line-height: 1.4; }

.deposit-page .deposit-layout { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(290px, .78fr); gap: 22px; }
.deposit-page .deposit-card,
.deposit-page .deposit-guide-card,
.deposit-page .deposit-safety-card { border: 1px solid rgba(255, 255, 255, .08); background: linear-gradient(145deg, rgba(28, 22, 43, .92), rgba(15, 13, 26, .94)); box-shadow: 0 18px 45px rgba(5, 3, 13, .24), inset 0 1px rgba(255, 255, 255, .035); }
.deposit-page .deposit-card { padding: 28px; border-radius: 20px; }
.deposit-page .deposit-card-head { display: flex; align-items: center; gap: 13px; margin-bottom: 27px; }
.deposit-page .deposit-step-number { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(174, 132, 255, .42); border-radius: 13px; background: linear-gradient(145deg, rgba(134, 76, 245, .32), rgba(80, 35, 166, .24)); color: #d8c3ff; font-size: 14px; font-weight: 800; }
.deposit-page .deposit-card-head span { display: block; margin-bottom: 3px; color: #8f869d; font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.deposit-page .deposit-card-head h2 { margin: 0; color: #f7f4fb; font-size: 18px; }
.deposit-page .deposit-amount-label { display: block; margin-bottom: 8px; color: #bcb5c7; font-size: 12px; font-weight: 700; }
.deposit-page .deposit-amount-field { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 10px; height: 64px; padding: 0 17px; border: 1px solid rgba(167, 120, 255, .28); border-radius: 14px; background: rgba(8, 6, 17, .58); transition: border-color .2s, box-shadow .2s; }
.deposit-page .deposit-amount-field:focus-within { border-color: #925cf0; box-shadow: 0 0 0 3px rgba(139, 78, 255, .13); }
.deposit-page .deposit-amount-field > i { color: #f4c95d; font-size: 18px; }
.deposit-page .deposit-amount-field input { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: #fff; font-size: 25px; font-weight: 750; text-align: left; }
.deposit-page .deposit-amount-field input::placeholder { color: #514b5d; }
.deposit-page .deposit-amount-field > span { color: #80798d; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.deposit-page .deposit-presets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-top: 11px; }
.deposit-page .deposit-presets button { height: 38px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 10px; background: rgba(255, 255, 255, .035); color: #afa7ba; font-size: 13px; font-weight: 700; transition: .18s ease; }
.deposit-page .deposit-presets button::before { content: '+'; color: #746a82; }
.deposit-page .deposit-presets button:hover,
.deposit-page .deposit-presets button.active { cursor: pointer; border-color: rgba(166, 116, 255, .48); background: rgba(132, 71, 240, .15); color: #fff; transform: translateY(-1px); }
.deposit-page .deposit-hint { display: flex; align-items: flex-start; gap: 7px; margin: 14px 0 20px; color: #7f788a; font-size: 11px; line-height: 1.5; }
.deposit-page .deposit-hint i { margin-top: 2px; color: #9980c9; }
.deposit-page .deposit-submit { display: flex; width: 100%; height: 49px; align-items: center; justify-content: center; gap: 10px; border: 0; border-radius: 12px; background: linear-gradient(135deg, #7d3ee8, #a35af2); color: #fff; font-size: 14px; font-weight: 800; box-shadow: 0 14px 28px rgba(108, 48, 207, .28), inset 0 1px rgba(255, 255, 255, .2); transition: .18s ease; }
.deposit-page .deposit-submit:hover:not(:disabled) { cursor: pointer; transform: translateY(-1px); filter: brightness(1.07); }
.deposit-page .deposit-submit:disabled { cursor: wait; opacity: .72; }
.deposit-page .deposit-submit.loading i { animation: deposit-arrow 1s ease-in-out infinite; }
.deposit-page .deposit-error { display: none; margin-top: 12px; padding: 11px 13px; border: 1px solid rgba(255, 100, 122, .23); border-radius: 9px; background: rgba(194, 42, 67, .1); color: #ff9aaa; font-size: 12px; line-height: 1.4; }
.deposit-page .deposit-error.show { display: block; }
/* Custodial wallet. One permanent address per player, valid on every listed
   network, so the page is a picker plus an address rather than a checkout. */
.deposit-page .wallet-hidden { display: none !important; }
.deposit-page .wallet-chains { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.deposit-page .wallet-chain { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 15px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 10px; background: rgba(255, 255, 255, .035); color: #afa7ba; font-size: 12px; font-weight: 700; transition: .18s ease; }
.deposit-page .wallet-chain:hover { cursor: pointer; color: #fff; }
.deposit-page .wallet-chain.active { border-color: rgba(166, 116, 255, .48); background: rgba(132, 71, 240, .15); color: #fff; }
.deposit-page .wallet-coins { display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 9px; }
.deposit-page .wallet-coin { display: flex; flex-direction: column; gap: 3px; padding: 11px 13px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; background: rgba(8, 6, 17, .45); text-align: left; transition: .18s ease; }
.deposit-page .wallet-coin:hover { cursor: pointer; border-color: rgba(166, 116, 255, .4); transform: translateY(-1px); }
.deposit-page .wallet-coin.active { border-color: #925cf0; background: rgba(132, 71, 240, .16); }
.deposit-page .wallet-coin b { color: #f7f4fb; font-size: 14px; font-weight: 800; }
.deposit-page .wallet-coin span { color: #817a8b; font-size: 10px; }

/* The wrapper is border-box, so its size is the canvas plus the white quiet-zone
   border on both sides: 200 + 8 + 8 = 216. Keep the grid column in step with it. */
.deposit-page .wallet-address-grid { display: grid; grid-template-columns: 216px minmax(0, 1fr); align-items: center; gap: 22px; }
.deposit-page .wallet-qr { overflow: hidden; width: 216px; height: 216px; border: 8px solid #fff; border-radius: 15px; background: #fff; }
.deposit-page .wallet-qr canvas { display: block; width: 230px; height: 230px; }
.deposit-page .wallet-details { display: flex; min-width: 0; flex-direction: column; gap: 12px; }
.deposit-page .wallet-detail { padding: 12px 14px; border: 1px solid rgba(255, 255, 255, .07); border-radius: 11px; background: rgba(8, 6, 17, .4); }
.deposit-page .wallet-detail > span { display: block; margin-bottom: 5px; color: #81798c; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.deposit-page .wallet-detail strong { color: #f4f0f8; font-size: 13px; }
.deposit-page .wallet-detail code { display: block; overflow-wrap: anywhere; color: #cbb5f4; font-family: monospace; font-size: 12px; line-height: 1.45; }
/* The address is deliberately the same on every listed network -- an EVM address
   is a hash of a public key and carries no chain identity. Saying so here stops
   the unchanged address from reading as a broken network switch. */
.deposit-page .wallet-address-hint { display: flex; gap: 6px; margin-top: 9px; color: #6f8f7d; font-size: 10px; line-height: 1.45; }
.deposit-page .wallet-address-hint i { margin-top: 1px; color: #58d99c; }
.deposit-page .wallet-copy { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 16px; }
.deposit-page .wallet-copy button { display: flex; min-height: 44px; align-items: center; justify-content: center; gap: 8px; border: 1px solid rgba(160, 112, 245, .25); border-radius: 11px; background: rgba(124, 65, 224, .1); color: #cfb8f8; font-size: 12px; font-weight: 800; }
.deposit-page .wallet-copy button:hover { cursor: pointer; border-color: rgba(174, 128, 255, .5); background: rgba(132, 71, 240, .18); color: #fff; }

.deposit-page .wallet-warning { display: flex; gap: 10px; margin-top: 14px; padding: 12px 14px; border: 1px solid rgba(244, 201, 93, .16); border-radius: 11px; background: rgba(85, 65, 21, .14); color: #a99b78; font-size: 11px; line-height: 1.5; }
.deposit-page .wallet-warning i { margin-top: 2px; color: #f4c95d; }
.deposit-page .wallet-notice { display: flex; gap: 10px; margin-top: 16px; padding: 14px 15px; border: 1px solid rgba(255, 117, 136, .22); border-radius: 12px; background: rgba(167, 38, 61, .1); color: #ff9aaa; font-size: 12px; line-height: 1.5; }
.deposit-page .wallet-notice i { margin-top: 2px; }

.deposit-page .wallet-history { margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .06); }
.deposit-page .wallet-history h3 { margin: 0 0 14px; color: #cfc8db; font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.deposit-page .wallet-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid rgba(255, 255, 255, .06); border-radius: 11px; background: rgba(8, 6, 17, .35); }
.deposit-page .wallet-row + .wallet-row { margin-top: 8px; }
.deposit-page .wallet-row-main { min-width: 0; }
.deposit-page .wallet-row-main strong { display: block; color: #f2eef8; font-size: 13px; }
.deposit-page .wallet-row-main span { display: block; margin-top: 3px; overflow: hidden; color: #7f788a; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.deposit-page .wallet-row-side { display: flex; align-items: center; gap: 10px; }
.deposit-page .wallet-amount { color: #58d99c; font-size: 13px; font-weight: 800; white-space: nowrap; }
.deposit-page .wallet-amount.out { color: #f2b75f; }
.deposit-page .wallet-empty { padding: 22px; border: 1px dashed rgba(255, 255, 255, .08); border-radius: 12px; color: #6f6880; font-size: 12px; text-align: center; }
.deposit-page .wallet-link { color: #a98bf0; font-size: 11px; text-decoration: none; }
.deposit-page .wallet-link:hover { text-decoration: underline; }

.deposit-page .wallet-tag { padding: 4px 9px; border-radius: 20px; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.deposit-page .wallet-tag[data-status="credited"],
.deposit-page .wallet-tag[data-status="confirmed"] { background: rgba(30, 142, 88, .16); color: #58d99c; }
.deposit-page .wallet-tag[data-status="review"],
.deposit-page .wallet-tag[data-status="approved"],
.deposit-page .wallet-tag[data-status="sending"],
.deposit-page .wallet-tag[data-status="sent"],
.deposit-page .wallet-tag[data-status="pending_rate"] { background: rgba(132, 71, 240, .16); color: #b791fa; }
.deposit-page .wallet-tag[data-status="dust"] { background: rgba(255, 255, 255, .06); color: #8d8699; }
.deposit-page .wallet-tag[data-status="rejected"],
.deposit-page .wallet-tag[data-status="failed"],
.deposit-page .wallet-tag[data-status="manual"] { background: rgba(167, 38, 61, .16); color: #ff8798; }

.deposit-page .wallet-field { margin-bottom: 15px; }
.deposit-page .wallet-field > label { display: block; margin-bottom: 8px; color: #bcb5c7; font-size: 12px; font-weight: 700; }
.deposit-page .wallet-input { width: 100%; height: 52px; padding: 0 15px; border: 1px solid rgba(167, 120, 255, .28); border-radius: 12px; outline: 0; background: rgba(8, 6, 17, .58); color: #fff; font-family: monospace; font-size: 13px; }
.deposit-page .wallet-input:focus { border-color: #925cf0; box-shadow: 0 0 0 3px rgba(139, 78, 255, .13); }
.deposit-page .wallet-input::placeholder { color: #514b5d; }
.deposit-page .wallet-summary { display: flex; flex-direction: column; gap: 8px; margin: 18px 0; padding: 15px 16px; border: 1px solid rgba(255, 255, 255, .07); border-radius: 12px; background: rgba(8, 6, 17, .4); }
.deposit-page .wallet-summary div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; color: #857e92; font-size: 12px; }
.deposit-page .wallet-summary div b { color: #f2eef8; font-weight: 800; }
.deposit-page .wallet-summary div.total { padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .06); }
.deposit-page .wallet-summary div.total b { color: #58d99c; font-size: 14px; }
.deposit-page .wallet-progress { height: 6px; margin-top: 9px; overflow: hidden; border-radius: 4px; background: rgba(255, 255, 255, .07); }
.deposit-page .wallet-progress i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, #7d3ee8, #a35af2); }
.deposit-page .wallet-cancel { height: 30px; padding: 0 12px; border: 1px solid rgba(255, 117, 136, .28); border-radius: 8px; background: rgba(167, 38, 61, .12); color: #ff9aaa; font-size: 11px; font-weight: 700; }
.deposit-page .wallet-cancel:hover { cursor: pointer; background: rgba(167, 38, 61, .2); color: #fff; }

.deposit-page .deposit-guide { display: flex; flex-direction: column; gap: 14px; }
.deposit-page .deposit-guide-card { padding: 23px; border-radius: 18px; }
.deposit-page .deposit-guide-label { color: #a69dac; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.deposit-page .deposit-guide-card ol { display: flex; flex-direction: column; gap: 21px; margin: 21px 0 0; padding: 0; list-style: none; }
.deposit-page .deposit-guide-card li { position: relative; display: flex; gap: 12px; }
.deposit-page .deposit-guide-card li:not(:last-child)::after { content: ''; position: absolute; left: 15px; top: 34px; width: 1px; height: 21px; background: linear-gradient(#65429a, transparent); }
.deposit-page .deposit-guide-card li > b { display: grid; flex: 0 0 31px; width: 31px; height: 31px; place-items: center; border-radius: 9px; background: rgba(128, 72, 224, .15); color: #b791fa; font-size: 11px; }
.deposit-page .deposit-guide-card li div { padding-top: 1px; }
.deposit-page .deposit-guide-card li strong { display: block; margin-bottom: 4px; color: #eeeaf3; font-size: 13px; }
.deposit-page .deposit-guide-card li span { display: block; color: #817a8b; font-size: 11px; line-height: 1.45; }
.deposit-page .deposit-safety-card { display: flex; gap: 12px; padding: 17px 18px; border-color: rgba(244, 201, 93, .14); border-radius: 16px; background: linear-gradient(145deg, rgba(52, 42, 25, .38), rgba(20, 16, 25, .92)); }
.deposit-page .deposit-safety-card > i { flex: 0 0 auto; margin-top: 2px; color: #f4c95d; font-size: 17px; }
.deposit-page .deposit-safety-card strong { display: block; margin-bottom: 5px; color: #e7dcc0; font-size: 12px; }
.deposit-page .deposit-safety-card span { display: block; color: #817a70; font-size: 10px; line-height: 1.5; }

@keyframes deposit-arrow { 50% { transform: translateX(4px); } }

@media (max-width: 860px) {
	.deposit-page .deposit-hero { grid-template-columns: 1fr; gap: 22px; }
	.deposit-page .deposit-balance-card { max-width: 350px; }
	.deposit-page .deposit-layout { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.deposit-page { padding: 18px 12px 38px; }
	.deposit-page .deposit-hero { padding: 23px 20px; border-radius: 17px; }
	.deposit-page .deposit-card { padding: 20px 16px; border-radius: 16px; }
	.deposit-page .deposit-card-head { align-items: flex-start; }
	.deposit-page .deposit-card-head h2 { font-size: 16px; line-height: 1.35; }
	.deposit-page .deposit-presets { grid-template-columns: repeat(2, 1fr); }
	.deposit-page .wallet-address-grid { grid-template-columns: minmax(0, 1fr); justify-items: center; }
	.deposit-page .wallet-details { width: 100%; }
	.deposit-page .wallet-coins { grid-template-columns: repeat(2, 1fr); }
	.deposit-page .wallet-row { grid-template-columns: 1fr; }
	.deposit-page .wallet-row-side { justify-content: space-between; }
}

.deposit,
.deposit .btns,
.deposit .parameters {
	width: 100%;
	float: left;
}

.deposit .btns button {
	background: var(--site-color-bg-light);
	padding: 0 20px;
	border-radius: 6px;
	outline: 0;
	line-height: 34px;
	height: 34px;
	float: left;
	font-size: 14px;
	font-weight: 600;
	color: #8f9bad;
}

.deposit .btns button:hover {
	opacity: .8;
	cursor: pointer;
}

.deposit .btns button i {
	font-size: 12px;
	margin: 0 4px 0 0;
}

.deposit .btns .right {
	float: right;
}

.deposit .btns button.rf {
	margin: 0 15px 0 0;
	/*padding: 0;*/
	text-align: center;
	/*width: 34px;*/
}

.deposit .btns button.rf i {
	margin: 0;
}

.deposit .btns button.dp {
	background: var(--site-color-main);
	color: #fff;
	padding: 0 50px;
}

.deposit .parameters {
	margin: 15px 0;
}

.deposit .parameters input {
	width: calc(75% - 20px);
	float: left;
	background: var(--site-color-bg-light);
	border: 0;
	border-radius: 6px;
	line-height: 40px;
	height: 40px;
	padding: 0 10px;
	margin: 0 20px 0 0;
}

.deposit h3 {
	margin: 20px 0 10px;
	/*text-align: left;*/
	color: #8f9bad;
	/*float: left;*/
}

.deposit .c {
	margin: 0 25%;
	background: var(--site-glass-bg);
	float: left;
	width: 50%;
	border-radius: 16px;
	border: 1px solid var(--site-glass-border);
	box-shadow: var(--site-glass-shadow);
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
}

.deposit p.desc {
	margin: 0 0 10px;
}

.deposit .input {
	width: 50%;
	float: left;
	margin: 20px 25% 20px;
}

.deposit .input input,
.deposit .input button {
	width: 100%;
}

.deposit .input input {
	padding: 0 15px;
}

.deposit .input input,
.deposit .converter input {
	height: 40px;
	line-height: 40px;
	border-radius: 10px;
	background: rgba(12, 18, 28, 0.7);
	border: 1px solid var(--site-glass-border);
	outline: 0;
	color: var(--site-color-text);
	text-align: center;
}

.deposit .input input::placeholder,
.deposit .converter input::placeholder {
	color: rgba(246, 248, 250, 0.6);
}

.deposit .input button {
	margin: 10px 0 0;
	border-radius: 10px;
	height: 40px;
	line-height: 40px;
	background-image: linear-gradient(135deg, rgba(44, 212, 197, 0.95), rgba(246, 196, 83, 0.95));
	color: #0b1118;
	font-weight: 700;
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow: 0 12px 26px rgba(44, 212, 197, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.deposit .input button:hover {
	cursor: pointer;
	opacity: 1;
	transform: translateY(-1px);
	filter: brightness(1.05);
}

.deposit .converter {
	width: calc(100% - 40px);
	float: left;
	margin: 20px;
}

.deposit .converter .i {
	float: left;
	width: calc(50% - 15px);
	background: rgb(25 38 43);
	border-radius: 6px;
}

.deposit .converter i.m {
	height: 16px;
	width: 12px;
	float: left;
	margin: 12px 9px;
	color: #8f9bad;
}

.deposit .converter .i i {
	float: left;
	margin: 13px;
}

.deposit .converter.c2 .i i {
	margin: 13px 17px;
}

.deposit .converter .i img {
	height: 22px;
	float: left;
	margin: 9px 13px;
}

.deposit .converter input {
	text-align: center;
	float: left;
	background: #131b1e;
}

.deposit .converter.c2 .i {
	width: 100%;
	float: left;
	margin: 0 0 10px;
}

.deposit .converter .i.r i,
.deposit .converter .i.r input,
.deposit .converter .i.r img {
	float: right;
	text-align: center;
}

#modal_rake {
	text-align: center;
}

#modal_rake button {
	width: 100%;
	float: left;
	margin: 10px 0;
	border-radius: 6px;
	text-align: center;
	padding: 10px 0;
	font-weight: 600;
	color: #fff;
	background: #00b549 !important
}

#modal_rake button:hover {
	cursor: pointer;
	opacity: .8;
}

#modal_rake p {
	text-align: center;
	color: #8f9bad;
}

#modal_rake .rakeback {
	font-size: 18px;
	font-weight: 600;
	/*margin: 12px 0;*/
	display: inline-block;
}

#modal_rake .fff {
	margin: 15px 0 0;
	color: #8f9bad;
	float: left;
	width: 100%;
	text-align: center;
}

#modal_rake .cn {
	width: 100%;
	float: left;
	text-align: center;
	margin: 0 0 1em;
}

#modal_rake #rb_error {
	width: 100%;
	float: left;
	text-align: center;
	font-size: 14px;
	color: #ff4141;
}

.hideAnim {
	transition: transform 300ms, opacity 300ms;
	transform: translateY(200px);
	opacity: 0;
}

#bb_info_container {
	position: fixed;
	bottom: 100px;
	left: 30%;
	right: 30%;
}

.bb_info {
	background: var(--site-color-bg-dark);
	border-radius: 8px;
	padding: 15px;
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
	float: left;
	width: 100%;
}

.bb_info.hidden {
	pointer-events: none;
}

.bb_info h3 {
	margin: 0 0 5px;
}

.bb_info p {
	margin: 0;
	color: #8f9bad;
}

.bb_info p span {
	font-weight: 600;
}

.bb_info p i {
	margin: 0 5px 0 2px;
}

.bb_info .left {
	width: calc(100% - 120px);
	float: left;
}

.bb_info a {
	float: right;
	background: var(--site-color-main);
	border-radius: 200px;
	padding: 5px 25px;
	font-weight: 600;
	margin: 10px 0;
}

.bb_info a:hover {
	cursor: pointer;
	opacity: .8;
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
	.deposit .btns button,
	.deposit .parameters input,
	.deposit .converter .i,
	.deposit .c {
		width: 100%;
		margin: 0 0 15px !important;	
	}

	.deposit .btns .right {
		width: 100%;
		margin: 0;
	}

	#list_items {
		grid-template-columns: 1fr 1fr;
		grid-gap: 20px;
	}
}

#rake {
	background-image: conic-gradient(from 1turn,#f19511,#f6c722);
	border-color: transparent!important;
}

select {
	height: 40px;
    line-height: 40px;
    border-radius: 6px;
    background: var(--site-color-bg-body);
    outline: 0;
    color: #8f9bad;
    text-align: center;
    border-color: transparent;
}

/* =========================================================
   FINAL DESIGN OVERRIDES
   Keep this block last.
   ========================================================= */
/* ============================================================
   ZAMZAM — REDESIGN (matches Figma: ZamZam my MCP)
   ============================================================ */

/* ── Game info popup ─────────────────────────────────────── */
.game-info-trigger {
    cursor: pointer;
    transition: color 0.15s, opacity 0.15s;
}
.game-info-trigger:hover { color: rgba(255,255,255,0.9) !important; opacity: 1 !important; }

#game-info-popup {
    position: absolute;
    z-index: 99999;
    width: 280px;
    background: #1a1226;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    padding: 14px 16px 16px;
    box-shadow: 0 12px 40px rgba(0,0,0,0.6);
    opacity: 0;
    transform: translateY(-6px) scale(0.97);
    transition: opacity 0.18s ease, transform 0.18s ease;
    pointer-events: none;
    top: 0;
    right: 0;
}
#game-info-popup.visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
#game-info-popup::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 18px;
    width: 10px;
    height: 10px;
    background: #1a1226;
    border-left: 1px solid rgba(255,255,255,0.12);
    border-top: 1px solid rgba(255,255,255,0.12);
    transform: rotate(45deg);
}
.gip-title {
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.gip-title::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #09b95b;
    flex-shrink: 0;
}
.gip-body {
    font-size: 13px;
    line-height: 1.55;
    color: rgba(255,255,255,0.65);
}
.gip-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.gip-stats.hidden { display: none; }
.gip-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: rgba(255,255,255,0.05);
    border-radius: 8px;
    padding: 6px 10px;
    flex: 1 1 auto;
    min-width: 76px;
}
.gip-stat-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: rgba(255,255,255,0.45);
}
.gip-stat-value {
    font-size: 13px;
    font-weight: 700;
    color: #2ee36f;
    font-variant-numeric: tabular-nums;
}

/* ---- SITE BUTTON OVERRIDES ---- */
.site-button.purple {
    background: var(--site-color-main);
    color: #fff;
    border: none;
}
.site-button.purple:hover { background: #7c3aed; }

.site-button.green,
.btn-cta {
    background: #09b95b;
    color: #fff;
    border: none;
    font-weight: 600;
}
.site-button.green:hover, .btn-cta:hover { background: #08a451; }

/* ---- HEADER (Figma redesign) ---- */
.header-max {
    background: #2b2333 !important;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    position: sticky;
    top: 0;
    z-index: 100;
    height: 68px;
    margin-left: 160px;
}
.header-inner {
    height: 68px;
    display: flex;
    align-items: center;
    /* Side padding shrinks smoothly on narrow screens instead of jumping. */
    padding: 8px clamp(16px, 4vw, 64px);
    gap: 8px;
}
.header-inner-auth {
    display: grid;
    grid-template-columns: minmax(52px, 1fr) auto minmax(52px, 1fr);
}
.header-min {
    display: none !important;
}
.sidebar-toggle-btn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    color: #fff;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
}
.sidebar-toggle-btn:hover {
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.16);
}
.header-inner-auth .sidebar-toggle-btn {
    grid-column: 1;
    justify-self: start;
}

/* Hide old header structure */
.header-menu-top { display: none !important; }
.header-logo { display: none !important; }
.header-nav-links { display: none !important; }

/* --- Guest navbar --- */
.header-auth-btns {
    display: flex;
    align-items: center;
    gap: 8px;
}
.btn-login {
    background: rgba(255,255,255,0.05) !important;
    border: none !important;
    color: #acacac !important;
    width: 121px;
    height: 52px;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}
.btn-login:hover {
    background: rgba(255,255,255,0.1) !important;
    color: #fff !important;
}
.btn-signup {
    background: #09b95b !important;
    border: none !important;
    color: #fff !important;
    width: 121px;
    height: 52px;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}
.btn-signup:hover { background: #08a451 !important; }

/* --- Logged-in navbar --- */
.header-balance-widget {
    display: flex;
    align-items: stretch;
    height: 52px;
}
.header-inner-auth .header-balance-widget {
    grid-column: 2;
    justify-self: center;
}
.header-balance-field {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.12);
    border-right: none;
    border-radius: 6px 0 0 6px;
    padding: 10px 12px;
    min-width: 150px;
}
.header-balance-field .balance {
    color: #fff;
    font-size: 16px;
    font-weight: 400;
}
.btn-wallet {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #09b95b;
    color: #fff !important;
    border: none;
    border-radius: 0 6px 6px 0;
    padding: 14px 24px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}
.btn-wallet:hover { background: #08a451; }
.header-account-btns {
    display: flex;
    align-items: center;
    gap: 8px;
}
.header-inner-auth .header-account-btns {
    grid-column: 3;
    justify-self: end;
}
.btn-icon-sq {
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.05);
    border: none;
    border-radius: 6px;
    width: 52px;
    height: 52px;
    cursor: pointer;
    transition: background 0.2s;
    text-decoration: none !important;
    color: #fff !important;
    position: relative;
}
.btn-icon-sq:hover { background: rgba(255,255,255,0.1); }
.global-sound-toggle { color:#d8d0dc; }
.global-sound-toggle.is-muted { border-color:rgba(244,201,93,.25)!important;background:rgba(244,201,93,.08)!important;color:#e2c36f!important; }
.header-global-sound-button,.mobile-global-sound-button { width:44px;height:44px;padding:0;display:grid;place-items:center;flex:0 0 44px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.045);color:#d8d0dc;font-size:15px;cursor:pointer; }
.header-global-sound-button:hover,.mobile-global-sound-button:hover { border-color:rgba(181,103,235,.35);background:rgba(151,73,208,.14);color:#fff; }
.nav-icon {
    width: 24px;
    height: 24px;
    object-fit: contain;
    display: block;
}

/* Profile dropdown (inside .btn-icon-sq) */
.btn-icon-sq .drp {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    background: #2b2333;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 8px;
    min-width: 160px;
    padding: 6px 0;
    z-index: 200;
    box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}
.btn-icon-sq .drp[data-active="true"] { display: block; }
.btn-icon-sq .drp a { text-decoration: none; color: inherit; }
.btn-icon-sq .drp div {
    padding: 10px 16px;
    font-size: 13px;
    color: rgba(255,255,255,0.75);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.btn-icon-sq .drp div:hover {
    background: rgba(255,255,255,0.08);
    color: #fff;
}

/* Online indicator */
.online {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: rgba(255,255,255,0.45);
}
.online > div {
    width: 7px;
    height: 7px;
    background: #09b95b;
    border-radius: 50%;
    animation: pulse-green 2s infinite;
}
@keyframes pulse-green {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* ---- LEFT SIDEBAR (Figma redesign) ---- */
.left-sidebar {
    width: fit-content;
    min-width: 160px;
    background: #2b2333;
    border-right: 1px solid rgba(255,255,255,0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    /* dvh accounts for collapsing mobile browser address bars. */
    height: 100dvh;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 8px 16px;
    scrollbar-width: thin;
    flex-shrink: 0;
    z-index: 150;
    gap: 0;
}
.left-sidebar::-webkit-scrollbar { width: 3px; }
.left-sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 3px; }

/* Sidebar logo */
.sidebar-logo { width: 100%; padding-bottom: 8px; }
.sidebar-logo a { display: block; }
.sidebar-logo img {
    width: auto;
    height: auto;
    max-width: 170px;
    display: block;
    object-fit: contain;
}

/* Games grouped box */
.sidebar-games {
    background: rgba(255,255,255,0.05);
    border-radius: 8px;
    padding: 4px;
    display: flex;
    flex-direction: column;
}
.sidebar-cell {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 8px 16px;
    border-radius: 6px;
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    transition: background 0.15s;
    white-space: nowrap;
}
.sidebar-cell:hover { background: rgba(255,255,255,0.08); color: #fff !important; }
.sidebar-cell.active { background: rgba(255,255,255,0.05); color: #fff !important; }
.sidebar-cell-icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}
.sidebar-cell-icon img {
    width: 18px;
    height: 18px;
    object-fit: contain;
    display: block;
}

/* Bottom menu */
.sidebar-menu {
    display: flex;
    flex-direction: column;
}
.sidebar-menu-link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 16px;
    border-radius: 8px;
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    transition: background 0.15s;
    white-space: nowrap;
    min-height: 28px;
}
.sidebar-menu-link:hover { background: rgba(255,255,255,0.07); }
.sidebar-menu-link.active { background: rgba(255,255,255,0.05); }
.sidebar-menu-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
    display: block;
    /* Icons use fill="currentColor" and load through <img>, so recolor them
       with a filter to keep them light instead of black. */
    filter: brightness(0) invert(1);
    opacity: 0.8;
}
.sidebar-menu-link:hover .sidebar-menu-icon,
.sidebar-menu-link.active .sidebar-menu-icon { opacity: 1; }

/* Desktop game navigator: grouped, searchable and optionally compact. */
.sidebar-search-wrap,.sidebar-desktop-collapse,.sidebar-group-toggle,.sidebar-no-results { display:none; }
@media (min-width:1025px) {
    .left-sidebar { width:232px; min-width:232px; padding:10px 10px 12px; gap:8px; overflow-y:hidden; background:linear-gradient(180deg,#2d2435 0,#241d2c 100%); transition:width .22s,min-width .22s; }
    .header-max,.wrapper-page { margin-left:232px; transition:margin-left .22s; }
    .footer { margin-left:232px !important; transition:margin-left .22s; }
    .sidebar-logo { height:59px; padding:0 1px 8px; display:flex; align-items:center; justify-content:space-between; gap:6px; border-bottom:1px solid rgba(255,255,255,.055); }
    .sidebar-logo a { min-width:0; flex:1; display:flex; align-items:center; }
    .sidebar-logo img { width:174px; max-width:100%; max-height:50px; }
    .sidebar-desktop-collapse { width:29px; height:29px; flex:0 0 29px; display:grid; place-items:center; padding:0; border:1px solid rgba(255,255,255,.09); border-radius:8px; background:rgba(255,255,255,.035); color:rgba(255,255,255,.48); cursor:pointer; transition:.18s; }
    .sidebar-desktop-collapse:hover { color:#fff; border-color:rgba(181,110,255,.38); background:rgba(181,110,255,.1); }
    .sidebar-search-wrap { position:relative; height:38px; display:flex; align-items:center; flex:0 0 38px; }
    .sidebar-search-wrap>i { position:absolute; left:12px; color:rgba(255,255,255,.34); font-size:11px; pointer-events:none; }
    .sidebar-search-wrap input { width:100%; height:38px; padding:0 31px 0 31px; border:1px solid rgba(255,255,255,.08); border-radius:10px; outline:none; background:rgba(8,7,12,.24); color:#fff; font-size:11px; transition:border-color .18s,background .18s; }
    .sidebar-search-wrap input::placeholder { color:rgba(255,255,255,.3); }
    .sidebar-search-wrap input:focus { border-color:rgba(181,110,255,.42); background:rgba(8,7,12,.4); box-shadow:0 0 0 3px rgba(181,110,255,.08); }
    .sidebar-search-wrap button { position:absolute; right:5px; width:27px; height:27px; display:none; place-items:center; border:0; background:transparent; color:rgba(255,255,255,.4); cursor:pointer; }
    .sidebar-search-wrap.has-value button { display:grid; }
    .sidebar-games { min-height:0; flex:1; padding:0 2px 3px 0; gap:5px; overflow-y:auto; background:transparent; border-radius:0; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.12) transparent; }
    .sidebar-game-group { border:1px solid rgba(255,255,255,.055); border-radius:11px; background:rgba(255,255,255,.022); overflow:hidden; transition:border-color .18s,background .18s; }
    .sidebar-game-group.has-active { border-color:rgba(181,110,255,.22); background:rgba(181,110,255,.045); }
    .sidebar-group-toggle { width:100%; height:38px; display:flex; align-items:center; justify-content:space-between; padding:0 10px; border:0; background:transparent; color:rgba(255,255,255,.68); cursor:pointer; }
    .sidebar-group-toggle>span { min-width:0; display:flex; align-items:center; gap:7px; }
    .sidebar-group-toggle>span>i { width:16px; color:#ae79db; font-size:10px; text-align:center; }
    .sidebar-group-toggle .sidebar-group-icon { width:16px; height:16px; flex:0 0 16px; object-fit:contain; filter:drop-shadow(0 2px 4px rgba(0,0,0,.3)); }
    .sidebar-group-toggle b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; font-weight:850; letter-spacing:.035em; text-transform:uppercase; }
    .sidebar-group-toggle small { min-width:17px; height:17px; display:grid; place-items:center; border-radius:6px; background:rgba(255,255,255,.055); color:rgba(255,255,255,.34); font-size:8px; }
    .sidebar-group-chevron { font-size:10px; opacity:.4; transition:transform .18s; }
    .sidebar-game-group.is-open .sidebar-group-chevron { transform:rotate(180deg); }
    .sidebar-group-grid { max-height:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; padding:0 6px; overflow:hidden; opacity:0; transition:max-height .25s ease,padding .25s,opacity .18s; }
    .sidebar-game-group.is-open .sidebar-group-grid { max-height:430px; padding:2px 6px 7px; opacity:1; }
    .sidebar-cell { position:relative; height:53px; min-width:0; padding:6px 5px; flex-direction:column; justify-content:center; gap:4px; border:1px solid transparent; border-radius:9px; color:rgba(255,255,255,.67) !important; font-size:9px; font-weight:700; }
    .sidebar-cell:hover { border-color:rgba(255,255,255,.08); background:rgba(255,255,255,.055); color:#fff !important; }
    .sidebar-cell.active { border-color:rgba(181,110,255,.3); background:linear-gradient(145deg,rgba(181,110,255,.18),rgba(89,45,126,.08)); color:#fff !important; box-shadow:inset 0 0 18px rgba(181,110,255,.06); }
    .sidebar-cell.active::before { content:""; position:absolute; top:8px; bottom:8px; left:-7px; width:2px; border-radius:2px; background:#b56eff; box-shadow:0 0 8px #b56eff; }
    .sidebar-cell-icon { width:24px; height:24px; }
    .sidebar-cell-icon img { width:22px; height:22px; filter:drop-shadow(0 3px 5px rgba(0,0,0,.3)); }
    .sidebar-cell>span:last-child { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .sidebar-no-results { min-height:100px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:rgba(255,255,255,.28); font-size:10px; }.sidebar-no-results i{font-size:18px}.sidebar-no-results.hidden{display:none}
    .sidebar-menu { flex:0 0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:5px; padding-top:8px; border-top:1px solid rgba(255,255,255,.055); }
    .sidebar-menu-link { min-width:0; min-height:46px; padding:5px 3px; flex-direction:column; justify-content:center; gap:3px; border:1px solid transparent; border-radius:9px; color:rgba(255,255,255,.58) !important; font-size:8px; text-align:center; }
    .sidebar-menu-link:hover,.sidebar-menu-link.active { border-color:rgba(255,255,255,.08); background:rgba(255,255,255,.045); color:#fff !important; }
    .sidebar-menu-icon { width:17px; height:17px; }
    .sidebar-menu-link span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

    body.sidebar-compact .left-sidebar { width:76px; min-width:76px; padding-right:8px; padding-left:8px; }
    body.sidebar-compact .header-max,body.sidebar-compact .wrapper-page { margin-left:76px; }
    body.sidebar-compact .footer { margin-left:76px !important; }
    body.sidebar-compact .sidebar-logo { height:78px; padding:2px 0 8px; flex-direction:column; justify-content:center; gap:4px; }
    body.sidebar-compact .sidebar-logo a { width:54px; min-height:25px; flex:0 0 25px; display:flex; justify-content:center; }
    body.sidebar-compact .sidebar-logo img { width:54px; max-width:54px; max-height:25px; object-fit:contain; }
    body.sidebar-compact .sidebar-desktop-collapse i { transform:rotate(180deg); }
    body.sidebar-compact .sidebar-search-wrap { display:none; }
    body.sidebar-compact .sidebar-group-toggle { height:36px; justify-content:center; padding:0; }
    body.sidebar-compact .sidebar-group-toggle>span>i { font-size:13px; }
    body.sidebar-compact .sidebar-group-toggle .sidebar-group-icon { width:19px; height:19px; flex-basis:19px; }
    body.sidebar-compact .sidebar-group-toggle b,body.sidebar-compact .sidebar-group-toggle small,body.sidebar-compact .sidebar-group-chevron { display:none; }
    body.sidebar-compact .sidebar-group-grid { grid-template-columns:1fr; padding-right:4px;padding-left:4px; }
    body.sidebar-compact .sidebar-game-group.is-open .sidebar-group-grid { padding-right:4px;padding-left:4px; }
    body.sidebar-compact .sidebar-cell { height:43px; padding:4px; }
    body.sidebar-compact .sidebar-cell-icon { width:25px;height:25px; }
    body.sidebar-compact .sidebar-cell>span:last-child { display:none; }
    body.sidebar-compact .sidebar-cell.active::before { left:-5px; }
    body.sidebar-compact .sidebar-menu { grid-template-columns:repeat(2,1fr); }
    body.sidebar-compact .sidebar-menu-link { min-height:35px; padding:4px; }
    body.sidebar-compact .sidebar-menu-link span { display:none; }
}

/* ---- WRAPPER adjustments ---- */
.wrapper-page {
    display: flex !important;
    flex-direction: row !important;
    min-height: calc(100vh - 68px);
    min-height: calc(100dvh - 68px);
    align-items: flex-start;
    margin-left: 160px;
}
.main-panel {
    flex: 1;
    min-width: 0;
    text-align: left !important;
    position: relative !important;
    height: auto !important;
    min-height: calc(100dvh - 68px);
    overflow-y: visible !important;
    padding: 0 !important;
    margin: 24px;
    margin-left: 50px;
}
.hero-cta {
    position: absolute;
    left: 6.5%;
    top: 59%;
    transform: translateY(-50%);
    z-index: 2;
}
.hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #09b95b;
    color: #fff !important;
    font-size: 14px;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 8px;
    text-decoration: none !important;
    transition: all 0.2s;
    border: none;
    cursor: pointer;
    white-space: nowrap;
}
.hero-btn:hover {
    background: #08a451;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(9, 185, 91, 0.4);
}
@keyframes casebattles-card-shine { from{left:-55%} to{left:125%} }
@keyframes avia-card-flight { from{left:-30%;top:52%} to{left:105%;top:20%} }

@keyframes game-flight { 0%{opacity:0;transform:translate(-8%,8%) rotate(-28deg)} 20%{opacity:1} 100%{opacity:0;transform:translate(220%,-170%) rotate(-28deg)} }
@keyframes game-burst { 0%{opacity:0;transform:translate(-50%,-50%) scale(.1)} 35%{opacity:1} 100%{opacity:0;transform:translate(-50%,-50%) scale(4.5)} }
@keyframes game-drop { 0%{opacity:0;transform:translate(0,-10px)} 15%{opacity:1} 50%{transform:translate(-24px,55px)} 100%{opacity:0;transform:translate(22px,125px)} }
@keyframes game-rise { 0%{opacity:0;transform:translateY(48px)} 25%{opacity:1} 100%{opacity:0;transform:translateY(-92px)} }
@keyframes game-spin { 0%{opacity:0;transform:translate(-50%,-50%) rotate(0) scale(.8)} 25%{opacity:.9} 100%{opacity:0;transform:translate(-50%,-50%) rotate(420deg) scale(1.15)} }
@keyframes game-tumble { 0%{opacity:0;transform:translate(-35px,30px) rotate(-80deg) scale(.6)} 30%{opacity:1} 100%{opacity:0;transform:translate(55px,-35px) rotate(280deg) scale(1.05)} }
@keyframes game-pulse { 0%{opacity:0;transform:translate(-50%,-50%) scale(.3)} 35%{opacity:.9} 100%{opacity:0;transform:translate(-50%,-50%) scale(2)} }
@keyframes game-fight-impact { 0%{opacity:0;transform:translate(-50%,-50%) scale(.15)} 20%{opacity:1} 62%{opacity:.72} 100%{opacity:0;transform:translate(-50%,-50%) scale(2.35)} }
@keyframes game-nerve-surge { 0%{opacity:0;transform:translate(-50%,-50%) rotate(-42deg) scale(.68)} 25%{opacity:1} 65%{opacity:.92} 100%{opacity:0;transform:translate(-50%,-50%) rotate(34deg) scale(1.12)} }
@keyframes game-cards { 0%{opacity:0;transform:translate(-50%,15%) rotate(-18deg) scale(.7)} 55%{opacity:.95} 100%{opacity:0;transform:translate(-50%,-90%) rotate(9deg) scale(1.12)} }
@keyframes game-shine { from{opacity:0;left:-45%} 25%{opacity:1} to{opacity:0;left:125%} }
@keyframes game-duel { from{opacity:.25;transform:scale(.75) rotate(-2deg)} to{opacity:1;transform:scale(1.12) rotate(2deg)} }
@keyframes game-grid { 0%,100%{opacity:.2;filter:hue-rotate(0deg) drop-shadow(0 0 4px #ffd75c)} 50%{opacity:1;filter:hue-rotate(80deg) drop-shadow(0 0 10px #fff)} }
@keyframes game-bubbles { 0%{opacity:0;transform:translateY(25px) scale(.6)} 30%{opacity:.9} 100%{opacity:0;transform:translateY(-110px) scale(1.25)} }
@keyframes game-coin { 0%{opacity:0;transform:translate(-50%,25%) rotateY(0) scale(.55)} 35%{opacity:1} 100%{opacity:0;transform:translate(-50%,-95%) rotateY(720deg) scale(1.1)} }
@keyframes game-reel { 0%{opacity:0;transform:translateY(-20px)} 35%{opacity:1} 100%{opacity:0;transform:translateY(105px)} }
@keyframes game-sicbo { 0%{opacity:0;transform:translate(-18px,24px) rotate(-32deg) scale(.65)} 38%{opacity:1} 100%{opacity:0;transform:translate(38px,-32px) rotate(330deg) scale(1.08)} }
@keyframes game-candy { 0%{opacity:0;transform:translateY(-22px) rotate(-8deg)} 28%{opacity:1} 72%{opacity:.9} 100%{opacity:0;transform:translateY(92px) rotate(24deg)} }
@keyframes game-gold-pulse { 0%{opacity:0;transform:translate(-50%,-50%) scale(.35) rotateY(0)} 38%{opacity:1} 100%{opacity:0;transform:translate(-50%,-50%) scale(1.65) rotateY(360deg)} }
@keyframes game-gem-cascade { 0%{opacity:0;transform:translateY(-24px) rotate(45deg) scale(.7);filter:hue-rotate(0deg) drop-shadow(0 0 5px #42d7ff)} 30%{opacity:1} 100%{opacity:0;transform:translateY(92px) rotate(135deg) scale(1.08);filter:hue-rotate(75deg) drop-shadow(0 0 10px #fff)} }
@keyframes game-book-glow { from{opacity:.28;transform:translate(-50%,-50%) perspective(90px) rotateX(20deg) scale(.72);filter:brightness(.85)} to{opacity:1;transform:translate(-50%,-50%) perspective(90px) rotateX(2deg) scale(1.12);filter:brightness(1.35)} }
@keyframes game-loot-burst { 0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)} 36%{opacity:1} 100%{opacity:0;transform:translate(-50%,-50%) scale(2.1) rotate(120deg)} }

/* Live history / bets table (Figma: dark rows, tab buttons, profit color) */
.live-section {
    padding: 0 clamp(12px, 2vw, 20px) 30px;
}
.live-section .table-container {
    background: rgba(255,255,255,0.02);
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.05);
}
.live-section .avatar-field .icon-small {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px;
}
/* Tab bar: All bets / My bets */
.table-tabs {
    display: flex;
    align-items: center;
    padding: 10px 12px;
    gap: 8px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}
.table-tab-btn {
    padding: 6px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}
.table-tab-btn.active {
    background: #8d3bde;
    color: #fff;
}
.table-tab-btn:not(.active) {
    background: transparent;
    color: #acacac;
}
.table-tab-btn:not(.active):hover {
    background: rgba(255,255,255,0.06);
    color: #fff;
}
.table-live-toggle {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #acacac;
}
.table-empty-msg {
    padding: 28px 12px;
    text-align: center;
    font-size: 13px;
    color: #acacac;
}

/* Table header row */
.table-container .table-header {
    background: rgba(255,255,255,0.04);
    border-bottom: 1px solid rgba(255,255,255,0.05);
}
.table-container .table-row {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    gap: 8px;
}
.table-container .table-header .table-column {
    font-size: 11px;
    font-weight: 600;
    color: #acacac;
    text-transform: none;
    letter-spacing: 0;
    flex: 1;
}
.table-container .table-body .table-row {
    border-bottom: 1px solid rgba(255,255,255,0.03);
    transition: background 0.12s;
}
.table-container .table-body .table-row:hover {
    background: rgba(255,255,255,0.04);
}
.table-container .table-body .table-column {
    flex: 1;
    font-size: 13px;
    color: rgba(255,255,255,0.8);
}
/* Positive profit highlight */
.table-container .profit-pos,
.table-container .text-green,
.table-container [style*="color:green"],
.table-container [style*="color: green"] {
    color: #09b95b !important;
    font-weight: 600;
}

/* ---- FOOTER (Figma redesign: #2b2333 bg, two nav columns) ---- */
.footer {
    background: #2b2333 !important;
    border-top: 1px solid rgba(255,255,255,0.05) !important;
    padding: clamp(20px, 3vw, 32px) clamp(100px, 4vw, 56px) !important;
    /* Reset old style.css: width:calc(100%+160px); margin:50px -80px -40px; float:left */
    width: auto !important;
    margin: 0 0 0 160px !important;
    float: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.footer-figma-inner {
    max-width: 1168px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}
.footer-figma-brand {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 280px;
    flex-shrink: 0;
}
.footer-figma-brand > a { display: block; text-decoration: none; }
.footer-figma-brand img {
    height: auto;
    width: auto;
    max-width: 240px;
    object-fit: contain;
    object-position: left;
}
.footer-figma-desc {
    font-size: 12px;
    line-height: 16px;
    color: #acacac;
    margin: 0;
    font-weight: 400;
}
.footer-figma-crypto {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 2px;
}
.footer-figma-crypto img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    opacity: 0.5;
    transition: opacity 0.18s;
}
.footer-figma-crypto img:hover { opacity: 1; }
.footer-figma-nav {
    display: flex;
    gap: 80px;
    flex-shrink: 0;
}
.footer-figma-col {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.footer-figma-heading {
    font-size: 14px;
    font-weight: 600;
    color: #7f7f7f;
    display: block;
    margin-bottom: 0;
}
.footer-figma-col a {
    font-size: 14px;
    font-weight: 600;
    color: #fff !important;
    text-decoration: none !important;
    transition: opacity 0.15s;
    display: block;
    white-space: nowrap;
}
.footer-figma-col a:hover { opacity: 0.65; }

/* Hide old footer element classes if they leak in */
.footer > .stats,
.footer > .social,
.footer > ul.links,
.footer > .crypto,
.footer > .license { display: none !important; }

/* ---- INPUTS (Figma design system) ---- */
/* Applied to modal/form inputs only — game bet inputs have their own CSS */
.modal input[type="text"]:not(.field_element_input),
.modal input[type="password"]:not(.field_element_input),
.modal input[type="email"]:not(.field_element_input),
.modal input[type="number"]:not(.field_element_input),
.modal textarea:not(.field_element_input),
.modal select:not(.field_element_input),
.form-field input[type="text"],
.form-field input[type="password"],
.form-field input[type="email"],
.form-field input[type="number"],
.form-field select,
.figma-input {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 6px !important;
    padding: 10px 12px !important;
    font-size: 16px !important;
    color: #fff !important;
    transition: border-color 0.18s, box-shadow 0.18s !important;
    box-sizing: border-box;
    outline: none !important;
}
.modal input[type="text"]:not(.field_element_input):hover,
.modal input[type="password"]:not(.field_element_input):hover,
.modal input[type="email"]:not(.field_element_input):hover {
    border-color: #8d3bde !important;
}
.modal input[type="text"]:not(.field_element_input):focus,
.modal input[type="password"]:not(.field_element_input):focus,
.modal input[type="email"]:not(.field_element_input):focus,
.figma-input:focus {
    border-color: #8d3bde !important;
    box-shadow: 0 0 0 2px #3b274f !important;
}

input::placeholder { color: #acacac; opacity: 1; }

/* Input label (Figma: 14px, #dbdbdb) */
.input-label {
    display: block;
    font-size: 14px;
    font-weight: 400;
    color: #dbdbdb;
    margin-bottom: 4px;
}

/* Chip buttons (bet shortcuts: 1/2, 2x, Max — Figma: #3b274f bg) */
.bet-chips, .input-chips {
    display: flex;
    gap: 4px;
    align-items: center;
}
.bet-chip {
    background: #3b274f;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 14px;
    color: #acacac;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    border: none;
    white-space: nowrap;
}
.bet-chip:hover { background: #4c2b6c; color: #fff; }

/* ---- AUTH MODALS ---- */

/* ── Auth modal styled base (shared by modals + login page card) ── */
.auth-modal-styled {
    background: radial-gradient(circle at 12% 0,rgba(139,72,232,.2),transparent 36%),linear-gradient(155deg,#241a30,#17111f 70%) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    border-radius: 20px !important;
    box-shadow: 0 32px 90px rgba(2,0,8,.7),inset 0 1px rgba(255,255,255,.05) !important;
    overflow: hidden !important;
}

/* Auth is a contained sheet: the viewport never clips it, and long panels
   scroll inside the surface instead of moving controls beyond reach. */
body.modal-open { overflow: hidden; overscroll-behavior: none; }
#modal_auth .modal-dialog {
    box-sizing: border-box;
    padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    overflow: hidden;
}
#modal_auth .modal-content {
    min-width: 0;
    max-height: calc(100dvh - 32px) !important;
    overscroll-behavior: contain;
}
#modal_auth .auth-modal-body {
    min-height: 0;
    overflow: hidden;
}
#modal_auth .switch_content {
    width: 100%;
    min-height: 0;
    max-height: calc(100dvh - 34px);
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    float: none;
    transform: none;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.24) transparent;
}
#modal_auth .switch_content::-webkit-scrollbar { width: 6px; }
#modal_auth .switch_content::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(255,255,255,.22); }
#modal_auth .switch_content::-webkit-scrollbar-track { background: transparent; }

/* ── Login page (guest access to protected pages) ── */
.login-page-wrap {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 48px 16px;
    min-height: 60vh;
}
.login-page-card {
    width: 440px;
    max-width: calc(100vw - 32px);
    display: block !important;
}
/* Tab header: "Log in / Sign up" titles as clickable switchers */
.login-page-card .auth-modal-hdr {
    cursor: default;
    gap: 12px;
}
.login-page-card .auth-modal-hdr .modal-auth-title {
    cursor: pointer;
    opacity: 1;
    transition: opacity 0.18s;
}
.login-page-card .auth-modal-hdr .modal-auth-title.lp-tab-dim {
    opacity: 0.35;
    font-weight: 400;
}
.lp-tab-sep {
    color: rgba(255,255,255,0.2);
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
}

/* Shared dark modal style for all auth modals */
#modal_auth .modal-content,
#modal_auth_initializing .modal-content,
#modal_auth_change_password .modal-content,
#modal_auth_recover .modal-content {
    background: radial-gradient(circle at 12% 0,rgba(139,72,232,.2),transparent 36%),linear-gradient(155deg,#241a30,#17111f 70%) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    border-radius: 20px !important;
    box-shadow: 0 32px 90px rgba(2,0,8,.7),inset 0 1px rgba(255,255,255,.05) !important;
    overflow: hidden !important;
    max-width: 440px !important;
    width: 440px;
}

#modal_auth .lgn { display: none !important; }

/* Inner wrapper – no padding; header and form handle their own */
.auth-modal-body {
    padding: 0;
}

/* Panel header row: title + close (or back + title + close) */
.auth-modal-hdr {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(255,255,255,0.12);
    margin-bottom: 0;
    position: sticky;
    top: 0;
    z-index: 4;
    background: rgba(29,21,39,.88);
    -webkit-backdrop-filter: blur(20px) saturate(150%);
    backdrop-filter: blur(20px) saturate(150%);
}

.auth-modal-hdr--identity { gap: 13px; padding: 22px 24px; }
.auth-panel-heading {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 13px;
}
.auth-panel-icon {
    display: grid;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    place-items: center;
    border: 1px solid rgba(177,128,255,.24);
    border-radius: 14px;
    background: rgba(139,72,232,.13);
    color: #c49af5;
    font-size: 17px;
    box-shadow: inset 0 1px rgba(255,255,255,.06);
}
.auth-panel-copy { display: flex; min-width: 0; flex-direction: column; }
.auth-panel-copy small {
    margin-bottom: 3px;
    color: #91849c;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .11em;
    line-height: 1;
    text-transform: uppercase;
}
.auth-panel-copy .modal-auth-title { font-size: 21px; line-height: 1.15; }

.auth-modal-hdr .modal-auth-title {
    flex: 1;
    margin-bottom: 0;
}

/* Title */
.modal-auth-title {
    font-family: var(--site-font-display);
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0;
}

/* X close button – dark circle */
.auth-modal-x {
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,0.6) !important;
    font-size: 13px;
    cursor: pointer;
    padding: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    flex-shrink: 0;
    transition: background 0.2s, color 0.2s;
}
.auth-modal-x:hover {
    background: rgba(255,255,255,.09) !important;
    color: #fff !important;
}

/* Logout confirmation uses the same dark, layered visual language as the
   redesigned account surfaces while keeping its destructive action distinct. */
#modal_auth_logout .modal-dialog {
    padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    background: rgba(4,2,9,.78);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
#modal_auth_logout .logout-modal-styled {
    width: min(440px, calc(100vw - 32px));
    min-width: 0;
    max-width: 440px;
    max-height: calc(100dvh - 32px);
    overflow: auto;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 20px;
    background: radial-gradient(circle at 12% 0,rgba(139,72,232,.2),transparent 36%),linear-gradient(155deg,#241a30,#17111f 70%);
    box-shadow: 0 32px 90px rgba(2,0,8,.7),inset 0 1px rgba(255,255,255,.05);
}
.logout-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 24px;
    border-bottom: 1px solid rgba(255,255,255,.075);
}
.logout-modal-heading { display: flex; min-width: 0; align-items: center; gap: 13px; }
.logout-modal-icon {
    display: grid;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    place-items: center;
    border: 1px solid rgba(255,106,126,.24);
    border-radius: 14px;
    background: rgba(255,82,108,.09);
    color: #ff8295;
    font-size: 18px;
    box-shadow: inset 0 1px rgba(255,255,255,.05);
}
.logout-modal-kicker {
    display: block;
    margin-bottom: 3px;
    color: #8e8298;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}
.logout-modal-title { color: #fff; font-family: var(--site-font-display); font-size: 21px; font-weight: 800; line-height: 1.1; }
.logout-modal-body { padding: 22px 24px 24px; }
.logout-modal-prompt {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.065);
    border-radius: 12px;
    background: rgba(7,4,12,.28);
}
.logout-modal-prompt-icon {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    border-radius: 9px;
    background: rgba(154,91,239,.12);
    color: #bd91f1;
    font-size: 12px;
}
.logout-modal-prompt p { margin: 0; color: #c8bfce; font-size: 14px; line-height: 1.45; }
.logout-modal-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 10px; margin-top: 18px; }
.logout-modal-actions form,.logout-modal-all-form { display: block; margin: 0; padding: 0; }
.logout-modal-button {
    display: inline-flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 11px;
    color: #fff;
    font: 800 11px/1.25 var(--site-font-display);
    letter-spacing: .035em;
    cursor: pointer;
    transition: transform .16s,filter .16s,border-color .16s,background .16s;
}
.logout-modal-button:hover { transform: translateY(-1px); }
.logout-modal-button:focus-visible { outline: 2px solid #b67cff; outline-offset: 2px; }
.logout-modal-cancel { border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.045); color: #b9afc1; }
.logout-modal-cancel:hover { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.075); color: #fff; }
.logout-modal-confirm { border: 1px solid rgba(255,126,144,.2); background: linear-gradient(135deg,#d83d59,#f06478); box-shadow: 0 10px 24px rgba(205,45,74,.2),inset 0 1px rgba(255,255,255,.16); }
.logout-modal-confirm:hover { filter: brightness(1.08); }
.logout-modal-divider { display: flex; align-items: center; margin: 16px 0; }
.logout-modal-divider span { width: 100%; height: 1px; background: rgba(255,255,255,.07); }
.logout-modal-all { border: 1px solid rgba(171,119,255,.2); background: rgba(135,74,225,.1); color: #c6a6ed; }
.logout-modal-all:hover { border-color: rgba(177,128,255,.4); background: rgba(135,74,225,.18); color: #fff; }

@media (max-width: 420px) {
    .logout-modal-header { padding: 18px; }
    .logout-modal-body { padding: 18px; }
    .logout-modal-actions { grid-template-columns: 1fr; }
    .logout-modal-title { font-size: 19px; }
}

.auth-modal-x:focus-visible,
.auth-back-btn:focus-visible,
.auth-eye-btn:focus-visible,
.auth-switch-link:focus-visible,
.auth-forgot-link:focus-visible {
    outline: 2px solid rgba(142,98,255,.95);
    outline-offset: 2px;
}

/* Back arrow button */
.auth-back-btn {
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,0.5) !important;
    font-size: 15px;
    cursor: pointer;
    padding: 0;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    flex-shrink: 0;
    transition: color 0.2s;
}
.auth-back-btn:hover { color: #fff !important; background: rgba(255,255,255,.09) !important; }

/* Form layout */
.auth-modal-body form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 22px 24px 24px;
}

/* Field wrapper: label stacked above input with tight gap */
.auth-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Labels */
.auth-label {
    font-size: 14px;
    font-weight: 400;
    color: rgba(255,255,255,0.65);
}

/* Input wrapper for password + eye toggle */
.auth-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

/* Inputs */
.auth-input {
    background: rgba(7,4,12,.3) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 11px !important;
    padding: 10px 12px !important;
    font-size: 15px !important;
    color: #fff !important;
    width: 100%;
    box-sizing: border-box;
    outline: none;
    height: 52px;
    transition: border-color 0.18s, box-shadow 0.18s;
}
.auth-input--pw { padding-right: 44px !important; }
.auth-input::placeholder { color: rgba(255,255,255,0.22); }
.auth-input:hover { border-color: rgba(255,255,255,0.25) !important; }
.auth-input:focus {
    border-color: #09b95b !important;
    box-shadow: 0 0 0 3px rgba(9,185,91,0.15) !important;
}

/* Eye toggle button inside password field */
.auth-eye-btn {
    position: absolute;
    right: 12px;
    background: none !important;
    border: none !important;
    color: rgba(255,255,255,0.35) !important;
    font-size: 15px;
    cursor: pointer;
    padding: 0;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    line-height: 1;
    transition: color 0.18s;
}
.auth-eye-btn:hover { color: rgba(255,255,255,0.7) !important; }

/* Input error state (Figma node 3273-3211) */
.auth-input--error {
    border-color: #ff9a2e !important;
    box-shadow: none !important;
}
.auth-field-error {
    font-size: 12px;
    line-height: 16px;
    color: #ffb066;
    margin-top: 2px;
    display: none;
}
.auth-field-error.show { display: block; }
.auth-field-hint {
    color: rgba(255,255,255,0.45);
    font-size: 12px;
    line-height: 16px;
    margin-top: 2px;
}

.two-factor-page-header { padding: 0 14px 4px; }
.auth-modal-body > .switch_content[data-panel="two-factor"] { scrollbar-gutter: stable; }
.two-factor-shield {
    width: 54px;
    height: 54px;
    margin: 0 auto 2px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    color: #31dc80;
    font-size: 25px;
    background: rgba(9,185,91,.12);
    border: 1px solid rgba(49,220,128,.25);
}
.two-factor-copy,
.two-factor-verify-copy {
    margin: 0;
    color: rgba(255,255,255,.62);
    font-size: 13px;
    line-height: 1.55;
}
.two-factor-qr-wrap {
    width: 220px;
    max-width: 100%;
    margin: 2px auto;
    padding: 12px 12px 9px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    border-radius: 14px;
    background: #fff;
    box-sizing: border-box;
    align-self: center;
}
.two-factor-qr {
    display: block;
    width: 196px;
    height: 196px;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    image-rendering: pixelated;
}
.two-factor-qr-wrap small {
    color: #354239;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}
.two-factor-qr-wrap.qr-unavailable {
    min-height: 54px;
    justify-content: center;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
}
.two-factor-qr-wrap.qr-unavailable canvas { display: none; }
.two-factor-qr-wrap.qr-unavailable small { color: rgba(255,255,255,.55); }
.two-factor-secret {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 12px;
    border-radius: 8px;
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.12);
}
.two-factor-secret code {
    flex: 1;
    color: #fff;
    overflow-wrap: anywhere;
    font-size: 14px;
    letter-spacing: 1.5px;
}
.two-factor-secret button {
    border: 0;
    background: transparent;
    color: #31dc80;
    cursor: pointer;
    font-size: 16px;
}
.two-factor-open-app { color: #31dc80 !important; font-size: 13px; font-weight: 600; }
.two-factor-code { text-align: center; font-size: 22px !important; letter-spacing: 8px; font-variant-numeric: tabular-nums; }

@media (max-width: 420px) {
    .two-factor-qr-wrap { width: 190px; }
    .two-factor-qr { width: 166px; height: 166px; }
}

/* Forgot password row (right-aligned) */
.auth-forgot-row {
    display: flex;
    justify-content: flex-end;
    margin-top: -8px;
}
.auth-forgot-link {
    background: none !important;
    border: none !important;
    color: #7f7f7f !important;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    padding: 0;
    text-decoration: none;
    transition: color 0.2s;
}
.auth-forgot-link:hover { color: #fff !important; }

/* Primary button (green) */
.auth-btn-primary {
    width: 100%;
    background: linear-gradient(135deg,#08a954,#19ca6f) !important;
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
    padding: 0 24px;
    border-radius: 11px;
    border: none;
    cursor: pointer;
    height: 52px;
    margin-top: 4px;
    box-shadow: 0 10px 24px rgba(9,185,91,.2),inset 0 1px rgba(255,255,255,.16);
    transition: filter .2s, transform .2s;
}
.auth-btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.auth-btn-primary:focus-visible { outline: 3px solid rgba(49,220,128,.34); outline-offset: 2px; }
.auth-btn-primary:disabled { opacity: .55; cursor: wait; }

@media (max-width: 600px) {
    #modal_auth {
        --auth-mobile-top: max(12px, calc(env(safe-area-inset-top) + 8px));
        --auth-mobile-bottom: max(12px, env(safe-area-inset-bottom));
    }
    #modal_auth .modal-dialog {
        align-items: flex-start !important;
        padding: var(--auth-mobile-top) 12px var(--auth-mobile-bottom);
    }
    #modal_auth .modal-content {
        width: 100% !important;
        max-width: 100% !important;
        max-height: calc(100dvh - var(--auth-mobile-top) - var(--auth-mobile-bottom)) !important;
        margin: 0 !important;
        border-radius: 22px !important;
    }
    #modal_auth .switch_content {
        max-height: calc(100dvh - var(--auth-mobile-top) - var(--auth-mobile-bottom));
    }
    #modal_auth .auth-modal-hdr {
        min-height: 72px;
        box-sizing: border-box;
        padding: 18px 16px 10px;
    }
    #modal_auth .auth-modal-hdr--identity { padding-top: 20px; padding-bottom: 12px; }
    #modal_auth .auth-panel-heading { gap: 10px; }
    #modal_auth .auth-panel-icon { width: 42px; height: 42px; flex-basis: 42px; border-radius: 12px; }
    #modal_auth .auth-panel-copy .modal-auth-title { font-size: 19px; }
    #modal_auth .auth-modal-hdr::before {
        content: '';
        position: absolute;
        top: 7px;
        left: 50%;
        width: 36px;
        height: 5px;
        border-radius: 999px;
        background: rgba(255,255,255,.22);
        transform: translateX(-50%);
    }
    #modal_auth .modal-auth-title { font-size: 22px; }
    #modal_auth .auth-modal-body form {
        gap: 14px;
        padding: 16px max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    }
    #modal_auth .auth-input,
    #modal_auth .auth-btn-primary { min-height: 52px; }
}

@media (max-height: 560px) and (orientation: landscape) {
    #modal_auth .modal-dialog { align-items: stretch !important; padding: 8px; }
    #modal_auth .modal-content { max-height: calc(100dvh - 16px) !important; }
    #modal_auth .switch_content { max-height: calc(100dvh - 16px); }
    #modal_auth .auth-modal-hdr { padding: 10px 14px; }
}

@media (prefers-reduced-motion: reduce) {
    #modal_auth, #modal_auth .modal-content { transition: none !important; }
}

/* Secondary button (outline/muted) */
.auth-btn-secondary {
    width: 100%;
    background: rgba(255,255,255,0.05) !important;
    color: rgba(255,255,255,0.65) !important;
    font-size: 14px;
    font-weight: 500;
    padding: 0 24px;
    border-radius: 6px;
    border: 1px solid rgba(255,255,255,0.1) !important;
    cursor: pointer;
    height: 44px;
    transition: all 0.2s;
}
.auth-btn-secondary:hover {
    background: rgba(255,255,255,0.1) !important;
    color: #fff !important;
}

/* "Don't have an account? Register" row */
.auth-switch-text {
    text-align: center;
    font-size: 13px;
    color: #acacac;
    margin: 4px 0 0;
}
.auth-switch-link {
    background: none !important;
    border: none !important;
    color: #09b95b !important;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    padding: 0;
    text-decoration: none;
    transition: color 0.2s;
    display: inline;
}
.auth-switch-link:hover { color: #0dcf69 !important; }

/* ---- TOGGLE SWITCH (Figma) ---- */
/* Used in table "Live bets" toggle */
.toggle-switch {
    position: relative;
    display: inline-block;
    width: 42px;
    height: 24px;
    cursor: pointer;
}
.toggle-switch input { opacity: 0; width: 0; height: 0; }
.toggle-slider {
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.12);
    border-radius: 30px;
    transition: background 0.2s;
}
.toggle-slider:before {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    background: rgba(255,255,255,0.4);
    border-radius: 50%;
    left: 3px;
    top: 3px;
    transition: transform 0.2s, background 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.toggle-switch input:checked + .toggle-slider {
    background: #4c2b6c;
}
.toggle-switch input:checked + .toggle-slider:before {
    transform: translateX(18px);
    background: #8d3bde;
}

/* ---- TOASTR OVERRIDES (Figma toast design) ---- */
#toast-container > div {
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.45) !important;
    opacity: 1 !important;
    padding: 10px 16px 10px 42px !important;
    min-width: 240px;
    max-width: 320px;
    border-left: 3px solid transparent !important;
    cursor: pointer;
}
#toast-container > div .toast-message {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%;
}
#toast-container > div.toast-expanded {
    max-width: 380px;
}
#toast-container > div.toast-expanded .toast-message {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
}
#toast-container > .toast-success {
    background-color: #1e2f26 !important;
    background-image: none !important;
    border-left-color: #09b95b !important;
}
#toast-container > .toast-info {
    background-color: #2d2d2d !important;
    background-image: none !important;
    border-left-color: #929292 !important;
}
#toast-container > .toast-error {
    background-color: #392d23 !important;
    background-image: none !important;
    border-left-color: #ff9a2e !important;
}
#toast-container > .toast-warning {
    background-color: #392d23 !important;
    background-image: none !important;
    border-left-color: #ff9a2e !important;
}
.toast-title {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 2px;
}
.toast-message {
    font-size: 14px !important;
    color: #acacac !important;
}
.toast-success .toast-message { color: #41cc82 !important; }
.toast-error .toast-message,
.toast-warning .toast-message { color: #ffb066 !important; }
.toast-close-button { color: rgba(255,255,255,0.5) !important; }
.toast-close-button:hover { color: #fff !important; }

/* ---- RESPONSIVE ---- */
@media (max-width: 1280px) {
    .header-inner { padding: 8px 32px; }
    .footer { padding: 32px 32px !important; margin: 0 0 0 160px !important; }
    .footer-figma-nav { gap: 48px; }
}

@media (max-width: 1024px) {
    .left-sidebar { display: none; }
    .header-inner { padding: 8px 20px; }
    .header-max { margin-left: 0; }
    .sidebar-toggle-btn { display: inline-flex; }
    .wrapper-page { margin-left: 0; }
    .footer { padding: 32px 24px !important; margin: 0 !important; }
    .footer-figma-inner { flex-wrap: wrap; gap: 32px; }
    .footer-figma-nav { gap: 40px; }
}

/* Mobile sidebar drawer */
@media (max-width: 1024px) {
    .left-sidebar {
        display: flex !important;
        position: fixed !important;
        top: 0 !important;
        left: -200px !important;
        height: 100vh !important;
        /* dvh accounts for the collapsing mobile address bar so the drawer
           reaches the real bottom of the screen instead of being cut off. */
        height: 100dvh !important;
        z-index: 999 !important;
        transition: left 0.25s ease !important;
        box-shadow: 4px 0 24px rgba(0,0,0,0.5);
    }
    .left-sidebar.mobile-open {
        left: 0 !important;
    }
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
    .header-max { display: block !important; margin-left: 0; }
    .header-min { display: none !important; }
    .wrapper-page {
        display: flex !important;
        flex-direction: row !important;
        width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
    }
    .main-panel {
        display: block !important;
        flex: 1 1 auto !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        width: calc(100% - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        min-width: 0 !important;
        margin: 12px !important;
        height: auto !important;
        min-height: calc(100dvh - 68px);
        overflow-y: visible !important;
    }
    #page_content,
    #page_content2 {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    .slider.slider-right[data-pullout="chat"] {
        position: fixed !important;
        right: 0 !important;
        left: auto !important;
        top: 100px !important;
        z-index: 220 !important;
    }
    .slider.slider-right[data-pullout="chat"][data-isvisible="false"] {
        right: 0 !important;
        top: 100px !important;
    }
    .slider.slider-right[data-pullout="chat"][data-isvisible="true"] {
        right: min(310px, 88vw) !important;
        top: 100px !important;
    }
    .pullout[data-pullout="chat"] {
        display: none !important;
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        right: calc(-1 * min(310px, 88vw)) !important;
        width: min(310px, 88vw) !important;
        height: 93vh !important;
        margin: 0 !important;
        float: none !important;
        z-index: 210 !important;
        transition: right 0.25s ease !important;
    }
    .pullout[data-pullout="chat"].active {
        display: flex !important;
        right: 0 !important;
    }
    .hero-btn { font-size: 12px; padding: 8px 16px; }
    .footer { padding: 24px 16px !important; margin: 0 !important; }
    .footer-figma-inner { flex-direction: column; align-items: flex-start; gap: 24px; }
    .footer-figma-nav { flex-wrap: wrap; gap: 28px; }
    .btn-login, .btn-signup { width: auto; height: 40px; }
}

@media (max-width: 480px) {
    .header-inner {
        padding: 8px 10px;
        gap: 6px;
    }
    .header-inner-auth {
        grid-template-columns: 44px minmax(0, 1fr) 44px;
    }
    .sidebar-toggle-btn,
    .btn-icon-sq {
        width: 44px;
        height: 44px;
    }
    .header-balance-widget {
        max-width: calc(100vw - 116px);
        height: 44px;
    }
    .header-balance-field {
        min-width: 0;
        padding: 8px 10px;
    }
    .header-balance-field .balance {
        font-size: 13px;
    }
    .btn-wallet {
        padding: 10px 12px;
    }
    .btn-wallet span {
        display: none;
    }
    .nav-icon {
        width: 20px;
        height: 20px;
    }
    .online {
        display: none;
    }
    .header-auth-btns {
        gap: 6px;
        /* .online (which carried margin-right:auto) is hidden here, so push the
           auth buttons to the right corner explicitly. */
        margin-left: auto;
    }
    .btn-login,
    .btn-signup {
        height: 40px;
        padding: 0 12px;
        font-size: 12px !important;
    }
    .hero-btn { font-size: 11px; padding: 6px 14px; }
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
    /* Chat launcher becomes a bottom-right circular FAB on mobile — the
       standard placement/shape for a chat entry point (WhatsApp/Intercom-
       style), instead of the desktop's edge tab. The panel itself stays
       closed until this is tapped (see profile_settings.chat default). */
    .slider.slider-right[data-pullout="chat"] {
        top: auto !important;
        bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
        right: 16px !important;
        left: auto !important;
        width: 56px !important;
        height: 56px !important;
        border-radius: 50% !important;
        border: none !important;
        background: var(--site-color-main) !important;
        box-shadow: 0 6px 18px rgba(141, 59, 222, 0.45), 0 2px 8px rgba(0, 0, 0, 0.35) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 22px !important;
        color: #fff !important;
        z-index: 230 !important;
    }
    .slider.slider-right[data-pullout="chat"]:hover {
        width: 56px !important;
    }
    .slider.slider-right[data-pullout="chat"] i {
        margin: 0 !important;
    }

    .footer {
        margin: 0 !important;
        padding: 24px 14px calc(24px + env(safe-area-inset-bottom, 0px)) !important;
        background: #2b2333 !important;
        border-top: 1px solid rgba(255,255,255,0.08) !important;
    }
    .footer-figma-inner {
        width: 100%;
        max-width: none;
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
        align-items: start;
    }
    .footer-figma-brand {
        width: 100%;
        max-width: none;
        align-items: center;
        text-align: center;
        gap: 10px;
    }
    .footer-figma-brand img {
        max-width: min(168px, 58vw);
        max-height: 100px;
        margin: 0 auto;
    }
    .footer-figma-desc {
        max-width: 22rem;
        color: rgba(255,255,255,0.62);
        font-size: 12px;
        line-height: 1.5;
    }
    .footer-figma-crypto {
        justify-content: center;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 4px;
    }
    .footer-figma-crypto img {
        width: 30px;
        height: 30px;
        opacity: 0.75;
    }
    .footer-figma-nav {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .footer-figma-col {
        min-width: 0;
        gap: 6px;
        padding: 12px;
        background: rgba(255,255,255,0.04);
        border: 1px solid rgba(255,255,255,0.07);
        border-radius: 8px;
        text-align: center;
    }
    .footer-figma-heading {
        margin-bottom: 4px;
        color: #acacac;
        font-size: 12px;
        font-weight: 800;
        text-transform: uppercase;
    }
    .footer-figma-col a {
        min-height: 36px;
        align-items: center;
        padding: 6px 0;
        color: rgba(255,255,255,0.88) !important;
        font-size: 13px;
        font-weight: 700;
        white-space: normal;
        line-height: 1.25;
    }
}

@media (max-width: 420px) {
    .footer-figma-nav {
        grid-template-columns: 1fr;
    }
}

/* =========================================
   MINES GAME REDESIGN
   ========================================= */

.mines-game-layout {
    display: flex;
    border-radius: 8px;
    overflow: hidden;
    min-height: 400px;
    margin-bottom: 24px;
    border: 1px solid rgba(255,255,255,0.05);
}

/* ── Left panel ── */
.mines-controls {
    width: clamp(260px, 28vw, 340px);
    min-width: 240px;
    background: #3b274f;
    border-right: 1px solid rgba(255,255,255,0.05);
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
}

.mines-segment {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.mines-label {
    font-size: 14px;
    color: #dbdbdb;
    font-weight: 400;
}

/* Grid size tabs */
.mines-grid-tabs {
    display: flex;
    gap: 8px;
    background: rgba(255,255,255,0.05);
    border-radius: 6px;
    padding: 4px;
}

.mines-grid-btn {
    flex: 1;
    background: transparent;
    border: none;
    border-radius: 4px;
    color: #acacac;
    font-size: 16px;
    font-weight: 500;
    padding: 8px 4px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    line-height: 20px;
}

.mines-grid-btn.active {
    background: #8d3bde;
    color: #fff;
}

.mines-grid-btn:not(.active):hover {
    background: rgba(255,255,255,0.06);
    color: #fff;
}

/* Input rows (bet amount + mines counter share some styles) */
.mines-input-row {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 6px;
    padding: 10px 12px;
    width: 100%;
    box-sizing: border-box;
}

.mines-input-icon {
    color: #acacac;
    font-size: 15px;
    flex-shrink: 0;
    width: 20px;
    text-align: center;
}

.mines-input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: #fff;
    font-size: 16px;
    min-width: 0;
    padding: 0;
}

.mines-input::placeholder { color: #acacac; }
.mines-input::-webkit-outer-spin-button,
.mines-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.mines-input[type=number] { -moz-appearance: textfield; }

/* Bet shortcut chips */
.mines-chips {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}

.mines-chip {
    background: #3b274f;
    border: none;
    border-radius: 4px;
    color: #acacac;
    font-size: 14px;
    padding: 6px 10px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.mines-chip:hover {
    background: #4c2b6c;
    color: #fff;
}

/* Mines counter (input + up/down buttons) */
.mines-counter-row {
    display: flex;
    align-items: stretch;
    width: 100%;
}

.mines-counter-input {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.12);
    border-right: none;
    border-radius: 6px 0 0 6px;
    padding: 10px 12px;
    flex: 1;
    min-width: 0;
}

.mines-counter-btns {
    display: flex;
    flex-direction: column;
    width: 40px;
    flex-shrink: 0;
}

.mines-counter-btn {
    flex: 1;
    background: #8d3bde;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
    padding: 0;
}

.mines-counter-btn:first-child {
    border-radius: 0 6px 0 0;
    border-bottom: 1px solid rgba(255,255,255,0.15);
}

.mines-counter-btn:last-child {
    border-radius: 0 0 6px 0;
}

.mines-counter-btn:hover { background: #7a32c4; }

/* Action buttons */
.mines-btn-place {
    width: 100%;
    height: 52px;
    background: #8d3bde;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
    margin-top: auto;
}

.mines-btn-place:hover { background: #7a32c4; }

.mines-btn-cashout {
    width: 100%;
    height: 52px;
    background: #09b95b;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
    margin-top: 8px;
}

.mines-btn-cashout:hover { background: #08a451; }
.mines-btn-cashout.hidden { display: none; }

/* ── Right panel ── */
.mines-stage {
    flex: 1;
    background: #2b2333;
    display: flex;
    flex-direction: column;
    position: relative;
    min-width: 0;
}

/* Header bar */
.mines-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 24px;
    background: #3b274f;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    flex-shrink: 0;
}

.mines-header-left {
    display: flex;
    align-items: center;
    gap: 6px;
}

.mines-header-icon {
    color: #8d3bde;
    font-size: 16px;
}

.mines-header-title {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

.mines-info-icon {
    color: #acacac;
    font-size: 16px;
    cursor: pointer;
    transition: color 0.15s;
}

.mines-info-icon:hover { color: #fff; }

.mines-fair-link {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.15s;
}

.mines-fair-link:hover { color: #8d3bde; }

/* Tile grid area */
.mines-board-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 40px;
}

/* Stats bar at bottom of right panel */
.mines-stage .stats-mines {
    display: flex;
    justify-content: center;
    gap: 24px;
    padding: 8px 24px;
    background: rgba(0,0,0,0.15);
    border-top: 1px solid rgba(255,255,255,0.05);
    flex-shrink: 0;
}

/* ── Responsive ── */
@media (max-width: 900px) {
    .mines-controls { width: 280px; min-width: 220px; }
}

@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
    .mines-game-layout {
        flex-direction: column;
        min-height: unset;
    }
    /* Game board first, controls (grid size / bet / place bet) below. */
    .mines-stage { order: 1; }
    .mines-controls  {
        order: 2;
        width: 100%;
        min-width: unset;
    }
    .mines-board-wrap {
        padding: 20px;
    }
}

@keyframes hilo-deal {
    from { transform: translateY(-14px) scale(0.92); opacity: 0; }
    to   { transform: translateY(0) scale(1); opacity: 1; }
}

@keyframes bj-deal {
    from { transform: translateY(-12px) scale(0.92); opacity: 0; }
    to   { transform: translateY(0) scale(1); opacity: 1; }
}

@keyframes bcr-deal {
    from { transform: translateY(-12px) scale(0.92); opacity: 0; }
    to   { transform: translateY(0) scale(1); opacity: 1; }
}
@keyframes dt-deal-2026 { from { transform: translateY(-24px) rotateY(70deg) scale(.88); opacity: 0; } to { opacity: 1; } }

@keyframes kn-pop {
    from { transform: scale(1.25); }
    to   { transform: scale(1); }
}

@keyframes ck-shake {
    0% { transform: scale(0.6); }
    60% { transform: scale(1.25); }
    100% { transform: scale(1); }
}

@keyframes cf-spin {
    from { transform: rotateY(0deg); }
    to   { transform: rotateY(360deg); }
}
@keyframes cf-spin-tails {
    from { transform: rotateY(180deg); }
    to   { transform: rotateY(540deg); }
}
@keyframes av-shake-light {
    30% { transform: translate(-3px,1.5px); }
    60% { transform: translate(3px,-1.5px); }
    85% { transform: translate(-1.5px,1px); }
}
@keyframes av-incoming-pulse { from { opacity: .35; } to { opacity: .9; } }
@keyframes av-shake {
    20% { transform: translate(-6px,3px); }
    40% { transform: translate(6px,-3px); }
    60% { transform: translate(-4px,2px); }
    80% { transform: translate(3px,-2px); }
}
@keyframes av-drift { to { background-position: -1100px 0; } }
@keyframes av-sea-flow { to { background-position: calc(58% - 240px) 0, -340px 0; } }
@keyframes av-deck-wake { to { opacity: .45; transform: scaleY(.8); } }
@keyframes av-deck-blink { 50% { opacity: .45; } }
@keyframes av-bob { 0%, 100% { transform: translateY(-7%); } 50% { transform: translateY(7%); } }
@keyframes av-obj-pop {
    40% { transform: scale(1.35); filter: brightness(1.9); }
    100% { transform: scale(.15); opacity: 0; }
}
@keyframes av-rocket-wobble { from { transform: translateY(-8%); } to { transform: translateY(8%); } }
@keyframes av-rkt-flame { from { transform: scaleX(.7); opacity: .75; } to { transform: scaleX(1.2); opacity: 1; } }
@keyframes av-fx-pickup { to { transform: translate(-50%,-50%) scale(3.4); opacity: 0; } }
@keyframes av-spin { to { transform: rotate(360deg); } }
@keyframes av-boom-core { 30% { transform: scale(2.6); } 100% { transform: scale(1.3); opacity: 0; } }
@keyframes av-boom-ring { to { transform: scale(5); opacity: 0; } }
@keyframes av-boom-smoke { to { transform: scale(4) translateY(-12px); opacity: 0; } }
@keyframes av-fx-label {
    20% { transform: translate(-50%,-90%) scale(1.25); opacity: 1; }
    100% { transform: translate(-50%,-230%) scale(1); opacity: 0; }
}
@keyframes av-puff { to { transform: translate(-110%,-50%) scale(2.6); opacity: 0; } }
@keyframes av-flame { from { transform: scaleX(.62); opacity: .72; } to { transform: scaleX(1.15); opacity: 1; } }
@keyframes av-prop { to { transform: scaleY(.15); } }
@keyframes av-sink {
    0% { transform: translate(-50%,-50%) rotate(var(--av-rot,0deg)) rotateX(var(--av-roll,0deg)); }
    30% { transform: translate(-50%,-38%) rotate(26deg); opacity: 1; }
    65% { transform: translate(-50%,-6%) rotate(48deg); opacity: .85; }
    100% { transform: translate(-50%,42%) rotate(64deg); opacity: 0; }
}
@keyframes av-rush { to { transform: translateX(-180px); } }
@keyframes av-ripple {
    0% { width: 12px; height: 12px; opacity: 1; }
    100% { width: 130px; height: 46px; opacity: 0; }
}
@keyframes av-splash-col {
    30% { height: 64px; width: 16px; opacity: 1; }
    100% { height: 6px; opacity: 0; }
}
@keyframes av-chip-pop {
    0% { transform: scale(.4); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}
@keyframes av-mult-pop { 40% { transform: scale(1.16); color: #ffe9a8; } }
@keyframes av-celebration-pop {
    0% { transform: scale(.6); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}
@keyframes av-stall-blink { 50% { opacity: .25; } }
@keyframes av-spray {
    40% { transform: translate(-70%,-160%) scale(1.6); opacity: 1; }
    100% { transform: translate(-90%,-40%) scale(2.1); opacity: 0; }
}
@keyframes av-skid-spark {
    0% { transform: translate(-50%,-50%) scale(1); opacity: 1; }
    100% { transform: translate(calc(-50% - 14px), calc(-50% + 3px)) scale(.3); opacity: 0; }
}
@keyframes av-squash { 40% { transform: translate(-50%,-50%) rotate(var(--av-rot,0deg)) rotateX(var(--av-roll,0deg)) scale(1.12,.82); } }
@keyframes av-stretch { 40% { transform: translate(-50%,-50%) rotate(var(--av-rot,0deg)) rotateX(var(--av-roll,0deg)) scale(1.14,.94); } }
@keyframes av-teeter {
    0%, 100% { transform: translate(-50%,-50%) rotate(calc(var(--av-rot,0deg) + 7deg)) rotateX(var(--av-roll,0deg)); }
    50%      { transform: translate(-50%,-50%) rotate(calc(var(--av-rot,0deg) - 4deg)) rotateX(var(--av-roll,0deg)); }
}
@keyframes av-teeter-pulse { 50% { opacity: .55; } }
@keyframes av-clang {
    0%   { transform: scale(.3); opacity: 1; }
    100% { transform: scale(1.5); opacity: 0; }
}
@keyframes av-whoosh { to { transform: translate(-140%,-50%) scale(1.9,.6); opacity: 0; } }
@keyframes av-flap { from { transform: scaleY(.55); } to { transform: scaleY(1.25); } }
@keyframes av-next-ping {
    0% { transform: scale(.72); opacity: .95; }
    75% { transform: scale(1.28); opacity: 0; }
    100% { opacity: 0; }
}
@keyframes av-combo-hot {
    from { box-shadow: 0 0 12px rgba(255,190,70,.25); }
    to   { box-shadow: 0 0 26px rgba(255,190,70,.55); }
}
@keyframes av-combo-break {
    0%   { opacity: 1; transform: translateY(0) scale(1); }
    30%  { transform: translateY(0) scale(1.08) rotate(-2deg); }
    100% { opacity: 0; transform: translateY(6px) scale(.86); }
}

/* (the lock-on reticle is gone: rockets no longer launch at the plane, so
   there is no interception point to mark.) */
}

/* Motion-sensitivity: the additions above are the loudest things on the page,
   so they are the ones that most need an off switch. The reticle keeps its
   ring (it carries information -- where the hit lands) but stops moving. */
@media (prefers-reduced-motion: reduce) {
    .av-sky.av-shake, .av-sky.av-shake-light { animation: none; }
    .av-sky.av-incoming::after { animation: none; opacity: .6; }
    .av-combo-meter { transition: none; }
    .av-combo-meter.is-hot, .av-combo-meter.is-broken { animation: none; }
}
@keyframes av-wobble {
    25% { margin-top: -6px; margin-left: 2px; }
    55% { margin-top: 5px; margin-left: -3px; }
    80% { margin-top: -2px; margin-left: 1px; }
}
@keyframes av-steam { to { transform: translate(-90%,-130%) scale(2.8); opacity: 0; } }
@keyframes pk-croupier-bob {
    0%, 100% { transform: translate(-50%, -50%) rotate(0deg); }
    50%      { transform: translate(-50%, -52%) rotate(-1.5deg); }
}
@keyframes pk-croupier-deal {
    0%   { transform: scale(1) rotate(0deg); }
    35%  { transform: scale(1.08) rotate(6deg); }
    70%  { transform: scale(1.04) rotate(-4deg); }
    100% { transform: scale(1) rotate(0deg); }
}
@keyframes pk-pop {
    0%   { transform: scale(1); }
    45%  { transform: scale(1.22); }
    100% { transform: scale(1); }
}
@keyframes pk-deal {
    from { transform: translateY(-8px); opacity: 0; }
    to   { transform: translateY(0); opacity: 1; }
}
@keyframes pk-flip-reveal {
    from { transform: rotateY(180deg); }
    to   { transform: rotateY(0deg); }
}
@keyframes pk-chip-stack-land { 0%{transform:translateY(-7px) scale(1.25);filter:brightness(1.5)} 65%{transform:translateY(1px) scale(.94)} 100%{transform:translateY(0) scale(1);filter:none} }
@keyframes pk-badge-pop {
    0%   { transform: scale(0.3) rotate(-30deg); }
    60%  { transform: scale(1.25) rotate(8deg); }
    100% { transform: scale(1) rotate(0deg); }
}
@keyframes pk-urgent-pulse {
    0%, 100% { box-shadow: 0 0 12px rgba(232,64,64,0.35); }
    50%      { box-shadow: 0 0 20px rgba(232,64,64,0.75); }
}
@keyframes pk-turn-pill-in {
    from { opacity: 0; transform: translateX(-50%) translateY(4px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}
@keyframes pk-winning-hole-rise {
    from { transform:translateY(0) scale(1); }
    to { transform:translateY(-15px) scale(1.13); }
}
@keyframes pk-winning-hole-glow {
    0%,100% { box-shadow:0 0 0 2px rgba(243,201,95,.65),0 5px 12px rgba(0,0,0,.48); }
    50% { box-shadow:0 0 0 3px #f3c95f,0 0 25px rgba(243,201,95,1),0 8px 16px rgba(0,0,0,.55); }
}
@keyframes pk-combo-board-pulse {
    0%,100% { transform:translateY(0) scale(1); }
    50% { transform:translateY(-5px) scale(1.08); }
}
@keyframes pk-win-glow {
    0%, 100% { box-shadow: 0 0 10px rgba(245,197,66,0.25); }
    50%      { box-shadow: 0 0 26px rgba(245,197,66,0.85); }
}
@keyframes pk-win-flash-fade {
    0%   { opacity: 1; }
    70%  { opacity: 0.6; }
    100% { opacity: 0; }
}
@keyframes pk-win-amount-rise {
    0%   { opacity: 0; transform: translateX(-50%) translateY(0); }
    15%  { opacity: 1; transform: translateX(-50%) translateY(-6px); }
    75%  { opacity: 1; transform: translateX(-50%) translateY(-22px); }
    100% { opacity: 0; transform: translateX(-50%) translateY(-30px); }
}
@keyframes pk-win-hand-in {
    0%   { opacity: 0; transform: translateX(-50%) scale(0.7); }
    15%  { opacity: 1; transform: translateX(-50%) scale(1); }
    82%  { opacity: 1; transform: translateX(-50%) scale(1); }
    100% { opacity: 0; transform: translateX(-50%) scale(0.9); }
}

@keyframes sl-win-pulse {
    0%, 100% { box-shadow: 0 0 0 2px #09b95b, 0 0 30px rgba(9,185,91,0.45); }
    50% { box-shadow: 0 0 0 3px #2ee36f, 0 0 55px rgba(46,227,111,0.85); }
}

@keyframes sl-shake {
    10%, 90% { transform: translateX(-1px); }
    20%, 80% { transform: translateX(2px); }
    30%, 50%, 70% { transform: translateX(-4px); }
    40%, 60% { transform: translateX(4px); }
}

@keyframes sl-payline-pulse {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}

@keyframes sl-cell-win {
    0%, 100% { transform: scale(1); text-shadow: none; }
    50% { transform: scale(1.25); text-shadow: 0 0 18px rgba(46,227,111,0.9); }
}

/* ═══════════════════════════════════════════════════════════════
   GAME PAGES — TABLE / BETS BACKGROUND OVERRIDES
   Replaces old #130d22 / #1c1538 vars with the new purple scheme
   ═══════════════════════════════════════════════════════════════ */

.rl-page .table-container,
.cr-page .table-container,
.tw-page .table-container,
.pk-page .table-container,
.sl-page .table-container,
.dice-page .table-container,
.limbo-page .table-container,
.wheel-page .table-container,
.minesweeper-page .table-container {
    border-color: rgba(255,255,255,0.07) !important;
    background: #2b2333;
}

/* Header row */
.rl-page .table-header .table-row,
.cr-page .table-header .table-row,
.tw-page .table-header .table-row,
.pk-page .table-header .table-row,
.sl-page .table-header .table-row,
.dice-page .table-header .table-row,
.limbo-page .table-header .table-row,
.minesweeper-page .table-header .table-row {
    background: #3b274f !important;
    color: rgba(255,255,255,0.5);
}

/* Body rows */
.rl-page .table-body .table-row,
.cr-page .table-body .table-row,
.tw-page .table-body .table-row,
.pk-page .table-body .table-row,
.sl-page .table-body .table-row,
.dice-page .table-body .table-row,
.limbo-page .table-body .table-row,
.wheel-page .table-body .table-row,
.minesweeper-page .table-body .table-row {
    background: #2b2333 !important;
}

/* Alternating row tint */
.rl-page .table-body .table-row:nth-child(even),
.cr-page .table-body .table-row:nth-child(even),
.tw-page .table-body .table-row:nth-child(even),
.pk-page .table-body .table-row:nth-child(even),
.sl-page .table-body .table-row:nth-child(even),
.dice-page .table-body .table-row:nth-child(even),
.limbo-page .table-body .table-row:nth-child(even),
.wheel-page .table-body .table-row:nth-child(even),
.minesweeper-page .table-body .table-row:nth-child(even) {
    background: rgba(255,255,255,0.03) !important;
}

/* Row separator */
.rl-page .table-row,
.cr-page .table-row,
.tw-page .table-row,
.pk-page .table-row,
.sl-page .table-row,
.dice-page .table-row,
.limbo-page .table-row,
.wheel-page .table-row,
.minesweeper-page .table-row {
    border-bottom-color: rgba(255,255,255,0.05) !important;
}

/* Mobile all-bets/history tables */
.table-container.responsive .table-row > .table-column,
.live-section .table-container .table-row > .table-column {
    min-width: 0;
}

/* Compact (tablet + mobile) layout. The sidebar collapses to a drawer at
   1024px, so the responsive tables switch to the compact grid here too. */
@media (max-width: 1024px) {
    .live-section {
        padding: 0 0 24px;
    }

    .table-container.responsive,
    .live-section .table-container {
        width: 100% !important;
        max-width: 100%;
    }

    .table-container.responsive .table-tabs,
    .live-section .table-tabs {
        gap: 6px;
        padding: 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-container.responsive .table-tab-btn,
    .live-section .table-tab-btn,
    .table-container.responsive .table-live-toggle,
    .live-section .table-live-toggle {
        flex: 0 0 auto;
    }

    .table-container.responsive .table-row,
    .live-section .table-row {
        display: grid;
        align-items: center;
        gap: 6px;
        padding: 10px 12px;
    }

    .table-container.responsive .table-row > .table-column,
    .live-section .table-row > .table-column {
        /* Override the base `.table-row ... { width: calc(100% / N) }` rule
           (higher specificity) so grid tracks control the width — otherwise
           columns are pinned to ~20% and their content gets clipped. */
        width: auto !important;
        padding: 0 !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 12px;
    }

    .table-container.responsive .table-header .table-column,
    .live-section .table-header .table-column {
        font-size: 10px;
    }

    .table-container.responsive .table-row > .table-column .flex,
    .live-section .table-row > .table-column .flex {
        min-width: 0;
    }

    .table-container.responsive .avatar-field .icon-small,
    .live-section .avatar-field .icon-small {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px;
    }

    /* All bets: show only the essentials — Player / Wager / Payout.
       Hide Game (1st) and Multi (4th) across tablet + mobile. */
    .live-section .table-row {
        grid-template-columns: minmax(0, 1.5fr) minmax(72px, 0.8fr) minmax(80px, 0.9fr);
    }

    .live-section .table-row > .table-column:nth-child(1),
    .live-section .table-row > .table-column:nth-child(4) {
        display: none;
    }

    .minesweeper-history .table-row,
    .tower-history .table-row,
    .tw-history .table-row {
        grid-template-columns: minmax(0, 1.4fr) minmax(68px, 0.75fr) minmax(46px, 0.5fr) minmax(76px, 0.85fr);
    }

    .plinko-history .table-row,
    .pk-history .table-row {
        grid-template-columns: minmax(0, 1.35fr) minmax(68px, 0.75fr) minmax(54px, 0.6fr) minmax(76px, 0.85fr);
    }

    .plinko-history .table-row > .table-column:nth-child(4),
    .pk-history .table-row > .table-column:nth-child(4) {
        display: none;
    }
}

@media (max-width: 480px) {
    .table-container.responsive .table-row,
    .live-section .table-row {
        gap: 5px;
        padding: 9px 10px;
    }

    .table-container.responsive .table-row > .table-column,
    .live-section .table-row > .table-column {
        font-size: 11px;
    }

    .table-container.responsive .table-header .table-column,
    .live-section .table-header .table-column {
        font-size: 9px;
    }

    .table-container.responsive .avatar-field .icon-small,
    .live-section .avatar-field .icon-small {
        width: 26px !important;
        height: 26px !important;
        min-width: 26px;
    }

    .table-container.responsive .table-live-toggle > span,
    .live-section .table-live-toggle > span {
        display: none;
    }

    .live-section .table-row {
        grid-template-columns: minmax(0, 1.35fr) minmax(64px, 0.75fr) minmax(72px, 0.85fr);
    }

    .live-section .table-row > .table-column:nth-child(1) {
        display: none;
    }

    .dice-history .table-row,
    .minesweeper-history .table-row,
    .tower-history .table-row,
    .tw-history .table-row,
    .plinko-history .table-row,
    .pk-history .table-row {
        grid-template-columns: minmax(0, 1.35fr) minmax(64px, 0.75fr) minmax(72px, 0.85fr);
    }

    .dice-history .table-row > .table-column:nth-child(3),
    .minesweeper-history .table-row > .table-column:nth-child(3),
    .tower-history .table-row > .table-column:nth-child(3),
    .tw-history .table-row > .table-column:nth-child(3),
    .plinko-history .table-row > .table-column:nth-child(3),
    .pk-history .table-row > .table-column:nth-child(3) {
        display: none;
    }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE REFINEMENTS (loaded last = highest priority)
   Fluid units + mobile browser behavior support
   ═══════════════════════════════════════════════════════════════ */

/* Protect against horizontal scrolling on narrow screens.
   Do not touch html/body to avoid breaking position: sticky on the header. */
.wrapper-page,
.main-panel,
#page_content,
#page_content2 {
    max-width: 100%;
    /* clip, not hidden: it does not turn the Y axis into auto or create a nested
       scroll container, so page scrolling and the sticky header keep working.
       Older browsers degrade to visible, without horizontal clipping. */
    overflow-x: clip;
}
/* dvh height version for #page_content. The inline style provides vh as a fallback
   for older browsers; modern browsers use dvh and do not jump under the address bar. */
#page_content { min-height: calc(100dvh - 120px) !important; }

@media (hover:none) and (pointer:coarse) {
    /* Every current and future catalog game receives `is-game-page` from the
       shared template. Disable accidental double-tap zoom on its touch surface
       while preserving normal scrolling and intentional two-finger pinch zoom. */
    body.is-game-page,
    body.is-game-page #page_content,
    body.is-game-page #page_content2 {
        -ms-touch-action:manipulation;
        touch-action:manipulation;
    }

    /* A rapid second tap on a game control activates that control instead of
       browser double-tap zoom. Two-finger pinch zoom remains available. */
    body.is-game-page button,
    body.is-game-page a,
    body.is-game-page label,
    body.is-game-page select,
    body.is-game-page .site-button,
    body.is-game-page [role="button"],
    body.is-game-page input[type="button"],
    body.is-game-page input[type="submit"],
    body.is-game-page input[type="radio"],
    body.is-game-page input[type="checkbox"],
    body.is-game-page input[type="range"] {
        -ms-touch-action:manipulation;
        touch-action:manipulation;
    }
}

/* Keep media inside its container. */
.main-panel img:not(.nav-icon):not(.sidebar-menu-icon),
.footer img,
.main-panel video,
.main-panel iframe {
    max-width: 100%;
    height: auto;
    filter: contrast(.88);
}

/* Safe area: keep the fixed sidebar drawer away from notches and rounded corners.
   This works because viewport-fit=cover is set in <meta>. */
@supports (padding: max(0px)) {
    .left-sidebar {
        padding-left:  max(8px, env(safe-area-inset-left));
        padding-top:   max(8px, env(safe-area-inset-top));
        padding-bottom: max(16px, env(safe-area-inset-bottom));
    }
}

/* ───────── Mobile behavior (≤768px) ───────── */
@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
    /* iOS zooms the page when focusing inputs below 16px, so keep them at 16px. */
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="number"],
    input[type="tel"],
    input[type="search"],
    textarea,
    select,
    .auth-input,
    .figma-input {
        font-size: 16px !important;
    }

    /* Comfortable touch targets: drawer items and square buttons are at least 44px. */
    .sidebar-cell { min-height: 44px; }
    .sidebar-menu-link { min-height: 40px; }
    .btn-icon-sq { min-width: 44px; min-height: 44px; }

    /* Auth modals with a fixed 440px width do not fit on narrow phones, so make
       them fluid against the viewport width. */
    #modal_auth .modal-content,
    #modal_auth_initializing .modal-content,
    #modal_auth_change_password .modal-content,
    #modal_auth_recover .modal-content {
        width: min(440px, calc(100vw - 24px)) !important;
        max-width: min(440px, calc(100vw - 24px)) !important;
    }
}

/* Keep the redesigned header active at tablet width and above. */
@media (min-width: 768px) {
    .header-max { display: block !important; }
}

/* Loaded after the ≤1280 footer rule so desktop sidebar width remains aligned. */
@media (min-width:1025px) {
    body .header-max,
    body .wrapper-page { margin-left:232px; }
    body .footer { margin-left:232px !important; }
    body.sidebar-compact .header-max,
    body.sidebar-compact .wrapper-page { margin-left:76px; }
    body.sidebar-compact .footer { margin-left:76px !important; }
}

/* Shared navigation shown above every enabled game page. */
.game-back-nav {
    width:100%;
    padding:14px 18px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    text-align:left;
    pointer-events:none;
}
.game-back-home {
    min-height:38px;
    padding:0 14px 0 11px;
    display:inline-flex;
    align-items:center;
    gap:9px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:11px;
    background:rgba(255,255,255,.04);
    color:rgba(255,255,255,.72) !important;
    font-size:12px;
    font-weight:750;
    text-decoration:none !important;
    box-shadow:0 8px 24px rgba(0,0,0,.08);
    pointer-events:auto;
    transition:border-color .18s,background .18s,color .18s;
}
.game-back-home i {
    width:22px;
    height:22px;
    display:grid;
    place-items:center;
    border-radius:7px;
    background:rgba(181,110,255,.12);
    color:#c58aff;
    font-size:10px;
    transition:transform .18s;
}
.game-back-home:hover {
    border-color:rgba(181,110,255,.3);
    background:rgba(181,110,255,.09);
    color:#fff !important;
}
.game-back-home:hover i { transform:translateX(-2px); }
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    .game-back-nav { padding:10px 10px 0; }
    .game-back-home { min-height:40px; }
}

.game-fullscreen-toggle {
    position:relative;z-index:2;flex:0 0 auto;
    min-height:38px;padding:0 13px;
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    border:1px solid rgba(181,110,255,.28);border-radius:11px;
    background:rgba(24,18,38,.9);color:#d9b7ff;
    font-family:inherit;font-size:11px;font-weight:750;line-height:1;cursor:pointer;pointer-events:auto;
    box-shadow:0 10px 30px rgba(0,0,0,.28);
    backdrop-filter:blur(12px);
    transition:transform .18s,border-color .18s,background .18s,color .18s;
}
.game-fullscreen-toggle:hover {
    transform:translateY(-1px);border-color:rgba(181,110,255,.55);
    background:rgba(139,72,232,.28);color:#fff;
}
.game-fullscreen-toggle.is-active { background:rgba(139,72,232,.38);color:#fff; }
.game-fullscreen-toggle.is-unavailable { display:none!important; }
.game-fullscreen-toggle i { width:16px;font-size:12px;text-align:center; }
#page_content2:fullscreen,
#page_content2:-webkit-full-screen {
    width:100%;height:100%;max-width:none;padding:16px;
    overflow:auto;background:#0c0913;box-sizing:border-box;
}
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    .game-fullscreen-toggle { width:40px;min-height:40px;padding:0;border-radius:10px; }
    .game-fullscreen-toggle span { display:none; }
    #page_content2:fullscreen,
    #page_content2:-webkit-full-screen { padding:6px;overflow:hidden; }
}

/* ---- REWARDS PAGE ---- */
.rewards-page,
.rewards-page * {
    box-sizing: border-box;
}
.rewards-page {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: clamp(12px, 2vw, 20px);
    color: #fff;
}
.rewards-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    min-height: 132px;
    margin-bottom: 16px;
    padding: 24px;
    background: rgba(255,255,255,0.035);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
}
.rewards-page .eyebrow {
    margin: 0 0 6px;
    color: #09b95b;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
}
.rewards-header h1,
.rewards-section-title h2,
.reward-card h2 {
    margin: 0;
    color: #fff;
    letter-spacing: 0;
}
.rewards-header h1 {
    font-size: 28px;
    line-height: 1.15;
}
.rewards-header p:not(.eyebrow) {
    max-width: 620px;
    margin: 8px 0 0;
    color: #acacac;
    font-size: 13px;
    line-height: 1.55;
}
.rewards-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.rewards-grid-top {
    margin-bottom: 20px;
}
.rewards-section-title {
    margin: 0 0 10px;
    padding: 0 2px;
}
.rewards-section-title h2 {
    font-size: 18px;
    line-height: 1.25;
}
.reward-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 260px;
    padding: 18px;
    background: rgba(255,255,255,0.035);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
}
.reward-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.reward-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    background: rgba(9,185,91,0.12);
    border: 1px solid rgba(9,185,91,0.24);
    border-radius: 8px;
    color: #09b95b;
    font-size: 16px;
}
.reward-icon.google {
    background: rgba(255,255,255,0.05);
    border-color: rgba(255,255,255,0.12);
}
.reward-icon .social-login.google {
    float: none;
    width: 24px;
    height: 24px;
    margin: 0;
    border-radius: 50%;
}
.reward-card h2 {
    font-size: 17px;
    line-height: 1.25;
}
.reward-copy,
.reward-note {
    margin: 0 0 14px;
    color: #acacac;
    font-size: 13px;
    line-height: 1.55;
}
.reward-copy span,
.reward-note span {
    color: #fff;
    font-weight: 700;
}
.reward-note {
    color: rgba(255,255,255,0.58);
    font-size: 12px;
}
.reward-form {
    margin: auto 0 14px;
}
.reward-form-stack {
    display: grid;
    gap: 10px;
}
.rewards-page .input_field.reward-input {
    float: none;
    width: 100%;
    min-width: 0;
    margin: 0;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
}
.rewards-page .input_field.reward-input .field_container {
    display: flex;
    align-items: stretch;
    width: 100%;
    min-height: 46px;
}
.rewards-page .input_field.reward-input .field_content {
    position: relative;
    flex: 1;
    min-width: 0;
}
.rewards-page .input_field.reward-input .field_element_input {
    width: 100%;
    height: 46px;
    padding: 15px 12px 5px;
    background: transparent;
    border: 0;
    outline: 0;
    color: #fff;
    font-size: 13px;
}
.rewards-page .input_field.reward-input .field_element_input[readonly] {
    color: rgba(255,255,255,0.62);
}
.rewards-page .input_field.reward-input .field_label {
    position: absolute;
    top: 15px;
    left: 12px;
    color: rgba(255,255,255,0.45);
    font-size: 12px;
    line-height: 1;
    pointer-events: none;
    transition: transform 0.15s, color 0.15s, font-size 0.15s;
}
.rewards-page .input_field.reward-input .field_label.active,
.rewards-page .input_field.reward-input .field_element_input:focus + .field_label {
    color: #09b95b;
    font-size: 10px;
    transform: translateY(-9px);
}
.rewards-page .input_field.reward-input .field_extra {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    padding: 5px;
}
.rewards-page .input_field.reward-input .field_extra:empty {
    display: none;
}
.rewards-page .input_field.reward-input .field_extra .site-button {
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    color: #fff;
    font-size: 11px;
}
.rewards-page .reward-quick-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 238px;
}
.rewards-page .input_field.reward-input .field_bottom {
    min-height: 0;
    padding: 0 12px 8px;
}
.rewards-page .input_field.reward-input .field_error {
    display: none;
    color: #ff7a73;
    font-size: 11px;
    line-height: 1.35;
}
.rewards-page .input_field.reward-input .field_error.active {
    display: block;
}
.reward-action {
    margin-top: auto;
}
.rewards-page .site-button.purple,
.rewards-page .reward-link-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 40px;
    padding: 10px 14px;
    background: #09b95b !important;
    border: 0 !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
}
.rewards-page .site-button.purple:hover,
.rewards-page .reward-link-btn:hover {
    background: #08a451 !important;
}
.rewards-page .site-button.disabled,
.rewards-page .site-button.purple.disabled {
    background: rgba(255,255,255,0.07) !important;
    color: rgba(255,255,255,0.45) !important;
    cursor: not-allowed;
}

@media (max-width: 900px) {
    .rewards-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .rewards-header {
        min-height: 0;
        padding: 18px;
    }
    .rewards-header h1 {
        font-size: 24px;
    }
    .reward-card {
        min-height: 0;
        padding: 14px;
    }
    .rewards-page .input_field.reward-input .field_container {
        flex-direction: column;
    }
    .rewards-page .input_field.reward-input .field_extra {
        justify-content: flex-start;
        padding: 0 10px 10px;
    }
    .rewards-page .reward-quick-actions {
        max-width: none;
    }
}
@keyframes status-spin { to { filter:hue-rotate(360deg); } }

.welcome-back { display:flex; align-items:center; gap:12px; margin-bottom:14px; padding:14px 16px; border:1px solid rgba(56,189,248,.25); border-radius:10px; background:rgba(56,189,248,.08); color:#38bdf8; }.welcome-back i{font-size:20px}.welcome-back strong,.welcome-back span{display:block}.welcome-back span{margin-top:2px;color:#a8b2bd;font-size:12px}.journey-hero>div>span,.leaderboard-intro>span{color:#a78bfa;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.journey-hero h2,.leaderboard-intro h2{margin:4px 0 6px;color:#fff;font-size:22px}.journey-hero p,.leaderboard-intro p{margin:0;color:#888;font-size:12px}.week-report{display:grid;grid-template-columns:auto auto;gap:3px 9px;align-items:center}.week-report strong{color:#fff;font-size:18px;text-align:right}.week-report span{color:#777;font-size:10px;text-transform:uppercase}
.vip-milestones{display:flex;align-items:center;gap:20px;margin-top:12px}.vip-milestones>div:first-child{min-width:180px}.milestone-track{display:grid;grid-template-columns:repeat(4,1fr);flex:1;position:relative}.milestone-track:before{content:'';position:absolute;top:12px;left:8%;right:8%;height:2px;background:#292b32}.milestone-track div{position:relative;text-align:center;color:#666;font-size:9px}.milestone-track i{width:26px;height:26px;display:grid;place-items:center;margin:0 auto 6px;border-radius:50%;background:#292b32}.milestone-track .reached{color:#a78bfa}.milestone-track .reached i{color:#fff;background:#7c3aed}
.showcase form,.feedback-game form{display:grid;gap:10px}.showcase label{display:grid;gap:5px;color:#888;font-size:10px}.showcase select,.feedback-game textarea{width:100%;box-sizing:border-box;border:1px solid #32343d;border-radius:7px;background:#111319;color:#ddd;padding:10px}.feedback-game textarea{min-height:100px;resize:vertical}.showcase button,.feedback-game button{border:0;border-radius:7px;background:#7c3aed;color:#fff;padding:10px 14px;cursor:pointer}.feedback-game small{color:#777}
.reward-status{min-width:54px;padding:4px 6px;border:1px solid rgba(34,197,94,.13);border-radius:6px;background:rgba(34,197,94,.075);color:#55d691;font-size:7px;font-weight:850;letter-spacing:.04em;text-align:center;text-transform:uppercase;box-sizing:border-box}
@media(max-width:600px){.reward-status{align-self:start;justify-self:end}}
.leaderboard-intro{margin-bottom:14px;padding:18px;border-radius:12px;background:linear-gradient(120deg,rgba(124,58,237,.17),#17191f)}.leaderboard-tabs{display:flex;gap:7px;margin-bottom:12px;overflow:auto}.leaderboard-tabs button{border:1px solid #30323a;border-radius:7px;background:#191b21;color:#888;padding:9px 13px;cursor:pointer}.leaderboard-tabs button.active{border-color:#7c3aed;background:rgba(124,58,237,.14);color:#fff}.leaderboard-user{display:flex;align-items:center;gap:8px}.leaderboard-user img{width:30px;height:30px;border-radius:50%;object-fit:cover}.onboarding-head,.shop-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.onboarding-head>strong,.shop-head>strong{color:#a78bfa;font-size:18px}
.reputation-shop,.clubs-hub{margin-top:12px}.shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}.shop-item{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:9px;padding:11px;border:1px solid #2c2e36;border-radius:8px;background:#191b21}.shop-item>i{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#24262e;color:#a78bfa}.shop-item strong,.shop-item span{display:block}.shop-item strong{color:#ddd;font-size:11px}.shop-item span{margin-top:3px;color:#74767e;font-size:9px}.shop-item button,.clubs-grid button,.limit-form button{border:0;border-radius:6px;background:#7c3aed;color:#fff;padding:7px 9px;font-size:9px;cursor:pointer}.shop-item.owned{opacity:.65}.shop-item>b{color:#22c55e;font-size:9px}.rarity-epic{border-color:rgba(244,114,182,.35)}.rarity-rare{border-color:rgba(56,189,248,.3)}.vault-item-icon{width:46px;height:46px;display:grid;place-items:center;color:#f8d477;border-radius:12px;background:linear-gradient(145deg,rgba(245,158,11,.18),rgba(139,92,246,.15));font-size:18px}.vault-item-copy{min-width:0}.vault-item-copy>span{display:block;color:#9f7aea;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.vault-item-copy strong{display:block;margin:3px 0;color:#f5f0ff;font-size:12px}.vault-item-copy p{margin:0;color:#81798c;font-size:9px;line-height:1.4}.vault-owned{color:#6ee7a0;font-size:9px;white-space:nowrap}.vault-legendary{border-color:rgba(245,158,11,.28)}.vault-mythic{border-color:rgba(236,72,153,.34);box-shadow:inset 0 0 22px rgba(168,85,247,.06)}
.game-rtp-badge{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 11px;border:1px solid rgba(74,222,128,.2);border-radius:9px;background:rgba(34,197,94,.075);box-sizing:border-box;white-space:nowrap}.game-rtp-badge small{color:#68d391;font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.game-rtp-badge strong{color:#d7fbe5;font-size:10px;font-weight:750}.game-rtp-badge+button{margin-left:6px}@media(max-width:640px){.game-rtp-badge{min-height:30px;padding:0 8px;gap:5px}.game-rtp-badge strong{max-width:135px;overflow:hidden;font-size:9px;text-overflow:ellipsis}.game-rtp-badge+button{margin-left:3px}}
.rewards-achievement-shop{margin:0 0 28px;border-radius:18px}.rewards-achievement-shop button:disabled{cursor:wait;filter:saturate(.45);opacity:.7}@keyframes achievement-aura-pulse{50%{box-shadow:0 0 0 8px rgba(167,139,250,.04),0 0 40px rgba(168,85,247,.7)}}
.clubs-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:12px}.clubs-grid article{display:grid;place-items:center;gap:6px;padding:13px 8px;border:1px solid #2c2e36;border-radius:9px;background:#191b21;text-align:center}.clubs-grid article.selected{border-color:#7c3aed;background:rgba(124,58,237,.1)}.clubs-grid article>i{color:#a78bfa;font-size:18px}.clubs-grid strong{color:#ddd;font-size:10px}.clubs-grid span{color:#777;font-size:8px}.clubs-grid b{color:#a78bfa;font-size:8px;text-transform:uppercase}
.limit-form{display:grid;gap:8px;margin-top:12px}.limit-form label{display:grid;gap:5px;color:#888;font-size:9px}.limit-form input{border:1px solid #32343d;border-radius:7px;background:#111319;color:#ddd;padding:10px}.useful-actions>small{display:block;margin-top:8px;color:#666;font-size:8px}.service-recovery>a{display:inline-block;margin-top:10px;color:#a78bfa;font-size:10px}.all-systems,.recovery-row{display:flex;align-items:center;gap:9px;margin-top:10px;padding:9px;border-radius:7px;background:#1b1e23}.all-systems>i{color:#22c55e;font-size:18px}.all-systems span{color:#bbb;font-size:10px}.all-systems small{color:#666}.recovery-row>i{color:#a78bfa}.recovery-row span{flex:1;color:#aaa;font-size:9px}.recovery-row b{color:#777;font-size:8px;text-transform:uppercase}
@media(max-width:760px){.journey-hero,.vip-milestones,.achievement-shop-head{align-items:flex-start;flex-direction:column}.achievement-vault-item form,.vault-owned{grid-column:2}.milestone-track{width:100%}.week-report{width:100%;grid-template-columns:repeat(3,auto);}.week-report span{grid-row:2}.week-report strong{text-align:left}.onboarding-steps,.shop-grid{grid-template-columns:1fr}.clubs-grid{grid-template-columns:repeat(2,1fr)}}
.auth-label-optional { margin-left: 4px; color: #858995; font-size: 11px; font-weight: 400; }

/* Mobile betting controls: larger touch targets and clearer separation */
@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
    .dice-input-row,
    .mines-input-row,
    .rl-input-row,
    .cr-input-row,
    .tw-input-row,
    .pk-input-row {
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px;
    }

    .dice-chips,
    .mines-chips,
    .rl-chips,
    .cr-chips,
    .tw-chips,
    .pk-chips {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
        gap: 8px;
        width: 100%;
        flex: 0 0 100%;
        margin-top: 2px;
        padding-top: 10px;
        border-top: 1px solid rgba(255,255,255,0.10);
        border-left: 0;
    }

    .dice-chip,
    .mines-chip,
    .rl-chip,
    .cr-chip,
    .tw-chip,
    .pk-chip {
        min-height: 42px;
        padding: 0 12px !important;
        border: 1px solid rgba(255,255,255,0.12);
        border-radius: 6px;
        font-size: 13px;
        font-weight: 700;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .dice-btn-place,
    .mines-btn-place,
    .mines-btn-cashout,
    .cr-btn-place,
    .cr-btn-cashout,
    .tw-btn-place,
    .tw-btn-cashout,
    .pk-btn-place,
    #dice_bet,
    #minesweeper_bet,
    #minesweeper_cashout {
        min-height: 60px !important;
        height: 60px !important;
        line-height: 60px !important;
        margin-top: 12px;
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .dice-chip,
    .mines-chip,
    .rl-chip,
    .cr-chip,
    .tw-chip,
    .pk-chip,
    .pk-risk-btn {
        min-height: 46px;
        font-size: 13px;
    }

    .dice-btn-place,
    .mines-btn-place,
    .mines-btn-cashout,
    .cr-btn-place,
    .cr-btn-cashout,
    .tw-btn-place,
    .tw-btn-cashout,
    .pk-btn-place,
    #dice_bet,
    #minesweeper_bet,
    #minesweeper_cashout {
        min-height: 64px !important;
        height: 64px !important;
        line-height: 64px !important;
    }
}

@keyframes hilo-deal-2026 { from { transform: perspective(600px) translateY(-22px) rotateY(80deg) scale(.9); opacity: 0; } to { transform: perspective(600px) rotateY(-2deg) scale(1); opacity: 1; } }
@keyframes hilo-lose-shake { 25% { transform: perspective(600px) translateX(-5px) rotateY(-2deg); } 70% { transform: perspective(600px) translateX(4px) rotateY(-2deg); } }
@keyframes roulette-winner-pulse { to { filter:brightness(1.35) saturate(1.2); box-shadow:inset 0 0 0 3px rgba(255,255,255,.42),0 0 0 3px #ffe17e,0 0 42px rgba(244,201,93,.82),0 18px 28px rgba(0,0,0,.5); } }

/* =========================================
   REWARDS 2026 UI REFRESH
   ========================================= */
.rewards-page { max-width: 1180px; padding: 28px 22px 48px; text-align: left; }
.rewards-page .rewards-header { position: relative; min-height: 190px; align-items: center; margin-bottom: 13px; padding: 31px 33px; overflow: hidden; border-color: rgba(161,116,255,.22); border-radius: 21px; background: radial-gradient(circle at 84% 8%,rgba(139,78,255,.27),transparent 39%),linear-gradient(135deg,rgba(31,18,57,.97),rgba(14,12,28,.98)); box-shadow: 0 22px 60px rgba(7,3,18,.3),inset 0 1px rgba(255,255,255,.05); }
.rewards-page .rewards-header::after { content: ''; position: absolute; right: -65px; top: -95px; width: 280px; height: 280px; border: 1px solid rgba(244,201,93,.13); border-radius: 50%; box-shadow: 0 0 0 38px rgba(139,78,255,.04),0 0 0 76px rgba(139,78,255,.025); pointer-events: none; }
.rewards-page .rewards-header > * { position: relative; z-index: 1; }
.rewards-page .eyebrow { color: #b78cf5; letter-spacing: .09em; }
.rewards-page .eyebrow i { margin-right: 5px; color: #f4c95d; }
.rewards-page .rewards-header h1 { font-size: clamp(32px,4vw,43px); line-height: 1.05; letter-spacing: -.04em; }
.rewards-page .rewards-header p:not(.eyebrow) { color: #aaa2b4; line-height: 1.65; }
.rewards-hero-art { display: flex; width: 300px; align-items: center; gap: 14px; padding: 17px 18px; border: 1px solid rgba(255,255,255,.085); border-radius: 15px; background: rgba(8,6,18,.45); }
.rewards-hero-art > span { display: grid; flex: 0 0 44px; width: 44px; height: 44px; place-items: center; border: 1px solid rgba(244,201,93,.22); border-radius: 13px; background: linear-gradient(145deg,rgba(244,201,93,.18),rgba(131,72,219,.24)); color: #f4c95d; font-size: 18px; }
.rewards-hero-art b,.rewards-hero-art small { display: block; }
.rewards-hero-art b { margin-bottom: 4px; color: #f4eff7; font-size: 12px; }
.rewards-hero-art small { color: #797181; font-size: 10px; line-height: 1.4; }
.rewards-trust-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-bottom: 25px; }
.rewards-trust-row > div { display: flex; align-items: center; gap: 10px; padding: 12px 13px; border: 1px solid rgba(255,255,255,.06); border-radius: 11px; background: rgba(255,255,255,.025); }
.rewards-trust-row > div > i { display: grid; flex: 0 0 31px; width: 31px; height: 31px; place-items: center; border-radius: 9px; background: rgba(133,75,219,.12); color: #aa79ee; }
.rewards-trust-row b,.rewards-trust-row small { display: block; }
.rewards-trust-row b { margin-bottom: 2px; color: #c6becb; font-size: 10px; }
.rewards-trust-row small { color: #6f6874; font-size: 9px; line-height: 1.35; }
.rewards-page .rewards-section-title { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 12px; padding: 0 3px; }
.rewards-page .rewards-section-title h2 { font-size: 20px; }
.rewards-page .rewards-section-title > span { color: #716978; font-size: 9px; }
.rewards-page .rewards-grid { gap: 14px; }
.rewards-page .rewards-grid > .reward-card:only-child { max-width: 680px; }
.rewards-page .reward-card { position: relative; min-height: 300px; padding: 23px; overflow: hidden; border-color: rgba(255,255,255,.075); border-radius: 17px; background: radial-gradient(circle at 100% 0,rgba(128,70,215,.12),transparent 35%),linear-gradient(145deg,rgba(28,21,40,.93),rgba(15,12,24,.96)); box-shadow: 0 17px 42px rgba(5,2,13,.22),inset 0 1px rgba(255,255,255,.035); }
.rewards-page .reward-card::after { content: ''; position: absolute; right: -65px; bottom: -80px; width: 190px; height: 190px; border: 1px solid rgba(155,100,237,.07); border-radius: 50%; pointer-events: none; }
.reward-card-badge { position: absolute; top: 18px; right: 18px; padding: 4px 7px; border: 1px solid rgba(67,216,141,.17); border-radius: 6px; background: rgba(67,216,141,.075); color: #61d99e; font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.rewards-page .reward-card-head { position: relative; z-index: 1; margin-bottom: 21px; }
.rewards-page .reward-icon { flex-basis: 48px; width: 48px; height: 48px; border-color: rgba(170,112,251,.26); border-radius: 13px; background: linear-gradient(145deg,rgba(138,76,230,.24),rgba(77,34,143,.14)); color: #c194ff; font-size: 18px; box-shadow: inset 0 1px rgba(255,255,255,.07); }
.rewards-page .reward-card h2 { font-size: 18px; }
.rewards-page .reward-form { position: relative; z-index: 1; margin-top: 8px; }
.rewards-page .input_field.reward-input { border-color: rgba(171,122,255,.17); border-radius: 12px; background: rgba(5,3,11,.4); transition: border-color .18s,box-shadow .18s; }
.rewards-page .input_field.reward-input:focus-within { border-color: #8952e2; box-shadow: 0 0 0 3px rgba(132,72,226,.1); }
.rewards-page .input_field.reward-input .field_container { min-height: 54px; }
.rewards-page .input_field.reward-input .field_element_input { height: 54px; padding: 19px 14px 6px; font-size: 15px; font-weight: 650; letter-spacing: .04em; }
.rewards-page .input_field.reward-input .field_label { top: 19px; left: 14px; }
.rewards-page .input_field.reward-input .field_label.active,.rewards-page .input_field.reward-input .field_element_input:focus + .field_label { color: #b47cf8; transform: translateY(-11px); }
.rewards-page .reward-action { position: relative; z-index: 1; }
.rewards-page .site-button.purple,.rewards-page .reward-link-btn { min-height: 49px; gap: 8px; border-radius: 11px !important; background: linear-gradient(135deg,#7635db,#a254ef) !important; box-shadow: 0 13px 26px rgba(92,40,177,.22),inset 0 1px rgba(255,255,255,.16); transition: transform .16s,filter .16s; }
.rewards-page .site-button.purple:hover,.rewards-page .reward-link-btn:hover { background: linear-gradient(135deg,#8241e5,#ae61f7) !important; transform: translateY(-1px); filter: brightness(1.04); }
@media (max-width: 800px) {
    .rewards-page .rewards-header { align-items: flex-start; flex-direction: column; gap: 22px; }
    .rewards-hero-art { width: min(100%,360px); }
    .rewards-trust-row { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .rewards-page { padding: 16px 12px 36px; }
    .rewards-page .rewards-header { padding: 23px 20px; border-radius: 17px; }
    .rewards-page .reward-card { padding: 19px 15px; }
    .rewards-page .rewards-section-title > span { display: none; }
}
.game-outcome-banner { position:absolute;left:50%;top:16px;z-index:80;min-width:210px;max-width:calc(100% - 24px);min-height:58px;padding:9px 16px;display:flex;align-items:center;justify-content:center;gap:11px;box-sizing:border-box;border:2px solid transparent;border-radius:15px;background:rgba(12,10,17,.96);box-shadow:0 15px 34px rgba(0,0,0,.58);opacity:0;pointer-events:none;transform:translate(-50%,-12px) scale(.94);transition:opacity .18s,transform .25s; }
.game-outcome-banner.hidden { display:none!important; }
.game-outcome-banner.is-visible { opacity:1;transform:translate(-50%,0) scale(1);animation:game-outcome-pop .38s cubic-bezier(.2,1.35,.35,1); }
.game-outcome-banner>i { font-size:23px; }
.game-outcome-banner div { min-width:0;text-align:left; }
.game-outcome-banner strong,.game-outcome-banner span { display:block;white-space:nowrap; }
.game-outcome-banner strong { font-size:16px;font-weight:950;letter-spacing:.06em; }
.game-outcome-banner span { margin-top:2px;font-size:11px;font-weight:750; }
.game-outcome-banner.is-win { border-color:#45df98;background:linear-gradient(145deg,rgba(18,82,57,.98),rgba(8,35,27,.98));color:#8ff0bd;box-shadow:0 15px 35px rgba(0,0,0,.55),0 0 28px rgba(69,223,152,.3); }
.game-outcome-banner.is-lose { border-color:#ff6277;background:linear-gradient(145deg,rgba(92,24,37,.98),rgba(39,10,18,.98));color:#ff9aa8;box-shadow:0 15px 35px rgba(0,0,0,.55),0 0 28px rgba(255,98,119,.25); }
.game-outcome-banner.is-push { border-color:#e4bd5e;background:linear-gradient(145deg,rgba(80,61,20,.98),rgba(36,27,9,.98));color:#f4d98d; }
.limbo-display-area,.plinko-page .pk-board-area { position:relative; }
@keyframes game-outcome-pop { 0%{transform:translate(-50%,-10px) scale(.82)} 65%{transform:translate(-50%,2px) scale(1.04)} 100%{transform:translate(-50%,0) scale(1)} }
@keyframes limbo-orbit { to { transform: rotate(360deg); } }
@keyframes limbo-energy-spin { to { transform:rotate(360deg); } }
@keyframes limbo-particle-drift { to { opacity:.7; transform:translate(var(--px),var(--py)) scale(.7); } }
@keyframes limbo-particle-burst { 35% { opacity:1; } 100% { opacity:0; transform:translate(var(--px),var(--py)) scale(1.7); } }
@keyframes limbo-caption-pulse { to { opacity:.55; } }
@keyframes limbo-track-search { 0%{width:0} 75%{width:82%} 90%{width:68%} 100%{width:var(--result-position)} }
@keyframes limbo-win-pulse { 45% { transform: scale(1.1); } }
@keyframes limbo-lose-shake { 25% { transform: translateX(-5px); } 70% { transform: translateX(4px); } }
@keyframes wheel-pointer-edge-hit {
	0% { transform:translateX(-50%) rotate(0deg) translateY(0); }
	42% { transform:translateX(-50%) rotate(-11deg) translateY(4px); }
	72% { transform:translateX(-50%) rotate(3deg) translateY(1px); }
	100% { transform:translateX(-50%) rotate(0deg) translateY(0); }
}
@keyframes wheel-state-pulse { to{box-shadow:0 0 0 7px rgba(244,201,93,.04),0 0 18px rgba(244,201,93,.65)} }@keyframes rps-hand-ready{to{transform:translateY(-5px) rotate(-4deg)}}@keyframes rps-house-question{to{transform:scale(1.12);opacity:.55}}@keyframes rps-winner-pop{50%{transform:scale(1.12)}}@keyframes rps-state-pulse{to{box-shadow:0 0 0 7px rgba(244,201,93,.04),0 0 18px rgba(244,201,93,.6)}}
@keyframes bj-deal-2026 { from { transform: translateY(-25px) rotateY(70deg) scale(.88); opacity: 0; } to { opacity: 1; } }
@keyframes bj-hole-reveal-2026 {
    0% { transform: perspective(500px) rotateY(90deg) scale(.92); opacity: .3; filter: brightness(1.35); }
    65% { transform: perspective(500px) rotateY(-7deg) scale(1.04); }
    100% { transform: perspective(500px) rotateY(0) scale(1); opacity: 1; filter: brightness(1); }
}
@keyframes bj-dealer-draw-2026 {
    0% { transform: translate(54px,-35px) rotate(8deg) scale(.84); opacity: 0; }
    72% { transform: translate(-3px,3px) rotate(-2deg) scale(1.04); opacity: 1; }
    100% { transform: translate(0,0) rotate(0) scale(1); opacity: 1; }
}
@keyframes bcr-deal-2026 { from { transform: translateY(-24px) rotateY(70deg) scale(.88); opacity: 0; } to { opacity: 1; } }
@keyframes kn-reveal-2026 { 50% { transform: scale(1.14); } }
@keyframes kn-hit-2026 { 45% { transform: scale(1.2); } }
@keyframes ck-cloud-drift { to { transform: translateX(25px); } }
@keyframes cf-orbit-2026 { to { transform: translate(-50%,-50%) rotate(360deg); } }
.mines-page-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.mines-page-identity { display: flex; align-items: center; gap: 12px; }
.mines-page-icon { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid rgba(171,120,255,.3); border-radius: 14px; background: linear-gradient(145deg,rgba(132,71,234,.26),rgba(43,22,76,.52)); color: #c59aff; font-size: 21px; box-shadow: inset 0 1px rgba(255,255,255,.08),0 12px 25px rgba(10,5,22,.24); }
.mines-page-icon img { display: block; width: 27px; height: 27px; object-fit: contain; }
.mines-page-kicker { display: block; margin-bottom: 2px; color: #8d829a; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.mines-page-identity h1 { margin: 0; color: #fff; font-size: 24px; line-height: 1.1; letter-spacing: -.025em; }
.mines-page-actions { display: flex; align-items: center; gap: 8px; }
.mines-how-button,.mines-top-fair { display: inline-flex; height: 36px; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; background: rgba(255,255,255,.035); color: #aaa2b4; font: 700 11px/1 Arial,sans-serif; text-decoration: none; box-sizing: border-box; }
.mines-how-button { cursor: pointer; }
.mines-how-button:hover,.mines-top-fair:hover { border-color: rgba(163,108,255,.32); background: rgba(135,74,232,.1); color: #fff; }
.mines-top-fair i { color: #f4c95d; }
.mines-control-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 17px; border-bottom: 1px solid rgba(255,255,255,.065); }
.mines-control-head > div span { display: block; margin-bottom: 3px; color: #857b8e; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mines-control-head > div strong { color: #f5f1f8; font-size: 15px; }
.mines-control-balance { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border: 1px solid rgba(244,201,93,.14); border-radius: 9px; background: rgba(244,201,93,.055); color: #d9ccaa; font-size: 11px; }
.mines-control-balance i,.minesweeper-page .mines-input-icon { color: #f4c95d; }
.mines-risk-note { display: flex; align-items: flex-start; gap: 7px; margin: auto 0 0; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.055); color: #756b7d; font-size: 10px; line-height: 1.5; }
.mines-risk-note i { margin-top: 2px; color: #d89b3e; }
.mines-round-state { display: inline-flex; align-items: center; gap: 8px; color: #89808f; font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.mines-round-state i { width: 7px; height: 7px; border-radius: 50%; background: #55dba0; box-shadow: 0 0 0 4px rgba(85,219,160,.09),0 0 12px rgba(85,219,160,.4); }
.mines-board-shell { width: min(100%,560px); padding: 17px; border: 1px solid rgba(255,255,255,.07); border-radius: 18px; background: linear-gradient(145deg,rgba(31,23,44,.86),rgba(10,7,16,.84)); box-shadow: 0 20px 45px rgba(3,1,8,.26),inset 0 1px rgba(255,255,255,.035); box-sizing: border-box; }
.mines-board-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.mines-board-head > div:first-child span { display: block; margin-bottom: 3px; color: #786f80; font-size: 9px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.mines-board-head > div:first-child strong { color: #f1edf4; font-size: 14px; }
.mines-board-legend { display: flex; align-items: center; gap: 11px; color: #756c7c; font-size: 8px; font-weight: 700; text-transform: uppercase; }
.mines-board-legend span { display: flex; align-items: center; gap: 5px; }
.mines-board-legend i { width: 7px; height: 7px; border-radius: 2px; }
.mines-board-legend .gem { background: #4ddd98; box-shadow: 0 0 8px rgba(77,221,152,.5); }
.mines-board-legend .mine { background: #ff6477; box-shadow: 0 0 8px rgba(255,100,119,.5); }
.mines-history-title { display: flex; align-items: center; justify-content: space-between; padding: 17px 19px; border-bottom: 1px solid rgba(255,255,255,.055); }
.mines-history-title span { display: block; margin-bottom: 2px; color: #786f80; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mines-history-title h2 { margin: 0; color: #f1edf4; font-size: 14px; }
.mines-history-title > i { color: #74539f; }
@keyframes mines-gem-reveal { 45% { transform: scale(1.12) rotate(1deg); } }
@keyframes mines-bomb-reveal { 20% { transform: translateX(-3px); } 55% { transform: translateX(3px); } }
@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
    .mines-how-button { width: 36px; padding: 0; justify-content: center; font-size: 0; }
    .mines-how-button i { font-size: 13px; }
}
@media (max-width: 480px) {
    .mines-page-icon { width: 40px; height: 40px; border-radius: 12px; }
    .mines-page-identity h1 { font-size: 20px; }
    .mines-top-fair { width: 36px; padding: 0; justify-content: center; font-size: 0; }
    .mines-top-fair i { font-size: 13px; }
    .mines-board-shell { padding: 10px; border-radius: 13px; }
    .mines-board-head { align-items: flex-start; }
    .mines-board-legend { flex-direction: column; align-items: flex-start; gap: 3px; }
    .mines-control-head { align-items: flex-start; }
}
@keyframes tw-safe-platform { 45% { transform: scale(1.07); } }
@keyframes tw-trap-platform { 20% { transform: translateX(-3px); } 55% { transform: translateX(3px); } }
@keyframes poker-dealer-idle {
    0%,100% { transform: translateY(0) rotate(0); }
    50% { transform: translateY(-2px) rotate(-.6deg); }
}
@keyframes poker-dealer-action {
    0% { transform: translateY(0) scale(1) rotate(0); }
    35% { transform: translateY(2px) scale(1.06) rotate(3deg); }
    70% { transform: translateY(1px) scale(1.03) rotate(-2deg); }
    100% { transform: translateY(0) scale(1) rotate(0); }
}
@keyframes plinko-live-pulse { 50% { opacity: .55; transform: scale(.86); } }
@keyframes plinko-ball-collision-left {
    0% { transform:translate(-50%,-50%) scale(1); }
    26% { transform:translate(calc(-50% - 3px),calc(-50% + 4px)) scale(1.28,.68); }
    60% { transform:translate(calc(-50% - 13px),calc(-50% - 14px)) scale(.82,1.2); }
    100% { transform:translate(-50%,-50%) scale(1); }
}
@keyframes plinko-ball-collision-right {
    0% { transform:translate(-50%,-50%) scale(1); }
    26% { transform:translate(calc(-50% + 3px),calc(-50% + 4px)) scale(1.28,.68); }
    60% { transform:translate(calc(-50% + 13px),calc(-50% - 14px)) scale(.82,1.2); }
    100% { transform:translate(-50%,-50%) scale(1); }
}
@keyframes plinko-peg-recoil {
    0% { transform:scale(1); filter:brightness(1); }
    35% { transform:scale(.78); filter:brightness(1.8); }
    70% { transform:scale(1.18); filter:brightness(1.25); }
    100% { transform:scale(1); filter:brightness(1); }
}
@keyframes plinko-trail-breathe { to { opacity:.55; transform:translate(-108%,-50%) scaleX(1.2); } }
@keyframes plinko-ball-aura { to { opacity:.08; transform:scale(1.3); } }
@keyframes plinko-impact-ring { to { width:24px;height:24px;opacity:0; } }
@keyframes plinko-spark-flight { to { opacity:0;transform:translate(var(--spark-x),var(--spark-y)) scale(.2); } }
@keyframes plinko-ball-land {
    0% { transform:translate(-50%,-50%) scale(1); }
    30% { transform:translate(-50%,-22%) scale(1.22,.72); }
    60% { transform:translate(-50%,-72%) scale(.88,1.14); }
    100% { transform:translate(-50%,-42%) scale(1); }
}
@keyframes plinko-slot-hit {
    0%,100% { transform:translateY(0);filter:brightness(1); }
    20% { transform:translateY(5px) scale(.94);filter:brightness(2); }
    52% { transform:translateY(-8px) scale(1.1);filter:brightness(1.55);box-shadow:0 0 24px rgba(168,113,255,.6); }
}
@keyframes plinko-slot-jackpot {
    0%,100% { transform:translateY(0);filter:brightness(1); }
    18% { transform:translateY(5px) scale(.92); }
    42%,72% { transform:translateY(-10px) scale(1.14);filter:brightness(2.2);box-shadow:0 0 34px rgba(244,201,93,.75); }
}
@keyframes plinko-board-impact { 35% { transform:translateY(2px); } 65% { transform:translateY(-1px); } }
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
	body.is-game-page .game-outcome-banner { top:6px!important;min-width:190px!important;min-height:52px!important;padding:7px 13px!important;border-radius:13px!important; }
	body.is-game-page .game-outcome-banner>i { font-size:20px!important; }
	body.is-game-page .game-outcome-banner strong { font-size:15px!important; }
	body.is-game-page .game-outcome-banner span { font-size:10px!important; }
}
@keyframes av-aurora-breathe { to{opacity:.55;transform:rotate(-4deg) scale(1.12)} }
@keyframes av-atmosphere-drift { to{translate:8% 10px;scale:1.15} }
@keyframes av-star-twinkle { to{opacity:.62;filter:brightness(1.35)} }
@keyframes av-premium-sea { to{background-position:-520px 0,310px 0,0 0} }
@keyframes av-sea-foreground { to{background-position:-180px 0} }
@keyframes av-nav-light { 50%{opacity:.2} }
@keyframes av-cinematic-light { 0%,100%{background-position:120% 0,0 0}50%{background-position:-80% 0,0 0} }
@keyframes av-status-pulse { 50%{opacity:.35;box-shadow:0 0 2px #65e4ac} }
@keyframes av-callout-danger { 35%{transform:translate(-50%,0) scale(1.045)} }
@keyframes av-button-shine { to{transform:translateX(140%)} }
@keyframes av-cartoon-flight { 0%,100%{margin-top:0}50%{margin-top:-3px} }
@keyframes av-cartoon-boost { from{margin-top:-1px}to{margin-top:1px} }
@keyframes pk-dealer-swap { 0%{opacity:.25;transform:rotateY(90deg) scale(.72)} 55%{opacity:1;transform:rotateY(-8deg) scale(1.08)} 100%{transform:rotateY(0) scale(1)} }
@keyframes pk-dealer-tip { 0%{opacity:0;transform:translate(-50%,8px) scale(.8)} 12%,78%{opacity:1;transform:translate(-50%,-4px) scale(1)} 100%{opacity:0;transform:translate(-50%,-18px) scale(.92)} }
@keyframes pk-croupier-tip { 0%,100%{transform:scale(1)} 35%{transform:scale(1.13) rotate(-5deg)} 65%{transform:scale(1.08) rotate(5deg)} }
@keyframes pk-reaction-pop { 0%{opacity:0;transform:translate(-50%,10px) scale(.35) rotate(-10deg)} 12%,76%{opacity:1;transform:translate(-50%,0) scale(1) rotate(0)} 88%{opacity:1;transform:translate(-50%,-3px) scale(1.06)} 100%{opacity:0;transform:translate(-50%,-12px) scale(.82)} }
@keyframes pk-reaction-thumbs { 0%,100%{transform:translateY(0) rotate(0)} 45%{transform:translateY(-8px) rotate(-5deg)} }
@keyframes pk-reaction-laugh { 0%,100%{transform:rotate(-4deg)} 50%{transform:rotate(4deg) scale(1.03)} }
@keyframes pk-reaction-wow { 0%,100%{transform:scale(1)} 50%{transform:scale(1.13)} }
@keyframes pk-reaction-fire { 0%,100%{transform:translateY(1px) scale(1)} 50%{transform:translateY(-5px) scale(1.07)} }
@keyframes pk-reaction-cry { 0%,100%{transform:translateY(0)} 55%{transform:translateY(7px) rotate(2deg)} }
@keyframes pk-reaction-poker { 0%,100%{transform:rotate(-2deg)} 50%{transform:rotate(2deg) translateY(-2px)} }
@keyframes pk-reaction-pop-edge { 0%{opacity:0;transform:translate(0,10px) scale(.35) rotate(-10deg)} 12%,76%{opacity:1;transform:translate(0,0) scale(1) rotate(0)} 88%{opacity:1;transform:translate(0,-3px) scale(1.06)} 100%{opacity:0;transform:translate(0,-12px) scale(.82)} }
@keyframes pk-buyin-dialog-in { from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none} }

/* Place Bet buttons keep a fixed position on hover across every game. */
.cr-btn-place:hover,
.dice-btn-place:hover,
.limbo-btn-place:hover,
.wheel-btn-place:hover,
.hilo-btn-place:hover,
.bj-btn-place:hover,
.bcr-btn-place:hover,
.dt-btn-place:hover,
.kn-btn-place:hover,
.ck-btn-place:hover,
.cf-btn-place:hover,
.mines-btn-place:hover,
.tw-btn-place:hover,
.pk-btn-place:hover,
.sl-btn-place:hover,
.rps-btn-place:hover,
.av-btn-place:hover,
#crash_bet:hover,
#dice_bet:hover,
#limbo_bet:hover,
#wheel_bet:hover,
#minesweeper_bet:hover,
#tower_bet:hover,
#pk-place-bet:hover,
#sl-place-bet:hover {
    transform: none !important;
}
.case-standard { --case-accent:#3be4a0; --case-deep:#146a57; }
.case-premium { --case-accent:#b56eff; --case-deep:#5928a1; }
.case-elite { --case-accent:#ffbd48; --case-deep:#9b4a13; }
@keyframes cb-public-refresh-spin { to { transform:rotate(360deg); } }
@keyframes cb-round-in { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: scale(1); } }

@keyframes cb-stage-scan { to { transform:translateX(100%); } }
@keyframes cb-orbit { to { transform:rotate(360deg); } }
@keyframes cb-case-float { to { transform:translateY(-7px) rotate(2deg); filter:brightness(1.18); } }
@keyframes cb-case-wave { to { inset:-28px; opacity:.5; } }
@keyframes cb-progress-pulse { to { opacity:.35; } }
@keyframes cb-player-flash { 0%{opacity:0}35%{opacity:1}100%{opacity:0} }
@keyframes cb-mini-case { to { transform:translateY(-4px) rotate(2deg); filter:brightness(1.15); } }
@keyframes cb-reel-spin { 0%{transform:translateX(calc(50% - 132px));filter:blur(0)}55%{filter:blur(1.2px)}100%{transform:translateX(calc(50% - 627px));filter:blur(0)} }
@keyframes cb-winner-pop { from{opacity:0;transform:scale(.35) rotate(-18deg)}to{opacity:1;transform:scale(1) rotate(0)} }
@keyframes cb-confetti { 0%{opacity:0;transform:rotate(calc(var(--i) * 20deg)) translateY(-15px)}20%{opacity:1}100%{opacity:0;transform:rotate(calc(var(--i) * 20deg)) translateY(-105px)} }
@keyframes ft-spin { to { transform: rotate(360deg); } }
@keyframes ft-draw-seat-0 {
    0% { transform:translateY(32px) rotateY(0) rotateX(0) rotateZ(-7deg) scale(.72); }
    12% { transform:translateY(18px) rotateY(135deg) rotateX(14deg) rotateZ(4deg) scale(.88); }
    46% { transform:translateY(-82px) rotateY(900deg) rotateX(28deg) rotateZ(12deg) scale(1.13); }
    78% { transform:translateY(-12px) rotateY(1380deg) rotateX(7deg) rotateZ(-3deg) scale(1.03); }
    88% { transform:translateY(7px) rotateY(1440deg) rotateX(0) rotateZ(0) scale(.94); }
    100% { transform:translateY(0) rotateY(1440deg) rotateX(0) rotateZ(0) scale(1); }
}
@keyframes ft-draw-seat-1 {
    0% { transform:translateY(32px) rotateY(0) rotateX(0) rotateZ(-7deg) scale(.72); }
    12% { transform:translateY(18px) rotateY(135deg) rotateX(14deg) rotateZ(4deg) scale(.88); }
    46% { transform:translateY(-82px) rotateY(990deg) rotateX(28deg) rotateZ(12deg) scale(1.13); }
    78% { transform:translateY(-12px) rotateY(1560deg) rotateX(7deg) rotateZ(-3deg) scale(1.03); }
    88% { transform:translateY(7px) rotateY(1620deg) rotateX(0) rotateZ(0) scale(.94); }
    100% { transform:translateY(0) rotateY(1620deg) rotateX(0) rotateZ(0) scale(1); }
}
@keyframes ft-draw-shadow { 0%{opacity:.35;transform:translateX(-50%) scaleX(.62)} 46%{opacity:.1;transform:translateX(-50%) scaleX(.25)} 88%{opacity:.75;transform:translateX(-50%) scaleX(1.14)} 100%{opacity:.58;transform:translateX(-50%) scaleX(.9)} }
@keyframes ft-draw-land-ring { 0%{opacity:0;transform:scale(.4)} 25%{opacity:1} 100%{opacity:0;transform:scale(1.65)} }
@keyframes ft-draw-reveal { to { opacity:1;transform:translateY(0); } }
@keyframes ft-draw-winner-reveal { 0%{opacity:0;transform:translateY(12px) scale(.88)} 55%{opacity:1;transform:translateY(0) scale(1.06);box-shadow:0 0 30px rgba(255,102,117,.28)} 100%{opacity:1;transform:translateY(0) scale(1);box-shadow:0 0 20px rgba(255,102,117,.16)} }
@keyframes ft-opening-score { 0%{filter:brightness(1);transform:scale(1)} 18%{filter:brightness(1.7);transform:scale(1.035);box-shadow:0 0 32px rgba(244,201,93,.45)} 100%{filter:brightness(1);transform:scale(1);box-shadow:inset 0 1px rgba(255,255,255,.025)} }
@keyframes ft-cell-break { 0%{transform:scaleY(1.35);background:#ff6f7d;box-shadow:0 0 16px rgba(255,95,109,.75)} 100%{transform:scaleY(1);background:#3b2b44;box-shadow:none} }
@keyframes ft-shake { 0%,100%{transform:translate(0,0)} 20%{transform:translate(-6px,3px)} 45%{transform:translate(5px,-2px)} 70%{transform:translate(-3px,1px)} }
@keyframes ft-fight-focus { 0%,100%{opacity:.75;filter:none} 28%{opacity:.42;filter:blur(.4px)} 56%{opacity:.9;filter:brightness(1.25)} }
@keyframes ft-impact-floor { 0%{opacity:.2;transform:scale(.65)} 34%{opacity:1;transform:scale(1.28)} 100%{opacity:.2;transform:scale(1)} }
@keyframes ft-opening-bell { 0%{border-color:rgba(244,201,93,.8);box-shadow:inset 0 0 100px rgba(244,201,93,.28),0 0 38px rgba(244,201,93,.3)} 100%{border-color:rgba(198,154,248,.16);box-shadow:inset 0 0 55px rgba(3,0,8,.48)} }
@keyframes ft-trail-draw { 0%{transform:scaleX(.03);opacity:0} 18%{opacity:1} 100%{transform:scaleX(1);opacity:.95} }
@keyframes ft-trail-projectile { 0%{left:0;transform:scale(.7);opacity:0} 15%{opacity:1} 100%{left:calc(100% - 26px);transform:scale(1.16);opacity:1} }
@keyframes ft-trail-landed { 0%{opacity:1;filter:brightness(2.2)} 100%{opacity:0;filter:brightness(1)} }
@keyframes ft-trail-stopped { 0%{opacity:1;filter:brightness(2)} 100%{opacity:0;filter:brightness(1)} }
@keyframes ft-trail-missed { 0%{opacity:1} 55%{opacity:.9} 100%{opacity:0} }
@keyframes ft-trail-collapse { from{transform:scaleX(1)} to{transform:translateX(-16px) scaleX(.65)} }
@keyframes ft-trail-flyby { from{transform:scaleX(1)} to{transform:translateX(54px) scaleX(.62)} }
@keyframes ft-trail-projectile-miss { from{left:calc(100% - 26px)} to{left:115%;opacity:0} }
@keyframes ft-verdict-in { 0%{opacity:0;transform:translate(-50%,-78%) scale(.7)} 20%{opacity:1;transform:translate(-50%,-50%) scale(1.06)} 34%,72%{opacity:1;transform:translate(-50%,-50%) scale(1)} 100%{opacity:0;transform:translate(-50%,-68%) scale(.96)} }
@keyframes ft-knockout-stage {
    0%,100% { transform:translate(0);filter:none; }
    18% { transform:translate(-9px,3px);filter:brightness(1.45); }
    34% { transform:translate(8px,-3px); }
    52% { transform:translate(-5px,2px); }
    70% { transform:translate(3px,-1px); }
}
@keyframes ft-ko-flash {
    0% { opacity:0;transform:translate(-50%,-50%) scale(.28) rotate(-13deg); }
    18% { opacity:1;transform:translate(-50%,-50%) scale(1.18) rotate(-5deg); }
    34%,68% { opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-7deg); }
    100% { opacity:0;transform:translate(-50%,-62%) scale(1.08) rotate(-7deg); }
}
@keyframes ft-ko-ring {
    0% { opacity:0;transform:scale(.25); }
    28% { opacity:1; }
    100% { opacity:0;transform:scale(1.55); }
}
@keyframes ft-opening-fighter { 0%{transform:translateY(0);filter:brightness(1)} 16%{transform:translateY(-18px) scale(1.08);filter:brightness(1.55) drop-shadow(0 0 18px rgba(244,201,93,.68))} 34%{transform:translateY(0) scale(1.02)} 48%{transform:translateY(-6px) scale(1.04)} 100%{transform:translateY(0);filter:brightness(1)} }
@keyframes ft-lunge-a {
    0%,100% { transform:translateX(0) rotate(0); }
    13% { transform:translateX(-8px) translateY(2px) rotate(-2deg); }
    27% { transform:translateX(-13px) translateY(4px) rotate(-3deg); }
    52%,63% { transform:translateX(56px) translateY(-2px) rotate(4deg); }
    76% { transform:translateX(43px) translateY(0) rotate(2deg); }
}
@keyframes ft-lunge-b {
    0%,100% { transform:translateX(0) rotate(0); }
    13% { transform:translateX(8px) translateY(2px) rotate(2deg); }
    27% { transform:translateX(13px) translateY(4px) rotate(3deg); }
    52%,63% { transform:translateX(-56px) translateY(-2px) rotate(-4deg); }
    76% { transform:translateX(-43px) translateY(0) rotate(-2deg); }
}
@keyframes ft-idle-guard { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-3px) rotate(-1deg)} }
@keyframes ft-idle-breathe { 0%,100%{transform:scaleY(1) translateY(0);filter:brightness(1)} 50%{transform:scaleY(1.025) translateY(-2px);filter:brightness(1.07)} }
@keyframes ft-idle-shadow { 0%,100%{transform:scaleX(1);opacity:.58} 50%{transform:scaleX(.94);opacity:.48} }
@keyframes ft-strike-focus { 0%,100%{filter:none} 30%{filter:drop-shadow(-7px 1px 0 rgba(198,154,255,.08))} 52%,63%{filter:brightness(1.1) drop-shadow(-14px 2px 0 rgba(255,213,109,.14))} }
@keyframes ft-fx-hit { 0%{opacity:0;transform:scale(.3)} 35%{opacity:1;transform:scale(1.05)} 100%{opacity:0;transform:scale(1.35)} }
@keyframes ft-fx-block { 0%{opacity:0;transform:scale(.4)} 40%{opacity:.95;transform:scale(1)} 100%{opacity:0;transform:scale(1.2)} }
@keyframes ft-fx-miss { 0%{opacity:0;transform:translateX(-24px) scale(.65)} 30%{opacity:1} 100%{opacity:0;transform:translateX(45px) scale(1.15)} }
@keyframes ft-impact-star { 0%{opacity:0;transform:scale(.18) rotate(-18deg)} 35%{opacity:1;transform:scale(1.15) rotate(5deg)} 100%{opacity:0;transform:scale(1.42) rotate(14deg)} }
@keyframes ft-impact-ring { 0%{opacity:0;transform:scale(.2)} 35%{opacity:1} 100%{opacity:0;transform:scale(2.2)} }
@keyframes ft-punch-high {
    0% { transform:rotate(-10deg); }
    18% { transform:rotate(25deg); }
    31% { transform:rotate(12deg); }
    52%,64% { transform:rotate(-109deg); }
    76% { transform:rotate(-91deg); }
    100% { transform:rotate(-10deg); }
}
@keyframes ft-punch-mid {
    0% { transform:rotate(10deg); }
    20% { transform:rotate(62deg); }
    32% { transform:rotate(48deg); }
    52%,64% { transform:rotate(-96deg); }
    77% { transform:rotate(-73deg); }
    100% { transform:rotate(10deg); }
}
@keyframes ft-punch-high-forearm { 0%{transform:rotate(-155deg)} 18%{transform:rotate(-179deg)} 31%{transform:rotate(-166deg)} 52%,64%{transform:rotate(1deg) scaleY(1.15)} 76%{transform:rotate(-18deg) scaleY(1.08)} 100%{transform:rotate(-155deg)} }
@keyframes ft-punch-high-guard { 0%,100%{transform:rotate(10deg)} 20%,70%{transform:translate(4px,-5px) rotate(28deg)} }
@keyframes ft-punch-mid-forearm { 0%{transform:rotate(155deg)} 20%{transform:rotate(178deg)} 32%{transform:rotate(164deg)} 52%,64%{transform:rotate(0) scaleY(1.18)} 77%{transform:rotate(18deg) scaleY(1.08)} 100%{transform:rotate(155deg)} }
@keyframes ft-punch-mid-guard { 0%,100%{transform:rotate(-10deg)} 22%,70%{transform:translate(-3px,-6px) rotate(-26deg)} }
@keyframes ft-kick-low { 0%{transform:rotate(-16deg)} 18%{transform:translateY(-5px) rotate(34deg)} 31%{transform:translateY(-8px) rotate(58deg)} 52%,65%{transform:translate(3px,-2px) rotate(-82deg)} 78%{transform:translateY(-4px) rotate(-45deg)} 100%{transform:rotate(-16deg)} }
@keyframes ft-kick-low-shin { 0%{transform:rotate(22deg)} 18%{transform:rotate(86deg)} 31%{transform:rotate(126deg)} 52%,65%{transform:rotate(-3deg) scaleY(1.14)} 78%{transform:rotate(42deg)} 100%{transform:rotate(22deg)} }
@keyframes ft-kick-support { 0%,100%{transform:rotate(14deg)} 20%{transform:translateY(3px) rotate(5deg)} 40%,70%{transform:translateY(5px) rotate(-9deg)} }
@keyframes ft-attack-upper-high { 0%,100%{transform:translate(0,0) rotate(0)} 18%,31%{transform:translate(-5px,2px) rotate(-4deg)} 52%,64%{transform:translate(11px,-2px) rotate(5deg)} 78%{transform:translate(5px,0) rotate(2deg)} }
@keyframes ft-attack-upper-mid { 0%,100%{transform:translate(0,0) rotate(0)} 20%,32%{transform:translate(-7px,2px) rotate(-9deg)} 52%,64%{transform:translate(13px,-1px) rotate(11deg)} 78%{transform:translate(5px,0) rotate(4deg)} }
@keyframes ft-attack-upper-low { 0%,100%{transform:translate(0,0) rotate(0)} 18%,31%{transform:translate(-5px,5px) rotate(-7deg)} 52%,65%{transform:translate(-9px,-3px) rotate(-14deg)} 78%{transform:translate(-3px,0) rotate(-5deg)} }
@keyframes ft-lean { 0%,100%{transform:translateX(0)} 22%{transform:translateX(-5px)} 52%,64%{transform:translateX(9px)} }
@keyframes ft-duck-upper { 0%,100%{transform:translate(0,0) rotate(0)} 16%{transform:translate(-2px,5px) rotate(-2deg)} 34%,68%{transform:translate(5px,32px) rotate(7deg)} 84%{transform:translate(1px,9px) rotate(2deg)} }
@keyframes ft-duck-thigh-front { 0%,100%{transform:translateY(0) rotate(-16deg)} 16%{transform:translateY(7px) rotate(-25deg)} 34%,68%{transform:translateY(38px) rotate(-68deg)} 84%{transform:translateY(12px) rotate(-30deg)} }
@keyframes ft-duck-thigh-back { 0%,100%{transform:translateY(0) rotate(14deg)} 16%{transform:translateY(7px) rotate(25deg)} 34%,68%{transform:translateY(38px) rotate(68deg)} 84%{transform:translateY(12px) rotate(30deg)} }
@keyframes ft-duck-shin-front { 0%,100%{transform:rotate(22deg)} 16%{transform:rotate(43deg)} 34%,68%{transform:rotate(120deg)} 84%{transform:rotate(50deg)} }
@keyframes ft-duck-shin-back { 0%,100%{transform:rotate(-20deg)} 16%{transform:rotate(-43deg)} 34%,68%{transform:rotate(-120deg)} 84%{transform:rotate(-50deg)} }
@keyframes ft-duck-shadow { 0%,100%{transform:scaleX(1);opacity:.58} 16%{transform:scaleX(1.08);opacity:.62} 34%,68%{transform:scaleX(1.36);opacity:.76} 84%{transform:scaleX(1.12);opacity:.64} }
@keyframes ft-jump {
    0%,100% { transform:translateY(0); }
    13% { transform:translateY(10px) scaleY(.985); }
    27% { transform:translateY(-30px) scaleY(1.015); }
    47% { transform:translateY(-78px); }
    63% { transform:translateY(-59px); }
    80% { transform:translateY(7px) scaleY(.98); }
    90% { transform:translateY(2px) scaleY(1.01); }
}
@keyframes ft-jump-upper { 0%,100%{transform:translate(0,0) rotate(0)} 13%{transform:translate(-2px,7px) rotate(-3deg)} 27%{transform:translate(2px,-3px) rotate(3deg)} 47%,63%{transform:translate(3px,-1px) rotate(5deg)} 80%{transform:translate(-2px,8px) rotate(-4deg)} }
@keyframes ft-jump-thigh-front { 0%,100%{transform:rotate(-16deg)} 13%{transform:translateY(6px) rotate(-48deg)} 27%{transform:rotate(-8deg)} 47%,63%{transform:rotate(-58deg)} 80%{transform:translateY(5px) rotate(-44deg)} 90%{transform:rotate(-20deg)} }
@keyframes ft-jump-thigh-back { 0%,100%{transform:rotate(14deg)} 13%{transform:translateY(6px) rotate(49deg)} 27%{transform:rotate(8deg)} 47%,63%{transform:rotate(57deg)} 80%{transform:translateY(5px) rotate(43deg)} 90%{transform:rotate(18deg)} }
@keyframes ft-jump-shin-front { 0%,100%{transform:rotate(22deg)} 13%{transform:rotate(94deg)} 27%{transform:rotate(18deg)} 47%,63%{transform:rotate(122deg)} 80%{transform:rotate(100deg)} 90%{transform:rotate(32deg)} }
@keyframes ft-jump-shin-back { 0%,100%{transform:rotate(-20deg)} 13%{transform:rotate(-92deg)} 27%{transform:rotate(-17deg)} 47%,63%{transform:rotate(-120deg)} 80%{transform:rotate(-98deg)} 90%{transform:rotate(-30deg)} }
@keyframes ft-jump-arm-front { 0%,100%{transform:rotate(-10deg)} 13%{transform:rotate(24deg)} 27%,63%{transform:rotate(-42deg)} 80%{transform:rotate(18deg)} }
@keyframes ft-jump-arm-back { 0%,100%{transform:rotate(10deg)} 13%{transform:rotate(-24deg)} 27%,63%{transform:rotate(43deg)} 80%{transform:rotate(-18deg)} }
@keyframes ft-jump-forearm-front { 0%,100%{transform:rotate(-155deg)} 13%{transform:rotate(-122deg)} 27%,63%{transform:rotate(-92deg)} 80%{transform:rotate(-132deg)} }
@keyframes ft-jump-forearm-back { 0%,100%{transform:rotate(155deg)} 13%{transform:rotate(122deg)} 27%,63%{transform:rotate(92deg)} 80%{transform:rotate(132deg)} }
@keyframes ft-block-front {
    0%,100% { left:var(--ft-arm-front-x);top:var(--ft-arm-front-y);transform:rotate(-10deg); }
    16% { left:calc(var(--ft-arm-front-x) + 3px);top:calc(var(--ft-arm-front-y) + 1px);transform:rotate(4deg); }
    34%,72% { left:calc(var(--ft-arm-front-x) - 15px);top:var(--ft-arm-front-y);transform:rotate(-18deg); }
}
@keyframes ft-block-back {
    0%,100% { left:var(--ft-arm-back-x);top:var(--ft-arm-back-y);transform:rotate(10deg); }
    16% { left:calc(var(--ft-arm-back-x) - 3px);top:calc(var(--ft-arm-back-y) + 1px);transform:rotate(24deg); }
    34%,72% { left:calc(var(--ft-arm-back-x) + 3px);top:var(--ft-arm-back-y);transform:rotate(18deg); }
}
@keyframes ft-block-front-forearm { 0%,100%{transform:rotate(-155deg)} 16%{transform:rotate(-174deg)} 34%,72%{transform:rotate(-166deg)} }
@keyframes ft-block-back-forearm { 0%,100%{transform:rotate(155deg)} 16%{transform:rotate(174deg)} 34%,72%{transform:rotate(162deg)} }
@keyframes ft-recoil { 0%{transform:translateX(0) translateY(0) rotate(0)} 16%{transform:translateX(-42px) translateY(-5px) rotate(-14deg)} 28%{transform:translateX(-36px) translateY(1px) rotate(-10deg)} 46%{transform:translateX(-22px) translateY(0) rotate(-5deg)} 72%{transform:translateX(5px) rotate(2deg)} 100%{transform:translateX(0) rotate(0)} }
@keyframes ft-recoil-b { 0%{transform:translateX(0) translateY(0) rotate(0)} 16%{transform:translateX(42px) translateY(-5px) rotate(14deg)} 28%{transform:translateX(36px) translateY(1px) rotate(10deg)} 46%{transform:translateX(22px) translateY(0) rotate(5deg)} 72%{transform:translateX(-5px) rotate(-2deg)} 100%{transform:translateX(0) rotate(0)} }
@keyframes ft-head-snap { 0%,100%{transform:translate(2px,1px) rotate(1deg);filter:none} 16%,25%{transform:translate(7px,-2px) rotate(20deg);filter:brightness(1.75) drop-shadow(7px 0 0 rgba(255,95,109,.28))} 48%{transform:translate(1px,2px) rotate(-6deg)} }
@keyframes ft-hit-high-body { 0%,100%{transform:translate(0,0) rotate(0)} 16%,25%{transform:translate(-5px,3px) rotate(-10deg)} 48%{transform:translate(2px,1px) rotate(4deg)} }
@keyframes ft-hit-mid-body { 0%,100%{transform:translate(0,0) rotate(0)} 16%,28%{transform:translate(-8px,9px) rotate(-15deg) scaleY(.92)} 48%{transform:translate(3px,4px) rotate(5deg) scaleY(.97)} }
@keyframes ft-hit-low-body { 0%,100%{transform:translate(0,0) rotate(0)} 16%,30%{transform:translate(-7px,13px) rotate(-10deg)} 52%{transform:translate(2px,5px) rotate(4deg)} }
@keyframes ft-hit-low-leg-front { 0%,100%{transform:rotate(-16deg)} 16%,30%{transform:translateY(9px) rotate(-38deg)} 52%{transform:translateY(3px) rotate(-24deg)} }
@keyframes ft-hit-low-leg-back { 0%,100%{transform:rotate(14deg)} 16%,30%{transform:translateY(7px) rotate(34deg)} 52%{transform:translateY(2px) rotate(22deg)} }
@keyframes ft-dodge-ghost { 0%,100%{filter:none;opacity:1} 22%{filter:drop-shadow(-18px 0 0 rgba(198,154,255,.2));opacity:.72} 50%{filter:drop-shadow(13px 0 0 rgba(198,154,255,.15));opacity:1} }
@keyframes ft-knockout-a {
    0% { transform:translate(0,0) rotate(0); }
    22% { transform:translate(-18px,-5px) rotate(-10deg); }
    58% { transform:translate(-31px,32px) rotate(-72deg); }
    76% { transform:translate(-28px,27px) rotate(-66deg); }
    100% { transform:translate(-31px,30px) rotate(-69deg); }
}
@keyframes ft-knockout-b {
    0% { transform:translate(0,0) rotate(0); }
    22% { transform:translate(18px,-5px) rotate(10deg); }
    58% { transform:translate(31px,32px) rotate(72deg); }
    76% { transform:translate(28px,27px) rotate(66deg); }
    100% { transform:translate(31px,30px) rotate(69deg); }
}
@keyframes ft-winner-glow {
    from { filter:drop-shadow(0 0 0 rgba(244,201,93,0)); }
    to { filter:drop-shadow(0 0 16px rgba(244,201,93,.72)) brightness(1.13); }
}
@keyframes ft-brace { 0%,100%{filter:none;transform:scale(1)} 32%{filter:brightness(1.65);transform:scale(.94,1.05)} }
@keyframes ft-block-recoil-a { 0%,100%{transform:translateX(0)} 28%{transform:translateX(-13px) rotate(-4deg)} 55%{transform:translateX(-7px) rotate(-2deg)} }
@keyframes ft-block-recoil-b { 0%,100%{transform:translateX(0)} 28%{transform:translateX(13px) rotate(4deg)} 55%{transform:translateX(7px) rotate(2deg)} }
@keyframes ft-pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.14)} }
@keyframes ft-stage-rematch-pulse { 0%,100%{box-shadow:0 14px 34px rgba(74,24,143,.52),0 0 22px rgba(177,111,255,.24),inset 0 1px rgba(255,255,255,.24)} 50%{box-shadow:0 14px 38px rgba(74,24,143,.58),0 0 38px rgba(200,133,255,.5),inset 0 1px rgba(255,255,255,.3)} }
@keyframes ft-clean-sweep-in { 0%{opacity:0;transform:translateY(18px) scale(.92)} 58%{opacity:1;transform:translateY(-2px) scale(1.02)} 100%{opacity:1;transform:translateY(0) scale(1)} }
@keyframes ft-result-winner-in { from{opacity:0;transform:translateY(18px) scale(.92)} to{opacity:1;transform:translateY(0) scale(1)} }
@keyframes ft-result-loser-in { from{opacity:0;transform:translateY(-8px) rotate(2deg)} to{opacity:.86;transform:translateY(0) rotate(0)} }
@keyframes ft-result-divider-in { from{opacity:0;transform:scale(.3) rotate(-90deg)} to{opacity:1;transform:scale(1) rotate(0)} }
@keyframes ft-confetti { 0%{opacity:0;transform:translateY(-10px) rotate(0)} 12%{opacity:1} 100%{opacity:0;transform:translateY(230px) rotate(420deg)} }
@keyframes ftLivePulse { 0%,100% { opacity: 1; } 50% { opacity: .25; } }

/* Terms of Service — readable legal document with a compact section index. */
.tos-page { width: min(1180px,100%); margin: 0 auto; box-sizing: border-box; color: #b9afc1; }
.tos-hero { position: relative; display: flex; min-height: 230px; align-items: center; justify-content: space-between; gap: 28px; padding: 42px 46px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 22px; background: radial-gradient(circle at 88% 0,rgba(147,83,235,.3),transparent 42%),linear-gradient(145deg,#281c36,#17111f 72%); box-shadow: 0 24px 70px rgba(4,1,10,.36),inset 0 1px rgba(255,255,255,.05); box-sizing: border-box; }
.tos-hero::after { content: ''; position: absolute; right: -70px; bottom: -125px; width: 310px; height: 310px; border: 1px solid rgba(198,157,255,.09); border-radius: 50%; box-shadow: 0 0 0 45px rgba(198,157,255,.025),0 0 0 90px rgba(198,157,255,.018); }
.tos-hero-copy { position: relative; z-index: 1; max-width: 750px; }
.tos-kicker { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 13px; color: #b98ced; font-size: 10px; font-weight: 850; letter-spacing: .13em; }
.tos-hero h1 { margin: 0; color: #fff; font: 850 clamp(32px,5vw,52px)/1.04 var(--site-font-display); letter-spacing: -.035em; }
.tos-hero p { max-width: 700px; margin: 17px 0 0; color: #c7bdce; font-size: 15px; line-height: 1.65; }
.tos-meta { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 22px; color: #8f8399; font-size: 11px; font-weight: 700; }
.tos-meta span { display: inline-flex; align-items: center; gap: 7px; }
.tos-meta i { color: #aa78e6; }
.tos-hero-mark { position: relative; z-index: 1; display: grid; width: 112px; height: 112px; flex: 0 0 112px; place-items: center; border: 1px solid rgba(197,148,255,.2); border-radius: 32px; background: rgba(139,72,232,.1); color: #c597f5; font-size: 44px; box-shadow: inset 0 1px rgba(255,255,255,.07),0 22px 55px rgba(8,2,16,.3); transform: rotate(3deg); }
.tos-notice { display: flex; align-items: flex-start; gap: 12px; margin: 16px 0 24px; padding: 16px 18px; border: 1px solid rgba(185,140,237,.16); border-radius: 14px; background: rgba(139,72,232,.07); }
.tos-notice i { margin-top: 3px; color: #bc8df0; }
.tos-notice p { margin: 0; color: #bcb1c5; font-size: 13px; line-height: 1.6; }
.tos-layout { display: grid; grid-template-columns: 245px minmax(0,1fr); align-items: start; gap: 20px; }
.tos-sidebar { position: sticky; top: 86px; }
.tos-nav { display: flex; flex-direction: column; padding: 13px; border: 1px solid rgba(255,255,255,.07); border-radius: 16px; background: linear-gradient(155deg,rgba(37,27,48,.94),rgba(20,15,26,.94)); box-shadow: 0 18px 45px rgba(4,1,10,.18); }
.tos-nav strong { padding: 8px 9px 12px; color: #fff; font: 800 13px/1 var(--site-font-display); }
.tos-nav a { display: flex; align-items: center; gap: 10px; padding: 8px 9px; border-radius: 8px; color: #8e8396; font-size: 11px; font-weight: 650; text-decoration: none; transition: color .16s,background .16s; }
.tos-nav a span { width: 19px; color: #735e88; font-size: 8px; font-weight: 850; letter-spacing: .05em; }
.tos-nav a:hover { background: rgba(255,255,255,.045); color: #fff; }
.tos-nav a:hover span { color: #bd8cf2; }
.tos-content { display: flex; min-width: 0; flex-direction: column; gap: 14px; }
.tos-section { scroll-margin-top: 88px; display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 16px; padding: 25px 27px; border: 1px solid rgba(255,255,255,.065); border-radius: 16px; background: linear-gradient(150deg,rgba(38,28,48,.7),rgba(23,17,29,.76)); box-shadow: inset 0 1px rgba(255,255,255,.025); }
.tos-section-number { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(181,123,245,.16); border-radius: 12px; background: rgba(139,72,232,.08); color: #a677d7; font: 850 10px/1 var(--site-font-display); letter-spacing: .06em; }
.tos-section h2 { margin: 2px 0 12px; color: #fff; font: 800 20px/1.2 var(--site-font-display); }
.tos-section p { margin: 0 0 12px; color: #aaa0b2; font-size: 13px; line-height: 1.72; }
.tos-section p:last-child { margin-bottom: 0; }
.tos-section ul { margin: 0 0 13px; padding-left: 18px; color: #aaa0b2; font-size: 13px; line-height: 1.65; }
.tos-section li { padding-left: 3px; margin-bottom: 7px; }
.tos-section li::marker { color: #a873df; }
.tos-section a { color: #bd8df1; font-weight: 700; }
.tos-callout { display: flex; align-items: flex-start; gap: 11px; margin-top: 15px; padding: 13px 14px; border: 1px solid rgba(196,145,249,.13); border-radius: 11px; background: rgba(139,72,232,.06); }
.tos-callout i { margin-top: 4px; color: #bd8df1; }
.tos-callout p { margin: 0; color: #c3b8cb; }
.tos-callout--green { border-color: rgba(49,220,128,.15); background: rgba(9,185,91,.055); }
.tos-callout--green i { color: #45d68a; }
.tos-rule-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 3px 0 15px; }
.tos-rule-grid span { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 11px 12px; border: 1px solid rgba(255,255,255,.055); border-radius: 10px; background: rgba(7,4,12,.22); color: #b8aebf; font-size: 11px; font-weight: 700; }
.tos-rule-grid i { width: 15px; color: #e0798a; text-align: center; }
.tos-contact { border-color: rgba(173,114,239,.16); background: radial-gradient(circle at 95% 0,rgba(139,72,232,.13),transparent 37%),linear-gradient(150deg,rgba(38,28,48,.85),rgba(23,17,29,.8)); }
.tos-contact .tos-section-number { color: #c08ef2; font-size: 16px; }
.tos-support-link { display: inline-flex; min-height: 43px; align-items: center; justify-content: center; gap: 8px; margin-top: 3px; padding: 0 17px; border: 1px solid rgba(190,137,247,.22); border-radius: 10px; background: rgba(139,72,232,.12); color: #d2b2f5!important; font-size: 11px; text-decoration: none; transition: transform .16s,background .16s; }
.tos-support-link:hover { background: rgba(139,72,232,.21); transform: translateY(-1px); }
@media (max-width: 850px) {
    .tos-layout { grid-template-columns: 1fr; }
    .tos-sidebar { position: static; }
    .tos-nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .tos-nav strong { grid-column: 1/-1; }
}
@media (max-width: 600px) {
    .tos-page { padding-right: 12px!important; padding-left: 12px!important; }
    .tos-hero { min-height: 0; padding: 29px 22px; border-radius: 18px; }
    .tos-hero-mark { display: none; }
    .tos-hero h1 { font-size: 34px; }
    .tos-hero p { font-size: 13px; }
    .tos-meta { flex-direction: column; gap: 7px; }
    .tos-nav { grid-template-columns: 1fr; max-height: 290px; overflow-y: auto; }
    .tos-nav strong { grid-column: auto; }
    .tos-section { grid-template-columns: 1fr; gap: 12px; padding: 20px 18px; }
    .tos-section-number { width: 38px; height: 38px; }
    .tos-section h2 { font-size: 19px; }
    .tos-rule-grid { grid-template-columns: 1fr; }
}
@keyframes cf-toss-heads { 0%{transform:translateY(0) rotateY(0) rotateZ(0)} 46%{transform:translateY(-84px) rotateY(690deg) rotateZ(7deg) scale(1.08)} 100%{transform:translateY(0) rotateY(1440deg) rotateZ(0)} }
@keyframes cf-toss-tails { 0%{transform:translateY(0) rotateY(0) rotateZ(0)} 46%{transform:translateY(-84px) rotateY(780deg) rotateZ(-7deg) scale(1.08)} 100%{transform:translateY(0) rotateY(1620deg) rotateZ(0)} }
@keyframes cf-shadow-flight { 0%,100%{width:104px;opacity:.7;filter:blur(9px)} 46%{width:48px;opacity:.2;filter:blur(13px)} }
@keyframes cf-charge-ring { 0%{opacity:.55;transform:translate(-50%,-50%) scale(.45)} 100%{opacity:0;transform:translate(-50%,-50%) scale(2.6)} }
@keyframes cf-land-ring { 0%{opacity:.9;transform:translate(-50%,-50%) scale(.4)} 100%{opacity:0;transform:translate(-50%,-50%) scale(3.8)} }
@keyframes cf-spark-burst { 25%{opacity:1} 100%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(1.5)} }
@keyframes cf-orbit-tilt { to{transform:translate(-50%,-50%) rotate(348deg)} }
@keyframes cf-streak-arrive { 0%{opacity:0;transform:translateY(-8px) scale(.6)} 65%{transform:translateY(2px) scale(1.12)} }

/* Quiet chat UI — deliberately secondary to the games. */
.pullout[data-pullout="chat"] {
    border:0 !important;
    border-left:1px solid rgba(255,255,255,.055) !important;
    background:linear-gradient(180deg,rgba(28,22,34,.985),rgba(20,16,25,.99)) !important;
    box-shadow:-16px 0 42px rgba(4,2,8,.24) !important;
    backdrop-filter:blur(12px) !important;
    -webkit-backdrop-filter:blur(12px) !important;
}
.pullout[data-pullout="chat"] > .m-2 { margin:0 !important; padding:11px 11px 10px; border-bottom:1px solid rgba(255,255,255,.05); background:rgba(255,255,255,.012); }
.pullout[data-pullout="chat"] .lang-select { margin:0; padding:0; }
.pullout[data-pullout="chat"] .lang-select .selected { min-height:38px; padding:8px 10px; border:1px solid rgba(255,255,255,.065); border-radius:9px; background:rgba(255,255,255,.025); color:#b6aebb; box-sizing:border-box; }
.pullout[data-pullout="chat"] .lang-select .selected:hover { border-color:rgba(174,126,232,.16); background:rgba(255,255,255,.04); opacity:1; }
.pullout[data-pullout="chat"] .lang-select .selected img { width:19px; height:19px; margin:1px 8px 0 0; opacity:.72; }
.pullout[data-pullout="chat"] .lang-select p { color:#b6aebb; font-size:11px; font-weight:700; }
.pullout[data-pullout="chat"] .lang-select i.drop { top:12px; right:12px; color:#746b7b; font-size:10px; }
.pullout[data-pullout="chat"] .lang-select .options { top:43px; padding:5px; border:1px solid rgba(255,255,255,.07); border-radius:10px; background:#211a28; box-shadow:0 18px 38px rgba(0,0,0,.32); }
.pullout[data-pullout="chat"] .lang-select .options .opt { min-height:35px; padding:7px 10px; border-radius:7px; color:#918895; box-sizing:border-box; }
.pullout[data-pullout="chat"] .lang-select .options .opt:hover { background:rgba(255,255,255,.04); color:#d5ced9; }
.pullout[data-pullout="chat"] .lang-select .options .opt img { opacity:.62; }
.pullout[data-pullout="chat"] .lang-select .options .opt > i:not(.check) { width:20px; margin-top:4px; float:left; color:#786d80; text-align:center; }
.pullout[data-pullout="chat"] .lang-select .options .opt i.check { color:#a884d4; }
.pullout[data-pullout="chat"] .emojis-content.all-emojis { padding:8px; border:0; background:transparent; }
.pullout[data-pullout="chat"] .emojis-content.all-emojis img { width:30px; height:30px; border-radius:7px; filter:saturate(.78); }
.pullout[data-pullout="chat"] .emojis-content.all-emojis img:hover { background:rgba(255,255,255,.045); filter:saturate(1); transform:scale(1.04); }

/* The closed tab is intentionally quiet and gains emphasis only on hover. */
.slider.slider-right[data-pullout="chat"] { position:fixed !important; top:auto !important; bottom:15vh !important; width:38px !important; min-height:42px; padding:0 !important; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.065) !important; border-right:0 !important; border-radius:11px 0 0 11px !important; background:rgba(31,25,37,.94) !important; color:#827889; box-shadow:0 9px 24px rgba(0,0,0,.2); }
.slider.slider-right[data-pullout="chat"]:hover { width:42px !important; background:#241d2b !important; color:#b0a5b7; }
.slider.slider-right[data-pullout="chat"] i { margin:auto; font-size:14px; }

/* Rebuilt footer — clean information hierarchy without placeholder links. */
body .footer { padding:0 !important; border-top:1px solid rgba(255,255,255,.055) !important; background:linear-gradient(180deg,#211a28 0,#18131d 100%) !important; color:#a69eaa; }
.footer p,.footer span,.footer small,.footer strong,.footer h1,.footer h2,.footer h3,.footer h4 { cursor:default;user-select:none;-webkit-user-select:none; }
.footer a,.footer button { cursor:pointer;user-select:none;-webkit-user-select:none; }
.site-footer-shell { width:min(100%,1240px); margin:0 auto; padding:36px 30px 20px; box-sizing:border-box; }
.site-footer-main { display:grid; grid-template-columns:minmax(260px,1.05fr) minmax(430px,1.45fr); gap:clamp(48px,7vw,105px); align-items:start; }
.site-footer-brand { min-width:0; }
.site-footer-logo { display:inline-flex; width:190px; height:61px; align-items:center; margin-bottom:12px; }
.site-footer-logo img { width:190px; max-width:100%; max-height:61px; object-fit:contain; object-position:left center; }
.site-footer-brand > p { max-width:410px; margin:0; color:#817985; font-size:11px; line-height:1.65; }
.site-footer-live { display:flex; flex-wrap:wrap; gap:7px; margin-top:15px; }
.site-footer-live > span { min-height:28px; display:inline-flex; align-items:center; gap:5px; padding:0 9px; border:1px solid rgba(255,255,255,.055); border-radius:8px; background:rgba(255,255,255,.018); color:#716a75; font-size:8px; font-weight:750; letter-spacing:.035em; text-transform:uppercase; }
.site-footer-live > span i { width:5px; height:5px; border-radius:50%; background:#59bd8a; box-shadow:0 0 8px rgba(89,189,138,.38); }
.site-footer-live strong { color:#b8b0bc; font-size:9px; font-variant-numeric:tabular-nums; }
.site-footer-nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(24px,4vw,58px); }
.site-footer-column { min-width:0; display:block; }
.site-footer-column summary { list-style:none; }
.site-footer-column summary::-webkit-details-marker { display:none; }
.site-footer-column summary > strong { color:#776e7d; font-size:8px; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.site-footer-column summary > i { display:none; }
.site-footer-links { display:flex; flex-direction:column; gap:9px; margin-top:12px; }
.site-footer-column a { width:max-content; max-width:100%; color:#bbb4bf !important; font-size:11px; font-weight:650; line-height:1.4; text-decoration:none !important; transition:color .16s,transform .16s; }
.site-footer-column a:hover { color:#fff !important; transform:translateX(2px); }
.site-footer-utility { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:29px; padding:16px 0; border-top:1px solid rgba(255,255,255,.045); border-bottom:1px solid rgba(255,255,255,.045); }
.site-footer-trust,.site-footer-assets { display:flex; flex-wrap:wrap; align-items:center; gap:7px; }
.site-footer-trust > span { display:inline-flex; align-items:center; gap:6px; color:#756e79; font-size:8px; font-weight:750; }
.site-footer-trust i { color:#88739f; font-size:9px; }
.site-footer-assets span { height:29px; display:inline-flex; align-items:center; gap:5px; padding:0 8px 0 5px; border:1px solid rgba(255,255,255,.05); border-radius:8px; background:rgba(255,255,255,.016); }
.site-footer-assets img { width:19px; height:19px; object-fit:contain; opacity:.58; filter:saturate(.65); }
.site-footer-assets b { color:#746d78; font-size:7px; letter-spacing:.05em; }
.site-footer-bottom { min-height:39px; display:grid; grid-template-columns:auto minmax(250px,1fr) auto; align-items:end; gap:18px; padding-top:15px; }
.site-footer-bottom p { margin:0; color:#5e5762; font-size:8px; line-height:1.45; }
.site-footer-license { text-align:center; }
.site-footer-bottom > div { display:flex; justify-content:flex-end; gap:13px; }
.site-footer-bottom a { color:#756d79 !important; font-size:8px; font-weight:750; text-decoration:none !important; }
.site-footer-bottom a:hover { color:#c3bbc8 !important; }
@media (max-width:900px) {
    .site-footer-shell { padding:30px 24px 19px; }
    .site-footer-main { grid-template-columns:1fr; gap:30px; }
    .site-footer-brand { display:grid; grid-template-columns:auto 1fr; column-gap:22px; align-items:center; }
    .site-footer-logo { grid-row:1 / 3; margin:0; }
    .site-footer-brand > p { align-self:end; }
    .site-footer-live { align-self:start; margin-top:8px; }
    .site-footer-utility { align-items:flex-start; flex-direction:column; }
    .site-footer-bottom { grid-template-columns:1fr auto; }
    .site-footer-license { grid-column:1 / -1; grid-row:2; text-align:left; }
}
@media (max-width:600px) {
    body .footer { margin-left:0 !important; }
    .site-footer-shell { padding:27px 16px calc(18px + env(safe-area-inset-bottom,0px)); }
    .site-footer-main { gap:25px; }
    .site-footer-brand { display:flex; align-items:flex-start; flex-direction:column; gap:8px; }
    .site-footer-logo { width:166px; height:53px; }
    .site-footer-logo img { width:166px; max-height:53px; }
    .site-footer-brand > p { max-width:330px; }
    .site-footer-live { margin-top:5px; }
    .site-footer-nav { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px 18px; }
    .site-footer-column:last-child { grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
    .site-footer-column:last-child > strong { grid-column:1 / -1; }
    .site-footer-column:last-child a { width:auto; }
    .site-footer-utility { margin-top:24px; padding:14px 0; }
    .site-footer-trust { gap:9px 13px; }
    .site-footer-assets span { padding-right:5px; }
    .site-footer-assets b { display:none; }
    .site-footer-bottom { grid-template-columns:1fr; align-items:start; gap:8px; }
    .site-footer-license { grid-column:auto; grid-row:auto; text-align:left; }
    .site-footer-bottom > div { justify-content:flex-start; }
}

/* Home Big Wins — winner cards instead of a generic bets table. */
.big-wins-section { padding-top:8px; }
.big-wins-panel { overflow:hidden; border:1px solid rgba(255,255,255,.06); border-radius:18px; background:linear-gradient(145deg,rgba(35,26,44,.76),rgba(18,14,23,.9)); box-shadow:0 22px 55px rgba(5,2,10,.2),inset 0 1px rgba(255,255,255,.025); }
.big-wins-head { min-height:92px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 21px; border-bottom:1px solid rgba(255,255,255,.05); background:radial-gradient(circle at 8% 0,rgba(153,91,218,.1),transparent 35%); box-sizing:border-box; }
.big-wins-title > span { display:flex; align-items:center; gap:6px; margin-bottom:4px; color:#8b759e; font-size:8px; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.big-wins-title > span i { color:#c69a52; }
.big-wins-title h2 { margin:0; color:#f1edf3; font-size:18px; line-height:1.2; }
.big-wins-title p { margin:4px 0 0; color:#746c78; font-size:9px; }
.big-wins-live { display:flex; align-items:center; gap:9px; flex:0 0 auto; }
.big-wins-live > span { display:flex; align-items:center; gap:6px; color:#77707b; font-size:8px; font-weight:800; letter-spacing:.055em; text-transform:uppercase; }
.big-wins-live > span i { width:5px; height:5px; border-radius:50%; background:#55c18c; box-shadow:0 0 8px rgba(85,193,140,.42); }
.big-wins-carousel { position:relative; padding:12px; overflow:hidden; }
.big-wins-grid { min-height:178px; display:flex; flex-wrap:nowrap; gap:10px; overflow:hidden; }
.big-wins-grid:empty::after { content:'Waiting for the next win…'; width:100%; min-height:176px; flex:1 0 100%; display:grid; place-items:center; border:1px dashed rgba(255,255,255,.055); border-radius:12px; color:#675f6b; font-size:10px; }
.big-win-card { position:relative; width:200px; max-width:200px; min-width:170px; flex:0 0 min(200px,calc(100vw - 118px)); min-height:178px; padding:12px; overflow:hidden; border:1px solid rgba(255,255,255,.055); border-radius:13px; background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.012)); box-sizing:border-box; animation:big-win-card-in .38s ease both; transition:border-color .18s,background .18s,transform .18s; }
.big-win-card::before { content:''; position:absolute; top:-70px; right:-55px; width:145px; height:145px; border-radius:50%; background:radial-gradient(circle,rgba(111,211,158,.09),transparent 67%); pointer-events:none; }
.big-win-card:hover { border-color:rgba(157,112,205,.16); background:linear-gradient(145deg,rgba(255,255,255,.042),rgba(139,85,194,.025)); transform:translateY(-2px); }
.big-win-card-top { position:relative; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.big-win-game { min-width:0; display:flex; align-items:center; gap:7px; overflow:hidden; color:#8e8692; font-size:8px; font-weight:850; letter-spacing:.055em; text-transform:uppercase; text-overflow:ellipsis; white-space:nowrap; }
.big-win-game img { width:20px; height:20px !important; flex:0 0 20px; object-fit:contain; opacity:.72; filter:saturate(.65); }
.big-win-card-top > strong { padding:5px 7px; border:1px solid rgba(103,212,154,.13); border-radius:7px; background:rgba(66,180,126,.06); color:#6fc99b; font-size:9px; font-variant-numeric:tabular-nums; }
.big-win-user { position:relative; display:flex; align-items:center; gap:9px; margin-top:13px; }
.winner-profile { --winner-color:#94a3b8; position:relative; flex:0 0 auto; padding:2px; border-radius:50%; }
.winner-profile.status-explorer { --winner-color:#22c55e; }.winner-profile.status-regular { --winner-color:#38bdf8; }.winner-profile.status-veteran { --winner-color:#a78bfa; }.winner-profile.status-luminary { --winner-color:#f59e0b; }.winner-profile.status-legend { --winner-color:#f472b6; }
.winner-profile .avatar-field { border-radius:50%; box-shadow:0 0 0 2px var(--winner-color),0 0 12px color-mix(in srgb,var(--winner-color) 38%,transparent); }
.winner-profile.status-legend .avatar-field { box-shadow:0 0 0 2px #f472b6,0 0 0 4px rgba(167,139,250,.32),0 0 18px rgba(244,114,182,.5); }
.winner-profile.has-frame .avatar-field { box-shadow:0 0 0 2px var(--winner-color),0 0 0 5px rgba(216,135,239,.2),0 0 16px color-mix(in srgb,var(--winner-color) 48%,transparent); }
.winner-profile.has-aura:before { content:''; position:absolute; inset:-7px; border:1px solid color-mix(in srgb,var(--winner-color) 55%,transparent); border-radius:50%; box-shadow:0 0 18px color-mix(in srgb,var(--winner-color) 48%,transparent); animation:winner-aura 2.2s ease-in-out infinite; }
.winner-cosmetic { position:absolute; z-index:4; right:-5px; bottom:-3px; width:15px; height:15px; display:grid; place-items:center; border:1px solid #31283a; border-radius:50%; background:#1d1723; color:#d7b86a; font-size:6px; box-shadow:0 2px 6px rgba(0,0,0,.45); }
.winner-cosmetic + .winner-cosmetic { right:-10px; bottom:12px; }.winner-cosmetic:nth-of-type(n+3){display:none}
.winner-cosmetic.rarity-epic { color:#d987ef; }.winner-cosmetic.rarity-legendary,.winner-cosmetic.rarity-mythic { color:#f6bf56; box-shadow:0 0 9px rgba(246,191,86,.35); }
.big-wins-section .big-win-user .avatar-field .icon-small { width:34px !important; height:34px !important; min-width:34px; }
.big-win-user > div:last-child,.big-win-identity { min-width:0; display:flex; flex-direction:column; gap:2px; }
.big-win-user small { color:#625b66; font-size:7px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.big-win-user b { max-width:145px; overflow:hidden; color:#c8c1cb; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.big-win-identity em { max-width:130px; overflow:hidden; color:var(--winner-color,#8f829b); font-size:7px; font-style:normal; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.winner-verified { margin-left:2px; color:#55bde8; font-size:8px; }
.big-win-card.has-winner-nameplate .winner-name { padding:2px 5px; border:1px solid rgba(216,135,239,.24); border-radius:4px; background:linear-gradient(90deg,rgba(139,92,246,.15),rgba(236,72,153,.1)); color:#ead8ff; }
.big-win-card.has-winner-banner { border-color:rgba(245,158,11,.2); background:radial-gradient(circle at 100% 0,rgba(245,158,11,.12),transparent 42%),linear-gradient(145deg,rgba(82,52,111,.16),rgba(255,255,255,.012)); }
@keyframes winner-aura { 50% { transform:scale(1.08); opacity:.55; } }
.big-win-amount { position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-top:13px; padding:10px 0 9px; border-top:1px solid rgba(255,255,255,.045); border-bottom:1px solid rgba(255,255,255,.045); }
.big-win-amount > span { color:#68606c; font-size:7px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.big-win-amount > strong { overflow:hidden; color:#61d69a; font-size:15px; font-variant-numeric:tabular-nums; text-overflow:ellipsis; white-space:nowrap; text-shadow:0 0 18px rgba(71,202,139,.15); }
.big-win-amount i { margin-left:2px; color:#c6a557; font-size:9px; }
.big-win-meta { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:9px; }
.big-win-meta span { min-width:0; display:flex; align-items:center; justify-content:space-between; gap:4px; }
.big-win-meta span + span { padding-left:8px; border-left:1px solid rgba(255,255,255,.045); }
.big-win-meta small { color:#5f5862; font-size:7px; font-weight:750; }
.big-win-meta b { overflow:hidden; color:#928a96; font-size:8px; font-variant-numeric:tabular-nums; text-overflow:ellipsis; white-space:nowrap; }
.big-win-meta span:last-child b { color:#73b995; }
@keyframes big-win-card-in { from{opacity:0;transform:translateY(-7px) scale(.98)} to{opacity:1;transform:none} }
@media (max-width:600px) {
    .big-wins-section { padding-right:12px; padding-left:12px; }
    .big-wins-panel { border-radius:15px; }
    .big-wins-head { min-height:82px; padding:15px; }
    .big-wins-title p { display:none; }
    .big-wins-live > span { display:none; }
	.big-wins-carousel { padding:9px; }
	.big-wins-grid { gap:8px; }
    .big-win-card { min-height:168px; }
}
@media (prefers-reduced-motion:reduce) {
    .big-win-card { animation:none; transition:none; }
}

/* Shared >5x win celebration */
.site-big-win { position:fixed; inset:0; z-index:30000; display:grid; place-items:center; overflow:hidden; background:radial-gradient(circle at 50% 44%,rgba(124,45,202,.56),transparent 43%),linear-gradient(145deg,rgba(5,2,13,.95),rgba(20,6,29,.96)); opacity:0; transition:opacity .28s ease; }
.site-big-win.hidden { display:none !important; }
.site-big-win.is-visible { opacity:1; }
.site-big-win.is-closing { opacity:0; }
.site-big-win-aurora { position:absolute; inset:-35%; background:conic-gradient(from 30deg,rgba(255,60,134,.22),rgba(106,67,255,.24),rgba(31,218,196,.17),rgba(255,195,56,.24),rgba(255,60,134,.22)); filter:blur(70px); animation:site-big-win-aurora 8s linear infinite; }
.site-big-win-glow { position:absolute; width:min(100vw,860px); aspect-ratio:1; border-radius:50%; background:repeating-conic-gradient(from 0deg,rgba(255,221,113,.2) 0 5deg,transparent 5deg 12deg); filter:blur(.5px); -webkit-mask-image:radial-gradient(circle,transparent 0 22%,#000 46%,transparent 72%); mask-image:radial-gradient(circle,transparent 0 22%,#000 46%,transparent 72%); animation:site-big-win-rays 11s linear infinite; }
.site-big-win-coins { position:absolute; inset:0; pointer-events:none; }
.site-big-win-coin { position:absolute; top:-12vh; left:var(--x); color:#ffd45b; font-size:var(--size); text-shadow:0 0 9px rgba(255,194,37,.6),0 4px 6px rgba(0,0,0,.6); animation:site-big-win-coin-fall var(--fall) linear var(--delay) infinite; }
.site-big-win-sparks { position:absolute; z-index:1; left:50%; top:50%; width:10px; height:10px; pointer-events:none; }
.site-big-win-sparks i { position:absolute; width:7px; height:7px; border-radius:50%; background:#ffe587; box-shadow:0 0 13px #ffc943; opacity:0; animation:site-big-win-spark 1.7s ease-out calc(var(--i)*.045s) infinite; transform:rotate(calc(var(--i)*20deg)) translateY(-90px); }
.site-big-win-content { position:relative; z-index:2; width:min(88vw,580px); padding:60px 30px 42px; overflow:visible; text-align:center; border:1px solid rgba(255,216,100,.42); border-radius:32px; background:radial-gradient(circle at 18% 0,rgba(255,65,137,.22),transparent 40%),radial-gradient(circle at 82% 0,rgba(68,105,255,.25),transparent 42%),linear-gradient(155deg,rgba(52,27,69,.97),rgba(13,7,21,.98)); box-shadow:0 38px 110px rgba(0,0,0,.75),0 0 0 5px rgba(255,212,85,.035),0 0 90px rgba(214,82,255,.24),inset 0 1px rgba(255,255,255,.16); transform:scale(.66) translateY(35px); animation:site-big-win-pop .8s cubic-bezier(.16,.9,.26,1.2) forwards,site-big-win-card-glow 1.3s ease-in-out .8s infinite alternate; }
.site-big-win-crown { position:absolute; top:-35px; left:50%; display:grid; width:70px; height:70px; place-items:center; border:2px solid #ffe68d; border-radius:22px; background:linear-gradient(145deg,#ffb52e,#fff09b 54%,#d77a11); color:#6e3500; font-size:28px; box-shadow:0 12px 30px rgba(255,170,31,.36),inset 0 2px rgba(255,255,255,.7); transform:translateX(-50%) rotate(-4deg); animation:site-big-win-crown .9s cubic-bezier(.2,1.5,.4,1) both; }
.site-big-win-content > small { color:#ffd974; font-size:11px; font-weight:950; letter-spacing:.27em; text-shadow:0 0 14px rgba(255,201,65,.42); }
.site-big-win-content h2 { margin:9px 0 18px; color:#fff4bd; font-size:clamp(44px,10vw,86px); font-weight:950; line-height:.92; letter-spacing:-.06em; background:linear-gradient(180deg,#fffbe1 0,#ffd34f 48%,#ff8b2c 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; filter:drop-shadow(0 5px 0 #712d22) drop-shadow(0 0 20px rgba(255,184,45,.45)); }
#site_big_win_amount { color:#fff; font-size:clamp(36px,8vw,68px); font-weight:950; font-variant-numeric:tabular-nums; text-shadow:0 0 10px rgba(255,255,255,.34),0 0 30px rgba(82,232,175,.66); animation:site-big-win-amount .7s ease-in-out infinite alternate; }
.site-big-win-content > span { display:flex; justify-content:center; gap:7px; margin-top:8px; color:#a99bad; font-size:12px; font-weight:750; }
.site-big-win-content > span i { color:#f4c95d; }
#site_big_win_close { position:absolute; top:14px; right:14px; width:34px; height:34px; border:1px solid rgba(255,255,255,.1); border-radius:50%; background:rgba(255,255,255,.05); color:#a99dab; cursor:pointer; }
.site-big-win.tier-mega .site-big-win-content { border-color:rgba(106,227,255,.5);box-shadow:0 38px 110px rgba(0,0,0,.75),0 0 95px rgba(64,183,255,.3),0 0 55px rgba(221,71,255,.22),inset 0 1px rgba(255,255,255,.17); }
.site-big-win.tier-epic .site-big-win-content { border-color:rgba(255,115,177,.62);box-shadow:0 38px 110px rgba(0,0,0,.75),0 0 110px rgba(255,55,148,.35),0 0 70px rgba(121,73,255,.3),inset 0 1px rgba(255,255,255,.19); }
@keyframes site-big-win-rays { to{transform:rotate(360deg)} }
@keyframes site-big-win-aurora { to{transform:rotate(360deg) scale(1.08)} }
@keyframes site-big-win-pop { 58%{transform:scale(1.07) translateY(-5px)} 78%{transform:scale(.98) translateY(2px)} 100%{transform:scale(1) translateY(0)} }
@keyframes site-big-win-card-glow { to{filter:brightness(1.08) saturate(1.13)} }
@keyframes site-big-win-crown { 0%{opacity:0;transform:translateX(-50%) translateY(-70px) rotate(-25deg) scale(.3)} 70%{opacity:1;transform:translateX(-50%) translateY(4px) rotate(5deg) scale(1.12)} 100%{transform:translateX(-50%) rotate(-4deg) scale(1)} }
@keyframes site-big-win-amount { to{transform:scale(1.035);text-shadow:0 0 14px rgba(255,255,255,.5),0 0 42px rgba(82,232,175,.82)} }
@keyframes site-big-win-spark { 0%{opacity:0;transform:rotate(calc(var(--i)*20deg)) translateY(-70px) scale(.2)} 18%{opacity:1} 100%{opacity:0;transform:rotate(calc(var(--i)*20deg)) translateY(-320px) scale(1.2)} }
@keyframes site-big-win-coin-fall { 0%{transform:translate3d(0,-10vh,0) rotate(0);opacity:0} 8%{opacity:1} 100%{transform:translate3d(var(--drift),125vh,0) rotate(760deg);opacity:.85} }
@media (prefers-reduced-motion:reduce) {
    .site-big-win-aurora,.site-big-win-glow,.site-big-win-coin,.site-big-win-sparks i,.site-big-win-crown,#site_big_win_amount { animation:none; }
    .site-big-win-content { animation:none; transform:none; }
}

/* Unified game Live Results — compact cards inspired by Home Big Wins. */
.table-container.game-live-results {
    overflow:hidden;
    border:1px solid rgba(255,255,255,.06);
    border-radius:18px;
    background:linear-gradient(145deg,rgba(35,26,44,.76),rgba(18,14,23,.9));
    box-shadow:0 22px 55px rgba(5,2,10,.2),inset 0 1px rgba(255,255,255,.025);
}
.game-live-results > [class$="-history-title"] {
    min-height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:16px 20px;
    border-bottom:1px solid rgba(255,255,255,.05);
    background:radial-gradient(circle at 8% 0,rgba(153,91,218,.1),transparent 38%);
    box-sizing:border-box;
}
.game-live-results > [class$="-history-title"] span {
    display:flex;
    align-items:center;
    gap:7px;
    margin-bottom:4px;
    color:#8b759e;
    font-size:8px;
    font-weight:900;
    letter-spacing:.11em;
    text-transform:uppercase;
}
.game-live-results > [class$="-history-title"] span::before {
    content:'';
    width:6px;
    height:6px;
    border-radius:50%;
    background:#55c18c;
    box-shadow:0 0 9px rgba(85,193,140,.48);
}
.game-live-results > [class$="-history-title"] h2 { margin:0;color:#f1edf3;font-size:17px;line-height:1.2; }
.game-live-results > [class$="-history-title"] > i {
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid rgba(166,112,220,.14);
    border-radius:10px;
    background:rgba(139,85,194,.07);
    color:#8f72ad;
    font-size:13px;
}
.game-live-results .table-tabs { padding:9px 12px;border-bottom:1px solid rgba(255,255,255,.045);background:rgba(7,4,11,.16);gap:6px; }
.game-live-results .table-tab-btn { min-height:29px;padding:0 12px;border:1px solid transparent;border-radius:8px;font-size:9px;font-weight:850;letter-spacing:.035em;text-transform:uppercase; }
.game-live-results .table-tab-btn.active { border-color:rgba(173,117,229,.22);background:rgba(139,85,194,.16);color:#d6c0e9;box-shadow:none; }
.game-live-results .table-header { display:none; }
.game-live-results .table-body {
    min-height:166px;
    display:flex;
    flex-wrap:nowrap;
    align-items:stretch;
    gap:10px;
    padding:12px;
    overflow:hidden;
    box-sizing:border-box;
}
.game-live-results .table-body:empty::after {
    content:'Waiting for the next result…';
    width:100%;
    min-height:140px;
    display:grid;
    place-items:center;
    border:1px dashed rgba(255,255,255,.055);
    border-radius:12px;
    color:#675f6b;
    font-size:10px;
}
.game-live-results .table-body .table-row {
    position:relative;
    width:220px;
    min-width:220px;
    max-width:220px;
    min-height:142px;
    flex:0 0 220px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-content:start;
    gap:0;
    padding:11px 12px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.055);
    border-radius:13px;
    background:radial-gradient(circle at 100% 0,rgba(139,85,194,.08),transparent 44%),linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.012));
    box-sizing:border-box;
    animation:game-result-card-in .34s ease both;
    transition:border-color .18s,background .18s,transform .18s;
}
.game-live-results .table-body .table-row:hover { border-color:rgba(157,112,205,.17);background:radial-gradient(circle at 100% 0,rgba(139,85,194,.12),transparent 45%),linear-gradient(145deg,rgba(255,255,255,.042),rgba(139,85,194,.025));transform:translateY(-2px); }
.game-live-results .table-body .table-column,
.game-live-results .table-row .table-column:first-child:nth-last-child(n),
.game-live-results .table-row .table-column:first-child:nth-last-child(n) ~ .table-column {
    position:relative;
    width:auto;
    min-width:0;
    min-height:43px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:4px;
    padding:7px 8px;
    overflow:hidden;
    border-top:1px solid rgba(255,255,255,.04);
    color:#a9a0ad;
    font-size:10px;
    line-height:1.25;
    text-align:left;
    box-sizing:border-box;
}
.game-live-results .table-body .table-column::before { content:attr(data-result-label);color:#625b66;font-size:7px;font-weight:850;letter-spacing:.075em;text-transform:uppercase; }
.game-live-results .table-body .table-column:first-child { grid-column:1 / -1;min-height:48px;padding-top:2px;border-top:0; }
.game-live-results .table-body .table-column:first-child::before { display:none; }
.game-live-results .table-body .table-column:nth-child(even) { border-right:1px solid rgba(255,255,255,.04); }
.game-live-results .table-body .table-column:last-child { color:#68cf9a;font-weight:800;font-variant-numeric:tabular-nums; }
.game-live-results .table-body .table-column .flex { max-width:100%; }
.game-live-results .table-body .table-column .ellipsis { max-width:142px;color:#c8c1cb!important;font-size:10px;font-weight:700; }
.game-live-results .avatar-field .icon-small { width:30px!important;height:30px!important;min-width:30px; }
.game-live-results .table-empty-msg { width:100%;display:grid;place-items:center;color:#675f6b;font-size:10px; }
@keyframes game-result-card-in { from{opacity:0;transform:translateY(-7px) scale(.98)} to{opacity:1;transform:none} }
@media (max-width:600px) {
    .table-container.game-live-results { border-radius:15px; }
    .game-live-results > [class$="-history-title"] { min-height:70px;padding:14px 15px; }
    .game-live-results > [class$="-history-title"] h2 { font-size:14px; }
    .game-live-results .table-body { gap:8px;padding:9px; }
    .game-live-results .table-body .table-row { width:min(220px,calc(100vw - 70px));min-width:min(220px,calc(100vw - 70px));flex-basis:min(220px,calc(100vw - 70px)); }
}
@media (prefers-reduced-motion:reduce) {
    .game-live-results .table-body .table-row { animation:none;transition:none; }
}

/* Mobile application shell -------------------------------------------------
   Keeps primary navigation and game controls inside the visual viewport while
   accounting for iOS safe areas and collapsing browser chrome. */
.mobile-tab-bar,.mobile-sidebar-backdrop,.mobile-header-brand,.mobile-notification-wrap { display:none; }
@keyframes mobile-card-shimmer { to { background-position:-220% 0; } }

@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    :root {
        --mobile-header-h:56px;
        --mobile-tabs-h:64px;
        --mobile-safe-top:env(safe-area-inset-top,0px);
        --mobile-safe-right:env(safe-area-inset-right,0px);
        --mobile-safe-bottom:env(safe-area-inset-bottom,0px);
        --mobile-safe-left:env(safe-area-inset-left,0px);
    }
    html { background:#17121d; overscroll-behavior-y:none; }
    body { min-height:100svh; padding:0; background:#17121d; }
    body.mobile-menu-open { overflow:hidden; touch-action:none; }

    /* Mobile navigation is intentionally limited to the bottom tab bar. */
    .left-sidebar,
    .mobile-sidebar-backdrop,
    .sidebar-toggle-btn,
    .slider.slider-right[data-pullout="chat"],
    .pullout[data-pullout="chat"] { display:none!important; }

    .header-max {
        height:calc(var(--mobile-header-h) + var(--mobile-safe-top));
        padding-top:var(--mobile-safe-top);
        position:sticky;
        top:0;
        z-index:180;
        background:rgba(37,29,45,.9)!important;
        border-bottom-color:rgba(255,255,255,.07);
        -webkit-backdrop-filter:blur(18px) saturate(1.25);
        backdrop-filter:blur(18px) saturate(1.25);
        box-sizing:border-box;
    }
    .header-inner { height:var(--mobile-header-h);padding:6px max(10px,var(--mobile-safe-right)) 6px max(10px,var(--mobile-safe-left)); }
    .header-inner-auth { position:relative;grid-template-columns:68px minmax(0,1fr) 96px; }
    .header-inner-auth .header-balance-widget {
        position:absolute;z-index:2;left:43.5%;top:50%;width:max-content;max-width:calc(100% - 212px);min-width:0;
        transform:translate(-50%,-50%);
    }
    .header-inner-auth .header-balance-field { min-width:0;flex:1;padding:8px 10px;overflow:hidden; }
    .header-inner-auth .header-balance-field .balance { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
    .header-inner-auth .btn-wallet { width:44px;padding:0;justify-content:center; }
    .header-inner-auth .btn-wallet span { display:none; }
    .header-inner-auth .header-account-btns { display:none!important; }
    .mobile-header-brand { grid-column:1;width:66px;height:44px;display:flex;align-items:center;justify-content:flex-start;overflow:visible;text-decoration:none; }
    .mobile-header-brand img { width:64px!important;max-width:64px!important;height:38px!important;object-fit:contain;object-position:left center;filter:none!important; }
    .mobile-notification-wrap { grid-column:3;display:flex;align-items:center;gap:6px;justify-self:end;position:relative; }
	.mobile-global-sound-button { width:44px;height:44px;flex-basis:44px;border-radius:14px; }
    .mobile-notification-button { width:44px;height:44px;padding:0;display:grid;place-items:center;position:relative;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.04);color:#d8d0dc;font-size:16px;cursor:pointer; }
    .mobile-notification-button[aria-expanded="true"] { border-color:rgba(181,103,235,.3);background:rgba(151,73,208,.15);color:#fff; }
    .mobile-notification-button > span { position:absolute;right:-3px;top:-3px;min-width:17px;height:17px;padding:0 4px;display:grid;place-items:center;border:2px solid #28202f;border-radius:9px;background:#a854df;color:#fff;font-size:7px;font-weight:900;box-sizing:border-box; }
    .mobile-notification-center {
        position:fixed;z-index:500;top:calc(var(--mobile-safe-top) + var(--mobile-header-h) + 7px);right:max(8px,var(--mobile-safe-right));left:max(8px,var(--mobile-safe-left));
        max-height:min(68dvh,520px);display:flex;flex-direction:column;overflow:hidden;
        border:1px solid rgba(255,255,255,.1);border-radius:20px;background:rgba(36,28,43,.97);box-shadow:0 24px 70px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.05);
        -webkit-backdrop-filter:blur(24px) saturate(1.25);backdrop-filter:blur(24px) saturate(1.25);
        opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-9px) scale(.98);transform-origin:top right;transition:opacity .2s,transform .25s,visibility .2s;
    }
    .mobile-notification-center.is-open { opacity:1;visibility:visible;pointer-events:auto;transform:none; }
    .mobile-notification-center > header { min-height:64px;padding:10px 11px 10px 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06); }
    .mobile-notification-center > header span,.mobile-notification-center > header strong { display:block; }
    .mobile-notification-center > header span { margin-bottom:3px;color:#9a6dbb;font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase; }
    .mobile-notification-center > header strong { color:#f3eef5;font-size:15px; }
    .mobile-notification-center > header button { width:36px;height:36px;padding:0;display:grid;place-items:center;border:1px solid rgba(255,255,255,.06);border-radius:12px;background:rgba(255,255,255,.035);color:#8d838f; }
    .mobile-notification-list { min-height:0;padding:8px;overflow-y:auto;overscroll-behavior:contain; }
    .mobile-notification-list article { min-height:70px;padding:10px;display:flex;align-items:flex-start;gap:10px;border-bottom:1px solid rgba(255,255,255,.045); }
    .mobile-notification-list article:last-child { border-bottom:0; }
    .mobile-notification-icon { width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border:1px solid rgba(186,112,238,.2);border-radius:13px;background:rgba(155,76,211,.13);color:#ca8df2;font-size:14px; }
    .mobile-notification-list article > div { min-width:0;flex:1; }
    .mobile-notification-list article strong { display:block;color:#ded7e1;font-size:11px; }
    .mobile-notification-list article p { margin:3px 0;color:#8c838f;font-size:9px;line-height:1.4; }
    .mobile-notification-list article small { display:inline-flex;margin-top:3px;padding:3px 6px;border-radius:7px;background:rgba(233,186,78,.1);color:#d9b85f;font-size:7px;font-weight:750; }
    .mobile-notification-empty { min-height:180px;padding:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center; }
    .mobile-notification-empty > i { width:48px;height:48px;margin-bottom:10px;display:grid;place-items:center;border-radius:16px;background:rgba(68,189,126,.1);color:#69cb98;font-size:20px; }
    .mobile-notification-empty strong { color:#dcd5df;font-size:12px; }.mobile-notification-empty span{max-width:230px;margin-top:5px;color:#817783;font-size:9px;line-height:1.45}
    .mobile-notification-all { min-height:48px;margin:0 8px 8px;padding:0 12px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(169,94,220,.16);border-radius:13px;background:rgba(143,65,197,.09);color:#bd82e4!important;font-size:9px;font-weight:800;text-decoration:none!important; }
    .header-inner:not(.header-inner-auth) { justify-content:center; }
    .header-inner:not(.header-inner-auth) > .online { display:none!important; }
    .header-inner:not(.header-inner-auth) .header-auth-btns { width:min(100%,308px);margin:0 auto;justify-content:center; }
    .header-inner:not(.header-inner-auth) .header-auth-btns .btn-login,
    .header-inner:not(.header-inner-auth) .header-auth-btns .btn-signup { width:auto;min-width:0;max-width:150px;height:44px;flex:1 1 0; }
    .header-inner .online { min-width:0; }
    .header-inner .online p { white-space:nowrap; }
    .header-auth-btns { margin-left:auto; }

    .wrapper-page { min-height:calc(100svh - var(--mobile-header-h) - var(--mobile-safe-top));padding-bottom:calc(var(--mobile-tabs-h) + var(--mobile-safe-bottom) + 12px);box-sizing:border-box; }
    .main-panel { width:100%!important;max-width:100%!important;margin:0!important;min-height:0!important; }
    #page_content { min-height:0!important; }
    #page_content2 { padding:10px max(10px,var(--mobile-safe-right)) 0 max(10px,var(--mobile-safe-left));box-sizing:border-box; }

    .mobile-tab-bar {
        position:fixed;
        z-index:300;
        left:max(8px,var(--mobile-safe-left));
        right:max(8px,var(--mobile-safe-right));
        bottom:max(7px,var(--mobile-safe-bottom));
        height:var(--mobile-tabs-h);
        padding:5px 7px;
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        align-items:center;
        border:1px solid rgba(255,255,255,.1);
        border-radius:20px;
        background:rgba(41,31,49,.91);
        box-shadow:0 14px 40px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.05);
        -webkit-backdrop-filter:blur(22px) saturate(1.35);
        backdrop-filter:blur(22px) saturate(1.35);
        box-sizing:border-box;
    }
    .mobile-tab-bar a,.mobile-tab-bar button {
        min-width:0;
        height:52px;
        padding:3px 2px;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:3px;
        border:0;
        border-radius:15px;
        background:transparent;
        color:#948b99!important;
        font:700 9px/1 var(--site-font,Arial,sans-serif);
        text-decoration:none!important;
        cursor:pointer;
        -webkit-tap-highlight-color:transparent;
    }
    .mobile-tab-bar i { font-size:17px; }
    .mobile-tab-bar .mobile-tab-icon { width:18px;height:18px;display:block;object-fit:contain;filter:brightness(0) invert(1); }
    .mobile-tab-bar .active { color:#fff!important;background:rgba(178,103,242,.13); }
    .mobile-tab-bar .mobile-play-menu { width:100%;color:#fff!important;transform:translateY(-9px);background:linear-gradient(145deg,#a958eb,#7431bb);box-shadow:0 9px 22px rgba(130,54,194,.4); }
    .mobile-tab-bar a:active,.mobile-tab-bar button:active { transform:scale(.94); }
    .mobile-tab-bar .mobile-play-menu:active { transform:translateY(-9px) scale(.94); }

    .mobile-sidebar-backdrop { position:fixed;inset:0;z-index:240;border:0;background:rgba(7,5,10,.64);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .22s; }
    body.mobile-menu-open .mobile-sidebar-backdrop { opacity:0;pointer-events:none; }
    .left-sidebar {
        top:auto!important;left:max(8px,var(--mobile-safe-left))!important;right:max(8px,var(--mobile-safe-right))!important;bottom:calc(var(--mobile-tabs-h) + var(--mobile-safe-bottom) + 12px)!important;
        width:auto!important;min-width:0!important;height:min(72svh,620px)!important;
        padding:14px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:22px!important;
        background:linear-gradient(160deg,rgba(48,37,57,.98),rgba(25,19,31,.98))!important;
        box-shadow:0 24px 70px rgba(0,0,0,.6)!important;
        transform:translateY(calc(100% + 100px));transition:transform .28s cubic-bezier(.2,.8,.2,1)!important;z-index:260!important;
    }
    .left-sidebar.mobile-open { left:max(8px,var(--mobile-safe-left))!important;transform:translateY(0); }
    .left-sidebar .sidebar-logo { display:none; }
    .left-sidebar .sidebar-games { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0;background:transparent;overflow-y:auto; }
    .left-sidebar .sidebar-game-group { display:contents; }
    .left-sidebar .sidebar-group-toggle { display:none; }
    .left-sidebar .sidebar-group-grid { display:contents; }
    .left-sidebar .sidebar-cell { min-height:54px;padding:8px 10px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.035);border-radius:13px;white-space:normal; }
    .left-sidebar .sidebar-cell.active { border-color:rgba(181,110,255,.42);background:rgba(181,110,255,.14); }
    .left-sidebar .sidebar-menu { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding-top:10px;margin-top:10px;border-top:1px solid rgba(255,255,255,.07); }
    .left-sidebar .sidebar-menu-link { min-height:48px;padding:5px;flex-direction:column;justify-content:center;gap:3px;font-size:9px;text-align:center; }
    body .footer {
        margin:18px 10px 0!important;
        overflow:hidden;
        border:1px solid rgba(255,255,255,.075)!important;
        border-radius:24px 24px 0 0;
        background:radial-gradient(circle at 50% 0,rgba(151,82,211,.13),transparent 30%),linear-gradient(180deg,#241c2b,#17121c)!important;
        box-shadow:0 -14px 42px rgba(4,2,8,.18)!important;
    }
    .site-footer-shell { padding:24px 14px calc(var(--mobile-tabs-h) + var(--mobile-safe-bottom) + 22px); }
    .site-footer-main { display:block; }
    .site-footer-brand { align-items:center;text-align:center;gap:7px;padding:2px 8px 20px; }
    .site-footer-logo { width:148px;height:47px;margin:0;justify-content:center; }
    .site-footer-logo img { width:148px;max-height:47px;object-position:center; }
    .site-footer-brand > p { width:100%;max-width:310px;margin-right:auto;margin-left:auto;align-self:center;color:#8d8491;font-size:11px;line-height:1.55;text-align:center; }
    .site-footer-live { width:100%;margin-top:7px;justify-content:center;gap:7px; }
    .site-footer-live > span { min-width:0;min-height:34px;padding:0 11px;justify-content:center;border-radius:11px;background:rgba(255,255,255,.03);font-size:8px;text-align:center; }
    .site-footer-live > span > span { min-width:0;overflow-wrap:anywhere; }

    .site-footer-nav { display:flex;flex-direction:column;gap:7px; }
    .site-footer-column,
    .site-footer-column:last-child { display:block!important;border:1px solid rgba(255,255,255,.065);border-radius:14px;background:rgba(255,255,255,.025);overflow:hidden; }
    .site-footer-column summary {
        min-height:50px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;
        cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;
    }
    .site-footer-column summary > strong { color:#d2cbd6;font-size:11px;letter-spacing:.055em; }
    .site-footer-column summary > i { width:26px;height:26px;display:grid;place-items:center;border-radius:9px;background:rgba(255,255,255,.04);color:#877c8d;font-size:9px;transition:transform .24s ease,background .24s,color .24s; }
    .site-footer-column[open] summary > i { transform:rotate(180deg);background:rgba(166,94,222,.12);color:#c88ff1; }
    .site-footer-links { margin:0;padding:0 8px 9px;gap:3px;animation:mobile-footer-links-in .24s ease both; }
    .site-footer-column:last-child .site-footer-links { display:flex;grid-template-columns:none; }
    .site-footer-column a { width:100%;min-height:42px;padding:0 10px;display:flex;align-items:center;border-radius:10px;color:#aaa1af!important;font-size:11px;box-sizing:border-box; }
    .site-footer-column a:active { background:rgba(255,255,255,.045);color:#fff!important;transform:scale(.985); }

    .site-footer-utility { margin-top:16px;padding:16px 0 14px;gap:15px;border-color:rgba(255,255,255,.055); }
    .site-footer-trust { width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px; }
    .site-footer-trust > span { min-width:0;min-height:65px;padding:8px 5px;display:flex;flex-direction:column;justify-content:center;gap:7px;border:1px solid rgba(255,255,255,.055);border-radius:13px;background:rgba(255,255,255,.02);color:#918794;font-size:8px;line-height:1.25;text-align:center;box-sizing:border-box; }
    .site-footer-trust > span > span { min-width:0;max-width:100%;overflow-wrap:anywhere; }
    .site-footer-trust i { font-size:15px;color:#a978ce; }
    .site-footer-assets { width:100%;justify-content:center;gap:6px; }
    .site-footer-assets span { width:38px;height:38px;padding:0;justify-content:center;border-radius:12px;background:rgba(255,255,255,.025); }
    .site-footer-assets img { width:22px;height:22px;opacity:.72; }
    .site-footer-assets b { display:none; }

    .site-footer-bottom { padding-top:15px;display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center; }
    .site-footer-bottom p { color:#6d6570;font-size:8px;line-height:1.5; }
    .site-footer-license { max-width:290px;text-align:center; }
    .site-footer-bottom > div { order:-1;width:100%;justify-content:center;gap:8px;margin-bottom:3px; }
    .site-footer-bottom a { min-height:38px;padding:0 13px;display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(255,255,255,.02);color:#948a98!important;font-size:9px; }

    /* In-app notification cards: visible above the app content, never over the
       bottom navigation or primary game actions. */
    #toast-container.toast-top-right {
        top:calc(var(--mobile-safe-top) + var(--mobile-header-h) + 8px)!important;
        right:max(10px,var(--mobile-safe-right))!important;
        bottom:auto!important;
        left:max(10px,var(--mobile-safe-left))!important;
        width:auto!important;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:8px;
        pointer-events:none;
        z-index:10000;
    }
    #toast-container > div.app-toast {
        position:relative;
        width:100%!important;
        min-width:0!important;
        max-width:520px!important;
        min-height:54px;
        margin:0 auto!important;
        padding:12px 46px 12px 48px!important;
        overflow:hidden;
        border:1px solid rgba(255,255,255,.11)!important;
        border-left:1px solid rgba(255,255,255,.11)!important;
        border-radius:16px!important;
        background:rgba(35,28,42,.94)!important;
        color:#f7f4f9!important;
        box-shadow:0 12px 34px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.05)!important;
        -webkit-backdrop-filter:blur(20px) saturate(1.3);
        backdrop-filter:blur(20px) saturate(1.3);
        box-sizing:border-box;
        pointer-events:auto;
        touch-action:pan-y;
        animation:mobile-toast-in .38s cubic-bezier(.2,.85,.25,1) both;
        transition:transform .18s ease,opacity .18s ease;
    }
    #toast-container > div.app-toast::before {
        position:absolute;left:13px;top:50%;width:25px;height:25px;display:grid;place-items:center;
        border-radius:9px;transform:translateY(-50%);font:700 13px/1 FontAwesome;
    }
    #toast-container > .app-toast.toast-success::before { content:"\f00c";background:rgba(27,197,112,.16);color:#5ae2a1; }
    #toast-container > .app-toast.toast-info::before { content:"\f129";background:rgba(125,151,255,.15);color:#a9baff; }
    #toast-container > .app-toast.toast-warning::before { content:"\f071";background:rgba(255,176,62,.15);color:#ffc56e; }
    #toast-container > .app-toast.toast-error::before { content:"\f00d";background:rgba(255,89,109,.15);color:#ff8997; }
    #toast-container > div.app-toast .toast-message { white-space:normal;overflow:visible;color:#eee9f1!important;font-size:13px!important;font-weight:650;line-height:1.35; }
    #toast-container > div.app-toast .toast-close-button {
        position:absolute;right:8px;top:50%;width:34px;height:34px;margin:0;padding:0;
        display:grid;place-items:center;transform:translateY(-50%);border:0;border-radius:11px;
        color:#9c929f!important;font-size:21px;font-weight:400;line-height:1;background:rgba(255,255,255,.04);opacity:1;
    }
    #toast-container > div.app-toast .toast-progress { left:12px;right:12px;bottom:0;width:auto!important;height:2px;border-radius:2px;background:currentColor;opacity:.38; }
    #toast-container > .app-toast.toast-success { color:#5ae2a1!important; }
    #toast-container > .app-toast.toast-info { color:#a9baff!important; }
    #toast-container > .app-toast.toast-warning { color:#ffc56e!important; }
    #toast-container > .app-toast.toast-error { color:#ff8997!important; }
    #toast-container > div.app-toast.is-dragging { transition:none; }
    #toast-container > div.app-toast.is-dismissing { opacity:0;transform:translateX(110%); }
}

@keyframes mobile-toast-in {
    from { opacity:0;transform:translateY(-14px) scale(.97); }
    to { opacity:1;transform:translateY(0) scale(1); }
}
@keyframes mobile-footer-links-in {
    from { opacity:0;transform:translateY(-5px); }
    to { opacity:1;transform:translateY(0); }
}

/* A game is an app scene on phones: no document scrolling, no secondary feed.
   Every game's first two layout panels are compacted into the available height. */
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    body.is-game-page { height:100svh;height:100dvh;overflow:hidden; }
    body.is-game-page > .flex.column { height:100%;min-height:0; }
    body.is-game-page .wrapper-page { height:calc(100dvh - var(--mobile-header-h) - var(--mobile-safe-top));min-height:0;padding-bottom:calc(var(--mobile-tabs-h) + var(--mobile-safe-bottom) + 8px);overflow:hidden; }
    body.is-game-page .main-panel,body.is-game-page #page_loader,body.is-game-page #page_content,body.is-game-page #page_content2 { height:100%;min-height:0!important;overflow:hidden!important; }
    body.is-game-page #page_content2 { padding-top:6px; }
    body.is-game-page .footer,body.is-game-page .game-back-nav { display:none!important; }
    body.is-game-page #page_content2 > div:first-of-type { height:100%;min-height:0;max-width:none!important;margin:0!important;padding:0!important;overflow:hidden;display:flex;flex-direction:column; }
    body.is-game-page [class$="-page-top"] { display:none!important; }
    body.is-game-page [class$="-game-layout"] { flex:1;min-height:0!important;height:100%!important;margin:0!important;gap:7px!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:minmax(170px,42%) minmax(0,58%)!important;overflow:hidden!important; }
    body.is-game-page [class$="-game-layout"] > * { min-width:0!important;min-height:0!important;width:100%!important;height:100%!important;margin:0!important;overflow:hidden!important;border-radius:15px!important;box-sizing:border-box!important; }
    body.is-game-page [class$="-game-layout"] > *:first-child { padding:9px!important;overflow-y:auto!important;overscroll-behavior:contain;scrollbar-width:none; }
    body.is-game-page [class$="-game-layout"] > *:first-child::-webkit-scrollbar { display:none; }
    body.is-game-page [class$="-control-head"],body.is-game-page [class$="-risk-note"],body.is-game-page [class$="-board-head"] { display:none!important; }
    body.is-game-page [class$="-segment"] { margin:0 0 6px!important;padding:0!important; }
    body.is-game-page [class$="-label"] { margin-bottom:3px!important;font-size:9px!important;line-height:1.1!important; }
    body.is-game-page [class*="btn-place"],body.is-game-page [class*="btn-cashout"],body.is-game-page [class*="btn-next"] { min-height:42px!important;height:42px!important;margin-top:5px!important; }
    body.is-game-page [class$="-header"] { min-height:36px!important;height:36px!important;padding:5px 9px!important; }
    body.is-game-page .table-container,body.is-game-page [class*="history"],body.is-game-page [class*="bets-wrap"],body.is-game-page [class*="live-results"] { display:none!important; }
}

/* JS keeps this value tied to VisualViewport, which is the actually visible
   area after Samsung Internet/Chrome toolbars and the on-screen keyboard have
   been accounted for. The dvh declarations above remain the no-JS fallback. */
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    body.is-game-page { height:var(--app-viewport-height,100dvh); }
    body.is-game-page .wrapper-page {
        height:calc(var(--app-viewport-height,100dvh) - var(--mobile-header-h) - var(--mobile-safe-top));
    }
}

/* OS-specific corrections stay deliberately small. Geometry belongs to the
   shared phone/tablet profiles; these rules only address browser behaviour. */
html.platform-ios,
html.platform-ios body { min-height:-webkit-fill-available; }
html.platform-ios body { -webkit-overflow-scrolling:touch; }
html.platform-ios .mobile-tab-bar,
html.platform-ios .mobile-notification-center {
    will-change:transform;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
}
html.platform-ios input[type="text"],
html.platform-ios input[type="email"],
html.platform-ios input[type="password"],
html.platform-ios input[type="number"],
html.platform-ios input[type="tel"],
html.platform-ios textarea,
html.platform-ios select { font-size:max(16px,1em); }

html.platform-android.device-touch { overscroll-behavior:none; }
html.platform-android.device-touch button,
html.platform-android.device-touch a,
html.platform-android.device-touch [role="button"] { touch-action:manipulation; }

html.display-standalone {
    --mobile-safe-top:max(env(safe-area-inset-top,0px),0px);
    --mobile-safe-bottom:max(env(safe-area-inset-bottom,0px),0px);
}

@media (max-width:390px), (max-height:700px) {
    .mobile-tab-bar { --mobile-tabs-h:58px;height:58px;border-radius:17px; }
    .mobile-tab-bar a,.mobile-tab-bar button { height:47px; }
    body.is-game-page [class$="-game-layout"] { grid-template-rows:minmax(145px,39%) minmax(0,61%)!important;gap:5px!important; }
    body.is-game-page [class$="-game-layout"] > *:first-child { padding:7px!important; }
}

@media (orientation:landscape) and (max-height:600px) {
    body.is-game-page [class$="-game-layout"] { grid-template-columns:minmax(210px,36%) minmax(0,64%)!important;grid-template-rows:1fr!important; }
    .header-max { display:none!important; }
    body.is-game-page .wrapper-page { height:var(--app-viewport-height,100dvh); }
}

@media (prefers-reduced-motion:reduce) {
    #toast-container > div.app-toast { animation:none!important;transition:none!important; }
    .site-footer-links,.site-footer-column summary > i { animation:none!important;transition:none!important; }
}

/* Mobile profile app ------------------------------------------------------ */
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    .page-profile #page_content2 { padding-right:8px;padding-left:8px; }
    .vault-item-icon { width:40px;height:40px; }
    .week-report { width:100%;grid-template-columns:auto minmax(0,1fr);gap:5px 10px;padding:10px;border:1px solid rgba(255,255,255,.05);border-radius:12px;background:rgba(255,255,255,.02); }
    .week-report strong { font-size:16px;text-align:right; }
    .week-report span { align-self:center;font-size:8px; }
    .journey-columns,.shop-grid,.clubs-grid,.onboarding-steps { grid-template-columns:1fr!important; }
    .shop-item { grid-template-columns:36px minmax(0,1fr) auto; }
}

@keyframes profile-mobile-tab-in {
    from { opacity:0;transform:translateY(5px); }
    to { opacity:1;transform:none; }
}

/* Inclusive leaderboards -------------------------------------------------- */
.inclusive-leaderboards { width:min(100%,1180px);margin:0 auto;padding:18px;box-sizing:border-box; }
.inclusive-leaderboards .leaderboard-intro { min-height:130px;margin:0 0 14px;padding:24px;display:flex;align-items:center;gap:16px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.07);border-radius:20px;background:radial-gradient(circle at 82% 10%,rgba(161,84,220,.22),transparent 34%),linear-gradient(135deg,#261c2d,#17121d);box-sizing:border-box; }
.leaderboard-intro-icon { width:52px;height:52px;flex:0 0 52px;display:grid;place-items:center;border:1px solid rgba(236,190,83,.22);border-radius:16px;background:rgba(226,173,51,.1);color:#e8bd5d;font-size:21px;box-shadow:0 10px 26px rgba(0,0,0,.2); }
.inclusive-leaderboards .leaderboard-intro > div:nth-child(2) { min-width:0;flex:1; }
.inclusive-leaderboards .leaderboard-intro h1 { margin:4px 0 6px;color:#fff;font-family:var(--site-font-display);font-size:28px;line-height:1.1; }
.inclusive-leaderboards .leaderboard-intro p { max-width:650px;margin:0;color:#958b9b;font-size:12px;line-height:1.55; }
.leaderboard-live { min-height:31px;padding:0 10px;display:flex;align-items:center;gap:6px;border:1px solid rgba(86,203,143,.14);border-radius:10px;background:rgba(42,154,99,.07);color:#78b996;font-size:8px;font-weight:850;letter-spacing:.06em;text-transform:uppercase; }
.leaderboard-live i { width:6px;height:6px;border-radius:50%;background:#55cf8f;box-shadow:0 0 9px rgba(85,207,143,.5);animation:leaderboard-live-pulse 1.8s ease-in-out infinite; }

.inclusive-leaderboards .leaderboard-tabs { margin:0 0 12px;padding:6px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;overflow:visible;border:1px solid rgba(255,255,255,.06);border-radius:15px;background:rgba(255,255,255,.022); }
.inclusive-leaderboards .leaderboard-tabs button { min-height:45px;padding:0 12px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid transparent;border-radius:11px;background:transparent;color:#8e8493;font-size:11px;font-weight:750;transition:.2s; }
.inclusive-leaderboards .leaderboard-tabs button i { color:#806d8c; }
.inclusive-leaderboards .leaderboard-tabs button.active { border-color:rgba(178,105,232,.28);background:linear-gradient(145deg,rgba(154,75,213,.22),rgba(101,44,148,.12));color:#fff;box-shadow:inset 0 1px rgba(255,255,255,.04); }
.inclusive-leaderboards .leaderboard-tabs button.active i { color:#c889f2; }
.leaderboard-panel:not([hidden]) { display:block;animation:leaderboard-panel-in .3s ease both; }
.leaderboard-podium { display:none; }
.leaderboard-list { overflow:hidden;border:1px solid rgba(255,255,255,.065);border-radius:17px;background:rgba(255,255,255,.022); }
.leaderboard-list-head,.leaderboard-row { display:grid;grid-template-columns:74px minmax(0,1fr) 160px;align-items:center;gap:10px; }
.leaderboard-list-head { min-height:42px;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.05);color:#716976;font-size:8px;font-weight:850;letter-spacing:.08em;text-transform:uppercase; }
.leaderboard-list-head span:last-child { text-align:right; }
.leaderboard-row { min-height:64px;padding:7px 16px;border-bottom:1px solid rgba(255,255,255,.045);transition:background .18s; }
.leaderboard-row:last-child { border-bottom:0; }
.leaderboard-row:hover { background:rgba(255,255,255,.025); }
.leaderboard-rank span { width:31px;height:31px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.04);color:#938a97;font-size:11px;font-weight:850; }
.leaderboard-rank[data-rank="1"] span { background:rgba(232,189,93,.13);color:#e8bd5d; }
.leaderboard-rank[data-rank="2"] span { background:rgba(190,198,215,.1);color:#c5cbd7; }
.leaderboard-rank[data-rank="3"] span { background:rgba(201,132,78,.12);color:#d49361; }
.leaderboard-user { min-width:0;display:flex;align-items:center;gap:10px; }
.leaderboard-user img { width:38px;height:38px;flex:0 0 38px;border:2px solid rgba(255,255,255,.08);border-radius:13px;object-fit:cover; }
.leaderboard-user div { min-width:0; }
.leaderboard-user strong,.leaderboard-user small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.leaderboard-user strong { color:#d9d2dd;font-size:12px; }
.leaderboard-user small { margin-top:3px;color:#69616d;font-size:8px; }
.leaderboard-value { text-align:right; }
.leaderboard-value strong,.leaderboard-value span { display:block; }
.leaderboard-value strong { color:#fff;font-size:14px;font-variant-numeric:tabular-nums; }
.leaderboard-value span { margin-top:2px;color:#706875;font-size:8px;text-transform:uppercase; }
.leaderboard-row.is-current-user { background:linear-gradient(90deg,rgba(135,66,190,.14),rgba(135,66,190,.035));box-shadow:inset 3px 0 #a65dde; }
.leaderboard-row.is-current-user .leaderboard-user small { color:#bf82eb; }
.leaderboard-empty { min-height:260px;padding:30px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(255,255,255,.06);border-radius:18px;background:rgba(255,255,255,.02);text-align:center; }
.leaderboard-empty i { width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:rgba(154,84,211,.12);color:#b97be8;font-size:18px; }
.leaderboard-empty strong { color:#ddd5e1;font-size:14px; }.leaderboard-empty span{color:#746b79;font-size:10px}

@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    .page-leaderboard #page_content2 { padding-right:8px;padding-left:8px; }
    .inclusive-leaderboards { padding:0 0 8px; }
    .inclusive-leaderboards .leaderboard-intro { min-height:156px;padding:20px 16px;align-items:flex-start;gap:12px;border-radius:22px; }
    .leaderboard-intro-icon { width:44px;height:44px;flex-basis:44px;border-radius:14px;font-size:18px; }
    .inclusive-leaderboards .leaderboard-intro h1 { font-size:23px; }
    .inclusive-leaderboards .leaderboard-intro p { font-size:10px;line-height:1.5; }
    .leaderboard-live { position:absolute;right:14px;bottom:14px; }

    .inclusive-leaderboards .leaderboard-tabs {
        position:sticky;z-index:80;top:calc(var(--mobile-header-h) + var(--mobile-safe-top));
        margin:8px -8px 12px;padding:8px max(8px,var(--mobile-safe-right));display:flex;gap:7px;
        overflow-x:auto;border:0;border-radius:0;background:rgba(23,18,29,.92);box-shadow:0 8px 20px rgba(5,2,8,.14);
        -webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);scroll-snap-type:x proximity;scrollbar-width:none;
    }
    .inclusive-leaderboards .leaderboard-tabs::-webkit-scrollbar { display:none; }
    .inclusive-leaderboards .leaderboard-tabs button { min-width:max-content;min-height:42px;padding:0 14px;flex:0 0 auto;border-color:rgba(255,255,255,.06);background:rgba(255,255,255,.025);scroll-snap-align:center; }

    .leaderboard-podium { min-height:190px;margin-bottom:10px;padding:14px 7px 9px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:6px;overflow:hidden;border:1px solid rgba(255,255,255,.065);border-radius:20px;background:radial-gradient(circle at 50% 15%,rgba(226,174,55,.12),transparent 35%),linear-gradient(145deg,rgba(42,31,48,.88),rgba(23,18,29,.94)); }
    .podium-player { min-width:0;padding:10px 3px 9px;display:flex;flex-direction:column;align-items:center;position:relative;border:1px solid rgba(255,255,255,.055);border-radius:14px 14px 9px 9px;background:rgba(255,255,255,.025);text-align:center; }
    .podium-rank-1 { min-height:148px;order:2;border-color:rgba(231,188,83,.2);background:linear-gradient(180deg,rgba(231,188,83,.1),rgba(255,255,255,.025)); }
    .podium-rank-2 { min-height:126px;order:1; }.podium-rank-3{min-height:112px;order:3}
    .podium-medal { position:absolute;top:-9px;left:50%;min-width:28px;height:24px;padding:0 5px;display:flex;align-items:center;justify-content:center;gap:3px;border-radius:9px;background:#34283c;color:#9e93a4;font-size:8px;transform:translateX(-50%);box-shadow:0 5px 12px rgba(0,0,0,.25); }
    .podium-rank-1 .podium-medal { background:linear-gradient(145deg,#f1d582,#c99532);color:#2c210c; }
    .podium-avatar { width:46px;height:46px;margin:10px 0 7px;padding:2px;border-radius:15px;background:rgba(255,255,255,.09); }
    .podium-rank-1 .podium-avatar { width:57px;height:57px;background:linear-gradient(145deg,#f1d582,#aa7424); }
    .podium-avatar img { width:100%;height:100%;display:block;border-radius:13px;object-fit:cover; }
    .podium-player > strong { max-width:100%;overflow:hidden;color:#ded7e2;font-size:9px;text-overflow:ellipsis;white-space:nowrap; }
    .podium-player > small { margin-top:4px;color:#897e8e;font-size:7px;white-space:nowrap; }

    .leaderboard-list { border-radius:18px;background:transparent;border:0; }
    .leaderboard-list-head { display:none; }
    .leaderboard-row { min-height:66px;margin-bottom:7px;padding:8px 10px;grid-template-columns:38px minmax(0,1fr) auto;gap:8px;border:1px solid rgba(255,255,255,.06)!important;border-radius:15px;background:rgba(255,255,255,.026); }
    .leaderboard-row.is-podium-row { display:none; }
    .leaderboard-rank span { width:32px;height:32px;border-radius:11px; }
    .leaderboard-user { gap:8px; }
    .leaderboard-user img { width:39px;height:39px;flex-basis:39px;border-radius:13px; }
    .leaderboard-user strong { font-size:11px; }.leaderboard-user small{font-size:7px}
    .leaderboard-value strong { font-size:13px; }.leaderboard-value span{font-size:7px}
    .leaderboard-empty { min-height:220px; }
}

@keyframes leaderboard-panel-in { from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none} }
@keyframes leaderboard-live-pulse { 50%{opacity:.35;transform:scale(.82)} }
@media (prefers-reduced-motion:reduce) { .leaderboard-panel:not([hidden]),.leaderboard-live i { animation:none!important; } }

/* Shared mobile game flow ------------------------------------------------ */
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    /* The shared template navigation is used by every game, including games
       that do not use the standard two-column betting layout. */
    body.is-game-page #page_content2 {
        display:flex!important;flex-direction:column!important;
    }
    body.is-game-page .game-back-nav {
        display:none!important;
    }
    body.is-game-page #page_content2 > div:first-of-type {
        height:auto!important;min-height:0!important;flex:1 1 auto!important;
    }

    /* Verification remains available on desktop but does not consume the
       limited game viewport on phones. */
    body.is-game-page .game-fair-details,
    body.is-game-page .game-info { display:none!important; }

    /* Put the primary betting action at the top of every standard control
       panel. Dynamic cash-out/action buttons occupy the same position when
       the place-bet button is temporarily hidden by game state. */
    body.is-game-page [class$="-game-layout"] > *:first-child {
        display:flex!important;flex-direction:column!important;
    }
    body.is-game-page [class$="-game-layout"] > *:first-child [class*="btn-place"] {
        order:-100!important;width:100%!important;min-height:56px!important;flex:0 0 56px!important;
        border-radius:15px!important;font-size:15px!important;font-weight:850!important;
        box-shadow:0 10px 24px rgba(99,42,181,.24),inset 0 1px rgba(255,255,255,.14)!important;
    }
    body.is-game-page [class$="-game-layout"] > *:first-child [class*="btn-cashout"],
    body.is-game-page [class$="-game-layout"] > *:first-child [class*="btn-next"],
    body.is-game-page .bj-actions { order:-99!important; }
}

@media (max-width:350px) {
    .header-inner-auth .header-balance-field > img { display:none; }
    .header-inner-auth .header-balance-field { padding-right:7px;padding-left:7px; }
}
.audience-profile-card{margin-top:18px;padding:22px}.audience-profile-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.audience-profile-head span{color:var(--site-color-main);font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.audience-profile-head h3{margin:3px 0}.audience-profile-head p{max-width:720px;margin:0;color:#8f9bad;font-size:11px;line-height:1.5}.audience-profile-head>i{color:var(--site-color-main);font-size:28px}.audience-profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:18px}.audience-profile-grid label{color:#8f9bad;font-size:10px}.audience-profile-grid select{display:block;width:100%;height:36px;margin-top:5px;padding:0 9px;border:1px solid rgba(255,255,255,.1);border-radius:6px;background:#171923;color:#fff}.audience-consent{display:flex;align-items:flex-start;gap:7px;margin:14px 0;color:#8f9bad;font-size:10px}.audience-profile-form>button,.audience-delete-form button{padding:9px 13px;border:0;border-radius:6px;background:var(--site-color-main);color:#fff;font-weight:600;cursor:pointer}.audience-delete-form{margin-top:8px}.audience-delete-form button{background:transparent;color:#ef6b68;border:1px solid rgba(239,107,104,.25)}@media(max-width:900px){.audience-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.audience-profile-grid{grid-template-columns:1fr}.audience-profile-head>i{display:none}}

/* Phone orientation guard. Installed PWAs are locked by the manifest; the
   overlay is the browser-safe fallback, where orientation locking APIs are
   unavailable unless the page owns fullscreen mode. */
.orientation-lock { display:none; }
@media (orientation:landscape) and (max-width:950px) and (max-height:520px) and (pointer:coarse) {
	html,body { overflow:hidden!important;overscroll-behavior:none; }
	.orientation-lock {
		position:fixed;z-index:2147483647;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
		padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));
		box-sizing:border-box;background:radial-gradient(circle at 50% 38%,rgba(140,73,205,.28),transparent 36%),linear-gradient(145deg,#21162f,#0e0b15 78%);color:#fff;text-align:center;
	}
	.orientation-lock-visual { position:relative;width:94px;height:94px;display:grid;place-items:center;margin-bottom:5px;border:1px solid rgba(193,139,243,.2);border-radius:28px;background:rgba(137,65,202,.12);box-shadow:0 18px 45px rgba(0,0,0,.3); }
	.orientation-lock-visual>i { font-size:54px;color:#d4a7fb;transform:rotate(90deg); }
	.orientation-lock-arrow { position:absolute;right:-14px;top:-10px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#8d3bde;color:#fff;box-shadow:0 8px 22px rgba(141,59,222,.45); }
	.orientation-lock-arrow i { font-size:16px; }
	.orientation-lock strong { font-family:var(--site-font-display);font-size:clamp(20px,5vw,28px); }
	.orientation-lock p { margin:0;color:#a99eb2;font-size:12px;line-height:1.5; }
}
@keyframes bnz-arm-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(255,95,86,0); } 50% { box-shadow: 0 0 0 4px rgba(255,95,86,0.16); } }

/* Symbols fall in from above their cell. Every column shares the same delay
   for a given row, so all six columns move in sync while rows still cascade. */
@keyframes bnz-drop {
    0%   { transform:translate3d(0,-210%,0) scale(.72) rotate(var(--bnz-drop-tilt,-7deg));opacity:0;filter:blur(7px) brightness(1.45); }
    48%  { opacity:.88;filter:blur(2px) brightness(1.16); }
    76%  { transform:translate3d(0,10%,0) scale(1.08) rotate(0);opacity:1;filter:blur(0) brightness(1.06); }
    88%  { transform:translate3d(0,-4%,0) scale(.97); }
    100% { transform:translate3d(0,0,0) scale(1);opacity:1;filter:blur(0) brightness(1); }
}

@keyframes bnz-cell-win-pulse {
    0%,100% { box-shadow: inset 0 0 0 2px rgba(246,196,83,0.9), 0 0 16px rgba(246,196,83,0.35); }
    50%     { box-shadow: inset 0 0 0 2px rgba(255,255,255,0.95), 0 0 26px rgba(246,196,83,0.6); }
}
@keyframes bnz-cell-pop {
    0%   { transform: scale(1); opacity: 1; }
    45%  { transform: scale(1.22); opacity: 1; }
    100% { transform: scale(.25); opacity: 0; }
}

@keyframes bnz-bomb-flash {
    0%,100% { box-shadow: inset 0 0 0 1px rgba(255,210,74,0.3); filter:brightness(1); }
    50%     { box-shadow: inset 0 0 0 3px rgba(255,210,74,1), 0 0 24px rgba(255,210,74,0.7); filter:brightness(1.28); }
}

/* Bonanza motion layer */
/* transform + opacity only, and specifically NO scale(). A layer with an
   animated scale has to be re-rasterised at every new size; translate and
   opacity are handled by the compositor from a single raster. See the note on
   .bnz-ambient below for why that mattered so much here. */
@keyframes bnz-ambient-rise {
    0% { transform:translate3d(0,24px,0);opacity:0; }
    18% { opacity:.52; }
    72% { opacity:.22; }
    100% { transform:translate3d(var(--drift),-440px,0);opacity:0; }
}
@keyframes bnz-cabinet-aura {
    0%,100% { box-shadow:0 34px 80px rgba(2,1,7,.5),inset 0 0 0 1px rgba(255,255,255,.035),0 0 0 rgba(36,214,200,0); }
    50% { box-shadow:0 38px 86px rgba(2,1,7,.56),inset 0 0 0 1px rgba(255,255,255,.05),0 0 34px rgba(36,214,200,.085); }
}
@keyframes bnz-status-breathe {
    0%,100% { transform:scale(.82);opacity:.55;box-shadow:0 0 5px rgba(46,227,111,.5); }
    50% { transform:scale(1.22);opacity:1;box-shadow:0 0 13px rgba(46,227,111,.95); }
}
@keyframes bnz-button-sheen {
    0%,68% { transform:translateX(-160%) skewX(-24deg); }
    100% { transform:translateX(360%) skewX(-24deg); }
}
@keyframes bnz-symbol-idle {
    0%,100% { transform:translate3d(0,0,0) rotate(-.5deg); }
    50% { transform:translate3d(0,-3px,0) rotate(.7deg); }
}
/* Translate only. The symbols are 512px raster art drawn into ~70px cells, so
   a sub-degree rotate() does not read as rotation -- it just resamples the
   bitmap at a slightly different angle every frame and the edges crawl. Ten of
   those at once is what made the whole grid look like it was vibrating. */
@keyframes bnz-safe-float {
    0%,100% { transform:translate3d(0,1px,0); }
    50% { transform:translate3d(0,-3px,0); }
}
@keyframes bnz-cell-light {
    0%,100% { background-color:rgba(255,255,255,.006); }
    50% { background-color:rgba(36,214,200,.035); }
}
@keyframes bnz-board-scan {
    0%,18% { transform:translateX(-145%) skewX(-18deg);opacity:0; }
    28% { opacity:.3; }
    56% { opacity:.14; }
    72%,100% { transform:translateX(245%) skewX(-18deg);opacity:0; }
}
@keyframes bnz-land-ring {
    0% { opacity:.8;transform:scale(.25);border-width:2px; }
    75% { opacity:.18;transform:scale(.9);border-width:1px; }
    100% { opacity:0;transform:scale(1.08);border-width:1px; }
}
@keyframes bnz-win-spark-a {
    0%,100% { opacity:0;transform:translate(0,0) scale(.35) rotate(0); }
    32% { opacity:1; }
    72% { opacity:.55;transform:translate(19px,-23px) scale(1) rotate(95deg); }
}
@keyframes bnz-win-spark-b {
    0%,100% { opacity:0;transform:translate(0,0) scale(.3) rotate(0); }
    28% { opacity:1; }
    76% { opacity:.5;transform:translate(-21px,18px) scale(.9) rotate(-110deg); }
}
@keyframes bnz-free-aura {
    0%,100% { box-shadow:0 8px 24px rgba(0,0,0,.25),0 0 0 rgba(36,214,200,0); }
    50% { box-shadow:0 8px 24px rgba(0,0,0,.3),0 0 22px rgba(36,214,200,.24); }
}
@keyframes bnz-brand-flicker {
    0%,100% { opacity:.55; }
    48% { opacity:.9; }
    52% { opacity:.35; }
    56% { opacity:.8; }
}
@keyframes bnz-spin-cell-charge {
    0%,100% { opacity:0;transform:translateY(-115%); }
    38% { opacity:.28; }
    72% { opacity:.08; }
    86% { transform:translateY(115%);opacity:0; }
}
@keyframes bnz-spin-frame {
    0%,100% { box-shadow:inset 0 0 0 1px rgba(36,214,200,.05),0 0 0 rgba(36,214,200,0); }
    50% { box-shadow:inset 0 0 0 1px rgba(118,255,243,.18),0 0 24px rgba(36,214,200,.11); }
}
@keyframes bnz-scatter-suspense {
    0%,100% { filter:drop-shadow(0 7px 6px rgba(0,0,0,.38)) drop-shadow(0 0 4px rgba(255,191,74,.3)); }
    50% { filter:drop-shadow(0 8px 7px rgba(0,0,0,.42)) drop-shadow(0 0 18px rgba(255,191,74,.95)) brightness(1.22); }
}
/* Same reason as bnz-safe-float: the ±2deg rotate made the lollipop shimmer
   rather than turn. The scale pulse and the glow carry the effect on their own. */
@keyframes bnz-scatter-orbit {
    0%,100% { transform:scale(1);filter:drop-shadow(0 7px 6px rgba(0,0,0,.38)) drop-shadow(0 0 0 rgba(36,214,200,0)); }
    50% { transform:scale(1.045);filter:drop-shadow(0 8px 7px rgba(0,0,0,.42)) drop-shadow(0 0 11px rgba(36,214,200,.42)); }
}
@keyframes bnz-win-tilt {
    0% { transform:perspective(260px) rotateY(0) scale(1); }
    35% { transform:perspective(260px) rotateY(16deg) scale(1.18); }
    68% { transform:perspective(260px) rotateY(-12deg) scale(1.12); }
    100% { transform:perspective(260px) rotateY(0) scale(1); }
}
@keyframes bnz-machine-impact {
    0%,100% { transform:translate3d(0,0,0);filter:brightness(1); }
    18% { transform:translate3d(-3px,1px,0);filter:brightness(1.38); }
    36% { transform:translate3d(3px,-1px,0); }
    54% { transform:translate3d(-2px,0,0); }
    72% { transform:translate3d(1px,0,0);filter:brightness(1.08); }
}
@keyframes bnz-page-win-glow {
    0%,100% { opacity:0;transform:scale(.82); }
    35%,68% { opacity:.75;transform:scale(1.06); }
}
@keyframes bnz-history-enter {
    from { opacity:0;transform:translateY(-6px); }
    to { opacity:1;transform:translateY(0); }
}

/* Bonanza mobile app flow ------------------------------------------------ */
html { scrollbar-gutter:stable; }

/* Desktop: keep every primary game surface on the left and its controls on
   the right. Mobile layouts continue to stack the surface above the controls
   and retain their route-specific sizing. */
@media (min-width:769px) {

    .mines-controls,
    .dice-controls,
    .limbo-controls,
    .wheel-controls,
    .hilo-controls,
    .bj-controls,
    .bcr-controls,
    .kn-controls,
    .ck-controls,
    .cf-controls,
    .av-controls,
    .rl-controls,
    .cr-controls,
    .tw-controls,
    .plinko-controls,
    .sl-controls,
    .rps-controls,
    .dt-controls,
    .sc-controls,
    .er-controls,
    .co-controls,
    .bnz-controls {
        border-right:0;
        border-left:1px solid rgba(255,255,255,.07);
    }
}
@keyframes sc-tumble-2026 { 0% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-13px) rotate(19deg); } 100% { transform: translateY(0) rotate(0); } }

@keyframes er-pulse { 50% { opacity: .35; } }
@keyframes er-winner { 40% { opacity: .55; } }
@keyframes co-flash { 0% { opacity: 0; } 12% { opacity: .38; } 100% { opacity: 0; } }

/* Desktop panel edge after all game-specific styles, including games whose
   styles are declared near the end of this bundle. */
@media (min-width:769px) {
    .sc-controls,
    .er-controls,
    .co-controls {
        border-right:0;
        border-left:1px solid rgba(255,255,255,.07);
    }
}
@keyframes hw-arm-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(255,95,86,0); } 50% { box-shadow:0 0 0 4px rgba(255,95,86,.16); } }
@keyframes hw-ambient-rise {
    0% { transform:translate3d(0,24px,0);opacity:0; }
    18% { opacity:.52; }
    72% { opacity:.22; }
    100% { transform:translate3d(var(--drift),-440px,0);opacity:0; }
}
@keyframes hw-history-enter {
    0% { opacity:0;transform:translateY(-6px); }
    100% { opacity:1;transform:translateY(0); }
}

@keyframes hw-page-win-glow {
    0%,100% { opacity:0; }
    35%,68% { opacity:.5; }
}

@keyframes hw-spin {
    0%   { transform:translate3d(0,-160%,0);opacity:0;filter:blur(6px); }
    62%  { opacity:1;filter:blur(1px); }
    80%  { transform:translate3d(0,7%,0);filter:blur(0); }
    100% { transform:translate3d(0,0,0);opacity:1; }
}

@keyframes hw-cell-win-pulse {
    0%,100% { box-shadow:inset 0 0 0 2px rgba(246,196,83,.9),0 0 16px rgba(246,196,83,.35); }
    50%     { box-shadow:inset 0 0 0 2px rgba(255,255,255,.95),0 0 26px rgba(246,196,83,.6); }
}

@keyframes hw-cell-lock {
    0%   { transform:scale(1.35);filter:brightness(1.7); }
    60%  { transform:scale(.94); }
    100% { transform:scale(1);filter:brightness(1); }
}

/* The whole screen filling is the one moment this game builds to. */
@keyframes hw-grand-flash {
    0%,100% { box-shadow:inset 0 0 0 1px rgba(255,255,255,.04); }
    50%     { box-shadow:inset 0 0 0 3px rgba(255,210,74,.9),0 0 60px rgba(255,210,74,.5); }
}
@keyframes mw-arm-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(255,95,86,0); } 50% { box-shadow:0 0 0 4px rgba(255,95,86,.16); } }
@keyframes mw-ambient-rise {
    0% { transform:translate3d(0,24px,0);opacity:0; }
    18% { opacity:.52; }
    72% { opacity:.22; }
    100% { transform:translate3d(var(--drift),-440px,0);opacity:0; }
}
@keyframes mw-history-enter {
    0% { opacity:0;transform:translateY(-6px); }
    100% { opacity:1;transform:translateY(0); }
}

@keyframes mw-page-win-glow {
    0%,100% { opacity:0; }
    35%,68% { opacity:.5; }
}

@keyframes mw-spin {
    0%   { transform:translate3d(0,-190%,0);opacity:0;filter:blur(7px); }
    58%  { opacity:1;filter:blur(2px); }
    80%  { transform:translate3d(0,8%,0);filter:blur(0); }
    100% { transform:translate3d(0,0,0);opacity:1; }
}

@keyframes mw-cell-win-pulse {
    0%,100% { box-shadow:inset 0 0 0 2px rgba(36,214,200,.9),0 0 16px rgba(36,214,200,.35); }
    50%     { box-shadow:inset 0 0 0 2px rgba(255,255,255,.95),0 0 26px rgba(36,214,200,.6); }
}
@keyframes mw-cell-pop {
    0%   { transform:scale(1);opacity:1; }
    45%  { transform:scale(1.2);opacity:1; }
    100% { transform:scale(.25);opacity:0; }
}
@keyframes bk-arm-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(255,95,86,0); } 50% { box-shadow:0 0 0 4px rgba(255,95,86,.16); } }
@keyframes bk-ambient-rise {
    0% { transform:translate3d(0,24px,0);opacity:0; }
    18% { opacity:.52; }
    72% { opacity:.22; }
    100% { transform:translate3d(var(--drift),-440px,0);opacity:0; }
}
@keyframes bk-history-enter {
    0% { opacity:0;transform:translateY(-6px); }
    100% { opacity:1;transform:translateY(0); }
}

@keyframes bk-page-win-glow {
    0%,100% { opacity:0; }
    35%,68% { opacity:.5; }
}

@keyframes bk-spin {
    0%   { transform:translate3d(0,-170%,0);opacity:0;filter:blur(6px); }
    60%  { opacity:1;filter:blur(1px); }
    80%  { transform:translate3d(0,7%,0);filter:blur(0); }
    100% { transform:translate3d(0,0,0);opacity:1; }
}

@keyframes bk-cell-win-pulse {
    0%,100% { box-shadow:inset 0 0 0 2px rgba(184,163,255,.9),0 0 16px rgba(184,163,255,.35); }
    50%     { box-shadow:inset 0 0 0 2px rgba(255,255,255,.95),0 0 26px rgba(184,163,255,.6); }
}

@keyframes bk-cell-scatter {
    0%,100% { box-shadow:inset 0 0 0 1px rgba(255,191,74,.4); }
    50%     { box-shadow:inset 0 0 0 3px rgba(255,210,74,1),0 0 24px rgba(255,210,74,.65); }
}

/* The expansion: the reel fills top to bottom with the chosen symbol and the
   whole column lights. This is the payoff moment of the archetype, so it gets
   a full-column treatment rather than a per-cell one. */
@keyframes bk-cell-expand {
    0%   { transform:scale(.4) rotate(-8deg);opacity:0;filter:brightness(2); }
    55%  { transform:scale(1.12) rotate(2deg);opacity:1; }
    100% { transform:scale(1) rotate(0);opacity:1;filter:brightness(1); }
}
@keyframes bk-reveal-in {
    0% { opacity:0; }
    100% { opacity:1; }
}
@keyframes bk-reveal-pop {
    0%   { transform:scale(.3) rotate(-14deg);opacity:0; }
    60%  { transform:scale(1.14) rotate(4deg);opacity:1; }
    100% { transform:scale(1) rotate(0); }
}

/* Sun of Zam mobile app scene.  This game predates the `*-game-layout`
   naming used by the shared phone shell, so it needs the same behaviour
   explicitly: reels stay visible and the essential controls form a compact
   dock instead of turning the page into a long scrolling form. */
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    body.is-game-page #hw-result { max-width:calc(100% - 14px); }
}

/* Gem Megaways mobile app scene.  Its variable-height reels need more of the
   viewport than a fixed 5x3 slot, so the board owns all remaining space above
   a compact three-row control dock. */
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    body.is-game-page #mw-result { max-width:calc(100% - 12px); }
}

/* Book of Zam mobile app scene. */
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    body.is-game-page #bk-result { max-width:calc(100% - 14px); }
}
#page_content2.is-game-fullscreen .sl-page > :not(.sl-game-layout),
#page_content2.is-game-fullscreen .bnz-page > :not(.bnz-layout),
#page_content2.is-game-fullscreen .hw-page > :not(.hw-layout),
#page_content2.is-game-fullscreen .mw-page > :not(.mw-layout),
#page_content2.is-game-fullscreen .bk-page > :not(.bk-layout) { display:none!important; }

/* Fullscreen turns the regular page into a viewport-sized game scene. */
#page_content2.is-game-fullscreen {
    width:100%!important;height:100%!important;max-width:none!important;
    padding:12px!important;display:flex!important;flex-direction:column!important;
    overflow:hidden!important;background:#0c0913!important;box-sizing:border-box!important;
}
#page_content2.is-game-fullscreen > .game-back-nav {
    height:48px;min-height:48px;flex:0 0 48px;padding:4px 6px!important;
}
#page_content2.is-game-fullscreen > div:first-of-type {
    width:100%!important;height:auto!important;min-height:0!important;max-width:none!important;
    margin:0!important;padding:0!important;flex:1 1 auto!important;
    display:flex!important;flex-direction:column!important;overflow:hidden!important;
}
#page_content2.is-game-fullscreen > div:first-of-type > [class$="-game-layout"],
#page_content2.is-game-fullscreen > div:first-of-type > .bnz-layout,
#page_content2.is-game-fullscreen > div:first-of-type > .hw-layout,
#page_content2.is-game-fullscreen > div:first-of-type > .mw-layout,
#page_content2.is-game-fullscreen > div:first-of-type > .bk-layout {
    width:100%!important;height:auto!important;min-height:0!important;max-width:none!important;
    margin:0!important;flex:1 1 auto!important;overflow:hidden!important;
}
#page_content2.is-game-fullscreen [class$="-stage"],
#page_content2.is-game-fullscreen [class$="-controls"] {
    min-width:0!important;min-height:0!important;max-width:none!important;
}
#page_content2.is-game-fullscreen [class$="-cabinet"] {
    width:100%!important;height:100%!important;min-height:0!important;max-width:none!important;
    margin:0!important;box-sizing:border-box!important;
}
#page_content2.is-game-fullscreen > div:first-of-type > [class$="-history"],
#page_content2.is-game-fullscreen > div:first-of-type > .game-info,
#page_content2.is-game-fullscreen > div:first-of-type > [class$="-game-info"] {
    display:none!important;
}
@media (max-width:768px), (pointer:coarse) and (max-width:1199px) and (max-height:600px) and (orientation:landscape) {
    #page_content2.is-game-fullscreen { padding:4px!important; }
    #page_content2.is-game-fullscreen > .game-back-nav {
        height:44px!important;min-height:44px!important;flex-basis:44px!important;padding:2px!important;
    }
}

@keyframes nerve-spin { to { transform: rotate(360deg); } }
@keyframes nerve-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.035); } }
@keyframes nerve-blast { 0% { opacity: 1; transform: translate(-50%,-50%) scale(0); } 60% { opacity: .85; } 100% { opacity: 0; transform: translate(-50%,-50%) scale(46); } }
@keyframes nerve-flash { 0% { opacity: .9; } 100% { opacity: 0; } }
@keyframes nerve-spark { 0% { opacity: 1; transform: rotate(calc(var(--i) * 22.5deg)) translateY(0) scale(1); } 100% { opacity: 0; transform: rotate(calc(var(--i) * 22.5deg)) translateY(-190px) scale(.4); } }
@keyframes nerve-ball-breathe { 0%,100% { transform: scale(var(--nv-ball-scale)); } 48% { transform: scale(calc(var(--nv-ball-scale) * 1.035)); } 58% { transform: scale(calc(var(--nv-ball-scale) * .992)); } }
@keyframes nerve-ring { 0% { opacity: calc(.42 + var(--nv-pressure) * .32); transform: translate(-50%,-50%) scale(calc(.62 + var(--nv-ball-scale) * .58)); } 100% { opacity: 0; transform: translate(-50%,-50%) scale(calc(1.05 + var(--nv-ball-scale) * .9)); } }
@keyframes nerve-core-spin { to { transform: rotate(360deg); } }
@keyframes nerve-player-hold { 0%,100% { filter: brightness(.9); } 50% { filter: brightness(1.5); } }
@keyframes nerve-vignette { 0%,100% { filter: brightness(.78); } 50% { filter: brightness(1.32); } }
@keyframes nerve-pressure-hit { 0% { transform: translate(-50%,-50%) scale(calc(var(--nv-scene-scale) * .94)); } 50% { transform: translate(-50%,-50%) scale(calc(var(--nv-scene-scale) * 1.055)); } 100% { transform: translate(-50%,-50%) scale(var(--nv-scene-scale)); } }
@keyframes nerve-scene-tremor { 0% { transform: translate(calc(-50% - 1px),calc(-50% + 1px)) scale(var(--nv-scene-scale)); } 100% { transform: translate(calc(-50% + 1px),calc(-50% - 1px)) scale(var(--nv-scene-scale)); } }
@keyframes nerve-ball-pop { 0% { opacity: 1; transform: scale(var(--nv-ball-scale)); filter: brightness(1); } 28% { opacity: 1; transform: scale(calc(var(--nv-ball-scale) * 1.18)); filter: brightness(2.8); } 100% { opacity: 0; transform: scale(calc(var(--nv-ball-scale) * 1.9)); filter: brightness(4) blur(6px); } }
@keyframes nerve-orbit-blast { to { opacity: 0; transform: translate(-50%,-50%) scale(2.1); } }
@keyframes nerve-countdown-beat { 0% { transform:scale(.84); filter:brightness(1.65); } 55% { transform:scale(1.08); } 100% { transform:scale(1); filter:brightness(1); } }
@keyframes revolver-spin { to { transform: rotate(360deg); } }
@keyframes revolver-pulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes revolver-hammer {
    0% { transform: translateX(-50%) rotate(0deg); }
    30% { transform: translateX(-50%) rotate(-34deg); }
    48% { transform: translateX(-50%) rotate(7deg); }
    100% { transform: translateX(-50%) rotate(0deg); }
}
@keyframes revolver-hammer-shot {
    0% { transform:translateX(-50%) rotate(0deg); }
    28% { transform:translateX(-50%) rotate(-38deg); }
    43% { transform:translateX(-50%) rotate(10deg) translateY(2px);filter:brightness(2.4); }
    58% { transform:translateX(-50%) rotate(-8deg); }
    100% { transform:translateX(-50%) rotate(0deg);filter:none; }
}
@keyframes revolver-drum-recoil {
    0%,28%,100% { transform:translate(0) rotate(0); }
    42% { transform:translate(0,8px) rotate(-2.4deg) scale(.97);filter:brightness(1.75); }
    52% { transform:translate(-5px,-3px) rotate(1.6deg) scale(1.025); }
    64% { transform:translate(4px,1px) rotate(-.8deg); }
    78% { transform:translate(-2px,0) rotate(.35deg); }
}
@keyframes revolver-shot-flash {
    0%,30% { opacity:0;transform:scale(.35); }
    40% { opacity:1;transform:scale(1.08); }
    56% { opacity:.52; }
    100% { opacity:0;transform:scale(1.35); }
}
@keyframes revolver-shot-ring {
    0%,35% { opacity:0;transform:scale(.72); }
    43% { opacity:.95; }
    100% { opacity:0;transform:scale(1.42); }
}
@keyframes revolver-arena-shot {
    0%,34%,100% { transform:translate(0); }
    41% { transform:translate(-5px,2px); }
    48% { transform:translate(5px,-2px); }
    56% { transform:translate(-3px,1px); }
    65% { transform:translate(2px,-1px); }
}
@keyframes revolver-strike {
    0%,100% { transform: rotate(calc((var(--i) - var(--turn)) * 60deg)) translateY(calc(-1 * var(--rv-chamber-radius))) rotate(calc((var(--turn) - var(--i)) * 60deg)) scale(1); }
    40% { transform: rotate(calc((var(--i) - var(--turn)) * 60deg)) translateY(calc(-1 * var(--rv-chamber-radius))) rotate(calc((var(--turn) - var(--i)) * 60deg)) scale(1.2); }
}
@keyframes revolver-live-strike {
    0%,100% { transform:rotate(calc((var(--i) - var(--turn)) * 60deg)) translateY(calc(-1 * var(--rv-chamber-radius))) rotate(calc((var(--turn) - var(--i)) * 60deg)) scale(1); }
    38% { transform:rotate(calc((var(--i) - var(--turn)) * 60deg)) translateY(calc(-1 * var(--rv-chamber-radius))) rotate(calc((var(--turn) - var(--i)) * 60deg)) scale(1.38);box-shadow:0 0 44px 12px rgba(255,55,72,.86); }
    58% { transform:rotate(calc((var(--i) - var(--turn)) * 60deg)) translateY(calc(-1 * var(--rv-chamber-radius))) rotate(calc((var(--turn) - var(--i)) * 60deg)) scale(.92); }
}

.social-rematch-button {
    min-height: 38px;
    padding: 0 16px;
    border: 1px solid rgba(177, 111, 255, .72);
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(135deg, #7137d8, #a24cf0);
    box-shadow: 0 8px 24px rgba(113, 55, 216, .28), inset 0 1px rgba(255,255,255,.16);
    font: 800 11px/1 inherit;
    letter-spacing: .03em;
    cursor: pointer;
    transition: transform .18s ease, filter .18s ease, opacity .18s ease;
}
.social-rematch-button:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.12); }
.social-rematch-button:disabled { cursor: default; opacity: .72; }
.social-rematch-button.is-pending i { animation: social-rematch-spin 1.2s linear infinite; }
@keyframes social-rematch-spin { to { transform: rotate(360deg); } }
.social-stage-rematch {
    position: absolute;
    z-index: 16;
    left: 50%;
    bottom: 14px;
    display: flex;
    width: min(280px,calc(100% - 24px));
    justify-content: center;
    opacity: 0;
    transform: translate(-50%,18px) scale(.88);
    pointer-events: none;
    transition: opacity .24s ease,transform .38s cubic-bezier(.18,.9,.24,1.18);
}
.social-stage-rematch.show { opacity: 1; transform: translate(-50%,0) scale(1); pointer-events: auto; }
.social-stage-rematch .social-rematch-button {
    width: 100%;
    min-height: 52px;
    border-width: 2px;
    border-color: rgba(225,187,255,.88);
    border-radius: 15px;
    background: linear-gradient(135deg,#6830ce,#a94ff4 58%,#d06cff);
    box-shadow: 0 14px 34px rgba(74,24,143,.52),0 0 28px rgba(177,111,255,.32),inset 0 1px rgba(255,255,255,.24);
    font-size: 13px;
    letter-spacing: .05em;
    text-transform: uppercase;
    animation: social-stage-rematch-pulse 1.8s ease-in-out infinite;
}
.social-stage-rematch .social-rematch-button:disabled { animation: none; }
@keyframes social-stage-rematch-pulse {
    0%,100% { box-shadow:0 14px 34px rgba(74,24,143,.52),0 0 22px rgba(177,111,255,.24),inset 0 1px rgba(255,255,255,.24); }
    50% { box-shadow:0 14px 38px rgba(74,24,143,.58),0 0 38px rgba(200,133,255,.5),inset 0 1px rgba(255,255,255,.3); }
}
@media (max-width: 768px), (pointer: coarse) and (max-width: 1199px) and (max-height: 600px) and (orientation: landscape) {
    .social-rematch-button { width: 100%; min-height: 44px; }
    .social-stage-rematch { bottom: 10px; width: min(240px,calc(100% - 18px)); }
    .social-stage-rematch .social-rematch-button { min-height: 48px; border-radius: 13px; font-size: 11px; }
}
@keyframes bridge-spin { to { transform: rotate(360deg); } }
@keyframes bridge-creak {
    0%,100% { transform: translateY(0) rotate(0deg); }
    35% { transform: translateY(calc(var(--strain,0) * 2px)) rotate(calc(var(--strain,0) * .7deg)); }
    70% { transform: translateY(calc(var(--strain,0) * -1px)) rotate(calc(var(--strain,0) * -.5deg)); }
}
@keyframes bridge-stride-a { 0%,100% { transform: rotate(-16deg); } 50% { transform: rotate(22deg); } }
@keyframes bridge-stride-b { 0%,100% { transform: rotate(16deg); } 50% { transform: rotate(-22deg); } }
@keyframes bridge-plunge {
    0% { transform: translateY(0) rotate(0deg); opacity: 1; }
    25% { transform: translateY(6px) rotate(-12deg); opacity: 1; }
    100% { transform: translateY(74px) rotate(58deg); opacity: 0; }
}
@keyframes bridge-clock-pulse { to { text-shadow: 0 0 16px rgba(255,85,103,.95); transform: scale(1.05); } }

/* ---------------------------------------------------------------------------
   Admin -> Finance. Reporting for the custodial wallet: who deposited, from
   which wallet, where payouts went, and what has not been consolidated yet.
   Shares the .wallet-tag status pills with the player-facing wallet pages.
   --------------------------------------------------------------------------- */
.admin-finance .finance-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 12px; margin-bottom: 16px; }
.admin-finance .finance-card { padding: 14px 16px; border: 1px solid rgba(255, 255, 255, .07); border-radius: 13px; background: rgba(8, 6, 17, .42); }
.admin-finance .finance-card > span { display: block; margin-bottom: 6px; color: #837c90; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.admin-finance .finance-card > b { display: block; color: #f4f0f8; font-size: 21px; line-height: 1.15; }
.admin-finance .finance-card > small { display: block; margin-top: 5px; color: #6e6880; font-size: 10px; }
.admin-finance .finance-card-warn { border-color: rgba(244, 201, 93, .3); background: rgba(85, 65, 21, .18); }
.admin-finance .finance-card-warn > b { color: #f4c95d; }

.admin-finance .finance-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 16px; }
.admin-finance .wallet-tag { padding: 4px 9px; border-radius: 20px; background: rgba(255, 255, 255, .06); color: #8d8699; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.admin-finance .wallet-tag[data-status="credited"],
.admin-finance .wallet-tag[data-status="confirmed"] { background: rgba(30, 142, 88, .16); color: #58d99c; }
.admin-finance .wallet-tag[data-status="review"],
.admin-finance .wallet-tag[data-status="approved"],
.admin-finance .wallet-tag[data-status="sending"],
.admin-finance .wallet-tag[data-status="sent"],
.admin-finance .wallet-tag[data-status="gas_sent"],
.admin-finance .wallet-tag[data-status="pending"],
.admin-finance .wallet-tag[data-status="pending_rate"] { background: rgba(132, 71, 240, .16); color: #b791fa; }
.admin-finance .wallet-tag[data-status="rejected"],
.admin-finance .wallet-tag[data-status="failed"],
.admin-finance .wallet-tag[data-status="manual"] { background: rgba(167, 38, 61, .18); color: #ff8798; }

.admin-finance .finance-lookup { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 16px; }
.admin-finance .finance-lookup input { flex: 1 1 240px; min-width: 0; height: 42px; padding: 0 14px; border: 1px solid rgba(167, 120, 255, .26); border-radius: 11px; outline: 0; background: rgba(8, 6, 17, .55); color: #fff; font-size: 13px; }
.admin-finance .finance-lookup input:focus { border-color: #925cf0; }
.admin-finance .finance-lookup button { display: flex; height: 42px; align-items: center; gap: 8px; padding: 0 18px; border: 0; border-radius: 11px; background: linear-gradient(135deg, #7d3ee8, #a35af2); color: #fff; font-size: 13px; font-weight: 800; cursor: pointer; }
.admin-finance .finance-lookup button:hover { filter: brightness(1.08); }

.admin-finance .finance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 13px; margin-bottom: 18px; }
.admin-finance .finance-panel { padding: 17px 18px; border: 1px solid rgba(255, 255, 255, .07); border-radius: 14px; background: rgba(8, 6, 17, .35); }
.admin-finance .finance-panel h4 { margin: 0 0 4px; color: #efeaf6; font-size: 13px; }
.admin-finance .finance-panel h4 small { margin-left: 8px; color: #6e6880; font-size: 11px; font-weight: 400; }
.admin-finance .finance-panel h5 { margin: 18px 0 9px; color: #bdb5c9; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.admin-finance .finance-hint { margin: 0 0 11px; color: #6e6880; font-size: 10px; line-height: 1.5; }
.admin-finance .finance-empty { margin: 6px 0 0; color: #6e6880; font-size: 11px; }
.admin-finance .finance-warn { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 11px 13px; border: 1px solid rgba(255, 100, 122, .22); border-radius: 10px; background: rgba(194, 42, 67, .1); color: #ff9aaa; font-size: 12px; }
.admin-finance .finance-err { display: block; margin-top: 3px; color: #ff8798; font-size: 9px; overflow-wrap: anywhere; }
.admin-finance .finance-h4 { margin: 22px 0 10px; color: #cfc8db; font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }

.admin-finance .finance-kv { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 11px; margin-top: 12px; }
.admin-finance .finance-kv > div { padding: 10px 12px; border: 1px solid rgba(255, 255, 255, .06); border-radius: 10px; background: rgba(0, 0, 0, .2); }
.admin-finance .finance-kv span { display: block; margin-bottom: 4px; color: #837c90; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.admin-finance .finance-kv b { color: #f2eef8; font-size: 13px; }
.admin-finance .finance-kv code { display: block; overflow-wrap: anywhere; color: #cbb5f4; font-family: monospace; font-size: 11px; }

/* Tables scroll inside their own container: an address plus a tx hash plus a
   date does not fit a narrow admin column, and the page must never scroll
   sideways as a whole. */
.admin-finance .finance-table { overflow-x: auto; margin-bottom: 6px; border: 1px solid rgba(255, 255, 255, .06); border-radius: 12px; }
.admin-finance .finance-tr { display: grid; grid-template-columns: 100px minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1.2fr); align-items: center; gap: 10px; min-width: 620px; padding: 10px 13px; border-bottom: 1px solid rgba(255, 255, 255, .045); }
.admin-finance .finance-tr-6 { grid-template-columns: 92px minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .9fr) minmax(0, 1.2fr); min-width: 780px; }
.admin-finance .finance-tr:last-child { border-bottom: 0; }
.admin-finance .finance-th { background: rgba(255, 255, 255, .03); color: #837c90; font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.admin-finance .finance-tr > span { min-width: 0; color: #cdc6d8; font-size: 11px; overflow-wrap: anywhere; }
.admin-finance .finance-tr > span > b { color: #f2eef8; }
.admin-finance .finance-tr > span > small { display: block; margin-top: 2px; color: #6e6880; font-size: 9px; }
.admin-finance .finance-tr code { color: #cbb5f4; font-family: monospace; font-size: 10px; }
.admin-finance .finance-tr a { color: #a98bf0; text-decoration: none; }
.admin-finance .finance-tr a:hover { text-decoration: underline; }
.admin-finance .metric-row small { display: block; margin-top: 2px; color: #6e6880; font-size: 9px; overflow-wrap: anywhere; }

@media (max-width: 560px) {
	.admin-finance .finance-cards { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
	.admin-finance .finance-card > b { font-size: 18px; }
}

/* The shared .admin-view-block h3 is a flex row (it hosts search inputs and
   sort controls on other panels). This panel's heading has nothing beside it,
   so it must not share a line with the summary cards below. */
.admin-finance > h3 { display: block; flex: 0 0 100%; width: 100%; margin: 0 0 14px; }

/* Signer-raised alerts. The signer is headless, so these rows are the only
   place an empty gas tank or a stuck payout becomes visible in the product. */
.admin-finance .finance-alert { display: flex; gap: 11px; margin-bottom: 10px; padding: 13px 15px; border: 1px solid rgba(244, 201, 93, .26); border-radius: 12px; background: rgba(85, 65, 21, .16); }
.admin-finance .finance-alert > i { flex: 0 0 auto; margin-top: 2px; color: #f4c95d; font-size: 15px; }
.admin-finance .finance-alert[data-severity="critical"] { border-color: rgba(255, 100, 122, .3); background: rgba(167, 38, 61, .14); }
.admin-finance .finance-alert[data-severity="critical"] > i { color: #ff8798; }
.admin-finance .finance-alert strong { display: block; margin-bottom: 4px; color: #f4f0f8; font-size: 13px; }
.admin-finance .finance-alert span { display: block; color: #9c94a8; font-size: 11px; line-height: 1.5; }
.admin-finance .finance-alert small { display: block; margin-top: 5px; color: #6e6880; font-size: 9px; }