/*
  WorkBuddy 教程库 — design direction A「和主站一体」(Owner 2026-10-31).
  Light only, like apiget.store. Token values are copied unchanged from the
  customer site's web/default/src/styles/tokens.css (buddy-v2 6d34c4517);
  components read only the --c-* aliases. Source of the design:
  work/apiget/20261031-fde-library-redesign/unified/ (notes.md).
*/

/* ---------- fonts (self-hosted, offline) ---------- */
/* Public Sans leaves — ‘ ’ “ ” … to the CJK font, so “——” does not split in two. */
@font-face{font-family:"Public Sans Variable";font-style:normal;font-weight:100 900;font-display:swap;src:url("fonts/public-sans.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-2013,U+2015-2017,U+201A-201B,U+201E-2025,U+2027-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Noto Serif SC 600 (OFL), subset to the characters of this library's display headings (fonts/build-display-serif.py). */
@font-face{font-family:"AG Display Serif";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/ag-display-serif.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/jetbrains-400.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/cormorant-600.woff2") format("woff2")}

:root{
  color-scheme:light;
  /* customer-site tokens (unchanged values) */
  --ag-ink-900:#14231d;--ag-ink-700:#3f5249;--ag-ink-500:#5e6e66;--ag-ink-300:#a9b8b0;
  --ag-line:#e3e6dc;--ag-line-strong:#cbd5cc;
  --ag-paper:#fbfaf6;--ag-surface:#ffffff;--ag-surface-sunken:#f3efe4;--ag-surface-muted:#eeece4;--ag-surface-tint:#eef4f0;
  --ag-green-50:#eef4f0;--ag-green-100:#d9e9e0;--ag-green-600:#0b6048;--ag-green-700:#084d3a;--ag-green-900:#0a3b2c;
  --ag-gold-50:#fff9e8;--ag-gold-100:#fff3cf;--ag-gold-300:#f3d27a;--ag-gold-600:#b07c0c;--ag-gold-700:#805b0b;
  --ag-on-dark:#fbf6e7;--ag-on-dark-muted:#b9d1c4;--ag-on-dark-line:rgb(255 255 255 / .14);
  --ag-font-sans:"Public Sans Variable",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC",sans-serif;
  --ag-font-display:"AG Display Serif","Songti SC","STSong","Noto Serif CJK SC","Source Han Serif SC","Noto Serif SC","SimSun",serif;
  --ag-font-wordmark:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
  --ag-font-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,"DejaVu Sans Mono","Noto Sans Mono CJK SC",monospace;
  --ag-text-caption:12px;--ag-leading-caption:18px;
  --ag-text-small:14px;--ag-leading-small:22px;
  --ag-text-body:16px;--ag-leading-body:1.7;
  --ag-text-lead:18px;--ag-leading-lead:1.75;
  --ag-text-title:20px;--ag-leading-title:30px;
  --ag-text-heading:24px;--ag-leading-heading:34px;
  --ag-text-page:32px;--ag-leading-page:1.25;
  --ag-text-display-2:clamp(28px,2.75vw,38px);--ag-leading-display-2:1.34;
  --ag-text-display-1:clamp(36px,3.3vw,48px);--ag-leading-display-1:1.26;
  --ag-side:24px;--ag-gutter:24px;--ag-content-max:1200px;--ag-section-sm:64px;--ag-section-md:96px;
  --ag-radius-xs:4px;--ag-radius-sm:8px;--ag-radius-md:12px;--ag-radius-lg:20px;--ag-radius-pill:999px;
  --ag-ring-hairline:inset 0 0 0 1px rgb(20 35 29 / .08);
  --ag-shadow-1:0 1px 2px rgb(20 35 29 / .06),0 1px 1px rgb(20 35 29 / .04);
  --ag-shadow-2:0 6px 16px -4px rgb(20 35 29 / .1),0 2px 4px rgb(20 35 29 / .05);
  --ag-shadow-3:0 24px 48px -16px rgb(11 61 46 / .24),0 6px 12px rgb(20 35 29 / .06);
  --ag-focus-color:var(--ag-green-600);--ag-focus-on-dark:var(--ag-gold-300);
  --ag-ease-out:cubic-bezier(.2,.7,.2,1);--ag-dur-fast:120ms;--ag-dur:180ms;--ag-lift:-1px;
  /* reading page */
  --rd-measure:720px;--rd-text:var(--ag-text-lead);--rd-leading:1.85;--hd-height:64px;
  /* semantic aliases */
  --c-page:var(--ag-paper);--c-surface:var(--ag-surface);--c-sunken:var(--ag-surface-sunken);--c-muted:var(--ag-surface-muted);--c-tint:var(--ag-surface-tint);
  --c-text:var(--ag-ink-900);--c-text-2:var(--ag-ink-700);--c-text-3:var(--ag-ink-500);--c-icon-weak:var(--ag-ink-300);
  --c-line:var(--ag-line);--c-line-strong:var(--ag-line-strong);
  --c-accent:var(--ag-green-600);--c-accent-soft:var(--ag-green-50);--c-accent-ring:rgb(11 96 72 / .12);--c-accent-bar:var(--ag-green-600);--c-track:var(--ag-surface-muted);
  --c-btn:var(--ag-green-600);--c-btn-hover:var(--ag-green-700);--c-btn-text:#fff;
  --c-gold-text:var(--ag-gold-700);--c-gold-rule:rgb(176 124 12 / .6);--c-gold-chip:var(--ag-gold-100);
  --c-deep:var(--ag-green-900);--c-on-deep:var(--ag-on-dark);--c-on-deep-2:var(--ag-on-dark-muted);--c-on-deep-line:var(--ag-on-dark-line);
  --c-code-bg:#f6f3ea;--c-header:rgb(251 250 246 / .94);--c-scrim:rgb(20 35 29 / .36);
  --c-ring:var(--ag-ring-hairline);
  --c-raised:var(--ag-ring-hairline),var(--ag-shadow-1);
  --c-floating:var(--ag-ring-hairline),var(--ag-shadow-2);
  --c-overlay:var(--ag-ring-hairline),var(--ag-shadow-3);
  --c-img-ring:inset 0 0 0 1px rgb(20 35 29 / .08);
}
@media (max-width:960px){:root{--ag-section-sm:56px;--ag-section-md:80px}}
@media (max-width:720px){:root{--ag-side:16px;--ag-gutter:16px;--ag-section-sm:48px;--ag-section-md:64px;--rd-text:var(--ag-text-body);--hd-height:56px}}
@media (prefers-reduced-motion:reduce){:root{--ag-dur-fast:.01ms;--ag-dur:.01ms;--ag-lift:0px}}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hd-height) + 24px)}
body{margin:0;min-height:100svh;display:flex;flex-direction:column;background:var(--c-page);color:var(--c-text);font:400 var(--ag-text-body)/var(--ag-leading-body) var(--ag-font-sans);-webkit-font-smoothing:antialiased;overflow-wrap:anywhere;line-break:strict}
main{flex:1}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0}
p,li,figcaption,blockquote{text-wrap:pretty}
ul,ol{padding:0;list-style:none}
[hidden]{display:none!important}
.nb{white-space:nowrap}
svg.i{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
svg.i-lg{width:20px;height:20px}
:where(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--ag-focus-color);outline-offset:3px;border-radius:var(--ag-radius-sm)}
.skip{position:absolute;left:16px;top:-48px;z-index:50;padding:8px 12px;border-radius:var(--ag-radius-sm);background:var(--c-btn);color:var(--c-btn-text);font-size:var(--ag-text-small);font-weight:600}
.skip:focus{top:8px}
.wrap{width:100%;max-width:calc(var(--wrap,var(--ag-content-max)) + 2 * var(--ag-side));margin-inline:auto;padding-inline:var(--ag-side)}
.muted{color:var(--c-text-3)}
.soft{color:var(--c-text-2)}

/* ---------- header (customer-site header structure) ---------- */
.hd{position:sticky;top:0;z-index:30;background:var(--c-header);border-bottom:1px solid var(--c-line);-webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px)}
.hd-inner{display:flex;align-items:center;gap:20px;min-height:var(--hd-height)}
.lockup{display:flex;align-items:center;gap:12px;flex:none;border-radius:var(--ag-radius-sm)}
.lockup img{width:26px;height:26px;border-radius:7px}
.lockup-text{display:grid;gap:4px;min-width:0}
.wordmark{font:600 18px/1 var(--ag-font-wordmark);letter-spacing:.08em;color:var(--c-accent);white-space:nowrap}
.lockup-sub{font-size:var(--ag-text-caption);line-height:1;color:var(--c-text-3);white-space:nowrap}
.lockup-sub b{font-weight:600;color:var(--c-text-2)}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto;min-width:0}
.nav a{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-small);font-weight:500;color:var(--c-text-2);white-space:nowrap;transition:background-color var(--ag-dur) var(--ag-ease-out),color var(--ag-dur) var(--ag-ease-out)}
.nav a:hover{background:rgb(20 35 29 / .05);color:var(--c-text)}
.nav a[aria-current="page"]{background:var(--c-accent-soft);color:var(--c-accent);box-shadow:inset 0 0 0 1px var(--c-accent-ring)}
.hd-tools{display:flex;align-items:center;gap:6px;flex:none;margin-left:8px}
.hd-back{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 10px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-small);font-weight:500;color:var(--c-text-2);white-space:nowrap}
.hd-back:hover{color:var(--c-text);background:rgb(20 35 29 / .05)}
.icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--ag-radius-sm);color:var(--c-text-2)}
.icon-btn:hover{background:rgb(20 35 29 / .05);color:var(--c-text)}
.menu-btn{display:none}
.read-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px}
.read-progress>i{display:block;height:100%;width:var(--p,0%);background:var(--c-accent-bar)}

/* ---------- buttons and links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-body);font-weight:600;line-height:1;white-space:nowrap;transition:transform var(--ag-dur) var(--ag-ease-out),box-shadow var(--ag-dur) var(--ag-ease-out),background-color var(--ag-dur) var(--ag-ease-out)}
.btn-sm{height:40px;padding:0 16px;font-size:var(--ag-text-small)}
.btn-lg{height:52px;padding:0 26px}
.btn-primary{background:var(--c-btn);color:var(--c-btn-text);box-shadow:0 1px 2px rgb(11 61 46 / .24),inset 0 1px 0 rgb(255 255 255 / .1)}
.btn-primary:hover{background:var(--c-btn-hover);transform:translateY(var(--ag-lift));box-shadow:var(--ag-shadow-2)}
.btn-ghost{color:var(--c-text);background:transparent;box-shadow:inset 0 0 0 1px var(--c-line-strong)}
.btn-ghost:hover{background:var(--c-surface);box-shadow:inset 0 0 0 1px var(--c-icon-weak),var(--ag-shadow-1);transform:translateY(var(--ag-lift))}
.btn .muted{font-weight:500;font-size:var(--ag-text-small)}
.text-link{display:inline-flex;align-items:center;gap:6px;color:var(--c-accent);font-weight:600;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--c-accent) 35%,transparent);text-decoration-thickness:1.5px;text-underline-offset:5px}
.text-link:hover{text-decoration-color:currentColor}
.cta-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.on-deep .btn-ghost{color:var(--c-on-deep);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .28)}
.on-deep .btn-ghost:hover{background:rgb(255 255 255 / .06)}
.on-deep .btn-primary{background:var(--c-on-deep);color:#0a3b2c;box-shadow:none}
.on-deep .btn-primary:hover{background:#fff}
.on-deep :where(a,button):focus-visible{outline-color:var(--ag-focus-on-dark)}

/* ---------- headings ---------- */
.overline{display:flex;align-items:center;gap:10px;font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);font-weight:600;letter-spacing:.04em;color:var(--c-text-3)}
.overline::before{content:"";width:24px;height:1px;background:var(--c-gold-rule);flex:none}
.overline .idx{order:-1;color:var(--c-gold-text);font-weight:500;letter-spacing:0;font-variant-numeric:tabular-nums}
.display{font-family:var(--ag-font-display);font-weight:600;font-synthesis-weight:none;letter-spacing:0;text-wrap:balance;color:var(--c-text)}
.display em{font-style:normal;color:var(--c-accent)}
.display-1{font-size:var(--ag-text-display-1);line-height:var(--ag-leading-display-1)}
.display-2{font-size:var(--ag-text-display-2);line-height:var(--ag-leading-display-2)}
.t-lead{font-size:var(--ag-text-lead);line-height:var(--ag-leading-lead);color:var(--c-text-2)}
.t-caption{font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption)}
.section-head{display:grid;gap:12px;max-width:760px}
.section-head p.soft{font-size:var(--ag-text-body);line-height:var(--ag-leading-body)}

/* ---------- cards, chips ---------- */
.card{background:var(--c-surface);border-radius:var(--ag-radius-md);box-shadow:var(--c-raised)}
.lift{transition:transform var(--ag-dur) var(--ag-ease-out),box-shadow var(--ag-dur) var(--ag-ease-out)}
.lift:hover{transform:translateY(calc(var(--ag-lift) * 2));box-shadow:var(--c-floating)}
.chip{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 8px;border-radius:var(--ag-radius-xs);background:var(--c-muted);color:var(--c-text-2);font-size:var(--ag-text-caption);line-height:1;font-weight:600;white-space:nowrap}
.chip-accent,.chip-full{background:var(--c-accent-soft);color:var(--c-accent)}
.progress{height:6px;border-radius:var(--ag-radius-pill);background:var(--c-track);overflow:hidden}
.progress>i{display:block;height:100%;width:var(--p,0%);border-radius:inherit;background:var(--c-accent-bar)}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:var(--ag-text-small);color:var(--c-text-3)}
.breadcrumb a:hover{color:var(--c-text);text-decoration:underline;text-underline-offset:4px}

/* ---------- deep green band (at most one per page, plus the footer) ---------- */
.on-deep{background:var(--c-deep);color:var(--c-on-deep)}
.on-deep .overline{color:var(--c-on-deep-2)}
.on-deep .overline::before{background:rgb(243 210 122 / .6)}
.on-deep .overline .idx{color:var(--ag-gold-300)}
.on-deep .display{color:var(--c-on-deep)}
.on-deep .display em{color:var(--ag-gold-300)}
.on-deep .soft,.on-deep .muted{color:var(--c-on-deep-2)}
.band-deep{padding-block:var(--ag-section-md)}
.band-grid{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:64px;align-items:center}
.band-copy{display:grid;gap:20px}
.band-copy .soft{font-size:var(--ag-text-body);line-height:var(--ag-leading-body);max-width:34em}
.promo-steps{display:grid;gap:10px;counter-reset:s;margin:4px 0 6px}
.promo-steps li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:start;font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-on-deep)}
.promo-steps li::before{counter-increment:s;content:counter(s);width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:var(--ag-text-caption);font-weight:700;color:var(--ag-gold-300);box-shadow:inset 0 0 0 1px rgb(243 210 122 / .5)}
.promo-steps b{font-weight:650}
.gold-num{color:var(--ag-gold-300);font-weight:700}

/* WorkBuddy model menu (illustration, like the customer site's WorkBuddyModelList) */
.wb{display:grid;gap:10px}
.wb-win{background:#fff;color:#14231d;border-radius:var(--ag-radius-lg);overflow:hidden;box-shadow:var(--c-overlay);font-size:var(--ag-text-small);line-height:20px}
.wb-bar{display:flex;align-items:center;gap:12px;height:40px;padding:0 16px;background:#fbfaf6;box-shadow:inset 0 -1px 0 #e3e6dc}
.wb-dots{display:flex;gap:7px}
.wb-dots i{width:10px;height:10px;border-radius:50%;background:#e1ded5}
.wb-title{font-size:var(--ag-text-caption);font-weight:600;color:#5e6e66}
.wb-tag{margin-left:auto;height:20px;display:inline-flex;align-items:center;padding:0 8px;border-radius:4px;background:rgb(20 35 29 / .05);color:#5e6e66;font-size:var(--ag-text-caption);font-weight:500}
.wb-body{position:relative;display:flex;flex-direction:column;gap:14px;padding:20px 24px 18px;min-height:360px}
.wb-bubble{align-self:flex-end;width:58%;display:grid;gap:8px;padding:12px 14px;border-radius:14px 14px 4px 14px;background:#eeece4}
.wb-lines{display:grid;gap:8px;width:74%}
.wb-sk{display:block;height:8px;border-radius:4px;background:#eeece4}
.wb-bubble .wb-sk{background:#cbd5cc}
.wb-menu{position:absolute;right:22px;bottom:74px;width:252px;padding:6px;border-radius:14px;background:#fff;box-shadow:var(--c-overlay);z-index:1}
.wb-menu p{padding:8px 10px 4px;font-size:var(--ag-text-caption);font-weight:500;color:#5e6e66}
.wb-menu li{display:flex;align-items:center;gap:10px;height:32px;padding:0 10px;border-radius:8px;font-weight:500;white-space:nowrap}
.wb-menu li[aria-current]{font-weight:600;background:#eef4f0}
.wb-menu li::before{content:"";width:14px;height:14px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1.5px #a9b8b0}
.wb-menu li[aria-current]::before{box-shadow:inset 0 0 0 4px #0b6048}
.wb-menu li span{font-size:var(--ag-text-caption);color:#5e6e66;font-weight:500}
.wb-composer{margin-top:auto;display:grid;gap:10px;padding:12px 14px 10px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px #e3e6dc}
.wb-composer .ph{color:#5e6e66}
.wb-composer .row{display:flex;align-items:center;gap:8px}
.wb-chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:8px;background:#eeece4;font-weight:600}
.wb-send{margin-left:auto;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#14231d;color:#fff}
.wb figcaption{font-size:var(--ag-text-caption);color:var(--c-on-deep-2)}

/* ---------- footer (customer-site deep green footer, plus library links) ---------- */
.ft{padding-block:56px 32px}
.ft-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px var(--ag-gutter);align-items:start}
.ft-about{grid-column:1/span 5;display:grid;gap:14px}
.ft-brand{font:600 23px/1 "Cormorant Garamond",var(--ag-font-wordmark);letter-spacing:.04em;color:var(--c-on-deep)}
.ft p{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-on-deep-2)}
.ft-cols{display:contents}
.ft-col{display:grid;gap:10px;align-content:start}
.ft-col.c1{grid-column:7/span 2}
.ft-col.c2{grid-column:9/span 2}
.ft-col h2{font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);font-weight:600;letter-spacing:.04em;color:var(--c-on-deep);margin-bottom:2px}
.ft-col a{font-size:var(--ag-text-small);color:var(--c-on-deep-2);width:fit-content}
.ft-col a:hover{color:var(--c-on-deep);text-decoration:underline;text-underline-offset:4px}
.ft-qr{grid-column:11/span 2;justify-self:end;display:grid;gap:8px;grid-template-columns:104px;font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);color:var(--c-on-deep-2)}
.ft-qr img{display:block;width:104px;height:104px;padding:6px;border-radius:var(--ag-radius-sm);background:#fff}
.ft-base{grid-column:1/-1;display:flex;justify-content:space-between;gap:6px 16px;padding-top:20px;margin-top:8px;border-top:1px solid var(--c-on-deep-line)}
.ft-base p{font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption)}

/* ---------- sheets (phone drawers) and reading bar ---------- */
.scrim{position:fixed;inset:0;background:var(--c-scrim);z-index:40}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:41;max-height:78svh;overflow:auto;overscroll-behavior:contain;background:var(--c-surface);border-radius:var(--ag-radius-lg) var(--ag-radius-lg) 0 0;box-shadow:var(--c-overlay);padding:8px 16px calc(16px + env(safe-area-inset-bottom))}
.sheet:focus{outline:none}
.sheet-grip{width:40px;height:4px;border-radius:2px;background:var(--c-line-strong);margin:4px auto 8px}
.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0 12px}
.sheet-head h2{font-size:var(--ag-text-body);font-weight:650}
.menu-list,.menu-group{display:grid;gap:2px}
.menu-group{margin-top:12px;padding-top:12px;border-top:1px solid var(--c-line)}
.menu-group>p{padding:0 12px 6px}
.menu-link{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 12px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-body);font-weight:500;color:var(--c-text)}
.menu-link svg{color:var(--c-text-3)}
.menu-link:hover{background:var(--c-tint)}
.menu-link[aria-current="page"]{background:var(--c-accent-soft);color:var(--c-accent);font-weight:650}
.menu-link[aria-current="page"] svg{color:var(--c-accent)}
.menu-cta{width:100%;margin-top:16px}
.sheet .outline{box-shadow:none}
.sheet .outline a{padding:10px 12px;font-size:var(--ag-text-body);line-height:24px;border-radius:var(--ag-radius-sm)}
.sheet .outline a.sub{padding-left:28px}
.sheet .outline a[aria-current="true"]{background:var(--c-accent-soft);box-shadow:none}
.sheet .side-nav>a,.sheet .side-nav details a{font-size:var(--ag-text-body);line-height:24px;padding-block:10px}
.rbar{position:fixed;left:0;right:0;bottom:0;z-index:25;display:none;background:var(--c-header);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--c-line);padding:8px 12px calc(8px + env(safe-area-inset-bottom))}
.rbar-inner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px}
.rbar-btn{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 12px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-small);font-weight:600;color:var(--c-text);white-space:nowrap}
.rbar-btn:hover{background:var(--c-muted)}
.rbar-next{background:var(--c-btn);color:var(--c-btn-text)}
.rbar-next:hover{background:var(--c-btn-hover)}
.rbar-mid{min-width:0;display:grid;gap:6px;justify-items:stretch;padding:4px 8px;border-radius:var(--ag-radius-sm);text-align:center}
.rbar-mid>span:first-child{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:0;font-size:var(--ag-text-caption);line-height:1.3;color:var(--c-text-2);font-weight:600}
.rbar-mid>span:first-child b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rbar-mid svg{width:14px;height:14px}
.rbar-mid .progress{display:block}

/* ---------- home ---------- */
.lib-hero{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:56px;align-items:center;padding-block:64px 24px}
.lib-hero-copy{display:grid;gap:20px;min-width:0}
.lib-hero-copy .t-lead{max-width:33em}
.stamp{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);color:var(--c-text-3)}
.stamp .text-link{font-size:var(--ag-text-caption);text-underline-offset:4px}
.resume-pill{min-width:0;display:inline-flex;align-items:center;gap:10px;max-width:100%;justify-self:start;min-height:40px;padding:6px 14px 6px 6px;border-radius:var(--ag-radius-pill);background:var(--c-surface);box-shadow:var(--c-raised);font-size:var(--ag-text-small)}
.resume-pill .chip{border-radius:var(--ag-radius-pill)}
.resume-pill b{min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.book{padding:10px;display:grid;gap:4px}
.book-cover{position:relative;display:grid;gap:10px;padding:28px 28px 24px;border-radius:10px;background:var(--c-sunken);overflow:hidden}
.book-cover::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--c-gold-rule)}
.book-kicker{font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);font-weight:600;letter-spacing:.04em;color:var(--c-text-3)}
.book-title{font:600 var(--ag-text-page)/1.25 var(--ag-font-display);color:var(--c-text)}
.book-cover .t-caption{color:var(--c-text-3)}
.book-parts{display:grid;padding:6px 4px 2px}
.book-parts a{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:44px;padding:6px 12px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-small)}
.book-parts a:hover{background:var(--c-tint)}
.book-parts .pn{font-size:var(--ag-text-caption);font-weight:600;color:var(--c-gold-text)}
.book-parts b{font-weight:600}
.book-parts .n{font-size:var(--ag-text-caption);color:var(--c-text-3);font-variant-numeric:tabular-nums}
.lib-sec{padding-block:var(--ag-section-sm);display:grid;gap:32px}
.lib-sec+.lib-sec{border-top:1px solid var(--c-line)}
.parts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ag-gutter);align-items:start}
.parts-col{display:grid;gap:var(--ag-gutter)}
.part{padding:8px}
.part-head{display:flex;align-items:baseline;gap:10px;padding:14px 12px 10px}
.part-head .pn{font-size:var(--ag-text-caption);font-weight:600;color:var(--c-gold-text);white-space:nowrap}
.part-head h3{font-size:var(--ag-text-title);line-height:var(--ag-leading-title);font-weight:650}
.part-head h3 a:hover{color:var(--c-accent)}
.part-head .n{margin-left:auto;font-size:var(--ag-text-caption);color:var(--c-text-3);white-space:nowrap}
.ch-rows{display:grid}
.ch-row{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:baseline;padding:9px 12px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-body);line-height:24px}
.ch-row:hover{background:var(--c-tint)}
.ch-row .no{font-size:var(--ag-text-small);font-weight:600;color:var(--c-text-3);font-variant-numeric:lining-nums tabular-nums}
.ch-row.extra .no{color:var(--c-gold-text)}
.ch-row[aria-current]{background:var(--c-accent-soft)}
.guide-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ag-gutter)}
.guide{display:flex;flex-direction:column;gap:10px;padding:22px 24px 18px}
.guide .meta{font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);color:var(--c-text-3)}
.guide h3{font-size:var(--ag-text-body);line-height:1.6;font-weight:650}
.guide h3 a:hover{color:var(--c-accent)}
.guide .sub{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2);font-weight:600}
.guide p{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2)}
.guide-foot{margin-top:auto;padding-top:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--c-line)}
.guide-foot .text-link{font-size:var(--ag-text-small)}
.ext{display:inline-flex;align-items:center;gap:4px;font-size:var(--ag-text-caption);color:var(--c-text-3);white-space:nowrap}
.ext:hover{color:var(--c-text)}
.ext svg{width:13px;height:13px}
.groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ag-gutter);align-items:start}
.group{padding:8px}
.group h3{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 12px 8px;font-size:var(--ag-text-body);line-height:24px;font-weight:650}
.group h3 span{font-size:var(--ag-text-caption);font-weight:500;color:var(--c-text-3);white-space:nowrap}
.group li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}
.group li>a:first-child{padding:9px 12px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-small);line-height:var(--ag-leading-small)}
.group li>a:first-child:hover{background:var(--c-tint)}
.group li>:last-child{margin-right:12px}
.sec-more{justify-self:start}
.note-band{background:var(--c-sunken);padding-block:28px}
.note-band p{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2);max-width:64em}
.note-band .text-link{font-size:var(--ag-text-small)}

/* ---------- reading pages ---------- */
.doc-layout{--wrap:1280px;display:grid;grid-template-columns:256px minmax(0,var(--rd-measure)) 208px;justify-content:space-between;gap:48px;padding-block:32px 80px}
.doc-layout.single{--wrap:1200px;grid-template-columns:minmax(0,1fr)}
.doc-side,.doc-rail{position:sticky;top:calc(var(--hd-height) + 24px);align-self:start;max-height:calc(100svh - var(--hd-height) - 48px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.side-title{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:0 10px 12px}
.side-title a{font-size:var(--ag-text-body);font-weight:650}
.side-title a:hover{color:var(--c-accent)}
.side-title span{font-size:var(--ag-text-caption);color:var(--c-text-3);white-space:nowrap}
.side-nav{display:grid;gap:2px}
.side-nav>a,.side-nav details a{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;align-items:baseline;padding:7px 10px;border-radius:var(--ag-radius-sm);font-size:var(--ag-text-small);line-height:20px;color:var(--c-text-2)}
.side-nav>a,.side-nav details a.plain{grid-template-columns:minmax(0,1fr)}
.side-nav details a.sub{grid-template-columns:minmax(0,1fr);margin-left:32px;padding-block:5px;font-size:var(--ag-text-caption);line-height:18px}
.side-nav a:hover{background:rgb(20 35 29 / .04);color:var(--c-text)}
.side-nav a .no{font-size:var(--ag-text-caption);font-weight:600;color:var(--c-text-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.side-nav a .chip{height:20px;padding:0 6px;margin-left:6px;vertical-align:1px}
.side-nav a[aria-current="page"]{background:var(--c-accent-soft);color:var(--c-accent);font-weight:650;box-shadow:inset 0 0 0 1px var(--c-accent-ring)}
.side-nav a[aria-current="page"] .no{color:var(--c-accent)}
.side-nav details{margin-top:6px}
.side-nav summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) 16px;align-items:center;gap:8px;min-height:36px;padding:8px 10px;border-radius:var(--ag-radius-sm);cursor:pointer;font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);font-weight:650;letter-spacing:.04em;color:var(--c-text-3)}
.side-nav summary::-webkit-details-marker{display:none}
.side-nav summary::after{content:"";width:7px;height:7px;border-right:1.5px solid var(--c-text-3);border-bottom:1.5px solid var(--c-text-3);transform:rotate(-45deg);justify-self:center;transition:transform var(--ag-dur) var(--ag-ease-out)}
.side-nav details[open]>summary::after{transform:rotate(45deg)}
.side-nav summary:hover{color:var(--c-text)}
.doc{min-width:0}
.doc-head{display:grid;gap:14px;margin:18px 0 32px;padding-bottom:26px;border-bottom:1px solid var(--c-line)}
.doc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-3)}
.doc-meta a{color:var(--c-text-2);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--c-line-strong)}
.doc-meta span{display:inline-flex;align-items:center;gap:6px}
.doc-source{margin-top:48px;padding:18px 20px;border-radius:var(--ag-radius-md);background:var(--c-sunken);display:grid;gap:10px;font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2);overflow-wrap:anywhere}
.doc-source .label{display:flex;align-items:center;gap:8px;font-weight:650;color:var(--c-text)}
.doc-source code{font:.92em var(--ag-font-mono)}
.doc-source .links{display:flex;flex-wrap:wrap;gap:6px 18px}
.doc-source a:not(.text-link){color:var(--c-accent);text-decoration:underline;text-underline-offset:4px}
.doc-end{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;margin-top:24px}
.pager{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.pager a{display:grid;gap:4px;align-content:start;padding:16px 20px;border-radius:var(--ag-radius-md);background:var(--c-surface);box-shadow:var(--c-raised)}
.pager a:hover{box-shadow:var(--c-floating)}
.pager small{display:flex;align-items:center;gap:6px;font-size:var(--ag-text-caption);color:var(--c-text-3)}
.pager strong{font-size:var(--ag-text-body);line-height:1.6;font-weight:650}
.pager .pager-next{grid-column:2;text-align:right;justify-items:end}
.cta-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px 24px;padding:24px;border-radius:var(--ag-radius-md);background:var(--c-sunken)}
.cta-card h2{font-size:var(--ag-text-title);line-height:var(--ag-leading-title);font-weight:650}
.cta-card p{margin-top:6px;font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2)}
.rail-title{font-size:var(--ag-text-caption);font-weight:650;letter-spacing:.04em;color:var(--c-text-3);padding:0 0 10px 12px}
.outline{display:grid;gap:2px;box-shadow:inset 1px 0 0 var(--c-line)}
.outline a{display:block;padding:6px 0 6px 12px;font-size:var(--ag-text-small);line-height:20px;color:var(--c-text-3)}
.outline a.sub{padding-left:24px;font-size:var(--ag-text-caption);line-height:18px}
.outline a:hover{color:var(--c-text)}
.outline a[aria-current="true"]{color:var(--c-accent);font-weight:650;box-shadow:inset 2px 0 0 var(--c-accent)}
.outline-inline{display:none;margin:-8px 0 28px;padding:10px 16px;border-radius:var(--ag-radius-md);background:var(--c-surface);box-shadow:var(--c-raised);font-size:var(--ag-text-small)}
.outline-inline summary{cursor:pointer;font-weight:650;min-height:28px}
.outline-inline .outline{margin-top:8px}
.rail-card{margin-top:24px;padding:16px;border-radius:var(--ag-radius-md);background:var(--c-sunken);display:grid;gap:8px}
.rail-card h3{font-size:var(--ag-text-small);line-height:20px;font-weight:650}
.rail-card p{font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);color:var(--c-text-2)}
.rail-card .text-link{display:inline;font-size:var(--ag-text-small)}
.rail-card .text-link svg{display:inline;vertical-align:-3px;margin-left:4px}

/* lists inside reading pages (overview, part intro, guide and AI indexes) */
.toc-cards{display:grid;gap:16px;margin-top:40px}
.toc-cards .part-head h2{font-size:var(--ag-text-title);line-height:var(--ag-leading-title);font-weight:650}
.list-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.list-card{display:flex;flex-direction:column;gap:8px;padding:18px 20px 16px}
.list-card .meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption);color:var(--c-text-3)}
.list-card h3{font-size:var(--ag-text-body);line-height:1.6;font-weight:650}
.list-card h3 a:hover{color:var(--c-accent)}
.list-card .sub{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2);font-weight:600}
.list-card p{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2)}
.list-card .guide-foot{margin-top:auto}
.list-group{display:grid;gap:12px;margin-top:40px}
.list-group h2{font-size:var(--ag-text-heading);line-height:var(--ag-leading-heading);font-weight:650}
.list-group>p{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-3);max-width:46em}

/* ---------- prose (book text; markup from build.mjs) ---------- */
.prose{font-size:var(--rd-text);line-height:var(--rd-leading);color:var(--c-text);max-width:var(--rd-measure);overflow-wrap:break-word}
.prose>*+*{margin-top:1em}
.prose h2{margin-top:2.2em;font-size:var(--ag-text-heading);line-height:var(--ag-leading-heading);font-weight:650}
.prose h3{margin-top:1.8em;font-size:var(--ag-text-title);line-height:var(--ag-leading-title);font-weight:650}
.prose h4{margin-top:1.6em;font-size:var(--ag-text-body);line-height:var(--ag-leading-body);font-weight:650}
.prose>h2:first-child,.prose>h3:first-child{margin-top:0}
.prose h2+*,.prose h3+*,.prose h4+*{margin-top:.6em}
.prose strong{font-weight:650;color:inherit}
.prose a:not(.btn){color:var(--c-accent);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--c-accent) 35%,transparent);text-underline-offset:4px}
.prose a:not(.btn):hover{text-decoration-color:currentColor}
.prose ul,.prose ol{padding-left:1.4em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose ul ul,.prose ol ul{list-style:circle}
.prose li{margin-top:.35em}
.prose li>p{margin:.2em 0}
.prose li>ul,.prose li>ol{margin-top:.35em}
.prose li::marker{color:var(--c-text-3)}
.prose blockquote{padding:4px 0 4px 18px;box-shadow:inset 3px 0 0 var(--c-line-strong);color:var(--c-text-2)}
.prose blockquote>*+*{margin-top:.8em}
.prose hr{border:0;border-top:1px solid var(--c-line);margin:2.2em 0}
.prose :not(pre)>code{font:.86em/1 var(--ag-font-mono);padding:.18em .4em;border-radius:var(--ag-radius-xs);background:var(--c-muted);color:var(--c-text);overflow-wrap:anywhere}
.prose p.figure{margin-top:1.6em;text-align:center}
.prose p.figure .img-link{display:inline-block;max-width:100%;border-radius:var(--ag-radius-md)}
.prose img{display:inline-block;max-width:100%;height:auto;vertical-align:middle;border-radius:var(--ag-radius-md);box-shadow:var(--c-img-ring);background:#fff}
.prose p.caption{margin-top:10px;font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-3);text-align:center}
.prose p.caption+*{margin-top:1.6em}
.prose figure{margin-top:1.6em}
.prose p.video{margin-top:1.4em}
.prose figure.diagram{padding:18px;border-radius:var(--ag-radius-md);background:var(--c-surface);box-shadow:var(--c-ring);overflow-x:auto;text-align:center}
.prose pre.mermaid{margin:0;font:13px/1.6 var(--ag-font-mono);white-space:pre;text-align:left;color:var(--c-text-3);background:transparent}
.prose pre.mermaid[data-processed="true"]{text-align:center;white-space:normal}
.prose pre.mermaid svg{height:auto}
.prose figure.diagram.scrolls{text-align:left}
.prose figure.diagram.scrolls pre.mermaid[data-processed="true"]{text-align:left}
.prose p.diagram-hint{margin-top:8px;font-size:var(--ag-text-caption);color:var(--c-text-3);text-align:center}
.media-note{display:block;padding:14px 18px;border-radius:var(--ag-radius-md);background:var(--c-tint);font-size:var(--ag-text-small);line-height:var(--ag-leading-small)}
.media-note a{margin-left:4px}
.external::after{content:"↗";display:inline-block;margin-left:2px;font-size:.78em;text-decoration:none}
/* code: sunken block, monospace, copy button; ASCII layouts and JSON scroll inside the block */
.code{border-radius:var(--ag-radius-md);background:var(--c-code-bg);box-shadow:var(--c-ring);overflow:hidden}
.code-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:0 8px 0 16px;font-size:var(--ag-text-caption);color:var(--c-text-3);box-shadow:inset 0 -1px 0 var(--c-line)}
.code .copy{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:6px;font-size:var(--ag-text-caption);font-weight:600;color:var(--c-text-2)}
.code .copy:hover{background:var(--c-muted);color:var(--c-text)}
.code pre{margin:0;padding:14px 16px 16px;font:14px/1.7 var(--ag-font-mono);white-space:pre-wrap;word-break:break-word;color:var(--c-text);tab-size:2}
.code.code-layout pre{white-space:pre;word-break:normal;overflow-x:auto}
.code pre code{font:inherit;background:none;padding:0;border-radius:0}
/* tables: no outer frame, sunken header; wide tables scroll in their own box */
.table-wrap{overflow-x:auto;border-radius:var(--ag-radius-md);box-shadow:var(--c-ring);background:var(--c-surface);-webkit-overflow-scrolling:touch}
.table-wrap table{width:100%;border-collapse:collapse;font-size:var(--ag-text-small);line-height:var(--ag-leading-small)}
.table-wrap th,.table-wrap td{padding:10px 16px;text-align:left;vertical-align:top;min-width:5.5em}
.table-wrap thead th{font-weight:600;color:var(--c-text-2);background:var(--c-sunken);white-space:nowrap}
.table-wrap tbody tr+tr>*{border-top:1px solid var(--c-line)}
.table-wrap table.kv th{width:7.5em;white-space:nowrap;background:var(--c-sunken);color:var(--c-text-2);font-weight:600}
.table-wrap table.sources{font-size:var(--ag-text-caption);line-height:var(--ag-leading-caption)}
.table-wrap table.sources td{min-width:7em}
/* blocks used by guide, AI and license pages */
.notice{padding:16px 20px;border-radius:var(--ag-radius-md);background:var(--c-tint);font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-2)}
.prose .note{font-size:var(--ag-text-small);line-height:var(--ag-leading-small);color:var(--c-text-3)}
.prose .cta{margin-top:1.6em}
.prose .cta .btn{text-decoration:none;max-width:100%;height:auto;min-height:44px;padding-block:10px;line-height:1.4;white-space:normal;text-align:center}
.prose .cta .btn-primary{color:var(--c-btn-text)}
.prose .cta .btn-ghost{color:var(--c-text)}
.prose .cta .btn.external::after{content:none}
.chapter-list li{margin-top:.35em}

/* ---------- responsive ---------- */
@media (max-width:1279px){
  .doc-layout{grid-template-columns:240px minmax(0,var(--rd-measure));justify-content:start}
  .doc-layout.single{grid-template-columns:minmax(0,1fr)}
  .doc-rail{display:none}
  .outline-inline{display:block}
}
@media (max-width:1180px){.hd-back span{display:none}}
@media (max-width:1100px){
  .lib-hero{grid-template-columns:minmax(0,1fr) 360px;gap:32px}
  .band-grid{grid-template-columns:1fr;gap:40px}
  .parts,.groups,.guide-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1023px){
  .nav,.hd-back{display:none}
  .menu-btn{display:inline-grid}
  .hd-tools{margin-left:auto}
  .doc-layout{grid-template-columns:minmax(0,1fr);justify-content:center;padding-top:16px}
  .doc-side{display:none}
  .outline-inline{display:none}
  .rbar{display:block}
  body.has-rbar{padding-bottom:76px}
}
@media (max-width:860px){
  .lib-hero{grid-template-columns:minmax(0,1fr);padding-block:36px 8px;gap:28px}
  .parts,.groups,.guide-cards,.list-cards{grid-template-columns:1fr}
  .parts-col{gap:16px}
}
@media (max-width:720px){
  .hd-inner{gap:8px}
  .lockup{gap:8px}
  .wordmark{font-size:16px}
  .lockup-sub .long{display:none}
  .hd-cta{height:36px;padding:0 12px}
  .hd-cta .long{display:none}
  .hd-tools{gap:2px}
  .lib-hero-copy{gap:16px}
  .resume-pill{border-radius:var(--ag-radius-md);align-items:flex-start;padding:8px 12px 8px 8px}
  .resume-pill b{white-space:normal;line-height:22px}
  .resume-pill svg{margin-top:3px}
  .lib-hero-copy .cta-actions .btn,.band-copy .cta-actions .btn,.cta-card .cta-actions .btn{flex:1 1 100%}
  .book-cover{padding:22px 20px 20px}
  .book-title{font-size:28px}
  .lib-sec{gap:24px}
  .guide{padding:18px 18px 14px}
  .doc-head{margin:10px 0 24px;padding-bottom:20px;gap:10px}
  .doc-source{padding:16px}
  .cta-card{grid-template-columns:1fr;padding:20px}
  .pager{grid-template-columns:1fr}
  .pager .pager-next{grid-column:1;text-align:left;justify-items:start}
  .code pre{font-size:13px;padding:12px 14px}
  .table-wrap th,.table-wrap td{padding:8px 12px}
  .wb-body{min-height:0;padding:14px}
  .wb-bubble,.wb-lines{display:none}
  .wb-menu{position:static;width:auto;box-shadow:var(--ag-ring-hairline)}
  .ft{padding-block:40px 28px}
  .ft-about,.ft-qr{grid-column:1/-1}
  .ft-cols{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:24px 16px}
  .ft-cols .ft-col{grid-column:auto}
  .ft-qr{justify-self:start;grid-template-columns:72px minmax(0,1fr);align-items:center}
  .ft-qr img{width:72px;height:72px;padding:4px}
  .ft-base{flex-direction:column}
}
/* 320px phones: the 「去用 WorkBuddy 自定义模型」 button fits inside the page-end card (it poked out 3px) */
@media (max-width:359px){.lockup-sub{display:none}.cta-actions .btn{padding-inline:12px;gap:6px;font-size:15px}}
@media print{
  .hd,.doc-side,.doc-rail,.outline-inline,.pager,.cta-card,.rbar,.scrim,.sheet,.ft,.code .copy,.skip{display:none!important}
  body{display:block;background:#fff}
  .doc-layout{display:block;padding:0}
  .external::after{content:""}
}
