/* Subtle drawably chrome for site buttons — keep native controls, soft ink only. */
:root {
  --drawably-stroke: var(--ink, var(--text, #16140f));
  --drawably-fill: var(--ink, var(--text, #16140f));
  --drawably-paper: var(--paper, var(--bg, #f6f3ec));
  --drawably-width: 1.15;
  --drawably-ink: var(--drawably-stroke);
}

button.theme.drawably-host,
button.theme.drawably-button {
  font-family: inherit;
  color: inherit;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  clip-path: none;
  -webkit-clip-path: none;
  transform: none;
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
}

button.theme.drawably-button:hover,
button.theme.drawably-button:active {
  transform: none;
}

button.theme.drawably-host .drawably-svg {
  z-index: 0;
}

button.theme.drawably-host svg:not(.drawably-svg) {
  position: relative;
  z-index: 1;
}

/* Classic pages used a hard CSS border; drawably owns the stroke now. */
button.theme {
  border-color: transparent;
}