/* /Components/Layout/MainLayout.razor.rz.scp.css */
.app[b-x7doq4mpp8] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    /* Keeps content clear of notches and home indicators when installed as a PWA. */
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

#blazor-error-ui[b-x7doq4mpp8] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-x7doq4mpp8] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
/* Visibility switching is the template's; only the looks below were moved onto the --ss-* tokens. */
.components-reconnect-first-attempt-visible[b-puv1s7nrpg],
.components-reconnect-repeated-attempt-visible[b-puv1s7nrpg],
.components-reconnect-failed-visible[b-puv1s7nrpg],
.components-pause-visible[b-puv1s7nrpg],
.components-resume-failed-visible[b-puv1s7nrpg],
.components-rejoining-animation[b-puv1s7nrpg] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-retrying[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-failed[b-puv1s7nrpg],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-puv1s7nrpg] {
    display: block;
}

#components-reconnect-modal[b-puv1s7nrpg] {
    background: var(--ss-surface);
    color: var(--ss-ink);
    width: 20rem;
    /* The UA centres a modal dialog with `margin: auto`; the template's 20vh pushed it off a short phone. */
    max-width: calc(100vw - 2rem);
    margin: auto;
    padding: 2rem;
    border: 0;
    border-radius: var(--ss-radius);
    box-shadow: var(--ss-shadow);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-puv1s7nrpg 0.5s both;
}

#components-reconnect-modal[open][b-puv1s7nrpg] {
    animation: components-reconnect-modal-slideUp-b-puv1s7nrpg 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s,
               components-reconnect-modal-fadeInOpacity-b-puv1s7nrpg 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

/* Ink at 70 % — dark enough to say "not now" over a lit projector, light enough to still read the board. */
#components-reconnect-modal[b-puv1s7nrpg]::backdrop {
    background-color: rgba(15, 21, 38, .7);
    animation: components-reconnect-modal-fadeInOpacity-b-puv1s7nrpg 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-puv1s7nrpg {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-puv1s7nrpg {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-puv1s7nrpg {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-puv1s7nrpg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-puv1s7nrpg] {
    margin: 0;
    text-align: center;
    font-size: 1.05rem;
}

/* Same shape as `.btn.btn-primary` in app.css — this dialog lives outside the layout, so it repeats it. */
#components-reconnect-modal button[b-puv1s7nrpg] {
    min-height: var(--ss-tap);
    padding: 0 1.25rem;
    border: 0;
    border-radius: 999px;
    background: var(--ss-primary);
    color: var(--ss-primary-ink);
    font: inherit;
    font-weight: 600;
    font-size: 1.05rem;
    cursor: pointer;
}

    #components-reconnect-modal button:hover[b-puv1s7nrpg],
    #components-reconnect-modal button:active[b-puv1s7nrpg] {
        filter: brightness(1.1);
    }

.components-rejoining-animation[b-puv1s7nrpg] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-puv1s7nrpg] {
        position: absolute;
        border: 3px solid var(--ss-primary);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-puv1s7nrpg 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-puv1s7nrpg] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-puv1s7nrpg {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}

/* Like flip.js and fireworks.js: a ring that never expands is still a "we are working on it" marker. */
@media (prefers-reduced-motion: reduce) {

    #components-reconnect-modal[b-puv1s7nrpg],
    #components-reconnect-modal[open][b-puv1s7nrpg],
    #components-reconnect-modal[b-puv1s7nrpg]::backdrop,
    .components-rejoining-animation div[b-puv1s7nrpg] {
        animation: none;
    }

    #components-reconnect-modal[b-puv1s7nrpg] {
        opacity: 1;
    }

    .components-rejoining-animation div[b-puv1s7nrpg] {
        top: 0;
        left: 0;
        width: 80px;
        height: 80px;
    }
}
/* /Components/Pages/Board.razor.rz.scp.css */
.board[b-gor1c4id3q] { display: grid; grid-template-columns: 18rem 1fr; gap: 1.5rem; padding: 1.5rem; min-height: 100dvh; }
.side[b-gor1c4id3q] { display: flex; flex-direction: column; gap: 1rem; align-items: flex-start; }
.code[b-gor1c4id3q] { font-family: ui-monospace, monospace; font-size: 3rem; letter-spacing: .15em; margin: 0; }
.share[b-gor1c4id3q] { display: flex; gap: .5rem; flex-wrap: wrap; }
.stage[b-gor1c4id3q] { display: flex; flex-direction: column; gap: 2rem; }
.group h2[b-gor1c4id3q] { font-size: 1.6rem; display: flex; gap: .5rem; align-items: center; margin: 0 0 .75rem; }
.count[b-gor1c4id3q] { font-size: 1rem; background: var(--ss-line); border-radius: 999px; padding: .1rem .6rem; }
.chips[b-gor1c4id3q] { display: flex; flex-wrap: wrap; gap: .75rem; min-height: 3.5rem; }
/* A projector is wide, a laptop lid is not: stack the sidebar under 800px. */
@media (max-width: 800px) { .board[b-gor1c4id3q] { grid-template-columns: 1fr; } }
/* position: relative gives the bubbles a containing block of their own (the fireworks canvas ended up
   fixed to the viewport instead, so it no longer relies on this). */
.cluster[b-gor1c4id3q] { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: flex-start; justify-content: center; padding: 1rem; position: relative; }
.stragglers[b-gor1c4id3q] { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; justify-content: center; opacity: .7; }
/* Fixed rather than absolute: the burst should fill the projector, not just the cluster box.
   pointer-events: none keeps the host's tap-to-crown working straight through it. */
.fireworks[b-gor1c4id3q] { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; }
/* A disclosure keeps the host key off the projector until the host deliberately opens it. */
.host-qr summary[b-gor1c4id3q] { cursor: pointer; font-weight: 600; }
.host-qr p[b-gor1c4id3q] { margin: .5rem 0; }
/* /Components/Pages/Home.razor.rz.scp.css */
.home[b-0om3ng5hbf] { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 2rem 1rem; text-align: center; }
.brand[b-0om3ng5hbf] { font-size: clamp(2.2rem, 6vw, 4rem); }
.choices[b-0om3ng5hbf] { display: flex; flex-direction: column; gap: 1rem; width: min(100%, 22rem); }
.big[b-0om3ng5hbf] { min-height: 4.5rem; font-size: 1.3rem; }
.join[b-0om3ng5hbf] { display: flex; flex-direction: column; gap: .75rem; width: min(100%, 22rem); }
.code[b-0om3ng5hbf] { text-align: center; font-size: 1.8rem; letter-spacing: .35em; text-transform: uppercase; font-family: ui-monospace, monospace; }
/* /Components/Pages/Join.razor.rz.scp.css */
form[b-4s2qwsq33s] { display: flex; flex-direction: column; gap: .75rem; }
/* /Components/Pages/Participant.razor.rz.scp.css */
.vote[b-vtfgiucqqk] { display: flex; flex-direction: column; gap: .75rem; padding: 1rem; max-width: 40rem; margin: 0 auto; width: 100%; }
header[b-vtfgiucqqk] { display: flex; justify-content: space-between; align-items: baseline; }
.who[b-vtfgiucqqk] { font-weight: 700; font-size: 1.2rem; }
.status[b-vtfgiucqqk] { margin: 0; font-weight: 600; min-height: 1.5rem; }
.deck[b-vtfgiucqqk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(4.5rem, 1fr)); gap: .6rem; }
.tally[b-vtfgiucqqk] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.tally li[b-vtfgiucqqk] { border-radius: 12px; background: var(--ss-surface); border: 2px solid var(--ss-line); }
.tally li.winner[b-vtfgiucqqk] { border-color: var(--ss-accent); }
/* One row layout for both variants: the host's button resets the UA's button styling back to the span's. */
.tally .row[b-vtfgiucqqk] { display: flex; align-items: center; gap: .75rem; width: 100%; padding: .5rem .75rem; box-sizing: border-box; }
.tally button.row[b-vtfgiucqqk] { min-height: var(--ss-tap); font: inherit; color: inherit; text-align: left; background: none; border: 0; cursor: pointer; }
.tally .value[b-vtfgiucqqk] { font-weight: 800; font-size: 1.3rem; min-width: 2.5rem; }
.tally .names[b-vtfgiucqqk] { flex: 1; color: var(--ss-muted); }
.consensus[b-vtfgiucqqk] { color: var(--ss-success); font-weight: 800; font-size: 1.2rem; margin: 0; }
/* /Components/Shared/DeckCard.razor.rz.scp.css */
.card[b-nt3375vpsi] {
  aspect-ratio: 3 / 4; min-height: var(--ss-tap); width: 100%;
  border-radius: 14px; border: 3px solid var(--ss-line); background: var(--ss-surface); color: var(--ss-ink);
  font: inherit; font-size: clamp(1.4rem, 6vw, 2rem); font-weight: 700; cursor: pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.card:active[b-nt3375vpsi] { transform: scale(.96); }
.card.selected[b-nt3375vpsi] { border-color: var(--ss-primary); background: var(--ss-primary); color: var(--ss-primary-ink); transform: translateY(-4px); box-shadow: var(--ss-shadow); }
/* /Components/Shared/HostControls.razor.rz.scp.css */
.host-controls[b-zbhmmr7l0h] { display: flex; gap: .75rem; flex-wrap: wrap; }
/* /Components/Shared/ParticipantChip.razor.rz.scp.css */
.chip[b-0euil7t1y8] {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .5rem 1rem; border-radius: 999px;
  background: var(--ss-surface); border: 2px solid var(--ss-line);
  font-size: 1.25rem; font-weight: 600; box-shadow: var(--ss-shadow);
}
.chip.ready[b-0euil7t1y8] { border-color: var(--ss-accent); }
.chip.offline[b-0euil7t1y8] { opacity: .45; }   /* a dropped phone stays visible but faded */
.tick[b-0euil7t1y8] { color: var(--ss-accent); }
.vote[b-0euil7t1y8] { background: var(--ss-primary); color: var(--ss-primary-ink); border-radius: 8px; padding: 0 .5rem; }
.remove[b-0euil7t1y8] { border: 0; background: transparent; color: var(--ss-muted); font-size: 1.2rem; cursor: pointer; line-height: 1; }
.remove:hover[b-0euil7t1y8] { color: var(--ss-danger); }
/* /Components/Shared/QrCode.razor.rz.scp.css */
.qr[b-mf0cdnpqi2] { background: #fff; padding: .5rem; border-radius: 12px; box-sizing: border-box; }
/* The renderer emits a ViewBox-sized SVG, so it stretches to whatever tile the caller sized. */
.qr[b-mf0cdnpqi2]  svg { width: 100%; height: 100%; display: block; }
/* /Components/Shared/TallyBubble.razor.rz.scp.css */
.bubble[b-rs4kipa5ip] {
  display: flex; flex-direction: column; align-items: center; gap: .5rem;
  padding: 1.25rem 1.5rem; min-width: 11rem;
  border-radius: 28px; background: var(--ss-surface); border: 4px solid var(--ss-line);
  box-shadow: var(--ss-shadow);
  /* The button variant would otherwise inherit the UA's font and centre alignment. */
  font: inherit; color: inherit; text-align: center;
  transition: border-color .2s ease, transform .2s ease;
}
.bubble.pickable[b-rs4kipa5ip] { cursor: pointer; }
.bubble.pickable:hover[b-rs4kipa5ip] { transform: translateY(-3px); }
.bubble.pickable:focus-visible[b-rs4kipa5ip] { outline: 3px solid var(--ss-primary); outline-offset: 3px; }
.bubble.winner[b-rs4kipa5ip] { border-color: var(--ss-accent); }
.bubble.consensus[b-rs4kipa5ip] { border-color: var(--ss-success); transform: scale(1.06); }
.value[b-rs4kipa5ip] { font-size: 4rem; font-weight: 900; line-height: 1; }
.badge[b-rs4kipa5ip] { font-weight: 800; color: var(--ss-accent); }
.consensus-badge[b-rs4kipa5ip] { color: var(--ss-success); }
.names[b-rs4kipa5ip] { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; }
.name[b-rs4kipa5ip] { padding: .25rem .75rem; border-radius: 999px; background: var(--ss-bg); font-weight: 600; font-size: 1.1rem; }