@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap);:root{--primary-blue:#1a73e8;--primary-blue-hover:#1765cc;--primary-blue-light:#e8f0fe;--primary-blue-dark:#1557b0;--accent-green:#0f9d58;--accent-green-light:#e6f4ea;--accent-red:#ea4335;--accent-red-light:#fce8e6;--accent-yellow:#fbbc04;--accent-yellow-light:#fef7e0;--gray-50:#f8f9fa;--gray-100:#f1f3f4;--gray-200:#e8eaed;--gray-300:#dadce0;--gray-400:#bdc1c6;--gray-500:#9aa0a6;--gray-600:#80868b;--gray-700:#5f6368;--gray-800:#3c4043;--gray-900:#202124;--bg-primary:#fff;--bg-secondary:#f8f9fa;--bg-tertiary:#f1f3f4;--text-primary:#202124;--text-secondary:#5f6368;--text-tertiary:#80868b;--text-link:#1a73e8;--text-link-hover:#1765cc;--border-light:#e8eaed;--border-medium:#dadce0;--border-focus:#1a73e8;--shadow-sm:0 1px 2px 0 #3c40434d,0 1px 3px 1px #3c404326;--shadow-md:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;--shadow-lg:0 2px 6px 0 #3c40434d,0 10px 20px 4px #3c404326;--shadow-hover:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;--radius-xs:4px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:24px;--radius-full:9999px;--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:24px;--space-2xl:32px;--space-3xl:48px;--space-4xl:64px;--space-5xl:96px;--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,sans-serif;--font-mono:"Roboto Mono","SF Mono",Monaco,Consolas,monospace;--text-xs:0.75rem;--text-sm:0.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3rem;--line-height-tight:1.2;--line-height-normal:1.5;--line-height-relaxed:1.75;--line-height-loose:2;--transition-fast:150ms ease-in-out;--transition-base:200ms ease-in-out;--transition-slow:300ms ease-in-out;--z-base:0;--z-dropdown:100;--z-sticky:200;--z-modal:300;--z-tooltip:400;--z-notification:500;--screen-sm:640px;--screen-md:768px;--screen-lg:1024px;--screen-xl:1280px;--screen-2xl:1536px}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;font-size:16px;scroll-behavior:smooth;tab-size:4}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff;background-color:var(--bg-primary);display:flex;flex-direction:column;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;font-family:var(--font-sans);font-size:1rem;font-size:var(--text-base);line-height:1.5;line-height:var(--line-height-normal);min-height:100vh;text-rendering:optimizeLegibility}body,h1,h2,h3,h4,h5,h6{color:#202124;color:var(--text-primary)}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;line-height:var(--line-height-tight);margin:0}h1{font-size:3rem;font-size:var(--text-5xl)}h1,h2{font-weight:700}h2{font-size:2.25rem;font-size:var(--text-4xl)}h3{font-size:1.5rem;font-size:var(--text-2xl)}h3,h4{font-weight:600}h4{font-size:1.25rem;font-size:var(--text-xl)}h5{font-size:1.125rem;font-size:var(--text-lg)}h5,h6{font-weight:500}h6{font-size:1rem;font-size:var(--text-base)}p{line-height:1.5;line-height:var(--line-height-normal);margin:0}a{color:#1a73e8;color:var(--text-link);text-decoration:none;transition:color .15s ease-in-out;transition:color var(--transition-fast)}a:hover{color:#1765cc;color:var(--text-link-hover);text-decoration:underline}code{background-color:#f1f3f4;background-color:var(--gray-100);border-radius:var(--radius-xs);font-family:Roboto Mono,SF Mono,Monaco,Consolas,monospace;font-family:var(--font-mono);font-size:.875em;padding:.125rem .25rem}.btn{align-items:center;background-color:#fff;background-color:var(--bg-primary);border:1px solid #dadce0;border:1px solid var(--border-medium);border-radius:6px;border-radius:var(--radius-sm);color:#202124;color:var(--text-primary);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.875rem;font-size:var(--text-sm);font-weight:500;justify-content:center;line-height:1.25rem;overflow:hidden;padding:8px 24px;padding:var(--space-sm) var(--space-xl);position:relative;text-decoration:none;transition:background-color .2s ease-in-out,box-shadow .2s ease-in-out,transform .2s ease-in-out;transition:background-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base);-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:hover{background-color:#f1f3f4;background-color:var(--bg-tertiary);box-shadow:0 1px 2px 0 #3c40434d,0 1px 3px 1px #3c404326;box-shadow:var(--shadow-sm);transform:translateY(-1px)}.btn:focus{box-shadow:0 0 0 2px #e8f0fe;box-shadow:0 0 0 2px var(--primary-blue-light);outline:none}.btn:active{box-shadow:none;transform:translateY(0)}.btn:disabled{cursor:not-allowed;opacity:.5}.btn-primary{background-color:#1a73e8;background-color:var(--primary-blue);border-color:#1a73e8;border-color:var(--primary-blue);color:#fff}.btn-primary:hover{background-color:#1765cc;background-color:var(--primary-blue-hover);border-color:#1765cc;border-color:var(--primary-blue-hover);color:#000}.btn-primary:active{background-color:#1557b0;background-color:var(--primary-blue-dark)}.btn-secondary{background-color:var(--bg-primary);border-color:#dadce0;border-color:var(--border-medium);color:#1a73e8;color:var(--primary-blue)}.btn-secondary:hover{background-color:#e8f0fe;background-color:var(--primary-blue-light);border-color:#1a73e8;border-color:var(--primary-blue)}.btn-ghost{background-color:initial;border-color:#0000;color:#5f6368;color:var(--text-secondary)}.btn-ghost:hover{background-color:#f1f3f4;background-color:var(--bg-tertiary);color:#202124;color:var(--text-primary)}.btn-lg{font-size:1rem;font-size:var(--text-base);padding:12px 32px;padding:var(--space-md) var(--space-2xl)}.btn-sm{font-size:.75rem;font-size:var(--text-xs);padding:4px 12px;padding:var(--space-xs) var(--space-md)}.card{background-color:#fff;background-color:var(--bg-primary);border:1px solid #e8eaed;border:1px solid var(--border-light);border-radius:8px;border-radius:var(--radius-md);padding:24px;padding:var(--space-xl);transition:box-shadow .2s ease-in-out,transform .2s ease-in-out;transition:box-shadow var(--transition-base),transform var(--transition-base)}.card:hover{box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;box-shadow:var(--shadow-hover);transform:translateY(-2px)}.card-compact{padding:16px;padding:var(--space-lg)}.card-bordered{border:2px solid #dadce0;border:2px solid var(--border-medium)}.tool-card{background-color:#fff;background-color:var(--bg-primary);border:1px solid #e8eaed;border:1px solid var(--border-light);border-radius:var(--radius-md);overflow:hidden;padding:var(--space-xl);position:relative;transition:box-shadow .2s ease-in-out,transform .2s ease-in-out,border-color .2s ease-in-out;transition:box-shadow var(--transition-base),transform var(--transition-base),border-color var(--transition-base)}.tools-grid{grid-gap:24px;grid-gap:var(--space-xl);gap:24px;gap:var(--space-xl);grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}@media (max-width:var(--screen-lg )){.tools-grid{gap:16px;gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width:var(--screen-md )){.tools-grid{gap:12px;gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}@media (max-width:var(--screen-sm )){.tools-grid{gap:16px;gap:var(--space-lg);grid-template-columns:1fr}}.tool-card:before{background:linear-gradient(90deg,#1a73e8,#0f9d58);background:linear-gradient(90deg,var(--primary-blue),var(--accent-green));content:"";height:3px;left:0;position:absolute;top:0;transform:scaleX(0);transform-origin:left;transition:transform .2s ease-in-out;transition:transform var(--transition-base);width:100%}.tool-card:hover{border-color:#e8f0fe;border-color:var(--primary-blue-light);box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;box-shadow:var(--shadow-md);transform:translateY(-3px)}.tool-card:hover:before{transform:scaleX(1)}.tool-card:hover .tool-card-title{color:var(--white)}.tool-card-icon{font-size:2rem;margin-bottom:16px;margin-bottom:var(--space-lg)}.tool-card-badge{background-color:#e8f0fe;background-color:var(--primary-blue-light);border-radius:9999px;border-radius:var(--radius-full);color:#1a73e8;color:var(--primary-blue);display:inline-block;font-size:.75rem;font-size:var(--text-xs);font-weight:500;padding:4px 8px;padding:var(--space-xs) var(--space-sm)}.tool-card-badge,.tool-card-title{margin-bottom:8px;margin-bottom:var(--space-sm)}.tool-card-title{color:#202124;color:var(--gray-900);font-size:1.125rem;font-size:var(--text-lg);font-weight:600;transition:color .15s ease-in-out;transition:color var(--transition-fast)}.tool-card-description{-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;color:#5f6368;color:var(--text-secondary);display:-webkit-box;flex-grow:1;font-size:.875rem;font-size:var(--text-sm);line-height:1.75;line-height:var(--line-height-relaxed);margin-bottom:16px;margin-bottom:var(--space-lg);overflow:hidden}.tool-card-tags{display:flex;flex-wrap:wrap;gap:8px;gap:var(--space-sm);margin-top:auto}.tool-card-tag{background-color:#f1f3f4;background-color:var(--bg-tertiary);border-radius:4px;border-radius:var(--radius-xs);color:#5f6368;color:var(--text-secondary);font-size:.75rem;font-size:var(--text-xs);font-weight:500;padding:4px 8px;padding:var(--space-xs) var(--space-sm)}.input-field{background-color:#fff;background-color:var(--bg-primary);border:1px solid #dadce0;border:1px solid var(--border-medium);border-radius:6px;border-radius:var(--radius-sm);color:#202124;color:var(--text-primary);font-family:inherit;font-size:.875rem;font-size:var(--text-sm);line-height:1.25rem;padding:8px 12px;padding:var(--space-sm) var(--space-md);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:border-color var(--transition-fast),box-shadow var(--transition-fast);width:100%}.input-field:hover{border-color:#bdc1c6;border-color:var(--gray-400)}.input-field:focus{border-color:#1a73e8;border-color:var(--border-focus);box-shadow:0 0 0 2px #e8f0fe;box-shadow:0 0 0 2px var(--primary-blue-light);outline:none}.input-field::placeholder{color:#80868b;color:var(--text-tertiary)}.input-field:disabled{background-color:#f1f3f4;background-color:var(--bg-tertiary);cursor:not-allowed;opacity:.6}.search-container{max-width:600px;position:relative;width:100%}.search-input{background-color:var(--bg-primary);border:1px solid #dadce0;border:1px solid var(--border-medium);border-radius:9999px;border-radius:var(--radius-full);font-size:var(--text-base);padding:12px 16px 12px 48px;padding:var(--space-md) var(--space-lg) var(--space-md) var(--space-3xl);transition:box-shadow .2s ease-in-out,border-color .2s ease-in-out;transition:box-shadow var(--transition-base),border-color var(--transition-base)}@media (max-width:var(--screen-lg )){.search-container{max-width:100%}.search-input{font-size:.875rem;font-size:var(--text-sm);padding:12px 12px 12px 32px;padding:var(--space-md) var(--space-md) var(--space-md) var(--space-2xl)}.search-icon{left:12px;left:var(--space-md)}}@media (max-width:var(--screen-md )){.search-input{font-size:1rem;font-size:var(--text-base);min-height:48px;padding:8px 12px 8px 32px;padding:var(--space-sm) var(--space-md) var(--space-sm) var(--space-2xl)}.search-icon{font-size:.875rem;font-size:var(--text-sm);left:12px;left:var(--space-md)}}.search-input:hover{box-shadow:0 1px 2px 0 #3c40434d,0 1px 3px 1px #3c404326;box-shadow:var(--shadow-sm)}.search-input:focus{border-color:#1a73e8;border-color:var(--border-focus);box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;box-shadow:var(--shadow-md)}.search-icon{color:#80868b;color:var(--text-tertiary);left:16px;left:var(--space-lg);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.category-filters{display:flex;flex-wrap:wrap;gap:8px;gap:var(--space-sm);justify-content:center}@media (max-width:var(--screen-lg )){.category-filters{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;flex-wrap:nowrap;gap:4px;gap:var(--space-xs);justify-content:flex-start;overflow-x:auto;overflow-y:hidden;padding-bottom:4px;padding-bottom:var(--space-xs);scrollbar-width:none}.category-filters::-webkit-scrollbar{display:none}}@media (max-width:var(--screen-md )){.category-filters{flex-wrap:nowrap;gap:4px;gap:var(--space-xs);justify-content:flex-start;margin-bottom:8px;margin-bottom:var(--space-sm);overflow-x:auto;padding-bottom:8px;padding-bottom:var(--space-sm)}}.search-filter-container{align-items:center;display:flex;gap:16px;gap:var(--space-lg);margin-bottom:32px;margin-bottom:var(--space-2xl)}@media (max-width:var(--screen-lg )){.search-filter-container{align-items:stretch;flex-direction:column;gap:12px;gap:var(--space-md)}}@media (max-width:var(--screen-md )){.search-filter-container{align-items:stretch;flex-direction:column;gap:12px;gap:var(--space-md);margin-bottom:24px;margin-bottom:var(--space-xl)}}.category-btn{background-color:#fff;background-color:var(--bg-primary);border:1px solid #dadce0;border:1px solid var(--border-medium);border-radius:9999px;border-radius:var(--radius-full);color:#5f6368;color:var(--text-secondary);cursor:pointer;font-size:.875rem;font-size:var(--text-sm);font-weight:500;padding:8px 16px;padding:var(--space-sm) var(--space-lg);transition:background-color .15s ease-in-out,color .15s ease-in-out,transform .15s ease-in-out;transition:background-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast);white-space:nowrap}@media (max-width:var(--screen-lg )){.category-btn{flex-shrink:0;font-size:.75rem;font-size:var(--text-xs);min-width:-webkit-max-content;min-width:max-content;padding:4px 12px;padding:var(--space-xs) var(--space-md)}}@media (max-width:var(--screen-md )){.category-btn{-webkit-tap-highlight-color:transparent;flex-shrink:0;font-size:.875rem;font-size:var(--text-sm);min-height:44px;min-width:-webkit-max-content;min-width:max-content;padding:8px 16px;padding:var(--space-sm) var(--space-lg);touch-action:manipulation}}.category-btn:hover{background-color:#f1f3f4;background-color:var(--bg-tertiary);color:#202124;color:var(--text-primary);transform:translateY(-1px)}.category-btn.active{background-color:#1a73e8;background-color:var(--primary-blue);border-color:#1a73e8;border-color:var(--primary-blue);color:#fff}.navbar{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background-color:#fffffff2;border-bottom:1px solid #e8eaed;border-bottom:1px solid var(--border-light);box-shadow:0 1px 3px #0000000d;position:-webkit-sticky;position:sticky;top:0;z-index:200;z-index:var(--z-sticky)}.navbar-container{height:64px;justify-content:space-between;margin:0 auto;max-width:1280px;max-width:var(--screen-xl);padding:0 24px;padding:0 var(--space-xl)}.navbar-brand,.navbar-container{align-items:center;display:flex;position:relative}.navbar-brand{gap:12px;gap:var(--space-md);text-decoration:none;z-index:1001}.navbar-logo{align-items:center;background:linear-gradient(135deg,#1a73e8,#0f9d58);background:linear-gradient(135deg,var(--primary-blue),var(--accent-green));border-radius:6px;border-radius:var(--radius-sm);color:#fff;display:flex;font-size:1rem;font-size:var(--text-base);font-weight:700;height:36px;justify-content:center;transition:transform .2s ease-in-out;transition:transform var(--transition-base);width:36px}.navbar-brand:hover .navbar-logo{transform:rotate(-5deg) scale(1.05)}.navbar-title{color:#202124;color:var(--text-primary);font-size:1.25rem;font-size:var(--text-xl);font-weight:600}.navbar-nav{gap:32px;gap:var(--space-2xl);transition:all .2s ease-in-out;transition:all var(--transition-base)}.nav-link,.navbar-nav{align-items:center;display:flex}.nav-link{border-radius:6px;border-radius:var(--radius-sm);color:#5f6368;color:var(--text-secondary);font-size:.875rem;font-size:var(--text-sm);font-weight:500;min-height:44px;padding:8px 12px;padding:var(--space-sm) var(--space-md);position:relative;text-decoration:none;transition:color .15s ease-in-out;transition:color var(--transition-fast)}.nav-link:hover{background-color:#f1f3f4;background-color:var(--bg-tertiary);color:#202124;color:var(--text-primary)}.nav-link.active{background-color:#e8f0fe;background-color:var(--primary-blue-light);color:#1a73e8;color:var(--primary-blue)}.nav-link:after{background-color:#1a73e8;background-color:var(--primary-blue);bottom:-20px;content:"";height:2px;left:50%;position:absolute;transform:translateX(-50%) scaleX(0);transition:transform .15s ease-in-out;transition:transform var(--transition-fast);width:100%}.nav-link.active:after,.nav-link:hover:after{transform:translateX(-50%) scaleX(1)}.navbar-actions{align-items:center;display:flex;gap:16px;gap:var(--space-lg)}.desktop-get-started{display:block}.mobile-menu-btn{-webkit-tap-highlight-color:transparent;align-items:center;background:#0000;border:none;border-radius:6px;border-radius:var(--radius-sm);color:#5f6368;color:var(--text-secondary);cursor:pointer;display:none;flex-direction:column;justify-content:center;min-height:44px;min-width:44px;padding:8px;padding:var(--space-sm);position:relative;touch-action:manipulation;transition:all .15s ease-in-out;transition:all var(--transition-fast);z-index:1001}.mobile-menu-btn:hover{background-color:#f1f3f4;background-color:var(--bg-tertiary);color:#202124;color:var(--text-primary)}.mobile-menu-btn:focus{outline:2px solid #1a73e8;outline:2px solid var(--primary-blue);outline-offset:2px}.mobile-menu-btn:active{background-color:#f1f3f4;background-color:var(--bg-tertiary);transform:scale(.95)}.hamburger{height:20px;position:relative;width:20px}.hamburger,.hamburger span{transform:rotate(0deg);transition:.2s ease-in-out ease-in-out;transition:var(--transition-base) ease-in-out}.hamburger span{background:currentColor;border-radius:2px;display:block;height:2px;left:0;opacity:1;position:absolute;width:100%}.hamburger span:first-child{top:4px}.hamburger span:nth-child(2),.hamburger span:nth-child(3){top:9px}.hamburger span:nth-child(4){top:14px}.mobile-menu-btn.active .hamburger span:first-child{left:50%;top:9px;width:0}.mobile-menu-btn.active .hamburger span:nth-child(2){transform:rotate(45deg)}.mobile-menu-btn.active .hamburger span:nth-child(3){transform:rotate(-45deg)}.mobile-menu-btn.active .hamburger span:nth-child(4){left:50%;top:9px;width:0}.hamburger-x{height:18px;position:relative;width:18px}.hamburger-x span{background-color:currentColor;border-radius:1px;display:block;height:2px;left:0;position:absolute;transition:all .2s ease-in-out;transition:all var(--transition-base);width:100%}.hamburger-x span:first-child{top:2px}.hamburger-x span:nth-child(2){top:8px}.hamburger-x span:nth-child(3){top:14px}.mobile-menu-btn.active .hamburger-x span:first-child{top:8px;transform:rotate(45deg)}.mobile-menu-btn.active .hamburger-x span:nth-child(2){opacity:0;transform:translateX(20px)}.mobile-menu-btn.active .hamburger-x span:nth-child(3){top:8px;transform:rotate(-45deg)}.mobile-menu-overlay{-webkit-tap-highlight-color:transparent;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);background-color:#00000080;height:100vh;left:0;opacity:0;position:fixed;top:0;touch-action:manipulation;transition:opacity .2s ease-in-out,visibility .2s ease-in-out;transition:opacity var(--transition-base),visibility var(--transition-base);visibility:hidden;width:100%;z-index:300;z-index:var(--z-modal)}.mobile-menu-overlay.active{opacity:1;visibility:visible}.menu-open{overflow:hidden}body.menu-open{overflow:hidden!important;position:fixed!important;width:100%!important}.mobile-menu{-webkit-overflow-scrolling:touch;background-color:#fff;background-color:var(--bg-primary);border-left:1px solid #e8eaed;border-left:1px solid var(--border-light);box-shadow:-4px 0 20px #00000026;height:100vh;max-width:85vw;overflow-x:hidden;overflow-y:auto;padding-top:80px;position:fixed;right:-100%;top:0;transition:right .2s ease-in-out cubic-bezier(.25,.46,.45,.94);transition:right var(--transition-base) cubic-bezier(.25,.46,.45,.94);width:280px;z-index:301;z-index:calc(var(--z-modal) + 1)}.mobile-menu.active{right:0}.mobile-menu.slide-left{right:-100%;transition:right .2s ease-in-out cubic-bezier(.25,.46,.45,.94);transition:right var(--transition-base) cubic-bezier(.25,.46,.45,.94)}.mobile-menu.slide-left.active{right:0}.mobile-menu.fade-in{opacity:0;right:0;transition:opacity .2s ease-in-out,visibility .2s ease-in-out;transition:opacity var(--transition-base),visibility var(--transition-base);visibility:hidden}.mobile-menu.fade-in.active{opacity:1;visibility:visible}.mobile-menu-nav{display:flex;flex-direction:column;padding:24px 0;padding:var(--space-xl) 0}.mobile-nav-link{-webkit-tap-highlight-color:transparent;align-items:center;border-bottom:1px solid #e8eaed;border-bottom:1px solid var(--border-light);color:#5f6368;color:var(--text-secondary);display:flex;font-size:1rem;font-size:var(--text-base);font-weight:500;min-height:56px;overflow:hidden;padding:16px 24px;padding:var(--space-lg) var(--space-xl);position:relative;text-decoration:none;touch-action:manipulation;transition:all .2s ease-in-out;transition:all var(--transition-base)}.mobile-nav-link:before{background:linear-gradient(90deg,#0000,#1a73e81a,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .2s ease-in-out;transition:left var(--transition-base);width:100%}.mobile-nav-link:active:before,.mobile-nav-link:hover:before{left:100%}.mobile-nav-link:active,.mobile-nav-link:focus,.mobile-nav-link:hover{background-color:#f1f3f4;background-color:var(--bg-tertiary);color:#202124;color:var(--text-primary);padding-left:32px;padding-left:calc(var(--space-xl) + var(--space-sm));transform:translateX(4px)}.mobile-nav-link.active{background-color:#e8f0fe;background-color:var(--primary-blue-light);border-left:4px solid #1a73e8;border-left:4px solid var(--primary-blue);color:#1a73e8;color:var(--primary-blue);font-weight:600}.mobile-nav-link.active:after{color:#1a73e8;color:var(--primary-blue);content:"●";font-size:.875rem;font-size:var(--text-sm);margin-left:auto}.mobile-menu-actions{border-top:1px solid #e8eaed;border-top:1px solid var(--border-light);margin-top:auto;padding:24px;padding:var(--space-xl)}.mobile-menu-close{-webkit-tap-highlight-color:transparent;align-items:center;background:#0000;border:none;border-radius:6px;border-radius:var(--radius-sm);color:#5f6368;color:var(--text-secondary);cursor:pointer;display:flex;font-size:1.25rem;font-size:var(--text-xl);justify-content:center;min-height:44px;min-width:44px;padding:8px;padding:var(--space-sm);position:absolute;right:16px;right:var(--space-lg);top:16px;top:var(--space-lg);touch-action:manipulation;transition:all .15s ease-in-out;transition:all var(--transition-fast)}.mobile-menu-close:active,.mobile-menu-close:hover{background-color:#f1f3f4;background-color:var(--bg-tertiary);color:#202124;color:var(--text-primary);transform:scale(.95)}@media (max-width:768px){.navbar-container{padding:0 16px;padding:0 var(--space-lg)}.desktop-get-started,.navbar-nav{display:none}.mobile-menu-btn{display:flex}}@media (max-width:1024px) and (min-width:769px){.navbar-nav{gap:16px;gap:var(--space-lg)}.nav-link{font-size:.75rem;font-size:var(--text-xs);padding:4px 8px;padding:var(--space-xs) var(--space-sm)}}@media (max-width:480px){.navbar-container{height:56px;padding:0 12px;padding:0 var(--space-md)}.navbar-brand{gap:8px;gap:var(--space-sm)}.navbar-logo{font-size:.875rem;font-size:var(--text-sm);height:32px;width:32px}.navbar-title{font-size:1.125rem;font-size:var(--text-lg)}.mobile-menu{max-width:100vw;padding-top:70px;width:100vw}.mobile-menu-close{right:12px;right:var(--space-md);top:12px;top:var(--space-md)}}@media (pointer:coarse){.mobile-menu-btn,.mobile-menu-close,.mobile-nav-link,.nav-link{min-height:44px;min-width:44px}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.hamburger span,.hamburger-x span{height:1.5px}}.footer{background-color:#fff;background-color:var(--bg-primary);border-top:1px solid #e8eaed;border-top:1px solid var(--border-light);margin-top:auto;padding:64px 0 32px;padding:var(--space-4xl) 0 var(--space-2xl)}.footer-container{margin:0 auto;max-width:1280px;max-width:var(--screen-xl);padding:0 24px;padding:0 var(--space-xl)}.footer-grid{grid-gap:48px;grid-gap:var(--space-3xl);display:grid;gap:48px;gap:var(--space-3xl);grid-template-columns:2fr 1fr 1fr 1fr;margin-bottom:48px;margin-bottom:var(--space-3xl)}.footer-brand{align-items:center;display:flex;gap:12px;gap:var(--space-md);justify-content:center;margin-bottom:16px;margin-bottom:var(--space-lg)}.footer-description{color:#5f6368;color:var(--text-secondary);line-height:1.75;line-height:var(--line-height-relaxed);max-width:280px}.footer-description,.footer-heading{font-size:.875rem;font-size:var(--text-sm)}.footer-heading{color:#202124;color:var(--text-primary);font-weight:600;letter-spacing:.5px;margin-bottom:16px;margin-bottom:var(--space-lg);text-transform:uppercase}.footer-links{display:flex;flex-direction:column;gap:12px;gap:var(--space-md);list-style:none}.footer-link{color:#5f6368;color:var(--text-secondary);font-size:.875rem;font-size:var(--text-sm);transition:color .15s ease-in-out;transition:color var(--transition-fast)}.footer-link:hover{color:#1a73e8;color:var(--primary-blue)}.footer-bottom{align-items:center;border-top:1px solid #e8eaed;border-top:1px solid var(--border-light);display:flex;justify-content:space-between;padding-top:32px;padding-top:var(--space-2xl)}.footer-copyright{color:#80868b;color:var(--text-tertiary);font-size:.875rem;font-size:var(--text-sm)}.footer-social{display:flex;gap:16px;gap:var(--space-lg)}.social-link{align-items:center;color:#80868b;color:var(--text-tertiary);display:flex;transition:color .15s ease-in-out,transform .15s ease-in-out;transition:color var(--transition-fast),transform var(--transition-fast)}.social-link:hover{color:#1a73e8;color:var(--primary-blue);transform:translateY(-2px)}.hero{background:linear-gradient(135deg,#e8f0fe,#fff0);background:linear-gradient(135deg,var(--primary-blue-light) 0,#fff0 100%);overflow:hidden;padding:96px 24px;padding:var(--space-5xl) var(--space-xl);position:relative;text-align:center}.hero:before{animation:float 20s ease-in-out infinite;background:radial-gradient(circle,#e6f4ea 0,#0000 70%);background:radial-gradient(circle,var(--accent-green-light) 0,#0000 70%);content:"";height:200%;opacity:.3;position:absolute;right:-50%;top:-50%;width:200%}@keyframes float{0%,to{transform:translate(0) rotate(0deg)}50%{transform:translate(-30px,-30px) rotate(180deg)}}.hero-title{color:#202124;color:var(--text-primary);font-size:clamp(2.5rem,5vw,3.5rem);font-weight:700;line-height:1.2;line-height:var(--line-height-tight);margin-bottom:24px;margin-bottom:var(--space-xl);position:relative}.hero-brand{background:linear-gradient(135deg,#1a73e8,#1557b0);background:linear-gradient(135deg,var(--primary-blue),var(--primary-blue-dark));-webkit-background-clip:text;background-clip:text;color:#1a73e8;color:var(--primary-blue);font-weight:800;position:relative;text-decoration:none}.hero-brand,.hero-gradient{-webkit-text-fill-color:#0000}.hero-gradient{background:linear-gradient(135deg,#1a73e8,#0f9d58);background:linear-gradient(135deg,var(--primary-blue),var(--accent-green));-webkit-background-clip:text;background-clip:text}.hero-description{color:#5f6368;color:var(--text-secondary);font-size:1.125rem;font-size:var(--text-lg);line-height:1.75;line-height:var(--line-height-relaxed);margin:0 auto 32px;margin:0 auto var(--space-2xl);max-width:600px}.hero-actions{display:flex;flex-wrap:wrap;gap:16px;gap:var(--space-lg);justify-content:center}.features-grid{grid-gap:var(--space-xl);gap:var(--space-xl)}.feature-card{padding:32px;padding:var(--space-2xl);position:relative;transition:transform .2s ease-in-out;transition:transform var(--transition-base)}.feature-card:hover{transform:translateY(-4px)}.feature-icon{animation:bounce 2s ease-in-out infinite;display:inline-block;margin-bottom:16px;margin-bottom:var(--space-lg)}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.feature-card:hover .feature-icon{animation-play-state:paused}.faq-section{background-color:#fff;background-color:var(--bg-primary);padding:64px 0;padding:var(--space-4xl) 0}.faq-container{margin:0 auto;max-width:800px}.faq-item{background-color:#f8f9fa;background-color:var(--bg-secondary);border-radius:var(--radius-md);margin-bottom:32px;margin-bottom:var(--space-2xl);padding:24px;padding:var(--space-xl);transition:box-shadow .2s ease-in-out,transform .2s ease-in-out;transition:box-shadow var(--transition-base),transform var(--transition-base)}.faq-item:hover{box-shadow:0 1px 2px 0 #3c40434d,0 1px 3px 1px #3c404326;box-shadow:var(--shadow-sm);transform:translateY(-1px)}.faq-question{align-items:center;color:#202124;color:var(--text-primary);display:flex;font-size:1.125rem;font-size:var(--text-lg);font-weight:600;gap:12px;gap:var(--space-md);margin-bottom:12px;margin-bottom:var(--space-md)}.faq-question:before{content:"❓";font-size:1.25rem;font-size:var(--text-xl);opacity:.7}.faq-answer{color:#5f6368;color:var(--text-secondary);line-height:1.75;line-height:var(--line-height-relaxed);margin-left:calc(1.25rem + 12px);margin-left:calc(var(--text-xl) + var(--space-md))}.content-section{padding:96px 0;padding:var(--space-5xl) 0;position:relative}.content-section-alt{background:linear-gradient(135deg,#f8f9fa,#f8f9fa80);background:linear-gradient(135deg,var(--bg-secondary) 0,#f8f9fa80 100%);position:relative}.content-section-alt:before{background:url(https://img.icons8.com/dotty/60/ffffff/dots-loading.png);bottom:0;content:"";left:0;opacity:.6;position:absolute;right:0;top:0}.content-section h2{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#202124,#1a73e8);background:linear-gradient(135deg,var(--text-primary) 0,var(--primary-blue) 100%);-webkit-background-clip:text;background-clip:text;font-size:clamp(2rem,4vw,2.5rem);font-weight:700;margin-bottom:64px;margin-bottom:var(--space-4xl);position:relative;text-align:center}.content-section h2:after{background:linear-gradient(90deg,#1a73e8,#0f9d58);background:linear-gradient(90deg,var(--primary-blue),var(--accent-green));border-radius:9999px;border-radius:var(--radius-full);bottom:-var(--space-lg);box-shadow:0 2px 8px #1a73e84d;content:"";height:4px;left:50%;position:absolute;transform:translateX(-50%);width:80px}.feature-grid{grid-gap:var(--space-xl);gap:var(--space-xl);margin:0 auto;max-width:1200px;position:relative;z-index:1}.feature-item{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(145deg,#fff,#ffffffe6);background:linear-gradient(145deg,var(--bg-primary) 0,#ffffffe6 100%);border:1px solid #fff3;border-radius:var(--radius-lg);box-shadow:0 2px 8px #0000000f,0 1px 3px #0000001a;flex-direction:column;overflow:hidden;padding:24px 16px;padding:var(--space-xl) var(--space-lg);position:relative;text-align:center;transition:transform .3s ease-in-out,box-shadow .3s ease-in-out,border-color .3s ease-in-out;transition:transform var(--transition-slow),box-shadow var(--transition-slow),border-color var(--transition-slow)}.feature-item:before{background:linear-gradient(90deg,#1a73e8,#0f9d58,#fbbc04);background:linear-gradient(90deg,var(--primary-blue),var(--accent-green),var(--accent-yellow));content:"";height:4px;left:0;position:absolute;top:0;transform:scaleX(0);transform-origin:left;transition:transform .2s ease-in-out;transition:transform var(--transition-base);width:100%}.feature-item:after{background:radial-gradient(circle,#1a73e81a 0,#0000 70%);content:"";height:100%;opacity:0;position:absolute;right:-50%;top:-50%;transition:opacity .3s ease-in-out;transition:opacity var(--transition-slow);width:100%}.feature-item:hover{border-color:#e8f0fe;border-color:var(--primary-blue-light);box-shadow:0 20px 40px #00000026,0 8px 16px #0000001a;transform:translateY(-8px) scale(1.02)}.feature-item:hover:before{transform:scaleX(1)}.feature-item:hover:after{opacity:1}.feature-icon{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#1a73e8,#0f9d58);background:linear-gradient(135deg,var(--primary-blue),var(--accent-green));-webkit-background-clip:text;background-clip:text;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.1));font-size:2.5rem;margin-bottom:12px;margin-bottom:var(--space-md);position:relative;transition:transform .2s ease-in-out,filter .2s ease-in-out;transition:transform var(--transition-base),filter var(--transition-base);z-index:2}.feature-item:hover .feature-icon{filter:drop-shadow(3px 3px 6px rgba(0,0,0,.15));transform:scale(1.1) rotate(3deg)}.feature-title{color:#202124;color:var(--text-primary);font-size:1.125rem;font-size:var(--text-lg);font-weight:600;line-height:1.2;line-height:var(--line-height-tight);margin-bottom:8px;margin-bottom:var(--space-sm);position:relative;z-index:2}.feature-description{color:#5f6368;color:var(--text-secondary);flex-grow:1;font-size:.875rem;font-size:var(--text-sm);line-height:1.75;line-height:var(--line-height-relaxed);margin:0 auto;max-width:280px;position:relative;z-index:2}@media (max-width:var(--screen-md )){.feature-grid{gap:16px;gap:var(--space-lg);grid-template-columns:1fr;padding:0 12px;padding:0 var(--space-md)}.feature-item{padding:16px 12px;padding:var(--space-lg) var(--space-md)}.feature-icon{font-size:2rem}.feature-title{font-size:1rem;font-size:var(--text-base)}.feature-description{font-size:.75rem;font-size:var(--text-xs)}}.stats-section{background:linear-gradient(135deg,#e8f0fe,#e6f4ea);background:linear-gradient(135deg,var(--primary-blue-light),var(--accent-green-light));overflow:hidden;padding:64px 0;padding:var(--space-4xl) 0;position:relative}.stats-section:before{animation:rotate 30s linear infinite;background:radial-gradient(circle,#1a73e81a 0,#0000 70%);content:"";height:200%;position:absolute;right:-50%;top:-50%;width:200%}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.stats-grid{grid-gap:32px;grid-gap:var(--space-2xl);gap:32px;gap:var(--space-2xl);position:relative;z-index:1}.stat-item{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffe6;border-radius:var(--radius-lg);box-shadow:0 1px 2px 0 #3c40434d,0 1px 3px 1px #3c404326;box-shadow:var(--shadow-sm);padding:24px;padding:var(--space-xl)}.stat-number{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#1a73e8,#0f9d58);background:linear-gradient(135deg,var(--primary-blue),var(--accent-green));-webkit-background-clip:text;background-clip:text;font-size:clamp(2rem,4vw,3rem);margin-bottom:8px;margin-bottom:var(--space-sm)}.stat-label{color:#5f6368;color:var(--text-secondary);font-size:.875rem;font-size:var(--text-sm)}.category-showcase{padding:64px 0;padding:var(--space-4xl) 0}.category-grid{grid-gap:24px;grid-gap:var(--space-xl);display:grid;gap:24px;gap:var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:0 auto;max-width:1200px}.category-card{background:#fff;background:var(--bg-primary);border:2px solid #e8eaed;border:2px solid var(--border-light);border-radius:12px;border-radius:var(--radius-lg);padding:32px;padding:var(--space-2xl);position:relative;text-align:center;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out,border-color .2s ease-in-out;transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base)}.category-card:hover{border-color:#e8f0fe;border-color:var(--primary-blue-light);box-shadow:0 2px 6px 0 #3c40434d,0 10px 20px 4px #3c404326;box-shadow:var(--shadow-lg);transform:translateY(-6px)}.category-icon{display:block;filter:grayscale(1);font-size:3rem;margin-bottom:16px;margin-bottom:var(--space-lg);transition:filter .2s ease-in-out;transition:filter var(--transition-base)}.category-card:hover .category-icon{filter:grayscale(0)}.category-name{color:#202124;color:var(--text-primary);font-size:1.25rem;font-size:var(--text-xl);font-weight:600;margin-bottom:8px;margin-bottom:var(--space-sm)}.category-count{color:#1a73e8;color:var(--primary-blue);font-weight:500;margin-bottom:12px;margin-bottom:var(--space-md)}.category-description{color:#5f6368;color:var(--text-secondary);font-size:.875rem;font-size:var(--text-sm);line-height:1.75;line-height:var(--line-height-relaxed)}.cta-section{background:linear-gradient(135deg,#1a73e8,#0f9d58);background:linear-gradient(135deg,var(--primary-blue),var(--accent-green));overflow:hidden;padding:96px 24px;padding:var(--space-5xl) var(--space-xl);position:relative}.cta-section:before{background:url(https://img.icons8.com/dotty/60/000000/plus-math.png);bottom:0;content:"";left:0;opacity:.1;position:absolute;right:0;top:0;z-index:1}.cta-title{font-size:clamp(1.875rem,4vw,2.5rem);font-weight:700;margin-bottom:16px;margin-bottom:var(--space-lg);position:relative;z-index:2}.cta-section .cta-title:after{display:none!important}.cta-description{font-size:1.125rem;font-size:var(--text-lg);line-height:1.75;line-height:var(--line-height-relaxed);margin-bottom:32px;margin-bottom:var(--space-2xl);opacity:.95;position:relative;z-index:2}.cta-button{background-color:#fff;border:none;border-radius:6px;border-radius:var(--radius-sm);box-shadow:0 1px 2px 0 #3c40434d,0 1px 3px 1px #3c404326;box-shadow:var(--shadow-sm);color:#1a73e8;color:var(--primary-blue);cursor:pointer;font-size:1rem;font-size:var(--text-base);padding:12px 32px;padding:var(--space-md) var(--space-2xl);position:relative;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out;transition:transform var(--transition-base),box-shadow var(--transition-base);z-index:2}.cta-button:hover{box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;box-shadow:var(--shadow-md);transform:translateY(-2px)}.container{margin:0 auto;max-width:1280px;max-width:var(--screen-xl);padding:0 24px;padding:0 var(--space-xl)}.section{padding:64px 0;padding:var(--space-4xl) 0}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.grid{display:grid}.gap-sm{gap:8px;gap:var(--space-sm)}.gap-md{gap:12px;gap:var(--space-md)}.gap-lg{gap:16px;gap:var(--space-lg)}.gap-xl{gap:24px;gap:var(--space-xl)}.hidden{display:none!important}.block{display:block!important}.w-full{width:100%}.h-full{height:100%}.mt-auto{margin-top:auto}.mb-auto{margin-bottom:auto}.ml-auto{margin-left:auto}.mr-auto,.mx-auto{margin-right:auto}.mx-auto{margin-left:auto}.skeleton{animation:loading 1.5s infinite;background:linear-gradient(90deg,#e8eaed 25%,#f1f3f4 50%,#e8eaed 75%);background:linear-gradient(90deg,var(--gray-200) 25%,var(--gray-100) 50%,var(--gray-200) 75%);background-size:200% 100%}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}@media (max-width:var(--screen-lg )){.container{max-width:100%}.footer-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:var(--screen-lg )) and (min-width:calc(var(--screen-md ) + 1px)){.navbar-container{padding:0 16px;padding:0 var(--space-lg)}.navbar-actions .btn:not(.mobile-menu-btn),.navbar-nav{display:none}.mobile-menu-btn{display:flex}.mobile-menu,.mobile-menu-overlay{display:block}.mobile-menu{width:320px}.navbar-title{font-size:1.125rem;font-size:var(--text-lg)}.navbar-logo{font-size:.875rem;font-size:var(--text-sm);height:32px;width:32px}}@media (max-width:var(--screen-md )){:root{--space-xl:20px;--space-2xl:28px;--space-3xl:40px;--space-4xl:56px;--space-5xl:72px}.navbar-container{height:56px;padding:0 16px;padding:0 var(--space-lg)}.navbar-actions .btn:not(.mobile-menu-btn),.navbar-nav{display:none}.mobile-menu-btn{display:flex}.mobile-menu,.mobile-menu-overlay{display:block}.navbar-title{font-size:1.125rem;font-size:var(--text-lg)}.navbar-logo{font-size:.875rem;font-size:var(--text-sm);height:32px;width:32px}.footer-grid{gap:32px;gap:var(--space-2xl);grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:16px;gap:var(--space-lg);text-align:center}.hero-title{font-size:2rem}.hero-actions{align-items:center;flex-direction:column}.hero-actions .btn{max-width:300px;width:100%}.features-grid{grid-template-columns:1fr}.search-container{max-width:100%}.category-filters{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;flex-wrap:nowrap;gap:4px;gap:var(--space-xs);justify-content:flex-start;overflow-x:auto;padding-bottom:8px;padding-bottom:var(--space-sm);scrollbar-width:none;width:100%}.category-filters::-webkit-scrollbar{display:none}}@media (max-width:var(--screen-sm )){.container{padding:0 16px;padding:0 var(--space-lg)}.hero{padding:48px 16px;padding:var(--space-3xl) var(--space-lg)}.tool-card{padding:16px;padding:var(--space-lg);touch-action:manipulation}.navbar-container{height:56px;padding:0 16px;padding:0 var(--space-lg)}.navbar-title{display:none;font-size:1rem;font-size:var(--text-base)}.navbar-logo{font-size:.75rem;font-size:var(--text-xs);height:28px;width:28px}.mobile-menu{right:-100vw;width:100vw}.mobile-nav-link{font-size:1.125rem;font-size:var(--text-lg);min-height:60px;padding:24px 16px;padding:var(--space-xl) var(--space-lg)}.mobile-nav-link:focus,.mobile-nav-link:hover{padding-left:28px;padding-left:calc(var(--space-lg) + var(--space-md))}.footer-container{padding:0 16px;padding:0 var(--space-lg)}.cta-section{padding:48px 16px;padding:var(--space-3xl) var(--space-lg)}.btn{min-height:48px;touch-action:manipulation}.btn-sm{min-height:40px}.btn-lg{min-height:56px}.category-btn{-webkit-tap-highlight-color:transparent;flex-shrink:0;min-height:48px;min-width:-webkit-max-content;min-width:max-content;padding:12px 16px;padding:var(--space-md) var(--space-lg);touch-action:manipulation}.search-input{font-size:1rem;font-size:var(--text-base);min-height:48px}}@media (max-width:380px){.container,.navbar-container{padding:0 12px;padding:0 var(--space-md)}.mobile-nav-link{padding:16px 12px;padding:var(--space-lg) var(--space-md)}.hero{padding:32px 12px;padding:var(--space-2xl) var(--space-md)}.hero-title{font-size:1.75rem}.footer-container{padding:0 12px;padding:0 var(--space-md)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.fade-in{animation:fadeIn ease-out .3s ease-in-out;animation:fadeIn var(--transition-slow) ease-out}.slide-in{animation:slideIn ease-out .3s ease-in-out;animation:slideIn var(--transition-slow) ease-out}.scale-in{animation:scaleIn ease-out .3s ease-in-out;animation:scaleIn var(--transition-slow) ease-out}@media (prefers-reduced-motion:no-preference){.animate-on-scroll{opacity:0;transform:translateY(20px);transition:opacity .3s ease-in-out ease-out,transform .3s ease-in-out ease-out;transition:opacity var(--transition-slow) ease-out,transform var(--transition-slow) ease-out}.animate-on-scroll.in-view{opacity:1;transform:translateY(0)}}:focus-visible{border-radius:4px;border-radius:var(--radius-xs);outline:2px solid #1a73e8;outline:2px solid var(--primary-blue);outline-offset:2px}a:focus-visible,button:focus-visible{outline-offset:4px}@media (max-width:var(--screen-md )){.mobile-nav-link:focus-visible{background-color:#e8f0fe;background-color:var(--primary-blue-light);outline:3px solid #1a73e8;outline:3px solid var(--primary-blue);outline-offset:-3px}.mobile-menu-btn:focus-visible{outline:3px solid #1a73e8;outline:3px solid var(--primary-blue);outline-offset:2px}}.skip-to-content{background:#1a73e8;background:var(--primary-blue);color:#fff;left:0;padding:8px 16px;padding:var(--space-sm) var(--space-lg);position:absolute;text-decoration:none;top:-40px;transition:top .15s ease-in-out;transition:top var(--transition-fast);z-index:400;z-index:var(--z-tooltip)}.skip-to-content:focus{top:0}::selection{background-color:#e8f0fe;background-color:var(--primary-blue-light);color:#202124;color:var(--text-primary)}::-webkit-scrollbar{height:12px;width:12px}::-webkit-scrollbar-track{background:#f1f3f4;background:var(--gray-100)}::-webkit-scrollbar-thumb{background:#bdc1c6;background:var(--gray-400);border:3px solid #f1f3f4;border:3px solid var(--gray-100);border-radius:9999px;border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:#9aa0a6;background:var(--gray-500)}@media print{.cta-section,.footer,.hero-actions,.mobile-menu-btn,.navbar{display:none!important}body{background:#fff;color:#000;font-size:12pt}.container{max-width:100%;padding:0}.tool-card{border:1px solid #ccc;page-break-inside:avoid}a{color:#000;text-decoration:underline}}.gpu-accelerated{transform:translateZ(0);will-change:transform}.tooltip{display:inline-block;position:relative}.tooltip .tooltip-text{background-color:#202124;background-color:var(--gray-900);border-radius:6px;border-radius:var(--radius-sm);bottom:125%;color:#fff;font-size:.75rem;font-size:var(--text-xs);left:50%;opacity:0;padding:8px;padding:var(--space-sm);position:absolute;text-align:center;transform:translateX(-50%);transition:opacity .15s ease-in-out;transition:opacity var(--transition-fast);visibility:hidden;width:200px;z-index:400;z-index:var(--z-tooltip)}.tooltip:hover .tooltip-text{opacity:1;visibility:visible}.badge{border-radius:9999px;border-radius:var(--radius-full);font-size:.75rem;font-size:var(--text-xs);font-weight:500;padding:4px 8px;padding:var(--space-xs) var(--space-sm);white-space:nowrap}.badge-primary{background-color:#e8f0fe;background-color:var(--primary-blue-light);color:#1a73e8;color:var(--primary-blue)}.badge-success{background-color:#e6f4ea;background-color:var(--accent-green-light);color:#0f9d58;color:var(--accent-green)}.badge-warning{background-color:#fef7e0;background-color:var(--accent-yellow-light);color:#fbbc04;color:var(--accent-yellow)}.badge-danger{background-color:#fce8e6;background-color:var(--accent-red-light);color:#ea4335;color:var(--accent-red)}.alert{border:1px solid;border-radius:8px;border-radius:var(--radius-md);margin-bottom:16px;margin-bottom:var(--space-lg);padding:16px;padding:var(--space-lg)}.alert-info{background-color:#e8f0fe;background-color:var(--primary-blue-light);border-color:#1a73e8;border-color:var(--primary-blue);color:#1557b0;color:var(--primary-blue-dark)}.alert-success{background-color:#e6f4ea;background-color:var(--accent-green-light);border-color:#0f9d58;border-color:var(--accent-green);color:#0d7a3e}.alert-warning{background-color:#fef7e0;background-color:var(--accent-yellow-light);border-color:#fbbc04;border-color:var(--accent-yellow);color:#9c6e00}.alert-error{background-color:#fce8e6;background-color:var(--accent-red-light);border-color:#ea4335;border-color:var(--accent-red);color:#a82916}.table{border-collapse:collapse;margin-bottom:24px;margin-bottom:var(--space-xl);width:100%}.table td,.table th{border-bottom:1px solid #e8eaed;border-bottom:1px solid var(--border-light);padding:12px;padding:var(--space-md);text-align:left}.table th{background-color:#f1f3f4;background-color:var(--bg-tertiary);color:#202124;color:var(--text-primary);font-weight:600}.table tbody tr:hover{background-color:#f8f9fa;background-color:var(--bg-secondary)}.form-group{margin-bottom:24px;margin-bottom:var(--space-xl)}.form-label{color:#202124;color:var(--text-primary);display:block;font-size:.875rem;font-size:var(--text-sm);font-weight:500;margin-bottom:8px;margin-bottom:var(--space-sm)}.form-help{color:#80868b;color:var(--text-tertiary)}.form-error,.form-help{font-size:.75rem;font-size:var(--text-xs);margin-top:4px;margin-top:var(--space-xs)}.form-error{color:#ea4335;color:var(--accent-red)}.checkbox,.radio{align-items:center;cursor:pointer;display:flex;margin-bottom:8px;margin-bottom:var(--space-sm)}.checkbox input[type=checkbox],.radio input[type=radio]{cursor:pointer;margin-right:8px;margin-right:var(--space-sm)}.progress{background-color:#e8eaed;background-color:var(--gray-200);border-radius:9999px;border-radius:var(--radius-full);height:8px;overflow:hidden;width:100%}.progress-bar{background-color:#1a73e8;background-color:var(--primary-blue);height:100%;transition:width .3s ease-in-out ease-out;transition:width var(--transition-slow) ease-out}.divider{height:1px;margin:32px 0;margin:var(--space-2xl) 0}.divider,.divider-vertical{background-color:#e8eaed;background-color:var(--border-light)}.divider-vertical{height:100%;margin:0 16px;margin:0 var(--space-lg);width:1px}.list-inline,.list-unstyled{list-style:none;margin:0;padding:0}.list-inline{display:flex;flex-wrap:wrap;gap:16px;gap:var(--space-lg)}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:-webkit-sticky;position:sticky}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.font-mono{font-family:Roboto Mono,SF Mono,Monaco,Consolas,monospace;font-family:var(--font-mono)}.font-sans{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;font-family:var(--font-sans)}.shadow-none{box-shadow:none}.shadow{box-shadow:0 1px 2px 0 #3c40434d,0 1px 3px 1px #3c404326;box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:0 2px 6px 0 #3c40434d,0 10px 20px 4px #3c404326;box-shadow:var(--shadow-lg)}.border{border:1px solid #e8eaed;border:1px solid var(--border-light)}.border-2{border:2px solid #dadce0;border:2px solid var(--border-medium)}.border-t{border-top:1px solid #e8eaed;border-top:1px solid var(--border-light)}.border-b{border-bottom:1px solid #e8eaed;border-bottom:1px solid var(--border-light)}.border-l{border-left:1px solid #e8eaed;border-left:1px solid var(--border-light)}.border-r{border-right:1px solid #e8eaed;border-right:1px solid var(--border-light)}.rounded-none{border-radius:0}.rounded-sm{border-radius:6px;border-radius:var(--radius-sm)}.rounded{border-radius:8px;border-radius:var(--radius-md)}.rounded-lg{border-radius:12px;border-radius:var(--radius-lg)}.rounded-full{border-radius:9999px;border-radius:var(--radius-full)}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.opacity-100{opacity:1}.nav-mobile-only{display:none}.nav-desktop-only{display:block}@media (max-width:var(--screen-md )){.nav-mobile-only{display:block}.nav-desktop-only{display:none}.text-responsive-lg{font-size:1rem;font-size:var(--text-base)}.text-responsive-md{font-size:.875rem;font-size:var(--text-sm)}.text-responsive-sm{font-size:.75rem;font-size:var(--text-xs)}}.safe-area-top{padding-top:env(safe-area-inset-top)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom)}.safe-area-left{padding-left:env(safe-area-inset-left)}.safe-area-right{padding-right:env(safe-area-inset-right)}@media (max-height:500px) and (orientation:landscape){.navbar-container{height:48px}.mobile-menu{padding-top:60px}.mobile-nav-link{min-height:48px;padding:12px 16px;padding:var(--space-md) var(--space-lg)}}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.webtooler-logo{-webkit-tap-highlight-color:transparent;align-items:center;cursor:pointer;display:inline-flex;gap:var(--space-sm);text-decoration:none;-webkit-user-select:none;user-select:none}.webtooler-logo,.webtooler-logo-icon{position:relative;transition:all var(--transition-base)}.webtooler-logo-icon{height:36px;width:36px}.webtooler-logo-icon text{text-shadow:0 1px 2px #0000001a}.webtooler-logo-text{color:var(--text-primary);font-size:var(--text-xl);font-weight:600;letter-spacing:-.025em}.webtooler-logo-domain,.webtooler-logo-text{text-shadow:0 1px 1px #0000000d;transition:all var(--transition-base)}.webtooler-logo-domain{color:var(--primary-blue);font-size:var(--text-base);font-weight:400;opacity:.8}.webtooler-logo:hover{transform:scale(1.02)}.webtooler-logo:hover .webtooler-logo-icon{filter:brightness(1.1);transform:rotate(-5deg) scale(1.05)}.webtooler-logo:hover .webtooler-logo-text{background:linear-gradient(90deg,var(--primary-blue),var(--accent-green));-webkit-background-clip:text;background-clip:text;color:#0000;text-shadow:none}.webtooler-logo:hover .webtooler-logo-domain{color:var(--accent-green);opacity:1}.webtooler-logo:active{transform:scale(.98)}.webtooler-logo:active .webtooler-logo-icon{filter:brightness(.9);transform:rotate(0) scale(.95)}.webtooler-logo:active .webtooler-logo-text{transform:scale(.98)}.webtooler-logo--small .webtooler-logo-icon{height:28px;width:28px}.webtooler-logo--small .webtooler-logo-icon text{font-size:var(--text-sm)}.webtooler-logo--small .webtooler-logo-text{font-size:var(--text-lg)}.webtooler-logo--small .webtooler-logo-domain{font-size:var(--text-sm)}.webtooler-logo--large .webtooler-logo-icon{height:48px;width:48px}.webtooler-logo--large .webtooler-logo-icon text{font-size:var(--text-lg)}.webtooler-logo--large .webtooler-logo-text{font-size:var(--text-2xl)}.webtooler-logo--large .webtooler-logo-domain{font-size:var(--text-lg)}.webtooler-logo--auto{height:auto;width:-webkit-max-content;width:max-content}.webtooler-logo--light .webtooler-logo-text{color:#fff}.webtooler-logo--light .webtooler-logo-domain{color:#fffc}.webtooler-logo--light .webtooler-logo-icon text{text-shadow:0 1px 2px #0003}.webtooler-logo--dark .webtooler-logo-text{color:var(--text-primary)}.webtooler-logo--dark .webtooler-logo-domain{color:var(--text-secondary)}.webtooler-logo--dark .webtooler-logo-icon{box-shadow:0 2px 4px #0000004d,inset 0 1px 0 #ffffff1a}.webtooler-logo--monochrome .webtooler-logo-icon rect{fill:var(--text-primary)}.webtooler-logo--monochrome .webtooler-logo-icon text{fill:var(--bg-primary)}.webtooler-logo--monochrome .webtooler-logo-domain,.webtooler-logo--monochrome .webtooler-logo-text{color:var(--text-primary)}.webtooler-logo--inverted .webtooler-logo-icon rect{fill:url(#inverted-gradient)}.webtooler-logo--stacked,.webtooler-logo--vertical{flex-direction:column;gap:var(--space-xs);text-align:center}.webtooler-logo--stacked .webtooler-logo-domain,.webtooler-logo--stacked .webtooler-logo-text,.webtooler-logo--vertical .webtooler-logo-domain,.webtooler-logo--vertical .webtooler-logo-text{width:100%}.webtooler-logo--icon-only .webtooler-logo-domain,.webtooler-logo--icon-only .webtooler-logo-text,.webtooler-logo--text-only .webtooler-logo-icon{display:none}.webtooler-logo--text-only{gap:var(--space-xs)}@keyframes gradientShift{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes logoPulse{0%{box-shadow:0 2px 4px #0000001a,inset 0 1px 0 #fff3;transform:scale(1)}50%{box-shadow:0 4px 12px #3b82f64d,inset 0 1px 0 #ffffff4d;transform:scale(1.02)}to{box-shadow:0 2px 4px #0000001a,inset 0 1px 0 #fff3;transform:scale(1)}}@keyframes logoSpin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes textGlow{0%{text-shadow:0 0 2px var(--primary-blue)}50%{text-shadow:0 0 8px var(--accent-green)}to{text-shadow:0 0 2px var(--primary-blue)}}.webtooler-logo--animated .webtooler-logo-icon rect{fill:url(#animated-gradient)}.webtooler-logo--animated .webtooler-logo-icon{animation:gradientShift 3s ease infinite;background-size:300% 300%}.webtooler-logo--pulse .webtooler-logo-icon{animation:logoPulse 2s ease-in-out infinite}.webtooler-logo--loading .webtooler-logo-icon{animation:logoSpin 1s linear infinite}.webtooler-logo--animated .webtooler-logo-text{animation:textGlow 3s ease-in-out infinite}@media (max-width:768px){.webtooler-logo-text{font-size:var(--text-lg)}.webtooler-logo-domain{font-size:var(--text-sm)}.webtooler-logo--large .webtooler-logo-icon{height:40px;width:40px}.webtooler-logo--large .webtooler-logo-text{font-size:var(--text-xl)}.webtooler-logo:not(.webtooler-logo--icon-only):not(.webtooler-logo--text-only){gap:var(--space-xs)}}@media (min-width:1440px){.webtooler-logo-icon{height:40px;width:40px}.webtooler-logo-text{font-size:var(--text-2xl)}.webtooler-logo--large .webtooler-logo-icon{height:56px;width:56px}.webtooler-logo--large .webtooler-logo-text{font-size:var(--text-3xl)}}@media (prefers-reduced-motion:reduce){.webtooler-logo,.webtooler-logo *{animation:none;transition:none}}@media (prefers-contrast:high){.webtooler-logo-icon{border:2px solid var(--bg-primary);box-shadow:none}.webtooler-logo-domain,.webtooler-logo-text{font-weight:700;text-shadow:none}}@media print{.webtooler-logo-icon rect{fill:#000}.webtooler-logo-icon text{fill:#fff}.webtooler-logo-icon:before{display:none}.webtooler-logo-domain,.webtooler-logo-text{background:none;-webkit-background-clip:initial;background-clip:initial;color:#000}}@media (prefers-color-scheme:dark){.webtooler-logo-icon{box-shadow:0 2px 4px #0000004d,inset 0 1px 0 #ffffff1a}.webtooler-logo:hover .webtooler-logo-icon{box-shadow:0 4px 8px #0006,inset 0 1px 0 #fff3}.webtooler-logo-icon:before{background:linear-gradient(45deg,#0000,#ffffff14,#0000)}}.webtooler-logo:focus-visible{border-radius:var(--radius-sm);outline:2px solid var(--primary-blue);outline-offset:2px}.webtooler-logo:focus-visible .webtooler-logo-icon{box-shadow:0 4px 8px #00000026,inset 0 1px 0 #ffffff4d,0 0 0 2px var(--primary-blue)}[dir=rtl] .webtooler-logo{flex-direction:row-reverse}[dir=rtl] .webtooler-logo--stacked,[dir=rtl] .webtooler-logo--vertical{flex-direction:column}@media (hover:none){.webtooler-logo:hover .webtooler-logo-icon{transform:none}.webtooler-logo:active{transform:scale(.98)}}.footer .webtooler-logo{margin-bottom:var(--space-md)}.footer .webtooler-logo-text{color:var(--text-primary)}.footer .webtooler-logo-domain{color:var(--text-secondary)}.plagiarism-checker{background-color:#fff;border:1px solid #e8eaed;border:1px solid var(--google-gray-200);border-radius:12px;box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1200px;padding:30px}.plagiarism-checker h2{color:#202124;color:var(--google-gray-900);font-size:2.2em;font-weight:600;margin-bottom:30px;text-align:center}.plagiarism-checker form{gap:20px}.form-group,.plagiarism-checker form{display:flex;flex-direction:column}.form-group label{color:#3c4043;color:var(--google-gray-800);font-size:14px;font-weight:600;letter-spacing:.5px;margin-bottom:8px;text-transform:uppercase}.plagiarism-checker textarea{border:1px solid #dadce0;border:1px solid var(--google-gray-300);border-radius:8px;font-family:Inter,sans-serif;font-size:14px;line-height:1.5;padding:15px;resize:vertical;transition:all .2s ease;width:100%}.plagiarism-checker textarea:focus{border-color:#4285f4;border-color:var(--google-blue);box-shadow:0 0 0 3px #4285f41a;outline:none}.char-count{color:#9aa0a6;color:var(--google-gray-500);font-size:12px;margin-top:5px}.options-row{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr}.plagiarism-checker select{background-color:#fff;border:1px solid #dadce0;border:1px solid var(--google-gray-300);border-radius:8px;color:#3c4043;color:var(--google-gray-800);font-size:14px;padding:12px;transition:all .2s ease}.plagiarism-checker select:focus{border-color:#4285f4;border-color:var(--google-blue);outline:none}.plagiarism-checker button{background:#4285f4;background:var(--google-blue);border:none;border-radius:8px;box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;color:#fff;cursor:pointer;font-size:16px;font-weight:600;padding:15px 30px;transition:all .3s ease}.plagiarism-checker button:hover:not(:disabled){background:#3367d6;box-shadow:0 2px 6px 0 #3c40434d,0 8px 16px 6px #3c404326;transform:translateY(-2px)}.plagiarism-checker button:disabled{background:#dadce0;background:var(--google-gray-300);box-shadow:none;cursor:not-allowed;transform:none}.error-message{background-color:#ea4335;background-color:var(--google-red);color:#fff;margin-top:20px;padding:15px}.results-section{background-color:#f8f9fa;background-color:var(--google-gray-50);border:1px solid #e8eaed;border:1px solid var(--google-gray-200);margin-top:30px}.summary-cards{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px}.summary-card{background:#fff;border-left:4px solid;border-radius:12px;box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;padding:25px;text-align:center}.summary-card.unique{border-left-color:#34a853;border-left-color:var(--google-green)}.summary-card.plagiarized{border-left-color:#ea4335;border-left-color:var(--google-red)}.summary-card.overall{border-left-color:#fbbc05;border-left-color:var(--google-yellow)}.summary-card h3{color:#9aa0a6;color:var(--google-gray-500);font-size:14px;font-weight:600;letter-spacing:1px;margin:0 0 15px;text-transform:uppercase}.summary-card .percentage{color:#202124;color:var(--google-gray-900);font-size:2.5em;font-weight:700;margin:0}.detailed-analysis{background:#fff;border-radius:12px;box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;margin-bottom:25px;padding:25px}.detailed-analysis h3{color:#202124;color:var(--google-gray-900);font-size:1.3em;margin:0 0 20px}.analysis-stats{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.stat{align-items:center;background-color:#f8f9fa;background-color:var(--google-gray-50);display:flex;justify-content:space-between;padding:15px}.stat .label{color:#3c4043;color:var(--google-gray-800);font-weight:600}.stat .value{color:#202124;color:var(--google-gray-900);font-size:1.1em;font-weight:700}.sources-section{background:#fff;border-radius:12px;box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;padding:25px}.sources-section h3{color:#202124;color:var(--google-gray-900);font-size:1.3em;margin:0 0 25px}.source-item{background-color:#f8f9fa;background-color:var(--google-gray-50);border:1px solid #e8eaed;border:1px solid var(--google-gray-200);border-radius:10px;margin-bottom:20px;padding:20px;transition:all .3s ease}.source-item:hover{box-shadow:0 4px 15px #0000001a;transform:translateY(-2px)}.source-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:15px}.source-info{flex:1 1}.source-info a{color:#4285f4;color:var(--google-blue);font-size:16px;font-weight:600;line-height:1.4;text-decoration:none}.source-info a:hover{text-decoration:underline}.source-url{color:#9aa0a6;color:var(--google-gray-500);font-size:12px;margin-top:5px;word-break:break-all}.similarity-badge{border-radius:20px;color:#fff;font-size:14px;font-weight:700;min-width:60px;padding:8px 16px;text-align:center}.matched-text{background-color:#fff;border-left:4px solid #ea4335;border-left:4px solid var(--google-red);border-radius:8px;margin-top:15px;padding:15px}.matched-text strong{color:#202124;color:var(--google-gray-900);display:block;margin-bottom:10px}.matched-text p{color:#3c4043;color:var(--google-gray-800);font-style:italic;line-height:1.5;margin:0}.report-actions{border-top:2px solid #e8eaed;border-top:2px solid var(--google-gray-200);display:flex;gap:15px;justify-content:center;margin-top:30px;padding-top:25px}.btn-secondary{background-color:#fff;border:1px solid #dadce0;border:1px solid var(--google-gray-300);border-radius:8px;box-shadow:0 1px 3px 0 #3c40434d,0 4px 8px 3px #3c404326;color:#5f6368;color:var(--google-gray-700);cursor:pointer;font-weight:600;padding:12px 24px;transition:all .3s ease}.btn-secondary:hover{background-color:#f8f9fa;background-color:var(--google-gray-50);box-shadow:0 2px 6px 0 #3c40434d,0 8px 16px 6px #3c404326;transform:translateY(-1px)}@media (max-width:768px){.analysis-stats,.options-row,.summary-cards{grid-template-columns:1fr}.source-header{gap:10px}.report-actions,.source-header{flex-direction:column}}:root{--google-blue:#4285f4;--google-red:#ea4335;--google-yellow:#fbbc05;--google-green:#34a853;--google-gray-50:#f8f9fa;--google-gray-100:#f1f3f4;--google-gray-200:#e8eaed;--google-gray-300:#dadce0;--google-gray-500:#9aa0a6;--google-gray-700:#5f6368;--google-gray-800:#3c4043;--google-gray-900:#202124}.password-generator{background-color:#fff;background-color:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1000px;padding:30px}.password-generator h2{border-bottom:1px solid #e0e6ed;border-bottom:1px solid var(--border);color:#2c3e50;color:var(--text);font-size:1.8rem;font-weight:600;margin-bottom:30px;padding-bottom:15px;text-align:center}.password-display{display:flex;gap:12px;margin-bottom:20px}.password-display input{background:#fff;background:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);flex:1 1;font-family:Fira Code,monospace;font-size:1.1rem;padding:15px;transition:all .2s ease}.password-display input:focus{outline:none}.password-display input.manual-input,.password-display input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.password-actions{display:flex;gap:10px}.password-actions button{align-items:center;background:#fff;background:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:1.2rem;height:50px;justify-content:center;transition:all .2s ease;width:50px}.password-actions button:hover{background-color:#f1f3f4;transform:translateY(-1px)}.password-actions button.generate-again{background:#27ae60;background:var(--success);border:none;color:#fff;color:var(--white)}.password-actions button.generate-again:hover{background:#219653;background:var(--success-hover)}.password-info{background:#fff;background:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:8px;padding:15px}.strength-meter{margin-bottom:15px}.strength-meter span{color:#2c3e50;color:var(--text);display:block;font-size:.9rem;font-weight:500;margin-bottom:8px}.meter-bar{background-color:#edf2f7;border-radius:4px;height:8px;overflow:hidden}.meter-fill{border-radius:4px;height:100%;transition:width .3s ease}.crack-time{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:500}.generate-btn{background:#3498db;background:var(--primary);box-shadow:0 2px 5px #3498db33;font-size:1rem;font-weight:500;margin-bottom:25px}.generate-btn:hover{background:#2980b9;background:var(--primary-hover);box-shadow:0 4px 8px #3498db33;transform:translateY(-1px)}.generate-btn:active{transform:translateY(0)}.options-section{margin-bottom:25px}.section-header{background:#f8f9fa;background:var(--bg-light);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:8px;cursor:pointer;margin-bottom:5px;padding:15px 20px;transition:all .2s ease}.section-header:hover{background:#f1f3f4}.section-header h3{color:var(--text);font-weight:500;gap:10px}.section-header:after{content:"↓";font-size:1rem;transition:transform .2s ease}.section-header[aria-expanded=true]:after{transform:rotate(180deg)}.options-grid{grid-gap:15px;gap:15px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:15px}.option-group{background:#fff;background:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:8px;padding:20px;transition:all .2s ease}.option-group:hover{border-color:#3498db;border-color:var(--primary)}.option-group h4{color:#2c3e50;color:var(--text);font-size:1rem;font-weight:500;margin-bottom:15px;margin-top:0}.option-group input[type=checkbox]{-webkit-appearance:none;appearance:none;background:#e0e6ed;border-radius:20px;cursor:pointer;height:20px;margin-right:10px;position:relative;transition:background-color .2s ease;vertical-align:middle;width:40px}.option-group input[type=checkbox]:checked{background:#3498db;background:var(--primary)}.option-group input[type=checkbox]:after{background:#fff;background:var(--white);border-radius:50%;content:"";height:16px;left:2px;position:absolute;top:2px;transition:transform .2s ease;width:16px}.option-group input[type=checkbox]:checked:after{transform:translateX(20px)}.option-group label{align-items:center;cursor:pointer;display:flex;font-weight:400;gap:10px;margin-bottom:15px}.option-group input[type=number],.option-group input[type=text]{border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:6px;font-family:inherit;font-size:.9rem;padding:12px 15px;transition:all .2s ease;width:100%}.option-group input[type=number]:focus,.option-group input[type=text]:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.history-section,.password-list{background:#fff;background:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:8px;margin-bottom:25px;padding:20px}.history-section ul,.password-list ul{list-style:none;margin:20px 0 0;padding:0}.history-section li,.password-list li{align-items:center;background:#f8f9fa;background:var(--bg-light);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:6px;display:flex;font-family:Fira Code,monospace;font-size:.95rem;justify-content:space-between;margin-bottom:10px;padding:12px 15px}.history-section li button,.password-list li button{background:#fff;background:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:4px;color:#2c3e50;color:var(--text);cursor:pointer;font-size:.9rem;padding:6px 12px;transition:all .2s ease}.history-section li button:hover,.password-list li button:hover{background:#f1f3f4}.icon-btn{background:#27ae60;background:var(--success);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;font-weight:500;padding:10px 15px;transition:all .2s ease}.icon-btn:hover{background:#219653;background:var(--success-hover);transform:translateY(-1px)}.history-section .password{flex:1 1;margin-right:15px;overflow:hidden;text-overflow:ellipsis}.history-actions{align-items:center;gap:15px}.history-actions .timestamp{color:#7f8c8d;color:var(--text-light);font-family:sans-serif;font-size:.8rem}.floating-generate-btn{align-items:center;background:#3498db;background:var(--primary);border:none;border-radius:50%;bottom:30px;box-shadow:0 4px 12px #00000026;color:#fff;color:var(--white);cursor:pointer;display:none;font-size:.8rem;font-weight:500;height:60px;justify-content:center;position:fixed;right:30px;transition:all .2s ease;width:60px;z-index:100}.floating-generate-btn:hover{background:#2980b9;background:var(--primary-hover);transform:translateY(-2px) scale(1.05)}@media (max-width:900px){.password-generator,.result-container{padding:20px}.password-display{flex-direction:column}.password-actions{justify-content:space-between;width:100%}.password-actions button{flex:1 1}.options-grid{grid-template-columns:1fr}}@media (max-width:600px){.password-generator{margin:10px;padding:15px}.password-generator h2{font-size:1.5rem}.password-display input{font-size:1rem}.generate-btn{font-size:.9rem;padding:14px}.section-header h3{font-size:1rem}.option-group{padding:15px}.floating-generate-btn{display:flex}.history-section li,.password-list li{align-items:flex-start;flex-direction:column;gap:10px}.history-actions{justify-content:space-between;width:100%}}.seo-article h1,.seo-article h2,.seo-article h3,.seo-article h4,.seo-article h5,.seo-article h6{color:#2c3e50;color:var(--text);text-align:left}.seo-article strong{color:#2c3e50;color:var(--text)}.seo-article em{font-style:italic}.seo-article a{color:#3498db;color:var(--primary);text-decoration:none;transition:all .2s ease}.seo-article a:hover{color:#2980b9;color:var(--primary-hover);text-decoration:underline}.seo-article img{border-radius:8px;height:auto;margin:25px 0;max-width:100%}.seo-article table{border-collapse:collapse;margin:25px 0;text-align:left;width:100%}.seo-article td,.seo-article th{border:1px solid #e0e6ed;border:1px solid var(--border);padding:12px 15px}.seo-article th{background-color:#3498db1a;font-weight:600}.seo-article pre{background:#f8f8f8;margin:25px 0;padding:20px}.seo-article code{background:#0000000d;border-radius:4px;font-family:monospace;font-size:.9em;padding:2px 4px}@media (max-width:480px){.seo-article{border-radius:12px;font-size:1rem;margin:30px 0 15px;padding:25px 20px}.seo-article h2{font-size:1.5rem;margin-bottom:20px}.seo-article h3{font-size:1.3rem;margin:35px 0 15px}.seo-article h4{font-size:1.15rem;margin:25px 0 12px}.seo-article p{margin-bottom:20px}.seo-article ol,.seo-article ul{margin-bottom:25px;padding-left:20px}.seo-article li{margin-bottom:10px;padding-left:20px}.highlight-box{padding:15px}blockquote{padding:10px 15px}}.summarizer-header{margin-bottom:30px;text-align:center}.summarizer-header h1{color:var(--text);font-size:2rem;font-weight:700;margin-bottom:8px}.subtitle{font-size:1rem;margin:0}.input-section{margin-bottom:25px}.input-header{margin-bottom:10px}.input-label{color:var(--text);font-size:1rem;font-weight:500}.text-stats{gap:15px}.stat-item{border-radius:12px;color:var(--text-light);padding:4px 10px}.input-container{margin-bottom:15px}.text-input{border:1px solid var(--border);font-family:inherit;font-size:1rem;min-height:150px;padding:15px;transition:all .2s ease}.text-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.input-actions{gap:10px;margin-top:10px}.file-input{display:none}.action-btn{background:var(--bg-light);border:1px solid var(--border);color:var(--text);padding:10px 15px;transition:all .2s ease}.action-btn:hover{background:#e9ecef}.action-btn:disabled{cursor:not-allowed;opacity:.6}.action-btn.secondary{background:var(--bg-light)}.url-indicator{margin-top:10px}.url-badge{background:#3498db1a;border-radius:12px;color:var(--primary);font-size:.85rem;padding:4px 10px}.controls-section{border-radius:8px;margin-bottom:25px;padding:20px}.controls-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:15px}.controls-header h3{color:var(--text);font-size:1.1rem;margin:0}.toggle-advanced{background:none;border:none;border-radius:4px;padding:5px 10px;transition:all .2s ease}.toggle-advanced:hover{background:#3498db1a}.controls-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.control-group{margin-bottom:15px}.control-group label{margin-bottom:8px}.control-select{background:var(--white);border:1px solid var(--border);border-radius:6px;color:var(--text);cursor:pointer;font-family:inherit;font-size:.9rem;padding:10px 12px;transition:all .2s ease;width:100%}.control-select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.slider-labels{color:var(--text-light);display:flex;font-size:.8rem;justify-content:space-between;margin-top:5px}.action-section{margin-bottom:25px}.summarize-btn{background:var(--primary);border:none;border-radius:6px;box-shadow:0 2px 5px #3498db33;color:#fff;cursor:pointer;font-size:1rem;font-weight:500;padding:12px 24px;transition:all .2s ease}.summarize-btn:hover{background:var(--primary-hover);box-shadow:0 4px 8px #3498db33;transform:translateY(-1px)}.summarize-btn:disabled{background:#bdc3c7;box-shadow:none;cursor:not-allowed;transform:none}.keyboard-hint{color:var(--text-light);font-size:.85rem;margin-top:15px}.error-section{margin-bottom:25px}.error-message{background:#fdecea;border-radius:6px;color:#c62828;padding:12px 15px}.error-icon{font-size:1.1rem}.results-section{animation:fadeIn .4s ease-out;border-radius:8px;margin-bottom:25px;padding:20px}.results-header{margin-bottom:15px}.results-header h3{color:var(--text)}.result-stats{display:flex;flex-wrap:wrap;gap:10px}.stat-badge{background:var(--bg-light);border-radius:12px;color:var(--text-light);font-size:.8rem;padding:4px 10px}.summary-content{color:var(--text);line-height:1.6;margin-bottom:20px}.summary-content p{margin:0 0 10px}.bullet-format p{padding-left:20px;position:relative}.bullet-format p:before{color:var(--primary);content:"•";left:0;position:absolute}.keywords-section{margin:20px 0}.keywords-section h4{color:var(--text);font-size:1rem;margin:0 0 10px}.keywords-container{display:flex;flex-wrap:wrap;gap:8px}.keyword-tag{background:#3498db1a;border-radius:12px;color:var(--primary);font-size:.85rem;padding:4px 12px}.statistics-section{margin:20px 0}.statistics-section h4{color:var(--text);font-size:1rem;margin:0 0 15px}.stats-grid{grid-gap:15px;gap:15px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.stat-value{color:var(--text)}.export-actions{gap:10px;margin-top:20px}.export-btn{background:var(--bg-light);border:1px solid var(--border);border-radius:6px;font-size:.9rem;gap:6px;padding:8px 15px;transition:all .2s ease}.export-btn:hover{background:#e9ecef}.floating-action-btn:disabled{background:#bdc3c7;transform:none}.spinner{animation:spin 1s ease-in-out infinite;border:2px solid #ffffff4d;border-top-color:#fff;display:inline-block;margin-right:8px}@media (max-width:768px){.controls-grid{grid-template-columns:1fr}.export-actions{flex-wrap:wrap}.floating-action-btn{align-items:center;display:flex;justify-content:center}}@media (max-width:480px){.input-header{align-items:flex-start;flex-direction:column;gap:8px}.input-actions{flex-wrap:wrap}.stats-grid{grid-template-columns:1fr}}:root{--success:#27ae60;--success-hover:#219653;--border:#e0e6ed;--bg-light:#f8f9fa;--weak:#ff4d4d;--medium:#f9cb28;--strong:#34a853;--dark-bg:#1a1a1a;--dark-text:#f0f0f0;--dark-border:#333;--dark-bg-light:#2d2d2d}.text-case-converter{background-color:#fff;background-color:var(--white);border:1px solid #e0e6ed;border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1000px;padding:30px}.text-case-converter.dark-mode{background-color:#1a1a1a;background-color:var(--dark-bg);border-color:#333;border-color:var(--dark-border);color:#f0f0f0;color:var(--dark-text)}.text-case-converter h2{border-bottom:1px solid #e0e6ed;border-bottom:1px solid var(--border);color:#2c3e50;color:var(--text);font-size:1.8rem;font-weight:600;margin-bottom:30px;padding-bottom:15px;text-align:center}.dark-mode h2{border-bottom-color:#333;border-bottom-color:var(--dark-border);color:#f0f0f0;color:var(--dark-text)}.result-container{background:#f8f9fa;border:1px solid #e0e6ed}.dark-mode .result-container{background:#2d2d2d;border-color:#333}select{background-color:#fff;border:1px solid #e0e6ed;color:#2c3e50}select:focus{border-color:#3498db}.dark-mode select{background-color:#2d2d2d;border-color:#333;color:#f0f0f0}textarea{background:#fff;border:1px solid #e0e6ed;color:#2c3e50}textarea:focus{border-color:#3498db}.dark-mode textarea{background-color:#2d2d2d;border-color:#333;color:#f0f0f0}.stats{color:#7f8c8d}.stats span:before{background-color:#3498db}.dark-mode .stats{color:#7f8c8d}.file-import,button{background-color:#3498db;color:#fff}.file-import:hover,button:hover{background-color:#2980b9}button.secondary{background-color:#f8f9fa;border:1px solid #e0e6ed}.dark-mode button.secondary{background-color:#1a1a1a;border-color:#333;color:#f0f0f0}button.secondary:hover{background-color:#e0e6ed}.dark-mode button.secondary:hover{background-color:#333}button.tertiary{background-color:initial;border:1px solid #0000}.dark-mode button.tertiary,button.tertiary{color:#3498db;color:var(--primary)}button.tertiary:hover{background-color:#3498db1a}.dark-mode button.tertiary:hover{background-color:#3498db33}.file-import{background-color:#27ae60;background-color:var(--success)}.file-import:hover{background-color:#219653;background-color:var(--success-hover)}.history{background:#fff;border:1px solid #e0e6ed}.dark-mode .history{background:#2d2d2d;border-color:#333}.history h3{color:#2c3e50}.dark-mode .history h3{color:#f0f0f0}.history li{background-color:#f8f9fa;border:1px solid #e0e6ed}.dark-mode .history li{background-color:#1a1a1a;border-color:#333}.history p{color:#2c3e50}.dark-mode .history p{color:#f0f0f0}.history button{background-color:#7f8c8d}.history button:hover{background-color:#2c3e50}.floating-action-btn{align-items:center;background:#3498db;background:var(--primary);border:none;border-radius:50%;bottom:30px;box-shadow:0 4px 12px #00000026;color:#fff;color:var(--white);cursor:pointer;display:none;font-size:1.5rem;height:60px;justify-content:center;position:fixed;right:30px;transition:all .2s ease;width:60px;z-index:100}.floating-action-btn:hover{background:#2980b9;background:var(--primary-hover);box-shadow:0 6px 16px #0003;transform:translateY(-2px) scale(1.05)}.floating-action-btn:active{transform:translateY(0) scale(.98)}.floating-action-btn:focus{box-shadow:0 0 0 3px #3498db4d,0 4px 12px #00000026;outline:none}@media (max-width:900px){.result-container,.text-case-converter{padding:20px}.controls{align-items:stretch;flex-direction:column}select{max-width:100%}.actions{justify-content:center}}@media (max-width:600px){.text-case-converter{margin:10px;padding:15px}.text-case-converter h2{font-size:1.5rem}textarea{font-size:.9rem;min-height:150px}.file-import,button{font-size:.9rem;min-height:44px;padding:10px 18px}.history{padding:15px}.floating-action-btn{bottom:20px;display:flex;height:56px;right:20px;width:56px}}.seo-article{border:1px solid #e0e6ed}.dark-mode .seo-article{background:#2d2d2d;border-color:#333;color:#f0f0f0}.seo-article:before{background:linear-gradient(90deg,#3498db,#27ae60)}.seo-article h2,.seo-article h3,.seo-article h4{color:#2c3e50}.dark-mode .seo-article h2,.dark-mode .seo-article h3,.dark-mode .seo-article h4{color:#f0f0f0}.seo-article h2:after{background:#3498db}.seo-article p{color:#2c3e50}.dark-mode .seo-article p{color:#f0f0f0}.seo-article blockquote{border-left:4px solid #3498db}.seo-article li{color:#2c3e50}.dark-mode .seo-article li{color:#f0f0f0}.seo-article ol li:before,.seo-article ul li:before{color:#3498db}.seo-article .highlight-box{border-left:4px solid #3498db}.file-import-button{background-color:#27ae60;background-color:var(--success);box-shadow:0 2px 4px #0000000d;display:inline-flex;font-family:inherit;font-size:.95rem;font-weight:600;justify-content:center;line-height:1;min-height:48px;padding:12px 24px;position:relative;transition:all .2s ease}.file-import-button:hover{background-color:#219653;background-color:var(--success-hover);box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.file-import-button:active{box-shadow:0 2px 4px #0000000d;transform:translateY(0)}.file-import-button:focus{box-shadow:0 0 0 3px #27ae604d;outline:none}.file-import-button:disabled{cursor:not-allowed;opacity:.6;transform:none!important}.file-import-button input[type=file]{cursor:pointer;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.dark-mode .file-import-button{background-color:#27ae60;background-color:var(--success)}.dark-mode .file-import-button:hover{background-color:#219653;background-color:var(--success-hover)}@media (max-width:600px){.file-import-button{font-size:.9rem;min-height:44px;padding:10px 18px}}.character-word-counter{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1000px;padding:30px}.character-word-counter.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.character-word-counter h2{border-bottom:1px solid var(--border);color:var(--text);font-size:1.8rem;font-weight:600;margin-bottom:30px;padding-bottom:15px;text-align:center}.dark-mode .character-word-counter h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.text-input-container{margin-bottom:25px}.text-input-container textarea{border-radius:8px;font-family:inherit;font-size:1rem;min-height:250px;padding:15px;transition:all .2s ease;width:100%}.dark-mode .text-input-container textarea{background-color:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text)}.text-input-container textarea:focus{outline:none}.stats-grid{margin-bottom:25px}.stat-card{background:var(--bg-light);border-radius:10px}.dark-mode .stat-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.stat-value{font-size:2.2rem;line-height:1.2;margin:10px 0}.dark-mode .stat-value{color:var(--primary)}.stat-label{font-size:.95rem}.dark-mode .stat-label{color:var(--text-light)}.controls{flex-wrap:wrap}.option-group{align-items:center;gap:10px}.option-group label{font-size:.95rem}.dark-mode .option-group label{color:var(--dark-text)}.seo-section{background:var(--white);border:1px solid var(--border);border-radius:10px;margin-top:30px;padding:25px}.dark-mode .seo-section{background:var(--dark-bg-light);border-color:var(--dark-border)}.seo-section h3{color:var(--text);font-size:1.3rem;margin-bottom:20px;margin-top:0}.dark-mode .seo-section h3{color:var(--dark-text)}.keywords-grid{gap:12px}.keyword-pill{gap:6px}.keyword-count,.keyword-pill{align-items:center;display:flex}.keyword-count{background:var(--primary);border-radius:50%;color:var(--white);font-size:.75rem;height:24px;justify-content:center;width:24px}.actions{margin-top:20px}@media (max-width:768px){.character-word-counter{padding:20px}.stats-grid{grid-template-columns:1fr 1fr}.controls{align-items:flex-start;flex-direction:column}}@media (max-width:480px){.character-word-counter{padding:15px}.stats-grid{grid-template-columns:1fr}.stat-value{font-size:1.8rem}}.seo-article.dark-mode{background:var(--dark-bg-light)}.seo-article h2,.seo-article h3,.seo-article h4{color:var(--text);text-align:left}.dark-mode .seo-article h2,.dark-mode .seo-article h3,.dark-mode .seo-article h4{color:var(--dark-text)}.seo-article blockquote{background:#3498db14;border-left:4px solid var(--primary);font-style:italic;margin:25px 0;padding:15px 20px;text-align:left}.dark-mode .seo-article blockquote{background:#3498db26}.seo-article .highlight-box{background:#3498db14;border-left:4px solid var(--primary);border-radius:0 8px 8px 0;margin:25px 0;padding:20px;text-align:left}.dark-mode .seo-article .highlight-box{background:#3498db26}.seo-article .highlight-box h4{margin-top:0}@media (max-width:768px){.seo-article{margin:40px 0 20px;padding:30px}.seo-article h2{font-size:1.7rem;margin-bottom:25px}.seo-article h3{font-size:1.4rem;margin:40px 0 18px}.seo-article h4{font-size:1.2rem;margin:30px 0 15px}.seo-article ol,.seo-article ul{padding-left:25px}}@media (max-width:480px){.seo-article{border-radius:12px;font-size:1rem;margin:30px 0 15px;padding:25px 20px}.seo-article h2{font-size:1.5rem;margin-bottom:20px}.seo-article h3{font-size:1.3rem;margin:35px 0 15px}.seo-article h4{font-size:1.15rem;margin:25px 0 12px}.seo-article p{margin-bottom:20px}.seo-article ol,.seo-article ul{margin-bottom:25px;padding-left:20px}.seo-article li{margin-bottom:10px;padding-left:20px}.highlight-box{padding:15px}}.text-reverser{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1000px;padding:30px}.text-reverser.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.text-reverser h2{border-bottom:1px solid var(--border);color:var(--text);font-size:1.8rem;font-weight:600;margin-bottom:30px;padding-bottom:15px;text-align:center}.dark-mode .text-reverser h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.controls{align-items:center;gap:15px;justify-content:space-between;margin-bottom:20px}select{-webkit-appearance:none;appearance:none;background-color:var(--white);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);background-position:right 12px center;background-repeat:no-repeat;background-size:16px;border:1px solid var(--border);border-radius:8px;color:var(--text);flex:1 1;font-family:inherit;font-size:.95rem;max-width:300px;padding:12px 15px;transition:all .2s ease}select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.dark-mode select{background-color:var(--dark-bg-light);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);border-color:var(--dark-border);color:var(--dark-text)}.text-areas{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr;margin-bottom:20px}@media (max-width:768px){.text-areas{grid-template-columns:1fr}}textarea{background:var(--white);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:Fira Code,monospace,sans-serif;font-size:.95rem;min-height:200px;padding:15px;resize:vertical;transition:all .2s ease;width:100%}textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.dark-mode textarea{background-color:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text)}.stats{color:var(--text-light);display:flex;flex-wrap:wrap;font-size:.9rem;gap:20px;margin-bottom:20px}.stats span{align-items:center;display:flex;gap:5px}.stats span:before{background-color:var(--primary);border-radius:50%;content:"";display:inline-block;height:8px;width:8px}.dark-mode .stats{color:var(--text-light)}.actions{margin-bottom:20px}.file-import,button{align-items:center;background-color:var(--primary);border:none;border-radius:8px;box-shadow:0 2px 4px #0000000d;color:var(--white);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;line-height:1;min-height:48px;padding:12px 24px;transition:all .2s ease}.file-import:hover,button:hover{background-color:var(--primary-hover);box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.file-import:active,button:active{box-shadow:0 2px 4px #0000000d;transform:translateY(0)}.file-import:focus,button:focus{box-shadow:0 0 0 3px #3498db4d;outline:none}.file-import:disabled,button:disabled{cursor:not-allowed;opacity:.6;transform:none!important}.dark-mode button.secondary{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}button.secondary:hover{background-color:var(--border)}.dark-mode button.secondary:hover{background-color:var(--dark-border)}.history h3{align-items:center;color:var(--text);display:flex;font-size:1.3rem;gap:10px;margin-bottom:20px;margin-top:0}.dark-mode .history h3{color:var(--dark-text)}.history small{margin-bottom:5px}.history button{background-color:var(--text-light);font-size:.85rem;min-height:36px;padding:8px 16px}.history button:hover{background-color:var(--text)}@media (max-width:900px){.result-container,.text-reverser{padding:20px}.controls{align-items:stretch;flex-direction:column}select{max-width:100%}.actions{justify-content:center}}@media (max-width:600px){.text-reverser{margin:10px;padding:15px}.text-reverser h2{font-size:1.5rem}textarea{font-size:.9rem;min-height:150px}.file-import,button{font-size:.9rem;min-height:44px;padding:10px 18px}.history{padding:15px}}.seo-article:before{background:linear-gradient(90deg,var(--primary),var(--success));border-radius:16px 16px 0 0;content:"";height:4px;left:0;position:absolute;right:0;top:0}.seo-article h2,.seo-article h3,.seo-article h4,.seo-article h5{color:var(--text);text-align:left}.dark-mode .seo-article h2,.dark-mode .seo-article h3,.dark-mode .seo-article h4,.dark-mode .seo-article h5{color:var(--dark-text)}.seo-article h2{font-size:2rem;margin:0 0 30px;position:relative}.seo-article h2:after{background:var(--primary);bottom:0;content:"";height:3px;left:0;position:absolute;width:60px}.seo-article h3{line-height:1.4;margin:45px 0 20px}.seo-article h4{margin:35px 0 15px}.seo-article h5{font-size:1.1rem;font-weight:500;margin:25px 0 10px}.seo-article p{margin:0 0 25px}.seo-article pre{background:#3498db14;border-radius:8px;font-family:Fira Code,monospace;margin:15px 0;overflow-x:auto;padding:15px}.dark-mode .seo-article pre{background:#3498db26}.seo-article ol,.seo-article ul{list-style:none;margin:0 0 30px;padding-left:30px}.seo-article li{margin:0 0 12px;padding-left:25px;position:relative}.seo-article ul li:before{color:var(--primary);content:"•";font-weight:700;left:5px;position:absolute}.seo-article ol{counter-reset:item}.seo-article ol li:before{color:var(--primary);content:counter(item) ".";counter-increment:item;font-weight:700;left:0;position:absolute}.feature-card{background:#3498db14;border-left:4px solid var(--primary);border-radius:0 8px 8px 0;padding:20px}.dark-mode .feature-card{background:#3498db26}.example-box{background:#ffffff80;margin-top:15px;padding:15px}.dark-mode .example-box{background:#0003}.dark-mode .keywords{color:var(--text-light)}.feature-grid,.use-case-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.use-case-grid{margin:30px 0}.use-case-card{background:#27ae600d;padding:20px}.dark-mode .use-case-card{background:#27ae601a}.example-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin:30px 0}.example-item{background:#f1c40f0d}.dark-mode .example-item{background:#f1c40f1a}.example-sentence{background:#9b59b60d;border-radius:8px;font-family:Fira Code,monospace;margin:20px 0;padding:15px}.dark-mode .example-sentence{background:#9b59b61a}.keyword-pill{background:#3498db26;border-radius:50px;color:var(--primary);font-size:.9rem}.dark-mode .keyword-pill{background:#3498db40}.faq-item{background:#e74c3c0d}.dark-mode .faq-item{background:#e74c3c1a;border-color:var(--dark-border)}.longtail-keywords{background:#2980b90d;border-radius:8px;margin:20px 0;padding:20px}.dark-mode .longtail-keywords{background:#2980b91a}.longtail-keywords p{font-family:Fira Code,monospace;font-size:.95rem;margin:5px 0}@media (max-width:768px){.seo-article{margin:40px 0 20px;padding:30px}.seo-article h2{font-size:1.7rem;margin-bottom:25px}.seo-article h3{font-size:1.4rem;margin:40px 0 18px}.seo-article h4{font-size:1.2rem;margin:30px 0 15px}.example-grid,.feature-grid,.use-case-grid{grid-template-columns:1fr}}@media (max-width:480px){.seo-article{border-radius:12px;font-size:1rem;margin:30px 0 15px;padding:25px 20px}.seo-article h2{font-size:1.5rem;margin-bottom:20px}.seo-article h3{font-size:1.3rem;margin:35px 0 15px}.seo-article h4{font-size:1.15rem;margin:25px 0 12px}.seo-article p{margin-bottom:20px}}.lorem-generator{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1000px;padding:30px}.lorem-generator.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.lorem-generator h2{border-bottom:1px solid var(--border);color:var(--text);font-size:1.8rem;font-weight:600;margin-bottom:30px;padding-bottom:15px;text-align:center}.dark-mode .lorem-generator h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.result-container{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;margin-bottom:25px;padding:25px}.dark-mode .result-container{background:var(--dark-bg-light);border-color:var(--dark-border)}.controls{grid-gap:20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-bottom:25px}.dark-mode .setting-group label{color:var(--dark-text)}.setting-group input[type=text],.setting-group select{background-color:var(--white);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:inherit;font-size:.95rem;padding:12px 15px;transition:all .2s ease}.dark-mode .setting-group input[type=text],.dark-mode .setting-group select{background-color:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text)}.setting-group input[type=text]:focus,.setting-group select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.styling-options{display:flex;flex-wrap:wrap;gap:15px;margin-top:10px}.styling-options label{align-items:center;display:flex;font-weight:400;gap:5px}.advanced-settings{grid-gap:20px;background:#3498db0d;border-left:4px solid var(--primary);display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-bottom:25px}.dark-mode .advanced-settings{background:#3498db1a}.generate-button{margin-bottom:20px;padding:15px;transition:all .2s ease;width:100%}.generate-button:hover{background-color:var(--primary-hover);transform:translateY(-2px)}.output-container{margin-bottom:20px}.output-container textarea{background:var(--white);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:Fira Code,monospace,sans-serif;font-size:.95rem;min-height:200px;padding:15px;resize:vertical;transition:all .2s ease;width:100%}.dark-mode .output-container textarea{background-color:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text)}.output-container textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.actions{display:flex;flex-wrap:wrap;gap:12px}.actions button{align-items:center;background-color:var(--primary);border:none;border-radius:8px;box-shadow:0 2px 4px #0000000d;color:var(--white);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;line-height:1;min-height:48px;padding:12px 24px;transition:all .2s ease}.actions button:hover{background-color:var(--primary-hover);box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.actions button:disabled{cursor:not-allowed;opacity:.6;transform:none!important}.actions button.secondary{background-color:var(--bg-light);border:1px solid var(--border);color:var(--text)}.dark-mode .actions button.secondary{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.actions button.secondary:hover{background-color:var(--border)}.dark-mode .actions button.secondary:hover{background-color:var(--dark-border)}.history{background:var(--white);margin-top:30px;padding:25px}.dark-mode .history{background:var(--dark-bg-light);border-color:var(--dark-border)}.history li{margin-bottom:12px;padding:15px;transition:all .2s ease}.history li:hover{box-shadow:0 2px 8px #0000000d;transform:translateY(-2px)}.dark-mode .history li{background-color:var(--dark-bg);border-color:var(--dark-border)}.history-info{font-size:.85rem;gap:10px;margin-bottom:5px}.dark-mode .history-info{color:var(--text-light)}.history p{color:var(--text);font-size:.95rem;line-height:1.5;margin:8px 0;word-break:break-word}.dark-mode .history p{color:var(--dark-text)}.history small{font-size:.8rem}.history-actions button{background-color:var(--text-light);font-size:.85rem;padding:8px 16px}.history-actions button:hover{background-color:var(--text)}@media (max-width:900px){.lorem-generator,.result-container{padding:20px}.advanced-settings,.controls{grid-template-columns:1fr}}@media (max-width:600px){.lorem-generator{margin:10px;padding:15px}.lorem-generator h2{font-size:1.5rem}.styling-options{align-items:flex-start;gap:8px}.actions,.styling-options{flex-direction:column}.actions button{width:100%}}:root{--editor-border:#fffacd;--editor-border-focus:#fff176;--danger-hover:#c0392b}.dark-mode{--editor-border:#5d4037;--editor-border-focus:#8d6e63}.markdown-previewer{background-color:#fff;background-color:var(--white);border:1px solid #e0e0e0;border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;box-sizing:border-box;display:flex;flex-direction:column;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1200px;min-height:80vh;padding:20px}.markdown-previewer.dark-mode{background-color:#2c3e50;background-color:var(--dark-bg);border-color:#7f8c8d;border-color:var(--dark-border);color:#ecf0f1;color:var(--dark-text)}.markdown-previewer.fullscreen{border:none;border-radius:0;bottom:0;left:0;margin:0;max-width:none;min-height:100vh;overflow:auto;padding:15px;position:fixed;right:0;top:0;width:100%;z-index:1000}.tool-header{align-items:flex-start;border-bottom:1px solid #e0e0e0;border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;margin-bottom:20px;padding-bottom:15px}.dark-mode .tool-header{border-bottom-color:#7f8c8d;border-bottom-color:var(--dark-border)}.tool-header h2{color:#2c3e50;color:var(--text);flex-grow:1;font-size:1.8rem;margin:0;text-align:left}.dark-mode .tool-header h2{color:#ecf0f1;color:var(--dark-text)}.tool-header>div:first-child{flex-grow:1;min-width:250px}.tool-actions{display:flex;flex-wrap:wrap;gap:10px}.tool-actions button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;gap:5px;padding:8px 12px;transition:background-color .2s ease,transform .2s ease}.tool-actions button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.search-panel{background-color:#3498db1a;border-left:4px solid #3498db;border-left:4px solid var(--primary);border-radius:8px;box-shadow:0 2px 8px #0000000d;margin-bottom:15px;padding:15px}.dark-mode .search-panel{background-color:#3498db26}.search-controls{display:flex;flex-wrap:wrap;gap:10px}.search-input{background-color:#fff;background-color:var(--white);border:1px solid #e0e0e0;border-radius:6px;box-sizing:border-box;flex-grow:1;font-family:Inter,sans-serif;min-width:200px;padding:8px 12px;transition:border-color .2s ease,box-shadow .2s ease}.search-input:focus{box-shadow:0 0 0 3px #3498db33}.search-input::placeholder{color:#7f8c8d;color:var(--text-light);opacity:.8}.dark-mode .search-input{background-color:#34495e;background-color:var(--dark-bg-light);border-color:#7f8c8d;border-color:var(--dark-border);color:#ecf0f1;color:var(--dark-text)}.dark-mode .search-input::placeholder{color:#bdc3c7;color:var(--dark-text-light)}.replace-button,.search-button{border:none;border-radius:6px;cursor:pointer;font-family:Inter,sans-serif;font-weight:500;padding:8px 16px;transition:background-color .2s ease,transform .2s ease}.search-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.search-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.replace-button{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white)}.replace-button:hover{background-color:#c0392b;background-color:var(--danger-hover);transform:translateY(-1px)}.tab-controls{border-bottom:1px solid #e0e0e0;border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;margin-bottom:15px}.dark-mode .tab-controls{border-bottom-color:#7f8c8d;border-bottom-color:var(--dark-border)}.tab-button{background:none;border:none;border-bottom:2px solid #0000;color:#7f8c8d;color:var(--text-light);font-family:Inter,sans-serif;font-size:1rem;gap:5px;padding:10px 20px;transition:color .2s ease,border-bottom-color .2s ease}.tab-button:hover{color:#2c3e50;color:var(--text)}.dark-mode .tab-button{color:#bdc3c7;color:var(--dark-text-light)}.dark-mode .tab-button:hover{color:#ecf0f1;color:var(--dark-text)}.tab-button.active{border-bottom-color:#3498db;border-bottom-color:var(--primary);color:#3498db;color:var(--primary);font-weight:600}.formatting-toolbar{align-items:center;border-bottom:1px solid #e0e0e0;border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;gap:8px;margin-bottom:15px;padding:10px 0}.dark-mode .formatting-toolbar{border-bottom-color:#7f8c8d;border-bottom-color:var(--dark-border)}.format-btn{background-color:#f5f6fa;background-color:var(--bg-light);border:none;border-radius:4px;color:#2c3e50;color:var(--text);cursor:pointer;font-family:Inter,sans-serif;font-size:.9rem;padding:6px 10px;transition:background-color .2s ease}.dark-mode .format-btn{background-color:#34495e;background-color:var(--dark-bg-light);color:#ecf0f1;color:var(--dark-text)}.format-btn:hover{background-color:#e0e0e0;background-color:var(--border)}.dark-mode .format-btn:hover{background-color:#7f8c8d;background-color:var(--dark-border)}.font-controls{align-items:center;display:flex;font-family:Inter,sans-serif;font-size:.9rem;gap:8px;margin-left:auto}.font-slider{width:100px}.editor-container{display:flex;flex-grow:1;gap:20px;min-height:300px;overflow:hidden}.split-view{display:grid;grid-template-columns:1fr 1fr;height:100%}.markdown-editor{background:#fff;background:var(--white);border:2px solid #fffacd;border:2px solid var(--editor-border);border-radius:8px;box-sizing:border-box;color:#2c3e50;color:var(--text);font-family:Fira Code,monospace;height:100%;line-height:1.6;min-height:300px;overflow:auto;padding:15px;resize:none;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.markdown-editor:focus{border-color:#fff176;border-color:var(--editor-border-focus);box-shadow:0 0 0 3px #fff17666;outline:none}.markdown-editor::placeholder{color:#7f8c8d;color:var(--text-light);font-style:italic;opacity:1}.dark-mode .markdown-editor{background-color:#34495e;background-color:var(--dark-bg-light);border-color:#fffacd;border-color:var(--editor-border);color:#ecf0f1;color:var(--dark-text)}.dark-mode .markdown-editor::placeholder{color:#bdc3c7;color:var(--dark-text-light)}.markdown-preview{background:#fff;background:var(--white);border:1px solid #e0e0e0;border:1px solid var(--border);border-radius:8px;box-sizing:border-box;color:#2c3e50;color:var(--text);font-family:Inter,sans-serif;height:100%;line-height:1.6;min-height:300px;overflow:auto;padding:15px;width:100%}.dark-mode .markdown-preview{background-color:#34495e;background-color:var(--dark-bg-light);border-color:#7f8c8d;border-color:var(--dark-border);color:#ecf0f1;color:var(--dark-text)}.markdown-previewer.fullscreen .markdown-editor,.markdown-previewer.fullscreen .markdown-preview{min-height:calc(100vh - 300px)}.markdown-preview h1,.markdown-preview h2,.markdown-preview h3,.markdown-preview h4,.markdown-preview h5,.markdown-preview h6{font-family:Inter,sans-serif;line-height:1.2;margin-bottom:.5em;margin-top:1.5em}.markdown-preview p{line-height:1.6;margin-bottom:1em}.markdown-preview pre{background-color:#0000000d;border-radius:6px;font-family:Fira Code,monospace;margin-bottom:1em;overflow-x:auto;padding:15px}.dark-mode .markdown-preview pre{background-color:#ffffff0d}.markdown-preview code{font-family:Fira Code,monospace;font-size:.9em}.markdown-preview table{border-collapse:collapse;display:block;margin:1em 0;overflow-x:auto;width:100%}.markdown-preview td,.markdown-preview th{border:1px solid #e0e0e0;border:1px solid var(--border);padding:8px 12px}.dark-mode .markdown-preview td,.dark-mode .markdown-preview th{border-color:#7f8c8d;border-color:var(--dark-border)}.markdown-preview th{background-color:#0000000d;font-weight:600}.dark-mode .markdown-preview th{background-color:#ffffff0d}.markdown-preview blockquote{border-left:4px solid #3498db;border-left:4px solid var(--primary);color:#7f8c8d;color:var(--text-light);margin:1em 0;padding-left:15px}.dark-mode .markdown-preview blockquote{color:#bdc3c7;color:var(--dark-text-light)}.markdown-preview ol,.markdown-preview ul{margin-bottom:1em;padding-left:2em}.markdown-preview li{margin-bottom:.5em}.settings-panel{border-top:1px solid #e0e0e0;border-top:1px solid var(--border);margin-top:15px;padding-top:15px}.dark-mode .settings-panel{border-top-color:#7f8c8d;border-top-color:var(--dark-border)}.settings-controls{display:flex;flex-wrap:wrap;gap:15px}.setting-item{align-items:center;cursor:pointer;display:flex;font-family:Inter,sans-serif;font-size:.9rem;gap:8px}.action-buttons{gap:10px}.action-buttons button{background-color:#3498db;border-radius:6px;color:#fff;display:flex;font-family:Inter,sans-serif;font-weight:500;padding:10px 16px;transition:background-color .2s ease,transform .2s ease}.action-buttons button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-2px)}.action-buttons button:disabled{transform:none}@media (max-width:992px){.split-view{gap:15px;grid-template-columns:1fr}.editor-container{flex-direction:column}.markdown-previewer.fullscreen .markdown-editor,.markdown-previewer.fullscreen .markdown-preview{min-height:calc(50vh - 100px)}}@media (max-width:768px){.tool-header{flex-direction:column;gap:10px}.tool-actions{justify-content:flex-start;width:100%}.markdown-previewer{margin:10px;padding:15px}.formatting-toolbar{gap:6px}.font-controls{justify-content:space-between;margin-left:0;width:100%}.font-slider{flex-grow:1;max-width:150px}.action-buttons button{flex-grow:1;justify-content:center}}@media (max-width:480px){.tab-button{font-size:.9rem;padding:8px 12px}.action-buttons button{font-size:.85rem;padding:8px 12px}.markdown-editor,.markdown-preview{min-height:250px;padding:10px}.search-controls{flex-direction:column}.replace-button,.search-button,.search-input{width:100%}.tool-header h2{font-size:1.5rem}.markdown-previewer.fullscreen .markdown-editor,.markdown-previewer.fullscreen .markdown-preview{min-height:calc(50vh - 80px)}}@media (max-width:360px){.tool-actions button{font-size:.8rem;padding:6px 8px}.tab-button{padding:6px 8px}.font-slider{width:80px}.markdown-previewer{margin:5px;padding:10px}}:root{--bg-light:#f5f6fa;--border:#e0e0e0;--dark-bg:#2c3e50;--dark-bg-light:#34495e;--dark-text:#ecf0f1;--dark-text-light:#bdc3c7;--dark-border:#7f8c8d}.dark-mode{--text:#ecf0f1;--text-light:#bdc3c7;--white:#34495e;--bg-light:#2c3e50;--border:#7f8c8d}.seo-article{background:#fff;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 4px 20px #0000000d;color:#2c3e50;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:1rem;margin:40px 0 30px;padding:30px;text-align:center}.dark-mode .seo-article{background:#2c3e50;border-color:#7f8c8d;color:#ecf0f1}.seo-article h2{color:#2c3e50}.dark-mode .seo-article h2{color:#ecf0f1}.seo-article h3{color:#2c3e50}.dark-mode .seo-article h3{color:#ecf0f1}.seo-article h4{color:#2c3e50}.dark-mode .seo-article h4{color:#ecf0f1}.feature-card{border-bottom:1px solid #e0e0e0}.dark-mode .feature-card{border-bottom-color:#7f8c8d}.feature-item{border-left:4px solid #3498db}.feature-item h4{color:#3498db}.keywords{color:#7f8c8d}.dark-mode .keywords{color:#bdc3c7;color:var(--dark-text-light)}.use-case-card{background:#f5f6fa;border:1px solid #e0e0e0}.dark-mode .use-case-card{background:#34495e;border-color:#7f8c8d}.use-case-card h4{color:#2c3e50}.dark-mode .use-case-card h4{color:#ecf0f1;color:var(--dark-text)}.example-box{background:#f5f6fa;border:1px solid #e0e0e0}.dark-mode .example-box{background:#34495e;border-color:#7f8c8d}.example-box pre{color:#2c3e50}.dark-mode .example-box pre{color:#ecf0f1}.rendered-output{background:#fff;background:var(--white);border:1px solid #e0e0e0;border:1px solid var(--border);border-radius:6px;margin-top:1rem;padding:1.5rem}.dark-mode .rendered-output{background:#34495e;background:var(--dark-bg-light);border-color:#7f8c8d;border-color:var(--dark-border);color:#ecf0f1;color:var(--dark-text)}.faq-item{border-bottom:1px dashed #e0e0e0}.dark-mode .faq-item{border-bottom-color:#7f8c8d}.keyword-pill{background:#3498db;color:#fff;font-family:Inter,sans-serif}.cta-section h3{color:#2c3e50;color:var(--text);margin-top:0}.dark-mode .cta-section h3{color:#ecf0f1;color:var(--dark-text)}@media (max-width:768px){.seo-article{margin:20px 0;padding:20px}.feature-grid,.use-case-grid{grid-template-columns:1fr}.example-box pre{font-size:.85rem;padding:.75rem}}@media (max-width:480px){.seo-article{padding:15px}.seo-article h2{font-size:1.5rem}.seo-article h3{font-size:1.3rem}.keywords-grid{justify-content:center}.keyword-pill{font-size:.75rem;padding:.4rem .8rem}}.space-remover{--card-radius:12px;--gap:20px;--padding:28px;background-color:var(--white);border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1120px;padding:var(--padding);transition:background-color .2s ease,color .2s ease,border-color .2s ease}.space-remover.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.space-remover h2{border-bottom:1px solid var(--border);color:inherit;font-size:1.9rem;font-weight:700;margin:0 0 24px;padding-bottom:14px;text-align:center}.space-remover.dark-mode .input-section,.space-remover.dark-mode .output-section{background:var(--dark-bg-light);border-color:var(--dark-border)}.space-remover.dark-mode .input-section textarea,.space-remover.dark-mode .output-section textarea{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.space-remover.dark-mode .control-group{background:var(--dark-bg-light);border-color:var(--dark-border)}.preserve-section{align-items:center;background:linear-gradient(90deg,#ff98000a,#ff980008);border-left:4px solid #ff9800;border-radius:8px;display:flex;gap:12px;grid-column:1/-1;padding:12px}.space-remover.dark-mode .preserve-section{background:linear-gradient(90deg,#ff98000f,#ff98000a)}.space-remover.dark-mode .action-buttons button.secondary{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.space-remover.dark-mode .statistics{background:var(--dark-bg-light);border-color:var(--dark-border)}.space-remover.dark-mode .stat-item{background:var(--dark-bg);border-color:var(--dark-border)}.space-remover.dark-mode .history{background:var(--dark-bg-light);border-color:var(--dark-border)}.space-remover.dark-mode .history li{background-color:var(--dark-bg);border-color:var(--dark-border)}.space-remover.dark-mode .history-details{color:var(--dark-text)}@media (max-width:1000px){.control-grid,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.input-output-container{grid-template-columns:1fr}.preserve-section{grid-column:1/-1}}@media (max-width:640px){.space-remover{margin:12px;padding:16px}.control-grid{grid-template-columns:1fr}.action-buttons{flex-direction:column;gap:10px}.action-buttons button{width:100%}.stats-grid{grid-template-columns:1fr 1fr}.input-section textarea,.output-section textarea{min-height:220px}}.seo-article h2{border-bottom:2px solid var(--primary);font-size:1.9rem;font-weight:700;line-height:1.3;margin-bottom:25px;padding-bottom:15px}.seo-article h3{font-weight:600;margin:35px 0 20px;padding-left:20px;position:relative}.seo-article h3:before{color:var(--primary);content:"▶";font-size:.9rem;left:0;position:absolute;top:2px}.seo-article h4{font-size:1.15rem;font-weight:600;margin:25px 0 15px}.dark-mode .seo-article h4{color:var(--dark-text)}.seo-article p{color:var(--text);margin-bottom:20px}.dark-mode .seo-article p{color:var(--dark-text)}.seo-article ol,.seo-article ul{margin-bottom:20px;padding-left:25px}.seo-article li{color:var(--text);margin-bottom:8px}.dark-mode .seo-article li{color:var(--dark-text)}.feature-card{background:linear-gradient(135deg,#3498db0d,#3498db05);border:1px solid #3498db1a;border-radius:8px;margin:25px 0;padding:25px}.dark-mode .feature-card{background:linear-gradient(135deg,#3498db1a,#3498db0d);border-color:#3498db33}.feature-card h4{align-items:center;color:var(--primary);display:flex;gap:10px;margin-top:0}.example-box{background:#ffc1071a;border:1px solid #ffc1074d;font-size:.95rem}.dark-mode .example-box{background:#ffc10726;border-color:#ffc10766}.example-box p{margin-bottom:10px}.example-box strong{color:#f39c12}.keywords{background:#6c757d1a;border-radius:4px;margin-top:10px;padding:8px 12px}.dark-mode .keywords{background:#6c757d33}.feature-grid{grid-gap:20px;gap:20px;margin:30px 0}.feature-item{transition:transform .2s ease,box-shadow .2s ease}.dark-mode .feature-item{background:var(--dark-bg)}.feature-item:hover{box-shadow:0 5px 15px #0000001a;transform:translateY(-3px)}.feature-item h4{font-size:1.1rem}.use-case-grid{grid-gap:20px;gap:20px;margin:25px 0}.use-case-card{background:linear-gradient(135deg,var(--bg-light) 0,#3498db05 100%);padding:25px}.dark-mode .use-case-card{background:linear-gradient(135deg,var(--dark-bg) 0,#3498db0d 100%)}.use-case-card:hover{box-shadow:0 8px 25px #3498db26;transform:translateY(-5px)}.use-case-card h4{color:var(--primary);font-size:1.2rem;margin-bottom:15px}.use-case-card ul{padding-left:20px;text-align:left}.faq-item{margin:15px 0}.dark-mode .faq-item{background:var(--dark-bg)}.faq-item h4{color:var(--primary);font-size:1.05rem;margin-top:0}.keywords-grid{gap:10px;margin:20px 0}.keyword-pill{background:linear-gradient(135deg,var(--primary) 0,#3498dbcc 100%);font-weight:500;padding:8px 16px;transition:transform .2s ease}.keyword-pill:hover{transform:translateY(-2px)}.after-example,.before-example{padding:20px;white-space:pre-wrap}.after-example{background:#27ae601a;border:1px solid #27ae604d}.before-example:before{color:#e74c3c;content:"❌ Before:"}.after-example:before,.before-example:before{display:block;font-family:inherit;font-weight:700;margin-bottom:10px}.after-example:before{color:#27ae60;content:"✅ After:"}@media (max-width:768px){.seo-article{margin:30px 10px;padding:25px}.seo-article h2{font-size:1.6rem}.seo-article h3{font-size:1.25rem}.before-after,.feature-grid,.use-case-grid{grid-template-columns:1fr}}.diff-checker{--card-radius:12px;--gap:20px;--padding:28px;background-color:var(--white);border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1120px;padding:var(--padding);transition:background-color .2s ease,color .2s ease,border-color .2s ease}.diff-checker.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.diff-checker h2{border-bottom:1px solid var(--border);color:inherit;font-size:1.9rem;font-weight:700;margin:0 0 24px;padding-bottom:14px;text-align:center}.diff-checker.dark-mode .input-section,.diff-checker.dark-mode .output-section{background:var(--dark-bg-light);border-color:var(--dark-border)}.input-section h3,.output-section h3{color:var(--text);gap:10px}.input-section textarea,.output-section textarea{font-family:Fira Code,ui-monospace,SFMono-Regular,Menlo,Monaco,Roboto Mono,monospace;line-height:1.55;overflow:auto;transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.diff-checker.dark-mode .input-section textarea,.diff-checker.dark-mode .output-section textarea{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.input-section textarea:focus,.output-section textarea:focus{box-shadow:0 6px 20px #3498db14;outline:none}.diff-output{background:var(--white);border:1px solid var(--border);border-radius:8px;flex:1 1;font-family:Fira Code,ui-monospace,SFMono-Regular,Menlo,Monaco,Roboto Mono,monospace;font-size:.95rem;line-height:1.55;min-height:260px;overflow:auto;padding:14px;white-space:pre-wrap}.diff-checker.dark-mode .diff-output{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.diff-added{background-color:#2ecc7126;text-decoration:none}.diff-removed{background-color:#e74c3c26;text-decoration:line-through}.diff-line-number,.diff-unchanged{color:var(--text-light)}.diff-line-number{margin-right:10px;-webkit-user-select:none;user-select:none}.controls{justify-content:center}.control-group{min-width:200px}.diff-checker.dark-mode .control-group{background:var(--dark-bg-light);border-color:var(--dark-border)}.action-buttons{margin-top:10px}.action-buttons button{transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease}.action-buttons button.secondary{background-color:var(--bg-light);border:1px solid var(--border);box-shadow:none;color:var(--text)}.diff-checker.dark-mode .action-buttons button.secondary{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.action-buttons button.secondary:hover{background-color:var(--border)}.diff-checker.dark-mode .statistics{background:var(--dark-bg-light);border-color:var(--dark-border)}.statistics h3{color:var(--text)}.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.diff-checker.dark-mode .stat-item{background:var(--dark-bg);border-color:var(--dark-border)}.stat-number{font-size:1.45rem}.diff-checker.dark-mode .history{background:var(--dark-bg-light);border-color:var(--dark-border)}.history li{background-color:var(--bg-light);transition:transform .12s ease,box-shadow .12s ease}.diff-checker.dark-mode .history li{background-color:var(--dark-bg);border-color:var(--dark-border)}.diff-checker.dark-mode .history-details{color:var(--dark-text)}.history-actions button:hover{background-color:var(--border)}.dark-mode-toggle{padding:8px 12px}button:focus,input:focus,textarea:focus{outline:3px solid #3498db1f;outline-offset:2px}@media (max-width:1000px){.control-grid,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.input-output-container{grid-template-columns:1fr}}@media (max-width:640px){.diff-checker{margin:12px;padding:16px}.control-grid{grid-template-columns:1fr}.action-buttons{flex-direction:column;gap:10px}.action-buttons button{width:100%}.stats-grid{grid-template-columns:1fr 1fr}.diff-output,.input-section textarea,.output-section textarea{min-height:220px}}.text-muted{font-size:.88rem}.color-legend{list-style:none;margin:10px 0;padding:0}.color-legend li{align-items:center;display:flex;margin-bottom:5px}.color-box{border-radius:3px;display:inline-block;height:16px;margin-right:8px;width:16px}.color-box.added{background-color:#2ecc71b3}.color-box.removed{background-color:#e74c3cb3}.color-box.modified{background-color:#3498dbb3}.before-after{grid-gap:20px;gap:20px;margin:25px 0}.after-example,.before-example{border-radius:8px;font-family:Courier New,monospace;font-size:.9rem;padding:15px}.before-example{background:#e74c3c1a;border:1px solid #e74c3c4d}.after-example{background:#2ecc711a;border:1px solid #2ecc714d}.diff-explanation{background:#3498db1a;border:1px solid #3498db4d;border-radius:8px;grid-column:1/-1;padding:15px}.find-replace-tool{--card-radius:12px;--gap:20px;--padding:28px;background-color:var(--white);border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1120px;padding:var(--padding);transition:background-color .2s ease,color .2s ease,border-color .2s ease}.find-replace-tool.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.find-replace-tool h2{border-bottom:1px solid var(--border);color:inherit;font-size:1.9rem;font-weight:700;margin:0 0 24px;padding-bottom:14px;text-align:center}.text-editor{font-family:Fira Code,ui-monospace,SFMono-Regular,Menlo,Monaco,Roboto Mono,monospace;min-height:300px}.find-input,.replace-input{border:1px solid var(--border);border-radius:8px;font-family:inherit;margin-bottom:10px;padding:10px 14px;width:100%}.dark-mode .find-input,.dark-mode .replace-input{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.match-info{color:var(--text-light);font-size:.85rem}.preview-content{background:var(--white);border:1px solid var(--border);border-radius:8px;font-family:Fira Code,monospace;font-size:.95rem;line-height:1.55;max-height:300px;min-height:100px;overflow-y:auto;padding:14px;white-space:pre-wrap}.dark-mode .preview-content{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.highlight-match{background-color:#ffeb3b4d;border-radius:3px;padding:0 2px}@media (max-width:640px){.find-replace-tool{margin:12px;padding:16px}.action-buttons{flex-direction:column;gap:10px}.action-buttons button{width:100%}.text-editor{min-height:220px}}.dark-mode .seo-article{background:var(--dark-bg-light)}.seo-article h2{font-size:1.8rem;margin-bottom:1.5rem}.seo-article h3{font-size:1.5rem;margin:2rem 0 1rem}.seo-article h4{font-size:1.25rem;margin:1.5rem 0 .75rem}.seo-article p{margin-bottom:1.25rem}.feature-card{padding-bottom:2rem}.dark-mode .feature-card{border-bottom-color:var(--dark-border)}.feature-grid{margin:2rem 0}.feature-item{background:#3498db0d;border-left:4px solid var(--primary)}.dark-mode .feature-item{background:#3498db1a}.example{margin:.5rem 0}.example,.keywords{color:var(--text-light);font-style:italic}.keywords{font-size:.85rem;margin-top:1rem}.use-case-grid{grid-gap:1.5rem;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:2rem 0}.use-case-card{background:var(--bg-light);border-radius:8px;padding:1.5rem}.dark-mode .use-case-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.use-case-card h4{margin-top:0}.example-box{border:1px solid var(--border);margin:1.5rem 0;padding:1.5rem}.dark-mode .example-box{background:var(--dark-bg-light);border-color:var(--dark-border)}.example-box pre{background:#0000000d;border-radius:6px;color:var(--text);font-family:Fira Code,monospace;font-size:.9rem;overflow-x:auto;padding:1rem}.dark-mode .example-box pre{background:#ffffff0d;color:var(--dark-text)}.faq-item{border-bottom:1px dashed var(--border);padding-bottom:1.5rem}.dark-mode .faq-item{border-bottom-color:var(--dark-border)}.faq-item:last-child{border-bottom:none}.keywords-grid{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.5rem 0}.keyword-pill{background:var(--primary);border-radius:20px;color:var(--white);font-size:.85rem;padding:.5rem 1rem}.cta-section{background:#3498db1a;border-radius:8px;margin-top:2.5rem}.dark-mode .cta-section{background:#3498db26}@media (max-width:768px){.seo-article{padding:20px}.feature-grid,.use-case-grid{grid-template-columns:1fr}.example-box pre{font-size:.85rem}}.text-to-slug{--card-radius:12px;--gap:20px;--padding:28px;background-color:var(--white);border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1120px;padding:var(--padding);transition:background-color .2s ease,color .2s ease,border-color .2s ease}.text-to-slug.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.text-to-slug h2{border-bottom:1px solid var(--border);color:inherit;font-size:1.9rem;font-weight:700;margin:0 0 24px;padding-bottom:14px;text-align:center}.text-section{margin-bottom:22px}.preview-section h3,.text-section h3{align-items:center;color:var(--text);display:flex;font-size:1.05rem;font-weight:600;gap:10px;margin:0 0 12px}.text-editor{background:var(--white);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:Inter,sans-serif;font-size:.95rem;line-height:1.55;min-height:200px;overflow:auto;padding:14px;resize:vertical;transition:border-color .12s ease,box-shadow .12s ease;width:100%}.dark-mode .text-editor{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.text-editor:focus{border-color:var(--primary);box-shadow:0 6px 20px #3498db14;outline:none}.controls{margin-bottom:22px}.control-grid{grid-gap:var(--gap);display:grid;gap:var(--gap);grid-template-columns:1fr 1fr}.dark-mode .control-group{background:var(--dark-bg-light);border-color:var(--dark-border)}.control-group h4{margin-bottom:10px}.option-select{border:1px solid var(--border);border-radius:6px;font-size:.9rem;padding:8px 12px}.dark-mode .option-select{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.range-option{display:flex;flex-direction:column;gap:8px}.range-option input[type=range]{width:100%}.checkbox-options{gap:12px}.preview-section{margin-bottom:20px}.slug-preview{border:1px solid var(--border);border-radius:8px;display:flex;overflow:hidden}.dark-mode .slug-preview{border-color:var(--dark-border)}.slug-content{background:var(--white);flex-grow:1;font-family:Fira Code,monospace;font-size:.95rem;line-height:1.55;overflow-x:auto;padding:14px;white-space:nowrap}.dark-mode .slug-content{background-color:var(--dark-bg);color:var(--dark-text)}.copy-btn{background-color:var(--primary);font-family:inherit;font-weight:600;padding:0 16px;transition:background-color .2s ease}.copy-btn:hover{background-color:var(--primary-dark)}.copy-btn:disabled{background-color:var(--text-light);cursor:not-allowed;opacity:.6}.slug-stats{color:var(--text-light);font-size:.85rem;margin-top:10px;text-align:right}.url-preview{background:var(--white);border:1px solid var(--border);border-radius:8px;font-family:Fira Code,monospace;font-size:.95rem;line-height:1.55;overflow-x:auto;padding:14px;white-space:nowrap}.dark-mode .url-preview{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.history-panel{border-radius:10px;margin-bottom:20px;padding:16px}.dark-mode .history-panel{background:var(--dark-bg-light);border-color:var(--dark-border)}.history-panel h4{font-size:1rem;margin-bottom:10px;margin-top:0}.history-panel ul{display:flex;flex-direction:column;gap:8px;list-style:none;margin:0;padding:0}.history-panel li{background:#3498db1a;border-radius:6px;cursor:pointer;font-size:.9rem;padding:8px 12px;transition:background-color .2s ease}.dark-mode .history-panel li,.history-panel li:hover{background:#3498db33}.dark-mode .history-panel li:hover{background:#3498db4d}.action-buttons{margin-top:20px}.action-buttons button{align-items:center;background-color:var(--primary);border:none;border-radius:10px;box-shadow:0 6px 18px #0b152b0d;color:var(--white);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.95rem;font-weight:700;gap:8px;justify-content:center;line-height:1;min-height:44px;padding:12px 18px;transition:transform .12s ease,box-shadow .12s ease}.action-buttons button:hover{box-shadow:0 12px 30px #0b152b14;transform:translateY(-3px)}.quick-actions{margin-bottom:12px}.quick-action-btn{font-size:.84rem;padding:8px 12px}.dark-mode-toggle{background-color:var(--text-light)!important;border:none!important;color:var(--white)!important}@media (max-width:1000px){.control-grid{grid-template-columns:1fr}}@media (max-width:640px){.text-to-slug{margin:12px;padding:16px}.action-buttons{flex-direction:column;gap:10px}.action-buttons button{width:100%}.text-editor{min-height:180px}.slug-preview{flex-direction:column}.copy-btn{padding:8px}}.emoji-extractor{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1120px;padding:var(--padding);transition:all .3s ease}.emoji-extractor.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.emoji-extractor h2{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);color:inherit;font-size:1.9rem;font-weight:700;margin:0 0 24px;padding-bottom:14px;text-align:center}.emoji-extractor.dark-mode h2{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.quick-actions{gap:10px;margin-bottom:20px}.quick-action-btn{background:#3498db;background:var(--primary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;font-weight:600;min-width:120px;padding:10px 16px;transition:all .3s ease}.quick-action-btn:hover{background:#2980b9;background:var(--primary-hover);transform:translateY(-2px)}.dark-mode-toggle{background-color:#95a5a6!important;background-color:var(--secondary)!important}.dark-mode-toggle:hover{background-color:#7f8c8d!important}.mode-selector{gap:12px;justify-content:center;margin-bottom:24px}.mode-selector button{font-size:.95rem;min-width:140px;padding:12px 24px}.mode-selector button.active{box-shadow:0 4px 12px #3498db4d;transform:translateY(-1px)}.mode-selector button.inactive{background-color:#f8fafc;background-color:var(--bg-light);border-color:#e1e8ed;border-color:var(--border)}.emoji-extractor.dark-mode .mode-selector button.inactive{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-output-container{margin-bottom:22px}.input-section,.output-section{min-height:360px;padding:18px}.emoji-extractor.dark-mode .input-section,.emoji-extractor.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-section h3,.output-section h3{align-items:center;color:inherit;display:flex;font-size:1.05rem;font-weight:600;gap:8px;margin:0 0 12px}.input-section textarea,.output-section textarea{border-radius:8px;min-height:260px;padding:14px}.emoji-extractor.dark-mode .input-section textarea,.emoji-extractor.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.emoji-extractor.dark-mode .input-section textarea:focus,.emoji-extractor.dark-mode .output-section textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db33}.char-count{margin-top:10px}.emoji-display{background:#fff;background:var(--white);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;display:flex;flex:1 1 auto;flex-wrap:wrap;gap:12px;margin:0;min-height:260px;overflow-y:auto;padding:20px;transition:all .3s ease}.emoji-extractor.dark-mode .emoji-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.emoji-item{align-items:center;border-radius:8px;cursor:pointer;display:inline-flex;font-size:2rem;justify-content:center;padding:8px;position:relative;transition:all .3s ease}.emoji-item:hover{background-color:#3498db1a;transform:scale(1.1)}.emoji-item:hover:after{background:#2c3e50;background:var(--text);border-radius:6px;bottom:120%;box-shadow:0 4px 8px #0003;color:#fff;color:var(--white);content:attr(data-name);font-size:.75rem;left:50%;padding:6px 10px;position:absolute;transform:translateX(-50%);white-space:nowrap;z-index:10}.emoji-extractor.dark-mode .emoji-item:hover:after{background:#f7fafc;background:var(--dark-text);color:#1a202c;color:var(--dark-bg)}.controls{flex-direction:column;gap:20px}.control-grid{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px}.control-group{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;flex:1 1 auto;min-width:250px;padding:16px}.emoji-extractor.dark-mode .control-group{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.control-group h4{align-items:center;color:inherit;display:flex;font-size:1rem;font-weight:600;gap:8px;margin:0 0 12px}.option-group{display:flex;flex-direction:column;gap:8px}.option-group:last-child{margin-bottom:0}.option-group label{color:#2c3e50;color:var(--text);margin-bottom:4px}.emoji-extractor.dark-mode .option-group label{color:#f7fafc;color:var(--dark-text)}.option-select{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;font-family:inherit;font-size:.95rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.option-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.emoji-extractor.dark-mode .option-select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.emoji-extractor.dark-mode .option-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db33}.checkbox-options{display:flex;flex-direction:column;gap:8px}.checkbox-label{border-radius:6px;font-size:.9rem;padding:8px 12px;transition:all .3s ease}.checkbox-label:hover{background-color:#3498db0d}.emoji-extractor.dark-mode .checkbox-label:hover{background-color:#3498db1a}.checkbox-label input[type=checkbox]{cursor:pointer}.checkbox-label span{color:inherit;text-transform:capitalize}.action-buttons{align-items:center;margin-bottom:16px}.action-buttons .file-import-button,.action-buttons button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:10px;box-shadow:0 6px 18px #0b152b0d;color:#fff;color:var(--white);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.95rem;font-weight:700;gap:8px;justify-content:center;line-height:1;min-height:44px;padding:12px 18px;text-decoration:none;transition:all .3s ease}.action-buttons .file-import-button:hover,.action-buttons button:hover:not(:disabled){box-shadow:0 12px 30px #0b152b14;transform:translateY(-3px)}.action-buttons button:disabled{cursor:not-allowed;opacity:.6;transform:none!important}.action-buttons .file-import-button.secondary,.action-buttons button.secondary{background-color:#f8fafc;background-color:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);box-shadow:none;color:#2c3e50;color:var(--text)}.emoji-extractor.dark-mode .action-buttons .file-import-button.secondary,.emoji-extractor.dark-mode .action-buttons button.secondary{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.action-buttons .file-import-button.secondary:hover,.action-buttons button.secondary:hover{background-color:#e1e8ed;background-color:var(--border)}.action-buttons button.danger{background-color:#e74c3c;color:#fff}.action-buttons button.danger:hover{background-color:#c0392b}.statistics{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;margin-bottom:18px;padding:18px}.emoji-extractor.dark-mode .statistics{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.statistics h3{align-items:center;color:inherit;display:flex;font-size:1.15rem;gap:8px;margin:0 0 12px}.stats-grid{grid-gap:12px;gap:12px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.stat-item:hover{box-shadow:0 8px 25px #3498db26}.emoji-extractor.dark-mode .stat-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.stat-number{font-size:1.8rem}.stat-label{font-size:.86rem;margin-top:6px}.emoji-extractor.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.history{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;margin-top:26px;padding:18px}.emoji-extractor.dark-mode .history{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-header{gap:12px}.history-header h3{font-size:1.18rem}.history ul{grid-gap:10px;display:grid;gap:10px;list-style:none;margin:0;padding:0}.history li{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;flex-direction:column;padding:12px;transition:all .3s ease}.history li:hover{box-shadow:0 6px 20px #0b152b0a;transform:translateY(-3px)}.emoji-extractor.dark-mode .history li{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-info{align-items:center;color:#7f8c8d;color:var(--text-light);display:flex;flex-wrap:wrap;font-size:.88rem;gap:12px;margin-bottom:8px}.history-details{font-size:.92rem;line-height:1.45;margin:6px 0}.emoji-extractor.dark-mode .history-details{color:#f7fafc;color:var(--dark-text)}.history small{color:#7f8c8d;color:var(--text-light);font-size:.82rem}.emoji-extractor.dark-mode .history small{color:#a0aec0;color:var(--dark-text-secondary)}.history-actions{justify-content:flex-end;margin-top:10px}.history-actions button{background-color:#f8fafc;background-color:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;font-size:.86rem;min-height:36px;padding:8px 12px;transition:all .3s ease}.history-actions button:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;color:var(--white)}.emoji-extractor.dark-mode .history-actions button{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.text-muted{color:#7f8c8d;color:var(--text-light);font-size:.9rem;padding:40px 20px;text-align:center}.emoji-extractor.dark-mode .text-muted{color:#a0aec0;color:var(--dark-text-secondary)}.center{text-align:center}button:focus,input:focus,select:focus,textarea:focus{outline:3px solid #3498db1f;outline-offset:2px}@media (max-width:1024px){.emoji-extractor{margin:20px auto;max-width:95%;padding:24px}.control-grid{flex-direction:column}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media (max-width:768px){.emoji-extractor{margin:16px;padding:20px}.emoji-extractor h2{font-size:1.6rem}.input-output-container{grid-template-columns:1fr}.mode-selector{flex-direction:column;gap:8px}.mode-selector button{min-width:auto;width:100%}.quick-actions{flex-direction:column;gap:8px}.quick-action-btn{min-width:auto;width:100%}.control-grid{gap:16px}.control-group{min-width:auto}.stats-grid{grid-template-columns:repeat(2,1fr)}.action-buttons{flex-direction:column;gap:12px}.action-buttons .file-import-button,.action-buttons button{min-width:auto;width:100%}.emoji-item{font-size:1.5rem;padding:6px}.input-section textarea,.output-section textarea{min-height:200px;padding:14px}.emoji-display{min-height:200px;padding:16px}}@media (max-width:480px){.emoji-extractor{margin:12px;padding:16px}.emoji-extractor h2{font-size:1.4rem}.stats-grid{grid-template-columns:1fr}.emoji-item{font-size:1.2rem;padding:4px}.input-section textarea,.output-section textarea{font-size:.9rem;min-height:150px;padding:12px}.emoji-display{min-height:150px;padding:12px}.option-select{font-size:.9rem;padding:10px 14px}.checkbox-options{gap:6px}.checkbox-label{padding:6px 10px}}.morse-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.morse-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.morse-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.morse-converter.dark-mode .direction-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.morse-converter.dark-mode .direction-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.morse-converter.dark-mode .input-section,.morse-converter.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.morse-converter.dark-mode .input-section textarea,.morse-converter.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.morse-display{background:#fff;background:var(--white);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;flex:1 1 auto;font-family:Courier New,monospace;font-size:1.1rem;letter-spacing:.5px;line-height:1.8;min-height:280px;overflow-y:auto;padding:20px;transition:all .3s ease;white-space:pre-wrap;word-break:break-word}.morse-converter.dark-mode .morse-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.morse-converter.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.audio-controls-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.morse-converter.dark-mode .audio-controls-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.audio-controls-section h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.audio-controls{align-items:center;display:flex;gap:20px}.play-button{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white);font-weight:600;padding:12px 24px}.play-button:hover:not(:disabled){background-color:#27ae60;box-shadow:0 4px 12px #2ecc714d;transform:translateY(-2px)}.play-button.playing{background-color:#e74c3c;background-color:var(--danger)}.play-button.playing:hover{background-color:#c0392b}.audio-settings{display:flex;flex:1 1;gap:20px}.morse-converter.dark-mode .setting-group label{color:#a0aec0;color:var(--dark-text-secondary)}.morse-converter.dark-mode .setting-group input[type=range]{background:#4a5568;background:var(--dark-border)}.morse-converter.dark-mode .settings-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.morse-converter.dark-mode .settings-toggle:hover{background-color:#3498db33}.morse-converter.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.morse-converter.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.morse-converter.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.morse-converter.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.morse-converter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.morse-converter.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.morse-converter.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.morse-converter{margin:16px;padding:20px}.direction-selector,.input-output-container{grid-template-columns:1fr}.audio-controls{align-items:flex-start;flex-direction:column;gap:16px}.audio-settings{gap:16px;width:100%}.audio-settings,.primary-actions{flex-direction:column}.settings-grid{grid-template-columns:1fr}}.rot13-decoder{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.rot13-decoder.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.rot13-decoder.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.rot13-decoder.dark-mode .input-section,.rot13-decoder.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.rot13-decoder.dark-mode .input-section textarea,.rot13-decoder.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.rot13-decoder.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.rot13-decoder.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.rot13-decoder.dark-mode .history-meta,.rot13-decoder.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.rot13-decoder{margin:16px;padding:20px}.input-output-container{grid-template-columns:1fr}.primary-actions{flex-direction:column}}.seo-article{margin:50px auto 30px}.binary-translator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.binary-translator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.binary-translator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.binary-translator.dark-mode .direction-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.binary-translator.dark-mode .direction-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.binary-translator.dark-mode .input-section,.binary-translator.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.binary-translator.dark-mode .input-section textarea,.binary-translator.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.binary-display{background:#fff;background:var(--white);border-radius:12px;flex:1 1 auto;font-family:Courier New,monospace;font-size:1.1rem;letter-spacing:.5px;line-height:1.8;min-height:280px;overflow-y:auto;padding:20px;transition:all .3s ease;white-space:pre-wrap;word-break:break-word}.binary-translator.dark-mode .binary-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.binary-translator.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.format-options{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px;padding:16px}.binary-translator.dark-mode .format-options{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.format-options label{align-items:center;cursor:pointer;display:flex;font-size:.9rem;gap:6px}.error-message{border-radius:4px;padding:8px}.binary-translator.dark-mode .error-message{background-color:#e74c3c33}.binary-translator.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.binary-translator.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.binary-translator.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.binary-translator.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.binary-translator{margin:16px;padding:20px}.direction-selector,.input-output-container{grid-template-columns:1fr}}.binary-chart{display:flex;gap:2rem;margin:1.5rem 0}.binary-column{flex:1 1}@media (max-width:768px){.seo-article{padding:20px}.binary-chart{flex-direction:column}.feature-grid{grid-template-columns:1fr}}.hex-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.hex-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.hex-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.hex-converter.dark-mode .direction-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}@media (max-width:768px){.hex-converter{margin:16px;padding:20px}.direction-selector,.input-output-container{grid-template-columns:1fr}}.hex-table{border-collapse:collapse;margin:1.5rem 0;width:100%}.hex-table td,.hex-table th{border:1px solid var(--border);padding:.8rem;text-align:left}.hex-example,.hex-table th{background-color:var(--bg-light)}.hex-example{border-radius:4px;font-family:monospace;margin:.5rem 0;padding:.5rem}.base64-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.base64-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.base64-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.base64-converter.dark-mode .direction-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.base64-converter.dark-mode .direction-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.base64-converter.dark-mode .input-section,.base64-converter.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.base64-converter.dark-mode .input-section textarea,.base64-converter.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.base64-converter.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.base64-converter.dark-mode .settings-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.base64-converter.dark-mode .settings-toggle:hover{background-color:#3498db33}.base64-converter.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.base64-converter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.base64-converter.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.base64-converter.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.base64-converter{margin:16px;padding:20px}.direction-selector,.input-output-container{grid-template-columns:1fr}.primary-actions{flex-direction:column}}.password-checker{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.password-checker.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.password-checker.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.password-input-section{margin-bottom:30px}.password-input-container{margin-bottom:20px;position:relative}.password-input{background:#fff;background:var(--white);border-radius:10px;color:#2c3e50;color:var(--text);font-family:Inter,sans-serif;font-size:1rem;line-height:1.6;padding:16px 50px 16px 16px;width:100%}.password-checker.dark-mode .password-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.toggle-password{background:none;border:none;color:#7f8c8d;color:var(--text-light);cursor:pointer;position:absolute;right:16px;top:50%;transform:translateY(-50%)}.password-checker.dark-mode .toggle-password{color:#a0aec0;color:var(--dark-text-secondary)}.strength-meter{background-color:#e1e8ed;background-color:var(--border);border-radius:4px;height:8px;margin-bottom:16px;overflow:hidden}.strength-meter-fill{height:100%;transition:width .3s ease,background-color .3s ease;width:0}.strength-meter-fill.very-weak{background-color:#e74c3c;background-color:var(--danger);width:20%}.strength-meter-fill.weak{background-color:#ff6b6b;width:40%}.strength-meter-fill.moderate{background-color:#f39c12;background-color:var(--warning);width:60%}.strength-meter-fill.strong{background-color:#51cf66;width:80%}.strength-meter-fill.very-strong{background-color:#2ecc71;background-color:var(--success);width:100%}.strength-label{align-items:center;display:flex;font-weight:600;gap:8px;margin-bottom:8px}.strength-label .icon{font-size:1.2rem}.password-details{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin-bottom:30px}.detail-card{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px}.password-checker.dark-mode .detail-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.detail-card h3{align-items:center;display:flex;font-size:1rem;gap:8px;margin-bottom:12px;margin-top:0}.detail-card p{color:#7f8c8d;color:var(--text-light);font-size:.9rem;margin:0}.password-checker.dark-mode .detail-card p{color:#a0aec0;color:var(--dark-text-secondary)}.suggestions-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.password-checker.dark-mode .suggestions-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.suggestions-section h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.suggestion-list{margin:0;padding-left:20px}.suggestion-list li{margin-bottom:8px}.generate-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.password-checker.dark-mode .generate-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.generate-section h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.generate-controls{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px}.generate-setting{flex:1 1;min-width:200px}.generate-setting label{display:block;font-size:.9rem;margin-bottom:8px}.generate-setting input[type=range]{width:100%}.generate-options{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}.generate-option{align-items:center;display:flex;gap:8px}.generate-actions{display:flex;gap:12px}button.primary{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}button.primary:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}button.success{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}button.success:hover:not(:disabled){background-color:#27ae60;transform:translateY(-1px)}.password-checker.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.password-checker.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-strength{border-radius:4px;display:inline-block;font-size:.75rem;font-weight:600;padding:2px 8px}.history-strength.very-weak{background-color:#e74c3c33;color:#e74c3c;color:var(--danger)}.history-strength.weak{background-color:#ff6b6b33;color:#ff6b6b}.history-strength.moderate{background-color:#f39c1233;color:#f39c12;color:var(--warning)}.history-strength.strong{background-color:#51cf6633;color:#51cf66}.history-strength.very-strong{background-color:#2ecc7133;color:#2ecc71;color:var(--success)}.history-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width:768px){.password-checker{margin:16px;padding:20px}.password-details{grid-template-columns:1fr}.generate-controls{gap:16px}.generate-actions,.generate-controls{flex-direction:column}}.security-levels{display:flex;gap:1rem;margin:1.5rem 0}.security-level{border-radius:8px;flex:1 1;padding:1rem;text-align:center}.security-level.very-weak{background-color:#e74c3c1a;border:1px solid var(--danger)}.security-level.weak{background-color:#ff6b6b1a;border:1px solid #ff6b6b}.security-level.moderate{background-color:#f39c121a;border:1px solid var(--warning)}.security-level.strong{background-color:#51cf661a;border:1px solid #51cf66}.security-level.very-strong{background-color:#2ecc711a;border:1px solid var(--success)}td,th{border:1px solid var(--border);padding:.75rem}th{background-color:var(--bg-light)}@media (max-width:768px){.seo-article{padding:20px}.security-levels{flex-direction:column}.feature-grid{grid-template-columns:1fr}}.duplicate-remover{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.duplicate-remover.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.duplicate-remover.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.duplicate-remover.dark-mode .input-section,.duplicate-remover.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.duplicate-remover.dark-mode .input-section textarea,.duplicate-remover.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.duplicate-remover.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.duplicate-remover.dark-mode .options-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.options-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.option-item{align-items:center;display:flex;gap:10px}.option-item input[type=checkbox]{height:18px;width:18px}.option-item label{font-size:.95rem}.stats-section{padding:20px}.duplicate-remover.dark-mode .stats-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.stats-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.duplicate-remover.dark-mode .stat-value{color:#3498db;color:var(--primary)}.duplicate-remover.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.duplicate-remover.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.duplicate-remover.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-text .original,.history-text .processed{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.duplicate-remover.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.duplicate-remover.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.duplicate-remover{margin:16px;padding:20px}.input-output-container,.options-grid,.stats-grid{grid-template-columns:1fr}}.text-generator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.text-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.text-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.generator-selector{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:30px;padding:8px}.text-generator.dark-mode .generator-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.generator-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px;transition:all .3s ease}.generator-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.generator-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.generator-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.text-generator.dark-mode .generator-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.text-generator.dark-mode .settings-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.text-generator.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.setting-group input[type=number],.setting-group input[type=text],.setting-group select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:Inter,sans-serif;font-size:.9rem;outline:none;padding:10px 12px;transition:all .3s ease;width:100%}.text-generator.dark-mode .setting-group input,.text-generator.dark-mode .setting-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.text-generator.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.output-section textarea{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);font-family:Inter,sans-serif;font-size:1rem;line-height:1.6;min-height:200px;outline:none;padding:16px;resize:vertical;transition:all .3s ease;width:100%}.text-generator.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.output-section textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.text-generator.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.copy-button{background-color:#2ecc71;background-color:var(--success)}.copy-button:hover{background-color:#27ae60}.download-button{background-color:#95a5a6;background-color:var(--secondary)}.download-button:hover{background-color:#7f8c8d}@media (max-width:768px){.text-generator{margin:16px;padding:20px}.settings-grid{grid-template-columns:1fr}.action-buttons{flex-direction:column}}.acronym-generator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.acronym-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.acronym-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.acronym-generator.dark-mode .input-section,.acronym-generator.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.acronym-generator.dark-mode .input-section textarea,.acronym-generator.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.acronym-generator.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.generate-button{padding:12px 24px}.generate-button:hover:not(:disabled){box-shadow:0 4px 12px #3498db4d}.options-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.acronym-generator.dark-mode .options-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.options-section h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.options-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.option-group label{color:#7f8c8d;color:var(--text-light)}.acronym-generator.dark-mode .option-group label{color:#a0aec0;color:var(--dark-text-secondary)}.option-group input[type=number],.option-group input[type=text],.option-group select{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:Inter,sans-serif;font-size:.9rem;outline:none;padding:10px 12px;transition:all .3s ease;width:100%}.option-group input[type=number]:focus,.option-group input[type=text]:focus,.option-group select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.acronym-generator.dark-mode .option-group input,.acronym-generator.dark-mode .option-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.option-group small{color:#7f8c8d;color:var(--text-light);display:block;font-size:.8rem;margin-top:6px}.acronym-generator.dark-mode .option-group small{color:#a0aec0;color:var(--dark-text-secondary)}.acronym-generator.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.acronym-generator.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-text .acronym,.history-text .original{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.acronym-generator.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.acronym-generator.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.acronym-generator{margin:16px;padding:20px}.input-output-container,.options-grid{grid-template-columns:1fr}}.examples{display:flex;gap:2rem;margin:1.5rem 0}.example-column{flex:1 1}@media (max-width:768px){.seo-article{padding:20px}.examples{flex-direction:column}.feature-grid{grid-template-columns:1fr}}.text-encryption{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.text-encryption.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.text-encryption.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.algorithm-selector{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-bottom:30px;padding:8px}.text-encryption.dark-mode .algorithm-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.algorithm-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px;transition:all .3s ease}.algorithm-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.algorithm-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.algorithm-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.text-encryption.dark-mode .algorithm-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.text-encryption.dark-mode .input-section,.text-encryption.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.text-encryption.dark-mode .input-section textarea,.text-encryption.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.text-encryption.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.encryption-settings{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.text-encryption.dark-mode .encryption-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.encryption-settings h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.setting-group{margin-bottom:16px}.text-encryption.dark-mode .setting-group label{color:#a0aec0;color:var(--dark-text-secondary)}.text-encryption.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.text-encryption.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.key-display{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:Courier New,monospace;margin-top:8px;padding:12px;word-break:break-all}.text-encryption.dark-mode .key-display{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.text-encryption.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.text-encryption.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.text-encryption.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.text-encryption.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.text-encryption{margin:16px;padding:20px}.algorithm-selector,.input-output-container,.settings-grid{grid-template-columns:1fr}}.security-level{align-items:center;display:flex;gap:1rem;margin:1.5rem 0}.security-badge{border-radius:20px;font-weight:700;padding:.5rem 1rem}.bmi-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.bmi-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.bmi-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-actions{align-items:center;display:flex;gap:12px}.article-section{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.bmi-calculator.dark-mode .article-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.unit-selector{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border-radius:12px;display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-bottom:30px;padding:8px}.bmi-calculator.dark-mode .unit-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.unit-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px;transition:all .3s ease}.unit-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.unit-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.unit-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.bmi-calculator.dark-mode .unit-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.bmi-calculator.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-grid{grid-gap:24px;gap:24px;margin-bottom:24px}.height-imperial{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr}.bmi-calculator.dark-mode .input-group input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-group input::placeholder{color:#7f8c8d;color:var(--text-light)}.bmi-calculator.dark-mode .input-group input::placeholder{color:#a0aec0;color:var(--dark-text-secondary)}button{min-height:48px}button.small{font-size:.9rem;min-height:36px}.results-section{padding:30px;text-align:center}.bmi-calculator.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.bmi-display{margin-bottom:30px}.bmi-value{font-size:4rem;font-weight:800;line-height:1;margin-bottom:8px}.bmi-category{font-size:1.5rem;font-weight:600;letter-spacing:1px;text-transform:uppercase}.bmi-gauge{margin-bottom:30px}.gauge-bar{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;height:24px;margin-bottom:12px;position:relative}.bmi-calculator.dark-mode .gauge-bar{border-color:#4a5568;border-color:var(--dark-border)}.bmi-pointer{background-color:#2c3e50;background-color:var(--text);border-radius:2px;height:40px;position:absolute;top:-8px;width:3px}.bmi-calculator.dark-mode .bmi-pointer{background-color:#f7fafc;background-color:var(--dark-text)}.pointer-value{background-color:#2c3e50;background-color:var(--text);border-radius:4px;color:#fff;color:var(--white);font-size:.8rem;font-weight:600;left:50%;padding:4px 8px;position:absolute;top:-30px;transform:translateX(-50%);white-space:nowrap}.bmi-calculator.dark-mode .pointer-value{background-color:#f7fafc;background-color:var(--dark-text);color:#1a202c;color:var(--dark-bg)}.gauge-labels{grid-gap:8px;color:#7f8c8d;color:var(--text-light);display:grid;font-size:.85rem;gap:8px;grid-template-columns:1fr 1fr 1fr 1fr;text-align:center}.bmi-calculator.dark-mode .gauge-labels{color:#a0aec0;color:var(--dark-text-secondary)}.healthy-range{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:20px}.bmi-calculator.dark-mode .healthy-range{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.healthy-range h4{color:#2ecc71;color:var(--success);font-size:1.1rem;margin:0 0 8px}.healthy-range p{color:inherit;font-size:1.2rem;font-weight:600;margin:0}.bmi-calculator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-actions{gap:8px}.bmi-calculator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-meta{margin-bottom:6px}.history-meta .bmi-value{font-size:1.1rem;font-weight:700}.history-meta .category{color:inherit;font-weight:600}.history-meta .timestamp{color:#7f8c8d;color:var(--text-light);font-size:.85rem}.bmi-calculator.dark-mode .history-details,.bmi-calculator.dark-mode .history-meta .timestamp{color:#a0aec0;color:var(--dark-text-secondary)}.empty-history{font-style:italic}.bmi-calculator.dark-mode .empty-history{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.bmi-calculator{margin:16px;padding:20px}.header-section{align-items:flex-start;flex-direction:column;gap:16px}.header-actions{justify-content:space-between;width:100%}.input-grid,.unit-selector{grid-template-columns:1fr}.height-imperial{grid-template-columns:1fr 1fr}.action-buttons{flex-direction:column}.bmi-value{font-size:3rem}.bmi-category{font-size:1.2rem}.gauge-labels{font-size:.75rem}.history-header{align-items:flex-start;flex-direction:column;gap:12px}.history-actions{justify-content:space-between;width:100%}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-button{align-self:flex-end;margin-left:0}.history-meta{flex-wrap:wrap;gap:8px}}@media (max-width:480px){.bmi-calculator{margin:8px;padding:16px}.header-section h2{font-size:1.6rem}.unit-selector button{font-size:.9rem;padding:12px 16px}.input-section{padding:20px}.results-section{padding:24px}.bmi-value{font-size:2.5rem}.bmi-category{font-size:1rem}.history-section{padding:20px}}.bmi-article{color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;line-height:1.7;margin:0 auto;max-width:900px;padding:0}.bmi-calculator.dark-mode .bmi-article{color:var(--dark-text)}.bmi-calculator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.bmi-calculator.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-section h2{margin-bottom:16px}.article-section h3{color:inherit;margin-bottom:12px}.article-section h4{color:inherit;margin-bottom:8px}.article-section p{text-align:justify}.formula-box{border-radius:12px;margin:24px 0;padding:24px}.bmi-calculator.dark-mode .formula-box{background:var(--dark-bg-light);border-color:var(--dark-border)}.formula-box h3{color:var(--primary);margin-bottom:16px;margin-top:0}.formula{background:var(--white);border:1px solid var(--border);border-radius:8px;font-size:1.1rem;padding:16px}.bmi-calculator.dark-mode .formula{background:var(--dark-bg);border-color:var(--dark-border)}.bmi-categories{grid-gap:16px;display:grid;gap:16px;margin:24px 0}.category-item{border:1px solid var(--border);border-radius:12px;padding:20px;transition:all .3s ease}.category-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.category-item.underweight{background:#3498db1a;border-color:#3498db}.category-item.normal{background:#2ecc711a;border-color:#2ecc71}.category-item.overweight{background:#f39c121a;border-color:#f39c12}.category-item.obese{background:#e74c3c1a;border-color:#e74c3c}.category-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:8px}.category-name{font-size:1.1rem;font-weight:700}.category-range{font-family:Courier New,monospace;font-size:.95rem;font-weight:600;opacity:.8}.category-item p{font-size:.95rem;margin:0;text-align:left}.benefits-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.benefit-item{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:20px;transition:all .3s ease}.bmi-calculator.dark-mode .benefit-item{background:var(--dark-bg);border-color:var(--dark-border)}.benefit-item:hover{box-shadow:0 4px 12px #0000000d;transform:translateY(-2px)}.benefit-item h4{color:var(--primary);font-size:1rem;margin-bottom:12px;margin-top:0}.benefit-item p{font-size:.9rem;margin:0;text-align:left}.limitations-list{grid-gap:16px;display:grid;gap:16px;margin:24px 0}.limitation-item{background:#f39c120d;border-left:4px solid var(--warning);border-radius:0 8px 8px 0;padding:20px}.limitation-item h4{color:var(--warning);font-size:1rem;margin-bottom:8px;margin-top:0}.limitation-item p{font-size:.95rem;margin:0;text-align:left}.consultation-box{background:#2ecc711a;border:1px solid var(--success);border-radius:12px;margin:24px 0;padding:24px}.consultation-box h3{color:var(--success);margin-bottom:16px;margin-top:0}.consultation-box ul{margin:0;padding-left:20px}.consultation-box li{font-size:.95rem;margin-bottom:8px}.tips-grid{margin:24px 0}.tip-category{padding:20px}.bmi-calculator.dark-mode .tip-category{background:var(--dark-bg);border-color:var(--dark-border)}.tip-category h4{font-size:1rem}.tip-category li{font-size:.9rem;margin-bottom:8px}.alternatives-list{grid-gap:12px;display:grid;gap:12px;margin:24px 0}.alternative-item{background:var(--bg-light);border:1px solid var(--border);border-radius:8px;font-size:.95rem;padding:16px}.bmi-calculator.dark-mode .alternative-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.alternative-item strong{color:var(--primary)}.bmi-calculator.dark-mode .article-footer{border-top-color:var(--dark-border)}.disclaimer{background:#e74c3c1a;border:1px solid var(--danger);border-radius:12px;margin-bottom:30px;padding:24px}.disclaimer h3{color:var(--danger);margin-bottom:16px;margin-top:0}.disclaimer p{font-size:.95rem;margin:0;text-align:left}.references{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:24px}.bmi-calculator.dark-mode .references{background:var(--dark-bg-light);border-color:var(--dark-border)}.references h3{color:var(--primary);margin-bottom:16px;margin-top:0}.references ul{margin:0;padding-left:20px}.references li{font-size:.9rem;margin-bottom:8px}@media (max-width:768px){.article-header h1{font-size:1.8rem}.article-subtitle{font-size:1rem}.article-section h2{font-size:1.4rem}.benefits-grid,.tips-grid{grid-template-columns:1fr}.category-header{align-items:flex-start;flex-direction:column;gap:4px}.consultation-box,.disclaimer,.formula-box,.references{padding:20px}}@media (max-width:480px){.article-header h1{font-size:1.6rem}.article-section h2{font-size:1.3rem;padding-left:12px}.benefit-item,.consultation-box,.disclaimer,.formula-box,.references,.tip-category{padding:16px}}.percentage-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.percentage-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.percentage-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.type-selector{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.percentage-calculator.dark-mode .type-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.type-selector label{display:block;font-size:1.1rem;font-weight:600;margin-bottom:12px}.type-selector select{-webkit-appearance:none;appearance:none;background-color:#fff;background-color:var(--white);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);background-position:right 12px center;background-repeat:no-repeat;background-size:16px;border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;padding:12px 16px;transition:all .3s ease;width:100%}.type-selector select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.percentage-calculator.dark-mode .type-selector select{background-color:#1a202c;background-color:var(--dark-bg);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.percentage-calculator.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-grid{grid-template-columns:1fr 1fr}.input-group label{color:inherit}.input-group input{background-color:#fff;background-color:var(--white)}.percentage-calculator.dark-mode .input-group input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.operation-choice{display:flex;gap:20px;grid-column:1/-1;margin-top:10px}.operation-choice label{align-items:center;cursor:pointer;display:flex;gap:8px}.result-section{padding:25px}.percentage-calculator.dark-mode .result-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.result-section h3{color:inherit;font-size:1.2rem;margin-bottom:20px;margin-top:0}.result-value{align-items:center;background:#fff;background:var(--white);border:2px solid #3498db;border:2px solid var(--primary);border-radius:10px;color:#3498db;color:var(--primary);display:flex;font-size:2.5rem;justify-content:center;margin-bottom:15px;min-height:80px;padding:20px}.percentage-calculator.dark-mode .result-value{background:#1a202c;background:var(--dark-bg)}.formula-display{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#7f8c8d;color:var(--text-light);font-size:1rem;padding:15px}.percentage-calculator.dark-mode .formula-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#a0aec0;color:var(--dark-text-secondary)}.action-buttons{gap:15px}.copy-btn:hover:not(:disabled){background-color:#7f8c8d;transform:translateY(-2px)}.save-btn{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}.save-btn:hover:not(:disabled){background-color:#27ae60;transform:translateY(-2px)}.steps-btn{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.steps-btn:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-2px)}.steps-section{animation:fadeIn .3s ease-out}.percentage-calculator.dark-mode .steps-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.steps-section h3{margin-bottom:20px}.step-item{border-left:4px solid #3498db;border-left:4px solid var(--primary);font-family:Courier New,monospace;font-size:.95rem;padding:15px}.percentage-calculator.dark-mode .step-item{background:#1a202c;background:var(--dark-bg)}.examples-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.percentage-calculator.dark-mode .examples-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.examples-section h3{color:inherit;font-size:1.2rem;margin-top:0}.examples-grid{grid-gap:15px;gap:15px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.example-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;cursor:pointer;padding:15px;transition:all .3s ease}.example-item:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.percentage-calculator.dark-mode .example-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.example-desc{font-weight:600;margin-bottom:8px}.example-result{color:#3498db;color:var(--primary);font-weight:700}.percentage-calculator.dark-mode .settings-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-section h3{color:inherit}.setting-group input[type=number]{background-color:#fff;background-color:var(--white);border-radius:6px;color:#2c3e50;color:var(--text);padding:8px 12px}.percentage-calculator.dark-mode .setting-group input[type=number]{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group input[type=text]{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:.95rem;padding:8px 12px;width:60px}.percentage-calculator.dark-mode .setting-group input[type=text]{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.import-export-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.percentage-calculator.dark-mode .import-export-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.import-export-section h3{color:inherit;font-size:1.2rem;margin-bottom:20px;margin-top:0}.import-export-buttons{display:flex;gap:15px;justify-content:center}.import-btn{background-color:#f39c12;background-color:var(--warning);color:#fff;color:var(--white)}.import-btn:hover:not(:disabled){background-color:#e67e22;transform:translateY(-2px)}.export-btn{background-color:#2ecc71;background-color:var(--success)}.export-btn:hover:not(:disabled){background-color:#27ae60;transform:translateY(-2px)}.percentage-calculator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.percentage-calculator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.percentage-calculator.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-type{background:#3498db;background:var(--primary);color:#fff;color:var(--white)}.history-timestamp{opacity:.8}.history-formula{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.percentage-calculator.dark-mode .history-formula{color:#f7fafc;color:var(--dark-text)}.restore-btn{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white);flex-shrink:0;font-size:.9rem;margin-left:16px;padding:8px 16px}.restore-btn:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}@media (max-width:768px){.percentage-calculator{margin:16px;padding:20px}.input-grid{grid-template-columns:1fr}.action-buttons{align-items:center;flex-direction:column}.action-buttons button{max-width:300px;width:100%}.examples-grid,.settings-grid{grid-template-columns:1fr}.import-export-buttons{align-items:center;flex-direction:column}.import-export-buttons button{max-width:250px;width:100%}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-btn{align-self:flex-end;margin-left:0}}.percentage-calculator-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:20px auto;max-width:1000px;padding:30px}.percentage-calculator-article.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.article-header{align-items:center;display:flex;justify-content:space-between}.percentage-calculator-article.dark-mode .article-header{border-bottom-color:var(--dark-border)}.article-header h1{margin:0;text-align:left}.dark-mode-toggle{font-size:.9rem}.percentage-calculator-article.dark-mode .article-section h3{color:var(--dark-text)}.article-section p{font-size:1.05rem}.calculation-type{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;margin-bottom:25px;padding:25px}.percentage-calculator-article.dark-mode .calculation-type{background:var(--dark-bg-light);border-color:var(--dark-border)}.formula-box{background:var(--primary);font-size:1.1rem;font-weight:600}.example-box,.formula-box{color:var(--white);margin:15px 0;padding:15px 20px}.example-box{background:var(--success);font-size:1rem;text-align:left}.application-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.application-item{border-radius:10px}.application-item:hover{box-shadow:0 8px 25px #0000001a;transform:translateY(-4px)}.percentage-calculator-article.dark-mode .application-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.application-item h3{font-size:1.2rem;margin-bottom:12px}.mistake-list{display:flex;flex-direction:column;gap:20px}.mistake-item{background:#fff5f5;padding:20px;text-align:left}.percentage-calculator-article.dark-mode .mistake-item{background:#e74c3c1a}.mistake-item h3{color:var(--danger);font-size:1.1rem;margin-bottom:10px}.formula-reference{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;padding:25px}.percentage-calculator-article.dark-mode .formula-reference{background:var(--dark-bg-light);border-color:var(--dark-border)}.formula-item{border-bottom:1px solid var(--border);font-family:Courier New,monospace;font-size:1rem;padding:12px 0;text-align:left}.formula-item:last-child{border-bottom:none}.percentage-calculator-article.dark-mode .formula-item{border-bottom-color:var(--dark-border)}.tips-list{gap:20px}.tip-item{background:#f0f9ff}.percentage-calculator-article.dark-mode .tip-item{background:#3498db1a}.tip-item h3{color:var(--primary);font-size:1.1rem;margin-bottom:10px}.context-explanation{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;padding:25px;text-align:left}.percentage-calculator-article.dark-mode .context-explanation{background:var(--dark-bg-light);border-color:var(--dark-border)}.context-explanation h3{color:var(--primary);margin-bottom:12px;margin-top:20px}.context-explanation h3:first-child{margin-top:0}.practice-problems{display:flex;flex-direction:column;gap:20px}.problem{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;padding:20px;text-align:left}.percentage-calculator-article.dark-mode .problem{background:var(--dark-bg-light);border-color:var(--dark-border)}.problem h4{color:var(--primary);font-size:1.1rem;margin-bottom:10px}.problem details{margin-top:15px}.problem summary{color:var(--primary);cursor:pointer;font-weight:600;padding:8px 0}.problem summary:hover{color:var(--primary-hover)}.problem details p{background:var(--white);border:1px solid var(--border);border-radius:6px;font-family:Courier New,monospace;margin-top:10px;padding:15px}.percentage-calculator-article.dark-mode .problem details p{background:var(--dark-bg);border-color:var(--dark-border)}@media (max-width:768px){.percentage-calculator-article{margin:10px;padding:20px}.article-header{align-items:flex-start;flex-direction:column;gap:20px}.article-header h1{font-size:2rem}.application-grid{grid-template-columns:1fr}.calculation-type{padding:20px}.formula-box{font-size:1rem;padding:12px 16px}}@media (max-width:480px){.percentage-calculator-article{margin:5px;padding:15px}.article-header h1{font-size:1.7rem}.article-section h2{font-size:1.5rem}.calculation-type{padding:15px}}.gpa-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.gpa-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.gpa-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.education-level-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.gpa-calculator.dark-mode .education-level-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.education-level-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px;margin-top:0}.level-selector{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:16px}.level-selector button{align-items:center;border:2px solid #0000;border-radius:10px;cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 20px;transition:all .3s ease}.level-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.level-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#e1e8ed;border-color:var(--border);color:#2c3e50;color:var(--text)}.level-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.gpa-calculator.dark-mode .level-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.level-features{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-style:italic}.gpa-calculator.dark-mode .level-features{color:#a0aec0;color:var(--dark-text-secondary)}.scale-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.gpa-calculator.dark-mode .scale-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.scale-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px;margin-top:0}.scale-controls{grid-gap:20px;align-items:start;display:grid;gap:20px;grid-template-columns:1fr 1fr}.scale-select{-webkit-appearance:none;appearance:none;background-color:#fff;background-color:var(--white);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);background-position:right 12px center;background-repeat:no-repeat;background-size:16px;border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease}.scale-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.gpa-calculator.dark-mode .scale-select{background-color:#1a202c;background-color:var(--dark-bg);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.calculation-type{display:flex;flex-direction:column;gap:12px}.calculation-type label{align-items:center;cursor:pointer;display:flex;font-weight:500;gap:8px}.calculation-type input[type=radio]{accent-color:#3498db;accent-color:var(--primary);height:18px;width:18px}.cumulative-inputs{grid-gap:16px;border-top:1px solid #e1e8ed;border-top:1px solid var(--border);display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-top:16px;padding-top:16px}.gpa-calculator.dark-mode .cumulative-inputs{border-top-color:#4a5568;border-top-color:var(--dark-border)}.input-group label{font-weight:500}.gpa-calculator.dark-mode .input-group label{color:#a0aec0;color:var(--dark-text-secondary)}.input-group input{font-family:inherit;font-size:.95rem;padding:10px 12px}.gpa-calculator.dark-mode .input-group input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.gpa-display-section{background:linear-gradient(135deg,#3498db,#5dade2);background:linear-gradient(135deg,var(--primary),#5dade2);border-radius:16px;box-shadow:0 8px 25px #3498db4d;color:#fff;margin-bottom:30px;padding:30px;text-align:center}.gpa-main{margin-bottom:24px}.gpa-value{font-size:3.5rem;font-weight:800;line-height:1;margin-bottom:8px}.gpa-number{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.gpa-scale{font-size:2rem;margin-left:8px;opacity:.8}.gpa-label{font-size:1.2rem;font-weight:600;opacity:.9}.gpa-conversions{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin-bottom:20px}.conversion-item{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff26;border-radius:10px;padding:12px}.conversion-label{display:block;font-size:.85rem;margin-bottom:4px;opacity:.8}.conversion-value{display:block;font-size:1.1rem;font-weight:700}.gpa-stats{display:flex;gap:32px;justify-content:center}.stat-label{display:block;margin-bottom:4px;opacity:.8}.course-section{margin-bottom:30px}.course-actions{display:flex;gap:12px}.add-course-btn{align-items:center;background-color:#2ecc71;background-color:var(--success);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;padding:12px 20px;transition:all .3s ease}.add-course-btn:hover{background-color:#27ae60;box-shadow:0 4px 12px #2ecc714d;transform:translateY(-2px)}.clear-btn{align-items:center;background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:8px;display:flex;font-size:.95rem;font-weight:600;gap:8px;padding:12px 20px;transition:all .3s ease}.clear-btn:hover:not(:disabled){background-color:#c0392b;transform:translateY(-2px)}.clear-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.courses-list{display:flex;flex-direction:column;gap:16px}.course-item{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px;transition:all .3s ease}.course-item:hover{box-shadow:0 4px 12px #0000000d;transform:translateY(-2px)}.gpa-calculator.dark-mode .course-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.course-row{grid-gap:12px;align-items:center;display:grid;gap:12px;grid-template-columns:2fr 1fr 1fr .8fr 1.2fr 1.2fr auto auto;margin-bottom:12px}.course-name{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:inherit;font-size:.95rem;outline:none;padding:10px 12px;transition:all .3s ease}.course-name:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.gpa-calculator.dark-mode .course-name{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.category-select,.credits-input,.grade-input,.grade-type,.semester-select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:.95rem;outline:none;padding:10px 12px;transition:all .3s ease}.category-select:focus,.credits-input:focus,.grade-input:focus,.grade-type:focus,.semester-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.gpa-calculator.dark-mode .category-select,.gpa-calculator.dark-mode .credits-input,.gpa-calculator.dark-mode .grade-input,.gpa-calculator.dark-mode .grade-type,.gpa-calculator.dark-mode .semester-select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.weighted-checkbox{align-items:center;cursor:pointer;display:flex;font-size:.9rem;gap:6px;white-space:nowrap}.weighted-checkbox input[type=checkbox]{accent-color:#3498db;accent-color:var(--primary);height:16px;width:16px}.delete-course-btn{align-items:center;background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.8rem;justify-content:center;padding:8px;transition:all .3s ease}.delete-course-btn:hover{background-color:#c0392b;transform:scale(1.1)}.course-details{align-items:center;color:#7f8c8d;color:var(--text-light);display:flex;font-size:.9rem;font-weight:500;justify-content:space-between}.gpa-calculator.dark-mode .course-details{color:#a0aec0;color:var(--dark-text-secondary)}.course-points,.total-points{background:#3498db1a;border-radius:6px;color:#3498db;color:var(--primary);font-weight:600;padding:6px 12px}.empty-state{padding:40px 20px}.gpa-calculator.dark-mode .empty-state{color:#a0aec0;color:var(--dark-text-secondary)}.primary-actions button:disabled,.secondary-actions button:disabled{cursor:not-allowed;opacity:.6;transform:none}.what-if-section{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.gpa-calculator.dark-mode .what-if-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.what-if-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px;margin-top:0}.target-gpa{flex-wrap:wrap;gap:16px}.target-gpa,.target-gpa label{align-items:center;display:flex}.target-gpa label{font-weight:500;gap:8px}.target-gpa input{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:inherit;font-size:.95rem;outline:none;padding:10px 12px;transition:all .3s ease;width:100px}.target-gpa input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.gpa-calculator.dark-mode .target-gpa input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.target-result{background:#2ecc71;background:var(--success);border-radius:8px;color:#fff;font-weight:600;min-width:200px;padding:12px 16px}.gpa-calculator.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h3{font-weight:600}.settings-grid{grid-template-columns:1fr}.gpa-calculator.dark-mode .setting-group label{color:#a0aec0;color:var(--dark-text-secondary)}.setting-group textarea{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:Fira Code,monospace;font-size:.9rem;min-height:120px;outline:none;padding:12px;resize:vertical;transition:all .3s ease}.setting-group textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.gpa-calculator.dark-mode .setting-group textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.gpa-calculator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.gpa-calculator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.gpa-calculator.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-gpa{font-size:1.1rem;margin-bottom:4px}.history-courses{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.gpa-calculator.dark-mode .history-courses{color:#a0aec0;color:var(--dark-text-secondary)}.restore-button{padding:10px 16px}.gpa-calculator.dark-mode .history-empty{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1200px){.course-row{gap:8px;grid-template-columns:1fr}.course-row>*{width:100%}}@media (max-width:768px){.gpa-calculator{margin:16px;padding:20px}.cumulative-inputs,.scale-controls{grid-template-columns:1fr}.gpa-conversions{grid-template-columns:repeat(2,1fr)}.gpa-stats{gap:16px}.course-actions,.gpa-stats{flex-direction:column}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.history-item,.target-gpa{align-items:flex-start;flex-direction:column}.history-item{gap:12px}.restore-button{align-self:flex-end;margin-left:0}}@media (max-width:480px){.gpa-calculator{margin:8px;padding:16px}.gpa-value{font-size:2.5rem}.gpa-scale{font-size:1.5rem}.gpa-conversions,.level-selector{grid-template-columns:1fr}}.gpa-calculator-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px}.gpa-calculator.dark-mode .gpa-calculator-article{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.gpa-calculator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.gpa-calculator.dark-mode .article-header h2{color:var(--dark-text)}.gpa-calculator.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.gpa-calculator.dark-mode .article-section h3{color:var(--primary)}.gpa-calculator.dark-mode .article-section h4,.gpa-calculator.dark-mode .article-section p,.gpa-calculator.dark-mode .article-section ul{color:var(--dark-text)}.education-levels{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.level-card{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:24px;transition:all .3s ease}.level-card:hover{box-shadow:0 6px 20px #00000014;transform:translateY(-3px)}.gpa-calculator.dark-mode .level-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.level-card h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:0}.level-card p{color:var(--text);font-size:.95rem;margin-bottom:16px}.gpa-calculator.dark-mode .level-card p{color:var(--dark-text)}.level-card ul{margin:0;padding-left:18px}.level-card li{color:var(--text-light);font-size:.9rem;margin-bottom:6px}.gpa-calculator.dark-mode .level-card li{color:var(--dark-text-secondary)}.international-systems{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.system-card{background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 2px 8px #0000000a;padding:20px;transition:all .3s ease}.system-card:hover{box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.gpa-calculator.dark-mode .system-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.system-card h4{color:var(--success);font-size:1rem;font-weight:600;margin-bottom:10px;margin-top:0}.system-card p{color:var(--text);font-size:.9rem;margin-bottom:12px}.gpa-calculator.dark-mode .system-card p{color:var(--dark-text)}.system-card ul{margin:0;padding-left:16px}.system-card li{color:var(--text-light);font-size:.85rem;margin-bottom:4px}.gpa-calculator.dark-mode .system-card li{color:var(--dark-text-secondary)}.gpa-comparison{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr;margin:24px 0}.comparison-card{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;overflow:hidden;padding:24px;position:relative}.comparison-card:before{background:linear-gradient(90deg,var(--primary),var(--success));content:"";height:4px;left:0;position:absolute;right:0;top:0}.gpa-calculator.dark-mode .comparison-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.comparison-card h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:0}.comparison-card p{color:var(--text);font-size:.95rem;margin-bottom:16px}.gpa-calculator.dark-mode .comparison-card p{color:var(--dark-text)}.comparison-card ul{margin:0;padding-left:18px}.comparison-card li{color:var(--text-light);font-size:.9rem;margin-bottom:6px}.gpa-calculator.dark-mode .comparison-card li{color:var(--dark-text-secondary)}.calculation-steps{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.step{background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 2px 6px #0000000a;padding:20px;position:relative}.step:before{background:var(--warning);border-radius:10px 10px 0 0;content:"";height:3px;left:0;position:absolute;right:0;top:0}.gpa-calculator.dark-mode .step{background:var(--dark-bg-light);border-color:var(--dark-border)}.step h4{color:var(--warning);font-size:1rem;font-weight:600;margin-top:0}.step h4,.step p{margin-bottom:12px}.step p{color:var(--text);font-size:.9rem}.gpa-calculator.dark-mode .step p{color:var(--dark-text)}.step ul{margin:0;padding-left:16px}.step li{color:var(--text-light);font-size:.85rem;margin-bottom:4px}.gpa-calculator.dark-mode .step li{color:var(--dark-text-secondary)}.calculation-example{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;margin:24px 0;padding:24px}.gpa-calculator.dark-mode .calculation-example{background:var(--dark-bg-light);border-color:var(--dark-border)}.calculation-example h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:16px;margin-top:0}.calculation-example table{border-collapse:collapse;font-size:.9rem;margin:16px 0;width:100%}.calculation-example td,.calculation-example th{border-bottom:1px solid var(--border);padding:12px;text-align:left}.gpa-calculator.dark-mode .calculation-example td,.gpa-calculator.dark-mode .calculation-example th{border-bottom-color:var(--dark-border)}.calculation-example th{background:var(--white);color:var(--text);font-weight:600}.gpa-calculator.dark-mode .calculation-example th{background:var(--dark-bg);color:var(--dark-text)}.calculation-example td{color:var(--text)}.gpa-calculator.dark-mode .calculation-example td{color:var(--dark-text)}.total-row{background:var(--primary);color:#fff}.total-row td{color:#fff;font-weight:600}.calculation-example>p:last-child{background:#3498db1a;border-radius:8px;color:var(--primary);font-size:1.1rem;font-weight:600;margin-top:16px;padding:12px;text-align:center}.gpa-levels{display:flex;flex-direction:column;gap:16px;margin:24px 0}.level-indicator{background:var(--white);border-left:4px solid;border-radius:10px;box-shadow:0 2px 6px #0000000a;padding:16px 20px;transition:all .3s ease}.level-indicator:hover{box-shadow:0 4px 12px #00000014;transform:translateX(4px)}.gpa-calculator.dark-mode .level-indicator{background:var(--dark-bg-light)}.level-indicator.excellent{background:#27ae600d;border-left-color:#27ae60}.level-indicator.high{background:#2ecc710d;border-left-color:var(--success)}.level-indicator.good{background:#3498db0d;border-left-color:var(--primary)}.level-indicator.average{background:#f39c120d;border-left-color:var(--warning)}.level-indicator.warning{background:#e67e220d;border-left-color:#e67e22}.level-indicator.danger{background:#e74c3c0d;border-left-color:var(--danger)}.level-indicator h4{color:var(--text);font-size:1rem;font-weight:600;margin:0 0 8px}.gpa-calculator.dark-mode .level-indicator h4{color:var(--dark-text)}.level-indicator p{color:var(--text-light);font-size:.9rem;line-height:1.5;margin:0}.gpa-calculator.dark-mode .level-indicator p{color:var(--dark-text-secondary)}.improvement-strategies{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.strategy-card{border-radius:10px;padding:20px;transition:all .3s ease}.strategy-card:hover{box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.gpa-calculator.dark-mode .strategy-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.strategy-card h4{align-items:center;display:flex;font-size:1rem;gap:8px;margin-bottom:12px;margin-top:0}.strategy-card ul{padding-left:18px}.gpa-calculator.dark-mode .strategy-card li{color:var(--dark-text)}.special-topics{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.topic-card{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;padding:20px;transition:all .3s ease}.topic-card:hover{box-shadow:0 4px 12px #0000000d;transform:translateY(-2px)}.gpa-calculator.dark-mode .topic-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.topic-card h4{color:var(--success);font-size:1rem;font-weight:600;margin-bottom:12px;margin-top:0}.topic-card p{color:var(--text);font-size:.9rem;line-height:1.6;margin:0}.gpa-calculator.dark-mode .topic-card p{color:var(--dark-text)}.tech-benefits{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;margin:24px 0;padding:24px}.gpa-calculator.dark-mode .tech-benefits{background:var(--dark-bg-light);border-color:var(--dark-border)}.tech-benefits h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:16px;margin-top:0}.tech-benefits ul{margin:0;padding-left:20px}.tech-benefits li{color:var(--text);font-size:.95rem;line-height:1.6;margin-bottom:12px}.gpa-calculator.dark-mode .tech-benefits li{color:var(--dark-text)}.tech-benefits li strong{color:var(--primary);font-weight:600}@media (max-width:768px){.gpa-calculator-article{margin:20px auto 0;padding:24px}.article-header h2{font-size:1.8rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.4rem}.article-section h4{font-size:1.1rem}.calculation-steps,.education-levels,.gpa-comparison,.improvement-strategies,.international-systems,.special-topics{grid-template-columns:1fr}.calculation-example table{font-size:.8rem}.calculation-example td,.calculation-example th{padding:8px}}@media (max-width:480px){.gpa-calculator-article{margin:16px auto 0;padding:16px}.article-header h2{font-size:1.5rem}.article-section h3{font-size:1.2rem}.calculation-example{overflow-x:auto}.calculation-example table{min-width:400px}}.currency-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.currency-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.currency-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.offline-indicator{background:#f39c12;background:var(--warning);border-radius:4px;color:#fff;font-size:.8rem;margin-left:12px;padding:4px 8px}.dark-mode-toggle,.refresh-btn{align-items:center;background-color:#95a5a6;background-color:var(--secondary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:12px 16px;transition:all .3s ease}.dark-mode-toggle:hover,.refresh-btn:hover:not(:disabled){background-color:#7f8c8d;transform:translateY(-2px)}.refresh-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.status-bar{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;margin-bottom:24px;padding:16px 20px}.currency-converter.dark-mode .status-bar{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.status-info{flex-wrap:wrap;font-size:.9rem;gap:20px}.status-indicator,.status-info{align-items:center;display:flex}.status-indicator{font-weight:600;gap:6px}.status-indicator.online{color:#2ecc71;color:var(--success)}.status-indicator.offline{color:#f39c12;color:var(--warning)}.last-update,.rate-count{color:#7f8c8d;color:var(--text-light)}.currency-converter.dark-mode .last-update,.currency-converter.dark-mode .rate-count{color:#a0aec0;color:var(--dark-text-secondary)}.offline-warning{background:#f39c121a;border:1px solid #f39c12;border:1px solid var(--warning);border-radius:8px;color:#f39c12;color:var(--warning);font-weight:500;margin-top:12px;padding:12px;text-align:center}.converter-section{margin-bottom:30px}.currency-input-container{grid-gap:24px;align-items:center;display:grid;gap:24px;grid-template-columns:1fr auto 1fr}.currency-input{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:24px;transition:all .3s ease}.currency-input:hover{box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.currency-converter.dark-mode .currency-input{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.input-header label{color:#2c3e50;color:var(--text);font-size:1.1rem;font-weight:600}.currency-converter.dark-mode .input-header label{color:#f7fafc;color:var(--dark-text)}.favorite-btn{background:none;border:none;border-radius:4px;cursor:pointer;font-size:1.2rem;padding:4px;transition:all .3s ease}.favorite-btn:hover{background:#3498db1a;transform:scale(1.1)}.currency-selector{margin-bottom:16px}.currency-select{-webkit-appearance:none;appearance:none;background-color:#fff;background-color:var(--white);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);background-position:right 12px center;background-repeat:no-repeat;background-size:16px;border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.currency-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.currency-converter.dark-mode .currency-select{background-color:#1a202c;background-color:var(--dark-bg);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.currency-info{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:500;margin-top:8px}.currency-converter.dark-mode .currency-info{color:#a0aec0;color:var(--dark-text-secondary)}.amount-input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1.2rem;font-weight:600;outline:none;padding:16px;transition:all .3s ease;width:100%}.amount-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.currency-converter.dark-mode .amount-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.amount-output{background:#fff;background:var(--white);border:2px solid #3498db;border:2px solid var(--primary);border-radius:8px;padding:16px;position:relative;text-align:center}.currency-converter.dark-mode .amount-output{background:#1a202c;background:var(--dark-bg)}.converted-amount{color:#3498db;color:var(--primary);display:block;font-size:1.2rem;font-weight:700;word-break:break-all}.commission-info{color:#7f8c8d;color:var(--text-light);font-size:.8rem;margin-top:4px}.currency-converter.dark-mode .commission-info{color:#a0aec0;color:var(--dark-text-secondary)}.swap-container{flex-direction:column;gap:12px}.swap-btn,.swap-container{align-items:center;display:flex}.swap-btn{background:#3498db;background:var(--primary);border:none;border-radius:50%;box-shadow:0 4px 12px #3498db4d;color:#fff;cursor:pointer;font-size:1.5rem;height:48px;justify-content:center;padding:12px;transition:all .3s ease;width:48px}.swap-btn:hover{background:#2980b9;background:var(--primary-hover);transform:rotate(180deg) scale(1.1)}.rate-display{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;min-width:200px;padding:12px 16px;text-align:center}.currency-converter.dark-mode .rate-display{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.rate-value,.rate-value-reverse{color:#2c3e50;color:var(--text);display:block;font-size:.9rem;font-weight:600}.currency-converter.dark-mode .rate-value,.currency-converter.dark-mode .rate-value-reverse{color:#f7fafc;color:var(--dark-text)}.rate-value-reverse{color:#7f8c8d;color:var(--text-light);font-size:.8rem;margin-top:4px}.currency-converter.dark-mode .rate-value-reverse{color:#a0aec0;color:var(--dark-text-secondary)}.import-btn,.primary-actions button,.secondary-actions button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;padding:12px 20px;text-decoration:none;transition:all .3s ease}.import-btn:hover,.primary-actions button:hover:not(:disabled),.secondary-actions button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.settings-section{animation:fadeIn .3s ease-out}.currency-converter.dark-mode .settings-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:20px;margin-top:0}.currency-converter.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.setting-group input[type=number]{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:inherit;font-size:.95rem;outline:none;padding:10px 12px;transition:all .3s ease}.setting-group input[type=number]:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.currency-converter.dark-mode .setting-group input[type=number]{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group input[type=checkbox]{height:18px;width:18px}.currency-converter.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.clear-history{border-radius:8px;font-weight:600;padding:10px 16px}.clear-history:disabled{cursor:not-allowed;opacity:.6}.history-item{border-radius:10px}.currency-converter.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-conversion{align-items:center;display:flex;font-weight:600;gap:12px}.history-arrow{color:#3498db;color:var(--primary);font-size:1.2rem}.history-meta{flex-direction:column;gap:4px}.currency-converter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-offline{background:#f39c12;background:var(--warning);border-radius:4px;color:#fff;font-size:.75rem;padding:2px 6px}.restore-button{font-weight:600}.history-empty{color:#7f8c8d;color:var(--text-light);font-style:italic;padding:20px;text-align:center}.currency-converter.dark-mode .history-empty{color:#a0aec0;color:var(--dark-text-secondary)}.chart-section{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.currency-converter.dark-mode .chart-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.chart-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:20px;margin-top:0}.chart-placeholder{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:40px;text-align:center}.currency-converter.dark-mode .chart-placeholder{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.trend-info{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-around;margin-top:20px}.trend-item{align-items:center;display:flex;flex-direction:column;gap:4px}.trend-label{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.currency-converter.dark-mode .trend-label{color:#a0aec0;color:var(--dark-text-secondary)}.trend-value{font-size:1rem;font-weight:600}.trend-value.positive{color:#2ecc71;color:var(--success)}.trend-value.negative{color:#e74c3c;color:var(--danger)}.quick-conversion-section{margin-bottom:30px}.quick-conversion-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px}.quick-cards{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.quick-card{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;cursor:pointer;padding:16px;text-align:center;transition:all .3s ease}.quick-card:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #0000001a;transform:translateY(-3px)}.currency-converter.dark-mode .quick-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.quick-amount{color:#2c3e50;color:var(--text);font-weight:600;margin-bottom:8px}.currency-converter.dark-mode .quick-amount{color:#f7fafc;color:var(--dark-text)}.quick-result{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:700}.popular-pairs-section{margin-bottom:30px}.popular-pairs-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px}.pairs-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.pair-card{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;cursor:pointer;padding:16px;text-align:center;transition:all .3s ease}.pair-card:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.currency-converter.dark-mode .pair-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.pair-currencies{color:#2c3e50;color:var(--text);font-size:.9rem;font-weight:600;margin-bottom:8px}.currency-converter.dark-mode .pair-currencies{color:#f7fafc;color:var(--dark-text)}.pair-rate{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:700}.search-section{margin-bottom:30px}.search-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px}.search-input{border:1px solid #e1e8ed;border:1px solid var(--border);font-family:inherit;font-size:1rem;outline:none;padding:16px;transition:all .3s ease;width:100%}.currency-converter.dark-mode .search-input{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.search-results{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;margin-top:16px;max-height:300px;overflow-y:auto}.currency-converter.dark-mode .search-results{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.search-result{grid-gap:12px;align-items:center;border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);cursor:pointer;display:grid;gap:12px;grid-template-columns:auto auto 1fr auto;padding:12px 16px;transition:all .3s ease}.search-result:hover{background:#f8fafc;background:var(--bg-light)}.search-result:last-child{border-bottom:none}.currency-converter.dark-mode .search-result{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.currency-converter.dark-mode .search-result:hover{background:#1a202c;background:var(--dark-bg)}.result-flag{font-size:1.2rem}.result-code{color:#3498db;color:var(--primary);font-weight:600}.result-name{color:#2c3e50;color:var(--text)}.currency-converter.dark-mode .result-name{color:#f7fafc;color:var(--dark-text)}.result-country{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.currency-converter.dark-mode .result-country{color:#a0aec0;color:var(--dark-text-secondary)}.alerts-section{margin-bottom:30px}.alerts-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px}.alert-form{margin-bottom:16px}.alert-select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.alert-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.currency-converter.dark-mode .alert-select{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.alerts-list{display:flex;flex-direction:column;gap:12px}.alert-item{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;display:flex;justify-content:space-between;padding:16px;transition:all .3s ease}.alert-item.active{background:#2ecc710d;border-color:#2ecc71;border-color:var(--success)}.alert-item.inactive{border-color:#7f8c8d;border-color:var(--text-light);opacity:.7}.currency-converter.dark-mode .alert-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.alert-pair{color:#2c3e50;color:var(--text);font-weight:600}.currency-converter.dark-mode .alert-pair{color:#f7fafc;color:var(--dark-text)}.alert-condition{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.currency-converter.dark-mode .alert-condition{color:#a0aec0;color:var(--dark-text-secondary)}.alert-status{font-size:.9rem;font-weight:500}.remove-alert{background:none;border:none;border-radius:4px;cursor:pointer;font-size:1rem;padding:4px;transition:all .3s ease}.remove-alert:hover{background:#e74c3c1a;transform:scale(1.1)}.alerts-empty{color:#7f8c8d;color:var(--text-light);font-style:italic;padding:20px;text-align:center}.currency-converter.dark-mode .alerts-empty{color:#a0aec0;color:var(--dark-text-secondary)}.travel-section{margin-bottom:30px}.travel-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px}.travel-calculator{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.currency-converter.dark-mode .travel-calculator{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.travel-input{margin-bottom:20px}.travel-input label{color:#2c3e50;color:var(--text);display:block;font-weight:500;margin-bottom:8px}.currency-converter.dark-mode .travel-input label{color:#f7fafc;color:var(--dark-text)}.travel-input input{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:inherit;font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.travel-input input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.currency-converter.dark-mode .travel-input input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.travel-results{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.travel-result{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px;text-align:center}.currency-converter.dark-mode .travel-result{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.travel-result span:first-child{color:#7f8c8d;color:var(--text-light);display:block;font-size:.9rem;margin-bottom:8px}.currency-converter.dark-mode .travel-result span:first-child{color:#a0aec0;color:var(--dark-text-secondary)}.travel-result span:last-child{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:700}.info-section{margin-bottom:30px}.info-section h3{align-items:center;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:16px}.currency-details{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr}.currency-detail-card{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.currency-converter.dark-mode .currency-detail-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.currency-detail-card h4{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:16px;margin-top:0}.currency-detail-card p{color:#2c3e50;color:var(--text);line-height:1.5;margin:8px 0}.currency-converter.dark-mode .currency-detail-card p{color:#f7fafc;color:var(--dark-text)}.currency-detail-card strong{color:#7f8c8d;color:var(--text-light)}.currency-converter.dark-mode .currency-detail-card strong{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1200px){.currency-input-container{gap:16px;grid-template-columns:1fr}.swap-container{flex-direction:row;order:2}.currency-input:first-child{order:1}.currency-input:last-child{order:3}}@media (max-width:768px){.currency-converter{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.header-controls{justify-content:center}.status-info{flex-direction:column;gap:8px;text-align:center}.settings-grid{grid-template-columns:1fr}.pairs-grid,.quick-cards{grid-template-columns:repeat(2,1fr)}.currency-details,.travel-results{grid-template-columns:1fr}.trend-info{flex-direction:column;gap:12px}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-button{align-self:flex-end}}@media (max-width:480px){.currency-converter{margin:8px;padding:16px}.header-section h2{font-size:1.5rem}.currency-input{padding:16px}.amount-input,.converted-amount{font-size:1rem}.pairs-grid,.quick-cards{grid-template-columns:1fr}.search-result{gap:8px;grid-template-columns:auto 1fr}.result-country{grid-column:1/-1;margin-top:4px}}.loading-indicator{animation:pulse 2s infinite;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;margin-bottom:20px;padding:20px;text-align:center}.currency-converter.dark-mode .loading-indicator{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}@keyframes pulse{0%{opacity:1}50%{opacity:.7}to{opacity:1}}.currency-converter-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px}.currency-converter.dark-mode .currency-converter-article{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.currency-converter.dark-mode .article-header{border-bottom-color:var(--dark-border)}.currency-converter.dark-mode .article-header h2{color:var(--dark-text)}.article-subtitle{font-style:italic}.currency-converter.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-section h3{font-size:1.6rem}.article-section h3,.currency-converter.dark-mode .article-section h3{color:var(--primary)}.article-section h4{margin:24px 0 16px}.currency-converter.dark-mode .article-section h4,.currency-converter.dark-mode .article-section p{color:var(--dark-text)}.article-section ul{color:var(--text);padding-left:20px}.currency-converter.dark-mode .article-section ul{color:var(--dark-text)}.concept-cards{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.concept-card{padding:20px}.concept-card:hover{box-shadow:0 6px 20px #00000014;transform:translateY(-3px)}.currency-converter.dark-mode .concept-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.concept-card h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:0}.concept-card p{font-size:.95rem;margin:0}.currency-converter.dark-mode .concept-card p{color:var(--dark-text)}.factors-list{display:flex;flex-direction:column;gap:20px;margin:24px 0}.factor-item{background:var(--white);border-left:4px solid var(--primary);border-radius:10px;box-shadow:0 2px 8px #0000000a;padding:20px;transition:all .3s ease}.factor-item:hover{box-shadow:0 4px 12px #00000014;transform:translateX(4px)}.currency-converter.dark-mode .factor-item{background:var(--dark-bg-light)}.factor-item h4{align-items:center;color:var(--primary);display:flex;font-size:1rem;font-weight:600;gap:8px;margin-bottom:8px;margin-top:0}.factor-item p{color:var(--text);font-size:.95rem;line-height:1.6;margin:0}.currency-converter.dark-mode .factor-item p{color:var(--dark-text)}.currency-profiles{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.currency-profile{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:24px;transition:all .3s ease}.currency-profile:hover{box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.currency-converter.dark-mode .currency-profile{background:var(--dark-bg-light);border-color:var(--dark-border)}.currency-profile h4{color:var(--success);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:0}.currency-profile p{color:var(--text);font-size:.95rem;line-height:1.6;margin-bottom:16px}.currency-converter.dark-mode .currency-profile p{color:var(--dark-text)}.currency-profile ul{margin:0;padding-left:18px}.currency-profile li{color:var(--text-light);font-size:.9rem;margin-bottom:6px}.currency-converter.dark-mode .currency-profile li{color:var(--dark-text-secondary)}.crypto-info{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.crypto-card{background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 2px 8px #0000000a;padding:20px;transition:all .3s ease}.crypto-card:hover{box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.currency-converter.dark-mode .crypto-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.crypto-card h4{color:var(--warning);font-size:1rem;font-weight:600;margin-bottom:12px;margin-top:0}.crypto-card p{color:var(--text);font-size:.9rem;line-height:1.5;margin:0}.currency-converter.dark-mode .crypto-card p{color:var(--dark-text)}.offline-features{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.offline-feature{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;overflow:hidden;padding:20px;position:relative}.offline-feature:before{background:var(--secondary);border-radius:10px 10px 0 0;content:"";height:3px;left:0;position:absolute;right:0;top:0}.currency-converter.dark-mode .offline-feature{background:var(--dark-bg-light);border-color:var(--dark-border)}.offline-feature h4{align-items:center;color:var(--secondary);display:flex;font-size:1rem;font-weight:600;gap:8px;margin-bottom:12px;margin-top:0}.offline-feature p{color:var(--text);font-size:.9rem;line-height:1.6;margin:0}.currency-converter.dark-mode .offline-feature p{color:var(--dark-text)}.application-scenarios{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.scenario-card:hover{box-shadow:0 6px 20px #0000001a;transform:translateY(-3px)}.currency-converter.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.scenario-card h4{align-items:center;display:flex;gap:8px;margin-bottom:12px;margin-top:0}.scenario-card p{color:var(--text);font-size:.95rem;line-height:1.6;margin-bottom:16px}.currency-converter.dark-mode .scenario-card p{color:var(--dark-text)}.scenario-card ul{padding-left:18px}.scenario-card li{color:var(--text-light)}.currency-converter.dark-mode .scenario-card li{color:var(--dark-text-secondary)}.advanced-features{display:flex;flex-direction:column;gap:20px}.feature-explanation{background:var(--bg-light);border:1px solid var(--border);border-left:4px solid var(--success);border-radius:10px;padding:20px;transition:all .3s ease}.feature-explanation:hover{box-shadow:0 4px 12px #0000000d;transform:translateX(4px)}.currency-converter.dark-mode .feature-explanation{background:var(--dark-bg-light);border-color:var(--dark-border);border-left-color:var(--success)}.feature-explanation h4{align-items:center;color:var(--success);display:flex;font-size:1rem;font-weight:600;gap:8px;margin-bottom:8px;margin-top:0}.feature-explanation p{color:var(--text);font-size:.95rem;line-height:1.6;margin:0}.currency-converter.dark-mode .feature-explanation p{color:var(--dark-text)}.best-practices{display:flex;flex-direction:column;gap:24px;margin:24px 0}.practice-item{border-radius:12px;box-shadow:0 2px 8px #0000000a;padding:24px}.currency-converter.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.practice-item h4{align-items:center;color:var(--primary);display:flex;font-size:1.1rem;gap:8px;margin-bottom:12px;margin-top:0}.practice-item p{color:var(--text);line-height:1.6;margin-bottom:16px}.currency-converter.dark-mode .practice-item p{color:var(--dark-text)}.practice-item ul{margin:0;padding-left:18px}.practice-item li{color:var(--text);font-size:.9rem;line-height:1.5;margin-bottom:8px}.currency-converter.dark-mode .practice-item li{color:var(--dark-text)}.mistakes-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.mistake-card{background:#e74c3c0d;border:1px solid #e74c3c33;border-radius:10px;padding:20px;transition:all .3s ease}.mistake-card:hover{box-shadow:0 4px 12px #e74c3c1a;transform:translateY(-2px)}.currency-converter.dark-mode .mistake-card{background:#e74c3c1a}.mistake-card h4{color:var(--danger);font-size:1rem;font-weight:600;margin-bottom:12px;margin-top:0}.mistake-card p{color:var(--text);font-size:.9rem;line-height:1.5;margin:0}.currency-converter.dark-mode .mistake-card p{color:var(--dark-text)}.trend-item{border:1px solid var(--border);border-left:4px solid var(--warning);border-radius:10px;transition:all .3s ease}.trend-item:hover{box-shadow:0 4px 12px #0000000d;transform:translateX(4px)}.currency-converter.dark-mode .trend-item{background:var(--dark-bg-light);border-color:var(--dark-border);border-left-color:var(--warning)}.trend-item h4{align-items:center;color:var(--warning);display:flex;font-size:1rem;gap:8px;margin-bottom:8px;margin-top:0}.currency-converter.dark-mode .trend-item p{color:var(--dark-text)}.regulatory-info{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.regulation-card{background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 2px 8px #0000000a;padding:20px;transition:all .3s ease}.regulation-card:hover{box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.currency-converter.dark-mode .regulation-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.regulation-card h4{align-items:center;color:var(--secondary);display:flex;font-size:1rem;font-weight:600;gap:8px;margin-bottom:12px;margin-top:0}.regulation-card p{color:var(--text);font-size:.9rem;line-height:1.6;margin:0}.currency-converter.dark-mode .regulation-card p{color:var(--dark-text)}@media (max-width:768px){.currency-converter-article{margin:20px auto 0;padding:24px}.article-header h2{font-size:1.8rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.4rem}.article-section h4{font-size:1.1rem}.application-scenarios,.concept-cards,.crypto-info,.currency-profiles,.mistakes-grid,.offline-features,.regulatory-info{grid-template-columns:1fr}}@media (max-width:480px){.currency-converter-article{margin:16px auto 0;padding:16px}.article-header h2{font-size:1.5rem}.article-section h3{font-size:1.2rem}.concept-card,.crypto-card,.currency-profile,.factor-item,.feature-explanation,.mistake-card,.offline-feature,.practice-item,.regulation-card,.scenario-card,.trend-item{padding:16px}}.tip-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.tip-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.tip-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.tip-calculator.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tip-calculator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.currency-input{align-items:center;display:flex;position:relative}.currency-symbol{color:#7f8c8d;color:var(--text-light);font-weight:600;left:16px;position:absolute;z-index:1}.currency-input input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-size:1.1rem;font-weight:600;outline:none;padding:16px 16px 16px 40px;transition:all .3s ease;width:100%}.currency-input input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.tip-calculator.dark-mode .currency-input input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tip-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.tip-button{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;font-weight:600;outline:none;padding:12px 20px;transition:all .3s ease}.tip-button:hover{transform:translateY(-1px)}.tip-button.active,.tip-button:hover{border-color:#3498db;border-color:var(--primary)}.tip-button.active{background-color:#3498db;background-color:var(--primary);box-shadow:0 4px 12px #3498db4d;color:#fff;transform:translateY(-2px)}.tip-calculator.dark-mode .tip-button{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.custom-tip input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.custom-tip input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.tip-calculator.dark-mode .custom-tip input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.people-selector{align-items:center;display:flex;gap:12px}.people-selector button{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:1.2rem;font-weight:600;height:40px;justify-content:center;outline:none;transition:all .3s ease;width:40px}.people-selector button:hover:not(:disabled){background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.people-selector button:disabled{cursor:not-allowed;opacity:.5}.people-selector input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-size:1rem;font-weight:600;outline:none;padding:12px 16px;text-align:center;transition:all .3s ease;width:80px}.people-selector input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.tip-calculator.dark-mode .people-selector button,.tip-calculator.dark-mode .people-selector input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.service-quality select{-webkit-appearance:none;appearance:none;background-color:#fff;background-color:var(--white);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);background-position:right 12px center;background-repeat:no-repeat;background-size:16px;border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.service-quality select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.tip-calculator.dark-mode .service-quality select{background-color:#1a202c;background-color:var(--dark-bg);background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tip-calculator.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.calculation-display{display:flex;flex-direction:column;gap:16px}.result-item{align-items:center;border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:16px 0}.result-item:last-child{border-bottom:none}.tip-calculator.dark-mode .result-item{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.result-item.primary{font-size:1.1rem;font-weight:600}.result-item .label{color:#7f8c8d;color:var(--text-light);font-weight:500}.tip-calculator.dark-mode .result-item .label{color:#a0aec0;color:var(--dark-text-secondary)}.result-item .value{color:#2c3e50;color:var(--text);font-size:1.1rem;font-weight:600}.result-item .value.total{color:#3498db;color:var(--primary);font-size:1.3rem;font-weight:700}.tip-calculator.dark-mode .result-item .value{color:#f7fafc;color:var(--dark-text)}.divider{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:600;letter-spacing:.5px;margin:8px 0;text-align:center;text-transform:uppercase}.tip-calculator.dark-mode .divider{color:#a0aec0;color:var(--dark-text-secondary)}.tip-range{border-top:1px solid #e1e8ed;border-top:1px solid var(--border);margin-top:16px;padding-top:16px;text-align:center}.tip-calculator.dark-mode .tip-range{border-top-color:#4a5568;border-top-color:var(--dark-border)}.tip-range small{color:#7f8c8d;color:var(--text-light);font-size:.85rem}.tip-calculator.dark-mode .tip-range small{color:#a0aec0;color:var(--dark-text-secondary)}.primary-action:hover:not(:disabled){background-color:#3498db;background-color:var(--primary)}.danger-action{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white)}.danger-action:hover:not(:disabled){background-color:#c0392b;transform:translateY(-1px)}button.small{padding:8px 16px}.tip-calculator.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tip-calculator.dark-mode .advanced-settings h3,.tip-calculator.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.setting-group input,.setting-group select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:.95rem;outline:none;padding:12px 16px;transition:all .3s ease}.setting-group select{-webkit-appearance:none;appearance:none;background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png);background-position:right 12px center;background-repeat:no-repeat;background-size:16px}.setting-group input:focus,.setting-group select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.tip-calculator.dark-mode .setting-group input,.tip-calculator.dark-mode .setting-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tip-calculator.dark-mode .setting-group select{background-image:url(https://img.icons8.com/material-outlined/16/000000/expand-arrow--v1.png)}.tip-calculator.dark-mode .history-header h3{color:#f7fafc;color:var(--dark-text)}.no-history{padding:40px 20px}.tip-calculator.dark-mode .no-history{color:#a0aec0;color:var(--dark-text-secondary)}.history-item{border-radius:12px;padding:20px}.tip-calculator.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-meta{gap:16px}.tip-calculator.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.tip-info{background:#3498db;background:var(--primary);border-radius:4px;color:#fff;font-weight:600;padding:4px 8px}.history-details{color:#2c3e50;color:var(--text);flex-wrap:wrap;font-size:.95rem;gap:20px}.tip-calculator.dark-mode .history-details{color:#f7fafc;color:var(--dark-text)}.restore-button{margin-left:20px;padding:10px 20px}@media (max-width:768px){.tip-calculator{margin:16px;padding:20px}.calculator-grid{grid-template-columns:1fr}.tip-buttons{grid-template-columns:repeat(3,1fr)}.action-buttons{flex-direction:column}.settings-grid{grid-template-columns:1fr}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.history-details{width:100%}.restore-button{align-self:flex-end;margin-left:0}}@media (max-width:480px){.tip-calculator{margin:8px;padding:16px}.header-section{flex-direction:column;gap:16px;text-align:center}.tip-buttons{grid-template-columns:repeat(2,1fr)}.people-selector{justify-content:center}}.tip-calculator-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 20px;max-width:1000px;padding:40px}.tip-calculator.dark-mode .tip-calculator-article{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.tip-calculator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.tip-calculator.dark-mode .article-header h2{color:var(--dark-text)}.tip-calculator.dark-mode .article-header p{color:var(--dark-text-secondary)}.article-content h3{font-size:1.5rem}.tip-calculator.dark-mode .article-content h3{color:var(--dark-text)}.article-content h4{font-size:1.1rem}.tip-calculator.dark-mode .article-content h4,.tip-calculator.dark-mode .article-content p,.tip-calculator.dark-mode .article-content ul{color:var(--dark-text)}.article-content li{margin-bottom:12px}.tip-scenarios{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.scenario{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:20px;transition:all .3s ease}.tip-calculator.dark-mode .scenario{background:var(--dark-bg-light);border-color:var(--dark-border)}.scenario:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.scenario h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:0}.scenario p{font-size:.95rem;margin:8px 0}.calculation-methods{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.method{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:20px}.tip-calculator.dark-mode .method{background:var(--dark-bg-light);border-color:var(--dark-border)}.method h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:0}.method p{font-size:.95rem;line-height:1.6;margin:0}.international-tips{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:24px 0}.country-tip{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;padding:16px}.tip-calculator.dark-mode .country-tip{background:var(--dark-bg-light);border-color:var(--dark-border)}.country-tip h4{align-items:center;color:var(--text);display:flex;font-size:1rem;font-weight:600;gap:8px;margin-bottom:8px;margin-top:0}.tip-calculator.dark-mode .country-tip h4{color:var(--dark-text)}.country-tip p{font-size:.9rem;line-height:1.5;margin:0}.example-box{border-left:4px solid var(--primary);border-radius:12px;margin:20px 0;padding:20px}.tip-calculator.dark-mode .example-box{background:var(--dark-bg-light)}.example-box h4{color:var(--primary);font-size:1rem;font-weight:600;margin-bottom:12px;margin-top:0}.example-box p{font-family:Courier New,monospace;font-size:.95rem;margin:6px 0}.mistake{background:var(--white);border:1px solid var(--border);border-left:4px solid var(--danger);border-radius:12px;padding:20px}.tip-calculator.dark-mode .mistake{background:var(--dark-bg-light);border-color:var(--dark-border)}.mistake h4{color:var(--danger);font-size:1rem;font-weight:600;margin-bottom:8px;margin-top:0}.mistake p{font-size:.95rem;line-height:1.6;margin:0}.special-situations{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.situation{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:20px}.tip-calculator.dark-mode .situation{background:var(--dark-bg-light);border-color:var(--dark-border)}.situation h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:0}.situation p{font-size:.95rem;line-height:1.6;margin:0}.tip-calculator.dark-mode .article-footer{border-top-color:var(--dark-border)}.tip-calculator.dark-mode .article-footer p{color:var(--dark-text)}@media (max-width:768px){.tip-calculator-article{margin:20px auto;padding:24px}.article-header h2{font-size:1.8rem}.article-content h3{font-size:1.3rem}.calculation-methods,.international-tips,.special-situations,.tip-scenarios{grid-template-columns:1fr}}@media (max-width:480px){.tip-calculator-article{margin:16px auto;padding:16px}.article-header h2{flex-direction:column;font-size:1.6rem;gap:8px}.article-header p{font-size:1rem}.article-content h3{font-size:1.2rem}.article-content h4{font-size:1rem}.article-content li,.article-content p{font-size:.95rem}.country-tip,.example-box,.method,.mistake,.scenario,.situation{padding:16px}}.age-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.age-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.age-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.calculator-grid{grid-gap:var(--gap);display:grid;gap:var(--gap);grid-template-columns:1fr 1fr;margin-bottom:30px}.age-calculator.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-group{margin-bottom:24px}.input-group:last-child{margin-bottom:0}.input-group label{font-size:.95rem}.age-calculator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-group input,.input-group select{width:100%}.age-calculator.dark-mode .input-group input,.age-calculator.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-group small{display:block;margin-top:6px}.age-calculator.dark-mode .input-group small{color:#a0aec0;color:var(--dark-text-secondary)}.results-section{align-items:center;background:#fff;background:var(--white);box-shadow:0 4px 12px #0000000d;display:flex}.results-section,.results-section h3{justify-content:center}.age-calculator.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.age-display{text-align:center;width:100%}.primary-age{margin-bottom:24px}.age-number{align-items:baseline;color:#3498db;color:var(--primary);display:flex;font-size:3.5rem;font-weight:700;gap:8px;justify-content:center;margin-bottom:8px}.age-unit{color:#7f8c8d;color:var(--text-light);font-size:1.2rem;font-weight:600}.age-calculator.dark-mode .age-unit{color:#a0aec0;color:var(--dark-text-secondary)}.age-details{color:#2c3e50;color:var(--text);font-size:1.1rem;font-weight:500}.age-calculator.dark-mode .age-details{color:#f7fafc;color:var(--dark-text)}.live-time{color:#7f8c8d;color:var(--text-light);font-family:Courier New,monospace;font-size:.9rem;margin-top:8px}.age-calculator.dark-mode .live-time{color:#a0aec0;color:var(--dark-text-secondary)}.age-breakdown{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr;margin-bottom:24px}.age-item{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;justify-content:space-between;padding:12px}.age-calculator.dark-mode .age-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.age-item .label{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:500}.age-calculator.dark-mode .age-item .label{color:#a0aec0;color:var(--dark-text-secondary)}.age-item .value{color:#2c3e50;color:var(--text);font-size:.95rem;font-weight:600}.age-calculator.dark-mode .age-item .value{color:#f7fafc;color:var(--dark-text)}.birthday-countdown{background:linear-gradient(135deg,#3498db,#2ecc71);background:linear-gradient(135deg,var(--primary),var(--success));border-radius:12px;color:#fff;padding:20px;text-align:center}.birthday-countdown h4{font-size:1.1rem;font-weight:600;margin:0 0 12px}.countdown-display{align-items:baseline;display:flex;gap:8px;justify-content:center;margin-bottom:8px}.countdown-unit{font-size:1rem;font-weight:500;opacity:.9}.birthday-countdown small{font-size:.9rem;opacity:.9}.no-age-display{padding:40px 20px;text-align:center}.placeholder-icon{font-size:4rem;margin-bottom:16px}.no-age-display h3{color:#2c3e50;color:var(--text);font-size:1.3rem;font-weight:600;margin:0 0 12px}.age-calculator.dark-mode .no-age-display h3{color:#f7fafc;color:var(--dark-text)}.no-age-display p{color:#7f8c8d;color:var(--text-light);font-size:1rem;line-height:1.5;margin:0}.age-calculator.dark-mode .no-age-display p{color:#a0aec0;color:var(--dark-text-secondary)}.quick-stats{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px}.stat-card{align-items:center;display:flex;gap:16px}.age-calculator.dark-mode .stat-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.stat-card:hover{box-shadow:0 4px 12px #0000001a}.stat-icon{flex-shrink:0;font-size:2rem}.stat-content{flex:1 1}.stat-number{color:#3498db;color:var(--primary);display:block;font-size:1.2rem;font-weight:700}.age-calculator.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.primary-action{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.primary-action:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.secondary-action{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white)}.secondary-action:hover:not(:disabled){background-color:#7f8c8d;transform:translateY(-1px)}.advanced-stats{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.age-calculator.dark-mode .advanced-stats{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.advanced-stats h3{align-items:center;color:#2c3e50;color:var(--text);display:flex;font-size:1.3rem;gap:8px;margin-bottom:24px;margin-top:0}.age-calculator.dark-mode .advanced-stats h3{color:#f7fafc;color:var(--dark-text)}.stats-grid{grid-gap:20px;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.stat-section{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.age-calculator.dark-mode .stat-section{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.stat-section h4{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:600;gap:8px;margin-bottom:16px;margin-top:0}.stat-detail,.stat-section h4{align-items:center;display:flex}.stat-detail{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);font-size:.9rem;justify-content:space-between;padding:8px 0}.stat-detail:last-child{border-bottom:none}.age-calculator.dark-mode .stat-detail{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.stat-detail span:first-child{color:#7f8c8d;color:var(--text-light)}.age-calculator.dark-mode .stat-detail span:first-child{color:#a0aec0;color:var(--dark-text-secondary)}.stat-detail span:last-child{color:#2c3e50;color:var(--text);font-weight:600}.age-calculator.dark-mode .stat-detail span:last-child{color:#f7fafc;color:var(--dark-text)}.progress-item{font-size:.9rem;gap:12px;margin-bottom:12px}.progress-item span:first-child{color:#7f8c8d;color:var(--text-light);flex:1 1}.age-calculator.dark-mode .progress-item span:first-child{color:#a0aec0;color:var(--dark-text-secondary)}.progress-item span:last-child{color:#2c3e50;color:var(--text);font-weight:600;min-width:60px;text-align:right}.age-calculator.dark-mode .progress-item span:last-child{color:#f7fafc;color:var(--dark-text)}.progress-bar{flex:2 1}.age-calculator.dark-mode .progress-bar{background:#4a5568;background:var(--dark-border)}.comparison-section{background:#fff;background:var(--white);padding:24px}.age-calculator.dark-mode .comparison-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.comparison-section h3{align-items:center;color:#2c3e50;color:var(--text);display:flex;font-size:1.2rem;gap:8px;margin-bottom:20px;margin-top:0}.age-calculator.dark-mode .comparison-section h3{color:#f7fafc;color:var(--dark-text)}.comparison-inputs{margin-bottom:20px}.comparison-results{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px}.age-calculator.dark-mode .comparison-results{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.comparison-item{align-items:center;display:flex;font-size:.95rem;justify-content:space-between;padding:8px 0}.comparison-item .label{color:#7f8c8d;color:var(--text-light)}.age-calculator.dark-mode .comparison-item .label{color:#a0aec0;color:var(--dark-text-secondary)}.comparison-item .value{color:#2c3e50;color:var(--text);font-weight:600}.age-calculator.dark-mode .comparison-item .value{color:#f7fafc;color:var(--dark-text)}@media (max-width:768px){.age-calculator{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.header-section h1{font-size:1.6rem}.age-breakdown,.calculator-grid,.quick-stats{grid-template-columns:1fr}.action-buttons{flex-direction:column}.stats-grid{grid-template-columns:1fr}.age-number{font-size:2.5rem}.countdown-number{font-size:2rem}}@media (max-width:480px){.age-calculator{margin:8px;padding:16px}.header-section h1{flex-direction:column;font-size:1.4rem;gap:8px}.age-number{font-size:2rem}.countdown-number{font-size:1.5rem}.advanced-stats,.comparison-section,.stat-card,.stat-section{padding:16px}}.age-calculator-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 20px;max-width:1000px;padding:40px}.age-calculator.dark-mode .age-calculator-article{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.age-calculator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.age-calculator.dark-mode .article-header h2{color:var(--dark-text)}.article-header p{color:var(--text-light);font-size:1.1rem;font-weight:400;margin:0}.age-calculator.dark-mode .article-header p{color:var(--dark-text-secondary)}.article-content section{margin-bottom:40px}.article-content section:last-child{margin-bottom:0}.article-content h3{align-items:center;color:var(--text);display:flex;font-size:1.6rem;font-weight:600;gap:8px;margin:0 0 20px}.age-calculator.dark-mode .article-content h3{color:var(--dark-text)}.article-content h4{color:var(--text);font-size:1.2rem;font-weight:600;margin:20px 0 12px}.age-calculator.dark-mode .article-content h4{color:var(--dark-text)}.article-content p{color:var(--text);font-size:1rem;line-height:1.7;margin:0 0 16px}.age-calculator.dark-mode .article-content p{color:var(--dark-text)}.article-content ul{color:var(--text);margin:16px 0;padding-left:24px}.age-calculator.dark-mode .article-content ul{color:var(--dark-text)}.article-content li{line-height:1.6;margin-bottom:8px}.article-content strong{color:var(--primary);font-weight:600}.calculation-methods{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.method-card{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:20px;transition:all .3s ease}.age-calculator.dark-mode .method-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.method-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.method-card h4{color:var(--primary);font-size:1.1rem;margin-bottom:12px;margin-top:0}.method-card p{font-size:.95rem;line-height:1.6;margin:0}.milestones-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.milestone-category{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:24px}.age-calculator.dark-mode .milestone-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.milestone-category h4{align-items:center;color:var(--primary);display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.milestone-category ul{margin:0;padding-left:20px}.milestone-category li{font-size:.95rem;margin-bottom:10px}.zodiac-systems{margin:24px 0}.zodiac-system{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;margin-bottom:20px;padding:24px}.age-calculator.dark-mode .zodiac-system{background:var(--dark-bg-light);border-color:var(--dark-border)}.zodiac-system h4{color:var(--primary);font-size:1.2rem;margin-bottom:16px;margin-top:0}.zodiac-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin-top:16px}.zodiac-sign{align-items:center;background:var(--white);border:1px solid var(--border);border-radius:8px;display:flex;flex-direction:column;padding:12px;text-align:center}.age-calculator.dark-mode .zodiac-sign{background:var(--dark-bg);border-color:var(--dark-border)}.sign-name{color:var(--text);font-weight:600;margin-bottom:4px}.age-calculator.dark-mode .sign-name{color:var(--dark-text)}.sign-dates{color:var(--text-light);font-size:.8rem}.age-calculator.dark-mode .sign-dates{color:var(--dark-text-secondary)}.chinese-zodiac{display:flex;flex-direction:column;font-size:1.1rem;gap:8px;margin-top:16px;text-align:center}.life-expectancy-data{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.expectancy-card{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:20px}.age-calculator.dark-mode .expectancy-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.expectancy-card h4{color:var(--primary);font-size:1.1rem;margin-bottom:16px;margin-top:0}.expectancy-card ul{margin:0;padding-left:20px}.expectancy-card li{font-size:.95rem;margin-bottom:8px}.development-stages{display:flex;flex-direction:column;gap:20px;margin:24px 0}.stage{background:var(--bg-light);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:12px;padding:20px}.age-calculator.dark-mode .stage{background:var(--dark-bg-light);border-color:var(--dark-border)}.stage h4{color:var(--primary);font-size:1.1rem;margin-bottom:12px;margin-top:0}.stage p{font-size:.95rem;line-height:1.6;margin:0}.time-perception{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.perception-fact{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:20px}.age-calculator.dark-mode .perception-fact{background:var(--dark-bg-light);border-color:var(--dark-border)}.perception-fact h4{color:var(--primary);font-size:1.1rem;margin-bottom:12px;margin-top:0}.perception-fact p{font-size:.95rem;line-height:1.6;margin:0}.birthday-traditions{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.tradition{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:20px}.age-calculator.dark-mode .tradition{background:var(--dark-bg-light);border-color:var(--dark-border)}.tradition h4{align-items:center;color:var(--primary);display:flex;font-size:1.1rem;gap:8px;margin-bottom:12px;margin-top:0}.tradition p{font-size:.95rem;line-height:1.6;margin:0}.age-statistics{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.stat-group{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:24px}.age-calculator.dark-mode .stat-group{background:var(--dark-bg-light);border-color:var(--dark-border)}.stat-group h4{align-items:center;color:var(--primary);display:flex;font-size:1.2rem;gap:8px;margin-bottom:16px;margin-top:0}.stat-group ul{margin:0;padding-left:20px}.stat-group li{font-size:.95rem;line-height:1.5;margin-bottom:10px}.planetary-ages{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.planet-info{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:20px;text-align:center}.age-calculator.dark-mode .planet-info{background:var(--dark-bg-light);border-color:var(--dark-border)}.planet-info h4{color:var(--primary);font-size:1.2rem;margin-bottom:12px;margin-top:0}.planet-info p{font-size:.9rem;line-height:1.6;margin:8px 0}.planet-info p:last-child{color:var(--text-light);font-style:italic;margin-bottom:0}.age-calculator.dark-mode .planet-info p:last-child{color:var(--dark-text-secondary)}.aging-tips{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.tip-category{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:24px}.age-calculator.dark-mode .tip-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.tip-category h4{align-items:center;color:var(--primary);display:flex;font-size:1.2rem;gap:8px;margin-bottom:16px;margin-top:0}.tip-category ul{margin:0;padding-left:20px}.tip-category li{font-size:.95rem;line-height:1.6;margin-bottom:10px}.future-aging{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.research-area{background:var(--bg-light);border:1px solid var(--border);border-left:4px solid var(--success);border-radius:12px;padding:20px}.age-calculator.dark-mode .research-area{background:var(--dark-bg-light);border-color:var(--dark-border)}.research-area h4{align-items:center;color:var(--success);display:flex;font-size:1.1rem;gap:8px;margin-bottom:12px;margin-top:0}.research-area p{font-size:.95rem;line-height:1.6;margin:0}.article-footer{border-top:1px solid var(--border);padding-top:24px}.age-calculator.dark-mode .article-footer{border-top-color:var(--dark-border)}.article-footer p{font-style:italic}.age-calculator.dark-mode .article-footer p{color:var(--dark-text)}@media (max-width:768px){.age-calculator-article{margin:20px auto;padding:24px}.article-header h2{font-size:1.8rem}.article-content h3{font-size:1.4rem}.age-statistics,.aging-tips,.birthday-traditions,.calculation-methods,.future-aging,.life-expectancy-data,.milestones-grid,.planetary-ages,.time-perception{grid-template-columns:1fr}.zodiac-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.age-calculator-article{margin:16px auto;padding:16px}.article-header h2{flex-direction:column;font-size:1.6rem;gap:8px}.article-content h3{font-size:1.3rem}.article-content h4{font-size:1.1rem}.expectancy-card,.method-card,.milestone-category,.perception-fact,.planet-info,.research-area,.stage,.stat-group,.tip-category,.tradition{padding:16px}.zodiac-grid{grid-template-columns:1fr}}.date-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.date-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.date-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.mode-selector{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border-radius:12px;display:grid;gap:16px;grid-template-columns:1fr 1fr;padding:8px}.date-calculator.dark-mode .mode-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.mode-selector button{border:2px solid #0000;border-radius:8px;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px}.mode-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}.mode-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.mode-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.date-calculator.dark-mode .mode-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.quick-presets{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.date-calculator.dark-mode .quick-presets{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.quick-presets h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.preset-btn{font-size:.9rem;padding:10px 16px}.preset-btn:hover{transform:translateY(-1px)}.preset-btn.active{background-color:#2ecc71;background-color:var(--success);border-color:#2ecc71;border-color:var(--success);color:#fff}.date-calculator.dark-mode .preset-btn{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-container{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.date-calculator.dark-mode .input-container{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.addition-inputs,.date-inputs{grid-gap:24px;gap:24px;grid-template-columns:1fr 1fr;margin-bottom:20px}.addition-inputs{align-items:start;display:grid}.date-calculator.dark-mode .input-group label{color:#a0aec0;color:var(--dark-text-secondary)}.input-group input[type=date],.input-group input[type=number],.input-group input[type=time]{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;padding:12px 15px;transition:all .3s ease}.input-group input:focus{outline:none}.date-calculator.dark-mode .input-group input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.duration-inputs{display:flex;flex-direction:column;gap:12px}.duration-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr 1fr}.duration-grid>div{align-items:center;display:flex;flex-direction:column;gap:6px}.duration-grid span{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:500}.date-calculator.dark-mode .duration-grid span{color:#a0aec0;color:var(--dark-text-secondary)}.calculation-options{display:flex;gap:24px;margin-top:20px}.checkbox-label{color:#2c3e50;color:var(--text)}.date-calculator.dark-mode .checkbox-label{color:#f7fafc;color:var(--dark-text)}.calculate-button{font-size:1.1rem}.advanced-toggle{background-color:#95a5a6;background-color:var(--secondary);color:var(--white)}.advanced-toggle:hover{background-color:#7f8c8d;transform:translateY(-1px)}.date-calculator.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h3{margin-bottom:20px}.setting-group select{background:#fff;background:var(--white)}.date-calculator.dark-mode .setting-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.holidays-section{margin-top:20px}.section-header h4{font-size:1.1rem}.add-holiday-btn{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white);font-size:.9rem;padding:8px 16px}.add-holiday-btn:hover{background-color:#27ae60;transform:translateY(-1px)}.holidays-list{display:flex;flex-direction:column;gap:8px}.holiday-item{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;justify-content:space-between;padding:12px 16px}.date-calculator.dark-mode .holiday-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.remove-holiday{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white);font-size:.8rem;padding:6px 10px}.remove-holiday:hover{background-color:#c0392b}.results-section{animation:fadeIn .5s ease-out}.date-calculator.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.results-header{margin-bottom:24px}.result-actions{gap:12px}.copy-button,.export-button{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white);font-size:.9rem;padding:10px 16px}.copy-button:hover,.export-button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.results-grid{grid-gap:24px;gap:24px;grid-template-columns:1fr 1fr}.result-card{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px}.date-calculator.dark-mode .result-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.result-card h4{color:#3498db;color:var(--primary);font-size:1.1rem;margin-bottom:16px;margin-top:0}.result-values{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}.result-item{border-radius:8px;padding:12px;text-align:center}.date-calculator.dark-mode .result-item{background:#2d3748;background:var(--dark-bg-light)}.result-number{color:#3498db;color:var(--primary);display:block;font-size:1.5rem;font-weight:700;margin-bottom:4px}.result-label{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:500}.date-calculator.dark-mode .result-label{color:#a0aec0;color:var(--dark-text-secondary)}.total-results{display:flex;flex-direction:column;gap:12px}.total-item{align-items:center;background:#f8fafc;background:var(--bg-light);border-left:4px solid #3498db;border-left:4px solid var(--primary);border-radius:8px;display:flex;justify-content:space-between;padding:12px 16px}.date-calculator.dark-mode .total-item{background:#2d3748;background:var(--dark-bg-light)}.total-number{color:#3498db;color:var(--primary);font-size:1.2rem;font-weight:700}.total-label{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:500}.date-calculator.dark-mode .total-label{color:#a0aec0;color:var(--dark-text-secondary)}.timeline-section{margin-top:24px}.timeline-section h4{font-size:1.1rem;gap:8px;margin-bottom:16px}.timeline,.timeline-section h4{align-items:center;display:flex}.timeline{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;gap:16px;padding:20px}.date-calculator.dark-mode .timeline{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.timeline-end,.timeline-start{min-width:120px;text-align:center}.timeline-date{color:#3498db;color:var(--primary);font-size:1rem;font-weight:700;margin-bottom:4px}.timeline-label{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:500}.date-calculator.dark-mode .timeline-label{color:#a0aec0;color:var(--dark-text-secondary)}.timeline-bar{background:#f8fafc;background:var(--bg-light);border-radius:10px;flex:1 1;height:20px;overflow:hidden;position:relative}.date-calculator.dark-mode .timeline-bar{background:#2d3748;background:var(--dark-bg-light)}.timeline-progress{background:linear-gradient(90deg,#3498db,#2ecc71);background:linear-gradient(90deg,var(--primary),var(--success));border-radius:10px;height:100%;transition:width .8s ease}.timeline-info{color:#fff;font-size:.85rem;font-weight:600;left:50%;position:absolute;text-shadow:0 1px 2px #0000004d;top:50%;transform:translate(-50%,-50%)}.date-calculator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.date-calculator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.date-calculator.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.calculation-type{font-size:1rem}.history-dates{font-size:.9rem;line-height:1.4}.history-dates>div{margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-dates strong{color:#3498db;color:var(--primary);margin-right:6px}.history-more{font-size:.9rem}.date-calculator.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.date-calculator{margin:16px;padding:20px}.addition-inputs,.date-inputs,.mode-selector,.results-grid{grid-template-columns:1fr}.result-values{grid-template-columns:repeat(2,1fr)}.duration-grid{grid-template-columns:1fr}.action-buttons{align-items:center;flex-direction:column}.timeline{flex-direction:column;gap:12px}.timeline-bar{order:2;width:100%}.timeline-start{order:1}.timeline-end{order:3}.settings-grid{grid-template-columns:1fr}.calculation-options{flex-direction:column;gap:12px}.preset-buttons{justify-content:center}}@media (max-width:480px){.result-values{grid-template-columns:1fr}.header-section{flex-direction:column;gap:16px;text-align:center}.results-header{align-items:flex-start;flex-direction:column;gap:12px}.result-actions{justify-content:center;width:100%}}.date-calculator-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 20px;max-width:1000px;padding:40px}.dark-mode .date-calculator-article{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.dark-mode .article-header{border-bottom-color:var(--dark-border)}.dark-mode .article-header h1{color:var(--dark-text)}.article-subtitle{line-height:1.5}.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-section h2{line-height:1.3}.article-section h4{font-size:1.1rem;margin-top:24px}.dark-mode .article-section h4{color:var(--dark-text)}.article-section p:last-child{margin-bottom:0}.article-section ol,.article-section ul{padding-left:24px;text-align:left}.dark-mode .article-section li{color:var(--dark-text)}.article-section li::marker{color:var(--primary)}.article-section code{background-color:var(--bg-light);border:1px solid var(--border);border-radius:4px;color:var(--primary);font-family:Fira Code,Monaco,Consolas,monospace;font-size:.9rem;padding:2px 6px}.dark-mode .article-section code{background-color:var(--dark-bg-light);border-color:var(--dark-border)}.article-section blockquote{background-color:var(--bg-light);border-radius:0 8px 8px 0}.dark-mode .article-section blockquote{background-color:var(--dark-bg-light);color:var(--dark-text-secondary)}.article-section table{background-color:var(--white);border-collapse:collapse;border-radius:8px;box-shadow:0 2px 8px #0000000d;margin:24px 0;overflow:hidden;width:100%}.dark-mode .article-section table{background-color:var(--dark-bg-light)}.article-section td,.article-section th{border-bottom:1px solid var(--border);padding:12px 16px;text-align:left}.dark-mode .article-section td,.dark-mode .article-section th{border-bottom-color:var(--dark-border)}.article-section th{background-color:var(--bg-light);color:var(--text);font-weight:600}.dark-mode .article-section th{background-color:var(--dark-bg);color:var(--dark-text)}.article-section td{color:var(--text)}.dark-mode .article-section td{color:var(--dark-text)}.article-section em{color:var(--primary);font-style:italic}.article-section strong{color:var(--text)}.dark-mode .article-section strong{color:var(--dark-text)}.article-section a{border-bottom:1px solid #0000;text-decoration:none;transition:all .2s ease}.article-section a:hover{border-bottom-color:var(--primary)}.article-footer{margin-top:50px}.dark-mode .article-footer{border-top-color:var(--dark-border)}.article-footer h2{color:var(--primary);font-size:1.6rem;font-weight:600;line-height:1.3;margin-bottom:20px}.article-footer p{font-size:1rem;line-height:1.7;margin-bottom:16px}.dark-mode .article-footer p{color:var(--dark-text)}.article-footer p:last-child{color:var(--primary);font-weight:500;margin-bottom:0}.info-box{background-color:var(--bg-light);border:1px solid var(--border);border-left:4px solid var(--primary);margin:24px 0;padding:20px 24px}.dark-mode .info-box{background-color:var(--dark-bg-light);border-color:var(--dark-border)}.warning-box{background-color:#fff8e7;border:1px solid #f39c12;border-left:4px solid var(--warning);margin:24px 0;padding:20px 24px}.dark-mode .warning-box{background-color:#f39c121a;border-color:var(--warning)}.tip-box{background-color:#f0f9ff;border-left:1px solid var(--success);border:1px solid var(--success);border-left-width:4px;border-radius:8px;margin:24px 0;padding:20px 24px}.dark-mode .tip-box{background-color:#2ecc711a;border-color:var(--success)}@media (max-width:768px){.date-calculator-article{margin:20px 16px;padding:24px}.article-header h1{font-size:2rem}.article-subtitle{font-size:1.1rem}.article-section h2{font-size:1.5rem;margin-top:30px}.article-section h3{font-size:1.2rem;margin-top:24px}.article-section h4{font-size:1.05rem;margin-top:20px}.article-section ol,.article-section ul{padding-left:20px}.article-section td,.article-section th{font-size:.9rem;padding:8px 12px}}@media (max-width:480px){.date-calculator-article{margin:16px 12px;padding:20px}.article-header{margin-bottom:30px;padding-bottom:20px}.article-header h1{font-size:1.8rem;line-height:1.2}.article-subtitle{font-size:1rem}.article-section h2{font-size:1.4rem;margin-top:25px;padding-left:12px}.article-section h3{font-size:1.1rem;margin-top:20px}.article-section li,.article-section p{font-size:.95rem}.article-section blockquote,.info-box,.tip-box,.warning-box{margin:20px 0;padding:16px 20px}.article-footer{margin-top:40px;padding-top:24px}.article-footer h2{font-size:1.4rem}}@media print{.date-calculator-article{background:#fff!important;border:none;box-shadow:none;color:#000!important;margin:0;max-width:none;padding:20px}.article-header{border-bottom:2px solid #333}.article-section h2{border-left-color:#333}.article-section h2,.article-section h3,.article-section h4,.article-section li,.article-section p{color:#333!important}.article-footer{border-top:2px solid #333}.info-box,.tip-box,.warning-box{background:#f9f9f9!important;border:1px solid #333!important}}.time-duration-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.time-duration-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.time-duration-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-controls{align-items:center;display:flex;gap:12px}.tab-navigation{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.time-duration-calculator.dark-mode .tab-navigation{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tab-button{font-size:.9rem;text-align:center}.tab-button:not(.active){background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.tab-button:not(.active):hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.time-duration-calculator.dark-mode .tab-button:not(.active){background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.tab-content{margin-bottom:30px}.time-entries{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}.time-entry{grid-gap:16px;align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:16px;grid-template-columns:120px 1fr auto;padding:20px}.time-duration-calculator.dark-mode .time-entry{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.time-inputs{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}.time-input-group{display:flex;flex-direction:column;gap:6px}.time-input-group label{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:600}.time-duration-calculator.dark-mode .time-input-group label{color:#a0aec0;color:var(--dark-text-secondary)}.time-input-group input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-size:1rem;padding:10px 12px;transition:all .3s ease}.time-input-group input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.time-duration-calculator.dark-mode .time-input-group input{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.remove-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;justify-content:center;padding:10px;transition:all .3s ease}.input-group{margin-bottom:16px}.input-group label{color:#7f8c8d;color:var(--text-light)}.time-duration-calculator.dark-mode .input-group label{color:#a0aec0;color:var(--dark-text-secondary)}.time-duration-calculator.dark-mode .input-group input,.time-duration-calculator.dark-mode .input-group select{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.date-inputs{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:24px}.timezone-inputs{display:flex;flex-direction:column;gap:20px;margin-bottom:24px}.timezone-selectors{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr}.options{display:flex;flex-wrap:wrap;gap:24px;margin-bottom:24px}.checkbox-label{font-size:.95rem;gap:8px}.checkbox-label input[type=checkbox]{accent-color:#3498db;accent-color:var(--primary);height:18px;width:18px}.calculate-button{font-weight:600;margin-bottom:20px}.calculate-button:hover:not(:disabled){box-shadow:0 4px 12px #3498db4d}.start-button{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}.start-button:hover{background-color:#27ae60;transform:translateY(-1px)}.stop-button{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white)}.stop-button:hover{background-color:#c0392b;transform:translateY(-1px)}.result-display{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:24px;text-align:center}.time-duration-calculator.dark-mode .result-display{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.result-display h4{color:#7f8c8d;color:var(--text-light);font-size:1.1rem;margin:0 0 16px}.time-duration-calculator.dark-mode .result-display h4{color:#a0aec0;color:var(--dark-text-secondary)}.duration-result,.time-result{color:#3498db;color:var(--primary);font-family:Courier New,monospace;font-size:2rem;font-weight:700}.countdown-controls{display:flex;gap:16px;justify-content:center;margin-bottom:30px}.countdown-display{grid-gap:20px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:20px;grid-template-columns:repeat(4,1fr);margin-top:20px;padding:30px}.time-duration-calculator.dark-mode .countdown-display{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.countdown-unit{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column;gap:8px;padding:20px}.time-duration-calculator.dark-mode .countdown-unit{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.countdown-number{color:#3498db;color:var(--primary);font-family:Courier New,monospace;font-size:2.5rem;font-weight:700}.countdown-label{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.time-duration-calculator.dark-mode .countdown-label{color:#a0aec0;color:var(--dark-text-secondary)}.time-duration-calculator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-actions{display:flex;flex-wrap:wrap;gap:12px}.history-list{gap:16px}.history-item{grid-gap:16px;gap:16px;grid-template-columns:120px 1fr 140px}.time-duration-calculator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-type{background:#3498db1a;border-radius:6px;color:#3498db;color:var(--primary);font-size:.85rem;font-weight:600;padding:6px 12px;text-align:center}.history-calculation{font-size:.9rem;line-height:1.5}.history-calculation strong{color:#3498db;color:var(--primary)}.history-timestamp{text-align:right}.time-duration-calculator.dark-mode .history-timestamp{color:#a0aec0;color:var(--dark-text-secondary)}.no-history{color:#7f8c8d;color:var(--text-light);font-style:italic;padding:40px;text-align:center}.time-duration-calculator.dark-mode .no-history{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.time-duration-calculator{margin:16px;padding:20px}.tab-navigation{grid-template-columns:repeat(3,1fr)}.time-entry{gap:12px;grid-template-columns:1fr}.time-inputs{grid-template-columns:repeat(3,1fr)}.timezone-selectors{grid-template-columns:1fr}.countdown-display{grid-template-columns:repeat(2,1fr)}.history-item{gap:8px;grid-template-columns:1fr}.history-item,.history-timestamp{text-align:left}}@media (max-width:768px){.time-duration-calculator{margin:8px;padding:16px}.header-section{flex-direction:column;gap:16px;text-align:center}.tab-navigation{grid-template-columns:repeat(2,1fr)}.date-inputs,.time-inputs{grid-template-columns:1fr}.countdown-display{gap:12px;grid-template-columns:repeat(2,1fr);padding:20px}.countdown-unit{padding:16px}.countdown-number{font-size:2rem}.options{gap:12px}.history-actions,.options{flex-direction:column}}@media (max-width:480px){.countdown-display,.tab-navigation{grid-template-columns:1fr}.countdown-controls{flex-direction:column}}.tab-content{animation:fadeIn .3s ease-out}.unit-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.unit-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.unit-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.category-selector{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:16px;grid-template-columns:1fr 1fr 1fr;margin-bottom:30px;padding:8px}.unit-converter.dark-mode .category-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.category-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px;transition:all .3s ease}.category-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.category-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.category-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.unit-converter.dark-mode .category-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.unit-converter.dark-mode .presets-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.presets-section h3{align-items:center;display:flex;font-size:1.1rem;gap:8px}.presets-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.preset-button{align-items:center;background-color:#fff;background-color:var(--white);border-radius:8px;color:#2c3e50;color:var(--text);display:flex;font-size:.9rem;justify-content:center;padding:12px 16px}.preset-button:hover{background-color:#3498db;background-color:var(--primary)}.unit-converter.dark-mode .preset-button{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.conversion-container{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:25px}.unit-converter.dark-mode .conversion-container{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.conversion-row{grid-gap:20px;align-items:center;display:grid;gap:20px;grid-template-columns:1fr auto 1fr;margin-bottom:20px}.input-section,.output-section{background:#fff;background:var(--white);border-radius:10px;padding:16px}.unit-converter.dark-mode .input-section,.unit-converter.dark-mode .output-section{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.unit-input-group,.unit-output-group{align-items:center;display:flex;gap:12px}.value-input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);flex:1 1;font-family:Inter,sans-serif;font-size:1.1rem;outline:none;padding:14px 16px;transition:all .3s ease}.value-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.unit-converter.dark-mode .value-input{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.value-output{align-items:center;background:#fff;background:var(--white);border:2px solid #2ecc71;border:2px solid var(--success);border-radius:8px;color:#2ecc71;color:var(--success);display:flex;flex:1 1;font-family:Inter,sans-serif;font-size:1.1rem;font-weight:600;min-height:20px;padding:14px 16px}.unit-converter.dark-mode .value-output{background:#2d3748;background:var(--dark-bg-light);border-color:#2ecc71;border-color:var(--success)}.unit-selector{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-size:.95rem;min-width:180px;padding:14px 16px}.unit-selector:focus{outline:none}.unit-converter.dark-mode .unit-selector{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.swap-button,.swap-section{display:flex;justify-content:center}.swap-button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:50%;color:#fff;color:var(--white);cursor:pointer;font-size:1.2rem;height:48px;padding:12px;transition:all .3s ease;width:48px}.swap-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:rotate(180deg) scale(1.1)}.conversion-info{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;margin-top:16px;padding:16px;text-align:center}.unit-converter.dark-mode .conversion-info{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.conversion-formula{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:600}.secondary-actions{margin-bottom:30px}.unit-converter.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.unit-converter.dark-mode .setting-group label{color:#a0aec0;color:var(--dark-text-secondary)}.unit-converter.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.comparison-section{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.unit-converter.dark-mode .comparison-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.comparison-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-top:16px}.comparison-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px;text-align:center;transition:all .3s ease}.comparison-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.unit-converter.dark-mode .comparison-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.comparison-value{color:#3498db;color:var(--primary);font-size:1.2rem;font-weight:600;margin-bottom:8px}.comparison-unit{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.unit-converter.dark-mode .comparison-unit{color:#a0aec0;color:var(--dark-text-secondary)}.favorites-section{margin-bottom:30px}.favorites-list{display:flex;flex-direction:column;gap:12px;margin-top:16px}.favorite-item{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;justify-content:space-between;padding:16px;transition:all .3s ease}.favorite-item:hover{box-shadow:0 4px 12px #0000000d;transform:translateY(-2px)}.unit-converter.dark-mode .favorite-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.favorite-name{flex:1 1;font-weight:500}.unit-converter.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.unit-converter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.empty-state{padding:20px}.unit-converter.dark-mode .empty-state{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.unit-converter{margin:16px;padding:20px}.conversion-row{gap:16px;grid-template-columns:1fr}.swap-section{order:2}.output-section{order:3}.swap-button{transform:rotate(90deg)}.category-selector,.presets-grid{grid-template-columns:1fr}.primary-actions,.unit-input-group,.unit-output-group{flex-direction:column}.unit-selector{min-width:100%}.comparison-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.settings-grid{grid-template-columns:1fr}}@media (max-width:480px){.header-section{flex-direction:column;gap:16px;text-align:center}.history-item{align-items:stretch;flex-direction:column;gap:12px}.restore-button{align-self:flex-end;margin-left:0}.favorite-item{align-items:stretch;flex-direction:column;gap:12px}}.unit-converter-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px}.unit-converter.dark-mode .unit-converter-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 4px 20px var(--dark-shadow);color:var(--dark-text)}.article-container{text-align:left}.article-header{text-align:center}.unit-converter.dark-mode .article-header{border-bottom-color:var(--dark-border)}.unit-converter.dark-mode .article-header h1{color:var(--dark-text)}.article-subtitle{margin:0 auto;max-width:800px}.unit-converter.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-section h2{margin-top:0}.unit-converter.dark-mode .article-section h2{border-bottom-color:var(--dark-border);color:var(--primary)}.unit-converter.dark-mode .article-section h3{color:var(--dark-text)}.article-section h4{margin-bottom:12px;margin-top:20px}.unit-converter.dark-mode .article-section h4,.unit-converter.dark-mode .article-section p{color:var(--dark-text)}.units-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:25px 0}.unit-card{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;padding:25px;transition:all .3s ease}.unit-card:hover{box-shadow:0 4px 15px #0000001a;transform:translateY(-2px)}.unit-converter.dark-mode .unit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.unit-card h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:15px;margin-top:0}.unit-card ul{list-style:none;margin:0;padding:0}.unit-card li{border-bottom:1px solid var(--border);font-size:.95rem;padding:8px 0}.unit-card li:last-child{border-bottom:none}.unit-converter.dark-mode .unit-card li{border-bottom-color:var(--dark-border)}.unit-card strong{color:var(--primary);font-weight:600}.formula-box{border-left:4px solid var(--primary);border-radius:10px;padding:25px}.unit-converter.dark-mode .formula-box{background:var(--dark-bg-light);border-color:var(--dark-border);border-left-color:var(--primary)}.formula-box ul{list-style:none;margin:0;padding:0}.formula-box li{color:var(--text);font-size:1rem;font-weight:500;padding:8px 0 8px 20px;position:relative}.formula-box li:before{color:var(--primary);content:"=";font-weight:700;left:0;position:absolute}.unit-converter.dark-mode .formula-box li{color:var(--dark-text)}.tips-grid{margin:25px 0}.tip-card:hover{box-shadow:0 4px 15px #0000001a}.unit-converter.dark-mode .tip-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.tip-card h4{color:var(--primary);margin-bottom:12px;margin-top:0}.tip-card p{font-size:.95rem}.scenario-box{background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 2px 8px #0000000d;margin:20px 0;padding:25px}.unit-converter.dark-mode .scenario-box{background:var(--dark-bg);border-color:var(--dark-border)}.scenario-box h4{color:var(--primary);font-size:1.1rem;margin-bottom:12px;margin-top:0}.scenario-box p{font-size:.95rem;line-height:1.6;margin:0}.best-practices-list{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;margin:25px 0;padding:25px}.unit-converter.dark-mode .best-practices-list{background:var(--dark-bg-light);border-color:var(--dark-border)}.best-practices-list li{color:var(--text);font-size:.95rem;line-height:1.6;margin-bottom:12px}.unit-converter.dark-mode .best-practices-list li{color:var(--dark-text)}.best-practices-list strong{color:var(--primary);font-weight:600}.advantages-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:25px 0}.advantage-card{background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 2px 8px #0000000d;padding:25px;text-align:center;transition:all .3s ease}.advantage-card:hover{box-shadow:0 6px 20px #0000001a;transform:translateY(-3px)}.unit-converter.dark-mode .advantage-card{background:var(--dark-bg);border-color:var(--dark-border)}.advantage-card h4{color:var(--primary);font-size:1.1rem;margin-bottom:12px;margin-top:0}.advantage-card p{font-size:.95rem;line-height:1.5;margin:0}.skills-list{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;margin:25px 0;padding:25px}.unit-converter.dark-mode .skills-list{background:var(--dark-bg-light);border-color:var(--dark-border)}.skills-list li{color:var(--text);font-size:.95rem;line-height:1.6;margin-bottom:12px}.unit-converter.dark-mode .skills-list li{color:var(--dark-text)}.skills-list strong{color:var(--primary);font-weight:600}.conclusion{background:var(--bg-light);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:12px;padding:30px}.unit-converter.dark-mode .conclusion{background:var(--dark-bg-light);border-color:var(--dark-border);border-left-color:var(--primary)}.conclusion h2{border-bottom:none;color:var(--primary);margin-bottom:20px;margin-top:0;padding-bottom:0}.conclusion p:last-of-type{margin-bottom:0}.article-footer{border-top:2px solid var(--border);padding-top:30px}.unit-converter.dark-mode .article-footer{border-top-color:var(--dark-border)}.last-updated{color:var(--text-light);font-size:.9rem;font-style:italic;margin-bottom:20px}.unit-converter.dark-mode .last-updated{color:var(--dark-text-secondary)}.article-tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.tag{background:var(--primary);border-radius:20px;color:var(--white);font-size:.8rem;font-weight:500;padding:6px 14px;transition:all .3s ease}.tag:hover{background:var(--primary-hover);transform:translateY(-1px)}@media (max-width:768px){.unit-converter-article{margin:20px auto 0;padding:25px}.article-header h1{font-size:2rem}.article-subtitle{font-size:1.1rem}.article-section h2{font-size:1.5rem}.article-section h3{font-size:1.3rem}.advantages-grid,.tips-grid,.units-grid{grid-template-columns:1fr}.article-tags{justify-content:flex-start}}@media (max-width:480px){.unit-converter-article{margin:15px auto 0;padding:20px}.article-header{margin-bottom:30px;padding-bottom:20px}.article-header h1{font-size:1.8rem}.article-subtitle{font-size:1rem}.article-section{margin-bottom:30px}.article-section h2{font-size:1.4rem}.article-section h3{font-size:1.2rem}.advantage-card,.best-practices-list,.formula-box,.scenario-box,.skills-list,.tip-card,.unit-card{padding:20px}.conclusion{padding:25px}}@media print{.unit-converter-article{border:1px solid #ccc;box-shadow:none;margin:0;max-width:100%;padding:20px}.article-header{border-bottom:2px solid #333}.article-section h2{border-bottom:1px solid #333;color:#333}.tag{background:#333}.advantage-card,.best-practices-list,.conclusion,.formula-box,.scenario-box,.skills-list,.tip-card,.unit-card{background:#f9f9f9;border:1px solid #ddd}}.temperature-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.temperature-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.temperature-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.converter-main{margin-bottom:30px}.input-section{margin-bottom:24px}.temperature-converter.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-group{margin-bottom:20px}.input-group label{margin-bottom:8px}.temperature-converter.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-with-unit{align-items:stretch;display:flex;gap:12px}.input-with-unit input{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);flex:1 1;font-family:inherit;font-size:1.1rem;outline:none;padding:16px;transition:all .3s ease}.input-with-unit input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.input-with-unit input.error{border-color:#e74c3c;border-color:var(--danger)}.temperature-converter.dark-mode .input-with-unit input{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.unit-selector{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);cursor:pointer;font-family:inherit;font-size:1rem;min-width:140px;outline:none;padding:16px;transition:all .3s ease}.unit-selector:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.temperature-converter.dark-mode .unit-selector{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.error-message{margin-top:12px}.settings-row{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between}.precision-control{align-items:center;display:flex;gap:12px}.precision-control label{color:#7f8c8d;color:var(--text-light);font-size:.9rem;margin:0}.precision-control select{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-size:.9rem;padding:8px 12px}.temperature-converter.dark-mode .precision-control select{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.toggle-buttons{gap:12px}.toggle-btn{font-size:.9rem;gap:6px;padding:10px 16px}.toggle-btn:hover{transform:translateY(-1px)}.toggle-btn.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;color:var(--white)}.temperature-converter.dark-mode .toggle-btn{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.results-section{animation:fadeIn .3s ease-out}.temperature-converter.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.results-section h3{color:#2c3e50;color:var(--text);font-size:1.3rem;font-weight:600}.temperature-converter.dark-mode .results-section h3{color:#f7fafc;color:var(--dark-text)}.results-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:24px}.result-card{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);padding:20px;position:relative;text-align:center;transition:all .3s ease}.result-card:hover{box-shadow:0 8px 25px #0000001a;transform:translateY(-4px)}.temperature-converter.dark-mode .result-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.result-card.celsius{border-color:#3498db}.result-card.fahrenheit{border-color:#e74c3c}.result-card.kelvin{border-color:#9b59b6}.result-header{gap:8px;justify-content:center}.unit-symbol{font-size:1.2rem;font-weight:700}.unit-name{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.temperature-converter.dark-mode .unit-name{color:#a0aec0;color:var(--dark-text-secondary)}.result-value{color:#2c3e50;color:var(--text);font-family:Courier New,monospace;margin-bottom:12px}.temperature-converter.dark-mode .result-value{color:#f7fafc;color:var(--dark-text)}.copy-btn{align-items:center;background:#3498db1a;border-radius:6px;display:flex;font-size:.8rem;height:32px;justify-content:center;position:absolute;right:12px;top:12px;transition:all .3s ease;width:32px}.copy-btn:hover{background:#3498db33;transform:scale(1.1)}.result-actions{gap:16px;justify-content:center}.clear-btn,.export-btn{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.clear-btn{background:#e74c3c;background:var(--danger);color:#fff;color:var(--white)}.clear-btn:hover{background:#c0392b;transform:translateY(-2px)}.export-btn{background:#2ecc71;background:var(--success);color:#fff;color:var(--white)}.export-btn:hover{background:#27ae60;transform:translateY(-2px)}.calculating-indicator{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;color:#7f8c8d;color:var(--text-light);display:flex;font-size:1rem;gap:12px;justify-content:center;padding:20px}.temperature-converter.dark-mode .calculating-indicator{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#a0aec0;color:var(--dark-text-secondary)}.spinner{border:2px solid #e1e8ed;border-top:2px solid #3498db;border:2px solid var(--border)}.formulas-section{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.temperature-converter.dark-mode .formulas-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.formulas-section h3{color:#2c3e50;color:var(--text);font-size:1.3rem;font-weight:600;margin:0 0 20px}.temperature-converter.dark-mode .formulas-section h3{color:#f7fafc;color:var(--dark-text)}.formulas-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.formula-card{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;padding:20px;transition:all .3s ease}.formula-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.temperature-converter.dark-mode .formula-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.formula-card h4{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 12px}.formula{background:#3498db1a;border-left:3px solid #3498db;border-left:3px solid var(--primary);border-radius:6px;color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.9rem;margin-bottom:8px;padding:10px 14px}.temperature-converter.dark-mode .formula{background:#3498db33;color:#f7fafc;color:var(--dark-text)}.references-section{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.temperature-converter.dark-mode .references-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.references-section h3{color:#2c3e50;color:var(--text);font-size:1.3rem;font-weight:600;margin:0 0 20px}.temperature-converter.dark-mode .references-section h3{color:#f7fafc;color:var(--dark-text)}.references-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.reference-card{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;cursor:pointer;padding:16px;transition:all .3s ease}.reference-card:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.temperature-converter.dark-mode .reference-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.ref-name{color:#2c3e50;color:var(--text);font-size:1rem;font-weight:600;margin-bottom:4px}.temperature-converter.dark-mode .ref-name{color:#f7fafc;color:var(--dark-text)}.ref-temp{color:#3498db;color:var(--primary);font-family:Courier New,monospace;font-size:1.2rem;font-weight:700;margin-bottom:6px}.ref-description{color:#7f8c8d;color:var(--text-light);font-size:.85rem;line-height:1.4}.temperature-converter.dark-mode .ref-description{color:#a0aec0;color:var(--dark-text-secondary)}.temperature-converter.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.temperature-converter.dark-mode .history-header h3{color:#f7fafc;color:var(--dark-text)}.clear-history-btn{background:#e74c3c;background:var(--danger)}.clear-history-btn:hover{background:#c0392b}.history-item{cursor:pointer}.history-item:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #0000001a}.temperature-converter.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-input{color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:4px}.history-results{color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.9rem;margin-bottom:4px}.temperature-converter.dark-mode .history-results{color:#f7fafc;color:var(--dark-text)}.temperature-converter.dark-mode .history-time{color:#a0aec0;color:var(--dark-text-secondary)}.related-tools-section h3{color:#2c3e50;color:var(--text);font-weight:600}.temperature-converter.dark-mode .related-tools-section h3{color:#f7fafc;color:var(--dark-text)}.temperature-converter.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tool-icon{font-size:2.5rem;margin-bottom:12px}.tool-name{font-size:1.1rem;margin-bottom:8px}.temperature-converter.dark-mode .tool-name{color:#f7fafc;color:var(--dark-text)}.tool-description{font-size:.9rem;line-height:1.4}.temperature-converter.dark-mode .tool-description{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.temperature-converter{margin:16px;padding:20px}.header-section{gap:16px;text-align:center}.header-section,.input-with-unit,.settings-row{flex-direction:column}.settings-row{align-items:stretch;gap:16px}.formulas-grid,.references-grid,.results-grid,.tools-grid{grid-template-columns:1fr}.result-actions{flex-direction:column}.toggle-buttons{justify-content:center}}@media (max-width:480px){.temperature-converter{margin:8px;padding:16px}.header-section h2{font-size:1.6rem}.input-with-unit input,.unit-selector{font-size:1rem;padding:12px}.result-value{font-size:1.6rem}}.temperature-converter-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:800px;padding:40px}.temperature-converter.dark-mode .temperature-converter-article{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.article-content{text-align:left}.temperature-converter-article h2{border-bottom:3px solid var(--primary);color:var(--text);font-size:2.2rem;font-weight:700;margin:0 0 30px;padding-bottom:20px;position:relative;text-align:center}.temperature-converter.dark-mode .temperature-converter-article h2{color:var(--dark-text)}.temperature-converter-article h2:after{background:linear-gradient(90deg,var(--primary),var(--primary-hover));border-radius:2px;bottom:-3px;content:"";height:3px;left:50%;position:absolute;transform:translateX(-50%);width:60px}.temperature-converter-article h3{border-left:4px solid var(--primary);color:var(--primary);font-size:1.6rem;font-weight:600;margin:35px 0 20px;padding-left:15px;position:relative}.temperature-converter-article h4{color:var(--text);font-size:1.3rem;font-weight:600;margin:28px 0 16px;padding-left:20px;position:relative}.number-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.number-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.number-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.quick-settings{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px;padding:20px}.number-converter.dark-mode .quick-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.number-converter.dark-mode .setting-group label{color:#a0aec0;color:var(--dark-text-secondary)}.setting-group select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:.9rem;padding:10px 12px;transition:all .3s ease}.setting-group select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.number-converter.dark-mode .setting-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.feature-toggle{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:8px;padding:10px 16px;transition:all .3s ease}.feature-toggle:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.conversion-grid{grid-gap:var(--gap);display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:30px}.input-section{transition:all .3s ease}.number-converter.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.section-header{margin-bottom:15px}.input-actions{gap:8px}.copy-button{font-size:.8rem;padding:8px 10px}.copy-button:hover:not(:disabled){background-color:#7f8c8d;transform:translateY(-1px)}.copy-button:disabled{cursor:not-allowed;opacity:.5}.number-input{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);font-family:Fira Code,monospace,sans-serif;font-size:1rem;margin-bottom:10px;padding:15px;transition:all .3s ease;width:100%}.number-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.number-input.active{border-color:#2ecc71;border-color:var(--success);box-shadow:0 0 0 3px #2ecc711a}.number-input.error{border-color:#e74c3c;border-color:var(--danger);box-shadow:0 0 0 3px #e74c3c1a}.number-converter.dark-mode .number-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-info{color:var(--text-light);font-style:italic}.number-converter.dark-mode .input-info{color:#a0aec0;color:var(--dark-text-secondary)}.error-message{font-size:.8rem;margin-top:5px}.number-properties{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.number-converter.dark-mode .number-properties{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.number-properties h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.properties-grid{grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.property-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-size:.9rem;padding:12px}.number-converter.dark-mode .property-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.property-item strong{color:#3498db;color:var(--primary)}.bit-manipulation-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.number-converter.dark-mode .bit-manipulation-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.bit-manipulation-section h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.bit-display{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin-bottom:10px}.bit-button{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);cursor:pointer;font-family:Fira Code,monospace;font-size:.9rem;font-weight:700;height:32px;transition:all .2s ease;width:32px}.bit-button.bit-on{background:#2ecc71;background:var(--success);border-color:#2ecc71;border-color:var(--success);color:#fff;color:var(--white)}.bit-button.bit-off{background:#fff;background:var(--white);border-color:#e1e8ed;border-color:var(--border);color:#7f8c8d;color:var(--text-light)}.bit-button:hover{box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.number-converter.dark-mode .bit-button.bit-off{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#a0aec0;color:var(--dark-text-secondary)}.bit-positions{display:flex;gap:4px;justify-content:center}.bit-position{color:#7f8c8d;color:var(--text-light);font-size:.7rem;text-align:center;width:32px}.number-converter.dark-mode .bit-position{color:#a0aec0;color:var(--dark-text-secondary)}.conversion-steps{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.number-converter.dark-mode .conversion-steps{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.conversion-steps h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.steps-display{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:Fira Code,monospace;font-size:.9rem;line-height:1.6;overflow-x:auto;padding:16px;white-space:pre-wrap}.number-converter.dark-mode .steps-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.primary-button,.secondary-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.primary-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.primary-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.secondary-button{background-color:#95a5a6;background-color:var(--secondary);color:var(--white)}.secondary-button:hover{background-color:#7f8c8d;transform:translateY(-2px)}.primary-button:disabled,.secondary-button:disabled{cursor:not-allowed;opacity:.6;transform:none!important}.clear-history-button{background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;padding:8px 16px;transition:all .3s ease}.clear-history-button:hover{background-color:#c0392b;transform:translateY(-1px)}.number-converter.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.number-converter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-values{grid-gap:8px;display:grid;font-family:Fira Code,monospace;font-size:.9rem;gap:8px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.history-values strong{color:#3498db;color:var(--primary);margin-right:6px}.restore-button{border-radius:8px}.related-tools-section h3{font-size:1.1rem;justify-content:center}.tools-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.tool-card{font-size:.9rem;gap:10px}.number-converter.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tool-icon{font-size:1.2rem}@media (max-width:768px){.number-converter{margin:16px;padding:20px}.conversion-grid,.quick-settings{grid-template-columns:1fr}.action-buttons{flex-direction:column}.properties-grid{grid-template-columns:1fr}.bit-display{gap:2px}.bit-button{font-size:.8rem;height:24px;width:24px}.bit-position{font-size:.6rem;width:24px}.history-values{gap:4px}.history-values,.tools-grid{grid-template-columns:1fr}}.prime-checker{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.prime-checker.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.prime-checker.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-icon{color:#3498db;color:var(--primary)}.tab-navigation{grid-gap:8px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:8px;grid-template-columns:repeat(4,1fr);margin-bottom:30px;padding:8px}.prime-checker.dark-mode .tab-navigation{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tab-button{align-items:center;background:#fff;background:var(--white);border:2px solid #0000;border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 20px;transition:all .3s ease}.tab-button.active{box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}.tab-button.active,.tab-button:hover:not(.active){background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.tab-button:hover:not(.active){transform:translateY(-1px)}.prime-checker.dark-mode .tab-button{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.main-content{margin-bottom:30px}.tab-content{min-height:400px}.input-section{margin-bottom:20px}.prime-checker.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin-bottom:20px;margin-top:0}.input-group{align-items:center;gap:12px}.number-input,.range-input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);flex:1 1;font-family:Inter,sans-serif;font-size:1rem;outline:none;padding:14px 16px;transition:all .3s ease}.number-input:focus,.range-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.prime-checker.dark-mode .number-input,.prime-checker.dark-mode .range-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.range-separator{color:#7f8c8d;color:var(--text-light);font-size:1.1rem;font-weight:600}.batch-textarea{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:Inter,sans-serif;font-size:1rem;line-height:1.6;margin-bottom:16px;min-height:150px;outline:none;padding:16px;resize:vertical;transition:all .3s ease;width:100%}.batch-textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.prime-checker.dark-mode .batch-textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.check-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white);font-size:1rem;font-weight:600;padding:14px 24px}.check-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.progress-section{background:#fff;background:var(--white);border-radius:8px;padding:16px}.prime-checker.dark-mode .progress-section{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.prime-checker.dark-mode .progress-bar{background:#4a5568;background:var(--dark-border)}.result-section{background:#fff;background:var(--white);margin-top:20px}.prime-checker.dark-mode .result-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.result-card{border:2px solid;border-radius:12px;margin-bottom:16px;padding:24px}.result-card.prime{background:#2ecc710d;border-color:#2ecc71;border-color:var(--success)}.result-card.composite{background:#f39c120d;border-color:#f39c12;border-color:var(--warning)}.result-header h3{font-size:1.8rem;font-weight:700}.result-badge{border-radius:20px;font-size:.9rem;font-weight:700;letter-spacing:.5px;padding:8px 16px}.result-card.prime .result-badge{background:#2ecc71;background:var(--success);color:#fff}.result-card.composite .result-badge{background:#f39c12;background:var(--warning);color:#fff}.explanation{background:#f8fafc;background:var(--bg-light);border-left:4px solid #3498db;border-left:4px solid var(--primary);border-radius:8px;margin-bottom:12px;padding:16px}.prime-checker.dark-mode .explanation{background:#1a202c;background:var(--dark-bg)}.explanation p{line-height:1.6;margin:8px 0}.performance{font-size:.9rem;opacity:.8;text-align:right}.batch-summary,.range-summary{margin-bottom:24px}.summary-stats{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:20px}.stat{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px;text-align:center}.prime-checker.dark-mode .stat{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.stat-value{display:block}.prime-checker.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.prime-grid{grid-gap:8px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(60px,1fr));max-height:400px;overflow-y:auto;padding:16px}.prime-checker.dark-mode .prime-grid{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.prime-item{background:#3498db;background:var(--primary);border-radius:6px;color:#fff;font-size:.9rem;font-weight:600;padding:8px;text-align:center;transition:all .2s ease}.prime-item:hover{box-shadow:0 2px 8px #3498db4d;transform:scale(1.05)}.batch-results{max-height:400px;overflow-y:auto}.batch-item{align-items:center;border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;justify-content:space-between;margin-bottom:8px;padding:12px 16px;transition:all .2s ease}.batch-item:hover{box-shadow:0 2px 8px #0000000d;transform:translateY(-1px)}.batch-item.prime{background:#2ecc710d;border-color:#2ecc71;border-color:var(--success)}.batch-item.composite{background:#f39c120d;border-color:#f39c12;border-color:var(--warning)}.prime-checker.dark-mode .batch-item{border-color:#4a5568;border-color:var(--dark-border)}.batch-item .number{font-size:1.1rem;font-weight:700}.batch-item .status{font-size:.9rem;font-weight:600}.batch-item.prime .status{color:#2ecc71;color:var(--success)}.batch-item.composite .status{color:#f39c12;color:var(--warning)}.batch-item .factors{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-style:italic}.list-summary{margin-bottom:20px;text-align:center}.list-summary h4{color:#3498db;color:var(--primary);font-size:1.3rem;margin:0 0 8px}.prime-list{grid-gap:8px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));max-height:400px;overflow-y:auto;padding:20px}.prime-checker.dark-mode .prime-list{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.prime-number{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;font-weight:600;padding:10px;text-align:center;transition:all .2s ease}.prime-number:hover{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:scale(1.05)}.prime-checker.dark-mode .prime-number{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.action-buttons{gap:12px}.action-btn{font-weight:600;padding:12px 18px}.action-btn.secondary{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white)}.action-btn.secondary:hover{background-color:#7f8c8d;transform:translateY(-1px)}.action-btn.danger{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white)}.action-btn.danger:hover{background-color:#c0392b;transform:translateY(-1px)}.settings-panel{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.prime-checker.dark-mode .settings-panel{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-panel h3{align-items:center;display:flex;font-size:1.2rem;gap:8px;margin-bottom:20px;margin-top:0}.setting-group{margin-bottom:20px}.setting-select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.setting-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.prime-checker.dark-mode .setting-select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group small{font-size:.85rem}.prime-checker.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.history-panel{animation:fadeIn .3s ease-out;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.prime-checker.dark-mode .history-panel{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.clear-history-btn:hover{transform:translateY(-1px)}.stats-overview{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin-bottom:24px}.history-list{max-height:300px;overflow-y:auto}.history-item{margin-bottom:12px}.prime-checker.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.operation-type{background:#3498db;background:var(--primary)}.prime-checker.dark-mode .timestamp{color:#a0aec0;color:var(--dark-text-secondary)}.history-content{font-size:.95rem;line-height:1.5}.prime-checker.dark-mode .related-tools{border-top-color:#4a5568;border-top-color:var(--dark-border)}.tool-card:hover{box-shadow:0 4px 12px #3498db4d}.prime-checker.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}@media (max-width:768px){.prime-checker{margin:16px;padding:20px}.tab-navigation{grid-template-columns:repeat(2,1fr)}.tab-button{font-size:.9rem;padding:12px 16px}.input-group,.range-inputs{flex-direction:column}.range-inputs{align-items:stretch}.range-separator{padding:8px 0;text-align:center}.action-buttons{flex-direction:column}.summary-stats{grid-template-columns:repeat(2,1fr)}.prime-grid{grid-template-columns:repeat(auto-fill,minmax(50px,1fr))}.prime-list{grid-template-columns:repeat(auto-fill,minmax(60px,1fr))}.tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.prime-checker{margin:12px;padding:16px}.header-section{flex-direction:column;gap:16px;text-align:center}.summary-stats,.tab-navigation{grid-template-columns:1fr}.batch-item{align-items:flex-start;flex-direction:column;gap:8px}}.prime-checker-article{color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:0 20px}.prime-checker.dark-mode .article-container{background:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text)}.prime-checker.dark-mode .article-header{border-bottom-color:var(--dark-border)}.article-header h1{color:var(--primary)}.article-subtitle{font-size:1.2rem}.prime-checker.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-section{margin-bottom:40px}.article-section h2{border-left:4px solid var(--primary);padding-left:16px}.prime-checker.dark-mode .article-section h2{color:var(--dark-text)}.article-section h3{margin:24px 0 12px}.prime-checker.dark-mode .article-section h3{color:var(--dark-text)}.example-box{background:var(--bg-light);border-left:4px solid var(--success);border-radius:8px;margin:24px 0;padding:24px}.prime-checker.dark-mode .example-box{background:var(--dark-bg);border-left-color:var(--success)}.example-box h3{color:var(--success);margin-top:0}.example-box ul{margin:16px 0;padding-left:24px}.example-box li{margin:8px 0}.properties-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.property-card{background:var(--bg-light);transition:all .3s ease}.property-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.prime-checker.dark-mode .property-card{background:var(--dark-bg);border-color:var(--dark-border)}.property-card h3{color:var(--primary);font-size:1.1rem;margin-top:0}.property-card p{font-size:.95rem;margin:12px 0 0}.algorithm-comparison{display:flex;flex-direction:column;gap:24px;margin:24px 0}.algorithm-card{background:var(--white);border:1px solid var(--border);box-shadow:0 2px 8px #0000000d;padding:24px}.prime-checker.dark-mode .algorithm-card{background:var(--dark-bg);border-color:var(--dark-border)}.algorithm-card h3{color:var(--primary);margin-top:0}.code-example{background:#1e1e1e;border-radius:6px;margin:16px 0;overflow-x:auto;padding:16px}.code-example pre{color:#f8f8f2;font-family:Fira Code,Courier New,monospace;font-size:.9rem;line-height:1.4;margin:0}.optimization-note{background:#3498db1a;border-left:3px solid var(--primary);border-radius:4px;font-size:.95rem;margin:16px 0;padding:12px 16px}.sieve-steps{margin:16px 0}.sieve-steps ol{padding-left:20px}.sieve-steps li{font-size:.95rem;margin:8px 0}.application-card{border-radius:8px;padding:20px;text-align:left}.application-card:hover{box-shadow:0 4px 12px #0000001a}.prime-checker.dark-mode .application-card{background:var(--dark-bg);border-color:var(--dark-border)}.application-card h3{margin-bottom:12px}.application-card p{font-size:.95rem;margin:0}.fact-item,.facts-list{margin:24px 0}.fact-item{align-items:flex-start;background:var(--bg-light);border:1px solid var(--border);border-radius:8px;display:flex;gap:20px;padding:20px}.prime-checker.dark-mode .fact-item{background:var(--dark-bg);border-color:var(--dark-border)}.fact-number{align-items:center;background:var(--primary);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:1.1rem;font-weight:700;height:40px;justify-content:center;width:40px}.fact-content h3{color:var(--text);font-size:1.1rem;margin:0 0 8px}.prime-checker.dark-mode .fact-content h3{color:var(--dark-text)}.fact-content p{font-size:.95rem;line-height:1.6;margin:0}.strategy-tips{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.tip-card{border-radius:8px;box-shadow:0 2px 8px #0000000d;padding:20px}.prime-checker.dark-mode .tip-card{background:var(--dark-bg);border-color:var(--dark-border)}.tip-card h3{color:var(--primary);font-size:1.1rem;margin-top:0}.tip-card ul{margin:12px 0;padding-left:20px}.tip-card li{font-size:.95rem;line-height:1.5;margin:8px 0}.misconception-list{margin:24px 0}.misconception-item{background:#e74c3c0d;border-left:4px solid var(--danger);border-radius:8px;margin:20px 0;padding:20px}.misconception-item h3{color:var(--danger);font-size:1.1rem;margin-top:0}.misconception-item p{font-size:.95rem;line-height:1.6;margin:12px 0 0}.article-footer{padding:30px}.prime-checker.dark-mode .article-footer{background:var(--dark-bg);border-color:var(--dark-border)}.footer-content h3{color:var(--primary);font-size:1.4rem;margin-top:0}.footer-content p{margin:16px 0}.related-topics{margin-top:24px}.related-topics h4{color:var(--text);font-size:1.1rem;margin:0 0 12px}.prime-checker.dark-mode .related-topics h4{color:var(--dark-text)}.topic-tags{display:flex;flex-wrap:wrap;gap:8px}.topic-tag{background:var(--primary);border-radius:16px;color:#fff;font-size:.85rem;font-weight:500;padding:6px 12px;transition:all .2s ease}.topic-tag:hover{background:var(--primary-hover);transform:translateY(-1px)}@media (max-width:768px){.article-container{padding:24px}.article-header h1{font-size:2rem}.article-subtitle{font-size:1.1rem}.applications-grid,.properties-grid,.strategy-tips{grid-template-columns:1fr}.fact-item{flex-direction:column;text-align:center}.fact-number{align-self:center}}@media (max-width:480px){.prime-checker-article{padding:0 16px}.article-container{padding:20px}.article-header h1{font-size:1.8rem}.article-section h2{font-size:1.5rem}.topic-tags{justify-content:center}}.fibonacci-generator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.fibonacci-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.fibonacci-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.mode-selector{margin-bottom:30px}.mode-buttons{grid-gap:12px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:12px;grid-template-columns:repeat(4,1fr);padding:8px}.fibonacci-generator.dark-mode .mode-buttons{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.mode-buttons button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px;transition:all .3s ease}.mode-buttons button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.mode-buttons button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.mode-buttons button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.fibonacci-generator.dark-mode .mode-buttons button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.fibonacci-generator.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:20px}.fibonacci-generator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-group input,.input-group select{font-size:1rem;padding:12px 16px}.input-group input:focus,.input-group select:focus{outline:none}.fibonacci-generator.dark-mode .input-group input,.fibonacci-generator.dark-mode .input-group select{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.fibonacci-generator.dark-mode .input-group small{color:#a0aec0;color:var(--dark-text-secondary)}.custom-start-section{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px}.fibonacci-generator.dark-mode .custom-start-section{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.fibonacci-generator.dark-mode .checkbox-group label{color:#f7fafc;color:var(--dark-text)}.action-buttons{flex-wrap:wrap;gap:16px}.generate-button{padding:14px 28px}.settings-toggle,.stats-toggle{background-color:initial;border:2px solid #3498db;border:2px solid var(--primary);color:#3498db;color:var(--primary)}.settings-toggle:hover,.stats-toggle:hover{background-color:#3498db1a;transform:translateY(-1px)}.fibonacci-generator.dark-mode .settings-toggle,.fibonacci-generator.dark-mode .stats-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.fibonacci-generator.dark-mode .advanced-settings,.fibonacci-generator.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.results-header{gap:16px}.result-actions button{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white);font-size:.9rem;padding:8px 16px}.result-actions button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.sequence-display{margin-bottom:24px}.list-view{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px}.fibonacci-generator.dark-mode .list-view{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.sequence-list{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:400px;overflow-y:auto}.sequence-item{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;display:flex;justify-content:space-between;padding:8px 12px}.fibonacci-generator.dark-mode .sequence-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.sequence-item .index{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:600}.fibonacci-generator.dark-mode .sequence-item .index{color:#a0aec0;color:var(--dark-text-secondary)}.sequence-item .value{color:#3498db;color:var(--primary);font-family:Courier New,monospace;font-weight:700}.grid-view{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));max-height:400px;overflow-y:auto}.grid-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:12px;text-align:center;transition:all .2s ease}.grid-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.fibonacci-generator.dark-mode .grid-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.grid-index{color:#7f8c8d;color:var(--text-light);font-size:.75rem;margin-bottom:4px}.fibonacci-generator.dark-mode .grid-index{color:#a0aec0;color:var(--dark-text-secondary)}.grid-value{color:#3498db;color:var(--primary);font-family:Courier New,monospace;font-size:.9rem;font-weight:700;word-break:break-all}.visual-view{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:20px}.fibonacci-generator.dark-mode .visual-view{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.visual-pattern{align-items:flex-end;display:flex;gap:2px;height:200px;justify-content:center;margin-bottom:16px}.visual-bar{border-radius:2px 2px 0 0;cursor:pointer;flex:1 1;max-width:40px;min-height:2px;transition:all .3s ease}.visual-bar:hover{opacity:.8;transform:scaleY(1.05)}.visual-note{color:#7f8c8d;color:var(--text-light);font-size:.9rem;margin:0;text-align:center}.fibonacci-generator.dark-mode .visual-note{color:#a0aec0;color:var(--dark-text-secondary)}.properties-section{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-bottom:24px}.property-card{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:20px}.fibonacci-generator.dark-mode .property-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.property-card h4{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:16px;margin-top:0}.property-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr}.property-item{align-items:center;display:flex;justify-content:space-between;padding:8px 0}.property-label{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.fibonacci-generator.dark-mode .property-label{color:#a0aec0;color:var(--dark-text-secondary)}.property-value{color:#3498db;color:var(--primary);font-family:Courier New,monospace;font-weight:700}.special-numbers{gap:12px}.special-group,.special-numbers{display:flex;flex-direction:column}.special-group{gap:4px}.special-label{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:600}.fibonacci-generator.dark-mode .special-label{color:#a0aec0;color:var(--dark-text-secondary)}.special-values{color:#3498db;color:var(--primary);font-family:Courier New,monospace;font-size:.85rem;word-break:break-word}.statistics-section{border-radius:8px;margin-top:20px}.fibonacci-generator.dark-mode .statistics-section{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.statistics-section h4{align-items:center;display:flex;gap:8px}.stat-item{gap:4px;padding:12px}.fibonacci-generator.dark-mode .stat-item{background:#2d3748;background:var(--dark-bg-light)}.fibonacci-generator.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.stat-value{font-family:Courier New,monospace;font-size:1.1rem}.fibonacci-generator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.fibonacci-generator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-info{flex:1 1}.history-mode{color:#3498db;color:var(--primary);font-weight:600}.history-timestamp{color:#7f8c8d;color:var(--text-light);font-size:.8rem}.fibonacci-generator.dark-mode .history-timestamp{color:#a0aec0;color:var(--dark-text-secondary)}.history-details{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.85rem;gap:16px}.fibonacci-generator.dark-mode .history-details{color:#a0aec0;color:var(--dark-text-secondary)}.fibonacci-generator.dark-mode .related-tools{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tool-card:hover{box-shadow:0 8px 24px #0000001a}.fibonacci-generator.dark-mode .tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.tool-name{color:#2c3e50;color:var(--text);margin-bottom:4px}.fibonacci-generator.dark-mode .tool-name{color:#f7fafc;color:var(--dark-text)}.tool-description{color:#7f8c8d;color:var(--text-light);font-size:.85rem}.fibonacci-generator.dark-mode .tool-description{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.fibonacci-generator{margin:16px;padding:20px}.mode-buttons{grid-template-columns:1fr 1fr}.input-grid{grid-template-columns:1fr}.action-buttons,.results-header{flex-direction:column}.results-header{align-items:stretch}.result-actions{justify-content:center}.properties-section,.property-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}.sequence-list,.tools-grid{grid-template-columns:1fr}.grid-view{grid-template-columns:repeat(4,1fr)}}@media (max-width:480px){.fibonacci-generator{margin:8px;padding:16px}.mode-buttons{grid-template-columns:1fr}.header-section{flex-direction:column;gap:16px;text-align:center}.stats-grid{grid-template-columns:1fr}.grid-view{grid-template-columns:repeat(3,1fr)}.history-item{align-items:stretch;flex-direction:column;gap:12px}.restore-button{margin-left:0}}.fibonacci-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto;max-width:900px;padding:0 20px}.fibonacci-article.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.article-container{padding:40px}.article-header{padding-bottom:30px}.fibonacci-article.dark-mode .article-header{border-bottom-color:var(--dark-border)}.article-header h1{margin-bottom:20px}.fibonacci-article.dark-mode .article-header h1{color:var(--dark-text)}.article-intro{color:var(--text-light)}.fibonacci-article.dark-mode .article-intro{color:var(--dark-text-secondary)}.article-section{text-align:left}.article-section h2{margin-top:40px;padding-bottom:10px}.fibonacci-article.dark-mode .article-section h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.article-section h3{font-size:1.4rem;margin-bottom:15px;margin-top:30px}.fibonacci-article.dark-mode .article-section h3,.fibonacci-article.dark-mode .article-section p{color:var(--dark-text)}.article-section ul{list-style:none;margin:20px 0;padding-left:0}.article-section li{padding-left:25px;text-align:left}.fibonacci-article.dark-mode .article-section li{color:var(--dark-text)}.article-section li:before{color:var(--primary);content:"•";font-size:1.2rem;left:0;position:absolute;top:0}.article-section li strong{color:var(--primary);font-weight:600}.formula-box{background:var(--bg-light);margin:25px 0;padding:20px}.fibonacci-article.dark-mode .formula-box{background:var(--dark-bg-light);border-color:var(--dark-border)}.formula-box p{color:var(--text);font-size:1.1rem;margin:8px 0}.fibonacci-article.dark-mode .formula-box p{color:var(--dark-text)}.formula-box strong{color:var(--primary);font-weight:700}.code-block{color:var(--text);font-family:Courier New,monospace;font-size:.9rem;margin:20px 0;padding:20px}.fibonacci-article.dark-mode .code-block{background:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text)}.highlight-box{background:linear-gradient(135deg,#3498db1a,#2ecc711a);border-left:4px solid var(--primary);border-radius:8px;margin:25px 0;padding:20px}.fibonacci-article.dark-mode .highlight-box{background:linear-gradient(135deg,#3498db33,#2ecc7133)}.highlight-box p{color:var(--text);margin:0}.fibonacci-article.dark-mode .highlight-box p{color:var(--dark-text)}.data-table{border:1px solid var(--border);border-collapse:collapse;border-radius:8px;font-size:.95rem;margin:25px 0;overflow:hidden;width:100%}.fibonacci-article.dark-mode .data-table{border-color:var(--dark-border)}.data-table td,.data-table th{border-bottom:1px solid var(--border);padding:12px 15px;text-align:left}.fibonacci-article.dark-mode .data-table td,.fibonacci-article.dark-mode .data-table th{border-bottom-color:var(--dark-border)}.data-table th{background:var(--bg-light);color:var(--text);font-weight:600}.fibonacci-article.dark-mode .data-table th{background:var(--dark-bg-light);color:var(--dark-text)}.data-table td{color:var(--text)}.fibonacci-article.dark-mode .data-table td{color:var(--dark-text)}.data-table tr:last-child td{border-bottom:none}.article-footer{border:1px solid var(--border);border-radius:8px;margin-top:40px;padding:25px;text-align:center}.fibonacci-article.dark-mode .article-footer{background:var(--dark-bg-light);border-color:var(--dark-border)}.article-footer p{color:var(--text);font-size:1.1rem;margin:0}.fibonacci-article.dark-mode .article-footer p{color:var(--dark-text)}.article-footer strong{color:var(--primary)}.image-container{margin:30px 0;text-align:center}.image-container img{border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 12px #0000001a;height:auto;max-width:100%}.fibonacci-article.dark-mode .image-container img{border-color:var(--dark-border)}.image-caption{color:var(--text-light);font-size:.9rem;font-style:italic;margin-top:10px}.fibonacci-article.dark-mode .image-caption{color:var(--dark-text-secondary)}.quote-block{background:var(--bg-light);border-left:4px solid var(--primary);border-radius:0 8px 8px 0;font-style:italic;margin:25px 0;padding:20px 30px}.fibonacci-article.dark-mode .quote-block{background:var(--dark-bg-light)}.quote-block p{color:var(--text);font-size:1.1rem;margin:0}.fibonacci-article.dark-mode .quote-block p{color:var(--dark-text)}.quote-author{color:var(--text-light);font-size:.9rem;font-style:normal;margin-top:15px;text-align:right}.fibonacci-article.dark-mode .quote-author{color:var(--dark-text-secondary)}.definition-box{background:var(--white);border:2px solid var(--primary);border-radius:8px;margin:25px 0;padding:20px}.fibonacci-article.dark-mode .definition-box{background:var(--dark-bg);border-color:var(--primary)}.definition-box .definition-term{color:var(--primary);font-size:1.2rem;font-weight:700;margin-bottom:10px}.definition-box .definition-text{color:var(--text);margin:0}.fibonacci-article.dark-mode .definition-box .definition-text{color:var(--dark-text)}.info-box{background:#3498db1a;border:1px solid var(--primary);border-radius:8px;margin:25px 0;padding:20px}.fibonacci-article.dark-mode .info-box{background:#3498db33}.warning-box{background:#f39c121a;border:1px solid var(--warning);border-radius:8px;margin:25px 0;padding:20px}.fibonacci-article.dark-mode .warning-box{background:#f39c1233}.info-box p,.warning-box p{color:var(--text);margin:0}.fibonacci-article.dark-mode .info-box p,.fibonacci-article.dark-mode .warning-box p{color:var(--dark-text)}.math-expression{color:var(--primary);font-family:Times New Roman,serif;font-style:italic;font-weight:500}@media (max-width:768px){.fibonacci-article{margin:20px 10px}.article-container{padding:25px 20px}.article-header h1{font-size:2rem}.article-intro{font-size:1.1rem}.article-section h2{font-size:1.5rem}.article-section h3{font-size:1.2rem}.formula-box{font-size:.9rem;padding:15px}.data-table{font-size:.85rem}.data-table td,.data-table th{padding:8px 10px}}@media (max-width:480px){.fibonacci-article{margin:10px 5px}.article-container{padding:20px 15px}.article-header h1{font-size:1.8rem}.article-intro{font-size:1rem}.article-section h2{font-size:1.3rem}.article-section h3{font-size:1.1rem}.article-section li,.article-section p{font-size:.95rem}.formula-box{font-size:.8rem;padding:12px}.formula-box p{font-size:1rem}}.random-number-generator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.random-number-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.random-number-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.presets-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.random-number-generator.dark-mode .presets-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.presets-section h3{color:inherit;font-size:1.2rem;font-weight:600;margin-bottom:16px;margin-top:0}.preset-buttons{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.preset-btn{align-items:center;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:.95rem;font-weight:500;gap:8px;justify-content:center;padding:12px 16px;transition:all .3s ease}.preset-btn:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #3498db4d;color:#fff;color:var(--white);transform:translateY(-2px)}.random-number-generator.dark-mode .preset-btn{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.random-number-generator.dark-mode .settings-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.setting-input,.settings-section select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease}.setting-input:focus,.settings-section select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.random-number-generator.dark-mode .setting-input,.random-number-generator.dark-mode .settings-section select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.advanced-toggle{margin-bottom:20px}.toggle-btn{background-color:initial;border:1px solid #3498db;border:1px solid var(--primary);color:#3498db;display:inline-flex;font-size:1rem;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.toggle-btn:hover{background-color:#3498db1a;transform:translateY(-2px)}.random-number-generator.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.generate-section{margin-bottom:30px;text-align:center}.generate-btn{align-items:center;background-color:#3498db;border-radius:12px;box-shadow:0 4px 15px #3498db4d;color:#fff;display:inline-flex;font-weight:700;gap:12px;padding:16px 32px;transition:all .3s ease}.generate-btn:hover{background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 8px 25px #3498db66;transform:translateY(-3px)}.results-section{padding:25px}.random-number-generator.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.results-header{flex-wrap:wrap;gap:10px}.results-header h3{color:inherit;font-size:1.3rem;font-weight:600}.result-actions{flex-wrap:wrap}.action-btn{align-items:center;background-color:#95a5a6;background-color:var(--secondary);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:6px;padding:8px 16px;transition:all .3s ease}.action-btn:hover{background-color:#7f8c8d;transform:translateY(-2px)}.action-btn.clear{background-color:#e74c3c;background-color:var(--danger)}.action-btn.clear:hover{background-color:#c0392b}.numbers-display{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:25px;min-height:100px;padding:20px}.random-number-generator.dark-mode .numbers-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.number-item{background:linear-gradient(135deg,#3498db,#2980b9);background:linear-gradient(135deg,var(--primary),var(--primary-hover));border-radius:8px;box-shadow:0 2px 8px #3498db33;color:#fff;color:var(--white);cursor:pointer;font-size:1.1rem;font-weight:600;min-width:60px;padding:12px 18px;text-align:center;transition:all .3s ease;-webkit-user-select:none;user-select:none}.number-item:hover{box-shadow:0 6px 20px #3498db66;transform:translateY(-3px) scale(1.05)}.statistics-section{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;margin-top:25px;padding:20px}.random-number-generator.dark-mode .statistics-section{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.statistics-section h4{color:inherit;font-size:1.1rem;font-weight:600;margin-bottom:16px;margin-top:0}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.stat-item{background:#f8fafc;background:var(--bg-light);transition:all .3s ease}.random-number-generator.dark-mode .stat-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.stat-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.stat-label{font-size:.85rem}.random-number-generator.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.stat-value{font-size:1.3rem}.history-section{padding:25px}.random-number-generator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.clear-history-btn{align-items:center;background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:6px;padding:8px 16px;transition:all .3s ease}.clear-history-btn:hover{background-color:#c0392b;transform:translateY(-2px)}.history-list{grid-gap:12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.history-item{grid-gap:12px;display:grid;font-size:.9rem;gap:12px;grid-template-columns:1fr auto auto auto;padding:12px 16px}.random-number-generator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-number{color:#3498db;color:var(--primary);font-size:1rem;font-weight:700}.history-type{background:#f8fafc;background:var(--bg-light);border-radius:4px;font-size:.8rem;font-weight:500;padding:4px 8px}.random-number-generator.dark-mode .history-type{background:#2d3748;background:var(--dark-bg-light)}.history-range{color:#7f8c8d;color:var(--text-light);font-size:.8rem}.random-number-generator.dark-mode .history-range{color:#a0aec0;color:var(--dark-text-secondary)}.history-time{color:#7f8c8d;color:var(--text-light);font-size:.8rem}.random-number-generator.dark-mode .history-time{color:#a0aec0;color:var(--dark-text-secondary)}.related-tools{padding:25px}.random-number-generator.dark-mode .related-tools{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.random-number-generator.dark-mode .tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.tool-card h4{margin-bottom:12px}.random-number-generator.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.random-number-generator{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.header-section h2{font-size:1.6rem}.preset-buttons,.settings-grid{grid-template-columns:1fr}.results-header{align-items:flex-start;flex-direction:column;gap:16px}.result-actions{justify-content:center;width:100%}.numbers-display{justify-content:flex-start}.stats-grid{grid-template-columns:repeat(2,1fr)}.history-item,.history-list{grid-template-columns:1fr}.history-item{gap:8px;text-align:center}.tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.random-number-generator{margin:8px;padding:16px}.numbers-display{padding:16px}.number-item{font-size:1rem;min-width:50px;padding:10px 14px}.stats-grid{grid-template-columns:1fr}.generate-btn{font-size:1rem;padding:14px 24px}}.article-container{margin:40px auto 0;max-width:800px;padding:0}.random-number-generator-article{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;padding:40px}.random-number-generator.dark-mode .random-number-generator-article{background:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.random-number-generator-article h2{border-bottom:3px solid var(--primary);color:var(--primary);font-size:2rem;font-weight:700;margin-bottom:24px;padding-bottom:12px;text-align:left}.random-number-generator-article h3{color:var(--text);font-size:1.4rem;font-weight:600;margin-bottom:16px;margin-top:32px;text-align:left}.random-number-generator.dark-mode .random-number-generator-article h3{color:var(--dark-text)}.random-number-generator-article h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin-bottom:12px;margin-top:24px;text-align:left}.random-number-generator-article p{font-size:1rem;margin-bottom:16px;text-align:left}.random-number-generator-article ul{margin-bottom:16px;padding-left:24px}.random-number-generator-article li{margin-bottom:8px;text-align:left}.random-number-generator-article strong{color:var(--primary);font-weight:600}@media (max-width:768px){.article-container{margin:20px auto 0;padding:0 16px}.random-number-generator-article{padding:24px}.random-number-generator-article h2{font-size:1.6rem}.random-number-generator-article h3{font-size:1.2rem}}@media (max-width:480px){.random-number-generator-article{padding:20px}.random-number-generator-article h2{font-size:1.4rem}}.matrix-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.matrix-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.matrix-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.operation-selector{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;flex-wrap:wrap;gap:16px;margin-bottom:30px;padding:20px}.matrix-calculator.dark-mode .operation-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.operation-selector label{color:inherit;font-weight:600;white-space:nowrap}.operation-selector select{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;font-family:inherit;font-size:.95rem;min-width:200px;padding:12px 16px;transition:all .3s ease}.operation-selector select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.matrix-calculator.dark-mode .operation-selector select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.power-input,.scalar-input{align-items:center;display:flex;gap:8px}.power-input input,.scalar-input input{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-family:inherit;padding:8px 12px;transition:all .3s ease;width:80px}.power-input input:focus,.scalar-input input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.matrix-calculator.dark-mode .power-input input,.matrix-calculator.dark-mode .scalar-input input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.matrices-container{grid-gap:var(--gap);display:grid;gap:var(--gap);grid-template-columns:1fr 1fr;margin-bottom:30px}@media (max-width:1024px){.matrices-container{grid-template-columns:1fr}}.matrix-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.matrix-calculator.dark-mode .matrix-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.matrix-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.matrix-header h3{color:inherit;font-size:1.2rem;font-weight:600;margin:0}.matrix-controls{align-items:center;display:flex;gap:12px}.matrix-controls label{align-items:center;display:flex;font-size:.9rem;font-weight:500;gap:6px}.size-input{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-family:inherit;padding:6px 8px;text-align:center;transition:all .3s ease;width:60px}.size-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 2px #3498db1a;outline:none}.matrix-calculator.dark-mode .size-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.matrix-grid{grid-gap:8px;display:grid;gap:8px;max-width:100%;overflow-x:auto;padding:4px}.matrix-cell{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-family:Fira Code,monospace;font-size:.9rem;height:45px;outline:none;padding:8px;text-align:center;transition:all .3s ease;width:60px}.matrix-cell:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;transform:scale(1.02)}.matrix-cell:read-only{background-color:#f8fafc;background-color:var(--bg-light);cursor:default}.matrix-calculator.dark-mode .matrix-cell{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.matrix-calculator.dark-mode .matrix-cell:read-only{background-color:#2d3748;background-color:var(--dark-bg-light)}.calculation-controls{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-bottom:30px}.calculate-button{font-size:1rem;font-weight:700;padding:14px 28px}.calculate-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}.steps-toggle{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white)}.steps-toggle:hover:not(:disabled){background-color:#7f8c8d;transform:translateY(-2px)}button.secondary{background-color:#f8fafc;background-color:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);color:#2c3e50;color:var(--text)}button.secondary:hover:not(:disabled){background-color:#e1e8ed;background-color:var(--border)}.matrix-calculator.dark-mode button.secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.matrix-calculator.dark-mode button.secondary:hover:not(:disabled){background-color:#4a5568;background-color:var(--dark-border)}.result-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);padding:20px}.matrix-calculator.dark-mode .result-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.result-header h3{color:#2ecc71;color:var(--success);font-size:1.2rem;font-weight:600}.matrix-calculator.dark-mode .steps-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.steps-section h3{color:inherit;font-size:1.2rem;font-weight:600;margin-bottom:16px;margin-top:0}.matrix-calculator.dark-mode .step-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.step-number{color:var(--white)}.step-text{color:inherit;font-family:Fira Code,monospace;font-size:.9rem;line-height:1.4}.matrix-calculator.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-header h3{color:inherit}.clear-history:hover:not(:disabled){background-color:#c0392b;transform:translateY(-1px)}.matrix-calculator.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.operation-type{background-color:#3498db;background-color:var(--primary);border-radius:4px;color:#fff;color:var(--white);font-size:.8rem;font-weight:600;padding:4px 8px}.matrix-calculator.dark-mode .timestamp{color:#a0aec0;color:var(--dark-text-secondary)}.history-matrices{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.85rem;gap:16px}.matrix-calculator.dark-mode .history-matrices{color:#a0aec0;color:var(--dark-text-secondary)}.related-tools h3{font-weight:600;margin-bottom:16px}.tools-grid{grid-gap:12px;gap:12px}.tool-card{gap:8px;padding:12px 16px}.tool-card:hover{background-color:#3498db;background-color:var(--primary);box-shadow:0 4px 12px #3498db33}.matrix-calculator.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.matrix-calculator.dark-mode .tool-card:hover{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}@media (max-width:768px){.matrix-calculator{margin:16px;padding:20px}.operation-selector{align-items:stretch;flex-direction:column}.operation-selector select{min-width:0;min-width:auto}.matrix-controls{flex-direction:column;gap:8px}.matrix-grid{grid-template-columns:repeat(auto-fit,minmax(50px,1fr))}.matrix-cell{min-width:50px;width:auto}.calculation-controls,.result-header{flex-direction:column}.result-header{align-items:stretch;gap:12px}.result-actions{justify-content:center}.tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.header-section{align-items:stretch;flex-direction:column;gap:16px}.header-section h2{font-size:1.6rem;justify-content:center}.matrix-grid{gap:6px;grid-template-columns:repeat(auto-fit,minmax(45px,1fr))}.matrix-cell{font-size:.8rem;height:40px;min-width:45px}}.matrix-calculator-article{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:30px}.matrix-calculator.dark-mode .matrix-calculator-article{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.article-container{color:var(--text)}.matrix-calculator.dark-mode .article-container{color:var(--dark-text)}.article-header{padding-bottom:20px}.matrix-calculator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.article-header h1{color:var(--text);margin-bottom:16px}.matrix-calculator.dark-mode .article-header h1{color:var(--dark-text)}.matrix-calculator.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-section{margin-bottom:35px}.article-section h2{border-bottom:1px solid var(--border);margin-bottom:20px;padding-bottom:8px}.matrix-calculator.dark-mode .article-section h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.article-section h3{margin-bottom:16px;margin-top:24px}.matrix-calculator.dark-mode .article-section h3{color:var(--dark-text)}.article-section p{margin-bottom:16px}.matrix-calculator.dark-mode .article-section p{color:var(--dark-text)}.article-section ol,.article-section ul{margin-bottom:20px;padding-left:0}.article-section li{margin-bottom:12px;padding-left:24px;position:relative}.matrix-calculator.dark-mode .article-section li{color:var(--dark-text)}.article-section ul li:before{color:var(--primary);content:"•";font-size:1.2rem;font-weight:700;left:0;position:absolute}.article-section ol{counter-reset:item}.article-section ol li{counter-increment:item}.article-section ol li:before{align-items:center;background:var(--primary);border-radius:50%;color:#fff;content:counter(item);display:flex;font-size:.8rem;font-weight:600;height:18px;justify-content:center;left:0;position:absolute;top:2px;width:18px}.applications,.math-concepts,.operation-details,.properties,.tips-section,.troubleshooting,.usage-steps{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;margin-bottom:24px;padding:24px}.matrix-calculator.dark-mode .applications,.matrix-calculator.dark-mode .math-concepts,.matrix-calculator.dark-mode .operation-details,.matrix-calculator.dark-mode .properties,.matrix-calculator.dark-mode .tips-section,.matrix-calculator.dark-mode .troubleshooting,.matrix-calculator.dark-mode .usage-steps{background:var(--dark-bg-light);border-color:var(--dark-border)}.applications h3,.math-concepts h3,.operation-details h3,.properties h3,.tips-section h3,.troubleshooting h3,.usage-steps h3{color:var(--primary);font-size:1.2rem;margin-top:0}strong{font-weight:600}.matrix-calculator.dark-mode strong,strong{color:var(--primary)}@media (max-width:768px){.matrix-calculator-article{margin:20px auto 0;padding:20px}.article-header h1{font-size:1.8rem}.article-subtitle{font-size:1rem}.article-section h2{font-size:1.4rem}.article-section h3{font-size:1.2rem}.applications,.math-concepts,.operation-details,.properties,.tips-section,.troubleshooting,.usage-steps{padding:18px}}@media (max-width:480px){.matrix-calculator-article{margin:16px auto 0;padding:16px}.article-header{margin-bottom:30px}.article-header h1{font-size:1.6rem;line-height:1.4}.article-subtitle{font-size:.95rem}.article-section{margin-bottom:28px}.article-section h2{font-size:1.3rem;margin-bottom:16px}.article-section h3{font-size:1.1rem;margin-bottom:12px;margin-top:20px}.article-section p{font-size:.95rem;margin-bottom:14px}.article-section li{font-size:.95rem;margin-bottom:10px;padding-left:20px}.applications,.math-concepts,.operation-details,.properties,.tips-section,.troubleshooting,.usage-steps{margin-bottom:20px;padding:16px}.article-section ol li:before{font-size:.7rem;height:16px;top:1px;width:16px}}@media print{.matrix-calculator-article{border:none;box-shadow:none;margin:0;padding:20px}.article-header{border-bottom:2px solid #333}.article-section h2{border-bottom:1px solid #333;break-after:avoid;page-break-after:avoid}.applications,.math-concepts,.operation-details,.properties,.tips-section,.troubleshooting,.usage-steps{border:1px solid #333;break-inside:avoid;page-break-inside:avoid}}.article-section p:first-of-type{font-size:1.05rem;font-weight:400}.article-section blockquote{background:var(--bg-light);border-left:4px solid var(--primary);color:var(--text-light);font-style:italic;margin:24px 0;padding:20px 24px}.matrix-calculator.dark-mode .article-section blockquote{background:var(--dark-bg-light);color:var(--dark-text-secondary)}code{border:1px solid var(--border);font-family:Fira Code,monospace;padding:3px 6px}.matrix-calculator.dark-mode code{background:var(--dark-bg-light);border-color:var(--dark-border)}.article-section a{color:var(--primary);text-decoration:underline;transition:color .3s ease}.article-section a:hover{color:var(--primary-hover)}.article-section a:focus{outline:2px solid var(--primary);outline-offset:2px}@media (prefers-contrast:high){.article-section h2,.article-section h3{border-bottom-width:2px}.applications,.math-concepts,.operation-details,.properties,.tips-section,.troubleshooting,.usage-steps{border-width:2px}}@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}.permutation-calculator{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.permutation-calculator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.permutation-calculator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.calculation-type-selector{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px;padding:8px}.permutation-calculator.dark-mode .calculation-type-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.calculation-type-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px;transition:all .3s ease}.calculation-type-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.calculation-type-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.calculation-type-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.permutation-calculator.dark-mode .calculation-type-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.practice-section{animation:fadeIn .3s ease-out;background:linear-gradient(135deg,#2ecc71,#27ae60);background:linear-gradient(135deg,var(--success),#27ae60);border-radius:12px;color:#fff;margin-bottom:30px;padding:20px}.practice-section h3{font-size:1.2rem;margin-bottom:12px;margin-top:0}.practice-section p{font-size:1.1rem;line-height:1.5;margin-bottom:16px}.input-section{grid-gap:var(--gap);display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.permutation-calculator.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.permutation-calculator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-group input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease}.input-group input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.input-group input:disabled{background-color:#f8fafc;background-color:var(--bg-light);cursor:not-allowed;opacity:.6}.permutation-calculator.dark-mode .input-group input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.permutation-calculator.dark-mode .error-message{background-color:#e74c3c33}.result-section{animation:slideIn .4s ease-out;background:linear-gradient(135deg,#2ecc71,#27ae60);background:linear-gradient(135deg,var(--success),#27ae60);border-radius:12px;color:#fff;margin-bottom:30px;padding:24px}.result-header{margin-bottom:16px}.result-header h3{align-items:center;display:flex;font-size:1.3rem;gap:8px;margin:0}.copy-button{background-color:#fff3;border:1px solid #ffffff4d}.copy-button:hover{background-color:#ffffff4d}.result-display{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#ffffff1a;border-radius:8px;padding:20px}.formula-display{font-family:Courier New,monospace;font-size:1.1rem;margin-bottom:12px;opacity:.9}.result-value{font-size:2rem;font-weight:700;line-height:1.2;word-break:break-all}.steps-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.permutation-calculator.dark-mode .steps-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.steps-header{justify-content:space-between;margin-bottom:16px}.steps-header,.steps-header h3{align-items:center;display:flex}.steps-header h3{font-size:1.2rem;gap:8px;margin:0}.toggle-button{background-color:#95a5a6;background-color:var(--secondary);border:none;border-radius:6px;color:var(--white);padding:8px 16px}.toggle-button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.steps-list{display:flex;flex-direction:column;gap:12px}.step-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border-radius:8px;gap:12px;padding:12px}.permutation-calculator.dark-mode .step-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.step-number{background-color:#3498db;background-color:var(--primary);font-size:.8rem;height:24px;width:24px}.step-text{flex:1 1;font-family:Courier New,monospace;line-height:1.5}.quick-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.quick-actions button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.calculate-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.calculate-button:hover{background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.practice-button{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}.practice-button:hover{background-color:#27ae60;transform:translateY(-2px)}.examples-button,.history-button{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white)}.examples-button:hover,.history-button:hover{background-color:#7f8c8d;transform:translateY(-2px)}.examples-section{animation:fadeIn .3s ease-out;margin-bottom:30px}.examples-section h3{align-items:center;display:flex;font-size:1.3rem;gap:8px;margin-bottom:20px}.examples-grid{grid-gap:16px;gap:16px}.example-card{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;cursor:pointer;padding:20px;transition:all .3s ease}.example-card:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 8px 25px #0000001a;transform:translateY(-4px)}.permutation-calculator.dark-mode .example-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.example-card h4{color:#3498db;color:var(--primary);font-size:1.1rem;margin-bottom:8px;margin-top:0}.example-card p{color:#2c3e50;color:var(--text);line-height:1.5;margin-bottom:12px}.permutation-calculator.dark-mode .example-card p{color:#f7fafc;color:var(--dark-text)}.example-values{background:#fff;background:var(--white);border-radius:6px;color:#7f8c8d;color:var(--text-light);font-family:Courier New,monospace;font-size:.9rem;padding:8px 12px}.permutation-calculator.dark-mode .example-values{background:#1a202c;background:var(--dark-bg);color:#a0aec0;color:var(--dark-text-secondary)}.history-section{animation:fadeIn .3s ease-out}.permutation-calculator.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.permutation-calculator.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.calculation-type{background-color:#3498db;background-color:var(--primary);border-radius:4px;color:#fff;font-size:.8rem;font-weight:600;padding:2px 8px}.history-formula{color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.9rem;margin-bottom:4px}.permutation-calculator.dark-mode .history-formula{color:#f7fafc;color:var(--dark-text)}.history-result{color:#2ecc71;color:var(--success);font-size:.95rem;font-weight:600}.permutation-calculator.dark-mode .related-tools{border-top-color:#4a5568;border-top-color:var(--dark-border)}.related-tools h3{justify-content:center}.tool-card{flex-direction:column}.tool-card:hover{box-shadow:0 8px 25px #0000001a;color:#3498db;color:var(--primary);text-decoration:none}.permutation-calculator.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.permutation-calculator.dark-mode .tool-card:hover{color:#3498db;color:var(--primary)}.tool-icon{font-size:2rem;margin-bottom:8px}.tool-name{font-size:.9rem;font-weight:600;text-align:center}@media (max-width:768px){.permutation-calculator{margin:16px;padding:20px}.calculation-type-selector,.input-section{grid-template-columns:1fr}.quick-actions{flex-direction:column}.quick-actions button{justify-content:center;width:100%}.examples-grid{grid-template-columns:1fr}.tools-grid{grid-template-columns:repeat(2,1fr)}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-button{align-self:flex-end;margin-left:0}}@media (max-width:480px){.header-section{flex-direction:column;gap:16px;text-align:center}.header-section h2,.result-value{font-size:1.5rem}.tools-grid{grid-template-columns:1fr}}.pc-calculator-article{color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;line-height:1.7;margin:40px auto;max-width:1000px;padding:0 20px}.article-container{background:#fff;background:var(--white);border:1px solid #e1e8ed;border-radius:16px;box-shadow:0 8px 32px #1018280a;box-shadow:0 8px 32px var(--shadow)}.article-header{background:linear-gradient(135deg,#3498db,#2980b9);background:linear-gradient(135deg,var(--primary),var(--primary-hover));padding:48px 40px}.article-header h1{font-size:2.5rem;font-weight:800;line-height:1.2;margin:0 0 20px}.article-header p{color:#fff}.article-intro{font-size:1.2rem;font-weight:400;line-height:1.6;margin:0;opacity:.95}.article-section{border-bottom:1px solid #e1e8ed;padding:40px}.article-section:last-child{border-bottom:none}.article-section h2{border-bottom:2px solid #e1e8ed;border-bottom:2px solid var(--border);color:#2c3e50;color:var(--text);font-size:1.8rem;font-weight:700;margin:0 0 24px;padding-bottom:12px}.article-section h3{color:#2c3e50;font-size:1.3rem;margin:32px 0 16px}.article-section p{color:#2c3e50;margin:16px 0}.concept-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:32px 0}.concept-card{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:28px;transition:all .3s ease}.concept-card:hover{box-shadow:0 12px 28px #00000014;transform:translateY(-4px)}.concept-card h3{color:#3498db;color:var(--primary);font-size:1.2rem;margin-bottom:16px;margin-top:0}.concept-card p{margin-bottom:20px}.concept-card p,.formula-box{color:#2c3e50;color:var(--text)}.formula-box{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:Courier New,monospace;font-size:.95rem;padding:16px;text-align:center}.comparison-table{grid-gap:1px;background:#e1e8ed;background:var(--border);border-radius:8px;display:grid;gap:1px;grid-template-columns:1fr 1fr 1fr;margin:24px 0;overflow:hidden}.table-header,.table-row{display:contents}.table-cell{align-items:center;background:#fff;background:var(--white);display:flex;font-size:.9rem;justify-content:center;padding:16px;text-align:center}.table-header .table-cell{background:#3498db;background:var(--primary);color:#fff;font-weight:600}.factorial-examples{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;gap:12px;margin:24px 0;padding:24px}.factorial-item{color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:1.1rem;padding:8px 0}.applications-grid{margin:32px 0}.application-card{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:24px;transition:all .3s ease}.application-card:hover{box-shadow:0 8px 20px #0000000f;transform:translateY(-2px)}.application-card h3{color:#3498db;color:var(--primary);font-size:1.1rem;margin-bottom:16px;margin-top:0}.application-card ul{margin:0;padding-left:20px}.application-card li{color:#2c3e50;color:var(--text);margin:8px 0}.problem-examples{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:32px 0}.problem-card{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:24px;transition:all .3s ease}.problem-card:hover{box-shadow:0 8px 20px #00000014;transform:translateY(-2px)}.problem-card h3{color:#2ecc71;color:var(--success);font-size:1.1rem;margin-bottom:16px;margin-top:0}.problem-card p{line-height:1.6;margin:12px 0}.problem-card p strong{color:#2c3e50;color:var(--text)}.tips-list{display:flex;flex-direction:column;gap:16px;margin:24px 0}.tip-item{background:#f8fafc;border-left:4px solid #3498db;border-left:4px solid var(--primary);border-radius:12px;transition:all .3s ease}.tip-item:hover{box-shadow:0 4px 12px #0000000d;transform:translateX(4px)}.tip-item strong{color:#3498db;color:var(--primary)}.features-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:32px 0}.feature-item{background:#fff;border:1px solid #e1e8ed;box-shadow:0 4px 12px #0000000a;padding:28px}.feature-item:hover{box-shadow:0 12px 28px #00000014;transform:translateY(-4px)}.feature-item h3{color:#3498db;margin-bottom:16px}.feature-item p{color:#2c3e50}ul{padding-left:20px}li{margin:8px 0}code,li{color:#2c3e50;color:var(--text)}code{background:#f8fafc;background:var(--bg-light)}@media (max-width:768px){.pc-calculator-article{margin:20px auto;padding:0 16px}.article-header{padding:32px 24px}.article-header h1{font-size:2rem}.article-intro{font-size:1.1rem}.article-section{padding:24px}.article-section h2{font-size:1.5rem}.concept-grid{gap:16px}.comparison-table,.concept-grid{grid-template-columns:1fr}.table-cell{padding:12px;text-align:left}.applications-grid,.features-grid,.problem-examples{grid-template-columns:1fr}}@media (max-width:480px){.article-header{padding:24px 20px}.article-header h1{font-size:1.75rem}.article-intro{font-size:1rem}.application-card,.article-section,.concept-card,.feature-item,.problem-card{padding:20px}.factorial-examples,.tip-item{padding:16px}}@media (prefers-color-scheme:dark){.pc-calculator-article{color:#f7fafc;color:var(--dark-text)}.article-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 8px 32px #0000004d;box-shadow:0 8px 32px var(--dark-shadow)}.article-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.article-section h2,.article-section h3,.article-section p{color:#f7fafc;color:var(--dark-text)}.application-card,.concept-card,.feature-item,.formula-box,.problem-card,.tip-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.table-cell{background:#2d3748;background:var(--dark-bg-light)}.application-card li,.factorial-item,.feature-item p,.problem-card p,.table-cell,.tip-item,code{color:#f7fafc;color:var(--dark-text)}code{background:#2d3748;background:var(--dark-bg-light)}}@media print{.pc-calculator-article{color:#000;font-size:12pt;line-height:1.4;margin:0;padding:0}.article-container{border:none;box-shadow:none}.article-header{background:none;color:#000;padding:20px}.article-section{padding:20px;page-break-inside:avoid}.application-card,.concept-card,.feature-item,.problem-card{border:1px solid #ccc;box-shadow:none;page-break-inside:avoid}}.graph-plotter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.graph-plotter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.graph-plotter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.graph-plotter.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.equation-input{margin-bottom:20px}.equation-input label{color:#2c3e50;color:var(--text);display:block;font-weight:600;margin-bottom:8px}.graph-plotter.dark-mode .equation-input label{color:#f7fafc;color:var(--dark-text)}.equation-field{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:1rem;outline:none;padding:12px 16px;transition:all .3s ease;width:100%}.equation-field:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.graph-plotter.dark-mode .equation-field{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.equation-input small{color:#7f8c8d;color:var(--text-light);display:block;font-size:.85rem;margin-top:6px}.graph-plotter.dark-mode .equation-input small{color:#a0aec0;color:var(--dark-text-secondary)}.error-message{padding:12px}.range-controls{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr;margin-bottom:24px}.range-group label{color:#2c3e50;color:var(--text);display:block;font-weight:600;margin-bottom:8px}.graph-plotter.dark-mode .range-group label{color:#f7fafc;color:var(--dark-text)}.range-inputs{align-items:center;display:flex;gap:12px}.range-inputs input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);flex:1 1;font-size:.95rem;outline:none;padding:10px 12px;transition:all .3s ease}.range-inputs input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.graph-plotter.dark-mode .range-inputs input{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.range-inputs span{color:#7f8c8d;color:var(--text-light);font-weight:500}.plot-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.plot-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.clear-button:hover:not(:disabled){transform:translateY(-2px)}.toggle-advanced{background-color:initial;border:1px solid #3498db;border:1px solid var(--primary);color:#3498db;color:var(--primary)}.toggle-advanced:hover{background-color:#3498db1a}.graph-plotter.dark-mode .toggle-advanced{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.graph-plotter.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h3{color:#2c3e50;color:var(--text)}.graph-plotter.dark-mode .advanced-settings h3,.graph-plotter.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.setting-group input[type=color],.setting-group input[type=number]{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-size:.9rem;outline:none;padding:8px 12px}.setting-group input[type=color]:focus,.setting-group input[type=number]:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 2px #3498db1a}.graph-plotter.dark-mode .setting-group input[type=number]{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group input[type=range]::-webkit-slider-thumb{height:16px;width:16px}.graph-plotter.dark-mode .setting-group input[type=range]{background:#4a5568;background:var(--dark-border)}.setting-group input[type=checkbox]{accent-color:#3498db;accent-color:var(--primary)}.reset-button{background-color:#f39c12;background-color:var(--warning);margin-top:8px}.reset-button:hover:not(:disabled){background-color:#e67e22;transform:translateY(-1px)}.graph-container{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px;text-align:center}.graph-plotter.dark-mode .graph-container{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.graph-canvas{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;height:auto;max-width:100%}.graph-plotter.dark-mode .graph-canvas{border-color:#4a5568;border-color:var(--dark-border)}.points-display{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.graph-plotter.dark-mode .points-display{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.points-display h3{color:#2c3e50;color:var(--text);margin:0 0 16px}.graph-plotter.dark-mode .points-display h3{color:#f7fafc;color:var(--dark-text)}.points-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.point-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.9rem;padding:8px 12px;text-align:center}.graph-plotter.dark-mode .point-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.history-section{padding:24px}.graph-plotter.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-header h3{color:#2c3e50}.graph-plotter.dark-mode .history-header h3{color:#f7fafc;color:var(--dark-text)}.graph-plotter.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.equation-text{color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:1rem;margin-bottom:4px}.graph-plotter.dark-mode .equation-text{color:#f7fafc;color:var(--dark-text)}.timestamp{font-size:.85rem}.graph-plotter.dark-mode .timestamp{color:#a0aec0;color:var(--dark-text-secondary)}.load-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white);flex-shrink:0;margin-left:16px;padding:8px 16px}.load-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.graph-plotter.dark-mode .related-tools{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.related-tools h3{color:#2c3e50;color:var(--text);margin:0 0 20px}.graph-plotter.dark-mode .related-tools h3{color:#f7fafc;color:var(--dark-text)}.tools-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.graph-plotter.dark-mode .tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tool-name{font-weight:500}@media (max-width:768px){.graph-plotter{margin:16px;padding:20px}.range-controls{grid-template-columns:1fr}.primary-actions{flex-direction:column}.settings-grid,.tools-grid{grid-template-columns:1fr}.graph-canvas{max-width:600px;width:100%}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.load-button{align-self:flex-end;margin-left:0}}@media (max-width:480px){.graph-plotter{margin:8px;padding:16px}.header-section{flex-direction:column;gap:16px;text-align:center}.points-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}}.graph-plotter-article{color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6;margin:40px auto 0;max-width:1000px;padding:0}.article-container{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;overflow:hidden}.dark-mode .article-container{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.article-header{background:linear-gradient(135deg,var(--primary) 0,var(--primary-hover) 100%);color:#fff;padding:40px 30px}.article-header h1{font-size:2.2rem;font-weight:700;line-height:1.3;margin:0 0 16px}.article-subtitle{opacity:.9}.article-section{border-bottom:1px solid var(--border);padding:30px}.dark-mode .article-section{border-bottom-color:var(--dark-border)}.article-section:last-of-type{border-bottom:none}.article-section h2{font-size:1.6rem;font-weight:600;margin:0 0 20px;text-align:left}.article-section h2,.dark-mode .article-section h2{color:var(--primary)}.article-section h3{font-size:1.2rem;margin:0 0 12px;text-align:left}.dark-mode .article-section h3{color:var(--dark-text)}.article-section p{text-align:left}.dark-mode .article-section p{color:var(--dark-text)}.features-grid{grid-gap:24px;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.feature-item{padding:24px}.dark-mode .feature-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.feature-item h3{margin:0 0 12px}.feature-item p{color:var(--text-light);margin:0}.dark-mode .feature-item p{color:var(--dark-text-secondary)}.function-categories{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.function-category{background:var(--bg-light);border:1px solid var(--border);border-radius:8px;padding:20px}.dark-mode .function-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.function-category h3{color:var(--primary);font-size:1.1rem;margin:0 0 16px;text-align:left}.function-category ul{list-style:none;margin:0;padding:0}.function-category li{border-bottom:1px solid var(--border);font-size:.9rem;padding:8px 0;text-align:left}.dark-mode .function-category li{border-bottom-color:var(--dark-border)}.function-category li:last-child{border-bottom:none}.function-category strong{color:var(--primary);font-weight:600}.steps-container{margin:24px 0}.step-item{margin-bottom:24px;text-align:left}.step-number{font-weight:600}.step-content h3{font-size:1.1rem;margin:0 0 8px}.dark-mode .step-content p{color:var(--dark-text-secondary)}.examples-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.example-item{background:var(--bg-light);border:1px solid var(--border);border-radius:8px;padding:20px;text-align:left}.dark-mode .example-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.example-item h3{color:var(--primary);font-size:1rem;margin:0 0 12px}.equation-example{background:var(--white);border:1px solid var(--border);border-radius:6px;color:var(--text);font-family:Courier New,monospace;font-size:1rem;font-weight:600;margin-bottom:12px;padding:12px 16px;text-align:center}.dark-mode .equation-example{background:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.example-item p{color:var(--text-light);font-size:.9rem;margin:0}.dark-mode .example-item p{color:var(--dark-text-secondary)}.applications-list{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.application-item{background:var(--bg-light);padding:24px;text-align:left}.dark-mode .application-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.application-item h3{font-size:1.1rem;margin:0 0 12px}.application-item p{color:var(--text-light);font-size:.95rem;margin:0}.dark-mode .application-item p{color:var(--dark-text-secondary)}.tips-container{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.tip-item{background:var(--bg-light);border:1px solid var(--border);border-radius:8px;padding:20px;text-align:left}.dark-mode .tip-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.tip-item h3{align-items:center;display:flex;font-size:1rem;gap:8px;margin:0 0 12px}.tip-item p{color:var(--text-light);font-size:.9rem;margin:0}.dark-mode .tip-item p{color:var(--dark-text-secondary)}.issue-item{background:var(--bg-light);border:1px solid var(--border);margin-bottom:16px;padding:20px;text-align:left}.dark-mode .issue-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.issue-item h3{color:var(--primary);font-size:1rem;margin:0 0 8px}.issue-item p{color:var(--text-light)}.dark-mode .issue-item p{color:var(--dark-text-secondary)}.advanced-features{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:24px 0}.advanced-feature{background:var(--bg-light);border:1px solid var(--border);border-radius:8px;padding:24px;text-align:left}.dark-mode .advanced-feature{background:var(--dark-bg-light);border-color:var(--dark-border)}.advanced-feature h3{color:var(--primary);font-size:1.1rem;margin:0 0 12px}.advanced-feature p{color:var(--text-light);font-size:.95rem;margin:0}.dark-mode .advanced-feature p{color:var(--dark-text-secondary)}.article-footer{background:var(--bg-light);padding:40px 30px;text-align:left}.dark-mode .article-footer{background:var(--dark-bg-light)}.footer-content h2{color:var(--primary);font-size:1.6rem;margin:0 0 16px}.footer-content p{color:var(--text-light);font-size:1rem;margin:0 0 24px}.dark-mode .footer-content p{color:var(--dark-text-secondary)}.cta-buttons{display:flex;flex-wrap:wrap;gap:16px}.cta-button{align-items:center;border-radius:8px;display:inline-flex;font-size:.95rem;font-weight:600;justify-content:center;padding:12px 24px;text-decoration:none;transition:all .3s ease}.cta-button.primary{background-color:var(--primary);color:#fff}.cta-button.primary:hover{background-color:var(--primary-hover);transform:translateY(-2px)}.cta-button.secondary{background-color:initial;border:1px solid var(--primary);color:var(--primary)}.cta-button.secondary:hover{background-color:#3498db1a}@media (max-width:768px){.article-header{padding:30px 20px}.article-header h1{font-size:1.8rem}.article-subtitle{font-size:1rem}.article-section{padding:24px 20px}.advanced-features,.applications-list,.examples-grid,.features-grid,.function-categories,.tips-container{grid-template-columns:1fr}.step-item{flex-direction:column;text-align:left}.step-number{align-self:flex-start}.cta-buttons{flex-direction:column}.cta-button{text-align:center}}@media (max-width:480px){.article-header{padding:24px 16px}.article-header h1{font-size:1.6rem}.article-section{padding:20px 16px}.article-footer{padding:30px 16px}}.image-resizer{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.image-resizer.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.image-resizer.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.image-resizer.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-resizer.dark-mode .upload-section.drag-over,.image-resizer.dark-mode .upload-section:hover{background:#1a202c;background:var(--dark-bg);border-color:#3498db;border-color:var(--primary)}.image-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.image-resizer.dark-mode .image-thumbnail{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-resizer.dark-mode .image-thumbnail.selected{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.resize-controls{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.image-resizer.dark-mode .resize-controls{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.resize-mode-selector{grid-gap:12px;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr 1fr;margin-bottom:24px;padding:6px}.image-resizer.dark-mode .resize-mode-selector{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.resize-mode-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:6px;justify-content:center;outline:none;padding:12px 16px;transition:all .3s ease}.resize-mode-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #3498db4d;color:#fff;transform:translateY(-1px)}.resize-mode-selector button.inactive{background-color:initial;border-color:#0000;color:#2c3e50;color:var(--text)}.resize-mode-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.image-resizer.dark-mode .resize-mode-selector button.inactive{color:#f7fafc;color:var(--dark-text)}.dimension-controls{grid-gap:16px;align-items:end;display:grid;gap:16px;grid-template-columns:1fr auto 1fr;margin-bottom:20px}.image-resizer.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.image-resizer.dark-mode .input-group input,.image-resizer.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.aspect-ratio-lock button{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;cursor:pointer;display:flex;font-size:1.1rem;height:48px;justify-content:center;padding:12px;transition:all .3s ease;width:48px}.aspect-ratio-lock button.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.aspect-ratio-lock button.inactive{background:#f8fafc;background:var(--bg-light);color:#7f8c8d;color:var(--text-light)}.image-resizer.dark-mode .aspect-ratio-lock button.inactive{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#a0aec0;color:var(--dark-text-secondary)}.percentage-controls{margin-bottom:20px}.percentage-presets{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.image-resizer.dark-mode .preset-button{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.preset-categories{display:flex;flex-direction:column;gap:20px}.preset-category h4{color:#3498db;color:var(--primary);font-size:1rem;font-weight:600;margin:0 0 12px}.image-resizer.dark-mode .preset-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.preset-name{font-size:.9rem}.preset-dimensions{color:#7f8c8d;color:var(--text-light);font-size:.8rem}.image-resizer.dark-mode .preset-dimensions{color:#a0aec0;color:var(--dark-text-secondary)}.image-resizer.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.color-input-group{gap:10px}.file-info{background:#fff;background:var(--white);border-radius:10px}.image-resizer.dark-mode .file-info{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.info-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.image-resizer.dark-mode .preview-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.grid-toggle,.preview-toggle{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;cursor:pointer;display:flex;font-size:.85rem;gap:6px;padding:8px 14px;transition:all .3s ease}.grid-toggle.active,.preview-toggle.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.image-resizer.dark-mode .grid-toggle,.image-resizer.dark-mode .preview-toggle{color:#f7fafc;color:var(--dark-text)}.image-resizer.dark-mode .grid-toggle,.image-resizer.dark-mode .preview-container,.image-resizer.dark-mode .preview-toggle{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-canvas-wrapper{background:#fafbfc;background:var(--canvas-bg)}.image-resizer.dark-mode .preview-canvas-wrapper{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-canvas{box-shadow:0 4px 12px var(--preview-shadow)}.image-resizer.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-resizer.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.image-resizer.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.image-resizer.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-resizer.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.image-resizer{padding:24px}.basic-controls,.info-grid,.settings-grid{grid-template-columns:1fr}}@media (max-width:768px){.image-resizer{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.dimension-controls,.resize-mode-selector{grid-template-columns:1fr}.dimension-controls{gap:16px}.aspect-ratio-lock{align-self:center;order:-1}.preview-comparison{grid-template-columns:1fr}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:300px;width:100%}}.image-resizer-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.image-resizer.dark-mode .image-resizer-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.image-resizer.dark-mode .article-header{border-bottom-color:var(--dark-border)}.image-resizer.dark-mode .article-header h2{color:var(--dark-text)}.image-resizer.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.image-resizer.dark-mode .article-section h3,.image-resizer.dark-mode .article-section h4,.image-resizer.dark-mode .article-section li,.image-resizer.dark-mode .article-section p{color:var(--dark-text)}.image-resizer.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-resizer.dark-mode .benefit-card h4{color:var(--dark-text)}.image-resizer.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.image-resizer.dark-mode .concept-item{background:var(--dark-bg-light)}.image-resizer.dark-mode .concept-item p{color:var(--dark-text)}.image-resizer.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-resizer.dark-mode .practice-item h4{color:var(--dark-text)}.image-resizer.dark-mode .practice-item p{color:var(--dark-text-secondary)}.image-resizer.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-resizer.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.image-resizer.dark-mode .scenario-card li{color:var(--dark-text)}.image-resizer.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-resizer.dark-mode .tech-item h4{color:var(--dark-text)}.image-resizer.dark-mode .tech-item p{color:var(--dark-text-secondary)}.image-resizer.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.image-resizer.dark-mode .technique-item p{color:var(--dark-text)}.image-resizer.dark-mode .mistake-item{background:#e74c3c1a}.image-resizer.dark-mode .mistake-item p{color:var(--dark-text)}.image-resizer.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-resizer.dark-mode .tool-category p{color:var(--dark-text)}.image-resizer.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.image-resizer.dark-mode .quick-tips,.image-resizer.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-resizer.dark-mode .quick-tips li,.image-resizer.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.image-resizer-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.image-resizer-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}:root{--compression-success:#10b981;--compression-warning:#f59e0b;--compression-info:#3b82f6;--compression-bg:#f0f9ff;--progress-bg:#e5e7eb;--progress-fill:#059669;--stat-gradient:linear-gradient(135deg,#667eea,#764ba2)}.image-compressor{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.image-compressor.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.image-compressor.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.upload-section{background:#f0f9ff;background:var(--compression-bg)}.image-compressor.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-compressor.dark-mode .upload-section.drag-over,.image-compressor.dark-mode .upload-section:hover{background:#1a202c;background:var(--dark-bg);border-color:#3498db;border-color:var(--primary)}.image-compressor.dark-mode .image-thumbnail{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-compressor.dark-mode .image-thumbnail.selected{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.compression-info{align-items:center;display:flex;justify-content:space-between;margin-top:4px}.compressed-size,.savings{color:#10b981;color:var(--compression-success);font-size:.8rem;font-weight:600}.savings{background:#10b9811a;border-radius:4px;padding:2px 6px}.compression-controls{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.image-compressor.dark-mode .compression-controls{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preset-item{flex-direction:column;gap:4px;padding:16px}.preset-item:hover{box-shadow:0 4px 12px #3498db1a}.image-compressor.dark-mode .preset-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.preset-name{color:#3498db;color:var(--primary);font-size:.95rem;font-weight:600}.preset-description{color:#7f8c8d;color:var(--text-light);font-size:.85rem}.preset-quality{color:#2c3e50;color:var(--text);font-size:.8rem;font-weight:500}.image-compressor.dark-mode .preset-description{color:#a0aec0;color:var(--dark-text-secondary)}.image-compressor.dark-mode .input-group label,.image-compressor.dark-mode .preset-quality{color:#f7fafc;color:var(--dark-text)}.image-compressor.dark-mode .input-group input,.image-compressor.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.quality-slider{background:#e5e7eb;background:var(--progress-bg)}.quality-slider::-webkit-slider-thumb{height:18px;width:18px}.quality-slider::-moz-range-thumb{height:18px;width:18px}.quality-labels{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.8rem;justify-content:space-between;margin-top:4px}.image-compressor.dark-mode .quality-labels{color:#a0aec0;color:var(--dark-text-secondary)}.image-compressor.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.settings-grid{margin-bottom:16px}.image-compressor.dark-mode .checkbox-group label{color:#f7fafc;color:var(--dark-text)}.image-compressor.dark-mode .individual-controls{background:#3498db1a;border-color:#3498db4d}.image-compressor.dark-mode .preview-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-compressor.dark-mode .grid-toggle{color:#f7fafc;color:var(--dark-text)}.image-compressor.dark-mode .grid-toggle,.image-compressor.dark-mode .preview-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.image-compressor.dark-mode .preview-canvas-wrapper{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.compression-stats{display:flex;justify-content:center;margin-top:12px}.stat-item{background:#10b981;background:var(--compression-success)}.image-compressor.dark-mode .stats-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-compressor.dark-mode .stat-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.image-compressor.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.image-compressor.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-compressor.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.image-compressor.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.image-compressor.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-compressor.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.image-compressor{padding:24px}.basic-controls,.individual-settings,.settings-grid{grid-template-columns:1fr}}@media (max-width:768px){.image-compressor{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.image-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.preset-grid,.preview-comparison{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:300px;width:100%}}@media (max-width:480px){.image-compressor{padding:16px}.header-section h1{font-size:1.8rem}.upload-section{padding:30px 20px}.image-grid{grid-template-columns:1fr}.tool-card{flex-direction:column;gap:12px;text-align:center}}:root{--grayscale-accent:#6b7280;--grayscale-light:#f3f4f6;--grayscale-dark:#374151;--red-channel:#ef4444;--green-channel:#10b981;--blue-channel:#3b82f6}.image-to-grayscale{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.image-to-grayscale.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.image-to-grayscale.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.upload-section{background:#f3f4f6;background:var(--grayscale-light)}.upload-section.drag-over,.upload-section:hover{background:#3b82f60d}.image-to-grayscale.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-to-grayscale.dark-mode .upload-section.drag-over,.image-to-grayscale.dark-mode .upload-section:hover{background:#1a202c;background:var(--dark-bg);border-color:#3498db;border-color:var(--primary)}.image-to-grayscale.dark-mode .image-thumbnail{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-to-grayscale.dark-mode .image-thumbnail.selected{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.image-thumbnail canvas{height:120px}.conversion-info{align-items:center;display:flex;justify-content:space-between;margin-top:4px}.processed-size,.size-change{color:#6b7280;color:var(--grayscale-accent);font-size:.8rem;font-weight:600}.size-change{background:#6b72801a;border-radius:4px;padding:2px 6px}.image-to-grayscale.dark-mode .conversion-controls{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.method-selection{margin-bottom:20px}.method-selection h4{color:#3498db;color:var(--primary);font-size:1rem;font-weight:600;margin:0 0 12px}.method-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.method-item{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;cursor:pointer;flex-direction:column;gap:4px;padding:16px;text-align:left;transition:all .3s ease}.method-item:hover{box-shadow:0 4px 12px #3498db1a}.method-item.active,.method-item:hover{border-color:#3498db;border-color:var(--primary);transform:translateY(-1px)}.method-item.active{background:#3498db0d;box-shadow:0 4px 12px #3498db33}.image-to-grayscale.dark-mode .method-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-to-grayscale.dark-mode .method-item.active{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.method-name{color:#3498db;color:var(--primary);font-size:.95rem;font-weight:600}.method-description{color:#7f8c8d;color:var(--text-light);font-size:.85rem}.image-to-grayscale.dark-mode .method-description{color:#a0aec0;color:var(--dark-text-secondary)}.preset-selection{margin-bottom:20px}.preset-selection h4{color:#3498db;color:var(--primary);font-weight:600;margin:0 0 12px}.preset-grid{grid-gap:12px;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.preset-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-size:.9rem;gap:8px;padding:12px 16px}.preset-item:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.image-to-grayscale.dark-mode .preset-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-to-grayscale.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.image-to-grayscale.dark-mode .input-group input,.image-to-grayscale.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.control-slider{background:#e1e8ed;background:var(--border);margin:8px 0}.control-slider::-webkit-slider-thumb{background:var(--primary);height:18px;width:18px}.control-slider::-moz-range-thumb{background:var(--primary);height:18px;width:18px}.red-slider::-webkit-slider-thumb{background:#ef4444;background:var(--red-channel)}.green-slider::-webkit-slider-thumb{background:#10b981;background:var(--green-channel)}.blue-slider::-webkit-slider-thumb{background:#3b82f6;background:var(--blue-channel)}.red-slider::-moz-range-thumb{background:#ef4444;background:var(--red-channel)}.green-slider::-moz-range-thumb{background:#10b981;background:var(--green-channel)}.blue-slider::-moz-range-thumb{background:#3b82f6;background:var(--blue-channel)}.image-to-grayscale.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.weight-controls{margin-bottom:20px}.weight-controls h5{color:#3498db;color:var(--primary);font-size:1rem;font-weight:600;margin:0 0 12px}.weight-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr 1fr;margin-bottom:16px}.weight-presets{display:flex;flex-wrap:wrap;gap:8px}.preset-button{font-size:.8rem;padding:6px 12px}.image-to-grayscale.dark-mode .preset-button{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.gamma-control{margin-bottom:16px}.checkbox-group{margin-bottom:12px}.image-to-grayscale.dark-mode .checkbox-group label{color:#f7fafc;color:var(--dark-text)}.individual-controls{background:#3498db0d;border:1px solid #3498db33;border-radius:12px;margin-top:20px;padding:20px}.image-to-grayscale.dark-mode .individual-controls{background:#3498db1a;border-color:#3498db4d}.individual-controls h4{color:#3498db;color:var(--primary);font-size:1rem;font-weight:600;margin:0 0 16px}.individual-settings{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr}.image-to-grayscale.dark-mode .preview-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-header{gap:12px}.preview-controls{flex-wrap:wrap}.grid-toggle,.preview-mode-toggle{font-weight:500;padding:8px 12px}.image-to-grayscale.dark-mode .grid-toggle,.image-to-grayscale.dark-mode .preview-mode-toggle{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.preview-container{min-height:300px}.image-to-grayscale.dark-mode .preview-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-comparison{grid-gap:20px;gap:20px}.preview-single{align-items:center}.preview-item h4{color:inherit;font-size:1rem;margin:0 0 12px;text-align:center}.preview-canvas-wrapper{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px dashed #e1e8ed;border:1px dashed var(--border);display:flex;justify-content:center;min-height:200px;padding:16px}.image-to-grayscale.dark-mode .preview-canvas-wrapper{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-canvas{border-radius:6px;box-shadow:0 4px 12px #00000014;max-height:300px;max-width:100%}.preview-overlay{gap:16px;justify-content:center}.overlay-container,.preview-overlay{align-items:center;display:flex;flex-direction:column}.overlay-container{gap:12px;position:relative}.overlay-canvas{cursor:crosshair}.overlay-hint{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-style:italic}.image-to-grayscale.dark-mode .overlay-hint{color:#a0aec0;color:var(--dark-text-secondary)}.conversion-stats{display:flex;justify-content:center;margin-top:12px}.stat-item{background:#6b7280;background:var(--grayscale-accent);border-radius:6px;color:#fff;font-size:.85rem;font-weight:600;gap:6px;padding:6px 12px}.stats-section{border-radius:16px}.image-to-grayscale.dark-mode .stats-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.stats-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;justify-content:center;margin:0 0 20px;text-align:center}.stats-grid{grid-gap:16px;gap:16px}.stat-card{background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px;transition:all .3s ease}.stat-card:hover{box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.image-to-grayscale.dark-mode .stat-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.stat-value{font-size:1.5rem;margin-bottom:4px}.image-to-grayscale.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.image-to-grayscale.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-to-grayscale.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.image-to-grayscale.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.image-to-grayscale.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-to-grayscale.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.image-to-grayscale{padding:24px}.individual-settings,.method-grid,.weight-grid{grid-template-columns:1fr}.basic-controls{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}@media (max-width:768px){.image-to-grayscale{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.header-section h1{font-size:1.8rem}.image-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.method-grid{grid-template-columns:1fr}.preset-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.basic-controls{grid-template-columns:1fr}.preview-header{align-items:flex-start;flex-direction:column;gap:12px}.preview-controls{justify-content:center;width:100%}.preview-comparison{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:300px;width:100%}.weight-presets{justify-content:center}}@media (max-width:480px){.image-to-grayscale{padding:16px}.header-section h1{font-size:1.6rem}.upload-section{padding:30px 20px}.image-grid,.method-grid,.preset-grid{grid-template-columns:1fr}.preview-controls{flex-direction:column;width:100%}.grid-toggle,.preview-mode-toggle{justify-content:center}.tool-card{flex-direction:column;gap:12px;text-align:center}.weight-presets{flex-direction:column;gap:8px}.preset-button{text-align:center}}.image-cropper-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px;text-align:left}.image-cropper.dark-mode .image-cropper-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.image-cropper.dark-mode .article-header{border-bottom-color:var(--dark-border)}.image-cropper.dark-mode .article-header h2{color:var(--dark-text)}.image-cropper.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.image-cropper.dark-mode .article-section h3,.image-cropper.dark-mode .article-section h4,.image-cropper.dark-mode .article-section li,.image-cropper.dark-mode .article-section p{color:var(--dark-text)}.image-cropper.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-cropper.dark-mode .benefit-card h4{color:var(--dark-text)}.image-cropper.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.image-cropper.dark-mode .concept-item{background:var(--dark-bg-light)}.image-cropper.dark-mode .concept-item p{color:var(--dark-text)}.image-cropper.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-cropper.dark-mode .practice-item h4{color:var(--dark-text)}.image-cropper.dark-mode .practice-item p{color:var(--dark-text-secondary)}.image-cropper.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-cropper.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.image-cropper.dark-mode .scenario-card li{color:var(--dark-text)}.image-cropper.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-cropper.dark-mode .tech-item h4{color:var(--dark-text)}.image-cropper.dark-mode .tech-item p{color:var(--dark-text-secondary)}.image-cropper.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.image-cropper.dark-mode .technique-item p{color:var(--dark-text)}.image-cropper.dark-mode .mistake-item{background:#e74c3c1a}.image-cropper.dark-mode .mistake-item p{color:var(--dark-text)}.image-cropper.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-cropper.dark-mode .tool-category p{color:var(--dark-text)}.image-cropper.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.image-cropper.dark-mode .quick-tips,.image-cropper.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.image-cropper.dark-mode .quick-tips li,.image-cropper.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.image-cropper-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.image-cropper-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}.png-to-jpg-converter{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.png-to-jpg-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.png-to-jpg-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .upload-section.drag-over,.png-to-jpg-converter.dark-mode .upload-section:hover{background:#1a202c;background:var(--dark-bg);border-color:#3498db;border-color:var(--primary)}.png-to-jpg-converter.dark-mode .upload-content p{color:#a0aec0;color:var(--dark-text-secondary)}.png-to-jpg-converter.dark-mode .image-thumbnail{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.image-thumbnail canvas{aspect-ratio:16/9;border-radius:8px;object-fit:cover}.png-to-jpg-converter.dark-mode .dimensions{color:#a0aec0;color:var(--dark-text-secondary)}.png-to-jpg-converter.dark-mode .conversion-controls{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.png-to-jpg-converter.dark-mode .input-group input,.png-to-jpg-converter.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.png-to-jpg-converter.dark-mode .input-group small{color:#a0aec0;color:var(--dark-text-secondary)}.quality-slider::-webkit-slider-thumb{background:#3498db;background:var(--primary)}.quality-slider::-moz-range-thumb{background:#3498db;background:var(--primary)}.png-to-jpg-converter.dark-mode .quality-indicators{color:#a0aec0;color:var(--dark-text-secondary)}.png-to-jpg-converter.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-toggle.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary)}.png-to-jpg-converter.dark-mode .preview-toggle.inactive{color:#f7fafc;color:var(--dark-text)}.png-to-jpg-converter.dark-mode .preview-section,.png-to-jpg-converter.dark-mode .preview-toggle.inactive{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-container{min-height:150px}.png-to-jpg-converter.dark-mode .preview-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-info{text-align:center}.png-to-jpg-converter.dark-mode .preview-info{color:#a0aec0;color:var(--dark-text-secondary)}.preview-info p{font-size:.9rem;line-height:1.5;margin:8px 0}.png-to-jpg-converter.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.png-to-jpg-converter.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .result-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.after img,.before img{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;height:100px;object-fit:cover;width:100%}.png-to-jpg-converter.dark-mode .after img,.png-to-jpg-converter.dark-mode .before img{border-color:#4a5568;border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .size-info{color:#a0aec0;color:var(--dark-text-secondary)}.compression-ratio .increased{color:#f39c12;color:var(--warning);font-size:.9rem;font-weight:600}.download-single{background:#3498db;background:var(--primary)}.download-single:hover{background:#2980b9;background:var(--primary-hover)}.png-to-jpg-converter.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.png-to-jpg-converter.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}.png-to-jpg-converter.dark-mode .features-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .feature-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.feature-card svg{color:#3498db;color:var(--primary)}.png-to-jpg-converter.dark-mode .feature-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.png-to-jpg-converter{padding:24px}.basic-controls,.settings-grid{grid-template-columns:1fr}}@media (max-width:768px){.png-to-jpg-converter{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.header-section h1{font-size:1.8rem}.image-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.before-after,.results-grid{grid-template-columns:1fr}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:300px;width:100%}.features-grid,.related-tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.png-to-jpg-converter{margin:12px;padding:16px}.upload-section{padding:24px 16px}.header-section h1{flex-direction:column;font-size:1.6rem;gap:8px}.image-grid{grid-template-columns:1fr}.tool-card{flex-direction:column;gap:12px;text-align:center}}.png-to-jpg-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.png-to-jpg-converter.dark-mode .png-to-jpg-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.png-to-jpg-converter.dark-mode .article-header{border-bottom-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .article-header h2{color:var(--dark-text)}.png-to-jpg-converter.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.png-to-jpg-converter.dark-mode .article-section h3,.png-to-jpg-converter.dark-mode .article-section h4,.png-to-jpg-converter.dark-mode .article-section li,.png-to-jpg-converter.dark-mode .article-section p{color:var(--dark-text)}.png-to-jpg-converter.dark-mode .format-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.format-card h4{color:var(--primary)}.png-to-jpg-converter.dark-mode .format-card li{color:var(--dark-text)}.png-to-jpg-converter.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .scenario-card li{color:var(--dark-text)}.process-steps{display:flex;flex-direction:column;gap:20px;margin:24px 0}.step-item{align-items:flex-start;background:var(--bg-light);border:1px solid var(--border);border-radius:12px;display:flex;gap:20px;padding:20px}.png-to-jpg-converter.dark-mode .step-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.step-number{align-items:center;background:var(--primary);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:1.1rem;font-weight:700;height:40px;justify-content:center;width:40px}.step-content h4{color:var(--text);font-size:1.1rem;font-weight:600;margin:0 0 8px}.png-to-jpg-converter.dark-mode .step-content h4{color:var(--dark-text)}.step-content p{color:var(--text-light);font-size:.95rem;line-height:1.5;margin:0}.png-to-jpg-converter.dark-mode .step-content p{color:var(--dark-text-secondary)}.quality-guide{display:flex;flex-direction:column;gap:20px;margin:24px 0}.quality-level{background:var(--bg-light);border-left:4px solid var(--primary);border-radius:12px;padding:20px}.png-to-jpg-converter.dark-mode .quality-level{background:var(--dark-bg-light)}.quality-level h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 12px}.quality-level p{color:var(--text);font-size:.95rem;line-height:1.6;margin:0}.png-to-jpg-converter.dark-mode .quality-level p{color:var(--dark-text)}.png-to-jpg-converter.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .practice-item h4{color:var(--dark-text)}.png-to-jpg-converter.dark-mode .practice-item p{color:var(--dark-text-secondary)}.use-cases-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.use-case-card{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000a;padding:24px;text-align:center;transition:all .3s ease}.use-case-card:hover{box-shadow:0 6px 20px #00000014;transform:translateY(-2px)}.png-to-jpg-converter.dark-mode .use-case-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.use-case-card svg{color:var(--primary);margin-bottom:12px}.use-case-card h4{color:var(--text);font-size:1.1rem;font-weight:600;margin:0 0 12px}.png-to-jpg-converter.dark-mode .use-case-card h4{color:var(--dark-text)}.use-case-card p{color:var(--text-light);font-size:.95rem;line-height:1.5;margin:0}.png-to-jpg-converter.dark-mode .use-case-card p{color:var(--dark-text-secondary)}.png-to-jpg-converter.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .tech-item h4{color:var(--dark-text)}.png-to-jpg-converter.dark-mode .tech-item p{color:var(--dark-text-secondary)}.mistake-item{align-items:flex-start;display:flex;gap:16px}.png-to-jpg-converter.dark-mode .mistake-item{background:#e74c3c1a}.mistake-item svg{color:var(--danger);flex-shrink:0;margin-top:2px}.png-to-jpg-converter.dark-mode .mistake-item p{color:var(--dark-text)}.png-to-jpg-converter.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .technique-item p{color:var(--dark-text)}.optimization-strategies{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:24px 0}.strategy-card{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000a;padding:24px}.png-to-jpg-converter.dark-mode .strategy-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.strategy-card h4{border-bottom:1px solid var(--border);color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 16px;padding-bottom:8px}.png-to-jpg-converter.dark-mode .strategy-card h4{border-bottom-color:var(--dark-border)}.strategy-card ul{margin:0;padding-left:20px}.strategy-card li{color:var(--text);font-size:.9rem;line-height:1.5;margin-bottom:8px}.png-to-jpg-converter.dark-mode .strategy-card li{color:var(--dark-text)}.compatibility-info{display:flex;flex-direction:column;gap:20px;margin:24px 0}.compatibility-item{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:20px}.png-to-jpg-converter.dark-mode .compatibility-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.compatibility-item h4{color:var(--text);font-size:1.1rem;font-weight:600;margin:0 0 12px}.png-to-jpg-converter.dark-mode .compatibility-item h4{color:var(--dark-text)}.compatibility-item p{color:var(--text-light);font-size:.95rem;line-height:1.6;margin:0}.png-to-jpg-converter.dark-mode .compatibility-item p{color:var(--dark-text-secondary)}.png-to-jpg-converter.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .quick-tips,.png-to-jpg-converter.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.png-to-jpg-converter.dark-mode .quick-tips li,.png-to-jpg-converter.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.png-to-jpg-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.format-comparison{gap:16px}.article-sidebar,.format-comparison,.optimization-strategies,.scenarios-grid,.use-cases-grid{grid-template-columns:1fr}.article-sidebar{gap:20px}.step-item{text-align:center}.practice-item,.step-item{flex-direction:column;gap:12px}.practice-item svg{align-self:center;margin-top:0}.mistake-item{flex-direction:column;gap:12px}.mistake-item svg{align-self:center;margin-top:0}.conclusion{padding:24px 20px}}@media (max-width:480px){.png-to-jpg-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.format-card,.scenario-card,.strategy-card,.use-case-card{padding:20px}.compatibility-item,.practice-item,.step-item,.tech-item,.technique-item{padding:16px}.step-number{font-size:1rem;height:32px;width:32px}}:root{--heic-primary:#007aff;--heic-secondary:#5856d6;--image-border:#e1e8ed;--conversion-bg:#f8f9fa}.heic-to-jpg-converter{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.heic-to-jpg-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.heic-to-jpg-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-section h1 svg{color:#007aff;color:var(--heic-primary)}.upload-section.drag-over,.upload-section:hover{border-color:#007aff;border-color:var(--heic-primary);box-shadow:0 8px 25px #007aff26}.heic-to-jpg-converter.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.heic-to-jpg-converter.dark-mode .upload-section.drag-over,.heic-to-jpg-converter.dark-mode .upload-section:hover{background:#1a202c;background:var(--dark-bg);border-color:#007aff;border-color:var(--heic-primary)}.upload-content svg{color:#007aff;color:var(--heic-primary)}.upload-content p{line-height:1.5}.heic-to-jpg-converter.dark-mode .upload-content p{color:#a0aec0;color:var(--dark-text-secondary)}.upload-button{background-color:#007aff;background-color:var(--heic-primary)}.upload-button:hover{background-color:#0056b3;box-shadow:0 6px 20px #007aff4d}.features-highlight{grid-gap:16px;background:linear-gradient(135deg,#007aff,#5856d6);background:linear-gradient(135deg,var(--heic-primary) 0,var(--heic-secondary) 100%);border-radius:12px;color:#fff;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px;padding:20px}.feature-item{align-items:center;color:#000;display:flex;font-size:.9rem;font-weight:600;gap:8px}.feature-item svg{color:#ffffffe6;flex-shrink:0}.heic-to-jpg-converter.dark-mode .feature-item{color:#fff}.image-selection{margin-bottom:30px}.image-selection h3{color:inherit;font-size:1.2rem;margin-bottom:16px}.image-grid{grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.image-thumbnail{position:relative}.image-thumbnail:hover{box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.heic-to-jpg-converter.dark-mode .image-thumbnail{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.heic-placeholder{align-items:center;aspect-ratio:16/9;background:linear-gradient(135deg,#007aff,#5856d6);background:linear-gradient(135deg,var(--heic-primary) 0,var(--heic-secondary) 100%);border-radius:8px;color:#fff;display:flex;flex-direction:column;gap:8px;justify-content:center}.heic-placeholder span{font-size:.9rem;font-weight:600}.filename{font-size:.9rem}.heic-to-jpg-converter.dark-mode .dimensions{color:#a0aec0;color:var(--dark-text-secondary)}.remove-image{align-items:center;background:#e74c3c;background:var(--danger);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;height:28px;justify-content:center;opacity:.8;position:absolute;right:8px;top:8px;transition:all .3s ease;width:28px}.remove-image:hover{opacity:1;transform:scale(1.1)}.conversion-controls{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.heic-to-jpg-converter.dark-mode .conversion-controls{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-toggle{border:1px solid #007aff;border:1px solid var(--heic-primary);color:#007aff;color:var(--heic-primary)}.settings-toggle:hover{background-color:#007aff1a}.basic-controls{grid-gap:24px;gap:24px;grid-template-columns:1fr 1fr}.heic-to-jpg-converter.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-group input:focus,.input-group select:focus{border-color:#007aff;border-color:var(--heic-primary);box-shadow:0 0 0 3px #007aff1a}.heic-to-jpg-converter.dark-mode .input-group input,.heic-to-jpg-converter.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-group small{color:#7f8c8d;color:var(--text-light);font-size:.8rem;margin-top:4px}.heic-to-jpg-converter.dark-mode .input-group small{color:#a0aec0;color:var(--dark-text-secondary)}.quality-slider{-webkit-appearance:none;appearance:none;background:#e1e8ed;background:var(--border);border-radius:3px;height:6px;margin:8px 0;outline:none;width:100%}.quality-slider::-webkit-slider-thumb{-webkit-appearance:none;background:#007aff;background:var(--heic-primary);border-radius:50%;box-shadow:0 2px 4px #0003;cursor:pointer;height:20px;width:20px}.quality-slider::-moz-range-thumb{background:#007aff;background:var(--heic-primary);border:none;border-radius:50%;box-shadow:0 2px 4px #0003;cursor:pointer;height:20px;width:20px}.quality-indicators{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.8rem;justify-content:space-between;margin-top:4px}.heic-to-jpg-converter.dark-mode .quality-indicators{color:#a0aec0;color:var(--dark-text-secondary)}.color-input-group input[type=color]{height:44px;padding:2px;width:50px}.heic-to-jpg-converter.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.settings-grid{grid-template-columns:1fr 1fr}.preview-toggle{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:8px;padding:8px 16px;transition:all .3s ease}.preview-toggle.active{background:#007aff;background:var(--heic-primary);border-color:#007aff;border-color:var(--heic-primary);color:#fff}.preview-toggle.inactive{background:#f8fafc;background:var(--bg-light);color:#2c3e50;color:var(--text)}.heic-to-jpg-converter.dark-mode .preview-toggle.inactive{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.conversion-progress{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px;text-align:center}.heic-to-jpg-converter.dark-mode .conversion-progress{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.conversion-progress h3{color:inherit;font-size:1.2rem;margin:0 0 16px}.progress-bar{background:#e9ecef;margin-bottom:12px}.progress-fill{background:linear-gradient(90deg,#007aff,#5856d6);background:linear-gradient(90deg,var(--heic-primary) 0,var(--heic-secondary) 100%)}.conversion-progress p{color:#7f8c8d;color:var(--text-light);font-size:.9rem;margin:0}.heic-to-jpg-converter.dark-mode .conversion-progress p{color:#a0aec0;color:var(--dark-text-secondary)}.process-button{background-color:#007aff;background-color:var(--heic-primary)}.process-button:hover:not(:disabled){background-color:#0056b3;box-shadow:0 6px 20px #007aff4d}.heic-to-jpg-converter.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.heic-to-jpg-converter.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.heic-to-jpg-converter.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.results-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.result-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);padding:20px}.result-item:hover{box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow)}.heic-to-jpg-converter.dark-mode .result-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.result-preview{margin-bottom:16px}.before-after{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr}.after,.before{position:relative;text-align:center}.heic-icon{align-items:center;aspect-ratio:16/9;background:linear-gradient(135deg,#007aff,#5856d6);background:linear-gradient(135deg,var(--heic-primary) 0,var(--heic-secondary) 100%);border-radius:8px;color:#fff;display:flex;flex-direction:column;gap:8px;justify-content:center}.heic-icon span{font-size:.8rem;font-weight:600}.after img{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;height:100px;object-fit:cover;width:100%}.heic-to-jpg-converter.dark-mode .after img{border-color:#4a5568;border-color:var(--dark-border)}.after span,.before span{background:#000c;border-radius:4px;color:#fff;font-size:.7rem;font-weight:600;padding:4px 8px;position:absolute;right:8px;top:8px}.result-info h4{color:inherit;margin:0 0 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.size-comparison{margin-bottom:16px}.size-info{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.85rem;justify-content:space-between;margin-bottom:8px}.heic-to-jpg-converter.dark-mode .size-info{color:#a0aec0;color:var(--dark-text-secondary)}.compression-ratio{text-align:center}.compression-ratio .reduced{color:#2ecc71;color:var(--success);font-size:.9rem;font-weight:600}.download-single{background:#007aff;background:var(--heic-primary);border-radius:6px;color:#fff;font-size:.9rem;padding:10px;width:100%}.download-single:hover{background:#0056b3;transform:translateY(-1px)}.heic-to-jpg-converter.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.tool-card:hover{border-color:#007aff;border-color:var(--heic-primary)}.heic-to-jpg-converter.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tool-card svg{color:#007aff;color:var(--heic-primary)}.heic-to-jpg-converter.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}.features-section{background:#f8f9fa;background:var(--conversion-bg);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:32px 24px}.heic-to-jpg-converter.dark-mode .features-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.features-section h3{color:inherit;font-size:1.4rem;margin:0 0 24px;text-align:center}.features-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.feature-card{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:24px;text-align:center;transition:all .3s ease}.feature-card:hover{box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.heic-to-jpg-converter.dark-mode .feature-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.feature-card svg{color:#007aff;color:var(--heic-primary);margin-bottom:12px}.feature-card h4{color:inherit;font-size:1.1rem;font-weight:600;margin:0 0 8px}.feature-card p{color:#7f8c8d;color:var(--text-light);font-size:.9rem;line-height:1.5;margin:0}.heic-to-jpg-converter.dark-mode .feature-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.heic-to-jpg-converter{padding:24px}.basic-controls,.settings-grid{grid-template-columns:1fr}.features-highlight{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media (max-width:768px){.heic-to-jpg-converter{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.header-section h1{font-size:1.8rem}.image-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.before-after,.results-grid{grid-template-columns:1fr}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:300px;width:100%}.features-grid,.related-tools-grid{grid-template-columns:1fr}.features-highlight{gap:12px;grid-template-columns:1fr 1fr}}@media (max-width:480px){.heic-to-jpg-converter{margin:12px;padding:16px}.upload-section{padding:24px 16px}.header-section h1{flex-direction:column;font-size:1.6rem;gap:8px}.image-grid{grid-template-columns:1fr}.tool-card{flex-direction:column;gap:12px;text-align:center}.features-highlight{gap:10px;grid-template-columns:1fr}.feature-item{justify-content:center}}.heic-to-jpg-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.heic-to-jpg-converter.dark-mode .heic-to-jpg-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.heic-to-jpg-converter.dark-mode .article-header{border-bottom-color:var(--dark-border)}.heic-to-jpg-converter.dark-mode .article-header h2{color:var(--dark-text)}.article-header h2 svg{color:var(--heic-primary)}.heic-to-jpg-converter.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.heic-to-jpg-converter.dark-mode .article-section h3,.heic-to-jpg-converter.dark-mode .article-section h4{color:var(--dark-text)}.article-section h5{color:var(--heic-primary);font-size:1rem;font-weight:600;line-height:1.4;margin:16px 0 8px}.heic-to-jpg-converter.dark-mode .article-section li,.heic-to-jpg-converter.dark-mode .article-section p{color:var(--dark-text)}.article-section strong{color:var(--heic-primary)}.format-comparison{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr;margin:24px 0}.format-card{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:24px;text-align:center}.heic-to-jpg-converter.dark-mode .format-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.format-card svg{color:var(--heic-primary);margin-bottom:12px}.format-card h4{color:var(--heic-primary);font-size:1.2rem;font-weight:600;margin:0 0 16px}.format-card ul{margin:0;padding-left:20px;text-align:left}.format-card li{color:var(--text);font-size:.95rem;line-height:1.5;margin-bottom:10px}.heic-to-jpg-converter.dark-mode .format-card li{color:var(--dark-text)}.heic-to-jpg-converter.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.scenario-card h4{color:var(--heic-primary)}.heic-to-jpg-converter.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.heic-to-jpg-converter.dark-mode .scenario-card li{color:var(--dark-text)}.conversion-methods{display:flex;flex-direction:column;gap:24px;margin:24px 0}.method-item{align-items:flex-start;background:var(--bg-light);border:1px solid var(--border);border-radius:12px;display:flex;gap:20px;padding:24px}.heic-to-jpg-converter.dark-mode .method-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.method-number{align-items:center;background:var(--heic-primary);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:1.1rem;font-weight:700;height:40px;justify-content:center;width:40px}.method-content h4{color:var(--text);font-size:1.1rem;font-weight:600;margin:0 0 12px}.heic-to-jpg-converter.dark-mode .method-content h4{color:var(--dark-text)}.method-content p{color:var(--text-light);font-size:.95rem;line-height:1.6;margin:0 0 16px}.heic-to-jpg-converter.dark-mode .method-content p{color:var(--dark-text-secondary)}.method-benefits{display:flex;flex-wrap:wrap;gap:8px}.benefit{background:#007aff1a;border-radius:4px;color:var(--heic-primary);font-size:.8rem;font-weight:500;padding:4px 8px}.benefit:first-child:contains("✗"){background:#e74c3c1a;color:var(--danger)}.heic-to-jpg-converter.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.heic-to-jpg-converter.dark-mode .practice-item h4{color:var(--dark-text)}.heic-to-jpg-converter.dark-mode .practice-item p{color:var(--dark-text-secondary)}.platform-comparison{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr;margin:24px 0}.platform-card{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000a;padding:24px}.heic-to-jpg-converter.dark-mode .platform-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.platform-card svg{color:var(--heic-primary);margin-bottom:12px}.platform-card h4{align-items:center;color:var(--heic-primary);display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin:0 0 16px}.platform-features h5{color:var(--text);font-size:1rem;font-weight:600;margin:16px 0 8px}.heic-to-jpg-converter.dark-mode .platform-features h5{color:var(--dark-text)}.platform-features ul{margin:0 0 16px;padding-left:20px}.platform-features li{color:var(--text);font-size:.9rem;line-height:1.5;margin-bottom:6px}.heic-to-jpg-converter.dark-mode .platform-features li{color:var(--dark-text)}.heic-to-jpg-converter.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.technique-item h4{color:var(--heic-primary)}.heic-to-jpg-converter.dark-mode .technique-item p{color:var(--dark-text)}.troubleshooting-list{display:flex;flex-direction:column;gap:16px;margin:24px 0}.issue-item{align-items:flex-start;background:#e74c3c0d;border-left:4px solid var(--danger);border-radius:8px;display:flex;gap:16px;padding:16px 20px}.heic-to-jpg-converter.dark-mode .issue-item{background:#e74c3c1a}.issue-item svg{color:var(--danger);flex-shrink:0;margin-top:2px}.issue-item h4{color:var(--danger);font-size:1rem;font-weight:600;margin:0 0 8px}.issue-item p{color:var(--text);font-size:.9rem;line-height:1.5;margin:0}.heic-to-jpg-converter.dark-mode .issue-item p{color:var(--dark-text)}.technical-comparison{display:flex;flex-direction:column;gap:24px;margin:24px 0}.tech-aspect{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:20px}.heic-to-jpg-converter.dark-mode .tech-aspect{background:var(--dark-bg-light);border-color:var(--dark-border)}.tech-aspect h4{border-bottom:1px solid var(--border);color:var(--heic-primary);font-size:1.1rem;font-weight:600;margin:0 0 16px;padding-bottom:8px}.heic-to-jpg-converter.dark-mode .tech-aspect h4{border-bottom-color:var(--dark-border)}.comparison-row{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr}.format-detail{background:var(--white);border:1px solid var(--border);border-radius:8px;padding:16px}.heic-to-jpg-converter.dark-mode .format-detail{background:var(--dark-bg);border-color:var(--dark-border)}.format-detail strong{color:var(--heic-primary);font-weight:600}.converter-types{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr;margin:24px 0}.converter-card{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000a;padding:24px}.heic-to-jpg-converter.dark-mode .converter-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.converter-card svg{color:var(--heic-primary);margin-bottom:12px}.converter-card h4{align-items:center;color:var(--heic-primary);display:flex;font-size:1.2rem;font-weight:600;gap:8px;margin:0 0 16px}.pros-cons{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr}.cons h5,.pros h5{font-size:1rem;font-weight:600;margin:0 0 8px}.pros h5{color:var(--success)}.cons h5{color:var(--warning)}.cons ul,.pros ul{margin:0;padding-left:16px}.cons li,.pros li{font-size:.85rem;line-height:1.4;margin-bottom:4px}.pros li{color:var(--text)}.cons li{color:var(--text-light)}.heic-to-jpg-converter.dark-mode .pros li{color:var(--dark-text)}.heic-to-jpg-converter.dark-mode .cons li{color:var(--dark-text-secondary)}.future-trends{display:flex;flex-direction:column;gap:20px;margin:24px 0}.trend-item{background:var(--bg-light);border-left:4px solid var(--heic-primary);border-radius:12px;padding:20px}.heic-to-jpg-converter.dark-mode .trend-item{background:var(--dark-bg-light)}.trend-item h4{color:var(--heic-primary);font-size:1.1rem;font-weight:600;margin:0 0 12px}.trend-item p{color:var(--text);font-size:.95rem;line-height:1.6;margin:0}.heic-to-jpg-converter.dark-mode .trend-item p{color:var(--dark-text)}.conclusion{background:linear-gradient(135deg,var(--heic-primary) 0,var(--heic-secondary) 100%)}.heic-to-jpg-converter.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.heic-to-jpg-converter.dark-mode .quick-tips,.heic-to-jpg-converter.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.quick-tips h4,.related-articles h4{color:var(--heic-primary)}.heic-to-jpg-converter.dark-mode .quick-tips li,.heic-to-jpg-converter.dark-mode .related-articles li{color:var(--dark-text)}.related-articles a{color:var(--heic-primary)}.related-articles a:hover{color:var(--heic-secondary)}@media (max-width:768px){.heic-to-jpg-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.format-comparison{gap:16px}.article-sidebar,.comparison-row,.converter-types,.format-comparison,.platform-comparison,.pros-cons,.scenarios-grid{grid-template-columns:1fr}.article-sidebar{gap:20px}.method-item{text-align:center}.method-item,.practice-item{flex-direction:column;gap:12px}.practice-item svg{align-self:center;margin-top:0}.issue-item{flex-direction:column;gap:12px}.issue-item svg{align-self:center;margin-top:0}.conclusion{padding:24px 20px}}@media (max-width:480px){.heic-to-jpg-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.converter-card,.format-card,.platform-card,.scenario-card{padding:20px}.method-item,.practice-item,.tech-aspect,.technique-item,.trend-item{padding:16px}.method-number{font-size:1rem;height:32px;width:32px}.method-benefits{flex-direction:column;gap:4px}.benefit{text-align:center}}:root{--overlay-bg:#000c;--card-radius:12px;--gap:clamp(16px,2vw,20px);--padding:clamp(16px,3vw,24px);--max-width:1400px}.watermark-adder{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;border-radius:var(--card-radius);box-shadow:0 4px 16px #1018280a;box-shadow:0 4px 16px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;margin:clamp(12px,2vw,16px) auto;max-width:1400px;max-width:var(--max-width);padding:clamp(16px,3vw,24px);padding:var(--padding);transition:all .3s ease}.watermark-adder.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 4px 16px #0000004d;box-shadow:0 4px 16px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.header-section{flex-wrap:wrap;margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap);padding-bottom:clamp(16px,2vw,20px);padding-bottom:var(--gap)}.watermark-adder.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-section h1{font-size:clamp(1.5rem,5vw,2rem);gap:8px}.dark-mode-toggle{font-size:clamp(.9rem,2.5vw,1rem);padding:10px 16px;touch-action:manipulation}.upload-section{background:#f0f8ff;background:var(--drop-zone);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:var(--card-radius);margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap);padding:clamp(20px,4vw,32px)}.upload-section.drag-over,.upload-section:hover{background:#e6f3ff;background:var(--drop-zone-active);box-shadow:0 4px 12px #3498db26}.watermark-adder.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.upload-content svg{height:clamp(32px,6vw,40px);margin-bottom:12px;width:clamp(32px,6vw,40px)}.upload-content h3{font-size:clamp(1.1rem,3vw,1.3rem)}.upload-content p{font-size:clamp(.85rem,2.5vw,.95rem);margin:0 0 16px}.upload-button{font-size:clamp(.9rem,2.5vw,1rem);touch-action:manipulation}.image-selection{margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap)}.image-selection h3{font-size:clamp(1.1rem,3vw,1.2rem);gap:8px;margin-bottom:12px}.image-grid{grid-gap:clamp(16px,2vw,20px);grid-gap:var(--gap);gap:clamp(16px,2vw,20px);gap:var(--gap);grid-template-columns:repeat(auto-fill,minmax(clamp(140px,20vw,180px),1fr))}.image-thumbnail{background:#f8fafc;background:var(--bg-light);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:12px;border-radius:var(--card-radius);display:flex;flex-direction:column;gap:8px;padding:12px}.image-thumbnail:hover{box-shadow:0 4px 12px #1018280a;box-shadow:0 4px 12px var(--shadow)}.image-thumbnail.selected{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.watermark-adder.dark-mode .image-thumbnail{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.thumbnail-info{display:flex;flex-direction:column;gap:4px}.filename{font-size:clamp(.8rem,2.5vw,.9rem)}.dimensions{color:var(--text-light);font-size:clamp(.75rem,2vw,.8rem)}.selected-badge{background:#3498db;background:var(--primary);border-radius:50%;color:#fff;color:var(--white);padding:4px;position:absolute;right:8px;top:8px}.watermark-controls{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;border-radius:var(--card-radius);margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap);padding:clamp(16px,3vw,24px);padding:var(--padding)}.watermark-adder.dark-mode .watermark-controls{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.control-header{flex-wrap:wrap;margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap)}.control-header h3{font-size:clamp(1.1rem,3vw,1.2rem)}.settings-toggle{font-size:clamp(.85rem,2.5vw,.9rem);touch-action:manipulation}.watermark-type-selector{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;border-radius:var(--card-radius);display:flex;flex-wrap:wrap;gap:12px;margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap);padding:6px}.watermark-adder.dark-mode .watermark-type-selector{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.watermark-type-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;flex:1 1;font-size:clamp(.9rem,2.5vw,.95rem);font-weight:600;gap:6px;justify-content:center;padding:10px 16px;touch-action:manipulation;transition:all .3s ease}.watermark-type-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #3498db4d;color:#fff;color:var(--white)}.watermark-type-selector button.inactive{background-color:initial;color:#2c3e50;color:var(--text)}.watermark-type-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.watermark-adder.dark-mode .watermark-type-selector button.inactive{color:#f7fafc;color:var(--dark-text)}.text-controls{display:flex;flex-direction:column;gap:clamp(16px,2vw,20px);gap:var(--gap)}.preset-texts{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.preset-button{background:#f8fafc;background:var(--bg-light);font-size:clamp(.8rem,2.5vw,.85rem);font-weight:500;touch-action:manipulation}.preset-button:hover{color:var(--white)}.watermark-adder.dark-mode .preset-button{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.settings-grid{grid-gap:clamp(16px,2vw,20px);grid-gap:var(--gap);gap:clamp(16px,2vw,20px);gap:var(--gap)}.input-group{gap:6px}.input-group label{font-size:clamp(.85rem,2.5vw,.9rem)}.input-group input,.input-group select{font-size:clamp(.9rem,2.5vw,.95rem)}.watermark-adder.dark-mode .input-group input,.watermark-adder.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.color-input-group input[type=color]{height:32px;width:40px}.checkbox-group{flex-wrap:wrap;gap:12px;grid-column:1/-1}.checkbox-group label{font-size:clamp(.85rem,2.5vw,.9rem)}.image-controls{gap:clamp(16px,2vw,20px);gap:var(--gap)}.image-controls,.upload-watermark{display:flex;flex-direction:column}.upload-watermark{align-items:center;background:#fff;background:var(--white);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;border-radius:var(--card-radius);gap:12px;padding:16px}.watermark-adder.dark-mode .upload-watermark{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-section{border-radius:var(--card-radius);margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap);padding:clamp(16px,3vw,24px);padding:var(--padding)}.watermark-adder.dark-mode .preview-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-header{flex-wrap:wrap;margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap)}.preview-header h3{font-size:clamp(1.1rem,3vw,1.2rem)}.drag-hint{align-items:center;color:#7f8c8d;color:var(--text-light);display:flex;font-size:clamp(.8rem,2.5vw,.9rem);gap:6px}.preview-container{border-radius:var(--card-radius);padding:16px}.watermark-adder.dark-mode .preview-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-wrapper{min-height:200px}.preview-image{border-radius:6px;box-shadow:0 4px 12px #00000014;box-shadow:0 4px 12px var(--preview-shadow);height:auto;max-height:60vh;max-width:100%}.processing-overlay{background:#000c;background:var(--overlay-bg);border-radius:var(--card-radius);color:var(--white);gap:12px;inset:0}.processing-overlay p{font-size:clamp(.9rem,2.5vw,1rem);font-weight:600;margin:0}.action-section{margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap)}.primary-actions,.secondary-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}button{font-size:clamp(.9rem,2.5vw,.95rem);padding:10px 20px;touch-action:manipulation}.download-button,.download-single-button,.process-button{font-size:clamp(.95rem,2.5vw,1rem);padding:12px 24px}.download-button,.download-single-button{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}.download-button:hover:not(:disabled),.download-single-button:hover:not(:disabled){background-color:#27ae60;box-shadow:0 4px 12px #2ecc714d}.secondary:hover:not(:disabled){background-color:#e1e8ed;background-color:var(--border)}.watermark-adder.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.clear-button{border-color:#e74c3c;border-color:var(--danger)}.processed-gallery{margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap)}.processed-gallery h3{align-items:center;display:flex;font-size:clamp(1.1rem,3vw,1.2rem);gap:8px;margin-bottom:12px}.processed-grid{grid-gap:clamp(16px,2vw,20px);grid-gap:var(--gap);display:grid;gap:clamp(16px,2vw,20px);gap:var(--gap);grid-template-columns:repeat(auto-fill,minmax(clamp(140px,20vw,180px),1fr))}.processed-item{background:#f8fafc;background:var(--bg-light);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:12px;border-radius:var(--card-radius);display:flex;flex-direction:column;gap:8px;padding:12px}.watermark-adder.dark-mode .processed-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.processed-thumbnail{border-radius:8px;height:120px;object-fit:cover;width:100%}.processed-info{align-items:center;display:flex;gap:8px;justify-content:space-between}.processed-name{font-size:clamp(.8rem,2.5vw,.9rem);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.processed-info button{background:#0000;border:none;color:#3498db;color:var(--primary);padding:6px}.related-tools-section{margin-bottom:clamp(16px,2vw,20px);margin-bottom:var(--gap);padding-top:clamp(16px,2vw,20px);padding-top:var(--gap)}.watermark-adder.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.related-tools-section h3{font-size:clamp(1.1rem,3vw,1.3rem);margin-bottom:16px}.related-tools-grid{grid-gap:clamp(16px,2vw,20px);grid-gap:var(--gap);gap:clamp(16px,2vw,20px);gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(clamp(200px,25vw,250px),1fr))}.tool-card{border-radius:var(--card-radius)}.tool-card:hover{box-shadow:0 4px 12px #1018280a;box-shadow:0 4px 12px var(--shadow)}.watermark-adder.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tool-card svg{height:clamp(20px,4vw,24px);width:clamp(20px,4vw,24px)}.tool-card h4{font-size:clamp(.95rem,2.5vw,1rem)}.tool-card p{font-size:clamp(.8rem,2.5vw,.85rem)}.watermark-adder.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}.notification{align-items:center;animation:fadeIn .3s ease;border-radius:8px;display:flex;font-size:clamp(.9rem,2.5vw,.95rem);font-weight:600;gap:8px;padding:12px 20px;position:fixed;right:20px;top:20px;z-index:1000}.notification.success{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}.notification.error{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white)}@media (max-width:1024px){.watermark-adder{max-width:90%}.settings-grid{grid-template-columns:1fr}.watermark-type-selector{flex-direction:column}.image-grid,.processed-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}@media (max-width:768px){.watermark-adder{margin:8px;padding:12px}.header-section{flex-direction:column;gap:12px;text-align:center}.checkbox-group{align-items:flex-start;flex-direction:column}.primary-actions,.secondary-actions{align-items:stretch;flex-direction:column}.download-button,.download-single-button,.process-button{width:100%}.preview-image{max-height:50vh}.related-tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.watermark-adder{padding:8px}.upload-section{padding:16px}.preset-texts{align-items:stretch;flex-direction:column}.preset-button{width:100%}.image-grid,.processed-grid{grid-template-columns:1fr}.preview-container{padding:12px}.notification{left:10px;right:10px;top:10px}}@media (pointer:coarse){.preset-button,.settings-toggle,.upload-button,button{font-size:clamp(1rem,3vw,1.1rem);padding:12px 20px}.preview-container{touch-action:pan-x pan-y}.image-thumbnail,.processed-item{padding:10px}}.watermark-adder-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.watermark-adder.dark-mode .watermark-adder-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.watermark-adder.dark-mode .article-header{border-bottom-color:var(--dark-border)}.watermark-adder.dark-mode .article-header h2{color:var(--dark-text)}.watermark-adder.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.watermark-adder.dark-mode .article-section h3,.watermark-adder.dark-mode .article-section h4,.watermark-adder.dark-mode .article-section li,.watermark-adder.dark-mode .article-section p{color:var(--dark-text)}.watermark-adder.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.watermark-adder.dark-mode .benefit-card h4{color:var(--dark-text)}.watermark-adder.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.watermark-adder.dark-mode .concept-item{background:var(--dark-bg-light)}.watermark-adder.dark-mode .concept-item p{color:var(--dark-text)}.watermark-adder.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.watermark-adder.dark-mode .practice-item h4{color:var(--dark-text)}.watermark-adder.dark-mode .practice-item p{color:var(--dark-text-secondary)}.watermark-adder.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.watermark-adder.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.watermark-adder.dark-mode .scenario-card li{color:var(--dark-text)}.watermark-adder.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.watermark-adder.dark-mode .tech-item h4{color:var(--dark-text)}.watermark-adder.dark-mode .tech-item p{color:var(--dark-text-secondary)}.watermark-adder.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.watermark-adder.dark-mode .technique-item p{color:var(--dark-text)}.watermark-adder.dark-mode .mistake-item{background:#e74c3c1a}.watermark-adder.dark-mode .mistake-item p{color:var(--dark-text)}.watermark-adder.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.watermark-adder.dark-mode .quick-tips,.watermark-adder.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.watermark-adder.dark-mode .quick-tips li,.watermark-adder.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.watermark-adder-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.watermark-adder-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}.color-picker{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.color-picker.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.color-picker.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.tabs-section{margin-bottom:30px}.tabs{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;gap:8px}.color-picker.dark-mode .tabs{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.tabs button{align-items:center;background:#0000;border:none;border-bottom:3px solid #0000;color:#7f8c8d;color:var(--text-light);cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;padding:12px 20px;transition:all .3s ease}.color-picker.dark-mode .tabs button{color:#a0aec0;color:var(--dark-text-secondary)}.tabs button.active{border-bottom-color:#3498db;border-bottom-color:var(--primary)}.color-picker.dark-mode .tabs button.active,.tabs button.active,.tabs button:hover:not(.active){color:#3498db;color:var(--primary)}.picker-controls,.picker-section{margin-bottom:30px}.picker-controls{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr}.color-picker.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.color-input-group{align-items:center;gap:12px}.color-input-group input[type=color]{border:none;border-radius:8px;height:60px;padding:0;width:60px}.color-input-group input[type=text]{border-radius:8px;color:#2c3e50;color:var(--text);flex:1 1;font-family:inherit;font-size:.95rem;outline:none;padding:12px 14px;transition:all .3s ease}.color-input-group input[type=text]:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.color-picker.dark-mode .color-input-group input[type=text]{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-group select{background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:inherit;font-size:.95rem;outline:none;padding:12px 14px;transition:all .3s ease}.input-group select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.color-picker.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.color-display{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;gap:24px;grid-column:1/-1;padding:24px}.color-picker.dark-mode .color-display{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.color-preview{border-radius:8px;box-shadow:0 4px 12px #0000001a;flex-shrink:0;height:100px;width:100px}.color-values{display:flex;flex:1 1;flex-direction:column;gap:12px}.color-value{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;display:flex;gap:12px;padding:8px 12px}.color-picker.dark-mode .color-value{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.color-value span:first-child{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:600;width:40px}.color-picker.dark-mode .color-value span:first-child{color:#a0aec0;color:var(--dark-text-secondary)}.color-value span:last-child{flex:1 1;font-family:Fira Code,monospace;font-size:.9rem}.color-value button{background:#0000;border:none;border-radius:4px;color:#7f8c8d;color:var(--text-light);cursor:pointer;padding:6px;transition:all .2s ease}.color-value button:hover{background:#f8fafc;background:var(--bg-light);color:#3498db;color:var(--primary)}.color-picker.dark-mode .color-value button:hover{background:#2d3748;background:var(--dark-bg-light)}.color-history{margin-bottom:30px}.color-history h3{color:inherit;font-size:1.2rem;margin-bottom:16px}.history-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.history-swatch{align-items:flex-end;border-radius:8px;box-shadow:0 2px 8px #0000001a;cursor:pointer;display:flex;height:80px;overflow:hidden;padding:8px;position:relative;transition:all .3s ease}.history-swatch:hover{box-shadow:0 6px 16px #00000026;transform:translateY(-2px)}.history-swatch span{background:#ffffffe6;border-radius:4px;color:#2c3e50;color:var(--text);font-size:.75rem;font-weight:600;padding:2px 6px}.empty-state{color:#7f8c8d;color:var(--text-light);font-style:italic;grid-column:1/-1;padding:40px;text-align:center}.color-picker.dark-mode .empty-state{color:#a0aec0;color:var(--dark-text-secondary)}.harmonies-section,.harmony-controls{margin-bottom:30px}.harmony-controls{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr}.harmony-palette{margin-bottom:24px}.harmony-palette h3{color:inherit;font-size:1.2rem;margin-bottom:16px}.palette-grid{grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.palette-color{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;gap:12px;padding:16px;transition:all .3s ease}.color-picker.dark-mode .palette-color{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.palette-color.main{background:#fff;background:var(--white);border:2px solid #3498db;border:2px solid var(--primary)}.color-picker.dark-mode .palette-color.main{background:#1a202c;background:var(--dark-bg)}.palette-color:hover{box-shadow:0 6px 16px #0000001a;transform:translateY(-2px)}.color-swatch{border-radius:8px;box-shadow:0 2px 8px #0000001a;height:80px}.color-info{display:flex;flex-direction:column;gap:4px}.color-name{color:#2c3e50;color:var(--text);font-size:.9rem;font-weight:600}.color-picker.dark-mode .color-name{color:#f7fafc;color:var(--dark-text)}.color-value{color:#7f8c8d;color:var(--text-light);font-family:Fira Code,monospace;font-size:.85rem}.color-picker.dark-mode .color-value{color:#a0aec0;color:var(--dark-text-secondary)}.copy-button{align-self:flex-start;border:1px solid #e1e8ed;border:1px solid var(--border);color:#7f8c8d;color:var(--text-light);padding:6px;transition:all .2s ease}.copy-button:hover{background:var(--primary);border-color:#3498db;border-color:var(--primary)}.save-palette{text-align:center}.contrast-section{margin-bottom:30px}.contrast-controls{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr;margin-bottom:30px}.contrast-preview{grid-gap:30px;display:grid;gap:30px;grid-template-columns:1fr 1fr}.contrast-example{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;gap:16px;padding:24px}.color-picker.dark-mode .contrast-example{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.contrast-example h4{font-size:1.5rem;margin:0}.contrast-example p{line-height:1.6;margin:0}.contrast-example button{align-self:flex-start;border:none;border-radius:6px;cursor:pointer;font-weight:600;padding:8px 16px}.contrast-results{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:24px}.color-picker.dark-mode .contrast-results{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.contrast-results h3{color:inherit;font-size:1.3rem;margin:0 0 16px;text-align:center}.contrast-score{border-radius:20px;font-weight:700;margin-bottom:20px;padding:8px 16px;text-align:center}.contrast-score.aa,.contrast-score.aaa{background:#2ecc71;background:var(--success);color:#fff}.contrast-score.aa-large{background:#f39c12;background:var(--warning);color:#fff}.contrast-score.fail{background:#e74c3c;background:var(--danger);color:#fff}.contrast-guidelines h4{color:inherit;font-size:1rem;margin:0 0 12px}.contrast-guidelines ul{list-style:none;margin:0;padding:0}.contrast-guidelines li{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:8px 0}.color-picker.dark-mode .contrast-guidelines li{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.contrast-guidelines li:last-child{border-bottom:none}.contrast-guidelines li.pass:before{color:#2ecc71;color:var(--success);content:"✓";margin-right:8px}.contrast-guidelines li.fail:before{color:#e74c3c;color:var(--danger);content:"✗";margin-right:8px}.image-section{margin-bottom:30px}.upload-section:hover{background:#fff;background:var(--white);box-shadow:0 8px 25px #3498db26}.color-picker.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.color-picker.dark-mode .upload-section:hover{background:#1a202c;background:var(--dark-bg)}.extracted-colors{margin-top:30px}.extracted-colors h3{color:inherit;font-size:1.2rem;margin-bottom:16px}.colors-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.extracted-color{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;cursor:pointer;padding:16px;transition:all .3s ease}.color-picker.dark-mode .extracted-color{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.extracted-color:hover{box-shadow:0 6px 16px #0000001a;transform:translateY(-2px)}.extracted-color .color-swatch{border-radius:8px;box-shadow:0 2px 8px #0000001a;height:60px;margin-bottom:12px}.extracted-color .color-info{align-items:center;display:flex;justify-content:space-between}.extracted-color .color-info span{font-family:Fira Code,monospace;font-size:.85rem;font-weight:600}.extracted-color .color-info button{background:#0000;border:none;border-radius:4px;color:#7f8c8d;color:var(--text-light);cursor:pointer;padding:4px;transition:all .2s ease}.extracted-color .color-info button:hover{background:#3498db;background:var(--primary);color:#fff}.process-button:hover{background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}.color-picker.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.color-picker.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.color-picker.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.color-picker.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.color-picker.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.color-picker{padding:24px}.contrast-controls,.contrast-preview,.harmony-controls,.picker-controls{grid-template-columns:1fr}.contrast-preview{gap:20px}}@media (max-width:768px){.color-picker{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.tabs{flex-wrap:wrap}.tabs button{flex:1 1;min-width:120px}.color-display{flex-direction:column}.color-preview{height:120px;width:100%}.primary-actions{align-items:center;flex-direction:column}.primary-actions button{max-width:300px;width:100%}}.color-picker-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;box-sizing:border-box;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.color-picker.dark-mode .color-picker-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.color-picker.dark-mode .article-header{border-bottom-color:var(--dark-border)}.color-picker.dark-mode .article-header h2{color:var(--dark-text)}.color-picker.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.color-picker.dark-mode .article-section h3,.color-picker.dark-mode .article-section h4,.color-picker.dark-mode .article-section li,.color-picker.dark-mode .article-section p{color:var(--dark-text)}.benefits-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.color-picker.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.color-picker.dark-mode .benefit-card h4{color:var(--dark-text)}.color-picker.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.color-picker.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.color-picker.dark-mode .practice-item h4{color:var(--dark-text)}.color-picker.dark-mode .practice-item p{color:var(--dark-text-secondary)}.color-picker.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.color-picker.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.color-picker.dark-mode .scenario-card li{color:var(--dark-text)}.color-picker.dark-mode .concept-item{background:var(--dark-bg-light)}.color-picker.dark-mode .concept-item p{color:var(--dark-text)}.color-picker.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.color-picker.dark-mode .technique-item p{color:var(--dark-text)}.color-picker.dark-mode .mistake-item{background:#e74c3c1a}.color-picker.dark-mode .mistake-item p{color:var(--dark-text)}.color-picker.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.color-picker.dark-mode .tool-category p{color:var(--dark-text)}.color-picker.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.color-picker.dark-mode .quick-tips,.color-picker.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.color-picker.dark-mode .quick-tips li,.color-picker.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.color-picker-article{margin:20px auto;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.color-picker-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}:root{--canvas-border:#e1e8ed;--pixel-hover:#3498db33;--tool-active:#3498db;--tool-inactive:#ecf0f1}.pixel-art-generator{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.pixel-art-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.pixel-art-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.tools-section{grid-gap:30px;display:grid;gap:30px;grid-template-columns:1fr 1fr;margin-bottom:30px}.tool-group{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;padding:24px}.pixel-art-generator.dark-mode .tool-group{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tool-group h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 20px}.tool-group h3 svg{color:#3498db;color:var(--primary)}.tool-buttons{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.tool-button{align-items:center;background:#fff;background:var(--white);border:2px solid #0000;border-radius:10px;cursor:pointer;display:flex;flex-direction:column;font-size:.85rem;font-weight:600;gap:6px;outline:none;padding:12px 16px;transition:all .3s ease}.tool-button.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.tool-button.inactive{background:#fff;background:var(--white);border-color:#e1e8ed;border-color:var(--border);color:#2c3e50;color:var(--text)}.tool-button.inactive:hover{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-2px)}.pixel-art-generator.dark-mode .tool-button.inactive{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.color-controls{display:flex;flex-direction:column;gap:20px}.current-color-display{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;display:flex;gap:12px;padding:12px}.pixel-art-generator.dark-mode .current-color-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.color-picker{border:none;border-radius:8px;cursor:pointer;height:40px;outline:none;width:50px}.color-value{font-family:Monaco,Menlo,monospace;font-size:.9rem;font-weight:600;text-transform:uppercase}.recent-colors{display:flex;flex-wrap:wrap;gap:8px}.color-swatch{border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:6px;cursor:pointer;height:32px;outline:none;transition:all .3s ease;width:32px}.color-swatch:hover{box-shadow:0 4px 12px #0003;transform:scale(1.1)}.pixel-art-generator.dark-mode .color-swatch{border-color:#4a5568;border-color:var(--dark-border)}.minecraft-palette h4{color:#3498db;color:var(--primary);font-size:1rem;font-weight:600;margin:0 0 12px}.palette-grid{grid-gap:4px;display:grid;gap:4px;grid-template-columns:repeat(12,1fr)}.canvas-settings{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.pixel-art-generator.dark-mode .canvas-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-group{margin-bottom:24px}.settings-group:last-child{margin-bottom:0}.settings-group h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 16px}.settings-group h3 svg{color:#3498db;color:var(--primary)}.settings-grid{align-items:end}.pixel-art-generator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-group input,.input-group select{font-size:.95rem;padding:12px 14px}.pixel-art-generator.dark-mode .input-group input,.pixel-art-generator.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-group input[type=range]::-webkit-slider-thumb{height:18px;width:18px}.input-group input[type=range]::-moz-range-thumb{height:18px;width:18px}.view-controls{flex-wrap:wrap;gap:20px}.toggle-button,.view-controls{align-items:center;display:flex}.toggle-button{background:#fff;background:var(--white);border:2px solid #0000;border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:600;gap:6px;outline:none;padding:10px 16px;transition:all .3s ease}.toggle-button.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.toggle-button.inactive{background:#fff;background:var(--white);border-color:#e1e8ed;border-color:var(--border);color:#2c3e50;color:var(--text)}.toggle-button.inactive:hover{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.pixel-art-generator.dark-mode .toggle-button.inactive{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.zoom-controls{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;gap:12px;padding:8px 12px}.pixel-art-generator.dark-mode .zoom-controls{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.zoom-controls button{align-items:center;background:#0000;border:none;border-radius:4px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;padding:6px;transition:all .3s ease}.zoom-controls button:hover{background:#f8fafc;background:var(--bg-light)}.pixel-art-generator.dark-mode .zoom-controls button{color:#f7fafc;color:var(--dark-text)}.pixel-art-generator.dark-mode .zoom-controls button:hover{background:#2d3748;background:var(--dark-bg-light)}.zoom-controls span{font-weight:600;min-width:50px;text-align:center}.upload-section{border:1px solid #e1e8ed;border:1px solid var(--border);padding:24px}.pixel-art-generator.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.upload-section h3{align-items:center;display:flex;gap:8px;margin:0 0 20px}.upload-section h3 svg{color:#3498db;color:var(--primary)}.upload-controls{align-items:end;display:flex;flex-wrap:wrap;gap:20px}.upload-button{padding:14px 24px}.canvas-section{margin-bottom:30px}.pixel-art-generator.dark-mode .canvas-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.canvas-header{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);padding-bottom:16px}.pixel-art-generator.dark-mode .canvas-header{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.canvas-info{align-items:center;color:#3498db;color:var(--primary);font-weight:600}.canvas-actions,.canvas-info{display:flex;gap:8px}.canvas-actions button{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;cursor:pointer;display:flex;font-size:.85rem;font-weight:500;gap:6px;outline:none;padding:8px 12px;transition:all .3s ease}.canvas-actions button:hover:not(:disabled){background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.canvas-actions button:disabled{cursor:not-allowed;opacity:.5}.pixel-art-generator.dark-mode .canvas-actions button{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.clear-button:hover:not(:disabled){background-color:#c0392b!important}.canvas-container{align-items:center;background:#fff;background:var(--white);border:1px dashed #e1e8ed;border:1px dashed var(--border);border-radius:12px;display:flex;justify-content:center;min-height:400px;overflow:auto;padding:20px}.pixel-art-generator.dark-mode .canvas-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.pixel-canvas{border-radius:8px;box-shadow:0 4px 12px #0000001a;cursor:crosshair;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.advanced-features{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.pixel-art-generator.dark-mode .advanced-features{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.feature-group h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 20px}.feature-group h3 svg{color:#3498db;color:var(--primary)}.feature-controls{grid-gap:20px;align-items:end;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.pixel-art-generator.dark-mode .export-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.export-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 20px}.export-section h3 svg{color:#3498db;color:var(--primary)}.export-controls,.export-options{justify-content:center}.export-options{display:flex;flex-wrap:wrap;gap:12px}.export-button{align-items:center;background-color:#2ecc71;background-color:var(--success);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;font-weight:600;gap:8px;outline:none;padding:12px 20px;transition:all .3s ease}.export-button:hover{background-color:#27ae60;box-shadow:0 6px 20px #2ecc714d;transform:translateY(-2px)}@media (max-width:1024px){.pixel-art-generator{padding:24px}.feature-controls,.settings-grid,.tools-section{grid-template-columns:1fr}}@media (max-width:768px){.pixel-art-generator{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.tool-buttons{grid-template-columns:repeat(2,1fr)}.palette-grid{grid-template-columns:repeat(8,1fr)}.canvas-header{align-items:stretch;flex-direction:column;gap:12px}.canvas-actions{justify-content:center}.upload-controls{align-items:stretch;flex-direction:column}.export-options{align-items:center;flex-direction:column}.export-button{justify-content:center;max-width:300px;width:100%}}@media (max-width:480px){.pixel-art-generator{padding:16px}.header-section h1{font-size:1.8rem}.tool-buttons{grid-template-columns:1fr}.tool-button{flex-direction:row;justify-content:flex-start}.palette-grid{grid-template-columns:repeat(6,1fr)}.canvas-container{min-height:300px;padding:12px}.view-controls{align-items:stretch;flex-direction:column}}.secondary{background-color:#f8fafc!important;background-color:var(--bg-light)!important;border:1px solid #e1e8ed!important;border:1px solid var(--border)!important;color:#2c3e50!important;color:var(--text)!important}.secondary:hover{background-color:#e1e8ed!important;background-color:var(--border)!important}.pixel-art-generator.dark-mode .secondary{background-color:#2d3748!important;background-color:var(--dark-bg-light)!important;border-color:#4a5568!important;border-color:var(--dark-border)!important;color:#f7fafc!important;color:var(--dark-text)!important}.pixel-art-generator.dark-mode .secondary:hover{background-color:#4a5568!important;background-color:var(--dark-border)!important}.fade-in{animation:fadeIn .3s ease-out}.pixel-art-generator-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.pixel-art-generator.dark-mode .pixel-art-generator-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.pixel-art-generator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.pixel-art-generator.dark-mode .article-header h2{color:var(--dark-text)}.pixel-art-generator.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.pixel-art-generator.dark-mode .article-section h3,.pixel-art-generator.dark-mode .article-section h4,.pixel-art-generator.dark-mode .article-section li,.pixel-art-generator.dark-mode .article-section p{color:var(--dark-text)}.pixel-art-generator.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.pixel-art-generator.dark-mode .benefit-card h4{color:var(--dark-text)}.pixel-art-generator.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.pixel-art-generator.dark-mode .concept-item{background:var(--dark-bg-light)}.pixel-art-generator.dark-mode .concept-item p{color:var(--dark-text)}.pixel-art-generator.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.pixel-art-generator.dark-mode .practice-item h4{color:var(--dark-text)}.pixel-art-generator.dark-mode .practice-item p{color:var(--dark-text-secondary)}.pixel-art-generator.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.pixel-art-generator.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.pixel-art-generator.dark-mode .scenario-card li{color:var(--dark-text)}.pixel-art-generator.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.pixel-art-generator.dark-mode .tech-item h4{color:var(--dark-text)}.pixel-art-generator.dark-mode .tech-item p{color:var(--dark-text-secondary)}.pixel-art-generator.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.pixel-art-generator.dark-mode .technique-item p{color:var(--dark-text)}.pixel-art-generator.dark-mode .mistake-item{background:#e74c3c1a}.pixel-art-generator.dark-mode .mistake-item p{color:var(--dark-text)}.pixel-art-generator.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.pixel-art-generator.dark-mode .tool-category p{color:var(--dark-text)}.pixel-art-generator.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.pixel-art-generator.dark-mode .quick-tips,.pixel-art-generator.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.pixel-art-generator.dark-mode .quick-tips li,.pixel-art-generator.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.pixel-art-generator-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}@media (max-width:480px){.pixel-art-generator-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.quick-tips h4,.related-articles h4{align-items:flex-start;flex-direction:column;gap:4px}}.benefit-card:nth-child(odd){animation:fadeInLeft .6s ease-out}.benefit-card:nth-child(2n){animation:fadeInRight .6s ease-out}@keyframes fadeInLeft{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.benefit-card:focus,.related-articles a:focus,.scenario-card:focus,.tool-category:focus{outline:2px solid var(--primary);outline-offset:2px}.related-articles a:focus{border-radius:2px}@media print{.pixel-art-generator-article{background:#fff;border:1px solid #ccc;box-shadow:none;color:#000}.conclusion{background:#f0f0f0;color:#000}.article-header h2 svg,.quick-tips h4 svg,.related-articles h4 svg{display:none}}:root{--ascii-bg:#000;--ascii-text:#0f0;--output-bg:#fafbfc;--output-border:#e1e8ed}.ascii-art-generator{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.ascii-art-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.ascii-art-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.input-section{border-radius:16px;padding:24px}.ascii-art-generator.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-mode-selector{grid-gap:12px;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr;margin-bottom:24px;padding:6px}.ascii-art-generator.dark-mode .input-mode-selector{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.input-mode-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:12px 16px;transition:all .3s ease}.input-mode-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #3498db4d;color:#fff;transform:translateY(-1px)}.input-mode-selector button.inactive{background-color:initial;border-color:#0000;color:#2c3e50;color:var(--text)}.input-mode-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.ascii-art-generator.dark-mode .input-mode-selector button.inactive{color:#f7fafc;color:var(--dark-text)}.text-input-container{display:flex;flex-direction:column;gap:12px}.text-input-container label{color:#2c3e50;color:var(--text);font-size:1rem;font-weight:600}.ascii-art-generator.dark-mode .text-input-container label{color:#f7fafc;color:var(--dark-text)}.text-input-container textarea{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.95rem;min-height:120px;outline:none;padding:16px;resize:vertical;transition:all .3s ease}.text-input-container textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.ascii-art-generator.dark-mode .text-input-container textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.image-input-container{display:flex;justify-content:center}.upload-section{align-items:center;background:#fff;background:var(--white);display:flex;flex-direction:column;width:100%}.upload-section:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary);transform:translateY(-2px)}.ascii-art-generator.dark-mode .upload-section{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.ascii-art-generator.dark-mode .upload-section:hover{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.upload-section svg{color:#3498db;color:var(--primary);margin-bottom:16px}.upload-section h3{color:inherit;font-size:1.2rem;margin:0 0 8px}.upload-section p{color:#7f8c8d;color:var(--text-light);font-size:.9rem;margin:0 0 24px}.ascii-art-generator.dark-mode .upload-section p{color:#a0aec0;color:var(--dark-text-secondary)}.upload-button{font-size:.95rem;padding:12px 24px}.settings-section{border-radius:16px;padding:24px}.ascii-art-generator.dark-mode .settings-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.control-header{margin-bottom:24px}.control-header h3 svg{color:#3498db;color:var(--primary)}.settings-toggle{background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);color:#2c3e50;color:var(--text)}.settings-toggle:hover{border-color:#3498db;border-color:var(--primary)}.ascii-art-generator.dark-mode .settings-toggle{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.input-group label{font-size:.9rem}.ascii-art-generator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-group input,.input-group select{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:.9rem;outline:none;padding:10px 12px;transition:all .3s ease}.input-group input:focus,.input-group select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.ascii-art-generator.dark-mode .input-group input,.ascii-art-generator.dark-mode .input-group select{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.ascii-art-generator.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.settings-grid{grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.brightness-slider,.contrast-slider{-webkit-appearance:none;appearance:none;background:#e1e8ed;background:var(--border);border-radius:3px;height:6px;outline:none;width:100%}.brightness-slider::-webkit-slider-thumb,.contrast-slider::-webkit-slider-thumb{-webkit-appearance:none;background:#3498db;background:var(--primary);border-radius:50%;cursor:pointer;height:18px;width:18px}.brightness-slider::-moz-range-thumb,.contrast-slider::-moz-range-thumb{background:#3498db;background:var(--primary);border:none;border-radius:50%;cursor:pointer;height:18px;width:18px}.checkbox-group label{color:#2c3e50;color:var(--text)}.ascii-art-generator.dark-mode .checkbox-group label{color:#f7fafc;color:var(--dark-text)}.checkbox-group input[type=checkbox]{accent-color:var(--primary)}.action-section{align-items:center;display:flex;flex-direction:column;gap:16px}.generate-button{background-color:#3498db;background-color:var(--primary);border-radius:10px;color:var(--white);font-weight:700;gap:10px;outline:none;padding:16px 32px}.generate-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 6px 20px #3498db4d}.generate-button:disabled{opacity:.6}.secondary{border-radius:8px;font-size:.9rem;font-weight:500;gap:6px;padding:10px 16px}.ascii-art-generator.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.ascii-art-generator.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.results-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;padding:24px}.ascii-art-generator.dark-mode .results-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.results-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 20px}.results-section h3 svg{color:#3498db;color:var(--primary)}.results-container{grid-gap:24px;gap:24px;grid-template-columns:300px 1fr}.ascii-previews{display:flex;flex-direction:column;gap:12px;max-height:500px;overflow-y:auto}.ascii-preview{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:10px;cursor:pointer;padding:16px;transition:all .3s ease}.ascii-preview:hover{transform:translateY(-1px)}.ascii-preview.selected,.ascii-preview:hover{border-color:#3498db;border-color:var(--primary)}.ascii-preview.selected{background:#3498db0d}.ascii-art-generator.dark-mode .ascii-preview{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.ascii-art-generator.dark-mode .ascii-preview.selected{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.preview-content{margin-bottom:12px}.preview-content pre{color:inherit;font-family:Courier New,monospace;font-size:10px;line-height:1;margin:0;overflow:hidden}.preview-info{align-items:center;color:#7f8c8d;color:var(--text-light);display:flex;font-size:.8rem;justify-content:space-between}.ascii-art-generator.dark-mode .preview-info{color:#a0aec0;color:var(--dark-text-secondary)}.preview-type{background:#3498db;background:var(--primary);border-radius:4px;color:#fff;font-weight:500;padding:2px 8px}.ascii-detail{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;overflow:hidden}.ascii-art-generator.dark-mode .ascii-detail{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.detail-header{align-items:center;border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:20px}.ascii-art-generator.dark-mode .detail-header{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.detail-header h4{color:inherit;font-size:1.1rem;margin:0}.detail-actions{display:flex;gap:8px}.ascii-output{background:#000;background:var(--ascii-bg);max-height:400px;overflow:auto;padding:20px}.ascii-output pre{color:#0f0;color:var(--ascii-text);font-family:Courier New,monospace;font-size:12px;line-height:1;margin:0;white-space:pre}.output-info{border-top:1px solid #e1e8ed;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:24px;padding:16px 20px}.ascii-art-generator.dark-mode .output-info{border-top-color:#4a5568;border-top-color:var(--dark-border)}.ascii-art-generator.dark-mode .info-label{color:#a0aec0;color:var(--dark-text-secondary)}.info-value{color:#2c3e50;color:var(--text);font-size:.9rem}.ascii-art-generator.dark-mode .info-value{color:#f7fafc;color:var(--dark-text)}.ascii-art-generator.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.ascii-art-generator.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.ascii-art-generator.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.ascii-art-generator{padding:24px}.basic-controls,.results-container,.settings-grid{grid-template-columns:1fr}}@media (max-width:768px){.ascii-art-generator{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.input-mode-selector{grid-template-columns:1fr}.control-header{flex-direction:column;gap:12px}.action-section,.control-header{align-items:stretch}.generate-button{width:100%}.generate-button,.secondary-actions{justify-content:center}.related-tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.ascii-art-generator{padding:16px}.header-section h1{font-size:1.8rem}.upload-section{padding:24px}.detail-header{align-items:stretch;flex-direction:column;gap:12px}.detail-actions{justify-content:center}.output-info{flex-direction:column;gap:12px}}.ascii-art-generator-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.ascii-art-generator.dark-mode .ascii-art-generator-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.ascii-art-generator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.ascii-art-generator.dark-mode .article-header h2{color:var(--dark-text)}.ascii-art-generator.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.ascii-art-generator.dark-mode .article-section h3,.ascii-art-generator.dark-mode .article-section h4,.ascii-art-generator.dark-mode .article-section li,.ascii-art-generator.dark-mode .article-section p{color:var(--dark-text)}.ascii-art-generator.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.ascii-art-generator.dark-mode .benefit-card h4{color:var(--dark-text)}.ascii-art-generator.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.ascii-art-generator.dark-mode .concept-item{background:var(--dark-bg-light)}.ascii-art-generator.dark-mode .concept-item p{color:var(--dark-text)}.ascii-art-generator.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.ascii-art-generator.dark-mode .practice-item h4{color:var(--dark-text)}.ascii-art-generator.dark-mode .practice-item p{color:var(--dark-text-secondary)}.ascii-art-generator.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.ascii-art-generator.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.ascii-art-generator.dark-mode .scenario-card li{color:var(--dark-text)}.ascii-art-generator.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.ascii-art-generator.dark-mode .tech-item h4{color:var(--dark-text)}.ascii-art-generator.dark-mode .tech-item p{color:var(--dark-text-secondary)}.ascii-art-generator.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.ascii-art-generator.dark-mode .technique-item p{color:var(--dark-text)}.ascii-art-generator.dark-mode .mistake-item{background:#e74c3c1a}.ascii-art-generator.dark-mode .mistake-item p{color:var(--dark-text)}.ascii-art-generator.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.ascii-art-generator.dark-mode .tool-category p{color:var(--dark-text)}.ascii-art-generator.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.ascii-art-generator.dark-mode .quick-tips,.ascii-art-generator.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.ascii-art-generator.dark-mode .quick-tips li,.ascii-art-generator.dark-mode .related-articles li{color:var(--dark-text)}.ascii-example{background:#000;border-radius:8px;color:#0f0;font-family:Courier New,monospace;font-size:12px;line-height:1;margin:16px 0;overflow-x:auto;padding:16px;white-space:pre}.ascii-art-generator.dark-mode .ascii-example{background:#0a0a0a;color:#00ff41;text-shadow:0 0 3px #00ff41}@media (max-width:768px){.ascii-art-generator-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}@media (max-width:480px){.ascii-art-generator-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.ascii-example{font-size:10px;padding:12px}}@media print{.ascii-art-generator-article{background:#fff;border:1px solid #ccc;box-shadow:none;color:#000}.conclusion{background:#f0f0f0;color:#000}.article-header h2 svg,.quick-tips h4 svg,.related-articles h4 svg{display:none}.ascii-example{background:#fff;border:1px solid #ccc;color:#000}}:root{--qr-border:#e1e8ed}.qr-generator{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.qr-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.qr-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.data-type-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.qr-generator.dark-mode .data-type-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.data-type-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 20px}.data-type-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.data-type-button{align-items:center;border:2px solid #0000;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;min-height:80px;outline:none;padding:16px 20px;text-align:center;transition:all .3s ease}.data-type-button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.data-type-button.inactive{background-color:#fff;background-color:var(--white);border-color:#e1e8ed;border-color:var(--border);color:#2c3e50;color:var(--text)}.data-type-button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.qr-generator.dark-mode .data-type-button.inactive{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.qr-generator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.qr-generator.dark-mode .input-group input,.qr-generator.dark-mode .input-group select,.qr-generator.dark-mode .input-group textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.batch-mode-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.qr-generator.dark-mode .batch-mode-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.batch-toggle{align-items:center;display:flex;gap:12px;margin-bottom:20px}.batch-toggle input[type=checkbox]{cursor:pointer;height:18px;width:18px}.batch-toggle label{align-items:center;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px}.qr-generator.dark-mode .batch-toggle label{color:#f7fafc;color:var(--dark-text)}.batch-input{animation:fadeIn .3s ease-out}.process-batch-button{align-items:center;background-color:#2ecc71;background-color:var(--success);border:none;border-radius:10px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;margin-top:16px;padding:14px 24px;transition:all .3s ease}.process-batch-button:hover{background-color:#27ae60;box-shadow:0 6px 20px #2ecc714d;transform:translateY(-2px)}.controls-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;padding:24px}.qr-generator.dark-mode .controls-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-toggle{padding:10px 16px}.basic-controls{grid-gap:20px;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:20px}.qr-generator.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h4{align-items:center;display:flex;gap:8px;margin:0 0 20px}.settings-grid{margin-bottom:24px}.color-input-group{gap:8px}.color-input-group label{color:#2c3e50;color:var(--text);font-size:.9rem;font-weight:600}.qr-generator.dark-mode .color-input-group label{color:#f7fafc;color:var(--dark-text)}.color-input-wrapper{gap:10px}.color-input-wrapper input[type=color]{border-radius:8px;height:40px;padding:0}.color-input-wrapper input[type=text]{text-transform:uppercase}.input-group input[type=range]{-webkit-appearance:none;appearance:none;background:#e1e8ed;background:var(--border);border-radius:3px;height:6px;margin:8px 0;outline:none;width:100%}.input-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#3498db;background:var(--primary);border-radius:50%;box-shadow:0 2px 6px #3498db4d;cursor:pointer;height:20px;width:20px}.input-group input[type=range]::-moz-range-thumb{background:#3498db;background:var(--primary);border:none;border-radius:50%;box-shadow:0 2px 6px #3498db4d;cursor:pointer;height:20px;width:20px}.input-group span{color:#3498db;color:var(--primary);font-size:.9rem;font-weight:600;margin-left:8px}.logo-section{border-top:1px solid #e1e8ed;border-top:1px solid var(--border);margin-top:24px;padding-top:24px}.qr-generator.dark-mode .logo-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.logo-controls{display:flex;flex-direction:column;gap:16px}.upload-logo-button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;padding:12px 20px;transition:all .3s ease;width:-webkit-fit-content;width:fit-content}.upload-logo-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.logo-settings{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;flex-direction:column;gap:16px;padding:16px}.qr-generator.dark-mode .logo-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.remove-logo-button{background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;padding:8px 16px;transition:all .3s ease;width:-webkit-fit-content;width:fit-content}.remove-logo-button:hover{background-color:#c0392b}.qr-generator.dark-mode .preview-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-controls{gap:10px}.grid-toggle{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:.85rem;font-weight:500;gap:6px;padding:8px 14px;transition:all .3s ease}.grid-toggle.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.qr-generator.dark-mode .grid-toggle{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.preview-container{flex-direction:column;gap:24px;padding:24px}.qr-generator.dark-mode .preview-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-wrapper{align-items:center;background:#fafbfc;background:var(--canvas-bg);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;display:flex;justify-content:center;min-height:300px;padding:24px;position:relative}.qr-generator.dark-mode .preview-wrapper{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-canvas{border-radius:8px;box-shadow:0 8px 25px #00000014;box-shadow:0 8px 25px var(--preview-shadow);transition:all .3s ease}.preview-canvas.show-grid{background-image:linear-gradient(#0000001a 1px,#0000 0),linear-gradient(90deg,#0000001a 1px,#0000 0);background-image:linear-gradient(var(--grid-color) 1px,#0000 1px),linear-gradient(90deg,var(--grid-color) 1px,#0000 1px)}.processing-overlay{background:#ffffffe6;background:var(--processing-overlay);border-radius:12px;color:#2c3e50;color:var(--text);font-weight:600;position:absolute}.qr-generator.dark-mode .processing-overlay{background:#1a202ce6;color:#f7fafc;color:var(--dark-text)}.qr-info{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;max-width:500px;padding:20px;width:100%}.qr-generator.dark-mode .qr-info{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.info-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.info-item{text-align:center}.qr-generator.dark-mode .info-label{color:#a0aec0;color:var(--dark-text-secondary)}.download-button{font-size:1.1rem;font-weight:700;padding:16px 32px}.download-button:hover:not(:disabled){box-shadow:0 8px 25px #2ecc714d}.copy-button{background-color:#3498db;background-color:var(--primary);font-size:1.1rem;font-weight:700;padding:16px 32px}.copy-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 8px 25px #3498db4d}.secondary{padding:12px 20px}.qr-generator.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.qr-generator.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.spinner{border:3px solid #0000;height:24px;width:24px}.qr-generator.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.related-tools-section h3{font-size:1.4rem;margin-bottom:24px}.tool-card{padding:24px}.tool-card:hover{box-shadow:0 8px 25px #1018280a;box-shadow:0 8px 25px var(--shadow)}.qr-generator.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tool-card h4{margin:0 0 6px}.qr-generator.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.qr-generator{padding:24px}.basic-controls,.settings-grid{grid-template-columns:1fr}.data-type-grid,.info-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.qr-generator{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.header-section h1{font-size:1.8rem}.data-type-grid{grid-template-columns:1fr}.data-type-button{flex-direction:row;min-height:auto;padding:12px 16px}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:280px;width:100%}.preview-wrapper{padding:16px}.info-grid,.related-tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.qr-generator{margin:12px;padding:16px}.header-section h1{flex-direction:column;font-size:1.6rem;gap:8px}.batch-mode-section,.controls-section,.data-type-section,.preview-section{padding:16px}.tool-card{flex-direction:column;gap:12px;text-align:center}}.qr-generator-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.qr-generator.dark-mode .qr-generator-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.qr-generator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.qr-generator.dark-mode .article-header h2{color:var(--dark-text)}.qr-generator.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.qr-generator.dark-mode .article-section h3,.qr-generator.dark-mode .article-section h4,.qr-generator.dark-mode .article-section li,.qr-generator.dark-mode .article-section p{color:var(--dark-text)}.qr-generator.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.qr-generator.dark-mode .benefit-card h4{color:var(--dark-text)}.qr-generator.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.qr-generator.dark-mode .concept-item{background:var(--dark-bg-light)}.concept-item h4{align-items:center;display:flex;gap:8px}.qr-generator.dark-mode .concept-item p{color:var(--dark-text)}.qr-generator.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.qr-generator.dark-mode .practice-item h4{color:var(--dark-text)}.qr-generator.dark-mode .practice-item p{color:var(--dark-text-secondary)}.qr-generator.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.qr-generator.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.qr-generator.dark-mode .scenario-card li{color:var(--dark-text)}.qr-generator.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.qr-generator.dark-mode .tech-item h4{color:var(--dark-text)}.qr-generator.dark-mode .tech-item p{color:var(--dark-text-secondary)}.qr-generator.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.qr-generator.dark-mode .technique-item p{color:var(--dark-text)}.qr-generator.dark-mode .mistake-item{background:#e74c3c1a}.qr-generator.dark-mode .mistake-item p{color:var(--dark-text)}.qr-generator.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.qr-generator.dark-mode .tool-category p{color:var(--dark-text)}.qr-generator.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.qr-generator.dark-mode .quick-tips,.qr-generator.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.qr-generator.dark-mode .quick-tips li,.qr-generator.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.qr-generator-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.qr-generator-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}.concept-item h4{align-items:flex-start;flex-direction:column;gap:8px}}:root{--barcode-border:#e1e8ed;--progress-bg:#e9ecef;--progress-fill:#28a745;--processing-overlay:#ffffffe6}.barcode-generator{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.barcode-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.barcode-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.barcode-type-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.barcode-generator.dark-mode .barcode-type-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.barcode-type-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 20px}.barcode-type-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.barcode-type-button{align-items:center;border:2px solid #0000;border-radius:12px;cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:12px;min-height:70px;outline:none;padding:16px 20px;text-align:left;transition:all .3s ease}.barcode-type-button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.barcode-type-button.inactive{background-color:#fff;background-color:var(--white);border-color:#e1e8ed;border-color:var(--border);color:#2c3e50;color:var(--text)}.barcode-type-button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.barcode-generator.dark-mode .barcode-type-button.inactive{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.button-content{display:flex;flex-direction:column;gap:4px}.button-label{font-size:1rem;font-weight:600}.button-desc{font-size:.85rem;font-weight:400;opacity:.8}.input-group{gap:8px}.input-group label{color:var(--text);font-size:1rem}.barcode-generator.dark-mode .input-group label{color:#f7fafc;color:var(--dark-text)}.input-wrapper{position:relative}.input-group input,.input-group select,.input-group textarea{background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;outline:none;padding:14px 16px;resize:vertical;transition:all .3s ease}.input-group input:focus,.input-group select:focus,.input-group textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.barcode-generator.dark-mode .input-group input,.barcode-generator.dark-mode .input-group select,.barcode-generator.dark-mode .input-group textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.check-digit{background:#f8fafc;background:var(--bg-light);border-radius:4px;color:#3498db;color:var(--primary);font-size:.9rem;font-weight:600;padding:4px 8px;position:absolute;right:16px;top:50%;transform:translateY(-50%)}.validation-status{margin-top:8px}.invalid,.valid{align-items:center;display:flex;font-size:.9rem;font-weight:500;gap:6px}.valid{color:#2ecc71;color:var(--success)}.invalid{color:#e74c3c;color:var(--danger)}.checkbox-group{align-items:center;gap:8px}.checkbox-group label{font-size:.95rem}.text-settings{border-top:1px solid #e1e8ed;border-top:1px solid var(--border);margin-top:24px;padding-top:24px}.barcode-generator.dark-mode .text-settings{border-top-color:#4a5568;border-top-color:var(--dark-border)}:root{--template-hover:#e6f3ff;--meme-accent:#ff6b6b;--meme-secondary:#4ecdc4}.meme-generator{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.meme-generator.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.meme-generator.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-section h1 svg{color:#3498db;color:var(--primary)}.template-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.meme-generator.dark-mode .template-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.template-header{align-items:center}.template-header h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0}.search-box{background:#fff;border:1px solid #e1e8ed}.meme-generator.dark-mode .search-box{background:#1a202c;border-color:#4a5568}.search-box svg{color:#7f8c8d}.upload-custom-button{background:#3498db;color:#fff}.upload-custom-button:hover{background:#2980b9}.category-button{background:#fff;border:1px solid #e1e8ed;color:#2c3e50;padding:8px 16px}.category-button:hover{border-color:#3498db}.category-button.active{background:#3498db;border-color:#3498db;color:#fff}.meme-generator.dark-mode .category-button{background:#1a202c;border-color:#4a5568;color:#f7fafc}.meme-generator.dark-mode .category-button.active{background:#3498db;border-color:#3498db}.template-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.template-card{background:#fff;border:2px solid #e1e8ed;gap:8px;padding:8px}.template-card:hover{border-color:#3498db;box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.template-card.selected{background:#e6f3ff;border-color:#3498db}.meme-generator.dark-mode .template-card{background:#1a202c;border-color:#4a5568}.meme-generator.dark-mode .template-card.selected{border-color:#3498db}.template-card img{background:#f8fafc;background:var(--bg-light);border-radius:8px;height:150px;object-fit:cover;width:100%}.template-info{gap:4px}.template-name{color:inherit}.template-category{background:#f8fafc;color:#7f8c8d;display:inline-block;padding:2px 8px;width:-webkit-fit-content;width:fit-content}.meme-generator.dark-mode .template-category{background:#2d3748;color:#a0aec0}.editor-section{margin-bottom:30px}.editor-layout{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 400px}.canvas-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;padding:24px}.meme-generator.dark-mode .canvas-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.canvas-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.canvas-header h3{align-items:center;color:inherit;font-size:1.2rem;margin:0}.canvas-controls,.canvas-header h3{display:flex;gap:8px}.grid-toggle,.preview-mode-toggle{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);color:#2c3e50;color:var(--text);font-size:.85rem;gap:6px;padding:6px 12px}.grid-toggle.active,.preview-mode-toggle.active{background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;color:var(--white)}.meme-generator.dark-mode .grid-toggle,.meme-generator.dark-mode .preview-mode-toggle{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.canvas-wrapper{align-items:center;background:#fafbfc;background:var(--canvas-bg);border-radius:12px;display:flex;justify-content:center;min-height:400px;padding:20px}.meme-generator.dark-mode .canvas-wrapper{background:#1a202c;background:var(--dark-bg)}.meme-canvas{background:#fff;border-radius:8px;box-shadow:0 4px 12px #0000001a;height:auto;max-width:100%}.meme-canvas.show-grid{background-image:linear-gradient(#0000001a 1px,#0000 0),linear-gradient(90deg,#0000001a 1px,#0000 0);background-size:20px 20px}.text-controls-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;max-height:800px;overflow-y:auto;padding:24px}.meme-generator.dark-mode .text-controls-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.text-controls-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.text-controls-header h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0}.add-text-button{align-items:center;background:#2ecc71;background:var(--success);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;font-weight:600;gap:6px;padding:8px 16px;transition:all .3s ease}.add-text-button:hover{background:#27ae60;transform:translateY(-1px)}.text-boxes-list{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.text-box-item{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;cursor:pointer;display:flex;gap:8px;padding:12px;transition:all .3s ease}.text-box-item.selected,.text-box-item:hover{border-color:#3498db;border-color:var(--primary)}.text-box-item.selected{background:#3498db0d}.meme-generator.dark-mode .text-box-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.meme-generator.dark-mode .text-box-item.selected{background:#3498db1a}.text-box-label{color:#7f8c8d;color:var(--text-light);font-size:.85rem;font-weight:600;min-width:60px}.text-box-item input{background:#0000;border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:inherit;flex:1 1;font-size:.9rem;outline:none;padding:6px 10px}.text-box-item input:focus{border-color:#3498db;border-color:var(--primary)}.remove-text-button{align-items:center;background:#e74c3c;background:var(--danger);border:none;border-radius:4px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:18px;height:24px;justify-content:center;transition:all .3s ease;width:24px}.remove-text-button:hover{background:#c0392b}.selected-text-controls{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.meme-generator.dark-mode .selected-text-controls{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.selected-text-controls h4{color:#3498db;color:var(--primary);font-size:1rem;margin:0 0 16px}.control-group{margin-bottom:16px}.control-group label{color:#7f8c8d;color:var(--text-light);font-size:.85rem;margin-bottom:6px}.meme-generator.dark-mode .control-group label{color:#a0aec0;color:var(--dark-text-secondary)}.control-group input[type=range],.control-group select{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:inherit;font-size:.9rem;outline:none;padding:8px;width:100%}.meme-generator.dark-mode .control-group select{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.control-group input[type=range]{border:none;cursor:pointer;height:6px;padding:0}.control-group input[type=range]::-webkit-slider-thumb{height:18px;width:18px}.control-group input[type=range]::-moz-range-thumb{background:#3498db;background:var(--primary);border:none;border-radius:50%;cursor:pointer;height:18px;width:18px}.alignment-buttons,.style-buttons{display:flex;gap:8px}.align-button,.style-button{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:14px;font-weight:600;justify-content:center;padding:8px 12px;transition:all .3s ease}.align-button.active,.style-button.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;color:var(--white)}.meme-generator.dark-mode .align-button,.meme-generator.dark-mode .style-button{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.color-controls{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr}.color-input-group{display:flex;flex-direction:column;gap:6px}.color-input-group input[type=color]{cursor:pointer;height:40px;width:100%}.color-input-group input[type=color],.color-input-group input[type=text]{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px}.color-input-group input[type=text]{background:#fff;background:var(--white);color:inherit;font-size:.85rem;padding:8px}.meme-generator.dark-mode .color-input-group input[type=text]{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.position-controls{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr}.position-input{display:flex;flex-direction:column;gap:6px}.toggle-advanced{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;font-size:.9rem;font-weight:600;margin-top:16px;padding:10px;transition:all .3s ease;width:100%}.toggle-advanced:hover{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;color:var(--white)}.meme-generator.dark-mode .toggle-advanced{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.advanced-text-settings{animation:fadeIn .3s ease-out;border-top:1px solid #e1e8ed;border-top:1px solid var(--border);margin-top:16px;padding-top:16px}.meme-generator.dark-mode .advanced-text-settings{border-top-color:#4a5568;border-top-color:var(--dark-border)}.export-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.meme-generator.dark-mode .export-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.export-header{margin-bottom:20px}.export-header h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0}.export-controls{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr;margin-bottom:20px}.format-selector label,.quality-control label{color:#7f8c8d;color:var(--text-light);display:block;font-size:.9rem;font-weight:600;margin-bottom:8px}.meme-generator.dark-mode .format-selector label,.meme-generator.dark-mode .quality-control label{color:#a0aec0;color:var(--dark-text-secondary)}.format-buttons{display:flex;gap:8px}.format-buttons button{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);cursor:pointer;flex:1 1;font-size:.9rem;font-weight:600;padding:10px;transition:all .3s ease}.format-buttons button.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;color:var(--white)}.meme-generator.dark-mode .format-buttons button{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.quality-control input[type=range]{-webkit-appearance:none;appearance:none;background:#e1e8ed;background:var(--border);border-radius:3px;height:6px;outline:none;width:100%}.quality-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#3498db;background:var(--primary);border-radius:50%;cursor:pointer;height:18px;width:18px}.export-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.copy-button,.download-button,.share-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.download-button.primary{background:#2ecc71;background:var(--success);color:#fff;color:var(--white)}.download-button.primary:hover:not(:disabled){background:#27ae60;box-shadow:0 6px 20px #2ecc714d;transform:translateY(-2px)}.copy-button{background:var(--primary)}.copy-button:hover:not(:disabled){background:#2980b9;background:var(--primary-hover);transform:translateY(-2px)}.share-button{background:#ff6b6b;background:var(--meme-accent);color:#fff;color:var(--white)}.share-button:hover:not(:disabled){background:#ff5252;transform:translateY(-2px)}.draft-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.meme-generator.dark-mode .draft-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.draft-header{margin-bottom:20px}.draft-header h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0}.draft-actions{display:flex;gap:12px;margin-bottom:20px}.reset-button,.save-draft-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;padding:10px 18px;transition:all .3s ease}.save-draft-button{background:#3498db;background:var(--primary);color:#fff;color:var(--white)}.save-draft-button:hover{background:#2980b9;background:var(--primary-hover);transform:translateY(-1px)}.reset-button{background:var(--danger);color:var(--white)}.reset-button:hover{transform:translateY(-1px)}.saved-drafts{border-top:1px solid #e1e8ed;border-top:1px solid var(--border);margin-top:20px;padding-top:20px}.meme-generator.dark-mode .saved-drafts{border-top-color:#4a5568;border-top-color:var(--dark-border)}.saved-drafts h4{color:#7f8c8d;color:var(--text-light);font-size:1rem;margin:0 0 12px}.drafts-list{display:flex;flex-direction:column;gap:8px}.draft-item{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;gap:12px;padding:10px}.meme-generator.dark-mode .draft-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.draft-date{color:#7f8c8d;color:var(--text-light);flex:1 1;font-size:.85rem}.draft-item button{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);cursor:pointer;font-size:.85rem;padding:6px 12px;transition:all .3s ease}.draft-item button:hover{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;color:var(--white)}.meme-generator.dark-mode .draft-item button{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.delete-draft{align-items:center;background:#e74c3c!important;background:var(--danger)!important;border:none!important;color:#fff;color:var(--white);display:flex;font-size:20px;height:28px;justify-content:center;padding:0;width:28px}.tips-section{border-top:2px solid #e1e8ed;border-top:2px solid var(--border);padding-top:30px}.meme-generator.dark-mode .tips-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.tips-section h3{font-size:1.3rem;justify-content:center;text-align:center}.tips-grid{grid-gap:20px;gap:20px}.tip-card{background:#f8fafc;background:var(--bg-light);border-radius:12px;padding:24px;text-align:center;transition:all .3s ease}.tip-card:hover{box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow)}.meme-generator.dark-mode .tip-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tip-card svg{color:#3498db;color:var(--primary);margin-bottom:12px}.tip-card h4{font-size:1.1rem;margin:0 0 8px}.tip-card p{font-size:.9rem;line-height:1.5}.meme-generator.dark-mode .tip-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.editor-layout{grid-template-columns:1fr}.text-controls-section{max-height:none}.export-controls{grid-template-columns:1fr}}@media (max-width:768px){.meme-generator{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.template-header{align-items:stretch}.template-controls,.template-header{flex-direction:column}.search-box{min-width:100%}.template-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.category-filter{flex-wrap:nowrap;overflow-x:auto;padding-bottom:8px}.export-actions{flex-direction:column}.export-actions button{width:100%}.tips-grid{grid-template-columns:1fr}.draft-actions{flex-direction:column}.draft-actions button{width:100%}}@media (max-width:480px){.meme-generator{margin:8px;padding:16px}.header-section h1{font-size:1.8rem}.template-grid{gap:8px;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.template-card{padding:6px}.template-card img{height:100px}.color-controls,.position-controls{grid-template-columns:1fr}.alignment-buttons,.style-buttons{flex-wrap:wrap}}.meme-generator-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.meme-generator.dark-mode .meme-generator-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.meme-generator.dark-mode .article-header{border-bottom-color:var(--dark-border)}.meme-generator.dark-mode .article-header h2{color:var(--dark-text)}.meme-generator.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.meme-generator.dark-mode .article-section h3,.meme-generator.dark-mode .article-section h4,.meme-generator.dark-mode .article-section li,.meme-generator.dark-mode .article-section p{color:var(--dark-text)}.meme-generator.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.meme-generator.dark-mode .benefit-card h4{color:var(--dark-text)}.meme-generator.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.meme-generator.dark-mode .concept-item{background:var(--dark-bg-light)}.meme-generator.dark-mode .concept-item p{color:var(--dark-text)}.meme-generator.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.meme-generator.dark-mode .practice-item h4{color:var(--dark-text)}.meme-generator.dark-mode .practice-item p{color:var(--dark-text-secondary)}.meme-generator.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.meme-generator.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.meme-generator.dark-mode .scenario-card li{color:var(--dark-text)}.meme-generator.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.meme-generator.dark-mode .tech-item h4{color:var(--dark-text)}.meme-generator.dark-mode .tech-item p{color:var(--dark-text-secondary)}.meme-generator.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.meme-generator.dark-mode .technique-item p{color:var(--dark-text)}.meme-generator.dark-mode .mistake-item{background:#e74c3c1a}.meme-generator.dark-mode .mistake-item p{color:var(--dark-text)}.meme-generator.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.meme-generator.dark-mode .quick-tips,.meme-generator.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.quick-tips h4,.related-articles h4{align-items:center;display:flex;gap:8px}.meme-generator.dark-mode .quick-tips li,.meme-generator.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.meme-generator-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.meme-generator-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}.meme-template-area{background:var(--bg-light);border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px}.meme-generator.dark-mode .meme-template-area{background:var(--dark-bg-light);border-color:var(--dark-border)}.template-header{align-items:flex-start;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;margin-bottom:20px}.template-title{display:flex;flex-direction:column;gap:8px}.template-title h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0}.template-count{color:var(--text-light);font-size:.9rem;font-weight:400;margin-left:8px}.meme-generator.dark-mode .template-count{color:var(--dark-text-secondary)}.template-badges{display:flex;gap:8px}.badge{align-items:center;border-radius:12px;display:inline-flex;font-size:.8rem;font-weight:600;gap:4px;padding:4px 10px}.badge.trending{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.badge.new{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.template-controls{flex-wrap:wrap;gap:12px}.search-box,.template-controls{align-items:center;display:flex}.search-box{background:var(--white);border:1px solid var(--border);border-radius:8px;min-width:250px;padding:8px 12px;position:relative;transition:all .3s ease}.search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.meme-generator.dark-mode .search-box{background:var(--dark-bg);border-color:var(--dark-border)}.search-box svg{color:var(--text-light);flex-shrink:0;margin-right:8px}.search-box input{background:#0000;border:none;color:inherit;flex:1 1;font-size:.95rem;outline:none}.clear-search{align-items:center;background:none;border:none;color:var(--text-light);cursor:pointer;display:flex;font-size:20px;justify-content:center;padding:0 4px;transition:all .2s ease}.clear-search:hover{color:var(--danger)}.popular-toggle{align-items:center;background:var(--white);border:1px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:6px;padding:8px 16px;transition:all .3s ease}.popular-toggle:hover{background:#f39c120d;border-color:var(--warning)}.popular-toggle.active{background:var(--warning);border-color:var(--warning);color:var(--white)}.meme-generator.dark-mode .popular-toggle{background:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.meme-generator.dark-mode .popular-toggle.active{background:var(--warning);border-color:var(--warning)}.upload-custom-button{align-items:center;background:var(--primary);border:none;border-radius:8px;color:var(--white);cursor:pointer;display:flex;font-size:.95rem;font-weight:600;gap:8px;padding:10px 18px;transition:all .3s ease}.upload-custom-button:hover{background:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.category-filter{border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;padding-bottom:12px}.meme-generator.dark-mode .category-filter{border-bottom-color:var(--dark-border)}.category-button{align-items:center;background:var(--white);border:1px solid var(--border);border-radius:20px;color:var(--text);cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:6px;padding:8px 14px;transition:all .3s ease}.category-button:hover{border-color:var(--primary);box-shadow:0 2px 8px #3498db26;transform:translateY(-1px)}.category-button.active{background:var(--primary);border-color:var(--primary);box-shadow:0 4px 12px #3498db40;color:var(--white)}.meme-generator.dark-mode .category-button{background:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.meme-generator.dark-mode .category-button.active{background:var(--primary);border-color:var(--primary)}.category-name{font-weight:500}.category-count{background:#0000001a;border-radius:10px;font-size:.75rem;font-weight:600;padding:2px 6px}.category-button.active .category-count{background:#fff3}.no-results{color:var(--text-light);padding:60px 20px;text-align:center}.meme-generator.dark-mode .no-results{color:var(--dark-text-secondary)}.no-results svg{color:var(--text-light);margin-bottom:16px;opacity:.5}.no-results h4{color:var(--text);font-size:1.2rem;margin:0 0 8px}.meme-generator.dark-mode .no-results h4{color:var(--dark-text)}.no-results p{font-size:.95rem;margin:0 0 20px}.suggestions{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.suggestions span{color:var(--text-light);font-size:.9rem}.suggestions button{background:var(--primary);border:none;border-radius:16px;color:#fff;cursor:pointer;font-size:.85rem;padding:6px 12px;transition:all .2s ease}.suggestions button:hover{background:var(--primary-hover);transform:translateY(-1px)}.template-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));margin-top:20px}.template-card{background:var(--white);border:2px solid var(--border);border-radius:12px;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;transition:all .3s ease}.template-card:hover{border-color:var(--primary);box-shadow:0 8px 24px #0000001a;transform:translateY(-4px)}.template-card.selected{background:var(--template-hover);border-color:var(--primary);box-shadow:0 0 0 3px #3498db33}.meme-generator.dark-mode .template-card{background:var(--dark-bg);border-color:var(--dark-border)}.meme-generator.dark-mode .template-card.selected{background:#3498db1a;border-color:var(--primary)}.template-image{background:var(--bg-light);overflow:hidden;padding-top:100%;position:relative;width:100%}.template-image img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.template-badge{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:6px;color:#fff;display:flex;font-size:.7rem;font-weight:600;gap:3px;padding:4px 8px;position:absolute;right:8px;top:8px}.template-info{display:flex;flex-direction:column;gap:6px;padding:12px}.template-name{color:var(--text);font-size:.9rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.meme-generator.dark-mode .template-name{color:var(--dark-text)}.template-meta{align-items:center;display:flex;gap:8px;justify-content:space-between}.template-category{align-items:center;background:var(--bg-light);border-radius:12px;color:var(--text-light);display:inline-flex;font-size:.75rem;gap:4px;padding:3px 8px}.meme-generator.dark-mode .template-category{background:var(--dark-bg-light);color:var(--dark-text-secondary)}.template-popularity{color:var(--warning);font-size:.75rem;font-weight:600}.view-mode-toggle{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;display:flex;gap:8px;margin-bottom:20px;padding:4px}.meme-generator.dark-mode .view-mode-toggle{background:var(--dark-bg-light);border-color:var(--dark-border)}.view-mode-button{align-items:center;background:#0000;border:none;border-radius:8px;color:var(--text-light);cursor:pointer;display:flex;flex:1 1;font-size:.9rem;font-weight:500;gap:6px;justify-content:center;padding:10px 16px;transition:all .3s ease}.view-mode-button:hover{background:var(--white);color:var(--text)}.view-mode-button.active{background:var(--white);box-shadow:0 2px 8px #0000001a;color:var(--primary);font-weight:600}.meme-generator.dark-mode .view-mode-button{color:var(--dark-text-secondary)}.meme-generator.dark-mode .view-mode-button:hover{background:var(--dark-bg);color:var(--dark-text)}.meme-generator.dark-mode .view-mode-button.active{background:var(--dark-bg);box-shadow:0 2px 8px #0000004d;color:var(--primary)}.category-filter.tabs-mode{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:8px}.meme-generator.dark-mode .category-filter.tabs-mode{background:var(--dark-bg-light);border-color:var(--dark-border)}.category-filter.tabs-mode .category-button{background:#0000;border:none;border-radius:8px;transition:all .2s ease}.category-filter.tabs-mode .category-button:hover{background:var(--white);border:none;box-shadow:none;transform:none}.category-filter.tabs-mode .category-button.active{background:var(--primary);box-shadow:0 2px 8px #3498db40;color:var(--white);transform:none}.meme-generator.dark-mode .category-filter.tabs-mode .category-button:hover{background:var(--dark-bg)}.meme-generator.dark-mode .category-filter.tabs-mode .category-button.active{background:var(--primary);box-shadow:0 2px 8px #3498db66;color:var(--white)}.template-stats{border-top:1px solid var(--border);margin-top:16px;padding-top:16px;text-align:center}.meme-generator.dark-mode .template-stats{border-top-color:var(--dark-border)}.template-stats p{color:var(--text-light);font-size:.9rem;margin:0}.meme-generator.dark-mode .template-stats p{color:var(--dark-text-secondary)}.load-more{border-top:1px solid var(--border);display:flex;justify-content:center;margin-top:30px;padding-top:20px}.meme-generator.dark-mode .load-more{border-top-color:var(--dark-border)}.load-more-button{background:var(--primary);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:12px 32px;transition:all .3s ease}.load-more-button:hover{background:var(--primary-hover);box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}@media (max-width:1024px){.template-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}}@media (max-width:768px){.template-header{align-items:stretch;flex-direction:column}.template-controls{flex-direction:column;width:100%}.search-box{min-width:100%}.view-mode-toggle{margin-bottom:16px}.view-mode-button{font-size:.85rem;padding:8px 12px}.category-filter{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;overflow-x:auto;padding-bottom:12px}.category-filter.tabs-mode{padding:6px}.category-filter .category-button{min-width:-webkit-max-content;min-width:max-content;white-space:nowrap}.template-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}}@media (max-width:480px){.view-mode-toggle{margin-bottom:12px;padding:3px}.view-mode-button{font-size:.8rem;gap:4px;padding:6px 10px}.category-filter.tabs-mode{padding:4px}.category-button{font-size:.8rem;padding:6px 10px}.category-count{font-size:.7rem;padding:1px 4px}.template-grid{gap:8px;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.template-info{padding:8px}.template-name{font-size:.8rem}.template-meta{align-items:flex-start;flex-direction:column;gap:4px}.template-stats p{font-size:.8rem}.load-more-button{font-size:.9rem;padding:10px 20px}}:root{--metadata-border:#e1e8ed;--drop-zone:#f0f8ff;--drop-zone-active:#e6f3ff;--preview-shadow:#00000014;--sensitive-bg:#fff5f5;--sensitive-border:#feb2b2;--category-bg:#f7fafc}.metadata-viewer{--gap:24px;--padding:32px;max-width:1400px}.viewer-header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-bottom:2px solid #e1e8ed;border-bottom:2px solid var(--border);border-radius:var(--card-radius) var(--card-radius) 0 0;margin:calc(var(--padding)*-1) calc(var(--padding)*-1) var(--gap) calc(var(--padding)*-1);padding:2rem 0;position:-webkit-sticky;position:sticky;top:0;z-index:100}.metadata-viewer.dark-mode .viewer-header{background:#1a202cf2;border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-content{justify-content:space-between;margin:0 auto;max-width:1336px;padding:0 var(--padding)}.header-content,.title-section{align-items:center;display:flex}.title-section{gap:1rem}.title-icon{color:#3498db;color:var(--primary);height:48px;width:48px}.title-section h1{color:#2c3e50;color:var(--text);font-size:2.2rem;font-weight:700;margin:0}.metadata-viewer.dark-mode .title-section h1{color:#f7fafc;color:var(--dark-text)}.title-section p{color:#7f8c8d;color:var(--text-light);font-size:1rem;margin:.25rem 0 0}.metadata-viewer.dark-mode .title-section p{color:#a0aec0;color:var(--dark-text-secondary)}.privacy-toggle,.toggle-btn{align-items:center;display:flex;gap:.5rem}.toggle-btn{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);padding:.5rem 1rem;transition:all .2s}.toggle-btn:hover{background:#f8fafc;border-color:#3498db;border-color:var(--primary)}.toggle-btn.active{background:#fff5f5;background:var(--sensitive-bg);border-color:#e74c3c;border-color:var(--danger);color:#e74c3c;color:var(--danger)}.metadata-viewer.dark-mode .toggle-btn{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.metadata-viewer.dark-mode .toggle-btn:hover{background:#1a202c;background:var(--dark-bg);border-color:#3498db;border-color:var(--primary)}.upload-zone{align-items:center;background:#f0f8ff;background:var(--drop-zone);border:3px dashed #e1e8ed;border:3px dashed var(--border);border-radius:16px;cursor:pointer;display:flex;flex-direction:column;justify-content:center;margin-bottom:var(--gap);min-height:300px;padding:4rem 2rem;text-align:center;transition:all .3s ease}.upload-zone:hover{background:#e6f3ff;background:var(--drop-zone-active);border-color:#3498db;border-color:var(--primary);box-shadow:0 8px 25px #3498db26;transform:translateY(-2px)}.metadata-viewer.dark-mode .upload-zone{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.metadata-viewer.dark-mode .upload-zone:hover{background:#1a202c;background:var(--dark-bg);border-color:#3498db;border-color:var(--primary)}.upload-zone svg{color:#3498db;color:var(--primary);margin-bottom:1rem}.upload-zone h3{color:#2c3e50;color:var(--text);font-size:1.5rem;font-weight:600;margin:0 0 .5rem}.metadata-viewer.dark-mode .upload-zone h3{color:#f7fafc;color:var(--dark-text)}.upload-zone p{color:#7f8c8d;color:var(--text-light);margin:.25rem 0}.metadata-viewer.dark-mode .upload-zone p{color:#a0aec0;color:var(--dark-text-secondary)}.privacy-note{align-items:center;background:#e6fffa;border-radius:8px;color:#234e52!important;display:flex;font-size:.875rem;font-weight:500;gap:.5rem;justify-content:center;margin-top:1rem!important;max-width:400px;padding:.5rem 1rem}.privacy-note svg{color:#38b2ac!important;margin-bottom:0!important}.viewer-layout{grid-gap:var(--gap);background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;box-shadow:0 4px 12px #1018280a;box-shadow:0 4px 12px var(--shadow);display:grid;gap:var(--gap);grid-template-columns:300px 1fr;overflow:hidden}.metadata-viewer.dark-mode .viewer-layout{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.image-sidebar{background:#f8fafc;background:var(--bg-light);border-right:1px solid #e1e8ed;border-right:1px solid var(--border);display:flex;flex-direction:column}.metadata-viewer.dark-mode .image-sidebar{background:#2d3748;background:var(--dark-bg-light);border-right-color:#4a5568;border-right-color:var(--dark-border)}.image-list{flex:1 1;max-height:600px;overflow-y:auto;padding:1rem}.image-item{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;gap:.75rem;margin-bottom:.5rem;padding:.75rem;position:relative;transition:all .2s}.image-item:hover{background:#e1e8ed;background:var(--border)}.metadata-viewer.dark-mode .image-item:hover{background:#4a5568;background:var(--dark-border)}.image-item.active{background:#3498db;background:var(--primary);border-color:#2980b9;border-color:var(--primary-hover);color:#fff;color:var(--white)}.image-item img{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;height:50px;object-fit:cover;width:50px}.metadata-viewer.dark-mode .image-item img{border-color:#4a5568;border-color:var(--dark-border)}.image-info{flex:1 1;min-width:0}.filename{display:block;font-size:.875rem;font-weight:500}.dimensions{display:block;font-size:.75rem;margin-top:.25rem;opacity:.7}.remove-btn{background:#fffc;border:none;border-radius:4px;color:#e74c3c;color:var(--danger);cursor:pointer;opacity:0;padding:.25rem;transition:all .2s}.image-item:hover .remove-btn{opacity:1}.image-item.active .remove-btn{background:#ffffffe6;opacity:1}.remove-btn:hover{background:#fff5f5;background:var(--sensitive-bg)}.add-more-btn{align-items:center;background:#0000;border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-weight:500;gap:.5rem;justify-content:center;margin:1rem;padding:.75rem 1rem;transition:all .2s}.add-more-btn:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.metadata-viewer.dark-mode .add-more-btn{border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.metadata-viewer.dark-mode .add-more-btn:hover{background:#3498db1a;border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.metadata-panel{display:flex;flex-direction:column;min-height:600px}.panel-header{align-items:center;background:#f8fafc;background:var(--bg-light);border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;padding:1.5rem}.metadata-viewer.dark-mode .panel-header{background:#2d3748;background:var(--dark-bg-light);border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.controls{display:flex;flex:1 1;gap:1rem}.search-input{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);flex:1 1;font-size:.875rem;max-width:250px;padding:.5rem 1rem;transition:border-color .2s}.search-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.metadata-viewer.dark-mode .search-input{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.category-select{background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;font-size:.875rem;padding:.5rem 1rem;transition:border-color .2s}.category-select:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.metadata-viewer.dark-mode .category-select{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.export-btn,.export-controls{display:flex;gap:.5rem}.export-btn{align-items:center;background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);cursor:pointer;font-size:.875rem;font-weight:500;padding:.5rem 1rem;transition:all .2s}.export-btn:hover{background:#f8fafc;background:var(--bg-light);border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary);transform:translateY(-1px)}.metadata-viewer.dark-mode .export-btn{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.metadata-viewer.dark-mode .export-btn:hover{background:#2d3748;background:var(--dark-bg-light);border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.metadata-content{background:#fff;background:var(--white);flex:1 1;overflow-y:auto;padding:1.5rem}.metadata-viewer.dark-mode .metadata-content{background:#1a202c;background:var(--dark-bg)}.loading-state{align-items:center;color:#7f8c8d;color:var(--text-light);display:flex;flex-direction:column;justify-content:center;padding:3rem}.metadata-viewer.dark-mode .loading-state{color:#a0aec0;color:var(--dark-text-secondary)}.spinner{border:3px solid #e1e8ed;border-top:3px solid #3498db;border:3px solid var(--border);margin-bottom:1rem}.metadata-categories{display:flex;flex-direction:column;gap:2rem}.category-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:1.5rem}.metadata-viewer.dark-mode .category-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.category-title{align-items:center;border-bottom:2px solid #e1e8ed;border-bottom:2px solid var(--border);color:#2c3e50;color:var(--text);display:flex;font-size:1.125rem;font-weight:600;gap:.5rem;margin:0 0 1rem;padding-bottom:.5rem}.metadata-viewer.dark-mode .category-title{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.category-title svg{color:#3498db;color:var(--primary)}.metadata-grid{grid-gap:.75rem;gap:.75rem}.metadata-item{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:.75rem 1rem;transition:all .2s}.metadata-item:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 2px 4px #1018280a;box-shadow:0 2px 4px var(--shadow);transform:translateY(-1px)}.metadata-viewer.dark-mode .metadata-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.metadata-item.sensitive{background:#fff5f5;background:var(--sensitive-bg);border-color:#feb2b2;border-color:var(--sensitive-border)}.metadata-viewer.dark-mode .metadata-item.sensitive{background:#e74c3c1a;border-color:#e74c3c;border-color:var(--danger)}.metadata-item.sensitive:hover{border-color:#e74c3c;border-color:var(--danger)}.metadata-key{font-size:.875rem;font-weight:500}.metadata-value{align-items:center;color:#2c3e50;color:var(--text);display:flex;font-family:Consolas,Monaco,Courier New,monospace;font-size:.875rem;gap:.5rem}.metadata-viewer.dark-mode .metadata-value{color:#f7fafc;color:var(--dark-text)}.copy-btn{background:#e1e8ed;background:var(--border);border:none;border-radius:4px;color:#2c3e50;color:var(--text);cursor:pointer;opacity:0;padding:.25rem;transition:all .2s}.metadata-item:hover .copy-btn{opacity:1}.copy-btn:hover{background:#3498db;background:var(--primary);color:#fff;color:var(--white)}.metadata-viewer.dark-mode .copy-btn{background:#4a5568;background:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.related-tools{margin-top:4rem;padding:2rem 0}.metadata-viewer.dark-mode .related-tools{border-top-color:#4a5568}.related-tools h2{color:#2c3e50;color:var(--text);font-size:1.5rem;font-weight:700;margin-bottom:2rem;text-align:center}.metadata-viewer.dark-mode .related-tools h2{color:#f7fafc;color:var(--dark-text)}.tools-grid{grid-gap:1.5rem;gap:1.5rem}.tool-card{padding:2rem;text-align:center}.tool-card:hover{background:#fff;background:var(--white);box-shadow:0 15px 30px #1018280a;box-shadow:0 15px 30px var(--shadow);transform:translateY(-5px)}.metadata-viewer.dark-mode .tool-card{background:#2d3748;border-color:#4a5568;color:#f7fafc;color:var(--dark-text)}.metadata-viewer.dark-mode .tool-card:hover{background:#1a202c;background:var(--dark-bg);border-color:#3498db;border-color:var(--primary)}.tool-card svg{margin-bottom:1rem}.tool-card h3{color:inherit;font-size:1.25rem;font-weight:600;margin:0 0 .5rem}.tool-card p{margin:0 0 1.5rem}.metadata-viewer.dark-mode .tool-card p{color:#a0aec0}.tool-link{gap:.5rem;transition:color .2s}@media (max-width:1024px){.metadata-viewer{padding:24px}.viewer-layout{gap:0;grid-template-columns:1fr}.image-sidebar{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);border-right:none}.metadata-viewer.dark-mode .image-sidebar{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}}@media (max-width:768px){.metadata-viewer{margin:16px;padding:20px}.header-content{flex-direction:column;gap:1rem;text-align:center}.image-list{display:flex;gap:.5rem;max-height:200px;overflow-x:auto;overflow-y:visible}.image-item{flex-direction:column;min-width:120px;text-align:center}.image-item img{height:80px;width:80px}.panel-header{align-items:stretch;gap:1rem}.controls,.panel-header{flex-direction:column}.search-input{max-width:none}.export-controls{justify-content:center}.tools-grid{grid-template-columns:1fr}.upload-zone{min-height:200px;padding:2rem 1rem}}@media (max-width:480px){.title-section h1{font-size:1.5rem}.title-section p{font-size:.875rem}.upload-zone h3{font-size:1.25rem}.metadata-item{align-items:flex-start;flex-direction:column;gap:.5rem}.metadata-value{justify-content:space-between;width:100%}}.metadata-article{box-shadow:0 8px 32px var(--shadow)}.metadata-viewer.dark-mode .metadata-article{box-shadow:0 8px 32px var(--dark-shadow)}.article-container{width:100%}.metadata-viewer.dark-mode .article-header{border-bottom-color:var(--dark-border)}.metadata-viewer.dark-mode .article-header h2{color:var(--dark-text)}.metadata-viewer.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-content{display:flex;flex-direction:column;gap:3rem}.content-section{background:var(--bg-light);border-left:4px solid var(--primary);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 12px var(--shadow);padding:2rem}.metadata-viewer.dark-mode .content-section{background:var(--dark-bg-light);border-color:var(--dark-border);border-left-color:var(--primary)}.content-section h3{align-items:center;color:var(--text);display:flex;font-size:1.5rem;font-weight:600;gap:.75rem;margin:0 0 1rem}.metadata-viewer.dark-mode .content-section h3{color:var(--dark-text)}.section-icon{color:var(--primary)}.content-section h4{color:var(--text);font-size:1.2rem;font-weight:600;line-height:1.4;margin:24px 0 12px}.metadata-viewer.dark-mode .content-section h4{color:var(--dark-text)}.content-section p{color:var(--text);line-height:1.7;margin:0 0 1.5rem;text-align:left}.metadata-viewer.dark-mode .content-section p{color:var(--dark-text)}.content-section p:last-child{margin-bottom:0}.content-section ul{margin:16px 0;padding-left:24px}.content-section li{color:var(--text);font-size:1rem;line-height:1.6;margin-bottom:8px}.metadata-viewer.dark-mode .content-section li{color:var(--dark-text)}.content-section strong{color:var(--primary);font-weight:600}.feature-list{display:flex;flex-direction:column;gap:1rem;margin:1.5rem 0}.feature-item{border-left:3px solid var(--primary);color:var(--text);line-height:1.6;padding:1rem}.feature-item:hover{box-shadow:0 4px 12px var(--shadow)}.metadata-viewer.dark-mode .feature-item{border-left-color:var(--primary);color:var(--dark-text)}.feature-item strong{color:var(--primary);font-weight:600}.privacy-warning{background:var(--sensitive-bg);border:1px solid var(--sensitive-border);border-radius:12px;color:var(--danger);display:flex;gap:1rem;margin:1.5rem 0;padding:1.5rem}.metadata-viewer.dark-mode .privacy-warning{background:#e74c3c1a;border-color:var(--danger)}.privacy-warning svg{flex-shrink:0;margin-top:.125rem}.privacy-warning strong{color:var(--danger);font-weight:600}.benefit-card{background:var(--white)}.benefit-card:hover{border-color:var(--primary);box-shadow:0 8px 25px var(--shadow)}.metadata-viewer.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.metadata-viewer.dark-mode .benefit-card h4{color:var(--dark-text)}.metadata-viewer.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.concept-item{background:var(--white);border:1px solid var(--border)}.metadata-viewer.dark-mode .concept-item{background:var(--dark-bg-light);border-color:var(--dark-border);border-left-color:var(--primary)}.metadata-viewer.dark-mode .concept-item p{color:var(--dark-text)}.practice-item{background:var(--white);transition:all .3s ease}.practice-item:hover{box-shadow:0 4px 12px var(--shadow);transform:translateY(-1px)}.metadata-viewer.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.metadata-viewer.dark-mode .practice-item h4{color:var(--dark-text)}.metadata-viewer.dark-mode .practice-item p{color:var(--dark-text-secondary)}.scenario-card{box-shadow:0 2px 8px var(--shadow);transition:all .3s ease}.scenario-card:hover{box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.metadata-viewer.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.metadata-viewer.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.metadata-viewer.dark-mode .scenario-card li{color:var(--dark-text)}.tech-item{background:var(--white);transition:all .3s ease}.tech-item:hover{box-shadow:0 4px 12px var(--shadow);transform:translateY(-1px)}.metadata-viewer.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.metadata-viewer.dark-mode .tech-item h4{color:var(--dark-text)}.metadata-viewer.dark-mode .tech-item p{color:var(--dark-text-secondary)}.technique-item{transition:all .3s ease}.technique-item:hover{box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.metadata-viewer.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.metadata-viewer.dark-mode .technique-item p{color:var(--dark-text)}.mistake-item{border:1px solid #e74c3c33}.metadata-viewer.dark-mode .mistake-item{background:#e74c3c1a;border-color:var(--danger)}.metadata-viewer.dark-mode .mistake-item p{color:var(--dark-text)}.tool-category{background:var(--white);transition:all .3s ease}.tool-category:hover{box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.metadata-viewer.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.metadata-viewer.dark-mode .tool-category p{color:var(--dark-text)}.conclusion{background:linear-gradient(135deg,var(--primary) 0,var(--primary-hover) 100%);border-left-color:var(--primary)}.conclusion,.conclusion h3{color:var(--white)}.metadata-viewer.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.metadata-viewer.dark-mode .quick-tips,.metadata-viewer.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.metadata-viewer.dark-mode .quick-tips li,.metadata-viewer.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.metadata-article{margin-top:20px;padding:24px 20px}.article-header h2{font-size:1.8rem}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}@media (max-width:480px){.metadata-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.content-section h3{align-items:flex-start;flex-direction:column;font-size:1.3rem;gap:.5rem}.benefit-card,.scenario-card,.tool-category{padding:20px}}:root{--disabled:#bdc3c7;--disabled-dark:#636e72;--canvas-bg:#fafbfc;--canvas-checker:#e0e0e0;--picker-cursor:red;--selection-highlight:#3498db4d;--grid-color:#0000001a}.background-remover{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.background-remover.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.header-section{transition:border-color .3s ease}.background-remover.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.upload-section{background:#f8fafc;background:var(--bg-light);position:relative}.upload-section.drag-over,.upload-section:hover{background:#3498db0d}.upload-section.has-image{cursor:default;padding:20px}.background-remover.dark-mode .upload-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.upload-content svg{transition:color .3s ease}.upload-content h3{justify-content:center}.upload-hint{color:#7f8c8d;color:var(--text-light);font-size:.85rem!important;margin-top:8px!important}.upload-button svg{flex-shrink:0}.upload-button svg,.upload-button:hover svg{color:#fff;color:var(--white)}.uploaded-image-preview{position:relative}.uploaded-image-preview img{border-radius:8px;box-shadow:0 4px 12px #0000001a;transition:box-shadow .3s ease}.change-image-button{align-items:center;background:#3498db;background:var(--primary);border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;gap:6px;padding:8px 16px;position:absolute;right:10px;top:10px;transition:all .3s ease}.change-image-button:hover{background:#2980b9;background:var(--primary-hover)}.threshold-controls{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px;transition:background .3s ease,border-color .3s ease}.background-remover.dark-mode .threshold-controls{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.control-header{margin-bottom:20px}.control-header h3{color:inherit;font-size:1.2rem;gap:8px}.settings-toggle{gap:6px}.selection-mode{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:24px}.mode-selector{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;display:flex;gap:8px;padding:4px;transition:background .3s ease,border-color .3s ease}.background-remover.dark-mode .mode-selector{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.mode-selector button{align-items:center;background:#0000;border:none;border-radius:6px;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-size:.9rem;gap:6px;padding:10px 20px;transition:all .3s ease}.mode-selector button.active{background:#3498db;background:var(--primary);color:#fff}.background-remover.dark-mode .mode-selector button{color:#f7fafc;color:var(--dark-text)}.color-picker-button{align-items:center;background:#0000;border:2px solid #3498db;border:2px solid var(--primary);border-radius:8px;color:#3498db;color:var(--primary);cursor:pointer;display:flex;font-size:.9rem;gap:6px;padding:10px 20px;transition:all .3s ease}.color-picker-button.active{background:#3498db;background:var(--primary);color:#fff}.color-swatch{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:4px;height:20px;transition:border-color .3s ease;width:20px}.background-remover.dark-mode .color-swatch{border-color:#4a5568;border-color:var(--dark-border)}.threshold-slider-group,.tolerance-slider-group{margin-bottom:20px;transition:opacity .3s ease}.threshold-slider-group.disabled,.tolerance-slider-group.disabled{opacity:.5;pointer-events:none}.threshold-slider-group label,.tolerance-slider-group label{display:flex;font-size:.95rem;font-weight:600;justify-content:space-between;margin-bottom:8px}.threshold-slider-group span,.tolerance-slider-group span{color:#3498db;color:var(--primary);font-weight:700}.threshold-slider,.tolerance-slider{-webkit-appearance:none;appearance:none;background:#e1e8ed;background:var(--border);border-radius:3px;height:6px;outline:none;transition:background .3s ease;width:100%}.threshold-slider::-webkit-slider-thumb,.tolerance-slider::-webkit-slider-thumb{-webkit-appearance:none;background:#3498db;background:var(--primary);border-radius:50%;box-shadow:0 2px 6px #0003;cursor:pointer;height:20px;-webkit-transition:transform .3s ease;transition:transform .3s ease;width:20px}.threshold-slider:hover::-webkit-slider-thumb,.tolerance-slider:hover::-webkit-slider-thumb{transform:scale(1.1)}.preset-thresholds{margin-bottom:20px}.preset-thresholds label{display:block;font-size:.95rem;font-weight:600;margin-bottom:10px}.preset-buttons{display:flex;flex-wrap:wrap;gap:8px}.preset-button{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;cursor:pointer;font-size:.85rem;padding:8px 16px;transition:all .3s ease}.preset-button:hover{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.background-remover.dark-mode .preset-button{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.fine-tuning{border-top:1px solid #e1e8ed;border-top:1px solid var(--border);margin-top:24px;padding-top:24px;transition:border-color .3s ease}.background-remover.dark-mode .fine-tuning{border-top-color:#4a5568;border-top-color:var(--dark-border)}.fine-tuning h4{align-items:center;color:inherit;display:flex;font-size:1.1rem;gap:8px;margin:0 0 16px}.tuning-controls{grid-gap:16px;display:grid;gap:16px}.control-group label{display:flex;font-size:.9rem;justify-content:space-between}.control-group input[type=range]{-webkit-appearance:none;appearance:none;background:#e1e8ed;background:var(--border);border-radius:3px;height:5px;outline:none;transition:background .3s ease;width:100%}.control-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#3498db;background:var(--primary);border-radius:50%;cursor:pointer;height:16px;-webkit-transition:transform .3s ease;transition:transform .3s ease;width:16px}.control-group input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.1)}.checkbox-group{gap:24px;margin-top:12px}.checkbox-group label{font-size:.9rem;gap:8px}.checkbox-group input[type=checkbox]{cursor:pointer;height:18px;width:18px}.advanced-settings{background:#fff;background:var(--white);margin-top:20px;transition:background .3s ease,border-color .3s ease}.background-remover.dark-mode .advanced-settings{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h4{color:inherit;font-size:1.1rem;margin:0 0 16px}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.background-remover.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.setting-group input[type=range],.setting-group select{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);font-size:.9rem;padding:10px;transition:border-color .3s ease}.setting-group input[type=range]:focus,.setting-group select:focus{border-color:#3498db;border-color:var(--primary)}.background-remover.dark-mode .setting-group select{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.color-input-wrapper{align-items:center;display:flex;gap:8px}.color-input-wrapper input[type=color]{border:none;border-radius:6px;cursor:pointer;height:38px;width:50px}.color-input-wrapper input[type=text]{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;flex:1 1;font-size:.9rem;padding:10px;transition:border-color .3s ease}.color-input-wrapper input[type=text]:focus{border-color:#3498db;border-color:var(--primary)}.preview-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px;transition:background .3s ease,border-color .3s ease}.background-remover.dark-mode .preview-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.preview-header{margin-bottom:20px}.preview-header h3{color:inherit;font-size:1.2rem;gap:8px}.preview-controls{align-items:center;gap:8px}.grid-toggle,.live-toggle,.preview-toggle,.zoom-button{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;cursor:pointer;display:flex;font-size:.85rem;gap:6px;padding:8px 12px;transition:all .3s ease}.grid-toggle.active,.live-toggle.active,.preview-toggle.active{background:#3498db;background:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff}.zoom-level{color:#3498db;color:var(--primary);font-size:.9rem;font-weight:600;margin-left:8px}.background-remover.dark-mode .grid-toggle,.background-remover.dark-mode .live-toggle,.background-remover.dark-mode .preview-toggle,.background-remover.dark-mode .zoom-button{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.preview-container{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;justify-content:center;min-height:400px;overflow:auto;padding:20px;position:relative;transition:background .3s ease,border-color .3s ease}.background-remover.dark-mode .preview-container{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.preview-canvas,.preview-image{border-radius:8px;max-width:100%;transition:transform .3s ease}.preview-canvas.show-grid,.preview-image.show-grid{background-image:linear-gradient(45deg,#e0e0e0 25%,#0000 0),linear-gradient(-45deg,#e0e0e0 25%,#0000 0),linear-gradient(45deg,#0000 75%,#e0e0e0 0),linear-gradient(-45deg,#0000 75%,#e0e0e0 0);background-image:linear-gradient(45deg,var(--canvas-checker) 25%,#0000 25%),linear-gradient(-45deg,var(--canvas-checker) 25%,#0000 25%),linear-gradient(45deg,#0000 75%,var(--canvas-checker) 75%),linear-gradient(-45deg,#0000 75%,var(--canvas-checker) 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.preview-canvas.color-picker-active{cursor:crosshair!important}.image-info{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;display:flex;gap:24px;justify-content:center;margin-top:20px;padding:16px;transition:background .3s ease,border-color .3s ease}.background-remover.dark-mode .image-info{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.info-item{gap:8px}.info-value{color:#3498db;color:var(--primary)}.secondary{transition:background .3s ease,transform .3s ease}.background-remover.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tips-section{background:linear-gradient(135deg,#f8fafc,#fff);background:linear-gradient(135deg,var(--bg-light) 0,var(--white) 100%);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:24px;transition:background .3s ease,border-color .3s ease}.background-remover.dark-mode .tips-section{background:linear-gradient(135deg,#2d3748,#1a202c);background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:#4a5568;border-color:var(--dark-border)}.tips-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 20px}.tips-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.tip-card{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;display:flex;gap:12px;padding:16px;transition:transform .3s ease,box-shadow .3s ease}.tip-card:hover{box-shadow:0 4px 12px #1018280a;box-shadow:0 4px 12px var(--shadow);transform:translateY(-2px)}.background-remover.dark-mode .tip-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.tip-card svg{color:#2ecc71;color:var(--success);flex-shrink:0}.tip-card h4{color:inherit;font-size:.95rem;font-weight:600;margin:0 0 4px}.tip-card p{color:#7f8c8d;color:var(--text-light);font-size:.85rem;line-height:1.4;margin:0}.background-remover.dark-mode .tip-card p{color:#a0aec0;color:var(--dark-text-secondary)}.related-tools-section{transition:border-color .3s ease}.background-remover.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.tool-card:hover{background:#3498db;background:var(--primary)}.tool-card:hover,.tool-card:hover h4,.tool-card:hover p,.tool-card:hover svg{color:#fff;color:var(--white)}.background-remover.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.background-remover.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.background-remover{padding:24px}.related-tools-grid,.settings-grid,.tips-grid{grid-template-columns:1fr}}@media (max-width:768px){.background-remover{margin:16px;padding:20px}.header-section{gap:16px;text-align:center}.header-section,.selection-mode{flex-direction:column}.mode-selector{flex-wrap:wrap;justify-content:center;width:100%}.preset-buttons{display:grid;grid-template-columns:1fr 1fr}.preview-controls{flex-wrap:wrap;justify-content:center}.primary-actions,.secondary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:300px;width:100%}.checkbox-group{flex-direction:column;gap:12px}.tuning-controls{grid-template-columns:1fr}}@media (max-width:480px){.header-section h1{font-size:1.8rem}.upload-section{padding:24px}.preview-section,.threshold-controls{padding:16px}}.background-remover-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px}.background-remover.dark-mode .background-remover-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.background-remover.dark-mode .article-header{border-bottom-color:var(--dark-border)}.background-remover.dark-mode .article-header h2{color:var(--dark-text)}.background-remover.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.background-remover.dark-mode .article-section h3,.background-remover.dark-mode .article-section h4,.background-remover.dark-mode .article-section li,.background-remover.dark-mode .article-section p{color:var(--dark-text)}.background-remover.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.background-remover.dark-mode .benefit-card h4{color:var(--dark-text)}.background-remover.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.background-remover.dark-mode .concept-item{background:var(--dark-bg-light)}.background-remover.dark-mode .concept-item p{color:var(--dark-text)}.background-remover.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.background-remover.dark-mode .practice-item h4{color:var(--dark-text)}.background-remover.dark-mode .practice-item p{color:var(--dark-text-secondary)}.background-remover.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.background-remover.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.background-remover.dark-mode .scenario-card li{color:var(--dark-text)}.background-remover.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.background-remover.dark-mode .tech-item h4{color:var(--dark-text)}.background-remover.dark-mode .tech-item p{color:var(--dark-text-secondary)}.background-remover.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.background-remover.dark-mode .technique-item p{color:var(--dark-text)}.background-remover.dark-mode .mistake-item{background:#e74c3c1a}.background-remover.dark-mode .mistake-item p{color:var(--dark-text)}.background-remover.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.background-remover.dark-mode .tool-category p{color:var(--dark-text)}.conclusion p{margin-bottom:16px}.conclusion p:last-child{margin-bottom:0}.background-remover.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.background-remover.dark-mode .quick-tips,.background-remover.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.background-remover.dark-mode .quick-tips li,.background-remover.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.background-remover-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}@media (max-width:480px){.background-remover-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.concept-item,.tech-item,.technique-item{padding:16px}.mistake-item{padding:12px 16px}.quick-tips,.related-articles{padding:20px}}@media print{.background-remover-article{border:none;box-shadow:none;padding:0}.article-sidebar{display:none}.conclusion{background:none;border:2px solid var(--primary);padding:20px}.conclusion,.conclusion h3,.conclusion p{color:var(--text)}}.image-brightness-contrast{background:linear-gradient(135deg,#667eea,#764ba2);color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;margin:0 auto;max-width:1200px;min-height:100vh;padding:2rem}.image-brightness-contrast.dark-mode{background:linear-gradient(135deg,#2c3e50,#3498db);color:#e0e0e0}.upload-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border:3px dashed #bbb;border-radius:12px;margin-bottom:2rem;padding:3rem}.dark-mode .upload-section{background:#0000004d;border-color:#555}.upload-section.drag-over,.upload-section:hover{background:#3498db1a}.upload-content h3{color:#2c3e50;font-size:1.5rem;margin:1rem 0}.dark-mode .upload-content h3{color:#ecf0f1}.upload-button{background:#3498db;gap:.5rem;margin-top:1rem;padding:1rem 2rem}.upload-button:hover{background:#2980b9}.image-selection{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;margin-bottom:2rem;padding:1.5rem}.dark-mode .image-selection{background:#0000004d}.image-selection h3{align-items:center;color:#2c3e50;display:flex;gap:.5rem;margin-bottom:1rem}.dark-mode .image-selection h3{color:#ecf0f1}.image-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.image-thumbnail{background:#f8f9fa;border:2px solid #0000;border-radius:8px;cursor:pointer;padding:1rem;transition:all .3s ease}.dark-mode .image-thumbnail{background:#2c3e50}.image-thumbnail.selected,.image-thumbnail:hover{border-color:#3498db;box-shadow:0 4px 15px #3498db4d;transform:translateY(-2px)}.image-thumbnail canvas{border-radius:4px;box-shadow:0 2px 10px #0000001a;height:auto;max-width:150px;width:100%}.thumbnail-info{font-size:.9rem;margin-top:.5rem}.filename{color:#2c3e50;margin-bottom:.25rem;word-break:break-word}.dark-mode .filename{color:#ecf0f1}.dimensions{color:#7f8c8d;font-size:.8rem}.adjustment-controls{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;margin-bottom:2rem;padding:1.5rem}.dark-mode .adjustment-controls{background:#0000004d}.preset-selection h4{font-size:1.1rem}.preset-grid{grid-gap:.75rem;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.preset-item{padding:.75rem 1rem}.basic-controls{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.input-group{display:flex;flex-direction:column;gap:.5rem}.control-slider{transition:background .3s ease}.input-group select{background:#fff;border:1px solid #ddd;border-radius:6px;color:#2c3e50;font-size:1rem;padding:.75rem}.dark-mode .input-group select{background:#2c3e50;border-color:#555;color:#ecf0f1}.advanced-settings{border-top:2px solid #ecf0f1;padding-top:1.5rem}.dark-mode .advanced-settings{border-color:#34495e}.advanced-settings h4{color:#34495e;margin-bottom:1rem}.dark-mode .advanced-settings h4{color:#bdc3c7}.preview-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;margin-bottom:2rem;padding:1.5rem}.dark-mode .preview-section{background:#0000004d}.preview-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.preview-header h3{align-items:center;color:#2c3e50;display:flex;gap:.5rem;margin:0}.dark-mode .preview-header h3{color:#ecf0f1}.preview-controls{display:flex;gap:.5rem}.grid-toggle,.preview-mode-toggle{align-items:center;background:#95a5a6;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;gap:.5rem;padding:.5rem 1rem;transition:all .3s ease}.grid-toggle:hover,.preview-mode-toggle:hover{background:#7f8c8d}.grid-toggle.active,.preview-mode-toggle.active{background:#3498db}.preview-comparison{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:1fr 1fr}.preview-single{display:flex;justify-content:center}.preview-item{text-align:center}.preview-item h4{color:#2c3e50;margin-bottom:1rem}.dark-mode .preview-item h4{color:#ecf0f1}.preview-canvas-wrapper{background:#fff;border:2px solid #ecf0f1;border-radius:8px;display:inline-block;padding:1rem}.dark-mode .preview-canvas-wrapper{background:#2c3e50;border-color:#34495e}.preview-canvas{border-radius:4px;height:auto;max-width:300px}.preview-canvas.show-grid{background-image:linear-gradient(45deg,#ccc 25%,#0000 0),linear-gradient(-45deg,#ccc 25%,#0000 0),linear-gradient(45deg,#0000 75%,#ccc 0),linear-gradient(-45deg,#0000 75%,#ccc 0);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.primary-actions{gap:1rem}.secondary-actions{gap:.75rem}.download-button,.process-button{align-items:center;background:linear-gradient(135deg,#3498db,#2980b9);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.1rem;font-weight:600;gap:.5rem;padding:1rem 2rem;transition:all .3s ease}.download-button:hover,.process-button:hover{box-shadow:0 6px 20px #3498db66;transform:translateY(-2px)}.download-button:disabled,.process-button:disabled{cursor:not-allowed;opacity:.7;transform:none}.secondary{align-items:center;background:#95a5a6;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;gap:.5rem;padding:.75rem 1.25rem;transition:all .3s ease}.secondary:hover{background:#7f8c8d}@media (max-width:768px){.image-brightness-contrast{padding:1rem}.header-section{flex-direction:column;gap:1rem;text-align:center}.header-section h1{font-size:1.5rem}.image-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.basic-controls,.preview-comparison{grid-template-columns:1fr}.preview-comparison{gap:1rem}.primary-actions,.secondary-actions{flex-direction:column}}.text-formatter{background:linear-gradient(135deg,#667eea,#764ba2);color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;margin:0 auto;max-width:1400px;min-height:100vh;padding:2rem}.text-formatter.dark-mode{background:linear-gradient(135deg,#2c3e50,#3498db);color:#e0e0e0}.main-content{grid-template-columns:1fr 400px 1fr}.input-section,.output-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;box-shadow:0 4px 20px #0000001a;padding:1.5rem}.dark-mode .input-section,.dark-mode .output-section{background:#0000004d}.settings-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;max-height:80vh;overflow-y:auto;padding:1.5rem}.dark-mode .settings-section{background:#0000004d}.input-actions,.output-actions{gap:.5rem}.copy-button,.download-button,.file-upload-button{align-items:center;background:#3498db;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;gap:.5rem;padding:.5rem 1rem;transition:all .3s ease}.copy-button:hover,.download-button:hover,.file-upload-button:hover{background:#2980b9;transform:translateY(-1px)}.copy-button:disabled,.download-button:disabled{background:#95a5a6;cursor:not-allowed;transform:none}.input-textarea{background:#fff;border:1px solid #ddd;border-radius:8px;color:#333;font-family:Courier New,Monaco,monospace;font-size:.9rem;line-height:1.5;min-height:300px;padding:1rem;resize:vertical;width:100%}.dark-mode .input-textarea{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.input-textarea:focus{border-color:#3498db;box-shadow:0 0 0 2px #3498db33;outline:none}.text-stats{border-top:1px solid #eee;display:flex;flex-wrap:wrap;gap:1rem;margin-top:1rem;padding-top:1rem}.dark-mode .text-stats{border-color:#34495e}.stat-item{flex-direction:column;min-width:80px}.stat-value{font-size:1.2rem}.stat-label{font-size:.8rem;margin-top:.25rem}.control-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.control-header h3{align-items:center;color:#2c3e50;display:flex;gap:.5rem;margin:0}.dark-mode .control-header h3{color:#ecf0f1}.settings-toggle{background:#95a5a6;gap:.5rem;padding:.5rem 1rem}.settings-toggle:hover{background:#7f8c8d}.preset-selection{margin-bottom:1.5rem}.preset-selection h4{color:#34495e;font-size:1rem;margin-bottom:1rem}.dark-mode .preset-selection h4{color:#bdc3c7}.preset-grid{grid-gap:.5rem;display:grid;gap:.5rem;grid-template-columns:1fr}.preset-item{align-items:center;background:#ecf0f1;border:none;border-radius:6px;cursor:pointer;display:flex;font-weight:500;gap:.5rem;padding:.75rem;text-align:left;transition:all .3s ease}.dark-mode .preset-item{background:#34495e;color:#ecf0f1}.preset-item:hover{background:#3498db;color:#fff;transform:translateY(-1px)}.basic-controls{margin-bottom:1.5rem}.control-group{margin-bottom:1rem}.control-group label{color:#2c3e50;display:block;font-weight:600;margin-bottom:.5rem}.dark-mode .control-group label{color:#ecf0f1}.control-group input[type=text],.control-group select{background:#fff;border:1px solid #ddd;border-radius:4px;color:#333;font-size:.9rem;padding:.5rem;width:100%}.dark-mode .control-group input[type=text],.dark-mode .control-group select{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.alignment-buttons{display:flex;gap:.25rem}.align-btn{align-items:center;background:#ecf0f1;border:2px solid #0000;border-radius:6px;cursor:pointer;display:flex;height:40px;justify-content:center;transition:all .3s ease;width:40px}.dark-mode .align-btn{background:#34495e;color:#ecf0f1}.align-btn.active,.align-btn:hover{background:#3498db;border-color:#2980b9;color:#fff}.checkbox-group{display:flex;flex-direction:column;gap:.5rem}.checkbox-group label{align-items:center;cursor:pointer;display:flex;font-weight:400;gap:.5rem}.checkbox-group input[type=checkbox]{accent-color:#3498db;height:16px;width:16px}.control-slider{-webkit-appearance:none;appearance:none;background:#ddd;border-radius:3px;height:6px;margin-top:.5rem;outline:none;width:100%}.dark-mode .control-slider{background:#555}.control-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#3498db;border-radius:50%;cursor:pointer;height:20px;-webkit-transition:all .3s ease;transition:all .3s ease;width:20px}.control-slider::-webkit-slider-thumb:hover{background:#2980b9;transform:scale(1.1)}.control-slider::-moz-range-thumb{background:#3498db;border:none;border-radius:50%;cursor:pointer;height:20px;width:20px}.advanced-controls{border-top:1px solid #eee;padding-top:1.5rem}.dark-mode .advanced-controls{border-color:#34495e}.advanced-controls h4{color:#34495e;font-size:1rem;margin-bottom:1rem}.dark-mode .advanced-controls h4{color:#bdc3c7}.action-buttons{display:flex;justify-content:center;margin-top:1.5rem}.reset-button{align-items:center;background:#e74c3c;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:.5rem;padding:.75rem 1.5rem;transition:all .3s ease}.reset-button:hover{background:#c0392b;transform:translateY(-2px)}.output-container{background:#f8f9fa;border:1px solid #ddd;border-radius:8px;max-height:500px;min-height:300px;overflow-y:auto;padding:1rem}.dark-mode .output-container{background:#2c3e50;border-color:#34495e}.output-text{color:#2c3e50;font-family:Courier New,Monaco,monospace;font-size:.9rem;line-height:1.5;margin:0;white-space:pre-wrap}.dark-mode .output-text{color:#ecf0f1}.bottom-actions{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;display:flex;gap:1rem;justify-content:center;padding:1.5rem}.dark-mode .bottom-actions{background:#0000004d}.clear-all,.toggle-preview{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-weight:600;gap:.5rem;padding:.75rem 1.5rem;transition:all .3s ease}.toggle-preview{background:#3498db;color:#fff}.toggle-preview:hover{background:#2980b9;transform:translateY(-2px)}.clear-all{background:#95a5a6;color:#fff}.clear-all:hover{background:#7f8c8d;transform:translateY(-2px)}@media (max-width:1200px){.main-content{gap:1.5rem;grid-template-columns:1fr}.settings-section{max-height:none;overflow-y:visible}}@media (max-width:768px){.text-formatter{padding:1rem}.header-section{flex-direction:column;gap:1rem;text-align:center}.header-section h1{font-size:1.5rem}.main-content{gap:1rem;grid-template-columns:1fr}.text-stats{justify-content:center}.preset-grid{grid-template-columns:1fr}.alignment-buttons{justify-content:center}.bottom-actions{flex-direction:column}}.output-container::-webkit-scrollbar,.settings-section::-webkit-scrollbar{width:8px}.output-container::-webkit-scrollbar-track,.settings-section::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.dark-mode .output-container::-webkit-scrollbar-track,.dark-mode .settings-section::-webkit-scrollbar-track{background:#34495e}.output-container::-webkit-scrollbar-thumb,.settings-section::-webkit-scrollbar-thumb{background:#3498db;border-radius:4px}.output-container::-webkit-scrollbar-thumb:hover,.settings-section::-webkit-scrollbar-thumb:hover{background:#2980b9}.statistics-calculator{background:linear-gradient(135deg,#667eea,#764ba2);color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;margin:0 auto;max-width:1400px;min-height:100vh;padding:2rem}.statistics-calculator.dark-mode{background:linear-gradient(135deg,#2c3e50,#3498db);color:#e0e0e0}.main-content{grid-template-columns:400px 1fr}.input-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;box-shadow:0 4px 20px #0000001a;height:-webkit-fit-content;height:fit-content;padding:1.5rem}.dark-mode .input-section{background:#0000004d}.section-header{margin-bottom:1rem}.section-header h2{color:#2c3e50;font-size:1.25rem;margin:0}.dark-mode .section-header h2{color:#ecf0f1}.input-actions{display:flex;gap:.5rem}.add-button,.clear-button,.remove-button{align-items:center;border:none;border-radius:6px;cursor:pointer;display:flex;font-size:.85rem;gap:.5rem;padding:.5rem;transition:all .3s ease}.add-button{background:#27ae60;color:#fff}.add-button:hover:not(:disabled){background:#219a52}.remove-button{background:#f39c12}.remove-button:hover:not(:disabled){background:#e67e22}.add-button:disabled,.remove-button:disabled{background:#95a5a6;cursor:not-allowed}.data-input{background:#fff;border:1px solid #ddd;border-radius:8px;color:#333;font-family:Courier New,Monaco,monospace;font-size:.9rem;line-height:1.5;margin-bottom:1.5rem;padding:1rem;resize:vertical;width:100%}.dark-mode .data-input{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.data-input:focus{border-color:#3498db;box-shadow:0 0 0 2px #3498db33;outline:none}.sample-datasets{margin-bottom:1.5rem}.sample-datasets h3{color:#34495e;font-size:1rem;margin-bottom:1rem}.dark-mode .sample-datasets h3{color:#bdc3c7}.sample-grid{grid-gap:.75rem;display:grid;gap:.75rem}.sample-button{align-items:center;background:#ecf0f1;border:none;border-radius:8px;cursor:pointer;display:flex;gap:.75rem;padding:1rem;text-align:left;transition:all .3s ease}.dark-mode .sample-button{background:#34495e;color:#ecf0f1}.sample-button:hover{background:#3498db;color:#fff;transform:translateY(-2px)}.sample-name{font-size:.9rem;font-weight:600}.sample-desc{font-size:.8rem;opacity:.8}.data-summary{background:#f8f9fa;border:1px solid #ddd;border-radius:8px;padding:1rem}.dark-mode .data-summary{background:#2c3e50;border-color:#34495e}.summary-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:.5rem}.summary-header h4{color:#2c3e50;font-size:.95rem;margin:0}.dark-mode .summary-header h4{color:#ecf0f1}.sort-controls{align-items:center;display:flex;font-size:.85rem;gap:.5rem}.sort-controls label{color:#7f8c8d}.sort-controls select{border:1px solid #ddd;border-radius:4px;font-size:.85rem;padding:.25rem}.dark-mode .sort-controls select{background:#34495e;border-color:#555;color:#ecf0f1}.data-preview{color:#555;font-family:Courier New,Monaco,monospace;font-size:.85rem;word-break:break-all}.dark-mode .data-preview{color:#bdc3c7}.statistics-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:2rem}.stat-card{background:#f8f9fa;padding:1.5rem}.dark-mode .stat-card{background:#2c3e50;border-left-color:#3498db}.stat-card.primary{border-left-color:#e74c3c}.stat-card.advanced{border-left-color:#f39c12}.stat-header{align-items:center;display:flex;gap:.5rem;margin-bottom:1rem}.stat-header h3{color:#2c3e50;font-size:1.1rem;margin:0}.dark-mode .stat-header h3{color:#ecf0f1}.stat-items{grid-gap:.75rem;display:grid;gap:.75rem}.stat-item{border-bottom:1px solid #eee;padding:.5rem 0}.dark-mode .stat-item{border-color:#34495e}.stat-item:last-child{border-bottom:none}.interpretation{border-top:1px solid #eee;margin-top:1rem;padding-top:1rem}.dark-mode .interpretation{border-color:#34495e}.interpretation h4{color:#34495e;font-size:.95rem;margin:0 0 .5rem}.dark-mode .interpretation h4{color:#bdc3c7}.interpretation ul{margin:0;padding-left:1.5rem}.interpretation li{color:#555;font-size:.9rem;margin-bottom:.5rem}.dark-mode .interpretation li{color:#bdc3c7}.controls-section{margin-bottom:2rem}.toggle-buttons{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.download-button,.toggle-button{border-radius:8px;font-weight:600;padding:.75rem 1.5rem}.toggle-button{background:#3498db}.toggle-button:hover{background:#2980b9}.download-button:hover,.toggle-button:hover{transform:translateY(-2px)}.chart-section,.frequency-section{margin-bottom:2rem}.chart-section h3,.frequency-section h3{align-items:center;color:#2c3e50;display:flex;gap:.5rem;margin-bottom:1rem}.dark-mode .chart-section h3,.dark-mode .frequency-section h3{color:#ecf0f1}.frequency-table{border:1px solid #ddd;border-radius:8px;overflow:hidden}.dark-mode .frequency-table{border-color:#34495e}.table-header{background:#3498db;color:#fff;display:grid;grid-template-columns:1fr 1fr 1fr 1fr}.table-header div{padding:1rem;text-align:center}.table-body{background:#fff}.dark-mode .table-body{background:#2c3e50}.table-row{border-bottom:1px solid #eee;display:grid;grid-template-columns:1fr 1fr 1fr 1fr}.dark-mode .table-row{border-color:#34495e}.table-row:last-child{border-bottom:none}.table-row:hover{background:#f8f9fa}.dark-mode .table-row:hover{background:#34495e}.table-row div{font-family:Courier New,Monaco,monospace;font-size:.9rem;padding:.75rem;text-align:center}.chart-container{background:#fff;border:1px solid #ddd;border-radius:8px;padding:2rem}.dark-mode .chart-container{background:#2c3e50;border-color:#34495e}.histogram{align-items:end;border-bottom:2px solid #333;border-left:2px solid #333;display:flex;gap:.25rem;height:200px;padding:1rem 0}.dark-mode .histogram{border-color:#ecf0f1}.histogram-bar{background:linear-gradient(0deg,#3498db,#5dade2);border-radius:4px 4px 0 0;cursor:pointer;flex:1 1;min-height:20px;position:relative;transition:all .3s ease}.histogram-bar:hover{background:linear-gradient(0deg,#2980b9,#3498db);transform:translateY(-2px)}.bar-label{bottom:-25px;color:#333;font-size:.7rem;left:50%;position:absolute;transform:translateX(-50%);writing-mode:horizontal-tb}.dark-mode .bar-label{color:#ecf0f1}.bar-count{color:#333;font-size:.7rem;font-weight:600;left:50%;position:absolute;top:-20px;transform:translateX(-50%)}.dark-mode .bar-count{color:#ecf0f1}.info-section{margin-top:2rem}.dark-mode .info-card{border-left-color:#3498db}@media (max-width:1200px){.main-content{gap:1.5rem;grid-template-columns:1fr}.statistics-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}}@media (max-width:768px){.statistics-calculator{padding:1rem}.header-section{flex-direction:column;gap:1rem;text-align:center}.header-section h1{font-size:1.5rem}.section-header{align-items:stretch;flex-direction:column;gap:1rem}.input-actions{justify-content:center}.statistics-grid{grid-template-columns:1fr}.summary-header,.toggle-buttons{flex-direction:column}.summary-header{align-items:stretch;gap:.5rem}.table-header,.table-row{gap:1px;grid-template-columns:1fr 1fr}.table-header div:nth-child(3),.table-header div:nth-child(4),.table-row div:nth-child(3),.table-row div:nth-child(4){display:none}.histogram{height:150px}.bar-label{font-size:.6rem}}.csv-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.csv-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.csv-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.file-upload-section{margin-bottom:24px}.upload-area{align-items:center;border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;display:flex;gap:16px;padding:20px}.csv-converter.dark-mode .upload-area{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.csv-converter.dark-mode .upload-area:hover{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.upload-button{border-radius:8px;display:flex;gap:8px;padding:12px 20px}.upload-button:hover{box-shadow:0 4px 12px #3498db4d}.file-name{color:#2c3e50;font-weight:500}.csv-converter.dark-mode .file-name{color:#f7fafc;color:var(--dark-text)}.csv-converter.dark-mode .input-section,.csv-converter.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-section textarea,.output-section textarea{flex:1 1 auto;font-family:Inter,sans-serif;font-size:1rem;min-height:280px}.csv-converter.dark-mode .input-section textarea,.csv-converter.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.char-count,.conversion-stats{color:#7f8c8d;color:var(--text-light);font-size:.85rem;margin-top:12px;text-align:right}.csv-converter.dark-mode .char-count,.csv-converter.dark-mode .conversion-stats{color:#a0aec0;color:var(--dark-text-secondary)}.error-message{border:1px solid #e74c3c4d}.csv-converter.dark-mode .error-message{background-color:#e74c3c26;border-color:#e74c3c66}.clear-button:hover:not(:disabled){background-color:#c0392b;transform:translateY(-1px)}.copy-button,.download-button{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}.copy-button:hover:not(:disabled),.download-button:hover:not(:disabled){background-color:#27ae60;transform:translateY(-1px)}.quick-actions{margin-bottom:30px}.settings-toggle:hover:not(:disabled){background-color:#3498db1a}.csv-converter.dark-mode .settings-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.csv-converter.dark-mode .settings-toggle:hover:not(:disabled){background-color:#3498db33}.csv-converter.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.csv-converter.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.csv-converter.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group input[type=checkbox]{width:auto}.reset-settings:hover:not(:disabled){background-color:#e67e22;transform:translateY(-1px)}.csv-converter.dark-mode .related-tools-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.related-tool-card{background:#fff;background:var(--white);cursor:pointer;padding:16px}.csv-converter.dark-mode .related-tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.csv-converter.dark-mode .related-tool-card:hover{box-shadow:0 4px 12px #0000004d}.tool-info h4{font-size:.95rem;font-weight:600}.csv-converter.dark-mode .tool-info p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.csv-converter{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.input-output-container{grid-template-columns:1fr}.upload-area{text-align:center}.primary-actions,.upload-area{flex-direction:column}.related-tools-grid,.settings-grid{grid-template-columns:1fr}.section-header{align-items:flex-start;flex-direction:column;gap:8px}.input-actions,.output-actions{justify-content:flex-end;width:100%}}.json-formatter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.json-formatter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.json-formatter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.tool-icon{font-size:1.8rem}.input-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.json-formatter.dark-mode .input-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-section textarea,.output-section textarea{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.95rem;line-height:1.6;min-height:300px;outline:none;padding:16px;resize:vertical;transition:all .3s ease;width:100%}.input-section textarea:focus,.output-section textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.input-section textarea.error{border-color:#e74c3c;border-color:var(--danger);box-shadow:0 0 0 3px #e74c3c1a}.json-formatter.dark-mode .input-section textarea,.json-formatter.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.output-display{background-color:#f8fafc!important;background-color:var(--bg-light)!important}.json-formatter.dark-mode .output-display{background-color:#2d3748!important;background-color:var(--dark-bg-light)!important}.input-meta{margin-top:12px}.char-count{margin-bottom:8px}.json-formatter.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.validation-errors{margin-top:8px}.error-message{border:1px solid #e74c3c33;font-size:.9rem;margin-bottom:4px;padding:8px 12px}.validation-success{background-color:#2ecc711a;border:1px solid #2ecc7133;border-radius:8px;color:#2ecc71;color:var(--success);font-size:.9rem;margin-top:8px;padding:8px 12px}.json-formatter.dark-mode .settings-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.json-formatter.dark-mode .settings-toggle:hover{background-color:#3498db33}.json-formatter.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.json-formatter.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.setting-group label input[type=checkbox]{margin-right:8px}.json-formatter.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.json-formatter.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.output-section{border-radius:12px}.json-formatter.dark-mode .history-item,.json-formatter.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.json-formatter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.history-text .converted,.history-text .original{margin-bottom:4px}.json-formatter.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.history-more{font-style:italic}.json-formatter.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}.json-formatter.dark-mode .related-tools{border-top-color:#4a5568;border-top-color:var(--dark-border)}.related-tools h3{font-size:1.3rem;text-align:center}.json-formatter.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tool-card .tool-icon{flex-shrink:0;font-size:2rem}.tool-info h4{color:#3498db;color:var(--primary)}.tool-info p{line-height:1.4}.json-formatter.dark-mode .tool-info p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.json-formatter{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.section-header{align-items:flex-start;flex-direction:column;gap:12px}.input-actions,.output-actions{justify-content:space-between;width:100%}.primary-actions{flex-direction:column}.settings-grid,.tools-grid{grid-template-columns:1fr}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-button{align-self:flex-end;margin-left:0}}.feature-item{transition:transform .2s ease}.feature-item h4{color:var(--primary);font-size:1rem;margin-bottom:.6rem;margin-top:0}.feature-item p{color:var(--text)}.fun-fact{margin-top:1rem}.code-block{border-radius:12px}.code-block h4{margin-bottom:1rem}pre{color:var(--text);line-height:1.6;word-break:break-word}code{background:#3498db1a;border-radius:4px;color:var(--primary);font-family:Courier New,monospace;font-size:.9rem;padding:2px 6px}.steps{counter-reset:step-counter}.steps li{counter-increment:step-counter;padding-left:.5rem;position:relative}.steps li::marker{color:var(--primary);font-weight:700}.faq-item{border-radius:12px}.faq-item h3{margin-bottom:1rem}.faq-item p{color:var(--text)}.advantages li:before{font-size:1.2rem}.cta-section h2{margin-bottom:1.5rem}.cta-section p{line-height:1.7}.cta-features{max-width:600px}.cta-features .advantages li{margin-bottom:.8rem}.cta-action{background:#3498db1a;font-size:1.3rem}table{border:1px solid var(--border);border-radius:8px;overflow:hidden}td,th{border-bottom:1px solid var(--border);padding:1rem;text-align:left}th{background:var(--bg-light);color:var(--primary);font-weight:600}td{font-family:Courier New,monospace;font-size:.9rem}tr:last-child td{border-bottom:none}@media (max-width:768px){.seo-article{margin:20px 0;padding:24px}.seo-article h1{font-size:1.6rem}.seo-article h2{font-size:1.4rem}.feature-grid{gap:1rem;grid-template-columns:1fr}.feature-item{padding:1.2rem}.cta-section{padding:2rem}.cta-action{font-size:1.1rem}.code-block{padding:1rem}pre{font-size:.85rem}.steps{padding-left:1rem}.advantages li{padding-left:1.5rem}}@media (max-width:480px){.seo-article{padding:16px}.seo-article h1{font-size:1.4rem}.seo-article h2{font-size:1.2rem}.feature-item{padding:1rem}.cta-section{padding:1.5rem}.faq-item{padding:1rem}}.excel-json-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.excel-json-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.excel-json-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-section h1{gap:10px}.upload-area{border-radius:var(--card-radius);padding:40px 20px}.upload-area.drag-active,.upload-area:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary);transform:translateY(-2px)}.excel-json-converter.dark-mode .upload-area{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.excel-json-converter.dark-mode .upload-area.drag-active,.excel-json-converter.dark-mode .upload-area:hover{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.upload-content{margin:0 auto;max-width:400px}.upload-icon{margin-bottom:16px}.upload-content h3{font-size:1.4rem;margin:0 0 12px}.upload-content p{font-size:1rem;margin:8px 0}.excel-json-converter.dark-mode .upload-content p{color:#a0aec0;color:var(--dark-text-secondary)}.supported-formats{font-size:.85rem!important;font-style:italic;opacity:.8}.browse-button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;margin-left:auto;margin-right:auto;margin-top:16px;padding:12px 24px;transition:all .3s ease}.browse-button:hover{background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.message{align-items:center;border-radius:8px;display:flex;font-weight:500;gap:8px;margin-bottom:20px;padding:12px 16px}.message.error{background-color:#e74c3c1a;border:1px solid #e74c3c33;color:#e74c3c;color:var(--danger)}.message.success{background-color:#2ecc711a;border:1px solid #2ecc7133;color:#2ecc71;color:var(--success)}.file-info-section{border-radius:var(--card-radius);padding:20px}.excel-json-converter.dark-mode .file-info-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-info-section h3{margin-bottom:16px;margin-top:0}.excel-json-converter.dark-mode .file-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.excel-json-converter.dark-mode .file-size{color:#a0aec0;color:var(--dark-text-secondary)}.sheet-selection-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);margin-bottom:30px;padding:20px}.excel-json-converter.dark-mode .sheet-selection-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.sheet-selection-section h3{align-items:center;display:flex;font-size:1.2rem;gap:8px;margin-bottom:16px;margin-top:0}.sheet-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.sheet-card{align-items:center;background:#fff;background:var(--white);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;cursor:pointer;display:flex;justify-content:space-between;padding:16px;transition:all .3s ease}.sheet-card:hover{box-shadow:0 4px 12px #0000000d;transform:translateY(-2px)}.sheet-card.selected{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.excel-json-converter.dark-mode .sheet-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.excel-json-converter.dark-mode .sheet-card.selected{background:#3498db1a}.sheet-info h4{font-size:1rem;margin:0 0 4px}.sheet-info p{color:#7f8c8d;color:var(--text-light);font-size:.85rem;margin:0}.excel-json-converter.dark-mode .sheet-info p{color:#a0aec0;color:var(--dark-text-secondary)}.sheet-checkbox{font-size:1.2rem}.settings-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);padding:20px}.excel-json-converter.dark-mode .settings-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.settings-header h3{align-items:center;display:flex;font-size:1.2rem;gap:8px;margin:0}.settings-toggle{background-color:#3498db;background-color:var(--primary);border:none;border-radius:6px;color:#fff;color:var(--white);font-size:.9rem;font-weight:500;padding:8px 16px}.settings-toggle:hover{background-color:#2980b9;background-color:var(--primary-hover)}.settings-grid{animation:fadeIn .3s ease-out}.setting-group{gap:8px}.setting-input{border-radius:6px}.excel-json-converter.dark-mode .setting-input{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.convert-button{align-items:center;background-color:#2ecc71;background-color:var(--success);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:14px 28px;transition:all .3s ease}.convert-button:hover:not(:disabled){background-color:#27ae60;box-shadow:0 6px 20px #2ecc714d;transform:translateY(-2px)}.convert-button:disabled{cursor:not-allowed;opacity:.6}.clear-button{font-size:1rem;font-weight:600;gap:8px;padding:14px 28px}.clear-button:hover{transform:translateY(-2px)}.output-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);margin-bottom:30px;padding:20px}.excel-json-converter.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.output-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.output-header h3{align-items:center;display:flex;font-size:1.2rem;gap:8px;margin:0}.output-actions{display:flex;gap:12px}.copy-button,.download-button{align-items:center;border:none;border-radius:6px;cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:6px;padding:8px 16px;transition:all .3s ease}.download-button{background-color:#3498db;background-color:var(--primary)}.download-button:hover{background-color:#2980b9;background-color:var(--primary-hover)}.output-stats{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.85rem;gap:20px;margin-bottom:12px}.excel-json-converter.dark-mode .output-stats{color:#a0aec0;color:var(--dark-text-secondary)}.json-output{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.9rem;line-height:1.5;max-height:500px;min-height:300px;outline:none;padding:16px;resize:vertical;width:100%}.excel-json-converter.dark-mode .json-output{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.history-section{border-radius:var(--card-radius)}.excel-json-converter.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-header h3{font-size:1.2rem}.clear-history{align-items:center;display:flex;font-weight:500;gap:6px}.excel-json-converter.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.excel-json-converter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.conversion-type{font-weight:600}.history-details{font-size:.9rem;line-height:1.4}.history-details strong{color:#3498db;color:var(--primary);margin-right:4px}.restore-button{font-size:.85rem}.related-tools-section{border-radius:var(--card-radius)}.excel-json-converter.dark-mode .related-tools-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.related-tools-section h3{align-items:center;display:flex;gap:8px}.tool-card:hover{box-shadow:0 4px 12px #0000000d}.excel-json-converter.dark-mode .tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.tool-icon{flex-shrink:0;margin-right:12px}.tool-info{flex:1 1;min-width:0}.tool-info h4{color:inherit;font-size:1rem;margin:0 0 4px}.tool-info p{color:#7f8c8d;color:var(--text-light);font-size:.85rem;line-height:1.3;margin:0}.excel-json-converter.dark-mode .tool-info p{color:#a0aec0;color:var(--dark-text-secondary)}.tool-link{flex-shrink:0;margin-left:12px}@media (max-width:768px){.excel-json-converter{margin:16px;padding:20px}.header-section{align-items:flex-start;flex-direction:column;gap:16px}.header-section h1{font-size:1.6rem}.upload-area{padding:30px 15px}.output-header,.primary-actions{flex-direction:column}.output-header{align-items:flex-start;gap:12px}.output-actions{justify-content:center;width:100%}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-button{align-self:flex-end;margin-left:0}.settings-grid,.sheet-grid,.tools-grid{grid-template-columns:1fr}}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.feature-item{border-radius:12px;padding:1.5rem}.feature-item:hover{border-color:var(--primary);box-shadow:0 4px 12px #0000000d}.feature-item h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:.8rem}.feature-item p{font-size:.95rem;line-height:1.6;margin-bottom:0}.benefit{border-left:4px solid var(--primary);margin-top:1rem;padding:1rem}.benefit strong{color:var(--primary)}.steps{margin:1.5rem 0}.steps li{font-size:1rem;line-height:1.6;margin-bottom:1rem}.steps li strong{color:var(--primary)}.code-block{border:1px solid var(--border);margin:1.5rem 0;padding:1.5rem}.code-block pre{color:var(--text);font-family:Courier New,monospace;font-size:.9rem;line-height:1.5;margin:0}.faq-item{background:var(--bg-light);border-left:4px solid var(--primary);margin-bottom:2rem;padding:1.5rem}.faq-item h3{font-size:1.1rem;margin-bottom:.8rem}.faq-item p{line-height:1.6;margin-bottom:0}.advantages{margin:1.5rem 0}.advantages li{line-height:1.6;margin-bottom:.8rem;padding-left:2rem}.advantages li:before{content:"✅";font-size:1rem;top:0}.fun-fact{border-left:4px solid var(--success);margin:1.5rem 0;padding:1rem}.fun-fact strong{color:var(--success)}.cta-section{background:linear-gradient(135deg,#3498db1a,#2ecc711a);border:1px solid #3498db33;padding:2.5rem}.cta-section h2{color:var(--primary);font-size:1.8rem;margin-bottom:1rem}.cta-section p{color:var(--text);font-size:1.1rem;margin-bottom:2rem}.cta-features{margin:2rem 0}.cta-features .advantages{margin:0}.cta-features .advantages li{font-size:1rem;margin-bottom:.5rem}.cta-action{background:#3498db0d;border:1px solid #3498db33;border-radius:8px;color:var(--primary);margin-top:2rem;padding:1rem}table{background:var(--white);margin:1.5rem 0}table td,table th{border:1px solid var(--border);padding:.8rem;text-align:left}table th{background:var(--bg-light);color:var(--primary);font-weight:600}table td{font-family:monospace;font-size:.9rem}.excel-json-converter.dark-mode .seo-article{background:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.excel-json-converter.dark-mode .code-block,.excel-json-converter.dark-mode .feature-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.excel-json-converter.dark-mode .code-block pre{color:var(--dark-text)}.excel-json-converter.dark-mode .faq-item{background:var(--dark-bg-light)}.excel-json-converter.dark-mode .benefit{background-color:#3498db33}.excel-json-converter.dark-mode .fun-fact{background-color:#2ecc7133}.excel-json-converter.dark-mode .cta-section{background:linear-gradient(135deg,#3498db26,#2ecc7126);border-color:#3498db4d}.excel-json-converter.dark-mode .cta-action{background:#3498db1a;border-color:#3498db4d}.excel-json-converter.dark-mode table{background:var(--dark-bg)}.excel-json-converter.dark-mode table th{background:var(--dark-bg-light)}.excel-json-converter.dark-mode table td,.excel-json-converter.dark-mode table th{border-color:var(--dark-border);color:var(--dark-text)}@media (max-width:768px){.seo-article{margin:20px 0;padding:24px}.seo-article h1{font-size:1.6rem}.seo-article h2{font-size:1.4rem}.feature-grid{gap:1rem;grid-template-columns:1fr}.feature-item{padding:1.2rem}.cta-section{padding:1.5rem}.cta-section h2{font-size:1.5rem}.cta-action{font-size:1.1rem}.code-block{padding:1rem}.code-block pre{font-size:.8rem}.faq-item{padding:1.2rem}table{font-size:.8rem}table td,table th{padding:.5rem}}@media (max-width:480px){.seo-article{padding:16px}.steps{padding-left:1rem}.advantages li{padding-left:1.5rem}.cta-features{width:100%}.code-block{overflow-x:scroll}}.sql-query-builder{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.sql-query-builder.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.sql-query-builder.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.connection-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.sql-query-builder.dark-mode .connection-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.connection-section h3{align-items:center;display:flex;font-size:1.1rem;font-weight:600;gap:8px;margin:0 0 16px}.connection-controls{grid-gap:16px;align-items:end;display:grid;gap:16px;grid-template-columns:200px 1fr}.db-type-selector label{color:#7f8c8d;color:var(--text-light);display:block;font-size:.9rem;margin-bottom:8px}.sql-query-builder.dark-mode .db-type-selector label{color:#a0aec0;color:var(--dark-text-secondary)}.connection-string input,.db-type-selector select{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-size:.9rem;outline:none;padding:10px 12px;transition:all .3s ease;width:100%}.connection-string{display:flex;gap:12px}.connection-string input{flex:1 1}.connect-button{background-color:#3498db;background-color:var(--primary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;font-weight:500;padding:10px 16px;transition:all .3s ease;white-space:nowrap}.connect-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.connection-status{align-items:center;display:flex;font-size:.9rem;gap:8px;margin-top:12px}.status-indicator{border-radius:50%;height:8px;width:8px}.status-indicator.connected{background-color:#2ecc71;background-color:var(--success)}.main-interface{grid-gap:var(--gap);display:grid;gap:var(--gap);grid-template-columns:300px 1fr;margin-bottom:30px}.schema-browser{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;height:-webkit-fit-content;height:fit-content;max-height:600px;overflow-y:auto;padding:20px}.sql-query-builder.dark-mode .schema-browser{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.schema-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.schema-header h3{align-items:center;display:flex;font-size:1.1rem;font-weight:600;gap:8px;margin:0}.toggle-schema{background:none;border:none;border-radius:4px;color:#7f8c8d;color:var(--text-light);cursor:pointer;padding:4px}.toggle-schema:hover{background-color:#e1e8ed;background-color:var(--border)}.table-item{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;margin-bottom:16px;overflow:hidden}.sql-query-builder.dark-mode .table-item{border-color:#4a5568;border-color:var(--dark-border)}.table-header{align-items:center;background:#fff;background:var(--white);cursor:pointer;display:flex;font-weight:600;gap:8px;padding:12px;transition:all .3s ease}.sql-query-builder.dark-mode .table-header{background:#1a202c;background:var(--dark-bg)}.table-header:hover{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white)}.add-table-btn{align-items:center;background:#3498db;background:var(--primary);border:none;border-radius:50%;color:#fff;color:var(--white);cursor:pointer;display:flex;height:24px;justify-content:center;margin-left:auto;width:24px}.columns-list{background:#fff;background:var(--white)}.sql-query-builder.dark-mode .columns-list{background:#1a202c;background:var(--dark-bg)}.column-item{align-items:center;border-top:1px solid #e1e8ed;border-top:1px solid var(--border);display:flex;font-size:.9rem;gap:8px;padding:8px 12px}.sql-query-builder.dark-mode .column-item{border-color:#4a5568;border-color:var(--dark-border)}.column-name{flex:1 1;font-weight:500}.column-type{color:#7f8c8d;color:var(--text-light);font-size:.8rem}.sql-query-builder.dark-mode .column-type{color:#a0aec0;color:var(--dark-text-secondary)}.key-indicator{font-size:.7rem}.query-builder{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.sql-query-builder.dark-mode .query-builder{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.query-type-section{margin-bottom:24px}.query-type-section h3{font-size:1.1rem;font-weight:600;margin:0 0 12px}.query-type-buttons{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(4,1fr)}.query-type-buttons button{border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:600;outline:none;padding:12px 16px;transition:all .3s ease}.query-type-buttons button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.query-type-buttons button.inactive{background-color:#fff;background-color:var(--white);border-color:#e1e8ed;border-color:var(--border);color:#2c3e50;color:var(--text)}.query-type-buttons button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.sql-query-builder.dark-mode .query-type-buttons button.inactive{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.builder-tabs{background:#f8fafc;background:var(--bg-light);border-radius:8px;display:flex;gap:4px;margin-bottom:24px;padding:4px}.sql-query-builder.dark-mode .builder-tabs{background:#1a202c;background:var(--dark-bg)}.builder-tabs button{align-items:center;border:none;border-radius:6px;cursor:pointer;display:flex;flex:1 1;font-weight:500;gap:8px;justify-content:center;padding:12px 16px;transition:all .3s ease}.builder-tabs button.active{background-color:#fff;background-color:var(--white);box-shadow:0 2px 4px #0000001a;color:#3498db;color:var(--primary)}.sql-query-builder.dark-mode .builder-tabs button.active{background-color:#2d3748;background-color:var(--dark-bg-light);color:#3498db;color:var(--primary)}.builder-tabs button.inactive{background:#0000;color:#7f8c8d;color:var(--text-light)}.builder-tabs button.inactive:hover{background-color:#fff;background-color:var(--white);color:#2c3e50;color:var(--text)}.sql-query-builder.dark-mode .builder-tabs button.inactive{color:#a0aec0;color:var(--dark-text-secondary)}.sql-query-builder.dark-mode .builder-tabs button.inactive:hover{background-color:#2d3748;background-color:var(--dark-bg-light);color:#f7fafc;color:var(--dark-text)}.visual-builder{min-height:400px}.selected-tables-section{margin-bottom:20px}.selected-tables-section h4{font-size:1rem;font-weight:600;margin:0 0 12px}.selected-tables{display:flex;flex-wrap:wrap;gap:8px}.selected-table{background:#3498db;background:var(--primary);border-radius:20px;font-size:.9rem;gap:8px;padding:8px 12px}.selected-table,.selected-table button{align-items:center;color:#fff;display:flex}.selected-table button{background:none;border:none;border-radius:50%;cursor:pointer;height:16px;justify-content:center;padding:0;width:16px}.selected-table button:hover{background:#fff3}.query-options{margin-bottom:20px}.query-options label{align-items:center;cursor:pointer;display:flex;gap:8px}.section-header h4{font-size:1rem;font-weight:600;margin:0}.section-header button{background-color:#95a5a6;background-color:var(--secondary);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;font-size:.8rem;padding:6px 12px;transition:all .3s ease}.section-header button:hover{background-color:#7f8c8d}.condition-item,.join-item{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;gap:8px;margin-bottom:8px;padding:12px}.sql-query-builder.dark-mode .condition-item,.sql-query-builder.dark-mode .join-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.condition-item input,.condition-item select,.join-item input,.join-item select{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;font-size:.9rem;outline:none;padding:8px 10px;transition:all .3s ease}.condition-item input:focus,.condition-item select:focus,.join-item input:focus,.join-item select:focus{border-color:#3498db;border-color:var(--primary)}.sql-query-builder.dark-mode .condition-item input,.sql-query-builder.dark-mode .condition-item select,.sql-query-builder.dark-mode .join-item input,.sql-query-builder.dark-mode .join-item select{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.condition-item button,.join-item button{background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;padding:8px 10px;transition:all .3s ease}.condition-item button:hover,.join-item button:hover{background-color:#c0392b}.advanced-options{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;margin-top:24px;padding:20px}.sql-query-builder.dark-mode .advanced-options{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.advanced-options h4{font-size:1rem;font-weight:600;margin:0 0 16px}.option-group{margin-bottom:16px}.option-group label{display:block;font-size:.9rem;font-weight:500;margin-bottom:8px}.option-group input{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;font-size:.9rem;outline:none;padding:8px 10px;transition:all .3s ease;width:100%}.option-group input:focus{border-color:#3498db;border-color:var(--primary)}.sql-query-builder.dark-mode .option-group input{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.order-by-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.order-by-item{align-items:center;background:#3498db;background:var(--primary);border-radius:12px;color:#fff;display:flex;font-size:.8rem;gap:4px;padding:4px 8px}.order-by-item button{background:none;border:none;color:#fff;cursor:pointer;padding:0}.sql-editor{min-height:400px}.sql-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.sql-header h4{font-size:1rem;font-weight:600;margin:0}.sql-actions{display:flex;gap:8px}.sql-actions button{background-color:#95a5a6;background-color:var(--secondary);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;font-size:.8rem;padding:8px 12px;transition:all .3s ease}.sql-actions button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.sql-display{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;font-family:Courier New,monospace;font-size:.95rem;line-height:1.6;min-height:300px;overflow-x:auto;padding:16px}.sql-query-builder.dark-mode .sql-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.sql-display pre{margin:0;white-space:pre-wrap;word-break:break-word}.results-section{min-height:400px}.results-header{margin-bottom:16px}.results-header h4{font-size:1rem;font-weight:600;margin:0}.results-meta{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.9rem;gap:16px}.sql-query-builder.dark-mode .results-meta{color:#a0aec0;color:var(--dark-text-secondary)}.error-message{margin-bottom:16px;padding:12px 16px}.results-table{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;overflow-x:auto}.sql-query-builder.dark-mode .results-table{border-color:#4a5568;border-color:var(--dark-border)}.results-table table{border-collapse:collapse;width:100%}.results-table td,.results-table th{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);font-size:.9rem;padding:12px;text-align:left}.sql-query-builder.dark-mode .results-table td,.sql-query-builder.dark-mode .results-table th{border-color:#4a5568;border-color:var(--dark-border)}.results-table th{background-color:#f8fafc;background-color:var(--bg-light);font-weight:600}.sql-query-builder.dark-mode .results-table th{background-color:#2d3748;background-color:var(--dark-bg-light)}.action-buttons{margin-bottom:30px}.execute-button{align-items:center;background-color:#2ecc71;background-color:var(--success);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:14px 28px;transition:all .3s ease}.execute-button:hover:not(:disabled){background-color:#27ae60;box-shadow:0 4px 12px #2ecc714d;transform:translateY(-2px)}.execute-button:disabled{cursor:not-allowed;opacity:.6}.validate-button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:14px 28px;transition:all .3s ease}.validate-button:hover{background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 4px 12px #3498db4d;transform:translateY(-2px)}.secondary-actions button{align-items:center;background-color:#95a5a6;background-color:var(--secondary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:8px;padding:10px 16px;transition:all .3s ease}.secondary-actions button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.reset-button{background-color:#e74c3c!important;background-color:var(--danger)!important}.reset-button:hover{background-color:#c0392b!important}.history-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.sql-query-builder.dark-mode .history-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-header h3{font-weight:600}.clear-history{border:none;border-radius:6px;cursor:pointer;transition:all .3s ease}.empty-history{color:#7f8c8d;color:var(--text-light);padding:40px 20px;text-align:center}.sql-query-builder.dark-mode .empty-history{color:#a0aec0;color:var(--dark-text-secondary)}.history-item{background:#fff;background:var(--white)}.sql-query-builder.dark-mode .history-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.history-meta{font-size:.9rem;justify-content:space-between}.history-meta strong{color:#3498db;color:var(--primary)}.timestamp{color:#7f8c8d;color:var(--text-light);font-size:.8rem}.sql-query-builder.dark-mode .timestamp{color:#a0aec0;color:var(--dark-text-secondary)}.history-sql{background:#f8fafc;background:var(--bg-light);border-radius:4px;color:#7f8c8d;color:var(--text-light);font-family:Courier New,monospace;font-size:.85rem;overflow:hidden;padding:8px}.sql-query-builder.dark-mode .history-sql{background:#2d3748;background:var(--dark-bg-light);color:#a0aec0;color:var(--dark-text-secondary)}.related-tools-section{margin-top:40px}.sql-query-builder.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.related-tools-section h3{color:#3498db;color:var(--primary);font-weight:700}.related-tools-grid{grid-gap:20px;gap:20px}.sql-query-builder.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.tool-card:hover{box-shadow:0 8px 25px #3498db26;transform:translateY(-4px)}.tool-card h4{margin:0 0 10px}.tool-card p{font-size:.95rem;margin:0 0 15px}.sql-query-builder.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}.tool-link{font-size:.95rem;font-weight:600;gap:6px;transition:all .3s ease}@media (max-width:1200px){.main-interface{grid-template-columns:1fr}.schema-browser{max-height:300px}}@media (max-width:768px){.sql-query-builder{margin:16px;padding:20px}.connection-controls{grid-template-columns:1fr}.query-type-buttons{grid-template-columns:repeat(2,1fr)}.primary-actions{flex-direction:column}.secondary-actions{flex-wrap:wrap}.condition-item,.history-item,.join-item{align-items:stretch;flex-direction:column}.history-item{gap:12px}.restore-button{align-self:flex-start;margin-left:0}.related-tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.header-section{gap:16px;text-align:center}.builder-tabs,.header-section{flex-direction:column}}.xml-formatter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.xml-formatter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.xml-formatter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.tools-grid{grid-gap:var(--gap);gap:var(--gap);grid-template-columns:1fr 1fr;margin-bottom:30px}.xml-formatter.dark-mode .input-section,.xml-formatter.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-section textarea,.json-output,.output-section textarea{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);font-family:Courier New,monospace;font-size:.95rem;line-height:1.6;min-height:300px;outline:none;padding:16px;resize:vertical;transition:all .3s ease;width:100%}.input-section textarea:focus,.json-output:focus,.output-section textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.xml-formatter.dark-mode .input-section textarea,.xml-formatter.dark-mode .json-output,.xml-formatter.dark-mode .output-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.xml-formatter.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}.validation-results{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.xml-formatter.dark-mode .validation-results{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.validation-results h3{font-size:1.1rem;margin-bottom:16px;margin-top:0}.validation-errors,.validation-warnings{margin-bottom:16px}.validation-errors h4{color:#e74c3c;color:var(--danger);margin-bottom:8px}.validation-warnings h4{color:#f39c12;color:var(--warning);margin-bottom:8px}.error-item,.warning-item{border-radius:6px;font-family:monospace;font-size:.9rem;margin-bottom:4px;padding:8px 12px}.error-item{background-color:#e74c3c1a;border-left:4px solid #e74c3c;border-left:4px solid var(--danger)}.warning-item{background-color:#f39c121a;border-left:4px solid #f39c12;border-left:4px solid var(--warning)}.secondary-actions{gap:16px}.xml-formatter.dark-mode .settings-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.xml-formatter.dark-mode .settings-toggle:hover{background-color:#3498db33}.xml-formatter.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.xml-formatter.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.xml-formatter.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.xpath-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.xml-formatter.dark-mode .xpath-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.xpath-section h3{font-size:1.1rem;margin-bottom:16px;margin-top:0}.xpath-input-group{display:flex;gap:12px;margin-bottom:20px}.xpath-input{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;flex:1 1;font-family:Courier New,monospace;font-size:.9rem;outline:none;padding:12px 16px;transition:all .3s ease}.xpath-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.xml-formatter.dark-mode .xpath-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.xpath-results{margin-top:16px}.xpath-results h4{color:#2ecc71;color:var(--success);margin-bottom:12px}.xpath-results-list{max-height:300px;overflow-y:auto}.xpath-result-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;margin-bottom:8px;padding:12px}.xml-formatter.dark-mode .xpath-result-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.xpath-result-item pre{font-size:.85rem;margin:0;white-space:pre-wrap;word-break:break-word}.xpath-error{background-color:#e74c3c1a;border-left:4px solid #e74c3c;border-left:4px solid var(--danger);border-radius:6px;color:#e74c3c;color:var(--danger);margin-top:16px;padding:12px}.json-output-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.xml-formatter.dark-mode .json-output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.related-tools-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.related-tool-card{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);display:flex;font-weight:500;gap:12px;padding:16px 20px;text-decoration:none;transition:all .3s ease}.related-tool-card:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.xml-formatter.dark-mode .related-tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.xml-formatter.dark-mode .related-tool-card:hover{border-color:#3498db;border-color:var(--primary)}@media (max-width:968px){.tools-grid{grid-template-columns:1fr}.primary-actions{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.xml-formatter{margin:16px;padding:20px}.header-section{gap:16px;text-align:center}.header-section,.primary-actions,.secondary-actions{flex-direction:column}.settings-grid{grid-template-columns:1fr}.xpath-input-group{flex-direction:column}.related-tools-grid{grid-template-columns:1fr}.seo-article{padding:20px}.morse-chart{flex-direction:column}.feature-grid{grid-template-columns:1fr}}.yaml-json-converter{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.yaml-json-converter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.yaml-json-converter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.direction-selector{grid-gap:16px;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-bottom:30px;padding:8px}.yaml-json-converter.dark-mode .direction-selector{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.direction-selector button{align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:16px 24px;transition:all .3s ease}.direction-selector button.active{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #3498db4d;color:#fff;transform:translateY(-2px)}.direction-selector button.inactive{background-color:#fff;background-color:var(--white);border-color:#0000;color:#2c3e50;color:var(--text)}.direction-selector button.inactive:hover{background-color:#3498db;background-color:var(--primary);border-color:#3498db;border-color:var(--primary);color:#fff;transform:translateY(-1px)}.yaml-json-converter.dark-mode .direction-selector button.inactive{background-color:#1a202c;background-color:var(--dark-bg);color:#f7fafc;color:var(--dark-text)}.input-output-container{grid-gap:var(--gap);align-items:start;display:grid;gap:var(--gap);grid-template-columns:1fr 1fr;margin-bottom:30px}.section-header{margin-bottom:12px}.section-header h3{font-size:1.1rem}.file-import-button,.input-actions,.output-actions{display:flex;gap:8px}.file-import-button{align-items:center;background-color:#95a5a6;background-color:var(--secondary);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;font-weight:500;padding:10px 16px;transition:all .3s ease}.file-import-button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.input-section,.output-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;min-height:380px;padding:20px}.yaml-json-converter.dark-mode .input-section,.yaml-json-converter.dark-mode .output-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.input-section textarea{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:10px;color:#2c3e50;color:var(--text);flex:1 1 auto;font-family:Courier New,monospace;font-size:.95rem;line-height:1.6;min-height:280px;outline:none;padding:16px;resize:vertical;transition:all .3s ease;width:100%}.input-section textarea:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.yaml-json-converter.dark-mode .input-section textarea{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.output-display{background:#fff;background:var(--white);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;flex:1 1 auto;font-family:Courier New,monospace;font-size:.95rem;line-height:1.6;min-height:280px;overflow-y:auto;padding:16px;transition:all .3s ease;white-space:pre-wrap;word-break:break-word}.yaml-json-converter.dark-mode .output-display{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.output-display pre{word-wrap:break-word;font-family:inherit;font-size:inherit;margin:0;white-space:pre-wrap}.placeholder-text{align-items:center;display:flex;font-family:Inter,sans-serif;font-size:.95rem;font-style:italic;height:100%;justify-content:center}.char-count,.placeholder-text{color:#7f8c8d;color:var(--text-light)}.char-count{font-size:.85rem;margin-top:12px;text-align:right}.yaml-json-converter.dark-mode .char-count{color:#a0aec0;color:var(--dark-text-secondary)}button{font-size:.9rem;font-weight:500;padding:10px 16px}button.secondary{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white)}button.secondary:hover:not(:disabled){background-color:#7f8c8d;transform:translateY(-1px)}button.small{font-size:.85rem;padding:8px 12px}.process-button{padding:12px 24px}.process-button:hover:not(:disabled){box-shadow:0 4px 12px #3498db4d}.quick-actions-section{margin-bottom:30px}.settings-toggle{border:1px solid #3498db;border:1px solid var(--primary)}.yaml-json-converter.dark-mode .settings-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.yaml-json-converter.dark-mode .settings-toggle:hover{background-color:#3498db33}.yaml-json-converter.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.settings-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.yaml-json-converter.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group label{color:#7f8c8d;color:var(--text-light)}.yaml-json-converter.dark-mode .setting-group label{color:#a0aec0;color:var(--dark-text-secondary)}.yaml-json-converter.dark-mode .setting-group input[type=range]{background:#4a5568;background:var(--dark-border)}.yaml-json-converter.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.reset-settings{background-color:#f39c12;background-color:var(--warning);color:#fff;color:var(--white);margin-top:24px}.reset-settings:hover{background-color:#e67e22;transform:translateY(-1px)}.status-message{align-items:center;border-radius:8px;display:flex;font-weight:500;gap:12px;margin-bottom:20px;padding:16px}.status-message.error{background-color:#e74c3c1a;border:1px solid #e74c3c33;color:#e74c3c;color:var(--danger)}.status-message.success{background-color:#2ecc711a;border:1px solid #2ecc7133;color:#2ecc71;color:var(--success)}.history-header{margin-bottom:16px}.history-header h3{align-items:center;display:flex;font-size:1.1rem;gap:8px}.clear-history{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white);font-size:.9rem;padding:8px 16px}.clear-history:hover{background-color:#c0392b;transform:translateY(-1px)}.yaml-json-converter.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-meta{align-items:center;color:#7f8c8d;color:var(--text-light);display:flex;font-size:.85rem;gap:12px;margin-bottom:8px}.yaml-json-converter.dark-mode .history-meta{color:#a0aec0;color:var(--dark-text-secondary)}.conversion-type{font-size:1rem}.timestamp{opacity:.8}.history-text{font-size:.95rem;line-height:1.5}.history-text .converted,.history-text .original{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-text strong{margin-right:6px}.history-text strong,.yaml-json-converter.dark-mode .history-text strong{color:#3498db;color:var(--primary)}.history-more{color:#7f8c8d;color:var(--text-light);margin-top:8px;text-align:center}.yaml-json-converter.dark-mode .history-more{color:#a0aec0;color:var(--dark-text-secondary)}.related-tools-section{padding:20px}.yaml-json-converter.dark-mode .related-tools-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.related-tools-section h3{font-size:1.2rem;margin-top:0}.tools-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.yaml-json-converter.dark-mode .tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.tool-card h4{margin-bottom:8px;margin-top:0}.tool-card p{margin-bottom:12px}.yaml-json-converter.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}.tool-link{align-items:center;display:inline-flex;gap:4px}.spinning{animation:spin 1s linear infinite}@media (max-width:768px){.yaml-json-converter{margin:16px;padding:20px}.direction-selector,.input-output-container{grid-template-columns:1fr}.primary-actions{flex-direction:column}.settings-grid,.tools-grid{grid-template-columns:1fr}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-button{align-self:flex-end;margin-left:0}}.yaml-json-converter.dark-mode .seo-article h1,.yaml-json-converter.dark-mode .seo-article h2{color:var(--primary)}.yaml-json-converter.dark-mode .seo-article h3,.yaml-json-converter.dark-mode .seo-article h4{color:var(--dark-text)}.yaml-json-converter.dark-mode .feature-card{border-bottom-color:var(--dark-border)}.feature-item{text-align:left}.yaml-json-converter.dark-mode .feature-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.feature-item h3,.feature-item h4{color:var(--primary);margin-top:0}.benefit{text-align:left}.morse-chart{display:flex;gap:2rem;margin:1.5rem 0}.morse-column{flex:1 1}.morse-column h3{margin-bottom:1rem;text-align:left}table{border-collapse:collapse;margin:1rem 0;width:100%}td{border:1px solid var(--border);font-family:monospace;padding:.5rem;text-align:left}.yaml-json-converter.dark-mode td{border-color:var(--dark-border)}.code-block{text-align:left}.yaml-json-converter.dark-mode .code-block{background:var(--dark-bg-light)}.code-block h4{color:var(--primary);margin-bottom:.5rem;margin-top:0}pre{word-wrap:break-word;font-family:Courier New,monospace;font-size:.95rem;line-height:1.4;white-space:pre-wrap}.faq-item,.fun-fact,.steps,.steps li{text-align:left}.faq-item h3{margin-bottom:.5rem}.advantages,.advantages li{text-align:left}.advantages li:before{font-weight:700}.yaml-json-converter.dark-mode .cta-section{background-color:#3498db26}.cta-section h2{margin-top:0}.cta-action,.cta-section h2{text-align:center}.seo-article p{margin-bottom:1rem}.seo-article *,.seo-article ol li,.seo-article ul li{text-align:left}.cta-action,.cta-section,.cta-section h2{text-align:center}@media (max-width:768px){.seo-article{margin:30px 0;padding:20px}.morse-chart{flex-direction:column;gap:1rem}.feature-grid{grid-template-columns:1fr}.seo-article h1{font-size:1.7rem}.seo-article h2{font-size:1.4rem}.code-block,pre{font-size:.85rem}}.dark-mode .seo-article{background:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.seo-article h1,.seo-article h2,.seo-article h3{text-align:left}.seo-article h4{color:var(--text);font-size:1.1rem;margin:1.2rem 0 .6rem;text-align:left}.move-button{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white)}.move-button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.remove-button{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white)}.settings-section{margin-bottom:30px}.settings-toggle{margin:0 auto 20px;padding:12px 24px}.settings-toggle:hover{background-color:#3498db1a}.pdf-merger.dark-mode .settings-toggle{border-color:#3498db;border-color:var(--primary);color:#3498db;color:var(--primary)}.pdf-merger.dark-mode .settings-toggle:hover{background-color:#3498db33}.pdf-merger.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h3{margin:0 0 20px}.setting-group label{font-size:.95rem}.setting-group input[type=checkbox]{margin:0;transform:scale(1.2)}.setting-input{font-size:1rem;padding:12px 16px}.pdf-merger.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group input[type=range]{border-radius:3px;height:6px;margin-top:8px}.setting-group input[type=range]::-webkit-slider-thumb{-webkit-transition:all .3s ease;transition:all .3s ease}.setting-group input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1)}.pdf-merger.dark-mode .setting-group input[type=range]{background:#4a5568;background:var(--dark-border)}.setting-group small{line-height:1.4}.pdf-merger.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.action-section{text-align:center}.merge-button{align-items:center;background:linear-gradient(135deg,#3498db,#2980b9);background:linear-gradient(135deg,var(--primary),var(--primary-hover));border:none;border-radius:12px;color:#fff;color:var(--white);cursor:pointer;display:inline-flex;font-size:1.1rem;font-weight:600;gap:10px;justify-content:center;min-width:180px;padding:16px 32px;transition:all .3s ease}.merge-button:hover:not(:disabled){box-shadow:0 6px 20px #3498db66;transform:translateY(-3px)}.merge-button:disabled{background:#95a5a6;background:var(--secondary);box-shadow:none;cursor:not-allowed;transform:none}.progress-section{align-items:center;display:flex;gap:16px;justify-content:center;margin-top:20px}.progress-bar{width:300px}.pdf-merger.dark-mode .progress-bar{background:#4a5568;background:var(--dark-border)}.progress-fill{background:linear-gradient(90deg,#2ecc71,#27ae60);background:linear-gradient(90deg,var(--success),#27ae60)}.progress-text{color:#2ecc71;color:var(--success);font-weight:600;min-width:40px}.related-tools-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:24px}.pdf-merger.dark-mode .related-tools-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.related-tools-section h3{margin:0 0 20px}.tools-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.tool-card{text-align:left}.pdf-merger.dark-mode .tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.tool-card p{line-height:1.5;margin:0 0 12px}.pdf-merger.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}.tool-link{color:#3498db;color:var(--primary);font-size:.9rem;font-weight:500;text-decoration:none;transition:color .3s ease}.tool-link:hover{color:#2980b9;color:var(--primary-hover);text-decoration:underline}@keyframes slideIn{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@media (max-width:768px){.pdf-merger{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.upload-area{padding:40px 20px}.section-header,.upload-info{flex-direction:column;gap:12px}.section-header{text-align:center}.file-stats{justify-content:center}.file-item{flex-direction:column;gap:12px;padding:16px}.file-actions,.password-section{justify-content:center}.password-section{flex-wrap:wrap;margin:0}.settings-grid{grid-template-columns:1fr}.progress-section{flex-direction:column;gap:12px}.progress-bar{max-width:300px;width:100%}.tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.upload-area h3{font-size:1.2rem}.upload-area p{font-size:1rem}.merge-button{padding:14px 24px;width:100%}}.pdf-merger{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.pdf-merger.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.pdf-merger.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.upload-area{margin-bottom:30px}.upload-area.drag-over,.upload-area:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary);transform:translateY(-2px)}.pdf-merger.dark-mode .upload-area{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.pdf-merger.dark-mode .upload-area.drag-over,.pdf-merger.dark-mode .upload-area:hover{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.upload-content{position:relative;z-index:1}.upload-area p{font-size:1.1rem;margin:0 0 24px}.pdf-merger.dark-mode .upload-area p{color:#a0aec0;color:var(--dark-text-secondary)}.upload-info{display:flex;flex-wrap:wrap;gap:24px;justify-content:center}.upload-info span{color:#2ecc71;color:var(--success);font-size:.9rem;font-weight:500}.error-message{justify-content:space-between}.error-message button{align-items:center;background:none;border:none;color:#e74c3c;color:var(--danger);cursor:pointer;display:flex;font-size:1.2rem;height:24px;justify-content:center;padding:0;width:24px}.section-header{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);padding-bottom:12px}.pdf-merger.dark-mode .section-header{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.file-stats{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.9rem;gap:16px}.pdf-merger.dark-mode .file-stats{color:#a0aec0;color:var(--dark-text-secondary)}.clear-button{border-radius:8px;padding:10px 16px}.file-list{display:flex;flex-direction:column;gap:12px}.file-item{position:relative}.pdf-merger.dark-mode .file-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-drag-handle{color:#7f8c8d;color:var(--text-light);cursor:grab;font-size:1.2rem;margin-right:12px;-webkit-user-select:none;user-select:none}.file-drag-handle:active{cursor:grabbing}.pdf-merger.dark-mode .file-drag-handle{color:#a0aec0;color:var(--dark-text-secondary)}.file-name{align-items:center;display:flex;gap:8px;margin-bottom:6px}.file-details{color:#7f8c8d;color:var(--text-light);font-size:.85rem;gap:16px}.pdf-merger.dark-mode .file-details{color:#a0aec0;color:var(--dark-text-secondary)}.password-section{align-items:center;display:flex;gap:12px;margin:0 16px}.locked-icon{color:#f39c12;color:var(--warning);font-size:1.2rem}.password-input{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;font-size:.9rem;min-width:150px;outline:none;padding:8px 12px;transition:all .3s ease}.password-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.pdf-merger.dark-mode .password-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.unlock-button{background-color:#f39c12;background-color:var(--warning);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;font-weight:500;padding:8px 12px;transition:all .3s ease}.unlock-button:hover{background-color:#e67e22;transform:translateY(-1px)}.move-button,.remove-button{align-items:center;border:none;border-radius:6px;cursor:pointer;display:flex;font-size:.9rem;height:32px;justify-content:center;min-width:32px;padding:8px;transition:all .3s ease}.remove-button:hover{background-color:#c0392b;transform:translateY(-1px)}.pdf-splitter{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1400px;padding:var(--padding);transition:all .3s ease}.pdf-splitter.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.pdf-splitter.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.upload-section{border:3px dashed #e1e8ed;border:3px dashed var(--border)}.pdf-splitter.dark-mode .upload-section{background:linear-gradient(135deg,#2d3748,#1a202c);background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:#4a5568;border-color:var(--dark-border)}.pdf-splitter.dark-mode .upload-section.drag-over,.pdf-splitter.dark-mode .upload-section:hover{background:linear-gradient(135deg,#1a202c,#2a3441);background:linear-gradient(135deg,var(--dark-bg) 0,#2a3441 100%);border-color:#3498db;border-color:var(--primary)}.error-message{gap:10px}.processing-overlay{align-items:center;background:#000000b3;bottom:0;color:#fff;display:flex;flex-direction:column;gap:16px;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.processing-overlay .spinner{animation:spin 1s linear infinite;border:4px solid #0000;border-radius:50%;border-top-color:#3498db;border-top:4px solid var(--primary);height:40px;width:40px}.file-info-section{border-radius:16px;margin-bottom:30px}.pdf-splitter.dark-mode .file-info-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-info-section h3{margin:0 0 20px}.info-item{flex-direction:column;gap:4px}.info-label{font-size:.85rem}.pdf-splitter.dark-mode .info-label{color:#a0aec0;color:var(--dark-text-secondary)}.selection-section{margin-bottom:30px}.selection-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin-bottom:20px}.mode-selection{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.mode-selection label{align-items:center;border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;cursor:pointer;display:flex;gap:8px;padding:12px;transition:all .3s ease}.mode-selection label:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.mode-selection input[type=radio]{margin:0}.range-input{margin-bottom:20px}.range-input input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:1rem;margin-bottom:8px;outline:none;padding:12px 14px;transition:all .3s ease;width:100%}.range-input input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.pdf-splitter.dark-mode .range-input input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.range-input small{color:#7f8c8d;color:var(--text-light);font-size:.85rem}.pdf-splitter.dark-mode .range-input small{color:#a0aec0;color:var(--dark-text-secondary)}.page-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));margin-bottom:20px}.page-thumbnail{align-items:center;background:#f8fafc;background:var(--bg-light);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:12px;cursor:pointer;display:flex;flex-direction:column;gap:8px;padding:12px;text-align:center;transition:all .3s ease}.page-thumbnail:hover{box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.page-thumbnail.selected{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.pdf-splitter.dark-mode .page-thumbnail{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.pdf-splitter.dark-mode .page-thumbnail.selected{background:#3498db1a;border-color:#3498db;border-color:var(--primary)}.page-thumbnail img{object-fit:cover}.page-number,.page-thumbnail img{background:#fff;background:var(--white);border-radius:6px;height:100px;width:80px}.page-number{align-items:center;color:#7f8c8d;color:var(--text-light);display:flex;font-size:1.2rem;font-weight:600;justify-content:center}.pdf-splitter.dark-mode .page-number{background:#1a202c;background:var(--dark-bg);color:#a0aec0;color:var(--dark-text-secondary)}.page-label{color:inherit;font-size:.85rem;font-weight:600}.all-pages-notice{align-items:center;background:#2ecc711a;border:1px solid #2ecc71;border:1px solid var(--success);border-radius:12px;display:flex;gap:12px;margin-bottom:20px;padding:20px}.all-pages-notice svg{color:#2ecc71;color:var(--success);flex-shrink:0}.all-pages-notice p{color:inherit;font-weight:500;margin:0}.pdf-splitter.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.pdf-splitter.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.pdf-splitter.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.related-tools-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.pdf-splitter.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.pdf-splitter.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:1024px){.pdf-splitter{padding:24px}.info-grid{grid-template-columns:1fr}}@media (max-width:768px){.pdf-splitter{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.page-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.primary-actions{align-items:center;flex-direction:column}.primary-actions button{max-width:300px;width:100%}.mode-selection{gap:8px}.mode-selection label{padding:8px}}@media (max-width:480px){.upload-section{padding:24px}.upload-content h3{font-size:1.1rem}.upload-content p{font-size:.9rem}.page-grid{grid-template-columns:repeat(2,1fr)}.tool-card{flex-direction:column;gap:12px;text-align:center}}.pdf-splitter-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px;text-align:left}.pdf-splitter.dark-mode .pdf-splitter-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.pdf-splitter.dark-mode .article-header{border-bottom-color:var(--dark-border)}.pdf-splitter.dark-mode .article-header h2{color:var(--dark-text)}.pdf-splitter.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.pdf-splitter.dark-mode .article-section h3,.pdf-splitter.dark-mode .article-section h4,.pdf-splitter.dark-mode .article-section li,.pdf-splitter.dark-mode .article-section p{color:var(--dark-text)}.pdf-splitter.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.pdf-splitter.dark-mode .benefit-card h4{color:var(--dark-text)}.pdf-splitter.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.pdf-splitter.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.pdf-splitter.dark-mode .practice-item h4{color:var(--dark-text)}.pdf-splitter.dark-mode .practice-item p{color:var(--dark-text-secondary)}.pdf-splitter.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.pdf-splitter.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.pdf-splitter.dark-mode .scenario-card li{color:var(--dark-text)}.pdf-splitter.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.pdf-splitter.dark-mode .tech-item h4{color:var(--dark-text)}.pdf-splitter.dark-mode .tech-item p{color:var(--dark-text-secondary)}.advanced-techniques{display:flex;flex-direction:column;gap:20px;margin:24px 0}.technique-item{background:linear-gradient(135deg,var(--bg-light) 0,var(--white) 100%);border:1px solid var(--border);border-radius:12px;padding:20px}.pdf-splitter.dark-mode .technique-item{background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:var(--dark-border)}.technique-item h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 12px}.technique-item p{color:var(--text);font-size:.95rem;line-height:1.6;margin:0}.pdf-splitter.dark-mode .technique-item p{color:var(--dark-text)}.pdf-splitter.dark-mode .mistake-item{background:#e74c3c1a}.pdf-splitter.dark-mode .mistake-item p{color:var(--dark-text)}.pdf-splitter.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.pdf-splitter.dark-mode .tool-category p{color:var(--dark-text)}.pdf-splitter.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.pdf-splitter.dark-mode .quick-tips,.pdf-splitter.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.pdf-splitter.dark-mode .quick-tips li,.pdf-splitter.dark-mode .related-articles li{color:var(--dark-text)}@media (max-width:768px){.pdf-splitter-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.pdf-splitter-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}.pdf-extractor{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.pdf-extractor.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.pdf-extractor.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.file-drop-zone{background:#f8fafc;background:var(--bg-light);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;cursor:pointer;margin-bottom:20px;padding:40px;text-align:center;transition:all .3s ease}.pdf-extractor.dark-mode .file-drop-zone{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-drop-zone:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.drop-zone-content{align-items:center;display:flex;flex-direction:column;gap:12px}.upload-icon{font-size:3rem;opacity:.6}.drop-zone-content p{font-size:1.1rem;font-weight:600;margin:0}.drop-zone-content small{color:#7f8c8d;color:var(--text-light);font-size:.9rem}.pdf-extractor.dark-mode .drop-zone-content small{color:#a0aec0;color:var(--dark-text-secondary)}.file-list{background:#f8fafc;background:var(--bg-light);padding:20px}.pdf-extractor.dark-mode .file-list{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-list-header{align-items:center;border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;margin-bottom:16px;padding-bottom:12px}.pdf-extractor.dark-mode .file-list-header{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.file-list-header h3{font-size:1.1rem;font-weight:600;margin:0}.clear-files{background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:8px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;font-weight:500;padding:8px 16px;transition:all .3s ease}.clear-files:hover{background-color:#c0392b;transform:translateY(-1px)}.file-item{border-radius:8px;margin-bottom:8px;padding:12px}.pdf-extractor.dark-mode .file-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.file-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.file-info{flex-direction:column;gap:4px}.file-name{font-size:.95rem}.file-size{font-size:.85rem}.pdf-extractor.dark-mode .file-size{color:#a0aec0;color:var(--dark-text-secondary)}.remove-file{font-size:1.2rem;transition:all .3s ease}.remove-file:hover{background:#e74c3c1a}.pdf-extractor.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h3{font-size:1.1rem;margin-bottom:16px}.settings-grid{grid-gap:20px;gap:20px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.setting-group{flex:1 1}.setting-group label{align-items:center;color:#2c3e50;color:var(--text);cursor:pointer;display:flex;font-weight:500;gap:8px}.pdf-extractor.dark-mode .setting-group label{color:#f7fafc;color:var(--dark-text)}.setting-input{font-family:Inter,sans-serif}.pdf-extractor.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.pdf-extractor.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.setting-group input[type=checkbox]{cursor:pointer;height:16px;margin-right:8px;width:16px}.process-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-size:1.1rem;font-weight:600;gap:8px;padding:16px 32px;transition:all .3s ease}.process-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.settings-toggle{align-items:center;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;padding:14px 24px;transition:all .3s ease}.settings-toggle:hover{transform:translateY(-2px)}.progress-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:20px}.pdf-extractor.dark-mode .progress-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.progress-section h3{align-items:center;display:flex;font-size:1.1rem;gap:8px;margin-bottom:20px;margin-top:0}.progress-item{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;gap:16px;margin-bottom:16px;padding:12px}.pdf-extractor.dark-mode .progress-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.progress-info{display:flex;flex-direction:column;min-width:200px}.progress-filename{font-size:.9rem;font-weight:600;margin-bottom:4px}.progress-status{color:#7f8c8d;color:var(--text-light);font-size:.8rem;text-transform:capitalize}.pdf-extractor.dark-mode .progress-status{color:#a0aec0;color:var(--dark-text-secondary)}.progress-bar{flex:1 1}.pdf-extractor.dark-mode .progress-bar{background:#4a5568;background:var(--dark-border)}.progress-fill{background:#3498db;background:var(--primary)}.progress-percentage{font-size:.9rem;font-weight:600;min-width:50px;text-align:right}.results-header{margin-bottom:20px}.results-header h3{font-size:1.2rem;gap:8px}.results-container{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr;min-height:400px}.results-list{display:flex;flex-direction:column;gap:12px}.result-item{background:#f8fafc;background:var(--bg-light);border:2px solid #e1e8ed;border:2px solid var(--border);border-radius:12px;cursor:pointer;padding:16px;transition:all .3s ease}.pdf-extractor.dark-mode .result-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.result-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.result-item.selected{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.result-header{align-items:flex-start;margin-bottom:12px}.result-info h4{font-size:1rem;font-weight:600;margin:0 0 8px}.result-meta{color:var(--text-light);display:flex;flex-wrap:wrap;font-size:.8rem;gap:12px}.pdf-extractor.dark-mode .result-meta{color:#a0aec0;color:var(--dark-text-secondary)}.result-actions{display:flex;gap:8px}.copy-btn,.download-btn,.remove-btn{border:none;border-radius:6px;cursor:pointer;font-size:.8rem;font-weight:500;padding:6px 12px;transition:all .3s ease}.download-btn{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white)}.download-btn:hover{background-color:#27ae60;transform:translateY(-1px)}.copy-btn{background-color:#95a5a6;background-color:var(--secondary);color:#fff;color:var(--white)}.copy-btn:hover{background-color:#7f8c8d;transform:translateY(-1px)}.remove-btn{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white)}.remove-btn:hover{background-color:#c0392b;transform:translateY(-1px)}.result-preview{color:#7f8c8d;color:var(--text-light);font-family:monospace;font-size:.9rem;line-height:1.5;overflow:hidden;white-space:pre-line}.pdf-extractor.dark-mode .result-preview{color:#a0aec0;color:var(--dark-text-secondary)}.text-viewer{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;overflow:hidden}.pdf-extractor.dark-mode .text-viewer{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.viewer-header{align-items:center;background:#f8fafc;background:var(--bg-light);border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:16px 20px}.pdf-extractor.dark-mode .viewer-header{background:#1a202c;background:var(--dark-bg);border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.viewer-header h4{font-size:1rem;font-weight:600;margin:0}.viewer-actions{align-items:center;display:flex;gap:12px}.viewer-actions select{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:6px;color:#2c3e50;color:var(--text);cursor:pointer;font-size:.9rem;outline:none;padding:8px 12px}.pdf-extractor.dark-mode .viewer-actions select{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.viewer-actions button{background-color:#3498db;background-color:var(--primary);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;font-size:.9rem;font-weight:500;padding:8px 16px;transition:all .3s ease}.viewer-actions button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.text-content{background:#fff;background:var(--white);flex:1 1;overflow-y:auto;padding:20px}.pdf-extractor.dark-mode .text-content{background:#2d3748;background:var(--dark-bg-light)}.text-content pre{color:inherit;font-family:Courier New,monospace;font-size:.9rem;line-height:1.6;margin:0;white-space:pre-wrap;word-break:break-word}.related-tools{border-top:2px solid #e1e8ed;padding-top:30px}.pdf-extractor.dark-mode .related-tools{border-top-color:#4a5568;border-top-color:var(--dark-border)}.tools-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.tool-card{border-radius:10px;color:#2c3e50;color:var(--text);font-weight:500;gap:12px}.pdf-extractor.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tool-icon{font-size:1.5rem}.tool-name{font-size:.95rem}@media (max-width:768px){.pdf-extractor{margin:16px;padding:20px}.header-section{align-items:flex-start;flex-direction:column;gap:16px}.primary-actions{flex-direction:column;width:100%}.results-container,.settings-grid{grid-template-columns:1fr}.tools-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.file-drop-zone{padding:30px 20px}.result-header{align-items:flex-start;flex-direction:column;gap:12px}.result-actions{align-self:stretch;justify-content:space-between}.viewer-header{align-items:flex-start;flex-direction:column;gap:12px}.viewer-actions{align-self:stretch;justify-content:space-between}}.file-size-reducer{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.file-size-reducer.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.file-size-reducer.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.upload-area{background:#f8fafc;background:var(--bg-light);border:3px dashed #e1e8ed;border:3px dashed var(--border);border-radius:16px;cursor:pointer;overflow:hidden;padding:60px 40px;position:relative;text-align:center;transition:all .3s ease}.file-size-reducer.dark-mode .upload-area{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.upload-area:hover{background:#3498db0d;border-color:#3498db;border-color:var(--primary);transform:translateY(-2px)}.upload-content{pointer-events:none}.upload-icon{font-size:4rem;margin-bottom:20px;opacity:.7}.upload-area h3{color:inherit;font-size:1.5rem;margin:0 0 12px}.upload-area p{color:#7f8c8d;color:var(--text-light);margin:8px 0}.file-size-reducer.dark-mode .upload-area p{color:#a0aec0;color:var(--dark-text-secondary)}.upload-note{font-size:.9rem;font-style:italic}.file-input{left:0;top:0}.stats-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.file-size-reducer.dark-mode .stats-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.stats-grid{grid-gap:24px;gap:24px}.stat-item{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;padding:16px;text-align:center}.file-size-reducer.dark-mode .stat-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.stat-label{color:var(--text-light);margin-bottom:8px}.file-size-reducer.dark-mode .stat-label{color:#a0aec0;color:var(--dark-text-secondary)}.stat-value{color:#3498db;color:var(--primary);font-size:1.8rem}.stat-value.success{color:#2ecc71;color:var(--success)}.controls-section{display:flex;flex-direction:column;gap:16px;margin-bottom:30px}.primary-controls{display:flex;gap:16px;justify-content:center}.secondary-controls{display:flex;gap:12px;justify-content:center}button{font-size:1rem;padding:12px 24px}.compress-all-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white);font-size:1.1rem;padding:16px 32px}.compress-all-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}.settings-toggle{background-color:initial;border:2px solid #3498db;border:2px solid var(--primary);color:#3498db;color:var(--primary);padding:14px 28px}.settings-toggle:hover{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white);transform:translateY(-1px)}.download-all-button{background-color:#2ecc71;background-color:var(--success);color:#fff;color:var(--white);padding:10px 20px}.download-all-button:hover:not(:disabled){background-color:#27ae60;transform:translateY(-1px)}.clear-all-button{background-color:#e74c3c;background-color:var(--danger);color:#fff;color:var(--white);padding:10px 20px}.clear-all-button:hover{background-color:#c0392b;transform:translateY(-1px)}.advanced-settings{animation:fadeIn .3s ease-out;background:#f8fafc;border:1px solid #e1e8ed;border-radius:12px;margin-bottom:30px;padding:24px}.file-size-reducer.dark-mode .advanced-settings{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.advanced-settings h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin-bottom:24px;margin-top:0}.settings-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:20px}.setting-group{display:flex;flex-direction:column}.setting-group label{color:inherit;display:block;font-size:.9rem;font-weight:600;margin-bottom:8px}.setting-group input[type=range]{-webkit-appearance:none;appearance:none;background:#e1e8ed;background:var(--border);border-radius:4px;height:8px;margin-bottom:8px;outline:none;width:100%}.setting-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#3498db;background:var(--primary);border:2px solid #fff;border:2px solid var(--white);border-radius:50%;box-shadow:0 2px 4px #0000001a;cursor:pointer;height:18px;width:18px}.file-size-reducer.dark-mode .setting-group input[type=range]{background:#4a5568;background:var(--dark-border)}.file-size-reducer.dark-mode .setting-group input[type=range]::-webkit-slider-thumb{border-color:#1a202c;border-color:var(--dark-bg)}.setting-input{background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;color:#2c3e50;color:var(--text);font-family:inherit;font-size:.9rem;outline:none;padding:10px 12px;transition:all .3s ease;width:100%}.setting-input:focus{border-color:#3498db;border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a}.file-size-reducer.dark-mode .setting-input{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.setting-group small{color:#7f8c8d;color:var(--text-light);display:block;font-size:.8rem;margin-top:6px}.file-size-reducer.dark-mode .setting-group small{color:#a0aec0;color:var(--dark-text-secondary)}.checkbox-label{display:flex!important}.checkbox-label input[type=checkbox]{width:auto}.files-section{margin-bottom:30px}.files-section h3{align-items:center;color:inherit;display:flex;font-size:1.3rem;gap:10px;margin-bottom:20px}.files-list{display:flex;flex-direction:column;gap:16px}.file-item{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;justify-content:space-between;padding:20px;transition:all .3s ease}.file-size-reducer.dark-mode .file-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-item:hover{box-shadow:0 4px 12px #0000000d;transform:translateY(-1px)}.file-item.processing{background:#3498db0d;border-color:#3498db;border-color:var(--primary)}.file-item.completed{background:#2ecc710d;border-color:#2ecc71;border-color:var(--success)}.file-item.error{background:#e74c3c0d;border-color:#e74c3c;border-color:var(--danger)}.file-info{flex:1 1;min-width:0}.file-header{align-items:center;display:flex;gap:12px;margin-bottom:8px}.file-icon{font-size:1.2rem}.file-name{color:inherit;flex:1 1;font-size:1rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.remove-file{background:none;border:none;border-radius:4px;color:#7f8c8d;color:var(--text-light);cursor:pointer;font-size:1.1rem;padding:4px;transition:all .2s ease}.remove-file:hover{background:#e74c3c;background:var(--danger);color:#fff;color:var(--white)}.file-details{display:flex;flex-direction:column;font-size:.9rem;gap:4px}.file-size{color:#7f8c8d;color:var(--text-light)}.file-size-reducer.dark-mode .file-size{color:#a0aec0;color:var(--dark-text-secondary)}.file-compressed{color:#2ecc71;color:var(--success);font-weight:500}.compression-ratio{color:#3498db;color:var(--primary);font-weight:600;margin-left:8px}.progress-bar{background:#e1e8ed;background:var(--border);height:6px;margin-top:12px}.progress-bar,.progress-fill{border-radius:3px}.error-message{font-size:.85rem;margin-top:8px}.file-actions{display:flex;gap:8px;margin-left:16px}.compress-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white);font-size:.9rem;padding:8px 16px}.compress-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}.download-button{font-size:.9rem;padding:8px 16px}.download-button:hover{background-color:#27ae60;transform:translateY(-1px)}.related-tools{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:30px;padding:24px}.file-size-reducer.dark-mode .related-tools{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.related-tools h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin-bottom:20px;margin-top:0}.tools-grid{grid-gap:16px;gap:16px}.tool-card{background:#fff;background:var(--white);cursor:pointer;padding:16px}.file-size-reducer.dark-mode .tool-card{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.tool-card:hover{box-shadow:0 4px 12px #0000001a}.tool-card h4{align-items:center;color:#3498db;display:flex;gap:8px}.file-size-reducer.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.file-size-reducer{margin:16px;padding:20px}.header-section{flex-direction:column;gap:16px;text-align:center}.upload-area{padding:40px 20px}.upload-icon{font-size:3rem}.stats-grid{gap:16px;grid-template-columns:repeat(2,1fr)}.primary-controls,.secondary-controls{align-items:center;flex-direction:column}.settings-grid{grid-template-columns:1fr}.file-item{align-items:flex-start;flex-direction:column;gap:16px}.file-actions{justify-content:center;margin-left:0;width:100%}.tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.stats-grid{grid-template-columns:1fr}.stat-item{padding:12px}.stat-value{font-size:1.4rem}}.seo-article h1{color:var(--primary);font-size:2rem}.seo-article h2{color:var(--primary);font-size:1.6rem;margin:2rem 0 1rem}.seo-article h3{font-size:1.2rem;margin:1.5rem 0 .8rem}.feature-card{border-bottom:1px solid var(--border);margin-bottom:2.5rem;padding-bottom:1.5rem}.feature-card:last-child{border-bottom:none}.feature-grid{grid-gap:1.5rem;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:1.5rem 0}.feature-item{background:var(--bg-light);border-radius:10px;padding:1.2rem}.benefit{background-color:#3498db1a;border-radius:8px;font-style:italic;margin-top:.8rem;padding:.8rem}.code-block{background:var(--bg-light);border-radius:8px;margin:1rem 0;overflow-x:auto;padding:1rem}pre{font-family:monospace;font-size:1.1rem;margin:0}.fun-fact{background-color:#2ecc711a;border-radius:8px;margin-top:.8rem;padding:.8rem}.steps{padding-left:1.5rem}.steps li{margin-bottom:.8rem}.faq-item{margin-bottom:1.5rem}.advantages{list-style-type:none;padding-left:0}.advantages li{margin-bottom:.5rem;padding-left:1.5rem;position:relative}.advantages li:before{color:var(--success);content:"✓";left:0;position:absolute}.cta-section{background-color:#3498db1a;border-radius:12px;margin-top:3rem;padding:2rem;text-align:center}.cta-features{display:inline-block;margin:1.5rem 0;text-align:left}.cta-action{font-size:1.2rem;font-weight:700;margin-top:1.5rem}@media (max-width:768px){.seo-article{padding:20px}.feature-grid{grid-template-columns:1fr}}.metadata-viewer{--card-radius:12px;--gap:20px;--padding:28px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.metadata-viewer.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.metadata-viewer.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-section h2{align-items:center;color:inherit;display:flex;font-size:2rem;font-weight:700;gap:10px;margin:0}.drop-zone{background-color:#f8fafc;background-color:var(--bg-light);border:2px dashed #e1e8ed;border:2px dashed var(--border);border-radius:12px;margin-bottom:20px;padding:40px;text-align:center;transition:all .3s ease}.metadata-viewer.dark-mode .drop-zone{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.drop-zone:hover{background-color:#3498db0d;border-color:#3498db;border-color:var(--primary)}.drop-content{align-items:center;display:flex;flex-direction:column;gap:16px}.drop-content p{color:#7f8c8d;color:var(--text-light);font-size:1.1rem;margin:0}.metadata-viewer.dark-mode .drop-content p{color:#a0aec0;color:var(--dark-text-secondary)}.file-input-button{background-color:#3498db;background-color:var(--primary);border-radius:8px;color:#fff;color:var(--white);cursor:pointer;font-weight:600;padding:12px 24px;transition:all .3s ease}.file-input-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-2px)}.file-info{background-color:#f8fafc;background-color:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);padding:16px}.metadata-viewer.dark-mode .file-info{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-info h3{font-size:1.1rem;margin:0 0 8px}.file-info p{color:#7f8c8d;color:var(--text-light);margin:0}.metadata-viewer.dark-mode .file-info p{color:#a0aec0;color:var(--dark-text-secondary)}.error-message{background-color:#e74c3c1a;border-left:4px solid #e74c3c;border-left:4px solid var(--danger);margin-bottom:24px}.metadata-viewer.dark-mode .error-message{background-color:#e74c3c26}.loading{align-items:center;display:flex;flex-direction:column;gap:16px;margin-bottom:24px;padding:40px}.spinner{border:4px solid #e1e8ed;border-top:4px solid #3498db;border:4px solid var(--border);border-top-color:var(--primary);height:40px;width:40px}.metadata-viewer.dark-mode .spinner{border-color:#4a5568;border-color:var(--dark-border);border-top-color:#3498db;border-top-color:var(--primary)}.loading p{color:#7f8c8d;color:var(--text-light);margin:0}.metadata-viewer.dark-mode .loading p{color:#a0aec0;color:var(--dark-text-secondary)}.results-section{margin-bottom:30px}.section-header{margin-bottom:20px}.section-header h3{font-size:1.3rem;font-weight:600}.copy-button{background-color:#95a5a6;background-color:var(--secondary);color:var(--white);font-size:.9rem;font-weight:500;gap:6px;padding:8px 16px}.copy-button:hover{background-color:#7f8c8d;transform:translateY(-1px)}.metadata-display{display:flex;flex-direction:column;gap:24px}.metadata-category{background-color:#f8fafc;background-color:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;padding:20px}.metadata-viewer.dark-mode .metadata-category{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.metadata-category h4{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);color:#3498db;color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 16px;padding-bottom:8px}.metadata-viewer.dark-mode .metadata-category h4{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.metadata-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.metadata-item{border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:8px 0}.metadata-viewer.dark-mode .metadata-item{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.metadata-key{color:#2c3e50;color:var(--text);font-weight:600}.metadata-viewer.dark-mode .metadata-key{color:#f7fafc;color:var(--dark-text)}.metadata-value{color:#7f8c8d;color:var(--text-light);max-width:60%;text-align:right;word-break:break-word}.metadata-viewer.dark-mode .metadata-value{color:#a0aec0;color:var(--dark-text-secondary)}.history-section{margin-bottom:30px}.clear-button{align-items:center;background-color:#e74c3c;background-color:var(--danger);border:none;border-radius:6px;color:var(--white);cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:6px;padding:8px 16px;transition:all .3s ease}.clear-button:hover{background-color:#c0392b}.history-item{align-items:center;background:#f8fafc;border:1px solid #e1e8ed;display:flex;justify-content:space-between;padding:16px;transition:all .3s ease}.metadata-viewer.dark-mode .history-item{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.history-item:hover{box-shadow:0 4px 12px #0000000d;transform:translateY(-2px)}.history-content{flex:1 1;min-width:0}.history-content h4{color:#2c3e50;color:var(--text);font-size:1rem;margin:0 0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.metadata-viewer.dark-mode .history-content h4{color:#f7fafc;color:var(--dark-text)}.history-content p{color:#7f8c8d;color:var(--text-light);font-size:.85rem;margin:0}.metadata-viewer.dark-mode .history-content p{color:#a0aec0;color:var(--dark-text-secondary)}.restore-button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:6px;color:#fff;color:var(--white);cursor:pointer;display:flex;flex-shrink:0;font-size:.9rem;font-weight:500;gap:6px;margin-left:16px;padding:8px 16px;transition:all .3s ease}.restore-button:hover{background-color:#2980b9;background-color:var(--primary-hover);transform:translateY(-1px)}@media (max-width:768px){.metadata-viewer{margin:16px;padding:20px}.drop-zone{padding:24px}.metadata-grid{grid-template-columns:1fr}.metadata-item{flex-direction:column;gap:4px}.metadata-value{max-width:100%;text-align:left}.history-item{align-items:flex-start;flex-direction:column;gap:12px}.restore-button{align-self:flex-end;margin-left:0}}.metadata-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px;text-align:left}.metadata-viewer.dark-mode .metadata-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.metadata-article h1{color:var(--text);font-size:2.2rem;font-weight:700;line-height:1.3;margin:0 0 24px}.metadata-viewer.dark-mode .metadata-article h1{color:var(--dark-text)}.metadata-article h2{border-bottom:2px solid var(--border);color:var(--text);font-size:1.8rem;font-weight:600;margin:32px 0 24px;padding-bottom:8px}.metadata-viewer.dark-mode .metadata-article h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.metadata-article h3{color:var(--text);font-size:1.3rem;font-weight:600;margin:24px 0 16px}.metadata-viewer.dark-mode .metadata-article h3{color:var(--dark-text)}.metadata-article p{color:var(--text);font-size:1rem;line-height:1.7;margin:0 0 16px}.metadata-viewer.dark-mode .metadata-article p{color:var(--dark-text)}.feature-card,.intro-card{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;margin-bottom:32px;padding:28px}.metadata-viewer.dark-mode .feature-card,.metadata-viewer.dark-mode .intro-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.feature-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:20px}.feature-item{background:var(--white);border:1px solid var(--border);border-radius:8px;padding:20px;transition:all .3s ease}.metadata-viewer.dark-mode .feature-item{background:var(--dark-bg);border-color:var(--dark-border)}.feature-item:hover{box-shadow:0 8px 25px #00000014;transform:translateY(-2px)}.feature-item h3{color:var(--primary);margin-top:0}.metadata-types{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.type-category{background:var(--white);border:1px solid var(--border);border-radius:8px;padding:20px}.metadata-viewer.dark-mode .type-category{background:var(--dark-bg);border-color:var(--dark-border)}.type-category h3{border-bottom:1px solid var(--border);color:var(--primary);margin-top:0;padding-bottom:8px}.metadata-viewer.dark-mode .type-category h3{border-bottom-color:var(--dark-border)}.type-category ul{margin:16px 0 0;padding-left:20px}.type-category li{color:var(--text);font-size:.95rem;line-height:1.5;margin-bottom:8px}.metadata-viewer.dark-mode .type-category li{color:var(--dark-text)}.applications-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.application-item{background:var(--white);border:1px solid var(--border);border-radius:8px;padding:20px;transition:all .3s ease}.metadata-viewer.dark-mode .application-item{background:var(--dark-bg);border-color:var(--dark-border)}.application-item:hover{box-shadow:0 8px 25px #00000014;transform:translateY(-2px)}.application-item h3{color:var(--primary);margin-top:0}.privacy-list{margin:16px 0;padding-left:20px}.privacy-list li{color:var(--text);font-size:1rem;line-height:1.6;margin-bottom:12px}.metadata-viewer.dark-mode .privacy-list li{color:var(--dark-text)}.privacy-list strong{color:var(--primary)}.faq-item{background:var(--white);border:1px solid var(--border);border-radius:8px;margin-bottom:24px;padding:20px}.metadata-viewer.dark-mode .faq-item{background:var(--dark-bg);border-color:var(--dark-border)}.faq-item h3{color:var(--primary);margin-top:0}.cta-section{background:linear-gradient(135deg,var(--primary) 0,#2980b9 100%);border-radius:16px;color:#fff;margin:40px 0;padding:32px}.cta-section h2{border-bottom:1px solid #ffffff4d;color:#fff}.cta-section p{color:#fffffff2}.cta-features{margin:16px 0;padding-left:20px}.cta-features li{color:#fffffff2;margin-bottom:8px}.cta-action{font-size:1.1rem;font-weight:600;margin:20px 0 0}.related-tools{border-top:2px solid var(--border);margin-top:40px;padding-top:32px}.metadata-viewer.dark-mode .related-tools{border-top-color:var(--dark-border)}.tools-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-top:20px}.tool-card{border-radius:8px}.metadata-viewer.dark-mode .tool-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.tool-card:hover{box-shadow:0 8px 25px #00000014}.tool-card h4{color:var(--primary);font-size:1.1rem;margin:0 0 8px}.tool-card p{font-size:.9rem}.metadata-viewer.dark-mode .tool-card p{color:var(--dark-text-secondary)}@media (max-width:768px){.metadata-article{margin-top:20px;padding:24px 20px}.metadata-article h1{font-size:1.8rem}.metadata-article h2{font-size:1.5rem}.applications-grid,.feature-grid,.metadata-types,.tools-grid{gap:16px;grid-template-columns:1fr}.feature-card,.intro-card{padding:20px}.cta-section{padding:24px 20px}}@media (max-width:480px){.metadata-article{padding:20px 16px}.metadata-article h1{font-size:1.6rem}.application-item,.faq-item,.feature-item,.tool-card,.type-category{padding:16px}}:root{--primary:#3498db;--primary-hover:#2980b9;--secondary:#95a5a6;--success:#2ecc71;--warning:#f39c12;--danger:#e74c3c;--white:#fff;--bg-light:#f8fafc;--text:#2c3e50;--text-light:#7f8c8d;--border:#e1e8ed;--shadow:#1018280a;--dark-bg:#1a202c;--dark-bg-light:#2d3748;--dark-text:#f7fafc;--dark-text-secondary:#a0aec0;--dark-border:#4a5568;--dark-shadow:#0000004d;--upload-bg:#f0f8ff;--upload-border:#b3e0ff;--progress-bg:#ecf0f1;--file-hover:#f8f9fa;--directory-bg:#fff3cd}.zip-extractor{--card-radius:12px;--gap:24px;--padding:32px;background-color:#fff;background-color:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:0 10px 30px #1018280a;box-shadow:0 10px 30px var(--shadow);color:#2c3e50;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;margin:26px auto;max-width:1200px;padding:var(--padding);transition:all .3s ease}.zip-extractor.dark-mode{background-color:#1a202c;background-color:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border);box-shadow:0 10px 30px #0000004d;box-shadow:0 10px 30px var(--dark-shadow);color:#f7fafc;color:var(--dark-text)}.header-section{border-bottom:2px solid #e1e8ed;border-bottom:2px solid var(--border);margin-bottom:30px;padding-bottom:20px}.zip-extractor.dark-mode .header-section{border-bottom-color:#4a5568;border-bottom-color:var(--dark-border)}.header-section h1{color:inherit;font-size:2.2rem;gap:12px}.dark-mode-toggle{background-color:#95a5a6;background-color:var(--secondary);color:var(--white);font-size:1rem;gap:8px;padding:12px 16px}.dark-mode-toggle:hover{background-color:#7f8c8d}.upload-section{background:linear-gradient(135deg,#f0f8ff,#e6f3ff);background:linear-gradient(135deg,var(--upload-bg) 0,#e6f3ff 100%);border:3px dashed #b3e0ff;border:3px dashed var(--upload-border);border-radius:16px;cursor:pointer;margin-bottom:30px;padding:40px;text-align:center;transition:all .3s ease}.upload-section.drag-over,.upload-section:hover{background:linear-gradient(135deg,#e6f3ff,#d1ebff);border-color:#3498db;border-color:var(--primary);box-shadow:0 8px 25px #3498db26;transform:translateY(-2px)}.zip-extractor.dark-mode .upload-section{background:linear-gradient(135deg,#2d3748,#1a202c);background:linear-gradient(135deg,var(--dark-bg-light) 0,var(--dark-bg) 100%);border-color:#4a5568;border-color:var(--dark-border)}.zip-extractor.dark-mode .upload-section.drag-over,.zip-extractor.dark-mode .upload-section:hover{background:linear-gradient(135deg,#1a202c,#2a3441);background:linear-gradient(135deg,var(--dark-bg) 0,#2a3441 100%);border-color:#3498db;border-color:var(--primary)}.upload-content svg{color:#3498db;color:var(--primary);margin-bottom:16px}.upload-content h3{color:inherit;font-size:1.3rem;margin:0 0 8px}.upload-content p{color:#7f8c8d;color:var(--text-light);font-size:.95rem;margin:0 0 20px}.upload-button{align-items:center;background-color:#3498db;background-color:var(--primary);border:none;border-radius:10px;color:#fff;color:var(--white);cursor:pointer;display:inline-flex;font-size:1rem;font-weight:600;gap:10px;padding:14px 28px;transition:all .3s ease}.upload-button:hover{background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}.error-message{align-items:center;background:#e74c3c1a;border:1px solid #e74c3c;border:1px solid var(--danger);border-radius:8px;color:#e74c3c;color:var(--danger);display:flex;font-weight:500;gap:8px;margin-bottom:20px;padding:16px}.file-info-section{background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;margin-bottom:24px;padding:24px}.zip-extractor.dark-mode .file-info-section{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border)}.file-info-section h3{align-items:center;color:inherit;display:flex;font-size:1.2rem;gap:8px;margin:0 0 16px}.info-grid{grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.info-item{align-items:center;background:#fff;background:var(--white);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:8px;display:flex;justify-content:space-between;padding:12px}.zip-extractor.dark-mode .info-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.info-label{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:500}.zip-extractor.dark-mode .info-label{color:#a0aec0;color:var(--dark-text-secondary)}.info-value{color:inherit;font-size:.95rem;font-weight:600}.file-list-section{margin-bottom:30px}.section-header{flex-wrap:wrap;gap:12px;margin-bottom:16px}.section-header h3{color:inherit;font-size:1.2rem;gap:8px}.selection-controls{align-items:center;display:flex;gap:12px}.selected-count{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:500}.zip-extractor.dark-mode .selected-count{color:#a0aec0;color:var(--dark-text-secondary)}.select-all-btn{background:#0000;border:1px solid #3498db;border:1px solid var(--primary);border-radius:6px;color:#3498db;color:var(--primary);cursor:pointer;font-size:.85rem;padding:6px 12px;transition:all .2s ease}.select-all-btn:hover{background:#3498db1a}.file-list{border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;max-height:400px;overflow:hidden;overflow-y:auto}.zip-extractor.dark-mode .file-list{border-color:#4a5568;border-color:var(--dark-border)}.file-item{align-items:center;background:#fff;background:var(--white);border-bottom:1px solid #e1e8ed;border-bottom:1px solid var(--border);cursor:pointer;display:flex;padding:16px;transition:all .2s ease}.file-item:last-child{border-bottom:none}.file-item:hover{background:#f8f9fa;background:var(--file-hover)}.file-item.selected{background:#3498db0d;border-left:4px solid #3498db;border-left:4px solid var(--primary)}.file-item.directory{background:#f39c120d;cursor:default}.zip-extractor.dark-mode .file-item{background:#1a202c;background:var(--dark-bg);border-color:#4a5568;border-color:var(--dark-border)}.zip-extractor.dark-mode .file-item:hover{background:#2d3748;background:var(--dark-bg-light)}.zip-extractor.dark-mode .file-item.selected{background:#3498db1a}.zip-extractor.dark-mode .file-item.directory{background:#f39c121a}.file-icon{color:#95a5a6;color:var(--secondary);flex-shrink:0;margin-right:12px}.file-item.selected .file-icon{color:#3498db;color:var(--primary)}.file-item.directory .file-icon{color:#f39c12;color:var(--warning)}.file-details{flex:1 1;min-width:0}.filename{color:inherit;font-size:.95rem;font-weight:600;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-meta{color:#7f8c8d;color:var(--text-light);display:flex;font-size:.8rem;gap:12px}.zip-extractor.dark-mode .file-meta{color:#a0aec0;color:var(--dark-text-secondary)}.compression{color:#2ecc71!important;color:var(--success)!important}.file-checkbox{margin-left:12px}.file-checkbox input{cursor:pointer;height:18px;width:18px}.progress-section{margin-bottom:24px;text-align:center}.progress-bar{background:#ecf0f1;background:var(--progress-bg);border-radius:4px;height:8px;margin-bottom:8px;overflow:hidden;width:100%}.zip-extractor.dark-mode .progress-bar{background:#4a5568;background:var(--dark-border)}.progress-fill{background:linear-gradient(90deg,#3498db,#2ecc71);background:linear-gradient(90deg,var(--primary),var(--success));border-radius:4px;height:100%;transition:width .3s ease}.progress-text{color:#7f8c8d;color:var(--text-light);font-size:.9rem;font-weight:500}.zip-extractor.dark-mode .progress-text{color:#a0aec0;color:var(--dark-text-secondary)}.action-section{margin-bottom:30px}.primary-actions{flex-wrap:wrap;gap:16px;margin-bottom:16px}.secondary-actions{flex-wrap:wrap;gap:12px}button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-family:inherit;font-size:.95rem;font-weight:600;gap:8px;justify-content:center;outline:none;padding:12px 20px;transition:all .3s ease}button:disabled{cursor:not-allowed;opacity:.6;transform:none!important}.process-button{background-color:#3498db;background-color:var(--primary);color:#fff;color:var(--white);font-size:1rem;font-weight:700;padding:14px 28px}.process-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--primary-hover);box-shadow:0 6px 20px #3498db4d;transform:translateY(-2px)}.download-button{background-color:#2ecc71;background-color:var(--success);color:var(--white);font-size:1rem;padding:14px 28px}.download-button:hover:not(:disabled){background-color:#27ae60;box-shadow:0 6px 20px #2ecc714d;transform:translateY(-2px)}.secondary{background-color:#f8fafc;background-color:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);color:#2c3e50;color:var(--text);padding:10px 18px}.secondary:hover{background-color:#e1e8ed;background-color:var(--border);transform:translateY(-1px)}.zip-extractor.dark-mode .secondary{background-color:#2d3748;background-color:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.zip-extractor.dark-mode .secondary:hover{background-color:#4a5568;background-color:var(--dark-border)}.clear-button{background-color:#e74c3c!important;background-color:var(--danger)!important;border-color:#e74c3c!important;border-color:var(--danger)!important;color:#fff!important;color:var(--white)!important}.clear-button:hover{background-color:#c0392b!important;transform:translateY(-1px)}.spinner{height:16px;width:16px}.related-tools-section{border-top:2px solid #e1e8ed;border-top:2px solid var(--border);margin-bottom:30px;padding-top:30px}.zip-extractor.dark-mode .related-tools-section{border-top-color:#4a5568;border-top-color:var(--dark-border)}.related-tools-section h3{color:inherit;font-size:1.3rem;margin-bottom:20px;text-align:center}.related-tools-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.tool-card{align-items:center;background:#f8fafc;background:var(--bg-light);border:1px solid #e1e8ed;border:1px solid var(--border);border-radius:12px;color:inherit;display:flex;gap:16px;padding:20px;text-decoration:none;transition:all .3s ease}.tool-card:hover{border-color:#3498db;border-color:var(--primary);box-shadow:0 6px 20px #1018280a;box-shadow:0 6px 20px var(--shadow);transform:translateY(-2px)}.zip-extractor.dark-mode .tool-card{background:#2d3748;background:var(--dark-bg-light);border-color:#4a5568;border-color:var(--dark-border);color:#f7fafc;color:var(--dark-text)}.tool-card svg{color:#3498db;color:var(--primary);flex-shrink:0}.tool-card h4{font-size:1rem;font-weight:600;margin:0 0 4px}.tool-card p{color:#7f8c8d;color:var(--text-light);font-size:.85rem;line-height:1.4;margin:0}.zip-extractor.dark-mode .tool-card p{color:#a0aec0;color:var(--dark-text-secondary)}@media (max-width:768px){.zip-extractor{margin:16px;padding:24px}.header-section{flex-direction:column;gap:16px;text-align:center}.upload-section{padding:30px 20px}.info-grid{grid-template-columns:1fr}.section-header{align-items:flex-start;flex-direction:column}.selection-controls{justify-content:space-between;width:100%}.primary-actions{align-items:center;flex-direction:column}.primary-actions button,.secondary-actions button{max-width:300px;width:100%}.file-meta{flex-direction:column;gap:4px}.related-tools-grid{grid-template-columns:1fr}}@media (max-width:480px){.zip-extractor{padding:20px 16px}.header-section h1{font-size:1.8rem}.upload-content h3{font-size:1.1rem}.upload-button{font-size:.9rem;padding:12px 20px}.file-item{padding:12px}.download-button,.process-button{font-size:.9rem;padding:12px 20px}}.zip-extractor-article{background-color:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 32px #0000000a;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.7;margin:40px auto 0;max-width:1000px;padding:40px 32px;text-align:left}.zip-extractor.dark-mode .zip-extractor-article{background-color:var(--dark-bg);border-color:var(--dark-border);box-shadow:0 8px 32px #0003;color:var(--dark-text)}.article-header{border-bottom:2px solid var(--border);margin-bottom:40px;padding-bottom:24px;text-align:left}.zip-extractor.dark-mode .article-header{border-bottom-color:var(--dark-border)}.article-header h2{align-items:center;color:var(--text);display:flex;font-size:2.2rem;font-weight:700;gap:12px;line-height:1.3;margin:0 0 16px}.zip-extractor.dark-mode .article-header h2{color:var(--dark-text)}.article-header h2 svg{color:var(--primary);flex-shrink:0}.article-subtitle{color:var(--text-light);font-size:1.1rem;font-weight:400;line-height:1.6;margin:0}.zip-extractor.dark-mode .article-subtitle{color:var(--dark-text-secondary)}.article-section{margin-bottom:32px}.article-section h3{color:var(--text);font-size:1.5rem;font-weight:600;line-height:1.4;margin:0 0 20px}.zip-extractor.dark-mode .article-section h3{color:var(--dark-text)}.article-section h4{color:var(--text);font-size:1.2rem;font-weight:600;line-height:1.4;margin:24px 0 12px}.zip-extractor.dark-mode .article-section h4{color:var(--dark-text)}.article-section p{color:var(--text);font-size:1rem;line-height:1.7;margin:0 0 16px}.zip-extractor.dark-mode .article-section p{color:var(--dark-text)}.article-section ul{margin:16px 0;padding-left:24px}.article-section li{color:var(--text);font-size:1rem;line-height:1.6;margin-bottom:8px}.zip-extractor.dark-mode .article-section li{color:var(--dark-text)}.article-section strong{color:var(--primary);font-weight:600}.benefits-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:24px 0}.benefit-card{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:24px;text-align:left;transition:all .3s ease}.benefit-card:hover{box-shadow:0 8px 25px #00000014;transform:translateY(-2px)}.zip-extractor.dark-mode .benefit-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.benefit-card svg{color:var(--primary);margin-bottom:12px}.benefit-card h4{color:var(--text);font-size:1.1rem;font-weight:600;margin:0 0 8px}.zip-extractor.dark-mode .benefit-card h4{color:var(--dark-text)}.benefit-card p{color:var(--text-light);font-size:.95rem;line-height:1.5;margin:0}.zip-extractor.dark-mode .benefit-card p{color:var(--dark-text-secondary)}.concept-item{background:var(--bg-light);border-left:4px solid var(--primary);border-radius:10px;margin-bottom:24px;padding:20px}.zip-extractor.dark-mode .concept-item{background:var(--dark-bg-light)}.concept-item h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 12px}.concept-item p{color:var(--text);font-size:.95rem;line-height:1.6;margin:0}.zip-extractor.dark-mode .concept-item p{color:var(--dark-text)}.practices-list{display:flex;flex-direction:column;gap:16px;margin:24px 0}.practice-item{align-items:flex-start;background:var(--bg-light);border:1px solid var(--border);border-radius:10px;display:flex;gap:16px;padding:20px}.zip-extractor.dark-mode .practice-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.practice-item svg{color:var(--success);flex-shrink:0;margin-top:2px}.practice-item h4{color:var(--text);font-size:1.05rem;font-weight:600;margin:0 0 8px}.zip-extractor.dark-mode .practice-item h4{color:var(--dark-text)}.practice-item p{color:var(--text-light);font-size:.95rem;line-height:1.5;margin:0}.zip-extractor.dark-mode .practice-item p{color:var(--dark-text-secondary)}.scenarios-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:24px 0}.scenario-card{background:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px #0000000a;padding:24px}.zip-extractor.dark-mode .scenario-card{background:var(--dark-bg-light);border-color:var(--dark-border)}.scenario-card h4{border-bottom:1px solid var(--border);color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 16px;padding-bottom:8px}.zip-extractor.dark-mode .scenario-card h4{border-bottom-color:var(--dark-border)}.scenario-card ul{margin:0;padding-left:20px}.scenario-card li{color:var(--text);font-size:.9rem;line-height:1.5;margin-bottom:6px}.zip-extractor.dark-mode .scenario-card li{color:var(--dark-text)}.tech-considerations{display:flex;flex-direction:column;gap:20px;margin:24px 0}.tech-item{background:var(--bg-light);border:1px solid var(--border);border-radius:10px;padding:20px}.zip-extractor.dark-mode .tech-item{background:var(--dark-bg-light);border-color:var(--dark-border)}.tech-item h4{color:var(--text);font-size:1.1rem;font-weight:600;margin:0 0 12px}.zip-extractor.dark-mode .tech-item h4{color:var(--dark-text)}.tech-item p{color:var(--text-light);font-size:.95rem;line-height:1.6;margin:0}.zip-extractor.dark-mode .tech-item p{color:var(--dark-text-secondary)}.mistakes-list{display:flex;flex-direction:column;gap:16px;margin:24px 0}.mistake-item{background:#e74c3c0d;border-left:4px solid var(--danger);border-radius:8px;padding:16px 20px}.zip-extractor.dark-mode .mistake-item{background:#e74c3c1a}.mistake-item h4{color:var(--danger);font-size:1rem;font-weight:600;margin:0 0 8px}.mistake-item p{color:var(--text);font-size:.9rem;line-height:1.5;margin:0}.zip-extractor.dark-mode .mistake-item p{color:var(--dark-text)}.tools-comparison{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:24px 0}.tool-category{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:24px}.zip-extractor.dark-mode .tool-category{background:var(--dark-bg-light);border-color:var(--dark-border)}.tool-category h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 12px}.tool-category p{color:var(--text);font-size:.95rem;line-height:1.6;margin:0}.zip-extractor.dark-mode .tool-category p{color:var(--dark-text)}.conclusion{background:linear-gradient(135deg,var(--primary) 0,#2980b9 100%);border-radius:16px;color:#fff;margin-top:40px;padding:32px}.conclusion h3{color:#fff;margin-bottom:20px}.conclusion p{color:#fffffff2;font-size:1rem;line-height:1.7}.article-sidebar{grid-gap:24px;border-top:2px solid var(--border);display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-top:40px;padding-top:32px}.zip-extractor.dark-mode .article-sidebar{border-top-color:var(--dark-border)}.quick-tips,.related-articles{background:var(--bg-light);border:1px solid var(--border);border-radius:12px;padding:24px}.zip-extractor.dark-mode .quick-tips,.zip-extractor.dark-mode .related-articles{background:var(--dark-bg-light);border-color:var(--dark-border)}.quick-tips h4,.related-articles h4{color:var(--primary);font-size:1.1rem;font-weight:600;margin:0 0 16px}.quick-tips ul,.related-articles ul{margin:0;padding-left:20px}.quick-tips li,.related-articles li{color:var(--text);font-size:.9rem;line-height:1.5;margin-bottom:8px}.zip-extractor.dark-mode .quick-tips li,.zip-extractor.dark-mode .related-articles li{color:var(--dark-text)}.related-articles a{color:var(--primary);text-decoration:none;transition:all .2s ease}.related-articles a:hover{color:var(--primary-hover);text-decoration:underline}@media (max-width:768px){.zip-extractor-article{margin-top:20px;padding:24px 20px}.article-header h2{align-items:flex-start;flex-direction:column;font-size:1.8rem;gap:8px}.benefits-grid{gap:16px}.article-sidebar,.benefits-grid,.scenarios-grid,.tools-comparison{grid-template-columns:1fr}.article-sidebar{gap:20px}.conclusion{padding:24px 20px}}@media (max-width:480px){.zip-extractor-article{padding:20px 16px}.article-header h2{font-size:1.6rem}.article-subtitle{font-size:1rem}.article-section h3{font-size:1.3rem}.benefit-card,.scenario-card,.tool-category{padding:20px}.practice-item{flex-direction:column;gap:12px}.practice-item svg{margin-top:0}}.random-file-generator{background-color:var(--white);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 20px #0000000d;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin:20px auto;max-width:1000px;padding:30px}.random-file-generator.dark-mode{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.random-file-generator h2{border-bottom:1px solid var(--border);color:var(--text);font-size:1.8rem;font-weight:600;margin-bottom:10px;padding-bottom:15px;text-align:center}.dark-mode .random-file-generator h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.subtitle{color:var(--text-light);font-size:1.1rem;margin-bottom:30px;text-align:center}.dark-mode .subtitle{color:var(--dark-text-light)}.controls-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:25px}.control-group{display:flex;flex-direction:column;gap:8px}.control-group label{color:var(--text);font-size:.95rem;font-weight:500}.dark-mode .control-group label{color:var(--dark-text)}.control-group input[type=number],.control-group input[type=text],.control-group select{background-color:var(--white);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:inherit;font-size:.95rem;padding:12px 15px;transition:all .2s ease}.dark-mode .control-group input[type=number],.dark-mode .control-group input[type=text],.dark-mode .control-group select{background-color:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text)}.control-group input[type=number]:focus,.control-group input[type=text]:focus,.control-group select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3498db1a;outline:none}.size-input-group{display:flex;gap:10px}.size-input-group input{flex:2 1}.size-input-group select{flex:1 1;min-width:80px}.batch-toggle{background:var(--bg-light);border-left:4px solid var(--primary);border-radius:8px;margin:20px 0;padding:15px}.dark-mode .batch-toggle{background:var(--dark-bg-light)}.checkbox-label{align-items:center;cursor:pointer;display:flex;font-weight:500;gap:10px}.checkbox-label input[type=checkbox]{margin:0}.batch-settings{grid-gap:20px;background:#3498db0d;border:1px dashed var(--border);border-radius:8px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:20px 0;padding:20px}.dark-mode .batch-settings{background:#3498db1a;border-color:var(--dark-border)}.advanced-toggle{margin:20px 0;text-align:center}.toggle-btn{background:none;border:none;border-radius:6px;color:var(--primary);cursor:pointer;font-size:.95rem;font-weight:500;padding:8px 16px;transition:all .2s ease}.toggle-btn:hover{background:var(--bg-light)}.dark-mode .toggle-btn:hover{background:var(--dark-bg-light)}.advanced-settings{background:var(--bg-light);border:1px solid var(--border);border-radius:8px;margin:20px 0;padding:20px}.dark-mode .advanced-settings{background:var(--dark-bg-light);border-color:var(--dark-border)}.advanced-settings .control-group{align-items:center;flex-direction:row;gap:10px}.advanced-settings .control-group label{font-weight:400;margin:0}.generate-btn{background-color:var(--primary);border:none;border-radius:8px;color:var(--white);cursor:pointer;font-size:1.1rem;font-weight:600;margin:25px 0;padding:16px;transition:all .2s ease;width:100%}.generate-btn:hover:not(:disabled){background-color:var(--primary-hover);transform:translateY(-2px)}.generate-btn:disabled{cursor:not-allowed;opacity:.6;transform:none!important}.history-section{border-top:1px solid var(--border);margin-top:30px;padding-top:20px}.dark-mode .history-section{border-top-color:var(--dark-border)}.history-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.history-header h3{color:var(--text);font-size:1.3rem;margin:0}.dark-mode .history-header h3{color:var(--dark-text)}.clear-btn{background-color:var(--bg-light);border:1px solid var(--border);border-radius:6px;color:var(--text);cursor:pointer;font-size:.9rem;padding:8px 16px;transition:all .2s ease}.clear-btn:hover{background-color:var(--border)}.dark-mode .clear-btn{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.dark-mode .clear-btn:hover{background-color:var(--dark-border)}.history-list{display:flex;flex-direction:column;gap:12px}.history-item{background:var(--bg-light);border:1px solid var(--border);border-radius:8px;padding:15px;transition:all .2s ease}.history-item:hover{box-shadow:0 2px 8px #0000000d;transform:translateY(-1px)}.dark-mode .history-item{background:var(--dark-bg);border-color:var(--dark-border)}.file-info{align-items:center;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;margin-bottom:8px}.file-name{color:var(--text);font-weight:600}.dark-mode .file-name{color:var(--dark-text)}.file-size,.file-type{background:var(--white);border:1px solid var(--border);border-radius:4px;color:var(--text-light);font-size:.9rem;padding:4px 8px}.dark-mode .file-size,.dark-mode .file-type{background:var(--dark-bg-light);border-color:var(--dark-border);color:var(--dark-text-light)}.file-time{color:var(--text-light);font-size:.85rem}.dark-mode .file-time{color:var(--dark-text-light)}@media (max-width:900px){.random-file-generator{padding:20px}.batch-settings,.controls-grid{grid-template-columns:1fr}}@media (max-width:600px){.random-file-generator{margin:10px;padding:15px}.random-file-generator h2{font-size:1.5rem}.size-input-group{flex-direction:column}.file-info,.history-header{align-items:flex-start;flex-direction:column}.history-header{gap:10px}.clear-btn{align-self:flex-end}}.seo-article{animation:fadeIn .6s ease-out forwards;background:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 5px 15px #00000008;color:var(--text);font-size:1.05rem;line-height:1.75;margin:50px 0 30px;max-width:900px;padding:40px;position:relative;text-align:left}.seo-article.dark-mode{background:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.seo-article h1{border-bottom:2px solid var(--primary);color:var(--text);font-size:2.2rem;line-height:1.3;margin-bottom:1.5rem;padding-bottom:1rem}.dark-mode .seo-article h1{color:var(--dark-text)}.seo-article h2{border-bottom:1px solid var(--border);color:var(--text);font-size:1.7rem;margin:2.5rem 0 1rem;padding-bottom:.5rem}.dark-mode .seo-article h2{border-bottom-color:var(--dark-border);color:var(--dark-text)}.seo-article h3{color:var(--text);font-size:1.4rem;margin:2rem 0 .8rem}.dark-mode .seo-article h3{color:var(--dark-text)}.seo-article ol,.seo-article p,.seo-article ul{margin-bottom:1.5rem;text-align:left}.seo-article ol,.seo-article ul{padding-left:2rem}.seo-article li{margin-bottom:.5rem;text-align:left}.seo-article strong{color:var(--primary);font-weight:600}.dark-mode .seo-article strong{color:var(--primary-light)}.article-conclusion{background:linear-gradient(135deg,var(--primary-light) 0,var(--primary) 100%);border-radius:12px;color:#fff;margin:2rem 0;padding:2rem;text-align:center}.dark-mode .article-conclusion{background:linear-gradient(135deg,var(--primary) 0,var(--primary-dark) 100%)}.article-conclusion p{font-size:1.1rem;font-weight:500;margin:0;text-align:center}.hash-generator{background:linear-gradient(135deg,#667eea,#764ba2);color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;margin:0 auto;max-width:1400px;min-height:100vh;padding:2rem}.hash-generator.dark-mode{background:linear-gradient(135deg,#2c3e50,#3498db);color:#e0e0e0}.main-content{grid-template-columns:1fr 1fr}.algorithm-section,.input-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;padding:1.5rem}.dark-mode .algorithm-section,.dark-mode .input-section{background:#0000004d}.input-mode-selector{margin-bottom:1.5rem}.input-mode-selector h3{color:#2c3e50;margin-bottom:1rem}.dark-mode .input-mode-selector h3{color:#ecf0f1}.file-input-section,.text-input-section{margin-bottom:1.5rem}.text-input-section label{color:#2c3e50;display:block;font-weight:600;margin-bottom:.5rem}.dark-mode .text-input-section label{color:#ecf0f1}.text-input{background:#fff;border:1px solid #ddd;border-radius:8px;color:#333;font-family:Courier New,Monaco,monospace;font-size:.9rem;line-height:1.5;padding:1rem;resize:vertical;width:100%}.dark-mode .text-input{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.text-input:focus{border-color:#3498db;box-shadow:0 0 0 2px #3498db33;outline:none}.input-info{color:#7f8c8d;font-size:.85rem;margin-top:.5rem}.dark-mode .input-info{color:#95a5a6}.file-upload-area{position:relative}.file-input{cursor:pointer;height:100%;opacity:0;position:absolute;width:100%}.file-upload-label{align-items:center;background:#f8f9fa;border:2px dashed #bbb;border-radius:8px;cursor:pointer;display:flex;gap:1rem;justify-content:center;padding:2rem;transition:all .3s ease}.dark-mode .file-upload-label{background:#2c3e50;border-color:#555}.file-upload-label:hover{background:#3498db1a;border-color:#3498db}.upload-text{color:#2c3e50;font-weight:600}.dark-mode .upload-text{color:#ecf0f1}.upload-subtext{color:#7f8c8d;font-size:.85rem}.dark-mode .upload-subtext{color:#95a5a6}.file-info{background:#e8f4fd;border-left:4px solid #3498db;border-radius:8px;margin-top:1rem;padding:1rem}.dark-mode .file-info{background:#3498db1a}.file-details div{color:#555;font-size:.9rem;margin-bottom:.25rem}.dark-mode .file-details div{color:#bdc3c7}.use-case-section{margin-bottom:1.5rem}.use-case-section h3{color:#2c3e50;margin-bottom:1rem}.dark-mode .use-case-section h3{color:#ecf0f1}.use-case-grid{grid-gap:.75rem;display:grid;gap:.75rem}.use-case-button{align-items:center;background:#ecf0f1;border:none;border-radius:8px;cursor:pointer;display:flex;gap:.75rem;padding:1rem;text-align:left;transition:all .3s ease}.dark-mode .use-case-button{background:#34495e;color:#ecf0f1}.use-case-button:hover{background:#3498db;color:#fff;transform:translateY(-2px)}.use-case-name{font-size:.9rem;font-weight:600}.use-case-example{font-size:.8rem;opacity:.8}.section-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.section-header h3{align-items:center;color:#2c3e50;display:flex;gap:.5rem;margin:0}.dark-mode .section-header h3{color:#ecf0f1}.algorithm-actions{display:flex;gap:.5rem}.clear-button,.select-button{border:none;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;padding:.5rem 1rem;transition:all .3s ease}.select-button{background:#27ae60;color:#fff}.select-button:hover{background:#219a52}.algorithm-grid{grid-gap:1rem;display:grid;gap:1rem;margin-bottom:1.5rem}.algorithm-card{background:#f8f9fa;border:2px solid #0000;border-radius:8px;cursor:pointer;padding:1rem;transition:all .3s ease}.dark-mode .algorithm-card{background:#2c3e50}.algorithm-card.selected,.algorithm-card:hover{background:#3498db1a;border-color:#3498db;transform:translateY(-2px)}.algorithm-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:.5rem}.algorithm-header h4{align-items:center;color:#2c3e50;display:flex;gap:.5rem;margin:0}.dark-mode .algorithm-header h4{color:#ecf0f1}.algorithm-length{color:#7f8c8d;font-size:.8rem;font-weight:500}.dark-mode .algorithm-length{color:#95a5a6}.algorithm-description{color:#555;font-size:.85rem;line-height:1.4}.dark-mode .algorithm-description{color:#bdc3c7}.comparison-section{border-top:1px solid #eee;margin-top:1.5rem;padding-top:1.5rem}.dark-mode .comparison-section{border-color:#34495e}.comparison-header{margin-bottom:1rem}.comparison-header label{align-items:center;color:#2c3e50;cursor:pointer;display:flex;font-weight:500;gap:.5rem}.dark-mode .comparison-header label{color:#ecf0f1}.comparison-input label{color:#2c3e50;display:block;font-weight:600;margin-bottom:.5rem}.dark-mode .comparison-input label{color:#ecf0f1}.comparison-hash-input{border:1px solid #ddd;border-radius:6px;font-family:Courier New,Monaco,monospace;font-size:.9rem;padding:.75rem;width:100%}.dark-mode .comparison-hash-input{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.results-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;grid-column:1/-1;margin-bottom:2rem;padding:1.5rem}.dark-mode .results-section{background:#0000004d}.download-button,.toggle-button{align-items:center;border:none;border-radius:6px;cursor:pointer;display:flex;font-weight:500;gap:.5rem;padding:.5rem 1rem;transition:all .3s ease}.toggle-button{background:#95a5a6;color:#fff}.toggle-button:hover{background:#7f8c8d}.hash-results{grid-gap:1rem;display:grid;gap:1rem;margin-bottom:1.5rem}.hash-result-card{background:#f8f9fa;border:1px solid #ddd;border-radius:8px;padding:1.25rem}.dark-mode .hash-result-card{background:#2c3e50;border-color:#34495e}.result-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.algorithm-info h4{color:#2c3e50;margin:0 0 .25rem}.dark-mode .algorithm-info h4{color:#ecf0f1}.result-meta{color:#7f8c8d;font-size:.85rem}.dark-mode .result-meta{color:#95a5a6}.copy-button{background:#3498db;border:none;border-radius:6px;color:#fff;gap:.5rem;padding:.5rem 1rem}.copy-button:hover{background:#2980b9}.hash-value{background:#fff;border:1px solid #eee;border-radius:6px;color:#333;font-family:Courier New,Monaco,monospace;font-size:.85rem;padding:1rem;word-break:break-all}.dark-mode .hash-value{background:#34495e;border-color:#555;color:#ecf0f1}.comparison-result{align-items:center;border-radius:6px;display:flex;font-weight:600;gap:.5rem;margin-top:1rem;padding:.75rem}.comparison-result.match{background:#d4edda;border:1px solid #c3e6cb;color:#155724}.comparison-result.no-match{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24}.dark-mode .comparison-result.match{background:#27ae6033;color:#27ae60}.dark-mode .comparison-result.no-match{background:#e74c3c33;color:#e74c3c}.performance-stats{background:#f8f9fa;border-left:4px solid #3498db;border-radius:8px;padding:1rem}.dark-mode .performance-stats{background:#2c3e50}.performance-stats h4{color:#2c3e50;margin:0 0 1rem}.dark-mode .performance-stats h4{color:#ecf0f1}.stats-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.stat-item{align-items:center;display:flex;justify-content:space-between}.stat-label{color:#555;font-weight:500}.dark-mode .stat-label{color:#bdc3c7}.stat-value{font-family:Courier New,Monaco,monospace;font-weight:600}.action-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;margin-bottom:2rem;padding:1.5rem}.dark-mode .action-section{background:#0000004d}.primary-actions{display:flex;justify-content:center;margin-bottom:1rem}.generate-button{align-items:center;background:linear-gradient(135deg,#3498db,#2980b9);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.1rem;font-weight:600;gap:.5rem;padding:1rem 2rem;transition:all .3s ease}.generate-button:hover:not(:disabled){box-shadow:0 6px 20px #3498db66;transform:translateY(-2px)}.generate-button:disabled{cursor:not-allowed;opacity:.7;transform:none}.secondary-actions{display:flex;gap:1rem;justify-content:center}.secondary-button{align-items:center;background:#95a5a6;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;gap:.5rem;padding:.75rem 1.25rem;transition:all .3s ease}.secondary-button:hover{background:#7f8c8d;transform:translateY(-1px)}.advanced-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;margin-bottom:2rem;padding:1.5rem}.dark-mode .advanced-section{background:#0000004d}.advanced-section h3{color:#2c3e50;margin-bottom:1.5rem}.dark-mode .advanced-section h3{color:#ecf0f1}.info-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.info-card{background:#f8f9fa;padding:1.25rem}.dark-mode .info-card{background:#2c3e50}.info-card ul{margin:0;padding-left:1.5rem}.info-card li{color:#555;line-height:1.4;margin-bottom:.5rem}.dark-mode .info-card li{color:#bdc3c7}.info-section .info-card{background:#e8f4fd;border-left-color:#3498db;display:flex;gap:1rem}.dark-mode .info-section .info-card{background:#3498db1a}@media (max-width:1200px){.main-content{gap:1.5rem;grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}@media (max-width:768px){.hash-generator{padding:1rem}.header-section{flex-direction:column;gap:1rem;text-align:center}.header-section h1{font-size:1.5rem}.section-header{align-items:stretch;gap:1rem}.mode-buttons,.results-header,.section-header{flex-direction:column}.results-header{align-items:stretch;gap:1rem}.results-actions{justify-content:center}.secondary-actions{flex-direction:column}.info-grid,.stats-grid{grid-template-columns:1fr}.hash-value{font-size:.75rem}}.url-shortener{background:linear-gradient(135deg,#667eea,#764ba2);color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;margin:0 auto;max-width:1400px;min-height:100vh;padding:2rem}.url-shortener.dark-mode{background:linear-gradient(135deg,#2c3e50,#3498db);color:#e0e0e0}.header-section{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;display:flex;justify-content:space-between;margin-bottom:2rem;padding:1.5rem}.dark-mode .header-section{background:#0000004d;color:#e0e0e0}.header-section h1{align-items:center;color:#2c3e50;display:flex;font-size:2rem;font-weight:700;gap:1rem;margin:0}.dark-mode .header-section h1{color:#ecf0f1}.dark-mode-toggle{align-items:center;background:#3498db;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:.5rem;padding:.75rem 1.25rem;transition:all .3s ease}.dark-mode-toggle:hover{background:#2980b9;transform:translateY(-2px)}.main-content{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:500px 1fr;margin-bottom:2rem}.input-section,.results-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;height:-webkit-fit-content;height:fit-content;padding:1.5rem}.dark-mode .input-section,.dark-mode .results-section{background:#0000004d}.mode-selector{margin-bottom:1.5rem}.mode-selector h3{color:#2c3e50;margin-bottom:1rem}.dark-mode .mode-selector h3{color:#ecf0f1}.mode-button,.mode-buttons{display:flex;gap:.5rem}.mode-button{align-items:center;background:#ecf0f1;border:2px solid #0000;border-radius:8px;cursor:pointer;font-weight:500;padding:.75rem 1.25rem;transition:all .3s ease}.dark-mode .mode-button{background:#34495e;color:#ecf0f1}.mode-button.active,.mode-button:hover{background:#3498db;border-color:#2980b9;color:#fff}.url-input-group{margin-bottom:1.5rem}.url-input-group label{color:#2c3e50;display:block;font-weight:600;margin-bottom:.5rem}.dark-mode .url-input-group label{color:#ecf0f1}.url-input{background:#fff;border:1px solid #ddd;border-radius:8px;color:#333;font-size:.9rem;padding:1rem;transition:all .3s ease;width:100%}.dark-mode .url-input{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.url-input:focus{border-color:#3498db;box-shadow:0 0 0 2px #3498db33;outline:none}.url-input.error{border-color:#e74c3c;box-shadow:0 0 0 2px #e74c3c33}.url-validation{margin-top:.5rem}.validation-status{align-items:center;display:flex;font-size:.9rem;gap:.5rem;margin-bottom:.5rem}.validation-status.valid{color:#27ae60}.validation-status.invalid{color:#e74c3c}.validation-suggestions,.validation-warnings{display:flex;flex-direction:column;gap:.25rem}.suggestion,.warning{align-items:center;display:flex;font-size:.8rem;gap:.5rem;padding:.25rem 0}.warning{color:#f39c12}.suggestion{color:#3498db}.domain-selection{margin-bottom:1.5rem}.domain-selection label{color:#2c3e50;display:block;font-weight:600;margin-bottom:.5rem}.dark-mode .domain-selection label{color:#ecf0f1}.domain-selection select{background:#fff;border:1px solid #ddd;border-radius:6px;color:#333;padding:.75rem;width:100%}.dark-mode .domain-selection select{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.custom-alias-group{margin-bottom:1.5rem}.custom-alias-group label{color:#2c3e50;display:block;font-weight:600;margin-bottom:.5rem}.dark-mode .custom-alias-group label{color:#ecf0f1}.alias-input-wrapper{background:#fff;border:1px solid #ddd;border-radius:6px;display:flex;overflow:hidden}.dark-mode .alias-input-wrapper{background:#2c3e50;border-color:#34495e}.domain-prefix{background:#f8f9fa;border-right:1px solid #ddd;color:#555;font-size:.9rem;padding:.75rem;white-space:nowrap}.dark-mode .domain-prefix{background:#34495e;border-color:#555;color:#bdc3c7}.alias-input{background:#0000;border:none;color:inherit;flex:1 1;font-size:.9rem;outline:none;padding:.75rem}.alias-preview{color:#7f8c8d;font-family:Courier New,Monaco,monospace;font-size:.8rem;margin-top:.5rem}.dark-mode .alias-preview{color:#95a5a6}.advanced-options{border-top:1px solid #eee;margin-bottom:1.5rem;padding-top:1.5rem}.dark-mode .advanced-options{border-color:#34495e}.input-group{margin-bottom:1rem}.input-group label{color:#2c3e50;display:block;font-weight:600;margin-bottom:.5rem}.dark-mode .input-group label{color:#ecf0f1}.input-group input,.input-group select,.input-group textarea{background:#fff;border:1px solid #ddd;border-radius:6px;color:#333;font-size:.9rem;padding:.75rem;width:100%}.dark-mode .input-group input,.dark-mode .input-group select,.dark-mode .input-group textarea{background:#2c3e50;border-color:#34495e;color:#ecf0f1}.bulk-textarea{font-family:Courier New,Monaco,monospace;font-size:.85rem;line-height:1.4}.bulk-info{color:#7f8c8d;font-size:.85rem;margin-top:.5rem}.dark-mode .bulk-info{color:#95a5a6}.bulk-actions,.form-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.shorten-button{align-items:center;background:linear-gradient(135deg,#3498db,#2980b9);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:.5rem;padding:1rem 2rem;transition:all .3s ease}.shorten-button:hover:not(:disabled){box-shadow:0 6px 20px #3498db66;transform:translateY(-2px)}.shorten-button:disabled{cursor:not-allowed;opacity:.7;transform:none}.advanced-toggle{align-items:center;background:#95a5a6;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;gap:.5rem;padding:.75rem 1.25rem;transition:all .3s ease}.advanced-toggle:hover{background:#7f8c8d}.results-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.results-header h3{align-items:center;color:#2c3e50;display:flex;gap:.5rem;margin:0}.dark-mode .results-header h3{color:#ecf0f1}.results-actions{display:flex;gap:.5rem}.analytics-toggle,.clear-button,.download-button{align-items:center;border:none;border-radius:6px;cursor:pointer;display:flex;font-size:.85rem;font-weight:500;gap:.5rem;padding:.5rem 1rem;transition:all .3s ease}.analytics-toggle{background:#3498db;color:#fff}.analytics-toggle:hover{background:#2980b9}.download-button{background:#27ae60;color:#fff}.download-button:hover{background:#219a52}.clear-button{background:#e74c3c;color:#fff}.clear-button:hover{background:#c0392b}.url-list{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.url-card{background:#f8f9fa;border:2px solid #0000;border-radius:8px;cursor:pointer;padding:1.25rem;transition:all .3s ease}.dark-mode .url-card{background:#2c3e50}.url-card.selected,.url-card:hover{background:#3498db1a;border-color:#3498db;transform:translateY(-2px)}.url-card-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:1rem}.url-title{color:#2c3e50;font-weight:600;margin-bottom:.5rem}.dark-mode .url-title{color:#ecf0f1}.url-meta{align-items:center;color:#7f8c8d;display:flex;font-size:.85rem;gap:.5rem}.dark-mode .url-meta{color:#95a5a6}.clicks-count{align-items:center;color:#3498db;display:flex;font-weight:600;gap:.5rem}.url-links{margin-bottom:1rem}.original-url,.short-url{align-items:center;display:flex;font-size:.9rem;gap:.5rem;margin-bottom:.5rem}.original-url span,.short-url span{color:#555;font-weight:500;min-width:60px}.dark-mode .original-url span,.dark-mode .short-url span{color:#bdc3c7}.original-url a,.short-url a{color:#3498db;flex:1 1;text-decoration:none;word-break:break-all}.original-url a:hover,.short-url a:hover{text-decoration:underline}.copy-button{align-items:center;background:#0000;border:1px solid #3498db;border-radius:4px;color:#3498db;cursor:pointer;display:flex;padding:.25rem;transition:all .3s ease}.copy-button:hover{background:#3498db;color:#fff}.copy-button.success{background:#27ae60;border-color:#27ae60;color:#fff}.url-description{color:#555;font-size:.9rem;font-style:italic;margin-bottom:1rem}.dark-mode .url-description{color:#bdc3c7}.action-button,.url-actions{display:flex;gap:.5rem}.action-button{align-items:center;background:#ecf0f1;border:none;border-radius:4px;cursor:pointer;font-size:.85rem;padding:.5rem 1rem;transition:all .3s ease}.dark-mode .action-button{background:#34495e;color:#ecf0f1}.action-button:hover{background:#3498db;color:#fff}.spinner{animation:spin 1s linear infinite;border:2px solid #0000;border-radius:50%;border-top-color:currentcolor;height:20px;width:20px}@keyframes spin{to{transform:rotate(1turn)}}.analytics-section{border-top:2px solid #eee;margin-top:2rem;padding-top:2rem}.dark-mode .analytics-section{border-color:#34495e}.analytics-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.analytics-header h4{color:#2c3e50;margin:0}.dark-mode .analytics-header h4{color:#ecf0f1}.analytics-period{color:#7f8c8d;font-size:.9rem}.dark-mode .analytics-period{color:#95a5a6}.analytics-overview{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:2rem}.stat-card{background:#fff;border-left:4px solid #3498db;border-radius:8px;padding:1.25rem;text-align:center}.dark-mode .stat-card{background:#34495e}.stat-value{color:#2c3e50;font-size:2rem;font-weight:700;margin-bottom:.25rem}.dark-mode .stat-value{color:#ecf0f1}.stat-label{color:#7f8c8d;font-size:.9rem;letter-spacing:.5px;text-transform:uppercase}.dark-mode .stat-label{color:#95a5a6}.analytics-charts{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.chart-section{background:#fff;border:1px solid #eee;border-radius:8px;padding:1.25rem}.dark-mode .chart-section{background:#34495e;border-color:#555}.chart-section h5{color:#2c3e50;margin:0 0 1rem}.dark-mode .chart-section h5{color:#ecf0f1}.click-history-chart{align-items:end;border-bottom:1px solid #eee;display:flex;gap:.25rem;height:100px;padding:.5rem 0}.dark-mode .click-history-chart{border-color:#555}.history-bar{background:linear-gradient(0deg,#3498db,#5dade2);border-radius:2px 2px 0 0;cursor:pointer;flex:1 1;min-height:5px;position:relative;transition:all .3s ease}.history-bar:hover{background:linear-gradient(0deg,#2980b9,#3498db)}.bar-date{bottom:-18px;color:#666;font-size:.7rem;left:50%;position:absolute;transform:translateX(-50%)}.dark-mode .bar-date{color:#bdc3c7}.bar-clicks{color:#333;font-size:.6rem;font-weight:600;left:50%;position:absolute;top:-16px;transform:translateX(-50%)}.dark-mode .bar-clicks{color:#ecf0f1}.referrers-list{display:flex;flex-direction:column;gap:.75rem}.referrer-item{background:#f8f9fa;border-radius:6px;padding:.75rem;position:relative}.dark-mode .referrer-item{background:#2c3e50}.referrer-name{color:#2c3e50;font-weight:500}.dark-mode .referrer-name{color:#ecf0f1}.referrer-clicks{color:#7f8c8d;float:right;font-size:.9rem}.dark-mode .referrer-clicks{color:#95a5a6}.referrer-bar{background:#3498db;border-radius:0 0 6px 6px;bottom:0;height:3px;left:0;position:absolute}.devices-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(100px,1fr))}.device-stat{background:#f8f9fa;border-radius:6px;padding:1rem;text-align:center}.dark-mode .device-stat{background:#2c3e50}.device-name{color:#2c3e50;font-weight:600;margin-bottom:.5rem}.dark-mode .device-name{color:#ecf0f1}.device-clicks{color:#3498db;font-size:1.5rem;font-weight:700;margin-bottom:.25rem}.device-percentage{color:#7f8c8d;font-size:.85rem}.dark-mode .device-percentage{color:#95a5a6}.info-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;padding:1.5rem}.dark-mode .info-section{background:#0000004d}.info-card{background:#e8f4fd;border-left:4px solid #3498db;border-radius:8px;display:flex;gap:1rem;padding:1.5rem}.dark-mode .info-card{background:#3498db1a}.info-card h4{color:#2c3e50;margin:0 0 1rem}.dark-mode .info-card h4{color:#ecf0f1}.info-card p{color:#555;line-height:1.6;margin:0 0 1rem}.dark-mode .info-card p{color:#bdc3c7}.info-card p:last-child{margin-bottom:0}@media (max-width:1200px){.main-content{gap:1.5rem;grid-template-columns:1fr}.analytics-overview{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.analytics-charts{grid-template-columns:1fr}}@media (max-width:768px){.url-shortener{padding:1rem}.header-section{flex-direction:column;gap:1rem;text-align:center}.header-section h1{font-size:1.5rem}.mode-buttons,.results-header{flex-direction:column}.results-header{align-items:stretch;gap:1rem}.results-actions{justify-content:center}.url-card-header{align-items:stretch;gap:1rem}.bulk-actions,.form-actions,.url-card-header{flex-direction:column}.analytics-overview{grid-template-columns:repeat(2,1fr)}.devices-grid{grid-template-columns:1fr}.click-history-chart{height:80px}}
/*# sourceMappingURL=main.eda08270.css.map*/