:root{--bg:#0b0f14;--panel:#10161f;--panel2:#0d131b;--panel3:#151d28;--border:#263140;--text:#eef3f8;--muted:#8d9aac;--accent:#78a9ff;--accentbg:#152c4d;--danger:#ff7d86;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{overflow:hidden}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}
.app{height:100dvh;display:grid;grid-template-rows:52px minmax(0,1fr) 24px}.top{display:flex;align-items:center;gap:8px;padding:0 10px;border-bottom:1px solid var(--border);background:#090d12}.brand{display:flex;align-items:center;gap:8px;font-weight:800;white-space:nowrap}.mark{width:26px;height:26px;border:1px solid var(--border);border-radius:8px;display:grid;place-items:center;background:var(--panel2);font-size:11px}.status{display:flex;gap:6px;flex:1;min-width:0;overflow:hidden}.pill{border:1px solid var(--border);background:var(--panel2);border-radius:999px;padding:5px 8px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pill.warn{border-color:#5b4a25}.pill.ok{border-color:#24573f}.pill.err{border-color:#6b2b34}.actions{display:flex;gap:6px}.btn,.icon{height:34px;border:1px solid var(--border);background:var(--panel2);border-radius:8px;padding:0 10px}.icon{width:34px;padding:0}.btn.primary{background:var(--accentbg)}.btn.danger{background:#3b171c;border-color:#6b2b34}.mobile{display:none}
.main{display:grid;grid-template-columns:240px minmax(0,1fr) 290px;min-height:0}.left,.right{background:var(--panel2);min-height:0;overflow:hidden}.left{border-right:1px solid var(--border)}.right{border-left:1px solid var(--border)}.head{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border-bottom:1px solid var(--border);font-size:10px;color:#c4ccd7;text-transform:uppercase}.scroll{height:calc(100% - 42px);overflow:auto;padding:10px}.center{min-height:0;display:grid;grid-template-rows:44px minmax(0,1fr) auto}.session{display:flex;align-items:center;gap:7px;padding:0 10px;border-bottom:1px solid var(--border)}.sessionTitle{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:800}
.messages{min-height:0;overflow:auto;padding:10px 8px 14px;-webkit-overflow-scrolling:touch}.inner{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:9px}.empty{min-height:100%;display:grid;place-items:center;padding:28px 12px}.emptyCard{max-width:620px;text-align:center}.emptyTitle{font-size:25px;font-weight:900}.emptySub{margin:8px 0 18px;color:var(--muted);font-size:13px;line-height:1.55}.quick{display:grid;grid-template-columns:1fr 1fr;gap:8px}.quick button{text-align:left;padding:11px;border:1px solid var(--border);border-radius:9px;background:var(--panel2)}
.msg{width:fit-content;max-width:min(84%,820px);margin:0}.msg.user{align-self:flex-start;margin-inline-start:0;margin-inline-end:auto}.msg.ai{align-self:flex-end;margin-inline-start:auto;margin-inline-end:0}.msg.system,.msg.error{align-self:center;margin:0 auto;max-width:92%}.meta{display:flex;gap:5px;align-items:center;font-size:9px;color:var(--muted);margin-bottom:3px;padding:0 4px}.ai .meta{justify-content:flex-end}.avatar{width:19px;height:19px;border:1px solid var(--border);border-radius:6px;display:grid;place-items:center;font-size:8px;font-weight:800;background:var(--panel2)}.bubble{border:1px solid var(--border);border-radius:16px;padding:9px 11px;background:var(--panel2);overflow:hidden}.user .bubble{background:#142337;border-top-left-radius:5px}.ai .bubble{background:#10161f;border-top-right-radius:5px}.error .bubble{background:#241317;border-color:#6b2b34}.md{font-size:13px;line-height:1.55;word-break:break-word}.md p{margin:0 0 9px}.md code{font:11px ui-monospace,monospace;background:#090d12;padding:1px 4px;border-radius:4px}.code{border:1px solid var(--border);border-radius:8px;overflow:hidden;background:#090d12;margin:8px 0}.codeHead{display:flex;justify-content:space-between;padding:5px 8px;border-bottom:1px solid var(--border);font:10px ui-monospace,monospace;color:var(--muted)}.codeHead button{height:23px}.code pre{margin:0;padding:10px;overflow:auto;font:11px/1.55 ui-monospace,monospace;white-space:pre}
.composerWrap{border-top:1px solid var(--border);background:#0a0f15;padding:7px 9px calc(7px + env(safe-area-inset-bottom))}.composerBox{max-width:1000px;margin:0 auto;border:1px solid var(--border);border-radius:11px;background:var(--panel2);overflow:hidden}.composer{display:block;width:100%;min-height:48px;max-height:150px;resize:none;border:0;background:transparent;padding:10px;font-size:14px}.tools{display:flex;align-items:center;gap:6px;padding:6px;border-top:1px solid var(--border)}.spacer{flex:1}
.listItem{padding:8px;border-radius:7px;margin-bottom:5px;border:1px solid transparent}.listItem.active{background:#152033;border-color:var(--border)}.tiny{font-size:9px;color:var(--muted)}.small{font-size:10px}.activityItem{padding:8px;border-bottom:1px solid rgba(255,255,255,.04)}.activityTime{font-size:9px;color:var(--muted);font-family:ui-monospace,monospace}.activityTitle{font-size:10px;margin-top:3px}.activityDetail{font-size:10px;color:var(--muted);margin-top:2px;word-break:break-word}
.input,.select{width:100%;height:35px;background:#090e14;border:1px solid var(--border);border-radius:8px;padding:0 9px}.field{margin-bottom:10px}.field label{display:block;font-size:10px;color:var(--muted);margin-bottom:5px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:9px}.notice{padding:9px;border:1px solid var(--border);background:#0a0f15;border-radius:8px;font-size:10px;line-height:1.5;color:#bbc6d3}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.62);display:none;align-items:center;justify-content:center;padding:14px;z-index:100}.overlay.open{display:flex}.modal{width:min(720px,calc(100vw - 28px));max-height:min(88dvh,760px);overflow:auto;background:var(--panel);border:1px solid var(--border);border-radius:14px;box-shadow:0 18px 70px rgba(0,0,0,.45)}.modalHead,.modalFoot{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--border)}.modalFoot{justify-content:flex-end;gap:7px;border-top:1px solid var(--border);border-bottom:0}.modalBody{padding:12px}
.drawer{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;padding:14px;z-index:90}.drawer.open{display:flex}.drawerPanel{position:relative;width:min(90%,360px);height:min(82dvh,620px);max-height:82dvh;background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:auto;box-shadow:0 18px 70px rgba(0,0,0,.45);-webkit-overflow-scrolling:touch}.drawerLeft .drawerPanel,.drawerRight .drawerPanel{left:auto;right:auto;top:auto;bottom:auto}.statusbar{display:flex;align-items:center;justify-content:space-between;padding:0 8px;border-top:1px solid var(--border);background:#090d12;color:var(--muted);font-size:8px}
@media(max-width:900px){.app{grid-template-rows:48px minmax(0,1fr) 22px}.main{grid-template-columns:1fr}.left,.right{display:none}.mobile{display:grid}.top{padding:0 7px}.status{display:none}.actions .btn{display:none}.session{padding:0 7px}.messages{padding:8px 5px 10px}.msg{max-width:94%}.bubble{padding:8px 10px}.composerWrap{padding:6px 6px calc(6px + env(safe-area-inset-bottom))}.composer{font-size:14px}.tools{overflow-x:auto}.tools .btn{white-space:nowrap}.quick{grid-template-columns:1fr}.btn,.icon{height:38px}.icon{width:38px}.modal{width:min(94vw,680px);max-height:88dvh;border-radius:14px}.drawer{padding:12px}.drawerPanel{width:min(92vw,420px);height:min(78dvh,600px);max-height:78dvh;border-radius:14px}}
@media(max-width:520px){.brand span:last-child{max-width:150px;overflow:hidden;text-overflow:ellipsis}.msg{max-width:96%}}

.creatorCredit{margin-top:16px;color:var(--muted);font-size:10px;text-align:center}.creatorCredit a{color:var(--accent);text-decoration:none}.creatorCredit a:hover{text-decoration:underline}.creatorCredit strong{color:var(--text)}
@media(max-width:520px){.creatorCredit{font-size:9px;margin-top:13px}}

/* UI polish: deterministic message sides + centered dialogs */
.modalBody,.modalFoot{overscroll-behavior:contain}.drawerPanel{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.msg{contain:layout paint}.msg.user .meta{justify-content:flex-start}.msg.ai .meta{justify-content:flex-end}
