:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#222428;background:#fff;font-synthesis:none;text-rendering:optimizeLegibility;--ink:#222428;--subtle:#737780;--line:#e9e9e7;--soft:#f6f6f4;--accent:#5742a2;--sidebar:#f7f7f5}
*{box-sizing:border-box}
body{margin:0;min-width:320px;min-height:100vh;background:#fff}
button,textarea,select{font:inherit}
button{color:inherit}
.app-shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.sidebar{position:sticky;top:0;display:flex;flex-direction:column;height:100vh;padding:20px 14px 14px;background:var(--sidebar);border-right:1px solid #efefed}
.brand{display:flex;align-items:center;gap:10px;margin:0 7px 25px;color:var(--ink);text-decoration:none}
.brand-mark,.welcome-mark,.model-orb{display:grid;place-items:center;background:#5d4aa4;color:white;font-family:Georgia,serif;font-weight:700}
.brand-mark{width:29px;height:29px;border-radius:9px;font-size:22px;line-height:1}
.brand-name{font-size:17px;font-weight:650;letter-spacing:-.06em}
.brand-version{margin-left:5px;color:#86858b;font-size:11px;font-weight:500;letter-spacing:.01em}
.new-chat{height:39px;display:flex;align-items:center;gap:10px;padding:0 11px;border:1px solid #e3e3e0;border-radius:8px;background:#fff;font-size:13px;font-weight:550;text-align:left;cursor:pointer;transition:background .15s,border-color .15s}
.new-chat:hover,.workspace-item:hover{background:#efefec;border-color:#d8d8d4}
.new-chat span{font-size:18px;color:#5c4a9d;font-weight:400}
.sidebar-label{margin:30px 9px 10px;color:#8a8b8d;font-size:10px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.workspace-item{height:36px;display:flex;align-items:center;gap:10px;padding:0 10px;border-radius:7px;background:#ecebe8;color:#33333a;font-size:12px;font-weight:550}
.chat-icon{font-size:14px;color:#77777b}
.sidebar-bottom{margin-top:auto}
.model-card{display:flex;align-items:center;gap:10px;padding:11px 9px;border-top:1px solid #e7e7e4}
.model-orb{width:28px;height:28px;border-radius:50%;font-size:18px}
.model-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}
.model-copy strong{font-size:11px;font-weight:650}
.model-copy small{overflow:hidden;color:var(--subtle);font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.model-dot,.privacy-dot{width:7px;height:7px;border-radius:50%;background:#3b9c70}
.model-dot.loading{background:#c3a53f;animation:pulse 1.4s ease-in-out infinite}
.model-dot.error{background:#cb5959}
@keyframes pulse{50%{opacity:.4}}
.model-link{display:block;padding:7px 9px;color:#72737a;font-size:10px;text-decoration:none}
.model-link:hover{color:var(--accent)}
.main-panel{position:relative;display:flex;min-height:100vh;flex-direction:column;background:#fff}
.topbar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 25px;border-bottom:1px solid #f1f1ef;background:#ffffffed}
.topbar-title{display:flex;align-items:center;gap:10px;font-size:12px}
.topbar-title strong{font-weight:650}
.topbar-title span{padding:4px 7px;border:1px solid #eae9e6;border-radius:99px;color:#6f7076;font-size:10px}
.settings{position:relative}
.settings summary{display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid transparent;border-radius:7px;color:#66676d;font-size:11px;list-style:none;cursor:pointer}
.settings summary::-webkit-details-marker{display:none}
.settings summary:hover,.settings[open] summary{border-color:#e9e8e5;background:#fafaf9;color:#333}
.settings-popover{position:absolute;z-index:5;top:39px;right:0;width:270px;padding:15px;border:1px solid #e7e6e3;border-radius:10px;background:#fff;box-shadow:0 12px 35px #00000014}
.settings-popover label{display:block;margin:0 0 7px;color:#4d4e53;font-size:11px;font-weight:600}
.settings-popover textarea,.settings-popover select{width:100%;padding:9px;border:1px solid #e3e2df;border-radius:7px;background:#fff;color:#27282c;font-size:12px;outline:none}
.settings-popover textarea{resize:vertical;line-height:1.45}
.settings-popover select{margin:7px 0 0}
.settings-popover label:not(:first-child){margin-top:14px}
.settings-popover p{margin:11px 0 0;color:#898a8e;font-size:10px}
.chat-area{display:flex;width:100%;max-width:850px;flex:1;flex-direction:column;margin:0 auto;padding:26px 34px 20px;overflow-y:auto}
.welcome{width:100%;max-width:610px;margin:auto;transform:translateY(-24px);text-align:center}
.welcome-mark{width:45px;height:45px;margin:0 auto 19px;border-radius:15px;font-size:34px}
.welcome h1{margin:0;color:#292a2e;font-size:25px;font-weight:570;letter-spacing:-.045em}
.welcome>p{margin:9px 0 27px;color:#808187;font-size:13px}
.suggestions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;text-align:left}
.suggestions button{min-height:80px;padding:11px;border:1px solid #e9e8e5;border-radius:9px;background:#fff;color:#3b3b40;font-size:11px;line-height:1.45;text-align:left;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.suggestions button:hover{transform:translateY(-1px);border-color:#d4d0e0;background:#fcfbff}
.suggestions button span{display:block;margin-bottom:6px;color:#8b7cab;font-size:9px;font-weight:650;letter-spacing:.04em;text-transform:uppercase}
.messages{width:100%;max-width:720px;margin:0 auto}
.message{display:grid;grid-template-columns:27px minmax(0,1fr);gap:12px;margin:0 0 26px;animation:appear .18s ease-out}
@keyframes appear{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.message.user{grid-template-columns:minmax(0,1fr);justify-items:end;margin:2px 0 25px}
.message-avatar{display:grid;place-items:center;width:25px;height:25px;margin-top:1px;border-radius:50%;background:#5d4aa4;color:#fff;font-family:Georgia,serif;font-size:17px;font-weight:700}
.message-body{min-width:0;padding-top:3px;color:#33343a;font-size:14px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere}
.message-body .markdown{white-space:normal}
.message-body .markdown p{margin:0 0 12px}
.message-body .markdown p:last-child{margin-bottom:0}
.message-body .markdown h2,.message-body .markdown h3,.message-body .markdown h4{margin:14px 0 7px;color:#292a2e;font-size:1em;font-weight:650}
.message-body .markdown ul,.message-body .markdown ol{margin:5px 0 13px;padding-left:24px}
.message-body .markdown li{padding-left:3px;margin:3px 0}
.message-body .markdown blockquote{margin:10px 0;padding:2px 0 2px 12px;border-left:2px solid #d7d2e3;color:#67686e}
.message-body .markdown blockquote p{margin:3px 0}
.message-body .markdown code{padding:2px 5px;border-radius:4px;background:#f1f0ee;color:#55467f;font:12px ui-monospace,SFMono-Regular,Consolas,monospace}
.message-body .markdown pre{overflow-x:auto;margin:11px 0;padding:13px;border:1px solid #e9e8e5;border-radius:8px;background:#f8f8f6;white-space:pre}
.message-body .markdown pre code{padding:0;background:transparent;color:#34343a}
.message-body .markdown a{color:#58488e;text-decoration:underline;text-underline-offset:2px}
.reasoning{margin:0 0 11px;color:#77727f;font-size:11px;line-height:1.6}
.reasoning summary{width:max-content;max-width:100%;padding:4px 8px;border:1px solid #eceaf0;border-radius:6px;background:#faf9fb;cursor:pointer;user-select:none}
.reasoning summary:hover{background:#f4f2f7;color:#51446f}
.reasoning-content{margin:8px 0 4px 5px;padding:2px 0 2px 12px;border-left:2px solid #ddd7e8;color:#77727f}
.reasoning[hidden]{display:none}
.message.user .message-body{max-width:min(82%,570px);padding:10px 14px;border-radius:15px 15px 4px 15px;background:#f1f0ee;color:#303136;line-height:1.6}
.message.assistant .message-body:empty:after{display:inline-block;width:5px;height:15px;background:#8e80b8;content:"";vertical-align:-2px;animation:pulse .85s steps(2,end) infinite}
.composer-wrap{width:100%;max-width:790px;margin:0 auto;padding:9px 29px 17px}
.composer{display:flex;align-items:flex-end;gap:10px;padding:10px 10px 10px 16px;border:1px solid #dededb;border-radius:16px;background:#fff;box-shadow:0 3px 14px #00000008;transition:border-color .15s,box-shadow .15s}
.composer:focus-within{border-color:#b9afcf;box-shadow:0 3px 16px #5d4aa410}
.composer textarea{width:100%;max-height:180px;min-height:25px;padding:3px 0;resize:none;border:0;background:transparent;color:#25262a;font-size:13px;line-height:1.55;outline:none}
.composer textarea::placeholder{color:#a0a0a3}
.composer button{display:grid;flex:0 0 30px;place-items:center;width:30px;height:30px;border:0;border-radius:9px;background:#5d4aa4;color:#fff;cursor:pointer;transition:background .15s,transform .15s}
.composer button:not(:disabled):hover{transform:translateY(-1px);background:#49388b}
.composer button:disabled{background:#d9d7df;cursor:not-allowed}
.composer button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.composer-meta{display:flex;justify-content:space-between;gap:12px;min-height:25px;padding:8px 3px 0;color:#8b8c91;font-size:10px}
.privacy-line{display:flex;align-items:center;justify-content:center;gap:7px;color:#9a9ba0;font-size:9px}
.privacy-dot{width:6px;height:6px}
.meta-divider{color:#c2c2c3}
@media(max-width:720px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.topbar{height:53px;padding:0 16px}.topbar-title{display:none}.mobile-brand{display:flex;align-items:center;gap:8px;font-size:12px}.mobile-brand .brand-mark{width:25px;height:25px;border-radius:8px;font-size:19px}.mobile-brand strong{font-weight:650}.mobile-brand strong span{color:#8a8b90;font-size:10px;font-weight:500}.chat-area{padding:21px 17px 14px}.composer-wrap{padding:8px 13px 12px}.suggestions{grid-template-columns:1fr}.suggestions button{min-height:57px}.welcome{transform:none}.welcome h1{font-size:22px}.welcome>p{font-size:12px;margin-bottom:19px}.suggestions button span{display:inline;margin:0 8px 0 0}.message{gap:9px}.message-body{font-size:13px}.composer-meta{font-size:9px}.composer-meta span:last-child{max-width:45%;text-align:right}.privacy-line{font-size:8px}}