@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;500;800;900&family=Inter:wght@400;500;600&display=swap";:root{--bg-core: #050508;--bg-surface: rgba(18, 18, 26, .6);--text-primary: #ededf5;--text-secondary: #8c8c9e;--neon-cyan: #00f0ff;--neon-magenta: #ff004f;--neon-yellow: #e4ff00;--gradient-vibe: linear-gradient(135deg, var(--neon-cyan), var(--neon-magenta))}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,sans-serif;background-color:var(--bg-core);color:var(--text-primary);min-height:100vh;margin:0;overflow-x:hidden;display:flex;justify-content:center;align-items:center;background-image:radial-gradient(circle at 0% 0%,rgba(0,240,255,.08) 0%,transparent 40%),radial-gradient(circle at 100% 100%,rgba(255,0,79,.08) 0%,transparent 40%)}h1,h2,h3,h4,.font-display{font-family:Outfit,sans-serif;letter-spacing:-.02em}.app-container{width:100%;max-width:1200px;min-height:90vh;display:flex;flex-direction:column;align-items:center;padding:2rem;position:relative;z-index:1}.glass-panel{background:var(--bg-surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.05);border-radius:24px;padding:2rem;box-shadow:0 30px 60px #0009,inset 0 1px #ffffff0d;position:relative;overflow:hidden}.glass-panel:before{content:"";position:absolute;inset:0;background:var(--gradient-vibe);opacity:.1;z-index:-1;transition:opacity .3s ease}.glass-panel:hover:before{opacity:.15}.title-glitch{font-size:4rem;font-weight:900;text-transform:uppercase;background:var(--gradient-vibe);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem;display:inline-block}.subtitle{color:var(--text-secondary);font-size:1.25rem;font-weight:300;margin-bottom:3rem;text-align:center}.btn-primary{background:transparent;color:var(--text-primary);font-family:Outfit,sans-serif;font-weight:600;font-size:1.1rem;padding:1rem 3rem;border:1px solid rgba(255,255,255,.1);border-radius:50px;cursor:pointer;position:relative;overflow:hidden;transition:all .3s ease}.btn-primary:before{content:"";position:absolute;inset:0;background:var(--gradient-vibe);opacity:0;z-index:-1;transition:opacity .3s ease}.btn-primary:hover{border-color:transparent;transform:translateY(-2px);box-shadow:0 10px 20px #00f0ff33}.btn-primary:hover:before{opacity:1}.sandbox-grid{display:grid;grid-template-columns:1fr;width:100%;max-width:800px;gap:2rem}.chat-box{display:flex;flex-direction:column;gap:1.5rem;height:50vh;overflow-y:auto;padding-right:1rem}.chat-box::-webkit-scrollbar{width:6px}.chat-box::-webkit-scrollbar-track{background:#0003;border-radius:10px}.chat-box::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}.message-bubble{max-width:80%;padding:1rem 1.5rem;border-radius:18px;font-size:1rem;line-height:1.5;animation:slideUp .4s cubic-bezier(.16,1,.3,1) forwards;opacity:0;transform:translateY(20px)}.msg-a{align-self:flex-start;background:#00f0ff1a;border:1px solid rgba(0,240,255,.2);border-bottom-left-radius:4px}.msg-b{align-self:flex-end;background:#ff004f1a;border:1px solid rgba(255,0,79,.2);border-bottom-right-radius:4px}.msg-sender{font-family:Outfit,sans-serif;font-size:.75rem;font-weight:800;text-transform:uppercase;margin-bottom:.3rem;letter-spacing:.1em}.msg-a .msg-sender{color:var(--neon-cyan)}.msg-b .msg-sender{color:var(--neon-magenta)}.vibe-report{width:100%;max-width:900px;display:flex;flex-direction:column;gap:2rem;animation:fadeIn .6s ease forwards}.metric-row{display:flex;align-items:center;gap:1rem}.metric-label{width:180px;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:500;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;text-align:right}.metric-bar-container{flex:1;height:8px;background:#ffffff0d;border-radius:10px;overflow:hidden;position:relative}.metric-fill{height:100%;border-radius:10px;background:var(--gradient-vibe);box-shadow:0 0 10px var(--neon-cyan);transition:width 1.5s cubic-bezier(.16,1,.3,1)}.metric-val{width:40px;font-family:Outfit,sans-serif;font-weight:800;font-size:1.1rem;color:var(--text-primary)}.match-hero{text-align:center;padding:2rem;border-radius:16px;background:#e4ff001a;border:1px solid rgba(228,255,0,.3);margin-top:2rem}.match-hero[data-match=false]{background:#ff004f1a;border:1px solid rgba(255,0,79,.3)}.match-hero h2{font-size:2.5rem;margin-bottom:.5rem;color:var(--neon-yellow)}.match-hero[data-match=false] h2{color:var(--neon-magenta)}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}
