/* ===========================================================================
   ドパガキ問題集 — assets/dpg-t-pages.css
   2026-10-29 T7 担当D4b「ページの整え」（★の案を1つずつ・本人だけに見える形）。どの規則も、札がある時だけ JS が付ける class の下だけに当たる
   （札が無い時は今の画面と1画素も変わらない）。色・角丸・余白は各ページの今の値（トークン）だけ。新しい色は作らない。
     勉強計画 D-1  't-plan-empty'   … .t7-line（dpg-plan-view.js）
     ランキング K-1 't-rank-login'   … .t7-rank-top・.t7-signin・.t7-seat（dpg-rank-view.js）
     合格体験記 G-1 't-story-search' … .t7-g1（dpg-story-view.js）
     勉強ログ L-1  't-log-shoot'    … .t7-l1（log-studying-now.js）
     マイページ M-1 't-mypage-music' … .t7-m1（dpg-t-pages.js）
   =========================================================================== */

/* ---------- 勉強計画 D-1: 記録がまだ無い時の2枚を、それぞれ1行に（見出し＋右に［問題集を選んで解く］／見出し＋「まずは1問から」） ---------- */
main.dpl .dpl-panel.t7-line{padding-top:12px;padding-bottom:12px}
main.dpl .t7-line__row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
main.dpl .t7-line .dpl-panel__head{flex:1 1 150px;min-width:0;margin:0}
main.dpl .t7-line .dpl-panel__head h2{line-height:1.45}
main.dpl .t7-line .t7-line__row > .dpl-btn{flex:0 1 auto;max-width:100%;margin-left:auto;white-space:normal;text-align:center}
main.dpl .t7-line .t7-line__say{margin:0;color:var(--pl-ink-2);font-size:var(--g-fs-small,14px);font-weight:800;line-height:1.5}
main.dpl .dpl-panel__head.t7-line__row{flex-wrap:wrap}
@media (max-width:359px){main.dpl .t7-line .t7-line__row > .dpl-btn{flex:1 1 100%}}

/* ---------- ランキング K-1: いちばん上の「ログインすると参加できます」（金の［ログインへ］1つ）。中のカードの席は押せない形 ---------- */
.drk .t7-rank-top{margin-top:12px}
.drk .t7-rank-top[hidden]{display:none}
.drk .t7-signin{margin-top:0}
.drk .t7-signin .drk-signin-s{margin-bottom:12px}
.drk .t7-signin .drk-btn--go{width:100%;min-height:48px;font-size:16px}
.drk .t7-seat,.drk .t7-seat:hover{background:var(--panel);cursor:default}
@media (min-width:720px){
  .drk .t7-signin{display:flex;align-items:center;gap:20px}
  .drk .t7-signin-txt{flex:1 1 auto;min-width:0}
  .drk .t7-signin .drk-signin-s{margin-bottom:0}
  .drk .t7-signin .drk-btn--go{flex:none;width:auto;min-width:200px}
}

/* ---------- 合格体験記 G-1: 検索の欄・［試験を検索］・小さな［並び ▾］を1段に。並びは押した時だけ、検索の段のすぐ下に開く ---------- */
.dst-find.t7-g1 .dst-tune{display:none}
.dst-find.t7-g1 .dst-search{gap:6px}
.dst-find.t7-g1 .dst-search .dst-btn{padding:4px 10px}
.dst-find.t7-g1 .dst-search .dst-tune__btn{display:inline-flex;flex:none;min-height:48px;gap:6px;padding:4px 8px}
/* 直し係F（G-1 の小1）: ［並び ▾］の中を2段に。上「並び ▾」（今の大きさ）・下に小さく今の並び。高さは同じ・幅は 66→70px */
.dst-find.t7-g1 .dst-search .dst-tune__btn.t7-g1-two{flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1.25}
.dst-find.t7-g1 .t7-g1-top{display:inline-flex;align-items:center;gap:6px}
.dst-find.t7-g1 .t7-g1-now{font-size:12px;font-weight:700;color:var(--dst-ink2);white-space:nowrap}
.dst-find.t7-g1 .dst-tune__panel{margin:8px 0 0;padding:2px 12px 12px;border:3px solid transparent;border-image:var(--dst-fr-soft) 9 fill / 9px / 0 stretch}
.dst-find.t7-g1 .dst-tune__panel:not(.is-open){display:none}
.dst-find.t7-g1 .dst-tune__panel .dst-bar__label{flex-basis:100%;margin:0 0 -2px}
@media (max-width:359px){
  .dst-find.t7-g1 .dst-search{flex-wrap:wrap}
  .dst-find.t7-g1 .dst-search__box{flex:1 1 100%}
  .dst-find.t7-g1 .dst-search .dst-btn{flex:1 1 auto}
}
@media (max-width:260px){
  .dst-find.t7-g1 .dst-tune__panel{padding-left:8px;padding-right:8px}
}

/* ---------- 勉強ログ L-1: 誰もいない時の「いま勉強中」を1行に（見出し｜いまは誰もいません） ---------- */
.sl-now.t7-l1{display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;padding-bottom:10px}
.sl-now.t7-l1 .sl-now__top{flex:none}
.sl-now.t7-l1 .sl-now__empty{flex:1 1 auto;margin:0;justify-content:flex-end}

/* ---------- マイページ M-1: 勉強中の曲をメニューと同じ1行に（絵＋名前 ▾＋右にオン・オフ）。説明は行を押すと下に出る ---------- */
html:not([data-account-context="log"]) body[data-site-page="account"] .dpg-scr section.dpg-scr__card.t7-m1{padding-top:var(--g-s1);padding-bottom:var(--g-s1)}
.dpg-music.t7-m1 .dpg-music__row{grid-template-columns:minmax(0,1fr) auto;gap:var(--g-s1)}
.dpg-music.t7-m1 h2{margin:0;font-size:inherit;line-height:inherit}
.dpg-music.t7-m1 .t7-m1__row{display:flex;align-items:center;justify-content:flex-start;gap:var(--g-s2);width:100%;min-height:64px;margin:0;padding:var(--g-s1) 0;border:0;border-radius:0;background:transparent;
  color:var(--g-ink);font:inherit;font-size:var(--g-fs-body);font-weight:800;line-height:1.4;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.dpg-music.t7-m1 .t7-m1__row:hover{color:var(--g-accent)}
.dpg-music.t7-m1 .t7-m1__row:focus-visible{outline:3px solid var(--g-accent);outline-offset:2px;border-radius:8px}
.dpg-music.t7-m1 .dpg-music__pose{flex:none;width:48px;height:48px;border-radius:14px}
.dpg-music.t7-m1 .t7-m1__name{min-width:0}
.dpg-music.t7-m1 .t7-m1__caret{flex:none;width:8px;height:8px;margin:-4px 0 0 2px;border-right:2.5px solid var(--g-accent);border-bottom:2.5px solid var(--g-accent);transform:rotate(45deg)}
.dpg-music.t7-m1 .t7-m1__row[aria-expanded="true"] .t7-m1__caret{margin-top:4px;transform:rotate(-135deg)}
.dpg-music.t7-m1 .dpg-music__toggle{grid-column:auto;justify-self:end}
.dpg-music.t7-m1 > .dpg-music__text{margin:0 0 var(--g-s1);padding-top:var(--g-s1);border-top:1px solid var(--g-line)}
@media (max-width:300px){
  .dpg-music.t7-m1 .dpg-music__row{grid-template-columns:minmax(0,1fr);row-gap:0}
  .dpg-music.t7-m1 .t7-m1__row{gap:var(--g-s1)}
  .dpg-music.t7-m1 .dpg-music__toggle{justify-self:start;margin-bottom:var(--g-s1)}
}