*{box-sizing:border-box;margin:0;padding:0}:root{--primary-bg:#0a0a0f;--secondary-bg:#1a1a2e;--tertiary-bg:#16213e;--accent-bg:#0f3460;--gradient-primary:linear-gradient(135deg,#667eea,#764ba2);--gradient-secondary:linear-gradient(135deg,#f093fb,#f5576c);--gradient-accent:linear-gradient(135deg,#4facfe,#00f2fe);--gradient-dark:linear-gradient(135deg,#2c3e50,#3498db);--neon-blue:#00d4ff;--neon-purple:#b347d9;--neon-pink:#ff006e;--neon-green:#39ff14;--neon-orange:#ff9500;--text-primary:#fff;--text-secondary:#b8c5d6;--text-muted:#7a8ba0;--text-accent:#00d4ff;--border-primary:#00d4ff4d;--border-secondary:#b347d94d;--shadow-neon:0 0 20px #00d4ff4d;--shadow-purple:0 0 20px #b347d94d;--shadow-dark:0 4px 20px #00000080;--font-primary:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono","Fira Code",monospace}body{background:#0a0a0f;background:var(--primary-bg);color:#fff;color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-family:var(--font-primary);line-height:1.6;overflow-x:hidden;position:relative}body:before{background:radial-gradient(circle at 20% 80%,#00d4ff1a 0,#0000 50%),radial-gradient(circle at 80% 20%,#b347d91a 0,#0000 50%),radial-gradient(circle at 40% 40%,#ff006e0d 0,#0000 50%);content:"";height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%;z-index:-1}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#1a1a2e;background:var(--secondary-bg)}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);background:var(--gradient-primary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#f093fb,#f5576c);background:var(--gradient-secondary)}::selection{background:#00d4ff4d;color:#fff;color:var(--text-primary)}.fade-in{animation:fadeIn .6s ease-out}.slide-up{animation:slideUp .8s ease-out}.glow{animation:glow 2s ease-in-out infinite alternate}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes glow{0%{box-shadow:0 0 20px #00d4ff4d}to{box-shadow:0 0 30px #00d4ff99,0 0 40px #b347d94d}}@media (max-width:768px){body{font-size:14px}}@media (prefers-contrast:high){:root{--text-primary:#fff;--text-secondary:#fff;--border-primary:#fff}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.App{min-height:100vh;position:relative}.app-background{background:linear-gradient(135deg,#0a0a0f,#1a1a2e 50%,#16213e);position:fixed;z-index:-1}.app-background,.grid-overlay{height:100%;left:0;top:0;width:100%}.grid-overlay{animation:gridMove 30s linear infinite;background-image:linear-gradient(#00d4ff1a 1px,#0000 0),linear-gradient(90deg,#00d4ff1a 1px,#0000 0);background-size:50px 50px;position:absolute}@keyframes gridMove{0%{transform:translateZ(0)}to{transform:translate3d(50px,50px,0)}}.floating-particles{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}.particle{animation:float 8s ease-in-out infinite;border-radius:50%;position:absolute}.particle-0{animation-delay:0s;background:var(--neon-blue);box-shadow:0 0 10px var(--neon-blue);height:4px;left:10%;top:20%;width:4px}.particle-1{animation-delay:2s;background:var(--neon-purple);box-shadow:0 0 15px var(--neon-purple);height:6px;left:80%;top:60%;width:6px}.particle-2{animation-delay:4s;background:var(--neon-pink);box-shadow:0 0 8px var(--neon-pink);height:3px;left:20%;top:80%;width:3px}.particle-3{animation-delay:1s;background:var(--neon-green);box-shadow:0 0 12px var(--neon-green);height:5px;left:70%;top:30%;width:5px}@keyframes float{0%,to{opacity:.7;transform:translateZ(0) rotate(0deg)}50%{opacity:1;transform:translate3d(0,-20px,0) rotate(180deg)}}.page-container{min-height:100vh;position:relative;z-index:1}.glass-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#1a1a2ecc;border:1px solid #00d4ff33;border-radius:16px;box-shadow:0 8px 32px #0000004d,inset 0 1px 0 #ffffff1a;padding:2rem;transition:all .3s ease}.glass-card:hover{border-color:#00d4ff66;box-shadow:0 12px 40px #0006,0 0 20px #00d4ff33,inset 0 1px 0 #fff3;transform:translateY(-2px)}.neon-button{background:#0000;border:2px solid var(--neon-blue);border-radius:8px;color:var(--neon-blue);cursor:pointer;font-family:var(--font-primary);font-size:14px;font-weight:600;letter-spacing:1px;overflow:hidden;padding:12px 24px;position:relative;text-transform:uppercase;transition:all .3s ease}.neon-button:before{background:linear-gradient(90deg,#0000,#00d4ff33,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.neon-button:hover{background:#00d4ff1a;box-shadow:0 0 20px #00d4ff80,inset 0 0 20px #00d4ff1a;color:var(--text-primary);transform:translateY(-2px)}.neon-button:hover:before{left:100%}.neon-button:active{transform:translateY(0)}.gradient-button{background:var(--gradient-primary);border:none;border-radius:12px;box-shadow:0 4px 15px #0003;color:var(--text-primary);cursor:pointer;font-family:var(--font-primary);font-size:16px;font-weight:600;overflow:hidden;padding:14px 28px;position:relative;transition:all .3s ease}.gradient-button:before{background:var(--gradient-secondary);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.gradient-button:hover{box-shadow:0 8px 25px #0000004d;transform:translateY(-3px)}.gradient-button:hover:before{opacity:1}.gradient-button span{position:relative;z-index:1}.cyber-input{background:#0a0a0fcc;border:1px solid #00d4ff4d;border-radius:8px;color:var(--text-primary);font-family:var(--font-mono);font-size:14px;padding:12px 16px;transition:all .3s ease;width:100%}.cyber-input:focus{background:#0a0a0fe6;border-color:var(--neon-blue);box-shadow:0 0 15px #00d4ff4d;outline:none}.cyber-input::placeholder{color:var(--text-muted)}.cyber-select{background:#0a0a0fcc;border:1px solid #00d4ff4d;border-radius:8px;color:var(--text-primary);cursor:pointer;font-family:var(--font-primary);font-size:14px;padding:12px 16px;transition:all .3s ease;width:100%}.cyber-select:focus{border-color:var(--neon-blue);box-shadow:0 0 15px #00d4ff4d;outline:none}.cyber-select option{background:var(--secondary-bg);color:var(--text-primary)}@media (max-width:768px){.glass-card{margin:1rem;padding:1.5rem}.neon-button{font-size:12px;padding:10px 20px}.gradient-button{font-size:14px;padding:12px 24px}}@media (max-width:480px){.glass-card{margin:.5rem;padding:1rem}.grid-overlay{background-size:30px 30px}}.clear-button{align-items:center!important;border-radius:3px!important;cursor:pointer!important;display:inline-flex!important;font-size:14px!important;font-weight:600!important;height:32px!important;justify-content:center!important;padding:8px 16px!important;transition:all .3s ease!important;white-space:nowrap!important;width:80px!important}.back-button,.gfs-back-button,.projector-calculator__back-button{border-radius:3px!important;font-size:14px!important;gap:8px!important;height:32px!important;padding:8px 16px!important;width:80px!important}.back-button,.calculate-button,.gfs-back-button,.projector-calculator__back-button{align-items:center!important;cursor:pointer!important;display:inline-flex!important;font-weight:600!important;justify-content:center!important;transition:all .3s ease!important;white-space:nowrap!important}.calculate-button{border-radius:4px!important;font-size:16px!important;height:40px!important;min-width:120px!important;padding:10px 20px!important}.action-buttons,.bb-action-buttons{display:flex!important;flex-wrap:wrap!important;gap:16px!important}.action-buttons,.bb-action-buttons,.neon-button{align-items:center!important;justify-content:center!important}.neon-button{border-radius:4px!important;cursor:pointer!important;display:inline-flex!important;font-size:14px!important;font-weight:600!important;height:36px!important;padding:8px 16px!important;transition:all .3s ease!important;white-space:nowrap!important}button{box-sizing:border-box!important}@media (max-width:768px){.back-button,.clear-button,.gfs-back-button,.projector-calculator__back-button{font-size:12px!important;height:30px!important;padding:6px 12px!important;width:70px!important}.calculate-button{font-size:14px!important;height:36px!important;min-width:100px!important;padding:8px 16px!important}.neon-button{font-size:12px!important;height:32px!important;padding:6px 12px!important}}.homepage-container{background-color:#0f172a;color:#e2e8f0;display:flex;height:100vh;overflow:hidden}.sidebar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#1e293bb3;border-right:1px solid #ffffff1a;display:flex;flex-direction:column;transition:transform .3s ease;width:280px;z-index:50}.sidebar-header{align-items:center;border-bottom:1px solid #ffffff0d;display:flex;justify-content:space-between;padding:1.5rem}.logo-container{align-items:flex-start;color:#38bdf8;display:flex;flex-direction:column;gap:.5rem}.logo-title-row{align-items:center;display:flex;gap:.5rem}.logo-fish-icon{color:#38bdf8;height:24px;width:24px}.logo-text{-webkit-text-fill-color:#0000;background:linear-gradient(90deg,#38bdf8,#818cf8);background-clip:text;-webkit-background-clip:text;font-size:1.4rem;font-weight:700;letter-spacing:-.025em;white-space:nowrap}.logo-subtitle{color:#94a3b8;font-size:.75rem;white-space:nowrap}.close-menu-btn{background:none;border:none;color:#94a3b8;cursor:pointer;display:none}.sidebar-nav{display:flex;flex:1 1;flex-direction:column;gap:.5rem;overflow-y:auto;padding:1.5rem 1rem}.nav-item{align-items:center;background:#0000;border:none;border-radius:.75rem;color:#94a3b8;cursor:pointer;display:flex;gap:.75rem;padding:.75rem 1rem;text-align:left;transition:all .2s ease;width:100%}.nav-item:hover{background:#ffffff0d;color:#e2e8f0}.nav-item.active{background:linear-gradient(90deg,#38bdf81a,#818cf81a);border:1px solid #38bdf833;color:#38bdf8}.nav-icon{opacity:.8}.nav-label{flex:1 1;font-size:.95rem;font-weight:500}.nav-count{background:#ffffff1a;border-radius:999px;color:#94a3b8;font-size:.75rem;padding:.15rem .5rem}.nav-item.active .nav-count{background:#38bdf833;color:#38bdf8}.sidebar-footer{border-top:1px solid #ffffff0d;padding:1.5rem}.version-info{color:#64748b;display:flex;flex-direction:column;font-size:.75rem;gap:.25rem}.main-content{display:flex;flex:1 1;flex-direction:column;overflow:hidden;position:relative}.top-bar{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f172acc;border-bottom:1px solid #ffffff0d;display:flex;gap:1rem;height:70px;padding:0 2rem;z-index:40}.mobile-menu-btn{background:none;border:none;color:#e2e8f0;cursor:pointer;display:none;padding:.5rem}.search-container{align-items:center;display:flex;flex:1 1;max-width:600px;position:relative}.search-icon{color:#94a3b8;left:1rem;pointer-events:none;position:absolute}.search-input{background:#1e293b80;border:1px solid #ffffff1a;border-radius:.75rem;color:#e2e8f0;font-size:.95rem;padding:.75rem 1rem .75rem 3rem;transition:all .2s ease;width:100%}.search-input:focus{background:#1e293bcc;border-color:#38bdf8;box-shadow:0 0 0 2px #38bdf833;outline:none}.header-logo{align-self:flex-start;flex-shrink:0;margin-left:auto;margin-top:20px}.header-logo-img{border-radius:8px;height:210px;transition:transform .2s ease;width:auto}.header-logo-img:hover{transform:scale(1.05)}.content-scroll-area{flex:1 1;overflow-y:auto;padding:2rem}.content-wrapper{margin:0 auto;max-width:1400px}.section-header{margin-bottom:2.5rem}.section-title{align-items:center;display:flex;font-size:2rem;font-weight:700;gap:1rem;margin-bottom:.5rem}.module-count-badge{background:#38bdf81a;border-radius:999px;color:#38bdf8;font-size:1rem;font-weight:500;padding:.25rem .75rem}.section-subtitle{color:#94a3b8;font-size:1.1rem}.modules-grid-new{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));padding-bottom:4rem}.module-card-new{background:#1e293b99;border:1px solid #ffffff0d;border-radius:1rem;overflow:hidden;position:relative;transition:all .3s ease}.module-card-new:hover{background:#1e293be6;border-color:#38bdf84d;box-shadow:0 10px 30px -10px #00000080}.module-link-new{color:inherit;display:block;height:100%;padding:1.5rem;text-decoration:none}.card-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:1rem}.icon-wrapper{align-items:center;background:linear-gradient(135deg,#38bdf81a,#818cf81a);border:1px solid #38bdf833;border-radius:12px;color:#38bdf8;display:flex;height:48px;justify-content:center;width:48px}.arrow-icon{color:#64748b;opacity:0;transform:translateX(-10px);transition:all .3s ease}.module-card-new:hover .arrow-icon{color:#38bdf8;opacity:1;transform:translateX(0)}.card-title{color:#f1f5f9;font-size:1.25rem;font-weight:600;margin-bottom:.75rem}.card-desc{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;color:#94a3b8;display:-webkit-box;font-size:.9rem;line-height:1.6;margin-bottom:1.5rem;overflow:hidden}.card-tags{display:flex;flex-wrap:wrap;gap:.5rem}.tag{background:#ffffff0d;border:1px solid #ffffff0d;border-radius:999px;color:#94a3b8;font-size:.75rem;padding:.25rem .75rem}.no-results{align-items:center;color:#94a3b8;display:flex;flex-direction:column;grid-column:1/-1;justify-content:center;padding:4rem;text-align:center}.no-results-icon{font-size:4rem;margin-bottom:1rem;opacity:.5}@media (max-width:1024px){.sidebar{box-shadow:20px 0 50px #00000080;height:100%;left:0;position:fixed;top:0;transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.close-menu-btn,.mobile-menu-btn{display:block}.top-bar{padding:0 1rem}.content-scroll-area{padding:1.5rem}}@media (max-width:640px){.modules-grid-new{grid-template-columns:1fr}.section-title{font-size:1.5rem}}.slow-payback-module .feature-tag{background:#84cc161a;border-color:#84cc1633;color:#84cc16}.storage-module .feature-tag{background:#8b5cf61a;border-color:#8b5cf633;color:#8b5cf6}.ups-module .feature-tag{background:#f59e0b1a;border-color:#f59e0b33;color:#f59e0b}.display-ratio-module .feature-tag{background:#06b6d41a;border-color:#06b6d433;color:#06b6d4}.focal-length-module .feature-tag{background:#ec48991a;border-color:#ec489933;color:#ec4899}.led-display-module .feature-tag{background:#ef44441a;border-color:#ef444433;color:#ef4444}.conduit-tray-module .feature-tag{background:#10b9811a;border-color:#10b98133;color:#10b981}.precision-air-conditioning-module .feature-tag{background:#14b8a61a;border-color:#14b8a633;color:#14b8a6}.gas-fire-suppression-module .feature-tag{background:#f973161a;border-color:#f9731633;color:#f97316}.fresh-air-module .feature-tag{background:#0ea5e91a;border-color:#0ea5e933;color:#0ea5e9}.electrical-well-module .feature-tag{background:#6366f11a;border-color:#6366f133;color:#6366f1}.projector-calculator-module .feature-tag{background:#f472b61a;border-color:#f472b633;color:#f472b6}.cable-excavation-module .feature-tag{background:#a78bfa1a;border-color:#a78bfa33;color:#a78bfa}.spd-selector-module .feature-tag{background:#fbbf241a;border-color:#fbbf2433;color:#fbbf24}.breaker-box-module .feature-tag{background:#34d3991a;border-color:#34d39933;color:#34d399}.cabinet-layout-module .feature-tag{background:#64748b1a;border-color:#64748b33;color:#64748b}.ip-address-calculator-module .feature-tag{background:#06b6d41a;border-color:#06b6d433;color:#06b6d4}.amount-converter-module .feature-tag{background:#22c55e1a;border-color:#22c55e33;color:#22c55e}.module-button{align-items:center;background:var(--gradient-primary);border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:.5rem;justify-content:center;padding:1rem;position:relative;transition:all .3s ease;width:100%;z-index:1}.charging-module .module-button{background:var(--gradient-secondary)}.construction-module .module-button{background:linear-gradient(135deg,#ff8c00,orange)}.fast-payback-module .module-button{background:linear-gradient(135deg,#22c55e,#16a34a)}.slow-payback-module .module-button{background:linear-gradient(135deg,#84cc16,#65a30d)}.storage-module .module-button{background:linear-gradient(135deg,#8b5cf6,#a855f7)}.ups-module .module-button{background:linear-gradient(135deg,#f59e0b,#d97706)}.display-ratio-module .module-button{background:linear-gradient(135deg,#06b6d4,#0891b2)}.focal-length-module .module-button{background:linear-gradient(135deg,#ec4899,#be185d)}.led-display-module .module-button{background:linear-gradient(135deg,#ef4444,#dc2626)}.conduit-tray-module .module-button{background:linear-gradient(135deg,#10b981,#059669)}.precision-air-conditioning-module .module-button{background:linear-gradient(135deg,#14b8a6,#0f766e)}.gas-fire-suppression-module .module-button{background:linear-gradient(135deg,#f97316,#ea580c)}.fresh-air-module .module-button{background:linear-gradient(135deg,#0ea5e9,#0284c7)}.electrical-well-module .module-button{background:linear-gradient(135deg,#6366f1,#4f46e5)}.projector-calculator-module .module-button{background:linear-gradient(135deg,#f472b6,#ec4899)}.cable-excavation-module .module-button{background:linear-gradient(135deg,#a78bfa,#8b5cf6)}.spd-selector-module .module-button{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.breaker-box-module .module-button{background:linear-gradient(135deg,#34d399,#10b981)}.cabinet-layout-module .module-button{background:linear-gradient(135deg,#64748b,#475569)}.ip-address-calculator-module .module-button{background:linear-gradient(135deg,#06b6d4,#0891b2)}.amount-converter-module .module-button{background:linear-gradient(135deg,#22c55e,#16a34a)}.module-button:hover{box-shadow:0 8px 20px #0000004d;transform:translateY(-2px)}.button-icon{height:18px;transition:transform .3s ease;width:18px}.module-button:hover .button-icon{transform:translateX(3px)}.homepage-footer{border-top:1px solid #00d4ff1a;margin-top:4rem;padding-top:2rem}.footer-content{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}.footer-text{color:var(--text-muted);font-size:.875rem}.footer-tech{display:flex;gap:.5rem}.tech-badge{background:#00d4ff1a;border:1px solid #00d4ff33;border-radius:12px;color:var(--neon-blue);font-size:.75rem;padding:.25rem .5rem}@media (max-width:1024px){.hero-section{gap:3rem;grid-template-columns:1fr;text-align:center}.hero-content{padding-left:0}.hero-visual{height:300px;order:-1}.visual-container{height:300px;width:300px}.home-page{padding:2rem 3rem}}@media (max-width:768px){.home-page{padding:1rem 2rem}.hero-section{margin-bottom:4rem}.hero-stats{justify-content:center}.features-grid,.modules-grid{grid-template-columns:1fr}.footer-content{flex-direction:column;text-align:center}}@media (max-width:480px){.home-page{padding:1rem 1.5rem}.feature-card,.module-card{padding:1.5rem}.hero-badge{font-size:.75rem}.stat-number{font-size:1.5rem}}.module-link,.module-link:hover{color:inherit;text-decoration:none}