: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(5,1fr);gap:2px;display:grid}.tabs button{min-height:46px;color:var(--texto-sec);letter-spacing:.02em;background:0 0;font-size:12px;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(from var(--giro,0deg), var(--primario) 0%, var(--halo) 30%, #1b6b45 55%, var(--primario) 100%);filter:saturate(.9);border-radius:50%;width:min(78vw,40vh);padding:5px;transition:filter 90ms linear;animation:14s linear infinite girar;position:relative}@property --giro{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes girar{to{--giro:360deg}}.anillo.flash{filter:saturate(1.6)brightness(1.25);box-shadow:0 0 34px color-mix(in srgb, var(--primario) 55%, transparent)}.anillo.flash.acento{filter:saturate(2)brightness(1.6);box-shadow:0 0 60px color-mix(in srgb, var(--halo) 70%, transparent)}.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}@media (prefers-reduced-motion:reduce){.anillo{animation:none}.anillo.flash,.anillo.flash.acento{transition:none}}.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}