/* ドッキング・パズル（public/widgets/dock.js、data-mode="puzzle"）だけに足す見た目（2026-10-21）。
 * 共通の dock の見た目は public/widgets/yw.css。dock.js は puzzle のとき root に dock-puzzle を付け、このファイルを自分で読みこむ。
 * - 本文 736 px：候補のボタンの名前（「形はぴったり」）が途中で折り返さないよう、操作の欄を点数の板より広くする
 * - スマホ（dock-narrow）：候補の見本を少し小さくし、名前の字を 14 px に。ランキングは canvas に重ねず、点数の板の下に HTML で出す */
.yw .dock.dock-puzzle .dock-side { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 10px 14px; }

/* スマホ：候補のボタン */
.yw .dock.dock-puzzle.dock-narrow .dock-side { grid-template-columns: minmax(0, 1fr); gap: 8px; }
.yw .dock.dock-puzzle.dock-narrow button.dock-cand { gap: 5px; font-size: 14px; }
.yw .dock.dock-puzzle.dock-narrow button.dock-cand .dock-prev { flex-basis: 52px; display: flex; align-items: center; justify-content: center; }

/* スマホ：ランキング（HTML） */
.yw .dock .dock-rank { background: #fff; border: 1.5px solid var(--ac-blue-soft); border-radius: 12px; padding: 8px 12px 6px; }
.yw .dock .dock-rank-title { font-size: 15px; font-weight: 700; color: var(--ac-navy); line-height: 1.4; margin-bottom: 4px; }
.yw .dock .dock-rank-row { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--ac-navy); padding: 3px 0; }
.yw .dock .dock-rank-row.top { color: var(--ac-rose-dark); }
.yw .dock .dock-rank-pos { flex: 0 0 auto; width: 2em; }
.yw .dock .dock-rank-key { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--ac-blue); color: #fff; font-size: 13px; font-weight: 900; line-height: 22px; text-align: center; }
.yw .dock .dock-rank-row.top .dock-rank-key { background: var(--ac-amber); }
.yw .dock .dock-rank-name { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--ac-ink); }
.yw .dock .dock-rank-bar { flex: 1 1 40px; min-width: 40px; height: 10px; border-radius: 5px; background: var(--ac-blue-soft); overflow: hidden; }
.yw .dock .dock-rank-bar i { display: block; height: 100%; border-radius: 5px; background: var(--ac-blue); }
.yw .dock .dock-rank-row.top .dock-rank-bar i { background: var(--ac-amber); }
.yw .dock .dock-rank-num { flex: 0 0 auto; min-width: 1.8em; text-align: right; font-variant-numeric: tabular-nums; }