.ol-shade__head{max-width:70.4rem}.ol-shade__fieldset{border:0;margin:0;padding:0;min-width:0}.ol-shade__swatches{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--ol-s3)}.ol-shade__swatch{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"chip name" "chip dose";align-items:center;column-gap:var(--ol-s3);padding:var(--ol-s3) var(--ol-s4);border-radius:var(--ol-radius-pill);background:color-mix(in srgb,var(--ol-paper) 55%,transparent);cursor:pointer;transition:transform var(--ol-dur) var(--ol-ease)}.ol-shade__swatch:hover{transform:translateY(-2px)}.ol-shade__chip{grid-area:chip;display:block;width:40px;height:40px;border-radius:var(--ol-radius-pill);background:var(--_chip, var(--ol-coconut));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ol-ink) 25%,transparent),0 0 0 0 var(--ol-ink);transition:box-shadow var(--ol-dur) var(--ol-ease)}.ol-shade__swatch-name{grid-area:name;font-family:var(--ol-font-body);font-size:var(--ol-t1);font-weight:700}.ol-shade__swatch-dose{grid-area:dose;font-family:var(--ol-font-body);font-size:1.4rem;opacity:.8}.ol-shade__swatch:has(.ol-shade__input:checked){background:var(--ol-paper)}.ol-shade__swatch:has(.ol-shade__input:checked) .ol-shade__chip{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ol-ink) 25%,transparent),0 0 0 3px var(--ol-ink)}.ol-shade__swatch:has(.ol-shade__input:focus-visible){outline:3px solid var(--ol-ink);outline-offset:3px}.ol-shade__panels{margin-top:var(--ol-s6)}.ol-shade__panel{display:none;gap:var(--ol-s5);align-items:center;position:relative;padding:var(--ol-s6);border-radius:var(--ol-radius-card);overflow:hidden;background-color:#0f1720;background-image:linear-gradient(100deg,#0a1016e6,#0a1016db 36%,#0a10168f 62%,#0a101675),var(--ol-shade-bg, none);background-size:cover;background-position:center;color:#fff;min-height:22rem}@media screen and (min-width:750px){.ol-shade__panel{min-height:30rem}}.ol-shade__panel .ol-display--sub{color:#fff}.ol-shade__panel .ol-shade__result{color:#ffffffeb}.ol-shade__panel .ol-shade__guidance{color:#ffffffc7;opacity:1}.ol-shade__panel .ol-badge{background:#ffffff24;border:1px solid rgba(255,255,255,.28);color:#fff}.ol-shade__panel .ol-media{border-radius:var(--ol-radius-sm);box-shadow:0 10px 30px #00000059}@media screen and (max-width:749px){.ol-shade__panel{background-image:linear-gradient(to bottom,#0a1016e6,#0a1016db 42%,#0a101694 70%,#0a10167a),var(--ol-shade-bg, none)}}.ol-shade__panel--default{display:grid}.ol-shade__media img,.ol-shade__placeholder{width:100%}.ol-shade__placeholder{background:color-mix(in srgb,var(--ol-ink) 8%,transparent)}.ol-shade__detail{min-height:17.6rem;align-content:start}.ol-shade__result{max-width:40ch}.ol-shade__nameline{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0}.ol-shade__develop{flex:0 0 auto;margin:0}.ol-shade__guidance{max-width:42ch;opacity:.85}.ol-shade__go{margin:0;padding-top:var(--ol-s3)}@media screen and (min-width:750px){.ol-shade__swatches{grid-template-columns:repeat(4,1fr)}.ol-shade__panel{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--ol-s7);align-items:center}.ol-shade__detail{min-height:14.4rem}}.ol-shade__progress{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ol-s3);margin:0;padding:0;list-style:none}.ol-shade__step{display:grid;gap:8px;justify-items:center}.ol-shade__step-img,.ol-shade__step-tone{display:block;width:100%;aspect-ratio:1 / 1;align-self:start;height:auto;border-radius:var(--ol-radius-sm);object-fit:cover;box-shadow:inset 0 0 0 1px #ffffff38,0 8px 22px #0000004d}.ol-shade__step-tone{background:linear-gradient(158deg,color-mix(in srgb,var(--_tone) 76%,#fff) 0%,var(--_tone) 62%,color-mix(in srgb,var(--_tone) 86%,#000) 100%)}.ol-shade__step-cap{font-family:var(--ol-font-label);font-size:1.1rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#ffffffd1}.ol-shade__bar{display:flex;align-items:center;gap:var(--ol-s5);flex-wrap:wrap}.ol-shade__bar .ol-shade__fieldset{flex:1 1 20rem;min-width:0}.ol-shade__controls{display:flex;gap:8px;margin-inline-start:auto}.ol-shade__arrow{position:relative;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;color:var(--ol-ink);cursor:pointer;transition:color var(--ol-dur) var(--ol-ease)}.ol-shade__arrow:before{content:"";position:absolute;inline-size:36px;block-size:36px;border:1px solid var(--ol-glass-border-strong);border-radius:var(--ol-radius-pill);background:var(--ol-surface);transition:border-color var(--ol-dur) var(--ol-ease)}.ol-shade__arrow svg{position:relative;width:16px;height:16px}.ol-shade__arrow:hover{color:var(--ol-blaze-deep)}.ol-shade__arrow:hover:before{border-color:var(--ol-blaze)}@keyframes ol-shade-in-next{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:none}}@keyframes ol-shade-in-prev{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:none}}.ol-shade__panel{animation:ol-shade-in-next .28s var(--ol-ease) both}.ol-shade__panels[data-dir=prev] .ol-shade__panel{animation-name:ol-shade-in-prev}@media(prefers-reduced-motion:reduce){.ol-shade__panel{animation:none}}@media screen and (max-width:749px){.ol-shade__ui{padding:var(--ol-s4)}.ol-shade__swatches{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto auto auto;column-gap:6px;row-gap:6px}.ol-shade__swatch{grid-column:span 1;grid-row:span 3;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;grid-template-areas:"chip" "name" "dose";justify-items:center;padding:var(--ol-s3) 4px;text-align:center}.ol-shade__chip{width:34px;height:34px}.ol-shade__swatch-name{font-size:1.3rem;line-height:1.15}.ol-shade__swatch-dose{font-size:1.1rem;line-height:1.15;white-space:nowrap}.ol-shade__bar .ol-shade__fieldset{flex:1 1 100%}.ol-shade__controls{order:3;width:100%;margin-inline:0;justify-content:center;margin-top:var(--ol-s3)}.ol-shade__panel{padding:var(--ol-s4);gap:var(--ol-s4)}.ol-shade__detail{min-height:0}.ol-shade__progress{gap:8px}.ol-shade__step-cap{font-size:1rem}}@media screen and (max-width:749px){.ol-shade__arrow,.ol-shade__controls{display:none}.ol-shade__panels{margin-top:var(--ol-s4)}}
/*# sourceMappingURL=/cdn/shop/t/44/assets/ol-shade-selector.css.map */