:root{--bg: #1a140e;--gold: #e8b85a;--cream: #fbf3e4;--cream-dim: rgba(251, 243, 228, .66);--serif: "Cormorant Garamond", Georgia, serif;--dev: "Tiro Devanagari Marathi", "Kohinoor Devanagari", serif;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--cream);font-family:var(--serif);overscroll-behavior:none;-webkit-user-select:none;user-select:none}#c{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}.dev{font-family:var(--dev)}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:focus-visible{outline:1px solid var(--gold);outline-offset:3px;border-radius:10px}.top{position:fixed;top:0;left:0;right:0;padding:calc(env(safe-area-inset-top) + 14px) 18px 34px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to bottom,#1a140eb3,#1a140e00);pointer-events:none;transition:opacity .8s ease}.top>*{pointer-events:auto}.brand{display:flex;align-items:baseline;gap:10px}.brand .dev{font-size:20px;color:var(--gold)}.brand .en{font-size:15px;letter-spacing:.18em;text-transform:uppercase;color:var(--cream-dim)}.icon-btn{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(232,184,90,.35);background:#1a140e59}.icon-btn svg{width:20px;height:20px;fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.icon-btn .mute,.icon-btn.off .wave{display:none}.icon-btn.off .mute{display:inline}.stop{position:fixed;top:calc(env(safe-area-inset-top) + 14px);right:18px}.cta{position:fixed;left:0;right:0;bottom:0;padding:60px 16px calc(env(safe-area-inset-bottom) + 26px);text-align:center;background:linear-gradient(to top,#1a140ed9 45%,#1a140e00);transition:opacity .6s ease,transform .6s ease}.cta .note{margin:12px 0 0;font-style:italic;font-size:17px;color:var(--cream-dim)}body.singing .cta{opacity:0;transform:translateY(16px);pointer-events:none}body.singing .top{opacity:0;pointer-events:none}.karaoke{position:fixed;left:0;right:0;bottom:0;padding:90px 18px calc(env(safe-area-inset-bottom) + 22px);text-align:center;background:linear-gradient(to top,#120d09f0 55%,#120d0900);pointer-events:none;opacity:0;transform:translateY(14px);transition:opacity .9s ease,transform .9s ease}body.singing .karaoke{opacity:1;transform:none}.karaoke p{margin:0}.karaoke .title{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}.karaoke .title .dev{font-size:16px;letter-spacing:0;text-transform:none;margin-right:10px}.karaoke .now{min-height:96px;transition:opacity .35s ease}.karaoke .now.swap{opacity:0}.karaoke .dev-line{font-family:var(--dev);font-size:clamp(21px,6.2vw,34px);line-height:1.45}.karaoke .dev-line .w{--p: 0;background:linear-gradient(90deg,var(--gold) calc(var(--p) * 100%),rgba(251,243,228,.5) calc(var(--p) * 100%));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;padding:.4em .03em .2em}.karaoke .dev-line .w.sung{filter:drop-shadow(0 0 10px rgba(232,184,90,.35))}.karaoke .tr-line{font-style:italic;font-size:17px;color:var(--cream-dim);margin-top:4px}.karaoke .next{font-size:18px;color:#fbf3e452;margin-top:14px;min-height:27px}.karaoke .progress{height:2px;background:#fbf3e41f;margin:18px auto 0;max-width:320px;border-radius:2px;overflow:hidden}.karaoke .progress span{display:block;height:100%;width:0;background:var(--gold)}.intro,.finale{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;background:radial-gradient(ellipse at 50% 45%,#1e160e99,#0e0a07f2 70%);transition:opacity 1.4s ease}.intro.gone,.finale.gone{opacity:0;pointer-events:none}.intro .greet{font-size:22px;color:var(--gold);margin:0 0 6px}.intro h1,.finale h2{font-weight:500;font-size:clamp(30px,8vw,44px);margin:0;line-height:1.1}.intro .sub{max-width:30ch;color:var(--cream-dim);font-size:18px;line-height:1.45;margin:14px 0 30px}.primary,.ghost{font-size:18px;letter-spacing:.08em;padding:14px 34px;border-radius:999px;border:1px solid var(--gold);color:var(--cream);background:linear-gradient(180deg,#e8b85a4d,#e8b85a1a);box-shadow:0 0 24px #e8b85a40}.ghost{background:none;box-shadow:none;margin-top:26px}.finale{background:radial-gradient(ellipse at 50% 45%,#120d09bf,#0c0906eb 75%)}.finale .big{font-size:20px;line-height:1.5;color:var(--gold);margin:0 0 14px;max-width:26ch}.finale .streak{color:var(--cream-dim);font-size:18px;margin:12px 0 0}
