aicodeswitch 1.6.1 → 1.7.0

package/dist/server/transformers/streaming.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ClaudeToOpenAIResponsesEventTransform = exports.OpenAIResponsesToClaudeEventTransform = exports.OpenAIToClaudeEventTransform = exports.rewriteStream = exports.SSESerializerTransform = exports.SSEParserTransform = void 0;
+exports.ClaudeToOpenAIChatEventTransform = exports.OpenAIToClaudeEventTransform = exports.rewriteStream = exports.SSESerializerTransform = exports.SSEParserTransform = void 0;
 const stream_1 = require("stream");
 const crypto_1 = __importDefault(require("crypto"));
 const claude_openai_1 = require("./claude-openai");
@@ -406,45 +406,33 @@ class OpenAIToClaudeEventTransform extends stream_1.Transform {
     }
 }
 exports.OpenAIToClaudeEventTransform = OpenAIToClaudeEventTransform;
-class OpenAIResponsesToClaudeEventTransform extends stream_1.Transform {
+class ClaudeToOpenAIChatEventTransform extends stream_1.Transform {
     constructor(options) {
         var _a;
         super({ objectMode: true });
-        Object.defineProperty(this, "contentIndex", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 0
-        });
-        Object.defineProperty(this, "textBlockIndex", {
+        Object.defineProperty(this, "pendingToolCallId", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: null
         });
-        Object.defineProperty(this, "toolCalls", {
+        Object.defineProperty(this, "pendingToolName", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: new Map()
-        });
-        Object.defineProperty(this, "toolCallKeyToBlockIndex", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Map()
+            value: null
         });
-        Object.defineProperty(this, "hasMessageStart", {
+        Object.defineProperty(this, "pendingToolArgs", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: false
+            value: ''
         });
-        Object.defineProperty(this, "stopReason", {
+        Object.defineProperty(this, "toolCallIndex", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: 'end_turn'
+            value: 0
         });
         Object.defineProperty(this, "usage", {
             enumerable: true,
@@ -452,437 +440,104 @@ class OpenAIResponsesToClaudeEventTransform extends stream_1.Transform {
             writable: true,
             value: null
         });
-        Object.defineProperty(this, "messageId", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "model", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "finalized", {
+        Object.defineProperty(this, "finished", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        this.model = (_a = options === null || options === void 0 ? void 0 : options.model) !== null && _a !== void 0 ? _a : null;
-    }
-    getUsage() {
-        if (!this.usage)
-            return undefined;
-        return Object.assign({}, this.usage);
-    }
-    _transform(event, _encoding, callback) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4;
-        if (this.finalized) {
-            callback();
-            return;
-        }
-        const eventType = event.event || ((_a = event.data) === null || _a === void 0 ? void 0 : _a.type) || '';
-        if (eventType.includes('response.created')) {
-            const response = ((_b = event.data) === null || _b === void 0 ? void 0 : _b.response) || event.data;
-            if (response === null || response === void 0 ? void 0 : response.id)
-                this.messageId = response.id;
-            if (response === null || response === void 0 ? void 0 : response.model)
-                this.model = response.model;
-            this.ensureMessageStart();
-            callback();
-            return;
-        }
-        if (eventType.includes('output_text')) {
-            const deltaText = (_d = (_c = event.data) === null || _c === void 0 ? void 0 : _c.delta) !== null && _d !== void 0 ? _d : (_e = event.data) === null || _e === void 0 ? void 0 : _e.text;
-            if (typeof deltaText === 'string' && deltaText.length > 0) {
-                this.handleTextDelta(deltaText);
-            }
-            if (eventType.includes('done')) {
-                this.closeTextBlock();
-            }
-            callback();
-            return;
-        }
-        if (eventType.includes('tool_call')) {
-            const toolId = ((_f = event.data) === null || _f === void 0 ? void 0 : _f.tool_call_id) || ((_g = event.data) === null || _g === void 0 ? void 0 : _g.id) || ((_j = (_h = event.data) === null || _h === void 0 ? void 0 : _h.tool_call) === null || _j === void 0 ? void 0 : _j.id) || `tool_${this.toolCalls.size + 1}`;
-            const toolName = ((_k = event.data) === null || _k === void 0 ? void 0 : _k.name) || ((_m = (_l = event.data) === null || _l === void 0 ? void 0 : _l.tool_call) === null || _m === void 0 ? void 0 : _m.name) || 'tool';
-            const delta = (_p = (_o = event.data) === null || _o === void 0 ? void 0 : _o.delta) !== null && _p !== void 0 ? _p : (_q = event.data) === null || _q === void 0 ? void 0 : _q.arguments;
-            if (typeof delta === 'string') {
-                this.handleToolDelta(toolId, toolName, delta);
-            }
-            if (eventType.includes('done')) {
-                const key = toolId || toolName;
-                this.closeToolBlock(key);
-            }
-            callback();
-            return;
-        }
-        if (eventType.includes('response.completed')) {
-            const response = ((_r = event.data) === null || _r === void 0 ? void 0 : _r.response) || event.data;
-            if (response === null || response === void 0 ? void 0 : response.usage) {
-                const inputTokens = (_v = (_t = (_s = response.usage) === null || _s === void 0 ? void 0 : _s.input_tokens) !== null && _t !== void 0 ? _t : (_u = response.usage) === null || _u === void 0 ? void 0 : _u.prompt_tokens) !== null && _v !== void 0 ? _v : 0;
-                const outputTokens = (_z = (_x = (_w = response.usage) === null || _w === void 0 ? void 0 : _w.output_tokens) !== null && _x !== void 0 ? _x : (_y = response.usage) === null || _y === void 0 ? void 0 : _y.completion_tokens) !== null && _z !== void 0 ? _z : 0;
-                const cacheRead = (_4 = (_1 = (_0 = response.usage) === null || _0 === void 0 ? void 0 : _0.cache_read_input_tokens) !== null && _1 !== void 0 ? _1 : (_3 = (_2 = response.usage) === null || _2 === void 0 ? void 0 : _2.prompt_tokens_details) === null || _3 === void 0 ? void 0 : _3.cached_tokens) !== null && _4 !== void 0 ? _4 : 0;
-                this.usage = {
-                    input_tokens: inputTokens,
-                    output_tokens: outputTokens,
-                    cache_read_input_tokens: cacheRead,
-                };
-            }
-            this.finalize();
-            callback();
-            return;
-        }
-        callback();
-    }
-    _flush(callback) {
-        this.finalize();
-        callback();
-    }
-    assignContentBlockIndex() {
-        const index = this.contentIndex;
-        this.contentIndex += 1;
-        return index;
-    }
-    pushEvent(type, data) {
-        this.push({ event: type, data });
-    }
-    ensureMessageStart() {
-        if (this.hasMessageStart)
-            return;
-        const message = {
-            id: this.messageId || `msg_${crypto_1.default.randomUUID()}`,
-            type: 'message',
-            role: 'assistant',
-            content: [],
-            model: this.model || 'unknown',
-            stop_reason: null,
-            stop_sequence: null,
-            usage: {
-                input_tokens: 0,
-                output_tokens: 0,
-            },
-        };
-        this.pushEvent('message_start', { type: 'message_start', message });
-        this.hasMessageStart = true;
-    }
-    handleTextDelta(text) {
-        this.ensureMessageStart();
-        if (this.textBlockIndex === null) {
-            this.textBlockIndex = this.assignContentBlockIndex();
-            this.pushEvent('content_block_start', {
-                type: 'content_block_start',
-                index: this.textBlockIndex,
-                content_block: { type: 'text' },
-            });
-        }
-        this.pushEvent('content_block_delta', {
-            type: 'content_block_delta',
-            index: this.textBlockIndex,
-            delta: { type: 'text_delta', text },
-        });
-    }
-    closeTextBlock() {
-        if (this.textBlockIndex === null)
-            return;
-        this.pushEvent('content_block_stop', {
-            type: 'content_block_stop',
-            index: this.textBlockIndex,
-        });
-        this.textBlockIndex = null;
-    }
-    handleToolDelta(toolId, toolName, delta) {
-        this.ensureMessageStart();
-        const key = toolId || toolName;
-        if (!this.toolCalls.has(key)) {
-            const toolBlockIndex = this.assignContentBlockIndex();
-            this.toolCalls.set(key, { id: toolId, name: toolName, arguments: '' });
-            this.toolCallKeyToBlockIndex.set(key, toolBlockIndex);
-            this.pushEvent('content_block_start', {
-                type: 'content_block_start',
-                index: toolBlockIndex,
-                content_block: { type: 'tool_use', id: toolId, name: toolName },
-            });
-        }
-        const toolEntry = this.toolCalls.get(key);
-        if (toolEntry) {
-            toolEntry.arguments += delta;
-        }
-        const blockIndex = this.toolCallKeyToBlockIndex.get(key);
-        if (blockIndex !== undefined) {
-            this.pushEvent('content_block_delta', {
-                type: 'content_block_delta',
-                index: blockIndex,
-                delta: { type: 'input_json_delta', partial_json: delta },
-            });
-        }
-    }
-    closeToolBlock(key) {
-        const blockIndex = this.toolCallKeyToBlockIndex.get(key);
-        if (blockIndex === undefined)
-            return;
-        this.pushEvent('content_block_stop', {
-            type: 'content_block_stop',
-            index: blockIndex,
-        });
-        this.toolCallKeyToBlockIndex.delete(key);
-        this.toolCalls.delete(key);
-    }
-    finalize() {
-        if (this.finalized)
-            return;
-        this.ensureMessageStart();
-        this.closeTextBlock();
-        for (const blockIndex of this.toolCallKeyToBlockIndex.values()) {
-            this.pushEvent('content_block_stop', {
-                type: 'content_block_stop',
-                index: blockIndex,
-            });
-        }
-        this.toolCallKeyToBlockIndex.clear();
-        this.toolCalls.clear();
-        const usage = this.usage || {
-            input_tokens: 0,
-            output_tokens: 0,
-            cache_read_input_tokens: 0,
-        };
-        this.pushEvent('message_delta', {
-            type: 'message_delta',
-            delta: { stop_reason: this.stopReason, stop_sequence: null },
-            usage,
-        });
-        this.pushEvent('message_stop', { type: 'message_stop' });
-        this.finalized = true;
-    }
-}
-exports.OpenAIResponsesToClaudeEventTransform = OpenAIResponsesToClaudeEventTransform;
-class ClaudeToOpenAIResponsesEventTransform extends stream_1.Transform {
-    constructor(options) {
-        var _a;
-        super({ objectMode: true });
-        Object.defineProperty(this, "responseId", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
         Object.defineProperty(this, "model", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: null
         });
-        Object.defineProperty(this, "createdAt", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: Date.now()
-        });
-        Object.defineProperty(this, "outputText", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: ''
-        });
-        Object.defineProperty(this, "textBlockIndex", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "toolCalls", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Map()
-        });
-        Object.defineProperty(this, "completedToolCalls", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "usage", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "hasCreated", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
         this.model = (_a = options === null || options === void 0 ? void 0 : options.model) !== null && _a !== void 0 ? _a : null;
     }
     getUsage() {
-        if (!this.usage)
-            return undefined;
-        return Object.assign({}, this.usage);
+        return this.usage;
     }
     _transform(event, _encoding, callback) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        const eventType = event.event || '';
-        if (eventType === 'message_start') {
-            const message = (_a = event.data) === null || _a === void 0 ? void 0 : _a.message;
-            if (message === null || message === void 0 ? void 0 : message.id)
-                this.responseId = message.id;
-            if (message === null || message === void 0 ? void 0 : message.model)
-                this.model = message.model;
-            this.ensureResponseCreated();
+        if (this.finished) {
             callback();
             return;
         }
-        if (eventType === 'content_block_start') {
-            const block = (_b = event.data) === null || _b === void 0 ? void 0 : _b.content_block;
-            const index = (_c = event.data) === null || _c === void 0 ? void 0 : _c.index;
-            if ((block === null || block === void 0 ? void 0 : block.type) === 'text') {
-                this.textBlockIndex = index;
-            }
-            if ((block === null || block === void 0 ? void 0 : block.type) === 'tool_use' && typeof index === 'number') {
-                this.toolCalls.set(index, {
-                    id: block.id || `tool_${index}`,
-                    name: block.name || 'tool',
-                    arguments: '',
-                });
-            }
+        const type = event.event;
+        const data = event.data;
+        if (type === 'message_start' && (data === null || data === void 0 ? void 0 : data.message)) {
+            this.model = data.message.model || this.model;
+            this.push({ event: null, data: { id: data.message.id, model: this.model, choices: [{ index: 0, delta: { role: 'assistant' }, finish_reason: null }] } });
             callback();
             return;
         }
-        if (eventType === 'content_block_delta') {
-            const delta = (_d = event.data) === null || _d === void 0 ? void 0 : _d.delta;
-            const index = (_e = event.data) === null || _e === void 0 ? void 0 : _e.index;
-            if ((delta === null || delta === void 0 ? void 0 : delta.type) === 'text_delta' && typeof delta.text === 'string') {
-                this.ensureResponseCreated();
-                this.outputText += delta.text;
-                this.pushEvent('response.output_text.delta', {
-                    type: 'response.output_text.delta',
-                    delta: delta.text,
-                    output_index: 0,
-                    content_index: 0,
-                });
+        if (type === 'content_block_start' && (data === null || data === void 0 ? void 0 : data.content_block)) {
+            if (data.content_block.type === 'text') {
+                // 文本块开始
             }
-            if ((delta === null || delta === void 0 ? void 0 : delta.type) === 'input_json_delta' && typeof delta.partial_json === 'string' && typeof index === 'number') {
-                const tool = this.toolCalls.get(index);
-                if (tool) {
-                    tool.arguments += delta.partial_json;
-                    this.ensureResponseCreated();
-                    this.pushEvent('response.output_tool_call.delta', {
-                        type: 'response.output_tool_call.delta',
-                        delta: delta.partial_json,
-                        output_index: index,
-                        tool_call_id: tool.id,
-                        name: tool.name,
-                    });
-                }
+            else if (data.content_block.type === 'tool_use') {
+                this.pendingToolCallId = data.content_block.id;
+                this.pendingToolName = data.content_block.name;
+                this.pendingToolArgs = '';
             }
             callback();
             return;
         }
-        if (eventType === 'content_block_stop') {
-            const index = (_f = event.data) === null || _f === void 0 ? void 0 : _f.index;
-            if (typeof index === 'number') {
-                if (this.textBlockIndex === index) {
-                    this.pushEvent('response.output_text.done', {
-                        type: 'response.output_text.done',
-                        text: this.outputText,
-                        output_index: 0,
-                        content_index: 0,
-                    });
-                    this.textBlockIndex = null;
-                }
-                const tool = this.toolCalls.get(index);
-                if (tool) {
-                    this.completedToolCalls.push(tool);
-                    this.pushEvent('response.output_tool_call.done', {
-                        type: 'response.output_tool_call.done',
-                        output_index: index,
-                        tool_call: {
-                            id: tool.id,
-                            name: tool.name,
-                            arguments: tool.arguments,
-                        },
-                    });
-                    this.toolCalls.delete(index);
+        if (type === 'content_block_delta' && (data === null || data === void 0 ? void 0 : data.delta)) {
+            if (data.delta.type === 'text_delta') {
+                const text = data.delta.text || '';
+                if (text) {
+                    this.push({ event: null, data: { id: '', model: this.model, choices: [{ index: 0, delta: { content: text } }] } });
                 }
             }
+            else if (data.delta.type === 'input_json_delta') {
+                this.pendingToolArgs += data.delta.partial_json || '';
+            }
             callback();
             return;
         }
-        if (eventType === 'message_delta') {
-            if ((_g = event.data) === null || _g === void 0 ? void 0 : _g.usage) {
-                this.usage = {
-                    input_tokens: (_h = event.data.usage.input_tokens) !== null && _h !== void 0 ? _h : 0,
-                    output_tokens: (_j = event.data.usage.output_tokens) !== null && _j !== void 0 ? _j : 0,
-                    cache_read_input_tokens: (_k = event.data.usage.cache_read_input_tokens) !== null && _k !== void 0 ? _k : 0,
+        if (type === 'content_block_stop') {
+            if (this.pendingToolCallId && this.pendingToolName !== null) {
+                const toolCall = {
+                    index: this.toolCallIndex,
+                    id: this.pendingToolCallId,
+                    type: 'function',
+                    function: {
+                        name: this.pendingToolName,
+                        arguments: this.pendingToolArgs,
+                    },
                 };
+                this.push({ event: null, data: { id: '', model: this.model, choices: [{ index: 0, delta: { tool_calls: [toolCall] } }] } });
+                this.toolCallIndex++;
+                this.pendingToolCallId = null;
+                this.pendingToolName = null;
+                this.pendingToolArgs = '';
             }
             callback();
             return;
         }
-        if (eventType === 'message_stop') {
-            this.pushCompletedResponse();
+        if (type === 'message_stop' || (data === null || data === void 0 ? void 0 : data.type) === 'message_stop') {
+            this.finished = true;
+            this.push({ event: null, data: { id: '', model: this.model, choices: [{ index: 0, delta: {}, finish_reason: 'stop' }] } });
+            this.push({ event: 'done', data: { type: 'done' } });
             callback();
             return;
         }
+        if (data === null || data === void 0 ? void 0 : data.usage) {
+            this.usage = {
+                prompt_tokens: data.usage.input_tokens || 0,
+                completion_tokens: data.usage.output_tokens || 0,
+                total_tokens: (data.usage.input_tokens || 0) + (data.usage.output_tokens || 0),
+            };
+        }
         callback();
     }
-    ensureResponseCreated() {
-        if (this.hasCreated)
-            return;
-        const response = {
-            id: this.responseId || `resp_${crypto_1.default.randomUUID()}`,
-            object: 'response',
-            model: this.model || 'unknown',
-            output: [],
-            created_at: this.createdAt,
-        };
-        this.pushEvent('response.created', { type: 'response.created', response });
-        this.hasCreated = true;
-    }
-    pushEvent(event, data) {
-        this.push({ event, data });
-    }
-    pushCompletedResponse() {
-        var _a, _b, _c, _d, _e, _f;
-        this.ensureResponseCreated();
-        const output = [];
-        if (this.outputText) {
-            output.push({
-                type: 'message',
-                role: 'assistant',
-                content: [{ type: 'output_text', text: this.outputText }],
-            });
-        }
-        for (const tool of this.completedToolCalls) {
-            output.push({
-                type: 'tool_call',
-                id: tool.id,
-                name: tool.name,
-                arguments: tool.arguments,
-            });
+    _flush(callback) {
+        if (!this.finished) {
+            this.finished = true;
+            this.push({ event: null, data: { id: '', model: this.model, choices: [{ index: 0, delta: {}, finish_reason: 'stop' }] } });
+            this.push({ event: 'done', data: { type: 'done' } });
         }
-        const inputTokens = (_b = (_a = this.usage) === null || _a === void 0 ? void 0 : _a.input_tokens) !== null && _b !== void 0 ? _b : 0;
-        const cacheRead = (_d = (_c = this.usage) === null || _c === void 0 ? void 0 : _c.cache_read_input_tokens) !== null && _d !== void 0 ? _d : 0;
-        const outputTokens = (_f = (_e = this.usage) === null || _e === void 0 ? void 0 : _e.output_tokens) !== null && _f !== void 0 ? _f : 0;
-        const response = {
-            id: this.responseId || `resp_${crypto_1.default.randomUUID()}`,
-            object: 'response',
-            model: this.model || 'unknown',
-            output,
-            output_text: this.outputText,
-            status: 'completed',
-            created_at: this.createdAt,
-            usage: {
-                input_tokens: inputTokens + cacheRead,
-                output_tokens: outputTokens,
-                total_tokens: inputTokens + cacheRead + outputTokens,
-            },
-        };
-        this.pushEvent('response.completed', { type: 'response.completed', response });
+        callback();
     }
 }
-exports.ClaudeToOpenAIResponsesEventTransform = ClaudeToOpenAIResponsesEventTransform;
+exports.ClaudeToOpenAIChatEventTransform = ClaudeToOpenAIChatEventTransform;

package/dist/ui/assets/{index-dcQX0zYo.css → index-Bfc2kKan.css}

@@ -1 +1 @@
-.app{display:flex;width:100%;height:100%}.sidebar{width:260px;background:var(--bg-sidebar);color:var(--text-primary);display:flex;flex-direction:column;padding:0 0 80px;border-radius:20px;box-shadow:0 8px 32px var(--shadow-primary),0 0 20px #0478574d;margin:16px;position:relative;z-index:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.logo{padding:28px 20px;border-bottom:2px solid rgba(255,255,255,.2);text-align:center;position:relative;overflow:hidden}.logo:before{content:"✨";position:absolute;top:12px;left:12px;font-size:16px;opacity:.7;transition:all .3s ease}.logo:after{content:"🌟";position:absolute;top:12px;right:12px;font-size:16px;opacity:.7;transition:all .3s ease}.logo:hover:before,.logo:focus:before{animation:sparkle 3s ease-in-out infinite}.logo:hover:after,.logo:focus:after{animation:sparkle 3s ease-in-out infinite 1.5s}@keyframes sparkle{0%,to{transform:scale(1) rotate(0);opacity:.7}50%{transform:scale(1.2) rotate(180deg);opacity:1}}.logo h2{font-size:22px;font-weight:800;background:linear-gradient(135deg,#fff,#f8f8ff,#e6e6fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 2px 4px rgba(0,0,0,.1),0 0 20px rgba(4,120,87,.3);position:relative;z-index:1;letter-spacing:1px;text-transform:uppercase;transition:all .3s ease}.logo:hover h2,.logo:focus h2{animation:logoGlow 4s ease-in-out infinite}@keyframes logoGlow{0%,to{text-shadow:0 2px 4px rgba(0,0,0,.1),0 0 20px rgba(4,120,87,.3)}50%{text-shadow:0 2px 4px rgba(0,0,0,.1),0 0 30px rgba(4,120,87,.5),0 0 40px rgba(4,120,87,.3)}}.nav-menu{list-style:none;padding:16px 0;margin:0}.nav-menu li{margin:8px 12px}.nav-menu a{display:block;padding:14px 20px;color:var(--text-sidebar);text-decoration:none;border-radius:12px;transition:all .3s ease-out;font-weight:500;position:relative;overflow:hidden}.nav-menu a:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);transition:left .5s ease-out}.nav-menu a:hover:before{left:100%}.nav-menu a:hover{background-color:#ffffff1a;transform:translate(4px);box-shadow:0 4px 12px #0f172a33}.nav-menu a.active{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));box-shadow:0 4px 16px var(--shadow-primary)}.main-content{flex:1;padding:24px;overflow-y:auto;background:var(--bg-primary);position:relative;z-index:1;margin:16px 16px 16px 0;border-radius:20px}.main-content:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 80%,rgba(255,206,92,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(134,204,202,.1) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(255,113,206,.05) 0%,transparent 50%);pointer-events:none}.page-header{margin-bottom:24px;position:relative;z-index:1}.page-header h1{font-family:Fredoka,sans-serif;font-size:28px;font-weight:700;color:var(--accent-primary);margin-bottom:8px;text-shadow:0 2px 4px var(--shadow-primary)}.page-header p{color:var(--text-muted);font-size:16px;font-weight:400}.card{background:var(--bg-card);border-radius:20px;padding:24px;box-shadow:0 8px 32px var(--shadow-secondary),0 0 16px #0478571a;margin-bottom:24px;border:1px solid var(--border-primary);position:relative;overflow:hidden;transition:all .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary),var(--accent-primary));border-radius:20px 20px 0 0;background-size:200% 100%;transition:all .3s ease}.card:hover:before{animation:gradientShift 3s ease-in-out infinite}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.card:hover{transform:translateY(-2px);box-shadow:0 12px 40px #6a7bb433,0 8px 24px #ff71ce26}.btn{padding:10px 20px;border:none;border-radius:12px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease-out;position:relative;overflow:hidden;box-shadow:0 2px 8px #0000001a;white-space:nowrap}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#ffffff4d;border-radius:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s}.btn:hover:before{width:300px;height:300px}.btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px #00000026}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;position:relative;overflow:hidden}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.btn-primary:hover:before{left:100%}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px #04785766}.btn-danger{background:var(--accent-danger);color:#fff}.btn-danger:hover{background:#ea580c}.btn-success{background:var(--accent-success);color:#fff}.btn-success:hover{background:#059669}.btn-secondary{background:var(--accent-secondary);color:#fff}.btn-secondary:hover{background:var(--accent-primary)}.btn-sm{padding:4px 8px}table{width:100%;border-collapse:collapse;margin-top:16px;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px #6a7bb41a}table th,table td{padding:16px;text-align:left;border-bottom:1px solid var(--border-secondary);color:var(--text-primary)}table th{background:var(--bg-table-header);font-weight:700;color:var(--text-secondary);font-family:Fredoka,sans-serif;font-size:14px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:var(--text-primary);font-size:14px;font-weight:600;font-family:Nunito,sans-serif}.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 16px;border:2px solid var(--border-primary);border-radius:12px;font-size:14px;font-family:Nunito,sans-serif;background:var(--bg-secondary);color:var(--text-primary);transition:all .3s ease-out}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--shadow-secondary);background:var(--bg-secondary)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:modalFadeIn .3s ease-out}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--bg-secondary);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;min-width:500px;max-width:90%;max-height:90%;overflow-y:auto;box-shadow:0 20px 60px var(--shadow-primary),0 8px 32px var(--shadow-secondary);border:1px solid var(--border-secondary);animation:modalSlideIn .4s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h2{font-size:20px;color:var(--text-primary)}.modal-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.action-buttons{display:flex;gap:8px}.badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 8px #0000001a;margin-top:-40px;margin-right:-24px}.badge-success{background:var(--accent-success);color:#fff}.badge-warning{background:var(--accent-warning);color:#fff}.badge-danger{background:var(--accent-danger);color:#fff}.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted);font-family:Nunito,sans-serif}.empty-state p{margin-bottom:20px;font-size:16px;font-weight:500}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.theme-toggle{position:absolute;bottom:20px;left:20px;right:20px;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px;background:#ffffff14;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);transition:all .3s ease-out}.theme-toggle:hover{background:#ffffff1f}.theme-toggle button{background:none;border:none;color:var(--text-sidebar);cursor:pointer;padding:8px;border-radius:8px;transition:all .3s ease-out;display:flex;align-items:center;justify-content:center}.theme-toggle button:hover{background:#ffffff26}.theme-toggle button.active{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;box-shadow:0 2px 8px var(--shadow-primary),0 0 8px #04785780;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.update-notification{position:absolute;bottom:80px;left:20px;right:20px;background:linear-gradient(135deg,#10b98126,#05966926);border:1px solid rgba(16,185,129,.4);border-radius:12px;padding:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideUp .3s ease-out;box-shadow:0 4px 12px #10b98133;margin-bottom:12px}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.update-notification-content{display:flex;align-items:center;gap:10px;margin-bottom:8px}.update-icon{font-size:18px;animation:bounce 1s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.update-text{flex:1}.update-title{font-size:13px;font-weight:600;color:var(--text-sidebar);margin-bottom:2px}.update-versions{font-size:11px;color:#ffffffb3;font-family:Monaco,Menlo,monospace}.update-message{font-size:10px;color:var(--text-sidebar);margin-bottom:2px}.update-message code{background:#ffffff1a;padding:2px 4px;border-radius:4px;font-family:Monaco,Menlo,monospace;margin-top:2px;display:inline-block}.update-link{display:block;text-align:center;padding:6px 12px;background:linear-gradient(135deg,var(--accent-success),#059669);color:#fff;text-decoration:none;border-radius:8px;font-size:12px;font-weight:600;transition:all .3s ease-out}.update-link:hover{transform:translateY(-1px);box-shadow:0 4px 12px #10b98166}@media (prefers-reduced-motion: reduce){.nav-menu a,.card,.btn,.form-group input,.form-group select,.form-group textarea,.modal-overlay,.modal,table tr{transition:none;animation:none}.nav-menu a:hover,.card:hover,.btn:hover,table tr:hover{transform:none}.btn:before{display:none}}.markdown-content{line-height:1.7;color:var(--text-primary);max-width:100%;overflow-x:auto}.markdown-content h1{font-size:2em;font-weight:700;margin-top:0;margin-bottom:.8em;color:var(--text-primary);border-bottom:2px solid var(--border-color);padding-bottom:.3em}.markdown-content h2{font-size:1.6em;font-weight:600;margin-top:1.5em;margin-bottom:.6em;color:var(--text-primary);border-bottom:1px solid var(--border-color);padding-bottom:.25em}.markdown-content h3{font-size:1.3em;font-weight:600;margin-top:1.2em;margin-bottom:.5em;color:var(--text-primary)}.markdown-content h4{font-size:1.1em;font-weight:600;margin-top:1em;margin-bottom:.4em;color:var(--text-primary)}.markdown-content p{margin-bottom:1em;line-height:1.8}.markdown-content ul,.markdown-content ol{margin-bottom:1em;padding-left:2em}.markdown-content li{margin-bottom:.5em;line-height:1.7}.markdown-content code{background:var(--bg-secondary);padding:.2em .4em;border-radius:4px;font-size:.9em;font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace;color:var(--accent-secondary);border:1px solid var(--border-color)}.markdown-content pre{background:var(--bg-secondary);padding:1em;border-radius:8px;overflow-x:auto;margin-bottom:1em;border:1px solid var(--border-color)}.markdown-content pre code{background:none;padding:0;border:none;color:var(--text-primary);font-size:.95em}.markdown-content blockquote{border-left:4px solid var(--accent-primary);padding-left:1em;margin-left:0;margin-bottom:1em;color:var(--text-secondary);font-style:italic}.markdown-content a{color:var(--accent-primary);text-decoration:none;border-bottom:1px solid transparent;transition:all .2s ease}.markdown-content a:hover{color:var(--accent-secondary);border-bottom-color:var(--accent-secondary)}.markdown-content table{width:100%;border-collapse:collapse;margin-bottom:1em}.markdown-content table th,.markdown-content table td{padding:.75em;text-align:left;border:1px solid var(--border-color)}.markdown-content table th{background:var(--bg-secondary);font-weight:600}.markdown-content hr{border:none;border-top:2px solid var(--border-color);margin:2em 0}.markdown-content strong{font-weight:600;color:var(--text-primary)}.markdown-content em{font-style:italic}.markdown-content img{max-width:100%;height:auto;border-radius:8px;margin:1em 0}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: linear-gradient(135deg, #F7FEE7 0%, #F0FDF4 100%);--bg-secondary: rgba(255, 255, 255, .95);--bg-sidebar: linear-gradient(135deg, #0F5132 0%, #065F46 100%);--bg-card: rgba(255, 255, 255, .98);--bg-code: #f4fff7;--bg-table-header: linear-gradient(135deg, #A7F3D0 0%, #6EE7B7 100%);--text-primary: #14532D;--text-secondary: #064E3B;--text-muted: #065F46;--text-sidebar: #FFFFFF;--text-on-dark: #FFFFFF;--border-primary: rgba(15, 81, 50, .2);--border-secondary: rgba(6, 95, 70, .2);--accent-primary: #0F5132;--accent-secondary: #047857;--accent-light: #a1e9c7;--accent-success: #047857;--accent-warning: #D97706;--accent-danger: #DC2626;--shadow-primary: rgba(15, 81, 50, .3);--shadow-secondary: rgba(15, 81, 50, .15);--bg-route-item: rgba(248, 249, 250, .9);--bg-route-item-hover: rgba(230, 244, 234, .95);--bg-route-item-selected: rgba(161, 233, 199, .25);--text-route-muted: #6c757d;--text-info: #2faeee}[data-theme=dark]{--bg-primary: linear-gradient(135deg, #0A1A0F 0%, #0F2415 100%);--bg-secondary: rgba(15, 36, 21, .9);--bg-sidebar: linear-gradient(135deg, #0F5132 0%, #065F46 100%);--bg-card: rgba(25, 51, 31, .95);--bg-code: #0f172a;--bg-table-header: linear-gradient(135deg, #0F5132 0%, #047857 100%);--text-primary: #ECFEF5;--text-secondary: #A7F3D0;--text-muted: #6EE7B7;--text-sidebar: #FFFFFF;--text-on-dark: #ECFEF5;--border-primary: rgba(15, 81, 50, .5);--border-secondary: rgba(6, 95, 70, .5);--accent-primary: #0F5132;--accent-secondary: #047857;--accent-light: #002d18;--accent-success: #10B981;--accent-warning: #F59E0B;--accent-danger: #EF4444;--shadow-primary: rgba(15, 81, 50, .4);--shadow-secondary: rgba(6, 95, 70, .3);--bg-route-item: rgba(20, 46, 28, .7);--bg-route-item-hover: rgba(30, 60, 38, .85);--bg-route-item-selected: rgba(16, 185, 129, .15);--text-route-muted: #A7F3D0}body{font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-primary);color:var(--text-primary);transition:all .3s ease;min-height:100vh}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{width:100vw;height:100vh;overflow:hidden}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:8px}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));border-radius:8px;border:2px solid var(--bg-secondary);box-shadow:0 2px 4px #0000001a;transition:all .3s ease}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--accent-secondary),var(--accent-primary));box-shadow:0 4px 8px #0003;transform:scale(1.1)}::-webkit-scrollbar-thumb:active{background:var(--accent-primary);box-shadow:0 6px 12px #0000004d}::-webkit-scrollbar-corner{background:var(--bg-secondary)}*{scrollbar-width:thin;scrollbar-color:var(--accent-primary) var(--bg-secondary)}::-webkit-scrollbar-button{display:none}html{scroll-behavior:smooth}
+.app{display:flex;width:100%;height:100%}.sidebar{width:260px;background:var(--bg-sidebar);color:var(--text-primary);display:flex;flex-direction:column;padding:0 0 80px;border-radius:20px;box-shadow:0 8px 32px var(--shadow-primary),0 0 20px #0478574d;margin:16px;position:relative;z-index:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.logo{padding:28px 20px;border-bottom:2px solid rgba(255,255,255,.2);text-align:center;position:relative;overflow:hidden}.logo:before{content:"✨";position:absolute;top:12px;left:12px;font-size:16px;opacity:.7;transition:all .3s ease}.logo:after{content:"🌟";position:absolute;top:12px;right:12px;font-size:16px;opacity:.7;transition:all .3s ease}.logo:hover:before,.logo:focus:before{animation:sparkle 3s ease-in-out infinite}.logo:hover:after,.logo:focus:after{animation:sparkle 3s ease-in-out infinite 1.5s}@keyframes sparkle{0%,to{transform:scale(1) rotate(0);opacity:.7}50%{transform:scale(1.2) rotate(180deg);opacity:1}}.logo h2{font-size:22px;font-weight:800;background:linear-gradient(135deg,#fff,#f8f8ff,#e6e6fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 2px 4px rgba(0,0,0,.1),0 0 20px rgba(4,120,87,.3);position:relative;z-index:1;letter-spacing:1px;text-transform:uppercase;transition:all .3s ease}.logo:hover h2,.logo:focus h2{animation:logoGlow 4s ease-in-out infinite}@keyframes logoGlow{0%,to{text-shadow:0 2px 4px rgba(0,0,0,.1),0 0 20px rgba(4,120,87,.3)}50%{text-shadow:0 2px 4px rgba(0,0,0,.1),0 0 30px rgba(4,120,87,.5),0 0 40px rgba(4,120,87,.3)}}.nav-menu{list-style:none;padding:16px 0;margin:0}.nav-menu li{margin:8px 12px}.nav-menu a{display:block;padding:14px 20px;color:var(--text-sidebar);text-decoration:none;border-radius:12px;transition:all .3s ease-out;font-weight:500;position:relative;overflow:hidden}.nav-menu a:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);transition:left .5s ease-out}.nav-menu a:hover:before{left:100%}.nav-menu a:hover{background-color:#ffffff1a;transform:translate(4px);box-shadow:0 4px 12px #0f172a33}.nav-menu a.active{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));box-shadow:0 4px 16px var(--shadow-primary)}.main-content{flex:1;padding:24px;overflow-y:auto;background:var(--bg-primary);position:relative;z-index:1;margin:16px 16px 16px 0;border-radius:20px}.main-content:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 80%,rgba(255,206,92,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(134,204,202,.1) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(255,113,206,.05) 0%,transparent 50%);pointer-events:none}.page-header{margin-bottom:24px;position:relative;z-index:1}.page-header h1{font-family:Fredoka,sans-serif;font-size:28px;font-weight:700;color:var(--accent-primary);margin-bottom:8px;text-shadow:0 2px 4px var(--shadow-primary)}.page-header p{color:var(--text-muted);font-size:16px;font-weight:400}.card{background:var(--bg-card);border-radius:20px;padding:24px;box-shadow:0 8px 32px var(--shadow-secondary),0 0 16px #0478571a;margin-bottom:24px;border:1px solid var(--border-primary);position:relative;overflow:hidden;transition:all .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary),var(--accent-primary));border-radius:20px 20px 0 0;background-size:200% 100%;transition:all .3s ease}.card:hover:before{animation:gradientShift 3s ease-in-out infinite}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.card:hover{transform:translateY(-2px);box-shadow:0 12px 40px #6a7bb433,0 8px 24px #ff71ce26}.btn{padding:10px 20px;border:none;border-radius:12px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease-out;position:relative;overflow:hidden;box-shadow:0 2px 8px #0000001a;white-space:nowrap}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#ffffff4d;border-radius:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s}.btn:hover:before{width:300px;height:300px}.btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px #00000026}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;position:relative;overflow:hidden}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.btn-primary:hover:before{left:100%}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px #04785766}.btn-danger{background:var(--accent-danger);color:#fff}.btn-danger:hover{background:#ea580c}.btn-success{background:var(--accent-success);color:#fff}.btn-success:hover{background:#059669}.btn-secondary{background:var(--accent-secondary);color:#fff}.btn-secondary:hover{background:var(--accent-primary)}.btn-sm{padding:4px 8px}table{width:100%;border-collapse:collapse;margin-top:16px;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px #6a7bb41a}table th,table td{padding:16px;text-align:left;border-bottom:1px solid var(--border-secondary);color:var(--text-primary)}table th{background:var(--bg-table-header);font-weight:700;color:var(--text-secondary);font-family:Fredoka,sans-serif;font-size:14px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:var(--text-primary);font-size:14px;font-weight:600;font-family:Nunito,sans-serif}.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 16px;border:2px solid var(--border-primary);border-radius:12px;font-size:14px;font-family:Nunito,sans-serif;background:var(--bg-secondary);color:var(--text-primary);transition:all .3s ease-out}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--shadow-secondary);background:var(--bg-secondary)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:modalFadeIn .3s ease-out}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--bg-secondary);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;min-width:500px;max-width:90%;max-height:90%;overflow-y:auto;box-shadow:0 20px 60px var(--shadow-primary),0 8px 32px var(--shadow-secondary);border:1px solid var(--border-secondary);animation:modalSlideIn .4s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h2{font-size:20px;color:var(--text-primary)}.modal-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.action-buttons{display:flex;gap:8px}.badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 8px #0000001a;margin-top:-40px;margin-right:-24px}.badge-success{background:var(--accent-success);color:#fff}.badge-warning{background:var(--accent-warning);color:#fff}.badge-danger{background:var(--accent-danger);color:#fff}.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted);font-family:Nunito,sans-serif}.empty-state p{margin-bottom:20px;font-size:16px;font-weight:500}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.theme-toggle{position:absolute;bottom:20px;left:20px;right:20px;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px;background:#ffffff14;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);transition:all .3s ease-out}.theme-toggle:hover{background:#ffffff1f}.theme-toggle button{background:none;border:none;color:var(--text-sidebar);cursor:pointer;padding:8px;border-radius:8px;transition:all .3s ease-out;display:flex;align-items:center;justify-content:center}.theme-toggle button:hover{background:#ffffff26}.theme-toggle button.active{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;box-shadow:0 2px 8px var(--shadow-primary),0 0 8px #04785780;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.update-notification{position:absolute;bottom:80px;left:20px;right:20px;background:linear-gradient(135deg,#10b98126,#05966926);border:1px solid rgba(16,185,129,.4);border-radius:12px;padding:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideUp .3s ease-out;box-shadow:0 4px 12px #10b98133;margin-bottom:12px}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.update-notification-content{display:flex;align-items:center;gap:10px;margin-bottom:8px}.update-icon{font-size:18px;animation:bounce 1s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.update-text{flex:1}.update-title{font-size:13px;font-weight:600;color:var(--text-sidebar);margin-bottom:2px}.update-versions{font-size:11px;color:#ffffffb3;font-family:Monaco,Menlo,monospace}.update-message{font-size:10px;color:var(--text-sidebar);margin-bottom:2px}.update-message code{background:#ffffff1a;padding:2px 4px;border-radius:4px;font-family:Monaco,Menlo,monospace;margin-top:2px;display:inline-block}.update-link{display:block;text-align:center;padding:6px 12px;background:linear-gradient(135deg,var(--accent-success),#059669);color:#fff;text-decoration:none;border-radius:8px;font-size:12px;font-weight:600;transition:all .3s ease-out}.update-link:hover{transform:translateY(-1px);box-shadow:0 4px 12px #10b98166}@media (prefers-reduced-motion: reduce){.nav-menu a,.card,.btn,.form-group input,.form-group select,.form-group textarea,.modal-overlay,.modal,table tr{transition:none;animation:none}.nav-menu a:hover,.card:hover,.btn:hover,table tr:hover{transform:none}.btn:before{display:none}}.markdown-content{line-height:1.7;color:var(--text-primary);max-width:100%;overflow-x:auto}.markdown-content h1{font-size:2em;font-weight:700;margin-top:0;margin-bottom:.8em;color:var(--text-primary);border-bottom:2px solid var(--border-color);padding-bottom:.3em}.markdown-content h2{font-size:1.6em;font-weight:600;margin-top:1.5em;margin-bottom:.6em;color:var(--text-primary);border-bottom:1px solid var(--border-color);padding-bottom:.25em}.markdown-content h3{font-size:1.3em;font-weight:600;margin-top:1.2em;margin-bottom:.5em;color:var(--text-primary)}.markdown-content h4{font-size:1.1em;font-weight:600;margin-top:1em;margin-bottom:.4em;color:var(--text-primary)}.markdown-content p{margin-bottom:1em;line-height:1.8}.markdown-content ul,.markdown-content ol{margin-bottom:1em;padding-left:2em}.markdown-content li{margin-bottom:.5em;line-height:1.7}.markdown-content code{background:var(--bg-secondary);padding:.2em .4em;border-radius:4px;font-size:.9em;font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace;color:var(--accent-secondary);border:1px solid var(--border-color)}.markdown-content pre{background:var(--bg-secondary);padding:1em;border-radius:8px;overflow-x:auto;margin-bottom:1em;border:1px solid var(--border-color)}.markdown-content pre code{background:none;padding:0;border:none;color:var(--text-primary);font-size:.95em}.markdown-content blockquote{border-left:4px solid var(--accent-primary);padding-left:1em;margin-left:0;margin-bottom:1em;color:var(--text-secondary);font-style:italic}.markdown-content a{color:var(--accent-primary);text-decoration:none;border-bottom:1px solid var(--accent-secondary);transition:all .2s ease}.markdown-content a:hover{color:var(--accent-secondary)}.markdown-content table{width:100%;border-collapse:collapse;margin-bottom:1em}.markdown-content table th,.markdown-content table td{padding:.75em;text-align:left;border:1px solid var(--border-color)}.markdown-content table th{background:var(--bg-secondary);font-weight:600}.markdown-content hr{border:none;border-top:2px solid var(--border-color);margin:2em 0}.markdown-content strong{font-weight:600;color:var(--text-primary)}.markdown-content em{font-style:italic}.markdown-content img{max-width:100%;height:auto;border-radius:8px;margin:1em 0}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: linear-gradient(135deg, #F7FEE7 0%, #F0FDF4 100%);--bg-secondary: rgba(255, 255, 255, .95);--bg-sidebar: linear-gradient(135deg, #0F5132 0%, #065F46 100%);--bg-card: rgba(255, 255, 255, .98);--bg-code: #f4fff7;--bg-table-header: linear-gradient(135deg, #A7F3D0 0%, #6EE7B7 100%);--text-primary: #14532D;--text-secondary: #064E3B;--text-muted: #065F46;--text-sidebar: #FFFFFF;--text-on-dark: #FFFFFF;--border-primary: rgba(15, 81, 50, .2);--border-secondary: rgba(6, 95, 70, .2);--accent-primary: #0F5132;--accent-secondary: #047857;--accent-light: #a1e9c7;--accent-success: #047857;--accent-warning: #D97706;--accent-danger: #DC2626;--shadow-primary: rgba(15, 81, 50, .3);--shadow-secondary: rgba(15, 81, 50, .15);--bg-route-item: rgba(248, 249, 250, .9);--bg-route-item-hover: rgba(230, 244, 234, .95);--bg-route-item-selected: rgba(161, 233, 199, .25);--text-route-muted: #6c757d;--text-info: #2faeee}[data-theme=dark]{--bg-primary: linear-gradient(135deg, #0A1A0F 0%, #0F2415 100%);--bg-secondary: rgba(15, 36, 21, .9);--bg-sidebar: linear-gradient(135deg, #0F5132 0%, #065F46 100%);--bg-card: rgba(25, 51, 31, .95);--bg-code: #0f172a;--bg-table-header: linear-gradient(135deg, #0F5132 0%, #047857 100%);--text-primary: #ECFEF5;--text-secondary: #A7F3D0;--text-muted: #6EE7B7;--text-sidebar: #FFFFFF;--text-on-dark: #ECFEF5;--border-primary: rgba(15, 81, 50, .5);--border-secondary: rgba(6, 95, 70, .5);--accent-primary: #0F5132;--accent-secondary: #047857;--accent-light: #002d18;--accent-success: #10B981;--accent-warning: #F59E0B;--accent-danger: #EF4444;--shadow-primary: rgba(15, 81, 50, .4);--shadow-secondary: rgba(6, 95, 70, .3);--bg-route-item: rgba(20, 46, 28, .7);--bg-route-item-hover: rgba(30, 60, 38, .85);--bg-route-item-selected: rgba(16, 185, 129, .15);--text-route-muted: #A7F3D0}body{font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-primary);color:var(--text-primary);transition:all .3s ease;min-height:100vh}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{width:100vw;height:100vh;overflow:hidden}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:8px}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));border-radius:8px;border:2px solid var(--bg-secondary);box-shadow:0 2px 4px #0000001a;transition:all .3s ease}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--accent-secondary),var(--accent-primary));box-shadow:0 4px 8px #0003;transform:scale(1.1)}::-webkit-scrollbar-thumb:active{background:var(--accent-primary);box-shadow:0 6px 12px #0000004d}::-webkit-scrollbar-corner{background:var(--bg-secondary)}*{scrollbar-width:thin;scrollbar-color:var(--accent-primary) var(--bg-secondary)}::-webkit-scrollbar-button{display:none}html{scroll-behavior:smooth}