@font-face{font-family:TT Norms Regular;src:url('../../../../public/sites/shiftbrain/fonts/TTNorms-Regular.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:TT Norms Light;src:url('../../../../public/sites/shiftbrain/fonts/TTNorms-Light.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:TT Norms ExtraLight;src:url('../../../../public/sites/shiftbrain/fonts/TTNorms-ExtraLight.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:YakuHanJP;src:url('../../../../public/sites/shiftbrain/fonts/YakuHanJP-Light.woff2') format('woff2');font-style:normal;font-weight:300;font-display:swap}
:root{--ink:#121212;--paper:#fff;--surface:#fff;--foreground:#121212;--gutter:15px;--sweep:cubic-bezier(.55,.05,.22,.99);--out:cubic-bezier(.18,.06,.23,1);--slide:cubic-bezier(.43,.05,.17,1);color-scheme:light}
:root[data-mode=text]{--surface:#121212;--foreground:#fff;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;padding:0}html{font-family:'TT Norms Regular',YakuHanJP,'游ゴシック体',YuGothic,'Yu Gothic',sans-serif;font-size:16px;line-height:1.5;overflow-wrap:break-word;font-feature-settings:'liga' off;scrollbar-width:thin}
body{background:var(--surface);color:var(--foreground);transition:background-color .8s var(--out),color .8s var(--out)}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;border-radius:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}h1,h2,h3,p,dl,dd,ul,ol{margin:0;padding:0;font:inherit}ul,ol{list-style:none}address{font-style:normal}img,video{max-width:100%;display:block}svg{display:block}a:focus-visible,button:focus-visible{outline:1px solid currentColor;outline-offset:5px}.page-gutter{padding-inline:var(--gutter)}
.skip-link{position:fixed;top:8px;left:15px;padding:8px;background:var(--ink);color:#fff;transform:translateY(-200%);z-index:200}.skip-link:focus{transform:none}
.site-header{display:none;position:fixed;top:37px;left:0;width:100%;z-index:20;color:#ededed;mix-blend-mode:exclusion;padding-inline:var(--gutter);align-items:center;font-size:16px;pointer-events:none}.site-header a,.site-header button,.language-switch{pointer-events:auto}
.main-nav{position:relative;display:flex;align-items:center;margin-left:calc(26.31% - 10px);margin-right:auto;white-space:nowrap}.nav-link{padding:10px}.nav-link+.nav-link{margin-left:18px}.nav-underline{position:absolute;bottom:-7px;left:10px;width:20px;height:1px;background:#fff;transition:transform 1s var(--sweep);pointer-events:none}
.brand-symbol{position:fixed;top:15px;left:15px;width:24px;height:46px;mix-blend-mode:exclusion;z-index:31;color:#fff}.brand-symbol svg{width:100%;height:100%;fill:currentColor}
.language-switch{position:relative;width:100px;height:24px;margin-left:auto}.language-current{position:relative;display:block;width:100%;text-align:right;padding-right:15px;white-space:nowrap}.down-arrow{position:absolute;right:0;top:11px;border-top:4px solid currentColor;border-right:3px solid transparent;border-left:3px solid transparent;transition:transform .6s var(--slide)}.language-options{position:absolute;top:30px;right:15px;opacity:0;visibility:hidden;transform:translateY(-15px);transition:opacity .4s var(--out),transform .9s var(--slide),visibility .4s;pointer-events:none}.language-options button{display:block;white-space:nowrap}.language-options button+button{margin-top:8px}.language-options button[aria-pressed=true]{opacity:.35}.language-switch.is-open .language-options{visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto}.language-switch.is-open .down-arrow{transform:rotate(180deg)}
.menu-button{position:fixed;top:18px;right:0;width:60px;padding:15px 15px 20px;z-index:32;mix-blend-mode:exclusion;color:#ededed}.menu-button span{display:block;width:30px;height:1px;background:currentColor;transition:transform .8s var(--slide)}.menu-button span+span{margin-top:6px}.menu-button[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-button[aria-expanded=true] span+span{transform:translateY(-3.5px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;z-index:30;background:#121212;color:white;overflow-y:auto;padding:96px 15px 70px;transform:translateY(-105%);transition:transform 1s var(--sweep);visibility:hidden}.mobile-menu.is-open{transform:translateY(0);visibility:visible}.mobile-menu nav a{display:block;line-height:1.145;font-size:33px;letter-spacing:-.03em;padding:10px 0;transform:translateY(-35px);opacity:0;transition:transform 1.1s var(--slide),opacity .6s var(--out)}.mobile-menu.is-open nav a{transform:translateY(0);opacity:1;transition-delay:calc(var(--i,0)*.05s + .2s)}.mobile-languages{display:flex;gap:25px;margin-top:55px}.mobile-languages button[aria-pressed=true]{opacity:.4}
#scroll-content{background:var(--surface);transition:background-color .8s var(--out);min-height:100vh}.work-page{position:relative;padding-top:136px;isolation:isolate;overflow:hidden}.work-background{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}.work-background span{position:absolute;inset:0;transition:transform .7s var(--sweep);will-change:transform}.background-dark{background:#121212;transform:translateX(-100%)}.background-light{background:#fff;transform:translateX(0)}[data-mode=text] .background-dark{transform:translateX(0);z-index:1}[data-mode=text] .background-light{transform:translateX(100%)}
.work-intro{position:relative;z-index:2}.work-intro h1{font-family:'TT Norms Light',sans-serif;font-size:30px;line-height:1.145;letter-spacing:-.03em;font-weight:400}.desktop-break{display:none}
.filters{position:relative;margin-top:54px}.filter-toggle{position:relative;width:100%;text-align:left;display:flex;align-items:center;gap:7px;line-height:1;padding-bottom:24px}.filter-toggle::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:currentColor;opacity:.2;transform:scaleX(0);transform-origin:left;transition:transform .5s var(--slide)}[data-mode=text] .filter-toggle::after,.filters.is-open .filter-toggle::after{transform:scaleX(1)}.filter-toggle i{width:7px;height:7px;position:relative}.filter-toggle i::before,.filter-toggle i::after{content:'';position:absolute;top:3px;left:0;width:7px;height:1px;background:currentColor;transition:transform .6s var(--out),opacity .6s var(--out)}.filter-toggle i::after{transform:rotate(90deg)}.filters.is-open .filter-toggle i::before{transform:rotate(180deg)}.filters.is-open .filter-toggle i::after{transform:rotate(360deg);opacity:0}
.filter-list{height:0;overflow:hidden;opacity:0;visibility:hidden;transition:height .8s cubic-bezier(.65,0,.35,1),opacity .5s var(--out),visibility .8s}.filters.is-open .filter-list{visibility:visible;opacity:1}.filter-list button{display:block;width:100%;text-align:left;font-size:16px;line-height:1.1;opacity:.3;padding:8px 0;transition:opacity .6s cubic-bezier(.26,.06,0,1)}.filter-list button:first-child{padding-top:20px}.filter-list button:last-child{padding-bottom:24px}.filter-list button:hover,.filter-list button[aria-pressed=true]{opacity:1}
.work-stage{position:relative;min-height:calc(100vh - 370px);overflow:hidden;transition:height .2s ease}.work-panel{position:absolute;top:0;left:0;width:100%;overflow:hidden;transition:transform .7s var(--sweep);will-change:transform}.panel-inner{transition:transform .7s var(--sweep);will-change:transform}.visual-panel{padding-top:0;transform:translateX(0)}.visual-panel .panel-inner{transform:translateX(0)}.text-panel{padding-top:56px;color:#fff;transform:translateX(-100%)}.text-panel .panel-inner{transform:translateX(100%)}[data-mode=text] .text-panel,[data-mode=text] .text-panel .panel-inner{transform:translateX(0)}[data-mode=text] .visual-panel{transform:translateX(100%)}[data-mode=text] .visual-panel .panel-inner{transform:translateX(-100%)}
.visual-grid{display:flex;flex-wrap:wrap;align-content:flex-start;margin:0 -2.5px;transition:opacity .4s ease,transform .4s ease}.visual-card{position:relative;display:block;width:calc(50% - 5px);margin:0 2.5px 24px}.visual-grid.is-all .visual-card.is-pickup{width:calc(100% - 5px)}.project-link{display:block;position:relative}.project-cover{position:relative;overflow:hidden;width:100%;height:53.86vw;background:#c4c4c4}.project-cover img,.project-cover video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.project-cover img{opacity:0;transition:opacity .6s var(--out)}.project-cover img.is-loaded{opacity:1}.project-cover video{display:none;opacity:0;transition:opacity .4s cubic-bezier(.26,.06,0,1)}.project-cover video.is-playing{opacity:1;transition:opacity .8s var(--out)}.project-caption{margin-top:10px}.project-title{font-size:14px;line-height:1}.project-client{font-size:10px;line-height:1.5;opacity:.5;margin-top:6px;letter-spacing:-.005em}
.text-columns{display:none}.text-list{transition:opacity .4s ease}.text-row{display:flex;flex-direction:column;transition:opacity .5s var(--out),padding .8s cubic-bezier(.36,.04,.23,1)}.text-row+.text-row{margin-top:100px}.text-project{order:1}.text-project h2{font-size:20px;line-height:1.2}.text-project p{display:block;font-size:12px;letter-spacing:-.005em;opacity:.5;margin-top:6px}.text-overview{order:2;font-size:12px;line-height:1.7;margin-top:36px;white-space:pre-line}.text-field{font-size:12px;line-height:1.5;display:flex;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05)}.text-field dt{width:70px;flex:none;opacity:.5}.text-field dd{flex:1}.text-date{order:3;margin-top:30px}.text-outputs{order:4}.text-roles{order:5}.text-row:focus-visible{opacity:1}
.is-filtering .visual-grid{opacity:0;transform:translateY(-10px);transition:opacity .35s ease,transform .3s ease-in}.is-filtering .text-list{opacity:0;transition:opacity .3s ease-out}.load-message{padding:60px var(--gutter);opacity:.5}.load-message:empty{display:none}
.site-footer{position:relative;padding-top:180px;padding-bottom:80px;color:var(--foreground);transition:color .8s var(--out),opacity .6s var(--out)}.office-list{margin-bottom:70px}.office+.office{margin-top:56px}.office h2{font-size:20px;line-height:1.5}.office a{display:block;margin-top:12px;font-size:14px;line-height:1.6}.site-footer a{transition:opacity .8s var(--out)}.site-footer a:hover{opacity:.5}.footer-bottom{display:flex;flex-direction:column-reverse;gap:70px;font-size:16px}.footer-bottom nav a{display:block}.footer-bottom nav a+a{margin-top:12px}
.mode-switch{--tab-width:82.3333px;position:fixed;bottom:40px;left:50%;z-index:25;display:grid;grid-template-columns:repeat(2,var(--tab-width));align-items:center;width:180.6667px;height:40px;padding:0 8px;isolation:isolate;transform:translate(-50%,80px);opacity:0;border-radius:100px;transition:opacity .6s var(--slide),transform .6s var(--sweep),width .7s var(--sweep);overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.025)}.mode-switch button{font-size:11px;text-transform:uppercase;line-height:40px;text-align:center;position:relative;z-index:2;mix-blend-mode:difference;color:#fff;white-space:nowrap;transition:opacity .4s var(--out)}.mode-pill{position:absolute;left:8px;top:5px;width:var(--tab-width);height:30px;border-radius:100px;pointer-events:none;background:#121212;z-index:1;translate:100% 0}.mode-pill-fast{transition:translate .5s var(--slide)}.mode-pill-slow{transition:translate .9s var(--sweep)}[data-mode=text] .mode-pill{translate:0 0}.mode-switch.slide-right .mode-pill-slow{animation:pill-stretch-right .6s var(--sweep)}.mode-switch.slide-left .mode-pill-slow{animation:pill-stretch-left .6s var(--sweep)}.is-ready .mode-switch{opacity:1;transform:translate(-50%,0)}.mode-switch.is-at-footer{opacity:0;pointer-events:none;transform:translate(-50%,80px)}
@keyframes pill-stretch-right{0%,100%{scale:1;transform-origin:left}50%{scale:1.6 1;transform-origin:left}}@keyframes pill-stretch-left{0%,100%{scale:1;transform-origin:right}50%{scale:1.6 1;transform-origin:right}}
.site-loader{position:fixed;inset:0;z-index:100;background:#000;color:#fff;display:grid;place-items:center;pointer-events:auto;opacity:1;transition:opacity .7s var(--out);perspective:1000px}.site-loader.is-done{opacity:0;pointer-events:none}.loader-wordmark{position:absolute;left:50%;top:50%;width:191px;height:21px;transform:translate(-50%,-50%);overflow:hidden}.loader-wordmark svg{width:100%;height:100%;animation:wordmark-recede 1s 1.5s var(--slide) both}.loader-wordmark path{fill:#000;animation:letter-enter 1s var(--sweep) both;animation-delay:calc(var(--i)*40ms + 40ms)}.loader-symbol{position:absolute;width:24px;height:46px;left:50%;top:50%;margin:-23px 0 0 -12px;opacity:0;fill:white;animation:symbol-approach 1.5s 1.7s var(--slide) both}.site-loader.is-out .loader-symbol{animation:symbol-depart 1.5s var(--slide) both}
@keyframes letter-enter{0%{transform:translateY(26px);fill:#000}30%{fill:#000}80%{fill:#fff}100%{transform:translateY(0);fill:#fff}}@keyframes wordmark-recede{0%{transform:perspective(1000px) translateZ(0);opacity:1}20%{opacity:1}70%,100%{transform:perspective(1000px) translateZ(-100px);opacity:0}}@keyframes symbol-approach{0%{transform:perspective(1000px) translateZ(200px);opacity:0}20%{opacity:0}55%,100%{transform:perspective(1000px) translateZ(0);opacity:1}}@keyframes symbol-depart{0%{transform:perspective(1000px) translateZ(0);opacity:1}20%{opacity:1}70%,100%{transform:perspective(1000px) translateZ(-200px);opacity:0}}
.noscript{padding:50px 15px;background:white;color:black}.noscript a{text-decoration:underline}.c-scrollbar{width:9px!important;z-index:50!important}.c-scrollbar_thumb{background:var(--foreground)!important;opacity:.3!important}
@media(min-width:769px){.site-header{display:flex}.menu-button,.mobile-menu{display:none}.work-page{padding-top:191.1111px}.work-intro h1{font-family:'TT Norms ExtraLight',sans-serif;font-size:44.4444px;letter-spacing:-.02em}.desktop-break{display:block}.visual-grid{margin:-.7vw}.visual-card{width:calc(33.333333% - 1.38vw);margin:.69vw}.visual-grid.is-all .visual-card.is-pickup{width:calc(66.666667% - 1.38vw)}.project-cover{height:36.8vw}.project-cover video{display:block}.project-caption{position:absolute;inset:0;margin:0;padding:20px;background:rgba(0,0,0,.5);display:flex;flex-direction:column;justify-content:flex-end;color:white;opacity:0;transition:opacity 1s var(--out)}.project-link:hover .project-caption,.project-link:focus-visible .project-caption{opacity:1}.project-title{font-size:17.7778px}.project-client{font-size:10.6667px;margin-top:5.333px}.text-project h2{font-family:'TT Norms Light',sans-serif}.site-footer{padding-top:230px;padding-bottom:36px}.office-list{display:flex;gap:2.63%;margin-bottom:198px}.office{width:23.68%}.office+.office{margin-top:0}.office h2{font-size:16px}.office a{margin-top:10px;font-size:16px;line-height:1.4}.footer-bottom{flex-direction:row;justify-content:space-between;gap:0}.footer-bottom nav{display:flex;gap:20px;margin-right:2.63%}.footer-bottom nav a+a{margin:0}}
@media(min-width:1024px){:root{--gutter:2.5vw}.brand-symbol{top:25px;left:2.5vw}.filters{position:absolute;bottom:0;right:0;width:18.42%;margin-top:0;margin-bottom:12px}.filter-toggle{display:none}.filter-list{height:auto!important;opacity:1;visibility:visible;overflow:visible}.filter-list button{padding:0}.filter-list button:first-child,.filter-list button:last-child{padding:0}.filter-list button+button{margin-top:9px}.visual-panel{padding-top:4.86vw}.text-panel{padding-top:7.98vw}.text-columns{display:flex;justify-content:space-between;padding-bottom:26.6667px;border-bottom:1px solid rgba(196,196,196,.2);opacity:.5;font-size:14.2222px;letter-spacing:.01em}.text-row{flex-direction:row;justify-content:space-between;padding-top:26.6667px;padding-bottom:17.7778px;border-bottom:1px solid rgba(196,196,196,.2)}.text-row+.text-row{margin:0}.text-columns>*:nth-child(1),.text-row>*:nth-child(1){width:21.05%}.text-columns>*:nth-child(2),.text-row>*:nth-child(2){width:13.15%}.text-columns>*:nth-child(3),.text-columns>*:nth-child(4),.text-row>*:nth-child(3),.text-row>*:nth-child(4){width:15.78%}.text-columns>*:nth-child(5),.text-row>*:nth-child(5){width:34.21%}.text-row>*:not(:last-child){padding-right:32px}.text-project{order:0}.text-project h2{font-size:21.3333px;letter-spacing:-.01em}.text-project p{font-size:10.6667px;margin-top:8.8889px}.text-field{display:block;padding:0;margin:0;border:0;font-size:12.4444px;line-height:1.3;order:0}.text-field dt{display:none}.text-overview{order:0;margin:0;font-size:11.5556px;line-height:1.7}.visual-grid,.text-list{min-height:1px}}
@media(min-width:1280px){.work-page{padding-top:14.93056vw}.work-intro h1{font-size:3.47222vw}.project-caption{padding:1.38889vw}.project-title{font-size:1.38889vw}.project-client{font-size:.83333vw;margin-top:.41667vw}.text-columns{padding-bottom:2.08333vw;font-size:1.11111vw}.text-row{padding-top:2.08333vw;padding-bottom:1.38889vw}.text-row>*:not(:last-child){padding-right:2.5vw}.text-project h2{font-size:1.66667vw}.text-project p{font-size:.83333vw;margin-top:.69444vw}.text-field{font-size:.97222vw}.text-overview{font-size:.90278vw}}
@media(min-width:1440px){.work-page{padding-top:14.93056vw}.work-intro h1{font-size:3.47222vw}}
@media(min-width:1920px){.work-page{padding-top:268.75px}.work-intro h1{font-size:62.5px}.project-caption{padding:25px}.project-title{font-size:25px}.project-client{font-size:15px;margin-top:7.5px}.text-columns{padding-bottom:37.5px;font-size:20px}.text-row{padding-top:37.5px;padding-bottom:25px}.text-row>*:not(:last-child){padding-right:45px}.text-project h2{font-size:30px}.text-project p{font-size:15px;margin-top:12.5px}.text-field{font-size:17.5px}.text-overview{font-size:16.25px}.mode-switch{--tab-width:102.9167px;width:225.8334px;height:50px;padding-inline:10px;bottom:50px}.mode-switch button{line-height:50px;font-size:13.75px}.mode-pill{left:10px;top:6.25px;height:37.5px}}
@media(hover:hover){.text-row{opacity:.5}.text-row:hover{opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-delay:0s!important;transition-duration:1ms!important;transition-delay:0s!important}.site-loader{display:none}.mode-switch{transform:translate(-50%,0);opacity:1}.work-panel,.panel-inner{will-change:auto}}
/* Match the original inline navigation's 24px line box and desktop project-title size. */
.site-header,.main-nav{height:24px}.nav-link+.nav-link{margin-left:22px}.text-project h2{font-size:20px}
@media(max-width:768px){.filters{margin-top:60px}}
.mobile-menu{transition:transform 1s var(--sweep),visibility 0s 1s}.mobile-menu.is-open{transition:transform 1s var(--sweep),visibility 0s}
/* The source capsule rises as a circle, then expands before revealing its labels. */
.mode-switch{background:transparent;box-shadow:none}.mode-switch::before{content:'';position:absolute;top:0;left:50%;height:100%;width:40px;transform:translateX(-50%);border-radius:100px;background:white;transition:width .7s var(--sweep);z-index:0}.is-ready .mode-switch::before{width:100%;transition-delay:.4s}.mode-switch button{opacity:0;transition:opacity .5s var(--out) .8s}.is-ready .mode-switch button{opacity:1}.mode-pill{transform:translateY(110%);opacity:0}.mode-pill-fast{transition:translate .5s var(--slide),transform .7s var(--slide) .7s,opacity .4s var(--out)}.mode-pill-slow{transition:translate .9s var(--sweep),transform .7s var(--slide) .7s,opacity .4s var(--out)}.is-ready .mode-pill{transform:translateY(0);opacity:1}.mode-switch.is-at-footer{transition:opacity .6s var(--slide) .3s,transform .6s var(--sweep) .4s}.mode-switch.is-at-footer::before{width:40px;transition-delay:0s}.mode-switch.is-at-footer button{opacity:0;transition-delay:0s}.mode-switch.is-at-footer .mode-pill{opacity:0;transform:translateY(110%)}
@media(min-width:1920px){.mode-switch::before{width:50px}.is-ready .mode-switch::before{width:100%}.mode-switch.is-at-footer::before{width:50px}}
