.ot-ack {
  box-sizing: border-box;
  width: min(100% - 32px, 560px);
  max-height: min(740px, calc(100dvh - 32px));
  padding: 0;
  border: 1px solid var(--border, #dce2e6);
  border-radius: 20px;
  background: var(--panel, #fff);
  color: var(--text, #10151b);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
  font-family: system-ui, -apple-system, sans-serif;
}
.ot-ack[open] { display: flex; flex-direction: column; }
.ot-ack::backdrop { background: rgba(7, 16, 22, .72); }
.ot-ack-header, .ot-ack-footer { flex: none; padding: 20px 24px; }
.ot-ack-header { padding-bottom: 14px; }
.ot-ack-badge {
  display: inline-block;
  color: var(--primary, #006c74);
  font-size: .75rem;
  font-weight: 750;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.ot-ack h1 { margin: 8px 0; font-size: 1.5rem; line-height: 1.2; }
.ot-ack-header p { margin: 0; font-size: .875rem; line-height: 1.45; }
.ot-ack-content {
  min-height: 100px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0 24px;
}
.ot-ack-content section { padding: 14px 0; }
.ot-ack-content h2 { margin: 0 0 6px; font-size: 1rem; line-height: 1.35; }
.ot-ack-content p { margin: 0; font-size: .9375rem; line-height: 1.55; }
.ot-ack-content a { color: var(--primary, #006c74); text-decoration: underline; }
.ot-ack-footer { padding-top: 14px; }
.ot-ack-error { margin: 0 0 12px; color: #b42318; font-size: .875rem; line-height: 1.45; }
.ot-ack-actions { display: flex; gap: 10px; }
.ot-ack-actions button {
  min-height: 48px;
  padding: 10px 16px;
  border: 1px solid var(--border, #dce2e6);
  border-radius: 12px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.ot-ack-leave { background: var(--panel, #fff); color: var(--text, #10151b); }
.ot-ack-agree { flex: 1; background: var(--primary, #006c74); color: #fff; border-color: transparent !important; }
.ot-ack-agree:disabled { opacity: .5; cursor: not-allowed; }
.ot-ack :focus-visible { outline: 3px solid var(--primary, #006c74); outline-offset: 3px; }
@media (max-width: 560px) {
  .ot-ack { width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
  .ot-ack-header, .ot-ack-footer { padding-inline: 18px; }
  .ot-ack-content { padding-inline: 18px; }
  .ot-ack-actions { flex-direction: column-reverse; }
}
