.spx-bands{height:var(--spx-band-h,30px);font-family:var(--font-mono,ui-monospace, monospace);font-size:var(--spx-fs,11px);letter-spacing:.12em;color:var(--fg-muted);line-height:1;position:relative}.spx-band{border-left:1px solid var(--line-strong);white-space:nowrap;height:100%;padding-left:7px;transition:color .2s ease-out,border-color .2s ease-out;position:absolute;top:0}.spx-band small{color:var(--fg-faint);letter-spacing:.04em;margin-top:6px;font-size:10px;display:block}.spx-band[data-on]{color:var(--fg);border-color:var(--fg-muted)}.spx-strip{height:var(--spx-strip-h,10px);background:var(--bg-2);border-radius:2px;position:relative;overflow:hidden}.spx-strip__fill,.spx-wipe,.spx-wipe__in{position:absolute;inset:0}.spx-wipe{overflow:hidden}.spx-strip__hatch{background-image:repeating-linear-gradient(-45deg,#05070c8c 0 2px,#0000 2px 5px);position:absolute;top:0;bottom:0}.spx-gap{background:var(--spx-gap-bg,var(--bg-1));position:absolute;top:0;bottom:0}.spx-gap svg{width:100%;height:100%;position:absolute;inset:0}.spx-gap path{fill:none;stroke:var(--fg-faint);stroke-width:1px;vector-effect:non-scaling-stroke}.spx-ticks{width:100%;height:14px;margin-top:4px;display:block;overflow:visible}.spx-ticks line{stroke:var(--fg-faint);stroke-width:1px;vector-effect:non-scaling-stroke;shape-rendering:crispedges}.spx-ticks .spx-ticks__axis{stroke:var(--line-strong)}.spx-ticks .spx-ticks__major{stroke:var(--fg-muted)}.spx-labels{font-family:var(--font-mono,ui-monospace, monospace);font-feature-settings:"tnum" 1;font-size:var(--spx-fs,11px);letter-spacing:.04em;color:var(--fg-muted);margin-top:6px;line-height:1;position:relative}.spx-labels__row{height:12px;position:relative}.spx-labels__row span{white-space:nowrap;position:absolute;top:0;transform:translate(-50%)}.spx-labels__row [data-align=start]{transform:none}.spx-labels__row [data-align=end]{transform:translate(-100%)}.spx-labels__unit{font-family:var(--font-sans);letter-spacing:0;text-align:right;color:var(--fg-muted);margin-top:12px;font-size:.8125rem;line-height:1.4;display:block}.spx-ruler{--spx-strip-h:10px;--spx-band-h:30px;--spx-readout-h:34px;--spx-fs:11px;overflow-clip-margin:2px;min-width:0;max-width:100%;font-family:var(--font-mono,ui-monospace, monospace);font-feature-settings:"tnum" 1;font-size:var(--spx-fs);color:var(--fg-muted);margin:0;position:relative;overflow-x:clip}.spx-ruler[data-size=hero]{--spx-strip-h:18px;--spx-band-h:34px;--spx-readout-h:42px;--spx-fs:12px}.spx-ruler__scale{position:relative}.spx-ruler__track{margin-top:var(--spx-readout-h);position:relative}.spx-ruler__marker{--p:.5;width:100%;height:calc(var(--spx-strip-h) + 6px + 4px + 12px);transform:translate3d(calc(var(--p) * 100%), 0, 0);pointer-events:none;position:absolute;top:-6px;left:0}.spx-ruler__needle{background:var(--signal);width:1px;position:absolute;top:0;bottom:0;left:-.5px}.spx-ruler__needle:before{content:"";border:4.5px solid #0000;border-top:6px solid var(--signal);border-bottom:0;position:absolute;top:-1px;left:-4px}.spx-ruler__readout{border:1px solid color-mix(in oklab, var(--signal) 50%, var(--line));background:color-mix(in oklab, var(--bg-0) 90%, transparent);color:var(--fg-muted);letter-spacing:.04em;white-space:nowrap;border-radius:3px;align-items:baseline;gap:10px;padding:5px 8px 4px;line-height:1;display:inline-flex;position:absolute;bottom:calc(100% + 4px);left:0;transform:translate(-50%)}.spx-ruler__readout b{color:var(--signal);margin-left:.45em;font-weight:500}.spx-ruler__marker[data-edge=end] .spx-ruler__readout{transform:translate(calc(6px - 100%))}.spx-ruler__marker[data-edge=start] .spx-ruler__readout{transform:translate(-6px)}.spx-ruler__cap{justify-content:flex-end;margin-top:14px;display:flex}.spx-ruler__explore{min-height:32px;font-family:var(--font-sans);letter-spacing:0;color:var(--beam-1);text-decoration:underline;-webkit-text-decoration-color:color-mix(in oklab, var(--beam-1) 35%, transparent);text-decoration-color:color-mix(in oklab, var(--beam-1) 35%, transparent);text-underline-offset:.3em;align-items:center;gap:6px;padding:0 2px;font-size:.875rem;font-weight:500;transition:text-decoration-color .15s ease-out;display:inline-flex}.spx-ruler__explore:hover{text-decoration-color:currentColor}.spx-ruler__explore svg{transition:transform .15s ease-out}.spx-ruler__explore:hover svg{transform:translate(2px)}@media (prefers-reduced-motion:no-preference) and (scripting:enabled){.spx-ruler[data-sweep]:not([data-state]) .spx-wipe{transform:translate(-100%)}.spx-ruler[data-sweep]:not([data-state]) .spx-wipe__in{transform:translate(100%)}.spx-ruler[data-sweep]:not([data-state]) .spx-ruler__marker{transform:translate(0,0)}.spx-ruler[data-sweep]:not([data-state]) .spx-ruler__readout{opacity:0}.spx-ruler[data-state=run] :is(.spx-wipe,.spx-wipe__in){transition:transform 1.9s cubic-bezier(.45,0,.25,1);transform:translate(0,0)}.spx-ruler[data-state=run] .spx-ruler__readout{transition:opacity .3s ease-out}.spx-ruler[data-state=run] .spx-ruler__marker{will-change:transform}}@media (max-width:1023px){.spx-band small{display:none}}@media (max-width:720px){.spx-labels__row [data-minor]{display:none}.spx-band{letter-spacing:.06em;padding-left:4px}}