/* Lennon Music V4 — Neutral Dark / Subtle Glass / Selective Lime
   All surfaces, artwork placeholders, hero panels and overlays use neutral graphite.
   Brand green is reserved for primary action buttons, play controls and logo.
   SPA and persistent player behavior is unchanged from V3. */
:root {
  --bg:#0b0d12; --surface:#15171d; --surface-2:#1c1e26; --surface-3:#232630;
  --line:#30323d; --text:#f4f5f8; --muted:#9b9fae; --subtle:#707481;
  --accent:#baf566; --accent-2:#b0b6c6; --accent-bright:#e7e8ee;
  --dark-accent:#23252e; --sidebar:242px; --player:0px; --radius:22px;
  color-scheme:dark;
}
body {
  background:radial-gradient(ellipse 43% 32% at 74% -8%,rgba(81,155,87,.115),transparent 90%),
             radial-gradient(ellipse 30% 45% at 0% 50%,rgba(41,96,74,.09),transparent 80%),var(--bg);
  font-size:13px;
}
input,select,textarea {background:#17191ff5;border-color:#27292f;color:var(--text)}
input::placeholder {color:#82848a}
input:focus,select:focus,textarea:focus {border-color:#adafb5;box-shadow:0 0 0 3px #cdcfd51c}
::selection {background:#cfd1d7;color:#0f1117}
::-webkit-scrollbar-thumb {background:#2f3137}
.sidebar {bottom:0;padding-top:30px;background:linear-gradient(160deg,#12141aee,#0e1016f5);border-left:1px solid #ffffff0b}
.logo {margin-bottom:47px}
.logo-mark {background:linear-gradient(140deg,#bdfb72,#67dca1);box-shadow:0 10px 26px #9df77b26;color:#112316;border-radius:14px}
.logo-type strong span,.footer-brand span {color:var(--accent)}
.logo-type small,.sidebar-group-label>span,.intro-date {color:#7d7f85}
.sidebar-group-label {color:#d1e1d4}
.nav-link {color:#989aa0;transition:background .18s,color .18s,transform .18s}
.nav-link:hover {background:#cfd1d70e;color:#e6e8ee;transform:translateX(-2px)}
.nav-link.active {background:linear-gradient(95deg,#cfd1d716,#b2b4ba0a);color:#dfe1e7;box-shadow:inset -2px 0 #cfd1d7;border:1px solid #cfd1d718}
.nav-new {background:#c7c9cf1c;color:#d3d5db}
.upgrade-tile {background:radial-gradient(circle at 0 0,#b5b7bd22,transparent 67%),linear-gradient(132deg,#202228,#16181e);border:1px solid #85878d49;border-radius:19px}
.upgrade-bling {background:linear-gradient(140deg,#d9dbe1,#b7b9bf);color:#1f2127;border-radius:12px}
.upgrade-caption,.upgrade-tile a {color:#d9dbe1}
.upgrade-tile p {color:#acaeb4}
.side-status-dot {background:#cfd1d7;box-shadow:0 0 12px #cfd1d7}
.main-column {padding-bottom:24px}
.topbar {background:linear-gradient(90deg,#111319e8,#0c0e14e9);border-bottom:1px solid #ffffff0a;min-height:84px}
.topbar-eyebrow {color:#cbcdd3}
.topbar-welcome {color:#b6b8be}
.topbar-welcome i {color:#bbbdc3}
.header-search {background:#ffffff08;border:1px solid #a5a7ad22;border-radius:14px;transition:border-color .2s,background .2s}
.header-search:focus-within {background:#16181e;border-color:#b4b6bc83}
.header-search>i {color:#a7a9af}
.header-search button {background:#cfd1d718;color:#d4d6dc}
.login-top {border:1px solid #b3b5bb3b;background:#cfd1d712;color:#dddfe5;border-radius:13px}
.login-top:hover {background:#cfd1d726}
.premium-top,.subscription-chip {color:#cfd1d7}
.profile-link {background:#cbcdd324;color:#d5d7dd;border:1px solid #cbcdd361}
.main-content {padding-top:31px}
.site-footer {border-color:#27292f;color:#87898f}.site-footer i {color:#cfd1d7}
.eyebrow,.section-overline {color:#cbcdd3}
.eyebrow i {color:#c6c8ce}
.home-intro p {font-size:15px}
.hero {
  min-height:426px;border-radius:28px;padding:48px 55px;
  border:1px solid #9fa1a73a;
  background:radial-gradient(ellipse at 7% 40%,#66686e3d 0%,transparent 43%),
             radial-gradient(ellipse at 76% 10%,#babcc217 0%,transparent 53%),
             linear-gradient(119deg,#212329 0%,#191b21 46%,#12141a 100%);
  box-shadow:0 18px 60px #0000002d, inset 0 1px #c9cbd11b;
}
.hero:before {opacity:.2}
.hero-overline {color:#d6d8de}.hero-overline-line {background:#d2d4da}
.hero h1 {font-size:clamp(40px,4.5vw,65px);letter-spacing:-2px}
.hero h1 em {background:linear-gradient(110deg,#dadce2 8%,#b7b9bf 93%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-copy>p {color:#b9bbc1}
.btn {border-radius:13px;transition:background .18s,border-color .18s,transform .18s}
.btn-primary,.plan-popular {background:linear-gradient(110deg,#c1fa79,#8ce6a1);color:#142a18;border-color:#baf56655;box-shadow:0 10px 27px #92db7340}
.btn-primary:hover {background:linear-gradient(110deg,#d9ff9c,#b0f2b6)}
.btn-ghost,.btn-outline {background:#ffffff08;color:#e5f5e7;border-color:#adafb542;backdrop-filter:blur(8px)}
.btn-ghost:hover,.btn-outline:hover {border-color:#c2c4caa6;background:#ffffff10}
.hero-signature {color:#93959b}.signature-lines i {background:#ced0d6}
.hero-halo {background:#c4c6cc30;filter:blur(48px)}
.hero-rings i {border-color:#d3d5db40}.hero-rings i:nth-child(2) {border-color:#bbbdc342}.hero-rings i:nth-child(3) {border-color:#ccced450}
.vinyl-record {background:repeating-radial-gradient(circle,#0f1117 0 2px,#2c2e34 3px 4px,#0f1117 5px 7px),conic-gradient(#12141a,#6a6c72,#111319,#7f8187,#111319);box-shadow:0 26px 60px #0b0d136e,0 0 0 3px #b5b7bd43}
.vinyl-label {background:radial-gradient(circle at 70% 15%,#e2e4ea,#b7b9bf 85%);border-color:#8b8d93;color:#1e2026}
.hero-rotated-card {background:#dadce2;color:#1f2127;box-shadow:0 15px 45px #0008}
.hero-visual-sticker {border-color:#c9cbd15c;background:#212329d9;backdrop-filter:blur(10px)}
.hero-wave b {background:#d3d5db}
.quick-stats {border:1px solid #ffffff0e;background:linear-gradient(110deg,#15171daf,#12141ab8);border-radius:20px;backdrop-filter:blur(8px)}
.quick-stats>div>i {color:#d4d6dc}
.section-head h2 .heading-star {color:#bfc1c7}
.all-link {color:#caccd2}
.track-card:hover {border-color:#b3b5bb55}
.genre-strip {background:radial-gradient(circle at 0 0,#a7a9af1b,transparent 40%),linear-gradient(130deg,#1c1e24,#16181e);border:1px solid #86888e3c;border-radius:25px}
.genre-strip-title h2 span {color:#cfd1d7}
.genre-chips a {background:#ffffff08;border-color:#a4a6ac40;color:#d3e5d6;backdrop-filter:blur(9px)}
.genre-chips a:hover {background:#cfd1d71b;border-color:#c4c6cc}
.songs-table-wrap {border-radius:22px;border-color:#292b31;background:#12141ad6}
.songs-table tr:hover {background:#cfd1d70a}
.membership-banner {background:radial-gradient(circle at 5% 30%,#c7c9cf2e,transparent 48%),linear-gradient(120deg,#24262c,#15171d);border-color:#9c9ea46b;border-radius:27px}
.banner-label {color:#dee0e6}
.banner-art {color:#cbcdd3}
.cover-tone-1 {background:linear-gradient(145deg,#303238,#13151b)}
.cover-tone-2 {background:linear-gradient(145deg,#73757b,#25272d)}
.cover-tone-3 {background:linear-gradient(145deg,#42666b,#1b1d23)}
.cover-tone-4 {background:linear-gradient(145deg,#42444a,#1b1d23)}
.cover-tone-5 {background:linear-gradient(145deg,#44464c,#1c2a31)}
.cover-tone-6 {background:linear-gradient(145deg,#8f9197,#25272d)}
.cover-typography b {color:#dddfe5}
.cover-play,.play-mini,.music-card-play {background:#baf566!important;color:#18311c!important;border-color:#baf566!important;box-shadow:0 5px 22px #97e6785c!important}
.page-heading h1 span {color:#cfd1d7}
.filter-bar {background:#15171dc2;border:1px solid #35373d75;border-radius:20px;backdrop-filter:blur(10px)}
.detail-hero {background:radial-gradient(ellipse at 4% 22%,#7e808639,transparent 55%),#181a20c9;border:1px solid #77797f60;border-radius:26px}
.detail-tags span {background:#cfd1d70d;color:#d1d3d9;border-color:#afb1b730}
.artist-name {color:#b6b8be}.artist-name a:hover {color:#cfd1d7}
.round-action {background:#cfd1d712;border-color:#a2a4aa53;color:#cbcdd3}
.round-action.is-liked {color:#eea0b2}
.account-summary,.playlist-tile,.plan-card,.auth-layout,.centered-auth>.auth-card {background:#17191ff2;border-color:#67696f45;border-radius:24px}
.account-avatar {background:#cfd1d7;color:#1f2127}
.plan-card.popular {background:radial-gradient(circle at 0 0,#a8aab029,transparent 60%),#1a1c22;border-color:#ced0d6b1;box-shadow:0 18px 62px #888a9014}
.plan-icon {color:#cfd1d7}.plan-length {border-color:#414349}
.plan-card li {color:#becfbf}
.plan-card li:before {color:#cfd1d7}
/* Floating music island. Hidden until the audio actually begins playing. */
.player {
  --island-bottom:22px;
  position:fixed;z-index:100;
  inset:auto auto var(--island-bottom) 50%;width:min(960px,calc(100vw - 40px));height:auto;min-height:94px;
  border:1px solid #babcc249;border-radius:24px;
  padding:14px 18px;
  display:grid;grid-template-columns:minmax(180px,1fr) minmax(230px,1.25fr) minmax(130px,.75fr);
  gap:18px;align-items:center;
  background:linear-gradient(126deg,rgba(35,55,41,.94),rgba(18,34,26,.96) 60%,rgba(31,52,36,.95));
  box-shadow:0 24px 65px #0009,0 0 45px #8c8e9415,inset 0 1px #e4e6ec20;
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translate(-50%,calc(100% + 65px)) scale(.97);
  transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .32s,visibility .32s;
}
.player.is-visible {opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.player:before {content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(120deg,#e1e3e913,transparent 38%,#c5c7cd0c)}
.player-art {height:59px;width:59px;flex-basis:59px;border-radius:15px;background:radial-gradient(circle at top left,#b4b6bc,#25272d);color:#e1e3e9}
.player-info strong {color:#f3fff4;font-size:13px}.player-info small {color:#aeb0b6}
.player-heart {color:#bdbfc5;border-radius:9px;padding:7px}.player-heart:hover {background:#cfd1d713}
.player-buttons button {color:#c3c5cb}
.player-buttons .player-main {width:42px;height:42px;background:linear-gradient(135deg,#cdff8b,#80dca5);color:#1a361e;box-shadow:0 7px 22px #9af27e3b}
.player-center {width:min(100%,450px)}
.player-timeline {margin-top:6px}
.player input[type=range] {accent-color:#cfd1d7}
#player-progress {--progress:0%;appearance:none;-webkit-appearance:none;min-height:4px;outline:0;border:0;border-radius:15px;background:linear-gradient(to right,#d5d7dd var(--progress),#686a70 var(--progress));direction:ltr}
#player-progress::-webkit-slider-thumb {appearance:none;width:11px;height:11px;background:#dfe1e7;border:2px solid #26282e;border-radius:50%;box-shadow:0 0 0 2px #d7d9df3b}
.player-extras {gap:10px;color:#c0c2c8}
.player-extras input {max-width:70px}.player-live {color:#cfd1d7;font-size:17px;margin-left:4px}
.player-close {width:30px;height:30px;display:grid;place-items:center;background:#ffffff0b;border:1px solid #ffffff18;border-radius:9px;color:#c8cad0}
.player-close:hover {background:#e5e7ed1e;color:#fff}
.player.is-playing .player-live {animation:island-live 1.4s ease-in-out infinite alternate}
@keyframes island-live {to {opacity:.4;filter:drop-shadow(0 0 8px #caccd2)}}
body.has-player .main-column {padding-bottom:133px}
/* SPA route loading bar — no disruptive blocking overlay */
.navigation-progress {height:2px;position:fixed;top:0;right:0;z-index:130;width:0;opacity:0;background:linear-gradient(90deg,#b4b6bc,#d6d8de);box-shadow:0 0 15px #ccced4;transition:width .65s ease,opacity .25s}
.navigation-progress.is-loading {opacity:1;width:75%}
/* Artist collection */
.artist-home-section {margin-top:48px}
.artist-home-grid,.artist-directory-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.artist-directory-grid {grid-template-columns:repeat(5,minmax(0,1fr))}
.artist-tile {display:block;min-width:0;padding:11px;border:1px solid #ffffff0f;border-radius:22px;background:linear-gradient(150deg,#1b1d23c9,#12141acc);transition:transform .25s,border-color .25s,background .25s}
.artist-tile:hover {transform:translateY(-5px);border-color:#c2c4ca77;background:#22242adf}
.artist-tile-visual {--artist-image:none;display:grid;place-items:center;position:relative;isolation:isolate;aspect-ratio:1.22;overflow:hidden;border-radius:15px;background:radial-gradient(ellipse at 27% 21%,#bfc1c770,transparent 45%),radial-gradient(ellipse at 90% 90%,#7e808670,transparent 65%),linear-gradient(145deg,#313339,#191b21)}
.artist-tile:nth-child(4n+2) .artist-tile-visual {background:radial-gradient(circle at 20% 25%,#aeb0b661,transparent 58%),linear-gradient(135deg,#2d2f35,#1e2026)}
.artist-tile:nth-child(4n+3) .artist-tile-visual {background:radial-gradient(circle at 20% 25%,#b8bac055,transparent 55%),linear-gradient(145deg,#36383e,#1e2026)}
.artist-tile:nth-child(4n+4) .artist-tile-visual {background:radial-gradient(circle at 20% 25%,#999ba175,transparent 58%),linear-gradient(140deg,#2b2d33,#1d1f25)}
.artist-tile-visual:before,.artist-profile-art:before {content:'';position:absolute;inset:0;background-image:var(--artist-image);background-size:cover;background-position:center;z-index:-1}
.artist-tile-visual:after {content:'';position:absolute;inset:0;background:linear-gradient(0deg,#0e101647,transparent 45%);z-index:-1}
.artist-tile-initial {font-size:clamp(52px,7.1vw,102px);font-weight:900;color:#e5e7edbd;text-shadow:0 18px 45px #0006;line-height:1}
.artist-tile-visual[style] .artist-tile-initial,.artist-profile-art[style] .artist-profile-monogram {opacity:0}
.artist-tile-ring {position:absolute;inset:13px;border:1px solid #ffffff24;border-radius:50%;transform:scale(1.5);pointer-events:none}
.artist-tile-visit {position:absolute;left:12px;bottom:12px;background:#bdff84;color:#193621;width:31px;height:31px;border-radius:10px;display:grid;place-items:center;transform:translateY(7px);opacity:0;transition:transform .2s,opacity .2s}
.artist-tile:hover .artist-tile-visit {opacity:1;transform:translateY(0)}
.artist-tile>strong,.artist-tile>small {display:block;padding:0 5px}
.artist-tile>strong {font-size:13px;margin-top:11px}
.artist-tile>small {font-size:10px;min-height:20px;color:#9b9da3;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.artist-directory-head {display:flex;align-items:center;justify-content:space-between;gap:35px;position:relative;min-height:305px;padding:38px 49px;border:1px solid #8a8c925c;border-radius:27px;overflow:hidden;background:radial-gradient(circle at 0 0,#b3b5bb33,transparent 42%),linear-gradient(115deg,#23252b,#14161c 66%)}
.artist-directory-head>div:first-child {z-index:1;max-width:560px}
.artist-directory-head h1 {font-size:clamp(31px,4vw,56px);line-height:1.5;margin:9px 0}
.artist-directory-head h1 em {font-style:normal;color:#d5d7dd}
.artist-directory-head p {color:#babcc2;font-size:12px;max-width:440px}
.artist-head-tags {display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.artist-head-tags span {padding:7px 12px;border:1px solid #d8dae033;background:#ffffff0a;border-radius:40px;color:#ced0d6;font-size:10px}
.artist-head-tags i {color:#d2d4da;margin-left:5px}
.artist-directory-art {position:relative;min-width:220px;height:225px;display:flex;align-items:center;gap:25px;color:#dee0e6}
.artist-directory-art>i {font-size:145px;filter:drop-shadow(0 16px 22px #0b0d1390);transform:rotate(-14deg);opacity:.75}
.artist-directory-art>span {font:900 24px/1.1 Arial;letter-spacing:1px;color:#cfd1d798}
.artist-search {display:flex;gap:11px;align-items:center;max-width:650px;background:#181a20;border:1px solid #6e70766a;border-radius:15px;padding:8px 12px;margin:6px 0 26px}
.artist-search>i {color:#b1b3b9;margin:0 6px}
.artist-search input {flex:1;min-width:0;background:transparent;border:0;outline:none;box-shadow:none!important}
.artist-search button {background:#baf566;color:#18351c;border:0;border-radius:11px;padding:9px 20px;font-weight:800}
.artist-profile-hero {display:flex;align-items:center;gap:48px;padding:34px;border:1px solid #92949a65;border-radius:27px;background:radial-gradient(ellipse at 0 5%,#a8aab025,transparent 55%),linear-gradient(125deg,#202228,#14161c)}
.artist-profile-art {--artist-image:none;position:relative;isolation:isolate;overflow:hidden;flex:0 0 320px;height:320px;border-radius:22px;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#d1d3d950,transparent 55%),linear-gradient(145deg,#3b3d43,#202228)}
.artist-profile-monogram {font-size:174px;font-weight:900;color:#dddfe59c;text-shadow:0 14px 40px #0007}
.artist-profile-pulse {position:absolute;bottom:20px;left:20px;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#baf566;color:#204126;box-shadow:0 10px 35px #0007}
.artist-profile-copy {min-width:0;flex:1}
.artist-profile-copy h1 {font-size:clamp(35px,4vw,55px);line-height:1.4;margin:12px 0 4px}
.artist-profile-subtitle {font-size:14px;line-height:2.1;color:#b8bac0;max-width:580px}
.artist-profile-metrics {display:flex;flex-wrap:wrap;gap:15px;margin:24px 0}
.artist-profile-metrics>span {min-width:98px;display:flex;flex-direction:column;padding:10px 18px;border:1px solid #d4d6dc27;border-radius:14px;background:#ffffff08}
.artist-profile-metrics b {font-size:21px;color:#e0e2e8}.artist-profile-metrics small {font-size:10px;color:#a7a9af}
.artist-profile-actions {display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.artist-social-link {width:44px;height:44px;display:grid;place-items:center;background:#ffffff0b;border:1px solid #a2a4aa60;border-radius:13px;font-size:17px}
.artist-social-link:hover {color:#cfd1d7}
.artist-info-island {display:grid;grid-template-columns:minmax(0,2fr) minmax(190px,.8fr);gap:36px;margin-top:22px;padding:30px 36px;background:#181a20d9;border:1px solid #ffffff12;border-radius:22px}
.artist-info-main h2 {font-size:23px;margin:5px 0 12px}.artist-info-main p {white-space:normal;font-size:12px;color:#b5b7bd;line-height:2.6}
.artist-info-facts {padding:17px 20px;border-radius:17px;background:#ffffff06;border:1px solid #ffffff10}
.artist-info-label {color:#d9dbe1;font-size:12px;font-weight:800}
.artist-info-facts>div {display:flex;justify-content:space-between;gap:12px;margin-top:15px;border-top:1px solid #ffffff12;padding-top:12px;font-size:11px}
.artist-info-facts>div>span {color:#97999f}.artist-info-facts strong {text-align:left}
.album-list {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.album-tile {padding:12px;display:flex;align-items:center;gap:13px;background:#181a20f3;border:1px solid #ffffff17;border-radius:15px}
.album-cover {background:linear-gradient(145deg,#37393f,#25272d);height:55px;width:55px;flex:0 0 55px;background-size:cover;background-position:center;border-radius:10px;display:grid;place-items:center;color:#c9cbd1;font-size:23px}
.album-tile strong,.album-tile small {display:block}.album-tile strong {font-size:12px}.album-tile small {font-size:10px;color:#a3a5ab}
/* SweetAlert2, including authentication and confirmation dialogs */
.swal2-container.lm-swal-container {background:#0b0d13d1!important;backdrop-filter:blur(8px)}
.lm-swal-popup {background:radial-gradient(circle at 0 0,#9d9fa533,transparent 47%),#181a20!important;border-color:#94969c5c!important;border-radius:24px!important}
.lm-swal-title {color:#f2ffef!important}.lm-swal-body {color:#b9bbc1!important}
.lm-swal-confirm {background:linear-gradient(110deg,#cbfc8b,#85dda1)!important;color:#1e361d!important}
.lm-swal-cancel {background:#292b31!important;color:#e2f3df!important}
.lm-swal-close {color:#b3b5bb!important}
.lm-swal-toast {background:#22242a!important;border-color:#8a8c92!important}
.auth-modal-symbol {background:linear-gradient(140deg,#d2d4da,#afb1b7);border-color:#d7d9df;color:#202228}
.auth-modal-kicker,.auth-modal-content h2 span {color:#cfd1d7}
.auth-modal-desc,.auth-modal-switch {color:#b0b2b8}
.form-field>span {color:#e4f3e6}
.field-control {background:#24262cb8;border-color:#6e707680}
.field-control:focus-within {border-color:#d1d3d9;box-shadow:0 0 0 3px #cfd1d71b}
.field-control>i {color:#babcc2}.field-control input {color:#fff}
.auth-modal-switch button {color:#d5d7dd}
.auth-modal-note {border-color:#3d3f45;color:#8f9197}
.auth-dev-code {background:#292b31;color:#e0e2e8}
/* Tablet / phone refinements */
@media(max-width:1300px) {
 .artist-directory-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
 .artist-profile-art {flex-basis:280px;height:280px}
}
@media(max-width:1040px) {
 .sidebar {right:-290px}
 .mobile-toggle {color:#e1e3e9;background:#22242a;border-color:#75777d72}
 .artist-directory-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:760px) {
 :root {--player:0px}
 .topbar {background:#0f1117f2}
 .hero {border-radius:24px;min-height:420px;padding:31px 25px 24px}
 .hero-visual {opacity:.36}
 .main-column {padding-bottom:80px}
 .main-content {padding-bottom:45px}
 .mobile-bottom-nav {background:#16181ef5;border-top:1px solid #84868c42;backdrop-filter:blur(15px)}
 .mobile-bottom-nav a {color:#9c9ea4}.mobile-bottom-nav a.active {color:#d6d8de}
 .player {
  --island-bottom:calc(68px + env(safe-area-inset-bottom));
  width:calc(100vw - 24px);min-height:72px;bottom:var(--island-bottom);
  padding:10px 12px 14px;border-radius:19px;
  grid-template-columns:minmax(0,1fr) auto auto;gap:11px;
  background:linear-gradient(120deg,#292b31f5,#181a20f7);
  backdrop-filter:blur(14px);
 }
 .player-art {width:46px;height:46px;flex-basis:46px;border-radius:12px}
 .player-song {gap:10px}.player-info strong {font-size:11px}
 .player-heart {display:none}
 .player-center {width:auto}
 .player-buttons {gap:0}
 .player-buttons .player-main {width:37px;height:37px}
 .player-extras {display:flex!important;gap:0}
 .player-extras>i,.player-extras>input,.player-live {display:none!important}
 .player-close {width:29px;height:29px;border-radius:9px}
 .player-timeline {display:block!important;margin:0;position:absolute;left:12px;right:12px;bottom:5px}
 .player-timeline span {display:none}
 #player-progress {display:block!important;width:100%;height:3px}
 #player-progress::-webkit-slider-thumb {width:7px;height:7px}
 body.has-player .main-column {padding-bottom:159px}
 .artist-home-grid,.artist-directory-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .artist-tile {border-radius:18px;padding:8px}.artist-tile-visual {border-radius:12px;aspect-ratio:1.13}
 .artist-tile-initial {font-size:72px}.artist-tile>strong {font-size:12px}
 .artist-directory-head {padding:29px 23px;min-height:290px}
 .artist-directory-head>div:first-child {max-width:100%}
 .artist-directory-head p {max-width:280px}
 .artist-directory-art {position:absolute;left:-45px;bottom:-28px;min-width:0;opacity:.25}
 .artist-directory-art>i {font-size:165px}.artist-directory-art>span {display:none}
 .artist-profile-hero {display:block;padding:18px}
 .artist-profile-art {width:100%;height:auto;aspect-ratio:1.3;margin-bottom:23px}
 .artist-profile-monogram {font-size:130px}
 .artist-profile-copy {padding:0 4px 9px}
 .artist-profile-copy h1 {font-size:32px}
 .artist-profile-subtitle {font-size:12px}
 .artist-profile-metrics {gap:8px;margin:17px 0}
 .artist-profile-metrics>span {min-width:79px;padding:8px 12px}
 .artist-info-island {grid-template-columns:1fr;padding:20px;gap:15px}
 .album-list {grid-template-columns:1fr 1fr}
 .artist-search button {padding:9px 11px}
}
@media(max-width:390px) {
 .artist-home-grid,.artist-directory-grid {gap:9px}
 .artist-tile>small {font-size:9px}
 .player {gap:6px}.player-info strong {max-width:140px}
 .album-list {grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce) {
 .player,.navigation-progress,.artist-tile {transition:none!important}
 .player.is-playing .player-live {animation:none}
 .vinyl-record {animation:none}
}

.track-subtitle {display:inline-block;color:#9c9ea4}.track-subtitle:hover,.track-inline small a:hover {color:#d4d6dc}

.section-head h2 span,.link-accent,.genre-strip-title h2 span {color:#cfd1d7}
.cover-label {background:#22242adc!important;border-color:#cbcdd361!important;color:#e1e3e9!important}
.cover-label.subtle {background:#202228ed!important;color:#bdbfc5!important}


/* V4 visual direction: charcoal architecture, clear content hierarchy.
   NOTE: intentionally NO green tint in glass surfaces, cards or backdrops. */
:root { --bg:#0b0d12; --surface:#14161c; --surface-2:#1c1e25; --surface-3:#252832;
  --line:#2e303a; --text:#f4f5f8; --muted:#a0a3ae; --subtle:#737784;
  --accent:#baf566; --accent-2:#b1b4c0; --accent-bright:#eff0f5;
  --dark-accent:#252832;
}
body { background:radial-gradient(ellipse 44% 32% at 79% -8%,rgba(119,126,155,.085),transparent 84%),
       radial-gradient(ellipse 38% 55% at 0 63%,rgba(86,92,113,.05),transparent 86%),#0b0d12;
       color:var(--text); }
.sidebar { background:linear-gradient(169deg,rgba(20,22,28,.98),rgba(12,14,19,.99));
  border-left:1px solid #ffffff10; }
.topbar { background:rgba(14,16,21,.9);border-bottom:1px solid #ffffff11;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px) }
.main-content { color:#f3f4f7 }
.logo-mark { background:linear-gradient(135deg,#c7fa80,#91de80);color:#14200e;
  box-shadow:0 8px 22px rgba(0,0,0,.30) }
.logo-type strong span,.footer-brand span { color:#e5e7ec }
.topbar-eyebrow,.eyebrow,.section-overline,.sidebar-group-label>span,.intro-date {color:#8d929f}
.topbar-welcome,.topbar-welcome i {color:#a6a8b2}
.nav-link {color:#a4a7b1}
.nav-link:hover {background:rgba(255,255,255,.055);color:#f4f5f8}
.nav-link.active {background:linear-gradient(90deg,rgba(255,255,255,.095),rgba(255,255,255,.025));
  box-shadow:inset -2px 0 #bbf477;color:#f7f7fa;border:1px solid #ffffff11}
.nav-link.active i {color:#d8f8ad}
.nav-new { background:#282b34;color:#c9ccd6 }
.upgrade-tile {background:linear-gradient(143deg,#24262f,#181a21);border:1px solid #ffffff15;
  box-shadow:inset 0 1px rgba(255,255,255,.04)}
.upgrade-bling {background:linear-gradient(140deg,#414650,#30343d);color:#e8eaed;box-shadow:none}
.upgrade-caption,.upgrade-tile a {color:#d1d4dc}
.side-status-dot {background:#aaaebc;box-shadow:none}
.header-search {background:rgba(255,255,255,.045);border:1px solid #ffffff16}
.header-search:focus-within {background:rgba(255,255,255,.075);border-color:#858994}
.header-search button {background:#2a2d36;color:#dfe1e7}
.login-top,.profile-link {background:rgba(255,255,255,.052);border:1px solid #ffffff20;color:#f4f4f6}
.login-top:hover,.profile-link:hover {background:rgba(255,255,255,.10)}
.premium-top,.subscription-chip {color:#c5c8d1}
.site-footer,.site-footer i {color:#8e919c}
/* Editorial hero: no lime gradients in artwork or text. */
.hero { background:radial-gradient(ellipse at 9% 38%,rgba(113,117,143,.17),transparent 45%),
    radial-gradient(ellipse at 80% 9%,rgba(255,255,255,.04),transparent 58%),
    linear-gradient(118deg,#292b35 0%,#1c1f28 47%,#14161c 100%);
  border:1px solid #ffffff20;box-shadow:0 19px 65px #00000037,inset 0 1px #ffffff0d }
.hero-overline,.hero-copy>p {color:#bdc0cc}
.hero-overline-line {background:#c1c5d1}
.hero h1 em {background:linear-gradient(112deg,#fafafc,#b9becb);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent}
.hero-signature {color:#969baa}.signature-lines i {background:#b3b6bf}
.hero-halo {background:rgba(128,130,153,.12)}
.hero-rings i {border-color:#ffffff25!important}
.vinyl-record {background:repeating-radial-gradient(circle,#11131a 0 2px,#363943 3px 4px,#14161d 5px 7px),
  conic-gradient(#13151b,#5b5e69,#111219,#6d707b,#11131a);
  box-shadow:0 24px 58px #0008,0 0 0 3px #ffffff18}
.vinyl-label {background:radial-gradient(circle at 70% 15%,#f0f1f3,#afb4c0 84%);
  border-color:#676b75;color:#22252d}
.hero-rotated-card {background:linear-gradient(145deg,#d6d8dd,#9fa5b1);color:#272b33}
.hero-visual-sticker {background:rgba(35,38,48,.77);border-color:#ffffff30;color:#f0f1f4}
.hero-wave b {background:#bcc0cc}
/* Secondary surfaces: micro glass highlight, neutral gray film, no neon. */
.quick-stats,.genre-strip,.membership-banner,.filter-bar,.detail-hero,.account-summary,
.playlist-tile,.plan-card,.auth-layout,.centered-auth>.auth-card,.artist-info-island {
  background:linear-gradient(130deg,rgba(39,42,51,.75),rgba(22,24,31,.83));
  border-color:rgba(255,255,255,.105);box-shadow:inset 0 1px rgba(255,255,255,.035);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)
}
.genre-strip,.membership-banner {background:linear-gradient(115deg,#272a34,#181a21 73%)}
.songs-table-wrap {background:rgba(24,26,33,.8);border-color:#ffffff17}
.songs-table tr:hover {background:#ffffff09}
.quick-stats>div>i,.section-head h2 .heading-star,.section-head h2 span,
.all-link,.all-link i,.genre-strip-title h2 span,.banner-label,.banner-art,
.page-heading h1 span,.plan-icon,.plan-card li:before,.track-subtitle:hover,
.track-inline small a:hover,.track-title:hover,.link-accent,.auth-modal-kicker,
.auth-modal-content h2 span,.auth-bottom a,.playlist-tile b {color:#c9ccd6}
.genre-chips a {background:rgba(255,255,255,.06);color:#d5d6dc;border-color:#ffffff16}
.genre-chips a:hover {background:rgba(255,255,255,.11);border-color:#ffffff35}
.all-link:hover {background:#ffffff0d}
.cover-tone-1 {background:linear-gradient(140deg,#464b59,#1b1d28)}
.cover-tone-2 {background:linear-gradient(140deg,#66626b,#292833)}
.cover-tone-3 {background:linear-gradient(140deg,#3e505b,#1a2530)}
.cover-tone-4 {background:linear-gradient(140deg,#55515b,#25232f)}
.cover-tone-5 {background:linear-gradient(140deg,#545d69,#252933)}
.cover-tone-6 {background:linear-gradient(140deg,#786d68,#2d282a)}
.cover-typography b {color:#edf0f4}
.cover-label,.cover-label.subtle {background:#252832ed!important;color:#e5e7ec!important;border-color:#ffffff2b!important}
.track-card:hover {border-color:#ffffff39}
/* Artist fallbacks deliberately vary across neutral slate/graphite shades. */
.artist-tile {background:linear-gradient(150deg,rgba(38,41,50,.88),rgba(21,23,29,.94));border-color:#ffffff13}
.artist-tile:hover {background:#282b35;border-color:#ffffff32}
.artist-tile-visual {background:radial-gradient(circle at 27% 21%,#7c808f50,transparent 50%),linear-gradient(145deg,#4b4f60,#232632)}
.artist-tile:nth-child(4n+2) .artist-tile-visual {background:radial-gradient(circle at 27% 21%,#83828e50,transparent 50%),linear-gradient(145deg,#484753,#262932)}
.artist-tile:nth-child(4n+3) .artist-tile-visual {background:radial-gradient(circle at 27% 21%,#87919a55,transparent 50%),linear-gradient(145deg,#404c5a,#222831)}
.artist-tile:nth-child(4n+4) .artist-tile-visual {background:radial-gradient(circle at 27% 21%,#857e8555,transparent 50%),linear-gradient(145deg,#4e454d,#25242c)}
.artist-tile-visual:after {background:linear-gradient(0deg,#0b0d1265,transparent 50%)}
.artist-tile-initial {color:#e0e2e8bd}
.artist-directory-head,.artist-profile-hero {background:radial-gradient(ellipse at 0 5%,#ffffff09,transparent 56%),linear-gradient(125deg,#2a2d37,#171920);border-color:#ffffff20}
.artist-directory-head h1 em {color:#eaebf0}
.artist-directory-head p,.artist-profile-subtitle {color:#b0b3bf}
.artist-head-tags span,.artist-profile-metrics>span {background:#ffffff08;border-color:#ffffff19;color:#d1d4de}
.artist-head-tags i,.artist-directory-art,.artist-directory-art>span {color:#b5bac5}
.artist-search {background:#22242c;border-color:#ffffff26}
.artist-search>i {color:#aeb3bf}
.artist-profile-art {background:radial-gradient(circle at 30% 20%,#ffffff16,transparent 55%),linear-gradient(145deg,#555968,#262b35)}
.artist-profile-monogram {color:#d9dce8b7}
.artist-profile-metrics b {color:#f5f5f8}
.artist-info-label {color:#d2d4dd}
.artist-social-link {border-color:#ffffff26}
.artist-social-link:hover {background:#ffffff13;color:#f8f8fb}
.album-tile {background:#22242dd9;border-color:#ffffff15}
.album-cover {background:linear-gradient(140deg,#555c6b,#262a33);color:#e0e3e9}
.plan-card.popular {background:linear-gradient(140deg,#2c3039,#1c1f27);border-color:#ffffff46;box-shadow:0 20px 58px #0002}
.plan-popular {background:#d7d9df;color:#252832}
.detail-tags span {background:#ffffff09;color:#d8dbe3;border-color:#ffffff20}
.round-action {background:#ffffff09;color:#d9dce3;border-color:#ffffff24}
.round-action:hover {background:#ffffff16;border-color:#ffffff40}
.btn-ghost,.btn-outline {background:rgba(255,255,255,.06);color:#ecedf3;border-color:#ffffff29}
.btn-ghost:hover,.btn-outline:hover {background:rgba(255,255,255,.11);border-color:#ffffff53}
/* Green is allowed only for the primary action and playback control surfaces. */
.btn-primary,.cover-play,.play-mini,.music-card-play,.artist-search button,
.artist-profile-pulse,.artist-tile-visit,.lm-swal-confirm {background:linear-gradient(125deg,#c4f877,#9ae58d)!important;color:#182014!important;
 border-color:#cbf88c!important;box-shadow:0 9px 26px rgba(0,0,0,.22)!important}
.btn-primary:hover,.artist-search button:hover {background:linear-gradient(125deg,#d3ffa0,#b3ec9c)!important}
/* Persistent player: floating translucent charcoal slab, not green glass. */
.player {background:linear-gradient(124deg,rgba(44,46,56,.94),rgba(27,29,36,.95) 59%,rgba(38,40,49,.94));
 border-color:#ffffff32;box-shadow:0 26px 74px #000a,inset 0 1px rgba(255,255,255,.10);
 backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
.player:before {background:linear-gradient(120deg,#ffffff08,transparent 40%,#ffffff03)}
.player-art {background:linear-gradient(145deg,#5b6070,#292d37);color:#e3e5ed}
.player-info strong {color:#f2f3f7}.player-info small,.player-heart,.player-buttons button,.player-extras {color:#adb1bf}
.player-heart:hover,.player-close:hover {background:#ffffff12;color:#f9f9fa}
.player-buttons .player-main {background:linear-gradient(135deg,#c7f880,#9de28a);color:#172112;
 box-shadow:0 7px 20px #0000004d}
.player input[type=range] {accent-color:#c1f482}
#player-progress {background:linear-gradient(to right,#bbf277 var(--progress),#555965 var(--progress))}
#player-progress::-webkit-slider-thumb {background:#c9f69c;border-color:#262832;box-shadow:0 0 0 2px #ffffff2c}
.player-live {color:#c0c5d0}
@keyframes island-live {to {opacity:.5;filter:none}}
.navigation-progress {background:linear-gradient(90deg,#959aa8,#dce1e8);box-shadow:none}
/* Dialogs: satin graphite glass, not saturated surfaces. */
.swal2-container.lm-swal-container {background:rgba(7,8,12,.72)!important}
.lm-swal-popup {background:linear-gradient(140deg,rgba(40,42,51,.98),rgba(23,24,31,.99))!important;
 border:1px solid #ffffff2e!important;box-shadow:0 30px 90px #000a!important}
.lm-swal-title {color:#f4f5f8!important}.lm-swal-body {color:#b6b9c4!important}
.lm-swal-cancel {background:#343741!important;color:#f0f0f4!important}
.lm-swal-close {color:#adb0bd!important}
.lm-swal-toast {background:#292c34!important;border-color:#ffffff2c!important}
.auth-modal-symbol {background:linear-gradient(145deg,#565b68,#333743);border-color:#ffffff26;color:#f0f2f6}
.auth-modal-desc,.auth-modal-switch {color:#afb3c0}
.form-field>span {color:#eff0f3}
.field-control {background:#2a2d35b8;border-color:#ffffff25}
.field-control:focus-within {border-color:#a0a5b4;box-shadow:0 0 0 3px #ffffff0b}
.field-control>i {color:#bfc2cc}
.auth-modal-switch button {color:#e4e6ed}
.auth-modal-note {border-color:#ffffff1c;color:#9da2ae}
.auth-dev-code {background:#343741;color:#f1f1f5}
/* Phones use the same neutral film, preserving the island animation & sizes. */
@media(max-width:1040px){.mobile-toggle {background:#292b35;color:#f4f5f8;border-color:#ffffff27}}
@media(max-width:760px){
 .topbar {background:rgba(14,16,21,.95)}
 .mobile-bottom-nav {background:rgba(25,27,34,.94);border-color:#ffffff20}
 .mobile-bottom-nav a {color:#a1a4b0}
 .mobile-bottom-nav a.active {color:#dbf8b7}
 .player {background:linear-gradient(120deg,rgba(47,49,58,.97),rgba(26,28,36,.97));border-color:#ffffff2c}
}
/* Secondary editorial markers are neutral; the color accent belongs to actions. */
.overline-bar {border-top-color:#797e8b}
.nav-link.active i {color:#ebedf2}
.mobile-bottom-nav a.active {color:#f5f5f8}
.genre-chips a i:first-child {color:#b9bdc8}
.row-play {background:#2c2f38;border-color:#555966;color:#eff0f4}
.row-play:hover {background:#3b3e49;color:#fff}