.club-selection-shell { min-height: 100svh; display: grid; place-items: center; padding: 24px 16px; }
.club-selection-card { width: min(100%, 560px); margin: 0; }
.club-selection-brand { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.club-selection-list { display: grid; gap: 12px; margin-top: 20px; }
.club-selection-option { display: flex; align-items: center; gap: 16px; width: 100%; padding: 18px; border: 1px solid var(--slate-200); border-radius: 16px; background: var(--white); color: var(--navy-950); text-align: left; cursor: pointer; }
.club-selection-option:hover { border-color: var(--blue-600); background: #f5f9ff; }
.club-selection-option:focus-visible { outline: 3px solid var(--blue-600); outline-offset: 3px; }
.club-selection-monogram { display: grid; place-items: center; flex: 0 0 48px; height: 48px; border-radius: 12px; background: #edf4ff; color: var(--blue-600); font-weight: 800; }
.club-selection-label { display: grid; gap: 5px; flex: 1; min-width: 0; overflow-wrap: anywhere; }
.club-selection-label small { color: var(--slate-500); }
.club-selection-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-top: 28px; }
.club-switch-link { display: flex; flex-direction: column; gap: 3px; max-width: 250px; white-space: normal; overflow-wrap: anywhere; }
.club-switch-link span:first-child:not(:only-child) { font-size: 12px; font-weight: 500; }
.club-switch-name { max-width: 220px; font-size: 13px; color: var(--slate-500); overflow-wrap: anywhere; }

:root {
    color-scheme: light;
    --control-height: 3rem;
    --navy-950: #07162f;
    --navy-900: #0b2043;
    --navy-800: #12335f;
    --blue-600: #1769e0;
    --blue-500: #2d7df0;
    --cyan-400: #28c9db;
    --slate-700: #344054;
    --slate-500: #667085;
    --slate-300: #d0d5dd;
    --slate-200: #e4e7ec;
    --slate-100: #f2f4f7;
    --white: #ffffff;
    --success: #12b76a;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

body {
    margin: 0;
    color: var(--navy-950);
    background: #f7f9fc;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: inherit;
    text-decoration: none;
}

.wordmark {
    display: inline-flex;
    align-items: center;
    border-radius: 0.7rem;
}

.brand-logo {
    display: block;
    width: 10.75rem;
    height: auto;
}

.eyebrow {
    margin: 0;
    color: #8bd9ff;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.eyebrow--dark {
    color: var(--blue-600);
}

.auth-shell {
    display: grid;
    min-height: 100vh;
    grid-template-columns: minmax(20rem, 0.95fr) minmax(28rem, 1.05fr);
}

.auth-brand {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(2rem, 5vw, 4.75rem);
    color: var(--white);
    background:
        radial-gradient(circle at 78% 18%, rgb(40 201 219 / 22%), transparent 30%),
        linear-gradient(145deg, var(--navy-950), var(--navy-800));
}

.auth-brand__content {
    max-width: 37rem;
}

.auth-brand__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.auth-brand h1 {
    max-width: 34rem;
    margin: 1rem 0 1.25rem;
    font-size: clamp(2.5rem, 5vw, 4.8rem);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.auth-brand__content > p:last-child {
    max-width: 35rem;
    margin: 0;
    color: #d8e3f2;
    font-size: 1.06rem;
    line-height: 1.75;
}

.auth-brand__footer {
    margin: 0;
    color: #9db1ca;
    font-size: 0.82rem;
}

.auth-panel {
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 2rem;
    background: var(--white);
}

.auth-card {
    width: min(100%, 29rem);
}

.auth-card--wide {
    width: min(100%, 54rem);
}

.auth-shell--registration {
    grid-template-columns: minmax(19rem, 0.72fr) minmax(38rem, 1.28fr);
}

.auth-panel--registration {
    align-items: start;
    padding-block: clamp(2rem, 5vw, 4rem);
}

.auth-card__header h2,
.topbar h1,
.roadmap-card h2 {
    margin: 0.55rem 0 0;
    letter-spacing: -0.035em;
}

.auth-card__header h2 {
    font-size: 2rem;
}

.auth-card__header > p:last-child,
.roadmap-card p {
    color: var(--slate-500);
    line-height: 1.6;
}

.form-stack {
    display: grid;
    gap: 1.15rem;
    margin-top: 2rem;
}

.field {
    min-width: 0;
    align-content: start;
    display: grid;
    gap: 0.5rem;
    color: var(--slate-700);
    font-size: 0.88rem;
    font-weight: 650;
}

.field input,
.field textarea {
    width: 100%;
    border: 1px solid var(--slate-300);
    border-radius: 0.75rem;
    outline: none;
    padding: 0.86rem 0.95rem;
    color: var(--navy-950);
    background: var(--white);
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.field textarea {
    min-height: 7rem;
    resize: vertical;
}

.field small {
    color: var(--slate-500);
    font-size: 0.74rem;
    font-weight: 500;
    line-height: 1.45;
}

.field select {
    width: 100%;
    border: 1px solid var(--slate-300);
    border-radius: 0.75rem;
    outline: none;
    padding: 0.86rem 2.4rem 0.86rem 0.95rem;
    color: var(--navy-950);
    background: var(--white);
}

.field input:focus,
.field textarea:focus {
    border-color: var(--blue-500);
    box-shadow: 0 0 0 4px rgb(45 125 240 / 13%);
}

.field input[type="file"] {
    padding: 0.65rem;
}

.field select:focus {
    border-color: var(--blue-500);
    box-shadow: 0 0 0 4px rgb(45 125 240 / 13%);
}

.checkbox {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--slate-500);
    font-size: 0.84rem;
}

.checkbox input {
    width: 1rem;
    height: 1rem;
    accent-color: var(--blue-600);
}

.form-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.text-link {
    color: var(--blue-600);
    font-size: 0.84rem;
    font-weight: 700;
}

.text-link:hover {
    text-decoration: underline;
}

.button {
    display: inline-flex;
    min-height: var(--control-height);
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0.75rem;
    padding: 0.7rem 1rem;
    cursor: pointer;
    font-weight: 750;
}

.button--primary {
    color: var(--white);
    background: linear-gradient(135deg, var(--blue-600), var(--blue-500));
    box-shadow: 0 0.6rem 1.5rem rgb(23 105 224 / 20%);
}

.button--secondary {
    border: 1px solid var(--slate-200);
    color: var(--slate-700);
    background: var(--white);
}

.button--danger {
    border: 1px solid #fecdca;
    color: #b42318;
    background: #fff5f4;
}

.button--ghost {
    color: var(--slate-500);
    background: transparent;
}

.button--ghost:hover {
    color: var(--navy-950);
    background: var(--slate-100);
}

.button--small {
    min-height: 2.2rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.78rem;
}

.button--disabled {
    cursor: default;
    opacity: 0.45;
}

.button--full {
    width: 100%;
}

.language-switcher {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    border: 1px solid var(--slate-200);
    border-radius: 99rem;
    padding: 0.2rem;
    background: var(--white);
}

.language-switcher form {
    display: contents;
}

.language-switcher__item {
    border: 0;
    border-radius: 99rem;
    padding: 0.38rem 0.55rem;
    color: var(--slate-500);
    background: transparent;
    cursor: pointer;
    font-size: 0.67rem;
    font-weight: 800;
}

.language-switcher__item--active {
    color: var(--white);
    background: var(--blue-600);
}

.language-switcher--dark {
    border-color: rgb(255 255 255 / 22%);
    background: rgb(255 255 255 / 8%);
}

.language-switcher--dark .language-switcher__item {
    color: #c9d6e6;
}

.language-switcher--dark .language-switcher__item--active {
    color: var(--navy-950);
    background: var(--white);
}

.language-switcher--sidebar {
    margin-top: auto;
}

.verification-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.5rem;
}

.registration-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2rem;
}

.registration-heading h2 {
    margin: 0.55rem 0 0;
    font-size: 2rem;
    letter-spacing: -0.035em;
}

.registration-heading p:last-child {
    max-width: 38rem;
    color: var(--slate-500);
    line-height: 1.6;
}

.registration-form {
    display: grid;
    gap: 1.5rem;
    margin-top: 2rem;
}

.registration-section {
    display: grid;
    gap: 1.4rem;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: clamp(1.2rem, 3vw, 2rem);
    background: #fbfcfe;
}

.registration-section__header {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
}

.registration-section__header > span {
    display: grid;
    flex: 0 0 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 50%;
    color: var(--white);
    background: var(--blue-600);
    font-size: 0.8rem;
    font-weight: 800;
}

.registration-section__header h2,
.registration-section__header h3 {
    margin: 0;
    font-size: 1rem;
}

.registration-section__header p {
    margin: 0.35rem 0 0;
    color: var(--slate-500);
    font-size: 0.8rem;
    line-height: 1.5;
}

.field--wide {
    grid-column: 1 / -1;
}

.inline-note {
    margin: 0;
    border-left: 3px solid var(--cyan-400);
    padding-left: 0.9rem;
    color: var(--slate-500);
    font-size: 0.8rem;
    line-height: 1.55;
}

.registration-submit {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

.registration-submit p {
    max-width: 38rem;
    margin: 0;
    color: var(--slate-500);
    font-size: 0.8rem;
    line-height: 1.55;
}

.auth-alternative,
.registration-cta {
    color: var(--slate-500);
    font-size: 0.84rem;
}

.auth-alternative {
    margin: 1.5rem 0 0;
    text-align: center;
}

.registration-cta {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.5rem;
    border-top: 1px solid var(--slate-200);
    padding-top: 1.25rem;
}

.form-error {
    border: 1px solid #fecaca;
    border-radius: 0.75rem;
    padding: 0.8rem 0.9rem;
    color: #991b1b;
    background: #fff1f2;
    font-size: 0.85rem;
}

.form-error ul {
    margin: 0.5rem 0 0;
    padding-left: 1.1rem;
}

.form-success {
    border: 1px solid #a7f3d0;
    border-radius: 0.75rem;
    padding: 0.8rem 0.9rem;
    color: #065f46;
    background: #ecfdf5;
    font-size: 0.85rem;
    line-height: 1.5;
}

.security-note {
    margin: 1.4rem 0 0;
    color: var(--slate-500);
    font-size: 0.78rem;
    line-height: 1.6;
}

.app-shell {
    display: grid;
    min-height: 100vh;
    grid-template-columns: 17rem minmax(0, 1fr);
}

.sidebar {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    gap: 2rem;
    padding: 1.6rem;
    background: var(--navy-950);
}

.role-badge {
    width: fit-content;
    border: 1px solid rgb(40 201 219 / 24%);
    border-radius: 99rem;
    padding: 0.35rem 0.65rem;
    color: #8bd9ff;
    background: rgb(40 201 219 / 8%);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.nav-list {
    display: grid;
    gap: 0.45rem;
}

.nav-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    border-radius: 0.7rem;
    padding: 0.75rem 0.9rem;
    color: #aebed2;
    font-size: 0.9rem;
    font-weight: 650;
}

.workspace-icon {
    display: block;
    width: 1.3rem;
    height: 1.3rem;
    flex: 0 0 auto;
}

.nav-icon {
    width: 20px;
    height: 20px;
}

.nav-item > span:not(.nav-badge) {
    flex: 1;
    min-width: 0;
}

.nav-item > .nav-badge {
    flex: 0 0 auto;
    margin-left: auto;
}

.nav-item--active {
    color: var(--white);
    background: linear-gradient(90deg, rgb(45 125 240 / 28%), rgb(45 125 240 / 8%));
}

.workspace-sidebar .nav-item:hover,
.workspace-sidebar .nav-item:focus-visible {
    color: var(--white);
    background-color: rgb(255 255 255 / 8%);
}

.club-settings-link {
    margin-top: 0.75rem;
    border-top: 1px solid rgb(255 255 255 / 12%);
}

.club-settings-navigation {
    display: grid;
    min-width: 0;
    gap: 1rem;
}

.club-back-link {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 0.5rem;
    color: var(--blue-600);
    font-size: 0.88rem;
    font-weight: 700;
}

.club-section-tabs {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    gap: 0.4rem;
    border-bottom: 1px solid var(--slate-200);
    padding-bottom: 0.75rem;
}

.club-section-tabs > a {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 0.6rem;
    padding: 0.65rem 0.85rem;
    color: var(--slate-500);
    font-size: 0.88rem;
    font-weight: 700;
}

.club-section-tabs > a:hover,
.club-section-tabs > a[aria-current="page"] {
    color: var(--navy-950);
    background: #e8eef7;
}

.club-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.club-settings-card,
.club-settings-profile {
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
}

.club-settings-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
    color: var(--navy-950);
    transition: border-color 150ms, box-shadow 150ms;
}

.club-settings-card:hover {
    border-color: var(--blue-600);
    box-shadow: 0 4px 18px rgb(20 45 80 / 7%);
}

.club-settings-card h2,
.club-settings-profile h2 {
    margin: 0 0 0.45rem;
    font-size: 1rem;
}

.club-settings-card p,
.club-settings-profile p {
    margin: 0;
    color: var(--slate-500);
    font-size: 0.88rem;
    line-height: 1.6;
}

.club-settings-card__arrow {
    color: var(--blue-600);
    font-size: 1.4rem;
}

.club-settings-profile {
    display: grid;
    gap: 1.25rem;
    padding: 1.5rem;
}

.club-settings-profile__identity {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.club-settings-logo,
.club-settings-profile__identity .club-monogram {
    width: 3.5rem;
    height: 3.5rem;
    flex: 0 0 auto;
    font-size: 1.2rem;
}

.club-settings-logo {
    border-radius: 0.6rem;
    object-fit: contain;
}

.club-settings-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 0;
}

.club-settings-details dt {
    margin-bottom: 0.3rem;
    color: var(--slate-500);
    font-size: 0.8rem;
}

.club-settings-details dd {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 0.9rem;
}

.club-settings-profile > .button {
    width: fit-content;
}

.share-link-card.club-settings-share {
    grid-template-columns: minmax(0, 1fr);
}

.club-settings-share .button {
    width: fit-content;
}

.workspace-sidebar a:focus-visible,
.club-section-tabs a:focus-visible,
.club-settings-card:focus-visible,
.club-back-link:focus-visible {
    outline: 3px solid var(--blue-600);
    outline-offset: 3px;
}

@media (max-width: 900px) {
    .workspace-sidebar .nav-list {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        overflow: visible;
    }

    .workspace-sidebar .nav-item {
        min-width: 0;
        padding: 0.65rem;
        overflow-wrap: anywhere;
    }

    .club-settings-link {
        margin-top: 0;
        border-top: 0;
    }
}

@media (max-width: 620px) {
    .workspace-sidebar .nav-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .club-settings-grid,
    .club-settings-details {
        grid-template-columns: 1fr;
    }
}

.nav-item--disabled {
    opacity: 0.55;
}

.nav-badge {
    display: inline-grid;
    min-width: 1.45rem;
    height: 1.45rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 99rem;
    padding: 0 0.38rem;
    color: var(--white);
    background: #e5484d;
    font-size: 0.7rem;
    font-weight: 850;
    line-height: 1;
}

.dashboard {
    min-width: 0;
}

.topbar {
    display: flex;
    flex-wrap: wrap;
    min-height: 6.6rem;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    border-bottom: 1px solid var(--slate-200);
    padding: 1.4rem clamp(1.5rem, 4vw, 3.5rem);
    background: var(--white);
}

.topbar h1 {
    font-size: 1.55rem;
}

.workspace-heading {
    display: flex;
    align-items: center;
    gap: .85rem;
    flex: 1 1 16rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.workspace-heading__icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 14px;
    background: #efedff;
    color: #5146ed;
}

.workspace-heading__icon .workspace-icon {
    width: 23px;
    height: 23px;
}

.workspace-heading h1 {
    min-width: 0;
    margin: 0;
}

.workspace-heading .eyebrow {
    margin: 0 0 0.45rem;
}

.user-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.2rem;
    max-width: 100%;
    margin-left: auto;
}

.user-menu__identity {
    min-width: 0;
    max-width: 15rem;
    overflow-wrap: anywhere;
}

.user-menu > div {
    display: grid;
    gap: 0.15rem;
    text-align: right;
    font-size: 0.84rem;
}

.user-menu span {
    color: var(--slate-500);
    font-size: 0.74rem;
}

.workspace-switcher {
    display: grid;
    gap: 0.2rem;
}

.workspace-switcher label {
    color: var(--slate-500);
    font-size: 0.68rem;
    font-weight: 700;
}

.workspace-switcher select {
    min-height: 2.35rem;
    max-width: 12rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.7rem;
    padding: 0.45rem 2rem 0.45rem 0.65rem;
    color: var(--navy-950);
    background: var(--white);
    font-size: 0.78rem;
    font-weight: 700;
}

.button-group {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.dashboard-content {
    display: grid;
    gap: 1.5rem;
    padding: clamp(1.5rem, 4vw, 3.5rem);
}

.page-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

.page-intro {
    margin: 0;
    color: var(--slate-500);
    line-height: 1.6;
}

.filter-bar {
    display: grid;
    align-items: end;
    gap: 1rem;
    grid-template-columns: minmax(16rem, 1fr) minmax(10rem, 0.3fr) auto;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: 1.2rem;
    background: var(--white);
}

.table-card,
.form-card {
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.table-scroll {
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
}

.data-table th,
.data-table td {
    border-bottom: 1px solid var(--slate-200);
    padding: 1rem 1.15rem;
    vertical-align: middle;
}

.data-table th {
    color: var(--slate-500);
    background: #fafbfc;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.data-table tbody tr:last-child td {
    border-bottom: 0;
}

.data-table td {
    font-size: 0.86rem;
}

.data-table td > strong,
.data-table td > small {
    display: block;
}

.data-table td > small {
    margin-top: 0.25rem;
    color: var(--slate-500);
}

.table-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.4rem;
}

.club-administrators {
    display: grid;
    gap: 0.75rem;
    overflow-wrap: anywhere;
}

.club-administrators__account {
    display: grid;
    justify-items: start;
    gap: 0.25rem;
    font-size: 0.88rem;
}

.club-administrators__email {
    color: var(--slate-500);
    user-select: all;
}

.form-card > .club-administrators {
    margin-top: 1rem;
}

.tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.tag,
.status-badge {
    display: inline-flex;
    border-radius: 99rem;
    padding: 0.32rem 0.55rem;
    font-size: 0.7rem;
    font-weight: 750;
}

.tag {
    color: var(--navy-800);
    background: #eef5ff;
}

.status-badge {
    white-space: nowrap;
    flex-shrink: 0;
    color: #067647;
    background: #ecfdf3;
}

.status-badge--inactive {
    color: #b42318;
    background: #fef3f2;
}

.status-badge--pending {
    color: #92400e;
    background: #fffbeb;
}

.status-badge--invited {
    color: #175cd3;
    background: #eff8ff;
}

.status-badge--suspended {
    color: #475467;
    background: #f2f4f7;
}

.status-badge--trial {
    color: #175cd3;
    background: #eff8ff;
}

.status-badge--paused {
    color: #92400e;
    background: #fffaeb;
}

.status-badge--ended {
    color: #475467;
    background: #f2f4f7;
}

.muted {
    color: var(--slate-500);
}

.empty-state {
    padding: 4rem 1.5rem;
    text-align: center;
}

.empty-state h2 {
    margin: 0;
    font-size: 1.25rem;
}

.empty-state p {
    margin: 0.6rem 0 0;
    color: var(--slate-500);
}

.pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-top: 1px solid var(--slate-200);
    padding: 1rem 1.15rem;
    color: var(--slate-500);
    font-size: 0.8rem;
}

.form-card {
    padding: clamp(1.4rem, 4vw, 2.5rem);
}

.form-card__header {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--slate-200);
}

.form-card__header h2 {
    margin: 0.55rem 0 0;
    font-size: 1.55rem;
    letter-spacing: -0.035em;
}

.form-card__header p:last-child {
    margin: 0.6rem 0 0;
    color: var(--slate-500);
    line-height: 1.6;
}

.registration-review {
    display: grid;
    gap: 1.4rem;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: clamp(1.4rem, 4vw, 2rem);
    background: var(--white);
}

.registration-review__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.registration-review__heading h2 {
    margin: 0.45rem 0 0;
    font-size: 1.25rem;
}

.registration-review__heading img {
    width: 4.5rem;
    height: 4.5rem;
    object-fit: contain;
}

.review-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
}

.review-grid > div {
    border-top: 1px solid var(--slate-200);
    padding-top: 0.9rem;
}

.review-grid dt {
    color: var(--slate-500);
    font-size: 0.72rem;
    font-weight: 750;
    text-transform: uppercase;
}

.review-grid dd {
    margin: 0.35rem 0 0;
    font-size: 0.88rem;
    line-height: 1.55;
}

.review-grid__wide {
    grid-column: 1 / -1;
}

.form-grid {
    display: grid;
    align-items: start;
    gap: 1.15rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.event-datetime-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 7.5rem;
    gap: 0.65rem;
}

.event-datetime-fields .time-input {
    font-variant-numeric: tabular-nums;
}

.member-form-section {
    display: grid;
    gap: 1.15rem;
    border-top: 1px solid var(--slate-200);
    padding-top: 1.5rem;
}

.member-form-section:first-of-type {
    border-top: 0;
    padding-top: 0;
}

.member-form-section__header h3 {
    margin: 0;
    font-size: 1rem;
}

.member-form-section__header p {
    margin: 0.35rem 0 0;
    color: var(--slate-500);
    font-size: 0.8rem;
    line-height: 1.55;
}

.schedule-grid {
    display: grid;
    gap: 0.65rem;
    max-width: 42rem;
}

.schedule-row {
    display: grid;
    grid-template-columns: minmax(8rem, 1fr) 8rem auto 8rem;
    gap: 0.65rem;
    align-items: center;
}

.schedule-row .time-input {
    width: 100%;
    font-variant-numeric: tabular-nums;
}

.check-field {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    cursor: pointer;
}

.check-field input {
    width: 1.1rem;
    height: 1.1rem;
    flex: 0 0 auto;
}

.member-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    max-height: 22rem;
    overflow: auto;
    padding: 0.25rem;
}

.member-picker__item {
    padding: 0.8rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.7rem;
    background: #fff;
}

.member-picker__item span,
.member-picker__item small {
    display: block;
}

.sports-fieldset {
    margin: 0;
    border: 1px solid var(--slate-200);
    border-radius: 0.9rem;
    padding: 1.2rem;
}

.sports-fieldset legend {
    padding: 0 0.35rem;
    font-size: 0.9rem;
    font-weight: 750;
}

.sports-fieldset > p {
    margin: 0 0 1rem;
    color: var(--slate-500);
    font-size: 0.8rem;
}

.sport-selector {
    display: grid;
    gap: 0.8rem;
}

.sport-selector__picker {
    position: relative;
}

.sport-selector__trigger {
    display: flex;
    width: 100%;
    min-height: 4rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid var(--slate-300);
    border-radius: 0.8rem;
    outline: none;
    padding: 0.75rem 0.95rem;
    color: var(--navy-950);
    background: var(--white);
    cursor: pointer;
    text-align: left;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.sport-selector__trigger > span:first-child {
    display: grid;
    gap: 0.2rem;
}

.sport-selector__trigger strong {
    font-size: 0.9rem;
}

.sport-selector__trigger small {
    color: var(--slate-500);
    font-size: 0.74rem;
    font-weight: 600;
}

.sport-selector__trigger:focus-visible,
.sport-selector__trigger[aria-expanded="true"] {
    border-color: var(--blue-500);
    box-shadow: 0 0 0 4px rgb(45 125 240 / 13%);
}

.sport-selector__chevron {
    width: 0.6rem;
    height: 0.6rem;
    flex: 0 0 auto;
    border-right: 2px solid var(--slate-500);
    border-bottom: 2px solid var(--slate-500);
    transform: translateY(-0.15rem) rotate(45deg);
    transition: transform 150ms ease;
}

.sport-selector__trigger[aria-expanded="true"] .sport-selector__chevron {
    transform: translateY(0.15rem) rotate(225deg);
}

body.sport-selector-is-open {
    overflow: hidden;
}

.sport-selector__panel::backdrop {
    background: rgb(7 22 47 / 32%);
}

.sport-selector__panel {
    position: fixed;
    inset: 0;
    display: grid;
    width: min(54rem, calc(100% - 1.5rem));
    max-width: none;
    max-height: min(40rem, calc(100vh - 1.5rem));
    max-height: min(40rem, calc(100dvh - 1.5rem));
    margin: auto;
    gap: 1rem;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: 1rem;
    color: var(--navy-950);
    background: var(--white);
    box-shadow: 0 1.4rem 3.5rem rgb(7 22 47 / 22%);
}

.sport-selector__body {
    display: grid;
    min-height: 0;
    gap: 1rem;
    align-content: start;
    overflow: auto;
    overscroll-behavior: contain;
    padding: 0.25rem;
}

.sport-selector__panel-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border-top: 1px solid var(--slate-200);
    padding-top: 0.85rem;
}

.sport-selector__panel-footer > span {
    color: var(--slate-500);
    font-size: 0.85rem;
}

.sport-selector__panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.sport-selector__panel-header > strong {
    font-size: 0.95rem;
}

.sport-selector__close {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border: 0;
    border-radius: 99rem;
    color: var(--slate-500);
    background: var(--slate-100);
    cursor: pointer;
    font-size: 1.2rem;
    line-height: 1;
}

.sport-selector__close:hover,
.sport-selector__close:focus-visible {
    color: var(--navy-950);
    background: var(--slate-200);
}

.sport-selector__filters {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: minmax(0, 1.6fr) minmax(12rem, 1fr);
}

.sport-selector__catalog {
    display: grid;
    min-width: 0;
    gap: 1.25rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.8rem;
    padding: 1rem;
    background: var(--white);
}

.sport-selector__chips {
    display: flex;
    max-height: 5.7rem;
    flex-wrap: wrap;
    gap: 0.45rem;
    overflow-y: auto;
}

.sport-selector__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid #cfe0fb;
    border-radius: 99rem;
    padding: 0.4rem 0.65rem;
    color: var(--blue-600);
    background: #eef5ff;
    cursor: pointer;
    font-size: 0.74rem;
    font-weight: 750;
}

.sport-selector__chip:hover,
.sport-selector__chip:focus-visible {
    border-color: var(--blue-500);
    background: #e3efff;
}

.sport-category {
    display: grid;
    gap: 0.7rem;
}

.sport-category h4 {
    margin: 0;
    color: var(--slate-500);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.sport-selector__empty {
    margin: 0;
    padding: 1rem;
    color: var(--slate-500);
    text-align: center;
}

.sport-selector__other {
    border-top: 1px solid var(--slate-200);
    padding-top: 1rem;
}

.choice-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.choice-card {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.75rem;
    padding: 0.85rem;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 700;
}

.choice-card:has(input:checked) {
    border-color: var(--blue-500);
    color: var(--blue-600);
    background: #f3f8ff;
}

.choice-card input {
    width: 1rem;
    height: 1rem;
    accent-color: var(--blue-600);
}

.choice-card[hidden],
.sport-category[hidden],
.sport-selector__empty[hidden],
.sport-selector__panel:not([open]),
.sport-selector__chips[hidden] {
    display: none;
}

.form-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    border-top: 1px solid var(--slate-200);
    padding-top: 1.35rem;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.notice-card,
.metric-card,
.roadmap-card {
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.notice-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 1.15rem 1.3rem;
}

.notice-card > div {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.notice-card p {
    max-width: 43rem;
    margin: 0;
    color: var(--slate-500);
    font-size: 0.83rem;
    line-height: 1.55;
}

.status-dot {
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    background: var(--success);
    box-shadow: 0 0 0 0.25rem rgb(18 183 106 / 13%);
}

.status-dot--pending {
    background: #f59e0b;
    box-shadow: 0 0 0 0.25rem rgb(245 158 11 / 14%);
}

.status-dot--inactive {
    background: #ef4444;
    box-shadow: 0 0 0 0.25rem rgb(239 68 68 / 12%);
}

.notice-card--pending {
    border-color: #fde68a;
    background: #fffbeb;
}

.notice-card--inactive {
    border-color: #fecaca;
    background: #fff7f7;
}

.onboarding-steps {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.onboarding-step {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: 1.2rem;
    background: var(--white);
}

.onboarding-step > span {
    display: grid;
    flex: 0 0 1.8rem;
    height: 1.8rem;
    place-items: center;
    border-radius: 50%;
    color: var(--slate-500);
    background: var(--slate-100);
    font-size: 0.75rem;
    font-weight: 800;
}

.onboarding-step div {
    display: grid;
    gap: 0.3rem;
}

.onboarding-step small {
    color: var(--slate-500);
    line-height: 1.45;
}

.onboarding-step--complete > span {
    color: var(--white);
    background: var(--success);
}

.onboarding-step--current {
    border-color: #fde68a;
    background: #fffbeb;
}

.onboarding-step--current > span {
    color: #92400e;
    background: #fef3c7;
}

.club-profile-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1.4fr 1fr 1fr;
}

.profile-card {
    display: grid;
    align-content: center;
    gap: 0.45rem;
    min-height: 9rem;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: 1.3rem;
    background: var(--white);
}

.profile-card > span,
.profile-card small,
.profile-card p {
    color: var(--slate-500);
    font-size: 0.76rem;
}

.profile-card--identity {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.profile-card--identity img,
.club-monogram {
    width: 4.4rem;
    height: 4.4rem;
    flex: 0 0 4.4rem;
    border-radius: 1rem;
}

.profile-card--identity img {
    object-fit: contain;
}

.club-monogram {
    display: grid;
    place-items: center;
    color: var(--white);
    background: linear-gradient(145deg, var(--blue-600), var(--cyan-400));
    font-weight: 850;
}

.profile-card h2,
.profile-card p {
    margin: 0.25rem 0 0;
}

.weekly-schedule-card {
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.weekly-schedule-card__header {
    padding: 1.3rem 1.4rem;
    border-bottom: 1px solid var(--slate-200);
}

.weekly-schedule-card__header h2 {
    margin: 0.45rem 0 0;
    font-size: 1.2rem;
    letter-spacing: -0.025em;
}

.weekly-schedule-card__header > p:last-child {
    margin: 0.45rem 0 0;
    color: var(--slate-500);
    font-size: 0.82rem;
    line-height: 1.55;
}

.weekly-schedule {
    display: grid;
}

.weekly-schedule__item {
    display: grid;
    align-items: center;
    gap: 1rem;
    grid-template-columns: minmax(10rem, 0.75fr) minmax(10rem, 1fr) minmax(12rem, 1.25fr);
    padding: 1rem 1.4rem;
    border-bottom: 1px solid var(--slate-200);
}

.weekly-schedule__item:last-child {
    border-bottom: 0;
}

.weekly-schedule__time,
.weekly-schedule__details,
.weekly-schedule__location,
.weekly-schedule-empty {
    display: grid;
    gap: 0.25rem;
}

.weekly-schedule__time strong {
    color: var(--blue-600);
    font-size: 0.78rem;
}

.weekly-schedule__time span {
    color: var(--navy-950);
    font-size: 1.05rem;
    font-weight: 800;
}

.weekly-schedule__details strong,
.weekly-schedule__location strong,
.weekly-schedule-empty strong {
    font-size: 0.86rem;
}

.weekly-schedule__details span,
.weekly-schedule__location span,
.weekly-schedule-empty span {
    color: var(--slate-500);
    font-size: 0.76rem;
    line-height: 1.45;
}

.weekly-schedule-empty {
    padding: 1.4rem;
}

.athlete-attendance {
    display: grid;
    gap: 1rem;
    scroll-margin-top: 1rem;
}

.athlete-attendance__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.athlete-attendance__header h2 {
    margin: 0;
    font-size: 1.1rem;
    letter-spacing: -0.025em;
}

.athlete-attendance-summary,
.athlete-attendance-group {
    min-width: 0;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
}

.athlete-attendance-summary {
    padding: clamp(0.9rem, 3vw, 1.4rem);
}

.athlete-attendance-summary__metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    margin: 0;
    text-align: center;
}

.athlete-attendance-summary__metrics > div {
    min-width: 0;
}

.athlete-attendance-summary__metrics dt {
    min-height: 2.4em;
    color: var(--slate-500);
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.athlete-attendance-summary__metrics dd {
    margin: 0.35rem 0 0;
    color: var(--navy-950);
    font-size: clamp(1.45rem, 5vw, 2.2rem);
    font-weight: 800;
    letter-spacing: -0.045em;
    font-variant-numeric: tabular-nums;
}

.athlete-attendance-summary__meta {
    margin: 1rem 0 0;
    padding-top: 0.85rem;
    border-top: 1px solid var(--slate-200);
    color: var(--slate-500);
    font-size: 0.78rem;
    text-align: center;
}

.athlete-attendance__link {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

.athlete-attendance-groups,
.athlete-attendance-group__body {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
}

.athlete-attendance-group > summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.75rem;
    min-height: 56px;
    padding: 1rem;
    cursor: pointer;
    list-style: none;
}

.athlete-attendance-group > summary::-webkit-details-marker {
    display: none;
}

.athlete-attendance-group > summary::after {
    content: '';
    width: 0.4rem;
    height: 0.4rem;
    border-right: 2px solid var(--slate-500);
    border-bottom: 2px solid var(--slate-500);
    transform: rotate(45deg);
}

.athlete-attendance-group[open] > summary::after {
    transform: rotate(225deg);
}

.athlete-attendance-group > summary:focus-visible {
    outline: 2px solid var(--blue-600);
    outline-offset: 3px;
    border-radius: 1rem;
}

.athlete-attendance-group > summary strong {
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.athlete-attendance-group__count {
    color: var(--slate-500);
    font-size: 0.8rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.athlete-attendance-group__body {
    padding: 0 1rem 1rem;
}

.athlete-attendance-history {
    margin: 0;
    padding: 0;
    list-style: none;
}

.athlete-attendance-history li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--slate-200);
    font-size: 0.85rem;
}

.athlete-attendance-history li:last-child {
    border-bottom: 0;
}

.month-navigator {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.85rem;
    padding: 0.3rem;
    background: var(--white);
    box-shadow: 0 0.35rem 1rem rgb(16 24 40 / 4%);
}

.month-navigator__arrow {
    display: grid;
    width: 2.6rem;
    height: 2.6rem;
    place-items: center;
    border-radius: 0.65rem;
    color: var(--blue-600);
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1;
}

.month-navigator__arrow:hover,
.month-navigator__arrow:focus-visible {
    outline: none;
    background: #eef5ff;
    box-shadow: 0 0 0 3px rgb(45 125 240 / 13%);
}

.month-navigator__label {
    min-width: 10.5rem;
    padding-inline: 0.65rem;
    color: var(--navy-950);
    font-size: 0.9rem;
    text-align: center;
}

.metric-grid {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.metric-card {
    display: grid;
    gap: 0.55rem;
    padding: 1.4rem;
}

.metric-card span,
.metric-card small {
    color: var(--slate-500);
}

.metric-card span {
    font-size: 0.82rem;
    font-weight: 700;
}

.metric-card strong {
    font-size: 2.4rem;
    letter-spacing: -0.05em;
}

.metric-card small {
    font-size: 0.75rem;
}

.roadmap-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 2rem;
}

.roadmap-card h2 {
    font-size: 1.35rem;
}

.roadmap-card p:last-child {
    max-width: 46rem;
    margin-bottom: 0;
}

.join-shell {
    min-height: 100vh;
    padding: 0 1.25rem 2rem;
    background:
        linear-gradient(180deg, var(--navy-950) 0, var(--navy-800) 17rem, #f7f9fc 17rem);
}

.join-header,
.join-card,
.join-footer {
    width: min(100%, 58rem);
    margin-inline: auto;
}

.join-header {
    display: flex;
    min-height: 7.5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.join-card {
    border: 1px solid var(--slate-200);
    border-radius: 1.25rem;
    padding: clamp(1.4rem, 4vw, 3rem);
    background: var(--white);
    box-shadow: 0 1.25rem 3.5rem rgb(7 22 47 / 12%);
}

.join-heading h1,
.join-result h1 {
    margin: 0.55rem 0 0;
    font-size: clamp(1.8rem, 4vw, 2.65rem);
    letter-spacing: -0.045em;
}

.join-heading > p:last-child,
.join-result > p:last-child {
    max-width: 43rem;
    margin: 0.8rem 0 0;
    color: var(--slate-500);
    line-height: 1.65;
}

.application-type-picker {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    border: 0;
    padding: 0;
}

.application-type-picker legend {
    grid-column: 1 / -1;
    margin-bottom: 0.15rem;
    color: var(--slate-700);
    font-size: 0.78rem;
    font-weight: 750;
}

.choice-card {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.85rem;
    padding: 0.9rem 1rem;
    cursor: pointer;
    background: var(--white);
}

.choice-card:has(input:checked) {
    border-color: var(--blue-500);
    box-shadow: 0 0 0 3px rgb(45 125 240 / 10%);
}

.choice-card input,
.consent-field input {
    flex: 0 0 auto;
    width: 1.05rem;
    height: 1.05rem;
    accent-color: var(--blue-600);
}

.choice-card span,
.choice-card strong,
.choice-card small {
    display: block;
}

.choice-card strong {
    font-size: 0.88rem;
}

.choice-card small {
    margin-top: 0.18rem;
    color: var(--slate-500);
    font-size: 0.74rem;
}

.consent-field {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border-radius: 0.85rem;
    padding: 1rem;
    color: var(--slate-700);
    background: var(--slate-100);
    font-size: 0.8rem;
    line-height: 1.55;
}

.consent-field input {
    margin-top: 0.15rem;
}

.join-footer {
    padding-top: 1.5rem;
    color: var(--slate-500);
    font-size: 0.75rem;
    text-align: center;
}

.join-shell--result {
    display: grid;
    align-content: start;
}

.join-result {
    max-width: 42rem;
    text-align: center;
}

.join-result__icon {
    display: grid;
    width: 3.5rem;
    height: 3.5rem;
    margin: 0 auto 1.1rem;
    place-items: center;
    border-radius: 50%;
    color: #067647;
    background: #dcfae6;
    font-size: 1.5rem;
    font-weight: 850;
}

.share-link-card {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(14rem, 0.55fr) minmax(18rem, 1fr);
    align-items: center;
    border: 1px solid #b2ddff;
    border-radius: 1rem;
    padding: 1rem 1.2rem;
    background: #eff8ff;
}

.share-link-card p {
    margin: 0.25rem 0 0;
    color: var(--slate-500);
    font-size: 0.78rem;
    line-height: 1.45;
}

.share-link-card input {
    width: 100%;
    border: 1px solid #b2ddff;
    border-radius: 0.7rem;
    padding: 0.75rem 0.85rem;
    color: var(--navy-800);
    background: var(--white);
    font-size: 0.78rem;
}

.review-card {
    display: grid;
    gap: 2rem;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: clamp(1.4rem, 4vw, 2.5rem);
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.application-review-form {
    display: grid;
    gap: 1.15rem;
    border-top: 1px solid var(--slate-200);
    padding-top: 1.5rem;
}

.review-note {
    border-top: 1px solid var(--slate-200);
    padding-top: 1.5rem;
}

.review-note p {
    margin: 0.4rem 0 0;
    color: var(--slate-500);
    line-height: 1.6;
}

.status-badge--awaiting_email {
    color: #475467;
    background: #f2f4f7;
}

.status-badge--approved {
    color: #067647;
    background: #ecfdf3;
}

.status-badge--rejected {
    color: #b42318;
    background: #fef3f2;
}

.stage-number {
    color: #d9e3f0;
    font-size: clamp(3rem, 7vw, 6.5rem);
    font-weight: 850;
    letter-spacing: -0.08em;
}

@media (max-width: 900px) {
    .auth-shell {
        grid-template-columns: 1fr;
    }

    .auth-shell--registration {
        grid-template-columns: 1fr;
    }

    .auth-brand {
        min-height: 24rem;
    }

    .auth-panel {
        min-height: auto;
        padding-block: 4rem;
    }

    .app-shell {
        grid-template-columns: 1fr;
    }

    .sidebar {
        min-height: auto;
    }

    .nav-list {
        grid-template-columns: repeat(8, max-content);
        overflow-x: auto;
    }

    .metric-grid {
        grid-template-columns: 1fr;
    }

    .onboarding-steps,
    .club-profile-grid {
        grid-template-columns: 1fr;
    }

    .filter-bar {
        grid-template-columns: 1fr 1fr auto;
    }
}

@media (max-width: 620px) {
    .auth-brand {
        min-height: 21rem;
        padding: 1.5rem;
    }

    .auth-brand h1 {
        font-size: 2.6rem;
    }

    .auth-panel {
        padding: 2.7rem 1.35rem;
    }

    .topbar,
    .notice-card,
    .roadmap-card,
    .page-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .registration-heading,
    .registration-submit {
        align-items: stretch;
        flex-direction: column;
    }

    .registration-submit .button {
        width: 100%;
    }

    .filter-bar,
    .form-grid,
    .application-type-picker,
    .share-link-card,
    .sport-selector__filters,
    .choice-grid,
    .review-grid {
        grid-template-columns: 1fr;
    }

    .page-actions .button,
    .filter-bar .button {
        width: 100%;
    }

    .user-menu {
        width: 100%;
        justify-content: space-between;
        margin-left: 0;
    }

    .workspace-heading {
        flex: 0 1 auto;
        width: 100%;
    }

    .user-menu > div {
        text-align: left;
    }

    .button-group {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .button-group .button,
    .button-group form {
        width: 100%;
    }
}
    .schedule-row {
        grid-template-columns: 1fr 1fr auto 1fr;
    }

    .member-picker {
        grid-template-columns: 1fr;
    }


.member-identity {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 12rem;
}

.member-identity strong,
.member-identity small {
    display: block;
}

.member-identity small {
    margin-top: 0.2rem;
    color: var(--slate-500);
}

.member-avatar {
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 2.75rem;
    border-radius: 50%;
    object-fit: cover;
    background: var(--slate-100);
}

.member-avatar--initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--navy-800);
    background: #eef5ff;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.03em;
}

.profile-photo-field {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.9rem;
    padding: 1rem;
    background: #fafbfc;
}

.profile-photo-preview {
    flex: 0 0 6rem;
}

.profile-photo-preview img,
.profile-photo-preview .member-avatar {
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    object-fit: cover;
}

.profile-photo-controls {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.profile-photo-controls > strong,
.profile-photo-controls > p,
.profile-photo-status {
    width: 100%;
}

.profile-photo-controls > p,
.profile-photo-status {
    margin: 0;
    color: var(--slate-500);
    font-size: 0.8rem;
    line-height: 1.5;
}

.profile-photo-remove {
    min-height: 2.2rem;
    font-size: 0.8rem;
}

.profile-photo-status:not(:empty) {
    color: var(--navy-800);
}

@media (max-width: 640px) {
    .profile-photo-field {
        align-items: flex-start;
    }

    .profile-photo-preview {
        flex-basis: 4.5rem;
    }

    .profile-photo-preview img,
    .profile-photo-preview .member-avatar {
        width: 4.5rem;
        height: 4.5rem;
    }
}


.attendance-date-nav {
    display: grid;
    width: min(100%, 36rem);
    min-height: 8.5rem;
    align-items: stretch;
    grid-template-columns: 4rem minmax(0, 1fr) 4rem;
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.attendance-date-nav__arrow {
    display: grid;
    place-items: center;
    color: var(--blue-600);
    background: #fafbfc;
    font-size: 2rem;
    font-weight: 700;
    transition: color 150ms ease, background 150ms ease;
}

.attendance-date-nav__arrow:first-child {
    border-right: 1px solid var(--slate-200);
}

.attendance-date-nav__arrow:last-child {
    border-left: 1px solid var(--slate-200);
}

.attendance-date-nav__arrow:hover,
.attendance-date-nav__arrow:focus-visible {
    outline: none;
    color: var(--white);
    background: var(--blue-600);
}

.attendance-date-nav__arrow--disabled {
    color: var(--slate-300);
    cursor: default;
}

.attendance-date-nav__date {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.2rem;
    padding: 1rem;
    text-align: center;
}

.attendance-date-nav__date > span {
    color: var(--slate-500);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: capitalize;
}

.attendance-date-nav__date > strong {
    color: var(--navy-950);
    font-size: clamp(1.7rem, 4vw, 2.25rem);
    font-weight: 850;
    letter-spacing: -0.04em;
    line-height: 1.1;
    text-transform: capitalize;
}

.attendance-date-nav__date > small {
    color: var(--slate-500);
    font-size: 0.82rem;
    font-weight: 750;
}

.attendance-date-nav__date .attendance-date-nav__future {
    margin-top: 0.2rem;
    border-radius: 999px;
    padding: 0.22rem 0.55rem;
    color: var(--blue-600);
    background: #eef5ff;
    font-size: 0.68rem;
    font-weight: 850;
}

.attendance-toggle:disabled .attendance-option {
    opacity: 0.48;
    cursor: not-allowed;
}

@media (max-width: 620px) {
    .attendance-date-nav {
        min-height: 7.5rem;
        grid-template-columns: 3.4rem minmax(0, 1fr) 3.4rem;
    }

    .attendance-date-nav__date > strong {
        font-size: 1.65rem;
    }
}


.attendance-toggle {
    display: inline-flex;
    gap: 0.45rem;
    margin: 0;
    border: 0;
    padding: 0;
    white-space: nowrap;
}

.attendance-option {
    cursor: pointer;
}

.attendance-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-width: 6.4rem;
    min-height: 2.6rem;
    border: 1px solid var(--slate-300);
    border-radius: 0.7rem;
    padding: 0.55rem 0.8rem;
    color: var(--slate-700);
    background: var(--white);
    font-size: 0.8rem;
    font-weight: 800;
    transition: border-color 150ms ease, background 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

.attendance-option:hover .attendance-button--present {
    border-color: #68b98a;
    color: #176b42;
}

.attendance-option:hover .attendance-button--absent {
    border-color: #e08a8a;
    color: #a52f2f;
}

.attendance-option input:focus-visible + .attendance-button {
    box-shadow: 0 0 0 3px rgb(37 99 235 / 18%);
}

.attendance-option input:checked + .attendance-button--present {
    border-color: #278458;
    color: #145c3b;
    background: #e8f7ee;
}

.attendance-option input:checked + .attendance-button--absent {
    border-color: #c94b4b;
    color: #9e2929;
    background: #fdecec;
}



@media (max-width: 620px) {
    .weekly-schedule__item {
        align-items: start;
        grid-template-columns: 1fr;
    }

    .month-navigator {
        width: 100%;
    }

    .month-navigator__label {
        min-width: 0;
        flex: 1;
    }
}

.coach-calendar-toolbar {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.9rem;
    padding: 0.45rem;
    background: var(--white);
    box-shadow: 0 0.35rem 1rem rgb(16 24 40 / 4%);
}

.coach-calendar-period {
    display: grid;
    min-width: 20rem;
    align-items: center;
    grid-template-columns: 2.5rem minmax(12rem, 1fr) 2.5rem;
}

.coach-calendar-period a {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border-radius: 0.65rem;
    color: var(--blue-600);
    font-size: 1.35rem;
    font-weight: 850;
}

.coach-calendar-period a:hover,
.coach-calendar-period a:focus-visible {
    outline: none;
    background: #eef5ff;
}

.coach-calendar-period strong {
    padding-inline: 0.5rem;
    font-size: 0.9rem;
    text-align: center;
}

.coach-calendar-today-link {
    border-radius: 0.65rem;
    padding: 0.7rem 0.85rem;
    color: var(--slate-700);
    font-size: 0.8rem;
    font-weight: 800;
}

.coach-calendar-today-link:hover,
.coach-calendar-today-link:focus-visible {
    outline: none;
    color: var(--blue-600);
    background: #eef5ff;
}

.coach-calendar-views {
    display: inline-flex;
    gap: 0.2rem;
    margin-left: auto;
    border-radius: 0.7rem;
    padding: 0.2rem;
    background: var(--slate-100);
}

.coach-calendar-views a {
    border-radius: 0.55rem;
    padding: 0.6rem 0.85rem;
    color: var(--slate-500);
    font-size: 0.78rem;
    font-weight: 800;
}

.coach-calendar-views a:hover,
.coach-calendar-views a:focus-visible,
.coach-calendar-views a[aria-current="page"] {
    outline: none;
    color: var(--navy-950);
    background: var(--white);
    box-shadow: 0 1px 3px rgb(16 24 40 / 8%);
}

.coach-week-calendar-scroll {
    overflow-x: auto;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
    scrollbar-width: thin;
}

.coach-week-calendar {
    display: grid;
    min-width: 68rem;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.coach-week-day {
    min-height: 24rem;
    border-right: 1px solid var(--slate-200);
    background: var(--white);
}

.coach-week-day:last-child {
    border-right: 0;
}

.coach-week-day--today {
    background: #f5f8ff;
}

.coach-week-day__header {
    display: flex;
    min-height: 4.4rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    border-bottom: 1px solid var(--slate-200);
    padding: 0.8rem;
    background: #fafbfc;
}

.coach-week-day--today .coach-week-day__header {
    background: #eef5ff;
}

.coach-week-day__header span {
    color: var(--slate-500);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.05em;
}

.coach-week-day__header strong {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 50%;
    font-size: 0.86rem;
}

.coach-week-day--today .coach-week-day__header strong {
    color: var(--white);
    background: var(--blue-600);
}

.coach-week-day__sessions {
    display: grid;
    align-content: start;
    gap: 0.55rem;
    padding: 0.6rem;
}

.coach-week-training {
    display: grid;
    gap: 0.28rem;
    border: 1px solid #dbe7f8;
    border-radius: 0.75rem;
    padding: 0.75rem;
    color: var(--navy-950);
    background: #f8fbff;
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.coach-week-training:hover,
.coach-week-training:focus-visible {
    outline: none;
    border-color: #8bb7f6;
    box-shadow: 0 0.35rem 0.9rem rgb(45 125 240 / 10%);
    transform: translateY(-1px);
}

.coach-week-training time {
    color: var(--blue-600);
    font-size: 0.84rem;
    font-weight: 850;
}

.coach-week-training strong {
    overflow-wrap: anywhere;
    font-size: 0.82rem;
    line-height: 1.35;
}

.coach-week-training > span,
.coach-week-training small {
    color: var(--slate-500);
    font-size: 0.72rem;
    line-height: 1.35;
}

.coach-week-training b {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.35rem;
    border-top: 1px solid #dbe7f8;
    padding-top: 0.5rem;
    color: var(--blue-600);
    font-size: 0.7rem;
    font-weight: 850;
}

.coach-week-day__empty {
    padding: 0.8rem;
    color: var(--slate-300);
    font-size: 1rem;
    text-align: center;
}

.coach-training-agenda {
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.coach-agenda-day {
    display: grid;
    grid-template-columns: 5.5rem 1fr;
    border-bottom: 1px solid var(--slate-200);
}

.coach-agenda-day:last-child {
    border-bottom: 0;
}

.coach-agenda-day__date {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.25rem;
    border-right: 1px solid var(--slate-200);
    padding: 1rem;
    background: #fafbfc;
}

.coach-agenda-day--today .coach-agenda-day__date {
    color: var(--blue-600);
    background: #eef5ff;
}

.coach-agenda-day__date span {
    color: var(--slate-500);
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.05em;
}

.coach-agenda-day__date strong {
    font-size: 1.25rem;
}

.coach-agenda-day__sessions {
    display: grid;
}

.coach-agenda-training {
    display: grid;
    align-items: center;
    gap: 1rem;
    grid-template-columns: 8rem minmax(10rem, 1fr) minmax(12rem, 1.2fr) auto 1.5rem;
    border-bottom: 1px solid var(--slate-200);
    padding: 0.95rem 1rem;
    color: var(--navy-950);
}

.coach-agenda-training:last-child {
    border-bottom: 0;
}

.coach-agenda-training:hover,
.coach-agenda-training:focus-visible {
    outline: none;
    background: #f8fbff;
}

.coach-agenda-training time {
    color: var(--blue-600);
    font-size: 0.86rem;
    font-weight: 850;
}

.coach-agenda-training strong {
    font-size: 0.84rem;
}

.coach-agenda-training span,
.coach-agenda-training small {
    color: var(--slate-500);
    font-size: 0.74rem;
    line-height: 1.4;
}

.coach-agenda-training b {
    color: var(--blue-600);
    font-size: 1rem;
}

@media (max-width: 900px) {
    .coach-calendar-toolbar {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .coach-calendar-views {
        width: 100%;
        order: 3;
        margin-left: 0;
    }

    .coach-calendar-views a {
        flex: 1;
        text-align: center;
    }

    .coach-agenda-training {
        grid-template-columns: 7rem minmax(10rem, 1fr) minmax(10rem, 1fr) 1.5rem;
    }

    .coach-agenda-training small {
        display: none;
    }
}

@media (max-width: 620px) {
    .coach-calendar-toolbar {
        display: grid;
        grid-template-columns: 1fr auto;
    }

    .coach-calendar-period {
        min-width: 0;
        grid-template-columns: 2.5rem minmax(0, 1fr) 2.5rem;
    }

    .coach-calendar-today-link {
        align-self: center;
    }

    .coach-calendar-views {
        grid-column: 1 / -1;
    }

    .coach-week-calendar {
        min-width: 62rem;
    }

    .coach-week-day {
        min-height: 20rem;
    }

    .coach-agenda-day {
        grid-template-columns: 4.2rem 1fr;
    }

    .coach-agenda-training {
        align-items: start;
        gap: 0.3rem;
        grid-template-columns: 1fr 1.5rem;
        padding: 0.85rem;
    }

    .coach-agenda-training time,
    .coach-agenda-training strong,
    .coach-agenda-training span {
        grid-column: 1;
    }

    .coach-agenda-training b {
        grid-column: 2;
        grid-row: 1 / span 3;
    }
}



/* Coach athletes */
.coach-athlete-groups {
    display: grid;
    gap: 1rem;
}

.coach-athlete-group {
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.coach-athlete-group__header {
    display: flex;
    min-height: 5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid var(--slate-200);
    padding: 1rem 1.25rem;
    background: #fafbfc;
}

.coach-athlete-group__header h2,
.coach-athlete-group__header p {
    margin: 0;
}

.coach-athlete-group__header h2 {
    margin-top: 0.2rem;
    font-size: 1.05rem;
}

.coach-athlete-group__header p {
    color: var(--slate-500);
    font-size: 0.78rem;
    font-weight: 700;
}

.coach-athlete-group__header > span {
    flex: 0 0 auto;
    border-radius: 999px;
    padding: 0.4rem 0.7rem;
    color: var(--blue-600);
    background: #eef5ff;
    font-size: 0.78rem;
    font-weight: 800;
}

.coach-athlete-group__empty {
    padding: 1.25rem;
}

.coach-athlete-table {
    min-width: 54rem;
    table-layout: fixed;
}

.coach-athlete-table th:nth-child(1) {
    width: 38%;
}

.coach-athlete-table th:nth-child(2) {
    width: 23%;
}

.coach-athlete-table th:nth-child(3) {
    width: 25%;
}

.coach-athlete-table th:nth-child(4) {
    width: 14%;
}

.coach-athlete-table td {
    height: 4.75rem;
    vertical-align: middle;
}

.coach-athlete-table .member-identity {
    min-width: 0;
}

.coach-athlete-table .table-actions {
    display: table-cell;
    text-align: right;
}

.coach-athlete-contact {
    display: grid;
    gap: 0.2rem;
}

.coach-athlete-contact a {
    width: fit-content;
    color: var(--slate-700);
    font-size: 0.82rem;
}

.coach-athlete-contact a:hover,
.coach-athlete-contact a:focus-visible {
    outline: none;
    color: var(--blue-600);
    text-decoration: underline;
}

@media (max-width: 620px) {
    .coach-athlete-group__header {
        align-items: flex-start;
    }
}


/* Events */
.event-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr));
}

.event-card {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 1.25rem;
    background: var(--white);
    box-shadow: 0 0.3rem 1rem rgb(16 24 40 / 3%);
    transition: box-shadow .18s ease, border-color .18s ease;
}

.event-card:hover {
    border-color: #c7d5eb;
    box-shadow: 0 0.6rem 1.6rem rgb(16 24 40 / 7%);
}

.event-card__link::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    border-radius: 1.25rem;
    content: "";
}

.event-card__link:focus-visible {
    outline: none;
}

.event-card__link:focus-visible::after {
    outline: 3px solid var(--blue-600);
    outline-offset: -3px;
}

.event-card .event-registration-options :is(form, a) {
    position: relative;
    z-index: 2;
}

.event-card__cover,
.event-hero__cover {
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--white);
    background: linear-gradient(135deg, #173b72, var(--blue-600));
    font-size: 3rem;
    font-weight: 850;
}

.event-card__cover {
    position: relative;
    aspect-ratio: 16 / 9;
    flex-shrink: 0;
}

.event-card__cover img,
.event-hero__cover img,
.event-form-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.event-card__cover img {
    position: absolute;
    inset: 0;
}

.event-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: .65rem;
    padding: 1.2rem;
    min-width: 0;
}

.event-card__body h2,
.event-card__body p {
    margin: 0;
}

.event-card__body h2 {
    font-size: 1.16rem;
    line-height: 1.35;
    letter-spacing: -.02em;
    overflow-wrap: anywhere;
}

.event-card__body p {
    color: var(--slate-500);
    font-size: .84rem;
    line-height: 1.5;
}

.event-card__date,
.event-card__location {
    display: flex;
    align-items: flex-start;
    gap: .4rem;
}

.event-card__date {
    color: var(--blue-600);
    font-size: .8rem;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.event-card__date svg,
.event-card__location svg {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    margin-top: .08rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.event-card__location span {
    overflow-wrap: anywhere;
}

.event-type-badge {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    padding: .3rem .58rem;
    background: #eaf2ff;
    color: var(--blue-600);
    font-size: .7rem;
    font-weight: 750;
    letter-spacing: .02em;
}

.event-card__cover .event-type-badge {
    position: absolute;
    bottom: .85rem;
    left: 1rem;
    max-width: calc(100% - 2rem);
    padding: .38rem .7rem;
    background: rgb(255 255 255 / 96%);
    color: #243b60;
    box-shadow: 0 2px 8px rgb(16 24 40 / 8%);
    font-size: .72rem;
    line-height: 1.4;
}

.event-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .7rem;
    margin-top: auto;
    padding-top: .75rem;
}

.event-card__footer > strong {
    flex: 0 0 auto;
    color: var(--navy-950);
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.event-capacity-progress {
    display: grid;
    gap: 0.4rem;
    width: 100%;
    color: var(--navy-950);
}

.event-card__footer .event-capacity-progress {
    width: auto;
    max-width: 100%;
    gap: .3rem;
    margin-left: auto;
}

.event-capacity-progress__summary {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.event-card__footer .event-capacity-progress__summary {
    justify-content: flex-end;
}

.event-capacity-progress__summary svg {
    width: 1.05rem;
    height: 1.05rem;
    flex: 0 0 auto;
    fill: none;
    stroke: var(--slate-500);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.event-capacity-progress__summary strong {
    color: var(--navy-950);
    font-size: 0.8rem;
    font-variant-numeric: tabular-nums;
}

.event-capacity-progress__track {
    position: relative;
    height: 0.36rem;
    overflow: hidden;
    border-radius: 999px;
    background: #22c55e;
}

.event-capacity-progress__used {
    display: block;
    height: 100%;
    border-radius: 999px 0 0 999px;
    background: #ef4444;
}

.event-capacity-progress--full .event-capacity-progress__track {
    background: #ef4444;
}

.event-capacity-progress--unset,
.event-capacity-progress--unset .event-capacity-progress__summary strong {
    color: var(--slate-500);
}

.event-audience-grid,
.event-audience-summary {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.event-form-cover {
    width: min(100%, 30rem);
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 0.8rem;
}

.event-detail-actions {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
}

.event-hero {
    display: grid;
    overflow: hidden;
    grid-template-columns: minmax(18rem, 0.9fr) minmax(0, 1.1fr);
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.event-hero__cover {
    min-height: 25rem;
}

.event-hero__content {
    display: grid;
    align-content: start;
    gap: 1rem;
    padding: clamp(1.5rem, 3vw, 2.5rem);
}

.event-hero__content h2,
.event-description {
    margin: 0;
}

.event-hero__content h2 {
    font-size: clamp(1.65rem, 3vw, 2.5rem);
    line-height: 1.1;
}

.event-facts {
    display: grid;
    gap: 1rem 1.5rem;
    grid-template-columns: minmax(0, 0.7fr) minmax(10rem, 1.3fr);
    margin: 0;
    border-top: 1px solid var(--slate-200);
    padding-top: 1rem;
}

.event-facts > div {
    display: grid;
    align-content: start;
    gap: 0.2rem;
}

.event-facts__wide {
    grid-column: 1 / -1;
}

.event-facts dt {
    color: var(--slate-500);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.event-facts dd {
    margin: 0;
    font-weight: 750;
    line-height: 1.45;
}

.event-facts__capacity .event-capacity-progress {
    max-width: 16rem;
}

.event-description {
    border-top: 1px solid var(--slate-200);
    padding-top: 1rem;
    color: var(--slate-700);
    line-height: 1.65;
    white-space: pre-line;
}

.event-audience-summary .table-card,
.event-registrations {
    padding: 1.25rem;
}

.event-audience-summary h2,
.event-audience-summary p,
.event-registrations > h2 {
    margin: 0;
}

.event-audience-summary p {
    margin-top: 0.5rem;
    color: var(--slate-500);
}

.event-registration-options {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.25rem;
}

.event-registration-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border-top: 1px solid var(--slate-200);
    padding-top: 0.7rem;
}

.event-registration-row > span:first-child {
    display: grid;
    gap: 0.1rem;
}

.event-registration-row small {
    color: var(--slate-500);
}

.coach-week-training--event {
    border-color: #d8d0f6;
    background: #faf8ff;
}

.coach-week-training--event time,
.coach-week-training--event b,
.coach-agenda-training--event time,
.coach-agenda-training--event b {
    color: #6941c6;
}

.coach-week-training--event b {
    border-top-color: #e4ddf8;
}

.coach-agenda-training--event {
    background: #fcfbff;
}

@media (max-width: 760px) {
    .event-hero,
    .event-audience-grid,
    .event-audience-summary {
        grid-template-columns: 1fr;
    }

    .event-hero__cover {
        min-height: auto;
        aspect-ratio: 16 / 9;
    }

    .event-facts {
        grid-template-columns: 1fr;
    }

    .event-facts__wide {
        grid-column: auto;
    }

    .event-registration-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Coach athlete statistics */
.coach-athlete-profile .club-profile-grid,
.coach-athlete-profile .metric-grid {
    align-items: stretch;
}

.coach-athlete-profile .profile-card,
.coach-athlete-profile .metric-card {
    height: 100%;
}

.statistics-filter {
    display: grid;
    gap: 1.15rem;
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    padding: 1.2rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.statistics-period-tabs {
    display: grid;
    width: min(100%, 44rem);
    margin-inline: auto;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.3rem;
    border-radius: 0.8rem;
    padding: 0.3rem;
    background: var(--slate-100);
}

.statistics-period-tab {
    display: inline-flex;
    min-height: 2.55rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.6rem;
    padding: 0.55rem 0.8rem;
    color: var(--slate-500);
    font-size: 0.86rem;
    font-weight: 750;
    text-align: center;
}

.statistics-period-tab:hover {
    color: var(--navy-950);
}

.statistics-period-tab--active {
    color: var(--navy-950);
    background: var(--white);
    box-shadow: 0 0.15rem 0.45rem rgb(16 24 40 / 9%);
}

.statistics-period-navigator {
    display: grid;
    width: min(100%, 34rem);
    margin-inline: auto;
    align-items: center;
    grid-template-columns: 2.85rem minmax(0, 1fr) 2.85rem;
    gap: 1rem;
}

.statistics-period-arrow {
    display: inline-flex;
    width: 2.85rem;
    height: 2.85rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--slate-200);
    border-radius: 0.75rem;
    color: var(--navy-950);
    background: var(--white);
    font-size: 1.65rem;
    line-height: 1;
}

.statistics-period-arrow:hover {
    border-color: var(--blue-500);
    color: var(--blue-600);
}

.statistics-period-current {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    text-align: center;
}

.statistics-period-current strong {
    overflow: hidden;
    font-size: 1.2rem;
    letter-spacing: -0.02em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.statistics-period-current span {
    color: var(--slate-500);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
}

.statistics-custom-period {
    display: grid;
    width: min(100%, 44rem);
    margin-inline: auto;
    align-items: end;
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
    gap: 0.8rem;
}

.statistics-custom-period .button {
    min-width: 10rem;
}

@media (max-width: 620px) {
    .statistics-filter {
        padding: 0.85rem;
    }

    .statistics-period-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .statistics-period-navigator {
        gap: 0.65rem;
        grid-template-columns: 2.75rem minmax(0, 1fr) 2.75rem;
    }

    .statistics-period-arrow {
        width: 2.75rem;
        height: 2.75rem;
    }

    .statistics-period-current strong {
        font-size: 1.05rem;
    }

    .statistics-custom-period {
        grid-template-columns: 1fr;
    }

    .statistics-custom-period .button {
        width: 100%;
    }
}
.event-registration-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.event-registration-actions form {
    margin: 0;
}

@media (max-width: 620px) {
    .event-registration-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .event-registration-actions .button {
        width: 100%;
    }
}

/* Compact registration controls on event cards */
.event-card .event-registration-options--compact {
    gap: .75rem;
    margin-top: .3rem;
}

.event-card .event-registration-row {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    border: 0;
    padding: 0;
    gap: .6rem;
    min-width: 0;
}

.event-card .event-registration-row + .event-registration-row {
    border-top: 1px solid var(--slate-200);
    padding-top: .7rem;
}

.event-card .event-registration-row > span:first-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

.event-card .event-registration-actions {
    flex: 1;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    min-width: 0;
}

.event-card .event-registration-actions form {
    flex: 1 1 100%;
}

.event-card .event-registration-actions .button {
    width: 100%;
}

.event-card .status-badge {
    max-width: 100%;
    padding: .35rem .6rem;
    font-size: .75rem;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
}

.event-card .event-registration-row small {
    font-size: .72rem;
    line-height: 1.45;
}

.event-card .button--small {
    min-height: 2.5rem;
    font-size: .77rem;
    white-space: normal;
    overflow-wrap: anywhere;
}

.event-card__footer .event-capacity-progress__summary strong {
    font-size: .75rem;
}

.event-card__footer .event-capacity-progress__summary svg {
    width: .9rem;
    height: .9rem;
}

.event-card__footer .event-capacity-progress__track {
    height: .2rem;
}

#event-registration {
    scroll-margin-top: 1.5rem;
}

@media (prefers-reduced-motion: reduce) {
    .event-card { transition: none; }
}

/* Messages */
.messaging-layout {
    display: grid;
    width: min(100%, 68rem);
    margin-inline: auto;
    gap: 1.5rem;
}

.message-compose-card,
.message-card,
.message-inbox-card {
    border: 1px solid var(--slate-200);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 0.45rem 1.4rem rgb(16 24 40 / 4%);
}

.message-compose-card {
    padding: clamp(1.2rem, 3vw, 1.75rem);
}

.message-compose-card__header h2,
.message-history__header h2,
.message-card h3,
.message-inbox-card h2 {
    margin: 0;
}

.message-compose-card__header h2,
.message-history__header h2 {
    font-size: 1.15rem;
}

.message-compose-form,
.message-history,
.message-list,
.message-inbox {
    display: grid;
    gap: 1rem;
}

.message-group-picker,
.message-audience-context,
.message-compose-form {
    margin-top: 1rem;
}

.message-group-picker {
    width: min(100%, 30rem);
}

.message-audience-context {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-radius: 0.75rem;
    padding: 0.75rem 0.9rem;
    background: #f4f7fb;
}

.message-audience-context span {
    color: var(--slate-500);
    font-size: 0.82rem;
    font-weight: 700;
}

.message-audience-context strong {
    font-size: 0.9rem;
}

.message-selection-hint {
    margin: 1rem 0 0;
    color: var(--slate-500);
    font-size: 0.9rem;
    line-height: 1.5;
}

.message-recipient-picker {
    display: grid;
    gap: 0.7rem;
    min-width: 0;
    margin: 0;
    border: 0;
    border-top: 1px solid var(--slate-200);
    border-bottom: 1px solid var(--slate-200);
    border-radius: 0;
    padding: 0.9rem 0;
}

.message-recipient-picker__header {
    display: flex;
    min-height: 2rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.message-recipient-picker legend {
    display: flex;
    align-items: baseline;
    gap: 0.55rem;
    padding: 0;
    color: var(--navy-950);
    font-size: 0.9rem;
    font-weight: 750;
}

.message-recipient-picker legend span {
    color: var(--slate-500);
    font-size: 0.78rem;
    font-weight: 600;
}

.message-select-all {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    color: var(--slate-500);
    font-size: 0.82rem;
    font-weight: 650;
}

.message-select-all input,
.message-recipient-option input {
    width: 1rem;
    height: 1rem;
    flex: 0 0 auto;
    accent-color: var(--blue-600);
}

.message-recipient-list {
    display: grid;
    max-height: 14rem;
    overflow-y: auto;
    grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
    gap: 0.5rem;
}

.message-recipient-option {
    display: flex;
    min-width: 0;
    min-height: 2.7rem;
    align-items: center;
    gap: 0.6rem;
    border: 1px solid var(--slate-200);
    border-radius: 0.65rem;
    padding: 0.55rem 0.7rem;
    cursor: pointer;
    color: var(--slate-700);
    background: var(--white);
    font-size: 0.88rem;
    font-weight: 650;
}

.message-recipient-option:has(input:checked) {
    border-color: #b9d3f8;
    color: var(--navy-950);
    background: #f4f8ff;
}

.message-recipient-option:hover {
    border-color: #b9d3f8;
}

.message-compose-form {
    gap: 0.9rem;
}

.message-compose-form textarea {
    min-height: 8rem;
}

.message-compose-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.1rem;
}

.message-compose-actions .button {
    min-width: 10rem;
}

.message-compose-actions .button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.message-history {
    gap: 0.8rem;
}

.message-history__header {
    display: flex;
    align-items: center;
    min-height: 2.5rem;
    padding: 0 0.1rem;
}

.message-empty-state {
    min-height: 0;
    justify-items: start;
    padding: 1.1rem 1.25rem;
    text-align: left;
}

.message-empty-state p {
    margin: 0;
    font-size: 0.9rem;
}

.message-status {
    width: min(100%, 68rem);
    margin-inline: auto;
}

.message-card,
.message-inbox-card {
    padding: 1.2rem;
}

.message-card__header,
.message-inbox-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.message-card__header > div,
.message-inbox-card__header > div {
    min-width: 0;
}

.message-card h3,
.message-inbox-card h2 {
    margin-top: 0.45rem;
    overflow-wrap: anywhere;
    font-size: 1rem;
    line-height: 1.4;
}

.message-audience {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    padding: 0.28rem 0.55rem;
    color: var(--blue-600);
    background: #eef5ff;
    font-size: 0.78rem;
    font-weight: 750;
}

.message-card time,
.message-inbox-card time {
    flex: 0 0 auto;
    color: var(--slate-500);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.message-card > p,
.message-inbox-card__body {
    color: var(--slate-700);
    font-size: 0.92rem;
    line-height: 1.65;
}

.message-card > p {
    margin: 0.9rem 0;
}

.message-card footer,
.message-inbox-card__header span,
.message-inbox-card__sender {
    color: var(--slate-500);
    font-size: 0.78rem;
}

.message-inbox-card {
    position: relative;
}

.message-inbox-card--unread {
    border-left: 4px solid var(--blue-600);
}

.message-inbox-card__sender {
    margin: 0.7rem 0 0;
    font-weight: 650;
}

.message-inbox-card__body {
    margin-top: 1rem;
    overflow-wrap: anywhere;
}

@media (max-width: 620px) {
    .message-compose-card {
        padding: 1rem;
    }

    .message-audience-context,
    .message-recipient-picker__header,
    .message-card__header,
    .message-inbox-card__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .message-recipient-list {
        grid-template-columns: 1fr;
    }

    .message-compose-actions .button {
        width: 100%;
    }

    .event-detail-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .event-detail-actions .button-group {
        align-items: stretch;
        flex-direction: column;
    }

    .event-detail-actions .button {
        width: 100%;
    }
}


/* Message composer modal, unread badge and important alert */
.message-page-header {
    display: flex;
    width: min(100%, 68rem);
    margin: 0 auto 1.25rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.message-page-header .page-intro {
    margin: 0;
}

.message-compose-modal[hidden] {
    display: none;
}

.message-compose-modal {
    position: fixed;
    z-index: 250;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1rem;
}

.message-compose-modal__backdrop,
.message-popup__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgb(15 23 42 / 58%);
    backdrop-filter: blur(2px);
}

.message-compose-modal__panel {
    position: relative;
    width: min(100%, 46rem);
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    border-radius: 1.1rem;
    background: var(--white);
    box-shadow: 0 2rem 5rem rgb(7 22 47 / 28%);
}

.message-compose-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.35rem 1.5rem;
    color: var(--white);
    background: linear-gradient(135deg, #315ee8, #2449c7);
}

.message-compose-modal__panel--alert .message-compose-modal__header {
    background: linear-gradient(135deg, #e5262a, #f05216);
}

.message-compose-modal__header h2,
.message-compose-modal__header p {
    margin: 0;
}

.message-compose-modal__header h2 {
    font-size: 1.35rem;
}

.message-compose-modal__header p {
    margin-top: 0.25rem;
    color: rgb(255 255 255 / 78%);
    font-size: 0.88rem;
}

.message-compose-modal__header > button {
    display: grid;
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 auto;
    place-items: center;
    border: 0;
    border-radius: 50%;
    color: var(--white);
    background: rgb(255 255 255 / 14%);
    font-size: 1.5rem;
    cursor: pointer;
}

.message-compose-modal__body {
    padding: 1.4rem 1.5rem 1.5rem;
}

.message-compose-modal .message-compose-form {
    margin-top: 0;
}

.message-type-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    margin: 0;
    border: 0;
    padding: 0;
}

.message-type-picker legend {
    grid-column: 1 / -1;
    padding: 0;
    color: var(--slate-700);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.message-type-option {
    display: grid;
    min-height: 4.5rem;
    place-items: center;
    border: 2px solid var(--slate-200);
    border-radius: 0.85rem;
    padding: 0.75rem;
    cursor: pointer;
    text-align: center;
}

.message-type-option strong,
.message-type-option small {
    display: block;
}

.message-type-option strong {
    color: var(--slate-700);
    font-size: 0.9rem;
}

.message-type-option small {
    margin-top: 0.2rem;
    color: var(--slate-500);
    font-size: 0.75rem;
    line-height: 1.35;
}

.message-type-option:has(input:checked) {
    border-color: var(--blue-600);
    background: #eef4ff;
}

.message-type-option:has(input:checked) strong {
    color: var(--blue-600);
}

.message-type-option--alert:has(input:checked) {
    border-color: #f06a6d;
    background: #fff1f1;
}

.message-type-option--alert:has(input:checked) strong {
    color: #c92328;
}

.message-compose-modal__panel--alert .message-compose-form textarea {
    border-color: #f5b7b9;
}

.message-character-count {
    display: block;
    margin-top: 0.35rem;
    color: var(--slate-500);
    font-size: 0.75rem;
    text-align: right;
}

.message-compose-modal .message-recipient-picker {
    margin-top: 0;
}

.message-compose-modal .message-compose-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    padding-top: 0.3rem;
}

.message-compose-modal .message-compose-actions .button {
    width: 100%;
}

.message-compose-modal__panel--alert .message-compose-actions .button--primary,
.button--alert {
    border-color: #e5262a;
    color: var(--white);
    background: #e5262a;
}

.message-card__labels {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.message-kind-badge {
    display: inline-flex;
    border-radius: 999px;
    padding: 0.28rem 0.55rem;
    color: #b42318;
    background: #fff0ef;
    font-size: 0.74rem;
    font-weight: 800;
}

.message-modal-is-open {
    overflow: hidden;
}

.message-popup {
    position: fixed;
    z-index: 300;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1rem;
}

.message-popup__panel {
    position: relative;
    width: min(100%, 34rem);
    overflow: hidden;
    border-radius: 1.1rem;
    background: var(--white);
    box-shadow: 0 2rem 5rem rgb(7 22 47 / 32%);
}

.message-popup__header {
    padding: 1.35rem 1.5rem;
    color: var(--white);
    background: linear-gradient(135deg, #e5262a, #f05216);
}

.message-popup__header span {
    color: rgb(255 255 255 / 78%);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.message-popup__header h2 {
    margin: 0.35rem 0 0;
    overflow-wrap: anywhere;
    font-size: 1.35rem;
    line-height: 1.35;
}

.message-popup__body {
    padding: 1.5rem;
}

.message-popup__sender {
    margin: 0 0 1rem;
    color: var(--slate-500);
    font-size: 0.8rem;
}

.message-popup__text {
    color: var(--navy-950);
    font-size: 1rem;
    line-height: 1.65;
}

.message-popup__body form {
    display: flex;
    justify-content: flex-end;
    margin-top: 1.5rem;
}

.message-popup__body .button {
    min-width: 9rem;
}

@media (max-width: 620px) {
    .message-page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .message-page-header .button {
        width: 100%;
    }

    .message-compose-modal {
        align-items: end;
        padding: 0;
    }

    .message-compose-modal__panel {
        max-height: 94vh;
        border-radius: 1.1rem 1.1rem 0 0;
    }

    .message-compose-modal__header,
    .message-compose-modal__body {
        padding-inline: 1rem;
    }

    .message-type-picker,
    .message-compose-modal .message-compose-actions {
        grid-template-columns: 1fr;
    }

    .message-popup {
        align-items: end;
        padding: 0;
    }

    .message-popup__panel {
        border-radius: 1.1rem 1.1rem 0 0;
    }

    .message-popup__body .button {
        width: 100%;
    }
}

/* Message audience picker */
.message-audience-picker {
    display: grid;
    gap: 0.55rem;
    margin: 0;
    border: 0;
    padding: 0;
}

.message-audience-picker legend {
    padding: 0;
    color: var(--slate-700);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.message-audience-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.message-audience-options--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.message-audience-option {
    display: grid;
    min-height: 3.4rem;
    place-items: center;
    border: 2px solid var(--slate-200);
    border-radius: 0.8rem;
    padding: 0.65rem;
    cursor: pointer;
    color: var(--slate-700);
    background: var(--white);
    font-size: 0.88rem;
    font-weight: 750;
    text-align: center;
}

.message-audience-option:has(input:checked) {
    border-color: var(--blue-600);
    color: var(--blue-600);
    background: #eef4ff;
}

.message-audience-option:has(input:disabled) {
    cursor: not-allowed;
    opacity: 0.45;
}

.message-compose-modal__panel--alert .message-audience-option:has(input:checked) {
    border-color: #f06a6d;
    color: #c92328;
    background: #fff1f1;
}

[data-message-selector-for][hidden] {
    display: none;
}

@media (max-width: 620px) {
    .message-audience-options,
    .message-audience-options--three {
        grid-template-columns: 1fr;
    }
}

/* Coach dashboard and monthly compensation */
.coach-identity { display: flex; align-items: center; gap: 1.5rem; padding: 1.6rem; background: white; border: 1px solid var(--slate-200, #e2e8f0); border-radius: 18px; margin-bottom: 1.2rem; }
.coach-identity__photo, .coach-identity__initials { width: 96px; height: 96px; border-radius: 24px; object-fit: cover; flex-shrink: 0; }
.coach-identity__initials { display: grid; place-items: center; background: #eef2ff; color: #4338ca; font-size: 2rem; font-weight: 700; }
.coach-identity h2 { margin: 0 0 .4rem; }
.coach-identity p { margin: .35rem 0; }
.coach-identity__details { display: flex; flex-wrap: wrap; gap: 1rem 2.2rem; margin: 1rem 0 0; }
.coach-identity__details dt { color: var(--slate-500); font-size: .8rem; }
.coach-identity__details dd { margin: .35rem 0 0; overflow-wrap: anywhere; }
.compensation-metrics { margin-bottom: 1.2rem; }
.compensation-metrics strong { font-size: clamp(1.5rem, 2.3vw, 2.4rem); overflow-wrap: anywhere; }
.compensation-note { padding: 1rem 1.4rem; border-radius: 14px; background: #eef2ff; margin-bottom: 1.2rem; font-size: .88rem; }
.compensation-note p { margin: .5rem 0 0; }
.compensation-fields { border: 0; padding: 0; margin: 1.5rem 0; min-width: 0; }
.compensation-fields legend { font-size: 1.05rem; font-weight: 700; margin-bottom: 1rem; }
.compensation-admin { display: grid; gap: 1.2rem; margin-top: 1.5rem; }
.compensation-admin > .form-card { margin: 0; width: 100%; max-width: none; }
.compensation-section-title { padding: 1.2rem 1.4rem; margin: 0; font-size: 1rem; }
.compensation-history { margin-bottom: 1.2rem; }
@media (max-width: 640px) { .coach-identity { align-items: flex-start; flex-direction: column; } .coach-identity__photo, .coach-identity__initials { width: 72px; height: 72px; border-radius: 18px; } .compensation-metrics { grid-template-columns: 1fr; } }

/* Focused coach editing and compact dashboard */
.coach-window { width: min(940px, calc(100vw - 32px)); height: min(880px, calc(100dvh - 48px)); max-height: calc(100dvh - 48px); padding: 0; border: 0; border-radius: 22px; box-shadow: 0 28px 90px #0f172a45; background: #fff; }
.coach-window::backdrop { background: #0f172a80; backdrop-filter: blur(5px); }
.coach-window iframe { width: 100%; height: 100%; border: 0; display: block; }
.coach-modal-page { background: #fff; min-height: 100dvh; }
.coach-editor { max-width: 940px; margin: 0 auto; background: #fff; border: 1px solid #e8ebf2; border-radius: 22px; overflow: hidden; }
.coach-modal-page .coach-editor { border: 0; border-radius: 0; }
.coach-editor__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; padding: 28px 32px; background: linear-gradient(115deg, #5140e8, #244ddc); color: #fff; }
.coach-editor__header p { margin: 0 0 8px; font-size: 13px; color: #d8deff; }
.coach-editor__header h2 { margin: 0 0 8px; font-size: 24px; line-height: 1.2; overflow-wrap: anywhere; }
.coach-editor__header span { font-size: 14px; color: #d8deff; overflow-wrap: anywhere; }
.coach-editor__close { display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0; border-radius: 10px; color: #fff; text-decoration: none; font-size: 32px; line-height: 1; }
.coach-editor__close:hover { background: #ffffff20; }
.coach-editor__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid #e8ebf2; padding: 0 20px; }
.coach-editor__tabs a { padding: 20px 8px 17px; text-align: center; color: #697386; text-decoration: none; font-size: 14px; font-weight: 650; border-bottom: 3px solid transparent; }
.coach-editor__tabs a[aria-selected="true"] { color: #5140e8; border-color: #5140e8; }
.coach-editor__panel { padding: 28px 32px; }
.coach-editor [hidden], [data-pay-options] [hidden] { display: none !important; }
.coach-editor .field { gap: 8px; font-size: 13px; font-weight: 600; }
.coach-editor .field input, .coach-editor .field select, .compensation-fields .field input, .compensation-fields .field select { min-height: 48px; width: 100%; box-sizing: border-box; padding: 12px 14px; border: 1px solid #dfe3ec; border-radius: 12px; background: #f8f9fc; font: inherit; font-size: 15px; color: #182237; }
.coach-editor .form-grid, .compensation-fields .form-grid { gap: 20px; }
.coach-editor .compensation-fields { margin: 24px 0 0; }
.coach-editor .compensation-fields legend { font-size: 13px; color: #697386; font-weight: 650; }
.coach-editor__footer { display: flex; gap: 16px; justify-content: flex-end; padding: 20px 32px; border-top: 1px solid #e8ebf2; background: #fff; }
.coach-editor__footer .button { flex: 1; min-height: 48px; justify-content: center; }
.coach-editor > .form-error, .coach-editor > .form-success { margin: 20px 32px 0; }
.coach-workload { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 22px 12px; border: 1px solid #edf0f5; background: #f8f9fc; border-radius: 16px; text-align: center; }
.coach-workload strong { display: block; font-size: 28px; line-height: 1.2; color: #182237; }
.coach-workload span { display: block; font-size: 12px; color: #778094; margin-top: 8px; }
.coach-current-pay { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 20px; font-size: 13px; color: #697386; }
.coach-current-pay strong { display: block; color: #078766; font-size: 24px; margin-top: 5px; }
.coach-pay-options { display: grid; gap: 10px; }
.coach-pay-option { display: flex; align-items: flex-start; gap: 14px; padding: 18px; border: 1px solid #dfe3ec; border-radius: 14px; cursor: pointer; }
.coach-pay-option:has(input:checked) { border-color: #5a47ef; box-shadow: inset 0 0 0 1px #5a47ef; background: #f7f6ff; }
.coach-pay-option input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: #5140e8; flex-shrink: 0; }
.coach-pay-option strong { display: block; font-size: 14px; font-weight: 650; line-height: 1.5; }
.coach-pay-option small { display: block; margin-top: 5px; color: #788196; font-size: 13px; line-height: 1.5; }
.coach-pay-option--keep { padding: 12px 18px; }
.coach-pay-option--keep strong { font-size: 13px; color: #697386; font-weight: 500; }
.coach-rate-fields { margin-top: 22px; }
.coach-details { border: 1px solid #e8ebf2; border-radius: 12px; margin: 16px 0; padding: 0 16px; background: #fff; }
.coach-details > summary { padding: 14px 0; cursor: pointer; font-size: 13px; font-weight: 600; color: #58647c; }
.coach-details > p { color: #697386; font-size: 13px; line-height: 1.65; margin: 0 0 14px; }
.coach-details .coach-identity__details { margin: 0 0 16px; }
.coach-editor .compensation-admin { margin: 0; gap: 20px; }
.coach-editor .compensation-admin .form-card { padding: 20px; border-radius: 14px; }
.coach-editor .compensation-admin h2 { font-size: 16px; }
.coach-editor .compensation-admin .form-note { font-size: 12px; line-height: 1.6; color: #788196; }
.coach-editor .compensation-metrics { gap: 10px; margin: 0; }
.coach-editor .metric-card { padding: 16px; gap: 8px; }
.coach-editor .metric-card strong { font-size: 22px; }
.coach-editor .metric-card span { font-size: 12px; line-height: 1.5; }
.paysheet-card { max-width: 960px; width: 100%; padding: clamp(20px, 3vw, 36px); background: #fff; border: 1px solid #e8ebf2; border-radius: 18px; }
.paysheet-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.paysheet-heading h2 { margin: 6px 0; font-size: 24px; }
.paysheet-heading p { color: #778094; }
.paysheet-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; padding: 20px 12px; border-bottom: 1px solid #e8ebf2; font-size: 14px; }
.paysheet-row > :last-child { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.paysheet-row p { color: #778094; margin: 8px 0 0; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.paysheet-row strong { overflow-wrap: anywhere; }
.paysheet-row--header { background: #f8f9fc; color: #778094; font-size: 12px; padding: 12px; }
.paysheet-total { background: #f8f9fc; margin: 24px 0; border: 0; border-radius: 10px; align-items: center; }
.paysheet-total strong { font-size: 24px; }
@media (max-width: 640px) { .paysheet-heading { flex-direction: column; } .paysheet-row { gap: 12px; padding-left: 0; padding-right: 0; } .paysheet-total { padding: 16px 12px; } }
.event-pay-dialog { width: min(760px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #e8ebf2; border-radius: 20px; color: #182237; background: #fff; box-shadow: 0 24px 80px #18223733; }
.event-pay-dialog::backdrop { background: #10182880; }
.event-pay-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 28px; background: #f8f9fc; border-bottom: 1px solid #e8ebf2; }
.event-pay-header h2 { margin: 0; font-size: 22px; }
.event-pay-header p { margin: 6px 0 0; font-size: 14px; color: #778094; }
.event-pay-header .coach-editor__close { color: #697386; background: transparent; cursor: pointer; }
.event-pay-body { padding: 24px 28px; }
.event-pay-options, .event-pay-fields { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.event-pay-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.event-pay-options > label:first-of-type { grid-column: 1 / -1; }
.event-pay-options legend { margin-bottom: 14px; font-size: 13px; font-weight: 600; }
.event-pay-options .coach-pay-option { padding: 14px 16px; }
.event-pay-dialog [hidden] { display: none !important; }
.event-pay-footer { display: flex; justify-content: flex-end; gap: 12px; padding: 20px 28px; border-top: 1px solid #e8ebf2; }
.event-pay-preview { padding: 20px; background: #f8f9fc; border-radius: 12px; margin-top: 20px; }
.event-pay-preview h3 { font-size: 15px; margin: 0; }
.event-pay-preview p, .event-pay-breakdown p { font-size: 13px; color: #697386; }
.event-pay-share { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; padding: 8px 0; font-size: 14px; }
.event-pay-share strong:last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.event-pay-breakdown article { padding: 10px 0; border-top: 1px solid #e8ebf2; }
.event-pay-breakdown small { font-size: 12px; color: #778094; }
.event-pay-totals { display: flex; flex-wrap: wrap; gap: 12px 28px; font-size: 13px; color: #697386; }
.event-pay-totals strong { margin-left: 8px; color: #182237; }
@media (max-width: 640px) { .event-pay-body, .event-pay-header { padding: 20px 18px; } .event-pay-fields .form-grid, .event-pay-options { grid-template-columns: 1fr; } }
.coach-list-toolbar { justify-content: flex-end; }
.coach-list { table-layout: fixed; }
.coach-list th { font-size: 12px; font-weight: 600; text-transform: none; letter-spacing: 0; line-height: 1.5; background: #f8f9fc; color: #778094; }
.coach-list th, .coach-list td { padding: 18px 16px; vertical-align: middle; }
.coach-list th:nth-child(2) { width: 7rem; }
.coach-list th:nth-child(3) { width: 4.5rem; }
.coach-list th:nth-child(4) { width: 5.5rem; }
.coach-list th:nth-child(5) { width: 8.5rem; }
.coach-list th:last-child { width: 16rem; }
.coach-list td { font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.coach-list .member-identity { min-width: 0; gap: 12px; }
.coach-list .member-identity > div { min-width: 0; }
.coach-list .member-avatar { width: 42px; height: 42px; flex-shrink: 0; }
.coach-list .member-identity strong { font-size: 14px; }
.coach-list small { display: block; font-size: 12px; margin-top: 3px; color: #929bae; }
.coach-list__number { text-align: center; font-variant-numeric: tabular-nums; white-space: nowrap; }
.coach-list th.coach-list__number { padding-right: 8px; padding-left: 8px; white-space: normal; overflow-wrap: anywhere; }
.coach-list__amount { text-align: right; font-variant-numeric: tabular-nums; }
.coach-list td.coach-list__amount { font-weight: 600; white-space: nowrap; }
.coach-list__actions { text-align: right; }
.coach-list__action-buttons { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.coach-list__action-buttons form { max-width: 100%; margin: 0; }
.coach-list__actions .button { min-height: 36px; max-width: 100%; padding: 8px 12px; text-align: center; white-space: normal; }

@media (max-width: 1200px) {
    .coach-list-card { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
    .coach-list { display: block; }
    .coach-list thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .coach-list tbody { display: grid; gap: 16px; }
    .coach-list tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 20px; border: 1px solid var(--slate-200); border-radius: 16px; background: var(--white); }
    .coach-list td { display: block; min-width: 0; padding: 0; border: 0; text-align: left; }
    .coach-list td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 4px; color: #778094; font-size: 12px; font-weight: 500; white-space: normal; }
    .coach-list__identity, .coach-list__sport, .coach-list__amount, .coach-list__actions { grid-column: 1 / -1; }
    .coach-list td.coach-list__amount { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-top: 16px; border-top: 1px solid var(--slate-200); text-align: right; }
    .coach-list td.coach-list__amount::before { margin-bottom: 0; text-align: left; }
    .coach-list__actions .button { min-height: 44px; }
}
.coach-access-action { margin-top: 24px; padding-top: 16px; border-top: 1px solid #e8ebf2; }
.coach-pay-badge { display: inline-block; max-width: 160px; padding: 8px 10px; border: 1px solid #e0e4ff; border-radius: 10px; background: #f2f3ff; color: #5140d9; font-size: 12px; line-height: 1.5; }
.coach-identity { padding: 24px; align-items: flex-start; }
.coach-identity > div { flex: 1; min-width: 0; }
.coach-identity h2 { font-size: 23px; }
.coach-identity p { color: #778094; font-size: 14px; line-height: 1.5; }
.coach-identity .coach-details { border: 0; padding: 0; margin: 8px 0 0; }
.coach-identity .coach-details summary { padding: 5px 0; color: #5140e8; }
.compensation-metrics .metric-card { border-radius: 16px; border: 1px solid #e8ebf2; box-shadow: none; }
.compensation-metrics .metric-card strong { letter-spacing: -.03em; }
@media (max-width: 640px) {
    .coach-window { width: calc(100vw - 16px); height: calc(100dvh - 16px); max-height: calc(100dvh - 16px); border-radius: 16px; }
    .coach-editor__header { padding: 22px 18px; }
    .coach-editor__header h2 { font-size: 21px; }
    .coach-editor__tabs { padding: 0 8px; }
    .coach-editor__tabs a { font-size: 12px; padding: 16px 4px; }
    .coach-editor__panel { padding: 20px 18px; }
    .coach-editor__footer { padding: 16px 18px; gap: 10px; }
    .coach-editor .form-grid, .compensation-fields .form-grid { grid-template-columns: 1fr; gap: 16px; }
    .coach-workload strong { font-size: 24px; }
    .coach-workload span { font-size: 11px; }
    .coach-editor .compensation-metrics { grid-template-columns: 1fr; }
}


.family-profile { min-width: 0; max-width: 42rem; }
.family-profile__form { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.family-profile__form .field { flex: 1; min-width: 180px; margin: 0; }
.family-profile--single { display: flex; align-items: center; gap: 10px; padding: 4px 0; color: #64748b; }
.family-profile__identity { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; min-width: 0; font-size: .85rem; overflow-wrap: anywhere; }
.family-profile__identity strong { color: #344054; font-weight: 650; }
.family-profile p { color: #64748b; margin: 12px 0; font-size: .875rem; }
.family-profile__links { display: flex; flex-wrap: wrap; gap: 12px 24px; font-size: .875rem; }
.family-profile__links a { color: #5346e5; font-weight: 600; }
@media (max-width: 600px) { .family-profile__form .button { flex: 0 0 auto; } .workspace-heading__icon { width: 38px; height: 38px; flex-basis: 38px; border-radius: 12px; } }

.coach-tip-card {
    padding: 1.75rem 2rem;
    border: 1px solid #d6e1f5;
    border-left: 4px solid var(--blue-600);
    border-radius: 1.4rem;
    background: linear-gradient(115deg, #edf4ff, #f7faff 65%, #fff);
    box-shadow: 0 8px 24px #12335f08;
}

.coach-tip-card__header,
.birthday-card__header {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

.coach-tip-card__icon,
.birthday-card__icon {
    display: grid;
    flex: 0 0 2.75rem;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    border-radius: 0.9rem;
}

.coach-tip-card__icon {
    color: #fff;
    background: var(--navy-800);
}

.coach-tip-card__eyebrow {
    margin: 0 0 0.25rem;
    color: #315fa1;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.coach-tip-card__header h2,
.birthday-card__header h2 {
    margin: 0;
    font-size: 1.1rem;
    line-height: 1.4;
}

.coach-tip-card__message {
    margin: 1.25rem 0 0;
    overflow-wrap: anywhere;
}

.coach-tip-card__message + .coach-tip-card__message {
    padding-top: 1.25rem;
    border-top: 1px solid #d6e1f5;
}

.coach-tip-card__message blockquote {
    margin: 0;
    max-width: 52rem;
    color: var(--navy-900);
    font-size: clamp(1.15rem, 2vw, 1.55rem);
    font-weight: 650;
    line-height: 1.55;
    white-space: pre-wrap;
}

.coach-tip-card__message figcaption {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 1rem;
    margin-top: 1rem;
    font-size: 0.8rem;
    line-height: 1.5;
}

.coach-tip-card__message figcaption strong {
    color: var(--navy-800);
}

.coach-tip-card__message time {
    color: var(--slate-500);
}

.birthday-card {
    padding: 1.4rem 1.5rem;
    border: 1px solid #e9e1d6;
    border-radius: 1.4rem;
    background: linear-gradient(115deg, #fffbf4, #fff);
}

.birthday-card__icon {
    color: #9a6021;
    background: #f9ead3;
}

.birthday-card__heading {
    flex: 1;
    min-width: 0;
}

.birthday-card__heading p {
    margin: 0.25rem 0 0;
    color: var(--slate-500);
    font-size: 0.8rem;
    line-height: 1.5;
}

.birthday-card__date {
    flex-shrink: 0;
    color: #7e5b30;
    font-size: 0.75rem;
    font-weight: 650;
    white-space: nowrap;
}

.birthday-card__people {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
    gap: 0.65rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.birthday-card__people li {
    min-width: 0;
}

.birthday-person {
    display: flex;
    height: 100%;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem 1rem;
    border: 1px solid #eee6da;
    border-radius: 1rem;
    background: #fff;
}

.birthday-person--greeting:hover {
    border-color: #c6a97b;
    background: #fffdf8;
}

.birthday-person--greeting:focus-visible {
    outline: 3px solid var(--blue-600);
    outline-offset: 3px;
}

.birthday-person__avatar {
    display: grid;
    flex: 0 0 2.4rem;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border-radius: 50%;
    color: #7e5b30;
    background: #faf0de;
    font-size: 0.8rem;
    font-weight: 750;
}

.birthday-person__details {
    display: grid;
    min-width: 0;
    gap: 0.2rem;
    overflow-wrap: anywhere;
}

.birthday-person__details strong {
    font-size: 0.9rem;
    line-height: 1.4;
}

.birthday-person__details > span {
    color: var(--slate-500);
    font-size: 0.75rem;
}

.birthday-person__action {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.4rem;
    margin-left: auto;
    color: #86531d;
    font-size: 0.75rem;
    font-weight: 750;
}

@media (max-width: 640px) {
    .coach-tip-card,
    .birthday-card {
        padding: 1.25rem;
    }

    .birthday-card__header {
        flex-wrap: wrap;
    }

    .birthday-card__date {
        margin-left: 3.65rem;
    }

    .birthday-person {
        padding: 0.75rem;
    }
}

.field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="color"]),
.field select:not([multiple]):not([size]) {
    min-width: 0;
    min-height: var(--control-height);
    height: var(--control-height);
    line-height: 1.25;
}

.field select:not([multiple]):not([size]) {
    -webkit-appearance: none;
    appearance: none;
    padding-right: 2.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23667085' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.85rem center;
    background-size: 1rem;
}

@media (forced-colors: active) {
    .field select:not([multiple]):not([size]) {
        appearance: auto;
        background-image: none;
    }
}