/* ===========================================================================
   問題集 — assets/music/study-music.css
   マイページの「勉強中の曲」（2026-10-19 区間16 SOUND2・関所P Q14・Q5）。切り替えは study-music.js。
   音楽を聴くドパガキくん（scene/pose-music-v1.webp）は切り替えの左に小さく（字・押す所に重ねない）。
   色はマイページ（screens.css）の言葉（--scr-*）のまま。動きは付けない（切り替えの丸の移動だけ。動きを減らす設定では移動もしない）。
   =========================================================================== */
.dpg-music .dpg-music__row{display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:14px}
.dpg-music .dpg-music__pose{display:block;width:64px;height:64px;border-radius:16px;background:var(--scr-accent-soft,#f3edff);object-fit:contain}
.dpg-music .dpg-music__text{margin:0;font-size:14px;line-height:1.65;color:var(--scr-muted,#65594d)}
.dpg-music .dpg-music__toggle{display:inline-flex;align-items:center;gap:8px;min-width:96px;min-height:44px;margin:0;padding:0 12px 0 6px;border:1px solid var(--scr-line-strong,#e5cdb8);border-radius:999px;background:#fff;color:var(--scr-text,#292622);font:inherit;font-size:14px;font-weight:800;cursor:pointer;width:auto}
.dpg-music .dpg-music__knob{position:relative;flex:none;width:44px;height:28px;border-radius:999px;background:#d8cfc6;transition:background .2s}
.dpg-music .dpg-music__knob::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgb(0 0 0 / 25%);transition:transform .2s}
.dpg-music .dpg-music__toggle[aria-checked="true"]{border-color:var(--scr-accent-line,#dccdf6);color:var(--scr-accent-ink,#4f22a0)}
.dpg-music .dpg-music__toggle[aria-checked="true"] .dpg-music__knob{background:var(--scr-accent,#6535b5)}
.dpg-music .dpg-music__toggle[aria-checked="true"] .dpg-music__knob::after{transform:translateX(16px)}
.dpg-music .dpg-music__toggle:focus-visible{outline:3px solid var(--scr-accent,#6535b5);outline-offset:3px}
@media(max-width:420px){.dpg-music .dpg-music__row{grid-template-columns:52px minmax(0,1fr);row-gap:10px}.dpg-music .dpg-music__pose{width:52px;height:52px}.dpg-music .dpg-music__toggle{grid-column:1/-1;justify-self:start}}
@media(max-width:300px){.dpg-music .dpg-music__row{grid-template-columns:minmax(0,1fr)}.dpg-music .dpg-music__pose{display:none}}
@media(prefers-reduced-motion:reduce){.dpg-music .dpg-music__knob,.dpg-music .dpg-music__knob::after{transition:none}}
