:root{--bg-color: #0f0f13;--glass-bg: rgba(20, 20, 30, .7);--glass-border: rgba(255, 255, 255, .1);--primary: #3ecf8e;--primary-glow: rgba(62, 207, 142, .4);--text-main: #ffffff;--text-muted: #a0a0b0;--blob-1: #5b21b6;--blob-2: #1e40af}*{box-sizing:border-box;margin:0;padding:0;font-family:Outfit,sans-serif}body{background-color:var(--bg-color);color:var(--text-main);min-height:100vh;display:flex;justify-content:center;align-items:center;overflow:hidden}.background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.6;animation:float 10s infinite alternate ease-in-out}.blob-1{width:500px;height:500px;background:var(--blob-1);top:-100px;left:-100px}.blob-2{width:600px;height:600px;background:var(--blob-2);bottom:-150px;right:-100px;animation-delay:-5s}@keyframes float{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.glass-container{width:100%;max-width:450px;height:80vh;background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:24px;display:flex;flex-direction:column;box-shadow:0 20px 50px #00000080;overflow:hidden}header{padding:20px 24px;border-bottom:1px solid var(--glass-border)}.logo{display:flex;align-items:center;gap:10px;font-weight:600;font-size:1.2rem;color:var(--text-main)}.subtitle{font-size:.8rem;color:var(--text-muted);margin-top:4px;margin-left:40px}.feed-container{flex:1;overflow-y:auto;padding:20px;scroll-behavior:smooth}.feed{display:flex;flex-direction:column;gap:16px}.message-card{background:#ffffff08;padding:12px 16px;border-radius:16px 16px 16px 4px;animation:slideIn .3s ease-out;border:1px solid transparent;transition:all .2s}.message-card.self{background:#3ecf8e1a;border-color:#3ecf8e33;border-bottom-left-radius:16px;border-bottom-right-radius:4px;align-self:flex-end}.message-card.system{background:#ff32641a;border-color:#ff326433;border-left:4px solid #ff3264}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-meta{display:flex;justify-content:space-between;font-size:.75rem;color:var(--text-muted);margin-bottom:6px}.message-username{font-weight:600;color:var(--primary)}.message-content{font-size:.95rem;line-height:1.4;word-break:break-word}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text-muted);margin-top:50px;gap:10px}.spinner{width:24px;height:24px;border:2px solid var(--primary);border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.input-area{padding:20px;background:#0003;border-top:1px solid var(--glass-border);display:flex;gap:10px}.input-group{position:relative}.flex-grow{flex:1}input{width:100%;background:#ffffff0d;border:1px solid var(--glass-border);padding:12px 16px;border-radius:12px;color:#fff;font-size:14px;transition:all .3s}input:focus{outline:none;background:#ffffff1a;border-color:var(--primary);box-shadow:0 0 10px var(--primary-glow)}#username{width:80px;text-align:center;font-weight:600;color:var(--primary)}.send-btn{background:var(--primary);color:#000;border:none;width:44px;height:44px;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s}.send-btn:hover{transform:scale(1.05);box-shadow:0 0 15px var(--primary-glow)}.send-btn:active{transform:scale(.95)}.server-action{text-align:center;padding:0 0 10px}.text-btn{background:none;border:none;color:var(--text-muted);font-size:.75rem;cursor:pointer;text-decoration:underline;opacity:.5;transition:opacity .2s}.text-btn:hover{opacity:1}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}.hidden{display:none!important}.auth-container{padding:40px 30px;display:flex;flex-direction:column;justify-content:center;flex:1;text-align:center}.auth-header{font-size:1.8rem;margin-bottom:10px;background:linear-gradient(to right,#fff,#aaa);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.auth-sub{color:var(--text-muted);margin-bottom:30px}.auth-form{display:flex;flex-direction:column;gap:15px}.auth-buttons{display:flex;gap:10px;margin-top:10px}.primary-btn,.secondary-btn{flex:1;padding:12px;border-radius:8px;border:none;font-weight:600;cursor:pointer;transition:all .2s}.primary-btn{background:var(--primary);color:#000}.primary-btn:hover{box-shadow:0 0 15px var(--primary-glow)}.secondary-btn{background:#ffffff1a;color:#fff}.secondary-btn:hover{background:#fff3}.error-msg{color:#ff4b4b;font-size:.9rem;min-height:20px}.success-msg{color:var(--primary);font-size:.9rem;min-height:20px}.user-bar{padding:10px 20px;background:#0003;border-bottom:1px solid var(--glass-border);display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:var(--text-muted)}.user-bar strong{color:var(--text-main)}.small{font-size:.75rem;padding:4px 8px;background:#ffffff0d;border-radius:4px}.chat-container{display:flex;flex-direction:column;flex:1;min-height:0}.user-actions{display:flex;gap:8px;align-items:center}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease-out}.modal-content{padding:40px;text-align:center;position:relative;max-width:350px;height:auto}.close-modal{position:absolute;top:20px;right:20px;font-size:1.5rem;cursor:pointer;color:var(--text-muted);transition:color .2s}.close-modal:hover{color:#fff}.qrcode-container{width:200px;height:200px;background:#fff;margin:20px auto;border-radius:12px;display:flex;justify-content:center;align-items:center;padding:10px}.qrcode-container img,.qrcode-container canvas{width:100%;height:100%}.success-icon{font-size:80px;color:var(--primary);animation:scaleUp .3s ease-out}@keyframes scaleUp{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.order-no{font-size:.8rem;color:var(--text-muted);margin-top:10px}.status-tip{margin-top:20px;font-weight:600;color:var(--primary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}
