body { margin: 0; overflow: hidden; background-color: #000; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } #canvas-container { width: 100vw; height: 100vh; position: absolute; top: 0; left: 0; z-index: 1; } #ui-container { position: absolute; top: 20px; right: 20px; z-index: 10; pointer-events: none; /* 让鼠标穿透到 canvas,除非点到 UI 元素 */ } #ui-container > * { pointer-events: auto; } .control-group { margin-bottom: 10px; text-align: right; } #fullscreen-btn { background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.4); color: white; padding: 8px 16px; border-radius: 4px; cursor: pointer; transition: background 0.3s; font-size: 14px; backdrop-filter: blur(5px); } #fullscreen-btn:hover { background: rgba(255, 255, 255, 0.4); } #loading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: white; font-size: 24px; z-index: 20; pointer-events: none; text-shadow: 0 0 10px rgba(0, 255, 255, 0.7); } /* 调整 lil-gui 的样式使其更现代 */ .lil-gui { --background-color: rgba(20, 20, 30, 0.8); --text-color: #eee; --title-background-color: #2a2a3a; --widget-color: #444; --hover-color: #555; --focus-color: #666; --number-color: #2cc9ff; --string-color: #a2ff00; backdrop-filter: blur(10px); border-radius: 8px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5); } .lil-gui .title { border-top-left-radius: 8px; border-top-right-radius: 8px; }