*{box-sizing:border-box;margin:0;padding:0}html,body,#root{color:#eee;background:#111;width:100%;height:100%;font-family:system-ui,-apple-system,sans-serif;overflow:hidden}#root{flex-direction:column;justify-content:center;align-items:center;display:flex}.lobby{background:#1a1a1a;border:1px solid #333;border-radius:12px;flex-direction:column;align-items:center;gap:20px;min-width:340px;padding:40px;display:flex}.lobby h1{color:#f0e6d3;font-size:28px;font-weight:600}.lobby input{color:#eee;background:#222;border:1px solid #444;border-radius:8px;width:100%;padding:10px 14px;font-size:14px}.lobby input:focus{border-color:#c4a882;outline:none}.lobby button{color:#111;cursor:pointer;background:#c4a882;border:none;border-radius:8px;padding:10px 24px;font-size:14px;font-weight:600;transition:background .2s}.lobby button:hover{background:#d4b892}.lobby button:disabled{opacity:.5;cursor:not-allowed}.lobby .room-code{letter-spacing:8px;color:#f0e6d3;font-family:monospace;font-size:32px;font-weight:700}.lobby .copy-btn{color:#ccc;background:#333;padding:6px 14px;font-size:12px}.lobby .copy-btn:hover{background:#444}.lobby .spinner{border:3px solid #444;border-top-color:#c4a882;border-radius:50%;width:24px;height:24px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.lobby .error{color:#e74c3c;font-size:13px}.lobby .join-row{gap:8px;width:100%;display:flex}.lobby .join-row input{flex:1}.overlay-ui{pointer-events:none;z-index:10;justify-content:center;gap:8px;padding:12px 16px;display:flex;position:fixed;bottom:0;left:0;right:0}.overlay-ui>*{pointer-events:auto}.toolbar{background:#1a1a1ae6;border:1px solid #333;border-radius:10px;gap:4px;padding:6px;display:flex}.toolbar button{color:#aaa;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;padding:8px 16px;font-size:13px;transition:all .15s}.toolbar button:hover{color:#eee;background:#333}.toolbar button.active{color:#111;background:#c4a882;font-weight:600}.toolbar button.danger{color:#e74c3c}.toolbar button.danger.active{color:#fff;background:#e74c3c}.color-palette{background:#1a1a1ae6;border:1px solid #333;border-radius:10px;gap:4px;padding:8px;display:flex}.color-swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;width:24px;height:24px;transition:transform .15s}.color-swatch:hover{transform:scale(1.2)}.grab-controls{color:#aaa;background:#1a1a1ae6;border:1px solid #333;border-radius:10px;align-items:center;gap:10px;padding:8px 14px;font-size:13px;display:flex}.grab-controls input[type=range]{accent-color:#c4a882;width:120px}.reconnect-overlay{z-index:100;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.reconnect-overlay .spinner{border:4px solid #444;border-top-color:#c4a882;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}