*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(63 131 248 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(63 131 248 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}/*
! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #E5E7EB; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9CA3AF; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9CA3AF; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

.tooltip-arrow,.tooltip-arrow:before {
  position: absolute;
  width: 8px;
  height: 8px;
  background: inherit;
}

.tooltip-arrow {
  visibility: hidden;
}

.tooltip-arrow:before {
  content: "";
  visibility: visible;
  transform: rotate(45deg);
}

[data-tooltip-style^='light'] + .tooltip > .tooltip-arrow:before {
  border-style: solid;
  border-color: #e5e7eb;
}

[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='top'] > .tooltip-arrow:before {
  border-bottom-width: 1px;
  border-right-width: 1px;
}

[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='right'] > .tooltip-arrow:before {
  border-bottom-width: 1px;
  border-left-width: 1px;
}

[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='bottom'] > .tooltip-arrow:before {
  border-top-width: 1px;
  border-left-width: 1px;
}

[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='left'] > .tooltip-arrow:before {
  border-top-width: 1px;
  border-right-width: 1px;
}

.tooltip[data-popper-placement^='top'] > .tooltip-arrow {
  bottom: -4px;
}

.tooltip[data-popper-placement^='bottom'] > .tooltip-arrow {
  top: -4px;
}

.tooltip[data-popper-placement^='left'] > .tooltip-arrow {
  right: -4px;
}

.tooltip[data-popper-placement^='right'] > .tooltip-arrow {
  left: -4px;
}

.tooltip.invisible > .tooltip-arrow:before {
  visibility: hidden;
}

[data-popper-arrow],[data-popper-arrow]:before {
  position: absolute;
  width: 8px;
  height: 8px;
  background: inherit;
}

[data-popper-arrow] {
  visibility: hidden;
}

[data-popper-arrow]:before {
  content: "";
  visibility: visible;
  transform: rotate(45deg);
}

[data-popper-arrow]:after {
  content: "";
  visibility: visible;
  transform: rotate(45deg);
  position: absolute;
  width: 9px;
  height: 9px;
  background: inherit;
}

[role="tooltip"] > [data-popper-arrow]:before {
  border-style: solid;
  border-color: #e5e7eb;
}

.dark [role="tooltip"] > [data-popper-arrow]:before {
  border-style: solid;
  border-color: #4b5563;
}

[role="tooltip"] > [data-popper-arrow]:after {
  border-style: solid;
  border-color: #e5e7eb;
}

.dark [role="tooltip"] > [data-popper-arrow]:after {
  border-style: solid;
  border-color: #4b5563;
}

[data-popover][role="tooltip"][data-popper-placement^='top'] > [data-popper-arrow]:before {
  border-bottom-width: 1px;
  border-right-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='top'] > [data-popper-arrow]:after {
  border-bottom-width: 1px;
  border-right-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='right'] > [data-popper-arrow]:before {
  border-bottom-width: 1px;
  border-left-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='right'] > [data-popper-arrow]:after {
  border-bottom-width: 1px;
  border-left-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='bottom'] > [data-popper-arrow]:before {
  border-top-width: 1px;
  border-left-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='bottom'] > [data-popper-arrow]:after {
  border-top-width: 1px;
  border-left-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='left'] > [data-popper-arrow]:before {
  border-top-width: 1px;
  border-right-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='left'] > [data-popper-arrow]:after {
  border-top-width: 1px;
  border-right-width: 1px;
}

[data-popover][role="tooltip"][data-popper-placement^='top'] > [data-popper-arrow] {
  bottom: -5px;
}

[data-popover][role="tooltip"][data-popper-placement^='bottom'] > [data-popper-arrow] {
  top: -5px;
}

[data-popover][role="tooltip"][data-popper-placement^='left'] > [data-popper-arrow] {
  right: -5px;
}

[data-popover][role="tooltip"][data-popper-placement^='right'] > [data-popper-arrow] {
  left: -5px;
}

[role="tooltip"].invisible > [data-popper-arrow]:before {
  visibility: hidden;
}

[role="tooltip"].invisible > [data-popper-arrow]:after {
  visibility: hidden;
}

[type='text'],[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: #fff;
  border-color: #6B7280;
  border-width: 1px;
  border-radius: 0px;
  padding-top: 0.5rem;
  padding-right: 0.75rem;
  padding-bottom: 0.5rem;
  padding-left: 0.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-shadow: 0 0 #0000;
}

[type='text']:focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #1C64F2;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  border-color: #1C64F2;
}

input::-moz-placeholder, textarea::-moz-placeholder {
  color: #6B7280;
  opacity: 1;
}

input::placeholder,textarea::placeholder {
  color: #6B7280;
  opacity: 1;
}

::-webkit-datetime-edit-fields-wrapper {
  padding: 0;
}

input[type="time"]::-webkit-calendar-picker-indicator {
  background: none;
}

select:not([size]) {
  background-image: url("data:image/svg+xml,%3csvg aria-hidden=%27true%27 xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 10 6%27%3e %3cpath stroke=%27%236B7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%272%27 d=%27m1 1 4 4 4-4%27/%3e %3c/svg%3e");
  background-position: right 0.75rem center;
  background-repeat: no-repeat;
  background-size: 0.75em 0.75em;
  padding-right: 2.5rem;
  -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
}

:is([dir=rtl]) select:not([size]) {
  background-position: left 0.75rem center;
  padding-right: 0.75rem;
  padding-left: 0;
}

[multiple] {
  background-image: initial;
  background-position: initial;
  background-repeat: unset;
  background-size: initial;
  padding-right: 0.75rem;
  -webkit-print-color-adjust: unset;
          print-color-adjust: unset;
}

[type='checkbox'],[type='radio'] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding: 0;
  -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
  display: inline-block;
  vertical-align: middle;
  background-origin: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  flex-shrink: 0;
  height: 1rem;
  width: 1rem;
  color: #1C64F2;
  background-color: #fff;
  border-color: #6B7280;
  border-width: 1px;
  --tw-shadow: 0 0 #0000;
}

[type='checkbox'] {
  border-radius: 0px;
}

[type='radio'] {
  border-radius: 100%;
}

[type='checkbox']:focus,[type='radio']:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #1C64F2;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}

[type='checkbox']:checked,[type='radio']:checked,.dark [type='checkbox']:checked,.dark [type='radio']:checked {
  border-color: transparent;
  background-color: currentColor;
  background-size: 0.55em 0.55em;
  background-position: center;
  background-repeat: no-repeat;
}

[type='checkbox']:checked {
  background-image: url("data:image/svg+xml,%3csvg aria-hidden=%27true%27 xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 16 12%27%3e %3cpath stroke=%27white%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%273%27 d=%27M1 5.917 5.724 10.5 15 1.5%27/%3e %3c/svg%3e");
  background-repeat: no-repeat;
  background-size: 0.55em 0.55em;
  -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
}

[type='radio']:checked {
  background-image: url("data:image/svg+xml,%3csvg viewBox=%270 0 16 16%27 fill=%27white%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3ccircle cx=%278%27 cy=%278%27 r=%273%27/%3e%3c/svg%3e");
  background-size: 1em 1em;
}

.dark [type='radio']:checked {
  background-image: url("data:image/svg+xml,%3csvg viewBox=%270 0 16 16%27 fill=%27white%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3ccircle cx=%278%27 cy=%278%27 r=%273%27/%3e%3c/svg%3e");
  background-size: 1em 1em;
}

[type='checkbox']:indeterminate {
  background-image: url("data:image/svg+xml,%3csvg aria-hidden=%27true%27 xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 16 12%27%3e %3cpath stroke=%27white%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%273%27 d=%27M0.5 6h14%27/%3e %3c/svg%3e");
  background-color: currentColor;
  border-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 0.55em 0.55em;
  -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
}

[type='checkbox']:indeterminate:hover,[type='checkbox']:indeterminate:focus {
  border-color: transparent;
  background-color: currentColor;
}

[type='file'] {
  background: unset;
  border-color: inherit;
  border-width: 0;
  border-radius: 0;
  padding: 0;
  font-size: unset;
  line-height: inherit;
}

[type='file']:focus {
  outline: 1px auto inherit;
}

input[type=file]::file-selector-button {
  color: white;
  background: #1F2937;
  border: 0;
  font-weight: 500;
  font-size: 0.875rem;
  cursor: pointer;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 2rem;
  padding-right: 1rem;
  margin-inline-start: -1rem;
  margin-inline-end: 1rem;
}

input[type=file]::file-selector-button:hover {
  background: #374151;
}

:is([dir=rtl]) input[type=file]::file-selector-button {
  padding-right: 2rem;
  padding-left: 1rem;
}

.dark input[type=file]::file-selector-button {
  color: white;
  background: #4B5563;
}

.dark input[type=file]::file-selector-button:hover {
  background: #6B7280;
}

input[type="range"]::-webkit-slider-thumb {
  height: 1.25rem;
  width: 1.25rem;
  background: #1C64F2;
  border-radius: 9999px;
  border: 0;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

input[type="range"]:disabled::-webkit-slider-thumb {
  background: #9CA3AF;
}

.dark input[type="range"]:disabled::-webkit-slider-thumb {
  background: #6B7280;
}

input[type="range"]:focus::-webkit-slider-thumb {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1px;
  --tw-ring-color: rgb(164 202 254 / var(--tw-ring-opacity));
}

input[type="range"]::-moz-range-thumb {
  height: 1.25rem;
  width: 1.25rem;
  background: #1C64F2;
  border-radius: 9999px;
  border: 0;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

input[type="range"]:disabled::-moz-range-thumb {
  background: #9CA3AF;
}

.dark input[type="range"]:disabled::-moz-range-thumb {
  background: #6B7280;
}

input[type="range"]::-moz-range-progress {
  background: #3F83F8;
}

input[type="range"]::-ms-fill-lower {
  background: #3F83F8;
}

.toggle-bg:after {
  content: "";
  position: absolute;
  top: 0.125rem;
  left: 0.125rem;
  background: white;
  border-color: #D1D5DB;
  border-width: 1px;
  border-radius: 9999px;
  height: 1.25rem;
  width: 1.25rem;
  transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;
  transition-duration: .15s;
  box-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
}

input:checked + .toggle-bg:after {
  transform: translateX(100%);;
  border-color: white;
}

input:checked + .toggle-bg {
  background: #1C64F2;
  border-color: #1C64F2;
}
    body {
        font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    }

    button,
    a,
    input,
    select {
        -webkit-tap-highlight-color: transparent;
    }
.container {
  width: 100%;
}
@media (min-width: 640px) {

  .container {
    max-width: 640px;
  }
}
@media (min-width: 768px) {

  .container {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {

  .container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {

  .container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {

  .container {
    max-width: 1536px;
  }
}
    .game-shell {
        background:
            radial-gradient(circle at 15% 0%, rgb(245 158 11 / 18%), transparent 32rem),
            radial-gradient(circle at 90% 80%, rgb(124 58 237 / 16%), transparent 34rem),
            #020617;
    }

    .game-card {
  border-radius: 1.5rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.1);
  background-color: rgb(255 255 255 / 0.045);
  padding: 1rem;
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}

    @media (min-width: 640px) {

  .game-card {
    padding: 2rem;
  }
}

    .eyebrow {
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  --tw-text-opacity: 1;
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
}

    .primary-button {
  min-height: 3rem;
  touch-action: manipulation;
  border-radius: 0.75rem;
  --tw-bg-opacity: 1;
  background-color: rgb(251 191 36 / var(--tw-bg-opacity, 1));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(2 6 23 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

    .primary-button:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(252 211 77 / var(--tw-bg-opacity, 1));
}

    .primary-button:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: rgb(252 211 77 / 0.3);
}

    .secondary-button {
  min-height: 3rem;
  touch-action: manipulation;
  border-radius: 0.75rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.15);
  background-color: rgb(255 255 255 / 0.1);
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

    .secondary-button:hover {
  border-color: rgb(252 211 77 / 0.5);
  background-color: rgb(251 191 36 / 0.1);
}

    .secondary-button:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: rgb(252 211 77 / 0.2);
}

    @media (min-width: 640px) {

  .secondary-button {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
}

    .field-label {
  margin-bottom: 0.5rem;
  display: block;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}

    .field-input {
  display: block;
  min-height: 3rem;
  width: 100%;
  border-radius: 0.75rem;
  border-width: 1px;
  border-color: rgb(255 255 255 / 0.15);
  background-color: rgb(2 6 23 / 0.8);
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

    .field-input::-moz-placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(71 85 105 / var(--tw-placeholder-opacity, 1));
}

    .field-input::placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(71 85 105 / var(--tw-placeholder-opacity, 1));
}

    .field-input:focus {
  --tw-border-opacity: 1;
  border-color: rgb(252 211 77 / var(--tw-border-opacity, 1));
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(252 211 77 / var(--tw-ring-opacity, 1));
}

    @media (min-width: 640px) {

  .field-input {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

    .top-slot {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 1rem;
  border-radius: 1rem;
  border-width: 1px;
  border-color: rgb(232 121 249 / 0.25);
  background-color: rgb(232 121 249 / 0.1);
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

    .top-slot span {
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  --tw-text-opacity: 1;
  color: rgb(245 208 254 / var(--tw-text-opacity, 1));
}

    .top-slot strong {
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 900;
}

    .top-slot b {
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(240 171 252 / var(--tw-bg-opacity, 1));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 900;
  --tw-text-opacity: 1;
  color: rgb(74 4 78 / var(--tw-text-opacity, 1));
}

    .live-dot {
  border-radius: 9999px;
  background-color: rgb(52 211 153 / 0.15);
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}
.visible {
  visibility: visible;
}
.invisible {
  visibility: hidden;
}
.collapse {
  visibility: collapse;
}
.static {
  position: static;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.sticky {
  position: sticky;
}
.inset-0 {
  inset: 0px;
}
.inset-x-4 {
  left: 1rem;
  right: 1rem;
}
.bottom-0 {
  bottom: 0px;
}
.bottom-\[60px\] {
  bottom: 60px;
}
.left-0 {
  left: 0px;
}
.right-0 {
  right: 0px;
}
.top-0 {
  top: 0px;
}
.top-4 {
  top: 1rem;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-30 {
  z-index: 30;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.-mx-3 {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.ml-3 {
  margin-left: 0.75rem;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-10 {
  margin-top: 2.5rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-5 {
  margin-top: 1.25rem;
}
.mt-7 {
  margin-top: 1.75rem;
}
.mt-8 {
  margin-top: 2rem;
}
.mt-9 {
  margin-top: 2.25rem;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.table {
  display: table;
}
.grid {
  display: grid;
}
.hidden {
  display: none;
}
.h-4 {
  height: 1rem;
}
.h-6 {
  height: 1.5rem;
}
.h-9 {
  height: 2.25rem;
}
.h-fit {
  height: -moz-fit-content;
  height: fit-content;
}
.h-full {
  height: 100%;
}
.min-h-16 {
  min-height: 4rem;
}
.min-h-\[calc\(100vh-4rem\)\] {
  min-height: calc(100vh - 4rem);
}
.min-h-full {
  min-height: 100%;
}
.min-h-screen {
  min-height: 100vh;
}
.w-1\/2 {
  width: 50%;
}
.w-4 {
  width: 1rem;
}
.w-64 {
  width: 16rem;
}
.w-full {
  width: 100%;
}
.min-w-0 {
  min-width: 0px;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-7xl {
  max-width: 80rem;
}
.max-w-\[112rem\] {
  max-width: 112rem;
}
.max-w-lg {
  max-width: 32rem;
}
.max-w-xl {
  max-width: 36rem;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-shrink {
  flex-shrink: 1;
}
.-translate-x-full {
  --tw-translate-x: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-full {
  --tw-translate-y: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-0 {
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-full {
  --tw-translate-x: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-full {
  --tw-translate-y: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\!transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform-none {
  transform: none;
}
.cursor-default {
  cursor: default;
}
.cursor-not-allowed {
  cursor: not-allowed;
}
.cursor-pointer {
  cursor: pointer;
}
.resize {
  resize: both;
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.flex-col {
  flex-direction: column;
}
.flex-wrap {
  flex-wrap: wrap;
}
.place-items-center {
  place-items: center;
}
.items-start {
  align-items: flex-start;
}
.items-end {
  align-items: flex-end;
}
.items-center {
  align-items: center;
}
.justify-start {
  justify-content: flex-start;
}
.justify-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.gap-12 {
  gap: 3rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-5 {
  gap: 1.25rem;
}
.gap-6 {
  gap: 1.5rem;
}
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.overflow-hidden {
  overflow: hidden;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: 0.5rem;
}
.rounded-xl {
  border-radius: 0.75rem;
}
.rounded-e-lg {
  border-start-end-radius: 0.5rem;
  border-end-end-radius: 0.5rem;
}
.rounded-l-lg {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
.rounded-r-lg {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}
.rounded-s-lg {
  border-start-start-radius: 0.5rem;
  border-end-start-radius: 0.5rem;
}
.border {
  border-width: 1px;
}
.border-0 {
  border-width: 0px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-amber-400\/30 {
  border-color: rgb(251 191 36 / 0.3);
}
.border-blue-600 {
  --tw-border-opacity: 1;
  border-color: rgb(28 100 242 / var(--tw-border-opacity, 1));
}
.border-blue-700 {
  --tw-border-opacity: 1;
  border-color: rgb(26 86 219 / var(--tw-border-opacity, 1));
}
.border-emerald-400\/40 {
  border-color: rgb(52 211 153 / 0.4);
}
.border-gray-100 {
  --tw-border-opacity: 1;
  border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));
}
.border-gray-300 {
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
}
.border-orange-400\/30 {
  border-color: rgb(255 138 76 / 0.3);
}
.border-red-400\/40 {
  border-color: rgb(249 128 128 / 0.4);
}
.border-violet-400\/30 {
  border-color: rgb(167 139 250 / 0.3);
}
.border-white\/10 {
  border-color: rgb(255 255 255 / 0.1);
}
.\!bg-gray-50 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)) !important;
}
.bg-amber-400\/10 {
  background-color: rgb(251 191 36 / 0.1);
}
.bg-blue-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(26 86 219 / var(--tw-bg-opacity, 1));
}
.bg-emerald-950\/90 {
  background-color: rgb(2 44 34 / 0.9);
}
.bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.bg-gray-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
}
.bg-gray-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
}
.bg-gray-900\/50 {
  background-color: rgb(17 24 39 / 0.5);
}
.bg-orange-400\/10 {
  background-color: rgb(255 138 76 / 0.1);
}
.bg-red-950\/90 {
  background-color: rgb(69 10 10 / 0.9);
}
.bg-slate-900\/70 {
  background-color: rgb(15 23 42 / 0.7);
}
.bg-slate-950 {
  --tw-bg-opacity: 1;
  background-color: rgb(2 6 23 / var(--tw-bg-opacity, 1));
}
.bg-slate-950\/95 {
  background-color: rgb(2 6 23 / 0.95);
}
.bg-violet-400\/10 {
  background-color: rgb(167 139 250 / 0.1);
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-white\/10 {
  background-color: rgb(255 255 255 / 0.1);
}
.bg-white\/5 {
  background-color: rgb(255 255 255 / 0.05);
}
.bg-white\/50 {
  background-color: rgb(255 255 255 / 0.5);
}
.p-1 {
  padding: 0.25rem;
}
.p-2\.5 {
  padding: 0.625rem;
}
.p-4 {
  padding: 1rem;
}
.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.pb-3 {
  padding-bottom: 0.75rem;
}
.pb-6 {
  padding-bottom: 1.5rem;
}
.pb-8 {
  padding-bottom: 2rem;
}
.pt-2 {
  padding-top: 0.5rem;
}
.text-center {
  text-align: center;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}
.text-5xl {
  font-size: 3rem;
  line-height: 1;
}
.text-\[0\.65rem\] {
  font-size: 0.65rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-black {
  font-weight: 900;
}
.font-bold {
  font-weight: 700;
}
.font-medium {
  font-weight: 500;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-6 {
  line-height: 1.5rem;
}
.leading-8 {
  line-height: 2rem;
}
.leading-9 {
  line-height: 2.25rem;
}
.leading-\[0\.95\] {
  line-height: 0.95;
}
.tracking-\[0\.12em\] {
  letter-spacing: 0.12em;
}
.tracking-\[0\.35em\] {
  letter-spacing: 0.35em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-widest {
  letter-spacing: 0.1em;
}
.text-amber-200 {
  --tw-text-opacity: 1;
  color: rgb(253 230 138 / var(--tw-text-opacity, 1));
}
.text-amber-300 {
  --tw-text-opacity: 1;
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
}
.text-blue-600 {
  --tw-text-opacity: 1;
  color: rgb(28 100 242 / var(--tw-text-opacity, 1));
}
.text-cyan-300 {
  --tw-text-opacity: 1;
  color: rgb(103 232 249 / var(--tw-text-opacity, 1));
}
.text-emerald-100 {
  --tw-text-opacity: 1;
  color: rgb(209 250 229 / var(--tw-text-opacity, 1));
}
.text-emerald-300 {
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}
.text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}
.text-gray-800 {
  --tw-text-opacity: 1;
  color: rgb(31 41 55 / var(--tw-text-opacity, 1));
}
.text-gray-900 {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.text-orange-200 {
  --tw-text-opacity: 1;
  color: rgb(252 217 189 / var(--tw-text-opacity, 1));
}
.text-orange-300 {
  --tw-text-opacity: 1;
  color: rgb(253 186 140 / var(--tw-text-opacity, 1));
}
.text-red-100 {
  --tw-text-opacity: 1;
  color: rgb(253 232 232 / var(--tw-text-opacity, 1));
}
.text-slate-200 {
  --tw-text-opacity: 1;
  color: rgb(226 232 240 / var(--tw-text-opacity, 1));
}
.text-slate-300 {
  --tw-text-opacity: 1;
  color: rgb(203 213 225 / var(--tw-text-opacity, 1));
}
.text-slate-400 {
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}
.text-violet-200 {
  --tw-text-opacity: 1;
  color: rgb(221 214 254 / var(--tw-text-opacity, 1));
}
.text-violet-300 {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity, 1));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.opacity-0 {
  opacity: 0;
}
.opacity-100 {
  opacity: 1;
}
.opacity-70 {
  opacity: 0.7;
}
.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-2xl {
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.outline {
  outline-style: solid;
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur {
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

.player-game-shell {
    padding-bottom: 2rem;
}

.mobile-bet-board {
    display: grid;
    gap: 1rem;
}

.bet-board-group {
    overflow: hidden;
    padding: 0.75rem;
    border: 1px solid rgb(255 255 255 / 12%);
    border-radius: 1.5rem;
    background: rgb(15 23 42 / 76%);
    box-shadow: 0 1rem 2.5rem rgb(0 0 0 / 24%);
}

.bet-board-group__heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.2rem 0.35rem 0.7rem;
}

.bet-board-group__heading span {
    color: #fff;
    font-size: 0.8rem;
    font-weight: 1000;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.bet-board-group__heading small {
    color: #94a3b8;
    font-size: 0.68rem;
    text-align: right;
}

.bet-board-grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.bet-board-tile-shell {
    min-width: 0;
}

.bet-board-tile {
    position: relative;
    display: grid;
    width: 100%;
    min-height: 8.4rem;
    place-content: center;
    gap: 0.15rem;
    overflow: hidden;
    padding: 1rem 0.45rem;
    border: 2px solid rgb(255 255 255 / 22%);
    border-radius: 1.15rem;
    color: #082f49;
    background: linear-gradient(145deg, #cffafe, #67e8f9);
    box-shadow: inset 0 0 1.6rem rgb(255 255 255 / 28%);
    text-align: center;
    touch-action: manipulation;
    transition: transform 150ms ease, border-color 150ms ease, filter 150ms ease;
}

.bet-board-tile:active,
.bet-board-tile--drop-active {
    border-color: #fff7d6;
    filter: brightness(1.18);
    transform: scale(0.97);
}

.bet-board-tile--two { color: #500724; background: linear-gradient(145deg, #fce7f3, #f9a8d4); }
.bet-board-tile--five { color: #2e1065; background: linear-gradient(145deg, #ede9fe, #c4b5fd); }
.bet-board-tile--ten { color: #422006; background: linear-gradient(145deg, #fef3c7, #fbbf24); }
.bet-board-tile--coinflip { color: #083344; background: linear-gradient(145deg, #a5f3fc, #22d3ee); }
.bet-board-tile--cashhunt { color: #4c0519; background: linear-gradient(145deg, #fecdd3, #fb7185); }
.bet-board-tile--triplewheel { color: #fff; background: linear-gradient(145deg, #f472b6, #9333ea); }
.bet-board-tile--pachinko { color: #1a2e05; background: linear-gradient(145deg, #d9f99d, #84cc16); }

.bet-board-tile--locked {
    filter: saturate(0.72);
}

.bet-board-tile--maxed {
    cursor: not-allowed;
    filter: saturate(0.72);
}

.bet-board-tile__icon {
    font-size: clamp(1.8rem, 8vw, 2.7rem);
    font-weight: 1000;
    line-height: 1;
}

.bet-board-tile strong {
    font-size: clamp(0.84rem, 3.5vw, 1.05rem);
    font-weight: 1000;
    line-height: 1.05;
    text-transform: uppercase;
}

.bet-board-tile__hint {
    margin-top: 0.2rem;
    font-size: 0.62rem;
    font-weight: 800;
    opacity: 0.68;
    text-transform: uppercase;
}

.bet-board-all {
    position: absolute;
    z-index: 5;
    top: 50%;
    left: 50%;
    display: grid;
    width: 4.4rem;
    aspect-ratio: 1;
    place-content: center;
    border: 0.3rem double #fde68a;
    border-radius: 9999px;
    color: #fff7d6;
    background: radial-gradient(circle at 35% 25%, #475569, #020617 72%);
    box-shadow: 0 0 0 0.2rem rgb(2 6 23 / 70%), 0 0 1.2rem rgb(250 204 21 / 52%);
    transform: translate(-50%, -50%);
    touch-action: manipulation;
}

.bet-board-all:active,
.bet-board-all--drop-active {
    transform: translate(-50%, -50%) scale(0.92);
}

.bet-board-all span {
    font-size: 1.1rem;
    font-weight: 1000;
    line-height: 1;
}

.bet-board-all small {
    margin-top: 0.1rem;
    font-size: 0.54rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.placed-chip {
    position: absolute;
    z-index: 4;
    right: 0.55rem;
    bottom: 0.5rem;
    display: grid;
    width: 2.5rem;
    aspect-ratio: 1;
    place-items: center;
    border: 0.22rem dashed rgb(255 255 255 / 82%);
    border-radius: 9999px;
    color: #111827;
    background: #f8fafc;
    box-shadow: 0 0 0 0.16rem #334155, 0 0.3rem 0.7rem rgb(0 0 0 / 38%);
}

.placed-chip b {
    font-size: 0.72rem;
    font-weight: 1000;
}

.placed-chip[hidden] {
    display: none;
}

.placed-chip[draggable='true'] {
    cursor: grab;
    touch-action: none;
}

.placed-chip[draggable='true']:active {
    cursor: grabbing;
}

.placed-chip--2 { color: #fff; background: #ef4444; }
.placed-chip--5 { color: #fff; background: #2563eb; }
.placed-chip--10 { color: #052e16; background: #4ade80; }
.placed-chip--25 { color: #fff; background: #a855f7; }
.placed-chip--50 { color: #fde68a; background: #111827; }
.placed-chip--100 { color: #082f49; background: #22d3ee; }
.placed-chip--250 { color: #fff; background: #ea580c; }
.placed-chip--500 { color: #fef3c7; background: #7c2d12; }

.triple-choice {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(8rem, 0.8fr);
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid rgb(217 70 239 / 34%);
    border-radius: 1.25rem;
    background: rgb(126 34 206 / 18%);
}

.triple-choice.hidden {
    display: none;
}

.triple-choice strong,
.triple-choice small {
    display: block;
}

.triple-choice small {
    margin-top: 0.2rem;
    color: #cbd5e1;
    font-size: 0.72rem;
}

.chip-tray {
    position: sticky;
    z-index: 18;
    bottom: 0.5rem;
    display: grid;
    gap: 0.8rem;
    padding: 0.85rem;
    border: 1px solid rgb(250 204 21 / 34%);
    border-radius: 1.5rem;
    background: rgb(2 6 23 / 94%);
    box-shadow: 0 -0.75rem 2.5rem rgb(2 6 23 / 72%), 0 0 1.4rem rgb(250 204 21 / 12%);
    backdrop-filter: blur(1rem);
}

.chip-tray::after {
    position: absolute;
    z-index: 20;
    display: grid;
    inset: 0.35rem;
    place-items: center;
    padding: 1rem;
    border: 0.16rem dashed #fb7185;
    border-radius: 1.2rem;
    color: #fecdd3;
    background: rgb(76 5 25 / 94%);
    content: 'Laat hier los om de inzet te verwijderen';
    font-size: 0.8rem;
    font-weight: 1000;
    letter-spacing: 0.08em;
    opacity: 0;
    pointer-events: none;
    text-align: center;
    text-transform: uppercase;
    transform: scale(0.97);
    transition: opacity 140ms ease, transform 140ms ease;
}

.chip-tray--remove-ready::after {
    opacity: 0.86;
}

.chip-tray--remove-hover::after {
    opacity: 1;
    transform: scale(1);
}

.chip-tray__heading,
.chip-tray__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
}

.chip-tray__heading span {
    font-size: 0.7rem;
    font-weight: 1000;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.chip-tray__heading strong {
    color: #fde68a;
    font-size: 0.78rem;
}

.chip-tray__chips {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.35rem;
}

.chip-tray__repeat {
    display: inline-flex;
    min-height: 2.85rem;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    border: 1px solid rgb(103 232 249 / 34%);
    border-radius: 0.9rem;
    color: #cffafe;
    background: rgb(8 145 178 / 14%);
    font-size: 0.72rem;
    font-weight: 1000;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    touch-action: manipulation;
}

.chip-tray__repeat span {
    color: #67e8f9;
    font-size: 1.2rem;
    line-height: 1;
}

.chip-tray__repeat:disabled {
    cursor: not-allowed;
    filter: grayscale(0.8);
    opacity: 0.42;
}

.chip-tray__repeat--action {
    flex: 1;
}

.bet-chip {
    display: grid;
    width: 100%;
    max-width: 4rem;
    aspect-ratio: 1;
    place-items: center;
    justify-self: center;
    border: 0.25rem dashed rgb(255 255 255 / 86%);
    border-radius: 9999px;
    color: #111827;
    background: #f8fafc;
    box-shadow: 0 0 0 0.16rem #64748b, 0 0.3rem 0.7rem rgb(0 0 0 / 42%);
    font-size: clamp(0.63rem, 3vw, 0.9rem);
    font-weight: 1000;
    touch-action: none;
    transition: transform 160ms ease, filter 160ms ease;
}

.bet-chip--2 { color: #fff; background: #ef4444; box-shadow: 0 0 0 0.16rem #7f1d1d, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }
.bet-chip--5 { color: #fff; background: #2563eb; box-shadow: 0 0 0 0.16rem #1e3a8a, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }
.bet-chip--10 { color: #052e16; background: #4ade80; box-shadow: 0 0 0 0.16rem #166534, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }
.bet-chip--25 { color: #fff; background: #a855f7; box-shadow: 0 0 0 0.16rem #6b21a8, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }
.bet-chip--50 { color: #fde68a; background: #111827; box-shadow: 0 0 0 0.16rem #f59e0b, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }
.bet-chip--100 { color: #082f49; background: #22d3ee; box-shadow: 0 0 0 0.16rem #155e75, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }
.bet-chip--250 { color: #fff; background: #ea580c; box-shadow: 0 0 0 0.16rem #7c2d12, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }
.bet-chip--500 { color: #fef3c7; background: #7c2d12; box-shadow: 0 0 0 0.16rem #fbbf24, 0 0.3rem 0.7rem rgb(0 0 0 / 42%); }

.bet-chip--selected {
    filter: brightness(1.18);
    transform: translateY(-0.25rem) scale(1.08);
}

.bet-chip-drag-ghost {
    position: fixed;
    z-index: 100;
    width: 4rem;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(1.08);
}

.placed-chip-drag-ghost {
    position: fixed;
    z-index: 100;
    right: auto;
    bottom: auto;
    width: 3rem;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(1.08);
}

.chip-tray__message {
    color: #94a3b8;
    font-size: 0.72rem;
    text-align: center;
}

.chip-tray__message--error {
    color: #fda4af;
}

.player-result {
    display: grid;
    gap: 1rem;
}

.player-result-phase,
.player-round-summary {
    padding: 1.25rem;
    border: 1px solid rgb(255 255 255 / 12%);
    border-radius: 1.5rem;
    background: rgb(15 23 42 / 76%);
    box-shadow: 0 1rem 2.5rem rgb(0 0 0 / 28%);
}

.player-result-top-slot {
    color: #422006;
    background: linear-gradient(135deg, #fef3c7, #facc15);
}

.player-result-top-slot p,
.player-wheel-result__main > p {
    font-size: 0.65rem;
    font-weight: 1000;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.player-result-top-slot > div:not(.top-slot-machine) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.5rem;
}

.player-result-top-slot strong {
    font-size: clamp(1.5rem, 8vw, 2.8rem);
    font-weight: 1000;
    text-transform: uppercase;
}

.player-result-top-slot b {
    padding: 0.35rem 0.65rem;
    border-radius: 0.65rem;
    color: #fef08a;
    background: #7e22ce;
    font-size: 1.4rem;
}

.player-wheel-result {
    display: grid;
    place-items: center;
    min-height: 20rem;
    text-align: center;
    background: radial-gradient(circle at 50% 35%, rgb(56 189 248 / 24%), transparent 55%), rgb(15 23 42 / 88%);
}

.player-wheel-result__main {
    display: grid;
    width: 100%;
    min-height: 17.5rem;
    place-items: center;
}

.player-wheel-result__badge {
    display: grid;
    width: 8rem;
    aspect-ratio: 1;
    place-items: center;
    margin: 1.2rem auto;
    border: 0.45rem double #fde68a;
    border-radius: 9999px;
    color: #111827;
    background: #a9d9e2;
    box-shadow: 0 0 2.5rem rgb(250 204 21 / 42%);
    font-size: 2.5rem;
    font-weight: 1000;
}

.player-wheel-result__waiting {
    display: none;
    margin: 4rem auto;
    color: #bae6fd;
    font-size: clamp(1.4rem, 7vw, 2.4rem);
    font-weight: 1000;
    text-shadow: 0 0 1.2rem rgb(56 189 248 / 70%);
    text-transform: uppercase;
}

.player-wheel-result__badge--two { background: #f8ced8; }
.player-wheel-result__badge--five { background: #b4a7e4; }
.player-wheel-result__badge--ten { background: #ffc21c; }
.player-wheel-result__badge--coinflip { background: #22d3ee; }
.player-wheel-result__badge--cashhunt { background: #fb7185; }
.player-wheel-result__badge--triplewheel { color: #fff; background: #d946ef; }
.player-wheel-result__badge--pachinko { background: #84cc16; }

.player-wheel-result h2,
.player-minigame h3 {
    font-size: clamp(1.7rem, 8vw, 3rem);
    font-weight: 1000;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
}

.player-minigame {
    display: none;
    width: 100%;
    overflow: hidden;
    text-align: center;
}

.player-result--minigame-active:not(.player-result--sequencing) [data-result-wheel] { min-height: 0; }
.player-result--minigame-active:not(.player-result--sequencing) [data-result-wheel-main] { display: none; }
.player-result--minigame-active:not(.player-result--sequencing) [data-result-minigame] { display: block; }

.coin-flip-stage {
    display: grid;
    min-height: 14rem;
    place-items: center;
    perspective: 900px;
}

.coin-flip-coin {
    display: grid;
    width: 8rem;
    aspect-ratio: 1;
    place-items: center;
    border: 0.65rem double #fef3c7;
    border-radius: 9999px;
    color: #422006;
    background: radial-gradient(circle at 35% 25%, #fef08a, #f59e0b 68%);
    box-shadow: 0 0 2.5rem rgb(250 204 21 / 54%);
    font-size: 2.2rem;
    font-weight: 1000;
}

.coin-flip-result {
    display: grid;
    gap: 1.25rem;
    margin-top: 1rem;
    place-items: center;
}

.coin-flip-result__values {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.coin-flip-result__value {
    display: grid;
    gap: 0.15rem;
    padding: 1rem 0.5rem;
    border: 0.18rem solid rgb(255 255 255 / 38%);
    border-radius: 1.25rem;
    color: #fff;
    box-shadow: inset 0 0 1.5rem rgb(255 255 255 / 16%);
    text-transform: uppercase;
}

.coin-flip-result__value--red { background: linear-gradient(145deg, #fb7185, #9f1239); }
.coin-flip-result__value--blue { background: linear-gradient(145deg, #38bdf8, #075985); }

.coin-flip-result__value strong {
    font-size: clamp(1.8rem, 10vw, 3.2rem);
    line-height: 1;
}

.coin-flip-result__value--winner {
    border-color: #fde68a;
    box-shadow: 0 0 2rem rgb(250 204 21 / 70%), inset 0 0 1.5rem rgb(255 255 255 / 24%);
    transform: scale(1.06);
}

.coin-flip-result__top-slot {
    width: -moz-fit-content;
    width: fit-content;
    margin: 0.65rem auto 0;
    padding: 0.3rem 0.65rem;
    border: 1px solid rgb(250 204 21 / 48%);
    border-radius: 9999px;
    color: #fef08a;
    background: rgb(113 63 18 / 48%);
    font-size: 0.72rem;
    font-weight: 900;
}

.coin-flip-result__coin {
    display: grid;
    width: 6rem;
    aspect-ratio: 1;
    place-items: center;
    border: 0.45rem double #fef3c7;
    border-radius: 9999px;
    color: #fff;
    box-shadow: 0 0 2rem rgb(250 204 21 / 52%);
    font-size: 1.25rem;
    font-weight: 1000;
    text-transform: uppercase;
}

.coin-flip-result__coin--red { background: radial-gradient(circle at 35% 25%, #fb7185, #9f1239 70%); }
.coin-flip-result__coin--blue { background: radial-gradient(circle at 35% 25%, #7dd3fc, #075985 70%); }

.coin-flip-show {
    position: fixed;
    z-index: 90;
    inset: 0;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: clamp(1.5rem, 5vw, 3rem);
    overflow: hidden;
    padding: 1.25rem;
    color: #fff;
    background:
        radial-gradient(circle at 50% 35%, rgb(147 51 234 / 44%), transparent 38%),
        rgb(2 6 23 / 94%);
    backdrop-filter: blur(0.65rem);
    opacity: 1;
    transition: opacity 300ms ease;
}

.coin-flip-show--leaving { opacity: 0; }

.coin-flip-show h2 {
    max-width: 60rem;
    color: #fef3c7;
    font-size: clamp(2rem, 8vw, 5rem);
    font-weight: 1000;
    line-height: 0.95;
    text-align: center;
    text-shadow: 0 0 1.5rem rgb(250 204 21 / 55%);
    text-transform: uppercase;
}

.coin-flip-show__values {
    display: grid;
    width: min(100%, 54rem);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(0.75rem, 3vw, 2rem);
}

.coin-flip-show__value {
    display: grid;
    min-height: clamp(8rem, 25vw, 13rem);
    align-content: center;
    gap: 0.5rem;
    padding: clamp(1rem, 4vw, 2rem);
    border: 0.22rem solid rgb(255 255 255 / 40%);
    border-radius: clamp(1.25rem, 4vw, 2.5rem);
    box-shadow: inset 0 0 2.5rem rgb(255 255 255 / 15%), 0 1.5rem 3rem rgb(0 0 0 / 35%);
    text-align: center;
    text-transform: uppercase;
}

.coin-flip-show__value--red { background: linear-gradient(145deg, #fb7185, #9f1239 72%); }
.coin-flip-show__value--blue { background: linear-gradient(145deg, #38bdf8, #075985 72%); }

.coin-flip-show__value span {
    font-size: clamp(0.9rem, 3vw, 1.35rem);
    font-weight: 900;
    letter-spacing: 0.14em;
}

.coin-flip-show__value strong {
    font-size: clamp(1.55rem, 6vw, 3.5rem);
    font-weight: 1000;
    line-height: 1;
}

.coin-flip-show__value--locked {
    animation: coin-flip-value-lock 550ms cubic-bezier(.2, .9, .25, 1.25);
    border-color: #fde68a;
}

.coin-flip-show__value--winner {
    border-color: #fef08a;
    box-shadow: 0 0 3rem rgb(250 204 21 / 80%), inset 0 0 2.5rem rgb(255 255 255 / 23%);
    transform: scale(1.08);
}

.coin-flip-show__coin-stage {
    --coin-camera-tilt: 58deg;
    position: relative;
    width: min(100%, 32rem);
    height: clamp(14rem, 36vh, 22rem);
    perspective: 900px;
    perspective-origin: 50% 20%;
    transform-style: preserve-3d;
}

.coin-flip-show__coin-ground {
    position: absolute;
    z-index: 0;
    right: 3%;
    bottom: -1.5rem;
    left: 3%;
    height: clamp(8rem, 24vh, 13rem);
    border: 1px solid rgb(250 204 21 / 18%);
    border-radius: 50%;
    background:
        radial-gradient(ellipse at center, rgb(30 41 59 / 88%), rgb(15 23 42 / 72%) 56%, rgb(2 6 23 / 12%) 72%),
        repeating-radial-gradient(ellipse at center, transparent 0 1.7rem, rgb(250 204 21 / 7%) 1.75rem 1.82rem);
    box-shadow: inset 0 0 3rem rgb(2 6 23 / 72%), 0 1.8rem 2.5rem rgb(0 0 0 / 42%);
    transform: rotateX(var(--coin-camera-tilt));
    transform-origin: 50% 100%;
}

.coin-flip-show__coin-shadow {
    position: absolute;
    z-index: 1;
    bottom: 0.45rem;
    left: 50%;
    width: clamp(6rem, 20vw, 10rem);
    height: clamp(0.8rem, 2.5vw, 1.35rem);
    border-radius: 50%;
    background: rgb(0 0 0 / 68%);
    filter: blur(0.55rem);
    opacity: 0.5;
    transform: translateX(-50%);
    will-change: opacity, transform;
}

.coin-flip-show__coin-flight {
    position: absolute;
    z-index: 2;
    bottom: 1.25rem;
    left: 50%;
    width: clamp(7rem, 22vw, 11rem);
    aspect-ratio: 1;
    transform: translateX(-50%);
    transform-style: preserve-3d;
    will-change: transform;
}

.coin-flip-show__coin {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    will-change: transform;
}

.coin-flip-show__edge,
.coin-flip-show__edge i {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    transform-style: preserve-3d;
}

.coin-flip-show__edge {
    transform: translateZ(0);
}

.coin-flip-show__edge i {
    border: 0.1rem solid rgb(113 63 18 / 72%);
    background: linear-gradient(90deg, #713f12, #f59e0b 16%, #fef3c7 48%, #d97706 78%, #713f12);
    box-shadow: 0 0 0 0.06rem rgb(66 32 6 / 58%);
    transform: translateZ(var(--coin-edge-depth));
}

.coin-flip-show__coin--landed .coin-flip-show__edge i {
    box-shadow: 0 0 0 0.06rem rgb(66 32 6 / 58%), 0 0 1rem rgb(250 204 21 / 34%);
}

.coin-flip-show__coin--landed .coin-flip-show__face {
    box-shadow:
        0 0 0 0.22rem #ca8a04,
        0 0 1.2rem rgb(250 204 21 / 78%),
        inset 0 0 0 0.14rem rgb(120 53 15 / 58%),
        inset 0 0 2rem rgb(255 255 255 / 26%);
}

.coin-flip-show__face {
    position: absolute;
    z-index: 2;
    inset: 0.28rem;
    display: grid;
    place-items: center;
    border: clamp(0.32rem, 1vw, 0.5rem) double #fef3c7;
    border-radius: 9999px;
    backface-visibility: hidden;
    box-shadow:
        0 0 0 0.22rem #ca8a04,
        inset 0 0 0 0.14rem rgb(120 53 15 / 58%),
        inset 0 0 2rem rgb(255 255 255 / 26%);
}

.coin-flip-show__face--red {
    background:
        radial-gradient(circle at 30% 22%, rgb(255 255 255 / 48%), transparent 24%),
        radial-gradient(circle, transparent 52%, rgb(69 10 10 / 28%) 53% 59%, transparent 60%),
        radial-gradient(circle at 35% 28%, #fb7185, #9f1239 72%);
    transform: translateZ(0.52rem);
}

.coin-flip-show__face--blue {
    background:
        radial-gradient(circle at 30% 22%, rgb(255 255 255 / 48%), transparent 24%),
        radial-gradient(circle, transparent 52%, rgb(8 47 73 / 32%) 53% 59%, transparent 60%),
        radial-gradient(circle at 35% 28%, #7dd3fc, #075985 72%);
    transform: rotateX(180deg) translateZ(0.52rem);
}

@keyframes coin-flip-value-lock {
    0% { filter: brightness(1); transform: scale(1); }
    55% { filter: brightness(1.5); transform: scale(1.08); }
    100% { filter: brightness(1); transform: scale(1); }
}

.feature-respin-show {
    position: absolute;
    z-index: 30;
    inset: 0;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 1rem;
    overflow: hidden;
    padding: 1.5rem;
    color: #fff;
    background:
        radial-gradient(circle at center, rgb(250 204 21 / 44%), transparent 24%),
        radial-gradient(circle at center, #7e22ce 0%, #3b0764 45%, #020617 82%);
    animation: feature-respin-arrive 550ms cubic-bezier(.18, .88, .26, 1.25) both;
    isolation: isolate;
}

.feature-respin-show--leaving {
    animation: feature-respin-leave 450ms ease-in both;
}

.feature-respin-show__rays {
    position: absolute;
    z-index: -1;
    width: min(130vw, 90rem);
    aspect-ratio: 1;
    border-radius: 9999px;
    background: repeating-conic-gradient(
        from 0deg,
        rgb(250 204 21 / 42%) 0deg 7deg,
        transparent 7deg 18deg
    );
    -webkit-mask-image: radial-gradient(circle, #000 0 9%, transparent 58%);
            mask-image: radial-gradient(circle, #000 0 9%, transparent 58%);
    animation: feature-respin-rays 5s linear infinite;
}

.feature-respin-show h3 {
    position: relative;
    font-size: clamp(3rem, 12vw, 9rem);
    font-weight: 1000;
    letter-spacing: -0.055em;
    line-height: 0.82;
    text-align: center;
    text-shadow:
        0 0.06em 0 #9f1239,
        0 0 0.18em #facc15,
        0 0 0.65em rgb(250 204 21 / 75%);
    transform: rotate(-2deg);
    animation: feature-respin-title 750ms cubic-bezier(.16, 1, .3, 1) both, feature-respin-pulse 650ms 750ms ease-in-out infinite alternate;
}

.feature-respin-show p {
    max-width: 42rem;
    font-size: clamp(0.8rem, 2.5vw, 1.35rem);
    font-weight: 1000;
    letter-spacing: 0.13em;
    text-align: center;
    text-transform: uppercase;
    animation: feature-respin-copy 600ms 400ms ease-out both;
}

.feature-respin-show__sparks {
    position: absolute;
    top: 50%;
    left: 50%;
}

.feature-respin-show__sparks i {
    position: absolute;
    width: clamp(0.45rem, 1.2vw, 0.85rem);
    height: clamp(1.2rem, 3vw, 2.4rem);
    border-radius: 9999px;
    background: linear-gradient(#fff, #facc15 45%, #f97316);
    box-shadow: 0 0 1rem #facc15;
    opacity: 0;
    transform-origin: center bottom;
    animation: feature-respin-spark 1.25s var(--spark-delay) ease-out infinite;
}

@keyframes feature-respin-arrive {
    0% { filter: brightness(2.5); opacity: 0; transform: scale(1.25); }
    55% { filter: brightness(1.4); opacity: 1; transform: scale(0.96); }
    100% { filter: brightness(1); opacity: 1; transform: scale(1); }
}

@keyframes feature-respin-leave {
    to { filter: blur(0.8rem) brightness(2); opacity: 0; transform: scale(1.12); }
}

@keyframes feature-respin-rays {
    to { transform: rotate(360deg); }
}

@keyframes feature-respin-title {
    0% { filter: blur(1rem); opacity: 0; transform: rotate(-8deg) scale(0.25); }
    60% { filter: blur(0); opacity: 1; transform: rotate(2deg) scale(1.18); }
    100% { transform: rotate(-2deg) scale(1); }
}

@keyframes feature-respin-pulse {
    to { filter: brightness(1.35); transform: rotate(2deg) scale(1.06); }
}

@keyframes feature-respin-copy {
    from { opacity: 0; transform: translateY(2rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes feature-respin-spark {
    0% { opacity: 0; transform: rotate(var(--spark-angle)) translateY(-2rem) scale(0.2); }
    18% { opacity: 1; }
    100% { opacity: 0; transform: rotate(var(--spark-angle)) translateY(calc(var(--spark-distance) * -1)) scale(1); }
}

.pachinko-stage {
    position: relative;
    display: grid;
    width: min(100%, 24rem);
    height: 17rem;
    grid-template-columns: repeat(5, 1fr);
    place-items: center;
    margin: 1rem auto;
    overflow: hidden;
    border: 1px solid rgb(163 230 53 / 40%);
    border-radius: 1.5rem;
    background: linear-gradient(#052e16, #14532d);
}

.pachinko-peg {
    width: 0.65rem;
    aspect-ratio: 1;
    border-radius: 9999px;
    background: #fef08a;
    box-shadow: 0 0 0.5rem rgb(250 204 21 / 75%);
}

.pachinko-ball {
    position: absolute;
    z-index: 3;
    top: 0.8rem;
    left: calc(50% - 0.7rem);
    width: 1.4rem;
    aspect-ratio: 1;
    border-radius: 9999px;
    background: #fff;
    box-shadow: 0 0 1rem #fff;
}

.pachinko-bucket {
    position: absolute;
    right: 28%;
    bottom: 0.4rem;
    left: 28%;
    padding: 0.45rem;
    border-radius: 0.6rem 0.6rem 0 0;
    color: #1a2e05;
    background: #bef264;
    font-size: 1.2rem;
    font-weight: 1000;
}

.pachinko-show {
    position: fixed;
    z-index: 90;
    inset: 0;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.65rem;
    padding: 1rem;
    color: #fff;
    background:
        radial-gradient(circle at 50% 38%, rgb(132 204 22 / 30%), transparent 38%),
        rgb(2 6 23 / 96%);
    backdrop-filter: blur(0.65rem);
    opacity: 1;
    transition: opacity 350ms ease;
}

.pachinko-show--leaving { opacity: 0; }

.pachinko-show h2 {
    color: #ecfccb;
    font-size: clamp(2rem, 6vw, 4.5rem);
    font-weight: 1000;
    line-height: 1;
    text-align: center;
    text-shadow: 0 0 1.8rem rgb(163 230 53 / 58%);
    text-transform: uppercase;
}

.pachinko-show > p {
    color: #d9f99d;
    font-size: clamp(0.9rem, 2vw, 1.25rem);
    font-weight: 800;
    text-align: center;
}

.pachinko-show__board {
    position: relative;
    width: min(58vw, 49rem);
    height: min(72vh, 48rem);
    min-height: 30rem;
    overflow: hidden;
    border: 0.2rem solid rgb(190 242 100 / 45%);
    border-radius: clamp(1.25rem, 3vw, 2.5rem);
    background:
        linear-gradient(90deg, transparent 49.8%, rgb(255 255 255 / 5%) 50%, transparent 50.2%),
        linear-gradient(155deg, #052e16, #14532d 55%, #052e16);
    box-shadow: inset 0 0 5rem rgb(0 0 0 / 46%), 0 2rem 5rem rgb(0 0 0 / 45%);
}

.pachinko-show__peg {
    position: absolute;
    z-index: 2;
    top: var(--peg-top);
    left: var(--peg-x);
    width: clamp(0.35rem, 0.8vw, 0.7rem);
    aspect-ratio: 1;
    border-radius: 9999px;
    background: #fef9c3;
    box-shadow: 0 0 0.75rem rgb(250 204 21 / 78%);
    transform: translate(-50%, -50%);
}

.pachinko-show__start {
    position: absolute;
    z-index: 4;
    top: 1.2%;
    left: var(--start-position);
    width: clamp(1.2rem, 2.8vw, 2.2rem);
    height: clamp(0.6rem, 1.3vw, 1rem);
    border-radius: 0.5rem 0.5rem 9999px 9999px;
    background: #fef08a;
    box-shadow: 0 0 1.3rem #facc15;
    transform: translateX(-50%);
    opacity: 0;
}

.pachinko-show__board--selecting .pachinko-show__start {
    opacity: 1;
}

.pachinko-show__start--tick { animation: pachinko-start-tick 180ms ease-out; }

.pachinko-show__board--start-locked .pachinko-show__start {
    opacity: 1;
    animation: pachinko-start-lock 600ms cubic-bezier(.2, .9, .25, 1.3);
}

.pachinko-show__ball {
    position: absolute;
    z-index: 6;
    top: 0;
    left: 0;
    width: clamp(1rem, 2vw, 1.8rem);
    aspect-ratio: 1;
    border: 0.18rem solid #fefce8;
    border-radius: 9999px;
    background: radial-gradient(circle at 32% 25%, #fff, #cbd5e1 62%, #475569);
    box-shadow: 0 0 1.2rem rgb(255 255 255 / 90%);
    transform: translate3d(0, 0, 0);
    opacity: 0;
    will-change: transform;
}

.pachinko-show__ball--dropping { opacity: 1; }

.pachinko-show__slots {
    position: absolute;
    z-index: 3;
    right: 0.8%;
    bottom: 1.5%;
    left: 0.8%;
    display: grid;
    height: 16%;
    grid-template-columns: repeat(15, minmax(0, 1fr));
    gap: 0.16rem;
}

.pachinko-show__slot {
    display: grid;
    min-width: 0;
    place-items: center;
    padding: 0.2rem 0.05rem;
    border: 1px solid rgb(255 255 255 / 32%);
    border-radius: 0.4rem 0.4rem 0.85rem 0.85rem;
    background: linear-gradient(#facc15, #92400e);
    box-shadow: inset 0 0 0.85rem rgb(255 255 255 / 18%);
    font-size: clamp(0.46rem, 0.72vw, 0.72rem);
    font-weight: 1000;
    line-height: 0.95;
    text-align: center;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(120%);
    animation: pachinko-slot-reveal 550ms var(--slot-delay) cubic-bezier(.2, .9, .25, 1.15) forwards;
}

.pachinko-show__slot--beer { background: linear-gradient(#fb923c, #9a3412); }
.pachinko-show__slot--booze { background: linear-gradient(#c084fc, #6b21a8); }

.pachinko-show__slot--winner {
    z-index: 4;
    border-color: #fff;
    box-shadow: 0 0 2.4rem #fef08a, inset 0 0 1rem rgb(255 255 255 / 35%);
    animation: pachinko-slot-winner 700ms ease-in-out infinite alternate;
}

@keyframes pachinko-slot-reveal {
    to { opacity: 1; transform: translateY(0); }
}

@keyframes pachinko-start-tick {
    0% { filter: brightness(2.2); transform: translateX(-50%) scale(1.55); }
    100% { filter: brightness(1); transform: translateX(-50%) scale(1); }
}

@keyframes pachinko-start-lock {
    0% { filter: brightness(1); transform: translateX(-50%) scale(1); }
    55% { filter: brightness(1.8); transform: translateX(-50%) scale(1.7); }
    100% { filter: brightness(1); transform: translateX(-50%) scale(1); }
}

@keyframes pachinko-slot-winner {
    from { filter: brightness(1); transform: translateY(0) scale(1); }
    to { filter: brightness(1.45); transform: translateY(-0.5rem) scale(1.12); }
}

.cash-hunt-board {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 1.25rem;
}

.cash-hunt-icon {
    display: grid;
    width: 100%;
    aspect-ratio: 1;
    place-items: center;
    border: 0.18rem solid rgb(255 255 255 / 42%);
    border-radius: 1.2rem;
    color: #fff;
    background: linear-gradient(145deg, #0891b2, #164e63);
    box-shadow: inset 0 0 1.2rem rgb(255 255 255 / 18%);
    font-size: 2rem;
    transition: transform 160ms ease, filter 160ms ease;
}

.cash-hunt-icon--1 { background: linear-gradient(145deg, #ec4899, #9d174d); }
.cash-hunt-icon--2 { background: linear-gradient(145deg, #f59e0b, #92400e); }
.cash-hunt-icon--3 { background: linear-gradient(145deg, #8b5cf6, #5b21b6); }
.cash-hunt-icon--4 { background: linear-gradient(145deg, #84cc16, #3f6212); }
.cash-hunt-icon--5 { background: linear-gradient(145deg, #f43f5e, #9f1239); }
.cash-hunt-icon:active { filter: brightness(1.2); transform: scale(0.94); }
.cash-hunt-icon--spectator { opacity: 0.82; }

.cash-hunt-reveal {
    display: grid;
    gap: 0.5rem;
    margin-top: 2rem;
    padding: 1.5rem;
    border: 1px solid rgb(250 204 21 / 38%);
    border-radius: 1.25rem;
    color: #fef3c7;
    background: rgb(120 53 15 / 36%);
}

.cash-hunt-reveal span {
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.cash-hunt-reveal strong {
    font-size: 1.2rem;
}

.player-result--sequencing .player-result-phase,
.player-result--sequencing .player-round-summary {
    display: none;
}

.player-result--show-top-slot [data-result-top-slot],
.player-result--show-wheel [data-result-wheel],
.player-result--show-minigame [data-result-minigame],
.player-result--show-summary [data-result-summary] {
    display: block;
    animation: player-phase-arrive 500ms cubic-bezier(.2, .8, .2, 1);
}

.player-result--show-minigame [data-result-wheel] { display: grid; }
.player-result--show-minigame [data-result-wheel-main] { display: none; }

.player-result--show-wheel [data-result-wheel] {
    display: grid;
}

.player-result--sequencing.player-result--show-wheel:not(.player-result--wheel-landed) .player-wheel-result__waiting {
    display: block;
    animation: music-pulse 900ms ease-in-out infinite;
}

.player-result--sequencing.player-result--show-wheel:not(.player-result--wheel-landed) .player-wheel-result__badge,
.player-result--sequencing.player-result--show-wheel:not(.player-result--wheel-landed) .player-wheel-result h2 {
    display: none;
}

.player-result--wheel-landed .player-wheel-result__badge,
.player-result--wheel-landed .player-wheel-result h2 {
    animation: player-phase-arrive 500ms cubic-bezier(.2, .8, .2, 1);
}

.player-result--show-top-slot [data-result-top-slot] {
    animation: top-slot-player-reveal 3.2s ease-in-out both;
}

.player-result--top-slot-locked [data-result-top-slot] {
    box-shadow: 0 0 2.5rem rgb(250 204 21 / 58%);
    filter: brightness(1.18);
}

.player-result--show-minigame .coin-flip-coin {
    animation: coin-flip-result 3.6s cubic-bezier(.2, .8, .2, 1) both;
}

.player-result--show-minigame .pachinko-ball {
    animation: pachinko-drop 4.4s cubic-bezier(.35, 0, .65, 1) both;
}

.player-result--show-minigame .cash-hunt-board > * {
    animation: cash-hunt-icon-arrive 900ms cubic-bezier(.2, .8, .2, 1) both;
    animation-delay: 0ms;
}

.player-result--show-minigame .cash-hunt-board > :nth-child(2) { animation-delay: 70ms; }
.player-result--show-minigame .cash-hunt-board > :nth-child(3) { animation-delay: 140ms; }
.player-result--show-minigame .cash-hunt-board > :nth-child(4) { animation-delay: 210ms; }
.player-result--show-minigame .cash-hunt-board > :nth-child(5) { animation-delay: 280ms; }
.player-result--show-minigame .cash-hunt-board > :nth-child(6) { animation-delay: 350ms; }
.player-result--show-minigame .cash-hunt-board > :nth-child(7) { animation-delay: 420ms; }
.player-result--show-minigame .cash-hunt-board > :nth-child(8) { animation-delay: 490ms; }
.player-result--show-minigame .cash-hunt-board > :nth-child(9) { animation-delay: 560ms; }

@keyframes player-phase-arrive {
    from { opacity: 0; transform: scale(0.94); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes top-slot-player-reveal {
    0% { filter: brightness(0.75); opacity: 0; transform: scale(0.86); }
    35% { filter: brightness(1.5); opacity: 1; transform: scale(1.04); }
    100% { filter: brightness(1); opacity: 1; transform: scale(1); }
}

@keyframes coin-flip-result {
    0% { transform: translateY(4rem) rotateX(0deg) scale(0.72); }
    45% { transform: translateY(-3rem) rotateX(1260deg) scale(1.12); }
    100% { transform: translateY(0) rotateX(2160deg) scale(1); }
}

@keyframes pachinko-drop {
    0% { transform: translate(0, 0); }
    18% { transform: translate(-3.4rem, 2.7rem); }
    36% { transform: translate(2.8rem, 5.2rem); }
    55% { transform: translate(-2rem, 8rem); }
    72% { transform: translate(3rem, 10.8rem); }
    88% { transform: translate(1.2rem, 13rem); }
    100% { transform: translate(1.2rem, 14rem); }
}

@keyframes cash-hunt-icon-arrive {
    0% { filter: brightness(1.8); opacity: 0; transform: rotateY(90deg) scale(0.72); }
    100% { filter: brightness(1); opacity: 1; transform: rotateY(0) scale(1); }
}

.host-game-shell {
    position: relative;
    overflow-x: hidden;
    background:
        linear-gradient(180deg, rgb(2 6 23 / 24%), rgb(2 6 23 / 58%)),
        url(/build/images/breinborrel-stage.51d2cf74.png) center top / cover fixed no-repeat,
        #020617;
}

.host-game-shell::before,
.host-game-shell::after {
    position: fixed;
    z-index: 0;
    right: 0;
    left: 0;
    pointer-events: none;
    content: '';
}

.host-game-shell::before {
    inset: 0;
    background: linear-gradient(90deg, rgb(2 6 23 / 30%), transparent 20% 80%, rgb(2 6 23 / 30%));
}

.host-game-shell::after {
    display: none;
}

.host-game-shell > div {
    position: relative;
    z-index: 1;
}

.host-header {
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px solid rgb(255 255 255 / 12%);
    border-radius: 1.5rem;
    background: rgb(2 6 23 / 70%);
    box-shadow: 0 1rem 3rem rgb(0 0 0 / 26%);
    backdrop-filter: blur(1rem);
}

.host-menu-button {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    gap: 0.7rem;
    padding: 0.7rem 1rem;
    border: 1px solid rgb(103 232 249 / 38%);
    border-radius: 1rem;
    color: #cffafe;
    background: rgb(2 6 23 / 76%);
    font-size: 0.75rem;
    font-weight: 1000;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.host-menu-button > span {
    display: grid;
    gap: 0.2rem;
    width: 1.2rem;
}

.host-menu-button i {
    display: block;
    height: 0.14rem;
    border-radius: 9999px;
    background: currentColor;
}

.host-header__actions {
    display: flex;
    align-items: stretch;
    gap: 0.7rem;
}

.host-menu-backdrop {
    position: fixed;
    z-index: 48;
    inset: 0;
    display: none;
    width: 100%;
    border: 0;
    background: rgb(2 6 23 / 72%);
    backdrop-filter: blur(0.2rem);
}

.host-side-menu {
    position: fixed;
    z-index: 50;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(26rem, 92vw);
    overflow-y: auto;
    padding: 1.2rem;
    border-left: 1px solid rgb(103 232 249 / 28%);
    background: linear-gradient(160deg, #0f172a, #020617 72%);
    box-shadow: -2rem 0 5rem rgb(0 0 0 / 52%);
    transform: translateX(105%);
    transition: transform 320ms cubic-bezier(.2, .8, .2, 1);
}

.host-menu-open .host-side-menu {
    transform: translateX(0);
}

.host-menu-open .host-menu-backdrop {
    display: block;
}

.host-side-menu__header,
.host-player-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.host-side-menu__header {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgb(255 255 255 / 10%);
}

.host-side-menu__header h2 {
    margin-top: 0.2rem;
    font-size: 1.4rem;
    font-weight: 1000;
}

.host-side-menu__header > button {
    display: grid;
    width: 2.8rem;
    aspect-ratio: 1;
    place-items: center;
    border: 1px solid rgb(255 255 255 / 14%);
    border-radius: 0.85rem;
    color: #fff;
    background: rgb(255 255 255 / 8%);
    font-size: 1.8rem;
}

.host-round-controls {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.65rem;
    padding: 0.4rem 0.45rem 0.4rem 0.7rem;
    border: 1px solid rgb(250 204 21 / 34%);
    border-radius: 1rem;
    background:
        radial-gradient(circle at 100% 0%, rgb(250 204 21 / 16%), transparent 50%),
        rgb(120 53 15 / 20%);
    box-shadow: inset 0 0 1.5rem rgb(250 204 21 / 5%);
}

.host-round-controls__heading {
    display: grid;
    gap: 0.15rem;
}

.host-round-controls__heading .eyebrow {
    font-size: 0.5rem;
    letter-spacing: 0.14em;
}

.host-round-controls__heading > span {
    color: #fef3c7;
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}

.host-round-controls > p {
    color: #cbd5e1;
    font-size: 0.68rem;
    white-space: nowrap;
}

.host-round-controls form {
    display: flex;
    flex: 1;
}

.host-round-controls form[hidden] {
    display: none;
}

.host-round-controls__button {
    min-height: 3rem;
    padding: 0.65rem 0.9rem;
    white-space: nowrap;
}

[data-wheel-spin-button]:disabled {
    cursor: not-allowed;
    filter: grayscale(0.75) brightness(0.72);
    opacity: 0.48;
    box-shadow: none;
}

.host-round-controls__notice {
    max-width: 12rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid rgb(34 211 238 / 30%);
    border-radius: 0.85rem;
    color: #cffafe;
    background: rgb(6 182 212 / 10%);
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
}

.host-join-code {
    display: block;
    width: 100%;
    margin-top: 0.75rem;
    padding: 1rem;
    border: 1px solid rgb(250 204 21 / 30%);
    border-radius: 1rem;
    color: #fff;
    background: rgb(120 53 15 / 22%);
    text-align: left;
}

.host-join-code span {
    display: block;
    color: #fde68a;
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.host-join-code strong {
    display: block;
    margin-top: 0.3rem;
    font-size: 2rem;
    letter-spacing: 0.2em;
}

.host-force-spin {
    display: grid;
    gap: 0.8rem;
    margin-top: 1rem;
    padding: 0.9rem;
    border: 1px solid rgb(248 113 113 / 25%);
    border-radius: 1rem;
    background: rgb(127 29 29 / 14%);
}

.host-force-spin h3 {
    margin-top: 0.15rem;
    font-size: 1rem;
    font-weight: 1000;
}

.host-force-spin > div > small,
.host-force-spin__hint {
    display: block;
    margin-top: 0.25rem;
    color: #94a3b8;
    font-size: 0.65rem;
    line-height: 1.35;
}

.host-force-spin__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.host-force-spin__button {
    display: grid;
    width: 100%;
    min-height: 3.4rem;
    grid-template-columns: 2rem minmax(0, 1fr);
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.55rem;
    border: 1px solid rgb(255 255 255 / 14%);
    border-radius: 0.75rem;
    color: #fff;
    background: linear-gradient(145deg, #334155, #0f172a);
    text-align: left;
    transition: filter 140ms ease, transform 140ms ease;
}

.host-force-spin__button:hover:not(:disabled) {
    filter: brightness(1.2);
    transform: translateY(-0.1rem);
}

.host-force-spin__button.is-selected {
    border-color: #fef08a;
    box-shadow: 0 0 0 0.15rem #facc15, 0 0 1.2rem rgb(250 204 21 / 62%);
    filter: brightness(1.2);
    transform: translateY(-0.1rem) scale(1.02);
}

.host-force-spin__button b {
    display: grid;
    width: 2rem;
    aspect-ratio: 1;
    place-items: center;
    border: 1px solid rgb(255 255 255 / 35%);
    border-radius: 9999px;
    background: rgb(2 6 23 / 38%);
    font-size: 0.7rem;
}

.host-force-spin__button span {
    overflow: hidden;
    font-size: 0.68rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.host-force-spin__button--one { background: linear-gradient(145deg, #0891b2, #164e63); }
.host-force-spin__button--two { background: linear-gradient(145deg, #db2777, #831843); }
.host-force-spin__button--five { background: linear-gradient(145deg, #8b5cf6, #4c1d95); }
.host-force-spin__button--ten { color: #422006; background: linear-gradient(145deg, #fde047, #d97706); }
.host-force-spin__button--coinflip { background: linear-gradient(145deg, #06b6d4, #155e75); }
.host-force-spin__button--cashhunt { background: linear-gradient(145deg, #fb7185, #9f1239); }
.host-force-spin__button--triplewheel { background: linear-gradient(145deg, #e879f9, #7e22ce); }
.host-force-spin__button--pachinko { color: #1a2e05; background: linear-gradient(145deg, #bef264, #4d7c0f); }

.host-force-spin__button:disabled {
    cursor: not-allowed;
    filter: grayscale(0.8);
    opacity: 0.38;
}

.host-force-spin__selection {
    display: grid;
    gap: 0.5rem;
    padding: 0.65rem;
    border-radius: 0.75rem;
    color: #fef3c7;
    background: rgb(2 6 23 / 42%);
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1.35;
}

.host-force-spin__selection button {
    justify-self: start;
    color: #fde68a;
    font-size: 0.65rem;
    font-weight: 900;
    text-decoration: underline;
    text-underline-offset: 0.18rem;
}

.host-force-spin__selection button:disabled {
    cursor: default;
    opacity: 0.35;
}

.host-force-spin__top-slot {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: #e0f2fe;
}

.host-force-spin__top-slot:has(input:disabled) {
    cursor: not-allowed;
    opacity: 0.42;
}

.host-force-spin__top-slot input {
    width: 1rem;
    height: 1rem;
    accent-color: #facc15;
}

.host-player-heading {
    margin-top: 1.5rem;
}

.host-player-heading strong {
    display: block;
    margin-top: 0.2rem;
    font-size: 2rem;
}

.host-player-list {
    display: grid;
    gap: 0.6rem;
    margin-top: 0.85rem;
}

.host-player-list > div,
.host-player-list > p {
    padding: 0.85rem;
    border: 1px solid rgb(255 255 255 / 10%);
    border-radius: 1rem;
    background: rgb(15 23 42 / 74%);
}

.host-player-list strong,
.host-player-list small {
    display: block;
}

.host-player-list small {
    margin-top: 0.3rem;
    color: #94a3b8;
    font-size: 0.68rem;
}

.host-player-balance {
    margin-top: 0.7rem;
    border-top: 1px solid rgb(255 255 255 / 8%);
}

.host-player-balance summary {
    padding-top: 0.65rem;
    color: #67e8f9;
    cursor: pointer;
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.host-player-balance form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
    margin-top: 0.7rem;
}

.host-player-balance label > span {
    display: block;
    margin-bottom: 0.3rem;
    color: #94a3b8;
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.host-player-balance select,
.host-player-balance input {
    width: 100%;
    min-height: 2.7rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgb(255 255 255 / 14%);
    border-radius: 0.7rem;
    color: #fff;
    background: rgb(2 6 23 / 82%);
    font-size: 0.75rem;
}

.host-player-balance button {
    grid-column: 1 / -1;
}

.player-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
}

.player-action-card {
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 12%);
    border-radius: 1.2rem;
    background: rgb(15 23 42 / 82%);
    box-shadow: 0 0.75rem 2rem rgb(0 0 0 / 22%);
}

.player-action-card > summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.18rem;
    padding: 0.9rem 1rem;
    cursor: pointer;
    list-style: none;
}

.player-action-card > summary::-webkit-details-marker {
    display: none;
}

.player-action-card > summary::after {
    grid-row: 1 / 3;
    grid-column: 2;
    align-self: center;
    justify-self: end;
    color: #67e8f9;
    content: '+';
    font-size: 1.5rem;
    font-weight: 900;
}

.player-action-card[open] > summary::after {
    content: '−';
}

.player-action-card > summary span {
    font-size: 0.8rem;
    font-weight: 1000;
    text-transform: uppercase;
}

.player-action-card > summary small {
    color: #94a3b8;
    font-size: 0.65rem;
}

.point-exchange-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    padding: 0 1rem 1rem;
    border-top: 1px solid rgb(255 255 255 / 8%);
}

.point-exchange-form label {
    min-width: 0;
    padding-top: 0.8rem;
}

.point-exchange-form label > span {
    display: block;
    margin-bottom: 0.35rem;
    color: #cbd5e1;
    font-size: 0.62rem;
    font-weight: 900;
    text-transform: uppercase;
}

.point-exchange-form .field-input {
    min-height: 2.8rem;
    padding: 0.55rem;
    font-size: 0.78rem;
}

.point-exchange-form button {
    grid-column: 1 / -1;
}

.drink-assignment-list {
    display: grid;
    max-height: 22rem;
    gap: 0.55rem;
    overflow-y: auto;
    padding: 0.8rem 1rem 1rem;
    border-top: 1px solid rgb(255 255 255 / 8%);
}

.drink-assignment-list > article {
    display: grid;
    gap: 0.55rem;
    padding: 0.7rem;
    border: 1px solid rgb(255 255 255 / 9%);
    border-radius: 0.9rem;
    background: rgb(2 6 23 / 48%);
}

.drink-assignment-list > article > strong {
    font-size: 0.8rem;
}

.drink-assignment-list > article > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.drink-assignment-button {
    display: grid;
    width: 100%;
    min-height: 3.1rem;
    place-content: center;
    padding: 0.45rem;
    border: 1px solid rgb(251 146 60 / 35%);
    border-radius: 0.75rem;
    color: #ffedd5;
    background: rgb(194 65 12 / 26%);
    font-size: 0.72rem;
    font-weight: 900;
}

.drink-assignment-button--shot {
    border-color: rgb(192 132 252 / 40%);
    color: #f3e8ff;
    background: rgb(126 34 206 / 28%);
}

.drink-assignment-button small {
    margin-top: 0.15rem;
    font-size: 0.56rem;
    opacity: 0.7;
}

.drink-assignment-button:disabled {
    cursor: not-allowed;
    filter: grayscale(0.8);
    opacity: 0.38;
}

.drink-notification-stack {
    position: fixed;
    z-index: 45;
    top: 1rem;
    right: 1rem;
    display: grid;
    width: min(27rem, calc(100vw - 2rem));
    gap: 0.65rem;
}

.drink-notification {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    padding: 0.9rem;
    border: 1px solid rgb(251 146 60 / 54%);
    border-radius: 1rem;
    color: #fff7ed;
    background: rgb(124 45 18 / 96%);
    box-shadow: 0 1rem 3rem rgb(0 0 0 / 48%);
    animation: player-phase-arrive 420ms cubic-bezier(.2, .8, .2, 1);
}

.drink-notification--shot {
    border-color: rgb(216 180 254 / 58%);
    color: #faf5ff;
    background: rgb(88 28 135 / 96%);
}

.drink-notification > span {
    font-size: 2rem;
}

.drink-notification p {
    color: #fed7aa;
    font-size: 0.58rem;
    font-weight: 1000;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.drink-notification--shot p {
    color: #e9d5ff;
}

.drink-notification strong {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.78rem;
    line-height: 1.35;
}

.drink-notification button {
    padding: 0.55rem 0.65rem;
    border: 1px solid rgb(255 255 255 / 28%);
    border-radius: 0.65rem;
    background: rgb(255 255 255 / 12%);
    font-size: 0.65rem;
    font-weight: 900;
}

.round-history {
    overflow: hidden;
    padding: 1rem;
    border: 1px solid rgb(255 255 255 / 12%);
    border-radius: 1.5rem;
    background: rgb(2 6 23 / 76%);
    box-shadow: 0 1rem 3rem rgb(0 0 0 / 32%);
    backdrop-filter: blur(1rem);
}

.round-history__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.25rem 0.2rem 0.85rem;
}

.round-history__heading h2 {
    margin-top: 0.15rem;
    font-size: 1.45rem;
    font-weight: 1000;
}

.round-history__heading > span {
    display: grid;
    width: 2.5rem;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 9999px;
    color: #083344;
    background: #67e8f9;
    font-weight: 1000;
}

.round-history__list {
    display: grid;
    max-height: calc(100vh - 10rem);
    gap: 0.65rem;
    overflow-y: auto;
}

.round-history__item {
    display: grid;
    gap: 0.18rem;
    padding: 0.85rem;
    border-left: 0.28rem solid #67e8f9;
    border-radius: 0.85rem;
    background: rgb(15 23 42 / 82%);
}

.round-history__item--two { border-left-color: #f9a8d4; }
.round-history__item--five { border-left-color: #c4b5fd; }
.round-history__item--ten { border-left-color: #fbbf24; }
.round-history__item--coinflip { border-left-color: #22d3ee; }
.round-history__item--cashhunt { border-left-color: #fb7185; }
.round-history__item--triplewheel { border-left-color: #d946ef; }
.round-history__item--pachinko { border-left-color: #84cc16; }

.round-history__item > span,
.round-history__item small {
    color: #94a3b8;
    font-size: 0.65rem;
}

.round-history__item strong {
    font-size: 1rem;
}

.round-history__item em {
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 0.25rem;
    padding: 0.18rem 0.42rem;
    border: 1px solid rgb(248 113 113 / 36%);
    border-radius: 9999px;
    color: #fecaca;
    background: rgb(127 29 29 / 24%);
    font-size: 0.55rem;
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.round-history__empty {
    padding: 1.2rem;
    border: 1px dashed rgb(255 255 255 / 16%);
    border-radius: 1rem;
    color: #94a3b8;
    font-size: 0.78rem;
    text-align: center;
}

.winner-ticker {
    position: fixed;
    z-index: 36;
    top: 24%;
    left: 1rem;
    width: min(23rem, 34vw);
    pointer-events: none;
}

.winner-ticker > p {
    margin: 0 0 0.55rem 0.5rem;
    color: #fef08a;
    font-size: 0.65rem;
    font-weight: 1000;
    letter-spacing: 0.2em;
    text-shadow: 0 2px 0.6rem #000;
    text-transform: uppercase;
}

.winner-ticker > div {
    display: grid;
    gap: 0.42rem;
}

.winner-ticker article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.1rem 0.75rem;
    padding: 0.62rem 0.8rem;
    border-left: 0.22rem solid #facc15;
    border-radius: 0 0.8rem 0.8rem 0;
    background: linear-gradient(90deg, rgb(2 6 23 / 76%), rgb(2 6 23 / 18%));
    box-shadow: 0 0.6rem 1.5rem rgb(0 0 0 / 24%);
    opacity: 0;
    backdrop-filter: blur(0.25rem);
    animation: winner-line-scroll 8.6s cubic-bezier(.2, .8, .2, 1) forwards;
}

.winner-ticker article strong {
    overflow: hidden;
    font-size: 0.86rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.winner-ticker article span {
    grid-row: 2;
    color: #cbd5e1;
    font-size: 0.65rem;
}

.winner-ticker article b {
    grid-row: 1 / 3;
    grid-column: 2;
    align-self: center;
    color: #fde68a;
    font-size: 0.72rem;
    text-align: right;
}

@keyframes winner-line-scroll {
    0% { opacity: 0; transform: translateX(-120%); }
    9%, 78% { opacity: 1; transform: translateX(0); }
    100% { opacity: 0; transform: translateX(-120%); }
}

.host-wheel-card {
    position: relative;
    padding: 1rem;
    border: 1px solid rgb(56 189 248 / 42%);
    border-radius: 2rem;
    background: rgb(2 6 23 / 30%);
    box-shadow:
        inset 0 0 3rem rgb(14 165 233 / 8%),
        0 0 0.75rem rgb(56 189 248 / 32%),
        0 2rem 5rem rgb(0 0 0 / 45%);
}

.host-wheel-card::before {
    display: none;
}

.wheel-stage {
    --slice-angle: 6.6666666667deg;
    position: relative;
    isolation: isolate;
    width: min(100%, 66rem);
    margin-inline: auto;
    padding: 7.4rem 1rem 1.5rem;
}

.wheel-stage::before {
    display: none;
}

.wheel-stage::after {
    position: absolute;
    z-index: -1;
    right: -8%;
    bottom: 0;
    left: -8%;
    height: 20%;
    border: 0.22rem solid rgb(56 189 248 / 80%);
    border-radius: 50%;
    background: rgb(2 6 23 / 82%);
    box-shadow: 0 0 1.5rem rgb(56 189 248 / 45%);
    content: '';
}

.wheel-stage-lights {
    display: none;
}

.wheel-disc {
    position: relative;
    z-index: 2;
    display: grid;
    width: 100%;
    aspect-ratio: 1;
    place-items: center;
    overflow: hidden;
    border: 1.15rem solid #f3e5c5;
    border-radius: 50%;
    background: #111827;
    box-shadow:
        0 0 0 0.28rem #9a7b3f,
        0 0 0 0.58rem #facc15,
        0 0 2.5rem rgb(250 204 21 / 48%),
        0 2rem 4rem rgb(0 0 0 / 60%);
}

.wheel-disc::after {
    position: absolute;
    z-index: 6;
    inset: 0.12rem;
    border: 0.3rem dotted #fff7d6;
    border-radius: 50%;
    content: '';
    filter: drop-shadow(0 0 0.2rem #f59e0b);
    pointer-events: none;
}

.wheel-disc--result {
    animation: wheel-arrive 900ms cubic-bezier(.2,.8,.2,1);
}

.wheel-rotor {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: 50%;
    transform: rotate(0deg);
    transform-origin: 50% 50%;
    will-change: transform;
}

.wheel-slice {
    --slice-color: #94a3b8;
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: conic-gradient(
        from var(--slice-start),
        var(--slice-color) 0 calc(var(--slice-angle) - 0.24deg),
        transparent calc(var(--slice-angle) - 0.24deg) 360deg
    );
}

.wheel-slice--one { --slice-color: #a9d9e2; }
.wheel-slice--two { --slice-color: #f8ced8; }
.wheel-slice--five { --slice-color: #b4a7e4; }
.wheel-slice--ten { --slice-color: #ffc21c; }
.wheel-slice--coinflip { --slice-color: #22d3ee; }
.wheel-slice--cashhunt { --slice-color: #fb7185; }
.wheel-slice--triplewheel { --slice-color: #d946ef; }
.wheel-slice--pachinko { --slice-color: #84cc16; }

.wheel-segment-label {
    position: absolute;
    z-index: 3;
    bottom: 50%;
    left: calc(50% - 1.4rem);
    display: flex;
    width: 2.8rem;
    height: 49%;
    justify-content: center;
    padding-top: clamp(0.2rem, 0.65vw, 0.45rem);
    pointer-events: none;
    transform: rotate(var(--slice-mid));
    transform-origin: 50% 100%;
}

.wheel-segment-label i {
    --reward-light: #e2e8f0;
    --reward-main: #64748b;
    --reward-dark: #1e293b;
    position: relative;
    display: grid;
    width: clamp(1.2rem, 2.5vw, 2rem);
    height: clamp(1.2rem, 2.5vw, 2rem);
    flex: 0 0 auto;
    place-content: center;
    padding: 0.08rem;
    border: clamp(1px, 0.16vw, 2px) solid rgb(255 255 255 / 82%);
    color: #fffdf1;
    background: linear-gradient(135deg, var(--reward-light), var(--reward-main) 43%, var(--reward-dark));
    font-style: normal;
    text-align: center;
    box-shadow:
        inset 0 0 0 clamp(1px, 0.1vw, 2px) rgb(255 255 255 / 24%),
        0 0 clamp(0.15rem, 0.55vw, 0.48rem) rgb(2 6 23 / 65%);
    transform: rotate(45deg);
}

.wheel-segment-label i > span { display: grid; place-items: center; transform: rotate(-45deg); }
.wheel-segment-label--one i { --reward-light: #cffafe; --reward-main: #06b6d4; --reward-dark: #155e75; }
.wheel-segment-label--two i { --reward-light: #fce7f3; --reward-main: #ec4899; --reward-dark: #831843; }
.wheel-segment-label--five i { --reward-light: #ede9fe; --reward-main: #8b5cf6; --reward-dark: #4c1d95; }
.wheel-segment-label--ten i { --reward-light: #fef9c3; --reward-main: #eab308; --reward-dark: #713f12; }

.wheel-segment-label--number b {
    font-size: clamp(0.5rem, 1.25vw, 1rem);
    font-weight: 1000;
    line-height: 0.78;
    text-shadow: 0 1px 0 #000, 0 0 0.25rem rgb(255 255 255 / 45%);
}

.wheel-segment-label--number small {
    color: #fff;
    font-size: clamp(0.28rem, 0.62vw, 0.5rem);
    font-weight: 1000;
    line-height: 0.7;
}

.wheel-bonus-label {
    --bonus-color: #a5f3fc;
    --bonus-glow: rgb(34 211 238 / 72%);
    --bonus-shadow: #155e75;
    position: absolute;
    z-index: 4;
    bottom: 50%;
    left: calc(50% - 4.5rem);
    display: flex;
    width: 9rem;
    height: 48%;
    justify-content: center;
    pointer-events: none;
    transform: rotate(var(--slice-mid));
    transform-origin: 50% 100%;
}

.wheel-bonus-label em {
    position: absolute;
    top: 15%;
    left: 50%;
    display: inline-flex;
    align-items: center;
    color: var(--bonus-color);
    filter: drop-shadow(0 0 0.18em #fff) drop-shadow(0 0 0.48em var(--bonus-glow));
    font-family: "Arial Black", Impact, Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: clamp(0.78rem, 1.75vw, 1.5rem);
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0.025em;
    line-height: 1;
    text-transform: uppercase;
    text-shadow:
        0.07em 0.08em 0 var(--bonus-shadow),
        -0.04em -0.04em 0 rgb(255 255 255 / 52%);
    transform: rotate(90deg);
    transform-origin: 0 50%;
    white-space: nowrap;
}

.wheel-bonus-label em::before {
    margin-right: 0.3em;
    color: #fff;
    content: '\2726';
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: 0.58em;
    line-height: 1;
    text-shadow: 0 0 0.35em #fff;
}

.wheel-bonus-label em::after {
    margin-left: 0.3em;
    color: #fff;
    content: '\2726';
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: 0.58em;
    line-height: 1;
    text-shadow: 0 0 0.35em #fff;
}

.wheel-bonus-label--cashhunt {
    --bonus-color: #fed7aa;
    --bonus-glow: rgb(251 113 133 / 72%);
    --bonus-shadow: #9f1239;
}

.wheel-bonus-label--triplewheel em {
    font-size: clamp(0.66rem, 1.42vw, 1.22rem);
}

.wheel-bonus-label--triplewheel {
    --bonus-color: #fbcfe8;
    --bonus-glow: rgb(232 121 249 / 78%);
    --bonus-shadow: #701a75;
}

.wheel-bonus-label--pachinko {
    --bonus-color: #d9f99d;
    --bonus-glow: rgb(163 230 53 / 72%);
    --bonus-shadow: #166534;
}

.wheel-center {
    position: relative;
    z-index: 5;
    display: grid;
    width: 34%;
    aspect-ratio: 1;
    place-content: center;
    overflow: hidden;
    padding: 0.18rem;
    border: 0.7rem solid #f3e5c5;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 28%, rgb(251 191 36 / 25%), transparent 45%),
        linear-gradient(150deg, #7f1d4c, #581c87 72%);
    box-shadow:
        0 0 0 0.35rem #facc15,
        inset 0 -2rem 4rem rgb(15 23 42 / 45%),
        0 1rem 3rem rgb(0 0 0 / 48%);
}

.wheel-center img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
    filter: drop-shadow(0 0 0.65rem rgb(217 70 239 / 48%));
}

.wheel-pointer {
    --flipper-bend: 0deg;
    position: absolute;
    z-index: 8;
    top: 6.65rem;
    left: 50%;
    width: 0;
    height: 0;
    transform: translateX(-50%) rotate(var(--flipper-bend));
    transform-origin: 50% 0;
    border-right: 1.35rem solid transparent;
    border-left: 1.35rem solid transparent;
    border-top: 3.1rem solid #fde047;
    filter: drop-shadow(0 0.45rem 0.45rem rgb(0 0 0 / 58%));
}

.wheel-pointer::after {
    position: absolute;
    top: -3rem;
    left: -0.13rem;
    width: 0.26rem;
    height: 2rem;
    background: #f43f5e;
    content: '';
}

.wheel-top-slot {
    isolation: isolate;
    position: absolute;
    z-index: 7;
    top: 0;
    left: 50%;
    display: grid;
    width: 22rem;
    min-height: 6.2rem;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    -moz-column-gap: 0.65rem;
         column-gap: 0.65rem;
    overflow: hidden;
    padding: 1rem 2.7rem 1.65rem;
    border: 0.16rem solid #fef3c7;
    color: #422006;
    background:
        radial-gradient(circle at 50% 0%, #fff 0 3%, transparent 4%),
        linear-gradient(135deg, #fff7b2, #facc15 56%, #f59e0b);
    box-shadow:
        inset 0 -0.8rem 1.4rem rgb(146 64 14 / 24%),
        inset 0 0 1.2rem rgb(255 255 255 / 52%),
        0 0 0.65rem #fef08a,
        0 0 2.4rem rgb(250 204 21 / 55%);
    clip-path: polygon(8% 0, 92% 0, 100% 68%, 50% 100%, 0 68%);
    transform: translateX(-50%);
    animation: top-slot-idle 2.4s ease-in-out infinite;
}

.wheel-top-slot::before {
    position: absolute;
    z-index: 0;
    inset: 0.34rem 0.7rem 0.85rem;
    border-radius: 1rem;
    background: linear-gradient(145deg, rgb(255 255 255 / 24%), transparent 48%);
    content: '';
}

.wheel-top-slot::after {
    position: absolute;
    z-index: 0;
    top: -70%;
    bottom: -70%;
    left: -42%;
    width: 28%;
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / 72%), transparent);
    content: '';
    transform: rotate(18deg);
    animation: top-slot-shine 2.8s ease-in-out infinite;
}

.wheel-top-slot > * {
    position: relative;
    z-index: 1;
}

.wheel-top-slot span {
    grid-column: 1 / -1;
    color: #78350f;
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.wheel-top-slot strong {
    min-width: 0;
    font-size: clamp(1.05rem, 2vw, 1.45rem);
    font-weight: 1000;
    letter-spacing: -0.025em;
    line-height: 1;
    white-space: nowrap;
}

.wheel-top-slot b {
    font-size: 1.55rem;
    font-weight: 1000;
    padding: 0.2rem 0.65rem;
    border: 0.12rem solid #f5d0fe;
    border-radius: 0.6rem;
    color: #fef08a;
    background: linear-gradient(145deg, #a855f7, #581c87);
    box-shadow: inset 0 0 0.55rem rgb(255 255 255 / 24%), 0 0 0.65rem rgb(126 34 206 / 45%);
}

.wheel-spin-running {
    overflow: hidden;
}

.wheel-spin-overlay {
    position: fixed;
    z-index: 60;
    inset: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 22%, rgb(59 130 246 / 26%), transparent 45%),
        linear-gradient(180deg, rgb(2 6 23 / 72%), rgb(2 6 23 / 96%));
    opacity: 0;
    transition: opacity 350ms ease;
}

.wheel-spin-overlay::after {
    position: absolute;
    z-index: 20;
    right: 0;
    bottom: 0;
    left: 0;
    height: 22%;
    background: linear-gradient(transparent, rgb(2 6 23 / 92%));
    content: '';
    pointer-events: none;
}

.wheel-spin-overlay--active {
    opacity: 1;
}

.wheel-spin-overlay .wheel-stage {
    left: 50%;
    width: min(90vw, calc(100vh - 2rem), 66rem);
    max-width: none;
    margin-inline: 0;
    padding-top: 7.4rem;
    opacity: 1;
    backface-visibility: hidden;
    transform: translate3d(-50%, 0, 0) scale(0.94);
    transition:
        opacity 350ms ease,
        transform 650ms cubic-bezier(.2, .8, .2, 1);
    will-change: transform, opacity;
}

.wheel-spin-overlay--active.wheel-spin-overlay--camera-main .wheel-stage {
    transform: translate3d(-50%, 0, 0) scale(1);
}

.wheel-spin-overlay--camera-top-slot .wheel-stage {
    opacity: 0.22;
    transform: translate3d(-50%, 0, 0) scale(0.88);
}

.wheel-spin-overlay--camera-wheel-close .wheel-stage {
    opacity: 1;
    transform: translate3d(-50%, clamp(5rem, 12vh, 8rem), 0) scale(1.46);
}

.wheel-spin-overlay .wheel-stage::after {
    opacity: 0.45;
}

.wheel-spin-overlay .wheel-disc {
    box-shadow:
        0 0 0 0.28rem #9a7b3f,
        0 0 0 0.58rem #facc15,
        0 0 5rem rgb(250 204 21 / 62%),
        0 2rem 5rem rgb(0 0 0 / 74%);
}

.wheel-spin-result {
    position: absolute;
    z-index: 45;
    top: 50%;
    left: 50%;
    display: grid;
    width: min(34rem, calc(100vw - 2rem));
    justify-items: center;
    gap: 0.35rem;
    padding: clamp(1.5rem, 4vw, 2.8rem);
    border: 0.22rem solid #fef3c7;
    border-radius: 2rem;
    color: #fff;
    background: radial-gradient(circle at top, rgb(126 34 206 / 96%), rgb(15 23 42 / 98%) 72%);
    box-shadow: 0 0 0 0.3rem rgb(250 204 21 / 48%), 0 0 5rem rgb(217 70 239 / 72%), 0 2rem 5rem rgb(0 0 0 / 78%);
    opacity: 0;
    pointer-events: none;
    text-align: center;
    transform: translate(-50%, -42%) scale(0.72);
    transition: opacity 320ms ease, transform 520ms cubic-bezier(.2,.9,.25,1.2);
}

.wheel-spin-result--active {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

.wheel-spin-result--minigame { width: min(42rem, calc(100vw - 2rem)); }

.wheel-spin-result span {
    color: #fef08a;
    font-size: 0.78rem;
    font-weight: 1000;
    letter-spacing: 0.28em;
    text-transform: uppercase;
}

.wheel-spin-result strong {
    font-size: clamp(2.8rem, 10vw, 6.5rem);
    font-weight: 1000;
    line-height: 0.9;
    overflow-wrap: anywhere;
    text-transform: uppercase;
    text-shadow: 0.08em 0.08em 0 #9f1239, 0 0 1.5rem rgb(255 255 255 / 42%);
}

.wheel-spin-result--minigame strong {
    font-size: clamp(1.8rem, 6vw, 4.5rem);
    overflow-wrap: normal;
    white-space: nowrap;
}

.wheel-spin-result small {
    color: #bae6fd;
    font-size: clamp(0.85rem, 2vw, 1.1rem);
    font-weight: 900;
}

.wheel-result-top-slot-multiplier {
    position: fixed;
    z-index: 112;
    display: grid;
    min-width: clamp(4.5rem, 10vw, 7rem);
    aspect-ratio: 1;
    place-items: center;
    border: 0.2rem solid #fef3c7;
    border-radius: 9999px;
    color: #422006;
    background: radial-gradient(circle at 32% 25%, #fef9c3, #facc15 48%, #b45309);
    box-shadow: 0 0 0 0.25rem rgb(250 204 21 / 34%), 0 0 2.5rem rgb(250 204 21 / 78%);
    font-size: clamp(1.4rem, 4vw, 2.5rem);
    font-weight: 1000;
    pointer-events: none;
}

.top-slot-boost-flyer {
    position: fixed;
    z-index: 111;
    display: grid;
    min-width: clamp(7rem, 14vw, 10rem);
    aspect-ratio: 1;
    place-items: center;
    border: 0.28rem solid #fff7d6;
    border-radius: 9999px;
    color: #422006;
    background: radial-gradient(circle at 32% 22%, #fff, #fde047 35%, #d97706 76%);
    box-shadow: 0 0 0 0.16rem rgb(250 204 21 / 36%), 0 0 2rem rgb(250 204 21 / 82%);
    font-size: clamp(2.3rem, 6vw, 3.6rem);
    font-weight: 1000;
    pointer-events: none;
    will-change: opacity, transform;
}

.top-slot-boost-flyer--coin-flip { box-shadow: 0 0 0 0.16rem rgb(34 211 238 / 42%), 0 0 2.2rem rgb(34 211 238 / 88%); }
.top-slot-boost-flyer--cash-hunt { box-shadow: 0 0 0 0.16rem rgb(251 113 133 / 42%), 0 0 2.2rem rgb(251 113 133 / 88%); }
.top-slot-boost-flyer--triple-wheel { box-shadow: 0 0 0 0.16rem rgb(217 70 239 / 42%), 0 0 2.2rem rgb(217 70 239 / 88%); }
.top-slot-boost-flyer--pachinko { box-shadow: 0 0 0 0.16rem rgb(132 204 22 / 42%), 0 0 2.2rem rgb(132 204 22 / 88%); }

.wheel-spin-top-slot {
    --top-slot-parked-scale: 0.76;

    position: absolute;
    z-index: 30;
    top: 0;
    left: 0;
    width: min(29rem, calc(100vw - 2rem));
    min-height: 10rem;
    padding: 1.45rem 4.4rem 2.3rem;
    opacity: 0;
    backface-visibility: hidden;
    transform: translate(calc(50vw - 50%), calc(50vh - 50%)) scale(1.25);
    transition:
        opacity 300ms ease,
        transform 750ms cubic-bezier(.2, .8, .2, 1),
        filter 250ms ease;
    will-change: transform, opacity;
}

.wheel-spin-overlay--camera-top-slot .wheel-spin-top-slot,
.wheel-spin-overlay--camera-wheel-close .wheel-spin-top-slot {
    opacity: 1;
}

.wheel-spin-top-slot strong,
.wheel-spin-top-slot b {
    font-size: clamp(1.8rem, 4.5vw, 3.15rem);
}

.wheel-spin-top-slot strong {
    font-size: clamp(1.5rem, 3.3vw, 2.15rem);
}

.wheel-spin-top-slot--rolling {
    filter: drop-shadow(0 0 1.75rem rgb(250 204 21 / 78%));
    animation: top-slot-roll-frame 520ms ease-in-out infinite alternate;
}

.wheel-spin-top-slot--rolling strong,
.wheel-spin-top-slot--rolling b {
    animation: top-slot-roll 150ms ease-in-out infinite alternate;
}

.wheel-spin-top-slot--locked {
    filter: drop-shadow(0 0 2.2rem rgb(34 211 238 / 88%));
    animation: top-slot-lock 720ms cubic-bezier(.2, .8, .2, 1) both;
}

.wheel-spin-top-slot--parked {
    transform: translate(calc(100vw - 100% - 1.25rem), 1.25rem) scale(var(--top-slot-parked-scale));
}

.wheel-spin-top-slot--locked.wheel-spin-top-slot--parked {
    animation: none;
}

@keyframes top-slot-roll {
    from { opacity: 0.55; transform: translateY(-0.12rem); }
    to { opacity: 1; transform: translateY(0.12rem); }
}

@keyframes top-slot-idle {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.12); }
}

@keyframes top-slot-shine {
    0%, 25% { left: -42%; opacity: 0; }
    45% { opacity: 0.9; }
    65%, 100% { left: 118%; opacity: 0; }
}

@keyframes top-slot-roll-frame {
    from { filter: drop-shadow(0 0 1.2rem rgb(250 204 21 / 65%)) brightness(0.94); }
    to { filter: drop-shadow(0 0 2.4rem rgb(250 204 21 / 92%)) brightness(1.18); }
}

@keyframes top-slot-lock {
    0% { filter: drop-shadow(0 0 1rem rgb(250 204 21 / 68%)); transform: translate(calc(50vw - 50%), calc(50vh - 50%)) scale(1.25); }
    45% { filter: drop-shadow(0 0 4rem rgb(34 211 238 / 100%)); transform: translate(calc(50vw - 50%), calc(50vh - 50%)) scale(1.4); }
    100% { filter: drop-shadow(0 0 2.2rem rgb(34 211 238 / 88%)); transform: translate(calc(50vw - 50%), calc(50vh - 50%)) scale(1.25); }
}

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

.minigame-confetti {
    position: absolute;
    top: -8vh;
    left: var(--confetti-left);
    width: clamp(0.38rem, 0.8vw, 0.68rem);
    height: clamp(0.7rem, 1.5vw, 1.15rem);
    border-radius: 0.12rem;
    background: hsl(var(--confetti-hue) 92% 60%);
    box-shadow: 0 0 0.45rem hsl(var(--confetti-hue) 92% 68% / 72%);
    animation: minigame-confetti-fall var(--confetti-duration) cubic-bezier(.2, .65, .45, 1) var(--confetti-delay) both;
}

.minigame-firework {
    position: absolute;
    top: var(--firework-top);
    left: var(--firework-left);
    width: 0.1rem;
    height: 0.1rem;
}

.minigame-firework i {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0.24rem;
    height: clamp(2.4rem, 7vw, 5rem);
    border-radius: 9999px;
    background: linear-gradient(to top, hsl(var(--firework-hue) 96% 56%), hsl(calc(var(--firework-hue) + 52) 100% 78%), transparent);
    box-shadow: 0 0 0.7rem hsl(var(--firework-hue) 100% 70%);
    opacity: 0;
    transform: rotate(var(--firework-angle)) scaleY(0);
    transform-origin: 50% 100%;
    animation: minigame-firework-burst 1.2s cubic-bezier(.12, .7, .2, 1) var(--firework-delay) both;
}

@keyframes minigame-confetti-fall {
    0% { opacity: 0; transform: translate3d(0, -5vh, 0) rotate(0deg); }
    8% { opacity: 1; }
    100% { opacity: 0.9; transform: translate3d(var(--confetti-drift), 116vh, 0) rotate(var(--confetti-spin)); }
}

@keyframes minigame-firework-burst {
    0% { opacity: 0; transform: rotate(var(--firework-angle)) scaleY(0); }
    18% { opacity: 1; }
    68% { opacity: 1; transform: rotate(var(--firework-angle)) scaleY(1); }
    100% { opacity: 0; transform: rotate(var(--firework-angle)) translateY(-1.2rem) scaleY(0.18); }
}

.music-toggle {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 1rem;
  border-width: 1px;
  border-color: rgb(103 232 249 / 0.3);
  background-color: rgb(2 6 23 / 0.7);
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(207 250 254 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.music-toggle:hover {
  border-color: rgb(165 243 252 / 0.7);
  background-color: rgb(34 211 238 / 0.15);
}

.music-toggle:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: rgb(103 232 249 / 0.2);
}

.music-toggle[aria-pressed='true'] {
  border-color: rgb(110 231 183 / 0.5);
  background-color: rgb(52 211 153 / 0.15);
  --tw-text-opacity: 1;
  color: rgb(209 250 229 / var(--tw-text-opacity, 1));
}

.music-toggle__icon {
    display: grid;
    width: 1.75rem;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 9999px;
    color: #082f49;
    background: #67e8f9;
}

.music-toggle[aria-pressed='true'] .music-toggle__icon {
    color: #052e16;
    background: #6ee7b7;
    animation: music-pulse 1.2s ease-in-out infinite;
}

[data-game-module] form[aria-busy='true'],
[data-host-round-controls] form[aria-busy='true'],
[data-player-balance-form][aria-busy='true'] {
    opacity: 0.65;
    pointer-events: none;
}

@keyframes music-pulse {
    50% { transform: scale(1.12); }
}

@keyframes wheel-arrive {
    from { filter: brightness(1.7) saturate(1.4); transform: scale(0.96); }
    to { filter: brightness(1) saturate(1); transform: scale(1); }
}

@media (max-width: 640px) {
    .host-header {
        flex-direction: column;
        align-items: stretch;
    }

    .host-header__actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        width: 100%;
    }

    .host-round-controls {
        justify-content: flex-end;
    }

    .host-round-controls__heading,
    .host-round-controls > p {
        display: none;
    }

    .host-round-controls__notice {
        max-width: none;
        margin-right: auto;
    }

    .host-round-controls__button {
        width: 100%;
    }

    .player-actions {
        grid-template-columns: 1fr;
    }

    .coin-flip-result__values {
        gap: 0.5rem;
    }

    .coin-flip-result__value {
        min-width: 0;
        padding-inline: 0.35rem;
    }

    .coin-flip-result__value strong {
        font-size: clamp(1.35rem, 8vw, 2rem);
        white-space: nowrap;
    }

    .coin-flip-result__value--winner {
        box-shadow: 0 0 1.25rem rgb(250 204 21 / 70%), inset 0 0 1.5rem rgb(255 255 255 / 24%);
        transform: none;
    }

    .drink-notification {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .drink-notification form {
        grid-column: 1 / -1;
    }

    .drink-notification button {
        width: 100%;
        min-height: 2.65rem;
    }

    .host-wheel-card {
        padding: 0.5rem;
        border-radius: 1.35rem;
    }

    .wheel-stage {
        padding: 6.7rem 0.5rem 1rem;
    }

    .wheel-pointer {
        top: 5.95rem;
    }

    .wheel-top-slot {
        width: min(19rem, calc(100vw - 2rem));
        min-height: 5.7rem;
        padding: 0.85rem 1.8rem 1.45rem;
    }

    .wheel-top-slot strong {
        font-size: 1.05rem;
    }

    .wheel-top-slot b {
        font-size: 1.25rem;
    }

    .wheel-spin-top-slot {
        --top-slot-parked-scale: 0.79;

        width: min(24rem, calc(100vw - 1rem));
        min-height: 8.5rem;
        padding: 1.25rem 3.1rem 2rem;
    }

    .wheel-spin-top-slot strong,
    .wheel-spin-top-slot b {
        font-size: clamp(1.55rem, 8vw, 2.35rem);
    }

    .wheel-spin-top-slot strong {
        font-size: clamp(1.05rem, 5vw, 1.45rem);
    }

    .wheel-spin-overlay--camera-wheel-close .wheel-stage {
        transform: translate3d(-50%, clamp(5rem, 12vh, 8rem), 0) scale(1.8);
    }

    .wheel-disc {
        border-width: 0.7rem;
        box-shadow: 0 0 0 0.2rem #9a7b3f, 0 0 0 0.4rem #facc15, 0 0 1.5rem rgb(250 204 21 / 45%);
    }

    .wheel-center {
        border-width: 0.42rem;
    }

    .wheel-bonus-label em {
        top: 17%;
        font-size: 0.62rem;
    }

    .wheel-bonus-label--triplewheel em {
        font-size: 0.52rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wheel-disc--result {
        animation: none;
    }
}

/* Timed betting */
.betting-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

.betting-heading h2 { font-size: clamp(1.65rem, 5vw, 2.5rem); font-weight: 1000; }
.betting-heading p { color: #94a3b8; }

.betting-countdown {
    display: grid;
    min-width: 10rem;
    grid-template-columns: 1fr auto;
    gap: 0.25rem 0.8rem;
    padding: 0.7rem 0.9rem;
    border: 1px solid rgb(34 211 238 / 38%);
    border-radius: 1rem;
    background: rgb(8 47 73 / 72%);
}

.betting-countdown > span { color: #a5f3fc; font-size: 0.72rem; font-weight: 900; text-transform: uppercase; }
.betting-countdown strong { grid-row: span 2; color: #fff; font-size: 2rem; line-height: 1; }
.betting-countdown strong small { color: #67e8f9; font-size: 0.8rem; }
.betting-countdown i { overflow: hidden; height: 0.3rem; border-radius: 999px; background: rgb(255 255 255 / 12%); }
.betting-countdown i span { display: block; height: 100%; border-radius: inherit; background: #22d3ee; transition: width 80ms linear; }
.betting-countdown em { grid-column: 1 / -1; color: #94a3b8; font-size: 0.72rem; font-style: normal; }
.betting-countdown--urgent { border-color: rgb(251 113 133 / 65%); background: rgb(76 5 25 / 72%); animation: countdown-pulse 550ms ease-in-out infinite alternate; }
.betting-countdown--urgent i span { background: #fb7185; }
.betting-closed-card { border-color: rgb(34 211 238 / 35%); }
.betting-closed-card > span { display: inline-grid; width: 4rem; height: 4rem; place-items: center; border-radius: 50%; color: #052e16; background: #4ade80; font-size: 2rem; font-weight: 1000; }

@keyframes countdown-pulse { to { transform: scale(1.035); } }

/* Point shop and drink history */
.point-shop { display: grid; gap: 0.75rem; }
.point-shop--direct { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.point-shop__form { min-width: 0; }
.point-shop__button { display: grid; width: 100%; min-height: 100%; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 0.65rem; padding: 0.8rem; border: 1px solid rgb(251 146 60 / 45%); border-radius: 1rem; color: #fff; background: linear-gradient(145deg, rgb(234 88 12 / 90%), rgb(124 45 18 / 90%)); text-align: left; box-shadow: 0 0.75rem 2rem rgb(0 0 0 / 22%); transition: filter 160ms ease, transform 160ms ease; }
.point-shop__button:not(:disabled):active { filter: brightness(1.2); transform: scale(0.97); }
.point-shop__button--booze { border-color: rgb(192 132 252 / 45%); background: linear-gradient(145deg, rgb(124 58 237 / 92%), rgb(76 29 149 / 92%)); }
.point-shop__button > span:first-child { font-size: 1.8rem; }
.point-shop__button strong, .point-shop__button small { display: block; }
.point-shop__button strong { overflow: hidden; font-size: 0.8rem; font-weight: 1000; text-overflow: ellipsis; white-space: nowrap; }
.point-shop__button small { margin-top: 0.15rem; color: rgb(255 255 255 / 78%); font-size: 0.62rem; }
.point-shop__button:disabled { cursor: not-allowed; filter: grayscale(1); opacity: 0.45; }
.player-drink-history__item button { padding: 0.65rem 0.85rem; border-radius: 0.75rem; color: #fff; background: #ea580c; font-weight: 900; }

.player-header-tools { display: flex; align-items: center; gap: 0.65rem; }
.player-menu-button { position: relative; display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.68rem 0.8rem; border: 1px solid rgb(251 146 60 / 45%); border-radius: 0.9rem; background: rgb(124 45 18 / 55%); font-weight: 900; }
.player-menu-button b { position: absolute; top: -0.45rem; right: -0.45rem; display: grid; min-width: 1.4rem; height: 1.4rem; place-items: center; border-radius: 999px; color: #450a0a; background: #fb7185; font-size: 0.68rem; }
.player-menu-backdrop { position: fixed; z-index: 69; inset: 0; visibility: hidden; background: rgb(2 6 23 / 70%); opacity: 0; transition: opacity 220ms ease; }
.player-side-menu { position: fixed; z-index: 70; top: 0; right: 0; width: min(28rem, 94vw); height: 100dvh; overflow: auto; padding: 1.25rem; border-left: 1px solid rgb(255 255 255 / 12%); background: #0f172a; box-shadow: -1rem 0 4rem rgb(0 0 0 / 48%); transform: translateX(105%); transition: transform 240ms ease; }
.player-menu-open .player-menu-backdrop { visibility: visible; opacity: 1; }
.player-menu-open .player-side-menu { transform: translateX(0); }
.player-side-menu__header { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.player-side-menu__header h2 { font-size: 1.5rem; font-weight: 1000; }
.player-side-menu__header > button { width: 2.5rem; height: 2.5rem; border-radius: 50%; background: rgb(255 255 255 / 10%); font-size: 1.5rem; }
.player-side-menu__intro { margin: 0.7rem 0 1rem; color: #94a3b8; font-size: 0.82rem; }
.player-drink-history { display: grid; gap: 0.7rem; }
.player-drink-history__item { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.75rem; padding: 0.85rem; border: 1px solid rgb(251 146 60 / 28%); border-radius: 1rem; background: rgb(124 45 18 / 24%); }
.player-drink-history__item > span { font-size: 1.7rem; }
.player-drink-history__item small { display: block; color: #94a3b8; font-size: 0.68rem; }
.player-drink-history__item strong { display: block; }
.player-drink-history__item--drunk { filter: saturate(0.45); opacity: 0.66; }
.player-drink-history__item em { color: #86efac; font-size: 0.72rem; font-style: normal; font-weight: 900; }
.player-drink-history__empty { padding: 3rem 1rem; text-align: center; color: #94a3b8; }
.player-drink-history__empty span { display: block; font-size: 3rem; }
.player-drink-history__empty strong { display: block; color: #fff; }

/* Fruit-machine top slot */
.wheel-top-slot { display: block; padding-top: 0.7rem; }
.wheel-top-slot__title { display: block; margin-bottom: 0.32rem; text-align: center; }
.top-slot-machine { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 0.75fr); gap: 0.45rem; }
.player-result-top-slot .top-slot-machine--player { display: grid; width: min(100%, 22rem); grid-template-columns: minmax(0, 2fr) minmax(5.25rem, 0.8fr); align-items: stretch; gap: 0.45rem; margin: 0.5rem auto 0; }
.top-slot-machine--player .top-slot-reel--segment { min-width: 0; width: 100%; }
.player-result-top-slot .top-slot-reel { display: grid; min-width: 0; grid-template-rows: minmax(0, 1fr) 1.7rem minmax(0, 1fr); align-content: center; align-items: center; gap: 0; margin-top: 0; }
.player-result-top-slot .top-slot-reel > * { display: grid; height: 100%; place-items: center; line-height: 1; }
.top-slot-reel { position: relative; display: grid; height: 3.7rem; grid-template-rows: 0.75rem 1.7rem 0.75rem; place-items: center; overflow: hidden; border: 0.16rem solid #fef3c7; border-radius: 0.75rem; color: #fff; background: linear-gradient(#334155, #0f172a 40% 60%, #334155); box-shadow: inset 0 0 1rem rgb(0 0 0 / 70%); text-align: center; }
.top-slot-reel::after { position: absolute; inset: 0.85rem 0; border-top: 1px solid rgb(255 255 255 / 45%); border-bottom: 1px solid rgb(255 255 255 / 45%); content: ''; pointer-events: none; }
.top-slot-reel small { color: rgb(255 255 255 / 48%); font-size: 0.52rem; line-height: 1; }
.wheel-top-slot .top-slot-reel strong, .top-slot-reel strong { width: 100%; overflow: hidden; font-size: 0.83rem; font-weight: 1000; text-overflow: ellipsis; white-space: nowrap; }
.top-slot-reel--one { color: #0f172a; background: linear-gradient(#397b87, #a9d9e2 40% 60%, #397b87); }
.top-slot-reel--two { color: #0f172a; background: linear-gradient(#9f4960, #f8ced8 40% 60%, #9f4960); }
.top-slot-reel--five { color: #0f172a; background: linear-gradient(#5b4b9e, #b4a7e4 40% 60%, #5b4b9e); }
.top-slot-reel--ten { color: #0f172a; background: linear-gradient(#9a6500, #ffc21c 40% 60%, #9a6500); }
.top-slot-reel--coinflip { color: #0f172a; background: linear-gradient(#0e7490, #22d3ee 40% 60%, #0e7490); }
.top-slot-reel--cashhunt { color: #0f172a; background: linear-gradient(#9f1239, #fb7185 40% 60%, #9f1239); }
.top-slot-reel--triplewheel { color: #0f172a; background: linear-gradient(#86198f, #d946ef 40% 60%, #86198f); }
.top-slot-reel--pachinko { color: #0f172a; background: linear-gradient(#4d7c0f, #84cc16 40% 60%, #4d7c0f); }
.top-slot-reel--none { color: #94a3b8; background: linear-gradient(#334155, #0f172a 40% 60%, #334155); }

/* Cash Hunt */
.cash-hunt-board--108 { grid-template-columns: repeat(9, minmax(0, 1fr)); gap: clamp(0.14rem, 0.7vw, 0.42rem); }
.cash-hunt-board--108 form { min-width: 0; }
.cash-hunt-target { position: relative; display: grid; width: 100%; aspect-ratio: 1; place-items: center; overflow: hidden; border: 1px solid rgb(255 255 255 / 26%); border-radius: clamp(0.25rem, 0.8vw, 0.65rem); color: #fff; background: linear-gradient(145deg, #334155, #0f172a); box-shadow: inset 0 0 0.7rem rgb(255 255 255 / 12%); font-weight: 1000; }
.cash-hunt-target__multiplier { font-size: clamp(0.52rem, 1.7vw, 1rem); transition: filter 420ms ease, opacity 420ms ease, transform 540ms ease; }
.cash-hunt-target__icon { position: absolute; display: grid; inset: 0; place-items: center; background: linear-gradient(145deg, #2563eb, #7c3aed); font-size: clamp(0.75rem, 2.3vw, 1.55rem); opacity: 0; transform: rotateY(90deg); }
.cash-hunt-board--covered .cash-hunt-target__icon { opacity: 1; transform: rotateY(0); transition: opacity 960ms ease, transform 1260ms ease; }
.cash-hunt-board--covered .cash-hunt-target__multiplier { opacity: 0; }
.cash-hunt-board--rolling .cash-hunt-target:not(.cash-hunt-target--settled) .cash-hunt-target__multiplier { animation: cash-multiplier-roll 510ms linear infinite; }
.cash-hunt-target--settled .cash-hunt-target__multiplier { animation: cash-multiplier-settle 1560ms cubic-bezier(.2,.9,.25,1.25) both; }
.cash-hunt-target--settled[data-cash-hunt-multiplier="1"] { background: linear-gradient(145deg, #475569, #1e293b); }
.cash-hunt-target--settled[data-cash-hunt-multiplier="2"] { background: linear-gradient(145deg, #06b6d4, #155e75); }
.cash-hunt-target--settled[data-cash-hunt-multiplier="3"] { background: linear-gradient(145deg, #22c55e, #166534); }
.cash-hunt-target--settled[data-cash-hunt-multiplier="5"] { background: linear-gradient(145deg, #eab308, #854d0e); }
.cash-hunt-target--settled[data-cash-hunt-multiplier="10"] { background: linear-gradient(145deg, #f97316, #9a3412); }
.cash-hunt-target--settled[data-cash-hunt-multiplier="15"] { background: linear-gradient(145deg, #ec4899, #9d174d); }
.cash-hunt-target--settled[data-cash-hunt-multiplier="25"] { background: linear-gradient(145deg, #a855f7, #6b21a8); }
.cash-hunt-target--settled[data-cash-hunt-multiplier="50"] { background: linear-gradient(145deg, #ef4444, #7f1d1d); }
.cash-hunt-board--shuffling .cash-hunt-target { animation: cash-shuffle 1080ms ease-in-out infinite alternate; }
.cash-hunt-board--choosing .cash-hunt-target { cursor: crosshair; }
.cash-hunt-target--selected { outline: 0.2rem solid #facc15; box-shadow: 0 0 1.2rem #facc15; }
.cash-hunt-target > b { position: absolute; z-index: 3; color: #fef08a; font-size: 1.5rem; }
.cash-hunt-target__players { position: absolute; z-index: 4; right: 0.12rem; bottom: 0.12rem; left: 0.12rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.12rem; pointer-events: none; }
.cash-hunt-target__players b { max-width: 100%; overflow: hidden; padding: 0.08rem 0.22rem; border-radius: 999px; color: #0f172a; background: #fef08a; font-size: clamp(0.3rem, 0.65vw, 0.55rem); line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.cash-hunt-board--revealed .cash-hunt-target__icon, .cash-hunt-target--revealed .cash-hunt-target__icon { opacity: 0; transform: rotateY(90deg); }
.cash-hunt-board--revealed .cash-hunt-target__multiplier, .cash-hunt-target--revealed .cash-hunt-target__multiplier { opacity: 1; }
.cash-hunt-target--beer { border-color: #fde047; box-shadow: inset 0 0 0.7rem rgb(255 255 255 / 16%), 0 0 0.7rem rgb(250 204 21 / 75%); }
.cash-hunt-target--booze { border-color: #e879f9; box-shadow: inset 0 0 0.7rem rgb(255 255 255 / 16%), 0 0 0.7rem rgb(232 121 249 / 75%); }
.cash-hunt-board--covered .cash-hunt-target--beer,
.cash-hunt-board--covered .cash-hunt-target--booze {
    border-color: rgb(255 255 255 / 26%);
    box-shadow: inset 0 0 0.7rem rgb(255 255 255 / 12%);
}
.cash-hunt-board--covered .cash-hunt-target--revealed.cash-hunt-target--beer { border-color: #fde047; box-shadow: inset 0 0 0.7rem rgb(255 255 255 / 16%), 0 0 0.7rem rgb(250 204 21 / 75%); }
.cash-hunt-board--covered .cash-hunt-target--revealed.cash-hunt-target--booze { border-color: #e879f9; box-shadow: inset 0 0 0.7rem rgb(255 255 255 / 16%), 0 0 0.7rem rgb(232 121 249 / 75%); }
.cash-hunt-target--shot { animation: cash-shot-target 300ms ease-in-out 2; }
.cash-hunt-show { position: fixed; z-index: 90; inset: 0; display: grid; overflow: hidden; grid-template-rows: auto auto minmax(0, 1fr); padding: clamp(0.5rem, 1.5vh, 1rem); color: #fff; background: radial-gradient(circle at top, #164e63, #020617 70%); text-align: center; }
.cash-hunt-show h2 { font-size: clamp(1.5rem, 4vh, 3rem); font-weight: 1000; line-height: 1; }
.cash-hunt-show > p { margin-top: 0.2rem; color: #67e8f9; font-size: clamp(0.72rem, 1.7vh, 1rem); font-weight: 900; }
.cash-hunt-show .cash-hunt-board { align-self: center; width: min(72rem, calc(75dvh - 5rem), calc(100vw - 2rem)); margin: 0.35rem auto 0; gap: clamp(0.08rem, 0.35vh, 0.2rem); }
.cash-hunt-show .cash-hunt-target__icon { font-size: clamp(1.1rem, 3.2vh, 2.2rem); }
.cash-hunt-show .cash-hunt-target__multiplier { font-size: clamp(0.72rem, 2vh, 1.25rem); }
.cash-hunt-show--leaving { opacity: 0; transition: opacity 1350ms ease; }
.cash-hunt-player-selection { display: none; }
.cash-hunt-player-show { position: fixed; z-index: 95; inset: 0; overflow: auto; padding: clamp(0.65rem, 2.5vw, 1.5rem); color: #fff; background: radial-gradient(circle at top, #164e63, #020617 72%); text-align: center; }
.cash-hunt-player-show .cash-hunt-player-selection--active { display: block; }
.cash-hunt-player-show h3 { color: #fef08a; font-size: clamp(1.4rem, 6vw, 2.5rem); font-weight: 1000; }
.cash-hunt-player-show .cash-hunt-countdown { width: min(30rem, 100%); margin: 0.75rem auto; }
.cash-hunt-player-show .cash-hunt-board { width: min(42rem, 100%); margin: 0.85rem auto 0; }
.cash-hunt-shot { position: fixed; z-index: 100; width: 0; height: 0; pointer-events: none; }
.cash-hunt-shot i { position: absolute; inset: -4rem; border: 0.35rem solid #fef08a; border-radius: 50%; animation: cash-shot-ring 650ms ease-out forwards; }
.cash-hunt-shot b { position: absolute; transform: translate(-50%, -50%) rotate(-8deg); color: #fff; font-size: clamp(2rem, 10vw, 6rem); font-weight: 1000; text-shadow: 0 0 1rem #f43f5e; animation: cash-shot-word 650ms ease-out forwards; }

@keyframes cash-multiplier-roll { 50% { filter: blur(0.08rem) brightness(1.5); opacity: 0.45; transform: translateY(0.22rem) scaleY(0.72); } }
@keyframes cash-multiplier-settle { 45% { filter: brightness(2); transform: scale(1.35); } 100% { filter: none; transform: scale(1); } }
@keyframes cash-shuffle { to { filter: hue-rotate(70deg); transform: translateY(-0.18rem) rotate(2deg); } }
@keyframes cash-shot-target { 50% { filter: brightness(2); transform: scale(0.82); } }
@keyframes cash-shot-ring { to { inset: -8rem; opacity: 0; } }
@keyframes cash-shot-word { 70% { transform: translate(-50%, -50%) rotate(5deg) scale(1.4); } 100% { opacity: 0; } }

/* Pachinko multiplier introduction */
.pachinko-show__slot { animation: none; }
.pachinko-show__slot--revealed { opacity: 1; transform: translateY(0); transition: opacity 420ms ease, transform 520ms cubic-bezier(.2,.9,.25,1.15); }
.pachinko-show__slot--reveal-active { z-index: 5; filter: brightness(1.5); transform: translateY(-0.45rem) scale(1.12); }
.pachinko-show__multiplier-callout { position: absolute; z-index: 8; top: 45%; left: 50%; display: grid; min-width: clamp(10rem, 25vw, 18rem); min-height: clamp(7rem, 20vw, 13rem); place-items: center; padding: 0.4em 0.6em; overflow: hidden; border: 0.18rem solid rgb(254 240 138 / 72%); border-radius: clamp(1.2rem, 4vw, 2.8rem); color: #fef08a; background: radial-gradient(circle, rgb(21 128 61 / 96%), rgb(5 46 22 / 96%) 72%); box-shadow: inset 0 0 2.5rem rgb(190 242 100 / 24%), 0 0 3rem rgb(163 230 53 / 42%); font-size: clamp(4rem, 18vw, 10rem); font-weight: 1000; line-height: 1; text-shadow: 0 0 2rem #f59e0b; transform: translate(-50%, -50%) scale(0.85); opacity: 0; }
.pachinko-show__multiplier-callout--rolling { opacity: 1; animation: pachinko-multiplier-roll 180ms linear infinite; }
.pachinko-show__multiplier-callout--landed { opacity: 1; animation: pachinko-multiplier-land 520ms cubic-bezier(.16, 1, .3, 1) both; }
.pachinko-show__multiplier-callout--done { opacity: 0; transition: opacity 300ms ease; }
@keyframes pachinko-multiplier-roll {
    0% { filter: blur(0.18rem); transform: translate(-50%, -62%) scale(0.92); }
    50% { filter: blur(0); transform: translate(-50%, -50%) scale(1); }
    100% { filter: blur(0.18rem); transform: translate(-50%, -38%) scale(0.92); }
}
@keyframes pachinko-multiplier-land {
    0% { filter: brightness(2); transform: translate(-50%, -50%) scale(1.35); }
    55% { filter: brightness(1.35); transform: translate(-50%, -50%) scale(0.94); }
    100% { filter: brightness(1); transform: translate(-50%, -50%) scale(1); }
}

/* Triple Wheel */
.triple-wheel-show { position: fixed; z-index: 92; inset: 0; overflow: hidden; padding: clamp(1rem, 2.5vw, 2.5rem); color: #fff; background: radial-gradient(circle at 50% 34%, #164e63, #082f49 46%, #020617 82%); text-align: center; opacity: 0; transition: opacity 400ms ease; }
.triple-wheel-show--active { opacity: 1; }
.triple-wheel-show--leaving { opacity: 0; }
.triple-wheel-show h2 { color: #fef08a; font-size: clamp(2rem, 6vw, 4.7rem); font-weight: 1000; line-height: 1; text-shadow: 0 0 1.4rem #f59e0b; }
.triple-wheel-show > p { margin-top: 0.5rem; color: #bae6fd; font-weight: 900; }
.triple-wheel-show__stage { position: relative; isolation: isolate; width: min(72dvh, 52rem, 90vw); aspect-ratio: 1; margin: 1.4rem auto 1rem; transform-origin: 50% 0; transition: transform 1400ms cubic-bezier(.16, 1, .3, 1); }
.triple-wheel-show__stage::after { position: absolute; z-index: -1; right: -8%; bottom: -2%; left: -8%; height: 20%; border: 0.22rem solid rgb(56 189 248 / 80%); border-radius: 50%; background: rgb(2 6 23 / 82%); box-shadow: 0 0 1.5rem rgb(56 189 248 / 45%); content: ''; }
.triple-wheel-show--flipper-focus .triple-wheel-show__stage { transform: scale(2.25) translateY(0.45rem); }
.triple-wheel-show__rotor { position: absolute; z-index: 2; inset: 0; overflow: hidden; border: 1rem solid #f3e5c5; border-radius: 50%; background: #111827; box-shadow: 0 0 0 0.28rem #9a7b3f, 0 0 0 0.58rem #facc15, 0 0 2.5rem rgb(250 204 21 / 55%), 0 2rem 4rem rgb(0 0 0 / 60%); transform-origin: 50% 50%; will-change: transform; }
.triple-wheel-show__rotor::after { position: absolute; z-index: 6; inset: 0.12rem; border: 0.3rem dotted #fff7d6; border-radius: 50%; content: ''; filter: drop-shadow(0 0 0.2rem #f59e0b); pointer-events: none; }
.triple-wheel-show__slice { --triple-slice-color: #a9d9e2; position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(from var(--triple-slice-start), var(--triple-slice-color) 0 calc(var(--triple-slice-angle) - 0.3deg), transparent calc(var(--triple-slice-angle) - 0.3deg) 360deg); }
.triple-wheel-show__slice--beer { --triple-slice-color: #f8ced8; }
.triple-wheel-show__slice--booze { --triple-slice-color: #b4a7e4; }
.triple-wheel-show__slice--double { --triple-slice-color: #22d3ee; }
.triple-wheel-show__slice--triple { --triple-slice-color: #d946ef; }
.triple-wheel-show__label { position: absolute; z-index: 3; bottom: 50%; left: calc(50% - 1.25rem); display: flex; width: 2.5rem; height: 49%; justify-content: center; padding-top: clamp(0.2rem, 0.6vw, 0.45rem); pointer-events: none; transform: rotate(var(--triple-slice-mid)); transform-origin: 50% 100%; }
.triple-wheel-show__label b { --reward-light: #e2e8f0; --reward-main: #64748b; --reward-dark: #1e293b; display: grid; width: clamp(1.15rem, 2.25vw, 1.8rem); height: clamp(1.15rem, 2.25vw, 1.8rem); flex: 0 0 auto; place-content: center; padding: 0.06rem; border: clamp(1px, 0.14vw, 2px) solid rgb(255 255 255 / 82%); color: #fffdf1; background: linear-gradient(135deg, var(--reward-light), var(--reward-main) 43%, var(--reward-dark)); box-shadow: inset 0 0 0 clamp(1px, 0.1vw, 2px) rgb(255 255 255 / 24%), 0 0 clamp(0.15rem, 0.55vw, 0.48rem) rgb(2 6 23 / 65%); font-weight: 1000; text-shadow: 0 1px 0 #000; transform: rotate(45deg); }
.triple-wheel-show__label b > span { display: block; font-size: clamp(0.36rem, 0.78vw, 0.64rem); line-height: 0.8; transform: rotate(-45deg); white-space: nowrap; }
.triple-wheel-show__label--beer b > span, .triple-wheel-show__label--booze b > span { font-size: clamp(0.32rem, 0.7vw, 0.56rem); }
.triple-wheel-show__label--double, .triple-wheel-show__label--triple { --bonus-color: #cffafe; --bonus-glow: rgb(34 211 238 / 82%); --bonus-shadow: #155e75; left: calc(50% - 4rem); width: 8rem; padding-top: 0; }
.triple-wheel-show__label--triple { --bonus-color: #fbcfe8; --bonus-glow: rgb(232 121 249 / 88%); --bonus-shadow: #701a75; }
.triple-wheel-show__label--double b, .triple-wheel-show__label--triple b { position: absolute; top: 10%; left: 50%; display: inline-flex; width: auto; height: auto; align-items: center; overflow: visible; padding: 0; border: 0; color: var(--bonus-color); background: transparent; box-shadow: none; filter: drop-shadow(0 0 0.18em #fff) drop-shadow(0 0 0.52em var(--bonus-glow)); font-family: "Arial Black", Impact, Inter, ui-sans-serif, system-ui, sans-serif; font-size: clamp(0.58rem, 1.35vw, 1.08rem); font-weight: 900; letter-spacing: 0.025em; line-height: 1; text-shadow: 0.07em 0.08em 0 var(--bonus-shadow), -0.04em -0.04em 0 rgb(255 255 255 / 52%); transform: rotate(90deg); transform-origin: 0 50%; white-space: nowrap; }
.triple-wheel-show__label--double b > span, .triple-wheel-show__label--triple b > span { font-size: inherit; line-height: inherit; transform: none; }
.triple-wheel-show__label--double b::before, .triple-wheel-show__label--triple b::before { margin-right: 0.28em; color: #fff; content: '\2726'; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 0.58em; line-height: 1; text-shadow: 0 0 0.35em #fff; }
.triple-wheel-show__label--double b::after, .triple-wheel-show__label--triple b::after { margin-left: 0.28em; color: #fff; content: '\2726'; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 0.58em; line-height: 1; text-shadow: 0 0 0.35em #fff; }
.triple-wheel-show__center { position: absolute; z-index: 5; inset: 34%; display: grid; place-content: center; overflow: hidden; padding: 0.18rem; border: 0.7rem solid #f3e5c5; border-radius: 50%; background: radial-gradient(circle at 50% 28%, rgb(251 191 36 / 25%), transparent 45%), linear-gradient(150deg, #7f1d4c, #581c87 72%); box-shadow: 0 0 0 0.35rem #facc15, inset 0 -2rem 4rem rgb(15 23 42 / 45%), 0 1rem 3rem rgb(0 0 0 / 48%); }
.triple-wheel-show__center img { display: block; width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; filter: drop-shadow(0 0 0.65rem rgb(217 70 239 / 48%)); }
.triple-wheel-show__pointers { position: absolute; z-index: 7; inset: 0; pointer-events: none; }
.triple-wheel-show__pointer { --pointer-light: #cbd5e1; --pointer-main: #64748b; --pointer-dark: #1e293b; position: absolute; width: 3.4rem; height: 5.1rem; filter: grayscale(0.72) drop-shadow(0 0.4rem 0.3rem rgb(0 0 0 / 72%)); transform: translate(-50%, -100%) rotate(var(--triple-pointer-angle, 0deg)); transform-origin: 50% 100%; transition: filter 250ms ease, opacity 250ms ease; }
.triple-wheel-show__pointer::before { position: absolute; z-index: 3; top: -0.42rem; left: 50%; width: 1.45rem; aspect-ratio: 1; border: 0.2rem solid #fef3c7; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, #94a3b8 36%, #1e293b 72%); box-shadow: 0 0 0 0.16rem #9a7b3f, 0 0 0.85rem rgb(250 204 21 / 72%); content: ''; transform: translateX(-50%); }
.triple-wheel-show__pointer::after { position: absolute; z-index: 4; top: 0.02rem; left: 50%; width: 0.48rem; aspect-ratio: 1; border-radius: 50%; background: #0f172a; box-shadow: inset 0 0 0 0.1rem rgb(255 255 255 / 28%); content: ''; transform: translateX(-50%); }
.triple-wheel-show__pointer > span { position: absolute; inset: 0.42rem 0.28rem 0; display: grid; place-items: start center; padding-top: 0.48rem; clip-path: polygon(12% 0, 88% 0, 76% 66%, 50% 100%, 24% 66%); color: #fff; background: linear-gradient(90deg, var(--pointer-dark), var(--pointer-main) 24% 68%, var(--pointer-light) 82%, var(--pointer-dark)); box-shadow: inset 0 0 0 0.18rem rgb(255 255 255 / 40%); transform-origin: 50% 7%; will-change: transform; }
.triple-wheel-show__pointer > span::after { position: absolute; right: 24%; bottom: 18%; left: 24%; height: 0.28rem; border-radius: 9999px; background: rgb(255 255 255 / 62%); box-shadow: 0 0 0.5rem rgb(255 255 255 / 55%); content: ''; }
.triple-wheel-show__pointer b { display: grid; width: 1.42rem; aspect-ratio: 1; place-items: center; border: 0.14rem solid rgb(255 255 255 / 70%); border-radius: 50%; background: rgb(2 6 23 / 56%); font-size: 0.78rem; font-style: normal; font-weight: 1000; text-shadow: 0 1px 0 #000; }
.triple-wheel-show__pointer--green { --pointer-light: #86efac; --pointer-main: #22c55e; --pointer-dark: #14532d; }
.triple-wheel-show__pointer--yellow { --pointer-light: #fef08a; --pointer-main: #eab308; --pointer-dark: #713f12; }
.triple-wheel-show__pointer--blue { --pointer-light: #93c5fd; --pointer-main: #3b82f6; --pointer-dark: #1e3a8a; }
.triple-wheel-show__pointer--active { filter: drop-shadow(0 0.4rem 0.3rem rgb(0 0 0 / 72%)) drop-shadow(0 0 0.8rem var(--pointer-main)); }
.triple-wheel-show__cards, .triple-wheel-player-results { display: grid; width: min(46rem, 100%); grid-template-columns: repeat(3, 1fr); gap: 0.7rem; margin: 0 auto; }
.triple-wheel-show__cards { position: relative; z-index: 8; transition: opacity 600ms ease, transform 600ms ease; }
.triple-wheel-show--flipper-focus .triple-wheel-show__cards { opacity: 0.2; transform: translateY(1rem); }
.triple-wheel-show__card, .triple-wheel-player-result { padding: 0.75rem; border: 2px solid currentColor; border-radius: 1rem; background: rgb(15 23 42 / 88%); }
.triple-wheel-show__card span, .triple-wheel-player-result span { display: block; font-weight: 900; }
.triple-wheel-show__card strong, .triple-wheel-player-result strong { display: block; font-size: clamp(1.3rem, 4vw, 2.4rem); }
.triple-wheel-show__card small, .triple-wheel-player-result small { color: #cbd5e1; }
.triple-wheel-show__card--green, .triple-wheel-player-result--green { color: #4ade80; }
.triple-wheel-show__card--yellow, .triple-wheel-player-result--yellow { color: #fde047; }
.triple-wheel-show__card--blue, .triple-wheel-player-result--blue { color: #60a5fa; }
.triple-wheel-show__card--landed { animation: triple-card-landed 550ms ease-out; }
.triple-wheel-player-result { position: relative; }
.triple-wheel-player-result em { display: block; margin-top: 0.4rem; color: #e9d5ff; font-size: 0.66rem; font-style: normal; }
.triple-wheel-player-result b { display: inline-block; margin-top: 0.5rem; padding: 0.2rem 0.45rem; border-radius: 999px; color: #422006; background: #fef08a; font-size: 0.65rem; text-transform: uppercase; }
.triple-wheel-player-result--chosen { box-shadow: 0 0 1.5rem currentColor; }
.triple-wheel-choice-show { position: fixed; z-index: 94; inset: 0; overflow: auto; padding: clamp(1rem, 5vw, 3rem); color: #fff; background: radial-gradient(circle at 50% 25%, #581c87, #1e1b4b 55%, #020617); text-align: center; }
.player-result--sequencing .triple-wheel-choice-show { display: none; }
.triple-wheel-choice-show h3 { margin-top: 0.35rem; color: #fef08a; font-size: clamp(2rem, 9vw, 4.5rem); font-weight: 1000; line-height: 1; }
.triple-wheel-choice-show--waiting { display: grid; place-content: center; }
.triple-wheel-choice-show--waiting > p:last-child { margin-top: 1.5rem; color: #e9d5ff; font-size: 1.1rem; font-weight: 900; }
.triple-wheel-choice-show__choices { display: grid; width: min(54rem, 100%); margin: clamp(2rem, 8vh, 5rem) auto 2rem; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.triple-wheel-choice-show__button { display: grid; width: 100%; min-height: clamp(10rem, 35vh, 20rem); place-items: center; align-content: center; gap: 0.75rem; border: 0.28rem solid rgb(255 255 255 / 70%); border-radius: 2rem; box-shadow: 0 0 2rem currentColor; transition: transform 180ms ease, filter 180ms ease; }
.triple-wheel-choice-show__button:not(:disabled):active { filter: brightness(1.3); transform: scale(0.96); }
.triple-wheel-choice-show__button span { font-size: clamp(1.4rem, 6vw, 3.5rem); font-weight: 1000; }
.triple-wheel-choice-show__button small { font-weight: 900; opacity: 0.8; }
.triple-wheel-choice-show__button--green { color: #dcfce7; background: linear-gradient(145deg, #22c55e, #14532d); }
.triple-wheel-choice-show__button--yellow { color: #422006; background: linear-gradient(145deg, #fde047, #ca8a04); }
.triple-wheel-choice-show__button--blue { color: #dbeafe; background: linear-gradient(145deg, #3b82f6, #1e3a8a); }
.triple-wheel-choice-show__locked { width: min(34rem, 100%); margin: clamp(3rem, 12vh, 8rem) auto 2rem; padding: 2.5rem; border: 0.3rem solid currentColor; border-radius: 2rem; font-size: clamp(2rem, 8vw, 4rem); font-weight: 1000; box-shadow: 0 0 2.5rem currentColor; }
.triple-wheel-choice-show__locked--green { color: #4ade80; }
.triple-wheel-choice-show__locked--yellow { color: #fde047; }
.triple-wheel-choice-show__locked--blue { color: #60a5fa; }
@keyframes triple-card-landed { 50% { filter: brightness(2); transform: scale(1.1); } }

@media (max-width: 640px) {
    .betting-heading { align-items: stretch; flex-direction: column; }
    .betting-countdown { width: 100%; }
    .player-header-tools { align-items: stretch; flex-direction: column; }
    .cash-hunt-show { padding: 0.7rem; }
    .cash-hunt-board--108 { gap: 0.1rem; }
    .triple-wheel-show__cards, .triple-wheel-player-results { gap: 0.3rem; }
    .triple-wheel-player-result { padding: 0.4rem; }
}

.placeholder\:text-slate-500::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

.placeholder\:text-slate-500::placeholder {
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}

.hover\:border-gray-300:hover {
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
}

.hover\:bg-blue-800:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(30 66 159 / var(--tw-bg-opacity, 1));
}

.hover\:bg-gray-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

.hover\:bg-white:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.hover\:text-blue-600:hover {
  --tw-text-opacity: 1;
  color: rgb(28 100 242 / var(--tw-text-opacity, 1));
}

.hover\:text-gray-600:hover {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}

.hover\:text-gray-900:hover {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}

.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.focus\:border-amber-300:focus {
  --tw-border-opacity: 1;
  border-color: rgb(252 211 77 / var(--tw-border-opacity, 1));
}

.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.focus\:ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus\:ring-4:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus\:ring-amber-300\/30:focus {
  --tw-ring-color: rgb(252 211 77 / 0.3);
}

.focus\:ring-blue-300:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(164 202 254 / var(--tw-ring-opacity, 1));
}

.focus\:ring-gray-200:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity, 1));
}

.dark\:border-blue-500:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(63 131 248 / var(--tw-border-opacity, 1));
}

.dark\:border-gray-600:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(75 85 99 / var(--tw-border-opacity, 1));
}

.dark\:border-gray-700:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
}

.dark\:border-transparent:is(.dark *) {
  border-color: transparent;
}

.dark\:\!bg-gray-700:is(.dark *) {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)) !important;
}

.dark\:bg-blue-600:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(28 100 242 / var(--tw-bg-opacity, 1));
}

.dark\:bg-gray-600:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
}

.dark\:bg-gray-700:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

.dark\:bg-gray-800:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
}

.dark\:bg-gray-800\/50:is(.dark *) {
  background-color: rgb(31 41 55 / 0.5);
}

.dark\:bg-gray-900\/80:is(.dark *) {
  background-color: rgb(17 24 39 / 0.8);
}

.dark\:text-blue-500:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(63 131 248 / var(--tw-text-opacity, 1));
}

.dark\:text-gray-400:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}

.dark\:text-gray-500:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}

.dark\:text-white:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.dark\:hover\:bg-blue-700:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(26 86 219 / var(--tw-bg-opacity, 1));
}

.dark\:hover\:bg-gray-600:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
}

.dark\:hover\:bg-gray-800:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
}

.dark\:hover\:text-blue-500:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(63 131 248 / var(--tw-text-opacity, 1));
}

.dark\:hover\:text-gray-300:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(209 213 219 / var(--tw-text-opacity, 1));
}

.dark\:hover\:text-white:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

@media (min-width: 640px) {

  .sm\:static {
    position: static;
  }

  .sm\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .sm\:mt-1 {
    margin-top: 0.25rem;
  }

  .sm\:min-w-\[430px\] {
    min-width: 430px;
  }

  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sm\:flex-row {
    flex-direction: row;
  }

  .sm\:items-center {
    align-items: center;
  }

  .sm\:justify-between {
    justify-content: space-between;
  }

  .sm\:gap-5 {
    gap: 1.25rem;
  }

  .sm\:space-y-6 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
  }

  .sm\:rounded-2xl {
    border-radius: 1rem;
  }

  .sm\:bg-transparent {
    background-color: transparent;
  }

  .sm\:px-0 {
    padding-left: 0px;
    padding-right: 0px;
  }

  .sm\:px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .sm\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .sm\:py-3 {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .sm\:py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }

  .sm\:py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .sm\:py-7 {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
  }

  .sm\:pb-6 {
    padding-bottom: 1.5rem;
  }

  .sm\:pt-0 {
    padding-top: 0px;
  }

  .sm\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  .sm\:text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }

  .sm\:text-7xl {
    font-size: 4.5rem;
    line-height: 1;
  }

  .sm\:text-xs {
    font-size: 0.75rem;
    line-height: 1rem;
  }

  .sm\:tracking-\[0\.18em\] {
    letter-spacing: 0.18em;
  }
}

@media (min-width: 1024px) {

  .lg\:sticky {
    position: sticky;
  }

  .lg\:top-6 {
    top: 1.5rem;
  }

  .lg\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .lg\:grid-cols-\[1\.05fr_0\.95fr\] {
    grid-template-columns: 1.05fr 0.95fr;
  }

  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_20rem\] {
    grid-template-columns: minmax(0,1fr) 20rem;
  }

  .lg\:px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .lg\:px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

@media (min-width: 1280px) {

  .xl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.rtl\:rotate-180:where([dir="rtl"], [dir="rtl"] *) {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rtl\:space-x-reverse:where([dir="rtl"], [dir="rtl"] *) > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 1;
}