.anim-panel{position:fixed;z-index:90;bottom:12px;left:88px;right:275px;background:#191d2df2;border:1px solid #536077;border-radius:14px;padding:10px;box-shadow:0 12px 30px #0007}.anim-bar{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.anim-bar button{padding:7px 10px}.frames{display:flex;overflow-x:auto;gap:8px;margin-top:9px;padding-bottom:4px}.frame{flex:0 0 88px;padding:5px;border:2px solid #41465b;border-radius:9px;background:#262c3d;color:white;text-align:center;cursor:pointer}.frame.on{border-color:#a78bfa}.frame canvas{width:76px;height:55px;background:white;object-fit:contain}.frame small{display:block}.anim-panel input[type=range]{width:85px}.anim-panel label{font-size:11px;color:#ccd}.anim-toggle{position:fixed;z-index:95;bottom:14px;right:15px}.onion-layer{opacity:.3!important;pointer-events:none!important}.playback{position:fixed;inset:0;z-index:3000;background:#0b0d14ee;display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px}.playback.show{display:flex}.playback canvas{max-width:94vw;max-height:75vh;background:white;object-fit:contain}.playback button{font-size:16px}@media(max-width:850px){.anim-panel{left:60px;right:7px;bottom:8px;padding:7px;max-height:190px}.anim-bar button{padding:5px 7px;font-size:11px}.frame{flex-basis:73px}.frame canvas{width:61px;height:44px}.anim-toggle{bottom:205px;right:8px}.status{bottom:208px!important}} 
/* Reorganização de páginas por arraste, inclusive no celular. */
.frames .frame{touch-action:pan-x;user-select:none;-webkit-user-select:none;transition:border-color .15s,background .15s,opacity .15s}
.frames .frame.dragging{opacity:.55;border-color:#ffc28a;cursor:grabbing}
.frames .frame.drop-target{border-color:#ffc28a;background:#4c3e37;box-shadow:inset 0 0 0 1px #ffc28a}