html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin-block:0;border:none;margin:0;padding:0}html{-webkit-text-size-adjust:100%;line-height:1.15}main{display:block}progress{vertical-align:middle}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}b,strong{font-weight:700;display:inline-block}q,blockquote{font-style:italic}hr{box-sizing:content-box;height:0;display:block;overflow:visible}ol,ul{list-style:none}audio,canvas,iframe,svg,video,img{vertical-align:middle}img{border-style:none;max-width:100%}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:inherit;background:0 0;border:0;margin:0}button:focus,input:focus,select:focus,textarea:focus{outline:#0000}input{border-radius:0}input[type=search]{-webkit-appearance:none}input::-moz-focus-inner{border:0}textarea{white-space:revert;resize:none;overflow:auto}a,a:visited,a:active{color:inherit;text-decoration:none;display:inline-block}a[href],button{touch-action:manipulation}button,input{overflow:visible}button,select{text-transform:none}button{background:0 0;border:0;padding:0}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;color:inherit;cursor:pointer}button::-moz-focus-inner{border-style:none;padding:0}[type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]::-moz-focus-inner{border-style:none;padding:0}[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring{outline:1px dotted buttontext}[type=button]:-moz-focusring{outline:1px dotted buttontext}[type=reset]:-moz-focusring{outline:1px dotted buttontext}[type=submit]:-moz-focusring{outline:1px dotted buttontext}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button{height:auto}[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}*{box-sizing:border-box;-webkit-tap-highlight-color:#0000}:before,:after{box-sizing:inherit}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}*,:after,:before{box-sizing:border-box}:root{--color-text:#000;--color-bg:#efefef;--color-link:#000;--color-link-hover:#000;--page-padding:1.5rem;font-size:12px}body{color:var(--color-text);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:sans-serif}body .breakpoint-disclaimer{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}body .products,body .shop-categories{display:none}@media (width>=900px){body .breakpoint-disclaimer{display:none}body .products,body .shop-categories{display:block}}@media (scripting:enabled){.loading:before,.loading:after{content:"";z-index:10000;position:fixed}.loading:before{background:var(--color-bg);width:100%;height:100%;top:0;left:0}.loading:after{background:var(--color-link);width:100px;height:1px;margin:0 0 0 -50px;animation:1.5s ease-in-out infinite alternate forwards loaderAnim;top:50%;left:50%}}@keyframes loaderAnim{0%{transform-origin:0%;transform:scaleX(0)}50%{transform-origin:0%;transform:scaleX(1)}50.1%{transform-origin:100%;transform:scaleX(1)}to{transform-origin:100%;transform:scaleX(0)}}a{color:var(--color-link);opacity:.3;cursor:pointer;outline:none;text-decoration:none}a:hover{opacity:1;color:var(--color-link-hover);text-decoration:none}a:focus{background:#d3d3d3;outline:none}a:focus:not(:focus-visible){background:0 0}a:focus:focus-visible{background:0 0;outline:2px solid red}.frame{z-index:1000;grid-row-gap:1rem;grid-column-gap:2rem;pointer-events:none;grid-template-columns:auto auto;grid-template-areas:"title""back""archive""github""demos""tags""sponsor";justify-items:start;padding:1rem;font-size:12px;display:grid;position:relative}.frame #cdawrap{grid-area:sponsor}.frame a,.frame button{pointer-events:auto}.frame .frame__title{font-size:inherit;grid-area:title;margin:0}.frame .frame__back{grid-area:back;justify-self:start}.frame .frame__archive{grid-area:archive;justify-self:start}.frame .frame__github{grid-area:github}.frame .frame__tags{flex-wrap:wrap;grid-area:tags;gap:1rem;display:flex}.frame .frame__demos{flex-wrap:wrap;grid-area:demos;gap:1rem;display:flex}@media screen and (width>=53em){.frame{grid-template:"title back github archive tags sponsor"". . . . . ."/auto auto auto auto auto 1fr;place-content:center;width:100%;padding:1rem 5.5rem;position:fixed;bottom:0;left:0}.frame #cdawrap{text-align:right}}.content{z-index:1;flex-direction:column;width:100svw;height:100svh;font-family:Georgia,Times New Roman,Times,serif;display:flex;position:relative;top:0;left:0}@media screen and (width>=53em){.content{justify-content:center;align-items:center;min-height:100vh}}.top-nav{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);gap:1rem;width:100%;padding:1rem;display:flex;position:fixed;top:0;left:0}.top-nav a{color:var(--secondary-text-color);font-size:18px;font-weight:400}.top-nav .nav-logo{width:36%}.top-nav .nav-logo a{letter-spacing:-.04em;color:var(--text-color);font-size:clamp(3.5rem,6vw,5.5rem);font-weight:700}.top-nav .nav-content{flex:1;gap:.5rem;display:flex}.top-nav .nav-content .nav-links,.top-nav .nav-content .nav-socials{flex-direction:column;flex:1;gap:.5rem;display:flex}.top-nav .nav-content .nav-time{color:var(--secondary-text-color);flex:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (width<=768px){.top-nav{flex-direction:column;align-items:center;gap:1rem}.top-nav .nav-logo{text-align:center;order:-1;width:100%}.top-nav .nav-logo a{font-size:2rem}.top-nav .nav-content{gap:.5rem;width:100%}}.shop-categories{position:absolute;top:1.5rem;left:50%;transform:translate(-50%)}.shop-categories ul{flex-direction:row;justify-content:center;align-items:center;gap:24px;list-style:none;display:flex}.shop-categories ul li{opacity:.3;white-space:nowrap;font-size:20px}.shop-categories ul li sup{font-size:.6em}.shop-categories ul li.--active{opacity:1}.products{width:100svw;height:80svh;padding:var(--page-padding);justify-content:center;align-items:center;display:flex;position:relative;top:30px;overflow:hidden}.products__grid,.products__preview{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(4,1fr);gap:2vw;width:100%;height:100%;padding:48px;display:grid}.products__grid{position:relative}.products__preview{inset:var(--page-padding);height:calc(100% - var(--page-padding) * 2);width:calc(100% - var(--page-padding) * 2);pointer-events:none;z-index:2;position:absolute}.product{contain:size;cursor:pointer;width:100%;height:100%;display:block;position:relative}.product:hover .product__cta{opacity:1;justify-content:center;align-items:center;display:flex}.product:hover .product__cta img{opacity:1;color:#fff}.product:hover img{opacity:.6}.product__cta{opacity:0;z-index:5;color:var(--color-bg);text-align:center;pointer-events:none;background-color:#000c;padding:10px 0;text-decoration:none;transition:all .1s ease-out;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.product__cta img{opacity:0;width:20px;height:20px;margin-left:.5rem}.product img{border-radius:10px}.product__link{opacity:1;width:100%;height:100%;text-decoration:none;display:block}img{object-fit:contain;object-position:top;width:100%;height:100%;position:relative}.product-preview{opacity:0;grid-area:1/auto/span 2/span 2;width:100%;height:100%;position:relative}.product-preview__inside{background:var(--color-bg);width:100%;height:100%;position:absolute;inset:0}.product-preview__images{grid-template-rows:auto;grid-template-columns:auto;width:100%;height:100%;display:grid;overflow:hidden}.product-preview__images>img{opacity:0;grid-area:1/1}.product-preview__details{z-index:3;color:#000;text-transform:uppercase;justify-content:space-between;width:100%;font-size:12px;font-weight:600;display:flex;position:absolute;top:calc(100% + 8px);left:0}
