:root{--radius-small:.4rem;--radius-medium:.8rem;--radius-large:1.6rem;--transition:.35s;--transition-hover:.1s;--duration:4s;--black:#16161d;--black-a:#16161d26;--gray:#909099;--blue:#0071e0;--blue-a:#1e90ff1a;--blue-dark:#005cb8;--blue-light:#52c3fb;--purple:#a029de;--purple-dark:#5f267d;--purple-muted:#a377d2;--white:#fff;--bg-white:#eeeeee30;--offwhite:#ccc;--sky-100:#3b2f4a;--sky-150:#302944;--sky-200:#1f1f3a;--sky-300:#16161d;--background-gradient:radial-gradient(circle at center bottom,var(--sky-200),var(--sky-300));--background:var(--bg-white);--toggle-background:var(--white);--text-color:var(--black);--text-color-a:var(--gray);--text-color-header:#000;--link-color:var(--blue);--link-color-hover:var(--blue-dark);--link-color-visited:var(--purple);--link-color-visited-hover:var(--purple-dark);--black-blue:#1f2029;--red:#da2c4d;--grey:#ecedf3;--yellow:#f8ab37;--transform-origin-start:left;--transform-origin-end:right;--transform-rotate-rtl:5deg;--text-align-start:left;--text-align-end:right;--margin-inline-start:0;--margin-inline-end:2.4rem;--padding-inline-start:2.4rem;--padding-inline-end:0;--left:left;--right:right;--border-start-start-radius:var(--radius-small) 0 0 var(--radius-small);--border-start-end-radius:0 var(--radius-small) var(--radius-small) 0;--container-xs:35.2rem;--container-sm:56rem;--container-md:67.2rem;--container-lg:72rem;--container-xl:80rem;--container-xxl:96rem}[dir=rtl]{--transform-origin-start:right;--transform-origin-end:left;--transform-rotate-rtl:-5deg;--text-align-start:right;--text-align-end:left;--margin-inline-start:2.4rem;--margin-inline-end:0;--padding-inline-start:0;--padding-inline-end:2.4rem;--left:right;--right:left;--border-start-start-radius:0 var(--radius-small) var(--radius-small) 0;--border-start-end-radius:var(--radius-small) 0 0 var(--radius-small)}.g-dark{--toggle-background:var(--sky-300);--text-color:var(--offwhite);--text-color-header:#fff;--link-color:var(--blue);--link-color-hover:var(--blue);--link-color-visited:var(--purple-muted);--link-color-visited-hover:var(--purple-muted)}html{height:unset;-webkit-text-size-adjust:100%;font-size:10px;line-height:1.15}body{height:unset;color:var(--text-color);background:var(--background);font-size:1.6rem;line-height:1.5;transition:background .6s ease-in-out;position:relative;overflow-x:hidden}.copyright,.dark-toggle,h2,img,ul{user-select:none}.header-wrapper{max-width:var(--container-sm);text-align:center;margin:0 auto;padding-top:0}@media (width>=40em){.header-wrapper{max-width:var(--container-md);padding-top:2rem}}@media (width>=60em){.header-wrapper{max-width:var(--container-lg)}}@media (width>=75em){.header-wrapper{max-width:var(--container-xl)}}@media (width>=90em){.header-wrapper{max-width:var(--container-xxl)}}.main-wrapper{margin:2.4rem auto 0}@media (width>=40em){.main-wrapper{margin:0 auto;padding:4rem 0}.main-wrapper .container{max-width:var(--container-xs);margin:2.4rem auto}}@media (width>=75em){.main-wrapper .container{max-width:40rem}}.container{margin:2.4rem;position:relative}.footer-wrapper .container,.header-wrapper .container{margin:0 2.4rem;padding:2.4rem 0}h1{font-size:2.4rem;font-weight:500;line-height:2}[lang=ja] h1{font-size:2.2rem!important}h1+p,h2{font-weight:500}h1+p{color:#727272}h1 a{text-wrap-style:balance;margin:0 auto;line-height:5rem;display:inline-block;position:relative}h1 a:before{content:"";background:linear-gradient(90deg,#4285f4 25%,#ea4335 25% 50%,#fbbc04 50% 75%,#34a853 75%);height:3px;transition-property:left,right;transition-duration:.3s;transition-timing-function:ease-out;position:absolute;bottom:0;left:51%;right:51%}[dir=rtl] h1 a:before{background:linear-gradient(270deg,#4285f4 25%,#ea4335 25% 50%,#fbbc04 50% 75%,#34a853 75%)}h1 a:hover:before{left:0;right:0}.rotating-border--google{--border-radius:4.8rem;--border-size:.24rem;--border-bg:conic-gradient(#ea4335 0turn .125turn, #4285f4 .125turn .25turn, #fbbc05 .25turn .375turn, #34a853 .375turn .5turn, #ea4335 .5turn .625turn, #4285f4 .625turn .75turn, #fbbc05 .75turn .875turn, #34a853 .875turn 1turn);z-index:0;border-radius:var(--border-radius);text-align:center;padding:.8rem 2.4rem;position:relative;overflow:hidden}.rotating-border--google:before{content:"";background:var(--border-bg);z-index:-1;border-radius:100%;width:141.421%;padding-bottom:141.421%;animation:5s linear infinite spin-rotating-border;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.rotating-border--google:after{content:"";top:var(--border-size);right:var(--border-size);bottom:var(--border-size);left:var(--border-size);background:var(--toggle-background);z-index:0;border-radius:calc(var(--border-radius) - var(--border-size));position:absolute}@keyframes spin-rotating-border{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}[dir=rtl] .rotating-border--google:before{animation-direction:reverse}.rotating-border--google span{z-index:1;--span-scale:1;font-size:calc(1.3rem * var(--span-scale));position:relative}.rotating-border--google span:before{content:"- "}h2{z-index:1;cursor:default;--h2-scale:1;font-size:calc(1.6rem * var(--h2-scale));opacity:.85;text-align:center;margin:0 -1rem;display:block;position:relative}@media (width>=25em){h1{font-size:2.6rem}.rotating-border--google span{font-size:1.6rem}h2{font-size:2rem}}@media (width>=40em){.rotating-border--google span{font-size:calc(1.6rem * var(--span-scale))}h2{font-size:calc(2rem * var(--h2-scale))}}@media (width>=75em){h1{font-size:2.6rem}h2{font-size:calc(2.2rem * var(--h2-scale))}}@media (width>=90em){h1{font-size:2.8rem}h2{font-size:calc(2.4rem * var(--h2-scale))}}[lang^=pt] h2,[lang=ru] h2,[lang=nl] h2{--h2-scale:.9}[lang=tr] h2,[lang=es] h2,[lang=vi] h2,[lang=pl] h2,[lang=fr] h2{--h2-scale:.8}[lang=vi] .rotating-border--google span,[lang=es] .rotating-border--google span,[lang=fr] .rotating-border--google span,[lang=pl] .rotating-border--google span,[lang^=pt] .rotating-border--google span,[lang=ru] .rotating-border--google span,[lang=tr] .rotating-border--google span,[lang=nl] .rotating-border--google span{--span-scale:.95}.outline,a{color:var(--text-color)}.outline{border-radius:var(--radius-large);border:thin solid #80808066;padding:.6rem 1.3rem;display:inline-block}h2 .outline{color:var(--text-color-header)}header .container{display:-ms-grid;-ms-grid-columns:auto 1fr;-ms-grid-rows:auto auto;grid-column-gap:2.4rem;text-align:center;grid-template-columns:auto 1fr;grid-template-areas:"logo title""desc desc";place-items:center;gap:.8rem 2.4rem;display:grid}header .container>a{-ms-grid-row:1;-ms-grid-column:1;grid-area:logo}header h1{-ms-grid-row:1;-ms-grid-column:2;grid-area:title;margin:0}header p{-ms-grid-row:2;-ms-grid-column:1;-ms-grid-column-span:2;grid-area:desc;margin:0}@media (width>=40em){header .container{text-align:var(--text-align-start);grid-template-areas:"logo title""logo desc";justify-items:start}header .container>a{-ms-grid-row-span:2}header p{-ms-grid-column:2;-ms-grid-column-span:1}}@media (width<=40em){header br{display:none}.header-wrapper .container{padding:0}.header-wrapper .container a{line-height:normal}}.logo{width:6.4rem;height:6.4rem;transition:transform .5s ease-in-out;transform:scale(1)}@media (width>=40em){.logo{width:9.6rem;height:9.6rem}}.header-wrapper .container:hover .logo{transform:scale(1.1)}.about-wrapper{max-width:var(--container-lg);margin:3.2rem auto 0}@media (width>=75em){.about-wrapper{max-width:var(--container-xl)}}@media (width>=90em){.about-wrapper{max-width:var(--container-xxl)}}.about-wrapper .outline{border-radius:var(--radius-large);border-color:#8080804d;margin:0 2.4rem;padding:2.4rem 0}.about-wrapper p{margin-top:1.6rem;font-size:1.6rem}.about-wrapper p:first-letter{font-size:2rem}@media (width>=75em){.about-wrapper p{font-size:1.8rem}.about-wrapper p:first-letter{font-size:2.2rem}}@media (width>=90em){.about-wrapper p{font-size:2rem}.about-wrapper p:first-letter{font-size:2.4rem}}.about-wrapper a,.footer-wrapper a{color:var(--link-color);border-radius:var(--radius-medium);transition:background var(--transition-hover),color var(--transition-hover);font-weight:500;display:inline-block}.about-wrapper a:hover,.footer-wrapper a:hover{background:var(--blue-a);color:var(--link-color-hover)}ul{font-size:1.76rem}li{list-style:none;position:relative}.works{margin:1.6rem 0}@media (width>=40em){ul{font-size:1.92rem}.works{margin-bottom:6rem}}@media (width>=75em){ul{font-size:2rem}}@media (width>=90em){ul{font-size:2.08rem}}.project-link{cursor:pointer;padding:2.4rem 0;transition:all .6s ease-in-out;display:block;position:relative}.contact-link strong,.project-link strong{color:var(--link-color);transition:color var(--transition);font-weight:500}.contact-link:hover strong,.project-link:hover strong{color:var(--link-color-hover)}.contact-link:visited strong,.project-link:visited strong{color:var(--link-color-visited)}.contact-link:visited:hover strong,.project-link:visited:hover strong{color:var(--link-color-visited-hover)}.project-link .caption:before{content:"("counter(counter_item)") "}.project{counter-increment:counter_item}@media (width>=40em){.project-link{border-radius:var(--radius-medium);margin:1.6rem 0;padding:2.4rem}.project-link:hover{background:var(--blue-a);transition-duration:var(--transition-hover)}}.project-link{align-items:center;display:flex}.project:nth-child(odd) .project-link{flex-direction:row-reverse}[dir=rtl] .project:nth-child(odd) .project-link{flex-direction:row}.screenshot-wrapper{min-width:50%;max-width:50%;height:auto;transition:transform var(--transition), width var(--transition), height var(--transition), position var(--transition), margin var(--transition);margin:0 2.4rem 0 0;transform:scale(.9)}[dir=rtl] .screenshot-wrapper,.project:nth-child(odd) .screenshot-wrapper{margin:0 0 0 2.4rem}[dir=rtl] .project:nth-child(odd) .screenshot-wrapper{margin:0 2.4rem 0 0}.project-link:hover .screenshot-wrapper{transition-duration:var(--transition-hover);transform:scale(1)}@media (width>=40em){.screenshot-wrapper{z-index:1;width:16rem;height:12rem;position:absolute}}@media (width>=60em){.screenshot-wrapper{width:19.2rem;height:14.4rem}}@media (width>=75em){.screenshot-wrapper{width:22.4rem;height:16.8rem}}@media (width>=90em){.screenshot-wrapper{width:25.6rem;height:19.2rem}}.screenshot{border-radius:var(--border-start-start-radius);width:100%;height:auto;box-shadow:0 .8rem 2.4rem var(--black-a)}@media (width>=40em){.screenshot{width:100%;height:auto;transition:box-shadow var(--transition);display:block}}.project-link:hover .screenshot{box-shadow:0 .8rem 4.8rem var(--gray)}.g-dark .project-link:hover .screenshot{box-shadow:0 .8rem 4.8rem var(--sky-100)}@media (width>=40em){.line{content:"";background:var(--text-color);opacity:.25;pointer-events:none;width:16rem;height:.1rem;transition:opacity var(--transition), width var(--transition);position:absolute;top:50%}.project-link:hover .line{opacity:1}}@media (width>=75em){.line{width:20rem}}@media (width>=90em){.line{width:24rem}}.project:nth-child(odd) .line{transform-origin:100%;right:calc(100% + .8rem)}[dir=rtl] .project:nth-child(odd) .line{transform-origin:0;left:calc(100% + .8rem);right:auto}@media (width>=40em){.project:nth-child(odd) .screenshot-wrapper{right:calc(100% + 1rem)}[dir=rtl] .project:nth-child(odd) .screenshot-wrapper{left:calc(100% + 1rem);right:auto}}@media (width>=60em){.project:nth-child(odd) .screenshot-wrapper{right:calc(100% + 4rem)}[dir=rtl] .project:nth-child(odd) .screenshot-wrapper{left:calc(100% + 4rem);right:auto}}@media (width>=75em){.project:nth-child(odd) .screenshot-wrapper{right:calc(100% + 8rem)}[dir=rtl] .project:nth-child(odd) .screenshot-wrapper{left:calc(100% + 8rem);right:auto}}@media (width>=90em){.project:nth-child(odd) .screenshot-wrapper{right:calc(100% + 12rem)}[dir=rtl] .project:nth-child(odd) .screenshot-wrapper{left:calc(100% + 12rem);right:auto}}.project:nth-child(odd) .screenshot-wrapper .screenshot{transform:rotate(var(--transform-rotate-rtl))}@media (width>=40em){.project:first-child .line{transform:rotate(6deg)}.project:first-child .screenshot-wrapper{top:-40%}.project:first-child .screenshot-wrapper .screenshot{transform:rotate(4deg)}.project:nth-child(3) .line{transform:rotate(14deg)}.project:nth-child(3) .screenshot-wrapper{top:-45%}.project:nth-child(3) .screenshot-wrapper .screenshot{transform:rotate(-2deg)}.project:nth-child(5) .line{transform:rotate(-5deg)}.project:nth-child(5) .screenshot-wrapper{top:-35%}.project:nth-child(5) .screenshot-wrapper .screenshot{transform:rotate(8deg)}.project:nth-child(7) .line{transform:rotate(5deg)}.project:nth-child(7) .screenshot-wrapper{top:-20%}.project:nth-child(7) .screenshot-wrapper .screenshot{transform:rotate(-8deg)}[dir=rtl] .project:first-child .line{transform:rotate(-6deg)}[dir=rtl] .project:first-child .screenshot-wrapper .screenshot{transform:rotate(-4deg)}[dir=rtl] .project:nth-child(3) .line{transform:rotate(-14deg)}[dir=rtl] .project:nth-child(3) .screenshot-wrapper .screenshot{transform:rotate(2deg)}[dir=rtl] .project:nth-child(5) .line{transform:rotate(5deg)}[dir=rtl] .project:nth-child(5) .screenshot-wrapper .screenshot{transform:rotate(-8deg)}[dir=rtl] .project:nth-child(7) .line{transform:rotate(-5deg)}[dir=rtl] .project:nth-child(7) .screenshot-wrapper .screenshot{transform:rotate(8deg)}}.project:nth-child(2n) .line{transform-origin:0;left:calc(100% + .8rem)}[dir=rtl] .project:nth-child(2n) .line{transform-origin:100%;left:auto;right:calc(100% + .8rem)}@media (width>=40em){.project:nth-child(2n) .screenshot-wrapper{left:calc(100% + 1rem)}[dir=rtl] .project:nth-child(2n) .screenshot-wrapper{left:auto;right:calc(100% + 1rem)}}@media (width>=60em){.project:nth-child(2n) .screenshot-wrapper{left:calc(100% + 4rem)}[dir=rtl] .project:nth-child(2n) .screenshot-wrapper{left:auto;right:calc(100% + 4rem)}}@media (width>=75em){.project:nth-child(2n) .screenshot-wrapper{left:calc(100% + 8rem)}[dir=rtl] .project:nth-child(2n) .screenshot-wrapper{left:auto;right:calc(100% + 8rem)}}@media (width>=90em){.project:nth-child(2n) .screenshot-wrapper{left:calc(100% + 12rem)}[dir=rtl] .project:nth-child(2n) .screenshot-wrapper{left:auto;right:calc(100% + 12rem)}}.project:nth-child(2n) .screenshot-wrapper .screenshot{transform:rotate(var(--transform-rotate-rtl))}[dir=rtl] .project:nth-child(2n) .screenshot-wrapper .screenshot{transform:rotate(calc(-1 * var(--transform-rotate-rtl)))}@media (width>=40em){.project:nth-child(2n) .screenshot img{transform:rotate(-5deg)}.project:nth-child(2) .line{transform:rotate(-25deg)}.project:nth-child(2) .screenshot-wrapper{top:-80%}.project:nth-child(2) .screenshot-wrapper .screenshot{transform:rotate(-8deg)}.project:nth-child(4) .line{transform:rotate(-25deg)}.project:nth-child(4) .screenshot-wrapper{top:-60%}.project:nth-child(4) .screenshot-wrapper .screenshot{transform:rotate(2deg)}.project:nth-child(6) .line{transform:rotate(-18deg)}.project:nth-child(6) .screenshot-wrapper{top:-70%}.project:nth-child(6) .screenshot-wrapper .screenshot{transform:rotate(8deg)}[dir=rtl] .project:nth-child(2) .line{transform:rotate(25deg)}[dir=rtl] .project:nth-child(2) .screenshot-wrapper .screenshot{transform:rotate(8deg)}[dir=rtl] .project:nth-child(4) .line{transform:rotate(25deg)}[dir=rtl] .project:nth-child(4) .screenshot-wrapper .screenshot{transform:rotate(-2deg)}[dir=rtl] .project:nth-child(6) .line{transform:rotate(18deg)}[dir=rtl] .project:nth-child(6) .screenshot-wrapper .screenshot{transform:rotate(-8deg)}}.footer-wrapper{text-align:center;font-size:1.4rem;line-height:2}.copyright{cursor:default;margin:0 0 2.4rem}.footer-love{display:inline-block}.love-heart{color:#ea4335;vertical-align:middle;font-size:1.8rem}.dark-toggle{cursor:pointer;background:var(--toggle-background);transition:opacity var(--transition), background var(--transition);margin-top:1rem}.dark-toggle strong{color:var(--blue)}.footer-wrapper:hover .dark-toggle{box-shadow:0 .8rem 1.6rem var(--black-a);color:var(--offwhite);opacity:1;background:var(--sky-100)}.g-dark .footer-wrapper:hover .dark-toggle{color:var(--black);background:var(--offwhite)}.progress-wrap{cursor:pointer;z-index:10000;opacity:0;visibility:hidden;border-radius:50px;width:46px;height:46px;transition:all .2s linear;display:block;position:fixed;bottom:50px;right:50px;transform:translateY(15px);box-shadow:inset 0 0 0 2px #0003}[dir=rtl] .progress-wrap{left:50px;right:auto}@media (width>=60em){.progress-wrap.active-progress{opacity:1;visibility:visible;font-family:Arial,sans-serif;transform:translateY(0)}.progress-wrap:after{content:"⇪";text-align:center;color:var(--black-blue);cursor:pointer;z-index:1;width:46px;height:46px;font-size:24px;line-height:46px;transition:all .2s linear;display:block;position:absolute;top:0;left:0}[dir=rtl] .progress-wrap:after{left:auto;right:0}.progress-wrap:hover:after{opacity:0}.progress-wrap:before{content:"⇪";text-align:center;opacity:0;cursor:pointer;z-index:2;width:46px;height:46px;font-size:24px;line-height:46px;transition:all .2s linear;display:block;position:absolute;top:0;left:0}[dir=rtl] .progress-wrap:before{left:auto;right:0}.progress-wrap:hover:before{opacity:1;color:#ea4335}.progress-wrap svg path{fill:none}.progress-wrap svg.progress-circle path{stroke:var(--black-blue);stroke-width:4px;box-sizing:border-box;transition:all .2s linear}html.g-dark .progress-wrap{box-shadow:inset 0 0 0 2px #fff3}html.g-dark .progress-wrap:after{color:var(--grey)}html.g-dark .progress-wrap svg.progress-circle path{stroke:var(--grey)}}.dark-toggle:focus{outline:0}.stars,.stars-wrapper{height:0;position:absolute;inset:0;overflow:hidden}.g-dark .stars,.g-dark .stars-wrapper{height:100%}.stars-wrapper{background:var(--background-gradient);z-index:-2;transition:all .6s ease-in-out}.g-dark .stars{animation:a var(--duration) ease-in-out infinite}.stars:nth-child(2){animation-delay:calc(var(--duration) * -.33)}.stars:nth-child(3){animation-delay:calc(var(--duration) * -.66)}@keyframes a{25%{opacity:0}}.star{fill:#fff}.star:nth-child(3n){opacity:.8}.star:nth-child(7n){opacity:.6}.star:nth-child(13n){opacity:.4}.star:nth-child(19n){opacity:.2}.comet{position:absolute;left:calc(50% - 7.5rem)}[dir=rtl] .comet{left:auto;right:calc(50% - 7.5rem)}.g-dark .comet{animation:none}.comet.comet-a{animation-name:b;animation-delay:1s;top:50vh}.comet.comet-b{animation-name:c;animation-delay:6.6s;top:50%}.comet.comet-c{animation-name:d;animation-delay:7.6s;top:calc(100% - 50vh)}[dir=rtl] .comet.comet-a{animation-name:b-rtl}[dir=rtl] .comet.comet-b{animation-name:c-rtl}[dir=rtl] .comet.comet-c{animation-name:d-rtl}@keyframes b{0%{opacity:0;transform:rotate(-135deg)translate(50vmax)}20%{opacity:1}40%,to{opacity:0;transform:rotate(-135deg)translate(-50vmax)}}@keyframes b-rtl{0%{opacity:0;transform:rotate(135deg)translate(-50vmax)}20%{opacity:1}40%,to{opacity:0;transform:rotate(135deg)translate(50vmax)}}@keyframes c{0%{opacity:0;transform:rotate(35deg)translate(50vmax)}20%{opacity:1}40%,to{opacity:0;transform:rotate(35deg)translate(-50vmax)}}@keyframes c-rtl{0%{opacity:0;transform:rotate(-35deg)translate(-50vmax)}20%{opacity:1}40%,to{opacity:0;transform:rotate(-35deg)translate(50vmax)}}@keyframes d{0%{opacity:0;transform:rotate(120deg)translate(50vmax)}20%{opacity:1}40%,to{opacity:0;transform:rotate(120deg)translate(-50vmax)}}@keyframes d-rtl{0%{opacity:0;transform:rotate(-120deg)translate(-50vmax)}20%{opacity:1}40%,to{opacity:0;transform:rotate(-120deg)translate(50vmax)}}#taboola-below-article-thumbnails-2x1,#tr_slot468x2x2,.vli_slot{width:80%;min-width:320px;max-width:800px;margin:0 auto}.vli_slot{max-width:970px;display:none}@media screen and (width<=60em){.vli_slot.w336{display:block}}@media (width>=60em){.vli_slot.w970{display:block}}@media (width<=40em){#taboola-below-article-thumbnails-2x1,#tr_slot468x2x2,.vli_slot{width:100%}}#rbox-t2m{box-shadow:none!important;border-radius:0!important}.trc_rbox_outer{padding-inline:4px!important}.trc_elastic_thumbnails-2x1.tr_2nd .videoCube,.trc_elastic_thumbnails-rr.tr_2nd .videoCube{width:39.5%!important}.trc_elastic_thumbnails-2x1.tr_2nd .videoCube:not(:first-child),.trc_elastic_thumbnails-rr.tr_2nd .videoCube:not(:first-child){float:right!important}[dir=rtl] .trc_elastic_thumbnails-2x1.tr_2nd .videoCube:not(:first-child),[dir=rtl] .trc_elastic_thumbnails-rr.tr_2nd .videoCube:not(:first-child){float:left!important}