.mi-cookie-banner {
  position: fixed;
  z-index: 1000;
  right: max(20px, env(safe-area-inset-right));
  bottom: max(20px, env(safe-area-inset-bottom));
  left: max(20px, env(safe-area-inset-left));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px 32px;
  width: min(780px, calc(100% - 40px));
  margin-left: auto;
  padding: 22px 24px;
  color: #f7f9fc;
  background: rgba(11, 34, 49, .97);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .28);
}

.mi-cookie-banner[hidden] { display: none; }
.mi-cookie-banner__content p { max-width: 460px; margin: 0; font-size: 14px; line-height: 1.45; }
.mi-cookie-banner__content a, .mi-cookie-banner__settings-trigger { color: #9bd2ff; font-size: 14px; }
.mi-cookie-banner__content a { display: inline-block; margin-top: 8px; }
.mi-cookie-banner__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.mi-cookie-banner__button, .mi-cookie-banner__save, .mi-cookie-banner__settings-trigger {
  min-height: 38px;
  padding: 0 14px;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  border-radius: 999px;
  cursor: pointer;
}
.mi-cookie-banner__button, .mi-cookie-banner__save { color: #102e42; background: #fff; border: 1px solid #fff; }
.mi-cookie-banner__button--quiet, .mi-cookie-banner__settings-trigger { color: #fff; background: transparent; border: 1px solid rgba(255, 255, 255, .45); }
.mi-cookie-banner__settings-trigger { min-height: auto; padding: 0; border: 0; text-decoration: underline; text-underline-offset: 3px; }
.mi-cookie-banner__settings { grid-column: 1 / -1; display: grid; gap: 12px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .16); }
.mi-cookie-banner__settings[hidden] { display: none; }
.mi-cookie-banner__settings label { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.4; }
.mi-cookie-banner__settings input { margin-top: 3px; accent-color: #fff; }
.mi-cookie-banner__save { justify-self: start; }

@media (max-width: 640px) {
  .mi-cookie-banner { grid-template-columns: 1fr; gap: 16px; padding: 18px; }
  .mi-cookie-banner__actions { justify-content: flex-start; }
}
