/* デイリー問題（仕様書 4.4） */
.training-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 8px; }
.date-nav { display: flex; align-items: center; gap: 4px; background: var(--surface); box-shadow: var(--shadow-card); margin-bottom: 24px; }
.date-label { min-width: 11em; text-align: center; font-weight: 700; color: var(--ink); }
.date-nav .icon-button:disabled { opacity: 0.3; }
.training-layout { display: grid; gap: var(--gap); grid-template-columns: minmax(0, 600px) minmax(0, 1fr); align-items: start; }
.training-page #board { --cell-ratio: 1.175; }
.board-card .notice { margin: 0; }
.puzzle-tabs .tab { min-height: 48px; }
.result-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.result-actions .btn { flex: 1 1 auto; }
.result-actions .btn-text { flex: 0 0 auto; }
.answer-line { font-weight: 700; color: var(--ink); overflow-wrap: anywhere; line-height: 1.7; }
.answer-steps { padding-left: 1.4em; display: grid; gap: 4px; font-size: 14px; }
.how-to p { font-size: 14px; }

@media (max-width: 1023px) {
  .training-layout { grid-template-columns: minmax(0, 1fr); max-width: 640px; }
}
@media (max-width: 767px) {
  .training-head { margin-bottom: 0; }
  .training-head .page-lead { margin-bottom: 8px; }
  .date-nav { width: 100%; justify-content: space-between; margin-bottom: 12px; }
  .training-page #board { --cell-ratio: 1.1; }
  .training-layout { gap: 12px; }
}