:root{--bg:#0a0a0e;--ink:#e9e7f1;--muted:#807d8e;--line:#25232f;--tint:#121119;--accent:#a996ff;--hot:#dcff5e;--display:"Syne",system-ui,sans-serif;--mono:"Martian Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;--sans:"Instrument Sans",system-ui,-apple-system,sans-serif;--deck-1:#022c22;--deck-2:#007a67;--deck-3:#1dcab3;--deck-4:#ecfdf5;color-scheme:dark}.deck-cell-1{background-color:var(--deck-1)}.deck-cell-2{background-color:var(--deck-2)}.deck-cell-3{background-color:var(--deck-3)}.deck-cell-4{background-color:var(--deck-4)}.deck-play{color:var(--deck-2)}.loop-btn{color:var(--deck-2);opacity:.55;padding:8px;transition:opacity .2s,color .2s;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.loop-btn svg{width:.8em;height:.8em;display:block}.loop-btn:hover{opacity:1}.loop-btn[aria-pressed=true]{color:var(--deck-3);opacity:1}.loop-btn:focus-visible{outline:1px solid var(--hot);outline-offset:3px}.label,.label-btn,.btn,.section-title,.field>span,.panel-head,.notice .eyebrow{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-size:.62rem;font-weight:400}.label b,.section-title b{color:var(--ink);font-weight:400}.panel :focus-visible,.notice :focus-visible{outline:1px solid var(--hot);outline-offset:3px}.panel ::selection,.notice ::selection{background:var(--accent);color:var(--bg)}.icon-btn{z-index:20;border:1px solid var(--line);background:var(--bg);border-radius:999px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:36px;height:36px;transition:border-color .2s;display:flex;position:fixed;top:14px}.icon-btn.settings{left:14px}.icon-btn.info{gap:2px;right:14px}.icon-btn:hover,.icon-btn[aria-expanded=true]{border-color:var(--accent)}.icon-btn:focus-visible{outline:1px solid var(--hot);outline-offset:3px}.icon-btn.settings:before,.icon-btn.settings:after{content:"";background:radial-gradient(circle at var(--knob)2.5px,var(--ink)0 1.9px,transparent 2.4px),linear-gradient(var(--muted),var(--muted))center/100% 1px no-repeat;width:15px;height:5px}.icon-btn.settings:before{--knob:4px}.icon-btn.settings:after{--knob:11px}.icon-btn.info:before{content:"";background:var(--accent);border-radius:999px;width:3px;height:3px}.icon-btn.info:after{content:"";background:var(--ink);width:1px;height:9px}.wordmark{font-family:var(--display);letter-spacing:-.02em;text-transform:none;color:var(--ink);align-items:center;gap:9px;font-size:1.05rem;font-weight:700;line-height:1;display:flex}.wordmark:before{content:"";border:1px solid var(--ink);background:radial-gradient(circle at 8px 11.8px,transparent 0 3.4px,var(--accent)3.9px 4.5px,transparent 5px),radial-gradient(circle at 8px 10.2px,transparent 0 5px,var(--ink)5.5px 6.1px,transparent 6.6px);border-radius:999px;width:18px;height:18px}.label-btn{border-bottom:1px solid #0000;padding:9px 0 7px;transition:color .2s,border-color .2s}.label-btn:hover,.label-btn[aria-expanded=true]{color:var(--ink)}.label-btn[aria-expanded=true]{border-bottom-color:var(--accent)}.panel{z-index:30;overscroll-behavior:contain;background:var(--bg);width:min(420px,100vw);color:var(--ink);font-family:var(--sans);counter-reset:section;font-size:.92rem;line-height:1.6;transition:transform .3s,visibility .3s;position:fixed;top:0;bottom:0;overflow-y:auto}.panel.left{border-right:1px solid var(--line);left:0;transform:translate(-100%)}.panel.right{border-left:1px solid var(--line);right:0;transform:translate(100%)}.panel[aria-hidden=true]{visibility:hidden}.panel[aria-hidden=false]{transform:none}.panel-head{z-index:1;background:var(--bg);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:10px 20px;display:flex;position:sticky;top:0}.panel-head .label-btn{color:var(--ink)}.panel-head .label-btn:hover{color:var(--accent)}.panel-intro{padding:30px 20px 28px}.panel-intro h2{font-family:var(--display);letter-spacing:-.035em;font-size:1.75rem;font-weight:500;line-height:1.05}.panel-intro h2 em{color:var(--accent);font-style:normal}.panel a.dest{font-family:var(--mono);letter-spacing:.04em;color:var(--accent);font-size:.66rem;text-decoration:none}.panel a.dest:hover{color:var(--hot)}.panel-intro a.dest{margin-bottom:16px;display:inline-block}.panel-foot{border-top:1px solid var(--line);font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);justify-content:space-between;align-items:center;gap:16px;padding:20px 20px 28px;font-size:.62rem;display:flex}.panel-foot a.dest{text-transform:none}.panel-intro p{color:var(--muted);margin-top:14px}.panel section{border-top:1px solid var(--line);counter-increment:section;padding:20px 20px 28px}.section-title{justify-content:space-between;margin-bottom:16px;display:flex}.section-title:after{content:counter(section,decimal-leading-zero)}.panel p{max-width:44ch}.panel .hint{color:var(--muted);margin:0 0 14px;font-size:.84rem}.panel .hint.after{margin:12px 0 0}.panel .hint strong,.panel li strong,.panel-intro p strong,.notice p strong{color:var(--ink);font-weight:500}.panel a,.notice a{color:inherit;text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:.22em;text-decoration-thickness:1px;transition:color .2s}.panel a:hover{color:var(--accent)}.panel ol{color:var(--muted);margin:0;padding-left:1.4em;font-size:.88rem;list-style:decimal-leading-zero}.panel ol li{margin-top:8px;padding-left:4px}.panel ol li::marker{font-family:var(--mono);color:var(--accent);font-size:.62rem}.panel kbd{font-family:var(--mono);color:var(--accent);font-size:.66rem}.field{grid-template-columns:96px minmax(0,1fr);align-items:center;gap:12px;margin-top:10px;display:grid}.field.stack{grid-template-columns:minmax(0,1fr)}.control{border:1px solid var(--line);background-color:var(--bg);width:100%;min-width:0;color:var(--ink);font-family:var(--mono);border-radius:0;padding:9px 10px;font-size:.68rem;line-height:1.4;transition:border-color .2s}.control:hover{border-color:var(--muted)}.control:disabled{opacity:.45}.control[readonly]{color:var(--muted)}select.control{appearance:none;text-overflow:ellipsis;background-image:linear-gradient(45deg,transparent 50%,var(--muted)50%),linear-gradient(135deg,var(--muted)50%,transparent 50%);background-position:calc(100% - 16px),calc(100% - 11px);background-repeat:no-repeat;background-size:5px 5px;padding-right:30px}.control.cell{text-align:center;width:46px;padding:9px 4px}.panel input[type=range]{width:100%;accent-color:var(--accent);margin-top:14px}.notes-row{align-items:center;gap:8px;margin-top:10px;display:flex}.notes-row .label{margin:0 2px}.panel .rule{border:0;border-top:1px solid var(--line);margin:16px 0 6px}.btn-row{flex-wrap:wrap;gap:10px;margin-top:14px;display:flex}.btn{border:1px solid var(--ink);color:var(--ink);cursor:pointer;border-radius:999px;padding:9px 15px;transition:background-color .2s,border-color .2s,color .2s;display:inline-block}.btn:hover{background:var(--tint)}.btn.quiet{border-color:var(--line);color:var(--muted)}.btn.quiet:hover{border-color:var(--accent);color:var(--ink)}.btn:disabled{opacity:.45;cursor:default}.switch{text-align:left;justify-content:space-between;align-items:center;gap:16px;width:100%;margin-top:18px;display:flex}.switch .track{border:1px solid var(--ink);border-radius:999px;flex:none;width:34px;height:18px;transition:background-color .2s,border-color .2s;position:relative}.switch .track:after{content:"";background:var(--muted);border-radius:999px;width:10px;height:10px;transition:transform .2s,background-color .2s;position:absolute;top:3px;left:3px}.switch[aria-checked=true] .track{background:var(--hot);border-color:var(--hot)}.switch[aria-checked=true] .track:after{background:var(--bg);transform:translate(16px)}.switch[aria-checked=true] .label{color:var(--ink)}.swatches{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.swatch,.swatches input[type=color]{border:1px solid var(--line);background:var(--swatch,transparent);cursor:pointer;border-radius:999px;width:22px;height:22px;padding:0;overflow:hidden}.swatch[aria-pressed=true],.swatches input[type=color][data-current=true]{outline:1px solid var(--ink);outline-offset:3px}.swatches input[type=color]{appearance:none}.swatches input[type=color]::-webkit-color-swatch-wrapper{padding:0}.swatches input[type=color]::-webkit-color-swatch{border:0}.swatches input[type=color]::-moz-color-swatch{border:0}.swatches .custom{align-items:center;gap:8px;display:flex}.shades{border:1px solid var(--line);grid-template-columns:repeat(4,1fr);height:14px;margin-top:18px;display:grid}.sample-list{border-top:1px solid var(--line);margin:16px 0 0}.sample-list li{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:9px 0;display:flex}.sample-list .shade{border:1px solid var(--line);flex:none;width:12px;height:12px}.sample-list .name.empty{color:var(--muted)}.btn[aria-pressed=true]{border-color:var(--hot);color:var(--ink)}.sample-list .name{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-family:var(--mono);color:var(--accent);flex:1;font-size:.68rem;overflow:hidden}.sample-list .label-btn{padding:4px 0}.sample-list .label-btn:hover{color:var(--hot)}.notice{z-index:25;border:1px solid var(--line);background:var(--bg);width:min(500px,100vw - 24px);color:var(--ink);font-family:var(--sans);padding:16px 18px 18px;animation:.3s ease-out notice-in;position:fixed;top:14px;left:50%;transform:translate(-50%)}.notice .eyebrow{justify-content:space-between;align-items:center;display:flex}.notice .eyebrow span{align-items:center;gap:9px;display:flex}.notice .eyebrow span:before{content:"";background:var(--accent);border-radius:999px;width:7px;height:7px}.notice h2{font-family:var(--display);letter-spacing:-.035em;margin-top:12px;font-size:1.3rem;font-weight:500;line-height:1.1}.notice h2 em{color:var(--accent);font-style:normal}.notice p{color:var(--muted);margin-top:10px;font-size:.86rem;line-height:1.55}@keyframes notice-in{0%{opacity:0}}@media (width<=640px){.notice{top:62px}}@media (width<=480px){.panel{border-left:0;border-right:0}.field{grid-template-columns:84px minmax(0,1fr)}.notes-row{gap:6px}}@media (prefers-reduced-motion:reduce){.panel,.icon-btn,.loop-btn,.label-btn,.btn,.control,.switch .track,.switch .track:after,.panel a{transition:none}.notice{animation:none}}
/*# sourceMappingURL=path0.842b92f9.css.map */
