body[data-page="song-game"],
body[data-page="song-game"] main,
body[data-page="song-game"] footer,
body[data-page="song-game"] .side-drawer { user-select:text; }
body[data-page="song-game"] button,
body[data-page="song-game"] .parameters-panel { user-select:none; }

.parameters-main {
  position:relative;
  z-index:1;
  flex:0 0 auto;
  min-height:0;
  padding:1.15rem 1rem .7rem;
}
.parameters-page { width:min(1080px,100%); margin:0 auto; }
.parameters-page .xp-bar-container { margin:0 auto .9rem; }
.parameters-heading { margin:0 0 .85rem; text-align:center; }
.parameters-heading h1 {
  margin:0;
  color:var(--text-bright,#fff);
  font-family:var(--font-heading,"Teko"),sans-serif;
  font-size:clamp(2.35rem,5vw,3.35rem);
  font-weight:600;
  line-height:1;
  letter-spacing:.02em;
}
.parameters-heading .steam-page-intro {
  display:block;
  max-width:760px;
  margin:.42rem auto 0;
  color:#a9b1c7;
  font-size:clamp(.84rem,1.6vw,.94rem);
  line-height:1.55;
  text-wrap:balance;
  -webkit-user-select:text;
  user-select:text;
}


.parameters-panel {
  position:relative;
  overflow:visible;
  min-height:0;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

.parameters-reset--floating {
  position:absolute;
  top:0;
  right:0;
  z-index:14;
  margin:0;
  background:rgba(13,17,36,.92);
  box-shadow:0 9px 24px rgba(0,0,0,.28);
}

[dir="rtl"] .parameters-reset--floating {
  right:auto;
  left:0;
}

.parameters-form input,
.parameters-form textarea {
  -webkit-user-select:text;
  user-select:text;
}
.parameters-statbar {
  display:flex;
  width:max-content;
  max-width:100%;
  min-height:48px;
  align-items:stretch;
  margin:0 0 .65rem auto;
  overflow:hidden;
  border:1px solid rgba(244,114,182,.2);
  border-radius:13px;
  background:rgba(8,10,27,.72);
  box-shadow:0 12px 32px rgba(0,0,0,.18);
  backdrop-filter:blur(12px);
}
.parameters-stat {
  display:flex;
  min-width:118px;
  flex-direction:column;
  justify-content:center;
  gap:.08rem;
  padding:.42rem .9rem;
  border-right:1px solid rgba(244,114,182,.14);
}
.parameters-stat span {
  color:var(--text-muted,#94a3b8);
  font-size:.55rem;
  font-weight:800;
  letter-spacing:.13em;
}
.parameters-stat strong {
  color:var(--text-bright,#fff);
  font:700 .96rem var(--font-main,"Outfit"),sans-serif;
}
.parameters-reset {
  align-self:center;
  width:36px;
  height:36px;
  margin:0 .42rem;
  border:1px solid rgba(244,114,182,.2);
  border-radius:10px;
  color:#b9b4ce;
  background:rgba(244,114,182,.06);
  cursor:pointer;
}
.parameters-reset:hover {
  border-color:rgba(244,114,182,.5);
  color:var(--primary,#f472b6);
  background:rgba(244,114,182,.13);
}

.parameters-state {
  min-height:310px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:2rem;
  text-align:center;
}
.parameters-state[hidden],
[hidden] { display:none !important; }
.parameters-state p { color:var(--text-muted,#94a3b8); }
.parameters-loader { display:flex; height:38px; align-items:center; gap:.45rem; }
.parameters-loader i {
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--primary,#f472b6);
  animation:parameterBounce 1s infinite ease-in-out;
}
.parameters-loader i:nth-child(2){animation-delay:.13s}
.parameters-loader i:nth-child(3){animation-delay:.26s}
@keyframes parameterBounce {
  0%,60%,100%{transform:translateY(0);opacity:.3}
  30%{transform:translateY(-10px);opacity:1}
}
.parameters-error-icon {
  display:grid;
  width:48px;
  height:48px;
  place-items:center;
  border:1px solid rgba(248,113,113,.45);
  border-radius:50%;
  color:#f87171;
}

.parameters-game { padding:0; }
.parameters-form { position:relative; z-index:10; margin:0 0 .55rem; padding-inline-end:2.85rem; }
.parameters-form label {
  display:block;
  margin:0 0 .42rem .12rem;
  color:#b9a7ff;
  font-size:.61rem;
  font-weight:800;
  letter-spacing:.14em;
}
.parameters-search-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.55rem;
}
.parameters-search-field { position:relative; min-width:0; }
.parameters-search-field input {
  width:100%;
  height:58px;
  padding:0 1.15rem;
  border:1px solid rgba(244,114,182,.42);
  border-radius:16px;
  outline:0;
  color:var(--text-bright,#fff);
  background:linear-gradient(135deg,rgba(10,12,34,.99),rgba(18,20,52,.96));
  box-shadow:0 18px 42px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.035);
  font:500 .9rem var(--font-main,"Outfit"),sans-serif;
}
.parameters-search-field input::placeholder { color:#77758d; }
.parameters-search-field input:focus {
  border-color:var(--primary,#f472b6);
  box-shadow:0 0 0 3px rgba(244,114,182,.11),0 18px 40px rgba(0,0,0,.28);
}
.parameters-search-row .glow-btn {
  min-width:132px;
  min-height:58px;
  border-radius:15px;
  background:linear-gradient(135deg,#ec4899,#a21caf);
  box-shadow:0 12px 30px rgba(94,66,190,.25);
}
.parameters-search-results {
  position:absolute;
  top:calc(100% + .4rem);
  right:0;
  left:0;
  z-index:30;
  overflow:hidden auto;
  max-height:320px;
  padding:.35rem;
  border:1px solid rgba(244,114,182,.3);
  border-radius:14px;
  background:rgba(8,9,25,.98);
  box-shadow:0 22px 55px rgba(0,0,0,.55);
}
.parameters-search-option {
  display:flex;
  width:100%;
  align-items:center;
  gap:.72rem;
  padding:.52rem;
  border:0;
  border-radius:9px;
  color:var(--text-main,#e2e8f0);
  background:transparent;
  cursor:pointer;
  font:600 .8rem var(--font-main,"Outfit"),sans-serif;
  text-align:left;
}
.parameters-search-option img {
  width:82px;
  aspect-ratio:184/69;
  flex:0 0 auto;
  border-radius:6px;
  object-fit:contain;
  background:#050713;
}
.parameters-search-option:hover,
.parameters-search-option.active { background:rgba(244,114,182,.12); }
.parameters-search-status {
  padding:.85rem;
  color:var(--text-muted,#94a3b8);
  font-size:.76rem;
  text-align:center;
}
.parameters-message {
  min-height:1.1rem;
  margin:.32rem .15rem 0;
  color:var(--text-muted,#94a3b8);
  font-size:.7rem;
}
.parameters-message.error { color:#fb7185; }
.parameters-secondary-actions {
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.45rem;
  margin:.1rem .1rem .55rem;
}
.parameters-hint-button,
.parameters-give-up {
  display:flex;
  min-height:36px;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  padding:.48rem .72rem;
  border-radius:9px;
  cursor:pointer;
  font:700 .68rem var(--font-main,"Outfit"),sans-serif;
  transition:border-color .15s,color .15s,background .15s,transform .15s;
}
.parameters-hint-button {
  border:1px solid rgba(244,114,182,.32);
  color:#f9a8d4;
  background:rgba(109,40,217,.1);
}
.parameters-give-up {
  border:1px solid rgba(251,113,133,.3);
  color:#fda4af;
  background:rgba(127,29,29,.11);
}
.parameters-hint-button[hidden],
.parameters-give-up[hidden] { display:none; }
.parameters-hint-button:hover:not(:disabled) {
  border-color:rgba(244,114,182,.62);
  color:#f5f3ff;
  background:rgba(109,40,217,.17);
  transform:translateY(-1px);
}
.parameters-give-up:hover:not(:disabled) {
  border-color:rgba(251,113,133,.58);
  color:#ffe4e6;
  background:rgba(190,24,93,.15);
  transform:translateY(-1px);
}
.parameters-hint-button:disabled,
.parameters-give-up:disabled { cursor:wait; opacity:.65; }
.parameters-review-hint {
  margin:.15rem 0 .7rem;
  padding:.8rem .9rem;
  border:1px solid rgba(244,114,182,.34);
  border-radius:13px;
  background:linear-gradient(145deg,rgba(33,29,75,.76),rgba(11,14,36,.92));
  box-shadow:0 12px 28px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.025);
}
.parameters-review-hint[hidden] { display:none; }
.parameters-review-hint-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;
}
.parameters-review-hint-head strong {
  color:#ddd6fe;
  font-size:.72rem;
  letter-spacing:.04em;
}
.parameters-review-hint-head span {
  flex:0 0 auto;
  padding:.22rem .42rem;
  border-radius:6px;
  font-size:.52rem;
  font-weight:800;
  text-transform:uppercase;
}
.parameters-review-hint-head span.positive { color:#86efac; background:rgba(34,197,94,.13); }
.parameters-review-hint-head span.negative { color:#fda4af; background:rgba(244,63,94,.13); }
.parameters-review-hint p {
  margin:.58rem 0 .3rem;
  color:#f4f1ff;
  font-size:.78rem;
  line-height:1.55;
}
.parameters-review-hint small { color:#89859f; font-size:.61rem; }
.parameters-directions {
  margin:.05rem .15rem .7rem;
  color:#7d7a91;
  font-size:.66rem;
  text-align:right;
}
.parameters-table-head { display:none; }
.parameters-rows { display:grid; gap:.72rem; }

.parameter-row {
  display:grid;
  grid-template-columns:210px minmax(0,1fr);
  gap:.65rem;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  animation:parameterRowIn .24s ease;
}
@keyframes parameterRowIn {
  from{opacity:0;transform:translateY(-8px)}
}
.parameter-title {
  display:grid;
  min-width:0;
  grid-template-rows:34px minmax(0,1fr);
  gap:.4rem;
}
.parameter-title-media {
  position:relative;
  display:grid;
  width:100%;
  min-height:158px;
  aspect-ratio:auto;
  place-items:center;
  overflow:hidden;
  border:1px solid rgba(244,114,182,.3);
  border-radius:12px;
  background:radial-gradient(circle at 50% 25%,rgba(162,28,175,.34),rgba(3,5,17,.96));
  box-shadow:0 12px 28px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.025);
}
.parameter-title-media::before {
  content:"";
  position:absolute;
  inset:-14px;
  background-image:var(--parameter-image);
  background-position:center;
  background-size:cover;
  filter:blur(15px) brightness(.36) saturate(.9);
  opacity:.78;
  transform:scale(1.05);
}
.parameter-title-media img {
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  padding:.28rem;
  object-fit:contain;
}
.parameter-title-media.image-missing::after {
  content:"SONG";
  color:#77718f;
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.18em;
}
.parameter-title-copy {
  display:flex;
  min-width:0;
  align-items:center;
  gap:.55rem;
  padding:.35rem .55rem;
  overflow:hidden;
  border:1px solid rgba(244,114,182,.24);
  border-radius:9px;
  background:linear-gradient(135deg,rgba(24,27,65,.95),rgba(11,14,36,.98));
  box-shadow:0 8px 20px rgba(0,0,0,.2);
}
.parameter-attempt-badge {
  display:grid;
  min-width:30px;
  height:26px;
  place-items:center;
  border:1px solid rgba(244,114,182,.25);
  border-radius:8px;
  color:#f9a8d4;
  background:rgba(244,114,182,.08);
  font-size:.62rem;
  font-weight:800;
}
.parameter-title strong {
  min-width:0;
  overflow:hidden;
  color:var(--text-bright,#fff);
  font:700 .8rem/1.3 var(--font-main,"Outfit"),sans-serif;
  text-overflow:ellipsis;
}
.parameter-comparison-grid {
  display:grid;
  min-width:0;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.55rem;
}
.parameter-cell {
  position:relative;
  display:flex;
  min-width:0;
  min-height:92px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:.28rem;
  padding:1.35rem .85rem .72rem;
  overflow:hidden;
  border:1px solid rgba(244,114,182,.25);
  border-radius:13px;
  color:var(--text-main,#e2e8f0);
  background:linear-gradient(145deg,rgba(24,29,70,.94),rgba(12,15,42,.97));
  box-shadow:0 10px 26px rgba(0,0,0,.27),inset 0 1px rgba(255,255,255,.025);
  text-align:left;
}
.parameter-cell::before {
  content:attr(data-label);
  position:absolute;
  top:.48rem;
  left:.7rem;
  color:#817c9d;
  font-size:.52rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.parameter-cell strong {
  max-width:100%;
  overflow-wrap:anywhere;
  color:var(--text-bright,#fff);
  font:700 .82rem/1.3 var(--font-main,"Outfit"),sans-serif;
}
.parameter-cell small {
  display:flex;
  align-items:center;
  gap:.28rem;
  color:#aaa6bd;
  font-size:.59rem;
  line-height:1.2;
}
.parameter-cell small i { color:#f9a8d4; }
.parameter-cell.status-match {
  border-color:rgba(74,222,128,.46);
  background:linear-gradient(145deg,rgba(26,82,65,.42),rgba(12,39,38,.52));
}
.parameter-cell.status-partial {
  border-color:rgba(251,191,36,.42);
  background:linear-gradient(145deg,rgba(91,66,23,.38),rgba(44,34,22,.5));
}
.parameter-cell.status-miss {
  border-color:rgba(139,113,225,.3);
  background:linear-gradient(145deg,rgba(27,32,78,.94),rgba(12,15,43,.97));
}
.parameter-tags {
  display:flex;
  max-width:100%;
  flex-wrap:wrap;
  gap:.25rem;
}
.parameter-tags span {
  padding:.22rem .38rem;
  border-radius:6px;
  color:#aaa6bd;
  background:rgba(255,255,255,.045);
  font-size:.58rem;
}
.parameter-tags span.match {
  color:#9bf2b8;
  background:rgba(74,222,128,.13);
}
.parameters-empty {
  padding:2rem 1rem 1rem;
  color:#67647c;
  font-size:.8rem;
  text-align:center;
}

.parameters-result {
  display:grid;
  grid-template-columns:200px minmax(0,1fr);
  gap:1rem;
  align-items:center;
  margin-top:.8rem;
  padding:.75rem;
  border:1px solid rgba(74,222,128,.36);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(18,57,52,.55),rgba(8,20,28,.75));
}
.parameters-result.no-image { grid-template-columns:1fr; }
.parameters-result.gave-up {
  border-color:rgba(251,113,133,.34);
  background:linear-gradient(145deg,rgba(89,25,48,.38),rgba(15,14,34,.78));
}
.parameters-result img {
  width:200px;
  aspect-ratio:460/215;
  border-radius:10px;
  object-fit:contain;
  background:#050713;
}
.steam-try-games {
  width:min(1080px,calc(100% - 2rem));
  margin:.7rem auto 0;
  text-align:center;
}
.steam-try-games > h2,
.steam-try-games > h3 {
  margin:0 0 .55rem;
  color:#f4f1ff;
  font:600 1.45rem/1 var(--font-heading,"Teko"),sans-serif;
  letter-spacing:.02em;
  text-align:center;
}
.steam-try-games-grid {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:.8rem;
}
.steam-try-game {
  display:grid;
  width:58px;
  height:58px;
  flex:0 0 58px;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:16px;
  color:#fff;
  background:linear-gradient(135deg,var(--try-g1),var(--try-g2));
  box-shadow:0 5px 16px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.26);
  text-decoration:none;
  transition:filter .16s,transform .16s,box-shadow .16s;
}
.steam-try-game:hover,
.steam-try-game:focus-visible {
  outline:2px solid rgba(255,255,255,.82);
  outline-offset:3px;
  filter:brightness(1.08);
  box-shadow:0 10px 26px var(--try-glow),inset 0 1px rgba(255,255,255,.3);
  transform:translateY(-4px) scale(1.07);
}
.steam-try-game > i {
  color:#fff;
  font-size:1.45rem;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.35));
}
.parameters-result-copy > span {
  color:#66e798;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.15em;
}
.parameters-result.gave-up .parameters-result-copy > span { color:#fda4af; }
.parameters-result-copy h2 {
  margin:.15rem 0;
  color:#fff;
  font:500 2rem/1 var(--font-heading,"Teko"),sans-serif;
}
.parameters-result-copy p {
  margin:0 0 .35rem;
  color:#aaa6bd;
  font-size:.78rem;
}
.parameters-result-copy .parameters-result-xp { color:#66e798; font-weight:700; }
.parameters-result-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; }
.parameters-result-actions a { color:#f9a8d4; font-size:.72rem; text-decoration:none; }
.parameters-disclaimer {
  margin:.9rem auto 0;
  color:#67647c;
  font-size:.66rem;
  text-align:center;
}
body[data-page="song-game"] .seo-section {
  position:relative;
  z-index:1;
  margin-top:0;
  padding:1.65rem 0 3rem;
}
body[data-page="song-game"] .seo-cards-section {
  margin-top:0;
  gap:1.1rem;
}
body[data-page="song-game"] .seo-cards-title,
body[data-page="song-game"] .seo-section-intro {
  width:100%;
  max-width:850px;
  margin-right:auto;
  margin-left:auto;
  text-align:center;
}
body[data-page="song-game"] .seo-cards-title {
  margin-top:0;
  margin-bottom:0;
  line-height:1.15;
  text-wrap:balance;
}
body[data-page="song-game"] .seo-section-intro { margin-top:0; }
body[data-page="song-game"] .seo-card--techniques { cursor:default; }
body[data-page="song-game"] .seo-card--techniques:active { transform:translateY(-4px); }
[dir="rtl"] .parameters-statbar { margin-right:auto; margin-left:0; }
[dir="rtl"] .parameters-stat { border-right:0; border-left:1px solid rgba(244,114,182,.14); }
[dir="rtl"] .parameters-search-option,
[dir="rtl"] .parameter-cell { text-align:right; }
[dir="rtl"] .parameter-cell { align-items:flex-end; }
[dir="rtl"] .parameter-tags { justify-content:flex-end; }
[dir="rtl"] .parameter-cell::before { right:.7rem; left:auto; }
[dir="rtl"] .parameters-directions { text-align:left; }

.parameters-reset:focus-visible,
.parameters-search-option:focus-visible,
.parameters-search-row .glow-btn:focus-visible,
.parameters-hint-button:focus-visible,
.parameters-give-up:focus-visible,
.parameters-result-actions button:focus-visible,
body[data-page="song-game"] #faq-toggle:focus-visible,
body[data-page="song-game"] .faq-question:focus-visible {
  outline:2px solid #f9a8d4;
  outline-offset:3px;
  box-shadow:0 0 0 5px rgba(236,72,153,.18);
}

@media(max-width:760px) {
  .parameter-row { grid-template-columns:1fr; }
  .parameter-title { grid-template-columns:1fr; grid-template-rows:34px minmax(118px,auto); }
  .parameter-title-media { min-height:118px; }
  .steam-try-games { width:calc(100% - 1.1rem); }
}
@media(max-width:560px) {
  .parameters-main { padding:.8rem .55rem 2rem; }
  .parameters-heading h1 { font-size:2.45rem; }
  .parameters-statbar { width:100%; margin-bottom:.55rem; }
  .parameters-stat { min-width:0; flex:1; padding:.4rem .62rem; }
  .parameters-search-row { grid-template-columns:1fr; }
  .parameters-search-row .glow-btn { min-height:46px; }
  .parameters-form label { margin-left:.08rem; }
  .parameter-row { gap:.5rem; }
  .parameter-title { grid-template-columns:1fr; }
  .parameter-comparison-grid { gap:.42rem; }
  .parameter-cell { min-height:86px; padding:1.3rem .62rem .62rem; }
  .parameter-cell strong { font-size:.72rem; }
  .parameter-cell::before { top:.42rem; left:.55rem; font-size:.48rem; }
  [dir="rtl"] .parameter-cell::before { right:.55rem; left:auto; }
  .parameter-tags span { font-size:.52rem; }
  .parameters-result { grid-template-columns:105px minmax(0,1fr); gap:.65rem; }
  .parameters-result img { width:105px; }
  .parameters-result-copy h2 { font-size:1.45rem; }
}
@media(max-width:390px) {
  .parameter-title { grid-template-columns:1fr; }
  .parameter-cell { min-height:82px; }
  .parameter-comparison-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(prefers-reduced-motion:reduce) {
  .parameters-loader i,
  .parameter-row { animation:none; }
  .steam-try-game { transition:none; }
}

/* ── Guess-the-Artist additions (square photos) ───────────────────────── */
.song-title-media img { object-fit: cover; border-radius: 8px; }
.song-search-art-unused { width: 38px; height: 38px; object-fit: cover; border-radius: 50%; flex-shrink: 0; }
.song-search-placeholder-old {
  width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.06); border-radius: 50%; font-size: 1rem; flex-shrink: 0;
}
.song-hint-unused img {
  display: block; margin: 0.6rem auto 0; max-width: 200px; width: 100%;
  border-radius: 14px; box-shadow: 0 10px 30px rgba(0,0,0,0.5); aspect-ratio: 1 / 1; object-fit: cover;
}
.song-result-art { object-fit: cover; border-radius: 14px; }
.parameters-result .song-result-art { width: 140px; height: auto; aspect-ratio: 1 / 1; }
@media (max-width: 560px) {
  .parameters-result .song-result-art { width: 105px; }
}

/* reset button docked next to the stat bubbles */
.parameters-statrow { display:flex; align-items:stretch; justify-content:flex-end; gap:.6rem; margin:0 0 .65rem; }
.parameters-statrow .parameters-statbar { margin:0; }
.parameters-reset--statrow {
  position:static;
  width:48px;
  min-height:48px;
  height:auto;
  margin:0;
  flex-shrink:0;
  border-radius:13px;
  background:rgba(8,10,27,.72);
  box-shadow:0 12px 32px rgba(0,0,0,.18);
  backdrop-filter:blur(12px);
  display:flex;
  align-items:center;
  justify-content:center;
}
@media (max-width:640px) {
  .parameters-statrow { width:100%; }
  .parameters-statrow .parameters-statbar { flex:1; }
}

/* ── Guess-the-Song player ─────────────────────────────────────────────── */
.song-player {
  display:flex; align-items:center; gap:.9rem;
  padding:1rem 1.1rem; margin:0 0 .7rem;
  border:1px solid rgba(244,114,182,.24); border-radius:16px;
  background:linear-gradient(135deg,rgba(10,12,34,.97),rgba(18,20,52,.94));
  box-shadow:0 18px 42px rgba(0,0,0,.3);
}
.song-play-btn {
  flex:0 0 auto; width:64px; height:64px; border:0; border-radius:50%;
  background:linear-gradient(135deg,#ec4899,#a21caf); color:#fff; font-size:1.25rem;
  cursor:pointer; box-shadow:0 12px 30px rgba(94,66,190,.35);
  display:flex; align-items:center; justify-content:center;
  transition:transform .12s, box-shadow .12s;
}
.song-play-btn:hover { transform:scale(1.05); box-shadow:0 14px 34px rgba(94,66,190,.45); }
.song-track { flex:1; min-width:0; }
.song-bar {
  position:relative; height:14px; border-radius:8px; overflow:hidden;
  background:rgba(255,255,255,.06); border:1px solid rgba(244,114,182,.18);
}
.song-unlocked {
  position:absolute; inset:0 auto 0 0; width:0;
  background:linear-gradient(90deg,rgba(244,114,182,.34),rgba(244,114,182,.5));
  transition:width .25s ease;
}
.song-tick { position:absolute; top:0; bottom:0; width:1px; background:rgba(255,255,255,.22); }
.song-playhead {
  position:absolute; top:-2px; bottom:-2px; left:0; width:2px;
  background:#fff; box-shadow:0 0 8px rgba(255,255,255,.8);
}
.song-bar-meta {
  display:flex; justify-content:space-between; margin-top:.4rem;
  color:var(--text-muted,#94a3b8); font-size:.66rem; font-weight:700; letter-spacing:.08em;
}
.song-bar-meta #song-points-label { color:#f9a8d4; }
.song-history { display:flex; flex-direction:column; gap:.34rem; margin:0 0 .6rem; }
.song-history-item {
  display:flex; align-items:center; gap:.55rem; padding:.44rem .7rem;
  border-radius:10px; font-size:.74rem; font-weight:600;
  border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03); color:#b7b3c9;
}
.song-history-item.wrong { border-color:rgba(251,113,133,.28); color:#fda4af; background:rgba(127,29,29,.1); }
.song-history-item.skip i, .song-history-item.wrong i { font-size:.7rem; opacity:.8; }
.song-search-art { width:38px; height:38px; object-fit:cover; border-radius:8px; flex-shrink:0; }
.song-search-placeholder {
  width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.06); border-radius:8px; font-size:1rem; flex-shrink:0;
}
.song-search-copy { display:flex; flex-direction:column; min-width:0; }
.song-search-copy strong { font-size:.8rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.song-search-copy small { color:var(--text-muted,#94a3b8); font-size:.66rem; }

/* ── leaderboard panel ─────────────────────────────────────────────────── */
.song-lb {
  width:min(1080px,100%); margin:1.4rem auto 0; padding:1.1rem 1.2rem 1.2rem;
  border:1px solid rgba(244,114,182,.2); border-radius:16px;
  background:rgba(8,10,27,.72); backdrop-filter:blur(12px);
  box-shadow:0 12px 32px rgba(0,0,0,.18);
}
.song-lb-head { display:flex; align-items:center; justify-content:space-between; gap:.7rem; margin-bottom:.7rem; }
.song-lb-head h2 {
  margin:0; color:var(--text-bright,#fff);
  font-family:var(--font-heading,"Teko"),sans-serif; font-size:1.55rem; font-weight:600; letter-spacing:.02em;
}
.song-lb-full { color:#f9a8d4; font-size:.74rem; font-weight:700; text-decoration:none; }
.song-lb-full:hover { color:#fff; }
.song-lb-columns, .song-lb-row {
  display:grid; grid-template-columns:3rem minmax(0,1fr) 6.5rem 5rem; gap:.5rem; align-items:center;
}
.song-lb-columns {
  padding:.3rem .6rem; color:var(--text-muted,#94a3b8);
  font-size:.58rem; font-weight:800; letter-spacing:.12em;
}
.song-lb-row {
  padding:.5rem .6rem; border-radius:10px; font-size:.8rem;
}
.song-lb-row:nth-child(odd) { background:rgba(255,255,255,.03); }
.song-lb-row .song-lb-rank { color:#f9a8d4; font-weight:800; }
.song-lb-row .song-lb-player { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.song-lb-row .song-lb-points { font-weight:700; color:var(--text-bright,#fff); text-align:right; }
.song-lb-row .song-lb-songs { color:var(--text-muted,#94a3b8); text-align:right; }
.song-lb-columns span:nth-child(3), .song-lb-columns span:nth-child(4) { text-align:right; }
.song-lb-me { margin:.6rem .2rem 0; color:#f9a8d4; font-size:.74rem; font-weight:700; }
.song-lb-empty { padding:.9rem; text-align:center; color:var(--text-muted,#94a3b8); font-size:.78rem; }
[dir="rtl"] .song-lb-row .song-lb-points, [dir="rtl"] .song-lb-row .song-lb-songs { text-align:left; }
@media (max-width:560px){
  .song-lb-columns, .song-lb-row { grid-template-columns:2.2rem minmax(0,1fr) 5rem 3.6rem; }
  .song-player { padding:.8rem; gap:.7rem; }
  .song-play-btn { width:54px; height:54px; }
}

/* ── redesigned player (v2) ────────────────────────────────────────────── */
.song-player2 {
  position:relative; overflow:hidden; margin:0 0 .75rem;
  padding:1.1rem 1.2rem 1rem;
  border:1px solid rgba(244,114,182,.26); border-radius:18px;
  background:linear-gradient(135deg,rgba(12,10,36,.97),rgba(26,16,60,.94));
  box-shadow:0 18px 42px rgba(0,0,0,.32);
}
.song-player2::before {
  content:""; position:absolute; inset:-45% -25% auto; height:130%;
  background:radial-gradient(circle at 28% 0%, rgba(244,114,182,.16), transparent 62%);
  pointer-events:none;
}
.song-player-main { position:relative; display:flex; align-items:center; gap:1.05rem; }
.song-play-btn2 {
  position:relative; flex:0 0 auto; width:76px; height:76px;
  border:0; border-radius:50%; padding:3px; cursor:pointer; color:#fff; font-size:1.28rem;
  background:conic-gradient(from 160deg,#f472b6,#ec4899,#a855f7,#f472b6);
  transition:transform .14s;
}
.song-play-btn2:hover { transform:scale(1.05); }
.song-play-btn2 .song-disc {
  display:flex; width:100%; height:100%; align-items:center; justify-content:center;
  border-radius:50%;
  background:radial-gradient(circle at 50% 50%, #241f4d 0 27%, #131029 30% 60%, #1d1840 63% 100%);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.06), 0 10px 26px rgba(0,0,0,.45);
}
.song-play-btn2.playing { animation:songPulse 1.5s ease-out infinite; }
@keyframes songPulse {
  0% { box-shadow:0 0 0 0 rgba(244,114,182,.45); }
  100% { box-shadow:0 0 0 24px rgba(244,114,182,0); }
}
.song-wave { display:flex; flex:1; min-width:0; height:76px; align-items:center; gap:2px; }
.song-wave i {
  flex:1; min-width:2px; height:var(--h);
  border-radius:2px; background:rgba(255,255,255,.1);
  transition:background .12s;
}
.song-wave i.open { background:rgba(244,114,182,.42); }
.song-wave i.lit { background:linear-gradient(180deg,#ec4899,#f472b6); }
.song-wave.playing i.lit { animation:waveBounce .85s ease-in-out infinite; animation-delay:var(--d); }
@keyframes waveBounce { 0%,100% { transform:scaleY(1); } 50% { transform:scaleY(.5); } }
.song-stages { position:relative; display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.95rem; }
.song-stage {
  flex:1; min-width:72px; display:flex; flex-direction:column; gap:.12rem;
  padding:.48rem .3rem; text-align:center;
  border:1px solid rgba(255,255,255,.09); border-radius:11px; background:rgba(255,255,255,.03);
  transition:border-color .15s, background .15s, opacity .15s;
}
.song-stage b { color:var(--text-bright,#fff); font-size:.86rem; line-height:1; }
.song-stage small { color:var(--text-muted,#94a3b8); font-size:.58rem; font-weight:800; letter-spacing:.05em; }
.song-stage.active {
  border-color:rgba(244,114,182,.7);
  background:linear-gradient(135deg,rgba(116,87,217,.3),rgba(70,51,165,.22));
  box-shadow:0 8px 22px rgba(94,66,190,.28);
}
.song-stage.active b { color:#e9d5ff; }
.song-stage.active small { color:#f9a8d4; }
.song-stage.done { opacity:.34; }
.song-stage.done b { text-decoration:line-through; }
.song-slot {
  display:flex; align-items:center; gap:.55rem; padding:.5rem .78rem;
  border:1px dashed rgba(255,255,255,.11); border-radius:10px;
  color:#6f6a85; font-size:.74rem; font-weight:600; min-height:34px;
}
.song-slot i { font-size:.66rem; opacity:.75; }
.song-slot.skip { border-style:solid; border-color:rgba(255,255,255,.13); background:rgba(255,255,255,.04); color:#b7b3c9; }
.song-slot.wrong { border-style:solid; border-color:rgba(251,113,133,.32); background:rgba(127,29,29,.12); color:#fda4af; }
.song-history { display:flex; flex-direction:column; gap:.4rem; margin:0 0 .7rem; }

/* ── your-rank strip ──────────────────────────────────────────────────── */
.song-rank { display:flex; width:min(1080px,100%); margin:1.15rem auto 0; gap:.7rem; align-items:stretch; }
.song-rank .lb-your-rank-bar { flex:1; margin:0; display:flex; align-items:center; }
.song-lb-btn {
  flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:48px; padding:.55rem 1.15rem; border-radius:13px;
  font-size:.78rem; font-weight:700; text-decoration:none;
}
@media (max-width:640px) {
  .song-player-main { gap:.75rem; }
  .song-play-btn2 { width:62px; height:62px; font-size:1.05rem; }
  .song-wave { height:58px; }
  .song-stage { min-width:56px; padding:.4rem .2rem; }
  .song-rank { flex-direction:column; }
}

/* ── polish pass (v3) ─────────────────────────────────────────────────── */
.song-player2::after {
  content:""; position:absolute; top:0; left:-65%; width:45%; height:100%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.05), transparent);
  animation:songSheen 6.5s ease-in-out infinite; pointer-events:none;
}
@keyframes songSheen { 0%, 55% { left:-65%; } 85%, 100% { left:120%; } }

/* quiet ghost button to the full leaderboard */
.song-lb-btn {
  border:1px solid rgba(244,114,182,.28);
  color:#a99fd6;
  background:rgba(244,114,182,.06);
  font-size:.72rem; font-weight:700; letter-spacing:.03em;
  transition:border-color .15s, color .15s, background .15s;
}
.song-lb-btn:hover { border-color:rgba(244,114,182,.55); color:#e9e5ff; background:rgba(244,114,182,.12); }
.song-lb-btn i { font-size:.72rem; opacity:.8; }

/* skip: a real button, not an afterthought */
.parameters-secondary-actions { margin:.15rem .05rem .6rem; }
#song-skip {
  min-height:44px; padding:.6rem 1.25rem; border-radius:12px;
  font-size:.74rem; letter-spacing:.02em;
}

/* result card: entrance, pill kicker, glowing art */
#parameters-result { animation:songResultIn .35s ease both; }
@keyframes songResultIn { from { opacity:0; transform:translateY(10px) scale(.985); } to { opacity:1; transform:none; } }
#parameters-result-kicker {
  display:inline-flex; align-items:center; gap:.4rem; width:max-content; max-width:100%;
  padding:.28rem .72rem; border-radius:999px;
  border:1px solid rgba(74,222,128,.35); background:rgba(74,222,128,.1); color:#4ade80;
  font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
}
.parameters-result.gave-up #parameters-result-kicker {
  border-color:rgba(251,113,133,.35); background:rgba(251,113,133,.1); color:#fda4af;
}
.parameters-result .song-result-art {
  box-shadow:0 18px 44px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.07);
}
.song-slot span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ── mobile pass ──────────────────────────────────────────────────────── */
@media (max-width:640px) {
  .song-player2 { padding:.85rem .85rem .8rem; border-radius:15px; }
  .song-player-main { gap:.65rem; }
  .song-play-btn2 { width:58px; height:58px; font-size:1rem; }
  .song-wave { height:52px; gap:1px; }
  .song-stages { gap:.35rem; margin-top:.7rem; }
  .song-stage { flex:1 1 30%; min-width:0; padding:.42rem .15rem; }
  .song-stage b { font-size:.8rem; }
  .song-stage small { font-size:.54rem; }
  .song-slot { padding:.44rem .65rem; font-size:.7rem; min-height:32px; }
  .parameters-secondary-actions { justify-content:stretch; }
  #song-skip { width:100%; justify-content:center; }
  .parameters-result { flex-direction:column; align-items:center; text-align:center; gap:.8rem; }
  .parameters-result .song-result-art { width:118px; }
  .parameters-result-copy { align-items:center; display:flex; flex-direction:column; }
  .parameters-result-actions { justify-content:center; }
  .song-rank { gap:.5rem; margin-top:.9rem; }
  .song-lb-btn { min-height:42px; }
}
@media (max-width:390px) {
  .song-stage b { font-size:.74rem; }
  .song-wave { height:46px; }
}

/* ── slim skip in the search row (v4) ─────────────────────────────────── */
.parameters-search-row { grid-template-columns:minmax(0,1fr) auto auto; }
#song-skip.song-skip-slim {
  width:50px; min-width:50px; min-height:58px; padding:0;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.16); border-radius:15px;
  color:#d6d0ee; background:rgba(255,255,255,.05);
  font-size:.9rem; cursor:pointer; opacity:.5;
  transition:opacity .15s, border-color .15s, background .15s;
}
#song-skip.song-skip-slim:hover:not(:disabled) {
  opacity:1; border-color:rgba(244,114,182,.5); background:rgba(244,114,182,.1);
}
#song-skip.song-skip-slim[hidden] { display:none; }
@media (max-width:640px) {
  .parameters-search-row { grid-template-columns:minmax(0,1fr) 52px; }
  .parameters-search-field { grid-column:1 / -1; }
  .parameters-search-row .glow-btn { grid-column:1; width:auto; }
  #song-skip.song-skip-slim { grid-column:2; width:auto; min-height:46px; }
}

/* ── how-to-play strip ─────────────────────────────────────────────────── */
.howto-strip { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.45rem .6rem; margin:.65rem auto 0; max-width:min(680px,100%); }
.howto-step { display:inline-flex; align-items:center; gap:.42rem; padding:.42rem .78rem; border:1px solid rgba(244,114,182,.3); border-radius:999px; background:rgba(236,72,153,.08); color:var(--text-main,#e2e8f0); font:600 .72rem/1.25 var(--font-main,"Outfit"),sans-serif; }
.howto-step > i { color:#f9a8d4; font-size:.8rem; }
.howto-chevron { color:#f9a8d4; font-size:.6rem; opacity:.55; }
[dir="rtl"] .howto-chevron { transform:scaleX(-1); }
@media (max-width:560px) { .howto-step { font-size:.66rem; padding:.36rem .62rem; } }

/* ── share result button ───────────────────────────────────────────────── */
.parameters-share { display:inline-flex; align-items:center; gap:.45rem; min-height:46px; padding:.55rem 1.1rem; border:1px solid rgba(244,114,182,.4); border-radius:12px; cursor:pointer; background:rgba(236,72,153,.1); color:#f9a8d4; font:700 .74rem var(--font-main,"Outfit"),sans-serif; letter-spacing:.04em; transition:background .15s,color .15s,transform .15s; }
.parameters-share:hover { background:rgba(236,72,153,.2); color:#fff; transform:translateY(-1px); }

/* ── personal stats strip on the result panel ──────────────────────────── */
.parameters-stats { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.35rem .95rem; margin-top:.6rem; padding-top:.55rem; border-top:1px solid rgba(255,255,255,.07); }
.parameters-stats span { color:var(--text-muted,#94a3b8); font-size:.68rem; }
.parameters-stats b { color:#fff; margin-right:.18rem; }
[dir="rtl"] .parameters-stats b { margin-right:0; margin-left:.18rem; }

/* ── sticky guess bar on mobile ────────────────────────────────────────── */
@media (max-width:760px) {
  .parameters-form { position:sticky; bottom:0; z-index:30; margin:0 -.55rem; padding:.55rem .55rem calc(.55rem + env(safe-area-inset-bottom,0px)); background:rgba(6,8,22,.94); backdrop-filter:blur(10px); border-top:1px solid rgba(255,255,255,.08); border-radius:14px 14px 0 0; }
  .parameters-search-results { top:auto; bottom:calc(100% + .3rem); max-height:38vh; z-index:31; }
}