:root {
  color-scheme: dark;
  --bg: #090a0d;
  --panel: #151820;
  --panel-2: #202430;
  --text: #fff8df;
  --muted: rgba(255, 248, 223, .68);
  --gold: #fac82d;
  --mint: #3dd6ab;
  --ice: #86e7ff;
  --violet: #7b5cff;
  --coral: #ff5b61;
  --line: rgba(255,255,255,.11);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 12% -4%, rgba(250,200,45,.20), transparent 34rem),
    radial-gradient(circle at 85% 12%, rgba(134,231,255,.16), transparent 32rem),
    radial-gradient(circle at 72% 68%, rgba(123,92,255,.10), transparent 34rem),
    var(--bg);
  color: var(--text);
}

a { color: inherit; }
.nav {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem clamp(1rem, 4vw, 4rem);
  backdrop-filter: blur(18px);
  background: rgba(9,10,13,.76);
  border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: .75rem; font-weight: 900; letter-spacing: -.03em; text-decoration: none; }
.brand-logo {
  display: block;
  flex: 0 0 2.1rem;
  width: 2.1rem;
  height: 2.1rem;
  max-width: 2.1rem;
  max-height: 2.1rem;
  border-radius: 999px;
  object-fit: cover;
  background: var(--gold);
  box-shadow: 0 .35rem 1rem rgba(250,200,45,.22);
}
.links { display: flex; gap: 1rem; flex-wrap: wrap; color: var(--muted); font-size: .94rem; }
.nav-actions { display:flex; gap:.65rem; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.cta, button {
  border: 0;
  border-radius: 999px;
  background: var(--gold);
  color: #111;
  font-weight: 850;
  padding: .85rem 1.15rem;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 .7rem 1.8rem rgba(250,200,45,.12);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.cta:hover, button:hover { transform: translateY(-1px); box-shadow: 0 1rem 2.4rem rgba(250,200,45,.18); }
.ghost { background: var(--panel-2); color: var(--text); border: 1px solid var(--line); }

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .8fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  padding: clamp(3rem, 8vw, 7rem) clamp(1rem, 4vw, 4rem);
}
h1 { font-size: clamp(3rem, 8vw, 6.9rem); line-height: .9; margin: 0 0 1.2rem; letter-spacing: -.075em; }
h2 { font-size: clamp(2rem, 5vw, 4rem); line-height: .96; margin: 0 0 1rem; letter-spacing: -.055em; }
h3 { margin: 0 0 .4rem; font-size: 1.15rem; }
p { color: var(--muted); line-height: 1.65; }
.muted { color: var(--muted); }
.hero p { max-width: 43rem; font-size: 1.17rem; }
.actions { display: flex; gap: .85rem; flex-wrap: wrap; margin-top: 1.5rem; }
.pill { color: #111; background: var(--mint); padding: .45rem .75rem; border-radius: 999px; font-weight: 850; font-size: .82rem; display: inline-flex; }
.pill:nth-of-type(odd) { background: linear-gradient(90deg, var(--ice), var(--gold)); }
.culture-strip {
  display:flex;
  gap:.65rem;
  overflow:hidden;
  padding:.9rem clamp(1rem, 4vw, 4rem);
  border-block:1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(134,231,255,.10), rgba(250,200,45,.10), rgba(123,92,255,.10)),
    rgba(255,255,255,.025);
  white-space:nowrap;
}
.culture-strip span {
  flex:0 0 auto;
  color:var(--text);
  font-weight:950;
  letter-spacing:-.03em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  padding:.55rem .9rem;
  background:rgba(255,255,255,.055);
}
.hero-proof {
  display:flex;
  gap:.65rem;
  flex-wrap:wrap;
  margin-top:1.25rem;
  color:var(--muted);
  font-size:.9rem;
}
.hero-proof span {
  border:1px solid var(--line);
  border-radius:999px;
  padding:.48rem .7rem;
  background:rgba(255,255,255,.045);
}
.social-surface {
  padding-top: clamp(2rem, 5vw, 4.5rem);
  background:
    radial-gradient(circle at 15% 10%, rgba(250,200,45,.13), transparent 28rem),
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.04));
  border-block:1px solid var(--line);
}
.social-mosaic {
  display:grid;
  grid-template-columns:minmax(0, 1.08fr) minmax(300px, .72fr);
  gap:clamp(1.25rem, 4vw, 3rem);
  align-items:center;
}
.tweet-demo {
  display:grid;
  grid-template-columns:3.4rem minmax(0, 1fr);
  gap:.85rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.03)),
    #0b0c10;
}
.vertical-demo {
  display:grid;
  justify-items:center;
}
.vertical-demo .cover-reel-card {
  width:min(88vw, 360px);
  height:min(76vh, 650px);
  flex-basis:auto;
}
.discover-hero {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(280px, .36fr);
  gap:clamp(1.25rem, 4vw, 3rem);
  align-items:end;
}
.discover-mode-card {
  border:1px solid var(--line);
  border-radius:1.5rem;
  padding:1.25rem;
  background:
    radial-gradient(circle at top right, rgba(61,214,171,.18), transparent 12rem),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.028));
}
.discover-mode-card strong {
  display:block;
  font-size:1.25rem;
}
.discover-mode-card .cta {
  display:inline-flex;
  margin-top:.8rem;
}
.mobile-action-bar {
  display:none;
  position:fixed;
  left:.85rem;
  right:.85rem;
  bottom:.85rem;
  z-index:20;
  grid-template-columns:1fr 1fr 1.15fr;
  gap:.45rem;
  padding:.5rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(9,10,13,.82);
  backdrop-filter:blur(18px);
  box-shadow:0 1rem 3rem rgba(0,0,0,.36);
}
.mobile-action-bar a {
  display:grid;
  place-items:center;
  min-height:2.65rem;
  border-radius:999px;
  text-decoration:none;
  color:var(--text);
  font-weight:900;
  background:rgba(255,255,255,.07);
}
.mobile-action-bar .primary {
  color:#111;
  background:var(--gold);
}

.phone {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #171a22, #0b0c10);
  border-radius: 2.3rem;
  padding: 1rem;
  box-shadow: 0 2rem 5rem rgba(0,0,0,.35);
}
.studio-preview {
  padding:1rem;
  display:grid;
  gap:.8rem;
}
.studio-ruler,
.studio-transport {
  border:1px solid var(--line);
  border-radius:1rem;
  padding:.9rem 1rem;
  background:rgba(255,255,255,.055);
  color:var(--muted);
  font-weight:850;
}
.studio-transport {
  text-align:center;
  color:var(--text);
}
.studio-lane {
  border:1px solid var(--line);
  border-radius:1.2rem;
  padding:1rem;
  background:rgba(255,255,255,.04);
}
.studio-lane .wave {
  height:5rem;
  margin:.7rem 0 0;
}
.cover-feed {
  min-height: min(88vh, 820px);
  display: flex;
  gap: 1.1rem;
  align-items: stretch;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  background: #050609;
  border: 1px solid var(--line);
  border-radius: 2rem;
  padding: 1rem;
}
.discover-page .discover-shell {
  max-width: 1180px;
  margin: 0 auto;
}
.discover-page h1 {
  max-width: 980px;
}
.discover-page .feed {
  max-width: 760px;
  margin: 0 auto;
  grid-template-columns: 1fr;
}
.discover-page .cover-feed {
  min-height: auto;
  max-width: 920px;
  margin: 0 auto;
  flex-direction: column;
  align-items: center;
  overflow-x: visible;
  scroll-snap-type: y mandatory;
  border: 0;
  background: transparent;
}
.discover-page .cover-reel-card {
  width: min(92vw, 430px);
  height: min(86vh, 760px);
  flex-basis: auto;
}
.cover-reel-card {
  position: relative;
  flex: 0 0 clamp(300px, 34vw, 410px);
  width: clamp(300px, 34vw, 410px);
  height: min(84vh, 760px);
  aspect-ratio: 9 / 16;
  scroll-snap-align: center;
  overflow: hidden;
  border-radius: 2rem;
  border: 1px solid rgba(255,255,255,.12);
  display: flex;
  align-items: end;
  padding: 1.2rem;
  background:
    linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.82)),
    radial-gradient(circle at 28% 20%, rgba(134,231,255,.50), transparent 14rem),
    radial-gradient(circle at 78% 38%, rgba(250,200,45,.48), transparent 12rem),
    linear-gradient(145deg, #111827, #050609 68%);
  box-shadow: 0 2rem 5rem rgba(0,0,0,.35), 0 0 3rem rgba(134,231,255,.08);
}
.cover-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.cover-reel-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.86));
  pointer-events: none;
}
.cover-reel-card::before {
  content: "";
  position: absolute;
  inset: 1rem;
  border-radius: 1.5rem;
  border: 1px solid rgba(255,255,255,.08);
  pointer-events: none;
  z-index: 1;
}
.cover-reel-caption {
  position: relative;
  z-index: 2;
  max-width: calc(100% - 4.5rem);
}
.cover-reel-card .side-actions { z-index: 3; }
.cover-reel-card audio,
.post audio {
  width: 100%;
  max-width: 100%;
  accent-color: var(--gold);
}
.room-stage {
  position: relative;
  min-height: 14rem;
  border-radius: 1.25rem;
  display: grid;
  place-items: center;
  align-content: center;
  gap: .7rem;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
  background:
    radial-gradient(circle at 50% 28%, rgba(255,255,255,.24), transparent 10rem),
    linear-gradient(160deg, var(--room-color, var(--gold)), #08090d 78%);
  border: 1px solid rgba(255,255,255,.12);
}
.room-stage::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 42%;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.62));
  z-index: -1;
}
.room-stage span {
  position: absolute;
  top: 1rem;
  left: 1rem;
  font-size: .72rem;
  letter-spacing: .16em;
  font-weight: 900;
  color: rgba(255,255,255,.82);
}
.room-stage strong {
  font-size: clamp(1.6rem, 4vw, 2.8rem);
  line-height: .95;
  text-align: center;
  max-width: 80%;
}
.room-stage small { color: rgba(255,255,255,.78); font-weight: 800; }
.room-performer {
  width: clamp(5.5rem, 28vw, 9rem);
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle at 50% 34%, rgba(255,255,255,.16), transparent 27%),
    linear-gradient(180deg, rgba(0,0,0,.78), rgba(0,0,0,.94));
  box-shadow: 0 2rem 5rem rgba(0,0,0,.35);
}
.cover-room-stage {
  position: absolute;
  inset: 0;
  min-height: 100%;
  border-radius: 0;
  border: 0;
}
.room-reel-card { background: #08090d; }
.post audio { margin-top: .25rem; }
.post-media {
  width: 100%;
  max-height: 18rem;
  object-fit: cover;
  border-radius: 1rem;
  border: 1px solid rgba(255,255,255,.1);
  background: #050609;
}
.screen {
  border-radius: 1.6rem;
  overflow: hidden;
  background: #050609;
  min-height: 34rem;
  border: 1px solid rgba(255,255,255,.08);
}
.cover-card {
  position: relative;
  min-height: 34rem;
  display: flex;
  flex-direction: column;
  justify-content: end;
  padding: 1.2rem;
  background:
    linear-gradient(180deg, transparent 25%, rgba(0,0,0,.88)),
    linear-gradient(135deg, #6741d9, #fac82d 48%, #111);
}
.side-actions { position: absolute; right: .8rem; bottom: 7rem; display: grid; gap: .9rem; text-align: center; font-size: .75rem; }
.side-actions a { text-decoration:none; color:var(--text); }
.cover-action {
  display:grid;
  gap:.25rem;
  justify-items:center;
  padding:0;
  background:transparent;
  color:var(--text);
  font-size:.75rem;
}
.bubble { width: 3rem; height: 3rem; border-radius: 999px; background: rgba(255,255,255,.16); display:grid; place-items:center; font-size:1.25rem; }
.wave { height: 4.2rem; display: flex; align-items: end; gap: .18rem; margin: 1rem 0; }
.wave span { flex: 1; min-width: .14rem; border-radius: 999px; background: var(--gold); opacity: .95; }
.wave span:nth-child(3n) { background: var(--ice); }
.wave span:nth-child(5n) { background: var(--mint); }

.section { padding: clamp(4rem, 8vw, 7rem) clamp(1.15rem, 4vw, 4.5rem); }
.section-intro {
  max-width: 820px;
  margin-bottom: clamp(1.75rem, 4vw, 3rem);
}
.grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.45rem); }
.card {
  background:
    radial-gradient(circle at top right, rgba(134,231,255,.09), transparent 13rem),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  border: 1px solid var(--line);
  border-radius: 1.5rem;
  padding: clamp(1.25rem, 2vw, 1.7rem);
  box-shadow: 0 1.2rem 3rem rgba(0,0,0,.18);
}
.culture-deck {
  background:
    radial-gradient(circle at 18% 20%, rgba(134,231,255,.13), transparent 28rem),
    radial-gradient(circle at 85% 0%, rgba(250,200,45,.11), transparent 30rem);
}
.culture-grid {
  display:grid;
  grid-template-columns:1.2fr .9fr .9fr;
  gap:clamp(1rem, 2vw, 1.4rem);
}
.culture-card {
  min-height:22rem;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  border-radius:1.8rem;
  padding:1.4rem;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:
    linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.68)),
    radial-gradient(circle at 20% 15%, rgba(134,231,255,.42), transparent 13rem),
    linear-gradient(135deg, #111827, #08090d);
  box-shadow:0 2rem 5rem rgba(0,0,0,.28);
}
.culture-card::before {
  content:"";
  position:absolute;
  inset:1rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:1.25rem;
  pointer-events:none;
}
.culture-card span {
  position:absolute;
  top:1.35rem;
  left:1.35rem;
  width:2.8rem;
  height:2.8rem;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--gold);
  color:#111;
  font-weight:950;
}
.culture-card h3 {
  font-size:clamp(2rem, 4vw, 3.4rem);
  line-height:.9;
  letter-spacing:-.07em;
}
.primary-culture {
  background:
    linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.72)),
    radial-gradient(circle at 20% 10%, rgba(250,200,45,.50), transparent 14rem),
    radial-gradient(circle at 75% 22%, rgba(134,231,255,.42), transparent 14rem),
    linear-gradient(135deg, #111827, #050609);
}
.workflow {
  background:
    linear-gradient(90deg, rgba(250,200,45,.075), transparent),
    rgba(255,255,255,.018);
  border-block:1px solid var(--line);
}
.steps {
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:clamp(1rem, 2vw, 1.45rem);
}
.step-card {
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:1.4rem;
  padding:1.2rem;
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
}
.step-card span {
  display:inline-grid;
  place-items:center;
  width:2.4rem;
  height:2.4rem;
  margin-bottom:1.2rem;
  border-radius:999px;
  background:var(--gold);
  color:#111;
  font-weight:950;
}
.step-card::after {
  content:"";
  position:absolute;
  right:-2.5rem;
  top:-2.5rem;
  width:7rem;
  height:7rem;
  border-radius:999px;
  background:rgba(61,214,171,.12);
}
.spotlight {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(320px, 1.14fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
.spotlight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.35rem);
}
.mini-card {
  min-height: 9rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: .85rem;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  padding: 1rem;
  background:
    radial-gradient(circle at top right, rgba(250,200,45,.18), transparent 9rem),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
}
.mini-card strong {
  color: var(--text);
  font-size: 1rem;
}
.mini-card span {
  color: var(--muted);
  line-height: 1.45;
  font-size: .94rem;
}
.split-section {
  display:grid;
  grid-template-columns: minmax(0, .95fr) minmax(300px, .8fr);
  gap:clamp(2rem, 5vw, 4rem);
  align-items:center;
}
.check-list {
  margin:1.25rem 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.75rem;
  color:var(--muted);
}
.check-list li {
  position:relative;
  padding-left:2rem;
  line-height:1.55;
}
.check-list li::before {
  content:"✓";
  position:absolute;
  left:0;
  top:.05rem;
  width:1.25rem;
  height:1.25rem;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--mint);
  color:#111;
  font-size:.78rem;
  font-weight:950;
}
.tool-stack {
  display:grid;
  gap:.85rem;
}
.tool-stack article,
.pricing-card {
  border:1px solid var(--line);
  border-radius:1.5rem;
  padding:1.25rem;
  background:
    radial-gradient(circle at top right, rgba(250,200,45,.18), transparent 11rem),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
}
.tool-stack strong {
  display:block;
  font-size:1.15rem;
  margin-bottom:.35rem;
}
.tool-stack span { color:var(--muted); line-height:1.5; }
.pricing-card {
  padding:1.6rem;
  box-shadow:0 2rem 5rem rgba(0,0,0,.25);
}
.pricing-card h3 {
  font-size:clamp(1.8rem, 4vw, 3rem);
  line-height:1;
  letter-spacing:-.05em;
  margin:1rem 0;
}
.trust-section {
  background:rgba(255,255,255,.018);
  border-block:1px solid var(--line);
}
.faq-list {
  max-width: 920px;
  display:grid;
  gap:.75rem;
}
.faq-list details {
  border:1px solid var(--line);
  border-radius:1.1rem;
  padding:1rem 1.1rem;
  background:rgba(255,255,255,.045);
}
.faq-list summary {
  cursor:pointer;
  font-weight:900;
}
.faq-list p { margin-bottom:0; }
.final-cta {
  text-align:center;
  max-width:1040px;
  margin:0 auto;
}
.final-cta .actions { justify-content:center; }
.feature-hero {
  max-width: 1120px;
}
.feature-hero p {
  max-width: 760px;
  font-size: 1.12rem;
}
.artist-pass-hero {
  align-items: stretch;
}
.artist-pass-card {
  position: relative;
  overflow: hidden;
  align-self: center;
  min-height: min(70vh, 620px);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 2rem;
  padding: clamp(1.35rem, 3vw, 2rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background:
    linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.78)),
    radial-gradient(circle at 25% 12%, rgba(250,200,45,.58), transparent 15rem),
    radial-gradient(circle at 80% 20%, rgba(134,231,255,.44), transparent 15rem),
    linear-gradient(135deg, #171a22, #050609);
  box-shadow: 0 2.2rem 5.5rem rgba(0,0,0,.36);
}
.artist-pass-card::before {
  content: "";
  position: absolute;
  inset: 1rem;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 1.35rem;
  pointer-events: none;
}
.artist-pass-card h2 {
  position: relative;
  z-index: 1;
  font-size: clamp(2.4rem, 5vw, 4.6rem);
}
.artist-pass-card p,
.pass-kicker,
.pass-price,
.pass-wave {
  position: relative;
  z-index: 1;
}
.pass-kicker,
.pass-price {
  width: max-content;
  max-width: 100%;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  padding: .55rem .75rem;
  background: rgba(255,255,255,.10);
  font-weight: 950;
}
.pass-kicker {
  position: absolute;
  top: 1.5rem;
  left: 1.5rem;
  color: #111;
  background: var(--gold);
}
.pass-wave {
  height: 5.2rem;
  margin-top: 1.1rem;
  border-radius: 1rem;
  background:
    linear-gradient(90deg, transparent 0 7%, rgba(250,200,45,.95) 7% 10%, transparent 10% 14%, rgba(134,231,255,.85) 14% 17%, transparent 17% 23%, rgba(61,214,171,.9) 23% 26%, transparent 26% 32%, rgba(250,200,45,.8) 32% 38%, transparent 38% 44%, rgba(134,231,255,.9) 44% 48%, transparent 48% 55%, rgba(250,200,45,.92) 55% 60%, transparent 60% 68%, rgba(61,214,171,.8) 68% 71%, transparent 71% 78%, rgba(250,200,45,.86) 78% 84%, transparent 84% 100%),
    rgba(255,255,255,.08);
}
.exchange-ticket {
  position: relative;
  overflow: hidden;
  align-self: center;
  min-height: min(68vh, 590px);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 2rem;
  padding: clamp(1.35rem, 3vw, 2rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background:
    linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.78)),
    radial-gradient(circle at 25% 12%, rgba(61,214,171,.42), transparent 15rem),
    radial-gradient(circle at 80% 20%, rgba(250,200,45,.50), transparent 15rem),
    linear-gradient(135deg, #151820, #050609);
  box-shadow: 0 2.2rem 5.5rem rgba(0,0,0,.36);
}
.exchange-ticket::before {
  content: "";
  position: absolute;
  inset: 1rem;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 1.35rem;
  pointer-events: none;
}
.exchange-ticket h2 {
  position: relative;
  z-index: 1;
  font-size: clamp(2.4rem, 5vw, 4.6rem);
}
.exchange-ticket p,
.exchange-index {
  position: relative;
  z-index: 1;
}
.exchange-index {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  margin: 1rem 0 .2rem;
  padding: .85rem 1rem;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 1rem;
  background: rgba(255,255,255,.09);
}
.exchange-index span {
  color: var(--gold);
  font-weight: 950;
}
.process-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.35rem);
}
.process-grid article {
  border: 1px solid var(--line);
  border-radius: 1.35rem;
  padding: 1.2rem;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
}
.process-grid span {
  display: inline-grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  margin-bottom: 1rem;
  border-radius: 999px;
  color: #111;
  background: linear-gradient(90deg, var(--ice), var(--gold));
  font-weight: 950;
}
.process-grid strong {
  display: block;
  font-size: 1.05rem;
}
.process-grid p {
  margin-bottom: 0;
}
.plus-hero {
  grid-template-columns: minmax(0, 1fr) minmax(320px, .62fr);
}
.screenshot-section {
  overflow: hidden;
}
.screenshot-strip {
  display: flex;
  gap: clamp(1rem, 2vw, 1.4rem);
  overflow-x: auto;
  padding: .4rem .2rem 1.25rem;
  scroll-snap-type: x mandatory;
}
.app-shot {
  flex: 0 0 clamp(210px, 22vw, 310px);
  margin: 0;
  scroll-snap-align: start;
}
.app-shot img {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 19.5;
  object-fit: cover;
  object-position: top;
  border: 1px solid var(--line);
  border-radius: 1.65rem;
  background: #050609;
  box-shadow: 0 1.5rem 4rem rgba(0,0,0,.3);
}
.app-shot figcaption {
  color: var(--muted);
  line-height: 1.45;
  margin-top: .85rem;
  font-weight: 750;
  font-size: .94rem;
}
.timeline {
  display:grid;
  gap:1rem;
  max-width:980px;
}
.update-card {
  border:1px solid var(--line);
  border-radius:1.5rem;
  padding:1.4rem;
  background:
    radial-gradient(circle at top left, rgba(61,214,171,.11), transparent 16rem),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
}
.update-card h2 {
  font-size:clamp(1.7rem, 4vw, 3rem);
  margin-top:.8rem;
}
.discover-toggle,
.discover-sort { display:flex; gap:.6rem; margin:1rem 0 1.4rem; flex-wrap:wrap; align-items:center; }
.discover-sort {
  margin-top:-.55rem;
  padding:.7rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  width:max-content;
  max-width:100%;
}
.discover-sort span { font-weight:850; padding:0 .35rem; }
.discover-sort button { padding:.62rem .9rem; }
.feed { display:grid; grid-template-columns: 1fr 1fr; gap:1rem; }
.post { display:grid; gap:.7rem; }
.tweet-post {
  display:grid;
  grid-template-columns: 3.4rem minmax(0, 1fr);
  gap:.8rem;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.035);
}
.tweet-rail {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.65rem;
}
.thread-line {
  width:2px;
  flex:1;
  min-height:3rem;
  background:rgba(255,255,255,.16);
}
.tweet-body { min-width:0; }
.post-head { display:flex; gap:.7rem; align-items:flex-start; justify-content:space-between; }
.post-menu { text-decoration:none; letter-spacing:.12em; }
.avatar { width:2.8rem; height:2.8rem; border-radius:999px; background:linear-gradient(135deg,var(--gold),var(--mint)); object-fit:cover; flex:0 0 2.8rem; }
.tweet-actions a,
.link-action {
  color:var(--muted);
  text-decoration:none;
  background:transparent;
  border:0;
  padding:0;
  font:inherit;
  font-weight:700;
}
.tweet-actions a:hover,
.link-action:hover { color:var(--gold); }
.reply-preview {
  border-left: 2px solid rgba(255,255,255,.16);
  padding-left:.85rem;
  margin-top:.3rem;
  color:var(--muted);
}
.reply-preview a { color:var(--gold); text-decoration:none; }
.stats { display:flex; gap:1rem; color:var(--muted); font-size:.9rem; flex-wrap:wrap; }
.artist-pass-lock {
  display: grid;
  gap: .25rem;
  margin: .85rem 0;
  padding: .85rem 1rem;
  border: 1px solid rgba(134,231,255,.28);
  border-radius: 1rem;
  background:
    radial-gradient(circle at top left, rgba(134,231,255,.16), transparent 12rem),
    rgba(255,255,255,.055);
}
.artist-pass-lock strong {
  color: var(--ice);
}
.artist-pass-lock span {
  color: var(--muted);
  line-height: 1.45;
  font-size: .92rem;
}
.comment-box {
  margin-top:1rem;
  padding:1rem;
  border:1px solid var(--line);
  border-radius:1.1rem;
  background:rgba(0,0,0,.22);
}
.comment-box textarea {
  resize:vertical;
  min-height:5rem;
  margin:.55rem 0;
}
.comment-list {
  display:grid;
  gap:.6rem;
  margin-top:.9rem;
}
.inline-comment {
  border-left:2px solid rgba(250,200,45,.5);
  padding:.2rem 0 .2rem .75rem;
}
.inline-comment p {
  margin:.15rem 0 0;
}
.account-strip {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin:1rem 0;
}
.account-strip p { margin:.25rem 0 0; }
.compact { margin-top:0; }
.auth-shell {
  display:grid;
  grid-template-columns:minmax(0, .9fr) minmax(320px, .7fr);
  gap:clamp(1.25rem, 4vw, 3rem);
  align-items:start;
  margin-bottom:1.5rem;
}
.auth-intro {
  max-width:760px;
}
.auth-card {
  position:sticky;
  top:6rem;
}
.social-auth-grid {
  display:grid;
  gap:.65rem;
  margin:1rem 0;
}
.social-auth-button {
  width:100%;
  border:1px solid var(--line);
  border-radius:1rem;
  background:rgba(255,255,255,.07);
  color:var(--text);
  padding:1rem;
  text-align:center;
  font-weight:900;
}
.social-auth-button:hover {
  border-color:rgba(250,200,45,.55);
  background:rgba(250,200,45,.10);
}
.divider {
  display:flex;
  align-items:center;
  gap:.7rem;
  margin:1rem 0;
  color:var(--muted);
  font-size:.85rem;
  font-weight:800;
}
.divider::before,
.divider::after {
  content:"";
  flex:1;
  height:1px;
  background:var(--line);
}
.field-label {
  display:block;
  color:var(--muted);
  font-size:.85rem;
  font-weight:800;
  margin:.8rem 0 .35rem;
}
.account-input {
  width:100%;
  border:1px solid var(--line);
  border-radius:1rem;
  background:rgba(255,255,255,.06);
  color:var(--text);
  padding:.9rem 1rem;
  font:inherit;
  outline:none;
}
.account-input:focus {
  border-color:var(--gold);
  box-shadow:0 0 0 .18rem rgba(250,200,45,.14);
}
.login-overlay {
  position:fixed;
  inset:0;
  z-index:50;
  display:grid;
  place-items:center;
  padding:1rem;
  background:rgba(0,0,0,.66);
  backdrop-filter:blur(12px);
}
.login-modal {
  width:min(100%, 440px);
  border:1px solid var(--line);
  border-radius:1.65rem;
  padding:1.35rem;
  background:
    radial-gradient(circle at top left, rgba(250,200,45,.18), transparent 18rem),
    var(--panel);
  box-shadow:0 2rem 5rem rgba(0,0,0,.42);
}
.login-modal h3 { font-size:1.45rem; }
.login-modal p { margin:.45rem 0 0; }
.login-modal .actions { margin-top:1.1rem; }
.artist-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:.75rem; }
.tile { aspect-ratio: 1; border-radius:1rem; background:linear-gradient(135deg, rgba(250,200,45,.9), rgba(61,214,171,.55)); padding:.75rem; display:flex; align-items:end; color:#111; font-weight:900; }
.footer { border-top:1px solid var(--line); padding:2rem clamp(1rem,4vw,4rem); color:var(--muted); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.legal { max-width: 820px; margin: auto; }
.legal h2 { margin-top: 2rem; color: var(--gold); }
.hidden { display:none; }

@media (max-width: 860px) {
  .hero, .feed, .spotlight, .split-section, .auth-shell, .plus-hero, .social-mosaic, .discover-hero { grid-template-columns: 1fr; }
  .grid, .artist-grid, .steps, .culture-grid, .process-grid { grid-template-columns: 1fr 1fr; }
  .links { display:none; }
  .nav { align-items:flex-start; }
  .auth-card { position:static; }
  .footer { padding-bottom:6rem; }
  .mobile-action-bar { display:grid; }
}

@media (max-width: 520px) {
  .grid, .artist-grid, .spotlight-grid, .steps, .culture-grid, .process-grid { grid-template-columns: 1fr; }
  .actions a, .actions button { width:100%; text-align:center; }
  .nav-actions { width:100%; justify-content:stretch; }
  .nav-actions .cta { flex:1; text-align:center; }
  .cover-feed { padding:.4rem; border-radius:1.3rem; }
  .cover-reel-card {
    flex-basis: min(86vw, 380px);
    width: min(86vw, 380px);
    height: min(78vh, 680px);
    border-radius:1.4rem;
  }
}