:root{--plyr-color-main:#8e5f72;--player-panel:rgba(255,252,249,.88)}
.music-box-page{padding-bottom:118px}
.music-box-intro p{max-width:780px}
.music-player-panel{margin-top:24px;padding:clamp(20px,4vw,34px);border-radius:26px}
.now-playing{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:15px}
.now-playing-label{margin:0 0 4px;color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800}
.now-playing h2{margin:0;font-size:clamp(1.65rem,4vw,2.6rem)}
.track-time-readout{flex:0 0 auto;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:700}
.plyr--audio .plyr__controls{background:rgba(255,255,255,.42);border:1px solid rgba(255,255,255,.58);border-radius:18px;padding:12px 14px;color:var(--ink)}
.plyr--full-ui input[type=range]{color:var(--accent)}
.extra-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
.player-button{appearance:none;border:1px solid rgba(255,255,255,.64);background:rgba(255,255,255,.48);color:var(--ink);border-radius:999px;min-height:42px;padding:0 14px;font:inherit;font-weight:750;cursor:pointer}
.player-button:hover,.player-button:focus-visible{background:rgba(255,255,255,.72);outline:none}
.player-button.is-active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:white}
.selected-track-note{margin-top:14px;padding:15px 17px;border-radius:16px;background:rgba(255,255,255,.36);border:1px solid rgba(255,255,255,.5)}
.selected-track-note p{margin:0}
.keyboard-help{margin-top:14px;color:var(--muted);font-size:.9rem}
kbd{display:inline-block;min-width:1.6em;padding:.12em .38em;margin:0 .08em;text-align:center;border-radius:6px;border:1px solid rgba(86,65,77,.16);background:rgba(255,255,255,.58);box-shadow:0 1px 0 rgba(86,65,77,.12);font:inherit;font-size:.84em}
.playlist-panel{margin-top:18px;padding:18px;border-radius:24px}
.playlist-header{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px}
.playlist-header h2{margin:0;font-size:1.55rem}.playlist-count{color:var(--muted);font-size:.9rem}
.playlist-scroll{max-height:390px;overflow-y:auto;padding-right:6px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(142,95,114,.5) transparent}
.playlist-track{display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;padding:11px 10px;border:0;border-bottom:1px solid rgba(86,65,77,.09);background:transparent;color:var(--ink);text-align:left;font:inherit;cursor:pointer;border-radius:12px}
.playlist-track:hover,.playlist-track:focus-visible{background:rgba(255,255,255,.44);outline:none}
.playlist-track.is-current{background:rgba(255,255,255,.65);box-shadow:inset 0 0 0 1px rgba(142,95,114,.18)}
.track-play-icon{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.54);border:1px solid rgba(255,255,255,.66);font-size:.86rem}
.track-title{min-width:0;font-weight:760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.track-duration{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.9rem}
.article-prose{margin-top:18px;padding:clamp(22px,4vw,36px);border-radius:24px}.article-prose p{max-width:820px}
.sticky-player{position:fixed;left:50%;bottom:10px;z-index:50;width:min(1120px,calc(100% - 20px));transform:translateX(-50%);padding:10px 12px;border-radius:22px;background:rgba(255,250,246,.91);border:1px solid rgba(255,255,255,.72);box-shadow:0 14px 48px rgba(58,39,50,.25);backdrop-filter:blur(18px) saturate(1.1);-webkit-backdrop-filter:blur(18px) saturate(1.1)}
.sticky-grid{display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(230px,1.4fr) auto;align-items:center;gap:12px}
.sticky-meta{min-width:0}.sticky-meta strong,.sticky-meta small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sticky-meta small{color:var(--muted);margin-top:2px}
.sticky-controls{display:flex;align-items:center;gap:5px}
.icon-button{appearance:none;width:38px;height:38px;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.5);color:var(--ink);border-radius:50%;cursor:pointer;font:inherit;font-weight:800}
.icon-button:hover,.icon-button:focus-visible{background:white;outline:none}.icon-button.main{width:44px;height:44px;color:white;border:0;background:linear-gradient(135deg,var(--accent),var(--accent-2))}.icon-button.is-active{box-shadow:inset 0 0 0 2px var(--accent)}
.sticky-progress{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:7px;min-width:0}.sticky-progress span{color:var(--muted);font-size:.78rem;font-variant-numeric:tabular-nums;text-align:center}
.sticky-progress input,.sticky-volume input{width:100%;accent-color:var(--accent)}
.sticky-volume{display:grid;grid-template-columns:25px 84px;gap:6px;align-items:center}
@media(max-width:760px){.music-box-page{padding-bottom:150px}.now-playing{align-items:flex-start;flex-direction:column;gap:4px}.sticky-player{bottom:6px;border-radius:18px}.sticky-grid{grid-template-columns:1fr auto;gap:8px 10px}.sticky-progress{grid-column:1/-1;grid-row:2}.sticky-volume{display:none}.playlist-scroll{max-height:320px}}


/* V5.2 refinements */
.controls-spoiler{
  margin-top:12px;
  border-radius:14px;
  background:rgba(255,255,255,.28);
  border:1px solid rgba(255,255,255,.46);
  overflow:hidden;
}
.controls-spoiler summary{
  cursor:pointer;
  list-style:none;
  padding:11px 14px;
  font-weight:750;
  user-select:none;
}
.controls-spoiler summary::-webkit-details-marker{display:none}
.controls-spoiler summary::after{
  content:"▾";
  float:right;
  transition:transform .18s ease;
}
.controls-spoiler[open] summary::after{transform:rotate(180deg)}
.controls-spoiler-body{padding:0 14px 12px}
.controls-spoiler .keyboard-help{margin:0}

.volume-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  color:#111;
}
.volume-icon svg{
  width:22px;
  height:22px;
  fill:currentColor;
  display:block;
}


/* V7 universal track-name parsing */
.track-name-main {
  font-weight: 780;
}

.track-name-cid {
  margin-left: .28em;
  color: rgba(69, 58, 65, .48);
  font-weight: 560;
}

.sticky-meta .track-name-main {
  font-weight: 780;
}

.sticky-meta .track-name-cid {
  color: rgba(69, 58, 65, .46);
  font-size: .92em;
}

.main-host-note {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: .88rem;
}

.playlist-error {
  padding: 18px;
  color: var(--muted);
}


/* QA: iOS safe-area + narrow-screen sticky player */
@supports (bottom: env(safe-area-inset-bottom)) {
  @media (max-width: 760px) {
    .sticky-player {
      bottom: max(6px, env(safe-area-inset-bottom));
    }
    .music-box-page {
      padding-bottom: calc(150px + env(safe-area-inset-bottom));
    }
  }
}

@media (max-width: 420px) {
  .sticky-grid {
    grid-template-columns: 1fr;
  }
  .sticky-meta {
    text-align: center;
  }
  .sticky-controls {
    justify-content: center;
  }
  .sticky-progress {
    grid-column: 1;
    grid-row: auto;
  }
}