:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-mono:"SFMono-Regular", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{color:#f7f8fe;background:radial-gradient(circle at top,#4cc9f01a,#0000 32%),radial-gradient(circle at 10% 20%,#7c3aed2e,#0000 24%),radial-gradient(circle at 86% 18%,#34d3991a,#0000 22%),#05060a;min-height:100vh;margin:0}body:before{content:"";pointer-events:none;opacity:.15;background-image:radial-gradient(#ffffff26 .9px,#0000 .9px);background-size:180px 180px;position:fixed;inset:0}#root{position:relative}button,input,textarea{font:inherit}button,textarea{appearance:none}p,ul{margin-top:0}code{color:#f7f8fe;font-family:var(--font-mono);background:#ffffff0f;border:1px solid #ffffff14;border-radius:.45rem;padding:.12rem .38rem;font-size:.94em}::selection{background:#38bdf859}.app-shell{width:min(1440px,100vw - 24px);margin:0 auto;padding:18px 0 32px}.title-bar{padding:4px 2px 14px}.title-bar h1,.panel h2{color:#f7f8fe;margin:0}.title-bar h1{letter-spacing:.02em;color:#f7f8feeb;font-size:1rem;font-weight:600}.workspace-grid{grid-template-columns:minmax(0,1.7fr) minmax(360px,.92fr);align-items:start;gap:20px;display:grid}.panel{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:linear-gradient(#14141af0,#0a0a0ffa),#0c0c12f0;border:1px solid #ffffff14;border-radius:24px;box-shadow:inset 0 1px #ffffff08,0 30px 80px #00000052}.editor-panel,.preview-panel,.output-panel{padding:20px}.panel-heading{justify-content:space-between;align-items:start;gap:18px;margin-bottom:18px;display:flex}.panel-heading.compact{margin-bottom:16px}.panel-kicker{text-transform:uppercase;letter-spacing:.18em;color:#dce3ff8f;margin:0 0 10px;font-size:.7rem}.panel h2{letter-spacing:-.03em;font-size:1.26rem}.history-buttons,.chip-group,.action-buttons{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.control-row{flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:14px;display:flex}.control-row>span{color:#e2e7fa9e;text-transform:uppercase;letter-spacing:.16em;font-size:.78rem}.preset-section{margin-bottom:14px}.preset-tabs{border-bottom:1px solid #ffffff0f;gap:2px;margin-bottom:12px;padding-bottom:0;display:flex}.preset-tab{color:#dce3ff80;font:inherit;letter-spacing:.04em;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;align-items:center;gap:8px;margin-bottom:-1px;padding:8px 14px;font-size:.78rem;transition:color .14s,border-color .14s;display:inline-flex}.preset-tab-icon{flex:none;place-items:center;width:18px;height:18px;display:inline-grid}.preset-tab-icon svg{width:18px;height:18px;display:block}.preset-tab:hover{color:#dce3ffcc}.preset-tab.is-active{color:#f7f8fe;border-bottom-color:#4cc9f0b8}.preset-group{flex-wrap:wrap;gap:8px;display:flex}.preset-chip{align-items:center;gap:8px;padding:8px 14px 8px 10px;display:inline-flex}.preset-icon{flex-shrink:0;width:32px;height:24px}.preset-icon path{fill:none;stroke:#c8d2f080;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.preset-logo{object-fit:contain;opacity:.5;color:#f7f8fe;flex-shrink:0;width:32px;height:28px;transition:opacity .14s}.preset-logo.is-dark{filter:brightness(0)invert()}.preset-chip:hover .preset-logo{opacity:.8}.preset-chip.is-active .preset-logo{opacity:.9}.preset-label{flex-direction:column;align-items:flex-start;gap:1px;line-height:1.2;display:flex}.preset-brand{color:#c8d2f066;letter-spacing:.04em;font-size:.65rem}.preset-chip.is-active .preset-brand{color:#7dd3fc99}.preset-chip:hover .preset-brand{color:#7dd3fc80}.preset-chip.is-active .preset-icon path{stroke:#7dd3fce6}.preset-chip:hover .preset-icon path{stroke:#7dd3fcb3}.editor-toolbar{justify-content:space-between;align-items:start;gap:12px;margin-bottom:14px;display:flex}.editor-toolbar .modifier-bar{margin-bottom:0}.segment-group{flex:1}.sampling-group{flex:1;align-items:stretch}.modifier-bar{flex-wrap:wrap;gap:8px;margin-bottom:14px;display:flex}.modifier-pill{color:#dde3f3b8;background:#ffffff08;border:1px solid #ffffff14;border-radius:999px;align-items:center;gap:8px;padding:8px 10px;font-size:.84rem;display:inline-flex}.modifier-pill.is-active{color:#f7f8fe;background:#67c1ff14;border-color:#67c1ff6b}.modifier-shortcut{color:#cfefff;font-family:var(--font-mono);background:#ffffff0f;border-radius:999px;flex:none;padding:4px 8px;font-size:.82rem}.chip-button,.segment-chip,.mode-chip,.secondary-button,.primary-button{color:#f6f8ff;font:inherit;cursor:pointer;background:#ffffff09;border:1px solid #ffffff1a;border-radius:999px;padding:10px 16px;transition:border-color .14s,background .14s,transform .14s,box-shadow .14s}.chip-button:hover,.segment-chip:hover,.mode-chip:hover,.secondary-button:hover,.primary-button:hover{background:#67c1ff14;border-color:#67c1ff8c;transform:translateY(-1px)}.chip-button.is-active,.segment-chip.is-active,.mode-chip.is-active,.primary-button{background:linear-gradient(135deg,#4cc9f03d,#7c3aed42);border-color:#4cc9f0b8;box-shadow:0 0 28px #4cc9f024}.sampling-chip{text-align:left;border-radius:16px;flex-direction:column;flex:220px;align-items:flex-start;gap:4px;padding:12px 14px;display:flex}.sampling-chip-header{align-items:center;gap:8px;display:inline-flex}.sampling-chip-icon{flex:none;place-items:center;width:18px;height:18px;display:inline-grid}.sampling-chip-icon svg{width:18px;height:18px;display:block}.sampling-chip-label{font-size:.92rem;font-weight:600;line-height:1.15}.sampling-chip-note{color:#d6def68f;font-size:.68rem;line-height:1.3}.sampling-chip.is-active .sampling-chip-note{color:#eaf4ffc2}.secondary-button:disabled{opacity:.45;cursor:default;transform:none}.button-shortcut{font-family:var(--font-mono);color:#b4e1ffd1;margin-left:8px;font-size:.8em}.editor-canvas-wrap{background:radial-gradient(circle at top,#7c3aed1f,#0000 40%),linear-gradient(#101118f5,#08080cfa);border:1px solid #ffffff0f;border-radius:22px;overflow:hidden}.editor-canvas{touch-action:none;width:100%;height:auto;display:block}.grid-line{stroke:#ffffff14;stroke-width:1px}.grid-line.is-emphasis{stroke:#ffffff29}.handle-line{stroke:#ffffff2e;stroke-width:2px;stroke-dasharray:5 8;pointer-events:none}.handle-line.is-active{stroke:#83d3ff75}.curve-path,.selected-path,.linear-path{fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.curve-path{stroke:url(#curve-gradient);stroke-width:7px}.selected-path{stroke:#c6effff2;stroke-width:4px}.selected-path-glow{fill:none;stroke:#67c1ff75;stroke-width:10px;stroke-linecap:round;stroke-linejoin:round;opacity:.16;pointer-events:none}.linear-path{stroke:#ffffff9e;stroke-width:3px;stroke-dasharray:7 9}.segment-hit-area{fill:none;stroke:#0000;stroke-width:28px;cursor:pointer}.segment-hit-area.is-mod-armed{stroke:#c6efff2e;stroke-width:12px;stroke-dasharray:10 10}.anchor-point,.control-point{cursor:grab}.anchor-point:active,.control-point:active{cursor:grabbing}.anchor-point{fill:#08080d;stroke:#f8fafc;stroke-width:2.5px;transition:stroke-width .12s,filter .12s}.anchor-point:hover{stroke-width:3.5px;filter:drop-shadow(0 0 8px #f8fafc80)}.anchor-point.is-locked{fill:#38bdf833}.anchor-point.is-locked:hover{filter:drop-shadow(0 0 8px #38bdf880)}.control-point{fill:#38bdf838;stroke:#7dd3fc;stroke-width:2.5px;transition:stroke-width .12s,filter .12s}.control-point:hover{stroke-width:3.5px;filter:drop-shadow(0 0 10px #7dd3fc80)}.control-point.is-active{fill:#34d39938;stroke:#6ee7b7}.control-point.is-active:hover{filter:drop-shadow(0 0 10px #6ee7b780)}.control-point.is-mirror-armed{filter:drop-shadow(0 0 12px #7dd3fc59)}.axis-label{fill:#dbe4f7ad;letter-spacing:.04em;pointer-events:none;font-size:20px}.legend-row{flex-wrap:wrap;gap:16px;margin-top:16px;display:flex}.legend-item{color:#dde3f3b8;align-items:center;gap:10px;font-size:.9rem;display:inline-flex}.legend-swatch{border-radius:999px;width:28px;height:4px}.legend-swatch.exact{background:linear-gradient(90deg,#7c3aed,#38bdf8,#34d399)}.legend-swatch.approx{background:#ffffffb3}.mode-grid{grid-template-columns:repeat(auto-fit,minmax(56px,1fr));gap:8px;margin-bottom:16px;display:grid}.mode-chip{text-align:center;border-radius:18px;justify-content:center;align-items:center;width:100%;min-height:56px;padding:10px;display:flex}.mode-chip-icon{flex:none;place-items:center;width:32px;height:32px;display:inline-grid}.mode-chip-icon svg{width:32px;height:32px;display:block}.preview-stage{aspect-ratio:1;background:radial-gradient(circle at top,#38bdf824,#0000 48%),linear-gradient(#0d0e14fa,#08080cfa);border:1px solid #ffffff12;border-radius:22px;width:min(100%,430px);position:relative;overflow:hidden}.preview-panel{flex-direction:column;align-items:center;display:flex}.preview-panel .panel-heading,.preview-panel .mode-grid,.preview-panel .preview-stats,.preview-panel .slider-block,.preview-panel .preview-note{width:100%}.preview-guides{pointer-events:none;position:absolute;inset:18px}.preview-guides.horizontal{background:#ffffff1f;height:1px;top:50%;bottom:auto}.preview-guides.vertical{background:#ffffff1f;width:1px;left:50%;right:auto}.preview-object-wrap{perspective:720px;place-items:center;display:grid;position:absolute;inset:0}.preview-card{aspect-ratio:1;corner-shape:squircle;color:#f8fafc;text-transform:uppercase;letter-spacing:.16em;width:108px;transform-style:preserve-3d;background:linear-gradient(145deg,#8b5cf6,#2563eb);border-radius:28px;place-items:center;font-size:.72rem;display:grid;box-shadow:0 0 0 1px #ffffff29,0 18px 40px #2a6dff73,0 0 80px #7c3aed75}.preview-stats{gap:12px;margin:16px 0;display:grid}.preview-stats.compact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.preview-stats div{background:#ffffff09;border:1px solid #ffffff0f;border-radius:18px;padding:14px 16px}.preview-stats span,.slider-copy span,.preview-note{color:#d3dbf194;display:block}.preview-stats span,.slider-copy span{margin-bottom:6px;font-size:.78rem}.preview-stats strong,.slider-copy strong{color:#f7f8fe;font-size:1.08rem;font-weight:600}.slider-block{display:block}.slider-copy{justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:12px;display:flex}.slider-input-row{align-items:center;gap:12px;display:flex}.number-input{color:#f7f8fe;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:12px;width:92px;padding:8px 10px}input[type=range]{accent-color:#38bdf8;width:100%}.preview-note{margin:12px 0 0;font-size:.9rem}.output-panel{grid-column:1/-1}.code-block{color:#f7f8fe;width:100%;min-height:178px;font:.95rem/1.65 var(--font-mono);white-space:pre-wrap;background:#ffffff09;border:1px solid #ffffff14;border-radius:22px;margin:0;padding:18px;overflow-x:auto}.inline-code-list{gap:10px;margin-top:16px;display:grid}.inline-code{white-space:pre-wrap;font:.92rem/1.6 var(--font-mono);background:#ffffff08;border:1px solid #ffffff14;border-radius:16px;margin:0;padding:14px 16px;overflow-x:auto}.token-property{color:#7dd3fc}.token-function{color:#c084fc}.token-number{color:#6ee7b7}@media (width<=1180px){.workspace-grid{grid-template-columns:1fr}}@media (width<=720px){.app-shell{width:min(100vw - 16px,1440px);padding:12px 0 24px}.editor-panel,.preview-panel,.output-panel{padding:16px}.panel-heading,.slider-copy{flex-direction:column;align-items:start}.modifier-pill{justify-content:space-between;width:100%}.preview-stats.compact-grid,.mode-grid{grid-template-columns:1fr}.preview-card{border-radius:22px;width:88px}.axis-label{font-size:16px}}
