:root{--ground-r:#f6e3e3;--ground-g:#e0f0e3;--ground-b:#dfe7f8;--ground-k:#efedea;--ink:#14141a}*{box-sizing:border-box}html,body{background:var(--ground-r);-webkit-tap-highlight-color:transparent;height:100%;margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;transition:background .48s;overflow:hidden}#stage{background:var(--ground-r);touch-action:none;-webkit-user-select:none;user-select:none;transition:background .48s;position:fixed;inset:0}#stage[data-channel=g]{background:var(--ground-g)}#stage[data-channel=b]{background:var(--ground-b)}html[data-channel=g],html[data-channel=g] body{background:var(--ground-g)}html[data-channel=b],html[data-channel=b] body{background:var(--ground-b)}#stage[data-channel=k],html[data-channel=k],html[data-channel=k] body{background:var(--ground-k)}#stage.bump{animation:.26s bump}@keyframes bump{0%,to{transform:translate(0)}15%{transform:translate(-6px,2px)}32%{transform:translate(5px,-3px)}50%{transform:translate(-4px,-2px)}68%{transform:translate(3px,2px)}85%{transform:translate(-2px)}}@media (prefers-reduced-motion:reduce){@keyframes bump{0%,to{transform:translate(0)}50%{transform:translate(-2px)}}}#stage.solved{animation:12s linear infinite drift}@keyframes drift{0%{background:var(--ground-r)}33%{background:var(--ground-g)}66%{background:var(--ground-b)}to{background:var(--ground-r)}}#ink,#notes{display:block;position:absolute;inset:0}#notes{pointer-events:none}#counter{top:max(18px, env(safe-area-inset-top));left:max(18px, env(safe-area-inset-left));color:#14141ab3;letter-spacing:.06em;-webkit-user-select:none;user-select:none;z-index:2;background:#ffffff59;border:2px solid #14141a47;border-radius:6px;align-items:center;height:44px;padding:0 14px;font-size:17px;font-weight:600;display:flex;position:absolute}#budget{top:max(18px, env(safe-area-inset-top));z-index:2;align-items:center;gap:10px;display:flex;position:absolute;left:50%;transform:translate(-50%)}#clicks,#restart{color:#14141ab3;-webkit-user-select:none;user-select:none;background:#ffffff59;border:2px solid #14141a47;border-radius:6px;justify-content:center;align-items:center;height:44px;padding:0 14px;font-family:inherit;font-size:19px;font-weight:600;display:flex}#budget[hidden],#restart[hidden],#counter[hidden]{display:none}#clicks.low{color:#14141a;border-color:#14141a}#restart{cursor:pointer;color:#fff;letter-spacing:.04em;background:#14141a;border-color:#14141a}#win{pointer-events:none;opacity:0;z-index:3;justify-content:center;align-items:center;transition:opacity .9s;display:flex;position:absolute;inset:0}#win[hidden]{display:none}#win.on{opacity:1}#win span{border:3px solid var(--ink);color:var(--ink);letter-spacing:.18em;text-indent:.18em;background:#ffffff8c;border-radius:12px;padding:22px 40px;font-size:44px;font-weight:700}#wipe{pointer-events:none;z-index:3;background:#14141a;position:absolute;inset:0;transform:translate(-101%)}#wipe.on{animation:.64s ease-in-out wipe}@keyframes wipe{0%{transform:translate(-101%)}44%,56%{transform:translate(0)}to{transform:translate(101%)}}.controls{top:max(18px, env(safe-area-inset-top));right:max(18px, env(safe-area-inset-right));z-index:2;align-items:center;gap:20px;display:flex;position:absolute}.swatches,.tools{gap:12px;display:flex}.swatch{cursor:pointer;opacity:.5;border:none;border-radius:6px;width:44px;height:44px;padding:0;transition:opacity .18s,transform .18s,box-shadow .18s;box-shadow:inset 0 0 #ffffffe6}.swatch[data-channel=r]{background:#d13a3a}.swatch[data-channel=g]{background:#2f9b4d}.swatch[data-channel=b]{background:#3a63d4}.swatch[data-channel=k]{background:#14141a}.swatch.on{opacity:1;transform:scale(1.16);box-shadow:inset 0 0 0 4px #ffffffeb}.tool{color:#14141a9e;cursor:pointer;background:#ffffff59;border:2px solid #14141a47;border-radius:6px;justify-content:center;align-items:center;width:44px;height:44px;padding:0;transition:border-color .18s,background .18s,color .18s;display:flex}.tool svg{width:22px;height:22px;display:block}.tool.on{color:#fff;background:#14141a;border-color:#14141a}.answer{left:50%;bottom:max(40px, env(safe-area-inset-bottom));z-index:2;position:absolute;transform:translate(-50%)}#slots{cursor:text;background:#ffffff47;border:2px solid #14141a6b;border-radius:10px;gap:14px;padding:10px 16px;transition:border-color .22s,background .22s;display:flex}#slots:focus-within{border-color:#14141acc}#slots.right{background:#fff9;border-color:#14141ae6}.slot{letter-spacing:.02em;width:46px;height:44px;color:var(--ink);border-bottom:3px solid #14141a52;justify-content:center;align-items:center;font-size:30px;font-weight:600;display:flex}.slot.cue{animation:1.1s ease-in-out infinite cue}@keyframes cue{0%,to{border-bottom-color:#14141a52}50%{border-bottom-color:#14141ae6}}#slots.wrong{animation:.38s shake}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-9px)}40%{transform:translate(9px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}.solved #slots .slot{border-bottom-color:#14141ae6;transition:border-bottom-color .6s}#entry{opacity:0;width:100%;height:100%;font:inherit;cursor:text;background:0 0;border:0;padding:0;position:absolute;inset:0}#entry:focus{outline:none}@media (width<=480px){.slot{width:38px;height:40px;font-size:26px}#counter,#clicks,#restart{height:40px;padding:0 9px;font-size:13px}.controls{gap:12px}#win span{padding:18px 28px;font-size:30px}.swatch{width:40px;height:40px}}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}