.app-layout{min-height:100vh;display:flex;flex-direction:column}.app-header{position:sticky;top:0;z-index:var(--z-sticky);background:#0a0a0bcc;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border-subtle)}.app-header-content{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 var(--space-6);max-width:1200px;margin:0 auto}.app-logo{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xl);font-weight:var(--font-bold);color:var(--color-text-primary);text-decoration:none}.app-logo-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-accent-primary) 0%,var(--color-accent-tertiary) 100%);border-radius:var(--radius-md);font-size:var(--text-lg)}.app-main{flex:1;padding:var(--space-8) 0}.translate-card{background:var(--color-bg-secondary);border:1px solid var(--color-border-default);border-radius:var(--radius-2xl);padding:var(--space-8);box-shadow:var(--shadow-xl)}.translate-header{margin-bottom:var(--space-6)}.header-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-2)}.translate-title{font-size:var(--text-3xl);font-weight:var(--font-bold);margin:0}.wordit-logo{height:40px;width:auto;max-width:200px;object-fit:contain;display:block}@media(max-width:640px){.wordit-logo{height:32px;max-width:150px}}@media(min-resolution:2dppx){.wordit-logo{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}.auth-menu{flex-shrink:0}.user-menu{display:flex;align-items:center;gap:var(--space-3)}.user-avatar{width:32px;height:32px;border-radius:var(--radius-full);object-fit:cover}.user-name{font-size:var(--text-sm);color:var(--color-text-secondary)}.login-buttons{display:flex;align-items:center;gap:var(--space-2)}@media(max-width:640px){.header-top{flex-direction:column;align-items:flex-start}.login-buttons{flex-direction:column;width:100%}.login-buttons .btn{width:100%;justify-content:center}}.translate-subtitle{color:var(--color-text-muted);font-size:var(--text-base)}.language-selectors{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--space-4);align-items:end;margin-bottom:var(--space-6)}@media(max-width:640px){.language-selectors{grid-template-columns:1fr}}.language-selector{display:flex;flex-direction:column;gap:var(--space-2)}.language-swap-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);color:var(--color-text-secondary);margin-bottom:2px}.language-swap-btn:hover{background:var(--color-bg-elevated);border-color:var(--color-accent-primary);color:var(--color-accent-primary)}@media(max-width:640px){.language-swap-btn{width:100%;border-radius:var(--radius-lg);height:auto;padding:var(--space-3)}}.text-area-wrapper{margin-bottom:var(--space-6)}.translate-textarea{width:100%;min-height:150px;padding:var(--space-4);font-family:var(--font-sans);font-size:var(--text-lg);line-height:var(--leading-relaxed);color:var(--color-text-primary);background:var(--color-bg-tertiary);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);resize:vertical;outline:none;transition:all var(--transition-fast)}.translate-textarea:focus{border-color:var(--color-accent-primary);box-shadow:var(--shadow-glow-sm)}.translate-textarea::placeholder{color:var(--color-text-muted)}.char-count{text-align:right;font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-2)}.translate-btn{width:100%;padding:var(--space-4) var(--space-6);font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--font-semibold);color:#fff;background:linear-gradient(135deg,var(--color-accent-primary) 0%,var(--color-accent-tertiary) 100%);border:none;border-radius:var(--radius-xl);cursor:pointer;transition:all var(--transition-normal);box-shadow:var(--shadow-glow-sm);display:flex;align-items:center;justify-content:center;gap:var(--space-2)}.translate-btn:hover:not(:disabled){box-shadow:var(--shadow-glow);transform:translateY(-2px)}.translate-btn:active:not(:disabled){transform:translateY(0)}.translate-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.result-area{margin-top:var(--space-8);padding-top:var(--space-8);border-top:1px solid var(--color-border-default)}.result-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.result-label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide)}.result-actions{display:flex;gap:var(--space-2)}.result-text{font-size:var(--text-xl);line-height:var(--leading-relaxed);color:var(--color-text-primary);padding:var(--space-4);background:var(--color-bg-tertiary);border-radius:var(--radius-xl);min-height:100px}.result-placeholder{display:flex;align-items:center;justify-content:center;min-height:100px;color:var(--color-text-muted);font-style:italic}.insights-section{margin-top:var(--space-6)}.insight-card{background:var(--color-glass-bg);border:1px solid var(--color-glass-border);border-radius:var(--radius-xl);padding:var(--space-4);margin-bottom:var(--space-3);transition:all var(--transition-fast)}.insight-card:hover{background:var(--color-glass-bg-hover);border-color:var(--color-border-emphasized)}.insight-header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2)}.insight-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:#8b5cf626;border-radius:var(--radius-md);color:var(--color-accent-primary);font-size:var(--text-sm)}.insight-title{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary)}.insight-content{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.search-wrapper{position:relative}.search-input{width:100%;padding:var(--space-3) var(--space-4);padding-left:var(--space-10);font-family:var(--font-sans);font-size:var(--text-base);color:var(--color-text-primary);background:var(--color-bg-tertiary);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);outline:none;transition:all var(--transition-fast)}.search-input:focus{border-color:var(--color-accent-primary);box-shadow:var(--shadow-glow-sm)}.search-icon{position:absolute;left:var(--space-4);top:50%;transform:translateY(-50%);color:var(--color-text-muted);pointer-events:none}.search-results{position:absolute;top:calc(100% + var(--space-2));left:0;right:0;background:var(--color-bg-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);max-height:300px;overflow-y:auto;z-index:var(--z-dropdown)}.search-result-item{padding:var(--space-3) var(--space-4);cursor:pointer;transition:background var(--transition-fast);border-bottom:1px solid var(--color-border-subtle)}.search-result-item:last-child{border-bottom:none}.search-result-item:hover,.search-result-item.active{background:var(--color-glass-bg-hover)}.search-result-word{font-weight:var(--font-medium);color:var(--color-text-primary)}.search-result-hint{font-size:var(--text-sm);color:var(--color-text-muted)}.history-section{margin-top:var(--space-8)}.history-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:var(--color-glass-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);margin-bottom:var(--space-2);cursor:pointer;transition:all var(--transition-fast)}.history-item:hover{background:var(--color-glass-bg-hover);border-color:var(--color-border-emphasized)}.history-text{display:flex;flex-direction:column;gap:var(--space-1)}.history-original{font-weight:var(--font-medium);color:var(--color-text-primary)}.history-translated{font-size:var(--text-sm);color:var(--color-text-secondary)}.history-meta{font-size:var(--text-xs);color:var(--color-text-muted)}.history-chips{display:flex;flex-wrap:wrap;gap:6px;max-height:calc(3 * (var(--space-8) + 6px));overflow:hidden;width:100%}.history-chip{display:inline-flex;align-items:center;gap:6px;padding:1px 8px;background:var(--color-glass-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;font-size:var(--text-sm);line-height:1.5}.history-chip:hover{background:var(--color-glass-bg-hover);border-color:var(--color-border-emphasized);transform:translateY(-1px)}.history-chip-text{font-weight:var(--font-medium);color:var(--color-text-primary)}.history-chip-lang{font-size:var(--text-xs);color:var(--color-text-muted);padding:1px;background:var(--color-bg-tertiary);border-radius:var(--radius-sm)}.loading-dots{display:inline-flex;gap:var(--space-1)}.loading-dots span{width:6px;height:6px;background:var(--color-accent-primary);border-radius:50%;animation:bounce 1.4s infinite ease-in-out both}.loading-dots span:nth-child(1){animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.streaming-text:after{content:"▋";animation:blink 1s infinite;color:var(--color-accent-primary)}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.toast-container{position:fixed;bottom:var(--space-6);right:var(--space-6);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--space-3)}.toast{padding:var(--space-4) var(--space-6);background:var(--color-bg-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);display:flex;align-items:center;gap:var(--space-3);animation:slide-in .3s ease}@keyframes slide-in{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.toast-success{border-left:3px solid var(--color-success)}.toast-error{border-left:3px solid var(--color-error)}.toast-info{border-left:3px solid var(--color-info)}.audio-button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);color:var(--color-text-secondary);font-size:var(--text-base)}.audio-button:hover{background:var(--color-bg-elevated);border-color:var(--color-accent-primary);color:var(--color-accent-primary);transform:scale(1.05)}.audio-button:active{transform:scale(.95)}.audio-button-playing{border-color:var(--color-accent-primary);color:var(--color-accent-primary);background:#8b5cf61a}.audio-icon{display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.audio-button-playing .audio-icon{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.result-text-with-audio{display:flex;align-items:flex-start;gap:var(--space-3)}.result-text-content{flex:1}