/* Area, station and "pubs by area" pages built by scripts/build-area-pages.mjs. Uses the tokens from styles.css. */
.guide-main{width:min(100%,880px);margin:0 auto;padding:24px 16px 48px}
.guide-crumbs{margin:0 0 16px;font-size:var(--fs-caption);color:var(--text-muted)}
.guide-crumbs a{color:var(--text-muted)}
.guide-title{margin:0 0 12px;font:600 clamp(30px,6vw,48px)/1.05 var(--font-display);letter-spacing:-.015em;color:var(--text)}
.guide-answer{margin:0 0 20px;max-width:var(--br-reading-max);font-size:var(--fs-lead);line-height:1.55;color:var(--text)}
.guide-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px}
.guide-section{margin-top:32px;padding-top:16px;border-top:1px solid var(--line)}
.guide-section h2{margin:0 0 12px;font:700 22px/1.2 var(--font-body);color:var(--text)}
.guide-section p{margin:0 0 12px;color:var(--text-muted);font-size:var(--fs-meta)}
.guide-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.guide-list li{padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.guide-list a{color:var(--text);font-weight:700;text-decoration:none}
.guide-list a:hover,.guide-list a:focus-visible{color:var(--accent)}
.guide-list small{display:block;margin-top:2px;color:var(--text-muted);font-size:var(--fs-caption)}
.guide-links{display:flex;flex-wrap:wrap;gap:8px}
.guide-note{font-size:var(--fs-caption)!important}