.cs-stack3d{--s3-t0:oklch(50% .12 250);--s3-t1:oklch(70% .13 200);--s3-t2:oklch(62% .05 255);--s3-high:oklch(62% .19 25);--s3-medium:oklch(76% .14 70);--s3-low:oklch(68% .11 195);--s3-t3:oklch(70% .1 190);--s3-t4:oklch(80% .07 85);--s3-t5:oklch(68% .02 255);--s3-ink:oklch(99% 0 0);--s3-rail:color-mix(in oklab, currentColor 7%, transparent);perspective:1100px;gap:18px;padding:8px 4px 4px;display:grid}.dark .cs-stack3d,.portal.dark .cs-stack3d{--s3-high:oklch(68% .19 25);--s3-medium:oklch(80% .14 75);--s3-low:oklch(76% .12 190);--s3-t0:oklch(62% .12 230);--s3-t1:oklch(78% .12 80);--s3-t2:oklch(55% .03 255);--s3-t3:oklch(78% .12 175)}.cs-stack3d-row{animation:.7s cubic-bezier(.2,.8,.2,1) both s3-in;animation-delay:var(--d);grid-template-columns:minmax(120px,220px) 1fr auto;align-items:center;gap:16px;display:grid}.cs-stack3d-label{text-align:right;color:var(--text-secondary,currentColor);font-size:14px;line-height:1.35}.cs-stack3d-total{font-variant-numeric:tabular-nums;min-width:2.5ch;font-size:15px;font-weight:600}.cs-stack3d-rail{background:linear-gradient(180deg, var(--s3-rail), transparent);height:46px;box-shadow:inset 0 1px 0 color-mix(in oklab, currentColor 8%, transparent);transform-style:preserve-3d;border-radius:10px;position:relative;transform:rotateX(18deg)}.cs-stack3d-bar{min-width:4px;height:100%;transform-style:preserve-3d;filter:drop-shadow(0 14px 14px oklch(20% .05 255/.28));transform-origin:0;animation:.9s cubic-bezier(.2,.8,.2,1) both s3-grow;animation-delay:var(--d);border-radius:10px;display:flex;position:relative;overflow:visible}.cs-stack3d-legend i{--c:var(--s3-t0)}.cs-stack3d-seg{--c:var(--s3-t0);min-width:6px;color:var(--s3-ink);background:linear-gradient(180deg, oklch(100% 0 0/.38) 0%, oklch(100% 0 0/.08) 38%, oklch(0% 0 0/.18) 100%), var(--c);flex-basis:0;place-items:center;transition:transform .25s,filter .25s;display:grid;position:relative;box-shadow:inset -1px 0 oklch(100% 0 0/.35),inset 0 -6px 10px oklch(0% 0 0/.18)}.cs-stack3d-seg:before{content:"";background:linear-gradient(180deg, oklch(100% 0 0/.55), oklch(100% 0 0/.15)), var(--c);transform-origin:0 100%;opacity:.9;height:9px;position:absolute;inset:-9px 0 auto;transform:skew(-40deg)}.cs-stack3d-seg:after{content:"";animation:5.5s ease-in-out infinite s3-sheen;animation-delay:var(--d);pointer-events:none;background:linear-gradient(105deg,#0000 35%,oklch(100% 0 0/.35) 50%,#0000 65%) 0 0/260% 100%;position:absolute;inset:0}.cs-stack3d-seg:first-child,.cs-stack3d-seg:first-child:before{border-top-left-radius:10px}.cs-stack3d-seg:first-child{border-bottom-left-radius:10px}.cs-stack3d-seg:last-child{border-top-right-radius:10px;border-bottom-right-radius:10px}.cs-stack3d-seg:hover{filter:brightness(1.08);z-index:1;transform:translateY(-4px)}.cs-stack3d-seg em{z-index:1;white-space:nowrap;text-overflow:clip;text-shadow:0 1px 2px oklch(0% 0 0/.35);max-width:100%;padding:0 6px;font-size:12.5px;font-style:normal;position:relative;overflow:hidden}.cs-stack3d-seg em b{font-weight:700}.cs-stack3d [data-tone=high]{--c:var(--s3-high)}.cs-stack3d [data-tone=medium]{--c:var(--s3-medium)}.cs-stack3d [data-tone=low]{--c:var(--s3-low)}.cs-stack3d [data-tone="1"]{--c:var(--s3-t1)}.cs-stack3d [data-tone="2"]{--c:var(--s3-t2)}.cs-stack3d [data-tone="3"]{--c:var(--s3-t3)}.cs-stack3d [data-tone="4"]{--c:var(--s3-t4)}.cs-stack3d [data-tone="5"]{--c:var(--s3-t5)}.cs-stack3d-legend{color:var(--text-secondary,currentColor);flex-wrap:wrap;justify-content:center;gap:18px;font-size:13px;display:flex}.cs-stack3d-legend span{align-items:center;gap:7px;display:inline-flex}.cs-stack3d-legend i{background:linear-gradient(180deg, oklch(100% 0 0/.4), transparent), var(--c);border-radius:4px;width:14px;height:14px;box-shadow:0 3px 6px oklch(0% 0 0/.2)}@keyframes s3-grow{0%{opacity:0;transform:scaleX(.02)}to{opacity:1;transform:none}}@keyframes s3-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes s3-sheen{0%,70%{background-position:130% 0}to{background-position:-130% 0}}@media (width<=640px){.cs-stack3d-row{grid-template-columns:1fr auto}.cs-stack3d-label{text-align:left;grid-column:1/-1}.cs-stack3d-rail{height:38px;transform:none}}@media (prefers-reduced-motion:reduce){.cs-stack3d-row,.cs-stack3d-bar,.cs-stack3d-seg:after{animation:none}.cs-stack3d-seg:hover{transform:none}}.cs-stack3d-lead{background:color-mix(in oklab, var(--s3-low) 12%, transparent);border:1px solid color-mix(in oklab, var(--s3-low) 35%, transparent);border-radius:12px;margin:0 0 4px;padding:12px 14px;font-size:14px;line-height:1.5}.cs-stack3d-label small{opacity:.8;margin-top:2px;font-size:12.5px;display:block}a.cs-stack3d-row{color:inherit;border-radius:12px;margin:-6px -8px;padding:6px 8px;text-decoration:none;transition:background .2s}a.cs-stack3d-row:hover,a.cs-stack3d-row:focus-visible{background:color-mix(in oklab, currentColor 6%, transparent)}a.cs-stack3d-row:focus-visible{outline:2px solid var(--s3-low);outline-offset:2px}.cs-stack3d-total{justify-items:end;gap:4px;display:grid}.cs-stack3d-action{white-space:nowrap;color:var(--s3-low);align-items:center;gap:4px;font-size:12.5px;font-weight:600;display:inline-flex}.cs-stack3d-action svg{width:14px;height:14px;transition:transform .2s}a.cs-stack3d-row:hover .cs-stack3d-action svg{transform:translate(3px)}