:root,:root[data-theme=dark]{--paper:#040404;--panel-a:#040404b8;--panel-b:#080808f0;--ink:#dedbd5;--ink-soft:#dedbd58c;--hair:#dedbd533;--faint:#dedbd517;--fill:#dedbd50f;--note:222, 219, 213;--rec:#d0573f;--logo-filter:invert(1);--grain:.32;--sans:"Inter", "Helvetica Neue", Arial, sans-serif;--jp:"Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Helvetica Neue", sans-serif}:root[data-theme=light]{--paper:#ece8e1;--panel-a:#ece8e1c7;--panel-b:#ece8e1f5;--ink:#2b2a28;--ink-soft:#2b2a289e;--hair:#2b2a2838;--faint:#2b2a281a;--fill:#2b2a280d;--note:43, 42, 40;--rec:#b8402e;--logo-filter:none;--grain:.42}*{box-sizing:border-box}html,body{background:var(--paper);height:100%;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;transition:background .3s;overflow:hidden}canvas{touch-action:none;outline:none;display:block}body>canvas{width:100vw;height:100vh}button,select{font:inherit;color:inherit}.fail{text-align:center;width:100%;font:300 14px var(--sans);position:fixed;top:40%}.ui{pointer-events:none;position:fixed;inset:0}.ui>*{pointer-events:auto}.jp{font-family:var(--jp);letter-spacing:.04em;font-style:normal;font-weight:300}.brand{pointer-events:none;align-items:baseline;gap:10px;display:flex;position:absolute;top:22px;left:28px}.brand b{font:300 15px var(--sans);letter-spacing:.42em}.brand i{font-size:20px}.help{text-align:center;width:min(720px,100vw - 560px);font:300 11px/1.6 var(--sans);letter-spacing:.04em;color:var(--ink-soft);pointer-events:none;position:absolute;top:26px;left:50%;transform:translate(-50%)}@media (max-width:900px){.help{display:none}}.help b{color:var(--ink);font-weight:500}.align{opacity:.75;pointer-events:none;height:13px;filter:var(--logo-filter);position:absolute;top:24px;right:28px}.panel{background:linear-gradient(180deg, var(--panel-a), var(--panel-b) 30%);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-top:1px solid var(--hair);padding:0 24px 14px;position:absolute;bottom:0;left:0;right:0}.panel.recording{border-top-color:var(--rec)}.panel.folded .body{display:none}.bar{align-items:center;gap:8px;height:50px;display:flex}.grow{flex:1}.tabs{gap:2px;display:flex}.tab{cursor:pointer;background:0 0;border:0;border-bottom:1.5px solid #0000;padding:6px 12px}.tab.on{border-bottom-color:var(--ink)}.bi{align-items:baseline;gap:6px;display:inline-flex}.bi .jp{font-size:13px}.bi b{font:400 10px var(--sans);letter-spacing:.18em}.tab:not(.on){opacity:.55}.btn{border:1px solid var(--hair);font:400 10px var(--sans);letter-spacing:.14em;cursor:pointer;white-space:nowrap;background:0 0;border-radius:999px;padding:5px 11px}.btn:hover{border-color:var(--ink-soft)}.btn.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn.big{padding:7px 14px;font-size:11px}.btn.rec.on{background:var(--rec);border-color:var(--rec)}.btn.sq{letter-spacing:0;place-items:center;width:24px;height:24px;padding:0;font-size:13px;display:inline-grid}.btn.mini{padding:3px 8px;font-size:9px}.btn.gen{font-family:var(--jp);font-weight:300}.key{align-items:center;gap:6px;margin-left:6px;display:flex}.key select{border:1px solid var(--hair);background:var(--paper);font:400 10px var(--sans);letter-spacing:.1em;border-radius:999px;padding:4px 8px}.fold{margin-left:6px}.body{height:268px}.page{gap:26px;height:100%;padding-top:8px;display:grid}.page[hidden]{display:none}.layer-page{grid-template-columns:290px 196px 210px 1fr}.fx-page{grid-template-columns:420px 1fr 120px}.col{flex-direction:column;gap:8px;min-width:0;display:flex}h4{font:400 9px var(--sans);letter-spacing:.26em;color:var(--ink-soft);margin:0}.knob{cursor:ns-resize;touch-action:none;outline:none;flex-direction:column;align-items:center;gap:2px;display:inline-flex;position:relative}.knob svg{overflow:visible}.k-track{fill:none;stroke:var(--hair);stroke-width:1px}.k-value{fill:none;stroke:var(--ink);stroke-width:1.4px;stroke-linecap:round}.k-tick{stroke:var(--ink);stroke-width:1.4px;stroke-linecap:round}.k-label{font:400 8.5px var(--sans);letter-spacing:.14em;color:var(--ink-soft);white-space:nowrap}.knob output{font:300 9px var(--sans);color:var(--ink);opacity:0;pointer-events:none;transition:opacity .15s;position:absolute;top:50%;left:50%;transform:translate(-50%,-78%)}.knob:hover output,.knob.active output,.knob:focus-visible output{opacity:1}.knob:focus-visible .k-track{stroke:var(--ink-soft)}.structs{grid-template-columns:repeat(3,1fr);gap:4px;display:grid}.struct,.tex,.rtype{border:1px solid var(--faint);cursor:pointer;text-align:left;background:0 0;border-radius:8px;flex-direction:column;align-items:flex-start;gap:1px;padding:5px 6px;display:flex}.struct .glyph{font:300 10px var(--sans);letter-spacing:.1em;color:var(--ink-soft);height:12px}.struct.on,.tex.on,.rtype.on{border-color:var(--ink);background:var(--fill)}.struct .bi b,.tex .bi b,.rtype .bi b{font-size:8.5px}.struct .bi .jp,.tex .bi .jp,.rtype .bi .jp{font-size:11px}.wave-row{align-items:center;gap:6px;display:flex}.wave-name{font:300 12px var(--sans);letter-spacing:.06em;white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.yin{border:1px solid var(--hair);font:300 10px var(--jp);letter-spacing:.08em;cursor:pointer;background:0 0;border-radius:999px;padding:4px 9px}.yin.on{background:var(--ink);color:var(--paper)}.wave-view{border-top:1px solid var(--faint);border-bottom:1px solid var(--faint);width:100%;height:64px}.textures{flex-direction:column;gap:5px;display:flex}.tex-title{font:400 9px var(--sans);letter-spacing:.26em;color:var(--ink-soft)}.tex-grid{grid-template-columns:repeat(3,1fr);gap:3px;display:grid}.tex{font:400 8.5px var(--sans);letter-spacing:.12em;white-space:nowrap;text-overflow:ellipsis;align-items:center;padding:5px 6px;overflow:hidden}.sample-row{gap:6px;display:flex}.quad{grid-template-columns:1fr 1fr;gap:12px 10px;display:grid}.pair{border-bottom:1px solid var(--faint);flex-direction:column;align-items:center;gap:4px;padding-bottom:4px;display:flex}.mixgrid{grid-template-columns:repeat(3,1fr);justify-items:center;gap:8px 4px;display:grid}.oct{align-items:center;gap:8px;display:flex}.oct-v{font:300 13px var(--sans);text-align:center;width:22px}.voicing{flex-wrap:wrap;gap:4px;display:flex}.seq{flex-direction:column;gap:8px;height:100%;display:flex}.seq-head,.seq-foot{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.seq-sep{width:8px}.seq-len{font:300 10px var(--sans);letter-spacing:.1em;text-align:center;min-width:64px}.seq-grid{flex:1;grid-template-columns:repeat(16,1fr);grid-auto-rows:1fr;gap:3px;min-height:0;display:grid}.cell{border:1px solid var(--faint);cursor:pointer;background:0 0;border-radius:3px;padding:0;position:relative}.cell:nth-child(4n+1){border-left-color:var(--hair)}.cell.note{background:rgba(var(--note), calc(.25 + var(--prob) * .6));border-color:#0000}.cell.lock:after{content:"";background:var(--rec);border-radius:50%;width:4px;height:4px;position:absolute;top:2px;right:2px}.cell.cursor{outline:1.5px solid var(--ink);outline-offset:1px}.cell.now{box-shadow:inset 0 -3px 0 var(--rec)}.cell.out{opacity:.25}.seq-info{font:300 10px var(--sans);letter-spacing:.08em;color:var(--ink-soft);flex:1}.rtypes{grid-template-columns:repeat(3,1fr);gap:4px;display:grid}.row{align-items:flex-end;gap:12px;display:flex}.fxs{grid-template-columns:repeat(3,1fr);gap:10px 18px;display:grid}.fx{opacity:.55;flex-direction:column;gap:6px;display:flex}.fx.on{opacity:1}.fx-on{border:0;border-bottom:1px solid var(--hair);cursor:pointer;text-align:left;background:0 0;padding:0 0 4px}.fx.on .fx-on{border-bottom-color:var(--ink)}.master{align-items:center}.bar{scrollbar-width:none;overflow-x:auto}.body{scrollbar-width:thin;scrollbar-color:var(--hair) transparent;overflow-x:auto}.page{min-width:1180px}.brand i{letter-spacing:.12em;font-size:17px;font-weight:300}body:after{content:"";pointer-events:none;z-index:50;opacity:var(--grain);mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 1.6 -0.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:.9s steps(6,end) infinite grain;position:fixed;inset:-50%}@keyframes grain{0%{transform:translate(0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}to{transform:translate(0)}}@media (prefers-reduced-motion:reduce){body:after{animation:none}}.panel.closed{display:none}.mixer{align-items:flex-end;gap:34px;display:flex;position:absolute;bottom:26px;left:50%;transform:translate(-50%)}.mixer .knob{gap:8px}.mixer .k-track{stroke:var(--hair)}.m-label{flex-direction:column;align-items:center;gap:2px}.m-label .jp{font-size:12px}.m-label b{color:var(--ink-soft);letter-spacing:.2em;font-size:9.5px}.detail{border:1px solid var(--hair);color:var(--ink);font:400 9.5px var(--sans);letter-spacing:.2em;cursor:pointer;background:0 0;border-radius:999px;margin-bottom:18px;padding:7px 12px}.detail:hover{border-color:var(--ink-soft)}.panel:not(.closed)~.mixer{display:none}.theme{border:1px solid var(--hair);width:24px;height:24px;color:var(--ink);cursor:pointer;background:0 0;border-radius:50%;padding:0;font-size:12px;position:absolute;top:18px;right:200px}.help{pointer-events:auto;color:#0000;cursor:help;padding:6px 12px}.help b{color:#0000}.help:before{content:"?";border:1px solid var(--hair);width:18px;height:18px;font:300 11px/18px var(--sans);color:var(--ink-soft);text-align:center;border-radius:50%;transition:opacity .2s;position:absolute;top:2px;left:50%;transform:translate(-50%)}.help,.help b{transition:color .2s}.help:hover{color:var(--ink-soft)}.help:hover b{color:var(--ink)}.help:hover:before{opacity:0}.in-plugin .sample-row{display:none}