*{box-sizing:border-box}body{margin:0;font-family:Roboto,Arial,sans-serif;color:#4a4a4a;background:#eee;font-size:18px}a{color:inherit;text-decoration:none}.topbar{height:84px;background:#4257b8;color:#fff;display:flex;align-items:center;gap:28px;padding:0 11%;box-shadow:0 2px 5px #00000040;position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:10px;font-size:26px;white-space:nowrap}.topbar nav{display:flex;gap:28px;align-items:center;flex:1;font-size:17px}.panel-btn{background:#ff5528;border:0;color:#fff;padding:18px 42px;font-weight:700;font-size:18px;border-radius:2px;box-shadow:0 3px 5px #00000047}.page{max-width:1540px;margin:0 auto;padding:38px 36px 70px}.step-tabs{display:grid;grid-template-columns:repeat(7,1fr);margin:0 40px 26px;box-shadow:0 2px 4px #00000040}.step-tabs button{height:42px;border:0;border-right:1px solid #ddd;background:#f3f3f3;font-weight:700;color:#333}.step-tabs button.active{background:#ff5528;color:#fff}.step-tabs button.result-tab{background:#4caf50;color:#fff}.step-tabs button.result-tab.active{background:#2e9d35}.card,.info-box,.result-page{background:#fff;box-shadow:0 14px 28px #00000040;border-radius:2px}.card{padding:48px 58px;min-height:720px}.result-page{padding:24px 58px 70px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:start}h1{font-size:42px;font-weight:300;margin:0 0 30px;line-height:1.2}h1 span{font-size:28px;color:#777;font-weight:700}h2{font-size:28px;font-weight:300;margin:24px 0 20px}h3{margin:0 0 14px;font-size:24px;font-weight:400}p{line-height:1.45}.muted,small{color:#8a8a8a}.form-grid{display:grid;gap:30px}.field{display:grid;grid-template-columns:220px minmax(280px,1fr);align-items:start;gap:36px}.field-label{color:#aaa;text-align:right;font-weight:700;font-size:16px;padding-top:8px}.field:focus-within .field-label{color:#009688}.field-control{display:grid;gap:6px}input[type=text],input[type=number],select{width:100%;border:0;border-bottom:1px solid #cfcfcf;padding:6px 0 8px;font:inherit;color:#555;background:transparent;outline:none}select:focus,input:focus{border-bottom:2px solid #009688}.input-with-unit{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:end}.radio-list,.checks{display:grid;gap:14px}.radio-line,.check-line{display:flex;align-items:center;gap:12px;font-size:24px;color:#bbb}input[type=radio],input[type=checkbox]{width:24px;height:24px;accent-color:#009688}.btn{border:0;border-radius:2px;box-shadow:0 3px 6px #00000040;padding:16px 36px;font-size:18px;font-weight:700;margin-top:34px}.btn.primary{background:#009688;color:#fff}.btn.secondary{background:#eee;color:#333}.btn.green{background:#4caf50;color:#fff}.btn.danger{background:#e53935;color:#fff}.info-box{padding:22px 28px;box-shadow:0 3px 8px #0000002e}.info-box.blue{background:#16aeea;color:#fff}.info-box.green{background:#4caf50;color:#fff}.info-box.gray{background:#f7f7f7}.map-panel{max-width:980px;margin-left:auto;margin-top:24px}.map-success{background:#4caf50;color:#fff;padding:18px 22px;font-size:20px}.fake-map{height:520px;background:linear-gradient(35deg,rgba(255,184,108,.55) 0 2px,transparent 2px 70px),linear-gradient(115deg,rgba(241,99,132,.6) 0 3px,transparent 3px 85px),radial-gradient(circle at 35% 35%,#e7f4d7 0 11%,transparent 11%),radial-gradient(circle at 72% 64%,#d9efd1 0 16%,transparent 16%),#f6f3dc;position:relative;overflow:hidden;border:1px solid #ddd}.fake-map span{position:absolute;left:12px;top:12px;background:#fff;border:1px solid #ccc;padding:4px 10px;line-height:1.5}.fake-map b{position:absolute;left:52%;top:48%;font-size:48px;transform:translate(-50%,-50%)}.preview h2{margin-top:0}.preview svg{width:100%;display:block;background:#5fc7e8}.preview text{font-size:18px;font-weight:700;fill:#000}.preview .svg-strong{font-size:22px;font-weight:900}.fuel-log{border-top:1px solid #eee;padding-top:20px;display:grid;gap:22px}.fuel-log-title{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#555}.fuel-log-title button,.inline-action{border:0;background:#eee;color:#333;border-radius:2px;box-shadow:0 2px 5px #0003;padding:10px 14px;font-weight:700;display:inline-flex;align-items:center;gap:8px}.inline-action{width:fit-content;color:#009688}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-left:auto;max-width:760px}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:start}.energy-band{display:grid;grid-template-columns:86px 1fr;background:#4caf50;color:#fff;font-size:28px;font-weight:700;margin-bottom:10px}.energy-band strong{background:#a7dc00;font-size:48px;padding:16px 28px}.energy-band span{padding:28px 18px}mark,.pill{display:inline-block;background:#ff5528;color:#fff;padding:6px 12px;font-weight:700}.pill.gray{background:#999}.pill.blue{background:#12aeea}.pill.green{background:#4caf50}.summary-panel table,.modal table{width:100%;border-collapse:collapse;margin:16px 0 18px}th,td{border-top:1px solid #ddd;padding:10px 8px;text-align:left;vertical-align:top}th{font-weight:400;color:#666;width:38%}.cost-bars{display:grid;gap:12px}.cost-row{display:grid;grid-template-columns:230px 1fr 90px;gap:12px;align-items:center}.cost-row div{height:28px;border-left:2px solid #c7d8ee;background:repeating-linear-gradient(90deg,#fff 0 98px,#ddd 100px 102px)}.cost-row i{display:block;height:100%;background:#7bb7e8}.improvements{display:grid;gap:12px;font-size:24px}.improvements strong{background:#4caf50;color:#fff;padding:8px 14px;display:inline-block;min-width:72px;text-align:center}.pie-wrap{display:grid;grid-template-columns:260px 1fr;gap:28px;align-items:center;margin-top:24px}.pie{width:240px;aspect-ratio:1;border-radius:50%}.legend{display:grid;gap:10px}.legend b{display:inline-block;width:14px;height:14px;margin-right:8px}.modal-backdrop{position:fixed;inset:0;background:#0000008c;z-index:100;display:grid;place-items:start center;overflow:auto;padding:40px}.modal{width:min(760px,95vw);background:#fff;position:relative;padding:28px 34px;box-shadow:0 20px 40px #0006}.modal-x{position:absolute;right:18px;top:12px;border:0;background:transparent;color:#aaa}footer{text-align:center;color:#888;padding:30px}footer b{color:#009688}@media(max-width:1050px){.topbar{padding:0 20px}.topbar nav{display:none}.page{padding:24px 12px}.step-tabs{margin:0 0 18px;overflow-x:auto;display:flex}.step-tabs button{min-width:150px}.two-col,.result-grid{grid-template-columns:1fr}.field{grid-template-columns:1fr;gap:8px}.field-label{text-align:left}.card,.result-page{padding:30px 20px}h1{font-size:34px}.cost-row,.pie-wrap{grid-template-columns:1fr}}
