/* hboyo editorial system: 12 / 8 / 4 columns; 8pt spacing. */
:root{
 --columns:12;--gutter:24px;--page-margin:64px;--content-max:1728px;
 --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:40px;--s6:48px;--s7:56px;--s8:64px;--s9:72px;--s12:96px;--s16:128px;
 --pad-x:var(--page-margin);--nav-h:72px;--footer-height:72px;
 --sans:"Portable Sans SC","HarmonyOS Sans SC","MiSans","Microsoft YaHei",sans-serif;
 --type-display:48px;--type-title:48px;--type-section:40px;--type-subhead:24px;--type-body:16px;--type-meta:14px;--type-small:12px;
 --t-body:var(--type-body);--t-head:var(--type-subhead);--t-lead:20px;--t-xs:var(--type-small);--t-sm:var(--type-meta);
 --motion-fast:160ms;--motion-ui:240ms;--motion-scene:640ms;--motion-ease:cubic-bezier(.16,1,.3,1);
}
@media(min-width:1600px){:root{--page-margin:96px;--type-display:64px;--type-title:56px;--type-section:48px}}
@media(min-width:768px) and (max-width:1199px){:root{--columns:8;--page-margin:32px;--type-display:48px;--type-title:40px;--type-section:32px}}
@media(max-width:767px){:root{--columns:4;--gutter:16px;--page-margin:24px;--nav-h:64px;--footer-height:64px;--type-display:32px;--type-title:32px;--type-section:32px;--type-subhead:24px}}
html,html:focus-within{scroll-behavior:auto}
body{background:var(--paper);font-size:var(--type-body);line-height:1.5}
h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}
:where(a,button,input,select,summary):focus-visible{outline:2px solid var(--ink);outline-offset:4px}
button,input,select{font-size:16px}
.nav,.foot,.hero,.selected,.real-section,.page-head,.panel,.detail-top,.detail-cover,.detail-body{
 padding-inline:max(var(--page-margin),calc((100% - var(--content-max))/2));
}
.hero,body[data-page="home"] .selected,.real-section,.detail-body,.about-grid,.log-layout,.work-grid,.real-roster,.real-video-grid,.real-model-grid,.real-pbr-links,.real-phone-grid,.real-image-grid,.modes{
 display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));column-gap:var(--gutter);
}
.real-section>*{grid-column:1/-1;min-width:0}
.nav{height:var(--nav-h);display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:var(--gutter);padding-block:16px}
.nav>.wordmark{grid-column:1/span 2;width:128px;max-width:100%}
.nav-links{grid-column:5/-1;justify-self:end;gap:32px}
.nav-sep{display:none}.nav-links>a{font-size:14px}.nav-cta{min-height:40px;padding:8px 24px}
.nav-mail,.nav-toggle{display:none}
.foot{display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));column-gap:var(--gutter);padding-block:16px}
.foot-inner{grid-column:1/span 9;gap:32px;min-width:0}.foot-meta{grid-column:10/-1;justify-self:end;font-size:12px}.foot-tools{gap:24px}.foot .wordmark{width:104px}
.hero{background:var(--lime);padding-block:64px;gap:0 var(--gutter);align-items:center;align-content:start}
body[data-page="home"] .hero{min-height:calc(100svh - var(--nav-h) - var(--footer-height))}
.hero-copy{grid-column:1/span 5;align-self:start;padding:0;margin-top:48px;min-width:0}
.hero h1,.hero h1 span{font-size:var(--type-display);font-weight:800;line-height:1.16;letter-spacing:-.035em;white-space:normal;animation:none}
.hero h1 .hero-line{display:block}
.hero .lead{font-size:20px;line-height:1.6;margin-top:32px;max-width:36ch;animation:none}
.hero-actions{gap:16px;margin-top:32px;animation:none}
.hero-stage{grid-column:6/-1;width:100%;height:min(64svh,640px);min-height:400px;margin:0;animation:none}
.hero-stage canvas{width:100%;height:100%}
.btn{min-height:48px;padding:8px 24px;font-size:16px;gap:16px;transition:background-color var(--motion-fast),color var(--motion-fast),transform var(--motion-fast) var(--motion-ease)}
body[data-page="home"] .selected{padding-block:64px 32px;padding-inline:max(var(--page-margin),calc((100% - var(--content-max))/2));align-content:start;container-type:inline-size;min-height:calc(100svh - var(--nav-h) - var(--footer-height))}
.arc-heading,.selected-grid,.arc-labels{grid-column:1/-1;min-width:0}
body[data-page="home"] .selected-title{font-size:var(--type-section);line-height:1.2;letter-spacing:-.03em}
body[data-page="home"] .selected-grid{--art-step:calc((100cqw + var(--gutter))/12);height:clamp(400px,48svh,552px);min-height:400px;margin:32px 0 0;max-width:none;perspective:1700px}
.selected-grid>.arc-card{width:calc(clamp(184px,calc(var(--art-step)*2.8 - var(--gutter)),336px)*var(--w));box-shadow:none;padding:0;transition:transform var(--motion-ui) var(--motion-ease)}
.selected-grid>.arc-card:nth-child(1){--x:calc(var(--art-step)*-4.45)}
.selected-grid>.arc-card:nth-child(2){--x:calc(var(--art-step)*-2.65)}
.selected-grid>.arc-card:nth-child(3){--x:calc(var(--art-step)*-.85)}
.selected-grid>.arc-card:nth-child(4){--x:calc(var(--art-step)*1.05)}
.selected-grid>.arc-card:nth-child(5){--x:calc(var(--art-step)*2.65)}
.selected-grid>.arc-card:nth-child(6){--x:calc(var(--art-step)*4.55)}
.arc-surface{position:relative;border-radius:4px;box-shadow:0 16px 24px -13px #1c332e40,8px 40px 42px -25px #1c332e4d}
.arc-surface::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:0 24px 32px -12px #1c332e50;opacity:0;transition:opacity var(--motion-ui)}
.arc-card.arc-active,.arc-card:focus-visible{--lift:0px;--pop:0px;box-shadow:none}
.arc-card:focus-visible{outline:2px solid var(--ink);outline-offset:8px;transition:none}
.arc-labels{margin:16px 0 0;gap:var(--gutter);width:100%;max-width:none}
.arc-labels a{font-size:12px;line-height:1.5;min-height:40px}
.arc-caption h3{font-size:16px;line-height:1.5}
.arc-caption svg{width:20px;height:16px;flex-shrink:0;transition:transform var(--motion-fast) var(--motion-ease)}
.arc-status{padding:0 8px;font-size:12px;line-height:24px;left:8px;bottom:8px}
.real-section{padding-block:96px;row-gap:0}
.real-section-head{display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:var(--gutter);align-items:start;margin:0 0 48px}
.real-section-head h2{grid-column:1/span 8;font-size:var(--type-section);line-height:1.2;font-weight:800;letter-spacing:-.03em}
.real-section-head:has(p) h2{grid-column:1/span 5}
.real-section-head p{grid-column:6/span 4;font-size:16px;line-height:1.75;margin:0;max-width:48ch;color:var(--ink-soft)}
.real-section-head>a{grid-column:10/-1;justify-self:end;align-self:start;min-height:48px;font-size:14px;white-space:normal;margin:0}
.real-section h1,.page-head h1,.detail-title h1{font-size:var(--type-title);line-height:1.16;font-weight:800;letter-spacing:-.03em}
.real-intro,.page-head .lead,.detail-lead{font-size:20px;line-height:1.6;max-width:56ch;margin-top:24px}
.real-factions{gap:8px;margin-bottom:24px}.real-factions span{padding:8px 16px;font-size:14px}
.real-roster{row-gap:40px;align-items:start}
.real-unit{grid-column:span 3;min-width:0}.real-sprite-stage{aspect-ratio:4/3}
.real-unit-caption{margin-top:16px}.real-unit-caption h3{font-size:20px;line-height:1.4;margin-top:8px}
.real-unit-caption>span,.real-facing{font-size:12px;line-height:1.5;color:var(--ink-soft)}
.real-sprite-controls{gap:8px;margin-top:16px}.real-sprite-controls label{font-size:12px;gap:8px}
.real-sprite-controls select,.real-sprite-controls button{height:48px;min-height:48px;font-size:14px;padding:8px}
.real-sprite-controls label[hidden]{display:none}.real-facing:empty{display:none}.real-facing{display:block;margin-top:8px}
.real-unit-link{margin-top:8px;min-height:40px;font-size:14px}.real-frame{font-size:12px}
.real-systems{margin-top:40px;padding-top:24px}.real-systems summary{min-height:40px}
.real-filter{display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:var(--gutter);align-items:end;margin-block:32px 48px}
.real-filter>label:first-child{grid-column:span 3}.real-filter>label:nth-child(2){grid-column:span 5}.real-filter>output{grid-column:span 4;justify-self:end}
.real-filter label{font-size:14px;gap:8px}.real-filter input,.real-filter select{height:48px;padding:8px 16px;font-size:16px}
.real-selected-unit{margin-block:48px 64px}.real-selected-unit h2{font-size:24px;margin-bottom:24px}
.real-unit-expanded{max-width:640px;margin-inline:auto}.real-unit-expanded .real-sprite-stage{aspect-ratio:4/3}
.real-video-grid{row-gap:64px;align-items:start}
.real-video-grid>article{grid-column:span 6;min-width:0}
.real-video-grid>article:nth-child(4n+1){grid-column:span 8}.real-video-grid>article:nth-child(4n+2){grid-column:span 4;margin-top:64px}
.real-video-grid h3{font-size:20px;line-height:1.4;margin-top:16px}.real-video-grid p{font-size:14px;line-height:1.5;margin-top:8px}
.home-changan .real-video-grid{row-gap:24px}
.home-changan .real-video-grid>article:first-child{grid-column:1/span 8;grid-row:1/span 2;align-self:stretch}
.home-changan .real-video-grid>article:nth-child(2){grid-column:9/-1;grid-row:1;margin:0}
.home-changan .real-video-grid>article:nth-child(3){grid-column:9/-1;grid-row:2}
.home-changan .real-video-grid>article>h3,.home-changan .real-video-grid>article>p{display:none}
.home-changan article:first-child .vblock,.home-changan article:first-child .vposter{height:100%;aspect-ratio:auto}
.home-changan article:first-child .vposter img{height:100%;object-fit:cover}
.real-inline-link{justify-self:end;margin-top:24px;min-height:48px;font-size:14px}
.real-pbr-links{row-gap:32px;align-items:start}.real-pbr-links>a:first-child{grid-column:1/span 4}.real-pbr-links>a:nth-child(2){grid-column:5/-1;margin-top:64px}
.real-pbr-links img{height:auto;width:100%;aspect-ratio:16/10;object-fit:cover}.real-pbr-links>a:first-child img{aspect-ratio:4/5;object-fit:contain;background:#e6e7de}
.real-pbr-links h3{font-size:24px;line-height:1.4;margin-top:16px}
.real-phone-grid{gap:40px var(--gutter);align-items:start;justify-content:normal}
.real-phone-grid figure{grid-column:span 3;min-width:0;width:100%}.real-phone-grid img{width:100%;height:auto;max-height:none;object-fit:initial}
.real-phone-grid figcaption{font-size:14px;line-height:1.5;margin-top:16px}
.line17-entry{display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:var(--gutter);margin-top:32px}
.line17-entry>p{grid-column:1/span 7;font-size:16px;line-height:1.75;max-width:56ch}
.line17-actions{grid-column:8/-1;justify-self:end;gap:16px}.line17-cover img{max-height:560px}
.page-head{padding-block:64px 40px;border:0}.page-head .lead{font-size:20px}
.panel{padding-block:40px 96px}.section-head{gap:16px;padding-bottom:16px;margin-bottom:32px}.section-head h2,.block-title{font-size:var(--type-subhead);line-height:1.3}
.filter-row{gap:16px;margin:0;padding-bottom:48px}.filters{gap:8px}.chip{min-height:48px;padding:8px 16px;font-size:14px}.search{min-height:48px}.search input{height:48px;font-size:16px}
.work-grid{gap:80px var(--gutter)}.work-item[data-size="wide"]{grid-column:span 7}.work-item[data-size="narrow"]{grid-column:span 5}
.work-item[data-offset="1"]{margin-top:64px}.work-item-meta{margin-top:16px;gap:16px}.work-item-title{font-size:24px;line-height:1.3}.work-item-en{font-size:12px;line-height:1.5}
.work-item-sub{font-size:16px;line-height:1.75;margin-top:16px;max-width:56ch}.work-item-foot{gap:8px;margin-top:16px;font-size:12px;line-height:24px}
.work-item-media img,.gallery img{transition:transform var(--motion-ui) var(--motion-ease),opacity var(--motion-ui)}
.work-item:hover .work-item-media img,.gallery figure:hover img{transform:none}
.detail-top{padding-block:48px 40px}.crumb{font-size:14px;line-height:24px;gap:16px;margin-bottom:24px}.detail-title{gap:24px}.detail-title .en{font-size:14px;line-height:24px}
.detail-play{gap:16px;margin-top:24px}.detail-lead{max-width:56ch}
.detail-cover img{max-height:640px;object-fit:contain;background:#e8e7df}
.detail-body{padding-block:64px 96px;row-gap:48px;align-items:start}
.detail-main{grid-column:5/-1;grid-row:1;min-width:0}.detail-aside{grid-column:1/span 3;grid-row:1;min-width:0;top:calc(var(--nav-h) + 32px)}
.detail-main>*+*{margin-top:64px}.detail-aside h2{font-size:14px;line-height:24px;letter-spacing:0;margin-bottom:16px}
.tool-list li{padding-block:8px;font-size:14px;line-height:24px}.detail-info{margin-block:32px}.detail-info summary{min-height:40px;font-weight:650;font-size:16px}
.detail-info .detail-facts{display:block;margin:16px 0 0;padding:0;border:0}.detail-info .fact{padding-block:8px}.fact dd{font-size:14px;line-height:24px;margin-top:8px}.fact dt{font-size:12px}
.prose p,.step p{font-size:16px;line-height:1.75;max-width:64ch}.prose p+p{margin-top:24px}.block-title{margin-bottom:24px}.step{gap:24px;padding-block:24px}.step h3{font-size:20px}
.gallery{grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:24px}.gallery figure{grid-column:span 6}.gallery figure.is-full{grid-column:1/-1}.gallery figcaption{font-size:14px;line-height:24px;padding-top:8px}
body[data-project-kind="miniapp"] .gallery figure,body[data-project-kind="miniapp"] .gallery figure.is-full{grid-column:span 6}
body[data-project-kind="miniapp"] .detail-cover .gallery figure,body[data-project-kind="miniapp"] .detail-cover .gallery figure.is-full{grid-column:span 3;background:transparent}
body[data-project-kind="miniapp"] .gallery img{height:auto;max-height:none;aspect-ratio:9/20;object-fit:contain;transform:none}
.real-image-grid{gap:32px var(--gutter)}.real-image-grid>figure{grid-column:span 4;min-width:0}.real-image-grid img{height:auto;aspect-ratio:4/3;object-fit:contain}
.real-model-grid{gap:64px var(--gutter);margin-block:48px 96px}.real-model-grid>article{grid-column:span 6;min-width:0}.real-model-grid>article:nth-child(even){margin-top:64px}
.real-model-grid h2{font-size:24px;margin-bottom:24px}.real-model-grid article>a{display:flex;align-items:center;min-height:48px;font-size:14px;margin-top:16px}
.model-info{margin-top:16px;font-size:14px;line-height:1.75}.model-info summary{min-height:40px;cursor:pointer}.model-info p{margin-top:16px;min-height:0}
.model-bar{padding:16px;gap:8px}.model-bar .sprite-btn{min-height:48px;padding:8px 16px;font-size:14px}.model-bar .hint{font-size:12px;line-height:1.5}
.model-stage{height:min(62svh,520px);min-height:320px;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr);overflow:hidden}.model-stage>img,.detail-cover .model-stage>img{width:100%;height:100%;min-height:0;max-height:100%;object-fit:contain}
.about-grid{row-gap:48px}.about-body{grid-column:1/span 7}.about-side{grid-column:9/-1}.about-body p{font-size:20px;line-height:1.6}.about-body p+p{margin-top:24px}
.log-nav{grid-column:1/span 3}#log-body{grid-column:5/-1;min-width:0}.log-layout{row-gap:48px}
.modes{row-gap:40px}.mode{grid-column:span 3}.mode h3{font-size:24px}.mode p{font-size:16px;line-height:1.75;margin-top:16px}
.contact-row{grid-template-columns:repeat(var(--columns),minmax(0,1fr));padding-block:24px;gap:24px}.contact-row .label{grid-column:span 3}.contact-row .value{grid-column:span 6;font-size:24px}.contact-row .note{grid-column:span 3;font-size:14px;line-height:24px}
.contact-row{display:grid}.contact-row .label{width:auto}.contact-row .value{min-width:0;overflow-wrap:anywhere}
.resume-section{display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:var(--gutter);margin-top:64px;align-items:start}
.resume-info{grid-column:1/span 6}.resume-info h2{font-size:var(--type-section);line-height:1.2;font-weight:800}.resume-info p{margin-top:24px;font-size:16px;color:var(--ink-soft)}
.resume-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:32px}.resume-preview{grid-column:8/-1;display:block}.resume-preview img{width:100%;height:auto}
.reveal,.reveal.is-in{opacity:1;transform:none;transition:none}
.mmenu{transition:opacity var(--motion-ui),transform var(--motion-ui) var(--motion-ease)}
.mmenu[data-input="keyboard"]{transition:none}
.lightbox{transition:opacity var(--motion-fast)}
.nav-toggle svg{overflow:visible}.nav-toggle path{transition:transform var(--motion-fast) var(--motion-ease);transform-origin:center}
.btn:active,.sprite-btn:active,.real-play:active,.real-step:active,.real-replay:active{transform:scale(.98)}
@media(hover:hover) and (pointer:fine){
 .arc-card.arc-active[data-motion-input="pointer"]{--lift:-8px;--pop:0px}
 .arc-card.arc-active[data-motion-input="pointer"] .arc-surface::after{opacity:1}
 .arc-card.arc-active[data-motion-input="pointer"] .arc-caption svg{transform:translateX(4px)}
 .work-item:hover .work-item-media img,.gallery figure:hover img{transform:scale(1.025)}
 .real-unit-link:hover svg,.real-section-head>a:hover svg,.line17-actions a:hover svg{transform:translateX(4px)}
}
.real-unit-link svg,.real-section-head>a svg,.line17-actions svg{transition:transform var(--motion-fast) var(--motion-ease)}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:160ms}
@media(min-width:768px) and (max-width:1199px){
 .nav-links{grid-column:3/-1;gap:24px}.foot-inner{grid-column:1/span 6}.foot-meta{grid-column:7/-1}
 .hero{padding-block:48px}.hero-copy{grid-column:1/-1;margin-top:0}.hero-stage{grid-column:2/-1;height:440px;min-height:0;margin:24px 0 0}.hero .lead{max-width:48ch}
 body[data-page="home"] .selected-grid{--art-step:calc((100cqw + var(--gutter))/8);min-height:360px;height:400px}
 .selected-grid>.arc-card{width:calc(1.95 * var(--art-step) * var(--w))}
 .selected-grid>.arc-card:nth-child(1){--x:calc(var(--art-step)*-2.8)}.selected-grid>.arc-card:nth-child(2){--x:calc(var(--art-step)*-1.75)}.selected-grid>.arc-card:nth-child(3){--x:calc(var(--art-step)*-.6)}.selected-grid>.arc-card:nth-child(4){--x:calc(var(--art-step)*.65)}.selected-grid>.arc-card:nth-child(5){--x:calc(var(--art-step)*1.75)}.selected-grid>.arc-card:nth-child(6){--x:calc(var(--art-step)*2.85)}
 .real-section{padding-block:72px}.real-section-head h2,.real-section-head:has(p) h2{grid-column:1/span 4}.real-section-head p{grid-column:5/-1}.real-section-head>a{grid-column:5/-1;justify-self:start}
 .real-unit{grid-column:span 4}.real-filter>label:first-child{grid-column:span 3}.real-filter>label:nth-child(2){grid-column:span 3}.real-filter>output{grid-column:span 2}
 .real-video-grid>article,.real-video-grid>article:nth-child(4n+1),.real-video-grid>article:nth-child(4n+2){grid-column:span 4}
 .home-changan .real-video-grid>article:first-child{grid-column:1/span 5}.home-changan .real-video-grid>article:nth-child(2),.home-changan .real-video-grid>article:nth-child(3){grid-column:6/-1}
 .real-pbr-links>a:first-child{grid-column:1/span 3}.real-pbr-links>a:nth-child(2){grid-column:4/-1;margin-top:32px}.real-phone-grid figure{grid-column:span 4}
 .line17-entry>p{grid-column:1/-1}.line17-actions{grid-column:1/-1;justify-self:start}
 .work-item[data-size="wide"],.work-item[data-size="narrow"]{grid-column:span 4}.work-item[data-offset="1"]{margin-top:40px}
 .detail-main{grid-column:3/-1}.detail-aside{grid-column:1/span 2}.real-model-grid>article{grid-column:span 4}.real-image-grid>figure{grid-column:span 4}
 .gallery figure,body[data-project-kind="miniapp"] .gallery figure,body[data-project-kind="miniapp"] .gallery figure.is-full{grid-column:span 4}.gallery figure.is-full{grid-column:1/-1}
 body[data-project-kind="miniapp"] .detail-cover .gallery figure,body[data-project-kind="miniapp"] .detail-cover .gallery figure.is-full{grid-column:span 4}
 .about-body{grid-column:1/span 5}.about-side{grid-column:6/-1}.log-nav{grid-column:1/span 2}#log-body{grid-column:3/-1}.mode{grid-column:span 4}
 .contact-row .label{grid-column:span 2}.contact-row .value{grid-column:span 4}.contact-row .note{grid-column:span 2}
 .resume-info{grid-column:1/span 4}.resume-preview{grid-column:5/-1}
}
@media(max-width:767px){
 .nav>.wordmark{width:104px}.nav-links{display:none}.nav-mail{display:flex;grid-column:3;justify-self:end}.nav-toggle{display:block;grid-column:4;justify-self:end;width:32px;height:32px}
 .foot-inner{grid-column:1/-1;gap:16px}.foot-meta{display:none}.foot-tools{gap:12px}.foot-tools svg{width:20px;height:20px}.foot .wordmark{width:96px}
 .hero{padding-block:40px 24px}.hero-copy{grid-column:1/-1;margin:0}.hero h1{font-size:var(--type-display)}.hero .lead{font-size:16px;line-height:1.75;margin-top:24px;max-width:36ch}.hero-actions{margin-top:24px}
 .hero-stage{grid-column:1/-1;height:88vw;max-height:448px;min-height:0;margin:16px 0 0}
 body[data-page="home"] .selected{padding-block:56px 40px;min-height:0}
 body[data-page="home"] .selected-grid{--art-step:calc((100cqw + var(--gutter))/4);--mobile-card-width:min(calc(3 * var(--art-step) - var(--gutter)),296px);height:calc(6 * (var(--mobile-card-width)/1.5 + 64px) + 48px);min-height:0;margin:32px 0 0;width:100%}
 .selected-grid>.arc-card:nth-child(n){width:calc(var(--mobile-card-width)*var(--w));--my:calc(var(--slot) * (var(--mobile-card-width)/1.5 + 64px) + 24px)}
 .selected-grid>.arc-card:nth-child(1){--mx:0px}.selected-grid>.arc-card:nth-child(2){--mx:calc(var(--art-step)*.55)}.selected-grid>.arc-card:nth-child(3){--mx:calc(var(--art-step)*.9)}.selected-grid>.arc-card:nth-child(4){--mx:calc(var(--art-step)*1.1)}.selected-grid>.arc-card:nth-child(5){--mx:calc(var(--art-step)*.65)}.selected-grid>.arc-card:nth-child(6){--mx:0px}
 .arc-caption{padding:8px 16px}.arc-caption h3{font-size:16px}.arc-labels{display:none}
 .real-section{padding-block:56px}.real-section-head{row-gap:24px;margin-bottom:32px}.real-section-head h2,.real-section-head:has(p) h2,.real-section-head p,.real-section-head>a{grid-column:1/-1;justify-self:start}.real-section-head p{font-size:16px;margin:0}.real-section-head>a{margin:0}
 .real-unit{grid-column:span 2}.real-roster{row-gap:32px}.real-unit-caption h3{font-size:20px}.real-sprite-controls label{flex-basis:100%}.real-sprite-controls select,.real-sprite-controls button{font-size:14px}
 .real-filter{row-gap:24px;margin-block:24px 32px}.real-filter>label:first-child,.real-filter>label:nth-child(2){grid-column:span 2}.real-filter>output{grid-column:1/-1;justify-self:start}
 .real-selected-unit{margin-block:32px 48px}.real-intro{font-size:16px;line-height:1.75}.real-section h1{font-size:32px}
 .real-video-grid{row-gap:40px}.real-video-grid>article,.real-video-grid>article:nth-child(4n+1),.real-video-grid>article:nth-child(4n+2){grid-column:1/-1;margin:0}
 .home-changan .real-video-grid>article:first-child{grid-column:1/-1;grid-row:auto}.home-changan .real-video-grid>article:nth-child(2),.home-changan .real-video-grid>article:nth-child(3){grid-column:span 2;grid-row:auto}
 .home-changan article:first-child .vblock,.home-changan article:first-child .vposter{height:auto;aspect-ratio:16/9}
 .real-pbr-links>a:first-child,.real-pbr-links>a:nth-child(2){grid-column:1/-1;margin:0}.real-pbr-links>a:first-child img{aspect-ratio:4/3}.real-pbr-links h3{font-size:24px}
 .real-phone-grid figure{grid-column:span 2}.real-phone-grid figcaption{font-size:12px;line-height:1.5;margin-top:8px}
 .line17-entry>p,.line17-actions{grid-column:1/-1;justify-self:start}.line17-actions{gap:16px;flex-wrap:wrap}.line17-entry>p{font-size:16px}
 .page-head{padding-block:40px 32px}.page-head .lead,.detail-lead{font-size:16px;line-height:1.75}.panel{padding-block:32px 56px}.filter-row{padding-bottom:32px}.search{width:100%}
 .work-grid{row-gap:48px}.work-item[data-size="wide"],.work-item[data-size="narrow"]{grid-column:1/-1}.work-item[data-offset="1"]{margin:0}.work-item-title{font-size:24px}.work-item-sub{margin-top:16px}
 .detail-top{padding-block:32px}.detail-title{display:block}.detail-title .en{margin-top:16px}.detail-cover img{max-height:480px}.detail-body{padding-block:40px 56px;row-gap:48px}
 .detail-main{grid-column:1/-1;grid-row:auto}.detail-aside{grid-column:1/-1;grid-row:auto;position:static}.detail-main>*+*{margin-top:48px}
 .real-model-grid{margin-block:32px 56px;row-gap:48px}.real-model-grid>article{grid-column:1/-1}.real-model-grid>article:nth-child(even){margin:0}.real-image-grid>figure{grid-column:span 2}
 .model-bar{padding:16px}.model-bar .hint{margin:8px 0 0;width:100%}
 .gallery figure,.gallery figure.is-full,body[data-project-kind="miniapp"] .gallery figure,body[data-project-kind="miniapp"] .gallery figure.is-full{grid-column:1/-1}
 body[data-project-kind="miniapp"] .detail-cover .gallery figure,body[data-project-kind="miniapp"] .detail-cover .gallery figure.is-full{grid-column:span 2}
 .about-body,.about-side,.log-nav,#log-body,.mode{grid-column:1/-1}.about-body p{font-size:16px;line-height:1.75}.contact-row{gap:8px}.contact-row .label,.contact-row .value,.contact-row .note{grid-column:1/-1}.contact-row .value{font-size:20px;overflow-wrap:anywhere}
 .resume-section{row-gap:32px;margin-top:48px}.resume-info,.resume-preview{grid-column:1/-1}
 .contact-row .value a[href^="mailto:"]{font-size:18px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
 .btn:active,.sprite-btn:active,.real-play:active,.real-step:active,.real-replay:active{transform:none}
 .arc-card.arc-active{--lift:0px;--pop:0px}.arc-surface{transform:none!important;opacity:1!important}
 ::view-transition-old(root),::view-transition-new(root){animation:none!important}
}
@media(max-width:380px){.hero h1,.hero h1 span{font-size:28px;letter-spacing:-.035em}.hero h1 .hero-line:first-child{white-space:nowrap}}
.work-phone-cover{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:24px;background:#e4e8dc;align-items:start}
.work-item .work-phone-cover img{width:100%;height:auto;max-height:100%;object-fit:contain;object-position:top;min-height:0;transform:none!important;padding:0}
@media(max-width:767px){.work-phone-cover{gap:8px;padding:16px}}