@import url("/design/ui.css?v=f1c35c6a69ec");

/* Shared compact controls: sign-in, copy and dialog close. */
.top nav a[href*="/signin"] {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  min-height:44px;
  padding:10px 14px;
  gap:14px;
  border:1px solid var(--line);
  border-radius:var(--radius-control,4px);
  background:transparent;
  color:var(--ink);
  font:500 14px/1.4 var(--font-ui,Manrope,Arial,sans-serif);
  text-decoration:none;
  transition:background-color .15s ease,color .15s ease;
}
.top nav:has(>a[href*="/signin"]) { flex-wrap:wrap; }
.top nav a[href*="/signin"]:hover { background:var(--soft);color:var(--ink); }
.top nav a[href*="/signin"]:active { background:var(--soft-pressed);translate:none; }

.copy-code, .db-button[data-action="copy"], .db-button.copy-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  min-height:44px;
  padding:10px 14px;
  gap:14px;
  border:1px solid var(--line);
  border-radius:var(--radius-control,4px);
  background:var(--white);
  color:var(--ink);
  font:500 14px/1.4 var(--font-ui,Manrope,Arial,sans-serif);
  text-decoration:none;
  transition:background-color .15s ease,color .15s ease;
}
.copy-code:hover, .db-button[data-action="copy"]:hover, .db-button.copy-button:hover {
  background:var(--soft);border-color:var(--line);color:var(--ink);
}
.copy-code:not(:disabled):active, .db-button[data-action="copy"]:not(:disabled):active, .db-button.copy-button:not(:disabled):active {
  background:var(--soft-pressed);border-color:var(--line);color:var(--ink);box-shadow:none;translate:none;transition-duration:.15s;
}

/* Same outlined 44px close button in payment, account and web-form dialogs. */
dialog .close, #waitlist .close, .payment-overlay .close, .modal-head .close {
  display:grid;
  place-items:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  padding:0;
  border:1px solid var(--line);
  border-radius:var(--radius-control,4px);
  background:transparent;
  color:var(--muted);
  font:400 20px/1 var(--font-ui,Manrope,Arial,sans-serif);
  transition:background-color .15s ease,color .15s ease;
}
dialog .close svg, #waitlist .close svg, .payment-overlay .close svg {
  width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;
}
dialog .close:hover, #waitlist .close:hover, .payment-overlay .close:hover {
  background:var(--soft);border-color:var(--line);color:var(--ink);
}
dialog .close:focus-visible, #waitlist .close:focus-visible, .payment-overlay .close:focus-visible {
  background:var(--soft);border-color:var(--focus);color:var(--ink);
  outline:none;box-shadow:inset 0 0 0 1px var(--focus);
}
dialog .close:not(:disabled):active, #waitlist .close:not(:disabled):active, .payment-overlay .close:not(:disabled):active {
  background:var(--soft-pressed);border-color:var(--line);color:var(--ink);box-shadow:none;translate:none;outline:none;transition-duration:.15s;
}

/* Labels wrap inside narrow containers, including translated and destructive actions. */
.db-button,.solid-button{max-width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere;text-align:center}
.db-button.quiet:not(:disabled):hover,.db-button:not(.primary):not(.danger):not(.danger-solid):not(:disabled):hover{background:var(--soft)}
.db-button.quiet:not(:disabled):active,.db-button:not(.primary):not(.danger):not(.danger-solid):not(:disabled):active{background:var(--soft-pressed)}
.db-button:focus-visible,.copy-code:focus-visible{outline:2px solid var(--focus);outline-offset:2px}