@property --sb-rx{syntax:"<number>";inherits:true;initial-value:0}@property --sb-ry{syntax:"<number>";inherits:true;initial-value:0}.sb-medal{--sb-shade:color-mix(in oklab, var(--color-ink) 62%, transparent);--sb-light:color-mix(in oklab, var(--color-brand) 30%, var(--color-paper));--sb-face:color-mix(in oklab, var(--color-brand) 70%, var(--color-selected));--sb-mark-face:color-mix(in oklab, var(--color-brand) 22%, var(--color-paper));aspect-ratio:1;width:100%;perspective:calc(var(--space-96) * 10);perspective-origin:50% 40%;pointer-events:none;-webkit-user-select:none;user-select:none;display:block;position:relative}.sb-medal-press{transform-style:preserve-3d;position:absolute;inset:0}.sb-medal-tilt{transform:rotateX(calc(var(--sb-rx) * 1deg)) rotateY(calc(var(--sb-ry) * 1deg));transition:transform var(--duration-cinematic) var(--ease-cinematic);position:absolute;inset:0}.sb-medal[data-tilting] .sb-medal-tilt,[data-tilting]>.sb-medal .sb-medal-tilt{transition-duration:var(--duration-slow);will-change:transform}.sb-medal-face{border-radius:50%;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.sb-medal-disc{fill:var(--color-brand)}.sb-medal-lines{color:color-mix(in oklab, var(--color-paper) 16%, transparent);mix-blend-mode:soft-light}.sb-medal-micro{color:color-mix(in oklab, var(--color-paper) 42%, transparent);font-family:var(--font-sans);letter-spacing:.06em}.sb-medal-band{color:color-mix(in oklab, var(--color-paper) 36%, transparent)}.sb-medal-arc{font-family:var(--font-sans);letter-spacing:.24em;word-spacing:.08em}.sb-relief-shade{color:var(--sb-shade)}.sb-relief-light{color:var(--sb-light)}.sb-relief-face{color:var(--sb-face)}.sb-medal-mark .sb-relief-face{color:var(--sb-mark-face)}.sb-medal-well{background:color-mix(in oklab, var(--color-fog) 70%, var(--color-paper));box-shadow:inset var(--space-4) var(--space-4) var(--space-8) color-mix(in oklab, var(--color-ink) 26%, transparent), inset calc(var(--border-hairline) * -2) calc(var(--border-hairline) * -2) 0 var(--color-paper), 0 0 0 var(--border-hairline) color-mix(in oklab, var(--color-ink) 7%, transparent);border-radius:50%;position:absolute;inset:-1.8%}.sb-medal-lip{box-shadow:inset var(--space-4) var(--space-4) var(--space-12) calc(var(--space-4) * -1) color-mix(in oklab, var(--color-ink) 42%, transparent);border-radius:50%;position:absolute;inset:.7%}.sb-medal-sheen,.sb-medal-sweep{mix-blend-mode:soft-light;border-radius:50%;position:absolute;inset:0;overflow:hidden}.sb-medal-sheen:before,.sb-medal-sweep:before{content:"";background:linear-gradient(105deg, transparent 38%, color-mix(in oklab, var(--color-paper) 55%, transparent) 50%, transparent 62%);position:absolute;inset:-30% -60%}.sb-medal-sheen:before{transform:translateX(calc(var(--sb-ry) * 2% - var(--sb-rx) * 1%));transition:transform var(--duration-cinematic) var(--ease-cinematic)}.sb-medal-sweep:before{transform:translate(-46%)}.sb-medal[data-tone=deep]{--sb-shade:color-mix(in oklab, var(--color-ink) 70%, transparent);--sb-light:color-mix(in oklab, var(--color-paper) 9%, transparent);--sb-face:color-mix(in oklab, var(--color-brand) 55%, var(--color-deep));--sb-mark-face:var(--sb-face);perspective:none}.sb-medal[data-tone=deep] .sb-medal-disc{fill:color-mix(in oklab, var(--color-brand) 48%, var(--color-deep))}.sb-medal[data-tone=deep] .sb-medal-lines{color:color-mix(in oklab, var(--color-paper) 7%, transparent);mix-blend-mode:normal}@media (prefers-reduced-motion:no-preference){.sb-medal[data-tone=foil] .sb-medal-press{animation:sb-medal-press var(--duration-cinematic) var(--ease-cinematic) var(--duration-micro) backwards}.sb-medal[data-tone=foil] :is(.sb-medal-well,.sb-medal-lip){animation:sb-medal-sink var(--duration-cinematic) var(--ease-cinematic) var(--duration-micro) backwards}.sb-medal[data-tone=foil] .sb-medal-sweep:before{animation:sb-medal-sweep var(--duration-cinematic) var(--ease-standard) calc(var(--duration-micro) + var(--duration-cinematic) * .7) both}}@keyframes sb-medal-press{0%{transform:translateZ(var(--space-48)) rotateX(-6deg) scale(1.03)}}@keyframes sb-medal-sink{0%{opacity:.25}}@keyframes sb-medal-sweep{0%{transform:translate(-46%)}to{transform:translate(46%)}}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference) and ((hover:none) or (pointer:coarse) or (max-width:1023px)){.sb-medal[data-tone=foil]{view-timeline:--sb-medal block}.sb-medal[data-tone=foil] .sb-medal-tilt{transition:none;animation:linear both sb-medal-tilt;animation-timeline:--sb-medal;animation-range:cover}.sb-medal[data-tone=foil] .sb-medal-sheen:before{transition:none;animation:linear both sb-medal-sheen;animation-timeline:--sb-medal;animation-range:cover}}}@keyframes sb-medal-tilt{0%{transform:rotateX(6deg)rotateY(-4deg)}to{transform:rotateX(-5deg)rotateY(4deg)}}@keyframes sb-medal-sheen{0%{transform:translate(-14%)}to{transform:translate(13%)}}@media (prefers-reduced-motion:reduce){.sb-medal-tilt,.sb-medal-sheen:before{transition:none}}@media (forced-colors:active){.sb-medal,.sb-floor{display:none}}@media print{.sb-medal,.sb-floor{display:none}}.sb-floor{aspect-ratio:1;pointer-events:none;width:100%;height:auto;display:block;overflow:visible}.sb-floor-shade{color:color-mix(in oklab, var(--color-ink) 9%, transparent)}.sb-floor-light{color:var(--color-paper)}.sb-floor-face{color:color-mix(in oklab, var(--color-fog) 45%, var(--color-paper))}
