:root{--bg:#090d14;--panel:#121925;--edge:#293344;--text:#f3f4f6;--muted:#a7b1c0;--gold:#f5c542;--cyan:#4ecfdd}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 0%,#1c2334 0%,transparent 40%),var(--bg);color:var(--text);font:15px/1.55 system-ui,Segoe UI,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#0b1018ed;border-bottom:1px solid #30394a;padding:10px max(22px,calc((100vw - 1200px)/2))}.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--text);font-size:19px;font-weight:900;letter-spacing:1px}.brand img{height:50px;width:54px;object-fit:contain}.brand b,.brand small,footer span{color:var(--gold)}.brand small{display:block;font-size:10px;font-weight:500;letter-spacing:.5px}nav{display:flex;gap:5px;flex-wrap:wrap}.nav{border:0;background:transparent;color:#bdc7d5;border-radius:9px;padding:9px 13px}.nav:hover,.nav.active{background:#263144;color:var(--gold)}.pill,.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.7px;color:var(--gold)}.demo{border:1px solid #6b5b2c;padding:6px 10px;border-radius:40px}.page{display:none;max-width:1200px;margin:auto;padding:36px 22px 75px}.page.active{display:block}.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:38px;align-items:center;min-height:485px}.hero h1,.page-head h1{font-size:clamp(38px,5vw,67px);line-height:1.09;letter-spacing:-2px;margin:17px 0}.hero em,.page-head em{font-style:normal;color:var(--gold)}.hero p,.page-head p{font-size:17px;color:var(--muted);max-width:620px}.actions,.stats,.row,.toolbar,.filters,.action-buttons,.position-row,.player-bottom{display:flex;gap:12px;align-items:center}.actions{margin:25px 0 35px;flex-wrap:wrap}.gold,.outline{padding:11px 17px;border-radius:10px;font-weight:750}.gold{border:1px solid #f5c542;background:var(--gold);color:#131821}.gold:hover{background:#ffda69}.outline{border:1px solid #465366;background:#161e2c;color:var(--text)}.outline:hover{border-color:var(--gold)}.small{font-size:12px;padding:7px 10px}.stats{flex-wrap:wrap;gap:26px}.stats strong{display:block;color:var(--gold);font-size:14px}.stats small{display:block;color:var(--muted);font-size:12px}.hero-card{text-align:center;padding:20px;border-radius:26px;border:1px solid #45402a;background:radial-gradient(ellipse,#33280d,#131923 65%)}.hero-card img{width:100%;max-height:280px;object-fit:contain}.hero-card h2{margin:0}.hero-card p{font-size:14px}.section-title,.page-head,.between{display:flex;justify-content:space-between;align-items:center;gap:16px}.section-title{margin:25px 0}.section-title h2,.page-head h1{margin:7px 0}.muted{color:var(--muted);font-size:13px}.songs-grid,.host-grid,.info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.song-card,.host-card,.panel{background:linear-gradient(155deg,#182232,#101720);border:1px solid var(--edge);border-radius:17px;padding:20px}.song-card{display:flex;gap:13px;align-items:center}.song-art{width:64px;height:64px;border-radius:10px;background:linear-gradient(135deg,#35274b,#204b5a);display:grid;place-items:center;font-size:29px;flex-shrink:0}.song-card h3{font-size:15px;margin:0}.song-card p{margin:2px 0;color:var(--muted);font-size:12px}.song-card button{margin-left:auto;background:transparent;border:0;color:var(--muted);font-size:22px}.song-card button.liked{color:#ff6b9b}.info-grid{margin-top:20px}.info-grid p,.panel p{color:var(--muted)}.page-head{margin-bottom:28px}.page-head h1{font-size:clamp(35px,4vw,52px)}.toolbar{justify-content:space-between;margin-bottom:18px;flex-wrap:wrap}.chip{background:#161f2d;color:var(--muted);border:1px solid var(--edge);padding:9px 15px;border-radius:50px}.chip.active{background:#3b321b;color:var(--gold);border-color:#9e7d27}input:not([type=checkbox]):not([type=color]),select{background:#0c121c;border:1px solid #3a4658;color:var(--text);padding:10px;border-radius:9px}.host-card{cursor:pointer;transition:transform .15s,border-color .15s}.host-card:hover{transform:translateY(-3px);border-color:var(--gold)}.host-card .avatar{width:70px;height:70px;font-size:34px}.host-card h3{margin:8px 0 4px}.host-card p{margin:4px 0 14px;font-size:13px}.avatar{display:grid;place-items:center;background:linear-gradient(135deg,#3d2d14,#203c4d);border-radius:18px}.liveflag{color:#7ae0b2;font-size:12px;font-weight:800;letter-spacing:.8px}.offline{color:#b1bbc9}.host-detail{margin-top:24px;scroll-margin-top:100px}.host-hero{display:flex;gap:20px;align-items:center;margin-bottom:25px}.host-hero .avatar{width:105px;height:105px;font-size:52px}.host-hero h2{font-size:29px;margin:3px 0}.host-hero p{margin:2px 0}.detail-layout{display:grid;grid-template-columns:1fr 245px;gap:22px}.panel-inner{padding:18px;background:#0d1420;border:1px solid var(--edge);border-radius:15px}.player-track{display:flex;align-items:center;gap:20px;margin:18px 0}.player-track h3{margin:0}.cover{width:105px;height:105px;border-radius:12px;overflow:hidden;background:#191b22}.cover img,.mini-cover img{width:100%;height:100%;object-fit:contain}.side-actions{display:flex;flex-direction:column;gap:12px}.small-note{font-size:12px;color:#b2bac8;border-left:2px solid var(--gold);padding:6px 11px;background:#20202a;border-radius:4px}.studio-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:20px}.queue-note{color:var(--muted);font-size:13px;margin:8px 0 15px}.queue-row{display:flex;align-items:center;gap:12px;border:1px solid #2d394a;border-radius:12px;padding:12px;margin-bottom:8px;cursor:pointer;background:#111b29}.queue-row.selected{border-color:var(--gold);background:#28251c}.queue-number{color:var(--muted);width:22px}.queue-info{flex:1}.queue-info strong{display:block}.queue-info small{color:var(--muted)}.boosted{font-size:12px;background:#3a2b13;border:1px solid #a47a25;color:#ffd66e;padding:5px 8px;border-radius:50px;white-space:nowrap}.free{font-size:12px;color:var(--muted)}.controls{border-top:1px solid var(--edge);margin-top:19px;padding-top:12px}.action-buttons{flex-wrap:wrap}.position-row{margin:15px 0;flex-wrap:wrap}.position-row label{color:var(--muted)}.mini-cover{height:175px;background:#1b1d23;border-radius:12px;display:grid;place-items:center;margin:15px 0}.full{width:100%}hr{border:0;border-top:1px solid var(--edge);margin:22px 0}.toggle{display:flex;align-items:center;gap:10px;margin:14px 0}.toggle input{accent-color:var(--gold)}aside select{max-width:100%}#overlay .panel>label{display:block;margin:14px 0 6px;color:var(--muted)}#overlay select{width:100%}#overlay input[type=color]{width:60px;height:35px;background:transparent;border:0;vertical-align:middle}.broadcast{--accent:#f5c542;background:#060a10;border:1px solid #475066;border-radius:13px;display:flex;gap:20px;align-items:center;padding:22px;margin:16px 0;min-height:220px}.broadcast-cover{width:160px;height:160px;background:linear-gradient(135deg,#30260d,#182331);border-radius:12px;flex-shrink:0}.broadcast-cover img{width:100%;height:100%;object-fit:contain}.broadcast-info{min-width:0;flex:1}.broadcast-info h2{font-size:clamp(22px,3vw,36px);line-height:1.1;margin:12px 0 5px}.broadcast-info p{font-size:19px;color:#e0e6ef;margin:0 0 10px}.broadcast-top{color:var(--accent);font-size:12px;font-weight:800;letter-spacing:1px}.broadcast-next{font-size:12px;color:#adb9c7}.broadcast-brand{align-self:flex-end;color:var(--accent);font-weight:900;white-space:nowrap}.broadcast.compact{max-width:440px;min-height:120px;padding:13px;gap:12px}.broadcast.compact .broadcast-cover{width:95px;height:95px}.broadcast.compact .broadcast-brand{display:none}.broadcast.vertical{max-width:340px;min-height:470px;flex-direction:column;text-align:center;justify-content:center}.broadcast.vertical .broadcast-cover{width:190px;height:190px}.broadcast.vertical .broadcast-brand{align-self:center}footer{padding:30px max(22px,calc((100vw - 1200px)/2));border-top:1px solid var(--edge);display:flex;justify-content:space-between;gap:40px}footer p{font-size:12px;color:var(--muted)}footer>div{max-width:520px}dialog{background:#172130;color:white;border:1px solid #566178;border-radius:18px;padding:25px;max-width:430px;width:90%}dialog::backdrop{background:#000b}dialog form{position:relative}.close{position:absolute;right:0;top:0;border:0;background:transparent;color:white;font-size:20px}@media(max-width:850px){.top{flex-wrap:wrap}.demo{display:none}.hero,.studio-grid,.detail-layout{grid-template-columns:1fr}.hero-card{max-width:420px}.songs-grid,.host-grid,.info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.side-actions{flex-direction:row;flex-wrap:wrap}.broadcast-brand{display:none}}@media(max-width:580px){.page{padding:25px 14px 55px}.top{padding:8px 14px}.nav{padding:7px;font-size:12px}.songs-grid,.host-grid,.info-grid{grid-template-columns:1fr}.hero h1{font-size:41px}.section-title,.page-head{align-items:flex-start;flex-direction:column}.broadcast{gap:9px;padding:10px}.broadcast-cover{width:90px;height:90px}.broadcast-info h2{font-size:20px}.broadcast-info p{font-size:13px}.broadcast-top,.broadcast-next{font-size:9px}.host-hero .avatar{width:75px;height:75px;font-size:36px}footer{flex-direction:column}.stats{gap:12px}}

/* Community / Radio design additions */
.brand small{font-size:9px;letter-spacing:1px}.hero h1{font-size:clamp(35px,4.4vw,61px)}.hero-card{border-color:#8e6a23;box-shadow:0 10px 60px #b88b1518}.hero-card img{filter:drop-shadow(0 0 18px #ffba2638)}
.radio-teaser{margin:34px 0 24px;padding:25px;border:1px solid #816522;border-radius:18px;background:linear-gradient(110deg,#2c220f,#141921 70%);display:flex;align-items:center;justify-content:space-between;gap:20px}.radio-teaser h2{font-size:27px;margin:4px 0}.radio-teaser p{color:var(--muted);margin:0}.radio-top{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:26px}.radio-feature{min-height:215px;border:1px solid #755d25;background:linear-gradient(110deg,#33250f,#121923);padding:25px;border-radius:20px;position:relative;overflow:hidden}.radio-feature h2{font-size:36px;margin:7px 0}.radio-feature p{color:#d3d5d8;max-width:60%;position:relative;z-index:1}.radio-feature-art{position:absolute;right:0;top:0;bottom:0;width:42%;display:flex;align-items:center;justify-content:center}.radio-feature-art img{width:100%;max-height:190px;object-fit:contain}.side-feature{background:#151b24;border-color:var(--edge)}.side-feature p{max-width:none}.radio-stations{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-bottom:26px}.station-card{padding:0 0 14px;overflow:hidden;text-align:left;border-radius:14px;background:#121923;border:1px solid #3e4140;color:#f5f5f5}.station-card.selected,.station-card:hover{border-color:var(--gold);box-shadow:0 0 0 1px #9e7c2b}.station-art{height:130px;background:radial-gradient(circle at 55% 40%,#745319,#181b24 70%);font-size:64px;display:grid;place-items:center;margin-bottom:11px}.station-card strong,.station-card span,.station-card small{display:block;padding:0 12px}.station-card strong{font-size:14px}.station-card span{color:#b6bfcc;font-size:12px}.station-card small{color:var(--gold);margin-top:8px;font-size:11px}.radio-listen-grid{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:18px}.radio-tracks{margin-top:20px}.radio-track{display:flex;align-items:center;gap:13px;width:100%;text-align:left;color:var(--text);border:1px solid transparent;border-bottom-color:#303945;background:transparent;padding:11px 8px;border-radius:7px}.radio-track.selected,.radio-track:hover{background:#2b271b;border-color:#8e6a23}.track-count{width:20px;color:#c6cbd4}.track-icon{width:44px;height:44px;background:#2e2831;border-radius:9px;display:grid;place-items:center;font-size:22px}.track-info{flex:1}.track-info strong,.track-info small{display:block}.track-info small{color:var(--muted)}.track-play{color:var(--gold)}.radio-cover{height:195px;border:1px solid #5c4a27;border-radius:14px;background:radial-gradient(circle,#4b3818,#111924 70%);margin:16px 0;display:grid;place-items:center}.radio-cover img{height:95%;max-width:95%;object-fit:contain}.radio-player h2{margin-bottom:4px}.radio-controls{display:flex;gap:10px;justify-content:center;margin:19px 0}.audio-load{border-top:1px solid var(--edge);padding-top:17px}.audio-load label{display:block;color:var(--muted);font-size:13px;margin-bottom:10px}.audio-load input{font-size:12px;max-width:100%}.audio-load audio{width:100%;margin-top:13px}.radio-info{margin-top:20px}
@media(max-width:1050px){.radio-stations{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:850px){.radio-top,.radio-listen-grid{grid-template-columns:1fr}}@media(max-width:580px){.radio-stations{grid-template-columns:repeat(2,minmax(0,1fr))}.station-art{height:110px}.radio-teaser{align-items:flex-start;flex-direction:column}.radio-feature p{max-width:100%}.radio-feature-art{opacity:.2}}

/* Distinct new homepage design, inspired by approved visual direction */
:root{--gold:#f6c340}
body{background:#080a0d;color:#f2f2f4}
.top{background:#090a0d;border-bottom:1px solid #8e6827;max-width:none;padding:10px 2.6%;box-shadow:0 6px 30px #0008}
.brand{min-width:250px}.brand img{width:72px;height:72px;object-fit:contain}.brand span{font-size:28px;letter-spacing:.03em;line-height:1}.brand b{font-style:italic;color:#f5bf3a;text-shadow:0 0 14px #d98c4b99}.brand small{margin-top:8px;letter-spacing:2px;font-size:9px;color:#f2c75c}
.top nav{gap:5px}.top .nav{font-size:13px}.top .nav.active{color:#ffcb44;border-bottom:2px solid #ffcb44}
#home.page{max-width:1600px;padding:0 22px 50px;margin:auto}
.landing-hero{min-height:310px;position:relative;display:grid;grid-template-columns:57% 43%;background:radial-gradient(circle at 65% 50%,#52340e66,transparent 45%),linear-gradient(95deg,#08090c,#18120c);border-bottom:1px solid #88621e;overflow:hidden;margin:0 -22px 18px;padding:32px 4.5%;isolation:isolate}
.landing-hero:before{content:"";position:absolute;inset:0;opacity:.14;background-image:repeating-linear-gradient(60deg,transparent 0 35px,#ad752a 36px 37px,transparent 38px 74px);pointer-events:none}
.landing-copy{position:relative;z-index:2;align-self:center}.landing-copy .eyebrow{font-size:11px;letter-spacing:2px;color:#f1bd4d}.landing-copy h1{font-size:clamp(26px,3.2vw,46px);font-weight:900;line-height:1.15;margin:16px 0;letter-spacing:-.025em}.landing-copy h1 em{font-style:normal;color:#f6c340}.landing-copy p{max-width:620px;font-size:15px;line-height:1.65;color:#d7d8da}.landing-copy .actions{margin-top:17px}
.hero-mascot{background:url('assets/hero-bee.jpg') center center/cover no-repeat;min-height:275px;mask-image:linear-gradient(to right,transparent 0%,black 25%);filter:saturate(1.1) contrast(1.12)}
.homepage-section{margin-top:19px}.home-section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}.home-section-title h2{font-size:23px;margin:0}.home-section-title h2 span{color:#ffc33f}.home-section-title small{font-size:12px;color:#9da0a8;font-weight:400;margin-left:12px}.home-section-title button,.textlink{background:none;border:0;color:#f8c540;cursor:pointer;font-weight:700}
.live-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.live-tile{border:1px solid #967129;background:#121318;border-radius:13px;padding:0;overflow:hidden;text-align:left;color:#fff;cursor:pointer}.live-tile .tile-image{height:110px;display:flex;align-items:center;justify-content:center;font-size:52px;background:radial-gradient(circle at 50% 45%,#8c532b,#251c22 60%,#090a10)}.live-tile:nth-child(2) .tile-image{background:radial-gradient(circle,#66344e,#0c1020 75%)}.live-tile:nth-child(3) .tile-image{background:radial-gradient(circle,#2b6485,#121019 75%)}.live-tile:nth-child(4) .tile-image{background:radial-gradient(circle,#674523,#10151b 75%)}.tile-text{padding:10px 12px}.tile-text strong,.tile-text small{display:block}.tile-text small{color:#bfc2c9;margin-top:4px}.live-tile .liveflag{background:#c92732;color:white;border-radius:5px;padding:3px 6px;font-size:10px;display:inline-block;margin-top:7px}
.home-stations{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.home-station{border:1px solid #987028;background:#101217;color:#fff;text-align:left;border-radius:12px;overflow:hidden;padding:0;cursor:pointer}.home-station-art{height:100px;display:grid;place-items:center;font-size:46px;background:radial-gradient(circle at 50% 45%,#745022,#0c1019 75%)}.home-station:nth-child(2) .home-station-art{background:radial-gradient(circle,#ad7034,#15141d 80%)}.home-station:nth-child(3) .home-station-art{background:radial-gradient(circle,#9d3476,#0b1526 80%)}.home-station:nth-child(4) .home-station-art{background:radial-gradient(circle,#455a82,#0d0e14 80%)}.home-station:nth-child(5) .home-station-art{background:radial-gradient(circle,#295a76,#0b1220 80%)}.home-station:nth-child(6) .home-station-art{background:radial-gradient(circle,#55632c,#10171a 80%)}.home-station .station-label{padding:10px}.home-station strong,.home-station small{display:block}.home-station strong{font-size:13px}.home-station small{font-size:11px;color:#b8b9c0;margin-top:4px}
.home-bottom{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:13px;margin-top:18px}.home-panel{border:1px solid #71551e;background:linear-gradient(130deg,#151515,#0c0f14);padding:18px;border-radius:15px;min-width:0}.home-panel h2{font-size:18px;color:#f9c947;margin:0 0 9px}.home-panel p{font-size:13px;color:#c3c5cc;line-height:1.55}.mini-playlists{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0}.mini-playlists button{background:#2a2114;border:1px solid #8c692a;color:#f4e4bf;border-radius:7px;padding:9px;font-size:12px}.home-panel .songs-grid{display:grid;grid-template-columns:1fr;gap:6px}.home-panel .song-card{padding:8px;background:#171b21}.home-panel .song-art{width:42px;height:42px;font-size:21px}.home-panel .song-card:nth-child(n+4){display:none}.daw-note{text-align:center;color:#999ea8;font-size:12px;margin:24px auto 0}.daw-note a{color:#e9bd5c}
@media(max-width:980px){.live-strip{grid-template-columns:repeat(2,1fr)}.home-stations{grid-template-columns:repeat(3,1fr)}.home-bottom{grid-template-columns:1fr 1fr}.home-bottom .home-panel:last-child{grid-column:1/-1}}
@media(max-width:640px){.landing-hero{display:flex;flex-direction:column;padding:22px 20px}.hero-mascot{min-height:150px;width:100%;mask-image:linear-gradient(to bottom,black,transparent)}.landing-copy h1{font-size:28px}.live-strip{grid-template-columns:repeat(2,1fr)}.home-stations{grid-template-columns:repeat(2,1fr)}.home-bottom{grid-template-columns:1fr}.home-bottom .home-panel:last-child{grid-column:auto}.home-section-title h2{font-size:18px}.home-section-title small{display:block;margin-left:0}.brand span{font-size:21px}.brand img{width:58px;height:58px}}

/* Bombus LIVE: uncluttered home, artist workspace, and profile */
.portal-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:22px 0 28px}.portal-tile{background:linear-gradient(150deg,#151c23,#0b1015);border:1px solid #504023;border-radius:16px;min-height:132px;padding:20px;display:flex;align-items:flex-start;flex-direction:column;gap:7px;text-align:left;color:#fff;transition:transform .2s,border-color .2s}.portal-tile:hover{transform:translateY(-3px);border-color:#eac14b}.portal-icon{font-size:31px;color:#f5c542}.portal-tile strong{font-size:18px}.portal-tile small{color:#b2b9c5}.home-intro{border:1px solid #343336;background:#11161d;border-radius:18px;padding:25px;display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:36px}.home-intro h2{font-size:27px;margin:8px 0}.home-intro em{color:#f5c542;font-style:normal}.home-intro p{color:#adb5c0;max-width:680px}.library-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:20px 0}.library-metrics>div{background:#111922;border:1px solid #373638;border-radius:13px;padding:18px;display:flex;flex-direction:column;gap:5px}.library-metrics strong{font-size:27px;color:#f5c542}.library-metrics small{color:#aab3be}.library-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(290px,1fr);gap:18px}.library-songs{display:grid;gap:10px;margin-top:18px}.library-song{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:12px;border:1px solid #303945;background:#0b121b;border-radius:12px;padding:10px}.library-song-art{width:56px;height:56px;object-fit:contain;border-radius:8px;background:#17212c}.library-song h3{margin:0 0 4px;font-size:16px}.library-song p{margin:0;color:#aeb7c2;font-size:13px}.song-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:end}.song-actions button,.playlist-actions button{font-size:12px;padding:8px 10px}.visibility-tag{font-size:11px;color:#f5c542;letter-spacing:.04em}.library-layout form{display:grid;gap:10px}.library-layout input,.library-layout select,.playlists-workspace input,.playlists-workspace select{width:100%;min-width:0;padding:11px;border:1px solid #48505b;border-radius:9px;background:#101820;color:#fff}.library-layout input[type=file]{font-size:12px}.library-layout label{color:#c4cbd6;font-size:13px}.playlists-workspace{margin-top:20px}.playlist-editor{display:grid;gap:12px;margin-top:16px}.playlist-item{border:1px solid #303945;border-radius:12px;background:#0c141d;padding:16px}.playlist-item h3{margin:0 0 6px}.playlist-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}.playlist-song-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.playlist-song-list label{border:1px solid #343e4a;padding:7px 9px;border-radius:8px;font-size:13px;display:flex;align-items:center;gap:6px}.playlist-song-list input{width:auto}.profile-banner{background:linear-gradient(125deg,#33270f,#141b25 60%);border:1px solid #6b5526;border-radius:18px;padding:25px;display:flex;align-items:center;gap:22px;margin:20px 0}.profile-avatar{height:120px;width:120px;flex-shrink:0;border:1px solid #b28a36;border-radius:16px;background:#0c1219;display:grid;place-items:center}.profile-avatar img{max-width:100%;max-height:100%;object-fit:contain}.profile-banner h2{font-size:29px;margin:8px 0}.profile-stats{display:flex;gap:20px;color:#e4c471;font-size:13px}.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}.profile-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #293441;padding:12px 0}.profile-entry strong{display:block}.profile-entry small{color:#aab5c1}.profile-entry button{white-space:nowrap}.empty-note{padding:25px;text-align:center;color:#aab5c1;border:1px dashed #44505c;border-radius:12px;margin-top:15px}.profile-grid .panel{min-width:0}#profile-audio{width:100%;margin-top:12px}.small-note{line-height:1.5}
@media(max-width:850px){.portal-links{grid-template-columns:repeat(2,minmax(0,1fr))}.library-layout,.profile-grid{grid-template-columns:1fr}.library-song{grid-template-columns:50px minmax(0,1fr)}.song-actions{grid-column:1/-1;justify-content:start}.home-intro{flex-direction:column;align-items:start}}
@media(max-width:530px){.portal-links{gap:9px}.portal-tile{min-height:112px;padding:14px}.portal-tile strong{font-size:15px}.profile-banner{flex-direction:column;align-items:start}.library-metrics{gap:7px}.library-metrics>div{padding:12px}.library-metrics strong{font-size:21px}}

/* Featured host and newcomer rails */
.community-spotlights{max-width:1200px;margin:48px auto 14px;display:grid;gap:28px}
.spotlight-section{padding:24px;border:1px solid rgba(241,188,58,.19);border-radius:20px;background:linear-gradient(135deg,rgba(34,30,20,.72),rgba(13,17,24,.92))}
.spotlight-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:17px}
.spotlight-heading h2{font-size:clamp(23px,3vw,31px);margin:5px 0}.spotlight-heading h2 em{color:#f5c542;font-style:normal}.spotlight-heading p{color:#abb3c2;margin:4px 0}
.spotlight-nav{display:flex;gap:8px}.spotlight-arrow{height:39px;width:43px;border-radius:11px;background:#222b37;border:1px solid #45505b;color:#f5c542;font-size:22px;cursor:pointer}.spotlight-arrow:hover{background:#39424d}
.spotlight-track{display:flex;gap:13px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;padding:5px 3px 12px;scroll-behavior:smooth}
.spotlight-card{flex:0 0 156px;min-height:193px;padding:15px 10px 13px;border:1px solid #313b47;border-radius:16px;background:#131b26;display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;color:#f4f5f8;scroll-snap-align:start}
button.spotlight-card{cursor:pointer;font:inherit}button.spotlight-card:hover{border-color:#f5c542;transform:translateY(-2px)}
.spotlight-card strong{font-size:14px;line-height:1.2}.spotlight-card small{color:#aeb6c4;font-size:12px;line-height:1.25;min-height:30px}
.spotlight-avatar{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;border:2px solid #e6b844;box-shadow:0 0 0 4px rgba(245,197,66,.08);font-weight:900;font-size:25px;color:#fff}
.avatar-tone-0{background:linear-gradient(135deg,#7a4529,#24141b)}.avatar-tone-1{background:linear-gradient(135deg,#1e7480,#192438)}.avatar-tone-2{background:linear-gradient(135deg,#875c91,#281d3b)}.avatar-tone-3{background:linear-gradient(135deg,#2d7561,#102e2c)}.avatar-tone-4{background:linear-gradient(135deg,#a47737,#322016)}.avatar-tone-5{background:linear-gradient(135deg,#4c649b,#1a213c)}
.spotlight-status,.member-new{font-size:10px;font-weight:800;letter-spacing:.06em;color:#f5c542}.spotlight-status.online{color:#66e0a2}.member-spotlight{background:linear-gradient(150deg,#171c2c,#151923)}.member-new{color:#91c5f2}.spotlight-end{display:flex;justify-content:flex-end;margin-top:7px}.spotlight-end .muted{font-size:12px}
/* Editable artist profile */
.profile-customize{margin-bottom:22px}.profile-edit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.profile-edit-grid>div{display:grid;gap:6px}.profile-edit-grid .profile-wide{grid-column:1/-1}.profile-edit-grid textarea{width:100%;min-height:95px;padding:12px;border-radius:10px;border:1px solid #46515e;background:#111820;color:#fff;resize:vertical;font:inherit}.profile-customize .action-buttons{margin-top:16px}
#custom-profile-banner{background-position:center;background-size:cover;min-height:205px}.profile-socials{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px}.profile-socials a{color:#f5c542;text-decoration:none;font-weight:700}.profile-featured{color:#f5c542;margin-top:10px;font-size:14px;font-weight:700}
@media(max-width:700px){.community-spotlights{margin-top:30px}.spotlight-section{padding:16px}.spotlight-card{flex-basis:140px}.spotlight-heading{align-items:flex-start}.spotlight-nav{flex-shrink:0}.profile-edit-grid{grid-template-columns:1fr}}

/* Centered community showcases: equal visibility for all hosts and new members */
.community-spotlights{text-align:center}
.spotlight-heading{flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:10px}
.spotlight-heading>div:first-child{width:100%}
.spotlight-heading h2{max-width:100%;text-wrap:balance}
.spotlight-heading p{max-width:640px;margin:6px auto}
.spotlight-nav{justify-content:center;align-items:center}
.spotlight-track{justify-content:safe center}
.spotlight-end{justify-content:center;text-align:center}
@media(max-width:700px){.spotlight-heading{align-items:center}.spotlight-nav{flex-shrink:1}}

/* FIX: The earlier safe-center flex rule centered only the scrollable content,
   not the actual visible rail. Size the rail to ten equal columns and center
   the whole rail within its panel. */
.community-spotlights {width:100%;max-width:1280px;margin-left:auto;margin-right:auto;}
.spotlight-section {width:100%;min-width:0;box-sizing:border-box;}
.spotlight-heading {display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
.spotlight-heading > div:first-child {width:100%;}
.spotlight-heading h2,.spotlight-heading p {margin-left:auto;margin-right:auto;text-align:center;}
.spotlight-nav {width:100%;display:flex;justify-content:center;gap:12px;}
.spotlight-track {
  --visible-cards:10;
  --card-gap:10px;
  display:flex;
  justify-content:flex-start !important;
  gap:var(--card-gap);
  width:100%;
  max-width:1120px;
  box-sizing:border-box;
  margin:0 auto;
  padding:6px 0 12px;
  overflow-x:auto;
  scroll-padding-inline:0;
  scrollbar-width:thin;
}
.spotlight-track .spotlight-card {
  box-sizing:border-box;
  flex:0 0 calc((100% - (var(--visible-cards) - 1) * var(--card-gap)) / var(--visible-cards));
  min-width:0;
  padding:14px 4px;
}
.spotlight-track .spotlight-card strong {overflow-wrap:anywhere;}
.spotlight-end {justify-content:center;}
@media (max-width:1150px) {.spotlight-track{--visible-cards:7;}}
@media (max-width:850px) {.spotlight-track{--visible-cards:5;}}
@media (max-width:600px) {.spotlight-track{--visible-cards:3;}}
@media (max-width:400px) {.spotlight-track{--visible-cards:2;}}