:root {
    --rc-ink: #12213f;
    --rc-ink-soft: #53617a;
    --rc-surface: #ffffff;
    --rc-canvas: #f4f7fb;
    --rc-primary: #5b4dff;
    --rc-primary-readable: #3f36cf;
    --rc-primary-deep: #3f36cf;
    --rc-accent: #20c997;
    --rc-on-primary: #ffffff;
    --rc-on-accent: #12213f;
    --rc-warm: #ffb84d;
    --rc-border: #dfe6f1;
    --rc-shadow: 0 24px 70px rgba(18, 33, 63, 0.12);
    --rc-radius-sm: 12px;
    --rc-radius-md: 20px;
    --rc-radius-lg: 32px;
    --rc-max-width: 1180px;
}

* {
    box-sizing: border-box;
}

.rc-skip-link {
    position: fixed;
    z-index: 1000;
    top: 10px;
    left: 10px;
    padding: 10px 14px;
    border: 2px solid currentColor;
    border-radius: 10px;
    color: #fff;
    background: #12213f;
    font-weight: 800;
    text-decoration: none;
    transform: translateY(-160%);
}

.rc-skip-link:focus {
    transform: translateY(0);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid #0b66d6;
    outline-offset: 3px;
}

body.raisechamp-preview {
    margin: 0;
    min-height: 100vh;
    color: var(--rc-ink);
    background:
        radial-gradient(circle at 12% 8%, rgba(91, 77, 255, 0.16), transparent 30rem),
        radial-gradient(circle at 90% 18%, rgba(32, 201, 151, 0.13), transparent 27rem),
        var(--rc-canvas);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.5;
}

.rc-shell {
    width: min(calc(100% - 32px), var(--rc-max-width));
    margin-inline: auto;
}

.rc-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-block: 24px;
}

.rc-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--rc-ink);
    text-decoration: none;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.rc-brand-mark {
    display: block;
    overflow: hidden;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    box-shadow: 0 10px 25px rgba(91, 77, 255, 0.25);
}

.rc-brand-mark img {
    display: block;
    width: 100%;
    height: 100%;
}

.rc-brand small {
    display: block;
    color: var(--rc-ink-soft);
    font-size: 0.7rem;
    font-weight: 650;
    letter-spacing: 0.02em;
}

.rc-organization-brand {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
    color: var(--rc-ink);
}

.rc-organization-brand img {
    width: 52px;
    height: 52px;
    padding: 4px;
    border: 1px solid var(--rc-border);
    border-radius: 14px;
    background: #fff;
    object-fit: contain;
}

.rc-organization-brand span,
.rc-organization-brand small,
.rc-organization-brand strong {
    display: block;
}

.rc-organization-brand small {
    color: var(--rc-ink-soft);
    font-size: 0.65rem;
    font-weight: 650;
}

.rc-organization-brand strong {
    overflow: hidden;
    max-width: 220px;
    font-size: 0.82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rc-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 20px;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--rc-on-primary);
    background: var(--rc-primary);
    box-shadow: 0 10px 25px rgba(91, 77, 255, 0.22);
    font: inherit;
    font-weight: 750;
    text-decoration: none;
}

.rc-button--quiet {
    color: var(--rc-ink);
    background: rgba(255, 255, 255, 0.82);
    border-color: var(--rc-border);
    box-shadow: none;
}

.rc-button--danger {
    color: #fff;
    background: #dc3545;
    box-shadow: 0 10px 25px rgba(220, 53, 69, 0.22);
}

.rc-button--small {
    min-height: 34px;
    padding: 0 14px;
    font-size: 0.82rem;
    box-shadow: none;
}

.rc-status--info {
    color: #19204f;
    background: rgba(47, 128, 237, 0.12);
}

.rc-button:disabled,
.rc-copy-button:disabled,
button:disabled {
    cursor: not-allowed;
    opacity: 0.58;
    box-shadow: none;
}

.rc-manager-preview-bar {
    position: relative;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 13px max(16px, calc((100vw - var(--rc-max-width)) / 2));
    color: #fff;
    background: #12213f;
    box-shadow: 0 10px 30px rgba(18, 33, 63, 0.18);
}

.rc-manager-preview-bar > div,
.rc-manager-preview-bar nav {
    display: flex;
    align-items: center;
    gap: 12px;
}

.rc-manager-preview-bar small {
    color: rgba(255, 255, 255, 0.68);
}

.rc-manager-preview-bar__badge {
    padding: 5px 9px;
    border-radius: 999px;
    color: #12213f;
    background: #ffcf70;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.rc-manager-preview-bar nav a {
    padding: 7px 10px;
    border-radius: 9px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.85rem;
    font-weight: 750;
    text-decoration: none;
}

.rc-manager-preview-bar nav a:hover,
.rc-manager-preview-bar nav a.is-active {
    color: #fff;
    background: rgba(255, 255, 255, 0.13);
}

.rc-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
    align-items: center;
    gap: clamp(36px, 7vw, 90px);
    padding: clamp(54px, 8vw, 100px) 0 70px;
}

.rc-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid rgba(91, 77, 255, 0.18);
    border-radius: 999px;
    color: var(--rc-primary-deep);
    background: rgba(255, 255, 255, 0.8);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.rc-kicker::before {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rc-accent);
    content: "";
}

.rc-hero h1 {
    max-width: 720px;
    margin: 22px 0 20px;
    font-size: clamp(3rem, 7vw, 6rem);
    line-height: 0.96;
    letter-spacing: -0.065em;
}

.rc-hero h1 span {
    color: var(--rc-primary-readable);
}

.rc-hero-copy {
    max-width: 640px;
    margin: 0;
    color: var(--rc-ink-soft);
    font-size: clamp(1.05rem, 2vw, 1.25rem);
}

.rc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.rc-campaign-card {
    position: relative;
    overflow: hidden;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: var(--rc-radius-lg);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: var(--rc-shadow);
    backdrop-filter: blur(16px);
}

.rc-campaign-card::before {
    position: absolute;
    inset: 0 0 auto;
    height: 8px;
    background: linear-gradient(90deg, var(--rc-primary), var(--rc-accent), var(--rc-warm));
    content: "";
}

.rc-school-row,
.rc-support-row,
.rc-stat-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.rc-school-logo {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    color: #fff;
    background: var(--rc-ink);
    font-weight: 850;
}

.rc-school-copy {
    flex: 1;
}

.rc-school-copy strong,
.rc-school-copy span {
    display: block;
}

.rc-school-copy span,
.rc-label {
    color: var(--rc-ink-soft);
    font-size: 0.82rem;
}

.rc-live {
    padding: 6px 10px;
    border-radius: 999px;
    color: #087a5b;
    background: rgba(32, 201, 151, 0.13);
    font-size: 0.75rem;
    font-weight: 850;
}

.rc-campaign-card h2 {
    margin: 28px 0 8px;
    font-size: clamp(1.7rem, 4vw, 2.35rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.rc-progress {
    overflow: hidden;
    height: 12px;
    margin: 24px 0 10px;
    border-radius: 999px;
    background: #e9edf4;
}

.rc-progress span {
    display: block;
    width: 68%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--rc-primary), #8b7fff);
}

.rc-stat-row strong {
    font-size: 1.45rem;
    letter-spacing: -0.03em;
}

.rc-support-row {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--rc-border);
}

.rc-avatar-stack {
    display: flex;
}

.rc-avatar {
    display: grid;
    width: 34px;
    height: 34px;
    margin-left: -8px;
    place-items: center;
    border: 3px solid #fff;
    border-radius: 50%;
    color: var(--rc-on-primary);
    background: var(--rc-primary);
    font-size: 0.68rem;
    font-weight: 800;
}

.rc-avatar:first-child {
    margin-left: 0;
    color: #fff;
    background: var(--rc-ink);
}

.rc-avatar:last-child {
    color: var(--rc-on-accent);
    background: var(--rc-accent);
}

.rc-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    padding-bottom: 80px;
}

.rc-feature {
    padding: 24px;
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    background: rgba(255, 255, 255, 0.72);
}

.rc-feature-icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.11);
    font-weight: 900;
}

.rc-feature h3 {
    margin: 18px 0 6px;
    font-size: 1.08rem;
}

.rc-feature p {
    margin: 0;
    color: var(--rc-ink-soft);
    font-size: 0.94rem;
}

@media (max-width: 820px) {
    .rc-hero {
        grid-template-columns: 1fr;
        padding-top: 42px;
    }

    .rc-feature-grid {
        grid-template-columns: 1fr;
    }
}

/* Campaign catalog manager */
.rc-native-product-cards {
    display: grid;
    gap: 14px;
}

.rc-native-product-card {
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    background: var(--rc-surface);
    box-shadow: 0 18px 45px rgba(18, 33, 63, 0.07);
    overflow: hidden;
}

.rc-native-product-card.is-inactive {
    opacity: 0.62;
}

.rc-native-product-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--rc-border);
    background: var(--rc-canvas);
}

.rc-native-product-card__head h3 {
    margin: 0;
    font-size: 1.05rem;
}

.rc-native-product-card__head small {
    display: block;
    color: var(--rc-muted);
    font-size: 0.78rem;
}

.rc-native-product-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.rc-native-product-card__body {
    display: grid;
    gap: 10px;
    padding: 14px 18px;
}

.rc-native-product-edit summary {
    color: var(--rc-primary-deep);
    cursor: pointer;
    font-weight: 800;
}

.rc-native-product-edit form {
    margin-top: 10px;
    padding: 14px;
    border: 1px solid var(--rc-border);
    border-radius: 12px;
    background: var(--rc-canvas);
}

/* School dashboard and ledger */
.rc-dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.rc-metric-card,
.rc-dashboard-panel {
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    background: #fff;
    box-shadow: 0 16px 40px rgba(18, 33, 63, 0.07);
}

.rc-metric-card {
    display: grid;
    gap: 6px;
    padding: 22px;
}

.rc-metric-card > span,
.rc-metric-card small {
    color: var(--rc-ink-soft);
}

.rc-metric-card > strong {
    font-size: clamp(1.7rem, 3vw, 2.5rem);
    letter-spacing: -0.05em;
}

.rc-metric-card--primary {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--rc-primary), var(--rc-primary-deep));
}

.rc-metric-card--primary > span,
.rc-metric-card--primary small {
    color: rgba(255, 255, 255, 0.76);
}

.rc-dashboard-panel {
    padding: 26px;
}

.rc-dashboard-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.rc-settlement-card {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(290px, 0.6fr);
    align-items: center;
    gap: 36px;
    margin-bottom: 24px;
    padding: 28px;
    border: 1px solid rgba(32, 201, 151, 0.25);
    border-radius: var(--rc-radius-md);
    background: linear-gradient(135deg, rgba(32, 201, 151, 0.1), rgba(255, 255, 255, 0.9));
}

.rc-settlement-card h2,
.rc-adjustment-panel h2 {
    margin: 14px 0 7px;
    font-size: clamp(1.6rem, 3vw, 2.5rem);
    letter-spacing: -0.045em;
}

.rc-settlement-card p,
.rc-adjustment-panel p {
    color: var(--rc-ink-soft);
}

.rc-account-status {
    display: grid;
    gap: 8px;
    padding: 20px;
    border: 1px solid var(--rc-border);
    border-radius: 16px;
    background: #fff;
}

.rc-account-status .rc-status {
    justify-self: start;
}

.rc-account-status small {
    color: var(--rc-ink-soft);
}

.rc-settlement-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
}

.rc-settlement-flow > article {
    display: grid;
    gap: 5px;
    padding: 19px;
    border: 1px solid var(--rc-border);
    border-radius: 16px;
    background: #fff;
}

.rc-settlement-flow > article span,
.rc-settlement-flow > article small {
    color: var(--rc-ink-soft);
}

.rc-settlement-flow > article span {
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
}

.rc-settlement-flow > article strong {
    font-size: 1.7rem;
    letter-spacing: -0.045em;
}

.rc-settlement-flow > span {
    color: var(--rc-primary-readable);
    font-size: 1.5rem;
    font-weight: 900;
}

.rc-adjustment-panel {
    display: grid;
    grid-template-columns: minmax(260px, 0.65fr) minmax(0, 1.35fr);
    gap: 36px;
    margin-top: 20px;
}

.rc-money-flow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--rc-border);
    border-radius: 16px;
    background: var(--rc-border);
}

.rc-money-flow > div {
    display: grid;
    gap: 6px;
    padding: 18px;
    background: #fff;
}

.rc-money-flow span {
    color: var(--rc-ink-soft);
    font-size: 0.78rem;
}

.rc-money-flow strong {
    font-size: 1.3rem;
}

.rc-money-flow__total {
    color: #fff;
    background: var(--rc-ink) !important;
}

.rc-money-flow__total span {
    color: rgba(255, 255, 255, 0.68);
}

.rc-finance-note {
    margin: 18px 0 0;
    color: var(--rc-ink-soft);
    font-size: 0.82rem;
}

.rc-balance-row,
.rc-ledger-list > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 13px 0;
    border-top: 1px solid var(--rc-border);
}

.rc-balance-row span strong,
.rc-balance-row span small,
.rc-ledger-list span strong,
.rc-ledger-list span small {
    display: block;
}

.rc-balance-row small,
.rc-ledger-list small {
    color: var(--rc-ink-soft);
}

.rc-ledger-amount {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rc-ledger-reversal {
    align-items: center;
    display: flex;
    gap: 8px;
}

.rc-ledger-reversal input {
    max-width: 190px;
    min-height: 38px;
}

.rc-ledger-reversal .rc-button {
    min-height: 38px;
    padding: 7px 12px;
}

.rc-positive { color: #087a5b; }
.rc-negative { color: #b42318; }

/* Public RaiseChamp storefront */
.rc-storefront {
    padding-bottom: 90px;
}

.rc-storefront-heading {
    max-width: 900px;
    padding: clamp(46px, 8vw, 92px) 0 52px;
}

.rc-storefront-heading .rc-back-link {
    display: block;
    margin-bottom: 24px;
}

.rc-storefront-heading h1 {
    margin: 18px 0;
    font-size: clamp(3.2rem, 8vw, 7rem);
    line-height: 0.9;
    letter-spacing: -0.075em;
}

.rc-storefront-heading h1 span {
    color: var(--rc-primary-readable);
}

.rc-storefront-heading p {
    max-width: 680px;
    color: var(--rc-ink-soft);
    font-size: clamp(1rem, 2vw, 1.2rem);
}

.rc-distribution-card {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
    gap: 24px;
    margin: 0 0 30px;
    padding: 22px;
    border: 1px solid rgba(91, 77, 255, 0.18);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(91, 77, 255, 0.08), rgba(32, 201, 151, 0.08));
}

.rc-distribution-card h2,
.rc-distribution-card p {
    margin: 5px 0 0;
}

.rc-distribution-card p,
.rc-distribution-card small {
    color: var(--rc-ink-soft);
}

.rc-distribution-card a {
    color: var(--rc-primary-deep);
    font-weight: 800;
}

@media (max-width: 640px) {
    .rc-distribution-card {
        grid-template-columns: 1fr;
    }
}

.rc-store-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.rc-store-product {
    overflow: hidden;
    border: 1px solid var(--rc-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(18, 33, 63, 0.08);
}

.rc-store-product__image {
    display: grid;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, var(--rc-primary), var(--rc-accent));
    font-size: 3rem;
    font-weight: 900;
}

.rc-store-product__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rc-store-product__body {
    padding: 22px;
}

.rc-store-product h2 {
    margin: 8px 0;
    font-size: 1.35rem;
    letter-spacing: -0.035em;
}

.rc-store-product p {
    min-height: 48px;
    color: var(--rc-ink-soft);
    font-size: 0.9rem;
}

.rc-product-safety {
    display: grid;
    gap: 8px;
    margin-top: 14px;
    padding: 14px;
    border: 1px solid #f1d8a8;
    border-radius: 14px;
    background: #fff9ed;
}

.rc-product-safety p {
    min-height: 0;
    margin: 0;
    color: var(--rc-ink);
}

.rc-product-safety p strong {
    display: block;
    margin-bottom: 2px;
}

.rc-product-safety small {
    color: var(--rc-ink-soft);
    line-height: 1.45;
}

.rc-store-product__buy {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-top: 22px;
}

.rc-store-product__buy > strong {
    font-size: 1.35rem;
}

.rc-store-product__buy label {
    display: grid;
    gap: 4px;
    color: var(--rc-ink-soft);
    font-size: 0.72rem;
    font-weight: 800;
}

.rc-store-product__buy select {
    min-width: 76px;
    padding: 9px;
    border: 1px solid #cfd8e6;
    border-radius: 10px;
    background: #fff;
    font: inherit;
}

.rc-product-add {
    white-space: nowrap;
}

.rc-cart-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
    padding: 18px 20px;
    border: 1px solid var(--rc-border, #dfe4ef);
    border-radius: 18px;
    background: var(--rc-surface, #fff);
}

.rc-cart-summary div {
    display: grid;
    gap: 4px;
}

.rc-cart-summary strong {
    font-size: 1.55rem;
}

.rc-cart-summary > span {
    color: var(--rc-muted, #53617a);
}

.rc-store-submit {
    display: flex;
    justify-content: flex-end;
    padding: 26px 0;
}

.rc-donation-panel {
    display: grid;
    grid-template-columns: 1fr minmax(300px, 0.75fr);
    gap: clamp(28px, 7vw, 80px);
    margin-top: 42px;
    padding: clamp(28px, 5vw, 52px);
    border-radius: var(--rc-radius-lg);
    color: #fff;
    background: var(--rc-ink);
}

.rc-donation-panel h2 {
    margin: 16px 0 8px;
    font-size: clamp(2.2rem, 5vw, 4rem);
    line-height: 1;
    letter-spacing: -0.055em;
}

.rc-donation-panel p,
.rc-donation-panel .rc-field {
    color: rgba(255, 255, 255, 0.72);
}

.rc-donation-panel form {
    display: grid;
    gap: 16px;
}

.rc-donation-presets {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.rc-donation-presets button {
    padding: 10px 6px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

/* Packing center */
.rc-packing-status {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto auto;
    align-items: end;
    gap: 28px;
    margin-bottom: 34px;
    padding: 22px;
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    background: #fff;
}

.rc-packing-status > div strong {
    font-size: 2rem;
    letter-spacing: -0.04em;
}

.rc-packing-section {
    margin-top: 42px;
}

.rc-notification-card {
    margin-bottom: 28px;
}

.rc-notification-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0;
}

.rc-notification-stats > div {
    padding: 14px;
    border: 1px solid var(--rc-border);
    border-radius: 14px;
    background: #fff;
}

.rc-notification-stats strong,
.rc-notification-stats span {
    display: block;
}

.rc-notification-stats strong {
    font-size: 1.35rem;
}

.rc-notification-stats span {
    color: var(--rc-ink-soft);
    font-size: 0.78rem;
    font-weight: 750;
}

@media (max-width: 640px) {
    .rc-notification-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.rc-packing-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.rc-packing-grid ul {
    margin: 18px 0 0;
    padding-left: 18px;
    color: var(--rc-ink-soft);
}

@media (max-width: 900px) {
    .rc-store-grid,
    .rc-packing-grid,
    .rc-dashboard-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rc-money-flow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .rc-store-grid,
    .rc-donation-panel,
    .rc-packing-grid,
    .rc-packing-status,
    .rc-dashboard-metrics,
    .rc-dashboard-columns,
    .rc-money-flow,
    .rc-settlement-card,
    .rc-adjustment-panel {
        grid-template-columns: 1fr;
    }

    .rc-settlement-flow {
        grid-template-columns: 1fr;
    }

    .rc-settlement-flow > span {
        justify-self: center;
        transform: rotate(90deg);
    }
}

/* Roster manager */
.rc-roster-tools {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.rc-roster-tools .rc-form-card {
    margin: 0;
}

.rc-upload-form {
    display: grid;
    gap: 18px;
}

.rc-roster-add,
.rc-roster-section {
    margin-top: 24px;
}

/* Compound selector (not just .rc-form-grid--three) so this reliably beats .rc-form-grid's own
   2-column rule regardless of which is declared later in the file — equal-specificity,
   single-class selectors would otherwise let source order flip the winner. Pre-existing bug
   found while reskinning the payout drill-down report, see
   _Docs/NIGHTMANAGER_RC_RESKIN_PLAN.md. */
.rc-form-grid.rc-form-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Participant roster: one card per athlete rather than an 8-column table. Every group below
   carries several stacked controls plus expanding <details> forms, which a table cell cannot give
   room to without forcing horizontal scrolling on the whole row. */
.rc-roster-cards {
    display: grid;
    gap: 14px;
}

.rc-roster-card {
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    background: var(--rc-surface);
    box-shadow: 0 18px 45px rgba(18, 33, 63, 0.07);
    overflow: hidden;
}

.rc-roster-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--rc-border);
    background: var(--rc-canvas);
}

.rc-roster-card__head h3 {
    margin: 0;
    font-size: 1.05rem;
}

.rc-roster-card__head small {
    display: block;
    color: var(--rc-muted);
    font-size: 0.78rem;
}

.rc-roster-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* The track floor is deliberately low enough that all five groups fit one row at a normal desktop
   width. That is what stops an expanding form from moving anything: same-row siblings grow taller
   together, so none of them changes x, y, or width. A wider floor pushed the fifth group onto a
   second row, which then slid down whenever a form opened above it. min() keeps a single track from
   overflowing a narrow viewport, where wrapping (and therefore some downward shift) is unavoidable. */
.rc-roster-card__groups {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
    gap: 1px;
    background: var(--rc-border);
    align-items: stretch;
}

.rc-roster-card__group {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
    padding: 14px 18px;
    background: var(--rc-surface);
}

.rc-roster-card__group h4 {
    margin: 0;
    color: var(--rc-muted);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rc-roster-card__group form {
    margin: 0;
}

/* Opening a form must NOT move its group. An earlier attempt gave the group `grid-column: 1 / -1`
   to win the full card width, but a grid item cannot span every column while staying in place --
   the grid reflowed it onto a row of its own, so the group visibly jumped as you clicked. The
   tracks are wide enough (see minmax above) for the form to simply grow downward in place instead,
   which keeps every other group exactly where it was. */
.rc-roster-card__group .rc-contact-add,
.rc-roster-card__group .rc-contact-add form {
    width: 100%;
}

.rc-roster-card__group .rc-contact-add form {
    box-sizing: border-box;
}

.rc-roster-card__group > small {
    color: var(--rc-muted);
    font-size: 0.78rem;
}

.rc-roster-card__group .rc-contact-chip {
    width: 100%;
}

.rc-roster-card__group .rc-link-actions {
    flex-wrap: wrap;
    gap: 12px;
}

.rc-roster-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    background: var(--rc-surface);
    box-shadow: 0 18px 45px rgba(18, 33, 63, 0.07);
}

.rc-roster-table {
    width: 100%;
    min-width: 1040px;
    border-collapse: collapse;
}

.rc-team-link-table {
    min-width: 640px;
}

.rc-roster-table th,
.rc-roster-table td {
    padding: 16px 18px;
    border-bottom: 1px solid var(--rc-border);
    text-align: left;
    vertical-align: middle;
}

.rc-roster-table th {
    color: var(--rc-ink-soft);
    background: #f8faff;
    font-size: 0.74rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

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

.rc-roster-table td strong,
.rc-roster-table td small {
    display: block;
}

.rc-roster-table td small {
    margin-top: 2px;
    color: var(--rc-ink-soft);
}

.rc-link-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.rc-link-actions a,
.rc-copy-button {
    border: 0;
    color: var(--rc-primary-deep);
    background: none;
    font: inherit;
    font-size: 0.84rem;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.rc-secret-link {
    display: grid;
    min-width: 260px;
    gap: 7px;
    padding: 12px;
    border: 1px solid rgba(32, 201, 151, 0.45);
    border-radius: 12px;
    background: rgba(32, 201, 151, 0.08);
}

.rc-secret-link input {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid var(--rc-border);
    border-radius: 8px;
    background: #fff;
    color: var(--rc-ink-soft);
    font: inherit;
    font-size: 0.72rem;
}

.rc-text-link--danger {
    border: 0;
    padding: 0;
    color: #b42318;
    background: transparent;
    cursor: pointer;
}

/* Participant fundraising page */
.rc-participant-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(330px, 0.78fr);
    align-items: center;
    gap: clamp(40px, 9vw, 110px);
    padding: clamp(48px, 8vw, 95px) 0 70px;
}

.rc-participant-copy .rc-back-link {
    display: block;
    margin-bottom: 24px;
}

.rc-participant-copy h1 {
    margin: 18px 0;
    font-size: clamp(3.5rem, 8vw, 7rem);
    line-height: 0.88;
    letter-spacing: -0.075em;
}

.rc-participant-copy h1 span {
    color: var(--rc-primary-readable);
}

.rc-participant-copy > p:not(.rc-team-pill) {
    max-width: 650px;
    color: var(--rc-ink-soft);
    font-size: clamp(1rem, 2vw, 1.2rem);
}

.rc-team-pill {
    display: inline-flex;
    padding: 8px 12px;
    border-radius: 999px;
    color: #087a5b;
    background: rgba(32, 201, 151, 0.13);
    font-size: 0.82rem;
    font-weight: 800;
}

.rc-participant-card {
    padding-top: 38px;
}

.rc-share-panel {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 40px;
    margin-bottom: 90px;
    padding: clamp(28px, 5vw, 52px);
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-lg);
    background: rgba(255, 255, 255, 0.78);
}

.rc-share-panel h2 {
    max-width: 680px;
    margin: 16px 0 8px;
    font-size: clamp(2rem, 5vw, 4rem);
    line-height: 1;
    letter-spacing: -0.055em;
}

.rc-share-panel p {
    color: var(--rc-ink-soft);
}

.rc-share-kit {
    align-items: start;
}

.rc-share-templates {
    display: grid;
    gap: 10px;
    margin: 24px 0 8px;
}

.rc-share-templates article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 16px;
    align-items: center;
    padding: 14px;
    border: 1px solid var(--rc-border);
    border-radius: 16px;
    background: #fff;
}

.rc-share-templates article > .rc-label,
.rc-share-templates article > p {
    grid-column: 1;
}

.rc-share-templates article > p {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.5;
}

.rc-share-templates .rc-copy-button {
    grid-column: 2;
    grid-row: 1 / span 2;
}

.rc-share-note {
    max-width: 720px;
    margin: 14px 0 0;
    font-size: 0.78rem;
}

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

.rc-qr-code {
    display: grid;
    place-items: center;
    min-width: 220px;
    padding: 18px;
    border: 1px solid var(--rc-border);
    border-radius: 22px;
    background: #fff;
    color: var(--rc-ink-soft);
    font-size: 0.78rem;
    font-weight: 750;
}

.rc-qr-code svg {
    max-width: 190px;
    height: auto;
}

@media (max-width: 820px) {
    .rc-roster-tools,
    .rc-form-grid.rc-form-grid--three,
    .rc-participant-hero,
    .rc-share-panel {
        grid-template-columns: 1fr;
    }

    .rc-contact-row__fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rc-qr-code {
        justify-self: start;
    }
}

@media (max-width: 520px) {
    .rc-contact-row {
        flex-direction: column;
        align-items: stretch;
    }

    .rc-contact-row__fields {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .rc-header .rc-button {
        min-height: 40px;
        padding-inline: 14px;
        font-size: 0.88rem;
    }

    .rc-hero h1 {
        font-size: 3.5rem;
    }

    .rc-campaign-card {
        padding: 22px;
        border-radius: 25px;
    }

    .rc-share-templates article {
        grid-template-columns: 1fr;
    }

    .rc-share-templates .rc-copy-button {
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
    }
}

/* Manager portal */
.rc-manager-body {
    background: var(--rc-canvas);
}

.rc-manager-header {
    position: sticky;
    top: 0;
    z-index: 20;
    border-bottom: 1px solid rgba(223, 230, 241, 0.9);
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(18px);
}

.rc-manager-header__inner {
    display: flex;
    flex-wrap: wrap;
    min-height: 76px;
    align-items: center;
    gap: 8px 24px;
    padding-block: 12px;
}

.rc-manager-header__inner .rc-brand {
    flex-shrink: 0;
}

.rc-manager-account {
    flex-shrink: 0;
    margin-left: auto;
}

.rc-manager-nav {
    display: flex;
    order: 3;
    flex-basis: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

@media (min-width: 821px) {
    .rc-manager-nav {
        border-top: 1px solid var(--rc-border);
        padding-top: 10px;
    }
}

.rc-manager-nav a {
    padding: 10px 14px;
    border-radius: 999px;
    color: var(--rc-ink-soft);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}

.rc-manager-nav a:hover,
.rc-manager-nav a.active {
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.09);
}

.rc-manager-account {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}

.rc-manager-account__identity {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.25;
    max-width: 220px;
}

.rc-manager-account__email {
    color: var(--rc-ink);
    font-size: 0.85rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.rc-manager-account__role {
    color: var(--rc-ink-soft);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.rc-manager-account__logout {
    padding: 8px 16px;
    border-radius: 999px;
    border: 1px solid var(--rc-border);
    color: var(--rc-ink-soft);
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.rc-manager-account__logout:hover {
    color: var(--rc-primary-deep);
    border-color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.09);
}

.rc-manager-main {
    padding-block: 50px 90px;
}

.rc-manager-layout {
    display: flex;
    align-items: flex-start;
}

.rc-manager-main {
    flex: 1 1 auto;
    min-width: 0;
}

/* .rc-shell's own centering (width + margin-inline: auto) is a no-op here: as the only
   flex-grow item in .rc-manager-layout, .rc-manager-main always stretches to fill the space
   left over by the sidebar regardless of that computed width, so content sits flush against
   both the sidebar border and the viewport edge. Real padding is what actually reserves a
   gutter on a flex-grow item. */
.rc-manager-main.rc-shell {
    padding-inline: 32px;
}

.rc-manager-sidebar {
    flex: 0 0 264px;
    border-right: 1px solid var(--rc-border);
    background: var(--rc-surface);
}

.rc-manager-sidebar:not([open]) {
    flex: 0 0 auto;
}

.rc-manager-sidebar__toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 20px;
    color: var(--rc-ink);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.rc-manager-sidebar__toggle::-webkit-details-marker {
    display: none;
}

.rc-manager-sidebar__toggle::before {
    content: "\2630";
    color: var(--rc-primary);
}

.rc-manager-sidebar__toggle:hover {
    color: var(--rc-primary-deep);
}

.rc-manager-sidebar__body {
    padding: 0 12px 24px;
}

.rc-manager-sidebar__group {
    margin-top: 18px;
}

.rc-manager-sidebar__group-title {
    padding: 0 10px;
    margin-bottom: 6px;
    color: var(--rc-ink-soft);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.rc-manager-sidebar__list {
    display: grid;
    gap: 2px;
}

.rc-manager-sidebar__link {
    display: block;
    padding: 9px 10px;
    border-radius: 10px;
    color: var(--rc-ink-soft);
    font-size: 0.88rem;
    font-weight: 650;
    text-decoration: none;
}

.rc-manager-sidebar__link:hover {
    color: var(--rc-ink);
    background: rgba(91, 77, 255, 0.07);
}

.rc-manager-sidebar__link.active {
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.12);
}

@media (max-width: 900px) {
    .rc-manager-layout {
        flex-direction: column;
    }

    .rc-manager-sidebar {
        flex-basis: auto;
        width: 100%;
        border-right: none;
        border-bottom: 1px solid var(--rc-border);
    }

    /* Sidebar stacks above main here instead of sitting beside it, so the wider gutter above
       is no longer needed -- a narrower one still keeps content off the viewport edge. */
    .rc-manager-main.rc-shell {
        padding-inline: 16px;
    }
}

.rc-page-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 34px;
}

/* Flex items shrink by default. The heading text (h1 here scales up to 4.3rem)
   has no fixed width, so on a moderately wide but not huge viewport it claims
   most of the row and squeezes the button below its own content width — the
   button was already correctly right-aligned, it just had no room left to fit
   "Create campaign" on one line, so it visibly wrapped and looked cramped/
   misplaced instead of like a clean, separate action. Let the heading text wrap
   (which reads as normal body copy) instead of the button (which doesn't). */
.rc-page-heading > .rc-button,
.rc-page-heading > .rc-actions,
.rc-publish-card > .rc-button,
.rc-publish-card > .rc-actions {
    flex-shrink: 0;
}

.rc-page-heading--compact {
    align-items: center;
}

.rc-page-heading h1 {
    margin: 15px 0 6px;
    font-size: clamp(2.35rem, 5vw, 4.3rem);
    line-height: 1;
    letter-spacing: -0.055em;
}

.rc-page-heading p,
.rc-form-card__heading p,
.rc-publish-card p {
    margin: 0;
    color: var(--rc-ink-soft);
}

/* Per-campaign sub-nav: a link back to the campaign list plus Settings/Catalog/Roster/
   Fulfillment/Dashboard, included on every page scoped to one campaign so a manager can
   jump directly between them instead of routing back through the campaign settings hub
   every time. */
.rc-campaign-subnav-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin: -14px 0 28px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--rc-border);
}

.rc-campaign-subnav-row > .rc-back-link {
    flex-shrink: 0;
}

.rc-campaign-subnav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.rc-campaign-subnav a {
    padding: 8px 14px;
    border-radius: 999px;
    color: var(--rc-ink-soft);
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.rc-campaign-subnav a:hover,
.rc-campaign-subnav a.active {
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.09);
}

.rc-back-link,
.rc-text-link {
    color: var(--rc-primary-deep);
    font-weight: 750;
    text-decoration: none;
}

.rc-alert {
    margin-bottom: 24px;
    padding: 16px 18px;
    border: 1px solid;
    border-radius: var(--rc-radius-sm);
}

.rc-alert ul {
    margin-bottom: 0;
}

.rc-alert--success {
    color: #086149;
    border-color: rgba(32, 201, 151, 0.35);
    background: rgba(32, 201, 151, 0.1);
}

.rc-alert--error {
    color: #9d2030;
    border-color: rgba(220, 53, 69, 0.3);
    background: rgba(220, 53, 69, 0.08);
}

.rc-alert--info {
    color: #19204f;
    border-color: rgba(47, 128, 237, 0.3);
    background: rgba(47, 128, 237, 0.08);
}

.rc-alert--warning {
    color: #83520a;
    border-color: rgba(255, 184, 77, 0.4);
    background: rgba(255, 184, 77, 0.14);
}

.rc-empty-state {
    padding: clamp(42px, 8vw, 84px) 24px;
    border: 1px dashed #cbd4e3;
    border-radius: var(--rc-radius-lg);
    background: rgba(255, 255, 255, 0.55);
    text-align: center;
}

.rc-empty-state__icon {
    display: grid;
    width: 58px;
    height: 58px;
    margin: auto;
    place-items: center;
    border-radius: 20px;
    color: var(--rc-on-primary);
    background: var(--rc-primary);
    font-size: 1.5rem;
    font-weight: 900;
}

.rc-empty-state h2 {
    margin: 22px 0 8px;
    font-size: 1.7rem;
}

.rc-empty-state p {
    max-width: 540px;
    margin: 0 auto 24px;
    color: var(--rc-ink-soft);
}

.rc-campaign-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.rc-manager-card,
.rc-form-card,
.rc-publish-card,
.rc-leaderboard-card {
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    background: var(--rc-surface);
    box-shadow: 0 16px 45px rgba(18, 33, 63, 0.06);
}

.rc-manager-card__organization {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.rc-manager-card__organization img {
    width: 44px;
    height: 44px;
    padding: 4px;
    border: 1px solid var(--rc-border);
    border-radius: 12px;
    background: #fff;
    object-fit: contain;
}

.rc-manager-card__organization small,
.rc-manager-card__organization strong {
    display: block;
}

.rc-manager-card__organization small {
    color: var(--rc-ink-soft);
    font-size: 0.64rem;
    font-weight: 650;
    text-transform: uppercase;
}

.rc-manager-card__organization strong {
    font-size: 0.86rem;
}

.rc-manager-card {
    overflow: hidden;
    padding: 26px;
}

.rc-manager-card__hero {
    width: calc(100% + 52px);
    height: 170px;
    margin: -26px -26px 24px;
    object-fit: cover;
}

.rc-manager-card__topline,
.rc-form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

/* Unlike .rc-form-actions (always exactly two buttons, space-between reads fine),
   a campaign card can show up to six links (Dashboard, Campaign, Participants &
   contacts, Catalog, Packing, Private preview, View live page) depending on
   permissions and status. With no wrap, and .rc-manager-card's overflow:hidden
   (needed to crop the hero image), anything past the card's width was silently
   clipped instead of wrapping — never visible, not even on hover. */
.rc-card-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 16px;
}

.rc-manager-card h2 {
    margin: 28px 0 8px;
    font-size: 1.45rem;
    letter-spacing: -0.035em;
}

.rc-manager-card > p {
    min-height: 48px;
    color: var(--rc-ink-soft);
}

.rc-status {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    color: #5a6578;
    background: #edf1f6;
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.rc-status--active {
    color: #087a5b;
    background: rgba(32, 201, 151, 0.12);
}

.rc-status--scheduled {
    color: #83520a;
    background: rgba(255, 184, 77, 0.18);
}

.rc-status--closed {
    color: #8a4b12;
    background: rgba(255, 184, 77, 0.18);
}

.rc-status--archived {
    color: #596579;
    background: #e5eaf1;
}

.rc-status--success {
    color: #087a5b;
    background: rgba(32, 201, 151, 0.12);
}

.rc-status--warning {
    color: #83520a;
    background: rgba(255, 184, 77, 0.18);
}

.rc-status--danger {
    color: #9d2030;
    background: rgba(220, 53, 69, 0.12);
}

.rc-status--neutral {
    color: #596579;
    background: #e5eaf1;
}

.rc-mini-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 22px 0;
}

.rc-mini-stats span {
    padding: 7px 10px;
    border-radius: 9px;
    color: var(--rc-ink-soft);
    background: var(--rc-canvas);
    font-size: 0.78rem;
}

.rc-mini-stats strong {
    color: var(--rc-ink);
}

.rc-form-layout {
    display: grid;
    gap: 20px;
}

.rc-form-card {
    padding: clamp(24px, 4vw, 36px);
}

.rc-form-card__heading {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 28px;
}

.rc-form-card__heading > span {
    display: grid;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 14px;
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.1);
    font-size: 0.78rem;
    font-weight: 900;
}

.rc-form-card__heading h2 {
    margin: 0 0 3px;
    font-size: 1.2rem;
}

.rc-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.rc-field {
    display: grid;
    align-content: start;
    gap: 8px;
    color: var(--rc-ink);
    font-size: 0.88rem;
    font-weight: 750;
}

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

.rc-field input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.rc-field textarea,
.rc-field select {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid #cfd8e6;
    border-radius: 12px;
    outline: none;
    color: var(--rc-ink);
    background: #fff;
    font: inherit;
    font-weight: 500;
}

.rc-field textarea {
    resize: vertical;
}

.rc-field input:focus,
.rc-field textarea:focus,
.rc-field select:focus {
    border-color: var(--rc-primary);
    box-shadow: 0 0 0 4px rgba(91, 77, 255, 0.11);
}

.rc-field small,
.rc-toggle small {
    display: block;
    color: var(--rc-ink-soft);
    font-size: 0.76rem;
    font-weight: 500;
}

.rc-input-prefix {
    display: flex;
    align-items: stretch;
}

.rc-input-prefix > span {
    display: flex;
    align-items: center;
    padding-inline: 13px;
    border: 1px solid #cfd8e6;
    border-right: 0;
    border-radius: 12px 0 0 12px;
    color: var(--rc-ink-soft);
    background: var(--rc-canvas);
    font-weight: 600;
}

.rc-input-prefix input {
    border-radius: 0 12px 12px 0;
}

.rc-toggle {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--rc-border);
    border-radius: 14px;
    cursor: pointer;
}

.rc-toggle input {
    width: 20px;
    height: 20px;
    accent-color: var(--rc-primary);
}

.rc-contact-list {
    display: grid;
    grid-column: 1 / -1;
    gap: 16px;
}

.rc-contact-row {
    display: flex;
    align-items: flex-end;
    gap: 18px;
    padding: 18px;
    border: 1px solid var(--rc-border);
    border-radius: 14px;
}

.rc-contact-row__fields {
    display: grid;
    flex: 1;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px 18px;
}

.rc-form-actions {
    justify-content: flex-end;
    padding-block: 8px 20px;
}

.rc-form-actions button,
.rc-publish-card button,
.rc-public-campaign button {
    cursor: pointer;
}

.rc-hero-upload-preview {
    display: block;
    width: min(100%, 680px);
    max-height: 300px;
    margin: 4px 0 10px;
    border: 1px solid var(--rc-border);
    border-radius: 16px;
    object-fit: cover;
}

.rc-organization-logo-preview {
    width: min(240px, 100%);
    max-height: 120px;
    padding: 12px;
    border: 1px solid var(--rc-border);
    border-radius: 16px;
    background: #fff;
    object-fit: contain;
}

.rc-publish-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-top: 28px;
    padding: 28px;
}

.rc-publish-card h2 {
    margin: 14px 0 5px;
}

.rc-readiness-card {
    margin-top: 28px;
    padding: clamp(24px, 4vw, 38px);
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius);
    background: var(--rc-surface);
    box-shadow: var(--rc-shadow-soft);
}

.rc-readiness-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.rc-readiness-card__header h2 {
    margin: 12px 0 5px;
}

.rc-readiness-card__header p,
.rc-readiness-list p,
.rc-readiness-note {
    margin: 0;
    color: var(--rc-ink-soft);
}

.rc-contact-chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--rc-border);
}

.rc-contact-chip.is-disabled {
    opacity: 0.62;
}

.rc-contact-chip strong,
.rc-contact-chip small {
    display: block;
}

.rc-contact-chip small {
    margin-top: 2px;
    color: var(--rc-ink-soft);
}

.rc-contact-add {
    margin-top: 10px;
}

.rc-contact-add summary {
    color: var(--rc-primary-deep);
    cursor: pointer;
    font-weight: 800;
}

.rc-contact-add form {
    display: grid;
    gap: 9px;
    margin-top: 10px;
    padding: 12px;
    border: 1px solid var(--rc-border);
    border-radius: 12px;
    background: var(--rc-canvas);
}

.rc-contact-add label > span {
    display: block;
    margin-bottom: 4px;
    font-size: 0.78rem;
    font-weight: 750;
}

/* Matched by exclusion rather than by listing types: an <input> with no type attribute behaves as
   type=text but is NOT matched by input[type="text"], which left the family-contact form's Name
   field as the only unstyled box on the roster. */
.rc-contact-add input:not([type="checkbox"]):not([type="hidden"]):not([type="radio"]) {
    width: 100%;
    padding: 9px 10px;
    border: 1px solid var(--rc-border);
    border-radius: 9px;
    font: inherit;
    box-sizing: border-box;
}

.rc-contact-consent {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: 8px;
    color: var(--rc-ink-soft);
    font-size: 0.78rem;
}

.rc-contact-consent > span {
    margin: 0 !important;
    font-weight: 600 !important;
}

.rc-portal-reply-to-prompt {
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid var(--rc-border);
    border-radius: 12px;
    background: var(--rc-canvas);
}

.rc-portal-reply-to-prompt summary {
    color: var(--rc-primary-deep);
    cursor: pointer;
    font-weight: 800;
}

.rc-portal-reply-to-prompt > p {
    margin: 10px 0 8px;
    font-size: 0.85rem;
}

.rc-portal-reply-to-prompt form {
    display: grid;
    gap: 8px;
}

.rc-portal-reply-to-prompt label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
}

.rc-portal-send-form {
    margin-top: 14px;
}

.rc-readiness-score {
    font-size: clamp(2rem, 5vw, 3.4rem);
    letter-spacing: -0.06em;
}

.rc-readiness-progress {
    overflow: hidden;
    height: 10px;
    margin: 24px 0 30px;
    border-radius: 999px;
    background: rgba(91, 77, 255, 0.12);
}

.rc-readiness-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--rc-primary), var(--rc-accent));
}

.rc-readiness-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
}

.rc-readiness-columns h3 {
    margin: 0 0 14px;
    font-size: 1rem;
}

.rc-readiness-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rc-readiness-list li {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--rc-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.55);
}

.rc-readiness-list li.is-incomplete {
    border-color: rgba(208, 55, 74, 0.28);
    background: rgba(208, 55, 74, 0.045);
}

.rc-readiness-icon {
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 50%;
    color: var(--rc-on-primary);
    background: var(--rc-primary);
    font-weight: 900;
}

.is-incomplete .rc-readiness-icon {
    background: #c72f46;
}

.is-recommended .rc-readiness-icon {
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.12);
}

.rc-readiness-list a {
    color: var(--rc-primary-deep);
    font-weight: 800;
    text-decoration: none;
}

.rc-readiness-list p {
    margin-top: 3px;
    font-size: 0.88rem;
    line-height: 1.45;
}

.rc-readiness-note {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--rc-border);
    font-size: 0.9rem;
}

.rc-pagination {
    margin-top: 28px;
}

/* Real campaign deadline countdown */
.rc-sr-only {
    position: absolute !important;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.rc-countdown {
    display: grid;
    grid-template-columns: minmax(250px, 1fr) auto;
    align-items: center;
    gap: clamp(22px, 5vw, 60px);
    overflow: hidden;
    margin: 28px 0 0;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid rgba(126, 240, 200, 0.22);
    border-radius: 24px;
    color: #fff;
    background:
        radial-gradient(circle at 86% 20%, rgba(126, 240, 200, 0.14), transparent 30%),
        linear-gradient(125deg, #12213f, #27206f);
    box-shadow: 0 18px 55px rgba(18, 33, 63, 0.14);
    transition: border-color 240ms ease, background 240ms ease;
}

.rc-countdown .rc-kicker {
    border-color: rgba(126, 240, 200, 0.26);
    color: #7ef0c8;
    background: rgba(255, 255, 255, 0.08);
}

.rc-countdown__message > strong,
.rc-countdown__message time {
    display: block;
}

.rc-countdown__message > strong {
    margin: 7px 0 5px;
    font-size: clamp(1.35rem, 3vw, 2rem);
    letter-spacing: -0.035em;
}

.rc-countdown__message time {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.84rem;
    font-weight: 650;
}

.rc-countdown__units {
    display: flex;
    align-items: flex-start;
    gap: clamp(7px, 1.5vw, 16px);
}

.rc-countdown__units > span {
    display: grid;
    min-width: clamp(50px, 7vw, 76px);
    justify-items: center;
}

.rc-countdown__units strong {
    font-size: clamp(1.9rem, 4.5vw, 3.4rem);
    line-height: 0.95;
    letter-spacing: -0.055em;
    font-variant-numeric: tabular-nums;
}

.rc-countdown__units small {
    margin-top: 7px;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rc-countdown__units i {
    color: rgba(255, 255, 255, 0.32);
    font-size: clamp(1.8rem, 4vw, 3rem);
    font-style: normal;
    line-height: 0.9;
}

.rc-countdown--urgent {
    border-color: rgba(255, 184, 77, 0.55);
    background:
        radial-gradient(circle at 86% 20%, rgba(255, 184, 77, 0.22), transparent 32%),
        linear-gradient(125deg, #302035, #70351b);
}

.rc-countdown--urgent .rc-kicker {
    border-color: rgba(255, 209, 141, 0.34);
    color: #ffd18d;
}

.rc-countdown--urgent .rc-kicker::before {
    background: #ffb84d;
}

.rc-countdown--final {
    border-color: rgba(255, 145, 128, 0.7);
    background:
        radial-gradient(circle at 86% 20%, rgba(255, 184, 77, 0.2), transparent 32%),
        linear-gradient(125deg, #321c35, #7e2634);
    animation: rc-deadline-glow 2.4s ease-in-out infinite;
}

.rc-countdown--expired {
    border-color: var(--rc-border);
    color: var(--rc-ink);
    background: #e9edf4;
    animation: none;
}

.rc-countdown--expired .rc-kicker,
.rc-countdown--expired .rc-countdown__message time,
.rc-countdown--expired .rc-countdown__units small,
.rc-countdown--expired .rc-countdown__units i {
    color: var(--rc-ink-soft);
}

.rc-countdown--expired .rc-kicker {
    border-color: rgba(18, 33, 63, 0.12);
    background: rgba(255, 255, 255, 0.62);
}

.rc-ordering-disabled {
    pointer-events: none;
    opacity: 0.5;
    filter: grayscale(0.45);
}

@keyframes rc-deadline-glow {
    0%, 100% { box-shadow: 0 18px 55px rgba(126, 38, 52, 0.13); }
    50% { box-shadow: 0 18px 62px rgba(126, 38, 52, 0.28); }
}

/* Public campaign */
.rc-campaign-hero-image {
    overflow: hidden;
    aspect-ratio: 1200 / 520;
    margin: 34px 0 0;
    border-radius: clamp(22px, 4vw, 40px);
    background: var(--rc-ink);
    box-shadow: 0 24px 70px rgba(18, 33, 63, 0.16);
}

.rc-campaign-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rc-public-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(330px, 0.85fr);
    align-items: center;
    gap: clamp(38px, 8vw, 100px);
    padding: clamp(52px, 8vw, 100px) 0 80px;
}

.rc-public-hero h1 {
    max-width: 760px;
    margin: 20px 0 18px;
    font-size: clamp(3rem, 7vw, 5.6rem);
    line-height: 0.98;
    letter-spacing: -0.06em;
}

.rc-public-hero > div > p {
    max-width: 720px;
    color: var(--rc-ink-soft);
    font-size: clamp(1.05rem, 2vw, 1.22rem);
    white-space: pre-line;
}

.rc-progress-card {
    padding-top: 34px;
}

.rc-raised-amount {
    display: block;
    margin-top: 8px;
    font-size: clamp(2.8rem, 6vw, 4.8rem);
    line-height: 1;
    letter-spacing: -0.06em;
}

.rc-leaderboard-section {
    padding: 20px 0 90px;
}

.rc-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 26px;
}

.rc-section-heading h2 {
    margin: 14px 0 0;
    font-size: clamp(2rem, 4vw, 3.4rem);
    letter-spacing: -0.05em;
}

.rc-leaderboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.rc-leaderboard-card {
    padding: 26px;
}

.rc-leaderboard-card h3 {
    margin: 0 0 18px;
    font-size: 1.2rem;
}

.rc-leaderboard-row {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 13px 0;
    border-top: 1px solid var(--rc-border);
}

.rc-leaderboard-row > span:nth-child(2) strong,
.rc-leaderboard-row > span:nth-child(2) small {
    display: block;
}

.rc-leaderboard-row small,
.rc-empty-copy {
    color: var(--rc-ink-soft);
}

.rc-rank {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 10px;
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.1);
    font-size: 0.75rem;
    font-weight: 900;
}

.rc-leader-link {
    color: var(--rc-ink);
    text-decoration-color: rgba(91, 77, 255, 0.3);
    text-underline-offset: 3px;
}

/* Private participant portal */
.rc-portal-body {
    min-height: 100vh;
}

.rc-portal-main {
    padding-bottom: 70px;
}

.rc-portal-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(330px, 0.72fr);
    align-items: center;
    gap: clamp(36px, 8vw, 100px);
    padding: clamp(48px, 8vw, 90px) 0 54px;
}

.rc-portal-hero h1 {
    max-width: 780px;
    margin: 17px 0;
    font-size: clamp(3rem, 6.5vw, 6rem);
    line-height: 0.95;
    letter-spacing: -0.065em;
}

.rc-portal-hero h1 span {
    color: var(--rc-primary-readable);
}

.rc-portal-hero > div > p:not(.rc-team-pill) {
    max-width: 660px;
    color: var(--rc-ink-soft);
    font-size: clamp(1rem, 2vw, 1.18rem);
}

.rc-portal-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
    gap: 22px;
}

.rc-portal-grid .rc-form-card {
    margin: 0;
}

.rc-portal-activity .rc-section-heading h2,
.rc-portal-share h2 {
    margin: 10px 0;
    font-size: clamp(1.7rem, 3vw, 2.5rem);
    letter-spacing: -0.045em;
}

.rc-activity-row {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 15px 0;
    border-top: 1px solid var(--rc-border);
}

.rc-activity-row span:nth-child(2) strong,
.rc-activity-row span:nth-child(2) small {
    display: block;
}

.rc-activity-row small {
    margin-top: 3px;
    color: var(--rc-ink-soft);
}

.rc-activity-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.1);
    font-weight: 900;
}

.rc-portal-share .rc-qr-code {
    margin: 22px 0;
}

.rc-portal-security {
    display: flex;
    gap: 14px;
    margin-top: 22px;
    padding: 17px 20px;
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-md);
    color: var(--rc-ink-soft);
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.9rem;
}

.rc-portal-security strong {
    flex: 0 0 auto;
    color: var(--rc-ink);
}

.rc-access-state {
    display: grid;
    width: min(620px, calc(100% - 40px));
    min-height: 100vh;
    box-sizing: border-box;
    align-content: center;
    justify-items: start;
    gap: 16px;
    margin: 0 auto;
}

.rc-access-state > img {
    width: 68px;
    height: 68px;
}

.rc-access-state h1 {
    margin: 0;
    font-size: clamp(2.5rem, 7vw, 4.8rem);
    line-height: 0.98;
    letter-spacing: -0.06em;
}

.rc-access-state p {
    margin: 0;
    color: var(--rc-ink-soft);
    font-size: 1.08rem;
}

@media (max-width: 820px) {
    .rc-manager-preview-bar,
    .rc-manager-preview-bar > div {
        align-items: flex-start;
        flex-direction: column;
    }

    .rc-manager-preview-bar nav {
        width: 100%;
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .rc-manager-preview-bar small {
        display: block;
    }

    .rc-manager-header__inner,
    .rc-page-heading,
    .rc-publish-card,
    .rc-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    /* .rc-page-heading/.rc-publish-card stack into a column above, which also
       flips justify-content from "opposite ends of a row" to "top and bottom of
       a column" — so a trailing action (Create campaign, Open dashboard, etc.)
       just becomes the second item in a left-aligned stack instead of staying a
       clearly-separate call to action. Keep it visually distinct by right-aligning
       it on its own line rather than letting it blend into the stack. */
    .rc-page-heading > .rc-button,
    .rc-page-heading > .rc-actions,
    .rc-publish-card > .rc-button,
    .rc-publish-card > .rc-actions {
        align-self: flex-end;
    }

    .rc-manager-header__inner {
        padding-block: 16px;
    }

    .rc-manager-nav {
        order: 0;
        flex: 0 1 auto;
        width: 100%;
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
    }

    .rc-manager-account {
        width: 100%;
        justify-content: space-between;
    }

    .rc-manager-account__identity {
        align-items: flex-start;
        max-width: none;
    }

    .rc-campaign-grid,
    .rc-form-grid,
    .rc-public-hero,
    .rc-leaderboard-grid,
    .rc-portal-hero,
    .rc-portal-grid,
    .rc-readiness-columns {
        grid-template-columns: 1fr;
    }

    .rc-readiness-card__header {
        align-items: flex-start;
    }

    .rc-readiness-list li {
        grid-template-columns: 28px minmax(0, 1fr);
    }

    .rc-readiness-list a {
        grid-column: 2;
    }

    .rc-portal-security {
        flex-direction: column;
    }

    .rc-countdown {
        grid-template-columns: 1fr;
    }

    .rc-countdown__units {
        width: 100%;
        justify-content: space-between;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .rc-countdown--final {
        animation: none;
    }
}

@media (forced-colors: active) {
    .rc-button,
    .rc-countdown,
    .rc-progress,
    .rc-campaign-card {
        border: 1px solid CanvasText;
    }
}
.rc-school-hero { background: linear-gradient(135deg, #19204f, #2f3b8f); border-radius: 28px; color: #fff; padding: clamp(2rem, 6vw, 5rem); margin: 2rem 0 3rem; position: relative; overflow: hidden; }
.rc-school-hero-identity { display: flex; align-items: center; gap: .9rem; margin-bottom: 2rem; }
.rc-school-hero-identity img, .rc-school-hero-identity > span:first-child { width: 76px; height: 76px; border-radius: 22px; object-fit: contain; background: #fff; padding: .35rem; color: #19204f; display: grid; place-items: center; font-size: 1.35rem; font-weight: 900; }
.rc-school-hero-identity strong, .rc-school-hero-identity small { display: block; }
.rc-school-hero-identity small { opacity: .7; margin-top: .2rem; }
.rc-school-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin-top: 1.25rem; }
.rc-button--light { background: #fff; color: #19204f; }
.rc-school-donation-callout { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; margin: -1rem 0 3rem; padding: 1.5rem 1.75rem; border: 1px solid rgba(25,32,79,.12); border-radius: 22px; background: #fff; box-shadow: 0 14px 40px rgba(25,32,79,.08); }
.rc-school-donation-callout form { width: min(100%, 500px); }
.rc-school-donation-callout .rc-donation-presets { margin-top: 0; }
.rc-school-donation-callout h2 { margin: .3rem 0; }
.rc-school-donation-callout p { margin: 0; color: #59617b; }
.rc-school-overview { margin: 0 0 3rem; padding: clamp(1.4rem, 3vw, 2.25rem); border: 1px solid rgba(25,32,79,.12); border-radius: 24px; background: #fff; box-shadow: 0 14px 40px rgba(25,32,79,.06); }
.rc-school-overview .rc-section-heading { margin-bottom: 1.5rem; }
.rc-school-overview-total { display: flex; flex-direction: column; align-items: flex-end; color: #59617b; }
.rc-school-overview-total strong { color: #19204f; font-size: 1.7rem; }
.rc-school-chart { display: grid; gap: 1.1rem; }
.rc-school-chart-row { display: grid; grid-template-columns: minmax(180px, .8fr) minmax(180px, 2fr) 52px; gap: 1rem; align-items: center; }
.rc-school-chart-label { display: grid; gap: .2rem; }
.rc-school-chart-label span { color: #59617b; font-size: .88rem; }
.rc-school-chart-track { height: 13px; overflow: hidden; border-radius: 999px; background: #e8eaf3; }
.rc-school-chart-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #43c6ac, #2f80ed); }
.rc-school-chart-percent { color: #19204f; text-align: right; }
@media (max-width: 700px) { .rc-school-chart-row { grid-template-columns: 1fr 48px; gap: .5rem .8rem; } .rc-school-chart-label { grid-column: 1 / -1; } .rc-school-chart-track { grid-column: 1; } .rc-school-overview-total { align-items: flex-start; margin-top: .75rem; } }
@media (max-width: 640px) { .rc-school-donation-callout { align-items: flex-start; flex-direction: column; } }
.rc-school-hero h1 { font-size: clamp(2.5rem, 6vw, 5.5rem); line-height: .98; max-width: 760px; margin: .6rem 0 1rem; letter-spacing: -.06em; }
.rc-school-hero p { max-width: 680px; font-size: 1.12rem; opacity: .86; }
.rc-school-hero-meta { display: inline-flex; gap: .7rem; align-items: baseline; margin-top: 1.6rem; padding: .7rem 1rem; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; }
.rc-school-hero-meta strong { font-size: 1.5rem; }
.rc-school-campaigns { padding-bottom: 4rem; }
.rc-school-search { display: flex; gap: .65rem; align-items: end; max-width: 720px; margin: 1.25rem 0 1.5rem; }
.rc-school-search .rc-field { flex: 1; margin: 0; }
.rc-school-search input { min-height: 46px; border-radius: 14px; }
.rc-school-search .rc-button { white-space: nowrap; }
.rc-school-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.25rem; }
.rc-school-card { background: #fff; border: 1px solid rgba(25,32,79,.12); border-radius: 22px; overflow: hidden; box-shadow: 0 18px 50px rgba(25,32,79,.08); }
.rc-school-card-top { background: linear-gradient(135deg, var(--rc-card-primary), #19204f); min-height: 132px; padding: 1.25rem; color: #fff; display: flex; justify-content: space-between; align-items: flex-start; }
.rc-school-card-mark { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; background: rgba(255,255,255,.2); font-size: 1.5rem; font-weight: 900; }
.rc-school-card-body { padding: 1.35rem; }
.rc-school-card-body h3 { margin: 0 0 .5rem; font-size: 1.35rem; }
.rc-school-card-body p { min-height: 3.5rem; color: #59617b; }
.rc-school-progress { height: 9px; background: #e9ecf5; border-radius: 999px; overflow: hidden; margin: 1.1rem 0 .55rem; }
.rc-school-progress span { display: block; height: 100%; background: #20a486; border-radius: inherit; }
.rc-school-stats { display: flex; justify-content: space-between; gap: .75rem; align-items: baseline; margin-bottom: 1.1rem; }
.rc-school-stats strong { font-size: 1.35rem; }
.rc-school-stats span { color: #69718b; font-size: .82rem; text-align: right; }
.rc-empty-state { border: 1px dashed rgba(25,32,79,.25); border-radius: 22px; padding: 2.5rem; text-align: center; }
.rc-school-start-date { color: #4f46e5 !important; font-size: .86rem; font-weight: 700; min-height: auto !important; }
.rc-school-history { padding: 1rem 0 4rem; }
.rc-school-history-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.rc-school-history-card { background: #eef1f8; border-radius: 18px; padding: 1.25rem; display: flex; flex-direction: column; gap: .35rem; }
.rc-school-history-card h3 { margin: .2rem 0 .35rem; font-size: 1.05rem; }
.rc-school-history-card strong { font-size: 1.6rem; color: #19204f; }
.rc-school-history-card > span:last-child { color: #66708b; font-size: .82rem; }
.rc-school-header-identity { display: flex; align-items: center; gap: .7rem; }
.rc-school-header-identity img { width: 40px; height: 40px; border-radius: 12px; object-fit: contain; background: #fff; padding: .2rem; }
.rc-school-cart { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .8rem; border: 1px solid rgba(25,32,79,.14); border-radius: 999px; color: #19204f; background: #fff; text-decoration: none; font-weight: 800; box-shadow: 0 8px 20px rgba(25,32,79,.08); }
.rc-school-cart:hover, .rc-school-cart:focus-visible { border-color: #2f80ed; color: #19204f; transform: translateY(-1px); }
.rc-school-cart strong { display: grid; min-width: 1.45rem; height: 1.45rem; place-items: center; border-radius: 999px; color: #fff; background: #2f80ed; font-size: .78rem; }
.rc-participant-directory { margin: 2.5rem 0; }
.rc-participant-directory-grid { display: grid; gap: .8rem; }
.rc-participant-directory-card { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: .85rem; align-items: center; padding: .85rem 1rem; border: 1px solid rgba(25,32,79,.1); border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgba(25,32,79,.05); }
.rc-participant-directory-avatar { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; color: #19204f; background: #e8edff; font-size: .82rem; font-weight: 900; }
.rc-participant-directory-copy { min-width: 0; }
.rc-participant-directory-copy strong, .rc-participant-directory-copy span, .rc-participant-directory-copy small { display: block; }
.rc-participant-directory-copy span, .rc-participant-directory-copy small { color: #59617b; font-size: .82rem; }
.rc-participant-directory-progress { height: 7px; margin: .35rem 0 .25rem; overflow: hidden; border-radius: 999px; background: #e8eaf3; }
.rc-participant-directory-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #43c6ac, #2f80ed); }
@media (max-width: 620px) { .rc-participant-directory-card { grid-template-columns: 42px minmax(0, 1fr); } .rc-participant-directory-card .rc-button { grid-column: 2; justify-self: start; } }
.rc-school-share { margin-top: 1rem; border-color: rgba(255,255,255,.4); color: #fff; background: rgba(255,255,255,.12); }
@media (max-width: 620px) { .rc-school-search { align-items: stretch; flex-wrap: wrap; } .rc-school-search .rc-field { flex-basis: 100%; } }

/* Checkout (cart / payment / order-complete) — shared between EventChamp ticket
   purchases and RaiseChamp fundraising items, so this styles the generic cart
   rather than a specific campaign; body still gets the default --rc-primary. */
.rc-checkout-steps { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .5rem 0; margin-bottom: 2rem; }
.rc-checkout-step { position: relative; display: flex; flex: 1; flex-direction: column; align-items: center; gap: .45rem; min-width: 84px; color: var(--rc-ink-soft); text-decoration: none; text-align: center; }
.rc-checkout-step::after { position: absolute; top: 17px; left: 50%; width: 100%; height: 2px; background: var(--rc-border); content: ""; z-index: -1; }
.rc-checkout-step:last-child::after { display: none; }
.rc-checkout-step__index { display: grid; width: 34px; height: 34px; place-items: center; border: 2px solid var(--rc-border); border-radius: 50%; background: var(--rc-surface); color: var(--rc-ink-soft); font-weight: 800; font-size: .85rem; }
.rc-checkout-step__label { font-size: .78rem; font-weight: 700; }
.rc-checkout-step.is-done .rc-checkout-step__index { border-color: var(--rc-primary); background: var(--rc-primary); color: var(--rc-on-primary); }
.rc-checkout-step.is-done::after { background: var(--rc-primary); }
.rc-checkout-step.is-done .rc-checkout-step__label { color: var(--rc-ink); }
.rc-checkout-step.is-active .rc-checkout-step__index { border-color: var(--rc-primary); color: var(--rc-primary-deep); }
.rc-checkout-step.is-active .rc-checkout-step__label { color: var(--rc-ink); }
@media (max-width: 560px) { .rc-checkout-step__label { display: none; } }

.rc-cart-list { display: grid; gap: 1rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.rc-cart-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: start; padding-bottom: 1rem; border-bottom: 1px solid var(--rc-border); }
.rc-cart-row:last-child { padding-bottom: 0; border-bottom: 0; }
.rc-cart-row__remove { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid var(--rc-border); border-radius: 50%; color: var(--rc-ink-soft); background: var(--rc-surface); font-size: 1rem; line-height: 1; cursor: pointer; }
.rc-cart-row__remove:hover { border-color: #b42318; color: #b42318; }
.rc-cart-row__copy { min-width: 0; }
.rc-cart-row__copy a { color: var(--rc-primary-deep); }
.rc-cart-row__copy small { display: block; color: var(--rc-ink-soft); }
.rc-cart-row__buy { display: flex; flex-direction: column; align-items: flex-end; gap: .4rem; text-align: right; }
.rc-cart-row__buy select { min-height: 38px; padding: 4px 10px; border: 1px solid var(--rc-border); border-radius: 10px; font: inherit; }
.rc-cart-totals { display: grid; gap: .5rem; margin: 0 0 1.5rem; padding-top: 1rem; border-top: 1px solid var(--rc-border); }
.rc-cart-totals > div { display: flex; justify-content: space-between; gap: 1rem; color: var(--rc-ink-soft); }
.rc-cart-totals > div.rc-cart-totals__grand { padding-top: .5rem; border-top: 1px solid var(--rc-border); color: var(--rc-ink); font-size: 1.2rem; font-weight: 800; }
.rc-cart-totals .rc-positive { color: #087a5b; }
.rc-cart-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; }
.rc-coupon-form { margin: 0 0 1.5rem; }
.rc-coupon-form form { display: flex; gap: .6rem; }
.rc-coupon-form input { flex: 1; min-height: 46px; padding: 0 14px; border: 1px solid var(--rc-border); border-radius: 12px; font: inherit; }
.rc-coupon-form details { margin-top: .6rem; color: var(--rc-ink-soft); font-size: .85rem; }
.rc-coupon-form summary { cursor: pointer; color: var(--rc-primary-deep); font-weight: 700; }
.rc-coupon-form ol { margin: .5rem 0 0; padding-left: 1.2rem; }
@keyframes rc-tada { 0% { transform: translateY(3px); } 65% { transform: translateY(-3px); } 75% { transform: translateY(2px); } 83% { transform: translateY(-2px); } 100% { transform: translateY(0); } }
.rc-tada { animation: rc-tada .8s ease-in-out; }

.rc-empty-cart { padding: clamp(28px, 6vw, 48px) 24px; border: 1px dashed var(--rc-border); border-radius: var(--rc-radius-lg); text-align: center; color: var(--rc-ink-soft); }

.rc-billing-form { display: grid; gap: 16px; }
.rc-payment-card-host { min-height: 48px; padding: 12px 14px; border: 1px solid #cfd8e6; border-radius: 12px; background: #fff; }
.rc-payment-card-host.StripeElement--focus { border-color: var(--rc-primary); box-shadow: 0 0 0 4px rgba(91, 77, 255, 0.11); }
.rc-payment-card-host.StripeElement--invalid { border-color: #b42318; }
.rc-pay-button { position: relative; width: 100%; }
.rc-pay-button .rc-spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255, 255, 255, 0.4); border-top-color: #fff; border-radius: 50%; animation: rc-spin .8s linear infinite; }
@keyframes rc-spin { to { transform: rotate(360deg); } }
.rc-hidden { display: none !important; }

.rc-guest-name-list { display: grid; gap: 14px; margin: 0 0 1.5rem; padding: 0; list-style: none; }

.rc-order-item-list { display: grid; gap: 1rem; margin: 0 0 1.5rem; }
.rc-order-item-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1rem; align-items: start; padding-bottom: 1rem; border-bottom: 1px solid var(--rc-border); }
.rc-order-item-row:last-child { padding-bottom: 0; border-bottom: 0; }
.rc-order-item-row small { display: block; color: var(--rc-ink-soft); }
@media (max-width: 560px) { .rc-order-item-row { grid-template-columns: minmax(0, 1fr) auto; } .rc-order-item-row > :nth-child(2) { grid-column: 1; } }

.rc-thankyou-hero { padding: clamp(28px, 6vw, 48px); margin-bottom: 1.5rem; border-radius: var(--rc-radius-lg); color: #fff; background: linear-gradient(135deg, var(--rc-ink), #2f3b8f); text-align: center; }
.rc-thankyou-hero h1 { margin: 0 0 .4rem; font-size: clamp(1.7rem, 4vw, 2.5rem); letter-spacing: -.03em; }
.rc-thankyou-hero p { margin: 0; opacity: .85; }

.rc-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 2rem 0 3rem; color: var(--rc-ink-soft); font-size: .85rem; }
.rc-footer address { font-style: normal; }
.rc-footer nav { display: flex; gap: 1rem; }
.rc-footer a { color: var(--rc-ink-soft); }
.rc-footer a:hover { color: var(--rc-primary-deep); }

.rc-qr-code img { max-width: 190px; height: auto; border-radius: 12px; }
@media print { .rc-noprint { display: none; } }

/* Homepage event listing - visually matches the .rc-school-* fundraiser cards
   above so RaiseChamp campaigns and EventChamp events read as one system on
   the merged storefront homepage (frontend/home/index.blade.php). */
.rc-button--block { display: flex; width: 100%; }
.rc-events-section { padding: 1rem 0 4rem; }
.rc-event-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.25rem; }
.rc-event-card { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid rgba(25,32,79,.12); border-radius: 22px; box-shadow: 0 18px 50px rgba(25,32,79,.08); }
.rc-event-card-media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: #eef1f8; }
.rc-event-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rc-event-card-body { display: flex; flex: 1; flex-direction: column; gap: .5rem; padding: 1.35rem; }
.rc-event-card-body h3 { margin: 0; font-size: 1.25rem; }
.rc-event-card-body h3 a { color: inherit; text-decoration: none; }
.rc-event-date { margin: 0; color: #19204f; font-weight: 700; font-size: .92rem; }
.rc-event-location { margin: 0; color: #69718b; font-size: .85rem; }
.rc-event-description { flex: 1; margin: 0; color: #59617b; font-size: .92rem; }
.rc-event-description p:last-child { margin-bottom: 0; }
.rc-event-notice { display: block; padding: .65rem 1rem; border-radius: 14px; background: #fff4e5; color: #92400e; font-weight: 700; font-size: .85rem; text-align: center; }

/* Nightmanager scaffolding CRUD screens (list/create/edit) — reskinned from the old
   Bootstrap shell, see _Docs/NIGHTMANAGER_RC_RESKIN_PLAN.md Phase 1. These screens are
   label/value tables (one row per column), a different shape than the card-grid forms
   used by the hand-built RaiseChamp manager pages, so they get their own small set of
   classes rather than forcing the .rc-field/.rc-form-grid pattern into a table. */
.rc-scaffold-filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 16px;
    margin-bottom: 24px;
    padding: 18px 20px;
    border: 1px solid rgba(25, 32, 79, 0.1);
    border-radius: var(--rc-radius-sm);
    background: #fff;
}

.rc-scaffold-filter-bar .rc-field {
    min-width: 200px;
}

.rc-scaffold-table-wrap {
    overflow-x: auto;
    border: 1px solid rgba(25, 32, 79, 0.1);
    border-radius: var(--rc-radius-sm);
    background: #fff;
}

.rc-scaffold-table {
    width: 100%;
    border-collapse: collapse;
}

.rc-scaffold-table th,
.rc-scaffold-table td {
    padding: 12px 16px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid rgba(25, 32, 79, 0.08);
    font-size: 0.9rem;
}

.rc-scaffold-table tbody tr:last-child th,
.rc-scaffold-table tbody tr:last-child td {
    border-bottom: none;
}

/* List screen: column headers */
.rc-scaffold-table thead th {
    color: var(--rc-ink-soft);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Create/edit screens: left-hand label column */
.rc-scaffold-table tbody th {
    width: 220px;
    color: var(--rc-ink);
    font-weight: 750;
}

.rc-scaffold-table tr.rc-row-updated { background: rgba(91, 77, 255, 0.08); }
.rc-scaffold-table tr.rc-row-inactive { opacity: 0.55; }

/* Row-highlight modifiers, usable on any table body (not just .rc-scaffold-table) — e.g. the
   refund preview's "Transfers" sanity-check table flags an over-allocated row. */
tr.rc-row-updated { background: rgba(91, 77, 255, 0.08); }
tr.rc-row-inactive { opacity: 0.55; }
tr.rc-row-danger { background: rgba(220, 53, 69, 0.08); }
tr.rc-row-danger td { color: #9d2030; }

.rc-scaffold-table input[type="text"],
.rc-scaffold-table input[type="number"],
.rc-scaffold-table input[type="email"],
.rc-scaffold-table input[type="tel"],
.rc-scaffold-table input[type="date"],
.rc-scaffold-table input[type="datetime-local"],
.rc-scaffold-table input[type="password"],
.rc-scaffold-table input[type="file"],
.rc-scaffold-table textarea,
.rc-scaffold-table select {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid #cfd8e6;
    border-radius: 12px;
    outline: none;
    color: var(--rc-ink);
    background: #fff;
    font: inherit;
    font-weight: 500;
}

.rc-scaffold-table textarea { min-height: 120px; resize: vertical; }

.rc-scaffold-table input[type="text"]:focus,
.rc-scaffold-table input[type="number"]:focus,
.rc-scaffold-table input[type="email"]:focus,
.rc-scaffold-table input[type="tel"]:focus,
.rc-scaffold-table input[type="date"]:focus,
.rc-scaffold-table input[type="datetime-local"]:focus,
.rc-scaffold-table textarea:focus,
.rc-scaffold-table select:focus {
    border-color: var(--rc-primary);
}

.rc-scaffold-table .rc-input-error { border-color: #dc3545 !important; }

.rc-scaffold-error-text {
    display: block;
    margin-top: 6px;
    font-size: 0.78rem;
    font-weight: 700;
    color: #9d2030;
}

.rc-scaffold-radio-row { display: flex; align-items: center; gap: 8px; font-weight: 500; }
.rc-scaffold-radio-row + .rc-scaffold-radio-row { margin-top: 6px; }

.rc-scaffold-checkbox-list { display: flex; flex-wrap: wrap; gap: 10px 20px; list-style: none; margin: 0; padding: 0; }
.rc-scaffold-checkbox-list li { min-width: 180px; font-weight: 500; }

.rc-scaffold-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* multi_reference_groups: replicates just enough of Bootstrap's nav-tabs/tab-pane
   visibility toggling (still driven by bootstrap.bundle.min.js's Tab component, see
   the create/edit screens' pushed head scripts) since Bootstrap's own CSS isn't
   loaded on rc- pages. */
.rc-scaffold-tabs .nav-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(25, 32, 79, 0.12);
}

.rc-scaffold-tabs .nav-link {
    padding: 8px 14px;
    border: none;
    border-radius: 10px 10px 0 0;
    background: transparent;
    color: var(--rc-ink-soft);
    font-weight: 700;
    font-size: 0.85rem;
    cursor: pointer;
}

.rc-scaffold-tabs .nav-link.active {
    color: var(--rc-primary-deep);
    background: rgba(91, 77, 255, 0.1);
}

.rc-scaffold-tabs .tab-pane { display: none; }
.rc-scaffold-tabs .tab-pane.show.active { display: block; }

.rc-scaffold-select-all {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--rc-primary-deep);
    font-weight: 700;
    font-size: 0.82rem;
}

/* Nightmanager reskin, Phase 4+: small generic utilities used by JS that toggles
   Bootstrap-style class names (kept as-is rather than rewritten, see
   _Docs/NIGHTMANAGER_RC_RESKIN_PLAN.md) and a lightweight bordered card for grouped
   checkbox sections (coupon "apply to specific tickets" picker, etc). */
.d-none { display: none !important; }

.rc-scaffold-card {
    margin-bottom: 18px;
    border: 1px solid rgba(25, 32, 79, 0.1);
    border-radius: var(--rc-radius-sm);
    background: #fff;
    overflow: hidden;
}

.rc-scaffold-card__header {
    padding: 12px 16px;
    border-bottom: 1px solid rgba(25, 32, 79, 0.08);
    background: rgba(91, 77, 255, 0.05);
    font-weight: 800;
    font-size: 0.9rem;
}

.rc-scaffold-card__body {
    padding: 16px;
}

/* Nightmanager dashboard (/nightmanager) — reskinned per _Docs/NIGHTMANAGER_RC_RESKIN_PLAN.md.
   CSS-only "Show tags" toggle: the checkbox itself stays visually hidden (.d-none) and a
   .rc-button-styled <label for="..."> drives it; no JS involved, same trick the original
   Bootstrap version used. */
.rc-dashboard-event-tags {
    display: none;
    margin-top: 10px;
}

.rc-dashboard-tag-toggle:checked + .rc-dashboard-event-tags {
    display: block;
}

.rc-progress--urgent span {
    background: linear-gradient(90deg, #dc3545, #ff8fa3);
}