@import url("https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css");
@import url("https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/duotone/style.css");
@import url("https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/fill/style.css");

@layer base {
    .ph, .ph-duotone, .ph-fill, .ph-light, .ph-regular, .ph-thin {
        /* font-size: 32px;*/
        letter-spacing: 0 !important;
    }
}

@layer utilities {
    body {
        .ph-size-16  { font-size: 1rem; }        /* 16px */
        .ph-size-18  { font-size: 1.125rem; }    /* 18px */
        .ph-size-20  { font-size: 1.25rem; }     /* 20px */
        .ph-size-22  { font-size: 1.375rem; }    /* 22px */
        .ph-size-26  { font-size: 1.625rem; }    /* 26px */
        .ph-size-32  { font-size: 2rem; }        /* 32px */
        .ph-size-36  { font-size: 2.25rem; }     /* 36px */
        .ph-size-48  { font-size: 3rem; }        /* 48px */
        .ph-size-64  { font-size: 4rem; }        /* 64px */
        .ph-size-96  { font-size: 6rem; }        /* 96px */
        .ph-size-128 { font-size: 8rem; }        /* 128px */
        .ph-size-256 { font-size: 16rem; }       /* 256px */
        .ph-size-512 { font-size: 32rem; }       /* 512px */
    }
}