:root{--fondo:#14141b;--panel:#1f1f2b;--borde:#33334a;--texto:#ecebf5;--suave:#a3a2b8;--acento:#7c5cff;--rojo:#ff4d5e;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:var(--fondo);height:100vh;color:var(--texto);margin:0;display:flex;overflow:hidden}#panel{background:var(--panel);border-right:1px solid var(--borde);flex-direction:column;flex-shrink:0;gap:12px;width:300px;padding:20px;display:flex;overflow-y:auto}body.sin-panel #panel{display:none}h1{letter-spacing:.3px;margin:0 0 4px;font-size:20px}label{color:var(--suave);flex-direction:column;gap:4px;font-size:13px;display:flex}label.tilde{color:var(--texto);flex-direction:row;align-items:center;gap:8px}select,button{font:inherit;color:var(--texto);border:1px solid var(--borde);background:#2a2a3a;border-radius:8px;padding:8px 10px;font-size:14px}button{cursor:pointer}button:disabled{opacity:.5;cursor:default}button.principal{background:var(--acento);border-color:var(--acento);font-weight:600}button.rojo{background:var(--rojo);border-color:var(--rojo)}.fila{gap:8px;display:flex}.fila button{flex:1}#estado,.ayuda{color:var(--suave);margin:0;font-size:13px;line-height:1.4}#recortes{flex-wrap:wrap;gap:6px;display:none}#recortes.visible{display:flex}#recortes canvas{background:repeating-conic-gradient(#333 0 25%, #444 0 50%) 0 0 / 16px 16px;border-radius:6px;width:120px;height:auto}#escenario{flex:1;justify-content:center;align-items:center;min-width:0;padding:16px;display:flex;position:relative}body.sin-panel #escenario{padding:0}#lienzo{background:repeating-conic-gradient(#22222c 0 25%, #2a2a36 0 50%) 0 0 / 24px 24px;border-radius:10px;max-width:100%;max-height:100%}body.sin-panel #lienzo{border-radius:0}#tiempo{color:var(--rojo);font-weight:700;position:absolute;top:24px;right:28px}#video{display:none}@media (width<=700px){body{flex-direction:column;height:auto;overflow:auto}#panel{width:100%}}h1 a{color:inherit;text-decoration:none}h1 small{color:var(--suave);font-size:13px;font-weight:500}.efectos{grid-template-columns:1fr 1fr;gap:6px;display:grid}.efectos button{text-align:left;padding:6px 8px;font-size:12px}#videoFondo{display:none}body.embebido{background:0 0}body.embebido #escenario{padding:0}body.embebido #lienzo{object-fit:cover;background:0 0;border-radius:0;width:100%;height:100%}
