:root{--font-size: clamp(1rem, 2.5vw, 1.2rem);--line-height: 2.3;--font-size-xs: clamp(.65rem, 2vw, .85rem);--font-size-s: clamp(.875rem, 2.5vw, 1rem);--font-size-m: clamp(1rem, 3vw, 1.125rem);--font-size-l: clamp(1.125rem, 4vw, 1.25rem);--font-size-xl: clamp(1.25rem, 5vw, 1.5rem);--space-xxs: clamp(.25rem, .5vw, .5rem);--space-xs: clamp(.5rem, 1vw, 1rem);--space-s: clamp(.75rem, 1.5vw, 1.25rem);--space-m: clamp(1rem, 2vw, 1.5rem);--space-l: clamp(1.5rem, 3vw, 2rem);--space-xl: clamp(2rem, 4vw, 3rem);--bg: #f1f4e0;--color: #333;--accent1: #2e4d17;--accent2: #6a994e;--accent3: #ffad33;--gray: #b8b8b8;--footer: #243617;--light-red: #ff6b6b;--light-blue: #add8e6;--max-width: 800px}.dark{--bg: #4b6158;--color: #e8eae6;--accent1: #f1f4e0;--accent2: #8bc34a;--accent3: #ffb74d;--gray: #9ea49d;--link: #a2e2a4;--footer: #2f3a34;--light-red: #ff6b6b;--light-blue: #add8e6}*{box-sizing:border-box;margin:0}body{background:var(--bg);color:var(--color);display:flex;flex-direction:column;font-optical-sizing:auto;grid-template-rows:auto 1fr auto;line-height:var(--line-height);margin:auto;max-width:clamp(300px,100%,var(--max-width));min-height:100dvh;padding:0 var(--space-m);font-family:Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif}nav{display:flex;container-type:inline-size;justify-content:space-between;width:100%}nav a{text-decoration:none!important;color:var(--color)}nav ul,nav ol{list-style:none;display:flex;align-items:center;padding:var(--space-s)}footer{border-top:1px solid var(--accent1);color:var(--gray);font-size:var(--font-size-xs);padding:var(--space-m);padding-top:var(--space-s);display:flex;gap:var(--space-xs);flex-direction:column;justify-content:space-between;width:100%;margin-top:auto}footer .copy{display:flex;justify-content:flex-end}footer .copy a{margin:0}footer a{display:flex;justify-content:flex-end;margin-right:var(--space-xs);text-decoration:none;color:var(--gray);text-underline-offset:3px;text-decoration:underline dotted}footer a:hover{color:var(--accent1)}footer ul{display:flex;justify-content:flex-end;list-style:none;padding:0}.zenn-icon{display:inline-block;--_size: var(--size, 24px);width:var(--_size);height:var(--_size);background-color:currentColor;--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath  d='M.264 23.771h4.984a.8.8 0 0 0 .645-.352L19.614.874c.176-.293-.029-.645-.381-.645h-4.72a.63.63 0 0 0-.557.323L.03 23.361c-.088.176.029.41.234.41m17.181-.352l6.479-10.408a.477.477 0 0 0-.41-.733h-4.691a.52.52 0 0 0-.44.235l-6.655 10.643c-.176.264.029.616.352.616h4.779a.65.65 0 0 0 .586-.353'/%3E%3C/svg%3E");-webkit-mask-image:var(--svg);mask-image:var(--svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.zenn-icon:hover{background-color:#3ea8ff}.github-icon{display:inline-block;--_size: var(--size, 24px);width:var(--_size);height:var(--_size);--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M7.976 0A7.977 7.977 0 0 0 0 7.976c0 3.522 2.3 6.507 5.431 7.584c.392.049.538-.196.538-.392v-1.37c-2.201.49-2.69-1.076-2.69-1.076c-.343-.93-.881-1.175-.881-1.175c-.734-.489.048-.489.048-.489c.783.049 1.224.832 1.224.832c.734 1.223 1.859.88 2.3.685c.048-.538.293-.88.489-1.076c-1.762-.196-3.621-.881-3.621-3.964c0-.88.293-1.566.832-2.153c-.05-.147-.343-.978.098-2.055c0 0 .685-.196 2.201.832c.636-.196 1.322-.245 2.007-.245s1.37.098 2.006.245c1.517-1.027 2.202-.832 2.202-.832c.44 1.077.146 1.908.097 2.104a3.16 3.16 0 0 1 .832 2.153c0 3.083-1.86 3.719-3.62 3.915c.293.244.538.733.538 1.467v2.202c0 .196.146.44.538.392A7.98 7.98 0 0 0 16 7.976C15.951 3.572 12.38 0 7.976 0' clip-rule='evenodd'/%3E%3C/svg%3E");background-color:currentColor;-webkit-mask-image:var(--svg);mask-image:var(--svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.codepen-icon{display:inline-block;--_size: var(--size, 24px);width:var(--_size);height:var(--_size);--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='m3 15l9 6l9-6l-9-6z'/%3E%3Cpath d='m3 9l9 6l9-6l-9-6zm0 0v6m18-6v6M12 3v6m0 6v6'/%3E%3C/g%3E%3C/svg%3E");background-color:currentColor;-webkit-mask-image:var(--svg);mask-image:var(--svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}#theme-toggle{background:none;border:none;cursor:pointer}.icon-rss{display:inline-block;--_size: var(--size, 24px);width:var(--_size);height:var(--_size);--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zm1.5 2.5c5.523 0 10 4.477 10 10a1 1 0 1 1-2 0a8 8 0 0 0-8-8a1 1 0 0 1 0-2m0 4a6 6 0 0 1 6 6a1 1 0 1 1-2 0a4 4 0 0 0-4-4a1 1 0 0 1 0-2m.5 7a1.5 1.5 0 1 1 0-3a1.5 1.5 0 0 1 0 3'/%3E%3C/svg%3E");background-color:currentColor;-webkit-mask-image:var(--svg);mask-image:var(--svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.icon-rss:hover{background-color:#e47417}.icon-moon{display:inline-block;width:24px;height:24px;background-repeat:no-repeat;background-size:100% 100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23e8eae6' stroke-dasharray='4' stroke-dashoffset='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 4h1.5M13 4h-1.5M13 4v1.5M13 4v-1.5'%3E%3Canimate id='lineMdSunnyOutlineToMoonAltLoopTransition0' fill='freeze' attributeName='stroke-dashoffset' begin='0.6s;lineMdSunnyOutlineToMoonAltLoopTransition0.begin+6s' dur='0.4s' values='4;0'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='lineMdSunnyOutlineToMoonAltLoopTransition0.begin+2s;lineMdSunnyOutlineToMoonAltLoopTransition0.begin+4s' dur='0.4s' values='4;0'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='lineMdSunnyOutlineToMoonAltLoopTransition0.begin+1.2s;lineMdSunnyOutlineToMoonAltLoopTransition0.begin+3.2s;lineMdSunnyOutlineToMoonAltLoopTransition0.begin+5.2s' dur='0.4s' values='0;4'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition0.begin+1.8s' to='M12 5h1.5M12 5h-1.5M12 5v1.5M12 5v-1.5'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition0.begin+3.8s' to='M12 4h1.5M12 4h-1.5M12 4v1.5M12 4v-1.5'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition0.begin+5.8s' to='M13 4h1.5M13 4h-1.5M13 4v1.5M13 4v-1.5'/%3E%3C/path%3E%3Cpath d='M19 11h1.5M19 11h-1.5M19 11v1.5M19 11v-1.5'%3E%3Canimate id='lineMdSunnyOutlineToMoonAltLoopTransition1' fill='freeze' attributeName='stroke-dashoffset' begin='1s;lineMdSunnyOutlineToMoonAltLoopTransition1.begin+6s' dur='0.4s' values='4;0'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='lineMdSunnyOutlineToMoonAltLoopTransition1.begin+2s;lineMdSunnyOutlineToMoonAltLoopTransition1.begin+4s' dur='0.4s' values='4;0'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='lineMdSunnyOutlineToMoonAltLoopTransition1.begin+1.2s;lineMdSunnyOutlineToMoonAltLoopTransition1.begin+3.2s;lineMdSunnyOutlineToMoonAltLoopTransition1.begin+5.2s' dur='0.4s' values='0;4'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition1.begin+1.8s' to='M17 11h1.5M17 11h-1.5M17 11v1.5M17 11v-1.5'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition1.begin+3.8s' to='M18 12h1.5M18 12h-1.5M18 12v1.5M18 12v-1.5'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition1.begin+5.8s' to='M19 11h1.5M19 11h-1.5M19 11v1.5M19 11v-1.5'/%3E%3C/path%3E%3Cpath d='M19 4h1.5M19 4h-1.5M19 4v1.5M19 4v-1.5'%3E%3Canimate id='lineMdSunnyOutlineToMoonAltLoopTransition2' fill='freeze' attributeName='stroke-dashoffset' begin='2.8s;lineMdSunnyOutlineToMoonAltLoopTransition2.begin+6s' dur='0.4s' values='4;0'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='lineMdSunnyOutlineToMoonAltLoopTransition2.begin+2s' dur='0.4s' values='4;0'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='lineMdSunnyOutlineToMoonAltLoopTransition2.begin+1.2s;lineMdSunnyOutlineToMoonAltLoopTransition2.begin+3.2s' dur='0.4s' values='0;4'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition2.begin+1.8s' to='M20 5h1.5M20 5h-1.5M20 5v1.5M20 5v-1.5'/%3E%3Cset fill='freeze' attributeName='d' begin='lineMdSunnyOutlineToMoonAltLoopTransition2.begin+5.8s' to='M19 4h1.5M19 4h-1.5M19 4v1.5M19 4v-1.5'/%3E%3C/path%3E%3C/g%3E%3Cg fill='none' stroke='%23e8eae6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cg%3E%3Cpath stroke-dasharray='2' stroke-dashoffset='4' d='M12 21v1M21 12h1M12 3v-1M3 12h-1'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' dur='0.2s' values='4;2'/%3E%3C/path%3E%3Cpath stroke-dasharray='2' stroke-dashoffset='4' d='M18.5 18.5l0.5 0.5M18.5 5.5l0.5 -0.5M5.5 5.5l-0.5 -0.5M5.5 18.5l-0.5 0.5'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='0.2s' dur='0.2s' values='4;2'/%3E%3C/path%3E%3Cset fill='freeze' attributeName='opacity' begin='0.5s' to='0'/%3E%3C/g%3E%3Cpath d='M7 6 C7 12.08 11.92 17 18 17 C18.53 17 19.05 16.96 19.56 16.89 C17.95 19.36 15.17 21 12 21 C7.03 21 3 16.97 3 12 C3 8.83 4.64 6.05 7.11 4.44 C7.04 4.95 7 5.47 7 6 Z' opacity='0'%3E%3Cset fill='freeze' attributeName='opacity' begin='0.5s' to='1'/%3E%3C/path%3E%3C/g%3E%3Cmask id='lineMdSunnyOutlineToMoonAltLoopTransition3'%3E%3Ccircle cx='12' cy='12' r='12' fill='%23fff'/%3E%3Ccircle cx='12' cy='12' r='4'%3E%3Canimate fill='freeze' attributeName='r' begin='0.1s' dur='0.4s' values='4;8'/%3E%3C/circle%3E%3Ccircle cx='22' cy='2' r='3' fill='%23fff'%3E%3Canimate fill='freeze' attributeName='cx' begin='0.1s' dur='0.4s' values='22;18'/%3E%3Canimate fill='freeze' attributeName='cy' begin='0.1s' dur='0.4s' values='2;6'/%3E%3Canimate fill='freeze' attributeName='r' begin='0.1s' dur='0.4s' values='3;12'/%3E%3C/circle%3E%3Ccircle cx='22' cy='2' r='1'%3E%3Canimate fill='freeze' attributeName='cx' begin='0.1s' dur='0.4s' values='22;18'/%3E%3Canimate fill='freeze' attributeName='cy' begin='0.1s' dur='0.4s' values='2;6'/%3E%3Canimate fill='freeze' attributeName='r' begin='0.1s' dur='0.4s' values='1;10'/%3E%3C/circle%3E%3C/mask%3E%3Ccircle cx='12' cy='12' r='6' mask='url(%23lineMdSunnyOutlineToMoonAltLoopTransition3)' fill='%23e8eae6'%3E%3Canimate fill='freeze' attributeName='r' begin='0.1s' dur='0.4s' values='6;10'/%3E%3Cset fill='freeze' attributeName='opacity' begin='0.5s' to='0'/%3E%3C/circle%3E%3C/svg%3E")}.icon-sun{display:inline-block;width:24px;height:24px;background-repeat:no-repeat;background-size:100% 100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23333' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath stroke-dasharray='2' stroke-dashoffset='2' d='M12 19v1M19 12h1M12 5v-1M5 12h-1'%3E%3Canimate fill='freeze' attributeName='d' begin='0.6s' dur='0.2s' values='M12 19v1M19 12h1M12 5v-1M5 12h-1;M12 21v1M21 12h1M12 3v-1M3 12h-1'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='0.6s' dur='0.2s' values='2;0'/%3E%3C/path%3E%3Cpath stroke-dasharray='2' stroke-dashoffset='2' d='M17 17l0.5 0.5M17 7l0.5 -0.5M7 7l-0.5 -0.5M7 17l-0.5 0.5'%3E%3Canimate fill='freeze' attributeName='d' begin='0.8s' dur='0.2s' values='M17 17l0.5 0.5M17 7l0.5 -0.5M7 7l-0.5 -0.5M7 17l-0.5 0.5;M18.5 18.5l0.5 0.5M18.5 5.5l0.5 -0.5M5.5 5.5l-0.5 -0.5M5.5 18.5l-0.5 0.5'/%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='0.8s' dur='0.2s' values='2;0'/%3E%3C/path%3E%3CanimateTransform attributeName='transform' dur='30s' repeatCount='indefinite' type='rotate' values='0 12 12;360 12 12'/%3E%3C/g%3E%3Cmask id='lineMdMoonAltToSunnyOutlineLoopTransition0'%3E%3Ccircle cx='12' cy='12' r='12' fill='%23fff'/%3E%3Ccircle cx='12' cy='12' r='8'%3E%3Canimate fill='freeze' attributeName='r' dur='0.4s' values='8;4'/%3E%3C/circle%3E%3Ccircle cx='18' cy='6' r='12' fill='%23fff'%3E%3Canimate fill='freeze' attributeName='cx' dur='0.4s' values='18;22'/%3E%3Canimate fill='freeze' attributeName='cy' dur='0.4s' values='6;2'/%3E%3Canimate fill='freeze' attributeName='r' dur='0.4s' values='12;3'/%3E%3C/circle%3E%3Ccircle cx='18' cy='6' r='10'%3E%3Canimate fill='freeze' attributeName='cx' dur='0.4s' values='18;22'/%3E%3Canimate fill='freeze' attributeName='cy' dur='0.4s' values='6;2'/%3E%3Canimate fill='freeze' attributeName='r' dur='0.4s' values='10;1'/%3E%3C/circle%3E%3C/mask%3E%3Ccircle cx='12' cy='12' r='10' mask='url(%23lineMdMoonAltToSunnyOutlineLoopTransition0)' fill='%23333'%3E%3Canimate fill='freeze' attributeName='r' dur='0.4s' values='10;6'/%3E%3C/circle%3E%3C/svg%3E")}:root{--expo-in: linear( 0 0%, .0085 31.26%, .0167 40.94%, .0289 48.86%, .0471 55.92%, .0717 61.99%, .1038 67.32%, .1443 72.07%, .1989 76.7%, .2659 80.89%, .3465 84.71%, .4419 88.22%, .554 91.48%, .6835 94.51%, .8316 97.34%, 1 100% );--expo-out: linear( 0 0%, .1684 2.66%, .3165 5.49%, .446 8.52%, .5581 11.78%, .6535 15.29%, .7341 19.11%, .8011 23.3%, .8557 27.93%, .8962 32.68%, .9283 38.01%, .9529 44.08%, .9711 51.14%, .9833 59.06%, .9915 68.74%, 1 100% )}::view-transition-group(root){animation-duration:.7s;animation-timing-function:var(--expo-out)}::view-transition-new(root){animation-name:reveal-light}::view-transition-old(root),.dark::view-transition-old(root){animation:none;z-index:-1}.dark::view-transition-new(root){animation-name:reveal-dark}@keyframes reveal-dark{0%{clip-path:polygon(50% -71%,-50% 71%,-50% 71%,50% -71%)}to{clip-path:polygon(50% -71%,-50% 71%,50% 171%,171% 50%)}}@keyframes reveal-light{0%{clip-path:polygon(171% 50%,50% 171%,50% 171%,171% 50%)}to{clip-path:polygon(171% 50%,50% 171%,-50% 71%,50% -71%)}}.copy[data-astro-cid-5hce7sga]{font-size:var(--font-size-xs)}