.ninja-privacy {
  --ninja-privacy-bg: #111111;
  --ninja-privacy-fg: #f7f3ea;
  --ninja-privacy-text: var(--ninja-privacy-fg);
  --ninja-privacy-muted: #d8d1c4;
  --ninja-privacy-line: #77716a;
  --ninja-privacy-accent: #b88a08;
  --ninja-privacy-accent-fg: #fff8dc;
  --ninja-privacy-radius: 8px;
  --ninja-privacy-font: inherit;
  --ninja-privacy-z: 2147483000;
  --ninja-privacy-z-index: var(--ninja-privacy-z);
  --ninja-privacy-trigger-bg: rgba(0, 0, 0, 0.5);
  --ninja-privacy-trigger-fg: #ffffff;
  --ninja-privacy-trigger-border: rgba(255, 255, 255, 0.54);
  --ninja-privacy-trigger-icon-bg: var(--ninja-privacy-accent);
  --ninja-privacy-trigger-bottom: 12px;
  --ninja-privacy-trigger-side: 16px;
  bottom: clamp(16px, 5vw, 48px);
  left: clamp(16px, 5vw, 48px);
  max-width: min(660px, calc(100vw - 32px));
  position: fixed;
  z-index: var(--ninja-privacy-z-index);
}

.ninja-privacy,
.ninja-privacy *,
.ninja-privacy-trigger,
.ninja-privacy-trigger * {
  box-sizing: border-box;
}

.ninja-privacy__card {
  background: var(--ninja-privacy-bg);
  border: 1px solid color-mix(in srgb, var(--ninja-privacy-line), transparent 35%);
  border-radius: var(--ninja-privacy-radius);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.35);
  color: var(--ninja-privacy-text);
  font-family: var(--ninja-privacy-font);
  padding: clamp(22px, 4vw, 38px);
  position: relative;
}

.ninja-privacy__card h2 {
  color: inherit;
  font: inherit;
  font-size: clamp(1.6rem, 3vw, 2.5rem);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.05;
  margin: 0 2rem 1rem 0;
}

.ninja-privacy__card p {
  color: var(--ninja-privacy-muted);
  font-size: clamp(1rem, 2vw, 1.35rem);
  line-height: 1.45;
  margin: 0 0 1.5rem;
}

.ninja-privacy__close {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  color: var(--ninja-privacy-muted);
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 2rem;
  height: 2.5rem;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 1rem;
  top: 0.8rem;
  width: 2.5rem;
}

.ninja-privacy__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.ninja-privacy__actions button {
  appearance: none;
  background: transparent;
  border: 2px solid var(--ninja-privacy-line);
  color: var(--ninja-privacy-text);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  letter-spacing: 0.08em;
  min-height: 3.4rem;
  padding: 0.8rem 1.25rem;
}

.ninja-privacy__actions .ninja-privacy__primary {
  background: var(--ninja-privacy-accent);
  border-color: color-mix(in srgb, var(--ninja-privacy-accent), #000 20%);
  color: var(--ninja-privacy-accent-fg);
}

.ninja-privacy-trigger {
  align-items: center;
  appearance: none;
  background: var(--ninja-privacy-trigger-bg);
  border: 1px solid var(--ninja-privacy-trigger-border);
  border-radius: 999px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
  color: var(--ninja-privacy-trigger-fg);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--ninja-privacy-font);
  font-size: 12px;
  font-weight: 800;
  gap: 9px;
  line-height: 1;
  min-height: 42px;
  padding: 7px 13px 7px 8px;
  position: fixed;
  text-transform: uppercase;
  z-index: var(--ninja-privacy-z-index);
}

.ninja-privacy-trigger--bottom-left {
  bottom: var(--ninja-privacy-trigger-bottom);
  left: var(--ninja-privacy-trigger-side);
}

.ninja-privacy-trigger--bottom-right {
  bottom: var(--ninja-privacy-trigger-bottom);
  right: var(--ninja-privacy-trigger-side);
}

.ninja-privacy-trigger--top-left {
  left: var(--ninja-privacy-trigger-side);
  top: var(--ninja-privacy-trigger-bottom);
}

.ninja-privacy-trigger--top-right {
  right: var(--ninja-privacy-trigger-side);
  top: var(--ninja-privacy-trigger-bottom);
}

.ninja-privacy-trigger__icon {
  background: var(--ninja-privacy-trigger-icon-bg);
  border-radius: 50%;
  display: grid;
  height: 30px;
  place-items: center;
  width: 30px;
}

.ninja-privacy-trigger__icon::before {
  border: 2px solid var(--ninja-privacy-trigger-fg);
  border-radius: 50%;
  content: "";
  height: 14px;
  width: 14px;
}

.ninja-privacy__card--prefs {
  width: min(760px, calc(100vw - 32px));
}

.ninja-privacy__prefs {
  display: grid;
  gap: 0.8rem;
}

.ninja-privacy__category {
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--ninja-privacy-line), transparent 45%);
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr auto;
  padding: 1rem;
}

.ninja-privacy__category strong,
.ninja-privacy__category small {
  display: block;
}

.ninja-privacy__category small {
  color: var(--ninja-privacy-muted);
  line-height: 1.35;
  margin-top: 0.25rem;
}

.ninja-privacy__category input {
  height: 1.3rem;
  width: 1.3rem;
}

@media (max-width: 640px) {
  .ninja-privacy {
    bottom: 12px;
    left: 12px;
    max-width: calc(100vw - 24px);
  }

  .ninja-privacy__actions {
    display: grid;
  }

  .ninja-privacy__actions button {
    width: 100%;
  }

  .ninja-privacy-trigger {
    max-width: 42px;
    overflow: hidden;
    padding: 6px;
    white-space: nowrap;
  }
}