:root {--primary-brand: #3d3dff;--primary-brand-hover: #5a5aff;--primary-brand-active: #2626cc;--secondary-brand: #6a11cb;--accent-brand: #2575fc;--color-success: #22c55e;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--bg-primary: #ffffff;--bg-secondary: #f8fafc;--bg-tertiary: #f1f5f9;--text-primary: #1e293b;--text-secondary: #64748b;--text-muted: #94a3b8;--border-subtle: #e2e8f0;--border-strong: #cbd5e1;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--bg: var(--bg-primary);--text: var(--text-primary);--header-footer: var(--bg-secondary);--chat-bg: var(--bg-tertiary);--user-msg: var(--primary-brand);--assistant-msg: var(--bg-primary);--input-bg: var(--bg-primary);--button-bg: var(--primary-brand);--button-hover: var(--primary-brand-hover);--menu-bg: var(--bg-primary);--menu-text: var(--text-primary);--menu-border: var(--border-subtle);--popup-bg: var(--bg-primary);--popup-text: var(--text-primary);--popup-border: var(--border-subtle);--popup-titlebar-bg: #e3e6f6;--popup-titlebar-text: #222b4a;--footer-height: 56px;--header-height: 64px;--border-radius-sm: 8px;--border-radius-md: 12px;--border-radius-lg: 16px;--border-radius-xl: 24px;--bg-gradient-color1: var(--secondary-brand);--bg-gradient-color2: var(--accent-brand);--bg-gradient-angle: 120deg;--font-size-xs: 0.75rem;--font-size-sm: 0.875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--space-1: 0.25rem;--space-2: 0.5rem;--space-3: 0.75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem;--space-16: 4rem;--easing-smooth: cubic-bezier(0.4, 0, 0.2, 1);--easing-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);--easing-sharp: cubic-bezier(0.4, 0, 0.6, 1);--duration-fast: 150ms;--duration-normal: 250ms;--duration-slow: 350ms;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;}.dark {--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-tertiary: #334155;--text-primary: #f8fafc;--text-secondary: #cbd5e1;--text-muted: #94a3b8;--border-subtle: #334155;--border-strong: #475569;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.3);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.4), 0 2px 4px -2px rgb(0 0 0 / 0.4);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.4), 0 4px 6px -4px rgb(0 0 0 / 0.4);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.5);--bg: var(--bg-primary);--text: var(--text-primary);--header-footer: var(--bg-secondary);--chat-bg: var(--bg-secondary);--user-msg: var(--primary-brand);--assistant-msg: var(--bg-tertiary);--input-bg: var(--bg-tertiary);--menu-bg: var(--bg-secondary);--menu-text: var(--text-primary);--menu-border: var(--border-subtle);--popup-bg: var(--bg-secondary);--popup-text: var(--text-primary);--popup-border: var(--border-subtle);--popup-titlebar-bg: #23263a;--popup-titlebar-text: #e3e6f6;--bg-gradient-color1: #18192b;--bg-gradient-color2: #10101a;}@media (prefers-reduced-motion: reduce) {*, *::before, *::after {animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;transition-duration: 0.01ms !important;scroll-behavior: auto !important;}.bg-move, .fade-in, .slide-in {animation: none !important;}}@media (prefers-contrast: high) {:root {--border-subtle: #000000;--border-strong: #000000;--text-secondary: var(--text-primary);}.dark {--border-subtle: #ffffff;--border-strong: #ffffff;--text-secondary: var(--text-primary);}}.sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);white-space: nowrap;border: 0;}.skip-nav {position: absolute;top: -40px;left: var(--space-4);background: var(--primary-brand);color: white;padding: var(--space-2) var(--space-4);text-decoration: none;border-radius: var(--border-radius-sm);font-weight: 600;z-index: var(--z-tooltip);transition: top var(--duration-fast) var(--easing-smooth);}.skip-nav:focus {top: var(--space-4);}*, *::before, *::after {box-sizing: border-box;}html {font-size: 16px;scroll-behavior: smooth;text-size-adjust: 100%;-webkit-text-size-adjust: 100%;-moz-text-size-adjust: 100%;tab-size: 4;-webkit-tap-highlight-color: transparent;}html, body {margin: 0;padding: 0;height: 100%;min-height: 100vh;font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;font-size: var(--font-size-base);line-height: 1.5;color: var(--text-primary);background-color: var(--bg-primary);display: flex;flex-direction: column;touch-action: manipulation;text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}body {background: linear-gradient( var(--bg-gradient-angle, 120deg), var(--bg-gradient-color1, #6a11cb) 0%, var(--bg-gradient-color2, #2575fc) 100% );background-size: 200% 200%;background-attachment: fixed;animation: bg-move 12s ease-in-out infinite alternate;transition: background var(--duration-slow) var(--easing-smooth);will-change: background-position;}body.dark {--bg-gradient-color1: #18192b;--bg-gradient-color2: #10101a;}@keyframes bg-move {0% {background-position: 0% 50%;}100% {background-position: 100% 50%;}}:focus {outline: 2px solid var(--primary-brand);outline-offset: 2px;}:focus:not(:focus-visible) {outline: none;}:focus-visible {outline: 2px solid var(--primary-brand);outline-offset: 2px;}::-webkit-scrollbar {width: 8px;height: 8px;}::-webkit-scrollbar-track {background: transparent;border-radius: var(--border-radius-sm);}::-webkit-scrollbar-thumb {background: var(--border-strong);border-radius: var(--border-radius-sm);transition: background var(--duration-fast) var(--easing-smooth);}::-webkit-scrollbar-thumb:hover {background: var(--text-secondary);}.scroll-container::-webkit-scrollbar-track {background: transparent;}.scroll-container::-webkit-scrollbar-thumb {background-color: var(--text-muted);border-radius: var(--border-radius-sm);}.header {position: fixed;top: 0;left: 0;right: 0;width: 100%;height: var(--header-height);background: var(--header-footer);backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);border-bottom: 1px solid var(--border-subtle);box-shadow: var(--shadow-sm);padding: var(--space-2) var(--space-4);display: flex;align-items: center;justify-content: space-between;z-index: var(--z-fixed);transition: all var(--duration-normal) var(--easing-smooth);will-change: transform, background-color;padding-top: env(safe-area-inset-top);}.header h1, .app-title {margin: 0;font-size: var(--font-size-xl);font-weight: 700;color: var(--text-primary);letter-spacing: -0.025em;flex: 1;text-align: center;}.hamburger-button {display: flex;flex-direction: column;justify-content: center;width: 40px;height: 40px;background: none;border: none;cursor: pointer;padding: var(--space-2);border-radius: var(--border-radius-sm);transition: all var(--duration-fast) var(--easing-smooth);position: relative;}.hamburger-button:hover {background: var(--bg-tertiary);}.hamburger-button:focus-visible {background: var(--bg-tertiary);}.hamburger-bar {width: 20px;height: 2px;background: var(--text-primary);margin: 2px 0;transition: all var(--duration-normal) var(--easing-smooth);border-radius: 1px;}.hamburger-button[aria-expanded="true"] .hamburger-bar:nth-child(1) {transform: rotate(45deg) translate(4.5px, 4.5px);}.hamburger-button[aria-expanded="true"] .hamburger-bar:nth-child(2) {opacity: 0;}.hamburger-button[aria-expanded="true"] .hamburger-bar:nth-child(3) {transform: rotate(-45deg) translate(4.5px, -4.5px);}.connection-status {display: flex;align-items: center;gap: var(--space-2);padding: var(--space-1) var(--space-2);border-radius: var(--border-radius-sm);background: var(--bg-tertiary);font-size: var(--font-size-sm);font-weight: 500;}.connection-indicator {width: 8px;height: 8px;border-radius: 50%;background: var(--color-success);animation: pulse 2s infinite;}.connection-status.disconnected .connection-indicator {background: var(--color-error);animation: none;}@keyframes pulse {0%, 100% {opacity: 1;}50% {opacity: 0.5;}}.main-menu {position: absolute;top: 100%;left: var(--space-4);background: var(--menu-bg);border: 1px solid var(--menu-border);border-radius: var(--border-radius-md);box-shadow: var(--shadow-lg);min-width: 200px;padding: var(--space-2);z-index: var(--z-dropdown);transform-origin: top left;transition: all var(--duration-normal) var(--easing-smooth);}.main-menu.hidden {opacity: 0;visibility: hidden;transform: scale(0.95) translateY(-10px);}.menu-list {list-style: none;margin: 0;padding: 0;}.menu-item {display: flex;align-items: center;gap: var(--space-3);width: 100%;padding: var(--space-3) var(--space-4);background: none;border: none;border-radius: var(--border-radius-sm);color: var(--menu-text);font-size: var(--font-size-sm);font-weight: 500;text-align: left;cursor: pointer;transition: all var(--duration-fast) var(--easing-smooth);}.menu-item:hover, .menu-item:focus-visible {background: var(--bg-tertiary);transform: translateX(2px);}.menu-item--danger {color: var(--color-error);}.menu-item--danger:hover, .menu-item--danger:focus-visible {background: rgba(239, 68, 68, 0.1);}.menu-icon {font-size: var(--font-size-base);opacity: 0.8;}.menu-text {flex: 1;}.footer {position: fixed;bottom: 0;left: 0;right: 0;width: 100%;height: var(--footer-height);background: var(--header-footer);backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);border-top: 1px solid var(--border-subtle);box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);padding: var(--space-2) var(--space-4);padding-bottom: calc(var(--space-2) + env(safe-area-inset-bottom, 0px));display: flex;align-items: center;justify-content: center;z-index: var(--z-fixed);color: var(--text-secondary);font-size: var(--font-size-sm);font-weight: 500;transition: all var(--duration-normal) var(--easing-smooth);will-change: transform, opacity;}.footer.hide-footer {transform: translateY(100%);opacity: 0;pointer-events: none;}.footer p {margin: 0;text-align: center;}.chat-wrapper {height: 100vh;display: flex;flex-direction: column;}.chat-container {flex: 1 1 auto;display: flex;flex-direction: column;justify-content: flex-end;min-height: 0;height: 100%;box-sizing: border-box;padding-bottom: 0 !important;}#chat-box {flex: 1 1 auto;overflow-y: auto;margin-bottom: 0;}#chat-form {flex-shrink: 0;margin-bottom: 0;width: 100%;border: none;background: none;}.chat-container {display: flex;flex-direction: column;flex: 1 1 0%;height: 100%;min-height: calc(100vh - var(--header-height, 64px) - 24px);max-width: 900px;height: 100%;width: 100%;margin: 0 auto;background: rgba(255, 255, 255, 0.15);backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);border-radius: var(--border-radius-xl);box-shadow: var(--shadow-xl);overflow: hidden;border: 1px solid rgba(255, 255, 255, 0.2);position: relative;box-sizing: border-box;padding-bottom: 18px;contain: layout style;}@media (max-width: 700px) {.chat-container {min-height: calc(100vh - var(--header-height, 56px) - 10px);padding-bottom: 10px;}}body.dark .chat-container {background: rgba(15, 23, 42, 0.3);border: 1px solid rgba(255, 255, 255, 0.1);box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 8px 10px -6px rgba(0, 0, 0, 0.4);}#chat-box {background: transparent;border-radius: var(--border-radius-lg);padding: var(--space-4);flex: 1 1 0%;overflow-y: auto;overflow-x: hidden;display: flex;flex-direction: column;gap: var(--space-3);scroll-padding-bottom: 80px;margin: var(--space-1);min-height: 0;max-height: 100%;contain: layout style;scroll-behavior: smooth;}#chat-box::-webkit-scrollbar {width: 6px;}#chat-box::-webkit-scrollbar-track {background: transparent;margin: var(--space-2);}#chat-box::-webkit-scrollbar-thumb {background: var(--border-strong);border-radius: var(--border-radius-sm);}#chat-box::-webkit-scrollbar-thumb:hover {background: var(--text-secondary);}.message, form, .chat-tabs, #chat-form, .input, button, input[type="text"], input[type="search"], input[type="color"], input[type="range"], select {background: var(--assistant-msg, #f0f0f0);}.message.user {background: var(--button-bg);color: #fff;}body.dark .message {background: var(--assistant-msg, #2b2b2b);color: var(--text);}body.dark .message.user {background: var(--button-bg);color: #fff;}.chat-tabs {background: var(--chat-bg);}form, #chat-form {background: var(--chat-bg);position: relative;z-index: 2;}.message {box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.07);transition: transform 0.18s cubic-bezier(.4, 0, .2, 1);will-change: transform;}body.dark .message {box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.18);}.message {max-width: 75%;padding: 12px 16px;border-radius: 16px;line-height: 1.4;opacity: 0;transform: translateY(10px);animation: fadeInUp 0.3s ease forwards;}.message.user {align-self: flex-end;background-color: var(--button-bg);color: #fff;}.message.assistant {align-self: flex-start;background-color: var(--assistant-msg);}.message-meta {display: flex;align-items: center;gap: 12px;margin-top: 6px;font-size: 0.93em;opacity: 0.7;user-select: none;}.message-timestamp {color: var(--text);font-family: 'Segoe UI', monospace;font-size: 0.93em;}.copy-icon {cursor: pointer;color: var(--button-bg);display: flex;align-items: center;transition: color 0.2s;margin-left: 2px;outline: none;}.copy-icon:hover, .copy-icon:focus {color: var(--button-hover);}.copy-icon.copied {color: #4caf50;}.speak-icon {cursor: pointer;color: var(--button-bg);display: flex;align-items: center;transition: color 0.2s;margin-left: 2px;outline: none;}.speak-icon:hover, .speak-icon:focus {color: var(--button-hover);}.share-icon {cursor: pointer;color: var(--button-bg);display: flex;align-items: center;transition: color 0.2s;margin-left: 2px;outline: none;}.share-icon:hover, .share-icon:focus {color: var(--button-hover);}body.dark .message .share-icon {color: #fff !important;}body.dark .message .share-icon:hover, body.dark .message .share-icon:focus {color: var(--button-hover) !important;}body.dark .message-timestamp {color: var(--menu-text);}body.dark .copy-icon {color: var(--button-bg);}body.dark .copy-icon:hover, body.dark .copy-icon:focus {color: var(--button-hover);}body.dark .copy-icon, body.dark .speak-icon {color: #fff !important;}body.dark .copy-icon:hover, body.dark .copy-icon:focus, body.dark .speak-icon:hover, body.dark .speak-icon:focus {color: var(--button-hover) !important;}form {display: flex;border-top: 1px solid #ccc;padding: 8px;background-color: var(--chat-bg);gap: 0;}input {flex: 1;padding: 12px 16px;font-size: 16px;border: none;background-color: var(--input-bg);color: var(--text);border-top-left-radius: 12px;border-bottom-left-radius: 12px;outline: none;transition: box-shadow 0.2s ease;}input:focus {box-shadow: 0 0 0 2px var(--button-bg);}button {background-color: var(--button-bg);color: #fff;border: none;padding: 0 20px;font-size: 18px;cursor: pointer;border-top-right-radius: 12px;border-bottom-right-radius: 12px;transition: background 0.2s ease, transform 0.1s ease;}button:hover {background-color: var(--button-hover);transform: translateY(-1px);}@keyframes fadeInUp {to {opacity: 1;transform: translateY(0);}}@media (max-width: 600px) {.chat-container {margin: 0 8px;}}@media (max-width: 400px) {.typing-indicator span {width: 10px;height: 10px;}}.typing-indicator {display: flex;align-items: center;gap: 6px;margin: 6px 0 6px 0;padding: 10px 16px;background-color: var(--assistant-msg);color: var(--text);border-radius: 16px;width: fit-content;animation: fadeIn 0.3s ease-in-out;align-self: flex-start;opacity: 1;transition: opacity 0.4s ease-in-out;}.typing-indicator span {width: 8px;height: 8px;background-color: var(--text);border-radius: 50%;animation: typing 1.4s infinite ease-in-out;display: inline-block;}.typing-indicator span:nth-child(2) {animation-delay: 0.2s;}.typing-indicator span:nth-child(3) {animation-delay: 0.4s;}.typing-indicator.fade-out {opacity: 0;}@keyframes typing {0%, 80%, 100% {transform: scale(0.6);opacity: 0.3;}40% {transform: scale(1);opacity: 1;}}@keyframes fadeIn {from {opacity: 0;transform: scale(0.95);}to {opacity: 1;transform: scale(1);}}.chat-tabs {display: flex;gap: 0.5rem;padding: 0.5rem;overflow-x: auto;overflow-y: visible;background: var(--chat-bg);border-bottom: 1px solid #ccc;position: relative;z-index: 10;}.chat-tabs-wrapper {position: relative;width: 100%;height: 60px;display: flex;align-items: stretch;background: var(--chat-bg);border-bottom: 1.5px solid #ccc;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);border-top-left-radius: 18px;border-top-right-radius: 18px;z-index: 20;display: flex;align-items: center;padding: 0 0 0 0;}.tabs-scroll, #chat-tabs {display: flex;flex-direction: row;align-items: center;overflow-x: auto;overflow-y: overlay;padding-left: 16px;margin-right: 52px;height: 100%;scrollbar-gutter: stable;min-width: 0;width: 100%;}.chat-tab {flex: 0 0 140px;min-width: 140px;max-width: 140px;height: 44px;min-height: 44px;display: flex;align-items: center;justify-content: center;margin-right: 6px;white-space: nowrap;user-select: none;position: relative;background: color-mix(in srgb, var(--chat-bg) 90%, var(--text) 10%);border-radius: 1rem;color: var(--text);box-shadow: none;border: none;transition: background 0.2s, color 0.2s;overflow: visible !important;}.chat-tab.active {background: var(--button-bg);color: #fff;font-weight: bold;}.chat-tab.add-tab {position: relative;}.chat-tab.add-tab {position: absolute;right: 0;top: 0;bottom: 0;width: 48px;min-width: 48px;max-width: 48px;height: 100%;margin: 0;padding: 0;z-index: 2;background: var(--button-bg, #3d3dff);color: #fff;border-radius: 0 10px 0 0;box-shadow: -2px 0 6px rgba(0, 0, 0, 0.04);display: flex;align-items: center;justify-content: center;cursor: pointer;pointer-events: auto;border: none;max-height: none;height: 100%;}.chat-tab.add-tab svg {height: 60%;width: 60%;display: block;}.tabs-scroll {margin-right: 52px;}.chat-tabs-wrapper {box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);}#tabs-blocker {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.38);z-index: 10;pointer-events: auto;display: none;border-radius: 10px;}.chat-tab {background: color-mix(in srgb, var(--chat-bg) 90%, var(--text) 10%);padding: 0.4rem 0.8rem;border-radius: 1rem;cursor: pointer;position: relative;transition: background 0.2s, color 0.2s;color: var(--text);display: flex;align-items: center;gap: 4px;min-width: 72px;height: 40px;max-height: 40px;line-height: 40px;justify-content: center;text-align: center;box-sizing: border-box;overflow: hidden;}.chat-tab span {white-space: nowrap;overflow: visible;text-overflow: unset;display: block;width: 100%;}.chat-tab:hover {background: color-mix(in srgb, var(--chat-bg) 70%, var(--text) 30%);}.chat-tab.active {background: var(--button-bg);color: white;font-weight: bold;}.chat-tab.loading .tab-loading-bar {height: 4px;top: 0;left: 0;right: 0;border-radius: 4px 4px 0 0;z-index: 2;}.tab-menu-button {margin-left: auto;cursor: pointer;padding: 0 6px;font-size: 18px;user-select: none;}.tab-menu-button svg, .chat-tab.add-tab svg {display: block;margin: auto;}.tab-context-menu {position: absolute;background: var(--menu-bg);color: var(--menu-text);border: 1px solid var(--menu-border);border-radius: 6px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);display: none;flex-direction: column;z-index: 10000;min-width: 120px;font-size: 14px;opacity: 0;transform: translateY(-10px) scale(0.98);pointer-events: none;transition: opacity 0.18s cubic-bezier(.4, 0, .2, 1), transform 0.18s cubic-bezier(.4, 0, .2, 1);z-index: 1000;}.tab-context-menu.visible {display: flex;opacity: 1;transform: translateY(0) scale(1);pointer-events: auto;}.tab-context-menu .menu-item {padding: 8px 12px;cursor: pointer;}.tab-context-menu .menu-item:hover {background-color: rgba(0, 0, 0, 0.05);}body.dark .tab-context-menu {background: var(--menu-bg);color: var(--menu-text);border-color: var(--menu-border);}.chat-tab.add-tab {font-weight: bold;background: var(--button-bg);color: white;}.export-button {font-size: 0.7rem;margin-left: 6px;background: transparent;color: var(--text);border: 1px solid var(--text);border-radius: 8px;padding: 2px 6px;cursor: pointer;}.export-button:hover {background: var(--button-bg);color: white;}body.theme-transition * {transition: background-color 0.3s ease, color 0.3s ease;}.switch-icon {display: flex;align-items: center;gap: 8px;font-size: 1.2rem;cursor: pointer;position: relative;}.switch-icon input[type="checkbox"] {opacity: 0;width: 0;height: 0;position: absolute;}.switch-icon .slider {width: 48px;height: 26px;background-color: #ccc;border-radius: 34px;position: relative;transition: background-color 0.3s;}.switch-icon .slider::before {content: "";position: absolute;height: 20px;width: 20px;left: 3px;top: 3px;background-color: white;border-radius: 50%;transition: transform 0.3s ease;}.switch-icon input:checked+.slider::before {transform: translateX(22px);}.switch-icon input:checked+.slider {background-color: var(--button-bg);}.switch-icon .icon {transition: opacity 0.2s ease;}.switch-icon .sun {opacity: 1;}.switch-icon .moon {opacity: 0.4;}.switch-icon input:checked~.moon {opacity: 1;}.switch-icon input:checked~.sun {opacity: 0.4;}#burger-menu {position: absolute;top: 100%;left: 0;background: var(--menu-bg);color: var(--menu-text);border: 1px solid var(--menu-border);border-radius: 8px;padding: 10px;z-index: 9999;width: 200px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);opacity: 0;transform: translateY(-10px) scale(0.98);pointer-events: none;transition: opacity 0.22s cubic-bezier(.4, 0, .2, 1), transform 0.22s cubic-bezier(.4, 0, .2, 1);}#burger-menu div {margin: 5px 0;cursor: pointer;padding: 5px 10px;border-radius: 4px;}#burger-menu div:hover {background-color: var(--button-hover);color: var(--menu-text);}body:not(.dark) #burger-menu div:hover {color: #fff !important;}#burger-menu:not(.hidden) {opacity: 1;transform: translateY(0) scale(1);pointer-events: auto;}#burger-menu.menu-fade-in {animation: burgerMenuFadeIn 0.32s cubic-bezier(.4, 0, .2, 1);}@keyframes burgerMenuFadeIn {from {opacity: 0;transform: translateY(-16px) scale(0.95);}to {opacity: 1;transform: translateY(0) scale(1);}}#overlay-layer {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);z-index: 500;backdrop-filter: blur(0px);-webkit-backdrop-filter: blur(0px);opacity: 0;transition: opacity 0.35s cubic-bezier(.4, 0, .2, 1), backdrop-filter 0.5s cubic-bezier(.4, 0, .2, 1), -webkit-backdrop-filter 0.5s cubic-bezier(.4, 0, .2, 1);}#overlay-layer:not(.hidden) {opacity: 1;pointer-events: auto;backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);}@keyframes popup-fade-in {0% {opacity: 0;transform: translate(-50%, -50%) scale(0.92);filter: blur(2px);}60% {opacity: 1;transform: translate(-50%, -50%) scale(1.03);filter: blur(0.5px);}100% {opacity: 1;transform: translate(-50%, -50%) scale(1);filter: blur(0);}}.popup {position: fixed;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 85vw;max-width: 600px;background: var(--menu-bg);color: var(--menu-text);padding: 0;border-radius: 8px;border: 1px solid var(--menu-border);box-shadow: 0 8px 40px 0 rgba(76, 140, 255, 0.13), 0 2px 16px #0002;z-index: 10000;animation: popup-fade-in 0.55s cubic-bezier(.33, 1.6, .6, 1) both;display: flex;flex-direction: column;max-height: calc(100vh - var(--header-height, 64px) - var(--footer-height, 56px) - 4vh);min-height: 120px;overflow: hidden;}.popup-content {overflow: auto;max-height: 100%;}@media (max-width: 700px) {.popup {width: 98vw;max-width: 98vw;max-height: calc(100vh - var(--header-height, 56px) - var(--footer-height, 56px) - 2vh);}}.popup-titlebar {position: sticky;top: 0;left: 0;right: 0;height: 48px;background: var(--popup-titlebar-bg);color: var(--popup-titlebar-text);border-bottom: 1px solid var(--menu-border);display: flex;align-items: center;justify-content: space-between;padding: 0;z-index: 10;border-top-left-radius: 8px;border-top-right-radius: 8px;font-weight: 500;font-size: 1.13rem;user-select: none;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);flex: 0 0 auto;}.popup-title {flex: 1;text-align: left;font-size: 1.08rem;font-weight: 500;color: var(--popup-titlebar-text);padding-left: 18px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;height: 100%;display: flex;align-items: center;}.popup-close-x {position: relative;top: 0;right: 0;width: 48px;height: 48px;background: var(--button-bg);border: none;cursor: pointer;z-index: 11;padding: 0;opacity: 1;transition: background 0.2s, color 0.2s;border-top-right-radius: 8px;display: flex;align-items: center;justify-content: center;}.popup-close-x .close-icon {position: relative;width: 22px;height: 22px;display: inline-block;}.popup-close-x .close-icon::before, .popup-close-x .close-icon::after {content: '';position: absolute;left: 50%;top: 50%;width: 3px;height: 18px;background: #fff !important;border-radius: 2px;transition: background 0.2s;transform: translate(-50%, -50%) rotate(45deg);}.popup-close-x .close-icon::after {transform: translate(-50%, -50%) rotate(-45deg);}.popup-close-x:hover, .popup-close-x:focus {background: var(--button-hover);}body.dark .popup-close-x {background: var(--button-bg);}body.dark .popup-close-x:hover, body.dark .popup-close-x:focus {background: var(--button-hover);}.popup-content {display: flex;flex-direction: column;align-items: center;gap: 18px;padding: 28px 24px 24px 24px;position: relative;flex: 1 1 auto;overflow: auto;min-height: 0;max-height: 100%;width: 100%;}.popup-content p, .popup-content ul, .popup-content ol, .popup-content li, .popup-content h1, .popup-content h2, .popup-content h3, .popup-content h4, .popup-content h5, .popup-content h6 {margin: 0 0 1em 0;line-height: 1.6;}.popup-content ul, .popup-content ol {padding-left: 2em;}.popup-content pre, .popup-content code {font-family: 'Fira Mono', 'Consolas', 'Menlo', monospace;background: #f7f7f7;color: #222;border-radius: 4px;padding: 0.2em 0.5em;font-size: 0.98em;white-space: pre-wrap;word-break: break-word;margin-bottom: 1em;display: block;}.popup-content br {display: inline;}.popup-content {white-space: normal;word-break: break-word;}.popup-buttons {display: grid;grid-auto-flow: column;gap: 16px;justify-content: center;margin-top: 10px;}.popup-buttons button {min-width: 90px;}.popup button {padding: 10px 20px;border: none;border-radius: 8px;background-color: var(--button-bg);color: white;cursor: pointer;}body.dark .popup {background-color: var(--menu-bg);color: var(--menu-text);border: 1px solid var(--menu-border);box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);}body.dark .popup button {background-color: var(--button-bg);color: white;}body.dark .popup button:hover {background-color: var(--button-hover);}.popup button:hover {background-color: var(--button-hover);}.dark .message.user {background-color: var(--button-bg);color: #ffffff;}@media (prefers-reduced-motion: reduce) {.message, .typing-indicator span {animation: none !important;transition: none !important;}}.input-error {border: 2px solid red !important;background-color: #ffe6e6;color: #b00020;}.hidden {display: none;}.chat-tab {background-color: rgba(0, 0, 0, 0.05);background: color-mix(in srgb, var(--chat-bg) 90%, var(--text) 10%);}.is-hidden {display: none !important;}.loader-invisible {display: none !important;}.rename-input {width: 100%;min-width: 0;max-width: 100%;box-sizing: border-box;border-radius: 8px;border: 1px solid var(--button-bg);padding: 4px 8px;font-size: 1em;outline: none;}@keyframes popup-fade-in {0% {opacity: 0;transform: translate(-50%, -50%) scale(0.92);filter: blur(2px);}60% {opacity: 1;transform: translate(-50%, -50%) scale(1.03);filter: blur(0.5px);}100% {opacity: 1;transform: translate(-50%, -50%) scale(1);filter: blur(0);}}body.dark #burger-menu div:hover {background: var(--button-hover) !important;}.chat-tab, .popup, .button, .menu-item {transition: all 0.3s ease-in-out;}.chat-tab.loading {background: #ccc !important;color: #888;position: relative;overflow: hidden !important;}.tab-loading-bar {position: absolute;left: 0;top: 0;width: 0;height: 4px;background: var(--button-bg, #4b8cff);z-index: 1;animation: tab-loading-bar-anim 1.2s linear forwards;border-radius: 4px 4px 0 0;}@keyframes tab-loading-bar-anim {from {width: 0;}to {width: 100%;}}@keyframes add-tab-spinner-anim {to {transform: rotate(360deg);}}.chat-tab.add-tab.loading {cursor: wait;filter: brightness(1.05);position: absolute;right: 0;top: 0;bottom: 0;}.chat-tab.add-tab.loading svg {display: none;}.chat-tab.add-tab.loading::before {content: '';box-sizing: border-box;position: absolute;top: 50%;left: 50%;width: 24px;height: 24px;margin-top: -12px;margin-left: -12px;border-radius: 50%;border: 3px solid rgba(255, 255, 255, 0.3);border-top-color: #ffffff;animation: add-tab-spinner-anim .7s linear infinite;}.chat-tab.loading span, .chat-tab.loading .tab-menu-button {position: relative;z-index: 2;}.tab-loading-dots {display: inline-block;margin-left: 8px;}.tab-loading-dots span {display: inline-block;width: 6px;height: 6px;margin: 0 1px;border-radius: 50%;background: #888;opacity: 0.5;animation: tab-dot-bounce 1s infinite;}.tab-loading-dots span:nth-child(2) {animation-delay: 0.2s;}.tab-loading-dots span:nth-child(3) {animation-delay: 0.4s;}@keyframes tab-dot-bounce {0%, 80%, 100% {opacity: 0.5;transform: translateY(0);}40% {opacity: 1;transform: translateY(-5px);}}.reset-loader {display: flex;justify-content: center;align-items: center;height: 60px;margin-top: 24px;}.reset-loader-track {width: 100%;max-width: 320px;min-width: 120px;height: 16px;background: #e0e0e0;border-radius: 8px;overflow: hidden;border: 1px solid var(--menu-border);position: relative;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);}.reset-loader-bar {width: 0;height: 100%;background: linear-gradient(90deg, var(--button-bg), var(--button-hover));border-radius: 8px 0 0 8px;transition: width 1.2s cubic-bezier(.4, 0, .2, 1);position: absolute;left: 0;top: 0;}.reset-loader.active .reset-loader-bar {width: 100%;}#content, #content2 {padding: 0 !important;margin: 0 !important;}#content *, #content2 * {margin-top: 0 !important;margin-bottom: 0 !important;padding: 0 !important;box-sizing: border-box;}#language-select {appearance: none;-webkit-appearance: none;-moz-appearance: none;background: var(--input-bg);color: var(--text);border: 1.5px solid var(--menu-border);border-radius: 8px;padding: 10px 38px 10px 14px;font-size: 1rem;font-family: inherit;outline: none;transition: border-color 0.22s cubic-bezier(.4, 0, .2, 1), box-shadow 0.22s cubic-bezier(.4, 0, .2, 1);box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);cursor: pointer;min-width: 120px;max-width: 220px;margin-top: 6px;margin-bottom: 8px;background-image: linear-gradient(45deg, transparent 49%, var(--menu-border) 50%, var(--menu-border) 51%, transparent 52%), linear-gradient(135deg, transparent 49%, var(--menu-border) 50%, var(--menu-border) 51%, transparent 52%);background-position: right 16px top 55%, right 22px top 55%;background-size: 7px 7px, 7px 7px;background-repeat: no-repeat;}#language-select:focus {border-color: var(--button-bg);box-shadow: 0 0 0 2px var(--button-bg), 0 2px 8px rgba(0, 0, 0, 0.06);}#language-select:disabled {background: #e0e0e0;color: #aaa;cursor: not-allowed;opacity: 0.7;}body.dark #language-select {background: var(--input-bg);color: var(--text);border-color: var(--menu-border);}body.dark #language-select:focus {border-color: var(--button-bg);box-shadow: 0 0 0 2px var(--button-bg), 0 2px 8px rgba(0, 0, 0, 0.12);}#language-select {transition: border-color 0.22s cubic-bezier(.4, 0, .2, 1), box-shadow 0.22s cubic-bezier(.4, 0, .2, 1), background-color 0.22s cubic-bezier(.4, 0, .2, 1);}#color-scheme-picker {border: 1.5px solid var(--menu-border);border-radius: 6px;background: var(--input-bg);cursor: pointer;transition: border-color 0.2s;}#color-scheme-picker:focus {border-color: var(--button-bg);outline: none;}#reset-color-scheme {padding: 6px 14px;border-radius: 8px;border: 1px solid var(--button-bg);background: transparent;color: var(--button-bg);font-weight: 500;cursor: pointer;transition: background 0.2s, color 0.2s;}#reset-color-scheme:hover {background: var(--button-bg);color: #fff;}input[type="color"] {-webkit-appearance: none;appearance: none;border: none;width: 38px;height: 38px;border-radius: 50%;overflow: hidden;cursor: pointer;background: none;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);transition: box-shadow 0.18s, border 0.18s;margin: 0 6px;padding: 0;display: inline-block;}#color-scheme-picker, #bg-gradient-color1, #bg-gradient-color2 {width: 38px !important;height: 38px !important;border-radius: 50% !important;min-width: 38px !important;min-height: 38px !important;max-width: 38px !important;max-height: 38px !important;padding: 0 !important;margin: 0 6px !important;display: inline-block !important;}input[type="color"]::-webkit-color-swatch-wrapper {padding: 0;border-radius: 50%;width: 38px;height: 38px;box-sizing: border-box;}input[type="color"]::-webkit-color-swatch {border: none;border-radius: 50%;width: 38px;height: 38px;box-sizing: border-box;}input[type="color"]::-moz-color-swatch {border: none;border-radius: 50%;width: 38px;height: 38px;box-sizing: border-box;}input[type="color"]::-ms-color-swatch {border: none;border-radius: 50%;width: 38px;height: 38px;box-sizing: border-box;}input[type="color"]:focus {outline: none;box-shadow: 0 0 0 3px var(--button-bg, #3d3dff);border: 2px solid var(--button-bg, #3d3dff);}body.dark input[type="color"] {box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);border: 1.5px solid #444;}@media (prefers-color-scheme: dark) {::-webkit-scrollbar {width: 8px;background: transparent;}::-webkit-scrollbar-thumb {background: #23272e;border-radius: 6px;}::-webkit-scrollbar-thumb:hover {background: #444a60;}* {scrollbar-width: thin;scrollbar-color: #23272e transparent;}}@media (prefers-color-scheme: light), not all and (prefers-color-scheme: dark) {::-webkit-scrollbar {width: 8px;background: transparent;}::-webkit-scrollbar-thumb {background: #e0e0e0;border-radius: 6px;}::-webkit-scrollbar-thumb:hover {background: #bdbdbd;}* {scrollbar-width: thin;scrollbar-color: #e0e0e0 transparent;}}#hamburger-button {width: 48px;height: 48px;min-width: 48px;min-height: 48px;display: flex;align-items: center;justify-content: center;cursor: pointer;border: none;background: var(--button-bg);color: #fff;padding: 0;margin-right: 8px;font-size: 2rem;transition: background 0.18s;border-radius: 50%;box-shadow: 0 2px 8px rgba(61, 61, 255, 0.10);}#hamburger-button:hover, #hamburger-button:focus {background: var(--button-hover);color: #fff;outline: none;box-shadow: 0 2px 8px rgba(61, 61, 255, 0.18);}#hamburger-button svg {width: 32px;height: 32px;display: block;margin: auto;}.hamburger-button {display: flex;flex-direction: column;justify-content: center;align-items: center;width: 40px;height: 40px;background: none;border: none;padding: 0;cursor: pointer;}.burger-bar {display: block;width: 26px;height: 3.5px;background: #fff;border-radius: 2px;margin: 3.5px 0;transition: all 0.2s;}button, .chat-tab, .copy-icon, .speak-icon, .share-icon, .theme-toggle, .tab-menu-button, .hamburger-button, input[type="text"], input[type="search"], select {transition-property: background-color, border-color, color, transform, box-shadow, opacity, filter;transition-duration: 0.2s;transition-timing-function: ease-in-out;}.chat-tab:not(.active):not(.add-tab):hover {transform: translateY(-2px);background-color: color-mix(in srgb, var(--chat-bg, #f8f8fa) 80%, var(--text, #222) 20%);box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06);}body.dark .chat-tab:not(.active):not(.add-tab):hover {background-color: color-mix(in srgb, var(--chat-bg, #2a2a2e) 85%, var(--text, #f0f0f0) 15%);}.chat-tab.add-tab:hover {transform: scale(1.05);filter: brightness(1.15);}.chat-tab.add-tab:active {transform: scale(0.98);filter: brightness(0.9);}.tab-menu-button {padding: 4px;border-radius: 50%;width: 28px;height: 28px;display: inline-flex;align-items: center;justify-content: center;}.tab-menu-button:hover {transform: scale(1.15);background-color: rgba(0, 0, 0, 0.07);}body.dark .tab-menu-button:hover {background-color: rgba(255, 255, 255, 0.1);}.tab-menu-button:active {transform: scale(0.95);}button:hover, .button-like:hover {filter: brightness(1.1);transform: translateY(-1px);box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);}button:active, .button-like:active {filter: brightness(0.95);transform: translateY(0px) scale(0.98);box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);}.copy-icon, .speak-icon, .share-icon {padding: 4px;border-radius: 50%;}.copy-icon:hover, .speak-icon:hover, .share-icon:hover {transform: scale(1.2) rotate(3deg);color: var(--button-bg, #3d3dff);background-color: rgba(0, 0, 0, 0.05);}body.dark .copy-icon:hover, body.dark .speak-icon:hover, body.dark .share-icon:hover {background-color: rgba(255, 255, 255, 0.08);}.copy-icon:active, .speak-icon:active, .share-icon:active {transform: scale(0.9);}.copy-icon.copied {color: #4CAF50;transform: scale(1.15);}.hamburger-button:hover .burger-bar {background-color: var(--button-bg, #3d3dff);}.hamburger-button:hover .burger-bar:nth-child(1) {transform: translateX(-3px) scaleX(0.9);}.hamburger-button:hover .burger-bar:nth-child(3) {transform: translateX(3px) scaleX(0.9);}.hamburger-button:active {transform: scale(0.92);}.hamburger-button.open .burger-bar:nth-child(1) {transform: translateY(7px) rotate(45deg);}.hamburger-button.open .burger-bar:nth-child(2) {opacity: 0;transform: scaleX(0);}.hamburger-button.open .burger-bar:nth-child(3) {transform: translateY(-7px) rotate(-45deg);}.theme-toggle:hover {transform: rotate(25deg) scale(1.15);color: var(--button-bg, #3d3dff);}.theme-toggle:active {transform: rotate(0deg) scale(0.95);}.theme-toggle svg {transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);}.theme-toggle:hover svg {transform: scale(1.1);}@keyframes fadeInMessage {from {opacity: 0;transform: translateY(12px) scale(0.99);}to {opacity: 1;transform: translateY(0) scale(1);}}.message {animation: fadeInMessage 0.45s ease-out forwards;}#user-input:focus, textarea:focus {border-color: var(--button-bg, #3d3dff);box-shadow: 0 0 0 3.5px color-mix(in srgb, var(--button-bg, #3d3dff) 25%, transparent);}.tab-context-menu {opacity: 0;transform: translateY(8px) scale(0.97);transition: opacity 0.18s ease, transform 0.18s ease, visibility 0s 0.18s;visibility: hidden;pointer-events: none;border-radius: 8px;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.12);}.tab-context-menu.visible {opacity: 1;transform: translateY(0) scale(1);transition-delay: 0s;visibility: visible;pointer-events: auto;}.tab-context-menu .menu-item {transition: background-color 0.15s ease, padding-left 0.18s ease, color 0.15s ease;padding: 8px 12px;}.tab-context-menu .menu-item:hover {background-color: color-mix(in srgb, var(--button-bg, #3d3dff) 15%, transparent);padding-left: 16px;color: var(--button-bg, #3d3dff);}body.dark .tab-context-menu .menu-item:hover {color: var(--text, #f0f0f0);}.tab-loading-dots span {animation: tabLoadingBounce 1.4s infinite ease-in-out both;display: inline-block;width: 7px;height: 7px;border-radius: 50%;background-color: currentColor;margin: 0 2px;}.tab-loading-dots span:nth-child(1) {animation-delay: -0.32s;}.tab-loading-dots span:nth-child(2) {animation-delay: -0.16s;}@keyframes tabLoadingBounce {0%, 80%, 100% {transform: scale(0.3);opacity: 0.5;}40% {transform: scale(1.0);opacity: 1;}}html {scroll-behavior: smooth;}.message pre {background-color: rgba(0, 0, 0, 0.05);border-radius: 8px;padding: 12px;font-size: 0.9em;overflow-x: auto;max-width: 100%;box-sizing: border-box;white-space: pre;word-wrap: normal;}.message pre code {font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;padding: 0;background: none;border-radius: 0;}.dark .message pre {background-color: rgba(255, 255, 255, 0.07);border: 1px solid rgba(255, 255, 255, 0.1);}.settings-container {width: 100%;max-width: 340px;}.settings-group {margin-top: 24px;}.settings-group--large-margin {margin-top: 32px;}.settings-label {font-weight: 500;display: block;margin-bottom: 8px;}#language-select {margin-top: 6px;width: 100%;max-width: 220px;}#reset-color-scheme {margin-left: 18px;}.gradient-controls-container {display: flex;gap: 18px;align-items: center;flex-wrap: wrap;}.gradient-control {display: flex;flex-direction: column;align-items: center;}.gradient-control--extra-margin {margin-left: 12px;}.gradient-control-label {font-size: 0.95em;margin-bottom: 2px;}#bg-gradient-angle {width: 140px;}#bg-gradient-angle-value {font-size: 0.9em;margin-top: 2px;}.checkbox-label {font-size: 0.95em;display: flex;align-items: center;gap: 6px;cursor: pointer;}#bg-gradient-darken {margin-right: 6px;}#reset-bg-gradient {margin-top: 8px;}.tab-badge {position: absolute;top: -7px;right: -7px;width: 22px;min-width: 22px;max-width: 22px;height: 22px;background: #e53935;color: #fff;font-size: 1rem;font-weight: bold;border-radius: 50%;display: flex;align-items: center;justify-content: center;z-index: 20;box-shadow: 0 2px 8px rgba(229,57,53,0.18);border: 2px solid #fff;opacity: 1;pointer-events: none;transition: opacity 0.22s cubic-bezier(.4,0,.2,1), transform 0.22s cubic-bezier(.4,0,.2,1);transform: scale(1);padding: 0;line-height: 22px;box-sizing: border-box;}.tab-badge-animate-in {animation: tabBadgeIn 0.32s cubic-bezier(.4,0,.2,1);}@keyframes tabBadgeIn {0% {opacity: 0;transform: scale(0.5);}70% {opacity: 1;transform: scale(1.15);}100% {opacity: 1;transform: scale(1);}}.tab-badge.tab-badge-animate-out {animation: tabBadgeOut 0.22s cubic-bezier(.4,0,.2,1) forwards;}@keyframes tabBadgeOut {0% {opacity: 1;transform: scale(1);}100% {opacity: 0;transform: scale(0.7);}}.message {max-width: 85%;padding: var(--space-3) var(--space-4);border-radius: var(--border-radius-lg);line-height: 1.5;font-size: var(--font-size-base);word-wrap: break-word;overflow-wrap: break-word;position: relative;contain: layout style;opacity: 0;transform: translateY(10px);animation: messageSlideIn var(--duration-normal) var(--easing-smooth) forwards;box-shadow: var(--shadow-md);transition: all var(--duration-fast) var(--easing-smooth);}.message:hover {transform: translateY(-1px);box-shadow: var(--shadow-lg);}.message.user {align-self: flex-end;background: linear-gradient(135deg, var(--primary-brand) 0%, var(--primary-brand-hover) 100%);color: white;border-bottom-right-radius: var(--border-radius-sm);}.message.user::before {content: '';position: absolute;bottom: 8px;right: -8px;width: 0;height: 0;border-left: 8px solid var(--primary-brand);border-bottom: 8px solid transparent;}.message.assistant {align-self: flex-start;background: var(--assistant-msg);color: var(--text-primary);border-bottom-left-radius: var(--border-radius-sm);border: 1px solid var(--border-subtle);}.message.assistant::before {content: '';position: absolute;bottom: 8px;left: -8px;width: 0;height: 0;border-right: 8px solid var(--assistant-msg);border-bottom: 8px solid transparent;}body.dark .message {box-shadow: var(--shadow-lg);}body.dark .message.assistant {background: var(--bg-tertiary);border-color: var(--border-subtle);}body.dark .message.assistant::before {border-right-color: var(--bg-tertiary);}.message.error {background: rgba(239, 68, 68, 0.1);border: 1px solid var(--color-error);color: var(--color-error);}.message.loading {opacity: 0.7;animation: pulse 1.5s ease-in-out infinite;}.message-meta {display: flex;align-items: center;gap: var(--space-3);margin-top: var(--space-2);font-size: var(--font-size-sm);opacity: 0.7;user-select: none;}.message-timestamp {color: currentColor;font-family: ui-monospace, 'SF Mono', 'Monaco', 'Cascadia Code', 'Roboto Mono', monospace;font-size: var(--font-size-xs);font-weight: 500;}.copy-message-btn {position: absolute;top: var(--space-2);right: var(--space-2);background: rgba(0, 0, 0, 0.1);border: none;border-radius: var(--border-radius-sm);padding: var(--space-1);cursor: pointer;opacity: 0;transition: all var(--duration-fast) var(--easing-smooth);font-size: var(--font-size-sm);}.message:hover .copy-message-btn {opacity: 1;}.copy-message-btn:hover {background: rgba(0, 0, 0, 0.2);transform: scale(1.1);}.typing-indicator {align-self: flex-start;max-width: 60px;padding: var(--space-3);background: var(--assistant-msg);border-radius: var(--border-radius-lg);border-bottom-left-radius: var(--border-radius-sm);animation: messageSlideIn var(--duration-normal) var(--easing-smooth) forwards;}.typing-dots {display: flex;gap: var(--space-1);align-items: center;justify-content: center;}.typing-dots span {width: 6px;height: 6px;background: var(--text-secondary);border-radius: 50%;animation: typingDots 1.4s ease-in-out infinite;}.typing-dots span:nth-child(2) {animation-delay: 0.2s;}.typing-dots span:nth-child(3) {animation-delay: 0.4s;}.message pre {background: rgba(0, 0, 0, 0.05);border-radius: var(--border-radius-sm);padding: var(--space-3);margin: var(--space-2) 0;overflow-x: auto;font-family: ui-monospace, 'SF Mono', 'Monaco', 'Cascadia Code', 'Roboto Mono', monospace;font-size: var(--font-size-sm);line-height: 1.4;}body.dark .message pre {background: rgba(255, 255, 255, 0.1);}.message code {background: rgba(0, 0, 0, 0.1);padding: 0.125em 0.25em;border-radius: 3px;font-family: ui-monospace, 'SF Mono', 'Monaco', 'Cascadia Code', 'Roboto Mono', monospace;font-size: 0.9em;}body.dark .message code {background: rgba(255, 255, 255, 0.15);}@keyframes messageSlideIn {from {opacity: 0;transform: translateY(10px);}to {opacity: 1;transform: translateY(0);}}@keyframes typingDots {0%, 60%, 100% {transform: scale(1);opacity: 0.4;}30% {transform: scale(1.2);opacity: 1;}}@keyframes fadeInUp {from {opacity: 0;transform: translateY(10px);}to {opacity: 1;transform: translateY(0);}}.noscript-overlay {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: var(--bg-primary);z-index: 9999;display: flex;align-items: center;justify-content: center;padding: var(--space-4);}.noscript-message {max-width: 500px;text-align: center;background: var(--bg-secondary);border: 1px solid var(--border-subtle);border-radius: var(--border-radius-lg);padding: var(--space-8);box-shadow: var(--shadow-xl);}.noscript-message h1 {color: var(--color-error);margin-bottom: var(--space-4);font-size: var(--font-size-2xl);}.noscript-message p {margin-bottom: var(--space-4);line-height: 1.6;color: var(--text-secondary);}.noscript-message a {color: var(--primary-brand);text-decoration: none;font-weight: 600;}.noscript-message a:hover {text-decoration: underline;}@media (max-width: 768px) {.chat-wrapper {padding: calc(var(--header-height) + var(--space-2)) var(--space-2) calc(var(--footer-height) + var(--space-2)) var(--space-2);}.chat-container {border-radius: var(--border-radius-lg);margin: 0;}#chat-box {padding: var(--space-3);gap: var(--space-2);}.message {max-width: 90%;padding: var(--space-2) var(--space-3);font-size: var(--font-size-sm);}.header h1, .app-title {font-size: var(--font-size-lg);}.main-menu {left: var(--space-2);right: var(--space-2);min-width: auto;}}@media (min-width: 769px) and (max-width: 1024px) {.chat-container {max-width: 700px;}.message {max-width: 80%;}}@media (min-width: 1025px) {.chat-container {max-width: 900px;}.message {max-width: 75%;}.message:hover {transform: translateY(-2px);}.hamburger-button:hover {transform: scale(1.05);}}@media (min-width: 1400px) {.chat-wrapper {padding: calc(var(--header-height) + var(--space-6)) var(--space-6) calc(var(--footer-height) + var(--space-6)) var(--space-6);}.chat-container {max-width: 1000px;}}@supports (padding: max(0px)) {.header {padding-top: max(var(--space-2), env(safe-area-inset-top));}.footer {padding-bottom: max(var(--space-2), env(safe-area-inset-bottom));}.chat-wrapper {padding-top: calc(var(--header-height) + max(var(--space-4), env(safe-area-inset-top)));padding-bottom: calc(var(--footer-height) + max(var(--space-4), env(safe-area-inset-bottom)));}}@media (max-height: 500px) and (orientation: landscape) {.header {height: 48px;--header-height: 48px;}.footer {height: 40px;--footer-height: 40px;}.chat-wrapper {padding: calc(48px + var(--space-2)) var(--space-2) calc(40px + var(--space-2)) var(--space-2);}}@media (pointer: coarse) {.hamburger-button {width: 44px;height: 44px;padding: var(--space-3);}.menu-item {padding: var(--space-4);font-size: var(--font-size-base);}.copy-message-btn {padding: var(--space-2);opacity: 1;}}@media (hover: hover) {.copy-message-btn {opacity: 0;}.message:hover .copy-message-btn {opacity: 1;}}.message, .hamburger-button, .chat-container, .header, .footer {will-change: transform;transform: translateZ(0);}.chat-container {contain: layout style paint;}.message {contain: layout style;}.chat-tabs-wrapper, #chat-box, .chat-form {contain: layout;}@media print {body {background: white !important;color: black !important;}.header, .footer, .hamburger-button, .main-menu, .overlay-layer {display: none !important;}.chat-wrapper {padding: 0 !important;}.chat-container {background: transparent !important;box-shadow: none !important;border: 1px solid #ccc !important;border-radius: 0 !important;}.message {background: #f5f5f5 !important;color: black !important;box-shadow: none !important;border: 1px solid #ddd !important;page-break-inside: avoid;}.message.user {background: #e0e0e0 !important;}}.hidden {display: none !important;}.invisible {visibility: hidden !important;}.sr-only {position: absolute !important;width: 1px !important;height: 1px !important;padding: 0 !important;margin: -1px !important;overflow: hidden !important;clip: rect(0, 0, 0, 0) !important;white-space: nowrap !important;border: 0 !important;}.loading {opacity: 0.6;pointer-events: none;cursor: wait;}.shimmer {background: linear-gradient(90deg, var(--bg-secondary) 25%, var(--bg-tertiary) 50%, var(--bg-secondary) 75% );background-size: 200% 100%;animation: shimmer 1.5s infinite ease-in-out;}@keyframes shimmer {0% {background-position: -200% 0;}100% {background-position: 200% 0;}}.error-state {color: var(--color-error);background: rgba(239, 68, 68, 0.1);border: 1px solid var(--color-error);border-radius: var(--border-radius-sm);padding: var(--space-3);text-align: center;}.success-state {color: var(--color-success);background: rgba(34, 197, 94, 0.1);border: 1px solid var(--color-success);border-radius: var(--border-radius-sm);padding: var(--space-3);text-align: center;}@supports not (backdrop-filter: blur(20px)) {.chat-container {background: rgba(255, 255, 255, 0.9) !important;}body.dark .chat-container {background: rgba(15, 23, 42, 0.9) !important;}.header, .footer {background: var(--header-footer) !important;}}@supports not (display: flex) {.header {display: block;text-align: center;}.chat-wrapper {display: block;}.message {display: inline-block;width: 75%;}}@supports not (display: grid) {.gradient-controls-container {display: block;}.gradient-control {display: inline-block;width: 48%;margin: 1%;}}.message-action {background: none;border: none;color: var(--button-bg, #3d3dff);font-size: 1.15em;padding: 4px 8px;margin: 0 2px;border-radius: 6px;cursor: pointer;display: inline-flex;align-items: center;justify-content: center;transition: background 0.15s, color 0.15s, box-shadow 0.15s;outline: none;box-shadow: none;}.message-action:hover, .message-action:focus-visible {background: var(--button-hover, #e6eaff);color: var(--button-bg, #3d3dff);box-shadow: 0 2px 8px rgba(61,61,255,0.07);}.message-action:active {background: var(--button-bg, #3d3dff);color: #fff;}body.dark .message-action {color: var(--button-bg, #7ca7ff);}body.dark .message-action:hover, body.dark .message-action:focus-visible {background: rgba(61,61,255,0.12);color: var(--button-bg, #7ca7ff);}body.dark .message-action:active {background: var(--button-bg, #7ca7ff);color: #fff;}.menu-footer {margin-top: 24px;padding: 12px 0 0 0;text-align: center;font-size: 0.98em;color: var(--text-muted, #888);border-top: 1px solid var(--border-subtle, #eee);}.menu-footer p {margin: 0;font-size: 0.98em;color: var(--text-muted, #888);display: inline-block;}#language-emoji {font-size: 1.2em;margin-left: 6px;}@media (max-width: 700px) {.menu-footer {font-size: 0.95em;padding-bottom: 8px;}}