/* cache-bust: 20260321-1307 */
/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* --- Member app bottom-bar clearance -------------------------------------
   The member app always has a bottom bar on phones: the web bottom nav in the
   browser/PWA, or the NATIVE tab bar in the Hotwire Native app — which floats
   OVER the webview, so web content must reserve space for it or it hides behind
   it (unscrollable). Two tokens because in-flow content and full-screen overlays
   differ:

   --member-bottom-bar : keep in-flow content clear of the bottom bar (page
     wrapper, climbs panes, wall card). 0 on desktop web (no bottom nav).
   --member-overlay-bottom : bottom inset for full-screen overlays (bottom
     sheets, reels), which COVER the web nav so only the safe area matters —
     except in the native app, where the native tab bar floats over them too.

   NATIVE VALUE: measured in the iOS Simulator, `env(safe-area-inset-bottom)`
   reports 0 in the Hotwire Native webview (the webview is full-bleed to the
   screen bottom, tab bar overlaid, no safe-area propagation). So env can't
   carry the tab bar — the native tokens use a solid constant. The native tab
   bar + home indicator measured ~82pt; 108px reserves it with generous margin
   (over-reserving is fine — you can scroll past extra space; you can't scroll
   to something hidden). `+ env` is kept as a harmless belt-and-suspenders in
   case a future build starts propagating the inset. */
:root {
  --member-bottom-bar: calc(64px + env(safe-area-inset-bottom, 0px));
  --member-overlay-bottom: env(safe-area-inset-bottom, 0px);
}
@media (min-width: 768px) {
  /* Desktop web has no bottom nav; the native app (a phone) keeps the reserve. */
  body:not(.turbo-native) {
    --member-bottom-bar: 0px;
  }
}
body.turbo-native {
  --member-bottom-bar: calc(108px + env(safe-area-inset-bottom, 0px));
  --member-overlay-bottom: calc(108px + env(safe-area-inset-bottom, 0px));
}

/* Staff/admin native selects use a consistent inset caret. */
.staff-ui select:not([multiple]) {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
  background-position: right 0.85rem center;
  background-repeat: no-repeat;
  background-size: 1rem 1rem;
  padding-right: 2.75rem !important;
}

/* Number inputs in the dark app UI should not show browser-native steppers. */
.staff-ui input[type="number"],
.member-ui input[type="number"] {
  -moz-appearance: textfield;
}

.staff-ui input[type="number"]::-webkit-outer-spin-button,
.staff-ui input[type="number"]::-webkit-inner-spin-button,
.member-ui input[type="number"]::-webkit-outer-spin-button,
.member-ui input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Waiver / Markdown prose styling */
.waiver-prose h1 { font-size: 1.75rem; font-weight: 700; margin-top: 1.5rem; margin-bottom: 0.75rem; line-height: 1.2; }
.waiver-prose h2 { font-size: 1.35rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.5rem; line-height: 1.3; }
.waiver-prose h3 { font-size: 1.15rem; font-weight: 600; margin-top: 1.25rem; margin-bottom: 0.5rem; line-height: 1.3; }
.waiver-prose h4, .waiver-prose h5, .waiver-prose h6 { font-size: 1rem; font-weight: 600; margin-top: 1rem; margin-bottom: 0.4rem; }
.waiver-prose p { margin-bottom: 0.75rem; }
.waiver-prose ul, .waiver-prose ol { margin-bottom: 0.75rem; padding-left: 1.5rem; }
.waiver-prose ul { list-style-type: disc; }
.waiver-prose ol { list-style-type: decimal; }
.waiver-prose li { margin-bottom: 0.25rem; }
.waiver-prose blockquote { border-left: 3px solid #475569; padding-left: 1rem; margin: 1rem 0; color: #94a3b8; }
.waiver-prose hr { border: none; border-top: 1px solid #334155; margin: 1.5rem 0; }
.waiver-prose a { color: #38bdf8; text-decoration: underline; }
.waiver-prose strong { font-weight: 700; }

/* Sent member-email body, rendered on a white card in the profile detail modal.
   Tailwind preflight strips list bullets and paragraph margins, and the
   typography plugin isn't installed, so restore the formatting the composer's
   TipTap HTML relies on. Tuned for dark text on the white card. */
.email-body-prose p { margin: 0.5rem 0; }
.email-body-prose p:first-child { margin-top: 0; }
.email-body-prose p:last-child { margin-bottom: 0; }
.email-body-prose h1 { font-size: 1.5rem; font-weight: 700; margin: 1.25rem 0 0.5rem; line-height: 1.2; }
.email-body-prose h2 { font-size: 1.25rem; font-weight: 700; margin: 1.25rem 0 0.5rem; line-height: 1.3; }
.email-body-prose h3 { font-size: 1.1rem; font-weight: 600; margin: 1rem 0 0.4rem; line-height: 1.3; }
.email-body-prose h4, .email-body-prose h5, .email-body-prose h6 { font-size: 1rem; font-weight: 600; margin: 0.85rem 0 0.35rem; }
.email-body-prose ul, .email-body-prose ol { margin: 0.5rem 0; padding-left: 1.5rem; }
.email-body-prose ul { list-style-type: disc; }
.email-body-prose ol { list-style-type: decimal; }
.email-body-prose li { margin-bottom: 0.25rem; }
.email-body-prose li > p { margin: 0; }
.email-body-prose a { color: #047857; text-decoration: underline; }
.email-body-prose strong, .email-body-prose b { font-weight: 700; }
.email-body-prose em, .email-body-prose i { font-style: italic; }
.email-body-prose blockquote { border-left: 3px solid #cbd5e1; padding-left: 1rem; margin: 0.75rem 0; color: #475569; }
.email-body-prose hr { border: none; border-top: 1px solid #e2e8f0; margin: 1.25rem 0; }
.email-body-prose img { max-width: 100%; height: auto; border-radius: 0.5rem; }
.email-body-prose pre { background: #f1f5f9; padding: 0.75rem; border-radius: 0.5rem; overflow-x: auto; }
.email-body-prose code { background: #f1f5f9; padding: 0.1rem 0.35rem; border-radius: 0.25rem; font-size: 0.9em; }

/* Staff Help Guide prose styling */
.prose-staff h2 { font-size: 1.5rem; font-weight: 700; margin-top: 2.5rem; margin-bottom: 0.75rem; line-height: 1.2; color: #e2e8f0; border-bottom: 1px solid #1e293b; padding-bottom: 0.5rem; }
.prose-staff h3 { font-size: 1.2rem; font-weight: 600; margin-top: 2rem; margin-bottom: 0.5rem; line-height: 1.3; color: #cbd5e1; }
.prose-staff h4 { font-size: 1.05rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.4rem; color: #94a3b8; }
.prose-staff p { margin-bottom: 0.75rem; color: #94a3b8; line-height: 1.7; }
.prose-staff ul, .prose-staff ol { margin-bottom: 0.75rem; padding-left: 1.5rem; color: #94a3b8; }
.prose-staff ul { list-style-type: disc; }
.prose-staff ol { list-style-type: decimal; }
.prose-staff li { margin-bottom: 0.35rem; line-height: 1.6; }
.prose-staff strong { font-weight: 700; color: #e2e8f0; }
.prose-staff code { background: #1e293b; padding: 0.15rem 0.4rem; border-radius: 0.25rem; font-size: 0.875rem; color: #34d399; }
.prose-staff img { max-width: 100%; border-radius: 0.75rem; }
.prose-staff a { color: #7dd3fc; text-decoration: underline; text-underline-offset: 0.18em; }
.prose-staff table { width: 100%; margin: 1.25rem 0 1.75rem; border-collapse: collapse; }
.prose-staff th { text-align: left; padding: 0.5rem; border-bottom: 1px solid #334155; color: #64748b; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; }
.prose-staff td { padding: 0.5rem; border-bottom: 1px solid rgba(30, 41, 59, 0.5); }
.prose-staff h2:first-child { margin-top: 0; }
.prose-staff .help-quick-start { margin-bottom: 2.5rem; padding: 1.25rem 1.5rem; border: 1px solid rgba(16, 185, 129, 0.4); border-radius: 0.9rem; background: rgba(6, 78, 59, 0.22); }
.prose-staff .help-quick-start h2 { margin-top: 0; border-bottom: 0; padding-bottom: 0; font-size: 1.2rem; }
.prose-staff .help-quick-start ol { margin-bottom: 0; }
.prose-staff .help-screenshot { margin: 1.5rem 0; overflow: hidden; border: 1px solid #26334a; border-radius: 0.9rem; background: #07101e; }
.prose-staff .help-screenshot img { display: block; width: 100%; border-radius: 0; }
.prose-staff .help-screenshot-narrow img { width: auto; max-width: 100%; margin: 0 auto; }
.prose-staff .help-screenshot figcaption { padding: 0.9rem 1rem 1rem; border-top: 1px solid #1f2a3d; color: #9aa8bf; font-size: 0.875rem; line-height: 1.55; }
.prose-staff .help-screenshot .legend { display: grid; gap: 0.4rem; margin: 0; }
.prose-staff .help-screenshot .legend span { display: block; }
.prose-staff .n1 { color: #69b4ff; }
.prose-staff .n2 { color: #59d9a4; }
.prose-staff .n3 { color: #fbbf4a; }
.prose-staff .n4 { color: #b69cff; }
.prose-staff .note,
.prose-staff .warning,
.prose-staff .decision,
.prose-staff .help-note,
.prose-staff .help-warning { margin: 1.25rem 0; padding: 1rem 1.1rem; border-radius: 0.75rem; line-height: 1.6; }
.prose-staff .note,
.prose-staff .help-note { border: 1px solid rgba(56, 189, 248, 0.28); background: rgba(12, 74, 110, 0.2); color: #b8dff4; }
.prose-staff .warning,
.prose-staff .help-warning { border: 1px solid rgba(245, 158, 11, 0.35); background: rgba(120, 53, 15, 0.2); color: #f8d99a; }
.prose-staff .decision { border: 1px solid rgba(16, 185, 129, 0.35); background: rgba(6, 78, 59, 0.2); color: #b8ecd6; }

/* Dark event-description prose rendered from staff-authored TipTap HTML. */
.event-description-rich {
  color: #cbd5e1;
  font-size: 0.95rem;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.event-description-rich > *:first-child { margin-top: 0; }
.event-description-rich > *:last-child { margin-bottom: 0; }
.event-description-rich p { margin: 0.7rem 0; }
.event-description-rich h1,
.event-description-rich h2,
.event-description-rich h3,
.event-description-rich h4 {
  color: #f8fafc;
  font-weight: 700;
  line-height: 1.25;
  margin: 1rem 0 0.45rem;
}
.event-description-rich h1 { font-size: 1.35rem; }
.event-description-rich h2 { font-size: 1.2rem; }
.event-description-rich h3 { font-size: 1.05rem; }
.event-description-rich h4 { font-size: 1rem; }
.event-description-rich ul,
.event-description-rich ol {
  margin: 0.8rem 0;
  padding-left: 1.35rem;
}
.event-description-rich ul { list-style-type: disc; }
.event-description-rich ol { list-style-type: decimal; }
.event-description-rich li { margin: 0.3rem 0; padding-left: 0.15rem; }
.event-description-rich li > p { margin: 0.2rem 0; }
.event-description-rich a {
  color: #5eead4;
  font-weight: 650;
  text-decoration: underline;
  text-decoration-color: rgba(94, 234, 212, 0.75);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}
.event-description-rich a:hover {
  color: #99f6e4;
  text-decoration-color: #99f6e4;
}
.event-description-rich strong,
.event-description-rich b { color: #f1f5f9; font-weight: 700; }
.event-description-rich blockquote {
  border-left: 3px solid #334155;
  color: #94a3b8;
  margin: 1rem 0;
  padding-left: 0.9rem;
}
.event-description-rich hr {
  border: 0;
  border-top: 1px solid #334155;
  margin: 1.25rem 0;
}

/* Trix editor overrides for staff help guides */
trix-toolbar {
  background: #1e293b;
  border: 1px solid #334155;
  border-radius: 0.75rem;
  padding: 0.5rem;
}

trix-toolbar .trix-button-group {
  border: 1px solid #475569;
  border-radius: 0.5rem;
  margin-right: 0.5rem;
}

trix-toolbar .trix-button-group + .trix-button-group {
  margin-left: 0;
}

trix-toolbar .trix-button {
  background: transparent;
  border: none;
  border-bottom: none;
  filter: invert(85%) sepia(20%) saturate(500%) hue-rotate(100deg) brightness(1.1);
  padding: 0.4rem 0.6rem;
}

trix-toolbar .trix-button::before {
  opacity: 1 !important;
}

trix-toolbar .trix-button:not(:disabled):hover {
  background: rgba(16, 185, 129, 0.2);
  filter: invert(85%) sepia(30%) saturate(800%) hue-rotate(100deg) brightness(1.2);
}

trix-toolbar .trix-button.trix-active {
  background: rgba(16, 185, 129, 0.3);
  filter: invert(85%) sepia(40%) saturate(1000%) hue-rotate(100deg) brightness(1.3);
}

trix-toolbar .trix-button--icon::before {
  opacity: 1 !important;
}

trix-toolbar .trix-dialog {
  background: #1e293b;
  border: 1px solid #475569;
  color: #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.75rem;
}

trix-toolbar .trix-dialog input[type="text"],
trix-toolbar .trix-dialog input[type="url"] {
  background: #0f172a;
  border: 1px solid #475569;
  color: #e2e8f0;
  border-radius: 0.375rem;
  padding: 0.375rem 0.5rem;
}

trix-toolbar .trix-dialog .trix-button-group {
  border: none;
}

trix-toolbar .trix-dialog .trix-button-group .trix-button {
  filter: none;
  color: #a7f3d0;
  font-size: 0.875rem;
}

/* Public marketing/news surface. Scoped so the marketing styles do not leak
   into the member or staff apps. */
.marketing-news {
  --marketing-black: #000;
  --marketing-white: #fff;
  --marketing-gray: #535353;
  --marketing-border: rgba(0, 0, 0, 0.15);
  --marketing-muted-border: #dbdbdb;
  --marketing-accent: #00ff37;
  background: var(--marketing-white);
  color: var(--marketing-black);
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.3;
  overflow-x: hidden;
}

.marketing-news a {
  color: inherit;
  text-decoration: none;
}

.marketing-news button,
.marketing-news summary {
  cursor: pointer;
}

/* Turbo Native public browsing keeps the safe member layout (no cross-host
   marketing header/footer) while sharing the public marketing design tokens. */
.native-public-ui {
  --marketing-black: #000;
  --marketing-white: #fff;
  --marketing-gray: #535353;
  --marketing-border: rgba(0, 0, 0, 0.15);
  --marketing-muted-border: #dbdbdb;
  --marketing-accent: #00ff37;
  background: var(--marketing-white);
  color: var(--marketing-black);
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.3;
  min-height: 100svh;
  overflow-x: hidden;
}

.native-public-ui a {
  color: inherit;
  text-decoration: none;
}

.native-public-ui button,
.native-public-ui summary {
  cursor: pointer;
}

.native-public-main {
  min-height: 100svh;
}

.native-public-main > .fixed,
.native-public-main > [data-controller="flash"] {
  z-index: 80;
}

.native-public-explore {
  max-width: 72rem;
  padding-bottom: max(4rem, calc(2rem + env(safe-area-inset-bottom)));
  padding-top: max(2rem, calc(1rem + env(safe-area-inset-top)));
}

.native-public-explore-hero {
  border-bottom: 1px solid var(--marketing-border);
  padding: 0 0 3.5rem;
}

.native-public-explore-mark {
  color: var(--marketing-black);
  display: block;
  height: 3rem;
  margin-bottom: 3rem;
  width: 4rem;
}

.native-public-explore-mark svg {
  display: block;
  height: 100%;
  width: 100%;
}

.native-public-explore-hero .marketing-public-title {
  font-size: clamp(3.5rem, 12vw, 6rem);
  max-width: 48rem;
}

.native-public-explore-hero .marketing-public-lede {
  margin-left: 0;
  max-width: 42rem;
}

.native-public-explore-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2rem;
}

.native-public-explore-section {
  border-bottom: 1px solid var(--marketing-border);
  padding: 3.5rem 0;
}

.native-public-explore-section:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.native-public-explore-section-heading {
  margin-bottom: 2rem;
  max-width: 46rem;
}

.native-public-explore-section-heading .marketing-public-section-copy {
  margin-top: 1rem;
}

.native-public-pass-picker .rounded-xl,
.native-public-pass-picker .rounded-lg {
  border-radius: 0 !important;
}

.native-public-pass-picker .bg-slate-950\/60 {
  background-color: #f2f2f2 !important;
}

.native-public-pass-picker a[class*="bg-amber"] {
  background: var(--marketing-black) !important;
  border: 1px solid var(--marketing-black) !important;
  color: var(--marketing-white) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  text-transform: uppercase;
}

.native-public-pass-picker a[class*="bg-amber"]:hover {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

.native-public-explore-links {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.native-public-explore-link {
  border: 1px solid var(--marketing-border);
  display: flex;
  flex-direction: column;
  min-height: 15rem;
  padding: 1.5rem;
  position: relative;
  transition: background 0.18s ease, color 0.18s ease;
}

.native-public-explore-link strong {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
}

.native-public-explore-link > span:not(.marketing-public-eyebrow):not(.native-public-explore-link-arrow) {
  color: var(--marketing-gray);
  line-height: 1.45;
  max-width: 23rem;
}

.native-public-explore-link-arrow {
  bottom: 1.5rem;
  font-size: 2rem;
  line-height: 1;
  position: absolute;
  right: 1.5rem;
}

.native-public-explore-link:hover {
  background: var(--marketing-black);
  color: var(--marketing-white);
}

.native-public-explore-link:hover .marketing-public-eyebrow,
.native-public-explore-link:hover > span {
  color: var(--marketing-white) !important;
}

@media (max-width: 767px) {
  .native-public-explore {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .native-public-explore-mark {
    margin-bottom: 2.5rem;
  }

  .native-public-explore-hero {
    padding-bottom: 3rem;
  }

  .native-public-explore-hero .marketing-public-title {
    font-size: clamp(3rem, 17vw, 4.5rem);
  }

  .native-public-explore-actions,
  .native-public-explore-actions .marketing-public-button {
    width: 100%;
  }

  .native-public-explore-links {
    grid-template-columns: 1fr;
  }
}

.marketing-news-header {
  background: var(--marketing-white);
  border-bottom: 1px solid var(--marketing-border);
  color: var(--marketing-black);
  position: relative;
  z-index: 40;
}

.marketing-news-nav {
  align-items: center;
  display: flex;
  justify-content: space-between;
  min-height: 4.5rem;
  padding: 1rem 1.5rem;
  position: relative;
  width: 100%;
}

.marketing-news-brand,
.marketing-news-footer-mark {
  align-items: center;
  display: inline-flex;
  flex: none;
}

.marketing-news-nav-left {
  align-items: center;
  display: flex;
  gap: 1.5rem;
}

.marketing-news-mark,
.marketing-news-footer-mark {
  color: var(--marketing-black);
  display: inline-flex;
  height: 2.5rem;
  width: 3.3125rem;
}

.marketing-news-mark svg,
.marketing-news-footer-mark svg,
.marketing-news-heading-icon svg,
.marketing-news-arrow svg,
.marketing-news-card-placeholder svg {
  display: block;
  height: 100%;
  width: 100%;
}

.marketing-news-navlinks {
  align-items: center;
  display: flex;
  gap: 1.5rem;
  font-size: 0.875rem;
}

.marketing-news-wordmark {
  white-space: nowrap;
}

.marketing-news-navlink {
  position: relative;
  white-space: nowrap;
}

.marketing-news-navlink::after {
  background: currentColor;
  bottom: -0.15rem;
  content: "";
  height: 1px;
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
  transition: width 0.18s ease;
  width: 0;
}

.marketing-news-navlink:hover::after {
  width: 100%;
}

.marketing-news-mobile-menu {
  display: none;
}

.marketing-news-container {
  margin: 0 auto;
  max-width: 86rem;
  padding: 0 1.5rem;
  width: 100%;
}

.marketing-news-page,
.marketing-news-article-page {
  padding: 5rem 0 6rem;
}

.marketing-news-heading {
  align-items: center;
  display: flex;
  gap: 1rem;
  margin-bottom: 4rem;
}

.marketing-news-heading h1,
.marketing-news-article-header h1,
.marketing-newsletter h2 {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  line-height: 0.89;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

.marketing-news-heading h1 {
  font-size: 4rem;
  letter-spacing: 0.03em;
}

.marketing-news-heading-icon {
  color: var(--marketing-black);
  display: inline-flex;
  height: 1.35rem;
  width: 1.8rem;
}

.marketing-news-grid {
  column-gap: 3vw;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  row-gap: 3rem;
}

.marketing-news-card {
  background: var(--marketing-white);
  color: var(--marketing-black);
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.marketing-news-card:focus-visible,
.marketing-news-navlink:focus-visible,
.marketing-news-back:focus-visible,
.marketing-news-footer a:focus-visible,
.marketing-newsletter-button:focus-visible,
.marketing-newsletter-input:focus-visible {
  outline: 2px solid var(--marketing-black);
  outline-offset: 3px;
}

.marketing-news-card-media {
  aspect-ratio: 3 / 2;
  background: #f2f2f2;
  overflow: hidden;
  width: 100%;
}

.marketing-news-card-media img {
  height: 100%;
  object-fit: cover;
  transition: transform 0.2s ease;
  width: 100%;
}

.marketing-news-card:hover .marketing-news-card-media img {
  transform: scale(1.03);
}

.marketing-news-card-placeholder {
  align-items: center;
  background: var(--marketing-black);
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%;
}

.marketing-news-card-placeholder span {
  color: var(--marketing-white);
  display: inline-flex;
  height: 4rem;
  width: 5.3rem;
}

.marketing-news-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1rem;
  padding-top: 1rem;
}

.marketing-news-card-type {
  align-self: flex-start;
  background: #e4e4e4;
  color: var(--marketing-black);
  display: inline-flex;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  justify-self: start;
  letter-spacing: 0.02em;
  line-height: 1.3;
  max-width: 100%;
  padding: 0.2em 0.4em;
  text-transform: uppercase;
  width: max-content;
}

.marketing-news-card h2 {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.5;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

.marketing-news-card time,
.marketing-news-article-header time {
  color: var(--marketing-gray);
  display: block;
  font-family: video, IBM Plex Mono, ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.8rem;
  font-weight: 300;
}

.marketing-news-card p {
  color: var(--marketing-gray);
  font-size: 0.95rem;
  line-height: 1.45;
}

@supports (grid-template-rows: subgrid) {
  .marketing-news-grid {
    row-gap: 1rem;
  }

  .marketing-news-card {
    display: grid;
    grid-row: span 5;
    grid-template-rows: subgrid;
    min-height: 0;
  }

  .marketing-news-card:nth-child(n+4) {
    margin-top: 2rem;
  }

  .marketing-news-card-body {
    display: contents;
  }

  .marketing-news-card-media {
    grid-row: 1;
  }

  .marketing-news-card-type {
    grid-row: 2;
  }

  .marketing-news-card h2 {
    grid-row: 3;
  }

  .marketing-news-card time {
    grid-row: 4;
  }

  .marketing-news-card p {
    grid-row: 5;
    margin: 0;
  }
}

.marketing-news-empty {
  border: 1px solid var(--marketing-muted-border);
  color: var(--marketing-gray);
  padding: 4rem 1.5rem;
  text-align: center;
}

.marketing-news-back {
  align-items: center;
  display: inline-flex;
  gap: 0.6rem;
  margin-bottom: 4rem;
}

.marketing-news-arrow {
  display: inline-flex;
  height: 0.65rem;
  transition: transform 0.18s ease;
  width: 0.9rem;
}

.marketing-news-arrow.is-back {
  transform: rotate(180deg);
}

.marketing-news-back:hover .marketing-news-arrow.is-back {
  transform: rotate(180deg) translateX(25%);
}

.marketing-news-article-header {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 0 auto;
  max-width: 58rem;
  text-align: center;
}

.marketing-news-article-header .marketing-news-card-type {
  align-self: center;
  justify-self: auto;
}

.marketing-news-article-header h1 {
  font-size: 4rem;
  letter-spacing: 0.05em;
  max-width: 64rem;
  text-wrap: balance;
}

.marketing-news-article-header p {
  color: var(--marketing-gray);
  font-size: 1.35rem;
  line-height: 1.45;
  max-width: 46rem;
}

.marketing-news-staff-note {
  background: #fff8db;
  border: 1px solid #e5c15c;
  color: #4e3a00;
  margin: 0 auto 2rem;
  max-width: 58rem;
  padding: 0.8rem 1rem;
}

.marketing-news-body {
  border-top: 1px solid var(--marketing-border);
  color: var(--marketing-black);
  font-size: 1.05rem;
  line-height: 1.65;
  margin: 4rem auto 0;
  max-width: 46rem;
  padding-top: 3rem;
}

.marketing-news-body > :first-child {
  margin-top: 0;
}

.marketing-news-body > :last-child {
  margin-bottom: 0;
}

.marketing-related-links {
  border-top: 1px solid var(--marketing-border);
  margin: 4rem auto 0;
  max-width: 46rem;
  padding-top: 2rem;
}

.marketing-related-links h2 {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.marketing-related-links ul {
  display: grid;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.marketing-related-links a {
  align-items: center;
  border-bottom: 1px solid var(--marketing-border);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 0.9rem 0;
}

.marketing-related-links-arrow {
  display: inline-flex;
  flex: 0 0 auto;
  height: 0.65rem;
  transition: transform 0.18s ease;
  width: 0.9rem;
}

.marketing-related-links a:hover .marketing-related-links-arrow {
  transform: translateX(25%);
}

.marketing-news-body h1,
.marketing-news-body h2,
.marketing-news-body h3 {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 600;
  line-height: 1.15;
  margin: 2rem 0 0.75rem;
  text-transform: uppercase;
}

.marketing-news-body h1 {
  font-size: 2rem;
}

.marketing-news-body h2 {
  font-size: 1.65rem;
}

.marketing-news-body h3 {
  font-size: 1.35rem;
}

.marketing-news-body p {
  margin: 1rem 0;
}

.marketing-news-body a {
  color: var(--marketing-black);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.marketing-news-body ul,
.marketing-news-body ol {
  margin: 1rem 0;
  padding-left: 1.4rem;
}

.marketing-news-body ul {
  list-style: disc;
}

.marketing-news-body ol {
  list-style: decimal;
}

.marketing-news-body li {
  margin: 0.35rem 0;
}

.marketing-news-body blockquote {
  border-left: 2px solid var(--marketing-black);
  color: var(--marketing-gray);
  margin: 1.5rem 0;
  padding-left: 1rem;
}

.marketing-news-body img {
  height: auto;
  margin: 1.25rem 0;
  max-width: 100%;
}

.marketing-news-body .news-embed {
  aspect-ratio: 16 / 9;
  background: #0f172a;
  margin: 1rem 0;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.marketing-news-body .news-embed iframe {
  border: 0;
  height: 100%;
  inset: 0;
  margin: 0;
  position: absolute;
  width: 100%;
}

.marketing-news-body hr {
  border: 0;
  border-top: 1px solid var(--marketing-muted-border);
  margin: 2rem 0;
}

.marketing-news-body .liquid-block-pill {
  background: transparent;
  border: 0;
  color: inherit;
  font-family: inherit;
  margin: 2rem 0;
  padding: 0;
}

.marketing-news-body .liquid-block-pill > div {
  margin: 0 !important;
}

.marketing-news-body .liquid-block-pill a {
  align-items: center !important;
  background: var(--marketing-black) !important;
  border: 1px solid var(--marketing-black) !important;
  color: var(--marketing-white) !important;
  display: inline-flex !important;
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  gap: 1.25rem !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: 3.25rem !important;
  padding: 0 1.25rem !important;
  text-decoration: none !important;
  transition: background 0.18s ease, color 0.18s ease;
}

.marketing-news-body .liquid-block-pill a::after {
  border-bottom: 0.28rem solid transparent;
  border-left: 0.48rem solid currentColor;
  border-top: 0.28rem solid transparent;
  content: "";
  display: inline-block;
  height: 0;
  transition: transform 0.18s ease;
  width: 0;
}

.marketing-news-body .liquid-block-pill a:hover {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

.marketing-news-body .liquid-block-pill a:hover::after {
  transform: translateX(35%);
}

.marketing-newsletter {
  --marketing-newsletter-row-height: clamp(4rem, 5vw, 4.75rem);
  align-items: stretch;
  background: var(--marketing-black);
  color: var(--marketing-white);
  display: flex;
  flex-direction: column;
  letter-spacing: 0.02em;
  min-height: auto;
  padding: calc(var(--marketing-newsletter-row-height) / 2) 0 0;
  position: relative;
}

.marketing-newsletter-heading {
  align-items: center;
  display: flex;
  flex: none;
  height: var(--marketing-newsletter-row-height);
  margin: 0;
  padding: 0 clamp(1rem, 1.34vw, 1.713rem);
  position: relative;
  width: 100%;
  z-index: 5;
}

.marketing-newsletter-heading h2 {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(2.5rem, 4vw, 3.75rem);
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 0.89;
  margin: 0;
  overflow-wrap: normal;
  text-transform: uppercase;
  white-space: nowrap;
}

.marketing-newsletter-form-wrap {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  margin: 0;
  max-width: none;
  width: 100%;
}

.marketing-newsletter-form {
  align-items: stretch;
  display: flex;
  flex: none;
  gap: 0;
  min-width: 100vw;
  width: 100vw;
}

.marketing-newsletter-input {
  background: var(--marketing-black);
  border: 0;
  color: var(--marketing-white);
  flex: 1;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1rem, 0.892vw, 1.142rem);
  height: var(--marketing-newsletter-row-height);
  line-height: 1.25;
  margin: 0;
  min-width: 0;
  padding: 0 clamp(1rem, 1.34vw, 1.713rem);
  text-transform: uppercase;
}

.marketing-newsletter-input::placeholder {
  color: rgba(255, 255, 255, 0.5);
  text-transform: uppercase;
}

.marketing-newsletter-button {
  align-items: center;
  background: var(--marketing-black);
  border-left: 1px solid rgba(255, 255, 255, 0.15);
  color: var(--marketing-white);
  display: flex;
  flex: 1;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1rem, 0.892vw, 1.142rem);
  gap: 0.6em;
  height: var(--marketing-newsletter-row-height);
  justify-content: flex-start;
  letter-spacing: 0.02em;
  line-height: 1.4;
  padding: 0 clamp(1rem, 1.34vw, 1.713rem);
  text-transform: uppercase;
  white-space: nowrap;
}

.marketing-newsletter-button .marketing-news-arrow {
  height: 0.75em;
  width: 1em;
}

.marketing-newsletter-button:hover .marketing-news-arrow {
  transform: translateX(35%);
}

.marketing-newsletter-button:focus-visible,
.marketing-newsletter-input:focus-visible {
  outline-color: var(--marketing-white);
}

.marketing-newsletter-button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.marketing-newsletter-error,
.marketing-newsletter-success {
  font-size: 0.9rem;
  padding: 1rem 1.5rem;
}

.marketing-newsletter-error {
  color: #fecaca;
}

.marketing-newsletter-success {
  color: var(--marketing-accent);
}

.marketing-newsletter-turnstile {
  align-self: center;
}

.marketing-news-footer {
  background: var(--marketing-white);
  border-top: 1px solid var(--marketing-border);
  color: var(--marketing-black);
}

.marketing-news-footer-top {
  display: grid;
  gap: 3rem;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
  padding: 1.5rem 1.5rem 5rem;
}

.marketing-news-footer-brand {
  align-items: flex-start;
  display: flex;
  gap: 2rem;
}

.marketing-news-footer-contact {
  display: grid;
  gap: 1.25rem;
}

.marketing-news-footer-instagram {
  align-items: center;
  display: inline-flex;
  gap: 0.4rem;
  width: fit-content;
}

.marketing-news-footer-bottom {
  align-items: center;
  border-top: 1px solid var(--marketing-border);
  display: flex;
  font-size: 0.75rem;
  justify-content: space-between;
  padding: 1rem 1.5rem;
}

.marketing-news-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: flex-end;
  text-align: right;
}

.marketing-news-flash {
  margin: 1rem auto 0;
  max-width: 86rem;
  padding: 0 1.5rem;
}

@media (max-width: 991px) {
  .marketing-news-heading h1 {
    font-size: 3rem;
  }

  .marketing-news-article-header h1 {
    font-size: 4rem;
  }

  .marketing-news-article-header p {
    font-size: 1.2rem;
  }

  .marketing-news-navlinks {
    display: none;
  }

  .marketing-news-mobile-menu {
    display: block;
  }

  .marketing-news-mobile-menu summary {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    list-style: none;
    width: 2.5rem;
  }

  .marketing-news-mobile-menu summary::-webkit-details-marker {
    display: none;
  }

  .marketing-news-mobile-menu summary span {
    background: var(--marketing-black);
    display: block;
    height: 2px;
    width: 100%;
  }

  .marketing-news-mobile-panel {
    background: var(--marketing-black);
    color: var(--marketing-white);
    display: none;
    left: 0;
    padding: 2rem 1.5rem;
    position: absolute;
    right: 0;
    top: 100%;
  }

  .marketing-news-mobile-menu[open] .marketing-news-mobile-panel {
    display: block;
  }

  .marketing-news-mobile-title {
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 1.5rem;
  }

  .marketing-news-mobile-link {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    display: block;
    font-size: 2.25rem;
    line-height: 1;
    padding: 1rem 0;
  }

  .marketing-news-mobile-link:last-child {
    border-bottom: 0;
  }

  .marketing-news-mobile-hours {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    line-height: 1.25;
    margin-top: 1.25rem;
    padding-top: 1rem;
    text-transform: uppercase;
  }

  .marketing-news-mobile-hours-title {
    color: var(--marketing-white);
    margin-bottom: 0.75rem;
  }

  .marketing-news-mobile-hours-list {
    display: grid;
    gap: 0.4rem;
  }

  .marketing-news-mobile-hours-row {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
  }

  .marketing-news-mobile-secondary-links {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    display: grid;
    gap: 0.65rem 1.25rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 1.25rem;
    padding-top: 1rem;
  }

  .marketing-news-mobile-secondary-link {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .marketing-news-mobile-footer {
    color: rgba(255, 255, 255, 0.72);
    display: grid;
    font-size: 0.875rem;
    gap: 0.65rem;
    margin-top: 2rem;
    white-space: nowrap;
  }

  .marketing-news-mobile-footer-brand {
    color: var(--marketing-white);
    font-size: 1rem;
    font-weight: 500;
  }

  .marketing-news-mobile-contact-link {
    color: inherit;
  }

  .marketing-news-mobile-address-link {
    text-align: left;
  }

  .marketing-news-mobile-contact-row {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    line-height: 1.2;
    width: 100%;
  }

  .marketing-news-mobile-footer-ig {
    align-items: center;
    color: var(--marketing-white);
    display: inline-flex;
    gap: 0.35rem;
  }

  .marketing-news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  @supports (grid-template-rows: subgrid) {
    /* The desktop rule starts extra row spacing after card 3. At two columns,
       the second visual row starts at card 3 instead; move the same spacing
       boundary so paired cards keep media, title, date, and summary aligned. */
    .marketing-news-card:nth-child(n+3) {
      margin-top: 2rem;
    }
  }

  .marketing-news-footer-top {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 641px) and (max-width: 991px) {
  .marketing-news-footer-top {
    gap: 2.5rem 3rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .marketing-news-footer-brand {
    grid-row: 1 / span 2;
  }

  .marketing-news-footer-top > :nth-child(2),
  .marketing-news-footer-top > :nth-child(3) {
    grid-column: 2;
  }
}

@media (max-width: 640px) {
  .marketing-news-nav {
    min-height: 4rem;
    padding: 0.85rem 1rem;
  }

  .marketing-news-page,
  .marketing-news-article-page {
    padding: 3rem 0 4rem;
  }

  .marketing-news-container {
    padding: 0 1rem;
  }

  .marketing-news-heading {
    margin-bottom: 2.5rem;
  }

  .marketing-news-heading h1 {
    font-size: 3rem;
  }

  .marketing-news-grid {
    gap: 2.25rem;
    grid-template-columns: 1fr;
  }

  @supports (grid-template-rows: subgrid) {
    /* Every card after the first begins a new visual row at one column. */
    .marketing-news-card:nth-child(n+2) {
      margin-top: 2rem;
    }
  }

  .marketing-news-article-header {
    align-items: flex-start;
    text-align: left;
  }

  .marketing-news-article-header h1 {
    font-size: 3rem;
  }

  .marketing-news-article-header p {
    font-size: 1.05rem;
  }

  .marketing-news-body {
    font-size: 1rem;
    margin-top: 3rem;
    padding-top: 2rem;
  }

  .marketing-newsletter-heading {
    padding: 0 1rem;
  }

  .marketing-newsletter-form {
    flex-direction: column;
  }

  .marketing-newsletter-input,
  .marketing-newsletter-button {
    flex: 0 0 var(--marketing-newsletter-row-height);
    width: 100%;
  }

  .marketing-newsletter-button {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
  }

  .marketing-news-footer-top,
  .marketing-news-footer-bottom {
    grid-template-columns: 1fr;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .marketing-news-footer-brand {
    flex-direction: column;
    gap: 1.5rem;
  }

  .marketing-news-footer-bottom {
    align-items: center;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }

  .marketing-news-footer-links {
    justify-content: center;
    text-align: center;
  }
}

.marketing-public-page .marketing-news-flash {
  margin-top: 0;
  padding-top: 1rem;
}

.marketing-public {
  color: var(--marketing-black);
  margin: 0 auto;
  max-width: 86rem;
  padding: 5rem 1.5rem 6rem;
  width: 100%;
}

.marketing-public-auth {
  max-width: 46rem;
}

.marketing-public-hero {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4rem;
}

.marketing-public-auth .marketing-public-hero,
.marketing-public-coaching .marketing-public-hero {
  border-bottom: 0;
  display: block;
  margin: 0 auto 2rem;
  max-width: 46rem;
  padding-bottom: 0;
  text-align: center;
}

.marketing-public-coaching {
  max-width: 52rem;
}

.marketing-public-groups-hero {
  align-items: center;
  flex-direction: column;
  gap: 2rem;
  text-align: center;
}

.marketing-public-groups-heading {
  max-width: 58rem;
}

.marketing-public-groups-intro {
  max-width: 52rem;
}

.marketing-public-groups-intro .marketing-public-lede {
  margin: 0;
}

.marketing-public-groups-actions {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 2rem;
}

.marketing-public-groups-contact {
  color: var(--marketing-gray);
  font-size: 0.875rem;
  line-height: 1.4;
  margin: 1rem 0 0;
}

.marketing-public-groups-contact button {
  color: var(--marketing-black);
  font-weight: 500;
}

.marketing-public-events > .marketing-public-hero {
  margin-bottom: 2rem;
}

.marketing-public-events-auth {
  align-items: center;
  border-bottom: 1px solid var(--marketing-border);
  border-top: 1px solid var(--marketing-border);
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  margin-bottom: 4rem;
  padding: 1.5rem 0;
}

.marketing-public-events-auth-title {
  color: var(--marketing-black);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin: 0;
  text-transform: uppercase;
}

.marketing-public-events-auth-copy {
  color: var(--marketing-gray);
  font-size: 1rem;
  line-height: 1.45;
  margin: 0.35rem 0 0;
}

.marketing-public-events-auth-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 0.75rem;
}

.marketing-public-eyebrow,
.marketing-public-section-title {
  color: var(--marketing-gray);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.25;
  margin: 0 0 0.75rem;
  text-transform: uppercase;
}

.marketing-public-title,
.marketing-public-subtitle {
  color: var(--marketing-black);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 0.9;
  margin: 0;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

.marketing-public-title {
  font-size: 4rem;
}

.marketing-public-subtitle {
  font-size: 2.25rem;
}

.marketing-public-lede {
  color: var(--marketing-gray);
  font-size: 1.25rem;
  line-height: 1.45;
  margin: 1rem auto 0;
  max-width: 46rem;
}

.marketing-public-section {
  border-top: 1px solid var(--marketing-border);
  padding-top: 2.5rem;
}

.marketing-public-section + .marketing-public-section,
.marketing-public-feed-section {
  margin-top: 4rem;
}

.marketing-public-section-header {
  align-items: flex-end;
  display: flex;
  gap: 1.5rem;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}

.marketing-public-section-copy {
  color: var(--marketing-gray);
  font-size: 1rem;
  line-height: 1.45;
  margin: 0;
}

.marketing-public-button {
  align-items: center;
  background: var(--marketing-black) !important;
  border: 1px solid var(--marketing-black) !important;
  border-radius: 0;
  color: var(--marketing-white) !important;
  display: inline-flex;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 500;
  justify-content: center;
  min-height: 3.25rem;
  text-transform: uppercase;
  transition: background 0.18s ease, color 0.18s ease;
}

.marketing-public-button:hover {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

.marketing-public .marketing-public-button-white {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

.marketing-public .marketing-public-button-white:hover {
  background: var(--marketing-black) !important;
  color: var(--marketing-white) !important;
}

.marketing-public .list-calendar-toggle,
.marketing-public .list-calendar-toggle-option {
  border-radius: 0 !important;
}

.marketing-public .marketing-public-chip {
  background: #e4e4e4 !important;
  border: 1px solid #e4e4e4;
  border-radius: 0;
  color: var(--marketing-black) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  text-transform: uppercase;
}

.marketing-public .marketing-public-chip.is-active {
  background: var(--marketing-black) !important;
  border-color: var(--marketing-black);
  color: var(--marketing-white) !important;
}

.marketing-public .public-event-card,
.marketing-public .public-feature-card,
.marketing-public .series-event-card,
.marketing-public .marketing-public-detail-card,
.marketing-public .marketing-public-form-card,
.marketing-public .marketing-public-step,
.marketing-public .marketing-public-confirmation,
.marketing-public .marketing-public-empty {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-border) !important;
  border-radius: 0.25rem !important;
  color: var(--marketing-black) !important;
  box-shadow: none !important;
}

.marketing-public .public-event-card:hover,
.marketing-public .public-feature-card:hover,
.marketing-public .series-event-card:hover {
  border-color: var(--marketing-black) !important;
}

body.marketing-public-page #signin_modal,
body.marketing-public-page #event_modal_dialog {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-black) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--marketing-black) !important;
}

body.marketing-public-page #signin_modal::backdrop,
body.marketing-public-page #event_modal_dialog::backdrop {
  background: rgba(0, 0, 0, 0.72) !important;
}

body.marketing-public-page #signin_modal > div,
body.marketing-public-page #event_modal_dialog #event_modal > div {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

body.marketing-public-page #signin_modal h2,
body.marketing-public-page #signin_modal h3,
body.marketing-public-page #event_modal_dialog h2,
body.marketing-public-page #event_modal_dialog h3 {
  color: var(--marketing-black) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

body.marketing-public-page #signin_modal p,
body.marketing-public-page #signin_modal label,
body.marketing-public-page #event_modal_dialog p,
body.marketing-public-page #event_modal_dialog label,
body.marketing-public-page #event_modal_dialog div {
  color: var(--marketing-gray) !important;
}

body.marketing-public-page #signin_modal input,
body.marketing-public-page #event_modal_dialog input,
body.marketing-public-page #event_modal_dialog textarea,
body.marketing-public-page #event_modal_dialog select {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-border) !important;
  border-radius: 0 !important;
  color: var(--marketing-black) !important;
}

body.marketing-public-page #signin_modal input:focus,
body.marketing-public-page #event_modal_dialog input:focus,
body.marketing-public-page #event_modal_dialog textarea:focus,
body.marketing-public-page #event_modal_dialog select:focus {
  border-color: var(--marketing-black) !important;
  box-shadow: none !important;
  outline: 1px solid var(--marketing-black) !important;
  outline-offset: 0;
}

body.marketing-public-page #signin_modal input::placeholder,
body.marketing-public-page #event_modal_dialog input::placeholder {
  color: rgba(0, 0, 0, 0.45) !important;
}

body.marketing-public-page #signin_modal .bg-slate-950,
body.marketing-public-page #signin_modal .bg-slate-900,
body.marketing-public-page #signin_modal .bg-slate-800,
body.marketing-public-page #event_modal_dialog .bg-slate-950,
body.marketing-public-page #event_modal_dialog .bg-slate-950\/40,
body.marketing-public-page #event_modal_dialog .bg-slate-950\/60,
body.marketing-public-page #event_modal_dialog .bg-slate-900,
body.marketing-public-page #event_modal_dialog .bg-slate-800,
body.marketing-public-page #event_modal_dialog .bg-slate-800\/60,
body.marketing-public-page #event_modal_dialog .bg-slate-800\/70 {
  background-color: var(--marketing-white) !important;
}

body.marketing-public-page #signin_modal .border-slate-700,
body.marketing-public-page #signin_modal .border-slate-800,
body.marketing-public-page #event_modal_dialog .border-slate-700,
body.marketing-public-page #event_modal_dialog .border-slate-800,
body.marketing-public-page #event_modal_dialog .border-slate-800\/70 {
  border-color: var(--marketing-border) !important;
}

body.marketing-public-page #signin_modal .rounded-lg,
body.marketing-public-page #signin_modal .rounded-xl,
body.marketing-public-page #signin_modal .rounded-full,
body.marketing-public-page #event_modal_dialog .rounded,
body.marketing-public-page #event_modal_dialog .rounded-md,
body.marketing-public-page #event_modal_dialog .rounded-lg,
body.marketing-public-page #event_modal_dialog .rounded-xl,
body.marketing-public-page #event_modal_dialog .rounded-full,
body.marketing-public-page .marketing-public [id^="rsvp_button_"] button.rounded-lg {
  border-radius: 0 !important;
}

body.marketing-public-page #signin_modal button[type="submit"],
body.marketing-public-page #signin_modal a[class*="bg-emerald"],
body.marketing-public-page #event_modal_dialog button:not([data-action*="close"]),
body.marketing-public-page #event_modal_dialog a[class*="bg-"]:not([data-action*="close"]),
body.marketing-public-page .marketing-public [id^="rsvp_button_"] button {
  background: var(--marketing-black) !important;
  border: 1px solid var(--marketing-black) !important;
  border-radius: 0 !important;
  color: var(--marketing-white) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  min-height: 2.75rem;
  text-transform: uppercase;
}

body.marketing-public-page #signin_modal button[type="submit"]:hover,
body.marketing-public-page #signin_modal a[class*="bg-emerald"]:hover,
body.marketing-public-page #event_modal_dialog button:not([data-action*="close"]):hover,
body.marketing-public-page #event_modal_dialog a[class*="bg-"]:not([data-action*="close"]):hover,
body.marketing-public-page .marketing-public [id^="rsvp_button_"] button:hover {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

body.marketing-public-page #signin_modal button[data-action*="close"],
body.marketing-public-page #event_modal_dialog button[data-action*="close"],
body.marketing-public-page #event_modal_dialog a[data-action*="close"] {
  background: transparent !important;
  border: 0 !important;
  color: var(--marketing-black) !important;
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  min-height: 0;
  text-transform: none;
}

body.marketing-public-page #signin_modal a,
body.marketing-public-page #event_modal_dialog a {
  color: var(--marketing-black) !important;
}

body.marketing-public-page #signin_modal .signin-modal-sent-email {
  color: var(--marketing-black) !important;
  overflow-wrap: anywhere;
}

body.marketing-public-page #event_modal_dialog span.rounded-full {
  align-items: center;
  background: #e4e4e4 !important;
  border: 1px solid #e4e4e4 !important;
  color: var(--marketing-black) !important;
  display: inline-flex;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.875rem !important;
  font-weight: 500;
  line-height: 1;
  min-height: 2rem;
  padding: 0.375rem 0.75rem !important;
  text-transform: uppercase;
}

.marketing-public .bg-slate-950,
.marketing-public .bg-slate-900,
.marketing-public .bg-slate-900\/40,
.marketing-public .bg-slate-900\/60,
.marketing-public .bg-slate-800,
.marketing-public .bg-slate-800\/50,
.marketing-public .bg-slate-800\/70 {
  background-color: var(--marketing-white) !important;
}

.marketing-public .bg-slate-700,
.marketing-public .bg-slate-700\/60 {
  background-color: #e4e4e4 !important;
}

.marketing-public .border-slate-800,
.marketing-public .border-slate-700 {
  border-color: var(--marketing-border) !important;
}

.marketing-public .text-slate-100,
.marketing-public .text-slate-200,
.marketing-public .text-slate-300,
.marketing-public .text-white {
  color: var(--marketing-black) !important;
}

.marketing-public .text-slate-400,
.marketing-public .text-slate-500,
.marketing-public .text-slate-600 {
  color: var(--marketing-gray) !important;
}

/* Selected segmented-picker tab sits on a black bg — force its label + sublabel
   white (the .marketing-public grey overrides above would otherwise win). */
.marketing-public [data-pass-picker-target="tab"][aria-pressed="true"],
.marketing-public [data-pass-picker-target="tab"][aria-pressed="true"] span {
  color: var(--marketing-white) !important;
}

.marketing-public .text-emerald-300,
.marketing-public .text-emerald-400,
.marketing-public .text-amber-300,
.marketing-public .text-purple-300,
.marketing-public .text-sky-300,
.marketing-public .text-teal-300 {
  color: var(--marketing-black) !important;
}

.marketing-public .bg-emerald-500,
.marketing-public .bg-emerald-500\/20,
.marketing-public .bg-emerald-900\/40,
.marketing-public .bg-amber-500\/20,
.marketing-public .bg-purple-900,
.marketing-public .bg-sky-900,
.marketing-public .bg-amber-900,
.marketing-public .bg-teal-500,
.marketing-public .bg-teal-500\/20 {
  background-color: #e4e4e4 !important;
  color: var(--marketing-black) !important;
}

.marketing-public .marketing-public-button.bg-emerald-500,
.marketing-public button[type="submit"],
.marketing-public input[type="submit"] {
  background: var(--marketing-black) !important;
  border: 1px solid var(--marketing-black) !important;
  border-radius: 0 !important;
  color: var(--marketing-white) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  text-transform: uppercase;
}

.marketing-public button[type="submit"]:hover,
.marketing-public input[type="submit"]:hover {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

.marketing-public input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="submit"]),
.marketing-public textarea,
.marketing-public select {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-border) !important;
  border-radius: 0 !important;
  color: var(--marketing-black) !important;
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
}

.marketing-public input::placeholder,
.marketing-public textarea::placeholder {
  color: rgba(0, 0, 0, 0.45) !important;
}

.marketing-public label {
  color: var(--marketing-black) !important;
}

.marketing-public input[type="checkbox"],
.marketing-public input[type="radio"] {
  accent-color: var(--marketing-black);
}

.marketing-public a:not(.marketing-public-button):not(.public-event-card):not(.public-feature-card) {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.marketing-public .rounded-full {
  border-radius: 0 !important;
}

.marketing-public .public-event-card span.rounded-full,
.marketing-public .public-feature-card span.rounded-full,
.marketing-public .marketing-public-detail-card span.rounded-full {
  align-items: center;
  background: #e4e4e4 !important;
  border: 1px solid #e4e4e4;
  color: var(--marketing-black) !important;
  display: inline-flex;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.875rem !important;
  font-weight: 500;
  line-height: 1;
  min-height: 2rem;
  padding: 0.375rem 0.75rem !important;
  text-transform: uppercase;
}

.marketing-public .public-event-card h2,
.marketing-public .public-feature-card h2,
.marketing-public .public-feature-card h3,
.marketing-public .series-event-card .text-lg,
.marketing-public .marketing-public-detail-card h1,
.marketing-public .marketing-public-form-card h2 {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.marketing-public .marketing-public-meta,
.marketing-public .public-event-card p,
.marketing-public .event-description-rich {
  color: var(--marketing-gray) !important;
}

.marketing-public .event-description-rich h1,
.marketing-public .event-description-rich h2,
.marketing-public .event-description-rich h3,
.marketing-public .event-description-rich strong {
  color: var(--marketing-black);
}

.marketing-public .aspect-video {
  border-radius: 0 !important;
}

.marketing-subscribe-confirmation {
  max-width: 86rem;
}

.marketing-subscribe-hero {
  display: block;
  padding-bottom: 4rem;
}

.marketing-subscribe-hero > div {
  max-width: 62rem;
}

.marketing-subscribe-hero .marketing-public-lede {
  margin-left: 0;
}

.marketing-subscribe-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2rem;
}

.marketing-subscribe-actions .marketing-public-button,
.marketing-subscribe-confirm-form .marketing-public-button {
  padding: 0.875rem 1.5rem;
}

.marketing-subscribe-section-link {
  flex: 0 0 auto;
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: underline !important;
}

.marketing-subscribe-events-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.marketing-subscribe-events-grid .public-event-card {
  height: 100%;
}

.marketing-subscribe-empty {
  color: var(--marketing-gray);
  padding: 1.5rem;
}

.marketing-subscribe-video-carousel {
  min-width: 0;
  position: relative;
}

.marketing-subscribe-video-track {
  display: flex;
  gap: 1rem;
  min-width: 0;
  overflow-x: auto;
  padding: 0 0 1rem;
  scroll-padding-inline: 0;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.marketing-subscribe-video-track::-webkit-scrollbar {
  display: none;
}

.marketing-subscribe-video-card {
  display: flex;
  flex: 0 0 21rem;
  flex-direction: column;
  max-width: 82vw;
  overflow: hidden;
  scroll-snap-align: start;
}

.marketing-subscribe-video-frame {
  background: var(--marketing-black);
  position: relative;
}

.marketing-subscribe-video-frame > div {
  border: 0 !important;
  border-radius: 0 !important;
}

.marketing-subscribe-first-ascent {
  background: var(--marketing-white);
  bottom: 0.75rem;
  color: var(--marketing-black);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.75rem;
  left: 0.75rem;
  padding: 0.5rem 0.625rem;
  position: absolute;
  text-transform: uppercase;
  z-index: 2;
}

.marketing-subscribe-video-carousel [data-public-video-carousel-controls] {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-black) !important;
  border-radius: 0 !important;
  color: var(--marketing-black) !important;
}

.marketing-subscribe-video-carousel [data-public-video-carousel-controls]:hover {
  background: var(--marketing-black) !important;
  color: var(--marketing-white) !important;
}

.marketing-subscribe-pending {
  padding-bottom: 7rem;
  padding-top: 7rem;
}

.marketing-subscribe-pending .marketing-public-hero {
  margin-bottom: 2rem;
}

.marketing-subscribe-confirm-form {
  display: flex;
  justify-content: center;
}

@media (max-width: 64rem) {
  .marketing-subscribe-events-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 48rem) {
  .marketing-subscribe-confirmation {
    padding-bottom: 4rem;
    padding-top: 3rem;
  }

  .marketing-subscribe-hero {
    padding-bottom: 3rem;
  }

  .marketing-subscribe-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .marketing-subscribe-actions .marketing-public-button {
    width: 100%;
  }

  .marketing-subscribe-confirmation .marketing-public-section-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.75rem;
  }

  .marketing-subscribe-video-card {
    flex-basis: 82vw;
  }

  .marketing-subscribe-pending {
    padding-bottom: 5rem;
    padding-top: 4rem;
  }
}

.marketing-public-auth-header {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.marketing-public-auth-mark {
  color: var(--marketing-black);
  display: inline-flex;
  height: 2.5rem;
  margin-bottom: 1.5rem;
  width: 3.3125rem;
}

.marketing-public-auth-mark svg {
  display: block;
  height: 100%;
  width: 100%;
}

.marketing-public-auth .marketing-public-title {
  font-size: 3.25rem;
}

.marketing-public-auth-confirmation {
  margin-bottom: 1.5rem;
  padding: 1.5rem;
  text-align: center;
}

.marketing-public-auth-confirmation-icon {
  color: var(--marketing-black);
  display: block;
  height: 2rem;
  margin: 0 auto 0.75rem;
  width: 2rem;
}

.marketing-public-auth-confirmation-title {
  color: var(--marketing-black);
  font-size: 1rem;
  font-weight: 500;
  margin: 0;
}

.marketing-public-auth-confirmation-email {
  color: var(--marketing-gray);
  font-size: 0.875rem;
  margin: 0.35rem 0 0;
}

.marketing-public-magic-link-card {
  padding: 2rem !important;
}

.marketing-public-magic-link-icon {
  align-items: center;
  background: var(--marketing-black);
  color: var(--marketing-white);
  display: flex;
  height: 3rem;
  justify-content: center;
  margin: 0 auto 1.25rem;
  width: 3rem;
}

.marketing-public-magic-link-copy,
.marketing-public-magic-link-note {
  color: var(--marketing-gray);
  line-height: 1.45;
}

.marketing-public-magic-link-card h2 {
  color: var(--marketing-black);
}

/* Compact public link page. It keeps its purpose-built, in-app-browser-safe
   layout while sharing the black-and-white marketing visual language. */
.marketing-links-page {
  --marketing-black: #000;
  --marketing-white: #fff;
  --marketing-gray: #575757;
  --marketing-border: #d7d7d7;
  background: var(--marketing-white);
  color: var(--marketing-black);
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
}

.marketing-links-shell {
  padding-top: max(3rem, env(safe-area-inset-top));
}

.marketing-links-mark {
  color: var(--marketing-black);
  height: 3rem;
  width: 4rem;
}

.marketing-links-mark svg {
  display: block;
  height: 100%;
  width: 100%;
}

.marketing-links-title,
.marketing-links-subscribe-title {
  color: var(--marketing-black);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.marketing-links-title {
  font-size: 2.5rem;
  line-height: 0.95;
}

.marketing-links-tagline,
.marketing-links-subscribe-copy,
.marketing-links-fine-print,
.marketing-links-empty,
.marketing-links-footer {
  color: var(--marketing-gray);
}

.marketing-links-address a {
  color: var(--marketing-black);
}

.marketing-links-hours,
.marketing-links-reset {
  color: var(--marketing-gray);
}

.marketing-links-hours .is-current,
.marketing-links-reset.is-advisory,
.marketing-links-reset-list .is-current {
  color: var(--marketing-black);
}

.marketing-links-reset-list {
  border-top: 1px solid var(--marketing-border);
  color: var(--marketing-gray);
}

.marketing-links-button {
  background: var(--marketing-black);
  border: 1px solid var(--marketing-black);
  border-radius: 0;
  color: var(--marketing-white);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  letter-spacing: 0.02em;
  min-height: 3.5rem;
  text-transform: uppercase;
}

.marketing-links-button:hover,
.marketing-links-button:focus-visible {
  background: var(--marketing-white);
  color: var(--marketing-black);
}

.marketing-links-subscribe {
  background: var(--marketing-white);
  border: 1px solid var(--marketing-black);
  border-radius: 0;
}

.marketing-links-subscribe-icon {
  background: var(--marketing-black);
  border-radius: 0;
  color: var(--marketing-white);
}

.marketing-links-input {
  background: var(--marketing-white);
  border: 1px solid var(--marketing-black);
  border-radius: 0;
  color: var(--marketing-black);
}

.marketing-links-input::placeholder {
  color: #777;
}

.marketing-links-input:focus {
  box-shadow: 0 0 0 1px var(--marketing-black);
}

.marketing-links-submit {
  background: var(--marketing-black);
  border: 1px solid var(--marketing-black);
  border-radius: 0;
  color: var(--marketing-white);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  text-transform: uppercase;
}

.marketing-links-submit:hover,
.marketing-links-submit:focus-visible {
  background: var(--marketing-white);
  color: var(--marketing-black);
}

.marketing-public-text-link {
  color: var(--marketing-black);
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 0.18em;
}

.marketing-public-text-link:hover {
  text-decoration-thickness: 2px !important;
}

.marketing-public-auth .w-8.h-8 {
  border: 1px solid var(--marketing-border);
  color: var(--marketing-black);
}

.marketing-public-auth .w-12.h-0\.5 {
  background: var(--marketing-border) !important;
}

.marketing-public-step-number {
  background: var(--marketing-black) !important;
  color: var(--marketing-white) !important;
}

.marketing-public-step-title {
  color: var(--marketing-black);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.marketing-public-step-copy {
  color: var(--marketing-gray);
  font-size: 0.9375rem;
  line-height: 1.45;
  margin: 0.5rem 0 0;
}

.marketing-public .hidden.sm\:inline-flex {
  background: var(--marketing-white) !important;
  border-color: var(--marketing-border) !important;
  border-radius: 0;
}

.marketing-public .grid.grid-cols-7 {
  background: var(--marketing-border) !important;
  border-radius: 0 !important;
}

.marketing-public .grid.grid-cols-7 > div {
  background: var(--marketing-white) !important;
}

.marketing-public .grid.grid-cols-7 a {
  background: #e4e4e4 !important;
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main > .max-w-lg,
body.marketing-signup-page main > .max-w-2xl,
body.marketing-signup-page main > .max-w-6xl {
  color: var(--marketing-black);
  margin: 0 auto;
  padding: 5rem 1.5rem 6rem;
  width: 100%;
}

body.marketing-signup-page main > .max-w-lg {
  max-width: 36rem;
}

body.marketing-signup-page main > .max-w-2xl {
  max-width: 46rem;
}

body.marketing-signup-page main > .max-w-6xl {
  max-width: 86rem;
}

body.marketing-signup-page main h1,
body.marketing-signup-page main h2,
body.marketing-signup-page main h3,
body.marketing-signup-page main .font-bold,
body.marketing-signup-page main .font-extrabold {
  color: var(--marketing-black);
}

body.marketing-signup-page main > div > .text-center h1,
body.marketing-signup-page .marketing-public-title {
  color: var(--marketing-black) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 3rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em;
  line-height: 0.95;
  text-transform: uppercase;
}

body.marketing-signup-page main > div > .text-center p,
body.marketing-signup-page main p,
body.marketing-signup-page main .text-slate-300,
body.marketing-signup-page main .text-slate-400,
body.marketing-signup-page main .text-slate-500,
body.marketing-signup-page main .text-slate-600 {
  color: var(--marketing-gray) !important;
}

body.marketing-signup-page main .text-slate-100,
body.marketing-signup-page main .text-slate-200,
body.marketing-signup-page main .text-white,
body.marketing-signup-page main .text-emerald-300,
body.marketing-signup-page main .text-emerald-400,
body.marketing-signup-page main .text-amber-100,
body.marketing-signup-page main .text-amber-300,
body.marketing-signup-page main .text-amber-400,
body.marketing-signup-page main .text-teal-400 {
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main .bg-slate-950,
body.marketing-signup-page main .bg-slate-950\/40,
body.marketing-signup-page main .bg-slate-950\/60,
body.marketing-signup-page main .bg-slate-900,
body.marketing-signup-page main .bg-slate-800,
body.marketing-signup-page main .bg-slate-800\/50,
body.marketing-signup-page main .bg-slate-800\/70,
body.marketing-signup-page main .bg-slate-700,
body.marketing-signup-page main .bg-slate-700\/60,
body.marketing-signup-page main .bg-emerald-500\/10,
body.marketing-signup-page main .bg-emerald-500\/20,
body.marketing-signup-page main .bg-amber-500\/10,
body.marketing-signup-page main .bg-amber-500\/20,
body.marketing-signup-page main .bg-red-500\/20 {
  background-color: var(--marketing-white) !important;
}

body.marketing-signup-page main .border-slate-600,
body.marketing-signup-page main .border-slate-700,
body.marketing-signup-page main .border-slate-800,
body.marketing-signup-page main .border-emerald-500\/30,
body.marketing-signup-page main .border-emerald-500\/40,
body.marketing-signup-page main .border-amber-500\/30,
body.marketing-signup-page main .border-amber-500\/40,
body.marketing-signup-page main .border-red-500\/30 {
  border-color: var(--marketing-border) !important;
}

body.marketing-signup-page main .bg-slate-900.border,
body.marketing-signup-page main .bg-slate-800.border,
body.marketing-signup-page main .bg-slate-900.rounded-xl,
body.marketing-signup-page main .bg-emerald-500\/10.border,
body.marketing-signup-page main .bg-amber-500\/10.border,
body.marketing-signup-page main .bg-red-500\/20.border {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-border) !important;
  box-shadow: none !important;
}

body.marketing-signup-page main .rounded,
body.marketing-signup-page main .rounded-md,
body.marketing-signup-page main .rounded-lg,
body.marketing-signup-page main .rounded-xl,
body.marketing-signup-page main .rounded-2xl {
  border-radius: 0 !important;
}

body.marketing-signup-page main .w-8.h-8.rounded-full {
  background: #e4e4e4 !important;
  border: 1px solid #e4e4e4 !important;
  border-radius: 0 !important;
  color: var(--marketing-black) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500 !important;
}

body.marketing-signup-page main .w-8.h-8.rounded-full.bg-emerald-500,
body.marketing-signup-page main .w-8.h-8.rounded-full.bg-emerald-500\/30 {
  background: var(--marketing-black) !important;
  border-color: var(--marketing-black) !important;
  color: var(--marketing-white) !important;
}

body.marketing-signup-page main .w-12.h-0\.5 {
  background: var(--marketing-border) !important;
}

body.marketing-signup-page main .w-12.h-0\.5.bg-emerald-500 {
  background: var(--marketing-black) !important;
}

body.marketing-signup-page main span.rounded-full,
body.marketing-signup-page main span[class*="rounded-full"] {
  background: #e4e4e4 !important;
  border: 1px solid #e4e4e4 !important;
  border-radius: 0 !important;
  color: var(--marketing-black) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500 !important;
  text-transform: uppercase;
}

body.marketing-signup-page main label {
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]),
body.marketing-signup-page main textarea,
body.marketing-signup-page main select {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-border) !important;
  border-radius: 0 !important;
  color: var(--marketing-black) !important;
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
}

body.marketing-signup-page main input:focus,
body.marketing-signup-page main textarea:focus,
body.marketing-signup-page main select:focus {
  border-color: var(--marketing-black) !important;
  box-shadow: none !important;
  outline: 1px solid var(--marketing-black) !important;
  outline-offset: 0;
}

body.marketing-signup-page main input::placeholder,
body.marketing-signup-page main textarea::placeholder {
  color: rgba(0, 0, 0, 0.45) !important;
}

body.marketing-signup-page main input[type="checkbox"],
body.marketing-signup-page main input[type="radio"] {
  accent-color: var(--marketing-black);
  border-radius: 0 !important;
}

body.marketing-signup-page main button[type="submit"],
body.marketing-signup-page main input[type="submit"],
body.marketing-signup-page main button[type="button"].bg-emerald-500,
body.marketing-signup-page main button[type="button"].bg-slate-700,
body.marketing-signup-page main button[type="button"].bg-slate-800,
body.marketing-signup-page main a[class*="bg-emerald"],
body.marketing-signup-page main a[class*="bg-amber"],
body.marketing-signup-page main #save-photo-btn,
body.marketing-signup-page main [data-signup-card-target="submitButton"] {
  align-items: center;
  background: var(--marketing-black) !important;
  border: 1px solid var(--marketing-black) !important;
  border-radius: 0 !important;
  color: var(--marketing-white) !important;
  display: inline-flex;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500 !important;
  justify-content: center;
  min-height: 3rem;
  text-transform: uppercase;
}

body.marketing-signup-page main button[type="submit"]:hover,
body.marketing-signup-page main input[type="submit"]:hover,
body.marketing-signup-page main button[type="button"].bg-emerald-500:hover,
body.marketing-signup-page main button[type="button"].bg-slate-700:hover,
body.marketing-signup-page main button[type="button"].bg-slate-800:hover,
body.marketing-signup-page main a[class*="bg-emerald"]:hover,
body.marketing-signup-page main a[class*="bg-amber"]:hover,
body.marketing-signup-page main #save-photo-btn:hover,
body.marketing-signup-page main [data-signup-card-target="submitButton"]:hover {
  background: var(--marketing-white) !important;
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main button:disabled,
body.marketing-signup-page main button[disabled] {
  opacity: 0.45 !important;
}

body.marketing-signup-page main button[type="submit"].bg-transparent,
body.marketing-signup-page main button[type="submit"].border-0 {
  background: transparent !important;
  border: 0 !important;
  color: var(--marketing-black) !important;
  display: inline-flex;
  font-family: neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  min-height: 2.75rem;
  text-decoration: underline;
  text-transform: none;
}

body.marketing-signup-page main button[type="submit"].bg-transparent:hover,
body.marketing-signup-page main button[type="submit"].border-0:hover {
  background: transparent !important;
  color: var(--marketing-gray) !important;
}

body.marketing-signup-page main button.bg-transparent,
body.marketing-signup-page main button.border-0,
body.marketing-signup-page main a:not([class*="bg-"]) {
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main .border-dashed {
  background: #f6f6f6 !important;
  border-color: var(--marketing-border) !important;
}

body.marketing-signup-page main .waiver-prose {
  background: #f6f6f6 !important;
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main .waiver-prose * {
  color: inherit !important;
}

body.marketing-signup-page main [data-defer-waiver-modal-target="modal"] {
  background: rgba(0, 0, 0, 0.72) !important;
}

body.marketing-signup-page main [data-defer-waiver-modal-target="modal"] > div {
  background: var(--marketing-white) !important;
  border: 1px solid var(--marketing-black) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main .waiver-video-retry {
  background: var(--marketing-white) !important;
  border: 2px solid #dc2626 !important;
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main .waiver-video-retry:hover {
  background: #fef2f2 !important;
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main button.signature-mode-button[aria-pressed="false"] {
  background: var(--marketing-white) !important;
  border: 2px solid var(--marketing-black) !important;
  color: var(--marketing-black) !important;
}

body.marketing-signup-page main button.signature-mode-button[aria-pressed="true"] {
  background: var(--marketing-black) !important;
  border: 2px solid var(--marketing-black) !important;
  box-shadow: 0 0 0 3px #d1d5db;
  color: var(--marketing-white) !important;
}

body.marketing-signup-page main button.signature-mode-button[aria-pressed="true"]::before {
  content: "✓";
  margin-right: 0.4rem;
}

@media (min-width: 768px) and (max-width: 991px) {
  .marketing-newsletter {
    min-height: 20svh;
  }
}

@media (max-width: 991px) {
  .marketing-public,
  .marketing-public-auth {
    padding: 4rem 1rem 5rem;
  }

  .marketing-public-hero,
  .marketing-public-section-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .marketing-public-title {
    font-size: 3rem;
  }

  .marketing-public-lede {
    font-size: 1.1rem;
  }

  .marketing-public-groups-intro {
    max-width: 46rem;
    padding-top: 0;
  }

  .marketing-public-events-auth {
    align-items: flex-start;
    flex-direction: column;
  }

  .marketing-public-events-auth-actions {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
  }

  body.marketing-signup-page main > .max-w-lg,
  body.marketing-signup-page main > .max-w-2xl,
  body.marketing-signup-page main > .max-w-6xl {
    padding: 3.5rem 1rem 5rem;
  }

  body.marketing-signup-page main > div > .text-center h1,
  body.marketing-signup-page .marketing-public-title {
    font-size: 2.25rem !important;
  }
}

.marketing-home-page .marketing-news-header--home {
  background: transparent;
  border-bottom-color: rgba(255, 255, 255, 0.15);
  color: var(--marketing-white);
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.marketing-home-page .marketing-news-header--home .marketing-news-mark,
.marketing-home-page .marketing-news-header--home .marketing-news-footer-mark,
.marketing-home-page .marketing-news-header--home .marketing-news-wordmark {
  color: var(--marketing-white);
}

.marketing-home-page .marketing-news-header--home .marketing-news-navlink::after {
  background: var(--marketing-white);
}

.marketing-home-page .marketing-news-flash {
  left: 0;
  position: absolute;
  right: 0;
  top: 4.5rem;
  z-index: 60;
}

.marketing-home {
  --home-black: #000;
  --home-white: #fff;
  --home-border-dark: rgba(0, 0, 0, 0.5);
  --home-border-light: rgba(255, 255, 255, 0.15);
  background: var(--home-white);
  color: var(--home-black);
  overflow: clip;
}

.marketing-home * {
  box-sizing: border-box;
}

.marketing-home-section {
  position: relative;
}

.marketing-home-h1,
.marketing-home-h6 {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  line-height: 0.89;
  margin: 0;
  text-transform: uppercase;
}

.marketing-home-h1 {
  font-size: 4rem;
  letter-spacing: 0.05em;
}

.marketing-home-h6 {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.5;
}

.marketing-home p,
.marketing-home ul {
  margin: 0;
}

.marketing-home ul {
  list-style: none;
  padding: 0;
}

.marketing-home img {
  display: block;
  max-width: 100%;
}

.marketing-homepage-editor-toolbar {
  align-items: center;
  background: rgba(0, 0, 0, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: var(--home-white);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 0.5rem;
  position: fixed;
  right: 1rem;
  top: 5.75rem;
  z-index: 90;
}

.marketing-homepage-editor-actions {
  align-items: center;
  display: flex;
  gap: 0.5rem;
}

.marketing-homepage-editor-label,
.marketing-homepage-editor-button,
.marketing-homepage-editor-exit {
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}

.marketing-homepage-editor-label {
  color: rgba(255, 255, 255, 0.66);
  padding: 0 0.35rem;
}

.marketing-homepage-editor-button {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.34);
  color: inherit;
  cursor: pointer;
  padding: 0.55rem 0.65rem;
}

.marketing-homepage-editor-button:hover,
.marketing-homepage-editor-button:focus-visible {
  border-color: var(--home-white);
  outline: 0;
}

.marketing-homepage-editor-button.is-primary {
  background: var(--home-white);
  color: var(--home-black);
}

.marketing-homepage-editor-button.is-active {
  background: rgba(255, 255, 255, 0.16);
  border-color: var(--home-white);
}

.marketing-homepage-editor-button:disabled {
  cursor: progress;
  opacity: 0.6;
}

.marketing-homepage-editor-viewport {
  display: flex;
  gap: 0.5rem;
}

.homepage-viewport-overlay {
  align-items: center;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  inset: 0;
  justify-content: center;
  padding: 2rem 1rem;
  position: fixed;
  z-index: 200;
}

.homepage-viewport-close {
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: #fff;
  cursor: pointer;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.75rem;
  padding: 0.5rem 1rem;
  text-transform: uppercase;
}

.homepage-viewport-device {
  background: #000;
  border: 10px solid #111;
  border-radius: 2.25rem;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
  height: min(844px, 86vh);
  max-width: 100%;
  overflow: hidden;
  width: 390px;
}

.homepage-viewport-frame {
  border: 0;
  height: 100%;
  width: 100%;
}

.marketing-homepage-editor-exit {
  align-self: stretch;
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.48);
  color: rgba(226, 232, 240, 0.9);
  display: inline-flex;
  justify-content: center;
  padding: 0.55rem 0.65rem;
  text-decoration: none;
}

.marketing-homepage-editor-exit:hover,
.marketing-homepage-editor-exit:focus-visible {
  background: rgba(30, 41, 59, 0.95);
  border-color: rgba(226, 232, 240, 0.72);
  color: var(--home-white);
  outline: 0;
}

.marketing-homepage-editor-status {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.75rem;
  line-height: 1.2;
  max-width: 9rem;
}

.marketing-homepage-copy-editing [data-marketing-homepage-editor-target~="field"] {
  cursor: text;
  outline: 1px dashed currentColor;
  outline-offset: 0.2em;
}

.marketing-homepage-copy-editing [data-marketing-homepage-editor-target~="field"]:focus {
  background: rgba(127, 127, 127, 0.16);
  outline-style: solid;
}

.marketing-home-button-link {
  align-items: center;
  color: inherit;
  display: inline-flex;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  gap: 0.6rem;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
}

.marketing-home-button-link:hover .marketing-home-arrow {
  transform: translateX(40%);
}

.marketing-home-arrow {
  display: inline-flex;
  flex: none;
  height: 0.75em;
  transition: transform 0.2s ease;
  width: 1em;
}

.marketing-home-arrow svg {
  display: block;
  height: 100%;
  width: 100%;
}

.marketing-home-arrow.is-large {
  height: 2.8rem;
  width: 3.75rem;
}

.marketing-home-hero {
  align-items: stretch;
  color: var(--home-white);
  display: flex;
  min-height: 100svh;
  overflow: hidden;
  padding: 5.5rem 1.5rem 1.5rem;
}

.marketing-home-hero-image,
.marketing-home-video-image {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

.marketing-home-hero-wrapper {
  display: flex;
  flex: 1;
  justify-content: space-between;
  position: relative;
  width: 100%;
  z-index: 5;
}

.marketing-home-hero-left {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  max-width: 45rem;
}

.marketing-home-hero-copy {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: 18.75rem;
}

.marketing-home-hero-copy p {
  font-size: 1rem;
  line-height: 1.4;
}

.marketing-home-hero-right {
  align-items: flex-end;
  display: flex;
  flex: 1;
  justify-content: flex-end;
  text-align: right;
}

.marketing-home-rooted {
  max-width: 31rem;
}

.marketing-home-rooted-mobile {
  display: none;
}

.marketing-home-facilities {
  color: var(--home-white);
  min-height: 100svh;
}

.marketing-home-facilities-desktop {
  display: flex;
  min-height: 100svh;
}

.marketing-home-facilities-header {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  inset: 0 auto 0 0;
  justify-content: space-between;
  max-width: 21.75rem;
  padding: 1.5rem;
  /* The intro overlaps the tab column at tablet widths but has no controls. */
  pointer-events: none;
  position: absolute;
  z-index: 6;
}

.marketing-home-facilities-desktop .marketing-home-facilities-header {
  color: var(--home-black);
}

.marketing-home-facilities-header p:last-child {
  line-height: 1.4;
  max-width: 18.75rem;
}

.marketing-home-facility-tabs {
  align-items: flex-end;
  color: var(--home-black);
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-start;
  max-width: 50%;
  padding: 1.5rem;
}

.marketing-home-facility-tab {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  display: flex;
  justify-content: flex-end;
  padding: 0;
  position: relative;
  text-align: right;
}

.marketing-home-facility-tab .marketing-home-h1 {
  letter-spacing: 0.05em;
}

.marketing-home-facility-arrow {
  display: none;
  height: 1.8rem;
  position: absolute;
  right: calc(100% + 1rem);
  top: 50%;
  transform: translateY(-50%);
  width: 2.4rem;
}

.marketing-home-facility-tab.is-active .marketing-home-facility-arrow {
  display: inline-flex;
}

.marketing-home-facility-panels {
  flex: 1;
  min-width: 40%;
}

.marketing-home-facility-panel {
  background-image: linear-gradient(rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.12)), var(--facility-image);
  background-position: center;
  background-size: cover;
  color: var(--home-white);
  display: none;
  height: 100%;
  padding: 1.3rem 1.5rem 1.5rem;
}

.marketing-home-facility-panel.is-active {
  display: block;
}

.marketing-home-facility-panel p {
  line-height: 1.4;
  max-width: 16.88rem;
}

.marketing-home-facility-panel:nth-child(2) p {
  margin-top: 3.1rem;
}

.marketing-home-facility-panel:nth-child(3) p {
  margin-top: 6.1rem;
}

.marketing-home-facility-panel:nth-child(4) p {
  margin-top: 9.4rem;
}

.marketing-home-facility-panel:nth-child(5) p {
  margin-top: 12.2rem;
}

.marketing-home-facilities-mobile {
  display: none;
}

.marketing-home-merch {
  border-bottom: 1px solid var(--home-border-dark);
  border-top: 1px solid var(--home-border-dark);
  min-height: 100svh;
}

.marketing-home-merch-title {
  left: 1.5rem;
  position: absolute;
  top: 1.5rem;
  z-index: 3;
}

.marketing-home-merch-controls {
  bottom: 1.5rem;
  display: flex;
  gap: 2rem;
  position: absolute;
  right: 1.5rem;
  z-index: 4;
}

.marketing-home-icon-button {
  background: transparent;
  border: 0;
  color: var(--home-white);
  display: inline-flex;
  height: 1rem;
  padding: 0;
  width: 1rem;
}

.marketing-home-icon-button svg {
  height: 100%;
  width: 100%;
}

.marketing-home-icon-button.is-dark {
  color: var(--home-black);
}

.marketing-home-icon-button.is-prev {
  transform: rotate(180deg);
}

.marketing-home-merch-track {
  display: flex;
  min-height: 100svh;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.marketing-home-merch-track::-webkit-scrollbar {
  display: none;
}

.marketing-home-merch-item {
  align-items: center;
  border-right: 1px solid var(--home-black);
  color: inherit;
  display: flex;
  flex: 0 0 50vw;
  justify-content: center;
  min-height: 100svh;
  padding: 1.5rem;
  position: relative;
  scroll-snap-align: start;
}

.marketing-home-merch-text {
  bottom: 1.5rem;
  display: flex;
  flex-direction: column;
  left: 1.5rem;
  line-height: 1.4;
  position: absolute;
}

.marketing-home-merch-image {
  height: 100%;
  max-height: 80svh;
  object-fit: contain;
  width: auto;
}

.marketing-home-quote {
  min-height: 100svh;
}

.marketing-home-quote-wrapper {
  display: flex;
  min-height: 100svh;
  padding: 1.5rem;
}

.marketing-home-quote-left {
  align-items: flex-end;
  display: flex;
  flex: 1;
  justify-content: flex-start;
}

.marketing-home-quote-left p {
  line-height: 1.4;
  max-width: 39rem;
}

.marketing-home-quote-right {
  align-items: flex-start;
  display: flex;
  justify-content: flex-start;
  max-width: 50rem;
  text-align: right;
}

.marketing-home-video {
  align-items: center;
  color: var(--home-white);
  display: flex;
  min-height: 100svh;
  overflow: hidden;
}

.marketing-home-video-overlay {
  background: rgba(0, 0, 0, 0.42);
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

/* Pass-backed membership options on the homepage match the marketing-public
   sign-up shell; the shared pass tiles render via .marketing-public overrides. */
.marketing-home-pricing-compare {
  background: var(--marketing-white);
  color: var(--marketing-black);
  padding: 4rem 1.5rem;
}

.marketing-home-pricing-compare-inner {
  margin: 0 auto;
  max-width: 62rem;
  width: 100%;
}

.marketing-home-pricing-compare-head {
  margin-bottom: 2rem;
}

.marketing-home-pricing-compare-eyebrow {
  color: var(--marketing-gray);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.marketing-home-pricing-compare-title {
  color: var(--marketing-black);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(2rem, 6vw, 3rem);
  line-height: 1;
  margin-top: 0.35rem;
  text-transform: uppercase;
}

/* Sharp corners on the tiles + segmented picker, matching the sign-up shell. */
.marketing-home-pricing-compare .marketing-public .rounded-xl,
.marketing-home-pricing-compare .marketing-public .rounded-lg {
  border-radius: 0 !important;
}

/* Light segmented-picker track (bg-slate-950/60 isn't in the shared override). */
.marketing-home-pricing-compare .marketing-public .bg-slate-950\/60 {
  background-color: #f2f2f2 !important;
}

/* The homepage CTA is a link (not a submit), so give it the same black
   marketing button treatment the sign-up submit CTAs get. The CMS preview
   keeps its CTA disabled/inert but uses the identical visual treatment. */
.marketing-home-pricing-compare .marketing-public a[class*="bg-amber"],
[data-homepage-pass-picker-preview] .marketing-public button[disabled][class*="bg-amber"] {
  background: var(--marketing-black) !important;
  border: 1px solid var(--marketing-black) !important;
  color: var(--marketing-white) !important;
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 500;
  opacity: 1 !important;
  text-transform: uppercase;
}

.marketing-home-pricing-compare .marketing-public a[class*="bg-amber"]:hover {
  background: transparent !important;
  color: var(--marketing-black) !important;
}

/* Standalone SEO pages keep the interactive homepage components above a
   server-rendered, plain-language reference section. Both layers read from the
   same pass and opening-hours records, so visible copy and checkout cannot
   drift while crawlers still receive complete text without interaction. */
.marketing-public-details {
  background: var(--marketing-white);
  border-top: 1px solid var(--marketing-black);
  color: var(--marketing-black);
  padding: 5rem 1.5rem;
}

.marketing-public-details-inner {
  margin: 0 auto;
  max-width: 76rem;
}

.marketing-public-details-intro {
  max-width: 52rem;
}

.marketing-public-details-eyebrow {
  color: var(--marketing-gray);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.marketing-public-details h1,
.marketing-public-details h2,
.marketing-public-details h3 {
  color: var(--marketing-black);
  font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
  text-transform: uppercase;
}

.marketing-public-details-intro h1,
.marketing-public-details-intro h2 {
  font-size: clamp(2.25rem, 7vw, 4.5rem);
  line-height: 0.95;
  margin: 0.5rem 0 1rem;
}

.marketing-public-details p,
.marketing-public-details li,
.marketing-public-details address,
.marketing-public-details dt,
.marketing-public-details dd {
  font-size: 1rem;
  line-height: 1.55;
}

.marketing-public-details a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.marketing-public-details-group {
  border-top: 1px solid var(--marketing-black);
  display: grid;
  gap: 2rem;
  grid-template-columns: minmax(14rem, 0.75fr) minmax(0, 2fr);
  margin-top: 4rem;
  padding-top: 1.5rem;
}

.marketing-public-details-group-heading h2,
.marketing-location-details-grid h2 {
  font-size: 1.35rem;
  line-height: 1.1;
  margin-bottom: 0.75rem;
}

.marketing-public-details-group-heading p {
  color: var(--marketing-gray);
  max-width: 22rem;
}

.marketing-public-details-grid {
  display: grid;
  gap: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.marketing-pricing-detail {
  border-bottom: 1px solid #d3d3d3;
  padding: 0 1.5rem 2rem 0;
}

.marketing-pricing-detail:nth-child(even) {
  border-left: 1px solid #d3d3d3;
  padding-left: 1.5rem;
  padding-right: 0;
}

.marketing-pricing-detail:nth-child(n + 3) {
  padding-top: 2rem;
}

.marketing-pricing-detail-heading {
  align-items: baseline;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}

.marketing-pricing-detail-heading h3 {
  font-size: 1.6rem;
  line-height: 1;
}

.marketing-pricing-detail-price {
  flex-shrink: 0;
  font-weight: 600;
}

.marketing-pricing-detail-copy {
  color: #3f3f3f;
  margin-top: 1rem;
}

.marketing-pricing-detail-copy p + p,
.marketing-pricing-detail-copy ul,
.marketing-pricing-detail-copy ol {
  margin-top: 0.65rem;
}

.marketing-pricing-detail-copy ul,
.marketing-pricing-detail-copy ol,
.marketing-location-details-grid ul {
  padding-left: 1.25rem;
}

.marketing-pricing-detail-copy ul,
.marketing-location-details-grid ul {
  list-style: disc;
}

.marketing-pricing-detail-copy ol {
  list-style: decimal;
}

.marketing-location-details-grid {
  border-top: 1px solid var(--marketing-black);
  display: grid;
  gap: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 4rem;
}

.marketing-location-details-grid > section {
  min-height: 17rem;
  padding: 1.5rem 2rem 0 0;
}

.marketing-location-details-grid > section + section {
  border-left: 1px solid #d3d3d3;
  padding-left: 2rem;
}

.marketing-location-details address {
  font-style: normal;
  margin-bottom: 1rem;
}

.marketing-location-hours > div {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}

.marketing-location-hours dt {
  font-weight: 600;
}

.marketing-location-details-grid li + li {
  margin-top: 0.65rem;
}

.marketing-home-video-link {
  align-items: center;
  color: inherit;
  display: flex;
  gap: 1.5rem;
  padding: 1.5rem;
  position: relative;
  z-index: 5;
}

.marketing-home-video-link:hover .marketing-home-arrow {
  transform: translateX(40%);
}

.marketing-home-map-wrapper {
  display: flex;
  position: relative;
  width: 100vw;
}

.marketing-home-map-sidebar {
  display: flex;
  flex: 1;
  flex-direction: column;
  max-width: 30%;
}

.marketing-home-map-intro {
  align-items: flex-start;
  display: flex;
  flex: auto;
  padding: 1.5rem;
}

.marketing-home-map-intro h2 {
  font: inherit;
  line-height: 1.4;
  margin: 0;
}

.marketing-home-map-control-row {
  align-items: flex-start;
  border-top: 1px solid var(--home-black);
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: 1.3rem 1.5rem;
  width: 100%;
}

.marketing-home-map-control {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  display: flex;
  gap: 0.6rem;
  padding: 0;
  text-align: left;
}

.marketing-home-map-square {
  aspect-ratio: 1;
  border: 1px solid var(--home-black);
  border-radius: 2px;
  flex: none;
  transition: background 0.2s ease;
  width: 0.8rem;
}

.marketing-home-map-control.is-active .marketing-home-map-square {
  background: var(--home-black);
}

.marketing-home-map-sidebar-body {
  display: flex;
  flex: auto;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
}

.marketing-home-map-bottom {
  padding: 1.5rem;
}

.marketing-home-map-parent {
  flex: 1;
  height: 100%;
  min-width: 0;
}

.marketing-home-map-main {
  aspect-ratio: 1080 / 800;
  overflow: hidden;
  position: relative;
}

.marketing-home-map-image {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

.marketing-home-ship-lines {
  color: #817f7f;
  height: 100%;
  left: -1%;
  object-fit: contain;
  position: absolute;
  top: 1%;
  transform: scale(1.05);
  transition: color 0.2s ease;
  z-index: 1;
}

.marketing-home-map-element {
  color: #817f7f;
  object-fit: contain;
  pointer-events: none;
  position: absolute;
  transition: color 0.2s ease;
  z-index: 3;
}

.marketing-home-map-element svg {
  display: block;
  pointer-events: none;
}

.marketing-home-map-element svg path,
.marketing-home-map-element svg rect {
  pointer-events: visiblePainted;
}

.marketing-home-map-train-ac {
  left: 34%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 55%;
}

.marketing-home-map-train-f {
  height: 100%;
  left: 57%;
  max-height: 100%;
  top: 0;
  transform: translateX(-50%);
}

.marketing-home-map-bikes {
  left: 56%;
  top: 42%;
  transform: translateX(-50%);
  width: 12%;
  z-index: 4;
}

.marketing-home-map-ferry {
  left: 38%;
  top: 43%;
  transform: translateX(-50%);
  width: 3%;
  z-index: 4;
}

.marketing-home-map-element.is-active {
  color: var(--home-white);
  z-index: 10;
}

.marketing-home-uprise-map {
  display: inline-flex;
  left: 58%;
  position: absolute;
  top: 39%;
  transform: translateX(-50%);
  width: 3%;
  z-index: 100;
}

.marketing-home-uprise-map svg {
  height: 100%;
  width: 100%;
}

@media (max-width: 991px) {
  /* Lock the page behind the full-screen nav so scrolling can't drag the fixed
     panel's logo/hamburger off-screen. Any overflow scrolls inside the panel. */
  html:has(.marketing-news-header--home .marketing-news-mobile-menu[open]) {
    overflow: hidden;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-menu summary {
    position: relative;
    z-index: 70;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-menu summary span {
    background: var(--marketing-white);
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-panel {
    background-color: var(--marketing-black);
    background-image: none;
    bottom: 0;
    color: var(--marketing-white);
    display: none;
    left: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 6rem 1rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
    position: fixed;
    right: 0;
    top: 0;
    z-index: 60;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-panel::before {
    background: var(--marketing-black);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    content: "";
    height: 4rem;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 65;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-menu[open] .marketing-news-mobile-panel {
    display: block;
  }

  /* Keep the menu as one continuous document. Main links, hours, secondary
     links, and contact details all participate in the same scroll instead of
     pinning the footer around an internally scrolling links list. */
  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-links {
    overflow: visible;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-link {
    color: var(--marketing-white);
    font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: clamp(2rem, 8.5vw, 2.75rem);
    line-height: 1;
    padding: 0.6rem 0;
    text-transform: uppercase;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-secondary-links {
    margin-top: 1.25rem;
    padding-top: 1rem;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    font-size: 0.65rem;
    gap: 0.65rem;
    margin-top: 1rem;
    padding-top: 0.85rem;
    white-space: normal;
  }

  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-contact-row {
    gap: 1rem;
  }

  /* When the full-screen nav is open, keep the white header logo visible above
     the panel, on the same line as the hamburger. */
  .marketing-home-page .marketing-news-header--home .marketing-news-nav:has(.marketing-news-mobile-menu[open]) .marketing-news-nav-left {
    position: relative;
    z-index: 70;
  }

  .marketing-homepage-editor-toolbar {
    align-items: stretch;
    bottom: 1rem;
    flex-wrap: wrap;
    left: 1rem;
    right: 1rem;
    top: auto;
  }

  .marketing-homepage-editor-actions {
    flex-wrap: wrap;
  }

  .marketing-home-h1 {
    font-size: 4rem;
    letter-spacing: 0;
  }

  .marketing-home-facility-tab .marketing-home-h1 {
    font-size: clamp(2.75rem, 6vw, 4rem);
  }

  .marketing-home-facility-tabs {
    padding-left: 4.5rem;
    padding-top: 4.5rem;
  }

  .marketing-home-facility-arrow {
    height: 1.35rem;
    right: calc(100% + 0.75rem);
    width: 1.8rem;
  }

  .marketing-home-hero {
    min-height: 100svh;
  }

  .marketing-home-merch-track {
    display: flex;
    min-height: 100svh;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }

  .marketing-home-merch-item {
    border-right: 1px solid var(--home-black);
    flex: 0 0 50vw;
    min-height: 100svh;
    scroll-snap-align: start;
  }

  .marketing-home-merch-image {
    height: 100%;
    max-height: 80svh;
    width: auto;
  }

  .marketing-home-quote-wrapper {
    flex-direction: column-reverse;
  }

  .marketing-home-quote-right {
    flex: 1;
    max-width: none;
  }
}

@media (max-width: 767px) {
  .marketing-home-h1 {
    font-size: 3rem;
  }

  .marketing-home-h6 {
    font-size: 1.25rem;
  }

  .marketing-home-hero {
    min-height: 100svh;
    padding: 9.5rem 1rem 1rem;
  }

  /* The portrait crop is brightest at the upper left, directly behind the
     white hero heading. Shift the phone-only crop toward the darker wall and
     add a restrained gray scrim for reliable contrast. Tablet and desktop
     keep the original image position and treatment. */
  .marketing-home-hero::before {
    background: rgba(0, 0, 0, 0.18);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
  }

  .marketing-home-hero-image {
    object-position: 54% 50%;
  }

  .marketing-home-hero-wrapper {
    flex-direction: column;
  }

  .marketing-home-hero-left {
    flex: 1;
    max-width: none;
  }

  .marketing-home-hero-copy {
    max-width: 17rem;
  }

  .marketing-home-hero-right {
    flex: 0;
  }

  .marketing-home-rooted {
    max-width: 22rem;
  }

  .marketing-home-rooted-desktop {
    display: none;
  }

  .marketing-home-rooted-mobile {
    display: inline;
  }

  .marketing-home-facilities-desktop {
    display: none;
  }

  .marketing-home-facilities-mobile {
    display: block;
    /* Match the section's 100svh so there's no empty gap below the amenities. */
    min-height: 100svh;
    overflow: hidden;
    position: relative;
  }

  .marketing-home-facility-carousel {
    display: flex;
    inset: 0;
    overflow-x: auto;
    overflow-y: hidden;
    position: absolute;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .marketing-home-facility-carousel::-webkit-scrollbar {
    display: none;
  }

  .marketing-home-facility-cell {
    align-items: center;
    background-image: linear-gradient(rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.14)), var(--facility-image);
    background-position: center;
    background-size: cover;
    display: flex;
    flex: 0 0 100%;
    height: 100%;
    justify-content: center;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .marketing-home-facility-cell-word {
    color: var(--home-white);
    font-family: video, neue-haas-grotesk-display, Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: clamp(3rem, 12vw, 4.5rem);
    font-weight: 500;
    line-height: 0.9;
    text-align: center;
  }

  .marketing-home-facilities-mobile .marketing-home-facilities-header {
    color: var(--home-white);
    inset: 0 auto auto 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 5;
  }

  .marketing-home-facilities-mobile .marketing-home-facilities-header p:last-child {
    background: rgba(0, 0, 0, 0.58);
    opacity: 1;
    padding: 0.65rem 0.75rem;
  }

  .marketing-home-facility-footer {
    align-items: center;
    bottom: 0;
    color: var(--home-white);
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    left: 0;
    padding: 1.5rem;
    pointer-events: none;
    position: absolute;
    right: 0;
    z-index: 5;
  }

  .marketing-home-facility-controls {
    pointer-events: auto;
  }

  .marketing-home-facility-desc-wrap {
    flex: 1;
    min-height: 5.5rem;
    position: relative;
  }

  .marketing-home-facility-desc {
    bottom: 0;
    left: 0;
    line-height: 1.4;
    max-width: 18rem;
    opacity: 0;
    position: absolute;
  }

  .marketing-home-facility-desc.is-active {
    opacity: 1;
  }

  .marketing-home-facility-controls {
    display: flex;
    gap: 2rem;
  }

  .marketing-home-merch {
    min-height: auto;
  }

  .marketing-home-merch-track {
    min-height: 58svh;
  }

  .marketing-home-merch-item {
    flex-basis: 100vw;
    min-height: 58svh;
    padding: 4rem 1rem 1rem;
  }

  .marketing-home-merch-image {
    max-height: 42svh;
  }

  .marketing-home-merch-text {
    bottom: 1rem;
    left: 1rem;
  }

  .marketing-home-merch-controls {
    bottom: 1rem;
    gap: 2rem;
    right: 1rem;
  }

  .marketing-home-quote,
  .marketing-home-quote-wrapper {
    min-height: auto;
  }

  .marketing-home-quote-wrapper {
    gap: 2rem;
    padding: 1rem;
  }

  .marketing-home-quote-left {
    align-items: flex-end;
  }

  .marketing-home-quote-left p {
    max-width: 32rem;
  }

  .marketing-home-quote-right {
    justify-content: center;
    text-align: center;
  }

  .marketing-home-quote-right .marketing-home-h1 {
    width: 100%;
  }

  .marketing-home-video {
    align-items: center;
    min-height: 50svh;
  }

  .marketing-home-video-link {
    padding: 1rem;
  }

  .marketing-public-details {
    padding: 3.5rem 1rem;
  }

  .marketing-public-details-group {
    grid-template-columns: 1fr;
    margin-top: 3rem;
  }

  .marketing-public-details-grid,
  .marketing-location-details-grid {
    grid-template-columns: 1fr;
  }

  .marketing-pricing-detail,
  .marketing-pricing-detail:nth-child(even) {
    border-left: 0;
    padding: 1.5rem 0;
  }

  .marketing-pricing-detail:first-child {
    padding-top: 0;
  }

  .marketing-location-details-grid > section {
    min-height: auto;
    padding: 1.5rem 0;
  }

  .marketing-location-details-grid > section + section {
    border-left: 0;
    border-top: 1px solid #d3d3d3;
    padding-left: 0;
  }

  .marketing-home-map {
    min-height: auto;
  }

  .marketing-home-map-wrapper {
    flex-direction: column;
  }

  .marketing-home-map-sidebar {
    max-width: none;
  }

  .marketing-home-map-intro,
  .marketing-home-map-control-row,
  .marketing-home-map-bottom {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  /* Directions layout on mobile: intro, then Get Directions, then the transit
     controls sit directly above the map (address lives in the footer). */
  .marketing-home-map-bottom {
    display: flex;
    justify-content: flex-end;
    order: -1;
  }

  .marketing-home-map-control-row.is-address {
    display: none;
  }

  /* Bigger tap targets for the transit toggles on touch. */
  .marketing-home-map-control-row {
    gap: 0.35rem;
    padding-bottom: 0.6rem;
    padding-top: 0.6rem;
  }

  .marketing-home-map-control {
    min-height: 2.75rem;
    padding: 0.4rem 0;
  }

  .marketing-home-map-parent {
    overflow: hidden;
  }

  .marketing-home-map-main {
    aspect-ratio: 1 / 1;
    transform: scale(1.9);
    transform-origin: center;
  }

  .marketing-home-map-train-ac {
    left: 29%;
    width: 70%;
  }

  .marketing-home-map-bikes {
    top: 41%;
    width: 15%;
  }

  .marketing-home-map-ferry {
    left: 34%;
    top: 37%;
    width: 3.5%;
  }

  .marketing-home-ship-lines {
    left: -4%;
    top: -6%;
    transform: scale(1);
  }
}

@media (max-width: 479px) {
  .marketing-home-page .marketing-news-header--home .marketing-news-mobile-link {
    font-size: clamp(2rem, 10vw, 2.6rem);
  }

  .marketing-home-facility-cell-word {
    font-size: 3rem;
  }

  .marketing-home-quote-left p {
    max-width: none;
  }
}

trix-editor {
  background: #0f172a;
  border: 1px solid #334155;
  border-top: none;
  color: #e2e8f0;
  min-height: 16rem;
  padding: 1rem;
  border-radius: 0 0 0.75rem 0.75rem;
}

trix-editor a {
  color: #34d399;
}

@keyframes lock-shake {
  0% { transform: translateX(0); }
  20% { transform: translateX(-6px); }
  40% { transform: translateX(6px); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(4px); }
  100% { transform: translateX(0); }
}

.lock-shake {
  animation: lock-shake 0.35s ease-in-out;
}

/* Pagy pagination styling — dark theme with teal accents */
nav.pagy {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  padding: 1rem 0;
  font-size: 0.875rem;
}

nav.pagy a,
nav.pagy span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  border-radius: 0.375rem;
  font-weight: 500;
  transition: background-color 0.15s, color 0.15s;
}

nav.pagy a {
  color: #94a3b8;
  background: #1e293b;
  border: 1px solid #334155;
  text-decoration: none;
}

nav.pagy a:hover {
  color: #4fd1c5;
  background: #2d3748;
  border-color: #4fd1c5;
}

nav.pagy a[aria-disabled="true"],
nav.pagy a.disabled {
  color: #475569;
  background: transparent;
  border-color: transparent;
  pointer-events: none;
}

nav.pagy span.current,
nav.pagy a.current {
  color: #fff;
  background: #4fd1c5;
  border: 1px solid #4fd1c5;
  font-weight: 600;
}

nav.pagy .gap {
  color: #64748b;
  border: none;
  background: none;
}

/*
 * Native <dialog> centering.
 *
 * Tailwind v4's Preflight resets `margin: 0` on the universal selector
 * (including ::backdrop), which clobbers the UA stylesheet's `margin: auto`
 * that centers a modal <dialog> opened via .showModal(). Without this rule
 * dialogs pin to the top-left of the viewport. Restoring `margin: auto` here
 * (an unlayered rule that beats Tailwind's @layer base) centers every modal
 * app-wide. See docs/DESIGN_SYSTEM.md → "Modals are always centered".
 *
 * Height defense (same root-fix philosophy): the UA caps a modal <dialog> at
 * the *large* viewport (a 100vh equivalent), so on iOS Safari a tall modal's
 * bottom — and any action button there — hides behind the dynamic toolbar and
 * is unreachable. `max-height: 100dvh` tracks the *visible* viewport and
 * `overflow-y: auto` lets long content scroll inside the dialog, so the
 * primary action is always reachable. App-wide so individual native dialogs
 * don't each have to remember. See DESIGN_SYSTEM → "Modals must fit the
 * viewport".
 */
dialog:modal {
  margin: auto;
  max-height: 100dvh;
  overflow-y: auto;
}

.turbo-progress-bar {
  height: 3px;
  background: #34d399;
  box-shadow: 0 0 14px rgba(52, 211, 153, 0.55);
}

.member-bottom-nav {
  position: fixed;
  /* No backdrop-filter: a `position: fixed` element with backdrop-filter is a
     known iOS Safari bug — it detaches / mispositions mid-page while scrolling
     (worse on pages with video/iframe compositing, e.g. the climb player). The
     nav background is already ~opaque (bg-slate-900/95), so the blur was barely
     visible; dropping it removes the glitch with effectively no visual change. */
}

.member-bottom-nav::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  height: 2px;
  width: 100%;
  background: linear-gradient(90deg, transparent, rgba(52, 211, 153, 0.9), transparent);
  opacity: 0;
  transform: translateX(-100%);
}

html[aria-busy="true"] .member-bottom-nav::before {
  opacity: 1;
  animation: member-nav-progress 1.1s ease-in-out infinite;
}

/* Hide the bottom nav whenever a <dialog> is open — modals own the screen, and
   this also kept the old backdrop-filter from bleeding over the top layer on
   Safari (filter since removed, but hiding the nav under a modal is still right). */
body:has(dialog[open]) .member-bottom-nav {
  display: none;
}

.member-tab-link {
  position: relative;
  border-radius: 0.75rem;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 120ms ease, color 120ms ease, transform 120ms ease;
}

.member-tab-link:active {
  color: #e2e8f0;
  background: rgba(51, 65, 85, 0.82);
  transform: translateY(1px);
}

.member-tab-link[data-member-navigation-loading="true"] {
  color: #34d399;
  background: rgba(16, 185, 129, 0.13);
}

.member-tab-link[data-member-navigation-loading="true"]::after {
  content: "";
  position: absolute;
  top: 0.3rem;
  left: calc(50% - 0.7rem);
  width: 1.4rem;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.9;
  animation: member-tab-pulse 900ms ease-in-out infinite;
}

@keyframes member-nav-progress {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

@keyframes member-tab-pulse {
  0%, 100% { opacity: 0.35; transform: scaleX(0.55); }
  50% { opacity: 1; transform: scaleX(1); }
}

/* Native date/time inputs: the app is dark, so without an explicit
   color-scheme the browser renders a light calendar/clock popup and a
   near-invisible indicator icon. (Pairs with the native-picker Stimulus
   controller — see docs/DESIGN_SYSTEM.md → Forms: date & time fields.) */
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
  color-scheme: dark;
}

/* One-shot "this row just appeared" flash — used when a group invite lands
   in the invitations list via Turbo Stream. Plays once and settles. */
@keyframes new-row-flash {
  0% { box-shadow: inset 0 0 0 2px rgb(16 185 129 / 0.9); background-color: rgb(16 185 129 / 0.10); }
  70% { box-shadow: inset 0 0 0 2px rgb(16 185 129 / 0.45); background-color: rgb(16 185 129 / 0.04); }
  100% { box-shadow: inset 0 0 0 2px transparent; background-color: transparent; }
}
.new-row-flash {
  animation: new-row-flash 2.5s ease-out 1;
  border-radius: 0.5rem;
}

/* Compact Tasks panel (dashboard card): trim chrome that only belongs on the
   full /tasks page. Scoped to the persistent .tasks-compact wrapper, so the
   rules survive turbo-stream re-renders of the list frame inside it. */
.tasks-compact [data-tasks-archived-link] {
  display: none;
}

/* The dashboard card is a narrow column even on a wide desktop viewport.
   Keep task copy and metadata stacked there instead of applying the shared
   viewport-based `sm:flex` row layout, which can squeeze Team Task titles to
   an ellipsis (or zero width) beside long assignee/completer names. */
.tasks-compact .task-row-main {
  display: block;
}

.tasks-compact .task-row-metadata {
  margin-top: 0.25rem;
  flex-wrap: wrap;
}

/* The dashboard detail drawer is capped at 24rem. Date and time controls are
   more usable stacked than squeezed into two undersized columns. */
.tasks-compact .task-detail-schedule-grid {
  grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 639px) {
  .task-row-description {
    display: none;
  }
}

/* Dashboard Tasks detail drawer — slides in from the right when shown (the
   animation replays each time the panel goes from display:none to flex). */
@keyframes tasks-drawer-in {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
.tasks-drawer-enter {
  animation: tasks-drawer-in 0.2s ease-out;
}

/* Full /tasks page detail drawer — same slide-in, but ONLY below lg, where the
   aside is a fixed right-side drawer. At lg+ the aside is a static in-grid pane
   (lg:block), so it must never animate or transform. The :not(.hidden) gate
   replays the slide each time the controller reveals the drawer. */
@media (max-width: 1023px) {
  .tasks-split-detail:not(.hidden) {
    animation: tasks-drawer-in 0.2s ease-out;
  }
}

@media (max-width: 767px) {
  .support-inbox-composer [data-email-composer-target="toolbar"] {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .support-inbox-composer [data-email-composer-target="toolbar"] > * {
    flex-shrink: 0;
  }

  .support-inbox-tag-form [data-controller~="select-menu"] > button,
  .support-inbox-reply-mode > button {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
  }
}

.support-inbox-composer details > summary::-webkit-details-marker {
  display: none;
}

.support-inbox-composer details > summary::marker {
  content: "";
}

/* Optimistic row exit for close/snooze from the list: slide right + fade,
   then collapse the gap. The Turbo refresh reconciles the real state. */
.support-row-leaving {
  transform: translateX(96px);
  opacity: 0;
  transition: transform 150ms ease-out, opacity 150ms ease-out;
}
.support-row-collapsing {
  max-height: 0 !important;
  overflow: hidden;
  transition: max-height 140ms ease-in;
}
@media (prefers-reduced-motion: reduce) {
  .support-row-leaving, .support-row-collapsing { transition: none; }
}
/* cache-bust: 1773941540 */

/* Per-wall grade/color spread charts. Hidden in bulk via a class on the
   persistent wrapper (not the chart nodes themselves) so charts re-rendered by
   a turbo-stream replace inherit the hidden state without any JS re-apply. */
.wall-spread-hidden .wall-spread {
  display: none;
}

/* Emerald flash on the FA claim CTA when the "First Ascent available" badge by
   the climb name is tapped (see fa_jump_controller). box-shadow ring doesn't
   affect layout; the target carries rounded-lg so the ring has clean corners. */
@keyframes fa-flash-ring {
  0%   { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
  12%  { box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.9); }
  100% { box-shadow: 0 0 0 3px rgba(16, 185, 129, 0); }
}
.fa-flash {
  animation: fa-flash-ring 1.6s ease-out;
}

/* Member app zoom lock — keep the UI pinned at 1x (see zoom_lock_controller +
   the member layout's viewport meta). iOS auto-zooms into any focused field
   whose font-size is under 16px; forcing >=16px on phones stops the view from
   zooming in when a member taps a comment box, promo code, search, etc. Desktop
   keeps its smaller sizes (this only applies at the phone breakpoint). Checkbox/
   radio/range/color have no text and are excluded so their sizing is untouched. */
@media (max-width: 767px) {
  body.member-ui input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  body.member-ui textarea,
  body.member-ui select {
    font-size: 16px;
  }
}

/* --- Spray (member-created climbs) mark-canvas + editor ------------------
   Component CSS ported from docs/specs/spray-prototype/spray-climbs-src.html.
   The class names here are contractual with hold_marker_controller.js /
   spray_zoom_controller.js (.cdot/.bdgs/.bdg/.hgrab/.h-rot/.h-wid/.zoomable/
   .sw/.count-chip). Do not rename without updating the controllers. */
.spray-wallbox { position: relative; user-select: none; -webkit-user-select: none; touch-action: none; background: #05080f; }
.spray-wallbox img { display: block; width: 100%; height: auto; pointer-events: none; }
.spray-wallbox canvas.snapov { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.spray-wallbox.zoomable { overflow: hidden; }
.zoomwrap { position: relative; width: 100%; transform-origin: 0 0; will-change: transform; }

.cdot {
  position: absolute; transform: translate(-50%,-50%); border-radius: 999px;
  cursor: pointer;
  /* border-only ellipse — no fill, so small holds stay visible inside the ring;
     border-color is set per-dot (the hold's color) by hold_marker */
  border-style: solid; border-width: 2.5px; background: transparent;
}
/* Selected: single ring — the offset outline only; the element's own border
   goes transparent (inline border-color would win, hence !important). */
.cdot[data-selected="true"] { border-color: transparent !important; outline-width: 2.5px; outline-style: solid; outline-offset: 1.5px; }
.cdot .bdgs {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  display: flex; gap: 2px; pointer-events: none;
}
.cdot .bdg {
  width: 14px; height: 14px; border-radius: 999px; font-size: 8px; font-weight: 900;
  line-height: 14px; text-align: center; box-shadow: 0 0 0 1px rgba(2,6,23,.55); flex: none;
}
.cdot .hgrab {
  position: absolute; width: 30px; height: 30px; border-radius: 999px; display: none;
  align-items: center; justify-content: center; cursor: grab;
  background: rgba(241,245,249,.92); color: #0b1020; font-size: 14px; font-weight: 800;
  box-shadow: 0 2px 8px rgba(0,0,0,.5); touch-action: none;
}
.cdot[data-selected="true"] .hgrab { display: flex; }
.cdot .h-rot { top: 50%; left: calc(100% + 8px); transform: translateY(-50%); }
.cdot .h-rot::before { content: ""; position: absolute; right: 100%; width: 8px; height: 2px; background: rgba(241,245,249,.7); }
.cdot .h-wid { left: 50%; top: -8px; transform: translate(-50%,-100%); }
.cdot .h-wid::before { content: ""; position: absolute; top: 100%; left: 50%; width: 2px; height: 8px; background: rgba(241,245,249,.7); }

.spray-dot-editor { background: #0d1526; border: 1px solid #24365a; border-radius: 16px; padding: 12px 14px; }
.spray-dot-editor .ehint { font-size: 11px; color: #5d6d89; text-align: center; padding: 6px 0; display: none; }
.spray-dot-editor[data-empty="true"] .ehint { display: block; }
.spray-dot-editor[data-empty="true"] .econtent { display: none; }
.spray-dot-editor .swatches { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 10px; }
.spray-dot-editor .sw { width: 26px; height: 26px; border-radius: 999px; cursor: pointer; border: 2px solid transparent; padding: 0; }
.spray-dot-editor .sw[data-active="true"] { border-color: #f1f5f9; box-shadow: 0 0 0 2px rgba(241,245,249,.3); }
.spray-dot-editor .erow { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.spray-dot-editor label { font-size: 9.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #5d6d89; width: 46px; flex: none; }
.spray-dot-editor input[type=range] { flex: 1; accent-color: #34d399; }
.spray-dot-editor .roles { display: flex; gap: 6px; flex: 1; }
.spray-dot-editor .roles button {
  flex: 1; border-radius: 8px; border: 1px solid #1e293b; background: rgba(15,23,42,.6);
  color: #94a3b8; font-size: 10px; font-weight: 800; padding: 6px 0; cursor: pointer;
}
.spray-dot-editor .roles button[data-active="true"] { border-color: rgba(52,211,153,.55); background: rgba(52,211,153,.13); color: #6ee7b7; }
.spray-dot-editor .del { background: rgba(251,113,133,.12); color: #fda4af; border: 1px solid rgba(251,113,133,.35); border-radius: 9px; padding: 8px 0; font-size: 11.5px; font-weight: 800; cursor: pointer; width: 100%; }

.spray-counts { display: flex; gap: 8px; flex-wrap: wrap; }
.count-chip { font-size: 10.5px; font-weight: 800; border-radius: 999px; padding: 4px 10px; border: 1px solid #1e293b; color: #94a3b8; }
.count-chip b { color: #f1f5f9; }
.count-chip.bad { border-color: rgba(251,113,133,.4); color: #fda4af; }
.count-chip.ok { border-color: rgba(52,211,153,.4); color: #6ee7b7; }
.spray-tool { border: 1px solid #1e293b; background: rgba(15,23,42,.6); color: #94a3b8; border-radius: 10px; padding: 7px 12px; font-size: 11.5px; font-weight: 700; cursor: pointer; }
.spray-tool[data-active="true"] { border-color: rgba(56,189,248,.55); background: rgba(56,189,248,.12); color: #7dd3fc; }

/* browse row thumbnail mini colored dots */
.spray-mini-dot { position: absolute; width: 8px; height: 8px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.75); transform: translate(-50%,-50%); }
