*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;color:#18212e;background:#fff;font-family:Inter,"Microsoft YaHei","PingFang SC",sans-serif;font-size:1.0rem;line-height:1.8}a{color:inherit;text-decoration:none}a:hover{color:#245bb1}a:focus-visible,video:focus-visible{outline:3px solid #447ad4;outline-offset:5px}header{position:sticky;top:0;background:rgba(255,255,255,.96);border-bottom:1px solid #e6e9ee;z-index:10}.header-inner{max-width:1200px;margin:auto;padding:18px 36px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:1.25rem;font-weight:700}.brand span{font-size:0.875rem;color:#647083;margin-left:18px;font-weight:400}nav{display:flex;gap:28px;font-size:0.875rem}main{max-width:1200px;margin:auto;padding:0 36px}.intro{padding:60px 0 44px;max-width:940px}.eyebrow{font-size:0.75rem;letter-spacing:.12em;color:#56677d;margin:0 0 10px;font-weight:600}h1{font-size:2.875rem;line-height:1.35;letter-spacing:-.035em;margin:0 0 22px}h1 span{color:#657388;margin-left:18px}p{margin:0}.intro>p:not(.eyebrow){color:#566273;line-height:1.9}.intro-meta{display:flex;gap:24px;flex-wrap:wrap;font-size:0.875rem;margin-top:24px}.intro-meta>span{font-weight:600}.project-index{display:flex;gap:12px 22px;flex-wrap:wrap;padding:22px 0;border-top:1px solid #dfe4eb;border-bottom:1px solid #dfe4eb;font-size:0.8125rem}.project-index>span{color:#69788b}.project-index a{font-weight:500}.project{padding:58px 0;border-bottom:1px solid #e2e6ec}.section-heading{display:flex;align-items:flex-start;gap:22px}.number{color:#426599;font-size:1.0rem;line-height:2}.section-heading .eyebrow{margin-bottom:3px}h2{font-size:1.6875rem;line-height:1.5;margin:0;font-weight:650;letter-spacing:-.02em}.project-desc{max-width:850px;color:#526071;margin:20px 0 12px}.tools{font-size:0.8125rem;color:#66758a;margin-bottom:28px}.video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 28px}.video-card{min-width:0;scroll-margin-top:100px}.video-wrap{background:#101114;border-radius:7px;overflow:hidden;aspect-ratio:16/9}.video-wrap video{display:block;width:100%;height:100%;object-fit:contain}.card-heading{display:flex;justify-content:space-between;gap:14px;align-items:baseline;margin:15px 0 7px}h3{font-size:1.1875rem;line-height:1.5;margin:0}.card-heading span{font-size:0.75rem;font-variant-numeric:tabular-nums;color:#6a7585}.video-card>p{font-size:0.875rem;color:#596678;line-height:1.85}.video-card .note,.note{font-size:0.75rem;color:#738094;margin-top:8px}.fallback{font-size:0.75rem;display:inline-block;color:#436391;margin-top:8px}.recipe-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:900px}figure{margin:0;min-width:0}figure img{display:block;max-width:100%;height:auto;border-radius:5px}.recipe-grid figure img{width:100%}.recipe-grid figure:first-child{padding-top:0}figcaption{color:#718094;font-size:0.75rem;margin-top:10px}.app-result{display:grid;grid-template-columns:.8fr 1fr;gap:50px;align-items:start}.app-result figure{max-width:540px;border:1px solid #e3e7ed;border-radius:7px;padding:12px}.steps{list-style:none;counter-reset:steps;padding:0;margin:20px 0}.steps li{counter-increment:steps;position:relative;padding:0 0 25px 44px;margin-bottom:15px;border-bottom:1px solid #e6eaf0}.steps li:before{content:counter(steps);position:absolute;left:0;top:0;color:#41628f;font-size:1.25rem}.steps b{display:block;font-size:1.0625rem}.steps span{font-size:0.875rem;color:#6b7788}.secondary-project .project-desc{max-width:700px}.game-preview{max-width:520px}.secondary-project{padding:40px 0}footer{padding:58px 0 28px}footer h2{font-size:1.625rem}.contact-links{display:flex;gap:30px;flex-wrap:wrap;margin:20px 0;font-size:1.0625rem}.pdf-button{display:inline-block;padding:10px 20px;border:1px solid #bcc8d8;border-radius:4px;font-size:0.875rem}.copyright{font-size:0.75rem;color:#8490a0;margin-top:44px}.skip{position:absolute;left:10px;top:-100px;background:white;z-index:20;padding:10px}.skip:focus{top:10px}@media(max-width:720px){.header-inner{padding:14px 20px}.brand{font-size:1.125rem}.brand span{display:none}nav{gap:16px;font-size:0.75rem}main{padding:0 20px}.intro{padding:36px 0 30px}h1{font-size:2.0625rem}h1 span{display:block;margin-left:0}.intro>p:not(.eyebrow){font-size:0.875rem}.desktop-break{display:none}.intro-meta{gap:8px 18px;font-size:0.8125rem}.project-index{gap:9px 17px;padding:18px 0}.project-index>span{width:100%}.project{padding:36px 0}.section-heading{gap:13px}h2{font-size:1.4375rem}.project-desc{font-size:0.875rem}.video-grid{grid-template-columns:1fr;gap:28px}.recipe-grid{gap:16px}.app-result{grid-template-columns:1fr;gap:18px}.app-result figure{max-width:100%}.steps{margin:0}.steps li{padding-bottom:14px;margin-bottom:10px}footer h2{font-size:1.4375rem}.contact-links{gap:10px;font-size:1.0rem;flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.video-wrap{position:relative}.play-cover{position:absolute;inset:0;border:0;padding:0;cursor:pointer;width:100%;height:100%;background:#101114;color:#fff}.play-cover[hidden]{display:none}.play-cover img{width:100%;height:100%;object-fit:contain;display:block}.play-cover span{position:absolute;bottom:14px;left:16px;padding:6px 12px;border-radius:4px;background:rgba(15,23,34,.86);font-size:.8125rem;font-family:inherit}.play-cover:hover span{background:#214d89}.play-cover:focus-visible{outline:3px solid #447ad4;outline-offset:-4px}