/* Sansara — hi-fi heritage screens (from Wireframes v4) */
:root{
  --maroon:#7a1f1f;--maroon-d:#5e1717;--saffron:#d06706;--gold:#bf982f;--gold-l:#e3c469;
  --cream:#f8efda;--cream-d:#efe0c0;--ink:#2c1c12;--sand:#9a8460;--green:#3a7d54;--teal:#1f6f6b;
  --primary:var(--maroon);
  --primary-d:color-mix(in oklab,var(--primary),black 22%);
  --primary-soft:color-mix(in oklab,var(--primary) 9%,var(--cream));
}
.hp,.hp *{box-sizing:border-box;}
.hp{
  width:390px;height:844px;background:var(--cream);color:var(--ink);
  font-family:'Mukta',system-ui,sans-serif;font-size:15px;line-height:1.45;
  display:flex;flex-direction:column;overflow:hidden;position:relative;
  -webkit-font-smoothing:antialiased;
}
.hp .serif{font-family:'Rozha One',serif;font-weight:400;}
.hp .deva{font-family:'Rozha One',serif;font-weight:400;}

/* ---------- status bar ---------- */
.status{display:flex;align-items:center;justify-content:space-between;padding:16px 26px 8px;font-size:14.5px;font-weight:600;flex:none;}
.status .sig{display:flex;align-items:flex-end;gap:2.5px;height:11px;}
.status .sig i{width:3.5px;background:currentColor;border-radius:1.5px;display:block;}
.status .sig i:nth-child(1){height:4px;}.status .sig i:nth-child(2){height:6.5px;}
.status .sig i:nth-child(3){height:9px;}.status .sig i:nth-child(4){height:11px;opacity:.45;}
.status .batt{width:23px;height:11.5px;border:1.5px solid currentColor;border-radius:3.5px;position:relative;opacity:.95;}
.status .batt::before{content:"";position:absolute;inset:1.5px;right:35%;background:currentColor;border-radius:1.5px;}
.status .batt::after{content:"";position:absolute;right:-4px;top:3px;width:2px;height:5px;background:currentColor;border-radius:0 2px 2px 0;}
.status .sright{display:flex;align-items:center;gap:7px;}
.status.ondark{color:var(--cream);}

/* ---------- app bar ---------- */
.appbar{background:var(--primary);color:var(--cream);padding:0 18px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:2px solid var(--gold-l);flex:none;}
.appbar .status{padding:16px 8px 10px;margin:0 -8px;}
.abwrap{background:var(--primary);flex:none;border-bottom:2px solid var(--gold-l);}
.abwrap .appbar{border-bottom:none;}
.appbar .title{font-family:'Rozha One',serif;font-size:21px;line-height:1;}
.wallet{white-space:nowrap;font-size:14px;border:1.5px solid var(--gold-l);border-radius:22px;padding:4px 13px;color:var(--gold-l);font-weight:600;display:flex;align-items:center;gap:5px;}
.iconbtn{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold-l);}
.bell{position:relative;}
.bell .dot{position:absolute;top:6px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--saffron);border:2px solid var(--primary);}

/* ---------- niche (patterned maroon header) ---------- */
.niche{
  background-color:var(--primary);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'><g fill='none' stroke='%23e3c469' stroke-opacity='0.16' stroke-width='0.8'><path d='M36,8 Q50,36 36,64 Q22,36 36,8 Z'/><path d='M8,36 Q36,50 64,36 Q36,22 8,36 Z'/><circle cx='36' cy='36' r='12'/></g><g fill='%23e3c469' fill-opacity='0.28'><circle cx='36' cy='36' r='1.6'/><circle cx='0' cy='0' r='1.3'/><circle cx='72' cy='0' r='1.3'/><circle cx='0' cy='72' r='1.3'/><circle cx='72' cy='72' r='1.3'/><circle cx='36' cy='0' r='1'/><circle cx='36' cy='72' r='1'/><circle cx='0' cy='36' r='1'/><circle cx='72' cy='36' r='1'/></g></svg>");
  background-size:72px 72px;color:var(--cream);flex:none;position:relative;
}
.scallop{height:13px;background-image:radial-gradient(circle at 10.5px -3.5px,var(--gold-l) 7px,transparent 7.6px);background-size:21px 13px;background-repeat:repeat-x;flex:none;background-color:transparent;}

/* ---------- cards ---------- */
.card{
  background-color:var(--cream);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'><g fill='none' stroke='%23bf982f' stroke-opacity='0.16' stroke-width='0.7'><path d='M24,4 L44,24 L24,44 L4,24 Z'/><circle cx='24' cy='24' r='5'/></g><g fill='%23bf982f' fill-opacity='0.24'><circle cx='24' cy='24' r='1.2'/><circle cx='0' cy='0' r='1'/><circle cx='48' cy='0' r='1'/><circle cx='0' cy='48' r='1'/><circle cx='48' cy='48' r='1'/></g></svg>");
  background-size:48px 48px;border:1.5px solid var(--gold);border-radius:15px;
  box-shadow:inset 0 0 0 3px rgba(248,239,218,.7),inset 0 0 0 4.5px rgba(191,152,47,.45),0 2px 6px rgba(94,23,23,.07);
}
.hp .plain{background-image:none;}
.hp.flat .card{background-image:none;}

/* ---------- buttons ---------- */
.btn{white-space:nowrap;font-family:'Mukta',sans-serif;font-weight:600;font-size:16.5px;text-align:center;padding:14px 18px;background:linear-gradient(180deg,color-mix(in oklab,var(--primary),white 7%),var(--primary-d));color:var(--cream);border-radius:14px;border:1.5px solid var(--gold-l);box-shadow:0 3px 8px rgba(94,23,23,.22),inset 0 1px 0 rgba(248,239,218,.18);cursor:default;display:flex;align-items:center;justify-content:center;gap:8px;}
.btn.saff{background:linear-gradient(180deg,#e07614,#b85a04);border-color:var(--gold-l);box-shadow:0 3px 8px rgba(184,90,4,.28),inset 0 1px 0 rgba(255,255,255,.22);}
.btn.green{background:linear-gradient(180deg,#458c61,#2f6b47);}
.btn.gold{background:linear-gradient(180deg,#d4ad45,#b08a24);color:var(--maroon-d);}
.btn.ghost{background:transparent;color:var(--primary);border-color:var(--primary);box-shadow:none;}
.btn.sm2{padding:9px 15px;font-size:14px;border-radius:10px;}
.btn.xs2{padding:6px 12px;font-size:13px;border-radius:9px;}

/* ---------- small bits ---------- */
.row{display:flex;align-items:center;gap:10px;}
.between{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.col{display:flex;flex-direction:column;}
.center{display:flex;align-items:center;justify-content:center;}
.pad{padding:14px 18px;}
.muted{color:var(--sand);}
.tiny{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--sand);font-weight:600;}
.sm{font-size:13.5px;}.xs{font-size:12px;}.b{font-weight:600;}
.gold{color:var(--gold);}.prim{color:var(--primary);}.saff{color:var(--saffron);}.grn{color:var(--green);}.ink{color:var(--ink);}
.stk{display:flex;flex-direction:column;gap:7px;}
.chip{font-size:14px;padding:7px 16px;border:1.5px solid var(--gold);border-radius:30px;background:var(--cream);white-space:nowrap;color:var(--ink);font-weight:500;}
.chip.on{background:var(--primary);color:var(--cream);border-color:var(--primary);font-weight:600;}
.chip.xsc{font-size:12.5px;padding:5px 12px;}
.chips{display:flex;gap:8px;overflow:hidden;}
.ribbon{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--saffron);color:#fff;font-size:12.5px;letter-spacing:.05em;padding:6px 14px;border-radius:7px;font-weight:600;}
.ribbon.goldr{background:linear-gradient(180deg,#d4ad45,#b08a24);color:var(--maroon-d);}
.ribbon.maroonr{background:var(--maroon);}
.divider{display:flex;align-items:center;gap:11px;color:var(--gold);}
.divider::before,.divider::after{content:"";flex:1;height:1.4px;background:linear-gradient(90deg,transparent,var(--gold));}
.divider::after{background:linear-gradient(90deg,var(--gold),transparent);}
.divider .serif{color:var(--primary);font-size:15.5px;}
.seg{display:flex;border:1.5px solid var(--gold);border-radius:26px;overflow:hidden;font-size:14px;background:var(--cream);}
.seg div{flex:1;text-align:center;padding:9px 0;font-weight:500;}
.seg div.on{background:var(--saffron);color:#fff;font-weight:600;}
.seg.ondark{border-color:var(--gold-l);background:transparent;color:var(--cream);}

/* ---------- imagery / murti niches ---------- */
.murti{position:relative;overflow:hidden;background:var(--cream-d);border-radius:64px 64px 11px 11px/50px 50px 11px 11px;}
.murti.sq{border-radius:14px;}
.murti.circ{border-radius:50%;}
.murti::after{content:"";position:absolute;inset:0;border:2px solid var(--gold-l);border-radius:inherit;box-shadow:inset 0 0 0 3.5px rgba(248,239,218,.6);pointer-events:none;}
.murti image-slot{display:block;width:100%;height:100%;}
.namebar{text-align:center;font-family:'Rozha One',serif;font-size:15px;color:var(--primary);margin-top:8px;line-height:1.15;}
.ava{width:56px;height:56px;border-radius:50%;border:2px solid var(--gold);background:repeating-linear-gradient(45deg,var(--cream-d),var(--cream-d) 5px,rgba(191,152,47,.12) 5px,rgba(191,152,47,.12) 10px);position:relative;flex:none;overflow:visible;}
.ava .on-dot{position:absolute;right:1px;bottom:1px;width:13px;height:13px;border-radius:50%;background:var(--green);border:2.5px solid var(--cream);}
.ava image-slot{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;}

/* ---------- ornaments ---------- */
.seal{width:46px;height:46px;border-radius:50%;border:2px solid var(--gold-l);position:relative;display:flex;align-items:center;justify-content:center;flex:none;}
.seal::before{content:"";position:absolute;inset:-6px;border:1.5px dashed var(--gold-l);border-radius:50%;opacity:.7;}
.seal span{font-family:'Rozha One',serif;font-size:22px;color:var(--gold-l);}
.sun{width:46px;height:46px;border-radius:50%;border:2px solid var(--gold);position:relative;display:flex;align-items:center;justify-content:center;flex:none;color:var(--gold);}
.sun::before{content:"";position:absolute;inset:-6px;border:1.4px dashed var(--gold);border-radius:50%;opacity:.7;}
.stars{color:var(--saffron);font-size:13.5px;letter-spacing:1.5px;}

/* ---------- bottom nav ---------- */
.nav{display:flex;justify-content:space-around;padding:10px 10px 26px;border-top:2px solid var(--gold);background:var(--cream);flex:none;position:relative;}
.nav::before{content:"";position:absolute;top:-6px;left:0;right:0;height:4px;background-image:radial-gradient(circle at 5px 2px,var(--gold) 1.3px,transparent 1.8px);background-size:14px 4px;opacity:.55;}
.nav b{display:flex;flex-direction:column;align-items:center;gap:4px;font-weight:500;font-size:11px;color:var(--sand);width:58px;}
.nav b svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round;color:#7d6a4d;}
.nav b .omg{font-family:'Rozha One',serif;font-size:21px;line-height:23px;height:23px;color:#7d6a4d;font-weight:400;}
.nav b.on{color:var(--primary);font-weight:700;}
.nav b.on svg{color:var(--primary);stroke-width:2.1;}
.nav b.on .omg{color:var(--primary);}
.homebar{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);width:130px;height:5px;border-radius:3px;background:rgba(44,28,18,.28);}

/* ---------- lists / misc ---------- */
.lrow{display:flex;align-items:center;gap:13px;padding:11px 0;border-bottom:1.4px dashed #e0cda1;}
.play{width:0;height:0;border-left:15px solid var(--saffron);border-top:9px solid transparent;border-bottom:9px solid transparent;flex:none;}
.livebadge{display:inline-flex;align-items:center;gap:5px;background:var(--maroon);color:#fff;font-size:10.5px;letter-spacing:.1em;padding:3px 9px;border-radius:5px;font-weight:700;}
.dotlive{width:7px;height:7px;border-radius:50%;background:#ff5a4d;animation:sansaraPulse 1.6s ease-in-out infinite;}
@keyframes sansaraPulse{0%,100%{opacity:1;}50%{opacity:.35;}}
.wave{display:flex;align-items:flex-end;gap:2.5px;height:20px;}
.wave i{width:3.5px;background:var(--saffron);border-radius:2px;display:block;}
.inputbar{display:flex;align-items:center;gap:10px;padding:11px 16px 26px;border-top:2px solid var(--gold);background:var(--cream);flex:none;position:relative;}
.inputbar .field{flex:1;height:42px;border:1.5px solid var(--gold);border-radius:24px;background:#fffaf0;display:flex;align-items:center;padding:0 16px;color:var(--sand);font-size:14px;}
.send{width:42px;height:42px;border-radius:50%;background:linear-gradient(180deg,#e07614,#b85a04);color:#fff;display:flex;align-items:center;justify-content:center;flex:none;font-size:16px;box-shadow:0 2px 6px rgba(184,90,4,.3);}
.bub{max-width:78%;padding:11px 14px;border-radius:16px;font-size:14px;line-height:1.5;}
.bub.them{background:#fffaf0;border:1.4px solid var(--gold);border-top-left-radius:4px;align-self:flex-start;box-shadow:0 1px 4px rgba(94,23,23,.06);}
.bub.me{background:var(--primary);color:var(--cream);border-top-right-radius:4px;align-self:flex-end;box-shadow:0 2px 6px rgba(94,23,23,.2);}
.bub .stamp{display:block;font-size:10.5px;opacity:.55;margin-top:4px;text-align:right;}
.pkg{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1.5px solid var(--gold);border-radius:13px;padding:12px 14px;background:var(--cream);}
.pkg.on{border-color:var(--saffron);box-shadow:inset 0 0 0 1.5px var(--saffron);background:#fdf4e3;}
.radio{width:19px;height:19px;border-radius:50%;border:2px solid var(--gold);flex:none;}
.pkg.on .radio{border-color:var(--saffron);background:radial-gradient(var(--saffron) 42%,transparent 48%);}
.rupee{font-weight:700;}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.tile{display:flex;flex-direction:column;align-items:center;gap:7px;}
.tile .ic{width:58px;height:58px;border-radius:16px;border:1.5px solid var(--gold);background:var(--cream);display:flex;align-items:center;justify-content:center;font-family:'Rozha One',serif;font-size:23px;color:var(--saffron);box-shadow:inset 0 0 0 2.5px var(--cream),inset 0 0 0 4px rgba(191,152,47,.45),0 2px 5px rgba(94,23,23,.08);}
.tile small{font-size:12px;text-align:center;color:var(--ink);font-weight:500;}
.dial{width:128px;height:128px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;flex:none;background:var(--cream);}
.dial::before{content:"";position:absolute;inset:-9px;border:1.5px dashed var(--gold);border-radius:50%;opacity:.7;}
.dial .ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--saffron) calc(var(--pct)*1%),#e8d6ab 0);-webkit-mask:radial-gradient(circle,transparent 56%,#000 57.5%);mask:radial-gradient(circle,transparent 56%,#000 57.5%);}
.kundli{position:relative;width:100%;aspect-ratio:1;}
.kundli svg{width:100%;height:100%;display:block;}
.kundli .pl{position:absolute;font-size:12.5px;font-weight:700;color:var(--maroon);transform:translate(-50%,-50%);font-family:'Mukta',sans-serif;}
.kundli .pl small{display:block;font-size:9px;font-weight:600;color:var(--sand);text-align:center;line-height:1;}
.kundli .hn{position:absolute;font-size:10px;color:var(--sand);transform:translate(-50%,-50%);font-weight:600;}
.trow{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1.4px dashed #e0cda1;font-size:14.5px;}
.trow:last-child{border-bottom:none;}
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.bonus{font-size:12px;color:var(--green);font-weight:600;}
.linehr{height:1.4px;background:linear-gradient(90deg,transparent,var(--gold),transparent);border:none;margin:0;}
</content>
</invoke>