:root{font-family:Inter,Arial,sans-serif;color:#172039;background:#f5f6fa}*{box-sizing:border-box}body{margin:0}.chat-page{height:100vh;max-width:860px;margin:auto;background:#fff;display:flex;flex-direction:column;box-shadow:0 0 60px #17203912}header{height:82px;border-bottom:1px solid #e8eaf0;display:flex;align-items:center;gap:12px;padding:0 25px}.avatar{width:42px;height:42px;border-radius:14px;background:#6657ef;color:#fff;display:grid;place-items:center;font-weight:800}.chat-page header b,.chat-page header span{display:block}.chat-page header span{font-size:11px;color:#7b8498;margin-top:4px}.chat-page header i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#22a879;margin-right:4px}.messages{flex:1;overflow:auto;padding:38px 8%}.msg{max-width:620px;margin:17px 0}.bubble{display:inline-block;background:#f1f2f6;border-radius:16px 16px 16px 4px;padding:14px 17px;line-height:1.5;font-size:14px}.user{margin-left:auto;text-align:right}.user .bubble{background:#6657ef;color:#fff;border-radius:16px 16px 4px 16px}.msg small{display:block;color:#a3aaba;font-size:10px;margin:5px}.typing{display:flex;gap:4px;background:#f1f2f6;width:55px;padding:14px;border-radius:16px}.typing span{width:5px;height:5px;background:#9aa2b5;border-radius:50%;animation:b 1s infinite}.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}@keyframes b{50%{opacity:.2}}.hidden{display:none}.promotion-card{background:linear-gradient(145deg,#fff,#f8f7ff);border:1px solid #e9e6ff;border-radius:22px;padding:15px;box-shadow:0 18px 45px #3b2ca51a}.promotion-title{display:flex;gap:10px;align-items:center;padding:2px 3px 13px}.promotion-title>span{font-size:20px}.promotion-title b,.promotion-title small{display:block}.promotion-title small{color:#8d95a8;margin-top:3px}.promotion-card img{width:100%;max-width:470px;display:block;border-radius:16px}.claim{display:flex;width:fit-content;min-width:210px;justify-content:center;gap:10px;margin:15px auto 3px;padding:12px 22px;border-radius:12px;background:linear-gradient(100deg,#6757f0,#7d57f5);color:#fff;text-decoration:none;font-weight:800;box-shadow:0 10px 24px #6657ef40}#composer{margin:0 8%;display:flex;border:1px solid #dfe2eb;border-radius:15px;padding:6px 6px 6px 15px}#composer input{flex:1;border:0;outline:0;font-size:14px}#composer button{width:38px;border:0;border-radius:10px;background:#6657ef;color:#fff;font-size:18px}footer{text-align:center;color:#a3aaba;font-size:10px;padding:14px}@media(max-width:600px){.messages{padding:25px 5%}.promotion-card{padding:11px}}
