*{box-sizing:border-box;margin:0;padding:0}html,body{font-family:Comic Sans MS,Comic Sans,cursive;background:linear-gradient(135deg,#0f172a,#581c87,#0f172a);min-height:100vh;color:#eaf0ff;line-height:1.6;overflow-x:hidden}.container{width:100%;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}.glass-card{background:linear-gradient(135deg,#ffffff1f,#8b5cf60f);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.15);border-radius:1.25rem;box-shadow:0 10px 30px #0006,inset 0 1px #ffffff14;transition:all .3s cubic-bezier(.4,0,.2,1)}.glass-card:hover{transform:translateY(-2px);box-shadow:0 15px 40px #00000080,inset 0 1px #ffffff1f}.canvas-card{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:1.25rem;padding:2rem}.btn{position:relative;display:inline-flex;align-items:center;gap:.6rem;padding:.75rem 1rem;border-radius:1rem;font-weight:600;color:#eaf0ff;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);transition:transform .15s ease,box-shadow .2s ease,border-color .2s;cursor:pointer;font-size:.875rem;flex:1;min-width:200px;white-space:nowrap;padding:1rem 1.5rem;box-shadow:0 4px 15px #0003,inset 0 1px #ffffff0d}.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px #00000059;border-color:#fff3}.btn-primary{background:linear-gradient(135deg,#4f46e5,#7c3aed 60%,#ec4899);color:#fff;border-color:transparent;box-shadow:0 4px 20px #4f46e566,0 2px 10px #7c3aed4d}.btn-primary:hover{box-shadow:0 8px 30px #4f46e580,0 4px 15px #7c3aed66}.btn-secondary{background:#ffffff1f;border-color:#fff3;color:#eaf0ff}.btn-secondary:hover{background:#ffffff2e;border-color:#ffffff4d}.btn-warning{background:linear-gradient(135deg,#fcd34d,#f97316);color:#fff;border-color:transparent;box-shadow:0 4px 20px #fcd34d66,0 2px 10px #f973164d}.btn-warning:hover{box-shadow:0 8px 30px #fcd34d80,0 4px 15px #f9731666}.btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-color:transparent;box-shadow:0 4px 20px #ef444466,0 2px 10px #dc26264d}.btn-danger:hover{box-shadow:0 8px 30px #ef444480,0 4px 15px #dc262666}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.category-card,.algorithm-card,.algorithm-btn{background:#ffffff0f;border:1px solid rgba(255,255,255,.08);border-radius:1rem;color:#eaf0ff;padding:1rem;text-align:center;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;cursor:pointer;min-height:100px;display:flex;flex-direction:column;align-items:center;justify-content:center}.category-card:hover,.algorithm-card:hover,.algorithm-btn:hover{transform:translateY(-2px) scale(1.02);border-color:#ffffff2e}.category-card.active,.algorithm-card.active,.algorithm-btn.active{border-color:#60a5fa;box-shadow:0 8px 28px #60a5fa59,inset 0 0 0 1px #60a5fa80;transform:translateY(-2px) scale(1.02)}.progress-track{height:8px;border-radius:999px;background:#ffffff14;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(135deg,#8b5cf6,#22d3ee 60%,#60a5fa);border-radius:999px;box-shadow:0 0 18px #60a5fa73;transition:width .35s ease}input[type=range].slider{-webkit-appearance:none;width:100%;height:10px;border-radius:999px;background:#ffffff1a;outline:none;cursor:pointer;-moz-appearance:none;appearance:none}input[type=range].slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 0 0 6px #7c3aed59;border:2px solid #8b5cf6;cursor:pointer}input[type=range].speed-slider{-webkit-appearance:none;width:100%;height:8px;background:linear-gradient(to right,#22c55e,#3b82f6);border-radius:999px;outline:none;transition:background .3s ease;-moz-appearance:none;appearance:none}input[type=range].speed-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #8b5cf6;cursor:grab;box-shadow:0 0 0 4px #8b5cf64d;-webkit-transition:box-shadow .2s ease,transform .2s ease;transition:box-shadow .2s ease,transform .2s ease}input[type=range].speed-slider::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.1);box-shadow:0 0 0 6px #8b5cf680}input[type=range].speed-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #8b5cf6;cursor:grab;box-shadow:0 0 0 4px #8b5cf64d;-moz-transition:box-shadow .2s ease,transform .2s ease;transition:box-shadow .2s ease,transform .2s ease}input[type=range].speed-slider::-moz-range-thumb:active{cursor:grabbing;transform:scale(1.1);box-shadow:0 0 0 6px #8b5cf680}.input{padding:.75rem 1rem;border:1px solid rgba(255,255,255,.1);border-radius:.5rem;font-size:.875rem;transition:all .3s cubic-bezier(.4,0,.2,1);background:#ffffff0d;color:#eaf0ff}.input:focus{outline:none;border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa1a}.grid-cell{width:24px;height:24px;border:1px solid rgba(255,255,255,.1);transition:all .2s ease;cursor:pointer}.grid-cell:hover{transform:scale(1.1)}.viz-glow{position:absolute;inset:0;border-radius:24px;background:radial-gradient(60% 50% at 50% 40%,rgba(96,165,250,.15),transparent 60%),radial-gradient(40% 40% at 70% 60%,rgba(139,92,246,.12),transparent 60%);filter:blur(8px);pointer-events:none}.text-white-90{color:#ffffffe6}.text-white-80{color:#fffc}.bg-white-10{background:#ffffff1a}.backdrop-blur-sm{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.gradient-title{background:linear-gradient(135deg,#93c5fd,#67e8f9 45%,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-orb{position:absolute;border-radius:999px;filter:blur(40px);opacity:.6;pointer-events:none}.glass-chip{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:.55rem .9rem;display:inline-flex;align-items:center;gap:.5rem;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.glass-chip:hover{transform:translateY(-1px);border-color:#fff3;box-shadow:0 8px 22px #00000040}.flex{display:flex}.grid{display:grid}.justify-between{justify-content:space-between}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.relative{position:relative}.absolute{position:absolute}.sticky{position:sticky}.overflow-hidden{overflow:hidden}.cursor-pointer{cursor:pointer}.pointer-events-none{pointer-events:none}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}.mb-3{margin-bottom:.75rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mt-6{margin-top:1.5rem}.mt-16{margin-top:4rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.w-4{width:1rem}.w-5{width:1.25rem}.w-full{width:100%}.h-4{height:1rem}.h-5{height:1.25rem}.max-w-2xl{max-width:42rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.text-6xl{font-size:3.75rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.tracking-tight{letter-spacing:-.025em}.drop-shadow{filter:drop-shadow(0 1px 2px rgba(0,0,0,.1)) drop-shadow(0 1px 1px rgba(0,0,0,.06))}.text-white{color:#fff}.opacity-60{opacity:.6}.opacity-80{opacity:.8}.opacity-90{opacity:.9}.bg-green-500{background-color:#10b981}.bg-red-500{background-color:#ef4444}.bg-yellow-400{background-color:#fbbf24}.bg-gray-800{background-color:#1f2937}.bg-blue-200{background-color:#9ac5fe}.bg-white{background-color:#fff}.border{border-width:1px}.border-2{border-width:2px}.border-t{border-top-width:1px}.border-gray-700{border-color:#374151}.border-gray-600{border-color:#4b5563}.border-blue-300{border-color:#93c5fd}.border-yellow-600{border-color:#d97706}.border-white-10{border-color:#ffffff1a}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.inset-0{inset:0}.top-4{top:1rem}.z-10{z-index:10}.z-40{z-index:40}.transition-all{transition:all .3s cubic-bezier(.4,0,.2,1)}.space-y-12>*+*{margin-top:3rem}@media (min-width: 768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:text-6xl{font-size:3.75rem;line-height:1}.md\:p-6{padding:1.5rem}}@media (min-width: 1024px){.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}.text-7xl{font-size:4.5rem;line-height:1}.text-8xl{font-size:6rem;line-height:1}.font-black{font-weight:900}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.text-transparent{color:transparent}.glass-card{background:#ffffff14;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:1.25rem;box-shadow:0 10px 30px #00000059,inset 0 1px #ffffff0f;transition:all .3s cubic-bezier(.4,0,.2,1);color:#fff}.glass-card:hover{transform:translateY(-2px);box-shadow:0 15px 40px #0006,inset 0 1px #ffffff1a}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-slate-900{--tw-gradient-from: #0f172a;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(15, 23, 42, 0))}.via-purple-900{--tw-gradient-to: #581c87;--tw-gradient-stops: var(--tw-gradient-from), #581c87, var(--tw-gradient-to, rgba(88, 28, 135, 0))}.to-slate-900{--tw-gradient-to: #0f172a}.from-white{--tw-gradient-from: #ffffff;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(255, 255, 255, 0))}.via-blue-200{--tw-gradient-to: #bfdbfe;--tw-gradient-stops: var(--tw-gradient-from), #bfdbfe, var(--tw-gradient-to, rgba(191, 219, 254, 0))}.to-purple-300{--tw-gradient-to: #c4b5fd}.to-purple-600{--tw-gradient-to: #9333ea}.via-purple-500{--tw-gradient-to: #a855f7;--tw-gradient-stops: var(--tw-gradient-from), #a855f7, var(--tw-gradient-to, rgba(168, 85, 247, 0))}.from-blue-600{--tw-gradient-from: #2563eb;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(37, 99, 235, 0))}.from-blue-700{--tw-gradient-from: #1d4ed8;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(29, 78, 216, 0))}.to-purple-700{--tw-gradient-to: #7c3aed}.from-green-500{--tw-gradient-from: #10b981;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(16, 185, 129, 0))}.from-cyan-500{--tw-gradient-from: #06b6d4;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(6, 182, 212, 0))}.to-blue-500{--tw-gradient-to: #3b82f6}.from-blue-500\/20{--tw-gradient-from: rgba(59, 130, 246, .2);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(59, 130, 246, 0))}.to-cyan-500\/20{--tw-gradient-to: rgba(6, 182, 212, .2)}.from-purple-500\/20{--tw-gradient-from: rgba(168, 85, 247, .2);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(168, 85, 247, 0))}.to-pink-500\/20{--tw-gradient-to: rgba(236, 72, 153, .2)}.from-cyan-500\/15{--tw-gradient-from: rgba(6, 182, 212, .15);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(6, 182, 212, 0))}.to-blue-500\/15{--tw-gradient-to: rgba(59, 130, 246, .15)}.from-slate-900\/50{--tw-gradient-from: rgba(15, 23, 42, .5);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(15, 23, 42, 0))}.via-transparent{--tw-gradient-to: transparent;--tw-gradient-stops: var(--tw-gradient-from), transparent, var(--tw-gradient-to, rgba(0, 0, 0, 0))}.to-slate-900\/30{--tw-gradient-to: rgba(15, 23, 42, .3)}.text-gray-300{color:#d1d5db}.bg-white\/50{background-color:#ffffff80}.w-16{width:4rem}.h-16{height:4rem}.w-20{width:5rem}.h-20{height:5rem}.w-24{width:6rem}.h-24{height:6rem}.w-32{width:8rem}.h-32{height:8rem}.w-40{width:10rem}.h-40{height:10rem}.w-48{width:12rem}.h-1{height:.25rem}.h-3{height:.75rem}.w-1{width:.25rem}.w-6{width:1.5rem}.top-20{top:5rem}.left-20{left:5rem}.top-40{top:10rem}.right-32{right:8rem}.bottom-32{bottom:8rem}.left-1\/3{left:33.333333%}.bottom-8{bottom:2rem}.left-1\/2{left:50%}.-translate-x-1\/2{transform:translate(-50%)}.mr-4{margin-right:1rem}.-top-2{top:-.5rem}.-right-2{right:-.5rem}.mt-2{margin-top:.5rem}.shadow-2xl{box-shadow:0 25px 50px -12px #00000040}.blur-xl{filter:blur(24px)}.transform{transform:translate(var(--tw-translate-x, 0)) translateY(var(--tw-translate-y, 0)) rotate(var(--tw-rotate, 0)) skew(var(--tw-skew-x, 0)) skewY(var(--tw-skew-y, 0)) scaleX(var(--tw-scale-x, 1)) scaleY(var(--tw-scale-y, 1))}.hover\:from-blue-700:hover{--tw-gradient-from: #1d4ed8;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(29, 78, 216, 0))}.hover\:to-purple-700:hover{--tw-gradient-to: #7c3aed}.group:hover .group-hover\:translate-x-1{transform:translate(.25rem)}.min-h-screen{min-height:100vh}.items-center{align-items:center}.justify-center{justify-content:center}.text-center{text-align:center}.mx-auto{margin-left:auto;margin-right:auto}.mb-4{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.text-white{color:#fff!important}.text-gray-300{color:#d1d5db!important}.glass-card *{color:inherit}.glass-card h3{color:#fff!important}.glass-card p{color:#d1d5db!important}.cta-button{background:linear-gradient(135deg,#2563eb,#9333ea);border:none;outline:none;box-shadow:0 10px 30px #3b82f64d,0 4px 15px #9333ea33;transition:all .3s cubic-bezier(.4,0,.2,1)}.cta-button:hover{box-shadow:0 15px 40px #3b82f666,0 6px 20px #9333ea4d}button{border:none;outline:none;background:none;margin:0;font:inherit;cursor:pointer}button:focus{outline:none;box-shadow:none}button:active{outline:none;box-shadow:none}.py-4{padding-top:1rem;padding-bottom:1rem}.px-8{padding-left:2rem;padding-right:2rem}.group.relative.overflow-hidden{padding:1rem 2rem!important}.py-16{padding-top:4rem;padding-bottom:4rem}.py-20{padding-top:5rem;padding-bottom:5rem}.mb-16{margin-bottom:4rem}.mb-20{margin-bottom:5rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-yellow-400{color:#facc15}.text-red-400{color:#f87171}.text-green-400{color:#4ade80}.text-blue-400{color:#60a5fa}.text-cyan-300{color:#67e8f9}.text-orange-400{color:#fb923c}.text-gray-500{color:#6b7280}.bg-orange-500{background-color:#f97316}.bg-orange-600,.hover\:bg-orange-600:hover{background-color:#ea580c}.xl\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.min-h-140{min-height:140px}.w-10{width:2.5rem}.h-10{height:2.5rem}.w-12{width:3rem}.h-12{height:3rem}.space-y-1>*+*{margin-top:.25rem}.btn-primary{background:linear-gradient(135deg,#3b82f6,#8b5cf6,#d946ef);color:#fff;border:none;border-radius:1rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 20px #3b82f666,0 2px 10px #8b5cf64d}.btn-primary:hover{box-shadow:0 8px 30px #3b82f680,0 4px 15px #8b5cf666}.blur-2xl{filter:blur(40px)}.blur-3xl{filter:blur(64px)}.to-red-500{--tw-gradient-to: #ef4444}.to-emerald-500{--tw-gradient-to: #10b981}.from-blue-500{--tw-gradient-from: #3b82f6;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(59, 130, 246, 0))}.to-cyan-500{--tw-gradient-to: #06b6d4}.from-purple-500{--tw-gradient-from: #a855f7;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(168, 85, 247, 0))}.to-pink-500{--tw-gradient-to: #ec4899}.from-blue-500\/10{--tw-gradient-from: rgba(59, 130, 246, .1);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(59, 130, 246, 0))}.to-purple-500\/10{--tw-gradient-to: rgba(168, 85, 247, .1)}.from-purple-500\/10{--tw-gradient-from: rgba(168, 85, 247, .1);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(168, 85, 247, 0))}.to-pink-500\/10{--tw-gradient-to: rgba(236, 72, 153, .1)}.from-cyan-500\/10{--tw-gradient-from: rgba(6, 182, 212, .1);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(6, 182, 212, 0))}.to-blue-500\/10{--tw-gradient-to: rgba(59, 130, 246, .1)}.border-white\/30{border-color:#ffffff4d}.bg-white\/20{background-color:#fff3}.bg-purple-500\/30{background-color:#a855f74d}.shadow-purple-500\/25{box-shadow:0 10px 15px -3px #a855f740,0 4px 6px -2px #a855f740}@media (min-width: 1280px){.xl\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}.text-purple-400{color:#c084fc}.via-purple-200{--tw-gradient-to: #e9d5ff;--tw-gradient-stops: var(--tw-gradient-from), #e9d5ff, var(--tw-gradient-to, rgba(233, 213, 255, 0))}.to-pink-300{--tw-gradient-to: #f9a8d4}.bg-green-500\/20{background-color:#22c55e33}.bg-orange-500\/20{background-color:#f9731633}.bg-blue-500\/20{background-color:#3b82f633}.from-green-500{--tw-gradient-from: #22c55e;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(34, 197, 94, 0))}.to-emerald-600{--tw-gradient-to: #059669}.from-orange-500{--tw-gradient-from: #f97316;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(249, 115, 22, 0))}.to-yellow-500{--tw-gradient-to: #eab308}.border-dashed{border-style:dashed}.border-white\/20{border-color:#fff3}.space-y-4>*+*{margin-top:1rem}.leading-relaxed{line-height:1.625}.text-6xl{font-size:3.75rem;line-height:1}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.category-card{position:relative;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:1.25rem;text-align:center;cursor:pointer;color:#fff;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .05s ease,box-shadow .05s ease,border-color .05s ease,background .05s ease;box-shadow:0 10px 30px #00000038,inset 0 1px #ffffff0f;min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center}.category-card:hover{transform:translateY(-4px) scale(1.02);border-color:#ffffff38;box-shadow:0 16px 42px #00000047}.category-card.active{background:linear-gradient(135deg,#8b5cf6,#22d3ee 60%,#60a5fa);border-color:transparent;color:#0b1020;box-shadow:0 24px 60px #60a5fa59}.category-icon{width:3rem;height:3rem;border-radius:999px;display:grid;place-items:center;color:#fff;box-shadow:0 8px 24px #00000040,inset 0 1px #ffffff59;margin-bottom:.75rem}.category-icon.blue{background:linear-gradient(135deg,#60a5fa,#7c3aed)}.category-icon.green{background:linear-gradient(135deg,#34d399,#06b6d4)}.category-icon.purple{background:linear-gradient(135deg,#a855f7,#ec4899)}.category-icon.red{background:linear-gradient(135deg,#f59e0b,#ef4444)}.category-card .label{font-weight:700;letter-spacing:.2px}.category-card .desc{font-size:.8125rem;opacity:.82}.category-card.active .category-icon{transform:translateY(-2px) scale(1.04)}.algorithm-card{position:relative;background:#ffffff2e;border:2px solid rgba(255,255,255,.35);border-radius:16px;padding:1.1rem;text-align:center;cursor:pointer;color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:transform .05s ease,box-shadow .05s ease,border-color .05s ease,background .05s ease;box-shadow:0 8px 24px #00000059;min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center}.algorithm-card:hover{background:#ffffff4d;border-color:#fff9;transform:translateY(-4px) scale(1.03);box-shadow:0 16px 40px #00000080}.algorithm-card:focus-visible{outline:none;box-shadow:0 0 0 6px #7c3aed59,0 16px 40px #00000073}.algorithm-card.active{background:linear-gradient(135deg,#60a5fa,#8b5cf6 60%,#ec4899);border:2px solid transparent;color:#0b1020;box-shadow:0 28px 70px #8b5cf659}.algo-icon{width:3rem;height:3rem;border-radius:999px;display:grid;place-items:center;margin-bottom:.65rem;color:#fff;background:linear-gradient(135deg,#67e8f9,#a78bfa);box-shadow:0 8px 24px #00000040,inset 0 1px #ffffff59}.algo-title{font-weight:800;letter-spacing:.2px;font-size:.95rem}.algo-meta{margin-top:.4rem;font-size:.78rem;opacity:.85;background:#ffffff14;border:1px solid rgba(255,255,255,.12);padding:.2rem .55rem;border-radius:999px}.viz-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;margin-bottom:1rem;border-radius:14px;background:linear-gradient(135deg,#1e293be6,#334155d9);border:1px solid rgba(99,102,241,.4);box-shadow:0 10px 24px #0003}.viz-badge{font-size:.75rem;font-weight:600;padding:.25rem .6rem;border-radius:999px;background:#6366f11f;border:1px solid rgba(99,102,241,.28);color:#e2e8f0}.canvas-container{background:linear-gradient(135deg,#1e293b99,#33415599);border-radius:18px;padding:1.25rem;border:1px solid rgba(99,102,241,.2);box-shadow:0 10px 30px #0000004d}.progress-fill{box-shadow:0 0 16px #667eea59}.grid-surface{padding:12px;border-radius:16px;background:linear-gradient(180deg,#ffffffd9,#ffffffa8);border:1px solid rgba(0,0,0,.06);box-shadow:0 10px 24px #00000014}.grid-board{gap:3px;padding:8px;border-radius:12px;background:linear-gradient(135deg,#f3f4f6,#e5e7eb);box-shadow:inset 0 1px #fff,0 10px 20px #0000000f}.cell{width:var(--cell, 22px);height:var(--cell, 22px);border-radius:6px;transition:transform .15s ease,box-shadow .2s ease}.cell:hover{transform:translateY(-1px) scale(1.05);box-shadow:0 8px 12px #00000014}.tree-surface{position:relative;margin:0 auto;border-radius:16px;padding:12px;background:linear-gradient(180deg,#68ff4e,#5ba4fd);border:1px solid rgba(0,0,0,.06);box-shadow:0 10px 24px #00000014}.tree-node{width:50px;height:50px;display:grid;place-items:center;border-radius:999px;font-weight:800;color:#1f2937;background:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 10px 20px #00000014,inset 0 1px #ffffffb3}.tree-node.highlight{outline:6px solid rgba(96,165,250,.35)}.section-shell{position:relative;isolation:isolate}.aurora{position:absolute;inset:-20% -10% -10%;background:radial-gradient(40% 35% at 20% 20%,rgba(99,102,241,.28),transparent 60%),radial-gradient(45% 35% at 80% 25%,rgba(6,182,212,.2),transparent 60%),radial-gradient(30% 45% at 60% 80%,rgba(168,85,247,.22),transparent 60%);filter:blur(30px);opacity:.9;z-index:0;animation:auroraFloat 18s ease-in-out infinite alternate}@keyframes auroraFloat{0%{transform:translateY(-12px) scale(1)}to{transform:translateY(8px) scale(1.03)}}.grid-overlay{position:absolute;inset:0;--c: rgba(255, 255, 255, .06);background:linear-gradient(0deg,var(--c) 1px,transparent 1px) 0 0 / 24px 24px,linear-gradient(90deg,var(--c) 1px,transparent 1px) 0 0 / 24px 24px;-webkit-mask-image:radial-gradient(60% 60% at 50% 40%,#000 60%,transparent 100%);mask-image:radial-gradient(60% 60% at 50% 40%,#000 60%,transparent 100%);opacity:.6;z-index:1}.section-kicker{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;opacity:.8;padding:.35rem .7rem;border-radius:999px;background:#ffffff0f;border:1px solid rgba(255,255,255,.12)}.kicker-sub{opacity:.75;font-size:.95rem}.divider-dot{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#67e8f9,#a78bfa);box-shadow:0 0 0 4px #a78bfa2e}.category-card{position:relative;overflow:hidden}.category-card .card-footer{margin-top:.9rem;opacity:.9}.category-card .pill{font-size:.72rem;font-weight:700;padding:.28rem .6rem;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:#ffffff14}.category-card .ring-ornament{position:absolute;inset:-1px;border-radius:18px;pointer-events:none;background:conic-gradient(from 180deg at 50% 50%,#6366f100,#6366f138,#06b6d438,#ec489938,#6366f100);mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);-webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);padding:1px;opacity:0;transition:opacity .25s ease}.category-card:hover .ring-ornament,.category-card.active .ring-ornament{opacity:1}.algorithm-card{position:relative;overflow:hidden}.algorithm-card .algo-meta-row{display:flex;gap:.5rem;align-items:center;justify-content:center;margin-top:.5rem}.algorithm-card .card-glow{position:absolute;inset:0;border-radius:16px;background:radial-gradient(40% 30% at 50% 0%,rgba(99,102,241,.12),transparent 60%),radial-gradient(35% 25% at 80% 100%,rgba(6,182,212,.1),transparent 60%);filter:blur(10px);opacity:0;transition:opacity .25s ease;pointer-events:none}.algorithm-card:hover .card-glow,.algorithm-card.active .card-glow{opacity:1}.algorithm-card .active-dot{position:absolute;top:10px;right:10px;width:14px;height:14px;border-radius:999px;background:linear-gradient(135deg,#34d399,#10b981);box-shadow:0 0 0 6px #10b9812e,0 0 22px #10b98147}.algorithm-card:focus-visible,.category-card:focus-visible{outline:none;box-shadow:0 0 0 6px #7c3aed59,0 10px 30px #00000059}.max-w-3xl{max-width:48rem}.drop-shadow-strong{filter:drop-shadow(0 8px 24px rgba(0,0,0,.25)) drop-shadow(0 2px 8px rgba(0,0,0,.25))}.section-shell .glass-card,.section-shell .category-card,.section-shell .algorithm-card{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.gradient-title{background:linear-gradient(135deg,#fff,#93c5fd 40%,#67e8f9 65%,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent}.control-bar{display:flex;flex-direction:column;gap:1rem;align-items:center}.control-bar .button-row{display:flex;align-items:center;gap:1.5rem}.control-bar .speed-row{display:flex;align-items:center;gap:1rem}.control-bar .speed-row label{font-weight:600;margin-right:.5rem}.control-bar .speed-slider{flex:1;max-width:300px}.control-bar .speed-percent{font-weight:700;font-size:.95rem;background:#ffffff26;padding:.25rem .6rem;border-radius:8px;min-width:40px;text-align:center}