@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@300;400;600;800&display=swap";.dna-simulation-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9999;color:#fff;background:#0a0f18f2;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.dna-container{perspective:1000px;width:100px;height:300px;margin-bottom:2rem;position:relative}.dna-strand{width:4px;height:100%;transform-style:preserve-3d;background:0 0;animation:4s linear infinite rotate;position:absolute;top:0;left:50%}@keyframes rotate{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.base-pair{width:100px;height:2px;transform-style:preserve-3d;background:#00ffcc4d;position:absolute;left:-48px}.base-pair:before,.base-pair:after{content:"";border-radius:50%;width:10px;height:10px;position:absolute;top:-4px}.base-pair:before{background:#0fc;left:0;box-shadow:0 0 10px #0fc}.base-pair:after{background:#b200ff;right:0;box-shadow:0 0 10px #b200ff}.dna-container.mutating .base-pair:nth-child(5):before,.dna-container.mutating .base-pair:nth-child(8):after,.dna-container.mutating .base-pair:nth-child(12):before{background:#f05;animation:.2s infinite glitch;box-shadow:0 0 20px #f05}.dna-container.mutating .dna-strand{animation:4s linear infinite rotate,.5s infinite shake}@keyframes glitch{0%{transform:translate(0)scale(1)}20%{transform:translate(-2px,2px)scale(1.2)}40%{transform:translate(-2px,-2px)scale(.9)}60%{transform:translate(2px,2px)scale(1.1)}80%{transform:translate(2px,-2px)scale(1)}to{transform:translate(0)scale(1)}}@keyframes shake{0%,to{transform:rotateY(0)translate(0)}25%{transform:rotateY(90deg)translate(-5px)}50%{transform:rotateY(180deg)translate(5px)}75%{transform:rotateY(270deg)translate(-5px)}}.simulation-text{letter-spacing:2px;text-transform:uppercase;text-shadow:0 0 10px #00ffcc80;margin-top:1rem;font-size:1.5rem;font-weight:600;animation:1.5s infinite alternate pulse}.simulation-text.mutating{color:#f05;text-shadow:0 0 10px #ff005580}@keyframes pulse{0%{opacity:.7}to{opacity:1}}:root{--hue-base:220;--bg-dark:hsl(var(--hue-base), 25%, 6%);--accent-cyan:#0fc;--accent-purple:#9d4edd;--accent-pink:#f72585;--accent-gradient:linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));--glass-gradient:linear-gradient(145deg, #ffffff0d 0%, #ffffff03 100%);--glow-cyan:0 0 20px #0fc6;--glow-purple:0 0 30px #9d4edd66;--shadow-glass:0 8px 32px 0 #00000080, inset 0 1px 1px #ffffff1a, inset 0 -1px 1px #0003;--glass-border:#ffffff14;--glass-border-hover:#fff3;--text-h1:clamp(2.5rem, 5vw, 4rem);--text-h2:clamp(2rem, 4vw, 3rem);--text-base:clamp(1rem, 1.5vw, 1.125rem);--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-full:9999px;--transition-fast:.2s cubic-bezier(.25, .46, .45, .94);--transition-smooth:.4s cubic-bezier(.16, 1, .3, 1);--transition-bouncy:.5s cubic-bezier(.34, 1.56, .64, 1)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-family:Inter,sans-serif;line-height:1.6;overflow-x:hidden}body:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle at 15%,#9d4edd1f 0%,#0000 40%),radial-gradient(circle at 85% 30%,#00ffcc1f 0%,#0000 40%),radial-gradient(circle at 50% 80%,#f7258514 0%,#0000 40%);width:200%;height:200%;animation:20s ease-in-out infinite alternate mesh-breathing;position:fixed;top:-50%;left:-50%}@keyframes mesh-breathing{0%{transform:rotate(0)scale(1)}50%{transform:rotate(5deg)scale(1.05)}to{transform:rotate(-5deg)scale(1)}}h1,h2,h3,h4,h5,h6{letter-spacing:-.02em;font-family:Outfit,sans-serif;font-weight:600;line-height:1.2}h1{font-size:var(--text-h1)}h2{font-size:var(--text-h2)}.text-gradient{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;display:inline-block}.text-muted{color:#fff9}.glass-panel{background:var(--glass-gradient);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-glass);transition:var(--transition-smooth);padding:clamp(1.5rem,4vw,3rem);position:relative;overflow:hidden}.glass-panel:after{content:"";background:linear-gradient(90deg,#0000,#ffffff14,#0000);width:50%;height:100%;transition:all .8s ease-in-out;position:absolute;top:0;left:-100%;transform:skew(-25deg)}.glass-panel:hover:after{left:200%}.glass-panel:hover{border-color:var(--glass-border-hover);box-shadow:0 12px 40px #0009, var(--glow-cyan), inset 0 1px 1px #fff3;transform:translateY(-4px)scale(1.01)}.btn{border:1px solid var(--glass-border);color:#fff;border-radius:var(--radius-full);cursor:pointer;transition:var(--transition-bouncy);z-index:1;background:0 0;justify-content:center;align-items:center;gap:.75rem;padding:.8rem 1.8rem;font-family:Outfit,sans-serif;font-size:1.05rem;font-weight:600;display:inline-flex;position:relative;overflow:hidden}.btn:before{content:"";border-radius:inherit;z-index:-1;transform-origin:100%;background:#ffffff0d;transition:transform .4s cubic-bezier(.16,1,.3,1);position:absolute;inset:0;transform:scaleX(0)}.btn:hover:before{transform-origin:0;transform:scaleX(1)}.btn:hover{border-color:var(--accent-cyan);transform:translateY(-2px);box-shadow:0 0 15px #0fc3}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent-gradient);color:#0a0f18;background-size:200%;border:none;box-shadow:0 4px 15px #00ffcc4d}.btn-primary:hover{color:#fff;box-shadow:var(--glow-purple);background-position:100%;transform:translateY(-3px)scale(1.02)}.btn:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}.input-glass{border:1px solid var(--glass-border);color:#fff;border-radius:var(--radius-md);width:100%;transition:var(--transition-smooth);background:#00000040;outline:none;padding:1rem 1.25rem;font-family:Inter,sans-serif;font-size:1rem;box-shadow:inset 0 2px 4px #0003}.input-glass::placeholder{color:#ffffff4d}.input-glass:hover{background:#00000059;border-color:#ffffff26}.input-glass:focus{border-color:var(--accent-cyan);background:#00000080;box-shadow:inset 0 2px 4px #0003,0 0 0 3px #00ffcc26}.upload-area{border-radius:var(--radius-lg);text-align:center;cursor:pointer;transition:var(--transition-smooth);background:#0003;border:2px dashed #ffffff26;padding:3rem;position:relative;overflow:hidden}.upload-area:before{content:"";background:var(--accent-gradient);opacity:0;z-index:0;transition:opacity .3s;position:absolute;inset:0}.upload-area>*{z-index:1;position:relative}.upload-area:hover,.upload-area.active{border-color:var(--accent-cyan);transform:translateY(-2px);box-shadow:0 10px 30px #0006}.upload-area:hover:before,.upload-area.active:before{opacity:.05}.flex-center{justify-content:center;align-items:center;display:flex}.grid-cols-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;display:grid}.container{width:100%;max-width:1200px;margin:0 auto;padding:clamp(1rem,5vw,3rem) clamp(1rem,5vw,3rem) clamp(4rem,8vw,6rem)}nav{border-bottom:1px solid var(--glass-border);-webkit-backdrop-filter:blur(15px);z-index:100;background:#0a0f18b3;justify-content:space-between;align-items:center;padding:1.5rem clamp(1rem,5vw,3rem);transition:all .3s;display:flex;position:sticky;top:0}.nav-links{gap:clamp(1rem,3vw,2.5rem);display:flex}.nav-links a{color:var(--text-muted);transition:var(--transition-fast);font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:500;text-decoration:none;position:relative}.nav-links a:after{content:"";background:var(--accent-gradient);width:0%;height:2px;transition:var(--transition-smooth);position:absolute;bottom:-4px;left:0}.nav-links a:hover,.nav-links a.active{color:#fff;text-shadow:0 0 15px #00ffcc80}.nav-links a:hover:after,.nav-links a.active:after{width:100%}@keyframes slideUpFade{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-enter{animation:.7s cubic-bezier(.16,1,.3,1) forwards slideUpFade}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#0000004d}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--accent-purple)}::selection{color:#fff;background:#00ffcc4d}