:root{font:15px 'Segoe UI',Arial,sans-serif;color:#163b42;background:#f1f5f5;line-height:1.5}*{box-sizing:border-box}body{margin:0}header{background:#123b42;color:white;padding:20px 5%;display:flex;align-items:center;justify-content:space-between;gap:16px}h1{font-size:25px;margin:0}h2{font-size:20px;margin-top:0}h3{font-size:16px}header p{margin:2px 0;color:#c8e3dd}main{max-width:1400px;margin:24px auto;padding:0 24px}.card{background:white;border:1px solid #dbe5e5;border-radius:12px;padding:22px;margin-bottom:20px}.auth{max-width:760px;margin:55px auto}.grid{display:grid;grid-template-columns:360px 1fr;gap:22px}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}label{display:block;font-size:13px;margin:10px 0 5px}input,select,button,textarea{font:inherit;border:1px solid #bacdce;border-radius:6px;padding:10px;color:inherit}input,select,textarea{width:100%;background:white}input[type=checkbox]{width:auto}button,a.button{cursor:pointer;background:white;text-decoration:none;padding:10px 14px;border:1px solid #bacdce;border-radius:6px;display:inline-block;color:#163b42}button.primary,a.primary{background:#087c68;color:white;border-color:#087c68}button:disabled{opacity:.5;cursor:wait}button:hover,a.button:hover{filter:brightness(.95)}small,.muted{color:#657e84}a{color:#087c68}#message{padding:14px;border-radius:8px;background:#e3efeb;white-space:pre-wrap;margin-bottom:20px}#message.error{background:#ffeae7;color:#a03220}.hidden,[hidden]{display:none!important}table{border-collapse:collapse;width:100%;font-size:13px}th,td{text-align:left;padding:10px;border-bottom:1px solid #e3eaea}th{background:#f1f6f5}td input{padding:6px;min-width:70px}.scroll{overflow:auto;max-height:400px}#history button{width:100%;text-align:left;margin-top:8px;white-space:normal}.badge{background:#e7f3ec;color:#176e48;padding:4px 10px;border-radius:20px;font-size:12px}.errorlist{color:#a03220;white-space:pre-wrap}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric{background:#f1f7f5;border-radius:8px;padding:14px}.metric strong{display:block;font-size:24px}.track{height:12px;background:#edf0f2;margin:8px 0}.bar{height:100%;background:#087c68}.bar.previous{background:#9faebf}canvas{max-width:100%;background:white}#previewWrap{overflow:auto;max-height:600px;background:#e5ebed;padding:16px;text-align:center}.fileline{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e3eaea;gap:12px;overflow-wrap:anywhere}.help{font-size:12px;color:#607a80;margin-top:6px}progress{width:100%;height:18px;accent-color:#087c68}@media(max-width:900px){.grid,.two{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}main{padding:0 14px}header{align-items:flex-start}h1{font-size:21px}}

#preview{max-width:none;display:block;margin:auto}#zoom{width:130px;margin-left:auto}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.grid>div{min-width:0}#qrSummary{color:#087c68}#duration{color:#657e84;font-size:13px}@media(max-width:650px){.metrics{grid-template-columns:1fr 1fr}}

.consumptionItem{padding:12px 0;border-bottom:1px solid #e3eaea}.consumptionItem strong{display:block;font-size:24px}.consumptionItem small{display:block}.consumptionChange{font-size:13px;font-weight:600;margin-top:4px}.increase{color:#087c42}.decrease{color:#bd2929}.equal{color:#657e84}

.usageChart{margin-top:18px;overflow:auto}.usageChart svg{display:block;width:100%;min-width:540px;background:white}.metric small{display:block}.toolbar select{width:auto}.toolbar input[type=number]{width:120px}

dialog{width:min(680px,95vw);max-height:90vh;overflow:auto;border:1px solid #bacdce;border-radius:12px;padding:24px;color:#163b42}dialog::backdrop{background:#123b4266}#resumeInspect{margin-top:12px}

.brand-logo{position:relative;width:min(300px,70vw);aspect-ratio:4.4 / 1;overflow:hidden;background:#000;border-radius:6px;margin:0 0 8px}.brand-logo img{position:absolute;width:128%;max-width:none;height:auto;left:-14%;top:-94%;display:block}

header.brand-header{background:#000}