.eb{width:100%;--esz:34px}.ebh{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.ebti{font-size:20px;font-weight:700;letter-spacing:-.02em;color:var(--tx)}
.ebs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:13.5px;color:var(--mu);margin-top:6px}.ebs b{color:var(--tx)}
.stk{display:inline-flex;gap:3px}.stk i{width:6px;height:14px;border-radius:3px;background:var(--ln)}.stk i.b{background:var(--g)}.stk i.m{background:var(--r)}
.key{display:inline-flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap}.key i{width:10px;height:10px;border-radius:50%;display:inline-block}
.key .ko{border:1.5px dashed var(--mu);background:color-mix(in srgb,var(--mu) 18%,transparent)}.key .ka{background:var(--g);margin-left:8px}.key .ka.n{background:var(--c1);margin-left:0}
.seg2{display:inline-flex;flex-shrink:0;background:color-mix(in srgb,var(--tx) 8%,transparent);border-radius:999px;padding:3px}
.seg2 button{all:unset;cursor:pointer;padding:7px 16px;border-radius:999px;font-size:13px;font-weight:600;color:var(--mu);white-space:nowrap;transition:.2s}
.seg2 button.on{background:var(--p);color:var(--tx);box-shadow:0 1px 4px rgba(0,0,0,.18)}
.ebc{margin-top:22px}.ecols{display:flex}.ecol{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center}
.etrack{position:relative;width:100%;height:190px;margin:calc(var(--esz)/2) 0}
.etrack::after{content:"";position:absolute;left:12%;right:12%;bottom:calc(var(--esz)/-2 - 10px);border-bottom:1px solid color-mix(in srgb,var(--mu) 18%,transparent)}
.edot{position:absolute;left:50%;width:var(--esz);height:var(--esz);border-radius:50%;transform:translate(-50%,-50%) scale(.3);opacity:0;animation:epop .55s cubic-bezier(.2,1.4,.4,1) forwards;animation-delay:var(--d)}
.edot.est{border:2px dashed color-mix(in srgb,var(--mu) 85%,transparent);background:color-mix(in srgb,var(--mu) 16%,transparent);box-sizing:border-box}
.edot.act{animation-delay:calc(var(--d) + 120ms)}.edot.act.b{background:var(--g);box-shadow:0 0 0 4px color-mix(in srgb,var(--g) 18%,transparent),0 0 22px color-mix(in srgb,var(--g) 45%,transparent)}
.edot.act.m{background:var(--r);box-shadow:0 0 0 4px color-mix(in srgb,var(--r) 18%,transparent),0 0 22px color-mix(in srgb,var(--r) 45%,transparent)}
.edot.act.n{background:var(--c1);box-shadow:0 0 18px color-mix(in srgb,var(--c1) 40%,transparent)}
@keyframes epop{to{transform:translate(-50%,-50%) scale(1);opacity:1}}
.elab{display:flex;flex-direction:column;align-items:center;gap:5px;margin-top:14px;text-align:center}
.eq{font-size:12.5px;color:var(--mu);font-weight:500}.ev{font-size:16px;font-weight:700;color:var(--tx);white-space:nowrap}
.epill{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap}
.epill.b{color:var(--g);background:color-mix(in srgb,var(--g) 15%,transparent)}.epill.m{color:var(--r);background:color-mix(in srgb,var(--r) 15%,transparent)}
.epill.n,.epill.u{color:var(--mu);background:color-mix(in srgb,var(--mu) 13%,transparent)}
.ecol.nx .ev{color:var(--mu);font-weight:600}
.ebn{font-size:12px;color:var(--mu);margin-top:14px;line-height:1.45}
@media(max-width:560px){.eb{--esz:22px}.etrack{height:150px}.ev{font-size:13px}.eq{font-size:11px}.epill{font-size:10px;padding:2px 6px}.ebti{font-size:18px}.seg2 button{padding:6px 11px;font-size:12px}}
/* r2: expected ring always drawn ABOVE the actual so small surprises never hide it */
.edot.est{z-index:2;border:2.5px dashed color-mix(in srgb,var(--tx) 70%,transparent);background:color-mix(in srgb,var(--mu) 14%,transparent)}
.edot.act{z-index:1}.etrack{height:170px}
.ecol .etrack .edot.act+.edot,.ecol .edot.est{backdrop-filter:none}
@media(max-width:560px){.etrack{height:140px}.edot.est{border-width:2px}}
.pm{display:none}
@media(max-width:560px){.pw{display:none}.pm{display:inline}.epill{padding:2px 7px}.ev{font-size:13.5px}.ebs{font-size:12.5px}.ebh{align-items:center}}
/* r4 polish */
.ebs{flex-wrap:nowrap;align-items:flex-start}.stk{margin-top:3px}.ebst{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.ev,.eq{font-variant-numeric:tabular-nums}.ev{font-size:17px;letter-spacing:-.01em}
.ecol{border-radius:14px;transition:background .2s;padding-bottom:10px}.ecol:hover{background:color-mix(in srgb,var(--tx) 4%,transparent)}
.ecol:hover .edot.act{filter:brightness(1.1)}.edot{transition:top .5s cubic-bezier(.3,.8,.3,1)}
.etrack::after{left:18%;right:18%}
@media(max-width:560px){.ev{font-size:14px}.ecol{border-radius:10px}}
/* r5: value text */
.ev{color:var(--tx)}.ex{font-size:13px;color:var(--mu);font-weight:500;white-space:nowrap;margin-top:-2px}
.ecol.nx .ev.ex2{color:var(--mu)}
.slab{position:absolute;transform:translateY(-50%);font-size:11.5px;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums;opacity:0;animation:efade .4s ease forwards;animation-delay:calc(var(--d) + 300ms);pointer-events:none}
.slab.ar{left:calc(50% + var(--esz)/2 + 7px);color:var(--tx)}.slab.ar.b{color:var(--g)}.slab.ar.m{color:var(--r)}
.slab.el{right:calc(50% + var(--esz)/2 + 7px);color:var(--mu)}
@keyframes efade{to{opacity:1}}
@media(max-width:560px){.slab{display:none}.ex{font-size:11.5px}}
@media(max-width:560px){.ev .pm,.ex .pm{display:block;font-size:9.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);margin-bottom:1px}.ev{font-size:14px;line-height:1.15}.ex{font-size:12px;line-height:1.15;margin-top:2px}.elab{gap:6px}}
