.sb-root{--sb-hi:var(--sr-gold-2);--sb-lo:var(--sr-gold-3)}.sb-root[data-kind=hp]{--sb-hi:#ff6b57;--sb-lo:#8a0f14}.sb-root[data-kind=mp]{--sb-hi:#5db4ff;--sb-lo:#10408f}.sb-trough{background-color:var(--sr-shade);border:1px solid var(--sr-foil-3);height:1.125rem;box-shadow:inset 0 2px 4px #0009, 0 0 0 1px color-mix(in srgb, var(--sr-foil-2) 35%, transparent), 0 0 14px -4px var(--sr-glow);margin-top:.375rem;padding:2px;position:relative}.sb-fill{background-image:linear-gradient(180deg, #ffffff8c 0%, #ffffff14 46%, #0000002e 54%, #0000006b 100%), linear-gradient(90deg, var(--sb-lo) 0%, var(--sb-hi) 100%);width:100%;height:100%;box-shadow:0 0 10px -2px var(--sb-hi);position:relative}.sb-cap{background-image:linear-gradient(135deg, var(--sr-foil-hi), var(--sr-foil-3));width:.5rem;height:.5rem;position:absolute;top:50%;transform:translateY(-50%)rotate(45deg)}.sb-cap-start{left:-.3125rem}.sb-cap-end{right:-.3125rem}