/* A quiet, printed-handbook layout. Local screenshots can be added without changing it. */
.guide-document { scroll-padding-top:0; }
.guide-page { --paper:#fafaf7; --ink:#252d28; --green:#365e49; --muted:#657067; --line:#dce1d7; background:var(--paper); }
.guide-page .site-header { background:#fafaf7f5; border-bottom-color:var(--line); }
.guide-page .nav-cta { background:#263d31; border-color:#263d31; color:#fff; }
.guide-page #navigation a[aria-current="page"] { color:var(--green); text-decoration:underline; text-underline-offset:9px; text-decoration-thickness:2px; }
.guide-reading-line { position:absolute; bottom:-1px; left:0; height:2px; width:100%; pointer-events:none; }
.guide-reading-line span { display:block; background:#5b7b58; width:100%; height:100%; transform:scaleX(0); transform-origin:left; }
.guide-kicker { font-size:.75rem; letter-spacing:.12em; font-weight:500; color:#66755f; }
.guide-hero { display:grid; grid-template-columns:1.5fr 1fr; align-items:center; gap:64px; padding-block:64px 58px; }
.guide-hero-copy>.guide-kicker { display:flex; align-items:center; gap:12px; }
.guide-square { display:inline-block; width:7px; height:7px; background:#58714c; }
.guide-hero-copy>.guide-kicker>span:not(.guide-square) { color:#aab3a4; }
.guide-hero h1 { margin-top:27px; font-size:clamp(2.7rem,4.5vw,4rem); font-weight:550; letter-spacing:-.045em; line-height:1.3; }
.guide-lead { color:var(--muted); margin:23px 0 27px; line-height:1.9; }
.guide-page .guide-start { background:#304c3a; color:#fff; border:1px solid #304c3a; border-radius:5px; box-shadow:none; }
.guide-page .guide-start:hover { background:#41624a; transform:translateY(-2px); }
.guide-hero-meta { margin-left:17px; font-size:.8125rem; color:var(--muted); display:inline-block; }
.guide-handbook { position:relative; width:270px; justify-self:center; transform:perspective(1000px) rotateY(-10deg) rotateZ(3deg); border:1px solid #b9c3af; border-radius:3px 10px 10px 3px; background:#e7ecdd; box-shadow:3px 3px 0 #fafbf6,5px 5px 0 #d5ddca,8px 8px 0 #f3f5eb,10px 10px 0 #c3cfb5,18px 30px 35px -17px #35412d30; transition:transform 450ms cubic-bezier(.22,1,.36,1),box-shadow 450ms; }
.guide-handbook:hover,.guide-handbook:focus-visible { transform:perspective(1000px) rotateY(-3deg) rotateZ(0) translateY(-5px); box-shadow:3px 3px 0 #fafbf6,5px 5px 0 #d5ddca,8px 8px 0 #f3f5eb,10px 10px 0 #c3cfb5,18px 35px 40px -17px #35412d40; }
.handbook-spine { position:absolute; top:0; left:12px; height:100%; border-left:1px solid #f5f8ed; border-right:1px solid #ced6c5; width:5px; }
.handbook-cover { padding:24px 26px 20px 35px; }
.handbook-top { display:flex; gap:10px; align-items:center; font-size:.625rem; line-height:1.8; color:#5e6d57; }
.handbook-cover>p { font-size:1.65rem; line-height:1.55; letter-spacing:-.04em; margin-top:22px; color:#354b33; font-weight:500; }
.handbook-path { margin-top:25px; display:grid; justify-items:start; font-size:.6875rem; color:#54634d; gap:3px; }
.handbook-path span { padding:3px 12px; border:1px solid #c0ccb6; border-radius:3px; }
.handbook-path i { font-style:normal; padding-left:37px; }
.handbook-bottom { display:flex; justify-content:space-between; font-size:.625rem; letter-spacing:.09em; margin-top:25px; padding-top:13px; border-top:1px solid #c7d1bc; color:#5a6c51; }
.guide-notice { display:flex; align-items:center; gap:13px; padding:17px 22px; background:#eef1e9; border:1px solid #dce3d4; border-radius:6px; }
.notice-dot { width:6px; height:6px; border-radius:50%; background:#7d8a55; flex:none; }
.guide-notice p { display:flex; gap:17px; flex-wrap:wrap; align-items:center; font-size:.8125rem; color:#687360; }
.guide-notice strong { color:#43583c; font-weight:500; }
.guide-notice>a { margin-left:auto; white-space:nowrap; color:#405738; font-size:.8125rem; }
.guide-notice>a>span { margin-left:12px; }
.guide-layout { display:grid; grid-template-columns:238px minmax(0,1fr); gap:58px; padding-block:54px 80px; align-items:start; }
.guide-sidebar { position:sticky; top:calc(var(--guide-header-height, 88px) + 28px); align-self:start; min-width:0; }
#guide-directory { border:0; padding:0; }
#guide-directory summary { display:flex; gap:12px; align-items:center; padding:0 0 20px; font-size:.8125rem; font-weight:500; cursor:pointer; list-style:none; }
#guide-directory summary::-webkit-details-marker { display:none; }
.directory-current { font-weight:400; color:#687162; font-size:.6875rem; margin-left:auto; }
.directory-toggle { display:none; }
.guide-search { margin-bottom:18px; }
.guide-search label { display:block; font-size:.6875rem; color:#677160; margin-bottom:6px; }
.guide-search>div { display:flex; align-items:center; gap:8px; border:1px solid #dce1d6; border-radius:5px; background:#fff; padding:3px 9px; }
.guide-search>div:focus-within { outline:2px solid #4c704b; outline-offset:2px; }
.guide-search>div>span { font-size:1.3rem; color:#6b7b60; }
.guide-search input { width:100%; min-width:0; font:inherit; font-size:.8125rem; color:var(--ink); padding:8px 0; border:0; background:none; outline:none; }
.guide-search input::-webkit-search-cancel-button { display:none; }
.guide-search button { background:none; border:0; min-width:28px; min-height:32px; color:#62705a; }
#search-status:not(:empty) { font-size:.75rem; margin-top:7px; color:#56644e; }
.guide-directory-links { display:flex; flex-direction:column; align-items:stretch; gap:5px; padding:0; width:auto; }
.guide-nav-link { display:flex; align-items:center; gap:12px; min-height:68px; padding:12px 11px; border-radius:5px; border:1px solid transparent; position:relative; transition:background 180ms,border-color 180ms; }
.guide-nav-link>span:first-child { color:#788370; font-size:.6875rem; font-variant-numeric:tabular-nums; }
.guide-nav-link strong { display:block; font-size:.875rem; font-weight:500; }
.guide-nav-link small { display:block; font-size:.6875rem; color:#6a7563; margin-top:4px; }
.guide-nav-arrow { margin-left:auto; color:#657e56; opacity:0; }
.guide-nav-link:hover { background:#f0f3ea; }
.guide-nav-link[aria-current="location"] { background:#eaf0e1; border-color:#d9e1d1; }
.guide-nav-link[aria-current="location"]::before { content:""; position:absolute; left:-1px; width:3px; height:24px; background:#617f4f; border-radius:2px; }
.guide-nav-link[aria-current="location"] .guide-nav-arrow { opacity:1; }
.guide-progress { padding:24px 11px 0; margin-top:18px; border-top:1px solid var(--line); }
.guide-progress>div { display:flex; justify-content:space-between; gap:10px; color:#5e6d54; font-size:.6875rem; }
.guide-progress progress { display:block; appearance:none; border:0; width:100%; height:3px; margin-block:10px; background:#e2e7da; border-radius:4px; accent-color:#6a8358; }
.guide-progress progress::-webkit-progress-bar { background:#e2e7da; border-radius:4px; }
.guide-progress progress::-webkit-progress-value { background:#6a8358; border-radius:4px; }
.guide-progress progress::-moz-progress-bar { background:#6a8358; }
.guide-progress small { font-size:.6875rem; color:#737b6c; }
.guide-sidebar-download { display:flex; gap:12px; align-items:center; margin-top:25px; padding:17px 12px; border:1px solid var(--line); border-radius:5px; font-size:.75rem; color:#69745f; }
.guide-sidebar-download>span:first-child { font-size:1.3rem; }
.guide-sidebar-download strong { display:block; font-size:.8125rem; font-weight:500; color:#3f5436; margin-top:3px; }
.guide-sidebar-download>span:last-child { margin-left:auto; }
.guide-content { min-width:0; scroll-margin-top:118px; }
.guide-overview { padding-bottom:36px; border-bottom:1px solid var(--line); margin-bottom:14px; }
.guide-overview h2 { font-size:1.5rem; font-weight:500; margin:13px 0; letter-spacing:-.035em; }
.guide-overview>div>p:last-child { color:var(--muted); font-size:.9375rem; line-height:1.85; max-width:660px; }
.guide-page figure { margin:0; }
.guide-overview figure { margin-top:24px; }
.guide-page figcaption { font-size:.6875rem; color:#727c6b; margin-top:10px; }
.guide-image-link { display:block; position:relative; border:1px solid #dce3d6; border-radius:6px; background:#f1f4eb; overflow:hidden; }
.guide-image-link img { display:block; width:100%; height:auto; transition:transform 350ms; }
.guide-image-link:hover img { transform:scale(1.015); }
.guide-image-link>span { position:absolute; bottom:10px; right:10px; padding:4px 10px; background:#fffefa; color:#47603c; border:1px solid #d2dcc7; border-radius:4px; font-size:.6875rem; box-shadow:0 2px 8px #35462808; }
.guide-chapter { padding-block:38px 12px; scroll-margin-top:calc(var(--guide-header-height, 88px) + 22px); }
.chapter-heading { display:flex; align-items:center; gap:17px; }
.chapter-number { font-size:1.6rem; font-weight:400; color:#5d7751; display:grid; place-items:center; flex:none; width:56px; height:65px; border:1px solid #d7e0ce; background:#eff3e9; border-radius:4px 13px 4px 4px; font-variant-numeric:tabular-nums; }
.chapter-heading .guide-kicker { font-size:.6875rem; letter-spacing:.06em; }
.chapter-heading h2 { font-size:1.9rem; font-weight:500; margin-top:4px; letter-spacing:-.045em; }
.chapter-status { margin-left:auto; font-size:.6875rem; border:1px solid #dce1d6; padding:4px 9px; border-radius:3px; color:#717b68; white-space:nowrap; }
.chapter-introduction { margin:23px 0 26px; font-size:1rem; color:var(--muted); line-height:1.9; }
.guide-steps { list-style:none; padding:0; margin:0 0 25px; counter-reset:guide-step; }
.guide-steps li { counter-increment:guide-step; position:relative; padding:0 0 24px 43px; }
.guide-steps li:last-child { padding-bottom:0; }
.guide-steps li::before { content:counter(guide-step); position:absolute; left:0; top:2px; width:26px; height:26px; display:grid; place-items:center; border:1px solid #c7d5bc; background:var(--paper); color:#587346; border-radius:50%; font-size:.75rem; z-index:1; }
.guide-steps li:not(:last-child)::after { content:""; position:absolute; left:13px; top:29px; bottom:0; width:1px; background:#e0e6d9; }
.guide-steps h3 { font-size:1rem; font-weight:550; line-height:1.8; }
.guide-steps p { font-size:.9375rem; line-height:1.95; margin-top:8px; color:#5f6a5b; }
.guide-text-link { display:inline-flex; align-items:center; gap:14px; color:#446e46; font-size:.875rem; text-decoration:underline; text-underline-offset:5px; }
.guide-steps .guide-text-link { margin-top:9px; }
.guide-media { display:grid; gap:18px; }
.guide-pending { display:flex; align-items:center; gap:17px; padding:28px; border:1px dashed #c9d2bf; border-radius:6px; background:#f3f4ee; }
.pending-symbol { width:42px; height:48px; display:grid; place-items:center; border:1px solid #d4ddc9; background:#fcfdf8; font-size:1.6rem; color:#8b9c7b; border-radius:3px; flex:none; box-shadow:3px 3px 0 #e3e8d9; }
.guide-pending strong { font-size:.875rem; color:#5c6f4e; font-weight:500; }
.guide-pending p { font-size:.75rem; margin-top:5px; color:#6e7b61; }
.pending-label { margin-left:auto; font-size:.6875rem; color:#77826c; white-space:nowrap; }
.guide-checkpoint { display:flex; gap:14px; padding:22px 0 15px; align-items:start; }
.guide-checkpoint>span { display:grid; place-items:center; width:22px; height:22px; flex:none; margin-top:2px; color:#4e753c; background:#eaf0e2; border-radius:50%; font-size:.75rem; }
.guide-checkpoint strong { color:#46633a; font-weight:500; font-size:.8125rem; }
.guide-checkpoint p { color:#616d57; font-size:.8125rem; margin-top:4px; }
.guide-note { padding:12px 15px; border-left:2px solid #cbd6c0; background:#f1f3ed; font-size:.8125rem; line-height:1.9; color:#68735d; }
.chapter-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:25px; padding-block:18px; border-top:1px solid var(--line); font-size:.75rem; color:#75816b; }
.chapter-footer>a { color:#456238; }
.chapter-footer>a>span { margin-left:15px; }
.guide-ending { margin-top:35px; padding:34px; border:1px solid #d8e0ce; border-radius:7px; background:#eaf0e2; }
.guide-ending h2 { font-size:2rem; line-height:1.5; font-weight:500; letter-spacing:-.04em; margin:15px 0; }
.guide-ending>p:not(.guide-kicker) { color:#617455; font-size:.9375rem; max-width:550px; }
.guide-ending>div { display:flex; gap:25px; align-items:center; flex-wrap:wrap; margin-top:26px; }
.guide-page .footer { border-top:1px solid var(--line); }
.guide-page .footer>a:not(.brand) { font-size:.8125rem; color:#5b7050; margin-left:auto; }
.guide-empty { padding:60px 25px; text-align:center; border:1px dashed #c7d6bc; border-radius:6px; background:#f4f6ef; }
.guide-empty>span { font-size:2.5rem; color:#718761; }
.guide-empty h2 { font-size:1.4rem; font-weight:500; margin:10px 0; }
.guide-empty p { font-size:.9375rem; color:var(--muted); margin-bottom:24px; }
.guide-empty button { border:1px solid #b5c4a7; color:#425f33; background:white; }
.guide-viewer { width:min(1200px,calc(100vw - 48px)); max-height:calc(100dvh - 48px); margin:auto; padding:24px; border:1px solid #c6d0bd; border-radius:12px; background:#fafcf6; color:var(--ink); box-shadow:0 30px 100px #10201135; overscroll-behavior:contain; }
.guide-viewer::backdrop { background:#1c2929bc; backdrop-filter:blur(5px); }
.guide-viewer[open] { display:flex; flex-direction:column; animation:viewer-enter 220ms ease-out; }
.viewer-header { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:18px; }
.viewer-header h2 { font-size:1.125rem; font-weight:500; margin-top:5px; }
.guide-viewer button { border:1px solid #cfd9c4; border-radius:5px; background:#fff; color:#415638; padding:7px 12px; min-height:42px; }
.guide-viewer button:hover:not(:disabled) { background:#edf2e6; border-color:#8da27a; }
.guide-viewer button:disabled { opacity:.35; cursor:default; }
.viewer-viewport { position:relative; min-height:180px; overflow:auto; display:grid; place-items:center; background:#e9ede4; border:1px solid #d9e0d1; border-radius:6px; overscroll-behavior:contain; }
.viewer-viewport img { display:block; width:auto; max-width:100%; max-height:64dvh; object-fit:contain; }
.viewer-viewport.is-zoomed { display:block; }
.viewer-viewport.is-zoomed img { width:200%; max-width:none; max-height:none; height:auto; }
#viewer-loading,#viewer-error { padding:36px 20px; font-size:.9375rem; color:#596c4c; }
.viewer-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:19px; }
#viewer-caption { font-size:.8125rem; color:#607253; line-height:1.8; }
.viewer-controls { display:flex; gap:9px; align-items:center; flex-shrink:0; }
#viewer-count { font-size:.75rem; min-width:42px; text-align:center; }
.viewer-keyboard { margin-top:13px; font-size:.6875rem; color:#74826a; }
@keyframes viewer-enter { from { opacity:0; transform:translateY(12px) scale(.99); } to { opacity:1; transform:none; } }
@media(min-width:851px) { #guide-directory summary { cursor:default; } .directory-body { display:block!important; } .guide-sidebar { max-height:calc(100dvh - var(--guide-header-height, 88px) - 48px); overflow:auto; scrollbar-width:thin; } }
@media(max-width:1100px) { .guide-layout { grid-template-columns:215px minmax(0,1fr); gap:30px; } .guide-hero { gap:35px; } .guide-hero-meta { display:block; margin:13px 0 0; } .guide-page .brand-caption,.guide-page .brand-divider { display:none; } }
@media(max-width:850px) {
  .guide-page .nav-shell { flex-wrap:wrap; padding-block:14px; min-height:78px; }
  .guide-page #navigation { width:100%; flex-wrap:wrap; gap:18px; padding-top:10px; }
  .guide-hero { padding-block:40px; gap:25px; grid-template-columns:1.4fr 1fr; }
  .guide-hero h1 { font-size:2.75rem; } .guide-handbook { width:215px; } .handbook-cover { padding:20px 18px 18px 30px; } .handbook-cover>p { font-size:1.4rem; }
  .guide-layout { grid-template-columns:1fr; gap:22px; padding-top:28px; }
  .guide-sidebar { position:sticky; top:calc(var(--guide-header-height, 78px) + 6px); z-index:15; background:var(--paper); border:1px solid #d3dec9; border-radius:6px; box-shadow:0 4px 12px #25351e05; }
  #guide-directory summary { padding:16px 18px; margin:0; }
  .directory-toggle { display:inline; }
  #guide-directory[open] .directory-toggle { transform:rotate(45deg); }
  .directory-body { padding:0 18px 20px; max-height:55dvh; overflow:auto; }
  .guide-search { margin-bottom:10px; }
  .guide-directory-links { display:grid; grid-template-columns:1fr 1fr; gap:5px; }
  .guide-sidebar-download { display:none; } .guide-progress { margin-top:14px; padding-top:17px; }
  .guide-chapter { scroll-margin-top:calc(var(--guide-header-height, 78px) + 80px); }
  .guide-content { scroll-margin-top:155px; }
  .guide-overview { padding-top:10px; }
  .guide-notice { align-items:start; } .notice-dot { margin-top:9px; } .guide-notice p { display:block; } .guide-notice p>span { display:block; margin-top:5px; }
  .guide-notice>a { margin-top:2px; }
  .guide-page .footer { padding-block:24px; }
  .viewer-footer { flex-direction:column; align-items:start; gap:12px; }
}
@media(max-width:600px) {
  .guide-page .nav-shell { min-height:72px; }
  .guide-page #navigation { padding-bottom:3px; font-size:.8125rem; }
  .guide-hero { grid-template-columns:1fr; padding-block:34px; gap:30px; }
  .guide-hero-copy>.guide-kicker { gap:9px; font-size:.625rem; }
  .guide-hero h1 { font-size:2.5rem; margin-top:22px; }
  .guide-lead { margin-top:17px; font-size:.9375rem; }
  .guide-handbook { display:none; }
  .guide-hero-meta { display:inline-block; margin-left:12px; font-size:.75rem; }
  .guide-notice { padding:14px; gap:9px; } .guide-notice>a { display:none; }
  .guide-directory-links { grid-template-columns:1fr; } .guide-nav-link { min-height:58px; }
  .guide-overview h2 { font-size:1.3rem; }
  .guide-overview .guide-image-link img { width:700px; max-width:none; } .guide-roadmap { overflow-x:auto; } .guide-roadmap>span { position:sticky; float:right; margin:0 8px 8px; }
  .guide-chapter { padding-top:28px; }
  .chapter-heading { gap:12px; flex-wrap:wrap; } .chapter-number { width:43px; height:58px; font-size:1.25rem; }
  .chapter-heading h2 { font-size:1.6rem; } .chapter-status { font-size:.625rem; padding:3px 6px; }
  .guide-steps li { padding-left:36px; } .guide-steps p { font-size:.9375rem; }
  .guide-pending { padding:21px 17px; gap:13px; flex-wrap:wrap; } .guide-pending>div { flex:1; min-width:150px; } .pending-label { display:none; }
  .guide-ending { padding:25px; } .guide-ending h2 { font-size:1.7rem; }
  .guide-ending>div { gap:18px; }
  .guide-layout { padding-bottom:44px; }
  .guide-viewer { width:calc(100vw - 20px); padding:16px; max-height:calc(100dvh - 20px); }
  .viewer-controls { gap:6px; flex-wrap:wrap; }
  .guide-viewer button { padding:7px 10px; }
  .viewer-header .guide-kicker { font-size:.625rem; }
}
.guide-page.large-guide-text .guide-layout { grid-template-columns:1fr; }
.guide-page.large-guide-text .guide-sidebar { position:static; max-height:none; overflow:visible; }
.guide-page.large-guide-text .guide-directory-links { grid-template-columns:1fr; }
.guide-page.large-guide-text .guide-hero-meta { display:block; margin-left:0; }
.guide-page.large-guide-text .chapter-status { margin-left:0; }
.guide-page.large-guide-text .viewer-footer { flex-direction:column; align-items:start; }
.guide-page.large-guide-text .viewer-controls { flex-wrap:wrap; flex-shrink:1; }
.guide-page.large-guide-text .guide-hero { grid-template-columns:1fr; }
.guide-page.large-guide-text .guide-handbook { display:none; }
.guide-page.large-guide-text .nav-shell { flex-wrap:wrap; padding-block:15px; }
.guide-page.large-guide-text #navigation { flex-wrap:wrap; }
.guide-page.large-guide-text .chapter-heading { flex-wrap:wrap; }
.guide-page.large-guide-text .guide-pending { flex-wrap:wrap; }
.guide-page.large-guide-text .guide-notice { flex-wrap:wrap; }
@media(prefers-reduced-motion:reduce) { .guide-page *, .guide-page *::before, .guide-page *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } .guide-handbook { transform:none; } }