/* ============================================================
   MuhurtaKala — "temple observatory" luxury system
   Fraunces display · Instrument Sans body · warm obsidian + brass
   ============================================================ */
:root{
  --bg:#0a0711; --ink:#f3ecdd; --ink-2:#d8cfba; --muted:#a49a83; --faint:#736a58;
  --panel:rgba(255,248,235,.035); --panel-2:#17121f; --panel-solid:#1a1526;
  --line:rgba(233,197,131,.14); --line-2:rgba(233,197,131,.07);
  --brass:#ecc784; --brass-2:#d5a659; --brass-ink:#2a1c05; --brass-soft:#f2d9a6;
  --cool:#69c9b0;
  --b0:#d76b6b; --b1:#df9a58; --b2:#e2c063; --b3:#a9c26c; --b4:#5fc492;
  --radius:22px; --radius-sm:14px;
  --shadow:0 34px 80px -46px #000;
  --maxw:1040px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:"Instrument Sans",system-ui,sans-serif; color:var(--ink); background:var(--bg);
  min-height:100vh; line-height:1.55; -webkit-font-smoothing:antialiased; letter-spacing:.1px;
  background-image:
    radial-gradient(900px 520px at 50% -6%, rgba(236,199,132,.13) 0%, transparent 60%),
    radial-gradient(760px 620px at 88% 12%, rgba(120,80,150,.14) 0%, transparent 55%),
    radial-gradient(680px 620px at 6% 30%, rgba(60,90,120,.12) 0%, transparent 55%),
    linear-gradient(180deg,#0b0813,#070510);
  background-attachment:fixed;
}
.stars{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background-image:
    radial-gradient(1.5px 1.5px at 15% 22%, #fff9 0, transparent 60%),
    radial-gradient(1.3px 1.3px at 68% 12%, #ffe9c288 0, transparent 60%),
    radial-gradient(1.7px 1.7px at 42% 64%, #ffe8b899 0, transparent 60%),
    radial-gradient(1.1px 1.1px at 88% 52%, #fff6 0, transparent 60%),
    radial-gradient(1px 1px at 28% 84%, #fff5 0, transparent 60%),
    radial-gradient(1.2px 1.2px at 58% 38%, #fff5 0, transparent 60%);}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.04;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* load motion */
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes spoke{from{opacity:0}to{opacity:1}}
main.wrap>*{animation:rise .6s cubic-bezier(.2,.7,.2,1) both}
main.wrap>*:nth-child(2){animation-delay:.05s} main.wrap>*:nth-child(3){animation-delay:.1s}
main.wrap>*:nth-child(4){animation-delay:.15s} main.wrap>*:nth-child(5){animation-delay:.2s}
main.wrap>*:nth-child(6){animation-delay:.25s} main.wrap>*:nth-child(7){animation-delay:.3s}
main.wrap>*:nth-child(n+8){animation-delay:.34s}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}

/* shell */
.site-header{max-width:var(--maxw);margin:0 auto;padding:30px 22px 6px;display:flex;
  align-items:center;gap:16px;justify-content:space-between;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand-mark{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 34% 28%,var(--brass-soft),var(--brass-2));color:var(--brass-ink);
  font-size:17px;box-shadow:0 0 26px -3px var(--brass)}
.brand-name{font-family:"Fraunces",serif;font-size:26px;font-weight:600;letter-spacing:.2px}
.brand-name em{color:var(--brass);font-style:italic}
.brand-sub{color:var(--muted);font-size:12.5px;letter-spacing:.4px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:14px 22px 80px}
.site-footer{max-width:var(--maxw);margin:0 auto;padding:28px 22px;color:var(--faint);
  font-size:12px;text-align:center;border-top:1px solid var(--line-2)}

/* primitives */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:26px;
  backdrop-filter:blur(12px);box-shadow:var(--shadow);position:relative}
.card:before{content:"";position:absolute;inset:0 0 auto 0;height:1px;border-radius:var(--radius) var(--radius) 0 0;
  background:linear-gradient(90deg,transparent,rgba(242,217,166,.28),transparent)}
.muted{color:var(--muted)}
.eyebrow{color:var(--brass);font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:2.6px;margin:0 0 4px}
.eyebrow:before{content:"✦ ";opacity:.7;font-size:9px}
h1{font-family:"Fraunces",serif;font-weight:600;letter-spacing:.2px;margin:0}
h2{font-family:"Fraunces",serif;font-weight:600;font-size:25px;letter-spacing:.2px;margin:0}
.section{margin-top:36px}
.section>.head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:16px}
.section>.head p{margin:2px 0 0;font-size:13.5px}
a{color:var(--brass)}
.back{display:inline-flex;align-items:center;gap:6px;margin:2px 0 20px;color:var(--muted);text-decoration:none;font-size:14px}
.back:hover{color:var(--brass)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:linear-gradient(180deg,var(--brass-soft),var(--brass-2));color:var(--brass-ink);
  border:0;border-radius:14px;padding:15px 22px;font:600 15.5px "Instrument Sans",sans-serif;cursor:pointer;
  box-shadow:0 18px 40px -18px var(--brass);text-decoration:none;transition:filter .15s,transform .15s}
.btn:hover{filter:brightness(1.05);transform:translateY(-1px)}

/* hero (landing) */
.hero{text-align:center;padding:44px 0 12px}
.hero h1{font-size:clamp(40px,6.8vw,66px);line-height:1;margin:0 0 14px}
.hero .glow{color:var(--brass);font-style:italic}
.lede{color:var(--ink-2);max-width:600px;margin:0 auto;font-size:16.5px}
.lede em{color:var(--cool);font-style:normal}

/* form */
.form{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form .span2{grid-column:1/-1}
fieldset{border:1px solid var(--line);border-radius:var(--radius-sm);padding:20px;margin:0}
legend{color:var(--brass);font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:2px;padding:0 9px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid .span2{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:7px}
.field label{font-size:13px;color:var(--ink-2);font-weight:500}
.field small{color:var(--faint)}
input{background:#0d0a16;border:1px solid var(--line);color:var(--ink);border-radius:12px;
  padding:13px 15px;font:15px "Instrument Sans",sans-serif;width:100%}
input::placeholder{color:#615a48}
input:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(236,199,132,.16)}
.hint{font-size:12px;color:var(--faint)}
.ac{position:relative}
.ac-list{position:absolute;top:100%;left:0;right:0;z-index:40;margin-top:6px;background:var(--panel-solid);
  border:1px solid var(--line);border-radius:12px;overflow:hidden auto;max-height:280px;box-shadow:var(--shadow)}
.ac-item{padding:11px 14px;cursor:pointer;font-size:14px;border-bottom:1px solid var(--line-2)}
.ac-item:last-child{border-bottom:0}
.ac-item:hover{background:#26202f;color:var(--brass)}
.welcome{margin-top:26px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  border-color:rgba(236,199,132,.34);background:linear-gradient(120deg,rgba(236,199,132,.08),var(--panel))}
.new-toggle{margin:16px 4px 0}
.new-toggle summary{color:var(--muted);cursor:pointer;font-size:14px;list-style:none}
.new-toggle summary::-webkit-details-marker{display:none}
.new-toggle summary:before{content:"＋ ";color:var(--brass)}
.form.tucked{margin-top:16px}

/* toolbar */
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-start;padding:14px 16px;margin-bottom:18px}
.dn-nav{display:flex;gap:7px;align-items:center}
.dn-btn{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:40px;padding:0 15px;
  border:1px solid var(--line);border-radius:11px;color:var(--ink);text-decoration:none;font-weight:600;background:#100c1a;font-size:14px}
.dn-btn:hover{border-color:var(--brass);color:var(--brass)}
.dn-btn.on{background:var(--brass);color:var(--brass-ink);border-color:var(--brass)}
.dn-btn.gold{background:var(--brass);color:var(--brass-ink);border-color:var(--brass)}
.dn-pick{display:flex;align-items:center;gap:9px;margin-left:auto}
.dn-pick label{color:var(--muted);font-size:12.5px}
.dn-pick input,.loc-form input[type=text]{width:auto}
.locbar{position:relative}
.locbar summary{list-style:none;cursor:pointer;color:var(--ink-2);font-size:14px;border:1px solid var(--line);
  border-radius:11px;padding:10px 14px;background:#100c1a}
.locbar summary::-webkit-details-marker{display:none}
.locbar[open] summary{border-color:var(--brass);color:var(--brass)}
.loc-form{position:absolute;top:calc(100% + 8px);left:0;z-index:40;display:flex;gap:8px;flex-wrap:wrap;
  background:var(--panel-solid);border:1px solid var(--line);border-radius:13px;padding:13px;box-shadow:var(--shadow);min-width:300px}
.loc-form .ac-list{top:calc(100% + 4px);left:13px;right:13px}
.dn-go{background:var(--brass);border:0;border-radius:9px;padding:9px 14px;font-weight:600;cursor:pointer;color:var(--brass-ink)}

/* ===== Muhurta Chakra hero ===== */
.chakra{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;padding:30px}
.wheel{width:340px;height:340px;flex:none;filter:drop-shadow(0 20px 40px rgba(0,0,0,.5))}
.wheel .wseg{stroke:#0a0711;stroke-width:2.5;transition:filter .15s;transform-origin:170px 170px;animation:spoke .5s both}
.wheel .wseg:hover{filter:brightness(1.18)}
.wheel .wname{font-size:8.4px;font-weight:600;fill:#120c05;letter-spacing:.2px;pointer-events:none}
.wheel .wcore{fill:var(--panel-2);stroke:var(--line);stroke-width:1}
.wheel .tick{stroke:var(--brass);stroke-width:2;opacity:.8}
.wheel .now-line{stroke:var(--ink);stroke-width:2;stroke-dasharray:2 3}
.wheel .now-dot{fill:var(--ink)}
.wheel .c-score{font-family:"Fraunces",serif;font-size:52px;font-weight:600;fill:var(--ink);text-anchor:middle}
.wheel .c-lbl{font-size:10px;letter-spacing:2px;text-transform:uppercase;fill:var(--muted);text-anchor:middle}
.wheel .c-sun{font-size:11px;fill:var(--brass);text-anchor:middle}
.chakra-side .eyebrow{margin-bottom:8px}
.chakra-side h1{font-size:33px;line-height:1.02;margin-bottom:6px}
.chakra-side .verdict{font-size:17px;color:var(--ink-2);margin:0 0 16px}
.chakra-side .verdict b{color:var(--brass);font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:18px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:1px solid var(--line);border-radius:22px;
  font-size:12.5px;background:#100c1a;color:var(--ink-2)}
.chip b{color:var(--ink)}
.chip.good{border-color:rgba(95,196,146,.4)} .chip.bad{border-color:rgba(215,107,107,.4)}
.nextwin{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;
  background:linear-gradient(120deg,rgba(236,199,132,.07),transparent)}
.nextwin .nw-k{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted)}
.nextwin .nw-t{font-family:"Fraunces",serif;font-size:20px}
.nextwin .nw-n{color:var(--brass);font-size:13px}
.nextwin .nw-score{margin-left:auto;font-family:"Fraunces",serif;font-size:26px}

/* info cols */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.kv .row{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--line-2)}
.kv .row:last-child{border-bottom:0}
.kv .k{color:var(--muted);font-size:14px}
.kv .v{font-weight:500;text-align:right}

/* best windows */
.wins{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.win{border:1px solid var(--line);border-radius:var(--radius-sm);padding:18px;background:var(--panel);position:relative;overflow:hidden}
.win:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--c,var(--b3))}
.win .w-time{font-family:"Fraunces",serif;font-size:20px;font-weight:600}
.win .w-name{color:var(--brass);font-size:14px;margin:1px 0 9px}
.win .w-score{font-family:"Fraunces",serif;font-size:32px;font-weight:600}
.win .w-score span{font-size:13px;color:var(--muted)}
.win .w-rec{font-size:12.5px;color:var(--muted);margin-top:6px}

/* muhurat list (auspicious / avoid) */
.mlist{display:flex;flex-direction:column;gap:8px}
.mrow{display:flex;align-items:center;gap:13px;padding:12px 15px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.mrow .accent{width:3px;align-self:stretch;border-radius:3px;background:var(--c,var(--b2))}
.mrow .m-time{font-variant-numeric:tabular-nums;color:var(--ink-2);min-width:112px;font-size:14px}
.mrow .m-name{flex:1;font-weight:500}
.mrow .m-note{color:var(--faint);font-size:12px}
.pill{display:inline-block;min-width:36px;text-align:center;font-weight:700;font-size:12.5px;padding:3px 9px;border-radius:8px}
.b0{background:rgba(215,107,107,.18);color:var(--b0)} .b1{background:rgba(223,154,88,.18);color:var(--b1)}
.b2{background:rgba(226,192,99,.18);color:var(--b2)} .b3{background:rgba(169,194,108,.18);color:var(--b3)}
.b4{background:rgba(95,196,146,.18);color:var(--b4)}

/* tables (hora / night) */
.tbl{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.tbl th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:11px 15px;border-bottom:1px solid var(--line);font-weight:600}
.tbl td{padding:10px 15px;border-bottom:1px solid var(--line-2);font-size:14px}
.tbl tr:last-child td{border-bottom:0}
.tbl .mono{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink-2)}
.nat{font-size:11px;padding:2px 9px;border-radius:20px;text-transform:capitalize}
.nat.good{background:rgba(95,196,146,.16);color:var(--b4)} .nat.bad{background:rgba(215,107,107,.16);color:var(--b0)}
.nat.neutral{background:rgba(226,192,99,.16);color:var(--b2)}
.compact td{padding:8px 15px}
.ephe-note{color:var(--faint);font-size:12px;margin-top:26px;text-align:center}

/* range / outlook */
.rangeform{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end}
.rangeform .note{color:var(--faint);font-size:12px;flex-basis:100%}
.statbar{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:6px 0 4px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:18px;text-align:center}
.stat b{display:block;font-family:"Fraunces",serif;font-size:30px;font-weight:600}
.stat span{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.7px}
.stat.good b{color:var(--b4)} .stat.neu b{color:var(--b2)} .stat.bad b{color:var(--b0)}
.distbar{display:flex;height:13px;border-radius:8px;overflow:hidden;margin:16px 0 2px;border:1px solid var(--line)}
.distbar .g{background:var(--b4)} .distbar .m{background:var(--b2)} .distbar .b{background:var(--b0)}
.gauge{--v:0;--c:var(--b2);position:relative;width:132px;height:132px;border-radius:50%;flex:none;
  background:conic-gradient(var(--c) calc(var(--v)*1%), rgba(255,255,255,.06) 0)}
.gauge:after{content:"";position:absolute;inset:11px;border-radius:50%;background:var(--panel-2)}
.gauge .g-in{position:absolute;inset:0;display:grid;place-content:center;text-align:center;z-index:2}
.gauge .g-num{font-family:"Fraunces",serif;font-size:40px;font-weight:600;line-height:1}
.gauge .g-lbl{font-size:10px;text-transform:uppercase;letter-spacing:1.6px;color:var(--muted)}
.summary{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:center}
.summary h1{font-size:27px;margin:0 0 3px}

.hm-scroll{overflow-x:auto;padding-bottom:8px}
.hm{display:grid;grid-template-columns:repeat(7,minmax(38px,1fr));gap:6px;min-width:330px}
.hm-wd{font-size:11px;color:var(--muted);text-align:center;padding-bottom:3px;font-weight:600}
.hm-cell{position:relative;aspect-ratio:1;border-radius:9px;display:flex;align-items:center;justify-content:center;
  text-decoration:none;color:#0c0a18;font-size:12.5px;font-weight:600;border:1px solid rgba(0,0,0,.28)}
.hm-cell.empty{background:transparent;border:0}
.hm-dot{position:absolute;top:4px;right:4px;width:5px;height:5px;border-radius:50%;background:rgba(0,0,0,.55)}
.hm-cell.s0{background:var(--b0)} .hm-cell.s1{background:var(--b1)} .hm-cell.s2{background:var(--b2)}
.hm-cell.s3{background:var(--b3)} .hm-cell.s4{background:var(--b4)}
.hm-cell:hover{outline:2px solid var(--brass);outline-offset:2px;z-index:2}
.hm-legend{display:flex;align-items:center;gap:6px;justify-content:flex-end;margin-top:12px;color:var(--muted);font-size:12px}
.hm-legend i{width:17px;height:17px;border-radius:5px;display:inline-block}
.hm-legend i.s0{background:var(--b0)} .hm-legend i.s1{background:var(--b1)} .hm-legend i.s2{background:var(--b2)}
.hm-legend i.s3{background:var(--b3)} .hm-legend i.s4{background:var(--b4)}
.daylist{display:flex;flex-direction:column;gap:9px}
.dayrow{display:flex;align-items:center;gap:14px;padding:12px 15px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--panel);text-decoration:none;color:var(--ink)}
.dayrow:hover{border-color:var(--brass)}
.dayrow .accent{width:3px;align-self:stretch;border-radius:3px;background:var(--c,var(--b3))}
.dr-date{display:flex;flex-direction:column;min-width:112px}
.dr-date small,.dr-mid small{color:var(--muted);font-size:12px}
.dr-mid{flex:1;display:flex;flex-direction:column}
.tara{color:var(--brass);font-size:14px} .tara.bad{color:var(--b0)}
.special{display:flex;flex-wrap:wrap;gap:9px}
.sp{display:flex;gap:9px;align-items:baseline;padding:9px 14px;border:1px solid var(--line);border-radius:11px;background:var(--panel);text-decoration:none;color:var(--ink)}
.sp:hover{border-color:var(--brass)} .sp span{color:var(--brass);font-size:13px}

/* transits card */
.tr-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:2px 0 6px}
.tr-flag{font-weight:600;font-size:14px;padding:7px 14px;border-radius:22px;border:1px solid var(--line)}
.tr-flag.warn{color:var(--b1);border-color:rgba(223,154,88,.45);background:rgba(223,154,88,.08)}
.tr-flag.ok{color:var(--b4);border-color:rgba(95,196,146,.4);background:rgba(95,196,146,.07)}
.tr-mini{color:var(--muted);font-size:13px} .tr-mini em{color:var(--faint);font-style:normal}
.tr-list{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-direction:column;gap:9px}
.tr-list li{position:relative;padding-left:19px;font-size:13.5px;color:var(--ink-2);line-height:1.5}
.tr-list li:before{content:"☉";position:absolute;left:0;color:var(--brass);font-size:11px;top:2px}

/* llm reading */
.reading{margin-top:18px;border-color:rgba(236,199,132,.3);
  background:linear-gradient(135deg,rgba(236,199,132,.09),var(--panel))}
.reading-body{font-family:"Fraunces",serif;font-size:19px;line-height:1.65;color:var(--ink);margin:6px 0 0;font-weight:400}
.reading-body:first-letter{font-size:52px;float:left;line-height:.86;padding:6px 12px 0 0;color:var(--brass);font-weight:600}
.lc-prose{font-size:15px;line-height:1.68;color:var(--ink);margin:16px 0 4px}
.lc-basis{font-size:10.5px;text-transform:uppercase;letter-spacing:1.3px;color:var(--faint);margin:10px 0 0}

/* life */
.gauge.sm{width:74px;height:74px} .gauge.sm:after{inset:7px} .gauge.sm .g-num{font-size:23px}
.life-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.life-card{display:flex;flex-direction:column}
.lc-head{display:flex;align-items:center;gap:14px}
.lc-icon{font-size:27px;line-height:1}
.lc-title{flex:1}
.lc-factors{list-style:none;padding:0;margin:16px 0 0;display:flex;flex-direction:column;gap:9px;flex:1}
.lc-factors li{position:relative;padding-left:19px;font-size:13.5px;color:var(--ink-2);line-height:1.5}
.lc-factors li:before{content:"✦";position:absolute;left:0;color:var(--brass);font-size:10px;top:3px}
.lc-now{margin-top:16px;padding:13px 15px;border-radius:12px;font-size:13px;line-height:1.5;background:#100c1a;border:1px solid var(--line)}
.lc-now-tag{display:inline-block;font-size:10.5px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin-right:6px}
.lc-now.t-good{border-color:rgba(95,196,146,.35);background:rgba(95,196,146,.06)}
.lc-now.t-caution{border-color:rgba(223,154,88,.35);background:rgba(223,154,88,.06)}

@media(max-width:820px){
  .chakra{grid-template-columns:1fr;justify-items:center;text-align:center;gap:22px}
  .chakra-side{text-align:center} .chips,.nextwin{justify-content:center}
}
@media(max-width:760px){
  .form,.grid,.cols,.wins,.summary,.life-grid{grid-template-columns:1fr}
  .statbar{grid-template-columns:repeat(2,1fr)}
  .wheel{width:290px;height:290px}
}
