/* ===================================================================
 *  Shared link-in-bio styles. Each brand page overrides the --accent /
 *  --glow vars in a tiny inline <style> to re-theme. Nothing else changes.
 * =================================================================== */
:root{
  --ink:#0e0c14; --ink2:#1a1526; --panel:#16151c; --cream:#efece6; --lav:#9b96a6;
  /* themable — defaults = Kavita Singh Today gold */
  --accent:#d8b46a; --accent-2:#e9d4a0; --accent-deep:#7d6a3a;
  --glow1:rgba(216,180,106,.14); --glow2:rgba(207,106,99,.10); --glow3:rgba(95,174,126,.10);
  --line:rgba(216,180,106,.18);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  min-height:100vh; min-height:100dvh;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--cream);
  background:
    radial-gradient(1200px 600px at 50% -10%, var(--glow1), transparent 60%),
    radial-gradient(900px 700px at 90% 110%, var(--glow3), transparent 55%),
    radial-gradient(900px 700px at 10% 100%, var(--glow2), transparent 55%),
    linear-gradient(180deg, var(--ink) 0%, var(--ink2) 100%);
  background-attachment:fixed;
  display:flex; justify-content:center; padding:48px 20px 56px;
}
.wrap{width:100%; max-width:520px}

.hero{display:flex; flex-direction:column; align-items:center; text-align:center}
.kicker{font-size:11px; letter-spacing:3px; text-transform:uppercase; color:var(--accent);
  opacity:.85; margin-bottom:18px; animation:rise .6s ease both}
.avatar{
  width:104px; height:104px; border-radius:50%; display:grid; place-items:center;
  position:relative; font-family:Georgia,serif; font-size:38px; color:var(--accent-2);
  background:linear-gradient(160deg,#241d09,#1b1a23);
  box-shadow:0 0 0 2px var(--ink), 0 0 0 4px var(--accent), 0 18px 40px rgba(0,0,0,.5);
  overflow:hidden; animation:pop .7s cubic-bezier(.2,.9,.3,1.4) both;
}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar::after{content:""; position:absolute; inset:-40%;
  background:conic-gradient(from 0deg, transparent 0 70%, var(--accent-2) 85%, transparent 100%);
  opacity:.55; animation:spin 6s linear infinite}
.avatar .ring-mask{position:absolute; inset:4px; border-radius:50%;
  background:linear-gradient(160deg,#241d09,#1b1a23); display:grid; place-items:center; z-index:1}
.name{font-family:Georgia,serif; font-size:27px; letter-spacing:.3px; margin:18px 0 0;
  display:flex; align-items:center; gap:8px; animation:rise .6s ease .05s both}
.dot{width:9px;height:9px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent); animation:pulse 2.4s ease-in-out infinite}
.tagline{color:var(--lav); font-size:14.5px; line-height:1.5; max-width:340px; margin:10px auto 0;
  animation:rise .6s ease .12s both}

.links{margin-top:30px; display:flex; flex-direction:column; gap:13px}
.lnk{--d:0ms; position:relative; display:flex; align-items:center; gap:14px; text-decoration:none;
  color:var(--cream); background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  border:1px solid var(--line); border-radius:16px; padding:16px 18px; overflow:hidden;
  transition:transform .18s ease, border-color .25s ease, box-shadow .25s ease;
  animation:rise .55s cubic-bezier(.2,.8,.3,1) var(--d) both}
.lnk:active{transform:scale(.98)}
@media(hover:hover){
  .lnk:hover{transform:translateY(-3px); border-color:color-mix(in srgb,var(--accent) 50%,transparent);
    box-shadow:0 14px 30px rgba(0,0,0,.4)}
  .lnk:hover .sheen{transform:translateX(220%)}
}
.sheen{position:absolute; top:0; left:0; height:100%; width:40%;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent-2) 16%,transparent),transparent);
  transform:translateX(-220%); transition:transform .8s ease; pointer-events:none}
.ic{flex:0 0 40px; height:40px; border-radius:11px; display:grid; place-items:center; font-size:18px;
  color:var(--accent-2);
  background:radial-gradient(circle at 30% 30%, color-mix(in srgb,var(--accent) 22%,transparent), color-mix(in srgb,var(--accent) 5%,transparent));
  border:1px solid color-mix(in srgb,var(--accent) 22%,transparent)}
.txt{flex:1; min-width:0}
.lbl{display:block; font-size:15.5px; font-weight:600; letter-spacing:.2px}
.sub{display:block; font-size:12.5px; color:var(--lav); margin-top:3px; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis}
.arr{flex:0 0 auto; color:var(--lav); font-size:17px; transition:transform .2s, color .2s}
.lnk:hover .arr{transform:translateX(3px); color:var(--accent)}
.badge{position:absolute; top:10px; right:46px; font-size:10px; font-weight:700; letter-spacing:.5px;
  text-transform:uppercase; color:var(--ink);
  background:linear-gradient(90deg,var(--accent),var(--accent-2)); padding:3px 8px; border-radius:99px}
.lnk.feat{background:linear-gradient(135deg, color-mix(in srgb,var(--accent) 22%,transparent), color-mix(in srgb,var(--accent-deep) 10%,transparent));
  border-color:color-mix(in srgb,var(--accent) 55%,transparent)}
.lnk.feat .ic{background:linear-gradient(135deg,var(--accent),var(--accent-deep)); color:var(--ink); border:none}
.lnk.feat .lbl{color:var(--accent-2)}

.lead-btn{margin-top:22px; width:100%; cursor:pointer; color:var(--ink); font:inherit; font-size:15px;
  font-weight:700; letter-spacing:.3px; background:linear-gradient(90deg,var(--accent-2),var(--accent));
  border:none; border-radius:16px; padding:16px; display:flex; align-items:center; justify-content:center;
  gap:9px; box-shadow:0 10px 26px color-mix(in srgb,var(--accent) 25%,transparent);
  animation:rise .55s ease .5s both; transition:transform .15s ease, box-shadow .25s ease}
.lead-btn:active{transform:scale(.98)}
.lead-btn:hover{box-shadow:0 14px 34px color-mix(in srgb,var(--accent) 40%,transparent)}

/* cross-brand footer — "my other worlds" */
.worlds{margin-top:38px; text-align:center; animation:rise .6s ease .6s both}
.worlds .wlabel{font-size:10.5px; letter-spacing:2.5px; text-transform:uppercase; color:rgba(155,150,166,.6)}
.worlds .wrow{margin-top:12px; display:flex; flex-direction:column; gap:8px; align-items:center}
.worlds a{color:var(--lav); text-decoration:none; font-family:Georgia,serif; font-size:14.5px;
  letter-spacing:.3px; border-bottom:1px solid transparent; transition:color .2s, border-color .2s; padding-bottom:1px}
.worlds a:hover{color:var(--accent-2); border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
.worlds .sep{color:rgba(155,150,166,.35)}
.foot{margin-top:26px; text-align:center; color:rgba(155,150,166,.55); font-size:11px; letter-spacing:.4px}
.foot b{color:var(--accent);font-weight:600}

.scrim{position:fixed; inset:0; background:rgba(8,6,14,.66); backdrop-filter:blur(4px); display:none;
  align-items:flex-end; justify-content:center; z-index:50}
.scrim.on{display:flex; animation:fade .25s ease both}
.sheet{width:100%; max-width:520px; background:linear-gradient(180deg,var(--panel),#0d0b12);
  border:1px solid var(--line); border-bottom:none; border-radius:22px 22px 0 0;
  padding:26px 22px calc(26px + env(safe-area-inset-bottom)); position:relative;
  animation:up .35s cubic-bezier(.2,.9,.3,1) both}
@media(min-width:560px){.scrim{align-items:center}.sheet{border-radius:22px;border-bottom:1px solid var(--line)}}
.grab{width:42px;height:4px;border-radius:99px;background:color-mix(in srgb,var(--accent) 40%,transparent);margin:0 auto 18px}
.sheet h2{font-family:Georgia,serif;font-size:22px;margin:0 0 6px;color:var(--accent-2)}
.sheet p{color:var(--lav);font-size:13.5px;margin:0 0 18px;line-height:1.5}
.fld{width:100%;font:inherit;font-size:15px;color:var(--cream);background:rgba(255,255,255,.04);
  border:1px solid var(--line);border-radius:12px;padding:14px 15px;margin-bottom:11px;outline:none;transition:border-color .2s}
.fld:focus{border-color:var(--accent)}
.fld::placeholder{color:rgba(155,150,166,.7)}
.submit{width:100%;cursor:pointer;font:inherit;font-size:15px;font-weight:700;color:var(--ink);
  background:linear-gradient(90deg,var(--accent-2),var(--accent));border:none;border-radius:13px;
  padding:15px;margin-top:6px;transition:transform .15s,opacity .2s}
.submit:active{transform:scale(.98)}
.submit:disabled{opacity:.6;cursor:default}
.ok{text-align:center;padding:14px 0 4px;color:#5fae7e;font-size:15px;font-weight:600}
.x{position:absolute;top:14px;right:16px;color:var(--lav);font-size:24px;cursor:pointer;background:none;border:none;line-height:1}

@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.7}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes up{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
