/* Writing Tools — Ghost theme layer. Built 2026-07-03 from the Claude Design handoff.
   Tokens: bg #fbfcfd · ink #2b2c32 · body #404149 · muted #6f7378 · quiet #8b9097
   faint #c3c8cd · dot #d6dade · hairline #e2e5e9 · chipborder #dfe2e6 · activebg #eef2f6
   accent #356fad (hover #2a5a8d) · radius 0 · no shadows */

.wt { margin:0; background:#fbfcfd; color:#404149; font-family:Inter,sans-serif;
      -webkit-font-smoothing:antialiased; }
.wt a { text-decoration:none; color:inherit; transition:color 180ms cubic-bezier(0.2,0.7,0.2,1); }

/* ---------- shared chrome ---------- */
.wt-header { display:flex; align-items:center; justify-content:space-between;
             padding:0 40px; height:64px; }
.wt-header--wide { padding:0 64px; }
.wt-brand { display:flex; align-items:baseline; gap:24px; }
.wt-wordmark { font-family:Archivo,sans-serif; font-size:19px; letter-spacing:-0.01em; color:#404149; }
.wt-wordmark b { font-weight:700; } .wt-wordmark span { font-weight:400; }
.wt-sectionmark { font-size:13px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:#6f7378; }
.wt-header-cta { font-size:14px; font-weight:500; color:#356fad; }
.wt-header a:hover { color:#356fad; }
.wt-header-cta:hover { color:#2a5a8d !important; }

.wt-rail-top { display:flex; gap:22px; align-items:baseline; padding:0 40px;
  border-bottom:1px solid #e2e5e9; font-size:13px; font-weight:500; color:#6f7378;
  overflow-x:auto; white-space:nowrap; scrollbar-width:none;
  position:sticky; top:0; background:#fbfcfd; z-index:10; }
.wt-rail-top::-webkit-scrollbar { display:none; }
.wt-rail-top--wide { padding:0 64px; }
.wt-rail-top a { padding:12px 0 11px; color:#6f7378; }
.wt-rail-top a:hover { color:#356fad; }
.wt-rail-top a.is-active { padding-bottom:9px; color:#2b2c32; font-weight:600; border-bottom:2px solid #356fad; }

.wt-footer { border-top:1px solid #e2e5e9; padding:28px 40px; display:flex;
  justify-content:space-between; font-size:13px; color:#8b9097; }

/* recurring kicker */
.wt-kicker { font-size:11px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase;
             color:#8b9097; margin:0 0 12px; }

/* ---------- entry: three-column shell ---------- */
.wt-shell { display:grid; grid-template-columns:260px minmax(0,1fr) 240px; gap:0;
            max-width:1440px; margin:0 auto; }
.wt-left { border-right:1px solid #e2e5e9; padding:36px 28px 64px 40px; }
.wt-left-inner, .wt-right-inner { position:sticky; top:76px; }
.wt-left-collection { display:block; font-size:12px; font-weight:600; letter-spacing:0.14em;
  text-transform:uppercase; color:#8b9097; margin:0 0 8px; }
.wt-left-collection:hover { color:#356fad; }
.wt-left-framing { font-size:13px; line-height:1.5; color:#8b9097; margin:0 0 24px; }
.wt-left-list { display:grid; font-size:14px; line-height:1.4; }
.wt-left-list a { padding:8px 12px; color:#6f7378; }
.wt-left-list a:hover { color:#356fad; }
.wt-left-list a.is-active { color:#2b2c32; font-weight:600; background:#eef2f6;
  border-left:2px solid #356fad; }
.wt-other { border-top:1px solid #e2e5e9; margin-top:28px; padding-top:24px; }
.wt-other-list { display:grid; gap:10px; font-size:13.5px; color:#6f7378; line-height:1.4; }
.wt-other-list a:hover { color:#356fad; }
.wt-other-list .wt-other-col { color:#c3c8cd; }

.wt-article { padding:48px 72px 0; min-width:0; }
.wt-article h1 { font-family:Archivo,sans-serif; font-size:52px; font-weight:700;
  letter-spacing:-0.025em; line-height:1.04; margin:0 0 20px; color:#2b2c32; }
.wt-dek { font-size:21px; line-height:1.5; font-style:italic; color:#6f7378;
  margin:0 0 24px; max-width:34em; }
.wt-meta { display:flex; flex-wrap:wrap; gap:20px; align-items:center; font-size:13px;
  color:#8b9097; padding-bottom:32px; border-bottom:1px solid #e2e5e9; margin-bottom:40px; }
.wt-meta .dot { color:#d6dade; }

/* body content (rendered post HTML) */
.wt-body { font-size:17px; line-height:1.65; }
.wt-body > * { max-width:40em; }
.wt-body p { margin:0 0 24px; }
.wt-body h2 { font-family:Archivo,sans-serif; font-size:27px; font-weight:600;
  letter-spacing:-0.015em; margin:52px 0 20px; color:#2b2c32; }
.wt-body a { color:#356fad; text-decoration:underline; text-decoration-thickness:1px;
  text-underline-offset:0.15em; }
.wt-body a:hover { color:#2a5a8d; }

/* citation figure (ledger) — built by wt.js from blockquote + caption line */
.wt-ledger { margin:0 0 24px; max-width:44em; }
.wt-ledger figcaption { display:flex; align-items:baseline; justify-content:space-between;
  gap:24px; padding-bottom:12px; border-bottom:2px solid #2b2c32; margin-bottom:20px; }
.wt-ledger .src, .wt-ledger .date { font-size:12px; font-weight:600; letter-spacing:0.14em;
  text-transform:uppercase; }
.wt-ledger .src { color:#2b2c32; } .wt-ledger .date { color:#356fad; }
.wt-ledger blockquote { margin:0; padding:0; border:0; font-size:21px; line-height:1.55; color:#404149; }

/* model inset — blockquote/paragraph beginning "Model:" */
.wt-model { display:grid; grid-template-columns:56px 1fr; max-width:44em; margin:0 0 28px; }
.wt-model .bar { padding-top:9px; }
.wt-model .bar span { width:24px; height:2px; background:#356fad; display:inline-block; }
.wt-model p { font-family:'Source Serif 4',serif; font-size:20px; line-height:1.6;
  margin:0; color:#404149; }

/* before/after pair — 2-column table */
.wt-pair { display:grid; grid-template-columns:1fr 1fr; border:1px solid #e2e5e9;
  max-width:44em; margin:0 0 28px; }
.wt-pair .cell { padding:24px 28px 28px; }
.wt-pair .cell:first-child { border-right:1px solid #e2e5e9; }
.wt-pair .cell:last-child { border-top:2px solid #356fad; margin-top:-1px; }
.wt-pair .label { font-size:11px; font-weight:600; letter-spacing:0.16em;
  text-transform:uppercase; margin:0 0 14px; }
.wt-pair .cell:first-child .label { color:#8b9097; }
.wt-pair .cell:last-child .label { color:#356fad; }
.wt-pair .text { font-family:'Source Serif 4',serif; font-size:17px; line-height:1.6; margin:0; }
.wt-pair .cell:first-child .text { color:#6f7378; }
.wt-pair .cell:last-child .text { color:#404149; }

/* pull-quote — bare blockquote */
.wt-pull { margin:0 0 52px; padding:32px 0; border-top:2px solid #2b2c32;
  border-bottom:1px solid #e2e5e9; max-width:44em; }
.wt-pull p { font-family:Archivo,sans-serif; font-size:30px; font-weight:600;
  letter-spacing:-0.02em; line-height:1.25; margin:0; color:#2b2c32; max-width:24em; }

/* comparison table (>2 cols) */
.wt-body table { border-collapse:collapse; width:100%; max-width:44em; margin:0 0 28px;
  font-size:15px; line-height:1.5; }
.wt-body th { font-size:11px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase;
  color:#8b9097; text-align:left; padding:10px 16px; border-bottom:2px solid #2b2c32; }
.wt-body td { padding:12px 16px; border-bottom:1px solid #e2e5e9; vertical-align:top; }

/* Try it */
.wt-tryit { border-top:1px solid #e2e5e9; padding:40px 0 52px; max-width:44em; }
.wt-tryit h2 { font-size:16px !important; letter-spacing:0.14em; text-transform:uppercase;
  margin:0 0 24px !important; }
.wt-tryit ol { margin:0; padding:0; list-style:none; display:grid; gap:16px;
  font-size:17px; line-height:1.55; counter-reset:wt; }
.wt-tryit li { position:relative; padding-left:40px; counter-increment:wt; }
.wt-tryit li::before { content:counter(wt,decimal-leading-zero);
  position:absolute; left:0; top:0;
  font-family:Archivo,sans-serif; font-weight:600; color:#356fad; }

/* Drawn from */
.wt-drawn { border-top:1px solid #e2e5e9; padding:36px 0 48px; max-width:44em; }
.wt-drawn ul { margin:0; padding:0; list-style:none; display:grid; gap:10px;
  font-size:15px; line-height:1.45; color:#6f7378; }
.wt-drawn a { color:#356fad; font-weight:500; }
.wt-drawn a:hover { color:#2a5a8d; }

/* join module */
.wt-join { border:1px solid #2b2c32; padding:36px 40px; margin:0 0 64px; max-width:44em; }
.wt-join .wt-kicker { color:#356fad; margin-bottom:14px; font-size:12px; }
.wt-join p { font-size:17px; line-height:1.6; margin:0 0 18px; max-width:36em; }
.wt-join a { font-size:15px; font-weight:600; color:#356fad;
  border-bottom:1px solid #356fad; padding-bottom:1px; }
.wt-join a:hover { color:#2a5a8d; border-color:#2a5a8d; }

/* right rail TOC */
.wt-right { padding:48px 40px 64px 8px; }
.wt-toc { display:grid; border-left:1px solid #e2e5e9; font-size:13.5px; }
.wt-toc a { padding:6px 0 6px 15px; color:#6f7378; }
.wt-toc a:hover { color:#356fad; }
.wt-toc a.is-active { padding-left:14px; color:#404149; font-weight:500;
  border-left:2px solid #356fad; margin-left:-1px; }

/* mobile TOC disclosure */
.wt-toc-disclosure { display:none; }

/* ---------- collection page ---------- */
.wt-col-main { max-width:1216px; margin:0 auto; padding:72px 64px 0; }
.wt-crumb { font-size:12px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase;
  margin:0 0 28px; }
.wt-crumb a { color:#8b9097; } .wt-crumb a:hover { color:#356fad; }
.wt-crumb .sep { color:#c3c8cd; padding:0 8px; } .wt-crumb .here { color:#356fad; }
.wt-col-head { display:grid; grid-template-columns:1fr 380px; gap:88px; align-items:end;
  padding-bottom:48px; border-bottom:2px solid #2b2c32; }
.wt-col-head h1 { font-family:Archivo,sans-serif; font-size:64px; font-weight:700;
  letter-spacing:-0.025em; line-height:1.02; margin:0; color:#2b2c32; }
.wt-col-facts { font-size:13px; color:#8b9097; line-height:1.7; text-align:left; }
.wt-overview { font-size:22px; line-height:1.55; color:#404149; max-width:36em;
  margin:44px 0 72px; }
.wt-ledger-list { display:grid; counter-reset:wtrow; }
.wt-row { display:grid; grid-template-columns:72px 1fr 380px 120px; gap:32px;
  align-items:baseline; padding:28px 0; border-bottom:1px solid #e2e5e9; counter-increment:wtrow; }
.wt-row .num { font-family:Archivo,sans-serif; font-size:15px; font-weight:600; color:#356fad; }
.wt-row .num::before { content:counter(wtrow,decimal-leading-zero); }
.wt-row .title { font-family:Archivo,sans-serif; font-size:24px; font-weight:600;
  letter-spacing:-0.015em; color:#2b2c32; }
.wt-row:hover .title { color:#356fad; }
.wt-row .dek { font-size:15px; font-style:italic; line-height:1.5; color:#6f7378; }
.wt-row .date { font-size:13px; color:#8b9097; text-align:right; }
.wt-chips { padding:48px 0 72px; }
.wt-chip-strip { display:flex; flex-wrap:wrap; gap:10px; }
.wt-chip { font-size:13px; font-weight:500; padding:7px 14px; border:1px solid #dfe2e6;
  color:#404149; }
.wt-chip:hover { color:#356fad; border-color:#356fad; }

/* ---------- index ---------- */
.wt-hero { max-width:800px; }
.wt-hero h1 { font-family:Archivo,sans-serif; font-size:76px; font-weight:700;
  letter-spacing:-0.028em; line-height:0.98; margin:0 0 24px; color:#2b2c32; }
.wt-hero .dek { font-size:22px; line-height:1.5; color:#6f7378; margin:0 0 32px; max-width:30em; }
.wt-stats { font-size:13px; color:#8b9097; padding-bottom:28px; }
.wt-stats b { color:#356fad; font-weight:600; }
.wt-rule { border-bottom:2px solid #2b2c32; }
.wt-index-grid { display:grid; grid-template-columns:1fr 300px; gap:88px; padding:8px 0 72px; }
.wt-colrow { padding:32px 0; border-bottom:1px solid #e2e5e9;
  display:grid; grid-template-columns:1fr 340px; gap:64px; }
.wt-colrow h3 { font-family:Archivo,sans-serif; font-size:30px; font-weight:600;
  letter-spacing:-0.02em; margin:0 0 10px; color:#2b2c32; }
.wt-colrow h3 a:hover { color:#356fad; }
.wt-colrow .framing { font-size:15px; line-height:1.55; color:#6f7378; margin:0; }
.wt-colrow .recent { display:grid; gap:10px; font-size:14px; font-weight:500; align-content:start; }
.wt-colrow .recent a { color:#404149; } .wt-colrow .recent a:hover { color:#356fad; }
.wt-colrow .count { color:#8b9097; font-weight:400; }
.wt-recent-rail .row { padding:16px 0; border-bottom:1px solid #e2e5e9; }
.wt-recent-rail .row a { font-size:15px; font-weight:500; color:#404149; display:block; }
.wt-recent-rail .row a:hover { color:#356fad; }
.wt-recent-rail .sub { font-size:12px; color:#8b9097; margin-top:4px; }
.wt-joinband { border:1px solid #2b2c32; padding:40px 48px; margin:0 0 72px;
  display:grid; grid-template-columns:1fr auto; gap:48px; align-items:center; }
.wt-joinband .btn { font-size:15px; font-weight:600; color:#2b2c32;
  border:1px solid #2b2c32; padding:14px 28px; }
.wt-joinband .btn:hover { color:#356fad; border-color:#356fad; }

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .wt-shell { grid-template-columns:1fr; }
  .wt-left, .wt-right { display:none; }
  .wt-article { padding:32px 20px 0; }
  .wt-article h1 { font-size:36px; }
  .wt-dek { font-size:18px; }
  .wt-toc-disclosure { display:block; border:1px solid #e2e5e9; margin:0 0 32px; max-width:40em; }
  .wt-toc-disclosure summary { list-style:none; cursor:pointer; display:flex;
    justify-content:space-between; align-items:center; padding:14px 16px; }
  .wt-toc-disclosure summary::-webkit-details-marker { display:none; }
  .wt-toc-disclosure summary::after { content:"›"; transform:rotate(90deg);
    color:#8b9097; font-size:16px; }
  .wt-toc-disclosure[open] summary::after { transform:rotate(-90deg); }
  .wt-toc-disclosure .wt-toc { border-left:0; padding:0 16px 14px; }
  .wt-in-collection { display:block; border-top:1px solid #e2e5e9; padding:36px 0 48px; max-width:44em; }
  .wt-pair { grid-template-columns:1fr; }
  .wt-pair .cell:first-child { border-right:0; border-bottom:1px solid #e2e5e9; }
  .wt-pull p { font-size:24px; }
  .wt-ledger blockquote { font-size:19px; }
  .wt-header, .wt-rail-top, .wt-footer { padding-left:20px; padding-right:20px; }
  .wt-header { height:56px; }
  .wt-wordmark { font-size:16px; } .wt-sectionmark { font-size:11px; }
  .wt-rail-top { gap:18px; }
  .wt-col-main { padding:40px 20px 0; }
  .wt-col-head { grid-template-columns:1fr; gap:16px; padding-bottom:24px; }
  .wt-col-head h1 { font-size:34px; }
  .wt-overview { font-size:18px; margin:28px 0 40px; }
  .wt-row { grid-template-columns:44px 1fr; gap:12px; row-gap:6px; }
  .wt-row .num { grid-row:1 / span 3; }
  .wt-row .dek, .wt-row .date { grid-column:2; text-align:left; }
  .wt-hero h1 { font-size:42px; }
  .wt-hero .dek { font-size:18px; }
  .wt-index-grid { grid-template-columns:1fr; gap:40px; }
  .wt-colrow { grid-template-columns:1fr; gap:16px; }
  .wt-joinband { grid-template-columns:1fr; gap:24px; padding:28px 20px; }
}
@media (min-width:1101px){
  .wt-in-collection { display:none; }
  .wt-toc-disclosure { display:none; }
}
@media (min-width:1101px) and (max-width:1280px){
  .wt-shell { grid-template-columns:220px minmax(0,1fr) 210px; }
  .wt-article { padding:48px 48px 0; }
}