.custom-header-area{height:56px}.custom-header{position:fixed;top:0;width:100%;z-index:10}.custom-layout-grid{display:flex;justify-content:center}.custom-main-content{max-width:704px;width:100%;padding:0 1rem;margin-top:2.5rem}.custom-side-menu{background-color:#fff;position:fixed;z-index:10;height:calc(100dvh - 56px);padding:1.5rem .5rem 2.5rem;display:none;overflow-y:auto;max-width:300px;width:100%;overflow-wrap:anywhere}.custom-toc{display:none;margin-top:2.5rem;padding:0 1rem}@media screen and (min-width:1024px){.custom-layout-grid{justify-content:right;margin-right:calc((100vw - 704px - 300px)/2)}.custom-side-menu{position:fixed;z-index:10;display:block}}@media screen and (min-width:1280px){.custom-layout-grid{display:grid;justify-content:right;grid-template-rows:1fr;grid-template-columns:256px minmax(auto,704px)256px;margin-right:calc((100vw - (704px + 256px) - 300px)/2)}.custom-main-content{grid-column:2}.custom-toc{display:block;grid-column:3}.custom-toc-container{position:sticky;top:calc(56px + 2.5rem)}}@media screen and (min-width:1440px){.custom-layout-grid{margin-right:0;justify-content:center}}.custom-hero{display:flex;justify-content:center;align-items:center}@media screen and (min-width:992px){.custom-hero{background:linear-gradient(315deg,#DEE6FF,#F4EAFF);border:1px solid #949494;border-top:none;border-right:none;border-bottom-left-radius:12px}}#TableOfContents a{display:inline-block;margin:.25rem 0;padding:.25rem 0;&:hover { text-decoration:underline; }}#TableOfContents li ul a{display:inline-block;margin:.25rem 1rem;padding:.25rem 0}.custom-blog-header{border-bottom:1px solid #b3b3b3}.custom-blog-layout{margin:40px auto 0;display:grid;justify-content:center;grid-template-columns:3fr 1fr;grid-template-rows:1fr;gap:0;grid-template-areas:"main side"}.custom-blog-main{grid-area:main;padding:0 1rem}.custom-blog-side{grid-area:side;padding:0 1rem}.custom-illustrations-box{position:relative;padding:1rem;img { max-height: 150px; max-width: 100%; height: auto; object-fit: contain; } a { position: static; &:before { content: ""; cursor: inherit; display: block; position: absolute; top: 0; left: 0; z-index: 0; width: 100%; height: 100%; } } display: flex;flex-direction:column;gap:1rem}.custom-illustrations-area{margin:0 auto;max-height:500px}.custom-icons-header{margin-right:auto;margin-left:auto;padding-left:1rem;padding-right:1rem;width:100%;max-width:1440px;margin-top:2.5rem;border-bottom:1px dashed #949494;padding-bottom:1.5rem}.custom-icons-header-title{margin-top:1rem}.custom-icons-header-tag{display:flex;margin-top:.5rem}.custom-icons-grid{display:flex;flex-direction:column;padding:0 1rem;margin-right:auto;margin-left:auto;width:100%;max-width:1440px;gap:1.5rem}.custom-icons-canvas{font-size:48px;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-image:linear-gradient(#e6e6e6 1px,transparent 1px),linear-gradient(90deg,#e6e6e6 1px,transparent 1px);background-size:40px 40px;background-position:50%;padding:2.5rem}@media screen and (min-width:768px){.custom-icons-grid{display:grid;grid-template-columns:1fr 1fr minmax(auto,375px);grid-template-rows:auto auto auto;grid-template-areas:"style style content" "preview preview content" "example example example"}.custom-icons-canvas{font-size:64px}}@media screen and (min-width:992px){.custom-icons-grid{grid-template-columns:1fr 1fr minmax(auto,375px);grid-template-rows:1fr 1fr;grid-template-areas:"style preview content" "example example content"}}@media screen and (min-width:1280px){.custom-icons-grid{grid-template-columns:256px 1fr minmax(auto,375px);grid-template-rows:auto auto;grid-template-areas:"style preview content" ". example content"}.custom-icons-canvas{font-size:128px}}@media screen and (min-width:1440px){.custom-icons-grid{grid-template-rows:1fr 1fr}}.custom-icons-style{order:10;grid-area:style}.custom-icons-preview{grid-area:preview;border:1px solid #999;border-radius:12px;order:20}.custom-icons-content{grid-area:content;order:40}.custom-icons-example{grid-area:example;order:30}.custom-icons-example-header{margin-bottom:.5rem}.custom-icons-example-area{border:1px solid #999;padding:1.5rem;background-image:radial-gradient(circle,#e6e6e6 1px,transparent 1px);background-size:1rem 1rem;border-radius:12px;display:flex;flex-direction:column;gap:1rem;align-items:start}.visually-hidden{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}.custom-icons-other{border-top:1px solid #949494;padding-top:1.5rem}.custom-icons-other-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-auto-rows:auto auto;gap:24px;margin-top:2.5rem}.custom-icons-item-area{display:block;border-radius:12px}.custom-icons-item{display:flex;flex-direction:column;gap:12px;position:relative}.custom-icons-item-icon{background-color:#f2f2f2;border-radius:12px;font-size:32px;display:flex;justify-content:center;align-items:center;padding:1.5rem;height:100px}.custom-icons-item-text{display:flex;justify-content:center}.custom-icons-item-link{&:after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; border-radius:12px; }}