.x-design{max-width:50em;padding:var(--space);gap:var(--space);flex-direction:column;margin:auto;display:flex}.x-design>section{gap:var(--pad);padding:var(--space);background:var(--plate);border:1px solid var(--lines);border-radius:var(--round);flex-direction:column;display:flex}.x-design .row{align-items:center;gap:var(--pad);flex-wrap:wrap;display:flex}.x-design .design-control-stack{gap:calc(var(--pad) * 1.2);display:grid}.x-design .design-control-row{align-items:center;gap:var(--pad);grid-template-columns:7.5em minmax(0,1fr);min-width:0;display:grid}.x-design .design-control-row h2{color:color-mix(in oklch, var(--fg), transparent 18%);margin:0;font-size:.9em}.x-design .design-control-demo{align-items:center;gap:var(--pad);flex-wrap:wrap;min-width:0;display:flex}.x-design .design-control-demo>.x-tabs,.x-design .design-control-demo>.x-field{width:min(100%,20em)}.x-design .design-control-demo>.x-empty-state,.x-design .design-control-demo>.x-collapsible-section{width:min(100%,22em)}.x-design .design-inline{align-items:center;gap:var(--pad);color:color-mix(in oklch, var(--fg), transparent 18%);font-weight:700;display:inline-flex}@media (width<=34em){.x-design .design-control-row{grid-template-columns:1fr}}