.brand-area{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:3px}
.brand-area .brand{min-height:26px}
.summary-modes{display:flex;gap:3px;white-space:nowrap}
.summary-modes button{font:inherit;font-size:10px;padding:3px 6px;border:1px solid var(--border);border-radius:4px;color:var(--muted);background:transparent;cursor:pointer}
.summary-modes button[aria-pressed="true"]{color:var(--text);border-color:var(--accent);background:var(--surface)}
.summary-modes button:focus-visible,.economy-metric:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.topbar>.summary,.topbar>.economy-summary{grid-column:3;grid-row:1;min-width:0}
.topbar>.header-end{grid-column:4;grid-row:1}
#map-summary[hidden],#economy-summary[hidden]{display:none}
.economy-summary{display:flex;height:100%;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--muted) transparent;align-items:center;overscroll-behavior-x:contain}
.economy-metric{flex:1 0 155px;min-width:0;display:grid;gap:0;text-align:left;padding:2px 12px;border:0;border-left:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer;font:inherit}
.economy-metric>span{color:var(--muted);font-size:10px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.economy-metric>strong{font-size:20px;line-height:1.1;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--economy-color)}
.economy-metric>small{font-size:9px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.economy-metric>small:last-child{color:var(--muted)}
.economy-metric:disabled{opacity:.45;cursor:default}
#economy-details{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 48px);overflow:auto}
.economy-value{font-size:32px;font-weight:700;margin:12px 0}
.economy-info{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:13px}
.economy-info dt{color:var(--muted)}
.economy-info dd{margin:0;text-align:right}
.economy-credit{font-size:11px;color:var(--muted);line-height:1.5}
#economy-content>p{line-height:1.6}
@media(max-width:1100px){
 .topbar>.summary,.topbar>.economy-summary{grid-column:1/-1;grid-row:2}
 .topbar>.header-end{grid-column:3;grid-row:1}
 .brand-area{grid-column:1;grid-row:1}
 .economy-metric>strong{font-size:18px}
 .economy-metric{flex-basis:155px}
}
@media(max-width:640px){
 .topbar>.header-end{grid-column:2;grid-row:1}
 .brand-area .brand h1{font-size:17px}
 .brand-area .brand svg{width:24px;height:24px}
 .summary-modes button{font-size:9px;padding:3px 5px}
 .economy-metric{flex-basis:155px;padding-left:10px}
}
