/* Musical imagery and quiet graphic accents, keeping the community palette. */
.auth-music,.community-photo,.music-welcome,.sidebar .cover,.cover{background-image:linear-gradient(100deg,rgba(41,67,85,.12),rgba(75,48,102,.16)),url('/images/music-scene.png');background-size:cover;background-position:center}
.auth-music{height:126px;margin:-24px -24px 24px;border-radius:15px 15px 0 0;border-bottom:3px solid #36c3df;position:relative;overflow:hidden}
.auth-music:after{content:"";position:absolute;inset:12px;border:1px solid #ffffff65;border-radius:70px 12px 70px 12px;pointer-events:none}
.auth{overflow:hidden;padding:24px}
.sidebar .cover,.cover{background-position:8% 45%;border-bottom:3px solid #a643b4}
.music-welcome{position:relative;isolation:isolate;overflow:hidden;min-height:154px;margin:0 0 24px;padding:26px 30px;border-radius:16px;color:#fff;background-position:center 48%;border:1px solid #758baf;box-shadow:0 6px 20px #29435514}
.music-welcome:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(270deg,#294355f5 0%,#294355df 34%,#29435535 75%)}
.music-welcome:after{content:"";position:absolute;width:240px;height:110px;left:-40px;bottom:-35px;border:2px solid #36c3dfb0;border-radius:50%;transform:rotate(-18deg);pointer-events:none}
.music-welcome h2{color:white;margin:7px 0;font-size:25px}.music-welcome p{margin:0;color:#e7f1f9;font-size:14px}.music-eyebrow{font-size:12px;color:#83e7f4;letter-spacing:.4px}
.music-wave{position:absolute;left:26px;top:22px;display:flex;align-items:center;gap:5px;height:35px;filter:drop-shadow(0 1px 5px #294355)}
.music-wave i{width:4px;height:12px;border-radius:8px;background:#79e4ee}.music-wave i:nth-child(2n){height:24px;background:#dda5e5}.music-wave i:nth-child(3n){height:34px}
.community-photo{height:105px;margin:-24px -24px 19px;background-size:300% auto;background-position:100% 55%;border-bottom:3px solid #a643b4}.community-scene{overflow:hidden}
.panel h3{position:relative;padding-inline-start:12px}.panel h3:before{content:"";position:absolute;inset-inline-start:0;top:5px;bottom:4px;width:3px;border-radius:4px;background:linear-gradient(#36c3df,#a643b4)}
@media(max-width:800px){.auth-music{height:100px;margin:-18px -18px 18px}.music-welcome{min-height:138px;padding:22px 20px;margin-bottom:18px;background-position:65% center}.music-welcome h2{font-size:22px}.music-welcome p{max-width:245px;line-height:1.6}.music-wave{left:15px;top:15px;gap:3px;opacity:.8}.music-welcome:before{background:linear-gradient(270deg,#294355f0,#294355ac 60%,#29435555)}}
@media(max-width:800px){.auth{padding:18px}}
@media(max-width:380px){.music-wave{display:none}.auth-music{height:84px}}
.recent-heading h2{margin-bottom:6px}.recent-heading p{margin-top:0}.recent-filters{gap:7px;flex-wrap:wrap}.recent-filters button{padding:8px 13px}.recent-entry{position:relative;margin-bottom:20px}.recent-meta{display:flex;align-items:center;gap:10px;margin-bottom:8px;padding-inline:5px;font-size:12px;color:#6b8191}.recent-meta .tag{background:#ddeef4;color:#355b73}.recent-entry>.panel{margin-bottom:0;border-inline-start:3px solid #65bed2}.recent-entry:nth-child(2n)>.panel{border-inline-start-color:#ba87c6}.recent-meta time{font-size:12px}.recent-entry details p{white-space:pre-wrap}.recent-entry>.panel>p{white-space:pre-wrap}
.friend-presence{display:flex;align-items:center;gap:9px;padding:10px 0;border-bottom:1px solid #e4ecf2}.friend-presence:last-child{border-bottom:0}.friend-presence .avatar{width:36px;height:36px;flex-shrink:0}.friend-presence>div{flex:1;min-width:0}.friend-presence>div>button{padding:0;border:0;background:transparent;text-align:right;overflow-wrap:anywhere}.friend-presence small{display:block;font-size:11px;color:#6b8191}.presence-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-inline-end:5px}.presence-dot.online{background:#269951}.presence-dot.offline{background:#d54959}.friend-presence>.small{padding:6px;font-size:12px}
.message-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 5px;margin-inline-start:5px;border-radius:12px;background:#a643b4;color:#fff;font-size:12px;font-weight:bold}.message-row{margin-top:14px}.message-row p{white-space:pre-wrap;overflow-wrap:anywhere}.message-unread{border-inline-start:3px solid #36c3df;background:#edf7fa}.save-draft{margin-top:6px;color:#477e9d}
.youtube-video{width:100%;margin:14px 0;overflow:hidden;border-radius:12px;background:#edf3f7;border:1px solid #cfdeea;white-space:normal}.youtube-video iframe{display:block;width:100%;aspect-ratio:16/9;min-height:200px;border:0;background:#172c3b}.youtube-video a{display:block;padding:8px 12px;font-size:12px;color:#477e9d}.bubble:has(.youtube-video){width:100%}.panel p,.comment p{overflow-wrap:anywhere}
.spotify-player{width:100%;margin:14px 0;border-radius:12px;overflow:hidden;background:#edf3f7;white-space:normal}.spotify-player iframe{display:block;width:100%;border:0}.spotify-player a{display:block;padding:8px 12px;color:#477e9d;font-size:12px}.bubble:has(.spotify-player){width:100%}
.stories-panel h2{font-size:21px;margin:0}.story-strip{display:flex;gap:12px;overflow-x:auto;padding:16px 2px;max-width:100%}.story-tile{position:relative;width:116px;height:164px;flex:0 0 116px;padding:0;overflow:hidden;border-radius:14px;border:2px solid #a643b4;background:linear-gradient(140deg,#294355,#477e9d);color:white}.story-thumb{width:100%;height:100%;object-fit:cover}.story-text-thumb{display:block;padding:18px 10px;font-size:14px;line-height:1.6;overflow-wrap:anywhere}.story-author{position:absolute;bottom:0;right:0;left:0;background:linear-gradient(transparent,#294355ee);padding:25px 7px 7px;display:flex;align-items:center;gap:5px}.story-author .avatar{width:26px;height:26px;border-radius:50%;border:2px solid #36c3df;object-fit:cover;flex-shrink:0}.story-author>span:last-child{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#story-viewer{padding:0;border:0;border-radius:16px;background:#203747;color:white;width:420px;max-width:calc(100vw - 20px);max-height:95dvh;overflow:auto}#story-viewer::backdrop{background:#152637d9}.story-view-head{display:flex;align-items:center;gap:10px;padding:13px 16px}.story-view-head .avatar{width:38px;height:38px;border-radius:50%;object-fit:cover}.story-view-head>div{flex:1}.story-view-head small{display:block;font-size:11px;color:#c7dbe5}.story-view-head button{font-size:23px}.story-screen{position:relative;min-height:300px;height:min(60dvh,560px);background:linear-gradient(150deg,#477e9d,#683d80);display:flex;align-items:center;justify-content:center}.story-screen img{width:100%;height:100%;object-fit:contain}.story-caption{position:absolute;bottom:0;right:0;left:0;margin:0;padding:25px 20px 20px;background:linear-gradient(transparent,#203747ee);white-space:pre-wrap;overflow-wrap:anywhere;max-height:60%;overflow:auto}.story-only-text{padding:30px;font-size:24px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:100%;overflow:auto}.story-view-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px}.story-view-actions button{min-height:44px}
#notification-control{position:relative}#notification-bell{position:relative;display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:#e5f2f8;color:#477e9d;border:0}.notification-count{position:absolute;top:-5px;right:-5px;min-width:19px;height:19px;background:#a643b4;color:white;border-radius:12px;font-size:11px;line-height:19px;padding:0 4px}.notification-popover{position:absolute;left:0;top:52px;width:370px;max-width:calc(100vw - 24px);background:white;border:1px solid #cfdeea;border-radius:15px;padding:18px;box-shadow:0 12px 40px #29435535;z-index:1000;color:#294355}.notification-popover h2{font-size:22px;margin:0}.notification-popover>.row:first-child{margin-bottom:15px}.notification-popover>.row:first-child button{font-size:11px;padding:5px}.notification-list{max-height:440px;overflow-y:auto;margin-top:12px}.notification-item{display:flex;align-items:center;gap:11px;text-align:right;width:100%;border:0;background:white;padding:12px 8px;border-radius:10px;white-space:normal;color:#294355}.notification-item.is-new{background:#eef7fb}.notification-item .avatar{width:42px;height:42px;flex-shrink:0;border-radius:50%;object-fit:cover}.notification-item>span:not(.avatar){flex:1;font-size:13px;line-height:1.6}.notification-item small{display:block;color:#477e9d;font-size:11px}.notification-item i{width:8px;height:8px;border-radius:50%;background:#36c3df;flex-shrink:0}
@media(max-width:800px){#notification-control{position:static}.notification-popover{position:fixed;top:85px;left:12px;right:12px;width:auto;max-width:none}.notification-list{max-height:55dvh}.notification-item{min-height:65px}}
.member-card.panel{padding:0;overflow:hidden;display:flex;flex-direction:column}.member-card .member-cover{height:135px;margin:0;border-radius:14px 14px 0 0}.member-cover{position:relative;overflow:hidden}.member-cover img{width:100%;height:100%;display:block;object-fit:cover}.member-content{padding:0 20px 20px;flex:1;display:flex;flex-direction:column;align-items:flex-start}.member-content>.avatar{width:76px;height:76px;border-radius:50%;outline:4px solid white;margin-top:-38px;position:relative;object-fit:cover;box-shadow:0 3px 12px #29435522}.member-content h2{margin:13px 0 6px;font-size:21px}.member-content h2 button{padding:0;background:none;border:0;color:#294355;font-size:inherit;font-weight:bold;text-align:right}.member-facts{display:flex;flex-wrap:wrap;gap:5px 12px;font-size:12px;color:#678092;margin:6px 0 12px}.member-bio{font-size:14px;line-height:1.7;overflow-wrap:anywhere;min-height:24px}.member-actions{margin-top:auto;padding-top:18px;gap:7px;width:100%;flex-wrap:wrap}.member-actions button{flex:1 1 auto;font-size:13px}.member-actions button[data-action=friend]{background:#e5f2f8;border-color:#a9cbdc;color:#365f79}.member-profile>.member-cover{height:200px}.member-profile>.avatar{position:relative;width:92px;height:92px;border-radius:50%;outline:5px solid white;margin-top:-50px;object-fit:cover}.member-profile>h2{margin-top:12px}.sidebar .member-cover{height:100px}.sidebar .member-cover+.avatar{border-radius:50%;object-fit:cover}
@media(max-width:800px){.member-card .member-cover{height:140px}.member-profile>.member-cover{height:155px}.member-content{padding-inline:16px}.member-facts{font-size:13px}.member-actions button{min-height:44px}}
@media(max-width:800px){.sidebar{display:block}.sidebar>section:not(.friends-panel){display:none}.friends-panel{padding:12px}.friend-presence-list{display:flex;gap:16px;overflow-x:auto;max-height:160px}.friend-presence{min-width:190px;border:0;flex-shrink:0}}