/* Guide-only layout; palette, typography, buttons and shell reuse existing site CSS. */
.guide-page { color-scheme: only light; }
.guide-page :focus-visible { outline: 3px solid var(--review); outline-offset: 4px; }
.guide-main { padding-top: 28px; padding-bottom: 64px; overflow-wrap: anywhere; }
.guide-main a:not(.button) { text-decoration: underline; text-underline-offset: 4px; }
.guide-breadcrumbs { color: #515951; font-size: 13px; margin-bottom: 32px; }
.guide-heading { max-width: 760px; margin-bottom: 32px; }
.guide-category { color: #515951; font-size: 14px; font-weight: 800; margin: 0 0 10px; }
.guide-heading h1 { font-size: clamp(28px, 4vw, 44px); line-height: 1.4; letter-spacing: -.035em; margin: 0 0 20px; }
.guide-heading p { margin-top: 16px; }
.guide-group { margin: 40px 0; }
.guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.guide-card, .guide-toc, .guide-cta { background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: 26px; }
.guide-card h3 { font-size: 20px; margin: 0 0 12px; }
.guide-card p { color: #515951; font-size: 15px; margin: 0; }
.guide-article, .guide-cta, .guide-related { max-width: 760px; margin-left: auto; margin-right: auto; }
.guide-toc h2 { font-size: 18px; margin-top: 0; }
.guide-toc ol { padding-left: 24px; margin-bottom: 0; }
.guide-toc li, .guide-related li { margin: 8px 0; }
.guide-prose section { margin: 44px 0; }
.guide-prose h2 { font-size: clamp(22px, 3vw, 27px); line-height: 1.5; scroll-margin-top: 24px; }
.guide-prose p { line-height: 1.95; }
.guide-prose ul { padding-left: 24px; }
.guide-prose li { margin: 12px 0; }
.guide-example { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 15px; line-height: 1.95; background: var(--surface); padding: 22px; border: 1px solid var(--line); border-radius: 14px; }
.guide-template .button[hidden] { display: none; }
.guide-copy-status { min-height: 1.75em; color: #515951; font-size: 14px; }
.guide-cta { margin-top: 48px; margin-bottom: 36px; }
.guide-cta h2 { font-size: 22px; margin-top: 0; }
.guide-note { font-size: 14px; color: #515951; }
.guide-related h2 { font-size: 22px; }
.guide-skip { position: absolute; left: 12px; top: -100px; z-index: 100; padding: 12px; background: #fff; }
.guide-skip:focus { top: 12px; }
@media (max-width: 680px) {
  .guide-grid { grid-template-columns: 1fr; }
  .guide-card, .guide-toc, .guide-cta { padding: 20px; }
  .guide-example { padding: 16px; }
  .guide-main { padding-top: 20px; }
}
/* Japanese account label needs slightly more room than the existing English label. */
@media (max-width: 420px) {
  .guide-page .toosukun-shell-actions { gap: 4px; }
  .guide-page .toosukun-shell-cta { padding: 0 4px; }
  .guide-page .toosukun-shell-menu summary { padding: 6px 4px; }
}