@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/play/colour-sort/assets/fraunces-vietnamese-wght-normal-CnvboYUG.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/play/colour-sort/assets/fraunces-latin-ext-wght-normal-Ca2vKHc0.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/play/colour-sort/assets/fraunces-latin-wght-normal-ukD16Tqj.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Figtree;font-style:normal;font-display:swap;font-weight:400;src:url(/play/colour-sort/assets/figtree-latin-ext-400-normal-CXAzuTZb.woff2)format("woff2"),url(/play/colour-sort/assets/figtree-latin-ext-400-normal-Gbh-3PTk.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Figtree;font-style:normal;font-display:swap;font-weight:400;src:url(/play/colour-sort/assets/figtree-latin-400-normal-g7Dtegnw.woff2)format("woff2"),url(/play/colour-sort/assets/figtree-latin-400-normal-BD4aNku5.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Figtree;font-style:normal;font-display:swap;font-weight:500;src:url(/play/colour-sort/assets/figtree-latin-ext-500-normal-Du0rIuHj.woff2)format("woff2"),url(/play/colour-sort/assets/figtree-latin-ext-500-normal-BOEJvrb_.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Figtree;font-style:normal;font-display:swap;font-weight:500;src:url(/play/colour-sort/assets/figtree-latin-500-normal-BWnGEVsr.woff2)format("woff2"),url(/play/colour-sort/assets/figtree-latin-500-normal-B_yy1phn.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/play/colour-sort/assets/dm-mono-latin-ext-400-normal-C2zvOubV.woff2)format("woff2"),url(/play/colour-sort/assets/dm-mono-latin-ext-400-normal-1aZr6b2b.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/play/colour-sort/assets/dm-mono-latin-400-normal-4GdczIuU.woff2)format("woff2"),url(/play/colour-sort/assets/dm-mono-latin-400-normal--0xN8mdc.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/play/colour-sort/assets/dm-mono-latin-ext-500-normal-BtRyHRi6.woff2)format("woff2"),url(/play/colour-sort/assets/dm-mono-latin-ext-500-normal-Dw3M13d8.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/play/colour-sort/assets/dm-mono-latin-500-normal-DRMDZjhP.woff2)format("woff2"),url(/play/colour-sort/assets/dm-mono-latin-500-normal-CN8Miw6E.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#161922;--surface:#1c202b;--border:#2c3140;--hairline:#232734;--text:#ece4d4;--text-dim:#d6cebf;--muted:#a39d90;--muted-2:#8d897f;--accent:#d9b56a;--mono:"DM Mono", ui-monospace, monospace;--sans:"Figtree", system-ui, sans-serif;--serif:"Fraunces Variable", Fraunces, Georgia, serif;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}html,body{background:var(--bg);width:100%;height:100%;overflow:hidden}body{font-family:var(--sans);color:var(--text)}canvas{touch-action:none;display:block}button{font:inherit;color:inherit}#hud{height:64px;padding:var(--safe-top) calc(20px + var(--safe-right)) 0 calc(32px + var(--safe-left));z-index:10;align-items:center;display:flex;position:fixed;top:0;left:0;right:0}#status{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);font-size:12px}#controls{top:var(--safe-top);right:calc(20px + var(--safe-right));z-index:30;align-items:center;gap:2px;height:64px;display:flex;position:fixed}body.overlay-open #undoBtn,body.overlay-open #restartBtn,body.overlay-open #levelsBtn{display:none}body.overlay-open #hint{visibility:hidden}.ctl{width:44px;height:44px;color:var(--muted-2);cursor:pointer;background:0 0;border:0;border-radius:10px;justify-content:center;align-items:center;gap:2px;transition:color .2s,background .2s,border-color .2s,opacity .2s;display:flex}.ctl:hover:not(:disabled){color:var(--text);background:#ece4d40f}.ctl:disabled{opacity:.3;cursor:default}.ctl-label,#soundBtn .icon-off,#soundBtn.muted .icon-on{display:none}#soundBtn.muted .icon-off{display:inline}#sound{display:flex;position:relative}#soundPanel{background:var(--surface);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:14px;width:230px;padding:16px;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 16px 40px #00000073}#soundPanel[hidden]{display:none}.sound-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.sound-label{color:var(--muted);font-size:14px}.toggle{min-width:60px;font-family:var(--mono);letter-spacing:.1em;color:var(--muted);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:999px;padding:7px 14px;font-size:12px}.toggle[aria-pressed=true]{color:var(--bg);background:var(--accent);border-color:var(--accent)}#musicVolume{min-width:0;accent-color:var(--accent);flex:1}#musicVolume:disabled{opacity:.35}#foot{height:56px;padding:0 calc(32px + var(--safe-right)) var(--safe-bottom) calc(32px + var(--safe-left));border-top:1px solid var(--hairline);z-index:30;justify-content:space-between;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}#siteLink{font-family:var(--mono);letter-spacing:.08em;color:var(--muted);align-items:center;gap:8px;font-size:12px;text-decoration:none;display:flex}#siteLink:hover{color:var(--accent)}#hint{color:var(--muted);font-size:14px}#overlay{z-index:20;padding:calc(24px + var(--safe-top)) 16px calc(72px + var(--safe-bottom));background:var(--bg);flex-direction:column;align-items:center;display:flex;position:fixed;inset:0;overflow-y:auto}.card{text-align:center;flex-direction:column;align-items:center;width:100%;max-width:560px;margin:auto 0;display:flex}.card[hidden]{display:none}#overlay h2{font-family:var(--serif);letter-spacing:-.02em;font-size:44px;font-weight:600;line-height:1}.summary{color:var(--muted);margin-top:14px;font-size:15px;line-height:1.5}.summary[hidden]{display:none}.tabs{border:1px solid var(--border);border-radius:999px;gap:4px;margin-top:24px;padding:4px;display:flex}.tab{min-width:92px;height:36px;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:0 16px;font-size:12px}.tab[aria-pressed=true]{background:var(--accent);color:var(--bg)}.level-grid{grid-template-columns:repeat(10,1fr);gap:6px;width:100%;margin-top:18px;display:grid}.band{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);grid-column:1/-1;justify-content:flex-start;align-items:center;gap:8px;margin-top:8px;font-size:11px;display:flex}.band:first-child{margin-top:0}.band i{border-radius:50%;width:10px;height:10px;display:inline-block}.lvl{aspect-ratio:1;min-height:40px;font-family:var(--mono);background:var(--surface);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:10px;font-size:14px;position:relative}.lvl:hover{border-color:var(--muted-2)}.lvl.solved{color:var(--muted)}.lvl.solved:after{content:"✓";color:#52c97a;font-size:10px;position:absolute;top:2px;right:5px}.lvl.clean{color:var(--text);background:#d9b56a2e;border-color:#d9b56a73}.lvl.clean:after{content:"★";color:var(--accent)}.lvl.locked{color:var(--muted-2);cursor:not-allowed;opacity:.6;background:0 0;border-style:dashed}.lvl.next{border:2px solid var(--accent)}.link-btn{color:var(--muted-2);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;margin-top:22px;padding:8px 12px;font-size:13px;text-decoration:underline}.link-btn:hover{color:var(--text)}.link-btn[hidden]{display:none}.panel-note{color:var(--muted-2);font-size:12px;line-height:1.45}#overlay h1{font-family:var(--serif);letter-spacing:-.02em;font-size:76px;font-weight:600;line-height:1}#overlay .lede{color:var(--text-dim);margin-top:18px;font-size:19px}#overlay .rules{color:var(--muted);flex-direction:column;gap:6px;margin-top:28px;font-size:15px;line-height:1.5;display:flex}#iosHint{color:var(--muted-2);margin-top:14px;font-size:13px}.mini-tubes{align-items:flex-end;gap:14px;margin-bottom:36px;display:flex}.mini{border-radius:0 0 10px 10px;width:20px;height:64px;display:block;position:relative}.mini:before{content:"";background:inherit;border-radius:2px;width:26px;height:5px;position:absolute;top:-6px;left:-3px}.mini--azure{background:#5a86c9}.mini--amber{background:#d9b56a}.mini--jade{background:#7fb58e}.mini--coral{background:#c96f55}.pill{min-width:200px;height:52px;font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;background:var(--accent);color:var(--bg);cursor:pointer;border:0;border-radius:26px;justify-content:center;align-items:center;margin-top:40px;padding:0 32px;font-size:14px;font-weight:500;transition:filter .2s;display:inline-flex}.pill:hover{filter:brightness(1.08)}.pill--quiet{min-width:160px;height:44px;color:var(--muted);border:1px solid var(--border);background:0 0;margin-top:14px}.pill--quiet:hover{color:var(--text);border-color:var(--muted-2);filter:none}@media (width<=620px){#hud{height:48px;padding:var(--safe-top) calc(16px + var(--safe-right)) 0 calc(16px + var(--safe-left));justify-content:center}#status{font-size:11px}#controls{top:auto;left:0;right:auto;bottom:calc(48px + var(--safe-bottom));justify-content:center;gap:12px;width:100%;height:auto;padding:0 20px 16px}.ctl{background:var(--surface);border:1px solid var(--border);width:76px;height:52px;color:var(--text);border-radius:14px;flex-direction:column;gap:2px}.ctl-label{color:var(--muted);font-size:11px;display:block}#sound{display:block}#soundPanel{top:auto;left:calc(16px + var(--safe-left));right:calc(16px + var(--safe-right));bottom:calc(48px + 84px + var(--safe-bottom));width:auto;max-width:360px;margin:0 auto;position:fixed}#foot{background:var(--bg);justify-content:center;height:48px;padding-left:16px;padding-right:16px}body.overlay-open #controls{background:var(--bg);border-top:1px solid var(--hairline);padding-top:12px}#overlay{padding-bottom:calc(150px + var(--safe-bottom))}#hint{display:none}#overlay h1{font-size:52px}#overlay h2{font-size:36px}.level-grid{grid-template-columns:repeat(5,1fr)}.tab{min-width:0;padding:0 14px}#overlay .lede{font-size:17px}.mini{height:52px}}