/* The guide uses the same Tailwind stylesheet and result cards as index.php. */
html { scroll-padding-top: 24px; }
.guide-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; padding: 20px 0; border-bottom: 1px solid #e5e7eb; }
.guide-row:last-child { border-bottom: 0; padding-bottom: 0; }
.guide-output, .guide-note { min-width: 0; overflow-wrap: anywhere; }
.guide-note { border-left: 3px solid #bfdbfe; padding-left: 20px; color: #4b5563; font-size: 14px; line-height: 1.6; }
.guide-note h3 { color: #1f2937; font-size: 16px; font-weight: 600; margin-bottom: 8px; }
.guide-note p + p { margin-top: 10px; }
.guide-codes { margin-top: 10px; }
.guide-codes dt { color: #1f2937; font-weight: 600; margin-top: 10px; }
.guide-codes dd { margin: 2px 0 0; }
.guide-note dl + p { margin-top: 12px; }
.guide-questions h3 { font-size: 18px; font-weight: 600; margin: 20px 0 8px; }
.guide-questions p { color: #4b5563; max-width: 85ch; }
a:focus-visible { outline: 2px solid #2563eb; outline-offset: 4px; }
@media (max-width: 767px) {
    .guide-row { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}
@media print { .guide-row { break-inside: avoid; } }