.param-panel{--pp-bg:#fff;--pp-surface:#f8f9fa;--pp-surface-hover:#f1f3f5;--pp-elevated:#fff;--pp-text:#212529;--pp-muted:#868e96;--pp-border:#dee2e6;--pp-border-strong:#ced4da;--pp-accent:#228be6;--pp-accent-hover:#1c7ed6;--pp-accent-fg:#fff;--pp-danger:#fa5252;--pp-danger-hover:#f03e3e;--pp-danger-fg:#fff;--pp-track:#dee2e6;--pp-shadow:0 8px 30px #0000001f, 0 2px 8px #0000000f;--pp-focus-ring:color-mix(in srgb, var(--pp-accent) 45%, transparent);--pp-radius:8px;--pp-radius-sm:6px;--pp-font:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--pp-font-mono:ui-monospace, "SF Mono", "JetBrains Mono", "Fira Code", Menlo, Consolas, monospace;--pp-font-size:12px;--pp-gap:8px;--pp-row-height:28px;--pp-label-width:40%;--pp-pad:12px;box-sizing:border-box;width:fit-content;min-width:300px;max-width:min(440px,100%);font-family:var(--pp-font);font-size:var(--pp-font-size);color:var(--pp-text);background:var(--pp-bg);border:1px solid var(--pp-border);border-radius:var(--pp-radius);box-shadow:var(--pp-shadow);-webkit-font-smoothing:antialiased;line-height:1.4;overflow:clip}.param-panel *,.param-panel :before,.param-panel :after{box-sizing:border-box}.param-panel [hidden]{display:none!important}.dark .param-panel,.param-panel.dark{--pp-bg:#17181b;--pp-surface:#212327;--pp-surface-hover:#2a2d31;--pp-elevated:#26292e;--pp-text:#f8f9fa;--pp-muted:#909296;--pp-border:#2e3136;--pp-border-strong:#3a3f45;--pp-accent:#339af0;--pp-accent-hover:#4dabf7;--pp-accent-fg:#0b1418;--pp-danger:#ff6b6b;--pp-danger-hover:#ff8787;--pp-track:#3a3f45;--pp-shadow:0 10px 40px #00000080, 0 2px 8px #0006}.light .param-panel,.param-panel.light{--pp-bg:#fff;--pp-surface:#f8f9fa;--pp-surface-hover:#f1f3f5;--pp-elevated:#fff;--pp-text:#212529;--pp-muted:#868e96;--pp-border:#dee2e6;--pp-border-strong:#ced4da;--pp-accent:#228be6;--pp-accent-hover:#1c7ed6;--pp-accent-fg:#fff;--pp-danger:#fa5252;--pp-danger-hover:#f03e3e;--pp-track:#dee2e6;--pp-shadow:0 8px 30px #0000001f, 0 2px 8px #0000000f}.param-panel.pp-floating{z-index:1000;margin:12px;position:fixed}.pp-pos-top-left{top:0;left:0}.pp-pos-top-right{top:0;right:0}.pp-pos-bottom-left{bottom:0;left:0}.pp-pos-bottom-right{bottom:0;right:0}.pp-header{background:var(--pp-surface);border-bottom:1px solid var(--pp-border);-webkit-user-select:none;user-select:none;align-items:center;gap:6px;height:34px;padding:0 10px;display:flex}.pp-draggable .pp-header{cursor:grab;touch-action:none}.pp-dragging{-webkit-user-select:none;user-select:none}.pp-dragging .pp-header{cursor:grabbing}.param-panel.pp-collapsed .pp-header{border-bottom-color:#0000}.pp-title{font-weight:600;font-size:calc(var(--pp-font-size) + .5px);letter-spacing:.01em;text-overflow:ellipsis;white-space:nowrap;flex:auto;overflow:hidden}.pp-toggle{width:18px;height:18px;color:var(--pp-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;display:inline-flex}.pp-toggle:before{content:"";border-bottom:1.5px solid;border-right:1.5px solid;width:7px;height:7px;transition:transform .15s;transform:rotate(45deg)}.param-panel.pp-collapsed .pp-toggle:before{transform:rotate(-45deg)}.pp-toggle:hover{color:var(--pp-text);background:var(--pp-surface-hover)}.pp-content{gap:var(--pp-gap);padding:var(--pp-pad);flex-direction:column;display:flex}.param-panel.pp-floating .pp-content{max-height:80vh;overflow-y:auto}.pp-control{grid-template-columns:var(--pp-label-width) minmax(140px, 1fr);min-height:var(--pp-row-height);flex:none;align-items:center;gap:8px;display:grid}.pp-control.pp-hidden{display:none}.pp-control.pp-disabled{opacity:.55;pointer-events:none}.pp-label{color:var(--pp-muted);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.pp-field{align-items:center;gap:6px;min-width:0;display:flex}.pp-hint{color:var(--pp-muted);font-size:calc(var(--pp-font-size) - 1px);grid-column:1/-1;margin-top:-2px}.param-panel input,.param-panel select,.param-panel textarea,.param-panel button{font-family:inherit;font-size:inherit}.pp-text-input,.pp-number-input,.pp-select-input,.pp-textarea-input,.pp-color-text,.pp-slider-readout{width:100%;min-width:0;height:var(--pp-row-height);color:var(--pp-text);background:var(--pp-surface);border:1px solid var(--pp-border);border-radius:var(--pp-radius-sm);outline:none;padding:0 8px;transition:border-color .12s,box-shadow .12s}.pp-textarea-input{height:auto;font-family:var(--pp-font-mono);resize:vertical;padding:6px 8px}.pp-text-input:hover,.pp-number-input:hover,.pp-select-input:hover,.pp-textarea-input:hover,.pp-color-text:hover,.pp-slider-readout:hover{border-color:var(--pp-border-strong)}.param-panel input:focus-visible,.param-panel select:focus-visible,.param-panel textarea:focus-visible,.param-panel button:focus-visible,.param-panel [tabindex]:focus-visible{border-color:var(--pp-accent);box-shadow:0 0 0 3px var(--pp-focus-ring)}.pp-invalid{border-color:var(--pp-danger)!important;box-shadow:0 0 0 3px color-mix(in srgb, var(--pp-danger) 30%, transparent)!important}.pp-number-input,.pp-slider-readout{font-variant-numeric:tabular-nums;text-align:right;font-family:var(--pp-font-mono)}.pp-select-input{appearance:none;background-image:linear-gradient(45deg, transparent 50%, var(--pp-muted) 50%), linear-gradient(135deg, var(--pp-muted) 50%, transparent 50%);cursor:pointer;background-position:right 10px center,right 6px center;background-repeat:no-repeat;background-size:4px 4px,4px 4px;padding-right:24px}.pp-checkbox .pp-field{justify-content:flex-start}.pp-checkbox-input{appearance:none;background:var(--pp-surface);border:1px solid var(--pp-border-strong);cursor:pointer;border-radius:5px;place-content:center;width:18px;height:18px;margin:0;transition:background .12s,border-color .12s;display:inline-grid}.pp-checkbox-input:before{content:"";width:10px;height:10px;box-shadow:inset 1em 1em var(--pp-accent-fg);clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);transition:transform .12s;transform:scale(0)}.pp-checkbox-input:checked{background:var(--pp-accent);border-color:var(--pp-accent)}.pp-checkbox-input:checked:before{transform:scale(1)}.pp-slider .pp-field{gap:10px}.pp-slider-range{appearance:none;background:var(--pp-track);cursor:pointer;border-radius:999px;flex:1 1 0;width:100%;min-width:0;height:4px}.pp-slider-range::-webkit-slider-thumb{appearance:none;background:var(--pp-accent);border:2px solid var(--pp-bg);cursor:grab;border-radius:50%;width:14px;height:14px;transition:transform .1s;box-shadow:0 1px 2px #0000004d}.pp-slider-range::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.15)}.pp-slider-range::-moz-range-thumb{background:var(--pp-accent);border:2px solid var(--pp-bg);cursor:grab;border-radius:50%;width:14px;height:14px}.pp-slider-readout{flex:none;width:68px;height:24px;padding:0 6px}.pp-color .pp-field{gap:8px}.pp-color-swatch{appearance:none;border:1px solid var(--pp-border);border-radius:var(--pp-radius-sm);cursor:pointer;background:0 0;flex:none;width:28px;height:24px;padding:0}.pp-color-swatch::-webkit-color-swatch-wrapper{padding:2px}.pp-color-swatch::-webkit-color-swatch{border:none;border-radius:3px}.pp-color-swatch::-moz-color-swatch{border:none;border-radius:3px}.pp-color-text{min-width:48px;font-family:var(--pp-font-mono);flex:auto}.pp-color-alpha{flex:0 0 44px;width:44px;min-width:0}.pp-button{grid-template-columns:1fr}.pp-button-el{width:100%;height:var(--pp-row-height);color:var(--pp-text);background:var(--pp-surface);border:1px solid var(--pp-border);border-radius:var(--pp-radius-sm);cursor:pointer;padding:0 12px;font-weight:500;transition:background .12s,border-color .12s}.pp-button-el:hover{background:var(--pp-surface-hover);border-color:var(--pp-border-strong)}.pp-button-el:active{transform:translateY(.5px)}.pp-button-primary{color:#fff;background:var(--pp-accent);border-color:var(--pp-accent)}.pp-button-primary:hover{background:var(--pp-accent-hover);border-color:var(--pp-accent-hover)}.pp-button-danger{color:#fff;background:var(--pp-danger);border-color:var(--pp-danger)}.pp-button-danger:hover{background:var(--pp-danger-hover);border-color:var(--pp-danger-hover)}.pp-folder{display:block}.pp-folder-header{width:100%;height:var(--pp-row-height);color:var(--pp-text);border-radius:var(--pp-radius-sm);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:6px;padding:0 4px;font-weight:600;display:flex}.pp-folder-header:hover{background:var(--pp-surface-hover)}.pp-folder-chevron{border-right:1.5px solid var(--pp-muted);border-bottom:1.5px solid var(--pp-muted);flex:none;width:6px;height:6px;transition:transform .15s;transform:rotate(45deg)}.pp-folder.pp-collapsed .pp-folder-chevron{transform:rotate(-45deg)}.pp-folder-content{gap:var(--pp-gap);padding:var(--pp-gap) 0 2px 12px;border-left:1px solid var(--pp-border);flex-direction:column;margin-left:6px;display:flex}.pp-row{align-items:flex-start;gap:8px;display:flex}.pp-row>.pp-control{flex:1 1 0;grid-template-columns:1fr;min-width:0}.pp-tabs{display:block}.pp-tablist{background:var(--pp-surface);border:1px solid var(--pp-border);border-radius:var(--pp-radius-sm);gap:2px;padding:3px;display:flex}.pp-tab{height:24px;color:var(--pp-muted);cursor:pointer;background:0 0;border:none;border-radius:5px;flex:1 1 0;padding:0 8px;font-weight:500;transition:background .12s,color .12s}.pp-tab:hover{color:var(--pp-text)}.pp-tab-active{color:var(--pp-text);background:var(--pp-bg);box-shadow:0 1px 2px #0000001f}.pp-tabpanel{gap:var(--pp-gap);padding-top:var(--pp-gap);flex-direction:column;display:flex}.pp-monitor-value{text-align:right;width:100%;font-family:var(--pp-font-mono);font-variant-numeric:tabular-nums;color:var(--pp-text);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.pp-canvas,.pp-graph{display:block}.pp-canvas-label,.pp-graph-header{justify-content:space-between;align-items:baseline;margin-bottom:6px;display:flex}.pp-graph-label,.pp-canvas-label{color:var(--pp-muted)}.pp-graph-readout{font-family:var(--pp-font-mono);font-variant-numeric:tabular-nums;color:var(--pp-text)}.pp-canvas-el,.pp-graph-canvas{background:var(--pp-surface);border:1px solid var(--pp-border);border-radius:var(--pp-radius-sm);width:100%;display:block}.param-panel[data-density=compact]{--pp-font-size:11px;--pp-row-height:24px;--pp-gap:6px;--pp-pad:10px}.param-panel[data-density=touch]{--pp-font-size:14px;--pp-row-height:38px;--pp-gap:12px;--pp-pad:16px}@media (prefers-reduced-motion:reduce){.param-panel *{transition:none!important}}