/* Shared base styles for all Lilacs pages - optimized for performance */
:root{
  --bg0:#070712;--bg1:#120a1a;
  --lilac:#A259FF;--mint:#72F5D5;
  --text:#E8E8F2;--muted:#A7A7BF;
  --card:#0f0b16d9;--ring:rgba(162,89,255,.6);
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --radius:20px;--tap:48px;--pad:16px;
  --safe-top:env(safe-area-inset-top);
  --safe-bottom:env(safe-area-inset-bottom);
  --safe-left:env(safe-area-inset-left);
  --safe-right:env(safe-area-inset-right);
  --HERO_MAX_W:860px;--HERO_PAD_X:20px;
  --alert-dot:#ff5b5b;
  --alert-dot-ring:rgba(7,7,18,.85);
  --Z_DECOR:-2;--Z_CONTENT:0;--Z_MENU:2147483647;
}

*{box-sizing:border-box}
html,body{height:100%}
html{background:var(--bg1)}
body{
  margin:0;color:var(--text);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  padding-left:max(var(--safe-left),0);
  padding-right:max(var(--safe-right),0);
}

/* Background effects */
.bg-bleed{
  position:fixed;inset:-50vh -22vw;z-index:var(--Z_DECOR);pointer-events:none;
  background:
    radial-gradient(700px 560px at 80% -10%,#2b173f 0%,rgba(43,23,63,0) 60%),
    radial-gradient(560px 480px at -10% 10%,#10213a 0%,rgba(16,33,58,0) 60%),
    linear-gradient(180deg,var(--bg0),var(--bg1));
}

.orb{
  position:fixed;border-radius:50%;pointer-events:none;z-index:calc(var(--Z_DECOR) + 1);
  width:210px;height:210px;filter:blur(36px);opacity:.28;transform:translateZ(0);
  animation:float 14s ease-in-out infinite;
}
.orb.a{left:-88px;bottom:-88px;background:radial-gradient(circle at 35% 35%,var(--lilac),transparent 60%)}
.orb.b{right:-96px;bottom:-72px;animation-duration:18s;animation-delay:-3s;background:radial-gradient(circle at 65% 40%,var(--mint),transparent 60%);}
@keyframes float{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(6px,-16px,0)}}

@media (min-width:768px){
  .orb{width:280px;height:280px;filter:blur(48px)}
  .orb.a{left:-110px;bottom:-110px}
  .orb.b{right:-120px;bottom:-90px}
}

@media (prefers-reduced-motion:reduce){
  .orb{animation:none}
  .reveal{animation:none!important;opacity:1!important;transform:none!important}
}

/* Layout */
.page{min-height:100dvh;display:flex;flex-direction:column;padding-top:max(var(--safe-top),0);position:relative}
.wrap{max-width:1120px;margin:0 auto;padding:24px var(--pad) 0;width:100%}

/* Typography */
.accent{
  font-weight:700;
  background:linear-gradient(135deg,var(--mint),var(--lilac));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

/* Reveal animations */
.reveal{opacity:0;transform:translateY(10px);animation:rise .5s ease forwards}
.d1{animation-delay:.06s}.d2{animation-delay:.12s}.d3{animation-delay:.18s}
@keyframes rise{to{opacity:1;transform:none}}

/* Footer */
.footer-wrap{
  margin-top:auto;
  display:flex;flex-direction:column;align-items:center;
  padding:0 var(--pad) calc(16px + max(var(--safe-bottom),8px));
  position:relative;z-index:var(--Z_CONTENT);
}
footer{padding-top:20px;text-align:center;color:#9aa3b8;font-size:12px}

/* Alert indicators for nav */
.hamburger.has-alert{position:relative}
.hamburger.has-alert::after{
  content:"";position:absolute;top:-6px;right:-6px;width:10px;height:10px;
  border-radius:50%;background:var(--alert-dot);box-shadow:0 0 0 6px var(--alert-dot-ring);
}
#menu a.has-alert{position:relative}
#menu a.has-alert::after{
  content:"";position:absolute;top:-6px;right:-6px;width:8px;height:8px;
  border-radius:50%;background:var(--alert-dot);box-shadow:0 0 0 5px var(--alert-dot-ring);
}