:root{--maroon:#4a0d12;--cream:#f6e7bd;--yellow:#ffd60a;--red:#c1121f;--mirror:#d4211c;--mute:#ecd3a4;box-sizing:border-box;color-scheme:dark;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;color:var(--cream);font:500 19px/1.45 'Barlow Condensed',system-ui,sans-serif;background:radial-gradient(700px 420px at 15% 8%,#c98a5a55,transparent),radial-gradient(600px 500px at 95% 45%,#d9a06a40,transparent),radial-gradient(500px 400px at 10% 85%,#b03a2255,transparent),#4a0d12}
.chk{height:22px;background:repeating-conic-gradient(#7a1018 0 25%,#f6e7bd 0 50%) 0 0/22px 22px}
section{max-width:980px;margin:0 auto;padding:64px 22px}
h1,h2{font-family:'Bowlby One',Impact,sans-serif;font-weight:400;color:var(--yellow);text-shadow:4px 4px 0 var(--red);margin:0;line-height:1}
h2{font-size:clamp(30px,6.5vw,56px);margin-bottom:12px}
p{max-width:50ch}
.lede{color:var(--mute);margin:0 0 26px;font-size:21px}
.btn{font:700 19px 'Barlow Condensed',sans-serif;background:var(--yellow);color:#3a0a0e;border:3px solid #3a0a0e;box-shadow:4px 4px 0 var(--red);padding:11px 24px;cursor:pointer}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--red)}
.btn.g{background:var(--cream)}
.btn:focus-visible,summary:focus-visible,canvas:focus-visible,.tk:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.row{display:flex;gap:14px;flex-wrap:wrap}
#hero{text-align:center;display:flex;flex-direction:column;align-items:center;padding-top:0;min-height:92vh}
#hero h1{font-size:clamp(52px,15vw,138px);line-height:.92}
.sub{margin:18px 0 8px;font-size:20px}
.reg{font:800 clamp(20px,4vw,30px)/1.3 'Noto Sans Telugu','Noto Sans Devanagari',sans-serif;color:var(--yellow);margin:14px 0 4px}
.tag{font-size:clamp(24px,4.5vw,34px);font-weight:700;margin:6px 0 14px}
.when{font-size:clamp(20px,3.6vw,26px);font-weight:700;margin:0 0 26px;max-width:none}
.disco{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;margin-bottom:6px}
.disco::before{content:'';position:absolute;left:50%;top:60px;width:min(150vw,820px);aspect-ratio:1;translate:-50% -2%;background:repeating-conic-gradient(#ffd60a26 0 7deg,transparent 7deg 28deg);border-radius:50%;mask:radial-gradient(circle,#000 10%,transparent 68%);-webkit-mask:radial-gradient(circle,#000 10%,transparent 68%);animation:sp 16s linear infinite;pointer-events:none}
@keyframes sp{to{rotate:360deg}}
.str{width:3px;height:70px;background:#d8d0c0}
.ball{position:relative;width:min(36vw,150px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:repeating-linear-gradient(90deg,#d9d9d9 0 8px,#fff 8px 9px,#777 9px 17px,#fff 17px 18px),#bbb;background-blend-mode:normal;animation:tl 2.4s linear infinite;box-shadow:0 0 40px #ffd60a88}
.ball::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 8px,#000a 8px 9px)}
.ball::after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 34% 28%,#fffc,#fff0 30%),radial-gradient(circle,transparent 45%,#000b 100%)}
@keyframes tl{to{background-position-x:36px,0}}
@media(prefers-reduced-motion:reduce){.ball,.disco::before{animation:none}}
details{border-top:3px solid var(--cream);padding:16px 0}
details:last-of-type{border-bottom:3px solid var(--cream)}
summary{font:400 clamp(22px,4.6vw,34px)/1.15 'Bowlby One',sans-serif;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:14px;color:var(--yellow)}
summary::-webkit-details-marker{display:none}
summary::after{content:'+';font-family:'Barlow Condensed';transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin:10px 0 0;color:var(--mute);font-size:21px}
.tabs{display:flex;gap:12px;margin-bottom:22px}
.tabs .btn{opacity:.6}.tabs .btn.on{opacity:1}
.pnl{display:none}.pnl.on{display:block}
.brd{position:relative;width:min(92vw,450px);aspect-ratio:1;margin:0 auto 16px;border:5px solid var(--cream);background:#2a0a0d}
.gr10,.gr15{position:absolute;inset:0;display:grid}
.gr10{grid-template:repeat(10,1fr)/repeat(10,1fr)}
.gr15{grid-template:repeat(15,1fr)/repeat(15,1fr);gap:1px;background:#2a0a0d}
.gr10 div{background:#f6e7bd;color:#6b2a1a;font:700 11px 'Barlow Condensed';padding:2px}
.gr10 div.a{background:#e6c88b}
.gr15 .t{background:var(--cream)}.gr15 .r{background:#e0505a}.gr15 .y{background:#ffd60a}.gr15 .yr{background:#7a1620}.gr15 .yy{background:#8a6a0a}.gr15 .k{background:#3a0a10}.gr15 .ce{background:radial-gradient(circle,#ffd60a,#c1121f)}
.brd svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.tk{position:absolute;width:5.2%;aspect-ratio:1;border-radius:50%;border:2.5px solid #2a0a0d;transform:translate(-50%,-50%);transition:left .14s,top .14s;padding:0}
.tk.gl{animation:pl .7s ease-in-out infinite alternate;cursor:pointer;z-index:2}
@keyframes pl{to{box-shadow:0 0 0 5px #fff}}
#lud .tk{width:6%}
.ctl{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;font-size:22px;font-weight:700}
#mirrorwrap{display:flex;flex-wrap:wrap;gap:36px;align-items:center}
.mtxt{flex:1 1 280px}
.post{position:relative;flex:0 1 380px;width:min(80vw,380px);aspect-ratio:1;margin:0 auto}
.rim{position:absolute;inset:0;border-radius:50%;background:var(--mirror);padding:5.5%;box-shadow:0 0 0 6px #fff1d6 inset,0 20px 60px #d4211c66}
.glass{position:relative;width:100%;height:100%;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 40% 35%,#6b2a3a,#1d0709)}
.glass canvas{width:100%;height:100%;display:block}
.glass::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 45% 30% at 32% 22%,#ffffff66,transparent 70%),radial-gradient(circle,transparent 60%,#00000066)}
#mmsg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:18%;font-size:18px;color:var(--mute);z-index:2}
#range{position:relative;overflow:hidden;background:linear-gradient(#6e1a16,#2a0a0d);border:5px solid var(--cream)}
#cv{display:block;width:100%;height:min(62vh,520px);touch-action:none;cursor:crosshair}
.hud{display:flex;justify-content:space-between;padding:10px 18px;font-weight:700;font-size:22px;color:var(--yellow)}
#ov{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#2a0a0dd9;text-align:center;padding:20px}
#ov h3{font:400 30px 'Bowlby One';color:var(--yellow);text-shadow:3px 3px 0 var(--red);margin:0}
#skyw{position:relative;border:5px solid var(--cream);background:linear-gradient(#12041f,#4a0d12 85%,#a8431f)}
#sky{display:block;width:100%;height:min(68vh,540px);touch-action:manipulation;cursor:pointer}
#hint{position:absolute;left:0;right:0;bottom:16px;text-align:center;font-size:22px;font-weight:700;pointer-events:none}
footer{text-align:center;padding:30px 22px 50px;color:var(--mute)}
