/* SANYOG funnel — parchment theme (Astro Vela–derived tokens).
   Mobile-first: the whole app is one 460px column; on desktop the column
   floats centered on a deeper paper ground. */

:root{
  --paper:#f4ead7; --paper-deep:#ead9bb; --paper-light:#fffaf0;
  --card:rgba(255,250,240,.9);
  --ink:#30271d; --ink-soft:#665a4b; --muted:#8a7b68;
  --gold:#9c6d2d; --gold-dark:#8a5f26; --gold-light:#d9b76d; --gold-pale:#f0dfb9;
  --night:#081225; --rose:#a45168; --rose-dark:#8f4459; --green:#28796e;
  --line:rgba(112,76,35,.2); --line-strong:rgba(112,76,35,.34);
  --danger:#9b3f3b;
  --shadow:0 24px 60px -42px rgba(74,48,21,.58);
  --shadow-night:0 30px 70px -40px rgba(8,18,37,.75);
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --max:460px;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{background:#e4dac8;color:var(--ink);font:400 15px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}
input,select{font:inherit;color:var(--ink)}

/* app column */
.app{max-width:var(--max);margin:0 auto;background:var(--paper);min-height:100dvh;box-shadow:var(--shadow);position:relative}
@media (min-width:520px){ body{padding:0} .app{margin:0 auto} }

/* screens: only the active one shows */
.screen{display:none}
.screen.active{display:block;animation:fadein .35s ease}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* header */
.hdr{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}
.wordmark{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:-.6px}
.wordmark .star{color:var(--gold)}
.hdr-sub{display:flex;align-items:center;gap:12px}
.hdr .back{font-size:18px;color:var(--gold);padding:4px 8px 4px 0}
.chip{font-size:11px;letter-spacing:1px;color:var(--ink-soft);border:1px solid var(--line);background:var(--paper-light);padding:5px 10px;border-radius:999px}
.chip.click{cursor:pointer}

/* type */
.label{font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.label.gold{color:var(--gold)} .label.rose{color:var(--rose)} .label.glight{color:var(--gold-light)}
h1,h2{font-family:var(--serif);font-weight:600;letter-spacing:-.6px;text-wrap:pretty}
.serif{font-family:var(--serif)}

/* buttons */
.btn{display:block;width:100%;text-align:center;font-size:15px;font-weight:600;padding:16px 22px;border-radius:999px;transition:background .15s ease,transform .05s ease}
.btn:active{transform:scale(.985)}
.btn-gold{background:var(--gold);color:var(--paper-light)} .btn-gold:hover{background:var(--gold-dark)}
.btn-gold-onnight{background:var(--gold);color:var(--ink);font-weight:700} .btn-gold-onnight:hover{background:var(--gold-light)}
.btn-rose{background:var(--rose);color:var(--paper-light);box-shadow:0 16px 34px -22px rgba(164,81,104,.9)} .btn-rose:hover{background:var(--rose-dark)}
.linkish{font-size:12.5px;color:var(--gold);text-decoration:underline;cursor:pointer;background:none}
.micro{font-size:11.5px;color:var(--muted)}

/* cards */
.card{background:var(--paper-light);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}
.night{background:var(--night);border-radius:16px;box-shadow:var(--shadow-night);color:var(--paper-light)}
.pale{background:var(--gold-pale);border:1px solid var(--line);border-radius:12px}

/* progress */
.bar{height:4px;background:var(--line);border-radius:999px;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--gold);transition:width .4s ease}

/* fields */
.field{background:var(--paper-light);border:1.5px solid var(--line);border-radius:12px;padding:14px;width:100%;font-size:17px;outline:none}
.field:focus{border-color:var(--gold)}
.field.err{border-color:var(--rose);color:var(--rose)}
.field-label{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.errline{font-size:11.5px;color:var(--rose);min-height:16px;margin-top:8px}
.seg{display:flex;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--paper-light)}
.seg button{flex:1;padding:14px 0;text-align:center;font-size:13px;color:var(--muted)}
.seg button.on{background:var(--gold);color:var(--paper-light);font-weight:600}

/* portrait frames */
.frame{position:relative;overflow:hidden;background:#20293c}
.frame .veil{position:absolute;inset:0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:linear-gradient(180deg,rgba(164,81,104,.24),rgba(48,39,29,.32));display:flex;align-items:center;justify-content:center;font-size:24px}
.portrait-svg{width:100%;height:100%;display:block;filter:blur(10px) saturate(.9)}

/* chat */
.bubble{max-width:82%;font-size:13.5px;line-height:1.5;padding:9px 13px 7px;position:relative}
.bubble.them{align-self:flex-start;background:var(--rose);color:var(--paper-light);border-radius:16px 16px 16px 4px}
.bubble.me{align-self:flex-end;background:var(--paper-light);border:1px solid var(--line);border-radius:16px 16px 4px 16px}
/* WhatsApp-style timestamp: rides on the last line, never on its own row */
.bubble .btime{font-style:normal;font-size:9.5px;letter-spacing:.3px;opacity:.62;margin-left:8px;float:right;line-height:1;position:relative;top:6px;white-space:nowrap}
.bubble.them .btime{color:var(--paper-light)}
.bubble.me .btime,.bubble.astro .btime{color:var(--muted)}
.typing{display:inline-flex;gap:4px;padding:14px 16px}
.typing i{width:6px;height:6px;border-radius:999px;background:rgba(255,250,240,.85);animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}

/* faq */
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);cursor:pointer;width:100%;text-align:left}
.faq-q .t{font-family:var(--serif);font-size:19px}
.faq-q .pm{color:var(--gold);font-size:18px;line-height:1}
.faq-a{display:none;font-size:13px;line-height:1.65;color:var(--ink-soft);padding:0 0 16px}
.faq-item.open .faq-a{display:block}

/* checkbox bump */
.checkbox{flex:none;width:18px;height:18px;border:1.5px solid var(--rose);background:var(--paper-light);margin-top:2px;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--rose);border-radius:4px}
.checkbox.on::after{content:"✓";font-weight:700}

/* footer */
.foot{background:var(--ink);color:rgba(255,250,240,.62);padding:26px 22px 30px;font-size:11.5px;line-height:1.7}
.foot .fm{font-family:var(--serif);font-size:19px;color:var(--paper-light);margin-bottom:8px}
.foot .fm .star{color:var(--gold-light)}

/* report (instant 4-page mini report, print = PDF) */
.rpage{background:var(--paper-light);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);margin:18px;padding:26px 22px;position:relative;overflow:hidden}
.rpage .rp-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.rpage h3{font-family:var(--serif);font-weight:600;font-size:24px;letter-spacing:-.4px;margin-bottom:14px}
.rpage p{font-size:13px;line-height:1.75;color:var(--ink-soft);text-wrap:pretty;white-space:pre-wrap}
.rpage .rp-num{position:absolute;top:22px;right:22px;font-size:10px;letter-spacing:1.5px;color:var(--muted)}
.rtable{width:100%;border-collapse:collapse;font-size:12px}
.rtable td{padding:8px 6px;border-bottom:1px solid rgba(112,76,35,.15)}
.rtable td:last-child{text-align:right;color:var(--ink-soft)}
.rp-skel{height:12px;border-radius:6px;background:linear-gradient(90deg,var(--gold-pale),var(--paper-light),var(--gold-pale));background-size:200% 100%;animation:shimmer 1.4s infinite;margin:8px 0}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@page{ margin:0 }   /* browser ka URL + timestamp header/footer hata deta hai */
@media print{
  body{background:#fff}
  .no-print, .hdr, .foot{display:none !important}
  .screen{display:none !important}
  #s-report{display:block !important}
  .app{max-width:none;box-shadow:none;background:#fff}
  .rpage{border:0;box-shadow:none;border-radius:0;margin:0;padding:22mm 20mm;page-break-after:always;min-height:96vh}
  .rpage:last-child{page-break-after:auto}
}

/* chat quick-question tabs + chips */
.qtab{flex:1;font-size:11.5px;font-weight:600;padding:8px 10px;border-radius:999px;border:1px solid var(--line);background:var(--paper-light);color:var(--muted);white-space:nowrap}
.qtab.on{background:var(--rose);border-color:var(--rose);color:var(--paper-light)}
.qtab.on.chart{background:var(--gold);border-color:var(--gold);color:var(--paper-light)}
/* Kundli wala tab KHULA hai par abhi chuna nahi gaya — sone ke rang mein.

   Pehle dono tab bilkul ek jaise dikhte the (halka, muted), aur khula hua
   kundli-tab bhi utna hi feeka. Nateeja: log kundli ke sawaal PARTNER se
   poochhte rahe ("mera parivar accept karega?", "woh bada hai ya chhota?")
   — jawab to mil jaate the, par unhe pata hi nahi chalta ki uske liye ek
   alag, behtar jagah maujood hai. Ab woh apne aap nazar mein aa jaata hai.

   Pehle 6 second ek halki dhadkan bhi — sirf tab jab woh naya-naya khula ho. */
/* Pehla try `--gold-pale` (#f0dfb9) tha aur woh page ke background
   (#ede0c8) se sirf 1.01:1 alag nikla — yaani ek hi rang. Button hai bhi
   aur dikhta bhi nahi. Ab bhara hua gehra sona: text ka contrast 7.5:1
   (padhne mein aaram), aur kinare ka gehra border page se 3.2:1 — taaki
   shakal saaf kate. Rose wale button ke bagal mein ab yeh doosra ASLI
   button lagta hai, khaali jagah nahi. */
.qtab.chart-ready{border-color:#a8701d;color:#2b1d0a;font-weight:700;
  background:linear-gradient(180deg,#e8b04a,#d99a2b);
  box-shadow:0 1px 3px rgba(112,76,35,.22)}
.qtab.chart-ready.just-open{animation:chartpulse 1.6s ease-in-out 4}
@keyframes chartpulse{
  0%,100%{box-shadow:0 0 0 0 rgba(156,109,45,0)}
  50%    {box-shadow:0 0 0 4px rgba(156,109,45,.22)}
}
.qtab:disabled{opacity:.55}
#chat-chips::-webkit-scrollbar{display:none}
.qchip{flex:none;font-size:12px;padding:8px 13px;border-radius:999px;border:1px solid var(--line);background:var(--paper-light);color:var(--ink);white-space:nowrap;cursor:pointer}
.qchip:active{transform:scale(.97)}
.qchip.chart{border-color:rgba(156,109,45,.5);color:var(--gold-dark)}
.bubble.astro{align-self:flex-start;background:var(--paper-light);border:1.5px solid var(--gold);color:var(--ink);border-radius:16px 16px 16px 4px}
.bubble.astro::before{content:"✦ Kundli";display:block;font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold);margin-bottom:5px}

/* wallet */
.wallet-chip{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-soft);border:1px solid var(--line);background:var(--paper-light);padding:5px 10px;border-radius:999px}
.pack{border:1.5px solid var(--line);background:var(--paper-light);border-radius:14px;padding:14px;text-align:center;cursor:pointer;flex:1}
.pack.hot{border-color:var(--rose);box-shadow:0 0 0 5px rgba(164,81,104,.08);position:relative}
.pack .p-amt{font-family:var(--serif);font-weight:700;font-size:22px}
.pack .p-msgs{font-size:11px;color:var(--ink-soft);margin-top:2px}
.pack .p-tag{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--rose);color:var(--paper-light);font-size:9px;letter-spacing:1px;padding:3px 8px;border-radius:999px;white-space:nowrap}

/* bottom nav */
.navitem{display:flex;flex-direction:column;align-items:center;gap:5px;padding:6px 0;color:var(--muted);font-size:10.5px;background:none}
.navitem.on{color:var(--gold)} .navitem.on span:last-child{font-weight:600}

/* home question tiles */
.qtile{background:var(--paper-light);border:1px solid var(--line);border-radius:14px;padding:16px;cursor:pointer;box-shadow:0 24px 60px -48px rgba(74,48,21,.58);text-align:left;transition:border-color .15s ease}
.qtile:hover{border-color:rgba(156,109,45,.6)}
.qtile .ic{width:30px;height:30px;border-radius:999px;background:var(--gold-pale);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--gold);margin-bottom:12px}
.qtile .cat{font-size:10px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.qtile .q{font-family:var(--serif);font-size:16px;line-height:1.3;text-wrap:pretty;color:var(--ink)}

/* graha darbar */
.gcard{background:var(--paper-light);border:1px solid var(--line);border-radius:14px;padding:14px;text-align:left;cursor:pointer;box-shadow:0 24px 60px -48px rgba(74,48,21,.58)}
.gcard .gtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.gcard .gglyph{font-size:22px;line-height:1}
.gcard .gdot{width:7px;height:7px;border-radius:999px;display:inline-block}
.gcard .gname{font-family:var(--serif);font-size:19px;line-height:1.1;margin-bottom:4px}
.gcard .gmeta{font-size:10.5px;color:var(--muted);margin-bottom:8px}
.gcard .gsay{font-size:12px;line-height:1.45;color:var(--ink);min-height:34px}
.gcard .gmood{font-size:10px;letter-spacing:.8px;text-transform:uppercase;color:var(--gold);margin-top:8px}

/* util */
.px{padding-left:22px;padding-right:22px}
.divider-star{display:flex;align-items:center;gap:12px}
.divider-star::before,.divider-star::after{content:"";flex:1;height:1px;background:var(--line)}
.divider-star span{color:var(--gold);font-size:12px}
.check-row{font-size:12.5px;color:rgba(255,250,240,.8);display:flex;gap:8px;align-items:flex-start}
.check-row b{color:var(--green);font-weight:400}
.strike{text-decoration:line-through;color:var(--muted)}
.night .strike{color:rgba(255,250,240,.5)}
.bigprice{font-family:var(--serif);font-weight:700;font-size:44px;line-height:1;letter-spacing:-1px}
.hairline{height:1px;background:var(--line)}

/* ============================================================
   SANYOG universe — Ravana, Navagraha Darbar, Tanya
   Sab kuch usi bhasha mein: parchment ground, navy feature cards,
   champagne accent, patli lines, khula spacing.
   ============================================================ */

/* nav ab 5 ka hai — labels chhote, icons wahi wazan */
#botnav .navrow{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}
.navitem span:last-child{font-size:9.5px;letter-spacing:.2px}

/* ---- character portrait: asli image aaye toh woh, warna sundar fallback ---- */
.portrait{position:relative;overflow:hidden;background:#0d1730;isolation:isolate}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.portrait .glyphfall{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:40px;color:rgba(217,183,109,.85);
  background:radial-gradient(120% 90% at 50% 18%,rgba(217,183,109,.28),rgba(13,23,48,0) 62%),
             linear-gradient(168deg,#16213f,#070f22 72%)}
.portrait.rose .glyphfall{background:radial-gradient(120% 90% at 50% 18%,rgba(233,200,205,.42),rgba(70,28,42,0) 62%),
             linear-gradient(168deg,#7a3d52,#3d1c28 74%);color:rgba(255,240,242,.9)}
.portrait .scrim{position:absolute;inset:auto 0 0 0;height:62%;
  background:linear-gradient(to top,rgba(6,12,26,.92),rgba(6,12,26,0))}

/* ---- HOME: "aaj kis se baat karni hai" ke teen darwaze ---- */
.charrow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 18px 8px}
.charcard{position:relative;border-radius:16px;overflow:hidden;text-align:left;
  border:1px solid var(--line);box-shadow:var(--shadow-night);aspect-ratio:.62;background:#0d1730}
.charcard .portrait{position:absolute;inset:0}
.charcard .meta{position:absolute;inset:auto 0 0 0;padding:11px 11px 12px;z-index:2}
.charcard .cname{font-family:var(--serif);font-size:16.5px;line-height:1.05;color:var(--paper-light)}
.charcard .crole{font-size:9.5px;line-height:1.35;color:rgba(255,250,240,.72);margin-top:3px}
.charcard .cgo{font-size:9.5px;color:var(--gold-light);margin-top:7px;letter-spacing:.3px}
.charcard.rose{background:#3d1c28}

/* ---- NAVAGRAHA DARBAR: raat ka aasman ---- */
.sky{background:radial-gradient(90% 60% at 50% 8%,rgba(217,183,109,.13),rgba(7,15,34,0) 60%),
     linear-gradient(178deg,#081225,#060c19);color:var(--paper-light)}
.orbit{position:relative;width:100%;aspect-ratio:1;max-width:420px;margin:0 auto}
.orbit .ring{position:absolute;border:1px solid rgba(217,183,109,.16);border-radius:999px}
.orbit .core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:23%;aspect-ratio:1;border-radius:999px;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 35%,#f4d99a,#c58a28 58%,#7d5514);
  box-shadow:0 0 46px rgba(217,183,109,.42);font-size:26px;color:#3a2708}
.planet{position:absolute;transform:translate(-50%,-50%);width:25%;text-align:center}
.planet .pdisc{width:74%;margin:0 auto;aspect-ratio:1;border-radius:999px;overflow:hidden;position:relative;
  border:1px solid rgba(217,183,109,.4);box-shadow:0 0 20px rgba(217,183,109,.16)}
.planet .pdisc img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.planet .pname{font-size:9.5px;letter-spacing:1.1px;text-transform:uppercase;margin-top:5px;color:var(--gold-light)}
.planet .pdesc{font-size:8.5px;line-height:1.3;color:rgba(255,250,240,.6);margin-top:2px}
.planet.on .pdisc{border-color:var(--gold-light);box-shadow:0 0 26px rgba(217,183,109,.5)}
.planet.on .pname{color:#fff}

/* ---- RAVANA: sujhaye gaye sawaal ---- */
.qrow{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  padding:13px 15px;border-radius:13px;border:1px solid rgba(217,183,109,.26);
  background:rgba(255,250,240,.045);text-align:left;color:var(--paper-light);font-size:13px;line-height:1.4}
.qrow span:last-child{color:var(--gold-light);flex:none}

/* ---- TANYA: profile ke trait rows ---- */
.trait{display:flex;gap:12px;align-items:flex-start;padding:13px 14px;border-radius:14px;
  background:var(--card);border:1px solid var(--line)}
.trait .tic{flex:none;width:26px;height:26px;border-radius:999px;background:rgba(164,81,104,.12);
  color:var(--rose);display:flex;align-items:center;justify-content:center;font-size:13px}
.trait .tlab{font-size:9.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted)}
.trait .tval{font-size:13px;line-height:1.45;margin-top:3px}

/* ---- DISCOVERIES ---- */
.discbar{display:flex;gap:4px;margin:10px 0 2px}
.discbar i{flex:1;height:4px;border-radius:99px;background:var(--line)}
.discbar i.on{background:var(--gold)}
.disc{display:flex;align-items:center;gap:11px;padding:11px 4px;border-bottom:1px solid var(--line)}
.disc:last-child{border-bottom:0}
.disc .dic{flex:none;width:24px;height:24px;border-radius:999px;display:flex;align-items:center;
  justify-content:center;font-size:11px;background:var(--gold-pale);color:var(--gold)}
.disc.locked{opacity:.55}
.disc.locked .dic{background:rgba(112,76,35,.1);color:var(--muted)}
.disc .dname{flex:1;font-size:13px;line-height:1.35}
.disc .dstate{font-size:10px;letter-spacing:.8px;text-transform:uppercase;color:var(--green)}
.disc.locked .dstate{color:var(--muted)}

/* ---- STORE ---- */
.packcard{position:relative;border:1.5px solid var(--line);border-radius:18px;padding:20px 18px;
  background:var(--card);text-align:left;width:100%;display:block}
.packcard.best{border-color:var(--gold);box-shadow:0 0 0 5px rgba(156,109,45,.08)}
.packcard .pc-cr{font-family:var(--serif);font-size:23px;line-height:1.1}
.packcard .pc-amt{font-family:var(--serif);font-size:30px;color:var(--gold-dark);margin-top:4px}
.packcard .pc-sub{font-size:11.5px;color:var(--muted);margin-top:6px}
.packcard .pc-tag{position:absolute;top:-10px;right:16px;background:var(--gold);color:var(--paper-light);
  font-size:9px;letter-spacing:1.2px;padding:4px 10px;border-radius:999px;font-weight:700}

/* ---- DAILY: aaj kisne yaad kiya ---- */
.dailycard{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:16px;
  background:var(--card);border:1px solid var(--line);width:100%;text-align:left}
.dailycard .dp{flex:none;width:44px;height:44px;border-radius:999px;overflow:hidden}
.dailycard .dwho{font-family:var(--serif);font-size:16px;line-height:1.1}
.dailycard .dmsg{font-size:12.5px;line-height:1.5;color:var(--ink-soft);margin-top:4px;font-style:italic}
.dailycard .dtime{font-size:10px;color:var(--muted);margin-top:6px;letter-spacing:.4px}

/* ---- future feature tiles ---- */
.ftile{padding:14px 12px;border-radius:14px;background:var(--card);border:1px solid var(--line);text-align:left}
.ftile .fic{font-size:17px;margin-bottom:8px}
.ftile .fname{font-size:12px;font-weight:600;line-height:1.25}
.ftile .fsub{font-size:10.5px;line-height:1.4;color:var(--muted);margin-top:4px}

/* Soch-vichaar wala indicator. Jyotish ke jawab reasoning model se aate hain
   aur 20-30 second le sakte hain — us der mein teen naachte hue dots "app
   atak gaya" jaise lagte hain. Isliye wahan yeh dikhta hai: character ki apni
   aawaz mein badalti hui line + beeta hua samay, taaki user ko pata rahe ki
   kaam chal raha hai aur kitna ho chuka hai. */
.think{display:flex;align-items:center;gap:9px;padding:12px 15px;max-width:82%}
.think .dot{flex:none;width:7px;height:7px;border-radius:999px;background:rgba(255,250,240,.9);animation:pulse 1.4s ease-in-out infinite}
.think .txt{font-size:12.5px;line-height:1.35;color:rgba(255,250,240,.92)}
.think .sec{font-size:11px;color:rgba(255,250,240,.55);font-variant-numeric:tabular-nums}
.think .txt span{display:inline-block;animation:fadein .45s ease}
@keyframes pulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}
@keyframes fadein{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}

/* Report ke saath chalne wali CTA patti. Report 28 page ki hai — aakhri page
   tak pahunchne wale bahut kam hote hain, aur pehle CTA tak pahunchna hi
   conversion hai. Neeche fix rehti hai, print mein nahi jaati. */
#report-sticky{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(to top,var(--paper) 62%,rgba(240,234,222,0));display:none}
#report-sticky.on{display:block}

/* Manifestation ka orb — do dhimi ghoomti rings aur beech mein taara. */
.mani-orb{position:relative;width:150px;height:150px;display:flex;align-items:center;justify-content:center}
.mani-ring{position:absolute;inset:0;border-radius:999px;border:1px solid var(--rose);opacity:.35;animation:maniSpin 7s linear infinite}
.mani-ring.r2{inset:22px;border-color:var(--gold);opacity:.5;animation-duration:4.5s;animation-direction:reverse}
.mani-core{font-size:30px;color:var(--gold);animation:maniPulse 2.6s ease-in-out infinite}
@keyframes maniSpin{to{transform:rotate(360deg)}}
@keyframes maniPulse{0%,100%{opacity:.55;transform:scale(.94)}50%{opacity:1;transform:scale(1.06)}}

/* Naam ab poori screen nahi, ek chhota popup hai.
   Wajah: user ne abhi partner ka chehra aur swabhav dekha hai — usi pal ko
   ek poore naye page par le jaana us pal ko thanda kar deta tha. Ab profile
   peeche dikhti rehti hai aur naam upar ek chhoti sheet mein poochha jaata
   hai. Mobile par yeh neeche se aati hai (thumb ke paas), bade screen par
   beech mein. */
.naam-pop{position:fixed;inset:0;z-index:70;display:none;align-items:flex-end;justify-content:center;
  background:rgba(28,20,12,.55);backdrop-filter:blur(2px);padding:0}
.naam-pop.on{display:flex}
.naam-pop .sheet{width:100%;max-width:420px;background:var(--paper);border-radius:20px 20px 0 0;
  padding:20px 20px calc(20px + env(safe-area-inset-bottom));box-shadow:0 -18px 50px -20px rgba(28,20,12,.5);
  max-height:88dvh;overflow-y:auto;animation:naamUp .28s cubic-bezier(.2,.9,.3,1)}
.naam-pop .grip{width:38px;height:4px;border-radius:999px;background:var(--line-strong);opacity:.5;margin:0 auto 14px}
@keyframes naamUp{from{transform:translateY(22px);opacity:0}to{transform:none;opacity:1}}
@media (min-width:520px){
  .naam-pop{align-items:center}
  .naam-pop .sheet{border-radius:20px;max-height:82dvh}
}

/* "Neeche aur hai" — chehre ke baad ka ishara. Sirf ek halka sa nudge,
   kyunki portrait ke baad page khatam dikhta hai aur byora chhoot jaata hai. */
.scrollcue{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--muted);font-size:11.5px}
.scrollcue .arrow{animation:nudge 1.8s ease-in-out infinite;font-size:14px;line-height:1}
@keyframes nudge{0%,100%{transform:translateY(0);opacity:.45}50%{transform:translateY(4px);opacity:1}}
@media (prefers-reduced-motion:reduce){.scrollcue .arrow{animation:none}}

/* Sticky CTA — tab aati hai jab asli button screen se bahar ho.
   Chehre wale page par cards aur "yeh kahan se nikla" ke baad button itna
   neeche chala jaata hai ki woh kabhi dikhta hi nahi; aage ka rasta bandh sa
   lagta hai.

   Pehle yahan `max-width:640px` ka pehra tha — "sirf mobile". Woh galat tha:
   .app hamesha 460px ka column hai, desktop par bhi. Bada screen matlab bada
   layout nahi — wahi lamba scroll, wahi chhupa hua button. Ab pehra sirf ek
   hai: asli button dikh raha hai ya nahi. */
/* WhatsApp help — chhota hara gola, sirf landing par. z-index sticky (39)
   ke neeche nahi, upar bhi nahi chahiye: landing par sticky hoti hi nahi.
   Naam-pop (70) aur boot-veil (60) ke neeche rehta hai. */
#wa-help{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:38;
  width:44px;height:44px;border-radius:999px;background:#25D366;display:none;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.28);-webkit-tap-highlight-color:transparent}
#wa-help:active{transform:scale(.94)}
.app:has(#s-landing.active) #wa-help{display:flex}
.stickycta{position:fixed;left:0;right:0;bottom:var(--navh,0px);z-index:39;display:none;
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(to top,var(--paper) 62%,rgba(244,234,215,0))}
.stickycta.on{display:block}


/* ---------- chhoti screens (chhote phone, ya zoom kiya hua) ----------
   Checkout par sabse zyada content hai — do bade plan card, timer, phone,
   total. Tang screen par 22px ka padding aur 15px ke card-padding milkar
   asli jagah bahut kam chhod dete the, aur bullets ek-ek shabd par toot kar
   girne lagti thi. Yahan sirf khaali jagah kam karte hain — koi text chhota
   nahi karte, kyunki padhna hi is page ka kaam hai. */
@media (max-width: 400px) {
  #s-checkout > div { padding-left: 14px !important; padding-right: 14px !important; }
  .ck-plan { padding: 12px !important; gap: 8px !important; }
  #ck-sale { padding: 10px 12px !important; }
}
/* Kisi bhi haal mein page daayen-baayen na khiske. */
html, body { max-width: 100%; overflow-x: hidden; }
/* YAHAN PEHLE `.ck-plan *` par `overflow-wrap: anywhere` tha — aur usne poora
   checkout toda: "anywhere" har AKSHAR ko todne ki jagah bana deta hai, jisse
   flex ke andar title ki min-width 1 akshar reh jaati hai aur space-between
   usse nichod kar ek-ek akshar ki khadi line bana deta hai. Kabhi wapas mat
   lagana. Lambi lines ke liye `break-word` kaafi hai — woh sirf zaroorat par
   todta hai, min-width nahi girata. */
.ck-plan { overflow-wrap: break-word; }

/* ---- report loading state ------------------------------------------------
   Report banne mein 30+ second lagte hain. Pehle us dauraan #report-pages
   BILKUL khaali rehta tha — upar "payment ho gaya" likha hota, neeche do
   button, aur beech mein kuch nahi. Wo toota hua lagta tha, ban-ta hua nahi.
   Ab teen ghoomti chakra rings + badalta hua status. */
.rl-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:64px 24px 72px;gap:26px;text-align:center}
.rl-orb{position:relative;width:132px;height:132px;display:flex;align-items:center;justify-content:center}
.rl-ring{position:absolute;border-radius:999px;border:1px solid var(--gold);opacity:.30;
  animation:rlSpin 9s linear infinite}
.rl-ring.a{inset:0}
.rl-ring.b{inset:20px;border-color:var(--rose);opacity:.42;animation-duration:6s;animation-direction:reverse}
.rl-ring.c{inset:40px;border-color:var(--gold);opacity:.55;animation-duration:3.6s}
.rl-core{font-size:30px;color:var(--gold);animation:rlPulse 2.6s ease-in-out infinite}
.rl-status{font-size:15px;color:var(--ink);min-height:22px;font-weight:600;letter-spacing:.2px}
.rl-sub{font-size:12.5px;color:var(--muted);max-width:270px;line-height:1.6}
.rl-bar{width:190px;height:2px;background:var(--line);border-radius:999px;overflow:hidden}
.rl-bar i{display:block;height:100%;width:0;background:var(--gold);border-radius:999px;
  transition:width .6s ease}
@keyframes rlSpin{to{transform:rotate(360deg)}}
@keyframes rlPulse{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}
