:root{--fondo:#0b0f0c;--superficie:#121a14;--superficie-2:#1b2a1f;--borde:#24382b;--texto:#edf7ee;--texto-sec:#7da48b;--primario:#3ce98a;--halo:#b8ff5e;--destructivo:#ff5252;--radio:12px;--radio-card:14px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body,#root{height:100%}body{background:var(--fondo);color:var(--texto);overscroll-behavior:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;font-family:system-ui,-apple-system,sans-serif;font-size:16px}button{background:var(--superficie);color:var(--texto);border-radius:var(--radio);cursor:pointer;border:none;min-height:52px;font-family:inherit;font-size:16px;font-weight:700}button:active{filter:brightness(1.35)}input,select{background:var(--superficie-2);color:var(--texto);border:1px solid var(--borde);border-radius:var(--radio);min-height:44px;padding:0 10px;font-family:inherit;font-size:16px}input[type=range]{min-height:44px;accent-color:var(--primario);padding:0}.app{height:100dvh;padding-top:var(--safe-top);flex-direction:column;display:flex}.contenido{padding:12px 14px;padding-bottom:calc(12px + var(--safe-bottom));flex:1;overflow-y:auto}.tabs{padding:4px 6px calc(4px + var(--safe-bottom));background:var(--superficie);border-top:1px solid var(--borde);grid-template-columns:repeat(6,1fr);gap:1px;display:grid}.tabs button{min-height:46px;color:var(--texto-sec);letter-spacing:0;background:0 0;padding:0 1px;font-size:11px;font-weight:600}.tabs button.activa{color:var(--primario)}.player{height:100%;padding:8px 14px calc(8px + var(--safe-bottom));flex-direction:column;gap:6px;display:flex;overflow:hidden}.player-header{color:var(--texto-sec);text-transform:uppercase;letter-spacing:.06em;justify-content:space-between;align-items:center;font-size:12px;font-weight:600;display:flex}.anillo-zona{flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.anillo{aspect-ratio:1;background:conic-gradient(var(--primario) 0%, var(--halo) 30%, #1b6b45 55%, var(--primario) 100%);border-radius:50%;width:min(78vw,40vh);padding:5px;position:relative}.anillo:after{content:"";box-shadow:0 0 34px 6px color-mix(in srgb, var(--primario) 60%, transparent), inset 0 0 0 4px var(--primario);opacity:0;pointer-events:none;border-radius:50%;position:absolute;inset:-6px}.anillo.flash:after{opacity:1}.anillo.flash.acento:after{box-shadow:0 0 60px 12px color-mix(in srgb, var(--halo) 75%, transparent), inset 0 0 0 5px var(--halo)}.anillo-interior{background:var(--fondo);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:0;width:100%;height:100%;display:flex}.anillo-bpm{font-variant-numeric:tabular-nums;font-size:clamp(56px,13vh,92px);font-weight:800;line-height:.95}.anillo-sub{color:var(--texto-sec);letter-spacing:.18em;font-size:12px;font-weight:600}.anillo-beat{color:var(--primario);font-variant-numeric:tabular-nums;min-height:24px;font-size:18px;font-weight:700}.info-cancion{text-align:center}.info-cancion .nombre{white-space:nowrap;text-overflow:ellipsis;font-size:19px;font-weight:700;overflow:hidden}.info-cancion .detalle{color:var(--texto-sec);font-variant-numeric:tabular-nums;font-size:13px}.siguiente-cancion{text-align:center;color:var(--texto-sec);white-space:nowrap;text-overflow:ellipsis;font-size:14px;overflow:hidden}.siguiente-cancion strong{color:var(--texto)}.btn-next{letter-spacing:.04em;border:1px solid var(--borde);min-height:84px;font-size:22px;font-weight:800}.btn-next.en-cola{background:var(--primario);color:#06130b;animation:.5s ease-in-out infinite alternate pulsar}@keyframes pulsar{0%{opacity:1}to{opacity:.65}}@media (prefers-reduced-motion:reduce){.btn-next.en-cola{animation:none}}.fila-inferior{grid-template-columns:2fr 1fr;gap:6px;display:grid}.btn-play{background:var(--primario);color:#06130b;min-height:64px;font-size:20px}.btn-play.stop{background:var(--destructivo);color:#fff}.fila-inferior button{min-height:64px}.libre{height:100%;padding:8px 14px calc(8px + var(--safe-bottom));flex-direction:column;gap:8px;display:flex;overflow:hidden}.libre-steppers{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.libre-steppers button{font-variant-numeric:tabular-nums;border:1px solid var(--borde);min-height:56px;font-size:17px}.libre-opciones{grid-template-columns:1fr 1fr;gap:6px;display:grid}.btn-tap{border:1px solid var(--primario);min-height:64px;color:var(--primario);background:0 0;font-size:18px}.lista{flex-direction:column;gap:6px;display:flex}.card{background:var(--superficie);border-radius:var(--radio-card);align-items:center;gap:10px;min-height:54px;padding:10px 14px;display:flex}.card .principal{flex:1;min-width:0}.card .titulo{white-space:nowrap;text-overflow:ellipsis;font-size:16px;font-weight:700;overflow:hidden}.card .sub{color:var(--texto-sec);font-variant-numeric:tabular-nums;font-size:13px}.card.activa{outline:2px solid var(--primario)}.btn-mini{background:var(--superficie-2);min-width:44px;min-height:44px;font-size:17px}.btn-crear{background:var(--primario);color:#06130b;width:100%;margin-top:10px;font-size:17px}.btn-borrar{color:var(--destructivo);background:0 0;min-height:44px;font-size:14px}h2{margin-bottom:10px;font-size:18px}.form-fila{justify-content:space-between;align-items:center;gap:10px;min-height:48px;display:flex}.form-fila label{color:var(--texto-sec);font-size:14px}.segmento-card{background:var(--superficie);border-radius:var(--radio-card);flex-direction:column;gap:6px;padding:10px 12px;display:flex}.segmento-card .fila{align-items:center;gap:6px;display:flex}.segmento-card input[type=number]{text-align:center;font-variant-numeric:tabular-nums;width:68px}.aviso{background:var(--superficie);border-left:3px solid var(--primario);border-radius:var(--radio);color:var(--texto-sec);padding:10px 14px;font-size:13px;line-height:1.4}.buscador{width:100%;margin-bottom:8px}.beats{justify-content:center;align-items:center;gap:7px;min-height:18px;display:flex}.beats button{background:var(--superficie-2);border:1px solid var(--borde);pointer-events:none;border-radius:50%;width:13px;height:13px;min-height:0;padding:0}.beats.tocable button{pointer-events:auto;width:22px;height:22px}.beats .acento{border-color:var(--texto-sec)}.beats .on{background:var(--primario);border-color:var(--primario)}.beats .on.acento{background:var(--halo);border-color:var(--halo);box-shadow:0 0 10px var(--halo)}.pista{text-align:center;color:var(--texto-sec);font-size:11px}.player.practica .anillo,.libre .anillo{width:min(62vw,30vh)}.anillo.mudo{opacity:.45}.anillo.mudo.flash:after{opacity:.5}.notas{color:var(--texto-sec);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.tempo-steppers{grid-template-columns:repeat(7,1fr);gap:4px;display:grid}.tempo-steppers button{font-variant-numeric:tabular-nums;border:1px solid var(--borde);min-height:48px;padding:0;font-size:14px}.tempo-steppers button.on{color:var(--primario);border-color:var(--primario)}.tempo-steppers button:disabled{opacity:.35}.chips{grid-template-columns:repeat(4,1fr);gap:4px;display:grid}.chip{border:1px solid var(--borde);background:var(--superficie);min-height:46px;padding:0 4px;font-size:12px;font-weight:700;line-height:1.15}.chip.on{background:var(--superficie-2);color:var(--primario);border-color:var(--primario)}.chips.cuatro .chip{font-size:18px}.btn-next.chica{min-height:56px;font-size:17px}.fila-inferior.tres{grid-template-columns:2fr 1fr 1fr}.fila-inferior.tres button:not(.btn-play){border:1px solid var(--borde);font-size:14px}.hoja-fondo{z-index:20;background:#0000009e;align-items:flex-end;display:flex;position:fixed;inset:0}.hoja{background:var(--superficie);border-top:1px solid var(--borde);width:100%;max-height:82dvh;padding:12px 14px calc(16px + var(--safe-bottom));border-radius:18px 18px 0 0;overflow-y:auto}.hoja-head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;display:flex}.hoja h3{white-space:nowrap;text-overflow:ellipsis;font-size:17px;overflow:hidden}.hoja .card{background:var(--superficie-2)}.hoja .card.activa{outline-color:var(--halo)}.hoja input[type=number]{text-align:center;font-variant-numeric:tabular-nums;width:90px}.acentos{flex-wrap:wrap;gap:4px;display:flex}.acentos button{border:1px solid var(--borde);background:var(--superficie-2);width:38px;min-width:38px;min-height:38px;padding:0;font-size:14px}.acentos button.on{color:#06130b;background:var(--primario);border-color:var(--primario)}.btn-mini.primario{background:var(--primario);color:#06130b}.btn-mini.tap-chico{min-width:52px;font-size:13px}.editor-head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.editor-head h2{margin-bottom:0}.editor-head .btn-mini{padding:0 12px;font-size:14px}textarea{background:var(--superficie-2);color:var(--texto);border:1px solid var(--borde);border-radius:var(--radio);resize:vertical;width:100%;min-height:72px;padding:8px 10px;font-family:inherit;font-size:16px}.orden{gap:6px;margin-bottom:8px;display:flex}.orden button{min-height:36px;color:var(--texto-sec);border:1px solid var(--borde);flex:1;font-size:13px}.orden button.on{color:var(--primario);border-color:var(--primario)}.card.item-set{flex-wrap:wrap}.card.item-set .acciones{gap:6px;width:100%;display:flex}.card.item-set .acciones button{flex:1;font-size:14px}.calibrador{background:var(--superficie);border-radius:var(--radio-card);flex-direction:column;gap:8px;padding:12px;display:flex}.calibra-fila{align-items:center;gap:10px;display:flex}.calibra-punto{background:var(--superficie-2);border:1px solid var(--borde);border-radius:50%;flex-shrink:0;width:44px;height:44px}.calibra-punto.on{background:var(--primario);border-color:var(--primario);box-shadow:0 0 18px var(--primario)}.calibra-punto.on.acento{background:var(--halo);border-color:var(--halo);box-shadow:0 0 26px var(--halo)}.calibra-valor{font-variant-numeric:tabular-nums;margin-left:auto;font-weight:700}.calibra-pies{color:var(--texto-sec);justify-content:space-between;align-items:center;font-size:12px;display:flex}.btn-mini.rojo{background:var(--destructivo);color:#fff}.metro{height:100%;padding:8px 14px calc(8px + var(--safe-bottom));flex-direction:column;gap:8px;display:flex;overflow:hidden}.timer{font-variant-numeric:tabular-nums;background:var(--superficie);min-height:30px;color:var(--texto-sec);border:1px solid var(--borde);padding:0 10px;font-size:13px}.barra-beats{gap:4px;width:100%;display:flex}.barra-beats .celda{background:var(--superficie);border:1px solid var(--borde);border-radius:8px;flex-direction:column;flex:1;justify-content:flex-end;align-items:stretch;min-width:0;height:72px;min-height:0;padding:0;display:flex;position:relative;overflow:hidden}.barra-beats.densa .celda{height:60px}.barra-beats.densa .letra{font-size:11px}.barra-beats .celda:disabled{opacity:1;cursor:default}.barra-beats .barra{background:var(--borde);width:100%;display:block}.celda.n0 .barra{background:var(--borde);height:8%}.celda.n1 .barra{background:#2a8f5a;height:34%}.celda.n2 .barra{background:var(--primario);height:58%}.celda.n3 .barra{background:var(--halo);height:100%}.barra-beats .letra{text-align:center;color:var(--texto);text-shadow:0 1px 2px #000;font-size:14px;font-weight:800;line-height:1.05;position:absolute;inset:4px 0 auto}.celda.n3 .letra{color:var(--on-accent,#06130b);text-shadow:none}.barra-beats .letra small{opacity:.85;font-size:11px;font-weight:700;display:block}.barra-beats .celda.actual{border-color:var(--texto);box-shadow:0 0 0 2px var(--texto)}.barra-beats .celda.actual .barra{filter:brightness(1.35)}.barra-beats .celda.n0.actual .barra{background:var(--texto-sec)}.dial-zona{flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.dial{aspect-ratio:1;background:radial-gradient(circle, var(--fondo) 58%, var(--superficie-2) 59%, var(--superficie) 100%);border:2px solid var(--borde);touch-action:none;cursor:grab;border-radius:50%;justify-content:center;align-items:center;width:min(74vw,36vh);display:flex;position:relative}.dial:focus-visible{outline:3px solid var(--primario);outline-offset:4px}.dial.arrastrando{border-color:var(--primario);cursor:grabbing}.dial-marcas{background:repeating-conic-gradient(var(--borde) 0deg 1.5deg, transparent 1.5deg 15deg);pointer-events:none;border-radius:50%;position:absolute;inset:6px;-webkit-mask:radial-gradient(circle,#0000 72%,#000 73%);mask:radial-gradient(circle,#0000 72%,#000 73%)}.dial:after{content:"";box-shadow:0 0 30px 4px color-mix(in srgb, var(--primario) 55%, transparent), inset 0 0 0 4px var(--primario);opacity:0;pointer-events:none;border-radius:50%;position:absolute;inset:-4px}.dial.flash:after{opacity:1}.dial.flash.acento:after{box-shadow:0 0 56px 10px color-mix(in srgb, var(--halo) 70%, transparent), inset 0 0 0 5px var(--halo)}.dial-centro{text-align:center;pointer-events:none}.dial-bpm{font-variant-numeric:tabular-nums;font-size:clamp(56px,12vh,88px);font-weight:800;line-height:.95}.dial-nombre{color:var(--texto-sec);letter-spacing:.16em;text-transform:uppercase;font-size:12px;font-weight:700}.dial-beat{color:var(--primario);font-variant-numeric:tabular-nums;min-height:20px;font-size:15px;font-weight:700}.tempo-fila{grid-template-columns:1fr 1fr 1.4fr 1fr 1fr;gap:5px;display:grid}.tempo-fila button{font-variant-numeric:tabular-nums;border:1px solid var(--borde);min-height:54px;font-size:17px}.tempo-fila .btn-tap{min-height:54px}.chip b{color:var(--texto);font-size:14px}.chip.on b{color:var(--primario)}.metro .btn-play{min-height:68px;font-size:22px}.destello-pantalla{z-index:10;pointer-events:none;background:var(--primario);opacity:0;position:fixed;inset:0}.destello-pantalla.on{opacity:.55}.destello-pantalla.on.acento{background:var(--halo);opacity:.85}@media (prefers-reduced-motion:reduce){.destello-pantalla.on,.destello-pantalla.on.acento{opacity:.35}}.rejilla{gap:6px;margin-bottom:12px;display:grid}.rejilla-2{grid-template-columns:repeat(2,1fr)}.rejilla-3{grid-template-columns:repeat(3,1fr)}.rejilla-4{grid-template-columns:repeat(4,1fr)}.rejilla-8{grid-template-columns:repeat(8,1fr)}.rejilla button{border:1px solid var(--borde);background:var(--superficie-2);font-variant-numeric:tabular-nums;min-height:52px;padding:0 4px}.rejilla-8 button{min-height:44px;font-size:15px}.rejilla button.on{border-color:var(--primario);color:var(--primario);box-shadow:inset 0 0 0 1px var(--primario)}.patrones button{flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:72px;display:flex}.patrones .figura{font-size:24px;line-height:1}.patrones small{color:var(--texto-sec);font-size:11px;font-weight:600}.compas-grande{text-align:center;font-variant-numeric:tabular-nums;margin:2px 0 8px;font-size:44px;font-weight:800}.btn-mini.ancho{min-width:72px}.btn-mini.activo{color:var(--primario)}.segmento-card .barra-beats .celda{height:48px}.calibra-fila .btn-mini{white-space:nowrap;padding:0 14px;font-size:15px}.multipista{height:100%;padding:8px 14px calc(8px + var(--safe-bottom));flex-direction:column;gap:8px;display:flex;overflow:hidden}.mp-cabeza{align-items:center;gap:8px;display:flex}.mp-titulo{flex:1;min-width:0}.mp-titulo strong{white-space:nowrap;text-overflow:ellipsis;font-size:18px;display:block;overflow:hidden}.mp-titulo small{color:var(--texto-sec);font-size:12px}.mp-estado{font-variant-numeric:tabular-nums;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;display:grid}.mp-tiempo{color:var(--texto-sec);font-size:13px}.mp-seccion{text-align:right;color:var(--halo);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:700;overflow:hidden}.mp-beat{text-align:center;background:var(--superficie);border:1px solid var(--borde);border-radius:10px;min-width:92px;padding:4px 10px;font-size:22px;font-weight:800}.mp-beat.on{border-color:var(--primario);box-shadow:inset 0 0 0 2px var(--primario)}.mp-beat.on.acento{border-color:var(--halo);box-shadow:inset 0 0 0 2px var(--halo);color:var(--halo)}.onda{background:var(--superficie);border:1px solid var(--borde);cursor:pointer;border-radius:10px;flex-shrink:0;height:76px;position:relative;overflow:hidden;container-type:inline-size}.onda canvas{width:100%;height:100%;position:absolute;inset:0}.onda-sec{border-left:1px solid var(--texto-sec);background:#3ce98a0d;position:absolute;top:0;bottom:0}.onda-sec.par{background:#b8ff5e14}.onda-sec span{color:var(--texto);text-shadow:0 1px 2px #000;white-space:nowrap;font-size:10px;font-weight:700;position:absolute;top:2px;left:4px}.onda-loop{background:#ffb0202e;border:1px solid #ffb020;position:absolute;top:0;bottom:0}.onda-cabezal{background:var(--texto);will-change:transform;width:2px;position:absolute;top:0;bottom:0;left:0}.mp-cargando{background:var(--superficie);height:76px;color:var(--texto-sec);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.mp-secciones{flex-shrink:0;align-items:center;gap:5px;min-height:40px;display:flex;overflow-x:auto}.mp-sec{border:1px solid var(--borde);background:var(--superficie);flex-shrink:0;min-height:40px;padding:0 12px;font-size:14px}.mp-sec.actual{border-color:var(--primario);color:var(--primario)}.mp-sec.loop{color:#ffb020;border-color:#ffb020}.mp-transporte{flex-shrink:0;grid-template-columns:1fr 1fr 1.8fr 1fr 1fr 1fr;gap:5px;display:grid}.mp-transporte button{border:1px solid var(--borde);min-height:56px;padding:0;font-size:18px}.mp-transporte .btn-play{font-size:24px}.mp-transporte button.on{color:#ffb020;border-color:#ffb020}.mp-transporte button:disabled{opacity:.35}.mp-auto{color:var(--texto-sec);flex-shrink:0;align-items:center;gap:8px;font-size:12px;display:flex}.mp-auto input{width:18px;height:18px;min-height:0;accent-color:var(--primario)}.mezclador{flex-direction:column;flex:1;gap:5px;min-height:0;padding-bottom:6px;display:flex;overflow-y:auto}.canal{background:var(--superficie);border-radius:10px;grid-template-columns:6px minmax(0,1fr) 40px 40px minmax(90px,38%);align-items:center;gap:8px;padding:6px 8px 6px 0;display:grid;overflow:hidden}.canal.callado{opacity:.5}.canal-color{border-radius:0 3px 3px 0;align-self:stretch}.canal-nombre{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:700;overflow:hidden}.canal-nombre small{color:var(--texto-sec);font-size:11px;font-weight:500;display:block}.canal-btn{border:1px solid var(--borde);background:var(--superficie-2);min-width:40px;min-height:40px;padding:0;font-size:14px}.canal-btn.mute{color:#06130b;background:#ffb020;border-color:#ffb020}.canal-btn.solo{background:var(--primario);color:#06130b;border-color:var(--primario)}.canal-vol{width:100%;min-height:36px}.btn-crear.secundario{background:var(--superficie-2);color:var(--texto);border:1px solid var(--borde)}.mono{font-variant-numeric:tabular-nums}.uso{margin-bottom:10px}.uso-barra{background:var(--superficie-2);border-radius:3px;height:6px;overflow:hidden}.uso-barra i{background:var(--primario);height:100%;display:block}.uso small{color:var(--texto-sec);font-size:12px}.hoja-fondo.centrado{justify-content:center;align-items:center}.cargando{background:var(--superficie);border:1px solid var(--borde);border-radius:16px;flex-direction:column;gap:10px;width:min(86vw,340px);padding:18px;display:flex}.cargando-titulo{font-weight:700}.cargando-barra{background:var(--superficie-2);border-radius:4px;height:8px;overflow:hidden}.cargando-barra i{background:var(--primario);height:100%;transition:width .2s;display:block}.cargando small{color:var(--texto-sec);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.canal-btn.ancho2{grid-column:span 2}.peso{margin-top:2px;font-size:12px;font-weight:600}.peso.ligera{color:var(--primario)}.peso.normal{color:#ffb020}.peso.pesada{color:var(--destructivo)}.aviso.alerta{border-left-color:#ffb020;margin-bottom:8px}.sig-ok{color:var(--primario)}.sig-espera{color:#ffb020}