html,body,#root{margin:0;padding:0;width:100%;height:100%}canvas{display:block}.ui-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:100;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.ui-overlay>*{pointer-events:auto}.debug-button{position:absolute;top:20px;right:20px;padding:10px 15px;background:#000c;color:#fff;border:2px solid #fff;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;transition:all .2s ease}.debug-button:hover{background:#000000f2;transform:scale(1.05);border-color:#4caf50}.debug-button:active{transform:scale(.98)}.controls-info{position:absolute;bottom:20px;left:20px;background:#000000d9;color:#fff;padding:20px;border-radius:12px;font-size:14px;border-left:4px solid #4caf50;max-width:300px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.controls-info h3{margin:0 0 12px;color:#4caf50;font-size:16px}.controls-info p{margin:8px 0;line-height:1.5}.controls-info strong{color:gold}.station-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:auto;z-index:101}.station-content{background:#fff;padding:40px;border-radius:16px;text-align:center;min-width:350px;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease}.station-content h2{margin:0 0 15px;color:#2c3e50;font-size:28px}.station-content p{margin:0 0 25px;color:#666;font-size:16px}.close-button{padding:12px 30px;background:#e74c3c;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:16px;font-weight:600;transition:all .2s ease}.close-button:hover{background:#c0392b;transform:translateY(-2px);box-shadow:0 5px 15px #e74c3c66}.close-button:active{transform:translateY(0)}.pause-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:flex;align-items:center;justify-content:center;pointer-events:auto;z-index:102;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.pause-content{text-align:center;color:#fff}.pause-content h1{margin:0 0 30px;font-size:72px;font-weight:700;text-shadow:0 4px 20px rgba(0,0,0,.8);letter-spacing:4px}.resume-button{padding:15px 40px;background:#4caf50;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:18px;font-weight:600;transition:all .2s ease}.resume-button:hover{background:#45a049;transform:scale(1.05)}.resume-button:active{transform:scale(.98)}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.controls-info{bottom:10px;left:10px;font-size:12px;padding:15px}.station-content{min-width:90vw;padding:30px 20px}.pause-content h1{font-size:48px}}.proximity-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000f2;color:#fff;padding:20px 35px;border-radius:16px;font-size:18px;font-weight:600;border:3px solid #4caf50;animation:pulse 2s ease-in-out infinite;pointer-events:none;text-align:center;box-shadow:0 10px 30px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.proximity-indicator strong{color:gold;font-size:16px;padding:2px 6px;background:#ffd70033;border-radius:4px}@keyframes pulse{0%,to{opacity:.85;transform:translate(-50%,-50%) scale(1);border-color:#4caf50}50%{opacity:1;transform:translate(-50%,-50%) scale(1.02);border-color:#66bb6a}}.debug-panel{position:absolute;top:70px;right:20px;background:#000000f2;padding:15px 20px;border-radius:8px;border:2px solid #4caf50;font-family:Courier New,monospace;min-width:160px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 15px #00000080}.debug-metric{display:flex;justify-content:space-between;align-items:center;margin:8px 0;font-size:14px}.debug-label{color:#aaa;margin-right:15px;font-weight:600}.debug-value{color:#4caf50;font-weight:700;font-size:16px;min-width:60px;text-align:right}.debug-value.good{color:#4caf50}.debug-value.medium{color:#ff9800}.debug-value.warning{color:#f44336;animation:blink 1s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.6}}.audio-button{position:absolute;top:20px;left:20px;width:50px;height:50px;background:#000c;color:#fff;border:2px solid #fff;border-radius:50%;cursor:pointer;font-size:22px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.audio-button:hover{background:#000000f2;transform:scale(1.1);border-color:#4caf50}.audio-button:active{transform:scale(.95)}.audio-button.muted{border-color:#f44336;opacity:.7}