:root{--primary:#00d4ff;--bg-dark:#eff4fb;--bg-glass:#fff6;--border-glass:#0000001a;--accent:#5e6fd3;--glow:#00d4ff66}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:#1e293b;height:100vh;font-family:Outfit,sans-serif;line-height:1.6;overflow:hidden}#app{width:100%;height:100%;position:relative}#three-canvas{display:block;position:absolute;top:0;left:0;width:100%!important;height:100%!important}header{z-index:10;pointer-events:none;position:absolute;top:20px;left:30px}.logo{align-items:center;gap:12px;display:flex}.logo h1{letter-spacing:2px;font-size:24px;font-weight:600}.logo span{color:var(--primary);opacity:.8}.pulse{background:var(--primary);width:10px;height:10px;box-shadow:0 0 10px var(--primary);border-radius:50%;animation:2s infinite pulse}@keyframes pulse{0%{transform:scale(.95);box-shadow:0 0 #00d4ffb3}70%{transform:scale(1);box-shadow:0 0 0 10px #00d4ff00}to{transform:scale(.95);box-shadow:0 0 #00d4ff00}}.subtitle{opacity:.6;text-transform:uppercase;letter-spacing:1px;margin-top:5px;font-size:13px;font-weight:300}#ui-overlay{z-index:20;align-items:center;width:350px;height:100%;padding:20px;transition:right .6s cubic-bezier(.16,1,.3,1);display:flex;position:absolute;top:0;right:-400px}#ui-overlay.active{right:0}.glass-panel{background:var(--bg-glass);-webkit-backdrop-filter:blur(15px);border:1px solid var(--border-glass);border-radius:20px;width:100%;padding:30px;box-shadow:0 10px 40px #0006}.panel-header{justify-content:space-between;align-items:flex-start;margin-bottom:20px;display:flex}.panel-header h2{color:var(--primary);font-size:20px;font-weight:600}#close-panel{color:#ffffff80;cursor:pointer;background:0 0;border:none;padding:5px;font-size:24px;line-height:1}#close-panel:hover{color:#fff}.panel-content{color:#fffc;font-size:15px;line-height:1.8}.controls-hint{color:#fff9;pointer-events:none;background:#00000080;border-radius:50px;padding:10px 20px;font-size:12px;font-weight:300;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.loader-overlay{background:var(--bg-dark);z-index:100;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .5s ease-out;display:flex;position:absolute;top:0;left:0}.spinner{border:3px solid #00d4ff1a;border-top-color:var(--primary);border-radius:50%;width:50px;height:50px;margin-bottom:20px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loader-overlay.hidden{opacity:0;pointer-events:none}.hotspot-label{opacity:.9;pointer-events:none;transition:opacity .3s;position:absolute}.hotspot-label:hover{opacity:1}.label-diagonal{transform-origin:0 0;width:45px;height:1px;box-shadow:none;background-color:#1e293b;position:absolute;top:0;left:0;transform:rotate(-35deg)}.label-text-container{color:#1e293b;letter-spacing:1px;white-space:nowrap;text-shadow:0 0 4px #fff,0 0 8px #fff,0 0 12px #fff;box-shadow:none;border-bottom:1px solid #1e293b;padding-bottom:4px;padding-left:2px;padding-right:8px;font-size:14px;font-weight:400;position:absolute;bottom:25px;left:35px}#ui-actions{z-index:50;gap:15px;display:flex;position:absolute;bottom:20px;right:20px}#fullscreen-btn,#openHelp{background:var(--bg-glass);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-glass);cursor:pointer;color:#1e293b;width:44px;height:44px;box-shadow:none;border-radius:8px;justify-content:center;align-items:center;transition:all .3s;display:flex}#fullscreen-btn:hover,#openHelp:hover{background:#ffffffe6;border-color:#0003;transform:scale(1.05)}#fullscreen-btn svg,#openHelp svg{width:20px;height:20px}#fullscreen-btn .icon-compress,#fullscreen-btn.is-fullscreen .icon-expand{display:none}#fullscreen-btn.is-fullscreen .icon-compress{display:block}