@import"https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@1,700&display=swap";.splash{position:fixed;inset:0;z-index:10000;background:#111119;cursor:pointer;transform:translateY(0);transition:transform .7s cubic-bezier(.45,0,1,.15)}.splash-fade-out{transform:translateY(110vh);pointer-events:none}.splash-canvas{position:absolute;inset:0}.toolbar{display:flex;gap:.5rem;margin-bottom:.5rem;align-items:center;flex-wrap:wrap}.toolbar button{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:.4rem .8rem;border-radius:6px;cursor:pointer;font-size:.8rem}.toolbar button:hover{background:#223}.toolbar button.active{background:var(--accent);border-color:#4a3a7e}.toolbar .status{font-size:.75rem;opacity:.4}.toolbar-spacer{flex:1}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.1rem;height:1.1rem;padding:0 .3rem;border-radius:999px;background:var(--accent);font-size:.6rem;font-weight:600;line-height:1;margin-left:.3rem}.toolbar .audio-stats{font-size:.7rem;opacity:.35;margin-left:auto}.toolbar .audio-stats.clickable{cursor:pointer}.toolbar .audio-stats.clickable:hover{opacity:.6}.pad-size-controls{display:inline-flex;gap:2px}.pad-size-controls button{width:1.6rem;height:1.6rem;padding:0;font-size:1rem;line-height:1;display:flex;align-items:center;justify-content:center}.device-panel{width:min(95vw,1100px);max-height:0;overflow:hidden;transition:max-height .3s ease,margin .3s ease;margin-bottom:0}.device-panel.open{max-height:80vh;margin-bottom:1rem;overflow-y:auto}.device-panel-inner{display:flex;flex-direction:column;gap:.5rem}@media(min-width:700px){.device-panel-inner{flex-direction:row;align-items:flex-start;flex-wrap:wrap}}.device-section{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.6rem .8rem;margin-top:.5rem;flex:1;min-width:280px}.device-section h3{display:flex;align-items:baseline;gap:.4rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;opacity:.5;margin-bottom:.4rem;font-weight:500}.device-section h3 .col-label:first-of-type{margin-left:auto}.col-label{width:36px;text-align:center;font-weight:400}.device-row{display:flex;align-items:center;justify-content:space-between;padding:.35rem 0;gap:.4rem}.device-row+.device-row{border-top:1px solid rgba(255,255,255,.04)}.device-name{font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;margin-right:.5rem;display:flex;align-items:baseline;gap:.2rem}.device-row.disconnected .device-name{opacity:.35;text-decoration:line-through}.device-row.stale .device-name{opacity:.4}.device-row.stale .led{opacity:.3}.device-empty{font-size:.75rem;opacity:.3;font-style:italic;padding:.2rem 0}.led{width:8px;height:8px;border-radius:50%;background:#333;flex-shrink:0;transition:background .1s ease}.led.rx{background:#3fb950;box-shadow:0 0 6px #3fb950}.led.tx{background:#d29922;box-shadow:0 0 6px #d29922}.toggle{position:relative;width:36px;height:20px;flex-shrink:0}.toggle input{opacity:0;width:0;height:0}.toggle .slider{position:absolute;inset:0;background:#2a2a3a;border-radius:10px;cursor:pointer;transition:background .2s}.toggle .slider:before{content:"";position:absolute;width:14px;height:14px;left:3px;top:3px;background:#666;border-radius:50%;transition:transform .2s,background .2s}.toggle input:checked+.slider{background:var(--accent)}.toggle input:checked+.slider:before{transform:translate(16px);background:#ccc}.conn-config{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.4rem}.conn-row{display:flex;gap:.4rem;align-items:center}.conn-info{font-size:.75rem;opacity:.5}.conn-config input[type=text],.conn-config input[type=password]{flex:1;background:#0a0a12;color:var(--text);border:1px solid var(--border);border-radius:4px;padding:.3rem .5rem;font-size:.75rem;font-family:monospace;min-width:0}.conn-config button{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:.3rem .6rem;border-radius:4px;cursor:pointer;font-size:.7rem;white-space:nowrap}.conn-config button:hover{background:#223}.conn-config button.connected{background:#1a3a1a;border-color:#2a5a2a}.conn-id{font-size:.65rem;opacity:.35;font-family:monospace;margin-left:.3rem}.rtt{font-family:monospace;font-size:.6rem;opacity:.4;margin-left:auto;white-space:nowrap}.clock-offset{color:#8af;font-size:.75em;margin-left:2px}.flood-badge{font-size:.6rem;color:#e55;margin-left:.3rem;white-space:nowrap}.throttle-bar-wrap{display:inline-block;width:3rem;height:4px;background:#ff505026;border-radius:2px;margin-left:.3rem;vertical-align:middle;overflow:hidden}.throttle-bar{display:block;height:100%;background:#e55;border-radius:2px;transition:width .05s linear}.throttle-badge{font-size:.6rem;color:#e95;margin-left:.3rem;white-space:nowrap}.peer-group-header{font-size:.6rem;font-family:monospace;padding:.3rem 0 .1rem;border-top:1px solid var(--border);margin-top:.2rem;display:flex;align-items:center;gap:.4rem}.peer-group-label{opacity:.3;flex:1}.conn-label{font-size:.65rem;opacity:.4;white-space:nowrap;min-width:4.5rem}.peer-duration{font-family:monospace;font-size:.6rem;opacity:.35;margin-left:.3rem;white-space:nowrap}.room-share{display:flex;align-items:center;gap:.6rem;padding:.4rem 0;border-top:1px solid var(--border)}.room-share-qr{background:#fff;padding:4px;border-radius:4px;line-height:0;flex-shrink:0}.room-share-qr svg{width:64px;height:64px}.room-share-info{display:flex;flex-direction:column;gap:.3rem;min-width:0;flex:1}.room-share-url{font-size:.65rem;opacity:.5;word-break:break-all;cursor:pointer}.room-share-url:hover{opacity:.8}.room-share-copy{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:.25rem .6rem;border-radius:4px;cursor:pointer;font-size:.65rem;align-self:flex-start}.room-share-copy:hover{background:#223}.conn-type{cursor:pointer;opacity:.6;font-size:.75rem}.conn-legend{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:.4rem .6rem;margin-bottom:.3rem;font-size:.7rem;opacity:.7;cursor:pointer;display:flex;flex-direction:column;gap:.15rem}.device-status-bar{display:flex;gap:1.2rem;justify-content:center;align-items:center;margin-bottom:.6rem;font-size:.7rem;opacity:.6}.status-item{display:flex;align-items:center;gap:.3rem}.pad.editing .pad-pencil,.pad.editing .pad-indicators{display:none}.pad.editing{cursor:default;z-index:3}.pad.editing .label,.pad.editing .info{display:none}.pad.editing:after{display:none}.pad.editing .pad-key{display:none}.pad-edit{position:absolute;inset:0;display:flex;flex-direction:column;padding:6px;gap:3px;border-radius:12px;background:inherit}.pad-edit-hdr{display:flex;justify-content:space-between;align-items:center;font-size:.6rem;font-weight:600;min-height:0;flex-shrink:0}.pad-edit-close{background:none;border:none;color:var(--text);opacity:.5;cursor:pointer;font-size:.75rem;padding:0 2px;line-height:1}.pad-edit-close:hover{opacity:1}.drop-zone{flex:1;border:1px dashed rgba(255,255,255,.15);border-radius:4px;display:flex;align-items:center;gap:3px;padding:2px 4px;font-size:.5rem;overflow:hidden;min-height:0}.drop-zone.dragover{border-color:#ffffff80;background:#ffffff0f}.drop-zone.has-audio{border-style:solid;border-color:#ffffff1a}.dz-label{opacity:.4;text-transform:uppercase;font-weight:700;flex-shrink:0}.dz-name{opacity:.6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.dz-play{background:none;border:none;color:var(--text);opacity:.4;cursor:pointer;font-size:.55rem;padding:0;flex-shrink:0}.dz-play:hover{opacity:.8}.dz-rm{background:none;border:none;color:var(--text);opacity:.3;cursor:pointer;font-size:.55rem;padding:0;flex-shrink:0}.dz-rm:hover{opacity:.7}.pad-vol{width:100%;height:14px;-webkit-appearance:none;appearance:none;background:transparent;flex-shrink:0}.pad-vol::-webkit-slider-runnable-track{height:3px;background:#ffffff26;border-radius:2px}.pad-vol::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;border-radius:50%;background:var(--text);margin-top:-3.5px;cursor:pointer}.pad-vol::-moz-range-track{height:3px;background:#ffffff26;border-radius:2px}.pad-vol::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:var(--text);border:none;cursor:pointer}.pad-mode{background:#0a0a12;color:var(--text);border:1px solid var(--border);border-radius:3px;font-size:.5rem;padding:1px 2px;flex-shrink:0;width:100%;cursor:pointer}.key-bind{display:flex;align-items:center;gap:3px;font-size:.5rem;padding:2px 4px;border:1px solid rgba(255,255,255,.1);border-radius:4px;cursor:pointer;flex-shrink:0;min-height:0}.key-bind.learning{border-color:var(--accent);animation:pulse-border 1s infinite}@keyframes pulse-border{0%,to{border-color:var(--accent)}50%{border-color:#ffffff1a}}.key-bind-icon{opacity:.4;flex-shrink:0}.key-bind-text{opacity:.6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.hist-btn{width:100%;text-align:center;font-size:.5rem;opacity:.4;border:1px solid var(--border);border-radius:3px;padding:1px;background:none;color:var(--text);cursor:pointer}.hist-btn:hover{opacity:.7}.pad-history{max-height:120px;overflow-y:auto;font-size:.55rem;border:1px solid var(--border);border-radius:4px}.pad-history-entry{display:flex;align-items:center;gap:.3rem;padding:2px 4px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.04)}.pad-history-entry:hover{background:#ffffff0d}.pad-history-entry .ver{font-family:monospace;opacity:.5}.pad-history-entry .ts{opacity:.4;flex:1}.pad-history-entry .revert-btn{background:none;border:1px solid var(--border);color:var(--text);font-size:.5rem;padding:1px 4px;border-radius:3px;cursor:pointer;opacity:.5}.pad-history-entry .revert-btn:hover{opacity:1}.pad{width:var(--pad-size, 130px);height:var(--pad-size, 130px);border-radius:12px;border:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:transform .06s ease,box-shadow .06s ease;font-size:.85rem;touch-action:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;user-select:none;position:relative;box-shadow:0 2px 8px #0006,inset 0 1px #ffffff0d}.pad:hover{border-color:#ffffff1f}.pad.active{transform:scale(.94)}.pad .label{font-weight:600;font-size:var(--label-size, .95rem);pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.5);text-align:center;word-break:break-word;overflow-wrap:break-word;max-width:90%;line-height:1.15}.pad .info{font-size:.65rem;opacity:.5;margin-top:3px;pointer-events:none}@keyframes glow-jitter{0%{box-shadow:0 0 18px 4px var(--glow),inset 0 0 12px 2px var(--glow-inner)}25%{box-shadow:0 0 22px 6px var(--glow),inset 0 0 14px 3px var(--glow-inner)}50%{box-shadow:0 0 16px 3px var(--glow),inset 0 0 10px 1px var(--glow-inner)}75%{box-shadow:0 0 24px 5px var(--glow),inset 0 0 15px 2px var(--glow-inner)}to{box-shadow:0 0 18px 4px var(--glow),inset 0 0 12px 2px var(--glow-inner)}}.pad.playing{animation:glow-jitter .15s ease-in-out infinite;border-color:#ffffff26}.pad.toggled{border-color:#fff3}.pad.drag-ready{border-color:#ffffff4d;border-style:dashed}.pad-pencil{position:absolute;top:3px;right:3px;background:none;border:none;color:var(--text);opacity:0;cursor:pointer;font-size:.7rem;padding:2px 4px;line-height:1;z-index:1;transition:opacity .15s;pointer-events:none}.pad:hover .pad-pencil{opacity:.3;pointer-events:auto}.pad-pencil:hover{opacity:.8!important}.pad-indicators{position:absolute;bottom:4px;left:0;right:0;display:flex;justify-content:center;gap:3px;font-size:.45rem;opacity:.35;pointer-events:none}.pad-key{position:absolute;top:4px;left:4px;font-size:.5rem;opacity:.3;pointer-events:none;font-family:monospace;background:#0000004d;padding:1px 3px;border-radius:3px}@property --border-angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}.pad.blob-missing{border-color:transparent}.pad.blob-missing:before{content:"";position:absolute;inset:-2px;border-radius:14px;background:conic-gradient(from var(--border-angle),transparent 0deg 25deg,rgba(255,160,40,.5) 35deg 55deg,transparent 65deg 85deg,rgba(255,160,40,.5) 95deg 115deg,transparent 125deg 145deg,rgba(255,160,40,.5) 155deg 175deg,transparent 185deg 205deg,rgba(255,160,40,.5) 215deg 235deg,transparent 245deg 265deg,rgba(255,160,40,.5) 275deg 295deg,transparent 305deg 325deg,rgba(255,160,40,.5) 335deg 355deg,transparent 355deg 360deg);padding:2px;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:spin-border 4s linear infinite;pointer-events:none;z-index:0}@keyframes spin-border{to{--border-angle: 360deg}}.pad-blob-missing{position:absolute;bottom:4px;right:6px;font-size:.7rem;opacity:.5;pointer-events:none}.pad.reorder-ready{cursor:grab;border:2px dashed rgba(255,255,255,.5)}.pad.reorder-dragging{position:fixed;z-index:1000;pointer-events:none;opacity:.7;cursor:grabbing;box-sizing:border-box}.pad-grid{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}@media(pointer:coarse){.pad-grid{padding-inline-end:20px}}.pad-grid.reordering .pad{cursor:grabbing}.pad-add{border:2px dashed rgba(255,255,255,.15);background:#ffffff08;cursor:pointer;opacity:.5;transition:opacity .15s,border-color .15s}.pad-add:hover,.pad-add.drag-ready{opacity:.8;border-color:#ffffff59}.pad-add .label,.pad-add .info{pointer-events:none}.pad-add .label{font-size:1.8rem;opacity:.6}.pad-add .info{font-size:.6rem}.pad-add.pad-archive{border-color:#c8323266;background:#c8323214;opacity:.8;transition:opacity .15s,border-color .15s,background .15s}.pad-add.pad-archive .label{font-size:1.5rem}.pad-add.archive-hover{border-color:#ff3c3ccc;background:#c8323240;opacity:1}.pad-reorder-placeholder{box-sizing:border-box;border:2px dashed rgba(255,255,255,.3);border-radius:18px;background:transparent;flex-shrink:0}.pad-grid:has(.archive-hover) .pad-reorder-placeholder{display:none}body.activity-open{margin-right:380px;transition:margin-right .2s ease}.activity-toggle{position:fixed;bottom:8px;right:8px;background:var(--surface);border:1px solid var(--border);color:var(--text);opacity:.4;cursor:pointer;font-size:.75rem;font-family:monospace;padding:.25rem .5rem;border-radius:4px;z-index:100}.activity-toggle:hover{opacity:.7}.activity-toggle.active{opacity:.9;border-color:var(--accent)}.activity-panel{position:fixed;top:0;right:0;width:380px;height:100vh;background:#0a0a12;border-left:1px solid var(--border);display:flex;flex-direction:column;z-index:99;transform:translate(100%);transition:transform .2s ease}.activity-panel.open{transform:translate(0)}.activity-header{padding:.5rem;border-bottom:1px solid var(--border);flex-shrink:0}.activity-title{font-size:.75rem;font-weight:600;opacity:.7;text-transform:uppercase;letter-spacing:.05em}.activity-filters{display:flex;flex-wrap:wrap;gap:3px;margin-top:.35rem}.filter-chip{font-size:.6rem;font-family:monospace;padding:1px 5px;border-radius:3px;border:1px solid var(--chip-color, var(--border));background:transparent;color:var(--chip-color, var(--text));opacity:.35;cursor:pointer;transition:opacity .15s}.filter-chip.active{opacity:.9;background:color-mix(in srgb,var(--chip-color) 15%,transparent)}.filter-chip:hover{opacity:.7}.activity-entries{flex:1;overflow-y:auto;font-family:monospace;font-size:.65rem;padding:.25rem;line-height:1.4}.activity-entry{display:flex;align-items:baseline;gap:4px;padding:1px 2px;border-bottom:1px solid rgba(255,255,255,.03);white-space:nowrap;overflow:hidden}.entry-ts{color:#555;flex-shrink:0}.entry-dir{width:10px;text-align:center;flex-shrink:0}.dir-in{color:#58a6ff}.dir-out{color:#f0883e}.dir-local{color:#555}.entry-peer{color:#d2a8ff;font-weight:500;flex-shrink:0;max-width:70px;overflow:hidden;text-overflow:ellipsis}.entry-text{overflow:hidden;text-overflow:ellipsis;color:#8b949e}.cat-midi .entry-text{color:#8b949e}.cat-transport .entry-text,.cat-sync .entry-text{color:#d2a8ff}.cat-blob .entry-text{color:#58d1db}.cat-audio .entry-text{color:#f0883e}.cat-voice .entry-text{color:#58a6ff}.cat-system .entry-text{color:#8b949e}.entry-text.noteon{color:#3fb950}.entry-text.noteoff{color:#f85149}.activity-entries::-webkit-scrollbar{width:4px}.activity-entries::-webkit-scrollbar-track{background:transparent}.activity-entries::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}@media(max-width:600px){.activity-panel{width:100vw}body.activity-open{margin-right:0}}.overlay{display:flex;position:fixed;inset:0;background:#000000d9;z-index:200;align-items:center;justify-content:center}.overlay-panel{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:1.5rem;max-width:95vw;max-height:85vh;overflow:auto;display:flex;flex-direction:column;gap:.75rem}.overlay-panel h2{font-size:1rem;font-weight:500}.overlay-actions{display:flex;gap:.5rem;justify-content:flex-end}.overlay-actions button{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:.4rem .8rem;border-radius:6px;cursor:pointer;font-size:.8rem}.overlay-actions button:hover{background:#223}.editor-panel{width:min(90vw,700px)}.editor-panel textarea{width:100%;height:50vh;background:#0a0a12;color:#c9d1d9;border:1px solid var(--border);border-radius:6px;font-family:monospace;font-size:.8rem;padding:.75rem;resize:vertical}.editor-panel .buttons{display:flex;gap:.5rem;justify-content:flex-end}.editor-panel button{padding:.5rem 1rem;border-radius:6px;border:1px solid var(--border);cursor:pointer;font-size:.8rem}.editor-panel .save{background:#3a2a6e;color:#fff;border-color:#4a3a7e}.editor-panel .save:hover{background:#4a3a80}.editor-panel .cancel{background:var(--surface);color:var(--text)}.editor-panel .error{color:#ff6b6b;font-size:.8rem;min-height:1.2em}.history-panel{width:min(90vw,600px)}.history-loading,.history-empty{font-size:.85rem;opacity:.5}.history-list{display:flex;flex-direction:column;gap:.35rem;max-height:60vh;overflow-y:auto}.history-entry{display:flex;align-items:center;gap:.75rem;padding:.4rem .5rem;border-radius:6px;background:#ffffff08}.history-entry:hover{background:#ffffff0f}.history-label{font-weight:500;font-size:.85rem;min-width:6rem}.history-time{font-size:.75rem;opacity:.45;flex:1}.history-revert{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:.25rem .6rem;border-radius:5px;cursor:pointer;font-size:.75rem}.history-revert:hover{background:#223}.samples-panel{width:min(90vw,650px)}@media(min-width:900px){.samples-panel{width:min(90vw,900px)}}@media(min-width:1400px){.samples-panel{width:min(90vw,1100px)}}.samples-panel.drag-over{outline:2px dashed rgba(100,200,100,.5);outline-offset:-4px;background:#64c8640d}.samples-summary{font-weight:400;font-size:.75rem;opacity:.5;margin-left:.75rem}.samples-loading,.samples-empty{font-size:.85rem;opacity:.5}.samples-list{display:flex;flex-direction:column;gap:.3rem;max-height:60vh;overflow-y:auto}.sample-entry{display:flex;flex-direction:column;gap:.2rem;padding:.4rem .5rem;border-radius:6px;background:#ffffff08}.sample-entry:hover{background:#ffffff0f}.sample-entry.orphan{opacity:.5}.sample-entry.child{margin-left:1rem;border-left:2px solid rgba(140,180,255,.15);padding-left:.6rem}.sample-children{display:flex;flex-direction:column;gap:.3rem}.sample-row-1{display:flex;align-items:center;gap:.5rem}.sample-name{font-size:.85rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;cursor:text}.sample-name-input{flex:1;min-width:0;font:inherit;font-size:.85rem;background:#ffffff14;color:inherit;border:1px solid rgba(140,180,255,.4);border-radius:3px;padding:0 .3rem;outline:none}.sample-usage{display:flex;gap:.35rem;flex-wrap:wrap;margin-left:auto}.sample-ref{font-size:.7rem;padding:.15rem .4rem;border-radius:4px;background:#6464c826;white-space:nowrap}.sample-orphan-label{font-size:.7rem;color:#f96;font-style:italic}.sample-play{background:none;border:1px solid rgba(255,255,255,.15);color:var(--text);border-radius:4px;cursor:pointer;font-size:.7rem;padding:.2rem .35rem;line-height:1;flex-shrink:0}.sample-play:hover{background:#ffffff1a}.voice-cue-btn{background:none;border:1px solid rgba(200,160,50,.3);color:#c8a03299;border-radius:4px;cursor:pointer;font-size:.5rem;padding:.15rem .3rem;line-height:1;flex-shrink:0;letter-spacing:-.15em}.voice-cue-btn:hover{background:#c8a0321a}.voice-cue-btn.active{background:#c8a03233;border-color:#c8a03299;color:#c8a032}.sample-ref.voice-cue{background:#c8a03233;color:#c8a032;border-color:#c8a03266}.sample-download{background:none;border:1px solid rgba(140,180,255,.3);color:#8cb4ff;border-radius:4px;cursor:pointer;font-size:.9rem;padding:.1rem .4rem;line-height:1;flex-shrink:0}.sample-download:hover{background:#8cb4ff26}.sample-add{background:none;border:1px solid rgba(100,200,100,.3);color:#8c8;border-radius:4px;cursor:pointer;font-size:.9rem;padding:.1rem .45rem;line-height:1;flex-shrink:0}.sample-add:hover{background:#64c86426}.sample-delete{background:none;border:1px solid rgba(255,100,100,.3);color:#ff6b6b;border-radius:4px;cursor:pointer;font-size:.9rem;padding:.1rem .4rem;line-height:1;flex-shrink:0}.sample-delete:hover{background:#ff646426}.btn-purge-all{background:#ff64641a;color:#f96;border:1px solid rgba(255,100,100,.3);padding:.4rem .8rem;border-radius:6px;cursor:pointer;font-size:.8rem}.btn-purge-all:hover{background:#ff646433}.sample-waveform-wrap{position:relative;width:100%;height:48px;cursor:col-resize}@media(min-width:900px){.sample-waveform-wrap{height:64px}}@media(min-width:1400px){.sample-waveform-wrap{height:80px}}.sample-waveform{width:100%;height:100%;border-radius:3px;background:#0000004d;display:block}.waveform-trim-overlay{position:absolute;top:0;height:100%;background:#ff505026;pointer-events:none;border-radius:3px}.waveform-trim-line{position:absolute;top:0;width:1px;height:100%;background:#ff7878b3;pointer-events:none}.waveform-playhead{position:absolute;top:0;width:1.5px;height:100%;background:#ffffffd9;pointer-events:none;z-index:1}.sample-row-3{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;font-size:.7rem;opacity:.45;white-space:nowrap}.sample-duration{min-width:2.8em;text-align:right;font-variant-numeric:tabular-nums}.sample-samplerate{min-width:3em;text-align:right;font-variant-numeric:tabular-nums}.sample-channels{min-width:1.4em;text-align:center;letter-spacing:-.1em}.sample-type,.sample-hash{font-family:monospace}.sample-size{min-width:4.5em;text-align:right;font-variant-numeric:tabular-nums}.sample-timestamp{min-width:4em;text-align:right}.rec-settings{display:flex;gap:.75rem;font-size:.75rem;opacity:.7}.rec-settings label{display:flex;align-items:center;gap:.3rem;cursor:pointer}.rec-settings label.active{opacity:1}.rec-settings label:not(.active){opacity:.45}.rec-settings input[type=checkbox]{accent-color:var(--accent-hover);margin:0}.btn-record{background:none;border:1px solid rgba(255,100,100,.3);color:var(--text);padding:.4rem .8rem;border-radius:6px;cursor:pointer;font-size:.8rem;user-select:none;touch-action:none;min-width:7.5em;font-variant-numeric:tabular-nums}.btn-mic-permission{border-color:#8cb4ff4d;color:#8cb4ff}.btn-mic-permission:hover{background:#8cb4ff1a}.btn-mic-permission.denied{border-color:#ff64644d;color:#f88;cursor:not-allowed;opacity:.7}.btn-record.recording{background:#ff32324d;border-color:#f44;color:#f66;animation:record-pulse 1s ease-in-out infinite}@keyframes record-pulse{0%,to{opacity:1}50%{opacity:.6}}.route-panel{max-width:95vw}.route-panel h3{display:flex;align-items:baseline;gap:.4rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;opacity:.5;margin:.8rem 0 .4rem;font-weight:500}.route-panel h3 .col-label{width:36px;text-align:center;font-weight:400}.route-panel h3 .col-label:first-of-type{margin-left:auto}.midi-devices-section{border-bottom:1px solid var(--border);padding-bottom:.6rem;margin-bottom:.2rem}.route-matrix{border-collapse:collapse}.route-matrix th{font-size:.7rem;font-weight:400;opacity:.7;padding:.2rem .3rem}.route-matrix th.col-hdr{writing-mode:vertical-lr;transform:rotate(180deg);text-align:left;padding-bottom:.4rem;vertical-align:bottom}.route-matrix th.row-hdr{text-align:right;padding-right:.5rem;white-space:nowrap}.route-matrix th.corner{font-size:.55rem;opacity:.3;text-align:right;padding-right:.5rem}.route-matrix td{padding:.15rem;text-align:center}.route-dot{width:22px;height:22px;border-radius:4px;border:1px solid var(--border);background:transparent;cursor:pointer;padding:0}.route-dot:hover{border-color:#4a3a7e;background:#3a2a6e33}.route-dot.on{background:var(--accent);border-color:#6a5a9e;box-shadow:0 0 6px #6446b466}.route-empty{font-size:.75rem;opacity:.3;font-style:italic}.route-matrix .led-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#ffffff1a;transition:background .08s}.route-matrix th.row-hdr .led-dot{margin-left:6px}.route-matrix .led-row th{padding:0 0 4px;text-align:center}.route-matrix .led-dot.rx{background:#4caf50;box-shadow:0 0 4px #4caf50}.route-matrix .led-dot.tx{background:#2196f3;box-shadow:0 0 4px #2196f3}.voice-wrap{position:fixed;bottom:1.5rem;right:1.5rem;z-index:100;display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.voice-speakers{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;pointer-events:none}.voice-speakers.visible{opacity:1;transform:translateY(0)}.voice-speaker{background:#328cc8d9;color:#fff;font-size:.75rem;padding:.2rem .6rem;border-radius:1rem;white-space:nowrap;box-shadow:0 2px 8px #0006}.voice-btn{width:56px;height:56px;border-radius:50%;border:2px solid rgba(255,255,255,.15);background:#1e1e32e6;color:var(--text);font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 12px #00000080;transition:transform .1s,border-color .1s,background .1s}.voice-btn:hover:not(:disabled){border-color:#ffffff4d}.voice-btn:active:not(:disabled){transform:scale(.92)}.voice-btn.broadcasting{background:#c83232b3;border-color:#f44;animation:voice-pulse .8s ease-in-out infinite}.voice-btn.mic-denied:not(:disabled){border-color:#ff505080}.voice-btn.mic-prompt:not(:disabled){border-color:#ffc83266}.voice-btn.mic-granted:not(:disabled):not(.broadcasting):not(.receiving){border-color:#50c85066}.voice-btn.disabled,.voice-btn:disabled{opacity:.3;cursor:not-allowed}.voice-btn.receiving{background:#328cc8b3;border-color:#4af;animation:voice-receive .8s ease-in-out infinite}@keyframes voice-pulse{0%,to{box-shadow:0 0 12px #ff32324d}50%{box-shadow:0 0 24px #ff323299}}@keyframes voice-receive{0%,to{box-shadow:0 0 12px #328cff4d}50%{box-shadow:0 0 24px #328cff99}}.quick-record-wrap{position:fixed;bottom:1.5rem;left:1.5rem;z-index:100;display:flex;flex-direction:column;align-items:flex-start;gap:.5rem}.quick-record-btn{width:56px;height:56px;border-radius:50%;border:2px solid rgba(255,255,255,.15);background:#1e1e32e6;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 12px #00000080;transition:transform .1s,border-color .1s,background .1s;padding:0}.quick-record-btn:hover:not(:disabled){border-color:#ffffff4d}.quick-record-btn:active:not(:disabled){transform:scale(.92)}.quick-record-dot{width:20px;height:20px;border-radius:50%;background:#c33;transition:background .15s}.quick-record-btn:hover:not(:disabled) .quick-record-dot{background:#e44}.quick-record-btn.recording{background:#c83232b3;border-color:#f44;animation:qr-pulse .8s ease-in-out infinite}.quick-record-btn.recording .quick-record-dot{background:#f66;border-radius:3px;width:18px;height:18px}.quick-record-btn.mic-denied:not(:disabled){border-color:#ff505080}.quick-record-btn.mic-prompt:not(:disabled){border-color:#ffc83266}.quick-record-btn.mic-granted:not(:disabled):not(.recording){border-color:#50c85066}.quick-record-time{position:absolute;top:-1.6rem;left:50%;transform:translate(-50%);font-size:.75rem;font-family:monospace;font-variant-numeric:tabular-nums;color:#f66;white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.8)}@keyframes qr-pulse{0%,to{box-shadow:0 0 12px #ff32324d}50%{box-shadow:0 0 24px #ff323299}}:root{--bg: #111119;--surface: #181825;--text: #ccc;--border: #2a2a3a;--accent: #3a2a6e;--accent-hover: #4a3a80}*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:calc(1.5rem + env(safe-area-inset-top,0px)) calc(1rem + env(safe-area-inset-right,0px)) calc(0px + env(safe-area-inset-bottom,0px)) calc(1rem + env(safe-area-inset-left,0px));user-select:none}.app-root{display:flex;flex-direction:column;align-items:center;width:100%;position:relative}.drop-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#3a2a6e66;border:3px dashed rgba(255,255,255,.4);font-size:1.5rem;color:#fff;pointer-events:none}.app-footer{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:1rem;padding:.3rem .6rem calc(.3rem + env(safe-area-inset-bottom,0px));font-size:.6rem;opacity:.3;pointer-events:none}.footer-item{white-space:nowrap}
