:root{
  --bg:#0c0d0f;
  --panel:#111214;
  --text:#e5e5e5;
  --text-dim:#9aa3b2;
  --accent:#c7d2fe;
  --accent-2:#e0e7ff;
  --border:#2a2a2a;
  --line:#1e1e1e;
  --topbar-offset:5.8rem;
}

/* Batch B consistency fixes */
:root{
  --text-dim:#b4bdca;
}
.week-card .item-meta .sub,
.week-card .item-meta .track-meta{
  display:block !important;
  gap:0 !important;
  margin-top:.28rem !important;
  text-align:left !important;
  line-height:1.32 !important;
}
.vote-btn.is-muted{
  filter:grayscale(1);
  opacity:.45;
}

*{box-sizing:border-box}
html,body{min-height:100%}
html{
  scrollbar-gutter:stable both-edges;
  overflow-y:scroll;
}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  line-height:1.45;
}
body.theme-custom-bg{
  background:var(--bg) !important;
  background-image:none !important;
}
body.theme-custom-bg .topbar-shell{
  background:var(--bg) !important;
  background-image:none !important;
  backdrop-filter:none !important;
}
button,a,input,select,textarea{
  touch-action:manipulation;
}

a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:1100px;margin:0 auto;padding:1.1rem 1.5rem}
.topbar-shell{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:1000;
  background:linear-gradient(180deg, rgba(12,13,15,.96), rgba(12,13,15,.9));
  border-bottom:1px solid var(--line);
  backdrop-filter:saturate(120%) blur(6px);
}
.ecosystem-nav{
  display:flex;
  align-items:center;
  gap:.55rem;
  flex-wrap:wrap;
  justify-content:flex-end;
  grid-column:2;
  grid-row:1;
}
.ecosystem-nav a,
.ecosystem-nav .active{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:.9rem;
  line-height:1;
  padding:.35rem .45rem;
  border-radius:.45rem;
}
.ecosystem-nav a{
  color:var(--text-dim);
}
.ecosystem-nav a:hover{
  color:var(--text);
  background:rgba(255,255,255,.05);
  text-decoration:none;
}
.ecosystem-nav .active{
  color:#ecfff3;
  background:linear-gradient(180deg, rgba(34,197,94,.42), rgba(22,101,52,.52));
  border:1px solid rgba(134,239,172,.78);
  box-shadow: inset 0 0 0 1px rgba(134,239,172,.28), 0 8px 18px rgba(10,32,18,.34);
}
.topbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:.55rem 1rem;
}
.topbar-search-wrap{
  display:flex;
  flex-wrap:nowrap;
  align-items:stretch;
  gap:.55rem;
  margin-left:0;
  flex:0 0 auto;
  grid-column:2;
  grid-row:2;
}
.topbar-search-hint{
  flex:0 1 20rem;
  align-self:center;
  margin:0;
  padding-left:0;
  color:var(--text-dim);
  font-size:.78rem;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.topbar-search{
  display:flex;
  align-items:stretch;
  gap:.55rem;
  flex:1;
  justify-content:flex-end;
  position:relative;
}
.topbar-search input{
  width:min(36rem,100%);
  padding:.5rem .9rem;
  border-radius:.6rem;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
  font-size:16px;
  min-height:34px;
  outline:none;
}
.topbar-search input:focus{border-color:rgba(199,210,254,.65)}
.btn-search-explore{
  min-height:34px;
  padding:.58rem .92rem;
}
.btn-strict-mini{
  min-height:34px;
  padding:.42rem .62rem;
  font-size:.78rem;
  line-height:1;
  opacity:.92;
}
.btn-strict-mini.active{
  border-color:var(--accent);
  color:var(--accent);
  background:rgba(108,209,255,.14);
}
.brand a{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-weight:800;
  font-size:1.35rem;
  color:var(--accent);
}
.brand a:hover{color:var(--accent-2)}
.brand{grid-column:1;grid-row:1}
.nav{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
  flex:1 1 auto;
  min-width:0;
  grid-column:1;
  grid-row:2;
}
.nav-back{opacity:.85}
.nav-back:hover{opacity:1}
.nav a{
  color:var(--text);
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  border-radius:999px;
  padding:.36rem .72rem;
  font-size:.92rem;
}
.nav a:hover{color:var(--accent);border-color:rgba(199,210,254,.4);text-decoration:none}

.wrap{
  padding-bottom:12rem;
  padding-top:calc(var(--topbar-offset) + .95rem);
  overflow-x:clip;
  touch-action:pan-y;
  overscroll-behavior-x:none;
}
.status-banner{
  max-width:1100px;
  margin:.6rem auto 0;
  padding:.6rem 1rem;
  border:1px solid var(--border);
  border-radius:.75rem;
  background:rgba(199,210,254,.08);
  color:var(--text);
  font-size:.88rem;
}
.status-banner.hidden{display:none}
.is-hidden{display:none !important}
.card{
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));
  border:1px solid var(--border);
  border-radius:1rem;
  padding:1rem 1.1rem;
  margin:0 0 .9rem;
}
.accordion-card{
  padding:0;
}
.accordion-card summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.1rem;
  border-bottom:1px solid var(--line);
}
.accordion-card summary::-webkit-details-marker{display:none}
.accordion-title{
  font-weight:800;
  font-size:1rem;
}
.accordion-meta{
  color:var(--text-dim);
  font-size:.85rem;
}
.accordion-card .accordion-body{
  padding:0 1.1rem 1rem;
}
.accordion-card .scroll-row{
  margin-top:.2rem;
}
.preset-card{
  margin-top:.9rem;
}
.h1{font-size:1.12rem;font-weight:600;margin:0 0 .35rem}
.sub{color:var(--text-dim);font-size:.92rem;margin:0 0 .65rem}
.row{display:flex;gap:.55rem;flex-wrap:wrap;align-items:center}
.back-row{justify-content:flex-start;margin-bottom:.35rem}
.btn-back{padding:.4rem .7rem}
.pill{
  display:inline-block;
  padding:.38rem .65rem;
  border:1px solid var(--border);
  border-radius:999px;
  color:var(--text-dim);
  background:rgba(255,255,255,.02);
  font-size:.82rem;
}

.btn{
  padding:.55rem .9rem;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:inherit;
  font-size:.92rem;
  line-height:1.05;
  border-radius:.6rem;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-weight:700;
  cursor:pointer;
}
.btn:hover{background:rgba(255,255,255,.08)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{min-width:78px}
.btn-icon{min-width:52px;padding:.58rem .6rem}
.btn-icon .icon{width:18px;height:18px;display:block}
.btn-scope{
  min-height:32px;
  padding:.32rem .6rem;
  font-size:.82rem;
  border-radius:999px;
}
.btn-scope.active{
  border-color:rgba(199,210,254,.48);
  color:var(--accent);
  background:linear-gradient(180deg,rgba(199,210,254,.12),rgba(199,210,254,.04));
}
.btn-save.active{
  border-color:rgba(199,210,254,.6);
  color:var(--accent);
  background:linear-gradient(180deg,rgba(199,210,254,.18),rgba(199,210,254,.06));
}
.btn-save.is-confirm{
  border-color:rgba(199,210,254,.7);
  color:var(--accent);
  background:linear-gradient(180deg,rgba(199,210,254,.22),rgba(199,210,254,.08));
}
.btn-icon.is-active{
  border-color:rgba(199,210,254,.6);
  color:var(--accent);
  background:linear-gradient(180deg,rgba(199,210,254,.18),rgba(199,210,254,.06));
  box-shadow:inset 0 0 0 1px rgba(199,210,254,.2), 0 8px 18px rgba(12,14,19,.35);
}
.btn-loading{
  opacity:.85;
  pointer-events:none;
}
.topbar-auth{
  margin-left:auto;
  display:flex;
  align-items:center;
}
.btn-auth{
  min-height:32px;
  padding:.32rem .72rem;
  border-radius:999px;
  font-size:.8rem;
  white-space:nowrap;
}
.auth-dialog{
  border:1px solid var(--border);
  border-radius:.78rem;
  background:linear-gradient(180deg, rgba(18,21,28,.98), rgba(11,13,18,.98));
  color:var(--text);
  min-width:min(92vw, 360px);
  padding:.8rem;
}
.auth-dialog::backdrop{
  background:rgba(0,0,0,.45);
}
.auth-form{
  display:flex;
  flex-direction:column;
  gap:.5rem;
}
.auth-form input{
  width:100%;
}
.auth-actions{
  display:flex;
  gap:.35rem;
  flex-wrap:wrap;
}
.btn-save{
  min-width:40px;
  font-weight:800;
  letter-spacing:.02em;
}
.btn-mix{
  border-color:rgba(199,210,254,.28);
}
.btn-mix.is-confirm{
  border-color:rgba(199,210,254,.7);
  color:var(--accent);
  background:linear-gradient(180deg,rgba(199,210,254,.2),rgba(199,210,254,.08));
}
.btn-clear{
  min-height:32px;
  padding:.32rem .6rem;
  font-size:.78rem;
  border-radius:999px;
  opacity:.85;
}
.btn-clear:hover{opacity:1}
.recent-pill{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--border);
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.02);
}
.recent-btn{
  border:0;
  background:transparent;
  color:var(--text);
  padding:.34rem .68rem;
  font-size:.84rem;
  font-weight:600;
  cursor:pointer;
}
.recent-btn:hover{color:var(--accent)}
.recent-x{
  border:0;
  border-left:1px solid var(--border);
  background:transparent;
  color:var(--text-dim);
  min-width:28px;
  padding:.2rem .5rem;
  font-size:.92rem;
  line-height:1;
  cursor:pointer;
}
.recent-x:hover{color:var(--text)}

input[type="text"],
input[type="search"]{
  width:min(560px,100%);
  padding:.67rem .75rem;
  border-radius:.62rem;
  border:1px solid var(--border);
  background:#17181b;
  color:var(--text);
  font-size:16px;
  min-height:38px;
  -webkit-appearance:none;
}
.scroll-row{
  align-items:center;
  gap:.5rem;
}
.scroll-wrap{
  display:flex;
  gap:.4rem;
  overflow-x:auto;
  padding-bottom:.2rem;
  scroll-behavior:smooth;
  scrollbar-width:thin;
}
.scroll-wrap::-webkit-scrollbar{height:6px}
.scroll-wrap::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}
.scroll-arrow{
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  color:var(--text);
  min-width:30px;
  height:30px;
  border-radius:999px;
  cursor:pointer;
}
.scroll-arrow.hidden{opacity:0;pointer-events:none}
.explore-top-btn{
  position:fixed;
  right:1rem;
  bottom:92px;
  z-index:60;
  box-shadow:0 12px 26px rgba(0,0,0,.28);
}
.explore-top-btn.is-hidden{display:none}

.trusted-catalog-controls{
  margin-top: .75rem;
  display:flex;
  justify-content:center;
  align-items:center;
}

.trusted-read-more-btn{
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .02em;
  padding: .72rem 1.25rem;
  border-color: rgba(199,210,254,.55);
  background: linear-gradient(180deg, rgba(199,210,254,.24), rgba(199,210,254,.12));
  box-shadow: 0 8px 20px rgba(0,0,0,.28);
}

.tracklist{margin-top:.7rem}
.saved-tracklist .track{
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:.7rem .6rem;
  margin-top:.55rem;
  background:rgba(255,255,255,.02);
  border-top:1px solid rgba(255,255,255,.08);
}
.saved-tracklist .track:first-child{
  margin-top:0;
  border-top:1px solid rgba(255,255,255,.08);
}
.saved-tracklist .track-indexed + .track-indexed{
  border-top:0;
}
.playlist-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.7rem 0;
  border-top:1px solid var(--border);
}
.playlist-row:first-child{border-top:0}
.playlist-meta{
  display:flex;
  flex-direction:column;
  gap:.15rem;
}
.playlist-count{
  color:var(--text-dim);
  font-size:.85rem;
}
.playlist-tracks{
  margin:.4rem 0 .6rem;
  border-top:1px dashed rgba(255,255,255,.08);
  padding-top:.5rem;
}
.playlist-tracks.is-hidden{display:none}
.playlist-rename{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.6rem 0;
  border-top:1px dashed rgba(255,255,255,.08);
}
.playlist-rename.is-hidden{display:none}
.playlist-rename input{
  flex:1;
  min-width:140px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  border-radius:.6rem;
  color:var(--text);
  padding:.5rem .7rem;
  font-family:inherit;
  font-size:.95rem;
}
.playlist-track{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.5rem 0;
  border-top:1px solid rgba(255,255,255,.06);
}
.playlist-track:first-child{border-top:0}
.playlist-track-title{
  font-weight:700;
}
.playlist-track-meta{
  color:var(--text-dim);
  font-size:.85rem;
}
.item-art{
  width:72px;
  height:72px;
  border-radius:8px;
  border:0;
  object-fit:cover;
  background:#111;
  display:block;
  margin:0;
}
.item-top{
  display:flex;
  gap:.75rem;
  align-items:flex-start;
}
.week-card{
  background:transparent;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.06);
  border-radius:0;
  padding:.25rem .25rem .7rem .25rem;
  margin:0 0 .85rem;
}
.week-card:last-child{
  border-bottom:none;
  padding-bottom:0;
}
.week-card .item-top{cursor:pointer}
.week-card.collapsed .week-body{display:none}
.week-card.expanded .week-body{display:block}
.artist-card .item-top{cursor:pointer}
.artist-card .artist-playall{white-space:nowrap}
.artist-card .artist-tracklist{margin-top:.2rem}
.artists-alpha-nav{
  display:flex;
  gap:.3rem;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  padding:.45rem 0 .15rem;
  margin:.25rem 0 .25rem;
  scrollbar-width:thin;
}
.artists-alpha-btn{
  min-width:2rem;
  height:2rem;
  padding:0 .5rem;
  font-weight:700;
  border-radius:.55rem;
}
.artists-alpha-btn:disabled{
  opacity:.35;
}
.artists-top-actions{
  position:fixed;
  right:1rem;
  bottom:6.8rem;
  z-index:75;
  display:flex;
  justify-content:flex-end;
}
.artists-top-btn{
  min-width:86px;
}
.item-meta{flex:1;min-width:0}
.item-top-actions{
  display:flex;
  flex-direction:column;
  gap:.4rem;
  align-items:flex-end;
  flex:0 0 auto;
  margin-left:auto;
}
.item-top-actions .btn{white-space:nowrap}
.explore-actions{
  align-self:center;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:.24rem;
  flex-wrap:nowrap;
}
.label-wrap{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.btn-label-lite{
  min-width:64px;
  min-height:28px;
  padding:.12rem .5rem;
  font-size:.72rem;
  border-radius:999px;
  border:1px dashed rgba(210,216,229,.38);
  background:rgba(255,255,255,.08);
  color:#d6dde9;
  opacity:.7;
  transition:opacity .18s ease, border-color .18s ease, color .18s ease, background .18s ease;
}
.explore-card:hover .btn-label-lite,
.label-wrap:focus-within .btn-label-lite,
.btn-label-lite.active,
.btn-label-lite.has-labels{
  opacity:1;
}
.btn-label-lite.active,
.btn-label-lite.has-labels{
  border-color:rgba(111,201,160,.5);
  color:#bde6d0;
  background:rgba(37,84,70,.3);
}
.label-popover{
  position:absolute;
  right:0;
  top:calc(100% + .35rem);
  width:min(290px, 78vw);
  border-radius:.85rem;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(25,30,44,.97), rgba(14,18,29,.98));
  box-shadow:0 14px 28px rgba(0,0,0,.38);
  padding:.5rem;
  z-index:45;
}
.label-popover.is-hidden{display:none}
.label-popover-head{
  font-size:.74rem;
  color:var(--text-dim);
  margin-bottom:.38rem;
}
.label-chip-grid{
  display:flex;
  flex-wrap:wrap;
  gap:.3rem;
}
.label-chip{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
  color:var(--text);
  border-radius:999px;
  padding:.14rem .5rem;
  font-size:.72rem;
  line-height:1.1;
}
.label-chip.active{
  border-color:rgba(111,201,160,.55);
  background:rgba(37,84,70,.35);
  color:#d8f3e5;
}
.label-chip-count{
  color:var(--text-dim);
  margin-left:.22rem;
}
.label-popover-foot{
  margin-top:.35rem;
  font-size:.66rem;
  color:var(--text-dim);
}
.more-tracks-note{
  font-weight:700;
  color:var(--text);
}
.more-tracks-note a{
  color:var(--accent-2);
  text-decoration:underline;
}
.more-tracks-note a:hover{
  text-decoration:underline;
}
.item-links{
  display:flex;
  flex-direction:column;
  gap:.4rem;
  align-items:flex-end;
}
.item-links-bottom{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:.4rem;
  align-items:center;
  margin-top:.45rem;
}
.item-links-bottom .btn-link{
  width:100%;
  justify-content:center;
  text-align:center;
}
.item-links-bottom .btn-link:nth-child(1){justify-self:start}
.item-links-bottom .btn-link:nth-child(2){justify-self:center}
.item-links-bottom .btn-link:nth-child(3){justify-self:end}
.btn-link{
  padding:.4rem .65rem;
  min-height:32px;
  font-size:.8rem;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  min-width:112px;
  justify-content:center;
  text-align:center;
}
.item-links-inline{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  justify-content:flex-end;
  margin:.45rem 0 .6rem;
}
.item-art-large{
  width:130px;
  height:130px;
}
.item-top-hero{
  align-items:center;
}
.item-vote-left{
  margin-top:.1rem;
}
.item-hero-meta{
  display:flex;
  flex-direction:column;
  gap:.32rem;
}
.item-links-left{
  justify-content:flex-start;
  margin:.25rem 0 0;
}
.item-hero-actions{
  display:flex;
  flex-direction:column;
  gap:.4rem;
  align-items:flex-end;
  flex:0 0 auto;
  margin-left:auto;
}
.item-hero-actions .btn{white-space:nowrap}
.item-action-btn{
  min-width:34px;
  min-height:34px;
  font-size:.95rem;
  padding:.28rem .4rem;
}
.explore-result{
  grid-template-columns:auto auto minmax(0,1fr);
  align-items:center;
}
.explore-vote{
  flex-direction:row;
  align-items:center;
  gap:4px;
  border-right:0;
  padding-right:6px;
  padding-top:0;
  align-self:center;
}
.explore-art{
  width:48px;
  height:48px;
  border-radius:.55rem;
}
.explore-vote .vote-btn{
  min-height:28px;
  min-width:28px;
  border-radius:9px;
  font-size:.82rem;
}
.explore-vote .vote-score{
  width:28px;
  height:28px;
  flex:0 0 28px;
  border-radius:9px;
  font-size:.8rem;
}
.explore-result .track-info{
  display:flex;
  flex-direction:column;
  gap:.14rem;
}
.explore-inline-actions{
  gap:.35rem;
  margin-top:.2rem;
  flex-wrap:nowrap;
}
.explore-inline-actions .btn{
  min-height:30px;
  padding:.3rem .55rem;
  font-size:.8rem;
}
.explore-inline-actions .item-action-btn{
  min-width:30px;
  min-height:30px;
  padding:.2rem .3rem;
}
.track{
  padding:.2rem .2rem .34rem .2rem;
  border-top:0;
  border-bottom:1px solid rgba(255,255,255,.06);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.45rem;
  align-items:center;
}
.track-indexed{grid-template-columns:auto minmax(0,1fr) auto}
.track-index{
  color:var(--text-dim);
  font-weight:700;
  font-size:.9rem;
  min-width:1.4rem;
  text-align:right;
}
.track-indexed + .track-indexed{
  border-top:0;
}
.track:last-child{
  border-bottom:none;
  padding-bottom:0;
}
.track-info{min-width:0}
.track-title-row{
  display:flex;
  align-items:center;
  gap:.35rem;
  min-width:0;
}
.track-title{display:block;font-weight:600;font-size:1.02rem;line-height:1.18;overflow-wrap:anywhere;max-width:100%}
.track-title-row .track-title,
.track-title-row .history-track-play{
  flex:1 1 auto;
  min-width:0;
}
.track-inline-label{
  flex:0 0 auto;
  margin-left:.04rem;
}
.track-inline-label .btn-label-lite{
  min-height:24px;
  padding:.08rem .42rem;
  font-size:.68rem;
  opacity:.92;
}
.link-title{color:var(--text);text-decoration:none}
.link-title:hover{color:var(--text);text-decoration:underline}
.title-link{color:var(--text);text-decoration:none}
.title-link:hover{color:var(--text);text-decoration:underline}
.track-link{
  border:0;
  background:transparent;
  color:var(--text);
  padding:0;
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.track-link:hover{color:var(--text);text-decoration:underline}
.track-meta{color:var(--text-dim);font-size:.82rem;line-height:1.1}
.track .track-meta{margin-top:0 !important}
.track .row{
  margin:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:nowrap;
  gap:.24rem;
}
.track .btn-track{
  min-width:32px;
  min-height:30px;
  padding:.12rem .3rem;
  font-size:.95rem;
  line-height:1;
}
.artist-track-row{
  grid-template-columns:minmax(0,1fr) 54px !important;
  align-items:center;
}
.artist-track-row .row{
  justify-content:flex-end;
  width:54px;
}
.artist-track-row .btn-track{
  width:40px;
  min-width:40px;
  justify-content:center;
}
.track .btn-mix{
  min-width:30px;
  min-height:30px;
  padding:.12rem .26rem;
}
.history-vote-col{
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  gap:.24rem;
}
.history-vote-col .vote-btn{
  width:34px;
  height:34px;
  min-width:34px;
  min-height:34px;
  padding:0;
  touch-action:manipulation;
}
.history-vote-col .vote-btn .vote-icon{
  width:18px;
  height:18px;
  display:block;
  color:var(--text-dim);
}
.history-vote-col .vote-btn .vote-icon path{
  fill:currentColor !important;
}
.history-vote-col .vote-up.active .vote-icon{
  color:var(--good) !important;
}
.history-vote-col .vote-down.active .vote-icon{
  color:var(--bad) !important;
}
.history-track-play{
  touch-action:manipulation;
}

/* Match news item title + description typography exactly on music cards */
.week-card .h1,
.week-card .h1 .title-link,
.explore-card .h1,
.explore-card .h1 .title-link{
  color:inherit !important;
  font-size:1.12rem !important;
  font-weight:600 !important;
}
.week-card .sub,
.explore-card .sub,
.week-card .track-meta,
.explore-card .track-meta{
  color:var(--text-dim) !important;
  font-size:.92rem !important;
  line-height:1.45 !important;
  margin:0 !important;
  margin-top:.35rem !important;
  display:flex !important;
  gap:.5rem !important;
  flex-wrap:wrap !important;
  align-items:center !important;
}
.archive-grid{
  margin-top:.5rem;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:.75rem;
}
.archive-card{
  display:block;
  text-decoration:none;
  color:inherit;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.02);
  padding:.6rem;
}
.archive-card:hover{
  border-color:rgba(199,210,254,.5);
  background:rgba(199,210,254,.06);
}
.archive-head{
  margin-bottom:.5rem;
}
.archive-title{
  font-weight:700;
  color:var(--accent);
}
.archive-sub{
  margin-top:.2rem;
  color:var(--text-dim);
  font-size:.82rem;
}
.archive-covers{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem;
  min-height:62px;
}
.archive-cover{
  width:58px;
  height:58px;
  border-radius:8px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.12);
  background:#0f1116;
}
.archive-cover-ph{
  width:58px;
  height:58px;
  border-radius:8px;
  border:1px dashed rgba(255,255,255,.2);
  background:rgba(255,255,255,.03);
}
.archive-empty{
  color:var(--text-dim);
  font-size:.8rem;
}
.vote-strip{
  display:grid;
  grid-template-rows:32px 1fr 32px;
  place-items:center;
  gap:6px;
  padding-right:10px;
  border-right:1px solid var(--line);
  align-self:start;
  background:transparent;
}
.explore-card .vote-strip{
  grid-template-rows:28px 1fr 28px;
  gap:4px;
  padding-right:6px;
}
.explore-card .vote-strip .vote-btn,
.explore-card .vote-strip .vote-score{
  width:28px;
  height:28px;
  min-width:28px;
  min-height:28px;
  border-radius:9px;
  font-size:.8rem;
}
.vote-label{
  display:none;
}
.vote-btn{
  width:34px;
  height:34px;
  min-height:34px;
  min-width:34px;
  padding:0;
  border-radius:12px;
  font-size:.9rem;
  display:inline-grid;
  place-items:center;
  color:var(--text-dim);
}
.vote-up.active{
  border-color: rgba(52,211,153,.45);
  color: var(--good);
}
.vote-down.active{
  border-color: rgba(251,113,133,.45);
  color: var(--bad);
}
.vote-score{
  width:34px;
  height:34px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.02);
  display:grid;
  place-items:center;
  flex:0 0 34px;
  font-weight:700;
  font-size:.9rem;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  color:var(--text);
  opacity:.92;
}

.community-view-tabs{
  margin-top:0;
  display:flex;
  align-items:stretch;
  align-self:stretch;
  gap:0;
  max-width:100%;
  border:1px solid var(--border);
  border-radius:14px;
  overflow-x:auto;
  overflow-y:hidden;
  background:linear-gradient(180deg, var(--panel), color-mix(in srgb, var(--panel) 78%, transparent));
  backdrop-filter:blur(10px) saturate(120%);
  -webkit-backdrop-filter:blur(10px) saturate(120%);
  box-shadow:0 8px 18px rgba(0,0,0,.18);
  -webkit-overflow-scrolling:touch;
}
.community-nav-shell{
  position:relative;
  display:block;
  max-width:100%;
}
@media (min-width: 901px){
  .community-nav-shell{
    transition: transform .18s ease, opacity .18s ease;
    will-change: transform, opacity;
  }
  body.music-desktop-community-hidden .community-nav-shell{
    transform: translateY(calc(-100% - .5rem));
    opacity: .02;
    pointer-events: none;
  }
}
.community-nav-arrow{
  display:none;
  position:absolute;
  top:-.72rem;
  z-index:3;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border);
  background:linear-gradient(180deg, color-mix(in srgb, var(--panel) 82%, rgba(255,255,255,.06)), color-mix(in srgb, var(--panel) 94%, rgba(255,255,255,.03)));
  color:var(--text);
  border-radius:999px;
  width:28px;
  min-width:28px;
  height:28px;
  font-size:18px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  box-shadow:0 8px 16px rgba(0,0,0,.3);
}
.community-nav-arrow-left{ left:.22rem; }
.community-nav-arrow-right{ right:.22rem; }
.community-nav-arrow[hidden]{display:none !important;}
.community-view-tabs-global{
  margin:-5rem 0 .45rem;
  border-top-left-radius:0;
  border-top-right-radius:0;
}
.community-view-tab{
  border:0;
  border-right:1px solid rgba(255,255,255,.12);
  border-radius:0;
  margin:0;
  padding:10px 13px;
  font-size:14px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  color:color-mix(in srgb, var(--text) 92%, var(--text-dim) 8%);
  background:transparent;
  flex:0 0 auto;
}
.community-view-tab:last-child{border-right:0}
.community-view-tab[href]{
  text-decoration:none;
}
.community-view-tab:hover{
  color:var(--text);
  background:rgba(255,255,255,.14);
}
.community-view-tab[data-active=1]{
  background:linear-gradient(180deg, color-mix(in srgb, var(--panel) 72%, var(--accent) 28%), color-mix(in srgb, var(--panel) 86%, var(--accent) 14%));
  color:var(--text);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.24);
}
.community-view-tabs .community-view-tab.community-loved-active[data-active=1]{
  border-color:rgba(134,239,172,.85) !important;
  color:#f2fff7 !important;
  background:linear-gradient(180deg, rgba(34,197,94,.52), rgba(22,101,52,.62)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(134,239,172,.36),
    0 0 0 1px rgba(134,239,172,.38),
    0 10px 24px rgba(14,34,22,.5),
    0 0 18px rgba(74,222,128,.42) !important;
  animation:community-loved-pulse 1.6s ease-in-out infinite;
}
.community-view-tabs .community-view-tab.community-loved-active[data-active=1]:hover{
  background:linear-gradient(180deg, rgba(34,197,94,.6), rgba(22,101,52,.68)) !important;
  color:#ffffff !important;
}
@keyframes community-loved-pulse{
  0%,100%{filter:saturate(1);}
  50%{filter:saturate(1.2);}
}


.spinner{
  display:inline-block;
  width:14px;
  height:14px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.25);
  border-top-color:var(--accent);
  margin-right:.45rem;
  animation:spin .8s linear infinite;
  vertical-align:middle;
}
@keyframes spin{
  to{transform:rotate(360deg)}
}

.footer{
  border-top:1px solid var(--line);
  padding:1rem 0 1.4rem;
  color:var(--text-dim);
  font-size:.8rem;
  text-align:center;
  margin-bottom:calc(8.5rem + env(safe-area-inset-bottom, 0px));
}
.footer-ascii{
  margin-left:.45rem;
  border:0;
  background:transparent;
  color:var(--text-dim);
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:.72rem;
  letter-spacing:.04em;
  text-transform:lowercase;
  cursor:pointer;
}
.footer-ascii:hover{color:var(--text)}
.status-badge{
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  border:1px solid var(--border);
  border-radius:999px;
  padding:.32rem .55rem;
  font-size:.72rem;
  line-height:1;
  color:var(--text);
  background:rgba(255,255,255,.03);
  margin-left:.5rem;
}
.about-panel{
  margin:.65rem auto 0;
  max-width:560px;
  text-align:left;
  border:1px solid var(--line);
  border-radius:.6rem;
  background:rgba(255,255,255,.02);
  padding:.45rem .6rem;
}
.about-panel summary{
  cursor:pointer;
  font-weight:700;
  color:var(--text);
  list-style:none;
}
.about-panel summary::-webkit-details-marker{display:none}
.about-panel p{
  margin:.5rem 0 0;
  color:var(--text-dim);
  font-size:.76rem;
}

.player-shell{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:30;
  background:linear-gradient(180deg, rgba(22,26,34,.72), rgba(13,15,20,.82));
  backdrop-filter:saturate(130%) blur(14px);
  -webkit-backdrop-filter:saturate(130%) blur(14px);
  border-top:1px solid rgba(255,255,255,.14);
  box-shadow:0 -10px 32px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06);
}
.player-shell.hidden{display:none}
.player{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,1.2fr);
  gap:.55rem .75rem;
  align-items:center;
  padding-top:.48rem;
  padding-bottom:calc(.52rem + env(safe-area-inset-bottom, 0px));
}
.player-left{min-width:0}
.now-link{display:block;color:inherit;text-decoration:none}
.now-link[aria-disabled="true"]{pointer-events:none}
.now-link[aria-disabled="false"]{cursor:pointer}
.now-link:hover .now-title,.now-link:hover .now-meta{text-decoration:underline}
.now-title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.now-meta{color:var(--text-dim);font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.now-state{margin-top:.18rem;color:var(--text-dim);font-size:.77rem;text-transform:uppercase;letter-spacing:.05em}

.player-mid{display:flex;flex-direction:column;gap:.52rem;min-width:0}
.player-controls{display:flex;gap:.34rem;justify-content:flex-end;flex-wrap:wrap}
.player-controls .btn{
  min-height:34px;
  border-radius:.52rem;
  padding:.45rem .5rem;
  font-size:.8rem;
}
.player-controls .btn-icon{
  min-width:34px;
  padding:.32rem .45rem;
}
.player-controls .btn-primary{
  min-width:42px;
}
.btn-icon-only{
  display:inline-grid;
  place-items:center;
  min-width:34px;
  padding:.3rem .38rem;
  font-weight:800;
  line-height:1;
}
.btn-icon-only .icon{
  width:16px;
  height:16px;
}
.btn-close-player{
  font-weight:900;
  font-size:1rem;
}
.player-vote{
  align-self:flex-start;
}
.player-vote .vote-btn{
  min-height:34px;
  min-width:34px;
  padding:0;
}
.player-vote .vote-score{
  width:34px;
  height:34px;
  font-size:.9rem;
}
.player-vote.is-disabled{
  opacity:.55;
}
.player-progress{display:flex;align-items:center;gap:.6rem;min-width:0}
.player-progress input[type="range"]{flex:1;min-width:120px}
.time{font-size:.76rem;color:var(--text-dim);min-width:2.5rem;text-align:center}
.volume-control{display:flex;align-items:center;gap:.35rem}
.volume-label{font-size:.72rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em}
#volume{width:96px}

@media (max-width:640px){
  .volume-control{display:none}
}

@media (max-width:860px){
  .player{grid-template-columns:1fr}
  .player-controls{justify-content:flex-start}
  .player-vote{
    width:100%;
    justify-content:flex-start;
  }
}

@media (max-width:640px){
  .container{padding:1rem 1rem}
  .topbar{
    padding-top:.75rem;
    padding-bottom:.7rem;
    grid-template-columns:1fr;
  }
  .ecosystem-nav{
    grid-column:1;
    grid-row:2;
    width:100%;
    justify-content:flex-end;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    flex-wrap:nowrap;
    padding-bottom:.1rem;
  }
  .ecosystem-nav a,
  .ecosystem-nav .active{
    white-space:nowrap;
  }
  .wrap{padding-bottom:11.5rem}
  .nav{gap:.4rem}
  .nav a{font-size:.85rem;padding:.32rem .58rem}
  .btn{min-height:38px}
  .track{grid-template-columns:1fr}
  .track .row{justify-content:flex-start}
  .track.track-indexed{
    grid-template-columns:auto minmax(0,1fr) auto !important;
    align-items:center !important;
  }
  .track.track-indexed .row{
    justify-content:flex-end !important;
  }
  .track.explore-result{grid-template-columns:auto auto minmax(0,1fr)}
  .track.explore-result .explore-vote{align-self:flex-start}
  .track.explore-result .explore-inline-actions{flex-wrap:wrap}
  .btn-label-lite{
    opacity:.92;
    min-height:30px;
  }
  .label-popover{
    width:min(90vw, 320px);
  }
  .track-index{display:none}
  .item-links-inline{justify-content:flex-start}
  .item-links-right{justify-content:flex-start}
}
@media (max-width:900px){
  .topbar{
    grid-template-columns:1fr;
    align-items:start;
  }
  .brand{
    grid-column:1;
    grid-row:1;
  }
  .ecosystem-nav{
    grid-column:1;
    grid-row:2;
    justify-content:flex-start;
  }
  .nav{
    grid-column:1;
    grid-row:3;
  }
  .topbar-search-wrap{
    flex-wrap:wrap;
    grid-column:1;
    grid-row:4;
    width:100%;
    max-width:100%;
    margin-top:.1rem;
  }
  .topbar-search-hint{
    flex:1 0 100%;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }
  .topbar-search{
    flex:1 1 auto;
    justify-content:flex-start;
    min-width:220px;
  }
  .topbar-search input{
    width:100%;
    min-width:220px;
  }
  .btn-search-explore{
    white-space:nowrap;
    flex:0 0 auto;
  }
  .wrap{padding-top:calc(var(--topbar-offset) + .95rem)}
}
@media (max-width:720px){
  .item-top{flex-direction:row;align-items:flex-start}
  .item-links{align-items:flex-start}
}

/* Hard parity override: album/title typography exactly as news titles */
.h1,
.h1 .title-link,
.title-link,
.track-title,
.track-title.link-title,
.week-card .h1,
.week-card .h1 .title-link,
.explore-card .h1,
.explore-card .h1 .title-link{
  font-size:1.12rem !important;
  font-weight:600 !important;
  color:inherit !important;
}

/* =========================================================
   HEADER PARITY PATCH (shared for fcc.cc + music.fcc.cc)
   Goal: identical brand/nav/search alignment across pages
   ========================================================= */

/* Optional shared tokens (safe defaults) */
:root {
  --topbar-z: 10001;
  --topbar-max: 1100px;
  --topbar-pad-x: 1.5rem;
  --topbar-pad-y: 0.65rem;
  --header-gap-col: 1rem;
  --header-gap-row: 0.55rem;
  --header-offset: 5.8rem; /* tune once, used by .wrap/.site-header */
}

/* Fixed shell */
.topbar,
.topbar-shell {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--topbar-z);
  background: linear-gradient(180deg, rgba(12, 13, 15, 0.96), rgba(12, 13, 15, 0.90));
  border-bottom: 1px solid var(--line, #1e1e1e);
  backdrop-filter: saturate(120%) blur(6px);
}

/* Single canonical inner container */
.topbar-content,
.topbar-inner {
  max-width: var(--topbar-max);
  margin: 0 auto;
  padding: var(--topbar-pad-y) var(--topbar-pad-x);

  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "brand ecosystem"
    "local search";
  column-gap: var(--header-gap-col);
  row-gap: var(--header-gap-row);
  align-items: center;
}

/* Map regions */
.brand {
  grid-area: brand;
  min-width: 0;
}
.ecosystem-nav {
  grid-area: ecosystem;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: 0;
}
.nav {
  grid-area: local;
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
  min-width: 0;
}
.topbar-search-wrap {
  grid-area: search;
  display: flex;
  align-items: stretch;
  gap: 0.55rem;
  min-width: 0;
  justify-content: flex-end;
}

/* Search grows but stays sane */
.topbar-search {
  display: flex;
  align-items: stretch;
  gap: 0.55rem;
  min-width: 0;
}
.topbar-search input {
  width: min(36rem, 100%);
  min-width: 220px;
}

/* Keep nav chip style consistent */
.ecosystem-nav a,
.ecosystem-nav .active {
  font-family: var(--mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace);
  font-size: 0.9rem;
  line-height: 1;
  padding: 0.35rem 0.45rem;
  border-radius: 0.45rem;
  white-space: nowrap;
}

/* Remove legacy grid placement rules if they exist elsewhere */
.ecosystem-nav,
.brand,
.nav,
.topbar-search-wrap {
  /* neutralize old row/col from older rules */
  grid-column: auto !important;
  grid-row: auto !important;
}

/* Prevent content under fixed header */
.wrap {
  padding-top: calc(var(--header-offset) + 0.95rem);
}

/* ===== Responsive ===== */

@media (max-width: 900px) {
  .topbar-content,
  .topbar-inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "brand"
      "ecosystem"
      "local"
      "search";
    align-items: start;
  }

  .ecosystem-nav {
    justify-content: flex-start;
  }

  .topbar-search-wrap {
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }

  .topbar-search {
    width: 100%;
  }

  .topbar-search input {
    width: 100%;
    min-width: 0;
  }

  .wrap {
    /* slightly taller stack on tablet-ish widths */
    padding-top: calc(var(--header-offset) + 1.4rem);
  }
}

@media (max-width: 640px) {
  .topbar-content,
  .topbar-inner {
    padding: 0.6rem 1rem;
    row-gap: 0.45rem;
  }

  .ecosystem-nav {
    width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0.1rem;
  }

  .ecosystem-nav a,
  .ecosystem-nav .active {
    white-space: nowrap;
  }

  .nav {
    gap: 0.4rem;
  }

  .wrap {
    padding-top: calc(var(--header-offset) + 1.8rem);
  }
}

/* Floating bottom search dock (mobile/tablet). */
.floating-search-dock{
  position:fixed;
  left:0;
  right:0;
  bottom:calc(var(--music-player-height, 0px));
  z-index:31;
  padding:.58rem 1rem calc(.62rem + env(safe-area-inset-bottom, 0px));
  border-top:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(18,21,28,.9), rgba(11,13,18,.96));
  backdrop-filter:saturate(125%) blur(10px);
  transition:bottom .18s ease;
}
.floating-search-form{
  max-width:1100px;
  margin:0 auto;
  display:flex;
  align-items:stretch;
  gap:.55rem;
  position:relative;
}
.floating-search-form input{
  flex:1 1 auto;
  min-width:0;
  padding:.6rem .82rem;
  border-radius:.62rem;
  border:1px solid var(--border);
  background:#17181b;
  color:var(--text);
  font-size:16px;
  min-height:38px;
}
.floating-search-form .btn-search-explore{
  flex:0 0 auto;
  white-space:nowrap;
}
.floating-search-form .btn-smart-play{
  flex:0 0 auto;
  white-space:nowrap;
  min-width:74px;
}
.floating-search-form .btn-video-toggle{
  flex:0 0 auto;
  white-space:nowrap;
  min-width:82px;
  border-color:rgba(199,210,254,.45);
  background:linear-gradient(180deg, rgba(199,210,254,.18), rgba(199,210,254,.07));
}
.floating-search-form .btn-video-toggle.is-active{
  border-color:rgba(125,211,252,.6);
  color:#cfe8ff;
  background:linear-gradient(180deg, rgba(125,211,252,.25), rgba(125,211,252,.1));
}
.search-rail-toast{
  position:absolute;
  right:clamp(8.5rem, 26vw, 18.5rem);
  top:50%;
  transform:translateY(-50%);
  max-width:min(48%, 520px);
  padding:.34rem .56rem;
  border-radius:.56rem;
  border:1px solid rgba(125,211,252,.34);
  background:rgba(11,20,30,.9);
  color:#d9ecff;
  font-size:.78rem;
  line-height:1.25;
  pointer-events:none;
  opacity:1;
  transition:opacity .7s ease, transform .7s ease;
  z-index:3;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.search-rail-toast.fade{
  opacity:0;
  transform:translateY(-50%) translateX(8px);
}
.search-rail-toast.hidden{
  display:none !important;
}

@media (max-width:900px){
  .topbar-search-wrap{
    display:none !important;
  }
  .floating-search-dock{
    display:block;
  }
  .floating-search-form{
    flex-wrap:wrap;
    row-gap:.42rem;
  }
  .search-rail-toast{
    top:auto;
    bottom:.12rem;
    right:clamp(7.2rem, 42vw, 12.5rem);
    transform:none;
    max-width:58%;
    font-size:.72rem;
    padding:.28rem .46rem;
  }
  .search-rail-toast.fade{
    transform:translateX(8px);
  }
  .floating-search-form input{
    order:1;
    flex:1 1 100%;
    width:100%;
    max-height:0;
    opacity:0;
    pointer-events:none;
    transform:translateY(4px);
    padding-top:0;
    padding-bottom:0;
    border-width:0;
    margin:0;
    transition:max-height .16s ease, opacity .16s ease, transform .16s ease, padding .16s ease, border-width .16s ease;
  }
  .floating-search-dock.search-open .floating-search-form input{
    max-height:52px;
    opacity:1;
    pointer-events:auto;
    transform:none;
    padding:.6rem .82rem;
    border-width:1px;
    margin-bottom:.1rem;
  }
  .floating-search-form .btn-search-explore{ order:2; }
  .floating-search-form .btn-video-toggle{ order:3; }
  .floating-search-form .btn-smart-play{ order:4; }
  .floating-search-form .btn-smart-play{
    min-width:96px;
    font-weight:800;
    border-color:rgba(134,239,172,.7);
    color:#eafff1;
    background:linear-gradient(180deg, rgba(34,197,94,.35), rgba(22,101,52,.45));
    box-shadow:0 0 0 1px rgba(134,239,172,.24), 0 8px 20px rgba(14,34,22,.42);
    animation:ai-play-pulse 1.9s ease-in-out infinite;
  }
  body.music-player-closed .wrap{
    padding-bottom:8.8rem;
  }
  body.music-player-open .wrap{
    padding-bottom:calc(var(--music-player-height, 0px) + 8.8rem);
  }
}

@keyframes ai-play-pulse{
  0%,100%{transform:translateY(0);filter:saturate(1);}
  50%{transform:translateY(-1px);filter:saturate(1.15);}
}

/* 2026-02-17: compact top gap for music only */
:root {
  --header-offset: 3.95rem !important;
}

.wrap {
  padding-top: 4.4rem !important;
}

@media (max-width: 900px) {
  .topbar-content,
  .topbar-inner {
    padding-top: 0.36rem !important;
    padding-bottom: 0.32rem !important;
    row-gap: 0.22rem !important;
  }

  .wrap {
    padding-top: 4.2rem !important;
  }
}

@media (max-width: 640px) {
  .wrap {
    padding-top: 4.3rem !important;
  }
}

/* 2026-02-17: remove container vertical padding from music header rail */
.topbar.container {
  padding-top: 0.3rem !important;
  padding-bottom: 0 !important;
}

@media (max-width: 640px) {
  .topbar.container {
    padding-top: 0.3rem !important;
    padding-bottom: 0 !important;
  }
}

/* 2026-02-17: music brand typography/placement final settle */
.topbar.container .brand,
.topbar.container .brand a {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  
  -webkit-font-smoothing: antialiased;
}

.topbar.container .brand a {
  display: inline-block;
  transform: none;
}

/* 2026-02-17: music header letter-spacing hard normalize */
.topbar.container .brand,
.topbar.container .brand a,
.topbar.container .ecosystem-nav,
.topbar.container .ecosystem-nav a,
.topbar.container .ecosystem-nav .active {
  letter-spacing: 0 !important;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}

/* 2026-02-17: music nav text exact-match to shared canonical */
.topbar.container .ecosystem-nav,
.topbar.container .ecosystem-nav a,
.topbar.container .ecosystem-nav .active {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.topbar.container .ecosystem-nav .active {
  font-weight: 400 !important;
}

/* 2026-02-17: micro nav baseline settle */
.topbar.container .ecosystem-nav a,
.topbar.container .ecosystem-nav .active {
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
}

/* 2026-02-17: music header switched to art-style shell */
.site-header {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  padding-top: 3.2rem;
}

.topbar {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10001;
  background: linear-gradient(180deg, rgba(12, 13, 15, 0.96), rgba(12, 13, 15, 0.9));
  backdrop-filter: saturate(120%) blur(6px);
  border-bottom: 0 !important;
  display: block !important;
  padding: 0 !important;
}

.topbar-content {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0.65rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.wrap {
  padding-top: 4.35rem !important;
}

@media (max-width: 900px) {
  .site-header { padding-top: 3.05rem; }
  .topbar-content { padding: 0.5rem 0.95rem; }
  .wrap { padding-top: 4.1rem !important; }
}

/* 2026-02-17: floating search glass treatment */
.floating-search-form input {
  background: rgba(20, 24, 32, 0.62) !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  backdrop-filter: blur(8px) saturate(120%);
  -webkit-backdrop-filter: blur(8px) saturate(120%);
}

.floating-search-form .btn-search-explore {
  background: rgba(22, 26, 35, 0.58) !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  color: #e5e5e5 !important;
  backdrop-filter: blur(8px) saturate(120%);
  -webkit-backdrop-filter: blur(8px) saturate(120%);
}

.floating-search-form .btn-smart-play {
  background: rgba(22, 26, 35, 0.58) !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  color: #e5e5e5 !important;
  backdrop-filter: blur(8px) saturate(120%);
  -webkit-backdrop-filter: blur(8px) saturate(120%);
}

.floating-search-form .btn-search-explore:hover {
  background: rgba(30, 36, 48, 0.66) !important;
  border-color: rgba(199, 210, 254, 0.45) !important;
}

.floating-search-form .btn-smart-play:hover {
  background: rgba(30, 36, 48, 0.66) !important;
  border-color: rgba(199, 210, 254, 0.45) !important;
}

/* 2026-02-17: mobile brand color lock (music) */
@media (max-width: 900px){
  .topbar .brand,
  .topbar-content .brand,
  .fcc-econav-hamburger .brand,
  .fcc-econav-hamburger .brand a{
    color: var(--accent) !important;
  }
  .topbar .brand:hover,
  .topbar-content .brand:hover,
  .fcc-econav-hamburger .brand:hover,
  .fcc-econav-hamburger .brand a:hover{
    color: var(--accent-2) !important;
  }
}

/* 2026-02-17: mobile hamburger usability over cinematic backdrop */
@media (max-width: 900px){
  .topbar,
  .topbar-content,
  .fcc-econav-plane,
  .fcc-econav-hamburger{
    pointer-events:auto !important;
  }
  .topbar{
    background: rgba(8, 10, 14, 0.98) !important;
  }
  .fcc-econav-hamburger .fcc-econav-toggle-wrap{
    z-index: 20050 !important;
    pointer-events: auto !important;
    background: rgba(8, 10, 14, 0.96) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 0.5rem !important;
    padding: 0.12rem 0.2rem !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.38) !important;
  }
  .fcc-econav-hamburger .fcc-econav-tip{
    display: none !important;
  }
  .fcc-econav-hamburger .fcc-econav-toggle{
    min-width: 46px !important;
    min-height: 38px !important;
    font-size: 1.1rem !important;
    background: rgba(16, 20, 28, 0.98) !important;
    border-color: rgba(255, 255, 255, 0.34) !important;
    color: #ffffff !important;
  }
  .fcc-econav-hamburger nav.ecosystem-nav[data-fcc-econav]{
    z-index: 20060 !important;
    background: rgba(8, 10, 14, 0.99) !important;
    border-color: rgba(255, 255, 255, 0.24) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5) !important;
    padding: 0.56rem 0.62rem !important;
  }
  .fcc-econav-hamburger nav.ecosystem-nav[data-fcc-econav] a,
  .fcc-econav-hamburger nav.ecosystem-nav[data-fcc-econav] .active{
    min-height: 34px !important;
    display: flex !important;
    align-items: center !important;
    font-size: 0.95rem !important;
    color: #eef3ff !important;
  }
}

/* 2026-02-17: player close button now toggles compact mini-player */
#player.player-shell.collapsed .player{
  grid-template-columns:minmax(0,1fr) auto;
  gap:.28rem .55rem;
  align-items:center;
  padding-top:.26rem;
  padding-bottom:calc(.26rem + env(safe-area-inset-bottom, 0px));
}
#player.player-shell.collapsed .player-mid{gap:.26rem}
#player.player-shell.collapsed .now-meta,
#player.player-shell.collapsed .now-state,
#player.player-shell.collapsed #back15Btn,
#player.player-shell.collapsed #fwd15Btn,
#player.player-shell.collapsed #sleepBtn,
#player.player-shell.collapsed #shuffleBtn,
#player.player-shell.collapsed #smartAutoplayBtn,
#player.player-shell.collapsed #saveQueueBtn,
#player.player-shell.collapsed #playerVideoToggleBtn,
#player.player-shell.collapsed .volume-control,
#player.player-shell.collapsed #playerVoteStrip,
#player.player-shell.collapsed .player-vote{
  display:none !important;
}
#player.player-shell.collapsed .player-controls{
  gap:.25rem;
  flex-wrap:nowrap;
}
#player.player-shell.collapsed .player-controls .btn{
  min-height:30px;
  padding:.25rem .38rem;
}
#player.player-shell.collapsed .player-progress{
  gap:.38rem;
}
#player.player-shell.collapsed .time{
  min-width:2.15rem;
  font-size:.72rem;
}
#player.player-shell.collapsed #seek{
  min-width:96px;
}
@media (max-width:860px){
  #player.player-shell.collapsed .player{grid-template-columns:1fr;}
  #player.player-shell.collapsed .player-controls{justify-content:flex-start;}
}

/* 2026-02-17: quick-win unsquish album title/supporting text */
.item-meta{
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
}
.item-meta .h1,
.item-meta .sub,
.item-meta .track-meta{
  text-align:left;
}
@media (max-width: 1100px){
  .item-top{
    flex-wrap:wrap;
    row-gap:.5rem;
  }
  .week-card .item-top{
    flex-wrap:nowrap;
  }
  .item-top-actions{
    margin-left:auto;
    width:auto;
    justify-content:flex-start;
    align-items:flex-end;
  }
  .item-links{
    margin-left:0;
    width:100%;
    justify-content:flex-start;
    align-items:flex-start;
  }
}

/* 2026-02-17: compact vote controls in expanded player */
.player-controls #playerVoteStrip.player-vote{
  display:inline-flex;
  align-items:center;
  gap:.2rem;
  align-self:center;
  margin:0 .08rem;
}
.player-controls #playerVoteStrip .vote-btn{
  min-height:22px;
  min-width:22px;
  height:22px;
  width:22px;
  padding:0;
  border-radius:.35rem;
  font-size:.66rem;
  line-height:1;
}
.player-controls #playerVoteStrip .vote-btn .vote-icon{
  width:14px;
  height:14px;
  display:block;
}
.player-controls #playerVoteStrip .vote-btn.vote-up{
  color:#9ae6b4;
  border-color:rgba(72,187,120,.44);
  background:rgba(72,187,120,.14);
}
.player-controls #playerVoteStrip .vote-btn.vote-down{
  color:#fda4af;
  border-color:rgba(244,114,182,.42);
  background:rgba(244,114,182,.12);
}
.player-controls #playerVoteStrip .vote-score{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.66rem;
  border-radius:.35rem;
}
#player.player-shell.collapsed #playerVoteStrip{display:none !important;}

/* 2026-02-17: IA cinematic backdrop (muted video under content) */
.ia-cinema-backdrop{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  background:#090b0d;
  opacity:.62;
  transition:opacity .35s ease;
}
.ia-cinema-backdrop.is-active{
  opacity:.9;
}
.ia-cinema-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.86) contrast(1.08) brightness(.34);
  transform:scale(1.035);
}
.ia-cinema-wash{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 22%, rgba(199,210,254,.12), transparent 46%),
    radial-gradient(circle at 78% 74%, rgba(147,197,253,.12), transparent 52%),
    linear-gradient(180deg, rgba(8,10,14,.62) 0%, rgba(8,10,14,.8) 38%, rgba(8,10,14,.92) 100%);
}
body > .site-header,
body > #statusBanner,
body > #app,
body > .footer{
  position:relative;
  z-index:1;
}
body > .floating-search-dock{
  position:fixed;
  z-index:31;
}
#player.player-shell{
  z-index:35;
}
@media (max-width: 860px){
  .ia-cinema-backdrop{
    opacity:.74;
  }
  .ia-cinema-video{
    filter:saturate(.82) contrast(1.06) brightness(.3);
  }
}

/* 2026-02-17: mobile UX sprint (dock, drawer nav, touch floor, one-handed player) */
@media (max-width: 900px){
  :root{
    --music-mobile-header-h: 40px;
    --music-mobile-dock-h: 122px;
  }
  .community-view-tabs-global{
    margin:-3.5rem 0 .45rem;
  }
  .community-nav-shell{
    width:100%;
    padding-top:.05rem;
  }
  .community-view-tabs-global[data-community-nav-scroller]{
    width:100%;
    padding-left:0;
    padding-right:0;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  .community-view-tabs-global[data-community-nav-scroller]::-webkit-scrollbar{
    display:none;
  }
  .community-nav-shell.is-scrollable .community-nav-arrow{
    display:inline-flex;
  }


  .topbar{
    min-height: var(--music-mobile-header-h) !important;
  }
  .topbar-content{
    min-height: var(--music-mobile-header-h) !important;
    padding: 0.4rem 0.82rem !important;
    align-items: center !important;
    overflow: visible !important;
  }
  .topbar-content{
    justify-content: flex-start !important;
  }
  .site-header,
  .fcc-econav-plane,
  .fcc-econav-hamburger{
    overflow: visible !important;
  }  .fcc-econav-hamburger{
    padding-right: 0 !important;
    grid-template-columns: 1fr !important;
  }
  .wrap{
    padding-top: calc(var(--music-mobile-header-h) + 0.55rem) !important;
  }

  .site-header,
  .floating-search-dock{
    transition: transform .18s ease, opacity .18s ease;
    will-change: transform, opacity;
  }
  body.music-mobile-ui-hidden .site-header{
    transform: translateY(calc(-1 * var(--music-mobile-header-h) - 0.9rem));
    opacity: .02;
    pointer-events: none;
  }
  body.music-mobile-ui-hidden .floating-search-dock{
    transform: translateY(calc(100% + 0.9rem));
    opacity: .02;
    pointer-events: none;
  }
  body.music-player-closed .wrap{
    padding-bottom: calc(var(--music-mobile-dock-h) + 0.8rem) !important;
  }
  body.music-player-open .wrap{
    padding-bottom: calc(var(--music-player-height, 0px) + var(--music-mobile-dock-h) + 0.8rem) !important;
  }

  .floating-search-dock{
    min-height: var(--music-mobile-dock-h) !important;
    padding: 0.48rem 0.72rem calc(0.52rem + env(safe-area-inset-bottom, 0px)) !important;
  }
  .floating-search-form{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(90px, auto) minmax(54px, auto);
    grid-template-areas:
      "input input input"
      "search ai more";
    align-items: stretch;
    column-gap: 0.45rem;
    row-gap: 0.4rem;
  }
  .floating-search-form input{
    grid-area: input;
    max-height: 0;
    opacity: 0;
    pointer-events: none;
    padding-top: 0;
    padding-bottom: 0;
    border-width: 0;
    margin: 0;
  }
  .floating-search-dock.search-open .floating-search-form input{
    max-height: 52px;
    opacity: 1;
    pointer-events: auto;
    padding: .62rem .82rem;
    border-width: 1px;
  }
  .floating-search-form .btn-search-explore{ grid-area: search; }
  .floating-search-form .btn-smart-play{ grid-area: ai; }
  .floating-search-form .btn-more-toggle{ grid-area: more; }
  .floating-search-form .btn-video-toggle{
    min-width: 100%;
  }
  .floating-search-form .btn-search-explore,
  .floating-search-form .btn-smart-play,
  .floating-search-form .btn-more-toggle,
  .floating-search-form .btn-video-toggle{
    min-height: 44px !important;
    min-width: 44px !important;
    font-size: .92rem;
  }
  .floating-search-form .btn-more-toggle{
    font-size: 1.35rem;
    line-height: 1;
    padding: 0;
  }
  .floating-more-panel{
    position: absolute;
    right: 0.72rem;
    bottom: calc(100% + 0.44rem);
    width: min(62vw, 210px);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 0.62rem;
    background: rgba(8,10,14,.98);
    padding: 0.45rem;
    box-shadow: 0 12px 28px rgba(0,0,0,.46);
    display: none;
    z-index: 21010;
  }
  .floating-search-dock.more-open .floating-more-panel{
    display: block;
  }

  #player .player-controls .btn{
    min-height: 44px !important;
    min-width: 44px !important;
  }
  #player .player-controls{
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 0.3rem !important;
  }
  #player .btn-player-more{
    min-width: 62px !important;
    font-size: .84rem;
    font-weight: 700;
  }
  /* Maximized mobile: keep only play/pause, -15, +15, shuffle */
  #player:not(.collapsed) #prevBtn,
  #player:not(.collapsed) #nextBtn,
  #player:not(.collapsed) #playerVoteStrip,
  #player:not(.collapsed) #smartAutoplayBtn,
  #player:not(.collapsed) #saveQueueBtn,
  #player:not(.collapsed) #closePlayerBtn,
  #player:not(.collapsed) #sleepBtn,
  #player:not(.collapsed) #playerMoreBtn{
    display: none !important;
  }
  #player:not(.collapsed) .player-controls{
    justify-content: center !important;
    gap: .42rem !important;
    flex-wrap: nowrap !important;
  }
  #player:not(.player-more-open) .player-secondary-control{
    display: none !important;
  }
  #player:not(.player-more-open) #playerVoteStrip.player-secondary-control{
    display: inline-flex !important;
  }
  #player.player-more-open .player-secondary-control{
    display: inline-flex !important;
  }
  #player.player-more-open .player-controls{
    flex-wrap: wrap !important;
    row-gap: .42rem !important;
  }
  #player.player-more-open .player-secondary-control{
    min-width: calc(50% - .18rem) !important;
    justify-content: center !important;
  }
  #player.player-more-open .player-vote.player-secondary-control{
    display: inline-flex !important;
    min-width: calc(50% - .18rem) !important;
    justify-content: center !important;
  }
  #player.player-more-open #playerVoteStrip .vote-btn{
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 1rem !important;
  }
  #player.player-shell.collapsed #playerVoteStrip{
    display: inline-flex !important;
  }
  /* Collapsed one-handed view must always keep core transport controls visible */
  #player.player-shell.collapsed #prevBtn,
  #player.player-shell.collapsed #nextBtn,
  #player.player-shell.collapsed #playerMoreBtn{
    display: inline-flex !important;
  }
  /* Deterministic collapsed mobile transport strip */
  #player.player-shell.collapsed .player-controls > *{
    display: none !important;
  }
  #player.player-shell.collapsed #prevBtn,
  #player.player-shell.collapsed #playBtn,
  #player.player-shell.collapsed #nextBtn,
  #player.player-shell.collapsed #playerVoteStrip,
  #player.player-shell.collapsed #playerMoreBtn{
    display: inline-flex !important;
  }
  #player.player-shell.collapsed .player-controls{
    justify-content: center !important;
    gap: .26rem !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  #player.player-shell.collapsed #playerVoteStrip{
    margin: 0 .08rem !important;
  }
  #player #saveQueueBtn,
  #player #closePlayerBtn,
  #player #sleepBtn{
    display: none !important;
  }
}


/* 2026-02-18: expanded player simplified for readability; secondary tools moved to mini player */
#player:not(.collapsed) #sleepBtn,
#player:not(.collapsed) #shuffleBtn,
#player:not(.collapsed) #playerVideoToggleBtn,
#player:not(.collapsed) #playerVoteStrip{
  display:none !important;
}
#player:not(.collapsed) .player-controls{
  justify-content:center !important;
  gap:.52rem !important;
}
#player:not(.collapsed) .player-controls .btn{
  min-height:46px !important;
  padding:.56rem .86rem !important;
  border-radius:.62rem !important;
  font-size:.98rem !important;
  font-weight:700 !important;
}
#player:not(.collapsed) #prevBtn,
#player:not(.collapsed) #nextBtn{
  min-width:126px !important;
  font-weight:800 !important;
}
#player:not(.collapsed) #back15Btn,
#player:not(.collapsed) #fwd15Btn{
  min-width:114px !important;
}
#player:not(.collapsed) #playBtn{
  min-width:92px !important;
  font-weight:800 !important;
}

@media (max-width: 900px){
  #player.player-shell.collapsed .player-controls > *{
    display:none !important;
  }
  #player.player-shell.collapsed #prevBtn,
  #player.player-shell.collapsed #playBtn,
  #player.player-shell.collapsed #nextBtn,
  #player.player-shell.collapsed #sleepBtn,
  #player.player-shell.collapsed #shuffleBtn,
  #player.player-shell.collapsed #playerVideoToggleBtn,
  #player.player-shell.collapsed #playerVoteStrip,
  #player.player-shell.collapsed #closePlayerBtn{
    display:inline-flex !important;
  }
  #player.player-shell.collapsed .player-controls{
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:.26rem !important;
    overflow:visible !important;
  }
  #player.player-shell.collapsed .player-controls .btn{
    min-height:36px !important;
    padding:.3rem .52rem !important;
    font-size:.8rem !important;
  }
  #player.player-shell.collapsed #playerVoteStrip{
    margin:0 !important;
  }
  #player.player-shell.collapsed #playerVoteStrip .vote-btn,
  #player.player-shell.collapsed #playerVoteStrip .vote-score{
    min-height:32px !important;
    min-width:32px !important;
    width:32px !important;
    height:32px !important;
  }
}


/* 2026-02-18: community-loved compact cards + stronger play album button */
.week-card{
  padding:.16rem .2rem .48rem .2rem !important;
  margin:0 0 .56rem !important;
}
.week-card .item-top{
  gap:.56rem !important;
}
.week-card .item-art{
  width:64px !important;
  height:64px !important;
}
.week-card .item-meta .h1{
  margin-bottom:.08rem !important;
}
.week-card .item-meta .sub{
  font-size:.83rem !important;
  line-height:1.2 !important;
}
.week-card .item-top-actions{
  gap:.26rem !important;
}
.week-card .item-top-actions .btn-playnow{
  min-height:40px !important;
  min-width:122px !important;
  padding:.48rem .8rem !important;
  font-size:.94rem !important;
  font-weight:800 !important;
}
@media (max-width: 900px){
  .week-card .item-top-actions .btn-playnow{
    min-height:38px !important;
    min-width:108px !important;
    font-size:.88rem !important;
  }
}


/* 2026-02-18: community vote strip compact */
.week-card .vote-strip{
  gap:.18rem !important;
  padding:.2rem .24rem !important;
}
.week-card .vote-strip .vote-label{
  display:none !important;
}
.week-card .vote-strip .vote-btn,
.week-card .vote-strip .vote-score{
  min-width:24px !important;
  min-height:24px !important;
  width:24px !important;
  height:24px !important;
  font-size:.72rem !important;
}


/* 2026-02-18: media-player vote thumbs in expanded + mini; video toggle mini-only */
#player:not(.collapsed) #playerVoteStrip{
  display:inline-flex !important;
  align-items:center !important;
  gap:.24rem !important;
}
#player:not(.collapsed) #playerVoteStrip .vote-btn{
  min-width:30px !important;
  min-height:30px !important;
  width:30px !important;
  height:30px !important;
  border-radius:.48rem !important;
  padding:0 !important;
}
#player:not(.collapsed) #playerVoteStrip .vote-icon{
  width:16px !important;
  height:16px !important;
  display:block !important;
}
#player:not(.collapsed) #playerVoteStrip .vote-score{
  min-width:30px !important;
  min-height:30px !important;
  width:30px !important;
  height:30px !important;
}
#player:not(.collapsed) #playerVideoToggleBtn{
  display:none !important;
}
#player.player-shell.collapsed #playerVideoToggleBtn{
  display:inline-flex !important;
}
#player.player-shell.collapsed #playerVoteStrip{
  display:inline-flex !important;
  gap:.2rem !important;
}
#player.player-shell.collapsed #playerVoteStrip .vote-btn,
#player.player-shell.collapsed #playerVoteStrip .vote-score{
  min-width:30px !important;
  min-height:30px !important;
  width:30px !important;
  height:30px !important;
}
#player.player-shell.collapsed #playerVoteStrip .vote-icon{
  width:14px !important;
  height:14px !important;
}
#player #playerVoteStrip .vote-btn.vote-up{
  color:#86efac !important;
  border-color:rgba(74,222,128,.48) !important;
  background:rgba(22,101,52,.24) !important;
}
#player #playerVoteStrip .vote-btn.vote-down{
  color:#fda4af !important;
  border-color:rgba(244,114,182,.46) !important;
  background:rgba(131,24,67,.22) !important;
}
#player #playerVoteStrip .vote-btn.active{
  box-shadow:0 0 0 1px rgba(255,255,255,.2) inset, 0 0 0 1px rgba(255,255,255,.1) !important;
}


/* 2026-02-18: status banner as overlay toast (no layout shift) */
body > #statusBanner{
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  top: calc(var(--topbar-offset, 56px) + 0.34rem) !important;
  width: min(94vw, 980px) !important;
  margin: 0 !important;
  z-index: 21030 !important;
  pointer-events: none !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.34) !important;
}
body > #statusBanner.hidden{
  display: none !important;
}
@media (max-width: 900px){
  body > #statusBanner{
    top: calc(var(--music-mobile-header-h, 40px) + 0.32rem) !important;
    width: min(96vw, 760px) !important;
    font-size: .82rem !important;
    padding: .48rem .72rem !important;
  }
}


/* 2026-02-18: mini player shows musician/meta + easier expansion affordance */
#player.player-shell.collapsed .now-meta{
  display:block !important;
  font-size:.78rem !important;
  line-height:1.15 !important;
  opacity:.95 !important;
  margin-top:.06rem !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#player.player-shell.collapsed .now-link{
  cursor:pointer;
}
#player.player-shell.collapsed .player-left{
  min-width:0;
}


/* 2026-02-18: explicit center expand/collapse control */
#player #playerToggleSizeBtn{
  min-height:44px !important;
  min-width:170px !important;
  padding:.58rem 1rem !important;
  font-size:.96rem !important;
  font-weight:800 !important;
  border-radius:.66rem !important;
  margin:0 auto !important;
}
#player .player-controls{
  align-items:center;
}
#player.player-shell.collapsed #playerToggleSizeBtn,
#player:not(.collapsed) #playerToggleSizeBtn{
  display:inline-flex !important;
}
@media (max-width: 900px){
  #player #playerToggleSizeBtn{
    min-height:38px !important;
    min-width:148px !important;
    padding:.42rem .72rem !important;
    font-size:.84rem !important;
  }
}


/* 2026-02-18: player size toggle left-most, muted visual */
#player #playerToggleSizeBtn{
  margin:0 .36rem 0 0 !important;
  min-width:150px !important;
  background:rgba(255,255,255,.035) !important;
  border-color:rgba(255,255,255,.18) !important;
  color:var(--text-dim) !important;
  font-weight:700 !important;
}
#player #playerToggleSizeBtn:hover{
  background:rgba(255,255,255,.065) !important;
  color:var(--text) !important;
}
@media (max-width:900px){
  #player #playerToggleSizeBtn{
    min-width:132px !important;
    margin:0 .24rem 0 0 !important;
  }
}


/* 2026-02-18: AI button active illumination + inline AI status in floating dock */
.floating-search-form .btn-smart-play{
  border-color: rgba(255,255,255,.28) !important;
  color: #f3f5f8 !important;
  background: linear-gradient(180deg, rgba(22,26,35,.58), rgba(16,20,28,.64)) !important;
  box-shadow: none !important;
  animation: none !important;
}
.floating-search-form .btn-smart-play.is-active{
  border-color: rgba(134,239,172,.82) !important;
  color: #ecfff3 !important;
  background: linear-gradient(180deg, rgba(34,197,94,.42), rgba(22,101,52,.56)) !important;
  box-shadow: 0 0 0 1px rgba(134,239,172,.28), 0 8px 22px rgba(10,32,18,.46) !important;
  animation: ai-play-pulse 1.9s ease-in-out infinite !important;
}

#floatingAiStatus.floating-ai-status{
  max-width: 1100px;
  margin: .38rem auto 0;
  padding: .36rem .58rem;
  border-radius: .56rem;
  border: 1px solid rgba(125,211,252,.34);
  background: rgba(11,20,30,.88);
  color: #d9ecff;
  font-size: .79rem;
  line-height: 1.25;
}
#floatingAiStatus.floating-ai-status.hidden{ display:none !important; }

#floatingAiNowTicker.floating-ai-now-ticker{
  max-width: 1100px;
  margin: .3rem auto 0;
  padding: .32rem .58rem;
  border-radius: .56rem;
  border: 1px solid rgba(125,211,252,.28);
  background: rgba(11,20,30,.72);
  color: #d9ecff;
  font-size: .79rem;
  line-height: 1.2;
  overflow: hidden;
  white-space: nowrap;
  text-align: left;
}
#floatingAiNowTicker.floating-ai-now-ticker.hidden{ display:none !important; }
#floatingAiNowTicker .floating-ai-now-ticker-text{
  display: block;
  padding-left: 0;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: none;
  animation: none;
}

@media (max-width:900px){
  #floatingAiStatus.floating-ai-status{
    margin: .26rem 0 0;
    font-size: .74rem;
    padding: .3rem .48rem;
  }
  #floatingAiNowTicker.floating-ai-now-ticker{
    margin: .2rem 0 0;
    font-size: .72rem;
    padding: .26rem .46rem;
  }
  .floating-search-form .btn-smart-play{
    animation: none !important;
    box-shadow: none !important;
  }
  .floating-search-form .btn-smart-play.is-active{
    animation: ai-play-pulse 1.9s ease-in-out infinite !important;
    box-shadow: 0 0 0 1px rgba(134,239,172,.28), 0 7px 18px rgba(10,32,18,.44) !important;
  }
}


@media (max-width: 900px) and (orientation: landscape){
  :root{
    --music-mobile-header-h: 40px;
    --music-mobile-dock-h: 78px;
  }
  .floating-search-dock{
    padding: 0.34rem 0.72rem calc(0.4rem + env(safe-area-inset-bottom, 0px)) !important;
  }
  .floating-search-form{
    grid-template-columns: minmax(0,1fr) auto auto auto;
    grid-template-areas: "input search ai more";
    column-gap: 0.38rem;
    row-gap: 0.3rem;
  }
  .floating-search-form input{
    max-height: 44px;
    opacity: 1;
    pointer-events: auto;
    border-width: 1px;
    margin: 0;
    padding: .56rem .74rem;
  }
  .floating-search-form .btn-search-explore,
  .floating-search-form .btn-smart-play,
  .floating-search-form .btn-more-toggle,
  .floating-search-form .btn-video-toggle{
    min-height: 40px !important;
  }
}


@media (max-width: 900px){
  #player:not(.collapsed) #playBtn,
  #player:not(.collapsed) #back15Btn,
  #player:not(.collapsed) #fwd15Btn,
  #player:not(.collapsed) #shuffleBtn,
  #player:not(.collapsed) #playerToggleSizeBtn{
    min-height: 46px !important;
    font-size: .96rem !important;
    padding: .56rem .78rem !important;
  }
}


/* 2026-02-19: explicit mobile ticket fixes (visible)
   IN-20260218143846-4D9F51: landscape dock mode
   IN-20260218143539-5627D2: maximized player mobile layout
   IN-20260218144043-9CE4B6: mobile view normalization */
@media (max-width: 900px){
  body{
    font-size: 15px;
  }
  .wrap{
    padding-left: .75rem !important;
    padding-right: .75rem !important;
  }
  .card{
    border-radius: .82rem !important;
    padding: .8rem .82rem !important;
  }
}

@media (max-width: 900px) and (orientation: landscape){
  body.music-mobile-landscape .floating-search-dock{
    min-height: 64px !important;
    padding: .34rem .58rem calc(.36rem + env(safe-area-inset-bottom, 0px)) !important;
  }
  body.music-mobile-landscape .floating-search-form{
    grid-template-columns: 1fr 1fr 1fr !important;
    grid-template-areas: "search ai more" !important;
    gap: .34rem !important;
  }
  body.music-mobile-landscape .floating-search-form input{
    display: none !important;
  }
  body.music-mobile-landscape .floating-search-form .btn-search-explore,
  body.music-mobile-landscape .floating-search-form .btn-smart-play,
  body.music-mobile-landscape .floating-search-form .btn-more-toggle{
    min-height: 40px !important;
    font-size: .86rem !important;
  }
}

@media (max-width: 900px){
  #player.player-mobile-max .player{
    grid-template-columns: 1fr !important;
    gap: .56rem !important;
    padding: .62rem .68rem !important;
  }
  #player.player-mobile-max .player-left{
    order: 1;
  }
  #player.player-mobile-max .player-mid{
    order: 2;
    gap: .42rem !important;
  }
  #player.player-mobile-max .player-controls{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .38rem !important;
  }
  #player.player-mobile-max .player-controls .btn{
    min-height: 46px !important;
    width: 100% !important;
    font-size: .95rem !important;
  }
  #player.player-mobile-max #playBtn{
    font-size: 1.14rem !important;
  }
}


/* 2026-02-19: ticket IN-20260218144043-9CE4B6 mobile transport symbols */
@media (max-width: 900px){
  #back15Btn,
  #fwd15Btn{
    display:none !important;
  }
  #prevBtn,
  #nextBtn,
  #playBtn{
    min-width:52px !important;
    min-height:46px !important;
    font-size:1.12rem !important;
    line-height:1 !important;
    padding:.45rem .52rem !important;
  }
}


/* 2026-02-19: ticket IN-20260218143846-4D9F51 landscape dock view */
@media (max-width: 900px) and (orientation: landscape){
  body.music-mobile-landscape-dock .site-header,
  body.music-mobile-landscape-dock #statusBanner,
  body.music-mobile-landscape-dock #app,
  body.music-mobile-landscape-dock .floating-search-dock,
  body.music-mobile-landscape-dock .footer{
    display:none !important;
  }
  body.music-mobile-landscape-dock .wrap{
    padding:0 !important;
    margin:0 !important;
  }
  body.music-mobile-landscape-dock #player.player-shell{
    position:fixed !important;
    inset:0 !important;
    z-index:32000 !important;
    display:block !important;
    background:linear-gradient(180deg,#090b0f 0%,#0c1016 100%) !important;
  }
  body.music-mobile-landscape-dock #player.player-shell.hidden{
    display:block !important;
  }
  body.music-mobile-landscape-dock #player .player{
    height:100dvh !important;
    min-height:100dvh !important;
    max-width:none !important;
    width:100vw !important;
    margin:0 !important;
    padding:.9rem .9rem calc(.9rem + env(safe-area-inset-bottom, 0px)) !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 1fr !important;
    gap:.8rem !important;
    align-content:stretch !important;
  }
  body.music-mobile-landscape-dock #player .player-left{
    align-self:start;
  }
  body.music-mobile-landscape-dock #player .now-title{
    font-size:clamp(1.15rem, 3.8vw, 1.8rem) !important;
    line-height:1.2 !important;
  }
  body.music-mobile-landscape-dock #player .now-meta{
    font-size:clamp(.96rem, 2.6vw, 1.2rem) !important;
    opacity:.95;
  }
  body.music-mobile-landscape-dock #player .now-state,
  body.music-mobile-landscape-dock #player #playerToggleSizeBtn,
  body.music-mobile-landscape-dock #player #sleepBtn,
  body.music-mobile-landscape-dock #player #shuffleBtn,
  body.music-mobile-landscape-dock #player #saveQueueBtn,
  body.music-mobile-landscape-dock #player #playerVideoToggleBtn,
  body.music-mobile-landscape-dock #player #playerMoreBtn,
  body.music-mobile-landscape-dock #player #back15Btn,
  body.music-mobile-landscape-dock #player #fwd15Btn,
  body.music-mobile-landscape-dock #player .player-progress,
  body.music-mobile-landscape-dock #player #closePlayerBtn{
    display:none !important;
  }
  body.music-mobile-landscape-dock #player .player-mid{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-height:0 !important;
  }
  body.music-mobile-landscape-dock #player .player-controls{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    grid-template-areas:
      "prev play next"
      "vote vote vote";
    gap:.7rem !important;
    width:100% !important;
    align-content:center !important;
  }
  body.music-mobile-landscape-dock #player .player-controls > *{
    display:none !important;
  }
  body.music-mobile-landscape-dock #player #prevBtn,
  body.music-mobile-landscape-dock #player #playBtn,
  body.music-mobile-landscape-dock #player #nextBtn,
  body.music-mobile-landscape-dock #player #playerVoteStrip{
    display:flex !important;
    width:100% !important;
    justify-content:center !important;
    align-items:center !important;
  }
  body.music-mobile-landscape-dock #player #prevBtn{ grid-area: prev; }
  body.music-mobile-landscape-dock #player #playBtn{ grid-area: play; }
  body.music-mobile-landscape-dock #player #nextBtn{ grid-area: next; }
  body.music-mobile-landscape-dock #player #playerVoteStrip{ grid-area: vote; }
  body.music-mobile-landscape-dock #player #prevBtn,
  body.music-mobile-landscape-dock #player #playBtn,
  body.music-mobile-landscape-dock #player #nextBtn{
    min-height:clamp(92px, 24vh, 180px) !important;
    font-size:clamp(2.1rem, 8vw, 3.8rem) !important;
    border-radius:1rem !important;
    padding:0 !important;
  }
  body.music-mobile-landscape-dock #player #prevBtn,
  body.music-mobile-landscape-dock #player #playBtn,
  body.music-mobile-landscape-dock #player #nextBtn{
    border:1px solid rgba(255,255,255,.22) !important;
    box-shadow: 0 14px 28px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.06) !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.35);
  }
  body.music-mobile-landscape-dock #player #prevBtn{
    color:#9ad7ff !important;
    background:linear-gradient(180deg, rgba(24,46,66,.92), rgba(14,30,44,.96)) !important;
    border-color:rgba(125,211,252,.5) !important;
  }
  body.music-mobile-landscape-dock #player #playBtn{
    color:#d8ffe6 !important;
    background:linear-gradient(180deg, rgba(30,92,58,.95), rgba(18,64,41,.98)) !important;
    border-color:rgba(134,239,172,.62) !important;
    box-shadow: 0 0 0 2px rgba(134,239,172,.2), 0 16px 32px rgba(8,42,23,.4) !important;
  }
  body.music-mobile-landscape-dock #player #nextBtn{
    color:#ffd8a8 !important;
    background:linear-gradient(180deg, rgba(78,49,23,.92), rgba(58,36,16,.97)) !important;
    border-color:rgba(251,191,121,.54) !important;
  }
  body.music-mobile-landscape-dock #player #prevBtn:hover,
  body.music-mobile-landscape-dock #player #playBtn:hover,
  body.music-mobile-landscape-dock #player #nextBtn:hover{
    filter:brightness(1.08);
  }
  body.music-mobile-landscape-dock #player #playerVoteStrip{
    min-height:clamp(92px, 24vh, 180px) !important;
    border-radius:1rem !important;
    gap:.7rem !important;
    padding:.4rem .6rem !important;
    border:1px solid rgba(255,255,255,.16) !important;
    background:rgba(255,255,255,.04) !important;
    justify-content:center !important;
  }
  body.music-mobile-landscape-dock #player #playerVoteStrip .vote-btn{
    min-height:clamp(80px, 20vh, 150px) !important;
    min-width:clamp(80px, 20vh, 150px) !important;
    border-radius:.9rem !important;
  }
  body.music-mobile-landscape-dock #player #playerVoteStrip .vote-icon{
    width:clamp(30px, 7vw, 52px) !important;
    height:clamp(30px, 7vw, 52px) !important;
  }
  body.music-mobile-landscape-dock #player #playerVoteStrip .vote-score{
    font-size:clamp(1rem, 2.8vw, 1.4rem) !important;
    min-width:2.2rem !important;
  }
}



/* 2026-02-19: landscape dock transport no-box + grayscale */
@media (max-width: 900px) and (orientation: landscape){
  body.music-mobile-landscape-dock #player #prevBtn,
  body.music-mobile-landscape-dock #player #playBtn,
  body.music-mobile-landscape-dock #player #nextBtn{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    color: #cfd3d9 !important;
    filter: grayscale(1) !important;
    text-shadow: none !important;
  }
  body.music-mobile-landscape-dock #player #prevBtn:hover,
  body.music-mobile-landscape-dock #player #playBtn:hover,
  body.music-mobile-landscape-dock #player #nextBtn:hover,
  body.music-mobile-landscape-dock #player #prevBtn:focus,
  body.music-mobile-landscape-dock #player #playBtn:focus,
  body.music-mobile-landscape-dock #player #nextBtn:focus{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    filter: grayscale(1) brightness(1.08) !important;
  }
}


/* 2026-02-19: landscape dock transport color unify b11 */
@media (max-width: 900px) and (orientation: landscape){
  body.music-mobile-landscape-dock #player #prevBtn,
  body.music-mobile-landscape-dock #player #playBtn,
  body.music-mobile-landscape-dock #player #nextBtn,
  body.music-mobile-landscape-dock #player #prevBtn:hover,
  body.music-mobile-landscape-dock #player #playBtn:hover,
  body.music-mobile-landscape-dock #player #nextBtn:hover,
  body.music-mobile-landscape-dock #player #prevBtn:focus,
  body.music-mobile-landscape-dock #player #playBtn:focus,
  body.music-mobile-landscape-dock #player #nextBtn:focus,
  body.music-mobile-landscape-dock #player #prevBtn:disabled,
  body.music-mobile-landscape-dock #player #playBtn:disabled,
  body.music-mobile-landscape-dock #player #nextBtn:disabled{
    color:#cfd3d9 !important;
    opacity:1 !important;
    filter:grayscale(1) !important;
  }
}

/* 2026-02-19: desktop theme selectors (right margin) */
.theme-dock{
  position:fixed;
  right:14px;
  top:40vh;
  transform:translateY(-40%);
  z-index:21020;
  display:flex;
  flex-direction:column;
  gap:.6rem;
}
.theme-control{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.42rem;
}
.theme-btn{
  min-width:52px;
  min-height:34px;
  padding:.25rem .48rem;
  font-size:.73rem;
  letter-spacing:.08em;
  opacity:.92;
}
.theme-panel{
  width:0;
  opacity:0;
  overflow:hidden;
  transition:width .2s ease, opacity .2s ease;
}
.theme-panel.hidden{
  pointer-events:none;
}
.theme-control.is-open .theme-panel{
  width:58px;
  opacity:1;
}
.theme-picker-ring{
  width:54px;
  height:54px;
  border-radius:999px;
  padding:3px;
  box-shadow:0 8px 20px rgba(0,0,0,.26);
}
.theme-picker-bg{
  background:conic-gradient(from 0deg, #ef4444, #f59e0b, #22c55e, #3b82f6, #a855f7, #ef4444);
}
.theme-picker-text{
  background:conic-gradient(from 0deg, #ffffff, #fef3c7, #d1fae5, #dbeafe, #fce7f3, #ffffff);
}
.theme-picker-ring input[type="color"]{
  width:100%;
  height:100%;
  border:0;
  border-radius:999px;
  padding:0;
  background:transparent;
  cursor:pointer;
}
.theme-picker-ring input[type="color"]::-webkit-color-swatch-wrapper{padding:0;border-radius:999px}
.theme-picker-ring input[type="color"]::-webkit-color-swatch{border:0;border-radius:999px}
.theme-picker-ring input[type="color"]::-moz-color-swatch{border:0;border-radius:999px}
@media (max-width: 900px){
  .theme-dock{display:none !important}
}


/* 2026-02-19: mobile expanded controls override (non-landscape dock)
   Show: Collapse, Back, Play/Pause, Next, Votes
   Hide: +/-15s and secondary controls */
@media (max-width: 900px){
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) .player-controls > *{
    display:none !important;
  }
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playerToggleSizeBtn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #prevBtn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playBtn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #nextBtn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playerVoteStrip{
    display:inline-flex !important;
  }
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #back15Btn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #fwd15Btn{
    display:none !important;
  }
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) .player-controls{
    display:grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap:.36rem !important;
    align-items:center !important;
    justify-content:stretch !important;
  }
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playerToggleSizeBtn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #prevBtn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playBtn,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #nextBtn{
    min-height:46px !important;
    min-width:0 !important;
    width:100% !important;
    justify-content:center !important;
    padding:.45rem .4rem !important;
  }
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playerVoteStrip{
    min-height:46px !important;
    min-width:0 !important;
    width:100% !important;
    justify-content:center !important;
    gap:.24rem !important;
  }
}


/* 2026-02-19: mini compact override b15 (compact + votes) */
@media (max-width: 900px){
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed .player{
    grid-template-columns: 1fr !important;
    padding: .06rem .32rem calc(.06rem + env(safe-area-inset-bottom, 0px)) !important;
    gap: .08rem !important;
    min-height: 34px !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed .player-left,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed .player-progress,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed .time,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #seek,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #sleepBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #shuffleBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerVideoToggleBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerMoreBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #closePlayerBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #back15Btn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #fwd15Btn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #saveQueueBtn{
    display: none !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed .player-mid{
    gap: 0 !important;
    min-height: 0 !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed .player-controls{
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .14rem !important;
    align-items: center !important;
    justify-content: stretch !important;
    margin: 0 !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed .player-controls > *{
    display: none !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerToggleSizeBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #prevBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #nextBtn,
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerVoteStrip{
    display: inline-flex !important;
    min-height: 26px !important;
    height: 26px !important;
    min-width: 0 !important;
    width: 100% !important;
    padding: 0 !important;
    border-radius: .38rem !important;
    font-size: .86rem !important;
    line-height: 1 !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerVoteStrip{
    gap:.16rem !important;
    justify-content:center !important;
    border:1px solid rgba(255,255,255,.14) !important;
    background:rgba(255,255,255,.03) !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerVoteStrip .vote-btn{
    min-height:22px !important;
    min-width:22px !important;
    height:22px !important;
    width:22px !important;
    padding:0 !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerVoteStrip .vote-score{
    min-width:18px !important;
    font-size:.72rem !important;
  }
  body:not(.music-mobile-landscape-dock) #player.player-shell.collapsed #playerToggleSizeBtn{
    font-size: .75rem !important;
    opacity: .9;
  }
}



/* 2026-02-19: expanded mobile force votes visible b16 */
@media (max-width: 900px){
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playerVoteStrip,
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) .player-vote{
    display:inline-flex !important;
    visibility:visible !important;
    opacity:1 !important;
    min-height:46px !important;
    width:100% !important;
    justify-content:center !important;
    align-items:center !important;
    gap:.24rem !important;
  }
  body:not(.music-mobile-landscape-dock) #player:not(.collapsed) #playerVoteStrip .vote-btn{
    display:inline-flex !important;
    min-height:36px !important;
    min-width:36px !important;
  }
}



/* 2026-02-19: vote hard-unify top-of-card like /art */

.week-card .vote-strip,
.explore-card .vote-strip,
.item-top-hero .vote-strip{
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  align-items:center !important;
  gap:6px !important;
  padding-right:10px !important;
  padding-top:2px !important;
  border-right:1px solid var(--line) !important;
  align-self:flex-start !important;
  background:transparent !important;
}
.week-card .vote-strip .vote-btn,
.week-card .vote-strip .vote-score,
.explore-card .vote-strip .vote-btn,
.explore-card .vote-strip .vote-score,
.item-top-hero .vote-strip .vote-btn,
.item-top-hero .vote-strip .vote-score{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  border-radius:12px !important;
  font-size:.9rem !important;
}
.week-card .vote-strip .vote-label,
.explore-card .vote-strip .vote-label,
.item-top-hero .vote-strip .vote-label{
  display:none !important;
}
.history-vote-col .vote-btn .vote-icon{
  display:none !important;
}



/* 2026-02-19: hard match /art vote size+placement (20px top strip) */
.week-card .vote-strip,
.explore-card .vote-strip,
.item-top-hero .vote-strip{
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  align-items:center !important;
  gap:6px !important;
  border-right:1px solid var(--line) !important;
  padding-right:10px !important;
  padding-top:2px !important;
  align-self:flex-start !important;
  background:transparent !important;
}
.week-card .vote-strip .vote-btn,
.week-card .vote-strip .vote-score,
.explore-card .vote-strip .vote-btn,
.explore-card .vote-strip .vote-score,
.item-top-hero .vote-strip .vote-btn,
.item-top-hero .vote-strip .vote-score{
  width:20px !important;
  height:20px !important;
  min-width:20px !important;
  min-height:20px !important;
  border-radius:7px !important;
  font-size:11px !important;
  line-height:1 !important;
}
.week-card .vote-strip .vote-label,
.explore-card .vote-strip .vote-label,
.item-top-hero .vote-strip .vote-label{
  display:none !important;
}



/* 2026-02-19: compact thumb vote controls on card tops */
.week-card .vote-strip,
.explore-card .vote-strip,
.item-top-hero .vote-strip{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:4px !important;
  border-right:0 !important;
  padding:0 !important;
  margin-top:2px !important;
  align-self:flex-start !important;
  min-height:20px !important;
}
.week-card .vote-strip .vote-btn,
.explore-card .vote-strip .vote-btn,
.item-top-hero .vote-strip .vote-btn{
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  border-radius:6px !important;
  padding:0 !important;
  line-height:1 !important;
}
.week-card .vote-strip .vote-score,
.explore-card .vote-strip .vote-score,
.item-top-hero .vote-strip .vote-score{
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  border-radius:6px !important;
  font-size:10px !important;
  line-height:1 !important;
}
.week-card .vote-strip .vote-icon,
.explore-card .vote-strip .vote-icon,
.item-top-hero .vote-strip .vote-icon{
  width:10px !important;
  height:10px !important;
  display:block !important;
}
.week-card .vote-strip .vote-label,
.explore-card .vote-strip .vote-label,
.item-top-hero .vote-strip .vote-label{
  display:none !important;
}

/* 2026-02-19: vote strip vertical tight stack (thumb, score, thumb) */
.week-card .vote-strip,
.explore-card .vote-strip,
.item-top-hero .vote-strip{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:0 !important;
  padding:0 !important;
  margin:0 !important;
  border-right:0 !important;
  min-height:auto !important;
}
.week-card .vote-strip .vote-btn,
.week-card .vote-strip .vote-score,
.explore-card .vote-strip .vote-btn,
.explore-card .vote-strip .vote-score,
.item-top-hero .vote-strip .vote-btn,
.item-top-hero .vote-strip .vote-score{
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  margin:0 !important;
  padding:0 !important;
}

/* BEGIN NO VIDEO BACKDROP OVERRIDE */
:root {
  --bg: #000000 !important;
}

html,
body,
.wrap,
.topbar,
.topbar-shell {
  background: #000000 !important;
  background-image: none !important;
}

.ia-cinema-backdrop,
.ia-cinema-video,
.ia-cinema-backdrop.is-active {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
/* END NO VIDEO BACKDROP OVERRIDE */


/* BEGIN ITEM ALIAS LOOKUP OVERRIDE */
.item-aliases-block{
  margin:.44rem 0 .28rem;
  display:flex;
  flex-direction:column;
  gap:.38rem;
}
.item-alias-title{
  margin:0;
  font-size:.8rem;
  color:var(--text-dim);
}
.alias-chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem;
}
.alias-badge{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--border);
  border-radius:999px;
  padding:.14rem .48rem;
  font-size:.74rem;
  line-height:1.2;
  color:var(--text);
  background:rgba(255,255,255,.04);
}
.item-alias-form{
  display:flex;
  gap:.4rem;
  align-items:center;
  flex-wrap:wrap;
}
.item-alias-input{
  min-width:220px;
  max-width:360px;
  width:100%;
  border:1px solid var(--border);
  border-radius:9px;
  background:rgba(255,255,255,.02);
  color:var(--text);
  padding:.34rem .55rem;
  font:inherit;
}
.item-alias-input::placeholder{color:var(--text-dim);}
.item-alias-hint{
  color:var(--text-dim);
  font-size:.76rem;
  line-height:1.3;
}
.alias-match-sub{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.3rem;
}
.alias-match-sub .alias-badge{
  font-size:.68rem;
  padding:.1rem .4rem;
}
/* END ITEM ALIAS LOOKUP OVERRIDE */


/* BEGIN TRACK ALIAS LOOKUP OVERRIDE */
.track-alias-wrap .track-alias-btn{
  min-width:52px;
}
.track-alias-popover{
  min-width:250px;
  max-width:min(420px, 92vw);
}
.track-alias-popover .alias-chip-list{
  margin-bottom:.35rem;
}
/* END TRACK ALIAS LOOKUP OVERRIDE */


/* BEGIN TRACK ALIAS VISIBILITY HOTFIX */
.btn-track-alias-action{
  min-height:30px;
  min-width:56px;
  padding:.12rem .48rem;
  font-size:.72rem;
  border-radius:999px;
  border:1px solid rgba(111,201,160,.55);
  background:rgba(37,84,70,.35);
  color:#d8f3e5;
  opacity:1 !important;
}
.btn-track-alias-action:hover,
.btn-track-alias-action:focus-visible{
  border-color:rgba(134,239,172,.75);
  background:rgba(41,101,75,.45);
  color:#ecfff4;
}
/* END TRACK ALIAS VISIBILITY HOTFIX */


/* BEGIN TRACK ALIAS DIRECT CLICK HOTFIX */
.track-alias-action-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
}
.track-alias-action-wrap .track-alias-popover{
  right:0;
  top:calc(100% + .35rem);
}
.track-alias-action-wrap .btn-track-alias-action{
  pointer-events:auto !important;
  position:relative;
  z-index:2;
}
/* END TRACK ALIAS DIRECT CLICK HOTFIX */

/* BEGIN TRACK TRIM MARKERS OVERRIDE */
.track-trim-action-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
}
.btn-track-trim-action,
.btn-track-full-action{
  min-height:30px;
  min-width:54px;
  padding:.12rem .48rem;
  font-size:.72rem;
  border-radius:999px;
  opacity:1 !important;
}
.btn-track-trim-action{
  border:1px solid rgba(125,155,230,.55);
  background:rgba(48,62,102,.34);
  color:#e6edff;
}
.btn-track-trim-action:hover,
.btn-track-trim-action:focus-visible{
  border-color:rgba(166,188,255,.78);
  background:rgba(58,78,132,.45);
  color:#f2f6ff;
}
.btn-track-full-action{
  border:1px solid rgba(155,155,155,.45);
  background:rgba(80,80,80,.26);
  color:#e5e5e5;
}
.btn-track-full-action:hover,
.btn-track-full-action:focus-visible{
  border-color:rgba(225,225,225,.72);
  background:rgba(116,116,116,.36);
  color:#ffffff;
}
.btn-track-full-action.active{
  border-color:rgba(120,220,160,.82);
  background:rgba(40,120,80,.52);
  color:#ebfff1;
}
.track-trim-popover{
  min-width:290px;
  max-width:min(430px,92vw);
  right:0;
  top:calc(100% + .35rem);
}
.track-trim-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.42rem;
  margin-top:.2rem;
}
.track-trim-label{
  display:flex;
  flex-direction:column;
  gap:.2rem;
  font-size:.72rem;
  color:var(--text-dim);
}
.track-trim-actions{
  grid-column:1 / -1;
  display:flex;
  gap:.42rem;
  flex-wrap:wrap;
}
.track-trim-actions .btn{
  min-width:78px;
}
/* END TRACK TRIM MARKERS OVERRIDE */



/* BEGIN NON-MUSIC HIDDEN BADGE */
.track-hidden-reason{
  display:inline-flex;
  align-items:center;
  margin-left:.38rem;
  padding:.08rem .42rem;
  border-radius:999px;
  border:1px solid rgba(240,205,130,.52);
  background:rgba(122,93,30,.28);
  color:#f5ddb1;
  font-size:.66rem;
  line-height:1.2;
  vertical-align:middle;
}
/* END NON-MUSIC HIDDEN BADGE */


/* BEGIN LOVED LIST MATCH MOST-PLAYED */
.most-played-list-shell{
  margin:0 0 .9rem;
}
.most-played-like-rows .week-card:last-child{
  margin-bottom:0 !important;
}
/* END LOVED LIST MATCH MOST-PLAYED */


/* IN-20260222 atlas active exact override */
html[data-fcc-v2-theme-preset="atlas"] .ecosystem-nav .active {
  outline: 1px solid #6e6e6e !important;
  outline-color: #6e6e6e !important;
  background-color: #1f222d !important;
  background-image: none !important;
  border-color: #6e6e6e !important;
  box-shadow: none !important;
}

/* IN-20260222 forest active exact override */
html[data-fcc-v2-theme-preset="forest"] .ecosystem-nav .active {
  outline: 1px solid #415f49 !important;
  outline-color: #415f49 !important;
  background-color: #1b2a21 !important;
  background-image: none !important;
  border-color: #415f49 !important;
  box-shadow: none !important;
}


/* IN-20260222 black active uses forest colors */
html[data-fcc-v2-theme-preset="black"] .ecosystem-nav .active {
  outline: 1px solid #415f49 !important;
  outline-color: #415f49 !important;
  background-color: #1b2a21 !important;
  background-image: none !important;
  border-color: #415f49 !important;
  box-shadow: none !important;
}

/* MUSIC MOBILE NAV CANONICAL V1 */
@media (max-width: 900px) {
  .site-header,
  .topbar,
  .topbar-content,
  .fcc-econav-plane,
  .fcc-econav-hamburger {
    overflow: visible !important;
  }

  .fcc-econav-toggle-wrap,
  .fcc-econav-hamburger .fcc-econav-toggle-wrap {
    display: flex !important;
    pointer-events: auto !important;
    z-index: 20050 !important;
  }

  .fcc-econav-hamburger nav.ecosystem-nav[data-fcc-econav] {
    display: none !important;
    position: absolute !important;
    right: 0 !important;
    top: calc(100% + 0.35rem) !important;
    z-index: 20060 !important;
    pointer-events: auto !important;
  }

  .fcc-econav-hamburger.fcc-econav-open nav.ecosystem-nav[data-fcc-econav] {
    display: flex !important;
  }
}
/* END MUSIC MOBILE NAV CANONICAL V1 */

/* MUSIC HAMBURGER TOP LAYER V2 */
@media (max-width: 900px) {
  body > .site-header,
  .site-header,
  .topbar,
  .topbar-shell {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 60000 !important;
    isolation: isolate !important;
    overflow: visible !important;
  }

  .topbar .topbar-content,
  .topbar .topbar-content.fcc-econav-hamburger,
  .fcc-econav-plane,
  .fcc-econav-hamburger {
    position: relative !important;
    z-index: 60020 !important;
    overflow: visible !important;
  }

  .fcc-econav-hamburger .fcc-econav-toggle-wrap,
  .fcc-econav-hamburger .fcc-econav-toggle {
    position: relative !important;
    z-index: 60040 !important;
    pointer-events: auto !important;
  }

  .fcc-econav-hamburger nav.ecosystem-nav[data-fcc-econav] {
    position: fixed !important;
    right: 0.55rem !important;
    top: calc(var(--topbar-offset, 56px) + 0.2rem) !important;
    z-index: 60060 !important;
    max-height: calc(100vh - var(--topbar-offset, 56px) - 0.8rem) !important;
    overflow-y: auto !important;
    pointer-events: auto !important;
  }

  .fcc-econav-hamburger:not(.fcc-econav-open) nav.ecosystem-nav[data-fcc-econav] {
    display: none !important;
  }

  .fcc-econav-hamburger.fcc-econav-open nav.ecosystem-nav[data-fcc-econav] {
    display: flex !important;
  }
}
/* END MUSIC HAMBURGER TOP LAYER V2 */

/* MUSIC COMMUNITY NAV BELOW HEADER V1 */
@media (max-width: 900px) {
  .community-nav-shell,
  .community-view-tabs-global {
    position: relative !important;
    z-index: 120 !important;
  }

  .community-view-tabs-global {
    margin: 0.35rem 0 0.55rem !important;
  }

  .community-nav-shell {
    margin-top: 0.2rem !important;
    padding-top: 0 !important;
  }
}
/* END MUSIC COMMUNITY NAV BELOW HEADER V1 */