.design-studio{display:grid;grid-template-columns:.75fr 1.1fr 1fr;gap:5%;align-items:center;padding:78px 6%;background:#f0e9ee;border-top:1px solid #dfd3df;border-bottom:1px solid #dfd3df}.studio-intro p{color:var(--muted)}.studio-status{display:inline-block;margin-top:8px;padding:7px 11px;border:1px solid #cab9ca;font-size:11px;letter-spacing:.08em}.studio-preview{text-align:center}.bracelet-preview{position:relative;width:min(36vw,420px);aspect-ratio:1;margin:auto;border-radius:50%;background:radial-gradient(circle,transparent 0 43%,rgba(255,255,255,.62) 44% 60%,transparent 61%);filter:drop-shadow(0 15px 20px rgba(62,40,61,.13))}.bracelet-bead{position:absolute;left:50%;top:50%;width:13%;aspect-ratio:1;border-radius:50%;background:var(--bead);border:1px solid rgba(71,53,72,.16);box-shadow:inset -5px -7px 10px #412c4221,inset 4px 4px 8px #ffffffa6;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-285%) rotate(calc(-1 * var(--angle)))}.bracelet-bead[data-kind=gold]{width:7%;box-shadow:inset -3px -4px 5px #3f2a1438,0 0 0 2px #d6bd7c}.studio-preview>p{font:30px Cormorant Garamond,serif;margin:16px 0 0}.studio-preview small{color:var(--muted)}.studio-controls fieldset{border:0;border-top:1px solid #d4c6d4;padding:17px 0;margin:0}.studio-controls legend{font-size:13px;font-weight:600;letter-spacing:.04em;padding:0 12px 0 0}.choice-row{display:flex;gap:8px;flex-wrap:wrap}.choice,.bead-picker button{background:#ffffff8c;border:1px solid #cdbfcd;padding:9px 12px;cursor:pointer;color:var(--ink)}.choice.active{background:var(--violet);color:#fff;border-color:var(--violet)}.bead-picker{display:grid;grid-template-columns:1fr 1fr;gap:8px}.bead-picker button{display:flex;align-items:center;text-align:left;font-size:12px}.bead-picker i{width:22px;height:22px;flex:0 0 22px;margin-right:8px;border-radius:50%;background:var(--bead);border:1px solid rgba(70,50,70,.15);box-shadow:inset -2px -2px 4px #46324621}.studio-actions{display:flex;gap:8px;margin:14px 0}.studio-actions .secondary{background:#ffffff8c}@media(max-width:1000px){.design-studio{grid-template-columns:1fr 1fr}.studio-intro{grid-column:1/-1}.bracelet-preview{width:min(44vw,390px)}}@media(max-width:760px){nav{overflow-x:auto;justify-content:flex-start;gap:22px}nav a{white-space:nowrap}.design-studio{grid-template-columns:1fr;padding:50px 6%}.bracelet-preview{width:min(82vw,380px)}.bead-picker{grid-template-columns:1fr 1fr}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/studio.css.map */