.consent-banner {
  position: fixed;
  z-index: 1200;
  right: 22px;
  bottom: 22px;
  width: min(560px, calc(100% - 44px));
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--separator, #d8d8d2), transparent 12%);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-secondary, #fff), transparent 3%);
  box-shadow: 0 24px 70px rgba(12, 18, 28, .24);
  color: var(--primary-text, rgb(var(--text, 24 28 32)));
  font-family: inherit;
  backdrop-filter: blur(20px) saturate(1.15);
}

.consent-banner[hidden] { display: none; }
.consent-banner__eyebrow { margin: 0 0 8px; color: inherit; font-size: 12px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.consent-banner__text { margin: 0; color: var(--secondary-text, rgb(var(--text-muted, 87 92 98))); font-size: 14px; line-height: 1.62; }
.consent-banner__text a { color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.consent-banner__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.consent-banner__button { min-height: 46px; padding: 10px 16px; border: 1px solid currentColor; border-radius: 13px; background: var(--primary-text, rgb(var(--text, 24 28 32))); color: var(--surface, rgb(var(--surface, 248 248 244))); font: inherit; font-size: 13px; font-weight: 750; cursor: pointer; transition: transform .18s ease, opacity .18s ease; }
.consent-banner__button:hover { transform: translateY(-1px); opacity: .86; }
.consent-banner__button:focus-visible, .footer-consent-button:focus-visible { outline: 3px solid var(--accent-lime, rgb(var(--accent, 184 255 0))); outline-offset: 3px; }
.footer-consent-button { padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }

#theme-dark:checked ~ .consent-banner {
  border-color: rgb(70 78 62);
  background: rgb(31 34 29 / .98);
  color: rgb(244 248 237);
}

#theme-dark:checked ~ .consent-banner .consent-banner__text { color: rgb(190 199 181); }
#theme-dark:checked ~ .consent-banner .consent-banner__button { background: rgb(244 248 237); color: rgb(18 20 18); }

@media (max-width: 560px) {
  .consent-banner { right: 14px; bottom: 14px; width: calc(100% - 28px); padding: 19px; border-radius: 17px; }
  .consent-banner__actions { grid-template-columns: 1fr; }
}
