/* Shared compact headers. Social contacts live in the About section. */
.header-brand{display:flex;align-items:center;min-width:0;flex-shrink:0}
.topbar .header-brand{grid-area:brand;justify-self:start}
.header-brand .wordmark{margin:0;flex-basis:auto;min-height:44px;display:flex;align-items:center}
.population-header .header-brand,.building-header .header-brand{margin-right:auto}
.population-header,.building-header{gap:22px}
.building-header .themes{margin-left:0}
.population-header .themes button{min-height:44px;height:44px}
.topbar{padding-block:18px 8px}
.scene{margin-top:0;padding-top:16px}
.works{padding-top:28px}
@media(max-width:900px){
 .topbar{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand appearance" "sections sections";gap:0 16px}
 .topbar nav{justify-self:start;min-width:0;width:auto}
}
@media(max-width:760px){
 .topbar{padding:12px 20px 0;gap:0 12px}
 .topbar .controls{align-self:center}
 .scene{padding:4px 20px 0}
 .works,.works[data-filter="education"]{padding-top:16px}
 .population-header,.building-header{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand appearance" "back back";gap:0 12px;align-items:center}
 .population-header .header-brand,.building-header .header-brand{grid-area:brand;margin:0}
 .population-header .themes,.building-header .themes{grid-area:appearance;justify-self:end;margin:0}
 .population-header .back-link,.building-header .back-link{grid-area:back;justify-self:start;order:initial;width:auto;min-height:44px;display:flex;align-items:center;margin:0;font-size:12px}
}
@media(max-width:350px){.topbar{padding-inline:14px}.scene{padding-inline:14px}}
/* Main navigation reads as navigation, not another filter capsule. */
.topbar .screen-tabs{display:flex;gap:22px;border:0;border-radius:0;background:transparent;padding:0;width:auto}
.topbar .screen-tabs button{position:relative;min-height:44px;padding:8px 0;border-radius:0;background:transparent;color:var(--muted);font-size:14px}
.topbar .screen-tabs button[aria-selected="true"]{background:transparent;color:var(--ink);font-weight:650}
.topbar .screen-tabs button[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;border-radius:2px;background:currentColor}
.project-tools{display:grid;grid-template-columns:minmax(220px,320px) auto;align-items:center;justify-content:space-between;gap:16px;margin:0 28px}
.project-tools .project-filters{flex-wrap:nowrap;gap:6px;min-width:0;margin:0}
.project-filters button{background:transparent;border-color:transparent;padding:8px 12px;color:var(--muted)}
.project-filters button[aria-pressed="true"]{background:#a7c8ff15;border-color:transparent;color:var(--ink)}
[data-theme="water"] .project-filters button[aria-pressed="true"]{background:#245e6b14}
.project-search{width:100%;min-width:0;max-width:none}
@media(max-width:760px){
 .topbar .screen-tabs{gap:20px}.topbar .screen-tabs button{font-size:13px;padding-inline:0}
 .project-tools{grid-template-columns:minmax(0,1fr);gap:6px;margin:6px 0 0}
 .project-tools .project-filters{gap:3px}
 .project-filters button{font-size:12px;padding-inline:6px;min-width:40px}
}
@media(max-width:350px){.topbar .screen-tabs{gap:14px}.topbar .screen-tabs button{font-size:12px}}

/* One visible edge per shell surface: no stacked inset highlights or outlines. */
:root :is(.work,.project-search,.themes,.glass,.source-switch,.model-stage,.building-picker,.help-popover,.chart-tooltip,dialog,.socials a,.contact-links a){
 border:1px solid var(--line);
 box-shadow:none;
}
html:root :is(.work,.glass,.model-stage,.building-picker,dialog,.help-popover){box-shadow:var(--surface-shadow)}
:root .themes button[aria-pressed="true"],
:root .population-page .source-switch button[aria-pressed="true"]{box-shadow:none}
:root .population-page :is(select,input[type="number"]),
:root #building-select{border:1px solid var(--line);box-shadow:none}
:root .work>.concept-panel{border:0;outline:0;box-shadow:none}
/* Focus is a temporary accessibility state, never a second decorative border. */
:root :is(a,button,input,select,summary,[tabindex]):focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
:root .project-search:focus-within{outline:2px solid var(--focus-ring);outline-offset:3px}
:root .project-search input:focus-visible{outline:none}

/* Sources are a light inline choice, without an enclosing surface. */
:root .population-page .source-switch{border:0;background:transparent;box-shadow:none;backdrop-filter:none;padding:0}