.marketing-consent[hidden], .marketing-settings[hidden] { display: none; }
.marketing-consent { position: fixed; z-index: 10000; bottom: max(16px, env(safe-area-inset-bottom)); left: 16px; right: 16px; width: auto; max-width: 720px; margin: auto; max-height: 85dvh; overflow-y: auto; box-sizing: border-box; padding: 22px; background: #141210; color: #f3eee6; border: 1px solid #94703f; border-radius: 16px; box-shadow: 0 8px 40px #000b; font-family: inherit; }
.marketing-consent h2 { margin: 0 0 10px; font-size: 1.3rem; }
.marketing-consent p { margin: 0 0 16px; font-size: .95rem; line-height: 1.55; }
.marketing-consent a { color: #e2bd7c; text-decoration: underline; }
.marketing-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.marketing-actions button { flex: 1 1 220px; min-height: 44px; padding: 10px 14px; border: 1px solid #b38b52; border-radius: 8px; background: #262018; color: #f3eee6; font: inherit; cursor: pointer; }
.marketing-settings { display: block; margin: 14px auto 0; padding: 10px 14px; min-height: 44px; border: 1px solid #94703f; border-radius: 8px; background: transparent; color: #d6b784; font: inherit; font-size: .85rem; cursor: pointer; }
.marketing-consent button:focus-visible, .marketing-settings:focus-visible { outline: 2px solid #f1cf90; outline-offset: 3px; }
@media (max-width: 480px) { .marketing-consent { left: 10px; right: 10px; padding: 16px; } }
/* V21b: compact phone banner so the first screen and main button stay visible. */
@media (max-width: 600px) {
  .marketing-consent { padding: 12px 14px; border-radius: 14px; bottom: max(8px, env(safe-area-inset-bottom)); }
  .marketing-consent h2 { margin-bottom: 4px; font-size: 1rem; }
  .marketing-consent p { margin-bottom: 10px; font-size: .8rem; line-height: 1.4; }
  .marketing-actions { flex-wrap: nowrap; gap: 8px; }
  .marketing-actions button { flex: 1 1 0; min-width: 0; min-height: 44px; padding: 8px 10px; }
}