/* Uses the active DESIGN.md inverse surface and restrained lavender accent. */
.guide-page { margin:0; background:#fff; color:#17181c; font-family:system-ui,-apple-system,"Segoe UI",sans-serif; }
.guide-page * { box-sizing:border-box; }
.guide-page [hidden] { display:none!important; }
.guide-page a { text-underline-offset:4px; }
.guide-page :focus-visible { outline:3px solid #5e6ad2; outline-offset:4px; }
.guide-skip { position:fixed; left:16px; top:-100px; padding:12px 18px; background:#fff; border:2px solid #5e6ad2; z-index:100; }
.guide-skip:focus { top:12px; }
.guide-hero { max-width:1280px; margin:auto; padding:64px 32px 48px; border-bottom:1px solid #e5e7eb; }
.guide-version { font-size:13px; font-weight:600; color:#515bb2; letter-spacing:.02em; }
.guide-hero h1 { font-size:clamp(32px,4vw,52px); line-height:1.15; font-weight:650; letter-spacing:-.035em; margin:18px 0; }
.guide-hero>p:last-child { font-size:18px; color:#5a616b; line-height:1.7; margin:0; }
.guide-layout { display:grid; grid-template-columns:270px minmax(0,1fr); gap:64px; max-width:1280px; margin:auto; padding:40px 32px 80px; align-items:start; }
.guide-sidebar { position:sticky; top:140px; max-height:calc(100vh - 160px); overflow:auto; padding:4px 12px 16px 0; scrollbar-width:thin; }
.guide-sidebar h2 { font-size:14px; font-weight:650; margin:0 0 20px; }
.guide-search { margin-bottom:24px; }
.guide-search label { display:block; font-size:13px; line-height:1.5; color:#525866; margin-bottom:8px; }
.guide-search input { display:block; width:100%; min-height:44px; border:1px solid #bdc3cd; border-radius:8px; padding:9px 12px; background:#f8f9fb; color:#17181c; font:inherit; }
.guide-search button { font:inherit; font-size:13px; border:0; background:transparent; color:#454fa8; min-height:44px; cursor:pointer; padding:8px 0; text-align:left; }
.guide-sidebar ol { list-style:none; padding:0; margin:0; }
.guide-sidebar li { margin:2px 0; }
.guide-sidebar nav a { display:block; padding:11px 12px; border-radius:6px; font-size:14px; line-height:1.5; color:#525866; text-decoration:none; overflow-wrap:anywhere; }
.guide-sidebar nav a:hover,.guide-sidebar a[aria-current] { color:#343f9e; background:#eff0fb; }
#guide-main { min-width:0; max-width:820px; }
.guide-article { position:relative; border-bottom:1px solid #e5e7eb; padding:8px 0 36px; margin-bottom:36px; scroll-margin-top:150px; }
.guide-number { display:block; font-variant-numeric:tabular-nums; font-size:12px; color:#656d7a; margin-bottom:12px; }
.guide-article h2,.guide-references h2 { font-size:clamp(22px,2.3vw,28px); letter-spacing:-.02em; line-height:1.4; font-weight:600; margin:0 0 24px; overflow-wrap:anywhere; }
.guide-article h2 a { color:inherit; text-decoration:none; }
.guide-article h2 a:hover { color:#454fa8; text-decoration:underline; }
.guide-article p { font-size:16px; line-height:1.9; color:#424956; margin:0 0 20px; overflow-wrap:anywhere; }
.guide-back { display:inline-block; font-size:13px; color:#454fa8; padding:10px 0; }
#guide-contents { scroll-margin-top:150px; }
#guide-empty { padding:28px; border:1px solid #dfe2ed; border-radius:8px; line-height:1.8; }
.guide-references h2 { font-size:18px; }
.guide-references a { display:block; color:#454fa8; font-size:14px; padding:10px 0; overflow-wrap:anywhere; }
@media(max-width:850px) {
  .guide-layout { grid-template-columns:210px minmax(0,1fr); gap:28px; padding-inline:24px; }
}
@media(max-width:640px) {
  /* Expanded site navigation must not cover chapter anchors on short screens. */
  .guide-page #navbar { position:static; }
  .guide-hero { padding:36px 20px 28px; }
  .guide-layout { display:block; padding:24px 20px 48px; }
  .guide-sidebar { position:static; max-height:none; padding:0 0 28px; margin-bottom:32px; border-bottom:1px solid #e5e7eb; }
  .guide-sidebar nav a { padding-inline:0; }
  .guide-article p { font-size:16px; line-height:1.85; }
  .guide-article,#guide-contents { scroll-margin-top:20px; }
}
@media print {
  #navbar,#footer,.guide-sidebar,.guide-back,.guide-search,.guide-skip { display:none!important; }
  .guide-layout { display:block; padding:0; }
  .guide-hero { padding:0 0 24px; }
  .guide-article[hidden] { display:block!important; }
  .guide-article h2 { break-after:avoid; }
  .guide-article p { orphans:3; widows:3; }
}