/* Identity has a stable saved signal; the surrounding materials follow the world. */
#hubShell{isolation:isolate}
#hubShell>.hub-scene{z-index:-1}
#hubShell [data-avatar],#messageInbox [data-avatar]{--avatar-a:#b8a6ff;--avatar-b:#7edfe8;--avatar-emblem:url('/assets/avatar-orbit.svg')}
#hubShell [data-avatar="halo"],#messageInbox [data-avatar="halo"]{--avatar-a:#f6c46c;--avatar-b:#ff91af;--avatar-emblem:url('/assets/avatar-halo.svg')}
#hubShell [data-avatar="pulse"],#messageInbox [data-avatar="pulse"]{--avatar-a:#aab4ff;--avatar-b:#edb6ff;--avatar-emblem:url('/assets/avatar-pulse.svg')}
#hubShell [data-avatar="nova"],#messageInbox [data-avatar="nova"]{--avatar-a:#8debff;--avatar-b:#a0acff;--avatar-emblem:url('/assets/avatar-nova.svg')}
#hubShell [data-avatar="wave"],#messageInbox [data-avatar="wave"]{--avatar-a:#8ef0d5;--avatar-b:#8bb7ff;--avatar-emblem:url('/assets/avatar-wave.svg')}
#hubShell [data-avatar="ember"],#messageInbox [data-avatar="ember"]{--avatar-a:#ffb194;--avatar-b:#f6a2ce;--avatar-emblem:url('/assets/avatar-ember.svg')}
#hubShell :is(.person-avatar,.profile-avatar,.playlist-owner-avatar),#messageInbox :is(.thread-avatar,.thread-person-avatar){position:relative;isolation:isolate;background:linear-gradient(145deg,var(--avatar-a),var(--avatar-b));border:1px solid #ffffff4d;border-radius:var(--world-small-radius,16px);color:#12233a;text-shadow:none;box-shadow:inset 0 1px #ffffff55,0 5px 16px #0002;transform:none;overflow:hidden}
#hubShell :is(.person-avatar,.profile-avatar,.playlist-owner-avatar)::before,#messageInbox :is(.thread-avatar,.thread-person-avatar)::before{content:"";position:absolute;inset:0;z-index:-1;width:auto;height:auto;background-image:var(--avatar-emblem);background-size:100%;background-position:center;background-repeat:no-repeat;border:0;border-radius:0;opacity:.45;transform:none;box-shadow:none}
#hubShell :is(.person-avatar,.profile-avatar)::after{content:none}
#hubShell .profile-avatar span{transform:none;font:800 1.6rem/1 'Space Grotesk',sans-serif}
#hubShell .profile-avatar{width:112px;height:112px}
#hubShell .profile-avatar::before{background-position:center 12px;background-size:70px;opacity:.8}
#hubShell .profile-avatar span{align-self:end;margin-bottom:13px;font-size:1.25rem}
#hubShell .avatar-options .avatar-option{position:relative;min-height:106px;gap:8px;padding:12px 7px;border-radius:var(--world-small-radius,13px);background:var(--bg);font:500 .65rem/1.3 Inter,sans-serif;color:var(--muted);box-shadow:none}
#hubShell .avatar-option .avatar-emblem{display:block;width:53px;height:53px;border-radius:50%;background-image:var(--avatar-emblem),linear-gradient(145deg,color-mix(in srgb,var(--avatar-a) 25%,var(--bg)),var(--bg));background-size:82%,100%;background-position:center;background-repeat:no-repeat;border:1px solid color-mix(in srgb,var(--avatar-a) 38%,var(--line))}
#hubShell .avatar-option[aria-pressed="true"]{color:var(--fg);border-color:var(--a2);background:color-mix(in srgb,var(--a2) 7%,var(--bg))}
#hubShell .avatar-option[aria-pressed="true"]::after{content:"✓";display:grid;place-items:center;position:absolute;top:7px;right:7px;left:auto;bottom:auto;transform:none;opacity:1;z-index:1;pointer-events:none;width:17px;height:17px;border-radius:50%;background:var(--a2);color:#071322;font:700 .62rem/1 Inter,sans-serif}
#hubShell .identity-preview{position:relative;isolation:isolate;justify-content:flex-start;background:var(--bg2);box-shadow:inset 0 1px #ffffff0d}
#hubShell .identity-preview::before{content:"";position:absolute;inset:0 0 auto;height:180px;z-index:-1;background-image:linear-gradient(0deg,var(--bg2),transparent),var(--theme-world-art);background-size:cover;background-position:center;opacity:.6}
#hubShell .identity-preview .profile-avatar{margin-block:28px 18px;border-radius:var(--world-radius,24px)}
#hubShell .identity-preview .eyebrow{background:var(--bg);border:1px solid var(--line);padding:7px 10px;border-radius:20px}
#hubShell .identity-preview .profile-class{color:var(--a2);margin-block:8px 18px}
#hubShell .person-card{position:relative;isolation:isolate;grid-template-columns:60px minmax(0,1fr);gap:14px;padding:24px 20px 16px;background:var(--bg2);overflow:hidden;border-radius:var(--world-radius,20px);box-shadow:inset 0 1px #ffffff0d,0 10px 30px -22px #000}
#hubShell .person-card::before{content:"";position:absolute;inset:0 0 auto;height:98px;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--avatar-a) 9%,transparent),transparent);border-top:2px solid color-mix(in srgb,var(--avatar-a) 45%,transparent)}
#hubShell .person-card::after{content:none}
#hubShell .person-card>.person-avatar{width:60px;height:66px;align-self:start;margin-top:0;font:800 1rem/1 'Space Grotesk',sans-serif}
#hubShell .person-copy h3{font-size:1.02rem;line-height:1.35}
#hubShell .person-copy p{font-size:.74rem;line-height:1.6;-webkit-line-clamp:2}
#hubShell .person-copy a{font-size:.7rem;min-height:36px}
#hubShell .person-meta{gap:6px;align-items:center}
#hubShell .person-meta>span{font-size:.65rem;padding:4px 7px}
#hubShell .person-meta .profile-freshness{font-size:.6rem}
#hubShell .person-selection{display:flex;align-items:center;gap:12px;grid-column:1/-1;min-width:0;padding:12px;border:1px solid var(--line);border-radius:var(--world-small-radius,12px);background:var(--bg);color:var(--fg);text-decoration:none;min-height:82px}
#hubShell .person-selection>span:last-child{display:grid;gap:3px;min-width:0}
#hubShell .person-selection small{font:500 .6rem/1.4 Inter,sans-serif;color:var(--muted)}
#hubShell .person-selection b{font:600 .76rem/1.35 Inter,sans-serif;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#hubShell .person-selection span>span{font-size:.65rem;color:var(--muted)}
#hubShell .selection-mark{display:grid;place-items:center;position:relative;flex:none;width:44px;height:44px;border-radius:50%;background:repeating-radial-gradient(circle,#ffffff14 0 1px,transparent 2px 5px),linear-gradient(130deg,color-mix(in srgb,var(--avatar-a) 36%,var(--bg)),var(--bg));border:1px solid var(--line);color:var(--avatar-a);font-size:.95rem}
#hubShell .person-selection:hover{border-color:var(--a2);background:color-mix(in srgb,var(--a2) 4%,var(--bg))}
#hubShell .person-actions{padding-top:13px;border-top:1px solid var(--line);gap:8px;flex-wrap:wrap}
#hubShell .person-actions button{min-height:44px;box-shadow:none;font-size:.63rem}
#hubShell .person-actions .rank-chip{font-size:.57rem;letter-spacing:.05em;flex:none;margin-right:auto}
#hubShell .person-edit{display:inline-flex;align-items:center;min-height:44px;color:var(--a2);font-size:.65rem;text-decoration:none}
#hubShell .person-card>.notice:empty{display:none}
#hubShell .playlist-card{display:flex;flex-direction:column;gap:0;padding:18px;background:var(--bg2);border-radius:var(--world-radius,20px)}
#hubShell .playlist-art{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;width:100%;height:152px;padding:15px 17px;margin-bottom:18px;overflow:hidden;border:1px solid color-mix(in srgb,var(--avatar-a) 30%,var(--line));border-radius:var(--world-small-radius,13px);background:linear-gradient(120deg,color-mix(in srgb,var(--avatar-a) 22%,var(--bg)),color-mix(in srgb,var(--avatar-b) 13%,var(--bg)));box-shadow:inset 0 1px #ffffff15;color:var(--fg)}
#hubShell .playlist-art::before{content:"";position:absolute;z-index:-1;inset:0;background:repeating-linear-gradient(120deg,transparent 0 28px,#ffffff08 29px 30px);opacity:.5}
#hubShell .playlist-art::after{content:"";position:absolute;right:-20px;top:12px;width:145px;height:145px;border:1px solid #ffffff25;border-radius:50%;background:radial-gradient(circle at center,var(--avatar-a) 0 5px,#162335 6px 17px,transparent 18px),repeating-radial-gradient(circle,#ffffff17 0 1px,transparent 2px 5px),linear-gradient(150deg,#ffffff18,#0005);box-shadow:-12px 16px 28px #0003}
#hubShell .playlist-cover-kicker{font:600 .52rem/1.3 Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--avatar-a)}
#hubShell .playlist-cover-mark{font:700 2.4rem/1 var(--world-heading,'Space Grotesk'),sans-serif;letter-spacing:-.05em;z-index:1}
#hubShell .playlist-cover-label{font:500 .6rem/1.4 Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}
#hubShell .playlist-card>h3{font:700 1.04rem/1.35 'Space Grotesk',sans-serif}
#hubShell .playlist-card>p{font-size:.75rem;line-height:1.6;margin-top:7px}
#hubShell .playlist-owner-row{margin-top:15px}
#hubShell .playlist-card>.track-count{padding-bottom:16px;margin-top:9px;font-size:.65rem}
#hubShell .playlist-footer{margin-top:auto;border-top:1px solid var(--line);padding-top:10px}
#hubShell .playlist-footer button{min-height:44px}
#hubShell .hub-empty-state,#messageInbox .hub-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;padding:38px 24px;grid-column:1/-1;text-align:center;background:var(--bg2);border:1px dashed var(--line);border-radius:var(--world-radius,20px)}
#hubShell .hub-empty-state .empty-signal,#messageInbox .hub-empty-state .empty-signal{display:block;position:relative;flex:none;width:64px;height:64px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--a3) 20%,var(--bg)),var(--bg))}
#hubShell .empty-signal::before,#messageInbox .empty-signal::before{content:"";position:absolute;inset:13px;background:url('/assets/avatar-orbit.svg') center/contain no-repeat;opacity:.8}
#hubShell .hub-empty-state h3,#messageInbox .hub-empty-state h3{font:700 1.05rem/1.3 var(--world-heading,'Space Grotesk'),sans-serif;color:var(--fg)}
#hubShell .hub-empty-state p,#messageInbox .hub-empty-state p{max-width:44ch;font:400 .78rem/1.7 Inter,sans-serif;color:var(--muted)}
#messageInbox .thread-list>.hub-empty-state{padding:24px 10px;border:0;background:none;font-size:.7rem}
#messageInbox .thread-view>.hub-empty-state{height:100%;border:0;background:none}
@media(max-width:600px){
  #hubShell .person-card{padding:22px 18px 15px}
  #hubShell .playlist-art{height:146px}
  #hubShell .avatar-options .avatar-option{min-height:101px;font-size:.6rem}
  #hubShell .avatar-option .avatar-emblem{width:48px;height:48px}
}
@media(forced-colors:active){#hubShell .avatar-option[aria-pressed="true"]::after{color:HighlightText;background:Highlight}#hubShell .playlist-art::after{border-color:CanvasText}}
