:root {
    --hubx-black: #08080a;
    --hubx-black-2: #0d0d10;
    --hubx-black-3: #141419;
    --hubx-paper: #f4efe7;
    --hubx-paper-soft: #d9d2c8;
    --hubx-muted: #8e8982;
    --hubx-fuchsia: #ff2f92;
    --hubx-fuchsia-soft: rgba(255,47,146,.13);
    --hubx-line: rgba(244,239,231,.15);
    --hubx-line-soft: rgba(244,239,231,.09);
    --hubx-danger: #ff6b72;
    --hubx-success: #83d9a0;
    --hubx-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    --hubx-display: "Arial Black", "Helvetica Neue", Arial, sans-serif;
}

html { min-width: 0; background: var(--hubx-black); }
html.modal-open,
html.modal-open body { overflow: hidden !important; overscroll-behavior: none; }
body.public-body--system,
body.app-body--system {
    --bg: var(--hubx-black);
    --panel: var(--hubx-black-2);
    --panel-2: var(--hubx-black-3);
    --text: var(--hubx-paper);
    --muted: var(--hubx-muted);
    --line: var(--hubx-line);
    --primary: var(--hubx-fuchsia);
    --primary-2: var(--hubx-fuchsia);
    --accent: var(--hubx-fuchsia);
    --orange: var(--hubx-fuchsia);
    --sage: #c9c2b9;
    --teal: var(--hubx-fuchsia);
    --cream: var(--hubx-black);
    --cream-2: var(--hubx-black-2);
    --ink: var(--hubx-paper);
    --charcoal: var(--hubx-black);
    --charcoal-2: var(--hubx-black-2);
    --charcoal-3: var(--hubx-black-3);
    --dark-line: var(--hubx-line);
    min-width: 0;
    overflow-x: clip;
    background: var(--hubx-black) !important;
    color: var(--hubx-paper);
}

.public-body--system *,
.app-body--system * { min-width: 0; }
.public-body--system img,
.app-body--system img,
.public-body--system svg,
.app-body--system svg { max-width: 100%; }

.public-body--system .hub-global-tools {
    border-color: var(--hubx-line) !important;
    background: rgba(8,8,10,.92) !important;
    box-shadow: 0 16px 52px rgba(0,0,0,.32) !important;
    backdrop-filter: blur(18px);
}
.public-body--system .hub-global-brand-chip,
.public-body--system .hub-global-profile-chip {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    overflow: hidden;
    border: 1px solid rgba(244,239,231,.22);
    border-radius: 50%;
    background: var(--hubx-paper);
    color: var(--hubx-black);
    text-decoration: none;
}
.public-body--system .hub-global-brand-chip span,
.public-body--system .hub-global-profile-chip > span {
    font: 950 .86rem/1 var(--hubx-display);
}
.public-body--system .hub-global-profile-chip img { width: 100%; height: 100%; object-fit: cover; }
.public-body--system .hub-global-desktop-tools { display: flex; align-items: center; gap: 4px; }
.public-body--system .hub-global-tool {
    border-radius: 0 !important;
    color: rgba(244,239,231,.76) !important;
}
.public-body--system .hub-global-tool:hover { color: var(--hubx-paper) !important; background: rgba(244,239,231,.045) !important; }
.public-body--system .hub-global-count,
.public-body--system .hub-mobile-menu-badge { background: var(--hubx-fuchsia) !important; color: #fff !important; }

.public-body--system .hub-mobile-menu { display: none; position: relative; }
.public-body--system .hub-mobile-menu summary {
    list-style: none;
    position: relative;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 0;
    background: transparent;
    color: var(--hubx-paper);
    cursor: pointer;
}
.public-body--system .hub-mobile-menu summary::-webkit-details-marker { display: none; }
.public-body--system .hub-mobile-menu-lines { display: grid; gap: 4px; width: 17px; }
.public-body--system .hub-mobile-menu-lines i { display: block; height: 1px; background: currentColor; }
.public-body--system .hub-mobile-menu[open] .hub-mobile-menu-lines i:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.public-body--system .hub-mobile-menu[open] .hub-mobile-menu-lines i:nth-child(2) { opacity: 0; }
.public-body--system .hub-mobile-menu[open] .hub-mobile-menu-lines i:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }
.public-body--system .hub-mobile-menu-panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: min(330px, calc(100vw - 20px));
    max-height: calc(100dvh - 80px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 18px;
    border: 1px solid var(--hubx-line);
    background: rgba(8,8,10,.99);
    box-shadow: 0 22px 64px rgba(0,0,0,.48);
}
.public-body--system .hub-mobile-menu-heading { display: grid; gap: 5px; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--hubx-line-soft); }
.public-body--system .hub-mobile-menu-heading span { color: var(--hubx-fuchsia); font: 800 .58rem/1.2 var(--hubx-mono); letter-spacing: .15em; }
.public-body--system .hub-mobile-menu-heading strong { color: var(--hubx-paper); font: 950 1.02rem/1 var(--hubx-display); text-transform: uppercase; }
.public-body--system .hub-mobile-menu-panel > a { display: grid; grid-template-columns: 34px 1fr; gap: 8px; align-items: center; min-height: 45px; border-bottom: 1px solid var(--hubx-line-soft); color: var(--hubx-paper); text-decoration: none; }
.public-body--system .hub-mobile-menu-panel > a:last-child { border-bottom: 0; }
.public-body--system .hub-mobile-menu-panel > a > span { color: rgba(244,239,231,.38); font: 700 .61rem/1 var(--hubx-mono); }
.public-body--system .hub-mobile-menu-panel > a > b { font-size: .83rem; letter-spacing: .02em; }
.public-body--system .hub-mobile-menu-panel > a:hover b { color: var(--hubx-fuchsia); }

.public-body--system .landing,
.public-body--system .hub-search-page,
.public-body--system .legal-page,
.public-body--system .not-found,
.public-body--system .hub-update-page,
.public-body--system .hub-audience-page {
    color: var(--hubx-paper);
}
.public-body--system .landing-nav,
.public-body--system .legal-nav,
.public-body--system .hub-update-nav,
.public-body--system .audience-nav {
    border-bottom: 1px solid var(--hubx-line-soft);
}
.public-body--system .landing-nav .brand,
.public-body--system .legal-nav .brand,
.public-body--system .hub-update-brand,
.public-body--system .audience-nav .brand {
    color: var(--hubx-paper) !important;
    font-family: var(--hubx-display);
    text-transform: uppercase;
    letter-spacing: -.03em;
}
.public-body--system .landing-nav a,
.public-body--system .legal-nav a,
.public-body--system .hub-update-nav a,
.public-body--system .audience-nav a { color: rgba(244,239,231,.68); }
.public-body--system .landing-nav a:hover,
.public-body--system .legal-nav a:hover,
.public-body--system .hub-update-nav a:hover,
.public-body--system .audience-nav a:hover { color: var(--hubx-paper); }

.public-body--system .eyebrow,
.app-body--system .eyebrow {
    color: var(--hubx-fuchsia) !important;
    font-family: var(--hubx-mono);
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .15em;
}
.public-body--system .btn,
.app-body--system .btn {
    border-radius: 2px !important;
    border-color: var(--hubx-line) !important;
    background: transparent !important;
    color: var(--hubx-paper) !important;
    box-shadow: none !important;
    text-transform: uppercase;
    font-family: var(--hubx-mono);
    font-size: .72rem;
    letter-spacing: .045em;
}
.public-body--system .btn.primary,
.app-body--system .btn.primary,
.public-body--system .nav-cta,
.app-body--system .nav-cta {
    border-color: var(--hubx-paper) !important;
    background: var(--hubx-paper) !important;
    color: var(--hubx-black) !important;
}
.public-body--system .btn:hover,
.app-body--system .btn:hover { border-color: var(--hubx-fuchsia) !important; color: var(--hubx-fuchsia) !important; transform: none; }
.public-body--system .btn.primary:hover,
.app-body--system .btn.primary:hover,
.public-body--system .nav-cta:hover,
.app-body--system .nav-cta:hover { background: var(--hubx-fuchsia) !important; border-color: var(--hubx-fuchsia) !important; color: #fff !important; }

.public-body--system input,
.public-body--system textarea,
.public-body--system select,
.app-body--system input,
.app-body--system textarea,
.app-body--system select {
    max-width: 100%;
    border: 1px solid var(--hubx-line) !important;
    border-radius: 2px !important;
    background: rgba(244,239,231,.045) !important;
    color: var(--hubx-paper) !important;
    box-shadow: none !important;
}
.public-body--system input::placeholder,
.public-body--system textarea::placeholder,
.app-body--system input::placeholder,
.app-body--system textarea::placeholder { color: rgba(244,239,231,.36); }
.public-body--system input:focus,
.public-body--system textarea:focus,
.public-body--system select:focus,
.app-body--system input:focus,
.app-body--system textarea:focus,
.app-body--system select:focus { border-color: var(--hubx-fuchsia) !important; box-shadow: 0 0 0 1px var(--hubx-fuchsia) !important; }
.public-body--system select option,
.app-body--system select option { background: var(--hubx-black-2); color: var(--hubx-paper); }

.public-body--system .hub-search-page { width: min(1080px, calc(100% - 40px)); padding: 0 0 80px; }
.public-body--system .hub-search-intro { width: min(800px,100%); margin: 112px 0 42px; text-align: left; }
.public-body--system .hub-search-intro h1 {
    max-width: 760px;
    margin: .32rem 0 1rem;
    color: var(--hubx-paper);
    font-family: var(--hubx-display);
    font-size: clamp(3rem,7vw,6.5rem);
    line-height: .9;
    letter-spacing: -.06em;
    text-transform: uppercase;
}
.public-body--system .hub-search-intro > p { max-width: 620px; margin: 0; color: rgba(244,239,231,.58); font-size: 1rem; line-height: 1.65; }
.public-body--system .hub-search-main { width: min(700px,100%); margin: 28px 0 0; grid-template-columns: minmax(0,1fr) 150px; gap: 0; }
.public-body--system .hub-search-main input { min-height: 52px; padding: 0 16px; border-right: 0 !important; }
.public-body--system .hub-search-main .btn { min-height: 52px; }
.public-body--system .hub-search-results { width: 100%; margin: 50px 0 0; }
.public-body--system .hub-search-result-heading { display: grid; grid-template-columns: auto 1fr; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--hubx-line); color: var(--hubx-paper); font-family: var(--hubx-mono); text-transform: uppercase; }
.public-body--system .hub-search-result-heading small { color: rgba(244,239,231,.42); }
.public-body--system .hub-search-grid { gap: 0; }
.public-body--system .hub-search-card {
    grid-template-columns: minmax(0,1fr) auto;
    gap: 18px;
    padding: 18px 0;
    border: 0;
    border-bottom: 1px solid var(--hubx-line-soft);
    border-radius: 0;
    background: transparent;
    color: var(--hubx-paper);
    box-shadow: none;
}
.public-body--system .hub-search-card:hover { transform: none; border-color: rgba(255,47,146,.55); }
.public-body--system .hub-search-card-main { min-width: 0; display: grid; grid-template-columns: 58px minmax(0,1fr); gap: 15px; align-items: center; color: var(--hubx-paper); text-decoration: none; }
.public-body--system .hub-search-card > img,
.public-body--system .hub-search-card-main > img,
.public-body--system .hub-search-avatar-placeholder { width: 58px; height: 58px; border-radius: 50%; background: var(--hubx-paper); color: var(--hubx-black); }
.public-body--system .hub-search-card-copy strong { color: var(--hubx-paper); font-family: var(--hubx-display); font-size: 1.08rem; }
.public-body--system .hub-search-card-copy small,
.public-body--system .hub-search-card-copy em,
.public-body--system .hub-search-followers { color: rgba(244,239,231,.48); }
.public-body--system .hub-search-verified { background: var(--hubx-fuchsia); color: #fff; }
.public-body--system .hub-search-action { border: 1px solid var(--hubx-line); border-radius: 2px; color: var(--hubx-paper); background: transparent; }
.public-body--system .hub-search-action:hover { border-color: var(--hubx-fuchsia); color: var(--hubx-fuchsia); }
.public-body--system .hub-search-empty,
.public-body--system .hub-search-start { width: 100%; margin: 34px 0; border: 1px solid var(--hubx-line); border-radius: 0; background: transparent; color: rgba(244,239,231,.48); text-align: left; }
.public-body--system .hub-search-empty strong { color: var(--hubx-paper); }

.public-body--system .legal-page,
.public-body--system .not-found {
    width: min(900px, calc(100% - 40px));
    margin: 0 auto;
    padding: 100px 0 90px;
}
.public-body--system .legal-page h1,
.public-body--system .not-found h1 {
    margin: 42px 0 32px;
    color: var(--hubx-paper);
    font-family: var(--hubx-display);
    font-size: clamp(3.2rem,8vw,7rem);
    line-height: .88;
    letter-spacing: -.06em;
    text-transform: uppercase;
}
.public-body--system .legal-page h2 { margin: 44px 0 12px; padding-top: 18px; border-top: 1px solid var(--hubx-line-soft); color: var(--hubx-paper); font-family: var(--hubx-display); font-size: clamp(1.25rem,3vw,2.1rem); }
.public-body--system .legal-page p,
.public-body--system .legal-page li,
.public-body--system .not-found p { color: rgba(244,239,231,.62); line-height: 1.75; }
.public-body--system .legal-page a:not(.btn) { color: var(--hubx-paper); text-decoration-color: rgba(255,47,146,.6); }
.public-body--system .legal-nav { margin-bottom: 0; padding-bottom: 18px; }

.public-body--system .landing { width: min(1180px, calc(100% - 40px)); }
.public-body--system .hero { color: var(--hubx-paper); background: transparent !important; box-shadow: none !important; }
.public-body--system .hero::after { border: 1px solid var(--hubx-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--hubx-paper) !important; box-shadow: none !important; }
.public-body--system .hero h1 { color: var(--hubx-paper) !important; font-family: var(--hubx-display); text-transform: uppercase; }
.public-body--system .hero p { color: rgba(244,239,231,.58) !important; }
.public-body--system .feature-grid article,
.public-body--system .panel,
.public-body--system .form-card { border: 1px solid var(--hubx-line) !important; border-radius: 2px !important; background: transparent !important; box-shadow: none !important; }
.public-body--system .feature-grid article h2,
.public-body--system .panel h2,
.public-body--system .form-card h2 { color: var(--hubx-paper) !important; }
.public-body--system .hub-mini-footer { color: rgba(244,239,231,.52); }

.app-body--system .topbar {
    border-bottom: 1px solid var(--hubx-line-soft);
    background: rgba(8,8,10,.94);
    box-shadow: none;
    backdrop-filter: blur(18px);
}
.app-body--system .topbar .brand { color: var(--hubx-paper); font-family: var(--hubx-display); text-transform: uppercase; }
.app-body--system .topnav { gap: 0; }
.app-body--system .topnav a,
.app-body--system .topnav .link-button { min-height: 38px; padding: 0 10px; border-right: 1px solid var(--hubx-line-soft); color: rgba(244,239,231,.62); font: 700 .69rem/38px var(--hubx-mono); }
.app-body--system .topnav a:hover,
.app-body--system .topnav .link-button:hover { color: var(--hubx-fuchsia); }
.app-body--system .shell { width: min(1180px, calc(100% - 40px)); margin: 46px auto 90px; }
.app-body--system .page-head,
.app-body--system .page-heading { border-bottom: 1px solid var(--hubx-line); padding-bottom: 24px; }
.app-body--system .page-head h1,
.app-body--system .page-heading h1,
.app-body--system .auth-card h1 {
    color: var(--hubx-paper) !important;
    font-family: var(--hubx-display);
    line-height: .9;
    letter-spacing: -.055em;
    text-transform: uppercase;
}
.app-body--system .page-head p,
.app-body--system .page-heading p,
.app-body--system .auth-card p { color: rgba(244,239,231,.52) !important; }
.app-body--system .panel,
.app-body--system .form-card,
.app-body--system .metric-card,
.app-body--system .pricing-card,
.app-body--system .admin-table-wrap,
.app-body--system .action-list a,
.app-body--system .empty-state,
.app-body--system .creator-post-card,
.app-body--system .notification-row,
.app-body--system .following-pill {
    border: 1px solid var(--hubx-line) !important;
    border-radius: 2px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--hubx-paper);
}
.app-body--system .metric-card strong,
.app-body--system .panel h2,
.app-body--system .panel h3,
.app-body--system .form-card h2,
.app-body--system .pricing-card h2 { color: var(--hubx-paper) !important; }
.app-body--system .pricing-card.featured { border-color: rgba(255,47,146,.55) !important; }
.app-body--system .pricing-card.featured::before { background: var(--hubx-fuchsia) !important; }
.app-body--system .billing-note,
.app-body--system .custom-domain-preorder-panel,
.app-body--system .iris-payment-panel { background: rgba(255,47,146,.035) !important; border-color: rgba(255,47,146,.28) !important; }
.app-body--system .admin-table { min-width: 0; width: 100%; }
.app-body--system .admin-table th { color: rgba(244,239,231,.46); font-family: var(--hubx-mono); }
.app-body--system .admin-table td { color: rgba(244,239,231,.76); }
.app-body--system .auth-card { width: min(1040px, calc(100% - 40px)); margin: 72px auto; }
.app-body--system .auth-card .form-card { border-color: var(--hubx-line) !important; }

.app-body--system .following-strip { display: flex; max-width: 100%; overflow-x: auto; scrollbar-width: thin; }
.app-body--system .feed-stream,
.app-body--system .notification-list { width: 100%; min-width: 0; }
.app-body--system .hub-post-card,
.app-body--system .notification-row { max-width: 100%; overflow-wrap: anywhere; }
.app-body--system .hub-post-link { max-width: 100%; overflow-wrap: anywhere; }

.public-body--system .modal-backdrop,
.app-body--system .modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1000 !important;
    display: grid !important;
    place-items: center !important;
    padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)) !important;
    overflow: auto !important;
    overscroll-behavior: contain;
    background: rgba(0,0,0,.82) !important;
    backdrop-filter: blur(10px);
}
.public-body--system .modal-backdrop[hidden],
.app-body--system .modal-backdrop[hidden] { display: none !important; }
.public-body--system .modal-card,
.public-body--system .contact-modal-card,
.app-body--system .modal-card,
.app-body--system .contact-modal-card {
    position: relative;
    width: min(620px, 100%) !important;
    max-width: 100% !important;
    max-height: calc(100dvh - max(32px, env(safe-area-inset-top) + env(safe-area-inset-bottom) + 24px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    margin: auto !important;
    padding: 30px !important;
    border: 1px solid var(--hubx-line) !important;
    border-radius: 2px !important;
    background: var(--hubx-black-2) !important;
    color: var(--hubx-paper) !important;
    box-shadow: 0 32px 100px rgba(0,0,0,.52) !important;
    scrollbar-gutter: stable;
}
.public-body--system .modal-card h1,
.public-body--system .modal-card h2,
.public-body--system .modal-card h3,
.app-body--system .modal-card h1,
.app-body--system .modal-card h2,
.app-body--system .modal-card h3 { color: var(--hubx-paper) !important; overflow-wrap: anywhere; }
.public-body--system .modal-card p,
.public-body--system .modal-card small,
.app-body--system .modal-card p,
.app-body--system .modal-card small { color: rgba(244,239,231,.56) !important; }
.public-body--system .modal-close,
.app-body--system .modal-close {
    position: sticky !important;
    top: 0 !important;
    float: right;
    z-index: 3;
    width: 40px !important;
    height: 40px !important;
    margin: -12px -12px 4px 12px !important;
    border: 1px solid var(--hubx-line) !important;
    border-radius: 50% !important;
    background: var(--hubx-black) !important;
    color: var(--hubx-paper) !important;
}
.public-body--system .modal-form,
.public-body--system .follow-modal-form,
.app-body--system .modal-form { min-width: 0; }
.public-body--system .modal-card .share-row,
.public-body--system .modal-share-row { max-width: 100%; }
.public-body--system .calendar-choice-actions,
.public-body--system .calendar-choice-grid { max-width: 100%; }

.public-body--system .feedback-float,
.app-body--system .feedback-float {
    border: 1px solid var(--hubx-line) !important;
    border-radius: 2px !important;
    background: var(--hubx-black-2) !important;
    color: var(--hubx-paper) !important;
    box-shadow: 0 12px 38px rgba(0,0,0,.32) !important;
}
.public-body--system .feedback-float::before,
.app-body--system .feedback-float::before { color: var(--hubx-fuchsia); }

@media (max-width: 900px) {
    .public-body--system .hub-global-tools { top: 10px; right: 10px; gap: 2px; max-width: calc(100vw - 20px); padding: 3px; }
    .public-body--system .hub-global-desktop-tools { display: none; }
    .public-body--system .hub-mobile-menu { display: block; }
    .public-body--system .hub-global-brand-chip,
    .public-body--system .hub-global-profile-chip,
    .public-body--system .hub-mobile-menu summary { width: 39px; height: 39px; }

    .public-body--system .landing-nav,
    .public-body--system .legal-nav,
    .public-body--system .hub-update-nav,
    .public-body--system .audience-nav { padding-top: 76px; }

    .app-body--system .topbar {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 10px;
        padding: 12px 14px;
    }
    .app-body--system .mobile-nav-toggle {
        display: inline-grid !important;
        place-items: center;
        min-width: 76px;
        min-height: 40px;
        border: 1px solid var(--hubx-line);
        border-radius: 2px;
        background: transparent;
        color: var(--hubx-paper);
        font: 700 .68rem/1 var(--hubx-mono);
        text-transform: uppercase;
    }
    .app-body--system .topnav {
        grid-column: 1 / -1;
        display: none !important;
        width: 100%;
        max-height: calc(100dvh - 88px);
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: 8px 0 2px;
        border-top: 1px solid var(--hubx-line-soft);
    }
    .app-body--system .topnav.is-open { display: grid !important; grid-template-columns: 1fr 1fr; }
    .app-body--system .topnav a,
    .app-body--system .topnav .inline-form,
    .app-body--system .topnav .link-button { width: 100%; }
    .app-body--system .topnav a,
    .app-body--system .topnav .link-button { display: flex; align-items: center; min-height: 44px; padding: 0 10px; border-right: 0; border-bottom: 1px solid var(--hubx-line-soft); line-height: 1.2; }
    .app-body--system .topnav .inline-form { display: block; }
    .app-body--system .shell { width: min(100% - 24px, 1180px); margin: 26px auto 64px; }
    .app-body--system .page-head,
    .app-body--system .page-heading { display: grid; grid-template-columns: 1fr; gap: 16px; }
    .app-body--system .page-head > .btn,
    .app-body--system .page-heading > .btn { justify-self: start; }
    .app-body--system .grid.three,
    .app-body--system .grid.five,
    .app-body--system .analytics-grid.two,
    .app-body--system .split-panel,
    .app-body--system .pricing-grid { grid-template-columns: 1fr !important; }
    .app-body--system .form-grid { grid-template-columns: 1fr !important; }
    .app-body--system .form-grid .full { grid-column: 1; }
    .app-body--system .inline-grid-form,
    .app-body--system .row-editor,
    .app-body--system .admin-row,
    .app-body--system .admin-row form { grid-template-columns: 1fr !important; }
    .app-body--system .admin-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .app-body--system .admin-table { min-width: 680px; }
    .app-body--system .auth-card { width: min(100% - 24px, 620px); margin: 28px auto 56px; grid-template-columns: 1fr !important; }
    .app-body--system .auth-card h1 { font-size: clamp(2.55rem,12vw,4.8rem); }
}

@media (max-width: 640px) {
    .public-body--system .hub-search-page,
    .public-body--system .legal-page,
    .public-body--system .not-found,
    .public-body--system .landing,
    .public-body--system .hub-update-page,
    .public-body--system .hub-audience-page { width: calc(100% - 22px); }
    .public-body--system .hub-search-intro { margin: 86px 0 28px; }
    .public-body--system .hub-search-intro h1 { font-size: clamp(2.6rem,15vw,4.7rem); }
    .public-body--system .hub-search-main { grid-template-columns: 1fr; }
    .public-body--system .hub-search-main input { border-right: 1px solid var(--hubx-line) !important; border-bottom: 0 !important; }
    .public-body--system .hub-search-card { grid-template-columns: 1fr; gap: 10px; }
    .public-body--system .hub-search-card-main { grid-template-columns: 48px minmax(0,1fr); gap: 12px; }
    .public-body--system .hub-search-card-actions { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; justify-items: start; min-width: 0; padding-left: 60px; }
    .public-body--system .hub-search-card-actions .hub-search-action { justify-self: end; }
    .public-body--system .hub-search-card > img,
    .public-body--system .hub-search-card-main > img,
    .public-body--system .hub-search-avatar-placeholder { width: 48px; height: 48px; }
    .public-body--system .legal-page,
    .public-body--system .not-found { padding: 82px 0 64px; }
    .public-body--system .legal-page h1,
    .public-body--system .not-found h1 { font-size: clamp(2.7rem,15vw,4.9rem); margin-top: 28px; }
    .public-body--system .landing-nav,
    .public-body--system .legal-nav { display: grid; grid-template-columns: 1fr; align-items: start; gap: 12px; }
    .public-body--system .landing-nav-actions,
    .public-body--system .legal-nav > div { width: 100%; display: flex; flex-wrap: wrap; gap: 8px; }
    .public-body--system .landing-nav-actions a,
    .public-body--system .legal-nav > div a { width: auto !important; min-height: 38px; }

    .app-body--system .topnav.is-open { grid-template-columns: 1fr; }
    .app-body--system .shell { width: calc(100% - 18px); }
    .app-body--system .panel,
    .app-body--system .form-card,
    .app-body--system .metric-card,
    .app-body--system .pricing-card { padding: 18px !important; }
    .app-body--system .page-head h1,
    .app-body--system .page-heading h1 { font-size: clamp(2.2rem,13vw,4rem); overflow-wrap: anywhere; }
    .app-body--system .form-actions,
    .app-body--system .social-heading-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
    .app-body--system .form-actions .btn,
    .app-body--system .social-heading-actions .btn,
    .app-body--system .social-heading-actions form,
    .app-body--system .social-heading-actions button { width: 100%; }
    .app-body--system .admin-table { min-width: 620px; }

    .public-body--system .modal-backdrop,
    .app-body--system .modal-backdrop {
        align-items: end !important;
        padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)) !important;
    }
    .public-body--system .modal-card,
    .public-body--system .contact-modal-card,
    .app-body--system .modal-card,
    .app-body--system .contact-modal-card {
        width: 100% !important;
        max-height: calc(100dvh - max(16px, env(safe-area-inset-top) + env(safe-area-inset-bottom) + 8px)) !important;
        padding: 22px 16px max(18px, calc(14px + env(safe-area-inset-bottom))) !important;
        border-radius: 2px 2px 0 0 !important;
    }
    .public-body--system .modal-card .btn,
    .public-body--system .contact-modal-card .btn,
    .app-body--system .modal-card .btn { max-width: 100%; white-space: normal; }
    .public-body--system .modal-share-row,
    .public-body--system .modal-card .share-row { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 0 !important; }
    .public-body--system .modal-share-row .share-button,
    .public-body--system .modal-card .share-row .share-button { min-width: 0; width: 100%; justify-content: center; overflow: hidden; }
}

@media (max-width: 390px) {
    .public-body--system .hub-mobile-menu-panel { right: -2px; width: calc(100vw - 18px); padding: 15px; }
    .app-body--system .shell { width: calc(100% - 14px); }
    .app-body--system .panel,
    .app-body--system .form-card,
    .app-body--system .metric-card,
    .app-body--system .pricing-card { padding: 15px !important; }
    .public-body--system .modal-share-row,
    .public-body--system .modal-card .share-row { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}

@media (prefers-reduced-motion: reduce) {
    .public-body--system *,
    .app-body--system * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Hub 3.4.5 — visible EL/EN interface language control */
.hub-language-switch {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    white-space: nowrap;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.hub-language-switch a {
    color: var(--muted, #9a9892);
    text-decoration: none;
    transition: color .16s ease, opacity .16s ease;
}

.hub-language-switch a:hover,
.hub-language-switch a:focus-visible,
.hub-language-switch a.is-active,
.hub-language-switch a[aria-current="page"] {
    color: var(--accent, #ff2e93);
}

.hub-language-switch > span {
    color: rgba(247, 243, 234, .28);
}

.hub-language-switch--global {
    margin-left: auto;
    padding: .42rem .72rem;
    border-left: 1px solid rgba(247, 243, 234, .14);
    border-right: 1px solid rgba(247, 243, 234, .14);
}

.hub-language-switch--app {
    margin-right: .25rem;
    padding: .35rem .55rem;
    border: 1px solid rgba(247, 243, 234, .14);
}

.hub-mobile-language-row {
    display: grid;
    grid-template-columns: 2rem 1fr;
    align-items: center;
    min-width: 0;
    padding: .82rem 0;
    border-bottom: 1px solid rgba(247, 243, 234, .12);
}

.hub-mobile-language-row > span {
    color: var(--accent, #ff2e93);
    font: 700 .64rem/1 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    letter-spacing: .12em;
}

.hub-language-switch--mobile {
    justify-self: start;
    font-size: .78rem;
}

@media (max-width: 820px) {
    .hub-global-tools > .hub-language-switch--global {
        display: none;
    }

    .topnav .hub-language-switch--app {
        width: 100%;
        justify-content: flex-start;
        margin: 0 0 .4rem;
        padding: .7rem 0;
        border-width: 0 0 1px;
    }
}

.hub-support-banner{position:relative;z-index:1200;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px max(18px,calc((100vw - 1120px)/2));background:#f4eee5;color:#171318;border-bottom:3px solid #ff3b8d;font-size:.72rem}.hub-support-banner>div{display:flex;align-items:baseline;gap:13px;min-width:0}.hub-support-banner strong{font:850 .61rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.07em}.hub-support-banner span{color:#615862}.hub-support-banner a{flex:none;padding:8px 11px;background:#171318;color:#fff;text-decoration:none;font-weight:800}@media(max-width:720px){.hub-support-banner{align-items:flex-start;padding:10px 14px}.hub-support-banner>div{display:grid;gap:3px}.hub-support-banner span{font-size:.64rem;line-height:1.35}}

/* RC4 billing/account connection */
.account-connection-panel{border-color:rgba(255,79,131,.42)!important;background:#0a090b!important}
.account-connection-panel .panel-headline{align-items:center}
.billing-note--quiet{background:#090809!important;border-color:rgba(244,238,229,.14)!important}
.billing-note--quiet h2{color:#f4eee5!important}
.billing-note--quiet p{color:#aaa1a8!important}


/* Hub RC5 — plan-aware, customer-facing billing */
.account-connection-panel--compact{background:#0a0a0c}
.plan-next-step,.plan-renewal-card{border-color:rgba(255,255,255,.14)}
.plan-next-step--brand{background:#0b0a0d}
.plan-upgrade-stage{display:grid;gap:22px;margin-top:24px}
.plan-upgrade-intro{max-width:760px}
.plan-upgrade-intro h2{margin:.15em 0 .35em;font-size:clamp(1.65rem,3vw,2.6rem)}
.pricing-card--upgrade{max-width:760px}
.plan-action-note{margin-top:12px;font-size:.78rem;color:rgba(246,241,232,.62)}
.billing-note--payment{background:#0a0a0c}
@media(max-width:760px){
  .plan-upgrade-stage{gap:16px}
  .pricing-card--upgrade{max-width:none}
}
