/* A bar, not a curtain. It sits at the bottom, above the safe area, and the page
   behind it stays usable -- because the tool is why the visitor is here and
   because a page that cannot be read until it is answered gets answered at
   random. */
.consent {
  position: fixed;
  inset-inline: 0;
  inset-block-end: 0;
  z-index: 30;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem clamp(1rem, 4vw, 2rem);
  padding-block-end: calc(1rem + env(safe-area-inset-bottom));
  background: var(--panel);
  border-block-start: 1px solid var(--line);
}
.consent[hidden] { display: none; }
.consent-copy { margin: 0; max-inline-size: 46rem; }
.consent-actions { display: flex; gap: .75rem; }
/* Identical weight on both. A reject styled as an afterthought is a dark
   pattern, and it is the specific one regulators name. */
.consent .button { min-block-size: 44px; padding-inline: 1.25rem; }

/* The anchor ad, if there is one, must never sit under this. */
.consent ~ .sf-adslot-anchor { inset-block-end: 5.5rem; }

@media (max-width: 38rem) {
  .consent { flex-direction: column; align-items: stretch; }
  .consent-actions { display: grid; grid-template-columns: 1fr 1fr; }
}

/* Optional replay choice reuses consent geometry, with this site's palette. */
#clarity-consent { background: var(--paper); color: var(--ink); border-color: var(--ink); }
#clarity-consent .button { background: var(--paper); color: var(--ink); }
body:has(#clarity-consent:not([hidden])) { padding-block-end: calc(17rem + env(safe-area-inset-bottom)); }
@media (min-width: 52rem) {
  body:has(#clarity-consent:not([hidden])) { padding-block-end: calc(9rem + env(safe-area-inset-bottom)); }
}