/*
 * OscMix Web
 * Copyright (C) 2026 Martin Augustyniak
 * SPDX-License-Identifier: GPL-3.0-or-later
 * https://www.gnu.org/licenses/gpl-3.0.html
 */
.strip{flex:0 0 auto;width:var(--strip-width);background:var(--strip-bg);border:1px solid var(--strip-border);border-radius:4px;display:flex;flex-direction:column;align-items:stretch;padding:0;position:relative}.loop-mark{font-size:12px;line-height:12px;color:var(--accent-orange);visibility:hidden}.loop-mark.on{visibility:visible}.strip>.loop-mark{position:absolute;top:26px}.strip.ab-linked{--cap-line: var(--accent-green)}.fader-row>.loop-mark{position:absolute;bottom:1px}.loop-mark.l{left:6px}.loop-mark.r{right:6px}.strip .hdr{height:18px;line-height:18px;text-align:center;font-size:11px;font-weight:600;border-radius:3px 3px 0 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:0 4px;cursor:context-menu;background:var(--channel-color, var(--accent));color:#16171a}.strip .hdr-edit{height:18px;width:100%;text-align:center;font-family:inherit;font-weight:600;font-size:11px;line-height:18px;color:var(--text);background:#14151a;border:1px solid var(--accent);border-radius:3px 3px 0 0;padding:0 4px;outline:none}.strip .fader-row{display:flex;justify-content:center;align-items:stretch;gap:2px;margin:2px 0;position:relative}.strip .fader-row .fader{font-size:12px;align-self:center;position:relative;left:2px}.strip.off{opacity:.5}.strip.submix-active{border-color:var(--channel-color, var(--accent));background:var(--strip-bg-active)}.side-buttons{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:140px}.gear,.side-btn{width:20px;height:20px;display:flex;align-items:center;justify-content:center;background:var(--btn);border:1px solid #14151a;border-radius:4px;color:var(--text-dim);cursor:pointer;line-height:1;padding:0}.gear{font-size:14px}.side-btn{font-size:9px;font-weight:700}.gear:hover,.side-btn:hover{color:var(--text)}.gear.lit,.side-btn.lit{color:#a8703c}.gear.win,.side-btn.win{border-color:#6e4420}.gear.active,.side-btn.active{color:#f29a48;border-color:#a8642a}.bottom-spacer{height:18px;line-height:18px;text-align:center;font-size:10px;color:var(--text-dim);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.relayout-anim{transition:width calc(var(--relayout-duration-ms) * 1ms) ease!important;overflow:hidden;will-change:width}.relayout-collapsed{width:0!important}.strip>.mono-ph{align-self:center;height:var(--knob-size);margin:4px 0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;color:var(--text-dim)}.strip .rec-row{display:none;gap:3px;justify-content:center;margin:2px 4px}body.rec-controls-mode .strip:not([data-bus=playback]) .btns{display:none}body.rec-controls-mode .strip .rec-row{display:flex}.rec-row .btn.rec.on{background:#d24b4b;border-color:#8a2020;color:#fff;animation:rec-pulse 1.1s ease-in-out infinite;animation-play-state:paused}body.durec-recording .rec-row .btn.rec{pointer-events:none}body.durec-recording .rec-row .btn.rec.on{animation-play-state:running}@keyframes rec-pulse{50%{opacity:.35}}.playchan-select{height:18px;flex:1;min-width:0;font-family:inherit;font-size:9px;font-weight:700;color:var(--text-dim);background:var(--btn);border:1px solid #14151a;border-radius:3px;padding:0 1px;cursor:pointer;appearance:none;-webkit-appearance:none;text-align:center;text-align-last:center}.playchan-select:hover{color:var(--text)}.playchan-select:focus{outline:none;box-shadow:none}.playchan-select.on{background:#3ec1d5;border-color:#2a8fa0;color:#06272c}