*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;line-height:1.6;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-weight:400;color:var(--text-primary, #0f172a);background-color:var(--bg-primary, #ffffff);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;margin-bottom:.5rem;color:var(--text-primary, #0f172a)}h1{font-size:2.5rem;font-weight:700}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:1.25rem}h5{font-size:1.125rem}h6{font-size:1rem}p{margin-bottom:1rem;line-height:1.6}a{color:var(--accent, #3b82f6);text-decoration:none;transition:color .2s ease}a:hover{color:var(--accent-hover, #2563eb);text-decoration:underline}a:focus{outline:2px solid var(--accent, #3b82f6);outline-offset:2px;border-radius:2px}ul,ol{margin-bottom:1rem;padding-left:1.5rem}li{margin-bottom:.25rem}code,pre{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,Courier New,monospace;font-size:.875rem}code{background-color:var(--bg-tertiary, #f1f5f9);padding:.125rem .25rem;border-radius:.25rem;color:var(--text-primary, #0f172a)}pre{background-color:var(--bg-tertiary, #f1f5f9);padding:1rem;border-radius:.5rem;overflow-x:auto;margin-bottom:1rem}pre code{background:none;padding:0;border-radius:0}input,textarea,select,button{font-family:inherit;font-size:1rem;line-height:1.5}input,textarea,select{background-color:var(--bg-primary, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:.375rem;padding:.5rem .75rem;color:var(--text-primary, #0f172a);transition:border-color .2s ease,box-shadow .2s ease}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent, #3b82f6);box-shadow:0 0 0 3px #3b82f61a}input::placeholder,textarea::placeholder{color:var(--text-secondary, #64748b)}button{background-color:var(--accent, #3b82f6);color:#fff;border:none;border-radius:.375rem;padding:.5rem 1rem;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease}button:hover{background-color:var(--accent-hover, #2563eb)}button:active{transform:translateY(1px)}button:focus{outline:none;box-shadow:0 0 0 3px #3b82f61a}button:disabled{background-color:var(--text-secondary, #64748b);cursor:not-allowed;transform:none}img{max-width:100%;height:auto;display:block}table{width:100%;border-collapse:collapse;margin-bottom:1rem}th,td{text-align:left;padding:.75rem;border-bottom:1px solid var(--border, #e2e8f0)}th{font-weight:600;background-color:var(--bg-tertiary, #f1f5f9)}hr{border:none;border-top:1px solid var(--border, #e2e8f0);margin:2rem 0}::selection{background-color:var(--accent, #3b82f6);color:#fff}:focus-visible{outline:2px solid var(--accent, #3b82f6);outline-offset:2px;border-radius:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary, #f8fafc)}::-webkit-scrollbar-thumb{background:var(--text-secondary, #64748b);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-primary, #0f172a)}.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-to-content{position:absolute;top:-40px;left:0;background:var(--accent, #3b82f6);color:#fff;padding:8px;text-decoration:none;border-radius:0 0 4px;z-index:100}.skip-to-content:focus{top:0}.loading{position:relative;overflow:hidden}.loading:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:loading 1.5s infinite}@keyframes loading{0%{left:-100%}to{left:100%}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.hidden{display:none}.visible{display:block}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.cursor-pointer{cursor:pointer}.cursor-not-allowed{cursor:not-allowed}.transition-all{transition:all .2s ease}.transition-opacity{transition:opacity .2s ease}.transition-transform{transition:transform .2s ease}:root{--bg-primary: #ffffff;--bg-secondary: #fafbfc;--bg-tertiary: #f3f4f6;--bg-card: #ffffff;--bg-overlay: rgba(255, 255, 255, .95);--bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--text-primary: #1a202c;--text-secondary: #4a5568;--text-muted: #718096;--text-inverse: #ffffff;--text-accent: #667eea;--accent: #667eea;--accent-hover: #5a67d8;--accent-light: #e9d8fd;--accent-dark: #553c9a;--accent-secondary: #f687b3;--border: #e2e8f0;--border-light: #f7fafc;--border-dark: #cbd5e0;--border-accent: #667eea;--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1);--shadow: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .1);--shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, .15);--shadow-2xl: 0 35px 60px -15px rgba(0, 0, 0, .2);--shadow-colored: 0 10px 25px -3px rgba(102, 126, 234, .15);--success: #10b981;--success-light: #d1fae5;--success-dark: #047857;--error: #ef4444;--error-light: #fee2e2;--error-dark: #dc2626;--warning: #f59e0b;--warning-light: #fef3c7;--warning-dark: #d97706;--info: #3b82f6;--info-light: #dbeafe;--info-dark: #1e40af;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-full: 9999px;--transition-fast: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--z-dropdown: 1000;--z-modal: 1001;--z-tooltip: 1002;--z-toast: 1003}[data-theme=dark]{--bg-primary: #0f0f23;--bg-secondary: #1a1a2e;--bg-tertiary: #16213e;--bg-card: #1a1a2e;--bg-overlay: rgba(26, 26, 46, .95);--bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--text-primary: #f7fafc;--text-secondary: #e2e8f0;--text-muted: #a0aec0;--text-inverse: #0f0f23;--text-accent: #a78bfa;--accent: #667eea;--accent-hover: #7c3aed;--accent-light: #4c1d95;--accent-dark: #a78bfa;--accent-secondary: #f472b6;--border: #2d3748;--border-light: #1a202c;--border-dark: #4a5568;--border-accent: #667eea;--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .3);--shadow: 0 4px 6px -1px rgba(0, 0, 0, .3);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .3);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .3);--shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, .4);--shadow-2xl: 0 35px 60px -15px rgba(0, 0, 0, .5);--shadow-colored: 0 10px 25px -3px rgba(102, 126, 234, .25);--success: #10b981;--success-light: #064e3b;--success-dark: #34d399;--error: #ef4444;--error-light: #7f1d1d;--error-dark: #f87171;--warning: #f59e0b;--warning-light: #78350f;--warning-dark: #fbbf24;--info: #3b82f6;--info-light: #1e3a8a;--info-dark: #60a5fa}*{transition:background-color var(--transition-normal),color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal)}[data-theme=dark] ::-webkit-scrollbar-track{background:var(--bg-secondary, #1a1a1a)}[data-theme=dark] ::-webkit-scrollbar-thumb{background:var(--text-secondary, #b0b0b0)}[data-theme=dark] ::-webkit-scrollbar-thumb:hover{background:var(--text-primary, #ffffff)}.theme-toggle{background:var(--bg-secondary, #f8fafc);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-full, 9999px);padding:.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;transition:all var(--transition-normal)}.theme-toggle:hover{background:var(--bg-tertiary, #f1f5f9);border-color:var(--accent, #3b82f6)}.theme-toggle:focus{outline:none;box-shadow:0 0 0 3px #3b82f61a}.theme-toggle svg{width:1.25rem;height:1.25rem;color:var(--text-primary, #0f172a)}.theme-icon-sun,.theme-icon-moon{transition:opacity var(--transition-normal),transform var(--transition-normal)}[data-theme=dark] .theme-icon-sun{opacity:0;transform:scale(.8)}[data-theme=dark] .theme-icon-moon,[data-theme=light] .theme-icon-sun{opacity:1;transform:scale(1)}[data-theme=light] .theme-icon-moon{opacity:0;transform:scale(.8)}@media (prefers-color-scheme: dark){:root:not([data-theme]){--bg-primary: #0a0a0a;--bg-secondary: #1a1a1a;--bg-tertiary: #2a2a2a;--bg-overlay: rgba(26, 26, 26, .9);--text-primary: #ffffff;--text-secondary: #b0b0b0;--text-muted: #808080;--text-inverse: #0a0a0a;--border: #3a3a3a;--border-light: #2a2a2a;--border-dark: #4a4a4a;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow: 0 4px 6px -1px rgba(0, 0, 0, .3);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .3);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .3);--shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, .5)}}@media print{:root{--bg-primary: white;--bg-secondary: white;--bg-tertiary: #f8f9fa;--text-primary: black;--text-secondary: #495057;--border: #dee2e6;--shadow: none}.theme-toggle{display:none}}@media (prefers-contrast: high){:root{--text-primary: black;--text-secondary: black;--accent: #0066cc;--border: black}[data-theme=dark]{--text-primary: white;--text-secondary: white;--accent: #4da3ff;--border: white}}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}.header{background:var(--bg-card, #ffffff);border-bottom:1px solid var(--border, #e2e8f0);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;z-index:1000!important;transition:all var(--transition-normal)}.nav{display:flex;align-items:center}.hamburger{display:block;width:20px;height:2px;background:var(--text-primary, #0f172a);margin:3px 0;transition:all var(--transition-normal)}.mobile-menu-toggle.active .hamburger:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.mobile-menu-toggle.active .hamburger:nth-child(2){opacity:0}.mobile-menu-toggle.active .hamburger:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}@media (max-width: 768px){.header-container{height:60px}.nav{position:fixed;top:60px;left:0;right:0;background:var(--bg-card, #ffffff);border-bottom:1px solid var(--border, #e2e8f0);transform:translateY(-100%);opacity:0;visibility:hidden;transition:all var(--transition-normal);z-index:999}.nav-list{flex-direction:column;padding:1rem;gap:.25rem}.nav-link{padding:.75rem 1rem;width:100%;justify-content:center}.nav.active{transform:translateY(0);opacity:1;visibility:visible}.logo-text{font-size:1rem}.logo-img{width:32px;height:32px}}.language-selector{position:absolute;z-index:1001}.language-dropdown{background:var(--bg-card, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem);box-shadow:var(--shadow-lg, 0 20px 25px -5px rgba(0, 0, 0, .1));padding:.5rem;min-width:150px}.lang-option{display:block;width:100%;padding:.5rem .75rem;border:none;background:none;color:var(--text-primary, #0f172a);text-align:left;border-radius:var(--radius-sm, .25rem);cursor:pointer;transition:all var(--transition-normal);font-size:.875rem}.lang-option:hover{background:var(--bg-secondary, #f8fafc);color:var(--text-accent, #667eea)}.lang-option.active{background:var(--bg-tertiary, #f1f5f9);color:var(--text-accent, #667eea);font-weight:500}body{padding-top:70px}@media (max-width: 768px){body{padding-top:60px}}.footer{background:var(--bg-card, #ffffff);border-top:1px solid var(--border, #e2e8f0);padding:3rem 0 1rem;margin-top:auto}.footer-container{max-width:1200px;margin:0 auto;padding:0 1rem}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:2rem}.footer-section h3{font-size:1.125rem;font-weight:600;color:var(--text-primary, #0f172a);margin-bottom:1rem;background:var(--bg-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.footer-section p{color:var(--text-secondary, #64748b);line-height:1.6;margin-bottom:1rem}.footer-links{list-style:none;padding:0;margin:0}.footer-links li{margin-bottom:.5rem}.footer-links a{color:var(--text-secondary, #64748b);text-decoration:none;transition:color var(--transition-normal);display:inline-flex;align-items:center;gap:.5rem}.footer-links a:hover{color:var(--accent, #667eea);transform:translate(2px)}.footer-bottom{border-top:1px solid var(--border-light, #f1f5f9);padding-top:1rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.footer-copyright{color:var(--text-secondary, #64748b);font-size:.875rem}.footer-social{display:flex;gap:1rem}.social-link{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:var(--bg-secondary, #f8fafc);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-full, 9999px);color:var(--text-secondary, #64748b);text-decoration:none;transition:all var(--transition-normal)}.social-link:hover{background:var(--bg-gradient);color:var(--text-inverse);border-color:var(--accent, #667eea);transform:translateY(-2px)}.tool-links{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.tool-links a{padding:.25rem .5rem;border-radius:var(--radius-md, .375rem);transition:all var(--transition-normal);font-size:.875rem}.tool-links a:hover{background:var(--bg-secondary, #f8fafc);color:var(--accent, #667eea)}.contact-info{display:flex;flex-direction:column;gap:.5rem}.contact-item{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary, #64748b);font-size:.875rem}.contact-item strong{color:var(--text-primary, #0f172a)}@media (max-width: 768px){.footer{padding:2rem 0 1rem}.footer-content{grid-template-columns:1fr;gap:1.5rem}.footer-bottom{flex-direction:column;text-align:center;gap:1rem}.tool-links{grid-template-columns:1fr}.footer-social{justify-content:center}}[data-theme=dark] .footer{background:var(--bg-card, #1a1a2e);border-top-color:var(--border, #2d3748)}[data-theme=dark] .footer-bottom{border-top-color:var(--border-light, #1a202c)}.footer-section{animation:fadeInUp .6s ease forwards}.footer-section:nth-child(1){animation-delay:.1s}.footer-section:nth-child(2){animation-delay:.2s}.footer-section:nth-child(3){animation-delay:.3s}.footer-section:nth-child(4){animation-delay:.4s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border-radius:var(--radius-lg, .5rem);font-weight:600;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:all var(--transition-normal);white-space:nowrap;gap:.5rem;position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.btn:hover:before{left:100%}.btn:focus{outline:none;box-shadow:0 0 0 3px #3b82f61a}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-sm{padding:.25rem .75rem;font-size:.875rem}.btn-lg{padding:.75rem 1.5rem;font-size:1.125rem}.btn-primary{background-color:var(--accent, #3b82f6);color:#fff;border-color:var(--accent, #3b82f6)}.btn-primary:hover{background-color:var(--accent-hover, #2563eb);border-color:var(--accent-hover, #2563eb)}.btn-secondary{background-color:var(--bg-secondary, #f8fafc);color:var(--text-primary, #0f172a);border-color:var(--border, #e2e8f0)}.btn-secondary:hover{background-color:var(--bg-tertiary, #f1f5f9);border-color:var(--border-dark, #cbd5e1)}.btn-outline{background-color:transparent;color:var(--accent, #3b82f6);border-color:var(--accent, #3b82f6)}.btn-outline:hover{background-color:var(--accent, #3b82f6);color:#fff}.btn-ghost{background-color:transparent;color:var(--text-primary, #0f172a);border-color:transparent}.btn-ghost:hover{background-color:var(--bg-secondary, #f8fafc);color:var(--text-primary, #0f172a)}.btn-success{background-color:var(--success, #10b981);color:#fff;border-color:var(--success, #10b981)}.btn-success:hover{background-color:var(--success-dark, #047857);border-color:var(--success-dark, #047857)}.btn-error{background-color:var(--error, #ef4444);color:#fff;border-color:var(--error, #ef4444)}.btn-error:hover{background-color:var(--error-dark, #dc2626);border-color:var(--error-dark, #dc2626)}.btn-icon{padding:.5rem;border-radius:var(--radius-md, .375rem);min-width:2rem;min-height:2rem}.card{background-color:var(--bg-card, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-xl, .75rem);box-shadow:var(--shadow-sm, 0 1px 3px 0 rgba(0, 0, 0, .1));overflow:hidden;transition:all var(--transition-normal);position:relative}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--bg-gradient);transform:scaleX(0);transition:transform var(--transition-normal)}.card:hover{box-shadow:var(--shadow-lg, 0 20px 25px -5px rgba(0, 0, 0, .1));transform:translateY(-2px)}.card:hover:before{transform:scaleX(1)}.card-header{padding:1.5rem;border-bottom:1px solid var(--border, #e2e8f0)}.card-body{padding:1.5rem}.card-footer{padding:1.5rem;border-top:1px solid var(--border, #e2e8f0);background-color:var(--bg-secondary, #f8fafc)}.card-title{font-size:1.25rem;font-weight:600;color:var(--text-primary, #0f172a);margin:0}.card-subtitle{color:var(--text-secondary, #64748b);font-size:.875rem;margin-top:.25rem}.badge{display:inline-flex;align-items:center;padding:.25rem .5rem;border-radius:var(--radius-full, 9999px);font-size:.75rem;font-weight:500;gap:.25rem}.badge-primary{background-color:var(--accent-light, #dbeafe);color:var(--accent-dark, #1e40af)}.badge-secondary{background-color:var(--bg-tertiary, #f1f5f9);color:var(--text-secondary, #64748b)}.badge-success{background-color:var(--success-light, #d1fae5);color:var(--success-dark, #047857)}.badge-error{background-color:var(--error-light, #fee2e2);color:var(--error-dark, #dc2626)}.badge-warning{background-color:var(--warning-light, #fef3c7);color:var(--warning-dark, #d97706)}.alert{padding:1rem;border-radius:var(--radius-md, .375rem);border:1px solid;display:flex;align-items:center;gap:.75rem}.alert-icon{font-size:1.25rem;flex-shrink:0}.alert-content{flex:1}.alert-title{font-weight:600;margin-bottom:.25rem}.alert-message{font-size:.875rem;color:var(--text-secondary, #64748b)}.alert-success{background-color:var(--success-light, #d1fae5);border-color:var(--success, #10b981);color:var(--success-dark, #047857)}.alert-error{background-color:var(--error-light, #fee2e2);border-color:var(--error, #ef4444);color:var(--error-dark, #dc2626)}.alert-warning{background-color:var(--warning-light, #fef3c7);border-color:var(--warning, #f59e0b);color:var(--warning-dark, #d97706)}.alert-info{background-color:var(--info-light, #dbeafe);border-color:var(--info, #3b82f6);color:var(--info-dark, #1e40af)}.progress{width:100%;height:.5rem;background-color:var(--bg-tertiary, #f1f5f9);border-radius:var(--radius-full, 9999px);overflow:hidden}.progress-bar{height:100%;background-color:var(--accent, #3b82f6);border-radius:var(--radius-full, 9999px);transition:width var(--transition-normal)}.progress-bar-success{background-color:var(--success, #10b981)}.progress-bar-error{background-color:var(--error, #ef4444)}.progress-bar-warning{background-color:var(--warning, #f59e0b)}.spinner{width:1.5rem;height:1.5rem;border:2px solid var(--bg-tertiary, #f1f5f9);border-top-color:var(--accent, #3b82f6);border-radius:50%;animation:spin .8s linear infinite}.spinner-sm{width:1rem;height:1rem;border-width:1px}.spinner-lg{width:2rem;height:2rem;border-width:3px}@keyframes spin{to{transform:rotate(360deg)}}.tooltip{position:relative;display:inline-block}.tooltip-content{position:absolute;bottom:125%;left:50%;transform:translate(-50%);background-color:var(--bg-secondary, #f8fafc);color:var(--text-primary, #0f172a);padding:.5rem .75rem;border-radius:var(--radius-md, .375rem);font-size:.875rem;white-space:nowrap;border:1px solid var(--border, #e2e8f0);box-shadow:var(--shadow-md, 0 10px 15px -3px rgba(0, 0, 0, .1));opacity:0;visibility:hidden;transition:opacity var(--transition-normal),visibility var(--transition-normal);z-index:var(--z-tooltip, 1002)}.tooltip-content:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:var(--border, #e2e8f0)}.tooltip:hover .tooltip-content{opacity:1;visibility:visible}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal, 1001);opacity:0;visibility:hidden;transition:opacity var(--transition-normal),visibility var(--transition-normal)}.modal.active{opacity:1;visibility:visible}.modal-content{background-color:var(--bg-primary, #ffffff);border-radius:var(--radius-lg, .5rem);max-width:90%;max-height:90%;overflow:auto;box-shadow:var(--shadow-xl, 0 25px 50px -12px rgba(0, 0, 0, .25));transform:scale(.9);transition:transform var(--transition-normal)}.modal.active .modal-content{transform:scale(1)}.modal-header{padding:1.5rem;border-bottom:1px solid var(--border, #e2e8f0);display:flex;align-items:center;justify-content:space-between}.modal-body{padding:1.5rem}.modal-footer{padding:1.5rem;border-top:1px solid var(--border, #e2e8f0);display:flex;align-items:center;justify-content:flex-end;gap:.75rem}.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-secondary, #64748b);padding:.25rem;border-radius:var(--radius-md, .375rem);transition:all var(--transition-normal)}.modal-close:hover{background-color:var(--bg-tertiary, #f1f5f9);color:var(--text-primary, #0f172a)}.dropdown{position:relative;display:inline-block}.dropdown-menu{position:absolute;top:100%;left:0;background-color:var(--bg-primary, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem);box-shadow:var(--shadow-lg, 0 20px 25px -5px rgba(0, 0, 0, .1));min-width:200px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity var(--transition-normal),visibility var(--transition-normal),transform var(--transition-normal);z-index:var(--z-dropdown, 1000)}.dropdown.active .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{display:block;padding:.5rem 1rem;color:var(--text-primary, #0f172a);text-decoration:none;transition:background-color var(--transition-normal)}.dropdown-item:hover{background-color:var(--bg-secondary, #f8fafc)}.dropdown-item:first-child{border-radius:var(--radius-md, .375rem) var(--radius-md, .375rem) 0 0}.dropdown-item:last-child{border-radius:0 0 var(--radius-md, .375rem) var(--radius-md, .375rem)}.toast-container{position:fixed;top:1rem;right:1rem;z-index:var(--z-toast, 1003);display:flex;flex-direction:column;gap:.5rem;max-width:400px}.toast{background-color:var(--bg-primary, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem);padding:1rem;display:flex;align-items:center;gap:.75rem;box-shadow:var(--shadow-lg, 0 20px 25px -5px rgba(0, 0, 0, .1));transform:translate(100%);transition:transform var(--transition-normal)}.toast.show{transform:translate(0)}.toast-icon{font-size:1.25rem;flex-shrink:0}.toast-content{flex:1;font-size:.875rem;color:var(--text-primary, #0f172a)}.toast-close{background:none;border:none;font-size:1.25rem;cursor:pointer;color:var(--text-secondary, #64748b);padding:.25rem;border-radius:var(--radius-md, .375rem);transition:all var(--transition-normal)}.toast-close:hover{background-color:var(--bg-tertiary, #f1f5f9);color:var(--text-primary, #0f172a)}.toast-success{border-color:var(--success, #10b981);background-color:var(--success-light, #d1fae5)}.toast-error{border-color:var(--error, #ef4444);background-color:var(--error-light, #fee2e2)}.toast-warning{border-color:var(--warning, #f59e0b);background-color:var(--warning-light, #fef3c7)}.toast-info{border-color:var(--info, #3b82f6);background-color:var(--info-light, #dbeafe)}.file-drop-zone{border:3px dashed var(--border, #e2e8f0);border-radius:var(--radius-xl, .75rem);padding:3rem 2rem;text-align:center;background:linear-gradient(135deg,var(--bg-secondary, #f8fafc) 0%,var(--bg-primary, #ffffff) 100%);transition:all var(--transition-normal);cursor:pointer;position:relative;overflow:hidden}.file-drop-zone:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--bg-gradient);opacity:0;transition:opacity var(--transition-normal);z-index:0}.file-drop-zone:hover{border-color:var(--accent, #667eea);transform:translateY(-2px);box-shadow:var(--shadow-md, 0 10px 15px -3px rgba(0, 0, 0, .1))}.file-drop-zone:hover:before{opacity:.05}.file-drop-zone.dragging{border-color:var(--accent, #667eea);background:linear-gradient(135deg,var(--accent-light, #e9d8fd) 0%,var(--bg-primary, #ffffff) 100%);transform:scale(1.02);box-shadow:var(--shadow-lg, 0 20px 25px -5px rgba(0, 0, 0, .1))}.file-drop-zone.dragging:before{opacity:.1}.file-drop-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.file-drop-content{pointer-events:none}.file-drop-icon{font-size:3rem;margin-bottom:1rem;color:var(--text-secondary, #64748b)}.file-drop-text{color:var(--text-primary, #0f172a)}.file-drop-main-text{font-size:1.125rem;font-weight:500;margin-bottom:.25rem}.file-drop-sub-text{font-size:.875rem;color:var(--text-secondary, #64748b)}.file-drop-preview{margin-top:1rem;display:flex;justify-content:center}.file-drop-preview-item{display:flex;align-items:center;gap:.75rem;padding:.5rem;background-color:var(--bg-primary, #ffffff);border-radius:var(--radius-md, .375rem);border:1px solid var(--border, #e2e8f0)}.file-drop-preview-item img{width:3rem;height:3rem;object-fit:cover;border-radius:var(--radius-md, .375rem)}.file-drop-preview-info{display:flex;flex-direction:column;gap:.25rem}.file-drop-preview-name{font-size:.875rem;font-weight:500;color:var(--text-primary, #0f172a)}.file-drop-preview-size{font-size:.75rem;color:var(--text-secondary, #64748b)}.tool-container{max-width:1200px;margin:0 auto;padding:2rem 1rem}.tool-header{text-align:center;margin-bottom:3rem}.tool-title{font-size:2.5rem;font-weight:700;color:var(--text-primary, #0f172a);margin-bottom:1rem}.tool-description{font-size:1.125rem;color:var(--text-secondary, #64748b);max-width:600px;margin:0 auto}.tool-layout{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:2rem}@media (max-width: 768px){.tool-layout{grid-template-columns:1fr}}.tool-panel{background-color:var(--bg-card, #ffffff);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-xl, .75rem);padding:2rem;box-shadow:var(--shadow-md, 0 10px 15px -3px rgba(0, 0, 0, .1));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;overflow:hidden}.tool-panel:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--bg-gradient);opacity:.8}.tool-panel-title{font-size:1.5rem;font-weight:700;color:var(--text-primary, #0f172a);margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--border-light, #f1f5f9);position:relative}.tool-panel-title:after{content:"";position:absolute;bottom:-2px;left:0;width:60px;height:2px;background:var(--bg-gradient);border-radius:1px}.form-group{margin-bottom:1.5rem}.form-label{display:block;font-weight:600;color:var(--text-primary, #0f172a);margin-bottom:.75rem;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}.form-control{width:100%;padding:.75rem 1rem;border:2px solid var(--border, #e2e8f0);border-radius:var(--radius-lg, .5rem);font-size:1rem;transition:all var(--transition-normal);background-color:var(--bg-primary, #ffffff)}.form-control:focus{outline:none;border-color:var(--accent, #667eea);box-shadow:0 0 0 4px #667eea1a;transform:translateY(-1px)}.form-control::placeholder{color:var(--text-muted, #94a3b8);font-weight:400}.form-text{font-size:.875rem;color:var(--text-secondary, #64748b);margin-top:.25rem}.range-group{margin-bottom:1.5rem}.range-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.range-title{font-weight:500;color:var(--text-primary, #0f172a)}.range-value{font-size:.875rem;color:var(--text-secondary, #64748b);background-color:var(--bg-secondary, #f8fafc);padding:.25rem .5rem;border-radius:var(--radius-md, .375rem);border:1px solid var(--border, #e2e8f0)}.range-slider{width:100%;height:.375rem;background:var(--bg-tertiary, #f1f5f9);border-radius:var(--radius-full, 9999px);outline:none;-webkit-appearance:none;cursor:pointer}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;width:1.25rem;height:1.25rem;background:var(--accent, #3b82f6);border-radius:50%;cursor:pointer;transition:background-color var(--transition-normal)}.range-slider::-webkit-slider-thumb:hover{background:var(--accent-hover, #2563eb)}.range-slider::-moz-range-thumb{width:1.25rem;height:1.25rem;background:var(--accent, #3b82f6);border-radius:50%;cursor:pointer;border:none;transition:background-color var(--transition-normal)}.range-slider::-moz-range-thumb:hover{background:var(--accent-hover, #2563eb)}.checkbox-group,.radio-group{display:flex;flex-direction:column;gap:.75rem}.checkbox-item,.radio-item{display:flex;align-items:center;gap:.5rem}.checkbox-input,.radio-input{width:1.25rem;height:1.25rem;cursor:pointer}.checkbox-label,.radio-label{cursor:pointer;font-size:.875rem;color:var(--text-primary, #0f172a)}.select-group{margin-bottom:1.5rem}.select-control{width:100%;padding:.5rem 2rem .5rem .75rem;border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem);font-size:1rem;background-color:var(--bg-primary, #ffffff);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;background-size:1rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;transition:border-color var(--transition-normal),box-shadow var(--transition-normal)}.select-control:focus{outline:none;border-color:var(--accent, #3b82f6);box-shadow:0 0 0 3px #3b82f61a}.image-preview{background-color:var(--bg-secondary, #f8fafc);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-lg, .5rem);padding:1rem;display:flex;align-items:center;justify-content:center;min-height:300px;position:relative;overflow:hidden}.image-preview-empty{color:var(--text-secondary, #64748b);font-size:1.125rem;text-align:center}.image-preview img{max-width:100%;max-height:400px;border-radius:var(--radius-md, .375rem);box-shadow:var(--shadow-md, 0 10px 15px -3px rgba(0, 0, 0, .1))}.image-preview canvas{max-width:100%;max-height:400px;border-radius:var(--radius-md, .375rem);box-shadow:var(--shadow-md, 0 10px 15px -3px rgba(0, 0, 0, .1))}.image-preview-loading{display:flex;flex-direction:column;align-items:center;gap:1rem}.image-preview-info{position:absolute;bottom:1rem;left:1rem;background-color:var(--bg-overlay, rgba(255, 255, 255, .9));padding:.5rem .75rem;border-radius:var(--radius-md, .375rem);font-size:.875rem;color:var(--text-primary, #0f172a);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tool-actions{display:flex;gap:1rem;justify-content:center;margin-top:2rem;flex-wrap:wrap}.tool-actions .btn{min-width:140px;padding:.875rem 1.75rem;border-radius:var(--radius-xl, .75rem);font-weight:600;position:relative;overflow:hidden}.tool-actions .btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.tool-actions .btn:hover:before{left:100%}.tool-actions .btn-primary{background:var(--bg-gradient);color:var(--text-inverse);border:none;box-shadow:var(--shadow-colored, 0 10px 25px -3px rgba(102, 126, 234, .15))}.tool-actions .btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg, 0 20px 25px -5px rgba(0, 0, 0, .1))}.tool-actions .btn-success{background:linear-gradient(135deg,#10b981,#059669);color:var(--text-inverse);border:none;box-shadow:0 10px 25px -3px #10b98126}.tool-actions .btn-success:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg, 0 20px 25px -5px rgba(0, 0, 0, .1))}.tool-actions .btn-secondary{background:var(--bg-secondary, #f8fafc);color:var(--text-primary, #0f172a);border:2px solid var(--border, #e2e8f0)}.tool-actions .btn-secondary:hover{background:var(--bg-tertiary, #f1f5f9);border-color:var(--border-accent, #667eea);transform:translateY(-1px)}@media (max-width: 768px){.tool-actions{flex-direction:column}.tool-actions .btn{width:100%}}.crop-controls{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem}.aspect-ratio-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:.5rem;margin-bottom:1rem}.aspect-ratio-btn{padding:.5rem;font-size:.875rem;border:1px solid var(--border, #e2e8f0);background-color:var(--bg-primary, #ffffff);color:var(--text-primary, #0f172a);border-radius:var(--radius-md, .375rem);cursor:pointer;transition:all var(--transition-normal)}.aspect-ratio-btn:hover{background-color:var(--bg-secondary, #f8fafc);border-color:var(--accent, #3b82f6)}.aspect-ratio-btn.active{background-color:var(--accent, #3b82f6);color:#fff;border-color:var(--accent, #3b82f6)}.merge-controls{display:flex;flex-direction:column;gap:1.5rem}.merge-images-list{display:flex;flex-direction:column;gap:1rem;max-height:300px;overflow-y:auto}.merge-image-item{display:flex;align-items:center;gap:1rem;padding:1rem;background-color:var(--bg-secondary, #f8fafc);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem)}.merge-image-preview{width:60px;height:60px;object-fit:cover;border-radius:var(--radius-md, .375rem);border:1px solid var(--border, #e2e8f0)}.merge-image-info{flex:1}.merge-image-name{font-size:.875rem;font-weight:500;color:var(--text-primary, #0f172a);margin-bottom:.25rem}.merge-image-size{font-size:.75rem;color:var(--text-secondary, #64748b)}.merge-image-actions{display:flex;gap:.5rem}.brush-controls{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.brush-size-preview{display:flex;align-items:center;justify-content:center;height:60px;background-color:var(--bg-secondary, #f8fafc);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem)}.brush-preview-dot{background-color:var(--accent, #3b82f6);border-radius:50%;opacity:.7}.canvas-container{position:relative;display:inline-block;border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem);overflow:hidden}.canvas-overlay{position:absolute;top:0;left:0;cursor:crosshair}.black-image-controls{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem}.format-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:.5rem;margin-bottom:1rem}.format-btn{padding:.5rem;font-size:.875rem;border:1px solid var(--border, #e2e8f0);background-color:var(--bg-primary, #ffffff);color:var(--text-primary, #0f172a);border-radius:var(--radius-md, .375rem);cursor:pointer;transition:all var(--transition-normal)}.format-btn:hover{background-color:var(--bg-secondary, #f8fafc);border-color:var(--accent, #3b82f6)}.format-btn.active{background-color:var(--accent, #3b82f6);color:#fff;border-color:var(--accent, #3b82f6)}.compress-preview{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem}.compress-before,.compress-after{display:flex;flex-direction:column;gap:.5rem}.compress-label{font-weight:500;color:var(--text-primary, #0f172a);text-align:center}.compress-image{background-color:var(--bg-secondary, #f8fafc);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem);padding:1rem;display:flex;align-items:center;justify-content:center;min-height:200px}.compress-image img,.compress-image canvas{max-width:100%;max-height:180px;border-radius:var(--radius-md, .375rem)}.compress-stats{display:flex;justify-content:space-between;align-items:center;padding:.75rem;background-color:var(--bg-secondary, #f8fafc);border:1px solid var(--border, #e2e8f0);border-radius:var(--radius-md, .375rem);font-size:.875rem}.compress-stat{display:flex;flex-direction:column;gap:.25rem}.compress-stat-label{color:var(--text-secondary, #64748b)}.compress-stat-value{font-weight:500;color:var(--text-primary, #0f172a)}.compress-savings{color:var(--success, #10b981);font-weight:600}resize-controls{display:flex;flex-direction:column;gap:1.5rem}.resize-modes{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:1rem}.resize-mode-btn{padding:.75rem;font-size:.875rem;border:1px solid var(--border, #e2e8f0);background-color:var(--bg-primary, #ffffff);color:var(--text-primary, #0f172a);border-radius:var(--radius-md, .375rem);cursor:pointer;transition:all var(--transition-normal)}.resize-mode-btn:hover{background-color:var(--bg-secondary, #f8fafc);border-color:var(--accent, #3b82f6)}.resize-mode-btn.active{background-color:var(--accent, #3b82f6);color:#fff;border-color:var(--accent, #3b82f6)}.resize-dimensions{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.resize-lock{display:flex;align-items:center;justify-content:center;padding:.5rem}.resize-lock-btn{background:none;border:none;font-size:1.25rem;cursor:pointer;color:var(--text-secondary, #64748b);padding:.25rem;border-radius:var(--radius-md, .375rem);transition:all var(--transition-normal)}.resize-lock-btn:hover{background-color:var(--bg-secondary, #f8fafc);color:var(--text-primary, #0f172a)}.resize-lock-btn.active{color:var(--accent, #3b82f6)}.header{background:var(--bg-card, #ffffff);border-bottom:1px solid var(--border, #e2e8f0);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);position:sticky;top:0;z-index:100;transition:all var(--transition-normal)}.header.scrolled{box-shadow:var(--shadow-md, 0 10px 15px -3px rgba(0, 0, 0, .1))}.header-container{max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;align-items:center;justify-content:space-between;height:70px}.logo{display:flex;align-items:center;gap:.75rem;text-decoration:none;transition:all var(--transition-normal)}.logo:hover{transform:translateY(-1px)}.logo-img{width:40px;height:40px;border-radius:var(--radius-lg, .5rem);background:var(--bg-gradient);padding:8px}.logo-text{font-size:1.25rem;font-weight:700;color:var(--text-primary, #0f172a);background:var(--bg-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-list{display:flex;list-style:none;gap:.5rem;margin:0;padding:0}.nav-link{display:flex;align-items:center;padding:.5rem 1rem;text-decoration:none;color:var(--text-secondary, #64748b);border-radius:var(--radius-lg, .5rem);transition:all var(--transition-normal);font-weight:500;position:relative;overflow:hidden}.nav-link:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--bg-gradient);opacity:0;transition:opacity var(--transition-normal)}.nav-link:hover{color:var(--text-primary, #0f172a);transform:translateY(-1px)}.nav-link.active{color:var(--text-accent, #667eea);background:var(--bg-tertiary, #f1f5f9)}.nav-link.active:before{opacity:.1}.header-actions{display:flex;align-items:center;gap:1rem}.lang-toggle,.mobile-menu-toggle{background:var(--bg-secondary, #f8fafc);border:2px solid var(--border, #e2e8f0);border-radius:var(--radius-lg, .5rem);padding:.5rem;cursor:pointer;transition:all var(--transition-normal);display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem}.lang-toggle:hover,.mobile-menu-toggle:hover{background:var(--bg-tertiary, #f1f5f9);border-color:var(--accent, #667eea);transform:translateY(-1px)}.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-xl, .75rem);z-index:10}.loading-spinner{display:flex;flex-direction:column;align-items:center;gap:1rem}.loading-text{font-size:.875rem;color:var(--text-secondary, #64748b)}.error-state{text-align:center;padding:2rem;color:var(--text-secondary, #64748b)}.error-icon{font-size:3rem;margin-bottom:1rem;color:var(--error, #ef4444)}.error-message{font-size:1.125rem;margin-bottom:.5rem}.error-details{font-size:.875rem;color:var(--text-secondary, #64748b)}.success-state{text-align:center;padding:2rem;color:var(--text-secondary, #64748b)}.success-icon{font-size:3rem;margin-bottom:1rem;color:var(--success, #10b981)}.success-message{font-size:1.125rem;margin-bottom:1rem}@media (max-width: 768px){.tool-container{padding:1rem}.tool-header{margin-bottom:2rem}.tool-title{font-size:2rem}.tool-description{font-size:1rem}.tool-layout{gap:1rem}.crop-controls,.black-image-controls,.resize-dimensions{grid-template-columns:1fr}.aspect-ratio-buttons,.format-options,.resize-modes{grid-template-columns:repeat(2,1fr)}.compress-preview{grid-template-columns:1fr}.merge-images-list{max-height:200px}}@media (max-width: 480px){.aspect-ratio-buttons,.format-options,.resize-modes{grid-template-columns:1fr}.tool-actions{gap:.5rem}.tool-actions .btn{min-width:auto;padding:.5rem .75rem;font-size:.875rem}}