/* Editorial-only diagrams; game layout and its accepted controls are untouched. */
.knight-guide .tour-figure { margin: 0 0 28px; }
.knight-guide .tour-diagram { display: block; width: 280px; max-width: 100%; height: 280px; margin: 0 auto; }
.tour-cell { fill: #faf4df; stroke: #b8b39d; stroke-width: 1; }
.tour-cell.visited { fill: #dedaca; }
.tour-cell.current { fill: #d8e0f8; }
.tour-cell.legal, .tour-cell.option-a, .tour-cell.exit-a { fill: #d6e7c6; }
.tour-cell.option-b, .tour-cell.exit-b { fill: #d0e6ef; }
.tour-diagram text { fill: #253f8f; font: 700 20px system-ui, sans-serif; text-anchor: middle; }
.tour-diagram .tour-axis { font-size: 13px; font-weight: 400; }
.tour-l-path { fill: none; stroke: #253f8f; stroke-width: 2; stroke-dasharray: 4 4; }
.knight-guide figcaption { font-size: 15px; line-height: 28px; margin: 0; position: relative; top: var(--page-text-baseline-shift); }
.tour-spoiler { margin: 0; }
.tour-spoiler summary { cursor: pointer; font-size: 15px; font-weight: 700; line-height: 28px; padding: 0; color: #253f8f; text-decoration: underline; text-underline-offset: 3px; }
.tour-spoiler summary:focus-visible, .tour-play-link:focus-visible { outline: 2px solid #253f8f; outline-offset: 3px; }
.tour-answer { padding-top: 28px; }
.tour-solution { width: 280px; max-width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; margin: 0 auto 28px; color: #253f8f; }
.tour-solution caption { font-size: 15px; line-height: 28px; text-align: left; font-weight: 700; }
.tour-solution th, .tour-solution td { height: 56px; padding: 0; text-align: center; font: 700 19px/28px system-ui, sans-serif; }
.tour-solution th, .tour-solution thead td { font-size: 13px; font-weight: 400; height: 28px; }
.tour-solution tbody td { background: #faf4df; box-shadow: inset 0 0 0 1px #b8b39d; }
.tour-solution tbody td.tour-endpoint { background: #d6e7c6; }
.tour-play-link { color: #253f8f; font-weight: 700; text-underline-offset: 3px; }
