html, body { width: 100%; height: 100%; margin: 0; }
body { background: var(--homepage-paper); color: var(--homepage-ink); }
[hidden] { display: none !important; }
.homepage { position: relative; width: 100%; height: 100%; overflow: hidden; isolation: isolate; container-type: inline-size; }
.homepage section { margin: 0; }
.homepage-backdrop, .homepage-backdrop__map, .homepage-backdrop__paper { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.homepage-backdrop__map { object-fit: cover; }
.homepage-slot { position: absolute; }
.homepage-slot--quote { inset: 0; }
.homepage-slot--account { top: var(--homepage-account-top); right: var(--homepage-account-right); }
.homepage-slot--accountPanel { inset:var(--homepage-accountPanel-inset); pointer-events:var(--homepage-accountPanel-pointer-events); }
.homepage-slot--gpx { left: var(--homepage-gpx-left); top: var(--homepage-gpx-top); transform: translate(-50%, -50%); }
.homepage-slot--instructions { left: var(--homepage-instructions-left); top: var(--homepage-instructions-top); bottom: var(--homepage-instructions-bottom); max-width: var(--homepage-instructions-max-width); z-index: auto; }
.homepage-slot--footer { right: var(--homepage-footer-right); bottom: var(--homepage-footer-bottom); max-width: var(--homepage-footer-max-width); }
.homepage-slot--status { left: var(--homepage-status-left); top: var(--homepage-status-top); transform: translateX(-50%); max-width: var(--homepage-status-max-width); font: var(--homepage-status-font); margin: 0; text-align: center; }
.homepage-missing { display: grid; place-items: center; width: 100%; height: 100%; font: var(--homepage-status-font); }
