.pr{--pr-c0:#93b4ff;--pr-c1:var(--color-foreground);--pr-c2:#f2b950;--pr-label:96px;flex-direction:column;gap:8px;max-width:1040px;margin:0 auto;display:flex}[data-theme=light] .pr{--pr-c0:var(--color-primary);--pr-c2:#b7791f}.pr-top{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:24px 40px;display:grid}.pr-visual{flex-direction:column;align-items:center;display:flex}.pr-circle{width:min(100%,360px);height:auto;overflow:visible}.pr-ring-line{fill:none;stroke:var(--color-border-lighter);stroke-width:1.5px}.pr-dot{fill:var(--color-panel2);stroke-width:2.5px;transform-box:fill-box;transform-origin:50%;transition:fill 80ms linear,transform 80ms linear!important}.pr-ring--0 .pr-dot{stroke:var(--pr-c0)}.pr-ring--1 .pr-dot{stroke:var(--pr-c1)}.pr-ring--2 .pr-dot{stroke:var(--pr-c2)}.pr-ring--0 .pr-dot--one,.pr-ring--0 .pr-dot--on{fill:var(--pr-c0)}.pr-ring--1 .pr-dot--one,.pr-ring--1 .pr-dot--on{fill:var(--pr-c1)}.pr-ring--2 .pr-dot--one,.pr-ring--2 .pr-dot--on{fill:var(--pr-c2)}.pr-dot--on{transform:scale(1.35)}.pr-ring--muted{opacity:.35}.pr-hand line{stroke:var(--color-muted-foreground);stroke-width:2px;stroke-linecap:round}.pr-hand circle{fill:var(--color-muted-foreground)}.pr--running .pr-hand line{stroke:var(--color-foreground)}.pr-ratio{letter-spacing:-.02em;align-items:baseline;margin:4px 0 0;font-size:clamp(40px,6vw,56px);font-weight:300;line-height:1;display:flex}.pr-ratio-sep{color:var(--color-muted-foreground);margin:0 6px}.pr-ratio-n--0{color:var(--pr-c0)}.pr-ratio-n--1{color:var(--pr-c1)}.pr-ratio-n--2{color:var(--pr-c2)}.pr-side{flex-direction:column;gap:20px;min-width:0;display:flex}.pr-layers{flex-direction:column;gap:10px;display:flex}.pr-layer{border:1px solid var(--color-border);border-left:4px solid var(--pr-layer-colour);background:var(--color-panel2);border-radius:12px;padding:12px 14px}.pr-layer--0{--pr-layer-colour:var(--pr-c0)}.pr-layer--1{--pr-layer-colour:var(--pr-c1)}.pr-layer--2{--pr-layer-colour:var(--pr-c2)}.pr-layer-head{align-items:center;gap:8px;margin-bottom:8px;display:flex}.pr-swatch{background:var(--pr-layer-colour);border-radius:50%;width:10px;height:10px}.pr-layer-name{color:var(--color-foreground);font-size:15px;font-weight:500}.pr-layer-sound{color:var(--color-muted-foreground);font-size:13px}.pr-remove{margin-left:auto;padding:4px}.pr-layer-row{align-items:center;gap:12px;display:flex}.pr-count{min-width:2.4ch}.pr-mute--on{color:var(--color-warning)}.pr-mute:focus-visible,.pr-remove:focus-visible{outline-offset:2px;outline:2px solid #93b4ff}.pr-volume{flex:1;min-width:60px}.pr-add{align-self:flex-start}.pr-presets{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.pr-presets-label{width:100%;color:var(--color-muted-foreground);font-size:13px}.pr-tempo{border-top:1px solid var(--color-border);flex-direction:column;align-items:center;gap:10px;margin-top:20px;padding-top:24px;display:flex}.pr-tempo .ft-range{max-width:560px}.pr-grid{border-top:1px solid var(--color-border);margin-top:28px;padding-top:24px}.pr-grid-title{color:var(--color-foreground);margin:0 0 6px;font-size:20px;font-weight:400}.pr-warn{color:var(--color-warning);margin-top:6px}.pr-rows{flex-direction:column;gap:8px;margin-top:18px;display:flex;position:relative}.pr-row{grid-template-columns:var(--pr-label) minmax(0, 1fr);align-items:center;gap:12px;display:grid}.pr-row-label{color:var(--color-muted-foreground);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.pr-row-label small{color:var(--color-foreground);margin-left:4px;font-size:13px}.pr-track{border:1px solid var(--color-border);background-color:var(--color-surface-lightest);border-radius:8px;height:32px;position:relative;container-type:inline-size}[data-theme=light] .pr-track{background-color:#f6f6f6}.pr-track--lines{background-image:linear-gradient(to right, var(--color-border) 1px, transparent 1px);background-size:calc(100% / var(--cells)) 100%}.pr-track--text{background:0 0;border:0;height:22px}.pr-mark{top:50%;left:calc((var(--cell) + .5) / var(--cells) * 100%);width:clamp(4px, calc(100cqw / var(--cells) - 4px), 18px);height:clamp(4px, calc(100cqw / var(--cells) - 4px), 18px);border-radius:50%;position:absolute;transform:translate(-50%,-50%);transition:transform 80ms linear!important}.pr-row--0 .pr-mark{background:var(--pr-c0)}.pr-row--1 .pr-mark{background:var(--pr-c1)}.pr-row--2 .pr-mark{background:var(--pr-c2)}.pr-row--all .pr-mark{background:var(--color-muted-foreground)}.pr-mark--together{box-shadow:0 0 0 3px var(--color-panel1), 0 0 0 5px #93b4ff}[data-theme=light] .pr-mark--together{box-shadow:0 0 0 3px #fff, 0 0 0 5px var(--color-primary)}.pr-row--all .pr-mark--together{background:var(--color-foreground)}.pr-mark--on{transform:translate(-50%,-50%)scale(1.45)}.pr-num,.pr-syl{top:50%;left:calc((var(--cell) + .5) / var(--cells) * 100%);color:var(--color-surface-muted);white-space:nowrap;font-size:12px;position:absolute;transform:translate(-50%,-50%)}.pr-num--hit,.pr-syl{color:var(--color-foreground);font-weight:500}.pr-num--on{color:#93b4ff}[data-theme=light] .pr-num--on{color:var(--color-primary)}.pr-playzone{top:-6px;bottom:-6px;left:calc(var(--pr-label) + 12px);pointer-events:none;position:absolute;right:0}.pr-playhead{opacity:0;background:#93b4ff;border-radius:1px;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;left:0}.pr--running .pr-playhead{opacity:.85}[data-theme=light] .pr-playhead{background:var(--color-primary)}@media (max-width:860px){.pr-top{grid-template-columns:minmax(0,1fr)}.pr-circle{width:min(100%,300px)}}@media (max-width:640px){.pr{--pr-label:64px}.pr-row{gap:8px}.pr-playzone{left:calc(var(--pr-label) + 8px)}.pr-row-label,.pr-row-label small{font-size:12px}.pr-num,.pr-syl{font-size:11px}.pr-layer-row{gap:8px}}@media (prefers-reduced-motion:reduce){.pr-dot,.pr-mark{transition:none!important}}