/*
 * SC4 Experience Styles (Stage 2 Engagement)
 *
 * What: Visual styles for Experience module UI pieces (cards, buttons, likes/follows, feed app).
 * Called by: Enqueued via Modules\Experience\Engine::enqueue_frontend_assets().
 * Touches: No DB. Pure CSS.
 */
.sc4-feed{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:16px 0}

/* Inbox: reduce visual noise by pinning to 3 columns on desktop.
 * The generic .sc4-feed uses auto-fit which can create many small tiles.
 */
.sc4-feed.sc4-inbox{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width: 980px){
  .sc4-feed.sc4-inbox{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 640px){
  .sc4-feed.sc4-inbox{grid-template-columns:1fr}
}
.sc4-card{border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:14px;background:rgba(0,0,0,.68);backdrop-filter:blur(6px);box-shadow:0 10px 30px rgba(0,0,0,.35);color:rgba(255,255,255,.94);box-sizing:border-box;width:100%;max-width:100%}
.sc4-card--panel{max-width:880px;margin:16px 0}
.sc4-card-h{display:flex;align-items:center;gap:8px;font-weight:750;margin-bottom:8px;text-shadow:0 1px 0 rgba(0,0,0,.35)}
.sc4-card-h a{text-decoration:none;color:inherit}

/* Right-aligned micro actions inside headers (e.g., Save) */
.sc4-card-h .sc4-h-actions{margin-left:auto;display:flex;align-items:center;gap:8px}

/* Save / bookmark toggle */
.sc4-save-toggle{white-space:nowrap}
.sc4-save-toggle.is-saved{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.35)}

/* Saved items page ([sc4_saved]) */
.sc4-saved-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:0}
.sc4-saved-list{list-style:none;margin:0;padding:0}
.sc4-saved-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid rgba(255,255,255,.08)}
.sc4-saved-item:first-child{border-top:0}
.sc4-saved-link{text-decoration:none;color:inherit;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sc4-saved-link:hover{text-decoration:underline}

/* Release cards: keep title + Save button on same row */
.scd-release-title-row{display:flex;gap:10px;align-items:flex-start}
.scd-release-title-row .sc4-save-toggle{margin-left:auto}
.sc4-card-b{font-size:14px;line-height:1.4;opacity:.92}
.sc4-badge{font-size:11px;letter-spacing:.08em;opacity:.8}
.sc4-date{margin-left:auto;font-size:12px;opacity:.7}
.sc4-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.30);cursor:pointer;text-decoration:none;color:inherit;text-shadow:0 1px 0 rgba(0,0,0,.35)}
.sc4-btn:hover{background:rgba(0,0,0,.42)}
.sc4-muted{opacity:.75}
.sc4-item{padding:10px 0;border-top:1px solid rgba(255,255,255,.08)}
.sc4-item:first-child{border-top:0}
.sc4-item-h{display:flex;gap:8px;align-items:center;font-weight:650}
.sc4-item-b{font-size:13px;opacity:.9;margin-top:4px}
.sc4-follow-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.sc4-follow-count{min-width:28px}

/* Engagement support heading */
.sc4-support-cta{display:flex;flex-direction:column;gap:8px;margin:10px 0}
.sc4-support-h{margin:0;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.78}

/* Likes widget (lightweight engagement) */
.sc4-like{display:flex;flex-direction:column;gap:10px;margin:0}
.sc4-like-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sc4-like-count{min-width:28px}

/* Tooltip: shown on the count bubble (data-sc4-tip) */
.sc4-pill[data-sc4-tip]{position:relative;cursor:help}
.sc4-pill[data-sc4-tip]:hover::after{content:attr(data-sc4-tip);position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% + 8px);white-space:nowrap;max-width:280px;overflow:hidden;text-overflow:ellipsis;padding:8px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.92);color:rgba(255,255,255,.94);font-size:12px;box-shadow:0 10px 30px rgba(0,0,0,.35);z-index:20}
.sc4-pill[data-sc4-tip]:hover::before{content:'';position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% + 2px);border:6px solid transparent;border-top-color:rgba(255,255,255,.18);filter:drop-shadow(0 10px 30px rgba(0,0,0,.35));z-index:21}


/* Feed App (two-column activity UI) */
.sc4-feed-app{display:grid;grid-template-columns:2fr 3fr;gap:16px;margin:16px 0}
.sc4-feed-app-left{min-width:0}
.sc4-feed-app-right{min-width:0}
.sc4-feed-nav{border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(0,0,0,.40);backdrop-filter:blur(6px);padding:10px}
.sc4-nav-h{margin:12px 8px 6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.sc4-nav-empty{margin:6px 8px 10px;font-size:12px;opacity:.75}
.sc4-nav-item{width:100%;text-align:left;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.20);color:inherit;cursor:pointer;margin:6px 0;text-shadow:0 1px 0 rgba(0,0,0,.35)}
.sc4-nav-item:hover{background:rgba(255,255,255,.06)}
.sc4-nav-item.is-active{border-color:rgba(255,255,255,.22);background:rgba(0,0,0,.32)}
.sc4-feed-app-pane .sc4-feed{margin:0}
.sc4-feed-app-actions{display:flex;justify-content:center;margin-top:10px}

/* Activity feed: use Discography grid/card styling when available. */
.sc4-activity-grid{padding-top:0 !important;gap:16px !important;margin:0 !important}
.sc4-feed-app-pane .scd-discography-grid{margin:0}
.sc4-update-ex{font-size:13px;line-height:1.4;opacity:.92;margin-top:4px}

@media (max-width: 860px){
  .sc4-feed-app{grid-template-columns:1fr}
}

/* Feed / Inbox header + badge */
.sc4-feed-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0 10px}
.sc4-feed-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.sc4-feed-title{font-size:18px;font-weight:800;letter-spacing:.02em;text-shadow:0 1px 0 rgba(0,0,0,.35)}
.sc4-pill{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 7px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid rgba(255,255,255,.22);background:rgba(0,0,0,.4)}
.sc4-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:rgba(255,72,72,.95);margin-left:8px;flex:0 0 auto}
.sc4-dot--title{margin-left:10px;position:relative;top:-1px}
.sc4-nav-h{display:flex;align-items:center;justify-content:space-between;gap:10px}
.sc4-nav-item{display:flex;align-items:center;justify-content:space-between;gap:10px}

.sc4-inbox .sc4-card.is-read{opacity:.78}
.sc4-inbox .sc4-card.is-unread{border-color:rgba(255,255,255,.22)}
/* Inbox cards: add subtle Abrasive color + depth without becoming loud.
 * Scope is tight (.sc4-inbox) so other cards remain unchanged.
 */
.sc4-inbox .sc4-card{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(180deg, rgba(22,22,22,.82) 0%, rgba(0,0,0,.66) 62%);transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease}
.sc4-inbox .sc4-card>*{position:relative;z-index:2}
.sc4-inbox .sc4-card::before{content:'';position:absolute;inset:-1px;background:radial-gradient(800px circle at 12% -30%, rgba(255,60,90,.22), transparent 55%),radial-gradient(600px circle at 110% 15%, rgba(255,150,60,.12), transparent 58%);opacity:.55;pointer-events:none;z-index:1}
.sc4-inbox .sc4-card::after{content:'';position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg, rgba(255,60,90,.90), rgba(255,150,60,.45), rgba(255,255,255,0));opacity:.18;pointer-events:none;z-index:1}
.sc4-inbox .sc4-card:hover{transform:translateY(-2px);box-shadow:0 16px 46px rgba(0,0,0,.52);border-color:rgba(255,255,255,.22)}
.sc4-inbox .sc4-card.is-unread{border-color:rgba(255,60,90,.46);box-shadow:0 16px 46px rgba(0,0,0,.52)}
.sc4-inbox .sc4-card.is-unread::after{opacity:.78}
.sc4-inbox .sc4-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,60,90,.14);font-size:10px;font-weight:900;letter-spacing:.10em;opacity:.92}
.sc4-inbox .sc4-card-h{gap:10px;font-size:13px}
.sc4-inbox .sc4-card-h a{font-weight:900}
.sc4-inbox .sc4-date{opacity:.6}
.sc4-inbox .sc4-card-b{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sc4-inbox .sc4-h-actions{display:inline-flex;align-items:center;gap:8px;margin-left:auto}
.sc4-notif-dismiss{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.36);color:rgba(255,255,255,.85);cursor:pointer;line-height:1;font-size:18px;padding:0}
.sc4-notif-dismiss:hover{border-color:rgba(255,255,255,.28);background:rgba(0,0,0,.52)}
.sc4-notif-dismiss:active{transform:translateY(1px)}
.sc4-notif.is-removing{opacity:.35;pointer-events:none;transition:opacity .12s ease}


/* Universal profile nav shell */
.sc4-profile-nav{margin:6px 0 14px}
.sc4-profile-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.sc4-btn.is-active{border-color:rgba(255,255,255,.30);background:rgba(0,0,0,.48)}

/* Profile surfaces: two-column spread */
.sc4-profile{padding:0 18px}

/*
  Profile surfaces use *native* WordPress Columns markup/classes.
  We intentionally do NOT override .wp-block-columns display/layout here.
  Only safe guard: prevent long content from forcing a column wider than its track.
*/
.sc4-profile-columns.wp-block-columns{margin-top:14px;gap:24px;column-gap:24px;row-gap:24px}
/* Some themes (and WP core) implement Columns spacing via margins on the child
   columns. Since we use gap above, neutralize child margins so cards don't
   butt up against each other (or double-gap). */
.sc4-profile-columns.wp-block-columns>.wp-block-column{min-width:0;box-sizing:border-box;margin:0 !important}

/*
  Enforce the intended 40/60 split for SC4 profile surfaces.
  Some themes override core Columns sizing; we scope this tightly so it
  won’t affect other Gutenberg Columns.
*/
.sc4-profile-columns.wp-block-columns>.sc4-profile-left{flex:0 0 40% !important;max-width:40% !important}
.sc4-profile-columns.wp-block-columns>.sc4-profile-right{flex:0 0 60% !important;max-width:60% !important}

@media (max-width: 781px){
  .sc4-profile-columns.wp-block-columns>.sc4-profile-left,
  .sc4-profile-columns.wp-block-columns>.sc4-profile-right{flex:0 0 100% !important;max-width:100% !important}
}

/* fix029: Release Companion Panel */
.sc4-release-companion{margin:18px 0}
.sc4-release-companion .sc4-card-h{letter-spacing:.08em;text-transform:uppercase}
.sc4-companion{display:flex;flex-direction:column;gap:14px}
.sc4-companion-section{padding:12px 12px 10px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.03)}
.sc4-companion-h{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.82;margin-bottom:8px}
.sc4-companion-b .sc4-item{padding:10px 0}
.sc4-mini-card{display:flex;gap:12px;text-decoration:none;padding:10px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.18)}
.sc4-mini-card:hover{background:rgba(255,255,255,.06)}
.sc4-mini-cover{width:64px;height:64px;border-radius:12px;background-size:cover;background-position:center;flex:0 0 auto;border:1px solid rgba(255,255,255,.10)}
.sc4-mini-meta{min-width:0}
.sc4-mini-title{font-weight:750;line-height:1.2}
.sc4-mini-ex{font-size:12px;opacity:.86;margin-top:4px}
.sc4-strip{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.sc4-strip-card{display:flex;flex-direction:column;gap:8px;min-width:148px;text-decoration:none;padding:10px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.18)}
.sc4-strip-card:hover{background:rgba(255,255,255,.06)}
.sc4-strip-cover{width:100%;height:96px;border-radius:12px;background-size:cover;background-position:center;border:1px solid rgba(255,255,255,.10)}
.sc4-strip-title{font-size:13px;font-weight:650;line-height:1.2;opacity:.92}



/* fix049: profile columns overflow guard */
.sc4-profile .sc4-card--panel{max-width:none}
.sc4-profile-columns .wp-block-column{min-width:0}

/* fix193: public member directory + public member profiles */
.sc4-members-layout{display:grid;grid-template-columns:minmax(240px,33%) 1fr;gap:16px;align-items:start}
.sc4-members-layout__rail{min-width:0}
.sc4-members-layout__main{min-width:0}

/* fix198: public member profile two-column shell (33/67) */
.sc4-member-layout{display:grid;grid-template-columns:minmax(240px,33%) 1fr;gap:16px;align-items:start;margin:16px 0}
.sc4-member-layout__rail{min-width:0}
.sc4-member-layout__main{min-width:0}

/* Activity rail: modern carousel (arrows + scroll-snap) */
.sc4-carousel-shell{position:relative}
.sc4-carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.55);color:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px);z-index:2}
.sc4-carousel-arrow:hover{background:rgba(255,255,255,.08)}
.sc4-carousel-arrow:disabled{opacity:.25;cursor:default}
.sc4-carousel-prev{left:4px}
.sc4-carousel-next{right:4px}
.sc4-carousel-shell:not(.sc4-carousel-can-scroll) .sc4-carousel-arrow{display:none}

.sc4-activity-strip{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:44px;padding:2px 44px 6px;scrollbar-width:none}
.sc4-activity-strip::-webkit-scrollbar{display:none}
.sc4-activity-card{scroll-snap-align:start}
.sc4-activity-card{display:flex;flex-direction:column;gap:8px;min-width:200px;max-width:240px;text-decoration:none;padding:10px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.18);box-sizing:border-box}
.sc4-activity-card:hover{background:rgba(255,255,255,.06)}
.sc4-activity-title{font-size:13px;font-weight:750;line-height:1.2;opacity:.95}
.sc4-activity-meta{font-size:12px;opacity:.78;display:flex;gap:8px;align-items:center}
.sc4-activity-badge{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.7}

/* Modal: view-all activity */
.sc4-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:99999;padding:18px}
.sc4-modal.is-open{display:flex}
html.sc4-modal-open{overflow:hidden}
.sc4-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(4px)}
.sc4-modal__panel{position:relative;width:min(920px,100%);max-height:85vh;overflow:hidden;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.92);box-shadow:0 20px 60px rgba(0,0,0,.6);display:flex;flex-direction:column}
.sc4-modal__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px 10px;border-bottom:1px solid rgba(255,255,255,.10)}
.sc4-modal__title{font-size:14px;font-weight:800;letter-spacing:.02em}
.sc4-modal__close{border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35);color:inherit;border-radius:12px;padding:8px 10px;cursor:pointer}
.sc4-modal__close:hover{background:rgba(255,255,255,.06)}
.sc4-modal__body{padding:12px 14px 14px;overflow:auto}
.sc4-modal__pager{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}

/* Modal list rows */
.sc4-activity-list{display:flex;flex-direction:column;gap:10px}
.sc4-activity-row{display:flex;flex-direction:column;gap:6px;text-decoration:none;padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.18)}
.sc4-activity-row:hover{background:rgba(255,255,255,.06)}
.sc4-activity-row__top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.sc4-activity-row__title{font-weight:800;line-height:1.2}
.sc4-activity-row__badge{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.sc4-activity-row__meta,.sc4-activity-row__date{font-size:12px;opacity:.85}

@media (max-width: 860px){
  .sc4-members-layout{grid-template-columns:1fr}
  .sc4-member-layout{grid-template-columns:1fr}
}
.sc4-members-search__row{display:flex;gap:10px;align-items:center}
.sc4-members-search__input{flex:1;min-width:0;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:inherit}
.sc4-members-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.sc4-member-card{display:flex;gap:12px;text-decoration:none;padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.18)}
.sc4-member-card:hover{background:rgba(255,255,255,.06)}
.sc4-member-card__avatar{width:54px;height:54px;border-radius:14px;background-size:cover;background-position:center;flex:0 0 auto;border:1px solid rgba(255,255,255,.10)}
.sc4-member-card__meta{min-width:0}
.sc4-member-card__name{font-weight:750;line-height:1.2}
.sc4-member-card__slug{font-size:12px;margin-top:4px}
.sc4-members-pager{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:14px}

.sc4-member-head{display:flex;gap:14px;align-items:center;padding:14px 14px 0}
.sc4-member-head__avatar{width:72px;height:72px;border-radius:18px;background-size:cover;background-position:center;flex:0 0 auto;border:1px solid rgba(255,255,255,.12)}
.sc4-member-head__name{font-size:20px;font-weight:800;line-height:1.1}
.sc4-member-head__slug{font-size:12px;margin-top:6px}
.sc4-member-back{margin:0 0 12px}
.sc4-member-section{margin:14px 0}
.sc4-member-section__h{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.82;margin-bottom:8px}
.sc4-member-section__b{padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.03)}
.sc4-member-kv{width:100%;border-collapse:collapse}
.sc4-member-kv th{width:140px;text-align:left;font-weight:700;opacity:.9;padding:6px 8px}
.sc4-member-kv td{padding:6px 8px;opacity:.9}
.sc4-member-tags{display:flex;flex-wrap:wrap;gap:8px}
.sc4-member-tag{padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.16);font-size:12px;opacity:.92}
.sc4-member-links{display:flex;flex-wrap:wrap;gap:8px}
.sc4-member-follow-block{margin:10px 0}
.sc4-member-follow-label{margin-bottom:6px}
.sc4-member-follow-items{display:flex;flex-wrap:wrap;gap:8px}

.sc4-member-activity-block{margin:14px 0}
.sc4-member-activity-block__h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.sc4-member-activity-block__title{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.82}
.sc4-member-activity-empty{margin:0 0 6px}



/* fix196: sc4_members AJAX search/pagination */
.sc4-members-results.is-loading{
  opacity: .65;
  pointer-events: none;
}

/* fix211: notifications digest UI */
.sc4-digest{ position: relative; }
.sc4-digest-head{ margin-bottom: 6px; }
.sc4-digest-tabs{ display:flex; flex-wrap:wrap; gap:10px; margin: 10px 0 14px; }
.sc4-tab{ appearance:none; border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.22); color:inherit; border-radius:999px; padding:8px 12px; font-size:13px; cursor:pointer; }
.sc4-tab:hover{ background:rgba(0,0,0,.30); }
.sc4-tab.is-active{ border-color:rgba(255,255,255,.22); background:rgba(255,255,255,.06); }
.sc4-digest-list{ display:flex; flex-direction:column; gap:12px; }
.sc4-digest-item.is-unread{ box-shadow: 0 0 0 1px rgba(255,255,255,.10) inset; }
.sc4-pill{ display:inline-flex; align-items:center; justify-content:center; min-width:22px; padding:3px 8px; border-radius:999px; font-size:12px; border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.20); opacity:.92; }
.sc4-digest-link{ text-decoration:none; }
.sc4-digest-link:hover{ text-decoration:underline; }

/* Toast */
.sc4-toast{ position: fixed; left: 12px; right: 12px; bottom: 14px; z-index: 99999; }
.sc4-toast-inner{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.16); background:rgba(0,0,0,.78); backdrop-filter: blur(6px); box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.sc4-toast-text{ font-size:13px; opacity:.95; }
.sc4-toast-btn{ white-space:nowrap; }
.sc4-icon-btn.sc4-toast-x{ width:32px; height:32px; border-radius:10px; border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.22); color:inherit; cursor:pointer; }
.sc4-icon-btn.sc4-toast-x:hover{ background:rgba(0,0,0,.30); }

/* fix212: artist/project hub pages */
.sc4-hub{ margin: 10px 0 26px; }
.sc4-hub__header{ margin-bottom: 12px; }
.sc4-hub__grid{ display:grid; grid-template-columns: 1fr; gap: 14px; }
.sc4-hub__section{ border:1px solid rgba(255,255,255,.10); background:rgba(0,0,0,.16); border-radius:16px; padding: 12px; }
.sc4-hub__title{ margin:0 0 10px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; opacity:.82; }
.sc4-hub__list{ display:flex; flex-direction:column; gap:10px; }
.sc4-hub__item{ text-decoration:none; color:inherit; border:1px solid rgba(255,255,255,.08); background:rgba(0,0,0,.18); border-radius:14px; padding:10px 12px; }
.sc4-hub__item:hover{ background:rgba(0,0,0,.26); }
.sc4-hub__item-title{ font-size:14px; margin-bottom:4px; }
.sc4-hub__item-meta{ font-size:12px; opacity:.78; }
.sc4-hub__item-excerpt{ margin-top:6px; font-size:13px; opacity:.92; }
.sc4-hub__empty{ font-size:13px; opacity:.82; }

.sc4-project-hub__headerInner{ display:flex; gap: 12px; align-items:flex-start; }
.sc4-project-hub__hero{ width: 104px; flex: 0 0 104px; }
.sc4-hub__hero-img{ width:100%; height:auto; border-radius:14px; border:1px solid rgba(255,255,255,.08); }
.sc4-project-hub__title{ margin: 2px 0 6px; font-size:20px; }
.sc4-project-hub__excerpt{ font-size:13px; opacity:.92; margin-top: 8px; }
.sc4-project-hub__follow{ margin-top: 8px; }
.sc4-project-hub__content{ font-size: 14px; line-height: 1.5; }

@media (min-width: 900px){
  .sc4-hub__grid{ grid-template-columns: 1.2fr .8fr; align-items:start; }
}



/* fix214: micro-ux polish pack (skeletons, empty states, button consistency) */

.sc4-btn{ min-height: 38px; }
.sc4-btn.sc4-btn-sm{ min-height: 30px; padding-top: 6px; padding-bottom: 6px; }

.sc4-empty-state{
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.28);
}
.sc4-empty-state .sc4-empty-title{ font-weight: 700; margin-bottom: 6px; }
.sc4-empty-state .sc4-empty-sub{ opacity: 0.85; }

/* Skeleton loader */
@keyframes sc4Shimmer{
  0%{ background-position: -420px 0; }
  100%{ background-position: 420px 0; }
}
.sc4-skeleton-card{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  padding: 12px;
}
.sc4-skeleton{
  display: block;
  height: 12px;
  border-radius: 10px;
  background: linear-gradient(90deg,
    rgba(255,255,255,0.06) 0%,
    rgba(255,255,255,0.12) 45%,
    rgba(255,255,255,0.06) 100%);
  background-size: 840px 100%;
  animation: sc4Shimmer 1.2s linear infinite;
}
.sc4-skeleton.sm{ height: 10px; }
.sc4-skeleton.lg{ height: 16px; }

.sc4-members-results.is-loading{
  position: relative;
}
.sc4-members-results.is-loading::after{
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.20);
  border-radius: 14px;
  pointer-events: none;
}

/* Feed + digest: subtle loading hint */
.sc4-feed-app-pane.is-loading, .sc4-notif-pane.is-loading{
  opacity: 0.75;
}