/* MUSIC FM — public member profile refinement
   Keeps the original profile identity, ranks, achievement colours and data.
   This file is an override layer loaded after member-social.css. */

.member-social-page{
  background:linear-gradient(180deg,var(--mf-signature-page-top,#eef4f9) 0,var(--mf-signature-page,#f3f6f9) 210px,var(--mf-signature-page,#f3f6f9) 100%)!important;
  color:var(--mf-signature-ink,#102541)!important;
}
.member-social-page .mf-member{
  --member-navy:var(--mf-signature-navy,#041327);
  --member-navy-2:var(--mf-signature-navy-2,#071d37);
  --member-blue:var(--mf-signature-blue,#147cff);
  --member-blue-deep:var(--mf-signature-blue-deep,#0d5fc2);
  --member-sky:var(--mf-signature-sky,#59c7ff);
  --member-cyan:var(--mf-ui-turquoise,#25c8c3);
  --member-purple:#7865e8;
  --member-red:#e34b64;
  --member-ink:var(--mf-signature-ink,#102541);
  --member-muted:var(--mf-signature-muted,#66778c);
  --member-line:var(--mf-signature-line,rgba(16,37,65,.105));
  --member-line-soft:var(--mf-signature-line-soft,rgba(16,37,65,.07));
  font-family:var(--mf-font,"IBM Plex Sans Hebrew","IBM Plex Sans Hebrew",Arial,sans-serif)!important;
  color:var(--member-ink)!important;
  padding-bottom:72px;
}
.member-social-page .mf-member *{font-family:inherit}
.member-social-page .mf-member :is(a,button){-webkit-tap-highlight-color:transparent}

/* Cover */
.member-social-page .mf-member-cover{
  height:230px;
  background:linear-gradient(120deg,#041327 0,#08243e 64%,#0b4359 100%)!important;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.member-social-page .mf-member-cover::before{
  background:radial-gradient(circle at 18% 20%,rgba(89,199,255,.17),transparent 35%),linear-gradient(115deg,transparent 0 66%,rgba(37,200,195,.06) 66% 100%)!important;
}
.member-social-page .mf-member-cover::after{height:94px;background:linear-gradient(180deg,transparent,rgba(4,19,39,.55))!important}
.member-social-page .mf-member-cover__photo{filter:saturate(.92) contrast(1.02);transition:transform 1.05s cubic-bezier(.22,.61,.36,1)!important}
.member-social-page .mf-member-cover__wash{background:linear-gradient(90deg,rgba(4,19,39,.76),rgba(4,19,39,.28) 52%,rgba(4,19,39,.58))!important}
.member-social-page .mf-member-cover__lines{opacity:.34!important}
.member-social-page .mf-member-cover__brand{direction:rtl;color:#fff!important;padding-top:28px}
.member-social-page .mf-member-cover__brand>span{color:#fff!important;letter-spacing:.09em}
.member-social-page .mf-member-cover__brand>small{color:#bcd2e3!important;letter-spacing:.06em}
@media (hover:hover) and (pointer:fine){
  .member-social-page .mf-member-cover:hover .mf-member-cover__photo{transform:scale(1.018)!important}
}

/* Header / identity */
.member-social-page .mf-member-head{background:#fff!important;border-bottom:1px solid var(--member-line)!important;box-shadow:var(--mf-signature-shadow-xs,0 1px 2px rgba(4,19,39,.025),0 5px 14px rgba(4,19,39,.025))!important}
.member-social-page .mf-member-head__inner{min-height:158px;grid-template-columns:auto minmax(0,1fr) auto;gap:24px;align-items:start}
.member-social-page .mf-member-avatar{
  width:138px;height:138px;margin-top:-56px;border:5px solid #fff!important;border-radius:5px!important;
  background:#eaf2f8!important;box-shadow:0 10px 27px rgba(4,19,39,.13)!important;padding:0;appearance:none;
}
.member-social-page button.mf-member-avatar{cursor:zoom-in}
.member-social-page .mf-member-avatar>span:first-child{color:#315b7d!important;font-size:44px}
.member-social-page .mf-member-avatar img{transition:transform .72s cubic-bezier(.22,.61,.36,1)!important}
.member-social-page .mf-member-avatar__hint{
  position:absolute!important;left:7px!important;bottom:7px!important;width:27px!important;height:27px!important;z-index:4!important;
  display:grid!important;place-items:center!important;border:1px solid rgba(255,255,255,.35)!important;border-radius:50%!important;
  background:rgba(4,19,39,.68)!important;color:#fff!important;opacity:0;transform:translateY(3px);transition:opacity .42s ease,transform .42s ease!important;
}
.member-social-page .mf-member-avatar__hint .mf-icon{width:12px;height:12px}
@media (hover:hover) and (pointer:fine){
  .member-social-page .mf-member-avatar--viewable:hover img{transform:scale(1.025)!important}
  .member-social-page .mf-member-avatar--viewable:hover .mf-member-avatar__hint{opacity:1;transform:none}
}
.member-social-page .mf-member-identity{padding-top:23px}
.member-social-page .mf-member-identity h1{font-size:clamp(29px,2.6vw,37px)!important;line-height:1.12!important;letter-spacing:-.035em!important;color:var(--member-ink)!important}
.member-social-page .mf-member-meta{margin-top:9px!important;color:#718398!important;font-size:10px!important;gap:7px 15px!important}
.member-social-page .mf-member-meta span{color:#718398!important}
.member-social-page .mf-member-meta .mf-icon{color:#6d93b2!important}
.member-social-page .mf-member-bio{max-width:720px;color:#52677d!important;font-size:13px!important;line-height:1.72!important;margin-top:12px!important}

/* Keep profile title/rank accent colours alive. */
.member-social-page .mf-member-badge{border-radius:4px!important;padding:5px 8px!important;font-size:9px!important;box-shadow:none!important}
.member-social-page .mf-member-badge--artist{background:#edf9fc!important;border-color:#cfe8f3!important;color:#0c6f9d!important}
.member-social-page .mf-member-level-chip{border-radius:4px!important;box-shadow:none!important}
.member-social-page .mf-member[data-member-accent="accent-cyan"] .mf-member-level-chip,
.member-social-page .mf-member[data-member-accent="accent-cyan"] .mf-member-badge--title{background:rgba(34,211,238,.11)!important;border-color:rgba(34,211,238,.35)!important;color:#087c92!important}
.member-social-page .mf-member[data-member-accent="accent-purple"] .mf-member-level-chip,
.member-social-page .mf-member[data-member-accent="accent-purple"] .mf-member-badge--title{background:rgba(118,82,255,.10)!important;border-color:rgba(118,82,255,.30)!important;color:#5940bf!important}
.member-social-page .mf-member[data-member-accent="accent-platinum"] .mf-member-level-chip,
.member-social-page .mf-member[data-member-accent="accent-platinum"] .mf-member-badge--title{background:linear-gradient(135deg,rgba(229,239,249,.75),rgba(183,205,228,.36))!important;border-color:#c8d8e7!important;color:#385877!important}

/* One button system — same height, typography and calm response. */
.member-social-page .mf-member-head__actions{align-self:center;display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:7px;padding-top:7px}
.member-social-page .mf-member-action,
.member-social-page .mf-member-primary,
.member-social-page .mf-member-secondary,
.member-social-page .mf-member-danger,
.member-social-page .mf-member-card__artist-button{
  min-height:42px!important;height:42px!important;border-radius:4px!important;padding:0 15px!important;font-size:10.5px!important;font-weight:850!important;
  box-shadow:none!important;transform:none!important;transition:background-color .34s ease,border-color .34s ease,color .34s ease,opacity .34s ease!important;
}
.member-social-page .mf-member-action{border:1px solid #d6e0e8!important;background:#fff!important;color:#38536c!important}
.member-social-page .mf-member-action:hover{border-color:#bdcfdd!important;background:#f7fafc!important;color:#193e5d!important;transform:none!important}
.member-social-page .mf-member-action--primary{background:var(--member-navy)!important;border-color:var(--member-navy)!important;color:#fff!important}
.member-social-page .mf-member-action--primary:hover{background:#092440!important;border-color:#092440!important;color:#fff!important}
.member-social-page .mf-member-action--follow.is-following{background:#eef6fb!important;border-color:#c9dce9!important;color:#245c82!important}
.member-social-page .mf-member-action .mf-icon{width:14px!important;height:14px!important}

/* Tabs & stats */
.member-social-page .mf-member-head__bottom{min-height:64px;border-top:1px solid #edf1f4!important;gap:24px}
.member-social-page .mf-member-tabs{gap:4px}
.member-social-page .mf-member-tabs a{min-height:64px;padding:0 14px!important;color:#6c7e91!important;font-size:10.5px!important}
.member-social-page .mf-member-tabs a::after{height:2px!important;background:linear-gradient(90deg,var(--member-blue),var(--member-sky))!important;transition:transform .42s cubic-bezier(.22,.61,.36,1)!important}
.member-social-page .mf-member-tabs a:is(:hover,.is-active){color:#173a59!important}
.member-social-page .mf-member-stats>span{min-width:94px;padding:10px 16px!important;border-inline-start:1px solid #edf1f4!important}
.member-social-page .mf-member-stats strong{color:#173b5d!important;font-size:16px!important}
.member-social-page .mf-member-stats small{color:#8997a6!important;font-size:8.5px!important}

/* Main layout */
.member-social-page .mf-member-layout{grid-template-columns:minmax(0,1fr) 340px;gap:24px;padding-top:24px}
.member-social-page .mf-member-side{gap:14px;top:112px}
.member-social-page .mf-member-card,
.member-social-page .mf-member-composer,
.member-social-page .mf-member-post{
  border-radius:5px!important;border:1px solid var(--member-line)!important;background:#fff;box-shadow:var(--mf-signature-shadow-xs,0 1px 2px rgba(4,19,39,.025),0 5px 14px rgba(4,19,39,.025))!important;
}
.member-social-page .mf-member-card{padding:18px!important}
.member-social-page .mf-member-card header{border-bottom:1px solid #edf1f4!important}
.member-social-page .mf-member-card header::after{width:38px!important;background:linear-gradient(90deg,var(--member-blue),var(--member-sky))!important}
.member-social-page .mf-member-card header>small,
.member-social-page .mf-member-section-head small{color:#238cbd!important;letter-spacing:.11em!important}
.member-social-page .mf-member-card h2,
.member-social-page .mf-member-section-head h2{color:#183b59!important}
.member-social-page .mf-member-card__bio{color:#566c80!important}
.member-social-page .mf-member-card__muted{color:#8494a3!important}
.member-social-page .mf-member-post{transition:border-color .45s ease!important}
.member-social-page .mf-member-post:hover{transform:none!important;box-shadow:var(--mf-signature-shadow-xs,0 1px 2px rgba(4,19,39,.025),0 5px 14px rgba(4,19,39,.025))!important;border-color:#cfdce6!important}

/* Level keeps its colour and identity. */
.member-social-page .mf-member-card--level{background:linear-gradient(180deg,#fff,#fbfdff)!important}
.member-social-page .mf-member-level{border-radius:5px!important;border:1px solid #dfe9f1!important;background:#f7fbfe!important}
.member-social-page .mf-member-level__seal{border-radius:5px!important;background:linear-gradient(145deg,#071d35,#0c4164)!important;color:#fff!important;box-shadow:none!important}
.member-social-page .mf-member-level__seal span,
.member-social-page .mf-member-level__seal strong{color:#fff!important}
.member-social-page .mf-member-level__copy strong{color:#183b59!important}
.member-social-page .mf-member-level__copy p{color:#74879a!important}
.member-social-page .mf-member-xp__track{background:#e4edf4!important;border-radius:2px!important}
.member-social-page .mf-member-xp__track i{background:linear-gradient(90deg,var(--member-blue),var(--member-sky),var(--member-cyan))!important;border-radius:2px!important;box-shadow:none!important}
.member-social-page .mf-member-rank-roadmap__list>div{border-radius:4px!important;background:#f8fbfd!important;border:1px solid #e1e9f0!important}

/* Achievements — restore tier colours instead of flattening them. */
.member-social-page .mf-member-card--universe{background:linear-gradient(145deg,#fff 0,#f8fbff 100%)!important;overflow:hidden}
.member-social-page .mf-member-card--universe::after{display:block!important;background:radial-gradient(circle,rgba(38,202,232,.10),transparent 68%)!important}
.member-social-page .mf-member-universe-stats{gap:8px!important;border:0!important}
.member-social-page .mf-member-universe-stats span{border:1px solid #e0e9f0!important;border-radius:5px!important;background:#fff!important}
.member-social-page .mf-member-universe-stats strong{color:#153b5d!important}
.member-social-page .mf-member-achievement-row{gap:8px!important}
.member-social-page .mf-member-achievement-row>div{border-radius:5px!important;border:1px solid #dfe8ef!important;background:#fff!important;padding:11px!important}
.member-social-page .mf-member-achievement-row>div>span{border-radius:4px!important;background:linear-gradient(135deg,#0a2b4b,#1d6aa1)!important;color:#a9efff!important;box-shadow:none!important}
.member-social-page .mf-member-achievement-row>div[data-tier="gold"]{background:#fffcf3!important;border-color:#ead9a8!important}
.member-social-page .mf-member-achievement-row>div[data-tier="gold"]>span{background:linear-gradient(135deg,#6b5117,#c99a33)!important;color:#fff5c7!important}
.member-social-page .mf-member-achievement-row>div[data-tier="platinum"]{background:#f7f9fc!important;border-color:#cfd9e4!important}
.member-social-page .mf-member-achievement-row>div[data-tier="platinum"]>span{background:linear-gradient(135deg,#33465f,#6b7890)!important;color:#f3f8ff!important}
.member-social-page .mf-member-achievement-row>div[data-tier="diamond"]{background:#f7f6ff!important;border-color:#d6d0f4!important}
.member-social-page .mf-member-achievement-row>div[data-tier="diamond"]>span{background:linear-gradient(135deg,#28384f,#6558d9)!important;color:#e9fbff!important}
.member-social-page .mf-member-achievement-row strong{color:#28475f!important}
.member-social-page .mf-member-achievement-row small{color:#8595a4!important}
.member-social-page .mf-member-universe-links a{border-radius:4px!important;background:#edf5fc!important;color:#195f9e!important}

/* Dark weekly block — every token is explicitly light. */
.member-social-page .mf-member-weekly-badge{
  border-radius:5px!important;background:linear-gradient(135deg,#061a31,#0c3152)!important;border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:none!important;color:#fff!important;
}
.member-social-page .mf-member-weekly-badge>span{border-radius:4px!important;background:rgba(89,199,255,.10)!important;border:1px solid rgba(139,227,255,.22)!important;color:#9be9ff!important}
.member-social-page .mf-member-weekly-badge small{color:#75dff8!important}
.member-social-page .mf-member-weekly-badge strong{color:#fff!important}
.member-social-page .mf-member-weekly-badge p{color:#b9cad9!important}

/* Artist card remains a premium dark identity block — with correct contrast. */
.member-social-page .mf-member-card--artist{
  background:linear-gradient(145deg,#071b31 0,#0a3150 58%,#0a5060 100%)!important;border-color:rgba(255,255,255,.08)!important;color:#fff!important;
}
.member-social-page .mf-member-card--artist header{border-bottom-color:rgba(255,255,255,.12)!important}
.member-social-page .mf-member-card--artist header::after{background:linear-gradient(90deg,#59c7ff,#25c8c3)!important}
.member-social-page .mf-member-card--artist header>small{color:#75dff8!important}
.member-social-page .mf-member-card--artist h2,
.member-social-page .mf-member-card--artist strong{color:#fff!important}
.member-social-page .mf-member-card--artist p,
.member-social-page .mf-member-card--artist .mf-member-artist-card__identity span{color:#c6d8e6!important}
.member-social-page .mf-member-card--artist .mf-member-card__link{color:#9be9ff!important}
.member-social-page .mf-member-artist-card__seal{background:rgba(89,199,255,.12)!important;border-color:rgba(139,227,255,.2)!important;color:#9be9ff!important}

/* Other dark / coloured components — force safe contrast. */
.member-social-page :is(.mf-member-level__seal,.mf-member-weekly-badge,.mf-member-card--artist) :is(h1,h2,h3,strong,b){text-shadow:none}
.member-social-page :is(.mf-member-level__seal,.mf-member-weekly-badge,.mf-member-card--artist) a:not(.mf-member-card__link){color:#fff!important}

/* Music DNA / connections keep current site's quiet image-only motion. */
.member-social-page .mf-music-dna-block{border-radius:5px!important;border:1px solid #e0e8ef!important;background:#fff!important;box-shadow:none!important}
.member-social-page .mf-music-dna-cover,
.member-social-page .mf-music-dna-artists a>span{border-radius:5px!important;overflow:hidden!important;box-shadow:none!important}
.member-social-page .mf-music-dna-cover img,
.member-social-page .mf-music-dna-artists img{transition:transform .72s cubic-bezier(.22,.61,.36,1)!important}
@media (hover:hover) and (pointer:fine){
  .member-social-page .mf-music-dna-song:hover .mf-music-dna-cover img,
  .member-social-page .mf-music-dna-artists a:hover img{transform:scale(1.022)!important}
}
.member-social-page .mf-music-dna-song:hover,
.member-social-page .mf-member-people a:hover{transform:none!important;box-shadow:none!important}
.member-social-page .mf-member-people a{border-radius:5px!important}

/* Avatar viewer — quiet full-screen gallery, same visual language as current */
html.mf-member-avatar-viewer-open,
html.mf-member-avatar-viewer-open body{overflow:hidden!important;overscroll-behavior:none!important}

.mf-member-avatar-viewer[hidden]{display:none!important}
.mf-member-avatar-viewer{
  position:fixed!important;
  inset:0!important;
  z-index:12050!important;
  display:block!important;
  padding:0!important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  isolation:isolate;
  transition:opacity .58s cubic-bezier(.22,.61,.36,1),visibility .58s linear;
}
.mf-member-avatar-viewer.is-open{opacity:1;visibility:visible;pointer-events:auto}

/* A real full viewport layer — deliberately not a button, so global button styles can never deform it. */
.mf-member-avatar-viewer__backdrop{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:rgba(3,15,29,.84)!important;
  box-shadow:none!important;
  transform:none!important;
  opacity:0;
  backdrop-filter:blur(10px) saturate(.82);
  -webkit-backdrop-filter:blur(10px) saturate(.82);
  transition:opacity .62s cubic-bezier(.22,.61,.36,1)!important;
  cursor:zoom-out;
}
.mf-member-avatar-viewer.is-open .mf-member-avatar-viewer__backdrop{opacity:1}

.mf-member-avatar-viewer__dialog{
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  height:100dvh!important;
  min-height:100vh!important;
  margin:0!important;
  padding:max(16px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  gap:8px!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  transform:none!important;
  overflow:hidden!important;
}

.mf-member-avatar-viewer__bar{
  width:min(1040px,100%)!important;
  min-height:54px!important;
  margin:0 auto!important;
  padding:0 2px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  background:transparent!important;
  opacity:0;
  transform:translateY(-5px);
  transition:opacity .52s .08s cubic-bezier(.22,.61,.36,1),transform .58s .08s cubic-bezier(.22,.61,.36,1)!important;
}
.mf-member-avatar-viewer.is-open .mf-member-avatar-viewer__bar{opacity:1;transform:none}

.mf-member-avatar-viewer__identity{display:grid!important;gap:1px!important;min-width:0!important;text-align:right!important}
.mf-member-avatar-viewer__identity span{color:#87a3bd!important;font-size:10px!important;font-weight:700!important;letter-spacing:.08em!important;line-height:1.4!important}
.mf-member-avatar-viewer__identity strong{color:#f5f9fc!important;font-size:14px!important;font-weight:700!important;line-height:1.5!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

.mf-member-avatar-viewer__close{
  all:unset!important;
  box-sizing:border-box!important;
  flex:0 0 auto!important;
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:4px!important;
  background:rgba(255,255,255,.055)!important;
  color:#f6fbff!important;
  box-shadow:none!important;
  cursor:pointer!important;
  transition:background-color .42s ease,border-color .42s ease,color .42s ease!important;
}
.mf-member-avatar-viewer__close:hover,
.mf-member-avatar-viewer__close:focus-visible{
  background:rgba(255,255,255,.10)!important;
  border-color:rgba(255,255,255,.30)!important;
  color:#fff!important;
  transform:none!important;
  box-shadow:none!important;
}
.mf-member-avatar-viewer__close:focus-visible{outline:2px solid rgba(84,190,255,.72)!important;outline-offset:3px!important}
.mf-member-avatar-viewer__close .mf-icon{width:16px!important;height:16px!important;display:block!important}

.mf-member-avatar-viewer__figure{
  width:min(1040px,100%)!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:10px 0 4px!important;
  display:grid!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  gap:10px!important;
  place-items:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.mf-member-avatar-viewer__media{
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:100%!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  opacity:0;
  transform:translateY(10px) scale(.987);
  transition:opacity .62s .06s cubic-bezier(.22,.61,.36,1),transform .72s .06s cubic-bezier(.22,.61,.36,1)!important;
}
.mf-member-avatar-viewer.is-open .mf-member-avatar-viewer__media{opacity:1;transform:none}

.mf-member-avatar-viewer__media img{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:min(820px,88vw)!important;
  max-height:calc(100dvh - 128px)!important;
  object-fit:contain!important;
  border:0!important;
  border-radius:5px!important;
  background:#08192b!important;
  box-shadow:0 18px 48px rgba(0,0,0,.24)!important;
  transform:none!important;
  transition:none!important;
}
.mf-member-avatar-viewer__figure figcaption{
  margin:0!important;
  padding:0!important;
  color:#b8c9d8!important;
  font-size:11px!important;
  font-weight:650!important;
  line-height:1.5!important;
  text-align:center!important;
  opacity:0;
  transform:translateY(4px);
  transition:opacity .5s .16s ease,transform .58s .16s cubic-bezier(.22,.61,.36,1)!important;
}
.mf-member-avatar-viewer.is-open .mf-member-avatar-viewer__figure figcaption{opacity:1;transform:none}

@media(max-width:700px){
  .mf-member-avatar-viewer__dialog{
    padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;
  }
  .mf-member-avatar-viewer__bar{min-height:50px!important;padding-bottom:8px!important}
  .mf-member-avatar-viewer__identity span{font-size:9px!important}
  .mf-member-avatar-viewer__identity strong{font-size:13px!important}
  .mf-member-avatar-viewer__close{width:40px!important;height:40px!important}
  .mf-member-avatar-viewer__figure{padding-top:6px!important;gap:8px!important}
  .mf-member-avatar-viewer__media img{
    max-width:94vw!important;
    max-height:calc(100dvh - 108px)!important;
    border-radius:4px!important;
    box-shadow:0 14px 36px rgba(0,0,0,.22)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .mf-member-avatar-viewer,
  .mf-member-avatar-viewer__backdrop,
  .mf-member-avatar-viewer__bar,
  .mf-member-avatar-viewer__media,
  .mf-member-avatar-viewer__figure figcaption{transition:none!important;transform:none!important}
}

/* Tablet */
@media(max-width:1080px){
  .member-social-page .mf-member-head__inner{grid-template-columns:auto minmax(0,1fr)}
  .member-social-page .mf-member-head__actions{grid-column:2;grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));padding:0 0 18px;width:min(430px,100%)}
  .member-social-page .mf-member-action{width:100%}
  .member-social-page .mf-member-layout{grid-template-columns:minmax(0,1fr) 310px;gap:18px}
}

/* Mobile — app-like hierarchy, no squeezed desktop controls. */
@media(max-width:820px){
  .member-social-page .mf-member{padding-bottom:96px}
  .member-social-page .mf-member-cover{height:158px}
  .member-social-page .mf-member-cover__brand{padding-top:20px}
  .member-social-page .mf-member-cover__lines{display:none!important}
  .member-social-page .mf-member-head__inner{display:grid!important;grid-template-columns:86px minmax(0,1fr)!important;gap:13px!important;min-height:0!important;padding-bottom:0!important}
  .member-social-page .mf-member-avatar{width:86px;height:86px;margin-top:-29px;border-width:4px!important}
  .member-social-page .mf-member-avatar>span:first-child{font-size:30px}
  .member-social-page .mf-member-avatar__hint{opacity:1;transform:none;width:24px!important;height:24px!important;left:5px!important;bottom:5px!important}
  .member-social-page .mf-member-identity{padding-top:14px!important}
  .member-social-page .mf-member-identity h1{font-size:25px!important}
  .member-social-page .mf-member-bio{font-size:12px!important;line-height:1.62!important}
  .member-social-page .mf-member-head__actions{
    grid-column:1/-1!important;position:static!important;width:100%!important;padding:14px 0 16px!important;background:transparent!important;border:0!important;
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;overflow:visible!important;
  }
  .member-social-page .mf-member-action{width:100%!important;height:40px!important;min-height:40px!important;padding:0 10px!important;font-size:10px!important}
  .member-social-page .mf-member-head__bottom{margin-top:0!important;display:block!important;min-height:0!important}
  .member-social-page .mf-member-tabs{height:50px!important;overflow-x:auto!important;padding-inline:18px!important;scrollbar-width:none!important;border-bottom:1px solid #edf1f4!important}
  .member-social-page .mf-member-tabs::-webkit-scrollbar{display:none}
  .member-social-page .mf-member-tabs a{min-height:50px!important;padding-inline:12px!important;white-space:nowrap!important;font-size:9.5px!important}
  .member-social-page .mf-member-stats{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;width:100%!important;overflow:visible!important;padding:0!important;border-top:0!important}
  .member-social-page .mf-member-stats>span{min-width:0!important;padding:10px 5px!important;align-items:center!important;text-align:center!important;border-inline-start:1px solid #edf1f4!important}
  .member-social-page .mf-member-stats>span:first-child{border-inline-start:0!important}
  .member-social-page .mf-member-stats strong{font-size:14px!important}
  .member-social-page .mf-member-stats small{font-size:7.6px!important;line-height:1.2!important}
  .member-social-page .mf-member-layout{grid-template-columns:1fr!important;gap:15px!important;padding-top:16px!important}
  .member-social-page .mf-member-side{position:static!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .member-social-page .mf-member-card--music-dna,
  .member-social-page .mf-member-card--connections,
  .member-social-page .mf-member-card--universe,
  .member-social-page .mf-member-card--level,
  .member-social-page .mf-member-card--artist{grid-column:1/-1!important}
}

@media(max-width:620px){
  .member-social-page .mf-container{width:calc(100% - 28px)!important}
  .member-social-page .mf-member-cover{height:136px}
  .member-social-page .mf-member-cover__brand>small{display:none!important}
  .member-social-page .mf-member-head__inner{width:calc(100% - 28px)!important;grid-template-columns:74px minmax(0,1fr)!important;gap:11px!important}
  .member-social-page .mf-member-avatar{width:74px;height:74px;margin-top:-23px}
  .member-social-page .mf-member-avatar>span:first-child{font-size:26px}
  .member-social-page .mf-member-avatar__hint{width:22px!important;height:22px!important}
  .member-social-page .mf-member-identity{padding-top:11px!important}
  .member-social-page .mf-member-identity h1{font-size:22px!important;line-height:1.15!important}
  .member-social-page .mf-member-identity__badges{gap:5px!important;margin-top:5px}
  .member-social-page .mf-member-badge{font-size:8px!important;padding:4px 6px!important}
  .member-social-page .mf-member-level-chip{min-height:25px!important;padding:3px 6px!important}
  .member-social-page .mf-member-meta{font-size:8.5px!important;gap:5px 9px!important}
  .member-social-page .mf-member-meta span:nth-child(n+4){display:none}
  .member-social-page .mf-member-bio{font-size:11.5px!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .member-social-page .mf-member-head__actions{padding:12px 0 14px!important}
  .member-social-page .mf-member-action{height:39px!important;min-height:39px!important;font-size:9.5px!important}
  .member-social-page .mf-member-tabs{padding-inline:14px!important}
  .member-social-page .mf-member-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .member-social-page .mf-member-layout{width:100%!important;gap:12px!important;padding-top:14px!important}
  .member-social-page .mf-member-main{padding-inline:14px!important}
  .member-social-page .mf-member-side{display:block!important;padding-inline:14px!important}
  .member-social-page .mf-member-card{margin-bottom:11px!important;padding:15px!important;border-radius:5px!important}
  .member-social-page .mf-member-composer{border-radius:5px!important;margin-bottom:17px!important}
  .member-social-page .mf-member-post{border-radius:5px!important}
  .member-social-page .mf-member-post__actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .member-social-page .mf-member-post__actions button{min-width:0!important;font-size:9px!important}
  .member-social-page .mf-member-universe-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  .member-social-page .mf-member-universe-stats span{padding:10px 5px!important}
  .member-social-page .mf-member-achievement-row{grid-template-columns:1fr!important}
  .member-social-page .mf-member-weekly-badge{padding:12px!important;gap:10px!important}
  .member-social-page .mf-member-weekly-badge>span{flex-basis:42px!important;height:42px!important}
  .member-social-page .mf-music-dna-songs{display:flex!important;overflow:auto!important;gap:8px!important;scrollbar-width:none!important}
  .member-social-page .mf-music-dna-song{flex:0 0 100px!important}
  .mf-member-avatar-viewer{padding:18px}
  .mf-member-avatar-viewer__panel img{max-width:92vw;max-height:74vh;border-radius:6px}
  .mf-member-avatar-viewer__close{width:42px;height:42px;top:max(14px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left))}
}

@media(prefers-reduced-motion:reduce){
  .member-social-page .mf-member-cover__photo,
  .member-social-page .mf-member-avatar img,
  .member-social-page .mf-music-dna-cover img,
  .member-social-page .mf-music-dna-artists img,
  .mf-member-avatar-viewer,
  .mf-member-avatar-viewer__backdrop,
  .mf-member-avatar-viewer__panel{transition:none!important}
}

/* 2026-10-14 — restore earned profile cosmetics + dark-block contrast
   The cosmetic state already comes from member.php via data-member-frame / data-member-accent.
   This override intentionally wins over the generic current profile shell without changing the data model. */

/* Earned avatar frames: keep them visible even though the avatar is now a clickable button. */
.member-social-page .mf-member[data-member-frame="frame-wave"] .mf-member-avatar{
  box-shadow:0 0 0 4px #fff,0 0 0 7px rgba(31,201,232,.48),0 14px 34px rgba(4,19,39,.14)!important;
}
.member-social-page .mf-member[data-member-frame="frame-pulse"] .mf-member-avatar{
  box-shadow:0 0 0 4px #fff,0 0 0 7px rgba(39,104,255,.50),0 0 28px rgba(38,104,255,.18),0 14px 34px rgba(4,19,39,.14)!important;
}
.member-social-page .mf-member[data-member-frame="frame-royal"] .mf-member-avatar{
  box-shadow:0 0 0 4px #fff,0 0 0 7px rgba(118,82,255,.54),0 0 32px rgba(118,82,255,.17),0 14px 34px rgba(4,19,39,.14)!important;
}
.member-social-page .mf-member[data-member-frame="frame-icon"] .mf-member-avatar{
  box-shadow:0 0 0 4px #fff,0 0 0 7px rgba(34,211,238,.54),0 0 0 10px rgba(118,82,255,.13),0 0 34px rgba(34,211,238,.17),0 14px 34px rgba(4,19,39,.14)!important;
}

/* Earned accent also colours the cover/theme area again. Keep it restrained so the photo remains readable. */
.member-social-page .mf-member[data-member-accent="accent-cyan"] .mf-member-cover{
  background:linear-gradient(120deg,#041327 0,#063247 62%,#07545d 100%)!important;
}
.member-social-page .mf-member[data-member-accent="accent-cyan"] .mf-member-cover__wash{
  background:linear-gradient(90deg,rgba(3,21,39,.78),rgba(5,75,84,.23) 54%,rgba(4,39,51,.62))!important;
}
.member-social-page .mf-member[data-member-accent="accent-cyan"] .mf-member-cover::before{
  background:radial-gradient(circle at 18% 20%,rgba(34,211,238,.19),transparent 36%),linear-gradient(115deg,transparent 0 67%,rgba(37,200,195,.09) 67% 100%)!important;
}
.member-social-page .mf-member[data-member-accent="accent-purple"] .mf-member-cover{
  background:linear-gradient(120deg,#041327 0,#101f48 61%,#30265b 100%)!important;
}
.member-social-page .mf-member[data-member-accent="accent-purple"] .mf-member-cover__wash{
  background:linear-gradient(90deg,rgba(4,19,39,.80),rgba(74,55,133,.24) 54%,rgba(24,27,67,.65))!important;
}
.member-social-page .mf-member[data-member-accent="accent-purple"] .mf-member-cover::before{
  background:radial-gradient(circle at 18% 20%,rgba(118,82,255,.20),transparent 36%),linear-gradient(115deg,transparent 0 67%,rgba(89,199,255,.06) 67% 100%)!important;
}
.member-social-page .mf-member[data-member-accent="accent-platinum"] .mf-member-cover{
  background:linear-gradient(120deg,#071525 0,#1a3046 61%,#456177 100%)!important;
}
.member-social-page .mf-member[data-member-accent="accent-platinum"] .mf-member-cover__wash{
  background:linear-gradient(90deg,rgba(5,19,33,.78),rgba(130,159,184,.20) 54%,rgba(30,52,69,.62))!important;
}
.member-social-page .mf-member[data-member-accent="accent-platinum"] .mf-member-cover::before{
  background:radial-gradient(circle at 18% 20%,rgba(205,226,242,.18),transparent 36%),linear-gradient(115deg,transparent 0 67%,rgba(134,182,214,.08) 67% 100%)!important;
}

/* Dark blocks: explicit colour + text-fill prevents global heading rules from making text dark. */
.member-social-page .mf-member-weekly-badge,
.member-social-page .mf-member-weekly-badge>div,
.member-social-page .mf-member-weekly-badge>div>strong,
.member-social-page .mf-member-weekly-badge :is(h1,h2,h3,h4,b,strong){
  color:#f7fbff!important;
  -webkit-text-fill-color:#f7fbff!important;
}
.member-social-page .mf-member-weekly-badge small{
  color:#78e3fb!important;
  -webkit-text-fill-color:#78e3fb!important;
}
.member-social-page .mf-member-weekly-badge p{
  color:#c6d5e2!important;
  -webkit-text-fill-color:#c6d5e2!important;
}
.member-social-page .mf-member-level__seal,
.member-social-page .mf-member-level__seal :is(strong,b,span){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.member-social-page .mf-member-card--artist,
.member-social-page .mf-member-card--artist :is(h1,h2,h3,h4,strong,b){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.member-social-page .mf-member-card--artist :is(p,span):not(.mf-member-card__link){
  color:#c8d8e5!important;
  -webkit-text-fill-color:#c8d8e5!important;
}

/* On small screens keep earned frame proportions visible without making the profile feel busy. */
@media(max-width:700px){
  .member-social-page .mf-member[data-member-frame="frame-wave"] .mf-member-avatar{
    box-shadow:0 0 0 3px #fff,0 0 0 6px rgba(31,201,232,.48),0 9px 24px rgba(4,19,39,.12)!important;
  }
  .member-social-page .mf-member[data-member-frame="frame-pulse"] .mf-member-avatar{
    box-shadow:0 0 0 3px #fff,0 0 0 6px rgba(39,104,255,.50),0 0 22px rgba(38,104,255,.15),0 9px 24px rgba(4,19,39,.12)!important;
  }
  .member-social-page .mf-member[data-member-frame="frame-royal"] .mf-member-avatar{
    box-shadow:0 0 0 3px #fff,0 0 0 6px rgba(118,82,255,.54),0 0 24px rgba(118,82,255,.15),0 9px 24px rgba(4,19,39,.12)!important;
  }
  .member-social-page .mf-member[data-member-frame="frame-icon"] .mf-member-avatar{
    box-shadow:0 0 0 3px #fff,0 0 0 6px rgba(34,211,238,.54),0 0 0 8px rgba(118,82,255,.11),0 0 25px rgba(34,211,238,.14),0 9px 24px rgba(4,19,39,.12)!important;
  }
}


/* Post actions must remain readable and large enough to use on a mouse or touch screen. */
body.member-social-page .mf-member-post__actions button {
  min-height:42px!important;
  font-size:11.5px!important;
  line-height:1.4!important;
}

/* Accessible contrast for the small activity labels on both desktop and mobile. */
body.member-social-page .mf-member-stats small {
  color:#536b80!important;
  font-size:11px!important;
  line-height:1.35!important;
}

/* Music FM Classic / Visual QA — readable community microcopy.
   Preserve the established two-column profile and its compact visual system;
   only raise sub-10px labels and mobile tap targets. */
@media (max-width:820px) {
  body.member-social-page .mf-member-stats small {
    font-size:11px!important;
    line-height:1.35!important;
    overflow-wrap:break-word;
  }
  body.member-social-page .mf-member-tabs a {font-size:11px!important;}
  body.member-social-page .mf-member-post__actions button {
    font-size:11.5px!important;
    min-height:42px!important;
    line-height:1.4!important;
  }
  body.member-social-page .mf-member-action {
    min-height:42px!important;
    height:auto!important;
    line-height:1.35!important;
  }
}
@media (max-width:620px) {
  body.member-social-page .mf-member-meta {font-size:10.5px!important;color:#526a80!important;}
  body.member-social-page .mf-member-badge {font-size:10px!important;}
}
