.pp-preview{max-inline-size:76rem;margin-inline:auto;padding-block:clamp(1.5rem,4vw,3rem);padding-inline:clamp(1rem,4vw,2.5rem)}.pp-preview__header{max-inline-size:58rem;margin-block-end:2.5rem}.pp-preview__eyebrow{color:var(--pp-muted);margin:0;font-size:.875rem}.pp-preview__header h1{margin-block:.5rem 0;font-size:clamp(2.5rem,7vw,4.5rem);line-height:1.05}.pp-preview__header>p:not(.pp-preview__eyebrow){max-inline-size:58ch;color:var(--pp-muted);margin-block:.875rem 0}.pp-preview__themes{flex-wrap:wrap;gap:.5rem;margin-block-start:1.5rem;display:inline-flex}.pp-preview__themes button{border:1px solid var(--pp-border);background:var(--pp-surface);min-block-size:44px;color:var(--pp-ink);cursor:pointer;border-radius:99px;padding-block:.5rem;padding-inline:1rem}.pp-preview__themes button[aria-pressed=true]{border-color:var(--pp-primary);background:var(--pp-primary);color:var(--pp-on-primary)}.pp-preview__columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,5vw,4rem);display:grid}.pp-preview__columns h2,.pp-preview__states h2{margin-block:0 1rem;font-size:1.6rem}.pp-preview__states{margin-block-start:3rem}.pp-preview__state-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;display:grid}.pp-preview__state-grid>*{border:1px solid var(--pp-border);border-radius:var(--pp-radius-card);background:var(--pp-surface);min-inline-size:0}.pp-preview__retry{color:var(--pp-muted);font-size:.875rem}@media (max-width:58rem){.pp-preview__columns,.pp-preview__state-grid{grid-template-columns:1fr}}