1 2<!DOCTYPE html><html data-page="login" lang="en" class="okaydev-boot-pending is-dark" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#" data-use-project-image-blurred-bg="false"> 3 4 <head><link 5rel="preconnect" href="https://images.okaydev.co" crossorigin><link 6rel="preconnect" href="https://servd-okaydev-site.b-cdn.net" crossorigin><link 7rel="preconnect" href="https://cdn.usefathom.com" crossorigin><link 8rel="preload" href="https://okaydev.co/dist/assets/AeonikPro-VF-DJagqNti.woff2" as="font" type="font/woff2" crossorigin><link 9rel="preload" href="https://okaydev.co/dist/assets/AeonikMono-Regular-BJhjWe-O.woff2" as="font" type="font/woff2" crossorigin><link 10rel="preload" href="https://okaydev.co/dist/assets/Megazoid-Regular-DP6yeqDh.woff2" as="font" type="font/woff2" crossorigin><meta 11charset="utf-8"><meta 12name="viewport" content="width=device-width,minimum-scale=1">
12<script>(function(){if(!window.matchMedia('(display-mode: standalone)').matches&&navigator.standalone!==true)return;document.documentElement.classList.add('is-standalone-app');var viewport=document.querySelector('meta[name="viewport"]');if(viewport&&viewport.content.indexOf('viewport-fit')===-1){viewport.content+=',viewport-fit=cover';}})();</script>
12 <style>.app-toolbar,.app-logo,.app-explore-nav{display:none}html.is-standalone-app{--app-safe-top:env(safe-area-inset-top,0px);--app-safe-right:env(safe-area-inset-right,0px);--app-safe-bottom:env(safe-area-inset-bottom,0px);--app-safe-left:env(safe-area-inset-left,0px);--app-content-left:var(--app-safe-left);--app-content-right:var(--app-safe-right)}html.is-standalone-app main[data-router-wrapper]{box-sizing:border-box;padding-left:var(--app-content-left);padding-right:var(--app-content-right)}html.is-standalone-app body{--app-chrome-bg:var(--bg-current,#121212)}html.is-standalone-app body.bento-page-shell{--app-chrome-bg:color-mix(in srgb,var(--bento-page-bg) 88%,#0c0c0c)}html.is-standalone-app body:after{content:'';position:fixed;inset:0;z-index:4000;border-left:var(--app-content-left) solid var(--app-chrome-bg);border-right:var(--app-content-right) solid var(--app-chrome-bg);pointer-events:none}html.is-standalone-app #okaydev-pwa-launch:not([hidden]){left:var(--app-content-left);right:var(--app-content-right)}@media (max-width:1023px),(hover:none) and (pointer:coarse){html.is-standalone-app{--app-logo-gutter:var(--gutter-x,16px);--app-logo-height:32px;--app-logo-top:calc(max(var(--app-safe-top),var(--app-status-tint-height,12px)) + var(--app-logo-gutter));--core-header-height:calc(var(--app-logo-top) + var(--app-logo-height) + var(--app-logo-gutter))}html.is-standalone-app .core-header,html.is-standalone-app body:not([data-page=home]) .core-footer{display:none}html.is-standalone-app[data-app-nav-side]{--app-rail-space:max(80px,var(--app-safe-left),var(--app-safe-right))}html.is-standalone-app[data-app-nav-side=left]{--app-content-left:var(--app-rail-space)}html.is-standalone-app[data-app-nav-side=right]{--app-content-right:var(--app-rail-space)}}</style>
12<script>(function(){var root=document.documentElement;if(!root.classList.contains('is-standalone-app')||!window.matchMedia('(max-width: 1023px), (hover: none) and (pointer: coarse)').matches)return;var style=getComputedStyle(root);var left=parseFloat(style.getPropertyValue('--app-safe-left'))||0;var right=parseFloat(style.getPropertyValue('--app-safe-right'))||0;if(Math.max(left,right)>0){var side=left>right?'left':'right';if(left===right&&root.clientWidth>window.innerHeight){var angle=window.screen.orientation?window.screen.orientation.angle:window.orientation;var rotation=(((angle||0)%360)+360)%360;if(rotation===270)side='left';else if(rotation===90)side='right';} 13root.dataset.appNavSide=side;}})();</script>
13 <meta 14name="csrf-token-name" content="CRAFT_CSRF_TOKEN"><meta 15name="csrf-token" content="tF5kAD0SxdXjLRXc8VJ4PaZ5IRVU2hNPiLH11EpmGuwtRLpWOYqoRswXMFNNZJaxjlosupgHOw3hLnRhDop4fNz4xpMbDymAHwbKPg3hmj4="><link 16id="favicon-png" class="favicon-default" rel="icon" type="image/png" href="/dist/images/icons/favicon-96x96.png" sizes="96x96" /><link 17id="favicon-svg" class="favicon-default" rel="icon" type="image/svg+xml" href="/dist/images/icons/favicon.svg" /><link 18id="favicon-ico" class="favicon-default" rel="shortcut icon" href="/dist/images/icons/favicon.ico" /><link 19rel="manifest" href="/manifest.webmanifest"><link 20rel="apple-touch-icon" sizes="1024x1024" href="/pwa/stacked-purple-1024.png"><meta 21name="apple-mobile-web-app-capable" content="yes"><meta 22name="apple-mobile-web-app-status-bar-style" content="default"><link 23rel="apple-touch-startup-image" href="/pwa/startup/320-568-2-portrait-v3.png" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 24rel="apple-touch-startup-image" href="/pwa/startup/320-568-2-landscape-v3.png" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 25rel="apple-touch-startup-image" href="/pwa/startup/375-667-2-portrait-v3.png" media="screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 26rel="apple-touch-startup-image" href="/pwa/startup/375-667-2-landscape-v3.png" media="screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 27rel="apple-touch-startup-image" href="/pwa/startup/414-736-3-portrait-v3.png" media="screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 28rel="apple-touch-startup-image" href="/pwa/startup/414-736-3-landscape-v3.png" media="screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 29rel="apple-touch-startup-image" href="/pwa/startup/375-812-3-portrait-v3.png" media="screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 30rel="apple-touch-startup-image" href="/pwa/startup/375-812-3-landscape-v3.png" media="screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 31rel="apple-touch-startup-image" href="/pwa/startup/390-844-3-portrait-v3.png" media="screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 32rel="apple-touch-startup-image" href="/pwa/startup/390-844-3-landscape-v3.png" media="screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 33rel="apple-touch-startup-image" href="/pwa/startup/393-852-3-portrait-v3.png" media="screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 34rel="apple-touch-startup-image" href="/pwa/startup/393-852-3-landscape-v3.png" media="screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 35rel="apple-touch-startup-image" href="/pwa/startup/402-874-3-portrait-v3.png" media="screen and (device-width: 402px) and (device-height: 874px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 36rel="apple-touch-startup-image" href="/pwa/startup/402-874-3-landscape-v3.png" media="screen and (device-width: 402px) and (device-height: 874px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 37rel="apple-touch-startup-image" href="/pwa/startup/414-896-2-portrait-v3.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 38rel="apple-touch-startup-image" href="/pwa/startup/414-896-2-landscape-v3.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 39rel="apple-touch-startup-image" href="/pwa/startup/414-896-3-portrait-v3.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 40rel="apple-touch-startup-image" href="/pwa/startup/414-896-3-landscape-v3.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 41rel="apple-touch-startup-image" href="/pwa/startup/428-926-3-portrait-v3.png" media="screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 42rel="apple-touch-startup-image" href="/pwa/startup/428-926-3-landscape-v3.png" media="screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 43rel="apple-touch-startup-image" href="/pwa/startup/430-932-3-portrait-v3.png" media="screen and (device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 44rel="apple-touch-startup-image" href="/pwa/startup/430-932-3-landscape-v3.png" media="screen and (device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 45rel="apple-touch-startup-image" href="/pwa/startup/440-956-3-portrait-v3.png" media="screen and (device-width: 440px) and (device-height: 956px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link 46rel="apple-touch-startup-image" href="/pwa/startup/440-956-3-landscape-v3.png" media="screen and (device-width: 440px) and (device-height: 956px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><link 47rel="apple-touch-startup-image" href="/pwa/startup/768-1024-2-portrait-v3.png" media="screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 48rel="apple-touch-startup-image" href="/pwa/startup/768-1024-2-landscape-v3.png" media="screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 49rel="apple-touch-startup-image" href="/pwa/startup/810-1080-2-portrait-v3.png" media="screen and (device-width: 810px) and (device-height: 1080px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 50rel="apple-touch-startup-image" href="/pwa/startup/810-1080-2-landscape-v3.png" media="screen and (device-width: 810px) and (device-height: 1080px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 51rel="apple-touch-startup-image" href="/pwa/startup/820-1180-2-portrait-v3.png" media="screen and (device-width: 820px) and (device-height: 1180px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 52rel="apple-touch-startup-image" href="/pwa/startup/820-1180-2-landscape-v3.png" media="screen and (device-width: 820px) and (device-height: 1180px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 53rel="apple-touch-startup-image" href="/pwa/startup/834-1112-2-portrait-v3.png" media="screen and (device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 54rel="apple-touch-startup-image" href="/pwa/startup/834-1112-2-landscape-v3.png" media="screen and (device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 55rel="apple-touch-startup-image" href="/pwa/startup/834-1194-2-portrait-v3.png" media="screen and (device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 56rel="apple-touch-startup-image" href="/pwa/startup/834-1194-2-landscape-v3.png" media="screen and (device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 57rel="apple-touch-startup-image" href="/pwa/startup/744-1133-2-portrait-v3.png" media="screen and (device-width: 744px) and (device-height: 1133px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 58rel="apple-touch-startup-image" href="/pwa/startup/744-1133-2-landscape-v3.png" media="screen and (device-width: 744px) and (device-height: 1133px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 59rel="apple-touch-startup-image" href="/pwa/startup/1024-1366-2-portrait-v3.png" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 60rel="apple-touch-startup-image" href="/pwa/startup/1024-1366-2-landscape-v3.png" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><link 61rel="apple-touch-startup-image" href="/pwa/startup/1032-1376-2-portrait-v3.png" media="screen and (device-width: 1032px) and (device-height: 1376px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link 62rel="apple-touch-startup-image" href="/pwa/startup/1032-1376-2-landscape-v3.png" media="screen and (device-width: 1032px) and (device-height: 1376px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><meta 63name="apple-mobile-web-app-title" content="OkayDev" /><meta 64id="msapplication-tile-color" name="msapplication-TileColor" content="#121212"><meta 65name="msapplication-config" content="/dist/browserconfig.xml"><meta 66id="theme-color-meta" name="theme-color" content="#121212"><!--# if expr="$HTTP_COOKIE=/critical\-css\=1/" --><style>@media (max-width:1023px){.project-page-title{grid-area:title;margin-block:0;padding-block:0;font-size:22px;line-height:40px;white-space:normal}.project-page-layout .author-ctas,.project-page-layout .author-ctas-2,.project-page-layout .bento-project-overlay-actions{grid-area:metrics;width:100%}}@font-face{font-display:swap;font-family:Aeonik;font-style:normal;font-weight:100 900;src:url(/dist/assets/AeonikPro-VF-DJagqNti.woff2) format("woff2")}@font-face{font-display:optional;font-family:Megazoid;font-style:normal;font-weight:400;src:url(/dist/assets/Megazoid-Regular-DP6yeqDh.woff2) format("woff2")}@font-face{font-display:swap;font-family:Aeonik Mono;font-style:normal;font-weight:400;src:url(/dist/assets/AeonikMono-Regular-BJhjWe-O.woff2) format("woff2")}.bento-identity-card__content>.bento-identity-card__header{display:flex;align-items:center;justify-content:space-between;gap:12px;grid-area:eyebrow;min-width:0;height:11px;min-height:0}.bento-identity-card__team-badges{display:flex;flex-wrap:wrap;align-items:center;gap:6px;grid-area:badges}.bento-identity-card__avatar{grid-area:avatar;align-self:start;justify-self:start;position:relative;width:auto;height:2lh;aspect-ratio:4/5;font-size:var(--bento-identity-name-fit-size,clamp(28px,4.4vw,44px));line-height:.92;perspective:900px}.bento-identity-card__copy{grid-area:name;padding-right:clamp(8px,1vw,14px)}@media (max-width:767px){.bento-identity-card__content>
66.bento-identity-card__header .bento-details-card__actions{grid-area:utility;width:100%;margin:4px 0 0;border-top:1px solid;padding-top:calc(var(--bento-identity-content-gap) + 4px - 6.5px)}}.bento-identity-card__actions{grid-area:actions;display:grid;align-self:end;gap:10px}.bento-social-icons.bento-identity-card__profile-social-icons{--bento-profile-social-hit-size:38px;grid-area:social;align-self:start;width:100%;margin-left:calc((var(--bento-profile-social-hit-size) - 19px)/-2)}.bento-identity-card__overlay-details{--bento-gig-fade-width:1.75em;--bento-gig-fade-stops:rgb(from var(--bento-theme-surface) r g b/0%) 0%,rgb(from var(--bento-theme-surface) r g b/1.5%) 18%,rgb(from var(--bento-theme-surface) r g b/6%) 36%,rgb(from var(--bento-theme-surface) r g b/13%) 54%,rgb(from var(--bento-theme-surface) r g b/24%) 72%,rgb(from var(--bento-theme-surface) r g b/37%) 86%,rgb(from var(--bento-theme-surface) r g b/100%) 100%;display:block;grid-area:work;min-width:0}.bento-stats-card__emoji{grid-area:1/1;display:block;line-height:1;will-change:transform,opacity}@media (min-width:0){.bento-identity-card.is-expanded .bento-identity-card__team-badges{grid-area:auto;margin-top:12px}.bento-identity-card.is-expanded .bento-identity-card__profile-column{--bento-profile-info-space:clamp(18px,2.2vw,28px);grid-area:profile;gap:var(--bento-profile-info-space)}.bento-identity-card.is-expanded .bento-identity-card__information-column{grid-area:information;gap:0;padding-top:clamp(8px,.85vw,12px)}}.bento-user-hub-aside.bento-identity-card .bento-user-hub-aside__utility-actions{grid-area:utility;align-self:end;width:100%;margin:0 0 -6.5px;border:0;border-top:1px solid;padding:calc(var(--bento-identity-content-gap) - 6.5px - 1px) 0 0;color:var(--bento-theme-ink)}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date{display:flex;align-items:stretch;gap:inherit;grid-area:head;min-width:0;width:100%}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits{grid-area:unset;grid-column:1/-1;width:100%}@media (max-width:1023px){.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .bento-project-card__exp
66anded-title{display:block;grid-area:title;position:relative;min-width:0;height:var(--overlay-close-size);margin:0;padding:0;overflow:hidden;font-size:22px;line-height:var(--overlay-close-size);white-space:nowrap}.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .author-ctas,.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .author-ctas-2{grid-area:metrics;width:100%;min-width:0}.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .bento-card__close{grid-area:close;align-self:start;width:var(--overlay-close-size);height:var(--overlay-close-size);margin-left:0}.page-project-overlay .bento-project-card__expanded-title{grid-area:title;height:var(--overlay-close-size);margin:0;padding:0;font-size:22px;line-height:var(--overlay-close-size)}.page-project-overlay .bento-card__close{grid-area:close;width:var(--overlay-close-size);height:var(--overlay-close-size);margin-left:0}.page-project-overlay .author-ctas,.page-project-overlay .author-ctas-2,.page-project-overlay .bento-project-overlay-actions{grid-area:metrics;width:100%}}@font-face{font-display:swap;
66font-family:FallbackFont;src:local("Arial");font-weight:400}@font-face{font-display:swap;font-family:FallbackFontMono;src:local("monospace");font-weight:400}@font-face{font-display:swap;font-family:FallbackFontBold;src:local("Arial Bold");font-weight:800}@font-face{font-display:swap;font-family:Aeonik;font-weight:100 900;font-style:italic;src:url(/dist/assets/AeonikPro-Italic-VF-DGkIg-ar.woff2) format("woff2"),url(/dist/assets/AeonikPro-Italic-VF-WifKrdD1.woff) format("woff")}@font-face{font-display:swap;font-family:Aeonik;font-weight:100 900;font-style:normal;src:url(/dist/assets/AeonikPro-VF-DJagqNti.woff2) format("woff2"),url(/dist/assets/AeonikPro-VF-B5-mzo4h.woff) format("woff")}@font-face{font-display:swap;font-family:Aeonik Mono;font-weight:400;font-style:normal;src:url(/dist/assets/AeonikMono-Regular-BJhjWe-O.woff2) format("woff2"),url(/dist/assets/AeonikMono-Regular-v8syvusg.woff) format("woff")}@font-face{font-display:swap;font-family:Megazoid;font-weight:400;font-style:normal;src:url(/dist/assets/Megazoid-Regular-DP6yeqDh.woff2) format("woff2"),url(/dist/assets/Megazoid-Regular-DDQUTSy0.woff) format("woff")}[data-page=login] [data-handle=login]{display:flex;flex-direction:column;min-height:calc(100svh - var(--core-header-height))}[data-page=login] [data-handle=login] .login-container{display:flex;flex:1 1 auto;align-items:center;justify-content:center;width:100%;padding-top:calc(var(--gutter-y)*2);padding-bottom:calc(var(--gutter-y)*3)}[data-page=login] [data-handle=login] .login-container .login-panel{width:100%;max-width:360px;margin-inline:auto}[data-page=login] [data-handle=login] .login-container .heading{font-family:Megazoid,FallbackFontBold,arial,helvetica,sans-serif;font-feature-settings:"liga" on,"kern" on,"ss01" on,"ss04" on,"ss12" on;font-size:clamp(48px,5vw,192px);font-weight:400;letter-spacing:.005em;line-height:1;font-size:clamp(40px,6vw,64px);margin-bottom:28px;text-align:center;text-transform:uppercase}[data-page=login] [data-handle=login] .login-container .content{width:100%}[data-page=login] [data-handle=login] .login-container form{display:flex;flex-direction:column;gap:18px;width:100%}[data-page=login] [data-handle=login] .login-container .field-container{position:relative;display:flex;flex-direction:column;align-items:stretch;width:100%}[data-page=login] [data-handle=login] .login-container .field-container label{margin-bottom:8px}[data-page=login] [data-handle=login] .login-container .field-container #password{padding-right:48px}[data-page=login] [data-handle=login] .login-container .field-label-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}[data-page=login] [data-handle=login] .login-container .field-label-row label{margin-bottom:0}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper{position:absolute;top:auto;right:16px;bottom:14px;width:20px;height:20px;transform:none}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper label{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;border-radius:5px}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper label:after{display:none}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper #password-reveal{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;opacity:1;clip-path:inset(50%)}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper .eye-fill{display:none}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper svg{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}[data-page=login] [data-handle=login] .login-container .label-wrap{margin:2px 0 4px}[data-page=login] [data-handle=login] .login-container .label-wrap input[type=checkbox]{flex-shrink:0;background-color:color-mix(in srgb,var(--text-current) 6%,var(--bg-current))!important;border:1px solid color-mix(in srgb,var(--text-current) 28%,transparent)!important;border-radius:4px}[data-page=login] [data-handle=login] .login-container .label-wrap input[type=checkbox]:before{border-radius:2px;box-shadow:inset 1em 1em var(--text-current)}[data-page=login] [data-handle=login] .login-container button[type=submit]{width:100%;margin-top:6px}[data-page=login] [data-handle=login] .login-container .forgot-password{display:inline-block;position:relative;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
66font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase;position:absolute;top:0;right:0;flex-shrink:0;color:color-mix(in srgb,var(--text-current) 70%,transparent)}[data-page=login] [data-handle=login] .login-container .sign-up-message{margin-top:28px;text-align:center;color:color-mix(in srgb,var(--text-current) 70%,transparent)}[data-page=login] [data-handle=login] .login-container .sign-up-message a{display:inline-block;position:relative;font-weight:700;color:var(--text-current)}@media (min-width:768px){.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date{grid-area:head}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits{grid-area:unset;grid-column:auto;width:100%}
66.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency{grid-area:agency}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client{grid-area:client}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits{grid-area:credits}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section{grid-area:awards}[data-page=login] [data-handle=login] .login-container .forgot-password:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:var(--text-current);transform:scaleX(0);transform-origin:right top;will-change:transform}[data-page=login] [data-handle=login] .login-container .sign-up-message a:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:var(--text-current);transform:scaleX(0);transform-origin:right top;will-change:transform}.hide-on-desktop{display:none!important}}body.is-dark [data-handle=login] .login-container form label{margin-left:0;color:var(--text-current)}body.is-dark [data-handle=login] .login-container form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]){box-sizing:border-box;width:100%;padding:12px 14px;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif!important;font-size:16px!important;line-height:1.4;color:var(--text-current)!important;caret-color:var(--text-current);background-color:color-mix(in srgb,var(--text-current) 6%,var(--bg-current))!important;border:1px solid color-mix(in srgb,var(--text-current) 14%,transparent)!important;border-radius:8px;will-change:transform}body.is-dark [data-handle=login] .login-container form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):-webkit-autofill{-webkit-text-fill-color:var(--text-current)!important;box-shadow:0 0 0 1000px color-mix(in srgb,var(--text-current) 6%,var(--bg-current)) inset!important}body.is-dark [data-handle=login] .login-container form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):-webkit-autofill{will-change:transform}body.is-dark [data-handle=login] .login-container form #password{padding-right:48px}body.is-dark [data-handle=login] .login-container form .password-reveal-wrapper svg,body.is-dark [data-handle=login] .login-container form .password-reveal-wrapper svg path{f
66ill:var(--text-current)!important}.bento-customizer.is-floating.is-project-details[data-project-details-panel] .publish-toggle-label>*{grid-area:1/1}.home-feature-directory-stack .pagination-actions,[data-handle=directory] .directory-container .pagination-actions{grid-area:actions;display:flex;align-items:center;justify-content:flex-start;min-width:0}.home-feature-directory-stack .pagination-info,[data-handle=directory] .directory-container .pagination-info{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;grid-area:info;align-self:center;text-align:right;min-width:0}.home-feature-directory-stack .pagination-upgrade,[data-handle=directory] .directory-container .pagination-upgrade{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;grid-area:upgrade;display:flex;align-items:baseline;justify-content:center;gap:10px;justify-self:center;text-align:center}@media (max-width:767px){.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col:not(.is-people)>*,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col:not(.is-people)>*,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col:not(.is-people)>*,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col:not(.is-people)>*{grid-area:auto;grid-column:1/-1}[data-handle=home] .work-item{position:relative;grid-area:1/1;width:min(305px,100vw - 2*var(--gutter-cap));border-radius:6px;visibility:hidden;opacity:0}}*,:after,:before{box-sizing:border-box}body{min-height:100vh;min-height:100dvh;margin:0}ul[class]{padding:0;list-style-type:""}a{text-decoration:none}a:not([class]){-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}button,input{font:inherit}:root{--metric-count-ch:6ch;--metric-count-min-width:6ch;--metric-action-icon-size:20px;--metric-action-row-gap:6px;--metric-action-inner-gap:4px;--metric-action-cluster-min-width:calc(var(--metric-action-icon-size) + var(--metric-action-inner-gap) + var(--metric-count-min-width));--metric-profile-pill-aspect-ratio:2/1}body{color:var(--text-current);font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss02" on,"ss07" on,"ss08" on;font-weight:400;font-style:normal;font-size:18px;line-height:1.5;letter-spacing:.18px;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}.button,button,input,label{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:18px;line-height:1.5;letter-spacing:.18px;border-radius:0;font-weight:400;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss02" on,"ss07" on,"ss08" off;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}input,label{text-transform:none}label{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase}input[type=password]:not(:placeholder-shown){font-family:sans-serif}input:-webkit-autofill{-webkit-text-fill-color:inherit;box-shadow:0 0 0 1000px var(--bg-current,#fff) inset!important}input:-webkit-autofill{will-change:transform}body.is-dark input:-webkit-autofill{background-color:transparent!important;background-image:none!important;-webkit-text-fill-color:var(--text-current);box-shadow:0 0 0 1000px var(--bg-current) inset!important}body.is-dark input:-webkit-autofill{will-change:transform}form label{margin-bottom:10px;margin-left:17px}form input{background-color:#fff;border:1px solid var(--text-current);border-radius:5px;padding:16px;width:100%;display:block;resize:none;will-change:transform}form input:-webkit-autofill{-webkit-text-fill-color:inherit;box-shadow:0 0 0 1000px #fff inset!important}form input:-webkit-autofill{will-change:transform}form input[type=checkbox]{appearance:none;-webkit-appearance:none;display:inline-grid!important;place-content:center;min-width:18px;min-height:18px;width:auto;height:auto;padding:0}form input[type=checkbox]:before{content:"";display:block;width:11px;height:11px;border-radius:50%;transform:scale(0);box-shadow:inset 1em 1em var(--text-current);will-change:transform,opacity}form button{margin:0;border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
66font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:22px;padding:0 25px;color:var(--bg-current);background-color:var(--text-current);overflow:hidden;margin-top:calc(var(--gutter-y)*.75);will-change:transform}.heading,h1{margin-top:0;margin-bottom:0;font-weight:800;line-height:1}h1{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-weight:900;font-size:clamp(63px,6.7vw,146px);font-feature-settings:"dlig" on,"ss11" on,"ss09" on,"ss08" on,"ss05" on,"ss07" on,"ss06" on,"ss03" on,"case" on;line-height:.96;letter-spacing:-1.92px}p{margin-top:1em;margin-bottom:0}p:first-child{margin-top:0}.label-1{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase}.label-2{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase}@media screen and (max-width:767px){form label{margin-left:0}}:root{box-sizing:border-box;--vw:100vw;--vh:100vh;--text-current:#fff;--bg-current:#121212}*,:after,:before{box-sizing:inherit}@media (max-width:1023px),(hover:none) and (pointer:coarse){*,:after,:before{will-change:auto!important}}body,html{width:100%;margin:0;background-color:var(--bg-current)}body{overflow-x:clip}body.is-dark,html.is-dark{color-scheme:dark}.bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;will-change:transform,opacity}.bg-layer--dark{background-color:#121212;opacity:1}.bg-layer--light{background-color:#fff;opacity:0}main[data-router-wrapper]{position:relative;z-index:1;width:100%}img,svg{vertical-align:middle}.page-container{padding-top:60px;padding-bottom:calc(var(--gutter-y)*3)}@media (max-width:767px){h1{letter-spacing:-1.26px}.hide-on-mobile{display:none!important}.page-container{padding-top:calc(var(--gutter-y)*2);padding-bottom:calc(var(--gutter-y)*6);backface-visibility:hidden}.okay-form .label-wrap{margin-left:17px}}.wrapper{width:100%;margin-left:auto;margin-right:auto;padding-left:var(--gutter-cap);padding-right:var(--gutter-cap)}[data-handle]>.page-container.wrapper{max-width:var(--page-content-shell-max-width);margin-left:auto;margin-right:auto}:is([data-handle=login],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=editProfile],[data-handle=managePortfolio],[data-handle=manageTeam],[data-handle=membership],[data-handle=accountSettings],[data-handle=accountSettingsBusiness],[data-handle=notifications])>.page-container.wrapper{max-width:calc(1280px + var(--core-header-outer-padding)*2);margin-left:auto;margin-right:auto;padding-left:calc(var(--core-header-outer-padding) + var(--core-header-inner-padding-x-left));padding-right:calc(var(--core-header-outer-padding) + var(--core-header-inner-padding-x-right))}craft-csrf-input{display:none!important}img{max-width:100%}dialog:not([open]){display:none}button{touch-action:manipulation}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.okay-form .heading{font-family:Megazoid,FallbackFontBold,arial,helvetica,sans-serif;font-feature-settings:"liga" on,"kern" on,"ss01" on,"ss04" on,"ss12" on;font-size:clamp(48px,5vw,192px);font-weight:400;letter-spacing:.005em;line-height:1;margin-bottom:var(--gutter-y)}.okay-form .field-container{display:flex;flex-wrap:wrap;align-items:center;width:100%}.okay-form .field-container:has([required]) label:after{content:"*";margin-left:5px;color:#dc3545}.okay-form .label-wrap{display:flex;align-items:center}.okay-form .label-wrap input{margin-right:6px}.okay-form button[type=submit]{margin-top:0}.brand-variant-card__choice>span{grid-area:description;color:#525252;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:10px;line-height:1.2;text-transform:uppercase}.brand-variant-swatches{display:flex;flex-wrap:wrap;grid-area:swatches;gap:8px}
66.brand-download-links{display:flex;grid-area:downloads;justify-self:end;gap:6px}:root{--color-bg-black-rgb:12,12,12}:root{--color-bg-gray-dark-4-rgb:2,2,2}:root{--color-bg-gray-dark-3-rgb:2,2,2}:root{--color-bg-gray-dark-2-rgb:82,82,82}:root{--color-bg-gray-dark-1-rgb:129,129,129}:root{--color-bg-gray-light-4-rgb:242,242,242}:root{--color-bg-gray-light-3-rgb:234,234,234}:root{--color-bg-gray-light-2-rgb:204,204,204}:root{--color-bg-gray-light-1-rgb:184,184,184}:root{--color-bg-gray-rgb:102,102,102}:root{--color-bg-gray-light-rgb:191,191,191}:root{--color-bg-white-rgb:255,255,255}:root{--color-bg-yellow-rgb:238,230,66}:root{--color-bg-yellow-light-rgb:255,253,217}:root{--color-bg-red-rgb:236,66,66}:root{--color-bg-red-light-rgb:255,217,217}:root{--color-bg-orange-rgb:237,148,66}:root{--color-bg-orange-light-rgb:255,235,217}:root{--color-bg-teal-rgb:66,227,237}:root{--color-bg-teal-light-rgb:204,252,255}:root{--color-bg-purple-rgb:109,66,237}:root{--color-bg-purple-light-rgb:236,229,255}:root{--color-bg-green-rgb:66,237,145}:root{--color-bg-green-light-rgb:204,255,228}:root{--color-bg-placeholder-light-rgb:241,241,241}:root{--color-bg-placeholder-dark-rgb:0,0,0}:root{--max-width:1920px;--column-count:12;--gutter-cap:36px;--gutter-x:24px;--gutter-y:40px;--page-content-max-width:1280px;--page-content-shell-max-width:calc(var(--page-content-max-width) + (var(--gutter-cap)*2));--social-feed-max-width:800px;--social-feed-grid-gap:24px;--text-current:#fff;--bg-current:#121212}:root{--reduced-motion:1}:root{--core-header-outer-padding:calc(var(--gutter-cap)*.5);--core-header-hamburger-padding-right:23px;--core-header-hamburger-svg-trim:4px;--core-header-inner-padding-y:13px;--core-header-inner-padding-x-left:var(--core-header-inner-padding-y);--core-header-inner-padding-x-right:calc(var(--core-header-hamburger-padding-right) - var(--core-header-hamburger-svg-trim));--core-header-logo-height:32px;--core-header-control-height:36px;--core-header-inner-height:calc((var(--core-header-inner-padding-y)*2) + max(var(--core-header-logo-height),var(--core-header-control-height)));
66--core-header-height:calc((var(--core-header-outer-padding)*2) + var(--core-header-inner-height));--core-header-pill-radius:9999px;--core-header-avatar-indicator-ring:var(--bg-current);--core-header-shadow:0 10px 6px 0 rgba(0,0,0,.06);--core-header-shadow-dark:0 4px 10px rgba(0,0,0,.4);--core-header-glass-tint-rgb:255 255 255;--core-header-glass-tint-alpha:1;--core-header-glass-highlight-alpha:.7;--core-header-glass-border-alpha:.2;--core-header-glass-backdrop-blur:2px;--core-header-glass-saturate:1.2;--core-header-glass-contrast:1.15;--core-header-glass-shadow-y:6px;--core-header-glass-shadow-blur:10px;--core-header-glass-shadow-alpha:.12;--core-header-glass-sheen-opacity:0;--core-header-glass-sheen-highlight-opacity:max(var(--core-header-glass-sheen-opacity),0);--core-header-glass-sheen-shade-opacity:max(calc(var(--core-header-glass-sheen-opacity)*-1),0);--core-header-glass-fallback-blur:3px;--core-header-glass-fallback-opacity:.25;--core-header-glass-fallback-edge-alpha:.5;--core-header-glass-fallback-edge-shadow-alpha:.5;--core-header-glass-fallback-edge-size:12px;--core-header-glass-liquid-scale:30;--core-header-glass-chromatic-aberration:.4;--core-header-glass-map-depth:1;--core-header-glass-map-edge-waist:.5;--core-header-glass-map-edge-x:1.5;--core-header-glass-map-edge-y:.45;--core-header-glass-map-center-inset-x:.9;--core-header-glass-map-center-inset-y:.55;--core-header-glass-map-center-blur:.2;--core-header-glass-map-center-opacity:1;--core-header-hover-intent:.1s}.core-header-slot{position:relative;flex-shrink:0;height:var(--core-header-height)}.core-header{position:fixed;top:0;left:0;right:0;z-index:2000;width:100%;padding:var(--core-header-outer-padding) var(--gutter-cap);color:var(--text-current);transform:translate3d(0,var(--core-header-scroll-shift,0),0);backface-visibility:hidden}@media (prefers-reduced-motion:no-preference){html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .btn-mobile-nav,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .core-header-pill,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .core-logo-container,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .core-nav-list-primary>li:not(.is-empty),html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .okaydev-navbar-auth-root,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .okaydev-navbar-leading-root{visibility:hidden}}body[data-header-theme=purple] .core-header .header-backdrop{opacity:1}body[data-header-theme=purple] .core-header-pill{box-shadow:var(--core-header-shadow)}body[data-header-theme=purple] .core-header{--core-header-avatar-indicator-ring:#6d42ed;color:#fff}body[data-header-theme=purple] .core-header .btn-mobile-nav,body[data-header-theme=purple] .core-header .core-nav-list-primary a.label-1,body[data-header-theme=purple] .core-header .sign-in a.label-1{color:#fff}body[data-header-theme=purple] .core-header .core-nav a.btn-core-sign-up{--btn-core-sign-up-bg:#fff;--btn-core-sign-up-fg:#0c0c0c;--btn-core-sign-up-hover-bg:#0c0c0c;--btn-core-sign-up-hover-fg:#fff}body[data-header-theme=purple] .core-header .header-backdrop{background-color:#6d42ed}body.is-dark{--core-header-glass-tint-rgb:12 12 12;--core-header-glass-tint-alpha:1;--core-header-glass-highlight-alpha:0;--core-header-glass-saturate:1.2;--core-header-glass-contrast:1.15;--core-header-glass-shadow-y:6px;--core-header-glass-shadow-blur:10px;--core-header-glass-shadow-alpha:.45;--core-header-glass-sheen-opacity:-1;--core-header-glass-liquid-scale:20;--core-header-glass-chromatic-aberration:.7;--core-header-glass-map-depth:1;--core-header-glass-map-edge-waist:.5;--core-header-glass-map-edge-y:.8;--core-header-glass-map-center-inset-y:.4}.core-header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--gutter-x);position:relative;width:100%;max-width:var(--page-content-max-width);margin-inline:auto;min-height:var(--core-header-inner-height);padding:var(--core-header-inner-padding-y) var(--core-header-inner-padding-x-right) var(--core-header-inner-padding-y) var(--core-header-inner-padding-x-left);border-radius:0;box-shadow:none;overflow:visible}.core-header-pill{--core-header-pill-cap-size:calc(var(--core-header-inner-height)/2);position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:flex;align-items:stretch;width:100%;max-width:none;border-radius:var(--core-header-pill-radius);box-shadow:none;transform:translateZ(0)}.core-header-pill-cap{flex:0 0 var(--core-header-pill-cap-size);width:var(--core-header-pill-cap-size);min-width:var(--core-header-pill-cap-size)}.core-header-pill-mid{flex:1 1 auto;min-width:0}@media (min-width:1101px){:root{--core-header-inner-padding-y:10px;--core-header-inner-padding-x-left:12px;--core-header-inner-padding-x-right:calc(var(--core-header-hamburger-padding-right) - var(--core-header-hamburger-svg-trim))}.core-header-inner{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);align-items:center;gap:0}.core-header .core-logo-container{grid-area:1/1;justify-self:start}.core-header .core-nav{grid-area:1/1;width:100%;position:static}}.core-header .header-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;border-radius:inherit;opacity:0;transform:translateZ(0);-webkit-backdrop-filter:none;backdrop-filter:none;background-color:transparent;will-change:transform,opacity}.core-header .core-logo-container{flex-shrink:0;position:relative;z-index:3}.core-header .core-logo-link{display:flex;align-items:center;border-radius:2px;color:var(--text-current);position:relative;z-index:1;touch-action:manipulation}.core-logo-brand-menu{position:absolute;top:calc(100% + 14px);left:-8px;z-index:20;width:min(304px,100vw - var(--gutter-cap)*2);color:#eaeaea;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;visibility:hidden;will-change:transform}.core-logo-brand-menu__surface{position:relative;border:1px solid #333;border-radius:14px;background:#161616;box-shadow:0 14px 36px rgba(0,0,0,.42)}.core-logo-brand-menu__content{max-height:calc(100dvh - var(--core-header-height) - 28px);overflow-x:hidden;overflow-y:auto;padding:8px;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}.core-logo-brand-menu__content::-webkit-scrollbar{display:none}.core-logo-brand-menu__label,.core-logo-brand-menu__title{margin:0;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-weight:400;text-transform:uppercase}.core-logo-brand-menu__heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 8px;color:inherit;text-decoration:none}.core-logo-brand-menu__heading:after{content:none}.core-logo-brand-menu__title{padding:0;color:#fff;font-size:14px;letter-spacing:.08em}.core-logo-brand-menu__page{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:16px;height:16px;border:1px solid #525252;border-radius:50%;color:#b8b8b8;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:10px;font-weight:700;line-height:1;text-decoration:none}.core-logo-brand-menu__page:after{content:none}.core-logo-brand-menu__group{border-top:1px solid #303030;padding-top:6px}.core-logo-brand-menu__group+.core-logo-brand-menu__group{margin-top:6px}.core-logo-brand-menu__label{padding:2px 6px 5px;color:#b8b8b8;font-size:12px;letter-spacing:.09em}.core-logo-brand-menu__toggle{display:flex;align-items:center;gap:8px;width:100%;border:0;border-radius:8px;padding:4px 2px;color:#b8b8b8;background:0 0;text-align:left}.core-logo-brand-menu__toggle .core-logo-brand-menu__label{flex:1;padding:0}.core-logo-brand-menu__chevron{display:grid;place-items:center;flex-shrink:0;width:14px;
66height:14px;margin-inline:4px 0;will-change:transform}.core-logo-brand-menu__chevron svg{display:block;width:100%;height:100%}.core-logo-brand-menu__assets{padding-block:4px}.core-logo-brand-menu__asset{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:40px;border-radius:8px;padding:2px 4px 2px 2px;color:#eaeaea;font-size:12px;font-weight:600;line-height:1.1}.core-logo-brand-menu__actions{display:flex;gap:4px}.core-logo-brand-menu__actions a{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:26px;border:1px solid #525252;border-radius:6px;padding-inline:5px;color:#ccc;background:#222;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:8px;font-weight:400;letter-spacing:.04em;text-decoration:none}.core-logo-brand-menu__actions a:after{content:none}.core-logo-brand-menu__preview{display:grid;place-items:center;width:36px;height:36px;border-radius:6px;padding:4px;overflow:hidden}.core-logo-brand-menu__preview img{display:block;width:100%;height:100%;object-fit:contain}.core-logo-brand-menu__preview--light{background:#f2f2f2}.core-logo-brand-menu__preview--purple{background:#6d42ed}.core-logo-brand-menu__preview--dark{background:#0c0c0c}.core-logo-brand-menu__footer{display:flex;gap:8px;margin-bottom:8px;padding-bottom:8px}.core-logo-brand-menu__kit{min-width:0;flex:1 1 auto;display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:center;text-align:center;gap:8px;min-height:40px;border-radius:999px;padding:9px 8px 9px 12px;color:#0c0c0c;background:#eee642;font-size:12px;font-weight:650;line-height:1;text-decoration:none;white-space:nowrap;will-change:transform}.core-logo-brand-menu__kit:after{content:none}.core-logo-brand-menu__kit span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;color:#fff;background:#0c0c0c;font-size:15px;will-change:transform}.core-logo-brand-menu__kit--guidelines{flex:0 0 auto;color:#fff;background:#6d42ed;will-change:transform}.core-logo-brand-menu__kit--guidelines span{padding-bottom:2px;color:#0c0c0c;background:#fff;will-change:transform}.core-logo-brand-menu .core-logo-brand-menu__surface{opacity:0;visibility:hidden;filter:blur(2px);transform:scale(.98) translateY(-8px);transform-origin:center center;visibility:visible;will-change:transform,opacity}@media (prefers-reduced-motion:reduce){:root{--reduced-motion:0}.core-logo-brand-menu__surface{animation-duration:NaNs!important;filter:none!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}.core-header .logo-name{--logo-fill-outer:#0c0c0c;--logo-fill-inner:#eee642;display:inline-flex;width:auto;height:var(--core-header-logo-height)}.core-header .logo-name svg{width:auto;height:100%;overflow:visible}.core-header .logo-name svg path{will-change:transform}.core-header .logo-name .logo-letter{transform-box:fill-box;transform-origin:center;will-change:transform}.core-header .logo-name .logo-letter-face{will-change:transform}body.is-dark .core-header .logo-name{--logo-fill-outer:#fff;--logo-fill-inner:#0c0c0c}body[data-header-theme=purple] .core-header .logo-name{--logo-fill-outer:#0c0c0c;--logo-fill-inner:#eee642}body:not([data-page=social]):not([data-page=gallery]) .social-feed-top-button{display:none!important}.social-feed-top-button{position:absolute;top:100%;left:50%;margin-top:8px;z-index:2100;display:inline-flex;align-items:center;gap:2px;padding:6px 12px;border-radius:999px;border:0;background-color:#6d42ed;color:#fff;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:.8125rem;letter-spacing:.04em;text-transform:uppercase;opacity:0;transform:translate(-50%,-8px);will-change:transform,opacity}.social-feed-top-button[hidden]{display:none}.social-feed-top-button-icon{display:inline-flex;width:18px;height:18px}.social-feed-top-button-icon svg{width:100%;height:100%}
66.social-feed-top-button-icon svg path{fill:currentColor}.social-feed-top-button-spinner{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;opacity:0}:root{--core-nav-user-menu-shadow:0 18px 48px rgba(0,0,0,.16)}.core-nav{display:flex;align-items:center;flex:1 1 auto;min-width:0;width:100%;text-transform:uppercase;position:relative;z-index:2}.core-nav a{display:flex;padding:0 8px;align-items:center;gap:6px;position:relative;border-radius:4px;color:var(--text-current)}.btn-mobile-nav{margin:0;padding:0;border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;display:none;align-items:center;justify-content:center;color:var(--text-current);background-color:transparent!important}.btn-mobile-nav .mobile-nav-toggle-icon{display:block;position:relative;width:24px;height:24px}.btn-mobile-nav .mobile-nav-toggle-line{position:absolute;top:50%;left:50%;display:block;width:19px;height:2px;margin-top:-.5px;margin-left:-9.5px;border-radius:999px;background-color:currentColor;transform-origin:center center;will-change:transform,opacity}.btn-mobile-nav .mobile-nav-toggle-line-top{transform:translateY(-3.5px)}.btn-mobile-nav .mobile-nav-toggle-line-middle{opacity:0}.btn-mobile-nav .mobile-nav-toggle-line-bottom{transform:translate(-2.85px,3.5px) scaleX(.7);transform-origin:center center}body[data-header-theme=purple] .core-header .core-nav-list-primary a.label-1{color:#fff}.core-nav-list{display:flex;align-items:center;justify-content:space-between;width:100%;margin:0}.core-nav-list .sign-in,.core-nav-list .sign-up,.core-nav-list li{flex-shrink:0}.core-nav-list-primary{display:flex;align-items:center;width:100%;margin:0}.core-nav-list-primary>li{margin-left:1.2vw}.core-nav-list-link-row{display:contents}@media (max-width:1100px){:root{--core-header-inner-padding-y:8px;--core-header-inner-padding-x-left:12px;--core-header-inner-padding-x-right:calc(var(--core-header-hamburger-padding-right) - var(--core-header-hamburger-svg-trim));--core-header-logo-height:28px}.core-nav-link-roll>span:last-child{display:none}}@media (min-width:1101px){.core-nav{position:static}.core-nav-list-primary,.okaydev-navbar-auth-root{--core-nav-primary-link-font-size:14px;--core-nav-primary-link-hover-font-size:15px;--core-nav-primary-link-roll-duration:.24s;--core-nav-primary-link-roll-stagger:.04s}.core-nav-link-roll{display:inline-grid;align-items:center;justify-items:center;overflow:hidden;vertical-align:bottom;font-size:var(--core-nav-primary-link-hover-font-size);line-height:1}.core-nav-link-roll>span{grid-area:1/1;transform-origin:center;will-change:transform}.core-nav-link-roll>span:first-child{font-size:calc(var(--core-nav-primary-link-font-size)/var(--core-nav-primary-link-hover-font-size)*1em)}.core-nav-link-roll>span:last-child{font-size:1em;transform:translateY(100%)}.core-nav-list-primary a.label-1,.okaydev-navbar-auth-root .sign-in a.label-1{display:inline-block;padding:8px 12px}.core-nav{--core-nav-current-user-gap:4px;--core-nav-avatar-menu-icon-box:24px;--core-nav-avatar-menu-svg-size:20px;--core-nav-avatar-adjacent-visual-gap:calc(var(--core-nav-current-user-gap) + (var(--core-nav-avatar-menu-icon-box) - var(--core-nav-avatar-menu-svg-size))/2 + var(--core-nav-avatar-menu-svg-size)*3.5/24)}.core-nav-list{position:static;justify-content:flex-end}.core-nav-list-primary{flex:0 1 auto;min-width:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);justify-content:center;width:max-content;margin:0;z-index:1}.core-nav-list-primary>li{margin-left:max(4px,1.2vw - 8px)}.okaydev-navbar-auth-root{position:relative;z-index:3}.okaydev-navbar-auth-root.is-navbar-auth-guest{margin-right:calc(var(--core-header-inner-padding-y) - var(--core-header-inner-padding-x-right))}.core-nav-list-pricing{position:relative}.core-nav-list-pricing .okaydev-nav-go-pro-mount{position:absolute;top:50%;left:calc(100% + 12px);transform:translateY(-50%)}}.core-nav a.btn-core-sign-up{border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
66font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:22px;background-color:var(--text-current);overflow:hidden;padding:0 15px 0 20px;color:var(--bg-current);--btn-core-sign-up-bg:var(--text-current);--btn-core-sign-up-fg:var(--bg-current);--btn-core-sign-up-hover-bg:#6d42ed;--btn-core-sign-up-hover-fg:#fff;position:relative;isolation:isolate;margin:0 0 0 8px;color:var(--btn-core-sign-up-fg);background-color:var(--btn-core-sign-up-bg);will-change:transform}.core-nav a.btn-core-sign-up svg path{fill:var(--bg-current);will-change:transform}.core-nav a.btn-core-sign-up:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;border-radius:inherit;background-color:var(--btn-core-sign-up-hover-bg);opacity:0;will-change:transform,opacity}.core-nav a.btn-core-sign-up svg path{fill:var(--btn-core-sign-up-fg);will-change:transform}.core-nav-list-primary .core-nav-list-add-project{display:none}.mobile-content-cover{display:none}@media (max-width:1100px){.core-nav{--core-nav-mobile-gutter-cap:12px;--core-nav-mobile-gutter-x:16px;--core-nav-mobile-gutter-y:14px;--core-nav-mobile-links-top:18px;--core-nav-mobile-links-row-gap:calc(var(--core-nav-mobile-gutter-y)*1.5);--core-nav-mobile-content-inline:calc(var(--core-nav-mobile-gutter-cap) + var(--core-nav-mobile-gutter-x));--core-nav-mobile-content-max-width:430px;--core-nav-mobile-panel-bg:#0c0c0c;--core-nav-mobile-account-bg:#121212;--core-nav-mobile-auth-section-gap:26px;--core-nav-mobile-user-menu-row-gap:15px;--core-nav-mobile-panel-height:calc(100dvh - var(--core-header-height,60px));justify-content:flex-start;align-items:center;gap:8px}.core-nav .okaydev-navbar-leading-root{order:1;display:flex;align-items:center;justify-content:flex-end;flex:1 1 auto;min-width:0;width:auto;position:relative;z-index:3}.core-nav .okaydev-navbar-leading-root>:is(.dynamic-block,.servd-dynamic-stale-preview){display:flex;align-items:center;justify-content:flex-end;flex:1 1 auto;min-width:0;width:100%}.core-nav a{padding-left:0;padding-right:0}.core-header .core-nav .mobile-content-cover{display:none;position:fixed;top:var(--core-header-height,60px);left:0;z-index:1998;width:100%;height:var(--core-nav-mobile-panel-height);background-color:transparent}.btn-mobile-nav{display:flex;order:2;flex-shrink:0;position:relative;z-index:3}.core-header .core-nav .core-nav-list{display:flex;flex-wrap:nowrap;align-content:flex-start;justify-content:flex-start;position:fixed;top:var(--core-header-height,60px);left:0;z-index:1999;width:100%;height:var(--core-nav-mobile-panel-height);max-height:var(--core-nav-mobile-panel-height);min-height:0;--text-current:#fff;--bg-current:var(--core-nav-mobile-panel-bg);color:var(--text-current);background-color:transparent;color-scheme:dark;overflow-x:clip;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;padding-top:var(--core-nav-mobile-links-top);visibility:hidden;opacity:0;transform:scale(.97);transform-origin:center top;isolation:isolate}.core-header .core-nav .core-nav-list a:not(.button):not(.btn-core-sign-up):not(.btn-core-login):not(.btn-core-add-project):not(.memberships-cta):not(.name):not(.username){color:var(--text-current)}.core-header>.core-nav-mobile-panel-bg{position:fixed;top:0;left:0;z-index:0;display:block;width:100%;height:100lvh;background:linear-gradient(180deg,color-mix(in srgb,#6d42ed 12%,#0c0c0c) 0,var(--core-nav-mobile-panel-bg,#0c0c0c) 18%,var(--core-nav-mobile-panel-bg,#0c0c0c) 100%);transform:scaleY(0);transform-origin:center top;opacity:0}.core-header .core-nav .core-nav-list ul.core-nav-list-primary{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--core-nav-mobile-gutter-x);row-gap:var(--core-nav-mobile-links-row-gap);align-items:start;flex-shrink:0;width:100%;max-width:calc(var(--core-nav-mobile-content-max-width) + var(--core-nav-mobile-content-inline)*2);margin-left:auto;margin-right:auto;padding-left:var(--core-nav-mobile-content-inline);padding-right:var(--core-nav-mobile-content-inline)}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li{width:auto;min-width:0;margin-top:0;margin-left:0}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-social{grid-column:1;grid-row:1}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-projects{grid-column:2;grid-row:1}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-directory{grid-column:1;grid-row:2}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-articles{grid-column:2;grid-row:2}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-jobs{grid-column:1;grid-row:3}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-pricing{grid-column:2;grid-row:3}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li>
66.core-nav-list-link-row>a.label-1{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-weight:900;font-style:normal;font-size:clamp(36px,3.5vw,63px);font-feature-settings:"dlig" on,"ss11" on,"ss09" on,"ss08" on,"ss05" on,"ss07" on,"ss06" on,"ss03" on,"case" on;line-height:.98;letter-spacing:-.48px;font-size:24px;height:auto;text-transform:none}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-link-row{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:var(--core-nav-mobile-gutter-x);width:100%}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-pricing .core-nav-list-link-row{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:calc(var(--core-nav-mobile-gutter-x)*.75);width:100%}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-pricing .okaydev-nav-go-pro-mount{position:static;top:auto;left:auto;transform:none;flex-shrink:0}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-add-project{display:none}.sign-up{order:2}.core-nav a.btn-core-sign-up{margin-left:0}.sign-in{order:3;display:flex;align-items:center;height:42px;margin-left:var(--core-nav-mobile-gutter-x)}.okaydev-navbar-auth-root{position:relative;z-index:1;isolation:isolate;padding-left:var(--core-nav-mobile-content-inline);padding-right:var(--core-nav-mobile-content-inline)}.okaydev-navbar-auth-root.is-navbar-auth-guest{margin-top:40px}.core-nav-mobile-account-bg,.core-nav-mobile-account-divider{position:absolute;display:block}.core-nav-mobile-account-bg{z-index:0;top:0;right:0;bottom:0;left:0;background-color:var(--core-nav-mobile-account-bg);opacity:0}
66.core-nav-mobile-account-divider{z-index:1;top:0;left:0;width:100%;height:1px;background-color:#222;opacity:0;transform:scaleX(0);transform-origin:center center}.okaydev-navbar-auth-root>:not(.core-nav-mobile-account-bg):not(.core-nav-mobile-account-divider){position:relative;z-index:2}.okaydev-navbar-auth-root.is-navbar-auth-guest{display:flex;flex-wrap:nowrap;column-gap:var(--core-nav-mobile-gutter-x);align-items:center;justify-content:flex-start;align-self:stretch;width:100%;max-width:calc(var(--core-nav-mobile-content-max-width) + var(--core-nav-mobile-content-inline)*2);margin-left:auto;margin-right:auto}.okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-mobile-account-bg{background-color:transparent}.okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-mobile-account-divider{display:none}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{order:1;display:flex;justify-content:flex-start;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2)}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up .btn-core-sign-up{width:max-content;min-width:0;padding-left:16px;padding-right:12px}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{order:2;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2);margin-left:0}body[data-header-theme=purple] .core-header .btn-mobile-nav{color:#fff;background-color:transparent!important}body[data-header-theme=purple] .core-header .mobile-nav-toggle-line{background-color:#fff}}@media (max-width:1100px) and (min-width:768px){.core-nav-list-primary>li{margin-left:0}}.okaydev-nav-go-pro-mount{display:inline-flex;align-items:baseline;min-width:0}.navbar-pricing-go-pro-ph{display:none}.okaydev-navbar-leading-root{display:flex;align-items:center;min-width:0}@media (min-width:1101px){.core-nav a.btn-core-sign-up{height:var(--btn-core-add-project-size,36px);padding-left:16px;padding-right:12px;border-radius:9999px}.okaydev-navbar-leading-root{display:none}}.okaydev-navbar-auth-root{display:flex;align-items:center;min-width:0;width:100%}@media (max-width:1100px){.okaydev-navbar-auth-root.is-navbar-auth-guest{display:flex;flex-wrap:nowrap;column-gap:var(--core-nav-mobile-gutter-x);align-items:center;justify-content:flex-start;align-self:stretch;width:100%}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{order:1;display:flex;justify-content:flex-start;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2)}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up .btn-core-sign-up{width:max-content;min-width:0;padding-left:16px;padding-right:12px}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{order:2;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2);margin-left:0}}@media (min-width:1101px){.okaydev-navbar-auth-root{flex:0 0 auto;width:auto}}.core-nav-guest-extra{display:none}@media (max-width:1100px){.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest{display:grid;grid-template-columns:max-content minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:12px;flex:1 0 auto;align-items:start;padding-bottom:24px}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{order:1}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{order:2}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up>a.btn-core-sign-up{--btn-core-sign-up-bg:#42ed91;--btn-core-sign-up-fg:#0c0c0c}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in>a.btn-core-login{margin:0;border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:22px;padding:0 25px;color:var(--bg-current);background-color:var(--text-current);overflow:hidden;width:max-content;padding-inline:16px;color:#0c0c0c;background-color:#fff;will-change:transform}.core-nav .core-nav-guest-extra{display:flex;flex-direction:column;grid-column:1/-1;align-self:stretch;position:relative;order:3;flex:0 0 100%;margin-top:28px;padding-top:24px;border-top:1px solid rgba(255,255,255,.15)}.core-nav .core-nav-guest-extra ul{position:static;display:flex;flex-wrap:wrap;width:100%;margin:0;padding:0;gap:16px 24px;list-style:none}.core-nav .core-nav-guest-extra .core-nav-guest-secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--core-nav-mobile-gutter-x);text-transform:none}.core-nav .core-nav-guest-extra .core-nav-guest-social-nav{margin-top:auto;padding-top:24px}.core-nav .core-nav-guest-extra .core-nav-guest-social-eyebrow{margin:0 0 14px;color:rgba(255,255,255,.6);letter-spacing:.08em}.core-nav .core-nav-guest-extra .core-nav-guest-social a{display:flex;align-items:center;min-height:32px}
66.core-nav .core-nav-guest-extra .core-nav-guest-social svg{display:block;width:22px;height:22px}.core-nav .core-nav-guest-extra .core-nav-guest-social .bento-social-mark--instagram{transform:scale(1.25)}}@media (min-width:640px) and (max-width:1100px) and (orientation:landscape){.core-header .core-nav .core-nav-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto auto;gap:24px;align-items:start;padding-block:24px;padding-left:max(var(--gutter-cap),(100% - var(--page-content-max-width))/2,env(safe-area-inset-left));padding-right:max(var(--gutter-cap),(100% - var(--page-content-max-width))/2,env(safe-area-inset-right))}.core-header .core-nav .core-nav-list ul.core-nav-list-primary{grid-column:1/3;grid-row:1;max-width:none;margin:0;padding:0;column-gap:24px}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest{grid-column:1/-1;grid-row:1/3;grid-template-columns:subgrid;grid-template-rows:subgrid;gap:24px;max-width:none;margin:0;padding:0}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{grid-column:1;grid-row:2}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{grid-column:2;grid-row:2}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in,.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{align-self:end}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra{grid-column:3/5;grid-row:1/3;min-width:0;margin-top:0;padding-top:0;padding-left:24px;border-top:0;border-left:1px solid rgba(255,255,255,.15)}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest){grid-template-rows:repeat(3,auto) auto}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) ul.core-nav-list-primary{grid-row:1/4;grid-template-rows:subgrid;row-gap:normal;align-items:baseline}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) ul.core-nav-list-primary .core-nav-list-link-row{align-items:baseline}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest{grid-row:1/5}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in,.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{grid-row:4}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra{display:grid;grid-row:1/5;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:subgrid}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra .core-nav-guest-secondary,.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra>nav:first-child{display:grid;grid-column:1/-1;grid-row:1/4;grid-template-columns:subgrid;grid-template-rows:subgrid;row-gap:normal;align-items:baseline}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra .core-nav-guest-social-nav{grid-column:1/-1;grid-row:4;align-self:end;margin-top:0;padding-top:0}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra .core-nav-guest-social a{align-items:center;min-height:42px}}.app-toolbar{--app-toolbar-inset-left:max(12px,var(--app-safe-left,0px));--app-toolbar-inset-right:max(12px,var(--app-safe-right,0px));--app-toolbar-surface:rgb(28 28 30/72%);--app-toolbar-knockout:#1c1c1e;--app-toolbar-hairline:rgb(255 255 255/10%);--app-toolbar-fg:rgb(255 255 255/60%);--app-toolbar-fg-active:#fff;--app-toolbar-highlight:rgb(255 255 255/11%);--app-toolbar-shadow:0 12px 32px rgb(0 0 0/45%),0 2px 8px rgb(0 0 0/30%);--app-toolbar-dot:#af;--app-toolbar-dot-glow:0 0 5px 1px rgb(140 105 255/90%),0 0 14px 4px rgb(109 66 237/65%)}.app-toolbar{position:fixed;right:0;bottom:var(--app-toolbar-bottom,12px);left:0;z-index:2000;width:calc(100% - var(--app-toolbar-inset-left) - var(--app-toolbar-inset-right));max-width:440px;margin:0 auto;will-change:transform,opacity}.app-toolbar-list{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;align-items:center;height:var(--app-toolbar-height,60px);margin:0;padding:0 4px;list-style:none;border-radius:9999px;background:var(--app-toolbar-surface);box-shadow:var(--app-toolbar-shadow),inset 0 0 0 1px var(--app-toolbar-hairline);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%)}.app-toolbar-item{display:flex;justify-content:center;min-width:0;margin:0}.app-toolbar-tab{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:calc(var(--app-toolbar-height,60px) - 8px);margin:0;padding:0;border:0;border-radius:9999px;background:0 0;font:inherit;text-decoration:none;-webkit-appearance:none;appearance:none;touch-action:manipulation}.app-toolbar-tab{flex-direction:column;gap:3px;padding-top:6px;color:var(--app-toolbar-fg);will-change:transform}.app-toolbar-tab:before{content:"";position:absolute;top:1px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--app-toolbar-dot);box-shadow:var(--app-toolbar-dot-glow);opacity:0;transform:translate3d(0,3px,0) scale(.2);will-change:transform,opacity}.app-toolbar-icon{position:relative;display:grid;place-items:center;width:26px;height:26px}.app-toolbar-glyph{display:block;width:24px;height:24px;overflow:visible}.app-toolbar-glyph circle,.app-toolbar-glyph path{will-change:transform}.app-toolbar-glyph--social .app-toolbar-glyph-disc{fill:transparent;stroke:var(--app-toolbar-fg)}
66.app-toolbar-glyph--social .app-toolbar-glyph-mark{fill:var(--app-toolbar-fg)}.app-toolbar-label{position:relative;max-width:100%;margin-block:-.2em;padding-block:.2em;overflow:hidden;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-size:10.5px;font-weight:500;line-height:1;letter-spacing:.01em;white-space:nowrap;text-overflow:ellipsis}.app-toolbar{--app-sheet-surface:rgb(28 28 30/94%);--app-sheet-card:#2c2c2e;--app-sheet-outline:rgb(255 255 255/22%)}.app-logo{--app-logo-shade:#fff;--app-logo-fill:#0c0c0c;position:relative;z-index:2;justify-content:center;height:100%;padding:var(--app-logo-top) var(--app-logo-gutter) var(--app-logo-gutter)}.app-logo-link{display:block;border-radius:4px;touch-action:manipulation;will-change:transform}.app-logo-mark{display:block;height:var(--app-logo-height);width:auto;aspect-ratio:1483/276}.app-logo-fill,.app-logo-shade{will-change:transform}.app-logo-shade{fill:var(--app-logo-shade)}.app-logo-fill{fill:var(--app-logo-fill)}.app-status-tint{display:none;position:fixed;top:0;right:0;left:0;z-index:3;height:var(--app-status-tint-height,12px);background-color:var(--bg-current)}:is([data-handle=login],[data-handle=forgotPassword],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=editProfile],[data-handle=managePortfolio],[data-handle=manageTeam],[data-handle=membership],[data-handle=thankYou],[data-handle=accountSettings],[data-handle=accountNotifications],[data-handle=accountSettingsBusiness],[data-handle=notifications],[data-handle=about],[data-handle=faqs],[data-handle=contact],[data-handle=communityGuidelines],[data-handle=legal]){position:relative;background:0 0}:is([data-handle=login],[data-handle=forgotPassword],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=editProfile],[data-handle=managePortfolio],[data-handle=manageTeam],[data-handle=membership],[data-handle=thankYou],[data-handle=accountSettings],[data-handle=accountNotifications],[data-handle=accountSettingsBusiness],[data-handle=notifications],[data-handle=about],[data-handle=faqs],[data-handle=contact],[data-handle=communityGuidelines],[data-handle=legal])>.page-container{position:relative;z-index:1}.auth-shell-bg{position:absolute;top:calc(-1*var(--core-header-height));right:0;bottom:-100vmax;left:0;z-index:0;overflow:hidden;background-color:var(--bg-current)}:is([data-handle=login],[data-handle=forgotPassword],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=errorpage],[data-handle=errorpage-404],[data-handle=errorpage-503]) .auth-shell-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background:linear-gradient(to right,transparent 0,color-mix(in srgb,var(--bg-current) 28%,transparent) 16%,color-mix(in srgb,var(--bg-current) 58%,transparent) 28%,color-mix(in srgb,var(--bg-current) 62%,transparent) 32%,color-mix(in srgb,var(--bg-current) 62%,transparent) 68%,color-mix(in srgb,var(--bg-current) 58%,transparent) 72%,color-mix(in srgb,var(--bg-current) 28%,transparent) 84%,transparent 100%)}.auth-shell-bg-shadow{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;mix-blend-mode:soft-light;opacity:.75}.auth-shell-bg-shadow img{width:100%;height:100%;object-fit:cover}.auth-shell-grid-lines{--grid-minor:40px;--grid-major:calc(var(--grid-minor)*5);position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' fill='none'%3E%3Cpath stroke='rgba(255,255,255,0.07)' stroke-width='1' stroke-dasharray='5 5' d='M20 0v200M60 0v200M140 0v200M180 0v200M0 20h200M0 60h200M0 140h200M0 180h200'/%3E%3C/svg%3E");background-size:var(--grid-major) var(--grid-major);background-position:center;background-repeat:repeat}.auth-shell-grid-lines:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-linear-gradient(to right,transparent 0 calc(var(--grid-major)/2 - .5px),rgba(255,255,255,.1) calc(var(--grid-major)/2 - .5px) calc(var(--grid-major)/2 + .5px),transparent calc(var(--grid-major)/2 + .5px) var(--grid-major)),repeating-linear-gradient(to bottom,transparent 0 calc(var(--grid-major)/2 - .5px),rgba(255,255,255,.1) calc(var(--grid-major)/2 - .5px) calc(var(--grid-major)/2 + .5px),transparent calc(var(--grid-major)/2 + .5px) var(--grid-major));background-size:var(--grid-major) 100%,100% var(--grid-major);background-position:center;background-repeat:repeat}.okay-dialog{--dialog-field-bg:color-mix(in srgb,var(--bg-current) 96%,var(--text-current));display:flex;align-items:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;border:none;background:0 0;outline:0;overflow:visible}@media (max-width:767px){:root{--column-count:6;--gutter-cap:12px;--gutter-x:16px;--gutter-y:14px}:root{--core-header-outer-padding:var(--gutter-cap)}.okay-dialog{padding:8px}}.dialog-content{display:flex;flex-direction:column;align-items:stretch;width:100%;max-width:555px;max-height:calc(100vh - var(--gutter-y)*2);border-radius:12px;margin:0;padding:0;font-size:16px;color:var(--text-current);background-color:var(--bg-current);box-shadow:0 25px 35px 5px rgba(0,0,0,.15);overflow-x:hidden;overflow-y:hidden;overscroll-behavior:contain}.dialog-content a{position:relative;z-index:1}.dialog-content p{color:var(--text-current)}.dialog-content p{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;font-size:16px}.dialog-content a{text-decoration:underline;color:var(--text-current);opacity:.75;will-change:transform,opacity}.dialog-content a:after{background-color:var(--text-current)}body.is-dark .okay-dialog:not([data-theme=light]){--dialog-field-bg:color-mix(in srgb,var(--bg-current) 88%,var(--text-current))}body.is-dark .dialog-content{box-shadow:0 25px 35px 5px rgba(0,0,0,.45)}.dialog-heading{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
66font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;display:flex;align-items:center;justify-content:space-between;width:100%;font-weight:500}.dialog-heading-content{display:inline-flex;align-items:center;gap:calc(var(--gutter-x)*.5);min-width:0}.dialog-heading-text{min-width:0}.dialog-footer,.dialog-header{width:100%;flex:0 0 auto;padding:14px 14px 14px 24px}.dialog-header{background-color:color-mix(in srgb,var(--text-current) 3%,#fff)}body.is-dark .dialog-header{background-color:color-mix(in srgb,var(--bg-current) 94%,#fff)}.dialog-header{border-bottom:1px solid color-mix(in srgb,var(--text-current) 8%,transparent)}@media (max-width:767px){.dialog-content{max-height:calc(100vh - 66px - var(--gutter-y)*8)}.dialog-header{padding:6px 6px 6px 12px}}.dialog-inner{width:100%;flex:1 1 auto;min-height:0;max-height:677px;overflow-y:auto;overscroll-behavior:contain;padding:18px 20px 18px 24px;scrollbar-gutter:stable}.dialog-footer{margin-top:auto;background-color:color-mix(in srgb,var(--text-current) 3%,#fff);border-top:1px solid color-mix(in srgb,var(--text-current) 8%,transparent);color:gray}body.is-dark .dialog-footer{background-color:color-mix(in srgb,var(--bg-current) 94%,#fff);border-top-color:color-mix(in srgb,#fff 12%,transparent)}.okay-dialog .dialog-content .dialog-footer :is(.button,button,input[type=submit],input[type=button]){font-size:13px}.okay-dialog .dialog-content .button:not(.btn-text){border:1px solid color-mix(in srgb,var(--text-current) 14%,transparent)}.okay-dialog{--dialog-chrome-bg:color-mix(in srgb,var(--text-current) 3%,#fff);--dialog-chrome-line:color-mix(in srgb,var(--text-current) 8%,transparent)}.okay-dialog .dialog-content{--panel-scroll-fade-bg:var(--bg-current);position:relative}.okay-dialog .dialog-content>.dialog-header{min-height:44px;padding:6px 6px 6px 14px;border-bottom-color:var(--dialog-chrome-line);background-color:var(--dialog-chrome-bg)}.okay-dialog .dialog-content>.dialog-footer{padding:10px 12px;border-top-color:var(--dialog-chrome-line);background-color:var(--dialog-chrome-bg)}.okay-dialog .dialog-footer .button{min-height:32px}.okay-dialog .dialog-heading{min-height:32px;font-size:12px;line-height:1}.okay-dialog .btn-close-dialog{flex:0 0 32px}.okay-dialog .dialog-content .button{font-size:12px}body.is-dark .okay-dialog:not([data-theme=light]){--dialog-chrome-bg:color-mix(in srgb,var(--bg-current) 94%,#fff);--dialog-chrome-line:color-mix(in srgb,#fff 14%,transparent)}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-actions{display:flex;justify-content:flex-end;gap:10px;width:100%;margin-top:0}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action{display:inline-flex;align-items:center;justify-content:center;min-width:0;border:none!important;border-radius:8px;height:auto;padding:8px 12px;font:inherit;font-size:12px;line-height:1;text-decoration:none;text-transform:uppercase;opacity:1;box-shadow:none;will-change:transform,opacity}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action:before{content:none}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action.is-secondary{background-color:color-mix(in srgb,var(--text-current) 15%,transparent);color:var(--text-current)}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action.is-primary{background-color:#42ed91;color:#0c0c0c}body.is-dark .okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action.is-secondary{background-color:#fff;color:#0c0c0c}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate{text-wrap:pretty}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate-image{display:block;width:100%;height:auto;aspect-ratio:1200/630;margin-bottom:18px;background-color:color-mix(in srgb,var(--text-current) 6%,transparent)}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate-image[hidden]{display:none}@media (max-width:767px){.dialog-inner{padding:16px}.dialog-footer{padding:6px}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate-image{margin-bottom:16px}}.btn-close-dialog{display:grid;place-content:center;position:relative;width:32px;height:32px;border:none;border-radius:8px;margin:0;padding:0;background-color:color-mix(in srgb,var(--text-current) 10%,transparent);color:var(--text-current)}
66.btn-close-dialog svg path{fill:currentColor}.okay-dialog .dialog-footer .button{-webkit-appearance:none;appearance:none;border:1px solid color-mix(in srgb,var(--text-current) 14%,transparent);border-radius:8px;height:auto;padding:8px 12px;font:inherit;font-size:12px;line-height:1;text-decoration:none;text-transform:uppercase;box-shadow:none;will-change:transform}body.is-dark .btn-close-dialog{background-color:color-mix(in srgb,#0c0c0c 72%,#fff);border-color:color-mix(in srgb,#fff 14%,transparent);color:#fff}@media (max-width:767px){.media-library-row>.media-library-cell:first-child{grid-area:check;align-self:stretch;display:flex;align-items:center;justify-content:center;margin-top:-8px;margin-right:-8px;margin-bottom:-8px;padding:12px;border-left:1px solid color-mix(in srgb,var(--text-current) 12%,transparent)}.media-library-row>.media-library-cell:nth-child(2){grid-area:preview;align-self:start}.media-library-row>.media-library-cell:nth-child(3){grid-area:name}.media-library-row>.media-library-cell:nth-child(4){grid-area:details}.media-library-row>.media-library-cell:nth-child(6){grid-area:used}}.okay-dialog[data-size=sm] .dialog-content{max-width:420px}.okay-dialog{visibility:visible;will-change:transform}.okay-dialog .dialog-content{opacity:0;visibility:hidden;filter:blur(2px);transform:scale(.98) translateY(20px);transform-origin:center center;visibility:visible;will-change:transform,opacity}@media (prefers-reduced-motion:reduce){.okay-dialog{animation-duration:NaNs!important;filter:none!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.okay-dialog .dialog-content{animation-duration:NaNs!important;filter:none!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}body.is-dark .okay-dialog:not([data-theme=light]){--editor-canvas:#f3f3f6;--editor-surface:#fff;--editor-field:#fff;--editor-ink:#262626;--editor-muted:#626262;--editor-line:#dedede;--editor-control:#fafafa;--editor-hover:#ededed;--editor-focus:#737373;--editor-control-line:#d4d4d4;--editor-line-hover:#a3a3a3;--editor-quiet:#f2f2f2;--editor-pressed:#e5e5e5;--editor-subtle-line:#c7c7c7;--editor-placeholder:#757575;--editor-disabled-ink:#858585;--editor-primary:#262626;--editor-primary-ink:#fff;--editor-primary-hover:#404040;--editor-table:#e7e7e9;--editor-table-ink:#333;--editor-row-hover:#f7f7f7;--editor-danger:#b42318;--editor-danger-line:#e0bcbc;--editor-danger-hover:#fcebea;--editor-drop-active:#e8f9ef;--editor-focus-shadow:rgb(64 64 64/12%);--editor-scheme:light;--editor-radius:10px;--editor-shadow:0 24px 64px rgb(24 24 24/20%),0 4px 16px rgb(24 24 24/10%);--text-current:var(--editor-ink);--bg-current:var(--editor-surface);--dialog-field-bg:var(--editor-field);--dialog-chrome-bg:var(--editor-surface);--dialog-chrome-line:var(--editor-line);color-scheme:var(--editor-scheme)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content{--panel-scroll-fade-bg:var(--editor-canvas);border:1px solid var(--editor-line);border-radius:var(--editor-radius);color:var(--editor-ink);background:var(--editor-canvas);box-shadow:var(--editor-shadow)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content>.dialog-header{min-height:56px;padding:9px 10px 9px 16px;background:var(--editor-surface)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-heading{min-height:36px;font-family:Aeonik,sans-serif;font-size:16px;font-weight:500;letter-spacing:0;line-height:1.25;text-transform:none}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-heading-content{gap:8px}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .btn-close-dialog{display:grid;flex:0 0 36px;place-items:center;width:36px;height:36px;border:1px solid var(--editor-control-line);border-radius:8px;padding:8px;color:var(--editor-muted);background:var(--editor-quiet);box-shadow:none}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .btn-close-dialog svg{width:18px;height:18px}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content>.dialog-footer{border-color:var(--editor-line);padding:12px;color:var(--editor-muted);background:var(--editor-surface)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .button:not(.btn-text){min-height:36px;border:1px solid var(--editor-control-line);border-radius:8px;padding:8px 12px;color:var(--editor-ink);background:var(--editor-control);box-shadow:none;font-family:Aeonik,sans-serif;font-size:12px;font-weight:500;letter-spacing:0;line-height:1.2;text-transform:none}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .dialog-footer :is(.button,button,input[type=submit],input[type=button]){font-size:13px}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .dialog-footer .is-primary{border-color:var(--editor-primary);color:var(--editor-primary-ink);background:var(--editor-primary)}body.is-dark .okay-dialog:not([data-theme=light]){--editor-canvas:#19191b;--editor-surface:#252527;--editor-field:#1e1e21;--editor-ink:#ededee;--editor-muted:#b0b0b6;--editor-line:#3f3f43;--editor-control:#2c2c2f;--editor-hover:#38383c;--editor-focus:#a4a4ad;--editor-control-line:#49494e;--editor-line-hover:#72727a;--editor-quiet:#303034;--editor-pressed:#414146;--editor-subtle-line:#55555c;--editor-placeholder:#93939b;--editor-disabled-ink:#797982;--editor-primary:#ededee;--editor-primary-ink:#19191b;--editor-primary-hover:#d1d1d6;--editor-table:#353539;--editor-table-ink:#dddde1;--editor-row-hover:#2c2c2f;--editor-danger:#ff9991;--editor-danger-line:#78433f;--editor-danger-hover:#442b2b;--editor-drop-active:#233d2e;--editor-focus-shadow:rgb(190 190 200/16%);--editor-scheme:dark;--editor-radius:10px;--editor-shadow:0 24px 64px rgb(0 0 0/48%),0 4px 16px rgb(0 0 0/32%)}.social-image-viewer-dialog{display:flex;align-items:stretch;justify-content:stretch;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:none;background:0 0;outline:0;overflow:hidden;opacity:0;visibility:visible;will-change:transform,opacity}.social-image-viewer-dialog__panel{position:relative;display:flex;flex-direction:column;width:100%;height:100%;background-color:#0c0c0c}.social-image-viewer-dialog__close.btn-close-dialog{position:absolute;top:calc(max(12px,env(safe-area-inset-top)) - 6px);right:calc(max(12px,env(safe-area-inset-right)) - 6px);z-index:3;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:0;color:#fff;background-color:transparent;opacity:.92;box-shadow:none;will-change:transform,opacity}
66.social-image-viewer-dialog__close.btn-close-dialog svg path{fill:currentColor}body.is-dark .social-image-viewer-dialog__close.btn-close-dialog{background-color:transparent;border-color:transparent;color:#fff}.social-image-viewer-dialog__thumbs{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));z-index:2;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 72px)}.social-image-viewer-dialog__viewport{position:relative;flex:1 1 auto;min-height:0;width:100%}.social-image-viewer-dialog__track{display:flex;height:100%;min-height:100%}.social-image-viewer-dialog__footer{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:2px;padding:6px max(12px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));color:#fff;background:linear-gradient(to top,#0c0c0c,rgba(12,12,12,0))}.social-image-viewer-dialog__pagination{display:flex;align-items:baseline;gap:.1em;margin:0;color:#666;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase}.social-image-viewer-dialog__pagination-sep{color:#525252}.social-image-viewer-dialog__pagination[hidden]{display:none}.social-image-viewer-dialog__title{width:100%;margin:0;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}</style>
66<script type="module">!function(){const e=document.createElement("link").relList;if(!(e&&e.supports&&e.supports("modulepreload"))){for(const e of document.querySelectorAll('link[rel="modulepreload"]'))r(e);new MutationObserver((e=>{for(const o of e)if("childList"===o.type)for(const e of o.addedNodes)if("LINK"===e.tagName&&"modulepreload"===e.rel)r(e);else if(e.querySelectorAll)for(const o of e.querySelectorAll("link[rel=modulepreload]"))r(o)})).observe(document,{childList:!0,subtree:!0})}function r(e){if(e.ep)return;e.ep=!0;const r=function(e){const r={};return e.integrity&&(r.integrity=e.integrity),e.referrerpolicy&&(r.referrerPolicy=e.referrerpolicy),"use-credentials"===e.crossorigin?r.credentials="include":"anonymous"===e.crossorigin?r.credentials="omit":r.credentials="same-origin",r}(e);fetch(e.href,r)}}();</script>
66
66<script>!function(){var e=document.createElement("script");if(!("noModule"in e)&&"onbeforeload"in e){var t=!1;document.addEventListener("beforeload",(function(n){if(n.target===e)t=!0;else if(!n.target.hasAttribute("nomodule")||!t)return;n.preventDefault()}),!0),e.type="module",e.src=".",document.head.appendChild(e),e.remove()}}();</script>
66
66<script src="https://okaydev.co/dist/assets/polyfills-legacy-BzKQwQQB.js" nomodule onload="e=new CustomEvent('vite-script-loaded', {detail:{path: 'vite/legacy-polyfills-legacy'}});document.dispatchEvent(e);" integrity="sha384-pH8N5ycuIq+ACzM6fhMz2e8UzeuN+j7PHg3PG6BlBNnbtcF5l0yREZ+Qz6Nz5cnB"></script>
66
66<script type="module" src="https://okaydev.co/dist/assets/app-BiaPDw27.js" crossorigin onload="e=new CustomEvent('vite-script-loaded', {detail:{path: 'src/js/app.js'}});document.dispatchEvent(e);" integrity="sha384-rc5tBKMHskM7eBhFEZPTGXy6OHE1v9kVH3CFceI2+biaB/epTvymjBWYPcAm/ON2"></script>
66 <link 67href="https://okaydev.co/dist/assets/HeaderLogoLetters-CMLHzChc.js" rel="modulepreload" crossorigin integrity="sha384-pjhTnwsDelDxaY6fqULoIHCayLxtTzRhoYqKTVaO+87m1qwAkztwnQjVugQ7c2/q"><link 68href="https://okaydev.co/dist/assets/refreshNavbarAuth-V-4DhXEm.js" rel="modulepreload" crossorigin integrity="sha384-0aZeN9dWGPf+9eV9pvZnoPI036VrIYihmPuUvMvWVuSHgtMqyKN6ftO7P1UMFRdR"><link 69href="https://okaydev.co/dist/assets/lazyDialog-CU88mIO4.js" rel="modulepreload" crossorigin integrity="sha384-vYPSV+cKPQU3zXSX+RzB5WHwKiBbt2oSUEe/pmXdy6rR9d2zYHnnXv0+qgCFZaQ8"><link 70href="https://okaydev.co/dist/assets/app-4P6e9Apm.css" rel="stylesheet"><link 71href="https://okaydev.co/dist/assets/HeaderLogoLetters-DngiwBoB.css" rel="stylesheet">
71<script src="https://okaydev.co/dist/assets/app-legacy-CcTcNDK7.js" nomodule onload="e=new CustomEvent('vite-script-loaded', {detail:{path: 'src/js/app-legacy.js'}});document.dispatchEvent(e);" integrity="sha384-w6ID9rdE1/PtnaIaIVSfmeV7xrtdYPWgWvY6pXl6WZ6mtzjOqN4HYDG8uDhC6xaJ"></script>
71 <!--# else -->
71<script>function setCookie(name,value,days,secure){let expires="";if(days){const date=new Date();date.setTime(date.getTime()+(days*24*60*60*1000));expires="; expires="+date.toUTCString();} 72let cookieString=name+"="+(value||"")+expires+"; path=/";if(secure){cookieString+="; Secure";} 73document.cookie=cookieString;} 74setCookie("critical-css","1",365,1);</script>
74 <style>@media (max-width:1023px){.project-page-title{grid-area:title;margin-block:0;padding-block:0;font-size:22px;line-height:40px;white-space:normal}.project-page-layout .author-ctas,.project-page-layout .author-ctas-2,.project-page-layout .bento-project-overlay-actions{grid-area:metrics;width:100%}}@font-face{font-display:swap;font-family:Aeonik;font-style:normal;font-weight:100 900;src:url(/dist/assets/AeonikPro-VF-DJagqNti.woff2) format("woff2")}@font-face{font-display:optional;font-family:Megazoid;font-style:normal;font-weight:400;src:url(/dist/assets/Megazoid-Regular-DP6yeqDh.woff2) format("woff2")}@font-face{font-display:swap;font-family:Aeonik Mono;font-style:normal;font-weight:400;src:url(/dist/assets/AeonikMono-Regular-BJhjWe-O.woff2) format("woff2")}.bento-identity-card__content>.bento-identity-card__header{display:flex;align-items:center;justify-content:space-between;gap:12px;grid-area:eyebrow;min-width:0;height:11px;min-height:0}.bento-identity-card__team-badges{display:flex;flex-wrap:wrap;align-items:center;gap:6px;grid-area:badges}.bento-identity-card__avatar{grid-area:avatar;align-self:start;justify-self:start;position:relative;width:auto;height:2lh;aspect-ratio:4/5;font-size:var(--bento-identity-name-fit-size,clamp(28px,4.4vw,44px));line-height:.92;perspective:900px}.bento-identity-card__copy{grid-area:name;padding-right:clamp(8px,1vw,14px)}@media (max-width:767px){.bento-identity-card__content>.bento-identity-card__header .bento-details-card__actions{grid-area:utility;width:100%;margin:4px 0 0;border-top:1px solid;padding-top:calc(var(--bento-identity-content-gap) + 4px - 6.5px)}}.bento-identity-card__actions{grid-area:actions;display:grid;align-self:end;gap:10px}.bento-social-icons.bento-identity-card__profile-social-icons{--bento-profile-social-hit-size:38px;grid-area:social;align-self:start;width:100%;margin-left:calc((var(--bento-profile-social-hit-size) - 19px)/-2)}.bento-identity-card__overlay-details{--bento-gig-fade-width:1.75em;--bento-gig-fade-stops:rgb(from var(--bento-theme-surface) r g b/0%) 0%,rgb(from var(--bento-theme-surface) r g b/1.5%) 18%,rgb(from var(--bento-theme-surface) r g b/6%) 36%,rgb(from var(--bento-theme-surface) r g b/13%) 54%,rgb(from var(--bento-theme-surface) r g b/24%) 72%,rgb(from var(--bento-theme-surface) r g b/37%) 86%,rgb(from var(--bento-theme-surface) r g b/100%) 100%;display:block;grid-area:work;min-width:0}.bento-stats-card__emoji{grid-area:1/1;display:block;line-height:1;will-change:transform,opacity}@media (min-width:0){.bento-identity-card.is-expanded .bento-identity-card__team-badges{grid-area:auto;margin-top:12px}.bento-identity-card.is-expanded .bento-identity-card__profile-column{--bento-profile-info-space:clamp(18px,2.2vw,28px);grid-area:profile;gap:var(--bento-profile-info-space)}.bento-identity-card.is-expanded .bento-identity-card__information-column{grid-area:information;gap:0;padding-top:clamp(8px,.85vw,12px)}}.bento-user-hub-aside.bento-identity-card .bento-user-hub-aside__utility-actions{grid-area:utility;align-self:end;width:100%;margin:0 0 -6.5px;border:0;border-top:1px solid;padding:calc(var(--bento-identity-content-gap) - 6.5px - 1px) 0 0;color:var(--bento-theme-ink)}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date{display:flex;align-items:stretch;gap:inherit;grid-area:head;min-width:0;width:100%}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits{grid-area:unset;grid-column:1/-1;width:100%}@media (max-width:1023px){.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .bento-project-card__exp
74anded-title{display:block;grid-area:title;position:relative;min-width:0;height:var(--overlay-close-size);margin:0;padding:0;overflow:hidden;font-size:22px;line-height:var(--overlay-close-size);white-space:nowrap}.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .author-ctas,.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .author-ctas-2{grid-area:metrics;width:100%;min-width:0}.bento-project-card.is-expanded:has([data-bento-project-overlay-header]) .bento-card__close{grid-area:close;align-self:start;width:var(--overlay-close-size);height:var(--overlay-close-size);margin-left:0}.page-project-overlay .bento-project-card__expanded-title{grid-area:title;height:var(--overlay-close-size);margin:0;padding:0;font-size:22px;line-height:var(--overlay-close-size)}.page-project-overlay .bento-card__close{grid-area:close;width:var(--overlay-close-size);height:var(--overlay-close-size);margin-left:0}.page-project-overlay .author-ctas,.page-project-overlay .author-ctas-2,.page-project-overlay .bento-project-overlay-actions{grid-area:metrics;width:100%}}@font-face{font-display:swap;
74font-family:FallbackFont;src:local("Arial");font-weight:400}@font-face{font-display:swap;font-family:FallbackFontMono;src:local("monospace");font-weight:400}@font-face{font-display:swap;font-family:FallbackFontBold;src:local("Arial Bold");font-weight:800}@font-face{font-display:swap;font-family:Aeonik;font-weight:100 900;font-style:italic;src:url(/dist/assets/AeonikPro-Italic-VF-DGkIg-ar.woff2) format("woff2"),url(/dist/assets/AeonikPro-Italic-VF-WifKrdD1.woff) format("woff")}@font-face{font-display:swap;font-family:Aeonik;font-weight:100 900;font-style:normal;src:url(/dist/assets/AeonikPro-VF-DJagqNti.woff2) format("woff2"),url(/dist/assets/AeonikPro-VF-B5-mzo4h.woff) format("woff")}@font-face{font-display:swap;font-family:Aeonik Mono;font-weight:400;font-style:normal;src:url(/dist/assets/AeonikMono-Regular-BJhjWe-O.woff2) format("woff2"),url(/dist/assets/AeonikMono-Regular-v8syvusg.woff) format("woff")}@font-face{font-display:swap;font-family:Megazoid;font-weight:400;font-style:normal;src:url(/dist/assets/Megazoid-Regular-DP6yeqDh.woff2) format("woff2"),url(/dist/assets/Megazoid-Regular-DDQUTSy0.woff) format("woff")}[data-page=login] [data-handle=login]{display:flex;flex-direction:column;min-height:calc(100svh - var(--core-header-height))}[data-page=login] [data-handle=login] .login-container{display:flex;flex:1 1 auto;align-items:center;justify-content:center;width:100%;padding-top:calc(var(--gutter-y)*2);padding-bottom:calc(var(--gutter-y)*3)}[data-page=login] [data-handle=login] .login-container .login-panel{width:100%;max-width:360px;margin-inline:auto}[data-page=login] [data-handle=login] .login-container .heading{font-family:Megazoid,FallbackFontBold,arial,helvetica,sans-serif;font-feature-settings:"liga" on,"kern" on,"ss01" on,"ss04" on,"ss12" on;font-size:clamp(48px,5vw,192px);font-weight:400;letter-spacing:.005em;line-height:1;font-size:clamp(40px,6vw,64px);margin-bottom:28px;text-align:center;text-transform:uppercase}[data-page=login] [data-handle=login] .login-container .content{width:100%}[data-page=login] [data-handle=login] .login-container form{display:flex;flex-direction:column;gap:18px;width:100%}[data-page=login] [data-handle=login] .login-container .field-container{position:relative;display:flex;flex-direction:column;align-items:stretch;width:100%}[data-page=login] [data-handle=login] .login-container .field-container label{margin-bottom:8px}[data-page=login] [data-handle=login] .login-container .field-container #password{padding-right:48px}[data-page=login] [data-handle=login] .login-container .field-label-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}[data-page=login] [data-handle=login] .login-container .field-label-row label{margin-bottom:0}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper{position:absolute;top:auto;right:16px;bottom:14px;width:20px;height:20px;transform:none}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper label{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;border-radius:5px}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper label:after{display:none}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper #password-reveal{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;opacity:1;clip-path:inset(50%)}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper .eye-fill{display:none}[data-page=login] [data-handle=login] .login-container .password-reveal-wrapper svg{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}[data-page=login] [data-handle=login] .login-container .label-wrap{margin:2px 0 4px}[data-page=login] [data-handle=login] .login-container .label-wrap input[type=checkbox]{flex-shrink:0;background-color:color-mix(in srgb,var(--text-current) 6%,var(--bg-current))!important;border:1px solid color-mix(in srgb,var(--text-current) 28%,transparent)!important;border-radius:4px}[data-page=login] [data-handle=login] .login-container .label-wrap input[type=checkbox]:before{border-radius:2px;box-shadow:inset 1em 1em var(--text-current)}[data-page=login] [data-handle=login] .login-container button[type=submit]{width:100%;margin-top:6px}[data-page=login] [data-handle=login] .login-container .forgot-password{display:inline-block;position:relative;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
74font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase;position:absolute;top:0;right:0;flex-shrink:0;color:color-mix(in srgb,var(--text-current) 70%,transparent)}[data-page=login] [data-handle=login] .login-container .sign-up-message{margin-top:28px;text-align:center;color:color-mix(in srgb,var(--text-current) 70%,transparent)}[data-page=login] [data-handle=login] .login-container .sign-up-message a{display:inline-block;position:relative;font-weight:700;color:var(--text-current)}@media (min-width:768px){.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.is-people-author-date{grid-area:head}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits{grid-area:unset;grid-column:auto;width:100%}
74.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-agency,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-agency{grid-area:agency}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-client,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-client{grid-area:client}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-credits,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-credits{grid-area:credits}.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col.is-people>.project-awards-section{grid-area:awards}[data-page=login] [data-handle=login] .login-container .forgot-password:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:var(--text-current);transform:scaleX(0);transform-origin:right top;will-change:transform}[data-page=login] [data-handle=login] .login-container .sign-up-message a:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:var(--text-current);transform:scaleX(0);transform-origin:right top;will-change:transform}.hide-on-desktop{display:none!important}}body.is-dark [data-handle=login] .login-container form label{margin-left:0;color:var(--text-current)}body.is-dark [data-handle=login] .login-container form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]){box-sizing:border-box;width:100%;padding:12px 14px;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif!important;font-size:16px!important;line-height:1.4;color:var(--text-current)!important;caret-color:var(--text-current);background-color:color-mix(in srgb,var(--text-current) 6%,var(--bg-current))!important;border:1px solid color-mix(in srgb,var(--text-current) 14%,transparent)!important;border-radius:8px;will-change:transform}body.is-dark [data-handle=login] .login-container form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):-webkit-autofill{-webkit-text-fill-color:var(--text-current)!important;box-shadow:0 0 0 1000px color-mix(in srgb,var(--text-current) 6%,var(--bg-current)) inset!important}body.is-dark [data-handle=login] .login-container form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):-webkit-autofill{will-change:transform}body.is-dark [data-handle=login] .login-container form #password{padding-right:48px}body.is-dark [data-handle=login] .login-container form .password-reveal-wrapper svg,body.is-dark [data-handle=login] .login-container form .password-reveal-wrapper svg path{f
74ill:var(--text-current)!important}.bento-customizer.is-floating.is-project-details[data-project-details-panel] .publish-toggle-label>*{grid-area:1/1}.home-feature-directory-stack .pagination-actions,[data-handle=directory] .directory-container .pagination-actions{grid-area:actions;display:flex;align-items:center;justify-content:flex-start;min-width:0}.home-feature-directory-stack .pagination-info,[data-handle=directory] .directory-container .pagination-info{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;grid-area:info;align-self:center;text-align:right;min-width:0}.home-feature-directory-stack .pagination-upgrade,[data-handle=directory] .directory-container .pagination-upgrade{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;grid-area:upgrade;display:flex;align-items:baseline;justify-content:center;gap:10px;justify-self:center;text-align:center}@media (max-width:767px){.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col:not(.is-people)>*,.bento-project-card.is-expanded .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col:not(.is-people)>*,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-discussion-layout>.project-link-credits>.project-link-credits-col:not(.is-people)>*,.project-page-layout .bento-project-overlay-fragment .portfolio-bottom.is-bento-overlay>.project-link-credits>.project-link-credits-col:not(.is-people)>*{grid-area:auto;grid-column:1/-1}[data-handle=home] .work-item{position:relative;grid-area:1/1;width:min(305px,100vw - 2*var(--gutter-cap));border-radius:6px;visibility:hidden;opacity:0}}*,:after,:before{box-sizing:border-box}body{min-height:100vh;min-height:100dvh;margin:0}ul[class]{padding:0;list-style-type:""}a{text-decoration:none}a:not([class]){-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}button,input{font:inherit}:root{--metric-count-ch:6ch;--metric-count-min-width:6ch;--metric-action-icon-size:20px;--metric-action-row-gap:6px;--metric-action-inner-gap:4px;--metric-action-cluster-min-width:calc(var(--metric-action-icon-size) + var(--metric-action-inner-gap) + var(--metric-count-min-width));--metric-profile-pill-aspect-ratio:2/1}body{color:var(--text-current);font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss02" on,"ss07" on,"ss08" on;font-weight:400;font-style:normal;font-size:18px;line-height:1.5;letter-spacing:.18px;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}.button,button,input,label{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:18px;line-height:1.5;letter-spacing:.18px;border-radius:0;font-weight:400;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss02" on,"ss07" on,"ss08" off;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}input,label{text-transform:none}label{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase}input[type=password]:not(:placeholder-shown){font-family:sans-serif}input:-webkit-autofill{-webkit-text-fill-color:inherit;box-shadow:0 0 0 1000px var(--bg-current,#fff) inset!important}input:-webkit-autofill{will-change:transform}body.is-dark input:-webkit-autofill{background-color:transparent!important;background-image:none!important;-webkit-text-fill-color:var(--text-current);box-shadow:0 0 0 1000px var(--bg-current) inset!important}body.is-dark input:-webkit-autofill{will-change:transform}form label{margin-bottom:10px;margin-left:17px}form input{background-color:#fff;border:1px solid var(--text-current);border-radius:5px;padding:16px;width:100%;display:block;resize:none;will-change:transform}form input:-webkit-autofill{-webkit-text-fill-color:inherit;box-shadow:0 0 0 1000px #fff inset!important}form input:-webkit-autofill{will-change:transform}form input[type=checkbox]{appearance:none;-webkit-appearance:none;display:inline-grid!important;place-content:center;min-width:18px;min-height:18px;width:auto;height:auto;padding:0}form input[type=checkbox]:before{content:"";display:block;width:11px;height:11px;border-radius:50%;transform:scale(0);box-shadow:inset 1em 1em var(--text-current);will-change:transform,opacity}form button{margin:0;border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
74font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:22px;padding:0 25px;color:var(--bg-current);background-color:var(--text-current);overflow:hidden;margin-top:calc(var(--gutter-y)*.75);will-change:transform}.heading,h1{margin-top:0;margin-bottom:0;font-weight:800;line-height:1}h1{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-weight:900;font-size:clamp(63px,6.7vw,146px);font-feature-settings:"dlig" on,"ss11" on,"ss09" on,"ss08" on,"ss05" on,"ss07" on,"ss06" on,"ss03" on,"case" on;line-height:.96;letter-spacing:-1.92px}p{margin-top:1em;margin-bottom:0}p:first-child{margin-top:0}.label-1{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase}.label-2{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase}@media screen and (max-width:767px){form label{margin-left:0}}:root{box-sizing:border-box;--vw:100vw;--vh:100vh;--text-current:#fff;--bg-current:#121212}*,:after,:before{box-sizing:inherit}@media (max-width:1023px),(hover:none) and (pointer:coarse){*,:after,:before{will-change:auto!important}}body,html{width:100%;margin:0;background-color:var(--bg-current)}body{overflow-x:clip}body.is-dark,html.is-dark{color-scheme:dark}.bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;will-change:transform,opacity}.bg-layer--dark{background-color:#121212;opacity:1}.bg-layer--light{background-color:#fff;opacity:0}main[data-router-wrapper]{position:relative;z-index:1;width:100%}img,svg{vertical-align:middle}.page-container{padding-top:60px;padding-bottom:calc(var(--gutter-y)*3)}@media (max-width:767px){h1{letter-spacing:-1.26px}.hide-on-mobile{display:none!important}.page-container{padding-top:calc(var(--gutter-y)*2);padding-bottom:calc(var(--gutter-y)*6);backface-visibility:hidden}.okay-form .label-wrap{margin-left:17px}}.wrapper{width:100%;margin-left:auto;margin-right:auto;padding-left:var(--gutter-cap);padding-right:var(--gutter-cap)}[data-handle]>.page-container.wrapper{max-width:var(--page-content-shell-max-width);margin-left:auto;margin-right:auto}:is([data-handle=login],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=editProfile],[data-handle=managePortfolio],[data-handle=manageTeam],[data-handle=membership],[data-handle=accountSettings],[data-handle=accountSettingsBusiness],[data-handle=notifications])>.page-container.wrapper{max-width:calc(1280px + var(--core-header-outer-padding)*2);margin-left:auto;margin-right:auto;padding-left:calc(var(--core-header-outer-padding) + var(--core-header-inner-padding-x-left));padding-right:calc(var(--core-header-outer-padding) + var(--core-header-inner-padding-x-right))}craft-csrf-input{display:none!important}img{max-width:100%}dialog:not([open]){display:none}button{touch-action:manipulation}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.okay-form .heading{font-family:Megazoid,FallbackFontBold,arial,helvetica,sans-serif;font-feature-settings:"liga" on,"kern" on,"ss01" on,"ss04" on,"ss12" on;font-size:clamp(48px,5vw,192px);font-weight:400;letter-spacing:.005em;line-height:1;margin-bottom:var(--gutter-y)}.okay-form .field-container{display:flex;flex-wrap:wrap;align-items:center;width:100%}.okay-form .field-container:has([required]) label:after{content:"*";margin-left:5px;color:#dc3545}.okay-form .label-wrap{display:flex;align-items:center}.okay-form .label-wrap input{margin-right:6px}.okay-form button[type=submit]{margin-top:0}.brand-variant-card__choice>span{grid-area:description;color:#525252;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:10px;line-height:1.2;text-transform:uppercase}.brand-variant-swatches{display:flex;flex-wrap:wrap;grid-area:swatches;gap:8px}
74.brand-download-links{display:flex;grid-area:downloads;justify-self:end;gap:6px}:root{--color-bg-black-rgb:12,12,12}:root{--color-bg-gray-dark-4-rgb:2,2,2}:root{--color-bg-gray-dark-3-rgb:2,2,2}:root{--color-bg-gray-dark-2-rgb:82,82,82}:root{--color-bg-gray-dark-1-rgb:129,129,129}:root{--color-bg-gray-light-4-rgb:242,242,242}:root{--color-bg-gray-light-3-rgb:234,234,234}:root{--color-bg-gray-light-2-rgb:204,204,204}:root{--color-bg-gray-light-1-rgb:184,184,184}:root{--color-bg-gray-rgb:102,102,102}:root{--color-bg-gray-light-rgb:191,191,191}:root{--color-bg-white-rgb:255,255,255}:root{--color-bg-yellow-rgb:238,230,66}:root{--color-bg-yellow-light-rgb:255,253,217}:root{--color-bg-red-rgb:236,66,66}:root{--color-bg-red-light-rgb:255,217,217}:root{--color-bg-orange-rgb:237,148,66}:root{--color-bg-orange-light-rgb:255,235,217}:root{--color-bg-teal-rgb:66,227,237}:root{--color-bg-teal-light-rgb:204,252,255}:root{--color-bg-purple-rgb:109,66,237}:root{--color-bg-purple-light-rgb:236,229,255}:root{--color-bg-green-rgb:66,237,145}:root{--color-bg-green-light-rgb:204,255,228}:root{--color-bg-placeholder-light-rgb:241,241,241}:root{--color-bg-placeholder-dark-rgb:0,0,0}:root{--max-width:1920px;--column-count:12;--gutter-cap:36px;--gutter-x:24px;--gutter-y:40px;--page-content-max-width:1280px;--page-content-shell-max-width:calc(var(--page-content-max-width) + (var(--gutter-cap)*2));--social-feed-max-width:800px;--social-feed-grid-gap:24px;--text-current:#fff;--bg-current:#121212}:root{--reduced-motion:1}:root{--core-header-outer-padding:calc(var(--gutter-cap)*.5);--core-header-hamburger-padding-right:23px;--core-header-hamburger-svg-trim:4px;--core-header-inner-padding-y:13px;--core-header-inner-padding-x-left:var(--core-header-inner-padding-y);--core-header-inner-padding-x-right:calc(var(--core-header-hamburger-padding-right) - var(--core-header-hamburger-svg-trim));--core-header-logo-height:32px;--core-header-control-height:36px;--core-header-inner-height:calc((var(--core-header-inner-padding-y)*2) + max(var(--core-header-logo-height),var(--core-header-control-height)));
74--core-header-height:calc((var(--core-header-outer-padding)*2) + var(--core-header-inner-height));--core-header-pill-radius:9999px;--core-header-avatar-indicator-ring:var(--bg-current);--core-header-shadow:0 10px 6px 0 rgba(0,0,0,.06);--core-header-shadow-dark:0 4px 10px rgba(0,0,0,.4);--core-header-glass-tint-rgb:255 255 255;--core-header-glass-tint-alpha:1;--core-header-glass-highlight-alpha:.7;--core-header-glass-border-alpha:.2;--core-header-glass-backdrop-blur:2px;--core-header-glass-saturate:1.2;--core-header-glass-contrast:1.15;--core-header-glass-shadow-y:6px;--core-header-glass-shadow-blur:10px;--core-header-glass-shadow-alpha:.12;--core-header-glass-sheen-opacity:0;--core-header-glass-sheen-highlight-opacity:max(var(--core-header-glass-sheen-opacity),0);--core-header-glass-sheen-shade-opacity:max(calc(var(--core-header-glass-sheen-opacity)*-1),0);--core-header-glass-fallback-blur:3px;--core-header-glass-fallback-opacity:.25;--core-header-glass-fallback-edge-alpha:.5;--core-header-glass-fallback-edge-shadow-alpha:.5;--core-header-glass-fallback-edge-size:12px;--core-header-glass-liquid-scale:30;--core-header-glass-chromatic-aberration:.4;--core-header-glass-map-depth:1;--core-header-glass-map-edge-waist:.5;--core-header-glass-map-edge-x:1.5;--core-header-glass-map-edge-y:.45;--core-header-glass-map-center-inset-x:.9;--core-header-glass-map-center-inset-y:.55;--core-header-glass-map-center-blur:.2;--core-header-glass-map-center-opacity:1;--core-header-hover-intent:.1s}.core-header-slot{position:relative;flex-shrink:0;height:var(--core-header-height)}.core-header{position:fixed;top:0;left:0;right:0;z-index:2000;width:100%;padding:var(--core-header-outer-padding) var(--gutter-cap);color:var(--text-current);transform:translate3d(0,var(--core-header-scroll-shift,0),0);backface-visibility:hidden}@media (prefers-reduced-motion:no-preference){html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .btn-mobile-nav,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .core-header-pill,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .core-logo-container,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .core-nav-list-primary>li:not(.is-empty),html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .okaydev-navbar-auth-root,html:not([data-header-intro-seen=true]) .core-header[data-header-enter-pending] .okaydev-navbar-leading-root{visibility:hidden}}body[data-header-theme=purple] .core-header .header-backdrop{opacity:1}body[data-header-theme=purple] .core-header-pill{box-shadow:var(--core-header-shadow)}body[data-header-theme=purple] .core-header{--core-header-avatar-indicator-ring:#6d42ed;color:#fff}body[data-header-theme=purple] .core-header .btn-mobile-nav,body[data-header-theme=purple] .core-header .core-nav-list-primary a.label-1,body[data-header-theme=purple] .core-header .sign-in a.label-1{color:#fff}body[data-header-theme=purple] .core-header .core-nav a.btn-core-sign-up{--btn-core-sign-up-bg:#fff;--btn-core-sign-up-fg:#0c0c0c;--btn-core-sign-up-hover-bg:#0c0c0c;--btn-core-sign-up-hover-fg:#fff}body[data-header-theme=purple] .core-header .header-backdrop{background-color:#6d42ed}body.is-dark{--core-header-glass-tint-rgb:12 12 12;--core-header-glass-tint-alpha:1;--core-header-glass-highlight-alpha:0;--core-header-glass-saturate:1.2;--core-header-glass-contrast:1.15;--core-header-glass-shadow-y:6px;--core-header-glass-shadow-blur:10px;--core-header-glass-shadow-alpha:.45;--core-header-glass-sheen-opacity:-1;--core-header-glass-liquid-scale:20;--core-header-glass-chromatic-aberration:.7;--core-header-glass-map-depth:1;--core-header-glass-map-edge-waist:.5;--core-header-glass-map-edge-y:.8;--core-header-glass-map-center-inset-y:.4}.core-header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--gutter-x);position:relative;width:100%;max-width:var(--page-content-max-width);margin-inline:auto;min-height:var(--core-header-inner-height);padding:var(--core-header-inner-padding-y) var(--core-header-inner-padding-x-right) var(--core-header-inner-padding-y) var(--core-header-inner-padding-x-left);border-radius:0;box-shadow:none;overflow:visible}.core-header-pill{--core-header-pill-cap-size:calc(var(--core-header-inner-height)/2);position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:flex;align-items:stretch;width:100%;max-width:none;border-radius:var(--core-header-pill-radius);box-shadow:none;transform:translateZ(0)}.core-header-pill-cap{flex:0 0 var(--core-header-pill-cap-size);width:var(--core-header-pill-cap-size);min-width:var(--core-header-pill-cap-size)}.core-header-pill-mid{flex:1 1 auto;min-width:0}@media (min-width:1101px){:root{--core-header-inner-padding-y:10px;--core-header-inner-padding-x-left:12px;--core-header-inner-padding-x-right:calc(var(--core-header-hamburger-padding-right) - var(--core-header-hamburger-svg-trim))}.core-header-inner{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);align-items:center;gap:0}.core-header .core-logo-container{grid-area:1/1;justify-self:start}.core-header .core-nav{grid-area:1/1;width:100%;position:static}}.core-header .header-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;border-radius:inherit;opacity:0;transform:translateZ(0);-webkit-backdrop-filter:none;backdrop-filter:none;background-color:transparent;will-change:transform,opacity}.core-header .core-logo-container{flex-shrink:0;position:relative;z-index:3}.core-header .core-logo-link{display:flex;align-items:center;border-radius:2px;color:var(--text-current);position:relative;z-index:1;touch-action:manipulation}.core-logo-brand-menu{position:absolute;top:calc(100% + 14px);left:-8px;z-index:20;width:min(304px,100vw - var(--gutter-cap)*2);color:#eaeaea;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;visibility:hidden;will-change:transform}.core-logo-brand-menu__surface{position:relative;border:1px solid #333;border-radius:14px;background:#161616;box-shadow:0 14px 36px rgba(0,0,0,.42)}.core-logo-brand-menu__content{max-height:calc(100dvh - var(--core-header-height) - 28px);overflow-x:hidden;overflow-y:auto;padding:8px;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}.core-logo-brand-menu__content::-webkit-scrollbar{display:none}.core-logo-brand-menu__label,.core-logo-brand-menu__title{margin:0;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-weight:400;text-transform:uppercase}.core-logo-brand-menu__heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 8px;color:inherit;text-decoration:none}.core-logo-brand-menu__heading:after{content:none}.core-logo-brand-menu__title{padding:0;color:#fff;font-size:14px;letter-spacing:.08em}.core-logo-brand-menu__page{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:16px;height:16px;border:1px solid #525252;border-radius:50%;color:#b8b8b8;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:10px;font-weight:700;line-height:1;text-decoration:none}.core-logo-brand-menu__page:after{content:none}.core-logo-brand-menu__group{border-top:1px solid #303030;padding-top:6px}.core-logo-brand-menu__group+.core-logo-brand-menu__group{margin-top:6px}.core-logo-brand-menu__label{padding:2px 6px 5px;color:#b8b8b8;font-size:12px;letter-spacing:.09em}.core-logo-brand-menu__toggle{display:flex;align-items:center;gap:8px;width:100%;border:0;border-radius:8px;padding:4px 2px;color:#b8b8b8;background:0 0;text-align:left}.core-logo-brand-menu__toggle .core-logo-brand-menu__label{flex:1;padding:0}.core-logo-brand-menu__chevron{display:grid;place-items:center;flex-shrink:0;width:14px;
74height:14px;margin-inline:4px 0;will-change:transform}.core-logo-brand-menu__chevron svg{display:block;width:100%;height:100%}.core-logo-brand-menu__assets{padding-block:4px}.core-logo-brand-menu__asset{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:40px;border-radius:8px;padding:2px 4px 2px 2px;color:#eaeaea;font-size:12px;font-weight:600;line-height:1.1}.core-logo-brand-menu__actions{display:flex;gap:4px}.core-logo-brand-menu__actions a{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:26px;border:1px solid #525252;border-radius:6px;padding-inline:5px;color:#ccc;background:#222;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:8px;font-weight:400;letter-spacing:.04em;text-decoration:none}.core-logo-brand-menu__actions a:after{content:none}.core-logo-brand-menu__preview{display:grid;place-items:center;width:36px;height:36px;border-radius:6px;padding:4px;overflow:hidden}.core-logo-brand-menu__preview img{display:block;width:100%;height:100%;object-fit:contain}.core-logo-brand-menu__preview--light{background:#f2f2f2}.core-logo-brand-menu__preview--purple{background:#6d42ed}.core-logo-brand-menu__preview--dark{background:#0c0c0c}.core-logo-brand-menu__footer{display:flex;gap:8px;margin-bottom:8px;padding-bottom:8px}.core-logo-brand-menu__kit{min-width:0;flex:1 1 auto;display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:center;text-align:center;gap:8px;min-height:40px;border-radius:999px;padding:9px 8px 9px 12px;color:#0c0c0c;background:#eee642;font-size:12px;font-weight:650;line-height:1;text-decoration:none;white-space:nowrap;will-change:transform}.core-logo-brand-menu__kit:after{content:none}.core-logo-brand-menu__kit span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;color:#fff;background:#0c0c0c;font-size:15px;will-change:transform}.core-logo-brand-menu__kit--guidelines{flex:0 0 auto;color:#fff;background:#6d42ed;will-change:transform}.core-logo-brand-menu__kit--guidelines span{padding-bottom:2px;color:#0c0c0c;background:#fff;will-change:transform}.core-logo-brand-menu .core-logo-brand-menu__surface{opacity:0;visibility:hidden;filter:blur(2px);transform:scale(.98) translateY(-8px);transform-origin:center center;visibility:visible;will-change:transform,opacity}@media (prefers-reduced-motion:reduce){:root{--reduced-motion:0}.core-logo-brand-menu__surface{animation-duration:NaNs!important;filter:none!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}.core-header .logo-name{--logo-fill-outer:#0c0c0c;--logo-fill-inner:#eee642;display:inline-flex;width:auto;height:var(--core-header-logo-height)}.core-header .logo-name svg{width:auto;height:100%;overflow:visible}.core-header .logo-name svg path{will-change:transform}.core-header .logo-name .logo-letter{transform-box:fill-box;transform-origin:center;will-change:transform}.core-header .logo-name .logo-letter-face{will-change:transform}body.is-dark .core-header .logo-name{--logo-fill-outer:#fff;--logo-fill-inner:#0c0c0c}body[data-header-theme=purple] .core-header .logo-name{--logo-fill-outer:#0c0c0c;--logo-fill-inner:#eee642}body:not([data-page=social]):not([data-page=gallery]) .social-feed-top-button{display:none!important}.social-feed-top-button{position:absolute;top:100%;left:50%;margin-top:8px;z-index:2100;display:inline-flex;align-items:center;gap:2px;padding:6px 12px;border-radius:999px;border:0;background-color:#6d42ed;color:#fff;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-size:.8125rem;letter-spacing:.04em;text-transform:uppercase;opacity:0;transform:translate(-50%,-8px);will-change:transform,opacity}.social-feed-top-button[hidden]{display:none}.social-feed-top-button-icon{display:inline-flex;width:18px;height:18px}.social-feed-top-button-icon svg{width:100%;height:100%}
74.social-feed-top-button-icon svg path{fill:currentColor}.social-feed-top-button-spinner{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;opacity:0}:root{--core-nav-user-menu-shadow:0 18px 48px rgba(0,0,0,.16)}.core-nav{display:flex;align-items:center;flex:1 1 auto;min-width:0;width:100%;text-transform:uppercase;position:relative;z-index:2}.core-nav a{display:flex;padding:0 8px;align-items:center;gap:6px;position:relative;border-radius:4px;color:var(--text-current)}.btn-mobile-nav{margin:0;padding:0;border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;display:none;align-items:center;justify-content:center;color:var(--text-current);background-color:transparent!important}.btn-mobile-nav .mobile-nav-toggle-icon{display:block;position:relative;width:24px;height:24px}.btn-mobile-nav .mobile-nav-toggle-line{position:absolute;top:50%;left:50%;display:block;width:19px;height:2px;margin-top:-.5px;margin-left:-9.5px;border-radius:999px;background-color:currentColor;transform-origin:center center;will-change:transform,opacity}.btn-mobile-nav .mobile-nav-toggle-line-top{transform:translateY(-3.5px)}.btn-mobile-nav .mobile-nav-toggle-line-middle{opacity:0}.btn-mobile-nav .mobile-nav-toggle-line-bottom{transform:translate(-2.85px,3.5px) scaleX(.7);transform-origin:center center}body[data-header-theme=purple] .core-header .core-nav-list-primary a.label-1{color:#fff}.core-nav-list{display:flex;align-items:center;justify-content:space-between;width:100%;margin:0}.core-nav-list .sign-in,.core-nav-list .sign-up,.core-nav-list li{flex-shrink:0}.core-nav-list-primary{display:flex;align-items:center;width:100%;margin:0}.core-nav-list-primary>li{margin-left:1.2vw}.core-nav-list-link-row{display:contents}@media (max-width:1100px){:root{--core-header-inner-padding-y:8px;--core-header-inner-padding-x-left:12px;--core-header-inner-padding-x-right:calc(var(--core-header-hamburger-padding-right) - var(--core-header-hamburger-svg-trim));--core-header-logo-height:28px}.core-nav-link-roll>span:last-child{display:none}}@media (min-width:1101px){.core-nav{position:static}.core-nav-list-primary,.okaydev-navbar-auth-root{--core-nav-primary-link-font-size:14px;--core-nav-primary-link-hover-font-size:15px;--core-nav-primary-link-roll-duration:.24s;--core-nav-primary-link-roll-stagger:.04s}.core-nav-link-roll{display:inline-grid;align-items:center;justify-items:center;overflow:hidden;vertical-align:bottom;font-size:var(--core-nav-primary-link-hover-font-size);line-height:1}.core-nav-link-roll>span{grid-area:1/1;transform-origin:center;will-change:transform}.core-nav-link-roll>span:first-child{font-size:calc(var(--core-nav-primary-link-font-size)/var(--core-nav-primary-link-hover-font-size)*1em)}.core-nav-link-roll>span:last-child{font-size:1em;transform:translateY(100%)}.core-nav-list-primary a.label-1,.okaydev-navbar-auth-root .sign-in a.label-1{display:inline-block;padding:8px 12px}.core-nav{--core-nav-current-user-gap:4px;--core-nav-avatar-menu-icon-box:24px;--core-nav-avatar-menu-svg-size:20px;--core-nav-avatar-adjacent-visual-gap:calc(var(--core-nav-current-user-gap) + (var(--core-nav-avatar-menu-icon-box) - var(--core-nav-avatar-menu-svg-size))/2 + var(--core-nav-avatar-menu-svg-size)*3.5/24)}.core-nav-list{position:static;justify-content:flex-end}.core-nav-list-primary{flex:0 1 auto;min-width:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);justify-content:center;width:max-content;margin:0;z-index:1}.core-nav-list-primary>li{margin-left:max(4px,1.2vw - 8px)}.okaydev-navbar-auth-root{position:relative;z-index:3}.okaydev-navbar-auth-root.is-navbar-auth-guest{margin-right:calc(var(--core-header-inner-padding-y) - var(--core-header-inner-padding-x-right))}.core-nav-list-pricing{position:relative}.core-nav-list-pricing .okaydev-nav-go-pro-mount{position:absolute;top:50%;left:calc(100% + 12px);transform:translateY(-50%)}}.core-nav a.btn-core-sign-up{border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
74font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:22px;background-color:var(--text-current);overflow:hidden;padding:0 15px 0 20px;color:var(--bg-current);--btn-core-sign-up-bg:var(--text-current);--btn-core-sign-up-fg:var(--bg-current);--btn-core-sign-up-hover-bg:#6d42ed;--btn-core-sign-up-hover-fg:#fff;position:relative;isolation:isolate;margin:0 0 0 8px;color:var(--btn-core-sign-up-fg);background-color:var(--btn-core-sign-up-bg);will-change:transform}.core-nav a.btn-core-sign-up svg path{fill:var(--bg-current);will-change:transform}.core-nav a.btn-core-sign-up:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;border-radius:inherit;background-color:var(--btn-core-sign-up-hover-bg);opacity:0;will-change:transform,opacity}.core-nav a.btn-core-sign-up svg path{fill:var(--btn-core-sign-up-fg);will-change:transform}.core-nav-list-primary .core-nav-list-add-project{display:none}.mobile-content-cover{display:none}@media (max-width:1100px){.core-nav{--core-nav-mobile-gutter-cap:12px;--core-nav-mobile-gutter-x:16px;--core-nav-mobile-gutter-y:14px;--core-nav-mobile-links-top:18px;--core-nav-mobile-links-row-gap:calc(var(--core-nav-mobile-gutter-y)*1.5);--core-nav-mobile-content-inline:calc(var(--core-nav-mobile-gutter-cap) + var(--core-nav-mobile-gutter-x));--core-nav-mobile-content-max-width:430px;--core-nav-mobile-panel-bg:#0c0c0c;--core-nav-mobile-account-bg:#121212;--core-nav-mobile-auth-section-gap:26px;--core-nav-mobile-user-menu-row-gap:15px;--core-nav-mobile-panel-height:calc(100dvh - var(--core-header-height,60px));justify-content:flex-start;align-items:center;gap:8px}.core-nav .okaydev-navbar-leading-root{order:1;display:flex;align-items:center;justify-content:flex-end;flex:1 1 auto;min-width:0;width:auto;position:relative;z-index:3}.core-nav .okaydev-navbar-leading-root>:is(.dynamic-block,.servd-dynamic-stale-preview){display:flex;align-items:center;justify-content:flex-end;flex:1 1 auto;min-width:0;width:100%}.core-nav a{padding-left:0;padding-right:0}.core-header .core-nav .mobile-content-cover{display:none;position:fixed;top:var(--core-header-height,60px);left:0;z-index:1998;width:100%;height:var(--core-nav-mobile-panel-height);background-color:transparent}.btn-mobile-nav{display:flex;order:2;flex-shrink:0;position:relative;z-index:3}.core-header .core-nav .core-nav-list{display:flex;flex-wrap:nowrap;align-content:flex-start;justify-content:flex-start;position:fixed;top:var(--core-header-height,60px);left:0;z-index:1999;width:100%;height:var(--core-nav-mobile-panel-height);max-height:var(--core-nav-mobile-panel-height);min-height:0;--text-current:#fff;--bg-current:var(--core-nav-mobile-panel-bg);color:var(--text-current);background-color:transparent;color-scheme:dark;overflow-x:clip;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;padding-top:var(--core-nav-mobile-links-top);visibility:hidden;opacity:0;transform:scale(.97);transform-origin:center top;isolation:isolate}.core-header .core-nav .core-nav-list a:not(.button):not(.btn-core-sign-up):not(.btn-core-login):not(.btn-core-add-project):not(.memberships-cta):not(.name):not(.username){color:var(--text-current)}.core-header>.core-nav-mobile-panel-bg{position:fixed;top:0;left:0;z-index:0;display:block;width:100%;height:100lvh;background:linear-gradient(180deg,color-mix(in srgb,#6d42ed 12%,#0c0c0c) 0,var(--core-nav-mobile-panel-bg,#0c0c0c) 18%,var(--core-nav-mobile-panel-bg,#0c0c0c) 100%);transform:scaleY(0);transform-origin:center top;opacity:0}.core-header .core-nav .core-nav-list ul.core-nav-list-primary{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--core-nav-mobile-gutter-x);row-gap:var(--core-nav-mobile-links-row-gap);align-items:start;flex-shrink:0;width:100%;max-width:calc(var(--core-nav-mobile-content-max-width) + var(--core-nav-mobile-content-inline)*2);margin-left:auto;margin-right:auto;padding-left:var(--core-nav-mobile-content-inline);padding-right:var(--core-nav-mobile-content-inline)}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li{width:auto;min-width:0;margin-top:0;margin-left:0}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-social{grid-column:1;grid-row:1}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-projects{grid-column:2;grid-row:1}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-directory{grid-column:1;grid-row:2}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-articles{grid-column:2;grid-row:2}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-jobs{grid-column:1;grid-row:3}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li.core-nav-list-pricing{grid-column:2;grid-row:3}.core-header .core-nav .core-nav-list ul.core-nav-list-primary>li>
74.core-nav-list-link-row>a.label-1{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-weight:900;font-style:normal;font-size:clamp(36px,3.5vw,63px);font-feature-settings:"dlig" on,"ss11" on,"ss09" on,"ss08" on,"ss05" on,"ss07" on,"ss06" on,"ss03" on,"case" on;line-height:.98;letter-spacing:-.48px;font-size:24px;height:auto;text-transform:none}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-link-row{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:var(--core-nav-mobile-gutter-x);width:100%}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-pricing .core-nav-list-link-row{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:calc(var(--core-nav-mobile-gutter-x)*.75);width:100%}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-pricing .okaydev-nav-go-pro-mount{position:static;top:auto;left:auto;transform:none;flex-shrink:0}.core-header .core-nav .core-nav-list ul.core-nav-list-primary .core-nav-list-add-project{display:none}.sign-up{order:2}.core-nav a.btn-core-sign-up{margin-left:0}.sign-in{order:3;display:flex;align-items:center;height:42px;margin-left:var(--core-nav-mobile-gutter-x)}.okaydev-navbar-auth-root{position:relative;z-index:1;isolation:isolate;padding-left:var(--core-nav-mobile-content-inline);padding-right:var(--core-nav-mobile-content-inline)}.okaydev-navbar-auth-root.is-navbar-auth-guest{margin-top:40px}.core-nav-mobile-account-bg,.core-nav-mobile-account-divider{position:absolute;display:block}.core-nav-mobile-account-bg{z-index:0;top:0;right:0;bottom:0;left:0;background-color:var(--core-nav-mobile-account-bg);opacity:0}
74.core-nav-mobile-account-divider{z-index:1;top:0;left:0;width:100%;height:1px;background-color:#222;opacity:0;transform:scaleX(0);transform-origin:center center}.okaydev-navbar-auth-root>:not(.core-nav-mobile-account-bg):not(.core-nav-mobile-account-divider){position:relative;z-index:2}.okaydev-navbar-auth-root.is-navbar-auth-guest{display:flex;flex-wrap:nowrap;column-gap:var(--core-nav-mobile-gutter-x);align-items:center;justify-content:flex-start;align-self:stretch;width:100%;max-width:calc(var(--core-nav-mobile-content-max-width) + var(--core-nav-mobile-content-inline)*2);margin-left:auto;margin-right:auto}.okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-mobile-account-bg{background-color:transparent}.okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-mobile-account-divider{display:none}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{order:1;display:flex;justify-content:flex-start;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2)}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up .btn-core-sign-up{width:max-content;min-width:0;padding-left:16px;padding-right:12px}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{order:2;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2);margin-left:0}body[data-header-theme=purple] .core-header .btn-mobile-nav{color:#fff;background-color:transparent!important}body[data-header-theme=purple] .core-header .mobile-nav-toggle-line{background-color:#fff}}@media (max-width:1100px) and (min-width:768px){.core-nav-list-primary>li{margin-left:0}}.okaydev-nav-go-pro-mount{display:inline-flex;align-items:baseline;min-width:0}.navbar-pricing-go-pro-ph{display:none}.okaydev-navbar-leading-root{display:flex;align-items:center;min-width:0}@media (min-width:1101px){.core-nav a.btn-core-sign-up{height:var(--btn-core-add-project-size,36px);padding-left:16px;padding-right:12px;border-radius:9999px}.okaydev-navbar-leading-root{display:none}}.okaydev-navbar-auth-root{display:flex;align-items:center;min-width:0;width:100%}@media (max-width:1100px){.okaydev-navbar-auth-root.is-navbar-auth-guest{display:flex;flex-wrap:nowrap;column-gap:var(--core-nav-mobile-gutter-x);align-items:center;justify-content:flex-start;align-self:stretch;width:100%}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{order:1;display:flex;justify-content:flex-start;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2)}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up .btn-core-sign-up{width:max-content;min-width:0;padding-left:16px;padding-right:12px}.okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{order:2;flex:0 0 calc((100% - var(--core-nav-mobile-gutter-x))/2);margin-left:0}}@media (min-width:1101px){.okaydev-navbar-auth-root{flex:0 0 auto;width:auto}}.core-nav-guest-extra{display:none}@media (max-width:1100px){.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest{display:grid;grid-template-columns:max-content minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:12px;flex:1 0 auto;align-items:start;padding-bottom:24px}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{order:1}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{order:2}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up>a.btn-core-sign-up{--btn-core-sign-up-bg:#42ed91;--btn-core-sign-up-fg:#0c0c0c}.core-header .core-nav .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in>a.btn-core-login{margin:0;border:0;background-color:transparent;color:inherit;-webkit-appearance:none;appearance:none;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:22px;padding:0 25px;color:var(--bg-current);background-color:var(--text-current);overflow:hidden;width:max-content;padding-inline:16px;color:#0c0c0c;background-color:#fff;will-change:transform}.core-nav .core-nav-guest-extra{display:flex;flex-direction:column;grid-column:1/-1;align-self:stretch;position:relative;order:3;flex:0 0 100%;margin-top:28px;padding-top:24px;border-top:1px solid rgba(255,255,255,.15)}.core-nav .core-nav-guest-extra ul{position:static;display:flex;flex-wrap:wrap;width:100%;margin:0;padding:0;gap:16px 24px;list-style:none}.core-nav .core-nav-guest-extra .core-nav-guest-secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--core-nav-mobile-gutter-x);text-transform:none}.core-nav .core-nav-guest-extra .core-nav-guest-social-nav{margin-top:auto;padding-top:24px}.core-nav .core-nav-guest-extra .core-nav-guest-social-eyebrow{margin:0 0 14px;color:rgba(255,255,255,.6);letter-spacing:.08em}.core-nav .core-nav-guest-extra .core-nav-guest-social a{display:flex;align-items:center;min-height:32px}
74.core-nav .core-nav-guest-extra .core-nav-guest-social svg{display:block;width:22px;height:22px}.core-nav .core-nav-guest-extra .core-nav-guest-social .bento-social-mark--instagram{transform:scale(1.25)}}@media (min-width:640px) and (max-width:1100px) and (orientation:landscape){.core-header .core-nav .core-nav-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto auto;gap:24px;align-items:start;padding-block:24px;padding-left:max(var(--gutter-cap),(100% - var(--page-content-max-width))/2,env(safe-area-inset-left));padding-right:max(var(--gutter-cap),(100% - var(--page-content-max-width))/2,env(safe-area-inset-right))}.core-header .core-nav .core-nav-list ul.core-nav-list-primary{grid-column:1/3;grid-row:1;max-width:none;margin:0;padding:0;column-gap:24px}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest{grid-column:1/-1;grid-row:1/3;grid-template-columns:subgrid;grid-template-rows:subgrid;gap:24px;max-width:none;margin:0;padding:0}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{grid-column:1;grid-row:2}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in{grid-column:2;grid-row:2}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in,.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{align-self:end}.core-header .core-nav .core-nav-list .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra{grid-column:3/5;grid-row:1/3;min-width:0;margin-top:0;padding-top:0;padding-left:24px;border-top:0;border-left:1px solid rgba(255,255,255,.15)}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest){grid-template-rows:repeat(3,auto) auto}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) ul.core-nav-list-primary{grid-row:1/4;grid-template-rows:subgrid;row-gap:normal;align-items:baseline}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) ul.core-nav-list-primary .core-nav-list-link-row{align-items:baseline}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest{grid-row:1/5}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-in,.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .sign-up{grid-row:4}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra{display:grid;grid-row:1/5;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:subgrid}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra .core-nav-guest-secondary,.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra>nav:first-child{display:grid;grid-column:1/-1;grid-row:1/4;grid-template-columns:subgrid;grid-template-rows:subgrid;row-gap:normal;align-items:baseline}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra .core-nav-guest-social-nav{grid-column:1/-1;grid-row:4;align-self:end;margin-top:0;padding-top:0}.core-header .core-nav .core-nav-list:has(>.is-navbar-auth-guest) .okaydev-navbar-auth-root.is-navbar-auth-guest .core-nav-guest-extra .core-nav-guest-social a{align-items:center;min-height:42px}}.app-toolbar{--app-toolbar-inset-left:max(12px,var(--app-safe-left,0px));--app-toolbar-inset-right:max(12px,var(--app-safe-right,0px));--app-toolbar-surface:rgb(28 28 30/72%);--app-toolbar-knockout:#1c1c1e;--app-toolbar-hairline:rgb(255 255 255/10%);--app-toolbar-fg:rgb(255 255 255/60%);--app-toolbar-fg-active:#fff;--app-toolbar-highlight:rgb(255 255 255/11%);--app-toolbar-shadow:0 12px 32px rgb(0 0 0/45%),0 2px 8px rgb(0 0 0/30%);--app-toolbar-dot:#af;--app-toolbar-dot-glow:0 0 5px 1px rgb(140 105 255/90%),0 0 14px 4px rgb(109 66 237/65%)}.app-toolbar{position:fixed;right:0;bottom:var(--app-toolbar-bottom,12px);left:0;z-index:2000;width:calc(100% - var(--app-toolbar-inset-left) - var(--app-toolbar-inset-right));max-width:440px;margin:0 auto;will-change:transform,opacity}.app-toolbar-list{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;align-items:center;height:var(--app-toolbar-height,60px);margin:0;padding:0 4px;list-style:none;border-radius:9999px;background:var(--app-toolbar-surface);box-shadow:var(--app-toolbar-shadow),inset 0 0 0 1px var(--app-toolbar-hairline);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%)}.app-toolbar-item{display:flex;justify-content:center;min-width:0;margin:0}.app-toolbar-tab{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:calc(var(--app-toolbar-height,60px) - 8px);margin:0;padding:0;border:0;border-radius:9999px;background:0 0;font:inherit;text-decoration:none;-webkit-appearance:none;appearance:none;touch-action:manipulation}.app-toolbar-tab{flex-direction:column;gap:3px;padding-top:6px;color:var(--app-toolbar-fg);will-change:transform}.app-toolbar-tab:before{content:"";position:absolute;top:1px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--app-toolbar-dot);box-shadow:var(--app-toolbar-dot-glow);opacity:0;transform:translate3d(0,3px,0) scale(.2);will-change:transform,opacity}.app-toolbar-icon{position:relative;display:grid;place-items:center;width:26px;height:26px}.app-toolbar-glyph{display:block;width:24px;height:24px;overflow:visible}.app-toolbar-glyph circle,.app-toolbar-glyph path{will-change:transform}.app-toolbar-glyph--social .app-toolbar-glyph-disc{fill:transparent;stroke:var(--app-toolbar-fg)}
74.app-toolbar-glyph--social .app-toolbar-glyph-mark{fill:var(--app-toolbar-fg)}.app-toolbar-label{position:relative;max-width:100%;margin-block:-.2em;padding-block:.2em;overflow:hidden;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-size:10.5px;font-weight:500;line-height:1;letter-spacing:.01em;white-space:nowrap;text-overflow:ellipsis}.app-toolbar{--app-sheet-surface:rgb(28 28 30/94%);--app-sheet-card:#2c2c2e;--app-sheet-outline:rgb(255 255 255/22%)}.app-logo{--app-logo-shade:#fff;--app-logo-fill:#0c0c0c;position:relative;z-index:2;justify-content:center;height:100%;padding:var(--app-logo-top) var(--app-logo-gutter) var(--app-logo-gutter)}.app-logo-link{display:block;border-radius:4px;touch-action:manipulation;will-change:transform}.app-logo-mark{display:block;height:var(--app-logo-height);width:auto;aspect-ratio:1483/276}.app-logo-fill,.app-logo-shade{will-change:transform}.app-logo-shade{fill:var(--app-logo-shade)}.app-logo-fill{fill:var(--app-logo-fill)}.app-status-tint{display:none;position:fixed;top:0;right:0;left:0;z-index:3;height:var(--app-status-tint-height,12px);background-color:var(--bg-current)}:is([data-handle=login],[data-handle=forgotPassword],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=editProfile],[data-handle=managePortfolio],[data-handle=manageTeam],[data-handle=membership],[data-handle=thankYou],[data-handle=accountSettings],[data-handle=accountNotifications],[data-handle=accountSettingsBusiness],[data-handle=notifications],[data-handle=about],[data-handle=faqs],[data-handle=contact],[data-handle=communityGuidelines],[data-handle=legal]){position:relative;background:0 0}:is([data-handle=login],[data-handle=forgotPassword],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=editProfile],[data-handle=managePortfolio],[data-handle=manageTeam],[data-handle=membership],[data-handle=thankYou],[data-handle=accountSettings],[data-handle=accountNotifications],[data-handle=accountSettingsBusiness],[data-handle=notifications],[data-handle=about],[data-handle=faqs],[data-handle=contact],[data-handle=communityGuidelines],[data-handle=legal])>.page-container{position:relative;z-index:1}.auth-shell-bg{position:absolute;top:calc(-1*var(--core-header-height));right:0;bottom:-100vmax;left:0;z-index:0;overflow:hidden;background-color:var(--bg-current)}:is([data-handle=login],[data-handle=forgotPassword],[data-handle=signUp],[data-handle=businessSignUp],[data-handle=errorpage],[data-handle=errorpage-404],[data-handle=errorpage-503]) .auth-shell-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background:linear-gradient(to right,transparent 0,color-mix(in srgb,var(--bg-current) 28%,transparent) 16%,color-mix(in srgb,var(--bg-current) 58%,transparent) 28%,color-mix(in srgb,var(--bg-current) 62%,transparent) 32%,color-mix(in srgb,var(--bg-current) 62%,transparent) 68%,color-mix(in srgb,var(--bg-current) 58%,transparent) 72%,color-mix(in srgb,var(--bg-current) 28%,transparent) 84%,transparent 100%)}.auth-shell-bg-shadow{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;mix-blend-mode:soft-light;opacity:.75}.auth-shell-bg-shadow img{width:100%;height:100%;object-fit:cover}.auth-shell-grid-lines{--grid-minor:40px;--grid-major:calc(var(--grid-minor)*5);position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' fill='none'%3E%3Cpath stroke='rgba(255,255,255,0.07)' stroke-width='1' stroke-dasharray='5 5' d='M20 0v200M60 0v200M140 0v200M180 0v200M0 20h200M0 60h200M0 140h200M0 180h200'/%3E%3C/svg%3E");background-size:var(--grid-major) var(--grid-major);background-position:center;background-repeat:repeat}.auth-shell-grid-lines:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-linear-gradient(to right,transparent 0 calc(var(--grid-major)/2 - .5px),rgba(255,255,255,.1) calc(var(--grid-major)/2 - .5px) calc(var(--grid-major)/2 + .5px),transparent calc(var(--grid-major)/2 + .5px) var(--grid-major)),repeating-linear-gradient(to bottom,transparent 0 calc(var(--grid-major)/2 - .5px),rgba(255,255,255,.1) calc(var(--grid-major)/2 - .5px) calc(var(--grid-major)/2 + .5px),transparent calc(var(--grid-major)/2 + .5px) var(--grid-major));background-size:var(--grid-major) 100%,100% var(--grid-major);background-position:center;background-repeat:repeat}.okay-dialog{--dialog-field-bg:color-mix(in srgb,var(--bg-current) 96%,var(--text-current));display:flex;align-items:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;border:none;background:0 0;outline:0;overflow:visible}@media (max-width:767px){:root{--column-count:6;--gutter-cap:12px;--gutter-x:16px;--gutter-y:14px}:root{--core-header-outer-padding:var(--gutter-cap)}.okay-dialog{padding:8px}}.dialog-content{display:flex;flex-direction:column;align-items:stretch;width:100%;max-width:555px;max-height:calc(100vh - var(--gutter-y)*2);border-radius:12px;margin:0;padding:0;font-size:16px;color:var(--text-current);background-color:var(--bg-current);box-shadow:0 25px 35px 5px rgba(0,0,0,.15);overflow-x:hidden;overflow-y:hidden;overscroll-behavior:contain}.dialog-content a{position:relative;z-index:1}.dialog-content p{color:var(--text-current)}.dialog-content p{font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;font-size:16px}.dialog-content a{text-decoration:underline;color:var(--text-current);opacity:.75;will-change:transform,opacity}.dialog-content a:after{background-color:var(--text-current)}body.is-dark .okay-dialog:not([data-theme=light]){--dialog-field-bg:color-mix(in srgb,var(--bg-current) 88%,var(--text-current))}body.is-dark .dialog-content{box-shadow:0 25px 35px 5px rgba(0,0,0,.45)}.dialog-heading{font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;
74font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:14px;line-height:1;text-transform:uppercase;display:flex;align-items:center;justify-content:space-between;width:100%;font-weight:500}.dialog-heading-content{display:inline-flex;align-items:center;gap:calc(var(--gutter-x)*.5);min-width:0}.dialog-heading-text{min-width:0}.dialog-footer,.dialog-header{width:100%;flex:0 0 auto;padding:14px 14px 14px 24px}.dialog-header{background-color:color-mix(in srgb,var(--text-current) 3%,#fff)}body.is-dark .dialog-header{background-color:color-mix(in srgb,var(--bg-current) 94%,#fff)}.dialog-header{border-bottom:1px solid color-mix(in srgb,var(--text-current) 8%,transparent)}@media (max-width:767px){.dialog-content{max-height:calc(100vh - 66px - var(--gutter-y)*8)}.dialog-header{padding:6px 6px 6px 12px}}.dialog-inner{width:100%;flex:1 1 auto;min-height:0;max-height:677px;overflow-y:auto;overscroll-behavior:contain;padding:18px 20px 18px 24px;scrollbar-gutter:stable}.dialog-footer{margin-top:auto;background-color:color-mix(in srgb,var(--text-current) 3%,#fff);border-top:1px solid color-mix(in srgb,var(--text-current) 8%,transparent);color:gray}body.is-dark .dialog-footer{background-color:color-mix(in srgb,var(--bg-current) 94%,#fff);border-top-color:color-mix(in srgb,#fff 12%,transparent)}.okay-dialog .dialog-content .dialog-footer :is(.button,button,input[type=submit],input[type=button]){font-size:13px}.okay-dialog .dialog-content .button:not(.btn-text){border:1px solid color-mix(in srgb,var(--text-current) 14%,transparent)}.okay-dialog{--dialog-chrome-bg:color-mix(in srgb,var(--text-current) 3%,#fff);--dialog-chrome-line:color-mix(in srgb,var(--text-current) 8%,transparent)}.okay-dialog .dialog-content{--panel-scroll-fade-bg:var(--bg-current);position:relative}.okay-dialog .dialog-content>.dialog-header{min-height:44px;padding:6px 6px 6px 14px;border-bottom-color:var(--dialog-chrome-line);background-color:var(--dialog-chrome-bg)}.okay-dialog .dialog-content>.dialog-footer{padding:10px 12px;border-top-color:var(--dialog-chrome-line);background-color:var(--dialog-chrome-bg)}.okay-dialog .dialog-footer .button{min-height:32px}.okay-dialog .dialog-heading{min-height:32px;font-size:12px;line-height:1}.okay-dialog .btn-close-dialog{flex:0 0 32px}.okay-dialog .dialog-content .button{font-size:12px}body.is-dark .okay-dialog:not([data-theme=light]){--dialog-chrome-bg:color-mix(in srgb,var(--bg-current) 94%,#fff);--dialog-chrome-line:color-mix(in srgb,#fff 14%,transparent)}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-actions{display:flex;justify-content:flex-end;gap:10px;width:100%;margin-top:0}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action{display:inline-flex;align-items:center;justify-content:center;min-width:0;border:none!important;border-radius:8px;height:auto;padding:8px 12px;font:inherit;font-size:12px;line-height:1;text-decoration:none;text-transform:uppercase;opacity:1;box-shadow:none;will-change:transform,opacity}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action:before{content:none}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action.is-secondary{background-color:color-mix(in srgb,var(--text-current) 15%,transparent);color:var(--text-current)}.okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action.is-primary{background-color:#42ed91;color:#0c0c0c}body.is-dark .okay-dialog[data-dialog=social-guest-gate] .ui-claim-project-action.is-secondary{background-color:#fff;color:#0c0c0c}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate{text-wrap:pretty}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate-image{display:block;width:100%;height:auto;aspect-ratio:1200/630;margin-bottom:18px;background-color:color-mix(in srgb,var(--text-current) 6%,transparent)}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate-image[hidden]{display:none}@media (max-width:767px){.dialog-inner{padding:16px}.dialog-footer{padding:6px}.okay-dialog[data-dialog=social-guest-gate] .ui-social-guest-gate-image{margin-bottom:16px}}.btn-close-dialog{display:grid;place-content:center;position:relative;width:32px;height:32px;border:none;border-radius:8px;margin:0;padding:0;background-color:color-mix(in srgb,var(--text-current) 10%,transparent);color:var(--text-current)}
74.btn-close-dialog svg path{fill:currentColor}.okay-dialog .dialog-footer .button{-webkit-appearance:none;appearance:none;border:1px solid color-mix(in srgb,var(--text-current) 14%,transparent);border-radius:8px;height:auto;padding:8px 12px;font:inherit;font-size:12px;line-height:1;text-decoration:none;text-transform:uppercase;box-shadow:none;will-change:transform}body.is-dark .btn-close-dialog{background-color:color-mix(in srgb,#0c0c0c 72%,#fff);border-color:color-mix(in srgb,#fff 14%,transparent);color:#fff}@media (max-width:767px){.media-library-row>.media-library-cell:first-child{grid-area:check;align-self:stretch;display:flex;align-items:center;justify-content:center;margin-top:-8px;margin-right:-8px;margin-bottom:-8px;padding:12px;border-left:1px solid color-mix(in srgb,var(--text-current) 12%,transparent)}.media-library-row>.media-library-cell:nth-child(2){grid-area:preview;align-self:start}.media-library-row>.media-library-cell:nth-child(3){grid-area:name}.media-library-row>.media-library-cell:nth-child(4){grid-area:details}.media-library-row>.media-library-cell:nth-child(6){grid-area:used}}.okay-dialog[data-size=sm] .dialog-content{max-width:420px}.okay-dialog{visibility:visible;will-change:transform}.okay-dialog .dialog-content{opacity:0;visibility:hidden;filter:blur(2px);transform:scale(.98) translateY(20px);transform-origin:center center;visibility:visible;will-change:transform,opacity}@media (prefers-reduced-motion:reduce){.okay-dialog{animation-duration:NaNs!important;filter:none!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.okay-dialog .dialog-content{animation-duration:NaNs!important;filter:none!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}body.is-dark .okay-dialog:not([data-theme=light]){--editor-canvas:#f3f3f6;--editor-surface:#fff;--editor-field:#fff;--editor-ink:#262626;--editor-muted:#626262;--editor-line:#dedede;--editor-control:#fafafa;--editor-hover:#ededed;--editor-focus:#737373;--editor-control-line:#d4d4d4;--editor-line-hover:#a3a3a3;--editor-quiet:#f2f2f2;--editor-pressed:#e5e5e5;--editor-subtle-line:#c7c7c7;--editor-placeholder:#757575;--editor-disabled-ink:#858585;--editor-primary:#262626;--editor-primary-ink:#fff;--editor-primary-hover:#404040;--editor-table:#e7e7e9;--editor-table-ink:#333;--editor-row-hover:#f7f7f7;--editor-danger:#b42318;--editor-danger-line:#e0bcbc;--editor-danger-hover:#fcebea;--editor-drop-active:#e8f9ef;--editor-focus-shadow:rgb(64 64 64/12%);--editor-scheme:light;--editor-radius:10px;--editor-shadow:0 24px 64px rgb(24 24 24/20%),0 4px 16px rgb(24 24 24/10%);--text-current:var(--editor-ink);--bg-current:var(--editor-surface);--dialog-field-bg:var(--editor-field);--dialog-chrome-bg:var(--editor-surface);--dialog-chrome-line:var(--editor-line);color-scheme:var(--editor-scheme)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content{--panel-scroll-fade-bg:var(--editor-canvas);border:1px solid var(--editor-line);border-radius:var(--editor-radius);color:var(--editor-ink);background:var(--editor-canvas);box-shadow:var(--editor-shadow)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content>.dialog-header{min-height:56px;padding:9px 10px 9px 16px;background:var(--editor-surface)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-heading{min-height:36px;font-family:Aeonik,sans-serif;font-size:16px;font-weight:500;letter-spacing:0;line-height:1.25;text-transform:none}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-heading-content{gap:8px}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .btn-close-dialog{display:grid;flex:0 0 36px;place-items:center;width:36px;height:36px;border:1px solid var(--editor-control-line);border-radius:8px;padding:8px;color:var(--editor-muted);background:var(--editor-quiet);box-shadow:none}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .btn-close-dialog svg{width:18px;height:18px}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content>.dialog-footer{border-color:var(--editor-line);padding:12px;color:var(--editor-muted);background:var(--editor-surface)}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .button:not(.btn-text){min-height:36px;border:1px solid var(--editor-control-line);border-radius:8px;padding:8px 12px;color:var(--editor-ink);background:var(--editor-control);box-shadow:none;font-family:Aeonik,sans-serif;font-size:12px;font-weight:500;letter-spacing:0;line-height:1.2;text-transform:none}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .dialog-footer :is(.button,button,input[type=submit],input[type=button]){font-size:13px}body.is-dark .okay-dialog:not([data-theme=light]) .dialog-content .dialog-footer .is-primary{border-color:var(--editor-primary);color:var(--editor-primary-ink);background:var(--editor-primary)}body.is-dark .okay-dialog:not([data-theme=light]){--editor-canvas:#19191b;--editor-surface:#252527;--editor-field:#1e1e21;--editor-ink:#ededee;--editor-muted:#b0b0b6;--editor-line:#3f3f43;--editor-control:#2c2c2f;--editor-hover:#38383c;--editor-focus:#a4a4ad;--editor-control-line:#49494e;--editor-line-hover:#72727a;--editor-quiet:#303034;--editor-pressed:#414146;--editor-subtle-line:#55555c;--editor-placeholder:#93939b;--editor-disabled-ink:#797982;--editor-primary:#ededee;--editor-primary-ink:#19191b;--editor-primary-hover:#d1d1d6;--editor-table:#353539;--editor-table-ink:#dddde1;--editor-row-hover:#2c2c2f;--editor-danger:#ff9991;--editor-danger-line:#78433f;--editor-danger-hover:#442b2b;--editor-drop-active:#233d2e;--editor-focus-shadow:rgb(190 190 200/16%);--editor-scheme:dark;--editor-radius:10px;--editor-shadow:0 24px 64px rgb(0 0 0/48%),0 4px 16px rgb(0 0 0/32%)}.social-image-viewer-dialog{display:flex;align-items:stretch;justify-content:stretch;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:none;background:0 0;outline:0;overflow:hidden;opacity:0;visibility:visible;will-change:transform,opacity}.social-image-viewer-dialog__panel{position:relative;display:flex;flex-direction:column;width:100%;height:100%;background-color:#0c0c0c}.social-image-viewer-dialog__close.btn-close-dialog{position:absolute;top:calc(max(12px,env(safe-area-inset-top)) - 6px);right:calc(max(12px,env(safe-area-inset-right)) - 6px);z-index:3;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:0;color:#fff;background-color:transparent;opacity:.92;box-shadow:none;will-change:transform,opacity}
74.social-image-viewer-dialog__close.btn-close-dialog svg path{fill:currentColor}body.is-dark .social-image-viewer-dialog__close.btn-close-dialog{background-color:transparent;border-color:transparent;color:#fff}.social-image-viewer-dialog__thumbs{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));z-index:2;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 72px)}.social-image-viewer-dialog__viewport{position:relative;flex:1 1 auto;min-height:0;width:100%}.social-image-viewer-dialog__track{display:flex;height:100%;min-height:100%}.social-image-viewer-dialog__footer{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:2px;padding:6px max(12px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));color:#fff;background:linear-gradient(to top,#0c0c0c,rgba(12,12,12,0))}.social-image-viewer-dialog__pagination{display:flex;align-items:baseline;gap:.1em;margin:0;color:#666;font-family:Aeonik Mono,FallbackFontMono,monospace,menlo,monaco,Lucida Console,courier;font-variant-numeric:lining-nums proportional-nums stacked-fractions slashed-zero;font-feature-settings:"dlig" on,"case" on,"ss05" on,"ss06" on,"ss07" on,"ss12" off;font-size:12px;line-height:1;text-transform:uppercase}.social-image-viewer-dialog__pagination-sep{color:#525252}.social-image-viewer-dialog__pagination[hidden]{display:none}.social-image-viewer-dialog__title{width:100%;margin:0;font-family:Aeonik,FallbackFont,arial,helvetica,sans-serif;font-variant-numeric:lining-nums proportional-nums slashed-zero;font-feature-settings:"ss08" on,"ss02" on,"ss07" on;font-size:14px;line-height:1.5;letter-spacing:.21px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}</style>
74<script type="module" src="https://okaydev.co/dist/assets/app-BiaPDw27.js" crossorigin onload="e=new CustomEvent('vite-script-loaded', {detail:{path: 'src/js/app.js'}});document.dispatchEvent(e);" integrity="sha384-rc5tBKMHskM7eBhFEZPTGXy6OHE1v9kVH3CFceI2+biaB/epTvymjBWYPcAm/ON2"></script>
74 <link 75href="https://okaydev.co/dist/assets/HeaderLogoLetters-CMLHzChc.js" rel="modulepreload" crossorigin integrity="sha384-pjhTnwsDelDxaY6fqULoIHCayLxtTzRhoYqKTVaO+87m1qwAkztwnQjVugQ7c2/q"><link 76href="https://okaydev.co/dist/assets/refreshNavbarAuth-V-4DhXEm.js" rel="modulepreload" crossorigin integrity="sha384-0aZeN9dWGPf+9eV9pvZnoPI036VrIYihmPuUvMvWVuSHgtMqyKN6ftO7P1UMFRdR"><link 77href="https://okaydev.co/dist/assets/lazyDialog-CU88mIO4.js" rel="modulepreload" crossorigin integrity="sha384-vYPSV+cKPQU3zXSX+RzB5WHwKiBbt2oSUEe/pmXdy6rR9d2zYHnnXv0+qgCFZaQ8"><link 78href="https://okaydev.co/dist/assets/app-4P6e9Apm.css" rel="stylesheet" media="print" onload="this.media='all'"><link 79href="https://okaydev.co/dist/assets/HeaderLogoLetters-DngiwBoB.css" rel="stylesheet" media="print" onload="this.media='all'">
79<script src="https://okaydev.co/dist/assets/app-legacy-CcTcNDK7.js" nomodule onload="e=new CustomEvent('vite-script-loaded', {detail:{path: 'src/js/app-legacy.js'}});document.dispatchEvent(e);" integrity="sha384-w6ID9rdE1/PtnaIaIVSfmeV7xrtdYPWgWvY6pXl6WZ6mtzjOqN4HYDG8uDhC6xaJ"></script>
79 <!--# endif --><style id="okaydev-dark-first-paint">html.is-dark,body.is-dark{--text-current:#fff;--bg-current:#121212;background-color:#121212}body.is-dark[data-page=pricing] form input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=reset]):not([type=file]),body.is-dark[data-page=pricing] form textarea,body.is-dark[data-page=pricing] form select{background-color:#0d0d0d;color:var(--text-current);border-color:#333}</style>
79<script>try{if(sessionStorage.getItem('okaydev:header-intro-seen')==='1'){document.documentElement.dataset.headerIntroSeen='true';}}catch(_){}</script>
79 <style id="okaydev-initial-boot-hide">html.okaydev-boot-pending body{opacity:0}html.okaydev-boot-pending[data-header-intro-seen=true] body{opacity:1}html.okaydev-boot-pending[data-header-intro-seen=true] body>:not(.core-header-slot):not(#okaydev-pwa-launch){opacity:0}</style>
79<script>(function(){var lifted=false;var lift=function(){if(lifted)return;lifted=true;document.documentElement.classList.remove('okaydev-boot-pending');};var nav=performance.getEntriesByType&&performance.getEntriesByType('navigation')[0];var isReload=(nav&&nav.type==='reload')||(performance.navigation&&performance.navigation.type===1);if(isReload){var afterScrollRestore=function(){requestAnimationFrame(function(){requestAnimationFrame(lift);});};if(document.readyState==='complete'){afterScrollRestore();}else{window.addEventListener('load',afterScrollRestore,{once:true});} 80setTimeout(lift,2000);return;} 81var cssLink=document.querySelector('link[rel="stylesheet"][href*="/dist/"], link[rel="stylesheet"][href*="/assets/app"]');var media=cssLink&&(cssLink.media||'all');var hasBlockingAppCss=!!cssLink&&(media==='all'||media==='screen');var hasCriticalCss=false;var styles=document.querySelectorAll('style');for(var i=0;i<styles.length;i++){if((styles[i].textContent||'').length>5000){hasCriticalCss=true;break;}} 82if(!hasBlockingAppCss&&!hasCriticalCss){setTimeout(lift,2000);return;} 83if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',lift,{once:true});}else{lift();}})();</script>
83
83<script>(function(){var root=document.documentElement;if(root.classList.contains('is-pointer-hover-armed'))return;if(window.matchMedia&&window.matchMedia('(hover: none), (pointer: coarse)').matches){root.classList.add('is-pointer-hover-armed');return;} 84var arm=function(){root.classList.add('is-pointer-hover-armed');};window.addEventListener('pointermove',arm,{once:true,passive:true,capture:true});})();</script>
84
84<script>(function(){try{if(sessionStorage.getItem('okaydev:social-feed-scroll-top')!=='1'){return;} 85if('scrollRestoration'in history){history.scrollRestoration='manual';} 86window.scrollTo(0,0);}catch(e){}})();</script>
86<script>window.passwordpolicy = {"showStrengthIndicator":false};</script>
86</head> 87 88 <body class="is-dark is-production" data-page="login" data-header-theme="purple" data-sticky-mobile-header="true"> 89 90 <style> 91 #okaydev-pwa-launch { display: none; } 92 html.okaydev-boot-pending body:has(> #okaydev-pwa-launch) { opacity: 1; } 93 #okaydev-pwa-launch:not([hidden]) { 94 display: grid; place-items: center; position: fixed; inset: 0; 95 z-index: 2147483645; overflow: hidden; 96 color: #fff; 97 } 98 #okaydev-pwa-launch.is-ready { pointer-events: none; } 99 #okaydev-pwa-launch .pwa-launch-background { position: absolute; inset: 0; background: #000; will-change: opacity; } 100 /* Match app-navigation-cover.scss before the application styles arrive. */ 101 #okaydev-pwa-launch .pwa-launch-spinner { 102 position: relative; display: block; width: 28px; height: 28px; box-sizing: border-box; 103 border: 2px solid rgb(255 255 255 / 30%); border-top-color: currentColor; 104 border-radius: 50%; opacity: 0; transition: opacity 140ms ease-out; 105 animation: okaydev-launch-spin 800ms linear infinite paused; 106 } 107 #okaydev-pwa-launch.is-loading .pwa-launch-spinner { opacity: 1; animation-play-state: running; } 108 @keyframes okaydev-launch-spin { to { transform: rotate(360deg); } } 109 @media (prefers-reduced-motion: reduce) { 110 #okaydev-pwa-launch .pwa-launch-spinner { animation: none; transition: none; } 111 } 112</style> 113<div id="okaydev-pwa-launch" role="status" aria-label="Loading page" hidden> 114 <span class="pwa-launch-background" aria-hidden="true"></span> 115 <span class="pwa-launch-spinner" aria-hidden="true"></span> 116</div>
117<script> 118 (function () { 119 var screen = document.getElementById('okaydev-pwa-launch'); 120 if (!window.matchMedia('(display-mode: standalone)').matches && !navigator.standalone) { 121 screen.remove(); 122 return; 123 } 124 screen.hidden = false; 125 var root = document.documentElement; 126 var holds = []; 127 var observer; 128 var timer; 129 var rendererTimer; 130 var spinnerTimer; 131 var removed = false; 132 var background = screen.querySelector('.pwa-launch-background'); 133 var motion = window.matchMedia('(prefers-reduced-motion: reduce)'); 134 // A new document has no outgoing page to cover. Start opaque so its 135 // unfinished markup never shows through an entrance animation. 136 var animation = null; 137 var entered = Promise.resolve(); 138 function showSpinner() { if (!done && !removed) screen.classList.add('is-loading'); } 139 entered.then(function () { 140 if (done || removed) return; 141 spinnerTimer = setTimeout(showSpinner, 180); 142 }).catch(function () {}); 143 function reduceMotion() { if (motion.matches && animation) animation.finish(); } 144 motion.addEventListener('change', reduceMotion); 145 var settling = false; 146 var done = false; 147 // `holdAppLaunch()` (src/js/utils/appLaunch.js) keeps the screen up for work that moves the page, like the push invitation. 148 window.okaydevLaunch = { hold: function (work) { holds.push(Promise.resolve(work).catch(function () {})); } }; 149 function frame() { return new Promise(function (resolve) { requestAnimationFrame(function () { resolve(); }); }); } 150 function within(ms, work) { return Promise.race([work, new Promise(function (resolve) { setTimeout(resolve, ms); })]); } 151 function finish(immediate) { 152 if (done) return; 153 done = true; 154 clearTimeout(timer); 155 clearTimeout(rendererTimer); 156 if (observer) observer.disconnect(); 157 document.removeEventListener('DOMContentLoaded', check); 158 delete window.okaydevLaunch; 159 clearTimeout(spinnerTimer); 160 screen.classList.remove('is-loading'); 161 screen.classList.add('is-ready'); 162 if (immediate || motion.matches) { remove(); return; } 163 // Reveal the ready document with the same fade as PJAX. 164 entered.then(function () { 165 if (removed) return; 166 if (motion.matches) { remove(); return; } 167 if (animation) animation.cancel(); 168 animation = background.animate([ 169 { opacity: 1 }, 170 { opacity: 0 } 171 ], { duration: 260, easing: 'cubic-bezier(0.65, 0, 0.35, 1)', fill: 'both' }); 172 animation.finished.then(remove).catch(function () {}); 173 }).catch(function () {}); 174 } 175 function remove() { 176 removed = true; 177 clearTimeout(spinnerTimer); 178 if (animation) animation.cancel(); 179 motion.removeEventListener('change', reduceMotion); 180 window.removeEventListener('pagehide', hide); 181 screen.remove(); 182 } 183 function hide() { finish(true); remove(); } 184 function settle() { 185 if (settling) return; 186 settling = true; 187 // Holds register as the renderer finishes; uncover once they, fonts, and the next paint are done. 188 frame() 189 .then(function () { return within(2500, Promise.all(holds.concat(document.fonts ? document.fonts.ready : []))); }) 190 .then(frame) 191 .then(frame) 192 .then(function () { finish(false); }); 193 } 194 function check() { 195 if (document.readyState === 'loading' || root.classList.contains('okaydev-boot-pending')) return; 196 // PJAX pages load their styles with the renderer; Bento pages have none to wait for. 197 if (!document.querySelector('[data-router-view]') || document.body.hasAttribute('data-renderer-ready')) settle(); 198 else if (!rendererTimer) rendererTimer = setTimeout(settle, 4000); 199 } 200 observer = new MutationObserver(check); 201 observer.observe(root, { attributes: true, attributeFilter: ['class'] }); 202 observer.observe(document.body, { attributes: true, attributeFilter: ['data-renderer-ready'] }); 203 document.addEventListener('DOMContentLoaded', check, { once: true }); 204 window.addEventListener('pagehide', hide, { once: true }); 205 timer = setTimeout(function () { finish(false); }, 8000); 206 check(); 207 })(); 208</script>
208 209 <div class="bg-layer bg-layer--dark" aria-hidden="true"></div> 210 <div class="bg-layer bg-layer--light" aria-hidden="true"></div> 211 <div class="app-status-tint" aria-hidden="true"></div> 212 213 214 215 216 217 218 219 220 221<div class="core-header-slot"> 222 <header class="core-header" data-header-enter-pending> 223 <span class="core-nav-mobile-panel-bg" aria-hidden="true"></span> 224 225 <div class="core-header-inner"> 226 <div class="core-header-pill" aria-hidden="true"> 227 <span class="core-header-pill-cap core-header-pill-cap--start"></span> 228 <span class="core-header-pill-mid"></span> 229 <span class="core-header-pill-cap core-header-pill-cap--end"></span> 230 <div class="header-backdrop"></div> 231 </div> 232 233 <div class="core-logo-container"> 234 <a 235 class="core-logo-link" 236 href="https://okaydev.co/" 237 aria-label="Home" 238 aria-haspopup="menu" 239 aria-controls="core-logo-brand-menu" 240 aria-expanded="false" 241 data-header-brand-menu-trigger 242 > 243 <span class="logo-name"> 244 <svg class="logo-okaydev" role="img" aria-label="OKAYDEV logo" width="1483" height="276" viewBox="0 0 1483 276" fill="none" xmlns="http://www.w3.org/2000/svg"> 245 <g class="logo-shades" aria-hidden="true"> 246 <path class="logo-letter-shadow" data-letter="V" d="M1350.75 34.5V4H1252.25L1202.25 54V272H1374.75L1424.75 222L1483 4H1381.25L1350.75 34.5Z" fill="var(--logo-fill-outer)"/> 247 <path class="logo-letter-shadow" data-letter="E" d="M1088.75 4L1038.75 54V272H1211L1261 222V4H1088.75Z" fill="var(--logo-fill-outer)"/> 248 <path class="logo-letter-shadow" data-letter="D" d="M875.5 4L825.5 54V272H935.5C967 272 996 259.75 1016.5 239.25L1066.5 189.25C1086.5 169.25 1099.25 142.5 1099.25 113C1099.25 53 1047.75 4 985.5 4H875.5Z" fill="var(--logo-fill-outer)"/> 249 <path class="logo-letter-shadow" data-letter="Y" d="M791.75 272L841.75 222L900 4H795.25L777.5 21.75V4H680.25L630.25 54V235.5H696.75L687 272H791.75Z" fill="var(--logo-fill-outer)"/> 250 <path class="logo-letter-shadow" data-letter="A" d="M540.25 240.25V272H638.25L688.25 222V4H515L465 54L406.75 272H508.5L540.25 240.25Z" fill="var(--logo-fill-outer)"/> 251 <path class="logo-letter-shadow" data-letter="K" d="M337 254.25V272H434.25L484.25 222V85.25H465.5L487.25 4H272L222 54V272H319.25L337 254.25Z" fill="var(--logo-fill-outer)"/> 252 <path class="logo-letter-shadow" data-letter="O" d="M197.25 243.5L247.25 193.5C269 173 282.5 144.5 282.5 112.75C282.5 50.75 229.75 0 166.5 0C135 0 106.5 12 85.5 31.75L35.5 81.75C14.25 103 0 131 0 162.75C0 225.25 52 276 116.5 276C147.75 276 176.25 263.75 197.25 243.5Z" fill="var(--logo-fill-outer)"/> 253 </g> 254 255 <g class="logo-faces"> 256 <g class="logo-letter" data-letter="V"> 257 <path class="logo-letter-face" d="M1261.25 13V213H1417.75L1471.25 13H1388.25L1356.25 132C1353.75 141 1341.75 140.25 1341.75 130V13H1261.25Z" fill="var(--logo-fill-inner)"/> 258 </g> 259 <g class="logo-letter" data-letter="E"> 260 <path class="logo-letter-face" d="M1097.75 13V213H1252V145.5H1207V107H1184.5C1177.25 107 1172 101.5 1172 93.75C1172 86 1177.25 80.5 1184.5 80.5H1252V13H1097.75Z" fill="var(--logo-fill-inner)"/> 261 </g> 262 <g class="logo-letter" data-letter="D"> 263 <path class="logo-letter-face" d="M884.5 13V213H985.5C1043 213 1090.25 168 1090.25 113C1090.25 58 1043 13 985.5 13H884.5ZM953 113C953 97.25 966 84.25 981.75 84.25C997.5 84.25 1010.25 97.25 1010.25 113C1010.25 128.75 997.5 141.75 981.75 141.75C966 141.75 953 128.75 953 113Z" fill="var(--logo-fill-inner)"/> 264 </g> 265 <g class="logo-letter" data-letter="Y"> 266 <path class="logo-letter-face" d="M758.5 176.5L748.75 213H834.75L888.25 13H802.25L778.5 101.25C777 107 768.5 105.5 768.5 99.25V13H689.25V176.5H758.5Z" fill="var(--logo-fill-inner)"/> 267 </g> 268 <g class="logo-letter" data-letter="A"> 269 <path class="logo-letter-face" d="M522 13L468.5 213H551.5L564.75 163.7
2695H599.25V213H679.25V13H522ZM568.25 90.5C568.25 79.25 577.5 70.25 588.5 70.25C599.5 70.25 608.5 79.25 608.5 90.5C608.5 101.5 599.5 110.5 588.5 110.5C577.5 110.5 568.25 101.5 568.25 90.5Z" fill="var(--logo-fill-inner)"/> 270 </g> 271 <g class="logo-letter" data-letter="K"> 272 <path class="logo-letter-face" d="M281 13V213H360.25V151.25H396V213H475.25V94.25H453.75L475.5 13H381V71C381 88.25 360.25 88.25 360.25 71V13H281Z" fill="var(--logo-fill-inner)"/> 273 </g> 274 <g class="logo-letter" data-letter="O"> 275 <path class="logo-letter-face" d="M166.5 217C225 217 273.5 170.25 273.5 112.75C273.5 55.75 225 9 166.5 9C106.75 9 59 55.75 59 112.75C59 170.25 106.75 217 166.5 217ZM137.25 113C137.25 97.25 150.5 84.25 166.25 84.25C181.5 84.25 194.5 97.25 194.5 113C194.5 129 181.5 141.75 166.25 141.75C150.5 141.75 137.25 129 137.25 113Z" fill="var(--logo-fill-inner)"/> 276 </g> 277 </g> 278</svg> 279 </span> 280 </a> 281 282 <div 283 class="core-logo-brand-menu" 284 id="core-logo-brand-menu" 285 role="menu" 286 aria-label="OkayDev brand asset downloads" 287 aria-hidden="true" 288 data-header-brand-menu 289 > 290 <div class="core-logo-brand-menu__surface"> 291 <div class="core-logo-brand-menu__content" tabindex="-1"> 292 <a 293 class="core-logo-brand-menu__heading" 294 href="https://okaydev.co/brand" 295 role="menuitem" 296 tabindex="-1" 297 aria-label="Brand page" 298 > 299 <p class="core-logo-brand-menu__title">Brand assets</p> 300 <span class="core-logo-brand-menu__page"> 301 <span aria-hidden="true">i</span> 302 </span> 303 </a> 304 305 <div class="core-logo-brand-menu__footer"> 306 <a 307 class="core-logo-brand-menu__kit core-logo-brand-menu__kit--guidelines" 308 href="https://okaydev.co/brand" 309 role="menuitem" 310 tabindex="-1" 311 > 312 Brand Guidelines 313 <span aria-hidden="true">â</span> 314 </a> 315 <a 316 class="core-logo-brand-menu__kit" 317 href="/dist/brand/okay-dev-brand-kit.zip" 318 download 319 data-router-disabled 320 role="menuitem" 321 tabindex="-1" 322 aria-label="Full Brand Kit" 323 > 324 Full Brand Kit
325 <span aria-hidden="true">â</span> 326 </a> 327 </div> 328 329 <div 330 class="core-logo-brand-menu__group" 331 role="group" 332 aria-labelledby="brand-menu-horizontal" 333 > 334 <button 335 type="button" 336 class="core-logo-brand-menu__toggle" 337 id="brand-menu-horizontal" 338 data-brand-accordion-toggle 339 role="menuitem" 340 tabindex="-1" 341 aria-expanded="false" 342 aria-controls="brand-menu-assets-horizontal" 343 > 344 <span class="core-logo-brand-menu__chevron" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="m9 6 6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> 345</span> 346 <span class="core-logo-brand-menu__label">Horizontal</span> 347 <span class="core-logo-brand-menu__preview core-logo-brand-menu__preview--light" aria-hidden="true"> 348 <img src="/dist/brand/okay-dev-brand-kit/logos/horizontal/svg/okay-dev-horizontal-black-yellow.svg" alt="" loading="lazy" decoding="async"> 349 </span> 350 </button> 351 <div class="core-logo-brand-menu__assets" id="brand-menu-assets-horizontal" hidden inert> 352 <div class="core-logo-brand-menu__asset"> 353 <span 354 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--light" 355 aria-hidden="true" 356 > 357 <img 358 src="/dist/brand/okay-dev-brand-kit/logos/horizontal/svg/okay-dev-horizontal-black-yellow.svg" 359 alt="" 360 loading="lazy" 361 decoding="async" 362 > 363 </span> 364 <span class="core-logo-brand-menu__name">Yellow fill</span> 365 <span class="core-logo-brand-menu__actions"> 366 <a 367 href="/dist/brand/okay-dev-brand-kit/logos/horizontal/svg/okay-dev-horizontal-black-yellow.svg" 368 download 369 data-router-disabled 370 role="menuitem" 371 tabindex="-1" 372 aria-label="Download horizontal logo, black shade and yellow fill as SVG" 373 >SVG</a> 374 <a 375 href="/dist/brand/okay-dev-brand-kit/logos/horizontal/png/okay-dev-horizontal-black-yellow-1200w.png" 376 download 377 data-router-disabled 378 role="menuitem" 379 tabindex="-1" 380 aria-label="Download horizontal logo, black shade and yellow fill as PNG" 381 >PNG</a> 382 </span> 383 </div> 384 <div class="core-logo-brand-menu__asset">
385 <span 386 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--purple" 387 aria-hidden="true" 388 > 389 <img 390 src="/dist/brand/okay-dev-brand-kit/logos/horizontal/svg/okay-dev-horizontal-black-white.svg" 391 alt="" 392 loading="lazy" 393 decoding="async" 394 > 395 </span> 396 <span class="core-logo-brand-menu__name">White fill</span> 397 <span class="core-logo-brand-menu__actions"> 398 <a 399 href="/dist/brand/okay-dev-brand-kit/logos/horizontal/svg/okay-dev-horizontal-black-white.svg" 400 download 401 data-router-disabled 402 role="menuitem" 403 tabindex="-1" 404 aria-label="Download horizontal logo, black shade and white fill as SVG" 405 >SVG</a> 406 <a 407 href="/dist/brand/okay-dev-brand-kit/logos/horizontal/png/okay-dev-horizontal-black-white-1200w.png" 408 download 409 data-router-disabled 410 role="menuitem" 411 tabindex="-1" 412 aria-label="Download horizontal logo, black shade and white fill as PNG" 413 >PNG</a> 414 </span> 415 </div> 416 <div class="core-logo-brand-menu__asset"> 417 <span 418 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--dark" 419 aria-hidden="true" 420 > 421 <img 422 src="/dist/brand/okay-dev-brand-kit/logos/horizontal/svg/okay-dev-horizontal-white-black.svg" 423 alt="" 424 loading="lazy" 425 decoding="async" 426 > 427 </span> 428 <span class="core-logo-brand-menu__name">Reversed</span> 429 <span class="core-logo-brand-menu__actions"> 430 <a 431 href="/dist/brand/okay-dev-brand-kit/logos/horizontal/svg/okay-dev-horizontal-white-black.svg" 432 download 433 data-router-disabled 434 role="menuitem" 435 tabindex="-1" 436 aria-label="Download horizontal logo, white shade and black fill as SVG" 437 >SVG</a> 438 <a 439 href="/dist/brand/okay-dev-brand-kit/logos/horizontal/png/okay-dev-horizontal-white-black-1200w.png" 440 download 441 data-router-disabled 442 role="menuitem" 443 tabindex="-1" 444 aria-label="Download horizontal logo, white shade and black fill as PNG" 445 >PNG</a> 446 </span> 447 </div> 448 </div> 449 </div> 450 <div 451 class="core-logo-brand-menu__group" 452 role="group" 453 aria-labelledby="brand-menu-stacked" 454 > 455 <button 456 type="button" 457 class="core-logo-brand-menu__toggle" 458 id="brand-menu-stacked" 459 data-brand-accordion-toggle 460 role="menuitem" 461 tabindex="-1" 462 aria-expanded="false" 463 aria-controls="brand-menu-assets-stacked" 464 >
465 <span class="core-logo-brand-menu__chevron" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="m9 6 6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> 466</span> 467 <span class="core-logo-brand-menu__label">Stacked</span> 468 <span class="core-logo-brand-menu__preview core-logo-brand-menu__preview--purple" aria-hidden="true"> 469 <img src="/dist/brand/okay-dev-brand-kit/logos/stacked/svg/okay-dev-stacked-black-white-yellow.svg" alt="" loading="lazy" decoding="async"> 470 </span> 471 </button> 472 <div class="core-logo-brand-menu__assets" id="brand-menu-assets-stacked" hidden inert> 473 <div class="core-logo-brand-menu__asset"> 474 <span 475 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--purple" 476 aria-hidden="true" 477 > 478 <img 479 src="/dist/brand/okay-dev-brand-kit/logos/stacked/svg/okay-dev-stacked-black-white-yellow.svg" 480 alt="" 481 loading="lazy" 482 decoding="async" 483 > 484 </span> 485 <span class="core-logo-brand-menu__name">Primary</span> 486 <span class="core-logo-brand-menu__actions"> 487 <a 488 href="/dist/brand/okay-dev-brand-kit/logos/stacked/svg/okay-dev-stacked-black-white-yellow.svg" 489 download 490 data-router-disabled 491 role="menuitem" 492 tabindex="-1" 493 aria-label="Download stacked logo, black shade, white fill, and yellow smiley as SVG" 494 >SVG</a> 495 <a 496 href="/dist/brand/okay-dev-brand-kit/logos/stacked/png/okay-dev-stacked-black-white-yellow-1000w.png" 497 download 498 data-router-disabled 499 role="menuitem" 500 tabindex="-1" 501 aria-label="Download stacked logo, black shade, white fill, and yellow smiley as PNG" 502 >PNG</a> 503 </span> 504 </div> 505 <div class="core-logo-brand-menu__asset"> 506 <span 507 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--dark" 508 aria-hidden="true" 509 > 510 <img 511 src="/dist/brand/okay-dev-brand-kit/logos/stacked/svg/okay-dev-stacked-white-black-black.svg" 512 alt="" 513 loading="lazy" 514 decoding="async" 515 > 516 </span>
517 <span class="core-logo-brand-menu__name">Reversed</span> 518 <span class="core-logo-brand-menu__actions"> 519 <a 520 href="/dist/brand/okay-dev-brand-kit/logos/stacked/svg/okay-dev-stacked-white-black-black.svg" 521 download 522 data-router-disabled 523 role="menuitem" 524 tabindex="-1" 525 aria-label="Download stacked logo, white shade, black fill, and black smiley as SVG" 526 >SVG</a> 527 <a 528 href="/dist/brand/okay-dev-brand-kit/logos/stacked/png/okay-dev-stacked-white-black-black-1000w.png" 529 download 530 data-router-disabled 531 role="menuitem" 532 tabindex="-1" 533 aria-label="Download stacked logo, white shade, black fill, and black smiley as PNG" 534 >PNG</a> 535 </span> 536 </div> 537 </div> 538 </div> 539 <div 540 class="core-logo-brand-menu__group" 541 role="group" 542 aria-labelledby="brand-menu-smiley" 543 > 544 <button 545 type="button" 546 class="core-logo-brand-menu__toggle" 547 id="brand-menu-smiley" 548 data-brand-accordion-toggle 549 role="menuitem" 550 tabindex="-1" 551 aria-expanded="false" 552 aria-controls="brand-menu-assets-smiley" 553 > 554 <span class="core-logo-brand-menu__chevron" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="m9 6 6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> 555</span> 556 <span class="core-logo-brand-menu__label">Smiley</span> 557 <span class="core-logo-brand-menu__preview core-logo-brand-menu__preview--dark" aria-hidden="true"> 558 <img src="/dist/brand/okay-dev-brand-kit/marks/filled/svg/okay-dev-mark-filled-yellow.svg" alt="" loading="lazy" decoding="async"> 559 </span> 560 </button> 561 <div class="core-logo-brand-menu__assets" id="brand-menu-assets-smiley" hidden inert> 562 <div class="core-logo-brand-menu__asset"> 563 <span 564 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--dark" 565 aria-hidden="true" 566 > 567 <img 568 src="/dist/brand/okay-dev-brand-kit/marks/filled/svg/okay-dev-mark-filled-yellow.svg" 569 alt="" 570 loading="lazy" 571 decoding="async" 572 > 573 </span>
574 <span class="core-logo-brand-menu__name">Filled yellow</span> 575 <span class="core-logo-brand-menu__actions"> 576 <a 577 href="/dist/brand/okay-dev-brand-kit/marks/filled/svg/okay-dev-mark-filled-yellow.svg" 578 download 579 data-router-disabled 580 role="menuitem" 581 tabindex="-1" 582 aria-label="Download filled yellow smiley with black features as SVG" 583 >SVG</a> 584 <a 585 href="/dist/brand/okay-dev-brand-kit/marks/filled/png/okay-dev-mark-filled-yellow-512px.png" 586 download 587 data-router-disabled 588 role="menuitem" 589 tabindex="-1" 590 aria-label="Download filled yellow smiley with black features as PNG" 591 >PNG</a> 592 </span> 593 </div> 594 <div class="core-logo-brand-menu__asset"> 595 <span 596 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--light" 597 aria-hidden="true" 598 > 599 <img 600 src="/dist/brand/okay-dev-brand-kit/marks/outlined/svg/okay-dev-mark-outlined-black.svg" 601 alt="" 602 loading="lazy" 603 decoding="async" 604 > 605 </span> 606 <span class="core-logo-brand-menu__name">Outline black</span> 607 <span class="core-logo-brand-menu__actions"> 608 <a 609 href="/dist/brand/okay-dev-brand-kit/marks/outlined/svg/okay-dev-mark-outlined-black.svg" 610 download 611 data-router-disabled 612 role="menuitem" 613 tabindex="-1" 614 aria-label="Download outlined black smiley as SVG" 615 >SVG</a> 616 <a 617 href="/dist/brand/okay-dev-brand-kit/marks/outlined/png/okay-dev-mark-outlined-black-512px.png" 618 download 619 data-router-disabled 620 role="menuitem" 621 tabindex="-1" 622 aria-label="Download outlined black smiley as PNG" 623 >PNG</a> 624 </span> 625 </div> 626 <div class="core-logo-brand-menu__asset">
627 <span 628 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--dark" 629 aria-hidden="true" 630 > 631 <img 632 src="/dist/brand/okay-dev-brand-kit/marks/outlined/svg/okay-dev-mark-outlined-white.svg" 633 alt="" 634 loading="lazy" 635 decoding="async" 636 > 637 </span> 638 <span class="core-logo-brand-menu__name">Outline white</span> 639 <span class="core-logo-brand-menu__actions"> 640 <a 641 href="/dist/brand/okay-dev-brand-kit/marks/outlined/svg/okay-dev-mark-outlined-white.svg" 642 download 643 data-router-disabled 644 role="menuitem" 645 tabindex="-1" 646 aria-label="Download outlined white smiley as SVG" 647 >SVG</a> 648 <a 649 href="/dist/brand/okay-dev-brand-kit/marks/outlined/png/okay-dev-mark-outlined-white-512px.png" 650 download 651 data-router-disabled 652 role="menuitem" 653 tabindex="-1" 654 aria-label="Download outlined white smiley as PNG" 655 >PNG</a> 656 </span> 657 </div> 658 </div> 659 </div> 660 <div 661 class="core-logo-brand-menu__group" 662 role="group" 663 aria-labelledby="brand-menu-okay-pick-primary" 664 > 665 <button 666 type="button" 667 class="core-logo-brand-menu__toggle" 668 id="brand-menu-okay-pick-primary" 669 data-brand-accordion-toggle 670 role="menuitem" 671 tabindex="-1" 672 aria-expanded="false" 673 aria-controls="brand-menu-assets-okay-pick-primary" 674 > 675 <span class="core-logo-brand-menu__chevron" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="m9 6 6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> 676</span> 677 <span class="core-logo-brand-menu__label">Okay Pick · Primary</span> 678 <span class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" aria-hidden="true"> 679 <img src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-yellow.svg" alt="" loading="lazy" decoding="async"> 680 </span> 681 </button> 682 <div class="core-logo-brand-menu__assets" id="brand-menu-assets-okay-pick-primary" hidden inert> 683 <div class="core-logo-brand-menu__asset">
684 <span 685 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 686 aria-hidden="true" 687 > 688 <img 689 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-yellow.svg" 690 alt="" 691 loading="lazy" 692 decoding="async" 693 > 694 </span> 695 <span class="core-logo-brand-menu__name">Yellow</span> 696 <span class="core-logo-brand-menu__actions"> 697 <a 698 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-yellow.svg" 699 download 700 data-router-disabled 701 role="menuitem" 702 tabindex="-1" 703 aria-label="Download Okay Pick primary badge, yellow as SVG" 704 >SVG</a> 705 <a 706 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/png/okay-pick-primary-yellow-384px.png" 707 download 708 data-router-disabled 709 role="menuitem" 710 tabindex="-1" 711 aria-label="Download Okay Pick primary badge, yellow as PNG" 712 >PNG</a> 713 </span> 714 </div> 715 <div class="core-logo-brand-menu__asset"> 716 <span 717 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 718 aria-hidden="true" 719 > 720 <img 721 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-black.svg" 722 alt="" 723 loading="lazy" 724 decoding="async" 725 > 726 </span> 727 <span class="core-logo-brand-menu__name">Black</span> 728 <span class="core-logo-brand-menu__actions"> 729 <a 730 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-black.svg" 731 download 732 data-router-disabled 733 role="menuitem" 734 tabindex="-1" 735 aria-label="Download Okay Pick primary badge, black as SVG" 736 >SVG</a> 737 <a 738 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/png/okay-pick-primary-black-384px.png" 739 download 740 data-router-disabled 741 role="menuitem" 742 tabindex="-1" 743 aria-label="Download Okay Pick primary badge, black as PNG" 744 >PNG</a> 745 </span> 746 </div> 747 <div class="core-logo-brand-menu__asset">
748 <span 749 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 750 aria-hidden="true" 751 > 752 <img 753 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-white.svg" 754 alt="" 755 loading="lazy" 756 decoding="async" 757 > 758 </span> 759 <span class="core-logo-brand-menu__name">White</span> 760 <span class="core-logo-brand-menu__actions"> 761 <a 762 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-white.svg" 763 download 764 data-router-disabled 765 role="menuitem" 766 tabindex="-1" 767 aria-label="Download Okay Pick primary badge, white as SVG" 768 >SVG</a> 769 <a 770 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/png/okay-pick-primary-white-384px.png" 771 download 772 data-router-disabled 773 role="menuitem" 774 tabindex="-1" 775 aria-label="Download Okay Pick primary badge, white as PNG" 776 >PNG</a> 777 </span> 778 </div> 779 <div class="core-logo-brand-menu__asset"> 780 <span 781 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 782 aria-hidden="true" 783 > 784 <img 785 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-light-gray.svg" 786 alt="" 787 loading="lazy" 788 decoding="async" 789 > 790 </span> 791 <span class="core-logo-brand-menu__name">Light Gray</span> 792 <span class="core-logo-brand-menu__actions"> 793 <a 794 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/svg/okay-pick-primary-light-gray.svg" 795 download 796 data-router-disabled 797 role="menuitem" 798 tabindex="-1" 799 aria-label="Download Okay Pick primary badge, light-gray as SVG" 800 >SVG</a> 801 <a 802 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/primary/png/okay-pick-primary-light-gray-384px.png" 803 download 804 data-router-disabled 805 role="menuitem" 806 tabindex="-1" 807 aria-label="Download Okay Pick primary badge, light-gray as PNG" 808 >PNG</a> 809 </span> 810 </div> 811 </div> 812 </div> 813 <div 814 class="core-logo-brand-menu__group" 815 role="group" 816 aria-labelledby="brand-menu-okay-pick-icon" 817 > 818 <button 819 type="button" 820 class="core-logo-brand-menu__toggle" 821 id="brand-menu-okay-pick-icon" 822 data-brand-accordion-toggle 823 role="menuitem" 824 tabindex="-1" 825 aria-expanded="false" 826 aria-controls="brand-menu-assets-okay-pick-icon" 827 >
828 <span class="core-logo-brand-menu__chevron" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="m9 6 6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> 829</span> 830 <span class="core-logo-brand-menu__label">Okay Pick · Icon</span> 831 <span class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" aria-hidden="true"> 832 <img src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-yellow.svg" alt="" loading="lazy" decoding="async"> 833 </span> 834 </button> 835 <div class="core-logo-brand-menu__assets" id="brand-menu-assets-okay-pick-icon" hidden inert> 836 <div class="core-logo-brand-menu__asset"> 837 <span 838 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 839 aria-hidden="true" 840 > 841 <img 842 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-yellow.svg" 843 alt="" 844 loading="lazy" 845 decoding="async" 846 > 847 </span> 848 <span class="core-logo-brand-menu__name">Yellow</span> 849 <span class="core-logo-brand-menu__actions"> 850 <a 851 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-yellow.svg" 852 download 853 data-router-disabled 854 role="menuitem" 855 tabindex="-1" 856 aria-label="Download Okay Pick icon badge, yellow as SVG" 857 >SVG</a> 858 <a 859 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/png/okay-pick-icon-yellow-176px.png" 860 download 861 data-router-disabled 862 role="menuitem" 863 tabindex="-1" 864 aria-label="Download Okay Pick icon badge, yellow as PNG" 865 >PNG</a> 866 </span> 867 </div> 868 <div class="core-logo-brand-menu__asset"> 869 <span 870 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 871 aria-hidden="true" 872 > 873 <img 874 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-black.svg" 875 alt="" 876 loading="lazy" 877 decoding="async" 878 > 879 </span>
880 <span class="core-logo-brand-menu__name">Black</span> 881 <span class="core-logo-brand-menu__actions"> 882 <a 883 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-black.svg" 884 download 885 data-router-disabled 886 role="menuitem" 887 tabindex="-1" 888 aria-label="Download Okay Pick icon badge, black as SVG" 889 >SVG</a> 890 <a 891 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/png/okay-pick-icon-black-176px.png" 892 download 893 data-router-disabled 894 role="menuitem" 895 tabindex="-1" 896 aria-label="Download Okay Pick icon badge, black as PNG" 897 >PNG</a> 898 </span> 899 </div> 900 <div class="core-logo-brand-menu__asset"> 901 <span 902 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 903 aria-hidden="true" 904 > 905 <img 906 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-white.svg" 907 alt="" 908 loading="lazy" 909 decoding="async" 910 > 911 </span> 912 <span class="core-logo-brand-menu__name">White</span> 913 <span class="core-logo-brand-menu__actions"> 914 <a 915 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-white.svg" 916 download 917 data-router-disabled 918 role="menuitem" 919 tabindex="-1" 920 aria-label="Download Okay Pick icon badge, white as SVG" 921 >SVG</a> 922 <a 923 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/png/okay-pick-icon-white-176px.png" 924 download 925 data-router-disabled 926 role="menuitem" 927 tabindex="-1" 928 aria-label="Download Okay Pick icon badge, white as PNG" 929 >PNG</a> 930 </span> 931 </div> 932 <div class="core-logo-brand-menu__asset">
933 <span 934 class="core-logo-brand-menu__preview core-logo-brand-menu__preview--transparent" 935 aria-hidden="true" 936 > 937 <img 938 src="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-light-gray.svg" 939 alt="" 940 loading="lazy" 941 decoding="async" 942 > 943 </span> 944 <span class="core-logo-brand-menu__name">Light Gray</span> 945 <span class="core-logo-brand-menu__actions"> 946 <a 947 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/svg/okay-pick-icon-light-gray.svg" 948 download 949 data-router-disabled 950 role="menuitem" 951 tabindex="-1" 952 aria-label="Download Okay Pick icon badge, light-gray as SVG" 953 >SVG</a> 954 <a 955 href="/dist/brand/okay-dev-brand-kit/awards/okay-pick/icon/png/okay-pick-icon-light-gray-176px.png" 956 download 957 data-router-disabled 958 role="menuitem" 959 tabindex="-1" 960 aria-label="Download Okay Pick icon badge, light-gray as PNG" 961 >PNG</a> 962 </span> 963 </div> 964 </div> 965 </div> 966 967 968 </div> 969 </div> 970 </div> 971 </div> 972 973 974 975<nav class="core-nav"> 976 977 <button class="btn-mobile-nav" aria-label="Navigation menu toggle"> 978 <span class="mobile-nav-toggle-icon" aria-hidden="true"> 979 <span class="mobile-nav-toggle-line mobile-nav-toggle-line-top"></span> 980 <span class="mobile-nav-toggle-line mobile-nav-toggle-line-middle"></span> 981 <span class="mobile-nav-toggle-line mobile-nav-toggle-line-bottom"></span> 982 </span> 983 </button> 984 985 <div id="okaydev-navbar-leading-root" class="okaydev-navbar-leading-root"> 986 <div id="dynamic-block-1299141225" class="dynamic-block" data-site="1" data-template="MjEzNjNhZDgwZjVjMzVhODBiOTQyN2I2M2M2ODY2YWIwMTRlOTI5MTA2YjYyYzMwYTY3NmE2MWJkZjNkYzc3OV8vcGFydGlhbHMvbmF2L2R5bmFtaWMvbmF2YmFyLW1vYmlsZS1hdmF0YXItaXNsYW5k" data-args="eJxLtDKwqq4FAAZPAf4=" data-ignore-missing="false"> </div> </div> 987 988 <div class="core-nav-list"> 989 <ul class="core-nav-list-primary"> 990 991 <li class="core-nav-list-social"> 992 <div class="core-nav-list-link-row"> 993 <a class="label-1 prefetch-hover" href="https://okaydev.co/social"> 994 <span class="core-nav-link-roll"> 995 <span>Social</span> 996 <span aria-hidden="true">Social</span> 997 </span> 998 </a> 999 1000 </div> 1001 1002 </li> 1003 1004 <li class="core-nav-list-projects"> 1005 <div class="core-nav-list-link-row"> 1006 <a class="label-1 prefetch-hover" href="https://okaydev.co/gallery">
1007 <span class="core-nav-link-roll"> 1008 <span>Gallery</span> 1009 <span aria-hidden="true">Gallery</span> 1010 </span> 1011 </a> 1012 1013 </div> 1014 1015 </li> 1016 1017 <li class="core-nav-list-directory"> 1018 <div class="core-nav-list-link-row"> 1019 <a class="label-1 prefetch-hover" href="https://okaydev.co/directory"> 1020 <span class="core-nav-link-roll"> 1021 <span>Directory</span> 1022 <span aria-hidden="true">Directory</span> 1023 </span> 1024 </a> 1025 1026 </div> 1027 1028 </li> 1029 1030 <li class="core-nav-list-articles"> 1031 <div class="core-nav-list-link-row"> 1032 <a class="label-1 prefetch-hover" href="https://okaydev.co/articles"> 1033 <span class="core-nav-link-roll"> 1034 <span>Articles</span> 1035 <span aria-hidden="true">Articles</span> 1036 </span> 1037 </a> 1038 1039 </div> 1040 1041 </li> 1042 1043 <li class="core-nav-list-jobs"> 1044 <div class="core-nav-list-link-row"> 1045 <a class="label-1 prefetch-hover" href="https://okaydev.co/jobs"> 1046 <span class="core-nav-link-roll"> 1047 <span>Jobs</span> 1048 <span aria-hidden="true">Jobs</span> 1049 </span> 1050 </a> 1051 1052 </div> 1053 1054 </li> 1055 1056 <li class="core-nav-list-pricing core-nav-list-pricing"> 1057 <div class="core-nav-list-link-row"> 1058 <a class="label-1 prefetch-hover" href="https://okaydev.co/pricing"> 1059 <span class="core-nav-link-roll"> 1060 <span>Pricing</span> 1061 <span aria-hidden="true">Pricing</span> 1062 </span> 1063 </a> 1064 1065 <span id="okaydev-nav-go-pro-mount" class="okaydev-nav-go-pro-mount"> 1066 <div id="dynamic-block-1041572241" class="dynamic-block" data-site="1" data-template="MGFjNTAxYzQ3ZmU3OWFkMGE1MTg5YjZmODY0YmMxOTgzNzViZjAxN2YwODk1MDgwNjRlOWJkZDk1MmMyYjZiOF8vcGFydGlhbHMvbmF2L2R5bmFtaWMvbmF2YmFyLXByaWNpbmctZ28tcHJvLWlzbGFuZA==" data-args="eJxLtDKwqq4FAAZPAf4=" data-ignore-missing="false"> <span class="navbar-pricing-go-pro-ph" aria-hidden="true"></span> 1067 </div> </span> 1068 </div> 1069 1070 </li> 1071 1072 <div id="dynamic-block-1614719068" class="dynamic-block" data-site="1" data-template="Yjk0M2RjY2NiZDgwZTE2ZTQ4OGM2ODIyM2M3NDY1NjM2ODllN2IzMzI3ODRiMGM1MDljN2I1NWIxYjMxODVlMV8vcGFydGlhbHMvbmF2L2R5bmFtaWMvbmF2YmFyLWFkZC1wcm9qZWN0LWxpLWlzbGFuZA==" data-args="eJxLtDKwqq4FAAZPAf4=" data-ignore-missing="false"> <li class="core-nav-list-add-project is-empty" id="okaydev-nav-add-project-slot" hidden aria-hidden="true"></li> 1073 </div> 1074 </ul> 1075 1076 1077 <div id="okaydev-navbar-auth-root" class="okaydev-navbar-auth-root is-navbar-auth-guest"> 1078 <span class="core-nav-mobile-account-bg" aria-hidden="true"></span>
1079 <span class="core-nav-mobile-account-divider" aria-hidden="true"></span> 1080 1081 1082<div class="sign-up"> 1083 <a class="button btn-core-sign-up" href="https://okaydev.co/sign-up"> 1084 Sign Up 1085 <svg aria-hidden="true" class="hide-on-mobile" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path fill="#0C0C0C" d="m10 15.68-.766-.774 4.364-4.364H4.32V9.458h9.277L9.234 5.095 10 4.32 15.68 10 10 15.68Z"/></svg> 1086<svg aria-hidden="true" class="hide-on-desktop" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#0C0C0C" d="m12 19.23-.713-.707L17.31 12.5H4.77v-1h12.54l-6.023-6.023.713-.708L19.23 12 12 19.232Z"/></svg> </a> 1087</div> 1088 1089<div class="sign-in"> 1090 <a class="button label-1 btn-core-login" href="https://okaydev.co/login"> 1091 <span class="core-nav-link-roll"> 1092 <span>Login</span> 1093 <span aria-hidden="true">Login</span> 1094 </span> 1095 <span class="sr-only">Login</span> 1096 </a> 1097</div> 1098 1099<div class="core-nav-guest-extra"> 1100 <nav aria-label="Secondary navigation"> 1101 <ul class="core-nav-guest-secondary"> 1102 <li><a href="https://okaydev.co/about">About</a></li> 1103 <li><a href="https://okaydev.co/faqs">FAQs</a></li> 1104 <li><a href="https://okaydev.co/brand">Brand</a></li> 1105 <li><a href="https://okaydev.co/contact">Contact</a></li> 1106 <li><a href="https://okaydev.co/newsletter" data-dialog="newsletter" aria-haspopup="dialog">Newsletter</a></li> 1107 </ul> 1108 </nav> 1109 <nav class="core-nav-guest-social-nav" aria-label="Social links"> 1110 <p class="core-nav-guest-social-eyebrow label-2">Follow OkayDev</p> 1111 <ul class="core-nav-guest-social"> 1112 <li> 1113 <a href="https://okaydev.co/u/okaydev" aria-label="OkayDev on OkayDev"> 1114 <span aria-hidden="true"><svg class="bento-social-mark bento-social-mark--okaydev" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 250 250"> 1115 <circle cx="125" cy="125" r="117" fill="none" stroke="currentColor" stroke-width="16"/> 1116 <path d="M55 160c20 28 41 38 70 38s50-10 70-38" fill="none" stroke="currentColor" stroke-width="16"/> 1117 <path d="m142 55-34 95" fill="none" stroke="currentColor" stroke-width="15"/> 1118 <path d="M84.3 130 59.3 105 84.3 80M165.7 130 190.7 105 165.7 80" fill="none" stroke="currentColor" stroke-width="15"/> 1119</svg> 1120</span> 1121 </a> 1122 </li> 1123 <li> 1124 <a href="https://x.com/okaydevs" aria-label="OkayDev on X" target="_blank" rel="noopener"> 1125 <span aria-hidden="true"><svg class="bento-social-mark bento-social-mark--x" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 1227"> 1126 <path fill="currentColor" d="M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"/> 1127</svg> 1128</span> 1129 </a> 1130 </li> 1131 <li> 1132 <a href="https://bsky.app/profile/okaydev.co" aria-label="OkayDev on Bluesky" target="_blank" rel="noopener">
1133 <span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 226"> 1134 <path fill="currentColor" d="M55.491 15.172c29.35 22.035 60.917 66.712 72.509 90.686 11.592-23.974 43.159-68.651 72.509-90.686C221.686-.727 256-13.028 256 26.116c0 7.818-4.482 65.674-7.111 75.068-9.138 32.654-42.436 40.983-72.057 35.942 51.775 8.812 64.946 38 36.501 67.187-54.021 55.433-77.644-13.908-83.696-31.676-1.11-3.257-1.63-4.78-1.637-3.485-.008-1.296-.527.228-1.637 3.485-6.052 17.768-29.675 87.11-83.696 31.676-28.445-29.187-15.274-58.375 36.5-67.187-29.62 5.041-62.918-3.288-72.056-35.942C4.482 91.79 0 33.934 0 26.116 0-13.028 34.314-.727 55.491 15.172Z"/> 1135</svg> 1136</span> 1137 </a> 1138 </li> 1139 <li> 1140 <a href="https://www.instagram.com/okaydevs" aria-label="OkayDev on Instagram" target="_blank" rel="noopener"> 1141 <span aria-hidden="true"><svg class="bento-social-mark bento-social-mark--instagram" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 264.583 264.583"> 1142 <path fill="currentColor" d="M132.345 33.973c-26.716 0-30.07.117-40.563.594-10.472.48-17.62 2.136-23.876 4.567-6.47 2.51-11.958 5.87-17.426 11.335-5.472 5.464-8.834 10.948-11.354 17.412-2.44 6.252-4.1 13.397-4.57 23.858-.47 10.486-.593 13.838-.593 40.535 0 26.697.119 30.037.594 40.522.482 10.465 2.14 17.609 4.57 23.859 2.515 6.465 5.876 11.95 11.346 17.414 5.466 5.468 10.955 8.834 17.42 11.345 6.26 2.431 13.41 4.088 23.881 4.567 10.493.477 13.844.594 40.559.594 26.719 0 30.061-.117 40.555-.594 10.472-.48 17.63-2.136 23.888-4.567 6.468-2.51 11.948-5.877 17.414-11.345 5.472-5.464 8.834-10.949 11.354-17.412 2.419-6.252 4.079-13.398 4.57-23.858.472-10.486.595-13.828.595-40.525s-.123-30.047-.594-40.533c-.492-10.465-2.152-17.608-4.57-23.858-2.521-6.466-5.883-11.95-11.355-17.414-5.472-5.468-10.944-8.827-17.42-11.335-6.271-2.431-13.424-4.088-23.897-4.567-10.493-.477-13.834-.594-40.558-.594zm-8.825 17.715c2.62-.004 5.542 0 8.825 0 26.266 0 29.38.094 39.752.565 9.591.438 14.797 2.04 18.264 3.385 4.591 1.782 7.864 3.912 11.305 7.352 3.443 3.44 5.575 6.717 7.362 11.305 1.346 3.46 2.951 8.663 3.388 18.247.47 10.363.573 13.475.573 39.71 0 26.233-.102 29.346-.573 39.709-.44 9.584-2.042 14.786-3.388 18.247-1.783 4.587-3.919 7.854-7.362 11.292-3.443 3.441-6.712 5.57-11.305 7.352-3.463 1.352-8.673 2.95-18.264 3.388-10.37.47-13.486.573-39.752.573-26.268 0-29.38-.102-39.751-.573-9.592-.443-14.797-2.044-18.267-3.39-4.59-1.781-7.87-3.911-11.313-7.352-3.443-3.44-5.574-6.709-7.362-11.298-1.346-3.461-2.95-8.663-3.387-18.247-.472-10.363-.566-13.476-.566-39.726s.094-29.347.566-39.71c.438-9.584 2.04-14.786 3.387-18.25 1.783-4.588 3.919-7.865 7.362-11.305 3.443-3.441 6.722-5.57 11.313-7.357 3.468-1.351 8.675-2.949 18.267-3.389 9.075-.41 12.592-.532 30.926-.553zm61.337 16.322c-6.518 0-11.805 5.277-11.805 11.792 0 6.512 5.287 11.796 11.805 11.796 6.517 0 11.804-5.284 11.804-11.796 0-6.513-5.287-11.796-11.805-11.796zm-52.512 13.782c-27.9 0-50.519 22.603-50.519 50.482 0 27.879 22.62 50.471 50.52 50.471s50.51-22.592 50.51-50.471c0-27.879-22.613-50.482-50.513-50.482zm0 17.715c18.11 0 32.792 14.67 32.792 32.767 0 18.096-14.683 32.767-32.792 32.767-18.11 0-32.791-14.671-32.791-32.767 0-18.098 14.68-32.767 32.791-32.767Z"/> 1143</svg> 1144</span> 1145 </a> 1146 </li> 1147 <li> 1148 <a href="https://www.linkedin.com/company/okay-dev" aria-label="OkayDev on LinkedIn" target="_blank" rel="noopener"> 1149 <span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"> 1150 <path fill="currentColor" d="M218.123 218.127h-37.931v-59.403c0-14.165-.253-32.4-19.728-32.4-19.756 0-22.779 15.434-22.779 31.369v60.43h-37.93V95.967h36.413v16.694h.51a39.907 39.907 0 0 1 35.928-19.733c38.445 0 45.533 25.288 45.533 58.186l-.016 67.013ZM56.955 79.27c-12.157.002-22.014-9.852-22.016-22.009-.002-12.157 9.851-22.014 22.008-22.016 12.157-.003 22.014 9.851 22.016 22.008A22.013 22.013 0 0 1 56.955 79.27m18.966 138.858H37.95V95.967h37.97v122.16ZM237.033.018H18.89C8.58-.098.125 8.161-.001 18.471v219.053c.122 10.315 8.576 18.582 18.89 18.474h218.144c10.336.128 18.823-8.139 18.966-18.474V18.454c-.147-10.33-8.635-18.588-18.966-18.453"/>
1150 1151</svg> 1152</span> 1153 </a> 1154 </li> 1155 <li> 1156 <a href="https://github.com/okaydevco" aria-label="OkayDev on GitHub" target="_blank" rel="noopener"> 1157 <span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"> 1158 <path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M512 0C229.12 0 0 229.12 0 512c0 226.56 146.56 417.92 350.08 485.76 25.6 4.48 35.2-10.88 35.2-24.32 0-12.16-.64-52.48-.64-95.36-128.64 23.68-161.92-31.36-172.16-60.16-5.76-14.72-30.72-60.16-52.48-72.32-17.92-9.6-43.52-33.28-.64-33.92 40.32-.64 69.12 37.12 78.72 52.48 46.08 77.44 119.68 55.68 149.12 42.24 4.48-33.28 17.92-55.68 32.64-68.48-113.92-12.8-232.96-56.96-232.96-252.8 0-55.68 19.84-101.76 52.48-137.6-5.12-12.8-23.04-65.28 5.12-135.68 0 0 42.88-13.44 140.8 52.48 40.96-11.52 84.48-17.28 128-17.28s87.04 5.76 128 17.28c97.92-66.56 140.8-52.48 140.8-52.48 28.16 70.4 10.24 122.88 5.12 135.68 32.64 35.84 52.48 81.28 52.48 137.6 0 196.48-119.68 240-233.6 252.8 18.56 16 34.56 46.72 34.56 94.72 0 68.48-.64 123.52-.64 140.8 0 13.44 9.6 29.44 35.2 24.32C877.44 929.92 1024 737.92 1024 512 1024 229.12 794.88 0 512 0"/> 1159</svg> 1160</span> 1161 </a> 1162 </li> 1163 </ul> 1164 </nav> 1165</div> 1166 </div> 1167 1168 </div> 1169 1170 <div class="mobile-content-cover"></div> 1171 1172</nav> 1173 </div> 1174 1175 <button type="button" 1176 class="social-feed-top-button" 1177 data-social-feed-top-button 1178 aria-label="Jump to top" 1179 hidden> 1180 <span class="social-feed-top-button-icon" aria-hidden="true"> 1181 <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M11.29 8.71L6.7 13.3c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L12 10.83l3.88 3.88c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L12.7 8.71c-.38-.39-1.02-.39-1.41 0z"/></svg> </span> 1182 <span class="social-feed-top-button-label">TOP</span> 1183 <span class="social-feed-top-button-spinner" aria-hidden="true"></span> 1184</button> 1185 1186 </header> 1187
1187<script> 1188 (function () { 1189 // Clear before the first paint, including when older critical CSS still 1190 // contains the unconditional intro-hide selector. Do not wait for app.js. 1191 if (document.documentElement.dataset.headerIntroSeen === 'true') { 1192 var header = document.currentScript.previousElementSibling; 1193 header.removeAttribute('data-header-enter-pending'); 1194 // Servd may hydrate after the app boots; its avatar entrance should 1195 // also stay skipped when this tab has already shown the header. 1196 header.querySelectorAll('.okaydev-navbar-leading-root, .okaydev-navbar-auth-root').forEach(function (root) { 1197 root.classList.add('is-navbar-auth-refreshed'); 1198 }); 1199 } 1200 })(); 1201 </script>
1201 1202 <div class="app-logo"> 1203 <a 1204 class="app-logo-link" 1205 href="https://okaydev.co/" 1206 aria-label="OkayDev, Home" 1207 data-app-tab="home" 1208 > 1209 <svg class="app-logo-mark" viewBox="0 0 1483 276" aria-hidden="true" focusable="false"> 1210 <g class="app-logo-shade"> 1211 <path d="M1350.75 34.5V4H1252.25L1202.25 54V272H1374.75L1424.75 222L1483 4H1381.25L1350.75 34.5Z"/> 1212 <path d="M1088.75 4L1038.75 54V272H1211L1261 222V4H1088.75Z"/> 1213 <path d="M875.5 4L825.5 54V272H935.5C967 272 996 259.75 1016.5 239.25L1066.5 189.25C1086.5 169.25 1099.25 142.5 1099.25 113C1099.25 53 1047.75 4 985.5 4H875.5Z"/> 1214 <path d="M791.75 272L841.75 222L900 4H795.25L777.5 21.75V4H680.25L630.25 54V235.5H696.75L687 272H791.75Z"/> 1215 <path d="M540.25 240.25V272H638.25L688.25 222V4H515L465 54L406.75 272H508.5L540.25 240.25Z"/> 1216 <path d="M337 254.25V272H434.25L484.25 222V85.25H465.5L487.25 4H272L222 54V272H319.25L337 254.25Z"/> 1217 <path d="M197.25 243.5L247.25 193.5C269 173 282.5 144.5 282.5 112.75C282.5 50.75 229.75 0 166.5 0C135 0 106.5 12 85.5 31.75L35.5 81.75C14.25 103 0 131 0 162.75C0 225.25 52 276 116.5 276C147.75 276 176.25 263.75 197.25 243.5Z"/> 1218 </g> 1219 <g class="app-logo-fill"> 1220 <path d="M1261.25 13V213H1417.75L1471.25 13H1388.25L1356.25 132C1353.75 141 1341.75 140.25 1341.75 130V13H1261.25Z"/> 1221 <path d="M1097.75 13V213H1252V145.5H1207V107H1184.5C1177.25 107 1172 101.5 1172 93.75C1172 86 1177.25 80.5 1184.5 80.5H1252V13H1097.75Z"/> 1222 <path d="M884.5 13V213H985.5C1043 213 1090.25 168 1090.25 113C1090.25 58 1043 13 985.5 13H884.5ZM953 113C953 97.25 966 84.25 981.75 84.25C997.5 84.25 1010.25 97.25 1010.25 113C1010.25 128.75 997.5 141.75 981.75 141.75C966 141.75 953 128.75 953 113Z"/> 1223 <path d="M758.5 176.5L748.75 213H834.75L888.25 13H802.25L778.5 101.25C777 107 768.5 105.5 768.5 99.25V13H689.25V176.5H758.5Z"/> 1224 <path d="M522 13L468.5 213H551.5L564.75 163.75H599.25V213H679.25V13H522ZM568.25 90.5C568.25 79.25 577.5 70.25 588.5 70.25C599.5 70.25 608.5 79.25 608.5 90.5C608.5 101.5 599.5 110.5 588.5 110.5C577.5 110.5 568.25 101.5 568.25 90.5Z"/> 1225 <path d="M281 13V213H360.25V151.25H396V213H475.25V94.25H453.75L475.5 13H381V71C381 88.25 360.25 88.25 360.25 71V13H281Z"/> 1226 <path d="M166.5 217C225 217 273.5 170.25 273.5 112.75C273.5 55.75 225 9 166.5 9C106.75 9 59 55.75 59 112.75C59 170.25 106.75 217 166.5 217ZM137.25 113C137.25 97.25 150.5 84.25 166.25 84.25C181.5 84.25 194.5 97.25 194.5 113C194.5 129 181.5 141.75 166.25 141.75C150.5 141.75 137.25 129 137.25 113Z"/> 1227 </g> 1228 </svg> 1229 </a> 1230</div> 1231</div> 1232 1233 <main data-router-wrapper> 1234 1235 1236 <section data-router-view="login" data-handle="login" data-theme="dark" data-sticky-mobile-header="true"> 1237 1238 <div class="auth-shell-bg" aria-hidden="true"> 1239 <div class="auth-shell-bg-shadow"> 1240 <img 1241 src="/dist/images/home/hero/bg-shadow.webp" 1242 width="1577" 1243 height="997" 1244 alt="" 1245 > 1246 </div> 1247 <div class="auth-shell-grid-lines"></div> 1248</div> 1249 1250 <div class="login-container page-container wrapper okay-form"> 1251 1252 <div class="login-panel"> 1253 1254 <h1 class="heading"> 1255 Login 1256 </h1> 1257 1258 <div class="content"> 1259 1260 <form id="login-form" method="post" accept-charset="UTF-8"> 1261 <craft-csrf-input></craft-csrf-input> 1262 <input type="hidden" name="action" value="users/login"> 1263 1264 <div class="field-container"> 1265 <label for="loginName">Username or email</label> 1266 <input type="text" id="loginName" name="loginName" autocomplete="username" required> 1267 </div> 1268 1269 <div class="field-container field-container--password"> 1270 <div class="field-label-row"> 1271 <label for="password">Password</label> 1272 </div> 1273 <input type="password" id="password" name="password" autocomplete="current-password" required> 1274 <div class="password-reveal-wrapper"> 1275 <label for="password-reveal" title="Show/Hide Password"> 1276 <input id="password-reveal" type="checkbox" aria-label="Show/Hide Password">
1277 <span class="eye-outline"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M480.09-336.92q67.99 0 115.49-47.59t47.5-115.58q0-67.99-47.59-115.49t-115.58-47.5q-67.99 0-115.49 47.59t-47.5 115.58q0 67.99 47.59 115.49t115.58 47.5ZM480-392q-45 0-76.5-31.5T372-500q0-45 31.5-76.5T480-608q45 0 76.5 31.5T588-500q0 45-31.5 76.5T480-392Zm.05 172q-137.97 0-251.43-76.12Q115.16-372.23 61.54-500q53.62-127.77 167.02-203.88Q341.97-780 479.95-780q137.97 0 251.43 76.12Q844.84-627.77 898.46-500q-53.62 127.77-167.02 203.88Q618.03-220 480.05-220ZM480-500Zm0 220q113 0 207.5-59.5T832-500q-50-101-144.5-160.5T480-720q-113 0-207.5 59.5T128-500q50 101 144.5 160.5T480-280Z"/></svg></span> 1278 <span class="eye-fill"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M480.09-336.92q67.99 0 115.49-47.59t47.5-115.58q0-67.99-47.59-115.49t-115.58-47.5q-67.99 0-115.49 47.59t-47.5 115.58q0 67.99 47.59 115.49t115.58 47.5ZM480-392q-45 0-76.5-31.5T372-500q0-45 31.5-76.5T480-608q45 0 76.5 31.5T588-500q0 45-31.5 76.5T480-392Zm.05 172q-137.97 0-251.43-76.12Q115.16-372.23 61.54-500q53.62-127.77 167.02-203.88Q341.97-780 479.95-780q137.97 0 251.43 76.12Q844.84-627.77 898.46-500q-53.62 127.77-167.02 203.88Q618.03-220 480.05-220Z"/></svg></span> 1279 </label> 1280 </div> 1281 <a class="forgot-password" href="https://okaydev.co/forgot-password">Forgot password?</a> 1282 </div> 1283 1284 1285 <input type="hidden" id="rememberMe" name="rememberMe" value="1"> 1286 1287 <button type="submit" tabindex="0">Log in</button> 1288 </form> 1289 1290 <p class="sign-up-message"> 1291 Not a member yet? <a href="https://okaydev.co/sign-up">Sign up</a> 1292 </p> 1293 1294 </div> 1295 1296 </div> 1297 1298 </div> 1299 1300 </section> 1301 1302 </main> 1303 1304 1305 1306 1307<footer id="core-footer" class="core-footer core-footer--made-on" data-accent="black"> 1308 <div class="bento-page-bg" aria-hidden="true"> 1309 <div class="bento-page-bg__shadow"> 1310 <img 1311 src="https://images.okaydev.co/production/images/home/bg-shadow.webp?w=1577&h=997&auto=compress%2Cformat&fit=min&dm=1784704132&s=0d73f62cc40403b5d51e8e9e06a60810" 1312 width="1577" 1313 height="997" 1314 alt="" 1315 loading="lazy" decoding="async" > 1316 </div> 1317 <div class="bento-page-bg__grid-lines"></div> 1318 <div class="bento-page-bg__center-fade"></div> 1319 </div> 1320 1321 1322 1323<div class="bento-made-on" data-bento-made-on> 1324 <div class="bento-made-on__content"> 1325 <div class="bento-made-on__brand"> 1326 <p class="bento-made-on__copy">A Social Network & Portfolio Platform</p> 1327 <a class="bento-made-on__link" href="https://okaydev.co/" data-bento-made-on-logo> 1328 <span class="bento-made-on__logo"> 1329 <svg class="logo-okaydev" role="img" aria-label="OKAYDEV logo" width="1483" height="276" viewBox="0 0 1483 276" fill="none" xmlns="http://www.w3.org/2000/svg"> 1330 <g class="logo-shades" aria-hidden="true"> 1331 <path class="logo-letter-shadow" data-letter="V" d="M1350.75 34.5V4H1252.25L1202.25 54V272H1374.75L1424.75 222L1483 4H1381.25L1350.75 34.5Z" fill="var(--logo-fill-outer)"/> 1332 <path class="logo-letter-shadow" data-letter="E" d="M1088.75 4L1038.75 54V272H1211L1261 222V4H1088.75Z" fill="var(--logo-fill-outer)"/> 1333 <path class="logo-letter-shadow" data-letter="D" d="M875.5 4L825.5 54V272H935.5C967 272 996 259.75 1016.5 239.25L1066.5 189.25C1086.5 169.25 1099.25 142.5 1099.25 113C1099.25 53 1047.75 4 985.5 4H875.5Z" fill="var(--logo-fill-outer)"/> 1334 <path class="logo-letter-shadow" data-letter="Y" d="M791.75 272L841.75 222L900 4H795.25L777.5 21.75V4H680.25L630.25 54V235.5H696.75L687 272H791.75Z" fill="var(--logo-fill-outer)"/> 1335 <path class="logo-letter-shadow" data-letter="A" d="M540.25 240.25V272H638.25L688.25 222V4H515L4
133565 54L406.75 272H508.5L540.25 240.25Z" fill="var(--logo-fill-outer)"/> 1336 <path class="logo-letter-shadow" data-letter="K" d="M337 254.25V272H434.25L484.25 222V85.25H465.5L487.25 4H272L222 54V272H319.25L337 254.25Z" fill="var(--logo-fill-outer)"/> 1337 <path class="logo-letter-shadow" data-letter="O" d="M197.25 243.5L247.25 193.5C269 173 282.5 144.5 282.5 112.75C282.5 50.75 229.75 0 166.5 0C135 0 106.5 12 85.5 31.75L35.5 81.75C14.25 103 0 131 0 162.75C0 225.25 52 276 116.5 276C147.75 276 176.25 263.75 197.25 243.5Z" fill="var(--logo-fill-outer)"/> 1338 </g> 1339 1340 <g class="logo-faces"> 1341 <g class="logo-letter" data-letter="V"> 1342 <path class="logo-letter-face" d="M1261.25 13V213H1417.75L1471.25 13H1388.25L1356.25 132C1353.75 141 1341.75 140.25 1341.75 130V13H1261.25Z" fill="var(--logo-fill-inner)"/> 1343 </g> 1344 <g class="logo-letter" data-letter="E"> 1345 <path class="logo-letter-face" d="M1097.75 13V213H1252V145.5H1207V107H1184.5C1177.25 107 1172 101.5 1172 93.75C1172 86 1177.25 80.5 1184.5 80.5H1252V13H1097.75Z" fill="var(--logo-fill-inner)"/> 1346 </g> 1347 <g class="logo-letter" data-letter="D"> 1348 <path class="logo-letter-face" d="M884.5 13V213H985.5C1043 213 1090.25 168 1090.25 113C1090.25 58 1043 13 985.5 13H884.5ZM953 113C953 97.25 966 84.25 981.75 84.25C997.5 84.25 1010.25 97.25 1010.25 113C1010.25 128.75 997.5 141.75 981.75 141.75C966 141.75 953 128.75 953 113Z" fill="var(--logo-fill-inner)"/> 1349 </g> 1350 <g class="logo-letter" data-letter="Y"> 1351 <path class="logo-letter-face" d="M758.5 176.5L748.75 213H834.75L888.25 13H802.25L778.5 101.25C777 107 768.5 105.5 768.5 99.25V13H689.25V176.5H758.5Z" fill="var(--logo-fill-inner)"/> 1352 </g> 1353 <g class="logo-letter" data-letter="A"> 1354 <path class="logo-letter-face" d="M522 13L468.5 213H551.5L564.75 163.75H599.25V213H679.25V13H522ZM568.25 90.5C568.25 79.25 577.5 70.25 588.5 70.25C599.5 70.25 608.5 79.25 608.5 90.5C608.5 101.5 599.5 110.5 588.5 110.5C577.5 110.5 568.25 101.5 568.25 90.5Z" fill="var(--logo-fill-inner)"/> 1355 </g> 1356 <g class="logo-letter" data-letter="K"> 1357 <path class="logo-letter-face" d="M281 13V213H360.25V151.25H396V213H475.25V94.25H453.75L475.5 13H381V71C381 88.25 360.25 88.25 360.25 71V13H281Z" fill="var(--logo-fill-inner)"/> 1358 </g> 1359 <g class="logo-letter" data-letter="O"> 1360 <path class="logo-letter-face" d="M166.5 217C225 217 273.5 170.25 273.5 112.75C273.5 55.75 225 9 166.5 9C106.75 9 59 55.75 59 112.75C59 170.25 106.75 217 166.5 217ZM137.25 113C137.25 97.25 150.5 84.25 166.25 84.25C181.5 84.25 194.5 97.25 194.5 113C194.5 129 181.5 141.75 166.25 141.75C150.5 141.75 137.25 129 137.25 113Z" fill="var(--logo-fill-inner)"/> 1361 </g> 1362 </g> 1363</svg> 1364 </span> 1365 </a> 1366 </div> 1367 1368 <div class="bento-made-on__join"> 1369 <p class="bento-made-on__cta-heading"> 1370 Join for free and hang with creative people on the internet. 1371 </p> 1372 <a class="bento-button bento-made-on__cta" href="https://okaydev.co/sign-up"> 1373 <span class="bento-button__label">Make Your Profile</span> 1374 <span class="bento-external-icon" aria-hidden="true"><svg class="bento-external-icon__arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" aria-hidden="true"><path class="bento-external-icon__arrow-stem" d="M5.77 17.12 16.89 6"/><path d="M6.14 6H16.89V16"/></svg> 1375</span> 1376 </a> 1377 </div> 1378 1379 <div class="bento-made-on__nav-rows"> 1380 <nav class="bento-made-on__nav bento-made-on__nav--primary" aria-label="OkayDev"> 1381 <ul class="bento-made-on__nav-list"> 1382 <li> 1383 <a href="https://okaydev.co/">Home</a> 1384 </li> 1385 <li> 1386 <a href="https://okaydev.co/social">Social</a> 1387 </li> 1388 <li> 1389 <a href="https://okaydev.co/gallery">Gallery</a> 1390 </li> 1391 <li>
1392 <a href="https://okaydev.co/directory">Directory</a> 1393 </li> 1394 <li> 1395 <a href="https://okaydev.co/articles">Articles</a> 1396 </li> 1397 <li> 1398 <a href="https://okaydev.co/jobs">Jobs</a> 1399 </li> 1400 <li> 1401 <a href="https://okaydev.co/pricing">Pricing</a> 1402 </li> 1403 </ul> 1404 </nav> 1405 1406 <nav class="bento-made-on__nav bento-made-on__nav--secondary" aria-label="OkayDev secondary"> 1407 <ul class="bento-made-on__nav-list"> 1408 <li> 1409 <a class="" href="https://okaydev.co/about">About</a> 1410 </li> 1411 <li> 1412 <a class="is-text-transform-none" href="https://okaydev.co/faqs">FAQs</a> 1413 </li> 1414 <li> 1415 <a class="" href="https://okaydev.co/brand">Brand</a> 1416 </li> 1417 <li> 1418 <a class="" href="https://okaydev.co/contact">Contact</a> 1419 </li> 1420 <li> 1421 <a class="" href="https://okaydev.co/login">Login</a> 1422 </li> 1423 <li> 1424 <a class="" href="https://okaydev.co/sign-up">Sign up</a> 1425 </li> 1426 <li> 1427 <a href="/newsletter" data-dialog="newsletter" aria-haspopup="dialog">Newsletter</a> 1428 </li> 1429 </ul> 1430 </nav> 1431 1432 <nav class="bento-made-on__nav bento-made-on__nav--social" aria-label="OkayDev social"> 1433 <ul class="bento-made-on__nav-list"> 1434 <li> 1435 <a 1436 class="bento-made-on__social-link" 1437 href="https://okaydev.co/u/okaydev/social" 1438 aria-label="OkayDev social" 1439 title="OkayDev" 1440 > 1441 <span class="bento-made-on__social-logo bento-made-on__social-logo--okaydev-outline" aria-hidden="true"> 1442 <svg class="bento-social-mark bento-social-mark--okaydev" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 250 250"> 1443 <circle cx="125" cy="125" r="117" fill="none" stroke="currentColor" stroke-width="16"/> 1444 <path d="M55 160c20 28 41 38 70 38s50-10 70-38" fill="none" stroke="currentColor" stroke-width="16"/> 1445 <path d="m142 55-34 95" fill="none" stroke="currentColor" stroke-width="15"/> 1446 <path d="M84.3 130 59.3 105 84.3 80M165.7 130 190.7 105 165.7 80" fill="none" stroke="currentColor" stroke-width="15"/> 1447</svg> 1448 </span> 1449 </a> 1450 </li> 1451 <li> 1452 <a 1453 class="bento-made-on__social-link" 1454 href="https://x.com/okaydevs" 1455 target="_blank" 1456 rel="noopener" 1457 aria-label="OkayDev on X" title="X" > 1458 <sp
1458an class="bento-made-on__social-logo bento-made-on__social-logo--x" aria-hidden="true"> 1459 <svg class="bento-social-mark bento-social-mark--x" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 1227"> 1460 <path fill="currentColor" d="M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"/> 1461</svg> 1462 </span> 1463 </a> 1464 </li> 1465 <li> 1466 <a 1467 class="bento-made-on__social-link" 1468 href="https://bsky.app/profile/okaydev.co" 1469 target="_blank" 1470 rel="noopener" 1471 aria-label="OkayDev on Bluesky" title="Bluesky" > 1472 <span class="bento-made-on__social-logo bento-made-on__social-logo--bluesky" aria-hidden="true"> 1473 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 226"> 1474 <path fill="currentColor" d="M55.491 15.172c29.35 22.035 60.917 66.712 72.509 90.686 11.592-23.974 43.159-68.651 72.509-90.686C221.686-.727 256-13.028 256 26.116c0 7.818-4.482 65.674-7.111 75.068-9.138 32.654-42.436 40.983-72.057 35.942 51.775 8.812 64.946 38 36.501 67.187-54.021 55.433-77.644-13.908-83.696-31.676-1.11-3.257-1.63-4.78-1.637-3.485-.008-1.296-.527.228-1.637 3.485-6.052 17.768-29.675 87.11-83.696 31.676-28.445-29.187-15.274-58.375 36.5-67.187-29.62 5.041-62.918-3.288-72.056-35.942C4.482 91.79 0 33.934 0 26.116 0-13.028 34.314-.727 55.491 15.172Z"/> 1475</svg> 1476 </span> 1477 </a> 1478 </li> 1479 <li> 1480 <a 1481 class="bento-made-on__social-link" 1482 href="https://www.instagram.com/okaydevs" 1483 target="_blank" 1484 rel="noopener" 1485 aria-label="OkayDev on Instagram" title="Instagram" > 1486 <span class="bento-made-on__social-logo bento-made-on__social-logo--instagram" aria-hidden="true"> 1487 <svg class="bento-social-mark bento-social-mark--instagram" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 264.583 264.583"> 1488 <path fill="currentColor" d="M132.345 33.973c-26.716 0-30.07.117-40.563.594-10.472.48-17.62 2.136-23.876 4.567-6.47 2.51-11.958 5.87-17.426 11.335-5.472 5.464-8.834 10.948-11.354 17.412-2.44 6.252-4.1 13.397-4.57 23.858-.47 10.486-.593 13.838-.593 40.535 0 26.697.119 30.037.594 40.522.482 10.465 2.14 17.609 4.57 23.859 2.515 6.465 5.876 11.95 11.346 17.414 5.466 5.468 10.955 8.834 17.42 11.345 6.26 2.431 13.41 4.088 23.881 4.567 10.493.477 13.844.594 40.559.594 26.719 0 30.061-.117 40.555-.594 10.472-.48 17.63-2.136 23.888-4.567 6.468-2.51 11.948-5.877 17.414-11.345 5.472-5.464 8.834-10.949 11.354-17.412 2.419-6.252 4.079-13.398 4.57-23.858.472-10.486.595-13.828.595-40.525s-.123-30.047-.594-40.533c-.492-10.465-2.152-17.608-4.57-23.858-2.521-6.466-5.883-11.95-11.355-17.414-5.472-5.468-10.944-8.827-17.42-11.335-6.271-2.431-13.424-4.088-23.897-4.567-10.493-.477-13.834-.594-40.558-.594zm-8.825 17.715c2.62-.004 5.542 0 8.825 0 26.266 0 29.38.094 39.752.565 9.591.438 14.797 2.04 18.264 3.385 4.591 1.782 7.864 3.912 11.305 7.352 3.443 3.44 5.575 6.717 7.362 11.305 1.346 3.46 2.951 8.663 3.388 18.247.47 10.363.573 13.475.573 39.71 0 26.233-.102 29.346-.573 39.709-.44 9.584-2.042 14.786-3.388 18.247-1.783 4.587-3.919 7.854-7.362 11.292-3.443 3.441-6.712 5.57-11.305 7.352-3.463 1.352-8.673 2.95-18.264 3.388-10.37.47-13.486.573-39.752.573-26.268 0-29.38-.102-39.751-.573-9.592-.443-14.797-2.044-18.267-3.39-4.59-1.781-7.87-3.911-11.313-7.352-3.443-3.44-5.574-6.709-7.362-11.298-1.346-3.461-2.95-8.663-3.387-18.247-.472-10.363-.566-13.476-.566-39.726s.094-29.347.566-39.71c.438-9.584 2.04-14.786 3.387-18.25 1.783-4.588 3.919-7.865 7.362-11.305 3.443-3.441 6.722-5.57 11.313-7.357 3.468-1.351 8.675-2.949 18.267-3.389 9.075-.41 12.592-.532 30.926-.553zm61.337 16.322c-6.518 0-11.805 5.277-11.805 11.792 0 6.512 5.287 11.796 11.805 11.796 6.517 0 11.804-5.284 11.804-11.796 0-6.513-5.287-11.796-11.805-11.796zm-52.512 13.782c-27.9 0-50.519 22.603-50.519 50.482 0 27.879 22.62 50.471 50.52 50.471s50.51-22.592 50.51-50.471c0-27.879-22.613-50.482-50.513-50.482zm0 17.715c18.11 0 32.792 14.67 32.792 32.767 0 18.096-14.683 32.767-32.792 32.767-18.11 0-32.791-14.671-32.791-32.767 0-18.098 14.68-32.767 32.791-32.767Z"/> 1489</svg> 1490 </span> 1491 </a> 1492 </li> 1493 <li> 1494 <a 1495 class="bento-made-on__social-link" 1496 href="https://www.linkedin.com/company/okay-dev" 1497 target="_blank" 1498 rel="noopener" 1499 aria-label="OkayDev on LinkedIn" title="LinkedIn" > 1500 <sp
1500an class="bento-made-on__social-logo bento-made-on__social-logo--linkedin" aria-hidden="true"> 1501 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"> 1502 <path fill="currentColor" d="M218.123 218.127h-37.931v-59.403c0-14.165-.253-32.4-19.728-32.4-19.756 0-22.779 15.434-22.779 31.369v60.43h-37.93V95.967h36.413v16.694h.51a39.907 39.907 0 0 1 35.928-19.733c38.445 0 45.533 25.288 45.533 58.186l-.016 67.013ZM56.955 79.27c-12.157.002-22.014-9.852-22.016-22.009-.002-12.157 9.851-22.014 22.008-22.016 12.157-.003 22.014 9.851 22.016 22.008A22.013 22.013 0 0 1 56.955 79.27m18.966 138.858H37.95V95.967h37.97v122.16ZM237.033.018H18.89C8.58-.098.125 8.161-.001 18.471v219.053c.122 10.315 8.576 18.582 18.89 18.474h218.144c10.336.128 18.823-8.139 18.966-18.474V18.454c-.147-10.33-8.635-18.588-18.966-18.453"/> 1503</svg> 1504 </span> 1505 </a> 1506 </li> 1507 <li> 1508 <a 1509 class="bento-made-on__social-link" 1510 href="https://github.com/okaydevco" 1511 target="_blank" 1512 rel="noopener" 1513 aria-label="OkayDev on GitHub" title="GitHub" > 1514 <span class="bento-made-on__social-logo bento-made-on__social-logo--github" aria-hidden="true"> 1515 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"> 1516 <path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M512 0C229.12 0 0 229.12 0 512c0 226.56 146.56 417.92 350.08 485.76 25.6 4.48 35.2-10.88 35.2-24.32 0-12.16-.64-52.48-.64-95.36-128.64 23.68-161.92-31.36-172.16-60.16-5.76-14.72-30.72-60.16-52.48-72.32-17.92-9.6-43.52-33.28-.64-33.92 40.32-.64 69.12 37.12 78.72 52.48 46.08 77.44 119.68 55.68 149.12 42.24 4.48-33.28 17.92-55.68 32.64-68.48-113.92-12.8-232.96-56.96-232.96-252.8 0-55.68 19.84-101.76 52.48-137.6-5.12-12.8-23.04-65.28 5.12-135.68 0 0 42.88-13.44 140.8 52.48 40.96-11.52 84.48-17.28 128-17.28s87.04 5.76 128 17.28c97.92-66.56 140.8-52.48 140.8-52.48 28.16 70.4 10.24 122.88 5.12 135.68 32.64 35.84 52.48 81.28 52.48 137.6 0 196.48-119.68 240-233.6 252.8 18.56 16 34.56 46.72 34.56 94.72 0 68.48-.64 123.52-.64 140.8 0 13.44 9.6 29.44 35.2 24.32C877.44 929.92 1024 737.92 1024 512 1024 229.12 794.88 0 512 0"/> 1517</svg> 1518 </span> 1519 </a> 1520 </li> 1521 </ul> 1522 </nav> 1523 </div> 1524 1525 <div class="bento-made-on__legal-block"> 1526 <p class="bento-made-on__copyright"> 1527 <span class="bento-made-on__copyright-owner">OKAY DEV® 2026 ©</span> 1528 <span class="bento-made-on__copyright-rights">All rights reserved</span> 1529 </p> 1530 <ul class="bento-made-on__legal"> 1531 <li> 1532 <a href="/terms-and-conditions">Terms</a> 1533 </li> 1534 <li> 1535 <a href="/privacy-policy">Privacy</a> 1536 </li> 1537 <li> 1538 <a href="/acceptable-use-policy">Acceptable Use</a> 1539 </li> 1540 <li> 1541 <a href="/disclaimer">Disclaimer</a> 1542 </li> 1543 <li> 1544 <a href="/return-policy">Returns</a> 1545 </li> 1546 <li> 1547 <a href="/cookie-policy">Cookie Policy</a> 1548 </li> 1549 <li> 1550 <a href="/community-guidelines">Community Guidelines</a> 1551 </li> 1552 </ul> 1553 </div> 1554 </div> 1555</div> 1556</footer> 1557 1558 1559<nav class="app-toolbar" aria-label="App" style="--app-toolbar-count: 4" data-app-toolbar> 1560 <ul class="app-toolbar-list"> 1561 <li class="app-toolbar-item"> 1562 <a class="app-toolbar-tab" href="https://okaydev.co/social" data-app-tab="social">
1563 <span class="app-toolbar-icon" aria-hidden="true"> 1564 <svg class="app-toolbar-glyph app-toolbar-glyph--social" viewBox="-14 -14 278 278"> 1565 <circle class="app-toolbar-glyph-disc" cx="125" cy="125" r="115.75" fill="none" stroke="currentColor" stroke-width="18.5"/> 1566 <path class="app-toolbar-glyph-mark" fill="currentColor" d="m182.332 146.485 10.336 7.03-.163.235c-.213.302-.51.707-.89 1.202l-.168.218a69.175 69.175 0 0 1-3.268 3.894c-3.56 3.955-7.8 7.894-12.726 11.57C161.346 181.161 144.485 187.5 125 187.5c-19.485 0-36.346-6.339-50.453-16.866-4.927-3.676-9.166-7.615-12.726-11.57a70.558 70.558 0 0 1-2.955-3.494l-.313-.4a43.152 43.152 0 0 1-.962-1.284l-.259-.37 10.336-7.031.345.476c.115.154.256.34.422.555a56.741 56.741 0 0 0 2.676 3.185c3.034 3.37 6.676 6.755 10.911 9.915C94.09 169.62 108.4 175 125 175c16.601 0 30.91-5.38 42.978-14.384 4.234-3.16 7.877-6.545 10.91-9.915a58.306 58.306 0 0 0 2.394-2.824l.513-.661c.176-.232.312-.416.408-.548l.13-.183ZM131.571 66.774l11.858 3.952-25 75-11.858-3.952zm26.51 25.145 8.838-8.838 23.17 23.169-23.17 23.169-8.838-8.838 14.33-14.331zM83.081 83.081l8.838 8.838-14.33 14.331 14.33 14.331-8.838 8.838-23.17-23.169z"/> 1567 </svg> 1568 </span> 1569 <span class="app-toolbar-label">Social</span> 1570 </a> 1571 </li> 1572 1573 <li class="app-toolbar-item"> 1574 <a class="app-toolbar-tab" href="https://okaydev.co/gallery" data-app-tab="explore"> 1575 <span class="app-toolbar-icon" aria-hidden="true"> 1576 <svg class="app-toolbar-glyph app-toolbar-glyph--explore" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"> 1577 <circle class="app-toolbar-glyph-disc" cx="12" cy="12" r="9.25"/> 1578 <path class="app-toolbar-glyph-mark" d="m15.6 8.4-2.1 5.1-5.1 2.1 2.1-5.1 5.1-2.1Z"/> 1579 </svg> 1580 </span> 1581 <span class="app-toolbar-label">Explore</span> 1582 </a> 1583 </li> 1584 1585 <li class="app-toolbar-item"> 1586 <a class="app-toolbar-tab" href="https://okaydev.co/login" data-app-tab="log-in"> 1587 <span class="app-toolbar-icon" aria-hidden="true"> 1588 <svg class="app-toolbar-glyph" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"> 1589 <path d="M13.75 4.75h3.5a2 2 0 0 1 2 2v10.5a2 2 0 0 1-2 2h-3.5"/> 1590 <path d="M4.75 12h10M11.25 8.25 15 12l-3.75 3.75"/> 1591 </svg> 1592 </span> 1593 <span class="app-toolbar-label">Log in</span> 1594 </a> 1595 </li> 1596 1597 <li class="app-toolbar-item"> 1598 <a class="app-toolbar-tab" href="https://okaydev.co/sign-up" data-app-tab="sign-up"> 1599 <span class="app-toolbar-icon" aria-hidden="true"> 1600 <svg class="app-toolbar-glyph" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"> 1601 <circle cx="10" cy="8.25" r="3.75"/> 1602 <path d="M3.25 19.25c.85-3.3 3.55-5.25 6.75-5.25 1.5 0 2.9.43 4.05 1.2M18.25 13.25v6M15.25 16.25h6"/> 1603 </svg> 1604 </span> 1605 <span class="app-toolbar-label">Sign up</span> 1606 </a> 1607 </li> 1608 </ul> 1609 1610 </nav> 1611 1612 1613 1614 1615 <dialog class="okay-dialog" tabindex="-1" 1616 data-dialog="social-guest-gate" data-size="sm" > 1617 1618 <div class="dialog-content"> 1619 1620 <div class="dialog-header"> 1621 <div class="dialog-heading"> 1622 1623 <div class="dialog-heading-content"> 1624 1625 <span class="dialog-heading-text">The social network for creatives</span> 1626 </div> 1627 1628 <button type="button" class="btn-close-dialog icon-container" aria-label="Close"> 1629 <svg aria-hidden="true" class="hide-on-mobile" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path fill="#0C0C0C" d="m6.063 14.711-.775-.774L9.226 10 5.288 6.062l.774-.774L10 9.226l3.938-3.938.773.774L10.774 10l3.938 3.938-.774.773L10 10.774l-3.938 3.938Z"/></svg> 1630<svg aria-hidden="true" class="hide-on-desktop" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
1630<path fill="#0C0C0C" d="m6.4 18.308-.708-.708 5.6-5.6-5.6-5.6.708-.708 5.6 5.6 5.6-5.6.708.708-5.6 5.6 5.6 5.6-.708.708-5.6-5.6-5.6 5.6Z"/></svg> </button> 1631 1632 </div> 1633 </div> 1634 1635 <div class="dialog-inner" data-dialog-scroll> 1636 <div class="ui-claim-project ui-social-guest-gate"> 1637 <img 1638 class="ui-social-guest-gate-image" 1639 data-dialog-img-src="https://images.okaydev.co/production/images/okay_social-social_share.png?w=1200&h=630&auto=compress%2Cformat&fit=min&dm=1750180106&s=7be33bb1d2aac260cc2762686f7e4057" 1640 alt="Okay Social" 1641 width="1200" 1642 height="630" 1643 decoding="async" 1644 fetchpriority="low" 1645 hidden 1646 > 1647 <p> 1648 Tired of ads, algorithms, and the usual social network BS? 1649 </p> 1650 <p> 1651 The OkayDev community is built for creative devs and designers who want to share cool shit, reconnect, and talk like actual humans. 1652 </p> 1653 <p> 1654 Join for free and come hang with creative people on the internet. 1655 </p> 1656</div> 1657 1658 </div> 1659 1660 <div class="dialog-footer"> 1661 <div class="ui-claim-project-actions"> 1662 <a href="/login" class="button ui-claim-project-action is-secondary">LOGIN</a> 1663 <a href="/sign-up" class="button ui-claim-project-action is-primary">SIGN UP</a> 1664 </div> 1665 </div> 1666 1667 </div> 1668 1669 </dialog> 1670 1671 <dialog 1672 class="social-image-viewer-dialog" 1673 data-social-image-viewer 1674 closedby="closerequest" 1675 tabindex="-1" 1676 aria-modal="true" 1677 aria-label="Image viewer" 1678> 1679 <div class="social-image-viewer-dialog__panel"> 1680 <button 1681 type="button" 1682 class="social-image-viewer-dialog__close btn-close-dialog icon-container" 1683 data-social-image-viewer-close 1684 aria-label="Close image viewer" 1685 > 1686 <svg aria-hidden="true" class="hide-on-mobile" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path fill="#0C0C0C" d="m6.063 14.711-.775-.774L9.226 10 5.288 6.062l.774-.774L10 9.226l3.938-3.938.773.774L10.774 10l3.938 3.938-.774.773L10 10.774l-3.938 3.938Z"/></svg> 1687<svg aria-hidden="true" class="hide-on-desktop" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#0C0C0C" d="m6.4 18.308-.708-.708 5.6-5.6-5.6-5.6.708-.708 5.6 5.6 5.6-5.6.708.708-5.6 5.6 5.6 5.6-.708.708-5.6-5.6-5.6 5.6Z"/></svg> </button> 1688 1689 <div 1690 class="social-image-viewer-dialog__thumbs" 1691 data-social-image-viewer-thumbs 1692 hidden 1693 ></div> 1694 1695 <div 1696 class="social-image-viewer-dialog__viewport" 1697 data-social-image-viewer-viewport 1698 > 1699 <div 1700 class="social-image-viewer-dialog__track" 1701 data-social-image-viewer-track 1702 ></div> 1703 </div> 1704 1705 <div class="social-image-viewer-dialog__footer" data-social-image-viewer-footer> 1706 <div 1707 class="social-image-viewer-dialog__pagination" 1708 data-social-image-viewer-pagination 1709 hidden 1710 > 1711 <span data-social-image-viewer-pagination-current></span> 1712 <span class="social-image-viewer-dialog__pagination-sep" aria-hidden="true">/</span> 1713 <span data-social-image-viewer-pagination-total></span> 1714 </div> 1715 <p class="social-image-viewer-dialog__title" data-social-image-viewer-title></p> 1716 </div> 1717 </div> 1718</dialog> 1719 1720 1721 1722
1722<script src="https://okaydev.co/cpresources/927fa84b/js/scripts/front-end/plugin/freeform.js?v=1762884662"></script>
1722 1723<link rel="stylesheet" href="https://okaydev.co/cpresources/927fa84b/css/front-end/plugin/freeform.css?v=1762884662">
1724<script src="https://okaydev.co/cpresources/927fa84b/js/scripts/front-end/captchas/recaptcha/v3.js?v=1762884662"></script>
1724 1725 1726 <template id="custom-video-player-chrome"> 1727 <div class="custom-video-player__overlay"> 1728 <button type="button" class="custom-video-player__play-center" aria-label="Play"> 1729 <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1730 <path d="M8 5v14l11-7z"/> 1731 </svg> 1732 </button> 1733 1734 <div class="custom-video-player__chrome"> 1735 <div class="custom-video-player__controls"> 1736 <div class="custom-video-player__controls-left"> 1737 <button type="button" class="custom-video-player__play-pause" aria-label="Play"> 1738 <span class="custom-video-player__icon custom-video-player__icon--play" aria-hidden="true"> 1739 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M8 5v14l11-7z"/></svg> 1740 </span> 1741 <span class="custom-video-player__icon custom-video-player__icon--pause" aria-hidden="true" hidden> 1742 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/></svg> 1743 </span> 1744 </button> 1745 1746 <span class="custom-video-player__time"> 1747 <span data-current-time>0:00</span> 1748 <span class="custom-video-player__time-sep" aria-hidden="true">/</span> 1749 <span data-duration>0:00</span> 1750 </span> 1751 1752 <div class="custom-video-player__progress" role="slider" aria-label="Seek" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" tabindex="0"> 1753 <div class="custom-video-player__progress-track"> 1754 <div class="custom-video-player__progress-fill"></div> 1755 <div class="custom-video-player__progress-thumb"></div> 1756 </div> 1757 </div> 1758 </div> 1759 1760 <div class="custom-video-player__controls-right"> 1761 <button type="button" class="custom-video-player__mute" aria-label="Unmute"> 1762 <span class="custom-video-player__icon custom-video-player__icon--muted" aria-hidden="true"> 1763 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3 3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4 9.91 6.09 12 8.18V4z"/></svg> 1764 </span> 1765 <span class="custom-video-player__icon custom-video-player__icon--unmuted" aria-hidden="true" hidden> 1766 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/></svg> 1767 </span> 1768 </button> 1769 1770 <div class="custom-video-player__speed"> 1771 <button type="button" class="custom-video-player__speed-toggle" aria-label="Playback speed" aria-haspopup="true" aria-expanded="false">1Ã</button> 1772 <div class="custom-video-player__speed-menu" hidden> 1773 <button type="button" data-speed="0.5">0.5Ã</button> 1774 <button type="button" data-speed="1">1Ã</button> 1775 <button type="button" data-speed="1.5">1.5Ã</button> 1776 <button type="button" data-speed="2">2Ã</button> 1777 </div> 1778 </div> 1779 1780 <button type="button" class="custom-video-player__pip" aria-label="Picture in picture" hidden> 1781 <span class="custom-video-player__icon custom-video-player__icon--pip" aria-hidden="true"> 1782 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M19 7h-8v6h8V7zm2-4H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16.01H3V4.99h18v14.02z"/></svg> 1783 </span> 1784 </button> 1785 1786 <button type="button" class="custom-video-player__fullscreen" aria-label="Fullscreen"> 1787 <span class="custom-video-player__icon custom-video-player__icon--enter-fs" aria-hidden="true"> 1788 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg> 1789 </span> 1790 <span class="custom-video-player__icon custom-video-player__icon--exit-fs" aria-hidden="true" hidden> 1791 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z"/></svg> 1792 </span> 1793 </button> 1794 </div> 1795 </div> 1796 </div> 1797</div> 1798 </template> 1799 1800
1800<script> 1801 (function() { 1802 fetch('https://okaydev.co/index.php/actions/users/session-info', { 1803 headers: { 1804 'Accept': 'application/json', 1805 } 1806 }).then(response => response.json()) 1807 .then(data => { 1808 document.querySelectorAll('craft-csrf-input') 1809 .forEach(element => { 1810 const input = document.createElement('input'); 1811 input.type = 'hidden'; 1812 input.name = data.csrfTokenName; 1813 input.value = data.csrfTokenValue; 1814 element.replaceWith(input); 1815 }); 1816 }); 1817 })(); 1818</script>
vendor: 1 bytes, line 1818
1818
1819<script>function insertBlocks(blocks) 1820 { 1821 var allChildrenOnPage = []; 1822 for(var i = 0; i < blocks.length; i++){ 1823 var rBlock = blocks[i]; 1824 var dBlock = document.getElementById(rBlock.id); 1825 var placeholder = document.createElement("div"); 1826 placeholder.insertAdjacentHTML("afterbegin", rBlock.html); 1827 var allChildren = []; 1828 for (var j = 0; j < placeholder.childNodes.length; j++) { 1829 allChildren.push(placeholder.childNodes[j]); 1830 allChildrenOnPage.push(placeholder.childNodes[j]); 1831 } 1832 for(var node of allChildren){ 1833 dBlock.parentNode.insertBefore(node, dBlock); 1834 } 1835 dBlock.parentNode.removeChild(dBlock); 1836 } 1837 1838 return allChildrenOnPage; 1839 } 1840 function pullDynamic() { 1841 var injectedContent = document.getElementById("SERVD_DYNAMIC_BLOCKS"); 1842 if(injectedContent){ 1843 var parsedContent = JSON.parse(injectedContent.innerHTML); 1844 let insertedBlocks = insertBlocks(parsedContent.blocks); 1845 window.dispatchEvent( new CustomEvent("servd.dynamicloaded", {detail: {blocks: insertedBlocks}}) ); 1846 return; 1847 } 1848 1849 var dynamicBlocks = document.getElementsByClassName("dynamic-block"); 1850 var len = dynamicBlocks.length; 1851 var allBlocks = []; 1852 for (var i=0; i<len; i++) { 1853 var block = dynamicBlocks[i]; 1854 var blockId = block.id; 1855 var template = block.getAttribute("data-template"); 1856 var args = block.getAttribute("data-args"); 1857 var siteId = block.getAttribute("data-site"); 1858 allBlocks.push({ 1859 id: blockId, 1860 template: template, 1861 args: args, 1862 siteId: siteId 1863 }); 1864 } 1865 1866 if(allBlocks.length > 0){ 1867 var xhr = new XMLHttpRequest(); 1868 xhr.onload = function () { 1869 if (xhr.status >= 200 && xhr.status <= 299) { 1870 var responseContent = JSON.parse(xhr.response); 1871 let insertedBlocks = insertBlocks(responseContent.blocks); 1872 window.dispatchEvent( new CustomEvent("servd.dynamicloaded", {detail: {blocks: insertedBlocks}}) ); 1873 } 1874 } 1875 xhr.open("POST", "https://okaydev.co/index.php/actions/servd-asset-storage/dynamic-content/get-content", ); 1876 xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8"); 1877 xhr.send(JSON.stringify(allBlocks)); 1878 } else { 1879 window.dispatchEvent( new CustomEvent("servd.dynamicloaded", {detail: {blocks: []}}) ); 1880 } 1881 } 1882 1883 setTimeout(function(){ 1884 if (!window.SERVD_MANUAL_DYNAMIC_LOAD) { 1885 pullDynamic(); 1886 } 1887 }, 50);</script>
1887</body> 1888 1889</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.