.guide-header, .guide-main { width: min(1120px, calc(100% - 40px)); }
.guide-skip { position: absolute; left: 20px; top: -100px; background: var(--peach); padding: 16px; z-index: 5; }
.guide-skip:focus { top: 12px; }
.guide-intro { padding: 48px; border-radius: 32px; background: var(--mint); }
.guide-intro h1 { max-width: 720px; }
.guide-intro .meta { max-width: 720px; margin-top: 28px; color: var(--body); }
.guide-topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.guide-topics a { display: flex; align-items: center; gap: 16px; padding: 20px; border: 1px solid var(--line); border-radius: 16px; text-decoration: none; background: white; font-weight: 600; }
.guide-topics a:hover { background: var(--peach); }
.guide-topics img { flex: none; }
.guide-example-note { max-width: 700px; margin: 32px 0 0; font-size: .95rem; }
.guide-topic { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 48px; align-items: start; padding: 60px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 24px; }
.guide-instructions { max-width: 760px; }
.guide-instructions h2 { margin: 0 0 24px; }
.guide-instructions .eyebrow { line-height: 1.6; }
.guide-instructions ol { padding-left: 26px; }
.guide-instructions li { padding: 0 0 18px 10px; }
.guide-instructions li::marker { color: var(--teal); font-weight: 800; }
.guide-back { display: inline-block; margin-top: 22px; padding: 12px 0; }
.guide-screenshot { margin: 0; }
.guide-screenshot img { display: block; width: 100%; height: auto; border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 16px 36px #285f6312; }
.guide-screenshot figcaption { font-size: .85rem; line-height: 1.5; color: var(--body); padding: 12px 4px; }
.guide-support { margin: 40px 0 0; padding: 32px; border-radius: 24px; background: var(--peach); }
.guide-support h2 { margin: 0; }
@media (max-width: 760px) {
  .guide-intro { padding: 28px 22px; }
  .guide-topics { grid-template-columns: 1fr; }
  .guide-topic { grid-template-columns: 1fr; gap: 24px; padding: 40px 0; }
  .guide-screenshot { max-width: 320px; justify-self: center; }
}
@media print {
  .guide-skip, .guide-header nav, .actions, .guide-back, .guide-support { display: none; }
  .guide-topic { break-inside: avoid; }
}
