.zmt-image-watermark {
  --iw-ink: #102441;
  --iw-muted: #6a809e;
  --iw-soft: #f4f8fd;
  --iw-line: rgba(33, 64, 108, .13);
  --iw-blue: #216cff;
  --iw-violet: #7048ff;
  --iw-cyan: #08bed6;
  width: calc(100vw - 72px);
  max-width: 1840px;
  margin: 28px auto 64px;
  color: var(--iw-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.zmt-image-watermark * { box-sizing: border-box; }
.zmt-image-watermark [hidden] { display: none !important; }
.zmt-image-watermark button,
.zmt-image-watermark input,
.zmt-image-watermark select { font-family: inherit; }
.zmt-image-watermark button { cursor: pointer; }
.zmt-image-watermark h1,
.zmt-image-watermark h2 { text-wrap: balance; }
.zmt-image-watermark p,
.zmt-image-watermark small { text-wrap: pretty; }

.zmt-iw-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 28px;
  padding: 42px 48px;
  border-radius: 30px;
  background: radial-gradient(circle at 90% 15%, rgba(0,203,190,.19), transparent 26%), radial-gradient(circle at 72% 108%, rgba(108,77,255,.16), transparent 34%), linear-gradient(130deg,#f8fbff,#edf6ff);
  box-shadow: 0 0 0 1px var(--iw-line), 0 16px 42px rgba(41,79,132,.1);
}
.zmt-iw-hero > div > span,
.zmt-iw-heading > span,
.zmt-iw-result header span { color: #1874df; font-size: 13px; font-weight: 850; letter-spacing: .06em; }
.zmt-iw-hero h1 { margin: 11px 0; font-size: 38px; letter-spacing: -.045em; }
.zmt-iw-hero p { max-width: 850px; margin: 0; color: var(--iw-muted); font-size: 17px; line-height: 1.7; }
.zmt-iw-steps { display: flex; gap: 10px; margin-top: 25px; }
.zmt-iw-steps b { padding: 9px 14px; color: #7185a2; background: rgba(255,255,255,.72); border-radius: 12px; font-size: 13px; }
.zmt-iw-steps .is-active { color: #1764da; background: #fff; box-shadow: 0 4px 12px rgba(33,88,172,.1); }
.zmt-iw-hero aside {
  display: grid;
  align-content: center;
  padding: 24px;
  color: #fff;
  border-radius: 23px;
  background: linear-gradient(145deg,#6951f8,#0cbdd0);
  box-shadow: 0 14px 28px rgba(48,94,205,.25);
}
.zmt-iw-hero aside small,
.zmt-iw-hero aside p { margin: 0; color: rgba(255,255,255,.82); font-size: 13px; }
.zmt-iw-hero aside strong { margin: 8px 0 2px; font-size: 38px; font-variant-numeric: tabular-nums; }
.zmt-iw-hero aside > span { font-size: 14px; font-weight: 750; }

.zmt-iw-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.48fr) minmax(430px, .72fr);
  gap: 24px;
  align-items: start;
  margin-top: 24px;
}
.zmt-iw-stage-card,
.zmt-iw-controls,
.zmt-iw-result {
  padding: 28px;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 0 0 1px var(--iw-line), 0 14px 38px rgba(38,74,124,.08);
}
.zmt-iw-stage-card > input,
.zmt-iw-logo-settings > input { position: absolute; width: 1px; height: 1px; opacity: 0; clip-path: inset(50%); }
[data-iw-drop] {
  display: grid;
  min-height: 630px;
  place-content: center;
  justify-items: center;
  gap: 13px;
  padding: 48px;
  border: 2px dashed rgba(40,107,255,.3);
  border-radius: 22px;
  background: radial-gradient(circle,rgba(40,107,255,.09),transparent 29%),#f8fbff;
  text-align: center;
  transition: transform 180ms cubic-bezier(.2,0,0,1), border-color 180ms, background-color 180ms;
}
[data-iw-drop]:hover { border-color: var(--iw-blue); background-color: #f1f8ff; transform: translateY(-2px); }
[data-iw-drop]:active { transform: scale(.96); }
[data-iw-drop] i {
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  color: #fff;
  background: linear-gradient(145deg,var(--iw-blue),#09c3d8);
  border-radius: 23px;
  box-shadow: 0 12px 26px rgba(40,107,255,.25);
  font-size: 44px;
  font-style: normal;
}
[data-iw-drop] strong { margin-top: 8px; font-size: 22px; }
[data-iw-drop] small { color: var(--iw-muted); font-size: 14px; }
[data-iw-drop] em { padding: 12px 22px; color: var(--iw-blue); background: #eaf2ff; border-radius: 13px; font-size: 14px; font-style: normal; font-weight: 850; }
.zmt-iw-canvas {
  position: relative;
  display: grid;
  min-height: 630px;
  place-items: center;
  overflow: hidden;
  border-radius: 22px;
  background-color: #e8eff7;
  background-image: linear-gradient(45deg,#dce5ef 25%,transparent 25%), linear-gradient(-45deg,#dce5ef 25%,transparent 25%), linear-gradient(45deg,transparent 75%,#dce5ef 75%), linear-gradient(-45deg,transparent 75%,#dce5ef 75%);
  background-size: 22px 22px;
}
.zmt-iw-canvas > img:first-child,
.zmt-iw-result > img { display: block; max-width: 100%; max-height: 700px; object-fit: contain; outline: 1px solid rgba(0,0,0,.1); outline-offset: -1px; }
.zmt-iw-canvas > span,
.zmt-iw-canvas > img[data-iw-preview-logo] { position: absolute; max-width: 34%; max-height: 34%; object-fit: contain; filter: drop-shadow(0 2px 4px rgba(0,0,0,.3)); pointer-events: none; }
.zmt-iw-canvas > span { padding: 8px 12px; color: #fff; font-weight: 850; font-size: clamp(14px,2vw,32px); white-space: nowrap; text-shadow: 0 2px 4px rgba(0,0,0,.35); }
.zmt-iw-canvas .is-hidden { display: none; }
.zmt-iw-canvas.is-northwest { --x: 8%; --y: 10%; }
.zmt-iw-canvas.is-north { --x: 50%; --y: 10%; }
.zmt-iw-canvas.is-northeast { --x: 92%; --y: 10%; }
.zmt-iw-canvas.is-west { --x: 8%; --y: 50%; }
.zmt-iw-canvas.is-center { --x: 50%; --y: 50%; }
.zmt-iw-canvas.is-east { --x: 92%; --y: 50%; }
.zmt-iw-canvas.is-southwest { --x: 8%; --y: 90%; }
.zmt-iw-canvas.is-south { --x: 50%; --y: 90%; }
.zmt-iw-canvas.is-southeast { --x: 92%; --y: 90%; }
.zmt-iw-canvas > span,
.zmt-iw-canvas > img[data-iw-preview-logo] { left: var(--x,92%); top: var(--y,90%); transform: translate(-50%,-50%); }
.zmt-iw-canvas > button {
  position: absolute;
  top: 14px;
  right: 14px;
  min-height: 40px;
  padding: 0 13px;
  border: 0;
  border-radius: 12px;
  background: rgba(18,38,66,.75);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
}

.zmt-iw-controls { display: grid; gap: 16px; padding: 26px; }
.zmt-iw-heading { padding: 2px 2px 0; }
.zmt-iw-heading h2 { margin: 8px 0; font-size: 27px; letter-spacing: -.03em; }
.zmt-iw-heading p { margin: 0; color: var(--iw-muted); font-size: 14px; line-height: 1.65; }

.zmt-iw-mode-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  padding: 7px;
  border-radius: 20px;
  background: #eef4fb;
  box-shadow: inset 0 0 0 1px rgba(68,104,154,.08);
}
.zmt-iw-mode-card {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) 22px;
  gap: 10px;
  min-width: 0;
  min-height: 72px;
  align-items: center;
  padding: 11px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #607895;
  text-align: left;
  transition: color 180ms, background-color 180ms, box-shadow 180ms, transform 160ms;
}
.zmt-iw-mode-card:hover { background: rgba(255,255,255,.66); color: #355474; }
.zmt-iw-mode-card:active { transform: scale(.96); }
.zmt-iw-mode-card.is-active {
  color: #123258;
  background: #fff;
  box-shadow: 0 7px 18px rgba(47,86,137,.12);
}
.zmt-iw-mode-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 13px;
  background: #dce7f7;
  color: #527295;
  transition: color 180ms, background-color 180ms, transform 180ms;
}
.zmt-iw-mode-card.is-active .zmt-iw-mode-icon { color: #fff; background: linear-gradient(145deg,#286dff,#6c4dff 70%,#0ec4d3); box-shadow: 0 8px 16px rgba(45,88,224,.23); transform: translateY(-1px); }
.zmt-iw-mode-icon svg,
.zmt-iw-logo-pick svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.zmt-iw-mode-copy { min-width: 0; display: grid; gap: 3px; }
.zmt-iw-mode-copy strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.zmt-iw-mode-copy small { overflow: hidden; color: #7890ad; font-size: 12px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.zmt-iw-mode-check { position: relative; display: grid; width: 22px; height: 22px; place-items: center; }
.zmt-iw-mode-check svg { position: absolute; width: 21px; height: 21px; fill: none; stroke: #a0b1c7; stroke-width: 2; transition: opacity 180ms, transform 180ms, filter 180ms; }
.zmt-iw-mode-check-active { opacity: 0; color: #fff; stroke: #fff !important; transform: scale(.25); filter: blur(4px); }
.zmt-iw-mode-card.is-active .zmt-iw-mode-check { border-radius: 50%; background: linear-gradient(145deg,#1f79ff,#0cbfd6); }
.zmt-iw-mode-card.is-active .zmt-iw-mode-check-idle { opacity: 0; transform: scale(.25); filter: blur(4px); }
.zmt-iw-mode-card.is-active .zmt-iw-mode-check-active { opacity: 1; transform: scale(1); filter: blur(0); }

.zmt-iw-section {
  display: grid;
  gap: 13px;
  padding: 16px;
  border-radius: 20px;
  background: linear-gradient(145deg,#fbfdff,#f4f8fd);
  box-shadow: inset 0 0 0 1px rgba(59,94,142,.13);
}
.zmt-iw-field-head,
.zmt-iw-section-title,
.zmt-iw-range-field > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #294662;
  font-size: 13px;
  font-weight: 850;
}
.zmt-iw-field-head output,
.zmt-iw-section-title small { color: #7389a6; font-size: 12px; font-weight: 750; }
.zmt-iw-controls label { display: grid; gap: 7px; color: #284563; font-size: 13px; font-weight: 850; }
.zmt-iw-text-input,
.zmt-iw-controls select {
  width: 100%;
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid #d5e0ee;
  border-radius: 12px;
  outline: 0;
  background: #fff;
  color: var(--iw-ink);
  font-size: 14px;
  font-weight: 700;
  transition: border-color 160ms, box-shadow 160ms, background-color 160ms;
}
.zmt-iw-text-input:hover,
.zmt-iw-controls select:hover { border-color: #b8cae1; background: #fcfeff; }
.zmt-iw-text-input:focus,
.zmt-iw-controls select:focus { border-color: var(--iw-blue); box-shadow: 0 0 0 3px rgba(40,107,255,.12); }
.zmt-iw-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.zmt-iw-color-field > span:first-child { display: block; }
.zmt-iw-color-control {
  display: flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  padding: 5px 10px 5px 5px;
  border: 1px solid #d5e0ee;
  border-radius: 12px;
  background: #fff;
}
.zmt-iw-color-control:focus-within { border-color: var(--iw-blue); box-shadow: 0 0 0 3px rgba(40,107,255,.12); }
.zmt-iw-color-control input[type=color] { width: 32px; height: 32px; padding: 0; border: 0; border-radius: 9px; overflow: hidden; background: transparent; cursor: pointer; }
.zmt-iw-color-control b { color: #4f6682; font-size: 12px; font-variant-numeric: tabular-nums; letter-spacing: .02em; }

.zmt-iw-logo-pick {
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) auto;
  align-items: center;
  gap: 11px;
  min-height: 74px;
  padding: 11px;
  border: 1px dashed #8bb3ff;
  border-radius: 16px;
  background: linear-gradient(115deg,#f0f7ff,#f9fbff);
  cursor: pointer;
  transition: border-color 180ms, background-color 180ms, transform 160ms;
}
.zmt-iw-logo-pick:hover { border-color: #286bff; background-color: #eaf4ff; }
.zmt-iw-logo-pick:active { transform: scale(.96); }
.zmt-iw-logo-pick > i { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; color: #216cff; background: #dceaff; }
.zmt-iw-logo-pick > span { display: grid; gap: 4px; min-width: 0; }
.zmt-iw-logo-pick b { overflow: hidden; color: #244461; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.zmt-iw-logo-pick small { color: #7188a6; font-size: 12px; font-weight: 650; }
.zmt-iw-logo-pick em { padding: 8px 10px; border-radius: 10px; color: #1765df; background: #fff; font-size: 12px; font-style: normal; font-weight: 850; box-shadow: 0 3px 8px rgba(38,100,187,.09); }

.zmt-iw-options { gap: 15px; }
.zmt-iw-section-title { padding-bottom: 1px; }
.zmt-iw-position-wrap { display: grid; gap: 9px; }
.zmt-iw-position {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  padding: 7px;
  border-radius: 16px;
  background: #e6eef8;
  box-shadow: inset 0 0 0 1px rgba(59,94,142,.1);
}
.zmt-iw-position::before {
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  width: 22px;
  height: 22px;
  border: 1px solid rgba(103,133,168,.26);
  border-radius: 50%;
  background: rgba(255,255,255,.62);
  content: '';
  transform: translate(-50%,-50%);
}
.zmt-iw-position button {
  position: relative;
  z-index: 1;
  display: grid;
  min-height: 36px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
  transition: background-color 160ms, box-shadow 160ms, transform 160ms;
}
.zmt-iw-position button:hover { background: rgba(255,255,255,.7); }
.zmt-iw-position button:active { transform: scale(.96); }
.zmt-iw-position button span {
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #91a7c2;
  box-shadow: 0 0 0 3px rgba(145,167,194,.14);
  transition: background-color 160ms, box-shadow 160ms, transform 160ms;
}
.zmt-iw-position button.is-active { background: linear-gradient(145deg,#226cff,#0cbcd3); box-shadow: 0 5px 12px rgba(36,102,224,.22); }
.zmt-iw-position button.is-active span { background: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.21); transform: scale(1.13); }

.zmt-iw-range-field { display: grid; gap: 9px; }
.zmt-iw-range-field output { color: #216cff; font-size: 13px; font-variant-numeric: tabular-nums; }
.zmt-iw-range {
  width: 100%;
  height: 22px;
  margin: 0;
  padding: 0;
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(90deg,#216cff var(--iw-range-value,50%),#dce6f2 var(--iw-range-value,50%));
  cursor: pointer;
}
.zmt-iw-range::-webkit-slider-runnable-track { height: 6px; border-radius: 999px; background: transparent; }
.zmt-iw-range::-moz-range-track { height: 6px; border-radius: 999px; background: transparent; }
.zmt-iw-range::-webkit-slider-thumb {
  width: 18px;
  height: 18px;
  margin-top: -6px;
  appearance: none;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #216cff;
  box-shadow: 0 3px 8px rgba(32,93,204,.3);
}
.zmt-iw-range::-moz-range-thumb { width: 18px; height: 18px; border: 3px solid #fff; border-radius: 50%; background: #216cff; box-shadow: 0 3px 8px rgba(32,93,204,.3); }
.zmt-iw-range:focus-visible { outline: 3px solid rgba(40,107,255,.2); outline-offset: 3px; }
.zmt-iw-switch-row { display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 12px; }
.zmt-iw-switch { display: flex !important; align-items: center; gap: 9px; cursor: pointer; }
.zmt-iw-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.zmt-iw-switch > span { width: 38px; height: 22px; border-radius: 20px; background: #cdd9e9; transition: background-color 160ms; }
.zmt-iw-switch > span::after { display: block; width: 16px; height: 16px; margin: 3px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); content: ''; transition: transform 160ms; }
.zmt-iw-switch input:checked + span { background: linear-gradient(100deg,#216cff,#0cbfd6); }
.zmt-iw-switch input:checked + span::after { transform: translateX(16px); }
.zmt-iw-switch input:focus-visible + span { outline: 3px solid rgba(40,107,255,.2); outline-offset: 3px; }
.zmt-iw-switch b { font-size: 13px; }
.zmt-iw-switch-row > small { color: #7d91aa; font-size: 12px; font-weight: 650; }
.zmt-iw-degree { grid-template-columns: 1fr 110px; align-items: center; }

.zmt-iw-controls details { border-radius: 14px; background: #fafcff; box-shadow: inset 0 0 0 1px var(--iw-line); }
.zmt-iw-controls summary { min-height: 48px; padding: 14px; color: #284563; cursor: pointer; font-size: 13px; font-weight: 850; }
.zmt-iw-controls summary small { float: right; color: #8293aa; }
.zmt-iw-controls details p { margin: 0; padding: 0 14px 14px; color: var(--iw-muted); font-size: 12px; line-height: 1.6; }
.zmt-iw-submit,
.zmt-iw-result button[data-iw-download] {
  min-height: 52px;
  border: 0;
  border-radius: 15px;
  color: #fff;
  background: linear-gradient(105deg,#216cff,#7048ff 55%,#0dc4d3);
  box-shadow: 0 12px 25px rgba(54,79,223,.26);
  font-size: 16px;
  font-weight: 850;
  transition: transform 160ms, filter 160ms, box-shadow 160ms;
}
.zmt-iw-submit:hover,
.zmt-iw-result button[data-iw-download]:hover { filter: brightness(1.06); box-shadow: 0 15px 28px rgba(54,79,223,.31); }
.zmt-iw-submit:active,
.zmt-iw-result button:active { transform: scale(.96); }
.zmt-iw-submit:disabled { cursor: not-allowed; opacity: .48; filter: grayscale(.45); box-shadow: none; }
.zmt-iw-note { margin: -6px 0 0; color: var(--iw-muted); font-size: 12px; text-align: center; }

.zmt-iw-result { margin-top: 24px; overflow: hidden; }
.zmt-iw-result header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 0 22px; }
.zmt-iw-result h2 { margin: 8px 0; font-size: 27px; }
.zmt-iw-result header p,
.zmt-iw-result footer { margin: 0; color: var(--iw-muted); font-size: 13px; }
.zmt-iw-result header > div:last-child { display: flex; gap: 9px; }
.zmt-iw-result button { min-height: 42px; padding: 0 14px; border: 0; border-radius: 12px; background: #f0f4f8; color: #435a74; font-size: 13px; font-weight: 850; }
.zmt-iw-result button[data-iw-download] { min-height: 42px; }
.zmt-iw-result button[data-iw-clear].is-confirming { color: #fff; background: #c64c3a; box-shadow: 0 0 0 3px rgba(198,76,58,.15); }
.zmt-iw-result > img { display: block; width: 100%; max-height: 720px; margin: auto; background: #eef3f8; }
.zmt-iw-result footer { padding: 15px 5px 0; text-align: center; }
.zmt-iw-toast { position: fixed; z-index: 99990; bottom: 28px; left: 50%; min-width: 270px; max-width: 560px; padding: 13px 18px; border-radius: 13px; background: #152842; color: #fff; text-align: center; box-shadow: 0 14px 38px rgba(10,25,45,.25); transform: translateX(-50%); }
.zmt-iw-toast.is-error { background: #b6454c; }
@media (max-width: 1023px) { .zmt-image-watermark { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .zmt-image-watermark * { transition-duration: .01ms !important; } }

/* Watermark mode cards use distinct blue-violet and teal-blue identities. */
.zmt-iw-mode-card[data-iw-mode="text"] {
  background: linear-gradient(135deg,#eaf2ff,#f0edff);
  color: #32557b;
}
.zmt-iw-mode-card[data-iw-mode="image"] {
  background: linear-gradient(135deg,#e7faf6,#e9f4ff);
  color: #315e73;
}
.zmt-iw-mode-card[data-iw-mode="text"] .zmt-iw-mode-icon { color: #4d67e9; background: #dce6ff; }
.zmt-iw-mode-card[data-iw-mode="image"] .zmt-iw-mode-icon { color: #079d9e; background: #d5f3ee; }
.zmt-iw-mode-card[data-iw-mode="text"].is-active {
  color: #fff;
  background: linear-gradient(120deg,#2c70ff,#7048ff);
  box-shadow: 0 10px 22px rgba(67,82,223,.28);
}
.zmt-iw-mode-card[data-iw-mode="image"].is-active {
  color: #fff;
  background: linear-gradient(120deg,#009d9e,#137ef5);
  box-shadow: 0 10px 22px rgba(10,131,184,.28);
}
.zmt-iw-mode-card.is-active .zmt-iw-mode-icon {
  color: #fff;
  background: rgba(255,255,255,.2);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.22);
}
.zmt-iw-mode-card.is-active .zmt-iw-mode-copy small { color: rgba(255,255,255,.8); }
.zmt-iw-mode-card.is-active .zmt-iw-mode-check { background: rgba(255,255,255,.2); box-shadow: inset 0 0 0 1px rgba(255,255,255,.22); }

/* Restore one accessible slider and completely suppress the native checkbox skin. */
.zmt-iw-switch {
  position: relative;
  display: flex !important;
  min-height: 44px;
  align-items: center;
  gap: 9px;
}
.zmt-iw-switch input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  clip-path: inset(50%) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.zmt-iw-switch > span {
  position: relative;
  width: 40px;
  height: 24px;
  flex: 0 0 40px;
  border-radius: 999px;
  background: #cbd8e8;
  box-shadow: inset 0 1px 2px rgba(38,76,123,.12);
  pointer-events: none;
  transition: background-color 160ms, box-shadow 160ms;
}
.zmt-iw-switch > span::after {
  display: block;
  width: 18px;
  height: 18px;
  margin: 3px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 5px rgba(28,57,94,.22);
  content: '';
  transition: transform 160ms;
}
.zmt-iw-switch input:checked + span {
  background: linear-gradient(100deg,#216cff,#0cbfd6);
  box-shadow: 0 5px 11px rgba(32,112,217,.22);
}
.zmt-iw-switch input:checked + span::after { transform: translateX(16px); }
.zmt-iw-switch input:focus-visible + span { outline: 3px solid rgba(40,107,255,.22); outline-offset: 3px; }