/* ============================================================
   ASHTAVINAYAK — style.css
   Warm sacred dusk palette, glass panels, restrained gold.
   ============================================================ */
:root{
  --ink:#f5ecdf;
  --ink-dim:#cbb8a6;
  --bg0:#0a1410;
  --bg1:#101f18;
  --accent:#dfa45c;
  --accent2:#f0cf8e;
  --glass:rgba(15,29,23,.66);
  --glass-line:rgba(232,196,120,.20);
  --good:#7ddba8;
  --radius:18px;
  --font-d:'Fraunces', 'Tiro Devanagari Sanskrit', serif;
  --font-b:'Mukta','Tiro Devanagari Sanskrit', system-ui, sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overscroll-behavior:none}
body{
  font-family:var(--font-b);
  color:var(--ink);
  background:
    radial-gradient(120% 90% at 80% -10%, #17301f 0%, transparent 55%),
    radial-gradient(100% 80% at 10% 110%, #1c2a1c 0%, transparent 60%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
  min-height:100dvh;
  overflow:hidden;
  user-select:none;-webkit-user-select:none;
  touch-action:manipulation;
}
#app{position:relative;height:100dvh;width:100%;max-width:520px;margin:0 auto;overflow:hidden}
#fx-canvas{position:fixed;inset:0;pointer-events:none;z-index:60}

/* ---------- screens ---------- */
.screen{position:absolute;inset:0;display:none;flex-direction:column;z-index:2}
.screen.active{display:flex;animation:screenIn .45s cubic-bezier(.2,.8,.2,1)}
@keyframes screenIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.overlay-screen{z-index:20;background:rgba(12,6,20,.55);backdrop-filter:blur(6px);align-items:center;justify-content:center}
.overlay-screen:not(.active){display:none}

.hidden{display:none!important}

/* ---------- shared ---------- */
.glass{
  background:var(--glass);
  border:1px solid var(--glass-line);
  border-radius:var(--radius);
  backdrop-filter:blur(14px);
  box-shadow:0 18px 50px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,235,200,.08);
}
.btn{
  font-family:var(--font-b);font-weight:600;font-size:1.02rem;
  border:none;border-radius:999px;padding:.85rem 1.9rem;cursor:pointer;
  transition:transform .15s ease, box-shadow .2s ease;
  color:#2a1608;
}
.btn:active{transform:scale(.96)}
.btn-primary{
  background:linear-gradient(135deg,var(--accent2),var(--accent));
  box-shadow:0 6px 22px rgba(232,161,90,.35);
}
.btn-ghost{background:transparent;color:var(--ink-dim);border:1px solid var(--glass-line)}
.icon-btn{
  background:var(--glass);border:1px solid var(--glass-line);color:var(--ink);
  width:44px;height:44px;border-radius:14px;font-size:1.15rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex:none;
}
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  padding:calc(env(safe-area-inset-top) + 12px) 16px 10px;
}
.topbar-title{display:flex;align-items:center;gap:.6rem;min-width:0}
.topbar-title h2{font-family:var(--font-d);font-weight:600;font-size:1.25rem;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-sub{font-size:.8rem;color:var(--ink-dim)}
.tb-om{font-size:1.6rem;color:var(--accent2)}
.topbar-actions{display:flex;gap:.5rem}

/* ---------- splash ---------- */
#screen-splash{text-align:center}
.splash-inner{display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:100%;min-height:100%;padding:max(4.5vh,28px) 22px max(3vh,18px)}
.splash-quote{font-family:var(--font-d);font-style:italic;font-size:1.06rem;color:var(--accent2);text-shadow:0 2px 14px rgba(0,0,0,.55);max-width:280px;line-height:1.5;animation:splashRise .9s .1s both}
.splash-center{display:flex;flex-direction:column;align-items:center;animation:splashRise 1s .3s both}
.splash-om{font-size:3.1rem;color:var(--accent2);text-shadow:0 0 40px rgba(232,161,90,.5);animation:omGlow 2.4s ease-in-out infinite}
@keyframes omGlow{0%,100%{text-shadow:0 0 24px rgba(232,161,90,.35)}50%{text-shadow:0 0 60px rgba(232,161,90,.75)}}
.splash-title{font-family:var(--font-d);font-size:clamp(2.7rem,11vw,3.5rem);font-weight:700;letter-spacing:.045em;margin-top:.15rem;line-height:1.08;
  background:linear-gradient(180deg,#fff6dc 0%,#f5d894 34%,#d99b4a 62%,#a8662a 82%,#e8bd6f 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.65)) drop-shadow(0 10px 26px rgba(0,0,0,.5))}
.splash-divider{display:flex;align-items:center;gap:.6rem;margin:.55rem 0 .35rem}
.sd-line{display:block;width:64px;height:1px;background:linear-gradient(90deg,transparent,var(--accent2))}
.sd-line:last-child{background:linear-gradient(90deg,var(--accent2),transparent)}
.sd-gem{color:var(--accent2);font-size:.8rem;text-shadow:0 0 12px rgba(232,161,90,.6)}
.splash-sub{color:#e9d9b8;letter-spacing:.34em;text-transform:uppercase;font-size:.74rem}
.splash-diya{margin:1.5rem auto .6rem;width:64px;height:30px;background:linear-gradient(180deg,#8a5530,#4a2a1e);border-radius:0 0 60px 60px;position:relative;box-shadow:0 6px 18px rgba(0,0,0,.5)}
.splash-loading{color:var(--ink-dim);font-size:.88rem;animation:loadingPulse 1.6s ease-in-out infinite}
@keyframes loadingPulse{0%,100%{opacity:.55}50%{opacity:1}}
.splash-features{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;width:100%;max-width:420px;margin-top:1.6rem;animation:splashRise 1s .55s both}
.sf-item{display:flex;flex-direction:column;align-items:center;gap:.18rem}
.sf-ring{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;overflow:hidden;

  border:1.5px solid rgba(240,207,142,.85);background:radial-gradient(circle at 32% 26%,rgba(240,207,142,.22),rgba(20,12,6,.55) 70%);
  box-shadow:0 0 0 3px rgba(240,207,142,.12),0 8px 20px rgba(0,0,0,.45),inset 0 2px 6px rgba(255,240,200,.18)}
.sf-ring img{width:100%;height:100%;object-fit:cover}
.sf-label{font-weight:700;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:#f4e6c4;margin-top:.45rem}
.sf-sub{font-size:.6rem;color:var(--ink-dim);letter-spacing:.04em}
.splash-footer{margin-top:1.15rem;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(233,217,184,.75);animation:splashRise 1s .7s both}
@keyframes splashRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.diya-flame{position:absolute;left:50%;top:-18px;transform:translateX(-50%);width:14px;height:22px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
  background:radial-gradient(circle at 50% 80%, #fff3c4 0%, #ffd977 45%, #f08a3c 100%);
  animation:flick 1.1s ease-in-out infinite alternate;box-shadow:0 0 26px 8px rgba(255,190,90,.4)}
@keyframes flick{from{transform:translateX(-50%) scale(1) rotate(-2deg)}to{transform:translateX(-50%) scale(1.12) rotate(2deg)}}
.splash-loading{color:var(--ink-dim);font-size:.9rem}

/* ---------- onboarding ---------- */
#screen-onboarding{align-items:center;justify-content:center;padding:24px}
.onboard-card{padding:2rem 1.6rem;text-align:center;max-width:420px}
.onboard-om{font-size:3rem;color:var(--accent2)}
.onboard-card h2{font-family:var(--font-d);margin:.4rem 0 .8rem}
.onboard-card p{color:var(--ink-dim);line-height:1.55;font-size:.98rem}
.onboard-steps{margin:1.3rem 0;text-align:left;display:flex;flex-direction:column;gap:.7rem}
.ob-step{display:flex;gap:.7rem;align-items:center;font-size:.93rem}
.ob-ico{font-size:1.3rem;width:2rem;text-align:center}

/* ---------- map ---------- */
#map-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:0;scrollbar-width:none;overscroll-behavior:contain}
#yatra-map{width:100%;height:auto;display:block}
.map-path{stroke:url(#pathGrad);stroke-width:5;stroke-linecap:round;stroke-dasharray:1 14;opacity:.7}
.map-node{cursor:pointer}
.node-ring{fill:rgba(20,10,34,.82);stroke:rgba(255,211,77,.65);stroke-width:2.2;
  filter:drop-shadow(0 0 8px rgba(255,190,80,.35))}
.node-img{}
.node-imgring{fill:none;stroke:rgba(255,224,160,.9);stroke-width:1.6}
.map-node.locked .node-img{filter:grayscale(.85) brightness(.55)}
.map-node.locked{opacity:.75;cursor:default}
.map-node.available .node-ring{stroke:var(--accent2);animation:pulse 2.2s infinite}
.map-node.reached .node-ring{stroke:var(--accent2);stroke-width:2.6;animation:pulse 2.2s infinite}
.map-node.done .node-ring{stroke:#ffd34d}
.node-badge .nb-bg{fill:#1d1130;stroke:#ffd34d;stroke-width:1.4}
.node-badge .nb-t{fill:#ffe6b8;font-family:'Mukta',sans-serif;font-weight:700;font-size:11px}
.map-node.locked .nb-t{fill:#c9bfe0;font-size:9px}
.map-node.done .nb-bg{fill:#5c4310}
.map-node.done .nb-t{fill:#ffd34d}
@keyframes pulse{0%,100%{filter:drop-shadow(0 0 2px rgba(232,161,90,.2))}50%{filter:drop-shadow(0 0 12px rgba(232,161,90,.65))}}
.node-om{font-size:1.35rem;fill:var(--accent2)}
.map-node.done .node-om{fill:#bdf0d0}
.node-label{fill:var(--ink);font-family:var(--font-d);font-size:.95rem;font-weight:600}
.node-sub{fill:var(--ink-dim);font-size:.68rem}

/* ---------- chapter ---------- */
.chapter-body{flex:1;overflow-y:auto;padding:6px 16px 30px;display:flex;flex-direction:column;gap:14px}
#chapter-banner{height:120px;border-radius:var(--radius);position:relative;overflow:hidden;flex:none;
  border:1px solid var(--glass-line)}
.cb-om{position:absolute;left:18px;top:50%;transform:translateY(-50%);font-size:3rem;color:rgba(255,240,210,.85);text-shadow:0 2px 18px rgba(0,0,0,.4)}
.cb-temple{position:absolute;right:14px;bottom:0;height:110px;width:130px;opacity:.9}
.cb-temple svg{height:100%;width:100%}
#level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.level-btn{
  aspect-ratio:.86;border-radius:14px;border:1px solid var(--glass-line);
  background:var(--glass);color:var(--ink);cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  transition:transform .15s ease;
}
.level-btn:active{transform:scale(.94)}
.lb-n{font-family:var(--font-d);font-size:1.2rem;font-weight:600}
.lb-stars{font-size:.55rem;color:var(--accent2);letter-spacing:.05em}
.level-btn.done{background:linear-gradient(160deg,rgba(80,52,110,.8),rgba(50,30,74,.8))}
.level-btn.locked{opacity:.4;cursor:default}
#btn-enter-temple{align-self:center;margin-top:6px}

/* ---------- modals ---------- */
.modal{padding:1.6rem;width:min(88vw,380px);text-align:center}
.modal h3{font-family:var(--font-d);font-size:1.5rem;margin-bottom:.4rem}
.modal-sub{color:var(--ink-dim);font-size:.9rem;margin-bottom:1rem}
.modal-actions{display:flex;gap:.7rem;justify-content:center;margin-top:1.3rem}
.modal-actions.col{flex-direction:column}
.goal-row{display:flex;gap:.7rem;justify-content:center;margin:.9rem 0}
.moves-line{color:var(--ink-dim);font-size:.9rem}
.moves-line span:first-child{color:var(--accent2);font-weight:700;font-size:1.1rem}

/* ---------- game ---------- */
.game-hud{
  margin:calc(env(safe-area-inset-top) + 8px) 10px 6px;padding:8px 12px 10px;
  border-radius:20px;border:1.5px solid rgba(240,207,142,.42);
  background:linear-gradient(180deg,rgba(46,26,10,.82),rgba(24,13,7,.87));
  box-shadow:0 10px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,231,192,.2), 0 0 26px rgba(240,194,104,.1);
  backdrop-filter:blur(8px);
}
.hud-levelrow{display:flex;justify-content:center;margin-bottom:6px}
.hud-levelchip{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--font-d);font-weight:700;font-size:.95rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent2);text-shadow:0 2px 8px rgba(0,0,0,.55);
}
.hud-levelchip::before,.hud-levelchip::after{content:'';width:28px;height:1px;display:block;
  background:linear-gradient(90deg,transparent,rgba(240,207,142,.75),transparent)}
.hud-row{display:flex;align-items:center;gap:.65rem}
.hud-moves{
  flex:none;text-align:center;
  background:linear-gradient(180deg,rgba(74,40,16,.78),rgba(46,24,10,.82));
  border:1.5px solid rgba(240,207,142,.5);border-radius:14px;padding:.3rem .8rem;line-height:1.1;
  box-shadow:inset 0 1px 0 rgba(255,231,192,.18), 0 4px 12px rgba(0,0,0,.35);
}
.hud-moves span{font-family:var(--font-d);font-size:1.35rem;font-weight:700;color:var(--accent2);display:block}
.hud-moves small{color:var(--ink-dim);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase}
.score-strip{
  position:relative;flex:1;height:10px;margin:0 2px;border-radius:99px;
  background:rgba(0,0,0,.42);border:1px solid rgba(240,207,142,.3);overflow:visible;
}
#score-fill{height:100%;width:0%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--accent2));box-shadow:0 0 12px rgba(240,194,104,.5);transition:width .3s ease}
.score-stars{position:absolute;left:6%;right:6%;top:-8px;display:flex;justify-content:space-between;font-size:.95rem;color:rgba(255,255,255,.3)}
.score-stars span.lit{color:var(--accent2);text-shadow:0 0 10px rgba(240,201,135,.8)}
.hud-pause{flex:none;width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,rgba(74,40,16,.78),rgba(46,24,10,.82));
  border:1.5px solid rgba(240,207,142,.5);color:var(--accent2);
  box-shadow:inset 0 1px 0 rgba(255,231,192,.18), 0 4px 12px rgba(0,0,0,.35)}
.hud-goalswrap{margin-top:8px;padding:7px 8px 8px;border-radius:14px;
  background:rgba(0,0,0,.32);border:1px solid rgba(240,207,142,.24)}
.hud-collect{font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(240,207,142,.78);text-align:center;margin-bottom:5px;font-weight:600}
.hud-goals{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:center}
.hud-goal{
  display:flex;align-items:center;gap:.32rem;padding:.3rem .62rem;
  background:linear-gradient(180deg,rgba(58,32,13,.72),rgba(36,19,9,.78));
  border:1px solid rgba(240,207,142,.45);border-radius:999px;
  font-size:.85rem;font-weight:700;
}
.hud-goal .hg-ico{width:22px;height:22px;display:inline-flex}
.hud-goal .hg-ico svg{width:100%;height:100%}
.hud-goal.done{border-color:rgba(240,207,142,.85);box-shadow:0 0 10px rgba(240,194,104,.35);color:var(--accent2)}
#board-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:6px 10px 14px}
#board{
  position:relative;width:min(100%, calc(100dvh - 230px));aspect-ratio:1;
  background:rgba(18,11,6,.68);border-radius:20px;
  border:2px solid rgba(240,207,142,.55);
  box-shadow:inset 0 0 40px rgba(0,0,0,.4), 0 0 0 5px rgba(70,38,14,.55), 0 0 0 6.5px rgba(240,207,142,.32), 0 24px 60px rgba(0,0,0,.5);
}
.tile{position:absolute;width:12.5%;height:12.5%;padding:1.1%;cursor:pointer;will-change:left,top;touch-action:none}
.tile-inner{width:100%;height:100%;position:relative;transition:transform .15s ease}
.tile-inner svg{width:100%;height:100%;display:block;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35))}
.tile.selected .tile-inner{transform:scale(1.14);filter:drop-shadow(0 0 10px rgba(240,201,135,.8))}
.tile.clearing .tile-inner{animation:tilePop .26s ease forwards}
@keyframes tilePop{40%{transform:scale(1.25);opacity:.9}100%{transform:scale(0);opacity:0}}
.tile.cracked .tile-inner{filter:brightness(1.3)}
.chain{
  position:absolute;inset:-4%;border-radius:16px;pointer-events:none;
  border:3px solid rgba(200,200,220,.75);border-style:dashed;
  box-shadow:0 0 10px rgba(180,180,220,.35) inset;
}
.special-aura{position:absolute;inset:-10%;pointer-events:none;border-radius:50%}
/* Shivling (4-match line clearer): silver-white shivling, direction shimmer */
.shivling-aura{inset:-14%;filter:drop-shadow(0 0 12px rgba(200,230,255,.95));animation:auraPulse 1.8s ease-in-out infinite}
.shivling-aura svg{width:100%;height:100%}
.shivling-aura.h{background:linear-gradient(0deg, transparent 42%, rgba(210,235,255,.30) 50%, transparent 58%)}
.shivling-aura.v{background:linear-gradient(90deg, transparent 42%, rgba(210,235,255,.30) 50%, transparent 58%)}
/* Shakti (L/T 3x3 burst): rotating lotus of energy */
.shakti-aura2{inset:-18%;animation:auraSpin 6s linear infinite;filter:drop-shadow(0 0 14px rgba(255,154,213,.85))}
.shakti-aura2 svg{width:100%;height:100%}
.shakti-lotus{opacity:.95}
/* Mahakal (5-match four-line blast): golden trident in a blue power ring */
.mahakal-aura{inset:-20%;animation:mahakalPulse 1.3s ease-in-out infinite;filter:drop-shadow(0 0 18px rgba(255,211,77,.9))}
.mahakal-aura svg{width:100%;height:100%}
.mahakal-ring{transform-origin:50% 50%;animation:auraSpin 9s linear infinite}
@keyframes mahakalPulse{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.14);opacity:1}}
@keyframes auraSpin{to{transform:rotate(360deg)}}
@keyframes auraPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.1);opacity:1}}
#game-toast{
  position:absolute;left:50%;bottom:24px;transform:translateX(-50%);
  background:var(--glass);border:1px solid var(--glass-line);border-radius:999px;
  padding:.5rem 1.2rem;font-size:.9rem;z-index:5;
}

/* ---------- win ---------- */
.win-modal{position:relative;overflow:hidden}
.win-stars{font-size:2.2rem;letter-spacing:.2em;margin:.4rem 0}
.win-stars span{color:rgba(255,255,255,.2);display:inline-block;animation:starPop .5s ease backwards}
.win-stars span.lit{color:var(--accent2);text-shadow:0 0 18px rgba(240,201,135,.8)}
.win-stars span:nth-child(2){animation-delay:.15s}
.win-stars span:nth-child(3){animation-delay:.3s}
@keyframes starPop{from{transform:scale(0) rotate(-40deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}
.win-burst{position:absolute;inset:-40%;background:radial-gradient(circle,rgba(240,201,135,.14),transparent 60%);pointer-events:none}

/* ---------- temple ---------- */
#screen-temple{z-index:3}
#temple-stage{position:relative;flex:1;display:flex;flex-direction:column;overflow:hidden}
#temple-sky{position:absolute;inset:0;transition:background 1s ease}
#temple-art{position:absolute;left:0;right:0;bottom:0;height:46%;display:flex;align-items:flex-end;justify-content:center}
#temple-art .temple-svg{height:100%;filter:drop-shadow(0 -6px 40px rgba(255,200,130,.25))}
.reveal-anim{animation:templeRise 1.6s cubic-bezier(.2,.8,.2,1) backwards .2s}
@keyframes templeRise{from{transform:translateY(60%);opacity:0}to{transform:none;opacity:1}}
#temple-ui{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:flex-start;padding:calc(env(safe-area-inset-top) + 30px) 20px 24px;overflow-y:auto}
.temple-reveal-text{text-align:center;animation:screenIn .8s ease backwards .8s}
.tr-kicker{letter-spacing:.3em;text-transform:uppercase;font-size:.72rem;color:rgba(255,240,215,.75)}
.tr-name{font-family:var(--font-d);font-size:2.6rem;font-weight:700;text-shadow:0 4px 30px rgba(0,0,0,.5);margin:.2rem 0}
.tr-place{color:rgba(255,235,210,.85);margin-bottom:1.4rem;font-size:.95rem}
.story-card{padding:1.4rem;text-align:left;animation:screenIn .5s ease}
.story-card h2{font-family:var(--font-d);font-size:1.7rem}
.story-place{color:var(--accent2);font-size:.85rem;margin-bottom:.8rem}
.story-card details{margin:.55rem 0;border-top:1px solid var(--glass-line);padding-top:.55rem}
.story-card summary{cursor:pointer;font-weight:600;color:var(--accent2);font-size:.95rem}
.story-card details p{color:var(--ink);line-height:1.6;margin-top:.45rem;font-size:.95rem}
.provenance{font-size:.7rem;color:var(--ink-dim);margin-top:.8rem;letter-spacing:.06em}

/* ---------- puja ---------- */
.puja-stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:14px}
.puja-altar{width:min(100%,340px);padding:.85rem .9rem;text-align:center;position:relative;margin-bottom:6px}
.puja-stage{justify-content:space-between;padding-top:6px;gap:8px}
.puja-murti-wrap{margin:0 auto;animation:murtiEnter .9s cubic-bezier(.2,.8,.25,1) both}
@keyframes murtiEnter{0%{opacity:0;transform:translateY(18px) scale(.92);filter:blur(6px)}100%{opacity:1;transform:none;filter:blur(0)}}
.puja-murti-frame{width:190px;height:238px;margin:0 auto;border-radius:100px 100px 16px 16px;overflow:hidden;
  border:2.5px solid rgba(255,214,90,.9);outline:1.5px solid rgba(255,236,190,.55);outline-offset:-7px;
  box-shadow:0 0 30px rgba(255,190,80,.5),0 18px 42px rgba(0,0,0,.68),inset 0 0 34px rgba(8,3,16,.55);
  transform:perspective(900px) rotateX(3.5deg);
  animation:murtiGlow 3s ease-in-out infinite,murtiDrift 17s ease-in-out infinite alternate;position:relative}
@keyframes murtiDrift{0%{transform:perspective(900px) rotateX(3.5deg) translateY(0)}100%{transform:perspective(900px) rotateX(3.5deg) translateY(-5px)}}
.puja-murti-wrap::after{content:'';display:block;width:64%;height:16px;margin:10px auto 0;border-radius:50%;
  background:radial-gradient(ellipse,rgba(0,0,0,.6),transparent 70%);filter:blur(2px);pointer-events:none}
@keyframes murtiGlow{0%,100%{filter:drop-shadow(0 0 8px rgba(255,200,130,.22))}50%{filter:drop-shadow(0 0 22px rgba(255,200,130,.5))}}
.puja-murti-img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;
  animation:murtiBreath 5.5s ease-in-out infinite;transform-origin:50% 62%}
@keyframes murtiBreath{0%,100%{transform:scale(1.03);filter:brightness(1)}50%{transform:scale(1.06);filter:brightness(1.07)}}
.puja-murti-frame::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,transparent 32%,rgba(255,242,205,.12) 45%,rgba(255,244,214,.30) 50%,rgba(255,242,205,.12) 55%,transparent 68%);
  background-size:260% 100%;background-position:120% 0;animation:murtiSheen 6.5s ease-in-out infinite}
@keyframes murtiSheen{0%,18%{background-position:120% 0}62%,100%{background-position:-40% 0}}
.blessing-murti,.story-darshan img{animation:murtiBreath 6.5s ease-in-out infinite;transform-origin:50% 60%}
.puja-murti-name{text-align:center;font-family:'Tiro Devanagari Sanskrit',serif;color:var(--accent2);
  font-size:1rem;margin:.35rem auto 0;text-shadow:0 2px 8px rgba(0,0,0,.75);
  width:max-content;padding:.15rem .9rem;border-radius:999px;
  background:rgba(12,6,24,.55);border:1px solid rgba(240,201,135,.28);backdrop-filter:blur(4px)}
.puja-murti-frame.murti-pulse{animation:murtiPulse .7s ease}
@keyframes murtiPulse{0%{transform:scale(1)}35%{transform:scale(1.08)}100%{transform:scale(1)}}
.puja-murti-frame.aarti-glow{border-color:#ffe9a8;
  box-shadow:0 0 48px rgba(255,205,95,.8),0 0 90px rgba(255,180,60,.4),0 10px 30px rgba(0,0,0,.55)}
.puja-diya{font-size:2.4rem;margin:.4rem auto;position:relative;width:fit-content;cursor:pointer;transition:transform .2s}
.puja-diya.holding{transform:scale(1.15)}
.puja-flame{position:absolute;left:50%;top:-14px;transform:translateX(-50%);width:12px;height:20px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
  background:radial-gradient(circle at 50% 80%, #fff3c4 0%, #ffd977 45%, #f08a3c 100%);
  animation:flick 1s ease-in-out infinite alternate;box-shadow:0 0 24px 8px rgba(255,190,90,.5)}
.puja-offerings{display:flex;gap:1rem;justify-content:center;margin:.6rem 0}
.offer-btn{background:rgba(255,255,255,.06);border:1px solid var(--glass-line);border-radius:16px;width:62px;height:62px;cursor:pointer;transition:transform .15s;padding:6px;animation:offerIn .5s cubic-bezier(.2,.9,.3,1.4) both}
.offer-btn img{width:100%;height:100%;object-fit:cover;border-radius:11px;display:block}
.puja-diya-img{width:72px;height:72px;border-radius:18px;display:block;box-shadow:0 6px 22px rgba(0,0,0,.5)}
.offer-btn:active{transform:scale(.9)}
.aarti-spin{animation:aartiHint 1.4s ease-in-out infinite;border-color:var(--accent2)}
@keyframes aartiHint{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
.puja-instruction{min-height:2.4rem;color:var(--accent2);font-size:1rem;margin-top:.4rem}
.puja-progress{display:flex;gap:8px;justify-content:center;margin-top:.3rem}
.puja-progress span{width:26px;height:5px;border-radius:99px;background:rgba(255,255,255,.15)}
.puja-progress span.now{background:var(--accent)}
.puja-progress span.done{background:var(--good)}
.puja-skip{align-self:center}

/* story darshan strip */
.story-darshan{display:flex;gap:.8rem;align-items:center;margin-bottom:.55rem}
.story-darshan img{width:62px;height:78px;object-fit:cover;object-position:top;
  border-radius:34px 34px 8px 8px;border:1.5px solid rgba(255,211,77,.7);
  box-shadow:0 0 14px rgba(255,190,80,.35)}
.story-darshan .sd-name{font-family:'Tiro Devanagari Sanskrit',serif;color:var(--accent2);font-size:1.05rem;margin:0}
.story-darshan .sd-sub{font-size:.78rem;color:var(--ink-dim);margin:.1rem 0 0}

@keyframes offerIn{0%{opacity:0;transform:translateY(14px) scale(.7)}100%{opacity:1;transform:none}}
.offer-btn.offered{opacity:.35;transform:scale(.92);filter:saturate(.4)}

/* garbhagriha petals drifting through the sanctum light */
.puja-petal{position:absolute;top:-24px;width:14px;height:11px;pointer-events:none;z-index:2;
  background:radial-gradient(ellipse at 35% 35%, #ffb08a, #e2574c 70%);
  border-radius:80% 10% 80% 10%;opacity:0;animation:petalFall linear infinite}
.puja-petal.p2{background:radial-gradient(ellipse at 35% 35%, #ffd27a, #d98a2b 70%)}
.puja-petal.p3{background:radial-gradient(ellipse at 35% 35%, #fff0f3, #e88aa0 70%)}
@keyframes petalFall{
  0%{transform:translateY(-5vh) translateX(0) rotate(0deg);opacity:0}
  8%{opacity:.85}
  50%{transform:translateY(46vh) translateX(4vw) rotate(200deg)}
  92%{opacity:.7}
  100%{transform:translateY(96vh) translateX(-3vw) rotate(420deg);opacity:0}}

/* aarti: spark that rides the circle with your finger */
.aarti-spark{position:absolute;width:16px;height:16px;left:50%;top:50%;margin:-8px;pointer-events:none;z-index:5;
  border-radius:50%;background:radial-gradient(circle,#fff8dd 0%,#ffd34d 45%,rgba(255,170,50,0) 72%);
  filter:drop-shadow(0 0 8px rgba(255,205,90,.95));opacity:0;transition:opacity .25s}
.puja-altar.aarti-ready .aarti-spark{opacity:1}

/* aarti: the diya becomes a real thali, big and low where hands would hold it */
.puja-altar.aarti-mode{padding:.7rem .9rem}
.puja-altar.aarti-mode .puja-flame{display:none}
.puja-altar.aarti-mode .puja-diya{margin:.15rem auto .1rem;cursor:crosshair}
.puja-altar.aarti-mode .puja-diya-img{width:196px;height:196px;border-radius:50%;object-fit:cover;
  border:3px solid rgba(255,214,120,.85);
  box-shadow:0 0 44px rgba(255,180,60,.55),0 0 110px rgba(255,150,40,.28),0 16px 36px rgba(0,0,0,.65)}
.puja-altar.aarti-mode .aarti-ring{inset:-14%;width:128%;height:128%}

/* ---------- immersive vr puja: full-screen living murti + subtle thali tray ---------- */
.puja-stage.vr{padding:0;justify-content:flex-start;gap:0;align-items:stretch;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw)}
.puja-hero{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:0 0 24px 24px;z-index:1}
.puja-hero-inner{position:absolute;top:-3.5%;left:-3.5%;width:107%;height:107%;transition:transform .25s ease-out;will-change:transform}
.puja-hero-img{width:100%;height:100%;object-fit:cover;object-position:center 24%;display:block;
  animation:heroLife 9s ease-in-out infinite}
@keyframes heroLife{0%,100%{transform:scale(1.05) translate(0,0);filter:brightness(1) saturate(1.1) contrast(1.04)}50%{transform:scale(1.085) translate(.6%,.4%);filter:brightness(1.06) saturate(1.14) contrast(1.05)}}
.puja-hero-glow{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(ellipse 90% 46% at 50% 100%,rgba(255,170,60,.22),transparent 62%);
  animation:diyaFlicker 3.8s ease-in-out infinite}
@keyframes diyaFlicker{0%,100%{opacity:.75}30%{opacity:.95}55%{opacity:.62}80%{opacity:.9}}
.puja-hero-sheen{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 38%,rgba(255,244,214,.10) 48%,rgba(255,244,214,.22) 52%,rgba(255,244,214,.10) 56%,transparent 66%);
  background-size:280% 100%;background-position:120% 0;animation:heroSheen 8.5s ease-in-out infinite}
@keyframes heroSheen{0%,15%{background-position:120% 0}60%,100%{background-position:-60% 0}}
.hero-sparkle{position:absolute;width:5px;height:5px;border-radius:50%;background:#ffe9b0;pointer-events:none;
  box-shadow:0 0 8px 2px rgba(255,220,140,.8);opacity:0;animation:twinkle 4.4s ease-in-out infinite;z-index:3}
.hero-sparkle.hs1{left:36%;top:28%}.hero-sparkle.hs2{left:63%;top:37%;animation-delay:1.5s}.hero-sparkle.hs3{left:50%;top:20%;animation-delay:2.9s}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:.9;transform:scale(1.15)}}
/* divine aura breathing behind the murti */
.puja-hero-aura{position:absolute;left:50%;top:36%;transform:translate(-50%,-50%);border-radius:50%;
  pointer-events:none;mix-blend-mode:screen;z-index:1}
.puja-hero-aura.a1{width:125%;aspect-ratio:1/1;
  background:radial-gradient(circle,rgba(255,196,90,.26),rgba(255,170,60,.10) 42%,transparent 66%);
  animation:auraPulse 7s ease-in-out infinite}
.puja-hero-aura.a2{width:80%;aspect-ratio:1/1;
  background:radial-gradient(circle,rgba(255,236,180,.30),transparent 60%);
  animation:auraPulse 5.2s ease-in-out infinite reverse}
@keyframes auraPulse{0%,100%{opacity:.5;transform:translate(-50%,-50%) scale(1)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.06)}}

/* slow rotating light rays from behind the mukut */
.puja-hero-rays{position:absolute;left:50%;top:33%;width:160%;aspect-ratio:1/1;pointer-events:none;z-index:1;
  transform:translate(-50%,-50%);mix-blend-mode:screen;opacity:.45;
  background:repeating-conic-gradient(from 0deg, rgba(255,214,120,.13) 0deg 5deg, transparent 5deg 13deg);
  -webkit-mask:radial-gradient(circle, #000 0%, transparent 60%);
  mask:radial-gradient(circle, #000 0%, transparent 60%);
  animation:raysSpin 95s linear infinite}
@keyframes raysSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}

/* cinema vignette so the murti pops */
.puja-hero-vignette{position:absolute;inset:0;pointer-events:none;z-index:3;
  background:radial-gradient(ellipse 80% 64% at 50% 42%,transparent 56%,rgba(6,2,14,.42) 100%)}

/* jewel glints - light catching the mukut and ornaments */
.hero-glint{position:absolute;width:16px;height:16px;pointer-events:none;opacity:0;z-index:3;
  animation:glintFlash 9s ease-in-out infinite}
.hero-glint::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);
  background:linear-gradient(transparent,#fff8dd,transparent)}
.hero-glint::after{content:'';position:absolute;top:50%;left:0;right:0;height:2px;transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,#fff8dd,transparent)}
@keyframes glintFlash{0%,86%,100%{opacity:0;transform:scale(.4) rotate(0deg)}
  91%{opacity:.95;transform:scale(1.15) rotate(18deg)}96%{opacity:.35;transform:scale(.8) rotate(38deg)}}

/* golden motes rising like incense dust in the sanctum light */
.hero-mote{position:absolute;bottom:16%;width:4px;height:4px;border-radius:50%;z-index:3;
  background:rgba(255,224,160,.85);filter:blur(.6px);opacity:0;pointer-events:none;
  animation:moteRise 12s linear infinite}
@keyframes moteRise{0%{transform:translate(0,0);opacity:0}12%{opacity:.7}80%{opacity:.5}
  100%{transform:translate(var(--mx,2vw),-52vh);opacity:0}}

.hero-name{position:absolute;left:50%;transform:translateX(-50%);bottom:10px;margin:0;z-index:4}
.hero-ring{position:absolute;left:50%;top:42%;width:min(84vw,330px);height:min(84vw,330px);
  transform:translate(-50%,-50%) rotate(-90deg);border-radius:50%;pointer-events:none;z-index:4;
  background:conic-gradient(#ffd34d calc(var(--p,0)*1turn), rgba(255,211,77,.22) 0);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 15px), #000 calc(100% - 14px));
  mask:radial-gradient(farthest-side, transparent calc(100% - 15px), #000 calc(100% - 14px));
  filter:drop-shadow(0 0 8px rgba(255,211,77,.55))}
.hero-ring.hidden{display:none}
.thali-home{width:64px;height:64px;flex:none}
.puja-hero.murti-pulse{animation:murtiPulse .7s ease}
.puja-hero.aarti-glow .puja-hero-img{filter:brightness(1.09)}

.puja-tray{position:relative;z-index:5;margin:8px 10px;padding:.5rem .8rem;border-radius:20px;
  background:rgba(14,7,26,.55);backdrop-filter:blur(10px);border:1px solid rgba(240,201,135,.14)}
.puja-tray .puja-instruction{margin:.05rem 0 .4rem;font-size:.92rem}
.puja-tray-row{display:flex;align-items:center;gap:14px;min-height:64px}
.puja-thali{position:relative;width:64px;height:64px;flex:none;cursor:pointer;transition:transform .2s}
.puja-thali.holding{transform:scale(.93)}
.puja-thali-img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;
  border:2px solid rgba(255,214,120,.8);box-shadow:0 4px 16px rgba(0,0,0,.5)}
.puja-thali.free{position:fixed;z-index:90;width:88px;height:88px;cursor:grabbing;
  filter:drop-shadow(0 0 18px rgba(255,190,80,.75))}
.puja-thali.free .puja-thali-img{border-width:2.5px}
.thali-items{position:absolute;inset:0;pointer-events:none}
.thali-mini{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;object-fit:cover;
  border:1.5px solid rgba(255,230,170,.9);box-shadow:0 2px 6px rgba(0,0,0,.55);animation:miniIn .3s ease both}
@keyframes miniIn{0%{transform:scale(.2);opacity:0}100%{transform:scale(1);opacity:1}}
.puja-chips{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.chip-btn{width:46px;height:46px;border-radius:50%;padding:2px;background:rgba(255,255,255,.07);
  border:1px solid var(--glass-line);cursor:pointer;animation:offerIn .5s cubic-bezier(.2,.9,.3,1.4) both;transition:transform .15s}
.chip-btn img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.chip-btn.offered{opacity:.28;transform:scale(.82);pointer-events:none}
.puja-tray .puja-progress{margin-top:.35rem;justify-content:flex-start}
.puja-stage.vr .puja-skip{position:absolute;top:12px;right:12px;z-index:6;padding:.3rem .75rem;font-size:.82rem;opacity:.7}
.puja-stage.vr .puja-petal{z-index:3}

/* small screens: keep the murti hero + altar both visible */
@media (max-height:640px){
  .puja-thali{width:54px;height:54px}
  .chip-btn{width:38px;height:38px}
  .puja-tray{padding:.35rem .6rem;margin:6px 8px}
  .puja-tray .puja-instruction{font-size:.85rem;margin-bottom:.25rem}
  .hero-ring{width:min(72vw,260px);height:min(72vw,260px)}
  .thali-home{width:54px;height:54px}
  .puja-murti-frame{width:132px;height:166px;border-radius:74px 74px 12px 12px}
  .puja-altar{padding:.6rem .7rem;margin-bottom:2px}
  .offer-btn{width:52px;height:52px}
  .puja-diya-img{width:56px;height:56px}
  .puja-altar.aarti-mode .puja-diya-img{width:150px;height:150px}
}

/* ---------- temple entry cinematic ---------- */
.entry-stage{position:absolute;inset:0;overflow:hidden}
.entry-sky{position:absolute;inset:0;transition:opacity 1.6s ease, transform 6s ease}
.entry-sky .art-bg{position:absolute;inset:0;background-size:cover;background-position:center;animation:kb 14s ease-in-out infinite alternate}
.entry-doors{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .8s ease}
.entry-door{position:absolute;top:0;bottom:0;width:51%;z-index:3;
  background:
    radial-gradient(circle at 50% 12%, rgba(255,200,110,.16), transparent 40%),
    repeating-linear-gradient(90deg, rgba(255,190,110,.06) 0 8px, transparent 8px 46px),
    linear-gradient(160deg,#3a2413,#1d0f06 60%,#120803);
  transition:transform 2.1s cubic-bezier(.65,.02,.28,1)}
.entry-door.left{left:0;border-right:3px solid rgba(255,205,110,.75);box-shadow:-14px 0 40px rgba(0,0,0,.6) inset}
.entry-door.right{right:0;border-left:3px solid rgba(255,205,110,.75);box-shadow:14px 0 40px rgba(0,0,0,.6) inset}
.entry-door::before{content:'';position:absolute;top:8%;bottom:8%;width:52%;left:24%;
  border:2px solid rgba(255,205,110,.28);border-radius:46% 46% 10px 10px}
.entry-light{position:absolute;left:50%;top:0;bottom:0;width:6px;transform:translateX(-50%);z-index:2;
  background:linear-gradient(rgba(255,230,160,.0),rgba(255,220,140,.95),rgba(255,230,160,.0));
  box-shadow:0 0 60px 30px rgba(255,205,100,.55);opacity:0;transition:opacity 1.2s ease, width 2s ease, box-shadow 2s ease}
.entry-sanctum{position:absolute;inset:0;opacity:0;transform:scale(1.14);overflow:hidden;
  transition:opacity 1.9s ease, transform 3.2s cubic-bezier(.2,.7,.3,1)}
.entry-sanctum .entry-murti{position:absolute;inset:-2%;width:104%;height:104%}
.entry-title{position:absolute;left:0;right:0;bottom:0;text-align:center;z-index:6;padding:3.4rem 1.4rem 2.2rem;
  background:linear-gradient(transparent, rgba(10,5,2,.72) 38%, rgba(8,4,2,.88));
  opacity:0;transform:translateY(26px);transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.8,.3,1)}
.entry-title .tr-kicker{text-shadow:0 1px 8px rgba(0,0,0,.9)}
.entry-title .tr-name{text-shadow:0 2px 14px rgba(0,0,0,.9)}
.entry-title .tr-deva,.entry-title .tr-place{text-shadow:0 1px 8px rgba(0,0,0,.9)}
.entry-title .tr-disclaimer{margin-top:.9rem}
.entry-skipline{position:absolute;bottom:14px;right:16px;z-index:7;font-size:.8rem;color:rgba(247,240,228,.55);
  cursor:pointer;padding:.3rem .5rem}
.entry-skipline.hidden{display:none}
/* beat choreography */
.entry-stage.b2 .entry-doors{opacity:1}
.entry-stage.b2 .entry-door.left{transform:translateX(-103%)}
.entry-stage.b2 .entry-door.right{transform:translateX(103%)}
.entry-stage.b2 .entry-light{opacity:1;width:120px;box-shadow:0 0 90px 60px rgba(255,205,100,.6)}
.entry-stage.b3 .entry-sky{opacity:0;transform:scale(1.12)}
.entry-stage.b3 .entry-doors{opacity:0;transition:opacity 1.4s ease}
.entry-stage.b3 .entry-sanctum{opacity:1;transform:scale(1)}
.entry-stage.b4 .entry-sky{opacity:0}
.entry-stage.b4 .entry-sanctum{opacity:1;transform:scale(1);transition:opacity .8s ease,transform .8s ease}
.entry-stage.b4 .entry-doors{opacity:0}
.entry-stage.b4 .entry-title{opacity:1;transform:none}

/* ---------- blessing ---------- */
.blessing-card{padding:2rem 1.6rem;text-align:center;max-width:400px;margin:auto;animation:screenIn .7s ease}
.blessing-murti{width:92px;height:92px;border-radius:50%;object-fit:cover;object-position:top;
  border:2px solid rgba(255,211,77,.85);box-shadow:0 0 22px rgba(255,190,80,.5);margin:0 auto .25rem;display:block}
.blessing-pop{animation:blessingPop .8s cubic-bezier(.2,.9,.3,1.35) both}
@keyframes blessingPop{0%{opacity:0;transform:scale(.4)}100%{opacity:1;transform:scale(1)}}
.blessing-om{font-size:3.4rem;color:var(--accent2);text-shadow:0 0 40px rgba(232,161,90,.6)}
.mantra{font-family:'Tiro Devanagari Sanskrit',serif;font-size:1.35rem;color:var(--accent2);margin:.6rem 0}
.blessing-text{color:var(--ink);line-height:1.6}
.blessing-temple{color:var(--ink-dim);font-size:.85rem;margin-top:.8rem}
.blessing-final{margin-top:1rem;color:var(--good);font-weight:600}

/* ---------- journal ---------- */
#journal-grid{flex:1;overflow-y:auto;padding:8px 16px 30px;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
.journal-card{overflow:hidden;cursor:default}
.journal-card.done{cursor:pointer}
.jc-head{height:64px;display:flex;align-items:center;justify-content:center}
.jc-om{font-size:1.8rem;color:rgba(255,240,215,.9)}
.jc-body{padding:.7rem .8rem .9rem}
.jc-body h4{font-family:var(--font-d);font-size:1.02rem}
.jc-body p{font-size:.75rem;color:var(--ink-dim)}
.jc-state{margin-top:.3rem;color:var(--accent2)}

/* ---------- settings ---------- */
.setting-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--glass-line)}
.setting-row label{font-size:.95rem}
input[type=range]{width:130px;accent-color:var(--accent)}
.toggle{width:52px;height:28px;border-radius:99px;background:rgba(255,255,255,.12);border:1px solid var(--glass-line);position:relative;cursor:pointer;transition:background .2s}
.toggle::after{content:'';position:absolute;top:3px;left:4px;width:20px;height:20px;border-radius:50%;background:var(--ink-dim);transition:all .2s}
.toggle.on{background:rgba(232,161,90,.4)}
.toggle.on::after{left:26px;background:var(--accent2)}
.seg{display:flex;gap:6px}
.seg-btn{background:transparent;border:1px solid var(--glass-line);color:var(--ink-dim);border-radius:99px;padding:.35rem .9rem;cursor:pointer;font-family:var(--font-b)}
.seg-btn.on{background:rgba(232,161,90,.25);color:var(--accent2);border-color:var(--accent)}
.credits{margin-top:1.1rem;font-size:.7rem;color:var(--ink-dim);line-height:1.5}

/* ---------- fx ---------- */
.sacred-flash{position:fixed;inset:0;pointer-events:none;z-index:70;
  background:radial-gradient(circle at 50% 45%, rgba(255,235,190,.5), rgba(255,200,130,.12) 40%, transparent 70%);
  animation:flashFade .9s ease forwards}

/* golden light beams for Trishul / Mahakal line blasts */
.fx-beam{position:absolute;pointer-events:none;z-index:6;border-radius:999px;
  background:linear-gradient(90deg, transparent, #ffe9a8 18%, #ffd34d 50%, #ffe9a8 82%, transparent);
  box-shadow:0 0 22px rgba(255,211,77,.95), 0 0 44px rgba(255,180,60,.6)}
.beam-h{left:-4%;right:-4%;height:12px;transform:translateY(-50%);animation:beamH .6s ease-out forwards}
.beam-v{top:-4%;bottom:-4%;width:12px;transform:translateX(-50%);
  background:linear-gradient(180deg, transparent, #ffe9a8 18%, #ffd34d 50%, #ffe9a8 82%, transparent);
  animation:beamV .6s ease-out forwards}
@keyframes beamH{0%{opacity:0;transform:translateY(-50%) scaleX(.1)}18%{opacity:1}100%{opacity:0;transform:translateY(-50%) scaleX(1)}}
@keyframes beamV{0%{opacity:0;transform:translateX(-50%) scaleY(.1)}18%{opacity:1}100%{opacity:0;transform:translateX(-50%) scaleY(1)}}
/* screen shake */
.fx-shake{animation:shakeAnim .5s ease-in-out}
@keyframes shakeAnim{0%,100%{transform:translate(0,0)}15%{transform:translate(-6px,3px)}30%{transform:translate(5px,-4px)}45%{transform:translate(-4px,-3px)}60%{transform:translate(4px,2px)}75%{transform:translate(-2px,1px)}}
/* floating special name */
.fx-floatname{position:absolute;transform:translate(-50%,-50%);z-index:7;pointer-events:none;
  font-family:'Tiro Devanagari Sanskrit',serif;font-size:1.35rem;font-weight:700;color:#ffd34d;
  text-shadow:0 0 12px rgba(255,180,60,.9),0 2px 6px rgba(0,0,0,.7);
  animation:floatName 1.25s ease-out forwards}
@keyframes floatName{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}20%{opacity:1;transform:translate(-50%,-70%) scale(1.15)}100%{opacity:0;transform:translate(-50%,-190%) scale(1)}}

@keyframes flashFade{from{opacity:0}15%{opacity:1}to{opacity:0}}
#toast{
  position:fixed;left:50%;bottom:40px;transform:translateX(-50%);z-index:80;
  background:var(--glass);border:1px solid var(--glass-line);border-radius:999px;
  padding:.55rem 1.3rem;font-size:.9rem;backdrop-filter:blur(10px);
}


/* ============================================================
   V2 — art-led depth: photographic temple art, emerald + gold
   ============================================================ */

/* photographic samagri tokens */
.tile-inner img.token-img{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:24%;
  box-shadow:0 0 0 1px rgba(240,208,142,.22), 0 5px 12px rgba(0,0,0,.45);
}
.hud-goal .hg-ico img{width:100%;height:100%;border-radius:6px;object-fit:cover;display:block}

/* board floats over its temple's dimmed art */
#screen-game::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background-image:var(--board-art,none);background-size:cover;background-position:center;
  filter:blur(8px) brightness(.55) saturate(1.05);
}
#board{z-index:1}

/* splash: full-bleed art, slow cinematic zoom */
.splash-bg-art{position:absolute;inset:0;background-image:var(--splash-art,none);background-size:cover;background-position:center;background-repeat:no-repeat;
  animation:slowZoom 16s ease-in-out infinite alternate}
.splash-bg-art::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(7,15,11,.62) 0%,rgba(7,15,11,.30) 40%,rgba(7,15,11,.78) 100%)}
.splash-inner{position:relative;z-index:1}
@keyframes slowZoom{from{transform:scale(1)}to{transform:scale(1.09)}}

/* map: painterly journey art behind everything */
#screen-map::before{content:'';position:absolute;inset:0;
  background-image:var(--map-art,none);background-size:cover;background-position:center;background-repeat:no-repeat}
#screen-map::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,15,11,.66) 0%,rgba(7,15,11,.34) 30%,rgba(7,15,11,.30) 62%,rgba(7,15,11,.86) 100%)}
#screen-map .topbar,#screen-map #map-scroll{position:relative;z-index:1}
.map-hero{padding:26px 24px 6px}
.kicker{letter-spacing:.3em;text-transform:uppercase;font-size:.68rem;color:rgba(240,207,142,.85);font-weight:600}
.map-headline{font-family:var(--font-d);font-weight:700;font-size:2.1rem;line-height:1.12;margin-top:.45rem;
  text-shadow:0 3px 26px rgba(0,0,0,.65)}
.map-note{text-align:center;font-size:.7rem;color:rgba(240,230,210,.6);letter-spacing:.05em;padding:6px 0 34px}
.map-path{filter:drop-shadow(0 0 6px rgba(240,207,142,.45));opacity:.85}
.node-ring{fill:rgba(9,19,14,.82);stroke:rgba(240,208,142,.5);stroke-width:1.5}
.node-core{fill:#132a1f}
.map-node.available .node-core{fill:#1d3a2a;stroke:var(--accent);stroke-width:2.5;animation:pulse 2.2s infinite}
.map-node.reached .node-core{fill:#3d341c;stroke:var(--accent2);stroke-width:2.5;animation:pulse 2.2s infinite}
.map-node.done .node-core{fill:#1d3a2a;stroke:var(--good);stroke-width:2}
.node-om{font-family:var(--font-d);font-weight:700;font-size:1.05rem;fill:var(--accent2)}
.map-node.done .node-om{fill:#bdf0d0}
.node-label{paint-order:stroke;stroke:rgba(6,13,9,.88);stroke-width:4.5px;stroke-linejoin:round}
.node-sub{paint-order:stroke;stroke:rgba(6,13,9,.88);stroke-width:3.5px;stroke-linejoin:round}

/* chapter banner art */
#chapter-banner{background-size:cover;background-position:center 32%}
#chapter-banner::after{content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(7,15,11,.72),rgba(7,15,11,.12) 65%)}
.cb-om{z-index:1}

/* temple stage: full-bleed photographic art */
.art-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.art-bg.kb{animation:kb 9s cubic-bezier(.2,.8,.2,1) both}
@keyframes kb{from{transform:scale(1.15)}to{transform:scale(1.02)}}
.art-shade{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,15,11,.44) 0%,rgba(7,15,11,.05) 32%,rgba(7,15,11,.16) 58%,rgba(7,15,11,.85) 100%)}
.atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.atmosphere span{position:absolute;bottom:-6%;width:8px;height:8px;border-radius:60% 60% 60% 0;
  background:radial-gradient(circle at 35% 35%, #ffe3b0, #e88a6a);opacity:0;
  animation:petalRise linear infinite}
.atmosphere span:nth-child(1){left:12%;animation-duration:11s;animation-delay:.5s}
.atmosphere span:nth-child(2){left:32%;animation-duration:14s;animation-delay:2.4s;width:6px;height:6px}
.atmosphere span:nth-child(3){left:51%;animation-duration:12s;animation-delay:4.2s;width:9px;height:9px}
.atmosphere span:nth-child(4){left:68%;animation-duration:15s;animation-delay:1.2s;width:5px;height:5px}
.atmosphere span:nth-child(5){left:82%;animation-duration:13s;animation-delay:3.1s}
.atmosphere span:nth-child(6){left:44%;animation-duration:16s;animation-delay:6s;width:6px;height:6px}
@keyframes petalRise{
  0%{transform:translateY(0) rotate(0deg);opacity:0}
  8%{opacity:.75}
  85%{opacity:.55}
  100%{transform:translateY(-108dvh) translateX(6vw) rotate(300deg);opacity:0}
}
.temple-reveal-text{margin-top:auto;margin-bottom:14px}
.tr-deva{font-family:'Tiro Devanagari Sanskrit',serif;font-size:1.35rem;color:var(--accent2);
  margin:.1rem 0 .35rem;text-shadow:0 2px 16px rgba(0,0,0,.6)}
.tr-disclaimer{font-size:.68rem;color:rgba(240,230,210,.55);margin-top:1.2rem;letter-spacing:.05em}
.tr-kicker{color:rgba(240,207,142,.9)}

/* puja over the sanctum art */
.puja-altar{background:rgba(10,22,16,.58)}
.blessing-card,.story-card{background:rgba(12,24,18,.72)}

/* journal art headers */
.jc-head{background-size:cover;background-position:center 32%;position:relative}
.jc-head::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,15,11,.15),rgba(7,15,11,.55))}
.jc-om{position:relative;z-index:1;text-shadow:0 2px 12px rgba(0,0,0,.7)}

/* ---------- desktop ---------- */
@media (min-width:760px){
  body{overflow:auto}
  #app{max-width:480px;box-shadow:0 0 80px rgba(0,0,0,.5);border-left:1px solid var(--glass-line);border-right:1px solid var(--glass-line)}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001s!important;transition-duration:.001s!important}
}

/* --- aarti circle gesture (puja step 4) --- */
.puja-altar.aarti-ready{box-shadow:0 0 0 2px rgba(255,211,77,.25), 0 0 40px rgba(255,180,60,.15);cursor:grab;touch-action:none}
.puja-altar.aarti-ready:active{cursor:grabbing}
.puja-diya{position:relative}
.aarti-ring{position:absolute;inset:-22%;width:144%;height:144%;pointer-events:none;transform:rotate(-90deg)}
.aarti-ring-bg{fill:none;stroke:rgba(255,211,77,.18);stroke-width:4}
.aarti-ring-fill{fill:none;stroke:#ffd34d;stroke-width:4;stroke-linecap:round;
  stroke-dasharray:276.5;stroke-dashoffset:276.5;filter:drop-shadow(0 0 6px rgba(255,211,77,.9));
  transition:stroke-dashoffset .12s linear}
.puja-diya.aarti-glow .puja-flame, .puja-diya.aarti-glow .puja-diya-img{
  filter:drop-shadow(0 0 18px rgba(255,190,80,.95))}
.puja-diya.aarti-glow:after{content:'';position:absolute;inset:-30%;border-radius:50%;pointer-events:none;
  background:conic-gradient(from var(--aarti-angle,0rad), transparent 0 78%, rgba(255,211,77,.5) 92%, transparent 100%);
  animation:none}

/* inventory-driven offerings */
.puja-offerings{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}
.offer-btn{display:flex;flex-direction:column;align-items:center;gap:.15rem}
.offer-name{font-size:.68rem;color:var(--gold-soft,#e8c97a);letter-spacing:.02em}
.offer-btn.offered{opacity:.35;filter:saturate(.4);transform:scale(.92);transition:all .35s ease}
.offer-btn.offered:after{content:'\2713';position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;
  background:#3f8f5f;color:#fff;font-size:.8rem;display:grid;place-items:center}
.offer-btn{position:relative}

/* short screens: shrink map header so the full yatra fits without scrolling */
@media (max-height:600px){
  .map-hero{padding:4px 0 2px}
  .map-hero .kicker{display:none}
  .map-hero .map-headline{font-size:1.05rem;margin:2px 0}
  .map-note{display:none}
}

/* ---------- v1.2 polish ---------- */
/* special name popup: golden pill, readable, game-like */
.fx-floatname{
  font-size:1.15rem;padding:.18em .7em;border-radius:999px;white-space:nowrap;
  background:linear-gradient(160deg,rgba(60,36,8,.92),rgba(30,16,4,.92));
  border:1.5px solid rgba(255,211,77,.85);
  box-shadow:0 0 18px rgba(255,190,70,.55),0 4px 10px rgba(0,0,0,.5);
}
/* level buttons: chunky game medallions */
.level-btn{
  aspect-ratio:.86;border-radius:16px;border:1px solid rgba(255,211,77,.18);
  background:linear-gradient(165deg,#3a2456,#221035);
  box-shadow:0 4px 0 #150a24, 0 8px 16px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.10);
  color:var(--ink);cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.level-btn:active{transform:translateY(3px) scale(.97);box-shadow:0 1px 0 #150a24, 0 3px 8px rgba(0,0,0,.4)}
.lb-n{font-family:var(--font-d);font-size:1.35rem;font-weight:700;color:#ffe6b8;text-shadow:0 2px 4px rgba(0,0,0,.55);line-height:1}
.lb-stars{font-size:.6rem;color:#ffd34d;letter-spacing:.08em;text-shadow:0 0 6px rgba(255,211,77,.55);line-height:1}
.level-btn.done{background:linear-gradient(165deg,#5a3a86,#381f56)}
.level-btn.done .lb-n{color:#ffd34d}
.level-btn.next{
  border-color:rgba(255,211,77,.85);
  background:linear-gradient(165deg,#6a4a9e,#3c2160);
  animation:nextPulse 1.6s ease-in-out infinite;
}
.level-btn.next .lb-n{color:#fff2c8}
@keyframes nextPulse{0%,100%{box-shadow:0 4px 0 #150a24, 0 0 10px rgba(255,211,77,.35)}50%{box-shadow:0 4px 0 #150a24, 0 0 26px rgba(255,211,77,.8)}}
.level-btn.locked{opacity:.5;filter:saturate(.5);cursor:default}
/* map node numbers: bold gold medallion text */
.node-om{font-weight:700;paint-order:stroke;stroke:rgba(20,10,0,.55);stroke-width:2.5px}

/* ---------- v1.3: board cells + journey level dots ---------- */
.tile{padding:1.4%}
.tile::before{
  content:'';position:absolute;inset:0;border-radius:16%;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.05);
}
.lvl-dot{cursor:pointer}
.ld-core{fill:#241530;stroke:rgba(240,201,135,.35);stroke-width:1.5}
.lvl-dot.done .ld-core{fill:url(#doneGlow);stroke:#d9a24a;stroke-width:1.6}
.lvl-dot.done.s1 .ld-core{stroke:#d9a24a;stroke-width:1.8}
.lvl-dot.done.s2 .ld-core{stroke:#eec25e;stroke-width:2}
.lvl-dot.done.s3 .ld-core{stroke:#ffd34d;stroke-width:2.4;filter:drop-shadow(0 0 3px rgba(255,205,90,.8))}
.lvl-dot.done .ld-n{fill:#4a2c06}
.lvl-dot.open .ld-core{fill:#3a2456;stroke:rgba(240,201,135,.6)}
.lvl-dot.next .ld-core{fill:#6a4a9e;stroke:#ffd34d;stroke-width:2.5;animation:pulse 2.2s infinite}
.lvl-dot.locked{opacity:.45;cursor:default}
.ld-n{fill:#ffe6b8;font-family:'Mukta',sans-serif;font-weight:700;text-anchor:middle;pointer-events:none}
.lvl-dot.locked .ld-n{fill:#8a83a0}
.ld-stars circle{fill:rgba(255,255,255,.16)}
.ld-stars circle.lit{fill:#ffd34d}

/* ---------- v1.5: special reveal + stacking ---------- */
/* special blocks always render above ordinary tiles */
.tile{z-index:1}
.tile:has(.special-aura){z-index:2}
.tile.selected{z-index:3}
.tile.clearing{z-index:4}
/* candy-crush style special reveal: pop-open with a golden ring flash */
.tile.special-born .tile-inner{animation:specialBorn .85s cubic-bezier(.2,1.4,.3,1)}
@keyframes specialBorn{
  0%{transform:scale(0);opacity:0}
  45%{transform:scale(1.45);opacity:1}
  70%{transform:scale(.92)}
  100%{transform:scale(1)}
}
.tile.special-born::after{
  content:'';position:absolute;inset:-22%;border-radius:50%;pointer-events:none;
  border:3px solid rgba(255,211,77,.9);
  animation:bornRing .85s ease-out forwards;
}
@keyframes bornRing{
  0%{transform:scale(.4);opacity:1;box-shadow:0 0 30px rgba(255,211,77,.8)}
  100%{transform:scale(1.6);opacity:0;box-shadow:0 0 0 rgba(255,211,77,0)}
}

/* v1.6: Ganesh presence behind the board, reacts to play */
#ganesh-presence{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#ganesh-presence .gp-art{position:absolute;left:50%;top:47%;width:min(150%,72dvh);aspect-ratio:9/16;
  transform:translate(-50%,-50%);
  background-image:var(--gp-art,none);background-size:cover;background-position:center 18%;
  opacity:.36;filter:saturate(1.08) brightness(.92);
  animation:gpBreathe 9s ease-in-out infinite}
@keyframes gpBreathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.32}50%{transform:translate(-50%,-50%) scale(1.035);opacity:.40}}
#ganesh-presence .gp-aura{position:absolute;left:50%;top:47%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(255,206,110,.62) 0%,rgba(255,178,74,.22) 34%,rgba(255,160,50,.06) 52%,transparent 68%);
  opacity:0}
.gp-pulse-s{animation:gpPulseS .95s ease-out}
.gp-pulse-m{animation:gpPulseM 1.25s ease-out}
.gp-pulse-l{animation:gpPulseL 1.6s ease-out}
@keyframes gpPulseS{0%{opacity:0;transform:translate(-50%,-50%) scale(.72)}28%{opacity:.38}100%{opacity:0;transform:translate(-50%,-50%) scale(1.12)}}
@keyframes gpPulseM{0%{opacity:0;transform:translate(-50%,-50%) scale(.66)}24%{opacity:.6}100%{opacity:0;transform:translate(-50%,-50%) scale(1.22)}}
@keyframes gpPulseL{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}20%{opacity:.92}55%{opacity:.5}100%{opacity:0;transform:translate(-50%,-50%) scale(1.34)}}
#ganesh-presence.gp-bless .gp-aura{animation:gpBless 3.2s ease-out}
@keyframes gpBless{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}18%{opacity:1}60%{opacity:.55}100%{opacity:0;transform:translate(-50%,-50%) scale(1.45)}}
.gp-petal{position:absolute;top:78%;width:14px;height:14px;border-radius:60% 40% 60% 40%;
  background:radial-gradient(circle at 35% 35%,#ffe9b0,#f0b64e 55%,#b3762a);
  box-shadow:0 0 10px rgba(255,205,110,.7);opacity:0;
  animation:petalRise 2.8s ease-in forwards}
@keyframes petalRise{0%{opacity:0;transform:translate(0,0) rotate(0deg) scale(.6)}12%{opacity:.95}100%{opacity:0;transform:translate(var(--px,0px),-72dvh) rotate(var(--pr,300deg)) scale(1)}}

/* v1.6 candy-crush juice */
.tile.landed .tile-inner{animation:tileLand .38s cubic-bezier(.3,1.55,.4,1)}
@keyframes tileLand{0%{transform:scale(1)}45%{transform:scale(1.12,.86)}75%{transform:scale(.96,1.05)}100%{transform:scale(1)}}
.tile.hint .tile-inner{animation:hintWiggle 1.05s ease-in-out infinite}
@keyframes hintWiggle{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-3px) rotate(-5deg)}55%{transform:translateX(3px) rotate(5deg)}80%{transform:translateX(-2px) rotate(-2deg)}}
.tile.swapping .tile-inner{animation:swapSquash .24s ease}
@keyframes swapSquash{40%{transform:scale(.9,1.1)}100%{transform:scale(1)}}
.tile.clearing .tile-inner{filter:brightness(1.7) saturate(1.3)}
.tile.deal-in .tile-inner{animation:dealIn .5s cubic-bezier(.25,1.4,.4,1) backwards}
@keyframes dealIn{0%{transform:translateY(-34px) scale(.4);opacity:0}100%{transform:translateY(0) scale(1);opacity:1}}
.tile.selected .tile-inner{animation:selPulse 1s ease-in-out infinite;filter:drop-shadow(0 0 10px rgba(240,201,135,.8))}
@keyframes selPulse{0%,100%{transform:scale(1.14)}50%{transform:scale(1.24)}}
.fx-combo{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);z-index:60;pointer-events:none;
  font-family:var(--font-d,serif);font-weight:700;font-size:2.4rem;white-space:nowrap;
  background:linear-gradient(180deg,#fff3d0,#f0b64e 60%,#c47f22);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 10px rgba(0,0,0,.65)) drop-shadow(0 0 22px rgba(255,196,92,.55));
  animation:comboPop 1.15s cubic-bezier(.2,1.5,.35,1) forwards}
@keyframes comboPop{0%{transform:translate(-50%,-50%) scale(.3);opacity:0}22%{transform:translate(-50%,-50%) scale(1.22);opacity:1}55%{transform:translate(-50%,-50%) scale(1)}100%{transform:translate(-50%,-56%) scale(1.06);opacity:0}}
.fx-scorepop{position:absolute;z-index:55;pointer-events:none;transform:translate(-50%,-50%);
  font-weight:700;font-size:.95rem;color:#ffe9b0;text-shadow:0 1px 4px rgba(0,0,0,.7),0 0 12px rgba(255,196,92,.6);
  animation:scoreRise .9s ease-out forwards}
@keyframes scoreRise{0%{opacity:0;transform:translate(-50%,-30%) scale(.7)}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-190%) scale(1.05)}}
.fx-shock{position:absolute;width:12.5%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  border:3px solid rgba(255,214,130,.9);box-shadow:0 0 18px rgba(255,196,92,.8),inset 0 0 14px rgba(255,196,92,.5);
  pointer-events:none;z-index:58;animation:shockOut .55s ease-out forwards}
@keyframes shockOut{0%{opacity:1;transform:translate(-50%,-50%) scale(.35)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.4)}}

/* v1.6 map: keep labels readable over the dotted path */
.node-label,.node-sub{paint-order:stroke;stroke:rgba(7,15,11,.88);stroke-width:3.5px;stroke-linejoin:round}

/* v1.6.2 map: current-level glow, gem stars, progress trail */
.lvl-dot.next .ld-core{fill:url(#nextGlow);stroke:#ffe9a8;stroke-width:2.2;animation:none}
.ld-halo{fill:none;stroke:rgba(255,214,120,.85);stroke-width:2;animation:haloK 1.7s ease-out infinite}
.ld-halo.h2{animation-delay:.85s}
@keyframes haloK{0%{opacity:.9;transform:scale(.7)}100%{opacity:0;transform:scale(2.1)}}
.lvl-dot.next .ld-n{fill:#4a2c06;font-size:110%}
.ld-stars .gem{fill:rgba(20,12,30,.55);stroke:rgba(255,255,255,.22);stroke-width:.08}
.ld-stars .gem.lit{fill:url(#starGem);stroke:#fff3c0;stroke-width:.06;filter:drop-shadow(0 0 2.5px rgba(255,205,90,.9))}
.map-path-done{stroke:url(#pathGrad);stroke-width:6.5;stroke-linecap:round;opacity:.95;
  filter:drop-shadow(0 0 7px rgba(255,205,110,.75))}
.map-hero{padding:14px 20px 2px}
.map-headline{font-size:1.55rem;margin-top:.3rem}
.kicker{letter-spacing:.24em;font-size:.6rem}

/* v1.6.3 map: subtle trail + dots blended into the landscape art */
.map-path{stroke-width:9;stroke-dasharray:none;opacity:.32;filter:none}
.map-path-done{stroke-width:7.5;opacity:.95;filter:drop-shadow(0 0 6px rgba(255,205,110,.75))}
.lvl-dot{opacity:.82}
.lvl-dot.locked{opacity:.38}
.lvl-dot.done{opacity:1}
.lvl-dot.next{opacity:1}
.ld-core{stroke-width:1}

/* v1.6.4 map: stepping-stone highlights + trail life */
.lvl-dot.done .ld-core{fill:url(#doneGlow);stroke:#f0d493;stroke-width:1.4}
.lvl-dot.done .ld-n{fill:#4a2c06}
.lvl-dot.done.s1 .ld-core{stroke:#cd8f52}
.lvl-dot.done.s2 .ld-core{stroke:#e8eef8}
.lvl-dot.done.s3 .ld-core{stroke:#ffd34d;stroke-width:2}
.lvl-dot.open .ld-core{fill:rgba(46,30,66,.72)}
.lvl-dot .bob{animation:bobK 1.15s ease-in-out infinite}
@keyframes bobK{0%,100%{transform:translateY(0)}50%{transform:translateY(-4.5px)}}
.map-path-pulse{stroke:#ffe9a8;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:5 95;
  opacity:.85;filter:drop-shadow(0 0 5px rgba(255,220,140,.9));
  animation:pulseTravel 7s linear infinite}
@keyframes pulseTravel{from{stroke-dashoffset:0}to{stroke-dashoffset:-100}}
.firefly{fill:#ffe3a0;filter:drop-shadow(0 0 4px rgba(255,215,130,.95));animation:flyK 9s ease-in-out infinite}
@keyframes flyK{0%,100%{opacity:.15;transform:translate(0,0)}25%{opacity:.9}50%{opacity:.35;transform:translate(9px,-13px)}75%{opacity:.85}90%{opacity:.2;transform:translate(-7px,6px)}}

/* ---------- level trail (candy-crush chain) ---------- */
#level-grid{display:block}
.level-trail{position:relative;width:100%;margin:0 auto;max-width:340px}
.lt-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lt-bed{fill:none;stroke:rgba(40,20,8,.55);stroke-width:10;stroke-linecap:round}
.lt-gold{fill:none;stroke-width:5;stroke-linecap:round;stroke-dasharray:1 14;
  stroke:#e8b95a;opacity:.95}
.level-btn.trail-node{position:absolute;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;
  background:radial-gradient(circle at 35% 28%, #4a2c14, #241206 70%);
  border:2px solid rgba(232,185,90,.55);box-shadow:0 4px 14px rgba(0,0,0,.5), inset 0 1px 2px rgba(255,230,160,.25);
  color:#f5e3b0;padding:0}
.level-btn.trail-node .lb-n{font-size:1.05rem;font-weight:700;line-height:1.05}
.level-btn.trail-node .lb-stars{font-size:.5rem;letter-spacing:.02em;color:#ffd98a;line-height:1}
.level-btn.trail-node.done{background:radial-gradient(circle at 35% 28%, #ffe9a8, #d9a441 55%, #8a5a12);
  border-color:#fff0c0;color:#3a2008;box-shadow:0 4px 16px rgba(217,164,65,.45), inset 0 1px 3px rgba(255,255,255,.5)}
.level-btn.trail-node.done .lb-stars{color:#7c4d0d}
.level-btn.trail-node.locked{opacity:.5;filter:saturate(.4)}
.level-btn.trail-node.next{border-color:#fff3d0;box-shadow:0 0 0 6px rgba(255,220,140,.18), 0 0 22px 6px rgba(255,205,100,.5), 0 4px 14px rgba(0,0,0,.5);
  animation:trailPulse 1.8s ease-in-out infinite}
@keyframes trailPulse{0%,100%{box-shadow:0 0 0 5px rgba(255,220,140,.14), 0 0 16px 4px rgba(255,205,100,.35), 0 4px 14px rgba(0,0,0,.5)}
  50%{box-shadow:0 0 0 9px rgba(255,220,140,.22), 0 0 30px 10px rgba(255,205,100,.6), 0 4px 14px rgba(0,0,0,.5)}}

/* ---------- sanctum frame (immersive surroundings around the murti) ---------- */
.sanctum-frame{position:absolute;inset:0;pointer-events:none;z-index:5}
.sf-toran{position:absolute;top:-2px;left:0;right:0;height:52px;
  background:
    radial-gradient(circle 7px at 14px 34px, #ffb02e 92%, transparent 95%),
    radial-gradient(circle 7px at 42px 40px, #ff8f1f 92%, transparent 95%),
    radial-gradient(circle 7px at 70px 34px, #ffb02e 92%, transparent 95%),
    repeating-linear-gradient(90deg, #2f7a33 0 20px, #256428 20px 40px);
  background-size:84px 46px, 84px 46px, 84px 46px, 100% 14px;
  background-repeat:repeat-x, repeat-x, repeat-x, repeat-x;
  background-position:0 0, 0 0, 0 0, 0 0;
  -webkit-mask:linear-gradient(#000 82%, transparent);
  mask:linear-gradient(#000 82%, transparent);
  opacity:.92;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.sf-diyas{position:absolute;left:0;right:0;bottom:0;height:30px;display:flex;justify-content:center;gap:34px;align-items:flex-end;padding-bottom:4px;
  background:linear-gradient(transparent, rgba(12,6,2,.5))}
.sf-diyas span{position:relative;width:16px;height:8px;border-radius:0 0 9px 9px;background:linear-gradient(#a86f16,#5c3a08)}
.sf-diyas span::before{content:'';position:absolute;left:50%;bottom:7px;transform:translateX(-50%);
  width:7px;height:11px;border-radius:50% 50% 50% 50%/62% 62% 38% 38%;
  background:radial-gradient(circle at 50% 78%, #fff3b0 0 22%, #ffb84d 45%, #e05a10 78%, transparent 82%);
  animation:sfFlick 1.15s ease-in-out infinite alternate;filter:drop-shadow(0 0 5px rgba(255,170,60,.8))}
.sf-diyas span:nth-child(2)::before{animation-delay:.28s}
.sf-diyas span:nth-child(3)::before{animation-delay:.6s}
.sf-diyas span:nth-child(4)::before{animation-delay:.15s}
.sf-diyas span:nth-child(5)::before{animation-delay:.45s}
@keyframes sfFlick{from{transform:translateX(-50%) scaleY(1) scaleX(1)}to{transform:translateX(-46%) scaleY(1.18) scaleX(.92)}}

/* ---------- item art ---------- */
.item-art{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.item-svgwrap{border-radius:50%;background:radial-gradient(circle at 36% 30%, #3a2413, #1d0f06 72%);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.item-svg{width:78%;height:78%;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
.chip-art{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden}
.chip-art img{width:100%;height:100%;object-fit:cover}
.thali-mini{position:absolute;width:22px;height:22px;transform:translate(-50%,-50%);border-radius:50%;overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.5);display:block}
.thali-mini img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.thali-mini .item-svgwrap{width:100%;height:100%}
.thali-mini .item-svg{width:78%;height:78%}

/* ---------- drop reveal flourish ---------- */
.drop-reveal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;
  background:rgba(8,4,2,.72);backdrop-filter:blur(6px);opacity:0;transition:opacity .35s ease}
.drop-reveal.on{opacity:1}
.drop-burst{position:absolute;left:50%;top:44%;width:130vmax;height:130vmax;transform:translate(-50%,-50%);
  background:conic-gradient(from 0deg, rgba(255,205,100,.16) 0 8deg, transparent 8deg 24deg, rgba(255,205,100,.16) 24deg 32deg, transparent 32deg 48deg, rgba(255,205,100,.16) 48deg 56deg, transparent 56deg 72deg, rgba(255,205,100,.16) 72deg 80deg, transparent 80deg 96deg, rgba(255,205,100,.16) 96deg 104deg, transparent 104deg 120deg, rgba(255,205,100,.16) 120deg 128deg, transparent 128deg 144deg, rgba(255,205,100,.16) 144deg 152deg, transparent 152deg 168deg, rgba(255,205,100,.16) 168deg 176deg, transparent 176deg 192deg, rgba(255,205,100,.16) 192deg 200deg, transparent 200deg 216deg, rgba(255,205,100,.16) 216deg 224deg, transparent 224deg 240deg, rgba(255,205,100,.16) 240deg 248deg, transparent 248deg 264deg, rgba(255,205,100,.16) 264deg 272deg, transparent 272deg 288deg, rgba(255,205,100,.16) 288deg 296deg, transparent 296deg 312deg, rgba(255,205,100,.16) 312deg 320deg, transparent 320deg 336deg, rgba(255,205,100,.16) 336deg 344deg, transparent 344deg 360deg);
  animation:dropSpin 26s linear infinite;pointer-events:none}
@keyframes dropSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.drop-card{position:relative;text-align:center;padding:1.6rem 1.8rem;max-width:300px;
  animation:dropPop .7s cubic-bezier(.2,1.4,.35,1) both .1s}
@keyframes dropPop{from{transform:scale(.4) rotate(-6deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}
.drop-kicker{margin:0 0 .7rem;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:#ffd98a}
.drop-med{width:118px;height:118px;margin:0 auto .9rem;border-radius:50%;overflow:hidden;
  border:3px solid rgba(255,220,140,.9);box-shadow:0 0 0 6px rgba(255,205,100,.2), 0 0 44px 10px rgba(255,190,80,.55), 0 8px 24px rgba(0,0,0,.6);
  animation:dropGlow 2.2s ease-in-out infinite}
@keyframes dropGlow{0%,100%{box-shadow:0 0 0 6px rgba(255,205,100,.18), 0 0 34px 8px rgba(255,190,80,.45), 0 8px 24px rgba(0,0,0,.6)}
  50%{box-shadow:0 0 0 9px rgba(255,205,100,.3), 0 0 60px 16px rgba(255,190,80,.75), 0 8px 24px rgba(0,0,0,.6)}}
.drop-name{margin:.1rem 0 .3rem;color:#fff3d0;font-size:1.5rem}
.drop-desc{margin:0 auto .7rem;color:rgba(247,240,228,.85);font-size:.86rem;line-height:1.45;max-width:240px}
.drop-bhakti{margin:0 0 1rem;color:#ffd98a;font-weight:700;letter-spacing:.04em}

/* ---------- bhandar (collection) ---------- */
.bhandar-scroll{flex:1;overflow-y:auto;padding:14px 16px 34px;display:flex;flex-direction:column;gap:14px}
.bhakti-hero{display:flex;align-items:center;gap:16px;padding:14px 18px;border-radius:var(--radius);
  background:linear-gradient(120deg, rgba(58,36,19,.9), rgba(29,15,6,.94));border:1px solid rgba(232,185,90,.4)}
.bhakti-flame{width:40px;height:52px;flex:none;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
  background:radial-gradient(circle at 50% 78%, #fff3b0 0 20%, #ffb84d 46%, #e05a10 76%, transparent 84%);
  animation:sfFlick 1.2s ease-in-out infinite alternate;filter:drop-shadow(0 0 12px rgba(255,170,60,.85))}
.bhakti-count{margin:0;font-size:2.1rem;font-weight:800;color:#ffe9a8;line-height:1;
  text-shadow:0 0 18px rgba(255,190,80,.5)}
.bhakti-label{margin:.15rem 0 0;font-size:.8rem;letter-spacing:.28em;color:rgba(247,240,228,.75)}
.bhandar-note{margin:0;text-align:center;font-size:.82rem;color:rgba(247,240,228,.7)}
.bhandar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.bhandar-cell{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px 8px;
  border-radius:14px;border:1px solid rgba(232,185,90,.28);background:rgba(29,15,6,.6);cursor:pointer}
.bhandar-cell .bc-med{width:56px;height:56px;border-radius:50%;overflow:hidden;
  border:2px solid rgba(232,185,90,.65);box-shadow:0 2px 8px rgba(0,0,0,.5)}
.bhandar-cell .bc-name{font-size:.62rem;color:#f0e2c0;text-align:center;line-height:1.2}
.bhandar-cell .bc-count{position:absolute;top:4px;right:6px;font-size:.62rem;font-weight:700;color:#ffd98a}
.bhandar-cell.locked-i{opacity:.55;cursor:default;filter:saturate(.3)}
.bhandar-cell.locked-i .bc-sil{display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 36% 30%, #3a2413, #1d0f06 72%);color:rgba(232,185,90,.5);font-size:1.2rem;font-weight:700}
.item-detail{position:fixed;inset:0;z-index:110;display:none;align-items:center;justify-content:center;
  background:rgba(8,4,2,.7);backdrop-filter:blur(5px)}
.item-detail.on{display:flex}
.item-detail-card{max-width:300px;text-align:center;padding:1.5rem 1.6rem;border-radius:var(--radius);
  background:linear-gradient(150deg, rgba(58,36,19,.97), rgba(20,10,4,.98));border:1px solid rgba(232,185,90,.45)}
.item-detail-card .id-med{width:110px;height:110px;margin:0 auto .8rem;border-radius:50%;overflow:hidden;
  border:3px solid rgba(255,220,140,.85);box-shadow:0 0 30px 6px rgba(255,190,80,.4), 0 8px 22px rgba(0,0,0,.55)}
.item-detail-card h3{margin:.1rem 0 .4rem;color:#fff3d0}
.item-detail-card .id-desc{margin:0 0 .7rem;font-size:.86rem;color:rgba(247,240,228,.85);line-height:1.45}
.item-detail-card .id-meta{margin:0 0 1rem;font-size:.72rem;color:#ffd98a;letter-spacing:.05em}

/* ===== v2.1 puja golden stepper (reference-UI rework) ===== */
.puja-stepper{position:absolute;top:calc(env(safe-area-inset-top,0px) + 10px);left:0;right:0;z-index:6;
  display:flex;align-items:flex-start;justify-content:center;padding:4px 8px;pointer-events:none}
.ps-step{display:flex;flex-direction:column;align-items:center;gap:4px;flex:0 0 auto}
.ps-dot{width:27px;height:27px;border-radius:50%;border:1.5px solid rgba(255,199,102,.5);
  background:rgba(24,14,6,.6);backdrop-filter:blur(4px);position:relative;transition:all .45s ease}
.ps-step b{font-size:8.5px;font-weight:600;letter-spacing:.03em;color:rgba(255,224,168,.6);
  font-family:'Cormorant Garamond',Georgia,serif;white-space:nowrap}
.ps-link{flex:0 1 14px;height:1.5px;background:linear-gradient(90deg,rgba(255,199,102,.45),rgba(255,199,102,.2));margin-top:13px}
.ps-step.done .ps-dot{background:linear-gradient(160deg,#ffdf8e,#d4a017);border-color:#ffe9b0;box-shadow:0 0 10px rgba(255,205,92,.55)}
.ps-step.done .ps-dot::after{content:'\2713';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:#4a2c05}
.ps-step.done b{color:#ffdf9e}
.ps-step.cur .ps-dot{border-color:#ffe9b0;box-shadow:0 0 0 3px rgba(255,205,92,.22),0 0 16px rgba(255,205,92,.75);
  background:radial-gradient(circle at 50% 42%,#fff3cf,#e9b93d 70%);animation:psPulse 1.6s ease-in-out infinite}
.ps-step.cur b{color:#ffe9b0;text-shadow:0 0 8px rgba(255,205,92,.6)}
@keyframes psPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@media (max-width:380px){.ps-dot{width:23px;height:23px}.ps-step b{font-size:7.5px}.ps-link{flex-basis:9px}}

/* v2.1 darshan name plate (ref 4) */
.puja-nameplate{position:absolute;left:50%;transform:translateX(-50%);bottom:14px;z-index:5;text-align:center;pointer-events:none;
  padding:8px 22px;border-radius:14px;background:linear-gradient(180deg,rgba(20,12,5,.28),rgba(20,12,5,.55));
  border:1px solid rgba(255,199,102,.28);backdrop-filter:blur(3px)}
.puja-nameplate .hero-name{position:static;margin:0;font-size:1.35rem;color:#ffe9b0;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.puja-place{margin:1px 0 0;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,224,168,.75)}
.puja-mantra-line{margin:3px 0 0;font-size:.72rem;font-style:italic;color:rgba(255,224,168,.6)}

/* ===== v2.1 fixes: nameplate pill reset, stepper clearance, golden bowls, warm tray ===== */
.puja-nameplate{bottom:18px;padding:9px 24px;border-radius:16px;
  background:linear-gradient(180deg,rgba(26,15,6,.42),rgba(14,8,3,.66));border:1px solid rgba(255,199,102,.4);
  box-shadow:0 6px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,223,150,.25)}
.puja-nameplate .hero-name{position:static;inset:auto;transform:none;margin:0;padding:0;width:auto;height:auto;
  background:none;border:none;border-radius:0;backdrop-filter:none;box-shadow:none;
  font-size:1.4rem;color:#ffe9b0;text-shadow:0 2px 10px rgba(0,0,0,.65)}
.puja-stepper{left:2px;right:62px}
.puja-tray{background:linear-gradient(165deg,rgba(48,29,11,.66),rgba(20,11,5,.78));
  border:1px solid rgba(255,199,102,.38);box-shadow:0 10px 30px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,223,150,.18)}
.puja-tray .puja-instruction{color:#ffe1a6;font-family:'Cormorant Garamond',Georgia,serif;font-size:1.06rem;font-weight:600;letter-spacing:.02em}
.puja-chips{gap:14px;align-items:flex-start;padding-bottom:16px}
.chip-btn{position:relative;width:56px;height:56px;padding:3px;flex:none;
  background:radial-gradient(circle at 50% 32%,#6b4a16,#2e1c07 78%);
  border:2px solid rgba(255,205,92,.85);box-shadow:0 4px 14px rgba(0,0,0,.5),inset 0 2px 5px rgba(255,225,150,.35),inset 0 -3px 6px rgba(0,0,0,.5)}
.chip-btn .bowl-label{position:absolute;left:50%;transform:translateX(-50%);bottom:-17px;
  font:600 9px/1 'Cormorant Garamond',Georgia,serif;letter-spacing:.03em;color:#ffdf9e;white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.7)}
.chip-btn.offered{opacity:.3;transform:scale(.82)}
.chip-btn.offered .bowl-label{opacity:.6}
@media (max-height:640px){.chip-btn{width:46px;height:46px}.chip-btn .bowl-label{bottom:-15px;font-size:8px}}

/* v2.1 polish round 2 */
.puja-nameplate{top:60px;bottom:auto;padding:7px 20px}
.puja-nameplate .hero-name{white-space:nowrap;font-size:1.3rem}
.puja-chips{flex-wrap:nowrap;overflow-x:auto;gap:12px;padding-bottom:16px;scrollbar-width:none}
.puja-chips::-webkit-scrollbar{display:none}
.chip-btn{width:52px;height:52px}

/* ---------- v2.1 phase C: rich map topbar (ref 01 bar) ---------- */
.topbar-rich{flex-direction:column;align-items:stretch;gap:.45rem;margin:10px 12px 4px;padding:.55rem .65rem;border-radius:18px;
  background:linear-gradient(160deg,rgba(32,18,8,.82),rgba(17,9,4,.88));
  border:1px solid rgba(240,207,142,.34);box-shadow:0 10px 28px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,236,190,.12);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.tb-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.tb-row2{justify-content:flex-start;gap:.5rem}
.icon-btn.gold{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;padding:0;
  background:linear-gradient(160deg,rgba(240,207,142,.2),rgba(120,72,24,.28));
  border:1px solid rgba(240,207,142,.5);box-shadow:0 3px 10px rgba(0,0,0,.4),inset 0 1px 2px rgba(255,236,190,.25);
  color:#ffe9b8;cursor:pointer}
.icon-btn.gold:active{transform:scale(.93)}
.icon-btn.gold img{width:22px;height:22px;border-radius:50%;object-fit:cover}
.icon-btn.gold{font-size:1.05rem}
.tb-profile{display:flex;align-items:center;gap:.55rem;min-width:0}
.tb-avatar{width:44px;height:44px;border-radius:50%;overflow:hidden;flex:none;
  border:2px solid rgba(240,207,142,.9);box-shadow:0 0 0 3px rgba(240,207,142,.15),0 4px 12px rgba(0,0,0,.5)}
.tb-avatar img{width:100%;height:100%;object-fit:cover}
.tb-id{display:flex;flex-direction:column;gap:4px}
.tb-name{font-size:.8rem;font-weight:600;color:#f4e6c4;white-space:nowrap;letter-spacing:.02em}
.tb-name b{color:var(--accent2)}
.tb-prog{display:block;width:104px;height:6px;border-radius:4px;background:rgba(240,207,142,.16);overflow:hidden;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.5)}
.tb-prog i{display:block;height:100%;width:0%;border-radius:4px;
  background:linear-gradient(90deg,#d99b4a,#f5d894);box-shadow:0 0 8px rgba(245,216,148,.7);
  transition:width .6s ease}
.tb-pill{display:flex;align-items:center;gap:.3rem;padding:.22rem .55rem .22rem .24rem;border-radius:999px;
  background:linear-gradient(160deg,rgba(46,26,10,.85),rgba(24,12,5,.9));
  border:1px solid rgba(240,207,142,.45);box-shadow:0 3px 10px rgba(0,0,0,.4),inset 0 1px 2px rgba(255,230,170,.14)}
.tb-pill img{width:22px;height:22px;border-radius:50%;object-fit:cover}
.tb-pill b{font-size:.82rem;color:#ffe9b8;font-weight:700}

/* ---------- v2.1 phase C: warm chapter backdrop ---------- */
#screen-chapter::before{content:'';position:absolute;inset:0;z-index:0;
  background-image:var(--map-art,none);background-size:cover;background-position:center 20%;background-repeat:no-repeat}
#screen-chapter::after{content:'';position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(30,16,7,.86) 0%,rgba(44,24,10,.8) 34%,rgba(26,13,6,.9) 70%,rgba(16,8,3,.95) 100%)}
#screen-chapter>*{position:relative;z-index:1}

/* ---------- v2.1 phase C: golden medallion trail nodes ---------- */
.level-btn.trail-node{width:62px;height:62px;
  background:radial-gradient(circle at 34% 26%, #6b4423, #33200e 62%, #201106);
  border:2.5px solid rgba(232,185,90,.75);
  box-shadow:0 5px 16px rgba(0,0,0,.6), 0 0 0 4px rgba(232,185,90,.12), inset 0 2px 4px rgba(255,230,160,.3), inset 0 -3px 6px rgba(0,0,0,.45)}
.level-btn.trail-node .lb-n{font-family:var(--font-d);font-size:1.2rem;color:#ffe6b0;text-shadow:0 2px 4px rgba(0,0,0,.6)}
.level-btn.trail-node.locked{opacity:.62;filter:saturate(.55) brightness(.85)}
.level-btn.trail-node.locked .lb-n{color:rgba(255,230,176,.5)}
.lb-lock{position:relative;display:block;width:12px;height:9px;border-radius:2.5px;margin-top:3px;
  background:linear-gradient(180deg,#d9b06a,#8a6a34);box-shadow:0 1px 3px rgba(0,0,0,.5)}
.lb-lock::before{content:'';position:absolute;left:50%;top:-7px;transform:translateX(-50%);
  width:6px;height:7px;border:2.2px solid #d9b06a;border-bottom:none;border-radius:6px 6px 0 0}
.level-btn.trail-node.done{background:radial-gradient(circle at 34% 26%, #fff3c4, #ecc16a 48%, #b57a1e 78%, #7c4d0d);
  border-color:#fff0c0;color:#3a2008;
  box-shadow:0 5px 18px rgba(217,164,65,.5), 0 0 14px rgba(255,220,140,.45), inset 0 2px 4px rgba(255,255,255,.55)}
.level-btn.trail-node.next{background:radial-gradient(circle at 34% 26%, #fff6d8, #f0cf8e 42%, #d99b4a 72%, #9a6216);
  border-color:#fff6dc;color:#3a2008}
.level-btn.trail-node.next .lb-n{color:#4a2a08;text-shadow:0 1px 2px rgba(255,244,214,.6)}
.lt-bed{stroke:rgba(24,12,4,.7);stroke-width:11}
.lt-gold{stroke:#f0c268;filter:drop-shadow(0 0 5px rgba(240,194,104,.55))}

/* v2.1.1 deploy marker: asset-path fix */

/* Phase E - blessing and pilgrim profile. Murti remains the hero. */
#temple-ui:has(.blessing-scene){padding:0;overflow:hidden}
.blessing-scene{position:relative;isolation:isolate;width:100%;height:100%;min-height:0;overflow:hidden;
  display:flex;align-items:center;justify-content:flex-end;flex-direction:column;
  background:linear-gradient(180deg,rgba(22,13,4,.10),rgba(18,9,2,.12) 43%,rgba(16,8,2,.76) 76%,rgba(13,7,2,.95))}
.blessing-halo{position:absolute;z-index:-1;top:5%;left:50%;width:min(100vw,480px);aspect-ratio:1;
  transform:translateX(-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,223,141,.28) 4%,rgba(241,171,59,.22) 30%,transparent 67%);
  filter:blur(8px);animation:blessingLight 6s ease-in-out infinite alternate}
@keyframes blessingLight{to{opacity:.58;transform:translateX(-50%) scale(1.12)}}
.blessing-scene .blessing-murti{position:absolute;z-index:0;top:4%;left:50%;transform:translateX(-50%);
  width:min(78%,380px);height:min(62%,530px);object-fit:contain;object-position:center top;
  border:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 16px 36px rgba(0,0,0,.55));
  animation:blessingPresence 7s ease-in-out infinite alternate}
@keyframes blessingPresence{from{transform:translateX(-50%) scale(.97)}to{transform:translateX(-50%) translateY(-7px) scale(1.015)}}
.blessing-scene .blessing-card{z-index:1;width:min(calc(100% - 28px),440px);margin:0 14px calc(env(safe-area-inset-bottom,0px) + 16px);
  padding:15px 18px 18px;border:1px solid rgba(248,207,129,.58);border-radius:22px;
  background:linear-gradient(155deg,rgba(52,31,13,.94),rgba(25,14,6,.97));
  box-shadow:0 14px 45px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,230,165,.25)}
.blessing-scene .blessing-om{font-size:2rem;line-height:1}
.blessing-scene .mantra{font-size:1.1rem;margin:4px 0;color:#f8d99b}
.blessing-scene .blessing-text{font-family:var(--font-d);font-size:1.13rem;color:#fff0ca}
.blessing-scene .blessing-temple{margin:4px 0 10px;color:#e9cda2}
.blessing-scene .modal-actions{margin-top:8px}
.pilgrim-card{position:relative;overflow:hidden;display:flex;gap:15px;align-items:center;padding:16px;
  border-radius:20px;border:1px solid rgba(241,203,121,.62);
  background:linear-gradient(110deg,rgba(87,48,19,.95),rgba(37,21,9,.96));
  box-shadow:0 8px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,236,174,.23)}
.pilgrim-card::after{content:'✦';position:absolute;right:12px;top:1px;font-size:3.8rem;color:rgba(255,221,148,.07)}
.pilgrim-icon{flex:none;width:72px;height:72px;border-radius:50%;overflow:hidden;
  border:3px solid #f4cf85;box-shadow:0 0 0 4px rgba(232,185,90,.14),0 0 24px rgba(255,199,94,.28)}
.pilgrim-icon img{width:100%;height:100%;object-fit:cover}
.pilgrim-details{min-width:0;flex:1}.pilgrim-eyebrow{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:#f2d497}
.pilgrim-details h3{font-family:var(--font-d);font-size:1.35rem;color:#fff0d0;line-height:1.25}
.pilgrim-progress{height:6px;margin-top:8px;border-radius:5px;background:rgba(255,230,180,.15);overflow:hidden}
.pilgrim-progress i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#df9741,#ffe6a6);box-shadow:0 0 9px #ecc774}
.pilgrim-next{font-size:.72rem;color:#e4cda6;margin-top:5px}
.pilgrim-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.pilgrim-stats div{border:1px solid rgba(232,185,90,.34);border-radius:13px;padding:9px 5px;
  background:linear-gradient(145deg,rgba(63,36,15,.85),rgba(28,15,6,.9));text-align:center;min-width:0}
.pilgrim-stats strong{display:block;font-family:var(--font-d);color:#ffe1a0;font-size:1.1rem;line-height:1.2}
.pilgrim-stats span{display:block;font-size:.65rem;color:#dfcaab;line-height:1.1;margin-top:4px}
@media(max-height:670px){.blessing-scene .blessing-murti{height:55%}.blessing-scene .blessing-card{padding:9px 13px;margin-bottom:8px}.blessing-scene .blessing-om{font-size:1.5rem}}
@media(prefers-reduced-motion:reduce){.blessing-halo,.blessing-scene .blessing-murti{animation:none}}
/* Keep the profile and collection cards at their intrinsic height inside the scroll pane. */
.bhandar-scroll>.bhakti-hero,.bhandar-scroll>.pilgrim-card,.bhandar-scroll>.pilgrim-stats,.bhandar-scroll>.bhandar-note,.bhandar-scroll>.bhandar-grid{flex:none}