| @charset "UTF-8";body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;height:100vh;overflow-y:auto;overflow-x:hidden}:root{--background: #f0f0f0;--chat-background: #ffffff;--message-user-bg: #0a7cff;--message-spoiler-bg: #0850a3;--message-spoiler-hover-bg: #023d80;--message-user-color: #ffffff;--message-assistant-bg: #e6e6e6;--message-assistant-color: #333;--input-bg: #ffffff;--input-border: #ccc;--input-shadow: rgba(0, 0, 0, .05);--input-focus: rgba(10, 124, 255, .2);--text-color: #333;--link-color: #0a7cff;--sidebar-width: 350px;--min-chat-width: 600px;--max-chat-width: 1080px;--login-bg: #f5f5f5;--login-form-bg: #ffffff;--login-text-color: #333;--login-label-color: #555;--login-input-border: #ddd;--login-input-focus: #28a745;--login-button-bg: #28a745;--login-button-hover: #218838;--login-button-disabled: #6c757d;--login-error-color: #dc3545}@media (prefers-color-scheme: dark){:root{--background: #202123;--chat-background: #343541;--message-user-bg: #0a7cff;--message-spoiler-bg: #0850a3;--message-spoiler-hover-bg: #023d80;--message-user-color: #ffffff;--message-assistant-bg: #444654;--message-assistant-color: #d1d5db;--input-bg: #40414f;--input-border: #565869;--input-shadow: rgba(0, 0, 0, .2);--input-focus: rgba(10, 124, 255, .3);--text-color: #d1d5db;--link-color: #4dabf7;--login-bg: #202123;--login-form-bg: #343541;--login-text-color: #d1d5db;--login-label-color: #a0a0a0;--login-input-border: #565869;--login-input-focus: #2ecc71;--login-button-bg: #2ecc71;--login-button-hover: #27ae60;--login-button-disabled: #4b5e6e;--login-error-color: #ff6b6b}}body{background:var(--background);color:var(--text-color)}.app-container{min-height:100vh;background:var(--background)}.chat-sidebar.visible~.toolbar{left:var(--sidebar-width);right:calc(-1 * var(--sidebar-width))}.logout-button{padding:10px 20px;background:none;color:var(--text-color);border:none;border-radius:8px;cursor:pointer;font-size:14px;transition:background .2s;text-decoration:none}.logout-button:hover{text-decoration:underline;background:none}.chat-layout{display:flex;width:100%;box-sizing:border-box;position:relative;margin:0 auto}.chat-sidebar{position:sticky;height:100vh;background:var(--chat-background);transition:transform .3s ease-in-out;width:var(--sidebar-width);max-width:var(--sidebar-width);min-width:var(--sidebar-width);padding:40px 20px 20px;box-shadow:2px 0 5px var(--input-shadow);z-index:3000;box-sizing:border-box;display:flex;flex:1;flex-direction:column;transform:translate(-100%);left:0;top:0}.chat-sidebar.visible{position:sticky;transform:translate(0);left:0;top:0}@media (max-width: 1000px){.chat-sidebar.visible{display:flex;position:fixed}}.chat-sidebar .sidebar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.chat-sidebar button{display:block;width:auto;margin-bottom:0}.chat-sidebar .toggle{padding:5px;font-size:16px}.chat-sidebar ul{list-style:none;padding:0;margin:0;max-height:calc(100% - 60px);overflow-y:auto;flex:1}.chat-sidebar li{display:flex;align-items:center;justify-content:space-between;padding:10px;cursor:pointer}.chat-sidebar li.active{background:var(--message-assistant-bg);color:var(--message-assistant-color)}.chat-sidebar li .chat-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-sidebar li .chat-input{flex:1;padding:5px;font-size:14px;border:1px solid var(--input-border);border-radius:4px;background:var(--input-bg);color:var(--text-color)}.chat-sidebar li .chat-actions{display:flex;gap:5px}.chat-sidebar li .icon-button{background:none;border:none;padding:5px;cursor:pointer;color:var(--text-color);transition:color .2s}.chat-sidebar li .icon-button:hover{color:var(--link-color)}.chat-sidebar li .icon-button.delete:hover{color:#ff4d4f}.chat-sidebar .sidebar-footer{margin-top:10px}.chat-content{display:flex;flex:1;flex-direction:column;min-height:100vh;background:var(--chat-background);transition:left .3s ease-in-out;max-width:1080px;min-width:var(--min-chat-width);margin:0 auto;position:relative;left:-175px}@media (max-width: 1000px){.chat-content.sidebar-open{left:0}}@media (max-width: 1000px){.chat-content{left:-350px;min-width:100%}}@media (max-width: 1800px){.chat-content.sidebar-open{left:0}}@media (max-width: 1000px){.chat-content{transition:none}}.sidebar-toggle-wrapper{position:fixed;right:0;left:0;top:10px;margin:0 auto;max-width:var(--max-chat-width);z-index:2000}.sidebar-toggle-close{background:var(--chat-background);border:none;padding:10px;border-radius:8px;cursor:pointer;color:var(--text-color);font-size:16px;z-index:998;box-shadow:0 2px 5px var(--input-shadow);transition:background .2s}.sidebar-toggle-close:hover{background:var(--message-assistant-bg)}.sidebar-toggle-open{background:var(--message-user-bg);border:none;padding:10px;border-radius:8px;cursor:pointer;color:var(--message-user-color);font-size:16px;z-index:998;box-shadow:0 2px 5px var(--input-shadow);transition:background .2s}.sidebar-toggle-open:hover{background:var(--message-spoiler-hover-bg)}.fixed-buttons{position:fixed;top:10px;left:10px;display:flex;gap:10px;z-index:3500;width:50px}.new-chat-button,.sidebar-toggle{background:var(--message-user-bg);border:none;padding:10px;border-radius:8px;cursor:pointer;color:var(--message-user-color);font-size:16px;box-shadow:0 2px 5px var(--input-shadow);transition:background .2s;width:40px;height:40px}.new-chat-button:hover,.sidebar-toggle:hover{background:var(--message-spoiler-hover-bg)}.messages{flex:1;padding:40px 20px 160px;display:flex;flex-direction:column;background:var(--background);width:100%;box-sizing:border-box;overflow-y:auto}.message{margin:8px 0;padding:12px 16px;border-radius:10px;max-width:80%;line-height:1.5;font-size:16px}.message.user{background:var(--message-user-bg);color:var(--message-user-color);align-self:flex-end}.message.assistant{background:var(--message-assistant-bg);color:var(--message-assistant-color);align-self:flex-start}.message p{margin:0 0 8px}.message p:last-child{margin-bottom:0}.input-area{position:sticky;bottom:0;left:0;right:0;display:flex;align-items:center;padding:15px 20px;background:var(--input-bg);box-shadow:0 -2px 10px var(--input-shadow);gap:20px;max-width:1080px;width:100%;margin:0 auto;box-sizing:border-box;border-radius:10px;transition:left .3s ease-in-out,max-width .3s ease-in-out}.input-wrapper{flex:1}textarea{width:100%;padding:12px;border:1px solid var(--input-border);border-radius:8px;outline:none;box-sizing:border-box;resize:none;min-height:100px;font-size:16px;background:var(--input-bg);color:var(--text-color);box-shadow:inset 0 1px 2px var(--input-shadow)}textarea:focus{border-color:var(--message-user-bg);box-shadow:0 0 0 2px var(--input-focus)}.buttons{display:flex;flex-direction:column;align-items:center;gap:20px}button{padding:10px 20px;background:var(--message-user-bg);color:var(--message-user-color);border:none;border-radius:8px;cursor:pointer;font-size:14px;transition:background .2s}button:hover{background:#0966cc}.send-button,.stop-button{min-height:60px}.clear-link{color:var(--link-color);font-size:14px;text-decoration:none;cursor:pointer}.clear-link:hover{text-decoration:underline}.loading-dots{display:inline-flex;gap:4px;align-items:center}.loading-dot{width:6px;height:6px;background-color:var(--message-assistant-color);border-radius:50%;animation:bounce 1.2s infinite ease-in-out}.loading-dot:nth-child(2){animation-delay:.2s}.loading-dot:nth-child(3){animation-delay:.4s}@keyframes bounce{0%,to{transform:translateY(0);opacity:.6}50%{transform:translateY(-6px);opacity:1}}@media (prefers-color-scheme: dark){.loading-dot{background-color:var(--message-assistant-color)}}.message.loading{opacity:.7;display:flex;align-items:center}.error-toast{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#ff4d4f;color:#fff;padding:10px 20px;border-radius:8px;box-shadow:0 2px 10px #0003;z-index:1000;font-size:14px;max-width:90%;text-align:center}.spoiler{margin:5px 0;border-radius:10px;background-color:var(--message-spoiler-bg)}.spoiler-toggle{background-color:var(--message-spoiler-bg);border:none;padding:5px 10px;cursor:pointer;width:100%;text-align:left}.spoiler-toggle:hover{background-color:var(--message-spoiler-hover-bg)}.spoiler-content{padding:10px}.login-page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background-color:var(--login-bg);color:var(--login-text-color)}.login-page h2{margin-bottom:20px;font-size:24px;color:var(--login-text-color)}.login-page form{display:flex;flex-direction:column;gap:15px;width:300px;padding:20px;background-color:var(--login-form-bg);border-radius:8px;box-shadow:0 2px 5px #0000001a}.login-page form div{display:flex;flex-direction:column}.login-page form div label{margin-bottom:5px;font-size:14px;color:var(--login-label-color)}.login-page form div input{padding:8px;font-size:16px;border:1px solid var(--login-input-border);border-radius:4px;outline:none;background-color:var(--input-bg);color:var(--text-color)}.login-page form div input:focus{border-color:var(--login-input-focus)}.login-page form .error{color:var(--login-error-color);font-size:14px;text-align:center}.login-page form button{padding:10px;font-size:16px;background-color:var(--login-button-bg);color:#fff;border:none;border-radius:4px;cursor:pointer}.login-page form button:hover{background-color:var(--login-button-hover)}.login-page form button:disabled{background-color:var(--login-button-disabled);cursor:not-allowed}.confirm-dialog{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--chat-background);padding:20px;border-radius:8px;box-shadow:0 2px 10px var(--input-shadow);z-index:4000;display:flex;flex-direction:column;align-items:center}.confirm-dialog .buttons{display:flex;flex-direction:row;justify-content:space-between;width:100%}.confirm-dialog p{margin:20px 0;width:100%;text-align:center}.confirm-dialog button{margin:0 5px;width:40%}.confirm-dialog .buttons button:first-child{background:#ff4d4f}.confirm-dialog .buttons button:last-child{background:var(--message-user-bg)}.confirm-dialog .buttons button:last-child:hove r{background:var(--message-spoiler-bg)}.chat-sidebar .sidebar-footer .delete-all-button{background:#ff4d4f;color:#fff;margin-bottom:10px}.chat-sidebar .sidebar-footer .delete-all-button:hover{background:#e63946} | |