:root{--pixel:"Silkscreen", monospace;--term:"VT323", monospace;--hand:"Caveat", cursive}a{color:inherit}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}:root{--tile:#16161a;--tile-fg:#f5f5f7}:root[data-theme=light]{--tile:#1d1d1f}.theme-toggle svg{display:block}:root[data-theme=light] .theme-toggle .sun,:root:not([data-theme=light]) .theme-toggle .moon{display:none}.about{max-width:1100px;padding:calc(var(--top) + 40px) 20px 80px;color:var(--fg);margin:0 auto;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.intro h1{font:400 clamp(44px, 9vw, 86px)/.95 var(--pixel);letter-spacing:-.01em;margin:0 0 18px}.intro h1:after{content:"_";animation:1s step-end infinite blink}.intro .lede{font:400 clamp(22px, 3vw, 34px)/1.15 var(--term);color:var(--fg-2);margin:0 0 40px}.words{font-size:clamp(18px,1.6vw,21px);line-height:1.55}.words p{margin:0 0 1.2em}.words strong{font-weight:650}.ways{margin:72px 0}.ways h2,.toy h2{font:400 clamp(26px, 4vw, 44px) var(--pixel);margin:0 0 20px}.ways ul{grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding:0;list-style:none;display:grid}.ways a{background:var(--tile);color:var(--tile-fg);box-shadow:inset 0 0 0 1px var(--line);border-radius:10px;align-content:start;gap:6px;min-height:120px;padding:18px 20px;text-decoration:none;transition:transform .15s,background .15s;display:grid}.ways a:hover,.ways a:focus-visible{background:var(--accent);color:#111;transform:translateY(-2px)}.ways a strong{font:500 22px var(--pixel)}.ways a span{opacity:.85;font-size:15px;line-height:1.4}.toy{margin:72px 0 0}.toy>p{margin:0 0 20px;font-size:18px;line-height:1.55}.machine{aspect-ratio:1100/700;width:100%;max-height:85dvh;box-shadow:0 20px 60px #00000040, 0 0 0 1px var(--line);background:#a8a8a8;border-radius:10px;position:relative;overflow:hidden}.screen{position:absolute;inset:0;overflow:hidden}.screen[hidden]{display:none}.screen .inner{width:1100px;height:700px;transform:translate(-50%, -50%) scale(var(--s,1));transform-origin:50%;position:absolute;top:50%;left:50%}.boot .inner{width:auto;height:auto;position:absolute;inset:0;transform:none}.screen h2{position:absolute;left:-9999px}.about>.end{border-top:1px solid var(--line);font:400 16px var(--mono);flex-wrap:wrap;gap:18px;margin:72px 0 0;padding-top:24px;display:flex}.about>.end a{color:var(--fg)}@keyframes blink{50%{opacity:0}}.boot{color:#000;text-align:center;cursor:pointer;background:#fff;place-items:center;display:grid}.boot .brand{letter-spacing:-.03em;color:#000;align-items:center;gap:9px;font-size:17px;font-weight:700;text-decoration:none;display:inline-flex;position:absolute;top:18px;left:20px}.boot .brand svg{width:20px;height:20px}.boot .brand em{color:#1d1d1f99;font-style:normal;font-weight:500}.kick-screen{place-content:center;justify-items:center;gap:6px;display:grid;position:absolute;inset:0}.boot .hand{width:300px;height:auto}.boot .greet{font:400 clamp(22px, 4.6vw, 40px) var(--pixel);color:#000;letter-spacing:.02em;margin:10px 0 8px}.boot .greet:after{content:"_";animation:1s step-end infinite blink}.boot p{font:400 22px var(--term);color:#555;margin:0}.boot .kick{font:400 16px var(--term);color:#666;text-align:left;position:absolute;bottom:64px;left:20px}.flash{opacity:0;pointer-events:none;background:#05a;transition:opacity 1.1s;position:absolute;inset:0}.amiga{color:#000;font-family:var(--pixel);cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path d='M1 1l0 12 3-3 2 5 2-1-2-5 4 0z' fill='%23e33' stroke='%23000'/></svg>") 1 1,auto;background:#a8a8a8;font-size:10px}.octamed{box-sizing:border-box;background:#a8a8a8;grid-template-rows:22px auto 20px 1fr 20px 64px auto;gap:4px;padding:0 10px 8px;display:grid}.octamed .screenbar{color:#000;white-space:nowrap;background:#fff;border-bottom:2px solid #000;justify-content:space-between;align-items:center;margin:0 -10px;padding:0 10px;display:flex}.octamed .screenbar b{font-weight:700}.octamed,.octamed :is(.screenbar,.infoline,.memline,.rows,.ctl-row .lab,b,button,.field){font-variant-numeric:tabular-nums}.octamed b,.octamed button,.octamed .field{font:700 9px var(--pixel);color:#000;text-transform:uppercase;white-space:nowrap;background:#a8a8a8;border:2px solid #333;border-color:#fff #333 #333 #fff;padding:2px 6px}.octamed b{color:#555;background:#a2a2a2;border-color:#bdbdbd #8a8a8a #8a8a8a #bdbdbd}.octamed b.on{color:#ddd;background:#777;border-color:#555 #bbb #bbb #555}.octamed button.real{cursor:pointer;padding-left:14px;position:relative}.octamed button.real:before{content:"";background:#5a0;border-radius:1px;width:5px;height:5px;margin-top:-2px;position:absolute;top:50%;left:5px;box-shadow:0 0 3px #5a0}.octamed button.real:hover{background:#bcbcbc}.octamed button.on{color:#fff;background:#000;border-color:#333 #fff #fff #333}.octamed button.on:before{background:#f80;box-shadow:0 0 4px #f80}.octamed button:active{border-color:#333 #fff #fff #333}.octamed .num{font-family:var(--pixel);text-align:right;display:inline-block}#amTimer{text-align:right;min-width:5ch;display:inline-block}#bpmVal{text-align:center;min-width:7ch}#amPos{min-width:10ch}#amRow{min-width:8ch}#amBlockNo{min-width:12ch}.ctl-row .hint{color:#333;text-transform:none;letter-spacing:0}.octamed .big{padding:4px 10px}.ctl{grid-template-columns:1fr 250px;gap:6px;display:grid}.ctl-left{gap:4px;display:grid}.posbox{grid-template-columns:36px auto 1fr;align-items:start;gap:4px;display:grid}.posnums{color:#8a8aa0;font:700 9px var(--pixel);text-align:center;background:#000;border:2px solid #fff;border-color:#333 #fff #fff #333;gap:1px;padding:2px 0;display:grid}.posnums .hi{color:#fff;background:#05a}.btns{grid-template-columns:repeat(5,auto);gap:3px;display:grid}.sliders{gap:6px;padding-top:4px;display:grid}.sliders i{background:#000;border:2px solid #fff;border-color:#333 #fff #fff #333;height:12px;display:block;position:relative}.sliders i:after{content:"";background:#fff;width:10px;position:absolute;top:1px;bottom:1px;left:22%}.ctl-row{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.ctl-row .lab{font:700 9px var(--pixel);padding:0 4px}.ctl-row .val{color:#fff;background:#000;border-color:#333 #fff #fff #333}.menu-grid{grid-template-columns:repeat(3,1fr);align-content:start;gap:3px;display:grid}.menu-grid b{text-align:center;padding:6px 2px}.infoline{color:#fff;font:700 10px var(--pixel);white-space:nowrap;background:#000;border:2px solid #fff;border-color:#333 #fff #fff #333;align-items:center;gap:10px;padding:0 8px;display:flex;overflow:hidden}.infoline .bars{letter-spacing:-2px;color:#9a9a9a}.pattern{font-family:var(--term);color:#e8e8e8;background:#000;border:2px solid #fff;border-color:#333 #fff #fff #333;min-height:0;font-size:19px;line-height:1.1;position:relative;overflow:hidden}.chhead,.pattern .row{grid-template-columns:48px repeat(4,1fr);display:grid}.chhead{z-index:2;color:#fff;height:18px;font:700 10px var(--pixel);background:#000;position:absolute;top:0;left:0;right:0}.chhead span,.chhead button{border-left:1px solid #d33;padding:2px 10px}.chhead span:first-child{border:0}.chhead .chh{text-transform:uppercase;border-left:1px solid #d33;justify-content:space-between;align-items:center;padding:1px 6px 1px 10px;display:flex}.chhead .chh span{border:0;padding:0}.chhead .chon{padding:1px 6px 1px 12px;font-size:8px;line-height:1.2}.chhead .chon.on{color:#fff;background:#000;border-color:#333 #fff #fff #333}.chhead .chon.on:before{background:#5f5;box-shadow:0 0 4px #5f5}.chhead .chon:not(.on){color:#777}.chhead .chon:not(.on):before{box-shadow:none;background:#444}.pattern.m0 .chh:nth-child(2) span,.pattern.m1 .chh:nth-child(3) span,.pattern.m2 .chh:nth-child(4) span,.pattern.m3 .chh:nth-child(5) span{color:#666;text-decoration:line-through}.pattern.m0 .row span:nth-child(2),.pattern.m1 .row span:nth-child(3),.pattern.m2 .row span:nth-child(4),.pattern.m3 .row span:nth-child(5){color:#555}.pattern .row span[data-ch]{cursor:pointer}.pattern .row span[data-ch]:hover{color:#f80}.rows{position:absolute;inset:18px 0 0}.pattern .row{white-space:nowrap}.pattern .row span{border-left:1px solid #d33;padding:0 10px}.pattern .row span:first-child{color:#9a9aa2;border:0}.pattern .row.cur{color:#000;background:#9a9a9a}.pattern .row.cur span:first-child{color:#000}.pattern .row.cur span:nth-child(2){outline-offset:-2px;outline:2px solid #e33}.vus{pointer-events:none;grid-template-columns:repeat(4,1fr);display:grid;position:absolute;inset:18px 0 0 48px}.vu{display:block;position:relative}.vu:after{content:"";width:14px;height:var(--lv,0%);background:linear-gradient(#e62b2b 0%,#f80 20%,#e6e62b 45%,#2bd42b 100%);transition:height 60ms linear;position:absolute;bottom:6px;left:62%}.memline{font:700 10px var(--pixel);background:#a8a8a8;justify-content:space-between;align-items:center;gap:10px;display:flex}.memline .field{color:#fff;text-transform:none;background:#000;border-color:#333 #fff #fff #333;flex:1;margin:0 10px}.scopes{grid-template-columns:48px repeat(4,1fr);align-items:stretch;gap:0 4px;display:grid}.scopes .scopelab{font:700 9px var(--pixel);color:#333;align-self:center}.scopes canvas{box-sizing:border-box;background:#a8a8a8;border:2px solid #fff;border-color:#333 #fff #fff #333;width:100%;height:64px;display:block}.requesters{grid-template-columns:1.3fr 1fr;gap:8px;display:grid}.req{background:#a8a8a8;border:2px solid #333;border-color:#fff #333 #333 #fff}.reqtitle{color:#fff;font:700 9px var(--pixel);text-transform:uppercase;background:#05a repeating-linear-gradient(90deg,#05a 0 2px,#47c 2px 4px);padding:3px 8px}.reqtitle:after{content:""}.reqbody{background:#fff;border-top:2px solid #000;padding:8px 10px}.reqbody.readme{font:400 16px var(--term);color:#000;line-height:1.2}.reqbody.readme p{margin:0 0 4px}.reqbody.files{font:400 17px var(--term);gap:2px;display:grid}.reqbody.files .dflab{font:700 8px var(--pixel);color:#555;text-transform:uppercase;margin:4px 0 2px}.reqbody.files a,.reqbody.files .song{color:#000;font:400 17px var(--term);text-transform:none;text-align:left;cursor:pointer;background:0 0;border:0;justify-content:space-between;gap:10px;padding:1px 6px;text-decoration:none;display:flex}.reqbody.files small{color:#555;font:inherit}.reqbody.files a:hover,.reqbody.files a:focus-visible,.reqbody.files .song:hover,.reqbody.files .song:focus-visible{color:#fff;background:#05a}.reqbody.files .song.on{color:#fff;background:#000}.reqbody.files .song.on small,.reqbody.files a:hover small,.reqbody.files .song:hover small{color:#cfe0ff}.filereq{z-index:5;background:#a8a8a8;border:2px solid #333;border-color:#fff #333 #333 #fff;width:520px;position:absolute;top:240px;left:50%;transform:translate(-50%);box-shadow:6px 6px #00000080}.filereq .reqtitle{justify-content:space-between;align-items:center;display:flex}.filereq .reqtitle button{padding:1px 6px 1px 12px;font-size:8px}.filereq .reqbody{max-height:300px;padding:6px 8px;overflow:auto}.reqbody.files{max-height:260px;overflow:auto}@media (width<=760px){.about{padding:calc(var(--top) + 24px) 16px calc(var(--tabbar) + 40px)}.words{font-size:17px}.ways ul{grid-template-columns:1fr}.machine{aspect-ratio:auto;max-height:none}.screen{position:relative;inset:auto;overflow:visible}.boot{height:70dvh}.screen .inner{align-content:start;gap:12px;width:auto;height:auto;padding:12px;display:grid;position:relative;top:auto;left:auto;transform:none}.boot .inner{padding:0;display:block;position:absolute;inset:0}.screen .inner{overflow-x:clip}.octamed .screenbar{white-space:normal;flex-wrap:wrap;gap:0 8px}.octamed{grid-template-rows:auto;display:grid}.ctl{grid-template-columns:1fr}.menu-grid{display:none}.posbox{grid-template-columns:36px auto}.posbox .sliders,.ctl-row b:not(.val),.ctl-row>.lab:first-child{display:none}.ctl-row .hint{width:100%;display:block;margin-left:0!important}.pattern{height:280px;font-size:14px;position:relative}.chhead,.pattern .row{grid-template-columns:36px repeat(4,1fr)}.chhead{height:36px}.rows,.vus{top:36px}.vus{left:36px}.chhead .chh{flex-direction:column;align-items:flex-start;gap:2px;padding:2px 4px}.chhead .chh span{font-size:8px}.pattern .row span{padding:0 4px}.scopes canvas{height:44px}.scopes{grid-template-columns:repeat(4,1fr)}.scopes .scopelab{display:none}.requesters{grid-template-columns:1fr}.filereq{width:calc(100% - 32px);position:fixed;top:20%}}@media (prefers-reduced-motion:reduce){.boot .greet:after,.intro h1:after{animation:none}.flash{transition:none}}