/* ===========================================================================
   dpg-t-tidy.css — 区間T6 担当D4a（2026-10-29。関所5 Q8〜Q10・本人の新しい頼み「作り直しのボタンがなかった」）
   1) 整え1（t-tidy1）: 答えた直後の3つの道具（外部のAIに聞く・解説を聴く・声で質問）を1つの白い面に。views.js が札の時だけ .qz-help--one を付ける。
   2) R-1（t-result-time）: 結果の時間の3行の数字だけ太く。views.js が札の時だけ .qz-result-hero__num で包む。
   3) R-2（t-result-chara）: 置き場所と大きさは今の dpg-chara.css（.dpg-result-joy__pose）のまま。ここには何も無い。
   4) みんなの解説が読み込めなかった時の［もう一度］［作り直す］の並び（全員に効く直し。views.js の .qz-community-fail）。
   1)〜2) の規則は札の時だけ付くクラスにだけ効く（札が無い時は何も変わらない）。index.html の最後の CSS（dpg-t-intro.css）の後に読む。
   色・角丸・余白はトークン（--surface・--separator・--control-border・--accent・--text-2・--g-radius-btn・--g-s1）。新しい色は作らない。押す所は 44px 以上。
   =========================================================================== */

/* ---- 1) 整え1: 3つの枠の箱 → 1つの白い面＋細い縦線2本 ----
   面のふちは今の控えめな2つのふち（--control-border・1.5px）、区切りの線は今の区切り線（--separator）。
   主（解説を聴く。.qz-help__btn--main）は紫の太いふち・浮いた影をやめ、紫の字と絵だけ（太字のまま）。ほかの2つは今の薄い字のまま。
   名前・絵・並び・押せる高さ（48px）・プラスの札（面の上のふち）・1回無料の札・流れている間の薄紫の地・キーの札は今のまま。 */
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row {
  gap: 0;
  border: 1.5px solid var(--control-border);
  border-radius: var(--g-radius-btn);
  background: var(--surface);
}
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn {
  border: 0;
  border-radius: 0;
  background-color: transparent;
  box-shadow: none;
}
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn + .qz-help__btn { border-left: 1px solid var(--separator); }
/* 押した時の地（薄紫）が面の角からはみ出さないよう、両端のボタンだけ角を面に合わせる（面の内側＝ふちの太さの分だけ小さく） */
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn:first-child { border-radius: calc(var(--g-radius-btn) - 1.5px) 0 0 calc(var(--g-radius-btn) - 1.5px); }
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn:last-child { border-radius: 0 calc(var(--g-radius-btn) - 1.5px) calc(var(--g-radius-btn) - 1.5px) 0; }
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn:only-child { border-radius: calc(var(--g-radius-btn) - 1.5px); }
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__btn.qz-help__btn--main { color: var(--accent); font-weight: 800; }
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__btn.qz-help__btn--quiet { color: var(--text-2); }
/* 流れている間・押している間の薄紫の地（dpg-answer.css）は面の中でもそのまま */
:root .qz-app[data-screen] .qz-page--answered:has(.qz-explain-audio:is([data-state="playing"], [data-state="waiting"])) .qz-help.qz-help--one [data-role="help-audio"],
:root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__btn:is([aria-expanded="true"], [data-state="done"], [data-state="fail"]) { background-color: var(--accent-soft); }
@media (hover: hover) {
  :root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__btn:hover { background-color: var(--accent-soft); }
}
/* 段の幅が 240px 未満（200% 拡大の約 187px）で縦に積む時（dpg-answer.css の 18)）は、区切りを横の線に・角は上と下に */
@container (max-width: 239.98px) {
  :root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn + .qz-help__btn { border-left: 0; border-top: 1px solid var(--separator); }
  :root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn:first-child { border-radius: calc(var(--g-radius-btn) - 1.5px) calc(var(--g-radius-btn) - 1.5px) 0 0; }
  :root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn:last-child { border-radius: 0 0 calc(var(--g-radius-btn) - 1.5px) calc(var(--g-radius-btn) - 1.5px); }
  :root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__row > .qz-help__btn:only-child { border-radius: calc(var(--g-radius-btn) - 1.5px); }
  /* プラスの札は、縦に積んでも面の中の区切りの線の上（右端）に。今の形（dpg-t-quiz.css）はボタンの中の右端で、狭い時に「声で質問」の名前に重なっていた */
  :root .qz-app[data-screen] .qz-page--answered .qz-help.qz-help--one .qz-help__badge { top: -9px; right: 6px; transform: none; }
}

/* ---- 2) R-1: 時間の3行の数字だけ太く（字の大きさ・色・行の数は今のまま） ---- */
.qz-result .qz-result-hero__num { font-weight: 800; }

/* ---- 4) みんなの解説が読み込めなかった時: 知らせの下に［もう一度］（＋プラスの人だけ［作り直す］）を横に並べる（全員） ----
   ボタンの形は今のみんなの解説の2番手（.btn--soft。答えた後は白地に紫の枠・dpg-tabs.css）のまま。押す所は 44px 以上。 */
.qz-community .qz-community-fail { display: flex; flex-wrap: wrap; gap: var(--g-s1, 8px); margin: var(--g-s1, 8px) 0 0; }
.qz-community .qz-community-fail > .btn { min-height: 44px; padding-left: 12px; padding-right: 12px; }
.qz-community .qz-community-fail > [hidden] { display: none; }