:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--accent-color:#0fc;--accent-secondary:#f0f;--bg-darker:#000;--bg-card:#0a0a0ab3;--border-color:#0fc3;--text-muted:#666;--freq-bar-height:250px;background-color:#030303;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}body{background:radial-gradient(circle,#0a0a0a 0%,#000 100%);place-items:center;min-width:320px;min-height:100vh;margin:0;display:flex;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:-1;background-color:#0000;background-image:linear-gradient(#00ffcc08 1px,#0000 1px),linear-gradient(90deg,#00ffcc08 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:50px 50px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;width:100%;height:100%;position:fixed;top:0;left:0}#root{text-align:center;width:100%;max-width:1200px;margin:0 auto;padding:2rem;position:relative}.spectrum-bg{width:100%;height:var(--freq-bar-height);opacity:.7;pointer-events:none;z-index:-1;filter:blur(1px);align-items:flex-end;gap:3px;padding:0;display:flex;position:fixed;bottom:0;left:0}.freq-bar{background:linear-gradient(to top, var(--accent-color), var(--accent-secondary), transparent);animation:bounce var(--duration) ease-in-out infinite alternate;box-shadow:0 0 20px var(--accent-color);border-radius:2px 2px 0 0;flex:1}@keyframes bounce{0%{opacity:.2;height:5%;transform:translateY(10px)}50%{opacity:.8;height:60%}to{opacity:1;height:100%;transform:translateY(0)}}.header{margin-bottom:4rem}.logo{letter-spacing:.2rem;color:var(--accent-color);text-align:left;margin-bottom:2rem;padding:.5rem 0;font-size:1.5rem;font-weight:800;text-decoration:none;display:block;position:relative;overflow:hidden}.free-badge{background:var(--accent-color);color:#000;z-index:10;letter-spacing:.1rem;box-shadow:0 0 20px var(--accent-color);border:3px solid #000;border-radius:2px;padding:.4rem .8rem;font-family:Courier New,Courier,monospace;font-size:.85rem;font-weight:900;position:absolute;top:1rem;right:1rem;transform:rotate(5deg)}.analyzer-header{margin-bottom:4rem}.system-status{color:var(--accent-color);letter-spacing:.3rem;text-shadow:0 0 10px #00ffcc80;margin-bottom:1rem;font-family:Courier New,Courier,monospace;font-size:.8rem}h1{letter-spacing:.3rem;text-transform:uppercase;background:linear-gradient(90deg,#fff,#666);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.5rem;font-size:3rem;font-weight:200}.subtitle{color:var(--text-muted);margin-bottom:3rem;font-family:Courier New,Courier,monospace;font-size:1rem}.synth-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2.5rem;display:grid}.synth-card{background:var(--bg-card);border:1px solid var(--border-color);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;flex-direction:column;transition:all .5s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.synth-card:before{content:"";background:radial-gradient(circle at center, var(--accent-color) 0%, transparent 70%);opacity:0;pointer-events:none;z-index:0;transition:opacity .5s;position:absolute;inset:0}.synth-card:hover{border-color:var(--accent-color);transform:translateY(-10px)scale(1.02);box-shadow:0 20px 40px #00ffcc26,0 0 20px #00ffcc1a}.synth-card:hover:before{opacity:.1;animation:2s ease-out infinite water-ripple}@keyframes water-ripple{0%{opacity:.2;transform:scale(.8)}to{opacity:0;transform:scale(1.5)}}.synth-image{object-fit:contain;border-bottom:1px solid var(--border-color);filter:grayscale(.5)contrast(1.2);z-index:1;box-sizing:border-box;background:radial-gradient(circle,#00ffcc0d 0%,#0000 80%);width:100%;height:240px;padding:1.5rem;transition:filter .5s,transform .5s}.synth-card:hover .synth-image{filter:grayscale(0)contrast();transform:scale(1.05)}.synth-info{text-align:left;z-index:1;padding:1.5rem;position:relative}.synth-type{color:var(--accent-secondary);letter-spacing:.1rem;opacity:.8;margin-bottom:.5rem;font-family:Courier New,Courier,monospace;font-size:.7rem}.synth-name{color:#fff;letter-spacing:.1rem;margin-bottom:1rem;font-size:1.5rem;font-weight:800}.sample-sound{color:var(--text-muted);cursor:pointer;border:1px solid #0000;border-radius:4px;align-items:center;gap:.75rem;margin-bottom:1.5rem;padding:.5rem;font-family:Courier New,Courier,monospace;font-size:.8rem;transition:all .3s;display:flex}.sample-sound:hover{color:var(--accent-color);background:#00ffcc0d;border-color:#00ffcc1a}.wave-icon{align-items:flex-end;gap:2px;height:14px;display:flex}.wave-icon span{background:var(--accent-color);width:2px;height:100%;animation:.6s infinite alternate wave-pulse}.wave-icon span:nth-child(2){animation-delay:.2s}.wave-icon span:nth-child(3){animation-delay:.4s}@keyframes wave-pulse{0%{opacity:.4;height:30%}to{opacity:1;height:100%}}.learn-more-btn{border:1px solid var(--border-color);color:#fff;text-transform:uppercase;letter-spacing:.05rem;cursor:pointer;box-sizing:border-box;background:0 0;border-radius:6px;width:100%;padding:.75rem 1.5rem;font-weight:500;text-decoration:none;transition:all .3s;display:block}.learn-more-btn:hover{color:#000;background:#fff;border-color:#fff}.logo-text{z-index:2;position:relative}.scanline{background:linear-gradient(90deg, transparent, var(--accent-color), transparent);pointer-events:none;opacity:.5;width:100%;height:2px;animation:3s linear infinite scan;position:absolute;top:0;left:0}@keyframes scan{0%{top:0}to{top:100%}}.card-glitch{pointer-events:none;z-index:2;background:linear-gradient(#0000,#00ffcc1a,#0000);width:100%;height:100%;transition:transform .5s;position:absolute;top:0;left:0;transform:translateY(-100%)}.synth-card:hover .card-glitch{transform:translateY(100%)}footer{border-top:1px solid var(--border-color);color:var(--text-muted);letter-spacing:.05rem;justify-content:space-between;margin-top:6rem;padding:3rem 0;font-family:Courier New,Courier,monospace;font-size:.75rem;display:flex}.social-icons{gap:1rem;display:flex}.social-icons svg{fill:currentColor;cursor:pointer;width:20px;height:20px;transition:color .2s}.social-icons svg:hover{color:#fff}.container{max-width:1200px;margin:0 auto;padding:0 1rem}