*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:Arial,sans-serif;line-height:1.6;background-color:#f5f5f5;color:#333;margin:0;position:fixed;width:100%;height:100%}.salon-app-container{max-width:800px;height:100%;min-height:100%;margin:0 auto;padding:20px;display:flex;flex-direction:column;overflow:hidden}.salon-header{display:flex;justify-content:space-between;margin-bottom:10px;flex-shrink:0}.salon-header h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.salon-chat-container{background-color:#fff;border-radius:8px;box-shadow:0 4px 6px #0000001a;display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}.salon-messages{flex:1;overflow-y:auto;padding:15px;display:flex;flex-direction:column;min-height:0}.salon-message{padding:10px 15px;border-radius:18px;margin-bottom:10px;max-width:70%;align-self:flex-start;position:relative}.user-message{background-color:#4299e1;color:#fff;align-self:flex-end}.assistant-message{background-color:#e2e8f0;color:#333}.message-content{font-size:1rem}.message-content p{margin-bottom:.75rem}.message-content p:last-child{margin-bottom:0}.message-content strong{font-weight:700}.message-content em{font-style:italic}.message-content code{font-family:monospace;background-color:#0000000f;padding:2px 4px;border-radius:3px}.message-content pre{background-color:#0000000f;padding:8px;border-radius:5px;overflow-x:auto;margin:.75rem 0}.message-content ul,.message-content ol{margin-left:1.5rem;margin-bottom:.75rem}.message-time{font-size:.7rem;margin-top:5px;opacity:.8;text-align:right}.salon-message-form{display:flex;padding:15px;border-top:1px solid #e2e8f0;flex-shrink:0;position:sticky;bottom:0;background-color:#fff;z-index:10}.salon-message-input{flex:1;padding:10px;border:1px solid #e2e8f0;border-radius:4px;margin-right:10px;font-size:16px}.salon-send-button{background-color:#4299e1;color:#fff;border:none;padding:10px 15px;border-radius:4px;cursor:pointer}.salon-send-button:hover{background-color:#3182ce}.salon-header-controls{display:flex;align-items:center;gap:10px;margin-left:auto}.model-selector{position:relative;min-width:200px}.model-selector-button{width:100%;padding:8px 12px;background-color:#f0f0f0;border:1px solid #ccc;border-radius:4px;font-size:14px;text-align:left;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#333}.model-selector-button:hover{background-color:#e5e5e5}.model-selector-button:disabled{opacity:.7;cursor:not-allowed}.model-dropdown{position:absolute;top:100%;left:0;width:100%;max-height:300px;overflow-y:auto;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 2px 10px #0000001a;z-index:100}.model-option{padding:8px 12px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;color:#333}.model-option:hover{background-color:#f5f5f5}.model-option.selected{background-color:#e0f0ff;font-weight:700}.clear-button,.save-button{padding:8px 12px;background-color:#f0f0f0;border:1px solid #ccc;border-radius:4px;font-size:14px;cursor:pointer;color:#333}.clear-button:hover,.save-button:hover{background-color:#e5e5e5}.save-button{padding:8px 12px;background-color:#64748b;border:1px solid #64748b;border-radius:4px;font-size:14px;cursor:pointer;color:#fff}.save-button:hover{background-color:#475569}.typing-indicator{display:flex;align-items:center;justify-content:center;padding:5px 2px;gap:4px}.typing-indicator span{width:8px;height:8px;border-radius:50%;background:#666;display:inline-block;animation:typing 1.2s infinite ease-in-out;opacity:.6}.typing-indicator span:nth-child(1){animation-delay:0s}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{transform:translateY(0);opacity:.6}30%{transform:translateY(-6px);opacity:1}}.loading-message{background-color:#e2e8f0;min-width:60px;margin-bottom:0;animation:pulse 2s infinite ease-in-out}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.error-message{padding:10px 15px;color:#e53e3e;text-align:center;margin-bottom:10px;flex-shrink:0}.user-message-appearing{animation:slide-in-right .3s ease forwards;opacity:0;transform:translate(20px)}.assistant-message-appearing{animation:slide-in-left .3s ease forwards;opacity:0;transform:translate(-20px)}@keyframes slide-in-right{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slide-in-left{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.loading-message-container{animation:fade-in .5s ease}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media (max-width: 768px){.salon-app-container{padding:10px;height:100%;width:100%;max-height:100%}.salon-header{flex-wrap:wrap;margin-bottom:5px}.salon-chat-container{flex:1 1 auto;display:flex;flex-direction:column}.salon-header-controls{width:100%;margin-top:10px;justify-content:space-between}.model-selector{min-width:150px}.salon-message{max-width:85%}.salon-message-form{padding:10px}}@media (max-width: 480px){.salon-app-container{padding:5px}.model-selector{min-width:120px}.model-selector-button,.clear-button,.save-button{padding:6px 8px;font-size:12px}.salon-message{padding:8px 12px}.message-content{font-size:.9rem}}@supports (-webkit-touch-callout: none){.salon-app-container{height:-webkit-fill-available;padding-bottom:env(safe-area-inset-bottom,20px)}.salon-message-form{padding-bottom:calc(15px + env(safe-area-inset-bottom,20px));margin-bottom:env(safe-area-inset-bottom,0);position:fixed;bottom:0;left:0;right:0;max-width:800px;margin-left:auto;margin-right:auto;width:calc(100% - 20px)}.salon-messages{padding-bottom:70px}body{overflow:hidden;width:100vw;height:100vh;position:fixed;-webkit-overflow-scrolling:touch}}