:root{--bg-primary:#f8fafc;--bg-secondary:#fff;--bg-glass:#ffffffb3;--border-color:#00000014;--border-glass:#fff6;--text-main:#0f172a;--text-muted:#64748b;--text-inverse:#fff;--accent-color:#6366f1;--accent-hover:#4f46e5;--accent-glow:#6366f126;--success:#10b981;--success-glow:#10b9811a;--danger:#ef4444;--danger-glow:#ef44441a;--warning:#f59e0b;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000000d;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--font-sans:"Plus Jakarta Sans", "Outfit", sans-serif;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1)}[data-theme=dark]{--bg-primary:#0b0f19;--bg-secondary:#111827;--bg-glass:#111827b3;--border-color:#ffffff0f;--border-glass:#ffffff08;--text-main:#f3f4f6;--text-muted:#9ca3af;--text-inverse:#0b0f19;--accent-color:#818cf8;--accent-hover:#6366f1;--accent-glow:#818cf826;--shadow-sm:0 1px 2px 0 #00000080;--shadow-md:0 4px 6px -1px #0000004d, 0 2px 4px -1px #0003;--shadow-lg:0 10px 15px -3px #0006, 0 4px 6px -4px #0000004d}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-main);font-family:var(--font-sans);min-height:100vh;transition:background-color .3s,color .3s;overflow-x:hidden}.app-container{flex-direction:column;max-width:1400px;min-height:100vh;margin:0 auto;padding:0 24px;display:flex}.navbar{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:20px 0;display:flex}.logo{color:var(--accent-color);letter-spacing:-.5px;align-items:center;gap:8px;font-size:24px;font-weight:700;text-decoration:none;display:flex}.logo span{color:var(--text-main)}.nav-links{align-items:center;gap:16px;list-style:none;display:flex}.nav-link{color:var(--text-muted);border-radius:var(--radius-sm);transition:var(--transition-smooth);padding:8px 16px;font-size:14px;font-weight:500;text-decoration:none}.nav-link:hover,.nav-link.active{color:var(--text-main);background-color:var(--border-color)}.btn-accent{border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-smooth);padding:8px 20px;font-weight:700;box-shadow:0 4px 14px #6366f140;color:#fff!important;background-color:#6366f1!important;border:1px solid #4f46e5!important}.btn-accent:hover{box-shadow:0 0 15px var(--accent-glow);color:#fff!important;background-color:#4f46e5!important}.btn-outline.btn-accent{color:#fff!important;background-color:#6366f1!important;border-color:#4f46e5!important}::selection{color:#fff!important;text-shadow:none!important;background-color:#6366f1!important}::selection{color:#fff!important;text-shadow:none!important;background-color:#6366f1!important}[data-theme=dark] ::selection{color:#fff!important;background-color:#818cf8!important}.tab-btn{border:1px solid var(--border-color);background-color:var(--bg-secondary);color:var(--text-muted);cursor:pointer;transition:var(--transition-smooth);border-radius:12px 12px 0 0;padding:10px 20px;font-size:14px;font-weight:600}.tab-btn:hover{color:var(--text-main);background-color:var(--bg-primary)}.tab-btn.active{color:#fff!important;background-color:#6366f1!important;border-color:#4f46e5!important;font-weight:800!important;box-shadow:0 4px 14px #6366f159!important}.btn-outline{color:var(--text-main);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-smooth);background:0 0;padding:8px 20px;font-weight:500}.btn-outline:hover{background-color:var(--border-color)}.theme-toggle{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:var(--transition-smooth);background:0 0;border:none;justify-content:center;align-items:center;padding:8px;display:flex}.theme-toggle:hover{color:var(--text-main);background-color:var(--border-color)}.main-content{flex:1;padding:40px 0}.footer{text-align:center;color:var(--text-muted);border-top:1px solid var(--border-color);margin-top:auto;padding:30px 0;font-size:14px}.hero-section{text-align:center;margin-bottom:48px}.hero-title{letter-spacing:-1px;margin-bottom:12px;font-size:36px;font-weight:800}.hero-subtitle{color:var(--text-muted);max-width:600px;margin:0 auto;font-size:16px}.search-container{max-width:500px;margin:24px auto 0;position:relative}.search-input{border-radius:var(--radius-md);border:1px solid var(--border-color);background-color:var(--bg-secondary);width:100%;color:var(--text-main);transition:var(--transition-smooth);outline:none;padding:14px 20px;font-size:16px}.search-input:focus{border-color:var(--accent-color);box-shadow:0 0 10px var(--accent-glow)}.tools-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-top:40px;display:grid}.tool-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;color:inherit;transition:var(--transition-smooth);padding:24px;text-decoration:none;position:relative;overflow:hidden}.tool-card:hover{border-color:var(--accent-color);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.tool-icon-wrapper{border-radius:var(--radius-sm);background-color:var(--accent-glow);width:48px;height:48px;color:var(--accent-color);justify-content:center;align-items:center;margin-bottom:16px;font-size:20px;display:flex}.tool-name{margin-bottom:8px;font-size:18px;font-weight:700}.tool-desc{color:var(--text-muted);font-size:14px;line-height:1.5}.tool-view{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:32px}.tool-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.tool-title{align-items:center;gap:12px;font-size:28px;font-weight:700;display:flex}.tool-workspace{flex-direction:column;gap:20px;display:flex}.workspace-panels{grid-template-columns:1fr;gap:20px;display:grid}@media (width>=768px){.workspace-panels.split{grid-template-columns:1fr 1fr}}.panel{flex-direction:column;gap:8px;display:flex}.panel-label{color:var(--text-muted);justify-content:space-between;align-items:center;font-size:14px;font-weight:600;display:flex}.text-area{border-radius:var(--radius-md);border:1px solid var(--border-color);background-color:var(--bg-primary);width:100%;height:250px;color:var(--text-main);resize:vertical;transition:var(--transition-smooth);outline:none;padding:16px;font-family:inherit;font-size:16px}.text-area:focus{border-color:var(--accent-color);background-color:var(--bg-secondary)}.options-bar{background-color:var(--bg-primary);border-radius:var(--radius-md);border:1px solid var(--border-color);flex-wrap:wrap;gap:12px;padding:16px;display:flex}.options-group{align-items:center;gap:8px;display:flex}.option-select{border-radius:var(--radius-sm);border:1px solid var(--border-color);background-color:var(--bg-secondary);color:var(--text-main);cursor:pointer;outline:none;padding:8px 12px;font-size:14px}.action-buttons{justify-content:flex-end;gap:12px;display:flex}.auth-container{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);max-width:450px;box-shadow:var(--shadow-md);margin:40px auto;padding:40px}.auth-header{text-align:center;margin-bottom:30px}.auth-title{margin-bottom:8px;font-size:24px;font-weight:700}.auth-subtitle{color:var(--text-muted);font-size:14px}.form-group{margin-bottom:20px}.form-label{color:var(--text-muted);margin-bottom:8px;font-size:14px;font-weight:600;display:block}.form-input{border-radius:var(--radius-sm);border:1px solid var(--border-color);background-color:var(--bg-primary);width:100%;color:var(--text-main);transition:var(--transition-smooth);outline:none;padding:12px 16px;font-size:15px}.form-input:focus{border-color:var(--accent-color);background-color:var(--bg-secondary)}.form-error{color:var(--danger);margin-top:4px;font-size:12px}.btn-full{width:100%;margin-top:10px;padding:12px;font-size:15px}.auth-footer{text-align:center;color:var(--text-muted);margin-top:20px;font-size:14px}.auth-link{color:var(--accent-color);font-weight:600;text-decoration:none}.auth-link:hover{text-decoration:underline}.history-item{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);transition:var(--transition-smooth);justify-content:space-between;align-items:flex-start;margin-bottom:16px;padding:20px;display:flex}.history-item:hover{box-shadow:var(--shadow-sm);border-color:var(--accent-color)}.history-details{flex:1}.history-meta{color:var(--text-muted);gap:12px;margin-bottom:8px;font-size:12px;display:flex}.history-tool-badge{background-color:var(--accent-glow);color:var(--accent-color);border-radius:var(--radius-full);text-transform:uppercase;padding:2px 8px;font-weight:600}.history-title-text{margin-bottom:6px;font-size:16px;font-weight:700}.history-snippet{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;max-width:500px;font-size:14px;overflow:hidden}.history-actions{gap:8px;display:flex}.toast{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-left:4px solid var(--success);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);z-index:1000;opacity:0;align-items:center;gap:12px;padding:16px 24px;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),opacity .3s;display:flex;position:fixed;bottom:24px;right:24px;transform:translateY(100px)}.toast.show{opacity:1;transform:translateY(0)}.toast.error{border-left-color:var(--danger)}.stats-badge{background-color:var(--border-color);border-radius:var(--radius-full);padding:2px 8px;font-size:12px;font-weight:600}.stats-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}@media (width>=768px){.stats-grid{grid-template-columns:repeat(4,1fr)}}.stat-card{background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);text-align:center;padding:16px}.stat-value{color:var(--accent-color);margin-bottom:4px;font-size:24px;font-weight:700}.stat-label{color:var(--text-muted);text-transform:uppercase;font-size:12px;font-weight:600}.diff-container{white-space:pre-wrap;background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);height:250px;padding:16px;font-family:monospace;font-size:14px;line-height:1.5;overflow-y:auto}.diff-line{border-radius:4px;padding:2px 4px;display:block}.diff-line.added{background-color:var(--success-glow);color:#059669}.diff-line.removed{background-color:var(--danger-glow);color:#dc2626}