/* ==========================================================================
   ARIES SOCIAL CLUB — "Gilded Hour" (Postcard Invites & Fixed Altar Button)
   ========================================================================== */

:root {
  --blush:        #e8a89a;
  --blush-deep:   #d98a86;
  --rose:         #b5464f;
  --terracotta:   #c97b5f;
  --parchment:    #f4e9d1;
  --parchment-dk: #e8d8b3;

  --ink:          #2b1f17;
  --ink-soft:     #5a4436;
  --ink-faint:    #8a6f5c;

  --gold:         #b8892f;
  --gold-light:   #d4af37;
  --palm:         #536b45;

  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-label:   "Cinzel", Georgia, serif;
  --font-body:    "EB Garamond", Georgia, serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--parchment);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1.05rem;
  line-height: 1.65;
  overflow-x: hidden;
}

/* Cursor themes — off by default (system arrow) until the visitor picks one
   from the cursor-toggle widget. Choice is remembered via localStorage. */
body.cursor-star, body.cursor-star a, body.cursor-star button, body.cursor-star input,
body.cursor-star label, body.cursor-star [role="button"] {
  cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2732%27%20height%3D%2732%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M16%203%20C17%209%2019%2013%2025%2016%20C19%2019%2017%2023%2016%2029%20C15%2023%2013%2019%207%2016%20C13%2013%2015%209%2016%203%20Z%27%20fill%3D%27%23b8892f%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%270.5%27%2F%3E%3C%2Fsvg%3E") 16 16, auto;
}
body.cursor-candle, body.cursor-candle a, body.cursor-candle button, body.cursor-candle input,
body.cursor-candle label, body.cursor-candle [role="button"] {
  cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2732%27%20height%3D%2732%27%20viewBox%3D%270%200%2032%2032%27%3E%3Crect%20x%3D%2713%27%20y%3D%2715%27%20width%3D%276%27%20height%3D%2713%27%20rx%3D%271%27%20fill%3D%27none%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%271.8%27%2F%3E%3Cpath%20d%3D%27M16%204.5%20C13.3%208.5%2013.3%2011.2%2016%2013.4%20C18.7%2011.2%2018.7%208.5%2016%204.5%20Z%27%20fill%3D%27%23b8892f%27%2F%3E%3Cline%20x1%3D%2711%27%20y1%3D%2728%27%20x2%3D%2721%27%20y2%3D%2728%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E") 16 16, auto;
}
body.cursor-skillet, body.cursor-skillet a, body.cursor-skillet button, body.cursor-skillet input,
body.cursor-skillet label, body.cursor-skillet [role="button"] {
  cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2732%27%20height%3D%2732%27%20viewBox%3D%270%200%2032%2032%27%3E%3Ccircle%20cx%3D%2716%27%20cy%3D%2717%27%20r%3D%278%27%20fill%3D%27none%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%272%27%2F%3E%3Cline%20x1%3D%2710.3%27%20y1%3D%2722.7%27%20x2%3D%273%27%20y2%3D%2729%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%2F%3E%3Ccircle%20cx%3D%2716%27%20cy%3D%2717%27%20r%3D%272.3%27%20fill%3D%27%23b8892f%27%2F%3E%3C%2Fsvg%3E") 16 16, auto;
}
body.cursor-teabag, body.cursor-teabag a, body.cursor-teabag button, body.cursor-teabag input,
body.cursor-teabag label, body.cursor-teabag [role="button"] {
  cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2732%27%20height%3D%2732%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cline%20x1%3D%2716%27%20y1%3D%274%27%20x2%3D%2716%27%20y2%3D%2711%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%271.6%27%2F%3E%3Crect%20x%3D%2711%27%20y%3D%274%27%20width%3D%2710%27%20height%3D%276%27%20rx%3D%271%27%20fill%3D%27none%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%271.6%27%2F%3E%3Cpath%20d%3D%27M9%2012%20L23%2012%20L20%2027%20L12%2027%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%271.8%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cline%20x1%3D%2712.5%27%20y1%3D%2717%27%20x2%3D%2719.5%27%20y2%3D%2717%27%20stroke%3D%27%23b8892f%27%20stroke-width%3D%271.2%27%2F%3E%3C%2Fsvg%3E") 16 16, auto;
}
body.cursor-catpaw, body.cursor-catpaw a, body.cursor-catpaw button, body.cursor-catpaw input,
body.cursor-catpaw label, body.cursor-catpaw [role="button"] {
  cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2732%27%20height%3D%2732%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cellipse%20cx%3D%2716%27%20cy%3D%2721%27%20rx%3D%278%27%20ry%3D%276.5%27%20fill%3D%27%23b8892f%27%2F%3E%3Cellipse%20cx%3D%277.5%27%20cy%3D%2711%27%20rx%3D%273%27%20ry%3D%274%27%20fill%3D%27%23b8892f%27%2F%3E%3Cellipse%20cx%3D%2714.5%27%20cy%3D%277.5%27%20rx%3D%273%27%20ry%3D%274%27%20fill%3D%27%23b8892f%27%2F%3E%3Cellipse%20cx%3D%2721.5%27%20cy%3D%277.5%27%20rx%3D%273%27%20ry%3D%274%27%20fill%3D%27%23b8892f%27%2F%3E%3Cellipse%20cx%3D%2727.5%27%20cy%3D%2711.5%27%20rx%3D%273%27%20ry%3D%274%27%20fill%3D%27%23b8892f%27%2F%3E%3C%2Fsvg%3E") 16 16, auto;
}

.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
img, svg { display: block; max-width: 100%; }

/* Shared */
.kicker { font-family: var(--font-label); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); margin-bottom: 1rem; }
.kicker.centered { text-align: center; }

.card-frame {
  position: relative;
  background: var(--parchment);
  border: 1px solid var(--gold);
  padding: 3rem 2.5rem 2.8rem;
}
.card-frame::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(184, 137, 47, 0.45);
  pointer-events: none;
}
.sun-mark { width: 46px; height: 46px; color: var(--gold); margin: 0 auto 1.4rem; }
.sun-mark--small { width: 36px; height: 36px; }

/* Scroll Reveal Classes */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal.active { opacity: 1; transform: translateY(0); }

/* Ambient Audio Player (Bottom Left) */
.ambient-player {
  position: fixed;
  bottom: 2rem;
  left: 2rem;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 0.8rem;
  background: var(--parchment);
  border: 1px solid var(--gold);
  padding: 0.6rem 1rem;
  border-radius: 50px;
  box-shadow: 0 10px 20px rgba(43, 31, 23, 0.1);
  animation: fadeInUp 1s ease forwards;
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.audio-btn {
  background: transparent;
  border: none;
  color: var(--rose);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.audio-label {
  background: transparent;
  border: none;
  font-family: var(--font-label);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  color: var(--ink);
  text-transform: uppercase;
  cursor: pointer;
  padding: 0;
  border-bottom: 1px dotted var(--ink-faint);
  transition: color 0.2s ease, border-color 0.2s ease;
}
.audio-label:hover, .audio-label:focus-visible {
  color: var(--rose);
  border-bottom-color: var(--rose);
}
.audio-hide-btn {
  background: transparent;
  border: none;
  color: var(--ink-faint);
  font-size: 1.1rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 0 0 0.3rem;
  transition: color 0.2s ease;
}
.audio-hide-btn:hover, .audio-hide-btn:focus-visible { color: var(--rose); }

.audio-reopen-btn {
  position: fixed;
  bottom: 2rem;
  left: 2rem;
  z-index: 100;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--parchment);
  border: 1px solid var(--gold);
  color: var(--rose);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(43, 31, 23, 0.15);
}
.audio-reopen-btn[hidden] { display: none; }

/* Cursor Toggle (Bottom Right) */
.cursor-toggle {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 0.7rem;
  background: var(--parchment);
  border: 1px solid var(--gold);
  padding: 0.6rem 1rem;
  border-radius: 50px;
  box-shadow: 0 10px 20px rgba(43, 31, 23, 0.1);
  animation: fadeInUp 1s ease forwards;
}
.cursor-toggle-btn {
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  color: var(--rose);
}
.cursor-toggle-icon svg { width: 20px; height: 20px; display: block; }
.cursor-toggle-label {
  font-family: var(--font-label);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  color: var(--ink);
  text-transform: uppercase;
}

/* Altar Floating Button (Middle Right) */
.altar-btn {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 999;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  background: var(--ink);
  border: 1px solid var(--gold);
  border-right: none;
  padding: 0.8rem 1.2rem 0.8rem 0.8rem;
  border-radius: 50px 0 0 50px;
  color: var(--gold);
  text-decoration: none;
  box-shadow: -4px 4px 15px rgba(43, 31, 23, 0.2);
  transition: background 0.3s ease, color 0.3s ease, padding 0.3s ease, transform 0.3s ease;
  animation: fadeInRight 1s ease forwards;
}
@keyframes fadeInRight {
  from { opacity: 0; transform: translate(20px, -50%); }
  to { opacity: 1; transform: translate(0, -50%); }
}
.altar-btn:hover { 
  background: var(--rose); 
  color: var(--parchment); 
  border-color: var(--rose);
  padding-right: 1.5rem; /* Slide out slightly on hover */
}
.altar-btn svg { width: 28px; height: 28px; }
.altar-btn-label { font-family: var(--font-label); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; }

/* POSTCARD MODAL STYLES */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(43, 31, 23, 0.8);
  backdrop-filter: blur(5px);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
}
.modal-overlay.visible {
  opacity: 1;
  pointer-events: auto;
}

.postcard-modal {
  background: var(--parchment);
  width: 90%;
  max-width: 750px;
  border: 1px solid var(--gold);
  padding: 12px;
  position: relative;
  transform: translateY(40px) rotate(-0.4deg);
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4);
}
.postcard-modal::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(184, 137, 47, 0.35);
  pointer-events: none;
}
.modal-overlay.visible .postcard-modal {
  transform: translateY(0) rotate(-0.4deg);
}

.close-modal {
  position: absolute;
  top: 20px;
  right: 20px;
  background: transparent;
  border: none;
  font-size: 1.8rem;
  color: var(--ink);
  cursor: pointer;
  z-index: 10;
  transition: color 0.2s ease;
}
.close-modal:hover { color: var(--rose); }

.postcard-inner {
  border: 1px solid rgba(184, 137, 47, 0.4);
  display: flex;
  width: 100%;
}

.postcard-left {
  flex: 1;
  border-right: none;
  padding: 2.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}
.postcard-left::after {
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  right: -1px;
  width: 1px;
  background-image: radial-gradient(circle, var(--gold) 1.2px, transparent 1.3px);
  background-size: 1px 12px;
  background-repeat: repeat-y;
  opacity: 0.7;
}
.stamp-container {
  position: relative;
  align-self: flex-end;
  border: 1px dashed var(--gold);
  padding: 10px;
}
.stamp-container .sun-mark { margin: 0; width: 30px; height: 30px; }
.postmark {
  position: absolute;
  width: 66px;
  height: 66px;
  top: 50%;
  right: 100%;
  transform: translateY(-50%) rotate(-14deg);
  color: var(--ink);
  opacity: 0.32;
  mix-blend-mode: multiply;
  pointer-events: none;
}

/* "Thanks for Attending" overlay — hidden by default, shown when the
   modal has the .is-past class (toggled in js/script.js based on the
   triggering button's data-past="true" attribute). Covers the whole
   left panel so it reads like a stamp over the postcard. */
.past-stamp {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 5;
  align-items: center;
  justify-content: center;
  background: rgba(244, 233, 209, 0.9);
}
.postcard-modal.is-past .past-stamp { display: flex; }
.past-stamp-mark {
  border: 3px double var(--rose);
  border-radius: 6px;
  padding: 1.1rem 1.4rem;
  transform: rotate(-9deg);
  color: var(--rose);
  font-family: var(--font-label);
  font-size: 0.85rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.7;
  opacity: 0.9;
  mix-blend-mode: multiply;
}
.past-note {
  color: var(--ink-soft);
  font-style: italic;
  font-size: 0.92rem;
  margin-top: 0.5rem;
}
.postcard-lines {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 3rem;
  opacity: 0.4;
}
.postcard-lines span {
  width: 100%;
  height: 1px;
  background: var(--gold);
}
.postcard-vertical-text {
  position: absolute;
  left: 15px;
  bottom: 2.5rem;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--font-label);
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  color: var(--ink-faint);
  text-transform: uppercase;
}

.postcard-right {
  flex: 1.2;
  padding: 3rem 2.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.postcard-right input {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1.5px solid var(--ink-faint);
  padding: 0.6rem 0.2rem;
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1rem;
}
.postcard-right input:focus { outline: none; border-bottom-color: var(--rose); }

/* Animations */
@keyframes spinSlow { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes floatArch { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }
.spin { animation: spinSlow 24s linear infinite; }

/* Hero */
.hero { position: relative; min-height: 78vh; display: flex; align-items: center; justify-content: center; overflow: hidden; background: linear-gradient(180deg, var(--blush) 0%, var(--blush-deep) 55%, var(--terracotta) 100%); padding: 3rem 1.5rem; }
.hero { align-items: safe center; }
.hero::before { content: ""; position: absolute; top: -10%; left: 50%; transform: translateX(-50%); width: 900px; height: 900px; background: radial-gradient(circle, rgba(255, 240, 210, 0.45) 0%, rgba(255, 240, 210, 0) 60%); pointer-events: none; }
.hero-arches { position: absolute; inset: 0; display: flex; align-items: flex-end; justify-content: center; }
.arch { position: absolute; bottom: 0; border: 2px solid rgba(43, 31, 23, 0.14); border-bottom: none; background: rgba(255, 255, 255, 0.03); }
.arch--1 { width: 260px; height: 380px; border-radius: 130px 130px 0 0; animation: floatArch 6s ease-in-out infinite; }
.arch--2 { width: 460px; height: 500px; border-radius: 230px 230px 0 0; opacity: 0.75; animation: floatArch 8s ease-in-out infinite reverse; }
.arch--3 { width: 680px; height: 600px; border-radius: 340px 340px 0 0; opacity: 0.5; animation: floatArch 10s ease-in-out infinite; }

/* Aries constellation — sits above the arches, below the hero copy */
.constellation {
  position: absolute;
  top: 6%;
  left: 50%;
  transform: translateX(-50%);
  width: min(60vw, 320px);
  height: min(60vw, 320px);
  color: var(--ink);
  opacity: 0.4;
  z-index: 0;
  pointer-events: none;
}
@keyframes twinkle {
  0%, 100% { opacity: 0.35; transform: scale(0.85); }
  50% { opacity: 1; transform: scale(1); }
}
.c-star { transform-origin: center; animation: twinkle 3.4s ease-in-out infinite; }
.c-dot { animation-duration: 2.6s; }
.c-sparkle { animation-duration: 4s; }
.hero-content { position: relative; z-index: 1; text-align: center; color: var(--ink); }
.eyebrow { font-family: var(--font-label); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 1.4rem; }
.brand-title { font-family: var(--font-display); font-style: italic; font-weight: 600; font-size: clamp(2.8rem, 8vw, 4.6rem); line-height: 1; color: var(--ink); }
.location-tag { margin-top: 1rem; font-family: var(--font-label); font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-soft); }

/* Manifesto & Ethos */
.manifesto-section { max-width: 700px; margin: 5.5rem auto 0; padding: 0 1.5rem; }
.manifesto h2 { font-family: var(--font-display); font-style: italic; font-weight: 600; font-size: clamp(1.7rem, 4vw, 2.3rem); color: var(--rose); margin-bottom: 1.2rem; max-width: 20ch; }
.manifesto p { color: var(--ink-soft); max-width: 56ch; }
.manifesto-sign { margin-top: 1.5rem; font-family: var(--font-label); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
.ethos-section { max-width: 800px; margin: 4rem auto 0; padding: 0 1.5rem; }
.ethos-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 2.5rem; }
.ethos-item { position: relative; padding-top: 2.5rem; border-top: 1px solid rgba(184, 137, 47, 0.3); }
.ethos-num { position: absolute; top: -14px; left: 0; background: var(--parchment); padding-right: 10px; font-family: var(--font-label); color: var(--rose); font-size: 1.2rem; }
.ethos-item h4 { font-family: var(--font-display); font-style: italic; font-size: 1.4rem; color: var(--ink); margin-bottom: 0.5rem; }
.ethos-item p { font-size: 0.95rem; color: var(--ink-soft); }

/* Shell Divider */
.shell-divider { display: flex; align-items: center; justify-content: center; gap: 1.4rem; max-width: 420px; margin: 4.5rem auto; padding: 0 1.5rem; color: var(--gold); }
.divider-line { flex: 1; height: 1px; background: var(--gold); opacity: 0.5; }
.shell { width: 16px; height: 24px; flex-shrink: 0; }

/* Events */
.events-section { max-width: 1080px; margin: 0 auto; padding: 0 1.5rem; text-align: center; }
.section-title { font-family: var(--font-display); font-style: italic; font-weight: 600; font-size: clamp(1.8rem, 4vw, 2.4rem); color: var(--rose); margin-bottom: 3.5rem; }
.events-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 2.5rem; text-align: left; }
.events-loading {
  grid-column: 1 / -1;
  text-align: center;
  font-family: var(--font-label);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-faint);
  padding: 2rem 0;
}

.tarot-card {
  position: relative; background: var(--parchment); border: 1px solid var(--gold); padding: 2.2rem 1.8rem 2rem; display: flex; flex-direction: column;
  transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.5s ease; overflow: hidden;
}
.tarot-card::before { content: ""; position: absolute; inset: 7px; border: 1px solid rgba(184, 137, 47, 0.4); pointer-events: none; z-index: 2; }
.tarot-card::after {
  content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: linear-gradient(45deg, transparent 45%, rgba(255, 255, 255, 0.3) 50%, transparent 55%);
  transform: rotate(30deg) translateY(-100%); transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1); pointer-events: none; z-index: 10;
}
.events-grid .tarot-card:hover { transform: translateY(-12px); box-shadow: 0 20px 40px rgba(184, 137, 47, 0.15); }
.events-grid .tarot-card:hover::after { transform: rotate(30deg) translateY(100%); }

.numeral { position: absolute; top: 14px; left: 18px; font-family: var(--font-label); font-size: 0.75rem; color: var(--gold); letter-spacing: 0.08em; z-index: 3; }
.illustration { width: 100px; height: 100px; margin: 0.4rem auto 1.4rem; border-radius: 50% 50% 0 0 / 60% 60% 0 0; border: 1.5px solid var(--gold); border-bottom: none; display: flex; align-items: center; justify-content: center; padding-top: 0.6rem; z-index: 3; position: relative; }
.illustration svg { width: 56px; height: 56px; color: var(--gold); }
.illustration--dinner { background: linear-gradient(180deg, #f0dcc0, var(--parchment)); }
.illustration--park    { background: linear-gradient(180deg, #dfe4c8, var(--parchment)); }
.illustration--craft   { background: linear-gradient(180deg, #e6d3e0, var(--parchment)); }
.card-label { font-family: var(--font-label); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); text-align: center; margin-bottom: 0.3rem; z-index: 3; position: relative; }
.card-title { font-family: var(--font-display); font-style: italic; font-weight: 600; font-size: 1.5rem; color: var(--rose); text-align: center; margin-bottom: 0.9rem; z-index: 3; position: relative; }
.card-meta { font-family: var(--font-label); font-size: 0.66rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-faint); text-align: center; margin-bottom: 1.1rem; z-index: 3; position: relative; }
.card-meta .dot { color: var(--gold); margin: 0 0.2rem; }
.card-desc { color: var(--ink-soft); font-size: 0.95rem; text-align: center; margin-bottom: 1.6rem; flex-grow: 1; z-index: 3; position: relative; }
.rsvp-pill { background: transparent; cursor: pointer; display: block; width: 100%; text-align: center; text-decoration: none; border: 1.5px solid var(--rose); color: var(--rose); font-family: var(--font-label); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.7rem 1rem; border-radius: 999px; transition: background-color 0.2s ease, color 0.2s ease; z-index: 3; position: relative; }
.rsvp-pill:hover, .rsvp-pill:focus-visible { background: var(--rose); color: var(--parchment); }

/* Signup */
.signup-section { max-width: 560px; margin: 0 auto; padding: 0 1.5rem 5rem; text-align: center; }
.signup-box h2 { font-family: var(--font-display); font-style: italic; font-weight: 600; font-size: clamp(1.7rem, 4vw, 2.2rem); color: var(--rose); margin-bottom: 0.8rem; }
.signup-copy { color: var(--ink-soft); max-width: 40ch; margin: 0 auto 1.8rem; }
.signup-form { display: flex; flex-direction: column; gap: 0.9rem; align-items: stretch; }
.signup-form input { width: 100%; background: transparent; border: none; border-bottom: 1.5px solid var(--ink-faint); padding: 0.6rem 0.2rem; color: var(--ink); font-family: var(--font-body); font-size: 1rem; }
.signup-form input::placeholder { color: var(--ink-faint); }
.signup-form input:focus { outline: none; border-bottom-color: var(--rose); }
.join-btn { align-self: center; margin-top: 0.4rem; background: var(--rose); color: var(--parchment); border: none; font-family: var(--font-label); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.7rem 1.6rem; border-radius: 999px; cursor: pointer; transition: background-color 0.2s ease; }
.join-btn:hover, .join-btn:focus-visible { background: var(--gold); }
.form-note { min-height: 1.2rem; margin-top: 1rem; font-family: var(--font-label); font-size: 0.7rem; letter-spacing: 0.05em; color: var(--gold); }
.donate-btn {
  display: inline-block;
  margin-top: 2.5rem;
  text-decoration: none;
  border: 1.5px solid var(--gold);
  color: var(--gold);
  font-family: var(--font-label);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.7rem 1.8rem;
  border-radius: 999px;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.donate-btn:hover, .donate-btn:focus-visible {
  background: var(--gold);
  color: var(--parchment);
}
.footer-signoff { margin-top: 1.5rem; font-family: var(--font-label); font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-faint); opacity: 0.8; }

/* Tarot Pull page */
.altar-body {
  background: var(--ink);
  color: var(--parchment);
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 1.25rem 1.5rem;
}
/* Progressive enhancement: browsers that support the `safe` keyword will
   fall back to start-alignment instead of clipping when the content is
   taller than the viewport. This is the actual fix for the card being
   unreachable — flex centering `overflow: hidden` content clips it
   equally off both the top and bottom with no way to scroll to it. The
   plain `center` above stays in effect as the fallback for any browser
   that doesn't understand `safe center` (an unsupported value is ignored,
   not applied, so the working declaration above is never overwritten). */
.altar-body {
  align-items: safe center;
}
@keyframes flicker { 0% { opacity: 0.7; transform: translate(-50%, -50%) scale(0.98); } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1.02); } }
.altar-glow { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 70vw; height: 70vw; background: radial-gradient(circle, rgba(212, 175, 55, 0.12) 0%, transparent 60%); pointer-events: none; animation: flicker 4s ease-in-out infinite alternate; z-index: 0; }
.back-link { position: absolute; top: 2rem; left: 2rem; font-family: var(--font-label); font-size: 0.75rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold); text-decoration: none; transition: color 0.3s ease; z-index: 10; }
.back-link:hover { color: var(--parchment); }
.altar-content { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; max-width: 500px; width: 100%; }
.altar-title { font-family: var(--font-display); font-size: 2rem; font-style: italic; color: var(--gold); margin-bottom: 0.3rem; text-align: center; }
@keyframes gentlePulse { 0% { opacity: 0.5; } 100% { opacity: 0.9; } }
.altar-prompt { font-size: 0.95rem; color: var(--parchment-dk); text-align: center; margin-bottom: 1rem; font-style: italic; animation: gentlePulse 3s ease-in-out infinite alternate; }
/* No min-height here on purpose — a min-height fights the vh-based cap
   below on any short window (anything under ~620px tall with the old
   260px floor), forcing the card taller than the available space and
   bringing back the exact scroll problem this is meant to prevent. A
   smaller card is the correct trade-off over an unreachable one. */
.flip-card-wrapper { perspective: 1000px; width: min(240px, 62vw); height: min(230px, 34vh); cursor: pointer; }
.flip-card-inner { position: relative; width: 100%; height: 100%; transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); transform-style: preserve-3d; }
.flip-card-wrapper.flipped .flip-card-inner { transform: rotateY(180deg); }
.flip-card-front, .flip-card-back { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; display: flex; align-items: center; justify-content: center; }
.flip-card-back { transform: rotateY(180deg); }
.facedown-design { display: flex; flex-direction: column; align-items: center; color: var(--gold); }
.facedown-design p { font-family: var(--font-label); font-size: 0.8rem; letter-spacing: 0.15em; margin-top: 1rem; text-transform: uppercase; }

/* Arcana card faces (Tarot Pull) — intentionally NOT `.tarot-card`.
   That class carries a hover-lift + shine-sweep meant for the homepage
   grid; sharing it here caused the flip card to visually "keep turning"
   whenever the cursor rested near its edge (the lift shifted the card
   out from under the pointer, re-triggering the hover, re-triggering
   the lift — an endless hover/shine loop). This card gets its own,
   calmer treatment. */
.arcana-card {
  position: relative;
  width: 100%;
  height: 100%;
  background: var(--parchment);
  border: 1px solid var(--gold);
  padding: 1.1rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
}
.arcana-card::before {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(184, 137, 47, 0.4);
  pointer-events: none;
}
.arcana-face-content { display: flex; flex-direction: column; align-items: center; }
.arcana-face-content .card-title { margin-top: 0.6rem; margin-bottom: 0.4rem; }
.arcana-face-content .card-label { margin-bottom: 0.9rem; }
.arcana-face-content .card-desc { font-size: 0.88rem; margin-bottom: 0; }
.altar-hint {
  margin-top: 0.75rem;
  font-family: var(--font-label);
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--parchment-dk);
  opacity: 0.7;
  text-align: center;
}

@media (max-width: 768px) {
  .postcard-inner { flex-direction: column; }
  .postcard-left { border-right: none; border-bottom: 1px solid rgba(184, 137, 47, 0.3); padding: 1.5rem; flex-direction: row; align-items: center; }
  .postcard-lines { display: none; }
  .postcard-vertical-text { position: static; writing-mode: horizontal-tb; transform: none; margin-left: 1rem; }
  .postcard-right { padding: 1.5rem; }
}

@media (max-width: 640px) {
  .hero { min-height: 60vh; padding: 2.5rem 1.2rem; }
  .arch--3, .arch--2 { display: none; }
  .arch--1 { width: 220px; height: 300px; border-radius: 110px 110px 0 0; }
  .constellation { width: 55vw; height: 55vw; top: 4%; opacity: 0.3; }
  .card-frame { padding: 2.2rem 1.5rem 2rem; }
  .signup-form { gap: 0.8rem; }
  
  /* Mobile Adjustments for fixed buttons */
  .ambient-player { bottom: 1rem; left: 1rem; padding: 0.5rem; }
  .audio-label { font-size: 0.58rem; max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .audio-reopen-btn { bottom: 1rem; left: 1rem; }

  .cursor-toggle { bottom: 1rem; right: 1rem; padding: 0.5rem; }
  .cursor-toggle-label { display: none; }

  .altar-btn { 
    top: auto; 
    bottom: 5rem; 
    right: 0; 
    transform: none; 
    padding: 0.5rem; 
    border-radius: 50px 0 0 50px; 
    animation: none; 
  }
  .altar-btn:hover { padding-right: 1rem; transform: none; }
  .altar-btn-label { display: none; }
}

/* Respect reduced-motion preferences: keep every state change, drop the animation */
@media (prefers-reduced-motion: reduce) {
  .reveal { transition: none; }
  .spin, .arch--1, .arch--2, .arch--3, .altar-glow, .altar-prompt, .ambient-player, .altar-btn, .c-star, .cursor-toggle {
    animation: none !important;
  }
  .tarot-card, .tarot-card::after, .events-grid .tarot-card:hover,
  .flip-card-inner, .altar-btn, .rsvp-pill, .join-btn, .modal-overlay, .postcard-modal {
    transition: none !important;
  }
}

/* ========================================================================== 
   V2 — DIGITAL CLUBHOUSE
   ========================================================================== */
:root { --nav-h: 68px; }
body { padding-top: var(--nav-h); }
body[data-page="home"] { padding-top: 0; }
.house-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 900; height: var(--nav-h); display:flex; align-items:center; justify-content:space-between; padding:0 2rem; background:rgba(244,233,209,.92); border-bottom:1px solid rgba(184,137,47,.38); backdrop-filter:blur(14px); }
body[data-page="home"] .house-nav { background:rgba(232,168,154,.82); }
.house-mark { font-family:var(--font-label); letter-spacing:.16em; text-decoration:none; font-size:.78rem; }
.house-links { display:flex; gap:1.5rem; align-items:center; }
.house-links a { font-family:var(--font-label); font-size:.67rem; letter-spacing:.12em; text-transform:uppercase; text-decoration:none; color:var(--ink-soft); border-bottom:1px solid transparent; }
.house-links a:hover,.house-links a.active { color:var(--rose); border-bottom-color:var(--rose); }
.hero { min-height: 86vh; }
.constellation-text { position:absolute; top:12%; left:50%; transform:translateX(-50%); font-size:clamp(1.4rem,4vw,2.5rem); letter-spacing:1.4rem; opacity:.28; white-space:nowrap; }
.text-sun { display:flex; align-items:center; justify-content:center; font-size:2.2rem; color:var(--gold); line-height:1; }
.hero-whisper { display:inline-block; margin-top:2rem; font-style:italic; color:var(--ink-soft); text-decoration:none; border-bottom:1px dotted rgba(43,31,23,.45); }
.portal-strip { max-width:1080px; margin:5rem auto; padding:0 1.5rem; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(184,137,47,.45); border:1px solid rgba(184,137,47,.45); }
.portal-strip a { background:var(--parchment); padding:2.2rem 1.8rem; text-decoration:none; display:flex; flex-direction:column; min-height:180px; transition:.3s ease; }
.portal-strip a:hover { background:#efe0bf; transform:translateY(-4px); }
.portal-strip span { font-family:var(--font-label); color:var(--gold); font-size:.68rem; letter-spacing:.1em; }
.portal-strip strong { font-family:var(--font-display); font-style:italic; font-size:1.8rem; margin:auto 0 .3rem; font-weight:600; }
.portal-strip em { color:var(--ink-soft); font-size:.95rem; }
.section-intro { max-width:600px; margin:-2rem auto 3rem; color:var(--ink-soft); font-style:italic; }
.house-rules-preview { max-width:900px; margin:6rem auto 0; padding:0 1.5rem; text-align:center; }
.house-rules-preview .ethos-grid { text-align:left; }
.consent-key { display:flex; justify-content:center; flex-wrap:wrap; gap:.8rem; margin:2.5rem auto 1rem; }
.consent-key span { border:1px solid rgba(184,137,47,.5); border-radius:999px; padding:.5rem .85rem; font-family:var(--font-label); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; }
.consent-key b { color:var(--rose); margin-right:.25rem; font-size:1rem; }
.text-link { display:inline-block; margin-top:1rem; color:var(--rose); font-style:italic; }
.invitation-symbol { font-family:var(--font-display); font-size:6rem; color:var(--rose); opacity:.7; text-align:center; margin:auto; }
.facts-kicker, .rsvp-kicker { margin-top: 1.4rem; margin-bottom: 0.6rem; }
.invitation-facts { margin: 0 0 0.4rem; background: rgba(184,137,47,.07); border-top:1px solid rgba(184,137,47,.35); border-bottom:1px solid rgba(184,137,47,.35); }
.invitation-facts div { display:grid; grid-template-columns:95px 1fr; gap:1rem; padding:.55rem .6rem; border-bottom:1px solid rgba(184,137,47,.18); }
.invitation-facts div:last-child { border-bottom: none; }
.invitation-facts dt { font-family:var(--font-label); text-transform:uppercase; letter-spacing:.08em; font-size:.6rem; color:var(--gold); }
.invitation-facts dd { color:var(--ink-soft); font-size:.92rem; }
.invitation-note { font-style:italic; color:var(--rose); margin:.8rem 0; font-size:.92rem; }
.modal-submit { width:100%; margin-top:1rem; }

.page-hero { padding:7rem 1.5rem 5rem; text-align:center; background:linear-gradient(180deg,var(--blush),var(--terracotta)); border-bottom:1px solid rgba(43,31,23,.12); }
.page-hero h1 { font-family:var(--font-display); font-style:italic; font-size:clamp(3.1rem,8vw,6rem); line-height:.9; color:var(--ink); }
.page-hero > p:last-child { max-width:620px; margin:1.3rem auto 0; color:var(--ink-soft); font-size:1.15rem; }
.page-main { max-width:1100px; margin:0 auto; padding:5rem 1.5rem 7rem; }
.site-footer { border-top:1px solid rgba(184,137,47,.35); min-height:100px; padding:2rem; display:flex; justify-content:space-between; align-items:center; font-family:var(--font-label); font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; }
.site-footer a { color:var(--rose); }

.archive-feature { display:grid; grid-template-columns:minmax(280px,.8fr) 1fr; gap:5rem; align-items:center; }
.archive-polaroid { background:#f8efd9; padding:1rem 1rem 2rem; border:1px solid rgba(43,31,23,.18); transform:rotate(-2deg); box-shadow:0 20px 40px rgba(43,31,23,.12); }
.photo-placeholder { aspect-ratio:4/3; background:linear-gradient(145deg,var(--rose),var(--terracotta)); color:var(--parchment); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:2rem; font-style:italic; }
.photo-placeholder small { margin-top:.5rem; opacity:.7; font-family:monospace; font-size:.65rem; }
.archive-polaroid > p { margin-top:1rem; font-family:var(--font-label); font-size:.6rem; letter-spacing:.14em; text-align:center; }
.archive-copy h2,.archive-note h2,.guestbook-form-wrap h2,.founder-letter h2 { font-family:var(--font-display); font-style:italic; color:var(--rose); font-size:clamp(2rem,4vw,3rem); line-height:1; margin-bottom:1rem; }
.archive-tags { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:1.5rem; }
.archive-tags span { border:1px solid var(--gold); padding:.35rem .65rem; font-size:.78rem; color:var(--ink-soft); }
.archive-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin:6rem 0; }
.memory-card { border:1px solid var(--gold); padding:1rem; position:relative; }
.memory-index { position:absolute; top:1.4rem; left:1.4rem; z-index:2; font-family:var(--font-label); font-size:.6rem; color:var(--parchment); }
.memory-image { aspect-ratio:1; display:flex; align-items:center; justify-content:center; background:var(--ink); color:var(--gold); font-size:4rem; margin-bottom:1.2rem; }
.memory-card h3 { font-family:var(--font-display); font-style:italic; font-size:1.8rem; }
.memory-card > p:not(.card-label) { color:var(--ink-soft); font-size:.9rem; }
.memory-status { display:inline-block; margin-top:1.2rem; color:var(--rose); font-style:italic; }
.archive-note { max-width:760px; margin:0 auto; }

.house-main { max-width:900px; }
.founder-letter { max-width:720px; margin:0 auto 6rem; }
.principle-stack { border-top:1px solid var(--gold); }
.principle-stack article { display:grid; grid-template-columns:80px 1fr; gap:2rem; padding:2.2rem 0; border-bottom:1px solid rgba(184,137,47,.35); }
.principle-stack article > span { font-family:var(--font-label); color:var(--gold); }
.principle-stack h3 { font-family:var(--font-display); font-style:italic; font-size:1.7rem; margin-bottom:.4rem; }
.principle-stack p { color:var(--ink-soft); }
.consent-section { margin-top:7rem; text-align:center; }
.consent-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; text-align:left; }
.consent-cards article { border:1px solid var(--gold); padding:2rem; }
.consent-cards b { font-size:2.5rem; color:var(--rose); }
.consent-cards h3 { font-family:var(--font-display); font-style:italic; font-size:1.5rem; margin:.5rem 0; }
.consent-cards p,.consent-footnote { color:var(--ink-soft); }
.consent-footnote { margin:1.5rem auto 0; max-width:620px; font-style:italic; }
.house-faq { max-width:720px; margin:7rem auto 0; }
.house-faq details { border-top:1px solid rgba(184,137,47,.5); padding:1.1rem 0; }
.house-faq details:last-child { border-bottom:1px solid rgba(184,137,47,.5); }
.house-faq summary { cursor:pointer; font-family:var(--font-display); font-size:1.25rem; font-style:italic; }
.house-faq details p { padding:.8rem 1rem .2rem; color:var(--ink-soft); }

.guestbook-layout { display:grid; grid-template-columns:minmax(320px,.85fr) 1.15fr; gap:4rem; align-items:start; }
.guestbook-form label { display:block; font-family:var(--font-label); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); margin:1.1rem 0 .3rem; }
.guestbook-form input,.guestbook-form textarea { width:100%; border:0; border-bottom:1px solid var(--ink-faint); background:transparent; padding:.7rem 0; font:inherit; color:var(--ink); }
.guestbook-form textarea { min-height:140px; resize:vertical; border:1px solid rgba(184,137,47,.45); padding:.8rem; }
.guestbook-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:1rem; }
#guest-count { color:var(--ink-faint); font-size:.78rem; }
.demo-note { margin-top:1.5rem; font-size:.78rem; color:var(--ink-faint); font-style:italic; }
.guestbook-wall { min-height:620px; padding:2rem; background:linear-gradient(160deg,#d6b07b,#bc8d5d); border:10px solid #6a4830; box-shadow:inset 0 0 0 1px rgba(255,255,255,.25); }
.guest-note { position:relative; background:#f8efd9; padding:2rem 1.5rem 1.4rem; max-width:310px; margin:0 auto 2rem; box-shadow:4px 6px 12px rgba(43,31,23,.16); transform:rotate(1deg); }
.guest-note.tilt-left { transform:rotate(-2.5deg); margin-left:0; }.guest-note.tilt-right { transform:rotate(2.8deg); margin-right:0; }
.guest-note .tape { position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:rgba(232,168,154,.72); width:60px; text-align:center; padding:.15rem; }
.guest-note p { font-family:var(--font-display); font-style:italic; font-size:1.35rem; line-height:1.2; }
.guest-note small { display:block; margin-top:.8rem; color:var(--ink-soft); }
.local-note { margin-top:1.8rem; }

.altar-page { padding:0; min-height:100vh; background:radial-gradient(circle at 50% 35%,#5d302d 0,#2b1f17 58%,#17110e 100%); color:var(--parchment); overflow-x:hidden; }
.altar-back { position:fixed; top:1.4rem; left:1.5rem; z-index:3; color:var(--gold-light); font-family:var(--font-label); font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; }
.altar-stage { min-height:100vh; padding:4rem 1.5rem 2rem; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.altar-stage h1 { font-family:var(--font-display); font-size:clamp(2.3rem,6vw,4rem); font-style:italic; font-weight:500; }
.altar-hint { color:var(--parchment-dk); font-style:italic; margin:.3rem 0 1rem; }
.tarot-flip { width:min(260px,70vw); height:min(390px,56vh); min-height:300px; background:none; border:0; perspective:1100px; position:relative; cursor:pointer; margin:.8rem 0 1rem; color:inherit; }
.tarot-face { position:absolute; inset:0; backface-visibility:hidden; transition:transform .75s cubic-bezier(.2,.8,.2,1); border:1px solid var(--gold); box-shadow:0 22px 60px rgba(0,0,0,.42); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:1.5rem; }
.tarot-back { background:var(--ink); outline:1px solid rgba(212,175,55,.4); outline-offset:-9px; }
.tarot-back strong { font-family:var(--font-label); letter-spacing:.22em; line-height:1.6; color:var(--gold-light); }
.back-stars { color:var(--gold); font-size:1.8rem; line-height:2.2; margin-bottom:1rem; }
.tarot-front { background:var(--parchment); color:var(--ink); transform:rotateY(180deg); outline:1px solid rgba(184,137,47,.5); outline-offset:-9px; }
.tarot-flip.flipped .tarot-back { transform:rotateY(180deg); }.tarot-flip.flipped .tarot-front { transform:rotateY(360deg); }
.arcana-numeral { position:absolute; top:18px; left:22px; font-family:var(--font-label); color:var(--gold); font-size:.7rem; }.arcana-symbol { font-size:3.6rem; color:var(--rose); }.arcana-label { margin-top:1rem; font-family:var(--font-label); color:var(--gold); text-transform:uppercase; letter-spacing:.13em; font-size:.58rem; }.tarot-front strong { font-family:var(--font-display); font-style:italic; color:var(--rose); font-size:1.75rem; margin:.2rem 0 .8rem; }.tarot-front em { color:var(--ink-soft); font-size:.92rem; }
.altar-footnote { max-width:470px; color:#d7c6a7; font-size:.82rem; font-style:italic; opacity:.8; }
.altar-orbit { font-size:1.5rem; animation:spinSlow 9s linear infinite; }

@media (max-width:760px){
  :root{--nav-h:60px}.house-nav{padding:0 1rem}.house-links{gap:.7rem}.house-links a{font-size:.54rem}.house-mark{font-size:.65rem}.portal-strip,.archive-grid,.consent-cards{grid-template-columns:1fr}.portal-strip a{min-height:135px}.archive-feature,.guestbook-layout{grid-template-columns:1fr;gap:3rem}.archive-polaroid{max-width:420px;margin:auto}.principle-stack article{grid-template-columns:45px 1fr;gap:1rem}.site-footer{flex-direction:column;gap:1rem;text-align:center}.postcard-inner{flex-direction:column}.postcard-left{min-height:220px;border-right:0;border-bottom:1px solid rgba(184,137,47,.3)}.postcard-left::after{display:none}.postmark{display:none}.invitation-symbol{font-size:4rem}.ambient-player{bottom:1rem;left:1rem}.cursor-toggle{bottom:1rem;right:1rem}.altar-btn-label{display:none}.altar-btn{padding:.65rem}.guestbook-wall{min-height:0}.page-hero{padding-top:5rem}}
@media (max-width:520px){.house-links a:nth-child(1){display:none}.house-links{gap:.6rem}.house-nav{padding:0 .8rem}.page-main{padding-left:1rem;padding-right:1rem}.card-frame{padding:2.4rem 1.4rem 2.2rem}.tarot-flip{min-height:270px;height:48vh}.cursor-toggle-label,.audio-label{display:none}}

/* ==========================================================================
   V3 — SMALL FEATURES: Fortune Cookies, Tonight at the House, whispers
   ========================================================================== */

/* Logo whisper — CSS-only hover reveal, no JS needed. */
.house-mark { position: relative; }
.house-mark[data-whisper]:hover::after {
  content: attr(data-whisper);
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 8px;
  font-family: var(--font-body);
  font-style: italic;
  font-size: 0.75rem;
  color: var(--ink-soft);
  background: var(--parchment);
  border: 1px solid var(--gold);
  padding: 0.3rem 0.7rem;
  white-space: nowrap;
  box-shadow: 0 6px 14px rgba(43,31,23,.15);
  animation: fadeInUp 0.3s ease forwards;
  z-index: 950;
}

/* Random footer whisper line */
.whisper-line {
  margin-top: 0.8rem;
  font-family: var(--font-body);
  font-style: italic;
  font-size: 0.78rem;
  color: var(--ink-faint);
  text-align: center;
  opacity: 0.75;
}

/* Tonight at the House */
.tonight-section { max-width: 640px; margin: 4rem auto 0; padding: 0 1.5rem; text-align: center; }
.tonight-lines { list-style: none; margin: 0 auto 1.2rem; display: inline-flex; flex-direction: column; gap: 0.35rem; text-align: left; }
.tonight-lines li { font-family: var(--font-body); font-style: italic; color: var(--ink-soft); font-size: 1rem; }
.tonight-lines li::before { content: "· "; color: var(--gold); font-style: normal; }
.tonight-cta { font-family: var(--font-label); font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--rose); }

/* Fortune Cookies */
.fortune-overlay {
  position: fixed;
  inset: 0;
  background: rgba(43, 31, 23, 0.75);
  backdrop-filter: blur(4px);
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
  padding: 1.5rem;
}
.fortune-overlay.visible { opacity: 1; pointer-events: auto; }
.fortune-slip {
  background: var(--parchment);
  border: 1px solid var(--gold);
  max-width: 380px;
  width: 100%;
  padding: 2.4rem 2rem;
  text-align: center;
  position: relative;
  transform: translateY(20px) rotate(-0.6deg);
  transition: transform 0.4s cubic-bezier(0.2,0.8,0.2,1);
  box-shadow: 0 25px 50px rgba(0,0,0,0.4);
}
.fortune-overlay.visible .fortune-slip { transform: translateY(0) rotate(-0.6deg); }
.fortune-kicker { font-family: var(--font-label); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.2rem; }
.fortune-text { font-family: var(--font-display); font-style: italic; font-size: 1.5rem; color: var(--rose); line-height: 1.35; margin-bottom: 1.4rem; }
.fortune-footer { font-family: var(--font-label); font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 1.4rem; }
.fortune-close {
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--gold);
  font-family: var(--font-label);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.55rem 1.2rem;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.fortune-close:hover, .fortune-close:focus-visible { background: var(--gold); color: var(--parchment); }
.backroom-found .fortune-slip { padding: 1.8rem 2rem; }
.backroom-found .fortune-text { margin-bottom: 0; font-size: 1.3rem; }

/* Linger toast: "you've been here a while" */
.linger-toast {
  position: fixed;
  bottom: 2rem;
  left: 50%;
  transform: translate(-50%, 20px);
  background: var(--ink);
  color: var(--parchment-dk);
  border: 1px solid var(--gold);
  padding: 1rem 1.6rem;
  text-align: center;
  font-size: 0.88rem;
  z-index: 1500;
  opacity: 0;
  transition: opacity 0.4s ease, transform 0.4s ease;
  max-width: 320px;
  box-shadow: 0 15px 35px rgba(0,0,0,0.35);
}
.linger-toast.visible { opacity: 1; transform: translate(-50%, 0); }
.linger-toast strong { color: var(--gold-light); font-family: var(--font-display); font-style: italic; font-size: 1.05rem; }

/* Fortunes Found (profile) */
.fortunes-found { font-size: 0.85rem; color: var(--ink-soft); margin-bottom: 1.2rem; }
.fortunes-found .kicker { display: block; margin-bottom: 0.2rem; }

/* The Back Room */
.backroom-modal { max-width: 440px; text-align: center; }
.backroom-headline { font-family: var(--font-display); font-style: italic; color: var(--rose); font-size: 1.8rem; margin: 0.6rem 0 1rem; }
.backroom-lines { list-style: none; }
.backroom-lines li { font-family: var(--font-body); font-style: italic; color: var(--ink-soft); font-size: 1.05rem; padding: 0.4rem 0; }

@media (prefers-reduced-motion: reduce) {
  .fortune-overlay, .fortune-slip, .linger-toast, .house-mark[data-whisper]:hover::after {
    transition: none !important;
    animation: none !important;
  }
}



/* ==========================================================================
   MEMBERSHIP REFRESH — top-nav account, magic-link auth, zodiac signup,
   public profiles, member-only guestbook.
   ========================================================================== */
.house-links { align-items:center; }

.nav-account-btn {
  appearance:none; border:1px solid rgba(184,137,47,.75); background:rgba(244,233,209,.82);
  color:var(--ink); min-height:38px; padding:.35rem .65rem .35rem .38rem; border-radius:999px;
  display:inline-flex; align-items:center; gap:.5rem; cursor:pointer; font-family:var(--font-label);
  font-size:.58rem; letter-spacing:.08em; text-transform:uppercase; box-shadow:0 7px 18px rgba(43,31,23,.08);
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.nav-account-btn:hover { transform:translateY(-1px); background:var(--parchment); border-color:var(--rose); }
.nav-avatar { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; object-fit:cover; flex:0 0 auto; }
.nav-avatar-empty { background:var(--ink); color:var(--gold-light); }
.nav-avatar-initials { background:var(--rose); color:var(--parchment); font-family:var(--font-display); font-size:.8rem; }

.member-auth-overlay {
  position:fixed; inset:0; z-index:3000; padding:1rem; display:grid; place-items:center;
  background:rgba(43,31,23,.82); backdrop-filter:blur(8px); opacity:0; pointer-events:none;
  transition:opacity .3s ease;
}
.member-auth-overlay.visible { opacity:1; pointer-events:auto; }
.member-auth-card {
  width:min(760px,96vw); max-height:min(860px,92vh); overflow:auto; position:relative;
  background:
    radial-gradient(circle at 15% 10%,rgba(232,168,154,.26),transparent 32%),
    linear-gradient(150deg,var(--parchment),#f7eddb);
  border:1px solid var(--gold); padding:2.2rem; box-shadow:0 30px 80px rgba(0,0,0,.35);
}
.member-auth-card::before { content:""; position:absolute; inset:9px; border:1px solid rgba(184,137,47,.35); pointer-events:none; }
.member-auth-close { position:absolute; right:1.2rem; top:1rem; z-index:2; border:0; background:transparent; font-size:1.8rem; color:var(--ink); cursor:pointer; }
.auth-sun { width:48px; height:48px; border:1px solid var(--gold); border-radius:50%; display:grid; place-items:center; color:var(--rose); margin:0 auto 1rem; }
.member-auth-card h2 { font-family:var(--font-display); font-style:italic; font-size:clamp(2rem,6vw,3.2rem); text-align:center; color:var(--rose); line-height:1; }
.member-auth-sub { text-align:center; color:var(--ink-soft); max-width:42ch; margin:.75rem auto 1.5rem; }
.member-auth-switch { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid rgba(184,137,47,.45); margin-bottom:1.4rem; }
.member-auth-tab { border:0; background:transparent; padding:.8rem; font-family:var(--font-label); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); cursor:pointer; border-bottom:2px solid transparent; }
.member-auth-tab.is-active { color:var(--rose); border-color:var(--rose); }
.member-auth-form label, .profile-edit-form label { display:block; margin:.8rem 0 .3rem; font-family:var(--font-label); font-size:.62rem; letter-spacing:.11em; text-transform:uppercase; color:var(--gold); }
.member-auth-form label em, .zodiac-fieldset legend em { text-transform:none; font-family:var(--font-body); font-weight:normal; letter-spacing:0; color:var(--ink-faint); }
.member-auth-form input, .profile-edit-form input, .profile-edit-form textarea {
  width:100%; border:1px solid rgba(184,137,47,.45); background:rgba(255,255,255,.2); padding:.8rem .9rem;
  font:inherit; color:var(--ink); outline:none;
}
.member-auth-form input:focus, .profile-edit-form input:focus, .profile-edit-form textarea:focus { border-color:var(--rose); box-shadow:0 0 0 3px rgba(181,70,79,.08); }
.member-field-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.zodiac-fieldset { border:0; margin:1.2rem 0; }
.zodiac-fieldset legend { font-family:var(--font-label); font-size:.65rem; letter-spacing:.11em; text-transform:uppercase; color:var(--gold); margin-bottom:.7rem; }
.zodiac-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:.5rem; }
.zodiac-btn { --z:#b8892f; border:1px solid rgba(184,137,47,.35); background:rgba(255,255,255,.12); min-height:72px; padding:.45rem .2rem; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.15rem; cursor:pointer; color:var(--ink-soft); transition:.2s ease; }
.zodiac-btn span { font-size:1.45rem; }
.zodiac-btn small { font-family:var(--font-label); font-size:.48rem; letter-spacing:.05em; text-transform:uppercase; }
.zodiac-btn:hover,.zodiac-btn.selected { transform:translateY(-2px); border-color:var(--z); color:var(--z); background:color-mix(in srgb,var(--z) 12%,var(--parchment)); box-shadow:0 8px 18px color-mix(in srgb,var(--z) 16%,transparent); }
.zodiac-aries{--z:#c94e4e}.zodiac-taurus{--z:#708d5c}.zodiac-gemini{--z:#d19b37}.zodiac-cancer{--z:#6f8fa8}.zodiac-leo{--z:#d7772f}.zodiac-virgo{--z:#8c7857}.zodiac-libra{--z:#c57f9f}.zodiac-scorpio{--z:#8d4f65}.zodiac-sagittarius{--z:#805b9c}.zodiac-capricorn{--z:#596457}.zodiac-aquarius{--z:#4e90a5}.zodiac-pisces{--z:#6576a8}
.member-primary-btn { width:100%; border:1px solid var(--gold); background:var(--ink); color:var(--parchment); padding:.9rem 1.2rem; margin-top:1rem; cursor:pointer; font-family:var(--font-label); font-size:.67rem; letter-spacing:.12em; text-transform:uppercase; transition:.2s ease; }
.member-primary-btn:hover { background:var(--rose); border-color:var(--rose); }
.member-form-note { min-height:1.5rem; margin-top:.7rem; text-align:center; color:var(--rose); font-style:italic; }

.guestbook-gate { min-height:calc(100vh - 74px); display:grid; place-items:center; padding:6rem 1rem; }
.guestbook-gate-card { width:min(560px,94vw); text-align:center; }
.guestbook-gate-card h1 { font-family:var(--font-display); font-style:italic; color:var(--rose); font-size:clamp(2rem,7vw,3.5rem); line-height:1; margin-bottom:1rem; }
.guest-profile-link { display:inline-flex; align-items:center; gap:.5rem; margin-top:.9rem; text-decoration:none; color:var(--ink-soft); }
.guest-profile-link:hover { color:var(--rose); }
.guest-note-avatar { width:30px; height:30px; border-radius:50%; object-fit:cover; display:grid; place-items:center; }
.guest-note-avatar-fallback { background:var(--rose); color:var(--parchment); }

/* Profile page */
.profile-page { min-height:100vh; }
.profile-shell { max-width:1050px; margin:0 auto; padding:7rem 1.2rem 5rem; }
.profile-identity { display:grid; grid-template-columns:170px 1fr; gap:2.2rem; align-items:center; padding:2.2rem; background:linear-gradient(145deg,rgba(232,168,154,.28),rgba(244,233,209,.25)); border:1px solid var(--gold); position:relative; }
.profile-avatar-wrap { width:150px; height:150px; border-radius:50%; border:1px solid var(--gold); padding:7px; background:var(--parchment); }
.profile-avatar-large { width:100%; height:100%; border-radius:50%; object-fit:cover; display:grid; place-items:center; background:var(--rose); color:var(--parchment); font-family:var(--font-display); font-size:3rem; }
.profile-identity h1 { font-family:var(--font-display); font-style:italic; font-size:clamp(2.5rem,7vw,4.7rem); line-height:.9; }
.profile-star-pill { display:inline-flex; align-items:center; gap:.4rem; border:1px solid var(--gold); padding:.35rem .7rem; border-radius:999px; margin-top:.8rem; font-family:var(--font-label); font-size:.6rem; letter-spacing:.08em; text-transform:uppercase; color:var(--rose); }
.profile-bio { color:var(--ink-soft); margin-top:.8rem; max-width:52ch; }
.profile-owner-actions { display:flex; gap:.8rem; flex-wrap:wrap; margin-top:1rem; }
.profile-owner-actions button { width:auto; margin:0; }
.profile-section-card { margin-top:2rem; border-top:1px solid rgba(184,137,47,.45); padding-top:2rem; }
.profile-section-card h2 { font-family:var(--font-display); font-style:italic; color:var(--rose); font-size:2rem; }
.profile-gatherings { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1rem; margin-top:1rem; }
.profile-gathering { border:1px solid rgba(184,137,47,.5); padding:1.2rem; background:rgba(255,255,255,.12); }
.profile-gathering strong { display:block; font-family:var(--font-display); font-style:italic; font-size:1.3rem; }
.profile-tonight { margin-top:4rem; text-align:center; padding:2.5rem 1.5rem; background:linear-gradient(180deg,rgba(232,168,154,.18),transparent); }
.profile-tonight ul { list-style:none; margin:1rem auto; display:inline-flex; flex-direction:column; text-align:left; gap:.3rem; color:var(--ink-soft); font-style:italic; }
.profile-tonight li::before { content:"· "; color:var(--gold); }
.profile-edit-panel { margin-top:1.5rem; padding:1.4rem; border:1px dashed var(--gold); }
.profile-edit-form textarea { min-height:90px; resize:vertical; }
.avatar-file-label { display:inline-block!important; cursor:pointer; border:1px solid var(--gold); padding:.6rem .8rem; color:var(--rose)!important; }
.avatar-file-label input { display:none; }

@media(max-width:760px){
  .member-auth-card{padding:2rem 1.1rem}.member-field-row{grid-template-columns:1fr}.zodiac-grid{grid-template-columns:repeat(3,1fr)}
  .profile-identity{grid-template-columns:1fr;text-align:center}.profile-avatar-wrap{margin:auto}.profile-bio{margin-left:auto;margin-right:auto}.profile-owner-actions{justify-content:center}
  .house-links{gap:.35rem}.nav-account-btn{padding:.3rem}.nav-account-btn>span:last-child{display:none}.nav-avatar{width:30px;height:30px}
}

/* ==========================================================================\n   ARIES PHOTO BOOTH — permanent clubhouse feature\n   ========================================================================== */
.photobooth-page{background-image:radial-gradient(circle at 10% 0%,rgba(232,168,154,.25),transparent 30%),radial-gradient(circle at 90% 10%,rgba(184,137,47,.12),transparent 25%)}
.booth-shell{max-width:1200px;margin:0 auto;padding:7rem 1.5rem 5rem}.booth-intro{text-align:center;max-width:760px;margin:0 auto 3rem}.booth-intro h1{font-family:var(--font-display);font-style:italic;font-size:clamp(3rem,8vw,5.8rem);line-height:.95;color:var(--rose);margin:0}.booth-intro>p:not(.kicker){font-size:1.15rem;line-height:1.6;color:var(--ink-soft);max-width:630px;margin:1.2rem auto}.booth-open-pill{display:inline-block;border:1px solid rgba(184,137,47,.55);padding:.55rem .85rem;border-radius:999px;font-family:var(--font-label);font-size:.61rem;letter-spacing:.11em;color:var(--ink-soft)}
.booth-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:2.4rem;align-items:start}.booth-controls{box-shadow:0 20px 50px rgba(43,31,23,.08)}.booth-section-head{display:flex;gap:.9rem;align-items:flex-start;margin-bottom:1.4rem;position:relative;z-index:1}.booth-section-head>span{font-family:var(--font-label);color:var(--rose);font-size:.8rem;margin-top:.25rem}.booth-section-head h2,.booth-section-head h3{font-family:var(--font-display);font-style:italic;font-size:2rem;margin:0}.booth-section-head h3{font-size:1.55rem}.booth-section-head-small{margin-top:2rem}
.booth-upload-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem;position:relative;z-index:1}.booth-upload-card{position:relative;border:1px dashed rgba(184,137,47,.65);background:rgba(255,255,255,.18);min-height:150px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;transition:.2s ease}.booth-upload-card:hover{transform:translateY(-2px);border-color:var(--rose)}.booth-upload-card input{position:absolute;inset:0;opacity:0;cursor:pointer}.booth-upload-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.booth-slot-label{pointer-events:none;position:relative;z-index:2}.booth-slot-num{display:block;font-family:var(--font-label);font-size:.7rem;color:var(--gold);letter-spacing:.14em}.booth-slot-copy{display:block;margin-top:.3rem;color:var(--ink-soft)}.booth-upload-card.has-image .booth-slot-label{background:rgba(244,233,209,.82);padding:.3rem .5rem;border:1px solid rgba(184,137,47,.35)}
.booth-skin-options{display:flex;flex-wrap:wrap;gap:.6rem;position:relative;z-index:1}.booth-skin-btn,.booth-ghost-btn,.booth-primary-btn{border:1px solid var(--gold);background:transparent;color:var(--ink);padding:.7rem .9rem;cursor:pointer;transition:.2s ease}.booth-skin-btn{font-family:var(--font-label);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase}.booth-skin-btn.active,.booth-skin-btn:hover{background:var(--ink);color:var(--parchment)}.booth-actions{display:flex;gap:.7rem;margin-top:1.8rem;position:relative;z-index:1}.booth-ghost-btn{flex:.8}.booth-primary-btn{flex:1.2;background:var(--rose);border-color:var(--rose);color:var(--parchment);font-family:var(--font-label);text-transform:uppercase;letter-spacing:.08em;font-size:.67rem}.booth-primary-btn:hover{background:var(--ink);border-color:var(--ink)}.booth-note{font-size:.82rem;color:var(--ink-faint);position:relative;z-index:1;margin:.9rem 0 0}
.booth-preview-wrap{text-align:center;position:sticky;top:5.5rem}.booth-strip-stage{--stage-a:var(--blush);--stage-b:var(--terracotta);background:linear-gradient(180deg,var(--stage-a),var(--stage-b));padding:2.2rem 1.25rem;border-radius:220px 220px 18px 18px;min-height:650px;display:flex;align-items:center;justify-content:center;box-shadow:0 24px 60px rgba(43,31,23,.12);position:relative;overflow:hidden;transition:background .3s ease}.booth-strip-stage:before,.booth-strip-stage:after{content:"✦";position:absolute;color:rgba(43,31,23,.18);font-size:64px}.booth-strip-stage:before{top:40px;left:34px}.booth-strip-stage:after{bottom:35px;right:30px}.booth-photo-strip{width:245px;background:var(--parchment);padding:14px 14px 18px;box-shadow:0 18px 35px rgba(43,31,23,.25);position:relative;transform:rotate(1.2deg);transition:.3s ease}.booth-strip-top-mark{font-size:18px;color:var(--rose);margin-bottom:8px}.booth-frames{display:grid;gap:8px}.booth-strip-frame{height:190px;background:#d8cbb0;overflow:hidden;border:1px solid rgba(43,31,23,.14);position:relative;cursor:pointer}.booth-strip-frame img{width:100%;height:100%;object-fit:cover}.booth-empty-frame{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-label);font-size:.62rem;letter-spacing:.1em;color:rgba(43,31,23,.45)}.booth-strip-footer{padding:14px 6px 2px}.booth-strip-brand{font-family:var(--font-label);font-size:.7rem;letter-spacing:.13em;margin:0}.booth-strip-name{font-family:var(--font-display);font-style:italic;font-size:1.4rem;margin:6px 0 1px}.booth-strip-sub{font-family:var(--font-label);font-size:.54rem;letter-spacing:.1em;margin:0;color:var(--ink-soft)}.booth-strip-tagline{font-size:.82rem;margin:8px 0 0;color:var(--rose)}.booth-preview-tip{font-size:.88rem;color:var(--ink-soft);margin-top:.8rem}
.booth-skin-general:before{content:"ASC";position:absolute;right:10px;top:9px;font-family:var(--font-label);font-size:.48rem;letter-spacing:.14em;color:rgba(181,70,79,.6)}.booth-skin-golden{background:#f6dfad}.booth-skin-golden .booth-strip-top-mark,.booth-skin-golden .booth-strip-tagline,.booth-skin-golden .booth-strip-name{color:#b66a24}.booth-skin-supper{background:#f2e4d6}.booth-skin-supper:before{content:"";position:absolute;inset:6px;border:1px solid #7c1f2b;pointer-events:none}.booth-skin-supper .booth-strip-top-mark,.booth-skin-supper .booth-strip-tagline,.booth-skin-supper .booth-strip-name{color:#7c1f2b}.booth-skin-craft:after{content:"✂  ✦  ~  ♡";position:absolute;top:9px;right:12px;font-size:10px;letter-spacing:3px;color:rgba(83,107,69,.65)}.booth-skin-craft .booth-strip-top-mark,.booth-skin-craft .booth-strip-tagline,.booth-skin-craft .booth-strip-name{color:var(--palm)}
.profile-photobooth-callout{margin-top:2rem;border:1px solid var(--gold);padding:1.5rem;background:linear-gradient(130deg,rgba(232,168,154,.18),rgba(244,233,209,.5));display:flex;align-items:center;justify-content:space-between;gap:1.2rem}.profile-photobooth-callout h3{font-family:var(--font-display);font-style:italic;font-size:1.7rem;color:var(--rose);margin:0}.profile-photobooth-callout p{color:var(--ink-soft);margin:.35rem 0 0}.profile-photobooth-callout a{white-space:nowrap;text-decoration:none;width:auto;margin:0}
@media(max-width:860px){.booth-layout{grid-template-columns:1fr}.booth-preview-wrap{position:static}.booth-strip-stage{min-height:570px}.profile-photobooth-callout{flex-direction:column;text-align:center}.profile-photobooth-callout a{width:100%}}
@media(max-width:520px){.booth-shell{padding:6rem 1rem 4rem}.booth-upload-grid{grid-template-columns:1fr}.booth-actions{flex-direction:column}.booth-photo-strip{width:220px}.booth-strip-frame{height:170px}.booth-intro h1{font-size:3.45rem}.booth-skin-options{display:grid;grid-template-columns:1fr 1fr}}


/* ==========================================================================
   LIVE ENHANCEMENT — flatter invitations, Netlify forms, profile collage
   ========================================================================== */

.netlify-honeypot {
  position:absolute!important; overflow:hidden!important; clip:rect(0 0 0 0)!important;
  height:1px!important; width:1px!important; margin:-1px!important; padding:0!important; border:0!important;
}
.netlify-detector-forms { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* True wide postcard on desktop */
.modal-overlay { padding: 1.25rem; overflow:auto; }
.invitation-postcard-wide {
  width:min(1040px,96vw);
  max-width:1040px;
  max-height:min(650px,88vh);
  padding:9px;
  transform:translateY(28px) rotate(-.2deg);
}
.invitation-postcard-grid {
  display:grid;
  grid-template-columns:minmax(235px,.72fr) minmax(0,1.8fr);
  min-height:430px;
  max-height:min(620px,84vh);
  overflow:hidden;
}
.invitation-postcard-grid .postcard-left {
  min-width:0;
  padding:1.55rem 1.4rem;
  border-right:1px dashed rgba(184,137,47,.6);
  background:
    radial-gradient(circle at 20% 18%,rgba(232,168,154,.5),transparent 32%),
    linear-gradient(160deg,#efe0c1,var(--parchment));
}
.invitation-postcard-grid .postcard-left::after { display:none; }
.invitation-art-top,.invitation-art-bottom { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.invitation-house-mark,.invitation-art-bottom {
  font-family:var(--font-label); font-size:.57rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-faint);
}
.invitation-art-bottom { align-items:flex-end; margin-top:auto; }
.invitation-art-bottom span { color:var(--rose); }
.invitation-symbol { font-size:clamp(5.5rem,10vw,8.5rem); line-height:1; color:var(--rose); margin:auto; text-shadow:1px 1px 0 rgba(184,137,47,.35); }
.invitation-postcard-grid .stamp-container { padding:7px; }
.invitation-postcard-grid .postmark { width:52px; height:52px; }

.invitation-content {
  padding:1.55rem 1.7rem!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(230px,.8fr);
  gap:1.5rem;
  align-items:stretch;
  justify-content:stretch!important;
  overflow:auto;
}
.invitation-copy {
  min-width:0; padding-right:1.2rem; border-right:1px solid rgba(184,137,47,.25);
  display:flex; flex-direction:column; justify-content:center;
}
.invitation-copy .card-title { font-size:clamp(2.15rem,4vw,3.4rem); line-height:.92; margin:.2rem 0 .55rem; }
.invitation-copy .card-meta { font-size:.82rem; line-height:1.45; margin-bottom:.85rem; }
.invitation-copy .card-desc { font-size:.98rem; line-height:1.45; margin-bottom:.7rem; }
.invitation-copy .invitation-note { margin-top:.45rem; font-size:.82rem; line-height:1.4; }

.invitation-sidecar {
  min-width:0; display:flex; flex-direction:column; justify-content:center; gap:1rem;
}
.invitation-detail-block { padding-bottom:.9rem; border-bottom:1px solid rgba(184,137,47,.3); }
.invitation-facts { display:grid; grid-template-columns:1fr; gap:.42rem; margin:0!important; }
.invitation-facts > div { display:grid!important; grid-template-columns:72px 1fr; gap:.55rem; align-items:start; padding:.15rem 0!important; border:0!important; }
.invitation-facts dt { font-size:.52rem!important; letter-spacing:.08em; }
.invitation-facts dd { font-size:.79rem!important; line-height:1.28!important; }
.facts-kicker,.rsvp-kicker { margin-bottom:.45rem!important; }
.invitation-rsvp-block { min-width:0; }
.event-rsvp-form { display:grid; gap:.5rem; }
.invitation-postcard-grid .postcard-right input { padding:.42rem .1rem; font-size:.88rem; }
.invitation-postcard-grid .modal-submit { margin-top:.25rem!important; padding:.68rem .8rem!important; font-size:.59rem!important; }
.signed-in-as { font-size:.82rem; line-height:1.3; margin-bottom:.5rem; }

@media (max-width:820px){
  .invitation-postcard-wide { max-height:none; width:min(680px,96vw); }
  .invitation-postcard-grid { grid-template-columns:1fr; max-height:none; overflow:visible; }
  .invitation-postcard-grid .postcard-left {
    min-height:175px; border-right:0; border-bottom:1px dashed rgba(184,137,47,.6);
    padding:1rem 1.2rem;
  }
  .invitation-symbol { font-size:4.6rem; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }
  .invitation-art-bottom { margin-top:3.3rem; }
  .invitation-content { grid-template-columns:1fr 1fr; padding:1.25rem!important; max-height:none; overflow:visible; }
  .invitation-copy { padding-right:1rem; }
}
@media (max-width:590px){
  .modal-overlay { align-items:flex-start; padding:.65rem; }
  .invitation-postcard-wide { width:100%; margin:1rem 0; }
  .invitation-postcard-grid .postcard-left { min-height:145px; }
  .invitation-content { grid-template-columns:1fr; gap:.9rem; }
  .invitation-copy { padding-right:0; padding-bottom:.85rem; border-right:0; border-bottom:1px solid rgba(184,137,47,.25); }
  .invitation-copy .card-title { font-size:2.35rem; }
  .invitation-facts { grid-template-columns:1fr 1fr; gap:.35rem .75rem; }
  .invitation-facts > div { grid-template-columns:1fr; gap:.05rem; }
  .close-modal { top:13px; right:13px; }
}

/* Profile: scrapbook / little corner */
.profile-shell-v2 { max-width:1120px; }
.profile-collage {
  position:relative; display:grid; grid-template-columns:210px minmax(0,1fr) 245px; gap:2.2rem; align-items:center;
  padding:2.6rem; border:1px solid rgba(184,137,47,.55);
  background:
    linear-gradient(90deg,rgba(181,70,79,.035) 1px,transparent 1px),
    linear-gradient(rgba(181,70,79,.035) 1px,transparent 1px),
    linear-gradient(145deg,#f6ead3,var(--parchment));
  background-size:28px 28px,28px 28px,auto;
  box-shadow:0 22px 55px rgba(43,31,23,.09);
}
.profile-polaroid {
  background:#fff9ea; padding:10px 10px 28px; transform:rotate(-2.6deg);
  box-shadow:6px 8px 18px rgba(43,31,23,.14);
}
.profile-polaroid .profile-avatar-wrap { width:170px; height:170px; border:0; border-radius:0; padding:0; background:#e7cfa5; }
.profile-polaroid .profile-avatar-large,.profile-polaroid .profile-avatar-large img { border-radius:0!important; width:100%; height:100%; object-fit:cover; }
.profile-polaroid p { font-family:var(--font-label); font-size:.52rem; letter-spacing:.12em; text-align:center; margin-top:.65rem; color:var(--ink-faint); }
.profile-intro h1 { font-size:clamp(3rem,7vw,5.4rem); }
.profile-chips { display:flex; flex-wrap:wrap; gap:.55rem; align-items:center; margin-top:.9rem; }
.profile-member-chip { border:1px dashed rgba(184,137,47,.75); padding:.34rem .65rem; border-radius:999px; font-family:var(--font-label); font-size:.55rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); }
.profile-small-btn { width:auto!important; margin-top:0!important; }
.profile-quiet-btn { border:0; background:transparent; color:var(--ink-faint); font:italic .9rem var(--font-body); cursor:pointer; padding:.5rem; }
.profile-house-card {
  min-height:250px; position:relative; padding:1.4rem; color:var(--parchment);
  background:linear-gradient(155deg,var(--rose),#7f3138);
  border:1px solid var(--gold); transform:rotate(2deg);
  box-shadow:8px 10px 20px rgba(43,31,23,.15);
  display:flex; flex-direction:column; justify-content:space-between; overflow:hidden;
}
.profile-house-card::before { content:""; position:absolute; inset:8px; border:1px solid rgba(244,233,209,.35); pointer-events:none; }
.profile-card-number,.profile-house-card small { font-family:var(--font-label); font-size:.48rem; letter-spacing:.12em; position:relative; }
.profile-house-card strong { font-family:var(--font-display); font-style:italic; font-size:2rem; line-height:.85; position:relative; }
.profile-card-stamps { display:flex; gap:.4rem; position:relative; }
.profile-card-stamps i { width:34px;height:34px;border:1px solid rgba(244,233,209,.65);border-radius:50%;display:grid;place-items:center;font-style:normal;transform:rotate(-8deg); }
.profile-dashboard-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr); gap:1.4rem; margin-top:2rem; }
.profile-dashboard-card { border:1px solid rgba(184,137,47,.45); padding:1.6rem; background:rgba(255,255,255,.13); position:relative; }
.profile-dashboard-card h2 { font-family:var(--font-display); font-style:italic; color:var(--rose); font-size:clamp(1.8rem,4vw,2.6rem); line-height:1; }
.profile-section-heading { display:flex; justify-content:space-between; gap:1rem; }
.profile-doodle { font-size:3rem; color:var(--gold); transform:rotate(-12deg); }
.photobooth-card { background:linear-gradient(160deg,rgba(232,168,154,.24),rgba(244,233,209,.2)); }
.mini-photo-strip { float:right; width:74px; padding:5px; background:#fff9ea; box-shadow:3px 5px 10px rgba(43,31,23,.15); transform:rotate(3deg); margin:0 0 .8rem 1rem; }
.mini-photo-strip i { height:52px; background:var(--ink); color:var(--gold); display:grid; place-items:center; font-style:normal; margin-bottom:4px; }
.mini-photo-strip small { display:block; text-align:center; font-family:var(--font-label); font-size:.48rem; }

.profile-tarot-stage {
  margin-top:2rem; border:1px solid rgba(184,137,47,.5); min-height:390px; padding:2.2rem;
  display:grid; grid-template-columns:1fr 320px; gap:3rem; align-items:center;
  background:radial-gradient(circle at 78% 45%,rgba(181,70,79,.18),transparent 32%),linear-gradient(145deg,#2b1f17,#3b241f);
  color:var(--parchment);
}
.profile-tarot-copy h2 { font-family:var(--font-display); font-style:italic; color:var(--gold-light); font-size:3rem; line-height:.95; }
.profile-tarot-copy p:not(.kicker) { color:var(--parchment-dk); max-width:38ch; }
.profile-tarot-card-wrap { display:flex; justify-content:center; perspective:900px; }
.profile-tarot-card {
  width:230px; min-height:330px; padding:1.25rem 1.1rem; position:relative;
  background:var(--parchment); color:var(--ink); border:1px solid var(--gold);
  box-shadow:12px 15px 0 rgba(181,70,79,.22),0 20px 40px rgba(0,0,0,.35);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  transform:rotate(1.4deg);
}
.profile-tarot-card::before { content:""; position:absolute; inset:8px; border:1px solid rgba(184,137,47,.42); }
.profile-tarot-numeral { position:absolute; top:18px; left:20px; font-family:var(--font-label); font-size:.62rem; color:var(--rose); z-index:1; }
.profile-tarot-symbol { font-size:5.5rem; line-height:1; color:var(--rose); margin-bottom:1rem; z-index:1; }
.profile-tarot-label { font-family:var(--font-label); font-size:.48rem; letter-spacing:.15em; color:var(--gold); margin-bottom:.45rem; z-index:1; }
.profile-tarot-card strong { font-family:var(--font-display); font-style:italic; font-size:1.65rem; line-height:1; z-index:1; }
.profile-tarot-card em { font-size:.77rem; line-height:1.35; margin-top:.75rem; color:var(--ink-soft); z-index:1; }
.profile-tarot-card[data-family="wands"] .profile-tarot-symbol{color:#c55f45}
.profile-tarot-card[data-family="cups"] .profile-tarot-symbol{color:#b5464f}
.profile-tarot-card[data-family="swords"] .profile-tarot-symbol{color:#657687}
.profile-tarot-card[data-family="pentacles"] .profile-tarot-symbol{color:#6e7b56}

.profile-tonight-v2 {
  display:grid; grid-template-columns:130px 1fr; gap:2rem; align-items:center; text-align:left;
  border:1px dashed rgba(184,137,47,.55); padding:2rem; margin-top:2rem; background:rgba(232,168,154,.12);
}
.profile-tonight-v2 .profile-tonight-stamp {
  width:115px;height:115px;border:3px double var(--rose);border-radius:50%;display:grid;place-items:center;text-align:center;
  font-family:var(--font-label);font-size:.62rem;letter-spacing:.09em;line-height:1.5;color:var(--rose);transform:rotate(-7deg);
}
.profile-tonight-v2 ul { margin:.8rem 0!important; }
.profile-tonight-v2 .section-title { text-align:left; margin-bottom:.4rem; }

@media(max-width:900px){
  .profile-collage { grid-template-columns:170px 1fr; }
  .profile-house-card { grid-column:1/-1; min-height:175px; transform:rotate(.5deg); }
  .profile-polaroid .profile-avatar-wrap { width:145px;height:145px; }
  .profile-dashboard-grid { grid-template-columns:1fr; }
}
@media(max-width:680px){
  .profile-shell-v2 { padding-top:5.5rem; }
  .profile-collage { grid-template-columns:1fr; text-align:center; padding:1.4rem; }
  .profile-polaroid { width:190px; margin:auto; }
  .profile-polaroid .profile-avatar-wrap { width:170px;height:170px; }
  .profile-chips,.profile-owner-actions { justify-content:center; }
  .profile-house-card { text-align:left; }
  .profile-tarot-stage { grid-template-columns:1fr; text-align:center; padding:1.5rem; gap:1.5rem; }
  .profile-tarot-copy p:not(.kicker) { margin-left:auto;margin-right:auto; }
  .profile-tonight-v2 { grid-template-columns:1fr; text-align:center; }
  .profile-tonight-v2 .profile-tonight-stamp { margin:auto; }
  .profile-tonight-v2 .section-title { text-align:center; }
  .profile-tonight-v2 ul { text-align:left; }
}


/* ==========================================================================
   LIVE POLISH — RSVP protection + brighter Photo Booth CTA
   ========================================================================== */
.signed-in-as {
  display:flex; align-items:center; gap:.45rem; margin:0 0 .25rem;
  font-size:.88rem; color:var(--ink-soft);
}
.signed-in-as strong {
  color:var(--ink); font-family:var(--font-display); font-style:italic; font-size:1.02rem;
}
.signed-in-dot { color:var(--rose); font-size:.9rem; }
.signed-in-rsvp-help {
  margin:0 0 .75rem; font-size:.76rem; line-height:1.35;
  color:var(--ink-faint); font-style:italic;
}
.member-rsvp-btn {
  width:100%; background:var(--rose)!important; border-color:var(--rose)!important;
  color:var(--parchment)!important;
}
.member-rsvp-btn:hover:not(:disabled) {
  background:#cf5a63!important; border-color:#cf5a63!important; transform:translateY(-1px);
}
.member-rsvp-btn.rsvp-already,
.member-rsvp-btn:disabled {
  background:rgba(184,137,47,.16)!important;
  border-color:rgba(184,137,47,.55)!important;
  color:var(--ink-soft)!important;
  cursor:default; opacity:1; box-shadow:none; transform:none;
}

.photobooth-card { display:flex; flex-direction:column; }
.photobooth-card .photobooth-cta {
  display:flex; align-items:center; justify-content:center; gap:.6rem;
  width:100%; margin-top:auto; padding:.9rem 1rem;
  background:#c95662; border:1px solid #a63d47; color:#fff8e9;
  text-decoration:none; box-shadow:0 10px 22px rgba(181,70,79,.22);
  white-space:nowrap;
}
.photobooth-card .photobooth-cta span,
.photobooth-card .photobooth-cta strong { display:inline-block; line-height:1; }
.photobooth-card .photobooth-cta strong { font-size:1rem; color:#ffe6a8; }
.photobooth-card .photobooth-cta:hover {
  background:#d96873; border-color:#b5464f; transform:translateY(-2px);
  box-shadow:0 13px 26px rgba(181,70,79,.28);
}
@media(max-width:520px){
  .photobooth-card .photobooth-cta { white-space:normal; text-align:center; }
}
