/* M18.7C.7 unified game visual experience */
html[data-game-visual-theme="classic"] { --game-accent:#495057; --game-accent-2:#adb5bd; --game-ball-text:#fff; }
html[data-game-visual-theme="indigo"] { --game-accent:#4f46e5; --game-accent-2:#8b5cf6; --game-ball-text:#fff; }
html[data-game-visual-theme="emerald"] { --game-accent:#047857; --game-accent-2:#10b981; --game-ball-text:#fff; }
html[data-game-visual-theme="ruby"] { --game-accent:#be123c; --game-accent-2:#fb7185; --game-ball-text:#fff; }
html[data-game-visual-theme="amber"] { --game-accent:#b45309; --game-accent-2:#f59e0b; --game-ball-text:#111827; }
html[data-game-visual-theme="neon"] { --game-accent:#06b6d4; --game-accent-2:#d946ef; --game-ball-text:#07111f; }
html[data-game-visual-theme="contrast"] { --game-accent:#000; --game-accent-2:#ffeb00; --game-ball-text:#fff; }
.current-number-card { border-top:4px solid var(--game-accent) !important; background:linear-gradient(145deg, color-mix(in srgb, var(--game-accent) 10%, var(--bs-body-bg)), var(--bs-body-bg)); }
.current-number { background:linear-gradient(145deg,var(--game-accent),var(--game-accent-2)) !important; color:var(--game-ball-text) !important; }
.number-cell--called { background:var(--game-accent) !important; color:var(--game-ball-text) !important; border-color:var(--game-accent) !important; }
html[data-colored-balls="true"] [data-number-range="1"] { --range-color:#dc3545; }
html[data-colored-balls="true"] [data-number-range="2"] { --range-color:#fd7e14; }
html[data-colored-balls="true"] [data-number-range="3"] { --range-color:#ffc107; --range-text:#212529; }
html[data-colored-balls="true"] [data-number-range="4"] { --range-color:#198754; }
html[data-colored-balls="true"] [data-number-range="5"] { --range-color:#20c997; --range-text:#212529; }
html[data-colored-balls="true"] [data-number-range="6"] { --range-color:#0d6efd; }
html[data-colored-balls="true"] [data-number-range="7"] { --range-color:#4f46e5; }
html[data-colored-balls="true"] [data-number-range="8"] { --range-color:#6f42c1; }
html[data-colored-balls="true"] [data-number-range="9"] { --range-color:#d63384; }
html[data-colored-balls="true"] .number-cell--called,
html[data-colored-balls="true"] .current-number,
html[data-colored-balls="true"] .recent-number { background:var(--range-color) !important; color:var(--range-text,#fff) !important; border-color:var(--range-color) !important; }
.tambola-ticket { grid-auto-rows:auto !important; }
.tambola-ticket .ticket-cell { position:relative; aspect-ratio:1 / 1; min-width:0; display:grid; place-items:center; font-size:clamp(.72rem,2.5vw,1.05rem); }
.ticket-cell--marked::after {
    position:absolute;
    inset-block-start:50%;
    inset-inline-start:50%;
    display:grid;
    place-items:center;
    min-width:1.35em;
    min-height:1.35em;
    transform:translate(-50%,-50%);
    font-size:clamp(1rem,4vw,1.5rem);
    line-height:1;
    font-weight:900;
    opacity:.42;
    pointer-events:none;
}
html[data-marked-cell-style="check"] .ticket-cell--marked::after { content:"✓"; }
html[data-marked-cell-style="check-circle"] .ticket-cell--marked::after { content:"✓"; border:2px solid currentColor; border-radius:50%; font-size:clamp(.75rem,3vw,1.05rem); }
html[data-marked-cell-style="dot"] .ticket-cell--marked::after { content:"●"; font-size:clamp(1rem,4vw,1.45rem); }
html[data-marked-cell-style="star"] .ticket-cell--marked::after { content:"★"; }
html[data-marked-cell-style="diamond"] .ticket-cell--marked::after { content:"◆"; }
html[data-marked-cell-style="stamp"] .ticket-cell--marked::after { content:"✓"; border:2px solid currentColor; padding:.08em; transform:translate(-50%,-50%) rotate(-12deg); }
html[data-marked-cell-style="ring"] .ticket-cell--marked::after { content:""; width:1.35em; height:1.35em; border:3px solid currentColor; border-radius:50%; }
html[data-marked-cell-style="highlight"] .ticket-cell--marked::after,
html[data-marked-cell-style="none"] .ticket-cell--marked::after { content:none; }
html[data-show-number-board="false"] [data-game-number-board] { display:none !important; }
html[data-hide-board-before-start="true"] [data-game-status="Selling"] [data-game-number-board],
html[data-hide-board-before-start="true"] [data-game-status="Locked"] [data-game-number-board],
html[data-hide-board-before-start="true"] [data-game-status="Countdown"] [data-game-number-board] { display:none !important; }
.ticket-marker-preview {
    position:relative;
    display:grid;
    place-items:center;
    flex:0 0 3rem;
    width:3rem;
    height:3rem;
    border:1px solid var(--bs-border-color);
    border-radius:.5rem;
    background:var(--bs-tertiary-bg);
    font-weight:700;
}
html[data-interface-density="compact"] .live-room .card-body { padding:.75rem; }
html[data-interface-density="compact"] .live-room .gap-3 { gap:.5rem !important; }
html[data-high-contrast="true"] .current-number,
html[data-high-contrast="true"] .number-cell--called,
html[data-high-contrast="true"] .ticket-cell--marked {
    outline:2px solid currentColor;
    outline-offset:2px;
}
/* M18.7C.7.4 retained display preferences */
html[data-show-recent-numbers="false"] .recent-numbers,
html[data-show-recent-numbers="false"] .recent-number { display:none !important; }
html[data-show-prize-progress="false"] .prize-progress,
html[data-show-prize-progress="false"] .prize-tracker { display:none !important; }
html[data-ticket-number-colors="true"] .tambola-ticket .ticket-cell[data-number-range] {
    border-color:var(--range-color) !important;
}
html[data-ticket-number-colors="true"] .tambola-ticket .ticket-cell[data-number-range]:not(.ticket-cell--marked) {
    background:color-mix(in srgb,var(--range-color) 16%,transparent) !important;
}
/* M18.7C.7.5 functional prize progress */
.prize-progress .progress {
    height:.5rem;
}
.prize-progress .progress-bar {
    background:linear-gradient(90deg,var(--game-accent),var(--game-accent-2));
}

/* M18.7C.7.7 visual setting previews */
html[data-marked-cell-style="none"] .ticket-cell--marked {
    background:inherit !important;
    color:inherit !important;
    box-shadow:none !important;
}
.visual-choice-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(8.25rem,1fr));
    gap:.75rem;
}
.visual-choice {
    position:relative;
    display:flex;
    min-width:0;
    min-height:6.5rem;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:.45rem;
    padding:.75rem;
    color:var(--bs-body-color);
    text-align:center;
    background:var(--bs-body-bg);
    border:1px solid var(--bs-border-color);
    border-radius:var(--bs-border-radius-lg);
    transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease;
}
.visual-choice:hover {
    border-color:color-mix(in srgb,var(--bs-primary) 60%,var(--bs-border-color));
    transform:translateY(-1px);
}
.visual-choice:focus-visible {
    outline:3px solid color-mix(in srgb,var(--bs-primary) 35%,transparent);
    outline-offset:2px;
}
.visual-choice--selected {
    border-color:var(--bs-primary);
    box-shadow:0 0 0 .2rem color-mix(in srgb,var(--bs-primary) 18%,transparent);
}
.visual-choice__name { font-size:.875rem; font-weight:700; line-height:1.15; }
.visual-choice__description { color:var(--bs-secondary-color); font-size:.72rem; line-height:1.2; }
.visual-choice__selected {
    position:absolute;
    inset-block-start:.4rem;
    inset-inline-end:.45rem;
    display:none;
    color:var(--bs-primary);
}
.visual-choice--selected .visual-choice__selected { display:block; }
.theme-preview {
    display:flex;
    width:4.75rem;
    height:2.25rem;
    overflow:hidden;
    border:1px solid color-mix(in srgb,currentColor 20%,transparent);
    border-radius:999px;
}
.theme-preview span { flex:1; }
.theme-preview span:nth-child(1) { background:var(--preview-accent); }
.theme-preview span:nth-child(2) { background:var(--preview-accent-2); }
.theme-preview span:nth-child(3) { background:var(--preview-surface); }
.theme-preview[data-preview-theme="classic"] { --preview-accent:#495057;--preview-accent-2:#adb5bd;--preview-surface:#f8f9fa; }
.theme-preview[data-preview-theme="indigo"] { --preview-accent:#4f46e5;--preview-accent-2:#8b5cf6;--preview-surface:#eef2ff; }
.theme-preview[data-preview-theme="emerald"] { --preview-accent:#047857;--preview-accent-2:#10b981;--preview-surface:#ecfdf5; }
.theme-preview[data-preview-theme="ruby"] { --preview-accent:#be123c;--preview-accent-2:#fb7185;--preview-surface:#fff1f2; }
.theme-preview[data-preview-theme="amber"] { --preview-accent:#b45309;--preview-accent-2:#f59e0b;--preview-surface:#fffbeb; }
.theme-preview[data-preview-theme="neon"] { --preview-accent:#06b6d4;--preview-accent-2:#d946ef;--preview-surface:#07111f; }
.theme-preview[data-preview-theme="contrast"] { --preview-accent:#000;--preview-accent-2:#ffeb00;--preview-surface:#fff; }
.marker-cell-preview {
    position:relative;
    display:grid;
    width:3.25rem;
    height:3.25rem;
    place-items:center;
    overflow:hidden;
    color:var(--bs-primary-text-emphasis);
    font-weight:800;
    background:var(--bs-primary-bg-subtle);
    border:1px solid var(--bs-primary-border-subtle);
    border-radius:.5rem;
}
.marker-cell-preview::after {
    position:absolute;
    inset-block-start:50%;
    inset-inline-start:50%;
    display:grid;
    min-width:1.35em;
    min-height:1.35em;
    place-items:center;
    transform:translate(-50%,-50%);
    font-size:1.45rem;
    font-weight:900;
    line-height:1;
    opacity:.45;
}
.marker-cell-preview[data-marker-preview="check"]::after { content:"✓"; }
.marker-cell-preview[data-marker-preview="check-circle"]::after { content:"✓";border:2px solid currentColor;border-radius:50%;font-size:1rem; }
.marker-cell-preview[data-marker-preview="dot"]::after { content:"●"; }
.marker-cell-preview[data-marker-preview="star"]::after { content:"★"; }
.marker-cell-preview[data-marker-preview="diamond"]::after { content:"◆"; }
.marker-cell-preview[data-marker-preview="stamp"]::after { content:"✓";border:2px solid currentColor;padding:.08em;transform:translate(-50%,-50%) rotate(-12deg); }
.marker-cell-preview[data-marker-preview="ring"]::after { content:"";width:1.35em;height:1.35em;border:3px solid currentColor;border-radius:50%; }
.marker-cell-preview[data-marker-preview="highlight"]::after,
.marker-cell-preview[data-marker-preview="none"]::after { content:none; }
.marker-cell-preview[data-marker-preview="none"] { color:var(--bs-body-color);background:var(--bs-body-bg);border-color:var(--bs-border-color); }
html[data-reduced-motion="true"] .visual-choice {
    transition:none;
}
html[data-reduced-motion="true"] .visual-choice:hover {
    transform:none;
}
@media (prefers-reduced-motion:reduce) {
    .visual-choice { transition:none; }
    .visual-choice:hover { transform:none; }
}
@media (max-width:575.98px) {
    .visual-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .visual-choice { min-height:6rem;padding:.6rem; }
}
/* M18.7C.7.7.1 marked-cell preview and icon sizing correction */
:root {
    --ticket-marker-size:clamp(1.35rem,5.25vw,2rem);
    --ticket-marker-ring-size:1.45em;
    --ticket-marker-opacity:.68;
}

.ticket-cell--marked::after {
    min-width:1.45em;
    min-height:1.45em;
    max-width:82%;
    max-height:82%;
    font-size:var(--ticket-marker-size);
    opacity:var(--ticket-marker-opacity);
}

html[data-marked-cell-style="check-circle"] .ticket-cell--marked::after {
    width:1.55em;
    height:1.55em;
    padding:0;
    font-size:calc(var(--ticket-marker-size) * .72);
    border-width:2.5px;
}

html[data-marked-cell-style="dot"] .ticket-cell--marked::after {
    font-size:calc(var(--ticket-marker-size) * 1.08);
}

html[data-marked-cell-style="stamp"] .ticket-cell--marked::after {
    padding:.12em;
    border-width:2.5px;
}

html[data-marked-cell-style="ring"] .ticket-cell--marked::after {
    width:var(--ticket-marker-ring-size);
    height:var(--ticket-marker-ring-size);
    border-width:3px;
}

.marker-cell-preview {
    width:4rem;
    height:4rem;
    isolation:isolate;
    font-size:1.05rem;
}

.marker-cell-preview > span {
    position:relative;
    z-index:1;
}

.marker-cell-preview::after {
    z-index:2;
    min-width:1.45em;
    min-height:1.45em;
    max-width:82%;
    max-height:82%;
    font-size:1.9rem;
    opacity:.68;
}

.marker-cell-preview[data-marker-preview="check-circle"]::after {
    width:1.55em;
    height:1.55em;
    padding:0;
    font-size:1.35rem;
    border-width:2.5px;
}

.marker-cell-preview[data-marker-preview="dot"]::after {
    font-size:2.05rem;
}

.marker-cell-preview[data-marker-preview="stamp"]::after {
    padding:.12em;
    border-width:2.5px;
}

.marker-cell-preview[data-marker-preview="ring"]::after {
    width:1.55em;
    height:1.55em;
    border-width:3px;
}

.marker-cell-preview[data-marker-preview="highlight"] {
    box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--bs-primary) 35%,transparent);
}

.marker-cell-preview[data-marker-preview="none"] {
    box-shadow:none;
}

@media (max-width:575.98px) {
    :root {
        --ticket-marker-size:clamp(1.2rem,6vw,1.7rem);
    }

    .marker-cell-preview {
        width:3.5rem;
        height:3.5rem;
    }
}
/* M18.7C.7.8 independent marked-cell highlight */
html[data-marked-highlight="false"] .ticket-cell--marked {
    background:inherit !important;
    color:inherit !important;
}
html[data-marked-cell-style="none"] .ticket-cell--marked::after {
    content:none;
}
html[data-marked-highlight="true"] .marker-cell-preview {
    color:var(--bs-primary-text-emphasis);
    background:var(--bs-primary-bg-subtle);
    border-color:var(--bs-primary-border-subtle);
}
html[data-marked-highlight="false"] .marker-cell-preview {
    color:var(--bs-body-color);
    background:var(--bs-body-bg);
    border-color:var(--bs-border-color);
    box-shadow:none;
}
/* M18.7C.7.9 independent ticket-number presentation */
html[data-marked-number-background="false"] .tambola-ticket .ticket-cell--marked {
    background:inherit !important;
}
html[data-marked-number-background="true"] .tambola-ticket .ticket-cell--marked {
    background:var(--bs-primary-bg-subtle);
}
html[data-marked-number-background="true"] .marker-cell-preview {
    background:var(--bs-primary-bg-subtle);
    border-color:var(--bs-primary-border-subtle);
}
html[data-marked-number-background="false"] .marker-cell-preview {
    background:var(--bs-body-bg);
    border-color:var(--bs-border-color);
    box-shadow:none;
}
html[data-ticket-number-colors="false"] .tambola-ticket .ticket-cell[data-number-range] {
    color:inherit;
}
html[data-ticket-number-colors="false"] .marker-cell-preview[data-number-range] {
    color:var(--bs-body-color);
}
html[data-colored-balls="false"] :is(.number-cell,.current-number,.recent-number)[data-number-range] {
    color:inherit;
    background:inherit;
    border-color:inherit;
}
/* M18.7C.7.10 independent ticket presentation layers */
.tambola-ticket .ticket-number,
.marker-cell-preview > span {
    position:relative;
    z-index:1;
    display:inline-grid;
    place-items:center;
    min-width:1.85em;
    min-height:1.85em;
    border-radius:50%;
    line-height:1;
}

html[data-highlight-marked-cells="true"] .tambola-ticket .ticket-cell--marked {
    background:var(--bs-primary-bg-subtle) !important;
    border-color:var(--bs-primary-border-subtle) !important;
}

html[data-highlight-marked-cells="false"] .tambola-ticket .ticket-cell--marked {
    background:inherit !important;
    border-color:var(--bs-border-color) !important;
}

html[data-highlight-marked-cells="true"] .marker-cell-preview {
    background:var(--bs-primary-bg-subtle) !important;
    border-color:var(--bs-primary-border-subtle) !important;
}

html[data-highlight-marked-cells="false"] .marker-cell-preview {
    background:var(--bs-body-bg) !important;
    border-color:var(--bs-border-color) !important;
}

html[data-marked-number-background="true"] :is(.tambola-ticket .ticket-number,.marker-cell-preview > span) {
    background:var(--bs-secondary-bg);
    box-shadow:inset 0 0 0 1px var(--bs-border-color-translucent);
}

html[data-marked-number-background="false"] :is(.tambola-ticket .ticket-number,.marker-cell-preview > span) {
    background:transparent !important;
    box-shadow:none !important;
}

html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="1"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="1"] { --ticket-range-color:#dc3545; --ticket-range-text:#fff; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="2"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="2"] { --ticket-range-color:#fd7e14; --ticket-range-text:#212529; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="3"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="3"] { --ticket-range-color:#ffc107; --ticket-range-text:#212529; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="4"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="4"] { --ticket-range-color:#198754; --ticket-range-text:#fff; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="5"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="5"] { --ticket-range-color:#20c997; --ticket-range-text:#212529; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="6"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="6"] { --ticket-range-color:#0d6efd; --ticket-range-text:#fff; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="7"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="7"] { --ticket-range-color:#4f46e5; --ticket-range-text:#fff; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="8"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="8"] { --ticket-range-color:#6f42c1; --ticket-range-text:#fff; }
html[data-ticket-number-colors="true"] .tambola-ticket [data-number-range="9"],
html[data-ticket-number-colors="true"] .marker-cell-preview[data-number-range="9"] { --ticket-range-color:#d63384; --ticket-range-text:#fff; }

html[data-ticket-number-colors="true"][data-marked-number-background="true"]
    :is(.tambola-ticket .ticket-number,.marker-cell-preview > span) {
    color:var(--ticket-range-text);
    background:var(--ticket-range-color);
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ticket-range-color) 70%,#000);
}

html[data-ticket-number-colors="true"][data-marked-number-background="false"]
    :is(.tambola-ticket .ticket-number,.marker-cell-preview > span) {
    color:var(--ticket-range-color);
}

html[data-ticket-number-colors="false"]
    :is(.tambola-ticket .ticket-number,.marker-cell-preview > span) {
    color:var(--bs-body-color);
}

html[data-ticket-number-colors="true"] .tambola-ticket
    .ticket-cell[data-number-range]:not(.ticket-cell--marked) {
    background:inherit !important;
    border-color:var(--bs-border-color) !important;
}

.tambola-ticket .ticket-cell--marked::after,
.marker-cell-preview::after {
    z-index:2;
}

/* M18.7C.7.11.12 single authoritative ticket background switch */
/*
 * Off: every uncalled numbered cell is completely transparent.
 * On: every uncalled numbered cell uses the active ticket theme surface.
 * Called numbered cells always use the active ticket theme highlight.
 */

html[data-hide-number-cell-background="true"] .tambola-ticket
    .ticket-cell.ticket-cell--number:not(.ticket-cell--marked) {
    color:var(--ticket-text) !important;
    background:transparent !important;
    background-color:transparent !important;
    background-image:none !important;
    border-color:var(--ticket-border) !important;
    box-shadow:none !important;
}

html[data-hide-number-cell-background="false"] .tambola-ticket
    .ticket-cell.ticket-cell--number:not(.ticket-cell--marked) {
    color:var(--ticket-text) !important;
    background:var(--ticket-cell) !important;
    background-color:var(--ticket-cell) !important;
    background-image:none !important;
    border-color:var(--ticket-border) !important;
    box-shadow:none !important;
}

html .tambola-ticket
    .ticket-cell.ticket-cell--number.ticket-cell--marked {
    color:var(--ticket-marked-text) !important;
    background:var(--ticket-marked) !important;
    background-color:var(--ticket-marked) !important;
    background-image:none !important;
    border-color:var(--ticket-border) !important;
    box-shadow:inset 0 0 0 2px currentColor !important;
    font-weight:800;
}

html .tambola-ticket .ticket-cell--marked::before,
html .tambola-ticket .ticket-cell--marked::after {
    content:none !important;
    display:none !important;
}

html[data-colored-balls] .tambola-ticket [data-number-range] {
    --range-color:initial;
    --range-text:initial;
}
/* End M18.7C.7.11.12 */