@layer components {
    :root {
        --liars-dice-table-light: oklch(1 0 0);
        --liars-dice-table-shade: oklch(0 0 0);
        --liars-dice-table-felt: light-dark(
            oklch(0.5 0.095 158),
            oklch(0.38 0.07 160)
        );
        --liars-dice-table-felt-glow: color-mix(
            in oklch,
            var(--liars-dice-table-felt),
            var(--liars-dice-table-light) 14%
        );
        --liars-dice-table-felt-deep: color-mix(
            in oklch,
            var(--liars-dice-table-felt),
            var(--liars-dice-table-shade) 40%
        );
        --liars-dice-table-wood: light-dark(
            oklch(0.47 0.075 52),
            oklch(0.37 0.06 48)
        );
        --liars-dice-table-wood-light: color-mix(
            in oklch,
            var(--liars-dice-table-wood),
            var(--liars-dice-table-light) 24%
        );
        --liars-dice-table-wood-deep: color-mix(
            in oklch,
            var(--liars-dice-table-wood),
            var(--liars-dice-table-shade) 38%
        );
        --liars-dice-table-brass: oklch(0.78 0.1 82);
        --liars-dice-table-on-felt: oklch(0.98 0.012 150);
        --liars-dice-table-on-felt-muted: oklch(0.94 0.03 150 / 74%);
        --liars-dice-table-ivory: oklch(0.97 0.02 88);
        --liars-dice-table-ink: oklch(0.25 0.02 60);
        --liars-dice-table-seat-0: oklch(0.43 0.07 48);
        --liars-dice-table-seat-1: var(--system-red);
        --liars-dice-table-seat-2: var(--system-blue);
        --liars-dice-table-seat-3: var(--system-purple);
        --liars-dice-table-seat-4: var(--system-orange);
        --liars-dice-table-bubble: light-dark(
            oklch(0.995 0.003 95),
            oklch(0.93 0.012 95)
        );
        --liars-dice-table-bubble-text: oklch(0.22 0.02 60);
        --liars-dice-table-call: light-dark(
            oklch(0.6 0.2 28),
            oklch(0.64 0.19 28)
        );
        --liars-dice-table-match: light-dark(
            oklch(0.82 0.16 88),
            oklch(0.85 0.15 88)
        );
        --liars-dice-table-held: var(--system-green);
        --liars-dice-table-bluff: var(--system-red);
        --liars-dice-table-pill-held: light-dark(
            oklch(0.5 0.13 150),
            oklch(0.47 0.12 150)
        );
        --liars-dice-table-pill-bluff: var(--liars-dice-table-call);
        --liars-dice-table-panel: var(--secondary-system-grouped-background);
        --liars-dice-table-text: var(--label);
        --liars-dice-table-muted: var(--secondary-label);
        --liars-dice-table-separator: var(--separator);
        --liars-dice-table-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.22 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
    }

    .liars-dice-table {
        display: grid;
        gap: 1.25rem;
        grid-template-columns: minmax(0, 1fr);
        inline-size: min(100%, 32rem);
        min-inline-size: 0;
    }

    .liars-dice-table__round {
        color: var(--liars-dice-table-muted);
        font-size: 0.9375rem;
        font-variant-numeric: tabular-nums;
        margin: 0 0 -0.5rem;
    }

    .liars-dice-table__felt {
        aspect-ratio: 1;
        background:
            var(--liars-dice-table-grain) padding-box,
            radial-gradient(
                    130% 95% at 50% 42%,
                    var(--liars-dice-table-felt-glow),
                    var(--liars-dice-table-felt) 52%,
                    var(--liars-dice-table-felt-deep)
                )
                padding-box,
            linear-gradient(
                    170deg,
                    var(--liars-dice-table-wood-light),
                    var(--liars-dice-table-wood) 42%,
                    var(--liars-dice-table-wood-deep)
                )
                border-box;
        border: 0.625rem solid transparent;
        border-radius: 2rem;
        box-shadow:
            inset 0 0.25rem 1.25rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 45%,
                    transparent
                ),
            inset 0 0 0 0.0625rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 30%,
                    transparent
                ),
            0 0.75rem 1.75rem -0.5rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 45%,
                    transparent
                );
        box-sizing: border-box;
        color: var(--liars-dice-table-on-felt);
        display: grid;
        gap: 0.25rem;
        grid-template-rows: auto 1fr auto;
        inline-size: 100%;
        max-block-size: 26rem;
        padding: 0.625rem 0.625rem 0.75rem;
        position: relative;
    }

    .liars-dice-table__seats {
        display: grid;
        gap: 0.25rem;
        grid-auto-columns: minmax(0, 1fr);
        grid-auto-flow: column;
        list-style: none;
        margin: 0;
        padding: 0;
        position: relative;
        z-index: 1;
    }

    .liars-dice-table__seat {
        align-content: start;
        display: grid;
        grid-template-areas: "spot" "name" "style" "bubble";
        justify-items: center;
        min-inline-size: 0;
        text-align: center;

        &.liars-dice-table__seat--out {
            .liars-dice-table__name {
                color: var(--liars-dice-table-on-felt-muted);
                text-decoration: line-through;
            }
        }

        &.liars-dice-table__seat--mine {
            align-items: end;
            column-gap: 0.5rem;
            grid-template-areas: "bubble ." "hand spot";
            grid-template-columns: minmax(0, 1fr) auto;
            padding-block-end: 0.5rem;
            position: relative;
            z-index: 1;
        }
    }

    .liars-dice-table__spot {
        block-size: 3.5rem;
        display: grid;
        grid-area: spot;
        inline-size: 3.5rem;
        place-items: center;
        position: relative;

        .liars-dice-table__seats--2 & {
            block-size: 4rem;
            inline-size: 4rem;
        }

        .liars-dice-table__seats--3 & {
            block-size: 3.75rem;
            inline-size: 3.75rem;
        }

        .liars-dice-table__seat--mine & {
            block-size: 2.75rem;
            inline-size: 2.5rem;
        }
    }

    .liars-dice-table__name {
        font-size: 0.9375rem;
        font-weight: 700;
        grid-area: name;
        line-height: 1.2;
        margin-block-start: 0.25rem;
        max-inline-size: 100%;
        overflow-wrap: anywhere;
        text-shadow: 0 0.0625rem 0.25rem
            color-mix(in oklch, var(--liars-dice-table-shade) 40%, transparent);
    }

    .liars-dice-table__style {
        color: var(--liars-dice-table-on-felt-muted);
        font-size: 0.75rem;
        grid-area: style;
        line-height: 1.2;
    }

    .liars-dice-table__label {
        block-size: 0.0625rem;
        clip-path: inset(50%);
        inline-size: 0.0625rem;
        margin: 0;
        overflow: hidden;
        position: absolute;
        white-space: nowrap;
    }

    .liars-dice-table__empty {
        color: var(--liars-dice-table-on-felt-muted);
        font-size: 0.9375rem;
        grid-area: hand;
        justify-self: center;
        margin: 0;
        min-block-size: 2.75rem;
        place-content: center;
    }

    .liars-dice-table__tally {
        align-items: center;
        background: var(--liars-dice-table-ivory);
        border-radius: 62.5rem;
        box-shadow: 0 0.0625rem 0.25rem
            color-mix(in oklch, var(--liars-dice-table-shade) 35%, transparent);
        color: var(--liars-dice-table-ink);
        display: inline-flex;
        font-size: 0.75rem;
        font-variant-numeric: tabular-nums;
        font-weight: 800;
        inset-block-end: 0.125rem;
        inset-inline-end: -0.25rem;
        justify-content: center;
        min-block-size: 1.375rem;
        min-inline-size: 1.375rem;
        padding-inline: 0.3125rem;
        position: absolute;
        transition: opacity 240ms ease;
        z-index: 1;

        .liars-dice-table__seat--out & {
            background: var(--liars-dice-table-felt-deep);
            color: var(--liars-dice-table-on-felt-muted);
            inset-block-end: -0.125rem;
            inset-inline: 50% auto;
            translate: -50% 0;
        }
    }

    .liars-dice-table__spoken {
        block-size: 0.0625rem;
        clip-path: inset(50%);
        inline-size: 0.0625rem;
        overflow: hidden;
        position: absolute;
        white-space: nowrap;
    }

    .liars-dice-table__cup {
        --liars-dice-table-cup: var(--liars-dice-table-seat-0);

        block-size: 100%;
        inline-size: 100%;
        overflow: visible;
        transition:
            rotate 300ms ease,
            translate 300ms ease;

        &.liars-dice-table__cup--seat-1 {
            --liars-dice-table-cup: var(--liars-dice-table-seat-1);
        }

        &.liars-dice-table__cup--seat-2 {
            --liars-dice-table-cup: var(--liars-dice-table-seat-2);
        }

        &.liars-dice-table__cup--seat-3 {
            --liars-dice-table-cup: var(--liars-dice-table-seat-3);
        }

        &.liars-dice-table__cup--seat-4 {
            --liars-dice-table-cup: var(--liars-dice-table-seat-4);
        }

        &.liars-dice-table__cup--up {
            rotate: -14deg;
            translate: 0 -0.25rem;
        }

        &.liars-dice-table__cup--out {
            opacity: 0.55;
            rotate: -96deg;
            translate: 0 0.5rem;
        }
    }

    .liars-dice-table__cup-shadow {
        fill: color-mix(
            in oklch,
            var(--liars-dice-table-shade) 38%,
            transparent
        );
    }

    .liars-dice-table__cup-body {
        fill: var(--liars-dice-table-cup);
    }

    .liars-dice-table__cup-shine {
        fill: color-mix(
            in oklch,
            var(--liars-dice-table-light) 26%,
            transparent
        );
    }

    .liars-dice-table__cup-band {
        fill: color-mix(
            in oklch,
            var(--liars-dice-table-cup),
            var(--liars-dice-table-shade) 32%
        );
    }

    .liars-dice-table__cup-rim {
        fill: var(--liars-dice-table-brass);
        stroke: color-mix(
            in oklch,
            var(--liars-dice-table-brass),
            var(--liars-dice-table-shade) 35%
        );
        stroke-width: 1.5;
    }

    .liars-dice-table__bubble,
    .liars-dice-table__speech {
        align-items: center;
        background: var(--liars-dice-table-bubble);
        border-radius: 0.875rem;
        box-shadow: 0 0.125rem 0.5rem
            color-mix(in oklch, var(--liars-dice-table-shade) 30%, transparent);
        color: var(--liars-dice-table-bubble-text);
        display: inline-flex;
        font-size: 1rem;
        font-variant-numeric: tabular-nums;
        gap: 0.3125rem;
        line-height: 1;
        margin: 0;
        min-block-size: 1.75rem;
        padding: 0.1875rem 0.5625rem 0.1875rem 0.625rem;
        position: relative;
        white-space: nowrap;

        &::before {
            background: inherit;
            block-size: 0.625rem;
            border-radius: 0.125rem;
            content: "";
            inline-size: 0.625rem;
            inset-block-start: -0.25rem;
            inset-inline-start: calc(50% - 0.3125rem);
            position: absolute;
            rotate: 45deg;
        }
    }

    .liars-dice-table__bubble {
        grid-area: bubble;
        margin-block-start: 0.4375rem;

        &.liars-dice-table__bubble--mine {
            margin-block: 0 0.4375rem;

            &::before {
                inset-block: auto -0.25rem;
            }
        }

        &.liars-dice-table__bubble--empty {
            visibility: hidden;
        }
    }

    .liars-dice-table__speech {
        inset-block-start: 0;
        inset-inline-start: 0;
        position: absolute;
        translate: -50% 0;

        &.liars-dice-table__speech--mine::before {
            inset-block: auto -0.25rem;
        }

        &.liars-dice-table__speech--call {
            background: var(--liars-dice-table-call);
            color: var(--liars-dice-table-on-felt);
            font-weight: 800;
        }
    }

    .liars-dice-table__quantity {
        font-weight: 800;
    }

    .liars-dice-table__centre,
    .liars-dice-table__counter {
        align-content: center;
        display: grid;
        gap: 0.1875rem;
        justify-items: center;
        text-align: center;
    }

    .liars-dice-table__centre {
        min-block-size: 3.5rem;
        position: relative;
        transition: opacity 240ms ease;
        z-index: 1;
    }

    .liars-dice-table__counter {
        color: var(--liars-dice-table-on-felt);
        inset-block-start: 0;
        inset-inline-start: 0;
        position: absolute;
        translate: -50% -50%;
    }

    .liars-dice-table__caption {
        color: var(--liars-dice-table-on-felt-muted);
        font-size: 0.8125rem;
        font-weight: 600;
        margin: 0;

        &.liars-dice-table__caption--prompt {
            color: var(--liars-dice-table-on-felt);
            font-size: 1.125rem;
            font-weight: 700;
        }
    }

    .liars-dice-table__current {
        align-items: center;
        display: inline-flex;
        font-size: 1.875rem;
        font-variant-numeric: tabular-nums;
        gap: 0.5rem;
        line-height: 1;
        margin: 0;
        text-shadow: 0 0.125rem 0.5rem
            color-mix(in oklch, var(--liars-dice-table-shade) 35%, transparent);
    }

    .liars-dice-table__bidder {
        color: var(--liars-dice-table-on-felt);
    }

    .liars-dice-table__verdict-word {
        background: var(--liars-dice-table-pill-held);
        border-radius: 62.5rem;
        box-shadow: 0 0.125rem 0.5rem
            color-mix(in oklch, var(--liars-dice-table-shade) 30%, transparent);
        color: var(--liars-dice-table-on-felt);
        font-size: 0.875rem;
        font-weight: 700;
        margin: 0;
        padding: 0.25rem 0.75rem;

        &.liars-dice-table__verdict-word--bluff {
            background: var(--liars-dice-table-pill-bluff);
        }
    }

    .liars-dice-table__hand {
        display: flex;
        gap: 0.375rem;
        grid-area: hand;
        justify-content: center;
        justify-self: center;
    }

    .liars-dice-table__die {
        --liars-dice-table-die: var(--liars-dice-table-ivory);
        --liars-dice-table-pip: var(--liars-dice-table-ink);
        --liars-dice-table-pip-deep: color-mix(
            in oklch,
            var(--liars-dice-table-pip),
            var(--liars-dice-table-shade) 38%
        );

        aspect-ratio: 1;
        background:
            radial-gradient(
                circle at 28% 22%,
                color-mix(
                    in oklch,
                    var(--liars-dice-table-die),
                    var(--liars-dice-table-light) 45%
                ),
                transparent 55%
            ),
            linear-gradient(
                155deg,
                color-mix(
                    in oklch,
                    var(--liars-dice-table-die),
                    var(--liars-dice-table-light) 10%
                ),
                var(--liars-dice-table-die) 45%,
                color-mix(
                    in oklch,
                    var(--liars-dice-table-die),
                    var(--liars-dice-table-shade) 18%
                )
            );
        border-radius: 24%;
        box-shadow:
            inset 0 -0.125rem 0.125rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 24%,
                    transparent
                ),
            inset 0 0.0625rem 0.0625rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-light) 75%,
                    transparent
                ),
            0 0.125rem 0.25rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 30%,
                    transparent
                ),
            0 0.375rem 0.75rem -0.125rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 35%,
                    transparent
                );
        box-sizing: border-box;
        display: inline-grid;
        flex: none;
        grid-template: repeat(3, 1fr) / repeat(3, 1fr);
        inline-size: 2.25rem;
        padding: 0.3375rem;
        vertical-align: middle;

        &.liars-dice-table__die--seat-1,
        &.liars-dice-table__die--seat-2,
        &.liars-dice-table__die--seat-3,
        &.liars-dice-table__die--seat-4 {
            --liars-dice-table-pip: var(--liars-dice-table-ivory);
            --liars-dice-table-pip-deep: color-mix(
                in oklch,
                var(--liars-dice-table-ivory),
                var(--liars-dice-table-shade) 10%
            );
        }

        &.liars-dice-table__die--seat-1 {
            --liars-dice-table-die: var(--liars-dice-table-seat-1);
        }

        &.liars-dice-table__die--seat-2 {
            --liars-dice-table-die: var(--liars-dice-table-seat-2);
        }

        &.liars-dice-table__die--seat-3 {
            --liars-dice-table-die: var(--liars-dice-table-seat-3);
        }

        &.liars-dice-table__die--seat-4 {
            --liars-dice-table-die: var(--liars-dice-table-seat-4);
        }

        &.liars-dice-table__die--large {
            inline-size: 2.75rem;
            padding: 0.4125rem;
        }

        &.liars-dice-table__die--small {
            border-radius: 22%;
            inline-size: 1.5rem;
            padding: 0.195rem;
        }

        &.liars-dice-table__die--glyph {
            border-radius: 22%;
            box-shadow:
                inset 0 -0.0625rem 0.0625rem
                    color-mix(
                        in oklch,
                        var(--liars-dice-table-shade) 22%,
                        transparent
                    ),
                0 0.0625rem 0.125rem
                    color-mix(
                        in oklch,
                        var(--liars-dice-table-shade) 35%,
                        transparent
                    );
            inline-size: 1.125rem;
            padding: 0.135rem;
        }

        &.liars-dice-table__die--token {
            inline-size: 1.75rem;
            padding: 0.2625rem;
        }

        &.liars-dice-table__die--match {
            box-shadow:
                0 0 0 0.125rem var(--liars-dice-table-match),
                0 0 0.625rem 0.125rem var(--liars-dice-table-match);
            translate: 0 -0.125rem;
        }

        &.liars-dice-table__die--lost {
            opacity: 0.4;
            position: relative;

            &::after {
                background: var(--liars-dice-table-bluff);
                block-size: 0.1875rem;
                border-radius: 0.125rem;
                content: "";
                inset-block-start: calc(50% - 0.09375rem);
                inset-inline: -0.1875rem;
                position: absolute;
                rotate: -35deg;
            }
        }
    }

    .liars-dice-table__pip {
        aspect-ratio: 1;
        background: radial-gradient(
            circle at 50% 38%,
            var(--liars-dice-table-pip-deep),
            var(--liars-dice-table-pip) 78%
        );
        border-radius: 50%;
        box-shadow:
            inset 0 0.0625rem 0.0625rem
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 45%,
                    transparent
                ),
            0 0.0625rem 0
                color-mix(
                    in oklch,
                    var(--liars-dice-table-light) 50%,
                    transparent
                );
        margin: 13%;

        &.liars-dice-table__pip--tl {
            grid-area: 1 / 1;
        }

        &.liars-dice-table__pip--tr {
            grid-area: 1 / 3;
        }

        &.liars-dice-table__pip--ml {
            grid-area: 2 / 1;
        }

        &.liars-dice-table__pip--c {
            grid-area: 2 / 2;
        }

        &.liars-dice-table__pip--mr {
            grid-area: 2 / 3;
        }

        &.liars-dice-table__pip--bl {
            grid-area: 3 / 1;
        }

        &.liars-dice-table__pip--br {
            grid-area: 3 / 3;
        }
    }

    .liars-dice-table__stage {
        border-radius: 1.375rem;
        inset: 0;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        transition: opacity 360ms ease;
        z-index: 0;

        &::after {
            background: radial-gradient(
                125% 95% at 50% 42%,
                transparent 58%,
                color-mix(
                    in oklch,
                    var(--liars-dice-table-shade) 32%,
                    transparent
                )
            );
            border-radius: inherit;
            content: "";
            inset: 0;
            position: absolute;
        }

        &.liars-dice-table__stage--live {
            opacity: 1;
        }
    }

    .liars-dice-table__swatches {
        display: none;
    }

    .liars-dice-table__swatch {
        &.liars-dice-table__swatch--felt {
            color: var(--liars-dice-table-felt);
        }

        &.liars-dice-table__swatch--ivory {
            color: var(--liars-dice-table-ivory);
        }

        &.liars-dice-table__swatch--ink {
            color: var(--liars-dice-table-ink);
        }

        &.liars-dice-table__swatch--brass {
            color: var(--liars-dice-table-brass);
        }

        &.liars-dice-table__swatch--match {
            color: var(--liars-dice-table-match);
        }

        &.liars-dice-table__swatch--seat-0 {
            color: var(--liars-dice-table-seat-0);
        }

        &.liars-dice-table__swatch--seat-1 {
            color: var(--liars-dice-table-seat-1);
        }

        &.liars-dice-table__swatch--seat-2 {
            color: var(--liars-dice-table-seat-2);
        }

        &.liars-dice-table__swatch--seat-3 {
            color: var(--liars-dice-table-seat-3);
        }

        &.liars-dice-table__swatch--seat-4 {
            color: var(--liars-dice-table-seat-4);
        }
    }

    .liars-dice-table__speech,
    .liars-dice-table__counter,
    .liars-dice-table__verdict-word {
        &[hidden] {
            display: none;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .liars-dice-table__stage,
        .liars-dice-table__cup,
        .liars-dice-table__tally,
        .liars-dice-table__centre,
        .liars-dice-table__reveal,
        .liars-dice-table__recent {
            transition: none;
        }
    }

    .liars-dice-table__canvas {
        block-size: 100%;
        border-radius: inherit;
        display: block;
        inline-size: 100%;
    }

    .liars-dice-table__overlay {
        inset: 0;
        position: absolute;
        z-index: 2;
    }

    .liars-dice-table--scene {
        .liars-dice-table__cup,
        .liars-dice-table__hand,
        .liars-dice-table__bubble {
            visibility: hidden;
        }
    }

    .liars-dice-table--telling {
        .liars-dice-table__centre,
        .liars-dice-table__tally,
        .liars-dice-table__reveal,
        .liars-dice-table__recent {
            opacity: 0;
        }
    }

    .liars-dice-table__reveal {
        background: var(--liars-dice-table-panel);
        border-radius: 1rem;
        display: grid;
        gap: 0.5rem;
        padding: 0.875rem 1rem 1rem;
        transition: opacity 300ms ease;
    }

    .liars-dice-table__heading {
        color: var(--liars-dice-table-muted);
        font-size: 0.9375rem;
        font-weight: 600;
        margin: 0;
    }

    .liars-dice-table__summary {
        color: var(--liars-dice-table-text);
        margin: 0;
    }

    .liars-dice-table__verdict {
        color: var(--liars-dice-table-text);
        font-weight: 700;
        margin: 0 0 0.25rem;

        &.liars-dice-table__verdict--good {
            color: var(--liars-dice-table-held);
        }

        &.liars-dice-table__verdict--bad {
            color: var(--liars-dice-table-bluff);
        }
    }

    .liars-dice-table__row {
        align-items: center;
        display: grid;
        gap: 0.5rem;
        grid-template-columns: 4.5rem 1fr;
        min-block-size: 2rem;
    }

    .liars-dice-table__who {
        color: var(--liars-dice-table-text);
        font-weight: 600;

        .liars-dice-table__row--loser & {
            color: var(--liars-dice-table-bluff);
        }
    }

    .liars-dice-table__shown {
        display: flex;
        flex-wrap: wrap;
        gap: 0.375rem;
    }

    .liars-dice-table__recent {
        display: grid;
        gap: 0.5rem;
        transition: opacity 300ms ease;
    }

    .liars-dice-table__log {
        display: grid;
        gap: 0.375rem;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .liars-dice-table__line {
        align-items: baseline;
        color: var(--liars-dice-table-muted);
        display: grid;
        font-size: 0.9375rem;
        gap: 0.5rem;
        grid-template-columns: 0.5rem 1fr;

        &:last-child {
            color: var(--liars-dice-table-text);
            font-weight: 600;
        }

        &.liars-dice-table__line--reveal {
            border-block-end: 0.0625rem solid var(--liars-dice-table-separator);
            color: var(--liars-dice-table-text);
            font-weight: 600;
            padding-block-end: 0.375rem;
        }
    }

    .liars-dice-table__dot {
        background: var(--liars-dice-table-seat-0);
        block-size: 0.5rem;
        border-radius: 50%;
        inline-size: 0.5rem;
        translate: 0 -0.0625rem;

        &.liars-dice-table__dot--1 {
            background: var(--liars-dice-table-seat-1);
        }

        &.liars-dice-table__dot--2 {
            background: var(--liars-dice-table-seat-2);
        }

        &.liars-dice-table__dot--3 {
            background: var(--liars-dice-table-seat-3);
        }

        &.liars-dice-table__dot--4 {
            background: var(--liars-dice-table-seat-4);
        }
    }
}
