:root{--cb-bg:#fff;--cb-card:#f2f2f7;--cb-qty:#e5e5ea;--cb-text:#363638;--cb-muted:#5f6064;--cb-black:#000}
.a2n-charm-builder{width:100%;max-width:1500px;margin:0 auto;padding:32px 24px 110px;box-sizing:border-box;color:var(--cb-text);font-family:inherit}
.a2n-builder-main{display:grid;grid-template-columns:minmax(440px,1fr) minmax(520px,1fr);gap:24px;align-items:start}
.a2n-preview{position:sticky;top:20px;min-width:0}.a2n-reference{background:#f2f2f7;border-radius:16px;overflow:hidden;box-shadow:0 12px 30px rgba(0,0,0,.08);width:100%;aspect-ratio:1/1}.a2n-reference-media{position:relative;width:100%;height:100%;overflow:hidden;cursor:crosshair}.a2n-base-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}.a2n-base-placeholder{position:absolute;inset:0;display:grid;place-items:center;color:#777;text-align:center;padding:30px}
.a2n-points-layer{position:absolute;inset:0;pointer-events:none}.a2n-point{position:absolute;transform:translate(-50%,-50%);width:18px;height:18px;border:1px solid rgba(0,0,0,.2);border-radius:50%;background:rgba(255,255,255,.7);opacity:0;pointer-events:auto;z-index:4;transition:opacity .12s,transform .12s}.a2n-dragging .a2n-point{opacity:.9}.a2n-point.a2n-over{background:#000;transform:translate(-50%,-50%) scale(1.25)}
.a2n-preview-charms{position:absolute;inset:0;pointer-events:none}.a2n-preview-charm{position:absolute;width:20%;aspect-ratio:1/1;transform:translate(-50%,-50%);z-index:6;pointer-events:auto;touch-action:none;cursor:grab;user-select:none}.a2n-preview-charm img{display:block;width:100%;height:100%;object-fit:contain;transform:translateY(18.75%) scale(.75);transform-origin:center center;filter:drop-shadow(0 3px 4px rgba(0,0,0,.12));pointer-events:none}.a2n-preview-charm:active{cursor:grabbing}.a2n-preview-charm.a2n-selected:after{content:'';position:absolute;inset:-3px;border:1px solid rgba(0,0,0,.18);border-radius:50%;pointer-events:none}.a2n-remove{position:absolute;right:-2px;top:-2px;width:24px;height:24px;border:0;border-radius:50%;background:#fff;color:#111;box-shadow:0 2px 8px rgba(0,0,0,.15);font-size:18px;line-height:24px;opacity:0;cursor:pointer}.a2n-preview-charm:hover .a2n-remove,.a2n-preview-charm.a2n-selected .a2n-remove{opacity:1}
.a2n-controls{min-width:0}.a2n-collection-list{width:100%}.a2n-ui-title{font-size:48px;line-height:1.02;letter-spacing:-1.8px;margin:0 0 2px;font-weight:750}.a2n-ui-description{font-size:15px;line-height:1.35;margin:0 0 20px;color:#454549}.a2n-collection{margin:0 0 16px}.a2n-collection-heading h2{font-size:32px;line-height:1.05;letter-spacing:-.8px;margin:0 0 12px;font-weight:750}.a2n-collection-heading p{margin:-5px 0 10px;color:#666;font-size:14px}.a2n-filter-list{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}.a2n-filter-chip{appearance:none;border:1px solid #333;background:#fff;color:#222;border-radius:8px;padding:7px 15px;font-size:14px;line-height:1.1;cursor:pointer}.a2n-filter-chip.is-active{background:#000;color:#fff;border-color:#000}.a2n-scroll-shell{position:relative}.a2n-charm-list{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth;padding:0 0 2px}.a2n-charm-list::-webkit-scrollbar{display:none}.a2n-scroll-button{position:absolute;z-index:10;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:26px;line-height:42px;display:grid;place-items:center;cursor:pointer;box-shadow:0 5px 18px rgba(0,0,0,.15)}.a2n-scroll-button[hidden]{display:none}.a2n-scroll-prev{left:-14px}.a2n-scroll-next{right:-14px}
.a2n-charm-card{position:relative;flex:0 0 116px;min-height:188px;padding:9px 8px 8px;box-sizing:border-box;border:2px solid transparent;border-radius:16px;background:#f2f2f7;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;cursor:grab;user-select:none;touch-action:none;transition:border-color .12s,background .12s,transform .12s}.a2n-charm-card:hover{transform:translateY(-1px)}.a2n-charm-card.a2n-active{border-color:#000}.a2n-card-name{font-size:14px;font-weight:650;line-height:1.05;text-align:center;min-height:29px;display:flex;align-items:flex-start;justify-content:center;width:100%;margin:0 0 4px}.a2n-card-image{width:80px;height:80px;display:flex;align-items:center;justify-content:center}.a2n-card-image img{width:100%;height:100%;object-fit:contain;display:block}.a2n-charm-card small{font-size:13px;line-height:1.1;margin:5px 0 8px;color:#454549}.a2n-quantity{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:auto;width:100%}.a2n-qvalue{font-size:14px;min-width:10px;text-align:center}.a2n-quantity button{width:36px;height:36px;padding:0;border:0;border-radius:50%;background:#e5e5ea;color:#222;display:grid;place-items:center;font-size:20px;line-height:1;cursor:pointer}.a2n-quantity button:hover:not(:disabled){background:#d4d4da}.a2n-quantity button:disabled{opacity:.28;cursor:default}
.a2n-toolbar-container{margin-top:22px}.a2n-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;background:rgba(255,255,255,.72);backdrop-filter:blur(10px) saturate(150%);border-radius:16px;padding:8px;box-shadow:0 8px 24px rgba(0,0,0,.08);position:sticky;bottom:12px;z-index:20}.a2n-toolbar-left{display:flex;align-items:center;gap:8px}.a2n-reset{width:42px;height:42px;border:0;background:transparent;border-radius:50%;display:grid;place-items:center;cursor:pointer}.a2n-reset svg{width:21px;height:21px;fill:currentColor}.a2n-reset:hover{background:#f2f2f7}.a2n-total{display:inline-flex;align-items:center;gap:6px;padding-inline:12px;white-space:nowrap;font-size:14px}.a2n-total-price{font-size:14px;line-height:1}.a2n-add-to-cart{appearance:none;border:0;background:#000;color:#fff;border-radius:10px;padding:13px 24px;font-weight:650;font-size:15px;cursor:pointer;min-width:150px}.a2n-add-to-cart:hover{background:#111}.a2n-add-to-cart:disabled{opacity:.55;cursor:wait}.a2n-delete-zone{margin-top:10px;min-height:44px;border:1px dashed #c9c9cf;border-radius:12px;background:#fafafa;color:#777;display:flex;align-items:center;justify-content:center;gap:7px;font-size:13px;transition:.15s}.a2n-delete-zone svg{width:17px;height:17px;fill:currentColor}.a2n-delete-zone.a2n-over{background:#f2f2f7;border-color:#111;color:#111}.a2n-message{min-height:18px;text-align:center;margin:8px 0 0;color:#8a0019;font-size:13px}.a2n-drag-ghost{position:fixed;z-index:99999;width:84px;height:84px;border-radius:50%;background:rgba(255,255,255,.96);box-shadow:0 10px 30px rgba(0,0,0,.16);display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);pointer-events:none}.a2n-drag-ghost img{width:72px;height:72px;object-fit:contain}
.a2n-cart-visual,.a2n-order-visual-wrap,.a2n-admin-order-visual{margin-top:12px}.a2n-cart-visual .a2n-order-config,.a2n-order-visual-wrap .a2n-order-config,.a2n-admin-order-visual .a2n-order-config{max-width:520px!important}.a2n-order-config-list{color:#666}.a2n-order-config img{display:block}
@media(max-width:1100px){.a2n-builder-main{grid-template-columns:minmax(360px,1fr) minmax(420px,1fr);gap:18px}.a2n-ui-title{font-size:40px}.a2n-collection-heading h2{font-size:28px}}
@media(max-width:850px){.a2n-charm-builder{padding:22px 14px 100px}.a2n-builder-main{grid-template-columns:1fr}.a2n-preview{position:relative;top:auto}.a2n-reference{max-width:720px;margin:0 auto}.a2n-controls{margin-top:4px}.a2n-ui-title{font-size:36px}.a2n-collection-heading h2{font-size:26px}.a2n-scroll-button{display:none}.a2n-charm-card{flex-basis:120px}}
@media(max-width:520px){.a2n-ui-title{font-size:30px;letter-spacing:-1px}.a2n-ui-description{font-size:14px}.a2n-collection-heading h2{font-size:23px}.a2n-filter-list{gap:6px}.a2n-filter-chip{padding:7px 11px}.a2n-charm-card{flex-basis:112px;min-height:182px}.a2n-card-image{width:74px;height:74px}.a2n-quantity button{width:32px;height:32px}.a2n-toolbar{bottom:6px}.a2n-add-to-cart{min-width:130px;padding-inline:15px}}
.a2n-selected-count{text-align:right;color:#666;font-size:13px;margin:6px 2px 0;min-height:18px}

/* V1.4.1 — finition luxe, breloques plus visibles et déplacement uniquement sur les emplacements */
.a2n-charm-builder{--a2n-ink:#252525;--a2n-muted:#77777d;--a2n-soft:#f4f4f7;--a2n-line:#dedee3}
.a2n-ui-title{font-weight:500;letter-spacing:-1.6px;margin-bottom:4px}
.a2n-ui-description{color:#6d6d72;margin-bottom:24px}
.a2n-collection-heading h2{font-weight:500;letter-spacing:-.65px}
.a2n-filter-chip{border:1px solid #bdbdc2;border-radius:7px;background:#fff;color:#333;font-weight:400;padding:8px 15px;transition:background .16s,border-color .16s,color .16s}
.a2n-filter-chip:hover{border-color:#777}
.a2n-filter-chip.is-active{background:#181818;color:#fff;border-color:#181818}

/* Cartes plus grandes : images de breloques nettement plus visibles */
.a2n-charm-card{flex-basis:202px;min-height:306px;padding:14px 12px 12px;border:1px solid transparent;border-radius:15px;background:#f3f3f6;cursor:grab;transition:border-color .18s,box-shadow .18s,transform .18s}
.a2n-charm-card:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(0,0,0,.045)}
.a2n-charm-card.a2n-active{border-color:#1d1d1d;box-shadow:0 0 0 1px rgba(0,0,0,.04)}
.a2n-card-name{font-size:15px;font-weight:600;min-height:34px;margin-bottom:6px}
.a2n-card-image{width:154px;height:154px}
.a2n-card-image img{width:100%;height:100%;object-fit:contain}
.a2n-charm-card small{font-size:13px;margin:5px 0 12px;color:#55555a}
.a2n-quantity{gap:12px}
.a2n-qvalue{font-size:15px;min-width:14px;color:#333}
.a2n-quantity button{width:43px;height:43px;background:#e7e7eb;color:#333;font-size:21px;font-weight:300;box-shadow:none}
.a2n-quantity button:hover:not(:disabled){background:#dedee3}

/* Breloques de l'aperçu : taille fortement augmentée, sans reconstruction pendant le drag */
.a2n-preview-charm{width:42%;aspect-ratio:1/1;transition:left .08s ease-out,top .08s ease-out;will-change:left,top}
.a2n-preview-charm img{width:100%;height:100%;transform:none;object-fit:contain;filter:drop-shadow(0 5px 7px rgba(0,0,0,.13))}
.a2n-preview-charm.a2n-drag-snap{transition:left .12s ease-out,top .12s ease-out;filter:drop-shadow(0 7px 9px rgba(0,0,0,.13))}
.a2n-preview-charm.a2n-selected:after{inset:-5px;border:1px solid rgba(0,0,0,.16)}

/* Croix fine, légère et parfaitement centrée */
.a2n-remove{right:4px;top:4px;width:25px;height:25px;border:1px solid rgba(30,30,30,.12);background:rgba(255,255,255,.92);color:#555;font-size:15px;font-weight:300;line-height:1;display:grid;place-items:center;padding:0;box-shadow:0 2px 7px rgba(0,0,0,.08);opacity:0;transform:none}
.a2n-preview-charm:hover .a2n-remove,.a2n-preview-charm.a2n-selected .a2n-remove{opacity:1}

/* Barre de commande plus fine, esprit boutique de luxe */
.a2n-toolbar{padding:7px;background:rgba(255,255,255,.86);border:1px solid rgba(0,0,0,.055);box-shadow:0 8px 25px rgba(0,0,0,.055)}
.a2n-reset{width:43px;height:43px;min-width:43px;border:1px solid rgba(0,0,0,.1)!important;background:#fff!important;color:#333!important;border-radius:50%;display:grid!important;place-items:center!important;padding:0!important;box-shadow:none!important}
.a2n-reset svg{width:17px;height:17px;display:block;fill:currentColor}
.a2n-reset:hover{background:#f7f7f8!important;border-color:#999!important}
.a2n-total{font-size:13px;color:#666;padding-inline:8px}
.a2n-total-price{font-size:14px;color:#222}
.a2n-add-to-cart{border-radius:8px;padding:13px 25px;font-weight:500;letter-spacing:.04em;font-size:13px;text-transform:uppercase}
.a2n-delete-zone{min-height:42px;border-color:#d4d4d8;background:#fcfcfc;color:#85858a;font-weight:400}
.a2n-delete-zone svg{width:15px;height:15px;fill:currentColor}

/* Emplacements très discrets au repos, visibles clairement pendant le déplacement */
.a2n-point{width:14px;height:14px;border:1px solid rgba(0,0,0,.22);background:rgba(255,255,255,.88);box-shadow:0 2px 7px rgba(0,0,0,.08)}
.a2n-dragging .a2n-point{opacity:.8}
.a2n-point.a2n-over{background:#171717;border-color:#171717;transform:translate(-50%,-50%) scale(1.55);box-shadow:0 0 0 5px rgba(255,255,255,.7),0 4px 12px rgba(0,0,0,.16)}
.a2n-reference-media{cursor:default}
.a2n-drag-ghost{width:104px;height:104px;background:rgba(255,255,255,.97);box-shadow:0 12px 32px rgba(0,0,0,.13);border:1px solid rgba(0,0,0,.06)}
.a2n-drag-ghost img{width:90px;height:90px}

@media(max-width:1100px){
 .a2n-charm-card{flex-basis:190px;min-height:290px}
 .a2n-card-image{width:142px;height:142px}
}
@media(max-width:850px){
 .a2n-charm-card{flex-basis:188px;min-height:288px}
 .a2n-card-image{width:140px;height:140px}
 .a2n-preview-charm{width:38%}
}
@media(max-width:520px){
 .a2n-charm-card{flex-basis:178px;min-height:276px;padding:12px 10px 10px}
 .a2n-card-image{width:132px;height:132px}
 .a2n-quantity button{width:39px;height:39px}
 .a2n-preview-charm{width:34%}
 .a2n-remove{width:23px;height:23px;right:3px;top:3px}
}


/* V1.4.2 — détails ultra-légers : aucun cercle autour des breloques et croix sans fond */
.a2n-preview-charm.a2n-selected:after{content:none!important;display:none!important}
.a2n-remove{right:1px!important;top:1px!important;width:22px!important;height:22px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#111!important;box-shadow:none!important;font-size:21px!important;font-family:Arial,sans-serif!important;font-weight:300!important;line-height:22px!important;display:grid!important;place-items:center!important;padding:0!important;text-align:center!important;opacity:0;transform:none!important}
.a2n-preview-charm:hover .a2n-remove,.a2n-preview-charm.a2n-selected .a2n-remove{opacity:.88}
.a2n-remove:hover{color:#000!important;opacity:1!important}

/* Les visuels des cartes sont volontairement plus grands que le conteneur : cela compense les marges transparentes fréquentes des photos de bijoux. */
.a2n-card-image{width:190px!important;height:190px!important;overflow:visible!important}
.a2n-card-image img{transform:scale(1.42);transform-origin:center center}
.a2n-charm-card{overflow:visible}
.a2n-quantity{gap:14px!important}
.a2n-quantity button{width:45px!important;height:45px!important;font-size:21px!important}
.a2n-qvalue{font-size:16px!important;min-width:16px!important}
@media(max-width:1100px){.a2n-card-image{width:176px!important;height:176px!important}.a2n-card-image img{transform:scale(1.38)}}
@media(max-width:850px){.a2n-card-image{width:174px!important;height:174px!important}.a2n-card-image img{transform:scale(1.34)}}
@media(max-width:520px){.a2n-card-image{width:162px!important;height:162px!important}.a2n-card-image img{transform:scale(1.3)}.a2n-quantity button{width:41px!important;height:41px!important}}


/* V1.4.2 premium refinement — minimal controls, closer delete action, natural charm orientation */
.a2n-preview-charm{--a2n-angle:0deg;}
.a2n-preview-charm img{transform:rotate(var(--a2n-angle)) translateY(18.75%) scale(.75)!important;transform-origin:center 38%;}
.a2n-remove{right:-1px!important;top:-1px!important;width:17px!important;height:17px!important;font-size:17px!important;line-height:17px!important;color:#171717!important;font-weight:300!important;opacity:0!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;}
.a2n-preview-charm:hover .a2n-remove,.a2n-preview-charm.a2n-selected .a2n-remove{opacity:.72!important}
.a2n-remove:hover{opacity:1!important;color:#000!important}
.a2n-scroll-button{position:absolute;top:50%;width:30px!important;height:30px!important;border:0!important;border-radius:50%!important;background:rgba(255,255,255,.82)!important;color:#202020!important;box-shadow:0 3px 12px rgba(0,0,0,.07)!important;display:grid!important;place-items:center!important;padding:0!important;line-height:0!important;opacity:0;transition:opacity .18s ease,background .18s ease,transform .18s ease!important;backdrop-filter:blur(6px)}
.a2n-scroll-button svg{width:15px!important;height:15px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.25!important;stroke-linecap:round!important;stroke-linejoin:round!important;display:block!important}
.a2n-scroll-shell:hover .a2n-scroll-button,.a2n-scroll-button:focus-visible{opacity:.9}
.a2n-scroll-button:hover{background:rgba(255,255,255,.98)!important;transform:translateY(-50%) scale(1.04)!important}
.a2n-scroll-prev{left:5px!important}.a2n-scroll-next{right:5px!important}
.a2n-dragging .a2n-scroll-button{opacity:0!important}
.a2n-point{transition:transform .16s ease,opacity .16s ease,box-shadow .16s ease!important}
.a2n-point.a2n-over{transform:translate(-50%,-50%) scale(1.35)!important;box-shadow:0 0 0 3px rgba(255,255,255,.88),0 3px 10px rgba(0,0,0,.12)!important}
.a2n-preview-charm.a2n-drag-snap{transition:left .16s cubic-bezier(.2,.8,.2,1),top .16s cubic-bezier(.2,.8,.2,1),transform .16s ease!important}
@media(max-width:850px){.a2n-scroll-button{opacity:.75}.a2n-scroll-prev{left:2px!important}.a2n-scroll-next{right:2px!important}}

/* Premium alignment: reset and collection arrows share the same light visual language. */
.a2n-reset svg{width:17px!important;height:17px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.25!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.a2n-remove{right:9%!important;top:9%!important;width:16px!important;height:16px!important;font-size:16px!important;line-height:16px!important}
.a2n-scroll-button{width:30px!important;height:30px!important}


/* v1.4.3 — trois breloques visibles par écran, défilement carte par carte */
.a2n-scroll-shell{padding:0 2px}
.a2n-charm-list{gap:8px;overflow-x:auto;scroll-snap-type:x proximity}
.a2n-charm-list .a2n-charm-card{flex:0 0 calc((100% - 16px)/3)!important;min-width:0;scroll-snap-align:start;box-sizing:border-box}
.a2n-charm-list .a2n-card-image{width:min(100%,120px)!important;height:auto!important;aspect-ratio:1/1}
.a2n-charm-list .a2n-card-image img{width:100%;height:100%;object-fit:contain}
.a2n-charm-list .a2n-quantity{gap:5px}
.a2n-charm-list .a2n-quantity button{width:30px!important;height:30px!important}
@media(max-width:520px){.a2n-charm-list .a2n-charm-card{padding:9px 5px!important;min-height:210px!important}.a2n-charm-list .a2n-card-name{font-size:12px;min-height:30px}.a2n-charm-list .a2n-quantity button{width:26px!important;height:26px!important}}
