.anim-studio{display:grid;gap:20px}.anim-toolbar,.anim-stage-card,.anim-timeline-card,.anim-export{padding:19px;border-radius:22px;background:var(--surface,#eef3f8);box-shadow:var(--shadow-out,8px 8px 18px #cbd3dc,-8px -8px 18px #fff)}.anim-toolbar{display:grid;grid-template-columns:repeat(6,minmax(110px,1fr));gap:12px}.anim-toolbar label,.anim-export label{display:grid;gap:6px;font-size:.77rem;font-weight:800;color:var(--muted,#64748b)}.anim-toolbar input,.anim-toolbar select,.anim-export select{width:100%;min-height:40px}.anim-main{display:grid;grid-template-columns:280px minmax(0,1fr);gap:20px}.anim-side{display:grid;align-content:start;gap:12px}.anim-upload{display:grid;place-items:center;text-align:center;padding:22px;border:2px dashed var(--accent,#14b8a6);border-radius:16px;cursor:pointer}.anim-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.anim-stage{min-height:390px;display:grid;place-items:center;overflow:auto;background:#dce5ef;border-radius:15px;padding:14px}.anim-stage canvas{max-width:100%;max-height:62vh}.anim-timeline{display:flex;gap:12px;overflow-x:auto;padding:8px 3px 14px}.anim-frame{flex:0 0 126px;padding:9px;border:2px solid transparent;border-radius:14px;background:rgba(100,116,139,.1);cursor:pointer}.anim-frame.active{border-color:var(--accent,#14b8a6)}.anim-frame canvas{display:block;width:100%;height:86px;object-fit:contain;background:#fff}.anim-frame input{width:100%;margin-top:7px}.anim-frame-controls{display:flex;gap:5px;margin-top:6px}.anim-frame-controls button{flex:1}.anim-export{display:flex;flex-wrap:wrap;align-items:end;gap:11px}.anim-status{flex:1;min-width:230px}.anim-note{font-size:.78rem;line-height:1.5;color:var(--muted,#64748b)}@media(max-width:900px){.anim-toolbar{grid-template-columns:repeat(3,1fr)}.anim-main{grid-template-columns:1fr}.anim-side{grid-template-columns:1fr 1fr}.anim-upload,.anim-note{grid-column:1/-1}}@media(max-width:600px){.anim-toolbar{grid-template-columns:1fr 1fr}.anim-side{display:grid;grid-template-columns:1fr}.anim-upload,.anim-note{grid-column:auto}.anim-frame{flex-basis:105px}}[data-theme=dark] .anim-toolbar,[data-theme=dark] .anim-stage-card,[data-theme=dark] .anim-timeline-card,[data-theme=dark] .anim-export{background:#172235;box-shadow:8px 8px 18px #0a1220,-7px -7px 16px #22314a}[data-theme=dark] .anim-stage{background:#0f1929}