.wg-tabs{margin-bottom:var(--space-6)}.wg-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:var(--space-10);align-items:start;margin-bottom:var(--space-8)}.wg-main{display:flex;flex-direction:column;gap:var(--space-6);min-width:0}.wg-side{display:flex;flex-direction:column;gap:var(--space-3);position:sticky;top:calc(var(--header-h) + var(--space-4));min-width:0}.wg-preview{display:flex;align-items:flex-start;justify-content:center;width:100%}.wg-preview > div{width:100%}.wg-preview svg[fill]{fill:revert}.wg-controls{display:flex;flex-direction:column;gap:var(--space-6)}.wg-two{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-10);align-items:start}.wg-col{display:flex;flex-direction:column;gap:var(--space-4);min-width:0}.wg-sect{font-size:var(--text-base);font-weight:700;color:var(--text-heading)}.wg-field{display:flex;flex-direction:column;gap:8px}.wg-field>label{font-size:var(--text-sm);font-weight:600;color:var(--text-heading)}.wg-input,.wg-input:focus,.wg-input:focus-visible{width:100%;height:44px;padding:0 14px;border:0;outline:0;box-shadow:none;border-radius:12px;background:rgba(15,23,42,.06);color:var(--text-heading);font:500 14px var(--font-sans);box-sizing:border-box;transition:background var(--dur-fast)}.wg-input:hover,.wg-input:focus{background:rgba(15,23,42,.09)}.wg-input::placeholder{color:var(--text-tertiary)}[data-theme="dark"] .wg-input{background:rgba(255,255,255,.08)}[data-theme="dark"] .wg-input:hover,[data-theme="dark"] .wg-input:focus{background:rgba(255,255,255,.12)}.wg-colors{display:flex;flex-direction:column;gap:12px}.wg-color{display:flex;align-items:center;justify-content:space-between;gap:12px}.wg-color-l{font-size:var(--text-sm);color:var(--text-body)}.wg-color-sw{position:relative;flex:0 0 auto;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(15,23,42,.16);cursor:pointer;overflow:hidden}[data-theme="dark"] .wg-color-sw{box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}.wg-color-sw input{position:absolute;inset:-4px;width:calc(100% + 8px);height:calc(100% + 8px);border:none;padding:0;cursor:pointer;opacity:0}.wg-range{width:100%;accent-color:var(--fill-accent);cursor:pointer}.wg-rad-v,.wg-lrad-v,.wg-bsize-v{margin-inline-start:6px;color:var(--text-tertiary);font-weight:500;font-variant-numeric:tabular-nums}.wg-toggles{display:flex;flex-direction:column;gap:12px}.wg-toggle{display:flex;align-items:center;gap:10px;padding:0;border:none;background:transparent;color:var(--text-body);font-size:var(--text-sm);font-weight:500;text-align:start;cursor:pointer}.wg-knob{position:relative;width:40px;height:23px;border-radius:999px;background:rgba(15,23,42,.16);flex:0 0 auto;transition:background var(--dur-base)}[data-theme="dark"] .wg-knob{background:rgba(255,255,255,.2)}.wg-knob::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm);transition:inset-inline-start var(--dur-base)}.wg-toggle.on .wg-knob{background:var(--fill-accent)}.wg-toggle.on .wg-knob::after{inset-inline-start:20px}.wg-reset{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;padding:0;border:0;background:transparent;color:var(--text-secondary);font:500 14px var(--font-sans);cursor:pointer;transition:color var(--dur-fast)}.wg-reset:hover{color:var(--text-heading)}.wg-code{margin:0;padding:14px 16px;border-radius:12px;background:rgba(15,23,42,.06);color:var(--text-body);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;line-height:1.6;white-space:pre-wrap;word-break:break-all;max-height:300px;overflow-y:auto}[data-theme="dark"] .wg-code{background:rgba(255,255,255,.08)}.wg-copy{width:100%;justify-content:center}@media (max-width:880px){.wg-grid{grid-template-columns:1fr;gap:var(--space-8)}.wg-side{position:static}}@media (max-width:680px){.wg-two{grid-template-columns:1fr;gap:var(--space-8)}.wg-tabs button{padding:0 8px;font-size:13px;white-space:nowrap}}