*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:#1a1a1a;color:#e0e0e0;min-height:100vh;display:flex;justify-content:center;padding:40px 20px}.container{max-width:800px;width:100%}h1{text-align:center;margin-bottom:30px;color:#fff;font-weight:500}.drop-zone{border:2px dashed #444;border-radius:12px;padding:40px;text-align:center;transition:all .2s ease;background:#252525;margin-bottom:30px}.drop-zone:hover,.drop-zone.drag-over{border-color:#7c4dff;background:#2a2a2a}.drop-zone.has-image{padding:20px}.drop-zone p{color:#888;margin-bottom:8px}.drop-zone input[type=file]{display:none}.file-label{display:inline-block;padding:10px 24px;background:#7c4dff;color:#fff;border-radius:6px;cursor:pointer;transition:background .2s;margin-top:10px}.file-label:hover{background:#6c3de6}.player-container{background:#252525;border-radius:12px;padding:30px}#canvas{display:block;max-width:100%;margin:0 auto 20px;background:#1a1a1a;border-radius:8px;min-height:200px}.controls{display:flex;flex-direction:column;gap:20px}.grid-config{display:flex;gap:20px;justify-content:center}.grid-config label{display:flex;align-items:center;gap:8px}.grid-config input{width:60px;padding:8px;border:1px solid #444;border-radius:6px;background:#1a1a1a;color:#fff;text-align:center}.playback-controls{display:flex;gap:12px;justify-content:center}.playback-controls button{padding:12px 28px;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}#play-btn{background:#4caf50;color:#fff}#play-btn:hover{background:#43a047}#pause-btn{background:#ff9800;color:#fff}#pause-btn:hover{background:#f57c00}#stop-btn{background:#f44336;color:#fff}#stop-btn:hover{background:#d32f2f}.speed-control{display:flex;justify-content:center}.speed-control label{display:flex;align-items:center;gap:12px}.speed-control input[type=range]{width:200px;accent-color:#7c4dff}#fps-value{min-width:24px;text-align:center}.frame-info{display:flex;justify-content:center;align-items:center;gap:30px;color:#888}.loop-control{display:flex;align-items:center;gap:8px;cursor:pointer}.loop-control input{accent-color:#7c4dff;width:16px;height:16px}