*,*::before,*::after{box-sizing:border-box}html,body{margin:0}
  body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;font-size:16px}
  .page{max-width:760px;margin:0 auto;padding-block:clamp(18px,4vw,40px);padding-left:clamp(16px,4vw,32px);padding-right:clamp(16px,4vw,32px)}
  .crumb{font-size:.82rem;color:var(--muted);margin-bottom:12px}.crumb a{color:var(--muted);text-decoration:none}.crumb a:hover{text-decoration:underline}
  h1{font-family:var(--serif);font-weight:500;font-optical-sizing:auto;font-size:clamp(2.1rem,5.5vw,3.1rem);line-height:1.02;letter-spacing:-.01em;margin:0 0 14px;text-wrap:balance}
  .lede{font-size:1.08rem;max-width:66ch;margin:0 0 10px}.lede.muted{color:var(--muted);font-size:1rem}
  h2{font-family:var(--serif);font-weight:500;font-size:1.5rem;letter-spacing:-.01em;margin:36px 0 12px;text-wrap:balance}
  p{max-width:66ch}a{color:var(--grow-ink)}
  ol.howto{padding-left:0;list-style:none;counter-reset:s;display:flex;flex-direction:column;gap:12px;margin:0}
  ol.howto li{counter-increment:s;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
  ol.howto li::before{content:counter(s);font-family:var(--serif);font-weight:600;color:var(--grow-ink);background:color-mix(in srgb,var(--grow) 12%,transparent);border:1px solid color-mix(in srgb,var(--grow) 30%,var(--line));border-radius:50%;width:30px;height:30px;display:grid;place-items:center;font-size:.95rem}
  ol.howto b{display:block}
  .faq details{border-top:1px solid var(--line);padding:14px 0}.faq details:last-child{border-bottom:1px solid var(--line)}
  .faq summary{cursor:pointer;font-weight:600;font-size:1.02rem;list-style:none}.faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"+";float:right;color:var(--muted);font-weight:400}.faq details[open] summary::after{content:"–"}
  .faq p{margin:10px 0 0;color:var(--muted)}
  .related{display:flex;flex-wrap:wrap;gap:8px}
  .related a{font-size:.9rem;font-weight:500;color:var(--grow-ink);background:color-mix(in srgb,var(--grow) 10%,transparent);border:1px solid color-mix(in srgb,var(--grow) 28%,var(--line));border-radius:999px;padding:7px 13px;text-decoration:none}
  footer.foot{margin-top:40px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:.85rem}

  /* widget integration */
  .tool{margin:22px 0 8px}
  .tool h2,.tool h3{margin-top:0}
  ol.howto li{display:block;position:relative;padding-left:46px;min-height:32px}
  ol.howto li::before{position:absolute;left:0;top:0}
  ol.howto li b{display:inline}
  .faq summary{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
  .faq summary::after{float:none;flex:none}
  .tool .tool-bar{display:flex;justify-content:flex-end;gap:12px;margin-bottom:14px}
  .tool-foot{margin:14px 0 0;color:var(--muted);font-size:.85rem}
