.billing-flow{display:grid;gap:10px}.bill-stage{display:grid;grid-template-columns:44px 1fr;gap:3px 15px;padding:18px 20px;border:1px solid var(--line);border-radius:11px;background:#fff}.bill-stage b{grid-row:1/3;color:var(--teal-dark);font:800 1rem Montserrat}.bill-stage span{font:700 1rem Montserrat}.bill-stage small{color:var(--muted)}.invoice-card{background:#071f27;color:#fff;padding:25px;border-radius:16px;box-shadow:0 25px 60px rgba(7,31,39,.16)}.invoice-top,.variance{display:flex;justify-content:space-between;align-items:center;gap:15px}.invoice-top>span:first-child{font-size:.75rem;letter-spacing:.12em;color:#a9c0c1;font-weight:800}.reconcile{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.reconcile>div{padding:14px;background:#112f38;border-radius:9px}.reconcile small,.invoice-card>small{display:block;color:#a9c0c1}.reconcile strong{display:block;font:700 1.25rem Montserrat;margin-top:4px}.variance{border-top:1px solid #29434a;padding-top:14px}.variance b{color:var(--teal)}.interval-chart{height:92px;display:flex;align-items:flex-end;gap:6px;margin:23px 0 10px}.interval-chart i{flex:1;background:#3ccfbe;border-radius:3px 3px 0 0;opacity:.65}.interval-chart i.peak{background:var(--orange);opacity:1}.bill-drop{border:2px dashed #8ccfc5;border-radius:16px;padding:42px;text-align:center;background:var(--mint)}.analysis-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.cost-stack{display:flex;height:18px;border-radius:20px;overflow:hidden;margin:20px 0}.cost-stack i:nth-child(1){width:49%;background:#00cab1}.cost-stack i:nth-child(2){width:31%;background:#087f72}.cost-stack i:nth-child(3){width:13%;background:#81ded2}.cost-stack i:nth-child(4){width:7%;background:#c6f2ec}.legend{display:grid;grid-template-columns:1fr 1fr;gap:10px;font-size:.9rem}.legend span:before{content:"";display:inline-block;width:9px;height:9px;border-radius:2px;background:var(--teal);margin-right:7px}.timeline{height:170px;display:flex;align-items:end;gap:4px;border-bottom:1px solid #dce7e5;padding-top:20px}.timeline i{flex:1;background:#a5e8df;border-radius:2px 2px 0 0}.timeline i.peak{background:#ffb35c}.timeline-labels{display:flex;justify-content:space-between;font-size:.75rem;color:var(--muted);margin-top:8px}@media(max-width:850px){.analysis-grid{grid-template-columns:1fr}}

.invoice-example{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(290px,.65fr);gap:18px;align-items:stretch}.example-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.example-heading h3{font-size:1.7rem;margin-top:18px}.example-heading>small{color:var(--muted);white-space:nowrap}.invoice-table{border-top:1px solid var(--line)}.invoice-row{display:grid;grid-template-columns:1.35fr repeat(3,.8fr);gap:14px;align-items:center;padding:14px 10px;border-bottom:1px solid var(--line);font-size:.9rem}.invoice-row span:not(:first-child),.invoice-row>strong:not(:first-child){text-align:right}.invoice-table-head{color:var(--muted);font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.invoice-row.flagged{background:#fff6e9}.invoice-row.flagged span:last-child{color:#9a4d00;font-weight:800}.invoice-row.total{border-bottom:0;font-family:Montserrat;background:var(--cloud)}.invoice-row.total strong:last-child{color:#9a4d00}.variance-explanation{background:#071f27;color:#fff}.variance-explanation h3{font-size:1.7rem;margin:18px 0 24px}.variance-explanation dl{margin:0}.variance-explanation dl>div{display:flex;justify-content:space-between;gap:18px;padding:14px 0;border-top:1px solid #29434a}.variance-explanation dt{color:#b9cbcd}.variance-explanation dd{margin:0;text-align:right;font-weight:700}.variance-explanation .variance-result{display:block}.variance-explanation .variance-result dd{text-align:left;color:var(--teal);font:700 1.15rem Montserrat;margin-top:7px}.variance-explanation p{color:#b9cbcd;margin-top:24px}@media(max-width:850px){.invoice-example{grid-template-columns:1fr}}@media(max-width:640px){.example-heading{align-items:flex-start;flex-direction:column}.invoice-table{overflow-x:auto}.invoice-row{min-width:620px}}