body[data-page="ugc"]{
  --bg:#0A0A0A;
  --ink:#F4F3EF;
  --muted:#9A9A9F;
  --accent:#A855F7;
}
body[data-page="ugc"] .site-nav{ background:rgba(11,11,13,0); border-bottom:1px solid transparent; }
body[data-page="ugc"] .site-nav.scrolled{ background:rgba(11,11,13,.85); border-bottom:1px solid rgba(255,255,255,.08); }
body[data-page="ugc"] .nav-brand .dot{ background:var(--accent); }
body[data-page="ugc"] .nav-links a:hover{ background:rgba(255,255,255,.08); }
body[data-page="ugc"] .nav-links a.active{ background:var(--ink); color:#0B0B0D; }
body[data-page="ugc"] .nav-toggle span{ background:var(--ink); }
@media (max-width:880px){ body[data-page="ugc"] .nav-links{ background:#101012; } }
body[data-page="ugc"] .btn{ border-color:rgba(255,255,255,.3); color:var(--ink); }
body[data-page="ugc"] .btn.primary{ background:var(--ink); color:#0B0B0D; border-color:var(--ink); }

.ugc-shell{
  min-height:88vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:var(--nav-h) 24px 60px;
  position:relative;
  overflow:hidden;
}
.ugc-shell::before{
  content:'';
  position:absolute; inset:-10%;
  background:radial-gradient(45% 55% at 50% 40%, rgba(168,85,247,.16), transparent 70%);
  pointer-events:none;
}
.ugc-inner{ position:relative; z-index:1; max-width:640px; }
.ugc-badge{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'JetBrains Mono',monospace;
  font-size:.76rem; letter-spacing:.1em; text-transform:uppercase;
  padding:8px 16px; border-radius:100px;
  border:1px solid rgba(168,85,247,.35);
  color:var(--accent);
  margin-bottom:30px;
}
.ugc-badge .dot2{ width:7px; height:7px; border-radius:50%; background:var(--accent); animation:blink 1.6s infinite; }
@keyframes blink{ 0%,100%{ opacity:1; } 50%{ opacity:.25; } }

.ugc-title{
  font-family:'Bricolage Grotesque',sans-serif;
  font-weight:700;
  font-size:clamp(2.6rem,9vw,5.5rem);
  letter-spacing:-.03em;
  line-height:1;
  background:linear-gradient(100deg,#F4F3EF,#A855F7 60%,#F4F3EF);
  background-size:200% auto;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:sheen 5s linear infinite;
}
@keyframes sheen{
  0%{ background-position:0% 50%; }
  100%{ background-position:200% 50%; }
}
.ugc-shell p{
  margin-top:26px;
  color:var(--muted);
  font-size:1.06rem;
  line-height:1.65;
}
.ugc-cta{ margin-top:36px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
