*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--clr-bg: #000000;--clr-surface: transparent;--clr-surface-2: transparent;--clr-border: #383838;--clr-border-dim: #1c1c1c;--clr-text: #c0c0c0;--clr-text-dim: #484848;--clr-text-bright:#ffffff;--clr-accent: #888888;--clr-danger: #dd2222;--clr-warning: #cc7700;--clr-active: #ffffff;--clr-corner: #666666;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace;--gap: 1.25rem;--radius: 0px;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{height:100%;background:#000;overflow:hidden}body{color:var(--clr-text);font-family:var(--font-mono);font-size:11px;line-height:1.5;letter-spacing:.04em}#app{height:100vh;display:flex;flex-direction:column;overflow:hidden}.app{position:relative;display:flex;flex-direction:column;align-items:center;height:100vh;overflow-y:auto;padding:1rem var(--gap);gap:.75rem;scrollbar-width:none}.app::-webkit-scrollbar{display:none}.bg-canvas{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.28}.app-header{position:relative;z-index:1;width:100%;max-width:600px;padding-bottom:.5rem;border-bottom:1px solid var(--clr-border);user-select:none}.plant-title{font-size:clamp(.9rem,2.5vw,1.1rem);font-family:var(--font-mono);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--clr-text-bright)}.plant-subtitle{font-size:.65rem;font-family:var(--font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--clr-text-dim);margin-top:.1rem}.status-row{display:flex;align-items:center;gap:.5rem;margin-top:.4rem}.status-dot{width:5px;height:5px;border:1px solid var(--clr-text-dim);flex-shrink:0;transition:border-color .4s,background .4s}.status-dot.active{border-color:var(--clr-active);background:var(--clr-active)}.status-text{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.16em;color:var(--clr-text-dim);text-transform:uppercase;transition:color .4s}.status-text.warning{color:var(--clr-warning)}.overload-tag{margin-left:auto;font-size:.6rem;letter-spacing:.2em;color:var(--clr-danger);text-transform:uppercase;border:1px solid var(--clr-danger);padding:0 4px}.oscilloscope{position:relative;z-index:1;width:100%;max-width:600px;height:56px;border:1px solid var(--clr-border-dim);background:transparent;overflow:hidden}.oscilloscope:before,.oscilloscope:after{content:"";position:absolute;width:8px;height:8px;pointer-events:none;z-index:2}.oscilloscope:before{top:-1px;left:-1px;border-top:1px solid var(--clr-corner);border-left:1px solid var(--clr-corner)}.oscilloscope:after{bottom:-1px;right:-1px;border-bottom:1px solid var(--clr-corner);border-right:1px solid var(--clr-corner)}.osc-canvas{width:100%;height:100%;display:block}.controls{position:relative;z-index:1;width:100%;max-width:600px;background:transparent;border:1px solid var(--clr-border);display:flex;flex-direction:column;gap:0}.controls:before,.controls:after{content:"";position:absolute;width:10px;height:10px;pointer-events:none;z-index:2}.controls:before{top:-1px;left:-1px;border-top:1px solid var(--clr-corner);border-left:1px solid var(--clr-corner)}.controls:after{bottom:-1px;right:-1px;border-bottom:1px solid var(--clr-corner);border-right:1px solid var(--clr-corner)}.section{border-bottom:1px solid var(--clr-border-dim);padding:.6rem .75rem}.section:last-child{border-bottom:none}.section-header{font-size:.58rem;letter-spacing:.25em;text-transform:uppercase;color:var(--clr-text-dim);margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}.section-header:after{content:"";flex:1;height:1px;background:var(--clr-border-dim)}.transport{display:flex;gap:.4rem}.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .85rem;border:1px solid var(--clr-border);border-radius:0;background:transparent;color:var(--clr-text);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:border-color .12s,color .12s;user-select:none;white-space:nowrap}.btn:hover:not(:disabled){border-color:var(--clr-text);color:var(--clr-text-bright)}.btn:active:not(:disabled){border-color:var(--clr-text-bright)}.btn:disabled{opacity:.2;cursor:not-allowed}.btn-primary.active{border-color:var(--clr-active);color:var(--clr-active)}.btn-accent{margin-left:auto}.btn-icon{font-size:.75em}.btn-ghost{background:transparent}.mode-row{display:flex;align-items:center;gap:.5rem}.mode-label{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--clr-text-dim);white-space:nowrap;min-width:4rem}.mode-select{flex:1;padding:.35rem 1.5rem .35rem .5rem;background:transparent;border:1px solid var(--clr-border);border-radius:0;color:var(--clr-text);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;outline:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpolyline points='0,0 4,5 8,0' fill='none' stroke='%23555' stroke-width='1'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center}.mode-select:focus{border-color:var(--clr-text)}.mode-select option{background:#111;color:var(--clr-text)}.param-grid{display:flex;flex-direction:column;gap:.45rem}.param-row{display:grid;grid-template-columns:5rem 1fr 2.5rem;align-items:center;gap:.5rem}.param-label{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--clr-text-dim)}.param-value{font-size:.6rem;letter-spacing:.08em;color:var(--clr-text-dim);text-align:right;font-variant-numeric:tabular-nums}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:26px;background:transparent;cursor:ew-resize;outline:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}input[type=range]::-webkit-slider-runnable-track{height:2px;background:var(--clr-border-dim)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:24px;margin-top:-11px;border-radius:0;background:linear-gradient(to right,transparent 0,transparent 8px,var(--clr-text-dim) 8px,var(--clr-text-dim) 10px,transparent 10px,transparent 100%);box-shadow:none;border:none;cursor:ew-resize;transition:background .1s}input[type=range]:hover::-webkit-slider-thumb{background:linear-gradient(to right,transparent 0,transparent 8px,var(--clr-text) 8px,var(--clr-text) 10px,transparent 10px,transparent 100%)}input[type=range]:focus::-webkit-slider-thumb{background:linear-gradient(to right,transparent 0,transparent 8px,var(--clr-text-bright) 8px,var(--clr-text-bright) 10px,transparent 10px,transparent 100%)}input[type=range]::-moz-range-track{height:2px;background:var(--clr-border-dim);border:none}input[type=range]::-moz-range-thumb{width:14px;height:22px;background:var(--clr-text-dim);border:none;border-radius:0;cursor:ew-resize}.record-row{display:flex;align-items:center;gap:.6rem;min-height:2rem}.btn-record{display:inline-flex;align-items:center;gap:.4rem;padding:.38rem .85rem;border:1px solid var(--clr-border);border-radius:0;background:transparent;color:var(--clr-text);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:border-color .15s,color .15s;user-select:none}.btn-record:hover:not(:disabled){border-color:var(--clr-danger);color:var(--clr-danger)}.btn-record.recording{border-color:var(--clr-danger);color:var(--clr-danger)}.btn-record:disabled{opacity:.2;cursor:not-allowed}.rec-dot{width:5px;height:5px;border:1px solid var(--clr-text-dim);flex-shrink:0;transition:border-color .2s,background .2s}.rec-dot.active{border-color:var(--clr-danger);background:var(--clr-danger);animation:rec-blink 1.2s step-start infinite}@keyframes rec-blink{0%,to{opacity:1}50%{opacity:0}}.rec-timer{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;color:var(--clr-danger);min-width:3.2rem;text-align:right}.rec-hint{font-family:var(--font-mono);font-size:.62rem;color:var(--clr-text-dim);letter-spacing:.1em;text-transform:uppercase}.preset-panel{display:flex;flex-direction:column;gap:.4rem}.preset-row{display:flex;gap:.4rem}.preset-input{flex:1;padding:.35rem .5rem;background:transparent;border:1px solid var(--clr-border);border-radius:0;color:var(--clr-text);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.08em;outline:none;transition:border-color .15s}.preset-input:focus{border-color:var(--clr-text)}.preset-input::placeholder{color:var(--clr-text-dim)}.preset-list{display:flex;flex-wrap:wrap;gap:.3rem}.preset-item{display:inline-flex;align-items:center;border:1px solid var(--clr-border-dim);border-radius:0;overflow:hidden;background:transparent;transition:border-color .1s}.preset-item.selected{border-color:var(--clr-text)}.preset-load{padding:.25rem .55rem;background:transparent;border:none;color:var(--clr-text);font-family:var(--font-mono);font-size:.65rem;letter-spacing:.08em;cursor:pointer;transition:color .1s}.preset-load:hover{color:var(--clr-text-bright)}.preset-delete{padding:.25rem .4rem;background:transparent;border:none;border-left:1px solid var(--clr-border-dim);color:var(--clr-text-dim);font-size:.85rem;line-height:1;cursor:pointer;transition:color .1s}.preset-delete:hover{color:var(--clr-danger)}.snap-slots{display:flex;gap:.4rem;margin-bottom:.5rem}.snap-slot{display:inline-flex;align-items:stretch;border:1px solid var(--clr-border-dim);transition:border-color .15s}.snap-slot.filled{border-color:var(--clr-border)}.snap-slot.morph-from{border-color:var(--clr-active)}.snap-slot.morph-to{border-color:var(--clr-accent)}.snap-num{padding:.32rem .6rem;background:transparent;border:none;color:var(--clr-text-dim);font-family:var(--font-mono);font-size:.65rem;letter-spacing:.1em;cursor:pointer;transition:color .1s;min-width:1.8rem;text-align:center}.snap-slot.filled .snap-num{color:var(--clr-text)}.snap-num:hover{color:var(--clr-text-bright)}.snap-del{padding:.2rem .4rem;background:transparent;border:none;border-left:1px solid var(--clr-border-dim);color:var(--clr-text-dim);font-size:.85rem;line-height:1;cursor:pointer;transition:color .1s}.snap-del:hover{color:var(--clr-danger)}.morph-track{height:1px;background:var(--clr-border-dim);margin:.5rem 0 .45rem;position:relative}.morph-fill{position:absolute;left:0;top:0;height:1px;background:var(--clr-text-dim);transition:width .08s linear;pointer-events:none}.morph-row{display:flex;gap:.4rem;align-items:center}.morph-dur{flex:1}.app-footer{position:relative;z-index:1;margin-top:auto;padding-bottom:.5rem;font-family:var(--font-mono);font-size:.55rem;letter-spacing:.14em;color:var(--clr-border);text-align:center;text-transform:uppercase}.help-btn{margin-top:.45rem;padding:.25rem .65rem;font-size:.6rem;letter-spacing:.16em}.modal-backdrop{position:fixed;inset:0;z-index:30;background:#000000c7;display:grid;place-items:center;padding:1rem}.modal-card{width:min(560px,100%);border:1px solid var(--clr-border);background:#050505;padding:.8rem}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:.6rem}.modal-head h2{font-size:.66rem;letter-spacing:.2em;color:var(--clr-text-bright);font-weight:600}.modal-close{padding:.26rem .55rem;font-size:.58rem}.modal-list{padding-left:1rem;color:var(--clr-text);font-size:.65rem;line-height:1.55;letter-spacing:.06em}.modal-list li+li{margin-top:.3rem}.fade-enter-active,.fade-leave-active{transition:opacity .2s}.fade-enter-from,.fade-leave-to{opacity:0}@media(max-width:480px){.plant-title{font-size:.75rem;letter-spacing:.1em}.param-row{grid-template-columns:4rem 1fr 2rem}input[type=range]{height:30px}input[type=range]::-webkit-slider-thumb{width:24px;height:28px;margin-top:-13px;background:linear-gradient(to right,transparent 0,transparent 11px,var(--clr-text) 11px,var(--clr-text) 13px,transparent 13px,transparent 100%)}input[type=range]::-moz-range-thumb{width:18px;height:24px}}