:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#b8935a;--accent-contrast:#000;--accent-bg:color-mix(in srgb, var(--accent) 12%, transparent);--accent-border:color-mix(in srgb, var(--accent) 45%, transparent);--social-bg:#f4f3ec80;--shadow:#0000001a 0 .5556rem .8333rem -.1667rem, #0000000d 0 .2222rem .3333rem -.1111rem;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:1.125rem/145% var(--sans);letter-spacing:.01rem;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:1rem}}@media (width<=640px){:root{font-size:1.25rem}}@media (width>=1440px){:root{font-size:1.25rem}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--social-bg:#2f303a80;--shadow:#0006 0 .5556rem .8333rem -.1667rem, #00000040 0 .2222rem .3333rem -.1111rem}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme]){--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--social-bg:#2f303a80;--shadow:#0006 0 .5556rem .8333rem -.1667rem, #00000040 0 .2222rem .3333rem -.1111rem}}:root[data-theme=dark] #social .button-icon{filter:invert()brightness(2)}@media (prefers-color-scheme:dark){:root:not([data-theme]) #social .button-icon{filter:invert()brightness(2)}}#root{text-align:center;border-inline:.0556rem solid var(--border);box-sizing:border-box;flex-direction:column;width:62.5556rem;max-width:100%;min-height:100svh;margin:0 auto;display:flex}.app-brand{padding:calc(.7778rem + env(safe-area-inset-top,0px)) 3.3333rem .4444rem;font-family:var(--heading);letter-spacing:.01em;color:var(--text-h);justify-content:center;align-items:center;gap:.4444rem;font-size:1.1667rem;font-weight:600;display:flex}.app-brand svg{flex-shrink:0;width:1.4444rem;height:1.4444rem;display:block}@media (width<=640px){.app-brand{display:none}}body{margin:0}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-.0933rem;margin:1.7778rem 0;font-size:3.1111rem}@media (width<=1024px){h1{margin:1.1111rem 0;font-size:2rem}}h2{letter-spacing:-.0133rem;margin:0 0 .4444rem;font-size:1.3333rem;line-height:118%}@media (width<=1024px){h2{font-size:1.1111rem}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:.2222rem;display:inline-flex}code{background:var(--code-bg);padding:.2222rem .4444rem;font-size:.8333rem;line-height:135%}input,textarea{-webkit-user-select:text;user-select:text}.settings-backdrop{z-index:40;background:#00000073;justify-content:center;align-items:center;padding:.8889rem;display:flex;position:fixed;inset:0}.settings-modal{z-index:41;box-sizing:border-box;background:var(--bg);border:.0556rem solid var(--border);width:20rem;max-width:100%;box-shadow:var(--shadow);text-align:left;border-radius:.7778rem;flex-direction:column;gap:1.1111rem;padding:1.5556rem 1.3333rem 1.3333rem;display:flex;position:relative}.settings-close{color:var(--text);cursor:pointer;background:0 0;border:none;font-size:1.2222rem;line-height:1;position:absolute;top:.4444rem;right:.5556rem}.settings-title{margin:0}.setting-group{flex-direction:column;gap:.4444rem;display:flex}.setting-label{color:var(--text-h);font-size:.8333rem;font-weight:500}.option-stack{flex-direction:column;gap:.3333rem;display:flex}.option-stack .option{box-sizing:border-box;border:.0556rem solid var(--border);background:var(--bg);width:100%;color:var(--text);text-align:left;cursor:pointer;border-radius:.4444rem;align-items:center;padding:.5rem .7778rem;font-size:.8333rem;transition:background .15s,color .15s,border-color .15s;display:flex}.option-stack .option:hover{border-color:var(--accent-border);color:var(--accent)}.option-stack .option[aria-checked=true]{border-color:var(--accent-border);background:var(--accent-bg);color:var(--accent);font-weight:500}.option-check{margin-left:auto;padding-left:.5rem}.accent-picker{align-items:center;gap:.5556rem;display:flex}.accent-swatch{border:.0556rem solid var(--border);cursor:pointer;background:0 0;border-radius:.4444rem;width:2.2rem;height:2.2rem;padding:0}.accent-value{font-family:var(--mono);color:var(--text);font-size:.7778rem}.accent-reset{border:.0556rem solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;border-radius:.4444rem;margin-left:auto;padding:.2778rem .5556rem;font-size:.7222rem}.accent-reset:hover{border-color:var(--accent-border);color:var(--accent)}.menu-toggle{top:calc(1.1111rem + env(safe-area-inset-top,0px));z-index:30;border:.0556rem solid var(--border);background:var(--bg);width:2.4444rem;height:2.4444rem;color:var(--text-h);cursor:pointer;border-radius:.5556rem;justify-content:center;align-items:center;font-size:1.2222rem;transition:border-color .15s,color .15s;display:inline-flex;position:fixed;left:.8889rem}.menu-toggle:hover{border-color:var(--accent-border);color:var(--accent)}.menu-icon{width:1.2222rem;height:.8889rem;display:block;position:relative}.menu-icon span{background:currentColor;border-radius:.0556rem;width:100%;height:.1111rem;transition:top .25s,transform .25s,opacity .2s;position:absolute;left:0}.menu-icon span:first-child{top:0}.menu-icon span:nth-child(2){top:.3889rem}.menu-icon span:nth-child(3){top:.7778rem}.menu-toggle[aria-expanded=true] .menu-icon span:first-child{top:.3889rem;transform:rotate(45deg)}.menu-toggle[aria-expanded=true] .menu-icon span:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] .menu-icon span:nth-child(3){top:.3889rem;transform:rotate(-45deg)}.sidebar-backdrop{z-index:20;background:#00000059;position:fixed;inset:0}.sidebar{z-index:25;background:var(--bg);border-right:.0556rem solid var(--border);width:18.8889rem;max-width:90vw;height:100dvh;box-shadow:var(--shadow);transition:transform .2s;position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-content{box-sizing:border-box;height:100%;padding:calc(4.5rem + env(safe-area-inset-top,0px)) .8889rem calc(.8889rem + env(safe-area-inset-bottom,0px));flex-direction:column;display:flex;overflow-y:auto}.sidebar-resize{cursor:ew-resize;touch-action:none;pointer-events:none;width:.4444rem;height:100%;position:absolute;top:0;right:0}.sidebar.open .sidebar-resize{pointer-events:auto}.sidebar-resize:hover{background:var(--accent-bg)}.presets{flex-direction:column;flex:1;gap:.6667rem;width:100%;margin:0;display:flex}.presets h2{text-align:center}.preset-save{gap:.4444rem;display:flex}.preset-label-input{border:.0556rem solid var(--border);background:var(--bg);min-width:0;color:var(--text-h);border-radius:.4444rem;flex:1;padding:.4444rem .5556rem;font-size:.8333rem}.preset-save-btn{border:.0556rem solid var(--accent-border);background:var(--accent-bg);color:var(--accent);cursor:pointer;white-space:nowrap;border-radius:.4444rem;padding:.75rem .325rem;font-weight:600}.storage-switch{border:.0556rem solid var(--border);border-radius:.4444rem;align-self:center;display:flex;overflow:hidden}.storage-switch button{background:var(--bg);color:var(--text);cursor:pointer;border:none;padding:.3333rem 1rem;font-size:.7778rem;transition:background .15s,color .15s}.storage-switch button:hover{color:var(--accent)}.storage-switch button.active{background:var(--accent);color:var(--accent-contrast)}.cloud-control{flex-wrap:wrap;align-items:center;gap:.4444rem;display:flex}.cloud-status{min-width:0;color:var(--text);flex:1;font-size:.7222rem}.cloud-connect{border:.0556rem solid var(--border);background:var(--bg);color:var(--text-h);cursor:pointer;border-radius:.4444rem;flex:1;padding:.4444rem .6667rem;font-size:.7778rem;transition:border-color .15s,color .15s}.cloud-connect:hover{border-color:var(--accent-border);color:var(--accent)}.cloud-connect:disabled{opacity:.6;cursor:default}.cloud-disconnect{border:.0556rem solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;border-radius:.3889rem;padding:.2778rem .5556rem;font-size:.7222rem}.cloud-disconnect:hover{border-color:var(--accent-border);color:var(--accent)}.cloud-control .preset-error{flex-basis:100%}.auth-form{flex-direction:column;gap:.6667rem;display:flex}.auth-title{color:var(--text-h);margin:0;font-size:1.4444rem;font-weight:600}.auth-subtitle{color:var(--text);margin:-.3333rem 0 .1111rem;font-size:.7778rem}.auth-form input{border:.0556rem solid var(--border);background:var(--bg);color:var(--text-h);border-radius:.4444rem;padding:.6111rem .6667rem;font-size:.8333rem}.auth-form input:focus{border-color:var(--accent-border);outline:none}.auth-primary{background:var(--accent);color:var(--accent-contrast);cursor:pointer;border:none;border-radius:55.5rem;margin-top:.2222rem;padding:.6667rem;font-size:.8889rem;font-weight:600}.auth-primary:disabled{opacity:.6;cursor:default}.auth-switch{color:var(--accent);cursor:pointer;background:0 0;border:none;align-self:flex-start;padding:0;font-size:.7778rem}.auth-switch:hover{text-decoration:underline}.auth-error{color:#e5484d;margin:0;font-size:.7222rem}.preset-error{text-align:center;color:#e5484d;margin:0;font-size:.7778rem}.drawer-footer{border-top:.0556rem solid var(--border);flex-direction:column;gap:.5556rem;margin-top:auto;padding-top:.6667rem;display:flex}.drawer-legal{color:var(--text);opacity:.6;align-self:flex-end;font-size:.6667rem;text-decoration:none}.drawer-legal:hover{opacity:1;text-decoration:underline}.account-footer{justify-content:flex-end;align-items:center;gap:.4444rem;display:flex}.account-email{min-width:0;color:var(--text);text-align:right;text-overflow:ellipsis;white-space:nowrap;font-size:.7222rem;overflow:hidden}.account-button{border:.0556rem solid var(--border);background:var(--bg);color:var(--text-h);cursor:pointer;border-radius:.4444rem;flex-shrink:0;align-items:center;gap:.3333rem;padding:.3333rem .6667rem;font-size:.7778rem;transition:border-color .15s,color .15s;display:inline-flex}.account-button:hover{border-color:var(--accent-border);color:var(--accent)}.account-backdrop{z-index:40;background:#00000073;justify-content:center;align-items:center;padding:.8889rem;display:flex;position:fixed;inset:0}.account-modal{z-index:41;box-sizing:border-box;background:var(--bg);border:.0556rem solid var(--border);width:20rem;max-width:100%;box-shadow:var(--shadow);border-radius:.7778rem;padding:1.5556rem 1.3333rem 1.3333rem;position:relative}.account-close{color:var(--text);cursor:pointer;background:0 0;border:none;font-size:1.2222rem;line-height:1;position:absolute;top:.4444rem;right:.5556rem}.account-signed-in{flex-direction:column;align-items:stretch;gap:.8889rem;display:flex}.account-status{color:var(--text);margin:0;font-size:.7778rem}.preset-notice{color:#e5484d;text-align:center;background:#e5484d1f;border-radius:.4444rem;margin:0;padding:.4444rem .5556rem;font-size:.7222rem}.preset-empty{color:var(--text);text-align:center;font-size:.8333rem}.preset-list{flex-direction:column;gap:.4444rem;margin:0;padding:0;list-style:none;display:flex}.preset-item{border:.0556rem solid var(--border);border-radius:.5556rem;flex-direction:row;align-items:stretch;gap:.4444rem;padding:.5556rem;display:flex}.preset-item.dragging{opacity:.5}.preset-item.drop-target{border-color:var(--accent)}.preset-grip{cursor:grab;color:var(--text);-webkit-user-select:none;user-select:none;align-items:center;font-size:.8889rem;line-height:1;display:flex}.preset-grip:active{cursor:grabbing}.preset-body{flex-flow:wrap;flex:1;align-items:center;gap:.4444rem;min-width:0;display:flex}.preset-main{flex:1000 auto;min-width:6rem}.preset-load{cursor:pointer;background:0 0;border:none;flex-direction:column;align-items:flex-start;gap:.1111rem;width:100%;padding:0;display:flex}.preset-label-line{align-items:flex-start;gap:.2778rem;width:100%;min-width:0;display:flex}.preset-label{color:var(--text-h);text-justify:left;font-size:.8889rem;font-weight:600}.preset-ramp-badge{color:var(--accent);flex:none;margin-top:.0556rem;display:flex}.preset-ramp-badge .ramp-icon{width:.8889rem;height:.8889rem}.preset-summary{color:var(--text);font-variant-numeric:tabular-nums;font-size:.7222rem}.preset-rename{box-sizing:border-box;border:.0556rem solid var(--accent-border);background:var(--accent-bg);width:100%;color:var(--text-h);border-radius:.4444rem;padding:.3333rem .4444rem;font-size:.8333rem}.preset-actions{flex:auto;gap:.2222rem;display:flex}.preset-actions button{border:.0556rem solid var(--border);background:var(--bg);width:2.01rem;height:2.01rem;color:var(--text);cursor:pointer;border-radius:.3889rem;flex:auto;justify-content:center;align-items:center;padding:0;font-size:1.05rem;line-height:1;transition:border-color .15s,color .15s;display:inline-flex}.preset-actions button svg{width:1em;height:1em}.preset-actions button:hover{border-color:var(--accent-border);color:var(--accent)}.metronome{box-sizing:border-box;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1rem;width:min(100%,23.3333rem);max-width:23.3333rem;margin:0 auto;padding:1rem 1.3333rem 1.3333rem;display:flex}.loaded-preset{letter-spacing:.0111rem;min-height:1.4em;color:var(--text);font-size:1.2222rem;font-weight:500}.loaded-modified{color:var(--accent)}.play{border:.0556rem solid var(--accent-border);background:var(--accent-bg);width:8.8889rem;color:var(--accent);cursor:pointer;border-radius:55.5rem;padding:.7778rem 0;font-size:1rem;font-weight:600;transition:background .15s,color .15s}.play.running{background:var(--accent);color:var(--accent-contrast)}@media (width<=640px){.metronome{gap:.875rem;padding:.75rem 1rem 1rem}.play{width:7.3333rem;padding:.6667rem 0}}:root{--help-icon-color:var(--border);--help-icon-border-radius:2.4444rem}.help-hint{top:calc(1.1111rem + env(safe-area-inset-top,0px));z-index:10;position:fixed;right:3.7778rem}.settings-toggle{top:calc(1.1111rem + env(safe-area-inset-top,0px));z-index:10;background:var(--bg);width:2.4444rem;height:2.4444rem;color:var(--text);cursor:pointer;border:none;justify-content:center;align-items:center;transition:color .15s;display:inline-flex;position:fixed;right:.8889rem}.settings-toggle:hover,.settings-toggle:focus-visible{color:var(--accent);outline:none}.help-toggle{width:var(--help-icon-border-radius);height:var(--help-icon-border-radius);background:var(--bg);color:var(--help-icon-color);cursor:pointer;border:none;justify-content:center;align-items:center;font-size:2.5em;font-weight:600;transition:border-color .15s,color .15s;display:inline-flex}.help-toggle:hover,.help-toggle:focus-visible{border-color:var(--accent-border);color:var(--accent);outline:none}.help-toggle svg{width:1.5rem;height:1.5rem}.help-panel{text-align:left;background:var(--bg);border:.0556rem solid var(--border);width:15.5556rem;max-width:86vw;box-shadow:var(--shadow);overscroll-behavior:contain;border-radius:.6667rem;max-height:78vh;padding:.8889rem 1rem;position:absolute;top:calc(100% + .4444rem);right:0;overflow-y:auto}@media (width<=640px){.help-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}}.help-title{color:var(--text-h);margin:0 0 .5556rem;font-size:.8889rem;font-weight:600}.help-group{text-transform:uppercase;letter-spacing:.0278rem;color:var(--accent);margin:.7778rem 0 .3333rem;font-size:.6667rem;font-weight:600}.help-group:first-of-type{margin-top:0}.help-list{flex-direction:column;gap:.3333rem;margin:0;padding:0;list-style:none;display:flex}.help-list li{color:var(--text);font-size:.7222rem;line-height:1.45}.help-list li.help-touch{display:none}@media (pointer:coarse){.help-list li.help-desktop{display:none}.help-list li.help-touch{display:block}}.help-list kbd{font:600 .6667rem/1.4 var(--sans);color:var(--text-h);background:var(--accent-bg);border:.0556rem solid var(--border);border-radius:.2778rem;padding:.0556rem .3333rem;display:inline-block}.help-version{border-top:.0556rem solid var(--border);color:var(--text);opacity:.7;margin:.7778rem 0 0;padding-top:.6667rem;font-size:.6111rem}.volume-control{border-bottom:.0556rem solid var(--border);align-items:center;gap:.5556rem;padding-bottom:.8889rem;display:flex}.volume-control .volume-icon{color:var(--text);display:inline-flex}.volume-control input[type=range]{min-width:0;accent-color:var(--accent);flex:1}.volume-value{text-align:right;width:4ch;color:var(--text);font-variant-numeric:tabular-nums;font-size:.7222rem}.number-field{--number-field-size:1.3333rem;--number-field-label-height:.9333rem;cursor:default;touch-action:none;flex-direction:column;align-items:center;display:flex}.number-field-label{height:var(--number-field-label-height);line-height:var(--number-field-label-height);letter-spacing:.1667rem;color:var(--text);font-size:.7778rem}.number-field-value{height:calc(var(--number-field-size) * 1.875);justify-content:center;align-items:center;display:flex}.number-chip{box-sizing:border-box;width:2.6em;font:600 var(--number-field-size) / 1.1 var(--heading);color:var(--text-h);border:.0556rem solid var(--border);background:var(--bg);cursor:pointer;border-radius:.21875em;padding:.0625em 0;transition:border-color .15s,color .15s}.number-chip:hover{border-color:var(--accent-border);color:var(--accent)}.number-wheel{box-sizing:border-box;width:2.6em;font-size:var(--number-field-size);border:.0556rem solid var(--accent-border);background:var(--bg);text-align:center;font-variant-numeric:tabular-nums;border-radius:.21875em;flex-direction:column;align-items:stretch;display:flex;overflow:hidden}.number-ghost{height:1.5em;color:var(--text);opacity:.4;cursor:pointer;background:0 0;border:none;font-size:.25em;line-height:1.5em}.number-ghost:hover{opacity:.75}.number-input{box-sizing:border-box;width:100%;height:1.09375em;font:600 1em/1.09375em var(--heading);text-align:center;color:var(--accent);background:var(--accent-bg);appearance:textfield;border:none;padding:0}.number-input:focus{outline:none}.number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.number-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.tempo-row{align-items:center;gap:1.3333rem;display:flex}.step{border:.0556rem solid var(--border);background:var(--bg);width:3.1111rem;height:3.1111rem;color:var(--text-h);cursor:pointer;border-radius:50%;margin-bottom:.9333rem;font-size:1.5556rem;line-height:1;transition:border-color .15s,color .15s}.step:hover{border-color:var(--accent-border);color:var(--accent)}.step-10{font-size:1.2222rem;font-weight:600}.tempo-field{--number-field-size:3.5556rem}.tempo-slider{appearance:none;cursor:pointer;touch-action:none;background:0 0;width:100%;max-width:17.7778rem;height:2em}.tempo-slider::-webkit-slider-runnable-track{background:repeating-linear-gradient(to right, color-mix(in srgb, var(--text) 50%, transparent) 0 .0833rem, transparent .0833rem .8333rem), linear-gradient(180deg, var(--border), var(--text) 50%, var(--border));border-radius:.2222rem;height:.4444rem}.tempo-slider::-webkit-slider-thumb{-webkit-appearance:none;background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 80%, #fff), var(--accent) 60%);border:.0556rem solid var(--accent-border);width:1.3333rem;height:2rem;box-shadow:var(--shadow);border-radius:.3333rem;margin-top:-.778rem}.tempo-slider::-moz-range-track{background:linear-gradient(180deg, var(--border), var(--text) 50%, var(--border));border-radius:.2222rem;height:.4444rem}.tempo-slider::-moz-range-thumb{background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 80%, #fff), var(--accent) 60%);border:.0556rem solid var(--accent-border);width:1.3333rem;height:2rem;box-shadow:var(--shadow);border-radius:.3333rem}@media (width<=640px){.tempo-row{gap:.75rem}.tempo-field{--number-field-size:3.2rem}}.tempo-cluster{display:contents}:root[data-layout=tower] .tempo-cluster{flex-direction:row;justify-content:center;align-items:center;gap:1.5rem;width:100%;display:flex}:root[data-layout=tower] .tempo-row{flex-direction:column-reverse;gap:.8889rem}.pendulum-layout{flex-direction:column;align-items:center;gap:1rem;width:100%;display:flex}.pendulum{justify-content:center;align-items:flex-end;width:17rem;height:15rem;display:flex;position:relative}.pendulum-arm{background:linear-gradient(90deg, var(--border), var(--text) 50%, var(--border));transform-origin:bottom;border-radius:.2222rem;width:.4444rem;height:14.2222rem;transition-property:transform;transition-timing-function:ease-in-out;position:relative}.pendulum-weight{background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 80%, #fff), var(--accent) 60%);border:.0556rem solid var(--accent-border);width:2.8889rem;height:1.7778rem;box-shadow:var(--shadow);cursor:grab;touch-action:none;border-radius:.3889rem;padding:0;position:absolute;left:50%;transform:translate(-50%)}.pendulum-weight:active{cursor:grabbing}.pendulum-pivot{background:var(--text);width:1.3333rem;height:1.3333rem;box-shadow:var(--shadow);border-radius:50%;position:absolute;bottom:-.4444rem;left:50%;transform:translate(-50%)}.pendulum-readout{flex-direction:column;align-items:center;display:flex}.pendulum-readout .tempo-field{--number-field-size:2.8889rem}.pendulum-ts{flex-direction:column;align-items:center;gap:.6667rem;display:flex}.pendulum-ts-toggle{border:.0556rem solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;border-radius:.4444rem;padding:.3333rem .8889rem;font-size:.7778rem;transition:border-color .15s,color .15s}.pendulum-ts-toggle:hover{border-color:var(--accent-border);color:var(--accent)}.pendulum-ts-controls{align-items:center;gap:.6667rem;display:flex}:root[data-layout=tower] .tempo-slider{writing-mode:vertical-lr;appearance:none;cursor:pointer;touch-action:none;direction:rtl;background:0 0;width:2.8889rem;max-width:none;height:15rem}:root[data-layout=tower] .tempo-slider::-webkit-slider-runnable-track{background:repeating-linear-gradient(to bottom, color-mix(in srgb, var(--text) 50%, transparent) 0 .0833rem, transparent .0833rem .8333rem), linear-gradient(90deg, var(--border), var(--text) 50%, var(--border));border-radius:.2222rem;width:.4444rem;height:100%}:root[data-layout=tower] .tempo-slider::-webkit-slider-thumb{-webkit-appearance:none;background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 80%, #fff), var(--accent) 60%);border:.0556rem solid var(--accent-border);width:2.8889rem;height:1.3333rem;box-shadow:var(--shadow);border-radius:.3333rem;margin-top:0;margin-left:-1.2222rem}:root[data-layout=tower] .tempo-slider::-moz-range-track{background:linear-gradient(90deg, var(--border), var(--text) 50%, var(--border));border-radius:.2222rem;width:.4444rem;height:100%}:root[data-layout=tower] .tempo-slider::-moz-range-thumb{background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 80%, #fff), var(--accent) 60%);border:.0556rem solid var(--accent-border);width:2.8889rem;height:1.3333rem;box-shadow:var(--shadow);border-radius:.3333rem}.meter-row{justify-content:center;align-items:center;gap:.8889rem;display:flex;position:relative}.beat-indicator{flex-wrap:nowrap;justify-content:center;align-items:center;gap:clamp(.1667rem,2.5vw,.7778rem);width:100%;min-height:2.8889rem;display:flex}.beat-dot{border:.1111rem solid var(--border);cursor:pointer;background:0 0;border-radius:.6667rem;flex:1 1 0;min-width:0;max-width:1.6667rem;height:2.2222rem;padding:0;transition:transform 60ms,background 60ms,border-color 60ms,opacity 60ms}.beat-dot:hover{border-color:var(--accent-border)}.beat-dot.accent{border-color:var(--accent);background:var(--accent-bg)}.beat-dot.muted{opacity:.4;border-style:dashed}.beat-dot.active{transform:scale(1.3)}.beat-dot.active.accent{background:var(--accent)}.beat-dot.active.normal{background:var(--text-h);border-color:var(--text-h)}.beat-dot.active.muted{opacity:.7;background:var(--accent-bg)}.time-signature{flex-direction:column;align-items:center;gap:.6667rem;display:flex}.ts-presets{border:.0556rem solid var(--border);background:var(--bg);color:var(--text-h);cursor:pointer;font-variant-numeric:tabular-nums;border-radius:.4444rem;padding:.3333rem .6667rem;font-size:.8333rem;transition:border-color .15s}.ts-presets:hover{border-color:var(--accent-border)}.ts-trigger{border:.0556rem solid var(--border);background:var(--bg);min-width:3.5556rem;color:var(--text-h);cursor:pointer;font-variant-numeric:tabular-nums;border-radius:.4444rem;justify-content:space-between;align-items:center;gap:.5556rem;padding:.2778rem .5556rem;display:inline-flex}.ts-trigger:hover{border-color:var(--accent-border)}.ts-trigger-value{font-size:1rem;font-weight:600}.ts-trigger-chevron{color:var(--text);font-size:1rem}.ts-backdrop{z-index:40;background:#00000040;position:fixed;inset:0}.ts-editor{z-index:41;background:var(--bg);border:.0556rem solid var(--border);box-shadow:var(--shadow);border-radius:.6667rem;align-items:center;gap:.4444rem;padding:.6667rem .8889rem;display:inline-flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ts-slash{font:300 1.2222rem/1 var(--heading);color:var(--text)}.ts-wheel{border:.0556rem solid var(--border);background:var(--bg);text-align:center;font-variant-numeric:tabular-nums;cursor:ns-resize;-webkit-user-select:none;user-select:none;touch-action:none;border-radius:.4444rem;flex-direction:column;align-items:stretch;width:clamp(2.6rem,15vw,5rem);display:flex;overflow:hidden}.ts-wheel:focus-visible{border-color:var(--accent-border);outline:none}.ts-wheel-option{height:clamp(.5rem,4vh,3rem);line-height:clamp(.5rem,4vh,3rem)}.ts-wheel-option.ghost{color:var(--text);opacity:.4;cursor:pointer;font-size:clamp(.75rem,2vh,1.5rem)}.ts-wheel-option.ghost:hover{opacity:.75}.ts-wheel-option.current{color:var(--accent);background:var(--accent-bg);font-size:clamp(1rem,4vh,3rem);font-weight:600}.ts-accept{border:.0556rem solid var(--accent-border);background:var(--accent-bg);width:2rem;height:2rem;color:var(--accent);cursor:pointer;border-radius:.4444rem;justify-content:center;align-items:center;font-size:.8889rem;transition:background .15s,color .15s;display:inline-flex}.ts-accept:hover{background:var(--accent);color:var(--accent-contrast)}@media (width<=640px){.meter-row{gap:.6667rem}}.subdivision-picker{position:relative}.subdivision-trigger{border:.0556rem solid var(--border);background:var(--bg);min-width:3.5556rem;color:var(--text-h);cursor:pointer;border-radius:.4444rem;justify-content:flex-end;align-items:center;gap:.5556rem;padding:.2778rem .5556rem;display:inline-flex}.subdivision-trigger:hover{border-color:var(--accent-border)}.subdivision-chevron{color:var(--text);font-size:1rem}.subdivision-menu{z-index:50;background:var(--bg);border:.0556rem solid var(--border);box-shadow:var(--shadow);border-radius:.4444rem;flex-direction:column;gap:.1111rem;max-height:14.4444rem;margin:0;padding:.2222rem;list-style:none;display:flex;position:absolute;top:calc(100% + .2222rem);left:0;overflow-y:auto}.subdivision-menu button{width:100%;min-width:3.3333rem;color:var(--text-h);cursor:pointer;background:0 0;border:none;border-radius:.3333rem;justify-content:center;align-items:center;padding:.3333rem .7778rem;display:flex}.subdivision-menu button:hover{background:var(--accent-bg)}.subdivision-menu button.active{background:var(--accent-bg);color:var(--accent)}.sub-note{font-family:"Segoe UI Symbol", "Noto Music", "Noto Sans Symbols2", var(--sans);font-size:1.1111rem;line-height:1}.triplet-glyph{width:auto;height:1.2222rem;display:block}:root{--ramp-warning-dim:.5;--ramp-warning-strike:.6}@keyframes ramp-warning-pulse-a{0%{opacity:var(--ramp-warning-dim)}to{opacity:1}}@keyframes ramp-warning-pulse-b{0%{opacity:var(--ramp-warning-dim)}to{opacity:1}}.metronome[data-ramp-warning] .tempo-field{animation-duration:calc(var(--beat-seconds,.5s) * var(--ramp-warning-strike));animation-timing-function:ease-out;animation-iteration-count:1}.metronome[data-ramp-warning][data-beat-parity="0"] .tempo-field{animation-name:ramp-warning-pulse-a}.metronome[data-ramp-warning][data-beat-parity="1"] .tempo-field{animation-name:ramp-warning-pulse-b}.metronome[data-ramp-warning] .tempo-slider::-webkit-slider-thumb{animation-duration:calc(var(--beat-seconds,.5s) * var(--ramp-warning-strike));animation-timing-function:ease-out;animation-iteration-count:1}.metronome[data-ramp-warning][data-beat-parity="0"] .tempo-slider::-webkit-slider-thumb{animation-name:ramp-warning-pulse-a}.metronome[data-ramp-warning][data-beat-parity="1"] .tempo-slider::-webkit-slider-thumb{animation-name:ramp-warning-pulse-b}.metronome[data-ramp-warning] .tempo-slider::-moz-range-thumb{animation-duration:calc(var(--beat-seconds,.5s) * var(--ramp-warning-strike));animation-timing-function:ease-out;animation-iteration-count:1}.metronome[data-ramp-warning][data-beat-parity="0"] .tempo-slider::-moz-range-thumb{animation-name:ramp-warning-pulse-a}.metronome[data-ramp-warning][data-beat-parity="1"] .tempo-slider::-moz-range-thumb{animation-name:ramp-warning-pulse-b}.metronome[data-ramp-warning] .number-chip{border-color:var(--accent-border);color:var(--accent)}@media (prefers-reduced-motion:reduce){.metronome[data-ramp-warning] .tempo-field{opacity:var(--ramp-warning-dim);animation:none}.metronome[data-ramp-warning] .tempo-slider::-webkit-slider-thumb{opacity:var(--ramp-warning-dim);animation:none}.metronome[data-ramp-warning] .tempo-slider::-moz-range-thumb{opacity:var(--ramp-warning-dim);animation:none}}.ramp-toggle{top:calc(4.1111rem + env(safe-area-inset-top,0px));z-index:10;border:.0556rem solid var(--border);background:var(--bg);min-height:2.4444rem;color:var(--text-h);cursor:pointer;border-radius:.5556rem;justify-content:center;align-items:center;gap:.3333rem;padding:0 .6667rem;font-size:.7778rem;font-weight:500;line-height:1.2;transition:border-color .15s,color .15s;display:inline-flex;position:fixed;left:.8889rem}.ramp-toggle:hover{border-color:var(--accent-border);color:var(--accent)}.ramp-icon{width:1.2222rem;height:1.2222rem;display:block}.ramp-summary{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.7778rem;font-weight:600;line-height:1.2}.ramp-toggle[data-ramp-active]{border-color:var(--accent-border);background:var(--accent-bg);color:var(--accent)}.ramp{top:calc(6.8889rem + env(safe-area-inset-top,0px));z-index:11;box-sizing:border-box;background:var(--bg);border:.0556rem solid var(--border);width:15.5556rem;max-width:calc(100vw - 1.7778rem);box-shadow:var(--shadow);opacity:0;visibility:hidden;border-radius:.6667rem;padding:.8889rem;transition:opacity .15s,transform .2s,visibility .15s;position:fixed;left:.8889rem;transform:translateY(-.4444rem)}.ramp.open{opacity:1;visibility:visible;transform:none}.ramp-content{flex-direction:column;gap:.8889rem;display:flex}.ramp-control{--ramp-field-size:1.65rem;grid-template-columns:1fr auto 1fr;align-items:start;gap:.6667rem;display:grid}.ramp-control [role=switch]{grid-column:1/-1}.ramp-separator{height:calc(var(--ramp-field-size) * 1.875);color:var(--text);white-space:nowrap;align-items:center;font-size:.7778rem;display:flex}.ramp-control [role=switch]{border:.0556rem solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;border-radius:.4444rem;justify-content:space-between;align-items:center;gap:.5556rem;padding:.4444rem .6667rem;font-size:.8333rem;transition:background .15s,border-color .15s,color .15s;display:flex}.ramp-control [role=switch]:hover{border-color:var(--accent-border);color:var(--accent)}.ramp-control [role=switch][aria-checked=true]{border-color:var(--accent-border);background:var(--accent-bg);color:var(--accent);font-weight:500}.ramp-control [role=switch]:after{content:"";background:var(--border);width:1.7778rem;height:.8889rem;box-shadow:inset .8889rem 0 0 -.2222rem var(--bg);border-radius:.8889rem;flex:none;transition:background .15s}.ramp-control [role=switch][aria-checked=true]:after{background:var(--accent);box-shadow:inset -.8889rem 0 0 -.2222rem var(--bg)}.ramp-bars,.ramp-step{--number-field-size:var(--ramp-field-size)}:is(.ramp-control:not(:has([aria-checked=true])) .ramp-bars,.ramp-control:not(:has([aria-checked=true])) .ramp-step){opacity:.55}@media (width<=640px){.ramp{width:auto;max-width:none;right:.8889rem}}
