.ciq-waveform{--wf-height:154px;border:1px solid #28516b;border-radius:5px;overflow:hidden;background:#071722;box-shadow:inset 0 0 25px #071018}.ciq-waveform-media:not(.video){display:none}.ciq-waveform-media.video{display:block;width:100%;max-height:260px;background:#000}.ciq-waveform-head{height:37px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1c4058;background:linear-gradient(180deg,#102b3d,#0a1d2b)}.ciq-waveform-head>div{display:flex;align-items:center;gap:7px}.ciq-waveform-head i{color:var(--cyan)}.ciq-waveform-head b{font-size:11px;text-transform:uppercase;letter-spacing:.05em}.ciq-waveform-state{color:var(--muted);font-size:10px}.waveform-legend{display:flex!important;gap:8px!important}.waveform-legend span{font-size:9px}.waveform-legend span:before{content:"";display:inline-block;width:6px;height:6px;margin-right:3px;border-radius:50%;background:currentColor}.waveform-legend .cue{color:#e66dd7}.waveform-legend .intro{color:#53aff4}.waveform-legend .hook{color:#8edb55}.waveform-legend .vocal{color:#f2c84d}.waveform-legend .outro{color:#ff8248}.waveform-legend .mixout{color:#c56aff}
.ciq-waveform-stage{position:relative;height:var(--wf-height);cursor:crosshair;overflow:hidden;background:linear-gradient(180deg,#07131e,#0a1c29 50%,#07131e)}.ciq-waveform-stage:before{content:"";position:absolute;z-index:0;inset:0;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),#29495d55 calc(10% - 1px) 10%),linear-gradient(transparent calc(50% - .5px),#45657a88 50%,transparent calc(50% + .5px))}.ciq-waveform-stage canvas{position:absolute;z-index:1;inset:0;width:100%;height:100%}.ciq-waveform-markers{position:absolute;z-index:3;inset:0;pointer-events:none}.ciq-waveform-marker{--marker:#fff;position:absolute;top:0;bottom:0;width:1px;background:var(--marker);pointer-events:auto;cursor:ew-resize;filter:drop-shadow(0 0 3px #000)}.ciq-waveform-marker:before{content:"";position:absolute;top:0;left:-5px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--marker)}.ciq-waveform-marker b{position:absolute;top:9px;left:4px;padding:2px 5px;border:1px solid var(--marker);border-radius:2px;background:#06111ddd;color:var(--marker);font-size:9px;white-space:nowrap}.ciq-waveform-marker.right b{left:auto;right:4px}.ciq-waveform-marker.cue{--marker:#e66dd7}.ciq-waveform-marker.intro{--marker:#53aff4}.ciq-waveform-marker.hook{--marker:#8edb55}.ciq-waveform-marker.vocal{--marker:#f2c84d}.ciq-waveform-marker.outro{--marker:#ff8248}.ciq-waveform-marker.mixout{--marker:#c56aff}.ciq-waveform-playhead{position:absolute;z-index:4;left:0;top:0;bottom:0;width:1px;background:#fff;pointer-events:none;box-shadow:0 0 5px #fff}.ciq-waveform-playhead:before{content:"";position:absolute;top:0;left:-4px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid #fff}.ciq-waveform-playhead span{position:absolute;bottom:4px;left:4px;padding:1px 4px;background:#06111ddd;color:#fff;font-size:9px;white-space:nowrap}
.ciq-waveform-auditions{min-height:39px;display:flex;align-items:center;gap:5px;padding:5px 8px;border-top:1px solid #23475e;background:#091d2b}.ciq-waveform-auditions>span{margin-right:3px;color:#87a2b5;font-size:9px;text-transform:uppercase;letter-spacing:.05em}.ciq-waveform-auditions>span i{color:#42baff}.ciq-waveform-auditions button{height:28px;padding:0 9px;border:1px solid #345d76;border-radius:3px;background:#102c40;color:#dceaf3;font-size:10px}.ciq-waveform-auditions button:hover:not(:disabled){border-color:#32aaff;background:#12486b}.ciq-waveform-auditions button[data-audition="hook"]{border-color:#568837;color:#a6e67c}.ciq-waveform-auditions button[data-audition="vocal"]{border-color:#8e7834;color:#f2d86e}.ciq-waveform-auditions button[data-audition="outro"],.ciq-waveform-auditions button[data-audition="ending"]{border-color:#845033;color:#ffad7e}.ciq-waveform-auditions button:disabled{opacity:.35;cursor:not-allowed}
.ciq-waveform-zoom{min-width:245px;margin-left:auto;display:flex;align-items:center;gap:4px}.ciq-waveform-zoom button{width:28px;padding:0}.ciq-waveform-zoom button:first-child{width:36px}.ciq-waveform-zoom b{min-width:25px;text-align:center;color:#61bfff;font-size:10px}.ciq-waveform-zoom input{min-width:90px;flex:1;accent-color:#31a8ed}.ciq-waveform-zoom input:disabled{opacity:.3}
.ciq-transport{height:49px;display:flex;align-items:center;gap:6px;padding:6px 8px;border-top:1px solid #23475e;background:linear-gradient(180deg,#102638,#0a1b29)}.ciq-transport button{position:relative;width:34px;height:34px;border:1px solid #365b72;border-radius:4px;background:#102d42;color:#dceaf3}.ciq-transport button:hover{border-color:#31a8ed;background:#124568}.ciq-transport button small{position:absolute;right:4px;bottom:2px;font-size:7px}.ciq-transport .transport-play{width:42px;background:linear-gradient(#168fff,#0964b9);border-color:#30a5ff}.ciq-transport .transport-play.playing{background:linear-gradient(#ef484d,#ad1f25);border-color:#ff6a6e}.transport-time{min-width:126px;display:flex;align-items:baseline;gap:5px;padding:0 6px;font-variant-numeric:tabular-nums}.transport-time b{color:#61bfff;font-size:13px}.transport-time em,.transport-time span{color:var(--muted);font-size:10px;font-style:normal}.transport-scrub{flex:1;min-width:70px;accent-color:var(--blue)}.transport-volume{width:80px;accent-color:var(--cyan)}.volume-icon{color:var(--muted)}
@media(max-width:900px){.ciq-waveform-auditions{flex-wrap:wrap}.ciq-waveform-zoom{width:100%;margin-left:0}}
@media(max-width:700px){.waveform-legend{display:none!important}.ciq-waveform{--wf-height:120px}.transport-volume,.volume-icon{display:none}.transport-time{min-width:105px}.ciq-transport button{width:30px}.ciq-transport{gap:3px}.ciq-waveform-auditions>span{display:none}.ciq-waveform-auditions button{flex:0 0 auto}.ciq-waveform-zoom input{min-width:70px}}
.waveform-legend .hookstart{color:#8edb55}.ciq-waveform-marker.hookstart,.ciq-waveform-marker.hookend{--marker:#8edb55}.ciq-waveform-hook-region{display:none;position:absolute;z-index:2;top:0;bottom:0;border-left:1px solid #8edb55;border-right:1px solid #8edb55;background:linear-gradient(180deg,#8edb553d,#8edb5518 50%,#8edb553d);box-shadow:inset 0 0 16px #8edb5524;pointer-events:none}.ciq-waveform-hook-region.active{display:block}