.playbook--wa{--playbook-ink: var(--wa-ink);--playbook-text: var(--wa-muted);--playbook-subtle: var(--wa-subtle);--playbook-line: var(--wa-line);--playbook-accent: var(--wa-blue);--playbook-accent-soft: var(--wa-blue-soft);--playbook-chat: var(--wa-chat);--playbook-bubble: var(--wa-bubble);--playbook-utility: var(--wa-deep);--playbook-utility-soft: var(--wa-mint);--playbook-marketing: var(--wa-orange);--playbook-marketing-soft: var(--wa-orange-soft);--playbook-auth: var(--wa-violet);--playbook-auth-soft: var(--wa-violet-soft)}.playbook--cr{--playbook-ink: var(--cr-ink);--playbook-text: var(--cr-text);--playbook-subtle: var(--cr-subtle);--playbook-line: var(--cr-line);--playbook-accent: var(--cr-accent);--playbook-accent-soft: var(--cr-sand);--playbook-chat: var(--cr-sand);--playbook-bubble: var(--cr-paper);--playbook-utility: var(--cr-green);--playbook-utility-soft: var(--cr-paper);--playbook-marketing: var(--cr-accent-deep);--playbook-marketing-soft: var(--cr-paper);--playbook-auth: var(--cr-blue);--playbook-auth-soft: var(--cr-paper)}.playbook-head{align-items:flex-start;text-align:left;max-width:860px}.playbook .playbook-head h2{max-width:24ch;font-size:clamp(28px,3.4vw,42px);line-height:1.15}.playbook-intro{margin:0;font-size:18px;line-height:1.65;color:var(--playbook-text)}.playbook-body{display:grid;gap:var(--spacing-40);max-width:860px}.playbook-body--split{max-width:none;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);align-items:start}.playbook-parts{display:flex;flex-direction:column;gap:var(--spacing-32)}.playbook-part h3,.playbook-templates h3{margin:0 0 var(--spacing-12);font-size:21px;line-height:1.3;color:var(--playbook-ink)}.playbook-guides{padding-top:var(--spacing-32);border-top:1px solid var(--playbook-line)}.playbook-guides__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--spacing-8) var(--spacing-24);margin-bottom:var(--spacing-24)}.playbook-guides__title{margin:0;font-size:clamp(22px,2.2vw,26px);line-height:1.25;letter-spacing:-.01em;color:var(--playbook-ink)}.playbook-guides__all{display:inline-flex;align-items:center;gap:var(--spacing-6);font-size:15px;font-weight:var(--font-weight-semibold);color:var(--playbook-accent);text-decoration:none}.playbook-guides__all i{transition:transform .2s ease}.playbook-guides__all:hover{color:var(--playbook-accent);text-decoration:underline;text-underline-offset:3px}.playbook-guides__all:hover i{transform:translate(3px)}.playbook-guides__all:focus-visible{outline:2px solid var(--playbook-accent);outline-offset:3px;border-radius:var(--radius-4)}.playbook-part p{margin:0 0 var(--spacing-12);font-size:16px;line-height:1.7;color:var(--playbook-text)}.playbook-part a,.playbook-intro a{color:var(--playbook-accent);text-decoration:underline;text-underline-offset:3px}.playbook-part a:hover,.playbook-intro a:hover{color:var(--playbook-ink)}.playbook-list{display:flex;flex-direction:column;gap:var(--spacing-10);margin:0;padding:0;list-style:none;font-size:16px;line-height:1.65;color:var(--playbook-text)}.playbook-list>li{position:relative;padding-left:var(--spacing-24)}.playbook-list>li:before{content:"";position:absolute;left:4px;top:.68em;width:7px;height:7px;border-radius:var(--radius-1000);background:var(--playbook-accent)}.playbook-list--steps{counter-reset:playbook-step}.playbook-list--steps>li{padding-left:40px;counter-increment:playbook-step}.playbook-list--steps>li:before{content:counter(playbook-step);top:.1em;left:0;width:26px;height:26px;display:grid;place-items:center;font-size:13px;font-weight:var(--font-weight-bold);line-height:1;color:var(--playbook-accent);background:var(--playbook-accent-soft)}.playbook-templates{position:sticky;top:96px;padding:var(--spacing-24);border-radius:var(--radius-24);background:var(--playbook-chat)}.playbook-templates__list{display:flex;flex-direction:column;gap:var(--spacing-16);margin:0;padding:0;list-style:none}.playbook-tpl{padding:var(--spacing-12) var(--spacing-16) var(--spacing-16);border-radius:var(--radius-16) var(--radius-16) var(--radius-4) var(--radius-16);background:var(--playbook-bubble)}.playbook-tpl__meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--spacing-8);margin:0 0 var(--spacing-8)}.playbook-tpl__meta code{padding:0;font-size:12px;color:var(--playbook-subtle);background:none;overflow-wrap:anywhere}.playbook-tpl__cat{padding:2px 10px;border-radius:var(--radius-1000);font-size:12px;font-weight:var(--font-weight-semibold);color:var(--playbook-utility);background:var(--playbook-utility-soft)}.playbook-tpl__cat--marketing{color:var(--playbook-marketing);background:var(--playbook-marketing-soft)}.playbook-tpl__cat--authentication{color:var(--playbook-auth);background:var(--playbook-auth-soft)}.playbook-tpl__body{margin:0;font-size:15px;line-height:1.6;color:var(--playbook-ink);white-space:pre-line}.playbook-tpl__var{font-weight:var(--font-weight-semibold);color:var(--playbook-accent)}.playbook-guides__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--spacing-24);margin:0;padding:0;list-style:none}.playbook-guide{display:flex;flex-direction:column;gap:var(--spacing-8);height:100%;color:var(--playbook-ink);text-decoration:none}.playbook-guide__img{width:100%;height:auto;aspect-ratio:1200 / 630;-o-object-fit:cover;object-fit:cover;-o-object-position:left center;object-position:left center;margin-bottom:var(--spacing-4);border:1px solid var(--playbook-line);border-radius:var(--radius-16)}.playbook-guide__meta{font-size:13px;color:var(--playbook-subtle)}.playbook-guide__title{font-size:17px;line-height:1.4}.playbook-guide:hover .playbook-guide__title,.playbook-guide:focus-visible .playbook-guide__title{color:var(--playbook-accent);text-decoration:underline;text-underline-offset:3px}.playbook-guide:focus-visible{outline:2px solid var(--playbook-accent);outline-offset:4px;border-radius:var(--radius-16)}@media(max-width:991.98px){.playbook-body--split{grid-template-columns:minmax(0,1fr)}.playbook-templates{position:static}.playbook-guides__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:575.98px){.playbook-intro{font-size:16px}.playbook-templates{padding:var(--spacing-16)}.playbook-guides__grid{grid-template-columns:minmax(0,1fr)}}
