@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700;800&display=swap";*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:linear-gradient(180deg,#0f172a,#070b13);color:#e6eef2;font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;line-height:1.35;-webkit-font-feature-settings:"liga" 1}.grid{display:grid;gap:1.25rem}.grid.cols-3{grid-template-columns:2fr 1fr}@media(min-width:1024px){.grid.cols-3{grid-template-columns:2fr 1fr}}.card{background:linear-gradient(180deg,#ffffff05,#ffffff03);border-radius:12px;border:1px solid rgba(255,255,255,.03);padding:1rem;box-shadow:0 8px 30px #02061799;transition:transform .18s cubic-bezier(.2,.9,.2,1),box-shadow .18s cubic-bezier(.2,.9,.2,1);will-change:transform}.card.p-6{padding:1.5rem}.card.p-4{padding:1rem}.card:hover{transform:translateY(-3px)}button{cursor:pointer;border:none;border-radius:10px;font-weight:700;letter-spacing:.15px;transition:transform .18s cubic-bezier(.2,.9,.2,1),box-shadow .18s cubic-bezier(.2,.9,.2,1),filter .18s cubic-bezier(.2,.9,.2,1);display:inline-flex;align-items:center;padding:.6rem 1rem;margin:10px 0;color:#fff;background-color:#00bfa6;gap:.5rem;-webkit-tap-highlight-color:transparent}.btn-primary{background:linear-gradient(90deg,#00bfa6,#00e1c1);color:#fff;padding:.75rem 1rem;font-size:1rem;box-shadow:0 6px 22px #00bfa61f,inset 0 -2px 6px #00000014;transform:translateZ(0)}.btn-primary:hover{transform:translateY(-3px);filter:brightness(1.04);box-shadow:0 10px 30px #00bfa629}.btn-primary:active{transform:translateY(-1px) scale(.995);box-shadow:0 6px 18px #00bfa61f}.btn-secondary{background:transparent;color:#00bfa6;border:2px solid rgba(0,191,166,.14);padding:.6rem .9rem;font-size:.95rem}.btn-secondary:hover{background:#00bfa60f;border-color:#00bfa638;color:#00d3b8}.w-full{width:100%;display:inline-flex;justify-content:center}input[type=text],textarea,select{background:#ffffff05;color:#e6eef2;border:1px solid rgba(255,255,255,.04);border-radius:10px;padding:.6rem .75rem;font-size:.95rem;outline:none;transition:border-color .18s cubic-bezier(.2,.9,.2,1),box-shadow .18s cubic-bezier(.2,.9,.2,1);width:100%;resize:none}input:focus,textarea:focus,select:focus{border-color:#00bfa638;box-shadow:0 6px 20px #00bfa614}.label{display:block;font-weight:700;color:#00bfa6;margin-bottom:.5rem;font-size:.9rem}.helper{font-size:.8rem;color:#94a3b8;margin-top:.5rem}input[type=range]{-webkit-appearance:none;width:100%;height:6px;background:linear-gradient(90deg,#ffffff08,#ffffff08);border-radius:6px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:999px;background:#00bfa6;box-shadow:0 6px 18px #00bfa62e;border:2px solid rgba(255,255,255,.08)}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:999px;background:#00bfa6;border:2px solid rgba(255,255,255,.08)}.canvas-wrap{width:100%;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.04);box-shadow:0 12px 40px #02061799;background:linear-gradient(180deg,#ffffff03,#ffffff05)}.controls{display:flex;flex-direction:column;gap:1rem;max-height:78vh;overflow-y:auto;padding-right:.25rem}.card-accent{border:1px solid rgba(0,191,166,.12)}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:#ffffff0f;border-radius:8px}::-webkit-scrollbar-thumb:hover{background:#ffffff17}.min-h-screen{min-height:100vh}.max-w-7xl{max-width:1120px}.mx-auto{margin-left:auto;margin-right:auto}.bg-gradient-to-br{background:linear-gradient(to bottom right,#0f172a,#1e293b)}.text-4xl{font-size:2.25rem}.text-lg{font-size:1.125rem}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-white{color:#fff}.text-gray-400{color:#94a3b8}.text-gray-300{color:#94a3b8cc}.text-gray-500{color:#94a3b8e6}.text-teal-400{color:#00bfa6}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-mono{font-family:monospace}.p-8{padding:2rem}.p-6{padding:1.5rem}.p-4{padding:1rem}.p-2{padding:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.mb-8{margin-bottom:2rem}.mb-4{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.mt-6{margin-top:1.5rem}.mt-2{margin-top:.5rem}.mt-1{margin-top:.25rem}.flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.flex-1{flex:1}.w-full{width:100%}.w-12{width:3rem}.text-center{text-align:center}.block{display:block}.border{border:1px solid rgba(255,255,255,.04)}.border-4{border-width:4px}.border-2{border-width:2px}.border-slate-600{border-color:#ffffff0f}.border-slate-700{border-color:#ffffff14}.border-teal-500{border-color:#00bfa6}.rounded-lg{border-radius:.5rem}.rounded{border-radius:.375rem}.shadow-lg{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.shadow-2xl{box-shadow:0 25px 50px -12px #00000040}.bg-slate-800{background-color:#ffffff05}.bg-slate-700{background-color:#ffffff0a}.bg-teal-500{background-color:#00bfa6}.hover\:bg-slate-600:hover{background-color:#ffffff0f}.hover\:bg-teal-600:hover{background-color:#00e1c1}.hover\:scale-105:hover{transform:scale(1.05)}.focus\:border-teal-500:focus{border-color:#00bfa6}.focus\:outline-none:focus{outline:none}.transition-all{transition:.18s cubic-bezier(.2,.9,.2,1)}.space-y-6>*+*{margin-top:1.5rem}.space-y-3>*+*{margin-top:.75rem}.overflow-y-auto{overflow-y:auto}.max-h-screen{max-height:100vh}.h-2{height:.5rem}.cursor-pointer{cursor:pointer}.accent-teal-500{accent-color:#00bfa6}.resize-none{resize:none}@media(min-width:1024px){.lg\:grid-cols-3{grid-template-columns:2fr 1fr}.lg\:col-span-2{grid-column:span 2/span 2}.lg\:col-span-1{grid-column:span 1/span 1}}.grid-cols-1{grid-template-columns:1fr}.gap-8{gap:2rem}