/* Built by Mohammad Abbasi. All rights reserved. */
/* Universal product attributes — stable, compact and responsive */
.product-gallery,.product-overview,.buy-card{min-width:0}
.variant-configurator{box-sizing:border-box;width:100%;max-width:100%;margin:18px 0 0;padding:14px;border:1px solid #dde9e6;border-radius:18px;background:linear-gradient(180deg,#fff 0%,#f7fbfa 100%);box-shadow:0 8px 24px rgba(15,23,42,.04);overflow:hidden}
.variant-configurator-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid #e5eeec}
.variant-configurator-head>div{min-width:0;display:flex;flex-direction:column;gap:1px}
.variant-configurator-head small{font-size:12px;line-height:1.5;color:#718582}
.variant-configurator-head strong{font-size:14px;line-height:1.65;color:#173f3b}
.variant-configurator-head>span{flex:0 0 auto;padding:5px 9px;border:1px solid #c9e9e1;border-radius:999px;background:#eaf8f4;color:#0f766e;font-size:12px;font-weight:900;white-space:nowrap}
.variant-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;min-width:0}
.variant-groups.is-single{grid-template-columns:1fr}
.variant-group{box-sizing:border-box;min-width:0;margin:0;padding:10px;border:1px solid #e4ecea;border-radius:14px;background:#fff;overflow:hidden}
.variant-group-head{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-width:0;margin:0 0 8px;padding:0;border:0}
.variant-group-head span{flex:0 0 auto;font-size:11px;font-weight:900;line-height:1.5;color:#183d39}
.variant-group-head small{min-width:0;max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:12px;line-height:1.5;color:#81918f}
.variant-options{display:flex;align-items:stretch;gap:6px;width:100%;max-width:100%;min-width:0;padding:1px 1px 3px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#cbded9 transparent;overscroll-behavior-inline:contain}
.variant-options::-webkit-scrollbar{height:4px}.variant-options::-webkit-scrollbar-thumb{background:#cbded9;border-radius:20px}
.variant-option{box-sizing:border-box;position:relative;flex:1 0 88px;min-width:88px;max-width:150px;min-height:42px;padding:7px 10px;border:1px solid #d9e5e2;border-radius:11px;background:#fff;color:#36504e;font:inherit;font-size:12px;font-weight:850;line-height:1.35;display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;cursor:pointer;transition:border-color .18s,background .18s,color .18s,box-shadow .18s}
.variant-option:hover:not(:disabled){border-color:#71c6b8;background:#f6fcfa;box-shadow:0 4px 12px rgba(15,118,110,.07)}
.variant-option.is-selected{border-color:#0f766e;background:#e9f8f4;color:#0b5c55;box-shadow:inset 0 0 0 1px #0f766e,0 3px 10px rgba(15,118,110,.08)}
.variant-option:focus-visible{outline:3px solid rgba(15,118,110,.18);outline-offset:2px}
.variant-option:disabled{opacity:.38;cursor:not-allowed;background:#f6f8f7;box-shadow:none}
.variant-option .swatch{width:18px;height:18px;flex:0 0 18px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #bfcfcb}
.variant-option .option-meta{position:absolute;top:-4px;left:6px;padding:3px 5px;border-radius:999px;background:#dff7ef;color:#0f766e;font-size:12px;line-height:1;white-space:nowrap}
.selected-variant-summary{box-sizing:border-box;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:7px;min-height:42px;margin-top:9px;padding:8px 11px;border-radius:12px;background:linear-gradient(135deg,#0f514b,#116b62);color:#fff;overflow:hidden}
.selected-variant-summary span{font-size:12px;color:#c4e5df;white-space:nowrap}.selected-variant-summary b{min-width:0;font-size:12px;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-variant-summary small{font-size:12px;color:#d4ebe7;white-space:nowrap}
.variant-stock{color:#15803d!important}.variant-stock.low{color:#b45309!important}.variant-stock.out{color:#dc2626!important}
.ingredients-intro{margin-bottom:14px}.ingredients-table-wrap{margin:16px 0 18px;border:1px solid #dce8e5;border-radius:18px;overflow:auto;background:#fff;box-shadow:0 10px 26px rgba(15,118,110,.055)}.ingredients-table{width:100%;min-width:680px;border-collapse:collapse;table-layout:fixed}.ingredients-table th,.ingredients-table td{padding:14px 16px;text-align:right;vertical-align:middle;border-bottom:1px solid #e7efed}.ingredients-table th{font-size:11px;font-weight:900;color:#24524e;background:#f0faf7;white-space:nowrap}.ingredients-table td{font-size:12px;line-height:1.8;color:#415a58}.ingredients-table tbody tr:last-child td{border-bottom:0}.ingredients-table tbody tr:nth-child(even){background:#fbfefd}.ingredients-table tbody tr:hover{background:#f5fbf9}.ingredients-table td:first-child{font-weight:900;color:#173f3b}.ingredients-table td:nth-child(2){direction:ltr;text-align:left;font-family:Arial,sans-serif;color:#516966}.ingredients-table td:nth-child(3){font-weight:800;color:#0f766e}.ingredients-empty{padding:24px;text-align:center;color:#64748b}
.product-trust-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:18px 0 28px;border:1px solid #dfe9e7;border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(15,23,42,.045);overflow:hidden}.product-trust-strip article{box-sizing:border-box;min-width:0;min-height:78px;padding:14px 18px;display:flex;align-items:center;justify-content:center;gap:11px}.product-trust-strip article+article{border-right:1px solid #e7efed}.trust-strip-icon{width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border-radius:12px;color:#0f766e;background:#e9f8f4;border:1px solid #d2eee7}.trust-strip-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.product-trust-strip article div{display:flex;flex-direction:column;gap:2px;min-width:0}.product-trust-strip strong{font-size:12px;line-height:1.6;color:#173f3b}.product-trust-strip small{font-size:12px;line-height:1.7;color:#718582}
.buy-card>.variant-configurator{display:none!important}
@media(min-width:1051px){.product-hero{grid-template-columns:minmax(255px,.84fr) minmax(420px,1.3fr) minmax(245px,.72fr);gap:18px;align-items:start}.product-overview{padding:24px;overflow:hidden}.buy-card{padding:21px}.product-gallery,.product-overview,.buy-card{height:100%}}
@media(max-width:1180px) and (min-width:861px){.variant-groups{grid-template-columns:1fr}.variant-group-head small{max-width:56%}}
@media(max-width:860px){.variant-groups{grid-template-columns:1fr}.product-trust-strip{grid-template-columns:1fr;margin-top:14px}.product-trust-strip article{min-height:66px;justify-content:flex-start;padding:12px 15px}.product-trust-strip article+article{border-right:0;border-top:1px solid #e7efed}}
@media(max-width:640px){.variant-configurator{margin-top:14px;padding:11px;border-radius:15px}.variant-configurator-head{min-height:38px;margin-bottom:9px;padding-bottom:9px}.variant-configurator-head strong{font-size:13px}.variant-group{padding:9px;border-radius:12px}.variant-group-head{align-items:flex-start;flex-direction:column;gap:1px}.variant-group-head small{max-width:100%;white-space:normal;text-align:right}.variant-option{flex:0 0 auto;min-width:96px;max-width:145px;min-height:40px;padding:7px 9px;font-size:12px}.selected-variant-summary{grid-template-columns:1fr;gap:2px;padding:9px 10px}.selected-variant-summary b{white-space:normal;overflow:visible}.ingredients-table-wrap{border-radius:14px}.ingredients-table th,.ingredients-table td{padding:12px 13px}.product-trust-strip{border-radius:15px;margin-bottom:22px}.trust-strip-icon{width:38px;height:38px;flex-basis:38px;border-radius:11px}}

/* DaruGet catalog product — final responsive polish */
.product-overview h1{
  font-size:clamp(22px,2.15vw,28px);
  line-height:1.65;
  letter-spacing:-.35px;
  overflow-wrap:anywhere;
}
.variant-options{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(92px,1fr));
  align-items:stretch;
  overflow:visible;
  padding:1px;
}
.variant-option{
  min-width:0;
  max-width:none;
  width:100%;
  flex:none;
  overflow-wrap:anywhere;
}
.variant-group{overflow:visible}
.variant-group-head small{white-space:normal;text-overflow:clip;overflow:visible;line-height:1.7}

@media(max-width:680px){
  body{overflow-x:hidden}
  header>.header-main{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:"brand actions" "search search";
    gap:9px 10px!important;
    padding:9px 0 11px!important;
  }
  .daruget-brand-header{grid-area:brand;min-width:0;gap:8px!important}
  .daruget-brand-header .dd-logo-symbol{
    display:block!important;
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
  }
  .daruget-brand-header .dd-logotype{
    display:flex!important;
    min-width:0;
  }
  .daruget-brand-header .dd-logotype strong{
    display:block!important;
    font-size:18px!important;
    line-height:1.1;
    white-space:nowrap;
  }
  .daruget-brand-header .dd-logotype small{display:none!important}
  .header-actions{grid-area:actions;justify-self:end;align-items:center}
  .header-actions .mobile-menu-toggle{
    display:grid!important;
    width:40px;height:40px;border-radius:12px;
  }
  .search{
    grid-area:search;
    width:100%;
    min-width:0;
  }
  .search input{
    box-sizing:border-box;
    width:100%;
    height:44px!important;
    padding:0 43px 0 13px!important;
    border-radius:13px!important;
    background:#f8fafc!important;
    font-size:11px!important;
    text-overflow:ellipsis;
  }
  .search-icon{right:15px!important;top:11px!important;font-size:20px}
  .product-page{padding-top:9px}
  .product-breadcrumb{margin:4px 0 12px;font-size:12px;gap:6px;white-space:nowrap;overflow:hidden}
  .product-breadcrumb strong{overflow:hidden;text-overflow:ellipsis}
  .product-gallery,.product-overview,.buy-card,.catalog-shell,.reviews{border-radius:18px}
  .product-gallery{padding:13px}
  .product-visual-main{min-height:270px;border-radius:16px}
  .visual-symbol{font-size:100px}
  .gallery-thumbs{gap:6px}
  .gallery-thumbs button{padding:9px 5px;font-size:12px;min-width:0}
  .product-overview{padding:17px 15px!important}
  .product-brand{margin:14px 0 5px;font-size:12px!important}
  .product-overview h1{
    font-size:20px!important;
    line-height:1.7!important;
    letter-spacing:-.2px;
    margin:0!important;
  }
  .latin-name{font-size:11px;margin-top:4px}
  .rating-row{gap:10px;padding:11px 0;font-size:12px}
  .quick-summary{margin-top:14px;padding:13px;border-radius:14px}
  .quick-summary p{font-size:11px;line-height:1.9}
  .variant-configurator{overflow:visible!important}
  .variant-groups{gap:8px}
  .variant-options{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    overflow:visible!important;
    padding:1px!important;
  }
  .variant-option{
    min-width:0!important;
    max-width:none!important;
    width:100%;
    min-height:42px;
    font-size:12px;
    padding:7px 6px;
  }
  .variant-group-head{flex-direction:row;align-items:flex-start;gap:6px}
  .variant-group-head small{max-width:62%;text-align:left}
  .selected-variant-summary{grid-template-columns:1fr;overflow:visible}
  .selected-variant-summary small,.selected-variant-summary span{white-space:normal}
  .buy-card{padding:17px}
  .catalog-nav{scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .catalog-nav::-webkit-scrollbar{display:none}
  .catalog-content{padding:17px 15px}
  .catalog-panel h2{font-size:18px}
  .catalog-panel table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .drawer-head .daruget-brand-mobile .dd-logo-symbol{display:block!important}
  .drawer-head .daruget-brand-mobile .dd-logotype{display:flex!important}
  .drawer-head .daruget-brand-mobile .dd-logotype strong,
  .drawer-head .daruget-brand-mobile .dd-logotype small{display:block!important}
  .drawer-club-link{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    margin:12px 0 4px;padding:13px 14px;border-radius:14px;
    background:linear-gradient(135deg,#ecfdf5,#eff6ff);
    border:1px solid #cce9e2;color:#0f766e;font-size:12px;font-weight:900;
  }
  .drawer-club-link small{display:block!important;color:#64748b;font-size:12px;margin-top:3px;font-weight:700}
  .drawer-club-link span{display:block!important}
}

@media(max-width:380px){
  .daruget-brand-header .dd-logotype{display:none!important}
  .variant-options{grid-template-columns:1fr}
  .product-overview h1{font-size:18px!important}
}


/* Product hero + color preview — balanced final layout */
@media (min-width:1051px){
  .product-hero{
    grid-template-columns:minmax(260px,.82fr) minmax(390px,1.22fr) minmax(260px,.76fr)!important;
    gap:20px!important;
    align-items:start!important;
  }
  .product-gallery,.product-overview,.buy-card{
    height:auto!important;
    align-self:start!important;
  }
  .product-gallery{position:sticky;top:132px}
  .buy-card{position:sticky;top:132px}
  .product-overview{padding:25px 26px!important}
  .product-overview h1#productName{
    font-size:clamp(20px,1.55vw,24px)!important;
    line-height:1.72!important;
    margin-top:2px!important;
  }
}
.product-gallery,.product-overview,.buy-card{
  border:1px solid #e3ece9!important;
  background:#fff!important;
  box-shadow:0 12px 34px rgba(15,23,42,.055)!important;
}
.product-overview{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.product-overview .quick-summary{margin-top:16px!important}
.variant-configurator{
  margin-top:15px!important;
  padding:15px!important;
  border-radius:17px!important;
  background:#fbfefd!important;
  box-shadow:none!important;
}
.variant-groups{gap:10px!important}
.variant-group{
  padding:11px!important;
  border-color:#dfe9e6!important;
  background:#fff!important;
}
.variant-options{
  grid-template-columns:repeat(auto-fit,minmax(105px,1fr))!important;
  gap:7px!important;
}
.variant-option{
  min-height:44px!important;
  padding:8px 9px!important;
  border-radius:12px!important;
}
.selected-variant-summary{
  min-height:46px!important;
  margin-top:11px!important;
  padding:9px 12px!important;
}

/* Virtual shade becomes an independent full-width studio */
.virtual-shade-preview{
  margin:20px 0 28px!important;
  border-radius:24px!important;
  border:1px solid #d9e8e3!important;
  background:#fff!important;
  box-shadow:0 16px 42px rgba(15,118,110,.08)!important;
}
.virtual-shade-head{
  padding:18px 20px!important;
  background:linear-gradient(135deg,#f0fdf8,#f8fbff)!important;
}
.virtual-shade-head strong{font-size:15px!important}
.virtual-shade-head small{font-size:12px!important}
.virtual-shade-body{
  grid-template-columns:minmax(340px,1.05fr) minmax(280px,.95fr)!important;
  gap:20px!important;
  padding:20px!important;
  align-items:stretch!important;
}
.shade-stage,.shade-stage canvas{min-height:330px!important}
.shade-controls{
  justify-content:center!important;
  padding:2px 4px!important;
  gap:13px!important;
}
.shade-current{padding:12px 13px!important}
.shade-upload{min-height:46px!important}
.shade-help{padding:12px!important;font-size:12px!important}
.shade-actions button{min-height:44px!important}

.product-trust-strip{margin-top:0!important}

@media(max-width:1050px) and (min-width:721px){
  .product-hero{align-items:start!important}
  .product-gallery,.product-overview,.buy-card{height:auto!important}
  .virtual-shade-body{grid-template-columns:1fr 1fr!important}
  .shade-stage,.shade-stage canvas{min-height:285px!important}
}
@media(max-width:720px){
  .product-hero{gap:14px!important;align-items:start!important}
  .product-gallery,.product-overview,.buy-card{height:auto!important;position:static!important}
  .product-overview{padding:19px!important}
  .product-overview h1#productName{font-size:21px!important;line-height:1.7!important}
  .variant-configurator{padding:12px!important;margin-top:13px!important}
  .variant-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .variant-option{min-width:0!important;max-width:none!important;width:100%!important}
  .virtual-shade-preview{margin:15px 0 22px!important;border-radius:19px!important}
  .virtual-shade-head{padding:14px!important}
  .virtual-shade-body{grid-template-columns:1fr!important;padding:13px!important;gap:14px!important}
  .shade-stage,.shade-stage canvas{min-height:245px!important}
  .shade-controls{padding:0!important}
  .product-trust-strip{margin-top:0!important}
}
@media(max-width:420px){
  .variant-options{grid-template-columns:1fr!important}
  .shade-stage,.shade-stage canvas{min-height:220px!important}
}


/* Integrated color selection + virtual skin preview */
.variant-configurator.has-virtual-shade{
  margin-top:18px!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid #dce9e4!important;
  border-radius:22px!important;
  background:linear-gradient(155deg,#ffffff 0%,#fbfffd 60%,#f4fbf8 100%)!important;
  box-shadow:0 14px 34px rgba(15,118,110,.075)!important;
}
.variant-configurator.has-virtual-shade .variant-configurator-head{
  margin:0!important;
  padding:17px 18px!important;
  border-bottom:1px solid #e7f0ec!important;
  background:linear-gradient(90deg,#f2fbf7,#fff)!important;
}
.variant-configurator.has-virtual-shade .variant-groups{
  padding:16px 18px 8px!important;
  gap:14px!important;
}
.variant-configurator.has-virtual-shade .variant-group{
  margin:0!important;
  padding:14px!important;
  border:1px solid #e5eeea!important;
  border-radius:16px!important;
  background:#fff!important;
}
.variant-configurator.has-virtual-shade .variant-group-head{
  margin-bottom:11px!important;
}
.variant-configurator.has-virtual-shade .variant-options{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(112px,1fr))!important;
  gap:9px!important;
  overflow:visible!important;
}
.variant-configurator.has-virtual-shade .variant-option{
  width:100%!important;
  min-width:0!important;
  min-height:46px!important;
  justify-content:flex-start!important;
  padding:9px 11px!important;
  border-radius:12px!important;
}
.variant-configurator.has-virtual-shade .virtual-shade-preview{
  margin:10px 18px 16px!important;
  border:1px solid #dce9e4!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.variant-configurator.has-virtual-shade .virtual-shade-head{
  padding:14px 15px!important;
  background:#f8fcfa!important;
  border-bottom:1px solid #e8f1ed!important;
}
.variant-configurator.has-virtual-shade .virtual-shade-body{
  grid-template-columns:minmax(260px,1.12fr) minmax(220px,.88fr)!important;
  gap:16px!important;
  padding:15px!important;
}
.variant-configurator.has-virtual-shade .shade-stage,
.variant-configurator.has-virtual-shade .shade-stage canvas{
  min-height:265px!important;
  max-height:340px!important;
}
.variant-configurator.has-virtual-shade .shade-controls{
  justify-content:center!important;
  padding:2px 0!important;
  gap:10px!important;
}
.variant-configurator.has-virtual-shade .selected-variant-summary{
  margin:0!important;
  padding:14px 18px 16px!important;
  border-top:1px solid #e7f0ec!important;
  border-radius:0!important;
  background:#f8fcfa!important;
}
@media (max-width:1100px){
  .variant-configurator.has-virtual-shade .virtual-shade-body{
    grid-template-columns:1fr!important;
  }
  .variant-configurator.has-virtual-shade .shade-stage,
  .variant-configurator.has-virtual-shade .shade-stage canvas{
    min-height:250px!important;
    max-height:none!important;
  }
}
@media (max-width:700px){
  .variant-configurator.has-virtual-shade{
    border-radius:17px!important;
    margin-top:14px!important;
  }
  .variant-configurator.has-virtual-shade .variant-configurator-head{
    padding:14px!important;
    align-items:flex-start!important;
  }
  .variant-configurator.has-virtual-shade .variant-groups{
    padding:13px 13px 5px!important;
  }
  .variant-configurator.has-virtual-shade .variant-group{
    padding:12px!important;
  }
  .variant-configurator.has-virtual-shade .variant-options{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .variant-configurator.has-virtual-shade .virtual-shade-preview{
    margin:9px 13px 13px!important;
    border-radius:15px!important;
  }
  .variant-configurator.has-virtual-shade .virtual-shade-head{
    padding:12px!important;
  }
  .variant-configurator.has-virtual-shade .virtual-shade-body{
    padding:11px!important;
    gap:12px!important;
  }
  .variant-configurator.has-virtual-shade .shade-stage,
  .variant-configurator.has-virtual-shade .shade-stage canvas{
    min-height:220px!important;
  }
  .variant-configurator.has-virtual-shade .selected-variant-summary{
    padding:12px 14px 14px!important;
  }
}
@media (max-width:420px){
  .variant-configurator.has-virtual-shade .variant-options{
    grid-template-columns:1fr!important;
  }
  .variant-configurator.has-virtual-shade .shade-stage,
  .variant-configurator.has-virtual-shade .shade-stage canvas{
    min-height:200px!important;
  }
}

/* =========================================================
   DARUGET PRODUCT EXPERIENCE — FINAL EDITORIAL REDESIGN
   Unified luxury commerce layout inspired by global beauty stores
   ========================================================= */
:root{
  --dd-ink:#17221f;
  --dd-muted:#68756f;
  --dd-line:#e4ebe8;
  --dd-soft:#f7faf8;
  --dd-accent:#0f766e;
  --dd-accent-dark:#0a5b55;
}
.product-page{background:linear-gradient(180deg,#fbfdfc 0,#fff 520px)!important}
.product-page>.container{max-width:1360px!important}
.product-breadcrumb{margin:18px 0 14px!important;font-size:11px!important;color:#7c8984!important}

/* One unified top surface */
.product-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 286px!important;
  gap:0!important;
  align-items:start!important;
  background:#fff!important;
  border:1px solid var(--dd-line)!important;
  border-radius:26px!important;
  overflow:visible!important;
  box-shadow:0 18px 55px rgba(25,61,51,.065)!important;
}
.product-showcase{
  display:grid!important;
  grid-template-columns:minmax(300px,38%) minmax(0,1fr)!important;
  gap:0!important;
  min-width:0!important;
  align-items:stretch!important;
}
.product-showcase-media,
.product-showcase-info{min-width:0!important}
.product-showcase-media{
  padding:28px 24px!important;
  background:linear-gradient(145deg,#f8fbf9,#f1f6f3)!important;
  border-left:1px solid var(--dd-line)!important;
  border-radius:0 26px 26px 0!important;
}
.product-gallery{
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  position:sticky!important;
  top:118px!important;
}
.product-visual-main{
  min-height:360px!important;
  border-radius:22px!important;
  border:1px solid #e0e9e5!important;
  background:radial-gradient(circle at 50% 38%,#fff 0,#f8fbf9 52%,#eef4f1 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.product-visual-main .visual-symbol{font-size:92px!important;filter:drop-shadow(0 18px 22px rgba(15,118,110,.12))!important}
.gallery-thumbs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin-top:12px!important}
.gallery-thumbs button{
  min-height:42px!important;
  padding:8px!important;
  border-radius:11px!important;
  border:1px solid #dde7e3!important;
  background:rgba(255,255,255,.9)!important;
  font-size:12px!important;
  white-space:normal!important;
}

.product-showcase-info{padding:34px 34px 30px!important;background:#fff!important}
.product-overview{
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
}
.product-labels{margin-bottom:16px!important}
.product-labels span{padding:7px 10px!important;border-radius:999px!important;font-size:12px!important}
.product-brand{font-size:12px!important;letter-spacing:.02em!important;color:var(--dd-accent)!important;margin-bottom:8px!important}
.product-overview h1#productName{
  max-width:760px!important;
  margin:0 0 7px!important;
  font-size:clamp(22px,1.85vw,29px)!important;
  line-height:1.62!important;
  font-weight:900!important;
  letter-spacing:-.025em!important;
  color:var(--dd-ink)!important;
}
.latin-name{font-size:11px!important;color:#84908b!important;margin-bottom:13px!important}
.rating-row{padding:11px 0 15px!important;margin:0!important;border-bottom:1px solid var(--dd-line)!important;gap:14px!important;font-size:12px!important}
.quick-summary{
  margin-top:20px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.quick-summary strong{display:block!important;margin-bottom:8px!important;font-size:11px!important;color:var(--dd-ink)!important}
.quick-summary p{font-size:11px!important;line-height:2.05!important;color:#596660!important;max-width:65ch!important}

/* Compact purchase rail */
.buy-card{
  width:auto!important;
  min-width:0!important;
  height:auto!important;
  margin:18px 18px 18px 0!important;
  padding:18px!important;
  border:1px solid #dfe8e4!important;
  border-radius:19px!important;
  background:#fbfdfc!important;
  box-shadow:none!important;
  position:sticky!important;
  top:112px!important;
}
.stock-line{padding-bottom:11px!important;margin-bottom:12px!important;border-bottom:1px solid var(--dd-line)!important}
.stock-line span{font-size:12px!important}.stock-line small{font-size:12px!important}
.price-block{margin-bottom:13px!important}.price-block del{font-size:12px!important}.price-block strong{font-size:21px!important;line-height:1.5!important}.price-block>span{font-size:12px!important;padding:5px 7px!important}
.sale-unit-card{padding:10px!important;border-radius:13px!important;margin-bottom:12px!important}.sale-unit-icon{width:34px!important;height:34px!important}.sale-unit-card small{font-size:12px!important}.sale-unit-card strong{font-size:12px!important}.sale-unit-card span{font-size:12px!important}
.buy-card>label{font-size:12px!important;margin-bottom:7px!important}.qty-control{height:40px!important;border-radius:11px!important}.qty-control button{width:40px!important}.qty-summary{font-size:12px!important;margin:8px 0 12px!important}
.add-cart,.buy-now,.wish-btn{min-height:43px!important;border-radius:12px!important;font-size:12px!important;margin-top:7px!important}
.add-cart{box-shadow:0 9px 20px rgba(15,118,110,.18)!important}
.buy-card ul{margin-top:13px!important;padding-top:12px!important;gap:7px!important}.buy-card li{font-size:12px!important;line-height:1.7!important}

/* Premium shade studio */
.product-options-shell{
  margin-top:22px!important;
  padding:0!important;
  border:1px solid var(--dd-line)!important;
  border-radius:26px!important;
  background:#fff!important;
  box-shadow:0 15px 45px rgba(25,61,51,.05)!important;
  overflow:hidden!important;
}
.product-options-intro{
  padding:21px 24px!important;
  margin:0!important;
  border-bottom:1px solid var(--dd-line)!important;
  background:linear-gradient(90deg,#f7fbf9,#fff)!important;
  align-items:center!important;
}
.product-options-intro>div:first-child>span{font-size:12px!important;letter-spacing:.08em!important;color:var(--dd-accent)!important}
.product-options-intro h2{font-size:18px!important;margin:5px 0!important;color:var(--dd-ink)!important}
.product-options-intro p{max-width:720px!important;font-size:12px!important;line-height:1.9!important;color:var(--dd-muted)!important}
.options-step{opacity:.75!important}
.variant-configurator,
.variant-configurator.has-virtual-shade{
  display:grid!important;
  grid-template-columns:minmax(300px,38%) minmax(0,1fr)!important;
  gap:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:#fff!important;
  overflow:visible!important;
}
.variant-configurator-head{
  grid-column:1!important;
  padding:20px 22px 8px!important;
  margin:0!important;
  border:0!important;
  background:#fbfdfc!important;
}
.variant-configurator.has-virtual-shade .variant-configurator-head{padding:20px 22px 8px!important;border:0!important;background:#fbfdfc!important}
.variant-configurator-head strong{font-size:13px!important}.variant-configurator-head small{font-size:12px!important}.variant-configurator-head>span{font-size:12px!important}
.variant-groups,
.variant-configurator.has-virtual-shade .variant-groups{
  grid-column:1!important;
  padding:8px 22px 18px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
  border-left:1px solid var(--dd-line)!important;
  background:#fbfdfc!important;
}
.variant-group,
.variant-configurator.has-virtual-shade .variant-group{
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.variant-group-head{margin:0 0 9px!important}.variant-group-head span{font-size:11px!important}.variant-group-head small{font-size:12px!important;color:#84908b!important}
.variant-options,
.variant-configurator.has-virtual-shade .variant-options{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  width:100%!important;
  overflow:visible!important;
  max-height:none!important;
}
.variant-option,
.variant-configurator.has-virtual-shade .variant-option{
  width:100%!important;
  min-width:0!important;
  min-height:46px!important;
  padding:8px 10px!important;
  border-radius:12px!important;
  justify-content:flex-start!important;
  border:1px solid #dde7e3!important;
  background:#fff!important;
  box-shadow:none!important;
}
.variant-option:hover{border-color:#9fc8be!important;transform:translateY(-1px)!important}
.variant-option.is-selected{border-color:var(--dd-accent)!important;background:#f0faf6!important;box-shadow:0 0 0 2px rgba(15,118,110,.08)!important}
.variant-option .swatch{width:26px!important;height:26px!important;min-width:26px!important;border:2px solid #fff!important;box-shadow:0 0 0 1px #ccd8d3!important}
.variant-option span{font-size:12px!important;overflow:hidden!important;text-overflow:ellipsis!important}
.variant-option .option-meta{font-size:12px!important}

/* Preview occupies the large studio area */
.variant-configurator.has-virtual-shade .virtual-shade-preview{
  grid-column:2!important;
  grid-row:1 / span 3!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
  min-width:0!important;
}
.variant-configurator.has-virtual-shade .virtual-shade-head{
  padding:18px 22px!important;
  background:#fff!important;
  border-bottom:1px solid var(--dd-line)!important;
}
.variant-configurator.has-virtual-shade .virtual-shade-body{
  display:grid!important;
  grid-template-columns:minmax(0,1.3fr) minmax(230px,.7fr)!important;
  gap:18px!important;
  padding:20px 22px 22px!important;
  align-items:stretch!important;
}
.variant-configurator.has-virtual-shade .shade-stage,
.variant-configurator.has-virtual-shade .shade-stage canvas{
  min-height:360px!important;
  max-height:none!important;
  border-radius:18px!important;
}
.shade-controls{align-self:stretch!important;justify-content:center!important;gap:11px!important}
.shade-current{border-radius:13px!important}.shade-upload{min-height:44px!important;border-radius:12px!important}.shade-help{font-size:12px!important;line-height:1.85!important;border-radius:12px!important}.shade-actions{grid-template-columns:1fr!important}.shade-actions button{min-height:42px!important;border-radius:11px!important}
.selected-variant-summary,
.variant-configurator.has-virtual-shade .selected-variant-summary{
  grid-column:1!important;
  margin:0!important;
  padding:14px 22px 18px!important;
  border:0!important;
  border-top:1px solid var(--dd-line)!important;
  border-left:1px solid var(--dd-line)!important;
  border-radius:0!important;
  background:#f5faf7!important;
}
.product-trust-strip{margin-top:18px!important}

@media(max-width:1080px){
  .product-hero{grid-template-columns:minmax(0,1fr) 260px!important}
  .product-showcase{grid-template-columns:330px minmax(0,1fr)!important}
  .product-showcase-info{padding:28px 25px!important}
  .product-overview h1#productName{font-size:23px!important}
  .variant-configurator,.variant-configurator.has-virtual-shade{grid-template-columns:340px minmax(0,1fr)!important}
  .variant-configurator.has-virtual-shade .virtual-shade-body{grid-template-columns:1fr!important}
  .variant-configurator.has-virtual-shade .shade-stage,.variant-configurator.has-virtual-shade .shade-stage canvas{min-height:300px!important}
}
@media(max-width:860px){
  .product-hero{grid-template-columns:1fr!important;border-radius:21px!important;overflow:hidden!important}
  .product-showcase{grid-template-columns:minmax(270px,42%) minmax(0,1fr)!important}
  .product-showcase-media{border-left:0!important;border-bottom:1px solid var(--dd-line)!important;border-radius:0!important;padding:20px!important}
  .product-gallery{position:static!important}
  .product-visual-main{min-height:300px!important}
  .buy-card{position:static!important;margin:0!important;border:0!important;border-top:1px solid var(--dd-line)!important;border-radius:0!important;padding:20px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px 14px!important}
  .buy-card .stock-line,.buy-card .price-block,.buy-card .sale-unit-card,.buy-card ul{grid-column:1/-1!important}
  .buy-card>label,.qty-control,.qty-summary{grid-column:1!important}.add-cart,.buy-now,.wish-btn{grid-column:2!important}
  .variant-configurator,.variant-configurator.has-virtual-shade{grid-template-columns:1fr!important}
  .variant-configurator-head,.variant-groups,.selected-variant-summary,.variant-configurator.has-virtual-shade .variant-configurator-head,.variant-configurator.has-virtual-shade .variant-groups,.variant-configurator.has-virtual-shade .selected-variant-summary{grid-column:1!important;border-left:0!important}
  .variant-configurator.has-virtual-shade .virtual-shade-preview{grid-column:1!important;grid-row:auto!important;border-top:1px solid var(--dd-line)!important}
}
@media(max-width:620px){
  .product-page>.container{padding-inline:10px!important}
  .product-hero{border-radius:18px!important}
  .product-showcase{grid-template-columns:1fr!important}
  .product-showcase-media{padding:14px!important}
  .product-visual-main{min-height:270px!important;border-radius:16px!important}
  .product-showcase-info{padding:20px 17px!important}
  .product-overview h1#productName{font-size:20px!important;line-height:1.7!important}
  .quick-summary p{font-size:12px!important}
  .buy-card{display:block!important;padding:17px!important}.buy-card>*{margin-bottom:9px!important}
  .product-options-shell{border-radius:18px!important;margin-top:14px!important}
  .product-options-intro{padding:17px!important;align-items:flex-start!important}.product-options-intro h2{font-size:15px!important}.options-step{display:none!important}
  .variant-configurator-head,.variant-configurator.has-virtual-shade .variant-configurator-head{padding:16px 15px 7px!important}
  .variant-groups,.variant-configurator.has-virtual-shade .variant-groups{padding:8px 15px 15px!important}
  .variant-options,.variant-configurator.has-virtual-shade .variant-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .variant-option,.variant-configurator.has-virtual-shade .variant-option{min-height:44px!important;padding:7px 8px!important}
  .variant-configurator.has-virtual-shade .virtual-shade-head{padding:14px 15px!important}
  .variant-configurator.has-virtual-shade .virtual-shade-body{padding:14px 15px 16px!important;gap:13px!important}
  .variant-configurator.has-virtual-shade .shade-stage,.variant-configurator.has-virtual-shade .shade-stage canvas{min-height:230px!important;border-radius:14px!important}
  .selected-variant-summary,.variant-configurator.has-virtual-shade .selected-variant-summary{padding:12px 15px 15px!important}
}
@media(max-width:380px){
  .variant-options,.variant-configurator.has-virtual-shade .variant-options{grid-template-columns:1fr!important}
}

/* =========================================================
   DaruGet Product Page — Personalization-first layout
   ========================================================= */
.product-hero.product-hero-custom{
  display:grid!important;
  grid-template-columns:minmax(390px,1.08fr) minmax(360px,.95fr) 248px!important;
  gap:18px!important;
  align-items:start!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.product-hero-custom>.product-options-inline,
.product-hero-custom>.product-title-card,
.product-hero-custom>.buy-card{
  margin:0!important;
  min-width:0!important;
}
.product-title-card{
  display:grid!important;
  grid-template-columns:112px minmax(0,1fr)!important;
  gap:18px!important;
  align-items:start!important;
  padding:22px!important;
  border:1px solid #dfe8e4!important;
  border-radius:24px!important;
  background:#fff!important;
  box-shadow:0 14px 38px rgba(25,61,51,.055)!important;
}
.product-title-media{position:sticky;top:116px;min-width:0}
.product-visual-compact{
  width:112px!important;
  height:132px!important;
  min-height:132px!important;
  border-radius:18px!important;
  border:1px solid #dce7e2!important;
  background:radial-gradient(circle at 50% 35%,#fff 0,#f6faf8 58%,#edf4f1 100%)!important;
  box-shadow:inset 0 1px 0 #fff!important;
}
.product-visual-compact .visual-symbol{font-size:48px!important;filter:drop-shadow(0 10px 15px rgba(15,118,110,.13))!important}
.product-visual-compact small{font-size:12px!important}.product-visual-compact b{font-size:12px!important}
.product-title-card .product-overview{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.product-title-card .product-labels{margin-bottom:11px!important;gap:6px!important}
.product-title-card .product-labels span{font-size:12px!important;padding:5px 8px!important}
.product-title-card .product-brand{font-size:12px!important;margin:0 0 5px!important}
.product-title-card h1#productName{
  font-size:clamp(17px,1.25vw,21px)!important;
  line-height:1.75!important;
  letter-spacing:-.018em!important;
  margin:0 0 4px!important;
  max-width:none!important;
}
.product-title-card .latin-name{font-size:12px!important;margin-bottom:9px!important}
.product-title-card .rating-row{padding:8px 0 10px!important;gap:9px!important;font-size:12px!important;flex-wrap:wrap!important}
.product-title-card .quick-summary{margin-top:13px!important}
.product-title-card .quick-summary strong{font-size:12px!important;margin-bottom:5px!important}
.product-title-card .quick-summary p{font-size:12px!important;line-height:1.95!important;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.product-info-link{margin-top:13px;border:0;background:transparent;color:#0f766e;font-size:12px;font-weight:900;padding:0;cursor:pointer}

.product-options-inline{
  border:1px solid #dfe8e4!important;
  border-radius:24px!important;
  background:#fff!important;
  box-shadow:0 14px 38px rgba(25,61,51,.055)!important;
  overflow:hidden!important;
}
.product-options-inline .product-options-intro{padding:17px 19px!important;background:linear-gradient(135deg,#f2faf6,#fff)!important;border-bottom:1px solid #e5eeea!important}
.product-options-inline .product-options-intro h2{font-size:15px!important;margin:3px 0!important}
.product-options-inline .product-options-intro p{font-size:12px!important;line-height:1.8!important}
.product-options-inline .variant-configurator,
.product-options-inline .variant-configurator.has-virtual-shade{
  display:block!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:#fff!important;
  overflow:visible!important;
}
.product-options-inline .variant-configurator-head,
.product-options-inline .variant-configurator.has-virtual-shade .variant-configurator-head{padding:14px 18px 8px!important;background:#fff!important;border:0!important}
.product-options-inline .variant-groups,
.product-options-inline .variant-configurator.has-virtual-shade .variant-groups{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  padding:8px 18px 14px!important;
  background:#fff!important;
  border:0!important;
}
.product-options-inline .variant-group,
.product-options-inline .variant-configurator.has-virtual-shade .variant-group{padding:11px!important;border:1px solid #e2ebe7!important;border-radius:15px!important;background:#fbfdfc!important;min-width:0!important}
.product-options-inline .variant-group-head{margin-bottom:8px!important}
.product-options-inline .variant-options,
.product-options-inline .variant-configurator.has-virtual-shade .variant-options{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(88px,1fr))!important;
  gap:7px!important;
  width:100%!important;
  overflow:visible!important;
  max-height:none!important;
}
.product-options-inline .variant-option,
.product-options-inline .variant-configurator.has-virtual-shade .variant-option{width:100%!important;min-width:0!important;min-height:40px!important;padding:6px 8px!important;border-radius:11px!important}
.product-options-inline .variant-option .swatch{width:23px!important;height:23px!important;min-width:23px!important}
.product-options-inline .selected-variant-summary,
.product-options-inline .variant-configurator.has-virtual-shade .selected-variant-summary{margin:0!important;padding:11px 18px 14px!important;border:0!important;border-top:1px solid #e6eeea!important;border-radius:0!important;background:#f7fbf9!important}
.product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-preview{
  margin:0 14px 14px!important;
  border:1px solid #e0eae5!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-head{padding:12px 14px!important}
.product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-body{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(160px,.85fr)!important;gap:12px!important;padding:12px!important}
.product-options-inline .shade-stage,.product-options-inline .shade-stage canvas{min-height:220px!important;max-height:260px!important;border-radius:14px!important}
.product-options-inline .shade-actions{grid-template-columns:1fr!important}

.product-hero-custom>.buy-card{width:auto!important;padding:16px!important;border-radius:20px!important;position:sticky!important;top:112px!important;background:#fbfdfc!important}
.product-hero-custom>.buy-card .price-block strong{font-size:19px!important}

@media(max-width:1180px){
 .product-hero.product-hero-custom{grid-template-columns:minmax(360px,1fr) minmax(320px,.88fr) 230px!important;gap:14px!important}
 .product-title-card{grid-template-columns:96px minmax(0,1fr)!important;padding:18px!important;gap:14px!important}
 .product-visual-compact{width:96px!important;height:118px!important;min-height:118px!important}
 .product-options-inline .variant-groups,.product-options-inline .variant-configurator.has-virtual-shade .variant-groups{grid-template-columns:1fr!important}
 .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-body{grid-template-columns:1fr!important}
}
@media(max-width:900px){
 .product-hero.product-hero-custom{grid-template-columns:minmax(0,1fr) 250px!important}
 .product-options-inline{grid-column:1!important;grid-row:2!important}
 .product-title-card{grid-column:1!important;grid-row:1!important}
 .product-hero-custom>.buy-card{grid-column:2!important;grid-row:1 / span 2!important}
 .product-title-media{position:static!important}
}
@media(max-width:680px){
 .product-hero.product-hero-custom{grid-template-columns:1fr!important;gap:12px!important}
 .product-title-card,.product-options-inline,.product-hero-custom>.buy-card{grid-column:1!important;grid-row:auto!important}
 .product-title-card{grid-template-columns:78px minmax(0,1fr)!important;padding:15px!important;border-radius:18px!important;gap:12px!important}
 .product-visual-compact{width:78px!important;height:96px!important;min-height:96px!important;border-radius:14px!important}
 .product-visual-compact .visual-symbol{font-size:36px!important}
 .product-title-card h1#productName{font-size:17px!important;line-height:1.72!important}
 .product-title-card .quick-summary p{-webkit-line-clamp:4}
 .product-options-inline{border-radius:18px!important}
 .product-options-inline .variant-groups,.product-options-inline .variant-configurator.has-virtual-shade .variant-groups{grid-template-columns:1fr!important;padding:8px 13px 13px!important}
 .product-options-inline .variant-options,.product-options-inline .variant-configurator.has-virtual-shade .variant-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-body{grid-template-columns:1fr!important}
 .product-options-inline .shade-stage,.product-options-inline .shade-stage canvas{min-height:210px!important;max-height:none!important}
 .product-hero-custom>.buy-card{position:static!important;border-radius:18px!important}
}
@media(max-width:380px){
 .product-title-card{grid-template-columns:1fr!important}.product-title-media{display:flex;justify-content:center}.product-visual-compact{width:104px!important;height:112px!important}
 .product-options-inline .variant-options,.product-options-inline .variant-configurator.has-virtual-shade .variant-options{grid-template-columns:1fr!important}
}

/* Final mobile fix — virtual sunscreen/cosmetic shade tester */
@media (max-width:680px){
  .product-options-inline,
  .product-options-inline .variant-configurator,
  .product-options-inline .variant-configurator.has-virtual-shade,
  .product-options-inline .virtual-shade-preview{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  .product-options-inline .variant-configurator.has-virtual-shade{
    display:block!important;
  }
  .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-preview{
    margin:10px 10px 12px!important;
    width:calc(100% - 20px)!important;
    border-radius:16px!important;
    overflow:hidden!important;
  }
  .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-head{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:8px!important;
    padding:13px!important;
  }
  .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-head>div{
    display:flex!important;
    align-items:flex-start!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
  }
  .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-head strong{
    font-size:13px!important;
    line-height:1.7!important;
  }
  .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-head small{
    display:block!important;
    font-size:12px!important;
    line-height:1.8!important;
  }
  .product-options-inline .variant-configurator.has-virtual-shade .virtual-shade-body{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    gap:12px!important;
    padding:11px!important;
    box-sizing:border-box!important;
  }
  .product-options-inline .shade-stage,
  .product-options-inline .variant-configurator.has-virtual-shade .shade-stage{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4/3!important;
    max-height:none!important;
    overflow:hidden!important;
    border-radius:14px!important;
    box-sizing:border-box!important;
    background:#f4f8f6!important;
  }
  .product-options-inline .shade-stage canvas,
  .product-options-inline .variant-configurator.has-virtual-shade .shade-stage canvas{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    object-fit:contain!important;
    touch-action:none!important;
  }
  .product-options-inline .shade-stage-empty{
    position:absolute!important;
    inset:0!important;
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    padding:20px!important;
    box-sizing:border-box!important;
    text-align:center!important;
  }
  .product-options-inline .shade-stage-empty b{font-size:12px!important;line-height:1.8!important}
  .product-options-inline .shade-stage-empty small{font-size:12px!important;line-height:1.9!important}
  .product-options-inline .shade-controls{
    display:grid!important;
    width:100%!important;
    min-width:0!important;
    padding:0!important;
    gap:10px!important;
    box-sizing:border-box!important;
  }
  .product-options-inline .shade-current,
  .product-options-inline .shade-range,
  .product-options-inline .shade-help,
  .product-options-inline .shade-privacy{
    width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  .product-options-inline .shade-upload{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-height:48px!important;
    padding:11px 12px!important;
    box-sizing:border-box!important;
    font-size:11px!important;
    line-height:1.5!important;
    text-align:center!important;
    border-radius:12px!important;
  }
  .product-options-inline .shade-range input[type=range]{width:100%!important;max-width:100%!important}
  .product-options-inline .shade-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    gap:8px!important;
  }
  .product-options-inline .shade-actions button{
    width:100%!important;
    min-height:44px!important;
    padding:8px 10px!important;
    font-size:12px!important;
    border-radius:11px!important;
  }
  .product-options-inline .variant-options,
  .product-options-inline .variant-configurator.has-virtual-shade .variant-options{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
  }
}
@media (max-width:390px){
  .product-options-inline .variant-options,
  .product-options-inline .variant-configurator.has-virtual-shade .variant-options{grid-template-columns:1fr!important}
  .product-options-inline .shade-stage,
  .product-options-inline .variant-configurator.has-virtual-shade .shade-stage{aspect-ratio:1/1!important}
}