*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}body{background:#060b18;color:#fff;overflow-x:hidden}.navbar{position:fixed;top:0;left:0;width:100%;height:90px;padding:0 80px;display:flex;align-items:center;justify-content:space-between;background:#060b18d9;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);z-index:1000}.brand{font-size:24px;font-weight:700;letter-spacing:1px}.navbar nav a{margin-left:40px;text-decoration:none;color:#fff;opacity:.7;transition:.3s}.navbar nav a:hover{opacity:1}.hero{height:100vh;display:flex;align-items:center;padding:0 120px;position:relative}.hero-content{max-width:700px;z-index:2}.hero h1{font-size:64px;line-height:1.1;font-weight:700}.gradient-text{background:linear-gradient(90deg,#7f5af0,#00f5d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero p{margin-top:25px;font-size:18px;opacity:.6}.cta-area{margin-top:40px}.cta-primary{padding:16px 32px;border-radius:14px;border:none;background:linear-gradient(90deg,#7f5af0,#00f5d4);color:#fff;font-size:16px;cursor:pointer;transition:.4s}.cta-primary:hover{transform:translateY(-4px);box-shadow:0 0 40px #7f5af080}.join-area{margin-top:20px;display:flex;gap:12px}.join-area input{padding:14px;border-radius:12px;border:none;background:#111827;color:#fff;width:220px}.join-area button{padding:14px 20px;border-radius:12px;border:none;background:#1f2937;color:#fff;cursor:pointer;transition:.3s}.join-area button:hover{background:#374151}.hero-orb{position:absolute;right:10%;width:500px;height:500px;background:radial-gradient(circle,rgba(127,90,240,.5),transparent 60%);border-radius:50%;filter:blur(120px);animation:floatOrb 8s ease-in-out infinite alternate}@keyframes floatOrb{0%{transform:translateY(-30px)}to{transform:translateY(30px)}}.room-container{height:100vh;display:flex;flex-direction:column;padding:30px 60px;max-width:900px;margin:auto}.room-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.room-title{font-size:20px;font-weight:600;letter-spacing:.5px}.room-header button{padding:10px 16px;border-radius:10px;border:none;cursor:pointer;transition:.3s}.room-header .secondary-btn{background:#1f2937;color:#fff}.room-header .secondary-btn:hover{background:#374151}.room-header .end-btn{background:#ef4444;color:#fff}.room-header .end-btn:hover{background:#dc2626}.chat-box{flex:1;background:#0f172a;border-radius:20px;padding:25px;overflow-y:auto;display:flex;flex-direction:column;gap:18px}.message-row{display:flex}.message-row.self{justify-content:flex-end}.message-bubble{max-width:65%;padding:14px 18px;border-radius:16px;font-size:14px;position:relative}.message-bubble.self{background:linear-gradient(90deg,#7f5af0,#00f5d4);color:#fff}.message-bubble.other{background:#1e293b;color:#fff}.username-label{font-size:11px;opacity:.6;margin-bottom:6px}.message-time{font-size:10px;opacity:.5;margin-top:6px;text-align:right}.typing-indicator{font-size:12px;opacity:.6;margin-top:5px;font-style:italic}.chat-input-container{margin-top:20px;display:flex;gap:12px}.chat-input{flex:1;padding:16px;border-radius:14px;border:none;outline:none;background:#111827;color:#fff;font-size:14px}.send-btn{padding:16px 24px;border-radius:14px;border:none;background:linear-gradient(90deg,#7f5af0,#00f5d4);color:#fff;cursor:pointer;transition:.3s}.send-btn:hover{transform:translateY(-3px);box-shadow:0 0 25px #7f5af066}.chat-box::-webkit-scrollbar{width:6px}.chat-box::-webkit-scrollbar-thumb{background:linear-gradient(#7f5af0,#00f5d4);border-radius:10px}.vaporize{animation:vaporEffect 1.2s forwards}@keyframes vaporEffect{0%{opacity:1;filter:blur(0px)}50%{opacity:.6;filter:blur(8px)}to{opacity:0;filter:blur(25px);transform:scale(1.1)}}.about-page{padding-top:120px}.about-hero{max-width:800px;margin:auto;text-align:center;padding:0 40px}.about-hero h1{font-size:60px;line-height:1.1}.about-hero p{margin-top:25px;opacity:.7;font-size:18px}.features-section{margin-top:120px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:40px;padding:0 120px}.feature-card{background:#0f172a;padding:40px;border-radius:20px;transition:.4s;cursor:pointer;position:relative;overflow:hidden}.feature-card:hover{transform:translateY(-6px);box-shadow:0 0 40px #7f5af04d}.feature-card h3{margin-bottom:15px;font-size:20px}.feature-card p{opacity:.6;font-size:14px}.about-footer{margin-top:150px;text-align:center;padding-bottom:120px}.about-footer h2{font-size:42px}.home-wrapper{padding-top:120px}.brand{font-weight:700;font-size:22px;background:linear-gradient(90deg,#7f5af0,#00f5d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.brand-container{display:flex;align-items:center;cursor:pointer}.brand-logo{height:42px;transition:all .3s ease}.brand-logo:hover{transform:scale(1.05);filter:drop-shadow(0 0 8px rgba(127,90,240,.6))}.vapour-footer{margin-top:120px;padding:50px 80px;background:linear-gradient(180deg,#0a0f1e00,#0a0f1e 40%);border-top:1px solid rgba(255,255,255,.05)}.footer-inner{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:auto}.footer-brand{font-size:22px;font-weight:600;background:linear-gradient(90deg,#7f5af0,#00f5d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.footer-copy{font-size:14px;opacity:.6;margin-top:6px}.footer-right{display:flex;gap:25px}.footer-icon{font-size:22px;color:#cbd5e1;transition:all .3s ease}.footer-icon:hover{color:#00f5d4;transform:translateY(-4px);filter:drop-shadow(0 0 8px rgba(0,245,212,.6))}.contact-wrapper{min-height:100vh;background:radial-gradient(circle at 60% 40%,#1a1a3a,#0b1020 60%);color:#fff}.contact-section{display:flex;justify-content:center;align-items:center;padding:120px 20px}.contact-card{max-width:700px;text-align:center;padding:60px 40px;border-radius:20px;background:#14192d99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.05)}.contact-title{font-size:42px;margin-bottom:20px;background:linear-gradient(90deg,#7f5af0,#00f5d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.contact-description{opacity:.7;line-height:1.6;margin-bottom:40px}.contact-email span{opacity:.6;margin-right:8px}.contact-email a{color:#00f5d4;font-weight:500;text-decoration:none;transition:.3s ease}.contact-email a:hover{opacity:.8}.contact-icons{margin-top:40px;display:flex;justify-content:center;gap:35px}.contact-icon{font-size:28px;color:#cbd5e1;transition:all .3s ease}.contact-icon:hover{color:#00f5d4;transform:translateY(-6px);filter:drop-shadow(0 0 10px rgba(0,245,212,.7))}
