/* Shared game presentation; mechanics remain in each game's existing renderer. */
.website-lobby__heading { margin: .75rem 0 1.75rem; }
.website-lobby__heading > div { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; margin-top: .6rem; }
.website-lobby__heading h1 { font-size: clamp(2rem, 3.5vw, 3.3rem); line-height: 1.15; margin: 0; font-weight: 700; }
.website-lobby__layout { display: grid; grid-template-columns: minmax(0, 2.7fr) minmax(280px,1fr); gap: 2rem; align-items: start; }
.website-lobby__queue { min-width: 0; }
.website-lobby__notice { display: flex; align-items: center; gap: 1.5rem; background: #f4f3ef; color: #061222; padding: 1.7rem; border-radius: .875rem; margin-bottom: 1.5rem; }
.website-lobby__notice > i { background: #061222; color: var(--website-accent-dark); border-radius: .875rem; padding: 1rem; font-size: 2rem; }
.website-lobby__notice h2 { font-size: clamp(1.2rem,2vw,1.85rem); margin: 0 0 .3rem; color: #061222; }
.website-lobby__notice p { margin: 0; }
.website-lobby__notice .website-button { margin-left: auto; flex-shrink: 0; font-size: .9rem; padding-inline: 1rem; }
.website-lobby__row { display: grid; grid-template-columns: minmax(225px,.9fr) minmax(0,1.6fr); gap: 1.5rem; align-items: center; min-height: 138px; border-top: 1px solid var(--website-border); padding: 1.5rem 1rem; }
.website-lobby__row-label { display: flex; align-items: center; gap: 1.4rem; }
.website-lobby__row-label > i { display: grid; place-items: center; width: 58px; height: 58px; flex-shrink: 0; border-radius: 50%; background: var(--website-surface); border: 1px solid var(--website-border); color: var(--website-link); font-size: 1.5rem; }
.website-lobby__row h2 { margin: 0; color: var(--website-link); font-size: .9rem; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; }
.website-lobby__row h2 span { color: var(--website-muted); margin-left: .5rem; font-weight: 400; white-space: nowrap; }
body.website-body .website-lobby .player-list { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: .75rem; }
body.website-body .website-lobby .player-list .player-row--empty { padding: 0; background: transparent; border: 0; border-radius: 0; color: var(--website-muted); font-size: 1rem; text-align: left; }
.website-lobby__controls { border: 1px solid var(--website-border); border-radius: 1rem; padding: 1.5rem; min-width: 0; }
.website-lobby__media { aspect-ratio: 16/9; border-radius: .5rem; overflow: hidden; background: var(--website-surface); }
.website-lobby__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.website-lobby__media iframe { width: 100%; height: 100%; }
.website-lobby__stream { display: flex; align-items: center; gap: .75rem; margin-top: 1.25rem; font-size: 1.15rem; }
.website-lobby__stream-copy { color: var(--website-muted); margin-top: .5rem; }
.website-lobby__controls .action-buttons-row { display: grid; gap: .5rem; margin-top: 1.5rem; }
.website-lobby__controls [data-lobby-info] { margin-block: 1rem; color: var(--website-muted); }
.website-lobby__badge { color: var(--website-muted); font-size: .85rem; }
.website-lobby__rules { border-block: 1px solid var(--website-border); padding-block: 1rem; }
.website-lobby__rules a { display: flex; align-items: center; gap: .7rem; text-decoration: none; }.website-lobby__rules a i:last-child { margin-left: auto; }
.website-lobby__volume { margin-top: 1.5rem; }.website-lobby__volume > div { display: flex; gap: .75rem; align-items: center; }.website-lobby__volume input { min-width: 0; width: 100%; accent-color: var(--website-accent); }.website-lobby__volume label { font-size: .9rem; color: var(--website-muted); }
.website-lobby__controls .website-button { border-radius: .75rem; }
@media (max-width:1100px) { .website-lobby__layout { grid-template-columns: minmax(0,1.7fr) minmax(260px,1fr); gap:1.25rem; }.website-lobby__notice { flex-wrap:wrap; padding:1.2rem; }.website-lobby__notice .website-button { margin-left:0; }.website-lobby__row { grid-template-columns:1fr; gap:1rem; } }
@media (max-width:700px) { .website-lobby__layout { grid-template-columns:minmax(0,1fr); }.website-lobby__controls { grid-row:1; }.website-lobby__row { padding-inline:0; }.website-lobby__heading .website-live { font-size:.85rem; }.website-lobby__notice > i { display:none; }.website-lobby__heading h1 { font-size:2rem; } }

.website-page--bingo { padding-block: .5rem 2rem; }
.website-page--bingo .website-bingo-layout {
    display: grid;
    grid-template-columns: minmax(230px,.8fr) minmax(0,1.9fr);
    gap: 2rem;
    align-items: start;
    padding: clamp(1rem,2vw,2rem);
    border: 1px solid var(--website-border);
    border-radius: var(--website-radius);
    background: var(--website-surface);
}
.website-page--bingo .website-bingo-layout > .alert { grid-column: 1 / -1; }
.website-page--bingo .content-area { width:100%; padding:0; }.website-page--bingo .content-area > .row { margin:0; }
.website-bingo-sidebar { grid-column:1; grid-row:1; max-width:390px; align-self:stretch; padding-right:1.5rem; border-right:1px solid var(--website-border); }
.website-bingo-machine { display:block; width:160px; height:160px; object-fit:contain; margin:0 0 1rem; }
.website-bingo-sidebar h1 { font-size:clamp(2rem,3vw,2.8rem); font-weight:750; line-height:1.05; margin:0 0 1.5rem; }.website-bingo-sidebar h1 span { color:var(--website-link); }
.website-bingo-sidebar > p { color:var(--website-muted); max-width:30ch; }
.website-bingo-sidebar .website-bingo-stream { color:var(--website-text); font-weight:600; margin-bottom:.5rem; }.website-bingo-stream i { color:#f64b65; font-size:.8rem; margin-right:.5rem; }
.website-bingo-metrics { margin:1.6rem 0; padding-top:1rem; border-top:1px solid var(--website-border); }.website-bingo-metrics > div { display:flex; align-items:center; gap:1rem; margin-block:1rem; }.website-bingo-metrics dt { font-weight:400; }.website-bingo-metrics dt i { display:inline-grid; place-items:center; width:42px; height:42px; border:1px solid var(--website-border); border-radius:.875rem; margin-right:.6rem; color:var(--website-link); }.website-bingo-metrics dd { margin:0 0 0 auto; color:var(--website-link); white-space:nowrap; }
.website-bingo-sidebar .website-button { width:100%; margin:.25rem 0; justify-content:flex-start; border-radius:.8rem; }.website-bingo-sidebar > .website-button:first-of-type { justify-content:center; }
.website-page--bingo .website-bingo-play { grid-column:2; grid-row:1; border:0; background:transparent !important; box-shadow:none; padding:0 0 clamp(1.5rem,10%,6rem); margin-bottom:0 !important; position:relative; z-index:0; }
.website-bingo-play::after { content:''; position:absolute; z-index:-1; width:100%; height:auto; aspect-ratio:3/1; left:0; bottom:-1rem; background:url('/assets/frontend/decorations/bingo-stage.webp') center bottom/contain no-repeat; pointer-events:none; }
.website-page--bingo .website-bingo-play > .card-body { padding:0; }.website-page--bingo .website-bingo-play > .card-header { width:100%; max-width:810px; margin-inline:auto; padding:0 0 1rem; background:transparent; border:0; }
.website-bingo-play .card-header .status-indicator { display:none; }.website-bingo-play .bingo-points-info { display:none; }
.website-bingo-play > .card-header .d-flex { flex-wrap:wrap; gap:.75rem; }
.website-page--bingo #bingo-instructions { grid-column:1/-1; margin-top:2rem; }
/* Bingo help and dialogs use the same tenant tokens as the board. */
.website-bingo-rules { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; padding-top:2rem; border-top:1px solid var(--website-border); }
.website-bingo-rules h3 { margin:0 0 1.2rem; font-size:1.25rem; font-weight:650; }
.website-bingo-rules p { margin:0; line-height:1.65; }
.website-bingo-rules__steps { margin:0; padding-left:1.5rem; }
.website-bingo-rules__steps li { padding-left:.5rem; margin-bottom:1.3rem; }
.website-bingo-rules__steps li::marker { color:var(--website-link); font-weight:700; }
.website-bingo-rules__steps strong { display:block; margin-bottom:.35rem; }
.website-bingo-rules__steps p,.website-bingo-rules__notes { color:var(--website-muted); }
.website-bingo-rules__notes { padding-top:1rem; border-top:1px solid var(--website-border); font-size:.9rem; }
.website-bingo-rules__notes p + p { margin-top:.75rem; }
.website-bingo-rule-values { margin:0; }
.website-bingo-rule-values > div { display:grid; grid-template-columns:8rem minmax(0,1fr); gap:1rem; padding:.8rem 0; border-bottom:1px solid var(--website-border); }
.website-bingo-rule-values > div:first-child { padding-top:0; }
.website-bingo-rule-values dt { font-weight:600; }
.website-bingo-rule-values dd { margin:0; color:var(--website-muted); }
.website-bingo-rules .website-bingo-formula { margin:1.25rem 0; color:var(--website-text); font-weight:600; }
.website-body .website-bingo-modal .modal-dialog { width:calc(100% - 2rem); max-width:560px; margin:1rem auto; min-height:calc(100% - 2rem); max-height:calc(100% - 2rem); }
.website-body .website-bingo-modal .modal-lg { max-width:860px; }
.website-body .website-bingo-modal .modal-content { background:var(--website-surface); color:var(--website-text); border:1px solid var(--website-border); border-radius:var(--website-radius); box-shadow:var(--website-shadow); max-height:calc(100dvh - 2rem); overflow:hidden; }
.website-body .website-bingo-modal .modal-header { align-items:flex-start; gap:1rem; padding:1.5rem 1.75rem; border-bottom:1px solid var(--website-border); background:transparent; }
.website-body .website-bingo-modal .modal-title { margin:0; font-size:clamp(1.2rem,2vw,1.5rem); font-weight:650; line-height:1.35; color:var(--website-text); }
.website-body .website-bingo-modal .close { display:grid; place-items:center; flex:none; width:44px; height:44px; margin:-.5rem -.5rem -.5rem 0; padding:0; color:var(--website-muted); opacity:1; text-shadow:none; border-radius:.5rem; font-size:1.75rem; font-weight:400; }
.website-body .website-bingo-modal .close:hover { background:var(--website-raised); color:var(--website-text); }
.website-body .website-bingo-modal .modal-body { padding:1.5rem 1.75rem; overscroll-behavior:contain; scrollbar-color:var(--website-muted) var(--website-surface); }
.website-body .website-bingo-modal .modal-footer { padding:1rem 1.75rem; gap:.5rem; border-top:1px solid var(--website-border); flex-shrink:0; background:var(--website-surface); }
.website-body .website-bingo-modal .modal-footer > * { margin:0; }
.website-bingo-modal .website-button { min-height:44px; padding:.65rem 1rem; font-size:.9rem; }
.website-bingo-modal p { line-height:1.6; overflow-wrap:anywhere; }
.website-bingo-modal .website-bingo-muted { color:var(--website-muted); }
.website-bingo-modal :is(button,textarea,[tabindex='0']):focus-visible { outline:2px solid var(--website-link); outline-offset:3px; }
.website-bingo-modal .website-button:disabled { opacity:.55; cursor:not-allowed; }
.website-bingo-selected-field { margin-bottom:1.5rem; padding-bottom:1.25rem; border-bottom:1px solid var(--website-border); }
.website-bingo-selected-field h3 { font-size:1.45rem; line-height:1.4; margin:0 0 .8rem; overflow-wrap:anywhere; }
.website-bingo-field-meta { display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; align-items:center; margin-bottom:1rem; font-size:.9rem; }
.website-bingo-field-meta i { color:var(--website-link); margin-right:.3rem; }
.website-body .website-bingo-modal .badge { font-size:.85rem; padding:.4rem .6rem; background:var(--website-raised); color:var(--website-text); border:1px solid var(--website-border); font-weight:600; }
.website-bingo-selected-field > p { margin:0; white-space:pre-line; }
.website-body .website-bingo-modal .form-control { background:var(--website-bg); color:var(--website-text); border:1px solid var(--website-border); border-radius:.6rem; min-height:100px; resize:vertical; caret-color:var(--website-link); }
.website-bingo-modal .form-group { margin:0; }
.website-bingo-modal label { font-weight:600; }
.website-bingo-modal label span { font-weight:400; }
.website-bingo-modal #proofHelp { margin:.65rem 0 0; font-size:.85rem; }
.website-body .website-bingo-notice { margin:1.25rem 0; padding:1rem; border:1px solid var(--website-border); border-radius:.65rem; background:var(--website-raised); color:var(--website-text); line-height:1.6; font-size:.9rem; }
.website-bingo-notice > strong { display:block; margin-bottom:.3rem; }
.website-bingo-notice > span { display:block; }
.website-body .website-bingo-notice--warning { border-color:var(--website-link); }
.website-bingo-modal .modal-body > .website-bingo-notice:first-child { margin-top:0; }
.website-bingo-modal .modal-body > .website-bingo-notice:last-child { margin-bottom:0; }
.website-bingo-examples { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:1.25rem 0 1.5rem; padding:0; list-style:none; }
.website-bingo-examples li { padding:1rem; background:var(--website-bg); border:1px solid var(--website-border); border-radius:.65rem; display:flex; flex-direction:column; justify-content:space-between; gap:1rem; overflow-wrap:anywhere; }
.website-bingo-examples strong { font-size:.95rem; font-weight:600; }
.website-bingo-examples li > div { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem; color:var(--website-muted); font-size:.85rem; }
.website-bingo-calculation { counter-reset:bingo-step; margin:0; padding:0; list-style:none; }
.website-bingo-calculation li { counter-increment:bingo-step; display:flex; gap:1rem; padding:1.1rem 0; border-top:1px solid var(--website-border); }
.website-bingo-calculation li::before { content:counter(bingo-step); color:var(--website-link); font-weight:700; width:1.25rem; flex-shrink:0; }
.website-bingo-calculation h3 { margin:0 0 .4rem; font-size:1rem; font-weight:650; }
.website-bingo-calculation p { margin:0; color:var(--website-muted); }
.website-bingo-calculation p strong { color:var(--website-text); }
.website-bingo-modal .website-bingo-reward-total { display:block; font-size:clamp(1.4rem,3vw,2rem); color:var(--website-link); line-height:1.3; margin-top:.5rem; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.website-bingo-claim-reward { padding:.25rem 0 1.5rem; margin-bottom:1.25rem; border-bottom:1px solid var(--website-border); }
.website-bingo-claim-reward p { margin:0; color:var(--website-muted); }
.website-bingo-modal .highscore-filters { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem; }
.website-bingo-modal .highscore-filters .btn { background:transparent; color:var(--website-muted); border:1px solid var(--website-border); border-radius:.6rem; min-height:44px; padding:.6rem .85rem; font-size:.9rem; }
.website-bingo-modal .highscore-filters .btn:hover { background:var(--website-raised); color:var(--website-text); }
.website-bingo-modal .highscore-filters .btn.active { background:var(--website-accent); color:var(--website-on-accent); border-color:var(--website-accent); }
.website-bingo-modal #highscoresStatus { font-size:.9rem; min-height:1.6em; }
.website-bingo-ranking-scroll { overflow-x:auto; overscroll-behavior-x:contain; scrollbar-color:var(--website-muted) var(--website-surface); }
.website-bingo-ranking { width:100%; border-collapse:collapse; font-size:.9rem; font-variant-numeric:tabular-nums; }
.website-bingo-ranking th,.website-bingo-ranking td { padding:.85rem .7rem; border-bottom:1px solid var(--website-border); vertical-align:middle; }
.website-bingo-ranking th { color:var(--website-muted); font-size:.8rem; font-weight:600; white-space:nowrap; }
.website-bingo-ranking td { color:var(--website-text); }
.website-bingo-ranking td:nth-child(2) { overflow-wrap:anywhere; min-width:8rem; }
.website-bingo-ranking :is(td,th):nth-child(n+3) { text-align:right; }
.website-bingo-ranking td:nth-child(4) { white-space:nowrap; }
.website-bingo-ranking td:nth-child(5) .badge { display:flex; align-items:center; justify-content:center; min-width:3.75rem; }
.website-bingo-ranking tr.is-current-user { background:var(--website-raised); }
.website-bingo-ranking tr.is-current-user td:first-child { color:var(--website-link); font-weight:700; }
.website-bingo-ranking .website-bingo-rank-state { text-align:center; color:var(--website-muted); padding:2rem 1rem; }
@media(max-width:800px) { .website-bingo-rules { grid-template-columns:minmax(0,1fr); } }
@media(max-width:575px) {
    .website-body .website-bingo-modal .modal-dialog { width:calc(100% - 1rem); margin:.5rem auto; min-height:calc(100% - 1rem); max-height:calc(100% - 1rem); }
    .website-body .website-bingo-modal .modal-content { max-height:calc(100dvh - 1rem); }
    .website-body .website-bingo-modal :is(.modal-header,.modal-body,.modal-footer) { padding:1.1rem; }
    .website-body .website-bingo-modal .modal-footer { flex-wrap:wrap; }
    .website-bingo-examples { grid-template-columns:minmax(0,1fr); gap:0; border-block:1px solid var(--website-border); }
    .website-bingo-examples li { flex-direction:row; align-items:center; border:0; border-radius:0; padding:.8rem 0; background:transparent; }
    .website-bingo-examples li + li { border-top:1px solid var(--website-border); }
    .website-bingo-examples li > div { flex-direction:column; text-align:right; flex-shrink:0; }
    .website-bingo-rule-values > div { grid-template-columns:minmax(0,1fr); gap:.3rem; }
}
@media(max-width:380px) {
    .website-bingo-modal .modal-footer > :is(button,form),.website-bingo-modal .modal-footer form button { width:100%; }
    .website-bingo-modal .highscore-filters { gap:.35rem; }
    .website-bingo-modal .highscore-filters .btn { padding:.5rem .6rem; font-size:.8rem; }
}
.website-page--bingo .bingo-board, .website-page--bingo-card .bingo-board { width:100%; max-width:810px; margin:0 auto; }
.website-page--bingo .bingo-grid, .website-page--bingo-card .bingo-grid { grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; }
.website-page--bingo .bingo-cell, .website-page--bingo-card .bingo-cell { aspect-ratio:1/1; padding:0; min-width:0; min-height:0; background:var(--website-surface); border:1px solid #68607d; border-radius:.5rem; overflow:hidden; }
.website-page--bingo .bingo-cell:hover, .website-page--bingo-card .bingo-cell:hover { transform:none; box-shadow:none; border-color:var(--website-link); }
.website-page--bingo .bingo-content, .website-page--bingo-card .bingo-content { border:0; padding:8px; gap:5px; min-height:0; }
.website-page--bingo .bingo-text, .website-page--bingo-card .bingo-text { font-size:clamp(.875rem,1.1vw,1.05rem); line-height:1.2; font-weight:500; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; max-width:100%; word-break:normal; overflow-wrap:anywhere; hyphens:auto; }
.website-bingo-field-list { grid-column:1 / -1; margin:1.5rem 0 0; padding:1rem; border:1px solid var(--website-border); border-radius:.75rem; background:var(--website-surface); color:var(--website-text); }
.website-bingo-field-list > summary { cursor:pointer; color:var(--website-link); min-height:24px; font-weight:600; }
.website-bingo-field-list > ol { margin:1rem 0 0; padding-left:1.75rem; }
.website-bingo-field-list li { padding:.5rem .25rem; line-height:1.5; overflow-wrap:anywhere; }
.website-bingo-field-list li + li { border-top:1px solid var(--website-border); }
.website-page--bingo .bingo-points, .website-page--bingo-card .bingo-points { position:static; padding:0; color:var(--website-link); background:transparent; font-size:clamp(.75rem,1.2vw,1.1rem); line-height:1.2; }
.website-page--bingo .free-text, .website-page--bingo-card .free-text { height:auto; font-size:clamp(1.2rem,3vw,2.8rem); color:var(--website-link); line-height:1.1; }
.website-page--bingo .free-space, .website-page--bingo-card .free-space { border:2px solid var(--website-link); background:var(--website-bg); }
.website-bingo-free-check { color:var(--website-link); font-size:clamp(1rem,2vw,2rem); }
.website-bingo-difficulty { display:flex; justify-content:center; gap:5px; flex-shrink:0; color:#badd44; }.website-bingo-difficulty[data-difficulty='2'] { color:#e9b839; }.website-bingo-difficulty[data-difficulty='3'] { color:#fb5267; }.website-bingo-difficulty > span { display:block; height:16px; width:9px; border:1px solid currentColor; border-radius:2px; }.website-bingo-difficulty .is-filled { background:currentColor; }
.website-page--bingo .category-badge,.website-page--bingo-card .category-badge { display:none; }.website-page--bingo .status-icon,.website-page--bingo-card .status-icon { font-size:13px; top:4px; right:4px; }
@media(max-width:1000px){.website-page--bingo .website-bingo-layout { grid-template-columns:minmax(180px,.7fr) minmax(0,1.5fr); gap:1.25rem; }.website-bingo-sidebar{padding-right:1rem;}.website-bingo-metrics dt i{display:none;}.website-bingo-machine{width:130px;height:130px;}}
@media(max-width:800px){.website-page--bingo .website-bingo-layout{grid-template-columns:minmax(0,1fr);}.website-bingo-sidebar{max-width:none;grid-column:1;grid-row:auto;padding:0 0 1rem;border-right:0;border-bottom:1px solid var(--website-border);}.website-bingo-machine{float:right;width:100px;height:100px;margin:0;}.website-bingo-sidebar h1{font-size:2rem;}.website-bingo-metrics{display:flex;flex-wrap:wrap;gap:.5rem 1rem;}.website-bingo-metrics>div{margin:0;font-size:.85rem;gap:.5rem;}.website-bingo-sidebar .website-button{width:auto;min-height:44px;font-size:.9rem;padding:.5rem .8rem;}.website-page--bingo .website-bingo-play{grid-column:1;grid-row:auto;}}
@media(max-width:700px){.website-page--bingo .website-bingo-layout{padding:12px;}.website-page--bingo .bingo-grid,.website-page--bingo-card .bingo-grid{gap:4px;}.website-page--bingo .bingo-content,.website-page--bingo-card .bingo-content{padding:3px;gap:3px;}.website-page--bingo .bingo-text,.website-page--bingo-card .bingo-text{-webkit-line-clamp:2;font-size:12px;line-height:1.15;}.website-bingo-difficulty{gap:3px;}.website-bingo-difficulty>span{width:5px;height:8px;}.website-bingo-play::after{bottom:-.5rem;}}
/* Legacy mobile text offsets must not consume space inside square cells. */
.website-page--bingo .bingo-text { padding-top:0; margin-top:0; }
@media(max-width:350px){
    .website-page--bingo .website-bingo-layout { padding:8px; gap:1rem; }
    .website-bingo-machine { width:64px; height:64px; }
    .website-bingo-sidebar h1 { font-size:1.75rem; }
    .website-page--bingo .bingo-content { padding:2px; gap:2px; }
    .website-page--bingo .bingo-text { font-size:11px; }
    .website-page--bingo .bingo-text,.website-page--bingo-card .bingo-text { -webkit-line-clamp:1; }
}

.website-page--bingo-card { display:grid; grid-template-columns:minmax(200px,.6fr) minmax(0,1.7fr); gap:3rem; align-items:start; }
.website-card-owner h1 { font-size:2rem; margin:0 0 1.5rem; }.website-card-owner > p { font-size:1.15rem; }.website-card-owner strong { color:var(--website-link); font-size:1.4rem; }.website-card-owner dl { margin-top:1.5rem; }.website-card-owner dl > div { border-top:1px solid var(--website-border); padding:1.5rem 0; }.website-card-owner dt{font-weight:400;}.website-card-owner dd{font-size:1.6rem;color:var(--website-link);margin:.3rem 0 0;}.website-card-owner>a{display:block;padding:.7rem 0;color:var(--website-text);}.website-card-owner>a i{margin-right:.5rem;color:var(--website-link);}
.website-page--bingo-card .website-card-board { border:0; background:transparent; box-shadow:none; }.website-page--bingo-card .website-card-board>.card-header{background:transparent;border:0;padding:0 0 .8rem;}.website-page--bingo-card .website-card-board>.card-body{padding:0;}.website-page--bingo-card .website-card-summary{display:none;}.website-page--bingo-card .bingo-cell{cursor:default;}.website-page--bingo-card .bingo-cell.completed{border-color:#56b571;background:var(--website-raised);}
.website-wheel { width:min(calc(100% - 6rem),var(--website-width)); max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
body.website-body .website-wheel .section--wheel-main { grid-column:1/-1; border:0; background:transparent; box-shadow:none; }
body.website-body .website-wheel .section--wheel-main > .section-header { display:block; text-align:center; border:0; background:transparent; padding:0 0 1rem; }.website-wheel .section-headline { display:block; }.website-wheel h1 { font-size:clamp(2.2rem,4vw,3.5rem); }.website-wheel .section-headline-icon{display:none;}.website-wheel .section-meta{color:var(--website-muted);}
body.website-body .website-wheel .wheel-main-layout { display:flex;flex-direction:column;align-items:center;padding:0;gap:1.5rem; }.website-wheel .wheel-visual { width:min(100%,750px);padding-bottom:2rem;position:relative;isolation:isolate; }.website-wheel .wheel-visual::after { content:''; position:absolute;inset:auto -2% 0; height:30%; z-index:-1; background:url('/assets/frontend/decorations/bingo-stage.webp') center bottom/contain no-repeat; pointer-events:none; }
body.website-body .website-wheel .wheel-canvas-wrapper { max-width:100%; width:100%; aspect-ratio:1; background:transparent; border:0; box-shadow:none; }.website-wheel canvas { width:100%;height:100%; }.website-wheel .wheel-panel { display:flex;flex-direction:column;align-items:center;text-align:center;max-width:700px; }.website-wheel .wheel-spin-btn { min-width:min(100%,300px);border-radius:.8rem; }.website-wheel .wheel-info-block { border:0; padding:0; }.website-wheel .wheel-info-heading { display:none; }.website-wheel .wheel-info-text { color:var(--website-muted); }.website-wheel .wheel-info-text p { margin:0 0 .5rem; }
body.website-body .website-wheel :is(.section--wheel-rewards,.section--wheel-history) { min-width:0; background:var(--website-surface); border:1px solid var(--website-border); border-radius:1rem; box-shadow:none; }.website-wheel .wheel-reward-list,.website-wheel .wheel-history { padding:1rem; }.website-wheel .section-header{border-color:var(--website-border);padding:1rem;}.website-wheel :is(.wheel-history-row,.wheel-reward-item){background:var(--website-raised);border-color:var(--website-border);border-radius:.7rem;}
@media(max-width:1100px){.website-wheel{width:calc(100% - 3rem);}}
@media(max-width:700px){.website-page--bingo-card{grid-template-columns:minmax(0,1fr);gap:1rem;}.website-card-owner dl{display:flex;flex-wrap:wrap;gap:1rem;}.website-card-owner dl>div{padding:.8rem 0;}.website-card-owner dd{font-size:1.1rem;}.website-card-owner>a{display:inline-block;margin-right:1rem;}.website-wheel{width:calc(100% - 2rem);grid-template-columns:minmax(0,1fr);}.website-wheel .section--wheel-main{grid-column:1;}}

body.website-body .website-wheel .wheel-visual { width:min(100%,740px); padding-bottom:2rem; }
body.website-body .website-wheel .wheel-canvas-wrapper { aspect-ratio:auto; overflow:visible; border-radius:0; }
body.website-body .website-wheel .wheel-canvas-wrapper canvas { position:static; }
.website-wheel .wheel-visual::after { background-size:100% auto; bottom:-1rem; }
.website-wheel .section-meta, .website-wheel .status-helper-text, .website-wheel .wheel-info-text { font-size:1rem; font-style:normal; }
.website-wheel .section-headline { font-size:1.2rem; }
.website-wheel .wheel-spin-btn { min-height:56px; font-size:1.2rem; }
.website-page--bingo-card .bingo-board { max-width:none; }
.website-page--bingo-card .bingo-cell.free-space.completed { border-color:var(--website-link); background:var(--website-bg); }
.website-card-owner dt { display:flex; align-items:center; gap:.9rem; font-size:1.05rem; }
.website-card-owner dt i { display:inline-grid; place-items:center; width:48px; height:48px; border-radius:50%; border:1px solid var(--website-border); background:var(--website-surface); color:var(--website-link); flex-shrink:0; font-size:1.45rem; }
.website-card-owner dd { margin-left:calc(48px + .9rem); margin-top:-.6rem; }
@media(max-width:700px){.website-card-owner dt{font-size:.85rem;gap:.4rem;}.website-card-owner dt i{width:28px;height:28px;font-size:1rem;}.website-card-owner dd{margin-left:0;margin-top:.4rem;}}
.website-wheel .wheel-spin-controls { display:flex; align-items:stretch; gap:1.25rem; width:100%; justify-content:center; }
.website-wheel .wheel-spin-btn { display:inline-flex; gap:.8rem; align-items:center; justify-content:center; }
.website-wheel .wheel-remaining { display:flex; flex-direction:column; justify-content:center; gap:.15rem; padding:.5rem 1rem; border:1px solid var(--website-border); border-radius:.8rem; background:var(--website-surface); white-space:nowrap; }
.website-wheel .wheel-remaining strong { font-size:2rem; line-height:1.1; color:var(--website-link); }
.website-wheel .wheel-remaining span { font-size:.85rem; color:var(--website-muted); }
.website-wheel .wheel-panel-meta { margin-top:.6rem; }
.website-wheel .wheel-bonus { color:var(--website-link); }
.website-wheel .section-headline i { margin-right:.4rem; color:var(--website-link); }
.website-wheel h1 { font-size:clamp(2.2rem,5vw,3rem); }
.website-wheel .wheel-pointer { transform:translateX(-50%) rotate(180deg); }
.website-wheel .wheel-status { color:var(--website-muted); }
body.website-body .website-wheel :is(.section--wheel-rewards,.section--wheel-history) > .section-header { padding:1rem 1rem .4rem; }
body.website-body .website-wheel :is(.section--wheel-rewards,.section--wheel-history) { padding:0; }
.website-wheel .wheel-panel-meta p { margin:.25rem 0; }
.website-wheel .wheel-info-block { margin-top:0; }
body.website-body .website-wheel :is(.wheel-reward-list,.wheel-history) { margin:0; padding:1rem; gap:.7rem; }
@media(max-width:500px){.website-wheel .wheel-spin-controls{gap:.6rem;}.website-wheel .wheel-spin-btn{min-width:0;flex:1;padding:.8rem;}.website-wheel .wheel-remaining{padding:.5rem .65rem;}.website-wheel .wheel-remaining span{font-size:.75rem;}}

.website-bingo-help-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; width:100%; }
.website-bingo-help-actions .website-button { width:100%; margin:0; justify-content:center; }
body.website-body .website-wheel .wheel-visual { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2.8fr) minmax(0,1fr); align-items:center; gap:.8rem; width:100%; }
.website-wheel .wheel-fixed-labels { display:grid; align-content:center; gap:1rem; min-width:0; }
.website-wheel .wheel-fixed-label { display:flex; flex-direction:column; gap:.15rem; padding-left:.55rem; border-left:4px solid var(--reward-color); font-size:1rem; overflow-wrap:anywhere; line-height:1.3; }
.website-wheel .wheel-fixed-label span { color:var(--website-muted); font-size:.9rem; }
.website-wheel .wheel-fixed-labels--left { text-align:right; }
.website-wheel .wheel-reward-explanation { display:block; margin-top:.35rem; line-height:1.5; color:var(--website-muted); font-size:.9rem; font-weight:400; }
@media(max-width:500px) {
    body.website-body .website-wheel .wheel-visual { grid-template-columns:minmax(0,1fr) minmax(0,2.2fr) minmax(0,1fr); gap:.4rem; }
    .website-wheel .wheel-fixed-label { font-size:.875rem; padding-left:.35rem; }
    .website-wheel .wheel-fixed-label span { font-size:.8rem; }
    .website-wheel .wheel-fixed-labels { gap:.8rem; }
}