/* Banco di prova /componenti: solo qui. */
.pn-showcase { font-family: var(--pn-font); color: var(--pn-text); padding-bottom: var(--pn-space-16); }
.pn-showcase__toolbar { position: sticky; top: var(--pn-databar-h); z-index: 30; background: var(--pn-surface); border-bottom: 1px solid var(--pn-rule); box-shadow: var(--pn-shadow); }
.pn-showcase__toolbar .pn-container { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pn-space-3) var(--pn-space-6); padding-top: var(--pn-space-2); padding-bottom: var(--pn-space-2); }
.pn-showcase__toolbar h1 { margin: 0; font-size: var(--pn-fs-h3); }
.pn-showcase__group { display: inline-flex; gap: 4px; padding: 3px; background: var(--pn-surface-3); border-radius: var(--pn-radius); }
.pn-showcase__group button { min-height: 38px; padding: 0 var(--pn-space-3); border: 0; border-radius: 4px; background: transparent; font: inherit; font-size: var(--pn-fs-small); font-weight: var(--pn-fw-semibold); color: var(--pn-ink); cursor: pointer; }
.pn-showcase__group button[aria-pressed="true"] { background: var(--pn-ink); color: #fff; }
.pn-showcase__server { font-size: var(--pn-fs-small); color: var(--pn-text-muted); display: flex; gap: var(--pn-space-3); flex-wrap: wrap; align-items: center; }
.pn-showcase__server a { color: var(--pn-accent-season-text); font-weight: var(--pn-fw-semibold); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--pn-accent-season); }
.pn-showcase__intro { max-width: var(--pn-measure); margin: var(--pn-space-6) auto var(--pn-space-8); padding: 0 var(--pn-space-4); }
.pn-showcase__section { padding: var(--pn-space-8) 0; border-top: 1px solid var(--pn-rule); }
.pn-showcase__section h2 { margin: 0 0 var(--pn-space-1); }
.pn-showcase__section > .pn-container > p { margin: 0 0 var(--pn-space-6); color: var(--pn-text-muted); max-width: var(--pn-measure); }
.pn-demo { margin: 0 0 var(--pn-space-8); }
.pn-demo__caption { display: flex; gap: var(--pn-space-3); align-items: baseline; margin-bottom: var(--pn-space-3); font-size: var(--pn-fs-small); }
.pn-demo__caption strong { color: var(--pn-ink); font-size: var(--pn-fs-body); }
.pn-demo__caption span { color: var(--pn-text-muted); }
.pn-demo__pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pn-space-4); }
.pn-demo__cell { position: relative; padding: var(--pn-space-8) var(--pn-space-4) var(--pn-space-4); border: 1px solid var(--pn-rule); border-radius: var(--pn-radius); background: var(--pn-surface-2); min-width: 0; }
.pn-demo__cell::before { content: attr(data-season-label); position: absolute; top: var(--pn-space-2); left: var(--pn-space-4); font-size: var(--pn-fs-label); letter-spacing: 0.06em; text-transform: uppercase; font-weight: var(--pn-fw-semibold); color: var(--pn-accent-season-text); }
.pn-demo__cell::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--pn-accent-season); border-radius: var(--pn-radius) var(--pn-radius) 0 0; }
.pn-demo__cell.season-estate::before { color: var(--pn-ink); }
.pn-demo__cell--wide { grid-column: 1 / -1; }
.pn-frame { background: var(--pn-surface); border: 1px solid var(--pn-rule); border-radius: var(--pn-radius); overflow: hidden; }
.pn-frame--mobile { width: 375px; max-width: 100%; margin: 0 auto; }
.pn-frame .pn-databar-wrap { position: static; }
.pn-showcase.is-only-inverno .pn-demo__cell.season-estate, .pn-showcase.is-only-estate .pn-demo__cell.season-inverno { display: none; }
.pn-showcase.is-only-inverno .pn-demo__pair, .pn-showcase.is-only-estate .pn-demo__pair { grid-template-columns: 1fr; }
.pn-demo__inline { display: flex; flex-wrap: wrap; gap: var(--pn-space-3); align-items: center; }
.pn-demo__stack { display: flex; flex-direction: column; gap: var(--pn-space-3); }
.pn-showcase__debug { font-size: var(--pn-fs-label); color: var(--pn-text-muted); font-variant-numeric: tabular-nums; }
@media (max-width: 767px) { .pn-demo__pair { grid-template-columns: 1fr; } .pn-showcase__toolbar { top: 0; } }
