/* C&C Sphere Home Rebuild
   Single visual system for home only.
   Keeps Blade/HTML/data intact. Replaces accumulated inline CSS.
*/

:root {
    --cc-gold: #f5b73b;
    --cc-gold-2: #d99a21;
    --cc-gold-3: #b7791f;
    --cc-ink: #061426;
    --cc-ink-2: #0b1727;
    --cc-ink-3: #102337;
    --cc-cream: #fff4dc;
    --cc-muted-gold: #d8c59a;
    --cc-line: rgba(245, 183, 59, .26);
    --cc-line-soft: rgba(245, 183, 59, .14);
    --cc-shadow: 0 22px 60px rgba(0, 0, 0, .30);
    --cc-radius-xl: 32px;
    --cc-radius-lg: 26px;
    --cc-radius-md: 22px;
    --cc-radius-sm: 16px;
}

/* -----------------------------
   Base shell
------------------------------ */

.sp-dashboard {
    min-height: 100vh;
    max-width: 1440px;
    margin: 0 auto;
    padding: 18px 18px 56px;
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr) 230px;
    gap: 18px;
    color: var(--cc-cream);
}

html.dark body,
body.dark,
html[data-theme="dark"] body,
body[data-theme="dark"] {
    background:
        radial-gradient(circle at 50% -12%, rgba(245,183,59,.10), transparent 36%),
        linear-gradient(180deg, #050b14 0%, #061426 42%, #040a13 100%) !important;
}

html.light body,
body.light,
html[data-theme="light"] body,
body[data-theme="light"] {
    background:
        radial-gradient(circle at 50% -12%, rgba(245,183,59,.24), transparent 38%),
        linear-gradient(180deg, #f5ead4 0%, #fff8ea 44%, #f7ecd8 100%) !important;
}

/* -----------------------------
   Global elements in home
------------------------------ */

.sp-dashboard *,
.sp-dashboard *::before,
.sp-dashboard *::after {
    box-sizing: border-box;
}

.sp-dashboard a {
    text-decoration: none;
}

.sp-i {
    width: 1em;
    height: 1em;
    flex: 0 0 auto;
}

.sp-card,
.sp-section,
.sp-home-feed-room,
.sp-marketplace-boost-banner {
    border-radius: var(--cc-radius-xl) !important;
    border: 1px solid var(--cc-line) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.08), transparent 32%),
        linear-gradient(180deg, #102035 0%, #071321 100%) !important;
    color: var(--cc-cream) !important;
    box-shadow: var(--cc-shadow);
    overflow: hidden;
}

html.light .sp-card,
html.light .sp-section,
html.light .sp-home-feed-room,
html.light .sp-marketplace-boost-banner,
html[data-theme="light"] .sp-card,
html[data-theme="light"] .sp-section,
html[data-theme="light"] .sp-home-feed-room,
html[data-theme="light"] .sp-marketplace-boost-banner,
body.light .sp-card,
body.light .sp-section,
body.light .sp-home-feed-room,
body.light .sp-marketplace-boost-banner,
body[data-theme="light"] .sp-card,
body[data-theme="light"] .sp-section,
body[data-theme="light"] .sp-home-feed-room,
body[data-theme="light"] .sp-marketplace-boost-banner {
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.12), transparent 32%),
        linear-gradient(180deg, #fffaf0 0%, #f9edd7 100%) !important;
    border-color: rgba(183,121,31,.20) !important;
    color: #101828 !important;
    box-shadow: 0 22px 58px rgba(92,64,16,.12);
}

.sp-dashboard h1,
.sp-dashboard h2,
.sp-dashboard h3,
.sp-dashboard h4,
.sp-dashboard strong,
.sp-dashboard b {
    color: var(--cc-cream) !important;
}

html.light .sp-dashboard h1,
html.light .sp-dashboard h2,
html.light .sp-dashboard h3,
html.light .sp-dashboard h4,
html.light .sp-dashboard strong,
html.light .sp-dashboard b,
html[data-theme="light"] .sp-dashboard h1,
html[data-theme="light"] .sp-dashboard h2,
html[data-theme="light"] .sp-dashboard h3,
html[data-theme="light"] .sp-dashboard h4,
html[data-theme="light"] .sp-dashboard strong,
html[data-theme="light"] .sp-dashboard b,
body.light .sp-dashboard h1,
body.light .sp-dashboard h2,
body.light .sp-dashboard h3,
body.light .sp-dashboard h4,
body.light .sp-dashboard strong,
body.light .sp-dashboard b,
body[data-theme="light"] .sp-dashboard h1,
body[data-theme="light"] .sp-dashboard h2,
body[data-theme="light"] .sp-dashboard h3,
body[data-theme="light"] .sp-dashboard h4,
body[data-theme="light"] .sp-dashboard strong,
body[data-theme="light"] .sp-dashboard b {
    color: #101828 !important;
}

.sp-dashboard p,
.sp-dashboard small,
.sp-dashboard span,
.sp-dashboard li {
    color: var(--cc-muted-gold);
}

html.light .sp-dashboard p,
html.light .sp-dashboard small,
html.light .sp-dashboard span,
html.light .sp-dashboard li,
html[data-theme="light"] .sp-dashboard p,
html[data-theme="light"] .sp-dashboard small,
html[data-theme="light"] .sp-dashboard span,
html[data-theme="light"] .sp-dashboard li,
body.light .sp-dashboard p,
body.light .sp-dashboard small,
body.light .sp-dashboard span,
body.light .sp-dashboard li,
body[data-theme="light"] .sp-dashboard p,
body[data-theme="light"] .sp-dashboard small,
body[data-theme="light"] .sp-dashboard span,
body[data-theme="light"] .sp-dashboard li {
    color: #475467;
}

/* -----------------------------
   Layout columns
------------------------------ */

.sp-left,
.sp-right {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.sp-center {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}

/* -----------------------------
   Buttons
------------------------------ */

.sp-btn,
.sp-dashboard button,
.sp-section-head > a,
.sp-home-feed-head > a,
.sp-panel-head > a,
.sp-home-connect,
.sp-sphere-connect-btn,
.sp-social-post-actions a {
    border-radius: 999px !important;
    font-weight: 900 !important;
    transition: transform .18s ease, filter .18s ease, border-color .18s ease;
}

.sp-btn:hover,
.sp-dashboard button:hover,
.sp-section-head > a:hover,
.sp-home-feed-head > a:hover,
.sp-panel-head > a:hover,
.sp-home-connect:hover,
.sp-sphere-connect-btn:hover {
    transform: translateY(-1px);
}

.sp-btn.gold,
.sp-section-head > a,
.sp-home-feed-head > a,
.sp-panel-head > a,
.sp-invite .sp-btn,
.sp-visibility .sp-btn {
    background: linear-gradient(135deg, #ffd166 0%, var(--cc-gold) 48%, var(--cc-gold-3) 100%) !important;
    color: #061426 !important;
    border: 1px solid rgba(255,209,102,.60) !important;
    box-shadow: 0 14px 30px rgba(245,183,59,.24);
}

.sp-btn.dark,
.sp-btn.dark.ghost,
.sp-sphere-connect-btn,
.sp-home-connect,
.sp-social-post-actions a {
    background: #061426 !important;
    color: var(--cc-cream) !important;
    border: 1px solid rgba(245,183,59,.28) !important;
}

/* -----------------------------
   Avatars / icons / badges
------------------------------ */

.sp-profile-avatar,
.sp-home-person-avatar,
.sp-sphere-person-avatar,
.sp-home-feed-avatar,
.sp-activity-dot,
.sp-connect-icon,
.sp-score {
    border-radius: 999px !important;
    overflow: hidden;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 34% 28%, #ffd166, transparent 30%),
        linear-gradient(135deg, #5b3a09, var(--cc-gold-2) 45%, #061426) !important;
    color: #fff !important;
    border: 1px solid rgba(255,209,102,.36);
}

.sp-profile-avatar img,
.sp-home-person-avatar img,
.sp-sphere-person-avatar img,
.sp-home-feed-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* -----------------------------
   Left sidebar
------------------------------ */

.sp-profile,
.sp-menu,
.sp-progress,
.sp-invite {
    padding: 18px;
}

.sp-profile {
    display: flex;
    align-items: center;
    gap: 13px;
}

.sp-profile-avatar {
    width: 58px;
    height: 58px;
}

.sp-profile strong,
.sp-profile small,
.sp-profile a {
    display: block;
}

.sp-profile a {
    color: var(--cc-cream) !important;
    text-decoration: underline;
}

html.light .sp-profile a {
    color: #101828 !important;
}

.sp-menu {
    display: grid;
    gap: 7px;
}

.sp-menu a,
.sp-menu button {
    min-height: 42px;
    width: 100%;
    padding: 10px 13px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    background: transparent;
    color: #e9d8ad !important;
    cursor: pointer;
    text-align: left;
}

.sp-menu a span,
.sp-menu button span {
    color: inherit !important;
    opacity: 1 !important;
}

.sp-menu a.is-active,
.sp-menu a:hover,
.sp-menu button:hover {
    background: rgba(245,183,59,.16) !important;
    color: #fff4dc !important;
}

html.light .sp-menu a,
html.light .sp-menu button,
html.light .sp-menu a span,
html.light .sp-menu button span {
    color: #344054 !important;
}

html.light .sp-menu a.is-active,
html.light .sp-menu a:hover,
html.light .sp-menu button:hover {
    background: #fff1c2 !important;
    color: #101828 !important;
}

.sp-menu form {
    margin: 0;
}

.sp-progress-row,
.sp-reputation-row,
.sp-reputation-foot,
.sp-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.sp-progress-bar {
    height: 8px;
    border-radius: 999px;
    background: rgba(245,183,59,.18);
    overflow: hidden;
    margin: 12px 0;
}

.sp-progress-bar span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--cc-gold), #ffd166);
}

/* -----------------------------
   Hero
------------------------------ */

.sp-hero {
    position: relative;
    min-height: 500px;
    border-radius: 34px !important;
    overflow: hidden;
    border: 1px solid rgba(245,183,59,.36);
    box-shadow: 0 32px 90px rgba(0,0,0,.42);
    background: #061426;
}

.sp-hero-bg-stack,
.sp-hero-bg-slide {
    position: absolute;
    inset: 0;
}

.sp-hero-bg-slide {
    opacity: 0;
    background-size: cover;
    background-position: center;
    transition: opacity .4s ease;
}

.sp-hero-bg-slide.is-active {
    opacity: 1;
}

.sp-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(2,7,17,.94), rgba(2,7,17,.70), rgba(2,7,17,.15)),
        radial-gradient(circle at 78% 18%, rgba(245,183,59,.18), transparent 30%),
        linear-gradient(180deg, rgba(2,7,17,.05), rgba(2,7,17,.82));
    pointer-events: none;
}

.sp-hero-copy-stack {
    position: relative;
    z-index: 2;
    min-height: 500px;
    display: flex;
    align-items: center;
}

.sp-hero-copy-slide {
    display: none;
    width: 100%;
}

.sp-hero-copy-slide.is-active {
    display: block;
}

.sp-hero-inner {
    max-width: 760px;
    padding: 54px 44px 112px;
}

.sp-kicker,
.sp-section-head > div > span,
.sp-home-feed-head > div > span {
    display: block !important;
    width: max-content;
    max-width: 100%;
    margin: 0 0 9px !important;
    padding: 0 !important;
    color: var(--cc-gold) !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    font-weight: 1000 !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    background: transparent !important;
}

.sp-hero .sp-kicker {
    padding: 8px 14px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(245,183,59,.42);
    background: rgba(2,7,17,.46) !important;
}

.sp-hero h1 {
    margin: 18px 0 18px;
    color: #fff4dc !important;
    font-size: clamp(52px, 5.5vw, 82px);
    line-height: .9;
    letter-spacing: -.07em;
    font-weight: 1000;
    text-shadow: 0 16px 42px rgba(0,0,0,.55);
}

.sp-hero h1 span {
    color: var(--cc-gold) !important;
}

.sp-hero p {
    max-width: 640px;
    color: #f7e8c8 !important;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 750;
    text-shadow: 0 10px 26px rgba(0,0,0,.44);
}

.sp-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 26px;
}

.sp-hero-actions .sp-btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 16px;
}

.sp-hero-dots {
    position: absolute;
    right: 24px;
    bottom: 86px;
    z-index: 4;
    display: flex;
    gap: 8px;
}

.sp-hero-dots button {
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: 999px !important;
    border: 1px solid rgba(245,183,59,.85);
    background: rgba(255,255,255,.42);
}

.sp-hero-dots button.is-active {
    width: 28px;
    background: var(--cc-gold);
}

.sp-stats {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: rgba(2,7,17,.78);
    border-top: 1px solid rgba(245,183,59,.22);
}

.sp-stat {
    padding: 15px 18px;
    border-right: 1px solid rgba(245,183,59,.16);
}

.sp-stat:last-child {
    border-right: 0;
}

.sp-stat b {
    display: block;
    color: #fff4dc !important;
    font-size: 24px;
}

.sp-stat span {
    color: #d8c59a !important;
    font-size: 12px;
    font-weight: 850;
}

/* -----------------------------
   Section headers
------------------------------ */

.sp-section,
.sp-home-feed-room {
    padding: 26px;
}

.sp-section-head,
.sp-home-feed-head {
    position: relative;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 18px;
    margin-bottom: 20px !important;
    overflow: visible !important;
}

.sp-section-head > div,
.sp-home-feed-head > div {
    min-width: 0;
    flex: 1 1 auto;
}

.sp-section-head h2,
.sp-home-feed-head h2 {
    display: block !important;
    margin: 0 0 7px !important;
    padding: 0 !important;
    color: #fff4dc !important;
    font-size: clamp(27px, 2.3vw, 36px);
    line-height: 1.03 !important;
    letter-spacing: -.04em;
    font-weight: 1000;
    text-shadow: 0 2px 10px rgba(0,0,0,.28);
}

html.light .sp-section-head h2,
html.light .sp-home-feed-head h2,
html[data-theme="light"] .sp-section-head h2,
html[data-theme="light"] .sp-home-feed-head h2,
body.light .sp-section-head h2,
body.light .sp-home-feed-head h2,
body[data-theme="light"] .sp-section-head h2,
body[data-theme="light"] .sp-home-feed-head h2 {
    color: #101828 !important;
    text-shadow: none;
}

.sp-section-head p,
.sp-home-feed-head p {
    margin: 0 !important;
    color: #e1cf9f !important;
    font-size: 13px;
    line-height: 1.45;
    font-weight: 750;
}

html.light .sp-section-head p,
html.light .sp-home-feed-head p,
html[data-theme="light"] .sp-section-head p,
html[data-theme="light"] .sp-home-feed-head p {
    color: #475467 !important;
}

.sp-section-head > a,
.sp-home-feed-head > a,
.sp-panel-head > a {
    flex: 0 0 auto;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    white-space: nowrap;
}

/* -----------------------------
   Grids and cards
------------------------------ */

.sp-sphere-steps,
.sp-sphere-people-grid,
.sp-connect-grid,
.sp-listing-grid,
.sp-project-grid-clean,
.sp-project-grid-home,
.sp-opportunity-grid,
.sp-feature-strip {
    display: grid;
    gap: 14px;
}

.sp-sphere-steps,
.sp-feature-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sp-sphere-people-grid,
.sp-connect-grid,
.sp-opportunity-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sp-listing-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.sp-project-grid-clean,
.sp-project-grid-home {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sp-sphere-step,
.sp-sphere-person-card,
.sp-connect-card,
.sp-opportunity,
.sp-listing-card,
.sp-project-card-clean,
.sp-social-post-card,
.sp-home-feed-post,
.sp-feature,
.sp-sphere-trust-grid > div,
.sp-sphere-trust-score-card {
    border-radius: 24px !important;
    border: 1px solid rgba(245,183,59,.20) !important;
    background:
        radial-gradient(circle at 92% 0%, rgba(245,183,59,.08), transparent 30%),
        linear-gradient(180deg, #14243a, #0b1727) !important;
    color: var(--cc-cream) !important;
    overflow: hidden;
    box-shadow: 0 14px 34px rgba(0,0,0,.22);
}

html.light .sp-sphere-step,
html.light .sp-sphere-person-card,
html.light .sp-connect-card,
html.light .sp-opportunity,
html.light .sp-listing-card,
html.light .sp-project-card-clean,
html.light .sp-social-post-card,
html.light .sp-home-feed-post,
html.light .sp-feature,
html.light .sp-sphere-trust-grid > div,
html.light .sp-sphere-trust-score-card,
html[data-theme="light"] .sp-sphere-step,
html[data-theme="light"] .sp-sphere-person-card,
html[data-theme="light"] .sp-connect-card,
html[data-theme="light"] .sp-opportunity,
html[data-theme="light"] .sp-listing-card,
html[data-theme="light"] .sp-project-card-clean,
html[data-theme="light"] .sp-social-post-card,
html[data-theme="light"] .sp-home-feed-post,
html[data-theme="light"] .sp-feature,
html[data-theme="light"] .sp-sphere-trust-grid > div,
html[data-theme="light"] .sp-sphere-trust-score-card {
    background:
        radial-gradient(circle at 92% 0%, rgba(245,183,59,.12), transparent 30%),
        linear-gradient(180deg, #fffdf8, #fff4df) !important;
    color: #101828 !important;
    border-color: rgba(183,121,31,.16) !important;
    box-shadow: 0 14px 34px rgba(92,64,16,.08);
}

.sp-sphere-step,
.sp-connect-card,
.sp-opportunity {
    padding: 18px;
}

.sp-sphere-step strong,
.sp-connect-card strong,
.sp-opportunity h3,
.sp-project-card-clean h3,
.sp-listing-card strong,
.sp-social-post-author strong,
.sp-sphere-person-name {
    color: #fff4dc !important;
}

html.light .sp-sphere-step strong,
html.light .sp-connect-card strong,
html.light .sp-opportunity h3,
html.light .sp-project-card-clean h3,
html.light .sp-listing-card strong,
html.light .sp-social-post-author strong,
html.light .sp-sphere-person-name,
html[data-theme="light"] .sp-sphere-step strong,
html[data-theme="light"] .sp-connect-card strong,
html[data-theme="light"] .sp-opportunity h3,
html[data-theme="light"] .sp-project-card-clean h3,
html[data-theme="light"] .sp-listing-card strong,
html[data-theme="light"] .sp-social-post-author strong,
html[data-theme="light"] .sp-sphere-person-name {
    color: #101828 !important;
}

.sp-sphere-step p,
.sp-connect-card p,
.sp-opportunity p,
.sp-opportunity small,
.sp-project-card-clean p,
.sp-listing-card small,
.sp-social-post-author small {
    color: #d8c59a !important;
}

html.light .sp-sphere-step p,
html.light .sp-connect-card p,
html.light .sp-opportunity p,
html.light .sp-opportunity small,
html.light .sp-project-card-clean p,
html.light .sp-listing-card small,
html.light .sp-social-post-author small,
html[data-theme="light"] .sp-sphere-step p,
html[data-theme="light"] .sp-connect-card p,
html[data-theme="light"] .sp-opportunity p,
html[data-theme="light"] .sp-opportunity small,
html[data-theme="light"] .sp-project-card-clean p,
html[data-theme="light"] .sp-listing-card small,
html[data-theme="light"] .sp-social-post-author small {
    color: #475467 !important;
}

/* -----------------------------
   People
------------------------------ */

.sp-sphere-person-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 18px;
}

.sp-sphere-person-avatar {
    width: 62px;
    height: 62px;
}

.sp-sphere-person-main small {
    display: block;
    margin-top: 4px;
}

.sp-sphere-person-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.sp-pill,
.sp-badge,
.sp-project-type,
.sp-sphere-person-meta span,
.sp-verified-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px !important;
    background: rgba(245,183,59,.14) !important;
    color: #f8d58a !important;
    border: 1px solid rgba(245,183,59,.28) !important;
    padding: 5px 9px;
    font-size: 11px;
    font-weight: 900;
}

html.light .sp-pill,
html.light .sp-badge,
html.light .sp-project-type,
html.light .sp-sphere-person-meta span,
html.light .sp-verified-pill,
html[data-theme="light"] .sp-pill,
html[data-theme="light"] .sp-badge,
html[data-theme="light"] .sp-project-type,
html[data-theme="light"] .sp-sphere-person-meta span,
html[data-theme="light"] .sp-verified-pill {
    background: #fff1c2 !important;
    color: #6b4a0d !important;
}

/* -----------------------------
   Trust
------------------------------ */

.sp-sphere-trust-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 16px;
}

.sp-sphere-trust-score-card {
    padding: 24px;
    background: #071321 !important;
}

.sp-sphere-trust-score-card strong {
    display: block;
    margin-top: 12px;
    color: #fff4dc !important;
    font-size: 56px;
    line-height: 1;
}

.sp-sphere-trust-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.sp-sphere-trust-grid > div {
    padding: 16px;
}

.sp-sphere-trust-grid > div b,
.sp-sphere-trust-grid > div span {
    display: block;
}

/* -----------------------------
   Listings, projects, reviews
------------------------------ */

.sp-listing-card,
.sp-project-card-clean {
    display: block;
}

.sp-listing-media,
.sp-project-card-cover,
.sp-social-post-media {
    position: relative;
    background: #071321;
    border-radius: 24px !important;
    overflow: hidden;
}

.sp-listing-media img,
.sp-project-card-cover img,
.sp-social-post-media img,
.sp-social-post-media video {
    width: 100%;
    display: block;
    object-fit: cover;
    border-radius: inherit;
}

.sp-listing-media img,
.sp-project-card-cover img {
    height: 150px;
}

.sp-listing-body,
.sp-project-card-clean h3,
.sp-project-card-clean p,
.sp-project-meta-clean,
.sp-project-author-clean {
    padding-left: 14px;
    padding-right: 14px;
}

.sp-listing-body {
    padding-top: 13px;
    padding-bottom: 14px;
}

.sp-price {
    margin-top: 8px;
    color: var(--cc-gold) !important;
    font-weight: 1000;
}

/* -----------------------------
   Feed
------------------------------ */

.sp-home-feed-list {
    display: grid;
    gap: 14px;
}

.sp-social-post-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px 10px;
}

.sp-home-feed-avatar {
    width: 50px;
    height: 50px;
}

.sp-social-post-text {
    padding: 8px 18px 14px;
    color: #fff4dc !important;
    line-height: 1.55;
    font-weight: 700;
}

html.light .sp-social-post-text {
    color: #101828 !important;
}

.sp-social-post-media img,
.sp-social-post-media video {
    max-height: 460px;
}

.sp-social-post-stats,
.sp-social-post-actions {
    display: flex;
    gap: 10px;
    padding: 12px 18px;
    border-top: 1px solid var(--cc-line-soft);
}

.sp-social-post-actions a {
    flex: 1;
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* -----------------------------
   Right sidebar
------------------------------ */

.sp-reputation,
.sp-panel {
    padding: 18px;
}

.sp-reputation-head,
.sp-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.sp-reputation .sp-score {
    width: 76px;
    height: 76px;
    min-width: 76px;
    color: #fff4dc !important;
    font-size: 28px;
    font-weight: 1000;
    border: 3px solid var(--cc-gold);
    background: rgba(255,255,255,.025) !important;
}

html.light .sp-reputation .sp-score {
    color: #101828 !important;
    background: #fffaf0 !important;
}

.sp-reputation-row {
    padding: 9px 0;
    border-bottom: 1px solid var(--cc-line-soft);
}

.sp-reputation-row span,
.sp-reputation-row strong {
    color: #e9d8ad !important;
    opacity: 1 !important;
}

html.light .sp-reputation-row span,
html.light .sp-reputation-row strong {
    color: #344054 !important;
}

.sp-reputation-foot {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--cc-line-soft);
}

.sp-home-person {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--cc-line-soft);
}

.sp-home-person-avatar {
    width: 46px;
    height: 46px;
}

.sp-home-person-main a {
    color: #fff4dc !important;
    font-weight: 900;
}

html.light .sp-home-person-main a {
    color: #101828 !important;
}

.sp-home-person-main small {
    display: block;
    margin-top: 4px;
}

.sp-activity {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--cc-line-soft);
}

.sp-activity-dot {
    width: 36px;
    height: 36px;
}

/* -----------------------------
   Invite / visibility cards
------------------------------ */

.sp-invite,
.sp-right .sp-visibility {
    background:
        radial-gradient(circle at 90% 10%, rgba(245,183,59,.30), transparent 34%),
        linear-gradient(135deg, #061426, #102337) !important;
    color: #fff4dc !important;
}

.sp-invite h3,
.sp-right .sp-visibility h3 {
    color: #f8d58a !important;
}

/* -----------------------------
   Hover
------------------------------ */

.sp-sphere-step,
.sp-sphere-person-card,
.sp-connect-card,
.sp-opportunity,
.sp-listing-card,
.sp-project-card-clean {
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.sp-sphere-step:hover,
.sp-sphere-person-card:hover,
.sp-connect-card:hover,
.sp-opportunity:hover,
.sp-listing-card:hover,
.sp-project-card-clean:hover {
    transform: translateY(-1px);
    border-color: rgba(245,183,59,.36) !important;
}

/* -----------------------------
   Responsive
------------------------------ */

@media (max-width: 1439px) {
    .sp-dashboard {
        grid-template-columns: minmax(220px, 250px) minmax(0, 1fr);
        max-width: 1280px;
    }

    .sp-right {
        display: none;
    }

    .sp-listing-grid,
    .sp-project-grid-clean,
    .sp-project-grid-home {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1023px) {
    .sp-dashboard {
        grid-template-columns: 1fr;
        max-width: 100%;
        padding: 14px 12px 44px;
    }

    .sp-left {
        display: none;
    }

    .sp-center {
        width: 100%;
        min-width: 0;
    }

    .sp-sphere-steps,
    .sp-sphere-people-grid,
    .sp-connect-grid,
    .sp-opportunity-grid,
    .sp-listing-grid,
    .sp-project-grid-clean,
    .sp-project-grid-home,
    .sp-feature-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sp-sphere-trust-layout {
        grid-template-columns: 1fr;
    }

    .sp-hero,
    .sp-hero-copy-stack {
        min-height: 540px;
    }

    .sp-hero-inner {
        padding: 40px 24px 112px;
    }

    .sp-stats {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 620px) {
    .sp-card,
    .sp-section,
    .sp-home-feed-room,
    .sp-marketplace-boost-banner,
    .sp-hero {
        border-radius: 26px !important;
    }

    .sp-sphere-step,
    .sp-sphere-person-card,
    .sp-connect-card,
    .sp-opportunity,
    .sp-listing-card,
    .sp-project-card-clean,
    .sp-social-post-card,
    .sp-home-feed-post,
    .sp-feature {
        border-radius: 22px !important;
    }

    .sp-section,
    .sp-home-feed-room {
        padding: 20px;
    }

    .sp-sphere-steps,
    .sp-sphere-people-grid,
    .sp-connect-grid,
    .sp-opportunity-grid,
    .sp-listing-grid,
    .sp-project-grid-clean,
    .sp-project-grid-home,
    .sp-feature-strip,
    .sp-sphere-trust-grid {
        grid-template-columns: 1fr;
    }

    .sp-section-head,
    .sp-home-feed-head {
        flex-direction: column;
    }

    .sp-hero h1 {
        font-size: 44px;
    }
}

/* SPHERE_HOME_VISUAL_RESTORE_AFTER_CUT_V1
   Visual-only restore after CSS cleanup.
   No layout/grid/width changes.
*/

/* Hero: keep premium dark overlay and white readable text */
.sp-hero {
    color: #fff4dc !important;
    background: #061426 !important;
    border: 1px solid rgba(245,183,59,.36) !important;
    box-shadow: 0 32px 90px rgba(0,0,0,.42) !important;
}

.sp-hero::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    background:
        linear-gradient(90deg, rgba(2,7,17,.94), rgba(2,7,17,.70), rgba(2,7,17,.15)),
        radial-gradient(circle at 78% 18%, rgba(245,183,59,.18), transparent 30%),
        linear-gradient(180deg, rgba(2,7,17,.05), rgba(2,7,17,.82)) !important;
    pointer-events: none !important;
}

.sp-hero-bg-stack {
    z-index: 0 !important;
}

.sp-hero-copy-stack,
.sp-hero-inner,
.sp-hero-dots,
.sp-stats {
    position: relative !important;
    z-index: 2 !important;
}

.sp-hero .sp-kicker {
    color: #f5b73b !important;
    background: rgba(2,7,17,.46) !important;
    border: 1px solid rgba(245,183,59,.42) !important;
}

.sp-hero h1,
.sp-hero h1 * {
    color: #fff4dc !important;
    text-shadow: 0 16px 42px rgba(0,0,0,.55) !important;
}

.sp-hero h1 span {
    color: #f5b73b !important;
}

.sp-hero p {
    color: #f7e8c8 !important;
    text-shadow: 0 10px 26px rgba(0,0,0,.44) !important;
}

.sp-hero .sp-btn.gold {
    background: linear-gradient(135deg, #ffd166 0%, #f5b73b 48%, #b7791f 100%) !important;
    color: #061426 !important;
    border-color: rgba(255,209,102,.60) !important;
}

.sp-hero .sp-btn.dark {
    background: rgba(6,20,38,.86) !important;
    color: #fff4dc !important;
    border-color: rgba(245,183,59,.36) !important;
}

/* Sidebar cards: restore premium card look without changing columns */
.sp-left .sp-card,
.sp-right .sp-card,
.sp-right .sp-panel,
.sp-right .sp-reputation {
    border-radius: 26px !important;
    border: 1px solid rgba(245,183,59,.24) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.08), transparent 32%),
        linear-gradient(180deg, #102035 0%, #071321 100%) !important;
    color: #fff4dc !important;
    box-shadow: 0 22px 60px rgba(0,0,0,.25) !important;
    overflow: hidden !important;
}

.sp-left .sp-card *,
.sp-right .sp-card *,
.sp-right .sp-panel *,
.sp-right .sp-reputation * {
    box-sizing: border-box !important;
}

.sp-left strong,
.sp-right strong,
.sp-left h3,
.sp-right h3,
.sp-left b,
.sp-right b {
    color: #fff4dc !important;
}

.sp-left p,
.sp-right p,
.sp-left small,
.sp-right small,
.sp-left span,
.sp-right span,
.sp-left li,
.sp-right li {
    color: #d8c59a !important;
}

.sp-menu a,
.sp-menu button {
    color: #e9d8ad !important;
    background: transparent !important;
}

.sp-menu a.is-active,
.sp-menu a:hover,
.sp-menu button:hover {
    background: rgba(245,183,59,.16) !important;
    color: #fff4dc !important;
}

.sp-profile-avatar,
.sp-home-person-avatar,
.sp-activity-dot,
.sp-score {
    background:
        radial-gradient(circle at 34% 28%, #ffd166, transparent 30%),
        linear-gradient(135deg, #5b3a09, #d99a21 45%, #061426) !important;
    color: #fff !important;
    border-color: rgba(255,209,102,.36) !important;
}

.sp-invite,
.sp-right .sp-visibility {
    background:
        radial-gradient(circle at 90% 10%, rgba(245,183,59,.30), transparent 34%),
        linear-gradient(135deg, #061426, #102337) !important;
    color: #fff4dc !important;
}

.sp-invite h3,
.sp-right .sp-visibility h3 {
    color: #f8d58a !important;
}

/* Light mode keeps readable colors */
html[data-theme="light"] .sp-left .sp-card,
html[data-theme="light"] .sp-right .sp-card,
html[data-theme="light"] .sp-right .sp-panel,
html[data-theme="light"] .sp-right .sp-reputation,
body[data-theme="light"] .sp-left .sp-card,
body[data-theme="light"] .sp-right .sp-card,
body[data-theme="light"] .sp-right .sp-panel,
body[data-theme="light"] .sp-right .sp-reputation {
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.12), transparent 32%),
        linear-gradient(180deg, #fffaf0 0%, #f9edd7 100%) !important;
    border-color: rgba(183,121,31,.20) !important;
    color: #101828 !important;
    box-shadow: 0 22px 58px rgba(92,64,16,.12) !important;
}

html[data-theme="light"] .sp-left strong,
html[data-theme="light"] .sp-right strong,
html[data-theme="light"] .sp-left h3,
html[data-theme="light"] .sp-right h3,
html[data-theme="light"] .sp-left b,
html[data-theme="light"] .sp-right b,
body[data-theme="light"] .sp-left strong,
body[data-theme="light"] .sp-right strong,
body[data-theme="light"] .sp-left h3,
body[data-theme="light"] .sp-right h3,
body[data-theme="light"] .sp-left b,
body[data-theme="light"] .sp-right b {
    color: #101828 !important;
}

html[data-theme="light"] .sp-left p,
html[data-theme="light"] .sp-right p,
html[data-theme="light"] .sp-left small,
html[data-theme="light"] .sp-right small,
html[data-theme="light"] .sp-left span,
html[data-theme="light"] .sp-right span,
body[data-theme="light"] .sp-left p,
body[data-theme="light"] .sp-right p,
body[data-theme="light"] .sp-left small,
body[data-theme="light"] .sp-right small,
body[data-theme="light"] .sp-left span,
body[data-theme="light"] .sp-right span {
    color: #475467 !important;
}

html[data-theme="light"] .sp-menu a,
html[data-theme="light"] .sp-menu button,
body[data-theme="light"] .sp-menu a,
body[data-theme="light"] .sp-menu button {
    color: #344054 !important;
}

html[data-theme="light"] .sp-menu a.is-active,
html[data-theme="light"] .sp-menu a:hover,
html[data-theme="light"] .sp-menu button:hover,
body[data-theme="light"] .sp-menu a.is-active,
body[data-theme="light"] .sp-menu a:hover,
body[data-theme="light"] .sp-menu button:hover {
    background: #fff1c2 !important;
    color: #101828 !important;
}

/* SPHERE_HOME_HEADER_OVERLAP_VISUAL_FIX_V1
   Fix only:
   - content no longer hides under sticky header/nav on laptop/desktop
   - hero title returns to white/gold premium contrast
   - no grid/column/card width changes
*/

@media (min-width: 1024px) {
    body.sphere-app-body .sp-main {
        padding-top: 34px !important;
    }

    body.sphere-app-body .sp-dashboard {
        align-items: start !important;
    }

    body.sphere-app-body .sp-left,
    body.sphere-app-body .sp-right {
        padding-top: 0 !important;
    }

    body.sphere-app-body .sp-hero {
        margin-top: 0 !important;
        color: #fff4dc !important;
        background: #061426 !important;
    }

    body.sphere-app-body .sp-hero h1,
    body.sphere-app-body .sp-hero h1 * {
        color: #fff4dc !important;
        opacity: 1 !important;
        filter: none !important;
        text-shadow: 0 16px 42px rgba(0,0,0,.62) !important;
    }

    body.sphere-app-body .sp-hero h1 span {
        color: #f5b73b !important;
    }

    body.sphere-app-body .sp-hero p {
        color: #fff4dc !important;
        opacity: 1 !important;
        text-shadow: 0 10px 28px rgba(0,0,0,.55) !important;
    }

    body.sphere-app-body .sp-hero .sp-kicker {
        color: #f5b73b !important;
        border-color: rgba(245,183,59,.46) !important;
        background: rgba(2,7,17,.52) !important;
    }
}

@media (min-width: 1181px) and (max-width: 1500px) {
    body.sphere-app-body .sp-main {
        padding-top: 38px !important;
    }
}

@media (min-width: 1024px) and (max-width: 1180px) {
    body.sphere-app-body .sp-main {
        padding-top: 32px !important;
    }
}


/* HOME_FINAL_LUXURY_CASCADE_V5
   Final hero visual refinement:
   - restore white/gold luxury title
   - lighter mobile banner image
   - paginator moved above, away from stats
   - smaller mobile typography
*/

/* Layout */
@media (min-width: 1440px) {
    body.sphere-app-body .sp-main {
        width: min(1560px, calc(100% - 48px)) !important;
    }

    body.sphere-app-body .sp-dashboard {
        width: 100% !important;
        max-width: 1520px !important;
        grid-template-columns: 250px minmax(0, 1fr) 320px !important;
        gap: 22px !important;
    }
}

@media (min-width: 1024px) and (max-width: 1439px) {
    body.sphere-app-body .sp-main {
        width: min(1280px, calc(100% - 34px)) !important;
    }

    body.sphere-app-body .sp-dashboard {
        grid-template-columns: minmax(220px, 255px) minmax(0, 1fr) !important;
        max-width: 1280px !important;
        gap: 18px !important;
    }

    body.sphere-app-body .sp-right {
        display: none !important;
    }
}

@media (max-width: 1023px) {
    body.sphere-app-body .sp-main {
        width: min(100% - 20px, 920px) !important;
    }

    body.sphere-app-body .sp-dashboard {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.sphere-app-body .sp-left,
    body.sphere-app-body .sp-right {
        display: none !important;
    }
}

/* Hero base */
body.sphere-app-body .sp-hero {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 34px !important;
    border: 1px solid rgba(217,154,33,.30) !important;
    box-shadow: 0 24px 64px rgba(0,0,0,.16) !important;
    background: #0a1627 !important;
}

body.sphere-app-body .sp-hero::after {
    background:
        linear-gradient(90deg,
            rgba(4,11,23,.26) 0%,
            rgba(4,11,23,.12) 34%,
            rgba(4,11,23,.02) 68%,
            rgba(4,11,23,.03) 100%),
        linear-gradient(0deg,
            rgba(4,11,23,.10) 0%,
            rgba(4,11,23,.00) 48%,
            rgba(4,11,23,.00) 100%) !important;
}

body.sphere-app-body .sp-hero-copy-stack {
    min-height: 560px !important;
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: flex-start !important;
}

body.sphere-app-body .sp-hero-inner {
    max-width: 700px !important;
    padding: 42px 38px 168px !important;
    position: relative !important;
    z-index: 3 !important;
}

body.sphere-app-body .sp-hero .sp-kicker {
    background: rgba(6,20,38,.38) !important;
    border-color: rgba(245,183,59,.44) !important;
    color: #f5b73b !important;
}

/* Restore premium title colors */
body.sphere-app-body .sp-hero h1,
body.sphere-app-body .sp-hero h1 * {
    background: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    filter: none !important;
}

body.sphere-app-body .sp-hero h1 {
    color: #fff4dc !important;
    font-size: clamp(44px, 4.1vw, 64px) !important;
    line-height: .96 !important;
    letter-spacing: -.045em !important;
    text-shadow: 0 12px 28px rgba(0,0,0,.32) !important;
}

body.sphere-app-body .sp-hero h1 span {
    display: block !important;
    color: #f5b73b !important;
    font-size: .92em !important;
    line-height: .96 !important;
    text-shadow: 0 10px 24px rgba(0,0,0,.26) !important;
}

body.sphere-app-body .sp-hero p {
    max-width: 600px !important;
    color: #fff8ea !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    background: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-shadow: 0 4px 14px rgba(0,0,0,.24) !important;
}

body.sphere-app-body .sp-hero .sp-btn.gold {
    position: relative !important;
    z-index: 7 !important;
    margin-top: 6px !important;
}

/* Paginator arriba */
body.sphere-app-body .sp-hero .sp-hero-dots {
    position: absolute !important;
    top: 22px !important;
    right: 24px !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 8 !important;
    display: flex !important;
    gap: 7px !important;
    align-items: center !important;
}

body.sphere-app-body .sp-hero .sp-hero-dots button {
    width: 9px !important;
    height: 9px !important;
    border-radius: 999px !important;
    background: rgba(255,244,220,.55) !important;
    border: 1px solid rgba(245,183,59,.45) !important;
}

body.sphere-app-body .sp-hero .sp-hero-dots button.is-active {
    width: 30px !important;
    background: #f5b73b !important;
}

/* Stats */
body.sphere-app-body .sp-hero .sp-stats {
    position: absolute !important;
    left: 18px !important;
    right: 18px !important;
    bottom: 18px !important;
    z-index: 5 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

body.sphere-app-body .sp-hero .sp-stat {
    min-width: 0 !important;
    min-height: 76px !important;
    padding: 14px 16px !important;
    border-radius: 22px !important;
    border: 1px solid rgba(245,183,59,.20) !important;
    background:
        radial-gradient(circle at 88% 12%, rgba(245,183,59,.12), transparent 34%),
        linear-gradient(180deg, rgba(8,20,35,.58), rgba(8,20,35,.42)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 10px 24px rgba(0,0,0,.14) !important;
    backdrop-filter: blur(8px) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 4px !important;
    overflow: hidden !important;
}

body.sphere-app-body .sp-hero .sp-stat b {
    color: #f5b73b !important;
    opacity: 1 !important;
    font-size: clamp(20px, 2vw, 30px) !important;
    line-height: .95 !important;
    font-weight: 1000 !important;
}

body.sphere-app-body .sp-hero .sp-stat span {
    color: #fff6e5 !important;
    opacity: 1 !important;
    font-size: 11.5px !important;
    line-height: 1.18 !important;
    font-weight: 900 !important;
    white-space: normal !important;
}


/* FIX_VISIBILITY_BOOST_BANNER_PADDING_V1 */
body.sphere-app-body .sp-marketplace-boost-banner {
    width: 100% !important;
    max-width: none !important;
    margin: 18px 0 0 !important;
    padding: 30px 34px !important;
    border-radius: 30px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

body.sphere-app-body .sp-marketplace-boost-banner .sp-kicker,
body.sphere-app-body .sp-marketplace-boost-banner > span {
    display: inline-flex !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    color: #f5b73b !important;
}

body.sphere-app-body .sp-marketplace-boost-banner h2,
body.sphere-app-body .sp-marketplace-boost-banner h3,
body.sphere-app-body .sp-marketplace-boost-banner p {
    max-width: 760px !important;
}

@media (max-width: 620px) {
    body.sphere-app-body .sp-marketplace-boost-banner {
        padding: 24px 22px !important;
        border-radius: 26px !important;
    }
}


/* Real buttons */
body.sphere-app-body .sp-home-connect,
body.sphere-app-body .sp-sphere-connect-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 100% !important;
    min-height: 34px !important;
    padding: 9px 15px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,209,102,.42) !important;
    background: linear-gradient(135deg, #ffd166 0%, #f5b73b 54%, #b7791f 100%) !important;
    color: #061426 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    text-decoration: none !important;
    box-shadow: 0 10px 24px rgba(183,121,31,.16) !important;
    white-space: nowrap !important;
    position: static !important;
    transform: none !important;
}

body.sphere-app-body .sp-home-person {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 10px 14px !important;
    align-items: start !important;
    padding: 16px 0 !important;
}

body.sphere-app-body .sp-home-person .sp-home-connect {
    grid-column: 2 !important;
    justify-self: start !important;
    margin-top: 8px !important;
}

body.sphere-app-body .sp-sphere-person-card {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 16px !important;
    align-items: start !important;
    min-height: 170px !important;
    padding: 20px !important;
    overflow: hidden !important;
}

body.sphere-app-body .sp-sphere-connect-btn {
    grid-column: 2 !important;
    justify-self: start !important;
    margin-top: 12px !important;
}

/* Mobile */

@media (max-width: 620px) {
    body.sphere-app-body .sp-main {
        width: min(100% - 16px, 480px) !important;
    }

    /* HERO MOBILE: banner image clean, no dark opacity layer */
    body.sphere-app-body .sp-hero {
        border-radius: 30px !important;
        overflow: hidden !important;
        background: transparent !important;
        box-shadow: 0 18px 42px rgba(92,64,16,.16) !important;
    }

    body.sphere-app-body .sp-hero::after {
        background: none !important;
        opacity: 0 !important;
        display: none !important;
    }

    body.sphere-app-body .sp-hero-bg-stack,
    body.sphere-app-body .sp-hero-bg-slide {
        filter: none !important;
        opacity: 1 !important;
    }

    body.sphere-app-body .sp-hero-copy-stack {
        min-height: 500px !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: stretch !important;
        padding: 0 !important;
    }

    body.sphere-app-body .sp-hero-inner {
        width: calc(100% - 36px) !important;
        max-width: none !important;
        margin: 22px 18px 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        background-image: none !important;
        backdrop-filter: none !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    body.sphere-app-body .sp-hero .sp-kicker {
        width: fit-content !important;
        max-width: 100% !important;
        margin: 0 0 10px !important;
        padding: 7px 11px !important;
        border-radius: 999px !important;
        border: 1px solid rgba(245,183,59,.48) !important;
        background: rgba(6,20,38,.26) !important;
        backdrop-filter: none !important;
        color: #f5b73b !important;
        font-size: 9.5px !important;
        letter-spacing: .12em !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.18) !important;
    }

    body.sphere-app-body .sp-hero h1 {
        margin: 0 0 10px !important;
        padding: 0 !important;
        background: transparent !important;
        color: #fff4dc !important;
        font-size: clamp(29px, 7.4vw, 39px) !important;
        line-height: .98 !important;
        letter-spacing: -.035em !important;
        text-shadow:
            0 2px 3px rgba(0,0,0,.34),
            0 8px 18px rgba(0,0,0,.20) !important;
        overflow: visible !important;
    }

    body.sphere-app-body .sp-hero h1 span {
        display: block !important;
        color: #f5b73b !important;
        -webkit-text-fill-color: #f5b73b !important;
        font-size: .92em !important;
        line-height: .98 !important;
        text-shadow:
            0 2px 3px rgba(0,0,0,.30),
            0 8px 16px rgba(0,0,0,.16) !important;
    }

    body.sphere-app-body .sp-hero p {
        max-width: 92% !important;
        margin: 0 0 14px !important;
        padding: 0 !important;
        background: transparent !important;
        color: #fff8ea !important;
        font-size: 13px !important;
        line-height: 1.42 !important;
        text-shadow:
            0 2px 3px rgba(0,0,0,.34),
            0 8px 18px rgba(0,0,0,.18) !important;
    }

    body.sphere-app-body .sp-hero-actions {
        margin-top: 0 !important;
    }

    body.sphere-app-body .sp-hero .sp-btn.gold {
        min-height: 42px !important;
        padding: 12px 16px !important;
        font-size: 12.5px !important;
        position: relative !important;
        z-index: 9 !important;
        box-shadow: 0 10px 22px rgba(183,121,31,.20) !important;
    }

    body.sphere-app-body .sp-hero .sp-hero-dots {
        top: 14px !important;
        right: 16px !important;
        bottom: auto !important;
        left: auto !important;
        z-index: 10 !important;
        padding: 0 !important;
        background: transparent !important;
        backdrop-filter: none !important;
    }

    body.sphere-app-body .sp-hero .sp-hero-dots button {
        width: 8px !important;
        height: 8px !important;
        background: rgba(255,244,220,.75) !important;
        border: 1px solid rgba(245,183,59,.60) !important;
    }

    body.sphere-app-body .sp-hero .sp-hero-dots button.is-active {
        width: 24px !important;
        background: #f5b73b !important;
    }

    /* Stats: keep them below the visual area, with minimal background */
    body.sphere-app-body .sp-hero .sp-stats {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        z-index: 3 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: auto !important;
        margin: 0 !important;
        padding: 10px 12px 76px !important;
        background: transparent !important;
        border-top: 0 !important;
        box-shadow: none !important;
    }

    body.sphere-app-body .sp-hero .sp-stat {
        min-height: 56px !important;
        padding: 9px 10px !important;
        border-radius: 16px !important;
        align-items: center !important;
        text-align: center !important;
        border: 1px solid rgba(245,183,59,.18) !important;
        background: rgba(6,20,38,.18) !important;
        backdrop-filter: none !important;
        box-shadow: none !important;
    }

    body.sphere-app-body .sp-hero .sp-stat b {
        font-size: 19px !important;
        color: #f5b73b !important;
    }

    body.sphere-app-body .sp-hero .sp-stat span {
        font-size: 9.8px !important;
        line-height: 1.12 !important;
        color: #fff6e5 !important;
    }

    /* Feed post action buttons: no overlap, no clipped labels */
    body.sphere-app-body .sp-social-post-actions,
    body.sphere-app-body .sp-home-feed-post .sp-social-post-actions {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
        padding: 10px 12px 14px !important;
        align-items: stretch !important;
        overflow: visible !important;
    }

    body.sphere-app-body .sp-social-post-actions a,
    body.sphere-app-body .sp-social-post-actions button,
    body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
    body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button {
        min-width: 0 !important;
        width: 100% !important;
        min-height: 38px !important;
        padding: 8px 7px !important;
        border-radius: 999px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
        font-size: 11px !important;
        line-height: 1.08 !important;
        text-align: center !important;
    }
}

/* HOME_HERO_FINAL_CLEAN_RESPONSIVE_V1
   Single final layer after cleanup:
   - removes duplicated later hero patches
   - keeps desktop premium
   - mobile image clean
   - mobile stats below visual area
   - feed actions readable
   - visibility banner padded
*/

/* Desktop / laptop hero stability */
html body.sphere-app-body .sp-hero.sp-hero-filament {
    isolation: isolate !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament h1 {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    background: none !important;
    overflow: visible !important;
    max-height: none !important;
    line-height: .96 !important;
    text-shadow: 0 12px 28px rgba(0,0,0,.34) !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament h1 > span {
    display: block !important;
    color: #f5b73b !important;
    -webkit-text-fill-color: #f5b73b !important;
    background: none !important;
    overflow: visible !important;
    max-height: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-shadow: 0 10px 24px rgba(0,0,0,.28) !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-dots {
    top: 22px !important;
    right: 24px !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 12 !important;
}

/* Mobile hero: clean banner, stats below image area */
@media (max-width: 620px) {
    html body.sphere-app-body {
        padding-bottom: 82px !important;
    }

    html body.sphere-app-body .sp-main {
        width: min(100% - 16px, 480px) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament {
        display: flex !important;
        flex-direction: column !important;
        overflow: visible !important;
        border-radius: 30px !important;
        background: transparent !important;
        box-shadow: none !important;
        border: 0 !important;
        margin-bottom: 18px !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament::after {
        display: none !important;
        opacity: 0 !important;
        background: none !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-stack {
        position: relative !important;
        inset: auto !important;
        display: block !important;
        width: 100% !important;
        min-height: 430px !important;
        border-radius: 30px !important;
        overflow: hidden !important;
        background: #071321 !important;
        box-shadow: 0 18px 42px rgba(92,64,16,.16) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-slide {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        opacity: 1 !important;
        filter: none !important;
        background-size: cover !important;
        background-position: center top !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-stack {
        position: absolute !important;
        inset: 0 !important;
        z-index: 4 !important;
        min-height: 430px !important;
        padding: 0 !important;
        pointer-events: none !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-slide {
        pointer-events: none !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner {
        width: calc(100% - 34px) !important;
        max-width: none !important;
        margin: 18px 17px 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        pointer-events: auto !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-kicker {
        width: fit-content !important;
        max-width: calc(100% - 72px) !important;
        margin: 0 0 10px !important;
        padding: 7px 11px !important;
        border-radius: 999px !important;
        border: 1px solid rgba(245,183,59,.48) !important;
        background: rgba(6,20,38,.30) !important;
        color: #f5b73b !important;
        font-size: 9.5px !important;
        line-height: 1.15 !important;
        letter-spacing: .11em !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.22) !important;
        white-space: normal !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament h1 {
        max-width: 92% !important;
        margin: 0 0 10px !important;
        color: #fff4dc !important;
        -webkit-text-fill-color: #fff4dc !important;
        font-size: clamp(30px, 7.5vw, 40px) !important;
        line-height: .98 !important;
        letter-spacing: -.035em !important;
        background: transparent !important;
        text-shadow:
            0 2px 4px rgba(0,0,0,.36),
            0 10px 22px rgba(0,0,0,.18) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament h1 > span {
        display: block !important;
        color: #f5b73b !important;
        -webkit-text-fill-color: #f5b73b !important;
        font-size: .92em !important;
        line-height: .98 !important;
        visibility: visible !important;
        opacity: 1 !important;
        text-shadow:
            0 2px 4px rgba(0,0,0,.32),
            0 8px 18px rgba(0,0,0,.16) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament p {
        max-width: 86% !important;
        margin: 0 0 14px !important;
        color: #fff8ea !important;
        font-size: 13px !important;
        line-height: 1.42 !important;
        background: transparent !important;
        text-shadow:
            0 2px 4px rgba(0,0,0,.36),
            0 8px 18px rgba(0,0,0,.16) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions {
        max-width: 86% !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold {
        min-height: 38px !important;
        padding: 10px 14px !important;
        border-radius: 999px !important;
        font-size: 12px !important;
        line-height: 1.1 !important;
        white-space: normal !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-dots {
        top: 18px !important;
        right: 18px !important;
        left: auto !important;
        bottom: auto !important;
        z-index: 9 !important;
        padding: 5px 6px !important;
        border-radius: 999px !important;
        background: rgba(6,20,38,.24) !important;
        backdrop-filter: none !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        z-index: 2 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: calc(100% - 18px) !important;
        margin: 10px auto 0 !important;
        padding: 12px !important;
        border-radius: 24px !important;
        border: 1px solid rgba(245,183,59,.22) !important;
        background: linear-gradient(180deg, #081423, #0b1a2a) !important;
        box-shadow:
            0 16px 34px rgba(0,0,0,.10),
            inset 0 1px 0 rgba(255,255,255,.04) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat {
        min-height: 68px !important;
        padding: 12px 10px !important;
        border-radius: 18px !important;
        background:
            radial-gradient(circle at 90% 10%, rgba(245,183,59,.13), transparent 34%),
            linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)) !important;
        border: 1px solid rgba(245,183,59,.16) !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        overflow: hidden !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat b {
        color: #f5b73b !important;
        font-size: 21px !important;
        line-height: 1 !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat span {
        color: #fff6e5 !important;
        font-size: 10.5px !important;
        line-height: 1.2 !important;
        white-space: normal !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        align-items: stretch !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button {
        width: 100% !important;
        min-height: 40px !important;
        justify-content: center !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.15 !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner {
        padding: 24px 22px !important;
        border-radius: 26px !important;
        overflow: visible !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner h2,
    html body.sphere-app-body .sp-marketplace-boost-banner h3 {
        line-height: 1.08 !important;
        overflow-wrap: anywhere !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner p {
        line-height: 1.45 !important;
        overflow-wrap: anywhere !important;
    }
}

/* Keep sidebars non-sticky */
html body.sphere-app-body .sp-left,
html body.sphere-app-body .sp-right {
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* HOME_LUXURY_ATTENTION_FINAL_V1_START
   Controlled premium visual layer:
   - does not touch Blade
   - does not touch Marketplace
   - keeps previous responsive cleanup
   - adds luxury depth, gold glow, better cards and stronger visual hierarchy
*/

:root {
    --cc-home-gold-glow: rgba(245,183,59,.34);
    --cc-home-gold-soft: rgba(245,183,59,.16);
    --cc-home-cream-glow: rgba(255,248,234,.12);
    --cc-home-deep-1: #050b14;
    --cc-home-deep-2: #071321;
    --cc-home-deep-3: #0b1a2a;
}

/* Premium page atmosphere */
html body.sphere-app-body .sp-page {
    background:
        radial-gradient(circle at 12% 4%, rgba(245,183,59,.14), transparent 30%),
        radial-gradient(circle at 88% 8%, rgba(255,248,234,.08), transparent 26%),
        radial-gradient(circle at 50% 56%, rgba(245,183,59,.055), transparent 36%),
        linear-gradient(180deg, #050b14 0%, #071321 42%, #040a13 100%) !important;
}

html.light body.sphere-app-body .sp-page,
html[data-theme="light"] body.sphere-app-body .sp-page,
body.light.sphere-app-body .sp-page,
body[data-theme="light"].sphere-app-body .sp-page {
    background:
        radial-gradient(circle at 12% 4%, rgba(217,154,33,.18), transparent 32%),
        radial-gradient(circle at 88% 7%, rgba(255,255,255,.78), transparent 28%),
        linear-gradient(180deg, #f7ecd8 0%, #fff8ea 45%, #f3e4c8 100%) !important;
}

/* Hero: stronger luxury frame, without hiding image */
html body.sphere-app-body .sp-hero.sp-hero-filament {
    border: 1px solid rgba(245,183,59,.38) !important;
    box-shadow:
        0 34px 92px rgba(0,0,0,.30),
        0 0 0 1px rgba(255,248,234,.045) inset,
        0 0 54px rgba(245,183,59,.13) !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    background:
        radial-gradient(circle at 18% 18%, rgba(255,209,102,.22), transparent 26%),
        linear-gradient(115deg, transparent 0%, rgba(255,255,255,.06) 42%, transparent 58%) !important;
    opacity: .85 !important;
    mix-blend-mode: screen !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner {
    z-index: 5 !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-kicker {
    box-shadow:
        0 10px 26px rgba(0,0,0,.16),
        0 0 24px rgba(245,183,59,.16) !important;
    text-transform: uppercase !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament h1 {
    text-shadow:
        0 2px 0 rgba(255,255,255,.035),
        0 16px 38px rgba(0,0,0,.42),
        0 0 32px rgba(245,183,59,.12) !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament h1 > span {
    text-shadow:
        0 2px 0 rgba(255,255,255,.06),
        0 12px 30px rgba(0,0,0,.36),
        0 0 30px rgba(245,183,59,.30) !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold,
html body.sphere-app-body .sp-home-connect,
html body.sphere-app-body .sp-sphere-connect-btn {
    box-shadow:
        0 14px 30px rgba(183,121,31,.24),
        0 0 0 1px rgba(255,255,255,.12) inset,
        0 0 24px rgba(245,183,59,.22) !important;
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        filter .22s ease !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold:hover,
html body.sphere-app-body .sp-home-connect:hover,
html body.sphere-app-body .sp-sphere-connect-btn:hover {
    transform: translateY(-2px) !important;
    filter: saturate(1.08) brightness(1.04) !important;
    box-shadow:
        0 18px 38px rgba(183,121,31,.30),
        0 0 0 1px rgba(255,255,255,.16) inset,
        0 0 34px rgba(245,183,59,.28) !important;
}

/* Stats: premium glass */
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat {
    border-color: rgba(245,183,59,.28) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 14px 30px rgba(0,0,0,.16),
        0 0 24px rgba(245,183,59,.08) !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat b {
    text-shadow: 0 0 22px rgba(245,183,59,.22) !important;
}

/* Section headers: make the home feel editorial and premium */
html body.sphere-app-body .sp-center section,
html body.sphere-app-body .sp-home-feed-room,
html body.sphere-app-body .sp-marketplace-boost-banner {
    position: relative !important;
}

html body.sphere-app-body .sp-center section::before,
html body.sphere-app-body .sp-home-feed-room::before,
html body.sphere-app-body .sp-marketplace-boost-banner::before {
    content: "" !important;
    position: absolute !important;
    left: 24px !important;
    right: 24px !important;
    top: 0 !important;
    height: 1px !important;
    pointer-events: none !important;
    background: linear-gradient(90deg, transparent, rgba(245,183,59,.46), rgba(255,248,234,.18), transparent) !important;
    opacity: .75 !important;
}

html body.sphere-app-body .sp-section-head h2,
html body.sphere-app-body .sp-home-feed-head h2,
html body.sphere-app-body .sp-marketplace-boost-banner h2,
html body.sphere-app-body .sp-marketplace-boost-banner h3 {
    letter-spacing: -.035em !important;
    text-wrap: balance !important;
}

/* Premium cards across home */
html body.sphere-app-body .sp-sphere-person-card,
html body.sphere-app-body .sp-home-person,
html body.sphere-app-body .sp-home-feed-post,
html body.sphere-app-body .sp-opportunity,
html body.sphere-app-body .sp-panel,
html body.sphere-app-body .sp-card {
    border-color: rgba(245,183,59,.18) !important;
    box-shadow:
        0 18px 46px rgba(0,0,0,.14),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html body.sphere-app-body .sp-sphere-person-card,
html body.sphere-app-body .sp-home-feed-post,
html body.sphere-app-body .sp-opportunity {
    background:
        radial-gradient(circle at 90% 8%, rgba(245,183,59,.09), transparent 28%),
        linear-gradient(180deg, rgba(13,28,47,.94), rgba(7,19,33,.92)) !important;
}

html.light body.sphere-app-body .sp-sphere-person-card,
html.light body.sphere-app-body .sp-home-feed-post,
html.light body.sphere-app-body .sp-opportunity,
html[data-theme="light"] body.sphere-app-body .sp-sphere-person-card,
html[data-theme="light"] body.sphere-app-body .sp-home-feed-post,
html[data-theme="light"] body.sphere-app-body .sp-opportunity {
    background:
        radial-gradient(circle at 90% 8%, rgba(217,154,33,.14), transparent 30%),
        linear-gradient(180deg, #fffdf8, #fff4df) !important;
    box-shadow:
        0 18px 44px rgba(92,64,16,.12),
        inset 0 1px 0 rgba(255,255,255,.90) !important;
}

/* People cards: more presence */
html body.sphere-app-body .sp-sphere-person-card {
    transform: translateZ(0) !important;
    transition:
        transform .24s ease,
        box-shadow .24s ease,
        border-color .24s ease !important;
}

html body.sphere-app-body .sp-sphere-person-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(245,183,59,.34) !important;
    box-shadow:
        0 24px 58px rgba(0,0,0,.20),
        0 0 34px rgba(245,183,59,.12),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Marketplace / opportunity cards: premium commercial feeling */
html body.sphere-app-body .sp-opportunity {
    overflow: hidden !important;
}

html body.sphere-app-body .sp-opportunity::after {
    content: "" !important;
    position: absolute !important;
    inset: auto 18px 0 18px !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(245,183,59,.34), transparent) !important;
    pointer-events: none !important;
}

/* Visibility banner: make it a strong conversion piece */
html body.sphere-app-body .sp-marketplace-boost-banner {
    border: 1px solid rgba(245,183,59,.36) !important;
    background:
        radial-gradient(circle at 12% 18%, rgba(245,183,59,.24), transparent 28%),
        radial-gradient(circle at 92% 22%, rgba(255,248,234,.12), transparent 26%),
        linear-gradient(135deg, #071321 0%, #102337 46%, #5b3a09 120%) !important;
    box-shadow:
        0 28px 70px rgba(0,0,0,.22),
        0 0 38px rgba(245,183,59,.12),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner .sp-btn,
html body.sphere-app-body .sp-marketplace-boost-banner a {
    position: relative !important;
    z-index: 2 !important;
}

/* Feed: more social, less flat */
html body.sphere-app-body .sp-home-feed-room {
    border-color: rgba(245,183,59,.22) !important;
    box-shadow:
        0 24px 64px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html body.sphere-app-body .sp-home-feed-head > a {
    box-shadow:
        0 12px 28px rgba(183,121,31,.18),
        inset 0 1px 0 rgba(255,255,255,.14) !important;
}

html body.sphere-app-body .sp-social-post-actions a,
html body.sphere-app-body .sp-social-post-actions button {
    border-color: rgba(245,183,59,.20) !important;
    transition:
        transform .2s ease,
        border-color .2s ease,
        background .2s ease !important;
}

html body.sphere-app-body .sp-social-post-actions a:hover,
html body.sphere-app-body .sp-social-post-actions button:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(245,183,59,.36) !important;
    background: rgba(245,183,59,.10) !important;
}

/* Right and left panels: polished but not sticky */
html body.sphere-app-body .sp-left,
html body.sphere-app-body .sp-right {
    position: static !important;
}

html body.sphere-app-body .sp-left .sp-panel,
html body.sphere-app-body .sp-right .sp-panel,
html body.sphere-app-body .sp-right .sp-visibility {
    border-color: rgba(245,183,59,.18) !important;
    box-shadow:
        0 18px 42px rgba(0,0,0,.13),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* Subtle luxury motion, disabled for reduced motion users */
@media (prefers-reduced-motion: no-preference) {
    html body.sphere-app-body .sp-hero.sp-hero-filament::before {
        animation: ccHomeHeroGlow 7.5s ease-in-out infinite alternate !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat b {
        animation: ccHomeGoldPulse 4.8s ease-in-out infinite !important;
    }
}

@keyframes ccHomeHeroGlow {
    0% {
        opacity: .56;
        transform: translateX(-1.5%);
    }
    100% {
        opacity: .92;
        transform: translateX(1.5%);
    }
}

@keyframes ccHomeGoldPulse {
    0%, 100% {
        text-shadow: 0 0 14px rgba(245,183,59,.18);
    }
    50% {
        text-shadow: 0 0 30px rgba(245,183,59,.38);
    }
}

/* Mobile: keep luxury but avoid covering content */
@media (max-width: 620px) {
    html body.sphere-app-body .sp-page {
        background:
            radial-gradient(circle at 12% 2%, rgba(245,183,59,.16), transparent 28%),
            linear-gradient(180deg, #050b14 0%, #071321 48%, #040a13 100%) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament {
        border: 0 !important;
        box-shadow: none !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament::before {
        display: none !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-stack {
        border: 1px solid rgba(245,183,59,.28) !important;
        box-shadow:
            0 18px 42px rgba(0,0,0,.18),
            0 0 28px rgba(245,183,59,.10) !important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats {
        border-color: rgba(245,183,59,.26) !important;
        box-shadow:
            0 18px 38px rgba(0,0,0,.16),
            inset 0 1px 0 rgba(255,255,255,.05) !important;
    }

    html body.sphere-app-body .sp-section-head h2,
    html body.sphere-app-body .sp-home-feed-head h2,
    html body.sphere-app-body .sp-marketplace-boost-banner h2,
    html body.sphere-app-body .sp-marketplace-boost-banner h3 {
        font-size: clamp(24px, 7vw, 32px) !important;
        line-height: 1.05 !important;
    }

    html body.sphere-app-body .sp-sphere-person-card:hover {
        transform: none !important;
    }

    html body.sphere-app-body .sp-center section::before,
    html body.sphere-app-body .sp-home-feed-room::before,
    html body.sphere-app-body .sp-marketplace-boost-banner::before {
        left: 18px !important;
        right: 18px !important;
    }
}

/* HOME_LUXURY_ATTENTION_FINAL_V1_END */

/* HOME_VISIBILITY_BANNER_LUXURY_FIX_V1_START
   Fix contrast and premium look for "Impulsa tus oportunidades de negocio"
*/

html body.sphere-app-body .sp-marketplace-boost-banner {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    padding: 34px 38px !important;
    border-radius: 30px !important;
    border: 1px solid rgba(245,183,59,.44) !important;
    background:
        radial-gradient(circle at 18% 20%, rgba(245,183,59,.30), transparent 30%),
        radial-gradient(circle at 88% 16%, rgba(255,248,234,.12), transparent 26%),
        linear-gradient(135deg, #071321 0%, #0b1a2a 48%, #4a310c 100%) !important;
    box-shadow:
        0 28px 70px rgba(0,0,0,.24),
        0 0 42px rgba(245,183,59,.16),
        inset 0 1px 0 rgba(255,255,255,.08) !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background:
        linear-gradient(110deg, transparent 0%, rgba(255,255,255,.08) 42%, transparent 58%),
        radial-gradient(circle at 70% 100%, rgba(245,183,59,.18), transparent 36%) !important;
    opacity: .75 !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner .sp-kicker,
html body.sphere-app-body .sp-marketplace-boost-banner > span {
    color: #f5b73b !important;
    -webkit-text-fill-color: #f5b73b !important;
    opacity: 1 !important;
    font-weight: 900 !important;
    letter-spacing: .06em !important;
    text-shadow: 0 0 18px rgba(245,183,59,.26) !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner h2,
html body.sphere-app-body .sp-marketplace-boost-banner h3 {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    opacity: 1 !important;
    font-weight: 1000 !important;
    letter-spacing: -.035em !important;
    text-shadow:
        0 2px 0 rgba(255,255,255,.04),
        0 14px 34px rgba(0,0,0,.38),
        0 0 24px rgba(245,183,59,.14) !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner p {
    color: #f7e6c5 !important;
    -webkit-text-fill-color: #f7e6c5 !important;
    opacity: .96 !important;
    font-weight: 650 !important;
    line-height: 1.55 !important;
    text-shadow: 0 8px 22px rgba(0,0,0,.26) !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner a,
html body.sphere-app-body .sp-marketplace-boost-banner .sp-btn {
    border: 1px solid rgba(255,226,142,.55) !important;
    background: linear-gradient(135deg, #ffe29a 0%, #f5b73b 50%, #b7791f 100%) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-weight: 1000 !important;
    box-shadow:
        0 16px 34px rgba(183,121,31,.30),
        0 0 0 1px rgba(255,255,255,.16) inset,
        0 0 28px rgba(245,183,59,.26) !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner a:hover,
html body.sphere-app-body .sp-marketplace-boost-banner .sp-btn:hover {
    transform: translateY(-2px) !important;
    filter: brightness(1.05) saturate(1.08) !important;
}

@media (max-width: 620px) {
    html body.sphere-app-body .sp-marketplace-boost-banner {
        padding: 26px 22px !important;
        border-radius: 26px !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner h2,
    html body.sphere-app-body .sp-marketplace-boost-banner h3 {
        font-size: clamp(24px, 7vw, 31px) !important;
        line-height: 1.06 !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner p {
        font-size: 14px !important;
    }
}

/* HOME_VISIBILITY_BANNER_LUXURY_FIX_V1_END */

/* HOME_ROOM_SOCIAL_PREMIUM_V1_START
   Sala/feed refinement:
   - more premium social card
   - actions more like LinkedIn / Facebook
   - cleaner avatar/header/meta
   - improved visibility banner
*/

/* Feed room wrapper */
html body.sphere-app-body .sp-home-feed-room {
    border: 1px solid rgba(217,154,33,.16) !important;
    border-radius: 28px !important;
    background: linear-gradient(180deg, rgba(255,252,246,.98), rgba(246,238,221,.98)) !important;
    box-shadow:
        0 18px 42px rgba(92,64,16,.10),
        inset 0 1px 0 rgba(255,255,255,.92) !important;
    overflow: hidden !important;
}

/* Post card */
html body.sphere-app-body .sp-home-feed-post {
    border: 1px solid rgba(217,154,33,.14) !important;
    border-radius: 24px !important;
    background: linear-gradient(180deg, #fffdfa 0%, #f8f1e2 100%) !important;
    box-shadow:
        0 12px 28px rgba(92,64,16,.08),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
    padding: 16px 16px 14px !important;
    overflow: hidden !important;
}

/* Header / person row */
html body.sphere-app-body .sp-home-feed-post .sp-home-feed-avatar,
html body.sphere-app-body .sp-home-feed-avatar {
    width: 52px !important;
    height: 52px !important;
    border-radius: 999px !important;
    border: 2px solid rgba(217,154,33,.62) !important;
    box-shadow:
        0 8px 18px rgba(92,64,16,.16),
        0 0 0 4px rgba(255,255,255,.72) !important;
    overflow: hidden !important;
    flex: 0 0 52px !important;
    background: #fff !important;
}

html body.sphere-app-body .sp-home-feed-post .sp-home-feed-avatar img,
html body.sphere-app-body .sp-home-feed-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

html body.sphere-app-body .sp-home-feed-post h3,
html body.sphere-app-body .sp-home-feed-post h4,
html body.sphere-app-body .sp-home-feed-post strong {
    color: #1f2937 !important;
    font-weight: 900 !important;
    letter-spacing: -.02em !important;
}

html body.sphere-app-body .sp-home-feed-post .sp-home-feed-head,
html body.sphere-app-body .sp-home-feed-head {
    gap: 12px !important;
    align-items: center !important;
}

html body.sphere-app-body .sp-home-feed-post .sp-home-feed-head p,
html body.sphere-app-body .sp-home-feed-post .sp-home-feed-head span,
html body.sphere-app-body .sp-home-feed-post small {
    color: #667085 !important;
    opacity: 1 !important;
    font-weight: 500 !important;
}

/* Post media/logo area */
html body.sphere-app-body .sp-home-feed-post img,
html body.sphere-app-body .sp-home-feed-post .sp-post-image,
html body.sphere-app-body .sp-home-feed-post .sp-post-media {
    border-radius: 18px !important;
    overflow: hidden !important;
}

/* Reactions / meta row */
html body.sphere-app-body .sp-home-feed-post .sp-post-meta,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-meta,
html body.sphere-app-body .sp-home-feed-post .sp-post-stats {
    color: #667085 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    border-top: 1px solid rgba(217,154,33,.10) !important;
    border-bottom: 1px solid rgba(217,154,33,.10) !important;
}

/* Social action area like LinkedIn/Facebook */
html body.sphere-app-body .sp-social-post-actions,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 12px !important;
    padding-top: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

html body.sphere-app-body .sp-social-post-actions a,
html body.sphere-app-body .sp-social-post-actions button,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button {
    min-height: 42px !important;
    padding: 10px 12px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(217,154,33,.16) !important;
    background: linear-gradient(180deg, #ffffff 0%, #f7f2e7 100%) !important;
    color: #344054 !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    text-align: center !important;
    justify-content: center !important;
    box-shadow:
        0 6px 16px rgba(92,64,16,.06),
        inset 0 1px 0 rgba(255,255,255,.98) !important;
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease,
        background .18s ease !important;
}

html body.sphere-app-body .sp-social-post-actions a:hover,
html body.sphere-app-body .sp-social-post-actions button:hover,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a:hover,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(217,154,33,.34) !important;
    background: linear-gradient(180deg, #fffaf0 0%, #f6ead1 100%) !important;
    color: #1f2937 !important;
    box-shadow:
        0 10px 22px rgba(92,64,16,.10),
        0 0 0 1px rgba(255,255,255,.98) inset !important;
}

/* Feed title area cleaner */
html body.sphere-app-body .sp-home-feed-head h2 {
    color: #1f2937 !important;
    font-weight: 1000 !important;
    letter-spacing: -.03em !important;
}

html body.sphere-app-body .sp-home-feed-head p {
    color: #667085 !important;
    font-weight: 500 !important;
}

/* CTA button in feed header */
html body.sphere-app-body .sp-home-feed-head > a {
    border: 1px solid rgba(217,154,33,.24) !important;
    background: linear-gradient(135deg, #ffe29a 0%, #f5b73b 55%, #b7791f 100%) !important;
    color: #071321 !important;
    font-weight: 900 !important;
    box-shadow:
        0 10px 24px rgba(183,121,31,.14),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
}

/* Visibility banner: cleaner and more premium/social */
html body.sphere-app-body .sp-marketplace-boost-banner {
    position: relative !important;
    overflow: hidden !important;
    border: 1px solid rgba(217,154,33,.18) !important;
    border-radius: 28px !important;
    padding: 30px 34px !important;
    background:
        radial-gradient(circle at 18% 20%, rgba(217,154,33,.14), transparent 28%),
        linear-gradient(135deg, #fff9ef 0%, #f8edd8 52%, #f2e2bc 100%) !important;
    box-shadow:
        0 18px 42px rgba(92,64,16,.10),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(110deg, transparent 0%, rgba(255,255,255,.28) 45%, transparent 62%) !important;
    opacity: .6 !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner .sp-kicker,
html body.sphere-app-body .sp-marketplace-boost-banner > span {
    color: #b7791f !important;
    -webkit-text-fill-color: #b7791f !important;
    font-weight: 900 !important;
    letter-spacing: .04em !important;
    opacity: 1 !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner h2,
html body.sphere-app-body .sp-marketplace-boost-banner h3 {
    color: #1f2937 !important;
    -webkit-text-fill-color: #1f2937 !important;
    font-weight: 1000 !important;
    letter-spacing: -.03em !important;
    line-height: 1.05 !important;
    text-wrap: balance !important;
    text-shadow: none !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner p {
    color: #475467 !important;
    -webkit-text-fill-color: #475467 !important;
    font-weight: 550 !important;
    line-height: 1.55 !important;
    max-width: 760px !important;
    text-shadow: none !important;
}

html body.sphere-app-body .sp-marketplace-boost-banner a,
html body.sphere-app-body .sp-marketplace-boost-banner .sp-btn {
    border: 1px solid rgba(217,154,33,.24) !important;
    background: linear-gradient(135deg, #ffe29a 0%, #f5b73b 55%, #b7791f 100%) !important;
    color: #071321 !important;
    font-weight: 1000 !important;
    box-shadow:
        0 12px 28px rgba(183,121,31,.16),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
}

/* Mobile */
@media (max-width: 620px) {
    html body.sphere-app-body .sp-home-feed-room {
        border-radius: 22px !important;
    }

    html body.sphere-app-body .sp-home-feed-post {
        border-radius: 20px !important;
        padding: 14px 14px 12px !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-home-feed-avatar,
    html body.sphere-app-body .sp-home-feed-avatar {
        width: 46px !important;
        height: 46px !important;
        flex-basis: 46px !important;
    }

    html body.sphere-app-body .sp-social-post-actions,
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    html body.sphere-app-body .sp-social-post-actions a,
    html body.sphere-app-body .sp-social-post-actions button,
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button {
        min-height: 40px !important;
        padding: 9px 8px !important;
        font-size: 11.5px !important;
        letter-spacing: -.01em !important;
        white-space: nowrap !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner {
        padding: 24px 22px !important;
        border-radius: 24px !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner h2,
    html body.sphere-app-body .sp-marketplace-boost-banner h3 {
        font-size: clamp(24px, 7vw, 30px) !important;
    }

    html body.sphere-app-body .sp-marketplace-boost-banner p {
        font-size: 14px !important;
    }
}

/* HOME_ROOM_SOCIAL_PREMIUM_V1_END */

/* HOME_FEED_ACTIONS_I18N_FIX_V1_START
   Fix social post action buttons for long languages: RU / FR / IT / AR.
   Mobile-first: avoid cramped LinkedIn-style actions.
*/

html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions,
html body.sphere-app-body .sp-social-post-actions {
    align-items: stretch !important;
}

html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
html body.sphere-app-body .sp-social-post-actions a,
html body.sphere-app-body .sp-social-post-actions button {
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: auto !important;
    text-wrap: balance !important;
    line-height: 1.15 !important;
}

/* Mobile: long translations need breathing room */
@media (max-width: 620px) {
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions,
    html body.sphere-app-body .sp-social-post-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        padding: 0 !important;
        margin-top: 12px !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
    html body.sphere-app-body .sp-social-post-actions a,
    html body.sphere-app-body .sp-social-post-actions button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 9px 10px !important;
        border-radius: 18px !important;
        font-size: 11px !important;
        line-height: 1.12 !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        text-align: center !important;
        justify-content: center !important;
        align-items: center !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions button:nth-child(3) {
        grid-column: 1 / -1 !important;
        max-width: 78% !important;
        justify-self: center !important;
        border-radius: 999px !important;
    }
}

/* Very narrow phones */
@media (max-width: 380px) {
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions,
    html body.sphere-app-body .sp-social-post-actions {
        grid-template-columns: 1fr !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions button:nth-child(3) {
        max-width: 100% !important;
    }
}

/* RTL safety */
html[dir="rtl"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
html[dir="rtl"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
html[dir="rtl"] body.sphere-app-body .sp-social-post-actions a,
html[dir="rtl"] body.sphere-app-body .sp-social-post-actions button {
    direction: rtl !important;
}

/* HOME_FEED_ACTIONS_I18N_FIX_V1_END */

/* HOME_FEED_ACTIONS_I18N_FIX_V1_START
   Fix social post action buttons for long languages: RU / FR / IT / AR.
   Mobile-first: avoid cramped LinkedIn-style actions.
*/

html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions,
html body.sphere-app-body .sp-social-post-actions {
    align-items: stretch !important;
}

html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
html body.sphere-app-body .sp-social-post-actions a,
html body.sphere-app-body .sp-social-post-actions button {
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: auto !important;
    text-wrap: balance !important;
    line-height: 1.15 !important;
}

/* Mobile: long translations need breathing room */
@media (max-width: 620px) {
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions,
    html body.sphere-app-body .sp-social-post-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        padding: 0 !important;
        margin-top: 12px !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
    html body.sphere-app-body .sp-social-post-actions a,
    html body.sphere-app-body .sp-social-post-actions button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 9px 10px !important;
        border-radius: 18px !important;
        font-size: 11px !important;
        line-height: 1.12 !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        text-align: center !important;
        justify-content: center !important;
        align-items: center !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions button:nth-child(3) {
        grid-column: 1 / -1 !important;
        max-width: 78% !important;
        justify-self: center !important;
        border-radius: 999px !important;
    }
}

/* Very narrow phones */
@media (max-width: 380px) {
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions,
    html body.sphere-app-body .sp-social-post-actions {
        grid-template-columns: 1fr !important;
    }

    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions a:nth-child(3),
    html body.sphere-app-body .sp-social-post-actions button:nth-child(3) {
        max-width: 100% !important;
    }
}

/* RTL safety */
html[dir="rtl"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
html[dir="rtl"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
html[dir="rtl"] body.sphere-app-body .sp-social-post-actions a,
html[dir="rtl"] body.sphere-app-body .sp-social-post-actions button {
    direction: rtl !important;
}

/* HOME_FEED_ACTIONS_I18N_FIX_V1_END */

/* HOME_RUSSIAN_LAYOUT_FIX_V1_START
   Fix long translations in Home:
   - RU hero stats do not overflow
   - recommended people buttons do not invade text area
   - right sidebar cards support long labels
   - keeps desktop luxury layout
*/

/* General long-language safety */
html body.sphere-app-body .sp-dashboard,
html body.sphere-app-body .sp-center,
html body.sphere-app-body .sp-left,
html body.sphere-app-body .sp-right,
html body.sphere-app-body .sp-panel,
html body.sphere-app-body .sp-card {
    min-width: 0 !important;
}

/* Hero stats: allow long labels like Russian without breaking */
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats {
    align-items: stretch !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat {
    min-width: 0 !important;
    overflow: hidden !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat span {
    display: block !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: auto !important;
    line-height: 1.16 !important;
}

/* Russian/long locale: hero stats become more breathable on laptop/tablet */
html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat {
    min-height: 70px !important;
    padding: 12px 14px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat b,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat b {
    font-size: clamp(20px, 2vw, 28px) !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat span,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat span {
    font-size: 10.5px !important;
    line-height: 1.18 !important;
}

/* Right sidebar recommended people: prevent button from invading card */
html body.sphere-app-body .sp-right .sp-home-person {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    gap: 10px 12px !important;
    align-items: start !important;
    padding: 16px 14px !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

html body.sphere-app-body .sp-right .sp-home-person > * {
    min-width: 0 !important;
}

html body.sphere-app-body .sp-right .sp-home-person strong,
html body.sphere-app-body .sp-right .sp-home-person b,
html body.sphere-app-body .sp-right .sp-home-person p,
html body.sphere-app-body .sp-right .sp-home-person span {
    max-width: 100% !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: auto !important;
}

html body.sphere-app-body .sp-right .sp-home-person .sp-home-connect,
html body.sphere-app-body .sp-right .sp-home-person .sp-sphere-connect-btn {
    grid-column: 2 !important;
    justify-self: start !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-top: 8px !important;
    padding: 9px 13px !important;
    font-size: 11px !important;
    line-height: 1.12 !important;
    white-space: normal !important;
    text-align: center !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

/* Specific long Russian button labels */
html[lang="ru"] body.sphere-app-body .sp-right .sp-home-person .sp-home-connect,
html[lang^="ru"] body.sphere-app-body .sp-right .sp-home-person .sp-home-connect,
html[lang="ru"] body.sphere-app-body .sp-right .sp-home-person .sp-sphere-connect-btn,
html[lang^="ru"] body.sphere-app-body .sp-right .sp-home-person .sp-sphere-connect-btn {
    max-width: 148px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    font-size: 10.5px !important;
}

/* Recommended people panel spacing */
html body.sphere-app-body .sp-right .sp-panel {
    overflow: hidden !important;
}

html body.sphere-app-body .sp-right .sp-panel h3,
html body.sphere-app-body .sp-right .sp-panel h4 {
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: auto !important;
}

/* Header/nav long language safety without changing desktop structure */
html[lang="ru"] body.sphere-app-body .sp-nav,
html[lang^="ru"] body.sphere-app-body .sp-nav {
    overflow-x: auto !important;
    scrollbar-width: none !important;
}

html[lang="ru"] body.sphere-app-body .sp-nav::-webkit-scrollbar,
html[lang^="ru"] body.sphere-app-body .sp-nav::-webkit-scrollbar {
    display: none !important;
}

html[lang="ru"] body.sphere-app-body .sp-nav a,
html[lang^="ru"] body.sphere-app-body .sp-nav a {
    white-space: nowrap !important;
    flex: 0 0 auto !important;
}

/* Laptop: right sidebar hidden already in many breakpoints, keep center safe */
@media (max-width: 1439px) {
    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Mobile keeps previous two-column stats, with safer labels */
@media (max-width: 620px) {
    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat span {
        font-size: 10px !important;
        line-height: 1.18 !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person .sp-home-connect,
    html body.sphere-app-body .sp-right .sp-home-person .sp-sphere-connect-btn {
        max-width: 100% !important;
    }
}

/* HOME_RUSSIAN_LAYOUT_FIX_V1_END */

/* HOME_HERO_MULTILANG_GOLD_TITLE_CSS_V1_START
   Ensure hero accent title is gold in every locale.
*/

html body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang,
html body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1] {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    overflow: visible !important;
    max-height: none !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang > span,
html body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1] > span {
    display: block !important;
    color: #f5b73b !important;
    -webkit-text-fill-color: #f5b73b !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: none !important;
    max-height: none !important;
    overflow: visible !important;
    text-shadow:
        0 2px 0 rgba(255,255,255,.05),
        0 12px 30px rgba(0,0,0,.36),
        0 0 30px rgba(245,183,59,.30) !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang,
html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1],
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1] {
    font-size: clamp(44px, 3.6vw, 58px) !important;
    line-height: 1.02 !important;
    letter-spacing: -.04em !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang > span,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang > span,
html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1] > span,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1] > span {
    color: #f5b73b !important;
    -webkit-text-fill-color: #f5b73b !important;
}

@media (max-width: 620px) {
    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1.sp-hero-title-multilang,
    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1],
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1[data-home-hero-title-v1] {
        font-size: clamp(28px, 7vw, 38px) !important;
        line-height: 1.02 !important;
    }
}

/* HOME_HERO_MULTILANG_GOLD_TITLE_CSS_V1_END */

/* HOME_RU_HERO_BUTTON_VISIBLE_V1_START
   Russian hero layout fix:
   - keep CTA visible
   - prevent title/text from colliding with stats
   - keep luxury look
*/

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament {
    min-height: 600px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-stack,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-stack {
    min-height: 600px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner {
    max-width: 640px !important;
    padding: 42px 34px 210px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1 {
    max-width: 580px !important;
    font-size: clamp(40px, 3.15vw, 54px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.045em !important;
    margin-bottom: 22px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1 > span,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1 > span {
    font-size: .96em !important;
    line-height: 1.02 !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament p,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament p {
    max-width: 590px !important;
    margin-bottom: 18px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions {
    position: relative !important;
    z-index: 20 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 8px !important;
    margin-bottom: 0 !important;
    pointer-events: auto !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions .sp-btn,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions .sp-btn,
html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold {
    position: relative !important;
    z-index: 21 !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-height: 44px !important;
    padding: 12px 20px !important;
    white-space: normal !important;
    pointer-events: auto !important;
}

/* Move stats lower and make them more compact in Russian */
html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stats {
    bottom: 18px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    z-index: 8 !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat {
    min-height: 66px !important;
    padding: 11px 14px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat b,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat b {
    font-size: 25px !important;
}

html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat span,
html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-stat span {
    font-size: 10px !important;
    line-height: 1.15 !important;
}

/* Laptop width with Russian */
@media (min-width: 1024px) and (max-width: 1439px) {
    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament {
        min-height: 620px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-stack,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-stack {
        min-height: 620px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner {
        padding-bottom: 220px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1 {
        font-size: clamp(38px, 3.45vw, 50px) !important;
        max-width: 560px !important;
    }
}

/* Mobile Russian: CTA below text, stats remain outside image from previous layer */
@media (max-width: 620px) {
    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament {
        min-height: auto !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-stack,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-stack {
        min-height: 470px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-stack,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-stack {
        min-height: 470px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-inner {
        padding: 0 !important;
        margin-top: 18px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament h1 {
        font-size: clamp(27px, 7vw, 36px) !important;
        line-height: 1.02 !important;
        max-width: 94% !important;
        margin-bottom: 12px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament p,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament p {
        max-width: 92% !important;
        font-size: 12.5px !important;
        line-height: 1.38 !important;
        margin-bottom: 12px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions {
        max-width: 92% !important;
        margin-top: 4px !important;
    }

    html[lang="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold,
    html[lang^="ru"] body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold {
        min-height: 38px !important;
        padding: 10px 14px !important;
        font-size: 11.5px !important;
    }
}

/* HOME_RU_HERO_BUTTON_VISIBLE_V1_END */

/* HOME_FEED_DARK_CONTRAST_FIX_V1_START
   Fix feed post readability in dark mode only.
   Keeps light mode intact.
*/

/* Dark feed room */
html.dark body.sphere-app-body .sp-home-feed-room,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room,
body.dark.sphere-app-body .sp-home-feed-room,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room {
    background:
        radial-gradient(circle at 90% 10%, rgba(245,183,59,.08), transparent 30%),
        linear-gradient(180deg, #081423 0%, #061426 100%) !important;
    border-color: rgba(245,183,59,.22) !important;
    box-shadow:
        0 24px 60px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* Dark post cards */
html.dark body.sphere-app-body .sp-home-feed-post,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post,
body.dark.sphere-app-body .sp-home-feed-post,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post {
    background:
        radial-gradient(circle at 92% 8%, rgba(245,183,59,.08), transparent 30%),
        linear-gradient(180deg, rgba(13,28,47,.98), rgba(7,19,33,.98)) !important;
    border: 1px solid rgba(245,183,59,.20) !important;
    box-shadow:
        0 18px 44px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* Dark post author/header text */
html.dark body.sphere-app-body .sp-home-feed-post h1,
html.dark body.sphere-app-body .sp-home-feed-post h2,
html.dark body.sphere-app-body .sp-home-feed-post h3,
html.dark body.sphere-app-body .sp-home-feed-post h4,
html.dark body.sphere-app-body .sp-home-feed-post strong,
html.dark body.sphere-app-body .sp-home-feed-post b,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post h1,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post h2,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post h3,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post h4,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post strong,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post b,
body.dark.sphere-app-body .sp-home-feed-post h1,
body.dark.sphere-app-body .sp-home-feed-post h2,
body.dark.sphere-app-body .sp-home-feed-post h3,
body.dark.sphere-app-body .sp-home-feed-post h4,
body.dark.sphere-app-body .sp-home-feed-post strong,
body.dark.sphere-app-body .sp-home-feed-post b,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post h1,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post h2,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post h3,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post h4,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post strong,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post b {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    opacity: 1 !important;
}

/* Dark meta text */
html.dark body.sphere-app-body .sp-home-feed-post p,
html.dark body.sphere-app-body .sp-home-feed-post span,
html.dark body.sphere-app-body .sp-home-feed-post small,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post p,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post span,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post small,
body.dark.sphere-app-body .sp-home-feed-post p,
body.dark.sphere-app-body .sp-home-feed-post span,
body.dark.sphere-app-body .sp-home-feed-post small,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post p,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post span,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post small {
    color: #d8c7a6 !important;
    -webkit-text-fill-color: #d8c7a6 !important;
    opacity: 1 !important;
}

/* Dark main post body/content */
html.dark body.sphere-app-body .sp-home-feed-post .sp-post-body,
html.dark body.sphere-app-body .sp-home-feed-post .sp-post-content,
html.dark body.sphere-app-body .sp-home-feed-post .sp-home-feed-content,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-post-body,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-post-content,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-home-feed-content,
body.dark.sphere-app-body .sp-home-feed-post .sp-post-body,
body.dark.sphere-app-body .sp-home-feed-post .sp-post-content,
body.dark.sphere-app-body .sp-home-feed-post .sp-home-feed-content,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-post-body,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-post-content,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-home-feed-content {
    color: #fff0cf !important;
    -webkit-text-fill-color: #fff0cf !important;
    background: rgba(255,248,234,.035) !important;
    border: 1px solid rgba(245,183,59,.12) !important;
    border-radius: 18px !important;
    padding: 14px 16px !important;
}

/* Fallback: direct text blocks inside post */
html.dark body.sphere-app-body .sp-home-feed-post > div,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post > div,
body.dark.sphere-app-body .sp-home-feed-post > div,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post > div {
    color: #fff0cf !important;
}

/* Dark reaction/comment counters */
html.dark body.sphere-app-body .sp-home-feed-post .sp-post-meta,
html.dark body.sphere-app-body .sp-home-feed-post .sp-social-post-meta,
html.dark body.sphere-app-body .sp-home-feed-post .sp-post-stats,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-post-meta,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-social-post-meta,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-post-stats,
body.dark.sphere-app-body .sp-home-feed-post .sp-post-meta,
body.dark.sphere-app-body .sp-home-feed-post .sp-social-post-meta,
body.dark.sphere-app-body .sp-home-feed-post .sp-post-stats,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-post-meta,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-social-post-meta,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-post-stats {
    color: #d8c7a6 !important;
    border-top-color: rgba(245,183,59,.14) !important;
    border-bottom-color: rgba(245,183,59,.14) !important;
}

/* Dark action buttons */
html.dark body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
html.dark body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
html.dark body.sphere-app-body .sp-social-post-actions a,
html.dark body.sphere-app-body .sp-social-post-actions button,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
html[data-theme="dark"] body.sphere-app-body .sp-social-post-actions a,
html[data-theme="dark"] body.sphere-app-body .sp-social-post-actions button,
body.dark.sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
body.dark.sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
body.dark.sphere-app-body .sp-social-post-actions a,
body.dark.sphere-app-body .sp-social-post-actions button,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-social-post-actions a,
body[data-theme="dark"].sphere-app-body .sp-home-feed-post .sp-social-post-actions button,
body[data-theme="dark"].sphere-app-body .sp-social-post-actions a,
body[data-theme="dark"].sphere-app-body .sp-social-post-actions button {
    background:
        linear-gradient(180deg, rgba(255,248,234,.075), rgba(255,248,234,.035)) !important;
    border: 1px solid rgba(245,183,59,.18) !important;
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    box-shadow:
        0 10px 22px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* Dark action hover */
html.dark body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a:hover,
html.dark body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button:hover,
html.dark body.sphere-app-body .sp-social-post-actions a:hover,
html.dark body.sphere-app-body .sp-social-post-actions button:hover,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions a:hover,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-social-post-actions button:hover,
html[data-theme="dark"] body.sphere-app-body .sp-social-post-actions a:hover,
html[data-theme="dark"] body.sphere-app-body .sp-social-post-actions button:hover {
    background: rgba(245,183,59,.12) !important;
    border-color: rgba(245,183,59,.34) !important;
    color: #f5b73b !important;
    -webkit-text-fill-color: #f5b73b !important;
}

/* Dark avatar ring */
html.dark body.sphere-app-body .sp-home-feed-avatar,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-avatar,
body.dark.sphere-app-body .sp-home-feed-avatar,
body[data-theme="dark"].sphere-app-body .sp-home-feed-avatar {
    border-color: rgba(245,183,59,.62) !important;
    box-shadow:
        0 8px 20px rgba(0,0,0,.24),
        0 0 0 4px rgba(245,183,59,.08) !important;
    background: #071321 !important;
}

/* Mobile dark spacing */
@media (max-width: 620px) {
    html.dark body.sphere-app-body .sp-home-feed-post,
    html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post,
    body.dark.sphere-app-body .sp-home-feed-post,
    body[data-theme="dark"].sphere-app-body .sp-home-feed-post {
        padding: 16px 14px !important;
    }

    html.dark body.sphere-app-body .sp-home-feed-post .sp-post-body,
    html.dark body.sphere-app-body .sp-home-feed-post .sp-post-content,
    html.dark body.sphere-app-body .sp-home-feed-post .sp-home-feed-content,
    html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-post-body,
    html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-post-content,
    html[data-theme="dark"] body.sphere-app-body .sp-home-feed-post .sp-home-feed-content {
        padding: 13px 14px !important;
        border-radius: 16px !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }
}

/* HOME_FEED_DARK_CONTRAST_FIX_V1_END */

/* HOME_FEED_DARK_HEADER_FIX_V1_START
   Fix dark mode heading/subtitle in C&C Sphere Social feed block.
*/

html.dark body.sphere-app-body .sp-home-feed-room .sp-home-feed-head h1,
html.dark body.sphere-app-body .sp-home-feed-room .sp-home-feed-head h2,
html.dark body.sphere-app-body .sp-home-feed-room .sp-home-feed-head h3,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-home-feed-head h1,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-home-feed-head h2,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-home-feed-head h3,
body.dark.sphere-app-body .sp-home-feed-room .sp-home-feed-head h1,
body.dark.sphere-app-body .sp-home-feed-room .sp-home-feed-head h2,
body.dark.sphere-app-body .sp-home-feed-room .sp-home-feed-head h3,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-home-feed-head h1,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-home-feed-head h2,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-home-feed-head h3 {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    opacity: 1 !important;
    font-weight: 1000 !important;
    letter-spacing: -.035em !important;
    text-shadow:
        0 2px 0 rgba(255,255,255,.035),
        0 12px 28px rgba(0,0,0,.36),
        0 0 22px rgba(245,183,59,.12) !important;
}

html.dark body.sphere-app-body .sp-home-feed-room .sp-home-feed-head p,
html.dark body.sphere-app-body .sp-home-feed-room .sp-home-feed-head span:not(.sp-kicker),
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-home-feed-head p,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-home-feed-head span:not(.sp-kicker),
body.dark.sphere-app-body .sp-home-feed-room .sp-home-feed-head p,
body.dark.sphere-app-body .sp-home-feed-room .sp-home-feed-head span:not(.sp-kicker),
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-home-feed-head p,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-home-feed-head span:not(.sp-kicker) {
    color: #d8c7a6 !important;
    -webkit-text-fill-color: #d8c7a6 !important;
    opacity: 1 !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
    text-shadow: 0 8px 20px rgba(0,0,0,.28) !important;
}

html.dark body.sphere-app-body .sp-home-feed-room .sp-home-feed-head .sp-kicker,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-home-feed-head .sp-kicker,
body.dark.sphere-app-body .sp-home-feed-room .sp-home-feed-head .sp-kicker,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-home-feed-head .sp-kicker {
    color: #f5b73b !important;
    -webkit-text-fill-color: #f5b73b !important;
    opacity: 1 !important;
    text-shadow: 0 0 18px rgba(245,183,59,.22) !important;
}

/* Extra fallback in case the header uses generic section classes */
html.dark body.sphere-app-body .sp-home-feed-room .sp-section-head h2,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-section-head h2,
body.dark.sphere-app-body .sp-home-feed-room .sp-section-head h2,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-section-head h2 {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    opacity: 1 !important;
}

html.dark body.sphere-app-body .sp-home-feed-room .sp-section-head p,
html[data-theme="dark"] body.sphere-app-body .sp-home-feed-room .sp-section-head p,
body.dark.sphere-app-body .sp-home-feed-room .sp-section-head p,
body[data-theme="dark"].sphere-app-body .sp-home-feed-room .sp-section-head p {
    color: #d8c7a6 !important;
    -webkit-text-fill-color: #d8c7a6 !important;
    opacity: 1 !important;
}

/* HOME_FEED_DARK_HEADER_FIX_V1_END */

/* HEADER_LAPTOP_RESPONSIVE_FIX_V1_START
   Fix laptop header overflow:
   - search does not push action buttons
   - publish button stays visible
   - nav scrolls cleanly instead of breaking
   - desktop large remains unchanged
*/

/* Safety */
html body.sphere-app-body .sp-header,
html body.sphere-app-body .sp-topbar,
html body.sphere-app-body .sp-topbar-inner,
html body.sphere-app-body .sp-search,
html body.sphere-app-body .sp-nav,
html body.sphere-app-body .sp-nav-inner {
    min-width: 0 !important;
}

/* Laptop / small desktop */
@media (min-width: 1024px) and (max-width: 1380px) {
    html body.sphere-app-body .sp-header {
        overflow: hidden !important;
    }

    html body.sphere-app-body .sp-topbar,
    html body.sphere-app-body .sp-topbar-inner {
        display: grid !important;
        grid-template-columns: minmax(190px, 250px) minmax(360px, 1fr) auto !important;
        gap: 12px !important;
        align-items: center !important;
        max-width: 100% !important;
        padding-left: 28px !important;
        padding-right: 28px !important;
        box-sizing: border-box !important;
    }

    html body.sphere-app-body .sp-brand,
    html body.sphere-app-body .sp-logo,
    html body.sphere-app-body .sp-brand-wrap {
        min-width: 0 !important;
        max-width: 250px !important;
    }

    html body.sphere-app-body .sp-search {
        width: 100% !important;
        max-width: 620px !important;
        min-width: 0 !important;
        justify-self: center !important;
    }

    html body.sphere-app-body .sp-search input,
    html body.sphere-app-body .sp-search-field,
    html body.sphere-app-body .sp-search select {
        min-width: 0 !important;
    }

    html body.sphere-app-body .sp-top-actions,
    html body.sphere-app-body .sp-actions,
    html body.sphere-app-body .sp-header-actions {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 7px !important;
        min-width: 0 !important;
        flex-wrap: nowrap !important;
        overflow: visible !important;
    }

    html body.sphere-app-body .sp-chip,
    html body.sphere-app-body .sp-message-chip {
        min-width: 0 !important;
        min-height: 40px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
    }

    html body.sphere-app-body .sp-user-chip,
    html body.sphere-app-body .sp-profile-chip {
        max-width: 190px !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    html body.sphere-app-body .sp-user-chip span,
    html body.sphere-app-body .sp-profile-chip span,
    html body.sphere-app-body .sp-user-chip strong,
    html body.sphere-app-body .sp-profile-chip strong {
        min-width: 0 !important;
        max-width: 120px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html body.sphere-app-body .sp-publish,
    html body.sphere-app-body .sp-publish-btn,
    html body.sphere-app-body a[href*="publish"],
    html body.sphere-app-body a[href*="listings/create"] {
        max-width: 128px !important;
        min-width: 44px !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
    }

    /* Secondary navigation: scroll horizontally instead of squeezing */
    html body.sphere-app-body .sp-nav {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scrollbar-width: none !important;
        max-width: 100% !important;
    }

    html body.sphere-app-body .sp-nav::-webkit-scrollbar {
        display: none !important;
    }

    html body.sphere-app-body .sp-nav-inner {
        display: flex !important;
        width: max-content !important;
        min-width: max-content !important;
        gap: 10px !important;
        padding-left: 28px !important;
        padding-right: 28px !important;
    }

    html body.sphere-app-body .sp-nav a {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* Smaller laptop / browser with many bookmarks */
@media (min-width: 1024px) and (max-width: 1220px) {
    html body.sphere-app-body .sp-topbar,
    html body.sphere-app-body .sp-topbar-inner {
        grid-template-columns: 190px minmax(280px, 1fr) auto !important;
        gap: 8px !important;
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    html body.sphere-app-body .sp-search {
        max-width: 520px !important;
    }

    html body.sphere-app-body .sp-chip,
    html body.sphere-app-body .sp-message-chip {
        padding-left: 10px !important;
        padding-right: 10px !important;
        font-size: 12px !important;
    }

    html body.sphere-app-body .sp-user-chip,
    html body.sphere-app-body .sp-profile-chip {
        max-width: 150px !important;
    }

    html body.sphere-app-body .sp-user-chip span,
    html body.sphere-app-body .sp-profile-chip span,
    html body.sphere-app-body .sp-user-chip strong,
    html body.sphere-app-body .sp-profile-chip strong {
        max-width: 88px !important;
    }

    html body.sphere-app-body .sp-publish,
    html body.sphere-app-body .sp-publish-btn,
    html body.sphere-app-body a[href*="publish"],
    html body.sphere-app-body a[href*="listings/create"] {
        max-width: 92px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* Ultra tight laptop: hide only non-critical text inside user chip, keep avatar */
@media (min-width: 1024px) and (max-width: 1120px) {
    html body.sphere-app-body .sp-search {
        max-width: 440px !important;
    }

    html body.sphere-app-body .sp-user-chip span,
    html body.sphere-app-body .sp-profile-chip span {
        display: none !important;
    }

    html body.sphere-app-body .sp-user-chip,
    html body.sphere-app-body .sp-profile-chip {
        max-width: 78px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

/* HEADER_LAPTOP_RESPONSIVE_FIX_V1_END */

/* HOME_HERO_CTA_TEXT_CONTRAST_FIX_V1_START
   Fix burned/low-contrast hero CTA text on gold button.
   Scope: hero CTA only.
*/

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions .sp-btn.gold,
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold {
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    text-shadow: none !important;
    font-weight: 1000 !important;
    letter-spacing: -.01em !important;
    background: linear-gradient(135deg, #ffe29a 0%, #f5b73b 52%, #c98318 100%) !important;
    border: 1px solid rgba(255,226,142,.58) !important;
    box-shadow:
        0 16px 34px rgba(183,121,31,.26),
        0 0 0 1px rgba(255,255,255,.16) inset,
        0 0 28px rgba(245,183,59,.22) !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions .sp-btn.gold *,
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold * {
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    text-shadow: none !important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-actions .sp-btn.gold:hover,
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-btn.gold:hover {
    color: #050b14 !important;
    -webkit-text-fill-color: #050b14 !important;
    filter: brightness(1.04) saturate(1.08) !important;
}

/* HOME_HERO_CTA_TEXT_CONTRAST_FIX_V1_END */

/* HOME_STICKY_SIDEBARS_REAL_AFTER_END_V1_START
   Real LinkedIn-like sidebars:
   - JS calculates top based on actual sidebar height
   - sidebar scrolls normally first
   - when its bottom reaches viewport bottom, it sticks
   - no visual style changes
   - no internal sidebar scrolling
*/

@media (min-width: 1181px) {
    html body.sphere-app-body .sp-main,
    html body.sphere-app-body .sp-dashboard {
        overflow: visible !important;
    }

    html body.sphere-app-body .sp-dashboard {
        align-items: flex-start !important;
    }

    html body.sphere-app-body .sp-dashboard > .sp-left {
        position: sticky !important;
        top: var(--sp-left-sticky-top, 156px) !important;
        align-self: flex-start !important;
        z-index: 3 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    html body.sphere-app-body .sp-dashboard > .sp-right {
        position: sticky !important;
        top: var(--sp-right-sticky-top, 156px) !important;
        align-self: flex-start !important;
        z-index: 3 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    html body.sphere-app-body .sp-dashboard > .sp-center {
        min-width: 0 !important;
        overflow: visible !important;
    }
}

@media (max-width: 1180px) {
    html body.sphere-app-body .sp-dashboard > .sp-left,
    html body.sphere-app-body .sp-dashboard > .sp-right {
        position: static !important;
        top: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* HOME_STICKY_SIDEBARS_REAL_AFTER_END_V1_END */





/* HOME_FEED_LINKEDIN_FINAL_CLEAN_V1_START
   Final clean Home feed style.
   Target: C&C Sphere Social should feel closer to LinkedIn feed cards.
   Scope: #sphere-feed-room only.
   Does not touch hero, sticky sidebars, marketplace, header or /sphere/feed.
*/

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social {
    display: grid !important;
    gap: 16px !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 18px !important;
    margin-bottom: 8px !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head > div {
    min-width: 0 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head span {
    display: block !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #d99a21 !important;
    -webkit-text-fill-color: #d99a21 !important;
    font-size: 11px !important;
    font-weight: 1000 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2 {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: clamp(28px, 2.15vw, 36px) !important;
    line-height: 1.02 !important;
    font-weight: 1000 !important;
    letter-spacing: -.045em !important;
    text-shadow: none !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2 {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p {
    margin: 7px 0 0 !important;
    max-width: 760px !important;
    background: transparent !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p {
    color: #d8c7a6 !important;
    -webkit-text-fill-color: #d8c7a6 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head > a {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 10px 18px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #c98318) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
    text-decoration: none !important;
    box-shadow: 0 12px 24px rgba(183,121,31,.22) !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card {
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 14px !important;
    border: 1px solid rgba(15,23,42,.14) !important;
    background: #ffffff !important;
    box-shadow: 0 10px 22px rgba(15,23,42,.06) !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card {
    border-color: rgba(245,183,59,.20) !important;
    background: linear-gradient(180deg, rgba(13,28,47,.98), rgba(7,19,33,.98)) !important;
    box-shadow: 0 16px 38px rgba(0,0,0,.24) !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-head {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 12px !important;
    align-items: center !important;
    padding: 14px 16px 10px !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-avatar {
    width: 44px !important;
    height: 44px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    border: 2px solid rgba(217,154,33,.62) !important;
    background: #071321 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author {
    min-width: 0 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong {
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 1000 !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author small,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author span {
    color: #657186 !important;
    -webkit-text-fill-color: #657186 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text {
    margin: 0 !important;
    padding: 4px 16px 14px !important;
    background: transparent !important;
    border: 0 !important;
    color: #1f2937 !important;
    -webkit-text-fill-color: #1f2937 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    font-weight: 700 !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text {
    color: #fff0cf !important;
    -webkit-text-fill-color: #fff0cf !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-media {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    border-top: 1px solid rgba(15,23,42,.08) !important;
    border-bottom: 1px solid rgba(15,23,42,.08) !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-media img {
    display: block !important;
    width: 100% !important;
    max-height: 460px !important;
    object-fit: contain !important;
    border-radius: 0 !important;
    background: #fff !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-stats,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-stats {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    border-bottom: 1px solid rgba(15,23,42,.10) !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
    padding: 6px 8px 8px !important;
    background: transparent !important;
    border: 0 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions a,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions button {
    min-height: 38px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
    text-decoration: none !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions a:hover,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions button:hover {
    background: rgba(245,183,59,.12) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
}

@media (max-width: 620px) {
    html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions a,
    html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions button {
        font-size: 11.5px !important;
    }
}

/* HOME_FEED_LINKEDIN_FINAL_CLEAN_V1_END */

/* HOME_FEED_REAL_ACTIONS_SEND_V1_START
   Real actions in Home feed:
   - react/comment/send without redirecting to feed view
   - scoped only to #sphere-feed-room
*/

html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions form {
    margin: 0 !important;
    min-width: 0 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions button,
html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions a {
    width: 100% !important;
    min-height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 12.5px !important;
    font-weight: 1000 !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions button:hover,
html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions a:hover {
    background: rgba(245,183,59,.12) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel {
    padding: 0 16px 14px !important;
    border-top: 1px solid rgba(15,23,42,.08) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel[hidden] {
    display: none !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel form {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
    padding-top: 12px !important;
    margin: 0 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-panel form {
    grid-template-columns: minmax(160px, .7fr) minmax(0, 1fr) auto !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel input,
html body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel select {
    min-height: 40px !important;
    width: 100% !important;
    border-radius: 999px !important;
    border: 1px solid rgba(15,23,42,.14) !important;
    background: rgba(248,250,252,.98) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    outline: none !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel button {
    min-height: 40px !important;
    border: 0 !important;
    border-radius: 999px !important;
    padding: 0 16px !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #c98318) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
    cursor: pointer !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-empty {
    margin-top: 12px !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
    background: rgba(245,183,59,.10) !important;
    color: #526173 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

html.dark body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions button,
html.dark body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions a,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions button,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions a,
body.dark.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions button,
body.dark.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions a,
body[data-theme="dark"].sphere-app-body #sphere-feed-room .sp-home-feed-live-actions button,
body[data-theme="dark"].sphere-app-body #sphere-feed-room .sp-home-feed-live-actions a {
    color: #d8c7a6 !important;
    -webkit-text-fill-color: #d8c7a6 !important;
}

html.dark body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel input,
html.dark body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel select,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel input,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel select,
body.dark.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel input,
body.dark.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel select,
body[data-theme="dark"].sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel input,
body[data-theme="dark"].sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel select {
    border-color: rgba(245,183,59,.18) !important;
    background: rgba(4,11,23,.42) !important;
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
}

@media (max-width: 720px) {
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body.sphere-app-body #sphere-feed-room .sp-home-feed-inline-panel form,
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-panel form {
        grid-template-columns: 1fr !important;
    }
}

/* HOME_FEED_REAL_ACTIONS_SEND_V1_END */

/* HOME_FEED_SEND_MODAL_NETWORK_V1_START
   Pretty send-to-network modal for Home feed.
   Scoped only to #sphere-feed-room.
*/

html.sp-home-modal-open,
html.sp-home-modal-open body {
    overflow: hidden !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-modal[hidden] {
    display: none !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    display: grid !important;
    place-items: center !important;
    padding: 20px !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(2, 8, 18, .68) !important;
    backdrop-filter: blur(8px) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-dialog {
    position: relative !important;
    z-index: 2 !important;
    width: min(520px, 94vw) !important;
    max-height: min(680px, 86vh) !important;
    overflow: hidden !important;
    border-radius: 26px !important;
    border: 1px solid rgba(245,183,59,.34) !important;
    background:
        radial-gradient(circle at 88% 0%, rgba(245,183,59,.14), transparent 34%),
        linear-gradient(180deg, #fffaf0, #fff7e7) !important;
    box-shadow:
        0 34px 90px rgba(0,0,0,.38),
        inset 0 1px 0 rgba(255,255,255,.7) !important;
}

html.dark body.sphere-app-body #sphere-feed-room .sp-home-feed-send-dialog,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room .sp-home-feed-send-dialog,
body.dark.sphere-app-body #sphere-feed-room .sp-home-feed-send-dialog,
body[data-theme="dark"].sphere-app-body #sphere-feed-room .sp-home-feed-send-dialog {
    background:
        radial-gradient(circle at 88% 0%, rgba(245,183,59,.13), transparent 34%),
        linear-gradient(180deg, #0d1c2f, #071321) !important;
    border-color: rgba(245,183,59,.30) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding: 18px 20px 14px !important;
    border-bottom: 1px solid rgba(15,23,42,.10) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-top span {
    display: block !important;
    margin-bottom: 4px !important;
    color: #d99a21 !important;
    -webkit-text-fill-color: #d99a21 !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    letter-spacing: .13em !important;
    text-transform: uppercase !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-top strong {
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 20px !important;
    line-height: 1.1 !important;
    font-weight: 1000 !important;
}

html.dark body.sphere-app-body #sphere-feed-room .sp-home-feed-send-top strong,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room .sp-home-feed-send-top strong,
body.dark.sphere-app-body #sphere-feed-room .sp-home-feed-send-top strong,
body[data-theme="dark"].sphere-app-body #sphere-feed-room .sp-home-feed-send-top strong {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-close {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid rgba(15,23,42,.12) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.72) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-list {
    display: grid !important;
    gap: 10px !important;
    max-height: 330px !important;
    overflow-y: auto !important;
    padding: 16px 18px !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-card {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) 28px !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(15,23,42,.10) !important;
    background: rgba(255,255,255,.74) !important;
    cursor: pointer !important;
    transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-card:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(217,154,33,.36) !important;
    box-shadow: 0 12px 24px rgba(15,23,42,.08) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-card input {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-avatar {
    width: 48px !important;
    height: 48px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    display: grid !important;
    place-items: center !important;
    background: radial-gradient(circle at 30% 20%, #ffe29a, #d99a21 48%, #8a5a10 100%) !important;
    border: 2px solid rgba(245,183,59,.70) !important;
    box-shadow: 0 10px 22px rgba(183,121,31,.20) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-avatar span {
    color: #fff8ea !important;
    -webkit-text-fill-color: #fff8ea !important;
    font-size: 14px !important;
    font-weight: 1000 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-meta {
    min-width: 0 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-meta strong {
    display: block !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 14px !important;
    font-weight: 1000 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-meta small {
    display: block !important;
    margin-top: 3px !important;
    color: #657186 !important;
    -webkit-text-fill-color: #657186 !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-check {
    width: 24px !important;
    height: 24px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(15,23,42,.18) !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-card:has(input:checked) {
    border-color: rgba(217,154,33,.68) !important;
    background: rgba(245,183,59,.16) !important;
    box-shadow: 0 14px 28px rgba(183,121,31,.16) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-network-card:has(input:checked) .sp-home-feed-network-check {
    background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #c98318) !important;
    border-color: rgba(217,154,33,.68) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-message {
    padding: 0 18px 16px !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-message input {
    width: 100% !important;
    min-height: 42px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(15,23,42,.12) !important;
    background: rgba(255,255,255,.80) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    padding: 0 15px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    outline: none !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-footer {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    padding: 14px 18px 18px !important;
    border-top: 1px solid rgba(15,23,42,.10) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-footer button {
    min-height: 40px !important;
    border-radius: 999px !important;
    padding: 0 18px !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
    cursor: pointer !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-footer button[type="button"] {
    border: 1px solid rgba(15,23,42,.12) !important;
    background: rgba(255,255,255,.70) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-footer button[type="submit"] {
    border: 0 !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #c98318) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    box-shadow: 0 12px 24px rgba(183,121,31,.22) !important;
}

@media (max-width: 620px) {
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-send-dialog {
        width: min(96vw, 520px) !important;
        max-height: 88vh !important;
        border-radius: 22px !important;
    }
}

/* HOME_FEED_SEND_MODAL_NETWORK_V1_END */

/* SPHERE_SOCIAL_FULL_ACTIONS_V1_START
   Share/send modal + action polish for C&C Sphere feed.
*/

html body.sphere-app-body .sp-home-feed-live-actions,
html body.sphere-app-body .ccfeed-post-actions {
    align-items: center !important;
}

html body.sphere-app-body .ccfeed-send-modal[hidden] {
    display: none !important;
}

html body.sphere-app-body .ccfeed-send-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    display: grid !important;
    place-items: center !important;
    padding: 20px !important;
}

html body.sphere-app-body .ccfeed-send-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(2,8,18,.68) !important;
    backdrop-filter: blur(8px) !important;
}

html body.sphere-app-body .ccfeed-send-dialog {
    position: relative !important;
    z-index: 2 !important;
    width: min(520px, 94vw) !important;
    max-height: 86vh !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    border: 1px solid rgba(245,183,59,.34) !important;
    background: linear-gradient(180deg, #fffaf0, #fff7e7) !important;
    box-shadow: 0 34px 90px rgba(0,0,0,.38) !important;
}

html.dark body.sphere-app-body .ccfeed-send-dialog,
html[data-theme="dark"] body.sphere-app-body .ccfeed-send-dialog,
body.dark.sphere-app-body .ccfeed-send-dialog,
body[data-theme="dark"].sphere-app-body .ccfeed-send-dialog {
    background: linear-gradient(180deg, #0d1c2f, #071321) !important;
}

html body.sphere-app-body .ccfeed-send-top {
    display: flex !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding: 18px 20px 14px !important;
    border-bottom: 1px solid rgba(15,23,42,.10) !important;
}

html body.sphere-app-body .ccfeed-send-top span {
    display: block !important;
    color: #d99a21 !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    letter-spacing: .13em !important;
    text-transform: uppercase !important;
}

html body.sphere-app-body .ccfeed-send-top strong {
    color: #071321 !important;
    font-size: 20px !important;
    font-weight: 1000 !important;
}

html body.sphere-app-body .ccfeed-send-top button {
    width: 38px !important;
    height: 38px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(15,23,42,.12) !important;
    background: rgba(255,255,255,.72) !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

html body.sphere-app-body .ccfeed-network-list {
    display: grid !important;
    gap: 10px !important;
    max-height: 330px !important;
    overflow-y: auto !important;
    padding: 16px 18px !important;
}

html body.sphere-app-body .ccfeed-network-card {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) 28px !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(15,23,42,.10) !important;
    background: rgba(255,255,255,.74) !important;
    cursor: pointer !important;
}

html body.sphere-app-body .ccfeed-network-card input {
    position: absolute !important;
    opacity: 0 !important;
}

html body.sphere-app-body .ccfeed-network-avatar {
    width: 48px !important;
    height: 48px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    background: radial-gradient(circle at 30% 20%, #ffe29a, #d99a21 48%, #8a5a10 100%) !important;
    color: #fff8ea !important;
    font-weight: 1000 !important;
}

html body.sphere-app-body .ccfeed-network-card:has(input:checked) {
    border-color: rgba(217,154,33,.68) !important;
    background: rgba(245,183,59,.16) !important;
}

html body.sphere-app-body .ccfeed-send-message {
    width: calc(100% - 36px) !important;
    margin: 0 18px 16px !important;
    min-height: 42px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(15,23,42,.12) !important;
    padding: 0 15px !important;
}

html body.sphere-app-body .ccfeed-send-footer {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    padding: 14px 18px 18px !important;
    border-top: 1px solid rgba(15,23,42,.10) !important;
}

html body.sphere-app-body .ccfeed-send-footer button {
    min-height: 40px !important;
    border-radius: 999px !important;
    padding: 0 18px !important;
    font-weight: 1000 !important;
}

html body.sphere-app-body .ccfeed-send-footer button[type="submit"] {
    border: 0 !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #c98318) !important;
    color: #071321 !important;
}

/* SPHERE_SOCIAL_FULL_ACTIONS_V1_END */

/* HOME_FEED_SHARE_ACTION_V1_START
   Adds Share as a first-class Home feed action.
   Scope only: #sphere-feed-room.
*/

html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions form {
    margin: 0 !important;
}

html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions form button {
    width: 100% !important;
}

@media (max-width: 720px) {
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-live-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* HOME_FEED_SHARE_ACTION_V1_END */

/* SPHERE_SOCIAL_FACEBOOK_REACTIONS_AJAX_V1_START
   Facebook-style reactions + no-refresh social actions.
   Shared by Home and /sphere/feed.
*/

html body.sphere-app-body .sp-social-fb-react {
    position: relative !important;
    min-width: 0 !important;
}

html body.sphere-app-body .sp-social-fb-react-trigger {
    width: 100% !important;
    min-height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 12.5px !important;
    font-weight: 1000 !important;
    cursor: pointer !important;
}

html body.sphere-app-body .sp-social-fb-react-trigger span {
    font-size: 17px !important;
    line-height: 1 !important;
}

html body.sphere-app-body .sp-social-fb-react-trigger.is-reacted {
    color: #d99a21 !important;
    -webkit-text-fill-color: #d99a21 !important;
}

html body.sphere-app-body .sp-social-fb-react-trigger:hover {
    background: rgba(245,183,59,.12) !important;
}

html body.sphere-app-body .sp-social-fb-reaction-tray {
    position: absolute !important;
    left: 0 !important;
    bottom: calc(100% + 10px) !important;
    z-index: 9999 !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 8px 10px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(245,183,59,.28) !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.18) !important;
    transform-origin: bottom left !important;
    animation: spReactionTrayIn .16s ease both !important;
}

html body.sphere-app-body .sp-social-fb-reaction-tray[hidden] {
    display: none !important;
}

@keyframes spReactionTrayIn {
    from {
        opacity: 0;
        transform: translateY(6px) scale(.96);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

html body.sphere-app-body .sp-social-fb-reaction-tray form {
    margin: 0 !important;
}

html body.sphere-app-body .sp-social-fb-reaction-tray button {
    width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: transform .16s ease, background .16s ease !important;
}

html body.sphere-app-body .sp-social-fb-reaction-tray button:hover {
    transform: translateY(-5px) scale(1.14) !important;
    background: rgba(245,183,59,.14) !important;
}

html body.sphere-app-body .sp-social-fb-reaction-tray button span {
    font-size: 26px !important;
    line-height: 1 !important;
}

html body.sphere-app-body .sp-social-fb-reaction-tray button small {
    position: absolute !important;
    left: 50% !important;
    bottom: calc(100% + 7px) !important;
    transform: translateX(-50%) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    white-space: nowrap !important;
    padding: 5px 8px !important;
    border-radius: 999px !important;
    background: rgba(7,19,33,.94) !important;
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    transition: opacity .14s ease !important;
}

html body.sphere-app-body .sp-social-fb-reaction-tray button:hover small {
    opacity: 1 !important;
}

html body.sphere-app-body .ccfeed-fb-react .sp-social-fb-reaction-tray {
    left: 0 !important;
    bottom: calc(100% + 10px) !important;
}

html body.sphere-app-body .sp-social-toast {
    position: fixed !important;
    left: 50% !important;
    bottom: 26px !important;
    z-index: 100000 !important;
    transform: translateX(-50%) translateY(20px) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    padding: 12px 16px !important;
    border-radius: 999px !important;
    background: rgba(7,19,33,.96) !important;
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.28) !important;
    transition: opacity .18s ease, transform .18s ease !important;
}

html body.sphere-app-body .sp-social-toast.is-visible {
    opacity: 1 !important;
    transform: translateX(-50%) translateY(0) !important;
}

html.dark body.sphere-app-body .sp-social-fb-reaction-tray,
html[data-theme="dark"] body.sphere-app-body .sp-social-fb-reaction-tray,
body.dark.sphere-app-body .sp-social-fb-reaction-tray,
body[data-theme="dark"].sphere-app-body .sp-social-fb-reaction-tray {
    border-color: rgba(245,183,59,.26) !important;
    background: rgba(7,19,33,.98) !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.40) !important;
}

html.dark body.sphere-app-body .sp-social-fb-react-trigger,
html[data-theme="dark"] body.sphere-app-body .sp-social-fb-react-trigger,
body.dark.sphere-app-body .sp-social-fb-react-trigger,
body[data-theme="dark"].sphere-app-body .sp-social-fb-react-trigger {
    color: #d8c7a6 !important;
    -webkit-text-fill-color: #d8c7a6 !important;
}

@media (max-width: 720px) {
    html body.sphere-app-body .sp-social-fb-reaction-tray {
        left: 50% !important;
        transform: translateX(-50%) !important;
        bottom: calc(100% + 8px) !important;
        max-width: calc(100vw - 30px) !important;
        overflow-x: auto !important;
    }

    html body.sphere-app-body .sp-social-fb-reaction-tray button {
        width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
    }

    html body.sphere-app-body .sp-social-fb-reaction-tray button span {
        font-size: 23px !important;
    }
}

/* SPHERE_SOCIAL_FACEBOOK_REACTIONS_AJAX_V1_END */
/* SPHERE_HOME_SOCIAL_MOBILE_FACEBOOK_LAYOUT_V1
   Mirrors the shared mobile social feed action layout because home CSS loads last. */
@media (max-width: 640px) {
    html body.sphere-app-body #sphere-feed-room .ccfeed-post-actions,
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-actions {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 4px !important;
        padding: 8px !important;
        border-top: 1px solid rgba(31, 49, 79, .10) !important;
        border-bottom: 1px solid rgba(31, 49, 79, .08) !important;
    }

    html body.sphere-app-body #sphere-feed-room .ccfeed-post-actions > *,
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-actions > * {
        min-width: 0 !important;
        width: 100% !important;
        margin: 0 !important;
    }

    html body.sphere-app-body #sphere-feed-room .ccfeed-post-actions a,
    html body.sphere-app-body #sphere-feed-room .ccfeed-post-actions button,
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-actions a,
    html body.sphere-app-body #sphere-feed-room .sp-home-feed-actions button {
        width: 100% !important;
        min-height: 42px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        padding: 6px 4px !important;
        border-radius: 13px !important;
        border: 0 !important;
        background: transparent !important;
        color: #344765 !important;
        font-size: 10.5px !important;
        font-weight: 850 !important;
        line-height: 1.1 !important;
        text-align: center !important;
        white-space: normal !important;
        text-decoration: none !important;
        box-shadow: none !important;
    }

    html body.sphere-app-body #sphere-feed-room .ccfeed-post-actions form[action*="report"],
    html body.sphere-app-body #sphere-feed-room .ccfeed-post-actions a[href*="profile"],
    html body.sphere-app-body #sphere-feed-room .ccfeed-post-actions a[href*="profiles"] {
        display: none !important;
    }

    html body.sphere-app-body #sphere-feed-room .ccfeed-comment-form {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 74px !important;
        gap: 8px !important;
        padding: 10px 10px 14px !important;
        align-items: center !important;
    }

    html body.sphere-app-body #sphere-feed-room .ccfeed-comment-form input,
    html body.sphere-app-body #sphere-feed-room .ccfeed-comment-form textarea {
        min-width: 0 !important;
        width: 100% !important;
        height: 40px !important;
        border-radius: 999px !important;
        font-size: 12px !important;
    }

    html body.sphere-app-body #sphere-feed-room .ccfeed-comment-form button {
        min-width: 74px !important;
        height: 40px !important;
        border-radius: 999px !important;
        font-size: 12px !important;
        padding: 0 10px !important;
    }
}





/* HOME_FEED_LINKEDIN_FINAL_CLEAN_V1_START
   Final clean Home feed style.
   Target: C&C Sphere Social should feel closer to LinkedIn feed cards.
   Scope: #sphere-feed-room only.
   Does not touch hero, sticky sidebars, marketplace, header or /sphere/feed.
*/

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social {
    display: grid !important;
    gap: 16px !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 18px !important;
    margin-bottom: 8px !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head > div {
    min-width: 0 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head span {
    display: block !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #d99a21 !important;
    -webkit-text-fill-color: #d99a21 !important;
    font-size: 11px !important;
    font-weight: 1000 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2 {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: clamp(28px, 2.15vw, 36px) !important;
    line-height: 1.02 !important;
    font-weight: 1000 !important;
    letter-spacing: -.045em !important;
    text-shadow: none !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head h2 {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p {
    margin: 7px 0 0 !important;
    max-width: 760px !important;
    background: transparent !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head p {
    color: #d8c7a6 !important;
    -webkit-text-fill-color: #d8c7a6 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head > a {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 10px 18px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #c98318) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
    text-decoration: none !important;
    box-shadow: 0 12px 24px rgba(183,121,31,.22) !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card {
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 14px !important;
    border: 1px solid rgba(15,23,42,.14) !important;
    background: #ffffff !important;
    box-shadow: 0 10px 22px rgba(15,23,42,.06) !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-post.sp-social-post-card {
    border-color: rgba(245,183,59,.20) !important;
    background: linear-gradient(180deg, rgba(13,28,47,.98), rgba(7,19,33,.98)) !important;
    box-shadow: 0 16px 38px rgba(0,0,0,.24) !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-head {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 12px !important;
    align-items: center !important;
    padding: 14px 16px 10px !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-avatar {
    width: 44px !important;
    height: 44px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    border: 2px solid rgba(217,154,33,.62) !important;
    background: #071321 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author {
    min-width: 0 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong {
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 1000 !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author strong {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author small,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-author span {
    color: #657186 !important;
    -webkit-text-fill-color: #657186 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text {
    margin: 0 !important;
    padding: 4px 16px 14px !important;
    background: transparent !important;
    border: 0 !important;
    color: #1f2937 !important;
    -webkit-text-fill-color: #1f2937 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    font-weight: 700 !important;
}

html.dark body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text,
html[data-theme="dark"] body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text,
body.dark.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text,
body[data-theme="dark"].sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-text {
    color: #fff0cf !important;
    -webkit-text-fill-color: #fff0cf !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-media {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    border-top: 1px solid rgba(15,23,42,.08) !important;
    border-bottom: 1px solid rgba(15,23,42,.08) !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-media img {
    display: block !important;
    width: 100% !important;
    max-height: 460px !important;
    object-fit: contain !important;
    border-radius: 0 !important;
    background: #fff !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-stats,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-stats {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    border-bottom: 1px solid rgba(15,23,42,.10) !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
    padding: 6px 8px 8px !important;
    background: transparent !important;
    border: 0 !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions a,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions button {
    min-height: 38px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #526173 !important;
    -webkit-text-fill-color: #526173 !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
    text-decoration: none !important;
}

html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions a:hover,
html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions button:hover {
    background: rgba(245,183,59,.12) !important;
    color: #071321 !important;
    -webkit-text-fill-color: #071321 !important;
}

@media (max-width: 620px) {
    html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-home-feed-head {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions a,
    html body.sphere-app-body #sphere-feed-room.sp-home-feed-social .sp-social-post-actions button {
        font-size: 11.5px !important;
    }
}

/* HOME_FEED_LINKEDIN_FINAL_CLEAN_V1_END */

/* HOME_CLEAN_STABLE_VISUAL_BASE_V1
   Scope: Home only. Purpose: stabilize rightbar, people cards, light/dark readability.
   This is not a full redesign.
*/

html body.sphere-app-body .sp-dashboard {
    gap: 20px !important;
}

html body.sphere-app-body .sp-left,
html body.sphere-app-body .sp-right {
    min-width: 0 !important;
}

html body.sphere-app-body .sp-left .sp-card,
html body.sphere-app-body .sp-right .sp-card,
html body.sphere-app-body .sp-right .sp-panel,
html body.sphere-app-body .sp-right .sp-reputation {
    border-radius: 24px !important;
    overflow: hidden !important;
}

/* Rightbar titles: prevent giant broken words */
html body.sphere-app-body .sp-right .sp-panel-head h3,
html body.sphere-app-body .sp-right .sp-reputation-head strong,
html body.sphere-app-body .sp-right .sp-visibility h3 {
    font-size: 18px !important;
    line-height: 1.12 !important;
    letter-spacing: -.025em !important;
    max-width: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

html body.sphere-app-body .sp-right .sp-panel-head a,
html body.sphere-app-body .sp-right .sp-reputation-head a {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}

/* Recommended people cards */
html body.sphere-app-body .sp-right .sp-home-person {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    gap: 10px 12px !important;
    align-items: start !important;
    padding: 14px 12px !important;
    min-width: 0 !important;
    border-radius: 18px !important;
    border-bottom: 1px solid rgba(245,183,59,.14) !important;
}

html body.sphere-app-body .sp-right .sp-home-person > form,
html body.sphere-app-body .sp-right .sp-home-person > .sp-home-connect {
    grid-column: 2 !important;
    justify-self: start !important;
}

html body.sphere-app-body .sp-right .sp-home-person-main,
html body.sphere-app-body .sp-right .sp-home-person-main * {
    min-width: 0 !important;
}

html body.sphere-app-body .sp-right .sp-home-person-main a {
    font-size: 13px !important;
    line-height: 1.18 !important;
}

html body.sphere-app-body .sp-right .sp-home-person-main small {
    font-size: 11.5px !important;
    line-height: 1.25 !important;
}

html body.sphere-app-body .sp-right .sp-home-connect {
    min-height: 30px !important;
    padding: 7px 11px !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

/* Center people cards: premium but controlled */
html body.sphere-app-body .sp-sphere-person-card {
    min-width: 0 !important;
}

html body.sphere-app-body .sp-sphere-person-main,
html body.sphere-app-body .sp-sphere-person-main * {
    min-width: 0 !important;
}

/* Light mode explicit readable cards */
html[data-theme="light"] body.sphere-app-body .sp-left .sp-card,
html[data-theme="light"] body.sphere-app-body .sp-right .sp-card,
html[data-theme="light"] body.sphere-app-body .sp-right .sp-panel,
html[data-theme="light"] body.sphere-app-body .sp-right .sp-reputation,
body[data-theme="light"].sphere-app-body .sp-left .sp-card,
body[data-theme="light"].sphere-app-body .sp-right .sp-card,
body[data-theme="light"].sphere-app-body .sp-right .sp-panel,
body[data-theme="light"].sphere-app-body .sp-right .sp-reputation {
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.12), transparent 32%),
        linear-gradient(180deg, #fffaf0 0%, #f9edd7 100%) !important;
    color: #101828 !important;
    border-color: rgba(183,121,31,.20) !important;
}

html[data-theme="light"] body.sphere-app-body .sp-right .sp-home-person,
body[data-theme="light"].sphere-app-body .sp-right .sp-home-person {
    background: rgba(255,255,255,.58) !important;
    color: #101828 !important;
}

/* Dark mode explicit luxury cards */
html[data-theme="dark"] body.sphere-app-body .sp-left .sp-card,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-card,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-panel,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation,
body[data-theme="dark"].sphere-app-body .sp-left .sp-card,
body[data-theme="dark"].sphere-app-body .sp-right .sp-card,
body[data-theme="dark"].sphere-app-body .sp-right .sp-panel,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation {
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.10), transparent 32%),
        linear-gradient(180deg, #102035 0%, #071321 100%) !important;
    color: #fff4dc !important;
    border-color: rgba(245,183,59,.24) !important;
}

html[data-theme="dark"] body.sphere-app-body .sp-right .sp-home-person,
body[data-theme="dark"].sphere-app-body .sp-right .sp-home-person {
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.08), transparent 32%),
        rgba(255,255,255,.035) !important;
    color: #fff4dc !important;
}

/* Text colors in sidebars by mode */
html[data-theme="dark"] body.sphere-app-body .sp-left strong,
html[data-theme="dark"] body.sphere-app-body .sp-left h3,
html[data-theme="dark"] body.sphere-app-body .sp-left b,
html[data-theme="dark"] body.sphere-app-body .sp-right strong,
html[data-theme="dark"] body.sphere-app-body .sp-right h3,
html[data-theme="dark"] body.sphere-app-body .sp-right b,
body[data-theme="dark"].sphere-app-body .sp-left strong,
body[data-theme="dark"].sphere-app-body .sp-left h3,
body[data-theme="dark"].sphere-app-body .sp-left b,
body[data-theme="dark"].sphere-app-body .sp-right strong,
body[data-theme="dark"].sphere-app-body .sp-right h3,
body[data-theme="dark"].sphere-app-body .sp-right b {
    color: #fff4dc !important;
}

html[data-theme="dark"] body.sphere-app-body .sp-left small,
html[data-theme="dark"] body.sphere-app-body .sp-left span,
html[data-theme="dark"] body.sphere-app-body .sp-left p,
html[data-theme="dark"] body.sphere-app-body .sp-right small,
html[data-theme="dark"] body.sphere-app-body .sp-right span,
html[data-theme="dark"] body.sphere-app-body .sp-right p,
body[data-theme="dark"].sphere-app-body .sp-left small,
body[data-theme="dark"].sphere-app-body .sp-left span,
body[data-theme="dark"].sphere-app-body .sp-left p,
body[data-theme="dark"].sphere-app-body .sp-right small,
body[data-theme="dark"].sphere-app-body .sp-right span,
body[data-theme="dark"].sphere-app-body .sp-right p {
    color: #d8c59a !important;
}

/* Badges stay visible in both modes */
html body.sphere-app-body .sp-featured-profile-badge,
html body.sphere-app-body .sp-featured-author-badge,
html body.sphere-app-body .sp-home-sponsored-badge,
html body.sphere-app-body .sp-project-premium-badge {
    max-width: 100% !important;
    white-space: normal !important;
}
/* HOME_RIGHTBAR_LUXURY_PEOPLE_V1
   Audited target: Home rightbar recommended people block only.
   Improves luxury feel and fixes unreadable buttons/badges.
*/

html body.sphere-app-body .sp-right .sp-panel {
    position: relative !important;
    border-radius: 28px !important;
    border: 1px solid rgba(245,183,59,.32) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.16), transparent 34%),
        linear-gradient(180deg, rgba(12,27,46,.98), rgba(6,18,32,.98)) !important;
    box-shadow:
        0 24px 58px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html body.sphere-app-body .sp-right .sp-panel::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 20px !important;
    bottom: 20px !important;
    width: 3px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #ffe29a, #f5b73b, #b7791f) !important;
    opacity: .95 !important;
}

html body.sphere-app-body .sp-right .sp-panel-head {
    position: relative !important;
    z-index: 1 !important;
    align-items: center !important;
    margin-bottom: 16px !important;
}

html body.sphere-app-body .sp-right .sp-panel-head h3 {
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    font-size: 18px !important;
    line-height: 1.08 !important;
    font-weight: 1000 !important;
    letter-spacing: -.035em !important;
    max-width: 128px !important;
}

html body.sphere-app-body .sp-right .sp-panel-head a {
    min-height: 36px !important;
    padding: 9px 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 54%, #c98318) !important;
    color: #061426 !important;
    -webkit-text-fill-color: #061426 !important;
    border: 1px solid rgba(255,226,154,.55) !important;
    box-shadow: 0 12px 28px rgba(245,183,59,.24) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
}

/* Recommended person card */
html body.sphere-app-body .sp-right .sp-home-person {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 10px 12px !important;
    align-items: start !important;
    padding: 14px !important;
    margin: 0 0 10px !important;
    border-radius: 22px !important;
    border: 1px solid rgba(245,183,59,.22) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.11), transparent 34%),
        rgba(255,255,255,.035) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
    overflow: hidden !important;
}

html body.sphere-app-body .sp-right .sp-home-person:has(.sp-featured-profile-badge) {
    border-color: rgba(245,183,59,.48) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.22), transparent 36%),
        linear-gradient(180deg, rgba(22,38,61,.98), rgba(9,24,42,.98)) !important;
    box-shadow:
        0 16px 36px rgba(0,0,0,.22),
        0 0 24px rgba(245,183,59,.08) !important;
}

html body.sphere-app-body .sp-right .sp-home-person-avatar {
    width: 48px !important;
    height: 48px !important;
    border: 2px solid rgba(255,226,154,.55) !important;
    background:
        radial-gradient(circle at 34% 24%, #ffe8aa, transparent 30%),
        linear-gradient(135deg, #8a5a10, #d99a21 54%, #061426) !important;
    color: #fff4dc !important;
    box-shadow: 0 10px 24px rgba(245,183,59,.18) !important;
}

html body.sphere-app-body .sp-right .sp-home-person-main a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    color: #fff4dc !important;
    -webkit-text-fill-color: #fff4dc !important;
    font-size: 13px !important;
    line-height: 1.15 !important;
    font-weight: 1000 !important;
    max-width: 100% !important;
}

html body.sphere-app-body .sp-right .sp-home-person-main small {
    display: block !important;
    margin-top: 5px !important;
    color: #d8c59a !important;
    -webkit-text-fill-color: #d8c59a !important;
    font-size: 11.5px !important;
    line-height: 1.22 !important;
    font-weight: 750 !important;
}

/* Membership badge row */
html body.sphere-app-body .sp-right .sp-home-person .spm-badge-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    margin-top: 5px !important;
}

/* Make all membership badges readable in this block */
html body.sphere-app-body .sp-right .sp-home-person .spm-badge,
html body.sphere-app-body .sp-right .sp-home-person .spm-plan-badge,
html body.sphere-app-body .sp-right .sp-home-person [class*="membership-badge"],
html body.sphere-app-body .sp-right .sp-home-person [class*="plan-badge"] {
    min-height: 20px !important;
    padding: 4px 8px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 56%, #b7791f) !important;
    color: #061426 !important;
    -webkit-text-fill-color: #061426 !important;
    border: 1px solid rgba(255,226,154,.52) !important;
    font-size: 9.5px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    text-shadow: none !important;
    box-shadow: 0 7px 14px rgba(245,183,59,.15) !important;
}

/* Featured profile badge */
html body.sphere-app-body .sp-right .sp-home-person .sp-featured-profile-badge {
    display: inline-flex !important;
    align-items: center !important;
    width: max-content !important;
    max-width: 100% !important;
    min-height: 21px !important;
    margin-top: 5px !important;
    padding: 5px 9px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #fff6cc, #f5b73b 56%, #c98318) !important;
    color: #061426 !important;
    -webkit-text-fill-color: #061426 !important;
    border: 1px solid rgba(255,226,154,.58) !important;
    font-size: 9.8px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    text-shadow: none !important;
    box-shadow: 0 8px 18px rgba(245,183,59,.18) !important;
}

/* Follow buttons readable */
html body.sphere-app-body .sp-right .sp-home-person .sp-home-connect,
html body.sphere-app-body .sp-right .sp-home-person button.sp-home-connect {
    grid-column: 2 !important;
    justify-self: start !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 32px !important;
    min-width: 76px !important;
    max-width: 100% !important;
    margin-top: 8px !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,226,154,.55) !important;
    background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #b7791f) !important;
    color: #061426 !important;
    -webkit-text-fill-color: #061426 !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    text-shadow: none !important;
    box-shadow: 0 10px 20px rgba(245,183,59,.18) !important;
}

html body.sphere-app-body .sp-right .sp-home-person .sp-home-connect.is-following {
    background: linear-gradient(135deg, #fff6cc, #f5b73b) !important;
    color: #061426 !important;
    -webkit-text-fill-color: #061426 !important;
}

/* Light mode: keep premium but readable */
html[data-theme="light"] body.sphere-app-body .sp-right .sp-panel,
body[data-theme="light"].sphere-app-body .sp-right .sp-panel {
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.17), transparent 34%),
        linear-gradient(180deg, #fffaf0 0%, #f9edd7 100%) !important;
    border-color: rgba(183,121,31,.24) !important;
    box-shadow: 0 22px 54px rgba(92,64,16,.12) !important;
}

html[data-theme="light"] body.sphere-app-body .sp-right .sp-panel-head h3,
body[data-theme="light"].sphere-app-body .sp-right .sp-panel-head h3 {
    color: #061426 !important;
    -webkit-text-fill-color: #061426 !important;
}

html[data-theme="light"] body.sphere-app-body .sp-right .sp-home-person,
body[data-theme="light"].sphere-app-body .sp-right .sp-home-person {
    background:
        radial-gradient(circle at 100% 0%, rgba(245,183,59,.16), transparent 34%),
        rgba(255,255,255,.68) !important;
    border-color: rgba(183,121,31,.20) !important;
}

html[data-theme="light"] body.sphere-app-body .sp-right .sp-home-person-main a,
body[data-theme="light"].sphere-app-body .sp-right .sp-home-person-main a {
    color: #061426 !important;
    -webkit-text-fill-color: #061426 !important;
}

html[data-theme="light"] body.sphere-app-body .sp-right .sp-home-person-main small,
body[data-theme="light"].sphere-app-body .sp-right .sp-home-person-main small {
    color: #475467 !important;
    -webkit-text-fill-color: #475467 !important;
}

/* Small global luxury correction: section cards only, not layout-breaking */
html body.sphere-app-body .sp-section,
html body.sphere-app-body .sp-home-feed-room,
html body.sphere-app-body .sp-marketplace-boost-banner {
    border-color: rgba(245,183,59,.30) !important;
    box-shadow:
        0 24px 60px rgba(0,0,0,.22),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html[data-theme="light"] body.sphere-app-body .sp-section,
html[data-theme="light"] body.sphere-app-body .sp-home-feed-room,
html[data-theme="light"] body.sphere-app-body .sp-marketplace-boost-banner,
body[data-theme="light"].sphere-app-body .sp-section,
body[data-theme="light"].sphere-app-body .sp-home-feed-room,
body[data-theme="light"].sphere-app-body .sp-marketplace-boost-banner {
    box-shadow:
        0 24px 60px rgba(92,64,16,.12),
        inset 0 1px 0 rgba(255,255,255,.80) !important;
}

/* HOME_MOBILE_RIGHTBAR_LUXURY_PEOPLE_V1
   Audited mobile target:
   .sp-right .sp-panel + .sp-home-person + .sp-home-connect
*/

@media (max-width: 1023px) {
    html body.sphere-app-body .sp-dashboard {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    html body.sphere-app-body .sp-dashboard > .sp-left,
    html body.sphere-app-body .sp-dashboard > .sp-center,
    html body.sphere-app-body .sp-dashboard > .sp-right {
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
        top: auto !important;
    }

    html body.sphere-app-body .sp-dashboard > .sp-right {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        order: 3 !important;
    }

    html body.sphere-app-body .sp-right .sp-panel {
        border-radius: 26px !important;
        padding: 18px !important;
        border: 1px solid rgba(245,183,59,.32) !important;
        background:
            radial-gradient(circle at 100% 0%, rgba(245,183,59,.16), transparent 36%),
            linear-gradient(180deg, rgba(12,27,46,.98), rgba(6,18,32,.98)) !important;
        box-shadow: 0 20px 48px rgba(0,0,0,.24) !important;
    }

    html body.sphere-app-body .sp-right .sp-panel-head {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        margin-bottom: 14px !important;
    }

    html body.sphere-app-body .sp-right .sp-panel-head h3 {
        max-width: none !important;
        font-size: 20px !important;
        line-height: 1.05 !important;
        color: #fff4dc !important;
        -webkit-text-fill-color: #fff4dc !important;
    }

    html body.sphere-app-body .sp-right .sp-panel-head a {
        min-height: 36px !important;
        padding: 9px 13px !important;
        border-radius: 999px !important;
        background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #b7791f) !important;
        color: #061426 !important;
        -webkit-text-fill-color: #061426 !important;
        font-size: 12px !important;
        font-weight: 1000 !important;
        white-space: nowrap !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person {
        display: grid !important;
        grid-template-columns: 52px minmax(0, 1fr) !important;
        gap: 10px 12px !important;
        align-items: start !important;
        padding: 14px !important;
        margin-bottom: 10px !important;
        border-radius: 22px !important;
        border: 1px solid rgba(245,183,59,.24) !important;
        background:
            radial-gradient(circle at 100% 0%, rgba(245,183,59,.12), transparent 34%),
            rgba(255,255,255,.04) !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person-avatar {
        width: 52px !important;
        height: 52px !important;
        border: 2px solid rgba(255,226,154,.58) !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person-main {
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 5px !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person-main a {
        color: #fff4dc !important;
        -webkit-text-fill-color: #fff4dc !important;
        font-size: 14px !important;
        line-height: 1.15 !important;
        font-weight: 1000 !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person-main small {
        color: #d8c59a !important;
        -webkit-text-fill-color: #d8c59a !important;
        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person .spm-badge-row {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 5px !important;
        margin: 0 !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person .spm-badge,
    html body.sphere-app-body .sp-right .sp-home-person .spm-plan-badge,
    html body.sphere-app-body .sp-right .sp-home-person [class*="membership-badge"],
    html body.sphere-app-body .sp-right .sp-home-person [class*="plan-badge"],
    html body.sphere-app-body .sp-right .sp-home-person .sp-featured-profile-badge {
        display: inline-flex !important;
        align-items: center !important;
        width: max-content !important;
        max-width: 100% !important;
        min-height: 22px !important;
        padding: 5px 9px !important;
        border-radius: 999px !important;
        background: linear-gradient(135deg, #fff6cc, #f5b73b 56%, #c98318) !important;
        color: #061426 !important;
        -webkit-text-fill-color: #061426 !important;
        border: 1px solid rgba(255,226,154,.58) !important;
        font-size: 10px !important;
        line-height: 1 !important;
        font-weight: 1000 !important;
        text-shadow: none !important;
        box-shadow: 0 8px 18px rgba(245,183,59,.18) !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person > form,
    html body.sphere-app-body .sp-right .sp-home-person > .sp-home-connect {
        grid-column: 2 !important;
        justify-self: start !important;
        margin-top: 6px !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person .sp-home-connect,
    html body.sphere-app-body .sp-right .sp-home-person button.sp-home-connect {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 86px !important;
        min-height: 34px !important;
        padding: 9px 14px !important;
        border-radius: 999px !important;
        background: linear-gradient(135deg, #ffe29a, #f5b73b 55%, #b7791f) !important;
        color: #061426 !important;
        -webkit-text-fill-color: #061426 !important;
        border: 1px solid rgba(255,226,154,.58) !important;
        font-size: 12px !important;
        line-height: 1 !important;
        font-weight: 1000 !important;
        text-shadow: none !important;
        box-shadow: 0 10px 20px rgba(245,183,59,.18) !important;
    }
}

@media (max-width: 640px) {
    html body.sphere-app-body .sp-dashboard {
        padding-left: 10px !important;
        padding-right: 10px !important;
        gap: 14px !important;
    }

    html body.sphere-app-body .sp-right {
        gap: 14px !important;
    }

    html body.sphere-app-body .sp-right .sp-panel {
        padding: 16px !important;
        border-radius: 24px !important;
    }

    html body.sphere-app-body .sp-right .sp-panel-head h3 {
        font-size: 19px !important;
        max-width: 180px !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person {
        grid-template-columns: 48px minmax(0, 1fr) !important;
        padding: 13px !important;
        border-radius: 20px !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person-avatar {
        width: 48px !important;
        height: 48px !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person-main a {
        font-size: 13.5px !important;
    }

    html body.sphere-app-body .sp-right .sp-home-person-main small {
        font-size: 11.5px !important;
    }
}

/* Light mode mobile */
@media (max-width: 1023px) {
    html[data-theme="light"] body.sphere-app-body .sp-right .sp-panel,
    body[data-theme="light"].sphere-app-body .sp-right .sp-panel {
        background:
            radial-gradient(circle at 100% 0%, rgba(245,183,59,.18), transparent 36%),
            linear-gradient(180deg, #fffaf0 0%, #f9edd7 100%) !important;
        border-color: rgba(183,121,31,.24) !important;
        box-shadow: 0 20px 44px rgba(92,64,16,.12) !important;
    }

    html[data-theme="light"] body.sphere-app-body .sp-right .sp-panel-head h3,
    body[data-theme="light"].sphere-app-body .sp-right .sp-panel-head h3,
    html[data-theme="light"] body.sphere-app-body .sp-right .sp-home-person-main a,
    body[data-theme="light"].sphere-app-body .sp-right .sp-home-person-main a {
        color: #061426 !important;
        -webkit-text-fill-color: #061426 !important;
    }

    html[data-theme="light"] body.sphere-app-body .sp-right .sp-home-person-main small,
    body[data-theme="light"].sphere-app-body .sp-right .sp-home-person-main small {
        color: #475467 !important;
        -webkit-text-fill-color: #475467 !important;
    }

    html[data-theme="light"] body.sphere-app-body .sp-right .sp-home-person,
    body[data-theme="light"].sphere-app-body .sp-right .sp-home-person {
        background:
            radial-gradient(circle at 100% 0%, rgba(245,183,59,.14), transparent 34%),
            rgba(255,255,255,.72) !important;
        border-color: rgba(183,121,31,.22) !important;
    }
}

/* HOME_HERO_FLASH_VISIBLE_SINGLE_SLIDE_FIX_V1
   Fix visual flash: only the active hero background/copy slide may be visible.
   Previous accumulated layers forced all .sp-hero-bg-slide to opacity:1 on mobile.
*/
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-slide,
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-slide{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-slide.is-active,
html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-slide.is-active{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
}

html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-slide:not(.is-active){
    background-image:none!important;
}

@media(max-width:620px){
    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-slide,
    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-slide{
        opacity:0!important;
        visibility:hidden!important;
    }

    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-bg-slide.is-active,
    html body.sphere-app-body .sp-hero.sp-hero-filament .sp-hero-copy-slide.is-active{
        opacity:1!important;
        visibility:visible!important;
    }
}
/* HOME_HERO_FLASH_VISIBLE_SINGLE_SLIDE_FIX_V1_END */


/* HOME_REMOVE_DUPLICATED_PROFILE_BADGES_V1_DISABLED */


/* HOME_HIDE_ONLY_SECOND_DUPLICATE_BADGES_V1
   Oculta solo copias repetidas, no todos los badges.
   Mantiene visible el primer "Perfil destacado" y el primer "Perfil verificado".
*/

/* Left profile card: si hay dos badges/filas de perfil, oculta solo la segunda */
html body.sphere-app-body .sp-left .sp-featured-profile-badge + .sp-featured-profile-badge,
html body.sphere-app-body .sp-left .sp-featured-author-badge + .sp-featured-author-badge,
html body.sphere-app-body .sp-left .spm-badge-row + .spm-badge-row{
    display:none!important;
}

/* Reputation card: si Perfil verificado aparece dos veces seguidas, oculta solo el segundo */
html body.sphere-app-body .sp-right .sp-reputation .sp-featured-profile-badge + .sp-featured-profile-badge,
html body.sphere-app-body .sp-right .sp-reputation .sp-featured-author-badge + .sp-featured-author-badge,
html body.sphere-app-body .sp-right .sp-reputation .spm-badge-row + .spm-badge-row,
html body.sphere-app-body .sp-right .sp-reputation [class*="verified"] + [class*="verified"],
html body.sphere-app-body .sp-right .sp-reputation [class*="featured"] + [class*="featured"]{
    display:none!important;
}

/* Si el duplicado viene como dos chips dentro del mismo contenedor, deja el primero y oculta desde el segundo */
html body.sphere-app-body .sp-right .sp-reputation .spm-badge-row > * + *,
html body.sphere-app-body .sp-left .spm-badge-row > * + *{
    display:none!important;
}

/* HOME_HIDE_ONLY_SECOND_DUPLICATE_BADGES_V1_END */

/* HOME_HIDE_ONLY_MARKED_BADGES_V1
   Oculta SOLO lo marcado:
   1) Badge "Perfil destacado" debajo de Ver perfil en la tarjeta izquierda.
   2) Badge verde inferior "Perfil verificado" en Mi reputación.
   Mantiene visible el badge amarillo superior "Perfil verificado".
*/

/* Izquierda: solo el badge de perfil destacado del mini perfil superior */
html body.sphere-app-body .sp-left > .sp-card:first-child .sp-featured-profile-badge,
html body.sphere-app-body .sp-left > .sp-card:first-child .sp-featured-author-badge,
html body.sphere-app-body .sp-left > .sp-card:first-child .spm-badge-row{
    display:none!important;
}

/* Derecha: solo el badge inferior dentro de la última fila de Mi reputación */
html body.sphere-app-body .sp-right .sp-reputation > *:last-child .spm-badge-row,
html body.sphere-app-body .sp-right .sp-reputation > *:last-child .sp-featured-profile-badge,
html body.sphere-app-body .sp-right .sp-reputation > *:last-child .sp-featured-author-badge,
html body.sphere-app-body .sp-right .sp-reputation > *:last-child [class*="badge"],
html body.sphere-app-body .sp-right .sp-reputation > *:last-child [class*="verified"]{
    display:none!important;
}

/* Fallback: si la fila inferior es un contenedor con "1 evaluación", oculta solo su badge, no el texto */
html body.sphere-app-body .sp-right .sp-reputation *:has(> small):last-child .spm-badge-row,
html body.sphere-app-body .sp-right .sp-reputation *:has(> small):last-child .sp-featured-profile-badge,
html body.sphere-app-body .sp-right .sp-reputation *:has(> small):last-child .sp-featured-author-badge,
html body.sphere-app-body .sp-right .sp-reputation *:has(> small):last-child [class*="badge"],
html body.sphere-app-body .sp-right .sp-reputation *:has(> small):last-child [class*="verified"]{
    display:none!important;
}

/* HOME_HIDE_ONLY_MARKED_BADGES_V1_END */

/* HOME_HIDE_LEFT_PROFILE_FEATURED_BADGE_ONLY_V1
   Oculta SOLO el texto/chip "Perfil destacado" del mini perfil superior izquierdo.
   No toca Mi reputación ni Personas recomendadas.
*/
html body.sphere-app-body .sp-left > .sp-card:first-child a[href*="profile"] + .sp-featured-profile-badge,
html body.sphere-app-body .sp-left > .sp-card:first-child a[href*="profile"] + .sp-featured-author-badge,
html body.sphere-app-body .sp-left > .sp-card:first-child a[href*="profile"] + .spm-badge-row,
html body.sphere-app-body .sp-left > .sp-card:first-child a[href*="profile"] + span,
html body.sphere-app-body .sp-left > .sp-card:first-child a[href*="profile"] + small,
html body.sphere-app-body .sp-left > .sp-card:first-child a[href*="profile"] + em{
    display:none!important;
}
/* HOME_HIDE_LEFT_PROFILE_FEATURED_BADGE_ONLY_V1_END */

/* HOME_REPUTATION_LUXURY_CARD_FINAL_V1
   Luxury redesign only for the right sidebar reputation card.
   Scope: .sp-right .sp-reputation only.
*/
html body.sphere-app-body .sp-right .sp-reputation{
    position:relative!important;
    overflow:hidden!important;
    border-radius:30px!important;
    border:1px solid rgba(217,154,33,.38)!important;
    background:
        radial-gradient(circle at 92% 12%,rgba(255,226,154,.38),transparent 26%),
        radial-gradient(circle at 10% 0%,rgba(217,154,33,.18),transparent 34%),
        linear-gradient(180deg,#fff9ec 0%,#fff1d6 48%,#f5dfb4 100%)!important;
    box-shadow:
        0 28px 70px rgba(92,64,16,.18),
        inset 0 1px 0 rgba(255,255,255,.86),
        inset 0 0 0 1px rgba(255,255,255,.28)!important;
    padding:24px 22px 18px!important;
    color:#132033!important;
}

html body.sphere-app-body .sp-right .sp-reputation::before{
    content:""!important;
    position:absolute!important;
    left:0!important;
    top:22px!important;
    bottom:22px!important;
    width:4px!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#fff2bd,#d99a21 52%,#9b6512)!important;
    box-shadow:0 0 28px rgba(217,154,33,.35)!important;
}

html body.sphere-app-body .sp-right .sp-reputation::after{
    content:""!important;
    position:absolute!important;
    right:-46px!important;
    top:-46px!important;
    width:148px!important;
    height:148px!important;
    border-radius:999px!important;
    background:radial-gradient(circle,rgba(255,255,255,.54),rgba(245,183,59,.20) 42%,transparent 70%)!important;
    pointer-events:none!important;
}

html body.sphere-app-body .sp-right .sp-reputation-head,
html body.sphere-app-body .sp-right .sp-reputation > header,
html body.sphere-app-body .sp-right .sp-reputation .sp-panel-head{
    position:relative!important;
    z-index:2!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:start!important;
    gap:14px!important;
    margin:0 0 22px!important;
    padding:0 0 18px!important;
    border-bottom:1px solid rgba(151,103,20,.16)!important;
}

html body.sphere-app-body .sp-right .sp-reputation h3,
html body.sphere-app-body .sp-right .sp-reputation h2,
html body.sphere-app-body .sp-right .sp-reputation strong{
    color:#101827!important;
    -webkit-text-fill-color:#101827!important;
    text-shadow:none!important;
}

html body.sphere-app-body .sp-right .sp-reputation h3,
html body.sphere-app-body .sp-right .sp-reputation h2{
    margin:0!important;
    font-size:20px!important;
    line-height:1.05!important;
    font-weight:1000!important;
    letter-spacing:-.04em!important;
}

html body.sphere-app-body .sp-right .sp-reputation a{
    color:#6f4700!important;
    -webkit-text-fill-color:#6f4700!important;
    font-weight:900!important;
    text-decoration:none!important;
}

html body.sphere-app-body .sp-right .sp-reputation a:hover{
    color:#111827!important;
    text-decoration:underline!important;
}

html body.sphere-app-body .sp-right .sp-reputation p,
html body.sphere-app-body .sp-right .sp-reputation span,
html body.sphere-app-body .sp-right .sp-reputation small{
    color:#516173!important;
    -webkit-text-fill-color:#516173!important;
    font-weight:800!important;
}

html body.sphere-app-body .sp-right .sp-reputation .sp-reputation-score,
html body.sphere-app-body .sp-right .sp-reputation [class*="score"],
html body.sphere-app-body .sp-right .sp-reputation [class*="rating"]{
    position:relative!important;
    z-index:2!important;
    width:86px!important;
    height:86px!important;
    min-width:86px!important;
    border-radius:999px!important;
    display:grid!important;
    place-items:center!important;
    background:
        radial-gradient(circle at 32% 22%,#ffffff 0%,#fff8e7 42%,#f3d99c 100%)!important;
    border:3px solid rgba(255,226,154,.78)!important;
    box-shadow:
        0 18px 40px rgba(217,154,33,.24),
        inset 0 1px 0 rgba(255,255,255,.9)!important;
    color:#0f172a!important;
    -webkit-text-fill-color:#0f172a!important;
    font-size:30px!important;
    line-height:1!important;
    font-weight:1000!important;
    letter-spacing:-.04em!important;
}

html body.sphere-app-body .sp-right .sp-reputation-row,
html body.sphere-app-body .sp-right .sp-reputation [class*="row"],
html body.sphere-app-body .sp-right .sp-reputation li{
    position:relative!important;
    z-index:2!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    min-height:38px!important;
    padding:9px 0!important;
    border-bottom:1px solid rgba(151,103,20,.14)!important;
    color:#516173!important;
}

html body.sphere-app-body .sp-right .sp-reputation-row:last-child,
html body.sphere-app-body .sp-right .sp-reputation [class*="row"]:last-child,
html body.sphere-app-body .sp-right .sp-reputation li:last-child{
    border-bottom:0!important;
}

html body.sphere-app-body .sp-right .sp-reputation-row b,
html body.sphere-app-body .sp-right .sp-reputation [class*="row"] b,
html body.sphere-app-body .sp-right .sp-reputation li b{
    color:#101827!important;
    -webkit-text-fill-color:#101827!important;
    font-weight:1000!important;
}

html body.sphere-app-body .sp-right .sp-reputation .sp-featured-profile-badge,
html body.sphere-app-body .sp-right .sp-reputation .sp-featured-author-badge,
html body.sphere-app-body .sp-right .sp-reputation .spm-badge-row,
html body.sphere-app-body .sp-right .sp-reputation [class*="verified"],
html body.sphere-app-body .sp-right .sp-reputation [class*="badge"]{
    position:relative!important;
    z-index:3!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:26px!important;
    padding:6px 11px!important;
    border-radius:999px!important;
    border:1px solid rgba(217,154,33,.34)!important;
    background:linear-gradient(135deg,#fff7d8,#f2c85f 55%,#d99a21)!important;
    color:#2a1802!important;
    -webkit-text-fill-color:#2a1802!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:1000!important;
    box-shadow:0 10px 22px rgba(217,154,33,.16)!important;
}

/* keep only the upper yellow verified badge; lower repeated badge stays hidden */
html body.sphere-app-body .sp-right .sp-reputation > *:last-child .spm-badge-row,
html body.sphere-app-body .sp-right .sp-reputation > *:last-child .sp-featured-profile-badge,
html body.sphere-app-body .sp-right .sp-reputation > *:last-child .sp-featured-author-badge,
html body.sphere-app-body .sp-right .sp-reputation > *:last-child [class*="verified"],
html body.sphere-app-body .sp-right .sp-reputation > *:last-child [class*="badge"]{
    display:none!important;
}

html.dark body.sphere-app-body .sp-right .sp-reputation,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation,
body.dark.sphere-app-body .sp-right .sp-reputation,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation{
    background:
        radial-gradient(circle at 92% 12%,rgba(255,226,154,.20),transparent 28%),
        radial-gradient(circle at 10% 0%,rgba(217,154,33,.18),transparent 34%),
        linear-gradient(180deg,#172233 0%,#101b2b 52%,#091421 100%)!important;
    border-color:rgba(245,201,92,.40)!important;
    box-shadow:
        0 28px 70px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.06)!important;
}

html.dark body.sphere-app-body .sp-right .sp-reputation h3,
html.dark body.sphere-app-body .sp-right .sp-reputation h2,
html.dark body.sphere-app-body .sp-right .sp-reputation strong,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation h3,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation h2,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation strong,
body.dark.sphere-app-body .sp-right .sp-reputation h3,
body.dark.sphere-app-body .sp-right .sp-reputation h2,
body.dark.sphere-app-body .sp-right .sp-reputation strong,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation h3,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation h2,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation strong{
    color:#fff7df!important;
    -webkit-text-fill-color:#fff7df!important;
}

html.dark body.sphere-app-body .sp-right .sp-reputation p,
html.dark body.sphere-app-body .sp-right .sp-reputation span,
html.dark body.sphere-app-body .sp-right .sp-reputation small,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation p,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation span,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation small,
body.dark.sphere-app-body .sp-right .sp-reputation p,
body.dark.sphere-app-body .sp-right .sp-reputation span,
body.dark.sphere-app-body .sp-right .sp-reputation small,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation p,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation span,
body[data-theme="dark"].sphere-app-body .sp-right .sp-reputation small{
    color:#d8c9a7!important;
    -webkit-text-fill-color:#d8c9a7!important;
}

@media(max-width:1023px){
    html body.sphere-app-body .sp-right .sp-reputation{
        border-radius:26px!important;
        padding:20px 18px 16px!important;
    }
}
/* HOME_REPUTATION_LUXURY_CARD_FINAL_V1_END */

/* HOME_REPUTATION_FEATURED_BADGE_TAG_V1
   Mi reputación: convierte "Perfil destacado" en etiqueta luxury.
   No toca Personas recomendadas ni el badge amarillo de Perfil verificado.
*/
html body.sphere-app-body .sp-right .sp-reputation > :first-child{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:start!important;
    gap:8px 14px!important;
}

html body.sphere-app-body .sp-right .sp-reputation > :first-child h2,
html body.sphere-app-body .sp-right .sp-reputation > :first-child h3,
html body.sphere-app-body .sp-right .sp-reputation > :first-child strong{
    grid-column:1!important;
    margin:0!important;
}

html body.sphere-app-body .sp-right .sp-reputation > :first-child a{
    display:inline-flex!important;
    width:max-content!important;
    max-width:100%!important;
    margin-top:2px!important;
    color:#6f4700!important;
    -webkit-text-fill-color:#6f4700!important;
    font-size:12px!important;
    line-height:1!important;
    font-weight:950!important;
    text-decoration:underline!important;
    text-underline-offset:3px!important;
}

/* Perfil destacado como etiqueta */
html body.sphere-app-body .sp-right .sp-reputation > :first-child .sp-featured-profile-badge,
html body.sphere-app-body .sp-right .sp-reputation > :first-child .sp-featured-author-badge,
html body.sphere-app-body .sp-right .sp-reputation > :first-child .spm-badge-row,
html body.sphere-app-body .sp-right .sp-reputation > :first-child a + span,
html body.sphere-app-body .sp-right .sp-reputation > :first-child a + small,
html body.sphere-app-body .sp-right .sp-reputation > :first-child a + em{
    grid-column:1!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:24px!important;
    margin-top:5px!important;
    padding:5px 10px!important;
    border-radius:999px!important;
    border:1px solid rgba(217,154,33,.38)!important;
    background:linear-gradient(135deg,#fff7d8,#f4ca62 58%,#d99a21)!important;
    color:#2a1802!important;
    -webkit-text-fill-color:#2a1802!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:1000!important;
    font-style:normal!important;
    text-decoration:none!important;
    box-shadow:0 10px 22px rgba(217,154,33,.16)!important;
    white-space:nowrap!important;
}

html body.sphere-app-body .sp-right .sp-reputation > :first-child .sp-featured-profile-badge::before,
html body.sphere-app-body .sp-right .sp-reputation > :first-child .sp-featured-author-badge::before,
html body.sphere-app-body .sp-right .sp-reputation > :first-child .spm-badge-row::before,
html body.sphere-app-body .sp-right .sp-reputation > :first-child a + span::before,
html body.sphere-app-body .sp-right .sp-reputation > :first-child a + small::before,
html body.sphere-app-body .sp-right .sp-reputation > :first-child a + em::before{
    content:"✦"!important;
    margin-right:5px!important;
    color:#7c4a03!important;
    -webkit-text-fill-color:#7c4a03!important;
}

/* mantiene el score 5.0 a la derecha */
html body.sphere-app-body .sp-right .sp-reputation > :first-child [class*="score"],
html body.sphere-app-body .sp-right .sp-reputation > :first-child [class*="rating"]{
    grid-column:2!important;
    grid-row:1 / span 3!important;
    align-self:start!important;
}

/* HOME_REPUTATION_FEATURED_BADGE_TAG_V1_END */

/* HOME_REPUTATION_VERIFIED_PILL_READABLE_V1
   Fix exacto: etiqueta "Perfil verificado" dentro de Mi reputación.
   La deja legible, tipo luxury pill, sin tocar Personas recomendadas.
*/
html body.sphere-app-body .sp-right .sp-reputation .spm-badge-row,
html body.sphere-app-body .sp-right .sp-reputation .sp-featured-profile-badge,
html body.sphere-app-body .sp-right .sp-reputation .sp-featured-author-badge,
html body.sphere-app-body .sp-right .sp-reputation [class*="verified"],
html body.sphere-app-body .sp-right .sp-reputation [class*="badge"]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:max-content!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:24px!important;
    padding:6px 12px!important;
    border-radius:999px!important;
    border:1px solid rgba(255,226,154,.72)!important;
    background:linear-gradient(135deg,#fff7d6 0%,#f6c453 58%,#d99a21 100%)!important;
    color:#101827!important;
    -webkit-text-fill-color:#101827!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:1000!important;
    letter-spacing:-.01em!important;
    text-shadow:none!important;
    box-shadow:
        0 10px 24px rgba(217,154,33,.22),
        inset 0 1px 0 rgba(255,255,255,.72)!important;
    opacity:1!important;
    filter:none!important;
    visibility:visible!important;
    white-space:nowrap!important;
}

html body.sphere-app-body .sp-right .sp-reputation .spm-badge-row *,
html body.sphere-app-body .sp-right .sp-reputation .sp-featured-profile-badge *,
html body.sphere-app-body .sp-right .sp-reputation .sp-featured-author-badge *,
html body.sphere-app-body .sp-right .sp-reputation [class*="verified"] *,
html body.sphere-app-body .sp-right .sp-reputation [class*="badge"] *{
    color:#101827!important;
    -webkit-text-fill-color:#101827!important;
    text-shadow:none!important;
    opacity:1!important;
}

/* en modo oscuro se mantiene dorada y legible */
html.dark body.sphere-app-body .sp-right .sp-reputation .spm-badge-row,
html.dark body.sphere-app-body .sp-right .sp-reputation .sp-featured-profile-badge,
html.dark body.sphere-app-body .sp-right .sp-reputation .sp-featured-author-badge,
html.dark body.sphere-app-body .sp-right .sp-reputation [class*="verified"],
html.dark body.sphere-app-body .sp-right .sp-reputation [class*="badge"],
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation .spm-badge-row,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation .sp-featured-profile-badge,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation .sp-featured-author-badge,
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation [class*="verified"],
html[data-theme="dark"] body.sphere-app-body .sp-right .sp-reputation [class*="badge"],
body.dark.sphere-app-body .sp-right .sp-reputation .spm-badge-row,
body.dark.sphere-app-body .sp-right .sp-reputation .sp-featured-profile-badge,
body.dark.sphere-app-body .sp-right .sp-reputation .sp-featured-author-badge,
body.dark.sphere-app-body .sp-right .sp-reputation [class*="verified"],
body.dark.sphere-app-body .sp-right .sp-reputation [class*="badge"]{
    background:linear-gradient(135deg,#fff2bd 0%,#f6c453 56%,#b7791f 100%)!important;
    border-color:rgba(255,232,164,.82)!important;
    color:#071321!important;
    -webkit-text-fill-color:#071321!important;
}
/* HOME_REPUTATION_VERIFIED_PILL_READABLE_V1_END */
