.ccc{--ccc-ink: #1f1d1d;--ccc-muted: rgba(31, 29, 29, .62);--ccc-line: rgba(31, 29, 29, .14);--ccc-stage: #f1ece5;--ccc-empty: #efe5da;--ccc-radius: 6px;--ccc-ease: cubic-bezier(.2, .7, .2, 1);--ccc-nail-w: 36px;--ccc-swatch-w: 26px;display:block;container-type:inline-size;color:var(--ccc-ink);font-family:var(--font-body-family, "DM Sans", sans-serif);-webkit-tap-highlight-color:transparent}.ccc *,.ccc *:before,.ccc *:after{box-sizing:border-box}.ccc__inner{display:block}.ccc__status{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin:0 0 10px}.ccc__step,.ccc__count{margin:0;line-height:1.35}.ccc__step{font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}.ccc__count{font-size:12px;color:var(--ccc-muted);font-variant-numeric:tabular-nums;white-space:nowrap}.ccc__slots{list-style:none;margin:0;padding:12px 4px 8px;display:grid;grid-template-columns:repeat(var(--ccc-slots, 5),minmax(0,1fr));gap:2px;background:var(--ccc-stage);border:1px solid var(--ccc-line);border-radius:var(--ccc-radius)}.ccc__slot-item{margin:0;padding:0;min-width:0}.ccc__slot{appearance:none;-webkit-appearance:none;width:100%;min-height:84px;margin:0;padding:6px 0 4px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:7px;background:none;border:0;border-radius:var(--ccc-radius);color:inherit;font:inherit;cursor:pointer;touch-action:manipulation}.ccc__slot:focus{outline:none}.ccc__slot:focus-visible{outline:1px solid var(--ccc-ink);outline-offset:1px}.ccc__nail,.ccc__swatch{position:relative;display:block;flex:none;border-radius:50% 50% 26% 26%/60% 60% 22% 22%;background-color:var(--ccc-c, #d8bfc0);background-image:var(--ccc-img, none);background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px #1f1d1d1a,0 1px 2px #1f1d1d14}.ccc__nail:after,.ccc__swatch:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none;background:radial-gradient(60% 34% at 32% 20%,#ffffff9e,#fff0 70%),linear-gradient(165deg,#ffffff38,#fff0 42%,#0000001a)}.ccc__nail{width:var(--ccc-nail-w);height:calc(var(--ccc-nail-w) * 1.36);background-color:var(--ccc-fill, var(--ccc-empty));background-image:var(--ccc-fill-img, none);transition:background-color .22s var(--ccc-ease),box-shadow .22s var(--ccc-ease),transform .22s var(--ccc-ease)}.ccc__slot:not(.is-filled) .ccc__nail:after{opacity:.55}.ccc__plus{position:absolute;top:50%;left:50%;width:11px;height:11px;transform:translate(-50%,-50%);transition:opacity .18s var(--ccc-ease);z-index:1}.ccc__plus:before,.ccc__plus:after{content:"";position:absolute;background:#1f1d1d80}.ccc__plus:before{left:0;right:0;top:5px;height:1px}.ccc__plus:after{top:0;bottom:0;left:5px;width:1px}.ccc__slot.is-filled .ccc__plus{opacity:0}.ccc__slot-num{font-size:10px;line-height:1;letter-spacing:.14em;color:var(--ccc-muted);font-variant-numeric:tabular-nums;transition:color .18s var(--ccc-ease)}.ccc__slot.is-active .ccc__nail{box-shadow:0 0 0 2px var(--ccc-stage),0 0 0 3px var(--ccc-ink),0 4px 10px #1f1d1d1f;transform:translateY(-2px)}.ccc__slot.is-active .ccc__slot-num{color:var(--ccc-ink);font-weight:600}.ccc__slot.is-active:not(.is-filled) .ccc__plus:before,.ccc__slot.is-active:not(.is-filled) .ccc__plus:after{background:var(--ccc-ink)}.ccc__slot.is-pop .ccc__nail{animation:ccc-pop .26s var(--ccc-ease)}@keyframes ccc-pop{0%{transform:scale(.9)}60%{transform:scale(1.04)}to{transform:scale(1)}}.ccc.is-nudge .ccc__slots{animation:ccc-nudge .38s var(--ccc-ease)}@keyframes ccc-nudge{0%,to{border-color:var(--ccc-line)}40%{border-color:var(--ccc-ink)}}.ccc__palette{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.ccc__palette>li{margin:0;padding:0;min-width:0}.ccc__shade{appearance:none;-webkit-appearance:none;width:100%;height:100%;min-height:88px;margin:0;padding:9px 2px 8px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;background:transparent;border:1px solid transparent;border-radius:var(--ccc-radius);color:inherit;font:inherit;text-align:center;cursor:pointer;touch-action:manipulation;transition:border-color .18s var(--ccc-ease),background-color .18s var(--ccc-ease),transform .12s var(--ccc-ease)}.ccc__shade:focus{outline:none}.ccc__shade:focus-visible{outline:1px solid var(--ccc-ink);outline-offset:-1px}.ccc__shade:active{transform:scale(.96);background-color:#1f1d1d0d}.ccc__shade.is-current{border-color:var(--ccc-ink);background-color:#ffffff80}.ccc__shade.is-tapped .ccc__swatch{animation:ccc-pop .26s var(--ccc-ease)}.ccc__swatch{width:var(--ccc-swatch-w);height:calc(var(--ccc-swatch-w) * 1.36);margin-bottom:2px}.ccc__uses{position:absolute;top:-5px;right:-11px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--ccc-ink);color:#fff;font-size:9.5px;font-weight:600;line-height:16px;text-align:center;font-variant-numeric:tabular-nums;opacity:0;transform:scale(.6);transition:opacity .18s var(--ccc-ease),transform .18s var(--ccc-ease);z-index:2}.ccc__uses.is-on{opacity:1;transform:none}.ccc__code{font-size:9.5px;line-height:1;letter-spacing:.14em;color:var(--ccc-muted);font-variant-numeric:tabular-nums}.ccc__name{max-width:100%;font-size:11.5px;line-height:1.2;overflow-wrap:break-word;word-break:normal;-webkit-hyphens:manual;hyphens:manual}.ccc__sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.ccc-atc-hint{margin:0 0 8px;font-size:12.5px;line-height:1.4;text-align:center;color:#1f1d1db3;font-family:var(--font-body-family, "DM Sans", sans-serif)}.ccc-atc-hint.is-ready{color:#1f1d1d}button.ccc-atc-locked,button.ccc-atc-locked:hover{opacity:.42;cursor:not-allowed}.ccc--img .ccc__nail{width:calc(var(--ccc-nail-w) * .66);height:calc(var(--ccc-nail-w) * .66 * 2.32);border-radius:0;box-shadow:none;background:none;filter:drop-shadow(0 0 .6px rgba(31,29,29,.45))}.ccc--img .ccc__nail:after{display:none}.ccc--img .ccc__nail:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-color:var(--ccc-empty);-webkit-mask:var(--ccc-mask) 50% 50% / 283% auto no-repeat;mask:var(--ccc-mask) 50% 50% / 283% auto no-repeat;transition:opacity .18s var(--ccc-ease)}.ccc--img .ccc__slot.is-filled .ccc__nail{filter:drop-shadow(0 2px 3px rgba(31,29,29,.14))}.ccc--img .ccc__slot.is-filled .ccc__nail:before{opacity:0}.ccc--img .ccc__slot.has-img .ccc__nail{background:var(--ccc-fill-img) 50% 50% / 283% auto no-repeat}.ccc--img .ccc__slot.is-filled:not(.has-img) .ccc__nail:before{opacity:1;background-color:var(--ccc-fill)}.ccc--img .ccc__slot.is-active .ccc__nail{box-shadow:none;filter:drop-shadow(1.5px 0 0 var(--ccc-stage)) drop-shadow(-1.5px 0 0 var(--ccc-stage)) drop-shadow(0 1.5px 0 var(--ccc-stage)) drop-shadow(0 -1.5px 0 var(--ccc-stage)) drop-shadow(1px 0 0 var(--ccc-ink)) drop-shadow(-1px 0 0 var(--ccc-ink)) drop-shadow(0 1px 0 var(--ccc-ink)) drop-shadow(0 -1px 0 var(--ccc-ink))}.ccc--img .ccc__plus{top:54%}.ccc__shade.has-img .ccc__swatch{width:calc(var(--ccc-swatch-w) * .8);height:calc(var(--ccc-swatch-w) * .8 * 2.32);border-radius:0;box-shadow:none;background:var(--ccc-img) 50% 50% / 283% auto no-repeat;filter:drop-shadow(0 2px 2px rgba(31,29,29,.12))}.ccc__shade.has-img .ccc__swatch:after{display:none}.ccc__shade.has-img .ccc__uses{top:-2px;right:-14px}@container (min-width: 340px){.ccc__inner{--ccc-nail-w: 40px;--ccc-swatch-w: 28px}.ccc__status{flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px}.ccc__slots{padding:14px 8px 10px;gap:4px}.ccc__slot{min-height:92px}.ccc__palette{gap:6px}.ccc__name{font-size:12px}}@container (min-width: 400px){.ccc__inner{--ccc-nail-w: 44px;--ccc-swatch-w: 30px}.ccc__slot{min-height:98px}.ccc__step{font-size:11px}}@container (min-width: 620px){.ccc__inner{--ccc-nail-w: 48px}.ccc__palette{grid-template-columns:repeat(8,minmax(0,1fr))}}@media(hover:hover)and (pointer:fine){.ccc__slot:hover .ccc__nail{transform:translateY(-2px)}.ccc__shade:hover{border-color:var(--ccc-line)}.ccc__shade.is-current:hover{border-color:var(--ccc-ink)}}@media(prefers-reduced-motion:reduce){.ccc *,.ccc *:before,.ccc *:after{animation:none!important;transition:none!important}.ccc__slot.is-active .ccc__nail{transform:none}}.ccc-noscript{display:grid;gap:8px}.ccc-noscript select{width:100%;min-height:48px}
/*# sourceMappingURL=/cdn/shop/t/22/assets/calyvi-coffret-composer.css.map */
