:root{--color-primary: #FF6B6B;--color-secondary: #4ECDC4;--color-neutral: #2C3E50;--color-light: #F7F9FC;--color-dark: #1A252F;--color-success: #27AE60;--color-warning: #F39C12;--color-error: #E74C3C;--color-info: #3498DB;--spacing-xs: 4px;--spacing-s: 8px;--spacing-m: 16px;--spacing-l: 24px;--spacing-xl: 32px;--spacing-xxl: 48px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--shadow-1: 0 2px 4px rgba(0,0,0,.1);--shadow-2: 0 4px 8px rgba(0,0,0,.12);--shadow-3: 0 8px 16px rgba(0,0,0,.14);--shadow-4: 0 12px 24px rgba(0,0,0,.16);--duration-fast: .2s;--duration-normal: .3s;--duration-slow: 1s;--ease: cubic-bezier(.4, 0, .2, 1);--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-out: cubic-bezier(0, 0, .2, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--font-family-en: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;--font-family-zh: -apple-system, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif}.intro-modal-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:none}.intro-modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000bf;opacity:0;transition:opacity .3s ease}.intro-modal-overlay.visible{opacity:1}.intro-modal{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:600px;background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;opacity:0;transform:translate(-50%,-50%) scale(.9);transition:opacity .3s ease,transform .3s ease}.intro-modal.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.intro-modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px 32px;border-bottom:1px solid #e5e7eb}.intro-modal-title{font-size:24px;font-weight:600;color:#111827;margin:0}.intro-modal-close{background:none;border:none;font-size:32px;color:#9ca3af;cursor:pointer;padding:4px 8px;line-height:1;transition:color .2s ease}.intro-modal-close:hover{color:#6b7280}.intro-modal-body{padding:32px}.intro-modal-image{width:100%;height:200px;background-size:cover;background-position:center;border-radius:8px;margin-bottom:24px;background-color:#f3f4f6;display:none}.intro-modal-content{text-align:center;margin-bottom:32px}.intro-modal-step-title{font-size:20px;font-weight:600;color:#111827;margin:0 0 12px}.intro-modal-step-description{font-size:16px;color:#6b7280;line-height:1.6;margin:0}.intro-modal-progress{display:flex;justify-content:center;gap:8px;margin-top:24px}.intro-modal-step-dot{width:8px;height:8px;border-radius:50%;background:#d1d5db;transition:all .3s ease}.intro-modal-step-dot.active{width:24px;border-radius:4px;background:#3b82f6}.intro-modal-step-dot.completed{background:#3b82f6}.intro-modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:20px 32px;border-top:1px solid #e5e7eb}.intro-modal-skip{padding:10px 24px;background:#fff;border:1px solid #d1d5db;border-radius:6px;font-size:14px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s ease}.intro-modal-skip:hover{background:#f9fafb;color:#4b5563}.intro-modal-next{padding:10px 24px;background:#3b82f6;border:none;border-radius:6px;font-size:14px;font-weight:500;color:#fff;cursor:pointer;transition:all .2s ease}.intro-modal-next:hover{background:#2563eb}.performance-monitor{position:fixed;background:#000000d9;color:#10b981;padding:12px;border-radius:8px;font-family:Consolas,Monaco,monospace;font-size:12px;z-index:999;transition:opacity .3s ease;pointer-events:auto;max-width:300px}.performance-monitor.hidden{opacity:.2}.performance-monitor.hidden:hover{opacity:1}.performance-monitor-top-left{top:80px;left:20px}.performance-monitor-top-right{top:80px;right:20px}.performance-monitor-bottom-left{bottom:80px;left:20px}.performance-monitor-bottom-right{bottom:80px;right:20px}.perf-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1)}.perf-title{font-weight:700;font-size:13px;color:#10b981}.perf-toggle{background:none;border:none;color:#10b981;cursor:pointer;padding:2px 6px;font-size:12px;transition:transform .2s ease}.perf-toggle:hover{transform:scale(1.1)}.perf-content{transition:max-height .3s ease}.perf-content.collapsed{max-height:0;overflow:hidden}.perf-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.perf-label{color:#9ca3af}.perf-value{font-weight:700;color:#10b981;transition:color .3s ease}.perf-value[style*="#f87171"]{color:#f87171}.perf-value[style*="#facc15"]{color:#facc15}.perf-value[style*="#4ade80"]{color:#4ade80}.perf-graph{margin-top:12px;height:40px;background:#0000004d;border-radius:4px;overflow:hidden}.perf-graph svg{width:100%;height:100%}.settings-panel{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:none}.settings-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000bf;opacity:0;transition:opacity .3s ease}.settings-overlay.visible{opacity:1}.settings-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:600px;max-height:80vh;background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;opacity:0;transform:translate(-50%,-50%) scale(.9);transition:opacity .3s ease,transform .3s ease;display:flex;flex-direction:column}.settings-content.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.settings-header{display:flex;justify-content:space-between;align-items:center;padding:24px 32px;border-bottom:1px solid #e5e7eb}.settings-title{font-size:24px;font-weight:600;color:#111827;margin:0}.settings-close{background:none;border:none;font-size:32px;color:#9ca3af;cursor:pointer;padding:4px 8px;line-height:1;transition:color .2s ease}.settings-close:hover{color:#6b7280}.settings-body{flex:1;overflow-y:auto;padding:32px}.settings-section{margin-bottom:32px}.settings-section:last-child{margin-bottom:0}.settings-section-title{font-size:18px;font-weight:600;color:#111827;margin:0 0 16px}.settings-option{margin-bottom:16px}.settings-option:last-child{margin-bottom:0}.settings-label{display:block;font-size:14px;font-weight:500;color:#374151;margin-bottom:8px}.settings-quality-options{display:flex;gap:12px}.settings-radio{display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 16px;border:1px solid #d1d5db;border-radius:6px;transition:all .2s ease}.settings-radio input[type=radio]{margin:0;cursor:pointer}.settings-radio:hover{background:#f9fafb;border-color:#9ca3af}.settings-radio:has(input:checked){background:#eff6ff;border-color:#3b82f6}.settings-toggle{display:flex;align-items:center;gap:12px;cursor:pointer;padding:12px;border:1px solid #e5e7eb;border-radius:6px;transition:all .2s ease}.settings-toggle:hover{background:#f9fafb}.settings-toggle input[type=checkbox]{margin:0;cursor:pointer}.settings-slider{position:relative;width:44px;height:24px;background:#d1d5db;border-radius:12px;transition:background .3s ease}.settings-slider:before{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .3s ease;box-shadow:0 2px 4px #0000001a}.settings-toggle:has(input:checked) .settings-slider{background:#3b82f6}.settings-toggle:has(input:checked) .settings-slider:before{transform:translate(20px)}.settings-text{font-size:14px;color:#374151}.settings-footer{display:flex;justify-content:flex-end;gap:12px;padding:20px 32px;border-top:1px solid #e5e7eb}.settings-reset{padding:10px 24px;background:#fff;border:1px solid #d1d5db;border-radius:6px;font-size:14px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s ease}.settings-reset:hover{background:#f9fafb;color:#4b5563}.settings-save{padding:10px 24px;background:#3b82f6;border:none;border-radius:6px;font-size:14px;font-weight:500;color:#fff;cursor:pointer;transition:all .2s ease}.settings-save:hover{background:#2563eb}.keyboard-shortcuts-help{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:none}.shortcuts-help-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000bf;opacity:0;transition:opacity .3s ease}.shortcuts-help-overlay.visible{opacity:1}.shortcuts-help-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:700px;max-height:80vh;background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;opacity:0;transform:translate(-50%,-50%) scale(.9);transition:opacity .3s ease,transform .3s ease;display:flex;flex-direction:column}.shortcuts-help-content.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.shortcuts-help-header{display:flex;justify-content:space-between;align-items:center;padding:24px 32px;border-bottom:1px solid #e5e7eb}.shortcuts-help-header h2{font-size:24px;font-weight:600;color:#111827;margin:0}.shortcuts-help-close{background:none;border:none;font-size:32px;color:#9ca3af;cursor:pointer;padding:4px 8px;line-height:1;transition:color .2s ease}.shortcuts-help-close:hover{color:#6b7280}.shortcuts-help-body{flex:1;overflow-y:auto;padding:32px}.shortcuts-help-category{margin-bottom:32px}.shortcuts-help-category:last-child{margin-bottom:0}.shortcuts-help-category h3{font-size:18px;font-weight:600;color:#111827;margin:0 0 16px}.shortcuts-help-category ul{list-style:none;padding:0;margin:0}.shortcuts-help-category li{display:flex;align-items:center;gap:16px;padding:12px;border-radius:6px;transition:background .2s ease}.shortcuts-help-category li:hover{background:#f9fafb}.shortcut-key{display:inline-flex;gap:4px;padding:4px 12px;background:#f3f4f6;border-radius:4px;font-family:Consolas,Monaco,monospace;font-size:13px;font-weight:600;color:#374151;white-space:nowrap}.shortcut-description{font-size:14px;color:#6b7280;flex:1}.error-alert{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:2000;animation:slideIn .3s ease}.error-alert.hiding{animation:slideOut .3s ease}.error-alert-content{display:flex;align-items:flex-start;gap:12px;padding:16px 20px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;box-shadow:0 10px 40px #0003;max-width:500px}.error-alert-icon{font-size:24px;flex-shrink:0}.error-alert-message{flex:1}.error-alert-message h4{font-size:16px;font-weight:600;color:#991b1b;margin:0 0 4px}.error-alert-message p{font-size:14px;color:#7f1d1d;margin:0;line-height:1.5}.error-alert-close{background:none;border:none;font-size:20px;color:#9ca3af;cursor:pointer;padding:4px 8px;line-height:1;transition:color .2s ease}.error-alert-close:hover{color:#6b7280}@keyframes slideIn{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}@keyframes slideOut{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-20px)}}.fatal-error{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:3000}.fatal-error-content{text-align:center;padding:40px;background:#fff;border-radius:12px;box-shadow:0 20px 60px #00000080;max-width:500px}.fatal-error-icon{font-size:64px;margin-bottom:24px}.fatal-error h2{font-size:28px;font-weight:700;color:#111827;margin:0 0 16px}.fatal-error p{font-size:16px;color:#6b7280;line-height:1.6;margin:0 0 32px}.fatal-error-actions{display:flex;gap:12px;justify-content:center}.fatal-error-reload,.fatal-error-close{padding:12px 32px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.fatal-error-reload{background:#3b82f6;border:none;color:#fff}.fatal-error-reload:hover{background:#2563eb}.fatal-error-close{background:#fff;border:1px solid #d1d5db;color:#6b7280}.fatal-error-close:hover{background:#f9fafb;color:#4b5563}.webgl-info-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:none}.webgl-info-modal.visible{display:block}.webgl-info-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:600px;max-height:80vh;background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;opacity:0;transform:translate(-50%,-50%) scale(.9);transition:opacity .3s ease,transform .3s ease;display:flex;flex-direction:column}.webgl-info-content.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.webgl-info-header{display:flex;justify-content:space-between;align-items:center;padding:24px 32px;border-bottom:1px solid #e5e7eb}.webgl-info-header h2{font-size:24px;font-weight:600;color:#111827;margin:0}.webgl-info-close{background:none;border:none;font-size:32px;color:#9ca3af;cursor:pointer;padding:4px 8px;line-height:1;transition:color .2s ease}.webgl-info-close:hover{color:#6b7280}.webgl-info-body{flex:1;overflow-y:auto;padding:32px}.webgl-info-status{display:flex;align-items:center;gap:12px;padding:16px;border-radius:8px;margin-bottom:24px}.webgl-info-status.success{background:#d1fae5}.webgl-info-status.error{background:#fee2e2}.status-icon{font-size:24px}.status-text{font-size:16px;font-weight:600}.webgl-info-status.success .status-text{color:#059669}.webgl-info-status.error .status-text{color:#dc2626}.webgl-info-details{margin-bottom:24px}.info-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #f3f4f6}.info-label{font-weight:500;color:#6b7280}.info-value{font-weight:600;color:#111827}.webgl-info-issues,.webgl-info-recommendations{margin-bottom:24px}.webgl-info-issues h3,.webgl-info-recommendations h3{font-size:16px;font-weight:600;color:#111827;margin:0 0 12px}.webgl-info-issues ul,.webgl-info-recommendations ul{list-style:none;padding:0;margin:0}.webgl-info-issues li,.webgl-info-recommendations li{padding:8px 0;font-size:14px;line-height:1.5}.webgl-info-recommendations details summary{cursor:pointer;font-weight:600;color:#111827;margin-bottom:12px}.webgl-info-recommendations details ul{list-style:none;padding:0;margin:0}.webgl-info-recommendations details li{padding:4px 0;font-size:13px;color:#6b7280;font-family:Consolas,Monaco,monospace}.degradation-notice{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .3s ease}.degradation-notice.hiding{animation:fadeOut .3s ease}.degradation-notice-content{text-align:center;padding:40px;background:#fff;border-radius:12px;box-shadow:0 20px 60px #00000080;max-width:500px}.notice-icon{font-size:64px;margin-bottom:24px}.degradation-notice h2{font-size:28px;font-weight:700;color:#111827;margin:0 0 16px}.degradation-notice p{font-size:16px;color:#6b7280;line-height:1.6;margin:0 0 24px}.notice-details{background:#fef3c7;border:1px solid #fcd34d;border-radius:8px;padding:16px;margin-bottom:32px;text-align:left}.notice-details p{font-size:14px;color:#92400e;margin:0}.notice-actions{display:flex;gap:12px;justify-content:center}.notice-button{padding:12px 32px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.notice-continue{background:#3b82f6;border:none;color:#fff}.notice-continue:hover{background:#2563eb}.notice-info{background:#fff;border:1px solid #d1d5db;color:#6b7280}.notice-info:hover{background:#f9fafb;color:#4b5563}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@media (max-width: 374px){:root{--spacing-xs: 4px;--spacing-s: 8px;--spacing-m: 12px;--spacing-l: 16px;--spacing-xl: 24px}.header{left:var(--spacing-xs);right:var(--spacing-xs);top:var(--spacing-xs)}.header-content{padding:0 var(--spacing-m);border-radius:var(--radius-sm)}.title{font-size:18px}.subtitle{display:none}.footer{left:var(--spacing-xs);right:var(--spacing-xs);bottom:var(--spacing-xs)}.control-bar{flex-direction:column;gap:var(--spacing-s);height:auto;padding:var(--spacing-m);border-radius:var(--radius-sm)}.control-group{width:100%;flex-direction:column;align-items:center}.control-group-title{display:none}.icon-button{width:44px;height:44px}.tooltip{max-width:200px;font-size:12px;padding:8px 12px}.performance-monitor{position:fixed;top:auto;bottom:180px;left:var(--spacing-s);right:auto;font-size:10px;padding:8px}.settings-content{width:95%;max-height:90vh}.keyboard-shortcuts-help .shortcuts-help-content{width:95%}}@media (min-width: 375px) and (max-width: 413px){.header{left:var(--spacing-s);right:var(--spacing-s)}.title{font-size:20px}.control-bar{flex-wrap:wrap;justify-content:center}}@media (min-width: 414px) and (max-width: 767px){.header{left:var(--spacing-m);right:var(--spacing-m)}.control-group{gap:var(--spacing-s)}.icon-button{width:40px;height:40px}}@media (min-width: 768px) and (max-width: 1023px){.header{left:var(--spacing-m);right:var(--spacing-m)}.header-content{padding:0 var(--spacing-xl)}.title{font-size:22px}.footer{left:var(--spacing-m);right:var(--spacing-m)}.control-bar{padding:0 var(--spacing-xl)}.icon-button{width:48px;height:48px}.performance-monitor{position:fixed;top:80px;right:var(--spacing-m);left:auto;bottom:auto}}@media (min-width: 1024px) and (max-width: 1279px){.header,.footer{left:var(--spacing-l);right:var(--spacing-l)}.control-bar{flex-direction:row;height:64px}}@media (min-width: 1280px) and (max-width: 1439px){.header,.footer{left:var(--spacing-xl);right:var(--spacing-xl)}}@media (min-width: 1440px) and (max-width: 1919px){.header,.footer{left:32px;right:32px}}@media (min-width: 1920px){.header,.footer{left:48px;right:48px}.control-bar{max-width:1200px;margin:0 auto}.title{font-size:28px}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.scene-label{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.icon-button svg{shape-rendering:crispEdges}}@media (orientation: landscape) and (max-height: 600px){.header{height:56px}.header-content{padding:0 var(--spacing-m)}.footer{bottom:var(--spacing-s)}.control-bar{height:56px;padding:0 var(--spacing-m)}.icon-button{width:40px;height:40px}}@media (orientation: portrait) and (max-width: 767px){.header{position:relative;margin:var(--spacing-m)}.footer{position:fixed;bottom:0;left:0;right:0;border-radius:0}.control-bar{border-radius:0;border-left:none;border-right:none}}@media print{.header,.footer,.tooltip,.performance-monitor,.settings-panel,.keyboard-shortcuts-help,.loading-indicator{display:none!important}#canvas-container{position:relative;width:100%;height:500px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (prefers-contrast: high){:root{--color-primary: #0000FF;--color-secondary: #008000;--color-neutral: #000000;--color-light: #FFFFFF}.tooltip,.performance-monitor,.settings-content,.keyboard-shortcuts-help-content{background:#fff;border:2px solid #000000}}@media (prefers-color-scheme: dark){:root{--color-primary: #3b82f6;--color-secondary: #10b981;--color-neutral: #f3f4f6;--color-light: #1f2937;--color-success: #10b981;--color-warning: #f59e0b;--color-danger: #ef4444;--color-info: #3b82f6}body{background:#000}.header-content,.control-bar{background:#1f2937f2;border:1px solid rgba(255,255,255,.1)}.icon-button{background:#374151;border-color:#4b5563;color:#e5e7eb}.icon-button:hover{background:#4b5563;color:#fff}.scene-label{background:#000c;color:#fff}}@media (hover: none) and (pointer: coarse){.icon-button{min-width:48px;min-height:48px}.control-group{gap:16px}.tooltip{display:none}}@media (hover: hover) and (pointer: fine){.icon-button:hover{background:var(--color-secondary);border-color:#3db8b0;color:#fff}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family-zh),var(--font-family-en);background:#f5f5f5;overflow:hidden}#app{position:relative;width:100vw;height:100vh;overflow:hidden}.header{position:absolute;top:var(--spacing-m);left:var(--spacing-l);height:64px;z-index:100}.header-content{display:flex;align-items:center;gap:var(--spacing-m);background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:0 var(--spacing-l);border-radius:var(--radius-md);box-shadow:var(--shadow-2)}.logo{width:32px;height:32px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-sm)}.title{font-size:24px;font-weight:700;color:var(--color-neutral);line-height:1}.subtitle{font-size:14px;font-weight:400;color:#7f8c8d;margin-top:2px}.main{position:absolute;top:96px;left:0;right:0;bottom:80px;z-index:1}#canvas-container{width:100%;height:100%}.footer{position:absolute;bottom:var(--spacing-m);left:var(--spacing-l);right:var(--spacing-l);z-index:100}.control-bar{display:flex;justify-content:center;align-items:center;gap:var(--spacing-xl);background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:0 var(--spacing-l);border-radius:var(--radius-lg);box-shadow:var(--shadow-3);height:64px}.control-group{display:flex;align-items:center;gap:var(--spacing-s)}.control-group-title{font-size:12px;color:#7f8c8d;margin-right:var(--spacing-s);text-transform:uppercase;letter-spacing:.5px}.icon-button{width:44px;height:44px;border:1px solid #DDE4EB;background:var(--color-light);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--duration-fast) var(--ease);padding:0}.icon-button:hover{background:var(--color-secondary);border-color:#3db8b0;color:#fff}.icon-button:active{background:#3db8b0;border-color:#2ca89e}.icon-button:disabled{background:#e8eef2;border-color:#dde4eb;color:#bdc3c7;cursor:not-allowed}.icon-button svg{width:20px;height:20px;fill:currentColor}.text-button{height:36px;padding:0 var(--spacing-m);background:transparent;border:none;color:var(--color-secondary);font-size:14px;font-weight:500;cursor:pointer;transition:background var(--duration-fast) var(--ease);display:flex;align-items:center;gap:6px}.text-button:hover{background:var(--color-light)}.text-button:disabled{color:#bdc3c7;cursor:not-allowed}.tooltip{position:absolute;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:var(--spacing-m);border-radius:var(--radius-md);box-shadow:var(--shadow-3);z-index:1000;transition:opacity var(--duration-normal) var(--ease);pointer-events:none}.tooltip-content{font-size:14px;color:var(--color-neutral);line-height:20px}.loading-indicator{position:fixed;top:0;left:0;right:0;bottom:0;background:#fffffff2;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999}.loading-progress{width:300px;height:6px;background:#e8eef2;border-radius:3px;overflow:hidden;margin-bottom:var(--spacing-m)}.loading-progress-bar{height:100%;background:linear-gradient(90deg,var(--color-secondary),var(--color-primary));border-radius:3px;transition:width var(--duration-normal) linear}.loading-text{font-size:14px;color:var(--color-neutral);font-weight:500}#loading-percentage{font-size:32px;font-weight:700;color:var(--color-secondary);margin:0 var(--spacing-xs)}.loading-status{font-size:14px;color:#7f8c8d;margin-top:var(--spacing-s)}.scene-label{position:absolute;background:#0009;color:#fff;padding:4px 8px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;white-space:nowrap;pointer-events:none;transition:opacity var(--duration-normal) var(--ease);text-shadow:0 1px 2px rgba(0,0,0,.5)}.scene-label:before{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid rgba(0,0,0,.6)}@media (max-width: 768px){.header{left:var(--spacing-s);right:var(--spacing-s)}.subtitle{display:none}.footer{left:var(--spacing-s);right:var(--spacing-s);bottom:var(--spacing-s)}.control-bar{flex-direction:column;gap:var(--spacing-m);height:auto;padding:var(--spacing-m)}.icon-button{width:36px;height:36px}.tooltip{max-width:200px}}