@font-face{font-family:Brand;src:url('assets/fonts/BarlowCondensed-BoldItalic.ttf') format('truetype');font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:Display;src:url('assets/fonts/BarlowCondensed-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
:root{color-scheme:dark;--bg:#080809;--surface:#141416;--text:#f4f3f0;--muted:#ababaf;--line:#333337;--accent:#f02d35;--max:1280px;--scroll:0;--hero-progress:0}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.9 "Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none;text-underline-offset:.35em}a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:6px}
h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:600}::selection{background:var(--accent);color:white}[hidden]{display:none!important}
.wrap{width:min(var(--max),calc(100% - 112px));margin-inline:auto}
.brand{font-family:Brand,"Arial Black",sans-serif;font-style:italic;font-weight:700;letter-spacing:-.015em;line-height:1}
.brand-small{font-size:37px;white-space:nowrap}
.site-header{height:102px;display:flex;justify-content:space-between;align-items:center;gap:25px;position:relative;z-index:3;border-bottom:1px solid #ffffff22}
.site-header nav{display:flex;align-items:center;gap:28px;font:14px/1.5 Arial,"Yu Gothic",sans-serif}.site-header nav>a{padding-block:12px}
.site-header nav>.nav-test{border:1px solid #747479;padding:10px 18px}.nav-test:hover{color:var(--bg);background:var(--text);text-decoration:none}
.motion-toggle{border:0;background:none;color:var(--muted);font-family:inherit;font-size:12px;line-height:1.5;cursor:pointer;padding:12px 0 12px 19px;border-left:1px solid var(--line);white-space:nowrap}
.scroll-progress{position:fixed;z-index:30;inset:0 0 auto;height:3px;pointer-events:none}.scroll-progress span{display:block;height:100%;background:var(--accent);transform:scaleX(var(--scroll));transform-origin:left}
.hero{min-height:min(800px,calc(100svh - 102px));position:relative;isolation:isolate;padding-top:40px;padding-bottom:24px;display:flex;flex-direction:column;justify-content:space-between}
.hero-light{position:absolute;z-index:-1;pointer-events:none;inset:-103px -56px 0;overflow:hidden}
.hero-light:before{content:"";position:absolute;top:-30%;right:5%;width:26%;height:155%;background:linear-gradient(180deg,#f02d3500 3%,#f02d3517 45%,#c6202b77 100%);transform:skew(-27deg) translateY(calc(var(--hero-progress) * 90px));border-left:1px solid #f02d3520}
.hero-light:after{content:"";position:absolute;top:0;right:5%;width:1px;height:140%;background:linear-gradient(transparent,#f02d35b0,transparent);transform:rotate(27deg) translateY(calc(var(--hero-progress) * -100px))}
.hero-topline{display:flex;align-items:center;justify-content:space-between;gap:24px;font-family:Arial,sans-serif}.eyebrow{font:12px/1.5 Arial,sans-serif;letter-spacing:.15em}
.hero-topline .eyebrow:before{content:"";display:inline-block;background:var(--accent);width:24px;height:2px;margin:0 12px 4px 0}.hero-id{font-size:13px;color:var(--muted);letter-spacing:.035em}
.hero-brand{font-size:clamp(120px,22vw,330px);letter-spacing:-.01em;line-height:.95;margin:32px 0 38px;white-space:nowrap;transform:translateY(calc(var(--hero-progress) * -32px)) scale(calc(1 - var(--hero-progress) * .035));transform-origin:left center;will-change:transform}
.brand-games{font-family:Display,Arial,sans-serif;font-style:normal;font-size:.43em;letter-spacing:.01em}
.hero-bottom{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:end}.hero h2{font-size:clamp(25px,2.3vw,35px);letter-spacing:.035em;line-height:1.6}.hero-bottom>div>p{color:#bebec2;font-size:16px;line-height:1.95;margin-top:18px}
.button{display:inline-flex;justify-content:center;align-items:center;min-height:54px;line-height:1.6;padding:15px 29px;font-size:14px;font-weight:600;transition:background .2s,color .2s,transform .2s}.button-light{background:var(--text);color:var(--bg);border:1px solid var(--text)}
.button:hover{background:var(--accent);color:white;border-color:var(--accent);text-decoration:none;transform:translateY(-2px)}.hero .button{margin-top:26px;background:var(--accent);border-color:var(--accent);color:white}.hero .button:hover{background:#cc1821;border-color:#cc1821}
.current-note{border-top:1px solid #a1a1a7;width:255px;padding-top:17px;padding-bottom:5px}.current-note .eyebrow{font-size:11px;letter-spacing:.1em;color:var(--muted)}.hero-bottom .current-note p{font-size:22px;line-height:1.7;color:var(--text);margin:17px 0 14px}
.small-meta{font:11px/1.6 Arial,sans-serif;letter-spacing:.1em;color:var(--muted)}
.hero-foot{display:flex;align-items:center;justify-content:space-between;margin-top:44px;padding-top:22px;border-top:1px solid #ffffff22;font:11px/1.5 Arial,sans-serif;letter-spacing:.12em;color:var(--muted);gap:24px}.scroll-cue{display:flex;align-items:center;gap:13px;min-height:28px}.scroll-line{width:38px;height:1px;background:var(--text);transform-origin:left;transform:scaleX(calc(1 - var(--hero-progress) * .5))}.mobile-break{display:none}
.section{padding-block:94px 104px}.section-label{display:flex;align-items:baseline;gap:16px;font:13px/1.6 Arial,"Yu Gothic",sans-serif}.section-label h2{font-size:13px;letter-spacing:.13em;font-weight:400}.section-number{font:14px/1.6 Display,Arial,sans-serif;color:var(--accent)}.section-label>span:last-child{margin-left:auto;color:var(--muted);font-size:13px}
.about{background:#eeeeea;color:#111113;padding-inline:max(56px,calc((100% - var(--max))/2));color-scheme:light}.about .section-label>span:last-child{color:#646467}.about-body{display:grid;grid-template-columns:1.2fr 1fr;gap:40px 90px;margin-top:55px}.about h3{font-size:clamp(28px,3.2vw,45px);font-weight:700;line-height:1.7;letter-spacing:-.035em}.about-copy{color:#4a4a4d;font-size:16px;line-height:2}.about-copy p+p{margin-top:18px}
.about-signature{grid-column:1/-1;display:flex;align-items:center;gap:27px;margin-top:0}.about-signature .brand{font-size:42px}.about-signature>span:last-child{border-left:1px solid #a8a8a6;padding-left:27px;font-size:13px;color:#626266}
.kinetic-band{overflow:hidden;padding:30px 0 37px;border-bottom:1px solid var(--line);user-select:none}.kinetic-track{display:flex;gap:.2em;width:max-content;white-space:nowrap;font:700 clamp(80px,16vw,220px)/1 Display,Impact,sans-serif;letter-spacing:-.025em;transform:translateX(calc(30px + var(--band-shift,0) * 1px));will-change:transform}.outline-type{color:transparent;-webkit-text-stroke:1px #7c7c83}
.project{border-bottom:1px solid var(--line)}.project-layout{display:grid;grid-template-columns:1fr 1fr;gap:110px;align-items:start;margin-top:58px;min-height:790px}.game-visual{width:100%;max-width:380px;justify-self:center;transform:translateY(calc(var(--project-shift,0) * 1px)) scale(var(--project-scale,1));will-change:transform}
.portrait-placeholder{aspect-ratio:9/16;display:flex;flex-direction:column;justify-content:space-between;padding:27px;position:relative;overflow:hidden;background:#151518;border:1px solid #4a4a51;isolation:isolate}.portrait-placeholder:before{content:"";position:absolute;z-index:-1;inset:-10% 5% -10% 60%;background:linear-gradient(#f02d3500,#f02d3580);transform:skew(-16deg);border-left:1px solid #f02d3580}.portrait-placeholder:after{content:"";position:absolute;z-index:-1;inset:0;background:repeating-linear-gradient(0deg,transparent 0 79px,#ffffff09 79px 80px)}
.frame-label,.frame-bottom{font:10px/1.5 Arial,sans-serif;letter-spacing:.13em;color:#c0c0c5}.frame-bottom{text-align:right}.placeholder-center{text-align:left}.placeholder-title{font:700 clamp(48px,6vw,82px)/.93 Display,Impact,sans-serif;letter-spacing:-.015em;display:block}.placeholder-format{display:block;font:12px/1.5 Arial,sans-serif;letter-spacing:.15em;margin-top:28px;color:#dedee3}.placeholder-center p{margin-top:45px;font-size:14px;line-height:1.9;color:#aaaab2}
figcaption{margin-top:15px;color:var(--muted);font-size:12px;text-align:center;line-height:1.7}.game-image{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:var(--surface);border:1px solid var(--line)}.project-copy{padding-top:37px}.status{font-size:13px;color:#c5c5cc;border-left:3px solid var(--accent);padding-left:12px}.project h3{font-size:clamp(30px,3.2vw,45px);line-height:1.65;margin:22px 0 28px;letter-spacing:-.035em}.project-lead{font-size:22px;line-height:1.9;margin-bottom:21px}.project-copy>p:not(.project-lead){font-size:16px;color:var(--muted);line-height:2}
.project-facts{margin:30px 0;font-size:14px}.project-facts>div{display:grid;grid-template-columns:145px 1fr;gap:10px;border-top:1px solid var(--line);padding:12px 0}.project-facts>div:last-child{border-bottom:1px solid var(--line)}.project-facts dt{color:var(--muted)}.project-facts dd{margin:0}.text-link{display:inline-block;border-bottom:1px solid var(--accent);padding-bottom:8px;font-size:14px}
.connect-intro{display:flex;justify-content:space-between;align-items:end;gap:50px;margin:46px 0}.connect-intro h3{font-size:clamp(26px,2.8vw,39px);line-height:1.75;letter-spacing:-.035em}.connect-intro p{font-size:16px;color:var(--muted)}.handle{white-space:nowrap;color:var(--text);font-family:Arial,sans-serif}
.social-list{overflow:clip;padding:8px;margin:-8px}.social-row{display:grid;grid-template-columns:220px 1fr auto;align-items:center;gap:24px;border-top:1px solid var(--line);padding:27px 8px;position:relative;transition:background .2s,padding .2s}.social-row:last-child{border-bottom:1px solid var(--line)}.social-row:hover{background:#201113;padding-inline:25px;text-decoration:none}.social-name{font:700 49px/1.1 Display,Arial,sans-serif;letter-spacing:-.01em}.social-description{font-size:16px;color:var(--muted)}.social-state{font-size:12px;border:1px solid #606065;padding:3px 13px;white-space:nowrap}.link-status{font-size:13px;color:var(--muted);margin-top:23px;min-height:25px}
.testing{background:#d51c27;position:relative;overflow:hidden;isolation:isolate;color:white}.testing-inner{position:relative;z-index:1;padding-block:64px 83px}.testing .section-label>span:last-child,.testing .section-number{color:#fff}.testing-content{display:grid;grid-template-columns:1fr auto;gap:60px;align-items:center;margin-top:53px}.testing-content .eyebrow{color:#ffced1}.testing h3{font-size:clamp(32px,4vw,58px);line-height:1.55;letter-spacing:-.035em;margin:21px 0 27px}.testing-content p{font-size:16px;color:#ffe0e2}.testing-action{width:280px;padding-top:30px}.testing-action .button{width:100%}.testing-action .button:hover{background:#111113;border-color:#111113}.testing-action p{font-size:13px;line-height:1.8;margin:18px 0 36px}.testing-action .small-meta{color:#ffd8db}
.play-backdrop{position:absolute;bottom:-.12em;right:-.015em;z-index:0;font:700 clamp(200px,37vw,560px)/1 Display,Impact,sans-serif;letter-spacing:-.03em;color:#00000012;transform:translateX(calc(var(--play-shift,0) * 1px));user-select:none;pointer-events:none}.site-footer{display:flex;justify-content:space-between;align-items:center;gap:30px;padding-block:48px}.site-footer .brand{font-size:49px}.site-footer p{font-size:12px;color:var(--muted);margin-top:14px}.footer-meta{display:flex;flex-direction:column;gap:10px;text-align:right;font:12px/1.6 Arial,sans-serif;letter-spacing:.03em;color:var(--muted)}
.skip-link{position:fixed;top:10px;left:20px;z-index:40;background:white;color:black;padding:12px 24px;transform:translateY(-200%)}.skip-link:focus{transform:none}
.motion-on .reveal{transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}.motion-on .reveal.is-pending{opacity:0;transform:translateY(35px)}.motion-on .social-row.reveal.is-pending{transform:translateX(30px)}.motion-on .reveal:focus-within{opacity:1;transform:none;transition:none}.motion-off .hero-brand,.motion-off .game-visual,.motion-off .play-backdrop{transform:none}.motion-off .kinetic-track{transform:translateX(20px)}.motion-off .reveal{opacity:1;transform:none;transition:none}
@media(min-width:1001px){.game-visual{position:sticky;top:65px}}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.about{padding-inline:32px}.site-header nav{gap:18px}.project-layout{gap:50px;min-height:auto}.project-copy{padding-top:10px}.about-body{gap:32px 40px}.connect-intro{align-items:start;flex-direction:column;gap:25px}.hero-light{inset:-103px -32px 0}.hero-brand{font-size:23vw}.testing-action{width:240px}.social-row{grid-template-columns:155px 1fr auto}}
@media(max-width:640px){
 .wrap{width:calc(100% - 40px)}.site-header{height:auto;min-height:119px;flex-wrap:wrap;gap:15px;padding-block:18px}.brand-small{font-size:32px}.site-header nav{width:100%;gap:12px;justify-content:space-between;flex-wrap:wrap}.site-header nav>a{font-size:13px;padding:5px 0}.site-header nav>.nav-test{padding:6px 10px}.motion-toggle{position:absolute;top:20px;right:0;font-size:11px;border:1px solid #48484d;padding:5px 8px}
 .hero{min-height:0;padding-top:27px;padding-bottom:27px}.hero-light{inset:-120px -20px 0}.hero-light:before{right:14%;width:28%;opacity:.7}.hero-topline{gap:12px;align-items:start}.hero-topline .eyebrow{font-size:9px;max-width:54%;line-height:1.8;letter-spacing:.08em}.hero-topline .eyebrow:before{width:12px;margin-right:6px;margin-bottom:3px}.hero-id{font-size:10px;white-space:nowrap;line-height:1.8}.hero-brand{font-size:23vw;line-height:1;margin:50px 0 36px;letter-spacing:-.015em}.hero-bottom{grid-template-columns:1fr;gap:33px}.hero h2{font-size:26px;line-height:1.65}.hero-bottom>div>p{font-size:16px}.hero .button{margin-top:23px}.current-note{width:100%;padding-top:14px;padding-bottom:0}.hero-bottom .current-note p{font-size:18px;line-height:1.6;margin:12px 0 10px}.current-note p br{display:none}.current-note .eyebrow{font-size:10px}.small-meta{font-size:10px}.hero-foot{font-size:9px;letter-spacing:.06em;margin-top:29px;gap:16px}.hero-foot>span{max-width:45%;line-height:1.7}.scroll-cue{gap:8px;white-space:nowrap}.scroll-line{width:18px}.mobile-break{display:block}
 .section{padding-block:50px 59px}.section-label{gap:12px;flex-wrap:wrap}.section-label h2{font-size:11px}.section-label>span:last-child{font-size:11px}.about{padding-inline:20px}.about-body{grid-template-columns:1fr;margin-top:33px;gap:27px}.about h3{font-size:27px;line-height:1.75}.about-copy{font-size:16px}.about-signature{gap:20px}.about-signature .brand{font-size:36px}.about-signature>span:last-child{padding-left:20px;font-size:12px}
 .kinetic-band{padding-block:26px}.kinetic-track{font-size:94px}.project-layout{grid-template-columns:1fr;gap:35px;margin-top:42px}.game-visual{max-width:270px}.portrait-placeholder{padding:23px}.placeholder-title{font-size:64px}.placeholder-center p{margin-top:30px}.frame-label,.frame-bottom{font-size:9px}.project-copy{padding:0}.project h3{font-size:33px;margin-top:19px}.project-lead{font-size:20px}.project-facts>div{grid-template-columns:125px 1fr}.project-facts{font-size:13px}
 .connect-intro{margin:30px 0;gap:23px}.connect-intro h3{font-size:27px}.connect-intro p{font-size:16px}.social-row{grid-template-columns:1fr auto;gap:7px 15px;padding:22px 4px}.social-name{font-size:41px}.social-description{grid-column:1;grid-row:2;font-size:13px}.social-state{grid-column:2;grid-row:1/3;font-size:11px;padding:3px 8px}.social-row:hover{padding-inline:10px}.link-status{font-size:12px}
 .testing-inner{padding-block:45px 51px}.testing-content{grid-template-columns:1fr;gap:29px;margin-top:34px}.testing h3{font-size:33px;line-height:1.65}.testing-content p{font-size:16px}.testing-content p br{display:none}.testing-action{width:100%;padding:0}.testing-action p{font-size:13px;margin-bottom:22px}.play-backdrop{font-size:240px;bottom:8px}.site-footer{padding-block:32px;align-items:end;gap:13px}.site-footer .brand{font-size:36px}.site-footer p{font-size:10px}.footer-meta{font-size:10px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}:root:not(.motion-on) *{transition:none!important}}
.hero .button{background:#de1725;border-color:#de1725}
.button:hover{background:#de1725;border-color:#de1725}
.testing-content p,.testing-content .eyebrow,.testing-action .small-meta{color:#fff}
.testing-action .button:hover{background:#111113;border-color:#111113}
.about .section-number{color:#bf1c28}
@media(max-width:360px){.testing h3{font-size:28px}}

/* Brand and footage gallery. Native horizontal scrolling keeps touch and keyboard control. */
.hero-brand{font-size:clamp(100px,19.5vw,283px);display:flex;align-items:baseline;gap:.13em}
.hero-brand .brand-games{font-size:.24em;letter-spacing:.02em}
.gameplay{border-top:1px solid var(--line);background:linear-gradient(180deg,#111113,var(--bg))}
.video-intro{display:flex;justify-content:space-between;align-items:end;gap:50px;margin:42px 0 47px}
.video-intro h3{font-size:clamp(42px,5vw,68px);line-height:1.3;letter-spacing:-.035em}
.video-intro p{font-size:16px;color:var(--muted);line-height:2;margin-bottom:19px}
.video-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.video-swipe{font-size:11px;color:var(--muted)}
.video-rail{--gutter:max(56px,calc((100vw - var(--max))/2));display:flex;gap:28px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:var(--gutter);padding:4px var(--gutter) 22px;scrollbar-width:thin;scrollbar-color:#606067 #1d1d20}
.video-rail:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.video-card{flex:0 0 calc((100% - 56px)/3);min-width:0;scroll-snap-align:start}
.video-frame{position:relative;aspect-ratio:9/16;background:#141416;isolation:isolate}
.video-placeholder{position:relative;aspect-ratio:9/16;padding:25px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #3b3b40;overflow:hidden;background:linear-gradient(155deg,#212125,#101012 80%)}
.video-placeholder:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 69px,#ffffff06 69px 70px);pointer-events:none}
.video-kicker{font:11px/1.6 Arial,sans-serif;letter-spacing:.13em;color:#aaaab1}
.video-kicker:before{content:"";display:inline-block;width:6px;height:6px;background:var(--accent);margin:0 9px 1px 0}
.video-empty-title{font:700 clamp(42px,5.4vw,78px)/.94 Display,Impact,sans-serif;letter-spacing:-.02em;color:#73737a;white-space:pre-line}
.video-card:nth-child(2) .video-placeholder{background:linear-gradient(155deg,#32171c,#101012 80%)}
.video-card:nth-child(3n) .video-placeholder{background:linear-gradient(155deg,#29292d,#101012 80%)}
.video-pending{font-size:12px;color:#b7b7be;line-height:1.7}
.gameplay-video,.video-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.gameplay-video{z-index:1}.gameplay-video:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.video-poster{background:#101012}
.video-watch{position:absolute;inset:auto 20px 22px;z-index:2;text-align:center;padding:14px;background:#f4f3f0;color:#080809;font-size:14px;font-weight:bold}
.video-watch:hover{background:white;text-decoration:underline}
.video-caption{display:flex;flex-direction:column;gap:6px;margin-top:18px;padding-top:15px;border-top:1px solid #3b3b40}
.video-caption h4{font-size:18px;font-weight:600;line-height:1.6;margin:0}.video-caption p{font-size:13px;line-height:1.8;color:var(--muted)}
.video-date{font-size:11px;line-height:1.7;letter-spacing:.04em;color:var(--muted)}
.video-frame .video-placeholder{position:absolute;inset:0;aspect-ratio:auto}
.video-note{font-size:12px;line-height:1.8;color:var(--muted);margin-top:21px}
@media(max-width:1000px){.video-rail{--gutter:32px;gap:22px}.video-card{flex-basis:calc((100% - 44px)/3)}.video-placeholder{padding:18px}.video-empty-title{font-size:5.3vw}.site-header nav{gap:16px}}
@media(max-width:760px) and (min-width:641px){.site-header{height:auto;min-height:125px;flex-wrap:wrap;padding-block:16px;gap:14px}.site-header nav{width:100%;justify-content:space-between}}
@media(max-width:640px){
 .hero-brand{font-size:23vw;display:block;line-height:.95;margin:38px 0 34px;max-width:max-content}
 .hero-brand .brand-games{display:block;text-align:right;font-size:.3em;margin-top:.22em;margin-right:.02em;letter-spacing:.03em}
 .video-intro{display:block;margin:31px 0}.video-intro h3{font-size:44px;margin-bottom:24px}.video-intro p{font-size:15px}
 .video-toolbar{align-items:start;gap:10px}.video-toolbar .small-meta{max-width:52%;font-size:9px;line-height:1.6}.video-swipe{font-size:10px;white-space:nowrap}
 .video-rail{--gutter:20px;gap:18px}.video-card{flex-basis:76vw;max-width:350px}.video-placeholder{padding:23px}.video-empty-title{font-size:68px}.video-caption h4{font-size:17px}.video-note{font-size:11px}
 .site-footer{flex-wrap:wrap}.footer-meta{text-align:left}
}

/* Actual device footage leads the introduction without cropping the portrait screen. */
.hero{min-height:0}.hero-stage{display:grid;grid-template-columns:minmax(0,1fr) 270px;align-items:center;gap:70px;margin-top:32px}
.hero-brand{display:block;font-size:clamp(90px,12.9vw,180px);margin:0 0 33px;max-width:max-content;line-height:.9}
.hero-brand .brand-games{display:block;text-align:right;font-size:.27em;margin-top:.25em;margin-right:.05em}
.hero-copy>p{font-size:16px;color:#bebec2;line-height:1.95;margin-top:18px}
.hero-copy .current-note{width:100%;max-width:410px;margin-top:35px;padding-top:16px;border-color:#ffffff35}
.hero-copy .current-note p{font-size:16px;line-height:1.8;margin:8px 0;color:var(--text)}
.hero-footage{width:100%;align-self:center}.hero-video-label{display:flex;justify-content:space-between;font:10px/1.5 Arial,sans-serif;letter-spacing:.13em;margin-bottom:10px;color:#ccc}
.hero-video-label span:first-child:before{content:"";display:inline-block;width:5px;height:5px;background:var(--accent);margin:0 8px 1px 0}
.hero-footage video{display:block;width:100%;height:auto;aspect-ratio:9/20;object-fit:contain;background:#151518;border:1px solid #4a4a51}
.hero-footage figcaption{font-size:11px;margin-top:10px}.hero-foot{margin-top:30px}.game-image{aspect-ratio:9/20}
@media(min-width:1100px){.hero-stage{grid-template-columns:minmax(0,1fr) 270px;gap:100px}}
@media(min-width:641px) and (max-width:1000px){.hero-stage{grid-template-columns:minmax(0,1fr) 220px;gap:35px}.hero-brand{font-size:11.5vw}.hero h2{font-size:24px}.hero-copy .current-note{margin-top:24px}}
@media(max-width:640px){
 .hero-stage{display:flex;flex-direction:column;align-items:start;gap:25px;margin-top:32px}.hero-copy{display:contents}
 .hero-brand{order:0;font-size:23vw;margin:0;line-height:.95}.hero-footage{order:1;width:min(72vw,280px);align-self:center}
 .hero-copy h2{order:2;font-size:clamp(20px,6.4vw,26px);margin-top:4px}.hero-copy>p{order:3;margin:0}.hero-copy>.button{order:4;margin:0}.hero-copy .current-note{display:none}
}

/* Battle mode labels and motion with a single user-controlled stop switch. */
.video-mode{display:block;min-height:38px;padding:7px 12px;margin-bottom:10px;border:1px solid #5d5d65;font-size:13px;line-height:1.7;color:#dedee4}
.video-card[data-mode="CPU４人対戦"] .video-mode{background:#de1725;border-color:#de1725;color:#fff;font-weight:700}
.video-card[data-mode="タイムアタック"] .video-mode{color:var(--muted);border-color:var(--line)}
.hero-video-label{font-size:12px}.hero-video-label [data-featured-mode]{color:#fff;background:#de1725;padding:7px 12px;letter-spacing:.02em;font-weight:700}.hero-video-label span:first-child:before{display:none}.hero-video-label{align-items:center}
.hero-footage{transform-origin:center;will-change:transform}.motion-on .hero-footage{transform:translateY(calc(var(--hero-progress) * -65px)) rotate(calc(var(--hero-progress) * -2deg))}
.motion-on .hero-brand{transform:translateY(calc(var(--hero-progress) * -65px)) scale(calc(1 - var(--hero-progress) * .065));animation:brand-arrival 1.1s ease-out both}
.motion-on .hero-copy>h2,.motion-on .hero-copy>p,.motion-on .hero-copy>.button{animation:copy-arrival .9s ease-out both;animation-delay:.15s}
.motion-on .hero-copy>p{animation-delay:.3s}.motion-on .hero-copy>.button{animation-delay:.45s}
.motion-on .hero-light:before{animation:track-glow 6s ease-in-out infinite alternate}
.motion-on .video-intro h3{transform:translateX(calc(var(--intro-shift,0) * 1px));will-change:transform}
.kinetic-loop{display:flex;width:max-content}.kinetic-loop>span{flex:none}.motion-on .kinetic-loop{animation:race-marquee 22s linear infinite}
.motion-on .video-card.reveal{transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1),border-color .2s;transition-delay:var(--reveal-delay,0ms)}
.motion-on .video-card.reveal.is-pending{transform:translateY(48px);opacity:0}
@media(hover:hover){.motion-on .video-card:not(.is-pending):hover{transform:translateY(-8px)}.video-card:hover .video-caption{border-color:#f02d35}}
.motion-off .hero-footage,.motion-off .video-intro h3{transform:none}.motion-off .kinetic-loop{animation:none}
@keyframes brand-arrival{from{opacity:0;filter:blur(7px)}to{opacity:1;filter:blur(0)}}
@keyframes copy-arrival{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
@keyframes track-glow{from{opacity:.35}to{opacity:1}}
@keyframes race-marquee{to{transform:translateX(-50%)}}
@media(max-width:640px){.motion-on .hero-footage{transform:translateY(calc(var(--hero-progress) * -25px))}.motion-on .video-intro h3{transform:translateX(calc(var(--intro-shift,0) * .35px))}}
@media(max-width:640px){.about h3{font-size:clamp(20px,6.7vw,27px)}}
/* Keep the revised Japanese headings together on narrow phones. */
@media(max-width:640px){.connect-intro h3{font-size:clamp(22px,6.4vw,27px)}.testing h3{font-size:clamp(26px,7vw,33px)}}

/* A full-width introduction, followed by two balanced text columns on desktop. */
.about-body{display:block;margin-top:32px}
.about-copy{margin-top:30px}
.about-column+.about-column{margin-top:18px}
@media(min-width:761px){
 .about{padding-block:68px 74px}
 .about h3{font-size:clamp(32px,3.5vw,50px);line-height:1.45}
 .about h3 br{display:none}
 .about-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:48px;margin-top:34px;line-height:1.95}
 .about-column+.about-column{margin-top:0;padding-left:40px;border-left:1px solid #c6c6c2}
}
/* Reversible scroll motion: both entry edges and continuously moving headings. */
.section-label{padding-bottom:15px;background:linear-gradient(var(--accent),var(--accent)) left bottom/0 1px no-repeat}
.motion-on .section-label{background-size:var(--section-line,18%) 1px}
.motion-on .about h3{translate:calc(var(--section-shift,0) * .5px) 0}
.motion-on .project h3{translate:calc(var(--section-shift,0) * -.35px) 0}
.motion-on .connect-intro h3{translate:0 calc(var(--section-shift,0) * .65px)}
.motion-on .testing h3{translate:calc(var(--section-shift,0) * -.55px) 0}
.motion-on .reveal.is-pending,.motion-on .video-card.reveal.is-pending{transform:translateY(var(--reveal-y,36px))}
.motion-on .social-row.reveal.is-pending{transform:translateX(var(--reveal-x,28px))}
.motion-on .reveal.is-pending:focus-within{opacity:1;transform:none;transition:none}
.motion-off .about h3,.motion-off .project h3,.motion-off .connect-intro h3,.motion-off .testing h3{translate:none}
.motion-off .section-label{background-size:100% 1px}
@media(max-width:640px){.motion-on .about h3,.motion-on .project h3,.motion-on .testing h3{translate:calc(var(--section-shift,0) * .2px) 0}}