*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#0f172a;min-height:100vh;color:#e2e8f0;overflow-x:hidden}.app{min-height:100vh;display:flex;flex-direction:column;position:relative}.animated-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;overflow:hidden;background:linear-gradient(135deg,#0f172a,#1e1b4b,#0f172a)}.gradient-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.3;animation:float 20s infinite ease-in-out}.orb-1{width:500px;height:500px;background:radial-gradient(circle,#22c55e 0%,transparent 70%);top:-200px;left:-200px;animation-delay:0s}.orb-2{width:400px;height:400px;background:radial-gradient(circle,#3b82f6 0%,transparent 70%);bottom:-150px;right:-150px;animation-delay:7s}.orb-3{width:350px;height:350px;background:radial-gradient(circle,#8b5cf6 0%,transparent 70%);top:50%;left:50%;animation-delay:14s}@keyframes float{0%,to{transform:translate(0) scale(1)}33%{transform:translate(100px,-100px) scale(1.1)}66%{transform:translate(-100px,100px) scale(.9)}}.header{background:#0f172ab3;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.1);color:#fff;padding:2rem 1rem;box-shadow:0 4px 30px #0000004d;position:relative;z-index:10}.header-content{max-width:1200px;margin:0 auto;text-align:center}.header-icon{font-size:4rem;margin-bottom:.5rem;filter:drop-shadow(0 0 20px rgba(34,197,94,.6))}.header h1{font-size:2.5rem;margin-bottom:.5rem;font-weight:700;background:linear-gradient(135deg,#22c55e,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header p{font-size:1.1rem;opacity:.8;color:#cbd5e1}.main-content{flex:1;padding:2rem 1rem;position:relative;z-index:1}.container{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:1.5rem}.card{background:#ffffff14;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:2rem;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000004d;transition:all .3s ease}.card:hover{border-color:#22c55e4d;box-shadow:0 8px 40px #22c55e33}.card-title{font-size:1.5rem;margin-bottom:1.5rem;color:#f1f5f9;display:flex;align-items:center;gap:.5rem;font-weight:600}.card-title .icon{font-size:1.8rem;filter:drop-shadow(0 0 10px rgba(34,197,94,.5))}.input-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1rem}.input-group{display:flex;flex-direction:column;gap:.5rem}.input-group label{font-weight:600;color:#cbd5e1;font-size:.9rem;text-transform:uppercase;letter-spacing:.5px}.input-group input{padding:.75rem;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:12px;font-size:1rem;color:#f1f5f9;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.input-group input:focus{outline:none;border-color:#22c55e;background:#22c55e1a;box-shadow:0 0 20px #22c55e4d;transform:translateY(-2px)}.input-group input::placeholder{color:#64748b}.info-box{background:#22c55e1a;border-left:4px solid #22c55e;padding:1rem;border-radius:12px;font-size:.95rem;line-height:1.6;color:#cbd5e1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 20px #22c55e1a}.info-box.success{background:#22c55e26;border-left-color:#22c55e;color:#d1fae5}.info-box strong{color:#22c55e}.appliances-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.appliance-card{background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.1);border-radius:16px;padding:1.25rem;transition:all .3s ease;cursor:pointer;position:relative;overflow:hidden}.appliance-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(59,130,246,.1) 0%,transparent 100%);opacity:0;transition:opacity .3s ease}.appliance-card:hover:before{opacity:1}.appliance-card:hover{border-color:#3b82f680;transform:translateY(-5px)}.appliance-card.selected{border-color:#22c55e99;background:#22c55e1a;box-shadow:0 0 30px #22c55e4d}.appliance-card.selected:before{background:linear-gradient(135deg,rgba(34,197,94,.2) 0%,transparent 100%);opacity:1}.appliance-header{display:flex;align-items:center;gap:1rem;position:relative;z-index:1}.appliance-icon{font-size:2.5rem;filter:drop-shadow(0 0 10px rgba(255,255,255,.3));transition:all .3s ease}.appliance-info{flex:1}.appliance-info h3{font-size:1.1rem;color:#f1f5f9;margin-bottom:.25rem;font-weight:600}.appliance-info p{color:#94a3b8;font-size:.9rem;font-weight:500}.checkbox-container{position:relative;cursor:pointer}.checkbox-container input{opacity:0;position:absolute}.checkmark{width:28px;height:28px;border:2px solid rgba(255,255,255,.3);border-radius:8px;display:block;transition:all .3s ease;background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.checkbox-container:hover .checkmark{border-color:#22c55e;box-shadow:0 0 15px #22c55e4d}.checkbox-container input:checked~.checkmark{background:linear-gradient(135deg,#22c55e,#16a34a);border-color:#22c55e;box-shadow:0 0 20px #22c55e80}.checkbox-container input:checked~.checkmark:after{content:"✓";color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:18px;font-weight:700}.appliance-controls{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1);display:flex;gap:1rem;flex-wrap:wrap;position:relative;z-index:1}.control-group{flex:1;min-width:100px}.control-group label{display:block;font-size:.85rem;color:#94a3b8;margin-bottom:.25rem;text-transform:uppercase;letter-spacing:.5px}.control-group input{width:100%;padding:.5rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:8px;font-size:.9rem;color:#f1f5f9;transition:all .3s ease}.control-group input:focus{outline:none;border-color:#22c55e;box-shadow:0 0 15px #22c55e4d}.daily-consumption{width:100%;background:linear-gradient(135deg,#3b82f633,#22c55e33);padding:.75rem;border-radius:10px;text-align:center;font-weight:600;color:#22c55e;font-size:.95rem;border:1px solid rgba(34,197,94,.3);box-shadow:0 0 15px #22c55e33}.progress-section{background:#ffffff14}.progress-title{font-size:1.2rem;margin-bottom:1rem;color:#f1f5f9;font-weight:600}.progress-bar-container{width:100%;height:50px;background:#0000004d;border-radius:25px;overflow:hidden;position:relative;box-shadow:inset 0 2px 10px #00000080;border:1px solid rgba(255,255,255,.1)}.progress-bar-fill{height:100%;display:flex;align-items:center;justify-content:center;border-radius:25px;position:relative;overflow:hidden}.progress-bar-fill:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.2) 50%,transparent 100%);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-text{color:#fff;font-weight:700;font-size:1rem;text-shadow:0 2px 4px rgba(0,0,0,.5);z-index:1}.progress-labels{display:flex;justify-content:space-between;margin-top:.75rem;font-size:.9rem;color:#94a3b8;font-weight:600}.progress-labels .overload{color:#ef4444;font-weight:700;text-shadow:0 0 10px rgba(239,68,68,.5)}.result-panel{border:2px solid rgba(255,255,255,.1)}.result-panel.supported{border-color:#22c55e80;box-shadow:0 0 40px #22c55e33}.result-panel.not-supported{border-color:#ef444480;box-shadow:0 0 40px #ef444433}.result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.reset-button{padding:.75rem 1.5rem;background:linear-gradient(135deg,#64748b4d,#4755694d);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:12px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.reset-button:hover{background:linear-gradient(135deg,#64748b80,#47556980);border-color:#fff6;box-shadow:0 0 20px #64748b80;transform:translateY(-2px)}.reset-button:active{transform:translateY(0)}.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1.5rem}.result-item{background:#0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1.5rem;border-radius:16px;text-align:center;border:1px solid rgba(255,255,255,.1);transition:all .3s ease}.result-item:hover{transform:translateY(-5px);box-shadow:0 10px 30px #0000004d}.result-label{font-size:.85rem;color:#94a3b8;margin-bottom:.75rem;text-transform:uppercase;letter-spacing:1px;font-weight:600}.result-value{font-size:2rem;font-weight:700;text-shadow:0 0 20px currentColor}.result-value.solar{color:#f59e0b}.result-value.consumption{color:#3b82f6}.result-value.positive{color:#22c55e}.result-value.negative{color:#ef4444}.status-indicator{display:flex;align-items:center;gap:1.5rem;padding:1.5rem;border-radius:16px;margin-top:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.status-indicator.status-ok{background:#22c55e26;border:2px solid rgba(34,197,94,.5);box-shadow:0 0 30px #22c55e33}.status-indicator.status-error{background:#ef444426;border:2px solid rgba(239,68,68,.5);box-shadow:0 0 30px #ef444433}.status-icon{font-size:2.5rem;width:70px;height:70px;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0;font-weight:700}.status-ok .status-icon{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;box-shadow:0 0 30px #22c55e99}.status-error .status-icon{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 0 30px #ef444499}.status-text strong{display:block;font-size:1.4rem;margin-bottom:.5rem}.status-ok .status-text strong{color:#22c55e;text-shadow:0 0 10px rgba(34,197,94,.5)}.status-error .status-text strong{color:#ef4444;text-shadow:0 0 10px rgba(239,68,68,.5)}.status-text p{color:#cbd5e1;line-height:1.6}.footer{background:#0f172acc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid rgba(255,255,255,.1);color:#fff;text-align:center;padding:1.5rem;margin-top:auto;position:relative;z-index:10}.footer p{opacity:.7;color:#94a3b8}@media (max-width: 768px){.header h1{font-size:1.8rem}.header p{font-size:1rem}.header-icon{font-size:3rem}.input-grid,.appliances-grid,.result-grid{grid-template-columns:1fr}.result-header{flex-direction:column;gap:1rem}.status-indicator{flex-direction:column;text-align:center}.card{padding:1.5rem}.result-value{font-size:1.5rem}}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#0f172a80}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#22c55e,#3b82f6);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#16a34a,#2563eb)}::selection{background:#22c55e4d;color:#fff}