.ring-scene{--ring-w:min(clamp(12.5rem, 9.7rem + 11.4vw, 19rem), max(10rem, 34svh));--ring-stage-h:calc(var(--ring-w) * 1.5);--ring-name-lh:1.5625rem;--ring-foot-h:calc(2 * var(--ring-name-lh) + 1.5rem + 1.3125rem + .5rem);background:var(--color-bg);padding-block:3rem}@media (min-width:40rem){.ring-scene{padding-block:4rem}}@media (min-width:48rem){.ring-scene{--ring-name-lh:1.875rem}}@media (min-width:64rem){.ring-scene{--ring-stage-h:calc(var(--ring-w) * 1.75)}}.ring-head{text-align:center;flex-direction:column;align-items:center;gap:.75rem;margin-bottom:2rem;display:flex}.ring-intro{max-width:42rem;color:var(--color-fg-muted)}.ring-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}@media (min-width:48rem){.ring-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}}@media (min-width:64rem){.ring-list{grid-template-columns:repeat(4,minmax(0,1fr))}}.ring-card{border:1px solid var(--color-border);background:var(--color-surface-2);color:var(--color-fg);border-radius:.875rem;flex-direction:column;transition:border-color .2s;display:flex}@media (hover:hover){.ring-card:hover{border-color:var(--color-card-hover-border)}}.ring-scene:not([data-ring]) .ring-card{justify-content:center;height:100%;min-height:2.75rem;padding:.5rem .75rem}.ring-card-text{flex-direction:column;gap:.125rem;display:flex}.ring-card-name{font-family:var(--font-heading);font-size:.9375rem;font-weight:600;line-height:1.3}@media (min-width:48rem){.ring-card-name{font-size:1rem}}.ring-card-price{color:var(--color-price);font-variant-numeric:tabular-nums;font-size:.875rem}.ring-more{text-align:center;margin-top:2rem}@media (scripting:enabled) and (prefers-reduced-motion:no-preference){.ring-scene[data-ring-planned] .ring-head{margin-bottom:0}.ring-scene[data-ring-planned] .ring-more{margin-top:1.5rem}.ring-scene[data-ring-planned] .ring-stage{margin-inline:-.25rem;padding-inline:.25rem}.ring-scene[data-ring-planned]:not([data-ring]) .ring-stage{height:calc(var(--ring-stage-h) + var(--ring-foot-h));flex-direction:column;padding-block:.25rem;display:flex;overflow-y:auto}.ring-scene[data-ring-planned]:not([data-ring]) .ring-list{margin-block:auto}}
