:root{color:#f6f7f8;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#15171d;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{overscroll-behavior:none;touch-action:none;width:100%;min-width:320px;height:100%;margin:0;overflow:hidden}button{font:inherit}.app-shell{background:radial-gradient(circle at 50% 28%,#ffffff14,#0000 34%),linear-gradient(#191b22 0%,#252a30 100%);grid-template-rows:auto minmax(0,1fr) auto auto;display:grid;position:fixed;inset:0}.top-bar,.bottom-bar{z-index:10;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#101114b8;border-color:#ffffff1a;justify-content:space-between;align-items:center;gap:14px;padding:14px clamp(14px,3vw,28px);display:flex;position:relative}.top-bar{border-bottom:1px solid #ffffff1a}.bottom-bar{border-top:1px solid #ffffff1a}.progress-block{grid-template-columns:auto auto;align-items:center;gap:5px 12px;min-width:min(360px,56vw);display:grid}.progress-label,.ball-name span{color:#aeb5bd;text-transform:uppercase;font-size:.78rem;line-height:1}.progress-block strong{color:#fff;justify-self:end;font-size:1rem}.progress-track{background:#ffffff21;border-radius:999px;grid-column:1/-1;width:100%;height:7px;overflow:hidden}.progress-fill{border-radius:inherit;background:linear-gradient(90deg,#64d8bd,#ff6f91,#f6b94b);height:100%;transition:width .14s}.hold-meter{opacity:0;pointer-events:none;grid-column:1/-1;grid-template-columns:auto minmax(80px,1fr);align-items:center;gap:9px;height:14px;transition:opacity .16s;display:grid}.hold-meter.visible{opacity:1;pointer-events:auto}.hold-meter span{color:#f5d77a;text-transform:uppercase;font-size:.67rem;font-weight:700;line-height:1}.hold-track{background:#ffffff1f;border-radius:999px;height:6px;overflow:hidden}.hold-fill{border-radius:inherit;background:linear-gradient(90deg,#f8d66d,#ff8b5f,#ff5f91);height:100%;transition:width 60ms linear}.tool-buttons{align-items:center;gap:8px;display:flex}.icon-button,.next-button,.complete-banner button{color:#f8fafc;cursor:pointer;background:#ffffff1a;border:1px solid #ffffff24;border-radius:8px;justify-content:center;align-items:center;min-width:42px;min-height:42px;transition:background-color .14s,border-color .14s,transform .14s;display:inline-flex}.icon-button:hover,.next-button:hover,.complete-banner button:hover{background:#ffffff29;border-color:#ffffff42}.icon-button[data-tooltip]{position:relative}.icon-button[data-tooltip]:after{content:attr(data-tooltip);white-space:nowrap;color:#e8eaee;pointer-events:none;opacity:0;background:#12141aeb;border:1px solid #ffffff1a;border-radius:6px;padding:5px 8px;font-size:.7rem;line-height:1;transition:opacity .12s;position:absolute;top:calc(100% + 7px);left:50%;transform:translate(-50%)}.icon-button[data-tooltip]:hover:after{opacity:1}.icon-button:active,.next-button:active,.complete-banner button:active{transform:translateY(1px)}.play-stage{min-height:0;position:relative}.game-canvas-wrap{width:100%;height:100%;position:absolute;inset:0}.game-canvas{cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.canvas-hud{pointer-events:none;z-index:4;flex-direction:column;justify-content:flex-start;align-items:center;gap:10px;padding-top:clamp(10px,2.5vh,22px);display:flex;position:absolute;inset:0}.topbar-tip{white-space:nowrap;color:#ffffff8c;pointer-events:none;align-items:center;gap:7px;margin:0;font-size:.82rem;line-height:1;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.topbar-tip-tag{color:#ffffffb3;letter-spacing:.04em;border:1px solid #ffffff38;border-radius:4px;flex-shrink:0;padding:2px 7px;font-size:.68rem;font-weight:700;line-height:1.5}.canvas-hud-percent{color:#ffffffeb;text-shadow:0 2px 14px #0000008c;letter-spacing:-.02em;font-size:clamp(2rem,6vw,3rem);font-weight:800;line-height:1}.canvas-hud-hold{opacity:0;flex-direction:column;align-items:center;gap:4px;transition:opacity .16s;display:flex}.canvas-hud-hold.visible{opacity:1}.canvas-hud-hold-label{color:#fff9;letter-spacing:.04em;text-shadow:0 1px 6px #00000080;font-size:.85rem;font-weight:600;line-height:1}.canvas-hud-hold-track{background:#ffffff2e;border-radius:999px;width:min(160px,38vw);height:5px;overflow:hidden}.canvas-hud-hold-fill{border-radius:inherit;background:linear-gradient(90deg,#f8d66d,#ff8b5f,#ff5f91);height:100%;transition:width 60ms linear}.menu-popup{z-index:200;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#16181ef7;border:1px solid #ffffff1c;border-radius:12px;min-width:172px;padding:5px;position:absolute;top:calc(100% + 8px);left:0;box-shadow:0 8px 32px #00000073}.menu-popup-item{color:#dde0e6;cursor:pointer;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;width:100%;padding:9px 12px;font-size:.88rem;line-height:1;text-decoration:none;transition:background .12s;display:flex}.menu-popup-item:hover{color:#dde0e6;background:#ffffff14}.menu-popup-item[data-tooltip]{position:relative}.menu-popup-item[data-tooltip]:after{content:attr(data-tooltip);white-space:nowrap;color:#aeb5bd;pointer-events:none;opacity:0;z-index:10;background:#12141af2;border:1px solid #ffffff1a;border-radius:6px;margin-left:8px;padding:4px 8px;font-size:.68rem;transition:opacity .12s;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.menu-popup-item[data-tooltip]:hover:after{opacity:1}.menu-popup-tbu{color:#fff6;text-align:center;margin:0;padding:14px 20px;font-size:.85rem}.complete-banner{z-index:8;color:#101114;background:#ffffffe6;border:1px solid #ffffff80;border-radius:8px;align-items:center;gap:12px;padding:10px 12px;display:flex;position:absolute;top:18px;left:50%;transform:translate(-50%);box-shadow:0 12px 35px #00000038}.complete-banner button{color:#fff;background:#20242a;border-color:#20242a;min-height:36px}.ball-name{gap:4px;min-width:170px;display:grid}.ball-name strong{color:#fff;font-size:.98rem;line-height:1.15}.swatches{justify-content:center;gap:8px;display:flex}.swatch{background:radial-gradient(circle at 35% 32%, var(--swatch-inner), transparent 38%), var(--swatch-wax);cursor:pointer;border:2px solid #ffffff3d;border-radius:50%;width:38px;height:38px;box-shadow:inset -6px -7px 13px #0003}.swatch.active{border-color:#fff;box-shadow:0 0 0 3px #fff3,inset -6px -7px 13px #0003}.next-button{gap:8px;min-width:116px;padding:0 14px}.next-button.complete{color:#101114;background:#f8d66d;border-color:#ffffff61}.savings-counter{pointer-events:none;z-index:4;flex-direction:column;align-items:center;gap:8px;animation:.3s savings-in;display:flex;position:absolute;top:50%;right:12%;transform:translateY(-50%)}@keyframes savings-in{0%{opacity:0;transform:translateY(-50%)scale(.9)}to{opacity:1;transform:translateY(-50%)scale(1)}}.savings-counter-label{color:#fff6;text-align:center;font-size:1rem;line-height:1}.savings-counter-amount{color:#f8d66d;letter-spacing:-.03em;text-shadow:0 2px 20px #f8d66d66;font-size:3.2rem;font-weight:800;line-height:1}.savings-counter-sub{color:#ffffff73;text-align:center;font-size:1rem;line-height:1}.ad-overlay{z-index:5;pointer-events:none;justify-content:center;display:flex;position:absolute;bottom:0;left:0;right:0}.ad-overlay .adsbygoogle{pointer-events:auto;height:0;display:block;overflow:hidden}.page-footer{color:#ffffff4d;background:#0a0b0ed9;justify-content:center;align-items:center;gap:8px;margin:0;padding:5px 0;font-size:.65rem;line-height:1;display:flex}.page-footer a{color:inherit;text-decoration:none}.page-footer a:hover{color:#ffffff8c;text-decoration:underline}@media (width<=640px){.app-shell{min-height:100dvh}.top-bar,.bottom-bar{gap:10px;padding:10px 11px}.progress-block{flex:1;min-width:0}.progress-label,.ball-name span{font-size:.68rem}.icon-button{min-width:38px;min-height:38px}.bottom-bar{grid-template-columns:minmax(0,1fr) auto;align-items:center;display:grid}.ball-name{min-width:0}.ball-name strong{font-size:.88rem}.swatches{order:3;grid-area:2/1/auto/-1}.swatch{width:34px;height:34px}.next-button{min-width:104px;min-height:38px;padding:0 10px}}@media (width<=380px){.tool-buttons{gap:5px}.icon-button{min-width:34px;min-height:34px}.next-button{min-width:96px;font-size:.86rem}}