body{margin:0;background:#1a1a2e;color:#e0e0e0;font-family:Segoe UI,system-ui,-apple-system,sans-serif;min-height:100vh}#app{width:100%}*{margin:0;padding:0;box-sizing:border-box}body{background:#1a1a2e;color:#e0e0e0;font-family:Segoe UI,system-ui,-apple-system,sans-serif}.app-container{max-width:1200px;margin:0 auto;padding:24px;outline:none}.title{text-align:center;font-size:28px;margin-bottom:8px;color:#00d4ff;text-shadow:0 0 20px rgba(0,212,255,.3)}.tab-menu{display:flex;justify-content:center;gap:4px;margin-bottom:20px;background:#16213e;border-radius:10px;padding:4px}.tab-btn{padding:10px 28px;border:none;border-radius:8px;background:transparent;color:#aaa;font-size:15px;cursor:pointer;transition:all .2s;font-family:inherit;font-weight:500}.tab-btn:hover{color:#e0e0e0}.tab-btn.active{background:#0f3460;color:#00d4ff;font-weight:700}.controls{background:#16213e;border-radius:12px;padding:20px;margin-bottom:20px;display:flex;flex-direction:column;gap:14px}.control-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.control-row label{font-size:14px;color:#aaa;white-space:nowrap}.url-input{flex:1;min-width:200px;padding:8px 14px;border-radius:8px;border:1px solid #2a2a4a;background:#0f3460;color:#fff;font-size:14px;outline:none;transition:border-color .2s}.url-input:focus{border-color:#00d4ff}.num-input{width:64px;padding:6px 10px;border-radius:8px;border:1px solid #2a2a4a;background:#0f3460;color:#fff;font-size:14px;text-align:center;outline:none}.num-input:focus{border-color:#00d4ff}.frame-input{width:56px}.slider{width:100px;accent-color:#00d4ff}.fps-value{font-weight:700;color:#00d4ff;min-width:24px}.file-label{padding:8px 18px;border-radius:8px;border:1px dashed #2a2a4a;background:transparent;color:#aaa;font-size:14px;cursor:pointer;transition:all .2s;white-space:nowrap}.file-label:hover{border-color:#00d4ff;color:#00d4ff}.btn{padding:8px 18px;border-radius:8px;border:1px solid #2a2a4a;background:#0f3460;color:#e0e0e0;font-size:14px;cursor:pointer;transition:all .2s;font-family:inherit;white-space:nowrap}.btn:hover:not(:disabled){background:#1a4a6e;border-color:#00d4ff}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:#00d4ff;color:#0a0a1a;border-color:#00d4ff;font-weight:600}.btn-primary:hover:not(:disabled){background:#00b8e6}.btn-store{background:#e67e22;border-color:#e67e22;color:#fff;font-weight:600}.btn-store:hover:not(:disabled){background:#d35400}.btn-danger{background:#e94560;border-color:#e94560;color:#fff}.btn-danger:hover:not(:disabled){background:#d13850}.proxy-label{color:#aaa!important;cursor:pointer;-webkit-user-select:none;user-select:none}.proxy-label input{margin-right:4px;cursor:pointer}.proxy-input{flex:1;min-width:180px;padding:6px 10px;border-radius:8px;border:1px solid #2a2a4a;background:#0f3460;color:#fff;font-size:13px;outline:none}.stored-badge{font-size:12px;background:#e67e224d;color:#e67e22;padding:4px 10px;border-radius:6px;font-weight:600}.video-info span{color:#888;font-size:13px;margin-right:20px}.error{background:#e9456033;border:1px solid #e94560;color:#e94560;padding:12px 18px;border-radius:8px;margin-bottom:20px}.success{background:#2ecc7133;border:1px solid #2ecc71;color:#2ecc71;padding:12px 18px;border-radius:8px;margin-bottom:20px;font-size:13px;word-break:break-all}.warning{background:#ffc10726;border:1px solid #ffc107;color:#ffc107;padding:12px 18px;border-radius:8px;margin-bottom:20px;font-size:14px}.warning a{color:#00d4ff;text-decoration:underline;cursor:pointer}.progress-bar{height:6px;background:#0f3460;border-radius:3px;margin-bottom:16px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#e67e22,#00d4ff);border-radius:3px;transition:width .3s ease}.preview-area{display:flex;gap:20px;margin-bottom:16px;flex-wrap:wrap}.v-preview-area{align-items:flex-start}.preview-panel{flex:1;min-width:300px;background:#16213e;border-radius:12px;padding:16px;display:flex;flex-direction:column;align-items:center}.preview-panel h3{font-size:14px;color:#aaa;margin-bottom:12px}.canvas-wrapper{overflow:auto;max-width:100%;max-height:500px;display:flex;justify-content:center;align-items:center}.canvas-wrapper canvas,.v-sheet{border:2px solid #333;border-radius:4px;image-rendering:pixelated}.anim-wrapper canvas{image-rendering:pixelated}.info-bar{text-align:center;font-size:13px;color:#888;background:#16213e;border-radius:8px;padding:10px 18px}.empty-hint{text-align:center;color:#666;padding:60px 20px;font-size:16px;background:#16213e;border-radius:12px;line-height:1.8}