/* Diamond Studio 5.3 — larger camera, live artwork, no visual frame on ink. */
#workspace-root .ws-sign-workspace .ws-sign-heading { margin-bottom: 18px; }
#workspace-root .ws-sign-workspace .ws-steps { margin-bottom: 18px; padding-block: 13px; }
#workspace-root .ws-signature-viewer .ws-viewer-body,
#workspace-root .ws-file-queue + .ws-signature-viewer .ws-viewer-body {
  height: clamp(360px, calc(100dvh - 360px), 900px);
}
#workspace-root .ws-signature-viewer { scroll-margin-top: 90px; }
#workspace-root .ws-signature-viewer .ws-viewer-toolbar { gap: 12px 18px; align-items: center; }
#workspace-root .ws-viewer-fit-controls { flex-wrap: wrap; }
#workspace-root .ws-viewer-fit-controls .ws-text-button { padding: 8px; min-height: 36px; border-radius: 5px; }
#workspace-root .ws-viewer-fit-controls .ws-text-button[aria-pressed="true"] { color: white; background: #ffffff12; }
#workspace-root .ws-viewer-expand { display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; min-height: 38px; font-size: var(--ui-font-control); border: 1px solid #bda16e60; background: #f6f0e5; color: #293e55; border-radius: 6px; }
#workspace-root .ws-viewer-expand:hover { background: #eadcc2; }
#workspace-root .ws-signature-viewer .ws-viewer-toolbar button.ws-viewer-expand { color: #293e55; background: #f6f0e5; }
#workspace-root .ws-signature-viewer .ws-viewer-toolbar button.ws-viewer-expand:hover { color: #293e55; background: #eadcc2; }
#workspace-root .ws-viewer-scrim { position: fixed; inset: 0; z-index: 10040; background: #102034a6; backdrop-filter: blur(5px); }
#workspace-root .ws-signature-viewer.ws-viewer--expanded {
  position: fixed; inset: 20px; z-index: 10050; display: flex; flex-direction: column;
  background: #f7f9fc; border: 1px solid #c8d3e2; border-radius: 12px; outline: none;
  box-shadow: 0 25px 90px #10203450;
}
#workspace-root .ws-viewer--expanded .ws-viewer-body { flex: 1; min-height: 0; height: auto; }
#workspace-root .ws-viewer--expanded .ws-viewer-caption { flex-shrink: 0; }
#workspace-root .ws-viewer--expanded .ws-viewer-toolbar { flex-shrink: 0; }

/* The hit area moves the PNG, but draws no frame, fill, bar or divider. */
#workspace-root .ws-signature-preview.ws-signature-preview--transparent {
  display: block; padding: 0; border: 0; border-radius: 0; background: transparent;
  box-shadow: none; overflow: visible; cursor: grab; touch-action: none;
}
#workspace-root .ws-signature-preview--transparent:active { cursor: grabbing; }
#workspace-root .ws-signature-preview--transparent > img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; background: transparent; border: 0; }
#workspace-root .ws-signature-preview--transparent.updating { opacity: .55; }
#workspace-root .ws-signature-preview--transparent:focus-visible { outline: none !important; }
#workspace-root .ws-signature-viewer:has(.ws-signature-preview--transparent:focus-visible) .ws-viewer-caption { box-shadow: inset 0 2px #a9854f; color: #735a34; }
#workspace-root .ws-signature-live { padding: 0 !important; border: 0 !important; margin: 18px 0 23px; }
#workspace-root .ws-properties > .ws-signature-live { padding: 20px !important; margin: 0; border-bottom: 1px solid #e3e9f1 !important; }
#workspace-root .ws-signature-live h2 { font-size: var(--ui-font-control); margin: 0 0 12px; }
#workspace-root .ws-transparency-grid {
  width: 100%; display: flex; align-items: center; justify-content: center;
  background-color: #fff;
  background-image: linear-gradient(45deg, #e8edf3 25%, transparent 25%), linear-gradient(-45deg, #e8edf3 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #e8edf3 75%), linear-gradient(-45deg, transparent 75%, #e8edf3 75%);
  background-size: 14px 14px; background-position: 0 0, 0 7px, 7px -7px, -7px 0;
  border-radius: 6px; overflow: hidden; min-height: 85px;
}
#workspace-root .ws-transparency-grid > img { display: block; width: 100%; height: auto; background: transparent; border: 0; }
#workspace-root .ws-transparency-grid > img.updating { opacity: .55; }
#workspace-root .ws-signature-live-status { color: #64768b; font-size: var(--ui-font-caption); line-height: 1.6; margin: 9px 0 6px; }
#workspace-root .ws-signature-live .ws-caption { font-size: var(--ui-font-caption); line-height: 1.6; }
#workspace-root .ws-modal.ws-modal--wide { width: min(1500px, calc(100vw - 48px)); max-height: calc(100dvh - 40px); }
#workspace-root .ws-modal--wide > .ws-modal-body { padding: 14px; }
#workspace-root .ws-modal--wide .ws-viewer--result .ws-viewer-body { height: calc(100dvh - 270px); min-height: 360px; }
#workspace-root .ws-modal--wide .ws-viewer { border-radius: 8px; }
#workspace-root:has(.ws-modal--wide) .ws-toasts { z-index: 10010; }
@media (max-width: 1120px) {
  #workspace-root .ws-signature-viewer .ws-viewer-body,
  #workspace-root .ws-file-queue + .ws-signature-viewer .ws-viewer-body { height: 650px; }
  #workspace-root .ws-viewer--expanded .ws-viewer-body { height: auto; min-height: 0; }
}
@media (max-width: 700px) {
  #workspace-root .ws-sign-workspace .ws-steps { gap: 8px; padding: 13px 10px; }
  #workspace-root .ws-sign-workspace .ws-steps li { flex: 1 1 0; flex-direction: column; align-items: center; min-width: 0; gap: 6px; text-align: center; }
  #workspace-root .ws-sign-workspace .ws-steps strong { font-size: var(--ui-font-control); hyphens: auto; overflow-wrap: anywhere; }
  #workspace-root .ws-sign-workspace .ws-steps small { display: none; }
  #workspace-root .ws-signature-viewer .ws-viewer-body,
  #workspace-root .ws-file-queue + .ws-signature-viewer .ws-viewer-body { height: 560px; }
  #workspace-root .ws-signature-viewer.ws-viewer--expanded { inset: 7px; border-radius: 8px; }
  #workspace-root .ws-viewer--expanded .ws-viewer-body { height: auto; min-height: 0; }
  #workspace-root .ws-signature-viewer .ws-viewer-toolbar { gap: 8px; padding: 10px; }
  #workspace-root .ws-viewer-fit-controls { width: 100%; gap: 3px; }
  #workspace-root .ws-viewer-fit-controls .ws-text-button { font-size: var(--ui-font-control); padding: 7px 6px; }
  #workspace-root .ws-viewer-expand { font-size: var(--ui-font-control); padding: 7px 8px; }
  #workspace-root .ws-modal.ws-modal--wide { width: 100%; max-height: calc(100dvh - 24px); }
  #workspace-root .ws-modal--wide > .ws-modal-body { padding: 8px; }
  #workspace-root .ws-modal--wide .ws-viewer--result .ws-viewer-body { height: calc(100dvh - 330px); min-height: 260px; }
}
#workspace-root .ws-modal.ws-modal--wide { height: calc(100dvh - 40px); }
#workspace-root .ws-modal--wide > header,
#workspace-root .ws-modal--wide > footer { flex-shrink: 0; }
#workspace-root .ws-modal--wide > .ws-modal-body { display: flex; flex: 1; min-height: 0; overflow: hidden; }
#workspace-root .ws-modal--wide .ws-viewer--result { display: flex; flex-direction: column; flex: 1; min-height: 0; min-width: 0; }
#workspace-root .ws-modal--wide .ws-viewer--result .ws-viewer-body { flex: 1; height: auto; min-height: 0; }
