@layer components{.odo{border:1px solid var(--border);background:var(--background);border-radius:12px;gap:10px;min-width:0;padding:18px;display:grid}.odo-label{color:var(--muted-foreground);font-size:12px;font-weight:600}.odo-value{letter-spacing:-.03em;font-variant-numeric:tabular-nums;align-items:flex-start;height:1.15em;font-size:34px;font-weight:700;line-height:1.15;display:flex;overflow:hidden}.odo-sep{white-space:pre}.odo-col{height:1.15em;display:inline-block;overflow:hidden}.odo-strip{transition:transform var(--roll-duration) var(--roll-easing);flex-direction:column;display:flex}.odo-strip>span{text-align:center;height:1.15em;display:block}.odo[data-motion=static] .odo-strip{transition:none}.odo-delta{background:var(--muted);font-variant-numeric:tabular-nums;border-radius:999px;justify-self:start;padding:4px 8px;font-size:12px;font-weight:700}.odo{--odo-good:var(--chart-2);--odo-bad:var(--destructive)}.odo[data-tone=good] .odo-delta{color:color-mix(in oklab,var(--odo-good) 70%,var(--foreground));background:color-mix(in oklab,var(--odo-good) 16%,transparent)}.odo[data-tone=bad] .odo-delta{color:color-mix(in oklab,var(--odo-bad) 80%,var(--foreground));background:color-mix(in oklab,var(--odo-bad) 14%,transparent)}.odo-arrow{font-size:9px}.odo-delta,.odo-delta *{transition:none}.odo .sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:760px){.odo-value{font-size:26px}}.odo-sweep{font-variant-numeric:tabular-nums}}
