/* MUSIC FM — Social Universe 2026. Deliberately editorial + app-native, not generic dashboard UI. */
:root{--su-ink:#06101f;--su-navy:#071a32;--su-blue:#1767ff;--su-cyan:#22d3ee;--su-purple:#7758ff;--su-red:#ff3d68;--su-paper:#f5f8fc;--su-line:rgba(9,31,61,.11);--su-soft:rgba(11,39,73,.64);--su-shadow:0 18px 50px rgba(5,22,48,.09);--su-shadow-strong:0 28px 80px rgba(5,22,48,.16);--su-radius:22px;--su-radius-sm:15px}
.social-universe-page{background:linear-gradient(180deg,#f8fbff 0,#f4f7fb 32%,#fff 100%);color:var(--su-ink)}
.su-shell{position:relative;overflow:hidden;min-height:70vh;padding-bottom:84px}.su-shell:before{content:"";position:absolute;inset:0 0 auto;height:420px;pointer-events:none;background:radial-gradient(circle at 16% 12%,rgba(34,211,238,.11),transparent 33%),radial-gradient(circle at 80% 6%,rgba(119,88,255,.1),transparent 27%);z-index:0}.su-shell>*{position:relative;z-index:1}
.su-hero{position:relative;background:linear-gradient(115deg,#041327 0,#071d39 58%,#0b2a4b 100%);color:#fff;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.08)}
.su-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 47%,rgba(255,255,255,.028) 47% 47.12%,transparent 47.12%),repeating-linear-gradient(90deg,transparent 0 96px,rgba(255,255,255,.025) 96px 97px);opacity:.62}.su-hero:after{content:"";position:absolute;width:530px;height:530px;border-radius:50%;left:-150px;top:-260px;border:1px solid rgba(34,211,238,.24);box-shadow:0 0 0 54px rgba(34,211,238,.025),0 0 0 108px rgba(119,88,255,.02)}
.su-hero__inner{min-height:338px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:38px;align-items:end;padding-top:78px;padding-bottom:42px}.su-kicker{display:flex;align-items:center;gap:10px;font-size:.74rem;font-weight:900;letter-spacing:.18em;color:#8feeff;text-transform:uppercase}.su-kicker:before{content:"";width:30px;height:2px;background:linear-gradient(90deg,var(--su-cyan),var(--su-purple));border-radius:8px}.su-hero h1{font-size:clamp(2.35rem,5vw,5rem);line-height:.92;letter-spacing:-.055em;margin:14px 0 16px;max-width:820px}.su-hero p{max-width:720px;margin:0;color:rgba(255,255,255,.72);font-size:1.03rem;line-height:1.8}.su-hero__mark{width:170px;aspect-ratio:1;border:1px solid rgba(255,255,255,.13);border-radius:50%;display:grid;place-items:center;position:relative;margin-bottom:8px;background:radial-gradient(circle,rgba(34,211,238,.12),transparent 64%);box-shadow:inset 0 0 50px rgba(34,211,238,.06)}.su-hero__mark:before,.su-hero__mark:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.13)}.su-hero__mark:before{inset:18px}.su-hero__mark:after{inset:42px;border-color:rgba(34,211,238,.38)}.su-hero__mark strong{font-size:2.8rem;letter-spacing:-.08em}.su-hero__mark small{position:absolute;bottom:24px;font-size:.58rem;letter-spacing:.22em;color:#8feeff}
.su-topnav-wrap{background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--su-line);position:sticky;top:var(--header-h,72px);z-index:12}.su-topnav{display:flex;gap:8px;align-items:center;overflow:auto;scrollbar-width:none;padding-top:10px;padding-bottom:10px}.su-topnav::-webkit-scrollbar{display:none}.su-topnav a{white-space:nowrap;text-decoration:none;color:#415269;font-size:.86rem;font-weight:800;padding:10px 14px;border-radius:999px;transition:.2s ease}.su-topnav a:hover,.su-topnav a.is-active{background:#071a32;color:#fff;box-shadow:0 8px 22px rgba(7,26,50,.12)}
.su-content{padding-top:34px}.su-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.72fr);gap:24px;align-items:start}.su-stack{display:grid;gap:22px}.su-card{background:rgba(255,255,255,.93);border:1px solid rgba(7,32,64,.09);border-radius:var(--su-radius);box-shadow:var(--su-shadow);overflow:hidden;position:relative}.su-card:before{content:"";position:absolute;inset:0 auto 0 0;width:1px;background:linear-gradient(180deg,transparent,var(--su-cyan),transparent);opacity:.22}.su-card__head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:24px 26px 19px;border-bottom:1px solid rgba(10,31,60,.07)}.su-card__head small{display:block;font-size:.66rem;letter-spacing:.17em;color:#6a7b90;font-weight:900}.su-card__head h2,.su-card__head h3{margin:6px 0 0;letter-spacing:-.035em}.su-card__head p{margin:7px 0 0;color:#74839a;line-height:1.65}.su-card__body{padding:24px 26px}.su-section-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:16px 0 17px}.su-section-title small{font-weight:900;letter-spacing:.16em;color:#60738d}.su-section-title h2{font-size:1.55rem;letter-spacing:-.035em;margin:5px 0 0}.su-section-title a{font-size:.86rem;font-weight:800;color:#0e5df1;text-decoration:none}
.su-progress-hero{background:linear-gradient(125deg,#06172d 0,#0a2444 70%,#10345c 100%);color:#fff;border-radius:26px;padding:28px;position:relative;overflow:hidden;box-shadow:0 25px 65px rgba(4,20,45,.18)}.su-progress-hero:after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;left:-120px;top:-130px;background:radial-gradient(circle,rgba(34,211,238,.22),transparent 67%)}.su-progress-identity{display:grid;grid-template-columns:118px 1fr;gap:24px;align-items:center;position:relative;z-index:1}.su-level-orb{width:118px;height:118px;border-radius:50%;display:grid;place-items:center;text-align:center;border:1px solid rgba(255,255,255,.2);background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(34,211,238,.05));box-shadow:inset 0 0 0 9px rgba(255,255,255,.025),0 16px 40px rgba(0,0,0,.18)}.su-level-orb small{display:block;font-size:.61rem;letter-spacing:.16em;color:#77e7ff;font-weight:900}.su-level-orb strong{display:block;font-size:2.35rem;line-height:1}.su-progress-copy>small{font-size:.7rem;letter-spacing:.16em;color:#83e9ff;font-weight:900}.su-progress-copy h2{font-size:2rem;margin:6px 0 4px;letter-spacing:-.045em}.su-progress-copy p{margin:0;color:rgba(255,255,255,.67)}.su-progress-track{height:9px;background:rgba(255,255,255,.1);border-radius:999px;overflow:hidden;margin-top:22px}.su-progress-track>i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#20d7ee,#2b7cff 56%,#8a5cff);box-shadow:0 0 18px rgba(34,211,238,.38)}.su-progress-meta{display:flex;justify-content:space-between;gap:20px;margin-top:9px;font-size:.74rem;color:rgba(255,255,255,.62)}.su-progress-meta b{color:#fff}
.su-stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.su-stat{background:#fff;border:1px solid var(--su-line);border-radius:17px;padding:17px;min-width:0}.su-stat small{display:block;color:#76879b;font-size:.73rem;font-weight:700}.su-stat strong{font-size:1.55rem;display:block;margin-top:4px;letter-spacing:-.04em}.su-stat em{font-style:normal;font-size:.66rem;color:#0d74df;font-weight:800}
.su-missions{display:grid;gap:12px}.su-mission{border:1px solid rgba(8,35,68,.08);border-radius:17px;padding:17px;background:linear-gradient(180deg,#fff,#fbfdff);display:grid;grid-template-columns:1fr auto;gap:12px;position:relative;overflow:hidden}.su-mission.is-complete{border-color:rgba(22,174,132,.2);background:linear-gradient(180deg,#f8fffc,#fff)}.su-mission__top{display:flex;align-items:center;gap:9px}.su-mission__top i{width:8px;height:8px;border-radius:50%;background:#3c82ff;box-shadow:0 0 0 5px rgba(60,130,255,.08)}.su-mission.is-complete .su-mission__top i{background:#17b486}.su-mission strong{font-size:.98rem}.su-mission p{margin:6px 0 10px;color:#76869a;font-size:.82rem}.su-mini-track{height:6px;background:#e9eef5;border-radius:999px;overflow:hidden}.su-mini-track i{display:block;height:100%;background:linear-gradient(90deg,#1bc9e5,#4b6fff);border-radius:inherit}.su-mission__score{text-align:left;min-width:74px}.su-mission__score b{display:block;color:#0f5fe8;font-size:.78rem}.su-mission__score span{font-size:.72rem;color:#7b8ba0}.su-mission.is-complete .su-mission__score b{color:#13956f}
.su-achievements{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.su-achievement{min-height:168px;border:1px solid var(--su-line);border-radius:19px;padding:18px;background:#fff;position:relative;overflow:hidden}.su-achievement:after{content:"";position:absolute;width:100px;height:100px;border-radius:50%;left:-42px;bottom:-42px;background:rgba(23,103,255,.04)}.su-achievement.is-locked{opacity:.58;filter:saturate(.7)}.su-achievement__badge{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#071a32,#123764);color:#8deeff;font-weight:900;box-shadow:0 11px 25px rgba(8,31,62,.13)}.su-achievement[data-tier="gold"] .su-achievement__badge{background:linear-gradient(135deg,#5b4210,#c3952e);color:#fff1b7}.su-achievement[data-tier="platinum"] .su-achievement__badge,.su-achievement[data-tier="diamond"] .su-achievement__badge{background:linear-gradient(135deg,#24334c,#5f6bff);color:#d9f9ff}.su-achievement h3{font-size:.93rem;margin:13px 0 4px}.su-achievement p{font-size:.77rem;color:#78889c;line-height:1.55;margin:0 0 12px}.su-achievement__bottom{font-size:.7rem;font-weight:800;color:#51647c}.su-achievement__bottom b{color:#1268ee}
.su-ranks{display:grid;gap:2px}.su-rank{display:grid;grid-template-columns:62px 1fr auto;align-items:center;gap:13px;padding:13px 15px;border-radius:14px}.su-rank:nth-child(odd){background:#f7f9fc}.su-rank.is-current{background:linear-gradient(90deg,rgba(34,211,238,.12),rgba(23,103,255,.07));box-shadow:inset 3px 0 #1dcde8}.su-rank.is-locked{color:#8390a2}.su-rank__level{font-size:.7rem;font-weight:900;color:#63748b;letter-spacing:.08em}.su-rank strong{font-size:.87rem}.su-rank small{font-size:.68rem;color:#8290a2}.su-rank.is-current small{color:#0e67e6;font-weight:900}
.su-streak{padding:22px;border-radius:22px;background:linear-gradient(135deg,#081a31,#122d50);color:#fff;position:relative;overflow:hidden}.su-streak:after{content:"";position:absolute;inset:auto -40px -80px auto;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(255,61,104,.32),transparent 64%)}.su-streak__number{display:flex;align-items:flex-end;gap:10px}.su-streak__number strong{font-size:3.25rem;line-height:.85;letter-spacing:-.08em}.su-streak__number span{font-size:.78rem;color:#a7b8cb;padding-bottom:4px}.su-streak>small{font-size:.65rem;letter-spacing:.18em;color:#70e8fb;font-weight:900}.su-streak p{font-size:.82rem;color:rgba(255,255,255,.68);margin:10px 0 0;line-height:1.6}
.su-perks{display:grid;gap:10px}.su-perk{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:13px;border:1px solid var(--su-line);border-radius:15px}.su-perk__icon{width:42px;height:42px;border-radius:13px;background:#edf4ff;color:#1466ea;display:grid;place-items:center;font-weight:900}.su-perk.is-locked{opacity:.5}.su-perk strong{font-size:.84rem}.su-perk p{margin:2px 0 0;color:#7b8b9e;font-size:.71rem}.su-perk small{font-size:.66rem;font-weight:900;color:#5a6c83}
.su-podium{display:grid;grid-template-columns:1fr 1.12fr 1fr;align-items:end;gap:15px;margin-top:20px}.su-podium-card{background:#fff;border:1px solid var(--su-line);border-radius:23px;padding:22px 16px;text-align:center;box-shadow:var(--su-shadow);position:relative}.su-podium-card:nth-child(2){padding-top:30px;transform:translateY(-11px);background:linear-gradient(180deg,#fff,#f6fbff);box-shadow:var(--su-shadow-strong)}.su-place{position:absolute;top:13px;right:14px;font-size:.7rem;font-weight:900;color:#6e8097}.su-avatar{width:66px;height:66px;border-radius:50%;margin:0 auto 12px;display:grid;place-items:center;background:linear-gradient(135deg,#0a2341,#185793);color:#fff;font-weight:900;overflow:hidden;border:4px solid #fff;box-shadow:0 7px 25px rgba(8,33,68,.16)}.su-avatar img{width:100%;height:100%;object-fit:cover}.su-podium-card h3{margin:0;font-size:1rem}.su-podium-card p{margin:4px 0 12px;color:#77889d;font-size:.75rem}.su-podium-score{font-size:1.45rem;font-weight:900;letter-spacing:-.04em;color:#0d5fdc}.su-podium-score small{font-size:.62rem;letter-spacing:.08em;margin-right:3px}.su-board{display:grid;gap:8px}.su-board-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto auto;gap:14px;align-items:center;background:#fff;border:1px solid var(--su-line);border-radius:16px;padding:12px 15px;text-decoration:none;color:inherit;transition:.2s ease}.su-board-row:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(8,31,62,.08)}.su-board-row__place{font-weight:900;color:#6b7e95;text-align:center}.su-board-user{display:flex;align-items:center;gap:11px;min-width:0}.su-board-user .su-avatar{width:43px;height:43px;margin:0;border-width:2px;flex:none}.su-board-user strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.su-board-user small{display:block;color:#7a8a9f;font-size:.7rem;margin-top:2px}.su-board-level{font-size:.7rem;font-weight:900;color:#63768e}.su-board-score{font-size:.9rem;font-weight:900;color:#0d61e5;text-align:left;min-width:72px}
.su-filterbar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.su-filterbar a{padding:9px 13px;border-radius:999px;border:1px solid var(--su-line);background:#fff;color:#506176;text-decoration:none;font-size:.78rem;font-weight:800}.su-filterbar a.is-active{background:#071a32;color:#fff;border-color:#071a32}
.su-feed{display:grid;gap:14px}.su-feed-card{background:#fff;border:1px solid var(--su-line);border-radius:20px;padding:20px;box-shadow:0 10px 28px rgba(8,31,62,.055);position:relative;overflow:hidden}.su-feed-card:before{content:"";position:absolute;top:0;right:0;width:3px;height:100%;background:linear-gradient(180deg,var(--su-cyan),var(--su-blue),var(--su-purple));opacity:.7}.su-feed-user{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}.su-feed-user .su-avatar{width:48px;height:48px;margin:0;border-width:2px}.su-feed-user strong{display:block}.su-feed-user small{display:block;color:#7b8b9e;font-size:.7rem;margin-top:2px}.su-feed-event{margin:16px 0 0;padding:15px 16px;border-radius:15px;background:linear-gradient(100deg,#f6f9fd,#fbfdff);border:1px solid rgba(10,36,69,.07);display:flex;align-items:center;gap:12px}.su-feed-event__mark{width:39px;height:39px;border-radius:12px;background:#071a32;color:#7ce8fa;display:grid;place-items:center;flex:none}.su-feed-event strong{font-size:.88rem}.su-feed-event p{margin:3px 0 0;color:#7b8a9d;font-size:.74rem}.su-feed-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.su-feed-tags span{font-size:.64rem;font-weight:800;padding:5px 8px;border-radius:999px;background:#eef4fb;color:#5d7088}
.su-profile-strip{display:grid;grid-template-columns:1.25fr .75fr;gap:16px;margin:17px 0}.su-profile-insight{border-radius:20px;padding:20px;background:linear-gradient(135deg,#071a32,#12385f);color:#fff;position:relative;overflow:hidden}.su-profile-insight:after{content:"";position:absolute;left:-60px;bottom:-100px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.18),transparent 68%)}.su-profile-insight small{font-size:.65rem;letter-spacing:.15em;color:#7ae7fb;font-weight:900}.su-profile-insight h3{font-size:1.25rem;margin:6px 0}.su-profile-insight p{font-size:.8rem;color:rgba(255,255,255,.65);line-height:1.6}.su-profile-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.su-profile-badges span{border:1px solid rgba(255,255,255,.15);border-radius:999px;padding:6px 9px;font-size:.65rem;font-weight:800;background:rgba(255,255,255,.05)}
.su-settings{display:grid;gap:12px}.su-setting{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 0;border-bottom:1px solid rgba(7,31,61,.07)}.su-setting:last-child{border-bottom:0}.su-setting strong{display:block;font-size:.86rem}.su-setting p{margin:3px 0 0;color:#7a8a9d;font-size:.72rem}.su-setting select,.su-setting input[type="text"]{border:1px solid var(--su-line);border-radius:12px;background:#f8fafc;padding:10px 12px;font:inherit;min-width:150px}.su-switch{position:relative;width:45px;height:25px;flex:none}.su-switch input{position:absolute;opacity:0}.su-switch i{position:absolute;inset:0;border-radius:999px;background:#dce5ef;transition:.2s}.su-switch i:after{content:"";position:absolute;width:19px;height:19px;top:3px;right:3px;border-radius:50%;background:#fff;box-shadow:0 2px 7px rgba(0,0,0,.14);transition:.2s}.su-switch input:checked+i{background:#1269ed}.su-switch input:checked+i:after{transform:translateX(-20px)}.su-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border:0;border-radius:13px;padding:11px 17px;background:#071a32;color:#fff;font-weight:900;font:inherit;cursor:pointer}.su-button--blue{background:linear-gradient(135deg,#1767ff,#654cff);box-shadow:0 10px 24px rgba(23,103,255,.19)}.su-button--ghost{background:#eef4fb;color:#15365b}
.su-empty{text-align:center;padding:48px 20px;color:#73849a}.su-empty strong{display:block;color:#182c47;font-size:1.05rem;margin-bottom:5px}
.su-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.su-admin-table{width:100%;border-collapse:collapse;font-size:.78rem}.su-admin-table th,.su-admin-table td{text-align:right;padding:10px 9px;border-bottom:1px solid rgba(7,31,61,.08);vertical-align:middle}.su-admin-table th{color:#64768c;font-size:.68rem}.su-admin-table input,.su-admin-table select{max-width:130px;padding:8px;border:1px solid #dbe4ef;border-radius:9px;font:inherit}.su-admin-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.su-admin-form-grid label{display:grid;gap:5px;font-size:.72rem;font-weight:800;color:#53667d}.su-admin-form-grid input,.su-admin-form-grid select,.su-admin-form-grid textarea{width:100%;border:1px solid #dbe4ef;border-radius:11px;padding:10px;font:inherit;background:#fff}.su-admin-form-grid .wide{grid-column:1/-1}
.mf-xp-toast__unlock{margin-top:9px;display:flex;gap:6px;flex-wrap:wrap}.mf-xp-toast__unlock span{font-size:.62rem;padding:4px 7px;border-radius:999px;background:rgba(255,255,255,.1);color:#b9f6ff}
@media(max-width:900px){.su-hero__inner{grid-template-columns:1fr;min-height:285px;padding-top:52px}.su-hero__mark{display:none}.su-grid{grid-template-columns:1fr}.su-stat-row{grid-template-columns:repeat(2,1fr)}.su-achievements{grid-template-columns:repeat(2,1fr)}.su-profile-strip{grid-template-columns:1fr}.su-podium{gap:8px}.su-podium-card{padding:18px 10px}.su-podium-card:nth-child(2){padding-top:24px}.su-admin-grid{grid-template-columns:1fr}}
@media(max-width:620px){.su-shell{padding-bottom:100px}.su-hero__inner{min-height:240px;padding-top:36px;padding-bottom:30px}.su-hero h1{font-size:2.35rem;line-height:.98}.su-hero p{font-size:.88rem;line-height:1.65}.su-topnav-wrap{top:var(--header-h-mobile,62px)}.su-topnav{padding-inline:14px}.su-content{padding-top:19px}.su-card{border-radius:18px}.su-card__head{padding:19px 18px 15px}.su-card__body{padding:18px}.su-progress-hero{border-radius:19px;padding:20px}.su-progress-identity{grid-template-columns:86px 1fr;gap:16px}.su-level-orb{width:86px;height:86px}.su-level-orb strong{font-size:1.9rem}.su-progress-copy h2{font-size:1.4rem}.su-stat-row{gap:8px}.su-stat{padding:13px;border-radius:14px}.su-stat strong{font-size:1.28rem}.su-achievements{grid-template-columns:1fr}.su-achievement{min-height:0}.su-podium{display:flex;overflow-x:auto;padding:12px 2px 18px;scroll-snap-type:x mandatory}.su-podium-card{min-width:205px;scroll-snap-align:center}.su-podium-card:nth-child(2){order:-1;transform:none}.su-board-row{grid-template-columns:30px minmax(0,1fr) auto;padding:11px}.su-board-level{display:none}.su-board-score{min-width:58px}.su-feed-card{padding:16px;border-radius:17px}.su-mission{padding:14px}.su-section-title{margin-top:9px}.su-admin-form-grid{grid-template-columns:1fr}.su-admin-form-grid .wide{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.su-board-row,.su-topnav a,.su-switch i,.su-switch i:after{transition:none}}

/* Weekly podium — recalculated live every week */
.su-weekly-crown{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;padding:20px;border:1px solid rgba(255,255,255,.13);border-radius:22px;background:linear-gradient(145deg,#081b35 0%,#0a2242 52%,#111d3f 100%);color:#fff;box-shadow:0 18px 46px rgba(2,13,31,.18)}
.su-weekly-crown:before{content:"";position:absolute;inset:-60% auto auto -18%;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(92,214,255,.22),transparent 68%);pointer-events:none}
.su-weekly-crown__orb{position:relative;display:grid;place-items:center;flex:0 0 68px;height:68px;border-radius:20px;background:linear-gradient(145deg,rgba(70,218,255,.2),rgba(120,87,255,.18));border:1px solid rgba(126,224,255,.32);font-weight:900;font-size:1.35rem;box-shadow:inset 0 0 28px rgba(70,218,255,.06)}
.su-weekly-crown small{display:block;color:#79dff9;font-size:.68rem;font-weight:900;letter-spacing:.14em;margin-bottom:5px}.su-weekly-crown h3{margin:0;font-size:1.08rem}.su-weekly-crown p{margin:6px 0 0;color:#aebfd3;font-size:.8rem;line-height:1.55}
@media(max-width:640px){.su-weekly-crown{border-radius:18px;padding:16px;gap:12px}.su-weekly-crown__orb{flex-basis:56px;height:56px;border-radius:16px;font-size:1.12rem}.su-weekly-crown p{font-size:.75rem}}
.su-admin-table tr.is-muted{opacity:.55}.su-admin-table tr.is-muted strong{text-decoration:line-through;text-decoration-thickness:1px}

/* ========================================================================== 
   MUSIC FM SOCIAL UNIVERSE — CLASSIC MUSIC FM INTEGRATION / SU3
   Matches the live MUSIC FM editorial system: almost-square surfaces, thin rules,
   restrained depth and tab underlines instead of rounded dashboard pills.
   ========================================================================== */
.social-universe-page{
  --su-radius:var(--mf-ui-radius,3px);
  --su-radius-sm:var(--mf-ui-radius-control,3px);
  --su-line:var(--mf-ui-line,rgba(9,31,61,.11));
  --su-shadow:var(--mf-ui-depth-1,0 7px 20px rgba(4,19,39,.035));
  --su-shadow-strong:var(--mf-ui-depth-2,0 12px 28px rgba(4,19,39,.055));
  background:var(--mf-ui-page,#f4f6f9);
}
.social-universe-page .su-shell{padding-bottom:72px;overflow:clip}
.social-universe-page .su-shell:before{height:300px;opacity:.42}

/* Hero — closer to the classic MUSIC FM masthead, not an oversized app dashboard. */
.social-universe-page .su-hero{
  background:linear-gradient(122deg,var(--mf-ui-navy,#041327) 0%,var(--mf-ui-navy-2,#071d37) 64%,var(--mf-ui-navy-3,#0a2850) 100%);
  border-bottom:1px solid rgba(255,255,255,.09);
}
.social-universe-page .su-hero:before{opacity:.34}
.social-universe-page .su-hero:after{
  width:360px;height:360px;left:-130px;top:-205px;border-radius:50%;
  box-shadow:0 0 0 42px rgba(34,211,238,.02),0 0 0 84px rgba(119,88,255,.015)
}
.social-universe-page .su-hero__inner{
  min-height:232px;padding-top:46px;padding-bottom:34px;align-items:center;gap:34px
}
.social-universe-page .su-kicker{font-size:.7rem;letter-spacing:.16em}
.social-universe-page .su-kicker:before{width:25px;border-radius:0}
.social-universe-page .su-hero h1{
  font-size:clamp(2.1rem,3.8vw,3.65rem);line-height:1.02;letter-spacing:-.045em;margin:10px 0 12px
}
.social-universe-page .su-hero p{font-size:.96rem;line-height:1.72;max-width:760px}
.social-universe-page .su-hero__mark{
  width:132px;height:96px;aspect-ratio:auto;border-radius:3px;margin:0;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(34,211,238,.035));
  box-shadow:inset 0 1px rgba(255,255,255,.06);align-content:center;gap:1px
}
.social-universe-page .su-hero__mark:before{inset:7px;border-radius:1px}
.social-universe-page .su-hero__mark:after{display:none}
.social-universe-page .su-hero__mark strong{font-size:2rem;letter-spacing:-.05em;line-height:1}
.social-universe-page .su-hero__mark small{position:static;font-size:.55rem;letter-spacing:.19em}

/* Section navigation — classic tabs with a precise active underline. */
.social-universe-page .su-topnav-wrap{
  background:#fff;backdrop-filter:none;border-bottom:1px solid var(--su-line);
  box-shadow:0 3px 12px rgba(4,19,39,.025)
}
.social-universe-page .su-topnav{gap:24px;padding-top:0;padding-bottom:0;min-height:62px}
.social-universe-page .su-topnav a{
  position:relative;display:flex;align-items:center;min-height:62px;padding:0 2px;
  border-radius:0;background:transparent!important;color:#526176;box-shadow:none!important;
  font-size:.84rem;font-weight:800
}
.social-universe-page .su-topnav a:after{
  content:"";position:absolute;right:50%;bottom:-1px;width:0;height:2px;
  background:var(--mf-ui-sky,#59c7ff);transform:translateX(50%);transition:width .18s ease
}
.social-universe-page .su-topnav a:hover{color:var(--mf-ui-navy,#041327)}
.social-universe-page .su-topnav a.is-active{color:var(--mf-ui-navy,#041327)}
.social-universe-page .su-topnav a.is-active:after{width:100%}

.social-universe-page .su-content{padding-top:30px}
.social-universe-page .su-grid{gap:20px}
.social-universe-page .su-stack{gap:18px}

/* One MUSIC FM surface vocabulary. */
.social-universe-page .su-card,
.social-universe-page .su-stat,
.social-universe-page .su-mission,
.social-universe-page .su-achievement,
.social-universe-page .su-perk,
.social-universe-page .su-podium-card,
.social-universe-page .su-board-row,
.social-universe-page .su-feed-card,
.social-universe-page .su-feed-event,
.social-universe-page .su-profile-insight,
.social-universe-page .su-streak,
.social-universe-page .su-weekly-crown,
.social-universe-page .su-progress-hero{
  border-radius:var(--mf-ui-radius,3px)!important;
}
.social-universe-page .su-card{
  border:1px solid var(--su-line);box-shadow:var(--mf-ui-depth-1,var(--su-shadow));background:#fff
}
.social-universe-page .su-card:before{display:none}
.social-universe-page .su-card__head{padding:20px 22px 16px;border-bottom:1px solid var(--su-line)}
.social-universe-page .su-card__body{padding:20px 22px}
.social-universe-page .su-section-title{margin:12px 0 15px;border-right:3px solid var(--mf-ui-blue,#147cff);padding-right:11px;align-items:center}
.social-universe-page .su-section-title h2{font-size:1.42rem;margin-top:2px}
.social-universe-page .su-section-title small{font-size:.62rem;letter-spacing:.14em}

/* Main progress panel — premium, but structurally aligned with the portal. */
.social-universe-page .su-progress-hero{
  padding:24px 26px;background:linear-gradient(118deg,#06182f 0%,#0a2a53 70%,#0d3c70 100%);
  box-shadow:0 14px 34px rgba(7,31,63,.13);border:1px solid rgba(255,255,255,.055)
}
.social-universe-page .su-progress-hero:after{
  width:260px;height:260px;left:-110px;top:-130px;opacity:.62
}
.social-universe-page .su-progress-identity{grid-template-columns:92px 1fr;gap:20px}
.social-universe-page .su-level-orb{
  width:92px;height:82px;border-radius:3px;border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.045);box-shadow:inset 3px 0 0 rgba(89,199,255,.78)
}
.social-universe-page .su-level-orb strong{font-size:2.05rem}
.social-universe-page .su-progress-copy h2{font-size:1.65rem;margin-top:4px}
.social-universe-page .su-progress-track,.social-universe-page .su-mini-track{border-radius:1px}
.social-universe-page .su-progress-track{height:7px;background:rgba(255,255,255,.11);margin-top:20px}
.social-universe-page .su-progress-track>i,.social-universe-page .su-mini-track i{border-radius:0}

/* Stats and missions: flatter editorial rows, not floating rounded tiles. */
.social-universe-page .su-stat-row{gap:10px;margin-top:12px}
.social-universe-page .su-stat{padding:15px 16px;box-shadow:none;border-top:2px solid #dbe8f5}
.social-universe-page .su-stat strong{font-size:1.42rem}
.social-universe-page .su-missions{gap:8px}
.social-universe-page .su-mission{
  padding:14px 15px;background:#fff;box-shadow:none;border-color:var(--su-line)
}
.social-universe-page .su-mission.is-complete{background:#f8fcfb}
.social-universe-page .su-mission__top i{width:5px;height:17px;border-radius:0;box-shadow:none;background:var(--mf-ui-blue,#147cff)}
.social-universe-page .su-mission.is-complete .su-mission__top i{background:var(--mf-ui-success,#137568)}

/* Achievements + ranks — cleaner, denser and closer to the site's editorial cards. */
.social-universe-page .su-achievements{gap:10px}
.social-universe-page .su-achievement{min-height:158px;padding:16px;box-shadow:none}
.social-universe-page .su-achievement:after{display:none}
.social-universe-page .su-achievement__badge{
  width:39px;height:39px;border-radius:2px;box-shadow:none;border:1px solid rgba(255,255,255,.08)
}
.social-universe-page .su-ranks{gap:0;border:1px solid var(--su-line)}
.social-universe-page .su-rank{border-radius:0;padding:12px 14px;border-bottom:1px solid var(--su-line);background:#fff!important}
.social-universe-page .su-rank:last-child{border-bottom:0}
.social-universe-page .su-rank.is-current{background:#f2f8ff!important;box-shadow:inset -3px 0 var(--mf-ui-blue,#147cff)}

/* Streak/perks/weekly badge. */
.social-universe-page .su-streak{padding:19px 20px;box-shadow:0 10px 28px rgba(7,31,63,.09)}
.social-universe-page .su-streak__number strong{font-size:2.8rem}
.social-universe-page .su-perks{gap:7px}
.social-universe-page .su-perk{border-radius:3px!important;padding:11px 12px;background:#fff}
.social-universe-page .su-perk__icon{width:38px;height:38px;border-radius:2px}
.social-universe-page .su-weekly-crown{padding:17px 18px;box-shadow:0 10px 28px rgba(7,31,63,.11)}
.social-universe-page .su-weekly-crown__orb{flex-basis:58px;height:52px;border-radius:2px;box-shadow:none}

/* Filters: editorial segmented links rather than capsules. */
.social-universe-page .su-filterbar{gap:0;margin-bottom:14px;border-bottom:1px solid var(--su-line)}
.social-universe-page .su-filterbar a{
  position:relative;padding:10px 14px;border:0;border-radius:0;background:transparent;color:#65748a
}
.social-universe-page .su-filterbar a:after{
  content:"";position:absolute;right:14px;left:14px;bottom:-1px;height:2px;background:transparent
}
.social-universe-page .su-filterbar a:hover{color:var(--mf-ui-navy,#041327);background:#f7f9fc}
.social-universe-page .su-filterbar a.is-active{background:transparent;color:var(--mf-ui-navy,#041327)}
.social-universe-page .su-filterbar a.is-active:after{background:var(--mf-ui-blue,#147cff)}

/* Leaderboard — table-like, serious, and closer to the classic charts page. */
.social-universe-page .su-podium{gap:10px;margin-top:16px}
.social-universe-page .su-podium-card{
  padding:19px 14px;border-top:3px solid #dbe5ef;box-shadow:var(--mf-ui-depth-1,var(--su-shadow))
}
.social-universe-page .su-podium-card:nth-child(2){
  padding-top:22px;transform:translateY(-6px);border-top-color:var(--mf-ui-blue,#147cff);
  background:linear-gradient(180deg,#fff,#f8fbff);box-shadow:var(--mf-ui-depth-2,var(--su-shadow-strong))
}
.social-universe-page .su-board{gap:0;border-top:2px solid var(--mf-ui-navy,#041327)}
.social-universe-page .su-board-row{
  border-width:0 0 1px;border-color:var(--su-line);padding:12px 10px;box-shadow:none
}
.social-universe-page .su-board-row:hover{transform:none;background:#f8fafc;box-shadow:none}

/* Social feed — editorial activity stream, not a pile of rounded cards. */
.social-universe-page .su-feed{gap:10px}
.social-universe-page .su-feed-card{
  padding:17px 18px 16px;border:1px solid var(--su-line);border-right:3px solid var(--mf-ui-blue,#147cff);
  box-shadow:var(--mf-ui-depth-1,var(--su-shadow));overflow:visible
}
.social-universe-page .su-feed-card:before{display:none}
.social-universe-page .su-feed-user{padding-bottom:13px;border-bottom:1px solid #edf1f5}
.social-universe-page .su-feed-event{
  margin:0;padding:14px 0 4px;border:0;background:transparent;gap:11px
}
.social-universe-page .su-feed-event__mark{
  width:36px;height:36px;border-radius:2px;background:#eef5fd;color:var(--mf-ui-blue-deep,#0d5fc2);
  border:1px solid #d8e6f5
}
.social-universe-page .su-feed-event strong{font-size:.9rem;color:var(--mf-ui-ink-strong,#102541)}
.social-universe-page .su-feed-tags{margin-top:9px;padding-top:10px;border-top:1px solid #f0f2f5;gap:10px}
.social-universe-page .su-feed-tags span,
.social-universe-page .su-profile-badges span{
  border-radius:2px;padding:4px 7px;background:#f3f6fa;border:1px solid #e2e9f1;color:#53677e
}

/* Buttons / controls use the MUSIC FM 2–3px language. */
.social-universe-page .su-button{
  min-height:42px;border-radius:2px;padding:10px 15px;font-weight:800;box-shadow:none
}
.social-universe-page .su-button--blue{background:var(--mf-ui-blue-deep,#0d5fc2);box-shadow:none}
.social-universe-page .su-button--ghost{background:#f3f6f9;border:1px solid var(--su-line);color:#15365b}
.social-universe-page .su-setting select,
.social-universe-page .su-setting input[type="text"]{border-radius:2px;background:#fff}
.social-universe-page .su-profile-insight{padding:18px 19px}

@media(max-width:900px){
  .social-universe-page .su-hero__inner{min-height:210px;padding-top:36px;padding-bottom:30px}
  .social-universe-page .su-hero__mark{display:none}
  .social-universe-page .su-podium-card:nth-child(2){transform:none}
}
@media(max-width:620px){
  .social-universe-page .su-shell{padding-bottom:92px}
  .social-universe-page .su-hero__inner{min-height:185px;padding-top:27px;padding-bottom:25px}
  .social-universe-page .su-hero h1{font-size:2rem;margin-bottom:9px}
  .social-universe-page .su-hero p{font-size:.84rem;line-height:1.58}
  .social-universe-page .su-topnav{min-height:54px;gap:20px;padding-inline:14px}
  .social-universe-page .su-topnav a{min-height:54px;font-size:.8rem}
  .social-universe-page .su-content{padding-top:16px}
  .social-universe-page .su-card,
  .social-universe-page .su-card__head,
  .social-universe-page .su-card__body{border-radius:2px!important}
  .social-universe-page .su-card__head{padding:16px 15px 13px}
  .social-universe-page .su-card__body{padding:15px}
  .social-universe-page .su-progress-hero{padding:17px 16px}
  .social-universe-page .su-progress-identity{grid-template-columns:72px 1fr;gap:13px}
  .social-universe-page .su-level-orb{width:72px;height:66px}
  .social-universe-page .su-level-orb strong{font-size:1.7rem}
  .social-universe-page .su-progress-copy h2{font-size:1.23rem}
  .social-universe-page .su-stat-row{gap:6px}
  .social-universe-page .su-stat{padding:12px 11px}
  .social-universe-page .su-stat strong{font-size:1.2rem}
  .social-universe-page .su-mission{padding:12px}
  .social-universe-page .su-achievement{border-radius:2px!important;padding:14px}
  .social-universe-page .su-feed-card{padding:14px 13px;border-radius:2px!important}
  .social-universe-page .su-feed-event{padding-top:12px}
  .social-universe-page .su-podium-card{border-radius:2px!important;min-width:190px}
  .social-universe-page .su-filterbar{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .social-universe-page .su-filterbar::-webkit-scrollbar{display:none}
}
