@import "https://fonts.googleapis.com/css2?family=DotGothic16&family=IBM+Plex+Sans+JP:wght@400;500;700&display=swap";@font-face{font-family:Fusion Pixel;src:url(/fonts/fusion-pixel-12px-proportional-zh_hans.woff2)format("woff2");font-display:swap}:root{--px-ink:#111114;--px-paper:#fff;--px-red:#ff4130;--px-yellow:#eeff5a;--px-cyan:#63ddff;--px-green:#00b995;--px-gray:#858890;--px-pixel-font:"DotGothic16", "Fusion Pixel", "IBM Plex Sans JP", monospace;--px-body-font:"IBM Plex Sans JP", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif}.px-page *{box-sizing:border-box}.px-page{color:var(--px-ink);font-family:var(--px-body-font);background-color:var(--px-paper);background-image:linear-gradient(90deg,#e9ecf2 1px,#0000 1px),linear-gradient(#e9ecf2 1px,#0000 1px),linear-gradient(90deg,#dfe3ec 1px,#0000 1px),linear-gradient(#dfe3ec 1px,#0000 1px);background-size:8px 8px,8px 8px,40px 40px,40px 40px;margin:0;overflow-x:hidden}.px-page img{image-rendering:pixelated}.px-page a{color:inherit}@media (pointer:fine){html:not(.motion-off) body[data-cursor-takeover=page],html.pixel-live:not(.motion-off) body[data-cursor-takeover=scope]{cursor:none}}.px-switch{z-index:30;gap:8px;display:flex;position:fixed;bottom:16px;left:16px}.px-note-bar{max-width:880px;font-family:var(--px-pixel-font);letter-spacing:.04em;color:#55585f;margin:26px auto 0;padding:0 24px;font-size:13px}.px-note-bar a{color:var(--px-ink)}.px-page-wrap{max-width:880px;margin:0 auto;padding:40px 24px 80px}.px-page-wrap>.px-heading{margin-bottom:10px;font-size:clamp(26px,4vw,40px)}.px-layer{pointer-events:none;width:100vw;height:100vh;image-rendering:pixelated;position:fixed;inset:0}#walker-canvas{z-index:1}#idle-canvas{z-index:50}#trail-canvas{z-index:60}#explosion-canvas{z-index:61}#cursor-canvas{z-index:62}html.motion-off .px-layer{display:none}html.motion-off *,html.motion-off :before,html.motion-off :after{animation-play-state:paused!important}.px-header{z-index:20;border-bottom:2px solid var(--px-ink);backdrop-filter:blur(2px);background:#ffffffd1;justify-content:space-between;align-items:center;padding:12px 24px;display:flex;position:fixed;top:0;left:0;right:0}.px-header .brand{font-family:var(--px-pixel-font);letter-spacing:.06em;white-space:nowrap;align-items:center;gap:10px;font-size:14px;text-decoration:none;display:flex}.px-header .brand img{width:28px;height:28px}.px-header .right{align-items:center;gap:16px;min-width:0;display:flex}.px-nav{font-family:var(--px-pixel-font);flex-wrap:wrap;justify-content:flex-end;gap:14px;font-size:12px;display:flex}.px-nav a{padding:2px 0;text-decoration:none}.px-nav a[aria-current=page]{border-bottom:2px solid var(--px-ink)}.px-nav a:hover{text-decoration:underline 2px}.px-btn{font-family:var(--px-pixel-font);letter-spacing:.05em;border:2px solid var(--px-ink);background:var(--px-paper);color:var(--px-ink);box-shadow:3px 3px 0 var(--px-ink);cursor:pointer;white-space:nowrap;padding:5px 9px;font-size:11px}.px-btn[data-on=false]{background:var(--px-ink);color:var(--px-paper)}.px-btn:active{box-shadow:1px 1px 0 var(--px-ink);transform:translate(2px,2px)}.px-card{background:var(--px-paper);border:2px solid var(--px-ink);box-shadow:4px 4px 0 var(--px-ink);padding:18px 20px;transition:none}a.px-card{text-decoration:none;display:block}a.px-card:hover{box-shadow:6px 6px 0 var(--px-ink);transform:translate(-2px,-2px)}.px-heading{font-family:var(--px-pixel-font);letter-spacing:.06em;margin:0;font-weight:400}.px-tag{font-family:var(--px-pixel-font);border:2px solid var(--px-ink);background:var(--px-paper);margin-right:6px;padding:2px 7px;font-size:11px;display:inline-block}.px-date{font-family:var(--px-pixel-font);color:var(--px-gray);letter-spacing:.05em;font-size:12px}#loading{z-index:100;background:var(--px-paper);flex-direction:column;justify-content:center;align-items:center;gap:24px;transition:opacity .2s step-end;display:flex;position:fixed;inset:0}#loading.is-done{opacity:0}#loading .kid{width:72px;height:72px;position:relative}#loading .kid:before,#loading .kid:after{content:"";background-repeat:no-repeat;background-size:100% 100%;position:absolute;inset:0}#loading .kid:before{background-image:url(/pixel/img/top/icons/animation/characters/kid-01/side-turning-01.svg);animation:.96s step-end infinite px-kid-a}#loading .kid:after{opacity:0;background-image:url(/pixel/img/top/icons/animation/characters/kid-01/side-turning-02.svg);animation:.96s step-end infinite px-kid-b}@keyframes px-kid-a{0%{opacity:1}16.6667%{opacity:0}33.3333%{opacity:1}66.6667%{opacity:0}83.3333%{opacity:1}}@keyframes px-kid-b{0%{opacity:0}16.6667%{opacity:1}33.3333%{opacity:0}66.6667%{opacity:1}83.3333%{opacity:0}}#loading .text{font-family:var(--px-pixel-font);letter-spacing:.08em;font-size:16px}#loading .text span{opacity:0;animation:1.6s step-end infinite px-dot}#loading .text span:first-child{animation-name:px-dot-1}#loading .text span:nth-child(2){animation-name:px-dot-2}#loading .text span:nth-child(3){animation-name:px-dot-3}@keyframes px-dot-1{0%{opacity:1}75%{opacity:0}}@keyframes px-dot-2{0%{opacity:0}25%{opacity:1}75%{opacity:0}}@keyframes px-dot-3{0%{opacity:0}50%{opacity:1}75%{opacity:0}}.px-float{animation:1.7s steps(2,jump-none) infinite px-bob}@keyframes px-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.px-article{font-size:17px;line-height:1.9}.px-article h1,.px-article h2,.px-article h3{font-family:var(--px-pixel-font);letter-spacing:.04em;font-weight:400;line-height:1.4}.px-article h2{border-bottom:2px solid var(--px-ink);margin-top:2.2em;padding-bottom:8px}.px-article pre{border:2px solid var(--px-ink);background:#f6f8fb;padding:14px 16px;font-size:13.5px;overflow-x:auto}.px-article code{font-size:.88em}.px-article :not(pre)>code{background:#f6f8fb;border:1px solid #d9dde7;padding:1px 5px}.px-article blockquote{border-left:4px solid var(--px-ink);color:#44444a;margin:1.4em 0;padding:4px 0 4px 16px}.px-article img{border:2px solid var(--px-ink);max-width:100%}@media (width<=900px){.px-nav{display:none}}@media (width<=780px){.px-switch{bottom:10px;left:10px}}
