/* Cookie banner, built by consent.js. Accept and Decline share one class on
   purpose: same size, same fill, same weight. Anything that makes refusing
   look lesser than accepting defeats the point of asking. */
.consent{
  position:fixed;left:16px;bottom:16px;z-index:100;
  width:min(25rem,calc(100vw - 32px));
  padding:1.1rem 1.15rem 1.15rem;
  background:var(--card-2);border:1px solid var(--line-bright);border-radius:var(--radius);
  box-shadow:0 20px 60px -16px rgba(0,0,0,.7);
  color:var(--text);
}
.consent[hidden]{display:none}
.consent:focus{outline:none}
.consent:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.consent-title{font-weight:650;font-size:.98rem;margin-bottom:.4rem}
.consent-text,.consent-status{font-size:.86rem;line-height:1.5;color:var(--muted)}
.consent-text a{color:var(--text);border-bottom:1px solid var(--line-bright)}
.consent-status{margin-top:.55rem;color:var(--text)}
.consent-actions{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin-top:.95rem}
.consent-btn{
  flex:1 1 0;min-width:7rem;
  font:inherit;font-size:.92rem;font-weight:600;letter-spacing:-.005em;
  padding:.72rem 1rem;border-radius:999px;border:1px solid transparent;
  background:var(--grad-b);color:var(--bg);cursor:pointer;
  transition:background .2s ease;
}
.consent-btn:hover{background:#fff}
.consent-close{
  flex:0 0 100%;font:inherit;font-size:.82rem;color:var(--muted);
  background:none;border:0;padding:.2rem 0;cursor:pointer;text-align:center;
}
.consent-close:hover{color:var(--text)}

/* The footer's "Cookie settings" matches the anchors beside it. */
.footer-inner .micro .consent-link{
  font:inherit;line-height:inherit;color:var(--muted);
  background:none;border:0;border-bottom:1px solid var(--line);
  padding:0;cursor:pointer;
}
.footer-inner .micro .consent-link:hover{color:var(--text)}

@media(max-width:640px){
  .consent{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));width:auto}

  /* With Cookie settings added the footer links no longer fit one row on a
     phone, and a flex row that cannot wrap breaks them mid-label instead. */
  .footer-links{flex-wrap:wrap;justify-content:center}
  .footer-links>*{white-space:nowrap}
}
@media print{.consent{display:none}}
