body{font-family:Arial,sans-serif;margin:0;padding:0;display:flex;flex-direction:column;align-items:center;min-height:100vh;background-color:#f4f4f4}h1{margin-top:20px;margin-bottom:10px}select,input[type="text"]{padding:10px;margin:10px;border-radius:5px;border:1px solid #ddd;width:calc(50% - 20px)}select{cursor:pointer;background-color:#fff;box-shadow:0 2px 4px rgba(0,0,0,0.1)}.container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:1200px}.endpoint{background-color:#fff;border-radius:10px;box-shadow:0 2px 4px rgba(0,0,0,0.1);padding:20px;width:700px;margin:10px auto}.message-area{border:1px solid #ccc;padding:10px;height:300px;overflow-y:auto;margin-top:10px}.message{padding:5px 10px;margin:5px;border-radius:10px;background-color:#ececec}.user-message{background-color:#dcf8c6;text-align:right}.backend-message{background-color:#ececec;text-align:left}input:disabled,button:disabled{opacity:0.6;cursor:not-allowed}input,button{padding:10px;margin:5px 0;border-radius:5px;border:1px solid #ddd}button{background-color:#5cb85c;color:#fff;border:none;cursor:pointer}button:hover{background-color:#4cae4c}input[type="radio"]{margin-right:5px;cursor:pointer}label{margin-right:20px;cursor:pointer}.radio-container{margin:10px 0;display:flex;align-items:center;justify-content:start}input[type="radio"]+label{padding:5px 10px;background-color:#fff;border-radius:5px;border:1px solid #ddd}input[type="radio"]:checked+label{background-color:#5cb85c;color:#fff}#storySwapContainer .message{display:flex;align-items:center;padding:5px 10px;margin:5px 0;border-radius:10px}#storySwapContainer .avatar-container{width:30px;height:30px;overflow:hidden;border-radius:50%;flex-shrink:0;margin-right:10px}#storySwapContainer .avatar{width:100%;height:auto}#storySwapContainer .text{flex:1}#storySwapContainer .user-message{background-color:#dcf8c6;text-align:right}#storySwapContainer .backend-message{background-color:#f1f1f1;text-align:left}