:root{--color-ramaplast:#57b6da;--color-power:#fe9d0b;--color-energy:#eb5e28;--color-co2:#55b342;--color-self-use:#57b6da;--color-grid-feed:#495867;--color-accent:#df3fad;--color-background:#f3f4f6;--bg-light:#f9fafb;--text-dark:#111827;--text-medium:#6b7280;--card-padding:1.5rem}*{margin:0;padding:0;box-sizing:border-box}html{font-size:15px}body{font-family:'Montserrat',sans-serif;position:relative;color:var(--text-dark);overflow-x:hidden;min-height:100vh;display:flex;flex-direction:column}body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:url('/images/bg.jpg') no-repeat center center fixed;background-size:cover;z-index:-2}body::after{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:-1}.container{max-width:90%;margin:0 auto;padding:2rem 0;width:2560px;flex:1;display:flex;align-items:center}header{text-align:center;margin-bottom:3rem}.subtitle{font-size:1.1rem;color:var(--text-medium);font-weight:400;letter-spacing:.02em}.dashboard{flex:1;display:flex;flex-direction:column;gap:3rem}.card{background:rgba(255,255,255,.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:8px;padding:var(--card-padding);box-shadow:0 1px 3px rgba(0,0,0,.05),0 10px 20px rgba(0,0,0,.03);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}.card::before{content:'';position:absolute;top:0;left:0;right:0;height:8px}.card.power::before{background:var(--color-power)}.card.energy::before{background:var(--color-energy)}.card.co2::before{background:var(--color-co2)}.card.usage::before{background:linear-gradient(90deg,var(--color-self-use),var(--color-grid-feed))}.card.info::before{background:var(--color-ramaplast)}.card.usage{display:block}.card-title{font-size:2.1rem;margin-bottom:1.5rem;font-weight:700;text-transform:uppercase;display:flex;align-items:center;gap:.7rem}.card.power .card-title{color:var(--color-power)}.card.energy .card-title{color:var(--color-energy)}.card.co2 .card-title{color:var(--color-co2)}.card.info .card-title{color:var(--color-ramaplast)}.card.usage .card-title{background:linear-gradient(90deg,var(--color-self-use),var(--color-grid-feed));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.3)}}.card.power{flex:0 0 auto}.power-gauge{position:relative;width:100%;max-width:600px;height:19rem;margin:0 auto}#powerGauge{width:100%;height:100%}.power-value{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);text-align:center}.value-number{font-size:4.5rem;font-weight:900;line-height:1;letter-spacing:-.02em}.card.power .value-number{color:var(--color-power)}.card.energy .value-number{color:var(--color-energy)}.card.co2 .value-number{color:#fff}.card.co2 .value-label{color:#fff}.card.co2 .value-unit{color:#c0dfbb}.value-unit{font-size:1.6rem;color:var(--text-medium);font-weight:600;margin-top:.4rem}.value-label{font-size:.9rem;color:var(--text-medium);margin-top:.4rem;text-transform:uppercase;letter-spacing:.1em;font-weight:500}.radial-chart{position:relative;width:100%;max-width:400px;margin:0 auto;height:400px}.radial-chart svg{width:100%;height:100%}.chart-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.energy-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3rem}.usage-bar-wrapper{position:relative;height:18rem;max-width:600px;margin:0 auto}.usage-label-top{position:absolute;top:25px;left:0}.usage-label-bottom{position:absolute;bottom:5px;right:20px;text-align:right}.usage-label-title{font-size:1.2rem;font-weight:700;letter-spacing:.05em}.usage-label-title.self-use{color:var(--color-self-use)}.usage-label-title.grid-feed{color:var(--color-grid-feed)}.usage-percent{font-size:4.5rem;font-weight:900;line-height:.6}.usage-percent.self-use{color:var(--color-self-use);margin-top:.3rem}.usage-percent.grid-feed{color:var(--color-grid-feed);margin-bottom:.3rem}#usageBar{position:absolute;top:0;left:0;width:100%;height:100%}.card.co2{background:url(/images/forest.jpg);background-size:cover;background-position:50% 50%;justify-content:flex-start}.co2-layout{display:flex;align-items:center;gap:3rem;padding:1rem 0}.co2-content{flex:1;text-align:right;margin-top:4rem}.co2-content .value-number{color:var(--color-co2)}.info-text{margin-bottom:0;font-size:1.25rem}#weather-widget{position:relative;margin-top:1.5rem;margin-left:calc(-1*var(--card-padding));margin-right:calc(-1*var(--card-padding));margin-bottom:calc(-1*var(--card-padding));border-radius:0 0 8px 8px;overflow:hidden;height:100%;min-height:12rem}#weather-bg{position:absolute;inset:0;background:url('/images/weather/01d.jpg') center center/cover no-repeat;transition:background-image .5s ease}.weather-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,.05) 100%)}.weather-content{position:relative;height:100%;display:flex;justify-content:space-between;padding:1.2rem 1.8rem;flex-direction:row-reverse;align-items:start}.weather-left{display:flex;flex-direction:column;gap:.5rem;text-align:end}.weather-condition{display:flex;flex-direction:column;align-items:center;gap:.5rem}#weather-temp{font-size:4.5rem;font-weight:900;letter-spacing:-.1rem;color:#fff;line-height:1;text-shadow:0 2px 8px rgba(0,0,0,.3)}#weather-humidity{font-size:3rem;font-weight:900;color:rgba(255,255,255,.85);line-height:1;text-shadow:0 2px 6px rgba(0,0,0,.3);display:flex;align-items:center;gap:.3rem}#weather-humidity sup{font-size:1.5rem}#weather-desc{font-size:1.2rem;color:rgba(255,255,255,.9);text-shadow:0 1px 4px rgba(0,0,0,.3);text-transform:capitalize;text-align:center}#weather-location{font-size:.85rem;color:rgba(255,255,255,.75);margin-top:.2rem;text-shadow:0 1px 4px rgba(0,0,0,.3)}#weather-icon{width:6rem;height:6rem;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3));display:none}footer{margin-top:auto;width:100%;position:sticky;bottom:0}.footer-main{background:#8b827d;width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;padding:1rem 0}.footer-main-content{max-width:90%;width:2560px;margin:0 auto;padding:0;display:flex;align-items:center;justify-content:space-between;gap:2rem}.footer-logo{flex:0 0 auto}.footer-logo a{display:block}.footer-logo img{height:3rem;width:auto}.footer-info{flex:1;text-align:right;color:#fff}.footer-info p{margin:.3rem 0;font-size:.9rem}.footer-timestamp{font-weight:600;font-size:1.35rem}.footer-bottom{background:#6f6864;width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;padding:1rem 0;color:rgba(255,255,255,.8);font-size:1rem;text-align:center}.footer-bottom p{max-width:90%;width:2560px;margin:0 auto;padding:0}table{width:100%;font-size:1.5rem;color:var(--text-dark)}table td{vertical-align:text-bottom;border-bottom:solid 1px var(--text-medium);padding:.25rem 0}@media(max-width:1920px){html{font-size:12px}}@media(max-width:1600px){html{font-size:14px}.energy-grid{grid-template-columns:1fr 1fr;gap:2rem}}@media(max-width:1200px){html{font-size:14px}.energy-grid{grid-template-columns:1fr;gap:3rem}.container{padding:2rem 0}.card{padding:1rem}}@media(max-width:768px){html{font-size:14px}.energy-grid{grid-template-columns:1fr;gap:1rem}}