:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:#000}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow:hidden}#app{width:100%;height:100vh;position:relative}#canvas{width:100%;height:100%;display:block}#controls{position:absolute;top:20px;right:20px;z-index:20;background:#0009;padding:10px;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;align-items:center;gap:10px;box-shadow:0 4px 15px #00000080}.control-group{display:flex;align-items:center;gap:10px;width:100%;justify-content:center}#controls label{font-size:.8rem;font-weight:700;color:#aaa;letter-spacing:1px}.icon-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem;transition:all .2s ease}.icon-btn:hover{background:#0ff3;border-color:#0ff;box-shadow:0 0 10px #00ffff80;transform:scale(1.05)}.icon-btn:active{transform:scale(.95)}#volume-slider{-webkit-appearance:none;width:80px;height:4px;background:#fff3;border-radius:2px;outline:none}#volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;cursor:pointer;transition:transform .1s}#volume-slider::-webkit-slider-thumb:hover{background:#0ff;transform:scale(1.2);box-shadow:0 0 8px #0ffc}#overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;display:flex;justify-content:center;align-items:center;transition:opacity .5s ease,visibility .5s ease;z-index:10;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}#overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}#overlay.dragging{background:#141432d9;border:2px dashed #00ffff}.content{text-align:center;pointer-events:none}h1{font-size:3.2em;line-height:1.1;margin-bottom:1rem;background:linear-gradient(to right,#0ff,#f0f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 20px rgba(0,255,255,.5)}p{font-size:1.2rem;color:#ccc}.sub-text{font-size:.9rem;opacity:.7;margin-top:.5rem}