@import"https://api.fonts.coollabs.io/css2?family=SN+Pro:wght@400;500;600;700";html:has(.theme-light){--bg: #F1F1F1;--bg-alt: #D9D9D9;--bg-hover-alt: #CFCFCF;--bg-active: #DADADA;--bg-active-alt: #C3C3C3;--fg: #282828;--fg-alt: #888888;--border: #BFBFBF;--border-alt: #CCCCCC}@font-face{font-family:fontstash icons;src:url(/assets/fontstash-icons-D1sCUvOt.otf)}.icon{font-family:fontstash icons;font-size:14px;transform:translateZ(0)}.icon-layout-row:before{content:""}.icon-layout-grid:before{content:""}.icon-align-left:before{content:""}.icon-align-middle:before{content:""}.icon-align-right:before{content:""}.icon-chevron-down:before{content:""}.icon-chevron-up:before{content:""}.icon-plus:before{content:""}.icon-x:before{content:""}.icon-sort:before{content:""}.icon-font-features:before{content:""}.icon-external:before{content:""}.icon-funnel:before{content:""}.icon-backspace:before{content:""}.icon-rename:before{content:""}.icon-clear:before{content:""}.icon-check:before{content:""}.icon-chevron-right:before{content:""}.icon-delete:before{content:""}.icon-dots-vertical:before{content:""}.icon-loader:before{content:""}.icon-provider:before{content:""}.icon-folder:before{content:""}.icon-arrow-down:before{content:""}.icon-arrow-up:before{content:""}.icon-arrow-left:before{content:""}.btn{display:flex;align-items:center;justify-content:center;padding:7px;transition:color .07s ease,background .07s ease}.btn.btn-plain{padding:0;cursor:pointer;color:var(--fg-alt, #696969)}.btn.btn-plain:hover,.btn.btn-plain:active{background:none;color:inherit}.btn:hover{background-color:var(--bg-hover-alt, #242424)}.btn:active{background:var(--bg-active-alt, #2C2C2C)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{animation:spin .35s linear infinite}.popup{box-shadow:0 0 14px #00000012;border:1px solid var(--border, #2B2B2B);background:var(--bg-alt, #1E1E1E)}.dropdown{position:relative;display:flex;flex-direction:row;gap:0}.dropdown.filterable:has(.selected)>.btn:first-child{background:var(--bg-active-alt, #2C2C2C)}.dropdown>*:not(.dropdown-content){height:100%}.dropdown>.btn:first-child{flex:1}.dropdown .dropdown-content{overflow-x:hidden;z-index:1;position:absolute;background:var(--bg-alt, #1E1E1E);overflow-y:auto;top:100%;left:-1px;max-width:200px;max-height:50vh;border:1px solid var(--border, #2B2B2B);pointer-events:none;opacity:0;transition:opacity .07s ease}.dropdown .dropdown-content.visible{pointer-events:auto;opacity:1}.dropdown .dropdown-content.side-right{left:unset;right:-1px}.dropdown .dropdown-content.side-stretch{min-width:calc(100% + 2px)}.dropdown .dropdown-content .dropdown-option{white-space:nowrap;text-overflow:ellipsis;-webkit-user-select:none;user-select:none;cursor:default;position:relative;padding:3.5px 10.5px;display:flex;flex-direction:row;gap:10.5px}.dropdown .dropdown-content .dropdown-option:not(:last-child){border-bottom:1px solid var(--border-alt, #272727)}.dropdown .dropdown-content .dropdown-option:hover{background:var(--bg-hover-alt, #242424)}.dropdown .dropdown-content .dropdown-option.selected{background-color:var(--bg-active-alt, #2C2C2C)}.dropdown .dropdown-content .dropdown-option>.option-label{flex:1;overflow-x:hidden}.dropdown .dropdown-content:has(.dropdown-option>.icon:first-child+.option-label) .dropdown-option:not(.selected)>*:first-child{margin-left:24.5px}.user-input-btn{display:flex;flex-direction:row;gap:0;align-items:center;cursor:pointer!important}.user-input-btn:hover .icon{color:inherit}.user-input-btn .icon{transition:color .07s ease,background .07s ease;color:var(--fg-alt, #696969)}.user-input-btn:has(input.visible) .icon{display:none}.user-input-btn input{cursor:revert;min-width:0;width:0;padding:0!important;flex:1}.user-input-btn input:not(.visible){flex:0;opacity:0;pointer-events:none}#context-menu{position:fixed;cursor:default;-webkit-user-select:none;user-select:none;z-index:999;transform-origin:top left;margin-left:1px}#context-menu .context-menu-content{display:flex;flex-direction:column;gap:0}#context-menu .context-menu-content:has(>.context-option.selected) .context-option{padding-left:35px}#context-menu .context-menu-content:has(>.context-option.selected)>.context-option.selected{position:relative}#context-menu .context-menu-content:has(>.context-option.selected)>.context-option.selected:before{content:"";position:absolute;left:10.5px;font-family:fontstash icons;font-size:14px}#context-menu .context-menu-content .context-option:not(.hor-separator){display:flex;flex-direction:row;gap:0;padding:3.5px 10.5px;align-items:center}#context-menu .context-menu-content .context-option:not(.hor-separator):hover{background:var(--bg-hover-alt, #242424)}#context-menu .context-menu-content .context-option:not(.hor-separator).selected{background-color:var(--bg-active-alt, #2C2C2C)}#context-menu .context-menu-content .context-option:not(.hor-separator):not(:last-child){border-bottom:1px solid var(--border-alt, #272727)}#context-menu .context-menu-content .context-option:not(.hor-separator) .context-option-name{text-wrap:nowrap;white-space:pre;overflow:hidden}#context-menu .context-menu-content .context-option:not(.hor-separator) .icon{font-size:14px}#context-menu .context-menu-content .context-option:not(.hor-separator) .icon:first-of-type{margin-right:10.5px}#context-menu .context-menu-content .context-option:not(.hor-separator) .context-option-name+.icon{padding-left:14px;margin-left:auto}#context-menu .context-menu-content .context-option:not(.hor-separator):has(>.context-menu-content){position:relative}#context-menu .context-menu-content .context-option:not(.hor-separator):has(>.context-menu-content):not(:hover)>.context-menu-content{display:none}#context-menu .context-menu-content .context-option:not(.hor-separator):has(>.context-menu-content) .context-menu-content{background:var(--bg-alt, #1E1E1E);position:absolute;left:100%;top:-1px;max-height:300px;max-width:200px;overflow-x:hidden;overflow-y:auto}#context-menu .context-menu-content .hor-separator{width:100%}::-webkit-scrollbar{width:14px}::-webkit-scrollbar-track{border-left:1px solid var(--border, #2B2B2B)}.popup ::-webkit-scrollbar{width:7px}.popup ::-webkit-scrollbar-track{border-color:var(--border-alt, #272727)}::-webkit-scrollbar-thumb{background:var(--border, #2B2B2B);min-height:20px}@supports (-moz-appearance: none){*{scrollbar-width:thin;scrollbar-color:var(--border, #2B2B2B) transparent}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;outline:0}input,button,a{all:unset;box-sizing:border-box}a{cursor:pointer}ul,ol{list-style:none}body{font-family:SN Pro,sans-serif;font-size:14px;background-color:var(--bg, #131313);color:var(--fg, #D3D3D3)}body:has(#sidebar.resizing){cursor:ew-resize!important}body:has(#sidebar.resizing)>*{pointer-events:none;-webkit-user-select:none;user-select:none}#app{display:flex;flex-direction:row;gap:0;height:100vh;position:relative;flex:1;overflow:hidden}#controls{display:flex;flex-direction:row;gap:0;justify-content:center;position:absolute;top:14px;z-index:99;left:0;right:0;margin-inline:auto;width:fit-content;--preview-size-slider-bg: var(--bg-alt, #1E1E1E)}@media(max-width:700px){#controls{width:100%;border-inline:none}}#controls>*{flex-shrink:0;justify-content:center;align-items:center}#controls>*:not(:last-child){border-right:1px solid var(--border-alt, #272727)}#controls>*:has(>input){width:14ch}#controls>*:has(>input)#preview-texts{width:28ch}@media(max-width:700px){#controls>*:has(>input){flex-shrink:1}}#controls>* input{min-width:0;width:0;flex:1;padding-inline:7px}#controls>* input[type=text]{padding-right:0}#controls .font-search-group{display:flex;flex-direction:row;gap:0;align-items:stretch}#controls .font-search-group .icon{transition:opacity .15s ease}#controls .font-search-group:has(.text-input:placeholder-shown) .icon{display:none}.preview-size-slider{display:flex;align-items:center}.preview-size-slider input::-webkit-slider-runnable-track{background:var(--fg-alt, #696969);height:2px}.preview-size-slider input::-moz-range-track{background:var(--fg-alt, #696969);height:2px}.preview-size-slider input::-webkit-slider-thumb{box-sizing:border-box;will-change:transform;-webkit-appearance:none;height:14px;width:14px;margin-top:-6px;background:var(--preview-size-slider-bg);border-radius:0;border:2px solid var(--fg, #D3D3D3);transition:color .07s ease,background .07s ease}.preview-size-slider input::-moz-range-thumb{box-sizing:border-box;will-change:transform;-webkit-appearance:none;height:14px;width:14px;margin-top:-6px;background:var(--preview-size-slider-bg);border-radius:0;border:2px solid var(--fg, #D3D3D3);transition:color .07s ease,background .07s ease}#sidebar{width:var(--sidebar-width);--min-width: 200px;margin-inline:14px;position:absolute;z-index:9;top:60px;display:flex;flex-direction:column;gap:0;max-height:calc(100% - 120px);transition:margin .15s ease}@media(max-width:700px){#sidebar{margin:0;width:50%;max-height:calc(100% - 74px);border-left:none}}#sidebar #sidebar-container{display:flex;flex-direction:column;gap:0;transition:opacity .15s ease;overflow-y:auto}.sidebar-hidden #sidebar{background:none;box-shadow:none;height:100%;margin:0;border:0;width:28px}.sidebar-hidden #sidebar #sidebar-container{opacity:0;transition:none}.sidebar-hidden #sidebar #sidebar-res-handle{left:0;width:100%}.sidebar-hidden #sidebar #sidebar-res-handle .icon{display:flex;align-items:center;justify-content:center;width:100%}@media(max-width:700px){.sidebar-hidden #sidebar #sidebar-res-handle .icon{outline:1px solid var(--border, #2B2B2B);border:0;margin-top:1px}.sidebar-hidden #sidebar #sidebar-res-handle .icon:before{transform:none}}#sidebar #sidebar-res-handle{position:absolute;height:100%;left:100%;top:0;width:14px;background:transparent;cursor:ew-resize;display:flex;align-items:center}@media(max-width:700px){#sidebar #sidebar-res-handle{align-items:start}}#sidebar #sidebar-res-handle:hover .icon{opacity:1}#sidebar #sidebar-res-handle .icon{opacity:0;cursor:pointer;transition:opacity .15s ease;display:none;height:min(126px,100% + 2px);padding-inline:6px}@media(max-width:700px){#sidebar #sidebar-res-handle .icon{border:1px solid var(--border, #2B2B2B);display:flex;align-items:center;justify-content:center;background:var(--bg-alt, #1E1E1E);opacity:1;margin-top:-1px}#sidebar #sidebar-res-handle .icon:before{transform:scaleX(-1)}}#sidebar .collections-container{display:flex;flex-direction:column;gap:0;overflow-y:auto}#sidebar .collections-container>.sidebar-item{background:var(--bg-alt, #1E1E1E);position:sticky;top:0;pointer-events:none}#sidebar .collections-container .collections-list{display:flex;flex-direction:column;gap:0}#sidebar .collections-container .collections-list .sidebar-item{padding-left:35px}#sidebar .sidebar-item{display:flex;flex-direction:row;gap:10.5px;cursor:default;padding:7px 10.5px;align-items:center;transition:box-shadow .07s ease}#sidebar .sidebar-item:not(:last-child){border-bottom:1px solid var(--border-alt, #272727)}#sidebar .sidebar-item:hover{background:var(--bg-hover-alt, #242424)}#sidebar .sidebar-item.selected{background:var(--bg-active-alt, #2C2C2C)}#sidebar .sidebar-item.focused{box-shadow:inset 0 0 0 2px var(--border, #2B2B2B)}#sidebar .sidebar-item>input{cursor:revert;min-width:0;flex:1}#sidebar .sidebar-item .sidebar-item-name{text-wrap:nowrap;overflow:hidden;white-space:pre;margin-right:auto}#sidebar .sidebar-item .sidebar-item-size{color:var(--fg-alt, #696969);font-size:10px;-webkit-user-select:none;user-select:none}.fonts-window{flex:1;position:relative;display:flex;flex-direction:row;gap:0;overflow:hidden;--sidebar-total-width: calc(var(--sidebar-width) + 14px * 2)}@media(max-width:700px){.fonts-window{--sidebar-width: 0px}}.fonts-window .fonts-scroll{overflow-y:auto;flex:1}.fonts-window .fonts-scroll .fonts-scroll-track{overflow:hidden;position:relative;min-height:100%;padding-left:var(--sidebar-total-width);padding-top:60px;background-size:calc((100% - var(--sidebar-total-width)) / var(--columns)) calc(var(--card-height) * 1px);background-position:var(--sidebar-total-width) 60px;image-rendering:pixelated;background-image:linear-gradient(to right,var(--border, #2B2B2B) 1px,transparent 1px),linear-gradient(to bottom,var(--border, #2B2B2B) 1px,transparent 1px)}.fonts-window.layout-row .fonts-scroll-track{background-image:linear-gradient(to bottom,var(--border, #2B2B2B) 1px,transparent 1px);padding-left:0}.fonts-window.layout-row .fonts-scroll-track .font-card{padding-left:calc(var(--sidebar-total-width) + var(--card-padd));clip-path:inset(1px 0 0 0)}.fonts-window .fonts-scroll .fonts-scroll-track .fonts-list{display:flex;flex-direction:column;gap:0}.fonts-window.layout-grid .fonts-list{display:grid!important;grid-template-columns:repeat(var(--columns),1fr)}.fonts-window .font-card{display:flex;flex-direction:column;gap:0;cursor:default;overflow:hidden;flex-shrink:0;white-space:nowrap;height:calc(var(--card-height) * 1px);--card-padd: calc(pow(var(--card-height), .7)*.4*1px) ;padding:var(--card-padd);clip-path:inset(1px 0 0 1px);transition:box-shadow .07s ease}.fonts-window .font-card.selected{background:var(--bg-active, #1E1E1E)}.fonts-window .font-card.focused{box-shadow:inset 3px 3px 0 0 var(--border, #2B2B2B),inset 0 0 0 2px var(--border, #2B2B2B)}.fonts-window .font-card .font-card-info{display:flex;flex-direction:row;gap:var(--card-padd);-webkit-user-select:none;user-select:none}.fonts-window .font-card .font-card-info span:last-child{color:var(--fg-alt, #696969)}.fonts-window .font-card .font-card-text{flex:1;display:flex;align-items:center;opacity:0;overflow:hidden;-webkit-user-select:none;user-select:none;transition:opacity .5s ease-in;font-size:calc(pow(var(--card-height),1.4)*.045*1px);font-feature-settings:var(--font-features)}.fonts-window .font-card .font-card-text.loaded{opacity:1}.fonts-window.align-middle .font-card-text{justify-content:center}.fonts-window.align-right .font-card-text{justify-content:right}.fonts-window .family-container{position:absolute;display:flex;flex-direction:column;gap:0;inset:0;background:var(--bg, #131313);padding-top:60px}.fonts-window .family-container .family-header{display:flex;flex-direction:column;gap:7px;--preview-size-slider-bg: var(--bg, #131313)}.fonts-window .family-container .family-header .family-header-row{padding-left:var(--sidebar-total-width);display:flex;flex-direction:row;gap:0;align-items:center}.fonts-window .family-container .family-header .family-header-row:first-child{gap:3.5px}@media(max-width:700px){.fonts-window .family-container .family-header .family-header-row:first-child>*:first-child{margin-left:14px}}.fonts-window .family-container .family-header .family-header-row:first-child a{display:flex;align-items:center;justify-content:center;height:100%;aspect-ratio:1}.fonts-window .family-container .family-header .family-header-row:last-child{outline:1px solid var(--border, #2B2B2B)}.fonts-window .family-container .family-header .family-header-row:last-child>*{display:flex;align-items:center;justify-content:center;height:100%}.fonts-window .family-container .family-header .family-header-row:last-child>*:not(:last-child){border-right:1px solid var(--border, #2B2B2B)}.fonts-window .family-container .family-header .family-header-row:last-child>* input{padding-inline:7px}.fonts-window .family-container .family-header .family-header-row:last-child>* input[type=text]{padding-right:0}@media(max-width:700px){.fonts-window .family-container .family-header .family-header-row:last-child>*{flex:1}.fonts-window .family-container .family-header .family-header-row:last-child>* input{min-width:0;width:0;flex:1}}.fonts-window .family-container .family-fonts-list{display:flex;flex-direction:column;gap:0;overflow-y:auto;flex:1;background-attachment:local;padding-left:var(--sidebar-total-width);background-size:100% calc(var(--card-height) * 1px);background-position:var(--sidebar-total-width) 0;background-image:linear-gradient(to bottom,var(--border, #2B2B2B) 1px,transparent 1px)}
