.animate-btn.active{background:#2563eb;color:#fff;border-color:#2563eb;}.animate-btn.active:hover{background:#1d4ed8;}.animate-controls-bar{display:flex;align-items:center;gap:12px;padding:8px 16px;background:#1a1a2e;border-bottom:1px solid #333;position:sticky;top:0;z-index:5001;flex-wrap:nowrap;}.animate-controls-left{display:flex;align-items:center;gap:10px;flex-shrink:0;}.animate-controls-center{flex:1;min-width:100px;}.animate-controls-right{display:flex;align-items:center;gap:10px;flex-shrink:0;}.animate-ctrl-btn{background:#2a2a4a;color:#fff;border:1px solid #444;border-radius:6px;padding:6px 12px;cursor:pointer;font-size:14px;display:flex;align-items:center;gap:4px;transition:background 0.15s;white-space:nowrap;}.animate-ctrl-btn:hover{background:#3a3a5a;}.animate-stop-btn{background:#7f1d1d;border-color:#991b1b;}.animate-stop-btn:hover{background:#991b1b;}.animate-time{color:#fff;font-family:'Courier New',monospace;font-size:16px;font-weight:bold;min-width:48px;}.animate-frame-count{color:#888;font-size:12px;white-space:nowrap;}.animate-scrubber{position:relative;height:20px;background:#333;border-radius:10px;cursor:pointer;display:flex;align-items:center;}.animate-scrubber-fill{position:absolute;left:0;top:0;bottom:0;background:#2563eb;border-radius:10px;width:0%;transition:width 0.05s linear;pointer-events:none;}.animate-scrubber-thumb{position:absolute;top:50%;left:0%;transform:translate(-50%,-50%);width:16px;height:16px;background:#fff;border:2px solid #2563eb;border-radius:50%;pointer-events:none;box-shadow:0 1px 3px rgba(0,0,0,0.4);transition:left 0.05s linear;}.animate-speed-control{display:flex;align-items:center;gap:8px;}.animate-speed-slider{-webkit-appearance:none;appearance:none;width:100px;height:6px;background:#333;border-radius:3px;outline:none;cursor:pointer;}.animate-speed-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#2563eb;border-radius:50%;cursor:pointer;}.animate-speed-slider::-moz-range-thumb{width:16px;height:16px;background:#2563eb;border-radius:50%;border:none;cursor:pointer;}.animate-speed-label{color:#fff;font-family:'Courier New',monospace;font-size:12px;min-width:36px;text-align:center;white-space:nowrap;}.animate-loading-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.7);z-index:5000;justify-content:center;align-items:center;}.animate-loading-box{background:#1a1a2e;border:1px solid #333;border-radius:12px;padding:32px 48px;text-align:center;color:#fff;}.animate-loading-box .spinner{width:40px;height:40px;border:3px solid #333;border-top-color:#2563eb;border-radius:50%;animation:spin 0.8s linear infinite;margin:0 auto 16px;}.animate-loading-box p{margin:0;font-size:16px;color:#ccc;}.cameraContainer.animate-active{cursor:default;}.animate-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;pointer-events:none;border-radius:3px 3px 0 0;transition:opacity 0.2s ease;}.cameraContainer.animate-active .imageContainer>*:not(a):not(.animate-canvas):not(.animate-tile-loader):not(.animate-no-data){display:none !important;}.cameraContainer.animate-active .headContainer{display:none !important;}.cameraContainer.animate-active .linkContainer{display:none !important;}.animate-tile-loader{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.6);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:5;pointer-events:none;}.animate-tile-loader .animate-tile-spinner{width:24px;height:24px;border:3px solid rgba(255,255,255,0.2);border-top-color:#2563eb;border-radius:50%;animation:spin 0.8s linear infinite;}.animate-tile-loader .animate-tile-loader-text{color:#fff;font-size:10px;margin-top:6px;text-shadow:0 1px 2px rgba(0,0,0,0.8);}.animate-no-data{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.45);display:flex;justify-content:center;align-items:center;z-index:5;pointer-events:none;}.animate-no-data span{color:rgba(255,255,255,0.6);font-size:11px;text-shadow:0 1px 2px rgba(0,0,0,0.8);}.animate-mode-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:5000;justify-content:center;align-items:center;}.animate-mode-overlay.visible{display:flex;}.animate-mode-dialog{background:#ffffff;border:1px solid #e2e8f0;border-radius:12px;width:90%;max-width:420px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.3);}.animate-mode-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:#f1f5f9;color:#1e293b;font-size:16px;font-weight:600;border-bottom:1px solid #e2e8f0;}.animate-mode-close{background:none;border:none;color:#64748b;font-size:22px;cursor:pointer;padding:0 4px;line-height:1;opacity:0.8;transition:opacity 0.15s;}.animate-mode-close:hover{opacity:1;color:#1e293b;}.animate-mode-cards{padding:16px;display:flex;flex-direction:column;gap:10px;}.animate-mode-card{display:flex;align-items:center;gap:14px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:14px 16px;cursor:pointer;text-align:left;color:#1e293b;transition:background 0.15s,border-color 0.15s;}.animate-mode-card:hover{background:#e2e8f0;border-color:#2563eb;}.animate-mode-icon{font-size:28px;flex-shrink:0;width:36px;text-align:center;color:#2563eb;}.animate-mode-title{font-size:15px;font-weight:600;display:block;}.animate-mode-desc{font-size:12px;color:#64748b;display:block;margin-top:2px;}@media (max-width:600px){.animate-controls-bar{flex-wrap:wrap;gap:8px;padding:6px 10px;}.animate-controls-left{order:1;}.animate-controls-center{order:3;width:100%;min-width:0;}.animate-controls-right{order:2;margin-left:auto;}.animate-time{font-size:14px;}.animate-frame-count{font-size:10px;}.animate-ctrl-btn{padding:5px 8px;font-size:12px;}.animate-speed-slider{width:70px;}.animate-speed-label{font-size:11px;min-width:30px;}}@media (max-width:400px){.animate-frame-count{display:none;}.animate-mode-card{padding:10px 12px;gap:10px;}.animate-mode-icon{font-size:22px;width:28px;}.animate-mode-title{font-size:14px;}.animate-mode-desc{font-size:11px;}}@keyframes spin{to{transform:rotate(360deg);}}[data-theme="dark"] .animate-mode-dialog{background:#1e293b;border-color:#334155;}[data-theme="dark"] .animate-mode-header{background:#0f172a;color:#e2e8f0;border-bottom-color:#334155;}[data-theme="dark"] .animate-mode-close{color:#94a3b8;}[data-theme="dark"] .animate-mode-close:hover{color:#e2e8f0;}[data-theme="dark"] .animate-mode-card{background:#0f172a;border-color:#334155;color:#e2e8f0;}[data-theme="dark"] .animate-mode-card:hover{background:#334155;border-color:#60a5fa;}[data-theme="dark"] .animate-mode-icon{color:#60a5fa;}[data-theme="dark"] .animate-mode-desc{color:#94a3b8;}