@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

body { font-family: "Montserrat"; }
textarea { font-family: monospace; font-size: 0.6rem; }
.Icon { font-size: 0.6rem; font-weight: 700; }

body {
  background-color: #ffffff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 4 4' width='4' height='4'%3E%3Cpath fill='%23ededed' fill-opacity='1' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'/%3E%3C/svg%3E");
}

#Icons[data-viewmode*="grid"]         { padding: 10px; gap: 10px; display: grid; grid-template-columns: repeat( auto-fit, minmax(var(--minmax), 1fr) ); }
#Icons[data-viewmode*="grid"] article { flex-direction: column; gap: 5px; }
#Icons[data-viewmode*="grid"]         { --minmax: 64px; }

.Icon { text-align: center; display: flex; flex-direction: column; gap: 5px; }