/* Default palette. Set data-theme on the roulette container or an ancestor. */
.hwm_roulette_theme {
   --hwm_roulette_content_background: transparent;
   --hwm_roulette_surface: #f5f3ea;
   --hwm_roulette_surface_muted: #f0ece3;
   --hwm_roulette_input_background: #fff;
   --hwm_roulette_text: #592c08;
   --hwm_roulette_text_muted: #806242;
   --hwm_roulette_border: #b5a28b;
   --hwm_roulette_frame_border: #b19673;
   --hwm_roulette_frame_shadow: rgba(0, 0, 0, 0.25);
   --hwm_roulette_divider: #dfd4c1;
   --hwm_roulette_row_border: #eee4d5;
   --hwm_roulette_header_border: #d4c4af;
   --hwm_roulette_link_hover: #8b521d;
   --hwm_roulette_focus: #91671f;
   --hwm_roulette_link_focus: #a77b3e;
   --hwm_roulette_hover_glow: #ffe4b3;
   --hwm_roulette_button_background: #DAB761;
   --hwm_roulette_button_border_light: #fce6b0;
   --hwm_roulette_button_border: #a78750;
   --hwm_roulette_button_outline: rgba(0, 0, 0, 0.13);
   --hwm_roulette_button_pressed_shadow: rgba(89, 44, 8, 0.35);
   --hwm_roulette_status_shadow: rgba(89, 44, 8, 0.12);
   --hwm_roulette_urgent_border: #d7ad69;
   --hwm_roulette_urgent_background: #fff1db;
   --hwm_roulette_urgent_text: #8b481c;
   --hwm_roulette_number_text: #fff;
   --hwm_roulette_number_red: #b52d2b;
   --hwm_roulette_number_black: #252525;
   --hwm_roulette_number_green: #24723e;
   --hwm_roulette_bet_highlight: rgba(137, 191, 92, 0.4);
   --hwm_roulette_bet_highlight_end: rgba(137, 191, 92, 0);
   --hwm_roulette_bet_highlight_reduced: rgba(137, 191, 92, 0.22);
   --hwm_roulette_board_background: #005C11;
   --hwm_roulette_board_border: #5D413A;
   --hwm_roulette_button_text: #592c08;
   --hwm_roulette_title_text: #86734f;
   --hwm_roulette_title_border: #86734f;
   --hwm_roulette_title_images: url('../i/homeico/bg_header2_l.png'), url('../i/homeico/bg_header2_r.png');
}

/* Dark palette. The gold buttons and roulette number colors are shared. */
[data-theme="dark"] .hwm_roulette_theme,
.hwm_roulette_theme[data-theme="dark"] {
   --hwm_roulette_content_background: #211f1c;
   --hwm_roulette_surface: #292724;
   --hwm_roulette_surface_muted: #33302b;
   --hwm_roulette_input_background: #211f1c;
   --hwm_roulette_text: #e8dfcf;
   --hwm_roulette_text_muted: #c2b49d;
   --hwm_roulette_border: #756753;
   --hwm_roulette_frame_border: var(--hwm_roulette_border);
   --hwm_roulette_frame_shadow: var(--hwm_roulette_status_shadow);
   --hwm_roulette_divider: #51483c;
   --hwm_roulette_row_border: #413b32;
   --hwm_roulette_header_border: #756753;
   --hwm_roulette_link_hover: #f3cb83;
   --hwm_roulette_focus: #e1b65f;
   --hwm_roulette_link_focus: #e1b65f;
   --hwm_roulette_status_shadow: rgba(0, 0, 0, 0.35);
   --hwm_roulette_urgent_border: #a88045;
   --hwm_roulette_urgent_background: #44351f;
   --hwm_roulette_urgent_text: #f3cb83;
   --hwm_roulette_title_text: #c2b49d;
   --hwm_roulette_title_border: #756753;
   --hwm_roulette_title_images: none;
}

#hwm_roulette_form, #hwm_roulette_form .hwm_roulette_content {
   color: var(--hwm_roulette_text);
}
#hwm_roulette_form {
   display: inline;
}
#hwm_roulette_form[data-roulette-mobile="0"] {
   display: block;
   width: 970px;
   margin: 0 auto;
}
#hwm_roulette_form[data-roulette-mobile="0"] .hwm_roulette_content {
   text-align: left;
}
#hwm_roulette_form .hwm_roulette_content {
   width: 774px;
   min-width: 774px;
   max-width: 774px;
   margin: 0 auto;
   background: var(--hwm_roulette_content_background);
}
#hwm_roulette_form .hwm_roulette_board_wrap {
   display: flex;
}
#hwm_roulette_form a {
   color: var(--hwm_roulette_text);
}
#hwm_roulette_form a:hover {
   color: var(--hwm_roulette_link_hover);
}
#hwm_roulette_form .hwm_roulette_board_frame {
   display: table;
   border-collapse: collapse;
   box-sizing: border-box;
   border: 1px solid var(--hwm_roulette_board_border);
}
#hwm_roulette_form .hwm_roulette_board_background {
   display: table;
   border-spacing: 0;
   width: 772px;
   height: 286px;
   background-repeat: no-repeat;
   background-size: contain;
}
/* Keep the original border proportions and native fractional centering. */
#hwm_roulette_form .hwm_roulette_board_background::before,
#hwm_roulette_form .hwm_roulette_board_background::after {
   content: "";
   display: table-cell;
   width: 3px;
}
#hwm_roulette_form .hwm_roulette_board_layout {
   display: table-cell;
   width: 768px;
   padding: 3px 0 1px;
   vertical-align: middle;
}
#hwm_roulette_form .hwm_roulette_board {
   display: grid;
   grid-template-columns: 60px repeat(12, 12px 36px) 12px 60px;
   width: 708px;
   margin: 0 auto;
}
#hwm_roulette_form .hwm_roulette_board_cell {
   position: relative;
   display: flex;
   flex-direction: column;
   justify-content: center;
   min-width: 0;
}
#hwm_roulette_form .hwm_roulette_board_cell_center {
   text-align: center;
}
#hwm_roulette_form .hwm_roulette_board_surface {
   display: table-cell;
   background: var(--hwm_roulette_board_background);
}
.hwm_roulette_board img:hover{
   -webkit-filter: brightness(125%) drop-shadow(0 0 5px var(--hwm_roulette_hover_glow));
   filter: brightness(125%) drop-shadow(0 0 5px var(--hwm_roulette_hover_glow));
}
.hwm_roulette_board img{
   transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -ms-transition-duration:  0.3s;
}

.hwm_roulette_chip {
-webkit-filter:  none !important;
filter: none !important;
}
#hwm_roulette_form .hwm_roulette_panel,
.hwm_roulette_history .hwm_roulette_history_panel {
   margin: 0;
   border: 0;
   background-color: var(--hwm_roulette_surface);
   box-shadow: inset 0 0 0 1px var(--hwm_roulette_frame_border), 0 2px 5px var(--hwm_roulette_frame_shadow);
   color: var(--hwm_roulette_text);
}
#hwm_roulette_form .hwm_roulette_panel {
   display: flex;
   flex-wrap: nowrap;
   justify-content: flex-start;
   padding: 1px;
   font: 12px/1.45 Verdana, Geneva, sans-serif;
}
#hwm_roulette_form .hwm_roulette_panel > div {
   box-sizing: border-box;
   min-width: 0;
   padding: 12px;
}
#hwm_roulette_form .hwm_roulette_panel > div + div {
   border-left: 1px solid var(--hwm_roulette_divider);
}
#hwm_roulette_controls .hwm_roulette_entry {
   flex: 0 0 260px;
}
#hwm_roulette_controls .hwm_roulette_input_row {
   display: flex;
   align-items: center;
   margin-bottom: 8px;
}
#hwm_roulette_controls .hwm_roulette_input_row label {
   flex: 0 0 48px;
   margin-right: 8px;
}
#hwm_roulette_controls .hwm_roulette_amount {
   display: flex;
   align-items: center;
   flex: 1;
   min-width: 0;
}
#hwm_roulette_controls input[type="text"] {
   -webkit-appearance: none;
   appearance: none;
   -webkit-text-fill-color: currentColor;
   box-sizing: border-box;
   flex: 1;
   width: 0;
   min-width: 0;
   height: 25px;
   padding: 2px 8px;
   border: 1px solid var(--hwm_roulette_border);
   border-radius: 4px;
   background: var(--hwm_roulette_input_background);
   color: var(--hwm_roulette_text);
   font: inherit;
}
#hwm_roulette_controls input[readonly] {
   background: var(--hwm_roulette_surface_muted);
}
#hwm_roulette_controls input[type="text"]:focus {
   outline: 2px solid var(--hwm_roulette_focus);
   outline-offset: 1px;
}
#hwm_roulette_controls .hwm_roulette_actions {
   margin-left: 56px;
}
#hwm_roulette_controls .hwm_roulette_info {
   display: flex;
   flex: 1;
   flex-direction: column;
   justify-content: center;
}
#hwm_roulette_controls .hwm_roulette_info_row + .hwm_roulette_info_row {
   margin-top: 6px;
}
#hwm_roulette_controls .hwm_roulette_countdown {
   display: flex;
   align-self: flex-start;
   align-items: center;
   box-sizing: border-box;
   max-width: 100%;
   min-height: 38px;
   padding: 6px 10px;
   border: 1px solid var(--hwm_roulette_divider);
   border-radius: 4px;
   background: var(--hwm_roulette_surface_muted);
   color: var(--hwm_roulette_text_muted);
}
#hwm_roulette_controls .hwm_roulette_countdown_icon {
   flex: none;
   margin-right: 8px;
}
#hwm_roulette_controls .hwm_roulette_countdown_label {
   flex: 1;
   min-width: 0;
   margin-right: 12px;
   font-size: 11px;
   line-height: 1.4;
}
#hwm_roulette_controls .hwm_roulette_countdown_value {
   flex: none;
   color: var(--hwm_roulette_text);
   font-size: 18px;
   font-weight: bold;
   font-variant-numeric: tabular-nums;
   line-height: 24px;
   white-space: nowrap;
}
#hwm_roulette_controls .hwm_roulette_countdown_urgent {
   border-color: var(--hwm_roulette_urgent_border);
   background: var(--hwm_roulette_urgent_background);
   color: var(--hwm_roulette_urgent_text);
}
#hwm_roulette_controls .hwm_roulette_countdown_urgent .hwm_roulette_countdown_value {
   color: var(--hwm_roulette_urgent_text);
}
#hwm_roulette_form .hwm_roulette_price {
   display: inline-flex;
   align-items: center;
   vertical-align: middle;
   white-space: nowrap;
}
#hwm_roulette_form .hwm_roulette_price img {
   margin-right: 4px;
}
#hwm_roulette_controls .hwm_roulette_leaders {
   flex: 0 0 28%;
}
#hwm_roulette_controls .hwm_roulette_leaders_title {
   margin-bottom: 10px;
   text-align: center;
   font-weight: bold;
}
#hwm_roulette_controls .hwm_roulette_leader {
   display: flex;
   align-items: center;
}
#hwm_roulette_controls .hwm_roulette_leader + .hwm_roulette_leader {
   margin-top: 8px;
}
#hwm_roulette_controls .hwm_roulette_award {
   flex: 0 0 30px;
   margin-right: 8px;
}
#hwm_roulette_controls .hwm_roulette_leader_name {
   display: flex;
   align-items: center;
   flex: 1;
   min-width: 0;
   font-weight: bold;
}
#hwm_roulette_controls .hwm_roulette_leader_clan,
#hwm_roulette_controls .hwm_roulette_leader_level {
   flex: none;
}
#hwm_roulette_controls .hwm_roulette_leader_level {
   margin-left: 4px;
}
#hwm_roulette_form .hwm_roulette_nick {
   display: block;
   min-width: 0;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
}
#hwm_roulette_form .hwm_roulette_button {
   -webkit-appearance: none;
   appearance: none;
   -webkit-text-fill-color: currentColor;
   box-sizing: border-box;
   display: inline-block;
   width: auto;
   margin: 0;
   padding: 0 14px;
   border: 0;
   font-size: 12px;
   height: 25px;
   line-height: 25px;
   vertical-align: middle;
   color: var(--hwm_roulette_button_text);
   background-color: var(--hwm_roulette_button_background);
   box-shadow: inset 0 0 0 1px var(--hwm_roulette_button_border_light),
      inset 0 0 0 2px var(--hwm_roulette_button_border), 0 0 0 1px var(--hwm_roulette_button_outline);
   transition: filter 0.15s, box-shadow 0.15s;
}
#hwm_roulette_form .hwm_roulette_quick {
   flex: 0 0 36px;
   width: 36px;
   margin-left: 4px;
   padding: 0;
}
#hwm_roulette_form [data-roulette-submit] {
   width: 100%;
}
#hwm_roulette_form .hwm_roulette_button:enabled:hover {
   -webkit-filter: brightness(115%) drop-shadow(0 0 3px var(--hwm_roulette_hover_glow));
   filter: brightness(115%) drop-shadow(0 0 3px var(--hwm_roulette_hover_glow));
}
#hwm_roulette_form .hwm_roulette_button:enabled:active {
   -webkit-filter: brightness(95%);
   filter: brightness(95%);
   box-shadow: inset 0 0 0 1px var(--hwm_roulette_button_border), inset 0 2px 4px var(--hwm_roulette_button_pressed_shadow);
}
#hwm_roulette_form .hwm_roulette_button:focus {
   outline: 2px solid var(--hwm_roulette_focus);
   outline-offset: 2px;
}
#hwm_roulette_form input:disabled, #hwm_roulette_form button:disabled {
   cursor: default;
   opacity: 0.55;
}
#hwm_roulette_form[data-roulette-busy="true"] input, #hwm_roulette_form[data-roulette-busy="true"] button {
   cursor: wait;
}
#hwm_roulette_status {
   display: flex;
   align-items: center;
   justify-content: center;
   box-sizing: border-box;
   min-height: 48px;
   padding: 8px 12px;
   text-align: center;
}
#hwm_roulette_status .hwm_roulette_status_bubble {
   position: relative;
   box-sizing: border-box;
   max-width: 100%;
   padding: 5px 12px;
   border: 1px solid var(--hwm_roulette_border);
   border-radius: 6px;
   background: var(--hwm_roulette_surface);
   color: var(--hwm_roulette_text);
   box-shadow: 0 2px 4px var(--hwm_roulette_status_shadow);
   font: 12px/20px Verdana, Geneva, sans-serif;
   overflow-wrap: break-word;
}
#hwm_roulette_status .hwm_roulette_status_bubble:before {
   content: '';
   position: absolute;
   top: -5px;
   left: 50%;
   width: 8px;
   height: 8px;
   margin-left: -4px;
   border-top: 1px solid var(--hwm_roulette_border);
   border-left: 1px solid var(--hwm_roulette_border);
   background: var(--hwm_roulette_surface);
   transform: rotate(45deg);
}
#hwm_roulette_status .hwm_roulette_result_number {
   display: inline-block;
   box-sizing: border-box;
   min-width: 24px;
   padding: 0 5px;
   border-radius: 3px;
   color: var(--hwm_roulette_number_text);
   font-weight: bold;
   text-align: center;
   vertical-align: top;
}
#hwm_roulette_status .hwm_roulette_result_red {
   background: var(--hwm_roulette_number_red);
}
#hwm_roulette_status .hwm_roulette_result_black {
   background: var(--hwm_roulette_number_black);
}
#hwm_roulette_status .hwm_roulette_result_green {
   background: var(--hwm_roulette_number_green);
}
#hwm_roulette_status .hwm_roulette_result_winnings {
   display: inline-block;
   margin-left: 8px;
   font-weight: bold;
}
#hwm_roulette_status .hwm_roulette_price {
   vertical-align: top;
}
#hwm_roulette_links {
   margin-bottom: 12px;
}
#hwm_roulette_statistics .hwm_roulette_stat_column {
   flex: 1;
}
#hwm_roulette_statistics .hwm_roulette_stat_all {
   flex: 1.6;
}
#hwm_roulette_statistics .hwm_roulette_stat_title {
   margin-bottom: 12px;
   text-align: center;
   font-weight: bold;
}
#hwm_roulette_statistics .hwm_roulette_stat_row {
   display: flex;
   padding: 8px 0;
   border-bottom: 1px solid var(--hwm_roulette_row_border);
}
#hwm_roulette_statistics .hwm_roulette_stat_row > div {
   box-sizing: border-box;
   min-width: 0;
   padding: 0 6px;
   overflow-wrap: break-word;
}
#hwm_roulette_statistics .hwm_roulette_stat_head {
   margin-bottom: 2px;
   padding: 6px 0;
   border-bottom: 1px solid var(--hwm_roulette_header_border);
   color: var(--hwm_roulette_text_muted);
   font-size: 10px;
   font-weight: bold;
   line-height: 16px;
}
#hwm_roulette_statistics .hwm_roulette_stat_head > div {
   white-space: nowrap;
}
#hwm_roulette_statistics .hwm_roulette_stat_empty {
   display: flex;
   align-items: center;
   justify-content: center;
   box-sizing: border-box;
   min-height: 86px;
   padding: 22px 12px;
   border: 1px dashed var(--hwm_roulette_divider);
   border-radius: 4px;
   color: var(--hwm_roulette_text_muted);
   line-height: 1.6;
   text-align: center;
}
#hwm_roulette_statistics .hwm_roulette_stat_amount {
   flex: 0 0 84px;
   text-align: right;
   font-variant-numeric: tabular-nums;
}
#hwm_roulette_statistics .hwm_roulette_stat_player,
#hwm_roulette_statistics .hwm_roulette_stat_field {
   flex: 1;
}
#hwm_roulette_statistics .hwm_roulette_stat_all .hwm_roulette_stat_amount {
   flex-basis: 64px;
}
/* Preserve the field width so the player name receives the full 20px saved. */
#hwm_roulette_statistics .hwm_roulette_stat_all .hwm_roulette_stat_field {
   flex: 0 0 calc(50% - 42px);
}
#hwm_roulette_controls .hwm_roulette_nick,
#hwm_roulette_statistics .hwm_roulette_stat_player a {
   font-weight: bold;
   text-decoration: none;
}
#hwm_roulette_controls .hwm_roulette_nick:hover,
#hwm_roulette_statistics .hwm_roulette_stat_player a:hover {
   text-decoration: underline;
}
#hwm_roulette_statistics .hwm_roulette_stat_total {
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
   margin-top: 10px;
   padding: 8px 10px;
   border-radius: 4px;
   background: var(--hwm_roulette_surface_muted);
   font-weight: bold;
}
#hwm_roulette_statistics .hwm_roulette_stat_total .hwm_roulette_price {
   margin-left: 8px;
}
#hwm_roulette_statistics .hwm_roulette_stat_note {
   margin-top: 10px;
   color: var(--hwm_roulette_text_muted);
}
#hwm_roulette_statistics .hwm_roulette_bet_new {
   animation: hwm_roulette_bet_appear 350ms ease-out, hwm_roulette_bet_highlight 1600ms ease-out;
}
@keyframes hwm_roulette_bet_appear {
   from { opacity: 0; transform: translateY(-6px); }
   to { opacity: 1; transform: translateY(0); }
}
@keyframes hwm_roulette_bet_highlight {
   0%, 25% { box-shadow: inset 0 0 0 999px var(--hwm_roulette_bet_highlight); }
   100% { box-shadow: inset 0 0 0 999px var(--hwm_roulette_bet_highlight_end); }
}
@media (prefers-reduced-motion: reduce) {
   #hwm_roulette_form .hwm_roulette_button {
      transition: none;
   }
   #hwm_roulette_statistics .hwm_roulette_bet_new {
      animation: none;
      box-shadow: inset 0 0 0 999px var(--hwm_roulette_bet_highlight_reduced);
   }
}

.hwm_roulette_history_page {
   display: flex;
   flex-direction: column;
   width: 970px;
   margin: 0 auto;
}
.hwm_roulette_history {
   box-sizing: border-box;
   width: 100%;
   max-width: 780px;
   min-width: 0;
   margin: 16px auto;
   padding: 0;
   color: var(--hwm_roulette_text);
   font: 12px/1.5 Verdana, Geneva, sans-serif;
   text-align: left;
}
.hwm_roulette_history *,
.hwm_roulette_history *::before,
.hwm_roulette_history *::after {
   box-sizing: border-box;
}
.hwm_roulette_history .hwm_roulette_history_panel {
   display: block;
   position: relative;
   min-width: 0;
   padding: 9px 1px 1px;
}
.hwm_roulette_history .hwm_roulette_history_header {
   padding: 18px 16px;
   border-bottom: 1px solid var(--hwm_roulette_divider);
   text-align: center;
}
.hwm_roulette_history .hwm_roulette_history_title {
   max-width: calc(100% - 24px);
   color: var(--hwm_roulette_title_text);
   border-color: var(--hwm_roulette_title_border);
   background-color: var(--hwm_roulette_surface);
   background-image: var(--hwm_roulette_title_images);
}
.hwm_roulette_history .hwm_roulette_history_title h1 {
   margin: 0;
   color: inherit;
   font: inherit;
}
.hwm_roulette_history h2 {
   margin: 0 0 12px;
   color: var(--hwm_roulette_text);
   font: bold 14px/1.5 Verdana, Geneva, sans-serif;
}
.hwm_roulette_history .hwm_roulette_history_section {
   min-width: 0;
   padding: 16px;
}
.hwm_roulette_history .hwm_roulette_history_section + .hwm_roulette_history_section {
   border-top: 1px solid var(--hwm_roulette_divider);
}
.hwm_roulette_history_list .hwm_roulette_history_spin,
.hwm_roulette_history .hwm_roulette_history_bet {
   display: grid;
   align-items: center;
   column-gap: 14px;
   min-width: 0;
   min-height: 30px;
   padding: 2px 0;
   border-bottom: 1px solid var(--hwm_roulette_row_border);
}
.hwm_roulette_history_list .hwm_roulette_history_spin {
   grid-template-columns: minmax(52px, 1fr) max-content 120px;
}
.hwm_roulette_history .hwm_roulette_history_bet {
   grid-template-columns: 88px minmax(0, 1.2fr) minmax(0, 1fr) 112px;
}
.hwm_roulette_history_list .hwm_roulette_history_spin > div,
.hwm_roulette_history .hwm_roulette_history_bet > div {
   min-width: 0;
   overflow-wrap: break-word;
}
.hwm_roulette_history .hwm_roulette_history_head {
   min-height: 0;
   padding: 0 0 10px;
   border-color: var(--hwm_roulette_header_border);
   color: var(--hwm_roulette_text_muted);
   font-size: 11px;
   font-weight: bold;
}
.hwm_roulette_history .hwm_roulette_history_sort {
   margin: 0;
   padding: 0;
   border: 0;
   background: transparent;
   color: inherit;
   font: inherit;
   cursor: pointer;
   white-space: nowrap;
}
.hwm_roulette_history .hwm_roulette_history_sort:hover {
   color: var(--hwm_roulette_link_hover);
}
.hwm_roulette_history .hwm_roulette_history_sort::after {
   display: inline-block;
   width: 12px;
   margin-left: 3px;
   content: '\2195';
   text-align: center;
}
.hwm_roulette_history .hwm_roulette_history_sort[data-sort-direction="asc"]::after {
   content: '\2191';
}
.hwm_roulette_history .hwm_roulette_history_sort[data-sort-direction="desc"]::after {
   content: '\2193';
}
.hwm_roulette_history .hwm_roulette_history_stake,
.hwm_roulette_history .hwm_roulette_history_winnings {
   text-align: right;
   font-variant-numeric: tabular-nums;
}
.hwm_roulette_history .hwm_roulette_history_ball {
   text-align: center;
}
.hwm_roulette_history_list .hwm_roulette_history_time_link {
   display: inline-flex;
   flex: 1;
   align-items: center;
   min-height: 24px;
   padding: 0 8px;
   font-weight: bold;
   font-variant-numeric: tabular-nums;
}
.hwm_roulette_history_list .hwm_roulette_history_time {
   padding-left: 8px;
}
.hwm_roulette_history_list .hwm_roulette_history_spin:not(.hwm_roulette_history_head):hover,
.hwm_roulette_history .hwm_roulette_history_bet:not(.hwm_roulette_history_head):hover {
   background-color: var(--hwm_roulette_surface_muted);
}
.hwm_roulette_history_list .hwm_roulette_history_spin:not(.hwm_roulette_history_head) .hwm_roulette_history_time {
   display: flex;
   align-self: stretch;
   margin: -2px 0;
   padding-left: 0;
}
.hwm_roulette_history a {
   color: var(--hwm_roulette_text);
   font-size: inherit;
}
.hwm_roulette_history a:hover {
   color: var(--hwm_roulette_link_hover);
}
.hwm_roulette_history a:focus-visible {
   outline: 2px solid var(--hwm_roulette_link_focus);
   outline-offset: 2px;
   border-radius: 2px;
}
.hwm_roulette_history .hwm_roulette_history_nick {
   display: inline-block;
   max-width: 100%;
   vertical-align: top;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   font-weight: bold;
   text-decoration: none;
}
.hwm_roulette_history .hwm_roulette_history_nick:hover {
   text-decoration: underline;
}
.hwm_roulette_history .hwm_roulette_history_money {
   display: inline-flex;
   align-items: center;
   white-space: nowrap;
   font-weight: bold;
   font-variant-numeric: tabular-nums;
}
.hwm_roulette_history .hwm_roulette_history_money img {
   flex: 0 0 16px;
   width: 16px;
   height: 16px;
   margin-right: 4px;
   vertical-align: middle;
}
.hwm_roulette_history .hwm_roulette_history_number {
   display: inline-flex;
   vertical-align: middle;
   align-items: center;
   justify-content: center;
   min-width: 30px;
   min-height: 24px;
   padding: 2px 7px;
   border-radius: 4px;
   background: var(--hwm_roulette_number_green);
   color: var(--hwm_roulette_number_text);
   font-size: 14px;
   line-height: 20px;
}
.hwm_roulette_history .hwm_roulette_history_number_red {
   background: var(--hwm_roulette_number_red);
}
.hwm_roulette_history .hwm_roulette_history_number_black {
   background: var(--hwm_roulette_number_black);
}
.hwm_roulette_history .hwm_roulette_history_result .hwm_roulette_history_number {
   margin-left: 6px;
   min-width: 36px;
   min-height: 32px;
   font-size: 18px;
}
.hwm_roulette_history .hwm_roulette_history_unknown {
   color: var(--hwm_roulette_text_muted);
}
.hwm_roulette_history .hwm_roulette_history_total {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 12px 24px;
   margin-top: 12px;
   padding: 10px 12px;
   border-radius: 4px;
   background: var(--hwm_roulette_surface_muted);
}
.hwm_roulette_history .hwm_roulette_history_total > b {
   flex: 1;
}
.hwm_roulette_history .hwm_roulette_history_total > div {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 4px 8px;
}
.hwm_roulette_history .hwm_roulette_history_total > div > span:first-child {
   color: var(--hwm_roulette_text_muted);
}
.hwm_roulette_history .hwm_roulette_history_empty {
   padding: 24px 12px;
   border: 1px dashed var(--hwm_roulette_divider);
   border-radius: 4px;
   color: var(--hwm_roulette_text_muted);
   text-align: center;
}
.hwm_roulette_history .hwm_roulette_history_nav {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-wrap: wrap;
   gap: 4px 10px;
   padding: 10px 12px;
   border-top: 1px solid var(--hwm_roulette_divider);
}
.hwm_roulette_history .hwm_roulette_history_nav a {
   display: inline-flex;
   align-items: center;
   min-height: 36px;
}
.hwm_roulette_history .hwm_roulette_history_label {
   display: none;
}
@media (max-width: 1000px) {
   .hwm_roulette_history {
      padding: 0 12px;
      padding-left: max(12px, env(safe-area-inset-left));
      padding-right: max(12px, env(safe-area-inset-right));
      font-size: 14px;
   }
   .hwm_roulette_history .hwm_roulette_history_bet {
      grid-template-columns: 76px minmax(0, 1.2fr) minmax(0, 1fr) 100px;
      column-gap: 10px;
   }
}
@media (max-width: 560px) {
   .hwm_roulette_history {
      margin: 16px auto;
      padding: 0 8px;
      padding-left: max(8px, env(safe-area-inset-left));
      padding-right: max(8px, env(safe-area-inset-right));
   }
   .hwm_roulette_history .hwm_roulette_history_header,
   .hwm_roulette_history .hwm_roulette_history_section {
      padding: 14px 12px;
   }
   .hwm_roulette_history_list .hwm_roulette_history_spin {
      grid-template-columns: minmax(48px, 1fr) max-content 72px;
      column-gap: 8px;
   }
   .hwm_roulette_history_list .hwm_roulette_history_time,
   .hwm_roulette_history_list .hwm_roulette_history_time_link {
      padding-left: 0;
      padding-right: 0;
   }
   .hwm_roulette_history .hwm_roulette_history_bet {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 4px 12px;
      padding: 8px 0;
   }
   /* Keep column headers available to assistive technology in the card layout. */
   .hwm_roulette_history .hwm_roulette_history_bets .hwm_roulette_history_head {
      position: absolute;
      width: 1px;
      height: 1px;
      min-height: 0;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      clip-path: inset(50%);
      padding: 0;
      border: 0;
   }
   .hwm_roulette_history .hwm_roulette_history_sortable .hwm_roulette_history_head {
      position: static;
      display: flex;
      justify-content: space-between;
      width: auto;
      height: auto;
      overflow: visible;
      clip: auto;
      clip-path: none;
      padding: 0 0 10px;
      border-bottom: 1px solid var(--hwm_roulette_header_border);
   }
   .hwm_roulette_history .hwm_roulette_history_sortable .hwm_roulette_history_head > div:nth-child(2),
   .hwm_roulette_history .hwm_roulette_history_sortable .hwm_roulette_history_head > div:nth-child(3) {
      display: none;
   }
   .hwm_roulette_history .hwm_roulette_history_player {
      grid-area: 1 / 1 / 2 / 3;
   }
   .hwm_roulette_history .hwm_roulette_history_field {
      grid-area: 2 / 1 / 3 / 3;
   }
   .hwm_roulette_history .hwm_roulette_history_stake {
      grid-area: 3 / 1 / 4 / 2;
      text-align: left;
   }
   .hwm_roulette_history .hwm_roulette_history_bet .hwm_roulette_history_winnings {
      grid-area: 3 / 2 / 4 / 3;
   }
   .hwm_roulette_history .hwm_roulette_history_label {
      display: block;
      margin-bottom: 2px;
      color: var(--hwm_roulette_text_muted);
      font-size: 11px;
   }
   .hwm_roulette_history .hwm_roulette_history_nick {
      display: inline;
      white-space: normal;
      overflow-wrap: anywhere;
   }
   .hwm_roulette_history .hwm_roulette_history_total {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 8px;
   }
   .hwm_roulette_history .hwm_roulette_history_total > b {
      grid-column: 1 / -1;
   }
   .hwm_roulette_history .hwm_roulette_history_total > div {
      display: block;
      min-width: 0;
   }
   .hwm_roulette_history .hwm_roulette_history_total > div:last-child {
      text-align: right;
   }
   .hwm_roulette_history .hwm_roulette_history_total > div > span:first-child {
      display: block;
      margin-bottom: 2px;
      font-size: 11px;
   }
}
@media (max-width: 380px) {
   .hwm_roulette_history .hwm_roulette_history_total {
      display: block;
   }
   .hwm_roulette_history .hwm_roulette_history_total > div {
      display: flex;
      justify-content: space-between;
      margin-top: 6px;
   }
}