:root{--bg-darker:#07050f;--bg-dark:#0d0a1a;--bg-card:#17122bbf;--bg-card-hover:#211b3cd9;--border-glow:#8b5cf633;--border-glow-focus:#8b5cf680;--primary:#8b5cf6;--primary-glow:#8b5cf666;--secondary:#06b6d4;--secondary-glow:#06b6d466;--accent:#ec4899;--accent-glow:#ec489966;--text-main:#f3f4f6;--text-muted:#9ca3af;--text-dark:#6b7280;--shadow-neon:0 0 15px #8b5cf659;--shadow-neon-cyan:0 0 15px #06b6d459;--shadow-neon-pink:0 0 15px #ec489959;--font-display:"Outfit", -apple-system, sans-serif;--font-sans:"Inter", -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-darker);color:var(--text-main);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 0 0,#8b5cf626 0,#0000 50%),radial-gradient(at 100% 100%,#06b6d41a 0,#0000 50%),radial-gradient(#ec48990d 0,#0000 50%);background-attachment:fixed;min-height:100vh;overflow-x:hidden}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.02em;font-weight:700}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-darker)}::-webkit-scrollbar-thumb{background:#8b5cf64d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary)}.glass-panel{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid #ffffff0d;border-top-color:#ffffff1a;border-radius:16px;padding:20px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 32px #0000005e}.glass-panel:hover{border-color:var(--border-glow);box-shadow:0 8px 32px #8b5cf60d,0 0 1px 1px #8b5cf61a}.btn-neon-purple{color:#fff;font-family:var(--font-display);cursor:pointer;box-shadow:var(--shadow-neon);background:linear-gradient(135deg,#7c3aed,#9061f9);border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-weight:600;transition:all .2s;display:inline-flex}.btn-neon-purple:hover{transform:translateY(-1px);box-shadow:0 0 22px #8b5cf6a6}.btn-neon-purple:active{transform:translateY(1px)}.btn-neon-purple:disabled{background:var(--text-dark);box-shadow:none;cursor:not-allowed;transform:none}.btn-neon-cyan{color:#fff;font-family:var(--font-display);cursor:pointer;box-shadow:var(--shadow-neon-cyan);background:linear-gradient(135deg,#0891b2,#06b6d4);border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-weight:600;transition:all .2s;display:inline-flex}.btn-neon-cyan:hover{transform:translateY(-1px);box-shadow:0 0 22px #06b6d4a6}.btn-neon-cyan:active{transform:translateY(1px)}.btn-neon-pink{color:#fff;font-family:var(--font-display);cursor:pointer;box-shadow:var(--shadow-neon-pink);background:linear-gradient(135deg,#db2777,#ec4899);border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:1.05rem;font-weight:700;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:inline-flex}.btn-neon-pink:hover{transform:scale(1.03);box-shadow:0 0 25px #ec4899bf}.btn-neon-pink:active{transform:scale(.98)}.btn-neon-pink:disabled{background:var(--text-dark);box-shadow:none;cursor:not-allowed;transform:none}.btn-outline{color:var(--text-main);font-family:var(--font-display);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-weight:600;transition:all .2s;display:inline-flex}.btn-outline:hover{background:#ffffff1a;border-color:#fff3}.btn-outline.active{border-color:var(--primary);background:#8b5cf626;box-shadow:0 0 10px #8b5cf633}.input-field{color:#fff;font-family:var(--font-sans);background:#0000004d;border:1px solid #ffffff1a;border-radius:8px;width:100%;padding:8px 12px;font-size:.9rem;transition:all .2s}.input-field:focus{border-color:var(--primary);outline:none;box-shadow:0 0 10px #8b5cf633}.switch{width:44px;height:24px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider-switch{cursor:pointer;background-color:#ffffff1a;border:1px solid #ffffff0d;border-radius:24px;transition:all .3s;position:absolute;inset:0}.slider-switch:before{content:"";background-color:#fff;border-radius:50%;width:16px;height:16px;transition:all .3s;position:absolute;bottom:3px;left:3px}input:checked+.slider-switch{background-color:var(--primary);box-shadow:0 0 10px var(--primary-glow)}input:checked+.slider-switch:before{transform:translate(20px)}input[type=range].neon-range{-webkit-appearance:none;background:#ffffff1a;border-radius:3px;outline:none;width:100%;height:6px;transition:background .3s}input[type=range].neon-range::-webkit-slider-thumb{appearance:none;background:var(--primary);cursor:pointer;width:16px;height:16px;box-shadow:0 0 10px var(--primary-glow);border-radius:50%;transition:transform .1s}input[type=range].neon-range::-webkit-slider-thumb:hover{transform:scale(1.2)}.glow-text{text-shadow:0 0 8px #8b5cf680}.glow-text-cyan{text-shadow:0 0 8px #06b6d480}.glow-text-pink{text-shadow:0 0 8px #ec489980}.app-container{grid-template-rows:auto 1fr;height:100vh;max-height:100vh;display:grid;overflow:hidden}.header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:10;background:#0b0914cc;border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.main-content{grid-template-columns:320px 1fr 360px;gap:20px;height:calc(100vh - 73px);padding:20px;display:grid;overflow:hidden}.dropzone{cursor:pointer;text-align:center;background:#8b5cf605;border:2px dashed #8b5cf64d;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:40px 20px;transition:all .3s;display:flex}.dropzone:hover{border-color:var(--primary);background:#8b5cf60d;box-shadow:0 0 20px #8b5cf61a}.dropzone-icon{width:48px;height:48px;color:var(--primary);margin-bottom:16px;animation:3s ease-in-out infinite float}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-8px)}to{transform:translateY(0)}}@keyframes peak-pulse{0%{opacity:.8;transform:scale(1)}50%{opacity:1;filter:brightness(1.3);transform:scale(1.4)}to{opacity:.8;transform:scale(1)}}.pulse-peak{animation:.4s ease-out peak-pulse}.tiktok-marquee{white-space:nowrap;overflow:hidden}.tiktok-marquee>span{padding-left:100%;animation:6s linear infinite tiktok-scroll;display:inline-block}@keyframes tiktok-scroll{0%{transform:translate(0)}to{transform:translate(-200%)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.92)}}
