Kalletlamadhav/sql_optimized_env_new
0
1<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="/_next/static/css/92cf7c11314a092f.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-3779031bac69e6d0.js"/><script src="/_next/static/chunks/fd9d1056-7fd20a574bd932f0.js" async=""></script><script src="/_next/static/chunks/117-9200107e6f00cd77.js" async=""></script><script src="/_next/static/chunks/main-app-239fcfbb05c85c5b.js" async=""></script><script src="/_next/static/chunks/121-70000e607868547b.js" async=""></script><script src="/_next/static/chunks/360-553f4a8d7a4ddb68.js" async=""></script><script src="/_next/static/chunks/app/page-b9a559ec01947246.js" async=""></script><script src="/_next/static/chunks/app/error-ef7ed99ebc851302.js" async=""></script><title>SQL Optimization RL Environment</title><meta name="description" content="Meta x PyTorch OpenEnv Hackathon 2026 — Train AI agents to optimize SQL queries"/><link rel="icon" href="/favicon.ico" type="image/x-icon" sizes="16x16"/><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body class="__className_f367f3" style="background:#0A0B1A;margin:0"><main class="min-h-screen flex flex-col" style="background:var(--bg-primary)"><nav class="flex items-center justify-between px-8 py-4" style="border-bottom:1px solid var(--border-subtle)"><div class="flex items-center gap-3"><div class="w-8 h-8 rounded-lg flex items-center justify-center text-sm font-bold" style="background:linear-gradient(135deg, #4A90D9, #00D4FF);color:#fff">SQL</div><span class="font-bold text-sm tracking-wide" style="color:var(--text-primary)">SQL Optimization Curriculum</span></div><div class="flex items-center gap-4"><div class="flex items-center gap-2"><div class="w-2 h-2 rounded-full" style="background-color:#FFD740;box-shadow:none"></div><span class="text-xs" style="color:var(--text-muted)">Checking backend...</span></div><span class="text-xs px-2 py-1 rounded" style="background:var(--bg-card);color:var(--text-muted);border:1px solid var(--border-subtle)">Episode: <!-- -->0</span><span class="text-xs px-2 py-1 rounded" style="background:var(--bg-card);color:var(--text-muted);border:1px solid var(--border-subtle)">Level: <!-- -->1</span></div></nav><div class="px-8 py-3" style="border-bottom:1px solid var(--border-subtle);background:var(--bg-panel)"><span class="text-xs" style="color:var(--text-muted)">Recent episode scores</span><div class="flex items-center justify-between relative mt-3"><div class="absolute top-6 left-6 right-6 h-0.5" style="background:var(--border-subtle)"></div><div class="absolute top-6 left-6 h-0.5" style="background:linear-gradient(90deg, #4A90D9, #00D4FF);width:0px"></div><div class="flex flex-col items-center gap-2" style="opacity:0;transform:translateY(10px)"><div class="relative w-12 h-12 rounded-full flex items-center justify-center text-sm font-bold border-2 cursor-default" style="background-color:#4A90D9;border-color:#00D4FF;color:#FFFFFF;box-shadow:0 0 18px #4A90D940">L<!-- -->1<div class="absolute inset-0 rounded-full border-2 border-cyan-400" style="opacity:0.7;transform:none"></div></div><span class="text-xs" style="color:#8892A4">Intro</span></div><div class="flex flex-col items-center gap-2" style="opacity:0;transform:translateY(10px)"><div class="relative w-12 h-12 rounded-full flex items-center justify-center text-sm font-bold border-2 cursor-default" style="background-color:#1E2140;border-color:#2A3050;color:#4A5568;box-shadow:none">L<!-- -->2</div><span class="text-xs" style="color:#4A5568">Easy</span></div><div class="flex flex-col items-center gap-2" style="opacity:0;transform:translateY(10px)"><div class="relative w-12 h-12 rounded-full flex items-center justify-center text-sm font-bold border-2 cursor-default" style="background-color:#1E2140;border-color:#2A3050;color:#4A5568;box-shadow:none">L<!-- -->3</div><span class="text-xs" style="color:#4A5568">Medium</span></div><div class="flex flex-col items-center gap-2" style="opacity:0;transform:translateY(10px)"><div class="relative w-12 h-12 rounded-full flex items-center justify-center text-sm font-bold border-2 cursor-default" style="background-color:#1E2140;border-color:#2A3050;color:#4A5568;box-shadow:none">L<!-- -->4</div><span class="text-xs" style="color:#4A5568">Hard</span></div><div class="flex flex-col items-center gap-2" style="opacity:0;transform:translateY(10px)"><div class="relative w-12 h-12 rounded-full flex items-center justify-center text-sm font-bold border-2 cursor-default" style="background-color:#1E2140;border-color:#2A3050;color:#4A5568;box-shadow:none">L<!-- -->5</div><span class="text-xs" style="color:#4A5568">Expert</span></div></div></div><div class="flex-1 flex items-center justify-center p-8"><div class="w-full max-w-6xl min-h-[520px] relative overflow-hidden rounded-2xl" style="background:radial-gradient(ellipse at 20% 50%, #0F1229 0%, #0A0B1A 100%);border:1px solid #1E2140;box-shadow:0 0 60px #4A90D910, 0 0 120px #4A90D908;opacity:0;transform:translateY(30px)"><svg class="animate-spotlight pointer-events-none absolute z-[1] h-[169%] w-[138%] lg:w-[84%] opacity-0 -top-40 left-0 md:left-60 md:-top-20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3787 2842" fill="none"><g filter="url(#filter)"><ellipse cx="1924.71" cy="273.501" rx="1924.71" ry="273.501" transform="matrix(-0.822377 -0.568943 -0.568943 0.822377 3631.88 2291.09)" fill="#4A90D9" fill-opacity="0.21"></ellipse></g><defs><filter id="filter" x="0.860352" y="0.838989" width="3785.16" height="2840.26" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="151" result="effect1_foregroundBlur_1065_8"></feGaussianBlur></filter></defs></svg><div class="flex h-full flex-col lg:flex-row"><div class="flex-1 p-10 flex flex-col justify-center"><span class="text-xs font-semibold px-3 py-1 rounded-full w-fit" style="background:#4A90D920;color:#4A90D9">META × PYTORCH OPENENV HACKATHON</span><h1 class="mt-5 text-5xl font-bold" style="background:linear-gradient(135deg, #E8EAF6, #8892A4);-webkit-background-clip:text;-webkit-text-fill-color:transparent">SQL Query Optimization</h1><h2 class="text-2xl mt-2" style="color:#4A90D9">RL Training Environment</h2><p class="mt-4 text-sm max-w-md" style="color:var(--text-muted)">Train AI agents to optimize SQL queries across real datasets.</p><div class="flex flex-wrap gap-4 mt-6"><div class="flex items-center gap-2 px-3 py-1.5 rounded-full border border-slate-700 bg-slate-800/50 text-xs text-slate-300 hover:bg-slate-800 transition-colors cursor-default hover:border-slate-500 hover:scale-105 transform duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-database text-[#4A90D9]" aria-hidden="true"><ellipse cx="12" cy="5" rx="9" ry="3"></ellipse><path d="M3 5V19A9 3 0 0 0 21 19V5"></path><path d="M3 12A9 3 0 0 0 21 12"></path></svg>12 Tasks</div><div class="flex items-center gap-2 px-3 py-1.5 rounded-full border border-slate-700 bg-slate-800/50 text-xs text-slate-300 hover:bg-slate-800 transition-colors cursor-default hover:border-slate-500 hover:scale-105 transform duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chart-no-axes-column text-[#4A90D9]" aria-hidden="true"><path d="M5 21v-6"></path><path d="M12 21V3"></path><path d="M19 21V9"></path></svg>5 Difficulty Levels</div><div class="flex items-center gap-2 px-3 py-1.5 rounded-full border border-slate-700 bg-slate-800/50 text-xs text-slate-300 hover:bg-slate-800 transition-colors cursor-default hover:border-slate-500 hover:scale-105 transform duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-award text-[#4A90D9]" aria-hidden="true"><path d="m15.477 12.89 1.515 8.526a.5.5 0 0 1-.81.47l-3.58-2.687a1 1 0 0 0-1.197 0l-3.586 2.686a.5.5 0 0 1-.81-.469l1.514-8.526"></path><circle cx="12" cy="8" r="6"></circle></svg>5-Dimension Reward</div><div class="flex items-center gap-2 px-3 py-1.5 rounded-full border border-slate-700 bg-slate-800/50 text-xs text-slate-300 hover:bg-slate-800 transition-colors cursor-default hover:border-slate-500 hover:scale-105 transform duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe text-[#4A90D9]" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg>Indian Data Domains</div></div><div class="flex gap-3 mt-8"><a href="/dashboard/"><button class="px-6 py-3 rounded-xl font-bold" style="background:linear-gradient(135deg, #4A90D9, #00D4FF);color:#fff">Open Dashboard →</button></a></div></div><div class="flex-1 min-h-[320px] lg:min-h-full"><div class="w-full h-full min-h-[320px] flex flex-col justify-center gap-8 relative items-center text-xs font-mono select-none"><style>2 @keyframes pulse-red {3 0% { box-shadow: 0 0 0px #FF5252; text-shadow: 0 0 0px #FF5252; }4 50% { box-shadow: 0 0 20px #FF5252; text-shadow: 0 0 10px #FF5252; }5 100% { box-shadow: 0 0 0px #FF5252; text-shadow: 0 0 0px #FF5252; }6 }7 @keyframes flow-line {8 0% { width: 0%; opacity: 1; }9 60% { width: 100%; opacity: 1; }10 100% { width: 100%; opacity: 0; }11 }12 @keyframes fade-in-up {13 0% { opacity: 0; transform: translateY(10px); }14 100% { opacity: 1; transform: translateY(0); }15 }16 @keyframes shrink-bar {17 0%, 20% { width: 100%; }18 40%, 80% { width: var(--target-width); }19 100% { width: 100%; }20 }21 </style><div class="flex w-full max-w-lg justify-between items-center px-4"><div class="flex flex-col items-center gap-2"><div class="w-24 h-24 rounded-2xl flex items-center justify-center border-2 border-[#FF5252] bg-[#FF525215]" style="animation:pulse-red 2s infinite"><div class="text-center"><div class="text-[#FF5252] font-bold text-[10px]">SCAN</div><div class="text-slate-400 mt-1">50.0k</div></div></div><span class="font-bold tracking-widest text-[#FF5252]">SLOW QUERY</span></div><div class="flex flex-col flex-1 items-center justify-center relative px-6"><div class="text-center font-bold text-[#00E676] mb-2" style="animation:fade-in-up 1s ease-out forwards">12.4x faster</div><div class="w-full h-0.5 bg-slate-800 relative rounded-full overflow-hidden"><div class="absolute top-0 left-0 h-full bg-gradient-to-r from-[#FF5252] to-[#00E676]" style="animation:flow-line 2s infinite"></div></div><div class="absolute right-5 top-1/2 -translate-y-1/2 translate-y-3 translate-x-1/2 w-2 h-2 rotate-45 border-t-2 border-r-2 border-[#00E676]"></div></div><div class="flex flex-col items-center gap-2"><div class="w-24 h-24 rounded-2xl flex items-center justify-center border-2 border-[#00E676] bg-[#00E67615]"><div class="text-center"><div class="text-[#00E676] font-bold text-[10px]">INDEX</div><div class="text-slate-400 mt-1">142</div></div></div><span class="font-bold tracking-widest text-[#00E676]">OPTIMIZED</span></div></div><div class="flex w-full max-w-lg gap-6 px-4 mt-4"><div class="flex-1 flex flex-col gap-1"><span class="text-[10px] text-slate-500">ROWS</span><div class="w-full h-1.5 bg-slate-800 rounded-full overflow-hidden relative"><div class="absolute top-0 left-0 h-full rounded-full" style="background-color:#FFD740;--target-width:5%;animation:shrink-bar 4s infinite"></div></div></div><div class="flex-1 flex flex-col gap-1"><span class="text-[10px] text-slate-500">COST</span><div class="w-full h-1.5 bg-slate-800 rounded-full overflow-hidden relative"><div class="absolute top-0 left-0 h-full rounded-full" style="background-color:#4A90D9;--target-width:15%;animation:shrink-bar 4s infinite"></div></div></div><div class="flex-1 flex flex-col gap-1"><span class="text-[10px] text-slate-500">TIME</span><div class="w-full h-1.5 bg-slate-800 rounded-full overflow-hidden relative"><div class="absolute top-0 left-0 h-full rounded-full" style="background-color:#E040FB;--target-width:10%;animation:shrink-bar 4s infinite"></div></div></div></div></div></div></div></div></div><div style="position:fixed;left:16px;bottom:16px;width:200px;height:200px;z-index:50;border-radius:16px;overflow:hidden;box-shadow:0 0 30px #4A90D930;pointer-events:none"><iframe src="https://my.spline.design/miniaturecyborgrobot-9133bd5ccca1c9a405fb5ef1ff2dfd91/" width="100%" height="100%" frameBorder="0" style="pointer-events:auto"></iframe></div></main><script src="/_next/static/chunks/webpack-3779031bac69e6d0.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script><script>self.__next_f.push([1,"1:HL[\"/_next/static/css/92cf7c11314a092f.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"2:I[2846,[],\"\"]\n4:I[9107,[],\"ClientPageRoot\"]\n5:I[1385,[\"121\",\"static/chunks/121-70000e607868547b.js\",\"360\",\"static/chunks/360-553f4a8d7a4ddb68.js\",\"931\",\"static/chunks/app/page-b9a559ec01947246.js\"],\"default\",1]\n6:I[4707,[],\"\"]\n7:I[3490,[\"601\",\"static/chunks/app/error-ef7ed99ebc851302.js\"],\"default\"]\n8:I[6423,[],\"\"]\na:I[1060,[],\"\"]\nb:[]\n"])</script><script>self.__next_f.push([1,"0:[\"$\",\"$L2\",null,{\"buildId\":\"zPeYU-NgI_gUzLnLbujuZ\",\"assetPrefix\":\"\",\"urlParts\":[\"\",\"\"],\"initialTree\":[\"\",{\"children\":[\"__PAGE__\",{}]},\"$undefined\",\"$undefined\",true],\"initialSeedData\":[\"\",{\"children\":[\"__PAGE__\",{},[[\"$L3\",[\"$\",\"$L4\",null,{\"props\":{\"params\":{},\"searchParams\":{}},\"Component\":\"$5\"}],null],null],null]},[[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/92cf7c11314a092f.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"children\":[\"$\",\"body\",null,{\"className\":\"__className_f367f3\",\"style\":{\"background\":\"#0A0B1A\",\"margin\":0},\"children\":[\"$\",\"$L6\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$7\",\"errorStyles\":[],\"errorScripts\":[],\"template\":[\"$\",\"$L8\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":\"404\"}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],\"notFoundStyles\":[]}]}]}]],null],null],\"couldBeIntercepted\":false,\"initialHead\":[null,\"$L9\"],\"globalErrorComponent\":\"$a\",\"missingSlots\":\"$Wb\"}]\n"])</script><script>self.__next_f.push([1,"9:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"1\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"2\",{\"children\":\"SQL Optimization RL Environment\"}],[\"$\",\"meta\",\"3\",{\"name\":\"description\",\"content\":\"Meta x PyTorch OpenEnv Hackathon 2026 — Train AI agents to optimize SQL queries\"}],[\"$\",\"link\",\"4\",{\"rel\":\"icon\",\"href\":\"/favicon.ico\",\"type\":\"image/x-icon\",\"sizes\":\"16x16\"}]]\n3:null\n"])</script></body></html>