.cookie-banner {
  position:fixed;
  z-index:90;
  bottom:1rem;
  left:50%;
  transform:translateX(-50%);
  width:min(calc(100% - 2rem),71rem);
  display:flex;
  gap:2rem;
  align-items:center;
  padding:1.5rem 1.75rem;
  background:white;
  border:1px solid var(--line);
  border-top:3px solid var(--mint);
  border-radius:1.5rem;
  box-shadow:0 .5rem 3rem #02264a20;
  max-height:80vh;
  overflow:auto;
  color:var(--ink)
}
.cookie-banner-copy {
  flex:1;
  min-width:0
}
.cookie-banner h2 {
  font-size:1.1rem;
  letter-spacing:-.02em;
  margin-bottom:.45rem
}
.cookie-banner p {
  font-size:.87rem;
  line-height:1.5;
  color:var(--muted)
}
.cookie-banner a {
  text-decoration:underline;
  text-underline-offset:.2em;
  color:var(--navy)
}
.cookie-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.5rem;
  flex-shrink:0
}
.cookie-actions .button {
  font-size:.8rem;
  min-height:2.8rem;
  padding:.65rem 1rem;
  background:white;
  color:var(--navy);
  border:1px solid var(--navy)
}
.cookie-actions .button:hover {
  background:var(--navy);
  color:white
}
.cookie-actions .cookie-text-button {
  grid-column:1/-1;
  justify-self:center;
  margin-top:.25rem;
  font-size:.75rem
}
.cookie-text-button {
  color:var(--navy);
  background:none;
  padding:0;
  text-decoration:underline;
  text-underline-offset:.2em;
  font-size:inherit
}
.dialog {
  width:min(calc(100% - 2.5rem),34rem);
  max-height:88vh;
  overflow:auto;
  border:0;
  border-top:3px solid var(--mint);
  border-radius:1.8rem;
  padding:2rem;
  color:var(--ink);
  background:white;
  box-shadow:var(--shadow)
}
.dialog::backdrop {
  background:#02264a9c;
  backdrop-filter:blur(4px)
}
.dialog-header {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:1rem;
  margin-bottom:1rem
}
.dialog h2 {
  font-size:1.75rem;
  letter-spacing:-.035em
}
.dialog p {
  font-size:.92rem;
  color:var(--muted)
}
.dialog-close {
  width:2rem;
  height:2rem;
  display:grid;
  place-items:center;
  flex-shrink:0;
  border-radius:50%;
  background:var(--paper);
  color:var(--navy);
  font-size:1.3rem;
  line-height:1
}
.cookie-essential {
  padding:1.2rem;
  background:var(--paper);
  border-radius:var(--radius-sm);
  margin:1.25rem 0;
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:start
}
.cookie-essential strong {
  font-size:.9rem;
  color:var(--navy)
}
.cookie-essential p {
  font-size:.8rem;
  line-height:1.5;
  margin-top:.35rem
}
.cookie-essential>span {
  white-space:nowrap;
  border:1px solid #bbb;
  border-radius:var(--radius-pill);
  padding:.1rem .5rem;
  font-size:.65rem;
  color:var(--navy)
}
.cookie-optional {
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  padding:1rem 1.2rem;
  margin-bottom:1.25rem
}
.cookie-optional legend {
  padding:0 .25rem;
  font-size:.9rem;
  font-weight:600;
  color:var(--navy)
}
.cookie-optional p {
  font-size:.82rem
}
.cookie-choices {
  display:flex;
  gap:1.5rem;
  flex-wrap:wrap;
  margin-top:1rem
}
.cookie-choices label {
  display:flex;
  gap:.4rem;
  align-items:center;
  color:var(--navy);
  font-size:.87rem;
  cursor:pointer
}
.cookie-choices input {
  accent-color:var(--navy);
  width:1rem;
  height:1rem
}
.dialog .button--mint {
  width:100%
}
.dialog .button--mint:hover {
  background:var(--navy);
  color:white
}
.dialog .cookie-details {
  font-size:.75rem;
  margin-top:1.1rem
}
.dialog .cookie-details a {
  color:var(--navy);
  text-decoration:underline
}
.message-number {
  font-size:1.75rem;
  color:var(--navy);
  display:block;
  margin:1.5rem 0
}
.dialog .cluster {
  margin-top:1.5rem
}
.dialog .field {
  margin-top:1rem
}
.analytics-status {
  display:block;
  color:var(--navy);
  font-size:.85rem;
  margin-top:1rem
}
@media(max-width:760px) {
  .cookie-banner {
    align-items:stretch;
    flex-direction:column;
    gap:1rem;
    padding:1.2rem
  }
  .cookie-actions {
    width:100%
  }
  .dialog {
    padding:1.5rem
  }
  .dialog h2 {
    font-size:1.5rem
  }
  .cookie-essential {
    flex-direction:column;
    gap:.5rem
  }
}
.consent-essential {
  padding:1rem;
  background:var(--paper);
  border-radius:1rem;
  margin:1.5rem 0
}
.consent-essential strong {
  color:var(--navy);
  font-size:.9rem
}
.consent-essential p {
  font-size:.8rem;
  margin-top:.4rem
}
.dialog fieldset {
  border:1px solid var(--line);
  border-radius:1rem;
  padding:1rem
}
.dialog legend {
  font-size:.9rem;
  font-weight:600;
  color:var(--navy);
  padding:0 .4rem
}
.dialog fieldset p {
  font-size:.8rem;
  margin-bottom:1rem
}
.consent-choice {
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.85rem;
  color:var(--navy);
  margin-top:.6rem;
  cursor:pointer
}
.consent-choice input {
  width:1rem;
  height:1rem;
  accent-color:var(--navy)
}
.dialog .message-number {
  font-size:1.75rem;
  color:var(--navy)
}