.content-samples{--sample-border:#cbd5e1;--sample-panel:#fff;--sample-text:#0f172a;--sample-error:#b91c1c;width:min(100% - 2rem,72rem);margin-inline:auto;padding-block:2rem 4rem;color:var(--sample-text)}.content-samples [hidden]{display:none !important}.content-samples__header{max-width:48rem;margin:0 auto 2rem;text-align:center}.content-samples__selectors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.content-samples__selectors label{display:grid;gap:.45rem;font-weight:650}.content-samples__selectors select{min-height:44px;width:100%;border:1px solid var(--sample-border);border-radius:.65rem;padding:.6rem .75rem;background:var(--sample-panel);color:var(--sample-text)}.content-samples :focus-visible{outline:3px solid #2563eb;outline-offset:3px}.content-samples__status,.content-samples__error{margin-top:1rem;text-align:center}.content-samples__error{color:var(--sample-error)}.sample-dialog{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:1rem}.sample-dialog__backdrop{position:absolute;inset:0;background:rgb(2 6 23/.84)}.sample-dialog__panel{position:relative;z-index:1;width:min(100%,64rem);max-height:calc(100vh - 2rem);overflow:auto;border-radius:1rem;padding:1rem;background:var(--sample-panel);box-shadow:0 24px 80px rgb(0 0 0/.45);text-align:center}.sample-dialog__close,.sample-carousel>button{min-width:44px;min-height:44px;border:0;border-radius:999px;cursor:pointer;background:#e2e8f0;color:#0f172a;font-size:1.6rem}.sample-dialog__close{position:absolute;top:.75rem;right:.75rem}.sample-carousel{display:grid;grid-template-columns:auto minmax(0,1fr)auto;align-items:center;gap:.75rem}.sample-carousel figure{min-width:0;margin:0}.sample-carousel img{display:block;width:100%;height:auto;max-height:calc(100vh - 14rem);object-fit:contain;border-radius:.75rem}.sample-indicators{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.sample-indicators button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:0 0;cursor:pointer}.sample-indicators button::before{width:12px;height:12px;border-radius:50%;background:#94a3b8;content:""}.sample-indicators button[aria-current=true]::before{background:#2563eb}.sample-dialog-open{overflow:hidden}@media(max-width:700px){.content-samples__selectors{grid-template-columns:1fr}.sample-dialog{padding:.5rem}.sample-dialog__panel{max-height:calc(100vh - 1rem);padding:.75rem}.sample-carousel{gap:.35rem}}.dark .content-samples{--sample-border:#475569;--sample-panel:#0f172a;--sample-text:#f8fafc;--sample-error:#fca5a5}@media(prefers-reduced-motion:no-preference){.sample-dialog__panel{animation:sample-dialog-in .16s ease-out}@keyframes sample-dialog-in{from{opacity:0;transform:translateY(.5rem)scale(.99)}}}