@layer default{body,html{height:100%}body{display:flex;flex-direction:column;background-color:var(--color-bg)}.source-nav{display:grid;flex-shrink:0;justify-content:center;align-items:center;height:var(--nav-height)}main{display:grid;--full: minmax(var(--margin), 1fr);--main: min(82ch, 100% - var(--margin) * 2);--popout: minmax(0, 2rem);--feature: minmax(0, 10rem);grid-template-columns:[full-start] var(--full) [feature-start] var(--feature) [popout-start] var(--popout) [main-start] var(--main) [main-end] var(--popout) [popout-end] var(--feature) [feature-end] var(--full) [full-end]}main:not([data-overflow]){flex:1;overflow-y:hidden}:where(main)>*{grid-column:main}}