/* /Components/Account/Pages/Manage/Avatar.razor.rz.scp.css */
.avatar-account-intro[b-wtmqahb78z] {
    color: var(--vx-copy-green);
}

.avatar-account-grid[b-wtmqahb78z] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.avatar-account-card[b-wtmqahb78z] {
    display: flex;
    min-width: 0;
    padding: 1rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.24);
    border-radius: 0.35rem;
    background: rgba(0, 9, 4, 0.48);
}

.avatar-account-card__header[b-wtmqahb78z] {
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

.avatar-account-card__header h3[b-wtmqahb78z] {
    margin: 0 0 0.25rem;
    font-size: 1rem;
}

.avatar-account-card__header p[b-wtmqahb78z] {
    margin: 0;
    color: var(--vx-copy-green);
    font-size: 0.86rem;
}

.avatar-account-preview-wrap[b-wtmqahb78z] {
    display: grid;
    width: 100%;
    place-items: center;
}

.avatar-account-preview[b-wtmqahb78z] {
    width: clamp(8rem, 22vw, 11rem);
    aspect-ratio: 1;
    object-fit: cover;
    border: 3px solid rgba(232, 181, 63, 0.72);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.48);
    box-shadow:
        0 0 0 5px rgba(232, 181, 63, 0.08),
        0 1rem 2.2rem rgba(0, 0, 0, 0.34);
}

.avatar-account-preview--pending[b-wtmqahb78z] {
    border-color: rgba(205, 167, 57, 0.84);
    box-shadow:
        0 0 0 5px rgba(205, 167, 57, 0.08),
        0 1rem 2.2rem rgba(0, 0, 0, 0.34);
}

.avatar-account-preview--fallback[b-wtmqahb78z] {
    display: grid;
    place-items: center;
    color: #ffe08a;
    font-family: var(--vx-font-mono);
    font-size: 2.4rem;
    font-weight: 900;
}

.avatar-account-meta[b-wtmqahb78z] {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(7rem, 0.7fr) minmax(0, 1.3fr);
    gap: 0.35rem 0.8rem;
    font-size: 0.86rem;
}

.avatar-account-meta span[b-wtmqahb78z] {
    color: var(--vx-copy-green);
}

.avatar-upload-box[b-wtmqahb78z] {
    display: grid;
    width: 100%;
    gap: 0.75rem;
}

.avatar-selected-file[b-wtmqahb78z] {
    display: flex;
    padding: 0.75rem;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    background: rgba(232, 181, 63, 0.05);
    font-size: 0.86rem;
}

.avatar-selected-file span[b-wtmqahb78z] {
    overflow-wrap: anywhere;
}

@media (max-width: 850px) {
    .avatar-account-grid[b-wtmqahb78z] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Account/Pages/Manage/ChangePassword.razor.rz.scp.css */
/*
 * MATRIXARENA v20.14 – Passwortregeln im Matrix-/Carbon-Design
 * Scoped CSS: wirkt ausschließlich auf die Passwortänderungsseite.
 */

.password-policy-hint[b-b1b35o3ikd] {
    position: relative;
    overflow: hidden;
    padding: 0.95rem 1rem 1rem;
    color: #f1ebdc;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-left: 3px solid var(--vx-matrix, #e8b53f);
    border-radius: 0.4rem;
    background:
        linear-gradient(145deg, rgba(232, 181, 63, 0.075), transparent 38%),
        linear-gradient(180deg, rgba(18, 15, 8, 0.97), rgba(3, 9, 6, 0.94));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.025),
        0 10px 28px rgba(0, 0, 0, 0.24),
        0 0 24px rgba(232, 181, 63, 0.07);
    backdrop-filter: blur(5px);
}

.password-policy-hint[b-b1b35o3ikd]::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 1px;
    content: "";
    background: linear-gradient(
        90deg,
        rgba(178, 15, 31, 0.8),
        rgba(232, 181, 63, 0.86) 48%,
        transparent
    );
}

.password-policy-hint__heading[b-b1b35o3ikd] {
    display: grid;
    margin-bottom: 0.62rem;
    gap: 0.14rem;
}

.password-policy-hint__heading strong[b-b1b35o3ikd] {
    color: var(--vx-matrix-bright, #ffe08a);
    font-size: 0.98rem;
    font-weight: 700;
    text-shadow: 0 0 14px rgba(232, 181, 63, 0.18);
}

.password-policy-hint__eyebrow[b-b1b35o3ikd] {
    color: var(--vx-copy-green, #e8cfae);
    font-family: var(--vx-font-mono, "Cascadia Mono", Consolas, monospace);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.11em;
}

.password-policy-hint ul[b-b1b35o3ikd] {
    margin-bottom: 0.75rem !important;
    color: #e4e0d5;
}

.password-policy-hint li[b-b1b35o3ikd] {
    margin-bottom: 0.18rem;
    line-height: 1.42;
}

.password-policy-hint li[b-b1b35o3ikd]::marker {
    color: var(--vx-matrix, #e8b53f);
}

.password-policy-hint__line[b-b1b35o3ikd] {
    padding-top: 0.52rem;
    line-height: 1.42;
    border-top: 1px solid rgba(232, 181, 63, 0.14);
}

.password-policy-hint__line + .password-policy-hint__line[b-b1b35o3ikd] {
    margin-top: 0.48rem;
}

.password-policy-hint__line strong[b-b1b35o3ikd] {
    color: var(--vx-matrix-bright, #ffe08a);
}

.password-policy-hint__line--warning[b-b1b35o3ikd] {
    color: #eadabf;
    border-top-color: rgba(232, 166, 75, 0.2);
}

.password-policy-hint__line--warning strong[b-b1b35o3ikd] {
    color: var(--vx-warning, #e8a64b);
}

@media (max-width: 520px) {
    .password-policy-hint[b-b1b35o3ikd] {
        padding: 0.85rem 0.9rem 0.9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .password-policy-hint[b-b1b35o3ikd] {
        backdrop-filter: none;
    }
}
/* /Components/Account/Pages/Manage/SetPassword.razor.rz.scp.css */
/*
 * MATRIXARENA v20.14 – Passwortregeln im Matrix-/Carbon-Design
 * Scoped CSS: wirkt ausschließlich auf die Passwort-festlegen-Seite.
 */

.password-policy-hint[b-vlti3bnzs8] {
    position: relative;
    overflow: hidden;
    padding: 0.95rem 1rem 1rem;
    color: #f1ebdc;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-left: 3px solid var(--vx-matrix, #e8b53f);
    border-radius: 0.4rem;
    background:
        linear-gradient(145deg, rgba(232, 181, 63, 0.075), transparent 38%),
        linear-gradient(180deg, rgba(18, 15, 8, 0.97), rgba(3, 9, 6, 0.94));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.025),
        0 10px 28px rgba(0, 0, 0, 0.24),
        0 0 24px rgba(232, 181, 63, 0.07);
    backdrop-filter: blur(5px);
}

.password-policy-hint[b-vlti3bnzs8]::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 1px;
    content: "";
    background: linear-gradient(
        90deg,
        rgba(178, 15, 31, 0.8),
        rgba(232, 181, 63, 0.86) 48%,
        transparent
    );
}

.password-policy-hint__heading[b-vlti3bnzs8] {
    display: grid;
    margin-bottom: 0.62rem;
    gap: 0.14rem;
}

.password-policy-hint__heading strong[b-vlti3bnzs8] {
    color: var(--vx-matrix-bright, #ffe08a);
    font-size: 0.98rem;
    font-weight: 700;
    text-shadow: 0 0 14px rgba(232, 181, 63, 0.18);
}

.password-policy-hint__eyebrow[b-vlti3bnzs8] {
    color: var(--vx-copy-green, #e8cfae);
    font-family: var(--vx-font-mono, "Cascadia Mono", Consolas, monospace);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.11em;
}

.password-policy-hint ul[b-vlti3bnzs8] {
    margin-bottom: 0.75rem !important;
    color: #e4e0d5;
}

.password-policy-hint li[b-vlti3bnzs8] {
    margin-bottom: 0.18rem;
    line-height: 1.42;
}

.password-policy-hint li[b-vlti3bnzs8]::marker {
    color: var(--vx-matrix, #e8b53f);
}

.password-policy-hint__line[b-vlti3bnzs8] {
    padding-top: 0.52rem;
    line-height: 1.42;
    border-top: 1px solid rgba(232, 181, 63, 0.14);
}

.password-policy-hint__line + .password-policy-hint__line[b-vlti3bnzs8] {
    margin-top: 0.48rem;
}

.password-policy-hint__line strong[b-vlti3bnzs8] {
    color: var(--vx-matrix-bright, #ffe08a);
}

.password-policy-hint__line--warning[b-vlti3bnzs8] {
    color: #eadabf;
    border-top-color: rgba(232, 166, 75, 0.2);
}

.password-policy-hint__line--warning strong[b-vlti3bnzs8] {
    color: var(--vx-warning, #e8a64b);
}

@media (max-width: 520px) {
    .password-policy-hint[b-vlti3bnzs8] {
        padding: 0.85rem 0.9rem 0.9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .password-policy-hint[b-vlti3bnzs8] {
        backdrop-filter: none;
    }
}
/* /Components/Account/Pages/Register.razor.rz.scp.css */
/*
 * MATRIXARENA v20.6 – Passwortregeln im Matrix-/Carbon-Design
 * Scoped CSS: wirkt ausschließlich auf die Registrierungsseite.
 */

.password-policy-hint[b-oa5yip1kub] {
    position: relative;
    overflow: hidden;
    padding: 0.95rem 1rem 1rem;
    color: #f1ebdc;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-left: 3px solid var(--vx-matrix, #e8b53f);
    border-radius: 0.4rem;
    background:
        linear-gradient(145deg, rgba(232, 181, 63, 0.075), transparent 38%),
        linear-gradient(180deg, rgba(18, 15, 8, 0.97), rgba(3, 9, 6, 0.94));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.025),
        0 10px 28px rgba(0, 0, 0, 0.24),
        0 0 24px rgba(232, 181, 63, 0.07);
    backdrop-filter: blur(5px);
}

.password-policy-hint[b-oa5yip1kub]::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 1px;
    content: "";
    background: linear-gradient(
        90deg,
        rgba(178, 15, 31, 0.8),
        rgba(232, 181, 63, 0.86) 48%,
        transparent
    );
}

.password-policy-hint__heading[b-oa5yip1kub] {
    display: grid;
    margin-bottom: 0.62rem;
    gap: 0.14rem;
}

.password-policy-hint__heading strong[b-oa5yip1kub] {
    color: var(--vx-matrix-bright, #ffe08a);
    font-size: 0.98rem;
    font-weight: 700;
    text-shadow: 0 0 14px rgba(232, 181, 63, 0.18);
}

.password-policy-hint__eyebrow[b-oa5yip1kub] {
    color: var(--vx-copy-green, #e8cfae);
    font-family: var(--vx-font-mono, "Cascadia Mono", Consolas, monospace);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.11em;
}

.password-policy-hint ul[b-oa5yip1kub] {
    margin-bottom: 0.75rem !important;
    color: #e4e0d5;
}

.password-policy-hint li[b-oa5yip1kub] {
    margin-bottom: 0.18rem;
    line-height: 1.42;
}

.password-policy-hint li[b-oa5yip1kub]::marker {
    color: var(--vx-matrix, #e8b53f);
}

.password-policy-hint__line[b-oa5yip1kub] {
    padding-top: 0.52rem;
    line-height: 1.42;
    border-top: 1px solid rgba(232, 181, 63, 0.14);
}

.password-policy-hint__line + .password-policy-hint__line[b-oa5yip1kub] {
    margin-top: 0.48rem;
}

.password-policy-hint__line strong[b-oa5yip1kub] {
    color: var(--vx-matrix-bright, #ffe08a);
}

.password-policy-hint__line--warning[b-oa5yip1kub] {
    color: #eadabf;
    border-top-color: rgba(232, 166, 75, 0.2);
}

.password-policy-hint__line--warning strong[b-oa5yip1kub] {
    color: var(--vx-warning, #e8a64b);
}

@media (max-width: 520px) {
    .password-policy-hint[b-oa5yip1kub] {
        padding: 0.85rem 0.9rem 0.9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .password-policy-hint[b-oa5yip1kub] {
        backdrop-filter: none;
    }
}

/* MATRIXARENA v20.19 – Discord-ID Pflichtfeld und Hilfe-Popup */
.discord-id-field[b-oa5yip1kub] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2.85rem;
    gap: 0.55rem;
    align-items: start;
}

.discord-id-field__input[b-oa5yip1kub] {
    min-width: 0;
}

.discord-id-help-button[b-oa5yip1kub] {
    display: inline-grid;
    width: 2.85rem;
    height: 3.62rem;
    place-items: center;
    color: var(--vx-matrix-bright, #ffe08a);
    font-family: var(--vx-font-mono, "Cascadia Mono", Consolas, monospace);
    font-size: 1.15rem;
    font-weight: 800;
    padding: 0;
    cursor: pointer;
    border: 1px solid rgba(232, 181, 63, 0.45);
    border-radius: 0.42rem;
    background:
        linear-gradient(145deg, rgba(232, 181, 63, 0.12), transparent 50%),
        rgba(13, 10, 4, 0.96);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.discord-id-help-button:hover[b-oa5yip1kub],
.discord-id-help-button:focus-visible[b-oa5yip1kub] {
    color: #fff;
    border-color: rgba(255, 222, 140, 0.85);
    background-color: rgba(63, 50, 18, 0.95);
}

.discord-id-field__validation[b-oa5yip1kub],
.discord-id-field__note[b-oa5yip1kub] {
    grid-column: 1 / -1;
}

.discord-id-field__note[b-oa5yip1kub] {
    margin-top: -0.15rem;
    color: var(--vx-copy-green, #e8cfae);
    font-size: 0.78rem;
    line-height: 1.35;
}

.discord-help-modal[b-oa5yip1kub] {
    position: fixed;
    z-index: 1200;
    inset: 0;
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 1rem;
    overflow: visible;
    color: inherit;
    border: 0;
    background: transparent;
}

.discord-help-modal:popover-open[b-oa5yip1kub] {
    display: grid;
    place-items: center;
}

.discord-help-modal[b-oa5yip1kub]::backdrop {
    background: rgba(0, 0, 0, 0.78);
    backdrop-filter: blur(5px);
}

.discord-help-modal__dialog[b-oa5yip1kub] {
    position: relative;
    z-index: 1;
    width: min(100%, 42rem);
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    padding: 1.1rem;
    color: #f2ece0;
    border: 1px solid rgba(232, 181, 63, 0.48);
    border-left: 3px solid var(--vx-matrix, #e8b53f);
    border-radius: 0.55rem;
    background:
        linear-gradient(145deg, rgba(232, 181, 63, 0.08), transparent 42%),
        linear-gradient(180deg, rgba(18, 15, 8, 0.99), rgba(2, 8, 5, 0.99));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.025),
        0 24px 80px rgba(0, 0, 0, 0.62),
        0 0 38px rgba(232, 181, 63, 0.09);
}

.discord-help-modal__header[b-oa5yip1kub] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.2);
}

.discord-help-modal__header h2[b-oa5yip1kub] {
    margin: 0.16rem 0 0;
    color: var(--vx-matrix-bright, #ffe08a);
    font-size: 1.25rem;
}

.discord-help-modal__eyebrow[b-oa5yip1kub] {
    color: var(--vx-copy-green, #e8cfae);
    font-family: var(--vx-font-mono, "Cascadia Mono", Consolas, monospace);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
}

.discord-help-modal__close[b-oa5yip1kub] {
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 auto;
    place-items: center;
    color: #efb0b7;
    font-size: 1.55rem;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    border: 1px solid rgba(210, 45, 63, 0.42);
    border-radius: 0.38rem;
    background: rgba(71, 12, 20, 0.42);
}

.discord-help-modal__close:hover[b-oa5yip1kub],
.discord-help-modal__close:focus-visible[b-oa5yip1kub] {
    color: #fff;
    border-color: rgba(255, 100, 115, 0.8);
}

.discord-help-modal__content[b-oa5yip1kub] {
    display: grid;
    margin: 1rem 0;
    gap: 0.75rem;
}

.discord-help-step[b-oa5yip1kub] {
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.42rem;
    background: rgba(20, 16, 5, 0.72);
}

.discord-help-step strong[b-oa5yip1kub] {
    color: var(--vx-matrix-bright, #ffe08a);
}

.discord-help-step p[b-oa5yip1kub] {
    margin: 0.48rem 0 0;
    line-height: 1.45;
}

.discord-help-warning[b-oa5yip1kub] {
    padding: 0.72rem 0.85rem;
    color: #f0d9ae;
    border: 1px solid rgba(232, 166, 75, 0.35);
    border-left: 3px solid var(--vx-warning, #e8a64b);
    border-radius: 0.4rem;
    background: rgba(70, 43, 8, 0.24);
}

.discord-help-modal__done[b-oa5yip1kub] {
    display: block;
    width: 100%;
    cursor: pointer;
}

@media (max-width: 520px) {
    .discord-id-field[b-oa5yip1kub] {
        grid-template-columns: minmax(0, 1fr) 2.55rem;
        gap: 0.42rem;
    }

    .discord-id-help-button[b-oa5yip1kub] {
        width: 2.55rem;
    }

    .discord-help-modal[b-oa5yip1kub] {
        padding: 0.65rem;
    }

    .discord-help-modal__dialog[b-oa5yip1kub] {
        max-height: calc(100vh - 1.3rem);
        padding: 0.9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .discord-help-modal[b-oa5yip1kub]::backdrop {
        backdrop-filter: none;
    }
}

/* ------------------------------------------------------------------
   Namenskonflikt bei der Registrierung: der gewuenschte Nutzername
   gehoert bereits einem uebernommenen Spieler ohne Konto.
   ------------------------------------------------------------------ */
.name-conflict[b-oa5yip1kub] {
    text-align: left;
    font-size: 0.9375rem;
}

    .name-conflict p[b-oa5yip1kub] {
        margin-bottom: 0.5rem;
    }

.name-conflict__message[b-oa5yip1kub] {
    min-height: 5rem;
}
/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.auth-page[b-z6sfku5fn8] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* ------------------------------------------------------------------
   Kopfzeile der Anmeldeseiten.

   Frueher standen hier die Klassen des MainLayout - die sind aber
   auf jenes Bauteil begrenzt und haben hier nie gegriffen, der Kopf
   war schlicht unformatiert. Deshalb eigene Klassen mit denselben
   Werten. Das Menueband darunter bringt seinen Stil selbst mit.
   ------------------------------------------------------------------ */
.auth-topbar[b-z6sfku5fn8] {
    position: sticky;
    z-index: 8;
    top: 0;
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid rgba(232, 181, 63, 0.18);
    box-shadow:
        0 1px 0 rgba(232, 181, 63, 0.07),
        0 3px 0 rgba(196, 20, 34, 0.022);
}

.auth-topbar__row[b-z6sfku5fn8] {
    display: flex;
    min-height: 3.1rem;
    padding: 0.7rem 1.75rem 0.55rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.auth-topbar__identity[b-z6sfku5fn8] {
    min-width: 0;
}

.auth-topbar__eyebrow[b-z6sfku5fn8] {
    display: block;
    margin-bottom: 0.15rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.auth-topbar__title[b-z6sfku5fn8] {
    color: #fcf8ed;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.02rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-shadow:
        0 2px 8px rgba(0, 0, 0, 1),
        0 0 12px rgba(232, 181, 63, 0.28);
}

.auth-topbar__state[b-z6sfku5fn8] {
    display: inline-flex;
    padding: 0.3rem 0.7rem;
    align-items: center;
    gap: 0.45rem;
    border-radius: 999px;
    background-color: rgba(0, 0, 0, 0.14);
    color: rgba(217, 212, 200, 0.78);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    letter-spacing: 0.06em;
    white-space: nowrap;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}

.auth-topbar__dot[b-z6sfku5fn8] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #6ee7a0;
    box-shadow: 0 0 8px rgba(110, 231, 160, 0.8);
}

.auth-main[b-z6sfku5fn8] {
    flex: 1 1 auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 2.5rem 1rem 4rem;
}

.auth-content[b-z6sfku5fn8] {
    width: 100%;
    max-width: 46rem;
}

@media (max-width: 640px) {
    .auth-topbar__row[b-z6sfku5fn8] {
        padding: 0.55rem 1rem 0.45rem;
    }

    .auth-topbar__state[b-z6sfku5fn8] {
        display: none;
    }

    .auth-main[b-z6sfku5fn8] {
        padding: 1.25rem 0.75rem 2.5rem;
    }
}
/* /Components/Layout/GameBar.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Menueband im Kopf: oberste Navigationsebene, schaltet den Bereich um.
   Gleiche Bildsprache wie der Rest der App - dunkler Grund, gruene
   Akzente, Monospace fuer die Beschriftung.
   ------------------------------------------------------------------ */
/* Ohne eigene Flaeche und ohne eigene Linie: das Band sitzt in der
   Kopfzeile, die beides schon mitbringt. Ein eigener Hintergrund lag
   als schwarzer Balken darueber. */
.game-bar[b-tcsrb7bvir] {
    display: flex;
    padding: 0 0.75rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.game-bar[b-tcsrb7bvir]::-webkit-scrollbar {
    display: none;
}

/* Zentriert, solange Platz ist. Reicht er nicht, wandert der Streifen
   an den Anfang und das Band scrollt - ohne dass etwas ausserhalb der
   Reichweite landet. */
.game-bar__inner[b-tcsrb7bvir] {
    display: flex;
    margin: 0 auto;
    align-items: stretch;
    gap: 0.35rem;
}

/* ---- Die Taste ----
   Harte Kanten, eine Fase aus vier Linien, ein Druckpunkt der sich
   bewegt. Vier Dinge machen den Eindruck aus: keine Rundung, eine Fase
   statt eines weichen Schattens, eine Bewegung beim Druecken und eine
   quadratische Leuchte statt eines runden Punkts. */
.game-bar__item[b-tcsrb7bvir] {
    position: relative;
    display: grid;
    padding: 0.4rem 0.9rem 0.36rem;
    align-content: center;
    gap: 0.02rem;

    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;

    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    text-decoration: none;
    white-space: nowrap;
    transition: color 90ms linear, background 90ms linear,
                border-color 90ms linear;
}

/* Die Rasterung und die Abnutzung liegen in retro-tasten.css, auf der
   Schicht `.retro-patina` im Markup. Hier stuenden sie nur fuer das
   Band - gebraucht werden sie auch in der Leiste und im Pult. */

.game-bar__item:hover[b-tcsrb7bvir],
.game-bar__item:focus-visible[b-tcsrb7bvir] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312727 0%, #24201a 100%);
    color: #fcf8ed;
}

/* Gedrueckt: Fase umgekehrt, Inhalt einen Punkt nach unten rechts. */
.game-bar__item:active[b-tcsrb7bvir] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    background: linear-gradient(180deg, #191612 0%, #211d18 100%);
    padding: calc(0.4rem + 1px) calc(0.9rem - 1px)
             calc(0.36rem - 1px) calc(0.9rem + 1px);
}

/* Der laufende Bereich: goldene Fase, warme Flaeche. */
.game-bar__item--active[b-tcsrb7bvir] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #3a2f16 0%, #241d0f 100%);
    color: #ffe08a;
}

.game-bar__item--active:hover[b-tcsrb7bvir] {
    background: linear-gradient(180deg, #45381a 0%, #2b2212 100%);
}

/* Kopfzeile der Taste: Leuchte, Beschriftung, gegebenenfalls Zaehler. */
.game-bar__head[b-tcsrb7bvir] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

/* Die Leuchte. Ein Quadrat, kein Kreis - Kreise sind modern; ein
   Pixelquadrat liest sich als Anzeige. */
.game-bar__led[b-tcsrb7bvir] {
    width: 0.42rem;
    height: 0.42rem;
    flex: 0 0 auto;
    background: #3a352b;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.6);
}

.game-bar__item:hover .game-bar__led[b-tcsrb7bvir] {
    background: rgba(232, 181, 63, 0.55);
    box-shadow: none;
}

.game-bar__item--active .game-bar__led[b-tcsrb7bvir] {
    background: #e8b53f;
    box-shadow: 0 0 4px rgba(232, 181, 63, 0.8);
}

/* Der Zaehler: eckiger Chip, schwarz auf Gold. */
.game-bar__count[b-tcsrb7bvir] {
    padding: 0 0.3rem;
    background: #e8b53f;
    color: #14120f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* Trennt die oeffentlichen von den internen Punkten. Rein optisch,
   deshalb aria-hidden im Markup. */
.game-bar__divider[b-tcsrb7bvir] {
    align-self: center;
    width: 2px;
    height: 1.6rem;
    margin: 0 0.45rem;
    flex: 0 0 auto;
    background: linear-gradient(180deg, #0a0907 50%, #423b30 50%);
}

/* Der breite Trenner steht vor der Verwaltung. Er ist derselbe
   Strich, nur mit mehr Luft: die Verwaltung soll sichtbar nicht mehr
   zur Reihe gehoeren, ohne dass dafuer ein zweites Bauteil noetig
   waere. */
.game-bar__divider--wide[b-tcsrb7bvir] {
    margin: 0 1.1rem;
}

/* Anmelden in Gold: das ist der einzige Weg nach innen, er soll sich
   vom Rest abheben. Seit das Band zentriert ist, steht es einfach am
   Ende der Reihe - ein "margin-left: auto" wuerde die Mitte wieder
   zerreissen. */
.game-bar__item--login[b-tcsrb7bvir] {
    border-color:
        rgba(232, 181, 63, 0.55) rgba(120, 88, 24, 0.85)
        rgba(120, 88, 24, 0.85) rgba(232, 181, 63, 0.55);
    color: #f3d079;
}

.game-bar__item--login:hover[b-tcsrb7bvir],
.game-bar__item--login:focus-visible[b-tcsrb7bvir] {
    color: #ffe6a8;
}

.game-bar__item--login .game-bar__led[b-tcsrb7bvir] {
    background: rgba(232, 181, 63, 0.7);
}

.game-bar__item--login .game-bar__label[b-tcsrb7bvir] {
    color: inherit;
}

/* ---- Die Verwaltung ----
   Kuehl statt warm. Gold traegt in diesem Band den laufenden Bereich,
   Rot den Handlungsbedarf - beides ist vergeben. Ein gedaempftes
   Stahlblau sagt: anderer Ort, kein Alarm. Die Regeln stehen vor
   `--alarm`, damit Rot auch hier gewinnt, wenn etwas liegt. */
.game-bar__item--admin[b-tcsrb7bvir] {
    border-color:
        rgba(122, 176, 200, 0.5) rgba(28, 58, 72, 0.9)
        rgba(28, 58, 72, 0.9) rgba(122, 176, 200, 0.5);
    background: linear-gradient(180deg, #1b2831 0%, #121a20 100%);
    color: #bcd8e6;
}

.game-bar__item--admin:hover[b-tcsrb7bvir],
.game-bar__item--admin:focus-visible[b-tcsrb7bvir] {
    border-color:
        rgba(151, 205, 229, 0.85) rgba(28, 58, 72, 0.95)
        rgba(28, 58, 72, 0.95) rgba(151, 205, 229, 0.85);
    background: linear-gradient(180deg, #223440 0%, #16212a 100%);
    color: #e2f2fa;
}

.game-bar__item--admin .game-bar__led[b-tcsrb7bvir] {
    background: rgba(122, 176, 200, 0.65);
}

.game-bar__item--admin .game-bar__label[b-tcsrb7bvir] {
    color: inherit;
}

.game-bar__item--admin .game-bar__note[b-tcsrb7bvir] {
    color: rgba(188, 216, 230, 0.6);
}

.game-bar__item--admin .game-bar__count[b-tcsrb7bvir] {
    background: #7ab0c8;
    color: #0e171d;
}

/* Steht man in der Verwaltung, leuchtet sie in ihrer eigenen Farbe
   weiter - nicht in Gold. Zwei Sprachen an einer Taste sagen weniger
   als eine. */
.game-bar__item--admin.game-bar__item--active[b-tcsrb7bvir] {
    border-color:
        rgba(151, 205, 229, 0.9) rgba(28, 58, 72, 0.95)
        rgba(28, 58, 72, 0.95) rgba(151, 205, 229, 0.9);
    background: linear-gradient(180deg, #26404f 0%, #16242e 100%);
    color: #e2f2fa;
}

.game-bar__item--admin.game-bar__item--active .game-bar__led[b-tcsrb7bvir] {
    background: #97cde5;
    box-shadow: 0 0 4px rgba(151, 205, 229, 0.8);
}

.game-bar__item--admin.game-bar__item--active .game-bar__label[b-tcsrb7bvir],
.game-bar__item--admin.game-bar__item--active .game-bar__note[b-tcsrb7bvir] {
    color: #e2f2fa;
}

/* ---- Die Sendung ----
   Neben dem Stahlblau der Verwaltung ein gedaempftes Violett. Die
   beiden Dienstbereiche stehen nebeneinander hinter demselben
   Trenner; haetten sie dieselbe Farbe, waere der Trenner das einzige,
   was sie unterscheidet - und der steht davor, nicht dazwischen.
   Auch diese Regeln stehen vor `--alarm`, damit Rot gewinnt. */
.game-bar__item--streamer[b-tcsrb7bvir] {
    border-color:
        rgba(178, 140, 208, 0.5) rgba(54, 32, 74, 0.9)
        rgba(54, 32, 74, 0.9) rgba(178, 140, 208, 0.5);
    background: linear-gradient(180deg, #261c33 0%, #17111f 100%);
    color: #d9c6e9;
}

.game-bar__item--streamer:hover[b-tcsrb7bvir],
.game-bar__item--streamer:focus-visible[b-tcsrb7bvir] {
    border-color:
        rgba(203, 168, 229, 0.85) rgba(54, 32, 74, 0.95)
        rgba(54, 32, 74, 0.95) rgba(203, 168, 229, 0.85);
    background: linear-gradient(180deg, #32254280 0%, #1d1528 100%);
    color: #f1e6fa;
}

.game-bar__item--streamer .game-bar__led[b-tcsrb7bvir] {
    background: rgba(178, 140, 208, 0.65);
}

.game-bar__item--streamer .game-bar__label[b-tcsrb7bvir] {
    color: inherit;
}

.game-bar__item--streamer .game-bar__note[b-tcsrb7bvir] {
    color: rgba(217, 198, 233, 0.6);
}

.game-bar__item--streamer .game-bar__count[b-tcsrb7bvir] {
    background: #b28cd0;
    color: #1a1122;
}

.game-bar__item--streamer.game-bar__item--active[b-tcsrb7bvir] {
    border-color:
        rgba(203, 168, 229, 0.9) rgba(54, 32, 74, 0.95)
        rgba(54, 32, 74, 0.95) rgba(203, 168, 229, 0.9);
    background: linear-gradient(180deg, #3a2a4d 0%, #201729 100%);
    color: #f1e6fa;
}

.game-bar__item--streamer.game-bar__item--active .game-bar__led[b-tcsrb7bvir] {
    background: #cba8e5;
    box-shadow: 0 0 4px rgba(203, 168, 229, 0.8);
}

.game-bar__item--streamer.game-bar__item--active .game-bar__label[b-tcsrb7bvir],
.game-bar__item--streamer.game-bar__item--active .game-bar__note[b-tcsrb7bvir] {
    color: #f1e6fa;
}

.game-bar__label[b-tcsrb7bvir] {
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.game-bar__item--active .game-bar__label[b-tcsrb7bvir] {
    color: #ffe08a;
}

.game-bar__note[b-tcsrb7bvir] {
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.68rem;
    letter-spacing: 0.02em;
}

.game-bar__item--active .game-bar__note[b-tcsrb7bvir] {
    color: rgba(255, 222, 140, 0.72);
}

/* ---- Handlungsbedarf ----
   Nach `--active` und nach `--admin`, damit Rot gewinnt, wenn mehreres
   zutrifft: dass etwas liegt, ist die wichtigere Nachricht als dass
   man gerade dort steht oder um welchen Bereich es geht.
   Die Leuchte glimmt langsam - schnelles Blinken zieht den Blick
   staendig weg, ein Puls im Sekundentakt meldet sich einmal und laesst
   dann arbeiten. */
.game-bar__item--alarm[b-tcsrb7bvir] {
    border-color:
        rgba(239, 38, 56, 0.75) rgba(112, 14, 22, 0.9)
        rgba(112, 14, 22, 0.9) rgba(239, 38, 56, 0.75);
    background: linear-gradient(180deg, #3a1714 0%, #241010 100%);
    color: #ffd9da;
}

.game-bar__item--alarm:hover[b-tcsrb7bvir],
.game-bar__item--alarm:focus-visible[b-tcsrb7bvir] {
    background: linear-gradient(180deg, #471c18 0%, #2c1414 100%);
    color: #fff0f0;
}

.game-bar__item--alarm .game-bar__label[b-tcsrb7bvir] {
    color: #ffd9da;
}

.game-bar__item--alarm .game-bar__led[b-tcsrb7bvir] {
    background: #ef2638;
    box-shadow: 0 0 5px rgba(239, 38, 56, 0.85);
    animation: game-bar-puls-b-tcsrb7bvir 1.8s ease-in-out infinite;
}

.game-bar__item--alarm .game-bar__count[b-tcsrb7bvir] {
    background: #ef2638;
    color: #fff4f4;
}

@keyframes game-bar-puls-b-tcsrb7bvir {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* Wer Bewegung abgestellt hat, bekommt die Leuchte ruhig - die Farbe
   sagt dasselbe. */
@media (prefers-reduced-motion: reduce) {
    .game-bar__item--alarm .game-bar__led[b-tcsrb7bvir] {
        animation: none;
    }
}

@media (max-width: 575.98px) {
    .game-bar__item[b-tcsrb7bvir] {
        padding: 0.36rem 0.62rem 0.32rem;
    }

    .game-bar__item:active[b-tcsrb7bvir] {
        padding: calc(0.36rem + 1px) calc(0.62rem - 1px)
                 calc(0.32rem - 1px) calc(0.62rem + 1px);
    }

    .game-bar__note[b-tcsrb7bvir] {
        display: none;
    }
}

/* ------------------------------------------------------------------
   Schmale Geraete: die Tasten stehen untereinander.
   ------------------------------------------------------------------
   Nebeneinander muss das Band auf einem Telefon seitwaerts gescrollt
   werden - und was rechts aus dem Bild laeuft, findet niemand. Als
   Spalte ist jeder Punkt sofort sichtbar und trifft sich mit dem
   Daumen.

   Damit die Kopfzeile davon nicht halbseitenlang wird, sitzt die
   Spalte eng und flach: etwa drei Tasten sind zu sehen, der Rest
   scrollt in ihr selbst. Der Rollbalken bleibt
   hier sichtbar - anders als beim waagerechten Band, wo er nur
   gestoert haette. Er ist der einzige Hinweis, dass unten noch etwas
   steht.
   ------------------------------------------------------------------ */
@media (max-width: 640.98px) {
    .game-bar[b-tcsrb7bvir] {
        /* Drei Tasten hoch. Eine Taste misst rund 1,8rem (Schrift
           0,76 x 1,35 Zeilenhoehe, 0,5 Innenabstand, 2x2px Fase),
           dazu zwei Luecken und der Innenabstand des Bandes. Wer mehr
           will, scrollt - der Rest der Seite ist wichtiger als das
           Menue. */
        max-height: 6.6rem;
        padding: 0.4rem 0.85rem 0.5rem;
        overflow-x: visible;
        overflow-y: auto;
        scrollbar-width: thin;
        overscroll-behavior: contain;
    }

    .game-bar[b-tcsrb7bvir]::-webkit-scrollbar {
        display: block;
        width: 5px;
    }

    .game-bar[b-tcsrb7bvir]::-webkit-scrollbar-thumb {
        background: rgba(232, 181, 63, 0.35);
    }

    .game-bar__inner[b-tcsrb7bvir] {
        width: 100%;
        flex-direction: column;
        margin: 0;
        gap: 0.14rem;
    }

    .game-bar__item[b-tcsrb7bvir] {
        /* Eng gesetzt: die Zeile traegt nur Leuchte und Beschriftung,
           mehr braucht sie in der Spalte nicht. */
        padding: 0.26rem 0.6rem 0.24rem;
        justify-content: start;
        white-space: normal;
    }

    .game-bar__item:active[b-tcsrb7bvir] {
        padding: calc(0.26rem + 1px) calc(0.6rem - 1px)
                 calc(0.24rem - 1px) calc(0.6rem + 1px);
    }

    /* Der Beisatz kostet pro Taste eine ganze Zeile. In der Spalte
       steht die Beschriftung ohnehin fuer sich. */
    .game-bar__note[b-tcsrb7bvir] {
        display: none;
    }

    .game-bar__label[b-tcsrb7bvir] {
        font-size: 0.76rem;
        line-height: 1.35;
    }

    /* Der Trenner legt sich quer und faellt schmal aus. */
    .game-bar__divider[b-tcsrb7bvir] {
        width: auto;
        height: 2px;
        margin: 0.22rem 0;
        align-self: stretch;
    }

    /* In der Spalte wird aus dem breiteren Abstand ein hoeherer. */
    .game-bar__divider--wide[b-tcsrb7bvir] {
        margin: 0.5rem 0;
    }
}
/* /Components/Layout/LegalFooter.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Fusszeile. Bewusst schmal und leise - sie muss da sein und
   auffindbar, aber nichts an sich ziehen.
   ------------------------------------------------------------------ */

.site-footer[b-glk9frnknn] {
    margin-top: 2.5rem;
    padding: 0.9rem 0 1.1rem;
    border-top: 1px solid rgba(232, 181, 63, 0.16);
}

.site-footer__inner[b-glk9frnknn] {
    display: flex;
    padding: 0 clamp(1rem, 3vw, 3.2rem);
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem 1.2rem;
}

.site-footer__brand[b-glk9frnknn] {
    color: rgba(232, 181, 63, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.16em;
}

.site-footer__links[b-glk9frnknn] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
}

.site-footer__links a[b-glk9frnknn] {
    color: rgba(217, 212, 200, 0.7);
    text-decoration: none;
}

.site-footer__links a:hover[b-glk9frnknn],
.site-footer__links a:focus-visible[b-glk9frnknn] {
    color: #f3d079;
    text-decoration: underline;
}

.site-footer__sep[b-glk9frnknn] {
    color: rgba(217, 212, 200, 0.3);
}

@media (max-width: 480px) {
    .site-footer__inner[b-glk9frnknn] {
        justify-content: center;
        text-align: center;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-sjrxeehtxt] {
    position: relative;
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

main[b-sjrxeehtxt] {
    position: relative;
    min-width: 0;
    flex: 1;
}

main[b-sjrxeehtxt]::before {
    position: fixed;
    z-index: -1;
    top: 0;
    right: 0;
    width: 42vw;
    height: 42vw;
    content: "";
    opacity: 0.38;
    background:
        radial-gradient(
            circle,
            rgba(196, 20, 34, 0.16),
            transparent 68%
        );
    filter: blur(10px);
}

.sidebar[b-sjrxeehtxt] {
    position: relative;
    z-index: 10;
    border-right: 1px solid rgba(232, 181, 63, 0.27);
    background:
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.022),
            transparent 42%
        ),
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.030) 0,
            rgba(232, 181, 63, 0.030) 2px,
            transparent 2px,
            transparent 8px
        ),
        linear-gradient(
            180deg,
            #17191b,
            #0a0b0c 75%
        );
    box-shadow:
        8px 0 34px rgba(0, 0, 0, 0.5),
        2px 0 0 rgba(232, 181, 63, 0.17);
}

.matrix-topbar[b-sjrxeehtxt] {
    position: sticky;
    z-index: 20;
    top: 0;
    display: flex;
    min-height: 4.5rem;
    padding: 0.7rem 1.75rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.24);

    /* Grundflaeche. Die Kopfzeile bleibt durchsichtig - weiter unten
       ueberschreiben zwei Bloecke das per !important, damit der
       Matrix-Regen durchlaeuft. Dass der Inhalt trotzdem nicht durch
       sie hindurchwandert, regelt nicht die Farbe, sondern der
       Hauptrahmen am Dateiende. */
    background:
        linear-gradient(
            90deg,
            rgb(10, 11, 12),
            rgb(24, 26, 28)
        );
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
}

.matrix-topbar__identity[b-sjrxeehtxt] {
    min-width: 0;
}

.matrix-topbar__eyebrow[b-sjrxeehtxt] {
    display: block;
    margin-bottom: 0.15rem;
    color: #e8b53f;
    font-family:
        "Cascadia Mono",
        "Consolas",
        monospace;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

/* Der Streifen der Testkopie.
   Rot, weil er eine Warnung ist und keine Zierde: wer ihn sieht, soll
   wissen, dass hier nichts zaehlt, was er eintraegt. Steht nur, wenn
   App:Instanz gesetzt ist - die echte Arena traegt ihn nie. */
.matrix-topbar__instanz[b-sjrxeehtxt] {
    display: inline-block;
    margin-top: 0.15rem;
    padding: 0.05rem 0.4rem;
    border: 1px solid rgba(217, 83, 79, 0.75);
    background: rgba(217, 83, 79, 0.18);
    color: #ff9b8a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.56rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    white-space: nowrap;
}

.matrix-topbar__title[b-sjrxeehtxt] {
    overflow: hidden;
    color: #ececec;
    font-family:
        "Cascadia Mono",
        "Consolas",
        monospace;
    font-size: clamp(0.78rem, 2vw, 1rem);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.matrix-system-state[b-sjrxeehtxt] {
    display: inline-flex;
    flex: 0 0 auto;
    padding: 0.48rem 0.7rem;
    align-items: center;
    gap: 0.5rem;
    color: #b7b9ba;
    border: 1px solid rgba(232, 181, 63, 0.24);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.25);
    font-family:
        "Cascadia Mono",
        "Consolas",
        monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.matrix-state-dot[b-sjrxeehtxt] {
    width: 0.52rem;
    height: 0.52rem;
    border-radius: 50%;
    background: #d11a2a;
    box-shadow:
        0 0 0 3px rgba(209, 26, 42, 0.12),
        0 0 13px rgba(239, 38, 56, 0.72);
}

.content[b-sjrxeehtxt] {
    position: relative;
    padding-top: 2rem !important;
    padding-bottom: 4rem !important;
}

#blazor-error-ui[b-sjrxeehtxt] {
    position: fixed;
    z-index: 10000;
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    display: none;
    box-sizing: border-box;
    padding: 0.85rem 3rem 0.85rem 1rem;
    color: #ffe7e9;
    border: 1px solid #ef2638;
    border-radius: 0.3rem;
    background:
        linear-gradient(
            90deg,
            rgba(111, 7, 19, 0.98),
            rgba(32, 6, 10, 0.98)
        );
    box-shadow:
        0 18px 48px rgba(0, 0, 0, 0.55),
        0 0 22px rgba(239, 38, 56, 0.2);
    font-family:
        "Cascadia Mono",
        "Consolas",
        monospace;
}

#blazor-error-ui .reload[b-sjrxeehtxt] {
    margin-left: 0.6rem;
    color: #ffe08a;
    font-weight: 700;
}

#blazor-error-ui .dismiss[b-sjrxeehtxt] {
    position: absolute;
    top: 0.62rem;
    right: 0.8rem;
    cursor: pointer;
    color: #fff;
    font-size: 1.1rem;
}

@media (max-width: 640.98px) {
    .matrix-topbar[b-sjrxeehtxt] {
        min-height: 3.8rem;
        padding: 0.55rem 4.7rem 0.55rem 1rem;
    }

    .matrix-system-state[b-sjrxeehtxt] {
        display: none;
    }

    .content[b-sjrxeehtxt] {
        padding-top: 1.35rem !important;
    }
}

@media (min-width: 641px) {
    .page[b-sjrxeehtxt] {
        flex-direction: row;
    }

    .sidebar[b-sjrxeehtxt] {
        position: sticky;
        top: 0;
        width: 236px;
        height: 100vh;
        flex: 0 0 236px;
    }

    main[b-sjrxeehtxt] {
        width: calc(100% - 236px);
    }

    article[b-sjrxeehtxt] {
        padding-right: clamp(1.5rem, 4vw, 4.5rem) !important;
        padding-left: clamp(1.5rem, 4vw, 4.5rem) !important;
    }
}


/* ================================================================
   MATRIXARENA v16.2 – Menü/Kopf glasklar, Hauptschirm Vollbild
   ================================================================ */

.page[b-sjrxeehtxt] {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    min-height: 100dvh;
    background-color: transparent !important;
    background-image: none !important;
}

main[b-sjrxeehtxt] {
    position: relative;
    width: 100% !important;
    max-width: none !important;
    min-height: 100vh;
    min-height: 100dvh;
    background-color: transparent !important;
    background-image: none !important;
}

main[b-sjrxeehtxt]::before,
main[b-sjrxeehtxt]::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/*
 * Wichtig: kein Hintergrundbild, keine Carbon-Kachel und kein Blur.
 * Der Canvas scheint unverändert durch die Sidebar.
 */
.sidebar[b-sjrxeehtxt] {
    border-right: 1px solid rgba(232, 181, 63, 0.22);
    background-color: transparent !important;
    background-image: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow:
        1px 0 0 rgba(232, 181, 63, 0.11),
        3px 0 0 rgba(196, 20, 34, 0.03) !important;
}

.sidebar[b-sjrxeehtxt]::before,
.sidebar[b-sjrxeehtxt]::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* Auch die Kopfzeile hat keinerlei eigene Fläche. */
.matrix-topbar[b-sjrxeehtxt] {
    border-bottom: 1px solid rgba(232, 181, 63, 0.18);
    background-color: transparent !important;
    background-image: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow:
        0 1px 0 rgba(232, 181, 63, 0.07),
        0 3px 0 rgba(196, 20, 34, 0.022) !important;
}

.matrix-topbar[b-sjrxeehtxt]::before,
.matrix-topbar[b-sjrxeehtxt]::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

.matrix-topbar__title[b-sjrxeehtxt],
.matrix-topbar__eyebrow[b-sjrxeehtxt] {
    text-shadow:
        0 2px 8px rgba(0, 0, 0, 1),
        0 0 12px rgba(232, 181, 63, 0.28);
}

.matrix-system-state[b-sjrxeehtxt] {
    background-color: rgba(0, 0, 0, 0.14);
    background-image: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.4);
}

article.content[b-sjrxeehtxt] {
    box-sizing: border-box;
    width: 100%;
    max-width: none !important;
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0 !important;
    background-color: transparent !important;
    background-image: none !important;
}

.content[b-sjrxeehtxt]::before,
.content[b-sjrxeehtxt]::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

@media (max-width: 640.98px) {
    .sidebar[b-sjrxeehtxt] {
        width: 100%;
        min-height: 0;
    }

    .matrix-topbar[b-sjrxeehtxt] {
        position: sticky;
        top: 0;
        min-height: 3.8rem;
        padding:
            0.55rem
            4.7rem
            0.55rem
            1rem;
    }

    article.content[b-sjrxeehtxt] {
        padding:
            1.15rem
            clamp(0.75rem, 3.5vw, 1.2rem)
            2.5rem !important;
    }
}

@media (min-width: 641px) {
    .sidebar[b-sjrxeehtxt] {
        position: fixed;
        z-index: 30;
        top: 0;
        bottom: 0;
        left: 0;
        width: 236px;
        height: 100vh;
        height: 100dvh;
        flex: none;
    }

    .matrix-topbar[b-sjrxeehtxt] {
        position: fixed;
        z-index: 25;
        top: 0;
        right: 0;
        left: 236px;
        min-height: 4.5rem;
    }

    article.content[b-sjrxeehtxt] {
        padding:
            calc(4.5rem + clamp(1.1rem, 2.2vw, 2.2rem))
            clamp(1rem, 3vw, 3.2rem)
            clamp(2rem, 5vw, 4.5rem)
            calc(236px + clamp(1rem, 3vw, 3.2rem)) !important;
    }
}

@media (min-width: 1800px) {
    article.content[b-sjrxeehtxt] {
        padding-right: clamp(2rem, 4vw, 5.5rem) !important;
        padding-left:
            calc(236px + clamp(2rem, 4vw, 5.5rem)) !important;
    }
}

/* ================================================================
   MATRIXARENA v16.3 – Matrix sichtbar in Kopf und linker Navigation
   ================================================================ */

.page[b-sjrxeehtxt],
.page > main[b-sjrxeehtxt],
article.content[b-sjrxeehtxt] {
    background-color: transparent !important;
    background-image: none !important;
}

/*
 * Nur eine sehr leichte Lesbarkeits-Tönung. Der Matrix-Canvas bleibt in der
 * kompletten Sidebar, einschließlich Marken-Kopf, deutlich sichtbar.
 */
.sidebar[b-sjrxeehtxt] {
    background-color: rgba(1, 6, 3, 0.10) !important;
    background-image:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.025),
            rgba(0, 0, 0, 0.045) 72%,
            rgba(196, 20, 34, 0.018)
        ) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Auch hinter Elo Control Matrix und Systemstatus läuft derselbe Canvas. */
.matrix-topbar[b-sjrxeehtxt] {
    background-color: rgba(1, 6, 3, 0.08) !important;
    background-image:
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.025),
            rgba(232, 181, 63, 0.018) 58%,
            rgba(196, 20, 34, 0.016)
        ) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.matrix-topbar__identity[b-sjrxeehtxt],
.matrix-system-state[b-sjrxeehtxt] {
    position: relative;
    z-index: 1;
}

.matrix-topbar__title[b-sjrxeehtxt] {
    text-shadow:
        0 2px 5px rgba(0, 0, 0, 1),
        0 0 10px rgba(0, 0, 0, 0.92),
        0 0 15px rgba(232, 181, 63, 0.34);
}

.matrix-system-state[b-sjrxeehtxt] {
    border-color: rgba(232, 181, 63, 0.32);
    background: rgba(0, 0, 0, 0.24) !important;
}


/* ------------------------------------------------------------------
   Menueband im Kopf: oberste Navigationsebene, schaltet den Bereich um.
   Bewusst hier und nicht in einer eigenen isolierten Datei - das Band
   gehoert zum Layout und teilt sich dessen Geltungsbereich.
   ------------------------------------------------------------------ */
/* Die Kopfzeile wird zweizeilig: oben Titel und Status, darunter das
   Band. So erbt es Position und linken Versatz der Kopfzeile und kann
   nicht mehr eigenstaendig verrutschen. */
.matrix-topbar--stacked[b-sjrxeehtxt] {
    align-items: stretch;
    flex-direction: column;
    padding-bottom: 0;
    gap: 0;
}

.matrix-topbar__row[b-sjrxeehtxt] {
    display: flex;
    min-height: 3.1rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.game-bar[b-sjrxeehtxt] {
    display: flex;
    align-items: stretch;
    gap: 0.35rem;
    /* Das Padding der Kopfzeile ausgleichen, damit das Band ueber die
       volle Breite laeuft. */
    margin: 0 -1.75rem;
    padding: 0 1.75rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.game-bar[b-sjrxeehtxt]::-webkit-scrollbar {
    display: none;
}

.game-bar__item[b-sjrxeehtxt] {
    display: grid;
    padding: 0.55rem 1.1rem 0.5rem;
    align-content: center;
    gap: 0.08rem;
    border-bottom: 2px solid transparent;
    color: #d9d4c8;
    text-decoration: none;
    white-space: nowrap;
    transition: color 120ms ease, background 120ms ease;
}

.game-bar__item:hover[b-sjrxeehtxt],
.game-bar__item:focus-visible[b-sjrxeehtxt] {
    color: #fcf8ed;
    background: rgba(232, 181, 63, 0.07);
    text-decoration: none;
}

.game-bar__item--active[b-sjrxeehtxt] {
    border-bottom-color: #e8b53f;
    background:
        linear-gradient(
            180deg,
            rgba(232, 181, 63, 0.13),
            rgba(232, 181, 63, 0.02)
        );
    color: #fcf8ed;
}

.game-bar__label[b-sjrxeehtxt] {
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    line-height: 1.25;
    text-transform: uppercase;
}

.game-bar__item--active .game-bar__label[b-sjrxeehtxt] {
    color: #ffe08a;
}

.game-bar__note[b-sjrxeehtxt] {
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.66rem;
    line-height: 1.2;
}

.game-bar__item--active .game-bar__note[b-sjrxeehtxt] {
    color: rgba(255, 222, 140, 0.72);
}

@media (max-width: 575.98px) {
    .game-bar[b-sjrxeehtxt] {
        margin: 0 -1.1rem;
        padding: 0 1.1rem;
    }

    .game-bar__item[b-sjrxeehtxt] {
        padding: 0.5rem 0.7rem 0.45rem;
    }

    .game-bar__note[b-sjrxeehtxt] {
        display: none;
    }
}


/* ================================================================
   MATRIXARENA v16.4 – Der Hauptrahmen scrollt, nicht das Fenster
   ================================================================
   Der Kern des Problems: eine Kopfzeile, die stehen bleibt, liegt
   ueber dem Inhalt. Ist sie durchsichtig, wandert der gescrollte
   Inhalt sichtbar durch sie hindurch und wird an ihrer Oberkante
   abgeschnitten. Deckend machen loest das - kostet aber den Regen.

   Also andersherum: das Fenster scrollt gar nicht mehr. `.page`
   spannt genau einen Bildschirm auf, `main` steht darin fest und ist
   eine Spalte aus zwei Teilen -
   oben die Kopfzeile in normaler Lage, darunter `.mainframe` als
   eigene Scrollflaeche. Der Inhalt wird jetzt an der Oberkante des
   Rahmens abgeschnitten, und ueber dieser Kante liegt nichts mehr
   ausser dem Canvas. Die Kopfzeile darf durchsichtig bleiben, weil
   nichts mehr hinter ihr durchlaeuft.

   Deshalb braucht `article.content` hier auch keinen Vorschub mehr
   fuer Kopfzeile und Seitenleiste: der Rahmen steht schon an der
   richtigen Stelle.
   ================================================================ */

.mainframe[b-sjrxeehtxt] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.mainframe:focus[b-sjrxeehtxt] {
    /* Der Rahmen bekommt beim Seitenwechsel den Fokus, damit Bild-ab
       und die Pfeiltasten ihn scrollen. Ein Rahmen um den halben
       Bildschirm soll das aber nicht anzeigen. */
    outline: none;
}

@media (min-width: 641px) {
    /* Der feste Rahmen der Seite. Er muss hier liegen und nicht an
       `main`: ein Element mit `position: fixed` bildet immer einen
       eigenen Stapelkontext, und alles darin bleibt unter allem, was
       daneben hoeher liegt - die Seitenleiste steht auf z-index 30,
       ein Popup mit z-index 1400 verschwand dadurch unter ihr. `.page`
       ist ohnehin schon der Kontext; `main` haengt jetzt nur noch
       absolut darin und bildet keinen eigenen. */
    .page[b-sjrxeehtxt] {
        height: 100vh;
        height: 100dvh;
        overflow: hidden;
    }

    main[b-sjrxeehtxt] {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 236px;
        display: flex;
        width: auto !important;
        min-height: 0;
        flex-direction: column;
    }

    /* Ohne Seitenleiste faengt der Hauptteil ganz links an. */
    .page--public main[b-sjrxeehtxt] {
        left: 0;
    }

    /* Die Kopfzeile steht wieder in der normalen Lage. Sie bleibt
       oben, weil `main` selbst nicht scrollt - nicht, weil sie
       ueber dem Inhalt klebt. */
    .matrix-topbar[b-sjrxeehtxt] {
        position: relative;
        z-index: 25;
        top: auto;
        right: auto;
        left: auto;
        flex: 0 0 auto;
    }

    .mainframe[b-sjrxeehtxt] {
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    article.content[b-sjrxeehtxt] {
        flex: 1 0 auto;
        min-height: 0;
        padding:
            clamp(1.1rem, 2.2vw, 2.2rem)
            clamp(1rem, 3vw, 3.2rem)
            clamp(2rem, 5vw, 4.5rem) !important;
    }
}

@media (min-width: 1800px) {
    article.content[b-sjrxeehtxt] {
        padding-right: clamp(2rem, 4vw, 5.5rem) !important;
        padding-left: clamp(2rem, 4vw, 5.5rem) !important;
    }
}

/* Auf schmalen Geraeten steht die Navigation als Block ueber dem
   Hauptteil; ein festgesetzter `main` wuerde sie verdecken. Dort
   scrollt weiter das Fenster - dafuer laeuft die Kopfzeile mit nach
   oben weg, statt durchsichtig ueber dem Inhalt zu haengen. */
@media (max-width: 640.98px) {
    .matrix-topbar[b-sjrxeehtxt] {
        position: relative;
        top: auto;
        /* Den reservierten Streifen rechts nur noch dort lassen, wo er
           gebraucht wird - siehe naechste Regel. */
        padding-right: 1rem;
    }

    /* Platz fuer den Menue-Schalter braucht nur die Titelzeile. Das
       Tastenband darunter steht als Spalte und soll die volle Breite
       haben; sonst blieben rechts fast fuenf Zentimeter leer. */
    .matrix-topbar__row[b-sjrxeehtxt] {
        padding-right: 3.7rem;
    }

    article.content[b-sjrxeehtxt] {
        min-height: 0;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-xd3xl411vv] {
    position: absolute;
    z-index: 50;
    top: 0.62rem;
    right: 0.8rem;
    width: 3rem;
    height: 2.5rem;
    appearance: none;
    cursor: pointer;
    color: white;
    border: 1px solid rgba(232, 181, 63, 0.44);
    border-radius: 0.25rem;
    background:
        url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23e8b53f' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
        no-repeat center/1.55rem
        rgba(9, 10, 11, 0.86);
    box-shadow: 0 0 16px rgba(196, 20, 34, 0.13);
}

.navbar-toggler:checked[b-xd3xl411vv] {
    border-color: #ef2638;
    background-color: rgba(112, 8, 18, 0.94);
}

.top-row[b-xd3xl411vv] {
    position: relative;
    min-height: 4.5rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.24);
    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(196, 20, 34, 0.2),
            transparent 42%
        ),
        rgba(0, 0, 0, 0.3);
}

.top-row[b-xd3xl411vv]::after {
    position: absolute;
    right: 0.9rem;
    bottom: -1px;
    left: 0.9rem;
    height: 1px;
    content: "";
    background:
        linear-gradient(
            90deg,
            transparent,
            #c41422,
            #e8b53f,
            transparent
        );
}

.navbar-brand[b-xd3xl411vv] {
    display: flex;
    flex-direction: column;
    color: #f3f3f3 !important;
    font-family:
        "Cascadia Mono",
        "Consolas",
        monospace;
    font-size: 0.96rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1.1;
    text-transform: uppercase;
    text-shadow: 0 0 18px rgba(196, 20, 34, 0.18);
}

.navbar-brand[b-xd3xl411vv]::before {
    margin-bottom: 0.24rem;
    color: #ef2638;
    content: "MATRIXARENA // MATRIX";
    font-size: 0.56rem;
    font-weight: 800;
    letter-spacing: 0.17em;
}

.navbar-brand[b-xd3xl411vv]::after {
    margin-top: 0.25rem;
    color: #e8b53f;
    content: "TACTICAL RATING NETWORK";
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 0.1em;
}

.nav-scrollable[b-xd3xl411vv] {
    display: none;
    padding: 0.55rem 0 0.8rem;
}

.navbar-toggler:checked ~ .nav-scrollable[b-xd3xl411vv] {
    display: block;
}

.nav-item[b-xd3xl411vv] {
    padding-bottom: 0.22rem;
    font-size: 0.9rem;
}

.nav-item:first-of-type[b-xd3xl411vv] {
    padding-top: 0.2rem;
}

.nav-item:last-of-type[b-xd3xl411vv] {
    padding-bottom: 1rem;
}

.nav-item[b-xd3xl411vv]  .nav-link {
    position: relative;
    display: flex;
    min-height: 2.48rem;
    padding: 0.52rem 0.62rem;
    align-items: center;
    overflow: hidden;
    color: #b9bbbd;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    background: transparent;
    font-family:
        "Cascadia Mono",
        "Consolas",
        monospace;
    font-size: 0.71rem;
    font-weight: 700;
    letter-spacing: 0.035em;
    line-height: 1.25;
    text-decoration: none;
    text-transform: uppercase;
    transition:
        color 130ms ease,
        border-color 130ms ease,
        background-color 130ms ease,
        transform 130ms ease;
}

.nav-item[b-xd3xl411vv]  .nav-link::before {
    width: 0.36rem;
    height: 0.36rem;
    margin-right: 0.56rem;
    flex: 0 0 auto;
    content: "";
    transform: rotate(45deg);
    border: 1px solid #8d9396;
    background: transparent;
    transition:
        border-color 130ms ease,
        background-color 130ms ease,
        box-shadow 130ms ease;
}

.nav-item[b-xd3xl411vv]  .nav-link:hover {
    color: #ffe08a;
    border-color: rgba(232, 181, 63, 0.22);
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.09),
            transparent
        );
    transform: translateX(2px);
}

.nav-item[b-xd3xl411vv]  .nav-link:hover::before {
    border-color: #e8b53f;
    box-shadow: 0 0 10px rgba(232, 181, 63, 0.38);
}

.nav-item[b-xd3xl411vv]  a.active {
    color: #fff;
    border-color: rgba(239, 38, 56, 0.34);
    background:
        linear-gradient(
            90deg,
            rgba(196, 20, 34, 0.64),
            rgba(112, 8, 18, 0.22) 62%,
            transparent
        );
    box-shadow:
        inset 3px 0 0 #ef2638,
        0 0 18px rgba(196, 20, 34, 0.08);
}

.nav-item[b-xd3xl411vv]  a.active::before {
    border-color: #ffe08a;
    background: #c41422;
    box-shadow:
        0 0 0 2px rgba(196, 20, 34, 0.18),
        0 0 12px rgba(239, 38, 56, 0.6);
}

@media (min-width: 641px) {
    .navbar-toggler[b-xd3xl411vv] {
        display: none;
    }

    .nav-scrollable[b-xd3xl411vv] {
        display: block;
        height: calc(100vh - 4.5rem);
        overflow-y: auto;
    }
}


/* ================================================================
   MATRIXARENA v16.2 – Navigation ohne Tapetenfläche
   ================================================================ */

.top-row[b-xd3xl411vv],
.nav-scrollable[b-xd3xl411vv] {
    background-color: transparent !important;
    background-image: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}

.top-row[b-xd3xl411vv] {
    border-bottom-color: rgba(232, 181, 63, 0.16);
}

.top-row[b-xd3xl411vv]::before {
    display: none !important;
    content: none !important;
    background: none !important;
}

.top-row[b-xd3xl411vv]::after {
    opacity: 0.48;
}

.navbar-brand[b-xd3xl411vv] {
    text-shadow:
        0 2px 9px rgba(0, 0, 0, 1),
        0 0 13px rgba(232, 181, 63, 0.23);
}

.navbar-toggler[b-xd3xl411vv] {
    background-color: rgba(0, 0, 0, 0.2);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.55);
}

.nav-item[b-xd3xl411vv]  .nav-link {
    text-shadow:
        0 1px 6px rgba(0, 0, 0, 1);
}

.nav-item[b-xd3xl411vv]  .nav-link:hover {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.1),
            rgba(0, 0, 0, 0.035) 72%,
            transparent
        );
}

.nav-item[b-xd3xl411vv]  a.active {
    background:
        linear-gradient(
            90deg,
            rgba(196, 20, 34, 0.52),
            rgba(28, 5, 9, 0.2) 62%,
            transparent
        );
}

@media (max-width: 640.98px) {
    /*
     * Nur das aufgeklappte Mobilmenü bekommt eine sehr leichte
     * Abdunklung; keine Carbon- oder Tapetenstruktur.
     */
    .navbar-toggler:checked ~ .nav-scrollable[b-xd3xl411vv] {
        background-color: rgba(1, 5, 3, 0.72) !important;
        background-image: none !important;
        box-shadow:
            0 16px 36px rgba(0, 0, 0, 0.48) !important;
    }
}

@media (min-width: 641px) {
    .nav-scrollable[b-xd3xl411vv] {
        height: calc(100dvh - 4.5rem);
    }
}

/* ================================================================
   MATRIXARENA v16.3 – durchgehender Matrix-Fluss im Menüband
   ================================================================ */

.top-row[b-xd3xl411vv],
.nav-scrollable[b-xd3xl411vv] {
    background-color: rgba(0, 5, 2, 0.075) !important;
    background-image:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.018),
            transparent 62%,
            rgba(196, 20, 34, 0.012)
        ) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.navbar-brand[b-xd3xl411vv],
.nav-item[b-xd3xl411vv]  .nav-link {
    text-shadow:
        0 1px 4px rgba(0, 0, 0, 1),
        0 0 9px rgba(0, 0, 0, 0.96);
}

/* Nur die einzelnen Zustände werden getönt, nie das gesamte Menü zugedeckt. */
.nav-item[b-xd3xl411vv]  .nav-link:hover {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.16),
            rgba(0, 0, 0, 0.08) 70%,
            transparent
        ) !important;
}

.nav-item[b-xd3xl411vv]  a.active {
    background:
        linear-gradient(
            90deg,
            rgba(196, 20, 34, 0.60),
            rgba(50, 7, 13, 0.25) 58%,
            rgba(0, 0, 0, 0.04)
        ) !important;
}

@media (max-width: 640.98px) {
    .navbar-toggler:checked ~ .nav-scrollable[b-xd3xl411vv] {
        background-color: rgba(1, 6, 3, 0.66) !important;
        background-image:
            linear-gradient(
                180deg,
                rgba(232, 181, 63, 0.025),
                rgba(0, 0, 0, 0.08)
            ) !important;
    }
}

/* ================================================================
   MATRIXARENA v17.3 – logisch gruppierte Sidebar-Akkordeons
   ================================================================ */

.nav-primary[b-xd3xl411vv] {
    margin-bottom: 0.34rem;
}

.nav-group[b-xd3xl411vv] {
    margin: 0.18rem 0;
}

.nav-group-toggle[b-xd3xl411vv] {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 2.44rem;
    padding: 0.5rem 0.62rem;
    align-items: center;
    gap: 0.54rem;
    color: #aeb9b1;
    border: 1px solid rgba(232, 181, 63, 0.11);
    border-radius: 0.25rem;
    background:
        linear-gradient(
            90deg,
            rgba(20, 16, 5, 0.22),
            rgba(0, 0, 0, 0.035) 72%,
            transparent
        );
    font-family:
        "Cascadia Mono",
        "Consolas",
        monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.055em;
    line-height: 1.2;
    text-align: left;
    text-shadow:
        0 1px 4px rgba(0, 0, 0, 1),
        0 0 9px rgba(0, 0, 0, 0.96);
    text-transform: uppercase;
    transition:
        color 130ms ease,
        border-color 130ms ease,
        background-color 130ms ease;
}

.nav-group-toggle[b-xd3xl411vv]::before {
    width: 0.38rem;
    height: 0.38rem;
    flex: 0 0 auto;
    content: "";
    transform: rotate(45deg);
    border: 1px solid rgba(224, 192, 111, 0.72);
    background: rgba(13, 10, 3, 0.58);
    transition:
        border-color 130ms ease,
        background-color 130ms ease,
        box-shadow 130ms ease;
}

.nav-group-toggle:hover[b-xd3xl411vv],
.nav-group-toggle:focus-visible[b-xd3xl411vv] {
    color: #f3e1b3;
    border-color: rgba(232, 181, 63, 0.28);
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.13),
            rgba(0, 0, 0, 0.055) 72%,
            transparent
        );
}

.nav-group-toggle.is-open[b-xd3xl411vv] {
    color: #f9f1dd;
    border-color: rgba(232, 181, 63, 0.31);
    background:
        linear-gradient(
            90deg,
            rgba(91, 71, 22, 0.25),
            rgba(0, 0, 0, 0.045) 72%,
            transparent
        );
}

.nav-group-toggle.is-open[b-xd3xl411vv]::before {
    border-color: #ffe08a;
    background: #e8b53f;
    box-shadow:
        0 0 0 2px rgba(232, 181, 63, 0.12),
        0 0 10px rgba(232, 181, 63, 0.42);
}

.nav-group-toggle.action-required[b-xd3xl411vv] {
    color: #fdf9f1;
    border-color: rgba(255, 208, 88, 0.32);
    box-shadow:
        inset 2px 0 0 rgba(233, 187, 69, 0.82),
        0 0 14px rgba(255, 199, 57, 0.08);
}

.nav-group-title[b-xd3xl411vv] {
    min-width: 0;
    overflow: hidden;
    flex: 1 1 auto;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-group-toggle .vx-green-count[b-xd3xl411vv] {
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.32rem;
    font-size: 0.65rem;
}

.nav-group-chevron[b-xd3xl411vv] {
    width: 0.48rem;
    height: 0.48rem;
    margin-right: 0.08rem;
    flex: 0 0 auto;
    transform: rotate(45deg);
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    opacity: 0.78;
    transition: transform 150ms ease;
}

.nav-group-toggle.is-open .nav-group-chevron[b-xd3xl411vv] {
    transform: rotate(225deg);
}

.nav-group-items[b-xd3xl411vv] {
    position: relative;
    margin: 0.1rem 0 0.34rem 0.55rem;
    padding-left: 0.55rem;
}

.nav-group-items[b-xd3xl411vv]::before {
    position: absolute;
    top: 0.15rem;
    bottom: 0.2rem;
    left: 0;
    width: 1px;
    content: "";
    background:
        linear-gradient(
            180deg,
            rgba(232, 181, 63, 0.52),
            rgba(232, 181, 63, 0.08)
        );
}

.nav-group-items[hidden][b-xd3xl411vv] {
    display: none !important;
}

.nav-group-item[b-xd3xl411vv] {
    padding-bottom: 0.12rem;
}

.nav-group-item[b-xd3xl411vv]  .nav-link {
    min-height: 2.24rem;
    padding: 0.42rem 0.52rem;
    font-size: 0.67rem;
    letter-spacing: 0.025em;
}

.nav-group-item[b-xd3xl411vv]  .nav-link::before {
    width: 0.3rem;
    height: 0.3rem;
    margin-right: 0.5rem;
}

.nav-group-item .vx-green-count[b-xd3xl411vv] {
    min-width: 1.55rem;
    height: 1.55rem;
    padding: 0 0.34rem;
    font-size: 0.66rem;
}

.nav-account-separator[b-xd3xl411vv] {
    height: 1px;
    margin: 0.78rem 1.35rem 0.58rem;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(232, 181, 63, 0.35),
            rgba(196, 20, 34, 0.22),
            transparent
        );
}

@media (prefers-reduced-motion: reduce) {
    .nav-group-toggle[b-xd3xl411vv],
    .nav-group-toggle[b-xd3xl411vv]::before,
    .nav-group-chevron[b-xd3xl411vv] {
        transition: none;
    }
}

.nav-group-toggle[b-xd3xl411vv] {
    appearance: none;
    cursor: pointer;
}

.nav-group-item:first-of-type[b-xd3xl411vv] {
    padding-top: 0.06rem;
}

.nav-group-item:last-of-type[b-xd3xl411vv] {
    padding-bottom: 0.12rem;
}

/* ===================================================================
   RETROTASTEN
   ===================================================================
   Aus den flachen Textlinks werden gefaste Tasten: harte Kanten,
   Metallverlauf, ein Druckpunkt der sich bewegt.

   Die Regeln stehen bewusst am Ende der Datei. Weiter oben setzen
   mehrere Bloecke denselben Selektor mit `!important` — bei gleicher
   Spezifitaet entscheidet die Reihenfolge, und wo dort `!important`
   steht, muss es hier ebenfalls stehen. Sauberer waere eine
   aufgeraeumte Datei; das ist aber ein eigener Umbau und gehoert nicht
   in eine Optikaenderung.

   Vier Dinge machen das Retro aus:
     1. keine Rundung — abgerundete Ecken sind das deutlichste
        Merkmal heutiger Oberflaechen
     2. eine Fase aus vier harten Linien statt eines weichen Schattens
     3. ein Druckpunkt, bei dem sich der Inhalt wirklich bewegt
     4. eine quadratische Leuchte statt eines runden Punkts
   =================================================================== */

.nav-item[b-xd3xl411vv]  .nav-link {
    min-height: 2.3rem;
    padding: 0.42rem 0.6rem;
    gap: 0.5rem;

    /* Die Fase: hell oben links, dunkel unten rechts. */
    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;

    background:
        linear-gradient(180deg, #2c2820 0%, #1e1b16 100%) !important;
    color: #d9d4c8;
    letter-spacing: 0.1em;
    transform: none;
    transition:
        color 90ms linear,
        background 90ms linear,
        border-color 90ms linear;
}

/* Die Leuchte. Der Rautenpunkt von vorher wird ein Quadrat: Kreise
   und Rauten sind weich, ein Pixelquadrat liest sich als Anzeige. */
.nav-item[b-xd3xl411vv]  .nav-link::before {
    width: 0.42rem;
    height: 0.42rem;
    margin-right: 0;
    transform: none;
    border: 0;
    background: #3a352b;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.6);
}

.nav-item[b-xd3xl411vv]  .nav-link:hover {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background:
        linear-gradient(180deg, #37312727 0%, #24201a 100%) !important;
    color: #fcf8ed;
    transform: none;
}

.nav-item[b-xd3xl411vv]  .nav-link:hover::before {
    background: rgba(232, 181, 63, 0.55);
    box-shadow: none;
}

/* Gedrueckt: Fase umgekehrt, Inhalt einen Punkt nach unten rechts.
   Ohne diese Bewegung bleibt es ein Bild von einer Taste. */
.nav-item[b-xd3xl411vv]  .nav-link:active {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    background:
        linear-gradient(180deg, #191612 0%, #211d18 100%) !important;
    padding: calc(0.42rem + 1px) calc(0.6rem - 1px)
             calc(0.42rem - 1px) calc(0.6rem + 1px);
}

/* Der laufende Punkt. Bisher rot — Rot ist jetzt der Zustand
   „liegt zu lange", nicht „du bist hier". Gold ist die Hausfarbe und
   traegt das besser. */
.nav-item[b-xd3xl411vv]  a.active {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background:
        linear-gradient(180deg, #3a2f16 0%, #241d0f 100%) !important;
    box-shadow: none;
    color: #ffe08a;
}

.nav-item[b-xd3xl411vv]  a.active::before {
    background: #e8b53f;
    box-shadow: 0 0 4px rgba(232, 181, 63, 0.8);
}

/* Etwas liegt an: rote Leuchte, rote Fase. Der einzige Ort, an dem
   Rot vorkommt. */
.nav-item[b-xd3xl411vv]  .nav-link.action-required {
    border-color:
        rgba(217, 100, 100, 0.6) rgba(90, 30, 30, 0.9)
        rgba(90, 30, 30, 0.9) rgba(217, 100, 100, 0.6);
}

.nav-item[b-xd3xl411vv]  .nav-link.action-required::before {
    background: #d96464;
    box-shadow: 0 0 4px rgba(217, 100, 100, 0.75);
}

/* Der Zaehler: eckiger Chip, schwarz auf Gold. */
.nav-item[b-xd3xl411vv]  .vx-green-count {
    padding: 0 0.3rem;
    border: 0;
    border-radius: 0;
    background: #e8b53f;
    color: #14120f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.nav-item[b-xd3xl411vv]  .nav-link.action-required .vx-green-count {
    background: #d96464;
}

/* Die Gruppenkoepfe bleiben Text — waeren sie auch Tasten, gaebe es
   keine Ordnung mehr, nur noch Blech. */
.nav-group-title[b-xd3xl411vv] {
    color: rgba(217, 212, 200, 0.34);
    letter-spacing: 0.16em;
}


/* ===================================================================
   PATINA
   ===================================================================
   Zehn Abnutzungsmuster, damit nicht jede Taste aussieht wie frisch
   aus der Presse.

   Hier ueber die Position zugeteilt (`nth-of-type`) und nicht ueber
   eine Klasse im Markup: die Reihenfolge der Punkte liegt fest, damit
   ist die Zuteilung ebenso berechenbar wie anderswo die Rechnung aus
   der Beschriftung — und es spart fuenfzehn Eingriffe ins Markup.

   Dieselben Muster liegen als Klassen in wwwroot/retro-tasten.css, wo
   Menueband und Kontrollpult sie holen. Dass sie hier ein zweites Mal
   stehen, ist der Preis dafuer, dass CSS keine Regel aus einer anderen
   Datei uebernehmen kann. Wer eines aendert, aendert beide.
   =================================================================== */

.nav-item[b-xd3xl411vv]  .nav-link::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 1 · Kratzer quer, oben links abgegriffen */
.nav-item:nth-of-type(10n + 1)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        linear-gradient(103deg, transparent 34%, rgba(255,255,255,0.05) 34.4%, transparent 35%),
        linear-gradient(97deg, transparent 61%, rgba(0,0,0,0.22) 61.3%, transparent 62%),
        radial-gradient(120% 90% at 8% 12%, rgba(255,245,220,0.05), transparent 55%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 2 · Ecke unten rechts angestossen */
.nav-item:nth-of-type(10n + 2)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        linear-gradient(315deg, rgba(0,0,0,0.4) 0 4px, transparent 4px),
        radial-gradient(70% 60% at 92% 88%, rgba(0,0,0,0.2), transparent 60%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 3 · fleckig, wie oft angefasst */
.nav-item:nth-of-type(10n + 3)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        radial-gradient(38% 62% at 26% 58%, rgba(0,0,0,0.16), transparent 70%),
        radial-gradient(30% 48% at 72% 34%, rgba(255,240,210,0.035), transparent 70%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 4 · ein langer Kratzer diagonal */
.nav-item:nth-of-type(10n + 4)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        linear-gradient(74deg, transparent 22%, rgba(255,255,255,0.07) 22.3%, transparent 23%),
        linear-gradient(74deg, transparent 23.6%, rgba(0,0,0,0.28) 23.9%, transparent 24.4%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 5 · oben abgegriffen, Lack duenn */
.nav-item:nth-of-type(10n + 5)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        linear-gradient(180deg, rgba(255,245,220,0.06) 0 22%, transparent 46%),
        radial-gradient(90% 40% at 50% 4%, rgba(255,255,255,0.045), transparent 70%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 6 · zwei kurze Kerben links */
.nav-item:nth-of-type(10n + 6)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        linear-gradient(88deg, rgba(0,0,0,0.3) 0 2px, transparent 2px) 6% 30% / 14% 12% no-repeat,
        linear-gradient(88deg, rgba(0,0,0,0.26) 0 2px, transparent 2px) 9% 68% / 11% 10% no-repeat,
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 7 · Rand rundum stumpf */
.nav-item:nth-of-type(10n + 7)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        radial-gradient(120% 140% at 50% 50%, transparent 58%, rgba(0,0,0,0.22) 100%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 8 · feiner Kratzerfaecher rechts */
.nav-item:nth-of-type(10n + 8)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        linear-gradient(112deg, transparent 70%, rgba(255,255,255,0.045) 70.3%, transparent 71%),
        linear-gradient(108deg, transparent 78%, rgba(255,255,255,0.04) 78.3%, transparent 79%),
        linear-gradient(116deg, transparent 84%, rgba(0,0,0,0.2) 84.3%, transparent 85%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 9 · unten dunkel, wie eingestaubt */
.nav-item:nth-of-type(10n + 9)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        linear-gradient(180deg, transparent 58%, rgba(0,0,0,0.24) 100%),
        radial-gradient(60% 30% at 30% 96%, rgba(0,0,0,0.2), transparent 70%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}

/* 10 · fast neu, nur ein Hauch */
.nav-item:nth-of-type(10n + 0)[b-xd3xl411vv]  .nav-link::after {
    background-image:
        radial-gradient(80% 70% at 62% 26%, rgba(255,250,235,0.03), transparent 65%),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 3px);
}
/* /Components/Layout/OnboardingHint.razor.rz.scp.css */
.onboarding-hint[b-grfilgmzqr] {
    display: flex;
    margin: 0 0 1rem;
    padding: 0.6rem 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    border: 1px solid rgba(232, 181, 63, 0.4);
    border-radius: 0.4rem;
    background: rgba(232, 181, 63, 0.08);
}

.onboarding-hint__text[b-grfilgmzqr] {
    font-size: 0.9rem;
    line-height: 1.4;
}

.onboarding-hint__actions[b-grfilgmzqr] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* Das Abbestellen ist der endgueltigere der beiden Wege und soll sich
   nicht vor den Einstieg draengen. */
.onboarding-hint__quiet[b-grfilgmzqr] {
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.82rem;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-egrfqs8uk9],
.components-reconnect-repeated-attempt-visible[b-egrfqs8uk9],
.components-reconnect-failed-visible[b-egrfqs8uk9],
.components-pause-visible[b-egrfqs8uk9],
.components-resume-failed-visible[b-egrfqs8uk9],
.components-rejoining-animation[b-egrfqs8uk9] {
    display: none;
}

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


#components-reconnect-modal[b-egrfqs8uk9] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-egrfqs8uk9 0.5s both;
    &[open]

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

}

#components-reconnect-modal[b-egrfqs8uk9]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-egrfqs8uk9 0.5s ease-in-out;
    opacity: 1;
}

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

#components-reconnect-modal p[b-egrfqs8uk9] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-egrfqs8uk9] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-egrfqs8uk9] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-egrfqs8uk9] {
        background-color: #6b9ed2;
    }

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

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

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Layout/VerificationGate.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Das Schluesselfenster

   Liegt ueber allem, auch ueber Popups und dem Menueband: solange es
   steht, soll nichts anderes anklickbar sein.
   ------------------------------------------------------------------ */

.gate[b-mgddf35v4l] {
    position: fixed;
    z-index: 3000;
    inset: 0;
    display: grid;
    padding: clamp(0.75rem, 4vw, 2rem);
    place-items: center;
    background: rgba(3, 3, 2, 0.94);
    backdrop-filter: blur(2px);
}

.gate__panel[b-mgddf35v4l] {
    width: min(94vw, 34rem);
    max-height: 92vh;
    overflow-y: auto;
    border: 1px solid rgba(232, 181, 63, 0.5);
    background:
        linear-gradient(
            180deg,
            rgba(28, 25, 20, 0.98),
            rgba(11, 10, 8, 0.98)
        );
    box-shadow: 0 0 60px rgba(232, 181, 63, 0.12);
    color: #d9d4c8;
}

.gate__head[b-mgddf35v4l] {
    padding: 1rem 1.2rem 0.8rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.gate__eyebrow[b-mgddf35v4l] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.gate__head h2[b-mgddf35v4l] {
    margin: 0.2rem 0 0;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.gate__body[b-mgddf35v4l] {
    padding: 1rem 1.2rem 1.1rem;
}

.gate__body p[b-mgddf35v4l] {
    margin: 0 0 0.7rem;
    color: rgba(217, 212, 200, 0.85);
    line-height: 1.55;
}

.gate__discord[b-mgddf35v4l] {
    display: inline-block;
    margin-bottom: 1rem;
    padding: 0.5rem 1rem;
    border: 1px solid rgba(232, 181, 63, 0.55);
    background: rgba(232, 181, 63, 0.1);
    color: #efc763;
    font-weight: 700;
    text-decoration: none;
}

.gate__discord:hover[b-mgddf35v4l],
.gate__discord:focus-visible[b-mgddf35v4l] {
    border-color: #e8b53f;
    background: rgba(232, 181, 63, 0.2);
    color: #ffe08a;
}

.gate__form[b-mgddf35v4l] {
    padding-top: 0.8rem;
    border-top: 1px solid rgba(232, 181, 63, 0.14);
}

.gate__label[b-mgddf35v4l] {
    display: block;
    margin-bottom: 0.35rem;
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.gate__row[b-mgddf35v4l] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Der Schluessel wird abgetippt: weite Zeichen, weiter Abstand, und
   Grossbuchstaben ohne Ruecksicht darauf, wie getippt wurde. */
.gate__input[b-mgddf35v4l] {
    min-width: 0;
    flex: 1 1 10rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(8, 7, 6, 0.9);
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.05rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
}

.gate__input:focus[b-mgddf35v4l] {
    border-color: rgba(232, 181, 63, 0.9);
    outline: none;
}

/* Dieselbe Taste wie ueberall: zwei Fasen, keine Rundung. */
.gate__key[b-mgddf35v4l] {
    padding: 0.5rem 1.1rem;
    flex: 0 0 auto;
    border-width: 2px;
    border-style: solid;
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    border-radius: 0;
    background: linear-gradient(180deg, #4a3b12 0%, #2c2208 100%);
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}

.gate__key:disabled[b-mgddf35v4l] {
    opacity: 0.5;
    cursor: default;
}

.gate__key:not(:disabled):hover[b-mgddf35v4l],
.gate__key:not(:disabled):focus-visible[b-mgddf35v4l] {
    background: linear-gradient(180deg, #5c4916 0%, #38290a 100%);
    color: #fff3c4;
}

.gate__error[b-mgddf35v4l] {
    margin: 0.6rem 0 0;
    color: #ff9b8a;
    font-size: 0.88rem;
}

.gate__foot[b-mgddf35v4l] {
    display: flex;
    padding: 0.7rem 1.2rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    border-top: 1px solid rgba(232, 181, 63, 0.22);
}

.gate__hint[b-mgddf35v4l] {
    color: rgba(217, 212, 200, 0.45);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
}

.gate__logout[b-mgddf35v4l] {
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.82rem;
}
/* /Components/Pages/Achievements/AchievementBoard.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Auszeichnungen
   ------------------------------------------------------------------
   Dieselbe Sprache wie Kontrollpult und Menueband: harte Kanten, Fase
   aus vier Linien, Monospace fuer alles, was Beschriftung ist.

   Der eine gestalterische Grundsatz hier: verdient und offen muessen
   sich in mehr als der Farbe unterscheiden. Eine matte Kachel ohne
   Leuchten liest sich auch dann als „noch nicht", wenn jemand Farben
   schlecht trennt.
   ------------------------------------------------------------------ */

.ach[b-vuojxicftc] {
    padding-bottom: 2rem;
    color: #d9d4c8;
}

.ach__header[b-vuojxicftc] {
    display: flex;
    margin-bottom: 1.5rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.ach__eyebrow[b-vuojxicftc] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.ach h1[b-vuojxicftc] {
    margin: 0 0 0.4rem;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: clamp(1.5rem, 4vw, 2.4rem);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ach__subtitle[b-vuojxicftc] {
    margin: 0;
    color: rgba(217, 212, 200, 0.72);
}

.ach__muted[b-vuojxicftc] {
    color: rgba(217, 212, 200, 0.55);
}

/* ---- Die Gruppenschalter ---- */
.ach__filter[b-vuojxicftc] {
    display: flex;
    margin-bottom: 1.5rem;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.ach__key[b-vuojxicftc] {
    position: relative;
    padding: 0.4rem 0.85rem 0.36rem;

    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;

    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}

.ach__key:hover[b-vuojxicftc] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
}

.ach__key:active[b-vuojxicftc] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    padding: calc(0.4rem + 1px) calc(0.85rem - 1px)
             calc(0.36rem - 1px) calc(0.85rem + 1px);
}

/* Der laufende Filter: goldene Fase, wie der laufende Bereich im Band. */
.ach__key--on[b-vuojxicftc] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #3a2f16 0%, #241d0f 100%);
    color: #ffe08a;
}

/* ---- Abschnitte ---- */
.ach__section[b-vuojxicftc] {
    margin-bottom: 2rem;
}

.ach__section h2[b-vuojxicftc] {
    display: flex;
    margin: 0 0 0.75rem;
    padding-bottom: 0.4rem;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.2);
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.ach__section-count[b-vuojxicftc] {
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.08em;
}

.ach__grid[b-vuojxicftc] {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr));
}

/* ---- Die Kachel ---- */
.ach__badge[b-vuojxicftc] {
    position: relative;
    display: grid;
    padding: 0.7rem 0.8rem 0.6rem;
    align-content: start;
    gap: 0.22rem;
    overflow: hidden;

    border: 1px solid rgba(232, 181, 63, 0.16);
    border-radius: 0;
    background:
        linear-gradient(
            180deg,
            rgba(28, 25, 20, 0.6),
            rgba(11, 10, 8, 0.6)
        );
}

/* Dieselbe feine Rasterung wie auf den Tasten. */
.ach__badge[b-vuojxicftc]::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background:
        repeating-linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.02) 0,
            rgba(255, 255, 255, 0.02) 1px,
            transparent 1px,
            transparent 3px
        );
}

.ach__badge > *[b-vuojxicftc] {
    position: relative;
    z-index: 1;
}

/* Offen: matt und ohne Leuchten. Nicht ausgegraut - man soll es lesen
   koennen, es ist ja das Ziel. */
.ach__badge.is-open[b-vuojxicftc] {
    opacity: 0.55;
    filter: saturate(0.35);
}

.ach__badge.is-owned[b-vuojxicftc] {
    border-color: rgba(232, 181, 63, 0.4);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 4px 14px rgba(0, 0, 0, 0.3);
}

/* Die einmaligen bekommen die angesetzte Ecke - sie gibt es nur einmal,
   das darf man sehen. */
.ach__badge.is-unique[b-vuojxicftc]::after {
    position: absolute;
    top: 0;
    right: 0;
    width: 0.7rem;
    height: 0.7rem;
    content: "";
    border-top: 2px solid rgba(232, 181, 63, 0.55);
    border-right: 2px solid rgba(232, 181, 63, 0.55);
    pointer-events: none;
}

/* Abzeichen und Titel nebeneinander: der Orden trägt die Kachel, der
   Titel steht daneben statt darunter — sonst rutscht die Beschreibung
   zu weit nach unten und die Kacheln werden unnötig hoch. */
.ach__badge-head[b-vuojxicftc] {
    display: flex;
    margin-bottom: 0.25rem;
    gap: 0.65rem;
    align-items: center;
}

.ach__badge-head[b-vuojxicftc]  .ach-badge {
    --ach-badge-size: 3.2rem;
}

.ach__title[b-vuojxicftc] {
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.ach__desc[b-vuojxicftc] {
    color: rgba(217, 212, 200, 0.68);
    font-size: 0.76rem;
    line-height: 1.35;
}

.ach__meta[b-vuojxicftc] {
    display: flex;
    margin-top: 0.3rem;
    gap: 0.45rem;
    align-items: center;
    flex-wrap: wrap;
    color: rgba(217, 212, 200, 0.5);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Die Wertigkeit als Chip. Die Farben sind die der Metalle, damit
   dasselbe Gefaelle gilt wie bei den Ligen. */
.ach__tier[b-vuojxicftc] {
    padding: 0 0.35rem;
    border: 1px solid currentcolor;
    font-weight: 800;
}

.tier-messing .ach__tier[b-vuojxicftc] { color: #b4a06a; }
.tier-kupfer .ach__tier[b-vuojxicftc] { color: #c17a45; }
.tier-bronze .ach__tier[b-vuojxicftc] { color: #b07a4a; }
.tier-silber .ach__tier[b-vuojxicftc] { color: #c9ced2; }
.tier-gold .ach__tier[b-vuojxicftc] { color: #e8b53f; }
.tier-platin .ach__tier[b-vuojxicftc] { color: #dfe6e9; }
.tier-diamant .ach__tier[b-vuojxicftc] { color: #8fdcf0; }

.ach__badge.is-owned.tier-gold[b-vuojxicftc],
.ach__badge.is-owned.tier-platin[b-vuojxicftc],
.ach__badge.is-owned.tier-diamant[b-vuojxicftc] {
    border-color: rgba(232, 181, 63, 0.55);
}

@media (max-width: 575.98px) {
    .ach__grid[b-vuojxicftc] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Achievements/HallOfFame.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Ruhmeshalle
   ------------------------------------------------------------------
   Hier darf es prunken - aber mit denselben Mitteln wie der Rest der
   Anwendung, sonst wirkt es angeklebt. Also: dieselben harten Kanten,
   dasselbe Kupfer, dieselbe Rasterung. Der Prunk kommt aus dem Licht,
   nicht aus neuen Formen: ein warmer Schein hinter jedem Orden, eine
   doppelte Fassung um die Vitrine, Ecken aus vier kurzen Strichen.
   ------------------------------------------------------------------ */

.hof[b-br9hiqdmnd] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.hof__header[b-br9hiqdmnd] {
    margin-bottom: 1.25rem;
}

.hof__eyebrow[b-br9hiqdmnd] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.hof h1[b-br9hiqdmnd] {
    margin: 0 0 0.4rem;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: clamp(1.5rem, 4vw, 2.4rem);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-shadow:
        0 2px 10px rgba(0, 0, 0, 0.9),
        0 0 26px rgba(232, 181, 63, 0.25);
}

.hof__subtitle[b-br9hiqdmnd] {
    margin: 0;
    max-width: 44rem;
    color: rgba(217, 212, 200, 0.72);
}

.hof__muted[b-br9hiqdmnd] {
    color: rgba(217, 212, 200, 0.55);
}

.hof__bar[b-br9hiqdmnd] {
    display: flex;
    margin-bottom: 1.25rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.hof__count[b-br9hiqdmnd] {
    margin: 0;
    color: rgba(217, 212, 200, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* ---- Was noch aussteht ---- */
.hof__open[b-br9hiqdmnd] {
    margin-top: 2.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(232, 181, 63, 0.18);
}

.hof__open-title[b-br9hiqdmnd] {
    display: flex;
    margin: 0 0 1rem;
    gap: 0.6rem;
    align-items: baseline;
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.hof__open-count[b-br9hiqdmnd] {
    padding: 0 0.35rem;
    border: 1px solid rgba(217, 212, 200, 0.3);
    font-size: 0.68rem;
    font-variant-numeric: tabular-nums;
}

/* Die unbesetzte Vitrine: matt, ohne Schein, ohne Kupferrahmen. Sie
   soll lesbar bleiben - es ist das Ziel -, aber niemandem vorgaukeln,
   sie sei besetzt. */
.hof__case.is-open[b-br9hiqdmnd] {
    border-color: rgba(217, 212, 200, 0.12);
    background:
        linear-gradient(
            180deg,
            rgba(24, 22, 19, 0.5),
            rgba(10, 9, 8, 0.5)
        );
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.4);
}

.hof__case.is-open .hof__badge[b-br9hiqdmnd]::before {
    display: none;
}

.hof__case.is-open h2[b-br9hiqdmnd] {
    color: rgba(252, 247, 234, 0.62);
}

.hof__free[b-br9hiqdmnd] {
    margin: 0.3rem 0 0;
    color: rgba(217, 212, 200, 0.4);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.hof__empty[b-br9hiqdmnd] {
    padding: 2rem 1.5rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    background: rgba(20, 18, 15, 0.5);
    text-align: center;
}

.hof__empty p[b-br9hiqdmnd] {
    margin: 0 0 1rem;
    color: rgba(217, 212, 200, 0.75);
}

/* ---- Die Vitrine ---- */
.hof__grid[b-br9hiqdmnd] {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(auto-fill, minmax(21rem, 1fr));
}

.hof__case[b-br9hiqdmnd] {
    position: relative;
    display: grid;
    padding: 1rem 1.1rem 1rem 1rem;
    gap: 1rem;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    overflow: hidden;

    border: 1px solid rgba(232, 181, 63, 0.3);
    background:
        radial-gradient(
            ellipse at 12% 0%,
            rgba(232, 181, 63, 0.11),
            transparent 55%
        ),
        linear-gradient(
            180deg,
            rgba(32, 28, 22, 0.78),
            rgba(10, 9, 8, 0.78)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        inset 0 0 0 1px rgba(0, 0, 0, 0.5),
        0 8px 22px rgba(0, 0, 0, 0.4);
}

/* Die Rasterung, wie auf den Tasten. */
.hof__case[b-br9hiqdmnd]::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background:
        repeating-linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.02) 0,
            rgba(255, 255, 255, 0.02) 1px,
            transparent 1px,
            transparent 3px
        );
}

.hof__case > *[b-br9hiqdmnd] {
    position: relative;
    z-index: 1;
}

/* Die einmaligen: zweite Fassung innen, damit sie sich abheben, ohne
   dass die anderen billig aussehen. */
.hof__case.is-unique[b-br9hiqdmnd] {
    border-color: rgba(232, 181, 63, 0.62);
    box-shadow:
        inset 0 0 0 1px rgba(232, 181, 63, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 10px 28px rgba(0, 0, 0, 0.45),
        0 0 26px rgba(232, 181, 63, 0.08);
}

.hof__case.is-unique[b-br9hiqdmnd]::after {
    position: absolute;
    top: 0;
    right: 0;
    width: 1rem;
    height: 1rem;
    content: "";
    border-top: 2px solid rgba(232, 181, 63, 0.7);
    border-right: 2px solid rgba(232, 181, 63, 0.7);
    pointer-events: none;
}

/* Bei den einmaligen sitzt die angesetzte Ecke schon oben rechts.
   Das Schild rückt davor, statt sich mit ihr zu überlagern. */
.hof__case.is-unique .hof__tier[b-br9hiqdmnd] {
    right: 1.5rem;
}

.hof__case.is-unique .hof__text h2[b-br9hiqdmnd] {
    padding-right: 5.5rem;
}

/* Der Orden steht im Licht. */
.hof__badge[b-br9hiqdmnd] {
    position: relative;
    padding: 0.2rem;
    line-height: 0;
}

.hof__badge[b-br9hiqdmnd]::before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6.5rem;
    height: 6.5rem;
    content: "";
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background:
        radial-gradient(
            circle,
            rgba(232, 181, 63, 0.2),
            transparent 68%
        );
    pointer-events: none;
}

.hof__badge[b-br9hiqdmnd]  .ach-badge {
    --ach-badge-size: 4.6rem;
}

.hof__text h2[b-br9hiqdmnd] {
    /* Platz für das Metallschild in der Ecke. Ohne ihn läuft ein
       langer Titel darunter durch. */
    padding-right: 4.6rem;
    margin: 0 0 0.2rem;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.86rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.hof__desc[b-br9hiqdmnd] {
    margin: 0 0 0.6rem;
    color: rgba(217, 212, 200, 0.66);
    font-size: 0.8rem;
    line-height: 1.4;
}

/* ---- Die Träger ---- */
.hof__holders[b-br9hiqdmnd] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.hof__holders li[b-br9hiqdmnd] {
    display: flex;
    padding: 0.16rem 0;
    gap: 0.5rem;
    align-items: baseline;
    justify-content: space-between;
    border-bottom: 1px solid rgba(232, 181, 63, 0.08);
}

.hof__holders li:last-child[b-br9hiqdmnd] {
    border-bottom: none;
}

/* Der erste Name trägt Gold - in einer Ruhmeshalle ist die Reihenfolge
   die halbe Auszeichnung. */
.hof__holders li:first-child a[b-br9hiqdmnd] {
    color: #ffe08a;
}

.hof__holders a[b-br9hiqdmnd] {
    color: #ded8cb;
    font-size: 0.86rem;
    font-weight: 600;
    text-decoration: none;
}

.hof__holders a:hover[b-br9hiqdmnd],
.hof__holders a:focus-visible[b-br9hiqdmnd] {
    color: #fff3cd;
    text-decoration: underline;
}

.hof__since[b-br9hiqdmnd] {
    flex: 0 0 auto;
    color: rgba(217, 212, 200, 0.4);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-variant-numeric: tabular-nums;
}

/* Die Wertigkeit sitzt oben rechts in der Ecke der Vitrine.
   Sie lag vorher unten und schnitt dort in die Datumsspalte der
   Trägerliste - je mehr Namen, desto sicherer. Oben ist die Ecke frei
   und bleibt es: die Zeile daneben ist die Überschrift, und deren
   Länge kennen wir. */
.hof__tier[b-br9hiqdmnd] {
    position: absolute;
    top: 0.55rem;
    right: 0.6rem;
    padding: 0 0.35rem;
    border: 1px solid currentcolor;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    opacity: 0.75;
}

.tier-messing .hof__tier[b-br9hiqdmnd] { color: #b4a06a; }
.tier-kupfer .hof__tier[b-br9hiqdmnd] { color: #c17a45; }
.tier-bronze .hof__tier[b-br9hiqdmnd] { color: #b07a4a; }
.tier-silber .hof__tier[b-br9hiqdmnd] { color: #c9ced2; }
.tier-gold .hof__tier[b-br9hiqdmnd] { color: #e8b53f; }
.tier-platin .hof__tier[b-br9hiqdmnd] { color: #dfe6e9; }
.tier-diamant .hof__tier[b-br9hiqdmnd] { color: #8fdcf0; }

/* ---- Die Taste ---- */
.hof__key[b-br9hiqdmnd] {
    padding: 0.36rem 0.8rem 0.32rem;
    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;
    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.hof__key:hover[b-br9hiqdmnd],
.hof__key:focus-visible[b-br9hiqdmnd] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
    text-decoration: none;
}

.hof__key:active[b-br9hiqdmnd] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    padding: calc(0.36rem + 1px) calc(0.8rem - 1px)
             calc(0.32rem - 1px) calc(0.8rem + 1px);
}

.hof__key--more[b-br9hiqdmnd] {
    margin-top: 0.5rem;
}

/* Der Schalter, wenn er eingeschaltet ist: goldene Fase, wie überall
   das Laufende. */
.hof__key--on[b-br9hiqdmnd] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #3a2f16 0%, #241d0f 100%);
    color: #ffe08a;
}

/* ---- Die Liste aller Träger ----
   Fest im Bildschirm und mittig. Die Breite ist gedeckelt: eine Liste
   von Namen über die volle Breite eines grossen Schirms liest sich
   schlecht. */
.hof-popup[b-br9hiqdmnd] {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    padding: clamp(0.75rem, 3vw, 2rem);
    place-items: center;
    background: rgba(0, 0, 0, 0.86);
}

.hof-popup__dialog[b-br9hiqdmnd] {
    display: flex;
    width: min(92vw, 30rem);
    max-height: 82vh;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(8, 7, 6, 0.98);
    box-shadow: 0 0 42px rgba(232, 181, 63, 0.12);
}

.hof-popup__header[b-br9hiqdmnd] {
    display: flex;
    flex: 0 0 auto;
    padding: 0.8rem 0.95rem;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.hof-popup__eyebrow[b-br9hiqdmnd] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.hof-popup__header h2[b-br9hiqdmnd] {
    margin: 0.15rem 0 0;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Die Liste scrollt für sich, der Kopf bleibt stehen. */
.hof-popup__list[b-br9hiqdmnd] {
    margin: 0;
    padding: 0.5rem 0.95rem 0.9rem 2.4rem;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.hof-popup__list li[b-br9hiqdmnd] {
    display: flex;
    padding: 0.28rem 0;
    gap: 0.6rem;
    align-items: baseline;
    justify-content: space-between;
    border-bottom: 1px solid rgba(232, 181, 63, 0.08);
    color: rgba(217, 212, 200, 0.5);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
}

.hof-popup__list a[b-br9hiqdmnd] {
    color: #ded8cb;
    font-family: "Segoe UI", system-ui, sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
}

.hof-popup__list li:first-child a[b-br9hiqdmnd] {
    color: #ffe08a;
}

.hof-popup__list a:hover[b-br9hiqdmnd],
.hof-popup__list a:focus-visible[b-br9hiqdmnd] {
    text-decoration: underline;
}

@media (max-width: 575.98px) {
    .hof__grid[b-br9hiqdmnd] {
        grid-template-columns: 1fr;
    }

    .hof__case[b-br9hiqdmnd] {
        grid-template-columns: 1fr;
    }

    .hof__badge[b-br9hiqdmnd] {
        justify-self: start;
    }
}
/* /Components/Pages/Admin/Accounts/AccountVerification.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Verifizierung
   ------------------------------------------------------------------ */

.verify[b-l7b7gyz47c] {
    padding-bottom: 2rem;
    color: #d9d4c8;
}

.verify__header[b-l7b7gyz47c] {
    display: flex;
    margin-bottom: 1.25rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.verify__eyebrow[b-l7b7gyz47c] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.verify h1[b-l7b7gyz47c] {
    margin: 0.2rem 0 0.4rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.verify__lead[b-l7b7gyz47c] {
    margin: 0;
    max-width: 44rem;
    color: rgba(217, 212, 200, 0.72);
}

.verify__muted[b-l7b7gyz47c] {
    color: rgba(217, 212, 200, 0.55);
}

.verify__count[b-l7b7gyz47c] {
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.verify__note[b-l7b7gyz47c] {
    padding: 0.6rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(232, 181, 63, 0.08);
    color: #efc763;
}

.verify__table[b-l7b7gyz47c] {
    color: #d9d4c8;
}

/* Der Schluessel wird vorgelesen: gross, weit gesperrt, keine
   Verwechslung. */
.verify__code[b-l7b7gyz47c] {
    padding: 0.2rem 0.55rem;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(8, 7, 6, 0.8);
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.24em;
    user-select: all;
}

.verify__actions[b-l7b7gyz47c] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.verify__key[b-l7b7gyz47c] {
    padding: 0.36rem 0.8rem 0.32rem;
    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;
    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}

.verify__key:hover:not(:disabled)[b-l7b7gyz47c],
.verify__key:focus-visible:not(:disabled)[b-l7b7gyz47c] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
}

.verify__key:disabled[b-l7b7gyz47c] {
    opacity: 0.5;
    cursor: default;
}

.verify__key--go[b-l7b7gyz47c] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #4a3b12 0%, #2c2208 100%);
    color: #ffe08a;
}

/* Der Discordname wird abgelesen und im Discord gesucht - deshalb in
   der Schreibmaschinenschrift, in der ein l von einer 1 zu
   unterscheiden ist. */
.verify__discord[b-l7b7gyz47c] {
    display: block;
    color: #cfe3ff;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.86rem;
    user-select: all;
}

/* Die ID steht unter dem Namen: gesucht wird nach dem Namen, kopiert
   wird die ID - sie ist eindeutig, auch wenn der Name sich aendert. */
.verify__discord-id[b-l7b7gyz47c] {
    display: block;
    color: rgba(217, 212, 200, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.74rem;
    letter-spacing: 0.04em;
    user-select: all;
}

.verify__missing[b-l7b7gyz47c] {
    color: rgba(217, 212, 200, 0.4);
    font-size: 0.82rem;
    font-style: italic;
}
/* /Components/Pages/Admin/Archiv/ArchiveKeys.razor.rz.scp.css */
.archive-keys[b-rco1j1m653] {
    display: grid;
    gap: 1.1rem;
}

.archive-keys__header h1[b-rco1j1m653] {
    margin: 0.2rem 0 0.45rem;
}

.archive-keys__header p[b-rco1j1m653] {
    max-width: 52rem;
    margin: 0;
    color: rgba(217, 212, 200, 0.82);
}

.archive-keys__eyebrow[b-rco1j1m653] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.archive-keys__editor[b-rco1j1m653],
.archive-keys__list[b-rco1j1m653] {
    border-color: rgba(232, 181, 63, 0.28);
    background: rgba(2, 13, 7, 0.76);
}

/* Der frisch erzeugte Schluessel faellt bewusst auf - er ist nur
   dieses eine Mal zu sehen. */
.archive-keys__fresh[b-rco1j1m653] {
    border-color: rgba(232, 181, 63, 0.75);
    background: rgba(28, 21, 4, 0.9);
    box-shadow: 0 0 0 1px rgba(232, 181, 63, 0.25);
}

.archive-keys__fresh h2[b-rco1j1m653] {
    margin: 0.15rem 0 0.5rem;
    color: #faf3e2;
    font-size: 1.15rem;
}

.archive-keys__key[b-rco1j1m653] {
    margin: 0.8rem 0;
    padding: 0.8rem 0.9rem;
    overflow-x: auto;
    color: #faf2dd;
    border: 1px solid rgba(232, 181, 63, 0.4);
    border-radius: 0.42rem;
    background: rgba(0, 0, 0, 0.45);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.86rem;
    user-select: all;
}

.archive-keys__heading[b-rco1j1m653] {
    display: flex;
    margin-bottom: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.archive-keys__heading h2[b-rco1j1m653] {
    margin: 0.15rem 0 0;
    color: #faf3e2;
    font-size: 1.15rem;
}

.archive-keys__accounts[b-rco1j1m653] {
    display: flex;
    margin-top: 0.9rem;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.archive-keys__actions[b-rco1j1m653] {
    margin-top: 1rem;
}

.archive-keys__hint[b-rco1j1m653] {
    margin: 0.9rem 0 0;
    color: rgba(217, 212, 200, 0.72);
    font-size: 0.9rem;
}

.archive-keys__row--revoked[b-rco1j1m653] {
    opacity: 0.45;
    text-decoration: line-through;
}
/* /Components/Pages/Admin/Elo/EloAvatarModeration.razor.rz.scp.css */
.avatar-moderation-intro[b-77847rpowl] {
    max-width: 76rem;
    color: rgba(226, 210, 170, 0.82) !important;
}

.avatar-moderation-list[b-77847rpowl] {
    display: grid;
    gap: 1rem;
}

.avatar-moderation-card[b-77847rpowl] {
    padding: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.26);
    border-radius: 0.35rem;
    background: rgba(17, 13, 3, 0.76);
    box-shadow: 0 0.8rem 2rem rgba(0, 0, 0, 0.25);
}

.avatar-moderation-card__header[b-77847rpowl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.avatar-moderation-card__header h2[b-77847rpowl] {
    margin: 0;
    font-size: 1.1rem;
}

.avatar-moderation-account[b-77847rpowl] {
    margin-top: 0.25rem;
    color: rgba(226, 210, 170, 0.72);
    font-size: 0.84rem;
}

.avatar-moderation-previews[b-77847rpowl] {
    display: grid;
    margin-top: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.avatar-moderation-previews section[b-77847rpowl] {
    display: grid;
    padding: 0.8rem;
    place-items: center;
    gap: 0.65rem;
    border: 1px solid rgba(232, 181, 63, 0.16);
    background: rgba(21, 16, 4, 0.48);
}

.avatar-moderation-previews h3[b-77847rpowl] {
    margin: 0;
    color: rgba(226, 210, 170, 0.78);
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.avatar-moderation-preview[b-77847rpowl] {
    display: grid;
    width: min(100%, 14rem);
    aspect-ratio: 1;
    place-items: center;
    object-fit: cover;
    overflow: hidden;
    border: 3px solid rgba(232, 181, 63, 0.7);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.5);
}

.avatar-moderation-preview--pending[b-77847rpowl] {
    border-color: rgba(205, 167, 57, 0.88);
}

.avatar-moderation-preview--fallback[b-77847rpowl] {
    color: rgba(226, 210, 170, 0.65);
    font-family: var(--vx-font-mono);
    font-size: 0.82rem;
    text-transform: uppercase;
}

.avatar-moderation-meta[b-77847rpowl] {
    color: rgba(226, 210, 170, 0.72);
    font-size: 0.82rem;
}

.avatar-moderation-actions[b-77847rpowl] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(232, 181, 63, 0.16);
}

@media (max-width: 720px) {
    .avatar-moderation-previews[b-77847rpowl] {
        grid-template-columns: 1fr;
    }

    .avatar-moderation-card__header[b-77847rpowl] {
        flex-direction: column;
    }
}
/* /Components/Pages/Admin/Elo/EloBannedPlayers.razor.rz.scp.css */
.ban-intro[b-w3dswfy2zk] {
    max-width: 76rem;
}

.ban-create-card[b-w3dswfy2zk] {
    border-color: rgba(196, 43, 43, 0.42);
}

.ban-table td[b-w3dswfy2zk] {
    vertical-align: middle;
}

.ban-table td:nth-child(4)[b-w3dswfy2zk] {
    min-width: 15rem;
    max-width: 28rem;
    white-space: normal;
}
/* /Components/Pages/Admin/Elo/EloClaimedReview.razor.rz.scp.css */
.review-intro[b-x1yz1h9i24] {
    max-width: 76rem;
}

.reviewer-card[b-x1yz1h9i24],
.review-ticket--mine[b-x1yz1h9i24] {
    border-color: rgba(232, 181, 63, 0.34);
}

.reviewer-grid[b-x1yz1h9i24] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1rem;
}

.reviewer-grid > div[b-x1yz1h9i24] {
    display: grid;
    gap: 0.25rem;
}

.reviewer-label[b-x1yz1h9i24] {
    color: rgba(226, 210, 170, 0.78);
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.claim-owner[b-x1yz1h9i24] {
    color: rgba(224, 216, 195, 0.85);
    font-size: 0.85rem;
}

.review-facts[b-x1yz1h9i24] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 0.55rem 1.25rem;
}

.review-facts p[b-x1yz1h9i24],
.review-comment p[b-x1yz1h9i24],
.claim-foreign p[b-x1yz1h9i24] {
    margin: 0;
}

.review-comment[b-x1yz1h9i24],
.claim-foreign[b-x1yz1h9i24] {
    padding: 0.85rem 1rem;
    border-left: 3px solid rgba(232, 181, 63, 0.55);
    background: rgba(21, 16, 4, 0.58);
}

.claim-foreign[b-x1yz1h9i24] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.evidence-card[b-x1yz1h9i24] {
    border-color: rgba(232, 181, 63, 0.22);
}

.evidence-grid[b-x1yz1h9i24] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 128px));
    gap: 0.75rem;
}

.evidence-item[b-x1yz1h9i24] {
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.28);
    border-radius: 0.3rem;
    background: rgba(5, 7, 8, 0.72);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
}

.evidence-item > a[b-x1yz1h9i24] {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-bottom: 1px solid rgba(232, 181, 63, 0.2);
    background: #050607;
}

.evidence-item img[b-x1yz1h9i24] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 160ms ease;
}

.evidence-item a:hover img[b-x1yz1h9i24] {
    transform: scale(1.025);
}

.evidence-meta[b-x1yz1h9i24] {
    display: grid;
    gap: 0.3rem;
    padding: 0.5rem;
}

.evidence-meta strong[b-x1yz1h9i24] {
    overflow-wrap: anywhere;
}

.evidence-meta small[b-x1yz1h9i24] {
    color: var(--vx-gray-500);
}

.evidence-meta p[b-x1yz1h9i24] {
    margin: 0;
    white-space: pre-wrap;
}

@media (prefers-reduced-motion: reduce) {
    .evidence-item img[b-x1yz1h9i24] {
        transition: none;
    }
}

.evidence-meta[b-x1yz1h9i24] {
    font-size: 0.75rem;
}

.evidence-meta .btn[b-x1yz1h9i24] {
    padding: 0.2rem 0.4rem;
    font-size: 0.72rem;
}

.claim-audit[b-x1yz1h9i24] {
    display: flex;
    align-items: stretch;
    gap: 0.65rem;
    flex-wrap: wrap;
    padding: 0.7rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.35rem;
    background: rgba(18, 14, 4, 0.52);
}

.claim-audit__entry[b-x1yz1h9i24] {
    min-width: 190px;
    display: grid;
    align-content: center;
    gap: 0.12rem;
    padding: 0.45rem 0.6rem;
    border-left: 2px solid rgba(232, 181, 63, 0.55);
}

.claim-audit__label[b-x1yz1h9i24] {
    color: rgba(220, 199, 147, 0.78);
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.claim-audit__entry small[b-x1yz1h9i24] {
    color: rgba(224, 216, 195, 0.78);
}

.claim-audit__arrow[b-x1yz1h9i24] {
    align-self: center;
    color: rgba(232, 181, 63, 0.72);
    font-size: 1.15rem;
}

.claim-audit__badge[b-x1yz1h9i24] {
    align-self: center;
}

@media (max-width: 640px) {
    .claim-audit[b-x1yz1h9i24] {
        display: grid;
    }

    .claim-audit__arrow[b-x1yz1h9i24] {
        display: none;
    }
}

/* ------------------------------------------------------------------
   Begruendung je gelber Karte. Ein Block pro Spieler, darin eine Zeile
   pro Karte - so bleibt zuordenbar, welche Notiz zu welcher Karte
   gehoert.
   ------------------------------------------------------------------ */
.card-notes[b-x1yz1h9i24] {
    display: grid;
    gap: 0.85rem;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid rgba(232, 166, 75, 0.42);
    border-left: 4px solid rgba(232, 166, 75, 0.72);
    border-radius: 0.34rem;
    background: rgba(30, 22, 6, 0.5);
}

.card-notes__title[b-x1yz1h9i24] {
    margin: 0;
    color: #f0c98a;
    font-size: 0.95rem;
    font-weight: 800;
}

.card-notes__hint[b-x1yz1h9i24] {
    max-width: 62rem;
    margin: -0.45rem 0 0;
    color: rgba(235, 224, 181, 0.76);
    font-size: 0.84rem;
}

.card-notes__player[b-x1yz1h9i24] {
    display: grid;
    gap: 0.5rem;
}

.card-notes__player-name[b-x1yz1h9i24] {
    color: #ffe9c2;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.card-notes__row[b-x1yz1h9i24] {
    display: grid;
    grid-template-columns: minmax(7.5rem, 0.2fr) minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
}

.card-notes__row .form-label[b-x1yz1h9i24] {
    margin: 0;
    color: rgba(235, 224, 181, 0.9);
    font-size: 0.82rem;
}

@media (max-width: 640px) {
    .card-notes__row[b-x1yz1h9i24] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.3rem;
    }
}
/* /Components/Pages/Admin/Elo/EloEngine.razor.rz.scp.css */
.engine[b-2url5rkb6e] {
    display: grid;
    gap: 1rem;
}

.engine__header h1[b-2url5rkb6e] {
    margin: 0.15rem 0 0.35rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.engine__eyebrow[b-2url5rkb6e] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.engine__header p[b-2url5rkb6e] {
    max-width: 48rem;
    margin: 0;
    color: #cbbfa6;
    font-size: 0.88rem;
}

.engine h2[b-2url5rkb6e] {
    margin: 0 0 0.7rem;
    color: #fcf7ea;
    font-size: 1.02rem;
}

.engine__subhead[b-2url5rkb6e] {
    margin-top: 1.6rem;
}

.engine__empty[b-2url5rkb6e],
.engine__hint[b-2url5rkb6e],
.engine__note[b-2url5rkb6e] {
    color: #9d968a;
    font-size: 0.85rem;
}

.engine__hint[b-2url5rkb6e] {
    max-width: 46rem;
    margin: 0 0 0.9rem;
}

.engine__warning[b-2url5rkb6e] {
    margin: 0.6rem 0 0;
    color: #f0a35e;
    font-size: 0.87rem;
}

.engine__locked[b-2url5rkb6e] {
    margin: 0.7rem 0 0;
    padding: 0.6rem 0.8rem;
    border-left: 3px solid #efc763;
    background: rgba(232, 181, 63, 0.07);
    color: #e6ddcc;
    font-size: 0.85rem;
}

/* Reiter */

.engine__tabs[b-2url5rkb6e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.engine__tab[b-2url5rkb6e] {
    padding: 0.5rem 0.95rem;
    border: 1px solid rgba(232, 181, 63, 0.25);
    border-radius: 0.35rem;
    background: rgba(0, 0, 0, 0.18);
    color: #cbbfa6;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    cursor: pointer;
    transition:
        background 150ms ease,
        color 150ms ease;
}

.engine__tab:hover[b-2url5rkb6e] {
    background: rgba(232, 181, 63, 0.12);
    color: #fcf7ea;
}

.engine__tab--active[b-2url5rkb6e] {
    border-color: rgba(232, 181, 63, 0.7);
    background: rgba(232, 181, 63, 0.18);
    color: #fcf7ea;
}

/* Formular */

.engine__grid[b-2url5rkb6e] {
    display: grid;
    gap: 1.4rem;
    grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
    align-items: start;
}

.engine__group[b-2url5rkb6e] {
    display: block;
}

.engine__group-intro[b-2url5rkb6e] {
    margin: 0.2rem 0 0;
    color: #9d968a;
    font-size: 0.82rem;
    line-height: 1.45;
}

.engine__field[b-2url5rkb6e] {
    margin-top: 0.8rem;
}

.engine__field small[b-2url5rkb6e] {
    display: block;
    margin-top: 0.3rem;
    color: #9d968a;
    font-size: 0.78rem;
    line-height: 1.35;
}

.engine__actions[b-2url5rkb6e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.4rem;
}

/* Kennzahlen */

.engine__metrics[b-2url5rkb6e] {
    display: grid;
    gap: 0.6rem;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    margin: 1.1rem 0;
}

.engine__metric[b-2url5rkb6e] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    border-radius: 0.35rem;
    background: rgba(0, 0, 0, 0.16);
}

.engine__metric-label[b-2url5rkb6e] {
    color: #9d968a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.engine__metric-value[b-2url5rkb6e] {
    color: #fcf7ea;
    font-size: 1.05rem;
    font-weight: 700;
}

/* Tabellen */

.engine__table[b-2url5rkb6e] {
    color: #e6ddcc;
    font-size: 0.85rem;
}

.engine__table th[b-2url5rkb6e] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

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

.engine__note[b-2url5rkb6e] {
    max-width: 22rem;
}

.engine__rowactions[b-2url5rkb6e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    white-space: nowrap;
}

.engine__badge[b-2url5rkb6e] {
    margin-left: 0.4rem;
    padding: 0.1rem 0.4rem;
    border-radius: 0.25rem;
    background: rgba(232, 181, 63, 0.16);
    color: #efc763;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
/* /Components/Pages/Admin/Elo/EloMatchVoidEditor.razor.rz.scp.css */
.match-void-editor[b-lfo1s704ha] {
    border: 1px solid rgba(220, 53, 69, 0.58);
    border-radius: 0.75rem;
    padding: 1rem;
    background:
        linear-gradient(145deg, rgba(55, 5, 12, 0.88), rgba(16, 14, 8, 0.92));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.025),
        0 0 1.25rem rgba(220, 53, 69, 0.08);
}

.match-void-editor__head p[b-lfo1s704ha] {
    margin: 0.35rem 0 1rem;
    color: var(--bs-secondary-color);
}

.match-void-editor__warning[b-lfo1s704ha] {
    border-left: 0.25rem solid var(--bs-danger);
    padding: 0.75rem 0.9rem;
    background: rgba(220, 53, 69, 0.1);
}
/* /Components/Pages/Admin/Elo/EloPlayerNameClaims.razor.rz.scp.css */
.claim-intro[b-rg3dosrzmw] {
    max-width: 68ch;
}

.claim-card[b-rg3dosrzmw] {
    border-color: rgba(255, 255, 255, 0.12);
}

.claim-facts[b-rg3dosrzmw] {
    display: grid;
    grid-template-columns: minmax(8rem, auto) 1fr;
    gap: 0.25rem 1rem;
    margin: 0;
}

    .claim-facts dt[b-rg3dosrzmw] {
        font-weight: 500;
        opacity: 0.7;
    }

    .claim-facts dd[b-rg3dosrzmw] {
        margin: 0;
    }

.claim-message[b-rg3dosrzmw] {
    border-left: 3px solid rgba(255, 193, 7, 0.6);
    padding: 0.5rem 0.75rem;
    background: rgba(255, 193, 7, 0.08);
}

.claim-message__label[b-rg3dosrzmw] {
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    opacity: 0.7;
    margin-bottom: 0.25rem;
}

.claim-hint[b-rg3dosrzmw] {
    font-size: 0.8125rem;
    opacity: 0.75;
    max-width: 80ch;
}

.claim-decision[b-rg3dosrzmw] {
    font-size: 0.9375rem;
    opacity: 0.85;
}
/* /Components/Pages/Admin/Elo/EloRegistrations.razor.rz.scp.css */
.registration-admin-header[b-5dq52d1qv6] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.registration-admin-header > div[b-5dq52d1qv6] {
    display: flex;
    min-height: 7rem;
    flex-direction: column;
    justify-content: center;
    padding: 1rem;
    border: 1px solid rgba(255, 203, 70, 0.22);
    border-radius: 0.85rem;
    background: rgba(15, 12, 4, 0.76);
}

.registration-admin-header span[b-5dq52d1qv6],
.registration-admin-header small[b-5dq52d1qv6],
.registration-admin-entry__head span[b-5dq52d1qv6],
.registration-existing-details span[b-5dq52d1qv6],
.registration-existing-details small[b-5dq52d1qv6] {
    color: rgba(226, 210, 170, 0.82);
}

.registration-admin-header strong[b-5dq52d1qv6] {
    margin: 0.25rem 0;
    color: #faf2de;
    font-size: 1.2rem;
}

.registration-admin-list[b-5dq52d1qv6] {
    display: grid;
    gap: 1rem;
}

.registration-admin-entry__head[b-5dq52d1qv6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.registration-admin-entry__title[b-5dq52d1qv6] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 0.2rem;
}

.registration-admin-entry__head h2[b-5dq52d1qv6] {
    margin: 0;
    font-size: 1.1rem;
}

.registration-admin-entry__head em[b-5dq52d1qv6] {
    color: #ff9a9a;
    font-style: normal;
}

.registration-type-badge[b-5dq52d1qv6] {
    display: inline-flex;
    align-items: center;
    min-height: 1.7rem;
    padding: 0.2rem 0.55rem;
    border: 1px solid;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.registration-type-badge--qualification[b-5dq52d1qv6] {
    border-color: rgba(224, 180, 69, 0.48);
    color: #f5d583;
    background: rgba(92, 72, 21, 0.25);
}

.registration-type-badge--existing[b-5dq52d1qv6] {
    border-color: rgba(219, 180, 76, 0.56);
    color: #f0cf72;
    background: rgba(92, 70, 18, 0.28);
}

.registration-existing-details[b-5dq52d1qv6] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
    margin-bottom: 1rem;
}

.registration-existing-details > div[b-5dq52d1qv6] {
    display: flex;
    min-height: 5.5rem;
    flex-direction: column;
    justify-content: center;
    padding: 0.85rem;
    border: 1px solid rgba(219, 180, 76, 0.25);
    border-radius: 0.7rem;
    background: rgba(31, 24, 6, 0.28);
}

.registration-existing-details strong[b-5dq52d1qv6] {
    margin: 0.2rem 0;
    color: #f3e4b2;
}

.registration-qualification-note[b-5dq52d1qv6] {
    margin-bottom: 1rem;
    padding: 0.8rem;
    border-left: 3px solid rgba(224, 180, 69, 0.58);
    background: rgba(45, 34, 7, 0.24);
    color: rgba(228, 223, 209, 0.9);
}

.registration-season-accordion[b-5dq52d1qv6] {
    display: grid;
    gap: 0.9rem;
}

.registration-season-accordion__item[b-5dq52d1qv6] {
    overflow: hidden;
    border: 1px solid rgba(255, 203, 70, 0.2);
    border-radius: 0.9rem;
    background:
        linear-gradient(135deg, rgba(19, 15, 5, 0.92), rgba(3, 11, 7, 0.86));
    box-shadow: 0 0.55rem 1.4rem rgba(0, 0, 0, 0.2);
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.registration-season-accordion__item.is-open[b-5dq52d1qv6] {
    border-color: rgba(255, 203, 70, 0.42);
    box-shadow:
        0 0.8rem 2rem rgba(0, 0, 0, 0.28),
        0 0 1.5rem rgba(181, 139, 31, 0.08);
}

.registration-season-accordion__heading[b-5dq52d1qv6] {
    margin: 0;
}

.registration-season-accordion__toggle[b-5dq52d1qv6] {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) auto 1.2rem;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.registration-season-accordion__toggle:hover:not(:disabled)[b-5dq52d1qv6] {
    background: rgba(154, 123, 45, 0.08);
}

.registration-season-accordion__toggle:focus-visible[b-5dq52d1qv6] {
    outline: 2px solid rgba(255, 210, 97, 0.78);
    outline-offset: -3px;
}

.registration-season-accordion__toggle:disabled[b-5dq52d1qv6] {
    cursor: wait;
    opacity: 0.72;
}

.registration-season-accordion__identity[b-5dq52d1qv6] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.registration-season-accordion__identity strong[b-5dq52d1qv6] {
    overflow: hidden;
    color: #faf3e1;
    font-size: 1.08rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.registration-season-accordion__identity small[b-5dq52d1qv6] {
    color: rgba(226, 210, 170, 0.7);
}

.registration-season-accordion__kicker[b-5dq52d1qv6] {
    margin-bottom: 0.12rem;
    color: rgba(244, 203, 101, 0.9);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.registration-season-accordion__meta[b-5dq52d1qv6] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.registration-season-status[b-5dq52d1qv6],
.registration-season-registration[b-5dq52d1qv6],
.registration-season-pending[b-5dq52d1qv6] {
    display: inline-flex;
    min-height: 1.75rem;
    align-items: center;
    padding: 0.2rem 0.58rem;
    border: 1px solid rgba(218, 204, 168, 0.22);
    border-radius: 999px;
    background: rgba(29, 24, 10, 0.58);
    color: rgba(236, 231, 218, 0.88);
    font-size: 0.74rem;
    font-weight: 700;
    white-space: nowrap;
}

.registration-season-status--active[b-5dq52d1qv6] {
    border-color: rgba(255, 203, 70, 0.48);
    background: rgba(96, 74, 20, 0.3);
    color: #ffdf8d;
}

.registration-season-status--registration[b-5dq52d1qv6] {
    border-color: rgba(76, 197, 255, 0.42);
    background: rgba(16, 68, 94, 0.3);
    color: #a9e6ff;
}

.registration-season-status--planned[b-5dq52d1qv6] {
    border-color: rgba(219, 180, 76, 0.46);
    background: rgba(92, 70, 18, 0.27);
    color: #f0cf72;
}

.registration-season-registration.is-open[b-5dq52d1qv6] {
    border-color: rgba(255, 203, 70, 0.32);
    color: #eddcb3;
}

.registration-season-registration.is-closed[b-5dq52d1qv6] {
    border-color: rgba(196, 204, 198, 0.18);
    color: rgba(196, 204, 198, 0.72);
}

.registration-season-pending.has-pending[b-5dq52d1qv6] {
    border-color: rgba(255, 192, 72, 0.5);
    background: rgba(111, 70, 8, 0.34);
    color: #ffd27d;
}

.registration-season-accordion__chevron[b-5dq52d1qv6] {
    width: 0.72rem;
    height: 0.72rem;
    border-right: 2px solid rgba(226, 210, 170, 0.86);
    border-bottom: 2px solid rgba(226, 210, 170, 0.86);
    transform: rotate(45deg) translateY(-0.15rem);
    transition: transform 160ms ease;
}

.registration-season-accordion__item.is-open
.registration-season-accordion__chevron[b-5dq52d1qv6] {
    transform: rotate(225deg) translate(-0.1rem, -0.1rem);
}

.registration-season-accordion__panel[b-5dq52d1qv6] {
    padding: 1rem;
    border-top: 1px solid rgba(255, 203, 70, 0.16);
    background: rgba(1, 8, 4, 0.34);
}

.registration-season-loading[b-5dq52d1qv6] {
    padding: 1.15rem;
    border: 1px solid rgba(255, 203, 70, 0.18);
    border-radius: 0.7rem;
    color: rgba(224, 216, 195, 0.86);
    background: rgba(20, 15, 4, 0.66);
}

@media (max-width: 900px) {
    .registration-admin-header[b-5dq52d1qv6] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .registration-existing-details[b-5dq52d1qv6] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .registration-admin-header[b-5dq52d1qv6] {
        grid-template-columns: 1fr;
    }

    .registration-admin-entry__head[b-5dq52d1qv6],
    .existing-player-list__head[b-5dq52d1qv6] {
        flex-direction: column;
    }
}

.existing-player-list[b-5dq52d1qv6] {
    border-color: rgba(219, 180, 76, 0.34);
    background: rgba(20, 15, 4, 0.72);
}

.existing-player-list__kicker[b-5dq52d1qv6] {
    color: rgba(240, 207, 114, 0.86);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.existing-player-list__head[b-5dq52d1qv6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.existing-player-list__head h2[b-5dq52d1qv6] {
    margin: 0.15rem 0 0.35rem;
    color: #f3e4b2;
    font-size: 1.25rem;
}

.existing-player-list__head p[b-5dq52d1qv6] {
    max-width: 52rem;
    margin: 0;
    color: rgba(221, 217, 208, 0.84);
}

.existing-player-list__head > strong[b-5dq52d1qv6] {
    display: grid;
    min-width: 3rem;
    min-height: 3rem;
    place-items: center;
    border: 1px solid rgba(219, 180, 76, 0.48);
    border-radius: 999px;
    background: rgba(92, 70, 18, 0.3);
    color: #f0cf72;
    font-size: 1.15rem;
}

.existing-player-list .table[b-5dq52d1qv6] {
    --bs-table-bg: transparent;
    --bs-table-color: rgba(240, 236, 228, 0.94);
    --bs-table-border-color: rgba(219, 180, 76, 0.18);
}

.existing-player-list thead th[b-5dq52d1qv6] {
    color: #f0cf72;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}


.existing-player-row--qualifying[b-5dq52d1qv6] {
    background: rgba(112, 84, 18, 0.2) !important;
    box-shadow: inset 3px 0 0 rgba(240, 207, 114, 0.8);
}

.qualifying-marker[b-5dq52d1qv6] {
    display: inline-flex;
    align-items: center;
    margin-left: 0.45rem;
    padding: 0.14rem 0.45rem;
    border: 1px solid rgba(240, 207, 114, 0.56);
    border-radius: 999px;
    background: rgba(92, 70, 18, 0.38);
    color: #f0cf72;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.existing-player-actions[b-5dq52d1qv6] {
    min-width: 13rem;
}

@media (max-width: 760px) {
    .registration-season-accordion__toggle[b-5dq52d1qv6] {
        grid-template-columns: minmax(0, 1fr) 1rem;
        gap: 0.75rem;
    }

    .registration-season-accordion__meta[b-5dq52d1qv6] {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .registration-season-accordion__chevron[b-5dq52d1qv6] {
        grid-column: 2;
        grid-row: 1;
    }

    .registration-season-accordion__panel[b-5dq52d1qv6] {
        padding: 0.75rem;
    }
}


.existing-player-waitlist[b-5dq52d1qv6] {
    border-color: rgba(76, 197, 255, 0.38);
    background: rgba(5, 21, 31, 0.76);
}

.existing-player-waitlist__kicker[b-5dq52d1qv6] {
    color: rgba(151, 222, 255, 0.9);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.existing-player-waitlist .existing-player-list__head h2[b-5dq52d1qv6] {
    color: #c9eeff;
}

.existing-player-waitlist .existing-player-list__head > strong[b-5dq52d1qv6] {
    border-color: rgba(76, 197, 255, 0.5);
    background: rgba(16, 68, 94, 0.34);
    color: #a9e6ff;
}

.registration-admin-entry--waitlisted[b-5dq52d1qv6] {
    border-color: rgba(76, 197, 255, 0.28);
    background: rgba(4, 20, 30, 0.62);
}

.registration-admin-entry__title h3[b-5dq52d1qv6] {
    margin: 0;
    font-size: 1.1rem;
}

.registration-match-counts[b-5dq52d1qv6] {
    display: grid;
    grid-template-columns: repeat(2, minmax(6.5rem, 1fr));
    gap: 0.65rem;
}

.registration-match-counts > div[b-5dq52d1qv6] {
    display: flex;
    min-height: 4.3rem;
    flex-direction: column;
    justify-content: center;
    padding: 0.65rem 0.8rem;
    border: 1px solid rgba(76, 197, 255, 0.24);
    border-radius: 0.65rem;
    background: rgba(11, 53, 73, 0.27);
    text-align: center;
}

.registration-match-counts span[b-5dq52d1qv6] {
    color: rgba(170, 226, 240, 0.78);
    font-size: 0.75rem;
}

.registration-match-counts strong[b-5dq52d1qv6] {
    color: #c9eeff;
    font-size: 1.25rem;
}

@media (max-width: 760px) {
    .registration-match-counts[b-5dq52d1qv6] {
        width: 100%;
    }
}
/* /Components/Pages/Admin/Elo/EloRejectedRegistrations.razor.rz.scp.css */
.rejected[b-9cvidmqfyk] {
    max-width: 68rem;
}

.rejected__header[b-9cvidmqfyk] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.rejected__eyebrow[b-9cvidmqfyk] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.rejected__header h1[b-9cvidmqfyk] {
    margin: 0;
}

.rejected__subtitle[b-9cvidmqfyk] {
    max-width: 40rem;
    margin: 0.4rem 0 0;
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.88rem;
    line-height: 1.5;
}

.rejected__season[b-9cvidmqfyk] {
    min-width: 18rem;
}

.rejected__count[b-9cvidmqfyk] {
    margin-bottom: 0.6rem;
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* Die Begründung ist der Grund, warum es diese Seite gibt - sie
   bekommt den meisten Platz und darf umbrechen. */
.rejected__reason[b-9cvidmqfyk] {
    min-width: 20rem;
    line-height: 1.5;
}

.rejected__missing[b-9cvidmqfyk] {
    color: rgba(217, 212, 200, 0.45);
}

.rejected__hint[b-9cvidmqfyk] {
    display: block;
    color: #ffb4b4;
    font-size: 0.72rem;
    font-weight: 400;
}

.rejected__table th[scope="row"][b-9cvidmqfyk] {
    white-space: nowrap;
}

.rejected__count-note[b-9cvidmqfyk] {
    color: rgba(217, 212, 200, 0.55);
    font-weight: 400;
}

/* Eine aufgehobene Absage ist Chronik, kein offener Vorgang - sie tritt
   zurueck, verschwindet aber nicht. */
.rejected__row--overturned th[scope="row"][b-9cvidmqfyk],
.rejected__row--overturned td[b-9cvidmqfyk] {
    opacity: 0.62;
}
/* /Components/Pages/Admin/Elo/EloReview.razor.rz.scp.css */
.review-queue-accordion[b-bvc0dzvcc7] {
    display: grid;
    gap: 0.65rem;
}

.review-queue-ticket[b-bvc0dzvcc7] {
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.25);
    border-radius: 0.38rem;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.014) 0,
            rgba(232, 181, 63, 0.014) 1px,
            transparent 1px,
            transparent 8px
        ),
        var(--vx-panel, rgba(17, 13, 3, 0.92));
}

.review-queue-ticket__toggle[b-bvc0dzvcc7] {
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    width: 100%;
    min-height: 3.35rem;
    margin: 0;
    padding: 0.58rem 0.8rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    color: inherit;
    border: 0;
    border-radius: 0;
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.095),
            rgba(0, 0, 0, 0.13)
        );
    box-shadow: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background 150ms ease, box-shadow 150ms ease;
}

.review-queue-ticket__toggle:hover[b-bvc0dzvcc7] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.16),
            rgba(0, 0, 0, 0.08)
        );
}

.review-queue-ticket__toggle:focus-visible[b-bvc0dzvcc7] {
    outline: 2px solid var(--vx-gold-bright, #e5c764);
    outline-offset: -3px;
}

.review-queue-ticket__toggle[aria-expanded="true"][b-bvc0dzvcc7] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.145),
            rgba(0, 0, 0, 0.1)
        );
    box-shadow: inset 3px 0 0 rgba(232, 181, 63, 0.82);
}

.review-queue-ticket__main[b-bvc0dzvcc7] {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    gap: 0.45rem 0.85rem;
}

.review-queue-ticket__main strong[b-bvc0dzvcc7] {
    flex: 0 0 auto;
    color: var(--vx-gold-bright, #e5c764);
    font-family: var(--vx-font-mono, monospace);
    font-size: 0.74rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.review-queue-ticket__match[b-bvc0dzvcc7] {
    min-width: 0;
    overflow: hidden;
    color: var(--vx-gray-100, #f6f4ee);
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.review-queue-ticket__map[b-bvc0dzvcc7] {
    min-width: 0;
    overflow: hidden;
    color: rgba(226, 210, 170, 0.72);
    font-size: 0.84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.review-queue-ticket__side[b-bvc0dzvcc7] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
}

.review-queue-ticket__chevron[b-bvc0dzvcc7] {
    width: 0.58rem;
    height: 0.58rem;
    margin: 0 0.22rem 0.16rem 0.3rem;
    border-right: 2px solid rgba(255, 222, 140, 0.84);
    border-bottom: 2px solid rgba(255, 222, 140, 0.84);
    transform: rotate(45deg);
    transition: transform 150ms ease;
}

.review-queue-ticket__toggle[aria-expanded="true"]
.review-queue-ticket__chevron[b-bvc0dzvcc7] {
    margin-bottom: -0.12rem;
    transform: rotate(225deg);
}

.review-queue-ticket__body[b-bvc0dzvcc7] {
    padding: 1rem;
    border-top: 1px solid rgba(232, 181, 63, 0.18);
    background: rgba(1, 8, 4, 0.34);
}

@media (max-width: 767.98px) {
    .review-queue-ticket__toggle[b-bvc0dzvcc7] {
        align-items: flex-start;
        flex-direction: column;
    }

    .review-queue-ticket__main[b-bvc0dzvcc7] {
        width: 100%;
        flex-wrap: wrap;
    }

    .review-queue-ticket__match[b-bvc0dzvcc7],
    .review-queue-ticket__map[b-bvc0dzvcc7] {
        flex-basis: 100%;
        white-space: normal;
    }

    .review-queue-ticket__side[b-bvc0dzvcc7] {
        width: 100%;
        justify-content: flex-start;
    }

    .review-queue-ticket__chevron[b-bvc0dzvcc7] {
        margin-left: auto;
    }
}
/* /Components/Pages/Admin/Elo/EloReviewerActivity.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Prüferaktivität. Gleiche Bildsprache wie Tickethistory und Rangliste.
   ------------------------------------------------------------------ */
.activity-intro[b-0couhrp1ek] {
    max-width: 72ch;
}

.activity-filter[b-0couhrp1ek] {
    display: flex;
    min-height: 4.1rem;
    margin-bottom: 1.1rem;
    padding: 0.75rem 0.9rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.5rem;
    background: rgba(2, 13, 7, 0.72);
}

.activity-filter > div:first-child[b-0couhrp1ek] {
    display: grid;
    gap: 0.12rem;
}

.activity-filter__label[b-0couhrp1ek] {
    color: rgba(217, 212, 200, 0.65);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.activity-filter strong[b-0couhrp1ek] {
    color: #fbf6e8;
    font-size: 0.95rem;
}

.activity-filter .form-select[b-0couhrp1ek] {
    flex: 0 1 22rem;
    min-width: 0;
}

.activity-table__target[b-0couhrp1ek] {
    display: block;
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: none;
}

.activity-table__name[b-0couhrp1ek] {
    color: #fcf8ed;
    font-weight: 700;
}

/* Unter dem Ziel: die ganze Zeile wird angefasst, damit sie beim
   Ueberfliegen auffaellt. Bernstein statt Rot - das ist ein Hinweis
   und kein Vorwurf. */
.activity-row--low[b-0couhrp1ek] {
    --bs-table-bg: rgba(232, 166, 75, 0.09);
    box-shadow: inset 3px 0 0 var(--vx-warning, #e8a64b);
}

.activity-flag[b-0couhrp1ek] {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.05rem 0.4rem;
    border: 1px solid rgba(232, 166, 75, 0.45);
    border-radius: 0.28rem;
    color: var(--vx-warning, #e8a64b);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    vertical-align: middle;
}

.activity-count[b-0couhrp1ek] {
    display: inline-block;
    min-width: 2.4rem;
    padding: 0.1rem 0.45rem;
    border: 1px solid rgba(232, 181, 63, 0.32);
    border-radius: 0.28rem;
    background: rgba(42, 32, 6, 0.6);
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-weight: 800;
    text-align: center;
}

/* Ziel erreicht - gruen wie der Rest der Oberflaeche. */
.activity-count--ok[b-0couhrp1ek] {
    border-color: rgba(232, 181, 63, 0.32);
    background: rgba(42, 32, 6, 0.6);
    color: #ffe08a;
}

/* Unter dem Ziel. */
.activity-count--low[b-0couhrp1ek] {
    border-color: rgba(232, 166, 75, 0.5);
    background: rgba(232, 166, 75, 0.12);
    color: #f0bd77;
}

/* Gar kein Vorgang im Zeitfenster - deutlichster Fall. */
.activity-count--idle[b-0couhrp1ek] {
    border-color: rgba(232, 166, 75, 0.72);
    background: rgba(232, 166, 75, 0.2);
    color: #ffd39c;
}

.activity-table__ticket[b-0couhrp1ek] {
    color: rgba(217, 212, 200, 0.85);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.82rem;
}

.activity-note[b-0couhrp1ek] {
    max-width: 72ch;
    font-size: 0.82rem;
}
/* /Components/Pages/Admin/Elo/EloReviewHistory.razor.rz.scp.css */
.history-intro[b-oi7ltrr1si] {
    max-width: 76rem;
}

.history-filter[b-oi7ltrr1si] {
    padding: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.28);
    border-radius: 0.34rem;
    background: rgba(21, 16, 4, 0.56);
}

.history-filter-count[b-oi7ltrr1si] {
    color: rgba(226, 210, 170, 0.78);
    font-size: 0.86rem;
}

.history-ticket[b-oi7ltrr1si] {
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.25);
    border-radius: 0.34rem;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.014) 0,
            rgba(232, 181, 63, 0.014) 1px,
            transparent 1px,
            transparent 8px
        ),
        var(--vx-panel, rgba(17, 13, 3, 0.92));
    box-shadow: 0 0.45rem 1.2rem rgba(0, 0, 0, 0.2);
}

.history-ticket-summary[b-oi7ltrr1si] {
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    width: 100%;
    min-height: 4.5rem;
    margin: 0;
    padding: 0.85rem 1rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: inherit;
    border: 0;
    border-radius: 0;
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.1),
            rgba(0, 0, 0, 0.12)
        );
    box-shadow: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition:
        background 160ms ease,
        box-shadow 160ms ease;
}

.history-ticket-summary:hover[b-oi7ltrr1si] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.17),
            rgba(0, 0, 0, 0.08)
        );
}

.history-ticket-summary:focus-visible[b-oi7ltrr1si] {
    outline: 2px solid var(--vx-gold-bright, #e5c764);
    outline-offset: -4px;
}

.history-ticket-summary[aria-expanded="true"][b-oi7ltrr1si] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.15),
            rgba(0, 0, 0, 0.1)
        );
    box-shadow: inset 4px 0 0 rgba(232, 181, 63, 0.78);
}

.history-ticket-summary-main[b-oi7ltrr1si] {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
}

.history-ticket-summary-main strong[b-oi7ltrr1si] {
    color: var(--vx-gold-bright, #e5c764);
    font-family: var(--vx-font-mono, monospace);
    font-size: 0.78rem;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.history-ticket-summary-main > span:not(.text-body-secondary)[b-oi7ltrr1si] {
    color: var(--vx-gray-300, rgba(235, 232, 223, 0.9));
}

.history-ticket-summary-main .text-body-secondary[b-oi7ltrr1si] {
    color: rgba(226, 210, 170, 0.7) !important;
}

.history-ticket-summary-side[b-oi7ltrr1si] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
}

.history-ticket-chevron[b-oi7ltrr1si] {
    width: 0.65rem;
    height: 0.65rem;
    border-right: 2px solid rgba(255, 222, 140, 0.84);
    border-bottom: 2px solid rgba(255, 222, 140, 0.84);
    transform: rotate(45deg) translateY(-0.1rem);
    transition: transform 160ms ease;
}

.history-ticket-summary[aria-expanded="true"] .history-ticket-chevron[b-oi7ltrr1si] {
    transform: rotate(225deg) translate(-0.08rem, -0.08rem);
}

.history-ticket-body[b-oi7ltrr1si] {
    padding: 1rem;
    border-top: 1px solid rgba(232, 181, 63, 0.18);
    background: rgba(1, 8, 4, 0.34);
}

.history-facts[b-oi7ltrr1si],
.history-result-grid[b-oi7ltrr1si] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.8rem 1.2rem;
}

.history-facts > div[b-oi7ltrr1si],
.history-result-grid > div[b-oi7ltrr1si] {
    display: grid;
    gap: 0.2rem;
}

.history-facts span[b-oi7ltrr1si],
.history-result-grid span[b-oi7ltrr1si] {
    color: rgba(226, 210, 170, 0.72);
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.history-audit[b-oi7ltrr1si],
.history-result[b-oi7ltrr1si] {
    padding: 0.9rem;
    border: 1px solid rgba(232, 181, 63, 0.18);
    background: rgba(21, 16, 4, 0.48);
}

.history-comment[b-oi7ltrr1si] {
    padding: 0.85rem 1rem;
    border-left: 3px solid rgba(232, 181, 63, 0.55);
    background: rgba(21, 16, 4, 0.58);
}

.history-comment--admin[b-oi7ltrr1si] {
    border-left-color: rgba(205, 167, 57, 0.72);
}

.history-comment p[b-oi7ltrr1si] {
    margin: 0.35rem 0 0;
    white-space: pre-wrap;
}

@media (max-width: 575.98px) {
    .history-ticket-summary[b-oi7ltrr1si] {
        align-items: flex-start;
        flex-direction: column;
    }

    .history-ticket-summary-main[b-oi7ltrr1si] {
        width: 100%;
        align-items: flex-start;
        flex-direction: column;
        gap: 0.2rem;
    }

    .history-ticket-summary-side[b-oi7ltrr1si] {
        width: 100%;
        justify-content: space-between;
    }
}

.history-corrections[b-oi7ltrr1si] {
    padding: 0.9rem;
    border: 1px solid rgba(229, 199, 100, 0.28);
    background: rgba(25, 20, 5, 0.44);
}

.history-correction-entry[b-oi7ltrr1si] {
    display: grid;
    gap: 0.35rem;
    padding: 0.8rem 0;
    border-top: 1px solid rgba(229, 199, 100, 0.18);
}

.history-correction-entry:first-of-type[b-oi7ltrr1si] {
    padding-top: 0.25rem;
    border-top: 0;
}

.history-correction-entry__head[b-oi7ltrr1si] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.5rem 1rem;
}

.history-correction-entry__head span[b-oi7ltrr1si],
.history-correction-entry small[b-oi7ltrr1si] {
    color: rgba(235, 224, 181, 0.72);
}

.history-correction-entry__reason[b-oi7ltrr1si] {
    white-space: pre-wrap;
}

.history-correction-actions[b-oi7ltrr1si] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
}


/* ---------------------------------------------------------------------
   Gelbe Karte am geschlossenen Akkordeon. Gleiche Form wie in der
   Spieler-History, damit dasselbe Zeichen ueberall dasselbe heisst.
   --------------------------------------------------------------------- */

.history-yellow-card[b-oi7ltrr1si] {
    display: inline-flex;
    padding: 0.24rem 0.48rem;
    align-items: center;
    gap: 0.3rem;
    border: 1px solid rgba(214, 178, 46, 0.55);
    border-radius: 999px;
    background: rgba(94, 74, 12, 0.45);
}

.history-yellow-card__sheet[b-oi7ltrr1si] {
    display: block;
    width: 0.54rem;
    height: 0.78rem;
    flex: 0 0 auto;
    border-radius: 0.1rem;
    background: linear-gradient(180deg, #ffe066 0%, #e0b323 100%);
    box-shadow: 0 0 5px rgba(255, 220, 112, 0.5);
}

.history-yellow-card__count[b-oi7ltrr1si] {
    color: #f7e9b8;
    font-family: var(--vx-font-mono, monospace);
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
}
/* /Components/Pages/Admin/Elo/EloSettings.razor.rz.scp.css */
.settings-intro[b-113lvwqqkc] {
    max-width: 70rem;
    margin-top: -0.65rem;
    margin-bottom: 1.5rem;
    color: var(--vx-gray-300);
}

.settings-accordion[b-113lvwqqkc] {
    display: grid;
    gap: 0.9rem;
}

.settings-panel[b-113lvwqqkc] {
    overflow: hidden;
    border-color: rgba(232, 181, 63, 0.25);
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.014) 0,
            rgba(232, 181, 63, 0.014) 1px,
            transparent 1px,
            transparent 8px
        ),
        var(--vx-panel);
}

.settings-panel__toggle[b-113lvwqqkc] {
    display: flex;
    width: 100%;
    min-height: 4.5rem;
    padding: 0.9rem 1rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: inherit;
    border: 0;
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.08),
            rgba(0, 0, 0, 0.1)
        );
    text-align: left;
    cursor: pointer;
    transition:
        background 160ms ease,
        box-shadow 160ms ease;
}

.settings-panel__toggle:hover[b-113lvwqqkc] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.15),
            rgba(0, 0, 0, 0.08)
        );
}

.settings-panel__toggle:focus-visible[b-113lvwqqkc] {
    outline: 2px solid var(--vx-gold-bright);
    outline-offset: -4px;
}

.settings-panel--open .settings-panel__toggle[b-113lvwqqkc] {
    box-shadow: inset 4px 0 0 rgba(232, 181, 63, 0.78);
}

.settings-panel__summary[b-113lvwqqkc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.25rem;
}

.settings-panel__summary strong[b-113lvwqqkc] {
    color: var(--vx-gold-bright);
    font-family: var(--vx-font-mono);
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.settings-panel__summary > span[b-113lvwqqkc] {
    color: var(--vx-gray-300);
}

.settings-panel__chevron[b-113lvwqqkc] {
    display: inline-grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    flex: 0 0 auto;
    color: var(--vx-gold-bright);
    border: 1px solid rgba(232, 181, 63, 0.38);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
    font-size: 1.15rem;
    line-height: 1;
    transition: transform 180ms ease;
}

.settings-panel--open .settings-panel__chevron[b-113lvwqqkc] {
    transform: rotate(180deg);
}

.settings-panel__body[b-113lvwqqkc] {
    border-top: 1px solid rgba(232, 181, 63, 0.18);
}

.account-search[b-113lvwqqkc] {
    display: grid;
    grid-template-columns:
        minmax(12rem, 1fr)
        auto
        minmax(18rem, 1.35fr);
    gap: 1rem;
    align-items: end;
    padding: 0.9rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    border-radius: 0.32rem;
    background: rgba(0, 0, 0, 0.18);
}

.account-search__count[b-113lvwqqkc] {
    color: var(--vx-gold-bright);
    font-family: var(--vx-font-mono);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    white-space: nowrap;
    text-transform: uppercase;
}

.account-search__input[b-113lvwqqkc] {
    min-width: 0;
}

.account-rank[b-113lvwqqkc] {
    display: inline-flex;
    min-width: 5.75rem;
    min-height: 1.8rem;
    padding: 0.28rem 0.55rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.24);
    font-family: var(--vx-font-mono);
    font-size: 0.63rem;
    font-weight: 900;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.account-rank--admin[b-113lvwqqkc] {
    color: #f7ecd1;
    border-color: rgba(232, 181, 63, 0.62);
    background: rgba(105, 80, 16, 0.48);
    box-shadow: 0 0 14px rgba(232, 181, 63, 0.16);
}

.account-rank--reviewer[b-113lvwqqkc] {
    color: #d9efff;
    border-color: rgba(94, 182, 244, 0.48);
    background: rgba(31, 82, 120, 0.48);
}

.account-rank--trainee[b-113lvwqqkc] {
    color: #f9f1dc;
    border-color: rgba(216, 180, 90, 0.5);
    background: rgba(104, 82, 28, 0.46);
}

.account-rank--mapdev[b-113lvwqqkc] {
    color: #dcf7ff;
    border-color: rgba(66, 201, 222, 0.5);
    background: rgba(24, 94, 108, 0.44);
}

.account-rank--supporter[b-113lvwqqkc] {
    color: #f2e8c9;
    border-color: rgba(218, 184, 94, 0.42);
    background: rgba(104, 78, 28, 0.38);
}

.account-rank--player[b-113lvwqqkc] {
    color: #f0f2f3;
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(75, 82, 87, 0.45);
}

.account-table tbody tr[b-113lvwqqkc] {
    transition: background 140ms ease;
}

.account-table tbody tr:hover[b-113lvwqqkc] {
    background: rgba(232, 181, 63, 0.055);
}

@media (max-width: 991.98px) {
    .account-search[b-113lvwqqkc] {
        grid-template-columns: 1fr auto;
    }

    .account-search__input[b-113lvwqqkc] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 575.98px) {
    .settings-panel__toggle[b-113lvwqqkc] {
        align-items: flex-start;
    }

    .account-search[b-113lvwqqkc] {
        grid-template-columns: 1fr;
    }

    .account-search__input[b-113lvwqqkc] {
        grid-column: auto;
    }
}

.season-manager[b-113lvwqqkc] {
    border-color: rgba(232, 181, 63, 0.3);
    background: rgba(16, 12, 3, 0.82);
}

.season-manager .form-select[b-113lvwqqkc] {
    max-width: 58rem;
}

.season-manager .form-text[b-113lvwqqkc] {
    color: rgba(226, 210, 170, 0.78);
}

/* ------------------------------------------------------------------
   Mappool beim Anlegen einer Season. Mehrspaltig, damit auch dreißig
   Maps ohne endloses Scrollen sichtbar bleiben.
   ------------------------------------------------------------------ */
.mappool-select[b-113lvwqqkc] {
    display: grid;
    max-height: 20rem;
    padding: 0.6rem;
    gap: 0.25rem 0.9rem;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    overflow-y: auto;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.5rem;
    background: rgba(2, 13, 7, 0.55);
}

.mappool-select__item[b-113lvwqqkc] {
    display: grid;
    align-items: center;
    gap: 0.5rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 0.2rem 0.3rem;
    border-radius: 0.3rem;
    cursor: pointer;
}

.mappool-select__item:hover[b-113lvwqqkc] {
    background: rgba(232, 181, 63, 0.07);
}

.mappool-select__item span[b-113lvwqqkc] {
    overflow: hidden;
    color: #fbf6e8;
    font-size: 0.85rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mappool-select__item small[b-113lvwqqkc] {
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.04em;
}

.mappool-filter[b-113lvwqqkc] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}

.mappool-filter .form-control[b-113lvwqqkc] {
    flex: 1 1 12rem;
    min-width: 0;
}

.mappool-filter .form-select[b-113lvwqqkc] {
    flex: 0 1 11rem;
    min-width: 0;
}

.mappool-filter .btn[b-113lvwqqkc] {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* ------------------------------------------------------------------
   Kontenverwaltung: Rollen als Chips in der Zeile, Details in zwei
   gestapelten Dialogen. Ohne JS-Interop, damit nichts hängenbleibt,
   wenn die Blazor-Verbindung kurz wegbricht.
   ------------------------------------------------------------------ */
.account-roles[b-113lvwqqkc] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.account-role[b-113lvwqqkc] {
    padding: 0.08rem 0.4rem;
    border: 1px solid rgba(232, 181, 63, 0.26);
    border-radius: 0.25rem;
    background: rgba(2, 13, 7, 0.6);
    color: rgba(217, 212, 200, 0.85);
    font-size: 0.68rem;
    white-space: nowrap;
}

.vx-modal-backdrop[b-113lvwqqkc] {
    position: fixed;
    z-index: 1040;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}

.vx-modal-backdrop--stacked[b-113lvwqqkc] {
    z-index: 1050;
}

.vx-modal[b-113lvwqqkc] {
    position: fixed;
    z-index: 1045;
    top: 50%;
    left: 50%;
    display: grid;
    width: min(94vw, 34rem);
    max-height: 86vh;
    grid-template-rows: auto minmax(0, 1fr) auto;
    border: 1px solid rgba(232, 181, 63, 0.3);
    border-radius: 0.6rem;
    background:
        linear-gradient(
            160deg,
            rgba(25, 20, 8, 0.98),
            rgba(3, 7, 5, 0.99)
        );
    box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.55);
    transform: translate(-50%, -50%);
}

.vx-modal--stacked[b-113lvwqqkc] {
    z-index: 1055;
}

.vx-modal__head[b-113lvwqqkc] {
    display: flex;
    padding: 0.9rem 1rem;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.18);
}

.vx-modal__head h2[b-113lvwqqkc] {
    margin: 0.1rem 0 0;
    color: #fcf8ed;
    font-size: 1.1rem;
}

.vx-modal__eyebrow[b-113lvwqqkc] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.vx-modal__body[b-113lvwqqkc] {
    padding: 1rem;
    overflow-y: auto;
}

.vx-modal__facts[b-113lvwqqkc] {
    display: grid;
    margin: 0;
    gap: 0.35rem 0.9rem;
    grid-template-columns: auto minmax(0, 1fr);
}

.vx-modal__facts dt[b-113lvwqqkc] {
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.78rem;
    font-weight: 500;
}

.vx-modal__facts dd[b-113lvwqqkc] {
    margin: 0;
    color: #fbf6e8;
    font-size: 0.85rem;
}

.vx-modal__danger[b-113lvwqqkc] {
    margin-top: 1rem;
    padding-top: 0.8rem;
    border-top: 1px solid rgba(255, 107, 107, 0.28);
}

.vx-modal__foot[b-113lvwqqkc] {
    display: flex;
    padding: 0.8rem 1rem;
    justify-content: flex-end;
    gap: 0.5rem;
    border-top: 1px solid rgba(232, 181, 63, 0.18);
}

.role-grid[b-113lvwqqkc] {
    display: grid;
    gap: 0.35rem 1rem;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
}

.role-grid__item[b-113lvwqqkc] {
    display: grid;
    align-items: center;
    gap: 0.5rem;
    grid-template-columns: auto minmax(0, 1fr);
    padding: 0.25rem 0.3rem;
    border-radius: 0.3rem;
    color: #fbf6e8;
    cursor: pointer;
}

.role-grid__item:hover[b-113lvwqqkc] {
    background: rgba(232, 181, 63, 0.07);
}

/* ------------------------------------------------------------------
   Stornieren einer geplanten Season. Bewusst abgesetzt und in Rot -
   der Vorgang loescht.
   ------------------------------------------------------------------ */
.season-cancel[b-113lvwqqkc] {
    padding: 0.9rem 1rem;
    border: 1px solid rgba(255, 107, 107, 0.34);
    border-left: 4px solid rgba(255, 107, 107, 0.7);
    border-radius: 0.4rem;
    background: rgba(38, 8, 10, 0.42);
}

.season-cancel strong[b-113lvwqqkc] {
    color: #ffbdbd;
}

.season-cancel p[b-113lvwqqkc] {
    max-width: 62rem;
    margin-top: 0.15rem;
    color: rgba(232, 205, 205, 0.8);
    font-size: 0.85rem;
}

.season-cancel code[b-113lvwqqkc] {
    color: #ffd7d7;
    font-family: "Cascadia Mono", "Consolas", monospace;
}

.season-cancel .form-check-label[b-113lvwqqkc] {
    color: rgba(232, 205, 205, 0.9);
}

/* ---- Weg zur Spielerkarte ----
   Der Name in der Kontenliste führt auf die Karte. Er sieht deshalb
   anklickbar aus, ohne wie ein Fremdlink zu schreien. */
.account-card-link[b-113lvwqqkc] {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px dotted rgba(232, 181, 63, 0.5);
}

.account-card-link:hover[b-113lvwqqkc] {
    color: #e8b53f;
    border-bottom-color: #e8b53f;
}

/* Steht der Spielername neben dem Kontonamen, gehört er leise
   danebengesetzt - er erklärt nur, ist aber nicht die Hauptsache. */
.account-player-name[b-113lvwqqkc] {
    display: block;
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.74rem;
}

.account-actions[b-113lvwqqkc] {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.4rem;
    white-space: nowrap;
}

/* ------------------------------------------------------------------
   Filter der Kontenliste
   ------------------------------------------------------------------ */

.account-filter[b-113lvwqqkc] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-end;
    flex-wrap: wrap;
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.18);
    background: rgba(20, 18, 15, 0.4);
}

.account-filter__field[b-113lvwqqkc] {
    min-width: 0;
    flex: 0 1 11rem;
}

.account-filter__field .form-label[b-113lvwqqkc] {
    margin-bottom: 0.2rem;
    color: rgba(232, 181, 63, 0.75);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.account-filter__reset[b-113lvwqqkc] {
    flex: 0 0 auto;
}

.account-registered[b-113lvwqqkc] {
    color: rgba(217, 212, 200, 0.7);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Der Zugang: ein Wort, keine Ampel. Offen faellt trotzdem auf - es
   ist die Zeile, bei der jemand wartet. */
.account-access[b-113lvwqqkc] {
    padding: 0.1rem 0.4rem;
    border: 1px solid rgba(217, 212, 200, 0.2);
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.account-access--open[b-113lvwqqkc] {
    border-color: rgba(232, 181, 63, 0.6);
    background: rgba(232, 181, 63, 0.1);
    color: #efc763;
}
/* /Components/Pages/Admin/Elo/EloStatistics.razor.rz.scp.css */
.stats[b-jdys9t3vb7] {
    max-width: 62rem;
}

.stats__header[b-jdys9t3vb7] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.stats__eyebrow[b-jdys9t3vb7] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.stats__header h1[b-jdys9t3vb7] {
    margin: 0;
}

.stats__subtitle[b-jdys9t3vb7] {
    margin: 0.35rem 0 0;
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.88rem;
}

.stats__season[b-jdys9t3vb7] {
    min-width: 18rem;
}

.stats__note[b-jdys9t3vb7] {
    margin-bottom: 1.6rem;
    color: rgba(217, 212, 200, 0.72);
    font-size: 0.9rem;
}

.stats__block[b-jdys9t3vb7] {
    margin-bottom: 2.2rem;
    padding: 1.3rem 1.4rem 1.1rem;
    border: 1px solid rgba(232, 181, 63, 0.18);
    border-radius: 0.5rem;
    background: rgba(20, 21, 24, 0.55);
}

.stats__block--total[b-jdys9t3vb7] {
    border-color: rgba(232, 181, 63, 0.38);
    background: rgba(28, 21, 4, 0.5);
}

.stats__block h2[b-jdys9t3vb7] {
    margin: 0 0 0.5rem;
    color: #f3d079 !important;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.stats__lead[b-jdys9t3vb7] {
    margin: 0 0 1.1rem;
    max-width: 46rem;
    color: rgba(217, 212, 200, 0.68);
    font-size: 0.86rem;
    line-height: 1.55;
}

.stats__block--total .stats__lead[b-jdys9t3vb7] {
    margin: 1.1rem 0 0;
}

.stats__grid[b-jdys9t3vb7] {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
}

.stat[b-jdys9t3vb7] {
    display: grid;
    padding: 0.8rem 0.9rem;
    align-content: start;
    gap: 0.2rem;
    border: 1px solid rgba(232, 181, 63, 0.12);
    border-radius: 0.4rem;
    background: rgba(10, 11, 13, 0.55);
}

.stat__label[b-jdys9t3vb7] {
    color: rgba(217, 212, 200, 0.62);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.stat__value[b-jdys9t3vb7] {
    color: #f7f2e4;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    /* Zahlen sollen untereinander stehen, nicht tanzen. */
    font-variant-numeric: tabular-nums;
}

.stat__value--plus[b-jdys9t3vb7] {
    color: #8fe3a8;
}

.stat__value--minus[b-jdys9t3vb7] {
    color: #ff9b9b;
}

.stat__hint[b-jdys9t3vb7] {
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.74rem;
    line-height: 1.35;
}

.stats__table[b-jdys9t3vb7] {
    max-width: 26rem;
    margin: 1.2rem 0 0;
}

.stats__table caption[b-jdys9t3vb7] {
    padding-bottom: 0.3rem;
    color: rgba(217, 212, 200, 0.55);
    caption-side: top;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.stats__table th[b-jdys9t3vb7] {
    font-weight: 500;
}

.stats__table td[b-jdys9t3vb7] {
    text-align: right;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/Admin/Elo/EloTicketCorrectionEditor.razor.rz.scp.css */
.ticket-correction[b-0fc6xacjdq] {
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(229, 199, 100, 0.52);
    border-radius: 0.34rem;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(229, 199, 100, 0.02) 0,
            rgba(229, 199, 100, 0.02) 1px,
            transparent 1px,
            transparent 8px
        ),
        rgba(26, 20, 4, 0.64);
}

.ticket-correction__heading[b-0fc6xacjdq] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.ticket-correction__heading p[b-0fc6xacjdq] {
    max-width: 62rem;
    color: rgba(235, 224, 181, 0.78);
}

.ticket-correction__actions[b-0fc6xacjdq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

@media (max-width: 767.98px) {
    .ticket-correction__heading[b-0fc6xacjdq] {
        flex-direction: column;
    }

    .ticket-correction__actions > .btn[b-0fc6xacjdq] {
        width: 100%;
    }
}

.ticket-correction__evidence[b-0fc6xacjdq] {
    padding: 0.9rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    background: rgba(21, 16, 4, 0.48);
}

.ticket-correction__evidence p[b-0fc6xacjdq],
.ticket-correction__evidence small[b-0fc6xacjdq] {
    color: rgba(226, 210, 170, 0.76);
}

/* ------------------------------------------------------------------
   Begruendung je gelber Karte. Ein Block pro Spieler, darin eine Zeile
   pro Karte - so bleibt zuordenbar, welche Notiz zu welcher Karte
   gehoert.
   ------------------------------------------------------------------ */
.card-notes[b-0fc6xacjdq] {
    display: grid;
    gap: 0.85rem;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid rgba(232, 166, 75, 0.42);
    border-left: 4px solid rgba(232, 166, 75, 0.72);
    border-radius: 0.34rem;
    background: rgba(30, 22, 6, 0.5);
}

.card-notes__title[b-0fc6xacjdq] {
    margin: 0;
    color: #f0c98a;
    font-size: 0.95rem;
    font-weight: 800;
}

.card-notes__hint[b-0fc6xacjdq] {
    max-width: 62rem;
    margin: -0.45rem 0 0;
    color: rgba(235, 224, 181, 0.76);
    font-size: 0.84rem;
}

.card-notes__player[b-0fc6xacjdq] {
    display: grid;
    gap: 0.5rem;
}

.card-notes__player-name[b-0fc6xacjdq] {
    color: #ffe9c2;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.card-notes__row[b-0fc6xacjdq] {
    display: grid;
    grid-template-columns: minmax(7.5rem, 0.2fr) minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
}

.card-notes__row .form-label[b-0fc6xacjdq] {
    margin: 0;
    color: rgba(235, 224, 181, 0.9);
    font-size: 0.82rem;
}

@media (max-width: 640px) {
    .card-notes__row[b-0fc6xacjdq] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.3rem;
    }
}
/* /Components/Pages/Admin/Elo/EloTraineeReview.razor.rz.scp.css */
.review-intro[b-ix0tfzdtef] {
    max-width: 76rem;
}

.reviewer-card[b-ix0tfzdtef] {
    border-color: rgba(232, 181, 63, 0.28);
}

.reviewer-grid[b-ix0tfzdtef] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1rem;
}

.reviewer-grid > div[b-ix0tfzdtef] {
    display: grid;
    gap: 0.25rem;
}

.reviewer-label[b-ix0tfzdtef] {
    color: rgba(226, 210, 170, 0.78);
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.trainee-review-accordion[b-ix0tfzdtef] {
    display: grid;
    gap: 0.65rem;
}

.trainee-review-ticket[b-ix0tfzdtef] {
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.25);
    border-radius: 0.38rem;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.014) 0,
            rgba(232, 181, 63, 0.014) 1px,
            transparent 1px,
            transparent 8px
        ),
        var(--vx-panel, rgba(17, 13, 3, 0.92));
}

.trainee-review-ticket__toggle[b-ix0tfzdtef] {
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    width: 100%;
    min-height: 3.35rem;
    margin: 0;
    padding: 0.58rem 0.8rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    color: inherit;
    border: 0;
    border-radius: 0;
    background:
        linear-gradient(
            90deg,
            rgba(211, 173, 56, 0.11),
            rgba(232, 181, 63, 0.07),
            rgba(0, 0, 0, 0.13)
        );
    box-shadow: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background 150ms ease, box-shadow 150ms ease;
}

.trainee-review-ticket__toggle:hover[b-ix0tfzdtef] {
    background:
        linear-gradient(
            90deg,
            rgba(211, 173, 56, 0.17),
            rgba(232, 181, 63, 0.12),
            rgba(0, 0, 0, 0.08)
        );
}

.trainee-review-ticket__toggle:focus-visible[b-ix0tfzdtef] {
    outline: 2px solid var(--vx-gold-bright, #e5c764);
    outline-offset: -3px;
}

.trainee-review-ticket__toggle[aria-expanded="true"][b-ix0tfzdtef] {
    background:
        linear-gradient(
            90deg,
            rgba(211, 173, 56, 0.18),
            rgba(232, 181, 63, 0.12),
            rgba(0, 0, 0, 0.1)
        );
    box-shadow: inset 3px 0 0 var(--vx-gold-bright, #e5c764);
}

.trainee-review-ticket__main[b-ix0tfzdtef] {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    gap: 0.45rem 0.85rem;
}

.trainee-review-ticket__main strong[b-ix0tfzdtef] {
    flex: 0 0 auto;
    color: var(--vx-gold-bright, #e5c764);
    font-family: var(--vx-font-mono, monospace);
    font-size: 0.74rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.trainee-review-ticket__match[b-ix0tfzdtef] {
    min-width: 0;
    overflow: hidden;
    color: var(--vx-gray-100, #f6f4ee);
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trainee-review-ticket__map[b-ix0tfzdtef] {
    min-width: 0;
    overflow: hidden;
    color: rgba(226, 210, 170, 0.72);
    font-size: 0.84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trainee-review-ticket__side[b-ix0tfzdtef] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
}

.trainee-review-ticket__chevron[b-ix0tfzdtef] {
    width: 0.58rem;
    height: 0.58rem;
    margin: 0 0.22rem 0.16rem 0.3rem;
    border-right: 2px solid rgba(229, 199, 100, 0.9);
    border-bottom: 2px solid rgba(229, 199, 100, 0.9);
    transform: rotate(45deg);
    transition: transform 150ms ease;
}

.trainee-review-ticket__toggle[aria-expanded="true"]
.trainee-review-ticket__chevron[b-ix0tfzdtef] {
    margin-bottom: -0.12rem;
    transform: rotate(225deg);
}

.trainee-review-ticket__body[b-ix0tfzdtef] {
    padding: 1rem;
    border-top: 1px solid rgba(229, 199, 100, 0.2);
    background: rgba(1, 8, 4, 0.34);
}

.review-comment[b-ix0tfzdtef] {
    padding: 0.75rem 0.9rem;
    border-left: 3px solid rgba(232, 181, 63, 0.55);
    background: rgba(21, 16, 4, 0.58);
}

.review-comment p[b-ix0tfzdtef] {
    margin: 0;
}

.evidence-grid[b-ix0tfzdtef] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 128px));
    gap: 0.75rem;
}

.evidence-item[b-ix0tfzdtef] {
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.25);
    border-radius: 0.3rem;
    background: rgba(5, 7, 8, 0.72);
}

.evidence-item > a[b-ix0tfzdtef] {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #050607;
}

.evidence-item img[b-ix0tfzdtef] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.evidence-meta[b-ix0tfzdtef] {
    display: grid;
    gap: 0.2rem;
    padding: 0.45rem 0.55rem;
    font-size: 0.75rem;
}

.evidence-meta strong[b-ix0tfzdtef],
.evidence-meta small[b-ix0tfzdtef] {
    overflow-wrap: anywhere;
}

.claim-audit[b-ix0tfzdtef] {
    display: flex;
    align-items: stretch;
    gap: 0.65rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    padding: 0.7rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.35rem;
    background: rgba(18, 14, 4, 0.52);
}

.claim-audit__entry[b-ix0tfzdtef] {
    min-width: 190px;
    display: grid;
    align-content: center;
    gap: 0.12rem;
    padding: 0.45rem 0.6rem;
    border-left: 2px solid rgba(232, 181, 63, 0.55);
}

.claim-audit__label[b-ix0tfzdtef] {
    color: rgba(220, 199, 147, 0.78);
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.claim-audit__entry small[b-ix0tfzdtef] {
    color: rgba(224, 216, 195, 0.78);
}

@media (max-width: 767.98px) {
    .trainee-review-ticket__toggle[b-ix0tfzdtef] {
        align-items: flex-start;
        flex-direction: column;
    }

    .trainee-review-ticket__main[b-ix0tfzdtef] {
        width: 100%;
        flex-wrap: wrap;
    }

    .trainee-review-ticket__match[b-ix0tfzdtef],
    .trainee-review-ticket__map[b-ix0tfzdtef] {
        flex-basis: 100%;
        white-space: normal;
    }

    .trainee-review-ticket__side[b-ix0tfzdtef] {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .trainee-review-ticket__chevron[b-ix0tfzdtef] {
        margin-left: auto;
    }
}

@media (max-width: 640px) {
    .claim-audit[b-ix0tfzdtef] {
        display: grid;
    }
}
/* /Components/Pages/Admin/Elo/EloVacationAdmin.razor.rz.scp.css */
.vacadmin[b-vp28plgfzb] {
    max-width: 74rem;
}

.vacadmin__header[b-vp28plgfzb] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.vacadmin__eyebrow[b-vp28plgfzb] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.vacadmin__header h1[b-vp28plgfzb] {
    margin: 0;
}

.vacadmin__subtitle[b-vp28plgfzb] {
    max-width: 42rem;
    margin: 0.4rem 0 0;
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.88rem;
    line-height: 1.5;
}

.vacadmin__season[b-vp28plgfzb] {
    min-width: 18rem;
}

.vacadmin__count[b-vp28plgfzb] {
    margin-bottom: 0.6rem;
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.vacadmin__table th[scope="row"][b-vp28plgfzb] {
    white-space: nowrap;
}

/* Die Begruendung ist der Grund, warum die Zeile spaeter noch
   verstaendlich ist - sie bekommt Platz und darf umbrechen. */
.vacadmin__reason[b-vp28plgfzb] {
    min-width: 16rem;
    line-height: 1.45;
}

.vacadmin__actions[b-vp28plgfzb] {
    white-space: nowrap;
    text-align: right;
}

.vacadmin__cancelrow > td[b-vp28plgfzb] {
    background: rgba(217, 100, 100, 0.07);
}

.vacadmin__cancelbuttons[b-vp28plgfzb] {
    display: flex;
    margin-top: 0.6rem;
    gap: 0.5rem;
}
/* /Components/Pages/Admin/Ffa/FfaRankingAdmin.razor.rz.scp.css */
/* ------------------------------------------------------------------
   FFA-Rangliste pflegen
   ------------------------------------------------------------------ */

.ffa-admin__header[b-w52v3xg7gj] {
    display: flex;
    margin-bottom: 1.25rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.ffa-admin__header h1[b-w52v3xg7gj] {
    margin: 0 0 0.3rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.ffa-admin__lead[b-w52v3xg7gj] {
    margin: 0;
    max-width: 40rem;
    color: rgba(217, 212, 200, 0.7);
}

.ffa-admin__form[b-w52v3xg7gj] {
    margin-bottom: 1.5rem;
    border: 1px solid rgba(232, 181, 63, 0.24);
    background: rgba(20, 18, 15, 0.5);
}

.ffa-admin__form h2[b-w52v3xg7gj] {
    margin: 0 0 1rem;
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ffa-admin__buttons[b-w52v3xg7gj] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* ---- Das Bild im Formular ---- */
.ffa-admin__thumb-row[b-w52v3xg7gj] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

/* Eingepasst, nicht beschnitten: seit die Bilder hier hochgeladen
   werden, haben sie kein festes Seitenverhaeltnis mehr. Ein
   beschnittenes Bild waere eine Ueberraschung beim Speichern. */
.ffa-admin__thumb[b-w52v3xg7gj] {
    width: 12rem;
    aspect-ratio: 16 / 9;
    flex: 0 0 auto;
    border: 1px solid rgba(232, 181, 63, 0.3);
    background: #0b0a08;
    object-fit: contain;
}

.ffa-admin__upload[b-w52v3xg7gj] {
    display: flex;
    min-width: 18rem;
    flex: 1 1 22rem;
    flex-direction: column;
    gap: 0.5rem;
}

.ffa-admin__upload-actions[b-w52v3xg7gj] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.ffa-admin__thumb--empty[b-w52v3xg7gj] {
    display: grid;
    place-items: center;
    color: rgba(217, 212, 200, 0.4);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.ffa-admin__thumb-actions[b-w52v3xg7gj] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    align-items: flex-start;
}

/* ---- Die Liste ---- */
.ffa-admin__empty[b-w52v3xg7gj] {
    color: rgba(217, 212, 200, 0.55);
}

.ffa-admin__table[b-w52v3xg7gj] {
    color: #d9d4c8;
    vertical-align: middle;
}

.ffa-admin__cell-rank[b-w52v3xg7gj] {
    width: 4rem;
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.1rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.ffa-admin__cell-thumb[b-w52v3xg7gj] {
    width: 5rem;
    aspect-ratio: 16 / 9;
    border: 1px solid rgba(232, 181, 63, 0.25);
    background: #0b0a08;
    object-fit: contain;
}

.ffa-admin__cell-none[b-w52v3xg7gj] {
    color: rgba(217, 212, 200, 0.3);
}

.ffa-admin__cell-link a[b-w52v3xg7gj] {
    color: #efc763;
}

.ffa-admin__cell-meta[b-w52v3xg7gj] {
    color: rgba(217, 212, 200, 0.45);
    font-size: 0.8rem;
}

.ffa-admin__cell-actions[b-w52v3xg7gj] {
    display: flex;
    gap: 0.3rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.ffa-admin__badge[b-w52v3xg7gj] {
    margin-left: 0.4rem;
    padding: 0 0.35rem;
    border: 1px solid rgba(232, 181, 63, 0.3);
    color: rgba(232, 181, 63, 0.75);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ---- Die Bildwahl aus dem Archiv ---- */
.ffa-pick[b-w52v3xg7gj] {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    padding: clamp(0.75rem, 3vw, 2rem);
    place-items: center;
    background: rgba(0, 0, 0, 0.86);
}

.ffa-pick__dialog[b-w52v3xg7gj] {
    display: flex;
    width: min(94vw, 58rem);
    max-height: 86vh;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(8, 7, 6, 0.98);
    color: #d9d4c8;
}

.ffa-pick__header[b-w52v3xg7gj] {
    display: flex;
    flex: 0 0 auto;
    padding: 0.8rem 0.95rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.ffa-pick__header h2[b-w52v3xg7gj] {
    margin: 0;
    color: #fcf7ea;
    font-size: 1rem;
}

.ffa-pick__search[b-w52v3xg7gj] {
    flex: 0 0 auto;
    padding: 0.7rem 0.95rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.12);
}

/* Die Galerie scrollt fuer sich, Kopf und Suche bleiben stehen. */
.ffa-pick__body[b-w52v3xg7gj] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.9rem 0.95rem 1.1rem;
    overflow-y: auto;
}

.ffa-pick__grid[b-w52v3xg7gj] {
    display: grid;
    gap: 0.6rem;
    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
}

.ffa-pick__item[b-w52v3xg7gj] {
    display: grid;
    padding: 0;
    gap: 0.2rem;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.22);
    background: rgba(20, 18, 15, 0.6);
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.ffa-pick__item:hover[b-w52v3xg7gj],
.ffa-pick__item:focus-visible[b-w52v3xg7gj] {
    border-color: rgba(232, 181, 63, 0.75);
    background: rgba(35, 30, 20, 0.7);
}

/* Eingepasst wie ueberall in dieser Liste - das Archiv haelt jedes
   Format, und ein beschnittenes Vorschaubild waere eine Luege ueber
   das, was man gerade waehlt. */
.ffa-pick__item img[b-w52v3xg7gj],
.ffa-pick__nothumb[b-w52v3xg7gj] {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #0b0a08;
    object-fit: contain;
}

.ffa-pick__nothumb[b-w52v3xg7gj] {
    display: grid;
    place-items: center;
    color: rgba(217, 212, 200, 0.35);
    font-size: 0.7rem;
}

.ffa-pick__title[b-w52v3xg7gj] {
    padding: 0 0.5rem 0.5rem;
    overflow: hidden;
    color: #fcf7ea;
    font-size: 0.8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Components/Pages/Admin/StreamerHud/StreamerHudAdmin.razor.rz.scp.css */
.streamer-intro[b-1h3czoxbez] {
    max-width: 78rem;
}

.streamer-control-card[b-1h3czoxbez] {
    border-color: rgba(41, 216, 102, 0.34);
}

.streamer-control-grid[b-1h3czoxbez] {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    gap: 1rem;
    align-items: end;
}

.streamer-control-actions[b-1h3czoxbez] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.streamer-refresh-time[b-1h3czoxbez] {
    margin-top: 0.75rem;
    color: rgba(176, 218, 188, 0.72);
    font-size: 0.8rem;
}

.streamer-preview[b-1h3czoxbez] {
    overflow: hidden;
    border: 1px solid rgba(58, 233, 111, 0.3);
    border-radius: 0.45rem;
    background:
        linear-gradient(90deg, rgba(82, 11, 11, 0.48), transparent 30%, transparent 70%, rgba(4, 66, 27, 0.48)),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.018) 0 2px, transparent 2px 6px),
        rgba(5, 9, 7, 0.9);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.36);
}

.streamer-preview__header[b-1h3czoxbez] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(58, 233, 111, 0.2);
    background: rgba(4, 14, 8, 0.72);
}

.streamer-preview__header h2[b-1h3czoxbez] {
    margin: 0.15rem 0 0;
    color: #efd85e;
    font-size: 1.2rem;
}

.streamer-eyebrow[b-1h3czoxbez] {
    color: rgba(151, 224, 172, 0.76);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.streamer-preview__status[b-1h3czoxbez] {
    display: grid;
    justify-items: end;
    gap: 0.35rem;
}

.streamer-preview__status small[b-1h3czoxbez] {
    color: rgba(187, 219, 196, 0.75);
}

/* ------------------------------------------------------------------
   Vorschau: das echte Overlay in einem Rahmen. Es bringt seine eigene
   Gestaltung mit und verkleinert sich anhand der Rahmenbreite selbst.
   ------------------------------------------------------------------ */
.streamer-preview__frame[b-1h3czoxbez] {
    overflow: hidden;
    height: 11rem;
    border: 1px solid rgba(41, 216, 102, 0.2);
    border-radius: 0.4rem;
    background:
        repeating-linear-gradient(
            45deg,
            rgba(255, 255, 255, 0.02) 0 8px,
            transparent 8px 16px
        ),
        #0a0f0c;
}

.streamer-preview__overlay[b-1h3czoxbez] {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.streamer-preview__note[b-1h3czoxbez] {
    margin: 0.6rem 0 0;
    color: rgba(197, 220, 203, 0.6);
    font-size: 0.8rem;
}

.streamer-active-state[b-1h3czoxbez] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1rem;
}

.streamer-active-state > div[b-1h3czoxbez] {
    display: grid;
    gap: 0.2rem;
}

.streamer-active-state span[b-1h3czoxbez] {
    color: rgba(151, 207, 167, 0.72);
    font-size: 0.72rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.streamer-overlay-url[b-1h3czoxbez] {
    display: block;
    overflow-wrap: anywhere;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(54, 224, 103, 0.25);
    border-radius: 0.35rem;
    color: #91efad;
    background: rgba(1, 10, 5, 0.72);
}

@media (max-width: 900px) {
    .streamer-control-grid[b-1h3czoxbez] {
        grid-template-columns: 1fr;
    }

    .streamer-control-actions[b-1h3czoxbez] {
        justify-content: flex-start;
    }

    .streamer-preview__frame[b-1h3czoxbez] {
        height: 8.5rem;
    }
}

/* ------------------------------------------------------------------
   Die von Hand gesetzten Angaben. Zwei Bloecke nebeneinander, je einer
   pro Bildseite.
   ------------------------------------------------------------------ */
.streamer-manual-player[b-1h3czoxbez] {
    padding: 0.75rem 0.9rem;
    border: 1px solid rgba(41, 216, 102, 0.18);
    border-radius: 0.4rem;
    background: rgba(2, 13, 7, 0.5);
}

.streamer-manual-player .form-label[b-1h3czoxbez] {
    margin-bottom: 0.2rem;
    font-size: 0.78rem;
}

.streamer-manual-card .row + .row[b-1h3czoxbez] {
    margin-top: 0.2rem;
}

/* ------------------------------------------------------------------
   Die Kennungen der meinSpielplan-Plaene. Eigener, ruhiger Block: sie
   werden einmal eingetragen und danach nie wieder angefasst.
   ------------------------------------------------------------------ */
.streamer-plan-hashes[b-1h3czoxbez] {
    padding: 0.85rem 0.95rem;
    border: 1px solid rgba(41, 216, 102, 0.18);
    border-radius: 0.4rem;
    background: rgba(2, 13, 7, 0.4);
}

.streamer-plan-hashes .form-label[b-1h3czoxbez] {
    margin-bottom: 0.2rem;
    font-size: 0.78rem;
}

.streamer-plan-hashes .form-text[b-1h3czoxbez] {
    max-width: 62rem;
}

/* ------------------------------------------------------------------
   „Angaben im Overlay" als Akkordeon. Der Kopf ist ein Knopf, sieht
   aber weiter wie ein card-header aus.
   ------------------------------------------------------------------ */
.streamer-manual-card__toggle[b-1h3czoxbez] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    text-align: left;
    background: none;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    color: inherit;
    font: inherit;
    cursor: pointer;
}

    .streamer-manual-card__toggle:hover .streamer-manual-card__chevron[b-1h3czoxbez],
    .streamer-manual-card__toggle:focus-visible .streamer-manual-card__chevron[b-1h3czoxbez] {
        opacity: 1;
    }

    .streamer-manual-card__toggle[aria-expanded="true"][b-1h3czoxbez] {
        border-bottom-color: rgba(255, 255, 255, 0.16);
    }

    .streamer-manual-card__toggle[aria-expanded="true"]
    .streamer-manual-card__chevron[b-1h3czoxbez] {
        transform: rotate(180deg);
    }

.streamer-manual-card__summary[b-1h3czoxbez] {
    margin-left: auto;
    font-size: 0.8125rem;
    opacity: 0.7;
    text-align: right;
}

.streamer-manual-card__chevron[b-1h3czoxbez] {
    flex: 0 0 auto;
    font-size: 1.1rem;
    line-height: 1;
    opacity: 0.6;
    transition: transform 0.15s ease, opacity 0.15s ease;
}

/* ------------------------------------------------------------------
   Dreifachschalter fuer die Betriebsart: 1v1, 2v2, FFA.
   ------------------------------------------------------------------ */
.streamer-mode-switch[b-1h3czoxbez] {
    display: inline-flex;
    gap: 0;
}

.streamer-mode-switch__button[b-1h3czoxbez] {
    border-radius: 0;
    min-width: 4.5rem;
}

    .streamer-mode-switch__button:first-child[b-1h3czoxbez] {
        border-top-left-radius: 0.375rem;
        border-bottom-left-radius: 0.375rem;
    }

    .streamer-mode-switch__button:last-child[b-1h3czoxbez] {
        border-top-right-radius: 0.375rem;
        border-bottom-right-radius: 0.375rem;
    }

    .streamer-mode-switch__button + .streamer-mode-switch__button[b-1h3czoxbez] {
        margin-left: -1px;
    }

.streamer-mode-hint[b-1h3czoxbez] {
    max-width: 52ch;
}

.streamer-mode-empty[b-1h3czoxbez] {
    color: #e0a800;
    max-width: 52ch;
}

/* Teamname und Teamlogo, nur im 2v2-Betrieb sichtbar. */
.streamer-teams[b-1h3czoxbez] {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 1rem;
}

/* ------------------------------------------------------------------
   Die Offline-Tafel.

   Eine Zeile je Spieler, klar gegeneinander abgesetzt: hier wird
   waehrend der Sendung getippt, da darf nichts ineinanderlaufen.
   Bewusst dieselbe ruhige Optik wie die Handeingabefelder darunter.
   ------------------------------------------------------------------ */
.streamer-offline-liste[b-1h3czoxbez] {
    display: grid;
    gap: 0.6rem;
}

.streamer-offline-spieler[b-1h3czoxbez] {
    padding: 0.7rem 0.9rem;
    border: 1px solid rgba(41, 216, 102, 0.18);
    border-radius: 0.4rem;
    background: rgba(2, 13, 7, 0.5);
}

.streamer-offline-spieler .form-label[b-1h3czoxbez] {
    margin-bottom: 0.2rem;
    font-size: 0.78rem;
}

/* Farbwahl mit Punkt daneben. Der Name allein sagt im Eifer des
   Gefechts zu wenig - im Bild sieht man die Farbe, nicht das Wort. */
.streamer-offline-farbe[b-1h3czoxbez] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.streamer-offline-farbe__punkt[b-1h3czoxbez] {
    flex: 0 0 auto;
    width: 1.1rem;
    height: 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;
}

.streamer-offline-farbe .form-select[b-1h3czoxbez] {
    min-width: 0;
}

/* ------------------------------------------------------------------
   Avatarauswahl unter der Fraktion.

   Eigene Aufklappliste statt eines Auswahlfeldes: ein natives select
   kann keine Bilder zeigen, und ein Dateiname allein sagt nicht, wen
   man da gerade ins Bild holt. Deshalb steht in jeder Zeile ein
   Bildchen - im zugeklappten Knopf das gewaehlte, in der Liste alle
   zur Wahl stehenden.
   ------------------------------------------------------------------ */
.streamer-avatarwahl[b-1h3czoxbez] {
    position: relative;
}

.streamer-avatarwahl__knopf[b-1h3czoxbez] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.25rem 0.5rem;
    border: 1px solid rgba(41, 216, 102, 0.3);
    border-radius: 0.375rem;
    background: rgba(2, 13, 7, 0.7);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.streamer-avatarwahl__knopf:hover:not(:disabled)[b-1h3czoxbez],
.streamer-avatarwahl__knopf[aria-expanded="true"][b-1h3czoxbez] {
    border-color: rgba(41, 216, 102, 0.6);
}

.streamer-avatarwahl__knopf:disabled[b-1h3czoxbez] {
    opacity: 0.55;
    cursor: default;
}

.streamer-avatarwahl__text[b-1h3czoxbez] {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.86rem;
}

.streamer-avatarwahl__pfeil[b-1h3czoxbez] {
    flex: 0 0 auto;
    opacity: 0.6;
}

.streamer-avatarwahl__bild[b-1h3czoxbez] {
    display: block;
    flex: 0 0 auto;
    width: 1.9rem;
    height: 1.9rem;
    border: 1px solid rgba(41, 216, 102, 0.35);
    border-radius: 50%;
    background-color: rgba(2, 13, 7, 0.7);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Kein Bild gewaehlt: schraffiert statt leer, damit die Stelle nicht
   nach fehlender Grafik aussieht. */
.streamer-avatarwahl__bild.is-leer[b-1h3czoxbez] {
    background-image:
        repeating-linear-gradient(
            45deg,
            rgba(255, 255, 255, 0.06) 0 4px,
            transparent 4px 8px
        );
}

/* Faengt den Klick daneben ab und schliesst die Liste. Ohne ihn bliebe
   sie offen, bis man den Knopf noch einmal trifft. */
.streamer-avatarwahl__schirm[b-1h3czoxbez] {
    position: fixed;
    inset: 0;
    z-index: 30;
}

.streamer-avatarwahl__liste[b-1h3czoxbez] {
    position: absolute;
    z-index: 31;
    top: calc(100% + 0.25rem);
    left: 0;
    display: grid;
    overflow-y: auto;
    min-width: 100%;
    max-height: 17rem;
    padding: 0.25rem;
    border: 1px solid rgba(41, 216, 102, 0.4);
    border-radius: 0.4rem;
    background: #071109;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.55);
}

.streamer-avatarwahl__eintrag[b-1h3czoxbez] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.4rem;
    border: 0;
    border-radius: 0.3rem;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 0.86rem;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.streamer-avatarwahl__eintrag:hover[b-1h3czoxbez] {
    background: rgba(41, 216, 102, 0.14);
}

.streamer-avatarwahl__eintrag.is-gewaehlt[b-1h3czoxbez] {
    background: rgba(41, 216, 102, 0.2);
}

.streamer-avatarwahl__leer[b-1h3czoxbez] {
    margin: 0;
    padding: 0.4rem;
    color: rgba(197, 220, 203, 0.6);
    font-size: 0.82rem;
}
/* /Components/Pages/Admin/Streaming/StreamPlanAdmin.razor.rz.scp.css */
.stream[b-r2l2qs7zin] {
    max-width: 78rem;
}

.stream__header[b-r2l2qs7zin] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.stream__eyebrow[b-r2l2qs7zin] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.stream__header h1[b-r2l2qs7zin] {
    margin: 0;
}

.stream__subtitle[b-r2l2qs7zin] {
    max-width: 44rem;
    margin: 0.4rem 0 0;
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.88rem;
    line-height: 1.5;
}

.stream__section[b-r2l2qs7zin] {
    margin-bottom: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(217, 212, 200, 0.14);
}

.stream__section h2[b-r2l2qs7zin] {
    margin-bottom: 0.85rem;
    font-size: 1.02rem;
    letter-spacing: 0.02em;
}

.stream__section-head[b-r2l2qs7zin] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.stream__section-head h2[b-r2l2qs7zin] {
    margin-bottom: 0;
}

/* Das Ticketformular ist der Ort, an dem gearbeitet wird - es hebt
   sich deshalb vom Rest ab. */
.stream__form-card[b-r2l2qs7zin] {
    margin: 0.5rem 0 1.5rem;
    padding: 1.25rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    border-radius: 0.45rem;
    background: rgba(232, 181, 63, 0.06);
}

/* ---- Die Arbeitsfläche im aufgeklappten Abend ----
   Aufklappen heisst bearbeiten, deshalb steckt hier alles drin:
   Aufbau, Programm und die Anmeldungen. */
.stream__editor[b-r2l2qs7zin] {
    padding: 0.25rem 1.1rem 1.4rem;
    border-top: 1px solid rgba(217, 212, 200, 0.12);
}

.stream__block-title[b-r2l2qs7zin] {
    margin: 1.75rem 0 0.75rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

/* Der erste Abschnitt braucht oben keinen zusätzlichen Abstand - die
   Trennlinie der Klappe sitzt schon darüber. */
.stream__editor > .stream__block-title:first-child[b-r2l2qs7zin] {
    margin-top: 0.9rem;
}

.stream__empty[b-r2l2qs7zin] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.88rem;
}

.stream__hint[b-r2l2qs7zin] {
    margin-left: 0.75rem;
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.8rem;
}

.stream__buttons[b-r2l2qs7zin] {
    display: flex;
    margin-top: 0.4rem;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Die Uhrzeitliste liest sich als Spalte besser in einer Schrift mit
   fester Breite. */
.stream__times[b-r2l2qs7zin] {
    font-family: "Cascadia Mono", "Consolas", monospace;
}

.stream__mapmodes[b-r2l2qs7zin] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.3rem;
}

.stream__table th[scope="row"][b-r2l2qs7zin] {
    white-space: nowrap;
    font-family: "Cascadia Mono", "Consolas", monospace;
}

.stream__actions[b-r2l2qs7zin] {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.4rem;
    white-space: nowrap;
}

.stream__note[b-r2l2qs7zin] {
    min-width: 14rem;
    line-height: 1.45;
}

.stream__row--free th[scope="row"][b-r2l2qs7zin],
.stream__row--free td[b-r2l2qs7zin] {
    color: rgba(217, 212, 200, 0.5);
}

.stream__rejectrow > td[b-r2l2qs7zin] {
    background: rgba(217, 100, 100, 0.07);
}

/* Ein Hinweis, der über dem Feld steht statt darunter. */
.stream__above[b-r2l2qs7zin] {
    margin-top: 0;
    margin-bottom: 0.3rem;
}

/* ---- Übersicht ----
   Ein Akkordeon über alle geplanten Abende. <details> kann der Browser
   von selbst, deshalb ohne JavaScript. */
.stream__board[b-r2l2qs7zin] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.stream__board-entry[b-r2l2qs7zin] {
    border: 1px solid rgba(232, 181, 63, 0.26);
    border-radius: 0.4rem;
    background: rgba(20, 18, 15, 0.4);
    overflow: hidden;
}

.stream__board-entry--past[b-r2l2qs7zin] {
    border-color: rgba(217, 212, 200, 0.14);
    opacity: 0.7;
}

.stream__board-summary[b-r2l2qs7zin] {
    display: flex;
    padding: 0.6rem 0.9rem;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.2rem 0.8rem;
    cursor: pointer;
    list-style: none;
}

.stream__board-summary[b-r2l2qs7zin]::-webkit-details-marker {
    display: none;
}

.stream__board-summary[b-r2l2qs7zin]::before {
    content: "▸";
    color: rgba(232, 181, 63, 0.8);
    font-size: 0.75rem;
}

.stream__board-entry[open] > .stream__board-summary[b-r2l2qs7zin]::before {
    content: "▾";
}

.stream__board-summary:hover[b-r2l2qs7zin] {
    background: rgba(232, 181, 63, 0.06);
}

.stream__board-day[b-r2l2qs7zin] {
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.stream__board-title[b-r2l2qs7zin] {
    flex: 1 1 12rem;
    font-weight: 700;
}

.stream__board-state[b-r2l2qs7zin] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.72rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Der offene Abend ist die Arbeitsfläche und darf breiter werden als
   ein zugeklappter Streifen. */
.stream__board-entry[open][b-r2l2qs7zin] {
    border-color: rgba(232, 181, 63, 0.5);
    background: rgba(20, 18, 15, 0.6);
}

/* ---- Da liegt etwas ----
   Ein Abend mit offenen Anmeldungen faellt aus der Reihe: rote Leiste
   und die Zahl gleich hinter dem Datum. Steht bewusst hinter der
   [open]-Regel, damit die Farbe auch beim aufgeklappten Abend bleibt —
   die Arbeit ist ja erst erledigt, wenn die Tickets entschieden sind. */
.stream__board-entry--offen[b-r2l2qs7zin],
.stream__board-entry--offen[open][b-r2l2qs7zin] {
    border-color: rgba(214, 64, 52, 0.8);
    background: rgba(58, 18, 15, 0.5);
    opacity: 1;
}

.stream__board-entry--offen > .stream__board-summary[b-r2l2qs7zin] {
    background: rgba(214, 64, 52, 0.14);
}

.stream__board-entry--offen > .stream__board-summary:hover[b-r2l2qs7zin] {
    background: rgba(214, 64, 52, 0.22);
}

.stream__board-flag[b-r2l2qs7zin] {
    padding: 0.05rem 0.45rem;
    border-radius: 999px;
    background: #d64034;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.stream__hint-alarm[b-r2l2qs7zin] {
    color: #ff7a6d;
    font-weight: 700;
}

/* ---- Das Banner im Aufbau ---- */
.stream__banner-row[b-r2l2qs7zin] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.stream__banner-preview[b-r2l2qs7zin],
.stream__banner-empty[b-r2l2qs7zin] {
    width: 16rem;
    aspect-ratio: 16 / 9;
    flex: 0 0 auto;
    border: 1px solid rgba(232, 181, 63, 0.3);
    background: #0b0a08;
    object-fit: cover;
}

.stream__banner-empty[b-r2l2qs7zin] {
    display: grid;
    place-items: center;
    color: rgba(217, 212, 200, 0.4);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.stream__banner-actions[b-r2l2qs7zin] {
    display: flex;
    min-width: 12rem;
    flex: 1 1 12rem;
    flex-direction: column;
    gap: 0.4rem;
    align-items: flex-start;
}

/* ---- Die Bildwahl ----
   Fest im Bildschirm, mittig, mit gedeckelter Breite: eine Galerie
   ueber die volle Breite eines grossen Schirms zwingt zum Wandern mit
   den Augen, ohne mehr zu zeigen. */
.stream-pick[b-r2l2qs7zin] {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    padding: clamp(0.75rem, 3vw, 2rem);
    place-items: center;
    background: rgba(0, 0, 0, 0.86);
}

.stream-pick__dialog[b-r2l2qs7zin] {
    display: flex;
    width: min(94vw, 62rem);
    max-height: 86vh;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(8, 7, 6, 0.98);
    box-shadow: 0 0 42px rgba(0, 0, 0, 0.6);
}

.stream-pick__header[b-r2l2qs7zin] {
    display: flex;
    flex: 0 0 auto;
    padding: 0.8rem 0.95rem;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.stream-pick__eyebrow[b-r2l2qs7zin] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.stream-pick__header h2[b-r2l2qs7zin] {
    margin: 0.15rem 0 0;
    color: #fcf7ea;
    font-size: 1rem;
}

/* Der kurze Weg: Datei, Titel, Knopf in einer Zeile. Bleibt oben
   stehen, die Galerie darunter scrollt. */
.stream-pick__upload[b-r2l2qs7zin] {
    display: flex;
    flex: 0 0 auto;
    padding: 0.7rem 0.95rem 0.4rem;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.stream-pick__upload input[type="file"][b-r2l2qs7zin] {
    min-width: 0;
    flex: 1 1 16rem;
}

.stream-pick__upload input[type="text"][b-r2l2qs7zin],
.stream-pick__upload input:not([type])[b-r2l2qs7zin] {
    min-width: 0;
    flex: 1 1 12rem;
}

.stream-pick__uploadhint[b-r2l2qs7zin] {
    margin: 0;
    flex: 0 0 auto;
    padding: 0 0.95rem 0.7rem;
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.78rem;
    line-height: 1.45;
}

.stream-pick__uploadhint strong[b-r2l2qs7zin] {
    color: rgba(232, 181, 63, 0.85);
}

.stream-pick__search[b-r2l2qs7zin] {
    flex: 0 0 auto;
    padding: 0.7rem 0.95rem;
    border-top: 1px solid rgba(232, 181, 63, 0.12);
    border-bottom: 1px solid rgba(232, 181, 63, 0.12);
}

/* Die Galerie scrollt fuer sich, Kopf und Suche bleiben stehen. */
.stream-pick__body[b-r2l2qs7zin] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.9rem 0.95rem 1.1rem;
    overflow-y: auto;
}

.stream-pick__hint[b-r2l2qs7zin] {
    margin: 0;
    color: rgba(217, 212, 200, 0.55);
}

.stream-pick__grid[b-r2l2qs7zin] {
    display: grid;
    gap: 0.6rem;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
}

.stream-pick__item[b-r2l2qs7zin] {
    display: grid;
    padding: 0;
    gap: 0.2rem;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.22);
    background: rgba(20, 18, 15, 0.6);
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.stream-pick__item:hover[b-r2l2qs7zin],
.stream-pick__item:focus-visible[b-r2l2qs7zin] {
    border-color: rgba(232, 181, 63, 0.75);
    background: rgba(35, 30, 20, 0.7);
}

.stream-pick__item img[b-r2l2qs7zin],
.stream-pick__nothumb[b-r2l2qs7zin] {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #0b0a08;
    object-fit: cover;
}

.stream-pick__nothumb[b-r2l2qs7zin] {
    display: grid;
    place-items: center;
    color: rgba(217, 212, 200, 0.35);
    font-size: 0.7rem;
}

.stream-pick__title[b-r2l2qs7zin] {
    padding: 0 0.5rem;
    overflow: hidden;
    color: #fcf7ea;
    font-size: 0.8rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stream-pick__meta[b-r2l2qs7zin] {
    padding: 0 0.5rem 0.5rem;
    color: rgba(217, 212, 200, 0.45);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/Admin/Tournaments/TournamentAdmin.razor.rz.scp.css */
.tournament-admin[b-31pgs69d4s] {
    display: grid;
    gap: 1rem;
}

.tournament-admin__header[b-31pgs69d4s] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
}

.tournament-admin__eyebrow[b-31pgs69d4s] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.tournament-admin__header h1[b-31pgs69d4s] {
    margin: 0.15rem 0 0.35rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.tournament-admin__header p[b-31pgs69d4s] {
    max-width: 46rem;
    margin: 0;
    color: #cbbfa6;
    font-size: 0.88rem;
}

.tournament-admin h2[b-31pgs69d4s] {
    margin: 0 0 0.9rem;
    color: #fcf7ea;
    font-size: 1.05rem;
}

.tournament-admin__empty[b-31pgs69d4s] {
    margin: 0;
    color: #9d968a;
    font-size: 0.86rem;
}

.tournament-admin__table[b-31pgs69d4s] {
    color: #e6ddcc;
    font-size: 0.85rem;
}

.tournament-admin__table th[b-31pgs69d4s] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.tournament-admin__pending[b-31pgs69d4s] {
    color: #efc763;
    font-weight: 700;
}

.tournament-admin__actions[b-31pgs69d4s] {
    display: flex;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Die aufgeklappte Bearbeitungszeile hebt sich ab, damit klar ist,
   zu welchem Turnier sie gehört. */
.tournament-admin__editrow > td[b-31pgs69d4s] {
    padding: 1rem;
    background: rgba(239, 199, 99, 0.07);
}

.tournament-admin__buttons[b-31pgs69d4s] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Das Banner wird als Streifen gezeigt, nicht als Kachel - so sieht
   man beim Hochladen gleich, wie es im Turnier aussieht. */
.tournament-admin__banner[b-31pgs69d4s] {
    display: flex;
    height: 100%;
    min-height: 6rem;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(230, 221, 204, 0.16);
    border-radius: 0.4rem;
    background: rgba(0, 0, 0, 0.25);
}

.tournament-admin__banner img[b-31pgs69d4s] {
    display: block;
    width: 100%;
    max-height: 10rem;
    object-fit: cover;
}

.tournament-admin__banner-empty[b-31pgs69d4s] {
    color: #9d968a;
    font-size: 0.82rem;
}
/* /Components/Pages/Assets/AssetArchive.razor.rz.scp.css */
/* Gleiche Optik wie die Mapbibliothek: dunkler Grund, Bernstein als
   Akzent. Was dort .map-* heisst, heisst hier .asset-*. */

.asset-archive[b-otma8vrf9e] {
    display: grid;
    gap: 1.1rem;
}

.asset-archive__header[b-otma8vrf9e] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.asset-archive__header h1[b-otma8vrf9e] {
    margin: 0.2rem 0 0.45rem;
}

.asset-archive__header p[b-otma8vrf9e] {
    max-width: 52rem;
    margin: 0;
    color: rgba(217, 212, 200, 0.82);
}

.asset-archive__eyebrow[b-otma8vrf9e],
.asset-editor__heading span:first-child[b-otma8vrf9e] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.asset-archive__count[b-otma8vrf9e] {
    display: inline-flex;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
    align-items: center;
    color: #faf2dd;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-radius: 999px;
    background: rgba(28, 21, 4, 0.66);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    white-space: nowrap;
}

.asset-archive__hint[b-otma8vrf9e] {
    margin: 0;
    padding: 1.4rem;
    color: rgba(217, 212, 200, 0.72);
    border: 1px dashed rgba(232, 181, 63, 0.22);
    border-radius: 0.55rem;
    text-align: center;
}

.asset-filter[b-otma8vrf9e],
.asset-editor[b-otma8vrf9e],
.asset-edit[b-otma8vrf9e] {
    border-color: rgba(232, 181, 63, 0.28);
    background: rgba(2, 13, 7, 0.76);
}

.asset-filter__tags[b-otma8vrf9e] {
    display: flex;
    margin-top: 0.9rem;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.asset-editor__heading[b-otma8vrf9e] {
    display: flex;
    margin-bottom: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.asset-editor__heading h2[b-otma8vrf9e] {
    margin: 0.15rem 0 0;
    color: #faf3e2;
    font-size: 1.15rem;
}

/* ------------------------------------------------------ Raster */

.asset-grid[b-otma8vrf9e] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    gap: 1rem;
}

.asset-card[b-otma8vrf9e] {
    display: flex;
    min-width: 0;
    padding: 0.7rem;
    flex-direction: column;
    gap: 0.4rem;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.55rem;
    background:
        linear-gradient(
            145deg,
            rgba(25, 20, 8, 0.88),
            rgba(3, 7, 5, 0.92)
        );
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.asset-card--inactive[b-otma8vrf9e] {
    opacity: 0.5;
    border-style: dashed;
}

/* Schachbrett, damit freigestellte Grafiken als solche erkennbar sind */
.asset-card__thumb[b-otma8vrf9e] {
    display: flex;
    height: 9rem;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 0.4rem;
    background-color: rgba(0, 0, 0, 0.35);
    background-image:
        linear-gradient(45deg, rgba(255, 255, 255, 0.05) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(255, 255, 255, 0.05) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, 0.05) 75%),
        linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, 0.05) 75%);
    background-size: 14px 14px;
    background-position: 0 0, 0 7px, 7px -7px, -7px 0;
}

.asset-card__thumb img[b-otma8vrf9e] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.asset-card__ext[b-otma8vrf9e] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.asset-card__title[b-otma8vrf9e] {
    margin: 0;
    overflow: hidden;
    color: #faf3e2;
    font-size: 0.88rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-card__meta[b-otma8vrf9e] {
    margin: 0;
    color: rgba(217, 212, 200, 0.62);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
}

.asset-card__tags[b-otma8vrf9e] {
    margin: 0;
    overflow: hidden;
    color: rgba(232, 181, 63, 0.72);
    font-size: 0.68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-card__actions[b-otma8vrf9e] {
    display: flex;
    margin-top: auto;
    padding-top: 0.35rem;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.asset-edit__actions[b-otma8vrf9e] {
    display: flex;
    gap: 0.5rem;
}

@media (max-width: 40rem) {
    .asset-archive__header[b-otma8vrf9e] {
        flex-direction: column;
    }

    .asset-grid[b-otma8vrf9e] {
        grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr));
    }
}

/* ------------------------------------------------------ Reiter */

.asset-tabs[b-otma8vrf9e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
    padding-bottom: 0.5rem;
}

.asset-tabs__item[b-otma8vrf9e] {
    padding: 0.4rem 0.9rem;
    color: rgba(217, 212, 200, 0.72);
    border: 1px solid transparent;
    border-radius: 0.4rem;
    background: transparent;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
}

.asset-tabs__item:hover[b-otma8vrf9e] {
    color: #faf2dd;
    border-color: rgba(232, 181, 63, 0.28);
}

.asset-tabs__item--active[b-otma8vrf9e] {
    color: #faf2dd;
    border-color: rgba(232, 181, 63, 0.55);
    background: rgba(28, 21, 4, 0.66);
}

.asset-archive__note[b-otma8vrf9e] {
    margin: 0.8rem 0 0;
    color: rgba(217, 212, 200, 0.62);
    font-size: 0.8rem;
}

/* ------------------------------------------- Frühere Fassungen */

.asset-versions[b-otma8vrf9e] {
    margin-top: 1.2rem;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(232, 181, 63, 0.22);
}

.asset-versions__row[b-otma8vrf9e] {
    display: flex;
    margin-top: 0.5rem;
    padding: 0.45rem 0.6rem;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    border: 1px solid rgba(232, 181, 63, 0.16);
    border-radius: 0.4rem;
    background: rgba(0, 0, 0, 0.22);
}

.asset-versions__when[b-otma8vrf9e] {
    color: #faf2dd;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.76rem;
    font-weight: 800;
}

.asset-versions__meta[b-otma8vrf9e] {
    flex: 1 1 12rem;
    color: rgba(217, 212, 200, 0.62);
    font-size: 0.76rem;
}
/* /Components/Pages/Elo/EloAbsenceCalendar.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Abwesenheitskalender
   ------------------------------------------------------------------ */

.absence[b-5fnpkl3un9] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.absence__header[b-5fnpkl3un9] {
    display: flex;
    margin-bottom: 1.2rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.absence__eyebrow[b-5fnpkl3un9] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.absence h1[b-5fnpkl3un9] {
    margin: 0.2rem 0 0.4rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.absence__lead[b-5fnpkl3un9] {
    margin: 0;
    max-width: 42rem;
    color: rgba(217, 212, 200, 0.72);
}

.absence__nav[b-5fnpkl3un9] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    flex-wrap: wrap;
}

.absence__month[b-5fnpkl3un9] {
    min-width: 10rem;
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-align: center;
    text-transform: uppercase;
}

.absence__key[b-5fnpkl3un9] {
    padding: 0.36rem 0.8rem 0.32rem;
    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;
    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}

.absence__key:hover:not(:disabled)[b-5fnpkl3un9],
.absence__key:focus-visible:not(:disabled)[b-5fnpkl3un9] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
}

.absence__key:disabled[b-5fnpkl3un9] {
    opacity: 0.5;
    cursor: default;
}

.absence__key--stop[b-5fnpkl3un9] {
    border-color:
        rgba(214, 90, 70, 0.7) rgba(90, 30, 22, 0.9)
        rgba(90, 30, 22, 0.9) rgba(214, 90, 70, 0.7);
    background: linear-gradient(180deg, #4a1c14 0%, #2c110c 100%);
    color: #ffb9a8;
}

.absence__muted[b-5fnpkl3un9] {
    color: rgba(217, 212, 200, 0.55);
}

.absence__count[b-5fnpkl3un9] {
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.76rem;
    letter-spacing: 0.06em;
}

.absence__note[b-5fnpkl3un9] {
    padding: 0.6rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(232, 181, 63, 0.08);
    color: #efc763;
}

.absence__note--bad[b-5fnpkl3un9] {
    border-color: rgba(214, 90, 70, 0.5);
    background: rgba(214, 90, 70, 0.1);
    color: #ffb9a8;
}

/* ---- Das Monatsblatt ---- */
.absence__grid[b-5fnpkl3un9] {
    display: grid;
    gap: 2px;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    border: 1px solid rgba(232, 181, 63, 0.2);
    background: rgba(232, 181, 63, 0.12);
}

.absence__weekday[b-5fnpkl3un9] {
    padding: 0.35rem 0.4rem;
    background: rgba(11, 10, 8, 0.9);
    color: rgba(232, 181, 63, 0.75);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-align: center;
    text-transform: uppercase;
}

.absence__cell[b-5fnpkl3un9] {
    display: flex;
    min-height: 5.5rem;
    padding: 0.3rem;
    flex-direction: column;
    gap: 0.2rem;
    background: rgba(20, 18, 15, 0.85);
}

.absence__cell--empty[b-5fnpkl3un9] {
    background: rgba(11, 10, 8, 0.55);
}

.absence__cell.is-weekend[b-5fnpkl3un9] {
    background: rgba(26, 22, 16, 0.85);
}

.absence__cell.is-today[b-5fnpkl3un9] {
    box-shadow: inset 0 0 0 1px rgba(232, 181, 63, 0.7);
}

.absence__cell.is-open[b-5fnpkl3un9] {
    background: rgba(45, 38, 20, 0.9);
}

.absence__cell.is-busy .absence__daynum[b-5fnpkl3un9] {
    color: #ffe08a;
}

/* Der ganze Tageskopf ist die Taste - ein kleiner Knopf neben der Zahl
   waere auf dem Handy nicht zu treffen. */
.absence__daykey[b-5fnpkl3un9] {
    display: flex;
    padding: 0;
    gap: 0.4rem;
    align-items: center;
    justify-content: space-between;
    border: 0;
    background: none;
    cursor: pointer;
}

.absence__daynum[b-5fnpkl3un9] {
    color: rgba(217, 212, 200, 0.75);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
}

.absence__dot[b-5fnpkl3un9] {
    padding: 0 0.3rem;
    border: 1px solid rgba(232, 181, 63, 0.5);
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    font-weight: 800;
}

.absence__names[b-5fnpkl3un9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.12rem;
}

.absence__name[b-5fnpkl3un9] {
    overflow: hidden;
    padding: 0.05rem 0.25rem;
    border-left: 2px solid rgba(232, 181, 63, 0.6);
    background: rgba(232, 181, 63, 0.08);
    color: rgba(252, 247, 234, 0.85);
    font-size: 0.68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.absence__name--more[b-5fnpkl3un9] {
    border-left-color: transparent;
    background: none;
    color: rgba(217, 212, 200, 0.5);
}

/* ---- Der ausgewaehlte Tag ---- */
.absence__day[b-5fnpkl3un9] {
    margin-top: 1.2rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(232, 181, 63, 0.25);
    background: rgba(20, 18, 15, 0.55);
}

.absence__day h2[b-5fnpkl3un9] {
    margin: 0 0 0.6rem;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.absence__list[b-5fnpkl3un9] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.absence__list > li[b-5fnpkl3un9] {
    display: flex;
    padding: 0.4rem 0;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(232, 181, 63, 0.1);
}

.absence__player[b-5fnpkl3un9] {
    color: #ffe08a;
    font-weight: 700;
    text-decoration: none;
}

.absence__player:hover[b-5fnpkl3un9],
.absence__player:focus-visible[b-5fnpkl3un9] {
    text-decoration: underline;
}

.absence__span[b-5fnpkl3un9] {
    margin-left: 0.6rem;
    color: rgba(217, 212, 200, 0.75);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.74rem;
}

.absence__season[b-5fnpkl3un9] {
    display: block;
    color: rgba(217, 212, 200, 0.45);
    font-size: 0.74rem;
}

.absence__cancel[b-5fnpkl3un9] {
    display: block;
    padding: 0.6rem 0;
}

.absence__label[b-5fnpkl3un9] {
    display: block;
    margin-bottom: 0.3rem;
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.absence__formkeys[b-5fnpkl3un9] {
    display: flex;
    margin-top: 0.5rem;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* Auf schmalen Schirmen wird aus dem Raster eine Liste: sieben Spalten
   auf 360 Pixeln waeren sieben Striche. */
@media (max-width: 700px) {
    .absence__grid[b-5fnpkl3un9] {
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }

    .absence__cell[b-5fnpkl3un9] {
        min-height: 3.6rem;
    }

    .absence__names[b-5fnpkl3un9] {
        display: none;
    }
}

/* ------------------------------------------------------------------
   Eintragen und ändern
   ------------------------------------------------------------------ */

.absence__key--go[b-5fnpkl3un9] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #4a3b12 0%, #2c2208 100%);
    color: #ffe08a;
}

/* Das Formular steht ueber dem Blatt, nicht in einem Fenster: nach dem
   Speichern soll man den Eintrag gleich im Kalender wiederfinden. */
.absence__form[b-5fnpkl3un9] {
    margin-bottom: 1rem;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(28, 25, 20, 0.7);
}

.absence__form h2[b-5fnpkl3un9] {
    margin: 0 0 0.7rem;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.86rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.absence__fields[b-5fnpkl3un9] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.absence__field[b-5fnpkl3un9] {
    min-width: 0;
    flex: 1 1 14rem;
}

.absence__field--small[b-5fnpkl3un9] {
    flex: 0 1 10rem;
}

.absence__field--wide[b-5fnpkl3un9] {
    flex: 2 1 20rem;
}

/* Der Satz, der den Unterschied zum Urlaubstoken festhaelt. Er steht
   im Formular und nicht in der Hilfe: gelesen wird er nur hier. */
.absence__hint[b-5fnpkl3un9] {
    margin: 0.7rem 0 0;
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.82rem;
}

.absence__hint strong[b-5fnpkl3un9] {
    color: #efc763;
}

/* ---- Der Tag ---- */
.absence__dayhead[b-5fnpkl3un9] {
    display: flex;
    margin-bottom: 0.6rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.absence__dayhead h2[b-5fnpkl3un9] {
    margin: 0;
}

.absence__kind[b-5fnpkl3un9] {
    margin: 0.8rem 0 0.2rem;
    color: rgba(232, 181, 63, 0.75);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.absence__notetext[b-5fnpkl3un9] {
    margin-left: 0.6rem;
    color: rgba(252, 247, 234, 0.8);
    font-size: 0.86rem;
}

.absence__rowkeys[b-5fnpkl3un9] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* Die Notiz sieht anders aus als der Urlaub: gestrichelte Kante, kein
   Gold. Wer aufs Blatt schaut, soll ohne Legende sehen, was Punkte
   schuetzt und was nur Bescheid sagt. */
.absence__name--note[b-5fnpkl3un9] {
    border-left: 2px dashed rgba(160, 190, 220, 0.7);
    background: rgba(120, 160, 200, 0.12);
    color: rgba(226, 238, 250, 0.85);
}
/* /Components/Pages/Elo/EloArchive.razor.rz.scp.css */
.season-archive-list[b-55ksrmww6o] {
    display: grid;
    gap: 1rem;
}

.season-archive-entry__title[b-55ksrmww6o] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.season-archive-entry__title > div > span[b-55ksrmww6o],
.season-archive-entry__title small[b-55ksrmww6o],
.season-archive-entry__facts span[b-55ksrmww6o] {
    color: rgba(226, 210, 170, 0.82);
}

.season-archive-entry__title h2[b-55ksrmww6o] {
    margin: 0.2rem 0;
    color: #faf2de;
    font-size: 1.2rem;
}

.season-archive-entry__facts[b-55ksrmww6o] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
}

.season-archive-entry__facts > div[b-55ksrmww6o] {
    display: flex;
    flex-direction: column;
    padding: 0.8rem;
    border: 1px solid rgba(255, 203, 70, 0.18);
    border-radius: 0.65rem;
    background: rgba(2, 12, 7, 0.62);
}

.season-archive-entry__facts strong[b-55ksrmww6o] {
    margin-top: 0.2rem;
    color: #faf2de;
}

@media (max-width: 650px) {
    .season-archive-entry__facts[b-55ksrmww6o] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Elo/EloHistory.razor.rz.scp.css */
.history-intro[b-odrhn7dssr] {
    max-width: 70rem;
    margin-top: -0.75rem;
    margin-bottom: 1.75rem;
}

.history-stats[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.history-stat[b-odrhn7dssr] {
    position: relative;
    overflow: hidden;
    padding: 1rem 1.15rem;
    border: 1px solid var(--vx-border);
    border-radius: 0.35rem;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.035),
            transparent 42%
        ),
        var(--vx-panel);
    box-shadow: var(--vx-shadow);
}

.history-stat[b-odrhn7dssr]::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 2px;
    content: "";
    background:
        linear-gradient(
            90deg,
            var(--vx-red),
            var(--vx-gold),
            transparent
        );
}

.history-stat span[b-odrhn7dssr] {
    display: block;
    color: var(--vx-gray-500);
    font-family: var(--vx-font-mono);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.history-stat strong[b-odrhn7dssr] {
    display: block;
    margin-top: 0.35rem;
    color: var(--vx-gold-bright);
    font-family: var(--vx-font-mono);
    font-size: 1.65rem;
}

.history-list[b-odrhn7dssr] {
    display: grid;
    gap: 1.35rem;
}

.history-match[b-odrhn7dssr] {
    overflow: hidden;
    border: 1px solid var(--vx-border);
    border-radius: 0.4rem;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.025),
            transparent 38%
        ),
        var(--vx-panel);
    box-shadow: var(--vx-shadow);
}

.history-match__header[b-odrhn7dssr] {
    display: flex;
    padding: 1.15rem 1.25rem;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(201, 163, 74, 0.2);
    background:
        linear-gradient(
            90deg,
            rgba(196, 20, 34, 0.16),
            rgba(201, 163, 74, 0.04)
        );
}

.history-season[b-odrhn7dssr] {
    color: var(--vx-gold);
    font-family: var(--vx-font-mono);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.history-match__header h2[b-odrhn7dssr] {
    margin: 0.35rem 0 0;
    font-size: clamp(1rem, 2vw, 1.35rem);
}

.history-match__header h2 span[b-odrhn7dssr] {
    margin-inline: 0.35rem;
    color: var(--vx-gray-500);
    font-size: 0.72em;
    font-weight: 500;
}

.history-header-status[b-odrhn7dssr] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.history-sequence[b-odrhn7dssr],
.history-status[b-odrhn7dssr] {
    display: inline-flex;
    min-height: 1.85rem;
    padding: 0.32rem 0.55rem;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    font-family: var(--vx-font-mono);
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.history-sequence[b-odrhn7dssr] {
    color: var(--vx-gray-300);
    background: rgba(0, 0, 0, 0.25);
}

.history-status--approved[b-odrhn7dssr] {
    color: #f7ecd1;
    border-color: rgba(184, 156, 84, 0.55);
    background: rgba(108, 86, 31, 0.5);
}

.history-status--rejected[b-odrhn7dssr] {
    color: #ffc2c8;
    border-color: rgba(239, 38, 56, 0.54);
    background: rgba(111, 7, 19, 0.58);
}

.history-status--voided[b-odrhn7dssr] {
    color: #f0d9a7;
    border-color: rgba(201, 163, 74, 0.55);
    background: rgba(95, 63, 11, 0.55);
}

.history-match__body[b-odrhn7dssr] {
    display: grid;
    gap: 1.15rem;
    padding: 1.25rem;
}

.history-versus[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(10rem, 0.7fr)
        minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
}

.history-player[b-odrhn7dssr],
.history-outcome[b-odrhn7dssr] {
    display: flex;
    min-height: 7rem;
    padding: 1rem;
    flex-direction: column;
    justify-content: center;
    border: 1px solid var(--vx-border-soft);
    border-radius: 0.3rem;
    background: rgba(0, 0, 0, 0.22);
}

.history-player--right[b-odrhn7dssr] {
    text-align: right;
}

.history-player span[b-odrhn7dssr],
.history-outcome span[b-odrhn7dssr],
.history-facts span[b-odrhn7dssr],
.history-rating__player > span[b-odrhn7dssr],
.history-comments span[b-odrhn7dssr] {
    color: var(--vx-gray-500);
    font-family: var(--vx-font-mono);
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.history-player strong[b-odrhn7dssr] {
    margin-block: 0.25rem;
    font-size: 1.15rem;
}

.history-player small[b-odrhn7dssr] {
    color: var(--vx-gold);
}

.history-outcome[b-odrhn7dssr] {
    align-items: center;
    text-align: center;
    border-color: rgba(196, 20, 34, 0.3);
    background:
        radial-gradient(
            circle,
            rgba(196, 20, 34, 0.17),
            rgba(0, 0, 0, 0.28)
        );
}

.history-outcome strong[b-odrhn7dssr] {
    margin-top: 0.4rem;
    color: #fff;
    font-family: var(--vx-font-mono);
    font-size: 0.92rem;
}

.history-facts[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    border: 1px solid var(--vx-border-soft);
    border-radius: 0.3rem;
    background: rgba(0, 0, 0, 0.18);
}

.history-facts > div[b-odrhn7dssr] {
    min-width: 0;
    padding: 0.85rem 1rem;
    border-right: 1px solid var(--vx-border-soft);
}

.history-facts > div:last-child[b-odrhn7dssr] {
    border-right: 0;
}

.history-facts span[b-odrhn7dssr] {
    display: block;
    margin-bottom: 0.3rem;
}

.history-facts strong[b-odrhn7dssr] {
    overflow-wrap: anywhere;
}

.history-rating[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.history-rating__player[b-odrhn7dssr] {
    padding: 1rem;
    border: 1px solid rgba(201, 163, 74, 0.2);
    border-radius: 0.3rem;
    background:
        linear-gradient(
            135deg,
            rgba(201, 163, 74, 0.06),
            rgba(0, 0, 0, 0.26)
        );
}

.history-rating__player > div[b-odrhn7dssr] {
    display: flex;
    margin-block: 0.45rem;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.history-rating__player strong[b-odrhn7dssr] {
    font-family: var(--vx-font-mono);
    font-size: 1.2rem;
}

.history-arrow[b-odrhn7dssr] {
    color: var(--vx-gray-500);
}

.history-delta[b-odrhn7dssr] {
    padding: 0.22rem 0.42rem;
    border-radius: 0.22rem;
    font-family: var(--vx-font-mono);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 900;
}

.history-delta--positive[b-odrhn7dssr] {
    color: #f6e8c5;
    background: rgba(131, 103, 33, 0.45);
}

.history-delta--negative[b-odrhn7dssr] {
    color: #ffc0c6;
    background: rgba(150, 9, 25, 0.48);
}

.history-rating__player small[b-odrhn7dssr] {
    color: var(--vx-gray-500);
}

.history-calculation[b-odrhn7dssr] {
    border: 1px solid var(--vx-border-soft);
    border-radius: 0.3rem;
    background: rgba(0, 0, 0, 0.17);
}

.history-calculation summary[b-odrhn7dssr] {
    padding: 0.75rem 0.9rem;
    cursor: pointer;
    color: var(--vx-gold);
    font-family: var(--vx-font-mono);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.history-calculation > div[b-odrhn7dssr] {
    display: flex;
    padding: 0 0.9rem 0.85rem;
    gap: 1.25rem;
    flex-wrap: wrap;
    color: var(--vx-gray-300);
}

.history-timeline[b-odrhn7dssr] {
    padding: 1rem;
    border: 1px solid var(--vx-border-soft);
    border-radius: 0.3rem;
    background: rgba(0, 0, 0, 0.17);
}

.history-timeline h3[b-odrhn7dssr],
.history-section-title h3[b-odrhn7dssr] {
    margin: 0;
    font-size: 0.78rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.history-timeline__items[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.8rem;
    margin-top: 0.85rem;
}

.history-timeline__items > div[b-odrhn7dssr] {
    position: relative;
    padding-left: 1rem;
    border-left: 2px solid var(--vx-red);
}

.history-timeline__items span[b-odrhn7dssr],
.history-timeline__items strong[b-odrhn7dssr],
.history-timeline__items small[b-odrhn7dssr] {
    display: block;
}

.history-timeline__items span[b-odrhn7dssr] {
    color: var(--vx-gray-500);
    font-family: var(--vx-font-mono);
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.history-timeline__items small[b-odrhn7dssr] {
    margin-top: 0.18rem;
    color: var(--vx-gray-500);
}

.history-timeline__items
.history-timeline__void[b-odrhn7dssr] {
    border-left-color: var(--vx-gold);
}

.history-comments[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        repeat(auto-fit, minmax(16rem, 1fr));
    gap: 0.8rem;
}

.history-comments > div[b-odrhn7dssr] {
    padding: 0.9rem;
    border: 1px solid var(--vx-border-soft);
    border-radius: 0.3rem;
    background: rgba(0, 0, 0, 0.2);
}

.history-comments p[b-odrhn7dssr] {
    margin: 0.4rem 0 0;
    white-space: pre-wrap;
}

.history-comment--danger[b-odrhn7dssr] {
    border-color: rgba(201, 163, 74, 0.35)
        !important;
}

.history-evidence[b-odrhn7dssr] {
    padding-top: 0.3rem;
}

.history-section-title[b-odrhn7dssr] {
    display: flex;
    margin-bottom: 0.75rem;
    align-items: center;
    gap: 0.55rem;
}

.history-section-title > span[b-odrhn7dssr] {
    display: inline-grid;
    min-width: 1.55rem;
    height: 1.55rem;
    padding-inline: 0.25rem;
    place-items: center;
    color: #111;
    border-radius: 999px;
    background: var(--vx-gold);
    font-family: var(--vx-font-mono);
    font-size: 0.66rem;
    font-weight: 900;
}

.history-empty-evidence[b-odrhn7dssr] {
    margin: 0;
    padding: 0.8rem;
    border: 1px dashed var(--vx-border-soft);
    border-radius: 0.3rem;
}

.history-thumbnails[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        repeat(auto-fill, minmax(145px, 1fr));
    gap: 0.75rem;
}

.history-thumbnail[b-odrhn7dssr] {
    display: grid;
    padding: 0;
    overflow: hidden;
    cursor: zoom-in;
    color: var(--vx-gray-100);
    border: 1px solid rgba(201, 163, 74, 0.28);
    border-radius: 0.3rem;
    background: #08090a;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
    transition:
        transform 130ms ease,
        border-color 130ms ease,
        box-shadow 130ms ease;
}

.history-thumbnail:hover[b-odrhn7dssr] {
    transform: translateY(-2px);
    border-color: var(--vx-gold);
    box-shadow:
        0 12px 28px rgba(0, 0, 0, 0.42),
        0 0 18px rgba(201, 163, 74, 0.18);
}

.history-thumbnail img[b-odrhn7dssr] {
    width: 100%;
    aspect-ratio: 16 / 10;
    display: block;
    object-fit: cover;
    background: #030405;
}

.history-thumbnail span[b-odrhn7dssr] {
    padding: 0.48rem 0.55rem;
    overflow: hidden;
    font-family: var(--vx-font-mono);
    font-size: 0.58rem;
    font-weight: 700;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.history-lightbox[b-odrhn7dssr] {
    position: fixed;
    z-index: 20000;
    inset: 0;
    display: grid;
    padding: 1.25rem;
    place-items: center;
    background: rgba(0, 0, 0, 0.9);
    backdrop-filter: blur(8px);
}

.history-lightbox__panel[b-odrhn7dssr] {
    display: grid;
    width: min(96vw, 1200px);
    max-height: 94vh;
    overflow: hidden;
    border: 1px solid rgba(201, 163, 74, 0.5);
    border-radius: 0.4rem;
    background: #0b0d0e;
    box-shadow:
        0 24px 80px rgba(0, 0, 0, 0.75),
        0 0 28px rgba(196, 20, 34, 0.18);
}

.history-lightbox__panel header[b-odrhn7dssr] {
    display: flex;
    min-width: 0;
    padding: 0.8rem 1rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid var(--vx-border);
}

.history-lightbox__panel header > div[b-odrhn7dssr] {
    min-width: 0;
}

.history-lightbox__panel header strong[b-odrhn7dssr],
.history-lightbox__panel header small[b-odrhn7dssr] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.history-lightbox__panel header small[b-odrhn7dssr] {
    margin-top: 0.2rem;
    color: var(--vx-gray-500);
}

.history-lightbox__close[b-odrhn7dssr] {
    width: 2.5rem;
    height: 2.5rem;
    flex: 0 0 auto;
    cursor: pointer;
    color: #fff;
    border: 1px solid rgba(239, 38, 56, 0.6);
    border-radius: 0.3rem;
    background: rgba(135, 7, 21, 0.65);
    font-size: 1.65rem;
    line-height: 1;
}

.history-lightbox__image[b-odrhn7dssr] {
    display: grid;
    min-height: 0;
    overflow: auto;
    place-items: center;
    background:
        repeating-conic-gradient(
            #0a0b0c 0 25%,
            #111315 0 50%
        ) 0 0 / 24px 24px;
}

.history-lightbox__image img[b-odrhn7dssr] {
    display: block;
    max-width: 100%;
    max-height: calc(94vh - 8rem);
    object-fit: contain;
}

.history-lightbox__panel footer[b-odrhn7dssr] {
    padding: 0.75rem 1rem;
    color: var(--vx-gray-300);
    border-top: 1px solid var(--vx-border);
    white-space: pre-wrap;
}

@media (max-width: 991.98px) {
    .history-stats[b-odrhn7dssr],
    .history-facts[b-odrhn7dssr] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .history-facts > div:nth-child(2)[b-odrhn7dssr] {
        border-right: 0;
    }

    .history-facts > div:nth-child(-n + 2)[b-odrhn7dssr] {
        border-bottom: 1px solid
            var(--vx-border-soft);
    }

    .history-versus[b-odrhn7dssr] {
        grid-template-columns: 1fr;
    }

    .history-player--right[b-odrhn7dssr] {
        text-align: left;
    }
}

@media (max-width: 640.98px) {
    .history-stats[b-odrhn7dssr],
    .history-facts[b-odrhn7dssr],
    .history-rating[b-odrhn7dssr] {
        grid-template-columns: 1fr;
    }

    .history-match__header[b-odrhn7dssr] {
        flex-direction: column;
    }

    .history-header-status[b-odrhn7dssr] {
        justify-content: flex-start;
    }

    .history-facts > div[b-odrhn7dssr] {
        border-right: 0;
        border-bottom: 1px solid
            var(--vx-border-soft);
    }

    .history-facts > div:last-child[b-odrhn7dssr] {
        border-bottom: 0;
    }

    .history-lightbox[b-odrhn7dssr] {
        padding: 0.45rem;
    }

    .history-lightbox__panel[b-odrhn7dssr] {
        width: 100%;
        max-height: 98vh;
    }
}

@media (prefers-reduced-motion: reduce) {
    .history-thumbnail[b-odrhn7dssr] {
        transition: none;
    }
}

.history-evidence-card[b-odrhn7dssr] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(201, 163, 74, 0.28);
    border-radius: 0.32rem;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.025),
            transparent 40%
        ),
        rgba(5, 7, 8, 0.82);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}

.history-evidence-card .history-thumbnail[b-odrhn7dssr] {
    width: 100%;
    border: 0;
    border-bottom: 1px solid rgba(201, 163, 74, 0.22);
    border-radius: 0;
    box-shadow: none;
}

.history-evidence-card .history-thumbnail:hover[b-odrhn7dssr] {
    transform: none;
    border-color: rgba(201, 163, 74, 0.22);
    box-shadow:
        inset 0 0 0 2px rgba(201, 163, 74, 0.32);
}

.history-evidence-note[b-odrhn7dssr] {
    display: grid;
    gap: 0.38rem;
    padding: 0.72rem 0.78rem 0.82rem;
}

.history-evidence-note p[b-odrhn7dssr] {
    margin: 0;
    color: var(--vx-gray-100) !important;
    line-height: 1.45;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.history-evidence-note small[b-odrhn7dssr] {
    color: var(--vx-gray-500);
    font-size: 0.68rem;
    line-height: 1.35;
}

.history-yellow-card-comment[b-odrhn7dssr] {
    display: grid;
    grid-template-columns:
        minmax(8rem, 0.28fr)
        minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem 1.1rem;
    color: #f4f6f7;
    border: 1px solid rgba(240, 208, 120, 0.72);
    border-left: 5px solid #f0d078;
    border-radius: 0.34rem;
    background:
        linear-gradient(
            110deg,
            rgba(168, 123, 37, 0.28),
            rgba(22, 24, 25, 0.92) 42%
        );
    box-shadow:
        0 0 0 1px rgba(240, 208, 120, 0.08),
        0 0 22px rgba(201, 163, 74, 0.16);
}

.history-yellow-card-comment__title[b-odrhn7dssr] {
    display: flex;
    min-width: 0;
    padding-right: 1rem;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-right: 1px solid rgba(240, 208, 120, 0.28);
    text-align: center;
}

.history-yellow-card-comment__title span[b-odrhn7dssr] {
    color: #f2d98f;
    font-family: var(--vx-font-mono);
    font-size: 0.65rem;
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.history-yellow-card-comment__title strong[b-odrhn7dssr] {
    margin-top: 0.3rem;
    color: #fff4ce;
    font-family: var(--vx-font-mono);
    font-size: 1.45rem;
}

.history-yellow-card-comment h3[b-odrhn7dssr] {
    margin: 0 0 0.45rem;
    color: #ffe8a7;
    font-size: 0.78rem;
    letter-spacing: 0.065em;
    text-transform: uppercase;
}

.history-yellow-card-comment p[b-odrhn7dssr] {
    margin: 0;
    color: #f1f3f4 !important;
    line-height: 1.58;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.history-yellow-card-comment
.history-yellow-card-comment__empty[b-odrhn7dssr] {
    color: #c8cdd1 !important;
    font-style: italic;
}

@media (max-width: 640.98px) {
    .history-yellow-card-comment[b-odrhn7dssr] {
        grid-template-columns: 1fr;
    }

    .history-yellow-card-comment__title[b-odrhn7dssr] {
        padding-right: 0;
        padding-bottom: 0.75rem;
        border-right: 0;
        border-bottom: 1px solid
            rgba(240, 208, 120, 0.28);
    }
}



/* Einzelauswahl-Akkordeon für die Match-History */
.history-match__header[b-odrhn7dssr] {
    position: relative;
    border-bottom: 0;
    cursor: pointer;
    transition:
        border-color 160ms ease,
        background 160ms ease,
        box-shadow 160ms ease;
}

.history-match:hover .history-match__header[b-odrhn7dssr] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.13),
            rgba(232, 181, 63, 0.035)
        );
}

.history-match--open .history-match__header[b-odrhn7dssr] {
    border-bottom: 1px solid rgba(232, 181, 63, 0.34);
    box-shadow: inset 4px 0 0 rgba(232, 181, 63, 0.72);
}

.history-match__header > div[b-odrhn7dssr] {
    position: relative;
    z-index: 1;
    pointer-events: none;
}

.history-match__toggle[b-odrhn7dssr] {
    position: absolute;
    z-index: 2;
    inset: 0;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: inherit;
    background: transparent;
    cursor: pointer;
}

.history-match__toggle:focus-visible[b-odrhn7dssr] {
    outline: 2px solid var(--vx-gold-bright);
    outline-offset: -4px;
}

.history-accordion-chevron[b-odrhn7dssr] {
    display: inline-grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    flex: 0 0 auto;
    color: var(--vx-gold-bright);
    border: 1px solid rgba(232, 181, 63, 0.38);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
    font-size: 1.15rem;
    line-height: 1;
    transform: rotate(0deg);
    transition: transform 180ms ease;
}

.history-match--open .history-accordion-chevron[b-odrhn7dssr] {
    transform: rotate(180deg);
}

.history-match__body[b-odrhn7dssr] {
    border-top: 1px solid rgba(232, 181, 63, 0.12);
}

/* Gewinner bereits im eingeklappten Match hervorheben */
.history-match__header h2.history-matchup[b-odrhn7dssr] {
    display: flex;
    margin-top: 0.35rem;
    align-items: center;
    gap: 0.42rem;
    flex-wrap: wrap;
}

.history-match__header
h2.history-matchup span[b-odrhn7dssr] {
    margin-inline: 0;
    font-size: inherit;
    font-weight: inherit;
}

.history-player-name[b-odrhn7dssr] {
    display: inline-flex;
    min-width: 0;
    padding: 0.24rem 0.46rem;
    align-items: center;
    gap: 0.34rem;
    color: var(--vx-gray-100);
    border: 1px solid transparent;
    border-radius: 0.3rem;
    line-height: 1.2;
}

.history-player-name__text[b-odrhn7dssr] {
    overflow-wrap: anywhere;
}

.history-player-name--winner[b-odrhn7dssr] {
    color: #fff1b8;
    border-color: rgba(226, 187, 80, 0.82);
    background:
        linear-gradient(
            135deg,
            rgba(201, 163, 74, 0.24),
            rgba(111, 76, 9, 0.13)
        );
    box-shadow:
        inset 0 0 0 1px rgba(255, 230, 151, 0.08),
        0 0 14px rgba(201, 163, 74, 0.17);
    text-shadow: 0 0 9px rgba(255, 221, 121, 0.2);
}

.history-winner-crown[b-odrhn7dssr] {
    display: inline-grid;
    width: 1.08rem;
    height: 1.08rem;
    place-items: center;
    flex: 0 0 auto;
    color: var(--vx-gold-bright);
    font-family: serif;
    font-size: 0.88em !important;
    line-height: 1;
    filter: drop-shadow(0 0 5px rgba(255, 220, 112, 0.42));
}

.history-matchup__versus[b-odrhn7dssr] {
    color: var(--vx-gray-500);
    font-size: 0.72em !important;
    font-weight: 500 !important;
}

@media (max-width: 640.98px) {
    .history-match__header h2.history-matchup[b-odrhn7dssr] {
        gap: 0.3rem;
    }

    .history-player-name[b-odrhn7dssr] {
        padding: 0.2rem 0.38rem;
    }
}

/* ------------------------------------------------------------------
   Begruendungen der gelben Karten. Ein Block je Spieler, darin eine
   Zeile je Karte mit ihrer Nummer.
   ------------------------------------------------------------------ */
.history-card-notes[b-odrhn7dssr] {
    display: grid;
    gap: 0.3rem;
}

.history-card-notes + .history-card-notes[b-odrhn7dssr] {
    margin-top: 0.75rem;
}

.history-card-notes__player[b-odrhn7dssr] {
    color: #f0d078;
    font-family: var(--vx-font-mono);
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.history-card-notes__list[b-odrhn7dssr] {
    display: grid;
    gap: 0.3rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.history-card-notes__list li[b-odrhn7dssr] {
    display: grid;
    grid-template-columns: 1.6rem minmax(0, 1fr);
    gap: 0.35rem;
    color: #f4f6f7;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.history-card-notes__list li > span[b-odrhn7dssr] {
    color: rgba(240, 208, 120, 0.8);
    font-family: var(--vx-font-mono);
    font-weight: 800;
    text-align: right;
}

.history-card-notes p[b-odrhn7dssr] {
    margin: 0;
    color: #f4f6f7;
    line-height: 1.45;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}


/* ---------------------------------------------------------------------
   Gelbe Karte am geschlossenen Akkordeon

   Wer die Liste ueberfliegt, soll ohne Aufklappen sehen, dass in diesem
   Match eine Karte gefallen ist. Die Zahl daneben ist die Summe beider
   Spieler; wer sie einzeln braucht, faehrt mit der Maus darueber oder
   klappt auf.
   --------------------------------------------------------------------- */

.history-yellow-card[b-odrhn7dssr] {
    display: inline-flex;
    min-height: 1.85rem;
    padding: 0.32rem 0.5rem;
    align-items: center;
    gap: 0.32rem;
    border: 1px solid rgba(214, 178, 46, 0.55);
    border-radius: 999px;
    background: rgba(94, 74, 12, 0.45);
}

.history-yellow-card__sheet[b-odrhn7dssr] {
    display: block;
    width: 0.58rem;
    height: 0.82rem;
    flex: 0 0 auto;
    border-radius: 0.1rem;
    background: linear-gradient(180deg, #ffe066 0%, #e0b323 100%);
    box-shadow: 0 0 5px rgba(255, 220, 112, 0.5);
}

.history-yellow-card__count[b-odrhn7dssr] {
    color: #f7e9b8;
    font-family: var(--vx-font-mono);
    font-size: 0.62rem;
    font-weight: 900;
    line-height: 1;
}
/* /Components/Pages/Elo/EloLeaderboard.razor.rz.scp.css */
.leaderboard-search[b-2q5aigm89k] {
    position: relative;
    padding: 1rem;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.28);
    border-radius: 0.34rem;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.018) 0,
            rgba(232, 181, 63, 0.018) 1px,
            transparent 1px,
            transparent 8px
        ),
        linear-gradient(
            115deg,
            rgba(232, 181, 63, 0.075),
            rgba(13, 15, 16, 0.94) 44%
        );
    box-shadow:
        0 12px 34px rgba(0, 0, 0, 0.3),
        inset 3px 0 0 rgba(232, 181, 63, 0.7);
}

.leaderboard-search__heading[b-2q5aigm89k] {
    display: flex;
    margin-bottom: 0.7rem;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

.leaderboard-search__hint[b-2q5aigm89k] {
    color: #bbc1c4;
    font-size: 0.78rem;
}

.leaderboard-search__count[b-2q5aigm89k] {
    flex: 0 0 auto;
    color: #ffe08a;
    font-family: var(--vx-font-mono);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.leaderboard-search .input-group-text[b-2q5aigm89k] {
    min-width: 3rem;
    justify-content: center;
    color: #ffe08a;
    font-family: var(--vx-font-mono);
    font-weight: 900;
}

.leaderboard-search input[type="search"][b-2q5aigm89k] {
    min-width: 12rem;
}

.leaderboard-player-name[b-2q5aigm89k] {
    color: #f5f4f2;
    font-weight: 700;
}

@media (max-width: 575.98px) {
    .leaderboard-search__heading[b-2q5aigm89k] {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.35rem;
    }
}

.leaderboard-heading[b-2q5aigm89k] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem;
}

.leaderboard-subtitle[b-2q5aigm89k] {
    color: rgba(226, 210, 170, 0.88) !important;
}

.leaderboard-season-switch[b-2q5aigm89k] {
    width: min(100%, 34rem);
    flex: 0 1 34rem;
}

.leaderboard-season-switch .form-label[b-2q5aigm89k] {
    color: #ffe08a;
}

@media (max-width: 767.98px) {
    .leaderboard-heading[b-2q5aigm89k] {
        align-items: stretch;
        flex-direction: column;
    }

    .leaderboard-season-switch[b-2q5aigm89k] {
        width: 100%;
        flex-basis: auto;
    }
}

.disqualification-card[b-2q5aigm89k] {
    border-color: rgba(196, 43, 43, 0.56);
    box-shadow: 0 0 1.4rem rgba(196, 43, 43, 0.12);
}

.disqualification-card .card-header[b-2q5aigm89k] {
    background: rgba(92, 14, 14, 0.52);
}

.leaderboard-player-link[b-2q5aigm89k] {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: #f5f4f2;
    text-decoration: none;
}

.leaderboard-player-link:hover[b-2q5aigm89k],
.leaderboard-player-link:focus-visible[b-2q5aigm89k] {
    color: #ffe08a;
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}

.leaderboard-player-avatar[b-2q5aigm89k] {
    display: grid;
    width: 2.35rem;
    flex: 0 0 2.35rem;
    aspect-ratio: 1;
    place-items: center;
    object-fit: cover;
    overflow: hidden;
    border: 2px solid rgba(232, 181, 63, 0.62);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.45);
}

.leaderboard-player-avatar--fallback[b-2q5aigm89k] {
    color: #ffe08a;
    font-family: var(--vx-font-mono);
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.02em;
}

/* ------------------------------------------------------------------
   Ligafarben
   Jede Liga trägt ihren Metallton: eine kräftige Variante für Schrift
   und Kante, eine ausgewaschene für den Hintergrund des Ligakopfs.
   ------------------------------------------------------------------ */

.league-band[b-2q5aigm89k],
.league-row[b-2q5aigm89k] {
    --league-tone: #ffe08a;
    --league-wash: rgba(255, 222, 140, 0.14);
}

.league-band--diamond[b-2q5aigm89k],
.league-row--diamond[b-2q5aigm89k] {
    --league-tone: #7fe4f5;
    --league-wash: rgba(127, 228, 245, 0.16);
}

.league-band--platinum[b-2q5aigm89k],
.league-row--platinum[b-2q5aigm89k] {
    --league-tone: #a9c6de;
    --league-wash: rgba(169, 198, 222, 0.15);
}

.league-band--gold[b-2q5aigm89k],
.league-row--gold[b-2q5aigm89k] {
    --league-tone: #f0c437;
    --league-wash: rgba(240, 196, 55, 0.15);
}

.league-band--silver[b-2q5aigm89k],
.league-row--silver[b-2q5aigm89k] {
    --league-tone: #c3cbd2;
    --league-wash: rgba(195, 203, 210, 0.14);
}

.league-band--bronze[b-2q5aigm89k],
.league-row--bronze[b-2q5aigm89k] {
    --league-tone: #b87a45;
    --league-wash: rgba(184, 122, 69, 0.17);
}

.league-band--copper[b-2q5aigm89k],
.league-row--copper[b-2q5aigm89k] {
    --league-tone: #e2743c;
    --league-wash: rgba(226, 116, 60, 0.15);
}

.league-band--brass[b-2q5aigm89k],
.league-row--brass[b-2q5aigm89k] {
    --league-tone: #d4c04a;
    --league-wash: rgba(212, 192, 74, 0.15);
}

tr.league-band > th[b-2q5aigm89k] {
    /* Das Padding sitzt auf dem Button, damit das ganze Band klickbar ist. */
    padding: 0;
    border-bottom: 1px solid var(--league-tone);
    background: linear-gradient(
        90deg,
        var(--league-wash),
        rgba(0, 0, 0, 0) 96%
    ) !important;
    box-shadow: inset 4px 0 0 var(--league-tone);
    color: var(--league-tone) !important;
    font-family: var(--vx-font-mono);
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

/* Ligakopf als Akkordeon-Schalter */
.league-toggle[b-2q5aigm89k] {
    display: flex;
    width: 100%;
    padding: 0.5rem 0.6rem;
    align-items: center;
    gap: 0.6rem;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-align: left;
    text-transform: inherit;
    cursor: pointer;
}

.league-toggle:hover .league-toggle__name[b-2q5aigm89k],
.league-toggle:focus-visible .league-toggle__name[b-2q5aigm89k] {
    text-decoration: underline;
    text-underline-offset: 0.22rem;
}

.league-toggle__chevron[b-2q5aigm89k] {
    flex: 0 0 auto;
    font-size: 1rem;
    line-height: 1;
    transition: transform 0.15s ease;
}

.league-toggle[aria-expanded="false"] .league-toggle__chevron[b-2q5aigm89k] {
    transform: rotate(-90deg);
}

.league-toggle__name[b-2q5aigm89k] {
    flex: 0 0 auto;
}

/* Bei zugeklappter Liga steht der Erstplatzierte im Kopf. */
.league-toggle__leader[b-2q5aigm89k] {
    display: inline-flex;
    min-width: 0;
    align-items: baseline;
    flex: 0 1 auto;
    gap: 0.45rem;
    overflow: hidden;
    color: #f5f4f2;
    font-family: system-ui, sans-serif;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: normal;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
}

.league-toggle__leader[b-2q5aigm89k]::before {
    content: "\00b7";
    margin-right: 0.15rem;
    color: var(--league-tone);
    opacity: 0.7;
}

.league-toggle__leader-rating[b-2q5aigm89k] {
    color: var(--league-tone);
    font-variant-numeric: tabular-nums;
}

.league-toggle__count[b-2q5aigm89k] {
    flex: 0 0 auto;
    margin-left: auto;
    opacity: 0.72;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

tr.league-row > :first-child[b-2q5aigm89k] {
    border-left: 3px solid var(--league-tone);
}

/* Derselbe Verlauf wie im Ligakopf, aber über die ganze Zeile: vorne der
   Ligaton, nach rechts hin auslaufend.
   Der Verlauf sitzt auf dem <tr>, damit er einmal durchläuft statt in
   jeder Zelle neu zu beginnen. Bootstrap malt Zellhintergründe über einen
   inset box-shadow, der ihn sonst verdecken würde – deshalb werden die
   Zellen durchsichtig gestellt. Der Hover-Zustand läuft über
   --bs-table-bg-state und bleibt davon unberührt. */
tr.league-row[b-2q5aigm89k] {
    background-image: linear-gradient(
        90deg,
        var(--league-wash),
        rgba(0, 0, 0, 0) 96%
    );
}

tr.league-row > *[b-2q5aigm89k] {
    --bs-table-bg-type: transparent;
    --bs-table-accent-bg: transparent;
    background-color: transparent;
}

/* Auf getöntem Grund bleibt der Name hell, sonst sinkt der Kontrast.
   Der Akzent steckt im Verlauf, im Avatarring und in der Platzziffer. */
tr.league-row .leaderboard-player-link[b-2q5aigm89k] {
    color: #f5f4f2;
}

tr.league-row .leaderboard-player-link:hover[b-2q5aigm89k],
tr.league-row .leaderboard-player-link:focus-visible[b-2q5aigm89k] {
    color: var(--league-tone);
}

tr.league-row .leaderboard-player-avatar[b-2q5aigm89k] {
    border-color: var(--league-tone);
}

tr.league-row .leaderboard-player-avatar--fallback[b-2q5aigm89k] {
    color: var(--league-tone);
}

tr.league-row > th[scope="row"][b-2q5aigm89k] {
    color: var(--league-tone);
    font-family: var(--vx-font-mono);
    font-weight: 800;
}

.brass-heading[b-2q5aigm89k] {
    color: #d4c04a;
    font-family: var(--vx-font-mono);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.brass-note[b-2q5aigm89k] {
    max-width: 62ch;
}

/* ------------------------------------------------------------------
   Gesperrte und disqualifizierte Spieler bleiben in der Tabelle, aber
   deutlich zurueckgenommen und ohne Platzziffer.
   ------------------------------------------------------------------ */
.league-row--excluded > *[b-2q5aigm89k],
.excluded-row > *[b-2q5aigm89k] {
    color: rgba(217, 212, 200, 0.5) !important;
}

.league-row--excluded .leaderboard-player-link[b-2q5aigm89k],
.excluded-row .leaderboard-player-link[b-2q5aigm89k] {
    color: rgba(217, 212, 200, 0.68);
}

.league-row--excluded .leaderboard-player-avatar[b-2q5aigm89k],
.excluded-row .leaderboard-player-avatar[b-2q5aigm89k] {
    filter: grayscale(1);
    opacity: 0.55;
}

.excluded-badge[b-2q5aigm89k] {
    display: inline-block;
    margin-left: 0.45rem;
    padding: 0.05rem 0.4rem;
    border: 1px solid rgba(232, 166, 75, 0.45);
    border-radius: 0.28rem;
    background: rgba(232, 166, 75, 0.1);
    color: #e8a64b !important;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
}

/* ---- Reiter (nur fuer Angemeldete) ---- */

.leaderboard-tabs[b-2q5aigm89k] {
    display: flex;
    margin-bottom: 1rem;
    gap: 0.4rem;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.leaderboard-tabs__button[b-2q5aigm89k] {
    display: inline-flex;
    padding: 0.5rem 0.9rem;
    align-items: center;
    gap: 0.45rem;
    color: #cbbfa6;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 0.4rem 0.4rem 0 0;
    background: transparent;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.leaderboard-tabs__button:hover[b-2q5aigm89k] {
    color: #faf2dd;
    background: rgba(232, 181, 63, 0.08);
}

.leaderboard-tabs__button.is-active[b-2q5aigm89k] {
    color: #f7e7bb;
    border-color: rgba(232, 181, 63, 0.34);
    background: rgba(28, 21, 4, 0.72);
}

.leaderboard-tabs__count[b-2q5aigm89k] {
    display: inline-block;
    min-width: 1.4rem;
    padding: 0.05rem 0.35rem;
    color: #0d0b04;
    border-radius: 999px;
    background: #efc763;
    font-size: 0.7rem;
    text-align: center;
}

.leaderboard-inactive[b-2q5aigm89k] {
    margin-bottom: 1.25rem;
}

/* Ohne href ist der Name kein Link, sondern Text - der Zeiger soll
   das auch zeigen. Betrifft nur die oeffentliche Ansicht. */
.leaderboard-player-link:not([href])[b-2q5aigm89k] {
    cursor: default;
    color: inherit;
}
/* /Components/Pages/Elo/EloMailbox.razor.rz.scp.css */
.mailbox-accordion-list[b-yq35y4pyed] {
    display: grid;
    gap: 0.85rem;
}

.mailbox-accordion[b-yq35y4pyed] {
    overflow: hidden;
    border-color: rgba(232, 181, 63, 0.25);
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.014) 0,
            rgba(232, 181, 63, 0.014) 1px,
            transparent 1px,
            transparent 8px
        ),
        var(--vx-panel);
}

.mailbox-accordion__toggle[b-yq35y4pyed] {
    display: flex;
    width: 100%;
    min-height: 4.6rem;
    padding: 0.85rem 1rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: inherit;
    border: 0;
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.08),
            rgba(0, 0, 0, 0.1)
        );
    text-align: left;
    cursor: pointer;
    transition:
        background 160ms ease,
        box-shadow 160ms ease;
}

.mailbox-accordion__toggle:hover[b-yq35y4pyed] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.15),
            rgba(0, 0, 0, 0.08)
        );
}

.mailbox-accordion__toggle:focus-visible[b-yq35y4pyed] {
    outline: 2px solid var(--vx-gold-bright);
    outline-offset: -4px;
}

.mailbox-accordion--open .mailbox-accordion__toggle[b-yq35y4pyed] {
    box-shadow: inset 4px 0 0 rgba(232, 181, 63, 0.78);
}

.mailbox-accordion__summary[b-yq35y4pyed],
.mailbox-accordion__meta[b-yq35y4pyed] {
    display: flex;
    min-width: 0;
}

.mailbox-accordion__summary[b-yq35y4pyed] {
    flex-direction: column;
    gap: 0.25rem;
}

.mailbox-accordion__summary strong[b-yq35y4pyed] {
    color: var(--vx-gold-bright);
    font-family: var(--vx-font-mono);
    font-size: 0.76rem;
    letter-spacing: 0.045em;
}

.mailbox-accordion__summary > span[b-yq35y4pyed] {
    overflow: hidden;
    color: var(--vx-gray-300);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mailbox-accordion__meta[b-yq35y4pyed] {
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
    flex: 0 0 auto;
}

.mailbox-accordion__chevron[b-yq35y4pyed] {
    display: inline-grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    color: var(--vx-gold-bright);
    border: 1px solid rgba(232, 181, 63, 0.38);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
    font-size: 1.15rem;
    line-height: 1;
    transition: transform 180ms ease;
}

.mailbox-accordion--open .mailbox-accordion__chevron[b-yq35y4pyed] {
    transform: rotate(180deg);
}

.mailbox-accordion__body[b-yq35y4pyed] {
    border-top: 1px solid rgba(232, 181, 63, 0.18);
}

@media (max-width: 575.98px) {
    .mailbox-accordion__toggle[b-yq35y4pyed] {
        align-items: flex-start;
        flex-direction: column;
    }

    .mailbox-accordion__meta[b-yq35y4pyed] {
        width: 100%;
        justify-content: space-between;
    }

    .mailbox-accordion__summary > span[b-yq35y4pyed] {
        white-space: normal;
    }
}


.mailbox-section-title[b-yq35y4pyed] {
    display: flex;
    margin: 0 0 0.75rem;
    align-items: center;
    gap: 0.65rem;
    color: var(--vx-gray-100);
    font-size: 1.05rem;
    letter-spacing: 0.025em;
}

.mailbox-accordion--ticket[b-yq35y4pyed] {
    border-color: rgba(214, 172, 63, 0.36);
}

.mailbox-accordion--ticket .mailbox-accordion__toggle[b-yq35y4pyed] {
    background:
        linear-gradient(
            90deg,
            rgba(214, 172, 63, 0.12),
            rgba(232, 181, 63, 0.055),
            rgba(0, 0, 0, 0.12)
        );
}

.mailbox-accordion--ticket .mailbox-accordion__toggle:hover[b-yq35y4pyed] {
    background:
        linear-gradient(
            90deg,
            rgba(214, 172, 63, 0.18),
            rgba(232, 181, 63, 0.1),
            rgba(0, 0, 0, 0.1)
        );
}

.mailbox-ticket-details[b-yq35y4pyed] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.mailbox-ticket-details > div[b-yq35y4pyed] {
    display: grid;
    gap: 0.18rem;
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.16);
    border-radius: 0.45rem;
    background: rgba(0, 0, 0, 0.16);
}

.mailbox-ticket-details strong[b-yq35y4pyed] {
    color: var(--vx-gold-bright);
    font-family: var(--vx-font-mono);
    font-size: 0.75rem;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.mailbox-ticket-details span[b-yq35y4pyed] {
    overflow-wrap: anywhere;
    color: var(--vx-gray-200);
}

@media (max-width: 575.98px) {
    .mailbox-ticket-details[b-yq35y4pyed] {
        grid-template-columns: 1fr;
    }
}

/* ---- Nachrichten ---- */

.mailbox-messages[b-yq35y4pyed] {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.7rem;
    list-style: none;
}

.mailbox-messages__item[b-yq35y4pyed] {
    padding: 0.75rem 0.9rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    border-radius: 0.4rem;
    background: rgba(18, 14, 4, 0.5);
}

.mailbox-messages__item.is-unread[b-yq35y4pyed] {
    border-color: rgba(232, 181, 63, 0.55);
    background: rgba(38, 28, 6, 0.7);
}

.mailbox-messages__head[b-yq35y4pyed] {
    display: flex;
    margin-bottom: 0.35rem;
    gap: 0.5rem 1rem;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
}

.mailbox-messages__head strong[b-yq35y4pyed] {
    color: #fcf7ea;
}

.mailbox-messages__meta[b-yq35y4pyed] {
    color: #9d968a;
    font-size: 0.76rem;
}

.mailbox-messages__body[b-yq35y4pyed] {
    margin: 0 0 0.6rem;
    color: #cbbfa6;
    font-size: 0.88rem;
    white-space: pre-wrap;
}

.mailbox-messages__actions[b-yq35y4pyed] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
/* /Components/Pages/Elo/EloMatchSchedule.razor.rz.scp.css */

.registration-mode-switch[b-upn5qgt83h] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.registration-mode-switch__button[b-upn5qgt83h] {
    display: flex;
    min-height: 5rem;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.85rem 1rem;
    color: var(--vx-gray-300);
    border: 1px solid rgba(232, 181, 63, 0.2);
    border-radius: 0.7rem;
    background:
        linear-gradient(135deg, rgba(232, 181, 63, 0.035), transparent 55%),
        rgba(0, 0, 0, 0.24);
    text-align: left;
    cursor: pointer;
    transition:
        border-color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease;
}

.registration-mode-switch__button:hover[b-upn5qgt83h] {
    color: var(--vx-gray-100);
    border-color: rgba(232, 181, 63, 0.45);
    background:
        linear-gradient(135deg, rgba(232, 181, 63, 0.09), transparent 55%),
        rgba(0, 0, 0, 0.28);
}

.registration-mode-switch__button:focus-visible[b-upn5qgt83h] {
    outline: 2px solid var(--vx-gold-bright);
    outline-offset: 2px;
}

.registration-mode-switch__button--active[b-upn5qgt83h] {
    color: var(--vx-gray-100);
    border-color: rgba(232, 181, 63, 0.72);
    background:
        linear-gradient(135deg, rgba(232, 181, 63, 0.16), transparent 58%),
        rgba(0, 0, 0, 0.32);
    box-shadow: inset 4px 0 0 rgba(232, 181, 63, 0.78);
}

.registration-mode-switch__title[b-upn5qgt83h] {
    color: var(--vx-gold-bright);
    font-size: 0.92rem;
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.registration-mode-switch__description[b-upn5qgt83h] {
    color: var(--vx-gray-300);
    font-size: 0.84rem;
}

.registration-mode-hint[b-upn5qgt83h] {
    margin: 0 0 1rem;
    padding: 0.65rem 0.8rem;
    color: var(--vx-gray-300);
    border-left: 3px solid rgba(232, 181, 63, 0.72);
    background: rgba(232, 181, 63, 0.055);
}

.match-registration-card[b-upn5qgt83h] {
    overflow: hidden;
}

.lobby-import[b-upn5qgt83h],
.form-section[b-upn5qgt83h] {
    border: 1px solid rgba(232, 181, 63, 0.24);
    border-radius: 0.8rem;
    background:
        linear-gradient(135deg, rgba(232, 181, 63, 0.055), transparent 48%),
        rgba(4, 10, 8, 0.48);
    padding: 1rem;
}

.lobby-import__heading[b-upn5qgt83h] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.lobby-import__heading h2[b-upn5qgt83h],
.form-section h2[b-upn5qgt83h] {
    margin: 0 0 0.35rem;
    color: var(--vx-gold-bright);
    font-size: 1rem;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.lobby-import__heading p[b-upn5qgt83h] {
    margin: 0;
    color: var(--vx-gray-300);
}

.lobby-import__selected[b-upn5qgt83h] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.32);
    border-radius: 0.6rem;
    background: rgba(232, 181, 63, 0.07);
}

.setting-checkbox-grid[b-upn5qgt83h] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
}

.setting-checkbox[b-upn5qgt83h] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 3.1rem;
    padding: 0.65rem 0.75rem;
    color: var(--vx-gray-200);
    border: 1px solid rgba(232, 181, 63, 0.18);
    border-radius: 0.55rem;
    background: rgba(0, 0, 0, 0.22);
    cursor: pointer;
}

.setting-checkbox:hover[b-upn5qgt83h] {
    border-color: rgba(232, 181, 63, 0.42);
    background: rgba(232, 181, 63, 0.07);
}

.setting-checkbox input[b-upn5qgt83h] {
    flex: 0 0 auto;
}

.ticket-accordion-list[b-upn5qgt83h] {
    display: grid;
    gap: 0.85rem;
}

.ticket-accordion[b-upn5qgt83h] {
    overflow: hidden;
    border-color: rgba(232, 181, 63, 0.25);
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.014) 0,
            rgba(232, 181, 63, 0.014) 1px,
            transparent 1px,
            transparent 8px
        ),
        var(--vx-panel);
}

.ticket-accordion__toggle[b-upn5qgt83h] {
    display: flex;
    width: 100%;
    min-height: 4.5rem;
    padding: 0.85rem 1rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: inherit;
    border: 0;
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.08),
            rgba(0, 0, 0, 0.1)
        );
    text-align: left;
    cursor: pointer;
}

.ticket-accordion__toggle:hover[b-upn5qgt83h] {
    background:
        linear-gradient(
            90deg,
            rgba(232, 181, 63, 0.15),
            rgba(0, 0, 0, 0.08)
        );
}

.ticket-accordion__toggle:focus-visible[b-upn5qgt83h] {
    outline: 2px solid var(--vx-gold-bright);
    outline-offset: -4px;
}

.ticket-accordion--open .ticket-accordion__toggle[b-upn5qgt83h] {
    box-shadow: inset 4px 0 0 rgba(232, 181, 63, 0.78);
}

.ticket-accordion__summary[b-upn5qgt83h],
.ticket-accordion__meta[b-upn5qgt83h] {
    display: flex;
    min-width: 0;
}

.ticket-accordion__summary[b-upn5qgt83h] {
    flex-direction: column;
    gap: 0.25rem;
}

.ticket-accordion__summary strong[b-upn5qgt83h] {
    color: var(--vx-gold-bright);
    font-family: var(--vx-font-mono);
    font-size: 0.76rem;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.ticket-accordion__summary > span[b-upn5qgt83h] {
    overflow: hidden;
    color: var(--vx-gray-300);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-accordion__meta[b-upn5qgt83h] {
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
    flex: 0 0 auto;
}

.ticket-accordion__chevron[b-upn5qgt83h] {
    display: inline-grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    color: var(--vx-gold-bright);
    border: 1px solid rgba(232, 181, 63, 0.38);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
    font-size: 1.15rem;
    line-height: 1;
    transition: transform 180ms ease;
}

.ticket-accordion--open .ticket-accordion__chevron[b-upn5qgt83h] {
    transform: rotate(180deg);
}

.ticket-accordion__body[b-upn5qgt83h] {
    border-top: 1px solid rgba(232, 181, 63, 0.18);
}

.ticket-detail-grid[b-upn5qgt83h] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

.ticket-detail[b-upn5qgt83h] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(232, 181, 63, 0.15);
    border-radius: 0.5rem;
    background: rgba(0, 0, 0, 0.2);
}

.ticket-detail span[b-upn5qgt83h] {
    color: var(--vx-gray-400);
    font-size: 0.76rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ticket-detail strong[b-upn5qgt83h] {
    overflow-wrap: anywhere;
    color: var(--vx-gray-100);
}

.lobby-tracking-status[b-upn5qgt83h] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    padding: 0.75rem 0.85rem;
    border-left: 3px solid rgba(232, 181, 63, 0.8);
    background: rgba(232, 181, 63, 0.075);
}

@media (max-width: 991.98px) {
    .setting-checkbox-grid[b-upn5qgt83h],
    .ticket-detail-grid[b-upn5qgt83h] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .registration-mode-switch[b-upn5qgt83h] {
        grid-template-columns: 1fr;
    }

    .lobby-import__heading[b-upn5qgt83h],
    .ticket-accordion__toggle[b-upn5qgt83h] {
        align-items: stretch;
        flex-direction: column;
    }

    .setting-checkbox-grid[b-upn5qgt83h],
    .ticket-detail-grid[b-upn5qgt83h] {
        grid-template-columns: 1fr;
    }

    .ticket-accordion__meta[b-upn5qgt83h] {
        width: 100%;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .ticket-accordion__summary > span[b-upn5qgt83h] {
        white-space: normal;
    }
}
/* /Components/Pages/Elo/EloPlanner.razor.rz.scp.css */
.planner[b-na6f4mhafb] {
    max-width: 62rem;
}

.planner__header[b-na6f4mhafb] {
    margin-bottom: 1.75rem;
}

.planner__eyebrow[b-na6f4mhafb] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.planner__header h1[b-na6f4mhafb] {
    margin: 0;
}

.planner__subtitle[b-na6f4mhafb] {
    max-width: 44rem;
    margin: 0.5rem 0 0;
    color: rgba(217, 212, 200, 0.72);
    font-size: 0.9rem;
    line-height: 1.55;
}

.planner__section[b-na6f4mhafb] {
    margin-bottom: 2.25rem;
}

.planner__section h2[b-na6f4mhafb] {
    margin-bottom: 0.85rem;
    font-size: 1.05rem;
    letter-spacing: 0.02em;
}

.planner__empty[b-na6f4mhafb] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.88rem;
}

/* Vorschläge sind das, wofür die Seite da ist - sie stehen als eigene
   Karten und nicht in einer Tabellenzeile. */
.planner__proposals[b-na6f4mhafb] {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    list-style: none;
}

.planner__proposal[b-na6f4mhafb] {
    display: flex;
    padding: 0.9rem 1.1rem;
    flex-direction: column;
    gap: 0.5rem;
    border: 1px solid rgba(232, 181, 63, 0.3);
    border-radius: 0.4rem;
    background: rgba(232, 181, 63, 0.06);
}

.planner__proposal-head[b-na6f4mhafb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.planner__proposal-time[b-na6f4mhafb] {
    color: rgba(217, 212, 200, 0.85);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.82rem;
    line-height: 1.4;
}

.planner__time[b-na6f4mhafb] {
    max-width: 9rem;
}

.planner__proposal-actions[b-na6f4mhafb] {
    display: flex;
    gap: 0.5rem;
}

.planner__booking[b-na6f4mhafb] {
    display: flex;
    margin-bottom: 0.75rem;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.planner__field[b-na6f4mhafb] {
    min-width: 11rem;
    flex: 0 1 11rem;
}

.planner__field--narrow[b-na6f4mhafb] {
    min-width: 7rem;
    flex: 0 1 7rem;
}

/* Der Knopf sitzt auf der Grundlinie der Felder, nicht auf der der
   Beschriftung darüber. */
.planner__add[b-na6f4mhafb] {
    margin-top: 1.9rem;
}

.planner__hint[b-na6f4mhafb] {
    max-width: 42rem;
    margin-bottom: 1.25rem;
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.8rem;
    line-height: 1.5;
}

.planner__table th[scope="row"][b-na6f4mhafb] {
    white-space: nowrap;
}

.planner__actions[b-na6f4mhafb] {
    white-space: nowrap;
    text-align: right;
}
/* /Components/Pages/Elo/EloPlayerProfile.razor.rz.scp.css */
.player-profile-back[b-6tbw0aej6a] {
    display: flex;
    justify-content: flex-end;
}

.player-profile-header[b-6tbw0aej6a] {
    display: flex;
    padding: clamp(1rem, 3vw, 1.6rem);
    align-items: center;
    gap: 1.4rem;
    border: 1px solid rgba(232, 181, 63, 0.3);
    border-radius: 0.4rem;
    background:
        linear-gradient(120deg, rgba(232, 181, 63, 0.1), transparent 45%),
        rgba(17, 13, 3, 0.78);
    box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.28);
}

/* ---- Die Orden ----
   Sie stehen rechts in der Kopfzeile, im freien Feld neben dem Namen.
   `margin-left: auto` schiebt sie dorthin, ohne dass Avatar und Name
   ihre Breite ändern müssten; bricht die Reihe um, wandert sie unter
   den Namen statt aus der Karte zu laufen. */
.player-profile-orders[b-6tbw0aej6a] {
    display: flex;
    max-width: min(22rem, 45%);
    margin-left: auto;
    gap: 0.35rem;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.player-profile-orders[b-6tbw0aej6a]  .ach-badge {
    --ach-badge-size: 3rem;
}

.player-profile-order[b-6tbw0aej6a] {
    display: inline-flex;
    line-height: 0;
}

/* „+7": der Rest, als Weg zur vollständigen Liste. */
.player-profile-order-more[b-6tbw0aej6a] {
    padding: 0.2rem 0.45rem;
    align-self: center;
    border: 1px solid rgba(232, 181, 63, 0.4);
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-decoration: none;
}

.player-profile-order-more:hover[b-6tbw0aej6a],
.player-profile-order-more:focus-visible[b-6tbw0aej6a] {
    border-color: rgba(232, 181, 63, 0.8);
    background: rgba(232, 181, 63, 0.1);
    color: #ffe08a;
}

@media (max-width: 767.98px) {
    .player-profile-orders[b-6tbw0aej6a] {
        max-width: none;
        margin-left: 0;
        justify-content: flex-start;
    }
}

.player-profile-avatar[b-6tbw0aej6a] {
    display: grid;
    width: clamp(7.5rem, 18vw, 11rem);
    flex: 0 0 auto;
    aspect-ratio: 1;
    place-items: center;
    object-fit: cover;
    border: 3px solid rgba(232, 181, 63, 0.78);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.48);
    box-shadow:
        0 0 0 6px rgba(232, 181, 63, 0.08),
        0 1rem 2rem rgba(0, 0, 0, 0.3);
}

.player-profile-avatar--fallback[b-6tbw0aej6a] {
    color: #ffe08a;
    font-family: var(--vx-font-mono);
    font-size: clamp(2rem, 6vw, 3.2rem);
    font-weight: 900;
}

.player-profile-heading h1[b-6tbw0aej6a] {
    margin: 0.1rem 0 0.35rem;
}

.player-profile-kicker[b-6tbw0aej6a] {
    color: #ffe08a;
    font-family: var(--vx-font-mono);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.player-profile-meta[b-6tbw0aej6a] {
    color: rgba(226, 210, 170, 0.78);
}

.player-profile-stats[b-6tbw0aej6a] {
    display: grid;
    margin-top: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.player-profile-stats > div[b-6tbw0aej6a] {
    display: grid;
    padding: 0.85rem 1rem;
    gap: 0.2rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    border-radius: 0.3rem;
    background: rgba(17, 13, 3, 0.64);
}

.player-profile-stats span[b-6tbw0aej6a] {
    color: rgba(226, 210, 170, 0.7);
    font-size: 0.72rem;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.player-profile-stats strong[b-6tbw0aej6a] {
    color: #fdfbf5;
    font-family: var(--vx-font-mono);
    font-size: 1.15rem;
}

.player-profile-section[b-6tbw0aej6a] {
    padding: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.35rem;
    background: rgba(17, 13, 3, 0.7);
}

.player-profile-section h2[b-6tbw0aej6a] {
    margin-bottom: 1rem;
    font-size: 1.15rem;
}

.player-profile-matches[b-6tbw0aej6a] {
    display: grid;
    gap: 0.65rem;
}

.player-profile-match[b-6tbw0aej6a] {
    display: grid;
    padding: 0.75rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.16);
    background: rgba(0, 8, 3, 0.45);
}

.player-profile-match__outcome[b-6tbw0aej6a] {
    display: grid;
    width: 2.2rem;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 50%;
    font-family: var(--vx-font-mono);
    font-weight: 900;
}

.player-profile-match__outcome--win[b-6tbw0aej6a] {
    color: #131007;
    background: #ffe08a;
}

.player-profile-match__outcome--draw[b-6tbw0aej6a] {
    color: #171307;
    background: #d8bd6d;
}

.player-profile-match__outcome--loss[b-6tbw0aej6a] {
    color: #fff;
    background: #8c2d2d;
}

.player-profile-match__main[b-6tbw0aej6a],
.player-profile-match__rating[b-6tbw0aej6a] {
    display: grid;
    gap: 0.15rem;
}

.player-profile-match__main span[b-6tbw0aej6a],
.player-profile-match__rating span[b-6tbw0aej6a] {
    color: rgba(226, 210, 170, 0.68);
    font-size: 0.78rem;
}

.player-profile-match__rating[b-6tbw0aej6a] {
    text-align: right;
}

@media (max-width: 800px) {
    .player-profile-stats[b-6tbw0aej6a] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .player-profile-header[b-6tbw0aej6a] {
        align-items: flex-start;
        flex-direction: column;
    }

    .player-profile-match[b-6tbw0aej6a] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .player-profile-match__rating[b-6tbw0aej6a] {
        grid-column: 2;
        text-align: left;
    }
}
/* /Components/Pages/Elo/EloSeasonRegistration.razor.rz.scp.css */
.season-registration-list[b-h600jwubag] {
    display: grid;
    gap: 1rem;
}

.season-registration-summary[b-h600jwubag] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.season-registration-summary > div[b-h600jwubag],
.registration-path-card[b-h600jwubag] {
    border: 1px solid rgba(255, 203, 73, 0.22);
    border-radius: 0.85rem;
    background: rgba(16, 13, 4, 0.72);
}

.season-registration-summary > div[b-h600jwubag] {
    display: flex;
    min-height: 7rem;
    flex-direction: column;
    justify-content: center;
    padding: 1rem;
}

.season-registration-summary span[b-h600jwubag],
.season-registration-summary small[b-h600jwubag],
.registration-path-kicker[b-h600jwubag],
.registration-date[b-h600jwubag] {
    color: rgba(226, 210, 170, 0.82);
}

.season-registration-summary strong[b-h600jwubag] {
    margin: 0.3rem 0;
    color: #f9f1dd;
}

.registration-path-grid[b-h600jwubag] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.registration-path-card[b-h600jwubag] {
    padding: 1.1rem;
}

.registration-path-card--existing[b-h600jwubag] {
    border-color: rgba(219, 180, 76, 0.34);
    box-shadow: inset 0 0 0 1px rgba(219, 180, 76, 0.05);
}

.registration-path-card__head[b-h600jwubag] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.registration-path-card h2[b-h600jwubag] {
    margin: 0.15rem 0 0;
    color: #fcf7ea;
    font-size: 1.15rem;
}

.registration-path-card p[b-h600jwubag] {
    color: rgba(228, 223, 209, 0.88);
}

.registration-date[b-h600jwubag] {
    display: block;
    margin-bottom: 0.9rem;
}

.existing-player-fields[b-h600jwubag] {
    display: grid;
    gap: 0.8rem;
    margin: 1rem 0;
}

.existing-player-fields label span[b-h600jwubag] {
    color: #ff9a9a;
}


.required-field-note[b-h600jwubag] {
    display: block;
    margin-top: 0.35rem;
    color: rgba(255, 192, 120, 0.88);
    font-size: 0.82rem;
}

.existing-player-fields input[readonly][b-h600jwubag] {
    opacity: 0.86;
}

.registration-status[b-h600jwubag] {
    color: rgba(228, 223, 209, 0.82);
    font-size: 0.9rem;
    text-align: right;
}

.registration-status--accepted[b-h600jwubag] {
    color: #ffd772 !important;
}

.registration-status--pending[b-h600jwubag] {
    color: #e9cd87 !important;
}

.registration-status--rejected[b-h600jwubag] {
    color: #ff8b8b !important;
}

@media (max-width: 900px) {
    .season-registration-summary[b-h600jwubag],
    .registration-path-grid[b-h600jwubag] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .registration-path-card__head[b-h600jwubag] {
        flex-direction: column;
    }

    .registration-status[b-h600jwubag] {
        text-align: left;
    }
}

.season-registration-accordion[b-h600jwubag] {
    overflow: hidden;
    border-color: rgba(255, 203, 70, 0.22);
    background:
        linear-gradient(135deg, rgba(19, 15, 5, 0.92), rgba(3, 11, 7, 0.86));
    box-shadow: 0 0.55rem 1.4rem rgba(0, 0, 0, 0.2);
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.season-registration-accordion.is-open[b-h600jwubag] {
    border-color: rgba(255, 203, 70, 0.42);
    box-shadow:
        0 0.8rem 2rem rgba(0, 0, 0, 0.28),
        0 0 1.5rem rgba(181, 139, 31, 0.08);
}

.season-registration-accordion__heading[b-h600jwubag] {
    margin: 0;
}

.season-registration-accordion__toggle[b-h600jwubag] {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) auto 1.2rem;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.season-registration-accordion__toggle:hover:not(:disabled)[b-h600jwubag] {
    background: rgba(154, 123, 45, 0.08);
}

.season-registration-accordion__toggle:focus-visible[b-h600jwubag] {
    outline: 2px solid rgba(255, 210, 97, 0.78);
    outline-offset: -3px;
}

.season-registration-accordion__toggle:disabled[b-h600jwubag] {
    cursor: wait;
    opacity: 0.72;
}

.season-registration-accordion__identity[b-h600jwubag] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.season-registration-accordion__identity strong[b-h600jwubag] {
    overflow: hidden;
    color: #faf3e1;
    font-size: 1.08rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.season-registration-accordion__identity small[b-h600jwubag] {
    color: rgba(226, 210, 170, 0.7);
}

.season-registration-accordion__kicker[b-h600jwubag] {
    margin-bottom: 0.12rem;
    color: rgba(244, 203, 101, 0.9);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.season-registration-accordion__meta[b-h600jwubag] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.season-registration-event-status[b-h600jwubag],
.season-registration-open-state[b-h600jwubag],
.season-registration-path-status[b-h600jwubag] {
    display: inline-flex;
    min-height: 1.75rem;
    align-items: center;
    padding: 0.2rem 0.58rem;
    border: 1px solid rgba(218, 204, 168, 0.22);
    border-radius: 999px;
    background: rgba(29, 24, 10, 0.58);
    color: rgba(236, 231, 218, 0.88);
    font-size: 0.74rem;
    font-weight: 700;
    white-space: nowrap;
}

.season-registration-event-status--active[b-h600jwubag] {
    border-color: rgba(255, 203, 70, 0.48);
    background: rgba(96, 74, 20, 0.3);
    color: #ffdf8d;
}

.season-registration-event-status--registration[b-h600jwubag] {
    border-color: rgba(76, 197, 255, 0.42);
    background: rgba(16, 68, 94, 0.3);
    color: #a9e6ff;
}

.season-registration-event-status--planned[b-h600jwubag] {
    border-color: rgba(219, 180, 76, 0.46);
    background: rgba(92, 70, 18, 0.27);
    color: #f0cf72;
}

.season-registration-open-state.is-open[b-h600jwubag] {
    border-color: rgba(255, 203, 70, 0.32);
    color: #eddcb3;
}

.season-registration-open-state.is-closed[b-h600jwubag] {
    border-color: rgba(196, 204, 198, 0.18);
    color: rgba(196, 204, 198, 0.72);
}

.season-registration-accordion__chevron[b-h600jwubag] {
    width: 0.72rem;
    height: 0.72rem;
    border-right: 2px solid rgba(226, 210, 170, 0.86);
    border-bottom: 2px solid rgba(226, 210, 170, 0.86);
    transform: rotate(45deg) translateY(-0.15rem);
    transition: transform 160ms ease;
}

.season-registration-accordion.is-open
.season-registration-accordion__chevron[b-h600jwubag] {
    transform: rotate(225deg) translate(-0.1rem, -0.1rem);
}

.season-registration-accordion__panel[b-h600jwubag] {
    border-top: 1px solid rgba(255, 203, 70, 0.16);
    background: rgba(1, 8, 4, 0.34);
}

@media (max-width: 760px) {
    .season-registration-accordion__toggle[b-h600jwubag] {
        grid-template-columns: minmax(0, 1fr) 1rem;
        gap: 0.75rem;
    }

    .season-registration-accordion__meta[b-h600jwubag] {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .season-registration-accordion__chevron[b-h600jwubag] {
        grid-column: 2;
        grid-row: 1;
    }
}

.season-registration-path-status--blocked[b-h600jwubag] {
    color: #ffb3b3;
    border-color: rgba(196, 43, 43, 0.55);
    background: rgba(92, 14, 14, 0.42);
}
/* /Components/Pages/Elo/EloVacation.razor.rz.scp.css */
.vacation[b-c1sapdg1i6] {
    max-width: 62rem;
}

.vacation__header[b-c1sapdg1i6] {
    margin-bottom: 1.5rem;
}

.vacation__eyebrow[b-c1sapdg1i6] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.vacation__header h1[b-c1sapdg1i6] {
    margin: 0;
}

.vacation__subtitle[b-c1sapdg1i6] {
    max-width: 44rem;
    margin: 0.5rem 0 0;
    color: rgba(217, 212, 200, 0.72);
    font-size: 0.9rem;
    line-height: 1.55;
}

.vacation__season h2[b-c1sapdg1i6] {
    margin-bottom: 1rem;
    font-size: 1.1rem;
    letter-spacing: 0.02em;
}

/* Das Kontingent ist die eine Zahl, wegen der jemand diese Seite
   aufruft - es steht deshalb vor allem anderen und gross. */
.vacation__quota[b-c1sapdg1i6] {
    display: flex;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.vacation__tile[b-c1sapdg1i6] {
    display: flex;
    min-width: 9rem;
    padding: 0.85rem 1.1rem;
    flex-direction: column;
    gap: 0.15rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    border-radius: 0.4rem;
    background: rgba(232, 181, 63, 0.08);
}

.vacation__tile--muted[b-c1sapdg1i6] {
    border-color: rgba(217, 212, 200, 0.18);
    background: rgba(217, 212, 200, 0.05);
}

.vacation__tile-value[b-c1sapdg1i6] {
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1;
}

.vacation__tile-label[b-c1sapdg1i6] {
    color: rgba(217, 212, 200, 0.65);
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.vacation__booking[b-c1sapdg1i6] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
}

.vacation__field[b-c1sapdg1i6] {
    min-width: 16rem;
    flex: 1 1 16rem;
}

/* Der Knopf soll auf der Grundlinie des Feldes sitzen, nicht auf der
   des Labels darueber. */
.vacation__booking > .btn[b-c1sapdg1i6] {
    margin-top: 1.9rem;
}

.vacation__list-title[b-c1sapdg1i6] {
    margin-bottom: 0.6rem;
    font-size: 0.98rem;
}

.vacation__empty[b-c1sapdg1i6] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.88rem;
}

.vacation__table th[scope="row"][b-c1sapdg1i6] {
    white-space: nowrap;
}

.vacation__row--cancelled[b-c1sapdg1i6] {
    opacity: 0.6;
}

.vacation__row--running th[scope="row"][b-c1sapdg1i6] {
    color: #7fd18a;
}
/* /Components/Pages/Elo/StreamSignup.razor.rz.scp.css */
.signup[b-w897orweyj] {
    max-width: 64rem;
}

.signup__header[b-w897orweyj] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.signup__picker[b-w897orweyj] {
    min-width: 20rem;
}

.signup__eyebrow[b-w897orweyj] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.signup__header h1[b-w897orweyj] {
    margin: 0;
}

.signup__subtitle[b-w897orweyj] {
    max-width: 44rem;
    margin: 0.5rem 0 0;
    color: rgba(217, 212, 200, 0.72);
    font-size: 0.9rem;
    line-height: 1.55;
}

.signup__section[b-w897orweyj] {
    margin-bottom: 2rem;
}

.signup__section h2[b-w897orweyj] {
    margin-bottom: 0.85rem;
    font-size: 1.05rem;
    letter-spacing: 0.02em;
}

.signup__form[b-w897orweyj] {
    margin-bottom: 1.25rem;
}

.signup__list-title[b-w897orweyj] {
    margin-bottom: 0.6rem;
    font-size: 0.95rem;
}

.signup__empty[b-w897orweyj] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.88rem;
}

.signup__table th[scope="row"][b-w897orweyj] {
    white-space: nowrap;
    font-family: "Cascadia Mono", "Consolas", monospace;
}

/* Freie Zeilen treten zurück - der Blick soll auf dem hängenbleiben,
   was schon steht. */
.signup__row--free th[scope="row"][b-w897orweyj],
.signup__row--free td[b-w897orweyj] {
    color: rgba(217, 212, 200, 0.45);
}

.signup__requests[b-w897orweyj] {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    list-style: none;
}

.signup__request[b-w897orweyj] {
    display: flex;
    padding: 0.9rem 1.1rem;
    flex-direction: column;
    gap: 0.45rem;
    border: 1px solid rgba(232, 181, 63, 0.3);
    border-radius: 0.4rem;
    background: rgba(232, 181, 63, 0.06);
}

.signup__request-head[b-w897orweyj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.signup__request-time[b-w897orweyj] {
    color: rgba(217, 212, 200, 0.85);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.8rem;
}

.signup__request-note[b-w897orweyj] {
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.82rem;
    line-height: 1.45;
}

.signup__request-actions[b-w897orweyj] {
    display: flex;
    gap: 0.5rem;
}

/* Die beiden Haken stehen neben der Mapauswahl und gehören sichtbar
   dazu - sie sind die Alternative, nicht ein Zusatz. */
.signup__mapmodes[b-w897orweyj] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.3rem;
}

.signup__maphint[b-w897orweyj] {
    max-width: 30rem;
    margin: 0.35rem 0 0;
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.8rem;
    line-height: 1.45;
}
/* /Components/Pages/Ffa/FfaRankingPublic.razor.rz.scp.css */
/* ------------------------------------------------------------------
   FFA-Rangliste
   ------------------------------------------------------------------
   Aufbau: links die Platzzahl, rechts die Zeilen dieses Platzes. Die
   Zahl steht einmal je Platz und nicht bei jedem Namen — sonst läse
   sich ein geteilter Platz wie drei einzelne.
   ------------------------------------------------------------------ */

.ffa[b-iqvgfj8s0u] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.ffa__header[b-iqvgfj8s0u] {
    margin-bottom: 1.5rem;
}

.ffa__eyebrow[b-iqvgfj8s0u] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.ffa h1[b-iqvgfj8s0u] {
    margin: 0 0 0.4rem;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: clamp(1.5rem, 4vw, 2.4rem);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ffa__lead[b-iqvgfj8s0u] {
    margin: 0;
    max-width: 44rem;
    color: rgba(217, 212, 200, 0.72);
}

.ffa__muted[b-iqvgfj8s0u] {
    color: rgba(217, 212, 200, 0.55);
}

.ffa__list[b-iqvgfj8s0u] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ffa__group[b-iqvgfj8s0u] {
    display: grid;
    margin-bottom: 0.6rem;
    padding: 0.7rem 0.9rem;
    gap: 1rem;
    grid-template-columns: 4.5rem minmax(0, 1fr);
    align-items: start;

    border: 1px solid rgba(232, 181, 63, 0.2);
    background:
        linear-gradient(
            180deg,
            rgba(28, 25, 20, 0.65),
            rgba(11, 10, 8, 0.65)
        );
}

/* Die ersten drei tragen ihr Metall in der Kante links - eine ganze
   Kachel einzufärben wäre Kirmes. */
.ffa__group.is-gold[b-iqvgfj8s0u] {
    border-left: 3px solid #e8b53f;
}

.ffa__group.is-silber[b-iqvgfj8s0u] {
    border-left: 3px solid #c9ced2;
}

.ffa__group.is-bronze[b-iqvgfj8s0u] {
    border-left: 3px solid #b07a4a;
}

.ffa__group.is-rest[b-iqvgfj8s0u] {
    border-left: 3px solid rgba(217, 212, 200, 0.18);
}

.ffa__rank[b-iqvgfj8s0u] {
    display: grid;
    justify-items: center;
    gap: 0.1rem;
}

.ffa__rank-number[b-iqvgfj8s0u] {
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.8rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.is-gold .ffa__rank-number[b-iqvgfj8s0u] { color: #ffe08a; }
.is-silber .ffa__rank-number[b-iqvgfj8s0u] { color: #e6ebee; }
.is-bronze .ffa__rank-number[b-iqvgfj8s0u] { color: #d9a577; }

.ffa__rank-word[b-iqvgfj8s0u] {
    color: rgba(217, 212, 200, 0.4);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.ffa__body[b-iqvgfj8s0u] {
    display: grid;
    gap: 0.5rem;
    min-width: 0;
}

/* Die Belege nebeneinander. Umbruch erlaubt: lieber zwei Reihen als
   ein waagerechter Rollbalken in einer Liste. */
.ffa__wins-strip[b-iqvgfj8s0u] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.ffa__win[b-iqvgfj8s0u] {
    display: grid;
    margin: 0;
    gap: 0.2rem;
    justify-items: start;
}

.ffa__win-meta[b-iqvgfj8s0u] {
    display: grid;
    gap: 0.2rem;
    justify-items: start;
}

.ffa__win-date[b-iqvgfj8s0u] {
    color: rgba(217, 212, 200, 0.45);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-variant-numeric: tabular-nums;
}

/* „+3": es gibt mehr Siege als Platz fuer Belege. Ein Knopf, kein
   Schild - er fuehrt in die Tafel mit allen Belegen. */
.ffa__more[b-iqvgfj8s0u] {
    align-self: center;
    padding: 0.35rem 0.6rem;
    border: 1px solid rgba(232, 181, 63, 0.3);
    background: rgba(232, 181, 63, 0.06);
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 800;
    cursor: pointer;
}

.ffa__more:hover[b-iqvgfj8s0u],
.ffa__more:focus-visible[b-iqvgfj8s0u] {
    border-color: rgba(232, 181, 63, 0.8);
    background: rgba(232, 181, 63, 0.16);
    color: #ffe08a;
}

/* Die Zahl, um die es geht. Sie steht neben dem Namen und nicht in der
   Platzspalte: der Platz ist das Ergebnis, die Siege sind der Grund. */
.ffa__wins[b-iqvgfj8s0u] {
    padding: 0.1rem 0.45rem;
    border: 1px solid rgba(232, 181, 63, 0.28);
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Feste Fläche, auch ohne Bild: sonst rutschen die Namen einer Liste
   je nach Bebilderung unterschiedlich weit nach links.
   `contain` statt `cover`, seit die Bilder hier hochgeladen werden und
   jedes Format haben duerfen - lieber Rand als Beschnitt. */
.ffa__thumb[b-iqvgfj8s0u] {
    width: 5.5rem;
    aspect-ratio: 16 / 9;
    flex: 0 0 auto;
    border: 1px solid rgba(232, 181, 63, 0.25);
    background: #0b0a08;
    object-fit: contain;
}

.ffa__thumb--empty[b-iqvgfj8s0u] {
    border-style: dashed;
    border-color: rgba(217, 212, 200, 0.14);
}

.ffa__who[b-iqvgfj8s0u] {
    display: flex;
    min-width: 0;
    gap: 0.3rem 0.75rem;
    align-items: baseline;
    flex-wrap: wrap;
}

.ffa__name[b-iqvgfj8s0u] {
    color: #fcf7ea;
    font-size: 0.98rem;
    font-weight: 700;
    text-decoration: none;
}

a.ffa__name:hover[b-iqvgfj8s0u],
a.ffa__name:focus-visible[b-iqvgfj8s0u] {
    color: #ffe08a;
    text-decoration: underline;
}

.ffa__link[b-iqvgfj8s0u] {
    padding: 0.14rem 0.5rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-decoration: none;
    text-transform: uppercase;
}

.ffa__link:hover[b-iqvgfj8s0u],
.ffa__link:focus-visible[b-iqvgfj8s0u] {
    border-color: rgba(232, 181, 63, 0.8);
    background: rgba(232, 181, 63, 0.1);
    color: #ffe08a;
}

@media (max-width: 575.98px) {
    .ffa__group[b-iqvgfj8s0u] {
        grid-template-columns: 3.2rem minmax(0, 1fr);
        gap: 0.7rem;
    }

    .ffa__rank-number[b-iqvgfj8s0u] {
        font-size: 1.4rem;
    }

    .ffa__thumb[b-iqvgfj8s0u] {
        width: 4.2rem;
    }
}

/* ------------------------------------------------------------------
   Die Tafel mit allen Belegen eines Spielers
   ------------------------------------------------------------------ */

.ffa-popup[b-iqvgfj8s0u] {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    padding: clamp(0.75rem, 3vw, 2rem);
    place-items: center;
    background: rgba(0, 0, 0, 0.86);
}

.ffa-popup__dialog[b-iqvgfj8s0u] {
    display: flex;
    width: min(94vw, 52rem);
    max-height: 86vh;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(8, 7, 6, 0.98);
    box-shadow: 0 0 42px rgba(232, 181, 63, 0.12);
}

.ffa-popup__header[b-iqvgfj8s0u] {
    display: flex;
    flex: 0 0 auto;
    padding: 0.8rem 0.95rem;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.ffa-popup__eyebrow[b-iqvgfj8s0u] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.ffa-popup__header h2[b-iqvgfj8s0u] {
    margin: 0.15rem 0 0;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Dieselbe Taste wie in der Ruhmeshalle - zwei Fasen, keine Rundung. */
.ffa-popup__close[b-iqvgfj8s0u] {
    padding: 0.36rem 0.8rem 0.32rem;
    flex: 0 0 auto;
    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;
    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}

.ffa-popup__close:hover[b-iqvgfj8s0u],
.ffa-popup__close:focus-visible[b-iqvgfj8s0u] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
}

.ffa-popup__close:active[b-iqvgfj8s0u] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    padding: calc(0.36rem + 1px) calc(0.8rem - 1px)
             calc(0.32rem - 1px) calc(0.8rem + 1px);
}

/* Die Galerie scrollt fuer sich, der Kopf bleibt stehen. */
.ffa-popup__body[b-iqvgfj8s0u] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.9rem 0.95rem 1.1rem;
    overflow-y: auto;
}

/* Ein Raster statt einer Reihe: hier duerfen es viele sein, und die
   Belege sollen in Spalten stehen statt in einer langen Schlange. */
.ffa-popup__grid[b-iqvgfj8s0u] {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
}

/* In der Tafel darf der Beleg groesser sein als in der Zeile. Die
   Taste um das Bild muss mitwachsen, sonst steht das Bild in einer
   Spalte, die breiter ist als es selbst. */
.ffa-popup__grid .ffa__thumbkey[b-iqvgfj8s0u],
.ffa-popup__grid .ffa__thumb[b-iqvgfj8s0u] {
    width: 100%;
}

/* Der Rahmen um ein Vorschaubild, seit es anklickbar ist. Er bringt
   nichts Eigenes mit - Groesse und Kante stecken weiter im Bild
   selbst; er ist nur die Taste darum. */
.ffa__thumbkey[b-iqvgfj8s0u] {
    display: block;
    padding: 0;
    border: 0;
    background: none;
    line-height: 0;
    cursor: zoom-in;
}

.ffa__thumbkey:hover .ffa__thumb[b-iqvgfj8s0u],
.ffa__thumbkey:focus-visible .ffa__thumb[b-iqvgfj8s0u] {
    border-color: rgba(232, 181, 63, 0.8);
}

/* ------------------------------------------------------------------
   Ein Beleg in gross
   ------------------------------------------------------------------ */

.ffa-bild-popup[b-iqvgfj8s0u] {
    position: fixed;
    /* Ueber der Siegesliste: beide koennen offen sein. */
    z-index: 1500;
    inset: 0;
    display: grid;
    padding: clamp(0.75rem, 3vw, 2rem);
    place-items: center;
    background: rgba(0, 0, 0, 0.92);
}

.ffa-bild-popup__dialog[b-iqvgfj8s0u] {
    display: flex;
    width: min(92vw, 68rem);
    height: 88vh;
    max-height: 88vh;
    margin: auto;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(8, 7, 6, 0.98);
    box-shadow: 0 0 42px rgba(232, 181, 63, 0.12);
}

.ffa-bild-popup__head[b-iqvgfj8s0u] {
    display: flex;
    flex: 0 0 auto;
    padding: 0.7rem 0.95rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.ffa-bild-popup__name[b-iqvgfj8s0u] {
    display: block;
    color: #fcf7ea;
    font-size: 1rem;
}

.ffa-bild-popup__keys[b-iqvgfj8s0u] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

/* Feste Flaeche, Bild absolut darin: `height: 100%` auf einem Bild
   traegt nur, wenn der Rahmen selbst eine Hoehe hat. */
.ffa-bild-popup__frame[b-iqvgfj8s0u] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    background: #000;
}

.ffa-bild-popup__frame img[b-iqvgfj8s0u] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

@media (max-width: 575.98px) {
    .ffa-bild-popup__dialog[b-iqvgfj8s0u] {
        width: 96vw;
        height: 82vh;
    }
}
/* /Components/Pages/Lobbies/LobbyChecker.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Lobbychecker im Matrix-Design. Keine Seitenbanner, gleiche Bildsprache
   wie Mapbibliothek und Rangliste.
   ------------------------------------------------------------------ */
.lobby-view[b-5bjrx3aoij] {
    display: grid;
    gap: 1.1rem;
}

.lobby-view__header[b-5bjrx3aoij] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.lobby-view__header h1[b-5bjrx3aoij] {
    margin: 0.1rem 0 0.35rem;
}

.lobby-view__header p[b-5bjrx3aoij] {
    max-width: 62ch;
    margin: 0;
    color: #bbc1c4;
    font-size: 0.86rem;
}

.lobby-view__eyebrow[b-5bjrx3aoij] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.lobby-view__state[b-5bjrx3aoij] {
    display: inline-flex;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid rgba(232, 181, 63, 0.28);
    border-radius: 0.34rem;
    background: rgba(2, 13, 7, 0.72);
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.lobby-view__dot[b-5bjrx3aoij] {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: #e8b53f;
    box-shadow: 0 0 0.5rem rgba(232, 181, 63, 0.8);
}

.lobby-view__dot--dead[b-5bjrx3aoij] {
    background: #ff6b6b;
    box-shadow: 0 0 0.5rem rgba(255, 107, 107, 0.8);
}

.lobby-filter[b-5bjrx3aoij] {
    display: flex;
    min-height: 4.1rem;
    padding: 0.75rem 0.9rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.5rem;
    background: rgba(2, 13, 7, 0.72);
}

.lobby-filter > div:first-child[b-5bjrx3aoij] {
    display: grid;
    gap: 0.12rem;
}

.lobby-filter__label[b-5bjrx3aoij] {
    color: rgba(217, 212, 200, 0.65);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.lobby-filter strong[b-5bjrx3aoij] {
    color: #fbf6e8;
    font-size: 0.95rem;
}

.lobby-filter__controls[b-5bjrx3aoij] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

/* Das Suchfeld darf schrumpfen, der Knopf nicht - sonst wird seine
   Beschriftung am rechten Rand abgeschnitten. min-width: 0 ist noetig,
   weil Flex-Kinder sonst nicht unter ihre Inhaltsbreite gehen. */
.lobby-filter__controls .form-control[b-5bjrx3aoij] {
    flex: 1 1 auto;
    min-width: 0;
    width: min(100%, 16rem);
}

.lobby-filter__controls .btn[b-5bjrx3aoij] {
    flex: 0 0 auto;
    white-space: nowrap;
}

.lobby-grid[b-5bjrx3aoij] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
}

.lobby-card[b-5bjrx3aoij] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.55rem;
    background:
        linear-gradient(
            145deg,
            rgba(25, 20, 8, 0.88),
            rgba(3, 7, 5, 0.92)
        );
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.lobby-card__map img[b-5bjrx3aoij] {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    border-bottom: 1px solid rgba(232, 181, 63, 0.18);
    object-fit: cover;
}

.lobby-card__body[b-5bjrx3aoij] {
    display: grid;
    padding: 0.85rem 0.95rem 0.95rem;
    gap: 0.55rem;
}

.lobby-card__topline[b-5bjrx3aoij] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
}

.lobby-card__body h2[b-5bjrx3aoij] {
    margin: 0;
    color: #fcf8ed;
    font-size: 1.02rem;
}

.lobby-card__name[b-5bjrx3aoij] {
    margin: -0.35rem 0 0;
    color: rgba(217, 212, 200, 0.68);
    font-size: 0.78rem;
}

.lobby-card__since[b-5bjrx3aoij] {
    color: rgba(217, 212, 200, 0.68);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
}

.lobby-state[b-5bjrx3aoij] {
    display: inline-flex;
    min-height: 1.45rem;
    padding: 0.15rem 0.5rem;
    align-items: center;
    border: 1px solid rgba(217, 212, 200, 0.3);
    border-radius: 0.28rem;
    color: #e6e4e0;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.lobby-state--pending[b-5bjrx3aoij] {
    border-color: rgba(240, 196, 55, 0.45);
    background: rgba(48, 38, 4, 0.6);
    color: #ffe89a;
}

.lobby-state--active[b-5bjrx3aoij] {
    border-color: rgba(232, 181, 63, 0.5);
    background: rgba(42, 32, 6, 0.7);
    color: #ffe08a;
}

.lobby-card__players[b-5bjrx3aoij] {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.3rem;
    list-style: none;
}

.lobby-card__players li[b-5bjrx3aoij] {
    display: grid;
    align-items: center;
    gap: 0.5rem;
    grid-template-columns: 0.55rem minmax(0, 1fr) auto auto auto;
    padding: 0.28rem 0.4rem;
    border-radius: 0.3rem;
    background: rgba(255, 255, 255, 0.025);
}

/* Der Punkt traegt die Lobbyfarbe auch dann, wenn der Name selbst auf
   dunklem Grund schlecht zu lesen waere. */
.lobby-card__dot[b-5bjrx3aoij] {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.45);
}

.lobby-card__player[b-5bjrx3aoij] {
    min-width: 0;
    overflow: hidden;
    color: #f5f4f2;
    font-weight: 700;
    font-size: 0.85rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
}

.lobby-card__team[b-5bjrx3aoij] {
    color: rgba(217, 212, 200, 0.72);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

/* Wertung nur fuer Spieler, die in der laufenden Season stehen. */
.lobby-card__rating[b-5bjrx3aoij] {
    padding: 0.05rem 0.36rem;
    border: 1px solid rgba(232, 181, 63, 0.32);
    border-radius: 0.25rem;
    background: rgba(42, 32, 6, 0.6);
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    white-space: nowrap;
}

.lobby-card__faction[b-5bjrx3aoij] {
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.72rem;
    white-space: nowrap;
}

/* Drei Badges je Zeile. Flex statt Grid, weil eine angebrochene letzte
   Zeile so mittig sitzt und nicht links klebt. */
.lobby-card__settings[b-5bjrx3aoij] {
    --chip-gap: 0.3rem;

    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--chip-gap);
    padding-top: 0.55rem;
    border-top: 1px solid rgba(232, 181, 63, 0.14);
}

.lobby-chip[b-5bjrx3aoij] {
    display: flex;
    flex: 0 0 calc((100% - 2 * var(--chip-gap)) / 3);
    min-width: 0;
    padding: 0.2rem 0.3rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(232, 181, 63, 0.24);
    border-radius: 0.28rem;
    background: rgba(2, 13, 7, 0.6);
    color: rgba(217, 212, 200, 0.82);
    font-size: 0.68rem;
    line-height: 1.25;
    text-align: center;
    overflow-wrap: anywhere;
}

/* Eingeschaltete Optionen treten hervor, ausgeschaltete stehen nur da.
   Die Farbe ist Beiwerk - Ja und Nein stehen ausgeschrieben im Text. */
.lobby-chip--on[b-5bjrx3aoij] {
    border-color: rgba(232, 181, 63, 0.45);
    background: rgba(42, 32, 6, 0.6);
    color: #ffe08a;
}

.lobby-chip--off[b-5bjrx3aoij] {
    border-color: rgba(217, 212, 200, 0.16);
    color: rgba(217, 212, 200, 0.5);
}

@media (max-width: 640px) {
    .lobby-filter[b-5bjrx3aoij] {
        align-items: stretch;
        flex-direction: column;
    }

    .lobby-filter__controls[b-5bjrx3aoij],
    .lobby-filter__controls .form-control[b-5bjrx3aoij] {
        width: 100%;
    }

    .lobby-grid[b-5bjrx3aoij] {
        grid-template-columns: 1fr;
    }
}


.lobby-filter__note[b-5bjrx3aoij] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.72rem;
}

.lobby-card__flags[b-5bjrx3aoij] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem;
}

/* Ligamaps stehen oben in der Liste - das Schild sagt, warum. */
.lobby-tag[b-5bjrx3aoij] {
    display: inline-flex;
    min-height: 1.45rem;
    padding: 0.15rem 0.5rem;
    align-items: center;
    border: 1px solid rgba(240, 196, 55, 0.42);
    border-radius: 0.28rem;
    background: rgba(46, 36, 4, 0.55);
    color: #ffe89a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}
/* /Components/Pages/Lsp/LspHistory.razor.rz.scp.css */
/* ---------------------------------------------------------------------
   LSP-History

   Zum Gegenprüfen gedacht: die Zahlen sollen sich mit meinspielplan
   vergleichen lassen, ohne dass man die Zeile suchen muss. Deshalb liegt
   der Endstand rechts und groß, die Herleitung klein darunter.
   --------------------------------------------------------------------- */

.lsp-cards[b-asf96if4ln] {
    display: inline-flex;
    align-items: center;
    gap: 0.18rem;
    margin-left: 0.35rem;
    font-family: var(--vx-font-mono, monospace);
    font-size: 0.72rem;
    white-space: nowrap;
}

.lsp-card[b-asf96if4ln] {
    display: inline-block;
    width: 0.5rem;
    height: 0.72rem;
    border-radius: 0.08rem;
    background: linear-gradient(180deg, #ffe066 0%, #e0b323 100%);
    box-shadow: 0 0 4px rgba(255, 220, 112, 0.5);
}

/* Minuspunkte sollen auffallen — sie sind selten und meist der Grund,
   warum jemand die Zeile überhaupt ansieht. */
td strong[b-asf96if4ln] {
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/Lsp/LspHomeMaps.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Heimmaps der LSP-Liga
   ------------------------------------------------------------------ */

.homemap[b-mpjw41yo6a] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.homemap__header[b-mpjw41yo6a] {
    display: flex;
    margin-bottom: 1.2rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.homemap__eyebrow[b-mpjw41yo6a] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.homemap h1[b-mpjw41yo6a] {
    margin: 0.2rem 0 0.4rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.homemap__lead[b-mpjw41yo6a] {
    margin: 0;
    max-width: 42rem;
    color: rgba(217, 212, 200, 0.72);
}

/* Die Season steht rechts oben: sie ist die Bedingung fuer alles auf
   dieser Seite, nicht eine Angabe unter vielen. */
.homemap__season[b-mpjw41yo6a] {
    padding: 0.45rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(232, 181, 63, 0.07);
    text-align: right;
}

.homemap__seasonnum[b-mpjw41yo6a] {
    display: block;
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.homemap__seasonname[b-mpjw41yo6a] {
    display: block;
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.78rem;
}

.homemap__muted[b-mpjw41yo6a] {
    color: rgba(217, 212, 200, 0.55);
}

.homemap__note[b-mpjw41yo6a] {
    padding: 0.6rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(232, 181, 63, 0.08);
    color: #efc763;
}

.homemap__note.is-bad[b-mpjw41yo6a] {
    border-color: rgba(214, 90, 70, 0.5);
    background: rgba(214, 90, 70, 0.1);
    color: #ffb9a8;
}

/* ---- Die eigene Wahl ---- */
.homemap__own[b-mpjw41yo6a] {
    margin-bottom: 1.4rem;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(28, 25, 20, 0.7);
}

.homemap__label[b-mpjw41yo6a] {
    display: block;
    margin-bottom: 0.3rem;
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homemap__mymap[b-mpjw41yo6a] {
    display: block;
    padding: 0;
    border: 0;
    background: none;
    color: #ffe08a;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
}

.homemap__meta[b-mpjw41yo6a] {
    display: block;
    margin-top: 0.15rem;
    color: rgba(217, 212, 200, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
}

.homemap__pick[b-mpjw41yo6a] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.homemap__pick .form-select[b-mpjw41yo6a] {
    min-width: 0;
    flex: 1 1 18rem;
}

.homemap__hint[b-mpjw41yo6a] {
    margin: 0.7rem 0 0;
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.84rem;
}

.homemap__hint strong[b-mpjw41yo6a] {
    color: #efc763;
}

/* ---- Tasten ---- */
.homemap__key[b-mpjw41yo6a] {
    padding: 0.36rem 0.8rem 0.32rem;
    flex: 0 0 auto;
    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;
    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
}

.homemap__key:hover:not(:disabled)[b-mpjw41yo6a],
.homemap__key:focus-visible:not(:disabled)[b-mpjw41yo6a] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
}

.homemap__key:disabled[b-mpjw41yo6a] {
    opacity: 0.5;
    cursor: default;
}

.homemap__key--go[b-mpjw41yo6a] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #4a3b12 0%, #2c2208 100%);
    color: #ffe08a;
}

.homemap__key--stop[b-mpjw41yo6a] {
    border-color:
        rgba(214, 90, 70, 0.7) rgba(90, 30, 22, 0.9)
        rgba(90, 30, 22, 0.9) rgba(214, 90, 70, 0.7);
    background: linear-gradient(180deg, #4a1c14 0%, #2c110c 100%);
    color: #ffb9a8;
}

/* ---- Die Liste ---- */
.homemap__list-wrap h2[b-mpjw41yo6a] {
    margin: 0 0 0.5rem;
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.homemap__table[b-mpjw41yo6a] {
    color: #d9d4c8;
}

/* Die eigene Zeile faellt auf - man sucht sie zuerst. */
.homemap__table tr.is-own[b-mpjw41yo6a] {
    background: rgba(232, 181, 63, 0.07);
}

.homemap__player[b-mpjw41yo6a] {
    color: #fcf7ea;
    font-weight: 700;
    text-decoration: none;
}

.homemap__player:hover[b-mpjw41yo6a],
.homemap__player:focus-visible[b-mpjw41yo6a] {
    color: #ffe08a;
    text-decoration: underline;
}

.homemap__map[b-mpjw41yo6a] {
    color: #ffe08a;
    font-weight: 600;
}

.homemap__cat[b-mpjw41yo6a] {
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
}

.homemap__when[b-mpjw41yo6a] {
    color: rgba(217, 212, 200, 0.55);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}


/* ------------------------------------------------------------------
   Der Hinweis, dass niemand muss

   Steht in einem eigenen Kasten und nicht im Fliesstext: "einmal je
   Season" liest sich sonst als Pflicht, und dann traegt jemand
   irgendetwas ein, nur um nichts zu verpassen.
   ------------------------------------------------------------------ */
.homemap__free[b-mpjw41yo6a] {
    display: flex;
    margin: 0 0 1.2rem;
    padding: 0.7rem 0.9rem;
    gap: 0.8rem;
    align-items: baseline;
    max-width: 52rem;
    flex-wrap: wrap;
    border-left: 3px solid #e8b53f;
    background: rgba(232, 181, 63, 0.08);
    color: rgba(217, 212, 200, 0.9);
    line-height: 1.5;
}

.homemap__free strong[b-mpjw41yo6a] {
    color: #ffe08a;
}

.homemap__free-tag[b-mpjw41yo6a] {
    flex: 0 0 auto;
    padding: 0.15rem 0.5rem;
    border: 1px solid rgba(232, 181, 63, 0.5);
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

/* ------------------------------------------------------------------
   Anklickbare Mapnamen

   Ein Knopf, kein Link: das Bild liegt nicht auf einer eigenen Seite,
   und ein Link ohne Ziel ist eine Luege. Aussehen soll er trotzdem wie
   Text, sonst steht in jeder Tabellenzeile ein Kasten.
   ------------------------------------------------------------------ */
.homemap__maplink[b-mpjw41yo6a] {
    padding: 0;
    border: 0;
    border-bottom: 1px dotted rgba(232, 181, 63, 0.55);
    background: none;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.homemap__maplink:hover[b-mpjw41yo6a],
.homemap__maplink:focus-visible[b-mpjw41yo6a] {
    border-bottom-color: #e8b53f;
    color: #fff3c4;
}

/* ------------------------------------------------------------------
   Die Map in gross
   ------------------------------------------------------------------ */
.homemap-popup[b-mpjw41yo6a] {
    position: fixed;
    z-index: 1500;
    inset: 0;
    display: grid;
    padding: clamp(0.75rem, 3vw, 2rem);
    place-items: center;
    background: rgba(0, 0, 0, 0.92);
}

.homemap-popup__dialog[b-mpjw41yo6a] {
    display: flex;
    width: min(92vw, 62rem);
    height: 86vh;
    max-height: 86vh;
    margin: auto;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(8, 7, 6, 0.98);
    box-shadow: 0 0 42px rgba(232, 181, 63, 0.12);
}

.homemap-popup__head[b-mpjw41yo6a] {
    display: flex;
    flex: 0 0 auto;
    padding: 0.7rem 0.95rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.homemap-popup__name[b-mpjw41yo6a] {
    display: block;
    color: #fcf7ea;
    font-size: 1.05rem;
}

/* Fester Rahmen, Bild absolut darin: `height: 100%` auf einem Bild
   traegt nur, wenn der Rahmen selbst eine Hoehe hat. */
.homemap-popup__frame[b-mpjw41yo6a] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    background: #000;
}

.homemap-popup__frame img[b-mpjw41yo6a] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.homemap-popup__none[b-mpjw41yo6a] {
    display: grid;
    margin: 0;
    flex: 1 1 auto;
    place-items: center;
    color: rgba(217, 212, 200, 0.55);
}

@media (max-width: 575.98px) {
    .homemap-popup__dialog[b-mpjw41yo6a] {
        width: 96vw;
        height: 80vh;
    }
}
/* /Components/Pages/Maps/MapLibrary.razor.rz.scp.css */
.map-library[b-lm70inqjbm] {
    display: grid;
    gap: 1.1rem;
}

.map-library__header[b-lm70inqjbm] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.map-library__header h1[b-lm70inqjbm] {
    margin: 0.2rem 0 0.45rem;
}

.map-library__header p[b-lm70inqjbm] {
    max-width: 52rem;
    margin: 0;
    color: rgba(217, 212, 200, 0.82);
}

.map-library__eyebrow[b-lm70inqjbm],
.map-card__id[b-lm70inqjbm],
.map-editor__heading span:first-child[b-lm70inqjbm],
.map-popup__header span[b-lm70inqjbm] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.map-library__count[b-lm70inqjbm] {
    display: inline-flex;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
    align-items: center;
    color: #faf2dd;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-radius: 999px;
    background: rgba(28, 21, 4, 0.66);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    white-space: nowrap;
}

.map-editor[b-lm70inqjbm] {
    border-color: rgba(232, 181, 63, 0.28);
    background: rgba(2, 13, 7, 0.76);
}

.map-editor__heading[b-lm70inqjbm] {
    display: flex;
    margin-bottom: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.map-editor__heading h2[b-lm70inqjbm] {
    margin: 0.15rem 0 0;
    color: #faf3e2;
    font-size: 1.15rem;
}

.map-editor__selection[b-lm70inqjbm] {
    display: flex;
    margin-top: 0.8rem;
    padding: 0.65rem 0.8rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    color: #faf2de;
    border: 1px solid rgba(232, 181, 63, 0.18);
    border-radius: 0.42rem;
    background: rgba(0, 0, 0, 0.22);
    font-size: 0.82rem;
}

.map-editor__selection span[b-lm70inqjbm] {
    color: rgba(217, 212, 200, 0.72);
}

.map-grid[b-lm70inqjbm] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.map-card[b-lm70inqjbm] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.55rem;
    background:
        linear-gradient(
            145deg,
            rgba(25, 20, 8, 0.88),
            rgba(3, 7, 5, 0.92)
        );
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.map-card__preview[b-lm70inqjbm] {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-bottom: 1px solid rgba(232, 181, 63, 0.18);
    background: #020604;
    cursor: zoom-in;
}

.map-card__preview img[b-lm70inqjbm],
.map-card__placeholder[b-lm70inqjbm] {
    width: 100%;
    aspect-ratio: 16 / 10;
}

/* Ganz zu sehen, nicht angeschnitten. `cover` fuellt den Kasten und
   schneidet dafuer die Raender weg - bei einer Map faellt genau dort
   die Haelfte der Startpositionen heraus. `contain` verkleinert
   stattdessen, `object-position: center` haelt sie in der Mitte, und
   der schwarze Grund traegt den Rest. */
.map-card__preview img[b-lm70inqjbm] {
    display: block;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transition: transform 160ms ease, opacity 160ms ease;
}

.map-card__preview span[b-lm70inqjbm] {
    position: absolute;
    right: 0.6rem;
    bottom: 0.55rem;
    padding: 0.25rem 0.45rem;
    color: #fcf8ed;
    border: 1px solid rgba(239, 199, 99, 0.42);
    border-radius: 0.28rem;
    background: rgba(0, 8, 3, 0.78);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.map-card__preview:hover img[b-lm70inqjbm],
.map-card__preview:focus-visible img[b-lm70inqjbm] {
    opacity: 0.86;
    transform: scale(1.025);
}

.map-card__placeholder[b-lm70inqjbm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    color: rgba(217, 212, 200, 0.62);
    border-bottom: 1px solid rgba(232, 181, 63, 0.18);
    background:
        repeating-linear-gradient(
            135deg,
            rgba(232, 181, 63, 0.035) 0,
            rgba(232, 181, 63, 0.035) 8px,
            transparent 8px,
            transparent 16px
        ),
        rgba(0, 0, 0, 0.32);
}

.map-card__placeholder span[b-lm70inqjbm] {
    color: #efc763;
    font-size: 2rem;
}

.map-card__placeholder strong[b-lm70inqjbm] {
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.map-card__body[b-lm70inqjbm] {
    padding: 0.85rem 0.95rem 0.95rem;
}

.map-card__body h2[b-lm70inqjbm] {
    margin: 0.18rem 0 0.7rem;
    overflow-wrap: anywhere;
    color: #fcf7ea;
    font-size: 1.05rem;
}

.map-card__meta[b-lm70inqjbm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    color: rgba(217, 212, 200, 0.68);
    font-size: 0.72rem;
}

.map-card__meta span:first-child[b-lm70inqjbm] {
    color: #f3d079;
}

.map-popup[b-lm70inqjbm] {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    /* Knapper als frueher: jeder Zentimeter Rand fehlt der Map. */
    padding: clamp(0.5rem, 1.4vw, 1.25rem);
    place-items: center;
    background: rgba(0, 0, 0, 0.88);
    backdrop-filter: blur(6px);
}

.map-popup__dialog[b-lm70inqjbm] {
    display: grid;
    width: min(96vw, 92rem);
    max-height: 94vh;
    overflow: hidden;
    border: 1px solid rgba(239, 199, 99, 0.38);
    border-radius: 0.55rem;
    background: rgba(2, 8, 4, 0.98);
    box-shadow: 0 0 42px rgba(232, 181, 63, 0.12);
}

.map-popup__header[b-lm70inqjbm] {
    display: flex;
    padding: 0.8rem 0.95rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.map-popup__header h2[b-lm70inqjbm] {
    margin: 0.1rem 0 0;
    color: #fcf7ea;
    font-size: 1.05rem;
}

/* Nur die Bildansicht. Der Bearbeiten-Dialog teilt sich die Klasse
   map-popup__dialog und darf nicht mitgestreckt werden - er richtet
   sich nach seinem Inhalt. */
.map-popup__dialog--image[b-lm70inqjbm] {
    /* Zwei Zeilen: Kopf so hoch wie noetig, das Bild bekommt den Rest.
       Frueher rechnete das Bild seine Hoehe selbst aus (94vh minus
       geschaetzter Kopfhoehe) - eine Zahl, die bei jeder Aenderung am
       Kopf still falsch wird. */
    grid-template-rows: auto minmax(0, 1fr);
    /* Etwas Luft ringsum: vorher lag der Rahmen mit 98vw und voller
       Hoehe praktisch am Bildschirmrand - da war von der Zentrierung
       nichts zu sehen, weil nichts zu zentrieren uebrig blieb. */
    /* Schmaler als der Bildschirm und mittig darin. Die alten 104rem
       (rund 1660px) waren fuer eine Map zu breit: Maps sind meist
       quadratisch, die ueberzaehlige Breite wurde ohnehin nur zu
       schwarzer Flaeche links und rechts. */
    width: min(82vw, 68rem);

    /* Hier stand `height: 92%`, und daran hing die ganze Kette:
       92 % wovon? Die Umgebung (.map-popup) zentriert ihre Kinder und
       misst sich deshalb an deren Inhalt - ihre Hoehe ist unbestimmt.
       Ein Prozentwert auf eine unbestimmte Hoehe faellt aus, der
       Rahmen bekam also die Hoehe seines Inhalts, die Bildzeile
       ebenso, und das `height: 100%` des Bildes fiel gleich mit aus.
       Uebrig blieb das Bild in Originalgroesse - zu gross, und vom
       overflow des Rahmens unten abgeschnitten.
       92vh sind dagegen eine feste Zahl. Damit ist die Hoehe des
       Rahmens bestimmt, die Bildzeile bekommt ihren Rest, und das
       Bild passt sich ein. */
    height: 88vh;
    max-height: 88vh;
    margin: auto;
}

/* Auf einem Telefon zaehlt jeder Millimeter - dort bleibt der Rahmen
   so breit wie moeglich. */
@media (max-width: 640.98px) {
    .map-popup__dialog--image[b-lm70inqjbm] {
        width: 94vw;
        height: 90vh;
        max-height: 90vh;
    }
}

.map-popup__actions[b-lm70inqjbm] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.5rem;
}

/* Der Bildkasten spannt die Flaeche auf, das Bild haengt darin
   absolut. Das ist der Punkt, an dem es vorher scheiterte: der Kasten
   ist ein Rasterfeld ohne eigene Hoehenangabe (`height: auto`), und ein
   Prozentwert am Kind faellt gegen eine solche Hoehe aus - `height:
   100%` und `max-height: 100%` am Bild waren beide wirkungslos, das
   Bild nahm seine Breite und rechnete die Hoehe aus dem
   Seitenverhaeltnis. Bei einer quadratischen Map war es dadurch
   doppelt so hoch wie der Kasten und wurde unten abgeschnitten.
   `position: absolute; inset: 0` umgeht die ganze Kette: der Rahmen
   des Bildes steht damit fest, und object-fit kann einpassen. */
.map-popup__image[b-lm70inqjbm] {
    position: relative;
    min-height: 0;
    overflow: hidden;
    background: #000;
}

/* Eingepasst: das Bild fuellt die Flaeche aus.
   max-width allein reichte nicht - es begrenzt nur und vergroessert
   nie. Eine kleine Mapdatei blieb dadurch klein und stand verloren in
   einem riesigen schwarzen Kasten. Mit width/height plus
   object-fit:contain waechst sie bis an den Rand und behaelt dabei ihr
   Seitenverhaeltnis. */
.map-popup__image img[b-lm70inqjbm] {
    position: absolute;
    display: block;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: zoom-in;
}

/* Originalgroesse: Pixel fuer Pixel, die Flaeche scrollt.
   Fuer den Blick in eine einzelne Ecke - beim Einpassen wird eine
   grosse Map so weit heruntergerechnet, dass Details verschwinden. */
.map-popup__image--zoom[b-lm70inqjbm] {
    overflow: auto;
}

/* In Originalgroesse haengt das Bild nicht mehr im Rahmen, sondern
   steht normal im Fluss - sonst koennte die Flaeche nicht scrollen. */
.map-popup__image--zoom img[b-lm70inqjbm] {
    position: static;
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
    object-fit: none;
    cursor: zoom-out;
}

/* ---- Reiter ---- */

.map-tabs[b-lm70inqjbm] {
    display: flex;
    margin-bottom: 1rem;
    gap: 0.4rem;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
}

.map-tabs__button[b-lm70inqjbm] {
    display: inline-flex;
    padding: 0.5rem 0.9rem;
    align-items: center;
    gap: 0.45rem;
    color: #cbbfa6;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 0.4rem 0.4rem 0 0;
    background: transparent;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
}

.map-tabs__button:hover[b-lm70inqjbm] {
    color: #faf2dd;
    background: rgba(232, 181, 63, 0.08);
}

.map-tabs__button.is-active[b-lm70inqjbm] {
    color: #f7e7bb;
    border-color: rgba(232, 181, 63, 0.34);
    background: rgba(28, 21, 4, 0.72);
}

.map-tabs__count[b-lm70inqjbm] {
    display: inline-block;
    min-width: 1.4rem;
    padding: 0.05rem 0.35rem;
    color: #0d0b04;
    border-radius: 999px;
    background: #efc763;
    font-size: 0.7rem;
    text-align: center;
}

/* ---- Einreichen ---- */

.map-submit__intro[b-lm70inqjbm] {
    max-width: 52rem;
    margin-bottom: 1rem;
    color: #cbbfa6;
    font-size: 0.88rem;
}

.map-submit__own[b-lm70inqjbm] {
    margin-top: 1rem;
}

.map-submit__own h3[b-lm70inqjbm] {
    margin: 0 0 0.75rem;
    color: #fcf7ea;
    font-size: 0.98rem;
}

.map-submit__empty[b-lm70inqjbm] {
    margin: 0;
    color: #9d968a;
    font-size: 0.86rem;
}

.map-submit__list[b-lm70inqjbm] {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.7rem;
    list-style: none;
}

.map-submit__list li[b-lm70inqjbm] {
    display: grid;
    padding: 0.6rem;
    align-items: center;
    gap: 0.8rem;
    grid-template-columns: 7rem minmax(0, 1fr) auto;
    border: 1px solid rgba(232, 181, 63, 0.2);
    border-radius: 0.4rem;
    background: rgba(18, 14, 4, 0.5);
}

.map-submit__list img[b-lm70inqjbm] {
    display: block;
    width: 7rem;
    height: 4.4rem;
    border-radius: 0.3rem;
    background: #000;
    object-fit: contain;
    object-position: center;
}

.map-submit__list-text[b-lm70inqjbm] {
    display: grid;
    min-width: 0;
    gap: 0.15rem;
}

.map-submit__list-text strong[b-lm70inqjbm] {
    color: #fcf7ea;
}

.map-submit__list-text span[b-lm70inqjbm] {
    color: #9d968a;
    font-size: 0.78rem;
}

.map-submit__list-text p[b-lm70inqjbm] {
    margin: 0.25rem 0 0;
    color: #cbbfa6;
    font-size: 0.82rem;
}

/* ---- Prüfliste ---- */

.map-queue[b-lm70inqjbm] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(21rem, 1fr));
}

.map-queue__card[b-lm70inqjbm] {
    display: grid;
    overflow: hidden;
    grid-template-rows: auto minmax(0, 1fr);
}

.map-queue__image[b-lm70inqjbm] {
    display: block;
    padding: 0;
    border: none;
    background: #000;
    cursor: zoom-in;
}

.map-queue__image img[b-lm70inqjbm] {
    display: block;
    width: 100%;
    height: 11rem;
    object-fit: contain;
    object-position: center;
}

.map-queue__card h3[b-lm70inqjbm] {
    margin: 0 0 0.4rem;
    color: #fcf7ea;
    font-size: 1rem;
}

.map-queue__meta[b-lm70inqjbm] {
    display: flex;
    margin-bottom: 0.6rem;
    gap: 0.6rem;
    flex-wrap: wrap;
    color: #9d968a;
    font-size: 0.76rem;
}

.map-queue__description[b-lm70inqjbm] {
    margin: 0 0 0.8rem;
    color: #cbbfa6;
    font-size: 0.85rem;
    white-space: pre-wrap;
}

.map-queue__actions[b-lm70inqjbm] {
    display: flex;
    margin-top: 0.6rem;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.map-queue__actions .form-select[b-lm70inqjbm] {
    width: auto;
    min-width: 6rem;
}

.map-queue__reject[b-lm70inqjbm] {
    display: grid;
    gap: 0.4rem;
}

/* ---- Bearbeiten-Dialog ---- */

.map-edit[b-lm70inqjbm] {
    width: min(96vw, 68rem);
    grid-template-rows: auto minmax(0, 1fr);
}

.map-edit__body[b-lm70inqjbm] {
    min-height: 0;
    padding: 1rem;
    overflow-y: auto;
}

.map-edit__grid[b-lm70inqjbm] {
    display: grid;
    gap: 1.1rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
}

.map-edit__fields[b-lm70inqjbm] {
    display: grid;
    align-content: start;
    gap: 0.9rem;
}

.map-edit__preview[b-lm70inqjbm] {
    display: grid;
    align-content: start;
    gap: 0.4rem;
}

.map-edit__preview-label[b-lm70inqjbm] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.map-edit__preview img[b-lm70inqjbm] {
    display: block;
    width: 100%;
    max-height: 18rem;
    border: 1px solid rgba(232, 181, 63, 0.24);
    border-radius: 0.4rem;
    background: #000;
    object-fit: contain;
}

.map-edit__preview-empty[b-lm70inqjbm] {
    display: grid;
    min-height: 8rem;
    padding: 1rem;
    place-items: center;
    color: #9d968a;
    border: 1px dashed rgba(232, 181, 63, 0.28);
    border-radius: 0.4rem;
}

.map-edit__actions[b-lm70inqjbm] {
    display: flex;
    margin-top: 1.1rem;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.map-edit__log[b-lm70inqjbm] {
    margin-top: 1.4rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(232, 181, 63, 0.22);
}

.map-edit__log h3[b-lm70inqjbm] {
    margin: 0 0 0.6rem;
    color: #fcf7ea;
    font-size: 0.95rem;
}

.map-edit__log-empty[b-lm70inqjbm] {
    margin: 0;
    color: #9d968a;
    font-size: 0.85rem;
}

.map-edit__log-table[b-lm70inqjbm] {
    color: #e6ddcc;
    font-size: 0.82rem;
}

.map-edit__log-table th[b-lm70inqjbm] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.map-edit__log-count[b-lm70inqjbm] {
    display: inline-block;
    margin-left: 0.4rem;
    padding: 0.05rem 0.4rem;
    color: #f7e7bb;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-radius: 999px;
    font-size: 0.68rem;
    white-space: nowrap;
}

@media (max-width: 800px) {
    .map-edit__grid[b-lm70inqjbm] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 1000px) {
    .map-grid[b-lm70inqjbm] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .map-library__header[b-lm70inqjbm],
    .map-editor__heading[b-lm70inqjbm],
    .map-card__meta[b-lm70inqjbm],
    .map-popup__header[b-lm70inqjbm] {
        align-items: flex-start;
        flex-direction: column;
    }

    .map-grid[b-lm70inqjbm] {
        grid-template-columns: 1fr;
    }

    .map-library__count[b-lm70inqjbm] {
        align-self: flex-start;
    }

    .map-popup__actions[b-lm70inqjbm] {
        width: 100%;
    }

    .map-popup__header .btn[b-lm70inqjbm] {
        flex: 1 1 0;
    }

    .map-popup[b-lm70inqjbm] {
        padding: 0;
    }

    .map-popup__dialog--image[b-lm70inqjbm] {
        /* Auf dem Handy zaehlt jeder Pixel - dort randlos. */
        width: 100vw;
        height: 100%;
        margin: 0;
        border: 0;
        border-radius: 0;
    }
}

.map-filter[b-lm70inqjbm] {
    display: flex;
    min-height: 4.1rem;
    padding: 0.75rem 0.9rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.22);
    border-radius: 0.5rem;
    background: rgba(2, 13, 7, 0.72);
}

.map-filter > div[b-lm70inqjbm] {
    display: grid;
    gap: 0.12rem;
}

.map-filter__label[b-lm70inqjbm] {
    color: rgba(217, 212, 200, 0.65);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.map-filter strong[b-lm70inqjbm] {
    color: #fbf6e8;
    font-size: 0.95rem;
}

.map-filter .form-select[b-lm70inqjbm] {
    width: min(100%, 16rem);
}

.map-card__topline[b-lm70inqjbm] {
    /* Seit die MAP-Id raus ist, steht nur noch das Badge in der Zeile.
       flex-end haelt es rechtsbuendig statt links. */
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
}

.map-category-badge[b-lm70inqjbm] {
    display: inline-flex;
    min-height: 1.45rem;
    padding: 0.2rem 0.48rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(239, 199, 99, 0.3);
    border-radius: 999px;
    background: rgba(28, 21, 3, 0.72);
    color: #fbf4e3;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0.07em;
    line-height: 1;
    text-transform: uppercase;
}

.map-category-badge--2v2[b-lm70inqjbm] {
    border-color: rgba(140, 226, 168, 0.45);
    background: rgba(6, 38, 22, 0.72);
    color: #c6f2d6;
}

.map-category-badge--ffa[b-lm70inqjbm] {
    border-color: rgba(245, 196, 81, 0.45);
    background: rgba(48, 32, 3, 0.72);
    color: #ffe5a0;
}

.map-category-badge--fun[b-lm70inqjbm] {
    border-color: rgba(102, 181, 255, 0.42);
    background: rgba(4, 28, 48, 0.72);
    color: #cceaff;
}

.map-category-badge--td[b-lm70inqjbm] {
    border-color: rgba(255, 99, 99, 0.42);
    background: rgba(48, 4, 4, 0.72);
    color: #ffd0d0;
}

.map-card__category-editor[b-lm70inqjbm] {
    display: grid;
    margin-top: 0.85rem;
    padding-top: 0.75rem;
    gap: 0.35rem;
    border-top: 1px solid rgba(232, 181, 63, 0.15);
}

.map-card__category-editor label[b-lm70inqjbm] {
    color: rgba(217, 212, 200, 0.66);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

@media (max-width: 640px) {
    .map-filter[b-lm70inqjbm] {
        align-items: stretch;
        flex-direction: column;
    }

    .map-filter .form-select[b-lm70inqjbm] {
        width: 100%;
    }
}

/* ------------------------------------------------------------------
   Kategorie- und Seasonfilter nebeneinander
   Die Regel muss ueber .map-filter > div stehen, sonst gewinnt deren
   hoehere Spezifitaet und die beiden Selects stapeln sich.
   ------------------------------------------------------------------ */
.map-filter > .map-filter__controls[b-lm70inqjbm] {
    display: flex;
    flex: 0 1 auto;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.6rem;
}

.map-filter > .map-filter__controls .form-select[b-lm70inqjbm] {
    width: min(100%, 13rem);
}

/* ------------------------------------------------------------------
   Aktiv-Schalter und Loeschen (nur Admin und MapDev)
   ------------------------------------------------------------------ */
.map-card--inactive[b-lm70inqjbm] {
    border-color: rgba(217, 212, 200, 0.18);
    opacity: 0.72;
}

.map-card--inactive .map-card__preview img[b-lm70inqjbm] {
    filter: grayscale(0.85);
}

.map-card__state--active[b-lm70inqjbm] {
    color: #f3d079;
}

.map-card__state--inactive[b-lm70inqjbm] {
    color: #ffb4b4;
}

.map-card__admin[b-lm70inqjbm] {
    display: flex;
    margin-top: 0.7rem;
    padding-top: 0.7rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    border-top: 1px solid rgba(232, 181, 63, 0.15);
}

.map-card__admin .form-check-label[b-lm70inqjbm] {
    color: rgba(217, 212, 200, 0.8);
    font-size: 0.76rem;
}

.map-card__confirm[b-lm70inqjbm] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.map-card__confirm span[b-lm70inqjbm] {
    color: #ffb4b4;
    font-size: 0.74rem;
    font-weight: 700;
}

@media (max-width: 640px) {
    .map-filter > .map-filter__controls[b-lm70inqjbm] {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }
}

/* ---- Grund einer stillgelegten Map ----
   Steht nur im Reiter "Inaktiv". Abgesetzt, aber nicht als eigene
   Karte: es gehoert zur Map, nicht daneben. */
.map-card__reason[b-lm70inqjbm] {
    margin-top: 0.6rem;
    padding-top: 0.55rem;
    border-top: 1px solid rgba(217, 212, 200, 0.13);
}

.map-card__reason-text[b-lm70inqjbm] {
    margin: 0;
    font-size: 0.86rem;
    line-height: 1.45;
}

.map-card__reason-by[b-lm70inqjbm] {
    margin: 0.2rem 0 0;
    color: rgba(217, 212, 200, 0.34);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
}

.map-card__reason-missing[b-lm70inqjbm] {
    margin: 0;
    color: rgba(232, 181, 63, 0.75);
    font-size: 0.84rem;
}

.map-card__reason-edit[b-lm70inqjbm] {
    padding: 0.1rem 0;
    color: rgba(217, 212, 200, 0.58);
    font-size: 0.8rem;
    text-decoration: none;
}

.map-card__reason-edit:hover[b-lm70inqjbm] {
    color: #e8b53f;
}

.map-card__reason-actions[b-lm70inqjbm] {
    display: flex;
    margin-top: 0.4rem;
    flex-wrap: wrap;
    gap: 0.35rem;
}
/* /Components/Pages/Navigation/HubBoard.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Diese Datei ist seit v20 leer.

   Die Stile der Kachelseite sind nach NavBoard.razor.css gewandert:
   die Isolation haengt an der Komponente, und das Markup steht jetzt
   dort. Was hier stuende, wuerde auf ein Element treffen, das es in
   HubBoard nicht mehr gibt.

   Die Datei bleibt liegen, damit klar ist, wohin die Stile gegangen
   sind - und damit niemand sie hier wieder anlegt.
   ------------------------------------------------------------------ */
/* /Components/Pages/Onboarding/OnboardingTour.razor.rz.scp.css */
.tour[b-sk4ubjlo94] {
    max-width: 54rem;
}

.tour__header[b-sk4ubjlo94] {
    margin-bottom: 1.25rem;
}

.tour__eyebrow[b-sk4ubjlo94] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.tour__header h1[b-sk4ubjlo94] {
    margin: 0;
}

.tour__counter[b-sk4ubjlo94] {
    margin: 0.3rem 0 0;
    color: rgba(217, 212, 200, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.76rem;
}

/* ---- Der Schrittbalken ----
   Auf breiten Bildschirmen mit Beschriftung, auf schmalen nur die
   Punkte: acht Woerter nebeneinander passen dort nicht. */
.tour__rail[b-sk4ubjlo94] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.tour__rail-step[b-sk4ubjlo94] {
    display: flex;
    padding: 0.35rem 0.6rem;
    align-items: center;
    gap: 0.4rem;
    border: 1px solid rgba(217, 212, 200, 0.16);
    border-radius: 2rem;
    background: transparent;
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.76rem;
    cursor: pointer;
}

.tour__rail-step:hover[b-sk4ubjlo94] {
    border-color: rgba(232, 181, 63, 0.45);
    color: rgba(217, 212, 200, 0.9);
}

.tour__rail-dot[b-sk4ubjlo94] {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: rgba(217, 212, 200, 0.3);
    flex: 0 0 auto;
}

.tour__rail-step--done[b-sk4ubjlo94] {
    border-color: rgba(232, 181, 63, 0.3);
    color: rgba(217, 212, 200, 0.75);
}

.tour__rail-step--done .tour__rail-dot[b-sk4ubjlo94] {
    background: rgba(232, 181, 63, 0.7);
}

.tour__rail-step--now[b-sk4ubjlo94] {
    border-color: rgba(232, 181, 63, 0.75);
    background: rgba(232, 181, 63, 0.1);
    color: #e8b53f;
    font-weight: 700;
}

.tour__rail-step--now .tour__rail-dot[b-sk4ubjlo94] {
    background: #e8b53f;
}

@media (max-width: 52rem) {
    .tour__rail-label[b-sk4ubjlo94] {
        display: none;
    }

    .tour__rail-step[b-sk4ubjlo94] {
        padding: 0.45rem;
    }
}

/* ---- Die Arbeitsflaeche ---- */
.tour__panel[b-sk4ubjlo94] {
    min-height: 18rem;
    padding: 1.4rem;
    border: 1px solid rgba(232, 181, 63, 0.26);
    border-radius: 0.5rem;
    background: rgba(20, 18, 15, 0.5);
}

.tour__lead[b-sk4ubjlo94] {
    max-width: 44rem;
    margin-bottom: 1rem;
    font-size: 0.98rem;
    line-height: 1.6;
}

.tour__muted[b-sk4ubjlo94] {
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.9rem;
}

.tour__links[b-sk4ubjlo94] {
    display: flex;
    margin-top: 1.25rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* ---- Schritt „Dein Konto" ---- */
.tour__facts[b-sk4ubjlo94] {
    display: grid;
    margin: 0;
    grid-template-columns: max-content 1fr;
    gap: 0.4rem 1.25rem;
}

.tour__facts dt[b-sk4ubjlo94] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.8rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.tour__facts dd[b-sk4ubjlo94] {
    margin: 0;
    font-weight: 700;
}

/* ---- Schritte „Seasons" und „Turniere" ---- */
.tour__cards[b-sk4ubjlo94] {
    display: grid;
    margin: 0;
    padding: 0;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: 0.6rem;
    list-style: none;
}

.tour__card[b-sk4ubjlo94] {
    display: flex;
    padding: 0.75rem 0.9rem;
    flex-direction: column;
    gap: 0.25rem;
    border: 1px solid rgba(217, 212, 200, 0.14);
    border-radius: 0.4rem;
    background: rgba(20, 18, 15, 0.4);
}

.tour__card-eyebrow[b-sk4ubjlo94] {
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.tour__card-title[b-sk4ubjlo94] {
    line-height: 1.3;
}

.tour__card .badge[b-sk4ubjlo94] {
    align-self: flex-start;
    margin-top: 0.2rem;
}

/* ---- Schritt „Wo ihr uns findet" ----
   Dieselben Knoepfe wie am Fuss der Startseite, aber eigenstaendig
   gestaltet: das Stylesheet der Startseite ist seitengebunden (scoped),
   seine Regeln greifen hier nicht. Bewusst neutral gehalten - die
   Markenfarben stehen drueben, und eine zweite, halb nachgebaute Kopie
   davon waere schlechter als gar keine. */
.tour__channels[b-sk4ubjlo94] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.tour__channels .social-btn[b-sk4ubjlo94] {
    display: flex;
    min-width: 10rem;
    padding: 0.7rem 1rem;
    flex-direction: column;
    gap: 0.1rem;
    border: 1px solid rgba(232, 181, 63, 0.3);
    border-radius: 0.4rem;
    background: rgba(20, 18, 15, 0.45);
    color: inherit;
    text-decoration: none;
}

.tour__channels .social-btn:hover[b-sk4ubjlo94] {
    border-color: rgba(232, 181, 63, 0.7);
    background: rgba(232, 181, 63, 0.08);
}

.tour__channels .social-btn__name[b-sk4ubjlo94] {
    font-weight: 700;
}

.tour__channels .social-btn__hint[b-sk4ubjlo94] {
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.76rem;
}

/* ---- Schritt „Rein in die Liga" ---- */
.tour__ways[b-sk4ubjlo94] {
    display: grid;
    margin-bottom: 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 0.75rem;
}

.tour__way[b-sk4ubjlo94] {
    padding: 0.9rem 1rem;
    border: 1px solid rgba(217, 212, 200, 0.14);
    border-radius: 0.4rem;
    background: rgba(20, 18, 15, 0.4);
}

.tour__way p[b-sk4ubjlo94] {
    margin: 0.35rem 0 0;
    color: rgba(217, 212, 200, 0.75);
    font-size: 0.88rem;
    line-height: 1.5;
}

/* ---- Schlussliste ---- */
.tour__checklist[b-sk4ubjlo94] {
    margin: 0 0 1rem;
    padding: 0;
    list-style: none;
}

.tour__check[b-sk4ubjlo94] {
    padding-left: 1.6rem;
    color: rgba(217, 212, 200, 0.6);
    line-height: 1.9;
    position: relative;
}

.tour__check[b-sk4ubjlo94]::before {
    content: "○";
    left: 0;
    position: absolute;
}

.tour__check--done[b-sk4ubjlo94] {
    color: rgba(217, 212, 200, 0.95);
}

.tour__check--done[b-sk4ubjlo94]::before {
    content: "✓";
    color: #6fbf73;
}

/* ---- Fuss ---- */
.tour__foot[b-sk4ubjlo94] {
    display: flex;
    margin-top: 1.25rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.tour__foot-main[b-sk4ubjlo94] {
    display: flex;
    gap: 0.5rem;
}

.tour__foot-exit[b-sk4ubjlo94] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* „Nicht mehr anzeigen" ist der endgueltigere der beiden Wege raus und
   soll sich nicht vordraengen. */
.tour__quiet[b-sk4ubjlo94] {
    color: rgba(217, 212, 200, 0.45);
    font-size: 0.85rem;
}

/* ---- Der Hinweiskasten ----
   Für den einen Satz, der nicht überlesen werden darf. Rot statt Gold:
   Gold trägt in dieser Oberfläche das Laufende und das Erreichte, Rot
   das, was jemand noch tun muss. Ein senkrechter Balken links statt
   eines Rahmens ringsum - er zieht das Auge in die Zeile, ohne den
   Kasten wie eine Fehlermeldung aussehen zu lassen. */
.tour__note[b-sk4ubjlo94] {
    margin-top: 1.1rem;
    padding: 0.8rem 1rem;
    border-left: 3px solid rgba(239, 38, 56, 0.75);
    background: rgba(60, 12, 16, 0.28);
    color: rgba(230, 222, 210, 0.92);
    font-size: 0.92rem;
    line-height: 1.5;
}

.tour__note strong[b-sk4ubjlo94] {
    display: block;
    margin-bottom: 0.2rem;
    color: #ffb4b4;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
/* /Components/Pages/Onboarding/PlayerDashboard.razor.rz.scp.css */
.mine[b-s9wc096dx8] {
    max-width: 72rem;
}

.mine__header[b-s9wc096dx8] {
    display: flex;
    margin-bottom: 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.mine__eyebrow[b-s9wc096dx8] {
    display: block;
    margin-bottom: 0.2rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.mine__header h1[b-s9wc096dx8] {
    margin: 0;
}

.mine__subtitle[b-s9wc096dx8] {
    max-width: 40rem;
    margin: 0.4rem 0 0;
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.9rem;
}

.mine__section[b-s9wc096dx8] {
    margin-bottom: 1.75rem;
    padding-top: 1.1rem;
    border-top: 1px solid rgba(217, 212, 200, 0.14);
}

.mine__section h2[b-s9wc096dx8],
.mine__card h2[b-s9wc096dx8] {
    margin-bottom: 0.7rem;
    font-size: 1rem;
    letter-spacing: 0.02em;
}

.mine__muted[b-s9wc096dx8] {
    margin: 0;
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.88rem;
    line-height: 1.5;
}

/* Nichts offen ist eine gute Nachricht und sieht auch so aus. */
.mine__clear[b-s9wc096dx8] {
    margin: 0;
    padding: 0.7rem 1rem;
    border-left: 3px solid rgba(111, 191, 115, 0.7);
    background: rgba(111, 191, 115, 0.08);
    color: rgba(217, 212, 200, 0.9);
}

/* ---- Offene Punkte ---- */
.mine__todo[b-s9wc096dx8] {
    display: grid;
    margin: 0;
    padding: 0;
    grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
    gap: 0.5rem;
    list-style: none;
}

/* ---- Warteschlange als Taste ----
   Gleiche Form wie im Menueband und in der Leiste: harte Kanten, eine
   Fase aus vier Linien, ein Druckpunkt der sich bewegt. Die Patina
   liegt als eigene Schicht darueber, siehe wwwroot/retro-tasten.css. */
.mine__todo-item a[b-s9wc096dx8],
.mine__todo-link[b-s9wc096dx8] {
    position: relative;
    display: flex;
    padding: 0.58rem 0.85rem;
    align-items: center;
    gap: 0.7rem;

    border-width: 2px;
    border-style: solid;
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    border-radius: 0;

    background: linear-gradient(180deg, #3a2f16 0%, #241d0f 100%);
    color: #ffe08a;
    text-decoration: none;
    transition: background 90ms linear, border-color 90ms linear;
}

.mine__todo-item a:hover[b-s9wc096dx8],
.mine__todo-link:hover[b-s9wc096dx8] {
    background: linear-gradient(180deg, #45381a 0%, #2b2212 100%);
}

.mine__todo-item a:active[b-s9wc096dx8],
.mine__todo-link:active[b-s9wc096dx8] {
    border-color:
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75)
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9);
    padding: calc(0.58rem + 1px) calc(0.85rem - 1px)
             calc(0.58rem - 1px) calc(0.85rem + 1px);
}

/* Die Leuchte: ein Quadrat, kein Kreis. */
.mine__todo-led[b-s9wc096dx8] {
    width: 0.42rem;
    height: 0.42rem;
    flex: 0 0 auto;
    background: #e8b53f;
    box-shadow: 0 0 4px rgba(232, 181, 63, 0.8);
}

.mine__todo-link--old .mine__todo-led[b-s9wc096dx8] {
    background: #d96464;
    box-shadow: 0 0 4px rgba(217, 100, 100, 0.75);
}

.mine__todo-count[b-s9wc096dx8] {
    min-width: 1.9rem;
    padding: 0.05rem 0.4rem;
    border-radius: 0;
    background: #e8b53f;
    color: #14120f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.85rem;
    font-weight: 800;
    text-align: center;
    flex: 0 0 auto;
}

.mine__todo-text[b-s9wc096dx8] {
    font-size: 0.9rem;
    line-height: 1.35;
}

/* ---- Die Kacheln ---- */
.mine__grid[b-s9wc096dx8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: 0.75rem;
}

/* ---- Die Kachel als Konsolenfeld ----
   Vorher: abgerundetes Rechteck, grauer Rahmen, sonst nichts - neben
   den Tasten daruber sah es aus wie aus einem anderen Programm. Jetzt
   traegt sie dieselbe Sprache: harte Kanten, Kupferrahmen, eine Fase
   nach innen, die feine Rasterung der Tasten und oben rechts eine
   angesetzte Ecke. Nichts davon blinkt - es ist der Rahmen, nicht der
   Inhalt. */
.mine__card[b-s9wc096dx8] {
    position: relative;
    display: flex;
    padding: 0.85rem 1rem 1rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.24);
    border-radius: 0;
    background:
        linear-gradient(
            180deg,
            rgba(30, 27, 22, 0.72),
            rgba(12, 11, 9, 0.72)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        inset 0 0 0 1px rgba(0, 0, 0, 0.5),
        0 6px 18px rgba(0, 0, 0, 0.32);
}

/* Die Rasterung. Zwei Prozent Weiss im Dreipixelraster - man sieht sie
   nicht, man merkt sie nur, wenn sie fehlt. */
.mine__card[b-s9wc096dx8]::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background:
        repeating-linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.02) 0,
            rgba(255, 255, 255, 0.02) 1px,
            transparent 1px,
            transparent 3px
        );
}

/* Die angesetzte Ecke oben rechts - der einzige Zierat, und er sitzt
   dort, wo kein Text steht. */
.mine__card[b-s9wc096dx8]::after {
    position: absolute;
    top: 0;
    right: 0;
    width: 0.8rem;
    height: 0.8rem;
    content: "";
    border-top: 2px solid rgba(232, 181, 63, 0.5);
    border-right: 2px solid rgba(232, 181, 63, 0.5);
    pointer-events: none;
}

/* Der Inhalt liegt ueber der Rasterung. */
.mine__card > *[b-s9wc096dx8] {
    position: relative;
    z-index: 1;
}

/* Die Ueberschrift wird zur Beschriftung des Feldes: Monospace,
   gesperrt, mit einer kleinen Leuchte davor und einer Trennlinie
   darunter. */
.mine__card h2[b-s9wc096dx8] {
    position: relative;
    width: 100%;
    margin: 0 0 0.65rem;
    padding: 0 0 0.45rem 0.95rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.18);
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.mine__card h2[b-s9wc096dx8]::before {
    position: absolute;
    top: 0.24rem;
    left: 0;
    width: 0.4rem;
    height: 0.4rem;
    content: "";
    background: #e8b53f;
    box-shadow: 0 0 4px rgba(232, 181, 63, 0.55);
}

/* Die Taste sitzt am Fuss der Kachel: `margin-top: auto` schiebt sie
   dorthin, damit die Tasten einer Rasterzeile auf einer Linie stehen,
   egal wie lang der Text darueber ist. */
.mine__card .mine__key[b-s9wc096dx8] {
    margin-top: auto;
}

/* ---- Die Taste ----
   Dieselbe Bauart wie die Blockleisten und das Menueband: keine
   Rundung, eine Fase aus vier Linien, ein Druckpunkt der sich bewegt.
   Vorher standen hier Bootstrap-Knoepfe (btn-outline-secondary) - grau,
   rund, und in einer Oberflaeche aus Kupfer und Schwarz das einzige,
   was nach Formular aussah. */
.mine__key[b-s9wc096dx8] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.42rem 0.9rem 0.38rem;

    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;

    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    transition: color 90ms linear, background 90ms linear,
                border-color 90ms linear;
}

/* Abnutzung: ein schwacher Schleier, damit die Taste nicht wie frisch
   gespritzt aussieht. */
.mine__key[b-s9wc096dx8]::after {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    opacity: 0.5;
    background:
        repeating-linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.025) 0,
            rgba(255, 255, 255, 0.025) 1px,
            transparent 1px,
            transparent 3px
        ),
        radial-gradient(
            ellipse at 22% 130%,
            rgba(0, 0, 0, 0.28),
            transparent 62%
        );
}

.mine__key:hover[b-s9wc096dx8],
.mine__key:focus-visible[b-s9wc096dx8] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
    text-decoration: none;
}

/* Gedrueckt: Fase umgekehrt, Inhalt einen Punkt nach unten rechts. */
.mine__key:active[b-s9wc096dx8] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    background: linear-gradient(180deg, #191612 0%, #211d18 100%);
    padding: calc(0.42rem + 1px) calc(0.9rem - 1px)
             calc(0.38rem - 1px) calc(0.9rem + 1px);
}

.mine__card-title[b-s9wc096dx8] {
    font-size: 1.02rem;
    line-height: 1.3;
}

/* Eine Zahl, die man ueber den Bildschirm hinweg noch liest. */
.mine__card-big[b-s9wc096dx8] {
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.1;
}

.mine__card-sub[b-s9wc096dx8] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.78rem;
    letter-spacing: 0.03em;
}

.mine__card-line[b-s9wc096dx8] {
    margin: 0.5rem 0 0;
    color: rgba(217, 212, 200, 0.8);
    font-size: 0.88rem;
    line-height: 1.5;
}

.mine__list[b-s9wc096dx8] {
    margin: 0.3rem 0 0;
    padding: 0;
    list-style: none;
}

.mine__list li[b-s9wc096dx8] {
    padding: 0.25rem 0;
    line-height: 1.4;
}

.mine__list-note[b-s9wc096dx8] {
    margin-left: 0.5rem;
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.76rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* ---- Mein Konto ----
   Die Angaben links, die Wege dorthin rechts. Auf schmalen Bildschirmen
   untereinander. */
.mine__account[b-s9wc096dx8] {
    display: grid;
    grid-template-columns: minmax(16rem, 24rem) 1fr;
    gap: 1.25rem 2.5rem;
}

@media (max-width: 48rem) {
    .mine__account[b-s9wc096dx8] {
        grid-template-columns: 1fr;
    }
}

.mine__facts[b-s9wc096dx8] {
    display: grid;
    margin: 0;
    grid-template-columns: max-content 1fr;
    gap: 0.4rem 1.25rem;
    align-content: start;
}

.mine__facts dt[b-s9wc096dx8] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.78rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.mine__facts dd[b-s9wc096dx8] {
    margin: 0;
    font-weight: 700;
}

.mine__warn[b-s9wc096dx8] {
    margin-left: 0.5rem;
    color: #e8b53f;
    font-size: 0.76rem;
    font-weight: 400;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.mine__account-links[b-s9wc096dx8] {
    display: flex;
    align-content: start;
    flex-wrap: wrap;
    gap: 0.4rem;
}

/* Das Loeschen ist nicht rueckgaengig zu machen und soll sich von den
   uebrigen Wegen unterscheiden - ohne sich vorzudraengen. */
.mine__danger[b-s9wc096dx8] {
    /* Die Fase bleibt eine Fase, nur in Rot - eine einfarbige Kante
       haette die Taste wieder flach gemacht. */
    margin-left: auto;
    border-color:
        rgba(217, 100, 100, 0.5) rgba(96, 26, 26, 0.9)
        rgba(96, 26, 26, 0.9) rgba(217, 100, 100, 0.5);
    background: linear-gradient(180deg, #2d1d1b 0%, #1d1412 100%);
    color: rgba(226, 150, 150, 0.92);
}

.mine__danger:hover[b-s9wc096dx8],
.mine__danger:focus-visible[b-s9wc096dx8] {
    border-color:
        rgba(239, 130, 130, 0.75) rgba(112, 30, 30, 0.95)
        rgba(112, 30, 30, 0.95) rgba(239, 130, 130, 0.75);
    background: linear-gradient(180deg, #3a2320 0%, #251817 100%);
    color: #f6d9d9;
}

.mine__danger:active[b-s9wc096dx8] {
    border-color:
        rgba(96, 26, 26, 0.9) rgba(217, 100, 100, 0.5)
        rgba(217, 100, 100, 0.5) rgba(96, 26, 26, 0.9);
    background: linear-gradient(180deg, #180f0e 0%, #221614 100%);
}

/* ---- Warteschlangen im Pult ----
   Das Alter unter der Beschriftung. Eine blosse Zahl sagt nicht, ob
   etwas liegen bleibt. */
.mine__todo-age[b-s9wc096dx8] {
    display: block;
    color: rgba(217, 212, 200, 0.45);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
}

/* Aelter als drei Tage. Rot ist hier ein Zustand, keine Zierde - es
   kommt sonst nirgends auf dieser Seite vor. */
.mine__todo-link--old[b-s9wc096dx8] {
    border-color:
        rgba(217, 100, 100, 0.6) rgba(90, 30, 30, 0.9)
        rgba(90, 30, 30, 0.9) rgba(217, 100, 100, 0.6) !important;
    background: linear-gradient(180deg, #3a1d1d 0%, #241111 100%) !important;
    color: #f0c9c9 !important;
}

.mine__todo-link--old:hover[b-s9wc096dx8] {
    background: linear-gradient(180deg, #452222 0%, #2b1414 100%) !important;
}

.mine__todo-link--old:active[b-s9wc096dx8] {
    border-color:
        rgba(90, 30, 30, 0.9) rgba(217, 100, 100, 0.6)
        rgba(217, 100, 100, 0.6) rgba(90, 30, 30, 0.9) !important;
}

.mine__todo-link--old .mine__todo-count[b-s9wc096dx8] {
    background: #d96464;
    color: #14120f;
}

.mine__todo-link--old .mine__todo-age[b-s9wc096dx8] {
    color: rgba(217, 130, 130, 0.85);
}

/* ---- Die ruhigen Wege eines Blocks ----
   Kein Handlungsdruck, also keine Flaeche: nur Text mit Unterstrich
   beim Zeigen. */
.mine__blocklinks[b-s9wc096dx8] {
    display: grid;
    margin-top: 0.75rem;
    grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
    gap: 0.15rem 1.1rem;
}

/* Die ruhigen Wege: dieselbe Taste, nur mattes Blech statt Gold —
   hier liegt nichts an. */
.mine__blocklinks a[b-s9wc096dx8] {
    position: relative;
    display: flex;
    padding: 0.36rem 0.6rem;
    align-items: center;
    gap: 0.5rem;

    /* Beides gehoert zusammen: `min-width: 0` erlaubt dem Inhalt, in
       der Rasterspalte zu schrumpfen (ein Flexkind weigert sich sonst,
       kleiner als sein Inhalt zu werden), `overflow: hidden` haelt
       fest, was trotzdem nicht passt. Ohne die zwei Zeilen wanderte
       der Zusatz rechts aus der Taste heraus und unter die naechste. */
    min-width: 0;
    overflow: hidden;

    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;

    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: rgba(217, 212, 200, 0.72);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-decoration: none;
    text-transform: uppercase;
    transition: background 90ms linear, border-color 90ms linear,
                color 90ms linear;
}

.mine__blocklinks a:hover[b-s9wc096dx8] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312727 0%, #24201a 100%);
    color: #fcf8ed;
}

.mine__blocklinks a:active[b-s9wc096dx8] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    background: linear-gradient(180deg, #191612 0%, #211d18 100%);
    padding: calc(0.36rem + 1px) calc(0.6rem - 1px)
             calc(0.36rem - 1px) calc(0.6rem + 1px);
}

/* Matte Leuchte: der Weg ist da, aber nichts blinkt. */
.mine__blocklinks .mine__todo-led[b-s9wc096dx8] {
    background: #3a352b;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.6);
}

.mine__blocklinks a:hover .mine__todo-led[b-s9wc096dx8] {
    background: rgba(232, 181, 63, 0.55);
    box-shadow: none;
}

/* Die Beschriftung darf kuerzen, der Zusatz nicht: eine abgeschnittene
   Zahl waere schlimmer als ein abgeschnittenes Wort. */
.mine__linklabel[b-s9wc096dx8] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mine__linkmeta[b-s9wc096dx8] {
    flex: 0 0 auto;
    margin-left: auto;
    color: rgba(217, 212, 200, 0.34);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* ------------------------------------------------------------------
   Der feste Streifen

   Auf jedem Register derselbe. Leise gehalten: er ist ein Griff, kein
   Inhalt - und soll die Register darunter nicht ueberstrahlen.
   ------------------------------------------------------------------ */
.mine__streifen[b-s9wc096dx8] {
    display: flex;
    margin-bottom: 0.9rem;
    padding: 0.5rem 0.7rem;
    gap: 0.45rem;
    align-items: center;
    flex-wrap: wrap;
    border: 1px solid rgba(232, 181, 63, 0.14);
    background: rgba(232, 181, 63, 0.04);
}

.mine__streifen-marke[b-s9wc096dx8] {
    margin-right: 0.35rem;
    color: rgba(217, 212, 200, 0.35);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.56rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.mine__streifen-stueck[b-s9wc096dx8] {
    padding: 0.22rem 0.6rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    background: rgba(8, 7, 5, 0.6);
    color: rgba(217, 212, 200, 0.7);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-decoration: none;
}

.mine__streifen-stueck:hover[b-s9wc096dx8],
.mine__streifen-stueck:focus-visible[b-s9wc096dx8] {
    border-color: rgba(232, 181, 63, 0.55);
    color: #ffe08a;
}

/* ------------------------------------------------------------------
   Die Register

   Ein Register je Rolle, nebeneinander. Auf schmalen Bildschirmen
   scrollt die Reihe waagerecht, statt umzubrechen - eine zweite Zeile
   Register sieht aus wie zwei Ebenen.
   ------------------------------------------------------------------ */
.mine__register[b-s9wc096dx8] {
    display: flex;
    margin-bottom: 0.75rem;
    gap: 0.3rem;
    align-items: stretch;
    overflow-x: auto;
    border-bottom: 1px solid rgba(232, 181, 63, 0.2);
}

.mine__register-taste[b-s9wc096dx8] {
    position: relative;
    display: flex;
    padding: 0.5rem 0.85rem;
    gap: 0.45rem;
    align-items: center;
    flex: 0 0 auto;

    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: none;

    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    white-space: nowrap;
    cursor: pointer;
}

.mine__register-taste:hover[b-s9wc096dx8] {
    color: rgba(221, 216, 203, 0.95);
}

.mine__register-taste:focus-visible[b-s9wc096dx8] {
    outline: 2px solid #e8b53f;
    outline-offset: -2px;
}

.mine__register-taste.is-active[b-s9wc096dx8] {
    border-bottom-color: #e8b53f;
    background: rgba(232, 181, 63, 0.07);
    color: #ffe08a;
}

.mine__register-count[b-s9wc096dx8] {
    padding: 0 0.32rem;
    border: 1px solid rgba(124, 196, 107, 0.5);
    background: rgba(124, 196, 107, 0.14);
    color: #9fd98f;
    font-size: 0.6rem;
    font-variant-numeric: tabular-nums;
}

/* Der rote Punkt: hier liegt etwas, und du stehst woanders. Nur dort -
   auf dem eigenen Register waere er eine Bestaetigung dessen, was man
   ohnehin gerade ansieht. */
.mine__register-neu[b-s9wc096dx8] {
    width: 0.42rem;
    height: 0.42rem;
    border-radius: 50%;
    background: #d9534f;
    box-shadow: 0 0 0 2px rgba(217, 83, 79, 0.22);
}

/* ---- Der Inhalt des offenen Registers ---- */
.mine__block[b-s9wc096dx8] {
    margin-bottom: 0.75rem;
}

.mine__block-head[b-s9wc096dx8] {
    position: relative;
    display: flex;
    width: 100%;
    padding: 0.55rem 0.8rem;
    align-items: center;
    gap: 0.6rem;

    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;

    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: rgba(217, 212, 200, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-align: left;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 90ms linear, border-color 90ms linear,
                color 90ms linear;
}

.mine__block-head:hover[b-s9wc096dx8] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312727 0%, #24201a 100%);
    color: #fcf8ed;
}

.mine__block-head:active[b-s9wc096dx8] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    background: linear-gradient(180deg, #191612 0%, #211d18 100%);
    padding: calc(0.55rem + 1px) calc(0.8rem - 1px)
             calc(0.55rem - 1px) calc(0.8rem + 1px);
}

/* Aufgeklappt: goldene Fase, wie der laufende Punkt anderswo. */
.mine__block-head.is-open[b-s9wc096dx8] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #3a2f16 0%, #241d0f 100%);
    color: #ffe08a;
}

.mine__block-led[b-s9wc096dx8] {
    width: 0.42rem;
    height: 0.42rem;
    flex: 0 0 auto;
    background: #3a352b;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.6);
}

.mine__block-head.is-open .mine__block-led[b-s9wc096dx8] {
    background: #e8b53f;
    box-shadow: 0 0 4px rgba(232, 181, 63, 0.8);
}

.mine__block-head.has-work .mine__block-led[b-s9wc096dx8] {
    background: #e8b53f;
    box-shadow: 0 0 4px rgba(232, 181, 63, 0.8);
}

.mine__block-title[b-s9wc096dx8] { flex: 1 1 auto; }

.mine__block-count[b-s9wc096dx8] {
    padding: 0 0.3rem;
    background: #e8b53f;
    color: #14120f;
    font-size: 0.66rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.mine__block-chevron[b-s9wc096dx8] {
    color: rgba(232, 181, 63, 0.8);
    font-size: 0.7rem;
}

/* Der Inhalt sitzt eingerueckt unter seinem Kopf — so sieht man, was
   zu welchem Block gehoert, auch wenn drei offen sind. */
.mine__block > .mine__todo[b-s9wc096dx8],
.mine__block > .mine__blocklinks[b-s9wc096dx8] {
    margin-top: 0.5rem;
    margin-left: 0.6rem;
    padding-left: 0.6rem;
    border-left: 1px solid rgba(232, 181, 63, 0.18);
}

/* ------------------------------------------------------------------
   Turnierkacheln

   Sie sitzen INNERHALB der Karte "Turniere" und nicht im grossen
   Raster daneben: laufen drei Turniere gleichzeitig, wuerden drei
   eigene Kacheln das Dashboard auseinanderziehen und Season,
   Spielplaner und Streamabend nach unten schieben. Hier bleiben sie
   beisammen, und die Karte waechst nur so weit, wie sie muss.
   ------------------------------------------------------------------ */

.mine__turniere[b-s9wc096dx8] {
    display: grid;
    width: 100%;
    gap: 0.45rem;
    grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
}

.mine__turnier[b-s9wc096dx8] {
    position: relative;
    display: flex;
    padding: 0.5rem 0.6rem 0.45rem;
    gap: 0.15rem;
    flex-direction: column;
    overflow: hidden;

    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    background: linear-gradient(180deg, #2a2620 0%, #1c1915 100%);

    color: #d9d4c8;
    text-decoration: none;
}

.mine__turnier:hover[b-s9wc096dx8],
.mine__turnier:focus-visible[b-s9wc096dx8] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
    text-decoration: none;
}

/* Gedrueckt: Fase umgekehrt, wie bei den uebrigen Tasten der Seite. */
.mine__turnier:active[b-s9wc096dx8] {
    border-color: #0a0907 #423b30 #423b30 #0a0907;
    background: linear-gradient(180deg, #191612 0%, #211d18 100%);
}

.mine__turnier-name[b-s9wc096dx8] {
    color: #fcf7ea;
    font-size: 0.93rem;
    font-weight: 700;
    line-height: 1.25;
}

.mine__turnier-art[b-s9wc096dx8] {
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.04em;
}

.mine__turnier-fuss[b-s9wc096dx8] {
    display: flex;
    margin-top: 0.3rem;
    gap: 0.4rem;
    align-items: baseline;
    flex-wrap: wrap;
    justify-content: space-between;
}

.mine__turnier-plaetze[b-s9wc096dx8] {
    color: rgba(217, 212, 200, 0.72);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
}

/* Nur wenn man selbst eingetragen ist. Das ist die eine Auskunft, fuer
   die man sonst das Turnier oeffnen muesste. */
.mine__turnier-marke[b-s9wc096dx8] {
    padding: 0.05rem 0.35rem;
    border: 1px solid rgba(232, 181, 63, 0.45);
    background: rgba(232, 181, 63, 0.1);
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}
/* /Components/Pages/Patches/PatchNoteBoard.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Interne Patchnotes
   ------------------------------------------------------------------ */

.patch[b-9bd979flzo] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.patch__header[b-9bd979flzo] {
    display: flex;
    margin-bottom: 1.2rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.patch__eyebrow[b-9bd979flzo] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.patch h1[b-9bd979flzo] {
    margin: 0.2rem 0 0.4rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.patch__lead[b-9bd979flzo] {
    margin: 0;
    max-width: 42rem;
    color: rgba(217, 212, 200, 0.72);
}

.patch__muted[b-9bd979flzo] {
    color: rgba(217, 212, 200, 0.5);
}

.patch__note[b-9bd979flzo] {
    margin: 0 0 1rem;
    padding: 0.55rem 0.8rem;
    border-left: 3px solid #e8b53f;
    background: rgba(232, 181, 63, 0.08);
    color: #ffe08a;
}

.patch__note.is-bad[b-9bd979flzo] {
    border-left-color: #d9534f;
    background: rgba(217, 83, 79, 0.1);
    color: #ff9b8a;
}

/* ------------------------------------------------------------------
   Das Formular
   ------------------------------------------------------------------ */

.patch__form[b-9bd979flzo] {
    margin-bottom: 1.6rem;
    padding: 1rem 1.1rem 1.2rem;
    border: 1px solid rgba(232, 181, 63, 0.3);
    background: rgba(232, 181, 63, 0.04);
}

.patch__form h2[b-9bd979flzo] {
    margin: 0 0 0.9rem;
    color: #fcf7ea;
    font-size: 1.1rem;
}

.patch__fields[b-9bd979flzo] {
    display: flex;
    gap: 0.9rem;
    flex-wrap: wrap;
}

.patch__field[b-9bd979flzo] {
    min-width: 0;
}

.patch__field--small[b-9bd979flzo] {
    flex: 0 1 12rem;
}

.patch__field--wide[b-9bd979flzo] {
    flex: 1 1 100%;
}

.patch__label[b-9bd979flzo] {
    display: block;
    margin-bottom: 0.3rem;
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

/* Schreibmaschinenschrift im Textfeld: die Striche der Aufzaehlung
   stehen dann untereinander, und man sieht beim Tippen, was spaeter
   eine Liste wird. */
.patch__area[b-9bd979flzo] {
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.88rem;
    line-height: 1.5;
}

.patch__hint[b-9bd979flzo] {
    margin: 0.35rem 0 0;
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.8rem;
}

.patch__hint code[b-9bd979flzo] {
    color: #efc763;
}

.patch__check[b-9bd979flzo] {
    display: flex;
    gap: 0.5rem;
    align-items: baseline;
    color: rgba(217, 212, 200, 0.8);
    cursor: pointer;
}

.patch__formkeys[b-9bd979flzo] {
    display: flex;
    margin-top: 1rem;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* ------------------------------------------------------------------
   Tasten - zwei Fasen, keine Rundung, wie ueberall
   ------------------------------------------------------------------ */

.patch__key[b-9bd979flzo] {
    padding: 0.45rem 1rem;
    border-width: 2px;
    border-style: solid;
    border-color:
        rgba(232, 181, 63, 0.6) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.6);
    border-radius: 0;
    background: linear-gradient(180deg, #2a2616 0%, #16140c 100%);
    color: #e8d9a8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}

.patch__key:hover:not(:disabled)[b-9bd979flzo],
.patch__key:focus-visible:not(:disabled)[b-9bd979flzo] {
    background: linear-gradient(180deg, #3a3318 0%, #211c0e 100%);
    color: #fff3c4;
}

.patch__key:disabled[b-9bd979flzo] {
    opacity: 0.5;
    cursor: default;
}

.patch__key--go[b-9bd979flzo] {
    background: linear-gradient(180deg, #4a3b12 0%, #2c2208 100%);
    color: #ffe08a;
}

.patch__key--stop[b-9bd979flzo] {
    border-color:
        rgba(217, 83, 79, 0.7) rgba(110, 40, 38, 0.9)
        rgba(110, 40, 38, 0.9) rgba(217, 83, 79, 0.7);
    background: linear-gradient(180deg, #3a1a18 0%, #22100f 100%);
    color: #ffb3a7;
}

/* ------------------------------------------------------------------
   Die Eintraege
   ------------------------------------------------------------------ */

.patch__list[b-9bd979flzo] {
    display: flex;
    gap: 1rem;
    flex-direction: column;
}

.patch__entry[b-9bd979flzo] {
    padding: 0.9rem 1rem 1rem;
    border: 1px solid rgba(232, 181, 63, 0.2);
    background: rgba(12, 11, 9, 0.6);
}

/* Ungelesen faellt auf, aber nur am Rand: der Zaehler im Pult hat die
   Nachricht schon ueberbracht. */
.patch__entry.is-new[b-9bd979flzo] {
    border-left: 3px solid #7cc46b;
}

.patch__entry.is-draft[b-9bd979flzo] {
    border-style: dashed;
    border-color: rgba(217, 212, 200, 0.25);
}

.patch__entryhead[b-9bd979flzo] {
    display: flex;
    margin-bottom: 0.7rem;
    padding-bottom: 0.6rem;
    gap: 0.9rem;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(232, 181, 63, 0.14);
}

.patch__stamp[b-9bd979flzo] {
    flex: 0 0 auto;
    min-width: 6rem;
}

.patch__version[b-9bd979flzo] {
    display: block;
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.patch__date[b-9bd979flzo] {
    display: block;
    color: rgba(217, 212, 200, 0.5);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
}

.patch__entrytitle[b-9bd979flzo] {
    min-width: 0;
    flex: 1 1 16rem;
}

.patch__entrytitle h2[b-9bd979flzo] {
    margin: 0;
    color: #fcf7ea;
    font-size: 1.12rem;
}

.patch__marks[b-9bd979flzo] {
    display: flex;
    margin-top: 0.3rem;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.patch__new[b-9bd979flzo] {
    padding: 0.1rem 0.45rem;
    border: 1px solid rgba(124, 196, 107, 0.55);
    background: rgba(124, 196, 107, 0.12);
    color: #9fd98f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.patch__draft[b-9bd979flzo] {
    padding: 0.1rem 0.45rem;
    border: 1px dashed rgba(217, 212, 200, 0.4);
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.patch__entrykeys[b-9bd979flzo] {
    display: flex;
    flex: 0 0 auto;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.patch__body[b-9bd979flzo] {
    color: rgba(217, 212, 200, 0.85);
    line-height: 1.6;
}

/* Zeilenumbrueche des Textfelds bleiben stehen, ohne dass im Markup
   ein <br> je Zeile steht. */
.patch__para[b-9bd979flzo] {
    margin: 0 0 0.7rem;
    white-space: pre-line;
}

.patch__points[b-9bd979flzo] {
    margin: 0 0 0.7rem;
    padding-left: 1.2rem;
}

.patch__points li[b-9bd979flzo] {
    margin-bottom: 0.2rem;
}

.patch__points li[b-9bd979flzo]::marker {
    color: rgba(232, 181, 63, 0.7);
}

.patch__foot[b-9bd979flzo] {
    margin-top: 0.6rem;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(232, 181, 63, 0.1);
    color: rgba(217, 212, 200, 0.45);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
}

@media (max-width: 575.98px) {
    .patch__entryhead[b-9bd979flzo] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Pages/Public/PublicHome.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Öffentliche Startseite. Gleiche Bildsprache wie der Rest: dunkler
   Grund, goldene Akzente, Monospace für Marke und Überschriften.
   ------------------------------------------------------------------ */

.public-home[b-7gg6h7ib92] {
    max-width: 72rem;
    margin: 0 auto;
}

.public-home__header[b-7gg6h7ib92] {
    margin-bottom: 2.2rem;
}

.public-home__eyebrow[b-7gg6h7ib92] {
    display: block;
    margin-bottom: 0.35rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.public-home__header h1[b-7gg6h7ib92] {
    margin: 0 0 0.6rem;
    color: #fcf8ed;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: clamp(1.6rem, 3.4vw, 2.3rem);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-shadow:
        0 2px 8px rgba(0, 0, 0, 1),
        0 0 12px rgba(232, 181, 63, 0.28);
}

.public-home__lead[b-7gg6h7ib92] {
    max-width: 44rem;
    margin: 0;
    color: rgba(217, 212, 200, 0.86);
    font-size: 1.02rem;
    line-height: 1.6;
}

/* ---- Kachelraster ----

   Liga 1 als Kopf ueber der vollen Breite, 2 bis 5 als Zweierraster
   darunter. Fuenf gleich grosse Kacheln gingen in keinem Raster auf -
   eine haengt immer allein in der letzten Reihe. */

/* ---- Die zwei Bretter der Startseite ----

   Turniere und Ligatabellen stehen nebeneinander, beide gleich breit.
   Untereinander war die Startseite eine lange Rolle; nebeneinander
   sieht man beides auf einen Blick.

   Die Kachelbreite steht an einer Stelle, damit die Spalten sie sich
   teilen - eine breitere Turnierkachel neben einer schmaleren
   Ligakachel saehe nach Versehen aus.

   --brett-hoehe ist die Hoehe, ab der eine Spalte rollt. Sie entspricht
   ungefaehr fuenf Kacheln. Sind es bei dir vier oder sechs, ist es
   dieser eine Wert - sonst nichts. */
.start-bretter[b-7gg6h7ib92] {
    --kachel-breite: 17rem;
    --brett-luecke: 0.9rem;
    --brett-hoehe: 46rem;

    display: grid;
    gap: 1.4rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}

/* Nebeneinander braucht Platz. Darunter stehen die Bretter wieder
   untereinander, und dann darf die Spalte auch so hoch sein, wie sie
   mag: auf dem Telefon rollt ohnehin die ganze Seite. */
@media (max-width: 64rem) {
    .start-bretter[b-7gg6h7ib92] {
        grid-template-columns: minmax(0, 1fr);
    }

    .start-bretter .brett-rolle[b-7gg6h7ib92] {
        max-height: none;
        overflow: visible;
    }
}

/* Die rollende Spalte. Beide Bretter benutzen dieselbe Regel.

   padding-right haelt die Rollleiste von den Kacheln weg; ohne das
   sitzt sie auf dem Rahmen der Kachel und sieht aus, als gehoere sie
   dazu. */
.start-bretter .brett-rolle[b-7gg6h7ib92] {
    display: flex;
    max-height: var(--brett-hoehe);
    padding-right: 0.35rem;
    flex-direction: column;
    gap: var(--brett-luecke);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(232, 181, 63, 0.35) transparent;
}

.start-bretter .brett-rolle[b-7gg6h7ib92]::-webkit-scrollbar {
    width: 0.4rem;
}

.start-bretter .brett-rolle[b-7gg6h7ib92]::-webkit-scrollbar-thumb {
    border-radius: 0.2rem;
    background: rgba(232, 181, 63, 0.35);
}

.liga-board[b-7gg6h7ib92] {
    display: grid;
    gap: 1.1rem;
    align-content: start;
}

/* Die Ligaspalte hat genau fuenf Kacheln und rollt deshalb nie - sie
   traegt .brett-rolle trotzdem, damit beide Spalten dieselbe Breite
   und denselben Abstand haben. Waeren es eines Tages mehr Ligen, rollt
   sie von selbst. */
.liga-spalte[b-7gg6h7ib92] {
    align-items: flex-start;
}

/* Dieselbe Breite wie eine Turnierkachel - die Zahl steht in
   .start-bretter, damit sie nicht an zwei Orten gepflegt wird. */
.liga-tile[b-7gg6h7ib92] {
    display: block;
    width: 100%;
    max-width: var(--kachel-breite, 17rem);
    padding: 0;
    border: 1px solid rgba(232, 181, 63, 0.18);
    border-radius: 0.6rem;
    background: transparent;
    cursor: pointer;
    overflow: hidden;
    transition:
        transform 140ms ease,
        border-color 140ms ease,
        box-shadow 140ms ease;
}

.liga-tile img[b-7gg6h7ib92] {
    display: block;
    width: 100%;
    height: auto;
}

.liga-tile:hover[b-7gg6h7ib92],
.liga-tile:focus-visible[b-7gg6h7ib92] {
    transform: translateY(-2px);
    border-color: rgba(232, 181, 63, 0.55);
    box-shadow:
        0 10px 26px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(232, 181, 63, 0.16);
    outline: none;
}

.liga-tile:active[b-7gg6h7ib92] {
    transform: translateY(0);
}

/* Wer die Bewegung nicht möchte, bekommt sie nicht. */
@media (prefers-reduced-motion: reduce) {
    .liga-tile[b-7gg6h7ib92] {
        transition: none;
    }

    .liga-tile:hover[b-7gg6h7ib92],
    .liga-tile:focus-visible[b-7gg6h7ib92] {
        transform: none;
    }
}

/* ---- Tafel mit der Tabelle ---- */

.liga-modal[b-7gg6h7ib92] {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: flex;
    padding: clamp(0.75rem, 3vw, 2.5rem);
    align-items: center;
    justify-content: center;
    background: rgba(4, 5, 6, 0.82);
    backdrop-filter: blur(2px);
}

.liga-modal__panel[b-7gg6h7ib92] {
    display: flex;
    width: min(70rem, 100%);
    max-height: 100%;
    flex-direction: column;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-radius: 0.6rem;
    background: #0c0d0f;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.7);
    overflow: hidden;
}

.liga-modal__head[b-7gg6h7ib92] {
    display: flex;
    padding: 0.85rem 1.1rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.22);
    background:
        linear-gradient(
            180deg,
            rgba(28, 21, 4, 0.75),
            rgba(12, 13, 15, 0.9)
        );
}

.liga-modal__eyebrow[b-7gg6h7ib92] {
    display: block;
    margin-bottom: 0.1rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.16em;
}

.liga-modal__head strong[b-7gg6h7ib92] {
    color: #f7f2e4;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.02rem;
    letter-spacing: 0.05em;
}

.liga-modal__close[b-7gg6h7ib92] {
    display: inline-flex;
    width: 2.1rem;
    height: 2.1rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(232, 181, 63, 0.3);
    border-radius: 0.35rem;
    background: rgba(0, 0, 0, 0.35);
    color: #f3d079;
    cursor: pointer;
    font-size: 0.95rem;
    line-height: 1;
}

.liga-modal__close:hover[b-7gg6h7ib92],
.liga-modal__close:focus-visible[b-7gg6h7ib92] {
    border-color: rgba(232, 181, 63, 0.6);
    background: rgba(232, 181, 63, 0.12);
    color: #ffe6a8;
    outline: none;
}

.liga-modal__frame[b-7gg6h7ib92] {
    width: 100%;
    /* Hoch genug für eine Tabelle mit gut zwanzig Zeilen, aber nie
       höher als das Fenster - sonst rutscht die Kopfzeile der Tafel
       aus dem Bild. */
    height: min(70vh, 44rem);
    border: 0;
    background: #0c0d0f;
}

.liga-modal__foot[b-7gg6h7ib92] {
    padding: 0.5rem 1.1rem 0.6rem;
    border-top: 1px solid rgba(232, 181, 63, 0.14);
    color: rgba(217, 212, 200, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
}

@media (max-width: 640px) {
    .liga-modal__frame[b-7gg6h7ib92] {
        height: 72vh;
    }
}


/* ---- Kanäle ----

   Die Markenfarben tragen die Unterscheidung, solange die offiziellen
   Icons fehlen. Kommt ein Icon dazu, passt es links neben den
   Schriftzug - der Knopf ist als Zeile aus zwei Teilen gebaut und
   verträgt einen dritten. */

.social[b-7gg6h7ib92] {
    margin-top: 2.6rem;
    padding-top: 1.8rem;
    border-top: 1px solid rgba(232, 181, 63, 0.16);
}

.social__title[b-7gg6h7ib92] {
    margin: 0 0 1rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.social__row[b-7gg6h7ib92] {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.social-btn[b-7gg6h7ib92] {
    display: grid;
    padding: 0.85rem 1rem 0.8rem 1.15rem;
    align-content: center;
    gap: 0.15rem;
    border: 1px solid rgba(232, 181, 63, 0.16);
    /* Der farbige Streifen links ist die eigentliche Kennzeichnung. */
    border-left: 3px solid var(--kanal, #e8b53f);
    border-radius: 0.45rem;
    background: rgba(20, 21, 24, 0.72);
    color: #f2ede0;
    text-decoration: none;
    transition:
        transform 140ms ease,
        border-color 140ms ease,
        background 140ms ease;
}

.social-btn:hover[b-7gg6h7ib92],
.social-btn:focus-visible[b-7gg6h7ib92] {
    transform: translateY(-2px);
    border-color: rgba(232, 181, 63, 0.4);
    border-left-color: var(--kanal, #e8b53f);
    background: rgba(32, 34, 38, 0.85);
    color: #ffffff;
    text-decoration: none;
    outline: none;
}

.social-btn:active[b-7gg6h7ib92] {
    transform: translateY(0);
}

.social-btn__name[b-7gg6h7ib92] {
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.86rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.social-btn__hint[b-7gg6h7ib92] {
    color: rgba(217, 212, 200, 0.6);
    font-size: 0.74rem;
    letter-spacing: 0.02em;
    overflow-wrap: anywhere;
}

.social-btn--twitch[b-7gg6h7ib92]   { --kanal: #9146ff; }
.social-btn--youtube[b-7gg6h7ib92]  { --kanal: #ff0033; }
.social-btn--tiktok[b-7gg6h7ib92]   { --kanal: #25f4ee; }
.social-btn--discord[b-7gg6h7ib92]  { --kanal: #5865f2; }

@media (prefers-reduced-motion: reduce) {
    .social-btn[b-7gg6h7ib92] {
        transition: none;
    }

    .social-btn:hover[b-7gg6h7ib92],
    .social-btn:focus-visible[b-7gg6h7ib92] {
        transform: none;
    }
}

/* ---- Streamabend ----
   Ein Balken, keine Kachel: der Streamplan ist Text und konkurriert
   sonst optisch mit den Ligabildern, die er nicht schlagen kann. */
.stream-teaser[b-7gg6h7ib92] {
    display: flex;
    margin-bottom: 1.5rem;
    padding: 1.1rem 1.35rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    border: 1px solid rgba(232, 181, 63, 0.32);
    border-radius: 0.5rem;
    background: rgba(232, 181, 63, 0.07);
}

.stream-teaser__eyebrow[b-7gg6h7ib92] {
    display: block;
    margin-bottom: 0.15rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.stream-teaser__body[b-7gg6h7ib92] {
    min-width: 0;
}

.stream-teaser__title[b-7gg6h7ib92] {
    display: block;
    font-size: 1.05rem;
}

/* Der Tag des Abends. Steht unter dem Titel und nicht daneben: der
   Titel kann lang sein, das Datum soll nicht wandern. */
.stream-teaser__day[b-7gg6h7ib92] {
    margin: 0.1rem 0 0.5rem;
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.78rem;
    letter-spacing: 0.06em;
}

/* Die ersten Programmpunkte. Zwei Spalten, damit die Uhrzeiten
   untereinander stehen - eine Liste, in der die Zeit mal hier und mal
   dort anfaengt, liest sich nicht. */
.stream-teaser__list[b-7gg6h7ib92] {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.1rem 0.7rem;
    grid-template-columns: auto minmax(0, 1fr);
    list-style: none;
}

.stream-teaser__list li[b-7gg6h7ib92] {
    display: contents;
}

.stream-teaser__time[b-7gg6h7ib92] {
    color: rgba(232, 181, 63, 0.85);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.8rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.stream-teaser__pair[b-7gg6h7ib92] {
    overflow: hidden;
    color: rgba(217, 212, 200, 0.85);
    font-size: 0.88rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stream-teaser__more[b-7gg6h7ib92] {
    margin: 0.35rem 0 0;
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.8rem;
}

.stream-teaser__text[b-7gg6h7ib92] {
    max-width: 38rem;
    margin: 0.25rem 0 0;
    color: rgba(217, 212, 200, 0.72);
    font-size: 0.88rem;
    line-height: 1.5;
}

.stream-teaser__link[b-7gg6h7ib92] {
    padding: 0.55rem 1.1rem;
    border: 1px solid rgba(232, 181, 63, 0.55);
    border-radius: 0.35rem;
    background: rgba(232, 181, 63, 0.12);
    color: #e8b53f;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.stream-teaser__link:hover[b-7gg6h7ib92] {
    border-color: #e8b53f;
    background: rgba(232, 181, 63, 0.22);
}

/* ------------------------------------------------------------------
   Turniere auf der Startseite
   ------------------------------------------------------------------ */

.tourney-board[b-7gg6h7ib92] {
    margin-bottom: 1.5rem;
}

.tourney-board__head[b-7gg6h7ib92] {
    display: flex;
    margin-bottom: 0.75rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.tourney-board__eyebrow[b-7gg6h7ib92] {
    display: block;
    margin-bottom: 0.15rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.tourney-board__title[b-7gg6h7ib92] {
    display: block;
    font-size: 1.05rem;
}

/* Kein Raster mit gedehnten Spalten: bei drei Turnieren wuerde jede
   Kachel ein Drittel der Seite breit, und ein Banner, das nicht genau
   16:9 ist, saesse dann in einer riesigen schwarzen Flaeche. Die
   Kacheln haben deshalb eine feste Wunschbreite und stehen links
   nebeneinander. */
/* Stand frueher als umbrechende Reihe da. Seit die Turniere eine
   eigene Spalte haben, stapeln sie untereinander - die Regeln dafuer
   stehen in .brett-rolle, hier bleibt nur, was die Kachel selbst
   betrifft. */
.tourney-grid[b-7gg6h7ib92] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    align-items: flex-start;
}

.tourney-tile[b-7gg6h7ib92] {
    display: flex;
    width: 100%;
    max-width: var(--kachel-breite, 17rem);
    flex: 0 0 auto;
    overflow: hidden;
    flex-direction: column;
    border: 1px solid rgba(232, 181, 63, 0.32);
    border-radius: 0.5rem;
    background: rgba(20, 18, 15, 0.55);
    color: inherit;
    text-decoration: none;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.tourney-tile:hover[b-7gg6h7ib92],
.tourney-tile:focus-visible[b-7gg6h7ib92] {
    border-color: #e8b53f;
    background: rgba(232, 181, 63, 0.1);
}

/* Eingepasst, nicht beschnitten - aber ohne festen Rahmen: der Kasten
   ist so hoch wie das Bild, nicht 16:9 mit schwarzen Balken drumherum.
   Gedeckelt wird nur nach oben, damit ein hochkantes Banner die Kachel
   nicht in die Laenge zieht. Der Untergrund ist der der Kachel; nur wo
   wirklich Bild fehlt, bleibt Flaeche. */
.tourney-tile__thumb[b-7gg6h7ib92] {
    display: flex;
    width: 100%;
    justify-content: center;
    border-bottom: 1px solid rgba(232, 181, 63, 0.2);
}

/* Das Bild gibt die Hoehe vor, nicht umgekehrt. Jede vorgegebene
   Hoehe - ob 16:9 oder ein fester Wert - erzeugt bei jedem anderen
   Format Balken; nimmt der Kasten dagegen genau die Hoehe des Bildes
   an, gibt es ueber und unter dem Banner nichts mehr zu sehen. Ein
   breites Banner macht die Kachel damit von selbst flach.

   Gedeckelt wird nur der Ausreisser nach oben: ein hochkantes Bild
   duerfte die Kachel sonst in die Laenge ziehen. */
.tourney-tile__thumb img[b-7gg6h7ib92] {
    display: block;
    width: 100%;
    height: auto;
    max-height: 12rem;
    object-fit: contain;
}

/* Ohne Bild traegt der Kasten den Namen. Er braucht dann eine eigene
   Hoehe, sonst faellt die Kachel neben einer bebilderten zusammen. */
.tourney-tile__thumb--leer[b-7gg6h7ib92] {
    display: grid;
    min-height: 4.5rem;
    padding: 0.5rem;
    place-items: center;
    background: rgba(11, 10, 8, 0.55);
}

.tourney-tile__hint[b-7gg6h7ib92] {
    color: rgba(232, 181, 63, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-align: center;
}

.tourney-tile__body[b-7gg6h7ib92] {
    display: flex;
    padding: 0.75rem 0.85rem 0.85rem;
    flex-direction: column;
    gap: 0.35rem;
}

.tourney-tile__name[b-7gg6h7ib92] {
    color: #fcf7ea;
    font-size: 0.98rem;
    line-height: 1.3;
    /* Kein Trennstrich mitten im Wort: "Zero Ho-ur" liest sich wie ein
       Fehler. Umbrochen wird an Leerzeichen, und nur ein Wort, das
       laenger ist als die Kachel, wird hart getrennt. */
    hyphens: manual;
    overflow-wrap: break-word;
}

.tourney-tile__meta[b-7gg6h7ib92] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
    color: rgba(217, 212, 200, 0.66);
    font-size: 0.78rem;
}

.tourney-tile__status[b-7gg6h7ib92] {
    padding: 0.05rem 0.4rem;
    border: 1px solid rgba(232, 181, 63, 0.4);
    border-radius: 0.25rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.tourney-tile__winner[b-7gg6h7ib92] {
    color: rgba(217, 212, 200, 0.8);
    font-size: 0.82rem;
}

/* Auf schmalen Schirmen darf die Kachel die Breite nehmen, die da ist -
   13rem neben einem leeren Streifen saehe aus wie ein Fehler. */
@media (max-width: 575.98px) {
    .tourney-tile[b-7gg6h7ib92] {
        flex: 1 1 100%;
        max-width: none;
    }

    .tourney-tile__thumb img[b-7gg6h7ib92] {
        max-height: 14rem;
    }
}
/* /Components/Pages/Public/StreamPlanPublic.razor.rz.scp.css */
.plan[b-2bej65px2i] {
    max-width: 60rem;
    margin: 0 auto;
    padding: 1.5rem 1rem 3rem;
}

.plan__page-head[b-2bej65px2i] {
    margin-bottom: 1.5rem;
}

.plan__eyebrow[b-2bej65px2i] {
    display: block;
    margin-bottom: 0.25rem;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.plan__page-head h1[b-2bej65px2i] {
    margin: 0;
}

.plan__lead[b-2bej65px2i] {
    max-width: 40rem;
    margin: 0.5rem 0 0;
    color: rgba(217, 212, 200, 0.72);
    font-size: 0.92rem;
    line-height: 1.55;
}

.plan__none[b-2bej65px2i] {
    max-width: 36rem;
    color: rgba(217, 212, 200, 0.55);
    line-height: 1.6;
}

.plan__board[b-2bej65px2i] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.plan__entry[b-2bej65px2i] {
    border: 1px solid rgba(232, 181, 63, 0.28);
    border-radius: 0.5rem;
    background: rgba(20, 18, 15, 0.55);
    overflow: hidden;
}

/* Gelaufene Abende bleiben stehen, treten aber zurück. */
.plan__entry--past[b-2bej65px2i] {
    border-color: rgba(217, 212, 200, 0.16);
}

.plan__entry--past .plan__summary-day[b-2bej65px2i] {
    color: rgba(217, 212, 200, 0.55);
}

.plan__summary[b-2bej65px2i] {
    display: flex;
    padding: 0.9rem 1.1rem;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.3rem 0.9rem;
    cursor: pointer;
    list-style: none;
}

/* Das Standarddreieck ist in Safari ein eigenes Pseudoelement. */
.plan__summary[b-2bej65px2i]::-webkit-details-marker {
    display: none;
}

.plan__summary[b-2bej65px2i]::before {
    content: "▸";
    color: rgba(232, 181, 63, 0.8);
    font-size: 0.8rem;
}

.plan__entry[open] > .plan__summary[b-2bej65px2i]::before {
    content: "▾";
}

.plan__summary:hover[b-2bej65px2i] {
    background: rgba(232, 181, 63, 0.06);
}

.plan__summary-day[b-2bej65px2i] {
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.82rem;
    font-weight: 700;
    white-space: nowrap;
}

.plan__summary-title[b-2bej65px2i] {
    flex: 1 1 14rem;
    font-weight: 700;
}

.plan__summary-count[b-2bej65px2i] {
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.74rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.plan__sheet[b-2bej65px2i] {
    padding: 0.25rem 1.35rem 1.35rem;
    border-top: 1px solid rgba(217, 212, 200, 0.12);
}

.plan__intro[b-2bej65px2i] {
    margin: 1rem 0 0.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(217, 212, 200, 0.14);
}

.plan__intro p[b-2bej65px2i],
.plan__foot p[b-2bej65px2i] {
    margin: 0 0 0.3rem;
    color: rgba(217, 212, 200, 0.78);
    font-size: 0.92rem;
    line-height: 1.55;
}

.plan__blocks[b-2bej65px2i] {
    margin: 1.25rem 0;
    padding: 0;
    list-style: none;
}

.plan__item[b-2bej65px2i] {
    margin-bottom: 1.4rem;
}

/* Noch nicht vergebene Zeiten stehen mit da - der Abend hat ja Platz -
   treten aber deutlich zurück. */
.plan__item--free[b-2bej65px2i] {
    opacity: 0.45;
}

/* Beschriftung und Wert nebeneinander wie im Discord-Beitrag: die
   Beschriftung ist schmal und fest, der Wert füllt den Rest. */
.plan__block[b-2bej65px2i] {
    display: grid;
    margin: 0;
    gap: 0.1rem 0.6rem;
    grid-template-columns: 5.5rem 1fr;
}

.plan__block dt[b-2bej65px2i] {
    color: rgba(217, 212, 200, 0.6);
    font-weight: 400;
}

.plan__block dd[b-2bej65px2i] {
    margin: 0;
    font-weight: 700;
}

.plan__foot[b-2bej65px2i] {
    padding-top: 1rem;
    border-top: 1px solid rgba(217, 212, 200, 0.14);
}

@media (max-width: 34rem) {
    .plan__sheet[b-2bej65px2i] {
        padding: 0.25rem 1rem 1rem;
    }

    /* Auf dem Telefon kostet die feste Spalte zu viel Breite. */
    .plan__block[b-2bej65px2i] {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .plan__block dt[b-2bej65px2i] {
        margin-top: 0.25rem;
        font-size: 0.75rem;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }
}

/* ---- Das Banner des Abends ----
   Feste 16:9-Flaeche, damit der Plan beim Laden nicht springt. Die
   Bilder sind ohnehin 16:9 - die Angabe haelt nur den Platz frei,
   bevor das Bild da ist. */
.plan__banner[b-2bej65px2i] {
    display: block;

    /* Siebzig Prozent der Blattbreite, mittig.
       Ueber die volle Breite war das Banner das Lauteste auf der Seite;
       auf halber Breite war es zu brav. Dreissig Prozent weniger lassen
       es Aufmacher bleiben, ohne den Plan darunter zu erschlagen.
       Prozent und nicht rem: es soll mit dem Blatt mitgehen, denn es
       steht jetzt in dessen Mitte und nicht mehr an seiner Kante. */
    width: 70%;
    max-width: 100%;
    margin: 0 auto 1rem;
    aspect-ratio: 16 / 9;
    border: 1px solid rgba(232, 181, 63, 0.28);
    background: #0b0a08;
    object-fit: cover;
}

/* Auf dem Telefon nimmt es die volle Breite: dort sind siebzig Prozent
   kein Gewinn mehr, sondern nur ein kleineres Bild. */
@media (max-width: 575.98px) {
    .plan__banner[b-2bej65px2i] {
        width: 100%;
    }
}
/* /Components/Pages/Statutes/StatuteBoard.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Statuten
   ------------------------------------------------------------------ */

.statutes[b-4nim105vix] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.statutes__header[b-4nim105vix] {
    display: flex;
    margin-bottom: 1.2rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.statutes__eyebrow[b-4nim105vix] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.statutes h1[b-4nim105vix] {
    margin: 0.2rem 0 0.4rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.statutes__lead[b-4nim105vix] {
    margin: 0;
    max-width: 44rem;
    color: rgba(217, 212, 200, 0.72);
}

.statutes__muted[b-4nim105vix] {
    color: rgba(217, 212, 200, 0.55);
}

.statutes__note-box[b-4nim105vix] {
    padding: 0.6rem 0.8rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(232, 181, 63, 0.08);
    color: #efc763;
}

.statutes__note-box.is-bad[b-4nim105vix] {
    border-color: rgba(214, 90, 70, 0.5);
    background: rgba(214, 90, 70, 0.1);
    color: #ffb9a8;
}

/* ---- Tasten ---- */
.statutes__key[b-4nim105vix] {
    padding: 0.36rem 0.8rem 0.32rem;
    border-width: 2px;
    border-style: solid;
    border-color: #423b30 #0a0907 #0a0907 #423b30;
    border-radius: 0;
    background: linear-gradient(180deg, #2c2820 0%, #1e1b16 100%);
    color: #d9d4c8;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
}

.statutes__key:hover:not(:disabled)[b-4nim105vix],
.statutes__key:focus-visible:not(:disabled)[b-4nim105vix] {
    border-color: #4d4536 #0a0907 #0a0907 #4d4536;
    background: linear-gradient(180deg, #37312a 0%, #24201a 100%);
    color: #fcf8ed;
    text-decoration: none;
}

.statutes__key:disabled[b-4nim105vix] {
    opacity: 0.5;
    cursor: default;
}

.statutes__key--go[b-4nim105vix] {
    border-color:
        rgba(232, 181, 63, 0.75) rgba(120, 88, 24, 0.9)
        rgba(120, 88, 24, 0.9) rgba(232, 181, 63, 0.75);
    background: linear-gradient(180deg, #4a3b12 0%, #2c2208 100%);
    color: #ffe08a;
}

.statutes__key--stop[b-4nim105vix] {
    border-color:
        rgba(214, 90, 70, 0.7) rgba(90, 30, 22, 0.9)
        rgba(90, 30, 22, 0.9) rgba(214, 90, 70, 0.7);
    background: linear-gradient(180deg, #4a1c14 0%, #2c110c 100%);
    color: #ffb9a8;
}

/* ---- Das Formular ---- */
.statutes__form[b-4nim105vix] {
    margin-bottom: 1.2rem;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    background: rgba(28, 25, 20, 0.7);
}

.statutes__form h2[b-4nim105vix] {
    margin: 0 0 0.7rem;
    color: #fcf7ea;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.86rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.statutes__fields[b-4nim105vix] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.statutes__field[b-4nim105vix] {
    min-width: 0;
    flex: 1 1 16rem;
}

.statutes__field--wide[b-4nim105vix] {
    flex: 2 1 24rem;
}

.statutes__label[b-4nim105vix] {
    display: block;
    margin-bottom: 0.25rem;
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.statutes__hint[b-4nim105vix] {
    margin-top: 0.25rem;
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.78rem;
}

.statutes__formkeys[b-4nim105vix] {
    display: flex;
    margin-top: 0.8rem;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* ---- Die geltende Fassung ---- */
.statutes__empty[b-4nim105vix] {
    padding: 1rem;
    border: 1px dashed rgba(232, 181, 63, 0.3);
    background: rgba(20, 18, 15, 0.5);
}

.statutes__current[b-4nim105vix] {
    margin-bottom: 1.4rem;
}

.statutes__meta[b-4nim105vix] {
    display: flex;
    margin-bottom: 0.7rem;
    padding: 0.8rem 0.95rem;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    border: 1px solid rgba(232, 181, 63, 0.3);
    background: rgba(20, 18, 15, 0.6);
}

.statutes__title[b-4nim105vix] {
    display: block;
    color: #fcf7ea;
    font-size: 1.05rem;
}

.statutes__since[b-4nim105vix] {
    display: block;
    margin-top: 0.15rem;
    color: rgba(217, 212, 200, 0.6);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
}

.statutes__note[b-4nim105vix] {
    margin: 0.4rem 0 0;
    max-width: 46rem;
    color: rgba(217, 212, 200, 0.85);
}

.statutes__metakeys[b-4nim105vix] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* Der Betrachter. Feste Hoehe in Bildschirmmass: ein PDF hat keine, an
   der sich ein Rahmen ausrichten koennte, und ein Prozentwert faellt
   ohne feste Elternhoehe in sich zusammen. */
.statutes__frame[b-4nim105vix] {
    height: 78vh;
    min-height: 24rem;
    border: 1px solid rgba(232, 181, 63, 0.25);
    background: #0b0a08;
}

.statutes__frame object[b-4nim105vix] {
    display: block;
    width: 100%;
    height: 100%;
}

/* ---- Frühere Fassungen ---- */
.statutes__history h2[b-4nim105vix] {
    margin: 0 0 0.5rem;
    color: rgba(232, 181, 63, 0.8);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.statutes__list[b-4nim105vix] {
    margin: 0 0 1rem;
    padding: 0;
    list-style: none;
}

.statutes__list > li[b-4nim105vix] {
    display: flex;
    padding: 0.5rem 0;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(232, 181, 63, 0.1);
}

.statutes__link[b-4nim105vix] {
    color: #ffe08a;
    font-weight: 700;
    text-decoration: none;
}

.statutes__link:hover[b-4nim105vix],
.statutes__link:focus-visible[b-4nim105vix] {
    text-decoration: underline;
}

@media (max-width: 575.98px) {
    .statutes__frame[b-4nim105vix] {
        height: 60vh;
    }
}
/* /Components/Pages/Streamer/StreamRoulette.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Das Roulette im Streamerbereich: links drehen, rechts die Raeder
   verwalten.

   Die Farben sind dieselben wie in den uebrigen Masken - Sandton auf
   Stahlgrund, Gold als Marke. Das Overlay dagegen hat sein eigenes
   Stilblatt unter wwwroot/roulette/: es laeuft in OBS, nicht in der
   Anwendung, und teilt sich mit dieser keine Datei.
   ------------------------------------------------------------------ */

.roulette[b-gmzvuuxhl1] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.roulette__head[b-gmzvuuxhl1] {
    margin-bottom: 1.4rem;
}

.roulette__eyebrow[b-gmzvuuxhl1] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.roulette h1[b-gmzvuuxhl1] {
    margin: 0.2rem 0 0.4rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.roulette__lead[b-gmzvuuxhl1] {
    margin: 0;
    max-width: 46rem;
    color: rgba(217, 212, 200, 0.72);
}

/* Die OBS-Adresse steht ueber allem anderen und in voller Breite:
   sie wird einmal gebraucht, und dann soll man sie nicht suchen. */
.roulette__quelle[b-gmzvuuxhl1] {
    margin-bottom: 1.4rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(232, 181, 63, 0.18);
    border-radius: 0.5rem;
    background: rgba(18, 22, 26, 0.55);
}

.roulette__quelle-zeile[b-gmzvuuxhl1] {
    display: flex;
    gap: 0.5rem;
}

.roulette__quelle input[b-gmzvuuxhl1] {
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.85rem;
}

/* Zwei Spalten, solange Platz ist. Darunter untereinander - auf einem
   Notebook neben dem Streamrechner ist die Breite knapp. */
.roulette__spalten[b-gmzvuuxhl1] {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

@media (max-width: 1100px) {
    .roulette__spalten[b-gmzvuuxhl1] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.roulette__karte[b-gmzvuuxhl1] {
    padding: 1.1rem 1.2rem 1.3rem;
    border: 1px solid rgba(232, 181, 63, 0.14);
    border-radius: 0.6rem;
    background: rgba(14, 18, 22, 0.6);
}

.roulette__gruppe[b-gmzvuuxhl1] {
    margin: 0 0 0.9rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.16);
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.roulette__gruppe--klein[b-gmzvuuxhl1] {
    margin-top: 1.6rem;
}

.roulette__feld[b-gmzvuuxhl1] {
    margin-bottom: 0.9rem;
}

.roulette__zahlfeld[b-gmzvuuxhl1] {
    max-width: 8rem;
}

/* Die Vorschau bekommt eine feste Hoehe mit eigener Laufleiste: sonst
   schiebt ein Rad mit sechzig Feldern die Drehtaste aus dem Bild -
   und die ist das, worauf es hier ankommt. */
.roulette__vorschau[b-gmzvuuxhl1] {
    margin-bottom: 1rem;
    padding: 0.7rem 0.85rem;
    max-height: 16rem;
    border: 1px solid rgba(232, 181, 63, 0.12);
    border-radius: 0.45rem;
    background: rgba(8, 11, 14, 0.5);
    overflow-y: auto;
}

.roulette__zahl[b-gmzvuuxhl1] {
    margin: 0 0 0.5rem;
    color: rgba(217, 212, 200, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.roulette__felder[b-gmzvuuxhl1] {
    display: flex;
    margin: 0;
    padding: 0;
    gap: 0.35rem;
    flex-wrap: wrap;
    list-style: none;
}

.roulette__felder li[b-gmzvuuxhl1] {
    padding: 0.18rem 0.5rem;
    border: 1px solid rgba(232, 181, 63, 0.16);
    border-radius: 0.3rem;
    background: rgba(232, 181, 63, 0.05);
    font-size: 0.82rem;
}

/* Der Schalter sitzt zwischen Vorschau und Drehtaste: man liest ihn
   auf dem Weg zum Knopf, nicht irgendwo darunter.

   Der Rahmen ist ein eigenes Element um das form-check herum. Setzt
   man das padding auf dasselbe Element, ersetzt es Bootstraps
   padding-left: 2.5em - und die Checkbox, die sich mit
   margin-left: -2.5em genau diesen Platz zurueckholt, haengt dann
   links aus dem Kasten. */
.roulette__schalter[b-gmzvuuxhl1] {
    margin-bottom: 1rem;
    padding: 0.6rem 0.9rem;
    border: 1px solid rgba(232, 181, 63, 0.16);
    border-radius: 0.45rem;
    background: rgba(232, 181, 63, 0.04);
}

.roulette__schalter .form-check[b-gmzvuuxhl1] {
    margin-bottom: 0;
}

.roulette__schalter .form-check-label[b-gmzvuuxhl1] {
    font-weight: 600;
    cursor: pointer;
}

/* Der Hilfstext steht ausserhalb des form-check und faengt deshalb am
   Kastenrand an - kein Gegeneinzug noetig. */
.roulette__schaltertext[b-gmzvuuxhl1] {
    margin-top: 0.15rem;
}

.roulette__knoepfe[b-gmzvuuxhl1] {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    flex-wrap: wrap;
}

/* Der Verlauf der Runde. Nummeriert, weil die Reihenfolge im Stream
   oft die Frage ist - erste Map, zweite Map. */
.roulette__verlauf[b-gmzvuuxhl1] {
    margin-top: 1rem;
    padding: 0.7rem 0.85rem;
    max-height: 12rem;
    border: 1px solid rgba(232, 181, 63, 0.12);
    border-radius: 0.45rem;
    background: rgba(8, 11, 14, 0.5);
    overflow-y: auto;
}

.roulette__verlaufsliste[b-gmzvuuxhl1] {
    margin: 0;
    padding-left: 1.4rem;
    color: rgba(217, 212, 200, 0.75);
    font-size: 0.88rem;
}

.roulette__verlaufsliste li[b-gmzvuuxhl1] {
    padding: 0.1rem 0;
}

.roulette__knoepfe--eng[b-gmzvuuxhl1] {
    margin-bottom: 0.6rem;
    gap: 0.4rem;
}

/* Die Kartenauswahl bekommt eine feste Hoehe mit eigener Laufleiste.
   Eine Bibliothekskategorie kann vierzig Karten haben; ohne Deckel
   schoebe die Liste den Speichern-Knopf aus dem Bild. */
.roulette__auswahl[b-gmzvuuxhl1] {
    display: grid;
    padding: 0.5rem 0.7rem;
    max-height: 15rem;
    gap: 0.15rem 0.8rem;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    border: 1px solid rgba(232, 181, 63, 0.12);
    border-radius: 0.45rem;
    background: rgba(8, 11, 14, 0.5);
    overflow-y: auto;
}

.roulette__auswahlzeile[b-gmzvuuxhl1] {
    display: flex;
    padding: 0.15rem 0;
    gap: 0.45rem;
    align-items: center;
    font-size: 0.87rem;
    cursor: pointer;
}

.roulette__auswahlzeile:hover[b-gmzvuuxhl1] {
    color: #fcf7ea;
}

.roulette__auswahlzeile input[b-gmzvuuxhl1] {
    flex: 0 0 auto;
    margin: 0;
}

.roulette__hinweis[b-gmzvuuxhl1] {
    margin: 0.7rem 0 0;
    color: rgba(217, 212, 200, 0.55);
    font-size: 0.85rem;
}

.roulette__leer[b-gmzvuuxhl1] {
    margin: 0;
    color: rgba(217, 212, 200, 0.5);
    font-size: 0.88rem;
}

/* Das Ergebnis steht auch hier, nicht nur im Overlay: wer dreht,
   schaut auf diese Maske und nicht auf das Bild, das er sendet. */
.roulette__ergebnis[b-gmzvuuxhl1] {
    display: flex;
    margin-top: 1rem;
    padding: 0.7rem 0.9rem;
    gap: 0.7rem;
    border: 1px solid rgba(232, 181, 63, 0.35);
    border-radius: 0.45rem;
    background: rgba(232, 181, 63, 0.08);
    align-items: baseline;
}

.roulette__ergebnis-marke[b-gmzvuuxhl1] {
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.roulette__ergebnis strong[b-gmzvuuxhl1] {
    color: #fcf7ea;
    font-size: 1.15rem;
}

.roulette__liste[b-gmzvuuxhl1] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.roulette__listenzeile[b-gmzvuuxhl1] {
    display: flex;
    padding: 0.45rem 0;
    gap: 0.6rem;
    align-items: center;
    border-bottom: 1px solid rgba(232, 181, 63, 0.08);
}

/* Der Name ist eine Taste, sieht aber aus wie ein Verweis: er oeffnet
   das Rad zum Bearbeiten. Ein <button> und kein <a>, weil nichts
   navigiert wird - ein Verweis, der die Seite nicht wechselt, ist
   fuer die Tastaturbedienung eine Falle. */
.roulette__listenname[b-gmzvuuxhl1] {
    padding: 0;
    border: 0;
    background: none;
    color: #e8b53f;
    font-weight: 600;
    text-align: left;
    flex: 1 1 auto;
}

.roulette__listenname:hover[b-gmzvuuxhl1] {
    color: #fcf7ea;
    text-decoration: underline;
}

.roulette__listenquelle[b-gmzvuuxhl1] {
    color: rgba(217, 212, 200, 0.5);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
/* /Components/Pages/Tournaments/TournamentBoard.razor.rz.scp.css */
.tournaments[b-f1doj3o8ga] {
    display: grid;
    gap: 1rem;
}

.tournaments__header[b-f1doj3o8ga] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
}

.tournaments__eyebrow[b-f1doj3o8ga] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.tournaments__header h1[b-f1doj3o8ga] {
    margin: 0.15rem 0 0;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.tournaments__grid[b-f1doj3o8ga] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
}

/* Die Karte klemmt die Miniatur ab: ohne overflow steht das Bild
   quadratisch in der abgerundeten Ecke. */
.tournaments__card[b-f1doj3o8ga] {
    overflow: hidden;
}

.tournaments__card-head[b-f1doj3o8ga] {
    display: flex;
    margin-bottom: 0.5rem;
    gap: 0.6rem;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
}

.tournaments__card-head h2[b-f1doj3o8ga] {
    margin: 0;
    color: #fcf7ea;
    font-size: 1.05rem;
}

.tournaments__state[b-f1doj3o8ga] {
    display: inline-block;
    padding: 0.1rem 0.55rem;
    border: 1px solid rgba(232, 181, 63, 0.34);
    border-radius: 999px;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.tournaments__state.is-open[b-f1doj3o8ga] { color: #8ce09a; border-color: rgba(140, 224, 154, 0.4); }
.tournaments__state.is-draw[b-f1doj3o8ga] { color: #efc763; }
.tournaments__state.is-running[b-f1doj3o8ga] { color: #7ec4f5; border-color: rgba(126, 196, 245, 0.4); }
.tournaments__state.is-done[b-f1doj3o8ga] { color: #9d968a; border-color: rgba(157, 150, 138, 0.4); }

.tournaments__meta[b-f1doj3o8ga],
.tournaments__counts[b-f1doj3o8ga] {
    display: flex;
    margin-bottom: 0.5rem;
    gap: 0.7rem;
    flex-wrap: wrap;
    align-items: center;
    color: #9d968a;
    font-size: 0.78rem;
}

.tournaments__counts .is-pending[b-f1doj3o8ga] {
    color: #efc763;
    font-weight: 700;
}

.tournaments__description[b-f1doj3o8ga] {
    margin: 0.4rem 0 0.8rem;
    color: #cbbfa6;
    font-size: 0.88rem;
    white-space: pre-wrap;
}

.tournaments__winner[b-f1doj3o8ga] {
    margin: 0.4rem 0 0.8rem;
    color: #f7e7bb;
}

.tournaments__actions[b-f1doj3o8ga] {
    display: flex;
    margin-top: 0.6rem;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.tournaments__admin[b-f1doj3o8ga] {
    padding-top: 0.7rem;
    border-top: 1px solid rgba(232, 181, 63, 0.2);
}

.tournaments__confirm[b-f1doj3o8ga] {
    color: #f0a3a3;
    font-size: 0.85rem;
}

.tournaments__empty[b-f1doj3o8ga] {
    margin: 0;
    color: #9d968a;
    font-size: 0.86rem;
}

.tournaments__table[b-f1doj3o8ga] {
    color: #e6ddcc;
    font-size: 0.85rem;
}

.tournaments__table th[b-f1doj3o8ga] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.tournaments__table tr.is-active td[b-f1doj3o8ga] { color: #f7e7bb; }
.tournaments__table tr.is-reserve td[b-f1doj3o8ga] { color: #cbbfa6; }
.tournaments__table tr.is-pending td[b-f1doj3o8ga] { color: #9d968a; }

.tournaments__row-actions[b-f1doj3o8ga] {
    display: flex;
    gap: 0.35rem;
    flex-wrap: wrap;
}

/* ---- Glücksrad ---- */

.wheel-card__hint[b-f1doj3o8ga] {
    max-width: 46rem;
    margin-bottom: 1rem;
    color: #cbbfa6;
    font-size: 0.86rem;
}

.wheel-card__layout[b-f1doj3o8ga] {
    display: grid;
    gap: 1.4rem;
    grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
    align-items: start;
}

.wheel[b-f1doj3o8ga] {
    position: relative;
    width: 100%;
    max-width: 22rem;
}

.wheel__pointer[b-f1doj3o8ga] {
    position: absolute;
    z-index: 2;
    top: -0.35rem;
    left: 50%;
    width: 0;
    height: 0;
    border-top: 1.15rem solid #efc763;
    border-right: 0.7rem solid transparent;
    border-left: 0.7rem solid transparent;
    transform: translateX(-50%);
}

.wheel__disc[b-f1doj3o8ga] {
    position: relative;
    width: 100%;
    border-radius: 50%;
    box-shadow: 0 0 26px rgba(232, 181, 63, 0.18);
    /* Dauer und Auslaufkurve stehen nicht hier, sondern kommen je
       Drehung als Inline-Angabe von der Seite - sonst laeuft das Rad
       jedes Mal gleich aus. Der Wert hier ist nur der Rueckfall, falls
       einmal keine Angabe ankommt. */
    transition: transform 4s cubic-bezier(0.16, 0.84, 0.24, 1);
}

.wheel__svg[b-f1doj3o8ga] {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 50%;
}

.wheel__name[b-f1doj3o8ga] {
    position: absolute;
    max-width: 7.5rem;
    overflow: hidden;
    color: #f7e7bb;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 700;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
    white-space: nowrap;
    pointer-events: none;
}

.wheel-card__side[b-f1doj3o8ga] {
    display: grid;
    gap: 0.7rem;
    align-content: start;
}

.wheel-card__result[b-f1doj3o8ga] {
    display: grid;
    padding: 0.7rem 0.9rem;
    gap: 0.15rem;
    border: 1px solid rgba(232, 181, 63, 0.45);
    border-radius: 0.45rem;
    background: rgba(38, 28, 6, 0.7);
}

.wheel-card__result span[b-f1doj3o8ga] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.wheel-card__result strong[b-f1doj3o8ga] {
    color: #fcf7ea;
    font-size: 1.3rem;
}

.wheel-card__count[b-f1doj3o8ga] {
    margin: 0;
    color: #cbbfa6;
    font-size: 0.85rem;
}

.wheel-card__order[b-f1doj3o8ga] {
    max-height: 16rem;
    margin: 0;
    padding-left: 0;
    overflow-y: auto;
    list-style: none;
}

.wheel-card__order li[b-f1doj3o8ga] {
    display: flex;
    padding: 0.2rem 0;
    gap: 0.5rem;
    color: #e6ddcc;
    border-bottom: 1px solid rgba(232, 181, 63, 0.12);
    font-size: 0.84rem;
}

.wheel-card__order li span[b-f1doj3o8ga] {
    min-width: 1.6rem;
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-weight: 800;
}

/* ---- Baum ---- */

.bracket__scroller[b-f1doj3o8ga] {
    overflow-x: auto;
    padding-bottom: 0.5rem;
}

.bracket__rounds[b-f1doj3o8ga] {
    display: flex;
    min-width: min-content;
    gap: 1.2rem;
    align-items: stretch;
}

.bracket__round[b-f1doj3o8ga] {
    display: flex;
    min-width: 12.5rem;
    gap: 0.6rem;
    flex-direction: column;
    justify-content: space-around;
}

.bracket__round-title[b-f1doj3o8ga] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    text-align: center;
}

.bracket__match[b-f1doj3o8ga] {
    display: grid;
    overflow: hidden;
    gap: 1px;
    border: 1px solid rgba(232, 181, 63, 0.24);
    border-radius: 0.35rem;
    background: rgba(232, 181, 63, 0.16);
}

.bracket__match.is-decided[b-f1doj3o8ga] {
    border-color: rgba(232, 181, 63, 0.4);
}

.bracket__slot[b-f1doj3o8ga] {
    display: flex;
    padding: 0.4rem 0.55rem;
    gap: 0.4rem;
    align-items: center;
    justify-content: space-between;
    color: #cbbfa6;
    border: none;
    background: rgba(14, 11, 3, 0.94);
    font-size: 0.84rem;
    text-align: left;
}

.bracket__slot.is-clickable[b-f1doj3o8ga] {
    cursor: pointer;
}

.bracket__slot.is-clickable:hover[b-f1doj3o8ga] {
    color: #fcf7ea;
    background: rgba(46, 35, 6, 0.95);
}

.bracket__slot.is-winner[b-f1doj3o8ga] {
    color: #f7e7bb;
    background: rgba(52, 40, 7, 0.95);
    font-weight: 700;
}

.bracket__slot.is-loser[b-f1doj3o8ga] {
    color: #7d766a;
    text-decoration: line-through;
}

.bracket__slot.is-empty[b-f1doj3o8ga] {
    color: #6f695e;
    font-style: italic;
}

.bracket__name[b-f1doj3o8ga] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bracket__tag[b-f1doj3o8ga] {
    color: #efc763;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.bracket__reopen[b-f1doj3o8ga] {
    padding: 0.2rem 0.5rem;
    color: #9d968a;
    border: none;
    background: rgba(14, 11, 3, 0.94);
    font-size: 0.66rem;
    text-align: center;
    cursor: pointer;
}

.bracket__reopen:hover[b-f1doj3o8ga] {
    color: #f0a3a3;
}

@media (max-width: 900px) {
    .wheel-card__layout[b-f1doj3o8ga] {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ---- Banner ----
   Ein breiter Streifen über dem Turnier. Ohne Bild bleibt der Platz
   stehen und trägt den Turniernamen: der Kopf soll nicht springen,
   sobald jemand ein Bild hochlädt, und eine leere Fläche ohne
   Erklärung sieht nach Fehler aus. */
.tournaments__banner[b-f1doj3o8ga] {
    display: flex;
    height: clamp(6rem, 18vw, 13rem);
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(239, 199, 99, 0.28);
    border-radius: 0.5rem;
    background: #14120f;
}

.tournaments__banner img[b-f1doj3o8ga] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Der Platzhalter: diagonale Streifen in Kupfer, wie eine
   Absperrung - offensichtlich vorläufig, nicht kaputt. */
.tournaments__banner--empty[b-f1doj3o8ga] {
    background-image:
        repeating-linear-gradient(
            -45deg,
            rgba(239, 199, 99, 0.09) 0,
            rgba(239, 199, 99, 0.09) 0.75rem,
            transparent 0.75rem,
            transparent 1.5rem);
}

/* ---- Miniatur in der Uebersicht ----
   Das ganze Banner, nur klein. Keine feste Hoehe und kein Schnitt:
   das Bild bekommt die Kartenbreite und behaelt sein Seitenverhaeltnis
   (`height: auto`), es wird also verkleinert statt beschnitten. Die
   Obergrenze fangt nur den Ausreisser ab - ein Banner im Hochformat
   wuerde die Karte sonst in die Laenge ziehen. */
.tournaments__thumb[b-f1doj3o8ga] {
    display: flex;
    height: auto;
    max-height: 11rem;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-bottom: 1px solid rgba(239, 199, 99, 0.24);
    border-radius: 0.4rem 0.4rem 0 0;
    background: #14120f;
}

.tournaments__thumb img[b-f1doj3o8ga] {
    display: block;
    width: 100%;
    height: auto;
    max-height: 11rem;
    object-fit: contain;
}

.tournaments__thumb--empty[b-f1doj3o8ga] {
    /* Ohne Bild traegt die Flaeche nur den Schriftzug und faellt
       sonst auf null zusammen. */
    min-height: 3.2rem;
    background-image:
        repeating-linear-gradient(
            -45deg,
            rgba(239, 199, 99, 0.07) 0,
            rgba(239, 199, 99, 0.07) 0.55rem,
            transparent 0.55rem,
            transparent 1.1rem);
}

.tournaments__thumb-hint[b-f1doj3o8ga] {
    padding: 0 0.75rem;
    overflow: hidden;
    color: rgba(239, 199, 99, 0.5);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-align: center;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tournaments__banner-hint[b-f1doj3o8ga] {
    padding: 0 1rem;
    color: rgba(239, 199, 99, 0.55);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: clamp(0.9rem, 2.4vw, 1.5rem);
    font-weight: 800;
    letter-spacing: 0.14em;
    text-align: center;
    text-transform: uppercase;
}

/* Der Satz, der bei einem Gast an der Stelle des Anmeldeknopfs steht.
   Bewusst als Text und nicht als abgeblendeter Knopf: ein Knopf, den
   man nicht druecken kann, ist eine Einladung ins Leere. */
.tournaments__guest[b-f1doj3o8ga] {
    margin: 0.75rem 0 0;
    color: rgba(217, 212, 200, 0.7);
    font-size: 0.9rem;
}
/* /Components/Shared/AchievementBadge.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Das Abzeichen
   ------------------------------------------------------------------
   Die Zahl liegt als HTML über der Platte im SVG. Deshalb ist der
   Rahmen relativ positioniert und trägt eine feste Grösse: das SVG
   skaliert mit, die Zahl folgt ihm über Prozentwerte.

   Grösse steuert der Aufrufer über --ach-badge-size. Voreinstellung
   ist die Übersichtsseite; auf der Spielerkarte steht sie kleiner.
   ------------------------------------------------------------------ */

.ach-badge[b-vryk8677ig] {
    position: relative;
    display: inline-block;
    width: var(--ach-badge-size, 3.4rem);
    aspect-ratio: 64 / 76;
    flex: 0 0 auto;
    line-height: 0;
}

.ach-badge__svg[b-vryk8677ig] {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}

/* Verdient: ein leichter Schein, damit das Metall lebt. Offen: matt
   und entsättigt - lesbar, aber erkennbar noch nicht erreicht. Der
   Unterschied liegt bewusst nicht nur in der Farbe. */
.ach-badge.is-owned .ach-badge__svg[b-vryk8677ig] {
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.55));
}

.ach-badge.is-open .ach-badge__svg[b-vryk8677ig] {
    filter: saturate(0.18) brightness(0.72);
    opacity: 0.75;
}

.ach-badge.is-open .ach-badge__zahl[b-vryk8677ig] {
    filter: saturate(0.18) brightness(0.72);
    opacity: 0.75;
}

/* Die Zahl sitzt auf der Platte am Fuss.
   Der Wert ist gerechnet, nicht geschätzt: die Platte im SVG geht von
   y 60 bis y 73 bei einer Gesamthöhe von 76. Ihre Mitte liegt also bei
   66,5 von 76 = 87,5 %. Vorher standen hier 78,9 % - die Oberkante der
   Platte statt ihrer Mitte, und die Zahl schwebte darüber. */
.ach-badge__zahl[b-vryk8677ig] {
    position: absolute;
    top: 87.5%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: calc(var(--ach-badge-size, 3.4rem) * 0.21);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    letter-spacing: 0.02em;
    pointer-events: none;
}
/* /Components/Shared/EloTicketOverview.razor.rz.scp.css */
.elo-ticket-form[b-ldzdhyepts] {
    overflow: hidden;
    border: 1px solid rgba(232, 181, 63, 0.26);
    border-radius: 0.65rem;
    background: repeating-linear-gradient(135deg, rgba(232, 181, 63, 0.018) 0, rgba(232, 181, 63, 0.018) 1px, transparent 1px, transparent 9px), rgba(2, 13, 7, 0.68);
}

.elo-ticket-form__header[b-ldzdhyepts],
.elo-ticket-form__section-title[b-ldzdhyepts] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.elo-ticket-form__header[b-ldzdhyepts] {
    padding: 0.9rem 1rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.2);
    background: linear-gradient(90deg, rgba(232, 181, 63, 0.13), rgba(214, 172, 63, 0.055), rgba(0, 0, 0, 0.14));
}

.elo-ticket-form__header h2[b-ldzdhyepts],
.elo-ticket-form__section h3[b-ldzdhyepts] {
    margin: 0;
    color: var(--vx-gray-100);
}

.elo-ticket-form__header h2[b-ldzdhyepts] { font-size: 1.02rem; }
.elo-ticket-form__section h3[b-ldzdhyepts] { margin-bottom: 0.85rem; font-size: 0.98rem; }
.elo-ticket-form__section-title h3[b-ldzdhyepts] { margin-bottom: 0; }

.elo-ticket-form__eyebrow[b-ldzdhyepts] {
    color: var(--vx-green-bright);
    font-family: var(--vx-font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.elo-ticket-form__badges[b-ldzdhyepts] { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.45rem; }
.elo-ticket-form__section[b-ldzdhyepts] { padding: 1rem; border-top: 1px solid rgba(232, 181, 63, 0.14); }
.elo-ticket-form__section:first-of-type[b-ldzdhyepts] { border-top: 0; }
.elo-ticket-form__section code[b-ldzdhyepts] { color: var(--vx-gold-bright); overflow-wrap: anywhere; }

.elo-ticket-form .form-label[b-ldzdhyepts] {
    color: var(--vx-green-soft);
    font-family: var(--vx-font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.elo-ticket-form .form-control:disabled[b-ldzdhyepts],
.elo-ticket-form .form-select:disabled[b-ldzdhyepts],
.elo-ticket-form textarea:disabled[b-ldzdhyepts] {
    color: var(--vx-gray-100);
    border-color: rgba(232, 181, 63, 0.23);
    background-color: rgba(0, 0, 0, 0.28);
    opacity: 1;
    -webkit-text-fill-color: var(--vx-gray-100);
}

.elo-ticket-form__checkbox-grid[b-ldzdhyepts] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
}

.elo-ticket-form__checkbox[b-ldzdhyepts] {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.65rem;
    min-height: 3.1rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(124, 137, 130, 0.28);
    border-radius: 0.55rem;
    background: rgba(0, 0, 0, 0.24);
    transition: border-color 140ms ease, background-color 140ms ease;
}

.elo-ticket-form__checkbox input[b-ldzdhyepts] {
    position: relative;
    inline-size: 1.1rem;
    block-size: 1.1rem;
    margin: 0;
    border: 1px solid currentColor;
    border-radius: 0.22rem;
    background: rgba(0, 0, 0, 0.36);
    appearance: none;
    opacity: 1;
}

.elo-ticket-form__checkbox input:checked[b-ldzdhyepts]::after {
    position: absolute;
    inset: 0.12rem 0.31rem 0.26rem;
    content: "";
    border-right: 0.14rem solid #ffffff;
    border-bottom: 0.14rem solid #ffffff;
    transform: rotate(45deg);
}

.elo-ticket-form__checkbox span[b-ldzdhyepts] {
    color: var(--vx-gray-100);
}

.elo-ticket-form__checkbox.is-active[b-ldzdhyepts] {
    border-color: rgba(232, 181, 63, 0.52);
    background: rgba(232, 181, 63, 0.105);
}

.elo-ticket-form__checkbox.is-active input[b-ldzdhyepts] {
    color: rgb(232, 181, 63);
    background: rgba(232, 181, 63, 0.88);
}

.elo-ticket-form__checkbox.is-active span[b-ldzdhyepts] {
    color: var(--vx-green-bright);
}

.elo-ticket-form__checkbox.is-inactive[b-ldzdhyepts] {
    border-color: rgba(218, 63, 63, 0.48);
    background: rgba(151, 25, 25, 0.12);
}

.elo-ticket-form__checkbox.is-inactive input[b-ldzdhyepts] {
    color: rgb(218, 63, 63);
    background: rgba(218, 63, 63, 0.08);
}

.elo-ticket-form__checkbox.is-inactive span[b-ldzdhyepts] {
    color: rgb(239, 151, 151);
}

.elo-ticket-form__checkbox.is-unknown[b-ldzdhyepts] {
    border-color: rgba(214, 172, 63, 0.46);
    background: rgba(214, 172, 63, 0.09);
}

.elo-ticket-form__checkbox.is-unknown input[b-ldzdhyepts] {
    color: rgb(214, 172, 63);
    background: rgba(214, 172, 63, 0.08);
}

.elo-ticket-form__checkbox.is-unknown span[b-ldzdhyepts] {
    color: var(--vx-gold-bright);
}

@media (max-width: 991.98px) {
    .elo-ticket-form__checkbox-grid[b-ldzdhyepts] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .elo-ticket-form__header[b-ldzdhyepts],
    .elo-ticket-form__section-title[b-ldzdhyepts] { align-items: stretch; flex-direction: column; }
    .elo-ticket-form__badges[b-ldzdhyepts] { justify-content: flex-start; }
    .elo-ticket-form__checkbox-grid[b-ldzdhyepts] { grid-template-columns: 1fr; }
}
/* /Components/Shared/NavBoard.razor.rz.scp.css */
/* ------------------------------------------------------------------
   Die Seite eines Bereichs: Lage oben, Kacheln darunter.

   Die Kachelstile standen bis v20 in HubBoard.razor.css. Sie sind
   hierher gewandert, weil die Isolation an der Komponente haengt: was
   dort steht, gilt nur dort, und die Bereichsseiten teilen sich jetzt
   ein Bauteil.
   ------------------------------------------------------------------ */

.hub[b-ita25vc5jh] {
    padding-bottom: 2.5rem;
    color: #d9d4c8;
}

.hub__header[b-ita25vc5jh] {
    display: flex;
    margin-bottom: 1.4rem;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
}

.hub__eyebrow[b-ita25vc5jh] {
    display: block;
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.hub h1[b-ita25vc5jh] {
    margin: 0.2rem 0 0.4rem;
    color: #fcf7ea;
    font-size: 1.5rem;
}

.hub__lead[b-ita25vc5jh] {
    margin: 0;
    max-width: 46rem;
    color: rgba(217, 212, 200, 0.72);
}

.hub__muted[b-ita25vc5jh] {
    color: rgba(217, 212, 200, 0.5);
}

.hub__abteilung + .hub__abteilung[b-ita25vc5jh] {
    margin-top: 1.6rem;
}

/* Die Abteilung ist eine Zwischenueberschrift, keine Ueberschrift der
   Seite: leise, aber eindeutig. */
.hub__gruppe[b-ita25vc5jh] {
    margin: 0 0 0.6rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid rgba(232, 181, 63, 0.16);
    color: #e8b53f;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

/* ------------------------------------------------------------------
   Die Lage

   Steht vor den Kacheln und hebt sich von ihnen ab: eine Zeile je
   Warteschlange, Zahl links, Alter klein darunter. Bewusst Zeilen und
   keine Kacheln — was offen ist, liest man von oben nach unten ab,
   nicht als Feld.
   ------------------------------------------------------------------ */

.hub__lage[b-ita25vc5jh] {
    margin-bottom: 1.8rem;
}

.hub__todo[b-ita25vc5jh] {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.4rem;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    list-style: none;
}

.hub__todo-link[b-ita25vc5jh] {
    position: relative;
    display: flex;
    gap: 0.7rem;
    padding: 0.6rem 0.8rem;
    align-items: center;
    border-width: 1px;
    border-style: solid;
    border-color:
        rgba(232, 181, 63, 0.35) rgba(120, 88, 24, 0.6)
        rgba(120, 88, 24, 0.6) rgba(232, 181, 63, 0.35);
    background: linear-gradient(180deg, rgba(30, 27, 19, 0.92) 0%, rgba(14, 13, 10, 0.92) 100%);
    color: #d9d4c8;
    text-decoration: none;
    overflow: hidden;
    transition: border-color 120ms ease, background 120ms ease;
}

.hub__todo-link:hover[b-ita25vc5jh],
.hub__todo-link:focus-visible[b-ita25vc5jh] {
    border-color: rgba(232, 181, 63, 0.8);
    background: linear-gradient(180deg, rgba(42, 37, 23, 0.95) 0%, rgba(21, 19, 13, 0.95) 100%);
    color: #fff3c4;
}

.hub__todo-link:focus-visible[b-ita25vc5jh] {
    outline: 2px solid #e8b53f;
    outline-offset: 2px;
}

/* Was laenger liegt als die Altersgrenze, faellt auf. Rot am Rand und
   an der Lampe, nicht auf der ganzen Flaeche: es soll ins Auge fallen,
   nicht die Zeile unlesbar machen. */
.hub__todo-link--old[b-ita25vc5jh] {
    border-left-width: 3px;
    border-left-color: #d1452f;
}

.hub__todo-led[b-ita25vc5jh] {
    width: 0.5rem;
    height: 0.5rem;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #6fd17a;
    box-shadow: 0 0 6px rgba(111, 209, 122, 0.7);
}

.hub__todo-link--old .hub__todo-led[b-ita25vc5jh] {
    background: #e2573f;
    box-shadow: 0 0 6px rgba(226, 87, 63, 0.75);
}

.hub__todo-count[b-ita25vc5jh] {
    min-width: 2rem;
    flex: 0 0 auto;
    color: #ffe08a;
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 1.15rem;
    font-weight: 800;
    text-align: right;
}

.hub__todo-text[b-ita25vc5jh] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    line-height: 1.2;
}

.hub__todo-age[b-ita25vc5jh] {
    color: rgba(217, 212, 200, 0.5);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.04em;
}

/* ------------------------------------------------------------------
   Die Kacheln
   ------------------------------------------------------------------ */

.hub__kacheln[b-ita25vc5jh] {
    display: grid;
    gap: 0.6rem;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
}

/* Zwei Fasen wie bei den Tasten der Anwendung, keine Rundung. */
.hub__kachel[b-ita25vc5jh] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.7rem 0.8rem;
    border-width: 1px;
    border-style: solid;
    border-color:
        rgba(232, 181, 63, 0.35) rgba(120, 88, 24, 0.6)
        rgba(120, 88, 24, 0.6) rgba(232, 181, 63, 0.35);
    background: linear-gradient(180deg, rgba(28, 25, 18, 0.9) 0%, rgba(13, 12, 9, 0.9) 100%);
    color: #d9d4c8;
    text-decoration: none;
    transition: border-color 120ms ease, background 120ms ease;
}

.hub__kachel:hover[b-ita25vc5jh],
.hub__kachel:focus-visible[b-ita25vc5jh] {
    border-color: rgba(232, 181, 63, 0.8);
    background: linear-gradient(180deg, rgba(40, 35, 22, 0.95) 0%, rgba(20, 18, 12, 0.95) 100%);
    color: #fff3c4;
}

.hub__kachel:focus-visible[b-ita25vc5jh] {
    outline: 2px solid #e8b53f;
    outline-offset: 2px;
}

/* Die meistgebrauchten fallen auf, ohne eine andere Form zu haben. */
.hub__kachel--oft[b-ita25vc5jh] {
    border-left-width: 3px;
    border-left-color: #e8b53f;
}

.hub__name[b-ita25vc5jh] {
    color: #ffe08a;
    font-weight: 600;
    line-height: 1.25;
}

.hub__kachel:hover .hub__name[b-ita25vc5jh],
.hub__kachel:focus-visible .hub__name[b-ita25vc5jh] {
    color: #fff3c4;
}

.hub__note[b-ita25vc5jh] {
    color: rgba(217, 212, 200, 0.5);
    font-family: "Cascadia Mono", "Consolas", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.04em;
}

@media (max-width: 575.98px) {
    .hub__kacheln[b-ita25vc5jh] {
        grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
    }

    .hub__todo[b-ita25vc5jh] {
        grid-template-columns: 1fr;
    }
}