/* One viewport, deliberately scattered: a larger E constellation in the
   middle, with smaller I shapes around its perimeter. */
.common-index-links{margin-top:36px;border-top:1px solid var(--rule)}
.common-index-links .common-article-link:first-child{padding-top:22px}
@media(min-width:701px){
  body.home-route{height:100dvh;min-height:440px;display:grid;grid-template-rows:80px minmax(0,1fr) 48px}
  .home-route .site-header{height:80px}
  .home-route .type-index{top:68px}
  .home-route #main{min-height:0}
  .home-route .home-view{height:100%;max-width:1440px;padding:8px 6% 12px}
  .home-route .type-board{container-type:size;display:block;height:100%;max-width:1120px;margin:0 auto}
  .home-route .type-shape{--motion-scale:.5;--fit-size:calc(max(440px,min(100cqw,100cqh)) * var(--scatter-size) * 1.12 * var(--introvert-scale,1) * var(--layout-scale,1));position:absolute;left:calc(var(--scatter-x) - var(--fit-size) / 2);top:calc(var(--scatter-y) - var(--fit-size) / 2);width:var(--fit-size);height:var(--fit-size);transform:rotate(var(--rotation,0deg));margin:0}
  .home-route .type-shape[data-type^="I"]{--introvert-scale:1.18}
  .home-route .type-shape .type-name{font-size:max(14px,calc(var(--fit-size) * var(--fit-font)));transform:none}
  .home-route .type-shape .shape-caption{display:none}
  .home-route .type-shape:hover,.home-route .type-shape:focus-visible{transform:translateY(-4px) rotate(0deg)}
  .home-route .type-shape:active{transform:scale(.96)}
  .home-route .motion-toggle{top:-4px;right:2%;width:36px;height:36px}
  .home-route .common-section,.home-route .board-end{display:none}
  .home-route .site-footer{height:48px;padding:0;align-self:stretch}
  .home-route .footer-brand{font-size:18px}
}
@media(min-width:701px) and (max-height:600px){
  body.home-route{grid-template-rows:64px minmax(0,1fr) 40px}
  .home-route .site-header{height:64px}
  .home-route .site-footer{height:40px}
  .home-route .type-index{top:56px}
  .home-route .type-shape{--motion-scale:.35;--fit-size:max(44px,calc(min(100cqw,100cqh) * var(--scatter-size) * 1.12 * var(--introvert-scale,1) * var(--layout-scale,1)))}
  .home-route .wordmark{font-size:28px}
}
@media(max-width:700px){
  .common-nav-link{display:none}
  .type-board{container-type:inline-size}
  .type-shape{--mobile-fit-size:calc(min(170px,45cqw) * var(--mobile-ratio) * 1.12);width:var(--mobile-fit-size)}
  .type-shape .type-name{font-size:max(14px,calc(var(--mobile-fit-size) * var(--fit-font)))}
}
@media(prefers-reduced-motion:reduce) and (min-width:701px){
  .home-route .type-shape:hover,.home-route .type-shape:focus-visible{transform:rotate(var(--rotation,0deg))}
}