.pg-showcase{border-block:1px solid var(--line,#d2cdbf);padding:32px 0;margin:32px 0}.pg-showcase h2{font-size:clamp(28px,4vw,42px);line-height:1.15;margin:12px 0 20px}.pg-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.pg-tabs button[aria-pressed=true]{background:var(--ink,#171711);color:var(--paper,#f6f4ed)}.pg-example-body{max-width:850px}.pg-task{font-size:1.12em;max-width:44em}.pg-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:28px 0}.pg-steps li{border-top:2px solid var(--line,#d2cdbf);padding-top:14px}.pg-steps span{font-family:monospace;color:var(--red,#cf3018);font-size:20px}.pg-steps p{font-size:16px;line-height:1.6}.pg-showcase>.small{margin-top:16px}.pg-route-example,.pg-card-example{margin:24px 0;padding:16px 0;border-block:1px solid var(--line,#d2cdbf)}.pg-route-example summary,.pg-card-example summary,.pg-demo summary,.pg-history summary{cursor:pointer;padding:8px 0;min-height:44px}.pg-summary{margin:28px 0;padding-block:24px;border-block:1px solid var(--line,#d2cdbf)}.pg-summary li,.pg-demo li{padding:10px 0}.pg-summary p,.pg-demo li p{white-space:pre-wrap;overflow-wrap:anywhere}.pg-demo textarea{width:100%;box-sizing:border-box;font:inherit;padding:16px;background:transparent;color:inherit;border:1px solid var(--line,#d2cdbf)}.pg-demo .field{margin:28px 0}.pg-demo>.linkbtn{margin-top:20px}.pg-history details{border-top:1px solid var(--line,#d2cdbf);padding:12px 0}.pg-tabs button{transition:background-color .15s,color .15s}.pg-showcase button:focus-visible,.pg-demo button:focus-visible{outline:2px solid currentColor;outline-offset:4px}@media(max-width:650px){.pg-steps{grid-template-columns:1fr;gap:12px}.pg-steps li{display:grid;grid-template-columns:30px 1fr;gap:12px}.pg-steps p{margin:0}.pg-tabs{display:grid;grid-template-columns:1fr 1fr}.pg-tabs button{padding:12px 8px}.pg-showcase{padding:24px 0}.pg-showcase>.btn{width:100%}}@media(prefers-reduced-motion:reduce){.pg-tabs button{transition:none}}