:root {
      --bg-gradient: radial-gradient(circle at 50% 20%, #991515 0%, #3d0505 100%);
      --card-bg: rgba(26, 3, 3, 0.84);
      --card-border: #ffd700;
      --accent-gold: #ffe600;
      --accent-deep-gold: #f59e0b;
      --theme-text: #fff9e6;

      /* 🕉️ Divine Sanatani Color Tokens */
      --sanatani-gold-light: #fff7b2;
      --sanatani-gold-mid: #ffd700;
      --sanatani-gold-dark: #b45309;
      --sanatani-kesariya: #f97316;
      --sanatani-vermilion: #b91c1c;
      --sanatani-maroon: #2c0404;
      --sanatani-sandalwood: #fef08a;

      /* 🪔 High-Legibility Clean Font Stacks */
      --font-body: 'Poppins', 'Mukta', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
      --font-divine-title: 'Rozha One', 'Yatra One', serif;
      --font-royal-eng: 'Cinzel', 'Marcellus', serif;
      --font-clean-hindi: 'Mukta', 'Poppins', sans-serif;
    }

    body.theme-indigo {
      --bg-gradient: radial-gradient(circle at 50% 20%, #1e1b4b 0%, #030712 100%);
      --card-bg: rgba(10, 12, 36, 0.88);
      --card-border: #38bdf8;
      --accent-gold: #7dd3fc;
      --accent-deep-gold: #0284c7;
      --theme-text: #f0f9ff;
    }

    body.theme-dawn {
      --bg-gradient: radial-gradient(circle at 50% 20%, #c2410c 0%, #451a03 100%);
      --card-bg: rgba(41, 14, 5, 0.88);
      --card-border: #fde047;
      --accent-gold: #fef08a;
      --accent-deep-gold: #f59e0b;
      --theme-text: #fffbeb;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      background: var(--bg-gradient);
      font-family: var(--font-body);
      text-align: center;
      min-height: 100vh;
      overflow-x: hidden;
      color: #fff;
      position: relative;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-rendering: optimizeLegibility;
      line-height: 1.5;
      -webkit-overflow-scrolling: touch;
      touch-action: pan-y;
    }

    /* 🕉️ Universal Neutralization of Harsh Neon into Radiant Sanatani Gold Aura */
    .font-effect-neon {
      font-family: inherit !important;
      color: #fff9e6 !important;
      text-shadow: 0 0 10px rgba(255, 215, 0, 0.65), 0 2px 5px rgba(0, 0, 0, 0.9) !important;
    }

    /* Universal GPU-Accelerated Falling Snowflakes & Petals */
    .snowflake {
      color: #fff;
      font-size: 1.5em;
      position: fixed;
      top: -30px;
      z-index: 50;
      user-select: none;
      pointer-events: none;
      cursor: default;
      will-change: transform;
      animation: snowflakes-gpu 9s linear infinite;
    }

    @keyframes snowflakes-gpu {
      0% {
        transform: translate3d(0, -20px, 0) rotate(0deg);
      }
      50% {
        transform: translate3d(40px, 50vh, 0) rotate(180deg);
      }
      100% {
        transform: translate3d(0, 110vh, 0) rotate(360deg);
      }
    }

    .snowflake:nth-of-type(1) { left: 4%; animation-delay: 0s; }
    .snowflake:nth-of-type(2) { left: 14%; animation-delay: 2s; }
    .snowflake:nth-of-type(3) { left: 26%; animation-delay: 4s; }
    .snowflake:nth-of-type(4) { left: 38%; animation-delay: 1s; }
    .snowflake:nth-of-type(5) { left: 52%; animation-delay: 6s; }
    .snowflake:nth-of-type(6) { left: 66%; animation-delay: 3s; }
    .snowflake:nth-of-type(7) { left: 78%; animation-delay: 5s; }
    .snowflake:nth-of-type(8) { left: 88%; animation-delay: 2.5s; }
    .snowflake:nth-of-type(9) { left: 96%; animation-delay: 7s; }

    /* Original Pyro Fireworks Animation */
    .pyro {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      pointer-events: none;
      z-index: 45;
    }

    .pyro > .before, .pyro > .after {
      position: absolute;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      box-shadow: 0 0 #fff;
      animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
    }

    .pyro > .after {
      animation-delay: 1.25s, 1.25s, 1.25s;
      animation-duration: 1.25s, 1.25s, 6.25s;
    }

    @keyframes bang {
      to {
        box-shadow: 120px -188px #00fff2, 21px -379px #002fff, 234px -267px #6600ff,
          190px -349px #95ff00, -243px -224px #00d5ff, -219px -51px #00ffcc,
          29px -18px #ff1a00, 38px -231px #ff00c4, 231px -241px #9500ff,
          36px 5px #00ff8c, -43px 41px #0d00ff, -70px -49px #ff0037,
          -186px -364px #3c00ff, 4px -66px #0048ff, -151px -139px #a200ff,
          212px -338px #6600ff, 114px -71px #00ff73, 189px -334px #ff0004,
          19px -313px #00ff09, -237px -254px #ff0037, -188px -96px #001aff,
          91px -12px #00d5ff, 238px -230px #9dff00, -7px -280px #ffaa00,
          182px -378px #009dff, 135px -90px #00ff26, -214px -56px #4400ff,
          -207px -316px #1100ff, 91px 26px #e600ff, 52px -87px #00ff9d,
          -21px -289px #04ff00, -99px -25px #ff0033, -124px -399px #ff004d,
          96px -220px #bbff00, 250px -71px #b300ff, -53px -147px #ff0040,
          -216px -51px #ff2f00, 19px 70px #80ff00, -14px 5px #95ff00,
          107px -107px #0062ff, 115px -241px #00ff8c, 210px 60px #00ff33,
          86px -268px #40ff00, -18px -18px #6a00ff, -31px 28px #00c8ff,
          -194px -100px #0015ff, 8px -10px #005eff, 164px 65px #ff001a,
          -157px 10px #a2ff00, -12px -400px #0048ff, -124px -181px #00ffa2;
      }
    }

    @keyframes gravity {
      to {
        transform: translateY(200px);
        opacity: 0;
      }
    }

    @keyframes position {
      0%, 19.9% { margin-top: 10%; margin-left: 40%; }
      20%, 39.9% { margin-top: 40%; margin-left: 30%; }
      40%, 59.9% { margin-top: 20%; margin-left: 70%; }
      60%, 79.9% { margin-top: 30%; margin-left: 20%; }
      80%, 99.9% { margin-top: 30%; margin-left: 80%; }
    }

    /* Fullscreen Pushpa Varsha Canvas */
    #flowerCanvas {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      pointer-events: none;
      z-index: 9990;
    }

    /* Top Festive HUD Bar */
    .top-hud-bar {
      position: sticky;
      top: 0;
      left: 0;
      width: 100%;
      background: rgba(10, 1, 1, 0.9);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-bottom: 1px solid var(--card-border);
      padding: 8px 14px;
      z-index: 10005;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.6);
    }

    .top-hud-inner {
      max-width: 1120px;
      width: 100%;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
    }

    .music-hud-btn {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 5px 10px;
      border-radius: 20px;
      background: rgba(0, 0, 0, 0.6);
      border: 1px solid var(--card-border);
      cursor: pointer;
      font-size: 11.5px;
      color: var(--accent-gold);
      font-weight: bold;
      transition: transform 0.2s;
    }

    .music-hud-btn:active {
      transform: scale(0.95);
    }

    .eq-bars {
      display: flex;
      align-items: flex-end;
      gap: 2.5px;
      height: 14px;
    }

    .eq-bar {
      width: 3.5px;
      background: var(--accent-gold);
      border-radius: 2px;
      transition: height 0.2s;
    }

    .playing .eq-bar:nth-child(1) { animation: eqAnim 0.7s infinite alternate ease-in-out; }
    .playing .eq-bar:nth-child(2) { animation: eqAnim 0.9s infinite alternate ease-in-out 0.2s; }
    .playing .eq-bar:nth-child(3) { animation: eqAnim 0.6s infinite alternate ease-in-out 0.4s; }

    @keyframes eqAnim {
      0% { height: 3px; }
      100% { height: 14px; }
    }

    .paused .eq-bar {
      height: 3px;
      background: #888;
    }

    .tithi-badge {
      font-size: 11.5px;
      color: var(--accent-gold);
      font-weight: 700;
      background: rgba(255, 215, 0, 0.12);
      border: 1px dashed var(--card-border);
      border-radius: 14px;
      padding: 4px 10px;
      letter-spacing: 0.5px;
      text-shadow: 0 0 6px rgba(255, 215, 0, 0.4);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 200px;
    }

    .theme-switcher {
      display: flex;
      gap: 5px;
    }

    .theme-dot {
      width: 22px;
      height: 22px;
      border-radius: 50%;
      cursor: pointer;
      border: 2px solid #ffffff;
      box-shadow: 0 2px 5px rgba(0,0,0,0.5);
      transition: transform 0.2s;
    }

    .theme-dot:active {
      transform: scale(0.9);
    }

    .dot-crimson { background: #991515; }
    .dot-indigo { background: #1e1b4b; }
    .dot-dawn { background: #ea580c; }

    /* Original Curtain Split Overlay & Gift Box */
    .curtain-wrapper {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      height: 100dvh;
      z-index: 99999999 !important;
      cursor: pointer;
      perspective: 1400px;
      perspective-origin: center center;
      background: radial-gradient(circle at 50% 50%, #200402 0%, #0c0101 100%);
      overflow: hidden;
      transition: visibility 1.4s ease, opacity 1.4s ease;
    }

    .curtain-wrapper.open {
      pointer-events: none;
      visibility: hidden;
      opacity: 0;
    }

    /* Fullscreen Flower Shower Canvas */
    #flowerCanvas {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      pointer-events: none;
      z-index: 10005;
      display: block;
    }

    /* Top Toran & Shlok Arch */
    .mandir-door-toran {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 10015;
      background: linear-gradient(180deg, rgba(60, 5, 5, 0.96) 0%, rgba(30, 2, 2, 0.88) 100%);
      border-bottom: 3px solid #ffd700;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.9);
      padding: 8px 12px 10px;
      text-align: center;
      transition: transform 1s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.8s ease;
    }

    .curtain-wrapper.open .mandir-door-toran {
      transform: translateY(-100%);
      opacity: 0;
    }

    .door-toran-garland {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 12px;
      font-size: 19px;
      filter: drop-shadow(0 2px 4px rgba(0,0,0,0.8));
      margin-bottom: 4px;
      flex-wrap: wrap;
    }

    .door-crest-shlok {
      font-family: var(--font-royal-eng);
      font-size: clamp(14px, 2.5vw, 19px);
      font-weight: 800;
      letter-spacing: 2px;
      color: #ffd700;
      text-shadow: 0 2px 8px rgba(0,0,0,0.9), 0 0 14px rgba(255, 215, 0, 0.7);
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }

    /* Mandir Gates Viewport */
    .mandir-gates-container {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      display: flex;
      perspective: 1400px;
      transform-style: preserve-3d;
    }

    /* Door Leaves (Left & Right Kapat) */
    .mandir-door-leaf {
      width: 50%;
      height: 100%;
      position: absolute;
      top: 0;
      background: 
        repeating-linear-gradient(90deg, 
          rgba(0,0,0,0.18) 0px, 
          rgba(255,215,0,0.06) 4px, 
          rgba(0,0,0,0.25) 8px, 
          rgba(0,0,0,0.4) 16px),
        radial-gradient(ellipse at 50% 50%, #4a0d07 0%, #2b0604 55%, #130202 100%);
      box-shadow: 0 0 40px rgba(0, 0, 0, 0.95);
      transition: transform 1.4s cubic-bezier(0.65, 0.05, 0.36, 1);
      z-index: 10011;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: space-evenly;
      align-items: center;
      padding: 60px 14px 40px;
      border: 5px solid #200402;
    }

    .door-left {
      left: 0;
      transform-origin: left center;
      border-right: 4px solid #ffd700;
      box-shadow: inset -5px 0 25px rgba(0,0,0,0.9), 10px 0 30px rgba(0,0,0,0.8);
    }

    .door-right {
      right: 0;
      transform-origin: right center;
      border-left: 4px solid #ffd700;
      box-shadow: inset 5px 0 25px rgba(0,0,0,0.9), -10px 0 30px rgba(0,0,0,0.8);
    }

    /* 3D Realistic Door Swing Open */
    .curtain-wrapper.open .door-left {
      transform: rotateY(-88deg);
    }

    .curtain-wrapper.open .door-right {
      transform: rotateY(88deg);
    }

    /* Carved Wooden Door Panels */
    .door-carved-panel {
      width: 84%;
      max-width: 270px;
      background: radial-gradient(ellipse at 50% 40%, #581008 0%, #2e0704 80%, #150202 100%);
      border: 2px solid rgba(255, 215, 0, 0.6);
      border-radius: 12px;
      padding: 12px 10px;
      box-shadow: 
        inset 2px 2px 6px rgba(255, 215, 0, 0.3),
        inset -3px -3px 8px rgba(0, 0, 0, 0.9),
        0 6px 16px rgba(0, 0, 0, 0.7);
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      position: relative;
    }

    .door-sacred-om {
      font-size: clamp(30px, 5vw, 42px);
      filter: drop-shadow(0 2px 8px rgba(255, 215, 0, 0.8)) drop-shadow(0 0 15px #f59e0b);
      color: #ffd700;
      user-select: none;
    }

    .door-panel-label {
      font-family: var(--font-royal-eng);
      font-size: clamp(15px, 2.3vw, 19px);
      font-weight: 800;
      color: #ffe066;
      letter-spacing: 2px;
      text-shadow: 0 2px 6px rgba(0,0,0,0.9);
      margin-top: 3px;
    }

    .door-emblem-gold {
      font-size: clamp(34px, 5.5vw, 48px);
      color: #ffd700;
      filter: drop-shadow(0 0 14px rgba(255, 170, 0, 0.9));
      margin: 6px 0;
      user-select: none;
    }

    .door-lotus-carving {
      font-size: clamp(26px, 3.8vw, 34px);
      filter: drop-shadow(0 0 8px rgba(255, 105, 180, 0.7));
      user-select: none;
    }

    /* Brass Studs / Rivets */
    .brass-studs-row {
      display: flex;
      gap: 14px;
      justify-content: center;
    }

    .brass-stud {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: radial-gradient(circle at 35% 35%, #ffffff 0%, #ffd700 45%, #b45309 85%, #451a03 100%);
      box-shadow: 0 2px 6px rgba(0,0,0,0.8), 0 0 4px rgba(255, 215, 0, 0.6);
      display: inline-block;
    }

    /* Akhand Diya on Lower Door Corner Posts */
    .door-akhand-diya {
      position: absolute;
      bottom: 20px;
      display: flex;
      flex-direction: column;
      align-items: center;
      z-index: 10014;
    }

    .diya-left-post {
      left: 18px;
    }

    .diya-right-post {
      right: 18px;
    }

    .akhand-flame-halo {
      position: absolute;
      top: -12px;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255, 200, 0, 0.6) 0%, rgba(255, 100, 0, 0.25) 50%, transparent 80%);
      animation: flameHaloFlicker 1.8s infinite alternate ease-in-out;
      pointer-events: none;
    }

    .akhand-brass-base {
      font-size: clamp(32px, 5vw, 42px);
      filter: drop-shadow(0 4px 10px rgba(0,0,0,0.9));
      user-select: none;
    }

    @keyframes flameHaloFlicker {
      0% { transform: scale(0.9); opacity: 0.7; }
      50% { transform: scale(1.15); opacity: 1; filter: blur(1px); }
      100% { transform: scale(0.95); opacity: 0.8; }
    }

    /* Central Sacred Handle & Hanging Bell */
    .sacred-door-handle-center {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 10020;
      display: flex;
      flex-direction: column;
      align-items: center;
      cursor: pointer;
      user-select: none;
      transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.65, 0.05, 0.36, 1);
    }

    .curtain-wrapper.open .sacred-door-handle-center {
      opacity: 0;
      transform: translate(-50%, -50%) scale(0.6);
      pointer-events: none;
    }

    /* Glowing Ripple Waves around Bell */
    .handle-pulsing-aura {
      position: absolute;
      top: 25px;
      width: 140px;
      height: 140px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255, 215, 0, 0.4) 0%, rgba(255, 140, 0, 0.15) 55%, transparent 75%);
      animation: handleAuraPulse 2.2s infinite ease-out;
      pointer-events: none;
    }

    @keyframes handleAuraPulse {
      0% { transform: scale(0.7); opacity: 0.9; }
      50% { transform: scale(1.3); opacity: 0.4; }
      100% { transform: scale(1.7); opacity: 0; }
    }

    .brass-bell-chain {
      width: 4px;
      height: 40px;
      background: repeating-linear-gradient(180deg, #ffd700 0px, #b45309 4px, #ffd700 8px);
      box-shadow: 0 0 6px rgba(0,0,0,0.8);
      border-radius: 2px;
    }

    .central-golden-bell {
      position: relative;
      font-size: clamp(50px, 8vw, 68px);
      animation: bellSway 2.5s ease-in-out infinite;
      transform-origin: top center;
      filter: drop-shadow(0 6px 18px rgba(0,0,0,0.95)) drop-shadow(0 0 25px rgba(255, 215, 0, 0.8));
    }

    @keyframes bellSway {
      0%, 100% { transform: rotate(0deg); }
      25% { transform: rotate(4deg); }
      75% { transform: rotate(-4deg); }
    }

    .kapat-knocker-assembly {
      margin-top: -8px;
      display: flex;
      flex-direction: column;
      align-items: center;
      position: relative;
    }

    .lion-mouth-plate {
      font-size: 36px;
      filter: drop-shadow(0 4px 8px rgba(0,0,0,0.9));
      z-index: 2;
    }

    .brass-knocker-ring {
      width: 42px;
      height: 42px;
      border: 5px solid #ffd700;
      border-radius: 50%;
      margin-top: -18px;
      background: radial-gradient(circle, transparent 60%, rgba(255, 215, 0, 0.4) 100%);
      box-shadow: 0 4px 10px rgba(0,0,0,0.9), inset 0 0 6px rgba(255,215,0,0.5);
      animation: knockerBounce 2.5s ease-in-out infinite;
      transform-origin: top center;
    }

    @keyframes knockerBounce {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(4px); }
    }

    /* Touch Prompt Badge */
    .door-prompt-badge {
      margin-top: 12px;
      background: rgba(30, 4, 3, 0.92);
      border: 1.8px solid #ffd700;
      border-radius: 25px;
      padding: 9px 20px;
      box-shadow: 0 8px 24px rgba(0,0,0,0.9), 0 0 18px rgba(255, 215, 0, 0.4), inset 0 0 10px rgba(255, 215, 0, 0.15);
      text-align: center;
      animation: promptGlowPulse 1.8s infinite alternate ease-in-out;
    }

    @keyframes promptGlowPulse {
      0% { box-shadow: 0 6px 18px rgba(0,0,0,0.8), 0 0 12px rgba(255, 215, 0, 0.3); transform: scale(1); }
      100% { box-shadow: 0 10px 28px rgba(0,0,0,0.95), 0 0 25px rgba(255, 215, 0, 0.65); transform: scale(1.03); }
    }

    .prompt-arrow-anim {
      font-size: 22px;
      display: inline-block;
      animation: arrowBob 1.2s infinite;
    }

    @keyframes arrowBob {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(5px); }
    }

    .prompt-main-text {
      font-family: var(--font-clean-hindi);
      font-size: clamp(16px, 3.2vw, 22px);
      font-weight: 800;
      color: #ffffff;
      text-shadow: 0 2px 6px rgba(0,0,0,0.9), 0 0 10px #ffd700;
      letter-spacing: 0.5px;
    }

    .prompt-sub-text {
      font-family: var(--font-royal-eng);
      font-size: clamp(11px, 2vw, 13px);
      color: #ffe680;
      font-weight: 600;
      letter-spacing: 0.8px;
      display: block;
      margin-top: 3px;
    }

    /* Main Container Card (Fluid Glassmorphic Royal Temple) */
    .mainContainer {
      width: 95%;
      max-width: 460px;
      margin: 15px auto 115px auto;
      text-align: center;
      position: relative;
      background: var(--card-bg);
      border: 2px solid var(--card-border);
      border-radius: 20px;
      box-shadow: 0 14px 40px rgba(0, 0, 0, 0.95);
      padding: 0 12px 25px 12px;
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      overflow: hidden;
    }

    /* Adaptive Dual-Wing Sanctum Layout */
    .sanctum-responsive-grid {
      display: flex;
      flex-direction: column;
      gap: 14px;
      width: 100%;
    }

    .sanctum-col {
      display: flex;
      flex-direction: column;
      gap: 14px;
      width: 100%;
    }

    .temple-toran {
      width: 100%;
      height: 44px;
      margin-bottom: 6px;
    }

    /* Original Snow Falling Banner GIF Containers */
    .snow-banner-strip {
      background-size: cover;
      background-position: center;
      border-radius: 10px;
      padding: 8px 12px;
      margin-bottom: 10px;
      border: 1px solid var(--card-border);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    }

    .snow-banner-1 {
      background: url(https://1.bp.blogspot.com/-Cj9gCf1TVCo/Xe5wCIRrf1I/AAAAAAAACXk/K2GXK7Vbn1Uz6RcqgtCEdtnYDXFIIkdDwCLcBGAsYHQ/s1600/Snow_falling1.gif), #ee0b0b;
      padding: 4px;
      margin-bottom: 6px;
    }

    .snow-banner-2 {
      background: url(https://1.bp.blogspot.com/-l0EVRb2fd3Q/WyNAg2N6m6I/AAAAAAAAAag/yA795u9GRJIf-DaE6-UCcWxL_bbdR5rXwCLcBGAs/s1600/Snow_falling1.gif), #ee0b0b;
      padding: 10px;
    }

    .sender-name {
      font-size: clamp(26px, 5.2vw, 42px);
      font-family: var(--font-divine-title);
      text-transform: uppercase;
      background: linear-gradient(180deg, #ffffff 0%, #fff3b0 30%, #ffd700 70%, #d97706 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.95)) drop-shadow(0 0 16px rgba(255, 215, 0, 0.6));
      word-break: break-word;
      animation: divineNameGlow 3s infinite alternate ease-in-out;
      margin: 6px 0 4px 0;
      line-height: 1.25;
      font-weight: 900;
      letter-spacing: 1px;
    }

    @keyframes divineNameGlow {
      0% { filter: drop-shadow(0 3px 5px rgba(0,0,0,0.95)) drop-shadow(0 0 12px rgba(255, 215, 0, 0.45)); }
      100% { filter: drop-shadow(0 3px 6px rgba(0,0,0,0.95)) drop-shadow(0 0 24px rgba(255, 215, 0, 0.85)); }
    }

    .wishing-title {
      font-size: clamp(15px, 2.8vw, 21px);
      font-family: var(--font-clean-hindi);
      color: #fff9e6;
      font-weight: 700;
      letter-spacing: 0.5px;
      text-shadow: 0 2px 5px rgba(0, 0, 0, 0.9), 0 0 10px rgba(255, 215, 0, 0.4);
      margin-bottom: 4px;
    }

    /* ===================================================
       🕉️ ROYAL SANATANI 3D GLASS RITUAL DARBAR STRIP
       =================================================== */
    .devotional-strip {
      display: flex;
      justify-content: space-between;
      align-items: stretch;
      margin: 18px 0 16px 0;
      padding: 12px 8px 10px 8px;
      gap: 7px;
      background: radial-gradient(ellipse at 50% 25%, rgba(68, 8, 8, 0.78) 0%, rgba(22, 2, 2, 0.94) 100%);
      backdrop-filter: blur(24px) saturate(210%);
      -webkit-backdrop-filter: blur(24px) saturate(210%);
      border: 1.8px solid rgba(255, 215, 0, 0.65);
      border-radius: 22px;
      box-shadow: 
        0 14px 40px rgba(0, 0, 0, 0.8),
        0 0 28px rgba(255, 180, 0, 0.3),
        inset 0 1px 2px rgba(255, 255, 255, 0.45),
        inset 0 0 18px rgba(255, 140, 0, 0.18);
      position: relative;
      perspective: 1200px;
      transform-style: preserve-3d;
      z-index: 15;
      overflow: visible;
    }

    /* Sacred Altar Golden Header Sheen */
    .devotional-strip::before {
      content: '';
      position: absolute;
      top: 0;
      left: 12%;
      right: 12%;
      height: 2px;
      background: linear-gradient(90deg, transparent, #ffd700, #fff7b2, #ffd700, transparent);
      box-shadow: 0 0 12px #ffd700;
      border-radius: 2px;
      pointer-events: none;
    }

    /* Individual 3D Glass Pedestal Capsule (Altar Pod) */
    .ritual-item {
      cursor: pointer;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      user-select: none;
      flex: 1;
      padding: 10px 4px 8px 4px;
      border-radius: 16px;
      background: linear-gradient(180deg, rgba(255, 215, 0, 0.1) 0%, rgba(0, 0, 0, 0.52) 100%);
      border: 1.3px solid rgba(255, 215, 0, 0.35);
      box-shadow: 
        0 6px 16px rgba(0, 0, 0, 0.55),
        inset 0 1px 1px rgba(255, 255, 255, 0.3),
        inset 0 -1px 3px rgba(0, 0, 0, 0.6);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      transform-style: preserve-3d;
      will-change: transform, box-shadow, border-color;
      transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
      position: relative;
    }

    /* 3D Elevated Hover State with Divine Golden & Saffron Aura */
    .ritual-item:hover {
      transform: translateY(-8px) scale(1.08) translateZ(32px);
      background: linear-gradient(180deg, rgba(255, 215, 0, 0.25) 0%, rgba(95, 10, 10, 0.72) 100%);
      border-color: #ffd700;
      box-shadow: 
        0 18px 36px rgba(0, 0, 0, 0.85),
        0 0 30px rgba(255, 215, 0, 0.85),
        0 0 55px rgba(255, 100, 0, 0.5),
        inset 0 1px 2px rgba(255, 255, 255, 0.65),
        inset 0 0 16px rgba(255, 235, 59, 0.45);
      z-index: 20;
    }

    .ritual-item:active {
      transform: translateY(-2px) scale(0.95);
      box-shadow: 0 4px 14px rgba(255, 215, 0, 0.6);
    }

    .ritual-icon {
      width: 48px;
      height: 48px;
      filter: drop-shadow(0 4px 8px rgba(255, 215, 0, 0.5));
    }

    .ritual-img {
      width: 52px;
      height: 52px;
      object-fit: contain;
      filter: drop-shadow(0 4px 10px rgba(255, 180, 0, 0.6));
      transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
      display: block;
      margin: 0 auto;
    }

    .ritual-item:hover .ritual-img {
      transform: scale(1.2) rotate(-2deg);
      filter: drop-shadow(0 0 24px #ffd700) drop-shadow(0 0 38px #ff5500) brightness(1.25);
    }

    .diya-img-box {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 52px;
      height: 52px;
      margin: 0 auto;
    }

    .diya-real-img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      transition: all 0.4s ease;
      position: relative;
      z-index: 2;
      filter: drop-shadow(0 4px 10px rgba(255, 140, 0, 0.65));
    }

    .diya-glow-halo {
      position: absolute;
      top: -12px;
      left: -12px;
      width: calc(100% + 24px);
      height: calc(100% + 24px);
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255, 215, 0, 0.85) 0%, rgba(255, 100, 0, 0.45) 50%, transparent 75%);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.6s ease, transform 0.6s ease;
      transform: scale(0.5);
      z-index: 1;
    }

    .diya-lit .diya-glow-halo {
      opacity: 1;
      transform: scale(1.3);
      animation: diyaPulsate 2s infinite alternate ease-in-out;
    }

    .diya-lit .diya-real-img {
      filter: brightness(1.3) drop-shadow(0 0 20px #ffaa00) drop-shadow(0 0 35px #ff4400);
      transform: scale(1.14);
    }

    @keyframes diyaPulsate {
      0% { opacity: 0.75; transform: scale(1.15); }
      100% { opacity: 1; transform: scale(1.4); filter: drop-shadow(0 0 25px #ff7700); }
    }

    /* Royal Sanatani Glass Capsule Action Label */
    .action-label {
      font-size: 11px;
      font-weight: 800;
      font-family: var(--font-clean-hindi);
      color: #fff9e6;
      margin-top: 7px;
      padding: 3px 8px;
      border-radius: 12px;
      background: rgba(0, 0, 0, 0.55);
      border: 1px solid rgba(255, 215, 0, 0.35);
      letter-spacing: 0.5px;
      white-space: nowrap;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.95), 0 0 6px rgba(255, 215, 0, 0.5);
      transition: all 0.3s ease;
    }

    .ritual-item:hover .action-label {
      background: linear-gradient(135deg, #ffd700, #f59e0b);
      color: #2b0303;
      border-color: #ffffff;
      text-shadow: none;
      box-shadow: 0 0 14px rgba(255, 215, 0, 0.85);
      transform: scale(1.06);
    }

    .bell-swing {
      animation: swingBell 1.4s ease-in-out;
      transform-origin: top center;
    }

    @keyframes swingBell {
      0% { transform: rotate(0); }
      15% { transform: rotate(24deg); }
      30% { transform: rotate(-20deg); }
      45% { transform: rotate(15deg); }
      60% { transform: rotate(-10deg); }
      75% { transform: rotate(5deg); }
      100% { transform: rotate(0); }
    }

    .shankh-active {
      animation: shankhBlast 2.5s ease-out;
      transform-origin: center center;
    }

    @keyframes shankhBlast {
      0% { transform: scale(1); filter: drop-shadow(0 0 5px #fff); }
      25% { transform: scale(1.22); filter: drop-shadow(0 0 25px #ffd700) brightness(1.2); }
      50% { transform: scale(1.14); filter: drop-shadow(0 0 35px #38bdf8); }
      100% { transform: scale(1); filter: drop-shadow(0 0 5px #ffd700); }
    }

    @keyframes realFlame {
      0% { transform: scale(1, 1) rotate(-1.5deg); filter: drop-shadow(0 0 10px #ffb300); }
      25% { transform: scale(1.06, 0.96) rotate(2deg); filter: drop-shadow(0 0 18px #ff7043); }
      50% { transform: scale(0.95, 1.05) rotate(-1deg); filter: drop-shadow(0 0 24px #ffca28); }
      75% { transform: scale(1.04, 1) rotate(1.8deg); filter: drop-shadow(0 0 16px #ff5722); }
      100% { transform: scale(1, 1) rotate(-1.5deg); filter: drop-shadow(0 0 10px #ffb300); }
    }

    .aarti-rotating {
      animation: aartiCirculation 4s ease-in-out;
    }

    @keyframes aartiCirculation {
      0% { transform: translate(0, 0) scale(1); }
      25% { transform: translate(-35px, -60px) scale(1.15) rotate(10deg); }
      50% { transform: translate(0px, -110px) scale(1.22) rotate(0deg); }
      75% { transform: translate(35px, -60px) scale(1.15) rotate(-10deg); }
      100% { transform: translate(0, 0) scale(1); }
    }

    .aarti-thali-img {
      filter: drop-shadow(0 4px 12px rgba(255, 215, 0, 0.75)) drop-shadow(0 0 16px rgba(255, 120, 0, 0.5));
      transition: all 0.35s ease;
    }

    .aarti-rotating .aarti-thali-img {
      filter: drop-shadow(0 0 25px #ffd700) drop-shadow(0 0 45px #ff5500) brightness(1.22);
    }

    .pushpa-real-img {
      filter: drop-shadow(0 4px 10px rgba(255, 165, 0, 0.7)) drop-shadow(0 0 14px rgba(255, 215, 0, 0.4));
      transition: all 0.35s ease;
    }

    .pushpa-real-active {
      animation: pushpaPop 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    @keyframes pushpaPop {
      0% { transform: scale(1); }
      40% { transform: scale(1.36) rotate(24deg); filter: drop-shadow(0 0 28px #ffd700) brightness(1.25); }
      100% { transform: scale(1) rotate(0deg); }
    }

    /* All 5 Original Artworks */
    .durga-art {
      width: 75%;
      max-width: 320px;
      margin: 12px auto;
      display: block;
      filter: drop-shadow(0 6px 14px rgba(255, 215, 0, 0.45));
    }

    /* Divine Animated Maa Durga Showcase (Living GIF Effect) */
    .divine-durga-frame {
      position: relative;
      max-width: 340px;
      margin: 16px auto;
      border-radius: 20px;
      padding: 6px;
      background: linear-gradient(135deg, #ffd700, #ff8c00, #ffd700, #b8860b);
      box-shadow: 0 0 25px rgba(255, 215, 0, 0.7), inset 0 0 15px rgba(255, 235, 59, 0.5);
      animation: divineBorderGlow 3s infinite alternate ease-in-out;
      overflow: hidden;
    }

    @keyframes divineBorderGlow {
      0% { box-shadow: 0 0 18px rgba(255, 215, 0, 0.6), 0 0 35px rgba(255, 100, 0, 0.4); }
      100% { box-shadow: 0 0 32px rgba(255, 235, 59, 0.9), 0 0 55px rgba(255, 60, 0, 0.7); }
    }

    .divine-durga-img {
      width: 100%;
      display: block;
      border-radius: 16px;
      position: relative;
      z-index: 2;
      filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.7));
    }

    .divine-sparkle-overlay {
      display: none;
    }

    .divine-badge {
      position: absolute;
      bottom: 12px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 3;
      background: rgba(180, 10, 10, 0.9);
      border: 1.5px solid #ffd700;
      color: #ffe600;
      font-size: 13.5px;
      font-weight: 800;
      padding: 5px 16px;
      border-radius: 20px;
      letter-spacing: 1px;
      white-space: nowrap;
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.7);
      text-shadow: 0 0 6px #ff0000;
    }

    /* ===================================================
       🕉️ DIVINE SANATANI SACRED COUNTDOWN TEMPLE ALTAR
       =================================================== */
    .countdown-card {
      position: relative;
      background: radial-gradient(ellipse at 50% 15%, rgba(68, 8, 8, 0.95) 0%, rgba(24, 2, 2, 0.98) 100%);
      border: 2px solid #ffd700;
      border-radius: 20px;
      padding: 16px 12px 14px 12px;
      margin: 16px 0;
      box-shadow: 0 8px 30px rgba(0, 0, 0, 0.85),
                  0 0 25px rgba(255, 180, 0, 0.3),
                  inset 0 0 20px rgba(255, 215, 0, 0.12);
      overflow: hidden;
      transition: all 0.3s ease;
    }

    /* Temple corner ornaments */
    .mandir-corner {
      position: absolute;
      font-size: 16px;
      color: #ffd700;
      filter: drop-shadow(0 0 4px #ff8c00);
      line-height: 1;
      pointer-events: none;
      z-index: 3;
    }
    .corner-tl { top: 9px; left: 10px; }
    .corner-tr { top: 9px; right: 10px; }

    .countdown-header-ribbon {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      font-family: var(--font-divine-title);
      font-size: 14px;
      font-weight: 800;
      color: #fef08a;
      letter-spacing: 1px;
      margin-bottom: 6px;
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9);
    }
    .countdown-header-ribbon .ribbon-flower {
      font-size: 12px;
      filter: drop-shadow(0 0 3px #f59e0b);
    }

    .advance-badge-wrapper {
      margin: 2px 0 10px 0;
    }

    .advance-badge {
      display: inline-block;
      font-family: var(--font-royal-eng);
      font-size: clamp(16px, 3.2vw, 22px);
      font-weight: 900;
      letter-spacing: 4px;
      padding: 4px 22px;
      background: linear-gradient(135deg, rgba(255, 215, 0, 0.18), rgba(245, 158, 11, 0.35));
      border: 1.5px solid #ffd700;
      border-radius: 30px;
      color: #ffffff;
      box-shadow: 0 3px 12px rgba(0, 0, 0, 0.6), inset 0 0 10px rgba(255, 215, 0, 0.3);
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.95), 0 0 12px rgba(255, 215, 0, 0.7);
      margin: 0;
      line-height: 1.2;
    }

    /* 4-Slot Sanatani Timer Grid */
    .sanatani-countdown-display {
      margin: 6px 0 10px 0;
    }

    .loading-countdown-text {
      font-family: var(--font-clean-hindi);
      font-size: 14px;
      color: #ffd700;
      font-weight: 600;
      letter-spacing: 0.5px;
    }

    .sanatani-timer-grid {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      width: 100%;
    }

    .sanatani-timer-slot {
      display: flex;
      flex-direction: column;
      align-items: center;
      flex: 1;
      max-width: 72px;
      min-width: 52px;
    }

    .timer-plate {
      width: 100%;
      background: linear-gradient(180deg, #380505 0%, #170101 100%);
      border: 1.5px solid #f59e0b;
      border-radius: 12px;
      padding: 7px 2px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.7),
                  inset 0 1px 1px rgba(255, 255, 255, 0.2),
                  0 0 10px rgba(245, 158, 11, 0.25);
      position: relative;
      overflow: hidden;
    }
    .timer-plate::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 42%;
      background: linear-gradient(180deg, rgba(255, 215, 0, 0.22), transparent);
      border-radius: 10px 10px 0 0;
      pointer-events: none;
    }

    .timer-digits {
      font-family: var(--font-royal-eng);
      font-size: clamp(20px, 3.8vw, 27px);
      font-weight: 900;
      line-height: 1;
      display: block;
      background: linear-gradient(180deg, #ffffff 0%, #fff7b2 40%, #ffd700 75%, #d97706 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.95));
      letter-spacing: 0.5px;
    }

    .timer-label {
      font-family: var(--font-clean-hindi);
      font-size: 11.5px;
      font-weight: 700;
      color: #fef08a;
      letter-spacing: 0.5px;
      margin-top: 5px;
      text-transform: uppercase;
      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.95);
      line-height: 1.1;
    }

    .timer-divider {
      font-size: 13px;
      line-height: 1;
      color: #ffd700;
      filter: drop-shadow(0 0 5px rgba(255, 215, 0, 0.7));
      animation: divinePulse 2s infinite ease-in-out;
      margin-bottom: 14px;
      flex-shrink: 0;
    }

    @keyframes divinePulse {
      0%, 100% { transform: scale(1); opacity: 0.8; }
      50% { transform: scale(1.18); opacity: 1; filter: drop-shadow(0 0 8px rgba(255, 215, 0, 1)); }
    }

    .sanatani-arrived-banner {
      background: linear-gradient(135deg, rgba(180, 10, 10, 0.85), rgba(70, 5, 5, 0.95));
      border: 1.5px solid #ffd700;
      border-radius: 14px;
      padding: 12px 10px;
      font-family: var(--font-divine-title);
      font-size: 17px;
      color: #fff4b8;
      box-shadow: 0 0 20px rgba(255, 215, 0, 0.4);
    }
    .sanatani-arrived-banner .arrived-sub {
      font-family: var(--font-clean-hindi);
      font-size: 13px;
      color: #ffffff;
      margin-top: 4px;
      font-weight: 600;
    }

    .left-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      font-family: var(--font-clean-hindi);
      font-size: clamp(12px, 2.4vw, 14.5px);
      font-weight: 700;
      color: #fff1b8;
      letter-spacing: 1.5px;
      margin-top: 4px;
      text-transform: uppercase;
      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.95), 0 0 8px rgba(255, 170, 0, 0.4);
    }
    .left-badge .badge-om {
      font-size: 14px;
      color: #ffd700;
      filter: drop-shadow(0 0 5px #f59e0b);
    }

    /* Sanatani Vedic Shayari & Wishing Box with Radiant 3D Hover Glow */
    .shayari-box {
      position: relative;
      background: radial-gradient(ellipse at 50% 15%, rgba(68, 12, 10, 0.94) 0%, rgba(26, 4, 3, 0.98) 100%);
      border-radius: 20px;
      padding: 22px 18px 20px;
      margin: 20px auto;
      max-width: 520px;
      border: 2px solid rgba(255, 215, 0, 0.65);
      border-left: 5px solid var(--accent-deep-gold);
      border-right: 5px solid var(--accent-deep-gold);
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8), 
                  inset 0 0 25px rgba(255, 180, 0, 0.12),
                  0 0 18px rgba(255, 180, 0, 0.22);
      transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      overflow: hidden;
      backdrop-filter: blur(16px) saturate(180%);
      -webkit-backdrop-filter: blur(16px) saturate(180%);
    }

    /* Ambient Gold Trim Elements */
    .shayari-box::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, transparent, #ffd700, #ff8c00, #ffd700, transparent);
      opacity: 0.85;
    }

    .shayari-box::after {
      content: "";
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, transparent, #ff8c00, #ffd700, #ff8c00, transparent);
      opacity: 0.85;
    }

    /* Sanatani 3D Divine Hover Glow Effect */
    .shayari-box:hover {
      transform: translateY(-6px);
      border-color: #ffd700;
      box-shadow: 0 18px 45px rgba(255, 150, 0, 0.45), 
                  0 0 35px rgba(255, 215, 0, 0.42), 
                  inset 0 0 30px rgba(255, 215, 0, 0.22);
    }

    .shayari-header-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      margin-bottom: 10px;
    }

    .shayari-lotus-icon {
      font-size: 22px;
      filter: drop-shadow(0 0 6px rgba(255, 105, 180, 0.8));
      animation: lotusPulse 2.8s ease-in-out infinite;
      display: inline-block;
      user-select: none;
    }

    @keyframes lotusPulse {
      0%, 100% { transform: scale(1); filter: drop-shadow(0 0 6px rgba(255, 105, 180, 0.8)); }
      50% { transform: scale(1.15) rotate(5deg); filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.9)); }
    }

    .shayari-box h2 {
      font-family: var(--font-royal-eng);
      font-size: clamp(22px, 4vw, 29px);
      font-weight: 800;
      letter-spacing: 1.5px;
      background: linear-gradient(180deg, #ffffff 0%, #fff7b2 35%, #ffd700 70%, #f59e0b 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.95)) drop-shadow(0 0 10px rgba(255, 215, 0, 0.4));
      margin: 0;
    }

    .shayari-text {
      font-family: var(--font-clean-hindi);
      font-size: clamp(15px, 2.3vw, 17.5px);
      font-weight: 600;
      line-height: 1.85;
      color: #fff9e6;
      text-shadow: 0 2px 6px rgba(0, 0, 0, 0.95), 0 0 8px rgba(255, 215, 0, 0.2);
      letter-spacing: 0.3px;
      min-height: 85px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 8px 12px;
      transition: opacity 0.25s ease, transform 0.25s ease;
    }

    .quote-counter-badge {
      display: inline-block;
      font-family: var(--font-royal-eng);
      font-size: 11.5px;
      font-weight: 700;
      color: #ffe066;
      background: rgba(255, 215, 0, 0.12);
      border: 1px solid rgba(255, 215, 0, 0.4);
      border-radius: 12px;
      padding: 3px 12px;
      margin: 4px auto 10px;
      letter-spacing: 1px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
      user-select: none;
    }

    .wish-switcher-nav {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 10px;
      margin-top: 6px;
      flex-wrap: wrap;
    }

    .wish-nav-btn {
      font-family: var(--font-body);
      background: linear-gradient(135deg, rgba(60, 15, 10, 0.9), rgba(40, 8, 5, 0.95));
      border: 1.5px solid rgba(255, 215, 0, 0.7);
      color: #ffd700;
      font-size: 13px;
      font-weight: 700;
      padding: 8px 18px;
      border-radius: 25px;
      cursor: pointer;
      box-shadow: 0 3px 10px rgba(0, 0, 0, 0.6), inset 0 0 8px rgba(255, 215, 0, 0.15);
      transition: all 0.25s ease;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      user-select: none;
    }

    .wish-nav-btn:hover {
      background: linear-gradient(135deg, #ffd700, #f59e0b);
      color: #1a0202;
      border-color: #ffffff;
      transform: translateY(-2px) scale(1.04);
      box-shadow: 0 6px 18px rgba(255, 215, 0, 0.65), 0 0 12px rgba(255, 215, 0, 0.5);
    }

    .wish-nav-btn:active {
      transform: translateY(0) scale(0.98);
    }

    .wish-copy-btn {
      font-family: var(--font-body);
      background: rgba(255, 215, 0, 0.15);
      border: 1.5px dashed rgba(255, 215, 0, 0.6);
      color: #ffe680;
      font-size: 12.5px;
      font-weight: 700;
      padding: 8px 16px;
      border-radius: 25px;
      cursor: pointer;
      box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5);
      transition: all 0.25s ease;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      user-select: none;
    }

    .wish-copy-btn:hover {
      background: rgba(255, 215, 0, 0.3);
      border-color: #ffd700;
      color: #ffffff;
      transform: translateY(-2px);
      box-shadow: 0 4px 14px rgba(255, 215, 0, 0.5);
    }

    .wish-copy-btn.copied {
      background: #10b981 !important;
      border-color: #34d399 !important;
      color: #ffffff !important;
      transform: scale(1.05);
    }

    /* Royal Devotional Sacred Music Player (राजसी भक्ति संगीत प्लेयर) */
    .sacred-player-card {
      margin: 18px auto;
      max-width: 400px;
      width: 95%;
      background: linear-gradient(135deg, rgba(60, 5, 5, 0.95), rgba(30, 2, 2, 0.98));
      border: 2px solid #ffd700;
      border-radius: 18px;
      padding: 14px 16px;
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.7), 0 0 15px rgba(255, 215, 0, 0.35), inset 0 0 12px rgba(255, 215, 0, 0.15);
      position: relative;
      overflow: hidden;
    }

    .sacred-player-card::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 215, 0, 0.08) 0%, transparent 60%);
      pointer-events: none;
    }

    .sacred-player-header {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 12px;
      border-bottom: 1px dashed rgba(255, 215, 0, 0.3);
      padding-bottom: 10px;
    }

    .sacred-emblem {
      font-size: 24px;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: linear-gradient(135deg, #ffd700, #d97706);
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0 12px rgba(255, 215, 0, 0.6);
      color: #78350f;
      flex-shrink: 0;
      animation: pulse 2s infinite;
    }

    .sacred-track-info {
      text-align: left;
      flex-grow: 1;
      overflow: hidden;
    }

    .sacred-track-title {
      font-size: 14px;
      font-weight: 800;
      color: #ffe600;
      text-shadow: 0 0 6px rgba(255, 215, 0, 0.5);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      font-family: 'Rozha One', 'Yatra One', serif;
    }

    .sacred-track-sub {
      font-size: 11px;
      color: #fed7aa;
      margin-top: 2px;
      letter-spacing: 0.5px;
    }

    .sacred-bars {
      display: flex;
      align-items: flex-end;
      gap: 3px;
      height: 18px;
    }

    .sacred-bars span {
      width: 3px;
      height: 4px;
      background: #ffd700;
      border-radius: 2px;
      transition: height 0.2s;
    }

    .playing-bars span:nth-child(1) { animation: sBarAnim 0.7s infinite alternate ease-in-out; }
    .playing-bars span:nth-child(2) { animation: sBarAnim 0.9s infinite alternate ease-in-out 0.15s; }
    .playing-bars span:nth-child(3) { animation: sBarAnim 0.6s infinite alternate ease-in-out 0.3s; }
    .playing-bars span:nth-child(4) { animation: sBarAnim 0.8s infinite alternate ease-in-out 0.45s; }
    .playing-bars span:nth-child(5) { animation: sBarAnim 0.5s infinite alternate ease-in-out 0.2s; }

    @keyframes sBarAnim {
      0% { height: 4px; }
      100% { height: 18px; }
    }

    .sacred-player-body {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .sacred-play-btn {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: linear-gradient(135deg, #ffd700, #f59e0b, #d97706);
      border: 2px solid #fff;
      color: #5b2106;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0 4px 14px rgba(245, 158, 11, 0.6), inset 0 2px 4px rgba(255, 255, 255, 0.5);
      flex-shrink: 0;
      transition: transform 0.2s;
    }

    .sacred-play-btn:active {
      transform: scale(0.92);
    }

    .sacred-progress-container {
      flex-grow: 1;
    }

    .sacred-time-row {
      display: flex;
      justify-content: space-between;
      font-size: 11px;
      color: #fef08a;
      font-family: monospace;
      margin-bottom: 4px;
      font-weight: bold;
    }

    .sacred-progress-bar {
      width: 100%;
      height: 8px;
      background: rgba(255, 255, 255, 0.15);
      border-radius: 10px;
      position: relative;
      cursor: pointer;
      border: 1px solid rgba(255, 215, 0, 0.3);
    }

    .sacred-progress-fill {
      height: 100%;
      width: 0%;
      background: linear-gradient(90deg, #f59e0b, #ffd700);
      border-radius: 10px;
      box-shadow: 0 0 8px #ffd700;
      transition: width 0.1s linear;
    }

    .sacred-scrubber {
      position: absolute;
      top: 50%;
      left: 0%;
      transform: translate(-50%, -50%);
      font-size: 14px;
      line-height: 1;
      pointer-events: none;
      filter: drop-shadow(0 0 4px #ff9900);
      transition: left 0.1s linear;
    }

    .sacred-vol-btn {
      background: transparent;
      border: none;
      color: #ffd700;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 4px;
      transition: transform 0.2s;
      flex-shrink: 0;
    }

    .sacred-vol-btn:active {
      transform: scale(0.9);
    }

    /* Dual Action Row (Download Status Poster & QR Code) */
    .action-button-row {
      display: flex;
      gap: 10px;
      justify-content: center;
      margin: 16px 0;
    }

    .royal-btn {
      flex: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 11px 12px;
      border-radius: 25px;
      border: 1.5px solid #fff;
      font-weight: 800;
      font-size: 14px;
      cursor: pointer;
      box-shadow: 0 4px 14px rgba(0,0,0,0.5);
      transition: transform 0.2s;
      text-decoration: none;
    }

    .royal-btn:active {
      transform: scale(0.96);
    }

    .btn-download {
      background: linear-gradient(135deg, #d97706, #f59e0b);
      color: #000;
    }

    .btn-qr {
      background: linear-gradient(135deg, #2563eb, #38bdf8);
      color: #fff;
    }

    /* QR Code Modal */
    .qr-modal {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.85);
      backdrop-filter: blur(8px);
      z-index: 10020;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    .qr-modal.show {
      display: flex;
    }

    .qr-box {
      background: #1e1b4b;
      border: 2px solid #ffd700;
      border-radius: 20px;
      padding: 24px;
      max-width: 320px;
      width: 100%;
      text-align: center;
      box-shadow: 0 0 30px rgba(255, 215, 0, 0.6);
      position: relative;
    }

    .qr-close-btn {
      position: absolute;
      top: 10px;
      right: 14px;
      font-size: 24px;
      color: #ffd700;
      cursor: pointer;
    }

    #qrCanvasContainer {
      background: #ffffff;
      padding: 12px;
      border-radius: 12px;
      margin: 15px auto;
      display: inline-block;
    }

    /* Single-Line Devotional Social Media Dock (Ultra-Transparent Glass) */
    .social-share-hub {
      display: none;
      position: fixed;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 100%;
      max-width: 520px;
      background: rgba(15, 2, 2, 0.35);
      backdrop-filter: blur(30px) saturate(210%);
      -webkit-backdrop-filter: blur(30px) saturate(210%);
      border-top: 1.5px solid rgba(255, 215, 0, 0.6);
      border-left: 1px solid rgba(255, 255, 255, 0.18);
      border-right: 1px solid rgba(255, 255, 255, 0.18);
      border-radius: 26px 26px 0 0;
      box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.5), 0 0 25px rgba(255, 215, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
      padding: 11px 14px;
      padding-bottom: max(14px, env(safe-area-inset-bottom));
      z-index: 10002;
      animation: slideUpDock 0.35s ease-out;
    }

    @keyframes slideUpDock {
      from { transform: translate(-50%, 100%); opacity: 0; }
      to { transform: translate(-50%, 0); opacity: 1; }
    }

    /* Prominent Royal Capsule Button for Recipients to Enter Name */
    .create-own-btn {
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
      padding: 10px 18px;
      margin-bottom: 9px;
      background: linear-gradient(135deg, rgba(217, 119, 6, 0.65), rgba(180, 83, 9, 0.55));
      border: 1.6px solid #ffd700;
      border-radius: 30px;
      color: #ffffff;
      font-size: 15px;
      font-weight: 800;
      font-family: var(--font-clean-hindi);
      cursor: pointer;
      box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45), 0 0 16px rgba(255, 215, 0, 0.3), inset 0 1px 2px rgba(255, 255, 255, 0.3);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1);
      animation: createOwnPulse 2.4s infinite alternate ease-in-out;
      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
      user-select: none;
      letter-spacing: 0.5px;
    }

    .create-own-btn:hover {
      transform: translateY(-2px) scale(1.02);
      background: linear-gradient(135deg, rgba(245, 158, 11, 0.85), rgba(217, 119, 6, 0.75));
      border-color: #ffffff;
      box-shadow: 0 6px 24px rgba(255, 215, 0, 0.55), inset 0 1px 3px rgba(255, 255, 255, 0.5);
      color: #ffffff;
    }

    .create-own-btn:active {
      transform: scale(0.97);
    }

    .create-own-btn .btn-sparkle {
      font-size: 15px;
      animation: sparkleSpin 3s infinite linear;
      display: inline-block;
    }

    .create-own-btn .btn-icon {
      font-size: 16px;
    }

    @keyframes createOwnPulse {
      0% {
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45), 0 0 12px rgba(255, 215, 0, 0.25);
        border-color: rgba(255, 215, 0, 0.65);
      }
      100% {
        box-shadow: 0 4px 22px rgba(255, 215, 0, 0.55), 0 0 25px rgba(245, 158, 11, 0.4);
        border-color: #fff59d;
      }
    }

    @keyframes sparkleSpin {
      0% { transform: scale(1) rotate(0deg); }
      50% { transform: scale(1.2) rotate(180deg); }
      100% { transform: scale(1) rotate(360deg); }
    }

    .share-hub-title {
      font-family: var(--font-divine-title);
      font-size: 14.5px;
      font-weight: 800;
      color: #ffe899;
      margin-bottom: 7px;
      text-transform: uppercase;
      letter-spacing: 1px;
      text-align: center;
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9), 0 0 10px rgba(255, 215, 0, 0.5);
    }

    .social-grid {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      justify-content: center;
      align-items: center;
      gap: 10px;
      max-width: 480px;
      margin: 0 auto;
      overflow-x: auto;
      padding: 3px 6px;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
    }
    .social-grid::-webkit-scrollbar {
      display: none;
    }

    .social-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      min-width: 44px;
      border-radius: 50%;
      color: #ffffff;
      text-decoration: none;
      border: 1.5px solid rgba(255, 255, 255, 0.35);
      cursor: pointer;
      position: relative;
      transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
      flex-shrink: 0;
    }

    .social-btn:hover {
      transform: translateY(-4px) scale(1.15);
      border-color: #ffd700;
      box-shadow: 0 6px 18px rgba(255, 215, 0, 0.55);
    }

    .social-btn:active {
      transform: scale(0.92);
    }

    .social-btn svg {
      width: 22px;
      height: 22px;
      fill: currentColor;
      transition: transform 0.2s ease;
    }
    .social-btn:hover svg {
      transform: scale(1.08);
    }

    .btn-wa {
      background: linear-gradient(135deg, #25D366, #128C7E);
      box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
    }
    .btn-fb {
      background: linear-gradient(135deg, #1877F2, #0d5cb6);
      box-shadow: 0 4px 12px rgba(24, 119, 242, 0.4);
    }
    .btn-ig {
      background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
      box-shadow: 0 4px 12px rgba(220, 39, 67, 0.4);
    }
    .btn-x {
      background: #000000;
      border-color: #666;
      box-shadow: 0 4px 12px rgba(255, 255, 255, 0.15);
    }
    .btn-snap {
      background: #FFFC00;
      color: #000000;
      box-shadow: 0 4px 12px rgba(255, 252, 0, 0.4);
    }
    .btn-snap svg {
      fill: #000000;
    }
    .btn-tg {
      background: linear-gradient(135deg, #229ED9, #1b7ba9);
      box-shadow: 0 4px 12px rgba(34, 158, 217, 0.4);
    }
    .btn-copy {
      background: linear-gradient(135deg, #4b5563, #1f2937);
      border-color: #ffd700;
      box-shadow: 0 4px 12px rgba(255, 215, 0, 0.3);
    }

    /* Bottom Floating Ultra-Transparent Glass Dock for Custom Name */
    #formBox {
      position: fixed;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 100%;
      max-width: 520px;
      padding: 12px 16px;
      padding-bottom: max(14px, env(safe-area-inset-bottom));
      background: rgba(20, 4, 4, 0.45);
      backdrop-filter: blur(28px) saturate(200%);
      -webkit-backdrop-filter: blur(28px) saturate(200%);
      box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.55), 0 0 25px rgba(255, 215, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.28);
      border-top: 1.5px solid rgba(255, 215, 0, 0.55);
      border-left: 1px solid rgba(255, 215, 0, 0.2);
      border-right: 1px solid rgba(255, 215, 0, 0.2);
      border-radius: 26px 26px 0 0;
      z-index: 10001;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 12px;
    }

    #nameTextBox {
      width: 68%;
      max-width: 290px;
      height: 48px;
      padding: 8px 16px;
      border: 1.8px solid rgba(255, 215, 0, 0.65);
      border-radius: 30px;
      background: rgba(255, 255, 255, 0.14);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      color: #ffffff;
      font-family: var(--font-clean-hindi);
      font-size: 16px;
      font-weight: 700;
      text-align: center;
      outline: none;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35), inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 0 15px rgba(255, 215, 0, 0.15);
      transition: all 0.3s ease;
      letter-spacing: 0.5px;
    }

    #nameTextBox::placeholder {
      color: rgba(255, 255, 255, 0.85);
      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
      font-weight: 600;
    }

    #nameTextBox:focus {
      background: rgba(255, 255, 255, 0.24);
      border-color: #ffd700;
      box-shadow: 0 0 22px rgba(255, 215, 0, 0.75), inset 0 1px 3px rgba(255, 255, 255, 0.45);
      transform: scale(1.02);
    }

    #goButton {
      width: 28%;
      max-width: 110px;
      height: 48px;
      background: linear-gradient(135deg, #f59e0b, #d97706);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      color: #ffffff;
      font-family: var(--font-body);
      font-size: 16px;
      font-weight: 800;
      border: 1.8px solid #ffd700;
      border-radius: 30px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0 4px 18px rgba(245, 158, 11, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.5);
      transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    }

    #goButton:hover {
      transform: translateY(-2px) scale(1.05);
      box-shadow: 0 6px 24px rgba(245, 158, 11, 0.75), 0 0 15px rgba(255, 255, 255, 0.4);
    }

    #goButton:active {
      transform: scale(0.94);
    }

    .close-form-btn {
      width: 44px;
      height: 44px;
      min-width: 44px;
      border-radius: 50%;
      background: rgba(220, 38, 38, 0.4);
      border: 1.5px solid rgba(255, 215, 0, 0.65);
      color: #ffd700;
      font-size: 18px;
      font-weight: bold;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.25s ease;
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
    }

    .close-form-btn:hover {
      background: rgba(220, 38, 38, 0.75);
      border-color: #ffffff;
      color: #ffffff;
      transform: scale(1.08);
    }

    /* Toast Notification */
    #toast {
      visibility: hidden;
      min-width: 260px;
      background: #10b981;
      color: #fff;
      text-align: center;
      border-radius: 30px;
      padding: 12px 20px;
      position: fixed;
      z-index: 10025;
      left: 50%;
      bottom: 90px;
      transform: translateX(-50%);
      font-size: 14.5px;
      font-weight: bold;
      box-shadow: 0 5px 15px rgba(0,0,0,0.6);
      border: 1px solid #fff;
      opacity: 0;
      transition: opacity 0.4s, bottom 0.4s;
    }

    #toast.show {
      visibility: visible;
      opacity: 1;
      bottom: 110px;
    }

    /* ===================================================
       UNIVERSAL RESPONSIVE BREAKPOINT & MODERN UI SYSTEM
       =================================================== */


    /* 🚀 2026 UNIVERSAL MOBILE BOOSTER PACK */
    /* CSS Layout & Paint Containment for Ultra-Fast Scroll */
    .countdown-card,
    .sacred-player-card,
    .shayari-box,
    .navdurga-corridor-card,
    .action-button-row,
    #socialShareHub {
      contain: content;
      content-visibility: auto;
      contain-intrinsic-size: 0 320px;
    }

    @media (max-width: 768px) {
      /* 1. Eliminate 51-box-shadow fireworks on mobile */
      .pyro {
        display: none !important;
      }

      /* 2. Static Sanatani sacred background - 100% beautiful, 0% GPU load */
      .sanatani-om-bg {
        animation: none !important;
        opacity: 0.85 !important;
      }

      .sanatani-om-watermark {
        animation: none !important;
        transform: translate3d(-50%, -50%, 0) !important;
        text-shadow: 0 0 35px rgba(255, 140, 0, 0.3) !important;
      }

      /* 3. Keep 4 lightweight petals on mobile */
      .snowflake:nth-of-type(n+5) {
        display: none !important;
      }

      /* 4. Touch-optimized smooth hardware scroll */
      html, body {
        -webkit-overflow-scrolling: touch;
        touch-action: pan-y;
      }

      /* 5. Fast mobile glassmorphism (fast blur with rich solid fallback) */
      .mainContainer,
      .countdown-card,
      .sacred-player-card,
      .shayari-box,
      .navdurga-corridor-card,
      .qr-box,
      .social-share-hub {
        backdrop-filter: blur(6px) !important;
        -webkit-backdrop-filter: blur(6px) !important;
      }
    }

    /* Mobile Portrait (< 480px) */
    @media (max-width: 480px) {
      .mainContainer {
        width: 95%;
        margin: 10px auto 105px auto;
        padding: 0 10px 22px 10px;
        border-radius: 18px;
      }
      .devotional-strip {
        padding: 10px 4px;
        gap: 2px;
      }
      .ritual-icon {
        width: 40px;
        height: 40px;
      }
      .action-label {
        font-size: 10px;
      }
      .social-btn {
        width: 40px;
        height: 40px;
        min-width: 40px;
      }
      .social-btn svg {
        width: 20px;
        height: 20px;
      }
    }

    /* Phablets & Small Tablets (481px - 768px) */
    @media (min-width: 481px) and (max-width: 768px) {
      .mainContainer {
        max-width: 580px;
        padding: 0 16px 26px 16px;
        border-radius: 22px;
      }
      .durga-art {
        max-width: 360px;
      }
    }

    /* Tablets / iPad (769px - 1023px) */
    @media (min-width: 769px) and (max-width: 1023px) {
      .mainContainer {
        max-width: 740px;
        padding: 0 22px 28px 22px;
        border-radius: 24px;
      }
      .durga-art {
        max-width: 380px;
      }
      .divine-durga-frame {
        max-width: 420px;
      }
      .sacred-player-card {
        max-width: 480px;
      }
    }

    /* Laptops & Standard Desktops / PC (>= 1024px) */
    @media (min-width: 1024px) {
      .mainContainer {
        max-width: 1060px;
        margin: 20px auto 115px auto;
        padding: 0 24px 32px 24px;
        border-radius: 28px;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.95), 0 0 35px rgba(255, 215, 0, 0.25);
      }

      .sanctum-responsive-grid {
        display: grid;
        grid-template-columns: 1.05fr 0.95fr;
        gap: 24px;
        align-items: start;
        margin-top: 12px;
      }

      .sanctum-col {
        gap: 18px;
      }

      .durga-art {
        width: 85%;
        max-width: 400px;
      }

      .divine-durga-frame {
        max-width: 100%;
        width: 100%;
      }

      .sacred-player-card {
        max-width: 100%;
        width: 100%;
      }

      .countdown-card, .shayari-box {
        margin: 0;
      }

      .keyboard-shortcuts-badge {
        display: block !important;
      }

      .navdurga-corridor-card {
        max-width: 1060px;
        margin: 24px auto 120px auto;
        padding: 24px 20px;
      }

      .navdurga-scroll-container {
        justify-content: center;
        flex-wrap: wrap;
        gap: 16px;
      }

      .navdurga-card {
        flex: 0 0 160px;
      }
    }

    /* Ultra-wide & 4K Displays (> 1440px) */
    @media (min-width: 1440px) {
      .mainContainer {
        max-width: 1180px;
        padding: 0 30px 36px 30px;
      }
      .sanctum-responsive-grid {
        gap: 32px;
      }
    }

    /* Desktop Keyboard Shortcuts Badge */
    .keyboard-shortcuts-badge {
      display: none;
      background: rgba(0, 0, 0, 0.65);
      border: 1px dashed var(--accent-gold);
      border-radius: 12px;
      padding: 9px 14px;
      color: #ffe600;
      font-size: 12.5px;
      margin-top: 8px;
      text-align: center;
      letter-spacing: 0.5px;
      box-shadow: inset 0 0 10px rgba(255, 215, 0, 0.15);
    }

    .keyboard-shortcuts-badge kbd {
      background: #222;
      border: 1px solid #777;
      border-radius: 4px;
      padding: 2px 6px;
      font-family: monospace;
      color: #fff;
      font-size: 11.5px;
      margin: 0 2px;
      box-shadow: 0 2px 0 rgba(255, 255, 255, 0.2);
    }

/* =========================================================================
   🚀 2026 MODERN NATIVE CSS + 3D SPATIAL & OKLCH ENGINE
   ========================================================================= */
:root {
  --ok-gold: oklch(0.88 0.22 92);
  --ok-amber: oklch(0.78 0.23 68);
  --ok-crimson: oklch(0.55 0.28 28);
  --ok-glow: oklch(0.92 0.20 95 / 0.85);
  --ok-cyan: oklch(0.85 0.16 210);
  --glass-card: rgba(26, 3, 3, 0.78);
  --glass-border: rgba(255, 215, 0, 0.45);
}

/* 3D Shankh Sonic Shockwave Rings */
.shankh-box {
  position: relative;
}

.shankh-shockwave-ring {
  position: absolute;
  top: 42%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 2.8px solid #ffd700;
  box-shadow: 0 0 20px #00f0ff, 0 0 35px #ffd700, inset 0 0 14px #ff5500;
  pointer-events: none;
  opacity: 0;
  z-index: 10;
}

/* 3D Diya Ambient Room Glow */
.diya-ambient-light {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: radial-gradient(circle at 50% 45%, rgba(255, 185, 0, 0.28) 0%, rgba(255, 100, 0, 0.12) 42%, transparent 72%);
  pointer-events: none;
  opacity: 0;
  transition: opacity 1.2s ease-in-out;
  z-index: 2;
}

.diya-ambient-active {
  opacity: 1;
  animation: ambientFlicker 3s infinite alternate ease-in-out;
}

@keyframes ambientFlicker {
  0% { opacity: 0.75; transform: scale(0.99); filter: brightness(0.95); }
  50% { opacity: 1; transform: scale(1.02); filter: brightness(1.1); }
  100% { opacity: 0.82; transform: scale(1); filter: brightness(1); }
}

/* 3D Aarti Halo Glow Effect */
.aarti-halo-active {
  filter: drop-shadow(0 0 35px #ffd700) drop-shadow(0 0 65px #ff5500) brightness(1.3) !important;
}

/* Glassmorphism 2.0 Card Polish */
.sacred-player-card, .countdown-card, .greeting-form-card, #formBox, .shayari-box {
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border: 1.5px solid rgba(255, 215, 0, 0.45);
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.65), 0 0 20px rgba(255, 215, 0, 0.18), inset 0 0 15px rgba(255, 215, 0, 0.08);
}


/* =========================================================================
   ✨ 2026 ULTRA-SMOOTH LAZY-LOAD & SCROLL-REVEAL ANIMATION ENGINE
   ========================================================================= */
.lazy-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.5s ease-out,
              transform 0.5s ease-out;
  position: relative;
}

.lazy-reveal.reveal-zoom {
  transform: scale(0.94);
}

.lazy-reveal.reveal-left {
  transform: translateX(-24px);
}

.lazy-reveal.reveal-right {
  transform: translateX(24px);
}

/* Revealed State */
.lazy-reveal.is-revealed {
  opacity: 1 !important;
  transform: translateY(0) translateX(0) scale(1) !important;
}

/* Stagger Delays for Sequential Elements */
.lazy-delay-1 { transition-delay: 0.1s; }
.lazy-delay-2 { transition-delay: 0.2s; }
.lazy-delay-3 { transition-delay: 0.3s; }
.lazy-delay-4 { transition-delay: 0.4s; }
.lazy-delay-5 { transition-delay: 0.5s; }

/* Golden Entrance Light Pulse on Reveal */
.is-revealed.with-shimmer::after {
  content: '';
  position: absolute;
  top: 0;
  left: -120%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.25), transparent);
  transform: skewX(-25deg);
  pointer-events: none;
  animation: lazyShimmer 1.2s ease-out forwards;
}

@keyframes lazyShimmer {
  100% { left: 160%; }
}

/* Smooth Image Fade-In when loaded */
img.lazy-img {
  opacity: 0;
  transition: opacity 0.6s ease-in-out;
}
img.lazy-img.loaded {
  opacity: 1;
}


/* Real Aarti Light Illumination on Maa Durga's Frame */
.durga-illuminated-by-aarti {
  animation: aartiGlowOnDurga 1.8s infinite alternate ease-in-out !important;
  box-shadow: 0 0 55px rgba(255, 215, 0, 0.95), 0 0 95px rgba(255, 100, 0, 0.85), inset 0 0 35px rgba(255, 235, 59, 0.85) !important;
  transform: scale(1.03) !important;
  transition: all 0.5s ease;
}

@keyframes aartiGlowOnDurga {
  0% { filter: brightness(1.15) drop-shadow(0 0 25px #ffd700); }
  50% { filter: brightness(1.35) drop-shadow(0 0 45px #ff6600) drop-shadow(0 0 75px #ffd700); }
  100% { filter: brightness(1.22) drop-shadow(0 0 30px #ffea00); }
}


/* =========================================================================
   🛕 GRAND MAA DURGA MANDIR ARCHITECTURE (2026 ROYAL TEMPLE SANCTUM)
   ========================================================================= */
.temple-facade {
  position: relative;
  max-width: 440px;
  margin: 18px auto 24px;
  background: radial-gradient(circle at 50% 35%, rgba(55, 6, 6, 0.95) 0%, rgba(20, 2, 2, 0.98) 100%);
  border: 2px solid var(--accent-gold);
  border-radius: 28px 28px 18px 18px;
  box-shadow: 0 12px 45px rgba(0, 0, 0, 0.85), 0 0 35px rgba(255, 215, 0, 0.35), inset 0 0 25px rgba(255, 140, 0, 0.2);
  padding: 12px 8px 14px;
  overflow: visible;
}

/* A. Temple Shikhar & Saffron Flag */
.temple-shikhar-container {
  position: relative;
  text-align: center;
  margin-top: -36px;
  margin-bottom: 6px;
  z-index: 10;
}

.temple-flag-pole {
  position: relative;
  display: inline-block;
  height: 38px;
  width: 4px;
  background: linear-gradient(180deg, #ffd700, #b45309);
  border-radius: 2px;
}

.temple-saffron-flag {
  position: absolute;
  top: 0;
  left: 3px;
  width: 38px;
  height: 24px;
  background: linear-gradient(135deg, #ff5100, #ff8800);
  clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
  transform-origin: left center;
  animation: flagWave 2.2s infinite ease-in-out;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 8px rgba(255, 80, 0, 0.5);
}

.flag-trishul {
  font-size: 11px;
  color: #ffe600;
  margin-left: 3px;
  text-shadow: 0 0 4px #000;
}

@keyframes flagWave {
  0% { transform: rotate(0deg) skewY(0deg) scaleX(1); }
  25% { transform: rotate(5deg) skewY(4deg) scaleX(0.96); }
  50% { transform: rotate(-3deg) skewY(-3deg) scaleX(1.04); }
  75% { transform: rotate(4deg) skewY(2deg) scaleX(0.98); }
  100% { transform: rotate(0deg) skewY(0deg) scaleX(1); }
}

.temple-swarna-kalash {
  position: relative;
  margin: -6px auto 4px;
  display: inline-block;
  cursor: pointer;
  filter: drop-shadow(0 0 12px #ffd700);
}

.kalash-coconut {
  font-size: 19px;
  line-height: 1;
  position: relative;
  top: 4px;
}

.kalash-pot {
  width: 32px;
  height: 18px;
  background: radial-gradient(circle at 40% 30%, #fff275 0%, #ffd700 50%, #b45309 100%);
  border-radius: 50% 50% 40% 40%;
  border: 1.5px solid #fff;
  box-shadow: 0 0 14px rgba(255, 215, 0, 0.8);
  margin: 0 auto;
}

.temple-shikhar-steps {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  margin-top: 2px;
}

.temple-shikhar-steps span:nth-child(1) { width: 50px; height: 4px; background: linear-gradient(90deg, #ffd700, #ff8c00, #ffd700); border-radius: 2px; }
.temple-shikhar-steps span:nth-child(2) { width: 85px; height: 5px; background: linear-gradient(90deg, #f59e0b, #ffd700, #f59e0b); border-radius: 2px; }
.temple-shikhar-steps span:nth-child(3) { width: 130px; height: 5px; background: linear-gradient(90deg, #b45309, #ffd700, #b45309); border-radius: 3px; }

/* B. Temple Mehraab & Marigold Toran */
.temple-mehraab-arch {
  position: relative;
  padding: 6px 10px;
  border-top: 2px solid #ffd700;
  border-radius: 18px 18px 0 0;
  background: linear-gradient(180deg, rgba(255, 215, 0, 0.18) 0%, transparent 100%);
}

.toran-garland {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 2px 0 6px;
  animation: toranSway 3.5s infinite alternate ease-in-out;
}

.toran-item {
  font-size: 15px;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.6));
}

@keyframes toranSway {
  0% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(2px) rotate(1.5deg); }
  100% { transform: translateY(0px) rotate(-1.5deg); }
}

/* C. Temple Inner Sanctum Layout */
.temple-inner-sanctum {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 8px;
  position: relative;
  padding: 0 4px;
}

/* Marble & Brass Pillars */
.temple-pillar {
  width: 38px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.pillar-capital {
  width: 36px;
  height: 12px;
  background: linear-gradient(135deg, #ffd700, #b45309);
  border-radius: 4px;
  border: 1px solid #ffe600;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

.pillar-shaft {
  flex: 1;
  width: 22px;
  background: linear-gradient(90deg, #d97706 0%, #fff 25%, #fef3c7 50%, #f59e0b 75%, #b45309 100%);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5), 0 0 10px rgba(255, 215, 0, 0.3);
  border-radius: 2px;
  min-height: 200px;
}

.pillar-base {
  width: 36px;
  height: 14px;
  background: linear-gradient(135deg, #b45309, #ffd700);
  border-radius: 4px;
  border: 1px solid #ffe600;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.7);
}

/* Hanging Brass Bells on Pillars */
.hanging-bell-assembly {
  position: absolute;
  top: 35px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  z-index: 15;
  transition: transform 0.2s ease;
}

.bell-chain {
  width: 2px;
  height: 28px;
  background: repeating-linear-gradient(180deg, #ffd700 0px, #ffd700 3px, #b45309 3px, #b45309 6px);
  box-shadow: 0 0 4px #ffd700;
}

.hanging-brass-bell {
  font-size: 24px;
  line-height: 1;
  filter: drop-shadow(0 4px 10px rgba(255, 215, 0, 0.8));
  transform-origin: top center;
  animation: bellGentleSway 3s infinite alternate ease-in-out;
}

@keyframes bellGentleSway {
  0% { transform: rotate(4deg); }
  50% { transform: rotate(-4deg); }
  100% { transform: rotate(3deg); }
}

/* Garbhagriha Core */
.garbhagriha-core {
  flex: 1;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.incense-smoke-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 8;
}

/* Divine Sun Halo Glowing from BEHIND Maa Durga */
.divine-sun-halo {
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 250px;
  height: 250px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 235, 59, 0.8) 0%, rgba(255, 152, 0, 0.5) 45%, rgba(255, 87, 34, 0.2) 65%, transparent 75%);
  box-shadow: 0 0 60px rgba(255, 215, 0, 0.9), 0 0 100px rgba(255, 100, 0, 0.6);
  pointer-events: none;
  z-index: 1;
  filter: blur(12px);
  animation: haloPulse 3.5s infinite alternate ease-in-out;
}

@keyframes haloPulse {
  0% { transform: translate(-50%, -50%) scale(0.9); opacity: 0.65; }
  100% { transform: translate(-50%, -50%) scale(1.18); opacity: 0.95; }
}

/* Sanctum Floor Altar with Akhand Diyas & Lotus Rangoli */
.sanctum-floor-altar {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  max-width: 280px;
  margin-top: -6px;
  padding: 6px 12px;
  background: radial-gradient(ellipse at 50% 50%, rgba(255, 215, 0, 0.22) 0%, transparent 70%);
  border-bottom: 2px solid rgba(255, 215, 0, 0.5);
  border-radius: 0 0 16px 16px;
  z-index: 5;
}

.floor-diya {
  font-size: 22px;
  cursor: pointer;
  filter: drop-shadow(0 0 12px #ff8800) brightness(1.2);
  animation: diyaShimmer 2s infinite alternate ease-in-out;
}

@keyframes diyaShimmer {
  0% { transform: scale(1); filter: drop-shadow(0 0 8px #ff7700); }
  100% { transform: scale(1.1); filter: drop-shadow(0 0 18px #ffcc00); }
}

.floor-rangoli-center {
  font-size: 26px;
  filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.8));
  animation: rangoliGleam 4s infinite alternate ease-in-out;
}

@keyframes rangoliGleam {
  0% { transform: rotate(0deg) scale(0.96); opacity: 0.85; }
  100% { transform: rotate(180deg) scale(1.06); opacity: 1; }
}


/* =========================================================================
   📖 NAVDURGA 9-AVATAR SACRED CORRIDOR STYLING
   ========================================================================= */
.navdurga-corridor-card {
  background: radial-gradient(circle at 50% 20%, rgba(35, 4, 4, 0.9) 0%, rgba(15, 2, 2, 0.95) 100%);
  border: 1.8px solid var(--accent-gold);
  border-radius: 20px;
  padding: 18px 12px;
  margin: 22px auto 110px auto;
  max-width: 480px;
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.75), 0 0 25px rgba(255, 215, 0, 0.2), inset 0 0 15px rgba(255, 140, 0, 0.15);
}

.corridor-header {
  text-align: center;
  margin-bottom: 15px;
}

.corridor-trishul {
  font-size: 22px;
  color: #ffe600;
  display: block;
  margin-bottom: 2px;
  filter: drop-shadow(0 0 8px #ff4500);
}

.corridor-title {
  color: #ffe600;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 1px;
  margin: 0;
  text-shadow: 0 0 10px rgba(255, 215, 0, 0.8), 1px 1px 2px #000;
}

.corridor-subtitle {
  color: #ffd8a8;
  font-size: 12.5px;
  margin-top: 4px;
}

.navdurga-scroll-container {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 10px 4px 14px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.navdurga-scroll-container::-webkit-scrollbar {
  height: 5px;
}
.navdurga-scroll-container::-webkit-scrollbar-thumb {
  background: var(--accent-gold);
  border-radius: 10px;
}

.navdurga-card {
  flex: 0 0 160px;
  scroll-snap-align: center;
  background: rgba(45, 6, 6, 0.75);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1.5px solid rgba(255, 215, 0, 0.45);
  border-radius: 16px;
  padding: 12px 10px;
  text-align: center;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.5);
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  position: relative;
}

.navdurga-card:hover {
  transform: translateY(-5px) scale(1.04);
  border-color: #ffd700;
  box-shadow: 0 10px 25px rgba(255, 215, 0, 0.4);
}

.navdurga-badge {
  font-size: 10.5px;
  font-weight: 800;
  background: rgba(180, 10, 10, 0.85);
  border: 1px solid #ffd700;
  color: #ffe600;
  border-radius: 12px;
  padding: 2px 8px;
  display: inline-block;
  margin-bottom: 6px;
}

.navdurga-emblem {
  font-size: 28px;
  line-height: 1;
  margin: 4px 0;
  filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.6));
}

.navdurga-name {
  font-family: var(--font-divine-title);
  color: #fff9e6;
  font-size: 15.5px;
  font-weight: 800;
  margin-bottom: 6px;
  letter-spacing: 0.5px;
  text-shadow: 0 0 8px rgba(255, 215, 0, 0.6), 0 2px 4px rgba(0, 0, 0, 0.9);
}

.navdurga-mantra {
  font-family: var(--font-clean-hindi);
  font-size: 11.5px;
  color: #fef08a;
  line-height: 1.45;
  margin-bottom: 8px;
  font-style: normal;
  font-weight: 500;
  min-height: 40px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
}

.navdurga-blessing {
  font-family: var(--font-clean-hindi);
  font-size: 11px;
  color: #dcfce7;
  font-weight: 700;
  background: rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(34, 197, 94, 0.3);
  border-radius: 8px;
  padding: 5px 6px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
}


/* Ensure Aarti Thali is properly layered inside sanctum */
.devotional-strip {
  position: relative;
  z-index: 15;
}
#aartiWrapper {
  position: relative;
  z-index: 18;
}
#aartiThaliImg {
  position: relative;
  z-index: 20;
}


/* =========================================================================
   🌐 TRI-LINGUAL LANGUAGE SWITCHER & FIRST-TOUCH AUDIO HINT STYLES
   ========================================================================= */
.lang-switcher-capsule {
  display: flex;
  align-items: center;
  gap: 4px;
  background: rgba(30, 4, 4, 0.65);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1.2px solid rgba(255, 215, 0, 0.45);
  border-radius: 20px;
  padding: 3px 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

.lang-pill {
  background: transparent;
  border: none;
  color: #fff9e6;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 7px;
  border-radius: 14px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
}

.lang-pill:hover {
  color: #ffd700;
  transform: scale(1.05);
}

.lang-pill.active {
  background: linear-gradient(135deg, #ffd700, #ff8c00);
  color: #450a0a;
  box-shadow: 0 2px 8px rgba(255, 215, 0, 0.5);
  font-weight: 900;
}

/* Floating Audio Tap Hint */
.audio-tap-hint {
  position: fixed;
  top: 52px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(220, 38, 38, 0.88);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1.5px solid #ffd700;
  border-radius: 25px;
  padding: 6px 16px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.6), 0 0 15px rgba(255, 215, 0, 0.4);
  z-index: 999999;
  cursor: pointer;
  animation: hintPulse 2s infinite alternate ease-in-out;
  transition: opacity 0.5s ease, transform 0.5s ease;
  white-space: nowrap;
}

.audio-tap-hint.hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) translateY(-15px);
}

@keyframes hintPulse {
  0% { transform: translateX(-50%) scale(0.98); box-shadow: 0 4px 14px rgba(255, 215, 0, 0.3); }
  100% { transform: translateX(-50%) scale(1.03); box-shadow: 0 6px 25px rgba(255, 215, 0, 0.8); }
}

.audio-hint-icon {
  font-size: 14px;
}


/* =========================================================================
   🕉️ SANATANI SACRED OM (ॐ) FULL-BACKGROUND AMBIENT PATTERN
   ========================================================================= */
.sanatani-om-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: 
    radial-gradient(circle at 50% 25%, rgba(255, 140, 0, 0.25) 0%, rgba(220, 20, 20, 0.12) 45%, transparent 80%),
    url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22140%22%20height%3D%22140%22%20viewBox%3D%220%200%20140%20140%22%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3CradialGradient%20id%3D%22omGlow%22%20cx%3D%2250%25%22%20cy%3D%2250%25%22%20r%3D%2250%25%22%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23ffd700%22%20stop-opacity%3D%220.35%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%2245%25%22%20stop-color%3D%22%23ff9900%22%20stop-opacity%3D%220.22%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%2285%25%22%20stop-color%3D%22%23ff3300%22%20stop-opacity%3D%220.08%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23800000%22%20stop-opacity%3D%220%22%2F%3E%0A%20%20%20%20%3C%2FradialGradient%3E%0A%20%20%20%20%3Cfilter%20id%3D%22goldGlow%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%0A%20%20%20%20%20%20%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22blur%22%2F%3E%0A%20%20%20%20%20%20%3CfeComposite%20in%3D%22SourceGraphic%22%20in2%3D%22blur%22%20operator%3D%22over%22%2F%3E%0A%20%20%20%20%3C%2Ffilter%3E%0A%20%20%3C%2Fdefs%3E%0A%0A%20%20%3C!--%20Divine%20Aura%20Circle%20--%3E%0A%20%20%3Ccircle%20cx%3D%2270%22%20cy%3D%2270%22%20r%3D%2258%22%20fill%3D%22url(%23omGlow)%22%2F%3E%0A%20%20%0A%20%20%3C!--%20Sacred%20Geometric%20Mandala%20Rings%20--%3E%0A%20%20%3Ccircle%20cx%3D%2270%22%20cy%3D%2270%22%20r%3D%2262%22%20fill%3D%22none%22%20stroke%3D%22rgba(255%2C%20215%2C%200%2C%200.22)%22%20stroke-width%3D%221.2%22%20stroke-dasharray%3D%224%2C4%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2270%22%20cy%3D%2270%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22rgba(255%2C%20170%2C%200%2C%200.18)%22%20stroke-width%3D%220.8%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2270%22%20cy%3D%2270%22%20r%3D%2242%22%20fill%3D%22none%22%20stroke%3D%22rgba(255%2C%20230%2C%20100%2C%200.12)%22%20stroke-width%3D%220.6%22%20stroke-dasharray%3D%222%2C3%22%2F%3E%0A%0A%20%20%3C!--%208%20Divine%20Petal%20Accents%20around%20Om%20--%3E%0A%20%20%3Ccircle%20cx%3D%2270%22%20cy%3D%2224%22%20r%3D%222.2%22%20fill%3D%22rgba(255%2C%20215%2C%200%2C%200.4)%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2270%22%20cy%3D%22116%22%20r%3D%222.2%22%20fill%3D%22rgba(255%2C%20215%2C%200%2C%200.4)%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2224%22%20cy%3D%2270%22%20r%3D%222.2%22%20fill%3D%22rgba(255%2C%20215%2C%200%2C%200.4)%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22116%22%20cy%3D%2270%22%20r%3D%222.2%22%20fill%3D%22rgba(255%2C%20215%2C%200%2C%200.4)%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2237%22%20cy%3D%2237%22%20r%3D%221.8%22%20fill%3D%22rgba(255%2C%20180%2C%200%2C%200.3)%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22103%22%20cy%3D%2237%22%20r%3D%221.8%22%20fill%3D%22rgba(255%2C%20180%2C%200%2C%200.3)%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2237%22%20cy%3D%22103%22%20r%3D%221.8%22%20fill%3D%22rgba(255%2C%20180%2C%200%2C%200.3)%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22103%22%20cy%3D%22103%22%20r%3D%221.8%22%20fill%3D%22rgba(255%2C%20180%2C%200%2C%200.3)%22%2F%3E%0A%0A%20%20%3C!--%20Central%20Sacred%20Om%20(%E0%A5%90)%20--%3E%0A%20%20%3Ctext%20x%3D%2270%22%20y%3D%2286%22%20font-size%3D%2250%22%20font-family%3D%22'Yatra%20One'%2C%20'Nirmala%20UI'%2C%20'Mangal'%2C%20'Segoe%20UI%20Symbol'%2C%20'Devanagari%20Sangam%20MN'%2C%20sans-serif%22%20fill%3D%22%23ffd700%22%20fill-opacity%3D%220.32%22%20stroke%3D%22rgba(255%2C%20235%2C%20120%2C%200.35)%22%20stroke-width%3D%220.8%22%20text-anchor%3D%22middle%22%20font-weight%3D%22900%22%20filter%3D%22url(%23goldGlow)%22%3E%E0%A5%90%3C%2Ftext%3E%0A%0A%20%20%3C!--%20Corner%20Sacred%20Symbols%20--%3E%0A%20%20%3C!--%20Top%20Corners%3A%20Trishul%20(%F0%9F%94%B1)%20--%3E%0A%20%20%3Ctext%20x%3D%2214%22%20y%3D%2224%22%20font-size%3D%2214%22%20fill%3D%22%23ffa726%22%20fill-opacity%3D%220.28%22%20text-anchor%3D%22middle%22%3E%F0%9F%94%B1%3C%2Ftext%3E%0A%20%20%3Ctext%20x%3D%22126%22%20y%3D%2224%22%20font-size%3D%2214%22%20fill%3D%22%23ffa726%22%20fill-opacity%3D%220.28%22%20text-anchor%3D%22middle%22%3E%F0%9F%94%B1%3C%2Ftext%3E%0A%20%20%3C!--%20Bottom%20Corners%3A%20Swastika%20(%E5%8D%90)%20--%3E%0A%20%20%3Ctext%20x%3D%2214%22%20y%3D%22130%22%20font-size%3D%2214%22%20fill%3D%22%23ffb74d%22%20fill-opacity%3D%220.28%22%20text-anchor%3D%22middle%22%20font-family%3D%22'Yatra%20One'%2C%20'Nirmala%20UI'%2C%20sans-serif%22%20font-weight%3D%22bold%22%3E%E5%8D%90%3C%2Ftext%3E%0A%20%20%3Ctext%20x%3D%22126%22%20y%3D%22130%22%20font-size%3D%2214%22%20fill%3D%22%23ffb74d%22%20fill-opacity%3D%220.28%22%20text-anchor%3D%22middle%22%20font-family%3D%22'Yatra%20One'%2C%20'Nirmala%20UI'%2C%20sans-serif%22%20font-weight%3D%22bold%22%3E%E5%8D%90%3C%2Ftext%3E%0A%3C%2Fsvg%3E");
  background-repeat: repeat;
  background-size: auto, 140px 140px;
  background-position: center center;
  pointer-events: none;
  z-index: 0;
  opacity: 1;
  animation: omPatternGlow 8s infinite alternate ease-in-out;
}

@keyframes omPatternGlow {
  0% { 
    opacity: 0.88; 
    filter: brightness(0.95); 
  }
  50% { 
    opacity: 1; 
    filter: brightness(1.2) drop-shadow(0 0 12px rgba(255, 215, 0, 0.35)); 
  }
  100% { 
    opacity: 0.92; 
    filter: brightness(1.05); 
  }
}

/* Giant Sacred Center Om Watermark with Divine Breathing Halo */
.sanatani-om-watermark {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: clamp(260px, 45vw, 540px);
  font-family: 'Yatra One', 'Nirmala UI', 'Cinzel', serif;
  color: rgba(255, 215, 0, 0.085);
  text-shadow: 
    0 0 50px rgba(255, 160, 0, 0.4),
    0 0 100px rgba(255, 215, 0, 0.25),
    0 0 160px rgba(230, 40, 0, 0.2);
  pointer-events: none;
  z-index: 0;
  user-select: none;
  animation: omSacredPulse 7s infinite alternate ease-in-out;
  line-height: 1;
}

@keyframes omSacredPulse {
  0% { 
    transform: translate(-50%, -50%) scale(0.95) rotate(-1deg); 
    opacity: 0.75; 
    text-shadow: 0 0 60px rgba(255, 140, 0, 0.35), 0 0 120px rgba(255, 215, 0, 0.2);
  }
  100% { 
    transform: translate(-50%, -50%) scale(1.05) rotate(1deg); 
    opacity: 1; 
    text-shadow: 0 0 90px rgba(255, 215, 0, 0.5), 0 0 160px rgba(255, 60, 0, 0.35);
  }
}
