.vr{gap:20px;display:grid}.vr .media-controls .tool-btn{white-space:nowrap;flex:none}.vr-rec-ico{background:#e0563b;border-radius:50%;flex:none;width:14px;height:14px}.vr-rec-ico.vr-big{width:26px;height:26px}.vr-rec{background:var(--ink);color:#fff;height:52px;font:inherit;cursor:pointer;transition:transform .35s var(--ease-spring), background-color .2s;border:0;border-radius:999px;align-items:center;gap:10px;padding:0 24px 0 18px;font-size:15px;font-weight:600;display:inline-flex}.vr-rec:hover{transform:translateY(-1px)}.vr-rec:active{transform:scale(.97)}.vr-rec.is-on{background:var(--accent)}.vr-rec.is-on .vr-rec-ico{background:#fff;border-radius:3px}.vr-badge[data-rec=rec]{color:var(--accent)}.vr-dot{background:var(--accent);border-radius:50%;width:8px;height:8px;animation:1.4s ease-in-out infinite vr-blink}@keyframes vr-blink{50%{opacity:.25}}.vr-transport{flex-wrap:wrap;align-items:center;gap:12px 14px;display:flex}.vr-time{min-width:6.5ch;font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--faint);font-size:clamp(26px,3vw,34px);font-weight:500}.vr-time[data-rec=rec]{color:var(--ink)}.vr-time[data-rec=paused]{color:var(--muted)}.vr-key{color:var(--muted);margin-left:auto;font-size:13px}.vr-key kbd{background:var(--surface);box-shadow:var(--ring);font-family:var(--font-mono);color:var(--ink);border-radius:7px;padding:2px 8px;font-size:12px}.vr-cards{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:12px;display:grid}.vr-name input{background:var(--surface);box-shadow:var(--ring)}.vr-wave{--h:16px;background:var(--surface);height:120px;box-shadow:var(--ring);border-radius:16px;position:relative}.vr-wave canvas{top:0;bottom:0;left:calc(var(--h) / 2);width:calc(100% - var(--h));cursor:pointer;touch-action:pan-y;height:100%;position:absolute}.vr-wave canvas:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:4px}.vr-trim{appearance:none;pointer-events:none;background:0 0;width:100%;height:100%;margin:0;padding:0;position:absolute;inset:0}.vr-trim:focus-visible{outline:none}.vr-trim::-webkit-slider-runnable-track{background:0 0;height:100%}.vr-trim::-moz-range-track{background:0 0;height:100%}.vr-trim::-webkit-slider-thumb{width:var(--h);background:linear-gradient(var(--accent), var(--accent)) center / 3px 100% no-repeat, #a84a1c1f;appearance:none;pointer-events:auto;cursor:ew-resize;border:0;border-radius:8px;height:120px}.vr-trim::-moz-range-thumb{width:var(--h);background:linear-gradient(var(--accent), var(--accent)) center / 3px 100% no-repeat, #a84a1c1f;pointer-events:auto;cursor:ew-resize;border:0;border-radius:8px;height:120px}.vr-trim:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--ink);background-color:#a84a1c47}.vr-trim:focus-visible::-moz-range-thumb{box-shadow:0 0 0 2px var(--ink);background-color:#a84a1c47}.vr-times{color:var(--muted);flex-wrap:wrap;gap:6px 18px;font-size:13px;display:flex}.vr-times b{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink);font-weight:500}.vr-at{margin-left:auto}.vr-list{gap:6px;max-height:300px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.vr-list li{background:var(--surface);box-shadow:var(--ring);border-radius:14px;align-items:center;gap:4px;display:flex}.vr-list li.is-sel{box-shadow:inset 0 0 0 2px var(--ink)}.vr-take{border-radius:inherit;min-width:0;color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:1;gap:2px;padding:10px 12px;display:grid}.vr-take b{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;overflow:hidden}.vr-take span{font-family:var(--font-mono);color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}.vr-del{width:36px;height:36px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:50%;flex:none;place-items:center;margin-right:6px;display:grid}.vr-del:hover{background:var(--tile);color:var(--ink)}@media (max-width:899px){.vr-cards{grid-template-columns:1fr}}@media (max-width:679px){.vr-rec{flex:auto;justify-content:center}.vr-time{text-align:center;flex:100%;order:-1}.vr-key{display:none}.vr-wave{height:104px}.vr-trim::-webkit-slider-thumb{height:104px}.vr-trim::-moz-range-thumb{height:104px}.vr-at{margin-left:0}}@media (hover:none){.vr-key{display:none}}
