.accessory-panel{border-top:1px solid #dbcdc4;margin:27px 0;padding:25px 0 22px;border-bottom:1px solid #dbcdc4}.accessory-panel .step-title{margin-bottom:7px}.accessory-editing{font-size:10px;color:#9f7976;margin:0 0 15px 26px}.metal-finishes{display:flex;gap:7px;margin-bottom:15px}.metal-choice{display:flex;align-items:center;justify-content:center;gap:6px;flex:1;padding:10px 4px;border:1px solid #dfd2c6;background:#f9f6f2;border-radius:2px;font-size:8px;color:#8c7373}.metal-choice i{width:14px;height:14px;border-radius:50%;box-shadow:inset -1px -1px 2px #0002;background:linear-gradient(135deg,#976520,#f8e0a0,#c79d43)}.metal-silver i{background:linear-gradient(135deg,#9297a3,#fff,#a4a9b4)}.metal-antique i{background:linear-gradient(135deg,#44464b,#b7bac1,#696b72)}.metal-choice.selected{border-color:#9b7772;box-shadow:inset 0 0 0 1px #9b777230;background:#eee1dc}.finding-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.finding-card{padding:9px 5px;background:#faf7f3;border:1px solid #e0d3c8;display:flex;align-items:center;flex-direction:column;border-radius:2px;transition:transform .3s,background .3s;position:relative;color:#80646d;min-height:145px}.finding-card:hover{transform:translateY(-3px);background:#fffbf7}.finding-card.applied{border-color:#aa7c7c;background:#eee0dc}.finding-picture{display:block;width:58px;height:58px;filter:drop-shadow(0 3px 2px #78535320)}.finding-picture svg{width:100%;height:100%}.finding-card strong{font-size:10px;font-weight:500;margin:5px 0;text-align:center}.finding-card small{font-size:8px;color:#a48c83}.finding-action{font-size:9px;border-top:1px solid #ddcfc440;width:80%;text-align:center;padding:8px 0 0;margin-top:6px}.accessory-how{line-height:1.8!important;margin:13px 0}.blossom-preset{display:flex;align-items:center;gap:13px;width:100%;border:1px solid #e2c9cc;background:linear-gradient(120deg,#f6e5e9,#f8f1e8);padding:10px 14px;border-radius:3px;color:#9a6375;margin:15px 0;font-size:11px;text-align:left}.blossom-preset svg{width:40px;height:40px;flex-shrink:0}.blossom-preset:hover{box-shadow:0 5px 20px #a96e8515}.finding-summary{margin-top:19px}.finding-summary>strong{font-size:10px;font-weight:500;color:#8a6870}.finding-summary>p{font-size:9px;color:#a28a82}.finding-summary-row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e6d9cf;padding:5px 0;gap:8px}.finding-summary-row>button:first-child{display:flex;align-items:center;gap:8px;border:0;background:none;text-align:left;font-size:9px;color:#927477;padding:0;flex:1}.finding-summary-row svg{width:28px;height:28px;flex-shrink:0}.remove-finding{border:0;background:none;font-size:18px;color:#a08b8b;padding:5px 8px}.clear-findings{border:0;background:none;padding:10px 0 0;font-size:9px;text-decoration:underline;color:#a18a88}.finding-on-ring{position:absolute;left:var(--x);top:var(--y);width:var(--finding-size);aspect-ratio:1;transform:translate(-50%,-50%) rotate(var(--orientation));padding:0;border:0;background:none;z-index:3;filter:drop-shadow(0 1px 1px #6f51403b);border-radius:50%;cursor:pointer;animation:accessory-arrive .4s ease-out}.finding-on-ring svg{display:block;width:100%;height:100%;overflow:visible}.finding-on-ring:hover{filter:drop-shadow(0 2px 3px #6f514080);outline:1px dashed #b18d73;outline-offset:2px}.finding-caps{pointer-events:auto;z-index:4}.finding-tassel{transform:translate(-50%,-15%) rotate(calc(var(--orientation) - 90deg));transform-origin:50% 15%;width:calc(var(--finding-size)*.9);height:calc(var(--finding-size)*2.8);aspect-ratio:auto}.finding-tassel svg{height:100%;width:100%}.jewel-stage{overflow:visible}.controls>.step-title:has(h3){scroll-margin-top:25px}@keyframes accessory-arrive{from{opacity:0;scale:.65}to{opacity:1;scale:1}}@media(max-width:760px){.metal-choice{font-size:8px;padding:11px 3px;gap:4px}.metal-choice i{width:12px;height:12px}.finding-card{min-height:145px}.finding-picture{width:58px;height:58px}.finding-card strong{font-size:9px}.accessory-panel .step-title h3{font-size:24px}.accessory-panel .step-extra{font-size:7px}.finding-summary-row>button:first-child{font-size:9px;line-height:1.6}.blossom-preset{font-size:10px}.remove-finding{min-width:34px;min-height:34px}}@media(prefers-reduced-motion:reduce){.finding-on-ring{animation:none}}

.finding-photo{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.finding-workflow{display:flex;gap:8px;justify-content:space-between;font-size:10px;color:#98787e;padding:14px 0 20px}.photo-finding-cards .finding-card{min-height:145px;border-radius:10px}.photo-finding-cards .finding-picture{width:65px;height:65px}.finding-card.chosen-finding{border-color:#9d6f83;background:#f2e4e5;box-shadow:inset 0 0 0 1px #b18d9c}.placement-box{padding:15px;background:#eee6dd;border-radius:8px;margin-top:15px}.placement-box p{font-size:11px;line-height:1.8;margin:0 0 12px}.place-on-preview{display:block;background:none;border:0;color:#886275;font-size:11px;padding:13px 0 0;margin:auto}.placing-finding .bead{outline:1px dashed #b48498;outline-offset:3px;cursor:crosshair}.placing-finding .bead:hover{outline:3px solid #a66f89;filter:drop-shadow(0 0 6px #bd8296)}.finding-on-ring.selected-finding{outline:2px solid #a97c93;outline-offset:3px}.selected-finding-tools{border:1px solid #d8bbc8;border-radius:8px;padding:13px;margin-top:15px;background:#f2e6e9}.selected-finding-tools strong{font-size:11px;font-weight:500}.selected-finding-tools>div{display:flex;gap:7px;margin-top:10px}.selected-finding-tools button{flex:1;border:1px solid #dac8d0;background:#fffbf7;padding:10px 5px;color:#7c586a;font-size:11px}.finding-presets{display:flex;flex-direction:column;gap:5px}.finding-presets>button:last-child{background:none;border:0;text-decoration:underline;color:#8a6576;font-size:11px;padding:8px}.finding-presets>button:disabled{opacity:.4;cursor:default}.finding-summary-row img{width:32px;height:32px}.blossom-preset>img{width:38px;height:38px}.finding-tassel{width:calc(var(--finding-size)*1.2);height:calc(var(--finding-size)*2.3);transform:translate(-50%,-12%) rotate(0deg);transform-origin:50% 12%}.finding-tassel img{height:100%;object-fit:contain}.finding-caps img{transform:rotate(90deg);object-fit:contain}.finding-spacer img{filter:drop-shadow(0 1px 1px #59403440)}.finding-blossom{z-index:5}.finding-photo{filter:drop-shadow(0 2px 1px #6a50501c)}@media(max-width:760px){.photo-finding-cards .finding-card{min-height:140px}.photo-finding-cards .finding-card strong{font-size:11px}.finding-workflow{font-size:10px;gap:5px}.placement-box .button{min-height:48px}}

.finding-caps img{transform:rotate(135deg)}

.photo-finding-cards+.accessory-editing+.metal-finishes{display:none}.photo-finding-cards .finding-picture{width:82px;height:82px}.photo-finding-cards .finding-card{min-height:165px}.photo-finding-cards strong{line-height:1.6;text-align:center}
/* Project the photographed cap edge-on, along the thread tangent. The stone
   occludes the inside edge so the cap sits around it rather than on its face. */
.design-ring .bead.textured{z-index:2}
.design-ring .finding-caps{z-index:1;border-radius:0;filter:drop-shadow(0 1px 1px #59463470);animation:cap-settle .35s ease-out}
.design-ring .finding-caps img{width:140%;height:140%;max-width:none;margin:-20%;object-fit:contain;transform:scaleX(.26);filter:contrast(1.08) drop-shadow(1px 0 1px #69472555)}
.design-ring .finding-caps:hover,.design-ring .finding-caps.selected-finding{outline:none;filter:drop-shadow(0 1px 2px #a7895770)}
.design-ring .bead.textured.active{outline:1px solid #9a7b60;outline-offset:3px;z-index:2}
.design-ring .bead.textured.active:before{display:none}
.design-ring .finding-caps:focus-visible{outline:1px dashed #96734d;outline-offset:1px}
@keyframes cap-settle{from{opacity:0}to{opacity:1}}
.design-ring .finding-caps{z-index:3;filter:drop-shadow(0 1px .6px #41373555)}
.design-ring .finding-caps svg{width:100%;height:100%;overflow:visible}
.design-ring .finding-caps.selected-finding{outline:none}
.design-ring .bead.textured.active{outline:none;filter:drop-shadow(0 2px 2px #67424c35)}
.design-ring .bead.textured.active:after{display:block;content:'';inset:14%;border:1px solid #bca48599;background:none;opacity:.65}
@media(prefers-reduced-motion:reduce){.design-ring .finding-caps{animation:none}}
.design-ring .bead.textured.active:after{display:none}

/* A shape catalog, with a separate choice of how it is threaded. */
.finding-atlas-piece{display:block;width:100%;height:100%;background-image:url('assets/findings-distinct-12-v1.png');background-size:400% 300%;background-repeat:no-repeat;flex-shrink:0;pointer-events:none}
.finding-style-filters{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 14px}
.finding-style-filters button{min-height:36px;padding:7px 10px;border:1px solid #b89d8659;background:#fcf8f2;color:#8b6c76;font-size:10px;border-radius:2px}
.finding-style-filters button[aria-pressed=true]{color:#fff8f3;background:#76515f;border-color:#76515f}
.finding-cards.distinct-finding-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.distinct-finding-cards .finding-card{min-height:142px;padding:9px 6px 10px;border-radius:3px;justify-content:flex-start}
.distinct-finding-cards .finding-picture{width:min(84px,100%);height:auto;aspect-ratio:1;filter:drop-shadow(0 3px 2px #78535315)}
.distinct-finding-cards .finding-card strong{font-size:11px;line-height:1.5;margin:7px 0 3px;font-weight:500}
.distinct-finding-cards .finding-card small{font-size:9px;line-height:1.4;margin-top:auto;color:#9a7e80}
.finding-placement-modes{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:18px 0 12px}
.finding-placement-modes button{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;padding:12px 8px;border:1px solid #b99b826b;border-radius:3px;background:#fcf8f2;color:#8b6976;text-align:center;min-height:120px}
.finding-placement-modes button[aria-pressed=true]{border-color:#946c7a;background:#f0e3e3;box-shadow:inset 0 0 0 1px #b28c9a65}
.placement-sketch{display:block;font:22px Georgia,serif;letter-spacing:2px;color:#b39362;line-height:1.3}
.finding-placement-modes strong{font-size:11px;font-weight:500}
.finding-placement-modes small{font-size:9px;line-height:1.6;color:#9c8286;max-width:160px}
.finding-selection-line{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;font-size:11px;line-height:1.6;padding:10px 1px;color:#84616e}
.finding-selection-line>span{min-width:0}
.finding-selection-line>strong{white-space:nowrap;font-size:12px;font-weight:500;color:#684651}
.finding-selection-line small{font-size:9px;font-weight:400}
.finding-selection-line strong{font-weight:500}
.finding-summary-row .finding-atlas-piece{width:33px;height:33px}
.finding-summary-row>button:first-child>span:last-child{line-height:1.6}
.finding-summary-row small{display:block;color:#ad9095;font-size:9px;margin-top:2px}
.blossom-preset>.finding-atlas-piece{width:40px;height:40px}
.finding-presets .blossom-preset{font-size:11px;line-height:1.6}
.design-ring .finding-caps,.design-ring .finding-spacer{clip-path:inset(0 25% 0 25%);border-radius:0;z-index:3;filter:drop-shadow(0 1px .6px #41373555)}
.design-ring .finding-caps:hover,.design-ring .finding-spacer:hover,.design-ring .finding-caps.selected-finding,.design-ring .finding-spacer.selected-finding{outline:none;filter:brightness(1.12) drop-shadow(0 0 1.5px #97723f)}
.design-ring .finding-caps:focus-visible,.design-ring .finding-spacer:focus-visible{outline:1px dashed #8d654f;outline-offset:-2px}
.design-ring .finding-spacer svg{width:100%;height:100%;display:block}
@media(max-width:760px){
 .distinct-finding-cards .finding-card{min-height:137px}
 .distinct-finding-cards .finding-picture{width:min(78px,100%)}
 .distinct-finding-cards .finding-card strong{font-size:10px}
 .finding-style-filters{gap:5px}
 .finding-style-filters button{font-size:10px;padding:7px 8px;min-height:38px}
 .finding-placement-modes button{min-height:124px;padding:11px 6px}
 .finding-placement-modes strong{font-size:11px}
 .finding-placement-modes small{font-size:9px}
 .finding-selection-line{font-size:10px}
 .finding-selection-line>strong{font-size:11px}
}
@media(max-width:360px){
 .finding-cards.distinct-finding-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .distinct-finding-cards .finding-picture{width:80px}
 .finding-style-filters button{font-size:9px;padding:7px 6px}
 .finding-placement-modes{gap:6px}
 .finding-placement-modes small{font-size:8px}
}