.guide section[id] { scroll-margin-top: 24px; }
.guide-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 320px); gap: 28px; align-items: start; }
.guide .instruction-section h2::before { display: none; }
.guide-note { margin: 18px 0; padding: 16px 18px; border-left: 4px solid #0b5cab; border-radius: 8px; background: #eaf4ff; line-height: 1.65; overflow-wrap: anywhere; }
.guide-figure { margin: 0; overflow: hidden; border: 1px solid #b8cce3; border-radius: 14px; background: #f2f7fc; }
.guide-figure img { display: block; width: 100%; height: auto; }
.guide-figure--controller { max-width: 300px; justify-self: center; }
.guide-figure figcaption { padding: 12px 14px; color: #475467; font-size: .88rem; line-height: 1.5; }
.guide-figure--wide { margin-top: 22px; }
.guide-route { padding: 16px 18px; border: 1px solid #b8cce3; border-radius: 12px; background: #eaf4ff; }
.guide-definitions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.guide-definitions div { padding: 16px; border: 1px solid #d0d5dd; border-radius: 12px; }
.guide-definitions dt { margin-bottom: 8px; color: #0b5cab; font-weight: 800; }
.guide-definitions dd { margin: 0; line-height: 1.6; }
@media (max-width: 720px) {
  .guide-layout, .guide-definitions { grid-template-columns: 1fr; }
  .guide-figure { width: 100%; max-width: 400px; justify-self: center; }
  .guide-figure--controller { max-width: 280px; }
  .guide-figure--wide { max-width: none; }
}