/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ── Page shell ───────────────────────────────────────── */

.page[b-lrywzeyj7c] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--page-bg);
    overflow: clip; /* clip prevents horizontal overflow without creating a scroll container, so position:sticky on the sidebar works */
}

/* ── Mobile top bar ───────────────────────────────────── */

.topbar[b-lrywzeyj7c] {
    position: sticky;
    top: 0;
    z-index: var(--z-topbar);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0 var(--gutter-x);
    height: 56px;
    background: color-mix(in srgb, var(--nav-bg) 92%, transparent);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--border-subtle);
    flex-shrink: 0;
}

.topbar-toggle[b-lrywzeyj7c] {
    width: var(--tap-target);
    height: var(--tap-target);
    display: grid;
    place-items: center;
    background: var(--accent-muted);
    border: 1px solid var(--accent-border-glow);
    border-radius: var(--radius);
    color: var(--accent);
    cursor: pointer;
    flex-shrink: 0;
}

.topbar-toggle svg[b-lrywzeyj7c] {
    width: 20px;
    height: 20px;
}

.topbar-brand[b-lrywzeyj7c] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--accent);
    text-decoration: none;
}

.topbar-brand-mark[b-lrywzeyj7c] {
    width: 22px;
    height: 22px;
}

/* ── Sidebar - drawer mode (default, mobile) ──────────── */

.sidebar[b-lrywzeyj7c] {
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--sidebar-w-drawer);
    background-color: var(--nav-bg);
    background-image:
        linear-gradient(180deg, color-mix(in srgb, var(--nav-bg) 75%, transparent) 0%, color-mix(in srgb, var(--container-bg) 65%, transparent) 100%),
        var(--pattern-url, none);
    border-right: 1px solid var(--border-subtle);
    transform: translateX(-100%);
    transition: transform var(--t-slow) var(--ease), width var(--t-slow) var(--ease);
    z-index: var(--z-drawer);
    overflow-y: auto;
    overscroll-behavior: contain;
    display: flex;
    flex-direction: column;
}

.sidebar[b-lrywzeyj7c]::after {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--accent) 20%, transparent) 30%, color-mix(in srgb, var(--accent) 20%, transparent) 70%, transparent 100%);
    pointer-events: none;
}

.page[data-drawer="open"] .sidebar[b-lrywzeyj7c] {
    transform: translateX(0);
}

/* ── Scrim ────────────────────────────────────────────── */

.scrim[b-lrywzeyj7c] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(2px);
    z-index: var(--z-scrim);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--t-base);
}

.page[data-drawer="open"] .scrim[b-lrywzeyj7c] {
    opacity: 1;
    pointer-events: auto;
}

.page[data-drawer="open"][b-lrywzeyj7c] {
    overflow: hidden;
}

/* ── Sidebar pin button ───────────────────────────────── */

.sidebar-pin[b-lrywzeyj7c] {
    display: none;
}

/* ── Tablet (≥ sm) - fixed rail, main offset ─────────── */

@media (min-width: 640px) {
    .topbar[b-lrywzeyj7c], .scrim[b-lrywzeyj7c] { display: none; }
    .page[b-lrywzeyj7c] { flex-direction: column; }

    .sidebar[b-lrywzeyj7c] {
        inset: auto;
        top: 0;
        left: 0;
        height: 100vh;
        height: 100dvh;
        transform: none;
        width: var(--sidebar-w-rail);
        transition: width var(--t-slow) var(--ease);
    }

    .page[data-sidebar="full"] .sidebar[b-lrywzeyj7c] {
        width: var(--sidebar-w-full);
    }

    /* Push main clear of the fixed sidebar; transition matches sidebar width transition */
    .main[b-lrywzeyj7c] {
        margin-left: var(--sidebar-w-rail);
        transition: margin-left var(--t-slow) var(--ease);
    }

    .page[data-sidebar="full"] .main[b-lrywzeyj7c] {
        margin-left: var(--sidebar-w-full);
    }

    .sidebar-pin[b-lrywzeyj7c] {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 40px;
        background: none;
        border: none;
        border-top: 1px solid var(--border-subtle);
        color: var(--text-muted);
        cursor: pointer;
        margin-top: auto;
        flex-shrink: 0;
        transition: color var(--t-fast);
    }

    .sidebar-pin:hover[b-lrywzeyj7c] { color: var(--accent); }

    .sidebar-pin svg[b-lrywzeyj7c] {
        width: 16px;
        height: 16px;
    }
}

/* ── Desktop (≥ md) - full sidebar by default ─────────── */

@media (min-width: 1024px) {
    .page:not([data-sidebar="rail"]) .sidebar[b-lrywzeyj7c] {
        width: var(--sidebar-w-full);
    }

    .page:not([data-sidebar="rail"]) .main[b-lrywzeyj7c] {
        margin-left: var(--sidebar-w-full);
    }
}

/* ── Rail mode - hide labels and section headers ─────────── */

@media (min-width: 640px) {
    .page:not([data-sidebar="full"])[b-lrywzeyj7c]  .nav-label,
    .page:not([data-sidebar="full"])[b-lrywzeyj7c]  .nav-section,
    .page:not([data-sidebar="full"])[b-lrywzeyj7c]  .navbar-brand-name {
        display: none;
    }

    .page:not([data-sidebar="full"])[b-lrywzeyj7c]  .nav-link {
        justify-content: center;
        padding: 0;
        gap: 0;
        width: var(--tap-target);
        height: var(--tap-target);
        margin: 0.15rem auto;
    }

    .page:not([data-sidebar="full"])[b-lrywzeyj7c]  .nav-item--indented {
        padding-left: 0;
    }

    .page:not([data-sidebar="full"])[b-lrywzeyj7c]  .navbar-brand {
        justify-content: center;
        padding: 0;
    }

    .page:not([data-sidebar="full"])[b-lrywzeyj7c]  .top-row {
        justify-content: center;
    }
}

/* ── Main content column ──────────────────────────────── */

.main[b-lrywzeyj7c] {
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    background-color: var(--page-bg);
    display: flex;
    flex-direction: column;
    align-items: center;
}

article.content[b-lrywzeyj7c] {
    padding: 1rem;
    max-width: var(--container-max);
    width: 100%;
    min-width: 0;
}

@media (min-width: 640px)  { article.content[b-lrywzeyj7c] { padding: 1.5rem 2rem; } }
@media (min-width: 1024px) { article.content[b-lrywzeyj7c] { padding: 2rem; } }

/* ── Error UI ─────────────────────────────────────────── */

#blazor-error-ui[b-lrywzeyj7c] {
    color-scheme: dark;
    background: var(--danger-bg);
    border-top: 1px solid var(--danger);
    bottom: 0;
    box-shadow: 0 -4px 24px rgba(0,0,0,0.7);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.75rem 1.5rem;
    position: fixed;
    width: 100%;
    z-index: var(--z-toast);
    font-family: var(--font-body);
    color: var(--danger);
}

#blazor-error-ui .dismiss[b-lrywzeyj7c] {
    cursor: pointer;
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
    font-size: 1.2rem;
    line-height: 1;
}

#blazor-error-ui .reload[b-lrywzeyj7c] {
    color: var(--accent);
    text-decoration: underline;
    margin-left: 0.5rem;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* ── Brand header ────────────────────────────────────────── */

.top-row[b-r2g0neka2h] {
    min-height: 4.5rem;
    background-color: transparent;
    padding: 1.25rem 1rem 1rem 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 10%, transparent);
    display: flex;
    align-items: center;
}

/* ── Brand name ──────────────────────────────────────────── */

.navbar-brand[b-r2g0neka2h] {
    font-family: var(--font-brand);
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.3;
    color: var(--text);
    text-decoration: none;
    transition: opacity 0.25s ease, width 0.25s ease;
    overflow: hidden;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.navbar-brand-mark[b-r2g0neka2h] {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    color: var(--accent);
    opacity: 0.9;
}

.navbar-brand-name[b-r2g0neka2h]::first-letter {
    color: var(--accent-initial);
}

.navbar-brand-logo[b-r2g0neka2h] {
    max-height: 48px;
    max-width: 150px;
    width: auto;
    object-fit: contain;
    display: block;
    image-rendering: auto;
}

/* ── Nav scrollable area ─────────────────────────────────── */

.nav-scrollable[b-r2g0neka2h] {
    display: block;
    padding: 0.5rem 0;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
}

/* ── Nav items ───────────────────────────────────────────── */

.nav-item[b-r2g0neka2h] {
    font-size: 0.85rem;
    padding: 0.05rem 0.75rem;
}

.nav-item--indented[b-r2g0neka2h] {
    padding-left: 1.25rem;
}

.nav-item[b-r2g0neka2h]  .nav-link {
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
    background: none;
    border: none;
    border-radius: 6px;
    height: 2.15rem;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    width: 100%;
    padding: 0 0.75rem 0 0.875rem;
    text-decoration: none;
    position: relative;
    transition: color 0.18s ease, background-color 0.18s ease;
}

.nav-item[b-r2g0neka2h]  .nav-link::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%) scaleY(0);
    width: 2px;
    height: 60%;
    background: var(--accent);
    border-radius: 0 2px 2px 0;
    transition: transform 0.18s ease;
}

.nav-item[b-r2g0neka2h]  .nav-link:hover {
    color: var(--text);
    background-color: color-mix(in srgb, var(--accent) 6%, transparent);
}

.nav-item[b-r2g0neka2h]  .nav-link:hover::before {
    transform: translateY(-50%) scaleY(0.5);
}

.nav-item[b-r2g0neka2h]  a.active {
    color: var(--accent);
    background-color: color-mix(in srgb, var(--accent) 10%, transparent);
}

.nav-item[b-r2g0neka2h]  a.active::before {
    transform: translateY(-50%) scaleY(1);
}

/* Logout / Sign In / Register buttons */
.nav-item[b-r2g0neka2h]  button.nav-link {
    cursor: pointer;
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.nav-item[b-r2g0neka2h]  button.nav-link.text-danger {
    color: rgba(192, 57, 43, 0.7) !important;
}

.nav-item[b-r2g0neka2h]  button.nav-link.text-danger:hover {
    color: var(--danger) !important;
    background-color: rgba(192, 57, 43, 0.08);
}

/* ── Nav icons ───────────────────────────────────────────── */

.nav-item[b-r2g0neka2h]  .nav-icon {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    opacity: 0.6;
    transition: opacity 0.18s ease;
}

.nav-item[b-r2g0neka2h]  .nav-link:hover .nav-icon,
.nav-item[b-r2g0neka2h]  a.active .nav-icon,
.nav-item[b-r2g0neka2h]  button.nav-link:hover .nav-icon {
    opacity: 1;
}

/* ── Nav label ───────────────────────────────────────────── */

.nav-label[b-r2g0neka2h] {
    overflow: hidden;
    white-space: nowrap;
    transition: opacity 0.25s ease, width 0.25s ease;
}

/* ── Nav section divider (collapsible button) ────────────── */

.nav-section[b-r2g0neka2h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    font-family: var(--font-ui);
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-dim);
    padding: 0.85rem 0.9rem 0.3rem 1.5rem;
    transition: color 0.15s ease;
    text-align: left;
}

.nav-section:hover[b-r2g0neka2h] {
    color: var(--text-muted);
}

/* ── Section chevron ─────────────────────────────────────── */

.nav-section-chevron[b-r2g0neka2h] {
    flex-shrink: 0;
    opacity: 0.55;
    transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.15s ease;
}

.nav-section:hover .nav-section-chevron[b-r2g0neka2h] {
    opacity: 0.85;
}

.nav-section-chevron--collapsed[b-r2g0neka2h] {
    transform: rotate(-90deg);
}

/* ── Section items wrapper ───────────────────────────────── */

.nav-section-items[b-r2g0neka2h] {
    overflow: hidden;
    max-height: 500px;
    opacity: 1;
    transition: max-height 0.24s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.18s ease;
}

.nav-section-items--hidden[b-r2g0neka2h] {
    max-height: 0;
    opacity: 0;
    pointer-events: none;
}

/* /Components/Pages/Account/ConfirmEmail.razor.rz.scp.css */
.confirm-icon[b-otxk8zpvte] {
    width: 64px;
    height: 64px;
    margin: 0 auto;
}
.confirm-icon svg[b-otxk8zpvte] { width: 100%; height: 100%; }
.confirm-form-group[b-otxk8zpvte] { text-align: left; margin: 0.75rem 0; display: flex; flex-direction: column; gap: 0.35rem; }
.confirm-actions[b-otxk8zpvte] { display: flex; gap: 0.5rem; justify-content: center; margin-top: 0.5rem; }
.confirm-back-btn[b-otxk8zpvte] { margin-top: 0.75rem; }
/* /Components/Pages/Account/GoogleCallback.razor.rz.scp.css */
.gc-back-btn[b-o6wkkz2m43] { margin-top: 0.75rem; display: inline-block; }
/* /Components/Pages/Account/Login.razor.rz.scp.css */
.login-header[b-yahxucimos] { text-align: center; margin-bottom: 1.5rem; }

.form-group[b-yahxucimos] { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 1rem; }

.login-submit[b-yahxucimos] { width: 100%; justify-content: center; margin-top: 0.25rem; margin-bottom: 0.75rem; }

.login-footer-link[b-yahxucimos] {
    text-align: center;
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text-muted);
    margin: 0 0 0.5rem;
}
.login-footer-link a[b-yahxucimos] { color: var(--accent); }

.login-divider[b-yahxucimos] {
    text-align: center;
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    margin: 0.75rem 0;
}

.login-google-btn[b-yahxucimos] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    width: 100%;
    padding: 0.6rem 1rem;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--border);
    border-radius: 8px;
    font-family: var(--font-ui);
    font-size: 0.88rem;
    color: var(--text);
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s;
}
.login-google-btn:hover[b-yahxucimos] {
    background: rgba(255,255,255,0.08);
    border-color: color-mix(in srgb, var(--accent) 30%, transparent);
    color: var(--text-bright);
}

.login-alert[b-yahxucimos] {
    padding: 0.65rem 0.9rem;
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.85rem;
    margin-bottom: 0.75rem;
}
.login-alert--warning[b-yahxucimos] {
    background: rgba(255,159,10,0.1);
    border: 1px solid rgba(255,159,10,0.3);
    color: var(--warning, #ff9f0a);
}
.login-alert-link[b-yahxucimos] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 0.25rem;
    font-size: inherit;
    color: inherit;
    text-decoration: underline;
    cursor: pointer;
    vertical-align: baseline;
}
.login-alert-link:disabled[b-yahxucimos] { opacity: 0.6; cursor: not-allowed; }
/* /Components/Pages/Account/Profile.razor.rz.scp.css */
.profile-page[b-0wvc1pdy1v] {
    max-width: 860px;
    margin: 0 auto;
    padding: 2rem 1rem 4rem;
}

.profile-loading[b-0wvc1pdy1v] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 4rem;
    justify-content: center;
    color: var(--text-muted);
    font-family: var(--font-body);
}

.identity-card[b-0wvc1pdy1v] {
    display: flex;
    align-items: center;
    gap: 2rem;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 2rem 2.5rem;
    margin-bottom: 2rem;
    position: relative;
    overflow: hidden;
}
.identity-card[b-0wvc1pdy1v]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 4%, transparent) 0%, transparent 60%);
    pointer-events: none;
}

.identity-avatar[b-0wvc1pdy1v] { position: relative; flex-shrink: 0; }

.avatar-initials[b-0wvc1pdy1v] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--container-raised), var(--container-bg));
    border: 2px solid var(--accent);
    font-family: var(--font-heading);
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--accent);
    letter-spacing: 0.05em;
}

.avatar-ring[b-0wvc1pdy1v] {
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
    pointer-events: none;
}

.identity-info[b-0wvc1pdy1v] { flex: 1; min-width: 0; }

.identity-name[b-0wvc1pdy1v] {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--accent);
    margin: 0 0 0.3rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    text-shadow: 0 0 18px color-mix(in srgb, var(--accent) 35%, transparent);
}

.identity-email[b-0wvc1pdy1v] {
    font-family: var(--font-body);
    color: var(--text-muted);
    margin: 0 0 0.8rem;
    font-size: 0.95rem;
}

.identity-roles[b-0wvc1pdy1v] { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.role-badge[b-0wvc1pdy1v] {
    display: inline-block;
    padding: 0.2rem 0.7rem;
    border-radius: 20px;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent);
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.profile-sections[b-0wvc1pdy1v] { display: flex; flex-direction: column; gap: 1.5rem; }

.profile-card[b-0wvc1pdy1v] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
}

.profile-card-header[b-0wvc1pdy1v] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.25rem 1.75rem;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--accent) 3%, transparent);
}
.profile-card-header h2[b-0wvc1pdy1v] {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
    margin: 0;
    letter-spacing: 0.04em;
}

.section-icon[b-0wvc1pdy1v] { width: 18px; height: 18px; color: var(--accent); flex-shrink: 0; }

.form-grid[b-0wvc1pdy1v] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    padding: 1.75rem;
}
.form-group--full[b-0wvc1pdy1v] { grid-column: 1 / -1; }

.profile-card-footer[b-0wvc1pdy1v] {
    padding: 1rem 1.75rem 1.5rem;
    display: flex;
    justify-content: flex-end;
}

.btn-gold[b-0wvc1pdy1v] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.5rem;
    background: linear-gradient(135deg, var(--accent), var(--accent-mid));
    color: var(--page-bg);
    border: none;
    border-radius: 6px;
    font-family: var(--font-ui);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s, transform 0.1s;
}
.btn-gold:hover:not(:disabled)[b-0wvc1pdy1v] { opacity: 0.9; transform: translateY(-1px); }
.btn-gold:disabled[b-0wvc1pdy1v] { opacity: 0.55; cursor: not-allowed; }

.btn-spinner[b-0wvc1pdy1v] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(7,9,15,0.3);
    border-top-color: var(--page-bg);
    border-radius: 50%;
    animation: btn-spin-b-0wvc1pdy1v 0.7s linear infinite;
}
@keyframes btn-spin-b-0wvc1pdy1v { to { transform: rotate(360deg); } }

.alert[b-0wvc1pdy1v] {
    margin: 0 1.75rem 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.9rem;
}
.alert-success[b-0wvc1pdy1v] {
    background: rgba(52,199,89,0.08);
    border: 1px solid rgba(52,199,89,0.25);
    color: var(--success);
}
.alert-danger[b-0wvc1pdy1v] {
    background: rgba(255,59,48,0.08);
    border: 1px solid rgba(255,59,48,0.25);
    color: var(--danger);
}

/* Mobile-first overrides */
.identity-card[b-0wvc1pdy1v] { flex-direction: column; text-align: center; }
.identity-roles[b-0wvc1pdy1v] { justify-content: center; }
.form-grid[b-0wvc1pdy1v] { grid-template-columns: 1fr; }
.form-group--full[b-0wvc1pdy1v] { grid-column: 1; }

@media (min-width: 640px) {
    .identity-card[b-0wvc1pdy1v] { flex-direction: row; text-align: left; }
    .identity-roles[b-0wvc1pdy1v] { justify-content: flex-start; }
    .form-grid[b-0wvc1pdy1v] { grid-template-columns: 1fr 1fr; }
    .form-group--full[b-0wvc1pdy1v] { grid-column: 1 / -1; }
}

.profile-card-body[b-0wvc1pdy1v] {
    padding: 1.75rem;
}

.display-hint[b-0wvc1pdy1v] {
    color: var(--text-muted);
    font-size: var(--fs-sm);
    margin: 0 0 1.25rem;
}

.font-size-picker[b-0wvc1pdy1v] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.font-size-option[b-0wvc1pdy1v] {
    padding: 0.5rem 1.25rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--container-raised);
    color: var(--text-muted);
    font-family: var(--font-ui);
    font-size: var(--fs-ui);
    font-weight: 600;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.font-size-option:hover[b-0wvc1pdy1v] {
    border-color: var(--accent-dim);
    color: var(--text);
}

.font-size-option--active[b-0wvc1pdy1v] {
    border-color: var(--accent);
    background: var(--accent-muted);
    color: var(--accent);
}
/* /Components/Pages/Account/Register.razor.rz.scp.css */
.confirm-icon[b-7lktpvxlr8] {
    width: 56px;
    height: 56px;
    margin: 0 auto 0.5rem;
}
.confirm-icon svg[b-7lktpvxlr8] { width: 100%; height: 100%; }

.login-header[b-7lktpvxlr8] { text-align: center; margin-bottom: 1.5rem; }
.reg-row[b-7lktpvxlr8] { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; }
.reg-col[b-7lktpvxlr8]  { flex: 1; }
.form-group[b-7lktpvxlr8] { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 0.75rem; }
.login-submit[b-7lktpvxlr8] { width: 100%; margin-top: 0.25rem; margin-bottom: 0.75rem; justify-content: center; }
.login-footer-link[b-7lktpvxlr8] { text-align: center; font-family: var(--font-body); font-size: 0.9rem; color: var(--text-muted); margin: 0; }
.login-footer-link a[b-7lktpvxlr8] { color: var(--accent); }

/* Mobile-first: stacked by default, row at sm */
.reg-row[b-7lktpvxlr8] { flex-direction: column; gap: 0; }

@media (min-width: 640px) { .reg-row[b-7lktpvxlr8] { flex-direction: row; gap: 0.75rem; } }
/* /Components/Pages/Admin/BrandProfiles.razor.rz.scp.css */
/* Custom tab nav (replaces Bootstrap nav-tabs) */
.bp-tabs[b-qi9qeleep2] {
    display: flex;
    gap: 0.25rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: 1.25rem;
}
.bp-tab[b-qi9qeleep2] {
    padding: 0.5rem 1.1rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--text-muted);
    font-family: var(--font-ui);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
    margin-bottom: -1px;
}
.bp-tab:hover[b-qi9qeleep2] { color: var(--text); }
.bp-tab--active[b-qi9qeleep2] { color: var(--accent); border-bottom-color: var(--accent); }

/* Form group in modal */
.form-group[b-qi9qeleep2] { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 1rem; }

/* Modal error message */
.bp-modal-error[b-qi9qeleep2] {
    font-family: var(--font-body);
    font-size: 0.82rem;
    color: var(--danger);
    margin-right: auto;
}

/* Button helpers */
.btn-sm[b-qi9qeleep2] { font-size: 0.78rem !important; padding: 0.3rem 0.75rem !important; }
.btn-danger-sm[b-qi9qeleep2] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-qi9qeleep2] { background: rgba(255, 69, 58, 0.2); }
.btn-danger-sm:disabled[b-qi9qeleep2] { opacity: 0.4; cursor: not-allowed; }

/* Group container */
.bp-group[b-qi9qeleep2] {
    margin-bottom: 2.5rem;
}

.bp-group__header[b-qi9qeleep2] {
    margin-bottom: 1rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--border);
}

.bp-group__title-row[b-qi9qeleep2] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.bp-group__name[b-qi9qeleep2] {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-bright);
    margin: 0;
    letter-spacing: 0.02em;
}

.bp-group__meta[b-qi9qeleep2] {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-top: 0.2rem;
}

/* Profile cards within a group */
.bp-group__cards[b-qi9qeleep2] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

/* Individual profile card */
.bp-card[b-qi9qeleep2] {
    background: var(--card-background, var(--surface));
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    width: 280px;
    flex-shrink: 0;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.bp-card:hover[b-qi9qeleep2] {
    border-color: var(--accent-dim);
}

.bp-card--active[b-qi9qeleep2] {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent), 0 4px 16px rgba(0,0,0,0.15);
}

.bp-card--group-default[b-qi9qeleep2] {
    border-color: var(--accent-dim);
}

.bp-card--active.bp-card--group-default[b-qi9qeleep2] {
    border-color: var(--accent);
}

/* Colour swatches */
.bp-card__swatches[b-qi9qeleep2] {
    display: flex;
    height: 6px;
}

.bp-card__swatches > div[b-qi9qeleep2] {
    flex: 1;
}

/* Card body */
.bp-card__body[b-qi9qeleep2] {
    padding: 0.9rem 1rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.bp-card__head[b-qi9qeleep2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.bp-card__name[b-qi9qeleep2] {
    font-family: var(--font-heading);
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-bright);
    margin: 0;
}

.bp-card__community[b-qi9qeleep2] {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-top: 0.15rem;
}

/* Badges */
.bp-card__active-badge[b-qi9qeleep2] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: var(--accent);
    color: var(--background);
    border-radius: 4px;
    padding: 0.15rem 0.45rem;
    white-space: nowrap;
}

.bp-card__default-badge[b-qi9qeleep2] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: transparent;
    color: var(--accent-dim);
    border: 1px solid var(--accent-dim);
    border-radius: 4px;
    padding: 0.15rem 0.45rem;
    white-space: nowrap;
}

.bp-card__tag[b-qi9qeleep2] {
    font-family: var(--font-body);
    font-style: italic;
    font-size: 0.8rem;
    color: var(--text-muted);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bp-card__fonts[b-qi9qeleep2] {
    font-size: 0.72rem;
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bp-card__actions[b-qi9qeleep2] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 0.5rem;
}

/* Card footer */
.bp-card__footer[b-qi9qeleep2] {
    padding: 0.45rem 1rem;
    font-size: 0.72rem;
    color: var(--text-muted);
    border-top: 1px solid var(--border);
    background: rgba(0,0,0,0.06);
}
/* /Components/Pages/Admin/CommunityPositions.razor.rz.scp.css */
/* admin-table, role-name-cell, btn-danger-sm, form-hint - inherited from Roles.razor.css scope;
   redefine only what this component adds on top. */

.admin-table[b-zlgs9fibul] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    font-family: var(--font-body);
    font-size: 0.9rem;
}

.admin-table thead th[b-zlgs9fibul] {
    background: color-mix(in srgb, var(--accent) 5%, var(--card-bg));
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.admin-table td[b-zlgs9fibul] {
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text);
    vertical-align: middle;
}

.admin-table tbody tr:hover td[b-zlgs9fibul] { background: color-mix(in srgb, var(--accent) 3%, transparent); }
.admin-table tbody tr:last-child td[b-zlgs9fibul] { border-bottom: none; }
.admin-table .role-name-cell[b-zlgs9fibul] { font-weight: 600; color: var(--text-bright); }

.btn-danger-sm[b-zlgs9fibul] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-zlgs9fibul] { background: rgba(255, 69, 58, 0.2); }

.form-hint[b-zlgs9fibul] { font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted); margin: 0; }
.form-hint-inline[b-zlgs9fibul] { font-size: 0.8rem; color: var(--text-muted); font-weight: 400; }
.form-group[b-zlgs9fibul] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.75rem; }
.badge[b-zlgs9fibul] { display: inline-block; padding: 0.2rem 0.6rem; border-radius: 99px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.05em; font-family: var(--font-ui); }
.badge--accent[b-zlgs9fibul] { background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); }
.text-muted[b-zlgs9fibul] { color: var(--text-muted); }
/* /Components/Pages/Admin/EventTypes.razor.rz.scp.css */
.admin-table[b-ymvnyo423o] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    font-family: var(--font-body);
    font-size: 0.9rem;
}

.admin-table thead th[b-ymvnyo423o] {
    background: color-mix(in srgb, var(--accent) 5%, var(--card-bg));
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.admin-table td[b-ymvnyo423o] {
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text);
    vertical-align: middle;
}

.admin-table tbody tr:hover td[b-ymvnyo423o] { background: color-mix(in srgb, var(--accent) 3%, transparent); }
.admin-table tbody tr:last-child td[b-ymvnyo423o] { border-bottom: none; }

.event-type-swatch[b-ymvnyo423o] {
    display: inline-block;
    width: 20px; height: 20px;
    border-radius: 4px;
    border: 1px solid rgba(255,255,255,0.15);
    vertical-align: middle;
}

.btn-danger-sm[b-ymvnyo423o] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-ymvnyo423o] { background: rgba(255, 69, 58, 0.2); }

.color-input-row[b-ymvnyo423o] { display: flex; align-items: center; gap: 0.75rem; }
.form-hint[b-ymvnyo423o] { font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted); margin: 0; }
.form-group[b-ymvnyo423o] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.75rem; }
/* /Components/Pages/Admin/Permissions.razor.rz.scp.css */
.perms-page[b-uqadmhc0yu] { padding-bottom: 4rem; }

.perms-loading[b-uqadmhc0yu] {
    display: flex; align-items: center; gap: 1rem;
    justify-content: center; padding: 4rem;
    color: var(--text-muted); font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
}

.perms-grid[b-uqadmhc0yu] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
    gap: 1.25rem;
    align-items: start;
}

.perms-card[b-uqadmhc0yu] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    transition: border-color 0.15s;
}
.perms-card:hover[b-uqadmhc0yu] { border-color: color-mix(in srgb, var(--accent) 25%, transparent); }

.perms-card-header[b-uqadmhc0yu] {
    padding: 0.85rem 1.25rem;
    background: rgba(255,255,255,0.03);
    border-bottom: 1px solid var(--border);
    font-family: var(--font-heading);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--accent);
}

.perms-card-body[b-uqadmhc0yu] { padding: 0.5rem 0; }

.perm-row[b-uqadmhc0yu] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.65rem 1.25rem;
    border-bottom: 1px solid rgba(255,255,255,0.03);
}
.perm-row:last-child[b-uqadmhc0yu] { border-bottom: none; }

.perm-name[b-uqadmhc0yu] {
    font-family: 'Courier New', monospace;
    font-size: 0.78rem;
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 15%, transparent);
    border-radius: 4px;
    padding: 0.1rem 0.45rem;
    display: inline-block;
    word-break: break-all;
}

.perm-desc[b-uqadmhc0yu] {
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    line-height: 1.4;
}
/* /Components/Pages/Admin/RoleEdit.razor.rz.scp.css */
.role-edit-body[b-j2drntq2en] {
    max-width: 1100px;
}

.role-fields-row[b-j2drntq2en] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 2rem;
}

/* Permission section */
.perm-section[b-j2drntq2en] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1.5rem 1.75rem 1.75rem;
}

.perm-section-heading[b-j2drntq2en] {
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 1.25rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border);
}

.perm-grid[b-j2drntq2en] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1.75rem 2rem;
}

.perm-cat-title[b-j2drntq2en] {
    font-family: var(--font-ui);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 0.6rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--border-subtle);
}

.perm-row[b-j2drntq2en] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.32rem 0;
    cursor: pointer;
}
.perm-row:hover .perm-name[b-j2drntq2en] { color: var(--text-bright); }

.perm-name[b-j2drntq2en] {
    display: block;
    font-family: var(--font-ui);
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text);
    line-height: 1.3;
}

.perm-desc[b-j2drntq2en] {
    display: block;
    font-family: var(--font-body);
    font-size: 0.74rem;
    color: var(--text-muted);
    margin-top: 1px;
}

/* Custom checkbox */
.tree-cb[b-j2drntq2en] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 2px;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--card-bg);
    transition: background 0.12s, border-color 0.12s;
}
.tree-cb[b-j2drntq2en]::after { font-size: 11px; line-height: 1; }
.tree-cb--checked[b-j2drntq2en] { background: var(--accent); border-color: var(--accent); }
.tree-cb--checked[b-j2drntq2en]::after { content: '\2713'; color: var(--page-bg); font-weight: 700; }

/* Header action buttons */
.btn-cancel[b-j2drntq2en] {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1.25rem;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text-muted);
    font-family: var(--font-ui);
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
}
.btn-cancel:hover[b-j2drntq2en] {
    border-color: var(--text-muted);
    color: var(--text);
}

.btn-gold[b-j2drntq2en] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1.25rem;
    background: linear-gradient(135deg, var(--accent), var(--accent-mid));
    color: var(--page-bg);
    border: none;
    border-radius: 6px;
    font-family: var(--font-ui);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s, transform 0.1s;
}
.btn-gold:hover:not(:disabled)[b-j2drntq2en] { opacity: 0.9; transform: translateY(-1px); }
.btn-gold:disabled[b-j2drntq2en] { opacity: 0.55; cursor: not-allowed; }

/* Mobile-first */
.role-fields-row[b-j2drntq2en] { grid-template-columns: 1fr; }

@media (min-width: 640px) {
    .role-fields-row[b-j2drntq2en] { grid-template-columns: 1fr 1fr; }
}
/* /Components/Pages/Admin/Roles.razor.rz.scp.css */
/* Roles table - reuses admin-table pattern from Users */
.admin-table[b-eqb3ujeilo] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    font-family: var(--font-body);
    font-size: 0.9rem;
}

.admin-table thead th[b-eqb3ujeilo] {
    background: color-mix(in srgb, var(--accent) 5%, var(--card-bg));
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.admin-table td[b-eqb3ujeilo] {
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text);
    vertical-align: middle;
}

.admin-table tbody tr:hover td[b-eqb3ujeilo] { background: color-mix(in srgb, var(--accent) 3%, transparent); }
.admin-table tbody tr:last-child td[b-eqb3ujeilo] { border-bottom: none; }
.admin-table .cell-muted[b-eqb3ujeilo] { color: var(--text-muted); }
.admin-table .role-name-cell[b-eqb3ujeilo] { font-weight: 600; color: var(--text-bright); }

/* Permission count badge */
.perm-count-badge[b-eqb3ujeilo] {
    display: inline-block;
    padding: 0.18rem 0.5rem;
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent);
    border-radius: 4px;
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

/* Small buttons */
.btn-sm[b-eqb3ujeilo] { font-size: 0.78rem; padding: 0.3rem 0.7rem; }

.btn-danger-sm[b-eqb3ujeilo] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-eqb3ujeilo] { background: rgba(255, 69, 58, 0.2); }

/* Permission editor in modal */
.perm-section-label[b-eqb3ujeilo] {
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--accent);
    margin: 0.5rem 0 0.85rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--border-subtle);
}

.roles-perm-grid[b-eqb3ujeilo] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.5rem 2rem;
    padding-bottom: 0.5rem;
}

.roles-perm-category[b-eqb3ujeilo] {}

.roles-perm-cat[b-eqb3ujeilo] {
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 0.6rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--border-subtle);
}

.roles-perm-row[b-eqb3ujeilo] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.32rem 0;
    cursor: pointer;
}
.roles-perm-row:hover .roles-perm-name[b-eqb3ujeilo] { color: var(--text-bright); }

.roles-perm-name[b-eqb3ujeilo] {
    display: block;
    font-family: var(--font-ui);
    color: var(--text);
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.3;
}

.roles-perm-desc[b-eqb3ujeilo] {
    display: block;
    font-family: var(--font-body);
    color: var(--text-muted);
    font-size: 0.74rem;
    margin-top: 1px;
}

/* Custom checkbox (tree-cb style) */
.tree-cb[b-eqb3ujeilo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 2px;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--card-bg);
    transition: background 0.12s, border-color 0.12s;
}
.tree-cb[b-eqb3ujeilo]::after { font-size: 11px; line-height: 1; }
.tree-cb--checked[b-eqb3ujeilo] { background: var(--accent); border-color: var(--accent); }
.tree-cb--checked[b-eqb3ujeilo]::after { content: '\2713'; color: var(--page-bg); font-weight: 700; }

/* Modal form */
.form-grid[b-eqb3ujeilo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.form-group[b-eqb3ujeilo] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.75rem; }
.form-hint[b-eqb3ujeilo] { font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted); margin: 0; }
/* /Components/Pages/Admin/Settings.razor.rz.scp.css */
/* Feature flags table */
.settings-table[b-y9gyn1ij61] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    font-family: var(--font-body);
    font-size: 0.9rem;
}
.settings-table thead th[b-y9gyn1ij61] {
    background: color-mix(in srgb, var(--accent) 5%, var(--card-bg));
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border);
}
.settings-table td[b-y9gyn1ij61] {
    padding: 0.65rem 1rem;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    vertical-align: middle;
}
.settings-table tbody tr:last-child td[b-y9gyn1ij61] { border-bottom: none; }
.settings-table tbody tr:hover td[b-y9gyn1ij61] { background: color-mix(in srgb, var(--accent) 3%, transparent); }
.settings-table__state-col[b-y9gyn1ij61] { width: 130px; }
.settings-table__name[b-y9gyn1ij61] { font-weight: 600; color: var(--text-bright); }
.settings-table__muted[b-y9gyn1ij61] { color: var(--text-muted); font-size: 0.85rem; }

/* Button sm helpers */
.btn-sm[b-y9gyn1ij61] { font-size: 0.78rem !important; padding: 0.3rem 0.75rem !important; }
.btn-danger-sm[b-y9gyn1ij61] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-y9gyn1ij61] { background: rgba(255, 69, 58, 0.2); }

/* Spacing helpers (replace Bootstrap mt-3, ms-2, mt-1) */
.settings-save-btn[b-y9gyn1ij61] { margin-left: 0.5rem; }
.settings-add-country-btn[b-y9gyn1ij61] { margin-top: 0.75rem; }
.settings-add-level-btn[b-y9gyn1ij61] { margin-top: 0.25rem; }

/* ── Mobile-first responsive ─────────────────────────────────────────────── */
.settings-tabs[b-y9gyn1ij61] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 1.25rem;
}

/* Allow feature-flags table to scroll horizontally on narrow screens */
.settings-section[b-y9gyn1ij61] { overflow-x: auto; }

/* Hide less-essential columns on small screens */
@media (max-width: 639px) {
    .settings-table th:nth-child(2)[b-y9gyn1ij61],
    .settings-table td:nth-child(2)[b-y9gyn1ij61],
    .settings-table th:nth-child(3)[b-y9gyn1ij61],
    .settings-table td:nth-child(3)[b-y9gyn1ij61] { display: none; }
}

@media (min-width: 640px) {
    .settings-table th:nth-child(2)[b-y9gyn1ij61],
    .settings-table td:nth-child(2)[b-y9gyn1ij61],
    .settings-table th:nth-child(3)[b-y9gyn1ij61],
    .settings-table td:nth-child(3)[b-y9gyn1ij61] { display: table-cell; }
}
/* /Components/Pages/Admin/Users.razor.rz.scp.css */
/* Pending approval card */
.admin-pending-card[b-tj0uvbhhpf] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
    border-radius: 10px;
    margin-bottom: 1.5rem;
    overflow: hidden;
}

.admin-pending-card__header[b-tj0uvbhhpf] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.75rem 1.25rem;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    font-family: var(--font-heading);
    font-size: 0.9rem;
    color: var(--accent);
    letter-spacing: 0.03em;
}

.admin-pending-count[b-tj0uvbhhpf] {
    background: var(--accent);
    color: var(--page-bg);
    font-family: var(--font-ui);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.45rem;
    border-radius: 3px;
}

/* Filter bar */
.admin-filters[b-tj0uvbhhpf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 1.25rem;
    align-items: flex-end;
}

.admin-filters .field[b-tj0uvbhhpf] { min-width: 140px; }
.admin-filters .field--clear[b-tj0uvbhhpf] { min-width: 0; }

.admin-filters .form-label[b-tj0uvbhhpf] {
    font-size: 0.7rem;
    margin-bottom: 0.2rem;
}

.admin-filters .form-control[b-tj0uvbhhpf] {
    padding: 0.38rem 0.7rem;
    font-size: 0.82rem;
}

/* Admin table */
.admin-table[b-tj0uvbhhpf] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    font-family: var(--font-body);
    font-size: 0.9rem;
}

.admin-table thead th[b-tj0uvbhhpf] {
    background: color-mix(in srgb, var(--accent) 5%, var(--card-bg));
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.admin-table thead th.sortable[b-tj0uvbhhpf] { cursor: pointer; }
.admin-table thead th.sortable:hover[b-tj0uvbhhpf] { color: var(--accent-bright); }

.admin-table td[b-tj0uvbhhpf] {
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text);
    vertical-align: middle;
}

.admin-table tbody tr:hover td[b-tj0uvbhhpf] { background: color-mix(in srgb, var(--accent) 3%, transparent); }
.admin-table tbody tr:last-child td[b-tj0uvbhhpf] { border-bottom: none; }

.admin-table .cell-muted[b-tj0uvbhhpf] { color: var(--text-muted); }

/* Action buttons in table */
.btn-sm[b-tj0uvbhhpf] {
    font-size: 0.78rem;
    padding: 0.3rem 0.7rem;
}

.btn-success-sm[b-tj0uvbhhpf] {
    padding: 0.3rem 0.75rem;
    background: rgba(52, 199, 89, 0.12);
    border: 1px solid rgba(52, 199, 89, 0.3);
    color: var(--success);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-success-sm:hover[b-tj0uvbhhpf] { background: rgba(52, 199, 89, 0.22); }
.btn-success-sm:disabled[b-tj0uvbhhpf] { opacity: 0.5; cursor: not-allowed; }

.btn-danger-sm[b-tj0uvbhhpf] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-tj0uvbhhpf] { background: rgba(255, 69, 58, 0.2); }

/* Users count */
.users-count[b-tj0uvbhhpf] {
    font-family: var(--font-body);
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-top: 0.5rem;
}

/* Modal form helpers */
.form-group[b-tj0uvbhhpf] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.85rem; }
.form-group:last-child[b-tj0uvbhhpf] { margin-bottom: 0; }

.form-grid[b-tj0uvbhhpf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.roles-checklist[b-tj0uvbhhpf] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 0.5rem 0;
}

.checkbox-label[b-tj0uvbhhpf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-family: var(--font-body);
    font-size: 0.88rem;
    color: var(--text-muted);
    padding: 0.15rem 0;
}
.checkbox-label input[type="checkbox"][b-tj0uvbhhpf] { accent-color: var(--accent); width: 15px; height: 15px; cursor: pointer; }
.checkbox-label:hover span[b-tj0uvbhhpf] { color: var(--text); }

.form-section-divider[b-tj0uvbhhpf] {
    border: none;
    border-top: 1px solid var(--border);
    margin: 0.75rem 0;
}

.form-section-label[b-tj0uvbhhpf] {
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--accent);
    margin: 0 0 0.6rem;
}

/* ── Mobile responsive: card layout for admin tables ──────── */
@media (max-width: 639.98px) {
    /* Convert table to stacked cards */
    .admin-table[b-tj0uvbhhpf] {
        border: none;
        border-radius: 0;
        background: transparent;
    }
    .admin-table thead[b-tj0uvbhhpf] { display: none; }
    .admin-table tbody tr[b-tj0uvbhhpf] {
        display: block;
        background: var(--card-bg);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        margin-bottom: 0.6rem;
        padding: 0.6rem 0.85rem;
    }
    .admin-table tbody tr:last-child td[b-tj0uvbhhpf] { border-bottom: none; }
    .admin-table tbody tr:hover[b-tj0uvbhhpf] { background: color-mix(in srgb, var(--accent) 3%, var(--card-bg)); }
    .admin-table tbody tr:hover td[b-tj0uvbhhpf] { background: transparent; }
    .admin-table td[b-tj0uvbhhpf] {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding: 0.28rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.045);
        font-size: 0.83rem;
        gap: 0.5rem;
        word-break: break-word;
    }
    .admin-table td:last-child[b-tj0uvbhhpf] {
        border-bottom: none;
        padding-top: 0.5rem;
        padding-bottom: 0;
    }
    /* Generate row labels from data-label attribute */
    .admin-table td[b-tj0uvbhhpf]::before {
        content: attr(data-label);
        font-size: 0.65rem;
        font-weight: 700;
        letter-spacing: 0.09em;
        text-transform: uppercase;
        color: var(--text-muted);
        white-space: nowrap;
        flex-shrink: 0;
        padding-top: 0.1rem;
        min-width: 72px;
    }
    /* Action cells: no label prefix, wrap buttons */
    .admin-table td[data-label=""][b-tj0uvbhhpf] {
        flex-wrap: wrap;
        gap: 0.35rem;
        justify-content: flex-start;
    }
    .admin-table td[data-label=""][b-tj0uvbhhpf]::before { display: none; }

    /* Pending actions cell */
    .pending-actions[b-tj0uvbhhpf] {
        flex-wrap: wrap !important;
        gap: 0.35rem;
        justify-content: flex-start;
    }

    /* Buttons inside card action cells: min touch target */
    .admin-table .btn-gold-outline[b-tj0uvbhhpf],
    .admin-table .btn-danger-sm[b-tj0uvbhhpf],
    .admin-table .btn-success-sm[b-tj0uvbhhpf] {
        min-height: 36px;
        padding: 0.35rem 0.75rem;
    }

    /* Admin filters: 2-column grid so selects line up */
    .admin-filters[b-tj0uvbhhpf] {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .admin-filters .field[b-tj0uvbhhpf] { min-width: 0; }
    .admin-filters .field--clear[b-tj0uvbhhpf] { grid-column: 1 / -1; }
}

/* ── User profile badges ────────────────────────────────────────────────── */
.user-badge[b-tj0uvbhhpf] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-family: var(--font-ui);
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
    margin-left: 0.4rem;
    vertical-align: middle;
    white-space: nowrap;
    cursor: default;
}

.user-badge--medical[b-tj0uvbhhpf] {
    background: color-mix(in srgb, var(--danger) 15%, transparent);
    border: 1px solid color-mix(in srgb, var(--danger) 35%, transparent);
    color: var(--danger);
}

.user-badge--u18[b-tj0uvbhhpf] {
    background: color-mix(in srgb, var(--warning) 15%, transparent);
    border: 1px solid color-mix(in srgb, var(--warning) 35%, transparent);
    color: var(--warning);
}

/* ── Extended profile section (read-only in edit modal) ─────────────────── */
.profile-section-toggle[b-tj0uvbhhpf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    margin-bottom: 0.5rem;
    gap: 0.5rem;
}

.profile-section-caret[b-tj0uvbhhpf] {
    font-size: 0.7rem;
    color: var(--text-muted);
    flex-shrink: 0;
}

.profile-badges-row[b-tj0uvbhhpf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.6rem;
}

.profile-field[b-tj0uvbhhpf] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.35rem 0;
    border-bottom: 1px solid var(--border-subtle);
    font-family: var(--font-body);
    font-size: 0.85rem;
}

.profile-field--block[b-tj0uvbhhpf] {
    flex-direction: column;
    align-items: flex-start;
}

.profile-field:last-child[b-tj0uvbhhpf] { border-bottom: none; }

.profile-label[b-tj0uvbhhpf] {
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    white-space: nowrap;
    min-width: 130px;
    flex-shrink: 0;
}

.profile-value[b-tj0uvbhhpf] {
    color: var(--text);
}

.profile-subvalue[b-tj0uvbhhpf] {
    color: var(--text-muted);
    font-size: 0.82rem;
}

.profile-value--ok[b-tj0uvbhhpf] {
    color: var(--success);
}

.profile-value--none[b-tj0uvbhhpf] {
    color: var(--text-muted);
    font-style: italic;
}

.profile-medical-notes[b-tj0uvbhhpf] {
    background: color-mix(in srgb, var(--danger) 6%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--danger) 20%, transparent);
    border-radius: 6px;
    padding: 0.6rem 0.85rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text);
    line-height: 1.55;
    white-space: pre-wrap;
    width: 100%;
}
/* /Components/Pages/Analytics/Analytics.razor.rz.scp.css */
.analytics-page[b-972hkvopuq] { max-width: 1200px; margin: 0 auto; padding: 1rem 0.75rem 3rem; }

@media (min-width: 640px) { .analytics-page[b-972hkvopuq] { padding: 2rem 1.25rem 4rem; } }

.analytics-header[b-972hkvopuq] { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 1rem; }
.analytics-title[b-972hkvopuq] { font-family: var(--font-heading); font-size: 1.4rem; color: var(--accent); margin: 0 0 0.25rem; }
.analytics-subtitle[b-972hkvopuq] { font-family: var(--font-body); color: var(--text-muted); margin: 0; font-size: 0.9rem; }
.analytics-header-right[b-972hkvopuq] { display: flex; flex-direction: column; align-items: flex-start; gap: 0.75rem; width: 100%; }
.analytics-nav[b-972hkvopuq] { display: flex; gap: 0.4rem; flex-wrap: wrap; justify-content: flex-start; }

@media (min-width: 640px) {
    .analytics-header[b-972hkvopuq] { flex-direction: row; align-items: flex-end; margin-bottom: 2rem; }
    .analytics-title[b-972hkvopuq] { font-size: 2rem; }
    .analytics-subtitle[b-972hkvopuq] { font-size: 0.95rem; }
    .analytics-header-right[b-972hkvopuq] { align-items: flex-end; width: auto; }
    .analytics-nav[b-972hkvopuq] { justify-content: flex-end; }
}

.alert[b-972hkvopuq] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; margin-bottom: 1rem; }
.alert-danger[b-972hkvopuq] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }
.alert-success[b-972hkvopuq] { background: rgba(52,199,89,0.1); border: 1px solid rgba(52,199,89,0.3); color: var(--success); }

.analytics-loading[b-972hkvopuq] { display: flex; align-items: center; gap: 1rem; justify-content: center; padding: 3rem; color: var(--text-muted); font-family: var(--font-body); }

/* ── Summary cards ────────────────────────────────────────── */
.summary-grid[b-972hkvopuq] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.stat-card[b-972hkvopuq] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1.25rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    position: relative;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}
.stat-card[b-972hkvopuq]::before {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 80px; height: 80px;
    background: radial-gradient(circle, color-mix(in srgb, var(--accent) 15%, transparent) 0%, transparent 70%);
    pointer-events: none;
}
.stat-value[b-972hkvopuq] { font-family: var(--font-heading); font-size: 2rem; color: var(--accent); line-height: 1; position: relative; }
.stat-label[b-972hkvopuq] { font-family: var(--font-body); font-size: 0.75rem; color: var(--text-muted); text-align: center; position: relative; }

/* ── Top actions list ─────────────────────────────────────── */
.top-actions-list[b-972hkvopuq] { display: flex; flex-direction: column; gap: 0.4rem; }
.top-action-row[b-972hkvopuq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: color-mix(in srgb, var(--accent) 3%, var(--card-bg));
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.88rem;
}
.top-action-name[b-972hkvopuq] { flex: 1; color: var(--text); }
.top-action-bar[b-972hkvopuq] { width: 100px; height: 5px; background: var(--border); border-radius: 3px; overflow: hidden; flex-shrink: 0; }
.top-action-bar__fill[b-972hkvopuq] { height: 100%; background: var(--accent); border-radius: 3px; }
.top-action-count[b-972hkvopuq] { color: var(--accent); font-weight: 600; min-width: 36px; text-align: right; }

/* ── Rules panel ──────────────────────────────────────────── */
.rules-panel[b-972hkvopuq] { border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
.rules-desc[b-972hkvopuq] { font-family: var(--font-body); font-size: 0.85rem; color: var(--text-muted); margin-bottom: 1.25rem; }
.form-subtitle[b-972hkvopuq] { font-family: var(--font-heading); font-size: 0.9rem; color: var(--text-muted); margin: 0 0 0.75rem; }
.new-rule-form[b-972hkvopuq] { background: rgba(255,255,255,0.02); border: 1px solid var(--border); border-radius: 8px; padding: 1rem; margin-bottom: 1.5rem; }
.rule-form-row[b-972hkvopuq] { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.75rem; }
.rule-reason[b-972hkvopuq] { flex: 1 1 200px; }
.rule-add-btn[b-972hkvopuq] { align-self: flex-end; padding: 0.45rem 1.1rem; }
.rule-inactive td[b-972hkvopuq] { opacity: 0.45; }
.rule-target[b-972hkvopuq] { color: var(--text); }
.rule-actions[b-972hkvopuq] { display: flex; gap: 0.4rem; white-space: nowrap; }
.badge[b-972hkvopuq] { display: inline-block; padding: 0.15rem 0.55rem; border-radius: 4px; font-family: var(--font-body); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em; }
.badge-rule[b-972hkvopuq] { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); }
.badge-active[b-972hkvopuq] { background: rgba(52,199,89,0.12); color: var(--success); border: 1px solid rgba(52,199,89,0.3); }
.badge-inactive[b-972hkvopuq] { background: rgba(255,255,255,0.06); color: var(--text-muted); border: 1px solid var(--border); }
.rules-table[b-972hkvopuq] { margin-top: 0; }
.btn-xs[b-972hkvopuq] { padding: 0.25rem 0.6rem; font-size: 0.75rem; border-radius: 4px; cursor: pointer; }
.btn-danger[b-972hkvopuq] { padding: 0.45rem 1rem; background: rgba(255,69,58,0.15); border: 1px solid rgba(255,69,58,0.3); color: var(--danger, #ff453a); border-radius: 6px; font-family: var(--font-body); font-size: 0.82rem; cursor: pointer; }
.btn-danger:hover[b-972hkvopuq] { background: rgba(255,69,58,0.25); }
.btn-danger-outline[b-972hkvopuq] { padding: 0.45rem 1rem; border: 1px solid rgba(255,69,58,0.4); background: transparent; color: var(--danger, #ff453a); border-radius: 6px; font-family: var(--font-body); font-size: 0.82rem; cursor: pointer; }
.btn-danger-outline:hover[b-972hkvopuq] { background: rgba(255,69,58,0.1); }

/* ── Filter bar ───────────────────────────────────────────── */
.filter-bar[b-972hkvopuq] { margin-bottom: 1.5rem; }
.filter-bar .section-title[b-972hkvopuq] { display: none; }

/* Mobile-first: single column, all controls stack vertically */
.filter-controls[b-972hkvopuq] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
}

.filter-controls .form-control[b-972hkvopuq] {
    width: 100%;
    box-sizing: border-box;
    min-width: 0;
    color-scheme: dark;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
}

.filter-controls .form-control:focus[b-972hkvopuq] {
    outline: none;
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
}

.filter-actions[b-972hkvopuq] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-end;
    white-space: nowrap;
}

/* Desktop: single row with proportional columns */
@media (min-width: 640px) {
    .filter-controls[b-972hkvopuq] {
        grid-template-columns: 2fr 1.5fr 1fr 1fr auto;
        align-items: end;
        gap: 0.75rem;
    }
    .filter-actions[b-972hkvopuq] { justify-content: initial; }
}

/* ── Form controls (outside filter) ──────────────────────── */
.form-control[b-972hkvopuq] {
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
    width: 100%;
    box-sizing: border-box;
    color-scheme: dark;
}
.form-control:focus[b-972hkvopuq] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }
.form-group[b-972hkvopuq] { display: flex; flex-direction: column; gap: 0.35rem; }
.form-label[b-972hkvopuq] { font-family: var(--font-body); font-size: 0.7rem; color: var(--text-muted); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 0.3rem; display: block; }

/* ── Buttons ──────────────────────────────────────────────── */
.btn-gold[b-972hkvopuq] { text-transform: uppercase; letter-spacing: 0.06em; }
.btn-secondary[b-972hkvopuq] {
    padding: 0.5rem 1rem;
    background: transparent;
    border: 1px solid var(--border);
    color: var(--text-muted);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.82rem;
    cursor: pointer;
    letter-spacing: 0.04em;
}
.btn-secondary:hover[b-972hkvopuq] { border-color: var(--text-muted); color: var(--text); }
.btn-secondary:disabled[b-972hkvopuq] { opacity: 0.4; cursor: not-allowed; }

/* ── Action log table ─────────────────────────────────────── */
.no-actions[b-972hkvopuq] { font-family: var(--font-body); color: var(--text-muted); text-align: center; padding: 2rem; }

/* Bleed the table to the card edges for a full-width look */
.actions-table-wrapper[b-972hkvopuq] {
    overflow-x: auto;
    margin: 0 -1.5rem;
}
.actions-table[b-972hkvopuq] {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--font-body);
    font-size: 0.85rem;
}
.actions-table th[b-972hkvopuq] {
    text-align: left;
    padding: 0.55rem 0.75rem;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    color: var(--text-muted);
    font-size: 0.68rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    white-space: nowrap;
    background: rgba(255,255,255,0.015);
}
.actions-table td[b-972hkvopuq] {
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    color: var(--text);
    vertical-align: middle;
}
/* Re-align first/last columns with the card's 1.5rem padding */
.actions-table th:first-child[b-972hkvopuq],
.actions-table td:first-child[b-972hkvopuq] { padding-left: 1.5rem; }
.actions-table th:last-child[b-972hkvopuq],
.actions-table td:last-child[b-972hkvopuq]  { padding-right: 1.5rem; }

.action-row[b-972hkvopuq] { cursor: pointer; transition: background 0.12s; }
.action-row:hover td[b-972hkvopuq] { background: rgba(255,255,255,0.03); }

/* Rule-flagged rows - yellow/amber tint */
.row-flagged td[b-972hkvopuq]               { background: color-mix(in srgb, var(--accent) 6%, transparent) !important; }
.row-flagged:hover td[b-972hkvopuq]         { background: color-mix(in srgb, var(--accent) 10%, transparent) !important; }
/* Direct-flagged rows - red tint */
.row-flagged-direct td[b-972hkvopuq]        { background: rgba(255,69,58,0.08) !important; }
.row-flagged-direct:hover td[b-972hkvopuq]  { background: rgba(255,69,58,0.13) !important; }

/* Flag column */
.cell-flag[b-972hkvopuq] { width: 24px; text-align: center; padding-right: 0 !important; }
.flag-icon[b-972hkvopuq] { font-size: 1rem; cursor: default; }
.flag-direct[b-972hkvopuq] { color: var(--danger, #ff453a); }
.flag-rule[b-972hkvopuq]   { color: var(--accent); } /* amber, matches screenshot */

/* WHEN column */
.cell-time[b-972hkvopuq] { color: var(--text-muted); white-space: nowrap; font-size: 0.8rem; }

/* ACTION column */
.cell-type[b-972hkvopuq] { color: var(--accent); font-size: 0.83rem; font-weight: 500; }

/* USER column - name bold + bright, email small + muted below */
.cell-actor[b-972hkvopuq] { }
.actor-name[b-972hkvopuq]  { display: block; color: var(--text-bright, #f0e8d8); font-weight: 600; }
.actor-email[b-972hkvopuq] { display: block; font-size: 0.74rem; color: var(--text-muted); margin-top: 0.1rem; }

/* TARGET column */
.cell-target[b-972hkvopuq] { color: var(--text-muted); font-size: 0.83rem; }

/* ── Role badges ──────────────────────────────────────────── */
/* Base style - Admin / gold (default) */
.role-badge[b-972hkvopuq] {
    display: inline-block;
    padding: 0.18rem 0.6rem;
    border-radius: 4px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    white-space: nowrap;
    /* Default: gold (Admin) */
    background: color-mix(in srgb, var(--accent) 18%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
    color: var(--accent);
}

/* EventOrganiser - teal */
.role-badge-eventorganiser[b-972hkvopuq],
.role-badge[data-role="EventOrganiser"][b-972hkvopuq] {
    background: rgba(32,178,170,0.15);
    border-color: rgba(32,178,170,0.4);
    color: #4ecdc4;
}

/* User - subtle grey */
.role-badge-user[b-972hkvopuq],
.role-badge[data-role="User"][b-972hkvopuq] {
    background: rgba(255,255,255,0.06);
    border-color: rgba(255,255,255,0.12);
    color: var(--text-muted);
}

/* Analyst - slate blue */
.role-badge-analyst[b-972hkvopuq],
.role-badge[data-role="Analyst"][b-972hkvopuq] {
    background: rgba(99,130,210,0.15);
    border-color: rgba(99,130,210,0.4);
    color: #8fa8e8;
}

/* Moderator - purple */
.role-badge-moderator[b-972hkvopuq],
.role-badge[data-role="Moderator"][b-972hkvopuq] {
    background: rgba(155,89,182,0.15);
    border-color: rgba(155,89,182,0.4);
    color: #c39bd3;
}

/* ── Pagination ───────────────────────────────────────────── */
.pagination[b-972hkvopuq] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 1.25rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--border);
    font-family: var(--font-body);
    font-size: 0.82rem;
    flex-wrap: wrap;
}
.page-info[b-972hkvopuq] { color: var(--text-muted); }
.form-control-number[b-972hkvopuq] {
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 6px;
    padding: 0.4rem 0.5rem;
    font-family: var(--font-body);
    font-size: 0.82rem;
    width: 5ch;
    flex: 0 0 auto;
    box-sizing: content-box;
    color-scheme: dark;
}
.form-control-number:focus[b-972hkvopuq] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }

/* ── Mobile responsive ───────────────────────────────────── */
@media (max-width: 639.98px) {
    .analytics-page[b-972hkvopuq] { padding: 1rem 0.75rem 3rem; }

    /* Summary cards: 2 per row on phones */
    .summary-grid[b-972hkvopuq] { grid-template-columns: repeat(2, 1fr); gap: 0.65rem; }
    .stat-value[b-972hkvopuq] { font-size: 1.5rem; }

    /* Hide role and target columns - show only flag/time/action/actor */
    .cell-role[b-972hkvopuq],
    .cell-target[b-972hkvopuq] { display: none; }
    .actions-table th:nth-child(5)[b-972hkvopuq],
    .actions-table th:nth-child(6)[b-972hkvopuq] { display: none; }

    /* Don't show actor email to save vertical space */
    .actor-email[b-972hkvopuq] { display: none; }

    /* Reduce bleed margin on narrow screens */
    .actions-table-wrapper[b-972hkvopuq] { margin: 0 -0.75rem; }
    .actions-table th:first-child[b-972hkvopuq],
    .actions-table td:first-child[b-972hkvopuq] { padding-left: 0.75rem; }
    .actions-table th:last-child[b-972hkvopuq],
    .actions-table td:last-child[b-972hkvopuq]  { padding-right: 0.75rem; }

    /* Stack pagination controls vertically */
    .pagination[b-972hkvopuq] { flex-direction: column; align-items: center; gap: 0.4rem; padding-top: 1rem; }
    .page-info[b-972hkvopuq] { order: -1; }

    /* Filter actions: full width so buttons don't crowd */
    .filter-actions[b-972hkvopuq] { width: 100%; justify-content: flex-end; }

    /* Rule form stacks vertically */
    .rule-form-row[b-972hkvopuq] { flex-direction: column; }
    .rule-add-btn[b-972hkvopuq] { align-self: stretch; text-align: center; }

    /* Flag/watch forms stack on small screens */
    .flag-form[b-972hkvopuq],
    .watch-form[b-972hkvopuq] { flex-direction: column; align-items: stretch; }
    .flag-reason-input[b-972hkvopuq] { min-width: 0; }
}

/* ── Action detail modal ──────────────────────────────────── */
.detail-modal[b-972hkvopuq] { border-color: color-mix(in srgb, var(--accent) 25%, transparent); }
.detail-header-inner[b-972hkvopuq] { display: flex; align-items: center; gap: 0.75rem; }
.detail-flag-badge[b-972hkvopuq] { display: inline-block; padding: 0.2rem 0.65rem; border-radius: 4px; font-family: var(--font-body); font-size: 0.75rem; font-weight: 600; }
.badge-flagged-direct[b-972hkvopuq] { background: rgba(255,69,58,0.15); border: 1px solid rgba(255,69,58,0.35); color: var(--danger, #ff453a); }
.badge-flagged-rule[b-972hkvopuq]   { background: rgba(201,168,76,0.12); border: 1px solid rgba(201,168,76,0.3); color: var(--accent); }

.detail-body[b-972hkvopuq] { display: flex; flex-direction: column; gap: 1.25rem; }
.detail-grid[b-972hkvopuq] { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }

@media (min-width: 640px) { .detail-grid[b-972hkvopuq] { grid-template-columns: 1fr 1fr; } }
.detail-section[b-972hkvopuq] { background: rgba(255,255,255,0.02); border: 1px solid var(--border); border-radius: 8px; padding: 1rem; }
.detail-flag-info[b-972hkvopuq] { grid-column: 1 / -1; border-color: rgba(255,69,58,0.25); background: rgba(255,69,58,0.04); }
.detail-section-title[b-972hkvopuq] { font-family: var(--font-heading); font-size: 0.8rem; color: var(--accent); letter-spacing: 0.06em; text-transform: uppercase; margin: 0 0 0.75rem; }
.detail-row[b-972hkvopuq] { display: flex; gap: 0.75rem; margin-bottom: 0.5rem; align-items: flex-start; }
.detail-label[b-972hkvopuq] { font-family: var(--font-body); font-size: 0.78rem; color: var(--text-muted); min-width: 70px; padding-top: 0.05rem; }
.detail-value[b-972hkvopuq] { font-family: var(--font-body); font-size: 0.88rem; color: var(--text); flex: 1; word-break: break-word; }
.type-value[b-972hkvopuq] { color: var(--accent); font-weight: 600; }
.actor-name-large[b-972hkvopuq] { font-weight: 600; }
.detail-subtext[b-972hkvopuq] { color: var(--text-muted); font-size: 0.78rem; }

.detail-flag-actions[b-972hkvopuq] { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem; padding-top: 0.5rem; border-top: 1px solid var(--border); }
.flag-form[b-972hkvopuq] { display: flex; gap: 0.5rem; align-items: center; flex: 1; }
.flag-reason-input[b-972hkvopuq] { flex: 1; min-width: 150px; }

.detail-watch-section[b-972hkvopuq] { padding: 1rem; background: rgba(255,159,10,0.05); border: 1px solid rgba(255,159,10,0.2); border-radius: 8px; display: flex; flex-direction: column; gap: 0.6rem; }
.detail-watch-header[b-972hkvopuq] { display: flex; align-items: center; gap: 0.6rem; }
.detail-watch-title[b-972hkvopuq] { font-family: var(--font-heading); font-size: 0.78rem; color: var(--accent); letter-spacing: 0.05em; text-transform: uppercase; }
.detail-watch-actor[b-972hkvopuq] { font-family: var(--font-body); font-size: 0.85rem; color: var(--text); font-weight: 500; }
.watch-form[b-972hkvopuq] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.btn-warning[b-972hkvopuq] { padding: 0.45rem 1rem; background: rgba(255,159,10,0.12); border: 1px solid rgba(255,159,10,0.35); color: var(--accent); border-radius: 6px; font-family: var(--font-body); font-size: 0.82rem; cursor: pointer; white-space: nowrap; }
.btn-warning:hover[b-972hkvopuq] { background: rgba(255,159,10,0.2); }
.btn-warning:disabled[b-972hkvopuq] { opacity: 0.4; cursor: not-allowed; }
/* /Components/Pages/Analytics/AnalyticsCharts.razor.rz.scp.css */
.charts-page[b-bu2rynskfa] { max-width: 1200px; margin: 0 auto; padding: 2rem 1rem 4rem; }

.charts-header[b-bu2rynskfa] { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2rem; flex-wrap: wrap; gap: 1rem; }
.charts-title[b-bu2rynskfa] { font-family: var(--font-heading); font-size: 2rem; color: var(--accent); margin: 0 0 0.25rem; }
.charts-subtitle[b-bu2rynskfa] { font-family: var(--font-body); color: var(--text-muted); margin: 0; font-size: 0.95rem; }

.analytics-nav[b-bu2rynskfa] { display: flex; gap: 0.4rem; flex-wrap: wrap; }

.alert[b-bu2rynskfa] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; margin-bottom: 1rem; }
.alert-danger[b-bu2rynskfa] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }

.filter-card[b-bu2rynskfa] { padding: 1.25rem 1.5rem; }
.filter-row[b-bu2rynskfa] { display: flex; flex-direction: column; gap: 1rem; }
.preset-group[b-bu2rynskfa] { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.preset-btn[b-bu2rynskfa] { padding: 0.3rem 0.8rem; border-radius: 20px; border: 1px solid var(--border); background: transparent; color: var(--text-muted); font-family: var(--font-body); font-size: 0.78rem; cursor: pointer; transition: all 0.15s; }
.preset-btn:hover[b-bu2rynskfa] { border-color: color-mix(in srgb, var(--accent) 40%, transparent); color: var(--accent); }
.preset-btn--active[b-bu2rynskfa] { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.filter-inline[b-bu2rynskfa] { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.75rem; }
.form-group[b-bu2rynskfa] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-label[b-bu2rynskfa] { font-family: var(--font-body); font-size: 0.75rem; color: var(--text-muted); letter-spacing: 0.04em; }
.form-control[b-bu2rynskfa] { background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: var(--text); border-radius: 6px; padding: 0.42rem 0.65rem; font-family: var(--font-body); font-size: 0.82rem; }
.form-control:focus[b-bu2rynskfa] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }
.btn-gold[b-bu2rynskfa] { padding: 0.45rem 1.1rem; font-size: 0.82rem; text-transform: none; align-self: flex-end; }

.charts-loading[b-bu2rynskfa] { display: flex; align-items: center; gap: 1rem; justify-content: center; padding: 4rem; color: var(--text-muted); font-family: var(--font-body); }

.chart-header[b-bu2rynskfa] { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 1.25rem; flex-wrap: wrap; gap: 0.5rem; }
.chart-meta[b-bu2rynskfa] { font-family: var(--font-body); font-size: 0.8rem; color: var(--text-muted); }

.no-data[b-bu2rynskfa] { font-family: var(--font-body); color: var(--text-muted); text-align: center; padding: 2rem; }

/* Bar Chart */
.bar-chart-container[b-bu2rynskfa] { display: flex; gap: 0.5rem; }
.bar-chart-yaxis[b-bu2rynskfa] { display: flex; flex-direction: column; justify-content: space-between; min-width: 32px; text-align: right; flex-shrink: 0; }
.yaxis-label[b-bu2rynskfa] { font-family: var(--font-body); font-size: 0.7rem; color: var(--text-muted); line-height: 1; }
.bar-chart-inner[b-bu2rynskfa] { flex: 1; overflow-x: auto; padding-bottom: 22px; }
.bars-and-grid[b-bu2rynskfa] { position: relative; display: flex; align-items: flex-end; gap: 2px; min-width: min-content; }
.gridline[b-bu2rynskfa] { position: absolute; left: 0; right: 0; height: 1px; background: rgba(255,255,255,0.07); pointer-events: none; }
.bar-col[b-bu2rynskfa] { flex: 1; min-width: 7px; max-width: 32px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; cursor: default; }
.bar[b-bu2rynskfa] { width: 100%; background: var(--accent); border-radius: 2px 2px 0 0; transition: opacity 0.15s; }
.bar:hover[b-bu2rynskfa] { opacity: 0.75; }
.bar--zero[b-bu2rynskfa] { background: color-mix(in srgb, var(--accent) 18%, transparent); height: 2px !important; }
.bar-label[b-bu2rynskfa] { position: absolute; top: calc(100% + 4px); left: 50%; transform: translateX(-50%); font-family: var(--font-body); font-size: 0.62rem; color: var(--text-muted); white-space: nowrap; }

/* Breakdown */
.breakdown-list[b-bu2rynskfa] { display: flex; flex-direction: column; gap: 0.6rem; }
.breakdown-row[b-bu2rynskfa] { display: flex; align-items: center; gap: 0.75rem; }
.breakdown-name[b-bu2rynskfa] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text); min-width: 180px; }
.breakdown-bar-track[b-bu2rynskfa] { flex: 1; height: 8px; background: rgba(255,255,255,0.06); border-radius: 4px; overflow: hidden; }
.breakdown-bar[b-bu2rynskfa] { height: 100%; background: var(--accent); border-radius: 4px; transition: width 0.3s ease; }
.breakdown-count[b-bu2rynskfa] { font-family: var(--font-body); font-size: 0.82rem; color: var(--accent); font-weight: 600; min-width: 40px; text-align: right; }
/* /Components/Pages/Analytics/EventAttendances.razor.rz.scp.css */
.attendance-page[b-87j3y2hbyf] { max-width: 1100px; margin: 0 auto; padding: 2rem 1rem 4rem; }

.attendance-header[b-87j3y2hbyf] { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2rem; flex-wrap: wrap; gap: 1rem; }
.attendance-title[b-87j3y2hbyf] { font-family: var(--font-heading); font-size: 2rem; color: var(--accent); margin: 0 0 0.25rem; }
.attendance-subtitle[b-87j3y2hbyf] { font-family: var(--font-body); color: var(--text-muted); margin: 0; font-size: 0.95rem; }

.analytics-nav[b-87j3y2hbyf] { display: flex; gap: 0.4rem; flex-wrap: wrap; }

.alert[b-87j3y2hbyf] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; margin-bottom: 1rem; }
.alert-danger[b-87j3y2hbyf] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }

.filter-card[b-87j3y2hbyf] { padding: 1.1rem 1.5rem; }
.filter-inline[b-87j3y2hbyf] { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1.25rem; }
.filter-toggles[b-87j3y2hbyf] { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.toggle-label[b-87j3y2hbyf] { display: flex; align-items: center; gap: 0.4rem; font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); cursor: pointer; user-select: none; }
.toggle-label input[b-87j3y2hbyf] { cursor: pointer; accent-color: var(--accent); }
.form-group[b-87j3y2hbyf] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-label[b-87j3y2hbyf] { font-family: var(--font-body); font-size: 0.75rem; color: var(--text-muted); letter-spacing: 0.04em; }
.form-control[b-87j3y2hbyf] { background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: var(--text); border-radius: 6px; padding: 0.42rem 0.65rem; font-family: var(--font-body); font-size: 0.82rem; min-width: 200px; }
.form-control:focus[b-87j3y2hbyf] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }

.attendance-loading[b-87j3y2hbyf] { display: flex; align-items: center; gap: 1rem; justify-content: center; padding: 4rem; color: var(--text-muted); font-family: var(--font-body); }

.no-data[b-87j3y2hbyf] { font-family: var(--font-body); color: var(--text-muted); text-align: center; padding: 2rem; }

.event-count-bar[b-87j3y2hbyf] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); margin-bottom: 1rem; }

/* Event Cards */
.event-card[b-87j3y2hbyf] { background: var(--card-bg); border: 1px solid var(--border); border-radius: 10px; margin-bottom: 0.75rem; overflow: hidden; }
.event-card--deleted[b-87j3y2hbyf] { opacity: 0.6; border-style: dashed; }
.event-card-header[b-87j3y2hbyf] { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; cursor: pointer; transition: background 0.1s; flex-wrap: wrap; gap: 0.75rem; }
.event-card-header:hover[b-87j3y2hbyf] { background: rgba(255,255,255,0.03); }
.event-card-info[b-87j3y2hbyf] { display: flex; flex-direction: column; gap: 0.2rem; }
.event-card-title[b-87j3y2hbyf] { font-family: var(--font-heading); font-size: 1rem; color: var(--text); display: flex; align-items: center; gap: 0.5rem; }
.event-card-date[b-87j3y2hbyf] { font-family: var(--font-body); font-size: 0.78rem; color: var(--text-muted); }
.event-card-stats[b-87j3y2hbyf] { display: flex; align-items: center; gap: 0.5rem; }
.stat-pill[b-87j3y2hbyf] { display: inline-block; padding: 0.15rem 0.6rem; border-radius: 12px; font-family: var(--font-body); font-size: 0.75rem; font-weight: 600; }
.stat-pill--going[b-87j3y2hbyf] { background: rgba(52,199,89,0.1); border: 1px solid rgba(52,199,89,0.3); color: var(--success); }
.stat-pill--cancelled[b-87j3y2hbyf] { background: rgba(255,69,58,0.1); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }
.expand-chevron[b-87j3y2hbyf] { font-size: 0.7rem; color: var(--text-muted); margin-left: 0.5rem; }

.badge[b-87j3y2hbyf] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 4px; font-family: var(--font-body); font-size: 0.68rem; font-weight: 600; }
.badge-deleted[b-87j3y2hbyf] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.25); color: var(--danger); }

.event-card-body[b-87j3y2hbyf] { padding: 0 1.25rem 1.25rem; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 1.25rem; }
.attendee-section[b-87j3y2hbyf] { padding-top: 1.25rem; }
.attendee-section-title[b-87j3y2hbyf] { display: flex; align-items: center; gap: 0.5rem; font-family: var(--font-heading); font-size: 0.85rem; color: var(--text-muted); letter-spacing: 0.05em; text-transform: uppercase; margin: 0 0 0.75rem; }
.dot[b-87j3y2hbyf] { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dot--green[b-87j3y2hbyf] { background: var(--success); }
.dot--red[b-87j3y2hbyf] { background: var(--danger); }
.attendee-empty[b-87j3y2hbyf] { font-family: var(--font-body); color: var(--text-muted); font-size: 0.85rem; margin: 0; }

.attendee-table[b-87j3y2hbyf] { width: 100%; border-collapse: collapse; font-family: var(--font-body); font-size: 0.83rem; }
.attendee-table th[b-87j3y2hbyf] { text-align: left; padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--border); color: var(--text-muted); font-size: 0.7rem; letter-spacing: 0.06em; text-transform: uppercase; }
.attendee-table td[b-87j3y2hbyf] { padding: 0.45rem 0.6rem; border-bottom: 1px solid rgba(255,255,255,0.04); color: var(--text); vertical-align: middle; }
.attendee-name[b-87j3y2hbyf] { font-weight: 500; }
.attendee-expand-icon[b-87j3y2hbyf] { font-size: 0.6rem; color: var(--text-muted); margin-left: 0.4rem; vertical-align: middle; }
.attendee-row--clickable[b-87j3y2hbyf] { cursor: pointer; }
.attendee-row--clickable:hover td[b-87j3y2hbyf] { background: rgba(255,255,255,0.03); }
.attendee-detail-row td[b-87j3y2hbyf] { padding: 0 0.6rem 0.55rem; border-bottom: 1px solid rgba(255,255,255,0.04); }
.attendee-detail[b-87j3y2hbyf] { display: flex; flex-wrap: wrap; gap: 1.25rem; padding: 0.5rem 0.75rem; background: rgba(255,255,255,0.02); border-radius: 6px; border: 1px solid var(--border); }
.attendee-detail-item[b-87j3y2hbyf] { display: flex; align-items: center; gap: 0.4rem; font-family: var(--font-body); font-size: 0.8rem; }
.attendee-detail-label[b-87j3y2hbyf] { color: var(--text-muted); font-size: 0.72rem; letter-spacing: 0.04em; text-transform: uppercase; }
.attendee-detail-value[b-87j3y2hbyf] { color: var(--accent); font-weight: 500; }
.attendee-email[b-87j3y2hbyf] { color: var(--text-muted); font-size: 0.78rem; }
.attendee-time[b-87j3y2hbyf] { color: var(--text-muted); font-size: 0.78rem; white-space: nowrap; }
.row-cancelled td[b-87j3y2hbyf] { background: rgba(255,69,58,0.04); }
.cancelled-time[b-87j3y2hbyf] { color: var(--danger); }

/* ── Mobile responsive ──────────────────────────────────── */
@media (max-width: 639.98px) {
    .attendance-page[b-87j3y2hbyf] { padding: 1rem 0.75rem 3rem; }

    /* Fix form-control min-width that causes horizontal overflow */
    .form-control[b-87j3y2hbyf] { min-width: 0; width: 100%; }

    /* Stack the two filter rows vertically */
    .filter-inline[b-87j3y2hbyf] { flex-direction: column; align-items: stretch; gap: 0.75rem; }

    /* Min-days inputs: keep them inline side-by-side */
    .form-group--inline[b-87j3y2hbyf] { flex-direction: row; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
    .form-group--inline .form-label[b-87j3y2hbyf] { white-space: nowrap; flex-shrink: 0; margin-bottom: 0; }
    .form-group--inline .form-control[b-87j3y2hbyf] { width: 80px; min-width: 0; flex-shrink: 1; }

    /* Stack toggle checkboxes to a single column */
    .filter-toggles[b-87j3y2hbyf] { flex-direction: column; align-items: flex-start; gap: 0.4rem; }

    /* Filter card padding */
    .filter-card[b-87j3y2hbyf] { padding: 0.85rem 1rem; }

    /* Tighter event card padding on small screens */
    .event-card-header[b-87j3y2hbyf] { padding: 0.75rem 1rem; }
    .event-card-body[b-87j3y2hbyf] { padding: 0 0.85rem 1rem; }

    /* Hide email column from all attendee tables */
    .attendee-table th:nth-child(2)[b-87j3y2hbyf] { display: none; }
    .attendee-email[b-87j3y2hbyf] { display: none; }

    /* Hide days-before column from cancellations table */
    .attendee-section--cancel .attendee-table th:nth-child(4)[b-87j3y2hbyf] { display: none; }
    .attendee-days[b-87j3y2hbyf] { display: none; }

    /* Allow long timestamps to wrap */
    .attendee-time[b-87j3y2hbyf] { white-space: normal; font-size: 0.72rem; }

    /* Make event title wrap gracefully */
    .event-card-title[b-87j3y2hbyf] { word-break: break-word; }

    /* Wrap stat pills and chevron in header */
    .event-card-stats[b-87j3y2hbyf] { flex-wrap: wrap; }
}
/* /Components/Pages/Community/AnnouncementDetail.razor.rz.scp.css */
.ann-detail-page[b-598x8uv0id] { max-width: 800px; margin: 0 auto; padding: 2rem 1rem 4rem; }

.detail-loading[b-598x8uv0id] {
    display: flex; align-items: center; gap: 1rem;
    justify-content: center; padding: 8rem;
    color: var(--text-muted); font-family: var(--font-body);
}

.detail-error[b-598x8uv0id] {
    text-align: center; padding: 4rem; color: var(--text-muted);
    font-family: var(--font-body); display: flex; flex-direction: column;
    align-items: center; gap: 1rem;
}

.ann-detail-topbar[b-598x8uv0id] {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 2rem; flex-wrap: wrap; gap: 0.75rem;
}
.ann-detail-actions[b-598x8uv0id] { display: flex; gap: 0.6rem; }

.btn-back[b-598x8uv0id] {
    background: none; border: none; color: var(--text-muted);
    font-family: var(--font-body); font-size: 0.9rem; cursor: pointer;
    padding: 0; transition: color 0.15s;
}
.btn-back:hover[b-598x8uv0id] { color: var(--accent); }

.btn-outline[b-598x8uv0id] {
    padding: 0.45rem 1rem; border: 1px solid var(--border);
    background: transparent; color: var(--text-muted);
    border-radius: 6px; font-family: var(--font-body); font-size: 0.83rem;
    cursor: pointer; transition: border-color 0.15s, color 0.15s;
}
.btn-outline:hover[b-598x8uv0id] { border-color: var(--accent); color: var(--accent); }

.btn-danger-outline[b-598x8uv0id] {
    padding: 0.45rem 1rem; border: 1px solid rgba(255,69,58,0.4);
    background: transparent; color: rgba(255,69,58,0.8);
    border-radius: 6px; font-family: var(--font-body); font-size: 0.83rem;
    cursor: pointer; transition: all 0.15s;
}
.btn-danger-outline:hover[b-598x8uv0id] { border-color: var(--danger); color: var(--danger); background: rgba(255,69,58,0.08); }

.alert[b-598x8uv0id] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; margin-bottom: 1.5rem; }
.alert-danger[b-598x8uv0id] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }

.ann-detail-header[b-598x8uv0id] {
    border-bottom: 1px solid var(--border);
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
}
.ann-meta-line[b-598x8uv0id] {
    display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap;
    font-family: var(--font-body); font-size: 0.83rem; color: var(--text-muted);
    margin-bottom: 0.75rem;
}
.ann-sep[b-598x8uv0id] { opacity: 0.4; }
.ann-updated[b-598x8uv0id] { font-style: italic; }

.ann-detail-title[b-598x8uv0id] {
    font-family: var(--font-heading); font-size: 1.9rem;
    color: var(--text); margin: 0 0 1rem; line-height: 1.25;
}

.ann-event-chip[b-598x8uv0id] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    background: color-mix(in srgb, var(--accent) 10%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent); border-radius: 6px; padding: 0.35rem 0.9rem;
    font-family: var(--font-body); font-size: 0.82rem; cursor: pointer;
    transition: background 0.15s;
}
.ann-event-chip:hover[b-598x8uv0id] { background: color-mix(in srgb, var(--accent) 20%, transparent); }

.ann-detail-body-text[b-598x8uv0id] {
    font-family: var(--font-body); font-size: 1rem;
    color: var(--text-muted); line-height: 1.75;
    white-space: pre-wrap;
}

/* Modal */
.modal-close[b-598x8uv0id] { background: none; border: none; color: var(--text-muted); font-size: 1.4rem; cursor: pointer; }

.announcement-toggle[b-598x8uv0id] { margin: 0.5rem 0; }
.checkbox-label[b-598x8uv0id] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted); padding: 0.2rem 0; }
.checkbox-label input[type="checkbox"][b-598x8uv0id] { accent-color: var(--accent); width: 15px; height: 15px; cursor: pointer; }
.checkbox-label span[b-598x8uv0id] { transition: color 0.15s; }
.checkbox-label:hover span[b-598x8uv0id] { color: var(--text); }

.audience-fields[b-598x8uv0id] { display: flex; flex-direction: column; gap: 0.75rem; margin-top: 0.5rem; }
.audience-group[b-598x8uv0id] { border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.audience-group-header[b-598x8uv0id] {
    font-family: var(--font-body); font-size: 0.75rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent);
    padding: 0.4rem 0.75rem; border-bottom: 1px solid var(--border);
}
.audience-tree[b-598x8uv0id] { padding: 0.2rem 0; }
.audience-tree-row[b-598x8uv0id] { display: flex; align-items: center; gap: 0.25rem; padding: 0.22rem 0.6rem; border-radius: 4px; transition: background 0.1s; }
.audience-tree-row.has-children[b-598x8uv0id] { cursor: pointer; }
.audience-tree-row.has-children:hover[b-598x8uv0id] { background: rgba(255,255,255,0.03); }
.audience-tree-chevron[b-598x8uv0id] { flex-shrink: 0; width: 14px; text-align: center; font-size: 0.9rem; color: var(--text-muted); display: inline-block; transform: rotate(0deg); transition: transform 0.15s, color 0.15s; line-height: 1; }
.audience-tree-chevron.open[b-598x8uv0id] { transform: rotate(90deg); color: var(--accent); }
.audience-tree-chevron.hidden[b-598x8uv0id] { visibility: hidden; }
.audience-tree-children[b-598x8uv0id] { margin-left: 1.35rem; padding-left: 0.5rem; border-left: 1px solid color-mix(in srgb, var(--accent) 18%, transparent); }

.tree-cb-row[b-598x8uv0id] { display: flex; align-items: center; gap: 0.45rem; cursor: pointer; }
.tree-cb-row:hover .tree-cb-label[b-598x8uv0id] { color: var(--text); }
.tree-cb-label[b-598x8uv0id] { font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted); transition: color 0.15s; }
.tree-cb[b-598x8uv0id] { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; flex-shrink: 0; border: 1px solid rgba(255,255,255,0.2); border-radius: 3px; transition: background 0.12s, border-color 0.12s; }
.tree-cb[b-598x8uv0id]::after { font-size: 10px; line-height: 1; }
.tree-cb.checked[b-598x8uv0id] { background: var(--accent); border-color: var(--accent); }
.tree-cb.checked[b-598x8uv0id]::after { content: '✓'; color: var(--page-bg); }
.tree-cb.partial[b-598x8uv0id] { background: color-mix(in srgb, var(--accent) 15%, transparent); border-color: color-mix(in srgb, var(--accent) 60%, transparent); }
.tree-cb.partial[b-598x8uv0id]::after { content: '−'; color: var(--accent); font-size: 13px; }

.form-group[b-598x8uv0id] { display: flex; flex-direction: column; gap: 0.4rem; }
.form-label[b-598x8uv0id] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); letter-spacing: 0.04em; }
.form-control[b-598x8uv0id] {
    background: rgba(255,255,255,0.04); border: 1px solid var(--border);
    color: var(--text); border-radius: 6px; padding: 0.55rem 0.8rem;
    font-family: var(--font-body); font-size: 0.9rem; transition: border-color 0.15s;
}
.form-control:focus[b-598x8uv0id] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }

.btn-secondary[b-598x8uv0id] {
    padding: 0.6rem 1.2rem; background: rgba(255,255,255,0.06);
    border: 1px solid var(--border); color: var(--text-muted);
    border-radius: 6px; font-family: var(--font-body); cursor: pointer;
}
.btn-gold[b-598x8uv0id] {
    padding: 0.6rem 1.5rem; background: linear-gradient(135deg, var(--accent), var(--accent-mid));
    color: var(--page-bg); border: none; border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.85rem;
    font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer;
}
.btn-gold:disabled[b-598x8uv0id] { opacity: 0.55; cursor: not-allowed; }
.btn-danger[b-598x8uv0id] {
    padding: 0.6rem 1.5rem; background: color-mix(in srgb, var(--danger) 90%, transparent);
    color: #fff; border: none; border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.85rem; font-weight: 700; cursor: pointer;
}
.btn-danger:disabled[b-598x8uv0id] { opacity: 0.55; cursor: not-allowed; }

.confirm-msg[b-598x8uv0id] { font-family: var(--font-body); color: var(--text-muted); }
.confirm-name[b-598x8uv0id] { color: var(--text); }
/* /Components/Pages/Community/Announcements.razor.rz.scp.css */
.announcements-page[b-hcs2knzeai] { max-width: 900px; margin: 0 auto; padding: 1rem 0.75rem 3rem; }

@media (min-width: 640px) { .announcements-page[b-hcs2knzeai] { padding: 2rem 1.25rem 4rem; } }

.announcements-header[b-hcs2knzeai] {
    display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between;
    margin-bottom: 1.5rem; flex-wrap: wrap; gap: 0.75rem;
}
.announcements-title[b-hcs2knzeai] { font-family: var(--font-heading); font-size: 1.4rem; color: var(--accent); margin: 0 0 0.25rem; }
.announcements-subtitle[b-hcs2knzeai] { font-family: var(--font-body); color: var(--text-muted); margin: 0; font-size: 0.88rem; }

@media (min-width: 640px) {
    .announcements-header[b-hcs2knzeai] { flex-direction: row; align-items: flex-end; margin-bottom: 2rem; gap: 1rem; }
    .announcements-title[b-hcs2knzeai] { font-size: 2rem; }
    .announcements-subtitle[b-hcs2knzeai] { font-size: 0.95rem; }
}

.btn-gold-outline[b-hcs2knzeai] {
    padding: 0.55rem 1.3rem; border: 1px solid var(--accent);
    background: transparent; color: var(--accent); border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.82rem; font-weight: 700;
    letter-spacing: 0.06em; cursor: pointer; transition: background 0.15s, color 0.15s;
}
.btn-gold-outline:hover[b-hcs2knzeai] { background: var(--accent); color: var(--page-bg); }

.alert[b-hcs2knzeai] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; margin-bottom: 1rem; }
.alert-danger[b-hcs2knzeai] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }

.announcements-loading[b-hcs2knzeai] {
    display: flex; align-items: center; gap: 1rem;
    justify-content: center; padding: 4rem;
    color: var(--text-muted); font-family: var(--font-body);
}

.announcements-empty[b-hcs2knzeai] { text-align: center; padding: 4rem; color: var(--text-muted); font-family: var(--font-body); }

.announcements-list[b-hcs2knzeai] { display: flex; flex-direction: column; gap: 1px; }

.announcement-card[b-hcs2knzeai] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.15s, transform 0.1s;
    margin-bottom: 0.75rem;
}
.announcement-card:hover[b-hcs2knzeai] { border-color: color-mix(in srgb, var(--accent) 40%, transparent); transform: translateY(-1px); }

.announcement-card-inner[b-hcs2knzeai] { display: flex; align-items: stretch; gap: 0; }

.announcement-date-col[b-hcs2knzeai] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    padding: 1.25rem 0.75rem;
    border-right: 1px solid var(--border);
    background: var(--accent-muted);
    border-radius: 10px 0 0 10px;
}
.ann-day[b-hcs2knzeai] { font-family: var(--font-heading); font-size: 1.7rem; color: var(--accent); line-height: 1; font-weight: 600; }
.ann-month[b-hcs2knzeai] { font-family: var(--font-ui); font-size: 0.65rem; color: var(--text-muted); letter-spacing: 0.12em; text-transform: uppercase; margin-top: 4px; }
.ann-year[b-hcs2knzeai] { font-family: var(--font-ui); font-size: 0.62rem; color: var(--text-dim); letter-spacing: 0.1em; }

.announcement-content[b-hcs2knzeai] { flex: 1; padding: 1.25rem 1.5rem; min-width: 0; }
.announcement-title[b-hcs2knzeai] { font-family: var(--font-heading); font-size: 1.1rem; color: var(--text); margin: 0 0 0.5rem; }
.announcement-excerpt[b-hcs2knzeai] {
    font-family: var(--font-body); font-size: 0.88rem;
    color: var(--text-muted); margin: 0 0 0.75rem;
    line-height: 1.5;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.announcement-footer[b-hcs2knzeai] {
    display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
    font-family: var(--font-body); font-size: 0.78rem; color: var(--text-muted);
}

.ann-event-link[b-hcs2knzeai] {
    background: color-mix(in srgb, var(--accent) 10%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent); border-radius: 4px; padding: 0.15rem 0.6rem;
    font-family: var(--font-body); font-size: 0.75rem; cursor: pointer;
    transition: background 0.15s;
}
.ann-event-link:hover[b-hcs2knzeai] { background: color-mix(in srgb, var(--accent) 20%, transparent); }
.ann-updated[b-hcs2knzeai] { font-style: italic; }

.announcement-arrow[b-hcs2knzeai] {
    display: flex;
    align-items: center;
    padding: 0 1.1rem;
    font-size: 1.5rem;
    color: var(--border);
    transition: color 0.15s;
    flex-shrink: 0;
}
.announcement-card:hover .announcement-arrow[b-hcs2knzeai] { color: var(--accent); }

/* Modal */
.modal-close[b-hcs2knzeai] { background: none; border: none; color: var(--text-muted); font-size: 1.4rem; cursor: pointer; }

.announcement-toggle[b-hcs2knzeai] { margin: 0.5rem 0; }
.checkbox-label[b-hcs2knzeai] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted); padding: 0.2rem 0; }
.checkbox-label input[type="checkbox"][b-hcs2knzeai] { accent-color: var(--accent); width: 15px; height: 15px; cursor: pointer; }
.checkbox-label span[b-hcs2knzeai] { transition: color 0.15s; }
.checkbox-label:hover span[b-hcs2knzeai] { color: var(--text); }


.ann-badge-wrap[b-hcs2knzeai] { display: inline-flex; }

.ann-restriction-badge[b-hcs2knzeai] {
    position: relative; cursor: help;
    font-size: 0.8rem; opacity: 0.65; transition: opacity 0.15s;
    display: inline-flex; align-items: center;
}
.ann-restriction-badge:hover[b-hcs2knzeai] { opacity: 1; }
.ann-restriction-tooltip[b-hcs2knzeai] {
    display: none; position: absolute;
    bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%);
    background: var(--container-bg); border: 1px solid var(--border); border-radius: 6px;
    padding: 0.6rem 0.75rem; min-width: 180px; max-width: 260px;
    font-family: var(--font-body); font-size: 0.78rem; color: var(--text-muted);
    z-index: 50; box-shadow: 0 4px 16px rgba(0,0,0,0.5);
    white-space: normal; text-align: left;
}
.ann-restriction-badge:hover .ann-restriction-tooltip[b-hcs2knzeai] { display: block; }
.restriction-title[b-hcs2knzeai] { color: var(--text); font-size: 0.76rem; margin-bottom: 0.4rem; font-weight: 600; }
.restriction-section[b-hcs2knzeai] { margin-bottom: 0.35rem; }
.restriction-section:last-child[b-hcs2knzeai] { margin-bottom: 0; }
.restriction-label[b-hcs2knzeai] { color: var(--accent); font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.1rem; }

/* ── Card date column - shrink on narrow screens ─────────────────────────── */
@media (max-width: 479px) {
    .announcement-date-col[b-hcs2knzeai] { min-width: 60px; padding: 1rem 0.5rem; }
    .ann-day[b-hcs2knzeai] { font-size: 1.3rem; }
    .ann-month[b-hcs2knzeai] { font-size: 0.6rem; }
    .announcement-arrow[b-hcs2knzeai] { padding: 0 0.65rem; font-size: 1.2rem; }
    .announcement-content[b-hcs2knzeai] { padding: 1rem; }
}

.form-group[b-hcs2knzeai] { display: flex; flex-direction: column; gap: 0.4rem; }
.form-label[b-hcs2knzeai] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); letter-spacing: 0.04em; }
.form-control[b-hcs2knzeai] {
    background: rgba(255,255,255,0.04); border: 1px solid var(--border);
    color: var(--text); border-radius: 6px; padding: 0.55rem 0.8rem;
    font-family: var(--font-body); font-size: 0.9rem; transition: border-color 0.15s;
}
.form-control:focus[b-hcs2knzeai] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }

.btn-secondary[b-hcs2knzeai] {
    padding: 0.6rem 1.2rem; background: rgba(255,255,255,0.06);
    border: 1px solid var(--border); color: var(--text-muted);
    border-radius: 6px; font-family: var(--font-body); cursor: pointer;
}
.btn-gold[b-hcs2knzeai] {
    padding: 0.6rem 1.5rem;
    background: linear-gradient(135deg, var(--accent), var(--accent-mid));
    color: var(--page-bg); border: none; border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.85rem;
    font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer;
}
.btn-gold:disabled[b-hcs2knzeai] { opacity: 0.55; cursor: not-allowed; }
/* /Components/Pages/Community/Characters.razor.rz.scp.css */
.chars-page[b-jf1efq02if] {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1.25rem;
}

/* ── Header ───────────────────────────────────────────────────────────────── */

.chars-header[b-jf1efq02if] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 15%, transparent);
}

.chars-title[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--accent-bright) 0%, var(--accent) 50%, var(--accent-dim) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
    line-height: 1.2;
}

.chars-subtitle[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text-dim);
    margin: 0.25rem 0 0;
    font-style: italic;
}

.chars-header-actions[b-jf1efq02if] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */

.chars-btn[b-jf1efq02if] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border: none;
    border-radius: 6px;
    padding: 0.5rem 1rem;
    cursor: pointer;
    transition: all 0.18s ease;
}

.chars-btn svg[b-jf1efq02if] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.chars-btn--primary[b-jf1efq02if] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 15%, transparent), color-mix(in srgb, var(--accent) 8%, transparent));
    border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
    color: var(--accent);
}

.chars-btn--primary:hover:not(:disabled)[b-jf1efq02if] {
    background: color-mix(in srgb, var(--accent) 20%, transparent);
    border-color: var(--accent);
    box-shadow: 0 0 12px color-mix(in srgb, var(--accent) 15%, transparent);
}

.chars-btn--secondary[b-jf1efq02if] {
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--text-muted);
}

.chars-btn--secondary:hover:not(:disabled)[b-jf1efq02if] {
    border-color: color-mix(in srgb, var(--accent) 40%, transparent);
    color: var(--accent);
}

.chars-btn--ghost[b-jf1efq02if] {
    background: transparent;
    border: 1px solid var(--border);
    color: var(--text-muted);
}

.chars-btn--ghost:hover[b-jf1efq02if] {
    border-color: var(--text-dim);
    color: var(--text-muted);
}

.chars-btn--danger[b-jf1efq02if] {
    background: rgba(192,57,43,0.15);
    border: 1px solid rgba(192,57,43,0.4);
    color: var(--danger);
}

.chars-btn--danger:hover:not(:disabled)[b-jf1efq02if] {
    background: rgba(192,57,43,0.25);
    box-shadow: 0 0 12px rgba(192,57,43,0.15);
}

.chars-btn:disabled[b-jf1efq02if] { opacity: 0.5; cursor: not-allowed; }

/* ── States ───────────────────────────────────────────────────────────────── */

.chars-loading[b-jf1efq02if] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-muted);
    font-family: var(--font-body);
    font-size: 1rem;
    padding: 2rem 0;
}

.chars-spinner[b-jf1efq02if] {
    width: 18px;
    height: 18px;
    border: 2px solid color-mix(in srgb, var(--accent) 20%, transparent);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: spin-b-jf1efq02if 0.7s linear infinite;
}

@keyframes spin-b-jf1efq02if { to { transform: rotate(360deg); } }

.chars-error[b-jf1efq02if] {
    background: rgba(192,57,43,0.1);
    border: 1px solid rgba(192,57,43,0.3);
    border-radius: 8px;
    color: var(--danger);
    padding: 1rem 1.25rem;
    font-family: var(--font-body);
}

.chars-empty[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 4rem 2rem;
    color: var(--text-dim);
    font-family: var(--font-body);
    font-size: 1.1rem;
}

.chars-empty-icon[b-jf1efq02if] {
    width: 56px;
    height: 56px;
    opacity: 0.3;
}

/* ── Character Grid ───────────────────────────────────────────────────────── */

.chars-grid[b-jf1efq02if] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr));
    gap: 1.25rem;
}

.char-card[b-jf1efq02if] {
    background: linear-gradient(160deg, var(--card-bg) 0%, var(--page-bg) 100%);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    position: relative;
    animation: cardFadeIn-b-jf1efq02if 0.35s ease both;
}

@keyframes cardFadeIn-b-jf1efq02if {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.char-card:hover[b-jf1efq02if] {
    border-color: color-mix(in srgb, var(--accent) 30%, transparent);
    box-shadow: 0 6px 32px rgba(0,0,0,0.5), 0 0 0 1px color-mix(in srgb, var(--accent) 8%, transparent);
    transform: translateY(-2px);
}

/* ── Card Crest / Avatar ──────────────────────────────────────────────────── */

.char-card__crest[b-jf1efq02if] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, transparent) 0%, color-mix(in srgb, var(--accent) 3%, transparent) 100%);
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 10%, transparent);
    padding: 1.5rem;
    position: relative;
}

.char-card__avatar[b-jf1efq02if] {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 20%, transparent), color-mix(in srgb, var(--accent) 6%, transparent));
    border: 1.5px solid color-mix(in srgb, var(--accent) 35%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-heading);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--accent);
    text-shadow: 0 0 12px color-mix(in srgb, var(--accent) 40%, transparent);
}

.char-card__level-badge[b-jf1efq02if] {
    position: absolute;
    top: 0.6rem;
    right: 0.75rem;
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
    border-radius: 20px;
    padding: 0.2rem 0.55rem;
    font-family: var(--font-heading);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--accent);
    text-transform: uppercase;
}

/* ── Card Body ────────────────────────────────────────────────────────────── */

.char-card__body[b-jf1efq02if] {
    padding: 1rem 1.25rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.char-card__name[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.3;
}

.char-card__nationality[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    font-style: italic;
    margin-top: -0.25rem;
}

/* ── Badges ───────────────────────────────────────────────────────────────── */

.char-card__badges[b-jf1efq02if] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.1rem;
}

.char-badge[b-jf1efq02if] {
    display: inline-block;
    font-family: var(--font-heading);
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border-radius: 4px;
    padding: 0.2rem 0.5rem;
}

.char-badge--faction[b-jf1efq02if] {
    background: rgba(100,140,200,0.1);
    border: 1px solid rgba(100,140,200,0.25);
    color: var(--info);
}

.char-badge--position[b-jf1efq02if] {
    background: rgba(80,180,140,0.1);
    border: 1px solid rgba(80,180,140,0.25);
    color: var(--success);
}

/* ── XP Bar ───────────────────────────────────────────────────────────────── */

.char-card__xp-section[b-jf1efq02if] {
    margin-top: auto;
    padding-top: 0.5rem;
}

.char-xp-bar-header[b-jf1efq02if] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.3rem;
}

.char-stat__label[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 0.55rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-dim);
}

.char-xp-value[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 0.65rem;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

.char-xp-bar[b-jf1efq02if] {
    height: 3px;
    background: rgba(255,255,255,0.05);
    border-radius: 2px;
    overflow: hidden;
}

.char-xp-bar__fill[b-jf1efq02if] {
    height: 100%;
    background: linear-gradient(90deg, var(--accent-dim), var(--accent), var(--accent-bright));
    border-radius: 2px;
    transition: width 0.6s ease;
    min-width: 2px;
}

/* ── Owner ────────────────────────────────────────────────────────────────── */

.char-card__owner[b-jf1efq02if] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: var(--text-dim);
    font-family: var(--font-body);
    margin-top: 0.25rem;
}

.char-owner__icon[b-jf1efq02if] {
    width: 11px;
    height: 11px;
    stroke: var(--text-dim);
    flex-shrink: 0;
}

/* ── Card Actions ─────────────────────────────────────────────────────────── */

.char-card__actions[b-jf1efq02if] {
    display: flex;
    gap: 0.35rem;
    padding: 0.65rem 1rem;
    border-top: 1px solid rgba(255,255,255,0.04);
    background: rgba(0,0,0,0.25);
    flex-wrap: wrap;
}

.char-action-btn[b-jf1efq02if] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    height: 28px;
    padding: 0 0.6rem;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 5px;
    color: var(--text-dim);
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: var(--font-ui);
    font-size: 0.55rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 600;
    white-space: nowrap;
}

.char-action-btn svg[b-jf1efq02if] {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.char-action-label[b-jf1efq02if] {
    line-height: 1;
}

.char-action-btn:hover[b-jf1efq02if] {
    border-color: color-mix(in srgb, var(--accent) 35%, transparent);
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 6%, transparent);
}

.char-action-btn--gold[b-jf1efq02if] {
    color: color-mix(in srgb, var(--accent) 55%, transparent);
    border-color: color-mix(in srgb, var(--accent) 15%, transparent);
}
.char-action-btn--gold:hover[b-jf1efq02if] {
    color: var(--accent);
    border-color: color-mix(in srgb, var(--accent) 40%, transparent);
    background: color-mix(in srgb, var(--accent) 8%, transparent);
}

.char-action-btn--teal[b-jf1efq02if] {
    color: rgba(80,180,140,0.55);
    border-color: rgba(80,180,140,0.15);
}
.char-action-btn--teal:hover[b-jf1efq02if] {
    color: var(--success);
    border-color: rgba(80,180,140,0.4);
    background: rgba(80,180,140,0.08);
}

.char-action-btn--info[b-jf1efq02if] {
    color: rgba(100,140,200,0.55);
    border-color: rgba(100,140,200,0.15);
}
.char-action-btn--info:hover[b-jf1efq02if] {
    color: var(--info);
    border-color: rgba(100,140,200,0.4);
    background: rgba(100,140,200,0.08);
}

.char-action-btn--danger[b-jf1efq02if] {
    color: rgba(192,57,43,0.5);
    border-color: rgba(192,57,43,0.12);
}
.char-action-btn--danger:hover[b-jf1efq02if] {
    border-color: rgba(192,57,43,0.4);
    color: var(--danger);
    background: rgba(192,57,43,0.08);
}

/* ── Filters ──────────────────────────────────────────────────────────────── */

.chars-filters[b-jf1efq02if] {
    margin-bottom: 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background: rgba(0,0,0,0.2);
    border: 1px solid var(--border-subtle);
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.filter-row[b-jf1efq02if] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: center;
}

.filter-group[b-jf1efq02if] {
    flex: 1;
    min-width: 160px;
}

.filter-input[b-jf1efq02if] {
    background: var(--page-bg);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text);
    font-family: var(--font-body);
    font-size: 0.9rem;
    padding: 0.45rem 0.75rem;
    transition: border-color 0.15s;
    width: 100%;
    box-sizing: border-box;
}

.filter-input:focus[b-jf1efq02if] {
    outline: none;
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
}

.filter-input[b-jf1efq02if]::placeholder {
    color: var(--text-dim);
}

/* ── Grouping ─────────────────────────────────────────────────────────────── */

.group-row[b-jf1efq02if] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-top: 0.25rem;
    border-top: 1px solid rgba(255,255,255,0.04);
}

.group-label[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 0.6rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-dim);
}

.group-option[b-jf1efq02if] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    cursor: pointer;
    transition: color 0.15s;
}

.group-option:hover[b-jf1efq02if] {
    color: var(--text);
}

.group-option input[type="radio"][b-jf1efq02if] {
    accent-color: var(--accent);
}

/* ── Grouped Display ──────────────────────────────────────────────────────── */

.chars-groups[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.char-group[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.char-group__header[b-jf1efq02if] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 600;
    color: var(--accent);
    margin: 0;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 15%, transparent);
}

.char-group__icon[b-jf1efq02if] {
    width: 18px;
    height: 18px;
    stroke: color-mix(in srgb, var(--accent) 50%, transparent);
    flex-shrink: 0;
}

.char-group__count[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

/* ── Modals ───────────────────────────────────────────────────────────────── */

.modal-backdrop[b-jf1efq02if] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 200;
    padding: 1rem;
    backdrop-filter: blur(2px);
}

.modal-panel[b-jf1efq02if] {
    background: var(--page-bg);
    border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
    border-radius: 12px;
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 24px 60px rgba(0,0,0,0.6);
    animation: modalIn-b-jf1efq02if 0.2s ease both;
}

@keyframes modalIn-b-jf1efq02if {
    from { opacity: 0; transform: scale(0.97) translateY(8px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.modal-panel--sm[b-jf1efq02if] { max-width: 380px; }
.modal-panel--lg[b-jf1efq02if] { max-width: 640px; }

.modal-header[b-jf1efq02if] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem 0;
}

.modal-title[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 700;
    color: var(--accent);
    margin: 0;
}

.modal-close[b-jf1efq02if] {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.1rem;
    cursor: pointer;
    line-height: 1;
    padding: 0.25rem;
    transition: color 0.15s;
}

.modal-close:hover[b-jf1efq02if] { color: var(--accent); }

.modal-body[b-jf1efq02if] {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.modal-footer[b-jf1efq02if] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 0 1.5rem 1.25rem;
}

/* ── Forms ────────────────────────────────────────────────────────────────── */

.form-group[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.form-label[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 0.62rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.form-input[b-jf1efq02if] {
    background: var(--page-bg);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text);
    font-family: var(--font-body);
    font-size: 0.95rem;
    padding: 0.5rem 0.75rem;
    transition: border-color 0.15s;
    width: 100%;
    box-sizing: border-box;
}

.form-input:focus[b-jf1efq02if] {
    outline: none;
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 6%, transparent);
}

.form-error-banner[b-jf1efq02if] {
    background: rgba(192,57,43,0.1);
    border: 1px solid rgba(192,57,43,0.3);
    border-radius: 6px;
    color: var(--danger);
    padding: 0.6rem 0.875rem;
    font-family: var(--font-body);
    font-size: 0.9rem;
}

.xp-current[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--text-muted);
    margin: 0;
}

.xp-current strong[b-jf1efq02if] { color: var(--accent); }

/* ── History ──────────────────────────────────────────────────────────────── */

.history-empty[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--text-muted);
    text-align: center;
    margin: 1.5rem 0;
}

.history-list[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-height: 420px;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.history-list[b-jf1efq02if]::-webkit-scrollbar { width: 4px; }
.history-list[b-jf1efq02if]::-webkit-scrollbar-track { background: transparent; }
.history-list[b-jf1efq02if]::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 20%, transparent); border-radius: 2px; }

.history-entry[b-jf1efq02if] {
    border-left: 2px solid color-mix(in srgb, var(--accent) 25%, transparent);
    padding: 0.5rem 0 0.5rem 0.875rem;
    transition: border-color 0.15s;
}

.history-entry:hover[b-jf1efq02if] {
    border-left-color: color-mix(in srgb, var(--accent) 50%, transparent);
}

.history-entry__meta[b-jf1efq02if] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.25rem;
    align-items: center;
}

.history-entry__date[b-jf1efq02if] {
    font-size: 0.72rem;
    color: var(--text-dim);
    font-family: var(--font-heading);
    letter-spacing: 0.04em;
}

.history-entry__by[b-jf1efq02if] {
    font-size: 0.72rem;
    color: color-mix(in srgb, var(--accent) 60%, transparent);
    font-family: var(--font-heading);
}

.history-entry__desc[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--text);
}

.history-entry__note[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--text-muted);
    font-style: italic;
    margin-top: 0.15rem;
}

/* ── New Action Button Colors ── */

.char-action-btn--purple[b-jf1efq02if] {
    color: rgba(140,80,200,0.55);
    border-color: rgba(140,80,200,0.15);
}
.char-action-btn--purple:hover[b-jf1efq02if] {
    color: #a76bd6;
    border-color: rgba(140,80,200,0.4);
    background: rgba(140,80,200,0.08);
}

.char-action-btn--orange[b-jf1efq02if] {
    color: rgba(230,145,60,0.55);
    border-color: rgba(230,145,60,0.15);
}
.char-action-btn--orange:hover[b-jf1efq02if] {
    color: #e6913c;
    border-color: rgba(230,145,60,0.4);
    background: rgba(230,145,60,0.08);
}

/* ── Group Toggle ── */

.char-group__toggle[b-jf1efq02if] {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    padding: 0.25rem;
    margin-right: 0.5rem;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
}
.char-group__toggle:hover[b-jf1efq02if] {
    background: rgba(255,255,255,0.05);
}
.char-group__toggle svg[b-jf1efq02if] {
    width: 16px;
    height: 16px;
}

/* Mobile-first layout overrides */
.chars-page[b-jf1efq02if] { padding-inline: var(--gutter-x, 1rem); padding-block: 1rem 3rem; }
.chars-header[b-jf1efq02if] { flex-direction: column; align-items: flex-start; }
.chars-title[b-jf1efq02if] { font-size: 1.3rem; }
.chars-subtitle[b-jf1efq02if] { font-size: 0.8rem; }
.chars-header-actions[b-jf1efq02if] { justify-content: flex-start; }
.group-row[b-jf1efq02if] { flex-wrap: wrap; gap: 0.6rem; }

@media (min-width: 640px) {
    .chars-page[b-jf1efq02if] { padding-block: 2rem 3rem; }
    .chars-header[b-jf1efq02if] { flex-direction: row; align-items: flex-end; }
    .chars-title[b-jf1efq02if] { font-size: 1.6rem; }
    .chars-subtitle[b-jf1efq02if] { font-size: 0.9rem; }
    .chars-header-actions[b-jf1efq02if] { justify-content: flex-end; }
    .group-row[b-jf1efq02if] { flex-wrap: nowrap; }
}

/* ── Position Tags on Cards ────────────────────────────────────────── */

.char-card__positions[b-jf1efq02if] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.1rem;
}

.char-card__position-tag[b-jf1efq02if] {
    display: inline-block;
    font-family: var(--font-heading);
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border-radius: 4px;
    padding: 0.2rem 0.5rem;
    background: rgba(80,180,140,0.1);
    border: 1px solid rgba(80,180,140,0.25);
    color: var(--success);
}

/* ── Position Manager Modal ─────────────────────────────────────────── */

.pos-manager[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pos-manager__heading[b-jf1efq02if] {
    font-family: var(--font-heading);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin: 0;
}

.pos-manager__divider[b-jf1efq02if] {
    border: none;
    border-top: 1px solid var(--border);
    margin: 0.5rem 0;
}

.pos-manager__empty[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text-dim);
    margin: 0;
    font-style: italic;
}

.pos-manager__list[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.pos-manager__item[b-jf1efq02if] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--border-subtle);
    border-radius: 6px;
    padding: 0.45rem 0.65rem;
}

.pos-manager__item-name[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text);
}

.pos-manager__item-label[b-jf1efq02if] {
    font-size: 0.8rem;
    color: var(--text-muted);
    font-style: italic;
}

.pos-manager__item-remove[b-jf1efq02if] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: 1px solid transparent;
    border-radius: 4px;
    color: var(--text-dim);
    cursor: pointer;
    padding: 0.2rem;
    transition: all 0.15s;
}

.pos-manager__item-remove:hover:not(:disabled)[b-jf1efq02if] {
    color: var(--danger);
    border-color: rgba(192,57,43,0.3);
    background: rgba(192,57,43,0.08);
}

.pos-manager__add[b-jf1efq02if] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.form-hint[b-jf1efq02if] {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--text-dim);
    text-transform: none;
    letter-spacing: 0;
}

.modal-panel--md[b-jf1efq02if] { max-width: 540px; }
/* /Components/Pages/Community/Displays.razor.rz.scp.css */
/* ── Page ───────────────────────────────────────────────────────────────────── */

.disp-page[b-5zw2txk46n] {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1.25rem;
}

/* ── Header ─────────────────────────────────────────────────────────────────── */

.disp-header[b-5zw2txk46n] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 15%, transparent);
}

.disp-title-group[b-5zw2txk46n] { display: flex; flex-direction: column; gap: 0.2rem; }

.disp-title[b-5zw2txk46n] {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--accent-bright) 0%, var(--accent) 50%, var(--accent-dim) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
    line-height: 1.2;
}

.disp-subtitle[b-5zw2txk46n] {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text-muted);
    margin: 0;
    font-style: italic;
}

/* ── Buttons ────────────────────────────────────────────────────────────────── */

.disp-btn[b-5zw2txk46n] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border: none;
    border-radius: 6px;
    padding: 0.5rem 1rem;
    cursor: pointer;
    transition: all 0.18s ease;
    white-space: nowrap;
}

.disp-btn svg[b-5zw2txk46n] { width: 14px; height: 14px; flex-shrink: 0; }

.disp-btn--primary[b-5zw2txk46n] {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--accent) 15%, transparent),
        color-mix(in srgb, var(--accent) 8%, transparent));
    border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
    color: var(--accent);
}
.disp-btn--primary:hover:not(:disabled)[b-5zw2txk46n] {
    background: color-mix(in srgb, var(--accent) 20%, transparent);
    border-color: var(--accent);
    box-shadow: 0 0 12px color-mix(in srgb, var(--accent) 15%, transparent);
}

.disp-btn--ghost[b-5zw2txk46n] {
    background: transparent;
    border: 1px solid var(--border);
    color: var(--text-muted);
}
.disp-btn--ghost:hover[b-5zw2txk46n] { border-color: var(--text-muted); color: var(--text); }

.disp-btn:disabled[b-5zw2txk46n] { opacity: 0.5; cursor: not-allowed; }

/* ── Empty State ────────────────────────────────────────────────────────────── */

.disp-empty[b-5zw2txk46n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 5rem 2rem;
    color: var(--text-muted);
    font-family: var(--font-body);
    font-size: 1.05rem;
    text-align: center;
}

.disp-empty-icon[b-5zw2txk46n] {
    width: 52px;
    height: 52px;
    opacity: 0.28;
    stroke: var(--accent);
}

/* ── Grid ───────────────────────────────────────────────────────────────────── */

.disp-grid[b-5zw2txk46n] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
    gap: 1.25rem;
}

/* ── Card ───────────────────────────────────────────────────────────────────── */

.disp-card[b-5zw2txk46n] {
    background: linear-gradient(160deg, var(--card-bg) 0%, var(--page-bg) 100%);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    animation: dispCardIn-b-5zw2txk46n 0.35s ease both;
}

@keyframes dispCardIn-b-5zw2txk46n {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.disp-card:hover[b-5zw2txk46n] {
    border-color: color-mix(in srgb, var(--accent) 30%, transparent);
    box-shadow: 0 6px 32px rgba(0,0,0,0.45), 0 0 0 1px color-mix(in srgb, var(--accent) 8%, transparent);
    transform: translateY(-2px);
}

/* ── Card Banner / Image ────────────────────────────────────────────────────── */

.disp-card__banner[b-5zw2txk46n] {
    height: 140px;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 10%, transparent);
}

.disp-card__banner--placeholder[b-5zw2txk46n] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--accent) 10%, transparent) 0%,
        color-mix(in srgb, var(--accent) 3%, transparent) 100%);
}

.disp-card__banner--placeholder svg[b-5zw2txk46n] {
    width: 40px;
    height: 40px;
    stroke: color-mix(in srgb, var(--accent) 30%, transparent);
}

/* ── Card Body ──────────────────────────────────────────────────────────────── */

.disp-card__body[b-5zw2txk46n] {
    padding: 1rem 1.25rem 1.25rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.disp-card__name[b-5zw2txk46n] {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 700;
    color: var(--text-bright);
    line-height: 1.3;
}

.disp-card__category[b-5zw2txk46n] {
    display: inline-block;
    font-family: var(--font-heading);
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.18rem 0.5rem;
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    border-radius: 4px;
    color: var(--accent);
    align-self: flex-start;
}

.disp-card__desc[b-5zw2txk46n] {
    font-family: var(--font-body);
    font-size: 0.88rem;
    color: var(--text-muted);
    line-height: 1.55;
    margin: 0;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.disp-card__meta[b-5zw2txk46n] {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--text-muted);
    opacity: 0.7;
    margin-top: auto;
    padding-top: 0.5rem;
    border-top: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
}

/* ── Form (inside modal) ────────────────────────────────────────────────────── */

.form-group[b-5zw2txk46n] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.75rem; }

.form-label[b-5zw2txk46n] {
    font-family: var(--font-heading);
    font-size: 0.62rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.form-input[b-5zw2txk46n] {
    background: var(--page-bg);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text);
    font-family: var(--font-body);
    font-size: 0.95rem;
    padding: 0.5rem 0.75rem;
    transition: border-color 0.15s;
    width: 100%;
    box-sizing: border-box;
    resize: vertical;
}

.form-input:focus[b-5zw2txk46n] {
    outline: none;
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 6%, transparent);
}

/* ── Card Actions ───────────────────────────────────────────────────────────── */

.disp-card__actions[b-5zw2txk46n] {
    display: flex;
    gap: 0.35rem;
    padding: 0.6rem 1rem;
    border-top: 1px solid rgba(255,255,255,0.04);
    background: rgba(0,0,0,0.2);
}

.disp-action-btn[b-5zw2txk46n] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    height: 28px;
    padding: 0 0.65rem;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 5px;
    color: var(--text-muted);
    cursor: pointer;
    font-family: var(--font-ui);
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.disp-action-btn svg[b-5zw2txk46n] { width: 11px; height: 11px; flex-shrink: 0; }

.disp-action-btn:hover[b-5zw2txk46n] {
    border-color: color-mix(in srgb, var(--accent) 35%, transparent);
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 6%, transparent);
}

.disp-action-btn--danger[b-5zw2txk46n] { color: rgba(192,57,43,0.5); border-color: rgba(192,57,43,0.12); }
.disp-action-btn--danger:hover[b-5zw2txk46n] {
    border-color: rgba(192,57,43,0.4);
    color: var(--danger);
    background: rgba(192,57,43,0.08);
}

/* ── Danger button in modal footer ──────────────────────────────────────────── */

.disp-btn--danger[b-5zw2txk46n] {
    background: rgba(192,57,43,0.12);
    border: 1px solid rgba(192,57,43,0.35);
    color: var(--danger);
}
.disp-btn--danger:hover:not(:disabled)[b-5zw2txk46n] {
    background: rgba(192,57,43,0.22);
    border-color: rgba(192,57,43,0.55);
}

/* ── Delete confirm text ────────────────────────────────────────────────────── */

.disp-confirm-text[b-5zw2txk46n] {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--text-muted);
    margin: 0;
}

/* ── Responsive ─────────────────────────────────────────────────────────────── */

.disp-page[b-5zw2txk46n] { padding: 1rem 0.75rem; }
.disp-header[b-5zw2txk46n] { flex-direction: column; align-items: flex-start; }
.disp-title[b-5zw2txk46n] { font-size: 1.3rem; }

@media (min-width: 640px) {
    .disp-page[b-5zw2txk46n] { padding: 2rem 1.25rem; }
    .disp-header[b-5zw2txk46n] { flex-direction: row; align-items: flex-end; }
    .disp-title[b-5zw2txk46n] { font-size: 1.6rem; }
}
/* /Components/Pages/Community/DocumentPage.razor.rz.scp.css */
/* ── Parchment colour palette (scoped to this page) ──────────────────────── */
.doc-parchment-page[b-sonryfafut] {
    --pm:          #f5edd8;
    --pm-dark:     #e8ddc0;
    --pm-mid:      #ede3c8;
    --ink:         #2a1f0e;
    --ink-mid:     #4a3820;
    --ink-light:   #6b5138;
    --crimson:     #8b1a1a;
    --crimson-lt:  #a52222;
    --accent-parchment:    #b8860b;
    --accent-parchment-lt: #d4a017;
    --border-c:    #c4a96a;
    --shadow:      rgba(42,31,14,0.18);
    --highlight:   #fff8e8;

    background: var(--pm-dark);
    background-image:
        radial-gradient(ellipse at 20% 50%, rgba(184,134,11,0.05) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 20%, rgba(139,26,26,0.04) 0%, transparent 50%);
    color: var(--ink);
    min-height: calc(100vh - 3.5rem);
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    /* escape article.content horizontal padding so parchment fills edge-to-edge */
    margin: 0 -1rem;
}

/* ── Reading progress bar ─────────────────────────────────────────────────── */
.doc-progress-track[b-sonryfafut] {
    position: fixed;
    top: 3.5rem;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 200;
    background: transparent;
    pointer-events: none;
}
.doc-progress-fill[b-sonryfafut] {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--accent), var(--accent-parchment-lt), var(--accent));
    transition: width 0.08s linear;
    box-shadow: 0 0 6px rgba(184,134,11,0.5);
}

/* ── Manuscript header ────────────────────────────────────────────────────── */
.doc-ms-header[b-sonryfafut] {
    background: var(--ink);
    background-image: linear-gradient(135deg, #1a0f06 0%, #3a2810 50%, #1a0f06 100%);
    color: var(--pm);
    text-align: center;
    padding: 2.5rem 2rem 2rem;
    position: relative;
    overflow: hidden;
    border-bottom: 4px solid var(--accent);
}
.doc-ms-header[b-sonryfafut]::before {
    content: '';
    position: absolute; inset: 0;
    background: repeating-linear-gradient(
        45deg, transparent, transparent 30px,
        rgba(184,134,11,0.03) 30px, rgba(184,134,11,0.03) 60px
    );
    pointer-events: none;
}
.doc-ms-shield[b-sonryfafut] {
    font-size: 1.2rem;
    opacity: 0.65;
    letter-spacing: 0.5rem;
    margin-bottom: 0.75rem;
    position: relative;
}
.doc-ms-title[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: clamp(1.5rem, 4vw, 2.6rem);
    font-weight: 900;
    color: var(--accent-parchment-lt);
    letter-spacing: 0.08em;
    text-shadow: 0 2px 8px rgba(0,0,0,0.5);
    margin: 0;
    position: relative;
}
.doc-ms-subtitle[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: clamp(0.75rem, 2vw, 1rem);
    color: var(--pm-dark);
    letter-spacing: 0.2em;
    margin-top: 0.4rem;
    opacity: 0.85;
    position: relative;
}
.doc-ms-version[b-sonryfafut] {
    display: inline-block;
    margin-top: 0.85rem;
    background: var(--crimson);
    color: var(--pm);
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.72rem;
    letter-spacing: 0.15em;
    padding: 0.25rem 1rem;
    border-radius: 2px;
    position: relative;
}

/* ── Page layout ──────────────────────────────────────────────────────────── */
.doc-page-layout[b-sonryfafut] {
    display: flex;
    min-height: calc(100vh - 3.5rem);
}

/* ── TOC sidebar ─────────────────────────────────────────────────────────── */
.doc-toc-sidebar[b-sonryfafut] {
    width: 260px;
    flex-shrink: 0;
    background: var(--ink);
    background-image: linear-gradient(180deg, #1a0f06 0%, #2a1a08 100%);
    color: var(--pm-mid);
    position: sticky;
    top: 3.5rem;
    max-height: calc(100vh - 3.5rem);
    overflow-y: auto;
    padding: 1.5rem 0 2rem;
    border-right: 3px solid var(--accent);
    transition: width 0.22s cubic-bezier(0.4,0,0.2,1);
    scrollbar-width: thin;
    scrollbar-color: var(--accent) var(--ink);
}
.doc-toc-sidebar[b-sonryfafut]::-webkit-scrollbar        { width: 4px; }
.doc-toc-sidebar[b-sonryfafut]::-webkit-scrollbar-track  { background: var(--ink); }
.doc-toc-sidebar[b-sonryfafut]::-webkit-scrollbar-thumb  { background: var(--accent); }
.doc-toc-sidebar.toc-collapsed[b-sonryfafut]             { width: 44px; }

.doc-toc-header[b-sonryfafut] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0.9rem 0.8rem;
    border-bottom: 1px solid rgba(184,134,11,0.3);
    margin-bottom: 0.5rem;
}
.doc-toc-title[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.25em;
    color: var(--accent);
}
.toc-collapsed .doc-toc-title[b-sonryfafut] { display: none; }

.doc-toc-toggle[b-sonryfafut] {
    background: none;
    border: none;
    color: var(--pm-mid);
    cursor: pointer;
    padding: 0.25rem 0.3rem;
    border-radius: 3px;
    line-height: 1;
    display: flex;
    align-items: center;
    transition: color 0.15s;
}
.doc-toc-toggle:hover[b-sonryfafut] { color: var(--accent-parchment-lt); }

.doc-toc-nav[b-sonryfafut] { padding: 0; }

.doc-toc-list[b-sonryfafut] { list-style: none; margin: 0; padding: 0; }
.doc-toc-item[b-sonryfafut] { margin: 0; }
.doc-toc-item > .doc-toc-list[b-sonryfafut] {
    margin-left: 0.6rem;
    border-left: 1px solid rgba(184,134,11,0.2);
    padding-left: 0.4rem;
}

.toc-level-1 > .doc-toc-link[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--pm-mid);
}
.toc-level-2 > .doc-toc-link[b-sonryfafut] {
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    font-size: 0.82rem;
    color: var(--pm-dark);
    opacity: 0.8;
}
.toc-level-3 > .doc-toc-link[b-sonryfafut] {
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    font-size: 0.78rem;
    color: var(--pm-dark);
    opacity: 0.65;
}

.doc-toc-link[b-sonryfafut] {
    display: block;
    padding: 0.3rem 1.2rem 0.3rem 1.4rem;
    text-decoration: none;
    border-left: 3px solid transparent;
    transition: all 0.15s;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.doc-toc-link:hover[b-sonryfafut], .doc-toc-link--active[b-sonryfafut] {
    background: rgba(184,134,11,0.12);
    color: var(--accent-parchment-lt) !important;
    border-left-color: var(--accent);
    opacity: 1 !important;
}

/* ── Main content ─────────────────────────────────────────────────────────── */
.doc-main[b-sonryfafut] {
    flex: 1;
    min-width: 0;
    padding: 0;
    background: var(--pm-dark);
}

/* ── Top bar ─────────────────────────────────────────────────────────────── */
.doc-topbar[b-sonryfafut] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.85rem 2rem;
    background: var(--pm-mid);
    border-bottom: 2px solid var(--border-c);
}
.btn-back[b-sonryfafut] {
    background: none;
    border: none;
    color: var(--ink-light);
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    cursor: pointer;
    padding: 0.2rem 0;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
    transition: color 0.15s;
    text-transform: uppercase;
}
.btn-back:hover[b-sonryfafut] { color: var(--crimson); }

.doc-filename[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--ink);
    margin: 0;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.doc-topbar-actions[b-sonryfafut] { display: flex; align-items: center; gap: 0.5rem; }

.doc-reading-time[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    color: var(--ink-light);
    background: rgba(42,31,14,0.06);
    border: 1px solid var(--border-c);
    border-radius: 2px;
    padding: 0.2rem 0.6rem;
    white-space: nowrap;
    margin-right: 0.25rem;
}


/* ── Search bar ──────────────────────────────────────────────────────────── */
.doc-search-bar[b-sonryfafut] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--highlight);
    border: 1.5px solid var(--border-c);
    border-radius: 2px;
    padding: 0.5rem 1rem;
    margin: 1rem 2rem 0;
    box-shadow: 0 2px 8px var(--shadow);
    transition: border-color 0.2s;
}
.doc-search-bar:focus-within[b-sonryfafut] { border-color: var(--crimson); }
.doc-search-icon[b-sonryfafut] {
    display: flex;
    align-items: center;
    color: var(--ink-light);
    flex-shrink: 0;
}
.doc-search-input[b-sonryfafut] {
    flex: 1;
    background: none;
    border: none;
    outline: none;
    color: var(--ink);
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    font-size: 1rem;
}
.doc-search-input[b-sonryfafut]::placeholder { color: rgba(42,31,14,0.4); font-style: italic; }
.doc-search-count[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.68rem;
    letter-spacing: 0.08em;
    color: var(--crimson);
    white-space: nowrap;
}
.doc-search-nav[b-sonryfafut] {
    background: none;
    border: 1px solid var(--border-c);
    color: var(--ink-mid);
    border-radius: 2px;
    cursor: pointer;
    padding: 0.15rem 0.5rem;
    font-size: 0.75rem;
    transition: all 0.15s;
    line-height: 1;
}
.doc-search-nav:hover[b-sonryfafut] { color: var(--crimson); border-color: var(--crimson); }
.doc-search-clear[b-sonryfafut] {
    background: none;
    border: none;
    color: var(--ink-light);
    cursor: pointer;
    font-size: 0.75rem;
    padding: 0.1rem 0.2rem;
    transition: color 0.15s;
    line-height: 1;
}
.doc-search-clear:hover[b-sonryfafut] { color: var(--crimson); }
.doc-search-none[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.68rem;
    letter-spacing: 0.05em;
    color: var(--crimson);
}
.doc-search-hint[b-sonryfafut] {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.6rem;
    letter-spacing: 0.1em;
    color: var(--ink-light);
    background: rgba(42,31,14,0.06);
    border: 1px solid var(--border-c);
    border-radius: 2px;
    padding: 0.1rem 0.4rem;
    white-space: nowrap;
    flex-shrink: 0;
    pointer-events: none;
}

/* ── Document content ─────────────────────────────────────────────────────── */
.doc-content[b-sonryfafut] {
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    font-size: 1.05rem;
    line-height: 1.75;
    color: var(--ink);
    padding: 2rem 2.5rem 4rem;
    max-width: 900px;
}

/* ── Content inside MarkupString - requires ::deep so Blazor scope doesn't block matching ── */

/* Intro paragraphs (before first section heading) */
[b-sonryfafut] .doc-content > p {
    font-size: 1.05rem;
    color: var(--ink);
    line-height: 1.75;
    margin: 0 0 0.9rem;
}

/* ── Sections ─────────────────────────────────────────────────────────────── */
[b-sonryfafut] .doc-section {
    animation: docFadeIn-b-sonryfafut 0.28s ease;
}
[b-sonryfafut] .doc-section.hidden { display: none; }
@keyframes docFadeIn-b-sonryfafut {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}

[b-sonryfafut] .doc-section-header {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0 0 0.75rem;
    margin-bottom: 1.25rem;
    border-bottom: 2px solid var(--border-c);
    position: relative;
}
[b-sonryfafut] .doc-section-header::before {
    content: '';
    position: absolute;
    bottom: -2px; left: 0;
    width: 60px; height: 2px;
    background: var(--crimson);
}

/* Section number badge */
[b-sonryfafut] .doc-section-num {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.62rem;
    letter-spacing: 0.18em;
    background: var(--crimson);
    color: var(--pm);
    padding: 0.2rem 0.55rem;
    border-radius: 2px;
    white-space: nowrap;
    flex-shrink: 0;
}

[b-sonryfafut] .doc-heading { margin: 0; line-height: 1.3; flex: 1; }

[b-sonryfafut] .doc-h1 {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: clamp(1.1rem, 2.5vw, 1.55rem);
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--crimson);
}
[b-sonryfafut] .doc-h2 {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: var(--ink-mid);
    padding-left: 0.75rem;
    border-left: 3px solid var(--accent);
}
[b-sonryfafut] .doc-h3 {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--ink);
}
[b-sonryfafut] .doc-h3::before { content: '◆ '; color: var(--accent); font-size: 0.7em; }

[b-sonryfafut] .doc-section-body {
    padding: 0 0 1.5rem;
}

/* Body typography */
[b-sonryfafut] .doc-section-body p {
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    font-size: 1.05rem;
    color: var(--ink);
    line-height: 1.75;
    margin: 0 0 0.8rem;
}
[b-sonryfafut] .doc-section-body p:last-child { margin-bottom: 0; }

[b-sonryfafut] .doc-section-body ul {
    margin: 0 0 0.85rem 0;
    padding: 0;
    list-style: none;
}
[b-sonryfafut] .doc-section-body li {
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    font-size: 1.05rem;
    color: var(--ink);
    line-height: 1.7;
    margin-bottom: 0.4rem;
    padding-left: 1.4rem;
    position: relative;
}
[b-sonryfafut] .doc-section-body li::before {
    content: '›';
    position: absolute;
    left: 0.4rem;
    color: var(--accent);
    font-size: 1.1em;
    line-height: 1.55;
}

/* ── Callout boxes ────────────────────────────────────────────────────────── */
[b-sonryfafut] .doc-callout {
    background: rgba(139,26,26,0.07);
    border: 1px solid var(--crimson);
    border-left: 4px solid var(--crimson);
    padding: 0.75rem 1.1rem;
    margin: 0.85rem 0;
    border-radius: 0 2px 2px 0;
    font-style: italic;
    color: var(--ink-mid);
    font-size: 0.97rem;
}
[b-sonryfafut] .doc-callout-gold {
    background: rgba(184,134,11,0.07);
    border: 1px solid var(--accent);
    border-left: 4px solid var(--accent);
    padding: 0.75rem 1.1rem;
    margin: 0.85rem 0;
    border-radius: 0 2px 2px 0;
    color: var(--ink-mid);
    font-size: 0.97rem;
}

/* ── Ornament dividers ────────────────────────────────────────────────────── */
[b-sonryfafut] .doc-ornament {
    text-align: center;
    color: var(--accent);
    font-size: 1.1rem;
    letter-spacing: 0.6rem;
    margin: 0.5rem 0 2rem;
    opacity: 0.65;
}

/* ── Tables ───────────────────────────────────────────────────────────────── */
[b-sonryfafut] .doc-table-wrap {
    overflow-x: auto;
    margin: 1rem 0 1.5rem;
    border: 1px solid var(--border-c);
    border-radius: 2px;
    box-shadow: 0 2px 8px var(--shadow);
}
[b-sonryfafut] .doc-table-wrap table {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--font-body, 'Crimson Pro', Georgia, serif);
    font-size: 0.9rem;
    background: var(--highlight);
}
[b-sonryfafut] .doc-table-wrap thead {
    background: var(--ink);
    color: var(--accent-parchment-lt);
}
[b-sonryfafut] .doc-table-wrap thead th {
    font-family: var(--font-heading, 'Cinzel', serif);
    font-size: 0.68rem;
    letter-spacing: 0.14em;
    padding: 0.6rem 0.9rem;
    text-align: left;
    white-space: nowrap;
    border-right: 1px solid rgba(184,134,11,0.25);
}
[b-sonryfafut] .doc-table-wrap thead th:last-child { border-right: none; }
[b-sonryfafut] .doc-table-wrap tbody tr { border-bottom: 1px solid var(--border-c); transition: background 0.15s; }
[b-sonryfafut] .doc-table-wrap tbody tr:last-child { border-bottom: none; }
[b-sonryfafut] .doc-table-wrap tbody tr:hover { background: rgba(184,134,11,0.07); }
[b-sonryfafut] .doc-table-wrap tbody td {
    padding: 0.5rem 0.9rem;
    border-right: 1px solid rgba(196,169,106,0.3);
    vertical-align: top;
    color: var(--ink);
}
[b-sonryfafut] .doc-table-wrap tbody td:last-child { border-right: none; }
[b-sonryfafut] .doc-table-wrap tbody tr:nth-child(even) { background: rgba(237,227,200,0.6); }
[b-sonryfafut] .doc-table-wrap tbody tr:nth-child(even):hover { background: rgba(184,134,11,0.07); }

/* ── Search highlights ────────────────────────────────────────────────────── */
[b-sonryfafut] mark.doc-highlight {
    background: rgba(212,160,23,0.35);
    color: var(--ink);
    border-radius: 2px;
    padding: 0 2px;
}
[b-sonryfafut] mark.doc-highlight--active {
    background: rgba(212,160,23,0.75);
    color: var(--ink);
    box-shadow: 0 0 0 1px rgba(184,134,11,0.5);
}

/* ── Responsive (mobile-first) ───────────────────────────────────────────── */

/* Mobile defaults - stacked layout */
.doc-page-layout[b-sonryfafut] { flex-direction: column; }
.doc-toc-sidebar[b-sonryfafut] {
    position: static;
    width: 100%;
    max-height: 280px;
    border-right: none;
    border-bottom: 3px solid var(--accent);
}
.doc-toc-sidebar.toc-collapsed[b-sonryfafut] { width: 100%; max-height: none; }
.doc-search-bar[b-sonryfafut] { margin: 1rem 1rem 0; }
.doc-content[b-sonryfafut] { padding: 1rem 1rem 3rem; max-width: 100%; }
.doc-ms-header[b-sonryfafut] { padding: 1.5rem 1.2rem 1.5rem; }
.doc-parchment-page[b-sonryfafut] { margin: 0 -1rem; }

@media (min-width: 640px) {
    .doc-parchment-page[b-sonryfafut] { margin: 0 -2rem; }
    .doc-content[b-sonryfafut] { padding: 1.5rem 1.5rem 3rem; }
    .doc-search-bar[b-sonryfafut] { margin: 1rem 1.5rem 0; }
}

@media (min-width: 1024px) {
    .doc-page-layout[b-sonryfafut] { flex-direction: row; }
    .doc-toc-sidebar[b-sonryfafut] {
        position: sticky;
        width: auto;
        max-height: calc(100vh - 2rem);
        border-right: inherit;
        border-bottom: none;
    }
    .doc-toc-sidebar.toc-collapsed[b-sonryfafut] { width: auto; max-height: auto; }
    .doc-content[b-sonryfafut] { padding: 2rem 2rem 4rem; max-width: none; }
    .doc-ms-header[b-sonryfafut] { padding: 2rem 2rem 1.5rem; }
}
/* /Components/Pages/Community/Documents.razor.rz.scp.css */
.documents-page[b-ichbnslru0] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 1rem 0.75rem 3rem;
}

@media (min-width: 640px) {
    .documents-page[b-ichbnslru0] {
        padding: 2rem 1.25rem 4rem;
    }
}

/* ── Empty states ────────────────────────────────────────────────────────── */
.documents-empty[b-ichbnslru0] {
    text-align: center;
    padding: 5rem 2rem;
    color: var(--text-muted);
    font-family: var(--font-body);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.documents-no-match[b-ichbnslru0] {
    padding: 3rem 2rem;
}

.empty-icon[b-ichbnslru0] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text);
}

.btn-clear-filter[b-ichbnslru0] {
    margin-top: 0.25rem;
    padding: 0.4rem 1rem;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text-muted);
    border-radius: 5px;
    font-family: var(--font-ui);
    font-size: 0.8rem;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
}

.btn-clear-filter:hover[b-ichbnslru0] {
    border-color: var(--accent);
    color: var(--accent);
}

/* ── Filter bar ──────────────────────────────────────────────────────────── */
.doc-filter-bar[b-ichbnslru0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--container-raised);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0.5rem 0.9rem;
    margin-bottom: 1rem;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.doc-filter-bar:focus-within[b-ichbnslru0] {
    border-color: color-mix(in srgb, var(--accent) 40%, transparent);
    box-shadow: 0 2px 12px color-mix(in srgb, var(--accent) 6%, transparent);
}

.doc-filter-icon[b-ichbnslru0] {
    display: flex;
    align-items: center;
    color: var(--text-muted);
    flex-shrink: 0;
}

.doc-filter-input[b-ichbnslru0] {
    flex: 1;
    background: none;
    border: none;
    outline: none;
    color: var(--text);
    font-family: var(--font-ui);
    font-size: 0.875rem;
}

.doc-filter-input[b-ichbnslru0]::placeholder {
    color: var(--text-muted);
}

.doc-filter-count[b-ichbnslru0] {
    font-family: var(--font-ui);
    font-size: 0.72rem;
    color: var(--text-muted);
    white-space: nowrap;
    background: var(--container-bg);
    padding: 0.1rem 0.45rem;
    border-radius: 10px;
    border: 1px solid var(--border);
}

.doc-filter-clear[b-ichbnslru0] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 4px;
    transition: color 0.15s, background 0.15s;
}

.doc-filter-clear:hover[b-ichbnslru0] {
    color: var(--danger);
    background: rgba(255, 107, 107, 0.1);
}

/* ── Table wrapper ───────────────────────────────────────────────────────── */
.documents-table-wrap[b-ichbnslru0] {
    background: var(--container-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
}

.documents-table[b-ichbnslru0] {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--font-body);
    font-size: 0.88rem;
}

.documents-table thead tr[b-ichbnslru0] {
    border-bottom: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.02);
}

.documents-table th[b-ichbnslru0] {
    padding: 0.75rem 1.1rem;
    text-align: left;
    font-family: var(--font-ui);
    font-size: 0.7rem;
    letter-spacing: 0.09em;
    color: var(--text-muted);
    text-transform: uppercase;
    font-weight: 600;
    white-space: nowrap;
}

.doc-row[b-ichbnslru0] {
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: background 0.1s;
}

.doc-row:last-child[b-ichbnslru0] {
    border-bottom: none;
}

.doc-row:hover[b-ichbnslru0] {
    background: rgba(255, 255, 255, 0.025);
}

.documents-table td[b-ichbnslru0] {
    padding: 0.8rem 1.1rem;
    color: var(--text);
    vertical-align: middle;
}

.doc-name[b-ichbnslru0] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 500;
    max-width: 300px;
}

.doc-icon[b-ichbnslru0] {
    font-size: 1.05rem;
    flex-shrink: 0;
}

.doc-name-text[b-ichbnslru0] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.doc-size[b-ichbnslru0], .doc-uploader[b-ichbnslru0], .doc-date[b-ichbnslru0] {
    color: var(--text-muted);
    white-space: nowrap;
}

/* ── File type badge ─────────────────────────────────────────────────────── */
.file-type-badge[b-ichbnslru0] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 3px;
    font-size: 0.67rem;
    font-family: var(--font-ui);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    white-space: nowrap;
}

.file-type-pdf[b-ichbnslru0] {
    background: rgba(192, 57, 43, 0.14);
    color: var(--danger);
    border: 1px solid rgba(192, 57, 43, 0.22);
}

.file-type-docx[b-ichbnslru0] {
    background: rgba(41, 128, 185, 0.14);
    color: var(--info);
    border: 1px solid rgba(41, 128, 185, 0.22);
}

/* ── Action buttons ──────────────────────────────────────────────────────── */
.doc-actions[b-ichbnslru0] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    white-space: nowrap;
}

.btn-action[b-ichbnslru0] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.28rem 0.7rem;
    border-radius: 5px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent);
    background: transparent;
    color: var(--accent);
    transition: background 0.15s, border-color 0.15s;
    line-height: 1.4;
}

.btn-action:hover[b-ichbnslru0] {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
}

.btn-action--page[b-ichbnslru0] {
    background: color-mix(in srgb, var(--accent) 7%, transparent);
    border-color: color-mix(in srgb, var(--accent) 38%, transparent);
    font-weight: 500;
}

.btn-action--page:hover[b-ichbnslru0] {
    background: color-mix(in srgb, var(--accent) 16%, transparent);
}

.btn-action--convert[b-ichbnslru0] {
    border-color: rgba(100, 160, 255, 0.28);
    color: rgba(120, 175, 255, 0.88);
}

.btn-action--convert:hover[b-ichbnslru0] {
    background: rgba(100, 160, 255, 0.09);
    border-color: rgba(100, 160, 255, 0.5);
}

.btn-action--delete[b-ichbnslru0] {
    border-color: rgba(255, 69, 58, 0.2);
    color: rgba(255, 90, 80, 0.65);
    padding: 0.28rem 0.55rem;
}

.btn-action--delete:hover[b-ichbnslru0] {
    border-color: rgba(255, 69, 58, 0.55);
    color: var(--danger);
    background: rgba(255, 69, 58, 0.09);
}

/* ── Converting state ────────────────────────────────────────────────────── */
.doc-converting[b-ichbnslru0] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-body);
    font-size: 0.78rem;
    color: var(--text-muted);
    font-style: italic;
}

.converting-dot[b-ichbnslru0] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-dim);
    animation: convert-pulse-b-ichbnslru0 1.1s ease-in-out infinite;
}

@keyframes convert-pulse-b-ichbnslru0 {
    0%, 100% {
        opacity: 0.3;
        transform: scale(0.8);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}

/* ── PDF viewer ──────────────────────────────────────────────────────────── */
.doc-iframe[b-ichbnslru0] {
    width: 100%;
    flex: 1;
    min-height: 0;
    border: none;
    display: block;
    background: #fff;
}

.viewer-loading[b-ichbnslru0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    flex: 1;
    min-height: 200px;
    padding: 3rem;
    font-family: var(--font-body);
    color: var(--text-muted);
}

.viewer-state[b-ichbnslru0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    flex: 1;
    min-height: 200px;
    padding: 3rem;
    font-family: var(--font-body);
    color: var(--text-muted);
    text-align: center;
}

/* ── Shared confirm modal buttons ────────────────────────────────────────── */
.btn-secondary[b-ichbnslru0] {
    padding: 0.6rem 1.2rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border);
    color: var(--text-muted);
    border-radius: 6px;
    font-family: var(--font-body);
    cursor: pointer;
}

.btn-danger[b-ichbnslru0] {
    padding: 0.6rem 1.5rem;
    background: rgba(192, 57, 43, 0.9);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-family: var(--font-ui);
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
}

.btn-danger:disabled[b-ichbnslru0] {
    opacity: 0.55;
    cursor: not-allowed;
}

/* ════════════════════════════════════════════════════════════════════════════
   MOBILE  (<640px) — card layout
   The table header is hidden. Each row becomes a self-contained card with
   the filename on top and action buttons pinned below it.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width: 639px) {

    /* Remove the table's fixed layout so rows can go block */
    .documents-table[b-ichbnslru0],
    .documents-table tbody[b-ichbnslru0],
    .documents-table tr[b-ichbnslru0] {
        display: block;
        width: 100%;
    }

    /* Hide the entire header row — labels come from data-label attrs */
    .documents-table thead[b-ichbnslru0] {
        display: none;
    }

    /* Each row = a card */
    .doc-row[b-ichbnslru0] {
        display: flex;
        flex-direction: column;
        gap: 0.6rem;
        padding: 0.85rem 1rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    }

    .doc-row:last-child[b-ichbnslru0] {
        border-bottom: none;
    }

    /* All cells block by default, reset padding from table styles */
    .documents-table td[b-ichbnslru0] {
        display: block;
        padding: 0;
        border: none;
    }

    /* Name: full width, allow wrap */
    .doc-name[b-ichbnslru0] {
        max-width: 100%;
        font-size: 0.9rem;
    }

    .doc-name-text[b-ichbnslru0] {
        white-space: normal;
        word-break: break-word;
        overflow: visible;
        text-overflow: unset;
    }

    /* Hide secondary metadata cells entirely on mobile */
    .doc-type[b-ichbnslru0],
    .doc-size[b-ichbnslru0],
    .doc-uploader[b-ichbnslru0],
    .doc-date[b-ichbnslru0] {
        display: none;
    }

    /* Actions row: full-width, wrap naturally */
    .doc-actions[b-ichbnslru0] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.4rem;
        white-space: normal;
        width: 100%;
    }

    /* Buttons: slightly larger tap targets, keep labels visible */
    .btn-action[b-ichbnslru0] {
        flex: 1 1 auto;
        min-width: 0;
        justify-content: center;
        padding: 0.45rem 0.6rem;
        font-size: 0.8rem;
    }

    /* Delete button should not stretch */
    .btn-action--delete[b-ichbnslru0] {
        flex: 0 0 auto;
        padding: 0.45rem 0.6rem;
    }
}

/* ── Tablet (640px – 1023px): table layout, hide Uploader ─────────────── */
@media (min-width: 640px) {
    .doc-type[b-ichbnslru0] {
        display: table-cell;
    }

    .doc-date[b-ichbnslru0] {
        display: table-cell;
    }

    .doc-uploader[b-ichbnslru0] {
        display: none;
    }

    .documents-table th:nth-child(4)[b-ichbnslru0] {
        display: none;
    }
}

/* ── Desktop (≥1024px): show all columns ─────────────────────────────── */
@media (min-width: 1024px) {
    .doc-uploader[b-ichbnslru0] {
        display: table-cell;
    }

    .documents-table th:nth-child(4)[b-ichbnslru0] {
        display: table-cell;
    }
}
/* /Components/Pages/Community/EventCalendar.razor.rz.scp.css */
/* ── Page shell ───────────────────────────────────────────────────────────── */
.cal-page[b-yaib50rxs0]    { max-width: 1200px; margin: 0 auto; }
.cal-wrapper[b-yaib50rxs0] { display: flex; flex-direction: column; gap: 0.75rem; }

.cal-container[b-yaib50rxs0] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1.5rem;
}

/* ── Toolbar ──────────────────────────────────────────────────────────────── */
.cal-toolbar[b-yaib50rxs0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.cal-view-switcher[b-yaib50rxs0] {
    display: flex;
    background: var(--page-bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    padding: 2px;
    gap: 2px;
}

.cal-view-btn[b-yaib50rxs0] {
    background: transparent;
    color: var(--text-muted);
    border: none;
    padding: 0.3rem 1.1rem;
    font-family: var(--font-ui);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
    border-radius: 5px;
    transition: background 0.15s, color 0.15s;
}

.cal-view-btn--active[b-yaib50rxs0] {
    background: var(--accent);
    color: var(--page-bg);
}

.cal-view-btn:not(.cal-view-btn--active):hover[b-yaib50rxs0] {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    color: var(--text);
}

.cal-settings-toggle[b-yaib50rxs0] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--page-bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-muted);
    font-family: var(--font-ui);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding: 0.35rem 0.85rem;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.cal-settings-toggle:hover[b-yaib50rxs0],
.cal-settings-toggle--active[b-yaib50rxs0] {
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 6%, transparent);
}

/* ── Colour settings panel ────────────────────────────────────────────────── */
.cal-settings-panel[b-yaib50rxs0] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cal-settings-row[b-yaib50rxs0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cal-settings-swatch[b-yaib50rxs0] {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    flex-shrink: 0;
    border: 1px solid rgba(255,255,255,0.12);
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

.cal-settings-label[b-yaib50rxs0] {
    font-family: var(--font-body);
    font-size: 0.83rem;
    color: var(--text);
    min-width: 130px;
}

.cal-color-input[b-yaib50rxs0] {
    width: 36px;
    height: 28px;
    border: 1px solid var(--border);
    border-radius: 5px;
    padding: 2px;
    background: var(--card-bg);
    cursor: pointer;
}

.cal-settings-hex[b-yaib50rxs0] {
    font-size: 0.78rem;
    color: var(--text-muted);
    font-family: monospace;
    min-width: 62px;
}

.cal-reset-btn[b-yaib50rxs0] {
    background: none;
    border: 1px solid var(--border);
    border-radius: 5px;
    color: var(--text-muted);
    font-size: 0.75rem;
    padding: 0.22rem 0.55rem;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
}

.cal-reset-btn:hover[b-yaib50rxs0] { border-color: var(--text-muted); color: var(--text); }

/* ── Navigation ───────────────────────────────────────────────────────────── */
.cal-nav[b-yaib50rxs0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.1rem;
    gap: 1rem;
}

.cal-nav-btn[b-yaib50rxs0] {
    font-size: 1.5rem;
    line-height: 1;
    padding: 0.2rem 0.7rem;
}

.cal-title[b-yaib50rxs0] {
    font-family: var(--font-heading);
    color: var(--accent);
    font-size: 1.5rem;
    margin: 0;
    text-align: center;
    flex: 1;
    letter-spacing: 0.02em;
}

/* ── Legend ───────────────────────────────────────────────────────────────── */
.cal-legend[b-yaib50rxs0] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1.25rem;
    font-family: var(--font-body);
    font-size: 0.82rem;
    color: var(--text-muted);
}

.cal-legend-item[b-yaib50rxs0] { display: flex; align-items: center; gap: 0.45rem; }

.cal-legend-dot[b-yaib50rxs0] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.cal-legend-dot--going[b-yaib50rxs0] { background: var(--cal-going); }
.cal-legend-dot--other[b-yaib50rxs0] { background: var(--cal-other); }

/* ── Month grid ───────────────────────────────────────────────────────────── */
.cal-grid[b-yaib50rxs0] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    background: var(--border);
    border: 1px solid var(--border);
    border-radius: 6px;
    overflow: hidden;
}

.cal-header-cell[b-yaib50rxs0] {
    background: var(--page-bg);
    color: var(--text-muted);
    font-family: var(--font-ui);
    font-size: 0.7rem;
    font-weight: 700;
    text-align: center;
    padding: 0.55rem 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.09em;
}

.cal-cell[b-yaib50rxs0] {
    background: var(--card-bg);
    min-height: 100px;
    padding: 0.5rem 0.45rem;
    position: relative;
    overflow: hidden;
    transition: background 0.12s;
}

.cal-cell--empty[b-yaib50rxs0]  { background: var(--page-bg); }
.cal-cell--today[b-yaib50rxs0]  { background: color-mix(in srgb, var(--accent) 7%, var(--card-bg)); }

/* Day number */
.cal-day-num[b-yaib50rxs0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    font-family: var(--font-ui);
    font-size: 0.78rem;
    color: var(--text-muted);
    font-weight: 600;
    margin-bottom: 0.3rem;
    line-height: 1;
    border-radius: 50%;
}

.cal-day-num--today[b-yaib50rxs0] {
    background: var(--accent);
    color: var(--page-bg);
    font-weight: 700;
}

/* ── Event pills ──────────────────────────────────────────────────────────── */
.cal-events[b-yaib50rxs0] { display: flex; flex-direction: column; gap: 2px; }

.cal-event[b-yaib50rxs0] {
    padding: 2px 6px;
    font-size: 0.71rem;
    cursor: pointer;
    display: flex;
    gap: 4px;
    align-items: baseline;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    transition: filter 0.15s, opacity 0.15s;
    position: relative;
    z-index: 1;
    border-left-width: 2px;
    border-left-style: solid;
}

.cal-event:hover[b-yaib50rxs0] { filter: brightness(1.3); }

.cal-event--single[b-yaib50rxs0]     { border-radius: 4px; }
.cal-event--span-start[b-yaib50rxs0] { border-radius: 4px 0 0 4px; margin-right: -0.45rem; padding-right: 0; }
.cal-event--span-mid[b-yaib50rxs0]   { border-radius: 0; border-left: none !important; margin-left: -0.45rem; margin-right: -0.45rem; padding-left: 3px; padding-right: 0; opacity: 0.75; min-height: 1.3em; }
.cal-event--span-end[b-yaib50rxs0]   { border-radius: 0 4px 4px 0; border-left: none !important; margin-left: -0.45rem; padding-left: 5px; opacity: 0.88; }

.cal-event--going[b-yaib50rxs0] {
    outline: 2px solid var(--cal-going);
    outline-offset: -1px;
}

.cal-event--waiting[b-yaib50rxs0] {
    outline: 2px solid var(--cal-other);
    outline-offset: -1px;
}

.cal-event--hidden[b-yaib50rxs0] { opacity: 0.4; filter: grayscale(0.5); }
.cal-event--hidden:hover[b-yaib50rxs0] { opacity: 0.65; }

.cal-event-time[b-yaib50rxs0]  { font-weight: 700; flex-shrink: 0; opacity: 0.9; }
.cal-event-title[b-yaib50rxs0] { overflow: hidden; text-overflow: ellipsis; min-width: 0; }

/* "+N more" overflow link */
.cal-more-btn[b-yaib50rxs0] {
    display: block;
    width: 100%;
    background: none;
    border: none;
    padding: 1px 2px;
    margin-top: 1px;
    font-family: var(--font-ui);
    font-size: 0.67rem;
    font-weight: 600;
    color: var(--text-muted);
    cursor: pointer;
    text-align: left;
    letter-spacing: 0.03em;
    transition: color 0.15s;
}
.cal-more-btn:hover[b-yaib50rxs0] { color: var(--accent); }

/* ── Day detail modal overlay ─────────────────────────────────────────────── */
.cal-day-overlay[b-yaib50rxs0] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 200;
    backdrop-filter: blur(2px);
}

.cal-day-panel[b-yaib50rxs0] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 1.5rem;
    min-width: 320px;
    max-width: 480px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    box-shadow: 0 8px 40px rgba(0,0,0,0.5);
}

.cal-day-panel-header[b-yaib50rxs0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.25rem;
}

.cal-day-panel-title[b-yaib50rxs0] {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    color: var(--accent);
    margin: 0;
}

.cal-day-panel-close[b-yaib50rxs0] {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 0.2rem;
    transition: color 0.15s;
}
.cal-day-panel-close:hover[b-yaib50rxs0] { color: var(--text); }

.cal-day-event[b-yaib50rxs0] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.65rem 0.8rem;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--card-bg) 60%, var(--page-bg));
}
.cal-day-event:hover[b-yaib50rxs0] { background: color-mix(in srgb, var(--accent) 8%, var(--card-bg)); border-color: color-mix(in srgb, var(--accent) 30%, transparent); }

.cal-day-event-dot[b-yaib50rxs0] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 3px;
}

.cal-day-event-info[b-yaib50rxs0] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }

.cal-day-event-title[b-yaib50rxs0] {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cal-day-event-meta[b-yaib50rxs0] {
    font-family: var(--font-body);
    font-size: 0.78rem;
    color: var(--text-muted);
}

/* ── Year grid ────────────────────────────────────────────────────────────── */
.cal-year-grid[b-yaib50rxs0] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.1rem;
}

.cal-mini-month[b-yaib50rxs0] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0.7rem 0.6rem;
    transition: border-color 0.15s;
}

.cal-mini-month:hover[b-yaib50rxs0] {
    border-color: color-mix(in srgb, var(--accent) 35%, transparent);
}

.cal-mini-title[b-yaib50rxs0] {
    font-family: var(--font-heading);
    font-size: 0.84rem;
    color: var(--accent);
    text-align: center;
    margin-bottom: 0.5rem;
    cursor: pointer;
    letter-spacing: 0.04em;
    transition: color 0.15s, opacity 0.15s;
}

.cal-mini-title:hover[b-yaib50rxs0] { opacity: 0.75; }

.cal-mini-grid[b-yaib50rxs0] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
}

.cal-mini-header[b-yaib50rxs0] {
    font-size: 0.56rem;
    font-weight: 700;
    color: var(--text-muted);
    text-align: center;
    padding: 1px 0 2px;
    text-transform: uppercase;
    opacity: 0.7;
}

.cal-mini-cell[b-yaib50rxs0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1px 0;
    border-radius: 3px;
    cursor: pointer;
    min-height: 22px;
    transition: background 0.12s;
}

.cal-mini-cell:hover[b-yaib50rxs0] { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.cal-mini-cell--today[b-yaib50rxs0] { background: color-mix(in srgb, var(--accent) 10%, transparent); }

.cal-mini-day[b-yaib50rxs0] {
    font-size: 0.63rem;
    color: var(--text-muted);
    line-height: 1.35;
}

.cal-mini-day--today[b-yaib50rxs0] {
    background: var(--accent);
    color: var(--page-bg);
    font-weight: 700;
    border-radius: 50%;
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.58rem;
}

.cal-mini-cell--has-events .cal-mini-day[b-yaib50rxs0] { color: var(--text); }

.cal-mini-dots[b-yaib50rxs0] {
    display: flex;
    gap: 2px;
    justify-content: center;
    margin-top: 1px;
}

.cal-mini-dot[b-yaib50rxs0] {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    display: inline-block;
}

.cal-mini-dot--going[b-yaib50rxs0] { background: var(--cal-going); }
.cal-mini-dot--other[b-yaib50rxs0] { background: var(--cal-other); }

/* ── Year view - fluid, no breakpoints needed ─────────────────────────────── */

.cal-year-grid[b-yaib50rxs0] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

/* ── Responsive (mobile-first) ────────────────────────────────────────────── */

/* Default (mobile) - compact cells, dot pills, bottom sheet */
.cal-container[b-yaib50rxs0] { padding: 0.85rem var(--gutter-x, 1rem); }
.cal-cell[b-yaib50rxs0]      { min-height: var(--tap-target, 44px); padding: 0.25rem; }
.cal-day-num[b-yaib50rxs0]   { width: 22px; height: 22px; font-size: 0.7rem; }
.cal-header-cell[b-yaib50rxs0] { font-size: 0.58rem; padding: 0.35rem 0.1rem; }

.cal-event[b-yaib50rxs0] {
    padding: 0;
    height: 4px;
    border-left: none;
    border-radius: 2px;
    margin-bottom: 1.5px;
    font-size: 0;
}
.cal-event-time[b-yaib50rxs0], .cal-event-title[b-yaib50rxs0] { display: none; }

.cal-day-overlay[b-yaib50rxs0] { align-items: flex-end; padding: 0; }
.cal-day-panel[b-yaib50rxs0] {
    width: 100%;
    max-width: none;
    max-height: 75vh;
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    margin-bottom: 0;
    animation: sheet-up var(--t-slow, 0.25s) var(--ease, ease);
}
.cal-day-panel[b-yaib50rxs0]::before {
    content: "";
    display: block;
    width: 36px;
    height: 4px;
    background: var(--border);
    border-radius: var(--radius-pill, 999px);
    margin: 0.75rem auto 0.5rem;
}

/* Tablet (≥ sm) - restore text pills */
@media (min-width: 640px) {
    .cal-container[b-yaib50rxs0]  { padding: 1.25rem; }
    .cal-cell[b-yaib50rxs0]       { min-height: 82px; padding: 0.4rem; }
    .cal-day-num[b-yaib50rxs0]    { width: 24px; height: 24px; font-size: 0.78rem; }
    .cal-header-cell[b-yaib50rxs0]{ font-size: 0.7rem; padding: 0.55rem 0.25rem; }

    .cal-event[b-yaib50rxs0] {
        padding: 1px 5px;
        height: auto;
        border-left: 2px solid;
        border-radius: var(--radius-sm);
        font-size: 0.68rem;
    }
    .cal-event-title[b-yaib50rxs0] { display: inline; }
    .cal-event-time[b-yaib50rxs0]  { display: none; }

    .cal-day-overlay[b-yaib50rxs0] { align-items: center; padding: 2rem; }
    .cal-day-panel[b-yaib50rxs0]   { max-width: 520px; max-height: 80vh; border-radius: var(--radius-lg); }
    .cal-day-panel[b-yaib50rxs0]::before { display: none; }
}

/* Desktop (≥ md) - restore time prefix */
@media (min-width: 1024px) {
    .cal-cell[b-yaib50rxs0]       { min-height: 100px; }
    .cal-event[b-yaib50rxs0]      { font-size: 0.72rem; }
    .cal-event-time[b-yaib50rxs0] { display: inline; margin-right: 0.25rem; color: var(--text-muted); }
}

/* cal-settings-label mobile override */
.cal-settings-label[b-yaib50rxs0] { min-width: unset; }

/* ── Agenda view ─────────────────────────────────────────────────────────── */

.agenda[b-yaib50rxs0] { display: flex; flex-direction: column; gap: 0.85rem; }

.agenda-day[b-yaib50rxs0] {
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 0.85rem;
}

.agenda-day-label[b-yaib50rxs0] { font-family: var(--font-heading); text-align: center; }

.agenda-day-d[b-yaib50rxs0] {
    font-size: 1.4rem;
    color: var(--accent);
    font-weight: 600;
    line-height: 1;
}

.agenda-day-w[b-yaib50rxs0] {
    font-family: var(--font-ui);
    font-size: 0.58rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-top: 0.25rem;
}

.agenda-events[b-yaib50rxs0] { display: flex; flex-direction: column; gap: 0.45rem; }

.agenda-evt[b-yaib50rxs0] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-left: 3px solid var(--cal-going, #c9a84c);
    border-radius: 6px;
    padding: 0.55rem 0.7rem;
}

.agenda-evt.other[b-yaib50rxs0] { border-left-color: var(--cal-other, #4a90d9); }

.agenda-evt-name[b-yaib50rxs0] {
    font-family: var(--font-body);
    font-size: 0.88rem;
    color: var(--text);
    font-weight: 500;
    margin: 0 0 0.15rem;
}

.agenda-evt-meta[b-yaib50rxs0] {
    font-family: var(--font-body);
    font-size: 0.72rem;
    color: var(--text-muted);
}

.agenda-empty[b-yaib50rxs0] {
    font-family: var(--font-body);
    color: var(--text-muted);
    font-style: italic;
    padding: 1.5rem 0;
    text-align: center;
}
/* /Components/Pages/Community/EventDetail.razor.rz.scp.css */
.event-detail-page[b-hhb6jrtm49] { min-height: 100vh; }

.detail-loading[b-hhb6jrtm49] {
    display: flex; align-items: center; gap: 1rem;
    justify-content: center; padding: 8rem;
    color: var(--text-muted); font-family: var(--font-body);
}

.detail-error[b-hhb6jrtm49] {
    max-width: 600px; margin: 4rem auto; padding: 2rem;
    text-align: center; color: var(--text-muted); font-family: var(--font-body);
}

.event-hero[b-hhb6jrtm49] { width: 100%; height: 220px; background-size: cover; background-position: center; }

.event-detail-body[b-hhb6jrtm49] { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }

.event-detail-header[b-hhb6jrtm49] {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 1.5rem; flex-wrap: wrap; gap: 0.75rem;
}
.event-detail-actions[b-hhb6jrtm49] { display: flex; gap: 0.75rem; align-items: center; }

.btn-back[b-hhb6jrtm49] {
    background: none; border: none; color: var(--text-muted);
    font-family: var(--font-body); font-size: 0.9rem; cursor: pointer;
    padding: 0; transition: color 0.15s;
}
.btn-back:hover[b-hhb6jrtm49] { color: var(--accent); }

.btn-outline[b-hhb6jrtm49] {
    padding: 0.5rem 1.1rem;
    border: 1px solid var(--border);
    background: transparent; color: var(--text-muted);
    border-radius: 6px; font-family: var(--font-body);
    font-size: 0.85rem; cursor: pointer; transition: border-color 0.15s, color 0.15s;
}
.btn-outline:hover[b-hhb6jrtm49] { border-color: var(--accent); color: var(--accent); }

.btn-danger-outline[b-hhb6jrtm49] {
    padding: 0.5rem 1.1rem;
    border: 1px solid rgba(255,69,58,0.4);
    background: transparent; color: rgba(255,69,58,0.8);
    border-radius: 6px; font-family: var(--font-body);
    font-size: 0.85rem; cursor: pointer; transition: all 0.15s;
}
.btn-danger-outline:hover[b-hhb6jrtm49] { border-color: var(--danger); color: var(--danger); background: rgba(255,69,58,0.08); }

/* Two-column layout: main content | sticky sidebar */
.event-detail-content[b-hhb6jrtm49] {
    display: grid;
    grid-template-columns: 1fr 270px;
    gap: 2rem;
    align-items: start;
}

.event-detail-title[b-hhb6jrtm49] {
    font-family: var(--font-heading);
    font-size: 1.75rem; color: var(--accent);
    margin: 0 0 0.5rem;
    line-height: 1.2;
}

.event-type-badge[b-hhb6jrtm49] {
    display: inline-block;
    border-radius: 20px; border: 1px solid;
    padding: 0.2rem 0.7rem;
    font-family: var(--font-body); font-size: 0.8rem; font-weight: 600;
    margin-bottom: 1rem;
}

.event-detail-meta-row[b-hhb6jrtm49] {
    display: flex; flex-wrap: wrap; gap: 1.25rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--border);
}
.meta-item[b-hhb6jrtm49] { display: flex; align-items: flex-start; gap: 0.6rem; }
.meta-icon[b-hhb6jrtm49] { font-size: 1rem; margin-top: 2px; }
.meta-label[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.72rem; color: var(--text-muted); letter-spacing: 0.08em; text-transform: uppercase; }
.meta-value[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.9rem; color: var(--text); margin-top: 2px; }
.cap-indicator[b-hhb6jrtm49] { color: var(--text-muted); }

@keyframes pulse-dot-b-hhb6jrtm49 {
    0% {
        box-shadow: 0 0 0 0 rgba(99, 153, 34, 0.45);
    }
    70% {
        box-shadow: 0 0 0 7px rgba(99, 153, 34, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(99, 153, 34, 0);
    }
}

.release-cycle-banner[b-hhb6jrtm49] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 0.8125rem;
}

.release-cycle-banner--open[b-hhb6jrtm49] {
    background: #EAF3DE;
    border: 0.5px solid #97C459;
}

.release-cycle-banner--pending[b-hhb6jrtm49] {
    background: #FAEEDA;
    border: 0.5px solid #EF9F27;
}

.release-cycle-banner--locked[b-hhb6jrtm49] {
    background: #F1EFE8;
    border: 0.5px solid #B4B2A9;
}

/* icon (pending & locked states) */
.rcb-icon[b-hhb6jrtm49] {
    font-size: 15px;
    flex-shrink: 0;
}

.release-cycle-banner--pending .rcb-icon[b-hhb6jrtm49] {
    color: #854F0B;
}

.release-cycle-banner--locked .rcb-icon[b-hhb6jrtm49] {
    color: #5F5E5A;
}

/* pulsing dot (open state) */
.rcb-dot[b-hhb6jrtm49] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
    background: #3B6D11;
    animation: pulse-dot-b-hhb6jrtm49 2s ease infinite;
}

/* shared inner layout */
.rcb-content[b-hhb6jrtm49] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
    flex: 1;
    line-height: 1.5;
}

.rcb-detail[b-hhb6jrtm49] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}

.rcb-status[b-hhb6jrtm49] {
    font-weight: 500;
}

.release-cycle-banner--open .rcb-status[b-hhb6jrtm49] {
    color: #27500A;
}

.release-cycle-banner--open .rcb-detail[b-hhb6jrtm49] {
    color: #3B6D11;
}

.release-cycle-banner--pending .rcb-status[b-hhb6jrtm49] {
    color: #633806;
}

.release-cycle-banner--pending .rcb-detail[b-hhb6jrtm49] {
    color: #854F0B;
}

.release-cycle-banner--locked .rcb-status[b-hhb6jrtm49] {
    color: #444441;
}

.release-cycle-banner--locked .rcb-detail[b-hhb6jrtm49] {
    color: #5F5E5A;
}

/* countdown pill */
.rcb-countdown[b-hhb6jrtm49] {
    display: inline-flex;
    align-items: center;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.release-cycle-banner--open .rcb-countdown[b-hhb6jrtm49] {
    background: #C0DD97;
    color: #27500A;
}

.release-cycle-banner--pending .rcb-countdown[b-hhb6jrtm49] {
    background: #FAC775;
    color: #633806;
}

/* force unlock button */
.rcb-action[b-hhb6jrtm49] {
    flex-shrink: 0;
    padding: 4px 12px;
    border-radius: 6px;
    border: 0.5px solid #B4B2A9;
    background: transparent;
    font-size: 0.75rem;
    font-weight: 500;
    color: #444441;
    cursor: pointer;
    transition: background 0.15s;
}

.rcb-action:hover:not(:disabled)[b-hhb6jrtm49] {
    background: #D3D1C7;
}

.rcb-action:disabled[b-hhb6jrtm49] {
    opacity: 0.55;
    cursor: not-allowed;
}

.going-section[b-hhb6jrtm49] {
    margin-bottom: 1.5rem;
    margin-top: 1.5rem;
}
.btn-going[b-hhb6jrtm49] {
    padding: 0.65rem 1.75rem;
    border: 1px solid var(--accent);
    background: transparent; color: var(--accent);
    border-radius: 8px; font-family: var(--font-ui);
    font-size: 0.88rem; font-weight: 700; letter-spacing: 0.06em;
    cursor: pointer; transition: all 0.15s;
}
.btn-going:hover:not(:disabled)[b-hhb6jrtm49] { background: var(--accent); color: var(--page-bg); }
.btn-going--active[b-hhb6jrtm49] { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.btn-going--active:hover:not(:disabled)[b-hhb6jrtm49] { background: rgba(255,69,58,0.12); border-color: rgba(255,69,58,0.5); color: var(--danger); }
.btn-going:disabled[b-hhb6jrtm49] { opacity: 0.5; cursor: not-allowed; }
.btn-going--crew[b-hhb6jrtm49] { border-color: color-mix(in srgb, var(--accent) 60%, transparent); opacity: 0.9; }

.registration-actions[b-hhb6jrtm49] { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; }
.crew-registration[b-hhb6jrtm49] { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.crew-registration-label[b-hhb6jrtm49] { font-size: 0.78rem; color: var(--text-muted); margin-bottom: 0.5rem; font-style: italic; }
.crew-registration-actions[b-hhb6jrtm49] { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.btn-not-going[b-hhb6jrtm49] {
    padding: 0.65rem 1.2rem;
    border: 1px solid color-mix(in srgb, var(--text-muted) 40%, transparent);
    background: transparent; color: var(--text-muted);
    border-radius: 8px; font-family: var(--font-ui); font-size: 0.82rem;
    font-weight: 600; letter-spacing: 0.04em; cursor: pointer;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.btn-not-going:hover:not(:disabled)[b-hhb6jrtm49] { border-color: rgba(255,59,48,0.5); color: var(--danger, #ff3b30); background: rgba(255,59,48,0.06); }
.btn-not-going:disabled[b-hhb6jrtm49] { opacity: 0.5; cursor: not-allowed; }
.dismissed-status[b-hhb6jrtm49] {
    display: flex; flex-direction: column; gap: 0.6rem;
    padding: 1rem; border-radius: 8px;
    background: rgba(255,59,48,0.06); border: 1px solid rgba(255,59,48,0.2);
}
.dismissed-label[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.88rem; color: var(--danger, #ff3b30); }

.section-heading[b-hhb6jrtm49] { font-family: var(--font-heading); font-size: 1rem; color: var(--text); margin: 0 0 0.75rem; font-weight: 600; }
.description-body[b-hhb6jrtm49] { font-family: var(--font-body); color: var(--text-muted); line-height: 1.7; white-space: normal; font-size: 0.95rem; }

/* Sidebar - sticky and scrollable so it never forces page height */
.event-detail-sidebar[b-hhb6jrtm49] {
    display: flex; flex-direction: column; gap: 0.75rem;
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
}
.event-detail-sidebar[b-hhb6jrtm49]::-webkit-scrollbar { width: 4px; }
.event-detail-sidebar[b-hhb6jrtm49]::-webkit-scrollbar-track { background: transparent; }
.event-detail-sidebar[b-hhb6jrtm49]::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }

.sidebar-card[b-hhb6jrtm49] {
    background: var(--card-bg); border: 1px solid var(--border);
    border-radius: 8px; padding: 1rem;
    min-width: 0;
}
.sidebar-card-header[b-hhb6jrtm49] {
    font-family: var(--font-heading); font-size: 0.72rem; color: var(--text-muted);
    letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 0.75rem;
}
.capacity-bar-wrap[b-hhb6jrtm49] { display: flex; flex-direction: column; gap: 0.4rem; }
.capacity-bar[b-hhb6jrtm49] { height: 5px; background: rgba(255,255,255,0.08); border-radius: 3px; overflow: hidden; }
.capacity-fill[b-hhb6jrtm49] { height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent-mid)); border-radius: 3px; transition: width 0.3s; }
.capacity-label[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.78rem; color: var(--text-muted); }
.capacity-unlimited[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); }

.attendees-card .sidebar-card-header[b-hhb6jrtm49] { display: flex; align-items: center; justify-content: space-between; }
.attendee-count-badge[b-hhb6jrtm49] {
    background: color-mix(in srgb, var(--accent) 15%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
    color: var(--accent); border-radius: 20px; padding: 0.1rem 0.55rem;
    font-family: var(--font-body); font-size: 0.72rem; font-weight: 600;
}
.attendees-loading[b-hhb6jrtm49] {
    display: flex; align-items: center; gap: 0.5rem;
    font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted);
    padding: 0.5rem 0;
}
.loading-orb--sm[b-hhb6jrtm49] { width: 14px; height: 14px; border-width: 2px; }
.attendees-empty[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.83rem; color: var(--text-muted); margin: 0; font-style: italic; }
.attendees-list[b-hhb6jrtm49] {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: 0.5rem;
}
.attendee-row[b-hhb6jrtm49] { display: flex; align-items: center; gap: 0.6rem; position: relative; }

.days-tooltip[b-hhb6jrtm49] {
    display: none;
    position: absolute; bottom: calc(100% + 7px); left: 0;
    background: var(--card-bg, #232325);
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 7px; padding: 0.5rem 0.65rem;
    box-shadow: 0 4px 18px rgba(0,0,0,0.5);
    max-width: 220px; z-index: 20; pointer-events: none;
}
.attendee-row:hover .days-tooltip[b-hhb6jrtm49] { display: block; }
.attendee-row:hover .attendee-name[b-hhb6jrtm49] { color: var(--accent); }

.tip-label[b-hhb6jrtm49] {
    font-size: 0.66rem; color: var(--text-muted);
    text-transform: uppercase; letter-spacing: 0.07em; margin-bottom: 5px;
    white-space: nowrap;
}
.tip-chips[b-hhb6jrtm49] { display: flex; flex-wrap: wrap; gap: 4px; }
.tip-chip[b-hhb6jrtm49] {
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent); border-radius: 4px;
    padding: 0.1rem 0.45rem; font-size: 0.72rem; font-weight: 600;
}
.tip-full[b-hhb6jrtm49] { font-size: 0.78rem; color: var(--text-muted); font-style: italic; }

.days-tooltip[b-hhb6jrtm49]::after {
    content: ''; position: absolute; top: 100%; left: 16px;
    border: 5px solid transparent;
    border-top-color: rgba(255,255,255,0.14);
}
.days-tooltip[b-hhb6jrtm49]::before {
    content: ''; position: absolute; top: calc(100% + 1px); left: 17px;
    border: 4px solid transparent;
    border-top-color: var(--card-bg, #232325);
    z-index: 1;
}
.attendee-avatar[b-hhb6jrtm49] {
    width: 28px; height: 28px; border-radius: 50%;
    background: color-mix(in srgb, var(--accent) 15%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent); font-family: var(--font-heading); font-size: 0.7rem;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.attendee-info[b-hhb6jrtm49] { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.attendee-name[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.attendee-since[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.7rem; color: var(--text-muted); }

.file-input[b-hhb6jrtm49] { width: 100%; font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); }
.upload-status[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); margin-top: 0.5rem; }
.mt-2[b-hhb6jrtm49] { margin-top: 0.5rem; }
.mb-1[b-hhb6jrtm49] { margin-bottom: 0.5rem; }

/* Character and attendance options */
.attendee-options[b-hhb6jrtm49] { display: flex; flex-direction: column; gap: 0.5rem; }
.form-label-sm[b-hhb6jrtm49] { font-size: 0.75rem; }
.required-star[b-hhb6jrtm49] { color: var(--accent); font-weight: 700; }
.form-hint[b-hhb6jrtm49] { font-size: 0.75rem; color: var(--text-muted); margin-top: 0.2rem; }
.form-hint--warn[b-hhb6jrtm49] { color: var(--accent); }
.form-control-sm[b-hhb6jrtm49] { padding: 0.4rem 0.6rem; font-size: 0.82rem; }

.attendance-type-selector[b-hhb6jrtm49] { display: flex; flex-direction: column; gap: 0.3rem; }
.radio-group[b-hhb6jrtm49] { display: flex; gap: 0.5rem; }
.radio-label[b-hhb6jrtm49] {
    display: flex; align-items: center; gap: 0.4rem;
    font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted);
    cursor: pointer; padding: 0.3rem 0.6rem;
    border: 1px solid var(--border); border-radius: 6px;
    transition: all 0.15s;
}
.radio-label input[type="radio"][b-hhb6jrtm49] { accent-color: var(--accent); margin: 0; }
.radio-label:hover[b-hhb6jrtm49] { border-color: var(--accent); color: var(--text); }
.radio-label.radio-active[b-hhb6jrtm49] { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); color: var(--accent); }

.day-checkboxes[b-hhb6jrtm49] { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.day-checkbox[b-hhb6jrtm49] { padding: 0.25rem 0.5rem; border: 1px solid var(--border); border-radius: 6px; font-size: 0.8rem; transition: border-color 0.15s; }
.day-checkbox:hover[b-hhb6jrtm49] { border-color: var(--accent); }
.day-checkbox input[type="checkbox"][b-hhb6jrtm49] { accent-color: var(--accent); }

/* Badge for character name in attendee list */
.badge-character[b-hhb6jrtm49] {
    background: rgba(90,120,160,0.12);
    border: 1px solid rgba(90,120,160,0.28);
    color: #8ab4d8;
    border-radius: 4px;
    padding: 0.1rem 0.45rem;
    font-family: var(--font-body);
    font-size: 0.68rem;
    font-weight: 600;
}

/* Attendance stats */
.stats-section[b-hhb6jrtm49] { margin-bottom: 0.75rem; }
.stats-section:last-child[b-hhb6jrtm49] { margin-bottom: 0; }
.stats-section-title[b-hhb6jrtm49] {
    font-family: var(--font-body); font-size: 0.7rem;
    color: var(--text-muted); text-transform: uppercase;
    letter-spacing: 0.06em; margin-bottom: 0.4rem;
}
.stats-list[b-hhb6jrtm49] { display: flex; flex-direction: column; gap: 0.3rem; }
.stat-row[b-hhb6jrtm49] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.25rem 0.4rem;
    border-radius: 4px;
    background: rgba(255,255,255,0.03);
}
.stat-label[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text); }
.stat-count[b-hhb6jrtm49] {
    font-family: var(--font-ui); font-size: 0.78rem; font-weight: 700;
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    padding: 0.1rem 0.5rem;
    border-radius: 10px;
    min-width: 24px;
    text-align: center;
}

/* Modal */
.alert[b-hhb6jrtm49] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; }
.alert-danger[b-hhb6jrtm49] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }

.modal-close[b-hhb6jrtm49] { background: none; border: none; color: var(--text-muted); font-size: 1.4rem; cursor: pointer; }
.form-group[b-hhb6jrtm49] { display: flex; flex-direction: column; gap: 0.4rem; }
.form-label[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); letter-spacing: 0.04em; }
.form-control[b-hhb6jrtm49],
.form-select[b-hhb6jrtm49] {
    background: rgba(255,255,255,0.04); border: 1px solid var(--border);
    color: var(--text); border-radius: 6px; padding: 0.55rem 0.8rem;
    font-family: var(--font-body); font-size: 0.9rem;
    transition: border-color 0.15s; width: 100%; box-sizing: border-box;
}
.form-control:focus[b-hhb6jrtm49],
.form-select:focus[b-hhb6jrtm49] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }
.form-grid[b-hhb6jrtm49] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

.btn-secondary[b-hhb6jrtm49] {
    padding: 0.6rem 1.2rem;
    background: rgba(255,255,255,0.06); border: 1px solid var(--border);
    color: var(--text-muted); border-radius: 6px;
    font-family: var(--font-body); cursor: pointer;
}
.btn-gold[b-hhb6jrtm49] {
    padding: 0.6rem 1.5rem;
    background: linear-gradient(135deg, var(--accent), var(--accent-mid));
    color: var(--page-bg); border: none; border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.85rem;
    font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer;
}
.btn-gold:disabled[b-hhb6jrtm49] { opacity: 0.55; cursor: not-allowed; }
.btn-danger[b-hhb6jrtm49] {
    padding: 0.6rem 1.5rem;
    background: color-mix(in srgb, var(--danger) 90%, transparent); color: #fff; border: none; border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.85rem;
    font-weight: 700; cursor: pointer;
}
.btn-danger:disabled[b-hhb6jrtm49] { opacity: 0.55; cursor: not-allowed; }

.confirm-msg[b-hhb6jrtm49] { font-family: var(--font-body); color: var(--text-muted); }
.confirm-name[b-hhb6jrtm49] { color: var(--text); }

/* Attendee list extras */
.attendee-meta[b-hhb6jrtm49] { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.badge-waiting[b-hhb6jrtm49] { background: rgba(255,159,10,0.12); border: 1px solid rgba(255,159,10,0.3); color: var(--warning); border-radius: 4px; padding: 0.1rem 0.45rem; font-family: var(--font-body); font-size: 0.68rem; font-weight: 600; }
.badge-noshow[b-hhb6jrtm49] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); border-radius: 4px; padding: 0.1rem 0.45rem; font-family: var(--font-body); font-size: 0.68rem; font-weight: 600; }
.badge-category[b-hhb6jrtm49] { background: rgba(41,128,185,0.12); border: 1px solid rgba(41,128,185,0.3); color: var(--info); border-radius: 4px; padding: 0.1rem 0.45rem; font-family: var(--font-body); font-size: 0.68rem; font-weight: 600; }

.btn-noshow-toggle[b-hhb6jrtm49] {
    margin-left: auto;
    background: none;
    border: 1px solid rgba(255,69,58,0.2);
    color: rgba(255,69,58,0.4);
    border-radius: 4px;
    width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.75rem; cursor: pointer; flex-shrink: 0;
    transition: all 0.15s;
}
.btn-noshow-toggle:hover[b-hhb6jrtm49] { border-color: rgba(255,69,58,0.6); color: var(--danger); }
.btn-noshow-toggle.active[b-hhb6jrtm49] { background: rgba(255,69,58,0.12); border-color: rgba(255,69,58,0.5); color: var(--danger); }

.attendee-row--noshow[b-hhb6jrtm49] { opacity: 0.55; }

.btn-gold-sm[b-hhb6jrtm49] {
    padding: 0.4rem 0.9rem;
    background: linear-gradient(135deg, var(--accent), var(--accent-mid));
    color: var(--page-bg); border: none; border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.75rem;
    font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
    cursor: pointer; display: inline-block;
}
.btn-gold-sm:disabled[b-hhb6jrtm49] { opacity: 0.55; cursor: not-allowed; }

.btn-danger-sm[b-hhb6jrtm49] {
    padding: 0.3rem 0.7rem;
    background: transparent;
    color: var(--danger); border: 1px solid rgba(255,69,58,0.4); border-radius: 6px;
    font-family: var(--font-ui); font-size: 0.75rem;
    font-weight: 600; cursor: pointer; flex-shrink: 0;
}
.btn-danger-sm:hover[b-hhb6jrtm49] { background: rgba(255,69,58,0.1); border-color: rgba(255,69,58,0.7); }
.btn-danger-sm:disabled[b-hhb6jrtm49] { opacity: 0.45; cursor: not-allowed; }

.sidebar-hint[b-hhb6jrtm49] { font-family: var(--font-body); font-size: 0.8rem; color: var(--text-muted); margin: 0 0 0.6rem; }
.attendee-filters[b-hhb6jrtm49] { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 0.6rem; }

.loading-inline[b-hhb6jrtm49] { padding: 0; }

/* Audience sidebar card */
.audience-card .sidebar-card-header[b-hhb6jrtm49] { margin-bottom: 0.6rem; }
.audience-section[b-hhb6jrtm49] { margin-bottom: 0.6rem; }
.audience-section:last-child[b-hhb6jrtm49] { margin-bottom: 0; }
.audience-section-label[b-hhb6jrtm49] {
    font-family: var(--font-body); font-size: 0.7rem;
    color: var(--text-muted); text-transform: uppercase;
    letter-spacing: 0.06em; margin-bottom: 0.3rem;
}
.audience-tags[b-hhb6jrtm49] { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.audience-tag[b-hhb6jrtm49] {
    display: inline-block;
    background: rgba(90,120,160,0.12);
    border: 1px solid rgba(90,120,160,0.28);
    color: #8ab4d8;
    border-radius: 4px;
    padding: 0.15rem 0.55rem;
    font-family: var(--font-body); font-size: 0.78rem;
}

/* Audience edit fields (in modal) */
.audience-toggle[b-hhb6jrtm49] {
    padding: 0.75rem 1rem;
    background: rgba(90,120,160,0.06);
    border: 1px solid rgba(90,120,160,0.18);
    border-radius: 8px;
}
.audience-fields[b-hhb6jrtm49] {
    display: flex; flex-direction: column; gap: 1rem;
    padding: 1rem;
    background: rgba(90,120,160,0.04);
    border: 1px solid rgba(90,120,160,0.15);
    border-radius: 8px;
}
.audience-checklist[b-hhb6jrtm49] { display: flex; flex-direction: column; gap: 0.25rem; }
.audience-hint[b-hhb6jrtm49] {
    font-family: var(--font-body); font-size: 0.78rem;
    color: var(--text-muted); margin: 0 0 0.25rem;
    font-style: italic;
}

.checkbox-label[b-hhb6jrtm49] {
    display: flex; align-items: center; gap: 0.65rem;
    font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted);
    cursor: pointer; user-select: none;
}
.checkbox-label input[type="checkbox"][b-hhb6jrtm49] { accent-color: var(--accent); width: 15px; height: 15px; cursor: pointer; }
.checkbox-label:hover span[b-hhb6jrtm49] { color: var(--text); }

/* Mobile-first - stack layout, compact hero */
.event-detail-content[b-hhb6jrtm49] { grid-template-columns: 1fr; }
.event-hero[b-hhb6jrtm49] { height: clamp(140px, 22vw, 220px); }
.form-grid[b-hhb6jrtm49] { grid-template-columns: 1fr; }
.event-detail-body[b-hhb6jrtm49] { padding: 1rem 0.75rem 3rem; }
.event-detail-title[b-hhb6jrtm49] { font-size: 1.4rem; }
.event-detail-meta-row[b-hhb6jrtm49] { gap: 1rem; }
.event-detail-sidebar[b-hhb6jrtm49] { position: static; max-height: none; overflow: visible; }
.attendee-filters[b-hhb6jrtm49] { gap: 0.5rem; }
.event-detail-header[b-hhb6jrtm49] { flex-direction: column; align-items: flex-start; gap: 0.75rem; }

@media (min-width: 640px) {
    .form-grid[b-hhb6jrtm49] { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 1024px) {
    .event-detail-content[b-hhb6jrtm49] { grid-template-columns: 1fr 320px; }
    .event-detail-body[b-hhb6jrtm49] { padding: 1.5rem 2rem 4rem; }
    .event-detail-title[b-hhb6jrtm49] { font-size: 1.75rem; }
    .event-detail-meta-row[b-hhb6jrtm49] { gap: 2rem; }
    .event-detail-header[b-hhb6jrtm49] { flex-direction: row; align-items: center; }
    .attendee-filters[b-hhb6jrtm49] { gap: 1rem; }
    .event-detail-sidebar[b-hhb6jrtm49] { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
}
/* /Components/Pages/Community/Events.razor.rz.scp.css */
.events-page[b-6t79rs6caa] {
    max-width: var(--container-narrow, 1100px);
    margin-inline: auto;
    padding-inline: var(--gutter-x, 1rem);
    padding-block: 1rem 5rem;
}

@media (min-width: 640px)  { .events-page[b-6t79rs6caa] { padding-block: 2rem 4rem; } }

.events-header[b-6t79rs6caa] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 1.25rem;
    gap: 0.75rem;
}

@media (min-width: 640px) {
    .events-header[b-6t79rs6caa] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 2rem;
    }
}
.events-title[b-6t79rs6caa] { font-family: var(--font-heading); font-size: 2rem; color: var(--accent); margin: 0 0 0.25rem; }
.events-subtitle[b-6t79rs6caa] { font-family: var(--font-body); color: var(--text-muted); margin: 0; font-size: 0.95rem; }

.btn-gold-outline[b-6t79rs6caa] {
    padding: 0.55rem 1.3rem;
    border: 1px solid var(--accent);
    background: transparent;
    color: var(--accent);
    border-radius: 6px;
    font-family: var(--font-ui);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.btn-gold-outline:hover[b-6t79rs6caa] { background: var(--accent); color: var(--page-bg); }

.alert[b-6t79rs6caa] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; margin-bottom: 1rem; }
.alert-danger[b-6t79rs6caa] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }

.events-loading[b-6t79rs6caa] {
    display: flex; align-items: center; gap: 1rem;
    justify-content: center; padding: 4rem;
    color: var(--text-muted); font-family: var(--font-body);
}

.events-empty[b-6t79rs6caa] { text-align: center; padding: 4rem; color: var(--text-muted); font-family: var(--font-body); }

.events-grid[b-6t79rs6caa] { display: grid; grid-template-columns: 1fr; gap: 1rem; }

@media (min-width: 640px)  { .events-grid[b-6t79rs6caa] { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1.25rem; } }
@media (min-width: 1024px) { .events-grid[b-6t79rs6caa] { grid-template-columns: 1fr; gap: 1rem; } }

.event-card[b-6t79rs6caa] {
    display: flex;
    flex-direction: column;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: border-color 0.15s, transform 0.1s;
}
.event-card:hover[b-6t79rs6caa] { border-color: color-mix(in srgb, var(--accent) 40%, transparent); transform: translateY(-1px); }

.event-card--hidden[b-6t79rs6caa] { opacity: 0.5; filter: grayscale(0.4); }
.event-card--hidden:hover[b-6t79rs6caa] { opacity: 0.7; }

.event-banner[b-6t79rs6caa] {
    height: 80px;
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
}

@media (min-width: 640px)  { .event-banner[b-6t79rs6caa] { height: 110px; } }
@media (min-width: 1024px) { .event-banner[b-6t79rs6caa] { height: 140px; } }

.event-banner--placeholder[b-6t79rs6caa] {
    background: linear-gradient(135deg, var(--container-raised), var(--container-bg));
}

.event-banner[b-6t79rs6caa]::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: var(--pattern-url, none);
    opacity: calc(var(--pattern-opacity, 1) * 0.5);
    pointer-events: none;
}

.event-card-body[b-6t79rs6caa] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
    position: relative;
}

.event-date[b-6t79rs6caa] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 56px;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
    border-radius: 8px;
    padding: 0.5rem 0.4rem;
}

.event-date-day[b-6t79rs6caa] {
    font-family: var(--font-heading);
    font-size: 1.65rem;
    color: var(--accent);
    line-height: 1;
    font-weight: 600;
}

.event-date-month[b-6t79rs6caa] {
    font-family: var(--font-ui);
    font-size: 0.65rem;
    color: var(--text-muted);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-top: 0.25rem;
}

/* Same-month multi-day range: "15–17 JUN" */
.event-date--range[b-6t79rs6caa] { min-width: 64px; }
.event-date-range-days[b-6t79rs6caa] {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    color: var(--accent);
    line-height: 1;
    font-weight: 600;
    white-space: nowrap;
    display: flex;
    align-items: baseline;
}
.event-date-sep[b-6t79rs6caa] {
    font-size: 0.75rem;
    color: var(--text-muted);
    font-weight: 400;
    font-family: var(--font-body);
    margin: 0 1px;
}

/* Cross-month multi-day range: "15 Jun – 17 Jul" stacked */
.event-date--cross-month[b-6t79rs6caa] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 56px;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
    border-radius: 8px;
    padding: 0.45rem 0.5rem;
    gap: 1px;
}
.event-date-cross-start[b-6t79rs6caa],
.event-date-cross-end[b-6t79rs6caa] {
    font-family: var(--font-heading);
    font-size: 0.78rem;
    color: var(--accent);
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.3;
}
.event-date--cross-month .event-date-sep[b-6t79rs6caa] {
    font-size: 0.6rem;
    color: var(--text-muted);
    line-height: 1;
    margin: 0;
}

/* Multi-day time text wraps gracefully */
.event-time--multiday[b-6t79rs6caa] { white-space: normal; line-height: 1.4; }

.event-info[b-6t79rs6caa] { flex: 1; min-width: 0; }
.event-name[b-6t79rs6caa] { font-family: var(--font-heading); font-size: 1.1rem; color: var(--text); margin: 0 0 0.25rem; }
.event-location[b-6t79rs6caa] { font-family: var(--font-body); color: var(--text-muted); font-size: 0.85rem; margin: 0 0 0.4rem; }
.event-meta[b-6t79rs6caa] { display: flex; gap: 1rem; }
.event-time[b-6t79rs6caa], .event-attendees[b-6t79rs6caa] { font-family: var(--font-body); font-size: 0.8rem; color: var(--text-muted); }

.event-badges[b-6t79rs6caa] {
    position: absolute; top: 1rem; right: 1rem;
    display: flex; flex-direction: column; align-items: flex-end; gap: 0.35rem;
}

.event-going-badge[b-6t79rs6caa] {
    background: rgba(52,199,89,0.12);
    border: 1px solid rgba(52,199,89,0.3);
    color: var(--success);
    border-radius: 20px;
    padding: 0.2rem 0.7rem;
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 600;
}

.event-restricted-badge[b-6t79rs6caa] {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent);
    border-radius: 20px;
    padding: 0.2rem 0.7rem;
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 600;
}

/* Event type filter chips */
.event-type-filter[b-6t79rs6caa] {
    display: flex; flex-wrap: wrap; gap: 0.5rem;
    margin-bottom: 1.5rem;
}
.event-type-chip[b-6t79rs6caa] {
    display: flex; align-items: center; gap: 0.4rem;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 20px; padding: 0.3rem 0.85rem;
    font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted);
    cursor: pointer; transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.event-type-chip:hover[b-6t79rs6caa] { border-color: var(--chip-color, var(--accent)); color: var(--chip-color, var(--accent)); }
.event-type-chip--active[b-6t79rs6caa] { border-color: var(--chip-color, var(--accent)); color: var(--chip-color, var(--accent)); background: color-mix(in srgb, var(--chip-color, var(--accent)) 10%, transparent); }
.event-type-chip-dot[b-6t79rs6caa] { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }

/* Event type badge on cards */
.event-type-badge[b-6t79rs6caa] {
    border-radius: 20px; border: 1px solid; padding: 0.2rem 0.7rem;
    font-family: var(--font-body); font-size: 0.75rem; font-weight: 600;
}

/* Release-cycle phase badges */
.event-phase-badge[b-6t79rs6caa] {
    border-radius: 20px; border: 1px solid; padding: 0.2rem 0.7rem;
    font-family: var(--font-body); font-size: 0.75rem; font-weight: 600;
}
.event-phase-badge--hidden[b-6t79rs6caa]  { background: rgba(150,150,150,0.12); border-color: rgba(150,150,150,0.35); color: var(--text-muted); }
.event-phase-badge--soon[b-6t79rs6caa]    { background: rgba(255,190,0,0.12);   border-color: rgba(255,190,0,0.35);   color: #c9920a; }
.event-phase-badge--open[b-6t79rs6caa]    { background: rgba(52,199,89,0.12);   border-color: rgba(52,199,89,0.3);    color: var(--success); }
.event-phase-badge--locked[b-6t79rs6caa]  { background: rgba(255,69,58,0.10);   border-color: rgba(255,69,58,0.3);    color: var(--danger); }

/* Event banner with type color fallback */
.event-banner--type[b-6t79rs6caa] { height: 80px; }

/* Modal */
.modal-close[b-6t79rs6caa] { background: none; border: none; color: var(--text-muted); font-size: 1.4rem; cursor: pointer; }

.form-group[b-6t79rs6caa] { display: flex; flex-direction: column; gap: 0.4rem; }
.form-label[b-6t79rs6caa] { font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted); letter-spacing: 0.04em; }
.form-control[b-6t79rs6caa] {
    background: rgba(255,255,255,0.04); border: 1px solid var(--border);
    color: var(--text); border-radius: 6px; padding: 0.55rem 0.8rem;
    font-family: var(--font-body); font-size: 0.9rem;
    transition: border-color 0.15s; width: 100%; box-sizing: border-box;
}
.form-control:focus[b-6t79rs6caa] { outline: none; border-color: color-mix(in srgb, var(--accent) 50%, transparent); }
.form-grid[b-6t79rs6caa] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

.btn-secondary[b-6t79rs6caa] {
    padding: 0.6rem 1.2rem;
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border);
    color: var(--text-muted);
    border-radius: 6px;
    font-family: var(--font-body);
    cursor: pointer;
}
.btn-gold[b-6t79rs6caa] {
    padding: 0.6rem 1.5rem;
    background: linear-gradient(135deg, var(--accent), var(--accent-mid));
    color: var(--page-bg);
    border: none;
    border-radius: 6px;
    font-family: var(--font-ui);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
}
.btn-gold:disabled[b-6t79rs6caa] { opacity: 0.55; cursor: not-allowed; }

.announcement-toggle[b-6t79rs6caa] {
    padding: 0.75rem 1rem;
    background: color-mix(in srgb, var(--accent) 5%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 15%, transparent);
    border-radius: 8px;
}
.checkbox-label[b-6t79rs6caa] {
    display: flex; align-items: center; gap: 0.65rem;
    font-family: var(--font-body); font-size: 0.88rem; color: var(--text-muted);
    cursor: pointer; user-select: none;
}
.checkbox-label input[type="checkbox"][b-6t79rs6caa] { accent-color: var(--accent); width: 15px; height: 15px; cursor: pointer; }
.checkbox-label span[b-6t79rs6caa] { transition: color 0.15s; }
.checkbox-label:hover span[b-6t79rs6caa] { color: var(--text); }

.announcement-fields[b-6t79rs6caa] {
    display: flex; flex-direction: column; gap: 1rem;
    padding: 1rem;
    background: color-mix(in srgb, var(--accent) 4%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 12%, transparent);
    border-radius: 8px;
}

.audience-toggle[b-6t79rs6caa] {
    padding: 0.75rem 1rem;
    background: rgba(90,120,160,0.06);
    border: 1px solid rgba(90,120,160,0.18);
    border-radius: 8px;
}

.audience-fields[b-6t79rs6caa] {
    display: flex; flex-direction: column; gap: 1rem;
    padding: 1rem;
    background: rgba(90,120,160,0.04);
    border: 1px solid rgba(90,120,160,0.15);
    border-radius: 8px;
}

.audience-hint[b-6t79rs6caa] {
    font-family: var(--font-body); font-size: 0.78rem;
    color: var(--text-muted); margin: 0 0 0.25rem;
    font-style: italic;
}

/* Mobile-first form grid - single column by default */
.form-grid[b-6t79rs6caa] { grid-template-columns: 1fr; }

@media (min-width: 640px) {
    .form-grid[b-6t79rs6caa] { grid-template-columns: 1fr 1fr; }
}
/* /Components/Pages/Community/MyEvents.razor.rz.scp.css */
.my-events-page[b-w2uxn3estj] { max-width: 900px; margin: 0 auto; padding: 2rem 1rem 4rem; }

.my-events-header[b-w2uxn3estj] { margin-bottom: 2rem; }
.my-events-title[b-w2uxn3estj] { font-family: var(--font-heading); font-size: 2rem; color: var(--accent); margin: 0 0 0.25rem; }
.my-events-subtitle[b-w2uxn3estj] { font-family: var(--font-body); color: var(--text-muted); margin: 0; font-size: 0.95rem; }

.alert[b-w2uxn3estj] { padding: 0.75rem 1rem; border-radius: 6px; font-family: var(--font-body); font-size: 0.88rem; margin-bottom: 1rem; }
.alert-danger[b-w2uxn3estj] { background: rgba(255,69,58,0.12); border: 1px solid rgba(255,69,58,0.3); color: var(--danger); }

.my-events-loading[b-w2uxn3estj] {
    display: flex; align-items: center; gap: 1rem;
    justify-content: center; padding: 4rem;
    color: var(--text-muted); font-family: var(--font-body);
}

.my-events-empty[b-w2uxn3estj] {
    text-align: center; padding: 5rem 2rem;
    color: var(--text-muted); font-family: var(--font-body);
    display: flex; flex-direction: column; align-items: center; gap: 1.25rem;
}
.empty-icon[b-w2uxn3estj] { font-size: 3rem; }
.my-events-empty p[b-w2uxn3estj] { margin: 0; font-size: 1rem; }

.btn-gold-outline[b-w2uxn3estj] {
    padding: 0.55rem 1.3rem;
    border: 1px solid var(--accent);
    background: transparent; color: var(--accent);
    border-radius: 6px; font-family: var(--font-ui);
    font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em;
    cursor: pointer; transition: background 0.15s, color 0.15s;
}
.btn-gold-outline:hover[b-w2uxn3estj] { background: var(--accent); color: var(--page-bg); }

.my-events-list[b-w2uxn3estj] { display: flex; flex-direction: column; gap: 0.75rem; }

.my-event-row[b-w2uxn3estj] {
    display: flex; align-items: center; gap: 1.25rem;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1.1rem 1.5rem;
    cursor: pointer;
    transition: border-color 0.15s, transform 0.1s;
}
.my-event-row:hover[b-w2uxn3estj] { border-color: color-mix(in srgb, var(--accent) 40%, transparent); transform: translateX(2px); }

.my-event-date-badge[b-w2uxn3estj] {
    display: flex; flex-direction: column; align-items: center;
    min-width: 48px;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
    border-radius: 8px;
    padding: 0.5rem;
    flex-shrink: 0;
}
.date-day[b-w2uxn3estj] { font-family: var(--font-heading); font-size: 1.5rem; color: var(--accent); line-height: 1; }
.date-month[b-w2uxn3estj] { font-family: var(--font-body); font-size: 0.7rem; color: var(--text-muted); letter-spacing: 0.1em; }

.my-event-info[b-w2uxn3estj] { flex: 1; min-width: 0; }
.my-event-title[b-w2uxn3estj] {
    font-family: var(--font-heading); font-size: 1.05rem;
    color: var(--text); margin: 0 0 0.35rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.my-event-meta[b-w2uxn3estj] {
    display: flex; gap: 1.25rem; flex-wrap: wrap;
    font-family: var(--font-body); font-size: 0.82rem; color: var(--text-muted);
}

.my-event-status[b-w2uxn3estj] { display: flex; flex-direction: column; align-items: flex-end; gap: 0.4rem; flex-shrink: 0; }

.going-badge[b-w2uxn3estj] {
    background: rgba(52,199,89,0.12); border: 1px solid rgba(52,199,89,0.3);
    color: var(--success); border-radius: 20px; padding: 0.2rem 0.7rem;
    font-family: var(--font-body); font-size: 0.75rem; font-weight: 600;
    white-space: nowrap;
}
.past-badge[b-w2uxn3estj] {
    background: rgba(255,255,255,0.06); border: 1px solid var(--border);
    color: var(--text-muted); border-radius: 20px; padding: 0.2rem 0.7rem;
    font-family: var(--font-body); font-size: 0.7rem;
    white-space: nowrap;
}

/* Tabs */
.my-events-tabs[b-w2uxn3estj] {
    display: flex; gap: 0.25rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: 1.5rem;
}
.my-events-tab[b-w2uxn3estj] {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.55rem 1.1rem;
    background: none; border: none; border-bottom: 2px solid transparent;
    color: var(--text-muted); font-family: var(--font-ui); font-size: 0.82rem;
    font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase;
    cursor: pointer; transition: color 0.15s, border-color 0.15s;
    margin-bottom: -1px;
}
.my-events-tab:hover[b-w2uxn3estj] { color: var(--text); }
.my-events-tab--active[b-w2uxn3estj] { color: var(--accent); border-bottom-color: var(--accent); }

.tab-count[b-w2uxn3estj] {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 18px; height: 18px; padding: 0 5px;
    background: color-mix(in srgb, var(--accent) 15%, transparent);
    color: var(--accent); border-radius: 20px;
    font-size: 0.7rem; font-weight: 700;
}
.tab-count--muted[b-w2uxn3estj] {
    background: var(--card-bg); color: var(--text-muted);
}

/* Dismissed row variant */
.my-event-row--dismissed[b-w2uxn3estj] { opacity: 0.65; }
.my-event-row--dismissed:hover[b-w2uxn3estj] { opacity: 1; }
.my-event-date-badge--dismissed[b-w2uxn3estj] {
    background: color-mix(in srgb, var(--text-muted) 8%, transparent);
    border-color: color-mix(in srgb, var(--text-muted) 20%, transparent);
}
.my-event-date-badge--dismissed .date-day[b-w2uxn3estj] { color: var(--text-muted); }

.not-going-badge[b-w2uxn3estj] {
    background: rgba(255,59,48,0.1); border: 1px solid rgba(255,59,48,0.25);
    color: var(--danger, #ff3b30); border-radius: 20px; padding: 0.2rem 0.7rem;
    font-family: var(--font-body); font-size: 0.75rem; font-weight: 600;
    white-space: nowrap;
}

/* Mobile-first - wrap and row status by default */
.my-event-row[b-w2uxn3estj] { flex-wrap: wrap; }
.my-event-status[b-w2uxn3estj] { flex-direction: row; width: 100%; justify-content: flex-start; }

@media (min-width: 640px) {
    .my-event-row[b-w2uxn3estj] { flex-wrap: nowrap; }
    .my-event-status[b-w2uxn3estj] { flex-direction: column; width: auto; justify-content: flex-end; align-items: flex-end; }
}
/* /Components/Pages/Forum/Forum.razor.rz.scp.css */
/* Forum category list */
.forum-cat[b-xpk8v1l1i0] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 0.85rem;
    cursor: pointer;
    transition: border-color 0.15s, transform 0.1s;
    overflow: hidden;
}
.forum-cat:hover[b-xpk8v1l1i0] { border-color: color-mix(in srgb, var(--accent) 40%, transparent); transform: translateY(-1px); }

.forum-cat__body[b-xpk8v1l1i0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
}

.forum-cat__main[b-xpk8v1l1i0] { flex: 1; cursor: pointer; }

.forum-cat__name[b-xpk8v1l1i0] {
    font-family: var(--font-heading);
    font-size: 1.05rem;
    color: var(--text-bright);
    letter-spacing: 0.02em;
    margin: 0 0 0.3rem;
}

.forum-cat__desc[b-xpk8v1l1i0] {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text-muted);
    margin: 0 0 0.6rem;
    line-height: 1.5;
}

.forum-cat__stats[b-xpk8v1l1i0] {
    display: flex;
    gap: 1rem;
    align-items: center;
    font-family: var(--font-body);
    font-size: 0.82rem;
    color: var(--text-muted);
    flex-wrap: wrap;
}

.forum-cat__actions[b-xpk8v1l1i0] {
    display: flex;
    gap: 0.4rem;
    flex-shrink: 0;
    align-items: flex-start;
}

/* Restricted pill badge */
.restricted-pill[b-xpk8v1l1i0] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent);
    border-radius: 4px;
    padding: 0.15rem 0.5rem;
    font-family: var(--font-ui);
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* Small button variants */
.btn-sm[b-xpk8v1l1i0] {
    font-size: 0.78rem !important;
    padding: 0.3rem 0.75rem !important;
}

.btn-danger-sm[b-xpk8v1l1i0] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-xpk8v1l1i0] { background: rgba(255, 69, 58, 0.2); }

/* Modal form spacing */
.form-group[b-xpk8v1l1i0] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.75rem; }
.form-group:last-of-type[b-xpk8v1l1i0] { margin-bottom: 0; }

/* Audience tree help text */
.audience-fields .audience-group[b-xpk8v1l1i0] { margin-top: 0.75rem; }
.audience-fields .audience-group:first-child[b-xpk8v1l1i0] { margin-top: 0; }

/* Empty state */
.forum-empty[b-xpk8v1l1i0] {
    font-family: var(--font-body);
    color: var(--text-muted);
    text-align: center;
    padding: 3rem 1rem;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
}
/* /Components/Pages/Forum/ForumCategory.razor.rz.scp.css */
/* Breadcrumb */
.fc-breadcrumb[b-c47tenfjv9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-bottom: 1.25rem;
}
.fc-breadcrumb__back[b-c47tenfjv9] {
    color: var(--accent);
    text-decoration: none;
}
.fc-breadcrumb__back:hover[b-c47tenfjv9] { text-decoration: underline; }
.fc-breadcrumb__sep[b-c47tenfjv9] { color: var(--border); }
.fc-breadcrumb__current[b-c47tenfjv9] { color: var(--text-muted); }

/* Page header */
.fc-header[b-c47tenfjv9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.75rem;
    flex-wrap: wrap;
}
.fc-title[b-c47tenfjv9] {
    font-family: var(--font-heading);
    font-size: 1.75rem;
    color: var(--text-bright);
    margin: 0 0 0.3rem;
}
.fc-desc[b-c47tenfjv9] {
    font-family: var(--font-body);
    color: var(--text-muted);
    font-size: 0.9rem;
    margin: 0;
}

/* Empty state */
.fc-empty[b-c47tenfjv9] {
    font-family: var(--font-body);
    color: var(--text-muted);
    text-align: center;
    padding: 3rem 1rem;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
}

/* Thread table */
.thread-table-wrapper[b-c47tenfjv9] { overflow-x: auto; }
.thread-table[b-c47tenfjv9] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    font-family: var(--font-body);
    font-size: 0.9rem;
}
.thread-table thead th[b-c47tenfjv9] {
    background: color-mix(in srgb, var(--accent) 5%, var(--card-bg));
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border);
}
.thread-table td[b-c47tenfjv9] {
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--border-subtle, rgba(255,255,255,0.04));
    vertical-align: middle;
}
.thread-table tbody tr:last-child td[b-c47tenfjv9] { border-bottom: none; }
.thread-row[b-c47tenfjv9] { cursor: pointer; transition: background 0.1s; }
.thread-row:hover td[b-c47tenfjv9] { background: color-mix(in srgb, var(--accent) 3%, transparent); }
.thread-cell-title[b-c47tenfjv9] { color: var(--text-bright); }
.thread-cell-muted[b-c47tenfjv9] { color: var(--text-muted); font-size: 0.85rem; }

/* Thread status badges */
.thread-badge[b-c47tenfjv9] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.45rem;
    border-radius: 4px;
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-right: 0.35rem;
}
.thread-badge--pinned[b-c47tenfjv9] {
    background: rgba(52, 199, 89, 0.12);
    border: 1px solid rgba(52, 199, 89, 0.3);
    color: var(--success, #34c759);
}
.thread-badge--locked[b-c47tenfjv9] {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border);
    color: var(--text-muted);
}

/* Restricted pill (shared with Forum.razor.css, re-declared for scoping) */
.restricted-pill[b-c47tenfjv9] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent);
    border-radius: 4px;
    padding: 0.1rem 0.45rem;
    font-family: var(--font-ui);
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-right: 0.35rem;
}

/* Action cell buttons */
.thread-actions[b-c47tenfjv9] { display: flex; gap: 0.4rem; }
.btn-sm[b-c47tenfjv9] { font-size: 0.78rem !important; padding: 0.3rem 0.75rem !important; }
.btn-danger-sm[b-c47tenfjv9] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-c47tenfjv9] { background: rgba(255, 69, 58, 0.2); }

/* Modal form helpers */
.form-group[b-c47tenfjv9] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.75rem; }
.form-group:last-of-type[b-c47tenfjv9] { margin-bottom: 0; }
.form-row-inline[b-c47tenfjv9] { display: flex; gap: 1.5rem; align-items: center; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-hint[b-c47tenfjv9] { font-family: var(--font-body); font-size: 0.8rem; color: var(--text-muted); margin: 0.25rem 0 0.5rem; }
/* /Components/Pages/Forum/ForumThread.razor.rz.scp.css */
/* Breadcrumb */
.ft-breadcrumb[b-kbjzrmdmg4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-bottom: 1.25rem;
}
.ft-breadcrumb__back[b-kbjzrmdmg4] {
    color: var(--accent);
    text-decoration: none;
}
.ft-breadcrumb__back:hover[b-kbjzrmdmg4] { text-decoration: underline; }
.ft-breadcrumb__sep[b-kbjzrmdmg4] { color: var(--border); }
.ft-breadcrumb__current[b-kbjzrmdmg4] { color: var(--text-muted); }

/* Thread header */
.ft-header[b-kbjzrmdmg4] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1.75rem;
    flex-wrap: wrap;
}
.ft-title[b-kbjzrmdmg4] {
    font-family: var(--font-heading);
    font-size: 1.75rem;
    color: var(--text-bright);
    margin: 0;
    flex: 1;
}
.ft-header-badges[b-kbjzrmdmg4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding-top: 0.35rem;
}
.ft-lock-btn[b-kbjzrmdmg4] { margin-left: auto; }

/* Thread status badges */
.thread-badge[b-kbjzrmdmg4] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.thread-badge--pinned[b-kbjzrmdmg4] {
    background: rgba(52, 199, 89, 0.12);
    border: 1px solid rgba(52, 199, 89, 0.3);
    color: var(--success, #34c759);
}
.thread-badge--locked[b-kbjzrmdmg4] {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border);
    color: var(--text-muted);
}

/* Post card */
.post-card[b-kbjzrmdmg4] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 1rem;
    overflow: hidden;
}
.post-card__header[b-kbjzrmdmg4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.7rem 1.1rem;
    border-bottom: 1px solid var(--border-subtle, rgba(255,255,255,0.04));
    background: color-mix(in srgb, var(--accent) 3%, var(--card-bg));
}
.post-author[b-kbjzrmdmg4] {
    font-family: var(--font-ui);
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text-bright);
}
.post-time[b-kbjzrmdmg4] {
    font-family: var(--font-body);
    font-size: 0.78rem;
    color: var(--text-muted);
}
.post-content[b-kbjzrmdmg4] {
    font-family: var(--font-body);
    font-size: 0.92rem;
    color: var(--text);
    padding: 1rem 1.1rem;
    white-space: pre-wrap;
    line-height: 1.65;
}
.post-actions[b-kbjzrmdmg4] {
    display: flex;
    gap: 0.4rem;
    padding: 0 1.1rem 0.8rem;
}
.post-edit-actions[b-kbjzrmdmg4] {
    display: flex;
    gap: 0.5rem;
    padding: 0 1.1rem 0.8rem;
}

/* Small button variants */
.btn-sm[b-kbjzrmdmg4] { font-size: 0.78rem !important; padding: 0.3rem 0.75rem !important; }
.btn-danger-sm[b-kbjzrmdmg4] {
    padding: 0.3rem 0.75rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-danger-sm:hover[b-kbjzrmdmg4] { background: rgba(255, 69, 58, 0.2); }

/* Reply card */
.reply-card[b-kbjzrmdmg4] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    border-radius: 10px;
    margin-top: 1.5rem;
    overflow: hidden;
}
.reply-card__header[b-kbjzrmdmg4] {
    font-family: var(--font-heading);
    font-size: 0.95rem;
    color: var(--accent);
    padding: 0.75rem 1.1rem;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--accent) 4%, var(--card-bg));
    letter-spacing: 0.02em;
}
.reply-card__body[b-kbjzrmdmg4] {
    padding: 1rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Alerts */
.ft-alert[b-kbjzrmdmg4] {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text-muted);
    background: color-mix(in srgb, var(--accent) 4%, var(--card-bg));
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0.85rem 1.1rem;
    margin-top: 1rem;
}
.ft-alert--muted[b-kbjzrmdmg4] {
    background: rgba(255, 255, 255, 0.03);
    border-color: var(--border);
    color: var(--text-muted);
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Welcome / Getting-started banners ──────────────────────────────────── */
.welcome-banners[b-7rzd9s8bqq] {
    border-bottom: 1px solid var(--border);
    overflow: hidden;
}

.welcome-banners__header[b-7rzd9s8bqq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 1.5rem 0.3rem;
}

.welcome-banners__hdr-icon[b-7rzd9s8bqq] {
    width: 13px;
    height: 13px;
    color: var(--accent-dim);
    flex-shrink: 0;
}

.welcome-banners__hdr-label[b-7rzd9s8bqq] {
    font-family: var(--font-heading);
    font-size: 0.6rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--text-dim);
}

/* Individual welcome banner row */
.wb[b-7rzd9s8bqq] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.6rem 1.25rem 0.6rem 0;
    position: relative;
    cursor: pointer;
    animation: wb-in-b-7rzd9s8bqq 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: var(--wb-delay, 0s);
    transition: background 0.15s;
}

.wb:not(:last-child)[b-7rzd9s8bqq] {
    border-bottom: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
}

.wb:hover[b-7rzd9s8bqq] {
    background: color-mix(in srgb, var(--accent) 4%, transparent);
}

@keyframes wb-in-b-7rzd9s8bqq {
    from { transform: translateX(-10px); opacity: 0; }
    to   { transform: translateX(0);     opacity: 1; }
}

/* Left accent bar */
.wb__bar[b-7rzd9s8bqq] {
    width: 3px;
    min-height: 38px;
    align-self: stretch;
    background: linear-gradient(
        to bottom,
        var(--accent),
        color-mix(in srgb, var(--accent) 30%, transparent)
    );
    border-radius: 0 2px 2px 0;
    flex-shrink: 0;
}

/* Icon badge */
.wb__icon[b-7rzd9s8bqq] {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--accent) 9%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent);
    border-radius: 7px;
    color: var(--accent);
    flex-shrink: 0;
}

.wb__icon svg[b-7rzd9s8bqq] {
    width: 16px;
    height: 16px;
}

/* Text block */
.wb__body[b-7rzd9s8bqq] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.wb__title[b-7rzd9s8bqq] {
    font-family: var(--font-heading);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-bright);
}

.wb__desc[b-7rzd9s8bqq] {
    font-family: var(--font-body);
    font-size: 0.87rem;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* CTA link */
.wb__cta[b-7rzd9s8bqq] {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.85rem;
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent);
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: 0.73rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    border-radius: 5px;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.wb__cta:hover[b-7rzd9s8bqq] {
    background: color-mix(in srgb, var(--accent) 18%, transparent);
    border-color: color-mix(in srgb, var(--accent) 48%, transparent);
    color: var(--accent-bright);
}

/* Dismiss button */
.wb__dismiss[b-7rzd9s8bqq] {
    background: none;
    border: none;
    color: var(--text-dim);
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0 0.25rem;
    line-height: 1;
    flex-shrink: 0;
    transition: color 0.15s;
}

.wb__dismiss:hover[b-7rzd9s8bqq] { color: var(--text-muted); }

@media (max-width: 640px) {
    .wb[b-7rzd9s8bqq] { flex-wrap: wrap; row-gap: 0.4rem; padding: 0.65rem 1rem 0.65rem 0; }
    .wb__desc[b-7rzd9s8bqq] { display: none; }
    .wb__cta[b-7rzd9s8bqq]  { padding: 0.28rem 0.7rem; }
}

/* ─────────────────────────────────────────────────────────────────────────── */

/* Announcement banner */
.ann-banner[b-7rzd9s8bqq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
    padding: 0.65rem 1.5rem;
    font-family: var(--font-body);
    animation: slide-down-b-7rzd9s8bqq 0.3s ease;
    cursor: pointer;
}
.ann-banner:hover[b-7rzd9s8bqq] { background: color-mix(in srgb, var(--accent) 12%, transparent); }

@keyframes slide-down-b-7rzd9s8bqq {
    from { transform: translateY(-100%); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.ann-banner__inner[b-7rzd9s8bqq] {
    display: flex; align-items: center; gap: 0.75rem;
    min-width: 0; flex: 1;
    flex-wrap: wrap;
}

.ann-banner__label[b-7rzd9s8bqq] {
    font-family: var(--font-heading);
    font-size: 0.68rem; font-weight: 600;
    letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    border-radius: 3px;
    padding: 0.1rem 0.5rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.ann-banner__title[b-7rzd9s8bqq] {
    font-family: var(--font-body);
    font-size: 0.95rem; color: var(--text);
    cursor: pointer;
    transition: color 0.15s;
    min-width: 0;
}
.ann-banner:hover .ann-banner__title[b-7rzd9s8bqq] { color: var(--accent); }

.ann-banner__date[b-7rzd9s8bqq] {
    font-size: 0.78rem; color: var(--text-muted);
    white-space: nowrap; flex-shrink: 0;
}

.ann-banner__close[b-7rzd9s8bqq] {
    background: none; border: none;
    color: var(--text-muted); font-size: 1.3rem;
    cursor: pointer; padding: 0 0.25rem;
    line-height: 1; flex-shrink: 0;
    transition: color 0.15s;
}
.ann-banner__close:hover[b-7rzd9s8bqq] { color: var(--text); }

/* Upcoming event prompt */
.evt-prompt[b-7rzd9s8bqq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border-bottom: 1px solid var(--accent);
    border-top: 1px solid var(--accent);
    padding: 0.75rem 1.5rem;
    font-family: var(--font-body);
    animation: slide-down-b-7rzd9s8bqq 0.3s ease;
}

.evt-prompt__inner[b-7rzd9s8bqq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    flex: 1;
    flex-wrap: wrap;
}

.evt-prompt__icon[b-7rzd9s8bqq] {
    width: 20px;
    height: 20px;
    color: var(--accent);
    flex-shrink: 0;
}

.evt-prompt__text[b-7rzd9s8bqq] {
    font-size: 0.9rem;
    color: var(--text);
    flex: 1;
    min-width: 0;
}

.evt-prompt__btn[b-7rzd9s8bqq] {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 1rem;
    background: var(--accent);
    color: var(--page-bg);
    font-family: var(--font-ui);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-radius: 6px;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity 0.15s;
}

.evt-prompt__btn:hover[b-7rzd9s8bqq] { opacity: 0.85; }

.evt-prompt__dismiss[b-7rzd9s8bqq] {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.3rem;
    cursor: pointer;
    padding: 0 0.25rem;
    line-height: 1;
    flex-shrink: 0;
    transition: color 0.15s;
}

.evt-prompt__dismiss:hover[b-7rzd9s8bqq] { color: var(--text); }

.home-hero[b-7rzd9s8bqq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 4rem 2rem 3rem;
    position: relative;
}

.home-hero__emblem[b-7rzd9s8bqq] {
    width: 96px;
    height: 96px;
    margin-bottom: 2rem;
    animation: emblem-spin-b-7rzd9s8bqq 30s linear infinite;
    opacity: 0.9;
}

.home-hero__emblem--logo[b-7rzd9s8bqq] {
    width: auto;
    height: auto;
    max-width: min(420px, 85vw);
    max-height: 220px;
    animation: none;
    opacity: 1;
    margin-bottom: 1.5rem;
}

.home-hero__logo-img[b-7rzd9s8bqq] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

@keyframes emblem-spin-b-7rzd9s8bqq {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

.home-hero__title[b-7rzd9s8bqq] {
    font-family: var(--font-brand);
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 700;
    color: var(--text);
    letter-spacing: 0.04em;
    margin-bottom: 0.75rem;
}

.home-hero__title[b-7rzd9s8bqq]::first-letter {
    color: var(--accent-initial);
}

.home-hero__sub[b-7rzd9s8bqq] {
    font-family: var(--font-body);
    font-size: 1.2rem;
    color: var(--text-muted);
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 2.5rem;
}

.home-hero__actions[b-7rzd9s8bqq] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

.home-grid[b-7rzd9s8bqq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.5rem;
    padding: 0 0 3rem;
    max-width: 960px;
    margin: 0 auto;
    width: 100%;
}

.home-feature-card[b-7rzd9s8bqq] {
    display: block;
    background: var(--card-bg);;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 2rem 1.75rem;
    text-decoration: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
    cursor: pointer;
}

.home-feature-card:hover[b-7rzd9s8bqq] {
    border-color: var(--accent-border-glow);
    box-shadow: var(--shadow-card-hover, 0 4px 24px rgba(0,0,0,0.5), 0 0 20px rgba(201,168,76,0.08));
    transform: translateY(-2px);
}

.home-feature-card__icon[b-7rzd9s8bqq] {
    width: 40px;
    height: 40px;
    color: var(--accent);
    margin-bottom: 1.25rem;
    opacity: 0.85;
    transition: opacity 0.15s;
}
.home-feature-card:hover .home-feature-card__icon[b-7rzd9s8bqq] { opacity: 1; }

.home-feature-card__icon svg[b-7rzd9s8bqq] {
    width: 100%;
    height: 100%;
}

.home-feature-card h3[b-7rzd9s8bqq] {
    font-family: var(--font-heading);
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text);
    margin-bottom: 0.75rem;
}

.home-feature-card p[b-7rzd9s8bqq] {
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--text-muted);
    line-height: 1.6;
    margin: 0;
}
/* /Components/Pages/Wiki/Wiki.razor.rz.scp.css */
/* Wiki sidebar + page list layout - mobile-first */
.wiki-layout[b-lmo53u46ew] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: start;
    padding-bottom: 3rem;
}

@media (min-width: 640px) {
    .wiki-layout[b-lmo53u46ew] { gap: 2rem; padding-bottom: 4rem; }
}

@media (min-width: 1024px) {
    .wiki-layout[b-lmo53u46ew] { grid-template-columns: 220px 1fr; }
}

/* Category sidebar */
.wiki-cats[b-lmo53u46ew] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    position: sticky;
    top: 1rem;
}

.wiki-cats-label[b-lmo53u46ew] {
    font-family: var(--font-ui);
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-dim);
    padding: 0 0.75rem 0.5rem;
    display: block;
}

.wiki-cat[b-lmo53u46ew] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.45rem 0.75rem;
    font-family: var(--font-ui);
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    color: var(--text-muted);
    background: none;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.wiki-cat:hover[b-lmo53u46ew] { background: color-mix(in srgb, var(--accent) 6%, transparent); color: var(--text); }
.wiki-cat.active[b-lmo53u46ew] {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    color: var(--accent);
    border-left: 2px solid var(--accent);
    padding-left: calc(0.75rem - 2px);
}

/* Page list */
.wiki-page-list[b-lmo53u46ew] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.wiki-page-row[b-lmo53u46ew] {
    padding: 1rem 1.25rem;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.15s, transform 0.1s;
}
.wiki-page-row:hover[b-lmo53u46ew] {
    border-color: color-mix(in srgb, var(--accent) 40%, transparent);
    transform: translateY(-1px);
}

.wiki-page-row__header[b-lmo53u46ew] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

.wiki-page-title[b-lmo53u46ew] {
    font-family: var(--font-heading);
    font-size: 1rem;
    color: var(--text-bright);
    letter-spacing: 0.02em;
    margin: 0;
}

.wiki-page-meta[b-lmo53u46ew] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    font-family: var(--font-body);
    font-size: 0.78rem;
    color: var(--text-dim);
}

.wiki-cat-badge[b-lmo53u46ew] {
    display: inline-block;
    padding: 0.12rem 0.45rem;
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    color: var(--accent);
    border-radius: 4px;
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.wiki-meta-author[b-lmo53u46ew] { color: var(--text-muted); }
.wiki-meta-time[b-lmo53u46ew]   { color: var(--text-dim); }
.wiki-meta-revisions[b-lmo53u46ew] { color: var(--text-dim); }

.wiki-empty[b-lmo53u46ew] {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--text-muted);
    font-family: var(--font-body);
}

/* Shared small button */
.btn-danger-sm[b-lmo53u46ew] {
    padding: 0.28rem 0.7rem;
    background: rgba(255, 69, 58, 0.1);
    border: 1px solid rgba(255, 69, 58, 0.3);
    color: var(--danger);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background 0.15s;
    white-space: nowrap;
    flex-shrink: 0;
}
.btn-danger-sm:hover[b-lmo53u46ew] { background: rgba(255, 69, 58, 0.2); }
/* /Components/Pages/Wiki/WikiPage.razor.rz.scp.css */
/* Breadcrumb */
.wp-breadcrumb[b-u11phzr0ma] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-bottom: 1.25rem;
}
.wp-breadcrumb__back[b-u11phzr0ma] { color: var(--accent); text-decoration: none; }
.wp-breadcrumb__back:hover[b-u11phzr0ma] { text-decoration: underline; }
.wp-breadcrumb__sep[b-u11phzr0ma] { color: var(--border); }
.wp-breadcrumb__current[b-u11phzr0ma] { color: var(--text-muted); }

/* Edit card */
.wp-edit-card[b-u11phzr0ma] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
}
.wp-edit-card__header[b-u11phzr0ma] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.8rem 1.25rem;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--accent) 4%, var(--card-bg));
    font-family: var(--font-heading);
    font-size: 1rem;
    color: var(--accent);
    letter-spacing: 0.02em;
}
.wp-edit-card__body[b-u11phzr0ma] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Form helpers */
.form-group[b-u11phzr0ma] { display: flex; flex-direction: column; gap: 0.4rem; }
.wp-cat-checks[b-u11phzr0ma] { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; padding: 0.25rem 0; }
.wp-form-actions[b-u11phzr0ma] { display: flex; gap: 0.5rem; padding-top: 0.25rem; }
.btn-sm[b-u11phzr0ma] { font-size: 0.78rem !important; padding: 0.3rem 0.75rem !important; }

/* View mode header */
.wp-view-header[b-u11phzr0ma] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}
.wp-view-header__main[b-u11phzr0ma] { flex: 1; }
.wp-title[b-u11phzr0ma] {
    font-family: var(--font-heading);
    font-size: 1.75rem;
    color: var(--text-bright);
    margin: 0 0 0.4rem;
}
.wp-meta[b-u11phzr0ma] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    font-family: var(--font-body);
    font-size: 0.82rem;
    color: var(--text-muted);
    align-items: center;
}
.wp-meta__sep[b-u11phzr0ma] { color: var(--border); }
.wp-view-header__actions[b-u11phzr0ma] { display: flex; gap: 0.5rem; flex-shrink: 0; padding-top: 0.3rem; }

/* Content card */
.wp-content-card[b-u11phzr0ma] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}
.wp-content-pre[b-u11phzr0ma] {
    white-space: pre-wrap;
    font-family: var(--font-body);
    font-size: 0.93rem;
    color: var(--text);
    line-height: 1.7;
    margin: 0;
}

/* Revisions panel */
.wp-revisions[b-u11phzr0ma] {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    margin-top: 0.75rem;
}
.wp-revisions__header[b-u11phzr0ma] {
    font-family: var(--font-heading);
    font-size: 0.9rem;
    color: var(--accent);
    padding: 0.7rem 1rem;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--accent) 4%, var(--card-bg));
    letter-spacing: 0.03em;
}
.wp-revisions__empty[b-u11phzr0ma] {
    padding: 1rem;
    font-family: var(--font-body);
    font-size: 0.88rem;
    color: var(--text-muted);
}
.wp-rev-table[b-u11phzr0ma] {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--font-body);
    font-size: 0.85rem;
}
.wp-rev-table th[b-u11phzr0ma] {
    text-align: left;
    padding: 0.55rem 1rem;
    border-bottom: 1px solid var(--border);
    color: var(--text-muted);
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-family: var(--font-ui);
}
.wp-rev-table td[b-u11phzr0ma] {
    padding: 0.5rem 1rem;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    color: var(--text);
}
.wp-rev-table tbody tr:last-child td[b-u11phzr0ma] { border-bottom: none; }
/* /Components/Shared/AlertBanner.razor.rz.scp.css */
.alert[b-0nlljewfss] {
    cursor: pointer;
    transition: opacity 0.1s;
}

.alert:hover[b-0nlljewfss] {
    opacity: 0.85;
}
/* /Components/Shared/AudienceSelector.razor.rz.scp.css */
/* ── Audience Selector ─────────────────────────────────────── */

.as-container[b-sefbdkn394] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

/* Section card */
.as-section[b-sefbdkn394] {
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    background: color-mix(in srgb, var(--accent) 3%, transparent);
    transition: border-color 0.2s;
}

.as-section:focus-within[b-sefbdkn394] {
    border-color: color-mix(in srgb, var(--accent) 30%, transparent);
}

/* Section header row */
.as-header[b-sefbdkn394] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.75rem;
    background: color-mix(in srgb, var(--accent) 6%, transparent);
    border-bottom: 1px solid var(--border);
}

.as-icon[b-sefbdkn394] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--accent);
    opacity: 0.8;
}

.as-header-label[b-sefbdkn394] {
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--accent);
    flex: 1;
}

.as-badge[b-sefbdkn394] {
    font-family: var(--font-ui);
    font-size: 0.68rem;
    font-weight: 600;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

.as-badge--active[b-sefbdkn394] {
    background: color-mix(in srgb, var(--accent) 20%, transparent);
    color: var(--accent);
    border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent);
}

.as-badge--open[b-sefbdkn394] {
    background: color-mix(in srgb, var(--success, #4caf50) 12%, transparent);
    color: color-mix(in srgb, var(--success, #4caf50) 80%, var(--text));
    border: 1px solid color-mix(in srgb, var(--success, #4caf50) 25%, transparent);
}

/* Pill cloud area */
.as-pills-area[b-sefbdkn394] {
    padding: 0.6rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

/* Group header row (chevron + pill) */
.as-group-header[b-sefbdkn394] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.as-chevron[b-sefbdkn394] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--text-muted);
    border-radius: 3px;
    transition: color 0.15s, background 0.15s;
}

.as-chevron:hover[b-sefbdkn394] {
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 10%, transparent);
}

.as-chevron svg[b-sefbdkn394] {
    width: 12px;
    height: 12px;
    transition: transform 0.18s ease;
}

.as-chevron--open svg[b-sefbdkn394] {
    transform: rotate(90deg);
}

.as-chevron-spacer[b-sefbdkn394] {
    display: inline-block;
    width: 20px;
    flex-shrink: 0;
}

/* Hierarchical grouped cards */
.as-country-group[b-sefbdkn394] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.5rem;
    border-radius: 6px;
    border: 1px solid var(--border);
    background: transparent;
    transition: border-color 0.2s, background 0.2s;
}

.as-country-group--active[b-sefbdkn394] {
    border-color: color-mix(in srgb, var(--accent) 28%, transparent);
    background: color-mix(in srgb, var(--accent) 4%, transparent);
}

.as-region-cluster[b-sefbdkn394] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding-left: 0.6rem;
    margin-left: 0.2rem;
    border-left: 2px solid color-mix(in srgb, var(--accent) 22%, var(--border));
}

.as-region-block[b-sefbdkn394] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.as-group-cluster[b-sefbdkn394] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding-left: 0.5rem;
    margin-left: 0.15rem;
    border-left: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

/* Flat (non-hierarchical) groups */
.as-flat-group[b-sefbdkn394] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.2rem 0;
}

.as-flat-label[b-sefbdkn394] {
    font-family: var(--font-ui);
    font-size: 0.67rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    opacity: 0.7;
}

.as-flat-pills[b-sefbdkn394] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

/* Pills */
.as-pill[b-sefbdkn394] {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.7rem;
    border-radius: 999px;
    font-family: var(--font-body);
    font-size: 0.82rem;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.08s;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text-muted);
    line-height: 1.4;
    user-select: none;
}

.as-pill:hover[b-sefbdkn394] {
    border-color: color-mix(in srgb, var(--accent) 45%, transparent);
    color: var(--text);
    background: color-mix(in srgb, var(--accent) 7%, transparent);
}

.as-pill:active[b-sefbdkn394] {
    transform: scale(0.96);
}

/* Selected */
.as-pill--on[b-sefbdkn394] {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--background, #07090f);
    font-weight: 600;
}

.as-pill--on:hover[b-sefbdkn394] {
    background: var(--accent-bright, var(--accent));
    border-color: var(--accent-bright, var(--accent));
    color: var(--background, #07090f);
}

/* Partially selected (some children selected) */
.as-pill--partial[b-sefbdkn394] {
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border-color: color-mix(in srgb, var(--accent) 55%, transparent);
    color: var(--accent);
}

.as-pill--partial:hover[b-sefbdkn394] {
    background: color-mix(in srgb, var(--accent) 20%, transparent);
    border-color: var(--accent);
}

/* Country/category parent pill - slightly more prominent */
.as-pill--country[b-sefbdkn394] {
    font-weight: 600;
    letter-spacing: 0.01em;
}

/* Tag-input area */
.as-tag-area[b-sefbdkn394] {
    padding: 0.6rem 0.75rem 0.65rem;
}

.as-hint[b-sefbdkn394] {
    font-family: var(--font-body);
    font-size: 0.78rem;
    color: var(--text-muted);
    margin: 0 0 0.4rem;
    opacity: 0.75;
}
/* /Components/Shared/MarkdownEditor.razor.rz.scp.css */
.markdown-editor[b-vli9qtii2h] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.md-toolbar[b-vli9qtii2h] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.35rem 0.5rem;
    background: var(--container-raised, #1e1e1e);
    border: 1px solid var(--border);
    border-bottom: none;
    border-radius: 6px 6px 0 0;
    flex-wrap: wrap;
}

.md-toolbar__btn[b-vli9qtii2h] {
    padding: 0.2rem 0.55rem;
    font-size: 0.78rem;
    line-height: 1.4;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text-muted);
    border-radius: 4px;
    cursor: pointer;
    transition: border-color 0.12s, color 0.12s, background 0.12s;
    font-family: var(--font-body);
}

.md-toolbar__btn:hover[b-vli9qtii2h] {
    border-color: var(--accent-border-glow);
    color: var(--accent);
    background: var(--accent-muted, rgba(255,255,255,0.05));
}

.md-toolbar__btn.active[b-vli9qtii2h] {
    border-color: var(--accent);
    color: var(--accent);
    background: var(--accent-muted, rgba(255,255,255,0.08));
}

.md-toolbar__btn--preview[b-vli9qtii2h] {
    margin-left: auto;
    font-size: 0.75rem;
    padding: 0.2rem 0.7rem;
}

.md-textarea[b-vli9qtii2h] {
    border-radius: 0 0 6px 6px !important;
    border-top: 1px solid var(--border) !important;
    resize: vertical;
}

.markdown-preview[b-vli9qtii2h] {
    padding: 0.65rem 0.85rem;
    border: 1px solid var(--border);
    border-radius: 0 0 6px 6px;
    background: var(--container-bg, var(--page-bg));
    overflow-y: auto;
}

/* Permission denied banner */
.md-permission-denied[b-vli9qtii2h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.75rem;
    border-left: 1px solid var(--border);
    border-right: 1px solid var(--border);
    border-bottom: none;
    border-top: 1px solid color-mix(in srgb, #c0392b 30%, transparent);
    background: color-mix(in srgb, #c0392b 8%, transparent);
    font-size: 0.82rem;
    color: color-mix(in srgb, #e05252 90%, var(--text));
}

.md-permission-denied__icon[b-vli9qtii2h] { flex-shrink: 0; }

.md-permission-denied__text[b-vli9qtii2h] { flex: 1; }

.md-permission-denied__dismiss[b-vli9qtii2h] {
    background: none;
    border: none;
    color: inherit;
    opacity: 0.55;
    cursor: pointer;
    font-size: 0.7rem;
    padding: 0;
    flex-shrink: 0;
    line-height: 1;
}

.md-permission-denied__dismiss:hover[b-vli9qtii2h] { opacity: 1; }

/* Upload chips */
.md-upload-chips[b-vli9qtii2h] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0.4rem 0.5rem;
    border-left: 1px solid var(--border);
    border-right: 1px solid var(--border);
    border-bottom: none;
    border-top: 1px solid var(--border);
    background: var(--container-raised, #1e1e1e);
}

.md-chip[b-vli9qtii2h] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.18rem 0.45rem;
    border-radius: 4px;
    font-size: 0.78rem;
    border: 1px solid var(--border);
    background: var(--container-bg, #141414);
    max-width: 300px;
}

.md-chip--uploading[b-vli9qtii2h] { opacity: 0.6; }

.md-chip--done[b-vli9qtii2h] { border-color: color-mix(in srgb, var(--accent) 35%, transparent); }

.md-chip--error[b-vli9qtii2h] {
    border-color: color-mix(in srgb, #c0392b 40%, transparent);
    color: #e05252;
}

.md-chip__thumb[b-vli9qtii2h] {
    width: 1.4rem;
    height: 1.4rem;
    object-fit: cover;
    border-radius: 2px;
    flex-shrink: 0;
}

.md-chip__name[b-vli9qtii2h] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 160px;
}

.md-chip__error[b-vli9qtii2h] {
    font-size: 0.72rem;
    opacity: 0.85;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 180px;
}

.md-chip__dismiss[b-vli9qtii2h] {
    background: none;
    border: none;
    color: inherit;
    opacity: 0.45;
    cursor: pointer;
    font-size: 0.65rem;
    padding: 0;
    flex-shrink: 0;
    line-height: 1;
}

.md-chip__dismiss:hover[b-vli9qtii2h] { opacity: 1; }
/* /Components/Shared/TagInput.razor.rz.scp.css */
.tag-input[b-zsuhozvqbj] {
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 0.35rem 0.5rem;
    transition: border-color 0.15s;
    cursor: text;
}

.tag-input:focus-within[b-zsuhozvqbj] {
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
}

.tag-input__chips[b-zsuhozvqbj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
    min-height: 1.8rem;
}

.tag-chip[b-zsuhozvqbj] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
    color: var(--accent);
    border-radius: 4px;
    padding: 0.15rem 0.5rem 0.15rem 0.6rem;
    font-family: var(--font-body);
    font-size: 0.8rem;
    line-height: 1.4;
}

.tag-chip__remove[b-zsuhozvqbj] {
    background: none;
    border: none;
    color: color-mix(in srgb, var(--accent) 60%, transparent);
    padding: 0;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    transition: color 0.1s;
    display: flex;
    align-items: center;
}

.tag-chip__remove:hover[b-zsuhozvqbj] {
    color: var(--danger);
}

.tag-input__field[b-zsuhozvqbj] {
    flex: 1;
    min-width: 100px;
    background: none;
    border: none;
    outline: none;
    color: var(--text);
    font-family: var(--font-body);
    font-size: 0.9rem;
    padding: 0.2rem 0.3rem;
}

.tag-input__field[b-zsuhozvqbj]::placeholder {
    color: var(--text-muted);
    opacity: 0.7;
}
/* /Components/Shared/ThemeToggle.razor.rz.scp.css */
/* ── Pill toggle wrapper ─────────────────────────────────── */

.theme-toggle[b-28cf9hgtaf] {
    display: inline-flex;
    align-items: center;
    background: none;
    border: none;
    padding: 2px;
    cursor: pointer;
    flex-shrink: 0;
    border-radius: 14px;
    outline: none;
    transition: box-shadow 0.2s ease;
}

.theme-toggle:focus-visible[b-28cf9hgtaf] {
    box-shadow: 0 0 0 2px var(--accent);
}

/* ── Track (the pill background) ────────────────────────── */

.tt-track[b-28cf9hgtaf] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 48px;
    height: 22px;
    background: color-mix(in srgb, var(--page-bg) 60%, var(--border));
    border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
    border-radius: 11px;
    padding: 0 5px;
    transition: background-color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}

.theme-toggle--light .tt-track[b-28cf9hgtaf] {
    background: color-mix(in srgb, var(--accent) 9%, var(--surface));
    border-color: color-mix(in srgb, var(--accent) 42%, transparent);
    box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 15%, transparent);
}

.theme-toggle:hover .tt-track[b-28cf9hgtaf] {
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
    background: color-mix(in srgb, var(--accent) 7%, var(--surface));
}

/* ── Sliding knob ────────────────────────────────────────── */
/*
 * Track inner width = 48px - 2px borders = 46px
 * Knob: 16px wide, starts at left: 2px
 * End position: 46px - 2px - 16px = 28px from left → translateX(26px)
 */

.tt-knob[b-28cf9hgtaf] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    background: var(--accent-dim);
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    transition: transform 0.38s cubic-bezier(0.34, 1.56, 0.64, 1),
                background-color 0.28s ease,
                box-shadow 0.28s ease;
    z-index: 1;
    pointer-events: none;
}

.theme-toggle--light .tt-knob[b-28cf9hgtaf] {
    transform: translateX(26px);
    background: var(--accent);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35),
                0 0 10px color-mix(in srgb, var(--accent) 45%, transparent);
}

/* ── Icons at each end ───────────────────────────────────── */

.tt-icon[b-28cf9hgtaf] {
    position: relative;
    z-index: 0;
    flex-shrink: 0;
    pointer-events: none;
    transition: color 0.25s ease, opacity 0.25s ease;
}

/* Dark mode (default): moon lit, sun dim */
.tt-icon--moon[b-28cf9hgtaf] {
    color: var(--accent-dim);
    opacity: 0.9;
}

.tt-icon--sun[b-28cf9hgtaf] {
    color: var(--text-dim);
    opacity: 0.35;
}

/* Light mode: sun lit, moon dim */
.theme-toggle--light .tt-icon--moon[b-28cf9hgtaf] {
    color: var(--text-dim);
    opacity: 0.35;
}

.theme-toggle--light .tt-icon--sun[b-28cf9hgtaf] {
    color: var(--accent);
    opacity: 0.9;
}