.Playground_wrap__ueIJt{padding-bottom:4rem}.Playground_layout__KAnrp{display:grid;grid-template-columns:320px 1fr;grid-gap:1.5rem;gap:1.5rem;align-items:start}@media (max-width:1024px){.Playground_layout__KAnrp{grid-template-columns:1fr}}.Playground_controls__Bo5Ey{position:-webkit-sticky;position:sticky;top:80px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.25rem;display:flex;flex-direction:column;gap:1.25rem;max-height:calc(100vh - 100px);overflow-y:auto}@media (max-width:1024px){.Playground_controls__Bo5Ey{position:static;max-height:none}}.Playground_group__8eilK{display:flex;flex-direction:column;gap:.5rem}.Playground_groupLabel__8cgzo{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;font-weight:600;color:var(--fg-subtle)}.Playground_segmented__fmIBY{display:inline-flex;background:var(--bg-muted);border:1px solid var(--border);border-radius:var(--radius);padding:.25rem;gap:.125rem;width:100%}.Playground_segBtn__xgrkh{flex:1 1;padding:.375rem .5rem;border-radius:calc(var(--radius) - 4px);border:0;background:transparent;color:var(--fg-muted);font-size:.8125rem;font-weight:500;cursor:pointer}.Playground_segBtn__xgrkh:hover{color:var(--fg)}.Playground_segBtnActive__qL0VQ{background:var(--bg);color:var(--fg);box-shadow:var(--shadow-sm)}.Playground_swatches__4qD9o{display:flex;gap:.5rem;flex-wrap:wrap}.Playground_swatch__S7ruV{width:28px;height:28px;border-radius:50%;border:2px solid transparent;outline:1px solid var(--border);outline-offset:0;cursor:pointer;padding:0;transition:transform .12s}.Playground_swatch__S7ruV:hover{transform:scale(1.1)}.Playground_swatchActive__zUWYU{border-color:var(--bg);outline:2px solid var(--fg);outline-offset:1px}.Playground_range__IwSvU{width:100%;accent-color:var(--accent)}.Playground_text__19wpn{width:100%;padding:.5rem .625rem;background:var(--bg);border:1px solid var(--border-strong);border-radius:var(--radius-sm);color:var(--fg);font:inherit;font-size:.875rem}.Playground_text__19wpn:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}.Playground_toggle__dQPdl{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--fg);cursor:pointer}.Playground_toggle__dQPdl input{accent-color:var(--accent);width:16px;height:16px}.Playground_right__zCaDU{display:flex;flex-direction:column;gap:1rem}.Playground_editorBox__qIRtR{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--border)}.Playground_codeBox__eZhpb{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.Playground_codeHead__WNB24{display:flex;justify-content:space-between;align-items:center;padding:.625rem 1rem;background:var(--bg-muted);border-bottom:1px solid var(--border);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-subtle);font-weight:600}.Playground_copyBtn__ukpuF{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .625rem;background:transparent;border:1px solid var(--border-strong);border-radius:6px;color:var(--fg-muted);font-size:.75rem;cursor:pointer;text-transform:none;letter-spacing:0}.Playground_copyBtn__ukpuF:hover{color:var(--fg);background:var(--bg)}.Playground_pre__HF82Z{margin:0;padding:1.25rem;overflow-x:auto;font-size:.8125rem;line-height:1.7;font-family:var(--font-mono);color:var(--fg)}