/* ==========================================================================
   Fantasy Hall — consent banner
   Shared by the landing and the legal pages, which use different stylesheets,
   so it carries the few tokens it needs rather than depending on either.
   ========================================================================== */
.consent {
  position: fixed;
  z-index: 400;                 /* above the mobile CTA bar (50) and the nav (100) */
  inset: auto 16px calc(16px + env(safe-area-inset-bottom, 0px)) 16px;
  display: grid;
  gap: 12px;
  max-width: 460px;
  padding: 18px 20px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(18, 18, 24, 0.97);
  box-shadow: 0 32px 70px -34px rgba(0, 0, 0, 1);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  color: #f3f3f6;
  font-family: 'Sora', system-ui, -apple-system, sans-serif;
}
.consent-body {
  margin: 0;
  color: #b9b9c4;               /* 7.0:1 on the panel */
  font-size: 14px;
  line-height: 1.55;
  text-wrap: pretty;
}
/* Both buttons share one size, weight and shape. Refusing must not be the
   harder path, so accept only differs by fill. */
.consent-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.consent-btn {
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 11px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05);
  color: #f3f3f6;
  cursor: pointer;
  font-family: inherit;
  font-size: 14.5px;
  font-weight: 600;
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.consent-btn.is-accept {
  border-color: transparent;
  background: linear-gradient(180deg, #ff9a4d, #ff7a1a 55%, #e8650a);
  color: #1c0d00;
}
@media (hover: hover) {
  .consent-btn:hover { border-color: rgba(255, 255, 255, 0.3); }
  .consent-btn.is-accept:hover { transform: translateY(-1px); }
}
.consent-btn:active { transform: scale(0.98); }
.consent-btn:focus-visible,
.consent-more:focus-visible {
  outline: 2px solid #ff7a1a;
  outline-offset: 3px;
  border-radius: 6px;
}
.consent-more {
  justify-self: start;
  color: #9a9aa6;
  font-size: 13px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (hover: hover) {
  .consent-more:hover { color: #f3f3f6; }
}

/* Two stacked fixed bars is one too many: the sticky signup CTA stands down
   while a decision is pending, and comes back the moment one is made. */
.consent-open .mcta-bar { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  .consent-btn { transition: none; }
}
