*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans JP,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px}.chat-container{width:100%;max-width:600px;height:90vh;max-height:800px;background:white;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.3);display:flex;flex-direction:column;overflow:hidden}.chat-header{padding:24px;background:linear-gradient(135deg,#667eea,#764ba2);color:white;text-align:center;border-bottom:1px solid rgba(255,255,255,.1)}.chat-title{font-size:24px;font-weight:700;margin-bottom:8px}.chat-description{font-size:14px;opacity:.9}.chat-messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:16px;background:#f8f9fa}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-track{background:#f1f1f1}.chat-messages::-webkit-scrollbar-thumb{background:#888;border-radius:3px}.chat-messages::-webkit-scrollbar-thumb:hover{background:#555}.welcome-message{text-align:center;color:#666;padding:40px 20px;line-height:1.8}.welcome-message p{margin-bottom:12px}.message{display:flex;max-width:80%;animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-user{align-self:flex-end;margin-left:auto}.message-assistant{align-self:flex-start}.message-content{padding:12px 16px;border-radius:18px;line-height:1.6;word-wrap:break-word}.message-user .message-content{background:linear-gradient(135deg,#667eea,#764ba2);color:white;border-bottom-right-radius:4px}.message-assistant .message-content{background:white;color:#333;border:1px solid #e0e0e0;border-bottom-left-radius:4px;box-shadow:0 2px 4px rgba(0,0,0,.05)}.message-content p{margin-bottom:4px}.message-content p:last-child{margin-bottom:0}.loading-indicator{display:flex;align-items:center;gap:4px;color:#666}.loading-dots{display:inline-flex;gap:2px}.loading-dots span{animation:dotPulse 1.4s infinite;animation-delay:calc(var(--i) * .2s)}.loading-dots span:first-child{--i:0}.loading-dots span:nth-child(2){--i:1}.loading-dots span:nth-child(3){--i:2}@keyframes dotPulse{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}.chat-input-area{padding:16px;background:white;border-top:1px solid #e0e0e0;display:flex;gap:12px;align-items:flex-end}.chat-input{flex:1;padding:12px 16px;border:2px solid #e0e0e0;border-radius:24px;font-size:14px;font-family:inherit;resize:none;max-height:120px;overflow-y:auto;transition:border-color .2s}.chat-input:focus{outline:none;border-color:#667eea}.chat-input:disabled{background:#f5f5f5;cursor:not-allowed}.chat-send-button{padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:white;border:none;border-radius:24px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;white-space:nowrap}.chat-send-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px rgba(102,126,234,.4)}.chat-send-button:active:not(:disabled){transform:translateY(0)}.chat-send-button:disabled{opacity:.5;cursor:not-allowed}@media (max-width:640px){body{padding:0}.chat-container{height:100vh;max-height:100vh;border-radius:0}.chat-header{padding:20px 16px}.chat-title{font-size:20px}.chat-description{font-size:12px}.chat-messages{padding:16px}.message{max-width:85%}.chat-input-area{padding:12px}.chat-send-button{padding:12px 20px;font-size:13px}}