:root{
  --bg:#ffffff;--surface:#ffffff;--surface-soft:#f7f7f8;--sidebar:#f9f9f9;--text:#202123;--muted:#6e6e80;--line:#e5e5e7;
  --accent:#111827;--accent-soft:#ececf1;--ai:#f7f7f8;--danger:#c13333;--danger-soft:#fff1f1;--ok:#1f8a5b;
  --shadow:0 14px 38px rgba(0,0,0,.10);--radius:13px;
}
[data-theme="dark"]{
  --bg:#212121;--surface:#212121;--surface-soft:#2b2b2b;--sidebar:#171717;--text:#ececec;--muted:#aaa;--line:#343434;
  --accent:#ececec;--accent-soft:#333;--ai:#2f2f2f;--danger:#ff8585;--danger-soft:#432525;--ok:#55cf92;--shadow:0 14px 38px rgba(0,0,0,.36);
}
*{box-sizing:border-box}html,body{min-height:100%;margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}

.auth-shell{min-height:100vh;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 50% 0,rgba(130,130,130,.09),transparent 33%)}
.auth-card{width:min(100%,510px);padding:34px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}
.brand{display:flex;align-items:center;min-width:0;gap:10px}.brand-mark{display:grid;place-items:center;flex:0 0 auto;width:35px;height:35px;border-radius:10px;background:var(--text);color:var(--surface);font-size:.79rem;font-weight:850;letter-spacing:-.04em}.brand h1{font-size:1rem;margin:0;letter-spacing:-.02em}.brand p{margin:2px 0 0;color:var(--muted);font-size:.75rem}.auth-brand{margin-bottom:30px}.auth-copy h2{margin:0;font-size:1.5rem;letter-spacing:-.04em}.auth-copy p{margin:9px 0 24px;color:var(--muted);line-height:1.5}
label{display:flex;flex-direction:column;gap:7px;font-size:.85rem;font-weight:700}input,textarea,select{width:100%;border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:var(--surface);color:var(--text);outline:0;resize:vertical}input:focus,textarea:focus,select:focus{border-color:var(--muted);box-shadow:0 0 0 3px color-mix(in srgb,var(--muted) 15%,transparent)}.auth-card form{display:grid;gap:15px}.optional{font-size:.76rem;font-weight:500;color:var(--muted)}
.btn{min-height:40px;border:1px solid var(--line);border-radius:10px;padding:9px 13px;background:var(--surface);color:var(--text);font-weight:720;transition:background .15s ease,border .15s ease,transform .15s ease}.btn:hover:not(:disabled){background:var(--surface-soft);transform:translateY(-1px)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.primary{border-color:var(--text);background:var(--text);color:var(--surface)}.btn.plain{background:transparent}.btn.danger-outline{border-color:color-mix(in srgb,var(--danger) 45%,var(--line));color:var(--danger);background:var(--danger-soft)}.compact{min-height:35px;padding:6px 10px;font-size:.82rem}

.app-shell{height:100vh;min-height:620px;display:grid;grid-template-columns:272px minmax(0,1fr);overflow:hidden}.sidebar{display:flex;flex-direction:column;min-width:0;gap:12px;padding:12px 10px 10px;background:var(--sidebar);border-right:1px solid var(--line);overflow:hidden}.sidebar-brand-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 5px 8px}.sidebar-icon,.small-icon,.title-icon{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:1.05rem}.sidebar-icon:hover,.small-icon:hover,.title-icon:hover{background:var(--surface-soft);color:var(--text)}.new-chat-button{width:100%;height:42px;display:flex;align-items:center;justify-content:flex-start;gap:10px;border:1px solid var(--line);border-radius:10px;padding:0 12px;color:var(--text);background:var(--surface);font-size:.88rem;font-weight:700}.new-chat-button:hover{background:var(--surface-soft)}.new-chat-button span{font-size:1.15rem;font-weight:400}
.sidebar-section{min-height:0}.project-section{margin-top:5px}.chats-section{flex:1;display:flex;flex-direction:column;overflow:hidden}.section-head{height:31px;display:flex;align-items:center;justify-content:space-between;padding:0 7px;color:var(--muted);font-size:.73rem;font-weight:760;text-transform:uppercase;letter-spacing:.055em}.project-list,.chat-list{display:flex;flex-direction:column;gap:2px;overflow:auto;padding:0 1px}.chat-list{flex:1}.project-row,.chat-row{position:relative;display:flex;align-items:center;min-width:0;width:100%;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text);text-align:left}.project-row{min-height:37px;padding:7px 30px 7px 9px}.chat-row{min-height:38px;padding:7px 31px 7px 10px}.project-row:hover,.chat-row:hover{background:var(--surface-soft)}.project-row.active,.chat-row.active{background:var(--accent-soft);border-color:color-mix(in srgb,var(--muted) 15%,transparent)}.project-icon{margin-right:8px;font-size:.86rem}.project-name,.chat-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.85rem}.project-count{margin-left:auto;color:var(--muted);font-size:.73rem}.chat-icon{margin-right:8px;color:var(--muted);font-size:.86rem}.project-menu,.delete-chat{position:absolute;right:4px;display:grid;place-items:center;width:26px;height:26px;padding:0;border:0;border-radius:7px;background:transparent;color:var(--muted);opacity:0}.project-row:hover .project-menu,.project-row.active .project-menu,.chat-row:hover .delete-chat,.chat-row.active .delete-chat{opacity:1}.project-menu:hover{background:var(--surface);color:var(--text)}.delete-chat:hover{background:var(--danger-soft);color:var(--danger)}.sidebar-footer{display:grid;gap:4px;margin-top:auto;padding-top:8px;border-top:1px solid var(--line)}.connection{display:flex;align-items:center;gap:8px;padding:9px 10px;color:var(--muted);font-size:.75rem}.dot{display:block;width:8px;height:8px;border-radius:50%;background:#949494;box-shadow:0 0 0 3px color-mix(in srgb,#949494 15%,transparent)}.dot.online{background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 15%,transparent)}.dot.error{background:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 15%,transparent)}.sidebar-action{display:flex;align-items:center;gap:9px;height:37px;border:0;border-radius:8px;padding:0 10px;background:transparent;color:var(--text);text-align:left;font-size:.84rem}.sidebar-action:hover{background:var(--surface-soft)}

.workspace{position:relative;display:flex;min-width:0;flex-direction:column;min-height:0;background:var(--bg)}.topbar{height:62px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 20px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 90%,transparent);backdrop-filter:blur(8px)}.chat-heading{min-width:0}.title-line{display:flex;align-items:center;gap:5px}.chat-heading h2{max-width:min(500px,55vw);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.98rem;letter-spacing:-.02em}.subline{display:flex;align-items:center;gap:6px;margin-top:3px;color:var(--muted);font-size:.72rem}.subline-divider{opacity:.6}.topbar-actions{display:flex;align-items:center;gap:8px}.move-select-wrap{flex-direction:row;align-items:center;gap:6px;width:auto;min-height:33px;padding:0 8px;border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:.72rem;font-weight:650}.move-select-wrap select{width:auto;max-width:160px;border:0;border-radius:0;padding:0;background:transparent;font-size:.76rem}.topbar-button{min-height:33px;border:1px solid var(--line);border-radius:8px;padding:0 9px;background:var(--surface);color:var(--text);font-size:.78rem;font-weight:700}.topbar-button:hover{background:var(--surface-soft)}.topbar-button.danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 35%,var(--line))}
.messages{flex:1;overflow:auto;width:min(860px,100%);margin:0 auto;padding:28px 24px 170px;display:flex;flex-direction:column;gap:24px;scroll-behavior:smooth}.message{display:grid;grid-template-columns:30px minmax(0,1fr);gap:11px;max-width:100%;padding:0 2px}.message-avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--text);color:var(--surface);font-size:.68rem;font-weight:840}.message.user .message-avatar{background:#5b7cfd;color:#fff}.message-content{min-width:0}.message-meta{display:flex;align-items:center;gap:7px;margin:2px 0 7px;font-size:.81rem;font-weight:750}.message-time{font-size:.7rem;color:var(--muted);font-weight:500}.bubble{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.62;font-size:.94rem}.message.assistant .bubble{padding:0}.message.user .bubble{padding:12px 14px;border-radius:14px;background:var(--ai);border:1px solid var(--line)}.message.streaming .bubble::after{content:'▋';display:inline-block;margin-left:3px;opacity:.55;animation:blink 1s steps(2,start) infinite}@keyframes blink{50%{opacity:0}}
.empty-state{width:min(690px,100%);margin:auto;padding:30px 20px 125px;text-align:center}.empty-mark{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 16px;border-radius:14px;background:var(--text);color:var(--surface);font-size:.79rem;font-weight:850}.empty-state h3{margin:0;font-size:1.75rem;letter-spacing:-.05em}.empty-state p{max-width:470px;margin:10px auto 23px;color:var(--muted);font-size:.92rem;line-height:1.5}.starter-prompts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.starter{min-height:68px;border:1px solid var(--line);border-radius:11px;padding:10px;background:var(--surface);color:var(--text);text-align:left;font-size:.81rem;line-height:1.35}.starter:hover{background:var(--surface-soft);border-color:var(--muted)}
.composer-shell{position:absolute;z-index:2;right:0;bottom:0;left:0;display:grid;justify-items:center;padding:44px 16px 13px;background:linear-gradient(to top,var(--bg) 72%,transparent)}.composer{display:flex;align-items:flex-end;gap:8px;width:min(820px,100%);padding:7px 8px 7px 14px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 8px 28px rgba(0,0,0,.08)}.composer textarea{min-height:42px;max-height:190px;border:0;border-radius:0;padding:10px 0;background:transparent;box-shadow:none!important;resize:none;line-height:1.45}.composer-actions{display:flex;align-items:center;gap:7px;padding-bottom:1px}.send-button{display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:10px;background:var(--text);color:var(--surface);font-size:1.16rem;font-weight:700;line-height:1}.send-button:disabled{opacity:.45;cursor:not-allowed}.stop-button{height:34px;border:1px solid var(--line);border-radius:10px;padding:0 10px;background:var(--surface-soft);color:var(--text);font-size:.77rem;font-weight:720}.stop-button:hover:not(:disabled){border-color:var(--muted)}.stop-button:disabled{opacity:.65}.stop-button span{margin-right:4px;font-size:.65rem}.composer-note{margin:9px 0 0;color:var(--muted);font-size:.69rem}

.dialog{width:min(880px,calc(100% - 28px));max-height:calc(100vh - 32px);border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--text);box-shadow:var(--shadow);padding:0}.project-dialog{width:min(600px,calc(100% - 28px))}.dialog::backdrop{background:rgba(0,0,0,.46);backdrop-filter:blur(3px)}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 22px 16px;border-bottom:1px solid var(--line)}.dialog-head h2{margin:0;font-size:1.08rem;letter-spacing:-.02em}.dialog-head p{margin:5px 0 0;color:var(--muted);font-size:.8rem;line-height:1.42}.icon-button{display:grid;place-items:center;width:31px;height:31px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font-size:1.15rem}.icon-button:hover{background:var(--surface-soft)}.dialog-body{padding:20px 22px}.form-stack{display:grid;gap:16px}.dialog-footer{display:flex;align-items:center;gap:9px;padding:16px 22px;border-top:1px solid var(--line)}.footer-space{flex:1}.tabs{display:flex;gap:6px;padding:12px 22px 0}.tab{border:0;border-bottom:2px solid transparent;padding:8px 6px;background:transparent;color:var(--muted);font-size:.83rem;font-weight:760}.tab.active{border-color:var(--text);color:var(--text)}.tab-page{max-height:calc(100vh - 180px);overflow:auto;padding:20px 22px 23px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.span-all{grid-column:1/-1}.button-line{display:flex;align-items:center;justify-content:flex-end;gap:10px}.model-results{padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft);font-size:.84rem}.model-chip{display:inline-block;margin:6px 5px 0 0;border:1px solid var(--line);border-radius:8px;padding:5px 8px;background:var(--surface);color:var(--text);font-size:.77rem}.model-chip:hover{background:var(--accent-soft)}.create-user{display:grid;grid-template-columns:1fr 1fr 145px auto;gap:11px;align-items:end;padding-bottom:20px;border-bottom:1px solid var(--line)}.user-list{display:grid;gap:8px;padding-top:15px}.user-card{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft)}.user-card h4{margin:0;font-size:.9rem}.user-card p{margin:4px 0 0;color:var(--muted);font-size:.76rem}.user-actions{display:flex;align-items:center;gap:7px}.badge{padding:3px 7px;border-radius:999px;background:var(--accent-soft);color:var(--text);font-size:.7rem;font-weight:800}.inactive{opacity:.55}.toast{position:fixed;z-index:20;bottom:22px;left:50%;transform:translateX(-50%);max-width:min(580px,calc(100% - 28px));padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);box-shadow:var(--shadow);font-size:.84rem}.toast.error{border-color:color-mix(in srgb,var(--danger) 45%,var(--line));color:var(--danger)}

/* Mobile navigation drawer */
.sidebar-header-actions{display:flex;align-items:center;gap:2px}.mobile-menu-button,.mobile-close-button,.sidebar-backdrop{display:none}.topbar-start{display:flex;align-items:center;min-width:0;gap:8px}

@media(max-width:820px){
  html,body{height:100%;overflow:hidden}
  body.mobile-sidebar-open{overflow:hidden}
  .app-shell{display:block;height:100dvh;min-height:100dvh;overflow:hidden}
  .sidebar{position:fixed;z-index:100;top:0;bottom:0;left:0;width:min(86vw,330px);height:100dvh;max-height:none;border-right:1px solid var(--line);border-bottom:0;box-shadow:var(--shadow);transform:translateX(-104%);transition:transform .22s ease;will-change:transform}
  .app-shell.sidebar-open .sidebar{transform:translateX(0)}
  .sidebar-backdrop{display:block;position:fixed;z-index:99;inset:0;width:100%;height:100%;border:0;background:rgba(0,0,0,.46);opacity:0;pointer-events:none;transition:opacity .22s ease}
  .app-shell.sidebar-open .sidebar-backdrop{opacity:1;pointer-events:auto}
  .mobile-menu-button,.mobile-close-button{display:grid;place-items:center;flex:0 0 auto;width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--text);font-size:1.28rem;line-height:1}
  .mobile-menu-button:hover,.mobile-close-button:hover{background:var(--surface-soft)}
  .mobile-close-button{font-size:1.45rem}
  .project-list{max-height:35vh}
  .chats-section{max-height:none;flex:1}
  .sidebar-footer{grid-template-columns:1fr auto auto;align-items:center}
  .connection{padding:7px}
  .workspace{height:100dvh;min-height:100dvh}
  .topbar{height:60px;padding:9px 12px;gap:10px}
  .topbar-start{flex:1;min-width:0}
  .chat-heading{min-width:0}
  .chat-heading h2{max-width:calc(100vw - 185px)}
  .move-select-wrap span{display:none}
  .move-select-wrap select{max-width:105px}
  .messages{min-height:0;padding:22px 14px 170px}
  .composer-shell{position:absolute;bottom:0}
  .starter-prompts{grid-template-columns:1fr}
  .empty-state{padding-bottom:50px}
  .create-user,.form-grid{grid-template-columns:1fr}
  .span-all{grid-column:auto}
  .button-line{justify-content:stretch}
  .button-line .btn{flex:1}
}
@media(max-width:480px){
  .topbar-actions{gap:5px}
  .topbar-button{display:none}
  .chat-heading h2{max-width:calc(100vw - 164px)}
  .sidebar-footer{grid-template-columns:1fr 1fr}
  .connection{grid-column:1/-1}
  .stop-button{font-size:0;width:34px;padding:0}
  .stop-button span{margin:0;font-size:.68rem}
  .composer{border-radius:16px}
  .empty-state h3{font-size:1.45rem}
}

/* Code presentation: explanation text stays plain; fenced code gets its own editor-style card. */
.bubble{white-space:normal}
.message-prose{display:grid;gap:10px;max-width:100%}
.message-paragraph{margin:0;white-space:normal;overflow-wrap:anywhere;line-height:1.68}
.message-paragraph:empty{display:none}
.inline-code{padding:.13em .37em;border:1px solid color-mix(in srgb,var(--line) 82%,transparent);border-radius:6px;background:color-mix(in srgb,var(--ai) 88%,#8b5cf6 12%);color:var(--text);font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;font-size:.89em;line-height:1.35}
.code-block{position:relative;margin:14px 0 6px;overflow:hidden;border:1px solid #30354b;border-radius:13px;background:#171923;color:#d8deeb;box-shadow:0 10px 22px rgba(0,0,0,.16)}
.message.user .code-block{margin-top:12px}
.code-toolbar{display:flex;align-items:center;justify-content:space-between;min-height:40px;padding:0 9px 0 13px;border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(90deg,#202537,#191c28)}
.code-language{overflow:hidden;max-width:66%;color:#9eaaf7;font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;font-size:.72rem;font-weight:760;letter-spacing:.045em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}
.copy-code-button{min-height:29px;border:1px solid rgba(190,198,255,.24);border-radius:7px;padding:3px 10px;background:rgba(122,132,208,.12);color:#dce1ff;font-size:.72rem;font-weight:760;transition:background .14s ease,border-color .14s ease,transform .14s ease}
.copy-code-button:hover{border-color:rgba(190,198,255,.58);background:rgba(122,132,208,.27);transform:translateY(-1px)}
.copy-code-button.copied{border-color:rgba(82,222,153,.6);background:rgba(47,179,112,.18);color:#a6f0c7}
.code-block pre{max-width:100%;margin:0;overflow:auto;padding:16px 17px 18px;background:transparent;color:inherit;tab-size:2}
.code-block code{display:block;min-width:max-content;font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;font-size:.83rem;line-height:1.65;text-shadow:none}
.token.comment,.token.prolog,.token.doctype,.token.cdata{color:#77829f;font-style:italic}
.token.punctuation{color:#aeb8ce}
.token.property,.token.tag,.token.constant,.token.symbol,.token.deleted{color:#f38ba8}
.token.boolean,.token.number{color:#fab387}
.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:#a6e3a1}
.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string{color:#94e2d5}
.token.atrule,.token.attr-value,.token.keyword{color:#cba6f7}
.token.function,.token.class-name{color:#89b4fa}
.token.regex,.token.important,.token.variable{color:#f9e2af}
.token.important,.token.bold{font-weight:800}
.token.italic{font-style:italic}
.token.entity{cursor:help}
@media(max-width:480px){.code-block{border-radius:11px}.code-block pre{padding:13px 12px 15px}.code-block code{font-size:.76rem;line-height:1.58}.code-toolbar{min-height:37px}.copy-code-button{min-height:27px;padding:3px 8px;font-size:.69rem}}

/* Sticky code-card toolbar: keep the Copy all button visible while long code is scrolled. */
.code-block{
  display:flex;
  flex-direction:column;
  max-height:min(650px,68vh);
}
.code-toolbar{
  position:relative;
  z-index:2;
  flex:0 0 auto;
}
.code-block pre{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
}
@media(max-width:820px){
  .code-block{max-height:54dvh;}
  .code-toolbar{min-height:42px;}
  .code-block pre{padding:14px 15px 17px;}
}