:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;padding:0;overflow:hidden}#root{width:100%;height:100%;margin:0;padding:0}.app-container{background:var(--bg);touch-action:none;flex-direction:column;align-items:center;width:100vw;height:100vh;padding-top:15vh;display:flex;position:relative;overflow:hidden}.content-container{flex:1;justify-content:center;align-items:flex-start;width:100%;display:flex}.level-container{background:radial-gradient(circle, var(--accent-bg) 0%, transparent 70%);will-change:transform;border-radius:50%;transition:transform .3s ease-out;position:relative}.level-container.clicked{animation:.3s ease-in-out pulse}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(.95)}to{transform:scale(1)}}.level-circle{border:3px solid var(--accent-border);will-change:transform;background:radial-gradient(at 30% 30%,#ffffff1a 0%,#0000000d 100%);border-radius:50%;justify-content:center;align-items:center;transition:transform 50ms linear;display:flex;position:absolute;inset:10px;overflow:hidden;transform:translate(0)}.ripple{border:2px solid var(--accent);pointer-events:none;border-radius:50%;width:20px;height:20px;animation:1s ease-out forwards ripple;position:absolute;transform:scale(0)}@keyframes ripple{0%{opacity:1;transform:scale(0)}to{opacity:0;transform:scale(15)}}.level-ball{background:radial-gradient(circle at 35% 35%, #fff 0%, var(--accent) 60%, #5a189a 100%);will-change:transform;border-radius:50%;transition:transform .1s ease-out;box-shadow:inset -2px -2px 8px #0000004d,inset 2px 2px 8px #ffffff80,0 4px 12px #00000040}.settings-button{background:var(--accent);cursor:pointer;width:56px;height:56px;box-shadow:var(--shadow);z-index:100;border:none;border-radius:50%;font-size:28px;transition:transform .2s;position:fixed;bottom:30px;right:30px}.settings-button:hover{transform:scale(1.1)}.settings-button:active{transform:scale(.95)}.settings-overlay{z-index:200;background:#00000080;justify-content:center;align-items:flex-end;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.settings-panel{background:var(--bg);border-radius:20px 20px 0 0;width:100%;max-width:500px;padding:24px 24px 40px;animation:.3s ease-out slideUp}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.settings-panel h3{color:var(--text-h);margin:0 0 20px;font-size:20px;font-weight:600}.settings-item{border:1px solid var(--border);background:var(--accent-bg);width:100%;color:var(--text-h);cursor:pointer;text-align:left;border-radius:8px;margin-bottom:12px;padding:16px;font-size:16px;transition:all .2s;display:block}.settings-item:hover{background:var(--accent);color:#fff;border-color:var(--accent)}.settings-close{border:1px solid var(--border);width:100%;color:var(--text);cursor:pointer;background:0 0;border-radius:8px;margin-top:8px;padding:14px;font-size:16px;transition:background .2s;display:block}.settings-close:hover{background:var(--code-bg)}.permission-overlay{z-index:10;text-align:center;background:#0009;flex-direction:column;justify-content:center;align-items:center;gap:20px;padding:20px;display:flex;position:absolute;inset:0}.permission-button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:16px 32px;font-size:18px;transition:transform .2s}.permission-button:hover{transform:scale(1.05)}.permission-button:active{transform:scale(.98)}.permission-overlay p{color:#fff;max-width:280px;font-size:14px}.settings-slider{background:var(--code-bg);border-radius:8px;margin-bottom:20px;padding:12px}.slider-label{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.slider-label span{color:var(--text-h);font-size:15px}.slider-input{background:var(--border);appearance:none;cursor:pointer;border-radius:3px;outline:none;width:100%;height:6px}.slider-input::-webkit-slider-thumb{appearance:none;background:var(--accent);cursor:pointer;border-radius:50%;width:20px;height:20px}.slider-input::-moz-range-thumb{background:var(--accent);cursor:pointer;border:none;border-radius:50%;width:20px;height:20px}.slider-markers{color:var(--text);justify-content:space-between;margin-top:6px;font-size:12px;display:flex}.test-mode-hint{color:#fffc;margin:10px 0;font-size:12px}.test-mode-button{color:#fff;cursor:pointer;background:0 0;border:1px solid #ffffff80;border-radius:8px;padding:12px 24px;font-size:16px;transition:all .2s}.test-mode-button:hover{background:#fff3}.test-mode-hint-badge{color:#fff;background:#00000080;border-radius:12px;padding:4px 12px;font-size:12px;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.level-container.test-mode{cursor:grab}.level-container.test-mode:active{cursor:grabbing}.settings-note{background:var(--accent-bg);color:var(--text);border-radius:6px;margin-bottom:12px;padding:10px;font-size:13px}