.wrap.svelte-jyarsh {
    position: absolute;
    bottom: calc(100% - 1px);
    left: calc(1.5em + 4px);
    right: calc(1.5em + 4px)
}

.content.svelte-jyarsh {
    position: absolute;
    text-align: center;
    transform: translate(-50%)
}

.content.svelte-jyarsh:after {
    content: "";
    bottom: 0;
    position: absolute;
    transform: translate(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid var(--grey-400)
}

.value.svelte-jyarsh {
    position: absolute;
    font-weight: 600;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, -50%)
}

.classic-slider.svelte-11s98e9 {
    -webkit-appearance: none;
    width: 100%;
    position: absolute;
    z-index: 10;
    background: #0000;
    top: 0;
    height: var(--slider-height);
    pointer-events: none
}

.classic-slider.svelte-11s98e9:focus {
    outline: none
}

.classic-slider.svelte-11s98e9::-webkit-slider-runnable-track {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9::-moz-range-track {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9::-ms-track {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9::-webkit-slider-thumb {
    margin-top: calc(var(--slider-height) * -1);
    height: var(--drag-size);
    width: var(--drag-size);
    border: none;
    background-color: var(--blue-400);
    background-image: var(--lines-asset);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    cursor: grab;
    -webkit-appearance: none;
    border-radius: var(--border-radius-base);
    box-shadow: var(--shadows-md);
    transform: translateY(calc(var(--slider-height) * -1));
    pointer-events: auto
}

.classic-slider.svelte-11s98e9::-webkit-slider-thumb:active {
    cursor: grabbing
}

.classic-slider.svelte-11s98e9::-moz-range-thumb {
    height: var(--drag-size);
    width: var(--drag-size);
    border: none;
    background-color: var(--blue-400);
    background-image: var(--lines-asset);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    cursor: grab;
    -webkit-appearance: none;
    border-radius: var(--border-radius-base);
    box-shadow: var(--shadows-md);
    transform: translateY(calc(var(--slider-height) * -1));
    pointer-events: auto
}

.classic-slider.svelte-11s98e9::-moz-range-thumb:active {
    cursor: grabbing
}

.classic-slider.svelte-11s98e9::-ms-thumb {
    height: var(--drag-size);
    width: var(--drag-size);
    border: none;
    background-color: var(--blue-400);
    background-image: var(--lines-asset);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    cursor: grab;
    -webkit-appearance: none;
    border-radius: var(--border-radius-base);
    box-shadow: var(--shadows-md);
    transform: translateY(calc(var(--slider-height) * -1));
    pointer-events: auto
}

.classic-slider.svelte-11s98e9::-ms-thumb:active {
    cursor: grabbing
}

.classic-slider.svelte-11s98e9::-ms-fill-lower {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9::-ms-fill-upper {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9:focus::-webkit-slider-runnable-track {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9:focus::-ms-fill-lower {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9:focus::-ms-fill-upper {
    width: 100%;
    height: var(--slider-height);
    cursor: pointer;
    background: #0000;
    border: none;
    pointer-events: none
}

.classic-slider.svelte-11s98e9:disabled::-webkit-slider-runnable-track {
    cursor: not-allowed
}

.classic-slider.svelte-11s98e9:disabled::-moz-range-track {
    cursor: not-allowed
}

.classic-slider.svelte-11s98e9:disabled::-ms-track {
    cursor: not-allowed
}

.classic-slider.svelte-11s98e9:disabled::-webkit-slider-thumb {
    cursor: not-allowed
}

.classic-slider.svelte-11s98e9:disabled::-moz-range-thumb {
    cursor: not-allowed
}

.classic-slider.svelte-11s98e9:disabled::-ms-thumb {
    cursor: not-allowed
}

.classic-slider.svelte-11s98e9:disabled::-ms-fill-lower {
    cursor: not-allowed
}

.classic-slider.svelte-11s98e9:disabled::-ms-fill-upper {
    cursor: not-allowed
}

.wrap.svelte-11s98e9 {
    position: relative;
    width: 100%;
    max-width: var(--max-game-board-width);
    border-radius: 100px;
    padding: var(--spacingEm-1-5);
    background: var(--grey-400);
    text-align: left;
    margin: 4em 0;
    box-shadow: var(--shadows-md)
}

.content.svelte-11s98e9 {
    position: relative;
    height: var(--slider-height)
}

.range.svelte-11s98e9 {
    pointer-events: none;
    height: var(--slider-height);
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border-radius: 100px;
    box-shadow: 0 0 0 10px var(--grey-700);
    transition: opacity .3s;
    overflow: hidden
}

.lower.svelte-11s98e9 {
    position: absolute;
    height: var(--slider-height);
    width: 100%;
    right: 0;
    top: 0;
    border-radius: 100px
}

.lower.above.svelte-11s98e9 {
    background: var(--green-500)
}

.lower.below.svelte-11s98e9 {
    background: var(--red-500)
}

.higher.svelte-11s98e9 {
    position: absolute;
    height: var(--slider-height);
    top: 0;
    left: 0;
    border-radius: 100px
}

.higher.above.svelte-11s98e9 {
    background: var(--red-500)
}

.higher.below.svelte-11s98e9 {
    background: var(--green-500)
}

.translate-x.svelte-3ojd3c {
    position: absolute;
    display: flex;
    bottom: 50%;
    left: 0;
    right: 0;
    z-index: 5;
    pointer-events: none;
    transition: transform var(--dice-slide-transition);
    will-change: transform
}

@keyframes svelte-3ojd3c-expand {
    50% {
        transform: scale(1.1) translate(-50%)
    }
}

.hide-show.svelte-3ojd3c {
    position: relative;
    transform: translate(-50%);
    transition: all var(--dice-scale-transition);
    transform-origin: center bottom
}

.hide-show.positive.svelte-3ojd3c,
.hide-show.negative.svelte-3ojd3c {
    animation: svelte-3ojd3c-expand var(--dice-scale-transition)
}

.hide-show.is-hidden.svelte-3ojd3c {
    transform: translate(-50%) scale(.8);
    opacity: 0
}

.result.svelte-3ojd3c {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-shadow: 0 1px 0 #fff;
    font-weight: 600;
    transition: var(--dice-result-transition)
}

.result.positive.svelte-3ojd3c {
    color: var(--green-600)
}

.result.negative.svelte-3ojd3c {
    color: var(--red-500)
}

.result.neutral.svelte-3ojd3c {
    color: var(--grey-200)
}

.dice.svelte-3ojd3c {
    width: 7ch;
    height: auto;
    filter: drop-shadow(0 0 3px rgba(25, 25, 25, .1))
}