@linxin666/dsh-remote-web-ui 0.3.6 → 0.3.10

package/lib/types/mobile/messages.test.js

@@ -1,356 +0,0 @@
-/** foldEvents: message-list folding from a session event stream. */
-import { describe, expect, it } from 'vitest';
-import { EventFolder, foldEvents } from "./messages.js";
-/** Assemble one event with an auto-incrementing seq / time. */
-function makeEvent(type, data, seq, time = seq * 1_000) {
-    return { type, seq, time, data };
-}
-/** A DSH-shaped user message payload (content: text blocks). */
-function userMessageData(id, text) {
-    return { id, role: 'user', content: [{ type: 'text', text }], source: { kind: 'user' } };
-}
-/** A DSH-shaped assistant message payload for one step. */
-function assistantMessageData(id, turn, step, text) {
-    return {
-        turn,
-        step,
-        message: {
-            id,
-            role: 'assistant',
-            content: [{ type: 'text', text }],
-            source: { kind: 'model', provider: 'fx', model: 'fx-1' },
-        },
-    };
-}
-/** A DSH-shaped text-delta chunk for one step. */
-function textChunk(turn, step, text, seq) {
-    return makeEvent('assistant/chunk', { turn, step, chunk: { type: 'text-delta', index: 0, text } }, seq);
-}
-describe('foldEvents', () => {
-    it('folds one full turn: user message, streamed chunks, final assistant message', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', '查一下天气'), 0),
-            makeEvent('assistant/chunk', { turn: 0, step: 0, chunk: { type: 'text-delta', index: 0, text: '今天' } }, 1),
-            makeEvent('assistant/chunk', { turn: 0, step: 0, chunk: { type: 'text-delta', index: 0, text: '晴天' } }, 2),
-            makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, '今天晴天'), 3),
-        ];
-        const result = foldEvents(events);
-        expect(result).toHaveLength(2);
-        expect(result[0]).toMatchObject({ kind: 'user', id: 'u-1', text: '查一下天气', seq: 0 });
-        expect(result[1]).toMatchObject({
-            kind: 'assistant',
-            id: 'a-1',
-            text: '今天晴天',
-            seq: 3,
-            pending: false,
-        });
-    });
-    it('keeps the streamed pending assistant alive while chunks arrive, then finalizes', () => {
-        const first = foldEvents([
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 0),
-            textChunk(0, 0, '你', 1),
-            textChunk(0, 0, '好', 2),
-        ]);
-        const pending = first.find(message => message.kind === 'assistant');
-        expect(pending).toMatchObject({ text: '你好', pending: true, seq: 2 });
-        const finalized = foldEvents([makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, '你好！'), 3)], first);
-        const assistant = finalized.find(message => message.kind === 'assistant');
-        expect(assistant).toMatchObject({ id: 'a-1', text: '你好！', pending: false, seq: 3 });
-        // No duplicate assistant message appears.
-        expect(finalized.filter(message => message.kind === 'assistant')).toHaveLength(1);
-    });
-    it('message/update replaces text and message/delete removes the row', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', '旧文本'), 0),
-            makeEvent('user/message', userMessageData('u-2', '要删掉'), 1),
-            makeEvent('message/update', { id: 'u-1', text: '新文本' }, 2),
-            makeEvent('message/delete', { id: 'u-2' }, 3),
-        ];
-        const result = foldEvents(events);
-        expect(result.map(message => message.id)).toEqual(['u-1']);
-        expect(result[0]).toMatchObject({ id: 'u-1', kind: 'user', text: '新文本', seq: 2 });
-    });
-    it('accumulates toolSummary on the assistant message owning the tool calls', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', '改文件'), 0),
-            textChunk(0, 0, '正在处理', 1),
-            makeEvent('tool/call', { turn: 0, step: 0, callId: 'c1', name: 'bash', arguments: '{}' }, 2),
-            makeEvent('tool/call', { turn: 0, step: 0, callId: 'c2', name: 'read', arguments: '{"path":"a.txt"}' }, 3),
-            makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, '已完成'), 4),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant?.toolSummary).toBe('使用 bash / read');
-        expect(assistant?.tools).toEqual([
-            { callId: 'c1', name: 'bash', arguments: '{}' },
-            { callId: 'c2', name: 'read', arguments: '{"path":"a.txt"}' },
-        ]);
-    });
-    it('keeps reasoning text apart from the message body and folds reasoning-delta chunks', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', '复杂问题'), 0),
-            makeEvent('assistant/chunk', { turn: 0, step: 0, chunk: { type: 'reasoning-delta', index: 0, text: '先分析' } }, 1),
-            makeEvent('assistant/chunk', { turn: 0, step: 0, chunk: { type: 'reasoning-delta', index: 0, text: '再行动' } }, 2),
-            makeEvent('assistant/chunk', { turn: 0, step: 0, chunk: { type: 'text-delta', index: 1, text: '结论' } }, 3),
-            makeEvent('assistant/message', {
-                turn: 0,
-                step: 0,
-                message: {
-                    id: 'a-1',
-                    role: 'assistant',
-                    content: [
-                        { type: 'reasoning', text: '先分析再行动' },
-                        { type: 'text', text: '结论' },
-                    ],
-                    source: { kind: 'model', provider: 'fx', model: 'fx-1' },
-                },
-            }, 4),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant).toMatchObject({ text: '结论', reasoning: '先分析再行动', pending: false });
-    });
-    it('keeps streamed reasoning when the final assistant message omits the reasoning block', () => {
-        const streamed = foldEvents([
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 0),
-            makeEvent('assistant/chunk', { turn: 0, step: 0, chunk: { type: 'reasoning-delta', index: 0, text: '思考过程' } }, 1),
-        ]);
-        const finalized = foldEvents([makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, '回答'), 2)], streamed);
-        const assistant = finalized.find(message => message.kind === 'assistant');
-        expect(assistant).toMatchObject({ text: '回答', reasoning: '思考过程', pending: false });
-    });
-    it('dedupes repeated tool/call events by callId', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', '跑测试'), 0),
-            textChunk(0, 0, '开始', 1),
-            makeEvent('tool/call', { turn: 0, step: 0, callId: 'c1', name: 'bash', arguments: '{"cmd":"a"}' }, 2),
-            makeEvent('tool/call', { turn: 0, step: 0, callId: 'c1', name: 'bash', arguments: '{"cmd":"a"}' }, 3),
-            makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, 'done'), 4),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant?.tools).toEqual([{ callId: 'c1', name: 'bash', arguments: '{"cmd":"a"}' }]);
-    });
-    it('marks the assistant message failed when turn/end ends in an error', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', 'hello'), 0),
-            makeEvent('assistant/chunk', { turn: 0, step: 0, chunk: { type: 'text-delta', index: 0, text: '部分' } }, 1),
-            makeEvent('turn/end', { turn: 0, reason: { kind: 'error', error: { message: 'boom', code: 'UNKNOWN' } } }, 2),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant).toMatchObject({ failed: true, pending: false, kind: 'assistant' });
-    });
-    it('does not flag failed for a completed turn', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', 'hello'), 0),
-            makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, 'ok'), 1),
-            makeEvent('turn/end', { turn: 0, reason: { kind: 'completed' } }, 2),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant?.failed).toBeFalsy();
-        expect(assistant?.pending).toBeFalsy();
-    });
-    it('keeps same-turn steps in final-event order after turn/end', () => {
-        const result = foldEvents([
-            makeEvent('user/message', userMessageData('u-1', 'multi-step'), 0),
-            makeEvent('assistant/message', assistantMessageData('step-z', 0, 0, 'first'), 2),
-            makeEvent('assistant/message', assistantMessageData('step-a', 0, 1, 'second'), 4),
-            makeEvent('assistant/message', assistantMessageData('step-m', 0, 2, 'third'), 6),
-            makeEvent('turn/end', { turn: 0, reason: { kind: 'completed' } }, 7),
-        ]);
-        const assistants = result.filter(message => message.kind === 'assistant');
-        expect(assistants.map(message => message.id)).toEqual(['step-z', 'step-a', 'step-m']);
-        expect(assistants.map(message => message.seq)).toEqual([2, 4, 6]);
-        expect(assistants.every(message => message.pending !== true)).toBe(true);
-    });
-    it('keeps stable insertion order when legacy rows share a seq', () => {
-        const folder = new EventFolder([
-            { id: 'z-last-lexically', kind: 'assistant', text: 'first', seq: 5, time: 5_000 },
-            { id: 'a-first-lexically', kind: 'assistant', text: 'second', seq: 5, time: 5_000 },
-        ]);
-        expect(folder.snapshot().map(message => message.id)).toEqual(['z-last-lexically', 'a-first-lexically']);
-    });
-    it('is idempotent: applying the same batch twice yields an identical list', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 0),
-            textChunk(0, 0, '一', 1),
-            textChunk(0, 0, '二', 2),
-            makeEvent('tool/call', { turn: 0, step: 0, callId: 'c1', name: 'bash', arguments: '{}' }, 3),
-            makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, '一二'), 4),
-            makeEvent('turn/end', { turn: 0, reason: { kind: 'completed' } }, 5),
-        ];
-        const once = foldEvents(events);
-        const twice = foldEvents(events, once);
-        expect(twice).toEqual(once);
-        expect(twice.filter(message => message.kind === 'assistant')).toHaveLength(1);
-        // Text must not have doubled from re-aggregating the streamed chunks.
-        expect(twice.find(message => message.kind === 'assistant')?.text).toBe('一二');
-    });
-    it('skips unknown / unsupported event types safely', () => {
-        const events = [
-            makeEvent('session/end-seed', {}, 0),
-            makeEvent('turn/start', { turn: 0 }, 1),
-            makeEvent('user/message', userMessageData('u-1', 'hello'), 2),
-            makeEvent('some/future-plugin', { whatever: true }, 3),
-            makeEvent('goal/change', { objective: 'x' }, 4),
-        ];
-        const result = foldEvents(events);
-        expect(result).toHaveLength(1);
-        expect(result[0]).toMatchObject({ id: 'u-1', kind: 'user' });
-    });
-    it('does not mutate the caller-supplied existing list', () => {
-        const first = foldEvents([makeEvent('user/message', userMessageData('u-1', 'hello'), 0)]);
-        const snapshot = JSON.stringify(first);
-        foldEvents([makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, 'world'), 1)], first);
-        expect(JSON.stringify(first)).toBe(snapshot);
-    });
-    it('request/context sets the context window used by a later assistant/message with usage', () => {
-        const events = [
-            makeEvent('request/context', { provider: 'fx', model: 'fx-1', contextWindow: 100_000 }, 0),
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 1),
-            makeEvent('assistant/message', {
-                turn: 0,
-                step: 0,
-                message: { id: 'a-1', role: 'assistant', content: [{ type: 'text', text: 'ok' }] },
-                usage: { inputTokens: 10, outputTokens: 5 },
-            }, 2),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant).toMatchObject({
-            usage: { inputTokens: 10, outputTokens: 5 },
-            contextWindow: 100_000,
-        });
-    });
-    it('usage without a context window carries no contextWindow', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 0),
-            makeEvent('assistant/message', {
-                turn: 0,
-                step: 0,
-                message: { id: 'a-1', role: 'assistant', content: [{ type: 'text', text: 'ok' }] },
-                usage: { inputTokens: 10, outputTokens: 5 },
-            }, 1),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant).toMatchObject({ usage: { inputTokens: 10, outputTokens: 5 } });
-        expect(assistant?.contextWindow).toBeUndefined();
-    });
-    it('usage and contextWindow are both attached when request/context precedes the message', () => {
-        const events = [
-            makeEvent('request/context', { provider: 'fx', model: 'fx-1', contextWindow: 200_000 }, 0),
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 1),
-            makeEvent('assistant/message', {
-                turn: 0,
-                step: 0,
-                message: { id: 'a-1', role: 'assistant', content: [{ type: 'text', text: 'ok' }] },
-                usage: { inputTokens: 30, outputTokens: 2, cacheReadTokens: 8, cacheWriteTokens: 1 },
-            }, 2),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant).toMatchObject({
-            usage: { inputTokens: 30, outputTokens: 2, cacheReadTokens: 8, cacheWriteTokens: 1 },
-            contextWindow: 200_000,
-        });
-    });
-    it('assistant/message without usage has no usage field', () => {
-        const events = [
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 0),
-            makeEvent('assistant/message', { turn: 0, step: 0, message: { id: 'a-1', role: 'assistant', content: [{ type: 'text', text: 'ok' }] } }, 1),
-        ];
-        const result = foldEvents(events);
-        const assistant = result.find(message => message.kind === 'assistant');
-        expect(assistant?.usage).toBeUndefined();
-        expect(assistant?.contextWindow).toBeUndefined();
-    });
-    it('attaches sourceKind from source.kind for a user message', () => {
-        const events = [
-            makeEvent('user/message', {
-                id: 'u-plugin',
-                role: 'user',
-                content: [{ type: 'text', text: '系统注入' }],
-                source: { kind: 'plugin', name: 'react-extension' },
-            }, 0),
-        ];
-        const result = foldEvents(events);
-        expect(result[0]).toMatchObject({ id: 'u-plugin', kind: 'user', sourceKind: 'plugin' });
-    });
-    it('keeps sourceKind on a replayed/replaced user/message', () => {
-        const first = foldEvents([makeEvent('user/message', {
-                id: 'u-1',
-                role: 'user',
-                content: [{ type: 'text', text: '第一版' }],
-                source: { kind: 'plugin' },
-            }, 0)]);
-        const second = foldEvents([makeEvent('user/message', {
-                id: 'u-1',
-                role: 'user',
-                content: [{ type: 'text', text: '第二版' }],
-                source: { kind: 'plugin' },
-            }, 1)], first);
-        expect(second[0]).toMatchObject({ id: 'u-1', text: '第二版', sourceKind: 'plugin' });
-    });
-    it('request/context and unknown events are still ignored by the fold', () => {
-        const events = [
-            makeEvent('some/future-event', { nope: true }, 0),
-            makeEvent('request/context', { provider: 'fx', model: 'fx-1' }, 1),
-            makeEvent('user/message', userMessageData('u-1', '真实消息'), 2),
-        ];
-        const result = foldEvents(events);
-        // request/context with no window and the unknown event render nothing.
-        expect(result).toHaveLength(1);
-        expect(result[0]).toMatchObject({ id: 'u-1', kind: 'user' });
-    });
-});
-describe('EventFolder incremental folding', () => {
-    it('matches a one-shot fold when events arrive one at a time', () => {
-        const stream = [
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 0),
-            textChunk(0, 0, '你', 1),
-            textChunk(0, 0, '好', 2),
-            makeEvent('assistant/message', assistantMessageData('a-1', 0, 0, '你好'), 3),
-            makeEvent('message/update', { id: 'u-1', text: '更新' }, 4),
-        ];
-        const oneShot = foldEvents(stream);
-        const folder = new EventFolder();
-        let incremental = [];
-        for (const event of stream)
-            incremental = folder.fold([event]);
-        expect(incremental).toEqual(oneShot);
-    });
-    it('replays and re-folds are no-ops and reuse the previous snapshot identity', () => {
-        const folder = new EventFolder(foldEvents([
-            makeEvent('user/message', userMessageData('u-1', 'hi'), 0),
-            textChunk(0, 0, '你', 1),
-        ]));
-        const first = folder.fold([textChunk(0, 0, '好', 2)]);
-        expect(first[first.length - 1]).toMatchObject({ text: '你好', pending: true });
-        // Same event again (wire replay or a double-invoked state updater): no change, same identity.
-        const replay = folder.fold([textChunk(0, 0, '好', 2)]);
-        expect(replay).toBe(first);
-        // A no-op batch over an already folded stream also keeps the identity.
-        expect(folder.fold([])).toBe(first);
-    });
-    it('prepends older pages and keeps folding live events on top', () => {
-        const folder = new EventFolder(foldEvents([
-            makeEvent('user/message', userMessageData('u-2', '第二页'), 10),
-        ]));
-        folder.prepend(foldEvents([makeEvent('user/message', userMessageData('u-1', '第一页'), 5)]));
-        const withLive = folder.fold([textChunk(0, 0, '新', 11)]);
-        expect(withLive.map(message => message.id)).toEqual(['u-1', 'u-2', 'assistant,0.0#11']);
-        // The live fold must not lose the prepended rows on later events.
-        const later = folder.fold([textChunk(0, 0, '续', 12)]);
-        expect(later.map(message => message.id)).toEqual(['u-1', 'u-2', 'assistant,0.0#11']);
-        expect(later[2]).toMatchObject({ text: '新续', pending: true });
-    });
-    it('seed replaces the whole stream', () => {
-        const folder = new EventFolder(foldEvents([makeEvent('user/message', userMessageData('u-1', '旧'), 0)]));
-        folder.seed(foldEvents([makeEvent('user/message', userMessageData('u-2', '新'), 5)]));
-        expect(folder.snapshot().map(message => message.id)).toEqual(['u-2']);
-        expect(folder.fold([textChunk(0, 0, '追加', 6)]).map(message => message.id)).toEqual(['u-2', 'assistant,0.0#6']);
-    });
-});

package/lib/types/mobile/mobile-styles.d.ts

@@ -1,6 +0,0 @@
-/**
- * Mobile surface stylesheet, shipped as a string and injected at boot (the
- * standalone page has no CSS-module pipeline).
- */
-export declare const mobileCss = "/* Mobile surface chrome: standalone stylesheet (no main-UI design tokens \u2014\n   this page boots without the shell). Light-first palette; the dark palette\n   applies only when the header toggle sets [data-theme='dark']. */\n\n:root {\n  --m-bg: #f3f5f9;\n  --m-bg-raised: #ffffff;\n  --m-bg-input: #ffffff;\n  --m-border: #dfe4ec;\n  --m-text: #1c2333;\n  --m-text-secondary: #4d5768;\n  --m-text-tertiary: #8b95a7;\n  --m-accent: #2f6fed;\n  --m-accent-soft: rgba(47, 111, 237, 0.12);\n  --m-danger: #d64545;\n  --m-success: #1e9e6a;\n  --m-radius: 12px;\n  --m-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);\n  --m-shadow-raise: 0 6px 20px rgba(16, 24, 40, 0.1);\n  --m-backdrop: rgba(15, 23, 42, 0.4);\n}\n\n:root[data-theme='dark'] {\n  --m-bg: #111418;\n  --m-bg-raised: #1a1f26;\n  --m-bg-input: #20262e;\n  --m-border: #2b333d;\n  --m-text: #e8eaed;\n  --m-text-secondary: #9aa3ad;\n  --m-text-tertiary: #6b747f;\n  --m-accent: #4f8cff;\n  --m-accent-soft: rgba(79, 140, 255, 0.14);\n  --m-danger: #e5534b;\n  --m-success: #3fb68b;\n  --m-radius: 12px;\n  --m-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);\n  --m-shadow-raise: 0 6px 20px rgba(0, 0, 0, 0.4);\n  --m-backdrop: rgba(0, 0, 0, 0.55);\n}\n\n* {\n  box-sizing: border-box;\n}\n\nhtml,\nbody {\n  margin: 0;\n  padding: 0;\n  height: 100%;\n  background: var(--m-bg);\n  color: var(--m-text);\n  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Noto Sans SC', 'Segoe UI', sans-serif;\n  font-size: 15px;\n  line-height: 1.5;\n  -webkit-text-size-adjust: 100%;\n}\n\n/* The app fills exactly one viewport: the page itself never scrolls, each\n   view owns its scroll region (chat history, session lists) and the chat\n   composer stays pinned to the bottom of the screen. */\n#root {\n  height: 100dvh;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.mobile {\n  min-height: 0;\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n/* \u2500\u2500 header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.mobile-header {\n  position: sticky;\n  top: 0;\n  z-index: 10;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: calc(env(safe-area-inset-top, 0px) + 12px) 16px 10px;\n  background: color-mix(in srgb, var(--m-bg) 88%, transparent);\n  backdrop-filter: blur(10px);\n  border-bottom: 1px solid var(--m-border);\n}\n\n.mobile-title {\n  margin: 0;\n  font-size: 17px;\n  font-weight: 600;\n}\n\n.mobile-titleInline {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.mobile-back {\n  flex: none;\n  width: 32px;\n  height: 32px;\n  border: none;\n  border-radius: 50%;\n  background: transparent;\n  color: var(--m-text);\n  font-size: 22px;\n  line-height: 1;\n  cursor: pointer;\n  transition: background-color 0.12s ease, box-shadow 0.12s ease;\n}\n\n.mobile-back:active {\n  background: var(--m-bg-raised);\n}\n\n.mobile-back:focus-visible {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--m-bg), 0 0 0 4px var(--m-accent);\n}\n\n.mobile-theme-toggle {\n  flex: none;\n  margin-left: auto;\n  width: 32px;\n  height: 32px;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border: none;\n  border-radius: 50%;\n  background: transparent;\n  color: var(--m-text-secondary);\n  cursor: pointer;\n  transition: background-color 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;\n}\n\n.mobile-theme-toggle:active {\n  background: var(--m-bg-raised);\n}\n\n.mobile-theme-toggle:focus-visible {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--m-bg), 0 0 0 4px var(--m-accent);\n}\n\n.mobile-theme-toggle svg {\n  width: 18px;\n  height: 18px;\n}\n\n/* \u2500\u2500 lists \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.mobile-list {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  list-style: none;\n  margin: 0;\n  padding: 8px 0 calc(env(safe-area-inset-bottom, 0px) + 16px);\n}\n\n.mobile-row {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: calc(100% - 24px);\n  margin: 0 12px 8px;\n  padding: 13px 14px;\n  border: 1px solid var(--m-border);\n  border-radius: 14px;\n  background: var(--m-bg-raised);\n  box-shadow: var(--m-shadow);\n  color: var(--m-text);\n  text-align: left;\n  cursor: pointer;\n}\n\n.mobile-row:active {\n  background: color-mix(in srgb, var(--m-text) 5%, var(--m-bg-raised));\n}\n\n.mobile-rowMain {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  align-items: baseline;\n  gap: 8px;\n}\n\n.mobile-rowTitle {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  font-size: 15px;\n}\n\n.mobile-rowMeta {\n  flex: none;\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n}\n\n.mobile-chevron {\n  flex: none;\n  color: var(--m-text-tertiary);\n  font-size: 18px;\n}\n\n.mobile-live {\n  margin-left: 6px;\n  color: var(--m-success);\n  font-size: 10px;\n  vertical-align: middle;\n}\n\n/* \u2500\u2500 empty / error states \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.mobile-empty {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 32px;\n}\n\n.mobile-muted {\n  margin: 0;\n  color: var(--m-text-tertiary);\n}\n\n.mobile-error {\n  margin: 0;\n  color: var(--m-danger);\n}\n\n.mobile-pad {\n  padding: 8px 16px;\n}\n\n.mobile-create {\n  display: grid;\n  gap: 8px;\n}\n\n.mobile-preset {\n  display: grid;\n  gap: 4px;\n}\n\n.mobile-presetLabel {\n  color: var(--m-text-secondary);\n  font-size: 13px;\n  font-weight: 600;\n}\n\n.mobile-presetSelect {\n  width: 100%;\n  height: 40px;\n  padding: 0 36px 0 12px;\n  border: 1px solid var(--m-border);\n  border-radius: 10px;\n  background: var(--m-bg-input);\n  color: var(--m-text);\n  font: inherit;\n}\n\n.mobile-presetSelect:disabled {\n  opacity: 0.6;\n}\n\n.mobile-presetDescription {\n  margin: 0;\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n}\n\n/* \u2500\u2500 buttons \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.mobile-button {\n  height: 38px;\n  padding: 0 18px;\n  border: 1px solid var(--m-border);\n  border-radius: 10px;\n  background: var(--m-bg-raised);\n  color: var(--m-text);\n  font-size: 14px;\n  cursor: pointer;\n}\n\n.mobile-button:disabled {\n  opacity: 0.5;\n}\n\n.mobile-block {\n  display: block;\n  width: calc(100% - 32px);\n  margin: 4px 16px;\n}\n\n/* Primary action (create session): accent fill, readable on both themes. */\n.mobile-new {\n  display: block;\n  width: 100%;\n  height: 44px;\n  border: none;\n  border-radius: 12px;\n  background: linear-gradient(135deg, var(--m-accent) 0%, #4c8dff 100%);\n  color: #fff;\n  font-size: 15px;\n  font-weight: 600;\n  cursor: pointer;\n  box-shadow: 0 2px 8px rgba(47, 111, 237, 0.3);\n}\n\n.mobile-new:active {\n  opacity: 0.88;\n}\n\n.mobile-new:disabled {\n  opacity: 0.6;\n}\n\n.mobile-hint {\n  display: block;\n  margin-top: 2px;\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n}\n\n/* \u2500\u2500 chat \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.chat {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n\n.chat-scroll {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px 14px calc(env(safe-area-inset-bottom, 0px) + 12px);\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.chat-msg {\n  max-width: 88%;\n  padding: 10px 12px;\n  border-radius: var(--m-radius);\n  font-size: 14.5px;\n  line-height: 1.55;\n  overflow-wrap: break-word;\n  white-space: pre-wrap;\n}\n\n.chat-msg-user {\n  align-self: flex-end;\n  background: linear-gradient(135deg, var(--m-accent) 0%, #4c8dff 100%);\n  color: #fff;\n  border-bottom-right-radius: 4px;\n  box-shadow: 0 1px 3px rgba(47, 111, 237, 0.28);\n}\n\n.chat-msg-assistant {\n  align-self: flex-start;\n  background: var(--m-bg-raised);\n  border: 1px solid var(--m-border);\n  border-bottom-left-radius: 4px;\n  box-shadow: var(--m-shadow);\n}\n\n.chat-msg-pending .chat-msg-text::after {\n  content: '\u258D';\n  animation: chat-blink 1s steps(2) infinite;\n}\n\n@keyframes chat-blink {\n  50% {\n    opacity: 0;\n  }\n}\n\n.chat-msg-failed {\n  border-color: var(--m-danger);\n}\n\n.chat-msg-failtag {\n  display: inline-block;\n  margin-top: 6px;\n  padding: 1px 8px;\n  border: 1px solid var(--m-danger);\n  border-radius: 999px;\n  color: var(--m-danger);\n  font-size: 11px;\n}\n\n.chat-msg-time {\n  display: block;\n  margin-top: 4px;\n  color: var(--m-text-tertiary);\n  font-size: 10.5px;\n  line-height: 1.2;\n}\n\n.chat-msg-toggle {\n  display: block;\n  margin-top: 8px;\n  padding: 4px 0;\n  border: none;\n  background: transparent;\n  color: var(--m-accent);\n  font-size: 13px;\n  cursor: pointer;\n}\n\n/* Assistant markdown content (GFM subset; renderer in markdown.ts). */\n.chat-md {\n  white-space: normal;\n}\n.chat-md-collapsed {\n  max-height: 45vh;\n  overflow: hidden;\n  position: relative;\n}\n.chat-md-collapsed::after {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  height: 28px;\n  background: linear-gradient(transparent, var(--m-bg-raised));\n  pointer-events: none;\n}\n.chat-md-body p { margin: 0 0 8px; }\n.chat-md-body p:last-child { margin-bottom: 0; }\n.chat-md-body h1, .chat-md-body h2, .chat-md-body h3,\n.chat-md-body h4, .chat-md-body h5, .chat-md-body h6 {\n  margin: 12px 0 6px;\n  font-weight: 650;\n  line-height: 1.3;\n}\n.chat-md-body h1 { font-size: 1.35em; }\n.chat-md-body h2 { font-size: 1.25em; }\n.chat-md-body h3 { font-size: 1.15em; }\n.chat-md-body h4, .chat-md-body h5, .chat-md-body h6 { font-size: 1.05em; }\n.chat-md-body code {\n  font-family: var(--m-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);\n  font-size: 0.9em;\n  background: var(--m-accent-soft);\n  padding: 1px 5px;\n  border-radius: 4px;\n}\n.chat-md-body pre {\n  margin: 8px 0;\n  padding: 10px;\n  background: #101726;\n  color: #dbe4f5;\n  border-radius: 8px;\n  overflow-x: auto;\n  font-size: 12.5px;\n  line-height: 1.5;\n}\n.chat-md-body pre code {\n  background: transparent;\n  padding: 0;\n  color: inherit;\n}\n.chat-md-body ul, .chat-md-body ol { margin: 4px 0 8px; padding-left: 22px; }\n.chat-md-body li { margin: 2px 0; }\n.chat-md-body blockquote {\n  margin: 8px 0;\n  padding: 4px 10px;\n  border-left: 3px solid var(--m-accent);\n  background: var(--m-accent-soft);\n  border-radius: 0 6px 6px 0;\n  color: var(--m-text-secondary);\n}\n.chat-md-body table {\n  margin: 8px 0;\n  border-collapse: collapse;\n  display: block;\n  overflow-x: auto;\n  font-size: 13px;\n}\n.chat-md-body th, .chat-md-body td {\n  border: 1px solid var(--m-border);\n  padding: 4px 8px;\n}\n.chat-md-body th { background: var(--m-accent-soft); }\n.chat-md-body a { color: var(--m-accent); }\n.chat-md-body hr { border: none; border-top: 1px solid var(--m-border); margin: 10px 0; }\n.chat-md-body img { max-width: 100%; border-radius: 8px; }\n\n/* \u2500\u2500 message disclosures (reasoning / tools) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.chat-disclosure {\n  margin-bottom: 8px;\n  border: 1px solid var(--m-border);\n  border-radius: 10px;\n  background: color-mix(in srgb, var(--m-bg) 55%, transparent);\n  overflow: hidden;\n}\n\n.chat-disclosure-head {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  width: 100%;\n  padding: 7px 10px;\n  border: none;\n  background: transparent;\n  color: var(--m-text);\n  font-size: 12.5px;\n  text-align: left;\n  cursor: pointer;\n  white-space: nowrap;\n}\n\n.chat-disclosure-caret {\n  flex: none;\n  color: var(--m-text-tertiary);\n  font-size: 14px;\n  line-height: 1;\n  transition: transform 0.15s ease;\n}\n\n.chat-disclosure-open .chat-disclosure-caret {\n  transform: rotate(90deg);\n}\n\n.chat-disclosure-label {\n  flex: none;\n  color: var(--m-text-secondary);\n}\n\n.chat-reasoning[data-pending] .chat-disclosure-label {\n  color: var(--m-accent);\n}\n\n.chat-disclosure-summary {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n}\n\n.chat-disclosure-count {\n  flex: none;\n  color: var(--m-text-tertiary);\n  font-size: 11px;\n}\n\n.chat-disclosure-body {\n  padding: 8px 10px 10px;\n  border-top: 1px dashed var(--m-border);\n  color: var(--m-text-secondary);\n  font-size: 12.5px;\n  line-height: 1.6;\n  overflow-wrap: break-word;\n  white-space: pre-wrap;\n  max-height: 40vh;\n  overflow-y: auto;\n}\n\n.chat-tools-body {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.chat-tool-card {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  padding: 6px 8px;\n  border: 1px solid var(--m-border);\n  border-radius: 8px;\n  background: var(--m-bg-raised);\n}\n\n.chat-tool-pills {\n  display: flex;\n  gap: 4px;\n  flex-wrap: wrap;\n  align-items: center;\n}\n\n.chat-tool-pill {\n  display: inline-block;\n  padding: 1px 7px;\n  border-radius: 999px;\n  background: var(--m-accent-soft);\n  color: var(--m-accent);\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n  font-weight: 600;\n  white-space: nowrap;\n}\n\n.chat-tool-args {\n  margin: 0;\n  padding: 6px 8px;\n  border-radius: 6px;\n  background: var(--m-bg-input);\n  color: var(--m-text-secondary);\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n  line-height: 1.5;\n  overflow-wrap: break-word;\n  white-space: pre-wrap;\n  max-height: 200px;\n  overflow-y: auto;\n}\n\n/* \u2500\u2500 turn status indicator (#1017) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.chat-turn-status {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 10px 16px;\n  color: var(--m-accent);\n  font-size: 13px;\n  font-weight: 600;\n  background: linear-gradient(\n    90deg,\n    var(--m-accent) 0%,\n    color-mix(in srgb, var(--m-accent) 60%, #ffffff) 50%,\n    var(--m-accent) 100%\n  );\n  background-size: 200% 100%;\n  background-clip: text;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: dsh-shimmer 1.8s linear infinite;\n}\n\n.chat-turn-dots {\n  display: inline-flex;\n  gap: 3px;\n}\n\n.chat-turn-dots span {\n  display: inline-block;\n  width: 5px;\n  height: 5px;\n  border-radius: 50%;\n  background: var(--m-accent);\n  animation: dsh-dot-bounce 1.2s ease-in-out infinite;\n}\n\n.chat-turn-dots span:nth-child(2) {\n  animation-delay: 0.15s;\n}\n\n.chat-turn-dots span:nth-child(3) {\n  animation-delay: 0.3s;\n}\n\n@keyframes dsh-shimmer {\n  from { background-position: 200% 0; }\n  to { background-position: -200% 0; }\n}\n\n@keyframes dsh-dot-bounce {\n  0%, 80%, 100% { transform: translateY(0); opacity: 0.4; }\n  40% { transform: translateY(-4px); opacity: 1; }\n}\n\n/* \u2500\u2500 approval panel (#1025) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.chat-approval-panel {\n  margin: 8px 12px;\n  padding: 10px 12px;\n  border: 1px solid var(--m-accent);\n  border-radius: var(--m-radius);\n  background: var(--m-bg-raised);\n  box-shadow: var(--m-shadow);\n}\n\n.chat-approval-header {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin-bottom: 8px;\n}\n\n.chat-approval-reason {\n  color: var(--m-text-secondary);\n  font-size: 12.5px;\n}\n\n.chat-approval-error {\n  margin: 4px 0;\n  color: var(--m-danger);\n  font-size: 12px;\n}\n\n.chat-approval-actions {\n  display: flex;\n  gap: 8px;\n}\n\n.chat-approval-allow {\n  flex: 1;\n  height: 34px;\n  border: none;\n  border-radius: 8px;\n  background: var(--m-accent);\n  color: #fff;\n  font: inherit;\n  font-size: 13px;\n  font-weight: 600;\n  cursor: pointer;\n}\n\n.chat-approval-allow:disabled {\n  opacity: 0.6;\n}\n\n.chat-approval-reject {\n  flex: 1;\n  height: 34px;\n  border: 1px solid var(--m-border);\n  border-radius: 8px;\n  background: var(--m-bg-raised);\n  color: var(--m-text);\n  font: inherit;\n  font-size: 13px;\n  cursor: pointer;\n}\n\n.chat-approval-reject:disabled {\n  opacity: 0.6;\n}\n\n/* \u2500\u2500 question panel (#1025) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.chat-question-panel {\n  margin: 8px 12px;\n  padding: 10px 12px;\n  border: 1px solid var(--m-accent);\n  border-radius: var(--m-radius);\n  background: var(--m-bg-raised);\n  box-shadow: var(--m-shadow);\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.chat-question-group {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n\n.chat-question-header {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--m-text);\n}\n\n.chat-question-text {\n  font-size: 13px;\n  color: var(--m-text);\n  line-height: 1.5;\n}\n\n.chat-question-detail {\n  font-size: 12px;\n  color: var(--m-text-secondary);\n  line-height: 1.5;\n}\n\n.chat-question-options {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.chat-question-option {\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  padding: 8px 10px;\n  border: 1px solid var(--m-border);\n  border-radius: 8px;\n  cursor: pointer;\n  font-size: 13px;\n  transition: border-color 0.12s, background 0.12s;\n}\n\n.chat-question-option input {\n  margin: 2px 0 0;\n  flex: none;\n}\n\n.chat-question-option-selected {\n  border-color: var(--m-accent);\n  background: var(--m-accent-soft);\n}\n\n.chat-question-option-label {\n  color: var(--m-text);\n  font-weight: 500;\n}\n\n.chat-question-option-desc {\n  display: block;\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n}\n\n.chat-question-custom {\n  width: 100%;\n  min-height: 40px;\n  box-sizing: border-box;\n  padding: 8px 10px;\n  border: 1px solid var(--m-border);\n  border-radius: 8px;\n  background: var(--m-bg-input);\n  color: var(--m-text);\n  font: inherit;\n  font-size: 13px;\n  resize: vertical;\n  outline: none;\n}\n\n.chat-question-custom:focus-visible {\n  border-color: var(--m-accent);\n}\n\n.chat-question-submit {\n  height: 36px;\n  border: none;\n  border-radius: 8px;\n  background: var(--m-accent);\n  color: #fff;\n  font: inherit;\n  font-size: 13px;\n  font-weight: 600;\n  cursor: pointer;\n}\n\n.chat-question-submit:disabled {\n  opacity: 0.6;\n}\n\n\n/* \u2500\u2500 composer toolbar (model / permission chips) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.chat-tools {\n  display: flex;\n  gap: 8px;\n  padding: 6px 12px 0;\n}\n\n.chat-chip {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  height: 32px;\n  padding: 0 10px;\n  border: 1px solid var(--m-border);\n  border-radius: 999px;\n  background: var(--m-bg-raised);\n  box-shadow: var(--m-shadow);\n  color: var(--m-text);\n  font-size: 12px;\n  cursor: pointer;\n}\n\n.chat-chip:active {\n  border-color: var(--m-accent);\n  background: var(--m-accent-soft);\n}\n\n.chat-chip-label {\n  flex: none;\n  color: var(--m-text-tertiary);\n}\n\n.chat-chip-value {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.chat-chip-chevron {\n  flex: none;\n  color: var(--m-text-tertiary);\n  font-size: 14px;\n}\n\n/* \u2500\u2500 bottom sheets \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.sheet-backdrop {\n  position: fixed;\n  inset: 0;\n  z-index: 50;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n  background: var(--m-backdrop);\n  animation: sheet-fade 0.18s ease;\n}\n\n@keyframes sheet-fade {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n.sheet {\n  max-height: 74dvh;\n  display: flex;\n  flex-direction: column;\n  background: var(--m-bg-raised);\n  border: 1px solid var(--m-border);\n  border-bottom: none;\n  border-radius: 16px 16px 0 0;\n  box-shadow: var(--m-shadow-raise);\n  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 10px);\n  animation: sheet-up 0.22s ease;\n}\n\n@keyframes sheet-up {\n  from {\n    transform: translateY(40px);\n    opacity: 0.6;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n\n.sheet-handle {\n  flex: none;\n  align-self: center;\n  width: 36px;\n  height: 4px;\n  margin: 8px 0 4px;\n  border-radius: 999px;\n  background: var(--m-border);\n}\n\n.sheet-title {\n  flex: none;\n  padding: 6px 16px 10px;\n  font-size: 15px;\n  font-weight: 600;\n}\n\n.sheet-body {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  padding: 0 12px 8px;\n}\n\n.sheet-status {\n  padding: 18px 8px;\n  color: var(--m-text-tertiary);\n  font-size: 13px;\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 8px;\n}\n\n.sheet-status-error {\n  color: var(--m-danger);\n}\n\n.sheet-hint {\n  margin: 0;\n  color: var(--m-text-secondary);\n  font-size: 12px;\n  line-height: 1.5;\n  max-width: 32em;\n}\n\n.sheet-error {\n  margin: 0 0 8px;\n  color: var(--m-danger);\n  font-size: 12.5px;\n}\n\n.sheet-section {\n  margin-bottom: 14px;\n}\n\n.sheet-section-title {\n  padding: 4px 8px 6px;\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.sheet-option {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 10px 12px;\n  border: 1px solid transparent;\n  border-radius: 10px;\n  background: transparent;\n  color: var(--m-text);\n  text-align: left;\n  cursor: pointer;\n}\n\n.sheet-option:active {\n  background: var(--m-bg-input);\n}\n\n.sheet-option-selected {\n  border-color: var(--m-accent);\n  background: color-mix(in srgb, var(--m-accent) 12%, transparent);\n}\n\n.sheet-option:disabled {\n  opacity: 0.5;\n}\n\n.sheet-option-copy {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.sheet-option-title {\n  font-size: 14px;\n}\n\n.sheet-option-desc {\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n  line-height: 1.4;\n}\n\n.sheet-option-check {\n  flex: none;\n  color: var(--m-accent);\n  font-size: 15px;\n  font-weight: 700;\n}\n\n.sheet-confirm-desc {\n  margin: 0 4px 14px;\n  color: var(--m-text-secondary);\n  font-size: 13px;\n  line-height: 1.6;\n}\n\n.sheet-confirm-actions {\n  display: flex;\n  gap: 10px;\n  padding: 4px;\n}\n\n.sheet-confirm-actions .mobile-button {\n  flex: 1;\n}\n\n.sheet-confirm-danger {\n  flex: 1;\n  height: 38px;\n  border: none;\n  border-radius: 10px;\n  background: var(--m-danger);\n  color: #fff;\n  font-size: 14px;\n  cursor: pointer;\n}\n\n.sheet-confirm-danger:disabled {\n  opacity: 0.5;\n}\n\n.chat-meta {\n  margin-top: 4px;\n  color: var(--m-text-tertiary);\n  font-size: 11px;\n}\n\n.chat-typing {\n  color: var(--m-text-tertiary);\n  font-size: 13px;\n  padding: 4px 2px;\n}\n\n.chat-inputbar {\n  display: flex;\n  gap: 8px;\n  padding: 10px 12px calc(env(safe-area-inset-bottom, 0px) + 10px);\n  border-top: 1px solid var(--m-border);\n  background: var(--m-bg);\n}\n\n.chat-input {\n  flex: 1;\n  min-width: 0;\n  min-height: 40px;\n  max-height: 120px;\n  /* Grow with the content (still bounded by min/max-height); browsers\n     without field-sizing support ignore this line and keep the old size. */\n  field-sizing: content;\n  padding: 9px 12px;\n  border: 1px solid var(--m-border);\n  border-radius: 10px;\n  background: var(--m-bg-input);\n  color: var(--m-text);\n  font: inherit;\n  font-size: 14.5px;\n  resize: none;\n  outline: none;\n}\n\n.chat-input:focus {\n  border-color: var(--m-accent);\n}\n\n.chat-send {\n  flex: none;\n  align-self: flex-end;\n  height: 40px;\n  padding: 0 16px;\n  border: none;\n  border-radius: 10px;\n  background: var(--m-accent);\n  color: #fff;\n  font-size: 14px;\n  cursor: pointer;\n}\n\n.chat-send:disabled {\n  opacity: 0.5;\n}\n\n/* Running state: the primary button carries only the square stop icon, so\n   it centers the glyph instead of sizing to text. */\n.chat-send-stop {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 44px;\n  padding: 0 12px;\n}\n\n.chat-load-older {\n  align-self: center;\n  margin: 4px 0;\n  border: none;\n  background: transparent;\n  color: var(--m-text-secondary);\n  font-size: 13px;\n  cursor: pointer;\n  padding: 6px 10px;\n}\n\n/* Touch surfaces have no hover, so keyboard focus must be fully visible.\n   One shared ring keeps every interactive control consistent and readable\n   on both palettes. */\n.mobile-row:focus-visible,\n.mobile-button:focus-visible,\n.mobile-new:focus-visible,\n.mobile-presetSelect:focus-visible,\n.chat-send:focus-visible,\n.chat-chip:focus-visible,\n.chat-msg-toggle:focus-visible,\n.chat-load-older:focus-visible,\n.chat-disclosure-head:focus-visible,\n.sheet-option:focus-visible,\n.sheet-confirm-danger:focus-visible,\n.sheet-toggle-switch:focus-visible,\n.chat-input:focus-visible {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--m-bg), 0 0 0 4px var(--m-accent);\n}\n\n/* \u2500\u2500 chat context usage chip (chat-tools row) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.chat-context {\n  flex: none;\n  align-self: center;\n  padding: 2px 10px;\n  border: 1px solid var(--m-border);\n  border-radius: 999px;\n  background: color-mix(in srgb, var(--m-text-tertiary) 10%, transparent);\n  color: var(--m-text-tertiary);\n  font-size: 11px;\n  line-height: 1.6;\n  white-space: nowrap;\n}\n\n.chat-context-warn {\n  border-color: var(--m-danger);\n  background: color-mix(in srgb, var(--m-danger) 14%, transparent);\n  color: var(--m-danger);\n}\n\n/* \u2500\u2500 display sheet toggle rows \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.sheet-toggle-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 8px;\n  border-bottom: 1px solid var(--m-border);\n}\n\n.sheet-toggle-row:last-child {\n  border-bottom: none;\n}\n\n.sheet-toggle-copy {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.sheet-toggle-title {\n  font-size: 14px;\n}\n\n.sheet-toggle-desc {\n  color: var(--m-text-tertiary);\n  font-size: 12px;\n  line-height: 1.4;\n}\n\n.sheet-toggle-switch {\n  position: relative;\n  flex: none;\n  width: 44px;\n  height: 26px;\n  border: none;\n  border-radius: 999px;\n  background: var(--m-border);\n  cursor: pointer;\n  transition: background-color 0.15s ease;\n}\n\n.sheet-toggle-switch-on {\n  background: var(--m-accent);\n}\n\n.sheet-toggle-switch-knob {\n  position: absolute;\n  top: 3px;\n  left: 3px;\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  background: #fff;\n  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.2);\n  transition: transform 0.15s ease;\n}\n\n.sheet-toggle-switch-on .sheet-toggle-switch-knob {\n  transform: translateX(18px);\n}\n\n/* Accessibility: collapse every interaction/enter animation for\n   reduced-motion users; surface layout itself stays static. */\n@media (prefers-reduced-motion: reduce) {\n  .mobile-theme-toggle,\n  .mobile-back,\n  .mobile-row,\n  .mobile-button,\n  .mobile-new,\n  .chat-send,\n  .chat-chip,\n  .chat-msg-toggle,\n  .chat-load-older,\n  .chat-disclosure-head,\n  .chat-disclosure-caret,\n  .chat-msg-pending .chat-msg-text::after,\n  .sheet-backdrop,\n  .sheet,\n  .sheet-option,\n  .sheet-confirm-danger,\n  .sheet-toggle-switch,\n  .sheet-toggle-switch-knob,\n  .chat-input,\n  .chat-turn-status,\n  .chat-turn-dots span {\n    animation: none;\n    transition: none;\n  }\n  .chat-turn-status {\n    background: none;\n    -webkit-text-fill-color: var(--m-accent);\n  }\n}\n\n/* \u2500\u2500 installed-app pairing \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.mobile-pair {\n  min-height: 100dvh;\n  display: grid;\n  place-items: center;\n  padding: 24px;\n}\n\n.mobile-pairCard {\n  display: grid;\n  width: min(100%, 420px);\n  gap: 12px;\n  padding: 24px;\n  border: 1px solid var(--m-border);\n  border-radius: 12px;\n  background: var(--m-bg-raised);\n  box-shadow: var(--m-shadow-raise);\n}\n\n.mobile-pairLabel {\n  color: var(--m-text-secondary);\n  font-size: 13px;\n  font-weight: 600;\n}\n\n.mobile-pairInput {\n  width: 100%;\n  min-height: 42px;\n  box-sizing: border-box;\n  padding: 9px 12px;\n  border: 1px solid var(--m-border);\n  border-radius: 8px;\n  background: var(--m-bg-input);\n  color: var(--m-text);\n  font: inherit;\n  outline: none;\n}\n\n.mobile-pairInput:focus-visible {\n  border-color: var(--m-accent);\n  box-shadow: 0 0 0 2px var(--m-bg), 0 0 0 4px var(--m-accent);\n}\n\n.mobile-pairSubmit {\n  width: 100%;\n}\n\n/* \u2500\u2500 directory browser \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n.dir-browser {\n  display: flex;\n  flex-direction: column;\n}\n\n.dir-crumbs {\n  display: flex;\n  align-items: center;\n  overflow-x: auto;\n  padding: 12px 16px;\n  background: var(--m-bg-raised);\n  border-bottom: 1px solid var(--m-border);\n  white-space: nowrap;\n}\n\n.dir-crumbs::-webkit-scrollbar {\n  display: none;\n}\n\n.dir-crumb {\n  border: none;\n  background: transparent;\n  padding: 4px 6px;\n  color: var(--m-text);\n  font-size: 14px;\n  cursor: pointer;\n}\n\n.dir-crumb:active {\n  background: var(--m-bg-input);\n  border-radius: 4px;\n}\n\n.dir-crumb-separator {\n  color: var(--m-text-tertiary);\n  margin: 0 4px;\n  font-size: 14px;\n}\n\n.dir-entry {\n  padding-left: 16px;\n}\n\n.dir-entry-hidden {\n  opacity: 0.5;\n}\n\n.dir-select {\n  padding: 16px;\n  background: var(--m-bg);\n  border-top: 1px solid var(--m-border);\n}\n\n.dir-empty {\n  padding: 40px 0;\n}\n";
-//# sourceMappingURL=mobile-styles.d.ts.map

package/lib/types/mobile/mobile-styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"mobile-styles.d.ts","sourceRoot":"","sources":["../../../src/mobile/mobile-styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,SAAS,w4/BAy5CrB,CAAA"}