@layer components{.home-illustration{--grid-size:calc(100% / 16.6);--card-title-bar-height:18px;isolation:isolate;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.home-illustration__inner{aspect-ratio:1;width:80%;position:relative}.home-illustration__inner:before,.home-illustration__inner:after{content:"";border-image:radial-gradient(circle, transparent, var(--blue) 55%, var(--magenta) 75%, transparent) 1;opacity:.5;position:absolute}.home-illustration__inner:before{border-left:1px solid;border-right:1px solid;width:80%;height:100%;top:0;left:10%}.home-illustration__inner:after{border-top:1px solid;border-bottom:1px solid;width:100%;height:80%;top:10%;left:0}.home-illustration__background{background:var(--gradient);filter:blur(40px);opacity:.55;border-radius:10%;width:70%;height:70%;position:absolute;top:15%;left:15%}.home-illustration__grid{background:repeating-linear-gradient(0deg, transparent, transparent var(--grid-size), var(--magenta) var(--grid-size), var(--magenta) calc(var(--grid-size) + 1px)), repeating-linear-gradient(90deg, transparent, transparent var(--grid-size), var(--magenta) var(--grid-size), var(--magenta) calc(var(--grid-size) + 1px));opacity:.1;width:80%;height:80%;position:absolute;top:10%;left:10%}.home-illustration__cards{--offset-x:0px;--offset-y:1px;z-index:1;width:80%;height:80%;margin-top:10%;margin-left:10%;position:relative}.home-illustration__card{width:calc(var(--grid-size) * 11.61);height:calc(var(--grid-size) * 7.35);top:calc(var(--grid-size) + var(--grid-size) + (var(--grid-size) * var(--index)) + (var(--offset-y) * var(--index)));left:calc(var(--grid-size) * var(--index) + var(--offset-x) * var(--index));background-color:var(--grey-100);border:var(--layout-border);box-shadow:var(--shadow-300);opacity:.9;transition:transform .24s var(--transition-easing);animation:3s ease-in-out infinite floating-card;animation-delay:calc(var(--index) * -.36s);display:flex;position:absolute;overflow:clip}@keyframes floating-card{0%{translate:0 6px}50%{translate:0 -6px}to{translate:0 6px}}.home-illustration__card:before{content:"";height:var(--card-title-bar-height);border-bottom:var(--layout-border);background-color:var(--grey-100);z-index:1;width:100%;position:absolute;left:0}.home-illustration__card:after{content:"";top:calc(var(--card-title-bar-height) / 2 - 4px);background-color:var(--grey-200);z-index:2;border-radius:50%;width:8px;height:8px;position:absolute;left:6px}.home-illustration__card--1{--index:1;--transform:translate(-40%, -100%)}.home-illustration__card--2{--index:2;--transform:translateY(100%)}.home-illustration__card--3{--index:3;--transform:translate(-65%, -15%)}.home-illustration__card--4{--index:4;--transform:translate(40%, -40%)}@media (width>=860px){.home-illustration__card--1{--transform:translate(-60%, -100%)}.home-illustration__card--3{--transform:translateX(-100%)}}.introduction__right:hover .home-illustration__card{transform:var(--transform)}.home-illustration__card--1>svg{align-self:flex-end;width:100%;height:auto}.home-illustration__card--4{--size:12px;background-image:repeating-linear-gradient(0deg, transparent, transparent var(--size), var(--grey-200) var(--size), var(--grey-200) calc(var(--size) + 1px)), repeating-linear-gradient(90deg, transparent, transparent var(--size), var(--grey-200) var(--size), var(--grey-200) calc(var(--size) + 1px))}.home-illustration__card--4>svg{width:auto;max-height:70%;margin:auto}.home-banner__link{width:min(calc(100% - 20px), var(--layout-width));height:40px;font-family:var(--serif-font);color:var(--primary);font-size:var(--label);text-align:center;justify-content:center;align-items:center;gap:4px;margin:0 auto;text-decoration:none;display:flex;position:relative}.home-banner__link:focus-visible{outline-offset:-3px}.home-banner__link:before,.home-banner__link:after{content:"";width:100%;height:100%;transition:opacity .32s var(--transition-easing);position:absolute;top:0;left:0}.home-banner__link:before{background:radial-gradient(circle at 50% 50%, var(--magenta) 0%, var(--blue) 30%, transparent 70%, transparent 100%);opacity:.2;z-index:-1}.home-banner__link:after{background:radial-gradient(circle at 50% 50%, var(--magenta) 0%, var(--magenta) 80%, transparent 100%);opacity:0;z-index:-1}.home-banner__link:is(:hover,:focus):after{opacity:.1}.home-banner__part-1{display:none}.home-banner__part-2{text-transform:capitalize}@media (width>=600px){.home-banner__part-1{display:block}.home-banner__part-2{text-transform:none}}.home-banner__icon{fill:currentColor;flex:0 0 14px;height:14px}.introduction{--margin:40px;--padding:20px;width:min(calc(100% - var(--padding)), var(--layout-width));height:calc(100vh - (var(--navigation-height) + var(--margin) * 2));border-top:var(--layout-border-dashed);border-bottom:var(--layout-border-dashed);min-height:500px;margin:0 auto 40px;position:relative}@media (width>=520px) and (width<=920px){.introduction{--padding:50px}}.introduction__inner{width:100%;height:100%;padding:20px;display:flex;position:relative;overflow:clip}.introduction__left{pointer-events:none;z-index:1;flex-direction:column;flex:0 0 100%;justify-content:center;gap:8px;padding:4px 12px 12px;display:flex}@media (orientation:portrait) and (width<=860px){.introduction__left{justify-content:flex-start;padding-top:5%}}@media (width>=801px){.introduction__left{padding:4px 44px 44px}}@media (width>=860px){.introduction__left{flex:0 0 70%}}.introduction__tagline{font-size:var(--h1);font-family:var(--font-reading);text-wrap:balance;transition:opacity .32s .32s var(--transition-easing);font-weight:500}@starting-style{.introduction__tagline{opacity:0}}@media (width>=560px){.introduction__tagline{font-size:calc(var(--h1) * 1.4)}}.introduction__tagline>em{padding-right:4px;font-weight:400}.introduction__name{font-size:var(--h2);color:var(--primary);transition:opacity .48s .32s var(--transition-easing);font-weight:700}@starting-style{.introduction__name{opacity:0}}@media (width>=560px){.introduction__name{font-size:var(--h1)}}.introduction__title{font-family:var(--monospace-font);font-size:var(--h4);color:var(--secondary);transition:opacity .64s .32s var(--transition-easing);font-weight:500}@starting-style{.introduction__title{opacity:0}}.introduction__right{width:100%;height:70%;transition:opacity .8s .64s var(--transition-easing);align-items:center;display:flex;position:absolute;bottom:0;right:0}@media (width>=860px){.introduction__right{bottom:unset;width:45%;height:100%;top:0}}@starting-style{.introduction__right{opacity:0}}@property --home-blogging-progress{syntax:"<number>";inherits:true;initial-value:0}.home-blogging{--home-blogging-loop-duration:9.6s;--home-blogging-progress:0;--home-blogging-write-window:.06;width:100%;height:100%;padding-top:calc(var(--card-title-bar-height) + 1px);animation:home-blogging-progress var(--home-blogging-loop-duration) linear infinite;justify-content:center;display:flex}.home-blogging__content{flex-direction:column;flex:0 0 50%;gap:2px;height:max-content;padding:10px 4px;display:flex}.home-blogging__title{background-color:var(--grey-300);width:50%;height:4px;margin-bottom:4px}.home-blogging__line{--home-blogging-reveal-at:0;--home-blogging-write-progress:clamp(0, calc((var(--home-blogging-progress) - var(--home-blogging-reveal-at)) / var(--home-blogging-write-window)), 1);--home-blogging-cursor-visible:min(clamp(0, calc(var(--home-blogging-write-progress) * 1000), 1), clamp(0, calc((1 - var(--home-blogging-write-progress)) * 1000), 1));width:100%;height:8px;position:relative;overflow:hidden}.home-blogging__line:after{content:"";background-color:var(--grey-100);border-left:calc(var(--home-blogging-cursor-visible) * 2px) solid var(--grey-300);transform:translateX(calc(var(--home-blogging-write-progress) * 102%));pointer-events:none;will-change:transform;z-index:1;position:absolute;inset:0}.home-blogging__line:nth-child(4),.home-blogging__line:nth-child(8),.home-blogging__line:nth-child(11){margin-bottom:4px}.home-blogging__line:nth-child(2):before{content:"";background:var(--gradient);border-right:3px solid var(--grey-100);border-bottom:3px solid var(--grey-100);width:12px;height:12px;position:absolute;top:0;left:0}@keyframes home-blogging-progress{0%{--home-blogging-progress:0}to{--home-blogging-progress:1}}.home-drafts{width:100%;height:100%;padding-top:calc(var(--card-title-bar-height) + 1px);position:relative;overflow:clip}.home-drafts:before{content:"";background-image:radial-gradient(circle, var(--grey-300) .8px, transparent 1px);opacity:.35;pointer-events:none;background-size:14px 14px;position:absolute;inset:0}.home-drafts:after{content:"";background:linear-gradient(to top, var(--surface-page), transparent);opacity:.45;pointer-events:none;height:34%;position:absolute;inset:auto 0 0}.home-drafts__canvas{width:100%;height:100%;padding:8px;position:relative}.home-drafts__note{--accent:var(--magenta);--x:0;--y:0;--w:50%;--h:60%;--float-x:3px;--float-y:-3px;--delay:0s;top:var(--y);left:var(--x);width:var(--w);height:var(--h);color:var(--text-secondary);background-color:var(--surface-elevated);border:1px solid var(--grey-300);border-radius:var(--radius-200);box-shadow:var(--shadow-100);animation:6s ease-in-out infinite home-drafts-note-float;animation-delay:var(--delay);flex-direction:column;gap:6px;padding:9px 8px 8px;display:flex;position:absolute}.home-drafts__note:first-child{--accent:var(--yellow);--x:5%;--y:10%;--float-x:3px;--float-y:-4px;--delay:-.2s}.home-drafts__note:nth-child(2){--accent:var(--green);--x:40%;--y:30%;--float-x:-3px;--float-y:4px;--delay:-.9s}.home-drafts__note:nth-child(3){--accent:var(--blue);--x:24%;--y:60%;--float-x:4px;--float-y:3px;--delay:-1.4s}.home-drafts__note-title{align-items:center;gap:6px;font-size:9px;font-weight:700;line-height:1;display:flex}.home-drafts__dot{background-color:var(--accent);width:7px;height:7px;box-shadow:0 0 0 1px var(--surface-page);border-radius:50%}.home-drafts__note-body{border-radius:var(--radius-100);opacity:.65;background-image:linear-gradient(to bottom, transparent 0 18%, var(--grey-400) 18% 22%, transparent 22% 42%, var(--grey-400) 42% 46%, transparent 46% 66%, var(--grey-400) 66% 70%, transparent 70% 100%);flex:1;position:relative}@keyframes home-drafts-note-float{0%,to{transform:translate(0)}50%{transform:translate(var(--float-x), var(--float-y))}}@media (prefers-reduced-motion:reduce){.home-drafts__note{animation:none}}.drawing-cursor{animation:drawing-cursor 12s var(--transition-easing) infinite}@keyframes drawing-cursor{0%{transform:translate(0)}20%,30%{transform:translate(-100px,-10px)}50%{transform:translate(-40px,40px)}70%{transform:translate(-10px,-20px)}to{transform:translate(0)}}}.latest-blog-posts{max-width:100%;transition:opacity 1.28s .32s var(--transition-easing);flex-direction:column;align-items:flex-end;padding:4px 16px;display:flex;position:absolute;bottom:0;right:0}@starting-style{.latest-blog-posts{opacity:0}}.latest-blog-posts__title{font-size:var(--p);color:var(--grey-800);font-weight:700;font-family:var(--monospace-font)}.latest-blog-posts__list{flex-direction:column;align-items:flex-end;width:100%;max-height:40px;display:flex;overflow:clip}.latest-blog-posts__item{max-width:100%;font-size:var(--p);color:var(--grey-600);font-weight:400;font-family:var(--monospace-font);padding:10px 0;animation:15s ease-in-out infinite latest-blog-posts-scroll}@keyframes latest-blog-posts-scroll{0%,30%{transform:translateY(0)}33%,63%{transform:translateY(-100%)}66%,96%{transform:translateY(-200%)}to{transform:translateY(-300%)}}.latest-blog-posts__link{text-align:right;color:inherit;transition:color .16s var(--transition-easing);text-overflow:ellipsis;white-space:nowrap;text-decoration:none;display:block;overflow:hidden}.latest-blog-posts__link:is(:hover,:focus){color:var(--magenta);text-underline-offset:3px;text-decoration:underline 2px}.latest-blog-posts__link:before,.latest-blog-posts__link:after{content:"\""}