:root { --blue:#3370ff; --blue-soft:#eaf0ff; --text:#1f2329; --secondary:#646a73; --tertiary:#8f959e; --line:#e5e6eb; --hover:#f2f3f5; --green:#00a870; --red:#e5484d; }
* { box-sizing:border-box; }
html,body { height:100%; }
body { margin:0; overflow:hidden; color:var(--text); background:#f5f6f7; font:14px Inter,"PingFang SC","Microsoft YaHei",sans-serif; }
button,input,textarea { font:inherit; } button { cursor:pointer; }
.app-shell { height:100vh; min-height:0; display:grid; grid-template-columns:68px 260px minmax(500px,1fr) 380px; overflow:hidden; }
.rail { display:flex; flex-direction:column; align-items:center; gap:10px; padding:14px 8px; color:#c9d7ff; background:#1f2d4d; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; margin-bottom:8px; border-radius:11px; color:#fff; background:linear-gradient(145deg,#78a2ff,#3370ff); font-size:18px; font-weight:800; }
.rail-item { width:52px; min-height:54px; display:grid; place-items:center; gap:2px; border:0; border-radius:9px; color:inherit; background:transparent; }
.rail-item span { font-size:20px; }.rail-item small { font-size:10px; }.rail-item.active,.rail-item:hover { color:#fff; background:#ffffff1a; }.rail-spacer { flex:1; }
.avatar { flex:0 0 auto; display:grid; place-items:center; width:36px; height:36px; border-radius:9px; color:#fff; font-size:12px; font-weight:700; }.avatar.agent { background:linear-gradient(145deg,#7d6cff,#3370ff); }.avatar.me { background:linear-gradient(145deg,#14b8a6,#087f5b); }
.channels { min-width:0; padding:12px 10px; overflow-y:auto; border-right:1px solid var(--line); background:#f7f8fa; }
.workspace-title { height:48px; display:flex; align-items:center; justify-content:space-between; padding:0 8px; }.workspace-title div,.channel span:last-child,.member span:last-child,.storage-card div { min-width:0; display:grid; gap:3px; }.workspace-title b { font-size:16px; }.workspace-title small,.channel small,.member small,.storage-card small { color:var(--tertiary); font-size:11px; }.workspace-title button,.channel-label button { border:0; color:var(--secondary); background:transparent; }
.search-box { height:34px; display:flex; align-items:center; gap:8px; margin:8px 4px 16px; padding:0 10px; border-radius:7px; color:var(--tertiary); background:#e9ebef; font-size:12px; }.channel-label { display:flex; align-items:center; justify-content:space-between; padding:9px 8px 5px; color:var(--tertiary); font-size:12px; }.channel-list,.member-list { display:grid; gap:2px; }.channel-label button { width:27px; height:27px; padding:0; border-radius:5px; background:#eef0f3; }.mention-empty { margin:8px; padding:8px; }
.channel,.member { width:100%; display:flex; align-items:center; gap:10px; padding:9px 8px; border:0; border-radius:7px; text-align:left; background:transparent; }.channel:hover,.channel.active { background:#e8ecf5; }.channel.disabled { opacity:.55; }.group-icon { display:grid; place-items:center; flex:0 0 34px; height:34px; border-radius:9px; color:#fff; background:var(--blue); font-weight:700; }.group-icon.gray { background:#8f959e; }.channel b,.channel small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.channel b,.member b { font-size:13px; }.member small i { display:inline-block; width:6px; height:6px; margin-right:4px; border-radius:50%; background:var(--green); }
.storage-card { display:flex; align-items:center; gap:9px; margin:18px 4px 0; padding:10px; border:1px solid #d9dce3; border-radius:9px; background:#fff; }.storage-card>span { display:grid; place-items:center; width:30px; height:30px; border-radius:8px; color:var(--blue); background:var(--blue-soft); font-size:10px; font-weight:800; }
.chat-column { height:100vh; min-width:0; min-height:0; display:grid; grid-template-rows:65px minmax(0,1fr) auto; overflow:hidden; background:#fff; }.chat-header { display:flex; align-items:center; justify-content:space-between; padding:0 22px; border-bottom:1px solid var(--line); }.chat-header h1 { margin:0 0 4px; font-size:16px; }.chat-header h1 span { color:var(--tertiary); font-size:12px; font-weight:400; }.chat-header p { margin:0; color:var(--tertiary); font-size:12px; }.header-actions { display:flex; gap:5px; }.header-actions button { width:34px; height:34px; border:0; border-radius:7px; color:var(--secondary); background:transparent; }.header-actions button:hover { background:var(--hover); }
.message-stream { min-height:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; scrollbar-gutter:stable; padding:10px 24px 24px; scroll-behavior:smooth; }.date-divider { display:flex; justify-content:center; margin:8px 0 22px; }.date-divider span { padding:3px 10px; border-radius:10px; color:var(--tertiary); background:var(--hover); font-size:11px; }.message { max-width:820px; display:flex; align-items:flex-start; gap:11px; margin:0 0 22px; }.message.mine { margin-left:auto; flex-direction:row-reverse; }.message.mine .message-body { align-items:flex-end; }.message.mine .sender { flex-direction:row-reverse; }.message-body { min-width:0; display:flex; flex-direction:column; gap:6px; }.sender { height:18px; display:flex; align-items:center; gap:7px; }.sender b { font-size:13px; }.sender time { color:var(--tertiary); font-size:11px; }.bot-tag { padding:1px 4px; border-radius:3px; color:var(--blue); background:var(--blue-soft); font-size:9px; font-weight:700; }
.message-content { max-width:720px; padding:10px 13px; border-radius:4px 12px 12px; background:var(--hover); line-height:1.65; white-space:pre-wrap; }.message.mine .message-content { color:#173d8f; background:#dfe9ff; border-radius:12px 4px 12px 12px; }.message-content p { margin:0; }.intro .message-content { background:#f4f6fb; }.quick-prompts { display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }.quick-prompts button { padding:6px 10px; border:1px solid #baceff; border-radius:6px; color:var(--blue); background:#fff; font-size:12px; }
.agent-result { width:min(720px,100%); margin-top:3px; overflow:hidden; border:1px solid var(--line); border-radius:9px; background:#fff; }.result-meta { display:flex; align-items:center; gap:7px; padding:8px 11px; border-bottom:1px solid var(--line); }.result-meta span { padding:2px 6px; border-radius:4px; color:var(--green); background:#e8faf3; font-size:10px; }.result-meta .pending_review,.result-meta .low { color:var(--red); background:#ffebec; }.result-meta .warning,.result-meta .medium { color:#b66a00; background:#fff4dc; }.result-meta button { margin-left:auto; border:0; color:var(--blue); background:transparent; font-size:11px; }.result-summary { display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:center; padding:10px 12px; }.score-ring { position:relative; width:42px; height:42px; display:grid; place-items:center; border-radius:50%; color:var(--blue); background:conic-gradient(var(--blue) var(--score),#e9ebef 0); font-size:11px; font-weight:800; }.score-ring::before { content:""; position:absolute; inset:4px; border-radius:50%; background:#fff; }.score-ring span { position:relative; }.result-summary small { color:var(--secondary); line-height:1.45; }.pending-notice { margin:0 12px 11px; padding:7px 9px; border-radius:5px; color:#9b3035; background:#fff1f1; font-size:12px; }
.composer-area { position:relative; padding:8px 22px 18px; background:#fff; }.composer { border:1px solid #c9cdd4; border-radius:9px; background:#fff; box-shadow:0 4px 16px #1f23290d; }.composer:focus-within { border-color:var(--blue); box-shadow:0 0 0 2px #3370ff18; }.composer-tools { display:flex; gap:3px; padding:7px 9px 0; }.composer-tools button { width:30px; height:27px; border:0; border-radius:5px; color:var(--secondary); background:transparent; font-weight:700; }.composer-tools button:hover { background:var(--hover); }.composer textarea { width:100%; min-height:55px; padding:7px 12px; border:0; outline:0; resize:none; color:var(--text); background:transparent; line-height:1.5; }.composer-bottom { display:flex; align-items:center; justify-content:space-between; padding:5px 8px 8px 12px; }.composer-bottom span { color:var(--tertiary); font-size:10px; }.composer-bottom button { padding:6px 17px; border:0; border-radius:6px; color:#fff; background:var(--blue); }
.mention-menu { position:absolute; left:35px; bottom:150px; z-index:5; width:330px; padding:7px; border:1px solid var(--line); border-radius:9px; background:#fff; box-shadow:0 8px 28px #1f232926; }.mention-title { padding:6px 8px; color:var(--tertiary); font-size:11px; }.mention-menu button { width:100%; display:flex; align-items:center; gap:9px; padding:8px; border:0; border-radius:6px; text-align:left; background:transparent; }.mention-menu button:hover { background:var(--hover); }.mention-menu button>span:nth-child(2) { flex:1; display:grid; gap:2px; }.mention-menu small,.mention-menu kbd { color:var(--tertiary); font-size:10px; }.hidden { display:none!important; }
.context-panel { min-width:0; overflow:hidden; border-left:1px solid var(--line); background:#fff; }.tabs { height:52px; display:flex; padding:0 10px; border-bottom:1px solid var(--line); }.tabs button { flex:1; padding:0 5px; border:0; border-bottom:2px solid transparent; color:var(--secondary); background:transparent; font-size:12px; }.tabs button.active { color:var(--blue); border-bottom-color:var(--blue); }.tabs span { min-width:16px; display:inline-grid; place-items:center; padding:1px 4px; border-radius:8px; color:var(--red); background:#ffebec; font-size:9px; }.tab-content { display:none; height:calc(100vh - 52px); overflow-y:auto; padding:15px; }.tab-content.active { display:block; }.empty-state { max-width:230px; margin:22vh auto 0; color:var(--tertiary); text-align:center; }.empty-state>span { font-size:34px; }.empty-state h3 { margin:12px 0 6px; color:var(--secondary); font-size:14px; }.empty-state p { margin:0; font-size:12px; line-height:1.6; }
.context-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }.context-heading.split { margin-top:22px; padding-top:17px; border-top:1px solid var(--line); }.context-heading div { display:grid; gap:3px; }.context-heading small,.muted { color:var(--tertiary); font-size:11px; }.context-heading button { width:27px; height:27px; border:0; border-radius:5px; color:var(--secondary); background:var(--hover); }.inspect-section { margin-bottom:18px; }.inspect-section h3 { margin:0 0 9px; color:var(--secondary); font-size:12px; font-weight:600; }.inspect-card,.work-item { padding:11px; border:1px solid var(--line); border-radius:8px; background:#fff; }.confidence-head { display:flex; align-items:baseline; justify-content:space-between; }.confidence-head strong { color:var(--blue); font-size:27px; }.confidence-grid { display:grid; gap:8px; margin-top:12px; }.metric-row { display:grid; grid-template-columns:105px 1fr 34px; gap:7px; align-items:center; color:var(--secondary); font-size:11px; }.mini-bar { height:5px; overflow:hidden; border-radius:4px; background:var(--hover); }.mini-bar i { display:block; height:100%; background:var(--blue); }
.citation-card { margin-bottom:8px; padding:10px; border:1px solid var(--line); border-radius:7px; }.citation-card b { display:block; margin-bottom:4px; font-size:12px; }.citation-card p { margin:0; color:var(--secondary); font-size:11px; line-height:1.5; }.citation-card code { color:var(--blue); font-size:10px; }.trace-button { width:100%; padding:8px; border:1px solid #baceff; border-radius:6px; color:var(--blue); background:#fff; }.work-list { display:grid; gap:8px; }.work-item p { margin:6px 0; font-size:12px; line-height:1.45; }.badge { display:inline-block; padding:2px 6px; border-radius:4px; color:var(--blue); background:var(--blue-soft); font-size:9px; }.badge.pending,.badge.pending_review { color:var(--red); background:#ffebec; }.work-actions { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }.work-actions button { padding:5px 8px; border:1px solid #baceff; border-radius:5px; color:var(--blue); background:#fff; font-size:10px; }.work-actions button.primary { color:#fff; background:var(--blue); }.contract-search { display:grid; grid-template-columns:1fr auto; gap:6px; margin-bottom:12px; }.contract-search input { min-width:0; padding:8px 9px; border:1px solid var(--line); border-radius:6px; outline:0; }.contract-search button { border:0; border-radius:6px; color:#fff; background:var(--blue); }.contract-amount { color:var(--blue); font-weight:700; }.term { padding:5px 0; border-top:1px dashed var(--line); color:var(--secondary); font-size:10px; }
dialog { width:min(720px,90vw); max-height:82vh; padding:0; border:0; border-radius:12px; box-shadow:0 20px 70px #0004; }.dialog-head { display:flex; align-items:center; justify-content:space-between; padding:15px 18px; border-bottom:1px solid var(--line); }.dialog-head small { color:var(--blue); font-size:9px; letter-spacing:.15em; }.dialog-head h2 { margin:3px 0 0; font-size:16px; }.dialog-head button { width:30px; height:30px; border:0; border-radius:6px; background:var(--hover); font-size:20px; }.trace-timeline { max-height:65vh; overflow-y:auto; padding:18px 24px; }.trace-event { position:relative; padding:0 0 17px 22px; border-left:1px solid #baceff; }.trace-event::before { content:""; position:absolute; left:-5px; top:2px; width:9px; height:9px; border-radius:50%; background:var(--blue); }.trace-event:last-child { border-left-color:transparent; }.trace-event b { color:var(--blue); font-size:11px; }.trace-event p { margin:4px 0; font-size:12px; }.trace-event pre { margin:5px 0 0; padding:7px; overflow:auto; border-radius:5px; color:#dbe7ff; background:#1f2d4d; font-size:9px; white-space:pre-wrap; }.group-dialog { width:min(520px,92vw); }.group-dialog form { display:flex; max-height:82vh; flex-direction:column; }.group-dialog-body { display:grid; gap:14px; padding:18px; overflow-y:auto; }.group-dialog-body label { display:grid; gap:5px; color:var(--secondary); font-size:11px; }.group-dialog-body input,.group-dialog-body textarea { width:100%; padding:8px 9px; border:1px solid #d9dce3; border-radius:6px; outline:0; color:var(--text); background:#fff; }.group-dialog-body input:focus,.group-dialog-body textarea:focus { border-color:var(--blue); box-shadow:0 0 0 2px #3370ff18; }.group-dialog-body textarea { resize:vertical; }.group-field-label { display:block; margin-bottom:6px; color:var(--secondary); font-size:11px; }.group-agent-options { display:grid; gap:7px; }.group-agent-option { display:grid!important; grid-template-columns:auto 30px 1fr; align-items:center; gap:8px!important; padding:8px; border:1px solid var(--line); border-radius:7px; }.group-agent-option input { width:auto; }.group-agent-option .avatar { width:30px; height:30px; }.group-agent-option span:last-child { min-width:0; display:grid; gap:3px; }.group-agent-option small { overflow:hidden; color:var(--tertiary); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
#toast { position:fixed; right:24px; bottom:24px; z-index:20; max-width:340px; padding:10px 14px; border-radius:7px; color:#fff; background:#1f2329; opacity:0; transform:translateY(8px); transition:.2s; pointer-events:none; }#toast.show { opacity:1; transform:translateY(0); }
@media(max-width:1180px) { .app-shell { grid-template-columns:64px 230px 1fr; }.context-panel { position:fixed; top:0; right:0; bottom:0; z-index:8; width:370px; box-shadow:-8px 0 30px #1f232918; } }
@media(max-width:760px) { .app-shell { grid-template-columns:52px 1fr; }.channels,.context-panel { display:none; }.rail { padding-inline:3px; }.chat-column { grid-column:2; }.message-stream { padding-inline:12px; }.composer-area { padding-inline:10px; } }

.operation-action{margin-left:8px;padding:4px 8px;color:#fff;background:#d14343;border-color:#d14343;border-radius:5px;font-size:11px}.operation-action:hover{color:#fff;background:#b93636}
.compact-inspector{display:none}@media(max-width:1180px){.context-panel{display:none}.context-panel.is-open{display:block;max-width:calc(100vw - 52px);background:white}.compact-inspector{display:inline-block}#close-inspector{position:absolute;right:5px;top:4px;z-index:10;width:28px;height:28px;background:white;border:1px solid var(--line);border-radius:4px}.context-panel.is-open .tabs{padding-right:32px}}
.task-progress{max-height:180px;overflow:auto;border-bottom:1px solid var(--line);padding:10px 4px;margin-bottom:8px;font-size:12px}.task-progress>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.task-progress p{margin:6px 0;overflow-wrap:anywhere}.task-progress button{margin-left:auto;border:1px solid var(--line);background:white;border-radius:4px}.task-error{color:var(--red)}.subtask-result{padding:10px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}.subtask-result p{white-space:pre-wrap}.subtask-result summary{cursor:pointer}.composer-tools{flex-wrap:wrap}.composer-tools label{font-size:12px;display:flex;align-items:center;gap:6px}.composer-tools select{max-width:200px;min-height:30px;border:1px solid var(--line);border-radius:4px;background:white;font:inherit}.header-actions a{font-size:12px;color:var(--blue);white-space:nowrap}.message-body{min-width:0}.message-content{overflow-wrap:anywhere}.chat-column{min-width:0}.chat-header h1{overflow-wrap:anywhere}.composer-bottom{flex-wrap:wrap;gap:8px}@media(max-width:760px){.chat-header{height:auto;min-height:76px;gap:8px;padding:12px}.chat-header h1{font-size:16px}.header-actions{flex-shrink:0}.composer-tools select{max-width:150px}.task-progress{max-height:130px}.composer-bottom>span{font-size:10px}}

/* Ecommerce content within the original group-chat layout. */
.search-box input{width:100%;min-width:0;border:0;background:transparent;outline:0;font-size:12px}
#chat-title{color:var(--text);font-size:16px;font-weight:600}.chat-header p{max-width:440px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header-actions #open-scenarios{width:auto;padding:0 9px;color:var(--blue)}
.scenario-title{display:block;margin-top:7px;font-size:13px}.trace-brief{display:grid;gap:3px;border-left:2px solid #baceff;padding:4px 10px;font-size:11px}.trace-brief small{color:var(--secondary)}
.inspect-card p{font-size:12px;line-height:1.6}.json-view{max-width:100%;max-height:450px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;background:#f7f8fa;padding:10px;font-size:10px;line-height:1.6}
.selected-scenario{position:relative;display:grid;gap:4px;margin:6px 9px 0;padding:8px 28px 8px 9px;background:var(--blue-soft);border-radius:5px;font-size:11px}.selected-scenario span{color:var(--secondary);line-height:1.5}.selected-scenario button{position:absolute;right:3px;top:2px;border:0;background:transparent;color:var(--secondary)}
.dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-top:1px solid var(--line);font-size:11px;color:var(--secondary)}.dialog-footer button{border:0;border-radius:5px;background:var(--blue);color:white;padding:8px 15px}.group-dialog-body select{width:100%;padding:8px;border:1px solid var(--line);border-radius:5px;background:white}
.run-links{padding:8px 11px}.run-links a,.context-heading a{color:var(--blue);font-size:11px;text-decoration:none}.download-link{display:block;text-align:center;text-decoration:none;margin-top:12px}.approval-actions button{font-size:12px;padding:7px 12px}details{margin:9px 0}summary{cursor:pointer;font-size:12px}button:disabled{cursor:wait;opacity:.55}
#mobile-groups{display:none}.message .agent-result{max-width:100%}.message-body .work-actions{margin-top:2px}
@media(min-width:1181px) and (max-width:1350px){.app-shell{grid-template-columns:60px 225px minmax(400px,1fr) 320px}}
@media(max-width:760px){.chat-column{grid-template-rows:76px minmax(0,1fr) auto}.chat-header p{max-width:210px}.chat-header h1{font-size:14px}.header-actions{gap:0}.header-actions button{width:30px}#mobile-groups{display:block}.channels.is-open{display:block;position:fixed;left:52px;top:0;bottom:0;width:min(270px,calc(100vw - 52px));z-index:9;box-shadow:10px 0 30px #0002}.composer-tools{gap:4px}.composer-tools select{max-width:135px;font-size:11px}.message-stream{padding:10px}.message{gap:7px}.avatar{width:30px;height:30px}.composer textarea{min-height:48px}.message-content{padding:8px 10px}.context-panel{width:360px}.chat-header{padding:10px 8px}.mention-menu{left:10px;width:min(320px,calc(100vw - 82px))}}
.header-actions button{padding:0;white-space:nowrap;font-size:12px}.result-meta{flex-wrap:wrap}.result-meta>span{max-width:100%;line-height:1.5}.result-meta button{white-space:nowrap}

/* Conversation management. */
.chat-column { grid-template-columns:minmax(0,1fr); }
.composer-area,.message-stream { min-width:0; }
.chat-header>div:first-child { min-width:0; flex:1; }
.chat-header h1 { display:flex; align-items:baseline; gap:4px; min-width:0; }
#chat-title { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#chat-count { flex-shrink:0; }
.channel-row { position:relative; border-radius:8px; }
.channel-row.active { background:#e8ecf5; }
.channel-row .channel { padding-right:35px; }
.channel-delete { position:absolute; right:5px; top:50%; display:grid; place-items:center; width:26px; height:28px; padding:5px; border:0; border-radius:6px; color:#8f959e; background:transparent; opacity:0; transform:translateY(-50%); transition:opacity .15s,color .15s,background .15s; }
.channel-delete svg { width:15px; height:15px; }
.channel-row:hover .channel-delete,.channel-row:focus-within .channel-delete { opacity:1; }
.channel-delete:hover,.channel-delete:focus-visible { color:#cf4057; background:#ffedf0; outline:2px solid #fbd0d8; }
.group-list-empty { padding:14px 8px; color:var(--tertiary); font-size:12px; line-height:1.7; }
.no-groups { display:flex; min-height:100%; flex-direction:column; align-items:center; justify-content:center; padding:30px 10px; text-align:center; }
.empty-group-icon { display:grid; place-items:center; width:70px; height:70px; border:1px solid #d9e5ff; border-radius:22px; color:var(--blue); background:linear-gradient(145deg,#f4f8ff,#e9f0ff); }
.empty-group-icon svg { width:32px; height:32px; }
.no-groups h2 { margin:22px 0 8px; font-size:21px; letter-spacing:.02em; }
.no-groups p { margin:0 0 24px; color:var(--secondary); font-size:13px; line-height:1.8; }
.no-groups button { padding:10px 19px; border:0; border-radius:8px; color:white; background:var(--blue); box-shadow:0 4px 12px #3370ff26; font-size:13px; }
.dialog-footer #delete-group { margin-right:auto; padding:7px 0; color:#cf4057; background:transparent; }
.delete-group-dialog { width:min(440px,92vw); }
.delete-group-dialog::backdrop { background:#18233d60; backdrop-filter:blur(3px); }
.delete-group-body { padding:22px 24px 18px; }
.delete-group-icon { display:grid; place-items:center; width:44px; height:44px; margin-bottom:18px; border:1px solid #fbd4db; border-radius:13px; color:#cf4057; background:#fff0f3; }
.delete-group-icon svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.delete-group-body p { overflow-wrap:anywhere; line-height:1.7; }
.delete-group-body>p:first-of-type { margin:0 0 8px; font-size:16px; }
.delete-group-body .delete-group-note { margin:0; color:var(--secondary); font-size:12px; }
.delete-group-dialog .secondary { padding:8px 14px; border:1px solid var(--line); color:var(--secondary); background:white; }
.delete-group-dialog .danger-button { padding:8px 16px; color:white; background:#d8465d; }
.delete-group-error { padding:10px 12px; border:1px solid #f6dfba; border-radius:7px; color:#99621c; background:#fff9ef; font-size:12px; }
.delete-group-dialog button:disabled { cursor:not-allowed; }

/* Conversation settings and their floating option menus. */
.composer { border-color:#d6dfef; border-radius:12px; box-shadow:0 4px 20px #263c6510; }
.composer-toolbar-heading { display:flex; align-items:center; justify-content:space-between; padding:10px 13px 9px; }
.composer-toolbar-heading>span { display:flex; align-items:center; gap:6px; color:#66758e; font-size:11px; font-weight:600; letter-spacing:.04em; }
.settings-spark { color:#7186b7; font-size:15px; font-style:normal; }
#mention-button { display:flex; align-items:center; gap:6px; padding:4px 8px; border:1px solid #dce5f5; border-radius:6px; color:#4769a6; background:#f8faff; font-size:11px; }
#mention-button b { color:var(--blue); font-size:14px; }
#mention-button:hover { border-color:#9dbbff; background:#edf3ff; }
.composer-tools { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:8px; padding:0 12px; }
.composer-tools .control-card { display:grid; min-width:0; gap:5px; padding:8px 10px 7px; border:1px solid #e0e6ef; border-radius:9px; background:#f8fafc; transition:border-color .15s,box-shadow .15s,background .15s; cursor:pointer; }
.composer-tools .control-card:hover { border-color:#adbed9; }
.composer-tools .control-card:focus-within { border-color:#7aa2fc; box-shadow:0 0 0 3px #3370ff14; outline:2px solid #7aa2fc; outline-offset:2px; }
.control-label { display:flex; align-items:center; gap:5px; min-width:0; color:#718097; font-size:10px; font-weight:500; }
.control-label svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.control-select { position:relative; display:block; min-width:0; }
.control-select>span { position:absolute; top:2px; right:0; color:#8897af; font-size:16px; line-height:20px; pointer-events:none; }
.composer-tools .control-card select { display:block; width:100%; min-width:0; max-width:none; min-height:23px; margin:0; padding:0 16px 0 0; appearance:none; border:0; border-radius:0; outline:0; color:#33425b; background:transparent; font:600 12px/23px Inter,"PingFang SC","Microsoft YaHei",sans-serif; cursor:pointer; }
.composer-tools .mode-control[data-value="model"] { border-color:#bcd0ff; background:linear-gradient(120deg,#f0f5ff,#f8faff); box-shadow:inset 0 0 0 1px #ffffffa0; }
.mode-control[data-value="model"] .control-label,.mode-control[data-value="model"] select { color:#315eb4; }
.mode-badge { margin-left:auto; padding:1px 5px; border-radius:4px; color:#4778d7; background:#e1ebff; font-size:8px; font-weight:700; letter-spacing:.06em; }
.composer-tools .mode-control[data-value="scripted"] { border-color:#d9ccec; background:#f9f5ff; }
.mode-control[data-value="scripted"] .mode-badge { color:#8c61b3; background:#ecdefa; }
.composer-tools .participants-control[data-value="automatic"] { border-color:#cbd7ec; background:#f2f6fd; }
.composer-tools .seat-control[data-value="finance"] { border-color:#eacb8d; background:linear-gradient(120deg,#fff8e9,#fffdf6); }
.seat-control[data-value="finance"] .control-label,.seat-control[data-value="finance"] select { color:#9b6b1d; }
.composer-context { display:flex; align-items:flex-start; gap:6px; margin:9px 13px 5px; color:#8793a7; font-size:10px; line-height:1.5; }
.composer-context>i { flex:0 0 5px; height:5px; margin-top:5px; border-radius:50%; background:#56b397; box-shadow:0 0 0 2px #e7f5ef; }
.composer-context[data-mode="scripted"]>i { background:#a087bd; box-shadow:0 0 0 2px #f0e9f8; }
.composer textarea { padding:9px 13px; }
.composer-bottom { padding:5px 11px 10px 13px; }
.composer-bottom #send { min-width:69px; padding:7px 19px; border-radius:7px; box-shadow:0 3px 8px #3370ff20; }

.composer-tools .control-card select[hidden],.select-enhanced .control-select>span { display:none; }
.composer-tools .setting-trigger { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; height:auto; min-height:23px; padding:0; border:0; border-radius:4px; outline:0; color:#33425b; background:transparent; font:600 12px/23px Inter,"PingFang SC","Microsoft YaHei",sans-serif; text-align:left; -webkit-tap-highlight-color:transparent; }
.composer-tools .setting-trigger:hover { background:transparent; }
.setting-value { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.setting-trigger>svg { flex:0 0 14px; width:14px; height:14px; color:#8192ae; transition:transform .18s; }
.setting-trigger[aria-expanded="true"]>svg { transform:rotate(180deg); }
.composer-tools .control-card.is-open { border-color:#8aabf3; background:#f2f6ff; box-shadow:0 0 0 3px #3370ff0e; }
.mode-control[data-value="model"] .setting-trigger { color:#315eb4; }
.seat-control[data-value="finance"] .setting-trigger { color:#9b6b1d; }
.settings-menu { position:fixed; inset:auto; z-index:30; box-sizing:border-box; margin:0; padding:7px; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; border:1px solid #e0e6f0; border-radius:15px; outline:0; color:var(--text); background:#fff; box-shadow:0 14px 44px #253a6026,0 3px 10px #253a600a; font:12px Inter,"PingFang SC","Microsoft YaHei",sans-serif; }
.settings-menu[hidden] { display:none; }
.settings-menu::backdrop { background:transparent; }
.settings-menu:popover-open { animation:settings-menu-in .14s ease-out; }
.settings-menu-heading { display:grid; gap:5px; padding:8px 10px 12px; }
.settings-menu-heading>b { color:#35435b; font-size:12px; font-weight:650; }
.settings-menu-heading>span { color:#8a96a8; font-size:10px; line-height:1.4; }
.settings-options { display:grid; gap:4px; }
.setting-option { display:flex; align-items:center; gap:10px; width:100%; padding:11px 10px; border:1px solid transparent; border-radius:10px; outline:0; color:#3e4a5f; background:#fff; font:inherit; text-align:left; transition:background .14s,border-color .14s; -webkit-tap-highlight-color:transparent; }
.setting-option:hover { background:#f5f7fb; }
.setting-option:focus-visible { border-color:#89aaf2; box-shadow:inset 0 0 0 1px #89aaf2; }
.setting-option[aria-selected="true"] { border-color:#dce7ff; background:#f0f5ff; }
.setting-option[aria-selected="true"]:hover { background:#e9f0ff; }
.setting-option-icon { display:grid; place-items:center; flex:0 0 35px; height:35px; border:1px solid #00000005; border-radius:10px; }
.setting-option-icon svg { width:19px; height:19px; }
.setting-option-copy { display:grid; gap:6px; flex:1; min-width:0; }
.setting-option-copy>span:first-child { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.setting-option-copy b { font-size:12px; font-weight:600; line-height:1.4; }
.setting-option-tag { padding:2px 5px; border-radius:4px; font-size:8px; line-height:1.2; font-weight:600; }
.setting-option-description { color:#8692a5; font-size:10px; line-height:1.6; overflow-wrap:anywhere; }
.setting-tone-blue { color:#4a77d1; background:#e7efff; }
.setting-tone-violet { color:#9371bc; background:#f0e9fa; }
.setting-tone-teal { color:#35978a; background:#e6f5f0; }
.setting-tone-amber { color:#ac7b2d; background:#fff1d5; }
.setting-option-check { display:grid; place-items:center; flex:0 0 17px; height:17px; border:1px solid #dfe5ee; border-radius:50%; background:#fff; }
.setting-option-check svg { width:10px; height:10px; visibility:hidden; stroke-width:2.5; }
.setting-option[aria-selected="true"] .setting-option-check { border-color:var(--blue); color:#fff; background:var(--blue); }
.setting-option[aria-selected="true"] .setting-option-check svg { visibility:visible; }
.settings-menu-footnote { display:flex; justify-content:space-between; margin:8px 5px 0; padding:9px 5px 3px; border-top:1px solid #eef1f6; color:#a0aaba; font-size:9px; }
@keyframes settings-menu-in { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@media (hover:none) { .settings-menu-footnote { display:none; }.setting-option { min-height:70px; } }
@media (prefers-reduced-motion:reduce) { .settings-menu:popover-open { animation:none; }.setting-option,.setting-trigger>svg { transition:none; } }

/* Each verification scenario has its own pictogram and a persistent case label. */
.avatar.finance-avatar { color:#a36b17; background:linear-gradient(135deg,#fff0c9,#f8dc9f); border:1px solid #edcf8d; }
.avatar.scenario-avatar { position:relative; width:39px; height:39px; border:1px solid var(--avatar-border,#dcd5f0); border-radius:12px; color:var(--avatar-ink,#7d5bb4); background:var(--avatar-bg,#f2edfb); }
.scenario-avatar svg { width:23px; height:23px; }
.scenario-avatar>small { position:absolute; right:-5px; bottom:-4px; min-width:23px; padding:2px 3px; border:1px solid var(--avatar-border,#dcd5f0); border-radius:4px; color:var(--avatar-ink,#7d5bb4); background:white; font:700 8px/1 Inter,sans-serif; text-align:center; }
.tone-sky { --avatar-ink:#3c7fb1; --avatar-bg:#eaf4fc; --avatar-border:#cce3f5; }
.tone-teal { --avatar-ink:#27958f; --avatar-bg:#e9f7f5; --avatar-border:#c4e9e5; }
.tone-rose { --avatar-ink:#c16076; --avatar-bg:#fceff3; --avatar-border:#f2d3dd; }
.tone-emerald { --avatar-ink:#389476; --avatar-bg:#eaf6f0; --avatar-border:#cce8da; }
.tone-amber { --avatar-ink:#b18339; --avatar-bg:#fcf5e7; --avatar-border:#efdfb9; }
.tone-violet { --avatar-ink:#8568b8; --avatar-bg:#f2edfb; --avatar-border:#ded3f0; }
.tone-slate { --avatar-ink:#6d8098; --avatar-bg:#eff3f8; --avatar-border:#dbe3ed; }
.scenario-message { gap:12px; margin-top:7px; }
.scenario-message .sender b { color:#67758a; font-size:12px; }
.scenario-tag { padding:1px 5px; border:1px solid #dfe5ee; border-radius:4px; color:#7b889d; background:#f7f9fc; font-size:9px; }
.scenario-message .message-content { border:1px solid #e1e7f0; border-left:3px solid #bccbe2; border-radius:4px 12px 12px; color:#526078; background:linear-gradient(120deg,#f7f9fd,#fbfcfe); font-size:12px; line-height:1.85; }
.scenario-card-heading { display:flex; align-items:center; gap:9px; }
.avatar.scenario-avatar-mini { flex:0 0 32px; width:32px; height:32px; border-radius:9px; }
.scenario-avatar-mini svg { width:19px; height:19px; }
.scenario-card-heading .scenario-title { margin-top:5px; }
@media (hover:none) { .channel-delete { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .channel-delete,.composer-tools .control-card { transition:none; } }
@media (max-width:760px) {
  .composer-toolbar-heading { padding:8px 10px; }
  .composer-tools { grid-template-columns:1fr 1fr; gap:6px; padding:0 9px; }
  .composer-tools .mode-control { grid-column:1/-1; grid-template-columns:95px minmax(0,1fr); align-items:center; gap:5px; padding:8px 10px; }
  .mode-control .mode-badge { display:none; }
  .composer-tools .control-card { padding:7px 9px; }
  .composer-tools .control-card select { font-size:11px; }
  .composer-tools .setting-trigger { font-size:11px; }
  .control-label { font-size:9px; }
  .composer-context { margin:7px 10px 3px; font-size:9px; }
  .composer-bottom { padding:5px 9px 8px 10px; }
  .avatar.scenario-avatar { flex-basis:34px; width:34px; height:34px; border-radius:10px; }
  .scenario-avatar svg { width:20px; height:20px; }
  .scenario-message { gap:9px; }
  .scenario-message .sender { gap:5px; }
  .scenario-message .sender b { font-size:11px; }
  .scenario-message .message-content { padding:8px 10px; font-size:11px; }
}