.fonts-banner[data-v-40d6a091]{background-color:var(--layout-background-color-difference);position:sticky;top:0;z-index:2}.fonts-banner .font-banner-content[data-v-40d6a091]{align-items:center;display:flex;justify-content:space-between;padding:var(--padding-2xs) var(--layout-padding-side)}.fonts-banner .font-banner-content>div[data-v-40d6a091]>*+*{margin-left:var(--margin-s)}.fonts-banner .font-banner-content .left[data-v-40d6a091],.fonts-banner .font-banner-content .right[data-v-40d6a091]{align-items:center;display:flex}.fonts-banner .font-banner-content .right[data-v-40d6a091]{justify-content:space-between}.fonts-banner .font-banner-content .preview-input[data-v-40d6a091],.fonts-banner .font-banner-content .search-input[data-v-40d6a091]{width:146px}@media screen and (max-width:640px){.fonts-banner .font-banner-content .font-list-layout-form[data-v-40d6a091]{display:none}}@media screen and (max-width:860px){.fonts-banner .font-banner-content[data-v-40d6a091]{gap:var(--margin-s)}.fonts-banner .font-banner-content .search-input[data-v-40d6a091]{width:100px}.fonts-banner .font-banner-content .preview-input[data-v-40d6a091]{width:122px}.fonts-banner .font-banner-content [data-v-40d6a091] select{min-width:unset;width:110px}}@media screen and (max-width:640px){.fonts-banner .font-banner-content[data-v-40d6a091]{gap:6px}.fonts-banner .font-banner-content .search-input[data-v-40d6a091]{display:none}.fonts-banner .font-banner-content .right[data-v-40d6a091]{justify-content:flex-start}.fonts-banner .font-banner-content .preview-input[data-v-40d6a091],.fonts-banner .font-banner-content .right[data-v-40d6a091]{flex:1}.fonts-banner .font-banner-content .preview-input[data-v-40d6a091] input{width:100%}.fonts-banner .font-banner-content .preview-input[data-v-40d6a091]{width:0}.fonts-banner .font-banner-content .sort-select[data-v-40d6a091]{margin-left:6px}}.font-list-item[data-v-94ca9d02]{border:1px solid var(--border-color-dimmed);overflow:hidden}.font-list-item.font-list-item--layout-grid[data-v-94ca9d02]{--cell-size:calc(33.33333vw - var(--layout-padding-side)*2/3 - var(--margin-s)*2)}@media screen and (max-width:768px){.font-list-item.font-list-item--layout-grid[data-v-94ca9d02]{--cell-size:calc(50vw - var(--layout-padding-side)*2/2 - var(--margin-xs))}}@media screen and (max-width:640px){.font-list-item.font-list-item--layout-grid[data-v-94ca9d02]{--cell-size:calc(100vw - var(--layout-padding-side)*2)}}.font-list-item.font-list-item--layout-list[data-v-94ca9d02]{--cell-size:calc(100vw - var(--layout-padding-side)*2)}.font-link[data-v-94ca9d02]{align-items:center;container-type:inline-size;display:flex;padding:var(--padding-l);position:relative}@media screen and (max-width:640px){.font-link[data-v-94ca9d02]{justify-content:center!important}}.typeface-hover-name[data-v-94ca9d02]{left:var(--margin-xs);opacity:0;position:absolute;top:var(--margin-xs);transition:opacity .2s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none}.font-list-item:hover .typeface-hover-name--visible[data-v-94ca9d02],.typeface-hover-name--visible[data-v-94ca9d02]{opacity:1}@media screen and (max-width:640px){.typeface-hover-name--visible[data-v-94ca9d02]{opacity:1}}.typeface-name[data-v-94ca9d02]{font-size:clamp(3rem,calc(var(--cell-size)/var(--v31dc29f8)),var(--text-xl));line-height:calc(var(--text-xl) - .6rem);position:relative;white-space:nowrap}.typeface-name.typeface-name--lale[data-v-94ca9d02]{font-size:var(--text-xl);line-height:100%;transform:translateY(80%)}.typeface-params[data-v-94ca9d02]{bottom:var(--margin-xs);left:var(--margin-xs);position:absolute}.typeface-params p[data-v-94ca9d02]{border:1px solid var(--border-color-dimmed);display:inline-block;margin:0;padding-inline:var(--padding-2xs)}.typeface-params p+p[data-v-94ca9d02]{border-left:none}.font-list[data-v-1a7903ba]{margin-bottom:var(--margin-l);margin-top:var(--margin-s);padding:0 var(--layout-padding-side)}ul[data-v-1a7903ba]{display:grid;gap:var(--margin-s);list-style-type:none;margin-top:var(--margin-xs);padding:0}@media screen and (max-width:768px){ul[data-v-1a7903ba]{gap:var(--margin-xs)}ul[data-v-1a7903ba][data-v-1a7903ba]:not(.as-list){grid-template-columns:repeat(2,1fr)!important}}@media screen and (max-width:640px){ul[data-v-1a7903ba][data-v-1a7903ba]:not(.as-list){grid-template-columns:1fr!important}}