*{margin:0;padding:0;box-sizing:border-box}:root{--bg-dark: #1a1a2e;--bg-panel: #16213e;--accent: #e94560;--text: #eaeaea}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-dark);color:var(--text);min-height:100vh}#app{display:flex;flex-direction:column;height:100vh}.header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:var(--bg-panel);border-bottom:1px solid #2a2a4a}.header h1{font-size:1.5rem;font-weight:600}.header .controls{display:flex;gap:.5rem}button{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:opacity .2s}button:hover{opacity:.8}#btn-play{background:#4a4a6a;color:var(--text)}#btn-export{background:var(--accent);color:#fff}.workspace{flex:1;display:flex;flex-direction:column;padding:1rem;gap:1rem;overflow:hidden}.preview-container{flex:1;display:flex;justify-content:center;align-items:center;background:#0f0f1a;border-radius:8px;overflow:hidden}#preview-canvas{max-width:100%;max-height:100%;background:#000}.timeline-container{background:var(--bg-panel);border-radius:8px;padding:1rem}.timeline-controls{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}#time-display{font-family:monospace;font-size:.9rem;min-width:100px}#timeline-scrubber{flex:1;height:4px;-webkit-appearance:none;background:#2a2a4a;border-radius:2px;cursor:pointer}#timeline-scrubber::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:var(--accent);border-radius:50%}.layers-panel{display:flex;gap:.5rem}.layer{padding:.5rem 1rem;background:#2a2a4a;border-radius:4px;font-size:.85rem;cursor:pointer;transition:background .2s}.layer:hover{background:#3a3a5a}.layer.active{background:var(--accent)}