*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: #2196F3;--secondary-color: #1976D2;--text-color: #ffffff;--bg-overlay: rgba(0, 0, 0, .8);--bg-panel: rgba(0, 0, 0, .9);--border-color: rgba(255, 255, 255, .1);--transition-speed: .3s}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;overflow:hidden;background:#000;color:var(--text-color)}#canvas-container{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1}#loading-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;background:linear-gradient(135deg,#1a1a1a,#2d2d2d);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity var(--transition-speed)}.loading-content{text-align:center;padding:40px}.loading-content h1{font-size:3rem;margin-bottom:40px;color:var(--primary-color);text-shadow:0 0 20px rgba(33,150,243,.5)}.loading-bar-container{max-width:400px;margin:0 auto}.loading-bar{width:100%;height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden;position:relative}.loading-progress{height:100%;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));border-radius:3px;transition:width .3s ease;width:0%}.loading-text{margin-top:15px;font-size:1.1rem;color:#ffffffb3}#error-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:1001}.error-content{text-align:center;padding:40px;max-width:500px}.error-content h2{color:#f44336;font-size:2rem;margin-bottom:20px}.error-content p{margin-bottom:30px;color:#ffffffb3}.btn-primary{padding:12px 30px;background:var(--primary-color);color:#fff;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:all var(--transition-speed)}.btn-primary:hover{background:var(--secondary-color);transform:translateY(-2px);box-shadow:0 4px 12px #2196f366}#hud{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:100}.hud-top-left,.hud-top-right,.hud-bottom-left,.hud-bottom-right{position:absolute;pointer-events:auto}.hud-top-left{top:20px;left:20px}.hud-top-right{top:20px;right:20px}.hud-bottom-left{bottom:20px;left:20px}.hud-bottom-right{bottom:20px;right:20px}.location-info{background:var(--bg-overlay);padding:15px 20px;border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.location-label{font-size:.75rem;color:#fff9;text-transform:uppercase;letter-spacing:1px}.location-name{display:block;font-size:1.2rem;margin-top:5px;color:var(--primary-color)}.controls-info{background:var(--bg-overlay);padding:15px;border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.control-item{display:flex;align-items:center;gap:10px;margin-bottom:8px}.control-item:last-child{margin-bottom:0}.key{background:#ffffff1a;padding:4px 8px;border-radius:4px;font-size:.8rem;font-family:monospace}.label{font-size:.9rem;color:#fffc}.hud-button{width:50px;height:50px;background:var(--bg-overlay);border:1px solid var(--border-color);border-radius:50%;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-speed)}.hud-button:hover{background:var(--primary-color);border-color:var(--primary-color);transform:scale(1.1)}.fps-counter{background:var(--bg-overlay);padding:8px 15px;border-radius:20px;font-size:.9rem;font-family:monospace;color:#4caf50}#menu{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000c;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:200;display:flex;align-items:center;justify-content:center;pointer-events:auto}.menu-content{background:var(--bg-panel);border-radius:12px;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;border:1px solid var(--border-color)}.menu-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--border-color)}.menu-header h2{color:var(--primary-color)}.close-button{width:36px;height:36px;background:transparent;border:none;color:#fff;font-size:1.5rem;cursor:pointer;border-radius:6px;transition:all var(--transition-speed)}.close-button:hover{background:#ffffff1a}.menu-body{padding:20px}.menu-section{margin-bottom:30px}.menu-section:last-child{margin-bottom:0}.menu-section h3{color:var(--primary-color);margin-bottom:15px;font-size:1.1rem}.scene-list{display:flex;flex-direction:column;gap:8px}.scene-item{padding:12px 15px;background:#ffffff0d;border:1px solid transparent;border-radius:6px;color:#fff;text-align:left;cursor:pointer;transition:all var(--transition-speed)}.scene-item:hover{background:#ffffff1a}.scene-item.active{background:var(--primary-color);border-color:var(--primary-color)}.setting-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border-color)}.setting-item:last-child{border-bottom:none}.setting-item label{color:#fffc}.setting-item select,.setting-item input[type=range]{background:#ffffff1a;border:1px solid var(--border-color);border-radius:4px;color:#fff;padding:8px 12px;cursor:pointer}.setting-item select:focus{outline:none;border-color:var(--primary-color)}#info-panel{position:fixed;right:-500px;top:0;width:450px;height:100vh;background:var(--bg-panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:150;transition:right var(--transition-speed);pointer-events:auto;overflow-y:auto}#info-panel.visible{right:0}.info-panel-content{height:100%;display:flex;flex-direction:column}.info-panel-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--border-color)}.info-panel-header h3{font-size:1.5rem;color:var(--primary-color)}.info-panel-body{padding:20px;flex:1}.info-media{width:100%;aspect-ratio:16/9;background:#ffffff0d;border-radius:8px;margin-bottom:20px;overflow:hidden}.info-media img,.info-media video{width:100%;height:100%;object-fit:cover}.info-description{margin-bottom:20px;line-height:1.6;color:#ffffffe6}.info-meta{display:grid;grid-template-columns:1fr 1fr;gap:15px}.meta-item{background:#ffffff0d;padding:15px;border-radius:8px}.meta-label{display:block;font-size:.8rem;color:#fff9;margin-bottom:5px;text-transform:uppercase}.meta-value{display:block;font-size:1.1rem;color:var(--primary-color)}.hidden{display:none!important}.visible{display:block!important}@media (max-width: 768px){.loading-content h1{font-size:2rem}.hud-top-left,.hud-top-right{top:10px;left:10px}.hud-top-right{left:auto;right:10px}.location-info,.controls-info{padding:10px;font-size:.9rem}#info-panel{width:100%;right:-100%}.info-meta{grid-template-columns:1fr}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#ffffff0d}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--secondary-color)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.fade-in{animation:fadeIn var(--transition-speed) ease-in}.slide-in-right{animation:slideInRight var(--transition-speed) ease-out}.pulse{animation:pulse 2s ease-in-out infinite}