.cost-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.cost-heading h1{font-size:clamp(1.5rem,3vw,2rem);line-height:1.2;letter-spacing:-.04em;margin:0 0 8px}
.cost-heading .ev-lead,.cost-heading .ev-month{margin:0}
.cost-filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:20px}
.cost-filters label{display:grid;gap:6px;font-size:.8rem;font-weight:600;flex:1;min-width:180px;max-width:360px}
.cost-filters select{width:100%;min-height:44px;border:1px solid var(--border);border-radius:8px;padding:8px 12px;background:var(--surface);color:var(--text);font:inherit}
.ev-tabs button,.cost-heading button,.cost-filters button,.cost-empty button,.cost-empty a,.cost-table a,.cost-ranking a{min-height:44px}
.cost-heading button{min-width:44px}.cost-heading .lbl{min-width:140px}
.cost-cards{grid-template-columns:repeat(4,minmax(0,1fr))}
.cost-cards .ev-card{padding:20px;min-width:0}.cost-cards .ev-card b{margin:12px 0 8px;line-height:1.2;font-size:clamp(1.3rem,2.5vw,1.9rem);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.cost-cards small{display:block;color:var(--muted);font-size:.8rem;line-height:1.5}
.cost-empty{padding:24px;margin-bottom:18px}.cost-empty h2,.cost-panel h2{font-size:1rem;margin:0 0 12px}
.cost-empty p{color:var(--muted);line-height:1.6}.cost-empty a{display:inline-flex;align-items:center;text-decoration:none}
.cost-warning{padding:14px 16px;border:1px solid var(--warning);border-radius:10px;color:var(--text);font-size:.85rem;line-height:1.5;margin:16px 0}
.cost-panels{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}
.cost-panel{padding:22px;min-width:0}.cost-panel dl{margin:0}.cost-panel dl>div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--border);font-size:.85rem}
.cost-panel dd{margin:0;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.cost-ranking{list-style:none;padding:0;margin:0}.cost-ranking li{margin:0 0 14px}.cost-ranking li>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.85rem}
.cost-ranking a{display:inline-flex;align-items:center;color:var(--text);overflow-wrap:anywhere}.cost-ranking strong{white-space:nowrap;font-variant-numeric:tabular-nums}
.cost-bar{height:7px;border-radius:4px;background:var(--bg);overflow:hidden}.cost-bar span{height:100%;display:block;background:var(--primary);border-radius:4px}
.cost-table{max-width:100%}.cost-table table{font-variant-numeric:tabular-nums}.cost-table caption{text-align:left;padding:16px;font-size:.85rem;font-weight:700;color:var(--text)}
.cost-table a{display:inline-flex;align-items:center;color:var(--primary);max-width:240px;overflow-wrap:anywhere;text-decoration:underline;text-underline-offset:3px}
.cost-table small{display:block;line-height:1.5;color:var(--muted);font-size:.75rem}.cost-table th{white-space:nowrap}.cost-table td:first-child{min-width:190px}
.cost-filters :focus-visible,.ev-tabs button:focus-visible,.cost-heading button:focus-visible,.cost-ranking a:focus-visible,.cost-table a:focus-visible{outline:3px solid var(--primary);outline-offset:3px}
@media(max-width:1000px){.cost-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.cost-panels{grid-template-columns:1fr}.cost-filters label{min-width:100%;max-width:none}.cost-filters button{flex:1}.cost-cards{gap:8px}.cost-cards .ev-card{padding:14px}.cost-panel{padding:16px}.cost-table{overflow:visible}.cost-table table,.cost-table tbody,.cost-table tr,.cost-table td{display:block}.cost-table thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%)}.cost-table tr{padding:14px;border-bottom:1px solid var(--border)}.cost-table td{border:0;padding:5px 0}.cost-table td.n{display:flex;justify-content:space-between;gap:14px;white-space:normal;text-align:right}.cost-table td.n:before{content:attr(data-label);text-align:left;color:var(--muted)}.cost-table td:first-child{min-width:0}.cost-table a{max-width:100%}}

.cost-entry{display:flex;justify-content:space-between;gap:1rem;padding:14px 0;border-bottom:1px solid var(--border);align-items:flex-start}.cost-entry div{min-width:0}.cost-entry small{display:block;margin-top:5px;color:var(--muted)}.cost-entry strong{overflow-wrap:anywhere}

/* Keep everyday reading comfortable and wide tables inside their own panel. */
html,body{font-size:16px}
.main,.content,#evContent{min-width:0}
.content{line-height:1.5}
.ev-tabs button,.cost-filters label,.cost-filters button,.cost-empty a,.cost-empty button,.ev-actions button,.ev-actions a,.cost-panel dl>div,.cost-ranking li>div:first-child,.cost-table td,.cost-heading .ev-lead{font-size:1rem}
.cost-cards .ev-card span{font-size:.875rem;text-transform:none;letter-spacing:0;line-height:1.5}
.cost-cards small,.cost-table small,.cost-entry small,.cost-warning,.note,.cost-table caption,.cost-table th{font-size:.875rem}
.ev-actions button,.ev-actions a{min-height:44px;display:inline-flex;align-items:center}
.cost-table{width:100%;min-width:0}
.cost-panel dt,.cost-entry strong{overflow-wrap:anywhere}
.cost-filters select{min-width:0}
@media(max-width:640px){.cost-heading>div{min-width:0}.cost-cards{grid-template-columns:1fr}.cost-entry{flex-wrap:wrap}}