/* KSK Designer 0.9.14 - optical centering of the garment, not the entire stage.
   Fabric's canvas stays at its original size and its mouse coordinates are
   recalculated from the element bounding rectangle. Desktop only. */
@media (min-width: 851px) {
  .kskd-shell.kskd-floating-colors .kskd-stage > .canvas-container {
    transform:translateX(clamp(8px,1.05vw,16px))!important;
  }
}

/* Compact, recognizable color-switch shortcut; dual tone circular swatch. */
@media (max-width: 850px) {
  .kskd-shell.kskd-corner-layout .kskd-mobile-variant-picker:not([hidden]) {
    width:82px!important;
    max-width:calc(100vw - 20px)!important;
  }
  .kskd-shell.kskd-corner-layout .kskd-mobile-variant-toggle {
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    padding:5px 4px!important;
    border:1px solid #b8d6f3!important;
    border-radius:11px!important;
    background:linear-gradient(125deg,#e2f1ff 0%,#eef7ff 47%,#ffffff 47%,#ffffff 100%)!important;
    color:#165ba7!important;
    box-shadow:0 3px 10px rgba(24,65,110,.13)!important;
    white-space:normal!important;
    text-align:left!important;
    font-size:10px!important;
    font-weight:700!important;
    line-height:1.06!important;
    letter-spacing:0!important;
    box-sizing:border-box!important;
  }
  .kskd-shell.kskd-corner-layout .kskd-mobile-variant-icon {
    display:block!important;
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    flex:0 0 20px!important;
    border-radius:50%!important;
    border:2px solid #fff!important;
    background:linear-gradient(135deg,#2475ce 0%,#2475ce 49%,#f1bd53 50%,#f1bd53 100%)!important;
    box-shadow:0 0 0 1px rgba(36,89,142,.24)!important;
  }
  .kskd-shell.kskd-corner-layout .kskd-mobile-variant-caption {
    display:block!important;
    min-width:0!important;
    font-size:10px!important;
    line-height:1.06!important;
    white-space:normal!important;
  }
  .kskd-shell.kskd-corner-layout .kskd-mobile-variant-toggle[aria-expanded="true"] {
    border-color:#2376c9!important;
    background:linear-gradient(125deg,#cfe7ff 0%,#e6f3ff 47%,#f9fcff 47%,#f9fcff 100%)!important;
  }
  .kskd-shell.kskd-corner-layout .kskd-mobile-variant-toggle:focus-visible {
    outline:2px solid #1769c2!important;
    outline-offset:2px!important;
  }
  /* Additional vertical room for the two-line shortcut over the cog. */
  .kskd-shell.kskd-corner-layout .kskd-corner[data-group="zone"] > .kskd-zoom-control.kskd-zoom-zone-aligned.kskd-zoom-compact {
    bottom:calc(100% + 58px)!important;
  }
}
