/* /Components/Dialogs/DeleteAccountDialog.razor.rz.scp.css */
.head[b-2a6icptw8v] {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-weight: 900;
    font-size: 1.05rem;
    letter-spacing: -.01em;
    color: var(--clay-600);
}

.body[b-2a6icptw8v] { display: flex; flex-direction: column; gap: .9rem; min-width: min(420px, 80vw); }

.lede[b-2a6icptw8v] { margin: 0; font-size: .95rem; font-weight: 700; color: var(--ink-800); }

.what[b-2a6icptw8v] {
    margin: 0;
    padding-left: 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .4rem;
    font-size: .85rem;
    line-height: 1.4;
    color: var(--ink-600);
}

.prompt[b-2a6icptw8v] { margin: .25rem 0 0; font-size: .85rem; color: var(--ink-700); }
.prompt strong[b-2a6icptw8v] { letter-spacing: .08em; color: var(--clay-600); }
/* /Components/Pages/DivisionMatches.razor.rz.scp.css */
/* ==========================================================================
   /eventos/{id}/divisao/{divId} — every match in one division.
   ========================================================================== */

.dm-back[b-gizxx0vikw] { margin-bottom: .9rem; }

.dm-back a[b-gizxx0vikw] {
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-500);
    text-decoration: none;
}

.dm-back a:hover[b-gizxx0vikw] { color: var(--brand-700); }

/* --- KPI strip ---------------------------------------------------------- */

.dm-kpis[b-gizxx0vikw] {
    display: flex;
    margin: 0 0 1.25rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    padding: 1rem;
}

.dm-kpis > div[b-gizxx0vikw] {
    flex: 1;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: .15rem;
    text-align: center;
}

.dm-kpis > div + div[b-gizxx0vikw] { border-left: 1px solid var(--ink-100); }

.dm-kpis dt[b-gizxx0vikw] {
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.dm-kpis dd[b-gizxx0vikw] {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 900;
    color: var(--ink-900);
    line-height: 1;
}

/* --- controls ----------------------------------------------------------- */

.dm-controls[b-gizxx0vikw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.dm-divisions[b-gizxx0vikw] {
    display: flex;
    gap: .25rem;
    padding: .3rem;
    background: var(--ink-100);
    border-radius: 999px;
    overflow-x: auto;
    max-width: 100%;
}

.dm-division[b-gizxx0vikw] {
    padding: .5rem 1.05rem;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-500);
    text-decoration: none;
    white-space: nowrap;
    transition: color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.dm-division:hover[b-gizxx0vikw] { color: var(--ink-800); }
.dm-division:focus-visible[b-gizxx0vikw] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

.dm-division.is-active[b-gizxx0vikw] {
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    box-shadow: var(--glow-brand-sm);
}

.dm-filter[b-gizxx0vikw] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 0 1 300px;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.dm-filter:focus-within[b-gizxx0vikw] { border-color: var(--brand-300); box-shadow: var(--glow-brand-sm); }

.dm-filter-icon[b-gizxx0vikw] { padding-left: .85rem; font-size: .85rem; opacity: .6; }

.dm-filter-input[b-gizxx0vikw] {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    padding: .7rem .6rem;
    font-family: inherit;
    font-size: .88rem;
    font-weight: 600;
    color: var(--ink-900);
}

.dm-filter-input[b-gizxx0vikw]::placeholder { color: var(--ink-400); font-weight: 500; }
.dm-filter-input:focus[b-gizxx0vikw] { outline: none; }
.dm-filter-input[b-gizxx0vikw]::-webkit-search-cancel-button { display: none; }

.dm-filter-clear[b-gizxx0vikw] {
    border: 0;
    background: none;
    padding: 0 .85rem;
    font-size: 1.2rem;
    line-height: 1;
    color: var(--ink-400);
    cursor: pointer;
}

.dm-filter-clear:hover[b-gizxx0vikw] { color: var(--ink-700); }

/* --- sections ----------------------------------------------------------- */

.dm-section + .dm-section[b-gizxx0vikw] { margin-top: 2rem; }

.dm-section-row[b-gizxx0vikw] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .75rem;
}

.dm-section-h[b-gizxx0vikw] {
    margin: 0;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--brand-700);
}

.dm-section-count[b-gizxx0vikw] { font-size: .74rem; font-weight: 700; color: var(--ink-400); }

.dm-list[b-gizxx0vikw] { display: flex; flex-direction: column; gap: .6rem; }

@media (max-width: 599px) {
    .dm-filter[b-gizxx0vikw] { flex: 1 1 100%; }
    .dm-kpis[b-gizxx0vikw] { padding: .75rem .4rem; }
    .dm-kpis dd[b-gizxx0vikw] { font-size: 1.15rem; }
}
/* /Components/Pages/DivisionRound.razor.rz.scp.css */
/* ==========================================================================
   /eventos/{id}/divisao/{divId}/rodada/{round} — one round, one division.
   ========================================================================== */

.dr-back[b-kl5exigq7k] { margin-bottom: .9rem; }

.dr-back a[b-kl5exigq7k] {
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-500);
    text-decoration: none;
}

.dr-back a:hover[b-kl5exigq7k] { color: var(--brand-700); }

.dr-nav[b-kl5exigq7k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: 1.5rem;
    padding: .55rem .75rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: 999px;
}

.dr-nav-link[b-kl5exigq7k] {
    padding: .35rem .8rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    color: var(--brand-700);
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .16s ease;
}

.dr-nav-link:hover[b-kl5exigq7k] { background: var(--brand-50); }
.dr-nav-link:focus-visible[b-kl5exigq7k] { outline: 3px solid var(--brand-500); outline-offset: 2px; }


.dr-nav-all[b-kl5exigq7k] {
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-400);
    text-decoration: none;
    white-space: nowrap;
}

.dr-nav-all:hover[b-kl5exigq7k] { color: var(--ink-700); }

.dr-list[b-kl5exigq7k] { display: flex; flex-direction: column; gap: .6rem; }

@media (max-width: 599px) {
    .dr-nav-all[b-kl5exigq7k] { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .dr-nav-link[b-kl5exigq7k] { transition: none; }
}

/* Invisible slot standing in for an absent prev/next round, so the centre link stays
   centred under space-between. Not `visibility: hidden` on a real link — there is no
   round 0 and no round after the last, so nothing should be announced at all. */
.dr-nav-gap[b-kl5exigq7k] {
    flex: 0 0 auto;
    width: 5.5rem;
}

@media (max-width: 520px) {
    .dr-nav-gap[b-kl5exigq7k] { width: 0; }
}
/* /Components/Pages/EventDetail.razor.rz.scp.css */
/* ==========================================================================
   /eventos/{id} — hero, tabs, panels and the persistent registration bar.
   ========================================================================== */

.ed-back[b-fe3rb2iajb] { margin-bottom: .9rem; }

.ed-back a[b-fe3rb2iajb] {
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-500);
    text-decoration: none;
}

.ed-back a:hover[b-fe3rb2iajb] { color: var(--brand-700); }

.ed-sep[b-fe3rb2iajb] { opacity: .55; margin: 0 .1rem; }

/* --- hero --------------------------------------------------------------- */

/* GradientCard owns its root element, so the page reaches it through ::deep. */
[b-fe3rb2iajb] .ed-hero { position: relative; }

.ed-hero-inner[b-fe3rb2iajb] {
    position: relative;
    z-index: 1;
    padding: 1.9rem 2.1rem 1.6rem;
}

.ed-hero-kicker[b-fe3rb2iajb] {
    margin: 0;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .88);
}

.ed-hero-title[b-fe3rb2iajb] {
    margin: .5rem 0 0;
    font-size: 2.3rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.08;
    color: #fff;
}

.ed-hero-meta[b-fe3rb2iajb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .3rem .5rem;
    margin: .6rem 0 0;
    font-size: .88rem;
    font-weight: 600;
    color: rgba(255, 255, 255, .92);
}

.ed-hero-chips[b-fe3rb2iajb] {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-top: 1rem;
}

.ed-chip[b-fe3rb2iajb] {
    padding: .28rem .7rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .2);
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    backdrop-filter: blur(2px);
}

.ed-chip.is-hot[b-fe3rb2iajb] { background: var(--sun-300); color: var(--ink-900); }

.ed-kpis[b-fe3rb2iajb] {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    margin: 1.4rem 0 0;
    padding-top: 1.1rem;
    border-top: 1px solid rgba(255, 255, 255, .25);
}

.ed-kpis > div[b-fe3rb2iajb] { display: flex; flex-direction: column-reverse; gap: .1rem; }

.ed-kpis dt[b-fe3rb2iajb] {
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .8);
}

.ed-kpis dd[b-fe3rb2iajb] {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1;
    color: #fff;
}

/* --- section headings --------------------------------------------------- */

.ed-section-h[b-fe3rb2iajb] {
    margin: 0;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--brand-700);
}

.ed-section-row[b-fe3rb2iajb] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .7rem;
}

.ed-seeall[b-fe3rb2iajb] {
    font-size: .76rem;
    font-weight: 800;
    color: var(--brand-700);
    text-decoration: none;
    white-space: nowrap;
}

.ed-seeall:hover[b-fe3rb2iajb] { text-decoration: underline; }

/* --- prizes ------------------------------------------------------------- */

.ed-prizes[b-fe3rb2iajb] {
    margin-top: 1.5rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    padding: 1.25rem 1.4rem;
}

.ed-prize-list[b-fe3rb2iajb] { display: flex; flex-direction: column; margin-top: .9rem; }

.ed-prize[b-fe3rb2iajb] {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    padding: .7rem 0;
}

.ed-prize + .ed-prize[b-fe3rb2iajb] { border-top: 1px solid var(--ink-100); }

.ed-prize-badge[b-fe3rb2iajb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    font-size: 1rem;
    font-weight: 900;
    color: var(--ink-700);
    flex: none;
}

.ed-prize-body[b-fe3rb2iajb] { min-width: 0; }

.ed-prize-head[b-fe3rb2iajb] {
    margin: 0;
    font-size: .9rem;
    font-weight: 900;
    color: var(--ink-900);
}

.ed-prize-div[b-fe3rb2iajb] {
    margin-left: .5rem;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.ed-prize-items[b-fe3rb2iajb] { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .4rem; }

.ed-prize-item[b-fe3rb2iajb] {
    padding: .18rem .6rem;
    border-radius: 999px;
    background: var(--ink-50);
    font-size: .74rem;
    font-weight: 800;
    color: var(--ink-700);
}

/* --- division picker ---------------------------------------------------- */

.ed-divisions[b-fe3rb2iajb] { margin-top: 1.5rem; }

.ed-divisions-cap[b-fe3rb2iajb] {
    margin: 0 0 .5rem;
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.ed-division-pills[b-fe3rb2iajb] { display: flex; flex-wrap: wrap; gap: .55rem; }

.ed-division-pill[b-fe3rb2iajb] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .1rem;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    background: #fff;
    padding: .55rem .95rem;
    font-family: inherit;
    cursor: pointer;
    text-align: left;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.ed-division-pill:hover[b-fe3rb2iajb] { border-color: var(--brand-300); }
.ed-division-pill:focus-visible[b-fe3rb2iajb] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

.ed-division-pill.is-active[b-fe3rb2iajb] {
    background-image: var(--raqt-gradient-sun);
    border-color: transparent;
    box-shadow: var(--glow-sun-sm);
}

.ed-division-name[b-fe3rb2iajb] { font-size: .88rem; font-weight: 900; color: var(--ink-900); }

.ed-division-sub[b-fe3rb2iajb] {
    font-size: .66rem;
    font-weight: 700;
    color: var(--ink-400);
}

.ed-division-pill.is-active .ed-division-sub[b-fe3rb2iajb] { color: rgba(29, 39, 53, .68); }

/* --- tabs --------------------------------------------------------------- */

.ed-tabs[b-fe3rb2iajb] {
    display: flex;
    gap: .3rem;
    margin: 1.75rem 0 1.1rem;
    padding: .3rem;
    background: var(--ink-100);
    border-radius: 999px;
    width: max-content;
    max-width: 100%;
    overflow-x: auto;
}

.ed-tab[b-fe3rb2iajb] {
    border: 0;
    border-radius: 999px;
    background: none;
    padding: .55rem 1.15rem;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-500);
    white-space: nowrap;
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.ed-tab:hover[b-fe3rb2iajb] { color: var(--ink-800); }
.ed-tab:focus-visible[b-fe3rb2iajb] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

.ed-tab.is-active[b-fe3rb2iajb] {
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    box-shadow: var(--glow-brand-sm);
}

.ed-panel[b-fe3rb2iajb] { padding-bottom: 1.5rem; }

/* --- KPI card ----------------------------------------------------------- */

.ed-kpi-card[b-fe3rb2iajb] {
    display: flex;
    margin: 0 0 1.4rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    padding: 1rem;
}

.ed-kpi-card > div[b-fe3rb2iajb] {
    flex: 1;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: .15rem;
    text-align: center;
}

.ed-kpi-card > div + div[b-fe3rb2iajb] { border-left: 1px solid var(--ink-100); }

.ed-kpi-card dt[b-fe3rb2iajb] {
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.ed-kpi-card dd[b-fe3rb2iajb] {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 900;
    color: var(--ink-900);
    line-height: 1;
}

/* --- match columns ------------------------------------------------------ */

.ed-match-cols[b-fe3rb2iajb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 1.75rem;
}

.ed-match-list[b-fe3rb2iajb] { display: flex; flex-direction: column; gap: .6rem; }

/* --- rounds calendar ---------------------------------------------------- */

.ed-rounds[b-fe3rb2iajb] {
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    overflow: hidden;
}

.ed-rounds li + li[b-fe3rb2iajb] { border-top: 1px solid var(--ink-100); }

.ed-round[b-fe3rb2iajb] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: .8rem 1.1rem;
    text-decoration: none;
    color: inherit;
    transition: background-color .16s ease;
}

.ed-round:hover[b-fe3rb2iajb] { background: var(--ink-50); }
.ed-round:focus-visible[b-fe3rb2iajb] { outline: 3px solid var(--brand-500); outline-offset: -3px; }

.ed-round-tag[b-fe3rb2iajb] {
    font-size: .88rem;
    font-weight: 900;
    color: var(--ink-900);
    min-width: 6.5rem;
}

.ed-round-dates[b-fe3rb2iajb] {
    font-size: .78rem;
    font-weight: 800;
    color: var(--ink-600);
    font-variant-numeric: tabular-nums;
}

.ed-round-count[b-fe3rb2iajb] {
    margin-left: auto;
    font-size: .74rem;
    font-weight: 700;
    color: var(--ink-400);
}

.ed-round-chev[b-fe3rb2iajb] { color: var(--ink-300); font-size: 1.2rem; line-height: 1; }

/* --- sticky registration bar -------------------------------------------- */

.ed-regbar[b-fe3rb2iajb] {
    position: sticky;
    bottom: 0;
    z-index: 30;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.5rem;
    padding: .95rem 1.35rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    box-shadow: 0 -6px 26px rgba(15, 22, 31, .12);
}

.ed-regbar.is-done[b-fe3rb2iajb] { border-color: var(--brand-300); background: var(--brand-50); }

.ed-regbar-info[b-fe3rb2iajb] { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }

.ed-regbar-title[b-fe3rb2iajb] {
    font-size: 1.1rem;
    font-weight: 900;
    color: var(--ink-900);
    letter-spacing: -.01em;
}

.ed-regbar-sub[b-fe3rb2iajb] {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    font-size: .78rem;
    font-weight: 600;
    color: var(--ink-500);
}

.ed-regbar-actions[b-fe3rb2iajb] { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }

.ed-regbar-select[b-fe3rb2iajb] {
    border: 1px solid var(--ink-200);
    border-radius: 999px;
    background: #fff;
    padding: .7rem 1rem;
    font-family: inherit;
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-800);
    cursor: pointer;
}

.ed-regbar-select:focus-visible[b-fe3rb2iajb] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

/* The mobile shell floats a pill tab bar over the bottom of the viewport —
   lift the sticky bar clear of it. */
@media (max-width: 767px) {
    .ed-regbar[b-fe3rb2iajb] { bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px)); }
    .ed-hero-title[b-fe3rb2iajb] { font-size: 1.7rem; }
    .ed-hero-inner[b-fe3rb2iajb] { padding: 1.4rem 1.35rem 1.2rem; }
    .ed-kpis[b-fe3rb2iajb] { gap: 1.25rem; }
    .ed-regbar-actions[b-fe3rb2iajb] { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .ed-tab[b-fe3rb2iajb],
    .ed-division-pill[b-fe3rb2iajb],
    .ed-round[b-fe3rb2iajb] { transition: none; }
}
/* /Components/Pages/Events.razor.rz.scp.css */
/* ==========================================================================
   /eventos — the browse surface. This page has to sell the calendar, so the
   cards get real presence: an accent rail per event type, a glow lift on hover
   and a countdown that turns clay when the deadline is close.
   ========================================================================== */

.ev-controls[b-r75r1nmzed] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

/* --- search ------------------------------------------------------------- */

.ev-search[b-r75r1nmzed] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 280px;
    max-width: 420px;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.ev-search:focus-within[b-r75r1nmzed] { border-color: var(--brand-300); box-shadow: var(--glow-brand-sm); }

.ev-search-icon[b-r75r1nmzed] { padding-left: .85rem; font-size: .9rem; opacity: .55; }

.ev-search-input[b-r75r1nmzed] {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    padding: .75rem .6rem;
    font-family: inherit;
    font-size: .9rem;
    font-weight: 600;
    color: var(--ink-900);
}

.ev-search-input[b-r75r1nmzed]::placeholder { color: var(--ink-400); font-weight: 500; }
.ev-search-input:focus[b-r75r1nmzed] { outline: none; }
.ev-search-input[b-r75r1nmzed]::-webkit-search-cancel-button { display: none; }

.ev-search-clear[b-r75r1nmzed] {
    border: 0;
    background: none;
    padding: 0 .85rem;
    font-size: 1.2rem;
    line-height: 1;
    color: var(--ink-400);
    cursor: pointer;
}

.ev-search-clear:hover[b-r75r1nmzed] { color: var(--ink-700); }

/* --- filter chips ------------------------------------------------------- */

.ev-chips[b-r75r1nmzed] { display: flex; flex-wrap: wrap; gap: .5rem; }

.ev-chip[b-r75r1nmzed] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    border: 1px solid var(--ink-200);
    border-radius: 999px;
    background: #fff;
    padding: .5rem .9rem;
    font-family: inherit;
    font-size: .78rem;
    font-weight: 800;
    color: var(--ink-700);
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.ev-chip:hover[b-r75r1nmzed] { border-color: var(--brand-300); color: var(--brand-700); }
.ev-chip:focus-visible[b-r75r1nmzed] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

.ev-chip.is-active[b-r75r1nmzed] {
    background-image: var(--raqt-gradient-brand);
    border-color: transparent;
    color: #fff;
    box-shadow: var(--glow-sun-sm);
}

.ev-chip-count[b-r75r1nmzed] {
    min-width: 1.25rem;
    padding: .05rem .3rem;
    border-radius: 999px;
    background: var(--ink-50);
    color: var(--ink-500);
    font-size: .68rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

.ev-chip.is-active .ev-chip-count[b-r75r1nmzed] { background: rgba(255, 255, 255, .28); color: #fff; }

.ev-scope[b-r75r1nmzed] {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin: 0 0 1rem;
}

.ev-scope-label[b-r75r1nmzed] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.ev-scope-select[b-r75r1nmzed] {
    appearance: none;
    font-family: inherit;
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-800);
    background: #fff;
    border: 1px solid var(--ink-200);
    border-radius: 999px;
    padding: .5rem 2.2rem .5rem 1rem;
    cursor: pointer;
    /* Chevron drawn inline so there's no external asset and it tints with the brand. */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%235fa836' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .9rem center;
    background-size: 12px 8px;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.ev-scope-select:hover[b-r75r1nmzed] { border-color: var(--brand-300); }

/* Inline flat icons sit on the text baseline and inherit its colour. ::deep because
   MudIcon renders the <svg> itself, outside this sheet's isolation scope. */
.ev-meta-item[b-r75r1nmzed],
.ev-reg-pill[b-r75r1nmzed] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

.ev-meta-item[b-r75r1nmzed]  .mud-icon-root,
.ev-reg-pill[b-r75r1nmzed]  .mud-icon-root { font-size: 1rem; width: 1rem; height: 1rem; }

.ev-search-icon[b-r75r1nmzed]  .mud-icon-root { font-size: 1.1rem; width: 1.1rem; height: 1.1rem; }

.ev-scope-select:focus-visible[b-r75r1nmzed] {
    outline: none;
    border-color: var(--brand-400);
    box-shadow: var(--glow-brand-sm);
}

/* --- the grid ----------------------------------------------------------- */

/* One event per row. A club runs a handful of events a year, never a wall of them,
   so a card grid just leaves most of the width empty — a full-width row scans faster
   and puts the stats on a predictable vertical axis. Falls back to a stacked card
   under 720px, where a row would wrap into mush. */
.ev-grid[b-r75r1nmzed] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.ev-card[b-r75r1nmzed] {
    /* Two ramps the mobile system uses that raqt-web.css doesn't expose yet: clay-100
       and the gender-badge trio (sky / pink / violet), copied verbatim from mobile's
       eventGenderStyle. Declared here rather than :root because Blazor scopes every
       selector in this file. Promote to raqt-web.css when that file can be edited. */
    --ev-clay-100: #fae5d8;
    --ev-clay-wash: #fdf1ea;
    --ev-masc-bg: #e0f2fe;
    --ev-masc-fg: #0369a1;
    --ev-fem-bg: #fce7f3;
    --ev-fem-fg: #be185d;
    --ev-misto-bg: #ede9fe;
    --ev-misto-fg: #6d28d9;

    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "badges stats"
        "name   stats"
        "meta   stats";
    align-items: center;
    column-gap: 2.5rem;
    row-gap: .25rem;
    padding: 1rem 1.5rem 1rem 1.5rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    text-decoration: none;
    color: inherit;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(146, 208, 80, .06);
    transition: box-shadow .22s ease, border-color .22s ease, transform .18s ease;
}

.ev-badges[b-r75r1nmzed] { grid-area: badges; }
.ev-name[b-r75r1nmzed]   { grid-area: name; }
.ev-meta[b-r75r1nmzed]   { grid-area: meta; }
.ev-stats[b-r75r1nmzed]  { grid-area: stats; }

/* A row lifts sideways, not up — vertical lift on a full-width row reads as jitter. */
.ev-card:hover[b-r75r1nmzed] {
    transform: translateX(2px);
    border-color: var(--brand-200);
    box-shadow: var(--glow-brand-sm);
}

.ev-card:focus-visible[b-r75r1nmzed] { outline: 3px solid var(--brand-500); outline-offset: 3px; }

/* Accent rail — the event type, readable before you read a word. */
.ev-rail[b-r75r1nmzed] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
}

.ev-card.is-league .ev-rail[b-r75r1nmzed] { background-image: linear-gradient(180deg, var(--brand-600), var(--brand-400)); }
.ev-card.is-tournament .ev-rail[b-r75r1nmzed] { background-image: linear-gradient(180deg, var(--sun-500), var(--sun-300)); }
.ev-card.is-open .ev-rail[b-r75r1nmzed] { background-image: linear-gradient(180deg, var(--clay-600), var(--clay-400)); }

.ev-badges[b-r75r1nmzed] { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }

.ev-badge[b-r75r1nmzed] {
    padding: .18rem .55rem;
    border-radius: 999px;
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.ev-card.is-league .ev-badge.is-type[b-r75r1nmzed] { background: var(--brand-100); color: var(--brand-800); }
.ev-card.is-tournament .ev-badge.is-type[b-r75r1nmzed] { background: var(--sun-200); color: var(--sun-700); }
.ev-card.is-open .ev-badge.is-type[b-r75r1nmzed] { background: var(--ev-clay-100); color: var(--clay-600); }

.ev-badge.is-masc[b-r75r1nmzed] { background: var(--ev-masc-bg); color: var(--ev-masc-fg); }
.ev-badge.is-fem[b-r75r1nmzed] { background: var(--ev-fem-bg); color: var(--ev-fem-fg); }
.ev-badge.is-misto[b-r75r1nmzed] { background: var(--ev-misto-bg); color: var(--ev-misto-fg); }

.ev-status[b-r75r1nmzed] {
    margin-left: auto;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.ev-name[b-r75r1nmzed] {
    font-size: 1.2rem;
    font-weight: 900;
    letter-spacing: -.02em;
    line-height: 1.2;
    color: var(--ink-900);
}

.ev-meta[b-r75r1nmzed] {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .9rem;
    font-size: .8rem;
    font-weight: 600;
    color: var(--ink-500);
}

.ev-meta-item[b-r75r1nmzed] { display: inline-flex; align-items: center; gap: .35rem; }

/* --- stat strip --------------------------------------------------------- */

/* In row mode the stats sit to the right on their own axis, so the horizontal rule
   that separated them in the old stacked card is gone. */
.ev-stats[b-r75r1nmzed] {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.ev-stats .ev-stat[b-r75r1nmzed] { text-align: right; align-items: flex-end; }

@media (max-width: 720px) {
    .ev-card[b-r75r1nmzed] {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "badges" "name" "meta" "stats";
        row-gap: .6rem;
        padding: 1rem 1.1rem 1rem 1.4rem;
    }

    .ev-card:hover[b-r75r1nmzed] { transform: none; }

    .ev-stats[b-r75r1nmzed] {
        gap: 1.5rem;
        padding-top: .8rem;
        border-top: 1px solid var(--ink-100);
    }

    .ev-stats .ev-stat[b-r75r1nmzed] { text-align: left; align-items: flex-start; }
}

.ev-stat[b-r75r1nmzed] { display: flex; flex-direction: column; gap: .1rem; }

.ev-stat-value[b-r75r1nmzed] {
    font-size: 1rem;
    font-weight: 900;
    color: var(--ink-900);
    line-height: 1.1;
}

.ev-stat-value.is-free[b-r75r1nmzed] { color: var(--brand-700); }

.ev-stat-label[b-r75r1nmzed] {
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

/* --- registration strip ------------------------------------------------- */

.ev-reg[b-r75r1nmzed] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    margin: 0 -1.25rem -1.1rem -1.5rem;
    padding: .6rem 1.25rem .6rem 1.5rem;
    background: var(--sun-50);
    border-top: 1px solid var(--sun-100);
}

.ev-reg-pill[b-r75r1nmzed] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 900;
    color: var(--sun-700);
}

.ev-reg-count[b-r75r1nmzed] { font-size: .72rem; font-weight: 800; color: var(--ink-500); }

.ev-reg.is-urgent[b-r75r1nmzed] { background: var(--ev-clay-wash); border-top-color: var(--ev-clay-100); }
.ev-reg.is-urgent .ev-reg-pill[b-r75r1nmzed] { color: var(--clay-600); }
.ev-reg.is-urgent .ev-reg-count[b-r75r1nmzed] { color: var(--clay-600); }

.ev-reg.is-soon[b-r75r1nmzed] { background: var(--ink-50); border-top-color: var(--ink-100); }
.ev-reg.is-soon .ev-reg-pill[b-r75r1nmzed] { color: var(--ink-500); }

@media (max-width: 599px) {
    .ev-grid[b-r75r1nmzed] { grid-template-columns: minmax(0, 1fr); }
    .ev-search[b-r75r1nmzed] { max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ev-card[b-r75r1nmzed] { transition: none; }
    .ev-card:hover[b-r75r1nmzed] { transform: none; }
}
/* /Components/Pages/Feed.razor.rz.scp.css */
/* /feed — a single readable column. Rows come from FeedRow (own scope); this file
   owns the column, the load-more affordance and the end-of-feed line. */

/* A single centred column, narrower than the page. Cards then run edge to edge inside
   it, which is what lets a photo carry a post — but the column itself stays around the
   length of a comfortable line so titles and scores don't sprawl across a wide monitor. */
.feed-col[b-h66kunev8i] {
    max-width: 600px;
    margin-inline: auto;
}

.feed-more[b-h66kunev8i] {
    display: flex;
    justify-content: center;
    padding: 1.25rem 0 .5rem;
}

/* ::deep — GradientButton renders the <button>, outside this page's scope. */
.feed-more[b-h66kunev8i]  .feed-more-btn { min-width: 220px; }

.feed-end[b-h66kunev8i] {
    text-align: center;
    margin: 1.5rem 0 .5rem;
    font-size: .78rem;
    font-weight: 700;
    color: var(--ink-400);
}

/* The teaser and the empty state both want breathing room under the page header. */
.feed-col[b-h66kunev8i]  .raqt-empty { padding: 3.5rem 1.5rem; }

/* Anchors wearing the pill-CTA class (EmptyState actions, teaser CTAs) must not
   pick up the default link underline. */
a.raqt-gradient-btn[b-h66kunev8i] { text-decoration: none; }
/* /Components/Pages/FindMatch.razor.rz.scp.css */
/* /encontrar-parceiro — gradient hero with the filters baked in, then list | panel. */

/* ==========================================================================
   Hero
   ========================================================================== */

.fm-hero-inner[b-buo9qn3ql4] { position: relative; z-index: 1; padding: 1.75rem 2.25rem 2rem; }

.fm-kicker[b-buo9qn3ql4] { color: rgba(255, 255, 255, .85); }

.fm-title[b-buo9qn3ql4] {
    margin: 0;
    font-size: 2.1rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: #fff;
}

.fm-sub[b-buo9qn3ql4] {
    margin: .5rem 0 0;
    font-size: .9rem;
    font-weight: 600;
    color: rgba(255, 255, 255, .9);
}

/* --- search pill --- */

.fm-search[b-buo9qn3ql4] {
    display: flex;
    align-items: center;
    gap: .5rem;
    max-width: 520px;
    margin-top: 1.5rem;
    padding: .55rem 1rem;
    background: #fff;
    border-radius: 999px;
}

.fm-search-icon[b-buo9qn3ql4] { display: inline-flex; color: var(--ink-400); }

.fm-search-input[b-buo9qn3ql4] {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    background: none;
    font-family: inherit;
    font-size: .92rem;
    font-weight: 600;
    color: var(--ink-900);
}

.fm-search-input[b-buo9qn3ql4]::placeholder { color: var(--ink-400); font-weight: 500; }
.fm-search-input[b-buo9qn3ql4]::-webkit-search-cancel-button { display: none; }

.fm-search-clear[b-buo9qn3ql4] {
    border: 0;
    background: var(--ink-100);
    color: var(--ink-600);
    border-radius: 50%;
    width: 22px;
    height: 22px;
    font-size: .7rem;
    line-height: 1;
    cursor: pointer;
}

.fm-search-clear:hover[b-buo9qn3ql4] { background: var(--ink-200); }

/* --- mode segments --- */

.fm-modes[b-buo9qn3ql4] {
    display: inline-flex;
    gap: .25rem;
    margin-top: 1rem;
    padding: .25rem;
    background: rgba(255, 255, 255, .18);
    border-radius: var(--radius-2xl);
}

.fm-mode[b-buo9qn3ql4] {
    font-family: inherit;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    background: none;
    border: 0;
    border-radius: var(--radius-xl);
    padding: .5rem 1.1rem;
    cursor: pointer;
    transition: background-color .16s ease, color .16s ease;
}

.fm-mode:hover:not(:disabled)[b-buo9qn3ql4] { background: rgba(255, 255, 255, .18); }
.fm-mode.is-on[b-buo9qn3ql4] { background: #fff; color: var(--brand-700); }
.fm-mode:disabled[b-buo9qn3ql4] { opacity: .45; cursor: default; }
.fm-mode:focus-visible[b-buo9qn3ql4] { outline: 2px solid #fff; outline-offset: 2px; }

/* --- gender filter, deliberately quieter than the segments --- */

.fm-gender[b-buo9qn3ql4] { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; margin-top: .85rem; }

.fm-gender-label[b-buo9qn3ql4] {
    margin-right: .25rem;
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .65);
}

.fm-gender-chip[b-buo9qn3ql4] {
    font-family: inherit;
    font-size: .7rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .8);
    background: rgba(255, 255, 255, .12);
    border: 0;
    border-radius: 999px;
    padding: .25rem .7rem;
    cursor: pointer;
}

.fm-gender-chip:hover[b-buo9qn3ql4] { background: rgba(255, 255, 255, .22); }
.fm-gender-chip.is-on[b-buo9qn3ql4] { background: rgba(255, 255, 255, .34); color: #fff; }

/* ==========================================================================
   Results
   ========================================================================== */

.fm-locked[b-buo9qn3ql4] { margin-top: 2rem; }

.fm-layout[b-buo9qn3ql4] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    margin-top: 1.75rem;
    align-items: start;
}

/* The invite form claims a column only once someone is picked, and only where the
   list can still breathe beside it. */
@media (min-width: 1100px) {
    .fm-layout.has-panel[b-buo9qn3ql4] { grid-template-columns: minmax(0, 1fr) 360px; }
}

@media (max-width: 1099px) {
    .fm-layout.has-panel[b-buo9qn3ql4] { display: flex; flex-direction: column-reverse; }
}

.fm-list-col[b-buo9qn3ql4] { min-width: 0; }

.fm-panel[b-buo9qn3ql4] { position: sticky; top: 1.5rem; }

@media (max-width: 1099px) {
    .fm-panel[b-buo9qn3ql4] { position: static; }
}

.fm-count[b-buo9qn3ql4] {
    margin: 0 0 .75rem;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.fm-list[b-buo9qn3ql4] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .6rem; }

/* --- opponent card (a button: the whole row opens the invite form) --- */

.fm-card[b-buo9qn3ql4] {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    text-align: left;
    font-family: inherit;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    padding: .85rem 1rem;
    cursor: pointer;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.fm-card:hover[b-buo9qn3ql4] { border-color: var(--brand-300); box-shadow: var(--glow-brand-sm); transform: translateY(-1px); }

.fm-card.is-on[b-buo9qn3ql4] {
    border-color: var(--brand-400);
    box-shadow: var(--glow-brand);
    background: var(--brand-50);
}

.fm-card:focus-visible[b-buo9qn3ql4] { outline: 3px solid var(--brand-600); outline-offset: 2px; }

.fm-card-text[b-buo9qn3ql4] { display: flex; flex-direction: column; gap: .3rem; min-width: 0; flex: 1; }

.fm-card-name[b-buo9qn3ql4] {
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fm-card-chips[b-buo9qn3ql4] { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; }

.fm-rank[b-buo9qn3ql4],
.fm-prov[b-buo9qn3ql4] {
    display: inline-flex;
    align-items: center;
    padding: .16rem .5rem;
    border-radius: 999px;
    background: var(--ink-100);
    color: var(--ink-600);
    font-size: .68rem;
    font-weight: 800;
    white-space: nowrap;
}

.fm-prov[b-buo9qn3ql4] { background: var(--sun-100); color: var(--sun-700); }

.fm-card-last[b-buo9qn3ql4] { font-size: .74rem; font-weight: 600; color: var(--ink-400); }

.fm-card-rating[b-buo9qn3ql4] { display: flex; flex-direction: column; align-items: flex-end; flex: none; }

.fm-card-rating-value[b-buo9qn3ql4] {
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: -.03em;
    color: var(--brand-700);
    line-height: 1;
}

.fm-card-delta[b-buo9qn3ql4] { margin-top: .25rem; font-size: .68rem; font-weight: 700; color: var(--ink-400); white-space: nowrap; }

/* ==========================================================================
   Narrow screens
   ========================================================================== */

@media (max-width: 767px) {
    .fm-hero-inner[b-buo9qn3ql4] { padding: 1.25rem 1.25rem 1.5rem; }
    .fm-title[b-buo9qn3ql4] { font-size: 1.65rem; }
    .fm-modes[b-buo9qn3ql4] { display: flex; width: 100%; }
    .fm-mode[b-buo9qn3ql4] { flex: 1; padding: .5rem .5rem; }
    .fm-card[b-buo9qn3ql4] { gap: .75rem; padding: .75rem; }
    .fm-card-rating-value[b-buo9qn3ql4] { font-size: 1.1rem; }
}

@media (prefers-reduced-motion: reduce) {
    .fm-card[b-buo9qn3ql4],
    .fm-mode[b-buo9qn3ql4] { transition: none; }
}

/* Anchors wearing the pill-CTA class (EmptyState actions, teaser CTAs) must not
   pick up the default link underline. */
a.raqt-gradient-btn[b-buo9qn3ql4] { text-decoration: none; }
/* /Components/Pages/HeadToHead.razor.rz.scp.css */
.scoreboard[b-1vne24z589] {
    position: relative;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(15, 22, 31, .06);
    margin-bottom: 2rem;
}

.scoreboard-rail[b-1vne24z589] {
    display: block;
    height: 5px;
    background-image: var(--raqt-gradient-brand);
}

.scoreboard-inner[b-1vne24z589] { padding: 1.75rem; }

.duel[b-1vne24z589] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
    margin-top: .75rem;
}

.duel-side[b-1vne24z589] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    padding: 1rem;
    border-radius: var(--radius-2xl);
    border: 1px solid transparent;
    text-decoration: none;
    color: inherit;
    min-width: 0;
    transition: border-color .18s ease, background-color .18s ease;
}

.duel-side:hover[b-1vne24z589] { border-color: var(--brand-300); background: var(--brand-50); }

/* The player ahead in the record gets the brand treatment — the whole point of
   the page is "who owns this rivalry". */
.duel-side.leads .duel-wins[b-1vne24z589] { color: var(--brand-700); }

.duel-name[b-1vne24z589] {
    font-size: 1rem;
    font-weight: 900;
    letter-spacing: -.01em;
    color: var(--ink-900);
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.duel-rating[b-1vne24z589] {
    font-size: .76rem;
    font-weight: 800;
    color: var(--brand-700);
    background: var(--brand-50);
    border-radius: 999px;
    padding: .1rem .55rem;
}

.duel-wins[b-1vne24z589] {
    margin-top: .35rem;
    font-size: 2.75rem;
    font-weight: 900;
    letter-spacing: -.04em;
    line-height: 1;
    color: var(--ink-900);
}

.duel-wins-label[b-1vne24z589] {
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.duel-mid[b-1vne24z589] { display: flex; flex-direction: column; align-items: center; }

.duel-total[b-1vne24z589] {
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-400);
    white-space: nowrap;
}

/* ------------------------------------------------------------------ the bar */

.bar[b-1vne24z589] {
    display: flex;
    height: 14px;
    border-radius: 999px;
    overflow: hidden;
    background: var(--ink-100);
    margin-top: 1.5rem;
}

.bar-a[b-1vne24z589] { background-image: var(--raqt-gradient-brand); }
.bar-b[b-1vne24z589] { background: var(--ink-800); }

.bar-empty[b-1vne24z589] {
    flex: 1;
    text-align: center;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
    line-height: 14px;
}

.bar-legend[b-1vne24z589] {
    display: flex;
    justify-content: space-between;
    margin-top: .4rem;
    font-size: .68rem;
    font-weight: 800;
    color: var(--ink-500);
    gap: 1rem;
}

.bar-legend span[b-1vne24z589] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* --------------------------------------------------------------- match list */

.section-title[b-1vne24z589] {
    margin: 0 0 .85rem;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-500);
}

@media (max-width: 599px) {
    .scoreboard-inner[b-1vne24z589] { padding: 1.25rem; }
    .duel[b-1vne24z589] { gap: .35rem; }
    .duel-side[b-1vne24z589] { padding: .5rem; }
    .duel-wins[b-1vne24z589] { font-size: 2rem; }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Home — hero + three streams + a context rail that doesn't repeat them.
   The hero card itself keeps the global .raqt-home-hero chrome from raqt-web.css; this
   file adds the identity block, the gap band, and the grid the phone can't have. */

/* ==========================================================================
   Membership banner (above the fold, only when it changes what you'd do)
   ========================================================================== */

.home-banner[b-g6i9wcusp6] {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1.25rem;
    padding: .8rem 1.1rem;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--ink-100);
    background: #fff;
    text-decoration: none;
    color: inherit;
    transition: transform .18s ease, box-shadow .18s ease;
}

.home-banner:hover[b-g6i9wcusp6] { transform: translateY(-1px); box-shadow: var(--glow-brand-sm); }

.home-banner.is-upsell[b-g6i9wcusp6] { background: var(--ink-900); border-color: var(--ink-900); color: #fff; }
.home-banner.is-trial[b-g6i9wcusp6]  { background: var(--brand-50); border-color: var(--brand-200); }
.home-banner.is-urgent[b-g6i9wcusp6] { background: #fdf5f0; border-color: #f0c9b8; }

.home-banner-icon[b-g6i9wcusp6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    flex: none;
    background: rgba(146, 208, 80, .18);
    color: var(--brand-600);
}

.home-banner.is-upsell .home-banner-icon[b-g6i9wcusp6] { background: rgba(255, 255, 255, .14); color: var(--sun-300); }
.home-banner.is-urgent .home-banner-icon[b-g6i9wcusp6] { background: rgba(211, 95, 52, .12); color: var(--clay-600); }

.home-banner-text[b-g6i9wcusp6] { display: flex; flex-direction: column; font-size: .85rem; font-weight: 600; }

.home-banner-text strong[b-g6i9wcusp6] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
    opacity: .75;
    margin-bottom: .1rem;
}

/* ==========================================================================
   Hero
   ========================================================================== */

.raqt-home-hero-inner[b-g6i9wcusp6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    flex-wrap: wrap;
}

.home-hero-id[b-g6i9wcusp6] { display: flex; align-items: center; gap: 1.5rem; min-width: 0; }

.home-hero-who[b-g6i9wcusp6] { min-width: 0; }

.home-hero-name[b-g6i9wcusp6] {
    margin: 0;
    font-size: 2.4rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.05;
    color: #fff;
}

.home-hero-chips[b-g6i9wcusp6] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .75rem;
}

.home-hero-rank[b-g6i9wcusp6],
.home-hero-prov[b-g6i9wcusp6] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .22rem .65rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .22);
    color: #fff;
    font-size: .74rem;
    font-weight: 800;
    white-space: nowrap;
}

.home-hero-score[b-g6i9wcusp6] { text-align: right; flex: none; }
.home-hero-wl[b-g6i9wcusp6] { margin: .4rem 0 0; font-size: .8rem; font-weight: 700; color: rgba(255, 255, 255, .8); }

/* --- the gap band: full-width, its own surface, CTA welded to it --- */

.home-gap[b-g6i9wcusp6] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
    padding: 1.25rem 2.25rem 1.5rem;
    background: rgba(15, 22, 31, .18);
    backdrop-filter: blur(2px);
    border-top: 1px solid rgba(255, 255, 255, .2);
}

.home-gap-copy[b-g6i9wcusp6] { min-width: 0; }

/* ::deep — TierGapLine renders its own span and carries no scope attribute.
   This is the north-star line, so it gets headline weight, not caption weight. */
.home-gap-copy[b-g6i9wcusp6]  .home-gap-line {
    display: block;
    font-size: 1.5rem;
    line-height: 1.25;
    letter-spacing: -.01em;
}

.home-gap-copy[b-g6i9wcusp6]  .home-gap-line .raqt-gap-tier { font-size: 1.5rem; }
.home-gap-copy[b-g6i9wcusp6]  .home-gap-line .raqt-gap-points { font-weight: 800; color: var(--sun-300); }

.home-gap-fallback[b-g6i9wcusp6] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: -.01em;
    color: #fff;
}

.home-gap-sub[b-g6i9wcusp6] {
    margin: .3rem 0 0;
    font-size: .82rem;
    font-weight: 600;
    color: rgba(255, 255, 255, .82);
}

.home-gap-cta[b-g6i9wcusp6] { flex: none; text-decoration: none; }

/* ==========================================================================
   Three streams
   ========================================================================== */

.home-grid[b-g6i9wcusp6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.25rem;
    margin-top: 1.75rem;
    /* Stretch, not start: three panels of wildly different heights read as broken
       layout. Every card matches the tallest and its content centres inside. */
    align-items: stretch;
}

/* Desktop gets the real 3-up command centre even when the rails eat the width. */
@media (min-width: 1280px) {
    .home-grid[b-g6i9wcusp6] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.home-card[b-g6i9wcusp6] {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    padding: 1.25rem;
    min-width: 0;
    /* Fill the fold on a desktop viewport so the command centre reads as one screen
       rather than three short boxes floating above a lot of white. */
    min-height: min(560px, calc(100vh - 22rem));
}

/* The empty state is the whole point of a short card — let it own the space. */
.home-card[b-g6i9wcusp6]  .raqt-empty {
    flex: 1;
    justify-content: center;
    border: 0;
    background: none;
    padding: 1rem;
}

/* Lists take the remaining height; a long feed scrolls inside its own card instead
   of dragging every sibling taller. */
.home-list[b-g6i9wcusp6],
.home-feed-list[b-g6i9wcusp6] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.home-card-head[b-g6i9wcusp6] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: 1rem;
}

.home-card-title[b-g6i9wcusp6] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
    line-height: 1.2;
}

.home-card-more[b-g6i9wcusp6] {
    font-size: .72rem;
    font-weight: 800;
    color: var(--brand-600);
    text-decoration: none;
    white-space: nowrap;
}

.home-card-more:hover[b-g6i9wcusp6] { color: var(--brand-700); text-decoration: underline; }

.home-card-more-block[b-g6i9wcusp6] {
    display: block;
    margin-top: .6rem;
    text-align: center;
    padding: .5rem;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
}

.home-list[b-g6i9wcusp6] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }

/* Empty states arrive from EmptyState (child component) — pull them in tighter here. */
.home-card[b-g6i9wcusp6]  .raqt-empty { padding: 1.75rem 1rem; }

/* --- pending confirmation callout --- */

.home-alert[b-g6i9wcusp6] {
    margin-bottom: .9rem;
    padding: .7rem .85rem;
    border-radius: var(--radius-xl);
    background: #fdf5f0;
    border: 1px solid #f0c9b8;
}

.home-alert-title[b-g6i9wcusp6] {
    margin: 0 0 .25rem;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--clay-600);
}

.home-alert-row[b-g6i9wcusp6] {
    display: block;
    font-size: .82rem;
    font-weight: 700;
    color: var(--ink-900);
    text-decoration: none;
}

.home-alert-row:hover[b-g6i9wcusp6] { text-decoration: underline; }

/* --- invite row with inline accept/decline --- */

.home-invite-name[b-g6i9wcusp6] {
    font-size: .9rem;
    font-weight: 800;
    color: var(--ink-900);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-invite[b-g6i9wcusp6] {
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    padding: .65rem .7rem;
}

.home-invite-who[b-g6i9wcusp6] { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: inherit; }

.home-invite-text[b-g6i9wcusp6] { display: flex; flex-direction: column; min-width: 0; }
.home-invite-when[b-g6i9wcusp6] { font-size: .76rem; font-weight: 700; color: var(--brand-700); }
.home-invite-where[b-g6i9wcusp6] { font-size: .7rem; font-weight: 600; color: var(--ink-400); }

.home-invite-actions[b-g6i9wcusp6] { display: flex; gap: .4rem; margin-top: .6rem; }

.home-btn[b-g6i9wcusp6] {
    flex: 1;
    font-family: inherit;
    font-size: .78rem;
    font-weight: 800;
    border-radius: 999px;
    border: 1px solid transparent;
    padding: .45rem .5rem;
    cursor: pointer;
    transition: filter .16s ease, background-color .16s ease, color .16s ease;
}

.home-btn:disabled[b-g6i9wcusp6] { opacity: .5; cursor: default; }

.home-btn.is-accept[b-g6i9wcusp6] {
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    box-shadow: var(--glow-brand-sm);
}

.home-btn.is-accept:hover:not(:disabled)[b-g6i9wcusp6] { filter: brightness(1.04); }

.home-btn.is-decline[b-g6i9wcusp6] { background: #fff; border-color: var(--ink-200); color: var(--ink-500); }
.home-btn.is-decline:hover:not(:disabled)[b-g6i9wcusp6] { border-color: var(--clay-400); color: var(--clay-600); }

.home-btn:focus-visible[b-g6i9wcusp6] { outline: 2px solid var(--brand-600); outline-offset: 2px; }

/* --- feed preview --- */

.home-feed-list[b-g6i9wcusp6]  .feed-row:last-child { margin-bottom: 0; }

/* ==========================================================================
   Context rail (desktop only — the shell hides it below 1280px)
   ========================================================================== */

.home-ctx-block[b-g6i9wcusp6] { margin-bottom: 1.75rem; }

.home-ctx-title[b-g6i9wcusp6] {
    margin: 0 0 .6rem;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.home-ctx-action[b-g6i9wcusp6] {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .6rem .75rem;
    margin-bottom: .35rem;
    border-radius: var(--radius-xl);
    background: #fff;
    border: 1px solid var(--ink-100);
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-800);
    text-decoration: none;
    transition: border-color .16s ease, color .16s ease;
}

.home-ctx-action:hover[b-g6i9wcusp6] { border-color: var(--brand-300); color: var(--brand-700); }

.home-ctx-badge[b-g6i9wcusp6] {
    margin-left: auto;
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 .35rem;
    border-radius: 999px;
    background: var(--clay-500);
    color: #fff;
    font-size: .68rem;
    font-weight: 800;
}

.home-ctx-gap[b-g6i9wcusp6] {
    padding: .9rem 1rem;
    border-radius: var(--radius-2xl);
    background: var(--sun-50);
    border: 1px solid var(--sun-200);
}

.home-ctx-gap[b-g6i9wcusp6]  .home-ctx-gap-line { display: block; font-size: .95rem; line-height: 1.35; }
.home-ctx-gap[b-g6i9wcusp6]  .home-ctx-gap-line .raqt-gap-tier { display: block; font-size: 1.1rem; }
.home-ctx-gap[b-g6i9wcusp6]  .home-ctx-gap-line .raqt-gap-sep { display: none; }

.home-ctx-gap-sub[b-g6i9wcusp6] { margin: .5rem 0 0; font-size: .75rem; font-weight: 600; color: var(--sun-700); }

.home-ctx-empty[b-g6i9wcusp6] { margin: 0; font-size: .78rem; font-weight: 600; color: var(--ink-400); }

.home-ctx-list[b-g6i9wcusp6] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; }

.home-ctx-more[b-g6i9wcusp6] {
    display: block;
    margin-top: .6rem;
    font-size: .72rem;
    font-weight: 800;
    color: var(--brand-600);
    text-decoration: none;
}

.home-ctx-more:hover[b-g6i9wcusp6] { text-decoration: underline; }

/* ==========================================================================
   Narrow screens
   ========================================================================== */

@media (max-width: 900px) {
    .raqt-home-hero-inner[b-g6i9wcusp6] { gap: 1.25rem; }
    .home-hero-id[b-g6i9wcusp6] { gap: 1rem; }
    .home-hero-name[b-g6i9wcusp6] { font-size: 1.75rem; }
    .home-hero-score[b-g6i9wcusp6] { text-align: left; }
    .home-gap[b-g6i9wcusp6] { padding: 1.1rem 1.25rem 1.25rem; }
    .home-gap-cta[b-g6i9wcusp6] { width: 100%; }
    .home-gap-copy[b-g6i9wcusp6]  .home-gap-line { font-size: 1.2rem; }
    .home-gap-copy[b-g6i9wcusp6]  .home-gap-line .raqt-gap-tier { font-size: 1.2rem; }
}

@media (prefers-reduced-motion: reduce) {
    .home-banner[b-g6i9wcusp6],
    .home-btn[b-g6i9wcusp6] { transition: none; }
}

/* Anchors wearing the pill-CTA class (EmptyState actions, teaser CTAs) must not
   pick up the default link underline. */
a.raqt-gradient-btn[b-g6i9wcusp6] { text-decoration: none; }
/* /Components/Pages/Inbox.razor.rz.scp.css */
/* /caixa-de-entrada — the notification inbox. */

.inbox[b-67rv7ghnn5] { max-width: 780px; }

.list[b-67rv7ghnn5] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.foot[b-67rv7ghnn5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .9rem;
    margin-top: 1.5rem;
}

.tally[b-67rv7ghnn5] {
    margin: 0;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.more[b-67rv7ghnn5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 180px;
    min-height: 44px;
    padding: .7rem 1.6rem;
    border-radius: 999px;
    border: 2px solid var(--ink-200);
    background: none;
    font-family: inherit;
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-700);
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease;
}

.more:hover:not(:disabled)[b-67rv7ghnn5] { border-color: var(--brand-400); color: var(--brand-700); }
.more:disabled[b-67rv7ghnn5] { opacity: .6; cursor: default; }
.more:focus-visible[b-67rv7ghnn5] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

/* --- header actions ----------------------------------------------------- */

.mark-all[b-67rv7ghnn5],
.back[b-67rv7ghnn5] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .55rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--ink-200);
    background: #fff;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-700);
    text-decoration: none;
    cursor: pointer;
}

.mark-all[b-67rv7ghnn5] { border-color: var(--brand-300); color: var(--brand-700); background: var(--brand-50); }
.mark-all:hover:not(:disabled)[b-67rv7ghnn5] { background: var(--brand-100); }
.mark-all:disabled[b-67rv7ghnn5] { opacity: .55; cursor: default; }
.back:hover[b-67rv7ghnn5] { border-color: var(--brand-300); color: var(--brand-700); }
/* /Components/Pages/Match.razor.rz.scp.css */
/* Two-column match surface: state on the left, actions in a sticky rail on the
   right (WEB_PLAN.md §5). Below 1080px the rail stacks under the content, which
   is also the order a phone reads it in. */

.grid[b-aqm8ksijch] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 1.5rem;
    align-items: start;
}

.main[b-aqm8ksijch] { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }

.rail[b-aqm8ksijch] {
    position: sticky;
    top: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ================================================================== hero == */

.hero[b-aqm8ksijch] {
    position: relative;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(15, 22, 31, .06);
}

/* A hint of the signature sweep rather than a full saturated block — the same
   restraint the app's redesigned match hero settled on. */
.hero-rail[b-aqm8ksijch] {
    display: block;
    height: 5px;
    background-image: var(--raqt-gradient-brand);
}

.hero-inner[b-aqm8ksijch] { padding: 1.5rem; }

.hero-top[b-aqm8ksijch] { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }

.hero-context[b-aqm8ksijch] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--brand-700);
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.versus[b-aqm8ksijch] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: start;
    gap: .5rem;
    margin-top: 1.5rem;
}

.player[b-aqm8ksijch] { display: flex; flex-direction: column; align-items: center; gap: .4rem; min-width: 0; }

.player-link[b-aqm8ksijch] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    text-decoration: none;
    color: inherit;
    max-width: 100%;
}

.player-link:hover .player-name[b-aqm8ksijch] { color: var(--brand-700); }

.player-name[b-aqm8ksijch] {
    font-size: .98rem;
    font-weight: 900;
    letter-spacing: -.01em;
    color: var(--ink-900);
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.player-rating[b-aqm8ksijch] {
    font-size: .78rem;
    font-weight: 800;
    color: var(--brand-700);
    background: var(--brand-50);
    border-radius: 999px;
    padding: .12rem .55rem;
}

.player-won[b-aqm8ksijch] {
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-900);
    background: var(--sun-300);
    border-radius: 999px;
    padding: .1rem .5rem;
}

.versus-mid[b-aqm8ksijch] { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding-top: .75rem; }

.vs[b-aqm8ksijch] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--brand-50);
    border: 1px solid var(--brand-200);
    font-size: .78rem;
    font-weight: 900;
    color: var(--brand-700);
}

.tally[b-aqm8ksijch] { font-size: 1.5rem; font-weight: 900; letter-spacing: -.03em; color: var(--ink-900); }

.projection[b-aqm8ksijch] { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--ink-100); }

.projection-label[b-aqm8ksijch] {
    margin: 0 0 .5rem;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-400);
    text-align: center;
}

.projection-pills[b-aqm8ksijch] { display: flex; gap: .5rem; justify-content: center; flex-wrap: wrap; }

.proj[b-aqm8ksijch] { border-radius: 999px; padding: .3rem .75rem; font-size: .76rem; font-weight: 800; }
.proj.is-up[b-aqm8ksijch] { background: var(--brand-50); color: var(--brand-800); }
.proj.is-down[b-aqm8ksijch] { background: #f7e4dd; color: var(--clay-600); }

.hero-meta[b-aqm8ksijch] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: .75rem 1.25rem;
    margin: 1.25rem 0 0;
    padding-top: 1rem;
    border-top: 1px solid var(--ink-100);
}

.hero-meta dt[b-aqm8ksijch] {
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.hero-meta dd[b-aqm8ksijch] { margin: .2rem 0 0; font-size: .84rem; font-weight: 700; color: var(--ink-700); }
.hero-meta dd.is-alert[b-aqm8ksijch] { color: var(--clay-600); }

.hero-reactions[b-aqm8ksijch] { margin-top: 1.25rem; justify-content: center; }

/* ================================================================= panels = */

.panel[b-aqm8ksijch] {
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.panel-title[b-aqm8ksijch] { margin: 0; font-size: .95rem; font-weight: 900; letter-spacing: -.01em; color: var(--ink-900); }
.panel-subtitle[b-aqm8ksijch] { margin: .5rem 0 0; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-500); }
.muted[b-aqm8ksijch] { margin: 0; font-size: .82rem; font-weight: 600; color: var(--ink-500); }

.notice[b-aqm8ksijch] {
    background: var(--ink-50);
    border-radius: var(--radius-2xl);
    padding: .9rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.notice strong[b-aqm8ksijch] { font-size: .85rem; font-weight: 900; color: var(--ink-900); }
.notice span[b-aqm8ksijch] { font-size: .78rem; font-weight: 600; color: var(--ink-600); }
.notice.is-alert[b-aqm8ksijch] { background: #f7e4dd; }
.notice.is-alert strong[b-aqm8ksijch] { color: var(--clay-600); }

.tease-block[b-aqm8ksijch] { height: 220px; background: linear-gradient(180deg, var(--ink-100), #fff); border-radius: var(--radius-2xl); }

/* =============================================================== timeline = */

.timeline[b-aqm8ksijch] { list-style: none; margin: 0; padding: 0; }

.step[b-aqm8ksijch] { position: relative; display: flex; gap: .85rem; padding: 0 0 1.1rem 0; }
.step:last-child[b-aqm8ksijch] { padding-bottom: 0; }

/* The connector line, drawn from each dot down to the next. */
.step:not(:last-child)[b-aqm8ksijch]::before {
    content: "";
    position: absolute;
    left: .3rem;
    top: 1rem;
    bottom: -.1rem;
    width: 2px;
    background: var(--ink-100);
}

.step.is-done:not(:last-child)[b-aqm8ksijch]::before { background: var(--brand-300); }

.dot[b-aqm8ksijch] {
    position: relative;
    z-index: 1;
    flex: none;
    width: .7rem;
    height: .7rem;
    margin-top: .3rem;
    border-radius: 50%;
    background: var(--ink-200);
}

.step.is-done .dot[b-aqm8ksijch] { background-image: var(--raqt-gradient-brand); }
.step.is-current .dot[b-aqm8ksijch] { background: var(--sun-400); box-shadow: 0 0 0 4px var(--sun-100); }

.step-body[b-aqm8ksijch] { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.step-title[b-aqm8ksijch] { font-size: .85rem; font-weight: 800; color: var(--ink-900); }
.step.is-todo .step-title[b-aqm8ksijch] { color: var(--ink-400); }
.step-detail[b-aqm8ksijch] { font-size: .76rem; font-weight: 600; color: var(--ink-500); }

/* ================================================================== score = */

.score[b-aqm8ksijch] { width: 100%; border-collapse: collapse; }

.score th[b-aqm8ksijch], .score td[b-aqm8ksijch] {
    padding: .55rem .4rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.score thead th[b-aqm8ksijch] {
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
    border-bottom: 1px solid var(--ink-100);
}

.score thead th:first-child[b-aqm8ksijch], .score tbody th[b-aqm8ksijch] { text-align: left; }

.score tbody th[b-aqm8ksijch] {
    font-size: .88rem;
    font-weight: 700;
    color: var(--ink-600);
    width: 100%;
}

.score tbody th a[b-aqm8ksijch] { color: inherit; text-decoration: none; }
.score tbody th a:hover[b-aqm8ksijch] { color: var(--brand-700); text-decoration: underline; }

.score tbody tr.is-winner th[b-aqm8ksijch] { font-weight: 900; color: var(--ink-900); }

.score tbody td[b-aqm8ksijch] {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--ink-600);
    min-width: 2.4rem;
}

.score tbody tr.is-winner td[b-aqm8ksijch] { color: var(--brand-800); background: var(--brand-50); border-radius: var(--radius-xl); }

/* ================================================================= deltas = */

.deltas[b-aqm8ksijch] { display: flex; flex-direction: column; gap: .5rem; }

.delta[b-aqm8ksijch] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .5rem .75rem;
    background: var(--ink-50);
    border-radius: var(--radius-xl);
}

.delta-name[b-aqm8ksijch] { flex: 1; font-size: .85rem; font-weight: 700; color: var(--ink-800); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.delta-value[b-aqm8ksijch] { font-size: .95rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.delta-value.is-up[b-aqm8ksijch] { color: var(--brand-700); }
.delta-value.is-down[b-aqm8ksijch] { color: var(--clay-600); }
.delta-value.is-none[b-aqm8ksijch] { color: var(--ink-300); }

/* ================================================================= photos = */

.photos[b-aqm8ksijch] { display: flex; gap: .75rem; flex-wrap: wrap; }

.photo[b-aqm8ksijch] {
    position: relative;
    margin: 0;
    width: 150px;
}

.photo img[b-aqm8ksijch] {
    width: 100%;
    height: 110px;
    object-fit: cover;
    border-radius: var(--radius-2xl);
    display: block;
}

.photo figcaption[b-aqm8ksijch] {
    margin-top: .3rem;
    font-size: .7rem;
    font-weight: 700;
    color: var(--ink-500);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.photo-remove[b-aqm8ksijch] {
    position: absolute;
    top: .4rem;
    right: .4rem;
    width: 1.5rem;
    height: 1.5rem;
    border: 0;
    border-radius: 50%;
    background: rgba(15, 22, 31, .6);
    color: #fff;
    font-size: .72rem;
    cursor: pointer;
}

.photo-add[b-aqm8ksijch] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    align-self: flex-start;
    padding: .6rem 1rem;
    border: 2px dashed var(--brand-300);
    border-radius: var(--radius-2xl);
    background: var(--sun-50);
    font-size: .82rem;
    font-weight: 800;
    color: var(--brand-700);
    cursor: pointer;
}

.photo-add input[b-aqm8ksijch] { display: none; }

/* ==================================================================== h2h = */

.h2h[b-aqm8ksijch] { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .75rem; }
.h2h-side[b-aqm8ksijch] { display: flex; flex-direction: column; align-items: center; gap: .35rem; min-width: 0; }
.h2h-name[b-aqm8ksijch] { font-size: .76rem; font-weight: 800; color: var(--ink-600); text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.h2h-score[b-aqm8ksijch] { display: flex; align-items: baseline; gap: .5rem; font-size: 1.75rem; font-weight: 900; color: var(--ink-900); }
.h2h-score strong.leads[b-aqm8ksijch] { color: var(--brand-700); }
.h2h-score span[b-aqm8ksijch] { font-size: 1rem; color: var(--ink-300); }

.see-all[b-aqm8ksijch] { align-self: flex-start; font-size: .82rem; font-weight: 800; color: var(--brand-700); text-decoration: none; }
.see-all:hover[b-aqm8ksijch] { text-decoration: underline; }

/* ================================================================ controls = */

.ghost[b-aqm8ksijch] {
    width: 100%;
    padding: .8rem 1rem;
    border: 2px solid var(--ink-200);
    border-radius: 999px;
    background: #fff;
    font-family: inherit;
    font-size: .86rem;
    font-weight: 800;
    color: var(--ink-700);
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease;
}

.ghost:hover:not(:disabled)[b-aqm8ksijch] { background: var(--ink-50); }
.ghost:disabled[b-aqm8ksijch] { opacity: .5; cursor: default; }
.ghost.is-danger[b-aqm8ksijch] { border-color: #e6bfae; color: var(--clay-600); }
.ghost.is-danger:hover:not(:disabled)[b-aqm8ksijch] { background: #f7e4dd; }

.full[b-aqm8ksijch] { width: 100%; }

.form[b-aqm8ksijch] { display: flex; flex-direction: column; gap: .75rem; }

.form-field[b-aqm8ksijch] { display: flex; flex-direction: column; gap: .3rem; }

.form-field > span[b-aqm8ksijch] {
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.form-field input[b-aqm8ksijch],
.form-field select[b-aqm8ksijch],
.form-field textarea[b-aqm8ksijch] {
    font-family: inherit;
    font-size: .9rem;
    font-weight: 600;
    color: var(--ink-900);
    background: #fff;
    border: 1px solid var(--ink-200);
    border-radius: var(--radius-xl);
    padding: .6rem .75rem;
    width: 100%;
}

.form-field input:focus[b-aqm8ksijch],
.form-field select:focus[b-aqm8ksijch],
.form-field textarea:focus[b-aqm8ksijch] {
    outline: none;
    border-color: var(--brand-500);
    box-shadow: var(--glow-brand-sm);
}

/* ============================================================ responsive == */

@media (max-width: 1079px) {
    .grid[b-aqm8ksijch] { grid-template-columns: minmax(0, 1fr); }
    .rail[b-aqm8ksijch] { position: static; }
}

@media (max-width: 599px) {
    .hero-inner[b-aqm8ksijch] { padding: 1.1rem; }
    .versus[b-aqm8ksijch] { gap: .25rem; }
    .panel[b-aqm8ksijch] { padding: 1rem; }
}

/* Photos open in the full-screen viewer, so the thumbnail is a real button. */
.photo-open[b-aqm8ksijch] {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: zoom-in;
    line-height: 0;
    border-radius: inherit;
}

.photo-open img[b-aqm8ksijch] { transition: transform .25s ease; }
.photo-open:hover img[b-aqm8ksijch] { transform: scale(1.04); }
.photo-open:focus-visible[b-aqm8ksijch] { outline: 3px solid var(--brand-500); outline-offset: 2px; }
/* /Components/Pages/MatchesRecent.razor.rz.scp.css */
.summary[b-3svky94fhj] {
    margin: 0 0 1rem;
    font-size: .8rem;
    font-weight: 700;
    color: var(--ink-500);
}

.list[b-3svky94fhj] { display: flex; flex-direction: column; }

.more[b-3svky94fhj] { display: flex; justify-content: center; margin-top: 1.5rem; }

/* Cross-link to the sibling list. The left rail has no entry for either page,
   so each one carries the other. */
.switch[b-3svky94fhj] {
    display: inline-flex;
    align-items: center;
    padding: .55rem 1rem;
    border: 2px solid var(--ink-200);
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-700);
    text-decoration: none;
}

.switch:hover[b-3svky94fhj] { background: var(--ink-50); border-color: var(--brand-300); color: var(--brand-700); }
/* /Components/Pages/MatchesUpcoming.razor.rz.scp.css */
.group[b-ehfctjq3m2] { margin-bottom: 2rem; }

.group-title[b-ehfctjq3m2] {
    margin: 0 0 .25rem;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.group-title.is-urgent[b-ehfctjq3m2] { color: var(--clay-600); }

.group-note[b-ehfctjq3m2] {
    margin: 0 0 .85rem;
    font-size: .8rem;
    font-weight: 600;
    color: var(--ink-500);
}

/* Cross-link to the sibling list. The left rail has no entry for either page,
   so each one carries the other. */
.switch[b-ehfctjq3m2] {
    display: inline-flex;
    align-items: center;
    padding: .55rem 1rem;
    border: 2px solid var(--ink-200);
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-700);
    text-decoration: none;
}

.switch:hover[b-ehfctjq3m2] { background: var(--ink-50); border-color: var(--brand-300); color: var(--brand-700); }
/* /Components/Pages/Membership.razor.rz.scp.css */
/* /perfil/assinatura — plan management. Status reads at a glance from the hero
   gradient (brand = ativa, sun = pausada/teste, ink = cancelada/vencida). */

.page[b-6skbkcx8oq] { display: flex; flex-direction: column; gap: 1.25rem; max-width: 820px; }

.back[b-6skbkcx8oq] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .55rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--ink-200);
    background: #fff;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-700);
    text-decoration: none;
}

.back:hover[b-6skbkcx8oq] { border-color: var(--brand-300); color: var(--brand-700); }

/* ==========================================================================
   Status hero
   ========================================================================== */

.hero-wrap[b-6skbkcx8oq] { margin: 0; }

.hero[b-6skbkcx8oq] {
    position: relative;
    z-index: 1;
    padding: 1.75rem 2rem;
    color: #fff;
}

.hero.is-dark-text[b-6skbkcx8oq] { color: var(--ink-900); }

.hero-top[b-6skbkcx8oq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.hero-kicker[b-6skbkcx8oq] {
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    opacity: .85;
}

.hero-chip[b-6skbkcx8oq] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .3rem .8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .25);
    font-size: .78rem;
    font-weight: 900;
}

.hero.is-dark-text .hero-chip[b-6skbkcx8oq] { background: rgba(255, 255, 255, .55); }

.hero-price[b-6skbkcx8oq] {
    margin: 1.1rem 0 0;
    font-size: 2.75rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1;
}

.hero-per[b-6skbkcx8oq] { font-size: .95rem; font-weight: 700; opacity: .85; margin-left: .3rem; }

.hero-line[b-6skbkcx8oq] { margin: .6rem 0 0; font-size: .88rem; font-weight: 600; opacity: .92; }

/* ==========================================================================
   Cards
   ========================================================================== */

.card[b-6skbkcx8oq] {
    padding: 1.1rem 1.35rem 1.35rem;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--ink-100);
    background: #fff;
    box-shadow: var(--glow-brand-sm);
}

.card-label[b-6skbkcx8oq] {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin: 0 0 1rem;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--sun-700);
}

.muted[b-6skbkcx8oq] { margin: 0; font-size: .88rem; font-weight: 600; color: var(--ink-400); }

.fineprint[b-6skbkcx8oq] {
    margin: .75rem 0 0;
    text-align: center;
    font-size: .74rem;
    font-weight: 600;
    color: var(--ink-400);
}

/* --- plan facts --------------------------------------------------------- */

.facts[b-6skbkcx8oq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: .85rem 1.5rem;
    margin: 0;
}

.fact[b-6skbkcx8oq] { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.fact.is-wide[b-6skbkcx8oq] { grid-column: 1 / -1; }

.fact dt[b-6skbkcx8oq] {
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.fact dd[b-6skbkcx8oq] {
    margin: 0;
    font-size: .95rem;
    font-weight: 800;
    color: var(--ink-900);
    overflow-wrap: anywhere;
}

/* --- charge history ----------------------------------------------------- */

.table-scroll[b-6skbkcx8oq] { overflow-x: auto; }

.charges[b-6skbkcx8oq] {
    width: 100%;
    border-collapse: collapse;
    font-size: .88rem;
    white-space: nowrap;
}

.charges th[b-6skbkcx8oq] {
    text-align: left;
    padding: 0 1rem .6rem 0;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
    border-bottom: 1px solid var(--ink-100);
}

.charges td[b-6skbkcx8oq] {
    padding: .7rem 1rem .7rem 0;
    border-bottom: 1px solid var(--ink-100);
    font-weight: 600;
    color: var(--ink-700);
}

.charges tr:last-child td[b-6skbkcx8oq] { border-bottom: 0; }
.charges td.is-amount[b-6skbkcx8oq] { font-weight: 900; color: var(--ink-900); }

.tag[b-6skbkcx8oq] {
    display: inline-flex;
    align-items: center;
    padding: .18rem .6rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.tag.is-ok[b-6skbkcx8oq]   { background: var(--brand-100); color: var(--brand-800); }
.tag.is-wait[b-6skbkcx8oq] { background: var(--sun-100);   color: var(--sun-700); }
.tag.is-bad[b-6skbkcx8oq]  { background: #fbe6dd;          color: var(--clay-600); }

/* ==========================================================================
   Actions
   ========================================================================== */

.actions[b-6skbkcx8oq] { display: flex; flex-direction: column; align-items: flex-start; gap: .9rem; }

.notice[b-6skbkcx8oq] {
    margin: 0;
    padding: .85rem 1rem;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
    border: 1px solid var(--brand-100);
    font-size: .86rem;
    line-height: 1.45;
    font-weight: 600;
    color: var(--ink-700);
}

.notice.is-warn[b-6skbkcx8oq] { background: #fdf1eb; border-color: #f5d9cb; }

.help[b-6skbkcx8oq] { margin: 0; font-size: .76rem; font-weight: 600; color: var(--ink-400); max-width: 60ch; }

.pause[b-6skbkcx8oq] { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }

.pause-label[b-6skbkcx8oq] {
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.pause-date[b-6skbkcx8oq],
.reason[b-6skbkcx8oq] {
    box-sizing: border-box;
    padding: .6rem .85rem;
    border-radius: var(--radius-xl);
    border: 1px solid var(--ink-100);
    background: var(--ink-50);
    font-family: inherit;
    font-size: .88rem;
    font-weight: 700;
    color: var(--ink-900);
}

.reason[b-6skbkcx8oq] { width: 100%; max-width: 460px; font-weight: 500; }

.pause-date:focus[b-6skbkcx8oq],
.reason:focus[b-6skbkcx8oq] { outline: none; border-color: var(--brand-400); box-shadow: var(--glow-brand-sm); }

.ghost[b-6skbkcx8oq] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .6rem 1.1rem;
    border-radius: 999px;
    border: 2px solid var(--ink-200);
    background: none;
    font-family: inherit;
    font-size: .84rem;
    font-weight: 800;
    color: var(--ink-700);
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease;
}

.ghost:hover:not(:disabled)[b-6skbkcx8oq] { border-color: var(--brand-400); color: var(--brand-700); }
.ghost:disabled[b-6skbkcx8oq] { opacity: .5; cursor: default; }

.danger-link[b-6skbkcx8oq] {
    border: 0;
    background: none;
    padding: .3rem 0;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    color: var(--clay-600);
    text-decoration: underline;
    cursor: pointer;
}

.danger-link:disabled[b-6skbkcx8oq] { opacity: .5; cursor: default; }

.cancel-panel[b-6skbkcx8oq] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    width: 100%;
    padding: 1rem;
    border-radius: var(--radius-2xl);
    border: 1px dashed var(--clay-400);
}

.cancel-actions[b-6skbkcx8oq] { display: flex; flex-wrap: wrap; gap: .6rem; }

.danger-btn[b-6skbkcx8oq] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .6rem 1.1rem;
    border-radius: 999px;
    border: 2px solid var(--clay-500);
    background: none;
    font-family: inherit;
    font-size: .84rem;
    font-weight: 800;
    color: var(--clay-600);
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease;
}

.danger-btn:hover:not(:disabled)[b-6skbkcx8oq] { background: var(--clay-500); color: #fff; }
.danger-btn:disabled[b-6skbkcx8oq] { opacity: .5; cursor: default; }

.reconcile[b-6skbkcx8oq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
    width: 100%;
    margin-top: .5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--ink-100);
}

.ghost:focus-visible[b-6skbkcx8oq],
.danger-btn:focus-visible[b-6skbkcx8oq],
.danger-link:focus-visible[b-6skbkcx8oq] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

@media (max-width: 767px) {
    .hero[b-6skbkcx8oq] { padding: 1.35rem 1.25rem; }
    .hero-price[b-6skbkcx8oq] { font-size: 2.25rem; }
    .card[b-6skbkcx8oq] { padding: 1rem 1.1rem 1.2rem; }
}
/* /Components/Pages/NotificationPreferences.razor.rz.scp.css */
/* /perfil/notificacoes — per-category push toggles. */

.prefs[b-zlecxwfzmj] { max-width: 720px; }

.back[b-zlecxwfzmj] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .55rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--ink-200);
    background: #fff;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-700);
    text-decoration: none;
}

.back:hover[b-zlecxwfzmj] { border-color: var(--brand-300); color: var(--brand-700); }

.list[b-zlecxwfzmj] {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--ink-100);
    background: #fff;
    box-shadow: var(--glow-brand-sm);
    overflow: hidden;
}

.pref[b-zlecxwfzmj] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--ink-100);
}

.pref:last-child[b-zlecxwfzmj] { border-bottom: 0; }

.pref-icon[b-zlecxwfzmj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: none;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
    color: var(--brand-600);
}

.pref-text[b-zlecxwfzmj] { display: flex; flex-direction: column; gap: .2rem; flex: 1; min-width: 0; }
.pref-title[b-zlecxwfzmj] { font-size: .98rem; font-weight: 900; letter-spacing: -.01em; color: var(--ink-900); }
.pref-body[b-zlecxwfzmj] { font-size: .8rem; font-weight: 500; line-height: 1.45; color: var(--ink-500); }

/* --- switch ------------------------------------------------------------- */

.switch[b-zlecxwfzmj] { position: relative; display: inline-flex; align-items: center; flex: none; cursor: pointer; }

.switch input[b-zlecxwfzmj] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.switch input:disabled[b-zlecxwfzmj] { cursor: default; }

.track[b-zlecxwfzmj] {
    display: inline-flex;
    align-items: center;
    width: 52px;
    height: 30px;
    padding: 3px;
    border-radius: 999px;
    background: var(--ink-200);
    transition: background-color .2s ease, box-shadow .2s ease;
}

.knob[b-zlecxwfzmj] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 5px rgba(15, 22, 31, .22);
    transition: transform .2s cubic-bezier(.42, 0, .58, 1);
}

.switch input:checked + .track[b-zlecxwfzmj] {
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand-sm);
}

.switch input:checked + .track .knob[b-zlecxwfzmj] { transform: translateX(22px); }
.switch input:disabled + .track[b-zlecxwfzmj] { opacity: .55; }
.switch input:focus-visible + .track[b-zlecxwfzmj] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

/* --- footnote ----------------------------------------------------------- */

.note[b-zlecxwfzmj] {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    margin: 1.25rem 0 0;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.5;
    color: var(--ink-500);
}

.note a[b-zlecxwfzmj] { color: var(--brand-600); font-weight: 800; }

@media (prefers-reduced-motion: reduce) {
    .track[b-zlecxwfzmj], .knob[b-zlecxwfzmj] { transition: none; }
}

@media (max-width: 767px) {
    .pref[b-zlecxwfzmj] { padding: .95rem 1rem; gap: .75rem; }
    .pref-icon[b-zlecxwfzmj] { width: 38px; height: 38px; }
}
/* /Components/Pages/PaymentComplete.razor.rz.scp.css */
/* /pagamento-concluido — the Asaas return landing. Celebratory, but only once
   the reconcile has actually confirmed the plan. */

.landing[b-uw4pgytqoi] {
    display: flex;
    justify-content: center;
    padding: 1.5rem 0 3rem;
}

.landing[b-uw4pgytqoi]  .raqt-gradient-card {
    width: min(760px, 100%);
}

.inner[b-uw4pgytqoi] {
    position: relative;
    z-index: 2;
    padding: 3.5rem 3rem;
    text-align: center;
    color: #fff;
}

.inner.is-bright[b-uw4pgytqoi] { color: var(--ink-900); }

.kicker[b-uw4pgytqoi] {
    margin: 0 0 .6rem;
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
    opacity: .75;
}

.title[b-uw4pgytqoi] {
    margin: 0;
    font-size: clamp(2rem, 5vw, 2.9rem);
    font-weight: 900;
    letter-spacing: -.035em;
    line-height: 1.05;
}

.body[b-uw4pgytqoi] {
    margin: 1rem auto 0;
    max-width: 46ch;
    font-size: .98rem;
    font-weight: 600;
    line-height: 1.6;
    opacity: .92;
}

.loader[b-uw4pgytqoi] { display: flex; justify-content: center; margin-top: 2rem; }

.actions[b-uw4pgytqoi] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    margin-top: 2rem;
}

.secondary[b-uw4pgytqoi] {
    font-size: .88rem;
    font-weight: 800;
    color: var(--ink-800);
    text-decoration: underline;
}

.secondary.is-light[b-uw4pgytqoi] { color: rgba(255, 255, 255, .9); }
.secondary:hover[b-uw4pgytqoi] { opacity: .75; }

.countdown[b-uw4pgytqoi] {
    margin: 1.5rem 0 0;
    font-size: .78rem;
    font-weight: 700;
    opacity: .65;
}

/* ==========================================================================
   Confetti — pure CSS, GPU transforms only, mirroring the aura's approach.
   No library, no canvas: 18 spans on staggered falls.
   ========================================================================== */

.confetti[b-uw4pgytqoi] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 1;
}

.bit[b-uw4pgytqoi] {
    position: absolute;
    top: -14px;
    width: 9px;
    height: 14px;
    border-radius: 2px;
    opacity: .9;
    will-change: transform;
    animation: raqt-fall-b-uw4pgytqoi linear infinite;
}

/* Spread across the width, vary colour, size, speed and delay so it never
   reads as a repeating pattern. */
.bit:nth-child(6n + 1)[b-uw4pgytqoi] { background: #fff; }
.bit:nth-child(6n + 2)[b-uw4pgytqoi] { background: var(--brand-600); }
.bit:nth-child(6n + 3)[b-uw4pgytqoi] { background: var(--ink-900); }
.bit:nth-child(6n + 4)[b-uw4pgytqoi] { background: var(--sun-300); border-radius: 50%; width: 10px; height: 10px; }
.bit:nth-child(6n + 5)[b-uw4pgytqoi] { background: var(--brand-400); }
.bit:nth-child(6n)[b-uw4pgytqoi]     { background: var(--clay-400); border-radius: 50%; width: 8px; height: 8px; }

.bit:nth-child(1)[b-uw4pgytqoi]  { left:  3%; animation-duration: 4.1s; animation-delay: .0s; }
.bit:nth-child(2)[b-uw4pgytqoi]  { left:  9%; animation-duration: 5.3s; animation-delay: .7s; }
.bit:nth-child(3)[b-uw4pgytqoi]  { left: 15%; animation-duration: 3.8s; animation-delay: 1.4s; }
.bit:nth-child(4)[b-uw4pgytqoi]  { left: 21%; animation-duration: 4.9s; animation-delay: .3s; }
.bit:nth-child(5)[b-uw4pgytqoi]  { left: 27%; animation-duration: 5.7s; animation-delay: 1.1s; }
.bit:nth-child(6)[b-uw4pgytqoi]  { left: 33%; animation-duration: 4.3s; animation-delay: 1.9s; }
.bit:nth-child(7)[b-uw4pgytqoi]  { left: 39%; animation-duration: 5.1s; animation-delay: .5s; }
.bit:nth-child(8)[b-uw4pgytqoi]  { left: 45%; animation-duration: 3.9s; animation-delay: 1.6s; }
.bit:nth-child(9)[b-uw4pgytqoi]  { left: 51%; animation-duration: 5.5s; animation-delay: .2s; }
.bit:nth-child(10)[b-uw4pgytqoi] { left: 57%; animation-duration: 4.6s; animation-delay: 1.3s; }
.bit:nth-child(11)[b-uw4pgytqoi] { left: 63%; animation-duration: 5.9s; animation-delay: .9s; }
.bit:nth-child(12)[b-uw4pgytqoi] { left: 69%; animation-duration: 4.0s; animation-delay: 2.1s; }
.bit:nth-child(13)[b-uw4pgytqoi] { left: 75%; animation-duration: 5.2s; animation-delay: .4s; }
.bit:nth-child(14)[b-uw4pgytqoi] { left: 81%; animation-duration: 4.4s; animation-delay: 1.8s; }
.bit:nth-child(15)[b-uw4pgytqoi] { left: 87%; animation-duration: 5.6s; animation-delay: .8s; }
.bit:nth-child(16)[b-uw4pgytqoi] { left: 93%; animation-duration: 4.2s; animation-delay: 1.5s; }
.bit:nth-child(17)[b-uw4pgytqoi] { left: 97%; animation-duration: 5.0s; animation-delay: 2.3s; }
.bit:nth-child(18)[b-uw4pgytqoi] { left: 12%; animation-duration: 6.1s; animation-delay: 2.6s; }

@keyframes raqt-fall-b-uw4pgytqoi {
    0%   { transform: translate3d(0, 0, 0) rotate(0deg); opacity: 0; }
    8%   { opacity: .95; }
    100% { transform: translate3d(14px, 480px, 0) rotate(540deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .confetti[b-uw4pgytqoi] { display: none; }
}

@media (max-width: 767px) {
    .inner[b-uw4pgytqoi] { padding: 2.5rem 1.5rem; }
    .actions[b-uw4pgytqoi] { flex-direction: column; gap: 1rem; }
}
/* /Components/Pages/Player.razor.rz.scp.css */
/* ==========================================================================
   /jogadores/{id} — the showcase
   ========================================================================== */

/* --- hero --- */

.hero-inner[b-vj5377x80w] {
    position: relative;
    z-index: 1;
    padding: 2rem 2.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
}

.hero-id[b-vj5377x80w] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.hero-text[b-vj5377x80w] { min-width: 0; flex: 1; }

.hero-name[b-vj5377x80w] {
    font-size: 2.4rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.05;
    margin: 0;
    color: #fff;
}

.hero-chips[b-vj5377x80w] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .6rem;
}

.hero-city[b-vj5377x80w] {
    font-size: .78rem;
    font-weight: 800;
    color: rgba(255, 255, 255, .9);
    background: rgba(255, 255, 255, .18);
    padding: .22rem .6rem;
    border-radius: 999px;
}

.hero-calibrating[b-vj5377x80w] {
    margin: .6rem 0 0;
    font-size: .85rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .92);
}

.hero-gap[b-vj5377x80w] { margin-top: .6rem; }

.hero-rating[b-vj5377x80w] { text-align: right; flex: none; }

.hero-rating-v[b-vj5377x80w] {
    font-size: 3.25rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1;
    margin: 0;
    color: #fff;
}

.hero-rating-l[b-vj5377x80w] {
    font-size: .75rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .85);
    margin: .35rem 0 0;
}

.hero-ranks[b-vj5377x80w] {
    display: flex;
    align-items: flex-end;
    gap: 2.5rem;
    flex-wrap: wrap;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, .22);
}

.rank-l[b-vj5377x80w] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .8);
    margin: 0;
}

.rank-v[b-vj5377x80w] {
    font-size: 1.7rem;
    font-weight: 900;
    letter-spacing: -.02em;
    line-height: 1.1;
    color: #fff;
    margin: .15rem 0 0;
}

.rank-s[b-vj5377x80w] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    font-size: .76rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .8);
    margin: .3rem 0 0;
}

.move[b-vj5377x80w] {
    padding: .12rem .45rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 800;
    background: rgba(255, 255, 255, .2);
    color: #fff;
    white-space: nowrap;
}

.move.is-up[b-vj5377x80w]   { background: var(--brand-100); color: var(--brand-800); }
.move.is-down[b-vj5377x80w] { background: #fdeee7; color: var(--clay-600); }

.hero-actions[b-vj5377x80w] {
    display: flex;
    gap: .75rem;
    flex-wrap: wrap;
    margin-left: auto;
}

.hero-actions a[b-vj5377x80w] { text-decoration: none; }

.ghost-btn[b-vj5377x80w] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    border: 0;
    border-radius: 999px;
    padding: 1rem 1.5rem;
    font-family: inherit;
    font-weight: 700;
    font-size: .95rem;
    color: var(--ink-900);
    background: rgba(255, 255, 255, .92);
    cursor: pointer;
    transition: transform .12s ease, background-color .18s ease;
}

.ghost-btn:hover:not(:disabled)[b-vj5377x80w] { background: #fff; }
.ghost-btn:active:not(:disabled)[b-vj5377x80w] { transform: scale(.98); }
.ghost-btn:disabled[b-vj5377x80w] { opacity: .5; cursor: default; }
.ghost-btn:focus-visible[b-vj5377x80w] { outline: 3px solid #fff; outline-offset: 2px; }

/* --- generic section chrome --- */
.section-h[b-vj5377x80w] {
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
    margin: 2.25rem 0 .9rem;
}

.section-head[b-vj5377x80w] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

.more[b-vj5377x80w] {
    font-size: .82rem;
    font-weight: 800;
    color: var(--brand-700);
    text-decoration: none;
    white-space: nowrap;
}

.more:hover[b-vj5377x80w] { text-decoration: underline; }

.card[b-vj5377x80w] {
    background: #fff;
    border-radius: var(--radius-2xl);
    padding: 1.25rem 1.4rem;
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
}

.form-card[b-vj5377x80w] { margin-top: 1rem; }

/* --- stat grid --- */
.stats[b-vj5377x80w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: .9rem;
}

/* --- charts, side by side (the phone toggles; the browser shows both) --- */
.charts[b-vj5377x80w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: .9rem;
}

/* --- sobre --- */
.about[b-vj5377x80w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: .9rem;
    align-items: start;
}

.bio[b-vj5377x80w] { grid-column: 1 / -1; }

.about-h[b-vj5377x80w] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
    margin: 0 0 .75rem;
}

.bio-text[b-vj5377x80w] {
    margin: 0;
    color: var(--ink-800);
    line-height: 1.6;
    max-width: 70ch;
}

.chips[b-vj5377x80w] { display: flex; flex-wrap: wrap; gap: .45rem; }

.chip[b-vj5377x80w] {
    padding: .35rem .75rem;
    border-radius: 999px;
    background: var(--brand-50);
    color: var(--brand-800);
    font-size: .82rem;
    font-weight: 700;
}

.highlights[b-vj5377x80w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
    gap: .9rem;
}

.hl[b-vj5377x80w] { display: flex; flex-direction: column; gap: .1rem; }

.hl-l[b-vj5377x80w] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.hl-v[b-vj5377x80w] {
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
}

/* --- trophy case --- */
.trophies[b-vj5377x80w] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: .9rem;
}

.trophy[b-vj5377x80w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    text-align: center;
    padding: 1.25rem 1rem;
    border: 0;
    border-radius: var(--radius-2xl);
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
    font-family: inherit;
    cursor: pointer;
    transition: transform .14s ease, box-shadow .18s ease;
}

.trophy:hover[b-vj5377x80w] { transform: translateY(-2px); box-shadow: var(--glow-brand-sm); }
.trophy:focus-visible[b-vj5377x80w] { outline: 3px solid var(--brand-600); outline-offset: 2px; }

.medal[b-vj5377x80w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    margin-bottom: .3rem;
}

.medal.is-lg[b-vj5377x80w] { width: 76px; height: 76px; }

/* Placement tints: gold / silver / bronze, then a neutral for the rest. */
.medal.is-gold[b-vj5377x80w]    { background: #fef3c7; color: #b45309; }
.medal.is-silver[b-vj5377x80w]  { background: var(--ink-100); color: var(--ink-600); }
.medal.is-bronze[b-vj5377x80w]  { background: #fae5d8; color: var(--clay-600); }
.medal.is-neutral[b-vj5377x80w] { background: var(--ink-100); color: var(--ink-500); }

.trophy-t[b-vj5377x80w] {
    font-size: .92rem;
    font-weight: 900;
    color: var(--ink-900);
    line-height: 1.2;
}

.trophy-s[b-vj5377x80w] {
    font-size: .74rem;
    font-weight: 600;
    color: var(--ink-500);
    line-height: 1.3;
}

/* --- head to head --- */
/* Card width is set via GradientCard's Style passthrough — see Player.razor. */

.h2h-inner[b-vj5377x80w] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
    padding: 1.75rem 1.5rem 1.25rem;
    text-decoration: none;
}

.h2h-side[b-vj5377x80w] { display: flex; flex-direction: column; align-items: center; gap: .2rem; min-width: 0; }

.h2h-n[b-vj5377x80w] {
    font-size: 2.5rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1;
    color: #fff;
}

.h2h-l[b-vj5377x80w] {
    font-size: .8rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .8);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.h2h-x[b-vj5377x80w] {
    font-size: 1.5rem;
    font-weight: 900;
    color: rgba(255, 255, 255, .45);
}

.h2h-foot[b-vj5377x80w] {
    grid-column: 1 / -1;
    text-align: center;
    font-size: .76rem;
    font-weight: 800;
    color: var(--brand-300);
    margin-top: .5rem;
}

.h2h-inner:hover .h2h-foot[b-vj5377x80w] { text-decoration: underline; }

/* --- match list --- */
.list[b-vj5377x80w] { padding: .4rem; display: flex; flex-direction: column; gap: .1rem; }

/* --- context rail --- */
.ctx-h[b-vj5377x80w] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--brand-600);
    margin: 0 0 .9rem;
}

.ctx-list[b-vj5377x80w] { margin: 0; display: flex; flex-direction: column; gap: .6rem; }

.ctx-list > div[b-vj5377x80w] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
}

.ctx-list dt[b-vj5377x80w] { font-size: .8rem; font-weight: 600; color: var(--ink-500); margin: 0; }
.ctx-list dd[b-vj5377x80w] { font-size: .9rem; font-weight: 800; color: var(--ink-900); margin: 0; text-align: right; }

.ctx-nudge[b-vj5377x80w] {
    margin-top: 1.25rem;
    padding: .9rem 1rem;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
}

.ctx-cta[b-vj5377x80w] { margin-top: 1.25rem; width: 100%; text-decoration: none; }

/* --- badge dialog --- */
.dlg-title[b-vj5377x80w] { font-weight: 900; letter-spacing: -.01em; }

.dlg[b-vj5377x80w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .3rem;
    padding: .5rem 0 1rem;
}

.dlg-event[b-vj5377x80w] { font-size: 1.1rem; font-weight: 900; color: var(--ink-900); margin: .5rem 0 0; }
.dlg-sub[b-vj5377x80w] { font-size: .86rem; font-weight: 600; color: var(--ink-600); margin: 0; }
.dlg-meta[b-vj5377x80w] { font-size: .78rem; font-weight: 600; color: var(--ink-400); margin: .35rem 0 0; }

.dlg-link[b-vj5377x80w] {
    margin-top: .9rem;
    font-size: .84rem;
    font-weight: 800;
    color: var(--brand-700);
    text-decoration: none;
}

.dlg-link:hover[b-vj5377x80w] { text-decoration: underline; }

/* --- responsive --- */
@media (max-width: 900px) {
    .hero-inner[b-vj5377x80w] { padding: 1.5rem 1.25rem; }
    .hero-name[b-vj5377x80w] { font-size: 1.9rem; }
    .hero-rating[b-vj5377x80w] { text-align: left; }
    .hero-rating-v[b-vj5377x80w] { font-size: 2.5rem; }
    .hero-ranks[b-vj5377x80w] { gap: 1.5rem; }
    .hero-actions[b-vj5377x80w] { margin-left: 0; width: 100%; }
    .hero-actions > *[b-vj5377x80w] { flex: 1; justify-content: center; }
}
/* /Components/Pages/PlayerMatches.razor.rz.scp.css */
.card[b-8z7d03ezdc] {
    background: #fff;
    border-radius: var(--radius-2xl);
    padding: .4rem;
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
}

.list[b-8z7d03ezdc] { display: flex; flex-direction: column; gap: .1rem; }

.count[b-8z7d03ezdc] {
    font-size: .78rem;
    font-weight: 700;
    color: var(--ink-500);
    margin: 0 0 .6rem;
}

.more-wrap[b-8z7d03ezdc] {
    display: flex;
    justify-content: center;
    margin: 1.75rem 0 0;
}

.end[b-8z7d03ezdc] {
    text-align: center;
    font-size: .8rem;
    font-weight: 600;
    color: var(--ink-400);
    margin: 1.75rem 0 0;
}
/* /Components/Pages/PlayerRatingHistory.razor.rz.scp.css */
.card[b-5un4e8mjq6] {
    background: #fff;
    border-radius: var(--radius-2xl);
    padding: 1.25rem 1.4rem;
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
}

.chart-card[b-5un4e8mjq6] { margin-bottom: 1rem; }

/* A wide table must scroll inside its own card — never the page body. */
.table-card[b-5un4e8mjq6] {
    padding: .5rem;
    overflow-x: auto;
}

.ledger[b-5un4e8mjq6] {
    width: 100%;
    border-collapse: collapse;
    min-width: 560px;
}

.ledger th[b-5un4e8mjq6] {
    text-align: left;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
    padding: .7rem .85rem;
    border-bottom: 1px solid var(--ink-100);
    white-space: nowrap;
}

.ledger td[b-5un4e8mjq6] {
    padding: .75rem .85rem;
    border-bottom: 1px solid var(--ink-50);
    font-size: .88rem;
    color: var(--ink-800);
    vertical-align: middle;
}

.ledger tbody tr:last-child td[b-5un4e8mjq6] { border-bottom: 0; }
.ledger tbody tr:hover td[b-5un4e8mjq6] { background: var(--brand-50); }

/* Columns of numbers align, so tabular figures earn their place here. */
.num[b-5un4e8mjq6] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.date[b-5un4e8mjq6] {
    color: var(--ink-500);
    font-weight: 600;
    white-space: nowrap;
}

.who[b-5un4e8mjq6] { display: inline-flex; align-items: center; gap: .5rem; }

.res[b-5un4e8mjq6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: .66rem;
    font-weight: 900;
    color: #fff;
    flex: none;
}

.res.is-win[b-5un4e8mjq6]  { background: var(--brand-800); }
.res.is-loss[b-5un4e8mjq6] { background: var(--clay-600); }

.who-t[b-5un4e8mjq6] { font-weight: 700; }

.score[b-5un4e8mjq6] { color: var(--ink-600); font-weight: 700; }

.delta[b-5un4e8mjq6] { font-weight: 900; }

/* brand-800 / clay-600 both clear 4.5:1 on white as TEXT colours. */
.delta.is-up[b-5un4e8mjq6]   { color: var(--brand-800); }
.delta.is-down[b-5un4e8mjq6] { color: var(--clay-600); }
.delta.is-flat[b-5un4e8mjq6] { color: var(--ink-400); }

.after[b-5un4e8mjq6] { font-weight: 800; color: var(--ink-900); }
/* /Components/Pages/PlayerStats.razor.rz.scp.css */
/* One filter row above everything it scopes — never a control per tile. */
.periods[b-dd85m2uwgd] {
    display: inline-flex;
    gap: .3rem;
    padding: .3rem;
    background: #fff;
    border-radius: 999px;
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
    margin-bottom: 1.25rem;
}

.period[b-dd85m2uwgd] {
    border: 0;
    background: none;
    font-family: inherit;
    font-size: .84rem;
    font-weight: 800;
    color: var(--ink-500);
    padding: .5rem 1rem;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    transition: color .18s ease, background-color .18s ease;
}

.period:hover[b-dd85m2uwgd] { color: var(--ink-800); background: var(--ink-50); }

.period.is-active[b-dd85m2uwgd] {
    color: #fff;
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand-sm);
}

.period:focus-visible[b-dd85m2uwgd] { outline: 3px solid var(--brand-700); outline-offset: 2px; }

.tiles[b-dd85m2uwgd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: .9rem;
    transition: opacity .18s ease;
}

/* Refetch holds the previous render at reduced opacity — no skeleton flash. */
.tiles[aria-busy="true"][b-dd85m2uwgd] { opacity: .55; }

.card[b-dd85m2uwgd] {
    background: #fff;
    border-radius: var(--radius-2xl);
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
}

.table-card[b-dd85m2uwgd] {
    margin-top: 1rem;
    padding: .5rem;
    overflow-x: auto;
}

.detail[b-dd85m2uwgd] {
    width: 100%;
    border-collapse: collapse;
    min-width: 420px;
}

.detail th[scope="col"][b-dd85m2uwgd] {
    text-align: right;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
    padding: .7rem .85rem;
    border-bottom: 1px solid var(--ink-100);
    white-space: nowrap;
}

.detail th[scope="row"][b-dd85m2uwgd] {
    text-align: left;
    font-size: .88rem;
    font-weight: 800;
    color: var(--ink-800);
    padding: .8rem .85rem;
    border-bottom: 1px solid var(--ink-50);
}

.detail td[b-dd85m2uwgd] {
    padding: .8rem .85rem;
    border-bottom: 1px solid var(--ink-50);
    font-size: .88rem;
    color: var(--ink-700);
}

.detail tbody tr:last-child th[b-dd85m2uwgd],
.detail tbody tr:last-child td[b-dd85m2uwgd] { border-bottom: 0; }

.num[b-dd85m2uwgd] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.total[b-dd85m2uwgd] { font-weight: 900; color: var(--ink-900); }
/* /Components/Pages/Profile.razor.rz.scp.css */
/* /perfil — the account hub. One gradient hero, one membership card, a menu of
   plain rows, and a clearly-quarantined destructive action at the bottom. */

/* ==========================================================================
   Hero
   ========================================================================== */

.hero-wrap[b-aa4nl5hr4e] { margin-bottom: 1.25rem; }

.hero[b-aa4nl5hr4e] {
    position: relative;
    z-index: 1;
    padding: 1.75rem 2rem 2rem;
}

.hero-top[b-aa4nl5hr4e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.badge[b-aa4nl5hr4e] {
    display: inline-flex;
    align-items: center;
    padding: .3rem .75rem;
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.badge.is-member[b-aa4nl5hr4e] { background: #fff; color: var(--brand-700); }
.badge.is-trial[b-aa4nl5hr4e]  { background: var(--sun-300); color: var(--ink-900); }
.badge.is-guest[b-aa4nl5hr4e]  { background: rgba(255, 255, 255, .25); color: #fff; }

.hero-body[b-aa4nl5hr4e] {
    display: flex;
    align-items: flex-start;
    gap: 1.75rem;
}

.hero-id[b-aa4nl5hr4e] { min-width: 0; flex: 1; }

.hero-name[b-aa4nl5hr4e] {
    margin: 0;
    font-size: 2.1rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: #fff;
    overflow-wrap: anywhere;
}

.hero-mail[b-aa4nl5hr4e] {
    margin: .35rem 0 0;
    font-size: .88rem;
    font-weight: 600;
    color: rgba(255, 255, 255, .85);
    overflow-wrap: anywhere;
}

.hero-facts[b-aa4nl5hr4e] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem 1rem;
    margin-top: .75rem;
}

.fact[b-aa4nl5hr4e] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .82rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .9);
}

.hero-tier[b-aa4nl5hr4e] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem .85rem;
    margin-top: 1rem;
}

.calibrating[b-aa4nl5hr4e] {
    display: inline-flex;
    align-items: center;
    padding: .22rem .65rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .25);
    font-size: .74rem;
    font-weight: 800;
    color: #fff;
}

/* ==========================================================================
   Membership card
   ========================================================================== */

.promo[b-aa4nl5hr4e] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-radius: var(--radius-3xl);
    text-decoration: none;
    transition: transform .14s ease, box-shadow .18s ease;
}

.promo.is-prospect[b-aa4nl5hr4e] {
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand);
    color: #fff;
}

.promo.is-member[b-aa4nl5hr4e] {
    background-image: var(--raqt-gradient-sun);
    box-shadow: var(--glow-sun);
    color: var(--ink-900);
}

.promo:hover[b-aa4nl5hr4e] { transform: translateY(-2px); }
.promo:active[b-aa4nl5hr4e] { transform: scale(.995); }
.promo:focus-visible[b-aa4nl5hr4e] { outline: 3px solid var(--brand-700); outline-offset: 3px; }

.promo-icon[b-aa4nl5hr4e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: var(--radius-2xl);
    background: rgba(255, 255, 255, .3);
    flex: none;
}

.promo-text[b-aa4nl5hr4e] { display: flex; flex-direction: column; gap: .15rem; flex: 1; min-width: 0; }
.promo-title[b-aa4nl5hr4e] { font-size: 1rem; font-weight: 900; letter-spacing: -.01em; }
.promo-sub[b-aa4nl5hr4e] { font-size: .8rem; font-weight: 600; opacity: .9; }

.trial-note[b-aa4nl5hr4e] {
    margin: .75rem 0 0;
    font-size: .82rem;
    font-weight: 600;
    color: var(--ink-600);
}

.trial-note a[b-aa4nl5hr4e] { color: var(--brand-600); font-weight: 800; }

/* ==========================================================================
   Menu rows
   ========================================================================== */

.menu[b-aa4nl5hr4e] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
    margin-top: 1.5rem;
}

.row-form[b-aa4nl5hr4e] { margin: 0; }

.row[b-aa4nl5hr4e] {
    display: flex;
    align-items: center;
    gap: .9rem;
    width: 100%;
    padding: .9rem 1.1rem;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--ink-100);
    background: #fff;
    text-align: left;
    text-decoration: none;
    color: inherit;
    transition: border-color .18s ease, box-shadow .18s ease, transform .12s ease;
}

.row.is-button[b-aa4nl5hr4e] { font-family: inherit; cursor: pointer; }

.row:hover[b-aa4nl5hr4e] {
    border-color: var(--brand-200);
    box-shadow: var(--glow-brand-sm);
}

.row:active[b-aa4nl5hr4e] { transform: scale(.995); }
.row:focus-visible[b-aa4nl5hr4e] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

.row-icon[b-aa4nl5hr4e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
    color: var(--brand-600);
    flex: none;
}

.row-text[b-aa4nl5hr4e] { display: flex; flex-direction: column; gap: .1rem; flex: 1; min-width: 0; }
.row-title[b-aa4nl5hr4e] { font-size: .96rem; font-weight: 800; color: var(--ink-900); letter-spacing: -.01em; }
.row-sub[b-aa4nl5hr4e] { font-size: .78rem; font-weight: 600; color: var(--ink-500); }

.row-badge[b-aa4nl5hr4e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 .45rem;
    border-radius: 999px;
    background: var(--clay-500);
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
    flex: none;
}

.row[b-aa4nl5hr4e]  .row-chev { color: var(--ink-300); flex: none; }

/* ==========================================================================
   Legal + danger zone
   ========================================================================== */

.legal[b-aa4nl5hr4e] {
    display: flex;
    justify-content: center;
    gap: .6rem;
    margin: 1.75rem 0 0;
    font-size: .8rem;
    font-weight: 700;
    color: var(--ink-300);
}

.legal a[b-aa4nl5hr4e] { color: var(--ink-500); text-decoration: underline; }
.legal a:hover[b-aa4nl5hr4e] { color: var(--brand-600); }

.danger[b-aa4nl5hr4e] {
    margin-top: 2.5rem;
    padding: 1.25rem 1.5rem;
    border-radius: var(--radius-2xl);
    border: 1px dashed var(--clay-400);
    background: #fff;
}

.danger-title[b-aa4nl5hr4e] {
    margin: 0 0 .4rem;
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--clay-600);
}

.danger-body[b-aa4nl5hr4e] {
    margin: 0 0 1rem;
    font-size: .84rem;
    line-height: 1.45;
    color: var(--ink-600);
    max-width: 62ch;
}

.danger-btn[b-aa4nl5hr4e] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .6rem 1.1rem;
    border-radius: 999px;
    border: 2px solid var(--clay-500);
    background: none;
    font-family: inherit;
    font-size: .84rem;
    font-weight: 800;
    color: var(--clay-600);
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease;
}

.danger-btn:hover:not(:disabled)[b-aa4nl5hr4e] { background: var(--clay-500); color: #fff; }
.danger-btn:disabled[b-aa4nl5hr4e] { opacity: .55; cursor: default; }
.danger-btn:focus-visible[b-aa4nl5hr4e] { outline: 3px solid var(--clay-600); outline-offset: 2px; }

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 767px) {
    .hero[b-aa4nl5hr4e] { padding: 1.25rem 1.25rem 1.5rem; }
    .hero-body[b-aa4nl5hr4e] { flex-direction: column; align-items: center; text-align: center; gap: 1rem; }
    .hero-id[b-aa4nl5hr4e] { width: 100%; }
    .hero-facts[b-aa4nl5hr4e], .hero-tier[b-aa4nl5hr4e] { justify-content: center; }
    .hero-name[b-aa4nl5hr4e] { font-size: 1.7rem; }
    .promo[b-aa4nl5hr4e] { padding: .9rem 1rem; }
}
/* /Components/Pages/ProfileEdit.razor.rz.scp.css */
/* /perfil/editar — the on-court identity form. Native controls styled to the
   app's language rather than MudBlazor defaults, so the page reads as RAQT. */

.back[b-zzqokapagi] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .55rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--ink-200);
    background: #fff;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-700);
    text-decoration: none;
}

.back:hover[b-zzqokapagi] { border-color: var(--brand-300); color: var(--brand-700); }

.form[b-zzqokapagi] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 720px;
}

.card[b-zzqokapagi] {
    padding: 1.1rem 1.25rem 1.25rem;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--ink-100);
    background: #fff;
    box-shadow: var(--glow-brand-sm);
}

.card-label[b-zzqokapagi] {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin: 0 0 .75rem;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--sun-700);
}

/* --- inputs ------------------------------------------------------------- */

.field[b-zzqokapagi] {
    width: 100%;
    box-sizing: border-box;
    padding: .8rem 1rem;
    border-radius: var(--radius-xl);
    border: 1px solid var(--ink-100);
    background: var(--ink-50);
    font-family: inherit;
    font-size: .95rem;
    font-weight: 700;
    color: var(--ink-900);
}

.field[b-zzqokapagi]::placeholder { color: var(--ink-300); font-weight: 600; }
.field:focus[b-zzqokapagi] { outline: none; border-color: var(--brand-400); box-shadow: var(--glow-brand-sm); }

.field.is-center[b-zzqokapagi] { text-align: center; }

.field.is-area[b-zzqokapagi] {
    font-weight: 500;
    line-height: 1.5;
    resize: vertical;
    min-height: 7rem;
}

select.field[b-zzqokapagi] { appearance: none; cursor: pointer; padding-right: 2.25rem;
    background-image: linear-gradient(45deg, transparent 50%, var(--ink-400) 50%),
                      linear-gradient(135deg, var(--ink-400) 50%, transparent 50%);
    background-position: calc(100% - 18px) 55%, calc(100% - 13px) 55%;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
}

.help[b-zzqokapagi] { margin: .5rem 0 0; font-size: .74rem; font-weight: 600; color: var(--ink-400); }

.counter[b-zzqokapagi] {
    margin: .5rem 0 0;
    text-align: right;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .08em;
    color: var(--ink-400);
}

.counter.is-full[b-zzqokapagi] { color: var(--clay-500); }

/* --- pills & chips ------------------------------------------------------ */

.pills[b-zzqokapagi] { display: flex; gap: .6rem; }

.pill[b-zzqokapagi] {
    flex: 1;
    padding: .8rem 1rem;
    border-radius: var(--radius-xl);
    border: 1px solid var(--ink-100);
    background: var(--ink-50);
    font-family: inherit;
    font-size: .9rem;
    font-weight: 800;
    color: var(--ink-600);
    cursor: pointer;
    transition: background-color .16s ease, color .16s ease, border-color .16s ease, transform .12s ease;
}

.pill:hover[b-zzqokapagi] { border-color: var(--brand-300); }
.pill:active[b-zzqokapagi] { transform: scale(.98); }
.pill.is-on[b-zzqokapagi] {
    background-image: var(--raqt-gradient-brand);
    border-color: transparent;
    color: #fff;
    box-shadow: var(--glow-brand-sm);
}

.chips[b-zzqokapagi] { display: flex; flex-wrap: wrap; gap: .55rem; }

.chip[b-zzqokapagi] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .55rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--ink-100);
    background: var(--ink-50);
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-600);
    cursor: pointer;
    transition: background-color .16s ease, color .16s ease, border-color .16s ease, transform .12s ease;
}

.chip:hover[b-zzqokapagi] { border-color: var(--brand-300); }
.chip:active[b-zzqokapagi] { transform: scale(.98); }
.chip.is-on[b-zzqokapagi] {
    background-image: var(--raqt-gradient-brand);
    border-color: transparent;
    color: #fff;
    box-shadow: var(--glow-brand-sm);
}

.pill:focus-visible[b-zzqokapagi],
.chip:focus-visible[b-zzqokapagi],
.step:focus-visible[b-zzqokapagi] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

/* --- year stepper ------------------------------------------------------- */

.year[b-zzqokapagi] { display: flex; align-items: center; gap: .6rem; }

.step[b-zzqokapagi] {
    width: 44px;
    height: 44px;
    flex: none;
    border-radius: var(--radius-xl);
    border: 1px solid var(--ink-100);
    background: var(--ink-50);
    font-family: inherit;
    font-size: 1.25rem;
    font-weight: 900;
    line-height: 1;
    color: var(--ink-700);
    cursor: pointer;
}

.step:hover[b-zzqokapagi] { border-color: var(--brand-300); color: var(--brand-700); }

/* --- save --------------------------------------------------------------- */

.save[b-zzqokapagi] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin-top: .5rem;
}

.cancel[b-zzqokapagi] { font-size: .84rem; font-weight: 800; color: var(--ink-500); text-decoration: underline; }
.cancel:hover[b-zzqokapagi] { color: var(--clay-600); }

@media (max-width: 767px) {
    .pills[b-zzqokapagi] { flex-direction: column; }
    .save[b-zzqokapagi] { flex-direction: column; align-items: stretch; gap: .75rem; }
    .cancel[b-zzqokapagi] { text-align: center; }
}
/* /Components/Pages/Proposals.razor.rz.scp.css */
/* /convites — segmented list plus, on desktop, a counter-proposal column beside it. */

.prop-find[b-y15in39nrm] { text-decoration: none; }

.prop-layout[b-y15in39nrm] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

/* The counter form only claims a column when it is actually open, and only where
   there is room for it; below this it stacks above the list. */
@media (min-width: 1100px) {
    .prop-layout.has-panel[b-y15in39nrm] { grid-template-columns: minmax(0, 1fr) 360px; }
}

.prop-main[b-y15in39nrm] { min-width: 0; }

.prop-panel[b-y15in39nrm] { position: sticky; top: 1.5rem; }

@media (max-width: 1099px) {
    .prop-layout.has-panel[b-y15in39nrm] { display: flex; flex-direction: column-reverse; }
    .prop-panel[b-y15in39nrm] { position: static; }
}

/* ==========================================================================
   Segments
   ========================================================================== */

.prop-tabs[b-y15in39nrm] {
    display: inline-flex;
    gap: .25rem;
    padding: .3rem;
    margin-bottom: 1.25rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    box-shadow: var(--glow-brand-sm);
}

.prop-tab[b-y15in39nrm] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-family: inherit;
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-600);
    background: none;
    border: 0;
    border-radius: var(--radius-xl);
    padding: .5rem 1.1rem;
    cursor: pointer;
    transition: color .16s ease, background-color .16s ease;
}

.prop-tab:hover[b-y15in39nrm] { color: var(--ink-900); background: var(--ink-50); }

.prop-tab.is-on[b-y15in39nrm] {
    color: #fff;
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand-sm);
}

.prop-tab:focus-visible[b-y15in39nrm] { outline: 2px solid var(--brand-600); outline-offset: 2px; }

.prop-tab-badge[b-y15in39nrm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 .35rem;
    border-radius: 999px;
    background: var(--sun-200);
    color: var(--sun-700);
    font-size: .68rem;
    font-weight: 900;
}

.prop-tab.is-on .prop-tab-badge[b-y15in39nrm] { background: rgba(255, 255, 255, .28); color: #fff; }

/* ==========================================================================
   Cards
   ========================================================================== */

.prop-list[b-y15in39nrm] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1rem; }

.prop-card[b-y15in39nrm] {
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    padding: 1.25rem;
}

.prop-card.is-pending[b-y15in39nrm] { border-color: var(--brand-200); box-shadow: var(--glow-brand-sm); }

.prop-card-head[b-y15in39nrm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.prop-who[b-y15in39nrm] { display: flex; align-items: center; gap: .9rem; text-decoration: none; color: inherit; min-width: 0; }
.prop-who-text[b-y15in39nrm] { display: flex; flex-direction: column; min-width: 0; }

.prop-who-name[b-y15in39nrm] {
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prop-who:hover .prop-who-name[b-y15in39nrm] { color: var(--brand-700); }

.prop-who-rating[b-y15in39nrm] { font-size: .8rem; font-weight: 700; color: var(--ink-500); }

.prop-status[b-y15in39nrm] {
    flex: none;
    padding: .25rem .7rem;
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 800;
    white-space: nowrap;
    background: var(--ink-100);
    color: var(--ink-600);
}

.prop-status.is-pending[b-y15in39nrm]   { background: var(--sun-200);   color: var(--sun-700); }
.prop-status.is-accepted[b-y15in39nrm]  { background: var(--brand-100); color: var(--brand-800); }
.prop-status.is-declined[b-y15in39nrm],
.prop-status.is-cancelled[b-y15in39nrm] { background: #fdf5f0;          color: var(--clay-600); }
.prop-status.is-countered[b-y15in39nrm] { background: var(--brand-50);  color: var(--brand-700); }

/* --- facts --- */

.prop-facts[b-y15in39nrm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: .75rem 1.25rem;
    margin: 0 0 1rem;
    padding: .9rem 1rem;
    background: var(--ink-50);
    border-radius: var(--radius-2xl);
}

.prop-facts dt[b-y15in39nrm] {
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--ink-400);
    margin-bottom: .15rem;
}

.prop-facts dd[b-y15in39nrm] { margin: 0; font-size: .88rem; font-weight: 800; color: var(--ink-900); }

.prop-note[b-y15in39nrm] {
    margin: 0 0 1rem;
    padding: .6rem .85rem;
    border-left: 3px solid var(--brand-300);
    background: var(--brand-50);
    border-radius: 0 var(--radius-xl) var(--radius-xl) 0;
    font-size: .85rem;
    font-weight: 600;
    font-style: italic;
    color: var(--ink-700);
}

.prop-note.is-response[b-y15in39nrm] { border-left-color: var(--clay-400); background: #fdf5f0; }

/* --- actions --- */

.prop-actions[b-y15in39nrm] { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }

.prop-waiting[b-y15in39nrm] { flex: 1; font-size: .8rem; font-weight: 600; color: var(--ink-400); }

.prop-btn[b-y15in39nrm] {
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    border-radius: 999px;
    border: 1px solid var(--ink-200);
    background: #fff;
    color: var(--ink-600);
    padding: .55rem 1.25rem;
    cursor: pointer;
    transition: color .16s ease, border-color .16s ease, filter .16s ease;
}

.prop-btn:disabled[b-y15in39nrm] { opacity: .5; cursor: default; }
.prop-btn:focus-visible[b-y15in39nrm] { outline: 2px solid var(--brand-600); outline-offset: 2px; }

.prop-btn.is-primary[b-y15in39nrm] {
    border-color: transparent;
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    box-shadow: var(--glow-brand-sm);
}

.prop-btn.is-primary:hover:not(:disabled)[b-y15in39nrm] { filter: brightness(1.04); }
.prop-btn.is-ghost:hover:not(:disabled)[b-y15in39nrm] { border-color: var(--brand-300); color: var(--brand-700); }

.prop-btn.is-danger[b-y15in39nrm] { border-color: var(--clay-400); color: var(--clay-600); }
.prop-btn.is-danger:hover:not(:disabled)[b-y15in39nrm] { background: #fdf5f0; }

/* --- inline decline-with-recado --- */

.prop-decline[b-y15in39nrm] {
    padding: .9rem 1rem;
    background: var(--ink-50);
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
}

.prop-decline-label[b-y15in39nrm] {
    display: block;
    margin-bottom: .4rem;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.prop-decline-input[b-y15in39nrm] {
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
    font-size: .88rem;
    font-weight: 600;
    color: var(--ink-900);
    background: #fff;
    border: 1px solid var(--ink-200);
    border-radius: var(--radius-xl);
    padding: .55rem .75rem;
    resize: vertical;
}

.prop-decline-input:focus[b-y15in39nrm] {
    outline: none;
    border-color: var(--brand-400);
    box-shadow: var(--glow-brand-sm);
}

.prop-decline-actions[b-y15in39nrm] { display: flex; gap: .5rem; margin-top: .75rem; }

@media (prefers-reduced-motion: reduce) {
    .prop-tab[b-y15in39nrm],
    .prop-btn[b-y15in39nrm] { transition: none; }
}

/* Anchors wearing the pill-CTA class (EmptyState actions, teaser CTAs) must not
   pick up the default link underline. */
a.raqt-gradient-btn[b-y15in39nrm] { text-decoration: none; }
/* /Components/Pages/Ranking.razor.rz.scp.css */
/* ==========================================================================
   /ranking — master–detail leaderboard
   --------------------------------------------------------------------------
   The split is driven by a CONTAINER query, not a viewport media query: the
   shell puts a 248px rail on the left and a 320px context rail on the right at
   desktop widths, so the viewport width says almost nothing about how much room
   this page actually has. `container-type: inline-size` on the page root lets
   the list/preview split react to the space it really gets.
   ========================================================================== */

.rk-page[b-p5h8k4mkw7] {
    container-type: inline-size;
    container-name: rk;
}

.rk-help[b-p5h8k4mkw7] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .6rem 1.1rem;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--ink-200);
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-700);
    text-decoration: none;
    transition: border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.rk-help:hover[b-p5h8k4mkw7] {
    color: var(--brand-700);
    border-color: var(--brand-300);
    box-shadow: var(--glow-brand-sm);
}

/* --------------------------------------------------------------------------
   Upsell — the conversion surface. Ranking is the one free feature, so this is
   the only page a prospect browses at length; it argues, it never blocks.
   -------------------------------------------------------------------------- */

.rk-upsell[b-p5h8k4mkw7] {
    margin-bottom: 1.5rem;
}

.rk-upsell-inner[b-p5h8k4mkw7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    flex-wrap: wrap;
    padding: 1.5rem 1.75rem;
}

.rk-upsell-kicker[b-p5h8k4mkw7] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--sun-300);
    margin: 0 0 .35rem;
}

.rk-upsell-title[b-p5h8k4mkw7] {
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: -.02em;
    margin: 0;
}

.rk-upsell-body[b-p5h8k4mkw7] {
    margin: .5rem 0 0;
    max-width: 52ch;
    font-size: .9rem;
    font-weight: 500;
    color: rgba(255, 255, 255, .82);
}

.rk-upsell-cta[b-p5h8k4mkw7] {
    flex: none;
}

/* --------------------------------------------------------------------------
   Toolbar — scoping + the sticky "Pular para mim"
   -------------------------------------------------------------------------- */

.rk-toolbar[b-p5h8k4mkw7] {
    position: sticky;
    top: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: .85rem 0 1rem;
    margin-bottom: .25rem;
    background: linear-gradient(var(--ink-50) 78%, rgba(248, 249, 250, 0));
}

.rk-filters[b-p5h8k4mkw7] {
    display: flex;
    gap: .75rem;
    flex-wrap: wrap;
    min-width: 0;
}

.rk-seg[b-p5h8k4mkw7] {
    display: inline-flex;
    gap: .2rem;
    padding: .25rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: 999px;
    box-shadow: 0 2px 8px rgba(15, 22, 31, .04);
}

.rk-seg-scroll[b-p5h8k4mkw7] {
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
}

.rk-seg-btn[b-p5h8k4mkw7] {
    border: 0;
    background: none;
    border-radius: 999px;
    padding: .5rem 1rem;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    white-space: nowrap;
    color: var(--ink-400);
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.rk-seg-btn:hover[b-p5h8k4mkw7] { color: var(--ink-800); background: var(--ink-50); }

/* The active segment is the app's focused-tab gradient pill. */
.rk-seg-btn.is-on[b-p5h8k4mkw7] {
    color: #fff;
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand-sm);
}

.rk-seg-btn.is-on:hover[b-p5h8k4mkw7] { color: #fff; }
.rk-seg-btn:focus-visible[b-p5h8k4mkw7] { outline: 3px solid var(--brand-700); outline-offset: 1px; }

.rk-jump[b-p5h8k4mkw7] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    flex: none;
    border: 1px solid var(--brand-300);
    background: var(--brand-50);
    border-radius: 999px;
    padding: .6rem 1.1rem;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    color: var(--brand-800);
    cursor: pointer;
    transition: box-shadow .18s ease, transform .12s ease, background-color .18s ease;
}

.rk-jump:hover:not(:disabled)[b-p5h8k4mkw7] { background: var(--brand-100); box-shadow: var(--glow-brand-sm); }
.rk-jump:active:not(:disabled)[b-p5h8k4mkw7] { transform: scale(.98); }
.rk-jump:disabled[b-p5h8k4mkw7] { opacity: .55; cursor: default; }
.rk-jump:focus-visible[b-p5h8k4mkw7] { outline: 3px solid var(--brand-700); outline-offset: 2px; }

.rk-jump-icon[b-p5h8k4mkw7] { font-size: .95em; line-height: 1; }

.rk-jump-rank[b-p5h8k4mkw7] {
    font-weight: 900;
    color: var(--brand-700);
    padding-left: .35rem;
    border-left: 1px solid var(--brand-200);
}

/* --------------------------------------------------------------------------
   Split
   -------------------------------------------------------------------------- */

.rk-split[b-p5h8k4mkw7] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.rk-preview[b-p5h8k4mkw7] { display: none; }

@container rk (min-width: 860px) {
    .rk-split[b-p5h8k4mkw7] { grid-template-columns: minmax(0, 1fr) 340px; }
    .rk-preview[b-p5h8k4mkw7] { display: block; }
    /* With a preview pane, rows select instead of navigating. */
    .rk-row-link[b-p5h8k4mkw7] { display: none; }
}

/* --------------------------------------------------------------------------
   Rows — cards, not a dense grid. Member-facing, per the design brief.
   -------------------------------------------------------------------------- */

.rk-list[b-p5h8k4mkw7] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    min-width: 0;
}

.rk-row[b-p5h8k4mkw7] {
    position: relative;
    display: grid;
    grid-template-columns: 2.5rem auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .9rem;
    padding: .8rem 1.1rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .12s ease;
}

.rk-row:hover[b-p5h8k4mkw7] { border-color: var(--brand-300); box-shadow: var(--glow-brand-sm); }
.rk-row:active[b-p5h8k4mkw7] { transform: scale(.995); }
.rk-row:focus-visible[b-p5h8k4mkw7] { outline: 3px solid var(--brand-700); outline-offset: 2px; }

.rk-row.is-selected[b-p5h8k4mkw7] {
    border-color: var(--brand-400);
    box-shadow: var(--glow-brand-sm);
}

/* The member's own row is always findable, selected or not. */
.rk-row.is-me[b-p5h8k4mkw7] {
    background: linear-gradient(90deg, var(--brand-50), #fff 55%);
    border-color: var(--brand-300);
}

/* "Pular para mim" flash — one pulse, then it settles into is-me. */
.rk-row.is-flash[b-p5h8k4mkw7] { animation: rk-flash-b-p5h8k4mkw7 1.6s ease-out 1; }

@keyframes rk-flash-b-p5h8k4mkw7 {
    0%   { box-shadow: 0 0 0 0 rgba(146, 208, 80, .55); }
    60%  { box-shadow: 0 0 0 12px rgba(146, 208, 80, 0); }
    100% { box-shadow: var(--glow-brand-sm); }
}

/* Narrow layouts: the row is a link to the profile (no preview pane to fill). */
.rk-row-link[b-p5h8k4mkw7] {
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: var(--radius-2xl);
    text-indent: -9999px;
    overflow: hidden;
}

.rk-rank[b-p5h8k4mkw7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    font-size: .9rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    color: var(--ink-500);
    background: var(--ink-50);
}

/* Podium, in brand terms: sun for the crown, brand for second, clay for third. */
.rk-rank.is-gold[b-p5h8k4mkw7] {
    color: var(--ink-900);
    background-image: var(--raqt-gradient-sun);
    box-shadow: var(--glow-sun-sm);
}

.rk-rank.is-silver[b-p5h8k4mkw7] {
    color: #fff;
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand-sm);
}

.rk-rank.is-bronze[b-p5h8k4mkw7] {
    color: #fff;
    background: var(--clay-400);
    box-shadow: 0 4px 14px rgba(223, 126, 81, .28);
}

.rk-ident[b-p5h8k4mkw7] { min-width: 0; }

.rk-name[b-p5h8k4mkw7] {
    display: flex;
    align-items: baseline;
    gap: .45rem;
    margin: 0;
    font-size: .98rem;
    font-weight: 800;
    color: var(--ink-900);
    letter-spacing: -.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rk-you[b-p5h8k4mkw7] {
    flex: none;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--brand-700);
    background: var(--brand-100);
    border-radius: 999px;
    padding: .1rem .45rem;
}

.rk-meta[b-p5h8k4mkw7] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .3rem;
    min-width: 0;
}

/* The gap line is the north star (TIERS_PLAN.md:155-160) — present on every row,
   quieter than the tier chip so the chip reads first and the gap reads second. */
.rk-gap[b-p5h8k4mkw7] { font-size: .76rem; }

.rk-calibrating[b-p5h8k4mkw7] {
    font-size: .74rem;
    font-weight: 800;
    color: var(--ink-400);
    background: var(--ink-50);
    border-radius: 999px;
    padding: .16rem .5rem;
}

.rk-numbers[b-p5h8k4mkw7] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .1rem;
    flex: none;
}

.rk-rating[b-p5h8k4mkw7] {
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
    color: var(--ink-900);
    line-height: 1.1;
}

.rk-delta[b-p5h8k4mkw7] {
    font-size: .76rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.rk-delta.is-up[b-p5h8k4mkw7]   { color: var(--brand-600); }
.rk-delta.is-down[b-p5h8k4mkw7] { color: var(--clay-500); }
.rk-delta.is-flat[b-p5h8k4mkw7] { color: var(--ink-300); }

/* --------------------------------------------------------------------------
   Paging
   -------------------------------------------------------------------------- */

.rk-more[b-p5h8k4mkw7] { display: flex; justify-content: center; padding: .75rem 0 0; }

.rk-more-btn[b-p5h8k4mkw7] {
    border: 1px dashed var(--ink-200);
    background: #fff;
    border-radius: 999px;
    padding: .7rem 1.5rem;
    font-family: inherit;
    font-size: .84rem;
    font-weight: 800;
    color: var(--ink-600);
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease;
}

.rk-more-btn:hover:not(:disabled)[b-p5h8k4mkw7] { border-color: var(--brand-400); color: var(--brand-700); }
.rk-more-btn:disabled[b-p5h8k4mkw7] { opacity: .6; cursor: default; }

.rk-end[b-p5h8k4mkw7] {
    text-align: center;
    font-size: .78rem;
    font-weight: 700;
    color: var(--ink-400);
    margin: 1rem 0 0;
}

/* --------------------------------------------------------------------------
   Preview pane — the thing the phone cannot do
   -------------------------------------------------------------------------- */

.rk-preview-sticky[b-p5h8k4mkw7] {
    position: sticky;
    top: 5.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.rk-card[b-p5h8k4mkw7] { position: relative; }

.rk-card-inner[b-p5h8k4mkw7] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.75rem 1.5rem 1.5rem;
}

.rk-card-name[b-p5h8k4mkw7] {
    margin: .9rem 0 0;
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: -.02em;
}

.rk-card-rating[b-p5h8k4mkw7] {
    margin: .5rem 0 0;
    font-size: 2.75rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.rk-card-rating-label[b-p5h8k4mkw7] {
    margin: .3rem 0 0;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .85;
}

.rk-card-tier[b-p5h8k4mkw7] { margin-top: .9rem; }
.rk-card-gap[b-p5h8k4mkw7] { margin-top: .55rem; }

.rk-card-calibrating[b-p5h8k4mkw7] {
    margin: .9rem 0 0;
    font-size: .82rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .9);
}

.rk-stats[b-p5h8k4mkw7] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .6rem;
}

.rk-stat[b-p5h8k4mkw7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .15rem;
    padding: .85rem .5rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-xl);
}

.rk-stat-value[b-p5h8k4mkw7] {
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
    color: var(--ink-900);
}

.rk-stat-value.rk-win[b-p5h8k4mkw7]  { color: var(--brand-600); }
.rk-stat-value.rk-loss[b-p5h8k4mkw7] { color: var(--clay-500); }

.rk-stat-label[b-p5h8k4mkw7] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.rk-crown-note[b-p5h8k4mkw7] {
    margin: 0;
    padding: .7rem .9rem;
    border-radius: var(--radius-xl);
    background: var(--sun-50);
    border: 1px solid var(--sun-200);
    font-size: .8rem;
    font-weight: 800;
    color: var(--sun-700);
    text-align: center;
}

.rk-profile-link[b-p5h8k4mkw7] {
    display: block;
    text-align: center;
    padding: .8rem 1rem;
    border-radius: 999px;
    background: var(--ink-50);
    border: 1px solid var(--ink-100);
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-800);
    text-decoration: none;
    transition: background-color .18s ease, color .18s ease;
}

.rk-profile-link:hover[b-p5h8k4mkw7] { background: var(--brand-50); color: var(--brand-800); }

/* --------------------------------------------------------------------------
   Context rail — the bands legend (desktop only; the shell hides the rail)
   -------------------------------------------------------------------------- */

.rk-legend[b-p5h8k4mkw7] { display: flex; flex-direction: column; gap: .5rem; }

.rk-legend-row[b-p5h8k4mkw7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.rk-legend-min[b-p5h8k4mkw7] {
    font-size: .78rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--ink-400);
}

.rk-legend-note[b-p5h8k4mkw7] {
    margin: .75rem 0 0;
    font-size: .76rem;
    line-height: 1.5;
    font-weight: 600;
    color: var(--ink-500);
}

.rk-legend-link[b-p5h8k4mkw7] {
    margin-top: .25rem;
    font-size: .78rem;
    font-weight: 800;
    color: var(--brand-700);
    text-decoration: none;
}

.rk-legend-link:hover[b-p5h8k4mkw7] { text-decoration: underline; }

/* -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .rk-row[b-p5h8k4mkw7],
    .rk-jump[b-p5h8k4mkw7],
    .rk-seg-btn[b-p5h8k4mkw7] { transition: none; }

    .rk-row.is-flash[b-p5h8k4mkw7] { animation: none; box-shadow: var(--glow-brand-sm); }
}

/* Header meta — one compact inline run, not a row of cards. Three boxed KPIs under a
   two-line subtitle pushed the actual ranking below the fold, which is the opposite of
   what a header is for. Dot separators, no chrome. */
.rk-hstat[b-p5h8k4mkw7] {
    display: inline-flex;
    align-items: baseline;
    gap: .3rem;
    font-size: .82rem;
    font-weight: 600;
    color: var(--ink-500);
}

.rk-hstat + .rk-hstat[b-p5h8k4mkw7]::before {
    content: "·";
    margin-right: .3rem;
    color: var(--ink-300);
}

.rk-hstat b[b-p5h8k4mkw7] {
    font-size: 1rem;
    font-weight: 900;
    color: var(--ink-900);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
}

/* Your own position is the one number worth picking out. */
.rk-hstat.is-me b[b-p5h8k4mkw7] { color: var(--brand-700); }

/* Why this board has no crowns. Quiet — informational, not a warning. */
.rk-crownnote[b-p5h8k4mkw7] {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0 0 1rem;
    padding: .6rem .85rem;
    border-radius: var(--radius-xl);
    background: var(--sun-50);
    border: 1px solid var(--sun-200);
    font-size: .8rem;
    font-weight: 600;
    color: var(--ink-600);
}

.rk-crownnote[b-p5h8k4mkw7]  .mud-icon-root {
    font-size: 1rem;
    width: 1rem;
    height: 1rem;
    color: var(--sun-600);
    flex: none;
}

/* --------------------------------------------------------------------------
   Row entrance — line by line, deliberately quieter than the shared
   .raqt-stagger used elsewhere.

   A leaderboard is a ranked list, so the eye already travels top to bottom;
   the animation should follow that read rather than announce itself. Hence a
   4px rise instead of 8, a shorter 260ms, and a tighter 25ms step so more rows
   get their own beat without the last one arriving late. Fades from 0.35
   rather than 0 — rows ghost in instead of blinking on.

   Steps to 16 (a full first screen), then flattens: past that the member is
   scrolling, and a growing delay would look like the list is struggling.
   -------------------------------------------------------------------------- */

@keyframes rk-line-in-b-p5h8k4mkw7 {
    from { opacity: .35; transform: translateY(4px); }
    to   { opacity: 1; transform: none; }
}

.rk-stagger > *[b-p5h8k4mkw7] {
    animation: rk-line-in-b-p5h8k4mkw7 .26s ease-out both;
}

.rk-stagger > *:nth-child(1)[b-p5h8k4mkw7]  { animation-delay: 0s; }
.rk-stagger > *:nth-child(2)[b-p5h8k4mkw7]  { animation-delay: .025s; }
.rk-stagger > *:nth-child(3)[b-p5h8k4mkw7]  { animation-delay: .05s; }
.rk-stagger > *:nth-child(4)[b-p5h8k4mkw7]  { animation-delay: .075s; }
.rk-stagger > *:nth-child(5)[b-p5h8k4mkw7]  { animation-delay: .1s; }
.rk-stagger > *:nth-child(6)[b-p5h8k4mkw7]  { animation-delay: .125s; }
.rk-stagger > *:nth-child(7)[b-p5h8k4mkw7]  { animation-delay: .15s; }
.rk-stagger > *:nth-child(8)[b-p5h8k4mkw7]  { animation-delay: .175s; }
.rk-stagger > *:nth-child(9)[b-p5h8k4mkw7]  { animation-delay: .2s; }
.rk-stagger > *:nth-child(10)[b-p5h8k4mkw7] { animation-delay: .225s; }
.rk-stagger > *:nth-child(11)[b-p5h8k4mkw7] { animation-delay: .25s; }
.rk-stagger > *:nth-child(12)[b-p5h8k4mkw7] { animation-delay: .275s; }
.rk-stagger > *:nth-child(13)[b-p5h8k4mkw7] { animation-delay: .3s; }
.rk-stagger > *:nth-child(14)[b-p5h8k4mkw7] { animation-delay: .325s; }
.rk-stagger > *:nth-child(15)[b-p5h8k4mkw7] { animation-delay: .35s; }
.rk-stagger > *:nth-child(16)[b-p5h8k4mkw7] { animation-delay: .375s; }
.rk-stagger > *:nth-child(n+17)[b-p5h8k4mkw7] { animation-delay: .4s; }

@media (prefers-reduced-motion: reduce) {
    .rk-stagger > *[b-p5h8k4mkw7] { animation: none; }
}
/* /Components/Pages/RankingHowItWorks.razor.rz.scp.css */
/* ==========================================================================
   /ranking/como-funciona — the ELO explainer
   --------------------------------------------------------------------------
   The app has to describe the multipliers and the tier ladder in a paragraph;
   a wide screen can just show them. Gradient section headers + cards, never a
   wall of text.
   ========================================================================== */

.hw-page[b-sn5joprbdz] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    max-width: 1080px;
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.hw-hero[b-sn5joprbdz] { position: relative; }

.hw-hero-inner[b-sn5joprbdz] {
    position: relative;
    z-index: 1;
    padding: 2.5rem 2.5rem 2.25rem;
}

.hw-kicker[b-sn5joprbdz] { color: rgba(255, 255, 255, .85); }

.hw-title[b-sn5joprbdz] {
    font-size: 2.5rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.05;
    margin: 0;
    color: #fff;
}

.hw-sub[b-sn5joprbdz] {
    margin: .85rem 0 0;
    max-width: 58ch;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.55;
    color: rgba(255, 255, 255, .9);
}

.hw-back[b-sn5joprbdz] {
    display: inline-block;
    margin-top: 1.5rem;
    padding: .5rem 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .2);
    font-size: .82rem;
    font-weight: 800;
    color: #fff;
    text-decoration: none;
    transition: background-color .18s ease;
}

.hw-back:hover[b-sn5joprbdz] { background: rgba(255, 255, 255, .34); }

/* --------------------------------------------------------------------------
   Sections — the gradient rule under each heading is the section marker
   -------------------------------------------------------------------------- */

.hw-section[b-sn5joprbdz] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.hw-section-title[b-sn5joprbdz] {
    position: relative;
    margin: 0;
    padding-bottom: .7rem;
    font-size: 1.4rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
}

.hw-section-title[b-sn5joprbdz]::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 72px;
    height: 4px;
    border-radius: 999px;
    background-image: var(--raqt-gradient-brand);
}

.hw-section-sub[b-sn5joprbdz] {
    margin: -.25rem 0 0;
    max-width: 68ch;
    font-size: .92rem;
    line-height: 1.6;
    color: var(--ink-600);
}

.hw-foot[b-sn5joprbdz] {
    margin: 0;
    font-size: .82rem;
    font-weight: 600;
    color: var(--ink-400);
}

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */

.hw-grid[b-sn5joprbdz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
}

.hw-split[b-sn5joprbdz] {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
}

@media (max-width: 900px) {
    .hw-split[b-sn5joprbdz] { grid-template-columns: minmax(0, 1fr); }
}

.hw-card[b-sn5joprbdz] {
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    padding: 1.5rem;
    box-shadow: 0 5px 12px rgba(146, 208, 80, .08);
}

.hw-card-accent[b-sn5joprbdz] {
    border-color: var(--brand-200);
    background: linear-gradient(180deg, var(--brand-50), #fff 60%);
}

.hw-card-head[b-sn5joprbdz] {
    display: flex;
    align-items: center;
    gap: .85rem;
    margin-bottom: .75rem;
}

.hw-icon[b-sn5joprbdz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--radius-2xl);
    background: var(--brand-50);
    color: var(--brand-600);
}

/* ::deep — MudIcon renders the <svg> itself, outside this sheet's isolation scope. */
.hw-icon[b-sn5joprbdz]  .mud-icon-root { font-size: 1.35rem; width: 1.35rem; height: 1.35rem; }

.hw-card-title[b-sn5joprbdz] {
    margin: 0;
    font-size: 1rem;
    font-weight: 900;
    letter-spacing: -.01em;
    color: var(--ink-900);
    line-height: 1.3;
}

.hw-card-body[b-sn5joprbdz] {
    margin: 0;
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.65;
    color: var(--ink-600);
}

.hw-card-body + .hw-card-body[b-sn5joprbdz] { margin-top: .75rem; }
.hw-card-body strong[b-sn5joprbdz] { font-weight: 900; color: var(--ink-800); }

/* --------------------------------------------------------------------------
   K-factor tiles
   -------------------------------------------------------------------------- */

.hw-kcards[b-sn5joprbdz] {
    display: grid;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.hw-k[b-sn5joprbdz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .2rem;
    padding: 1.25rem 1rem;
    border-radius: var(--radius-3xl);
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    box-shadow: var(--glow-brand-sm);
    text-align: center;
}

.hw-k.is-muted[b-sn5joprbdz] {
    background-image: none;
    background: #fff;
    border: 1px solid var(--ink-100);
    color: var(--ink-800);
    box-shadow: none;
}

.hw-k-value[b-sn5joprbdz] {
    font-size: 2.25rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.hw-k-label[b-sn5joprbdz] {
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    margin-top: .35rem;
}

.hw-k-note[b-sn5joprbdz] { font-size: .74rem; font-weight: 600; opacity: .82; }

/* --------------------------------------------------------------------------
   Importance multipliers — shown, not described
   -------------------------------------------------------------------------- */

.hw-mults[b-sn5joprbdz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.hw-mult[b-sn5joprbdz] {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    padding: 1.25rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
}

.hw-mult.is-top[b-sn5joprbdz] {
    border-color: var(--sun-300);
    background: linear-gradient(180deg, var(--sun-50), #fff 65%);
    box-shadow: var(--glow-sun-sm);
}

.hw-mult-icon[b-sn5joprbdz] { display: inline-flex; line-height: 1; color: var(--brand-600); }
.hw-mult-icon[b-sn5joprbdz]  .mud-icon-root { font-size: 1.5rem; width: 1.5rem; height: 1.5rem; }
.hw-mult.is-top .hw-mult-icon[b-sn5joprbdz] { color: var(--sun-600); }

.hw-mult-value[b-sn5joprbdz] {
    margin-top: .4rem;
    font-size: 1.75rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    color: var(--ink-900);
}

.hw-mult-name[b-sn5joprbdz] {
    margin-top: .3rem;
    font-size: .9rem;
    font-weight: 800;
    color: var(--ink-800);
}

.hw-mult-note[b-sn5joprbdz] { font-size: .76rem; font-weight: 700; color: var(--ink-400); }

.hw-mult-bar[b-sn5joprbdz] {
    display: block;
    margin-top: .75rem;
    height: 6px;
    border-radius: 999px;
    background: var(--ink-100);
    overflow: hidden;
}

.hw-mult-fill[b-sn5joprbdz] {
    display: block;
    height: 100%;
    border-radius: 999px;
    background-image: var(--raqt-gradient-brand);
}

/* --------------------------------------------------------------------------
   Tier ladder
   -------------------------------------------------------------------------- */

.hw-ladder[b-sn5joprbdz] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.hw-band[b-sn5joprbdz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: .85rem 1.25rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
}

.hw-band-chip[b-sn5joprbdz] { flex: none; }

.hw-band-range[b-sn5joprbdz] {
    display: flex;
    align-items: baseline;
    gap: .75rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.hw-band-min[b-sn5joprbdz] {
    font-size: .9rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--ink-800);
}

.hw-band-floor[b-sn5joprbdz] {
    font-size: .74rem;
    font-weight: 700;
    color: var(--ink-400);
    background: var(--ink-50);
    border-radius: 999px;
    padding: .15rem .55rem;
}

/* --------------------------------------------------------------------------
   Crown tile
   -------------------------------------------------------------------------- */

.hw-crown[b-sn5joprbdz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    padding: 1.75rem 1.25rem;
    border-radius: var(--radius-3xl);
    background-image: var(--raqt-gradient-sun);
    color: var(--ink-900);
    box-shadow: var(--glow-sun);
    text-align: center;
}

.hw-crown-mark[b-sn5joprbdz] { display: inline-flex; line-height: 1; color: var(--sun-600); }
.hw-crown-mark[b-sn5joprbdz]  .mud-icon-root { font-size: 2.1rem; width: 2.1rem; height: 2.1rem; }

.hw-crown-value[b-sn5joprbdz] {
    font-size: 1.6rem;
    font-weight: 900;
    letter-spacing: -.02em;
}

.hw-crown-label[b-sn5joprbdz] {
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .75;
}

/* --------------------------------------------------------------------------
   Closing
   -------------------------------------------------------------------------- */

.hw-closing[b-sn5joprbdz] {
    margin: 0;
    text-align: center;
    max-width: 56ch;
    margin-inline: auto;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.7;
    color: var(--ink-500);
}

.hw-cta[b-sn5joprbdz] { display: flex; justify-content: center; }
.hw-cta a[b-sn5joprbdz] { text-decoration: none; }

@media (max-width: 640px) {
    .hw-hero-inner[b-sn5joprbdz] { padding: 2rem 1.5rem; }
    .hw-title[b-sn5joprbdz] { font-size: 2rem; }
}
/* /Components/Pages/Subscribe.razor.rz.scp.css */
/* /assinar — the paywall. This page has one job: convert. It leads with the
   signature gradient + aura, states the price plainly, and only then argues. */

.paywall[b-k28egjl73u] { display: flex; flex-direction: column; gap: 2rem; max-width: 1000px; }

.cta-link[b-k28egjl73u] {
    display: inline-flex;
    align-items: center;
    padding: .8rem 1.6rem;
    border-radius: 999px;
    background-image: var(--raqt-gradient-brand);
    box-shadow: 0 8px 18px rgba(146, 208, 80, .45);
    color: #fff;
    font-weight: 800;
    font-size: .9rem;
    text-decoration: none;
}

/* ==========================================================================
   Hero
   ========================================================================== */

.hero-wrap[b-k28egjl73u] { margin: 0; }

.hero[b-k28egjl73u] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
    gap: 2.5rem;
    align-items: center;
    padding: 3rem 3rem 3.25rem;
    color: #fff;
}

.hero-copy[b-k28egjl73u] { min-width: 0; }

.hero-mark[b-k28egjl73u] { font-size: 1.15rem; margin-bottom: 1.25rem; }

.hero-kicker[b-k28egjl73u] {
    margin: 0 0 .6rem;
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--sun-300);
}

.hero-title[b-k28egjl73u] {
    margin: 0;
    font-size: clamp(2.1rem, 4.2vw, 3.1rem);
    font-weight: 900;
    letter-spacing: -.035em;
    line-height: 1.05;
    text-wrap: balance;
}

.hero-blurb[b-k28egjl73u] {
    margin: 1.1rem 0 0;
    max-width: 46ch;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.6;
    color: rgba(255, 255, 255, .92);
}

.hero-trial[b-k28egjl73u] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    margin: 1.35rem 0 0;
    padding: .55rem 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .22);
    font-size: .84rem;
    font-weight: 800;
}

/* --- the price panel ---------------------------------------------------- */

.offer[b-k28egjl73u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    padding: 2rem 1.75rem;
    border-radius: var(--radius-3xl);
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .35);
    box-shadow: 0 20px 50px rgba(15, 22, 31, .22);
    text-align: center;
}

.offer-label[b-k28egjl73u] {
    margin: 0;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .8);
}

.offer-price[b-k28egjl73u] {
    margin: .35rem 0 0;
    font-size: 3.1rem;
    font-weight: 900;
    letter-spacing: -.04em;
    line-height: 1;
}

.offer-per[b-k28egjl73u] { font-size: 1rem; font-weight: 700; letter-spacing: 0; opacity: .85; margin-left: .25rem; }

.offer-note[b-k28egjl73u] { margin: .6rem 0 1.25rem; font-size: .8rem; font-weight: 700; color: rgba(255, 255, 255, .85); }

.offer[b-k28egjl73u]  .offer-cta { width: 100%; padding-block: 1.05rem; font-size: 1rem; }

.offer-trust[b-k28egjl73u] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    margin: .9rem 0 0;
    font-size: .74rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .8);
}

/* ==========================================================================
   Benefits
   ========================================================================== */

.section-title[b-k28egjl73u] {
    margin: 0 0 1.25rem;
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: -.025em;
    color: var(--ink-900);
}

.benefit-grid[b-k28egjl73u] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: .85rem;
}

.benefit[b-k28egjl73u] {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
    padding: 1.1rem 1.2rem;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--ink-100);
    background: #fff;
    transition: transform .16s ease, box-shadow .2s ease, border-color .2s ease;
}

.benefit:hover[b-k28egjl73u] {
    transform: translateY(-3px);
    border-color: var(--brand-200);
    box-shadow: var(--glow-brand);
}

.benefit-icon[b-k28egjl73u] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex: none;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
    color: var(--brand-600);
}

.benefit-text[b-k28egjl73u] { min-width: 0; }
.benefit-title[b-k28egjl73u] { margin: 0; font-size: .98rem; font-weight: 900; letter-spacing: -.01em; color: var(--ink-900); }
.benefit-body[b-k28egjl73u] { margin: .3rem 0 0; font-size: .84rem; font-weight: 500; line-height: 1.5; color: var(--ink-600); }

/* ==========================================================================
   Exclusions — stated plainly, because trust converts
   ========================================================================== */

.excluded[b-k28egjl73u] {
    padding: 1.25rem 1.5rem;
    border-radius: var(--radius-2xl);
    border: 1px dashed var(--ink-200);
    background: var(--ink-50);
}

.excluded-title[b-k28egjl73u] {
    margin: 0 0 .6rem;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.excluded-list[b-k28egjl73u] {
    margin: 0;
    padding-left: 1.15rem;
    display: flex;
    flex-direction: column;
    gap: .3rem;
    font-size: .85rem;
    font-weight: 600;
    color: var(--ink-600);
}

/* ==========================================================================
   Closing CTA + promo code
   ========================================================================== */

.close[b-k28egjl73u] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
    gap: 2rem;
    align-items: center;
    padding: 2rem 2.25rem;
    border-radius: var(--radius-3xl);
    background-image: var(--raqt-gradient-ink);
    box-shadow: var(--glow-ink);
    color: #fff;
}

.close-main[b-k28egjl73u] { min-width: 0; }

.close-title[b-k28egjl73u] {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.15;
}

.close-body[b-k28egjl73u] {
    margin: .6rem 0 1.35rem;
    max-width: 46ch;
    font-size: .92rem;
    font-weight: 500;
    line-height: 1.55;
    color: rgba(255, 255, 255, .85);
}

.promo[b-k28egjl73u] { display: flex; flex-direction: column; gap: .6rem; }

.promo-toggle[b-k28egjl73u] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    align-self: flex-start;
    padding: .6rem 1.1rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .4);
    background: none;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    color: #fff;
    cursor: pointer;
    transition: background-color .18s ease;
}

.promo-toggle:hover[b-k28egjl73u] { background: rgba(255, 255, 255, .14); }

.promo-label[b-k28egjl73u] {
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .75);
}

.promo-input[b-k28egjl73u] {
    box-sizing: border-box;
    width: 100%;
    padding: .85rem 1rem;
    border-radius: var(--radius-xl);
    border: 1px solid rgba(255, 255, 255, .3);
    background: rgba(255, 255, 255, .12);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #fff;
}

.promo-input[b-k28egjl73u]::placeholder { color: rgba(255, 255, 255, .45); letter-spacing: .08em; }
.promo-input:focus[b-k28egjl73u] { outline: none; border-color: var(--sun-300); box-shadow: var(--glow-sun-sm); }

.promo-help[b-k28egjl73u] { margin: 0; font-size: .74rem; font-weight: 600; color: rgba(255, 255, 255, .7); }

.promo-toggle:focus-visible[b-k28egjl73u],
.promo-input:focus-visible[b-k28egjl73u] { outline: 3px solid var(--sun-300); outline-offset: 2px; }

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1023px) {
    .hero[b-k28egjl73u] { grid-template-columns: minmax(0, 1fr); gap: 2rem; padding: 2.25rem 1.75rem 2.5rem; }
    .close[b-k28egjl73u] { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding: 1.75rem 1.5rem; }
}

@media (max-width: 767px) {
    .paywall[b-k28egjl73u] { gap: 1.5rem; }
    .hero[b-k28egjl73u] { padding: 1.75rem 1.25rem 2rem; }
    .offer[b-k28egjl73u] { padding: 1.5rem 1.25rem; }
    .offer-price[b-k28egjl73u] { font-size: 2.6rem; }
    .section-title[b-k28egjl73u] { font-size: 1.3rem; }
}
/* /Components/Shared/BracketBoard.razor.rz.scp.css */
/* ==========================================================================
   BracketBoard — a real single-elimination tree, theme-token driven.

   The whole geometry hangs off two custom properties: --bb-col (column width)
   and --bb-gap (the gutter the connectors are drawn in). Change those two and
   the board rescales; nothing is hard-coded in px anywhere else.
   ========================================================================== */

.bb[b-9jc5s9ucsg] {
    --bb-col: 246px;
    --bb-gap: 56px;
    --bb-half: calc(var(--bb-gap) / 2);
    --bb-wire: var(--ink-200);
    --bb-wire-live: var(--brand-300);
}

/* --- champion banner ---------------------------------------------------- */

/* GradientCard renders its own root, so reach it with ::deep. */
.bb[b-9jc5s9ucsg]  .bb-champ {
    margin-bottom: 1.25rem;
}

.bb-champ-inner[b-9jc5s9ucsg] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 1.35rem;
}

.bb-champ-kicker[b-9jc5s9ucsg] {
    margin: 0;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(29, 39, 53, .7);
}

.bb-champ-name[b-9jc5s9ucsg] {
    margin: .15rem 0 0;
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
    line-height: 1.1;
}

/* --- the scroller: sideways movement is trapped in here ----------------- */

.bb-hint[b-9jc5s9ucsg] {
    display: none;
    margin: 0 0 .5rem;
    font-size: .75rem;
    font-weight: 700;
    color: var(--ink-400);
}

.bb-scroll[b-9jc5s9ucsg] {
    overflow-x: auto;
    overflow-y: hidden;
    max-width: 100%;
    padding: .25rem .25rem 1rem;
    scrollbar-width: thin;
    scrollbar-color: var(--ink-200) transparent;
}

.bb-scroll:focus-visible[b-9jc5s9ucsg] {
    outline: 3px solid var(--brand-400);
    outline-offset: 4px;
    border-radius: var(--radius-2xl);
}

.bb-scroll[b-9jc5s9ucsg]::-webkit-scrollbar { height: 10px; }
.bb-scroll[b-9jc5s9ucsg]::-webkit-scrollbar-track { background: transparent; }
.bb-scroll[b-9jc5s9ucsg]::-webkit-scrollbar-thumb { background: var(--ink-200); border-radius: 999px; }
.bb-scroll[b-9jc5s9ucsg]::-webkit-scrollbar-thumb:hover { background: var(--ink-300); }

.bb-tree[b-9jc5s9ucsg] {
    display: flex;
    align-items: stretch;   /* every column the same height — the geometry depends on it */
    gap: var(--bb-gap);
    width: max-content;
    min-width: 100%;
}

/* --- one column per round ---------------------------------------------- */

.bb-round[b-9jc5s9ucsg] {
    display: flex;
    flex-direction: column;
    width: var(--bb-col);
    flex: none;
}

.bb-round-head[b-9jc5s9ucsg] {
    display: flex;
    align-items: baseline;
    gap: .45rem;
    padding: 0 .25rem .6rem;
    position: sticky;
    top: 0;
}

.bb-round-tag[b-9jc5s9ucsg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    padding: .12rem .4rem;
    border-radius: 999px;
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .04em;
    box-shadow: var(--glow-brand-sm);
}

.bb-round-name[b-9jc5s9ucsg] {
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.bb-cells[b-9jc5s9ucsg] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Equal flex share is what centres a slot between its two feeders: half the
   cells means double the height, so the midpoints line up on their own. */
.bb-cell[b-9jc5s9ucsg] {
    flex: 1 1 0;
    min-height: 104px;
    display: flex;
    align-items: center;
    position: relative;
}

/* --- connectors: out-stub, vertical bridge, in-stub --------------------- */

/* Out-stub: from the slot's right edge into the gutter. */
.bb-cell:not(.is-final)[b-9jc5s9ucsg]::after {
    content: "";
    position: absolute;
    left: 100%;
    top: 50%;
    width: var(--bb-half);
    height: 2px;
    background: var(--bb-wire);
}

/* Vertical bridge on the lower cell of each pair: rises from this cell's centre
   to the previous cell's centre. Adjacent equal-height cells sit exactly one
   cell-height apart, so -50% → +50% is precisely right. */
.bb-cell.is-lower:not(.is-final)[b-9jc5s9ucsg]::before {
    content: "";
    position: absolute;
    left: calc(100% + var(--bb-half) - 1px);
    top: -50%;
    height: 100%;
    width: 2px;
    background: var(--bb-wire);
}

/* In-stub: from the gutter's midline into the next round's slot. */
.bb-round:not(:first-child) .bb-slot[b-9jc5s9ucsg]::before {
    content: "";
    position: absolute;
    right: 100%;
    top: 50%;
    width: var(--bb-half);
    height: 2px;
    background: var(--bb-wire);
}

/* A live matchup lights its own wires. */
.bb-cell:has(.bb-slot.is-live)[b-9jc5s9ucsg]::after,
.bb-cell.is-lower:has(.bb-slot.is-live)[b-9jc5s9ucsg]::before,
.bb-round:not(:first-child) .bb-slot.is-live[b-9jc5s9ucsg]::before {
    background: var(--bb-wire-live);
}

/* --- the slot card ------------------------------------------------------ */

.bb-slot[b-9jc5s9ucsg] {
    position: relative;
    display: block;
    width: 100%;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    text-decoration: none;
    color: inherit;
    box-shadow: 0 3px 8px rgba(146, 208, 80, .06);
    transition: transform .16s ease, box-shadow .18s ease, border-color .18s ease;
}

.bb-slot.is-live[b-9jc5s9ucsg] { border-color: var(--brand-200); }

.bb-slot.is-mine[b-9jc5s9ucsg] {
    border-color: var(--brand-400);
    box-shadow: var(--glow-brand-sm);
}

.bb-slot.is-linkable:hover[b-9jc5s9ucsg] {
    transform: translateY(-2px);
    box-shadow: var(--glow-brand);
    border-color: var(--brand-300);
}

.bb-slot.is-linkable:focus-visible[b-9jc5s9ucsg] {
    outline: 3px solid var(--brand-500);
    outline-offset: 2px;
}

.bb-slot:not(.is-linkable)[b-9jc5s9ucsg] { cursor: default; opacity: .82; }

.bb-slot-head[b-9jc5s9ucsg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem .75rem .3rem;
}

.bb-slot-num[b-9jc5s9ucsg] {
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.bb-slot-score[b-9jc5s9ucsg] {
    font-size: .72rem;
    font-weight: 800;
    color: var(--ink-600);
    font-variant-numeric: tabular-nums;
}

.bb-slot-state[b-9jc5s9ucsg] {
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-300);
}

.bb-slot-state.is-live[b-9jc5s9ucsg] {
    padding: .1rem .45rem;
    border-radius: 999px;
    background: var(--brand-100);
    color: var(--brand-700);
}

.bb-slot-state.is-bye[b-9jc5s9ucsg] {
    padding: .1rem .45rem;
    border-radius: 999px;
    background: var(--ink-50);
    color: var(--ink-400);
}

/* --- player lines ------------------------------------------------------- */

.bb-line[b-9jc5s9ucsg] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .45rem .75rem;
    min-width: 0;
}

.bb-slot-rule[b-9jc5s9ucsg] {
    display: block;
    height: 1px;
    margin: 0 .75rem;
    background: var(--ink-100);
}

.bb-line-name[b-9jc5s9ucsg] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .85rem;
    font-weight: 700;
    color: var(--ink-700);
}

.bb-line.is-winner .bb-line-name[b-9jc5s9ucsg] { font-weight: 900; color: var(--ink-900); }
.bb-line.is-loser .bb-line-name[b-9jc5s9ucsg] { font-weight: 600; color: var(--ink-400); }
.bb-line-name.is-empty[b-9jc5s9ucsg] { font-weight: 600; color: var(--ink-300); font-style: italic; }

.bb-line.is-me .bb-line-name[b-9jc5s9ucsg] { color: var(--brand-700); }

.bb-line-trophy[b-9jc5s9ucsg] { font-size: .8rem; line-height: 1; }

.bb-line-ghost[b-9jc5s9ucsg] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--ink-100);
    flex: none;
}

.bb-seed[b-9jc5s9ucsg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 .2rem;
    border-radius: .35rem;
    background: var(--ink-50);
    border: 1px solid var(--ink-100);
    font-size: .6rem;
    font-weight: 900;
    color: var(--ink-500);
    flex: none;
    font-variant-numeric: tabular-nums;
}

.bb-line.is-winner .bb-seed[b-9jc5s9ucsg] { background: var(--brand-50); border-color: var(--brand-200); color: var(--brand-800); }

/* --- narrow viewports: the tree survives, it just scrolls --------------- */

@media (max-width: 1023px) {
    .bb[b-9jc5s9ucsg] { --bb-col: 208px; --bb-gap: 40px; }
    .bb-hint[b-9jc5s9ucsg] { display: block; }
}

@media (max-width: 599px) {
    .bb[b-9jc5s9ucsg] { --bb-col: 186px; --bb-gap: 30px; }
    .bb-cell[b-9jc5s9ucsg] { min-height: 96px; }
}

@media (prefers-reduced-motion: reduce) {
    .bb-slot[b-9jc5s9ucsg] { transition: none; }
    .bb-slot.is-linkable:hover[b-9jc5s9ucsg] { transform: none; }
}
/* /Components/Shared/ContextPanel.razor.rz.scp.css */
/* Desktop context-rail payload. Narrow column (320px minus padding), so everything
   here is single-column, dense, and scannable at a glance. */

.ctx-gap-wrap[b-ai6k6dpgf4] { margin-bottom: 1.75rem; }

.ctx-gap-kicker[b-ai6k6dpgf4] {
    margin: 0 0 .5rem;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--sun-700);
}

/* ::deep — TierGapLine renders its own span, outside this component's scope. */
.ctx-gap-wrap[b-ai6k6dpgf4]  .ctx-gap-line {
    display: block;
    font-size: 1rem;
    line-height: 1.35;
    color: var(--ink-900);
}

.ctx-gap-wrap[b-ai6k6dpgf4]  .ctx-gap-line .raqt-gap-tier { display: block; font-size: 1.15rem; }
.ctx-gap-wrap[b-ai6k6dpgf4]  .ctx-gap-line .raqt-gap-sep { display: none; }

.ctx-gap-body[b-ai6k6dpgf4] {
    margin: .6rem 0 .9rem;
    font-size: .78rem;
    font-weight: 600;
    color: rgba(29, 39, 53, .78);
}

.ctx-gap-cta[b-ai6k6dpgf4] {
    font-size: .8rem;
    font-weight: 900;
    color: var(--ink-900);
    text-decoration: none;
    border-bottom: 2px solid rgba(29, 39, 53, .3);
    padding-bottom: 1px;
}

.ctx-gap-cta:hover[b-ai6k6dpgf4] { border-bottom-color: var(--ink-900); }

/* Fallback quick action when there is no gap to show (provisional or Legendary). */
.ctx-quick[b-ai6k6dpgf4] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: 1.75rem;
    padding: .8rem 1rem;
    border-radius: var(--radius-2xl);
    background: #fff;
    border: 1px solid var(--ink-100);
    font-size: .875rem;
    font-weight: 800;
    color: var(--ink-800);
    text-decoration: none;
    box-shadow: var(--glow-brand-sm);
}

.ctx-quick:hover[b-ai6k6dpgf4] { border-color: var(--brand-300); color: var(--brand-700); }

.ctx-quick-icon[b-ai6k6dpgf4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--brand-50);
    color: var(--brand-700);
}

/* --- blocks --- */

.ctx-block[b-ai6k6dpgf4] { margin-bottom: 1.75rem; }

.ctx-head[b-ai6k6dpgf4] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .6rem;
}

.ctx-title[b-ai6k6dpgf4] {
    margin: 0;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.ctx-more[b-ai6k6dpgf4] {
    font-size: .72rem;
    font-weight: 800;
    color: var(--brand-600);
    text-decoration: none;
    white-space: nowrap;
}

.ctx-more:hover[b-ai6k6dpgf4] { color: var(--brand-700); text-decoration: underline; }

.ctx-more-block[b-ai6k6dpgf4] {
    display: block;
    margin-top: .6rem;
    text-align: center;
    padding: .5rem;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
}

.ctx-badge[b-ai6k6dpgf4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 .35rem;
    border-radius: 999px;
    background: var(--clay-500);
    color: #fff;
    font-size: .68rem;
    font-weight: 800;
}

.ctx-empty[b-ai6k6dpgf4] {
    margin: 0;
    font-size: .78rem;
    font-weight: 600;
    color: var(--ink-400);
}

.ctx-list[b-ai6k6dpgf4] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; }

.ctx-row[b-ai6k6dpgf4] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .45rem .5rem;
    border-radius: var(--radius-xl);
    text-decoration: none;
    color: inherit;
    transition: background-color .16s ease;
}

.ctx-row:hover[b-ai6k6dpgf4] { background: #fff; box-shadow: var(--glow-brand-sm); }

.ctx-row-text[b-ai6k6dpgf4] { display: flex; flex-direction: column; min-width: 0; }

.ctx-row-name[b-ai6k6dpgf4] {
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-900);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ctx-row-sub[b-ai6k6dpgf4] { font-size: .7rem; font-weight: 600; color: var(--ink-500); }
/* /Components/Shared/EventMatchLine.razor.rz.scp.css */
/* ==========================================================================
   EventMatchLine — one match row inside an event division.
   ========================================================================== */

.eml[b-ypw9hdaol5] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: .75rem;
    padding: .75rem .9rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    text-decoration: none;
    color: inherit;
    transition: transform .16s ease, box-shadow .18s ease, border-color .18s ease;
}

.eml:hover[b-ypw9hdaol5] {
    transform: translateY(-1px);
    border-color: var(--brand-300);
    box-shadow: var(--glow-brand-sm);
}

.eml:focus-visible[b-ypw9hdaol5] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

/* You're in this one. */
.eml.is-mine[b-ypw9hdaol5] { box-shadow: inset 4px 0 0 var(--brand-600); border-color: var(--brand-200); }
.eml.is-mine:hover[b-ypw9hdaol5] { box-shadow: inset 4px 0 0 var(--brand-600), var(--glow-brand-sm); }

.eml-side[b-ypw9hdaol5] {
    display: flex;
    align-items: center;
    gap: .6rem;
    min-width: 0;
}

.eml-side.is-right[b-ypw9hdaol5] { flex-direction: row-reverse; text-align: right; }

.eml-who[b-ypw9hdaol5] { min-width: 0; display: flex; flex-direction: column; }

.eml-name[b-ypw9hdaol5] {
    font-size: .9rem;
    font-weight: 700;
    color: var(--ink-700);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.eml-name.is-winner[b-ypw9hdaol5] { font-weight: 900; color: var(--ink-900); }
.eml-name.is-loser[b-ypw9hdaol5] { font-weight: 600; color: var(--ink-400); }

.eml-meta[b-ypw9hdaol5] {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 700;
    color: var(--ink-400);
    font-variant-numeric: tabular-nums;
}

.eml-side.is-right .eml-meta[b-ypw9hdaol5] { justify-content: flex-end; }

.eml-you[b-ypw9hdaol5] {
    padding: .05rem .35rem;
    border-radius: 999px;
    background: var(--brand-100);
    color: var(--brand-800);
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.eml-mid[b-ypw9hdaol5] { text-align: center; }

.eml-score[b-ypw9hdaol5] {
    font-size: .88rem;
    font-weight: 900;
    color: var(--ink-900);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.eml-vs[b-ypw9hdaol5] {
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .12em;
    color: var(--ink-300);
}

.eml-foot[b-ypw9hdaol5] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-top: .1rem;
    padding-top: .5rem;
    border-top: 1px solid var(--ink-100);
}

.eml-round[b-ypw9hdaol5] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .7rem;
    font-weight: 800;
    color: var(--ink-400);
}

.eml-dot[b-ypw9hdaol5] { opacity: .5; }

.eml-chip[b-ypw9hdaol5] {
    padding: .12rem .5rem;
    border-radius: 999px;
    background: var(--ink-50);
    color: var(--ink-500);
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Everything else in this footer is a <StatusChip>, which brings its own styling. */
.eml-chip.is-date[b-ypw9hdaol5] { background: var(--sun-100); color: var(--sun-700); }

@media (max-width: 599px) {
    .eml[b-ypw9hdaol5] { gap: .4rem; padding: .65rem .7rem; }
    .eml-name[b-ypw9hdaol5] { font-size: .82rem; }
}

@media (prefers-reduced-motion: reduce) {
    .eml[b-ypw9hdaol5] { transition: none; }
    .eml:hover[b-ypw9hdaol5] { transform: none; }
}
/* /Components/Shared/EventsRail.razor.rz.scp.css */
.er[b-57mob7v6j7] { display: flex; flex-direction: column; gap: 1.5rem; }

.er-block[b-57mob7v6j7] { display: flex; flex-direction: column; gap: .6rem; }

.er-title[b-57mob7v6j7] {
    margin: 0;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.er-list[b-57mob7v6j7] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }

.er-loading[b-57mob7v6j7] { padding: .5rem 0; }

.er-empty[b-57mob7v6j7] {
    margin: 0;
    font-size: .8rem;
    line-height: 1.5;
    color: var(--ink-500);
}

/* --- my registrations --- */

.er-reg[b-57mob7v6j7] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    padding: .6rem .75rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-xl);
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.er-reg:hover[b-57mob7v6j7] { border-color: var(--brand-300); box-shadow: var(--glow-brand-sm); }

.er-reg-name[b-57mob7v6j7] { font-size: .84rem; font-weight: 800; color: var(--ink-900); }

.er-reg-meta[b-57mob7v6j7] {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .72rem;
    font-weight: 600;
    color: var(--ink-400);
}

.er-badge[b-57mob7v6j7] {
    padding: .1rem .4rem;
    border-radius: 999px;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.er-badge.is-warn[b-57mob7v6j7] { background: var(--clay-100); color: var(--clay-600); }

/* --- season --- */

.er-season[b-57mob7v6j7] {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    padding: .8rem .85rem;
    border-radius: var(--radius-xl);
    background: var(--brand-50);
}

.er-season-name[b-57mob7v6j7] { font-size: .88rem; font-weight: 900; color: var(--ink-900); }
.er-season-dates[b-57mob7v6j7] { font-size: .72rem; font-weight: 700; color: var(--ink-500); }

.er-season-bar[b-57mob7v6j7] {
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .8);
    overflow: hidden;
    margin-top: .2rem;
}

.er-season-fill[b-57mob7v6j7] { display: block; height: 100%; background-image: var(--raqt-gradient-brand); }

.er-season-note[b-57mob7v6j7] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--brand-700);
}

/* --- hall of champions --- */

.er-champ[b-57mob7v6j7] {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .5rem .6rem;
    border-radius: var(--radius-xl);
    text-decoration: none;
    transition: background-color .18s ease;
}

.er-champ:hover[b-57mob7v6j7] { background: var(--ink-50); }

.er-champ-text[b-57mob7v6j7] { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.er-champ-name[b-57mob7v6j7] {
    font-size: .8rem;
    font-weight: 800;
    color: var(--ink-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.er-champ-event[b-57mob7v6j7] {
    font-size: .68rem;
    font-weight: 600;
    color: var(--ink-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.er-champ-mark[b-57mob7v6j7] {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.er-champ-mark.is-gold[b-57mob7v6j7] { background: var(--podium-gold); color: var(--sun-700); }
.er-champ-mark.is-silver[b-57mob7v6j7] { background: var(--podium-silver); color: var(--ink-500); }

.er-champ-mark[b-57mob7v6j7]  .mud-icon-root { font-size: .95rem; width: .95rem; height: .95rem; }
/* /Components/Shared/FeedRow.razor.rz.scp.css */
/* Activity-feed row — card, icon disc / winner-loser pair, hover reaction bar. */

.feed-row[b-6gonyb411f] {
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    margin-bottom: .75rem;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.feed-row:hover[b-6gonyb411f] {
    border-color: var(--brand-200);
    box-shadow: var(--glow-brand-sm);
}

/* The IsUserRelated highlight: a brand edge, a tinted wash, and a heavier title. */
.feed-row.is-mine[b-6gonyb411f] {
    border-color: var(--brand-200);
    background: linear-gradient(90deg, var(--brand-50) 0%, #fff 42%);
    box-shadow: inset 3px 0 0 0 var(--brand-400);
}

.feed-row-main[b-6gonyb411f] {
    display: flex;
    align-items: center;
    gap: .875rem;
    padding: .9rem 1rem;
    text-decoration: none;
    color: inherit;
}

a.feed-row-main:focus-visible[b-6gonyb411f] {
    outline: 3px solid var(--brand-500);
    outline-offset: -3px;
    border-radius: var(--radius-2xl);
}

.feed-row.is-compact .feed-row-main[b-6gonyb411f] { padding: .6rem .75rem; gap: .7rem; }

/* --- lead: semantic icon disc --- */

.feed-disc[b-6gonyb411f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--radius-2xl);
    flex: none;
}

.feed-row.is-compact .feed-disc[b-6gonyb411f] { width: 34px; height: 34px; border-radius: var(--radius-xl); }

.feed-disc.is-brand[b-6gonyb411f] { background: var(--brand-100); color: var(--brand-800); }
.feed-disc.is-clay[b-6gonyb411f]  { background: #fdf5f0;          color: var(--clay-600); }
.feed-disc.is-ink[b-6gonyb411f]   { background: var(--ink-100);   color: var(--ink-900); }

/* --- lead: winner in front, loser tucked behind --- */

.feed-duo[b-6gonyb411f] {
    position: relative;
    width: 58px;
    height: 44px;
    flex: none;
}

.feed-row.is-compact .feed-duo[b-6gonyb411f] { width: 44px; height: 34px; }

.feed-duo-loser[b-6gonyb411f] {
    position: absolute;
    left: 24px;
    top: 6px;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #fff;
    opacity: .75;
}

.feed-row.is-compact .feed-duo-loser[b-6gonyb411f] { left: 18px; top: 5px; }

.feed-duo-winner[b-6gonyb411f] { position: absolute; left: 0; top: 0; }

.feed-duo-trophy[b-6gonyb411f] {
    position: absolute;
    right: -3px;
    bottom: -3px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    color: var(--ink-900);
    line-height: 1;
    background: var(--sun-400);
    border: 1.5px solid #fff;
    border-radius: 50%;
    padding: 2px;
}

/* --- text --- */

.feed-row-text[b-6gonyb411f] { flex: 1; min-width: 0; }

.feed-row-top[b-6gonyb411f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.feed-row-title[b-6gonyb411f] {
    margin: 0;
    font-size: .95rem;
    font-weight: 700;
    color: var(--ink-800);
    line-height: 1.35;
}

.feed-row.is-mine .feed-row-title[b-6gonyb411f] { font-weight: 900; color: var(--ink-900); }
.feed-row.is-compact .feed-row-title[b-6gonyb411f] { font-size: .875rem; }

/* The title carries both players, so it wraps rather than ellipsises — clipping it to
   "Victor Ferrari x Samuel Man…" hides the opponent, which is the half of a result the
   row exists to report. Capped at two lines so a long pairing can't run away. */
.feed-row.is-compact .feed-row-title[b-6gonyb411f] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    line-height: 1.3;
}

/* The body is score + competition, both expendable tails, so it stays on one line. */
.feed-row.is-compact .feed-row-body[b-6gonyb411f] {
    margin-top: .1rem;
    font-size: .78rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The scoreboard is a child component, so its root sits outside this scope — ::deep
   reaches it. It takes the row's width; the timestamp stays flex:none beside it. */
.feed-row-top[b-6gonyb411f]  .sb { flex: 1; min-width: 0; }

.feed-row-time[b-6gonyb411f] {
    flex: none;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-400);
    padding-top: .15rem;
}

.feed-row-body[b-6gonyb411f] {
    margin: .25rem 0 0;
    font-size: .8rem;
    font-weight: 600;
    color: var(--ink-500);
}

/* --- footer: tallies, hover reaction bar, photo count --- */

.feed-row-foot[b-6gonyb411f] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: 0 1rem .7rem;
    min-height: 1.9rem;
}

.feed-row.is-compact .feed-row-foot[b-6gonyb411f] { padding: 0 .75rem .55rem; }

.feed-tallies[b-6gonyb411f] {
    display: flex;
    gap: .3rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.feed-tally[b-6gonyb411f] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    background: var(--ink-50);
    border: 1px solid var(--ink-100);
    border-radius: 999px;
    padding: .1rem .45rem;
    font-size: .72rem;
    font-weight: 800;
    color: var(--ink-600);
}

.feed-tally.is-mine[b-6gonyb411f] { background: var(--brand-50); border-color: var(--brand-300); color: var(--brand-800); }
.feed-tally-emoji[b-6gonyb411f] { font-size: .85rem; line-height: 1; }

/* The browser's answer to the app's long-press sheet: reveal on hover or keyboard focus. */
.feed-reactbar[b-6gonyb411f] {
    display: flex;
    gap: .15rem;
    opacity: 0;
    transform: translateY(2px);
    transition: opacity .16s ease, transform .16s ease;
}

.feed-row:hover .feed-reactbar[b-6gonyb411f],
.feed-row:focus-within .feed-reactbar[b-6gonyb411f] { opacity: 1; transform: none; }

.feed-reactbtn[b-6gonyb411f] {
    border: 1px solid transparent;
    background: none;
    border-radius: 999px;
    padding: .15rem .3rem;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    transition: transform .12s ease, background-color .16s ease;
}

.feed-reactbtn:hover:not(:disabled)[b-6gonyb411f] { background: var(--ink-50); transform: scale(1.18); }
.feed-reactbtn:active:not(:disabled)[b-6gonyb411f] { transform: scale(.98); }
.feed-reactbtn:disabled[b-6gonyb411f] { opacity: .45; cursor: default; }
.feed-reactbtn.is-on[b-6gonyb411f] { background: var(--brand-50); border-color: var(--brand-400); }
.feed-reactbtn:focus-visible[b-6gonyb411f] { outline: 2px solid var(--brand-600); outline-offset: 1px; }

.feed-photos[b-6gonyb411f] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .72rem;
    font-weight: 800;
    color: var(--ink-400);
}

/* Touch devices get no hover, so the bar is always visible there. */
@media (hover: none) {
    .feed-reactbar[b-6gonyb411f] { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .feed-row[b-6gonyb411f],
    .feed-reactbar[b-6gonyb411f],
    .feed-reactbtn[b-6gonyb411f] { transition: none; }
}

/* Match-photo cover thumbnail, served by /fotos/partida/{matchId}/{photoId}. */
.feed-cover[b-6gonyb411f] {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    object-fit: cover;
    display: block;
    margin-right: .35rem;
}

/* ==========================================================================
   Social card (the non-compact variant)
   --------------------------------------------------------------------------
   Full width of the feed column, because that is what makes a photo worth
   posting. Type drives the accent so a result, an event opening and a rating
   drop are distinguishable at a glance rather than by reading them.
   ========================================================================== */

.feed-card[b-6gonyb411f] {
    position: relative;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(15, 22, 31, .04);
    transition: box-shadow .2s ease, border-color .2s ease;
}

.feed-card + .feed-card[b-6gonyb411f] { margin-top: 1rem; }

.feed-card:hover[b-6gonyb411f] { box-shadow: var(--glow-brand-sm); border-color: var(--brand-200); }

/* Accent stripe along the top edge, tinted per type. */
.feed-card[b-6gonyb411f]::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
}

.feed-card.is-brand[b-6gonyb411f]::before { background-image: var(--raqt-gradient-brand); }
.feed-card.is-sun[b-6gonyb411f]::before   { background-image: var(--raqt-gradient-sun); }
.feed-card.is-clay[b-6gonyb411f]::before  { background: linear-gradient(90deg, var(--clay-600), var(--clay-400)); }
.feed-card.is-ink[b-6gonyb411f]::before   { background: linear-gradient(90deg, var(--ink-700), var(--ink-400)); }

/* The viewer's own activity gets a soft brand wash so it reads as "you". */
.feed-card.is-mine[b-6gonyb411f] { border-color: var(--brand-200); background: linear-gradient(180deg, var(--brand-50), #fff 120px); }

/* --- header --- */

.fc-head[b-6gonyb411f] {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 1rem 1.15rem .75rem;
}

.fc-headtext[b-6gonyb411f] { flex: 1; min-width: 0; }

.fc-title[b-6gonyb411f] {
    display: block;
    margin: 0;
    font-size: .98rem;
    font-weight: 800;
    line-height: 1.3;
    color: var(--ink-900);
}

.fc-title.is-link[b-6gonyb411f] {
    text-decoration: none;
    transition: color .16s ease;
}

.fc-title.is-link:hover[b-6gonyb411f] {
    color: var(--brand-700);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.fc-title.is-link:focus-visible[b-6gonyb411f] {
    outline: 3px solid var(--brand-500);
    outline-offset: 2px;
    border-radius: 4px;
}

.fc-time[b-6gonyb411f] {
    display: block;
    margin-top: .15rem;
    font-size: .74rem;
    font-weight: 600;
    color: var(--ink-400);
}

.fc-kind[b-6gonyb411f] {
    flex: none;
    align-self: flex-start;
    padding: .2rem .6rem;
    border-radius: 999px;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    background: var(--ink-50);
    color: var(--ink-500);
}

.feed-card.is-brand .fc-kind[b-6gonyb411f] { background: var(--brand-50); color: var(--brand-800); }
.feed-card.is-sun .fc-kind[b-6gonyb411f]   { background: var(--sun-100); color: var(--sun-700); }
.feed-card.is-clay .fc-kind[b-6gonyb411f]  { background: var(--clay-100); color: var(--clay-600); }

/* --- media --- */

.fc-media[b-6gonyb411f] {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: var(--ink-100);
    cursor: zoom-in;
    line-height: 0;
}

.fc-media-img[b-6gonyb411f] {
    width: 100%;
    /* Tall enough to be the point of the card, capped so a portrait shot doesn't
       push the reactions off screen. */
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}

.fc-media:hover .fc-media-img[b-6gonyb411f] { transform: scale(1.02); }

.fc-media:focus-visible[b-6gonyb411f] { outline: 3px solid var(--brand-500); outline-offset: -3px; }

.fc-media-badge[b-6gonyb411f] {
    position: absolute;
    top: .7rem;
    right: .7rem;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .28rem .55rem;
    border-radius: 999px;
    background: rgba(15, 22, 31, .6);
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    line-height: 1;
    backdrop-filter: blur(4px);
}

.fc-media-veil[b-6gonyb411f] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 22, 31, .35);
}

/* --- score --- */

.fc-score[b-6gonyb411f] {
    display: flex;
    align-items: baseline;
    gap: .7rem;
    flex-wrap: wrap;
    padding: .85rem 1.15rem;
    border-top: 1px solid var(--ink-100);
}

.feed-card:not(:has(.fc-media)) .fc-score[b-6gonyb411f] { border-top: 0; padding-top: 0; }

.fc-score-value[b-6gonyb411f] {
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: -.01em;
    font-variant-numeric: tabular-nums;
    color: var(--ink-900);
}

.fc-score-ctx[b-6gonyb411f] {
    font-size: .78rem;
    font-weight: 700;
    color: var(--ink-400);
}

.fc-body[b-6gonyb411f] {
    margin: 0;
    padding: 0 1.15rem .9rem;
    font-size: .87rem;
    font-weight: 600;
    color: var(--ink-600);
}

/* --- footer --- */

.fc-foot[b-6gonyb411f] {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex-wrap: wrap;
    padding: .7rem 1.15rem .9rem;
    border-top: 1px solid var(--ink-100);
}

.fc-open[b-6gonyb411f] {
    margin-left: auto;
    font-size: .78rem;
    font-weight: 800;
    color: var(--brand-700);
    text-decoration: none;
    white-space: nowrap;
}

.fc-open:hover[b-6gonyb411f] { text-decoration: underline; }

/* On a card the emoji bar is always visible — hover-to-reveal made sense on a dense
   row, but here there is room and discoverability matters more. */
.feed-card .feed-reactbar[b-6gonyb411f] { opacity: 1; visibility: visible; }

@media (max-width: 560px) {
    .feed-card[b-6gonyb411f] { border-radius: var(--radius-2xl); }
    .fc-head[b-6gonyb411f] { padding: .85rem .9rem .6rem; }
    .fc-score[b-6gonyb411f], .fc-foot[b-6gonyb411f] { padding-left: .9rem; padding-right: .9rem; }
    .fc-media-img[b-6gonyb411f] { aspect-ratio: 1 / 1; }
}

.feed-duo-trophy .mud-icon-root[b-6gonyb411f] { font-size: 10px; width: 10px; height: 10px; }
/* /Components/Shared/FeedTeaser.razor.rz.scp.css */
/* FOMO teaser: blurred real activity behind a subscribe CTA. */

.teaser[b-187erccljk] {
    position: relative;
    border-radius: var(--radius-3xl);
    overflow: hidden;
    background: var(--ink-50);
    border: 1px solid var(--ink-100);
}

.teaser-peek[b-187erccljk] {
    overflow: hidden;
    padding: 1rem 1rem 0;
    filter: blur(5px) saturate(1.1);
    pointer-events: none;
    user-select: none;
}

/* Fades the peek out into the CTA so the blur reads as depth, not as damage. */
.teaser-veil[b-187erccljk] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(248, 249, 250, 0.10) 0%,
        rgba(248, 249, 250, 0.72) 45%,
        rgba(248, 249, 250, 0.97) 100%);
}

.teaser-cta[b-187erccljk] {
    position: absolute;
    inset: auto 0 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .35rem;
    padding: 1.5rem 1.5rem 1.75rem;
}

.teaser-kicker[b-187erccljk] { margin: 0; }

.teaser-title[b-187erccljk] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
}

.teaser-body[b-187erccljk] {
    margin: 0;
    max-width: 42ch;
    font-size: .875rem;
    font-weight: 600;
    color: var(--ink-600);
}

.teaser-btn[b-187erccljk] {
    margin-top: .75rem;
    text-decoration: none;
    padding-inline: 2.5rem;
}
/* /Components/Shared/FormDots.razor.rz.scp.css */
.form[b-1irua2lida] {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.label[b-1irua2lida] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.dots[b-1irua2lida] {
    display: flex;
    gap: .3rem;
}

/* The letter is the point: it makes the strip readable without colour. */
.dot[b-1irua2lida] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: .68rem;
    font-weight: 900;
    color: #fff;
    line-height: 1;
}

/* brand-800 / clay-600: both clear 4.5:1 behind white text. */
.dot.is-win[b-1irua2lida]  { background: var(--brand-800); }
.dot.is-loss[b-1irua2lida] { background: var(--clay-600); }
/* /Components/Shared/InboxRow.razor.rz.scp.css */
/* Inbox row. Unread reads brand-tinted with a dot; read is plain white. */

.row[b-xk3zbyq1gn] {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
    width: 100%;
    padding: .9rem 1.1rem;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--ink-100);
    background: #fff;
    font-family: inherit;
    text-align: left;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .12s ease;
}

.row.is-unread[b-xk3zbyq1gn] { background: var(--brand-50); border-color: #e3f0d4; }

.row:hover[b-xk3zbyq1gn] { border-color: var(--brand-300); box-shadow: var(--glow-brand-sm); }
.row:active[b-xk3zbyq1gn] { transform: scale(.996); }
.row:focus-visible[b-xk3zbyq1gn] { outline: 3px solid var(--brand-500); outline-offset: 2px; }

.icon[b-xk3zbyq1gn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex: none;
    border-radius: var(--radius-xl);
    background: #fff;
    border: 1px solid var(--ink-100);
    color: var(--brand-600);
}

.row.is-unread .icon[b-xk3zbyq1gn] { border-color: transparent; box-shadow: var(--glow-brand-sm); }

.text[b-xk3zbyq1gn] { display: flex; flex-direction: column; gap: .25rem; flex: 1; min-width: 0; }

.head[b-xk3zbyq1gn] { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }

.dot[b-xk3zbyq1gn] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--brand-500);
    flex: none;
    align-self: center;
}

.title[b-xk3zbyq1gn] {
    flex: 1;
    min-width: 0;
    font-size: .96rem;
    font-weight: 800;
    letter-spacing: -.01em;
    color: var(--ink-900);
    overflow-wrap: anywhere;
}

.row.is-unread .title[b-xk3zbyq1gn] { font-weight: 900; }

.stamp[b-xk3zbyq1gn] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-400);
    white-space: nowrap;
}

.body[b-xk3zbyq1gn] {
    font-size: .85rem;
    font-weight: 500;
    line-height: 1.45;
    color: var(--ink-600);
    overflow-wrap: anywhere;
}

.cat[b-xk3zbyq1gn] {
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--sun-700);
}

.row[b-xk3zbyq1gn]  .chev { color: var(--ink-300); flex: none; align-self: center; }
/* /Components/Shared/LockedPanel.razor.rz.scp.css */
.locked[b-acmg2516vv] {
    position: relative;
    border-radius: var(--radius-2xl);
    overflow: hidden;
    min-height: 240px;
}

/* The tease. Saturation comes down with the blur so it reads as "behind glass"
   rather than as a rendering fault. */
.tease[b-acmg2516vv] {
    filter: blur(7px) saturate(.65);
    opacity: .55;
    pointer-events: none;
    user-select: none;
    transform: scale(1.02);
}

.overlay[b-acmg2516vv] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

/* The card's own width is set via GradientCard's Style passthrough — see
   LockedPanel.razor. Everything below is markup this component owns, so it does
   carry the isolation scope attribute and is styleable from here. */

.panel-inner[b-acmg2516vv] {
    position: relative;
    z-index: 1;
    padding: 1.75rem 1.5rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
}

.lock[b-acmg2516vv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .15);
    color: #fff;
    margin-bottom: .35rem;
}

.title[b-acmg2516vv] {
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: -.01em;
    color: #fff;
    margin: 0;
}

.body[b-acmg2516vv] {
    font-size: .88rem;
    font-weight: 600;
    color: rgba(255, 255, 255, .82);
    margin: 0;
    max-width: 34ch;
}

.cta[b-acmg2516vv] {
    margin-top: .9rem;
    text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
    .tease[b-acmg2516vv] { transform: none; }
}
/* /Components/Shared/MatchCard.razor.rz.scp.css */
.card[b-22a7gdr8ux] {
    display: flex;
    align-items: center;
    gap: .875rem;
    padding: .9rem 1.1rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    text-decoration: none;
    color: inherit;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.card + .card[b-22a7gdr8ux] { margin-top: .6rem; }

.card:hover[b-22a7gdr8ux] {
    border-color: var(--brand-300);
    box-shadow: var(--glow-brand-sm);
}

.card:focus-visible[b-22a7gdr8ux] {
    outline: 3px solid var(--brand-500);
    outline-offset: 2px;
}

/* Compact is used in the ~320px context rail, where the default row does not fit:
   .trailing is flex:none, so every pixel it takes comes out of .identity, and the
   opponent's name collapses to an ellipsis. Tighten the trailing block and stop the
   meta line wrapping into several ragged rows. */
.card.is-compact[b-22a7gdr8ux] { padding: .6rem .75rem; gap: .625rem; }
.card.is-compact .trailing[b-22a7gdr8ux] { gap: .4rem; min-width: 0; }
.card.is-compact .score[b-22a7gdr8ux] { font-size: .8rem; }

/* Now that the score sits here too, a nowrap meta line overflowed and got clipped
   mid-character by the card's own bounds — no ellipsis, since the clipping was the
   flex container's, not the text's. Let it wrap instead. */
.card.is-compact .meta[b-22a7gdr8ux] {
    flex-wrap: wrap;
    row-gap: .1rem;
}

.card.is-compact .context[b-22a7gdr8ux] { max-width: 14ch; }

.identity[b-22a7gdr8ux] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.name[b-22a7gdr8ux] {
    font-weight: 800;
    font-size: .95rem;
    color: var(--ink-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Two names need the room the score used to take, so the compact row lets the name
   line wrap rather than ellipsise: a clipped "Marcelo Fern…" hides the very thing the
   row exists to say. The meta line underneath stays single-line. */
.card.is-compact .name[b-22a7gdr8ux] {
    font-size: .8rem;
    white-space: normal;
    overflow: visible;
    line-height: 1.25;
}

/* MatchScoreboard is a child component, so its root carries its own scope attribute
   rather than this one's — reach it through ::deep. */
.identity[b-22a7gdr8ux]  .sb { width: 100%; }

.meta[b-22a7gdr8ux] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
    margin-top: .15rem;
    font-size: .74rem;
    font-weight: 600;
    color: var(--ink-500);
}

.dot[b-22a7gdr8ux] { opacity: .5; }

.context[b-22a7gdr8ux] {
    max-width: 22ch;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.deadline[b-22a7gdr8ux] { font-weight: 800; color: var(--sun-700); }
.deadline.is-urgent[b-22a7gdr8ux] { color: var(--clay-600); }

.trailing[b-22a7gdr8ux] {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex: none;
}

.score[b-22a7gdr8ux] {
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    font-size: .88rem;
    color: var(--ink-800);
    white-space: nowrap;
}

.outcome[b-22a7gdr8ux] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    font-size: .72rem;
    font-weight: 900;
    flex: none;
}

.outcome.is-win[b-22a7gdr8ux] { background: var(--brand-100); color: var(--brand-800); }
.outcome.is-loss[b-22a7gdr8ux] { background: var(--ink-100); color: var(--ink-600); }

.reactions[b-22a7gdr8ux] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    padding: .12rem .45rem;
    border-radius: 999px;
    background: var(--ink-50);
    font-size: .74rem;
}

.reactions-count[b-22a7gdr8ux] { font-weight: 800; color: var(--ink-600); }

/* Small screens: the trailing block drops under the identity block. */
@media (max-width: 599px) {
    .card[b-22a7gdr8ux] { flex-wrap: wrap; }
    .identity[b-22a7gdr8ux] { flex-basis: calc(100% - 3.5rem); }
    .trailing[b-22a7gdr8ux] { width: 100%; justify-content: flex-start; }
}
/* /Components/Shared/MatchRow.razor.rz.scp.css */
.row[b-en3whnlr2o] {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .85rem;
    padding: .8rem .9rem;
    border-radius: var(--radius-xl);
    text-decoration: none;
    color: inherit;
    transition: background-color .16s ease, box-shadow .16s ease;
}

.row:hover[b-en3whnlr2o] {
    background: var(--brand-50);
    box-shadow: var(--glow-brand-sm);
}

.row:focus-visible[b-en3whnlr2o] {
    outline: 3px solid var(--brand-600);
    outline-offset: 2px;
}

.result[b-en3whnlr2o] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: .72rem;
    font-weight: 900;
    color: #fff;
    flex: none;
}

.result.is-win[b-en3whnlr2o]  { background: var(--brand-800); }
.result.is-loss[b-en3whnlr2o] { background: var(--clay-600); }
.result.is-open[b-en3whnlr2o] { background: var(--ink-200); color: var(--ink-600); }

.body[b-en3whnlr2o] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.opponent[b-en3whnlr2o] {
    font-weight: 800;
    font-size: .95rem;
    color: var(--ink-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vs[b-en3whnlr2o] {
    font-weight: 700;
    color: var(--ink-400);
    font-size: .8rem;
}

.rating[b-en3whnlr2o] {
    font-weight: 700;
    font-size: .78rem;
    color: var(--ink-400);
    margin-left: .35rem;
    font-variant-numeric: tabular-nums;
}

.meta[b-en3whnlr2o] {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .78rem;
    font-weight: 600;
    color: var(--ink-500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sep[b-en3whnlr2o] { opacity: .5; }

.tail[b-en3whnlr2o] {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex: none;
}

.score[b-en3whnlr2o] {
    font-weight: 800;
    font-size: .9rem;
    color: var(--ink-800);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.chip[b-en3whnlr2o] {
    padding: .2rem .55rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 800;
    white-space: nowrap;
}

.chip.is-done[b-en3whnlr2o]    { background-image: var(--raqt-gradient-brand); color: #fff; }
.chip.is-dated[b-en3whnlr2o]   { background: #fff; color: var(--brand-700); box-shadow: inset 0 0 0 1px var(--brand-300); }
.chip.is-warn[b-en3whnlr2o]    { background: var(--clay-400); color: #fff; }
.chip.is-strong[b-en3whnlr2o]  { background: var(--ink-800); color: #fff; }
.chip.is-neutral[b-en3whnlr2o] { background: var(--ink-100); color: var(--ink-600); }

@media (max-width: 700px) {
    .row[b-en3whnlr2o] { grid-template-columns: auto auto minmax(0, 1fr); }
    .tail[b-en3whnlr2o] { grid-column: 1 / -1; justify-content: flex-end; }
}
/* /Components/Shared/MatchScoreboard.razor.rz.scp.css */
/* One player per row, games right-aligned in fixed columns so the sets line up
   vertically between the two rows and read as a scoreboard rather than two lists. */

.sb[b-ksckbbpoti] { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }

.sb-row[b-ksckbbpoti] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .6rem;
    min-width: 0;
}

.sb-name[b-ksckbbpoti] {
    font-size: .85rem;
    font-weight: 700;
    color: var(--ink-500);
    /* Two names, one per line, so each gets the full width before it has to wrap. */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The winner carries the weight — with the score split across two rows, nothing else
   in the block says who took the match. */
.sb-row.is-won .sb-name[b-ksckbbpoti] { font-weight: 800; color: var(--ink-900); }

.sb-games[b-ksckbbpoti] {
    display: flex;
    gap: .2rem;
    flex: none;
    font-variant-numeric: tabular-nums;
}

.sb-g[b-ksckbbpoti] {
    min-width: 1.15rem;
    text-align: center;
    font-size: .85rem;
    font-weight: 700;
    color: var(--ink-400);
}

/* The set winner's number, so a scan down the column shows how the match went. */
.sb-g.is-set[b-ksckbbpoti] { color: var(--ink-900); font-weight: 900; }
/* /Components/Shared/PhotoLightbox.razor.rz.scp.css */
.lb-backdrop[b-uzgo7p633f] {
    position: fixed;
    inset: 0;
    z-index: 2100;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 22, 31, .92);
    backdrop-filter: blur(6px);
    padding: 3.5rem 1rem 4.5rem;
    animation: lb-fade-b-uzgo7p633f .16s ease-out;
}

.lb-backdrop:focus[b-uzgo7p633f] { outline: none; }

@keyframes lb-fade-b-uzgo7p633f {
    from { opacity: 0; }
    to { opacity: 1; }
}

.lb-stage[b-uzgo7p633f] {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .9rem;
    max-width: min(1100px, 100%);
    max-height: 100%;
}

.lb-img[b-uzgo7p633f] {
    max-width: 100%;
    max-height: calc(100vh - 9rem);
    object-fit: contain;
    border-radius: var(--radius-2xl);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .5);
}

.lb-caption[b-uzgo7p633f] {
    color: rgba(255, 255, 255, .82);
    font-size: .85rem;
    font-weight: 600;
    text-align: center;
}

/* --- controls --- */

.lb-close[b-uzgo7p633f],
.lb-nav[b-uzgo7p633f] {
    position: absolute;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    cursor: pointer;
    transition: background-color .16s ease, transform .12s ease;
}

.lb-close:hover[b-uzgo7p633f],
.lb-nav:hover[b-uzgo7p633f] { background: rgba(255, 255, 255, .24); }

.lb-close:active[b-uzgo7p633f],
.lb-nav:active[b-uzgo7p633f] { transform: scale(.94); }

.lb-close:focus-visible[b-uzgo7p633f],
.lb-nav:focus-visible[b-uzgo7p633f],
.lb-thumb:focus-visible[b-uzgo7p633f] {
    outline: 3px solid var(--brand-400);
    outline-offset: 2px;
}

.lb-close[b-uzgo7p633f] {
    top: 1rem;
    right: 1rem;
    width: 44px;
    height: 44px;
}

.lb-nav[b-uzgo7p633f] {
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
}

.lb-nav:active[b-uzgo7p633f] { transform: translateY(-50%) scale(.94); }
.lb-nav.is-prev[b-uzgo7p633f] { left: 1rem; }
.lb-nav.is-next[b-uzgo7p633f] { right: 1rem; }

/* --- pagination --- */

/* Lightroom-style filmstrip: every frame visible and directly selectable, rather than
   dots that tell you how many there are but not what's in them. */
.lb-strip[b-uzgo7p633f] {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: .5rem;
    padding: .45rem;
    max-width: min(760px, calc(100% - 2rem));
    overflow-x: auto;
    background: rgba(255, 255, 255, .08);
    border-radius: var(--radius-xl);
    scrollbar-width: thin;
}

.lb-thumb[b-uzgo7p633f] {
    flex: none;
    width: 64px;
    height: 48px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    overflow: hidden;
    background: none;
    cursor: pointer;
    opacity: .55;
    transition: opacity .16s ease, border-color .16s ease, transform .16s ease;
}

.lb-thumb img[b-uzgo7p633f] { width: 100%; height: 100%; object-fit: cover; display: block; }

.lb-thumb:hover[b-uzgo7p633f] { opacity: .85; }

.lb-thumb.is-on[b-uzgo7p633f] {
    opacity: 1;
    border-color: var(--brand-400);
    transform: translateY(-2px);
}

.lb-counter[b-uzgo7p633f] {
    position: absolute;
    top: 1.4rem;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, .7);
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .04em;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
    .lb-backdrop[b-uzgo7p633f] { padding: 3.5rem .5rem 4rem; }
    .lb-nav[b-uzgo7p633f] { width: 40px; height: 40px; }
    .lb-nav.is-prev[b-uzgo7p633f] { left: .35rem; }
    .lb-nav.is-next[b-uzgo7p633f] { right: .35rem; }
}

@media (prefers-reduced-motion: reduce) {
    .lb-backdrop[b-uzgo7p633f] { animation: none; }
    .lb-close[b-uzgo7p633f], .lb-nav[b-uzgo7p633f], .lb-thumb[b-uzgo7p633f] { transition: none; }
}
/* /Components/Shared/PlayerTabs.razor.rz.scp.css */
/* NOTE: every rule targeting a tab needs `::deep`.
   The tabs are <NavLink> COMPONENTS, and a class passed into a child component does not
   receive this file's CSS-isolation scope attribute — so a plain `.tab { }` compiles to
   `.tab[b-xxxxx]`, matches nothing, and the tabs render as bare text inside a styled pill.
   `.tabs` is a real <nav> in this file, so it keeps the scope and needs no ::deep. */

.tabs[b-74ib97ko9o] {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
    margin: 1.5rem 0;
    padding: .3rem;
    background: #fff;
    border-radius: 999px;
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
    width: fit-content;
    max-width: 100%;
}

.tabs[b-74ib97ko9o]  .tab {
    padding: .55rem 1.1rem;
    border-radius: 999px;
    font-size: .86rem;
    font-weight: 800;
    color: var(--ink-500);
    text-decoration: none;
    white-space: nowrap;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    transition: color .18s ease, background-color .18s ease;
}

.tabs[b-74ib97ko9o]  .tab:hover {
    color: var(--ink-800);
    background: var(--ink-50);
}

/* Active gets the app's focused-tab gradient pill, same as the left rail. */
.tabs[b-74ib97ko9o]  .tab.active {
    color: #fff;
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand-sm);
}

.tabs[b-74ib97ko9o]  .tab.active:hover { color: #fff; }

.tabs[b-74ib97ko9o]  .tab:focus-visible {
    outline: 3px solid var(--brand-700);
    outline-offset: 2px;
}

@media (max-width: 560px) {
    .tabs[b-74ib97ko9o] { width: 100%; justify-content: space-between; }
    .tabs[b-74ib97ko9o]  .tab { padding: .5rem .7rem; font-size: .8rem; }
}
/* /Components/Shared/PositionChart.razor.rz.scp.css */
/* Position chart — twin of RatingChart.razor.css. Kept as its own scoped sheet
   rather than shared, so either chart can diverge without disturbing the other. */

.chart[b-qhiewjh0kq] {
    margin: 0;
}

.head[b-qhiewjh0kq] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .35rem;
}

.kicker[b-qhiewjh0kq] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--brand-600);
    margin: 0;
}

.title[b-qhiewjh0kq] {
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: -.01em;
    color: var(--ink-900);
    margin: .15rem 0 0;
}

/* Current standing, read as a figure rather than a chart label. */
.now[b-qhiewjh0kq] {
    flex: none;
    margin: 0;
    text-align: right;
    line-height: 1.1;
}

.now-v[b-qhiewjh0kq] {
    display: block;
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
}

.now-l[b-qhiewjh0kq] {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    color: var(--ink-500);
}

.thin[b-qhiewjh0kq] {
    color: var(--ink-500);
    font-size: .88rem;
    margin: 1.5rem 0;
    text-align: center;
}

.plot[b-qhiewjh0kq] {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

.grid[b-qhiewjh0kq] {
    stroke: var(--ink-200);
    stroke-width: 1;
    shape-rendering: crispEdges;
}

.tick[b-qhiewjh0kq] {
    fill: var(--ink-500);
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.line[b-qhiewjh0kq] {
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.area[b-qhiewjh0kq] { stroke: none; }

.end-dot[b-qhiewjh0kq] {
    fill: var(--brand-700);
    stroke: #fff;
    stroke-width: 2;
}

.end-label[b-qhiewjh0kq] {
    fill: var(--ink-900);
    font-size: 14px;
    font-weight: 900;
}

.hit[b-qhiewjh0kq] {
    fill: transparent;
    cursor: pointer;
}

.cross[b-qhiewjh0kq] {
    stroke: var(--ink-300);
    stroke-width: 1;
    opacity: 0;
    pointer-events: none;
}

.dot[b-qhiewjh0kq] {
    fill: var(--brand-700);
    stroke: #fff;
    stroke-width: 2;
    opacity: 0;
    pointer-events: none;
}

.tip[b-qhiewjh0kq] {
    opacity: 0;
    pointer-events: none;
}

.tip-bg[b-qhiewjh0kq] {
    fill: var(--ink-900);
    filter: drop-shadow(0 6px 16px rgba(15, 22, 31, .28));
}

.tip-v[b-qhiewjh0kq] {
    fill: #fff;
    font-size: 15px;
    font-weight: 900;
}

.tip-m[b-qhiewjh0kq] {
    fill: var(--ink-300);
    font-size: 11px;
    font-weight: 600;
}

.pt:hover .cross[b-qhiewjh0kq],
.pt:hover .dot[b-qhiewjh0kq],
.pt:hover .tip[b-qhiewjh0kq] { opacity: 1; }
/* /Components/Shared/ProfilePhotoEditor.razor.rz.scp.css */
/* Avatar editor. Sits on the gradient profile hero, so the light variant is the
   one that actually ships; the dark variant exists for reuse on white cards. */

.editor[b-czcg6f1du2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    flex: none;
}

/* --- the square-crop frame ---------------------------------------------- */

.frame[b-czcg6f1du2] {
    position: relative;
    width: 112px;
    height: 112px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand);
    flex: none;
}

.editor.is-light .frame[b-czcg6f1du2] {
    background: rgba(255, 255, 255, .22);
    box-shadow: 0 8px 24px rgba(15, 22, 31, .18);
}

/* `cover` on a circular frame IS the square crop — what you see here is what
   the server keeps after normalizing to 512x512. */
/* The circular crop clips the PHOTO, not the frame box. It used to live on .frame,
   which also clipped the camera button positioned on the bottom-right corner and
   sliced it in half. */
.shot[b-czcg6f1du2] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%;
}

.initials[b-czcg6f1du2] {
    font-size: 2rem;
    font-weight: 900;
    color: #fff;
    letter-spacing: -.02em;
    user-select: none;
}

.frame-veil[b-czcg6f1du2] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 22, 31, .35);
}

/* --- the camera button -------------------------------------------------- */

.pick[b-czcg6f1du2] {
    position: absolute;
    right: 2px;
    bottom: 2px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 2px solid #fff;
    background: var(--brand-400);
    color: var(--ink-900);
    cursor: pointer;
    transition: transform .12s ease, background-color .18s ease;
}

.pick:hover[b-czcg6f1du2] { background: var(--sun-300); }
.pick:active[b-czcg6f1du2] { transform: scale(.94); }
.pick:focus-within[b-czcg6f1du2] { outline: 3px solid #fff; outline-offset: 2px; }

/* The real <input type="file"> stays in the layout (so the label activates it)
   but is visually collapsed. */
.pick[b-czcg6f1du2]  input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.pick[b-czcg6f1du2]  input[type="file"]:disabled { cursor: default; }

/* --- actions ------------------------------------------------------------ */

.actions[b-czcg6f1du2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    max-width: 190px;
}

.actions[b-czcg6f1du2]  .save {
    padding: .6rem 1.25rem;
    font-size: .82rem;
}

.link[b-czcg6f1du2] {
    border: 0;
    background: none;
    padding: .15rem .35rem;
    font-family: inherit;
    font-size: .78rem;
    font-weight: 700;
    color: var(--ink-500);
    text-decoration: underline;
    cursor: pointer;
    border-radius: var(--radius-xl);
}

.editor.is-light .link[b-czcg6f1du2] { color: rgba(255, 255, 255, .85); }

.link:hover:not(:disabled)[b-czcg6f1du2] { color: var(--clay-600); }
.editor.is-light .link:hover:not(:disabled)[b-czcg6f1du2] { color: #fff; }
.link:disabled[b-czcg6f1du2] { opacity: .5; cursor: default; }

.hint[b-czcg6f1du2] {
    font-size: .72rem;
    font-weight: 600;
    line-height: 1.35;
    text-align: center;
    color: var(--ink-500);
}

.editor.is-light .hint[b-czcg6f1du2] { color: rgba(255, 255, 255, .8); }

@media (max-width: 767px) {
    .frame[b-czcg6f1du2] { width: 92px; height: 92px; }
    .initials[b-czcg6f1du2] { font-size: 1.6rem; }
}
/* /Components/Shared/ProposeMatchPanel.razor.rz.scp.css */
/* Propose-a-match side panel. Full-width on mobile, a sticky column on desktop —
   the parent page owns the placement, this owns the surface. */

.propose[b-96w0no0j3c] {
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    padding: 1.5rem;
    box-shadow: var(--glow-brand-sm);
}

.propose-head[b-96w0no0j3c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .5rem;
}

.propose-kicker[b-96w0no0j3c] { margin: 0 0 .2rem; }

.propose-name[b-96w0no0j3c] {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--ink-900);
    line-height: 1.15;
}

.propose-rating[b-96w0no0j3c] {
    margin: 0 0 1.25rem;
    font-size: 1.1rem;
    font-weight: 900;
    color: var(--brand-700);
}

.propose-rating span[b-96w0no0j3c] { font-size: .7rem; font-weight: 700; color: var(--ink-400); }

.propose-note-counter[b-96w0no0j3c] {
    margin: 0 0 1.25rem;
    padding: .6rem .75rem;
    border-radius: var(--radius-xl);
    background: var(--sun-50);
    border: 1px solid var(--sun-200);
    font-size: .78rem;
    font-weight: 600;
    color: var(--sun-700);
}

/* --- fields --- */

.propose-field[b-96w0no0j3c] { margin-bottom: 1.15rem; }

.propose-label[b-96w0no0j3c] {
    display: block;
    margin-bottom: .4rem;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.propose-input[b-96w0no0j3c] {
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
    font-size: .95rem;
    font-weight: 600;
    color: var(--ink-900);
    background: var(--ink-50);
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-xl);
    padding: .65rem .8rem;
    transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.propose-input:hover[b-96w0no0j3c] { border-color: var(--ink-200); }

.propose-input:focus[b-96w0no0j3c] {
    outline: none;
    background: #fff;
    border-color: var(--brand-400);
    box-shadow: var(--glow-brand-sm);
}

.propose-input-stacked[b-96w0no0j3c] { margin-top: .5rem; }

.propose-textarea[b-96w0no0j3c] { resize: vertical; min-height: 76px; line-height: 1.45; }
.propose-textarea[b-96w0no0j3c]::placeholder,
.propose-input[b-96w0no0j3c]::placeholder { color: var(--ink-300); font-weight: 500; }

/* --- quick picks: the browser's shortcut past a date widget --- */

.propose-quick[b-96w0no0j3c] { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .5rem; }

.propose-chip[b-96w0no0j3c] {
    font-family: inherit;
    font-size: .72rem;
    font-weight: 800;
    color: var(--ink-600);
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: 999px;
    padding: .3rem .7rem;
    cursor: pointer;
    transition: color .16s ease, background-color .16s ease, border-color .16s ease;
}

.propose-chip:hover[b-96w0no0j3c] { border-color: var(--brand-300); color: var(--brand-700); }

.propose-chip.is-on[b-96w0no0j3c] {
    background: var(--brand-50);
    border-color: var(--brand-400);
    color: var(--brand-800);
}

.propose-chip:focus-visible[b-96w0no0j3c] { outline: 2px solid var(--brand-600); outline-offset: 1px; }

/* --- feedback + actions --- */

.propose-error[b-96w0no0j3c] {
    margin: 0 0 .9rem;
    padding: .6rem .75rem;
    border-radius: var(--radius-xl);
    background: #fdf5f0;
    border: 1px solid #f0c9b8;
    color: var(--clay-600);
    font-size: .82rem;
    font-weight: 700;
}

.propose-actions[b-96w0no0j3c] { display: flex; flex-direction: column; gap: .25rem; }

/* ::deep — GradientButton renders the actual <button>, so it carries no scope attribute. */
.propose-actions[b-96w0no0j3c]  .propose-submit { width: 100%; }

.propose-cancel[b-96w0no0j3c] {
    width: 100%;
    border: 0;
    background: none;
    font-family: inherit;
    font-size: .85rem;
    font-weight: 700;
    color: var(--ink-400);
    padding: .75rem;
    cursor: pointer;
    border-radius: var(--radius-xl);
}

.propose-cancel:hover[b-96w0no0j3c] { color: var(--ink-700); background: var(--ink-50); }
/* /Components/Shared/RatingChart.razor.rz.scp.css */
/* Rating chart — theme-token driven throughout; no raw hex outside the SVG
   gradient stops, which the SVG spec won't resolve from a CSS variable. */

.chart[b-cwtu79gb0a] {
    margin: 0;
}

.head[b-cwtu79gb0a] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .35rem;
}

.kicker[b-cwtu79gb0a] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--brand-600);
    margin: 0;
}

.title[b-cwtu79gb0a] {
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: -.01em;
    color: var(--ink-900);
    margin: .15rem 0 0;
}

/* The table twin, so no value is reachable only through a tooltip. */
.table-link[b-cwtu79gb0a] {
    flex: none;
    font-size: .78rem;
    font-weight: 800;
    color: var(--brand-700);
    text-decoration: none;
    white-space: nowrap;
    padding-top: .9rem;
}

.table-link:hover[b-cwtu79gb0a] { text-decoration: underline; }

.thin[b-cwtu79gb0a] {
    color: var(--ink-500);
    font-size: .88rem;
    margin: 1.5rem 0;
    text-align: center;
}

.plot[b-cwtu79gb0a] {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

/* --- chrome: recessive, hairline, solid (never dashed) --- */
.grid[b-cwtu79gb0a] {
    stroke: var(--ink-200);
    stroke-width: 1;
    shape-rendering: crispEdges;
}

.tick[b-cwtu79gb0a] {
    fill: var(--ink-500);
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* --- the data --- */
.line[b-cwtu79gb0a] {
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.area[b-cwtu79gb0a] { stroke: none; }

/* Endpoint: the single direct label the chart earns, plus a 2px surface ring
   so the marker stays legible where it crosses the line. */
.end-dot[b-cwtu79gb0a] {
    fill: var(--brand-700);
    stroke: #fff;
    stroke-width: 2;
}

.end-label[b-cwtu79gb0a] {
    fill: var(--ink-900);
    font-size: 14px;
    font-weight: 900;
}

/* --- hover layer, CSS only: no interop round-trip on a Server circuit --- */
.hit[b-cwtu79gb0a] {
    fill: transparent;
    cursor: pointer;
}

.cross[b-cwtu79gb0a] {
    stroke: var(--ink-300);
    stroke-width: 1;
    opacity: 0;
    pointer-events: none;
}

.dot[b-cwtu79gb0a] {
    fill: var(--brand-700);
    stroke: #fff;
    stroke-width: 2;
    opacity: 0;
    pointer-events: none;
}

.tip[b-cwtu79gb0a] {
    opacity: 0;
    pointer-events: none;
}

.tip-bg[b-cwtu79gb0a] {
    fill: var(--ink-900);
    filter: drop-shadow(0 6px 16px rgba(15, 22, 31, .28));
}

.tip-v[b-cwtu79gb0a] {
    fill: #fff;
    font-size: 15px;
    font-weight: 900;
}

.tip-m[b-cwtu79gb0a] {
    fill: var(--ink-300);
    font-size: 11px;
    font-weight: 600;
}

.pt:hover .cross[b-cwtu79gb0a],
.pt:hover .dot[b-cwtu79gb0a],
.pt:hover .tip[b-cwtu79gb0a] { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
    .pt .cross[b-cwtu79gb0a], .pt .dot[b-cwtu79gb0a], .pt .tip[b-cwtu79gb0a] { transition: none; }
}
/* /Components/Shared/ReactionBar.razor.rz.scp.css */
.bar[b-ztta3cdjx8] {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}

.pill[b-ztta3cdjx8] {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    padding: .3rem .6rem;
    border: 1px solid var(--ink-100);
    border-radius: 999px;
    background: #fff;
    font-family: inherit;
    font-size: .92rem;
    line-height: 1;
    cursor: pointer;
    transition: transform .12s ease, border-color .18s ease, background-color .18s ease;
}

.pill:hover:not(:disabled)[b-ztta3cdjx8] { border-color: var(--brand-300); background: var(--brand-50); }
.pill:active:not(:disabled)[b-ztta3cdjx8] { transform: scale(.96); }
.pill:disabled[b-ztta3cdjx8] { opacity: .55; cursor: default; }

.pill:focus-visible[b-ztta3cdjx8] {
    outline: 3px solid var(--brand-500);
    outline-offset: 2px;
}

/* An emoji nobody has used yet stays quiet until hovered. */
.pill.is-empty[b-ztta3cdjx8] { opacity: .55; }
.pill.is-empty:hover:not(:disabled)[b-ztta3cdjx8] { opacity: 1; }

.pill.is-mine[b-ztta3cdjx8] {
    border-color: var(--brand-400);
    background: var(--brand-50);
    box-shadow: var(--glow-brand-sm);
    opacity: 1;
}

.count[b-ztta3cdjx8] {
    font-size: .72rem;
    font-weight: 800;
    color: var(--ink-700);
}

@media (prefers-reduced-motion: reduce) {
    .pill[b-ztta3cdjx8] { transition: none; }
}
/* /Components/Shared/ScoreEntry.razor.rz.scp.css */
.entry[b-1z909k8e9h] {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-3xl);
    padding: 1.5rem;
}

.head[b-1z909k8e9h] { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.title[b-1z909k8e9h] { font-size: 1.1rem; font-weight: 900; letter-spacing: -.01em; margin: 0; color: var(--ink-900); }

.format[b-1z909k8e9h] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--sun-700);
    background: var(--sun-50);
    border-radius: 999px;
    padding: .2rem .6rem;
}

/* ------------------------------------------------------------------ fields */

.field[b-1z909k8e9h] { display: flex; flex-direction: column; gap: .35rem; }

.label[b-1z909k8e9h] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.help[b-1z909k8e9h] { font-size: .74rem; font-weight: 600; color: var(--ink-500); }
.help code[b-1z909k8e9h] { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; background: var(--ink-50); border-radius: 4px; padding: 0 .25rem; }

.quick-input[b-1z909k8e9h],
.date-input[b-1z909k8e9h] {
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    color: var(--ink-900);
    background: #fff;
    border: 1px solid var(--ink-200);
    border-radius: var(--radius-xl);
    padding: .7rem .9rem;
    width: 100%;
}

/* The fast path deserves to look like the fast path. */
.quick-input[b-1z909k8e9h] {
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: .04em;
    border-width: 2px;
    border-color: var(--brand-300);
}

.quick-input[b-1z909k8e9h]::placeholder { color: var(--ink-300); font-weight: 700; letter-spacing: .04em; }

.quick-input:focus[b-1z909k8e9h],
.date-input:focus[b-1z909k8e9h],
.num:focus[b-1z909k8e9h] {
    outline: none;
    border-color: var(--brand-500);
    box-shadow: var(--glow-brand-sm);
}

/* -------------------------------------------------------------------- sets */

.sets[b-1z909k8e9h] { display: flex; flex-direction: column; gap: .6rem; }

.sets-head[b-1z909k8e9h] {
    display: flex;
    gap: .75rem;
    padding-left: 6.5rem;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.col-player[b-1z909k8e9h] { width: 3.5rem; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.col-player:first-child[b-1z909k8e9h] { margin-right: 1rem; }

.set[b-1z909k8e9h] {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    padding: .7rem .9rem;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    background: var(--ink-50);
    transition: border-color .18s ease, background-color .18s ease;
}

.set.is-valid[b-1z909k8e9h] { border-color: var(--brand-300); background: #fff; }

.set-label[b-1z909k8e9h] { display: flex; align-items: center; gap: .4rem; width: 6rem; flex: none; }
.set-n[b-1z909k8e9h] { font-size: .8rem; font-weight: 900; color: var(--ink-900); }
.set-tag[b-1z909k8e9h] { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--sun-700); }

.set-ok[b-1z909k8e9h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 50%;
    background: var(--brand-400);
    color: #fff;
    font-size: .7rem;
    font-weight: 900;
}

.set-scores[b-1z909k8e9h] { display: flex; align-items: center; gap: .5rem; }

.num[b-1z909k8e9h] {
    width: 3.5rem;
    padding: .55rem 0;
    text-align: center;
    font-family: inherit;
    font-size: 1.25rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    color: var(--ink-900);
    background: #fff;
    border: 1px solid var(--ink-200);
    border-radius: var(--radius-xl);
}

.num.is-small[b-1z909k8e9h] { width: 3rem; font-size: 1rem; }

.times[b-1z909k8e9h] { font-size: 1rem; font-weight: 900; color: var(--ink-300); }

.set-remove[b-1z909k8e9h] {
    border: 0;
    background: none;
    font-family: inherit;
    font-size: .72rem;
    font-weight: 800;
    color: var(--clay-600);
    cursor: pointer;
    padding: .25rem .4rem;
    border-radius: var(--radius-xl);
}

.set-remove:hover[b-1z909k8e9h] { background: #f7e4dd; }

.tb[b-1z909k8e9h] {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-basis: 100%;
    margin-left: 6rem;
    padding-top: .6rem;
    border-top: 1px dashed var(--ink-200);
}

.tb-label[b-1z909k8e9h] { font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-500); }
.tb-scores[b-1z909k8e9h] { display: flex; align-items: center; gap: .5rem; }

.add-set[b-1z909k8e9h] {
    align-self: flex-start;
    border: 2px dashed var(--brand-300);
    background: var(--sun-50);
    border-radius: var(--radius-2xl);
    padding: .6rem 1rem;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 800;
    color: var(--brand-700);
    cursor: pointer;
}

.add-set:hover[b-1z909k8e9h] { background: var(--brand-50); }

/* ----------------------------------------------------------------- verdict */

.verdict[b-1z909k8e9h] {
    margin: 0;
    padding: .7rem 1rem;
    border-radius: var(--radius-2xl);
    background: var(--ink-50);
    font-size: .82rem;
    font-weight: 700;
    color: var(--ink-600);
    text-align: center;
}

.verdict.is-decided[b-1z909k8e9h] { background: var(--brand-50); color: var(--brand-800); }

/* -------------------------------------------------------------- retirement */

.retire[b-1z909k8e9h] {
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    padding: .9rem 1rem;
}

.retire-toggle[b-1z909k8e9h] { display: flex; align-items: flex-start; gap: .6rem; cursor: pointer; }
.retire-toggle strong[b-1z909k8e9h] { display: block; font-size: .85rem; font-weight: 900; color: var(--ink-900); }
.retire-toggle em[b-1z909k8e9h] { display: block; font-style: normal; font-size: .75rem; font-weight: 600; color: var(--ink-500); margin-top: .1rem; }

.retire-who[b-1z909k8e9h] { display: flex; gap: .5rem; margin-top: .8rem; }

.who[b-1z909k8e9h] {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex: 1;
    justify-content: center;
    padding: .55rem .75rem;
    border: 1px solid var(--ink-200);
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-700);
    cursor: pointer;
}

.who.is-on[b-1z909k8e9h] { background: var(--clay-500); border-color: var(--clay-500); color: #fff; }

/* ----------------------------------------------------------------- actions */

.actions[b-1z909k8e9h] { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }

.cancel[b-1z909k8e9h] {
    border: 0;
    background: none;
    font-family: inherit;
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-500);
    cursor: pointer;
    padding: .5rem;
}

.cancel:hover[b-1z909k8e9h] { color: var(--ink-800); }

.blocker[b-1z909k8e9h] { margin: -.5rem 0 0; font-size: .78rem; font-weight: 600; color: var(--ink-500); }

@media (max-width: 599px) {
    .entry[b-1z909k8e9h] { padding: 1.1rem; }
    .sets-head[b-1z909k8e9h] { display: none; }
    .set-label[b-1z909k8e9h] { width: 100%; }
    .tb[b-1z909k8e9h] { margin-left: 0; }
}
/* /Components/Shared/StandingsTable.razor.rz.scp.css */
/* ==========================================================================
   StandingsTable — league table, own row highlighted, collapses to cards.
   ========================================================================== */

.st-wrap[b-78r66amopy] {
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    overflow: hidden;
}

.st-table[b-78r66amopy] {
    width: 100%;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
}

/* --- header ------------------------------------------------------------- */

.st-th[b-78r66amopy] {
    background: var(--ink-50);
    padding: 0;
    text-align: left;
    white-space: nowrap;
}

.st-th.is-num[b-78r66amopy] { text-align: right; }
.st-th.is-rank[b-78r66amopy] { width: 3.5rem; }
.st-th.is-player[b-78r66amopy] { width: auto; }
.st-th.is-num[b-78r66amopy] { width: 5.5rem; }

.st-sort[b-78r66amopy] {
    display: flex;
    align-items: center;
    gap: .25rem;
    width: 100%;
    border: 0;
    background: none;
    padding: .7rem .9rem;
    font-family: inherit;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
    cursor: pointer;
    transition: color .15s ease, background-color .15s ease;
}

.st-th.is-num .st-sort[b-78r66amopy] { justify-content: flex-end; }
.st-th.is-rank .st-sort[b-78r66amopy] { justify-content: center; padding-inline: .4rem; }

.st-sort:hover[b-78r66amopy] { color: var(--brand-700); background: var(--brand-50); }
.st-sort:focus-visible[b-78r66amopy] { outline: 2px solid var(--brand-500); outline-offset: -2px; }

.st-th.is-sorted .st-sort[b-78r66amopy] { color: var(--brand-700); }

.st-caret[b-78r66amopy] { font-size: .7rem; line-height: 1; }

/* --- body --------------------------------------------------------------- */

.st-tr[b-78r66amopy] { border-top: 1px solid var(--ink-100); }
.st-tr:hover[b-78r66amopy] { background: var(--ink-50); }

/* The viewer's own row — the whole point of a personal league table. */
.st-tr.is-me[b-78r66amopy] { background: var(--brand-50); box-shadow: inset 3px 0 0 var(--brand-500); }
.st-tr.is-me:hover[b-78r66amopy] { background: var(--brand-100); }

.st-td[b-78r66amopy] {
    padding: .55rem .9rem;
    font-size: .85rem;
    color: var(--ink-800);
}

.st-num[b-78r66amopy] { text-align: right; font-weight: 800; }
.st-num.is-win[b-78r66amopy] { color: var(--brand-700); }
.st-num.is-loss[b-78r66amopy] { color: var(--clay-600); }
.st-num.is-soft[b-78r66amopy] { color: var(--ink-500); font-weight: 700; }

.st-rank[b-78r66amopy] { text-align: center; padding-inline: .4rem; }

.st-rank-badge[b-78r66amopy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.6rem;
    height: 1.6rem;
    padding: 0 .35rem;
    border-radius: .55rem;
    background: var(--ink-50);
    font-size: .78rem;
    font-weight: 900;
    color: var(--ink-700);
    font-variant-numeric: tabular-nums;
}

/* Podium tints — the same three values mobile's EventPrizes.placementTint uses,
   so a gold row and a gold prize badge read as the same idea. */
.st-rank-badge.is-gold[b-78r66amopy] { background: #fbf0c4; color: #7d6410; }   /* gold */
.st-rank-badge.is-silver[b-78r66amopy] { background: #eceef1; color: var(--ink-700); } /* silver */
.st-rank-badge.is-bronze[b-78r66amopy] { background: #f3e0cf; color: var(--clay-600); } /* bronze */

.st-player[b-78r66amopy] { min-width: 0; }

.st-player-link[b-78r66amopy] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-width: 0;
    text-decoration: none;
    color: inherit;
}

.st-player-link:hover .st-player-name[b-78r66amopy] { color: var(--brand-700); text-decoration: underline; }
.st-player-link:focus-visible[b-78r66amopy] { outline: 2px solid var(--brand-500); outline-offset: 2px; border-radius: .4rem; }

.st-player-name[b-78r66amopy] {
    font-size: .85rem;
    font-weight: 800;
    color: var(--ink-900);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.st-you[b-78r66amopy] {
    margin-left: .5rem;
    padding: .1rem .4rem;
    border-radius: 999px;
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    vertical-align: middle;
}

/* --- mobile cards ------------------------------------------------------- */

.st-cards[b-78r66amopy] {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: .6rem;
    flex-direction: column;
}

.st-card[b-78r66amopy] {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    background: #fff;
    border: 1px solid var(--ink-100);
    border-radius: var(--radius-2xl);
    padding: .75rem .85rem;
}

.st-card.is-me[b-78r66amopy] { border-color: var(--brand-400); box-shadow: var(--glow-brand-sm); background: var(--brand-50); }

.st-card-body[b-78r66amopy] { flex: 1; min-width: 0; }

.st-stats[b-78r66amopy] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .9rem;
    margin: .5rem 0 0;
}

.st-stats > div[b-78r66amopy] { display: flex; align-items: baseline; gap: .3rem; }

.st-stats dt[b-78r66amopy] {
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-400);
}

.st-stats dd[b-78r66amopy] {
    margin: 0;
    font-size: .82rem;
    font-weight: 800;
    color: var(--ink-800);
    font-variant-numeric: tabular-nums;
}

.st-stats dd.is-win[b-78r66amopy] { color: var(--brand-700); }
.st-stats dd.is-loss[b-78r66amopy] { color: var(--clay-600); }

@media (max-width: 719px) {
    .st-wrap[b-78r66amopy] { display: none; }
    .st-cards[b-78r66amopy] { display: flex; }
}
/* /Components/Shared/StatTile.razor.rz.scp.css */
.tile[b-emlpd50rw5] {
    background: #fff;
    border-radius: var(--radius-2xl);
    padding: 1.1rem 1.25rem;
    box-shadow: 0 1px 2px rgba(15, 22, 31, .05);
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
}

.tile.is-emphasis[b-emlpd50rw5] {
    background-image: var(--raqt-gradient-brand);
    box-shadow: var(--glow-brand);
}

.label[b-emlpd50rw5] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-500);
    margin: 0;
}

.tile.is-emphasis .label[b-emlpd50rw5] { color: rgba(255, 255, 255, .9); }

/* Proportional figures deliberately: tabular-nums makes a display-size number
   like 121 read loose. Tabular is for columns, not for a headline. */
.value[b-emlpd50rw5] {
    font-size: 1.9rem;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: var(--ink-900);
    margin: .15rem 0 0;
}

.tile.is-emphasis .value[b-emlpd50rw5] { color: #fff; }

.unit[b-emlpd50rw5] {
    font-size: .95rem;
    font-weight: 800;
    margin-left: .1rem;
    opacity: .7;
}

.sub[b-emlpd50rw5] {
    font-size: .78rem;
    font-weight: 600;
    color: var(--ink-500);
    margin: .3rem 0 0;
}

.tile.is-emphasis .sub[b-emlpd50rw5] { color: rgba(255, 255, 255, .88); }

/* Meter: fill and track are two steps of one ramp — never two hues. */
.meter[b-emlpd50rw5] {
    margin-top: .7rem;
    height: 6px;
    border-radius: 999px;
    background: var(--brand-100);
    overflow: hidden;
}

.tile.is-emphasis .meter[b-emlpd50rw5] { background: rgba(255, 255, 255, .28); }

.meter-fill[b-emlpd50rw5] {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: var(--brand-600);
}

.tile.is-emphasis .meter-fill[b-emlpd50rw5] { background: #fff; }
/* /Components/Shared/StatusChip.razor.rz.scp.css */
.chip[b-9rm7nh3n7v] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .22rem .62rem;
    border-radius: 999px;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
    flex: none;
}

/* No date agreed / archived states — quiet neutral. */
.chip.is-neutral[b-9rm7nh3n7v] {
    background: var(--ink-100);
    color: var(--ink-600);
}

/* A date is locked in: outlined brand, so it reads as "booked" not "done". */
.chip.is-scheduled-dated[b-9rm7nh3n7v] {
    background: #fff;
    color: var(--brand-700);
    box-shadow: inset 0 0 0 1px var(--brand-300);
}

/* Played — the signature sweep, the only chip that earns it. */
.chip.is-done[b-9rm7nh3n7v] {
    background-image: var(--raqt-gradient-brand);
    color: #fff;
    box-shadow: var(--glow-brand-sm);
}

/* Waiting on someone / disputed — clay, the app's "needs attention" accent. */
.chip.is-waiting[b-9rm7nh3n7v] {
    background: #f7e4dd;
    color: var(--clay-600);
}

.chip.is-forfeit[b-9rm7nh3n7v] {
    background: var(--ink-800);
    color: #fff;
}