:root{--main-bg-color: darkslategrey;--main-text-color: white;--dark-text-color: black;--border-color: black;--correct-color: darkseagreen;--incorrect-color: rosybrown;--diamond-color: cornflowerblue;--heart-color: indianred;--club-color: seagreen;--spade-color: darkgrey;--player-bg-color: grey;--player-text-color: antiquewhite;--dealer-bg-color: burlywood;--dealer-text-color: darkred;--hero-bg-color: darkred;--progress-bar-bg-color: antiquewhite;--progress-bar-text-color: darkred;--progress-bar-progress-bg-color: burlywood;--button-bg-color: darkred;--button-text-color: white;--history-bg-color: darkslategrey;--history-text-color: white;--combo-border-color: burlywood;--current-score-text-color: gold;--call-bg-color: seagreen;--bet-bg-color: indianred;--fold-bg-color: grey;--fold-text-color: burlywood;--challenge-list-bg-color: grey;--challenge-list-text-color: burlywood;--challenge-list-item-hover-bg-color: burlywood;--legend-bg-color: burlywood;--player-size: 60px;--settings-width: 180px}@keyframes fade-out-animation{0%{opacity:1}to{opacity:0}}body{font-family:Arial,sans-serif;background-color:var(--main-bg-color);color:var(--main-text-color);margin-left:0}ul{list-style:none;margin:0;padding:0}#version{font-size:.8em}#range-trainer{display:flex;justify-content:start;gap:2em}#range-trainer .container{margin-bottom:1em}#range-trainer .correct-bg-color{background-color:var(--correct-color)}#range-trainer .incorrect-bg-color{background-color:var(--incorrect-color)}#range-trainer .correct-text-color{color:var(--correct-color)}#range-trainer .incorrect-text-color{color:var(--incorrect-color)}#range-trainer #game-setup #settings{position:relative;left:calc(var(--settings-width) * -1);padding:10px 10px 0 0;transition-property:left;transition-duration:.3s;transition-timing-function:steps(16,end);background-color:var(--challenge-list-bg-color);color:var(--challenge-list-text-color);z-index:1;border-radius:0 1% 1% 0;width:var(--settings-width)}#range-trainer #game-setup #settings #settings-toggle{display:block;position:absolute;height:208px;width:20px;top:20px;left:var(--settings-width);rotate:180deg;line-height:20px;text-align:center;writing-mode:vertical-rl;border:solid 1px white;border-radius:20px 10px 10px 20px;color:var(--dark-text-color);background-color:var(--legend-bg-color);cursor:pointer}#range-trainer #game-setup #settings.shown{left:-5px}#range-trainer #game-setup #settings #challenges{width:100%}#range-trainer #game-setup #settings #challenges .category .category-header{cursor:pointer;display:flex;justify-content:right;align-items:center;margin:0 5px 0 0;font-weight:700;text-transform:uppercase;border-radius:5px;background-color:#000}#range-trainer #game-setup #settings #challenges .category .category-header .category-label{width:100%;text-align:center;cursor:pointer}#range-trainer #game-setup #settings #challenges .category .category-header .category-checkbox{width:20px;height:20px;cursor:pointer}#range-trainer #game-setup #settings #challenges .category .challenge-list{margin:0 6px 0 0}#range-trainer #game-setup #settings #challenges .category .challenge-list .challenge{display:flex;align-items:center;cursor:pointer}#range-trainer #game-setup #settings #challenges .category .challenge-list .challenge .challenge-label{display:inline-block;text-align:right;width:100%;cursor:pointer}#range-trainer #game-setup #settings #challenges .category .challenge-list .challenge .challenge-checkbox{width:16px;height:16px;cursor:pointer}#range-trainer #game-setup #settings #challenges .category .challenge-list .challenge:hover{background-color:var(--challenge-list-item-hover-bg-color);color:var(--main-text-color)}#range-trainer #table{display:flex;flex-direction:row-reverse;justify-content:center;gap:1em}#range-trainer #table .player{display:flex;flex-direction:column;justify-content:center;gap:2px;align-items:center;color:var(--player-text-color)}#range-trainer #table .player.hero .avatar{background-color:var(--hero-bg-color)}#range-trainer #table .player .position{display:flex;justify-content:center;align-items:center}#range-trainer #table .player .position.dealer{width:20px;height:20px;border-radius:50%;text-align:center;background-color:var(--dealer-bg-color);color:var(--dealer-text-color)}#range-trainer #table .player .avatar{width:var(--player-size);height:var(--player-size);background-color:var(--player-bg-color);border-radius:50%;border:solid 1px var(--border-color)}#range-trainer #table .player .avatar.folded{opacity:.5}#range-trainer #table .player .action{display:flex;justify-content:center;align-items:center;background-color:var(--player-bg-color);border:solid 1px var(--border-color);width:var(--player-size);height:20px}#range-trainer #cards{display:flex;justify-content:center;align-items:center;gap:1em}#range-trainer #cards .card{display:flex;justify-content:center;align-items:center;width:100px;height:140px;border:1px solid var(--border-color);border-radius:5%}#range-trainer #cards .card.d{background-color:var(--diamond-color)}#range-trainer #cards .card.h{background-color:var(--heart-color)}#range-trainer #cards .card.c{background-color:var(--club-color)}#range-trainer #cards .card.s{background-color:var(--spade-color)}#range-trainer #cards .card .card-value,#range-trainer #cards .card .card-suit{font-size:4em}#range-trainer #feedback{display:flex;justify-content:center;position:relative}#range-trainer #feedback .thumb{opacity:0;position:absolute;top:-1.5em;font-size:5em}#range-trainer #feedback .fade-out{animation-name:fade-out-animation;animation-duration:1s}#range-trainer #feedback #thumb-up{left:0}#range-trainer #feedback #thumb-down{right:0}#range-trainer #progress-bar{display:flex;justify-content:center}#range-trainer #progress-bar #progress-bar-bg{position:relative;background-color:var(--progress-bar-bg-color);border:solid 1px var(--border-color);width:100%;height:20px}#range-trainer #progress-bar #progress-bar-bg #progress-bar-progress{background-color:var(--progress-bar-progress-bg-color);height:100%;width:50%}#range-trainer #progress-bar #progress-bar-bg #progress-bar-text{position:absolute;top:0;width:100%;text-align:center;transform:translate(0);color:var(--progress-bar-text-color)}#range-trainer #actions{display:flex;justify-content:center;gap:1em}#range-trainer #actions .action-button{border:1px solid var(--border-color);background-color:var(--button-bg-color);color:var(--button-text-color);cursor:pointer;width:100px;height:50px}#range-trainer #actions .action-button:focus{border:5px solid var(--main-bg-color)}#range-trainer #histories{display:flex;justify-content:center;gap:1em;height:400px;width:100%}#range-trainer #histories .history{overflow-y:scroll;scrollbar-color:var(--history-text-color) var(--history-bg-color);overflow-x:hidden;list-style:none;background-color:var(--history-bg-color);border:solid 1px var(--border-color);width:200px;height:350px;padding:0;margin:0}#range-trainer #grid-legend{display:flex;justify-content:center;text-align:center;line-height:30px;gap:1em}#range-trainer #grid-legend .grid-legend-item{width:30px;height:30px}#range-trainer #grid-legend .fold{background-color:var(--fold-bg-color);color:var(--fold-text-color)}#range-trainer #grid-legend .call{background-color:var(--call-bg-color)}#range-trainer #grid-legend .bet{background-color:var(--bet-bg-color)}#range-trainer #combo-grid{display:grid;grid-template-columns:repeat(13,30px);grid-template-rows:repeat(13,30px)}#range-trainer #combo-grid .combo{display:flex;justify-content:center;align-items:center;border:solid 1px var(--combo-border-color);height:30px;width:30px}#range-trainer #combo-grid .call{background-color:var(--call-bg-color)}#range-trainer #combo-grid .bet{background-color:var(--bet-bg-color)}#range-trainer #combo-grid .fold{background-color:var(--fold-bg-color);color:var(--fold-text-color)}#range-trainer #score #high-score-label{display:flex;justify-content:center;font-size:1em}#range-trainer #score #high-score{font-size:5em;text-align:center}#range-trainer #score #current-score-label{display:flex;justify-content:center;font-size:1em}#range-trainer #score #current-score{transform:scale(.1);font-size:20em;color:var(--current-score-text-color)}
