.sounder{height:var(--sounder-h);display:grid;grid-template-columns:34px 1fr 46px;align-items:center;gap:var(--s2);padding:0 var(--s4);background:linear-gradient(to bottom,color-mix(in srgb,var(--sound) 97%,var(--abyss)),var(--abyss));border-top:1px solid color-mix(in srgb,var(--shoal) 70%,transparent)}.sounder__play{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;color:var(--abyss);background:var(--paper);transition:transform var(--dur-1) var(--ease-out-fast),background var(--dur-1)}.sounder__play:active{transform:scale(.9)}.sounder__play[aria-pressed=true]{background:var(--roe);color:var(--abyss);box-shadow:var(--glow-roe)}.sounder__track{position:relative;height:100%;padding:6px 0 0;touch-action:none;cursor:ew-resize}.sounder__svg{width:100%;height:44px;overflow:visible}.sounder__months{position:absolute;inset-inline:0;bottom:1px;display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;color:var(--paper-faint);pointer-events:none}.sounder__month{width:8px;text-align:center;transition:color var(--dur-1)}.sounder__month[data-on]{color:var(--roe);font-weight:700}.sounder__readout{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;font-size:9px}.sounder__mo{color:var(--paper);font-weight:600;letter-spacing:.04em}.sounder__val{color:var(--roe);font-weight:700;font-size:13px;letter-spacing:-.05em}.sounder[data-dragging] .sounder__svg{filter:saturate(1.25)}