:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ps-bg:#000;--ps-bg-panel:#090c11db;--ps-bg-elevated:#ffffff0d;--ps-text:#f5f7fb;--ps-text-muted:#929aaa;--ps-border:#ffffff1a;--ps-border-bright:#ffffff30;--ps-accent:#d7f6ff;--ps-accent-dim:#d7f6ff1f;--ps-ice:#d7f6ff;--ps-melody:#fff;--ps-bass:#fff;--ps-percussion:#fff;--ps-bpm-roll-glow-strong:#cdf0ffcc;--ps-bpm-roll-glow-soft:#cdf0ff52;--ps-font:"Chakra Petch", system-ui, sans-serif;--ps-z-canvas:1;--ps-z-labels:10;--ps-z-toolbar:100;--ps-z-backdrop:150;--ps-z-menu:200;--ps-glass:linear-gradient(145deg, #ffffff17, #ffffff08);--ps-panel-shadow:0 24px 80px #00000094, inset 0 1px 0 #ffffff14;--ds-background:var(--ps-bg);--ds-surface:var(--ps-bg-elevated);--ds-foreground:var(--ps-text);--ds-muted:var(--ps-text-muted);--ds-primary:var(--ps-accent);--ds-primary-foreground:#031014;--ds-border:var(--ps-border-bright);--ds-ring:#dffaff;--ds-font-ui:var(--ps-font);--ds-overlay:#00000075;--ds-radius:.8125rem;--ds-duration-fast:.15s;--ds-duration-normal:.3s}*,:before,:after{box-sizing:border-box}html,body,#pulsar-root{width:100%;height:100%;margin:0}html{background:var(--ps-bg);font-family:var(--ps-font)}body{color:var(--ps-text);-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased;background:#000;overflow:hidden}button,input,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline-offset:3px;outline:2px solid #dffaff}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}[hidden]{display:none!important}#pulsar-root{isolation:isolate;flex-direction:column;flex:1;min-height:0;display:flex}.grid-container{flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.grid-wrapper{flex:1;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:relative;overflow:visible}.grid-wrapper:after{z-index:calc(var(--ps-z-canvas) + 1);width:var(--ps-grid-width,0px);height:var(--ps-grid-height,0px);content:"";opacity:.42;pointer-events:none;mix-blend-mode:soft-light;background-image:radial-gradient(#0000 52%,#00000047 100%),repeating-linear-gradient(0deg,#ffffff04 0 1px,#0000000b 1px 3px),url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");background-size:100% 100%,100% 3px,140px 140px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#grid-canvas{z-index:var(--ps-z-canvas);filter:saturate(1.08)contrast(1.05);touch-action:none;display:block}.family-labels{inset:0 auto 0 max(8px, env(safe-area-inset-left));z-index:var(--ps-z-labels);pointer-events:none;display:none;position:absolute}.family-labels.is-visible{display:block}.grid-label{color:#ffffff7a;letter-spacing:.12em;text-transform:uppercase;writing-mode:vertical-rl;font-size:.65rem;position:absolute;left:0;transform:translateY(-50%)}.grid-label[data-section=melody]{top:30%}.grid-label[data-section=bass]{top:65%}.grid-label[data-section=drums]{top:85%}.control-safe-area{z-index:var(--ps-z-toolbar);min-height:76px;padding:10px max(8px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));pointer-events:none;flex:none;display:block;position:relative}.control-safe-area__row{grid-template-columns:minmax(64px,1fr) auto minmax(64px,1fr);align-items:center;display:grid}.control-safe-area:before{z-index:-1;content:"";background:linear-gradient(transparent, #000000bf 48%, var(--ps-bg));pointer-events:none;position:absolute;inset:-36px 0 0}.control-safe-area__utilities{pointer-events:auto;align-items:center;gap:5px;display:flex}.control-safe-area__utilities--end{justify-content:flex-end}.transport-cluster,.field-navigation,.utility-button{border:1px solid var(--ps-border-bright);background:var(--ps-glass);-webkit-backdrop-filter:blur(24px)saturate(145%);backdrop-filter:blur(24px)saturate(145%);box-shadow:inset 0 1px #ffffff14,0 12px 34px #0000006b}.transport-cluster{pointer-events:auto;border-radius:16px;grid-template-columns:48px minmax(60px,auto) 48px;align-items:stretch;min-height:50px;display:grid;overflow:hidden}.transport-button{cursor:pointer;background:0 0;border:0;place-items:center;min-width:48px;min-height:48px;padding:0;display:grid}.transport-button .material-symbols-rounded{color:#fff;font-size:27px}.transport-button--play .material-symbols-rounded{font-size:32px}.transport-button--freeze.is-active .material-symbols-rounded{color:var(--ps-ice);text-shadow:0 0 9px #bef0ffe6,0 0 22px #64cdff8c}.tempo-readout{border-inline:1px solid var(--ps-border);color:#fff;cursor:pointer;font-variant-numeric:tabular-nums;background:0 0;border-block:0;flex-direction:column;justify-content:center;align-items:center;min-width:74px;line-height:1;display:flex}.tempo-readout__value-window{place-items:center;min-width:3ch;height:1.1rem;display:grid;overflow:hidden}.tempo-readout__value-window>span{letter-spacing:.03em;font-size:1.05rem;font-weight:600}.tempo-readout__value-window>.has-roll-animation{animation:.28s cubic-bezier(.16,1,.3,1) both bpm-roll-in}@keyframes bpm-roll-in{0%{opacity:0;filter:blur(3px);text-shadow:0 0 12px var(--ps-bpm-roll-glow-strong);transform:translateY(70%)}68%{opacity:1;filter:blur();text-shadow:0 0 5px var(--ps-bpm-roll-glow-soft);transform:translateY(-6%)}to{opacity:1;filter:blur();text-shadow:none;transform:translateY(0)}}.tempo-readout__unit{color:var(--ps-text-muted);letter-spacing:.16em;margin-top:4px;font-size:.55rem;font-weight:600}.utility-button{cursor:pointer;border-radius:14px;place-items:center;min-width:44px;min-height:44px;padding:0 9px;display:inline-grid}#wtf-btn,#menu-btn{width:66px}.utility-button .material-symbols-rounded{color:#fff;font-size:23px}.utility-button--text{letter-spacing:.08em;font-size:.75rem;font-weight:650}.utility-button:active,.field-navigation__button:active,.transport-button:active,.panel-close:active{transform:scale(.96)}.field-navigation{z-index:var(--ps-z-labels);pointer-events:auto;border-radius:15px;align-items:center;min-height:52px;display:flex;position:absolute;bottom:calc(100% + 2px);left:50%;overflow:hidden;transform:translate(-50%)}.field-navigation__map{background:var(--ps-bg);border-radius:0;align-self:stretch;margin:0;padding:6px 8px;display:flex}.minimap{background:0 0;border:0;border-radius:0;display:none}.minimap.is-visible{display:block}.field-navigation__button{border:0;border-left:1px solid var(--ps-border);color:#fff;cursor:pointer;background:0 0;align-self:stretch;place-items:center;min-width:48px;min-height:52px;padding:0;display:grid}.field-navigation__button--text{letter-spacing:.08em;width:58px;min-width:58px;padding-inline:0;font-size:.75rem;font-weight:650}.field-navigation__button .material-symbols-rounded{font-size:22px}.menu-backdrop{z-index:var(--ps-z-backdrop);opacity:1;background:#00000061;transition:opacity .18s;position:fixed;inset:0}.menu-backdrop[data-starting-style],.menu-backdrop[data-ending-style]{opacity:0}.menu-positioner{z-index:var(--ps-z-menu)}.menu-positioner--mobile{width:100%;position:fixed!important;inset:auto 0 0!important;transform:none!important}.menu-panel,.wtf-modal{color:var(--ps-text);border:1px solid var(--ps-border-bright);background:var(--ps-bg-panel);box-shadow:var(--ps-panel-shadow);-webkit-backdrop-filter:blur(26px)saturate(150%);backdrop-filter:blur(26px)saturate(150%)}.menu-panel{opacity:1;transform-origin:bottom;border-width:1px 0 0;border-radius:26px 26px 0 0;width:100%;max-height:min(78dvh,720px);transition:opacity .18s,transform .18s;overflow:hidden}.menu-panel[data-starting-style],.menu-panel[data-ending-style]{opacity:0;transform:translateY(100%)}.panel-header{z-index:2;border-bottom:1px solid var(--ps-border);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#0a0d12b8;justify-content:space-between;align-items:center;padding:18px 18px 14px 20px;display:flex;position:sticky;top:0}.panel-header h2{letter-spacing:.01em;margin:2px 0 0;font-size:1.05rem;font-weight:600}.panel-header__eyebrow,.menu-section h3,.wtf-section h3{color:var(--ps-text-muted);letter-spacing:.17em;text-transform:uppercase;font-size:.62rem;font-weight:650}.panel-close{cursor:pointer;background:#ffffff0a;border:1px solid #0000;border-radius:13px;place-items:center;width:44px;height:44px;padding:0;display:grid}.panel-close .material-symbols-rounded{font-size:22px}.menu-panel__content{overscroll-behavior:contain;max-height:calc(min(78dvh,720px) - 77px);padding-bottom:max(12px, env(safe-area-inset-bottom));overflow:auto}.menu-section{border-bottom:1px solid var(--ps-border);padding:17px 20px 19px}.menu-section:last-child{border-bottom:0}.menu-section h3,.wtf-section h3{margin:0 0 14px}.setting-field+.setting-switch,.setting-switch+.setting-switch{margin-top:4px}.setting-field__label{display:block}.setting-field__label,.tempo-control__label{color:#d9dee8;margin-bottom:9px;font-size:.77rem}.pattern-utilities{grid-template-columns:1fr 1fr;gap:8px;display:grid}.pattern-utilities button{border:1px solid var(--ps-border);background:var(--ps-bg-elevated);cursor:pointer;border-radius:13px;justify-content:center;align-items:center;gap:7px;min-height:46px;display:flex}.pattern-utilities .material-symbols-rounded{font-size:18px}.tempo-control{margin-bottom:17px;display:block}.tempo-control__label{justify-content:space-between;align-items:baseline;display:flex}.tempo-control__label output{color:var(--ps-text-muted);font-variant-numeric:tabular-nums}.bpm-slider{display:block;position:relative}.tempo-control input{width:100%;accent-color:var(--ps-accent)}.segment-control{border:1px solid var(--ps-border);background:#00000038;border-radius:13px;grid-template-columns:repeat(3,1fr);padding:3px;display:grid}.segment-control button{min-height:44px;color:var(--ps-text-muted);cursor:pointer;background:0 0;border:0;border-radius:9px}.segment-control button.is-active,.segment-control button[data-pressed]{color:#fff;background:#ffffff17;box-shadow:inset 0 1px #ffffff14}.step-count-control{overscroll-behavior-x:contain;scrollbar-width:none;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;background:0 0;border:0;flex-direction:row;justify-content:flex-start;align-items:center;gap:12px;max-width:100%;margin-bottom:12px;padding:4px 10px;display:flex;overflow-x:auto}.step-count-control::-webkit-scrollbar{display:none}.step-count-btn{width:calc(var(--step-columns) * 5px - 2px);cursor:pointer;scroll-snap-align:center;background:0 0;border:0;border-radius:8px;flex:none;place-items:center;min-width:24px;min-height:44px;padding:0;display:grid;position:relative}.step-count-btn.is-active,.step-count-btn[data-pressed]{background:0 0}.step-length-dots{grid-template-columns:repeat(var(--step-columns), 3px);gap:2px;display:grid}.step-length-dots>span{background:#ffffff1a;border-radius:50%;width:3px;height:3px}.step-length-dots>span.is-number{background:#ffffffb8;transform:translate(2.5px);box-shadow:0 0 3px #ffffff52}.step-count-btn.is-active .step-length-dots>span,.step-count-btn[data-pressed] .step-length-dots>span{background:#d7f6ff33}.step-count-btn.is-active .step-length-dots>span.is-number,.step-count-btn[data-pressed] .step-length-dots>span.is-number{background:var(--ps-accent);box-shadow:0 0 4px var(--ps-accent)}.setting-switch{cursor:pointer;grid-template-columns:1fr auto;align-items:center;gap:14px;min-height:52px;display:grid;position:relative}.setting-switch strong,.setting-switch small{display:block}.setting-switch strong{font-size:.78rem;font-weight:500}.setting-switch small{color:var(--ps-text-muted);margin-top:2px;font-size:.65rem}.setting-switch>button{justify-self:end}.palette-control{justify-content:center;align-items:center;gap:18px;margin-bottom:9px;display:flex}.palette-swatch{width:72px;min-height:50px;color:var(--ps-text-muted);cursor:pointer;background:0 0;border:0;border-radius:8px;grid-template-rows:auto auto 5px;place-items:center;padding:3px 0;font-size:.64rem;display:grid}.palette-swatch.is-active,.palette-swatch[data-pressed]{color:#fff;background:0 0;font-weight:650}.palette-swatch:after{content:"";background:0 0;border-radius:50%;width:4px;height:4px;margin-top:2px}.palette-swatch.is-active:after,.palette-swatch[data-pressed]:after{background:#fff;box-shadow:0 0 7px #d7f6ffe6}.palette-swatch__colors{grid-template-rows:repeat(3,4px);gap:4px;width:64px;height:20px;margin-bottom:3px;display:grid}.palette-swatch__colors i{border-radius:999px;display:block}.palette-swatch__colors i:first-child{background:linear-gradient(90deg, var(--swatch-melody-start), var(--swatch-melody-end));box-shadow:0 0 8px var(--swatch-melody-start)}.palette-swatch__colors i:nth-child(2){background:linear-gradient(90deg, var(--swatch-bass-start), var(--swatch-bass-end));box-shadow:0 0 8px var(--swatch-bass-start)}.palette-swatch__colors i:nth-child(3){background:linear-gradient(90deg, var(--swatch-percussion-start), var(--swatch-percussion-end));box-shadow:0 0 8px var(--swatch-percussion-start)}.palette-swatch.is-active .palette-swatch__colors,.palette-swatch[data-pressed] .palette-swatch__colors{filter:saturate(1.18)brightness(1.08)}.wtf-modal{border-radius:26px;width:min(680px,100vw - 28px);max-height:min(760px,100dvh - 28px);padding:0;overflow:hidden}.wtf-backdrop{z-index:var(--ps-z-backdrop);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:1;background:#00000075;transition:opacity .18s;position:fixed;inset:0}.wtf-backdrop[data-starting-style],.wtf-backdrop[data-ending-style]{opacity:0}.wtf-modal{z-index:var(--ps-z-menu);transition:opacity .18s,scale .18s;position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.wtf-modal[data-starting-style],.wtf-modal[data-ending-style]{opacity:0;scale:.985}.wtf-modal__content{overscroll-behavior:contain;max-height:calc(min(760px,100dvh - 28px) - 78px);padding:18px;overflow:auto}.wtf-lede{color:#c9cfda;max-width:55ch;margin:0 0 23px;font-size:.88rem;line-height:1.55}.wtf-lede a{color:#e7f8ff;text-underline-offset:3px;text-decoration-color:#beebff9e;text-decoration-thickness:1px}.wtf-section+.wtf-section{margin-top:26px}.wtf-rules{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.live-rule-example{border:1px solid var(--ps-border);text-align:center;background:#ffffff08;border-radius:15px;min-width:0;margin:0;padding:12px 7px 10px}.live-rule-example__stage{width:58px;height:58px;margin:0 auto 9px;display:block;position:relative}.rule-grid{grid-template-columns:repeat(3,18px);gap:2px;display:grid;position:absolute;inset:0}.rule-grid--before{animation:4s step-end infinite rule-before}.rule-grid--after{animation:4s step-end infinite rule-after}.step-cell{border:1px solid var(--step-socket-edge);background:linear-gradient(180deg, var(--step-socket-fill-top), var(--step-socket-fill-bottom));box-shadow:inset 0 1px 3px var(--step-socket-inset);border-radius:4px}.step-cell.is-alive{color:var(--ps-melody);border-color:var(--ps-melody);background:var(--ps-melody);box-shadow:0 0 6px var(--ps-melody), 0 0 14px var(--ps-melody);transform:scale(var(--step-core-ratio))}.step-cell.is-center{outline-offset:-2px;outline:1px solid #ffffff61}.live-rule-example figcaption{color:var(--ps-text-muted);font-size:.62rem;line-height:1.25}.live-sound-example{aspect-ratio:2.55;grid-template-columns:repeat(var(--step-preview-columns), 1fr);gap:var(--step-preview-gap);width:min(100%,480px);padding:var(--step-preview-padding);border:1px solid var(--ps-border);background:#00000047;border-radius:16px;grid-template-rows:repeat(3,1fr);margin-inline:auto;display:grid;position:relative;overflow:hidden}.step-cell--sound.is-alive{z-index:3;animation:4.8s step-end infinite sound-trigger-flare;animation-delay:calc(var(--sound-column,0) * .6s);position:relative}.step-cell--bass.is-alive{color:var(--ps-bass);background:var(--ps-bass);border-color:var(--ps-bass);box-shadow:0 0 10px var(--ps-bass)}.step-cell--percussion.is-alive{color:var(--ps-percussion);background:var(--ps-percussion);border-color:var(--ps-percussion);box-shadow:0 0 10px var(--ps-percussion)}.live-sound-example__playhead{top:var(--step-preview-padding);bottom:var(--step-preview-padding);left:var(--step-preview-padding);z-index:2;width:var(--step-preview-column-width);gap:var(--step-preview-gap);pointer-events:none;grid-template-rows:repeat(3,1fr);animation:4.8s steps(8,end) infinite scan-example;display:grid;position:absolute}.live-sound-example__playhead>span{background:var(--step-playhead-fill);border-radius:4px}.wtf-section>p:last-child{color:var(--ps-text-muted);margin:10px 0 0;font-size:.7rem}@keyframes rule-before{0%,49.99%{opacity:1}50%,to{opacity:0}}@keyframes rule-after{0%,49.99%{opacity:0}50%,to{opacity:1}}@keyframes scan-example{0%{transform:translate(0)}to{transform:translateX(var(--step-preview-scan-translate))}}@keyframes sound-trigger-flare{0%,12%{filter:brightness(1.75);transform:scale(.78);box-shadow:0 0 9px,0 0 18px}13%,to{filter:brightness();transform:scale(var(--step-core-ratio))}}@media (width>=640px){.control-safe-area{min-height:78px;padding-inline:max(14px, env(safe-area-inset-left)) max(14px, env(safe-area-inset-right))}.control-safe-area__utilities{gap:8px}.transport-cluster{border-radius:18px;grid-template-columns:54px minmax(70px,auto) 54px;min-height:54px}.utility-button{border-radius:15px;min-width:48px;min-height:48px;padding-inline:14px}.menu-panel{transform-origin:100% 100%;border-width:1px;border-radius:24px;width:min(380px,100vw - 36px);max-height:min(720px,100dvh - 106px)}.menu-panel[data-starting-style],.menu-panel[data-ending-style]{transform:translateY(10px)scale(.985)}.menu-panel__content{max-height:calc(min(720px,100dvh - 106px) - 77px);padding-bottom:8px}.wtf-rules{grid-template-columns:repeat(4,1fr)}.wtf-modal__content{padding:20px}.menu-backdrop{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.rule-grid--before{display:none}.rule-grid--after{opacity:1}.live-sound-example__playhead{animation:none;left:50%;transform:none}.sound-cell.is-alive{filter:none;animation:none;transform:scale(.66)}}@supports ((-webkit-backdrop-filter:blur(1px))){.transport-cluster,.field-navigation{-webkit-backdrop-filter:blur(24px)saturate(145%)}.menu-panel,.wtf-modal{-webkit-backdrop-filter:blur(26px)saturate(150%)}}
