.roh{display:block}.roh__figure{position:relative;width:100%;background:var(--rb-plate);border-radius:.4rem;overflow:visible}.roh__ring>img,.roh__ring>canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.roh__ring-canvas{z-index:1}.roh__tones{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"label swatches" "input input" "name name";align-items:center;gap:.8rem 1.2rem;margin-top:1.6rem}.roh__tones-label{grid-area:label;font-size:1.3rem;letter-spacing:.06em;text-transform:uppercase;color:var(--rb-muted, #6b6b6b)}.roh__swatches{grid-area:swatches;display:flex;gap:.6rem;flex-wrap:wrap}.roh__swatch{width:2.4rem;height:2.4rem;border-radius:50%;cursor:pointer;border:2px solid transparent;box-shadow:0 0 0 1px #0000002e inset;transition:transform .12s ease}.roh__swatch.on{border-color:var(--rb-gold, #b08d3f);transform:scale(1.12)}.roh__tone-input{grid-area:input;width:100%;accent-color:var(--rb-gold, #b08d3f)}.roh__tone-name{grid-area:name;font-size:1.3rem;color:var(--rb-muted, #6b6b6b)}@media(prefers-reduced-motion:reduce){.roh__swatch{transition:none}.roh__swatch.on{transform:none}}@media screen and (max-width:560px){.roh__tones{grid-template-columns:1fr;grid-template-areas:"label" "swatches" "input" "name"}}.roh__defs{position:absolute;width:0;height:0}.roh__figure{position:relative;width:100%;border-radius:.4rem;overflow:visible}.roh__plate{display:block;width:100%;height:auto}.roh__ring{position:absolute;pointer-events:none;will-change:transform}.roh__ring img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.roh__shadow{filter:brightness(0) blur(9px);opacity:.34;transform:translateY(5%);z-index:0}.roh__ring img[data-part]{z-index:1}.roh__ctl{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem 1.2rem;margin-top:1.2rem}.roh__ctl label{font-size:1.2rem;letter-spacing:.06em;text-transform:uppercase;color:var(--rb-muted, #6b6b6b);white-space:nowrap}.roh__ctl input[type=range]{width:100%;accent-color:var(--rb-gold, #b08d3f)}.roh__ctl input[type=range]:focus-visible{outline:2px solid var(--rb-gold, #b08d3f);outline-offset:3px}.roh__val{font-size:1.2rem;color:var(--rb-ink, #1c1c1c);white-space:nowrap;font-variant-numeric:tabular-nums;min-width:9rem;text-align:right}.roh__readout{margin-top:.8rem;font-size:1.3rem;color:var(--rb-muted, #6b6b6b)}@media screen and (max-width:560px){.roh__ctl{grid-template-columns:1fr;gap:.3rem}.roh__val{text-align:left;min-width:0}}.rb-hand{position:relative}.rb-hand[hidden]{display:none}.rb-angle--hand{display:flex;align-items:center;justify-content:center;width:auto;min-width:6.4rem;padding:0 1.2rem;aspect-ratio:auto;border:1px solid var(--rb-line, #d9d4c9);background:transparent;cursor:pointer}.rb-angle--hand[aria-pressed=true]{border-color:var(--rb-gold, #b08d3f)}.rb-angle__label{font-size:1.2rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
/*# sourceMappingURL=/cdn/shop/t/12/assets/ring-on-hand.css.map */