:root{
  --navy:#10243F; --steel:#41597A; --rule:#C2CBD7; --ink:#14181D;
  --grey:#6B7280; --pale:#F2F5F8; --bg:#FFFFFF; --sel:#DCE6F2;
  --sans:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --serif:'Palatino Linotype',Palatino,'Book Antiqua',Georgia,serif;
  --mono:ui-monospace,SFMono-Regular,'DejaVu Sans Mono',Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root{--navy:#7FA8DA;--steel:#9DB6D4;--rule:#2A3444;--ink:#E8ECF2;
        --grey:#9AA4B2;--pale:#161C26;--bg:#0E131A;--sel:#1E2A3C;}
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--serif);
  font-size:18px;line-height:1.62;text-rendering:optimizeLegibility}
::selection{background:var(--sel)}
a{color:var(--navy)}
img{max-width:100%}

/* ---------- brand mark ---------- */
.kb{display:inline-flex;align-items:center;justify-content:center;
  background:var(--navy);color:#fff;font-family:var(--sans);font-weight:700;
  border-radius:4px;letter-spacing:.02em;line-height:1}
.kb-sm{width:26px;height:22px;font-size:11px}
.kb-lg{width:74px;height:62px;font-size:31px;border-radius:9px}
@media (prefers-color-scheme:dark){.kb{color:#0E131A}}

/* ---------- header ---------- */
header.top{position:sticky;top:0;z-index:50;background:var(--bg);
  border-bottom:1px solid var(--rule)}
.top-in{max-width:1320px;margin:0 auto;padding:10px 20px;display:flex;
  align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;
  color:var(--ink)}
.brand .wm{font-family:var(--sans);font-weight:600;font-size:13px;
  letter-spacing:.22em;color:var(--navy)}
.brand .co{font-family:var(--sans);font-size:9.5px;letter-spacing:.13em;
  color:var(--grey);display:block;margin-top:2px}
.top nav{margin-left:auto;display:flex;gap:18px;align-items:center;
  font-family:var(--sans);font-size:13.5px}
.top nav a{color:var(--grey);text-decoration:none}
.top nav a:hover{color:var(--navy)}
.btn{font-family:var(--sans);font-size:13.5px;font-weight:500;
  background:var(--navy);color:#fff!important;padding:8px 15px;border-radius:5px;
  text-decoration:none;white-space:nowrap}
@media (prefers-color-scheme:dark){.btn{color:#0E131A!important}}
#menu{display:none;font-family:var(--sans);background:none;border:1px solid
  var(--rule);border-radius:5px;padding:6px 10px;color:var(--ink);cursor:pointer}
.progress{position:fixed;top:0;left:0;height:2px;background:var(--navy);
  width:0;z-index:60;transition:width .1s}

.srch{margin-left:auto;min-width:210px;max-width:330px;flex:1}
.pagefind-ui{--pagefind-ui-scale:.72;--pagefind-ui-primary:var(--navy);
  --pagefind-ui-text:var(--ink);--pagefind-ui-background:var(--bg);
  --pagefind-ui-border:var(--rule);--pagefind-ui-tag:var(--pale);
  --pagefind-ui-border-width:1px;--pagefind-ui-border-radius:6px;
  --pagefind-ui-font:var(--sans)}
.pagefind-ui__drawer{position:absolute;background:var(--bg);z-index:70;
  max-height:70vh;overflow-y:auto;border:1px solid var(--rule);
  border-radius:8px;padding:0 14px 10px;width:min(560px,92vw);
  box-shadow:0 12px 34px rgba(0,0,0,.13);margin-top:6px}
.pagefind-ui__result-title a{font-family:var(--sans);font-size:14px}
.pagefind-ui__result-excerpt{font-size:13px;color:var(--grey)}

/* ---------- layout ---------- */
.wrap{max-width:1320px;margin:0 auto;padding:0 20px;display:grid;
  grid-template-columns:250px minmax(0,1fr) 232px;gap:38px}
aside.nav,aside.toc{font-family:var(--sans);font-size:13.5px;
  position:sticky;top:64px;align-self:start;max-height:calc(100vh - 84px);
  overflow-y:auto;padding:22px 0 40px;scrollbar-width:thin}
aside.nav .pt{font-size:10.5px;letter-spacing:.14em;color:var(--grey);
  margin:16px 0 6px;font-weight:600}
aside.nav a{display:block;padding:3.5px 8px;color:var(--ink);
  text-decoration:none;border-radius:4px;border-left:2px solid transparent;
  line-height:1.35}
aside.nav a:hover{background:var(--pale)}
aside.nav a.cur{color:var(--navy);font-weight:600;border-left-color:var(--navy);
  background:var(--pale)}
aside.nav .cn{color:var(--grey);font-size:11.5px;margin-right:6px}
aside.toc .th{font-size:10.5px;letter-spacing:.14em;color:var(--grey);
  font-weight:600;margin-bottom:8px}
aside.toc a{display:block;padding:3px 0 3px 10px;color:var(--grey);
  text-decoration:none;border-left:2px solid var(--rule);font-size:12.7px;
  line-height:1.35}
aside.toc a:hover,aside.toc a.on{color:var(--navy);border-left-color:var(--navy)}
main{min-width:0;padding:30px 0 90px}

/* ---------- chapter head ---------- */
.chead{margin-bottom:30px}
.chead .num{font-family:var(--sans);font-weight:700;font-size:62px;
  color:var(--navy);line-height:.95;letter-spacing:-.02em}
.chead .lab{font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;
  color:var(--grey);float:right;margin-top:12px}
.chead .bar{border:0;border-top:3px solid var(--navy);margin:6px 0 14px}
.chead h1{font-family:var(--sans);font-weight:700;font-size:33px;line-height:1.2;
  margin:0 0 10px;letter-spacing:-.015em}
.chead .meta{font-family:var(--sans);font-size:12.5px;color:var(--grey);
  display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chead .meta .dot{color:var(--rule)}
.stale{font-family:var(--sans);font-size:12.5px;background:var(--pale);
  border-left:3px solid var(--steel);padding:10px 14px;margin:18px 0;
  border-radius:0 5px 5px 0;color:var(--grey)}

/* ---------- body typography ---------- */
main h2{font-family:var(--sans);font-weight:700;font-size:22px;color:var(--navy);
  margin:44px 0 4px;padding-bottom:6px;border-bottom:1px solid var(--rule);
  letter-spacing:-.01em;line-height:1.3}
main h3{font-family:var(--sans);font-weight:600;font-size:15.5px;margin:26px 0 6px;
  display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;line-height:1.35}
main h3 .h-txt{flex:1;min-width:0}
main h3::before{content:"";width:8px;height:8px;background:var(--navy);
  border-radius:2px;flex:none;transform:translateY(-1px)}
h3.blk-plain::before{background:var(--steel)}
h3.blk-tech::before{background:var(--navy)}
h3.blk-words::before{background:var(--grey)}
.blk-tag{font-family:var(--sans);font-size:9.5px;font-weight:700;
  letter-spacing:.13em;padding:2.5px 7px;border-radius:3px;flex:none;
  background:var(--pale);color:var(--steel);border:1px solid var(--rule)}
h3.blk-tech .blk-tag{background:var(--navy);color:#fff;border-color:var(--navy)}
@media (prefers-color-scheme:dark){h3.blk-tech .blk-tag{color:#0E131A}}
.anchor{opacity:0;text-decoration:none;color:var(--rule);font-weight:400;
  font-size:14px;flex:none}
h2:hover .anchor,h3:hover .anchor{opacity:1}
main ol,main ul{padding-left:1.5em;margin:10px 0}
main li{margin:5px 0}
main ol{counter-reset:none}
main ol>li::marker{color:var(--steel);font-family:var(--sans);font-size:.86em}
main ul>li::marker{color:var(--steel)}
main p{margin:12px 0}
main strong{font-weight:600}
code{font-family:var(--mono);font-size:.83em;background:var(--pale);
  padding:2px 5px;border-radius:3px;word-break:break-word}
pre{font-family:var(--mono);font-size:12.6px;line-height:1.5;background:var(--pale);
  border-left:3px solid var(--steel);padding:14px 16px;overflow-x:auto;
  border-radius:0 5px 5px 0;margin:16px 0}
pre code{background:none;padding:0;font-size:inherit;word-break:normal}
.tw{overflow-x:auto;margin:18px 0;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;font-family:var(--sans);font-size:13.5px;
  width:100%;min-width:420px}
th{text-align:left;font-weight:600;color:var(--navy);border-bottom:2px solid
  var(--navy);padding:9px 11px;white-space:nowrap}
td{border-bottom:1px solid var(--rule);padding:8px 11px;vertical-align:top}
tr:last-child td{border-bottom:2px solid var(--navy)}
a.xref{text-decoration:none;border-bottom:1px solid var(--rule);
  white-space:nowrap}
a.xref:hover{border-bottom-color:var(--navy)}
blockquote{border-left:3px solid var(--rule);margin:16px 0;padding:2px 0 2px 16px;
  color:var(--grey)}

/* ---------- prev / next ---------- */
.pn{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:56px;
  font-family:var(--sans)}
.pn a{display:block;padding:16px 18px;border:1px solid var(--rule);
  border-radius:7px;text-decoration:none;color:var(--ink)}
.pn a:hover{border-color:var(--navy);background:var(--pale)}
.pn .k{font-size:10.5px;letter-spacing:.14em;color:var(--grey);display:block;
  margin-bottom:5px}
.pn .t{font-weight:600;font-size:14.5px;line-height:1.35}
.pn .nx{text-align:right}

/* ---------- landing ---------- */
.hero{text-align:center;padding:66px 20px 46px;border-bottom:1px solid var(--rule)}
.hero h1{font-family:var(--sans);font-weight:700;font-size:clamp(34px,6vw,62px);
  margin:22px 0 12px;letter-spacing:-.025em;line-height:1.05}
.hero .sub{font-family:var(--sans);font-size:clamp(15px,2.4vw,21px);
  color:var(--steel);margin-bottom:18px}
.hero .by{font-family:var(--sans);font-size:14px;color:var(--grey);
  margin-bottom:26px;line-height:1.7}
.hero .by b{color:var(--ink);font-weight:600;font-size:16px}
.stats{display:flex;justify-content:center;gap:34px;flex-wrap:wrap;
  font-family:var(--sans);margin:30px 0 6px}
.stats div{text-align:center}
.stats .n{font-size:27px;font-weight:700;color:var(--navy);line-height:1}
.stats .l{font-size:10.5px;letter-spacing:.13em;color:var(--grey);margin-top:5px}
.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.btn2{font-family:var(--sans);font-size:14px;font-weight:500;border:1px solid
  var(--rule);color:var(--ink)!important;padding:11px 20px;border-radius:6px;
  text-decoration:none}
.btn2:hover{border-color:var(--navy)}
.sec{max-width:1000px;margin:0 auto;padding:52px 20px}
.sec h2{font-family:var(--sans);font-size:13px;letter-spacing:.16em;
  color:var(--grey);font-weight:600;margin:0 0 22px;border:0}
.partcard{border:1px solid var(--rule);border-radius:9px;padding:22px 24px;
  margin-bottom:16px}
.partcard:hover{border-color:var(--navy)}
.partcard .pl{font-family:var(--sans);font-size:10.5px;letter-spacing:.16em;
  color:var(--grey)}
.partcard h3{font-family:var(--sans);font-size:21px;font-weight:700;
  margin:5px 0 7px}
.partcard h3 a{text-decoration:none;color:var(--ink)}
.partcard p{font-size:15px;color:var(--grey);margin:0 0 13px}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chips a{font-family:var(--sans);font-size:12.5px;padding:5px 11px;
  border:1px solid var(--rule);border-radius:20px;text-decoration:none;
  color:var(--ink)}
.chips a:hover{border-color:var(--navy);color:var(--navy)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));
  gap:16px}
.card{border:1px solid var(--rule);border-radius:9px;padding:20px 22px}
.card h3{font-family:var(--sans);font-size:16.5px;margin:0 0 7px}
.card p{font-size:14.5px;color:var(--grey);margin:0}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);margin-top:60px;padding:34px 20px 46px;
  font-family:var(--sans);font-size:13px;color:var(--grey)}
.fin{max-width:1320px;margin:0 auto;display:flex;gap:24px;flex-wrap:wrap;
  align-items:center}
footer a{color:var(--grey);text-decoration:none}
footer a:hover{color:var(--navy)}
.fin .r{margin-left:auto;text-align:right;font-size:12px}

/* ---------- responsive ---------- */
@media(max-width:1180px){
  .wrap{grid-template-columns:230px minmax(0,1fr);gap:30px}
  aside.toc{display:none}
}
@media(max-width:900px){
  body{font-size:17px}
  .top-in{flex-wrap:wrap;gap:9px 12px}
  .srch{order:5;flex:1 1 100%;min-width:0;max-width:none;margin-left:0}
  .brand .co{display:none}
  .top nav{margin-left:auto}
  .wrap{grid-template-columns:1fr;padding:0 16px}
  aside.nav{display:none;position:static;max-height:none;
    border-bottom:1px solid var(--rule);padding-bottom:20px}
  aside.nav.open{display:block}
  #menu{display:block}
  .top nav a.hidem{display:none}
  .chead .num{font-size:46px}
  .chead h1{font-size:26px}
  main h2{font-size:19.5px}
  .pn{grid-template-columns:1fr}
  .pn .nx{text-align:left}
}
@media print{
  header.top,aside,.pn,footer,.progress{display:none}
  .wrap{display:block}
  body{font-size:11pt}
}