:root{--ink:#eef7ef;--muted:#8ea098;--line:rgba(139,255,178,.2);--paper:#050806;--panel:#090f0b;--panel-2:#0d1510;--accent:#58ff93;--shadow:0 28px 80px rgba(0,0,0,.38)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:linear-gradient(rgba(88,255,147,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(88,255,147,.035) 1px,transparent 1px),radial-gradient(circle at 80% 10%,rgba(88,255,147,.12),transparent 28%),radial-gradient(circle at 12% 78%,rgba(88,255,147,.08),transparent 24%),var(--paper);background-size:42px 42px,42px 42px,auto,auto,auto;font-family:"Microsoft YaHei","PingFang SC","Noto Sans CJK SC",Arial,sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}.site-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px clamp(20px,5vw,72px);background:rgba(5,8,6,.86);border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}.brand{font-weight:800;color:var(--accent)}.nav{display:flex;gap:clamp(12px,3vw,30px);color:var(--muted);font-size:14px}.nav a:hover{color:var(--accent)}.section{width:min(1120px,calc(100% - 40px));margin:0 auto;padding:72px 0}.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:clamp(28px,6vw,72px);align-items:center;min-height:calc(100vh - 70px);position:relative}.hero:before{position:absolute;inset:9% auto auto -4%;width:360px;height:360px;content:"";background:linear-gradient(90deg,rgba(88,255,147,.16) 1px,transparent 1px),linear-gradient(rgba(88,255,147,.16) 1px,transparent 1px);background-size:18px 18px;mask-image:radial-gradient(circle,#000,transparent 68%);pointer-events:none}.eyebrow{margin:0 0 12px;color:var(--accent);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{margin-bottom:18px;font-size:clamp(56px,10vw,116px);line-height:.95;text-shadow:0 0 34px rgba(88,255,147,.16)}h2{margin-bottom:22px;font-size:clamp(30px,5vw,52px);line-height:1.12}h3{margin-bottom:10px;font-size:21px;line-height:1.25}.intro{max-width:720px;color:#c5d6cd;font-size:clamp(18px,2.4vw,24px)}.hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:690px;margin-top:30px}.hero-stats div{min-height:96px;padding:16px;background:rgba(9,15,11,.76);border:1px solid var(--line);border-radius:8px}.hero-stats strong,.hero-stats span{display:block}.hero-stats strong{font-size:clamp(28px,4vw,42px);line-height:1}.hero-stats span{margin-top:10px;color:var(--muted);font-size:14px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}.button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:11px 18px;border:1px solid var(--accent);border-radius:6px;font-weight:700}.button.primary{color:#021006;background:var(--accent)}.button.ghost{color:var(--accent)}.showreel-panel,.feature-card,.job,.contact-card{background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.showreel-panel{padding:16px}.panel-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.panel-label:after{width:64px;height:1px;content:"";background:var(--accent)}.showreel-frame{position:relative;display:grid;min-height:320px;place-items:end start;margin-bottom:18px;overflow:hidden;padding:22px;background:linear-gradient(145deg,rgba(5,8,6,.12),rgba(5,8,6,.88)),linear-gradient(90deg,rgba(88,255,147,.15) 1px,transparent 1px),linear-gradient(rgba(88,255,147,.15) 1px,transparent 1px),radial-gradient(circle at 72% 32%,rgba(88,255,147,.28),transparent 24%),#0d1510;background-size:auto,26px 26px,26px 26px,auto,auto;border-radius:6px;font-size:22px;font-weight:900}.showreel-frame:after{position:absolute;top:14px;right:14px;padding:5px 8px;content:"9:16 / 16:9";color:rgba(255,255,255,.78);border:1px solid var(--line);border-radius:999px;font-size:12px}.play-mark{position:absolute;top:50%;left:50%;width:74px;height:74px;background:var(--accent);border-radius:50%;transform:translate(-50%,-50%)}.play-mark:after{position:absolute;top:23px;left:29px;width:0;height:0;content:"";border-top:14px solid transparent;border-bottom:14px solid transparent;border-left:22px solid #021006}.reel-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}.reel-strip span{display:grid;min-height:54px;place-items:center;color:var(--accent);border:1px solid var(--line);border-radius:6px;font-size:13px;font-weight:900}.facts{display:grid;gap:10px;margin:0}.facts div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}.facts div:last-child{border-bottom:0}dt{color:var(--muted)}dd{margin:0;font-weight:800}.split-section,.education{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(28px,5vw,56px)}.strength-grid,.company-showcases,.timeline{display:grid;gap:16px}.strength-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.feature-card{padding:24px;box-shadow:none;background:transparent}.feature-card p,.job li,.education-list,.contact-card,.company-copy p,.video-card figcaption,.image-card figcaption{color:var(--muted)}.section-heading{max-width:720px;margin-bottom:28px}.job{display:grid;grid-template-columns:280px 1fr;gap:28px;padding:28px;background:rgba(9,15,11,.62)}.job-meta{display:grid;align-content:start;gap:8px}.job-meta span{color:var(--accent);font-weight:800}.job ul{margin:0;padding-left:20px}.job li+li{margin-top:8px}.company-showcases{gap:22px}.company-case{position:relative;display:grid;grid-template-columns:.58fr 1.42fr;gap:24px;padding:24px;background:rgba(9,15,11,.72);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.company-case-featured{border-color:rgba(88,255,147,.34)}.company-copy{position:relative;display:grid;align-content:start;gap:14px}.company-copy h3{margin:0;font-size:clamp(24px,3vw,38px)}.view-more{display:inline-flex;width:max-content;min-height:34px;align-items:center;justify-content:center;padding:6px 12px;color:#021006;background:var(--accent);border-radius:999px;font-size:12px;font-weight:900}.view-more:after{margin-left:6px;content:"↗"}.case-index{color:rgba(88,255,147,.34);font-size:clamp(58px,8vw,108px);font-weight:900;line-height:.85}.case-tag{width:fit-content;padding:6px 10px;color:var(--accent);background:rgba(88,255,147,.08);border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:900}.video-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.video-card,.image-card{margin:0}.video-frame{position:relative;aspect-ratio:9/16;overflow:hidden;background:var(--panel-2);border:1px solid var(--line);border-radius:8px;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.video-card:hover .video-frame,.video-card:focus-visible .video-frame{border-color:rgba(88,255,147,.72);box-shadow:0 0 0 1px rgba(88,255,147,.22),0 24px 70px rgba(88,255,147,.08);transform:translateY(-3px)}.video-frame video,.video-placeholder{position:absolute;inset:0;width:100%;height:100%}.video-frame video{object-fit:cover;opacity:0}.video-card.has-video:hover video,.video-card.has-video:focus-visible video{opacity:1}.video-card.has-video:hover .video-placeholder,.video-card.has-video:focus-visible .video-placeholder{opacity:0}.video-placeholder{display:grid;align-content:space-between;padding:16px}.video-placeholder:after{position:absolute;inset:auto 14px 14px auto;width:42px;height:42px;content:"";background:linear-gradient(90deg,transparent 0 15px,var(--accent) 15px 27px,transparent 27px),linear-gradient(transparent 0 15px,var(--accent) 15px 27px,transparent 27px);border:1px solid rgba(88,255,147,.5);border-radius:50%}.video-placeholder span{color:rgba(238,247,239,.5);font-size:42px;font-weight:900;line-height:1}.video-placeholder strong{display:block;margin-top:auto;font-size:clamp(24px,3vw,36px);line-height:1.05}.video-placeholder em{display:block;margin-top:10px;color:var(--muted);font-size:13px;font-style:normal}.video-frame.cardbox,.video-frame.box,.video-frame.aigc,.video-frame.ip,.video-frame.rpg,.video-frame.brandvideo,.video-frame.candy,.video-frame.legend,.video-frame.casual{background:linear-gradient(145deg,rgba(88,255,147,.08),rgba(5,8,6,.9)),repeating-linear-gradient(90deg,rgba(88,255,147,.15) 0 1px,transparent 1px 30px),#0d1510}.works-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:clamp(28px,5vw,64px);align-items:end;padding-top:96px}.works-hero h1{max-width:6em}.archive-meta{display:grid;grid-template-columns:80px 1fr;gap:14px 18px;padding:24px;background:rgba(9,15,11,.72);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.archive-meta span{color:var(--muted)}.project-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-top:24px}.project-summary article{min-height:260px;padding:22px;background:rgba(9,15,11,.72);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.project-summary span{display:block;margin-bottom:36px;color:rgba(88,255,147,.42);font-size:54px;font-weight:900;line-height:1}.project-summary h2{margin-bottom:14px;font-size:clamp(24px,3vw,34px)}.works-section{padding-top:46px}.works-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:24px;border-bottom:1px solid var(--line);padding-bottom:18px}.works-heading h2{margin-bottom:0}.works-heading p{max-width:440px;margin:0;color:var(--muted)}.media-grid{display:grid;gap:16px}.video-archive,.image-archive{grid-template-columns:repeat(4,minmax(0,1fr));align-items:start}.image-placeholder{position:relative;display:grid;align-content:space-between;overflow:hidden;padding:16px;background:linear-gradient(145deg,rgba(88,255,147,.1),rgba(5,8,6,.92)),linear-gradient(90deg,rgba(88,255,147,.12) 1px,transparent 1px),linear-gradient(rgba(88,255,147,.12) 1px,transparent 1px),#0d1510;background-size:auto,24px 24px,24px 24px,auto;border:1px solid var(--line);border-radius:8px}.image-square .image-placeholder{aspect-ratio:1/1}.image-portrait .image-placeholder{aspect-ratio:9/16}.image-placeholder span{width:fit-content;padding:5px 9px;color:var(--accent);background:rgba(88,255,147,.08);border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:900}.image-placeholder strong{font-size:clamp(22px,3vw,34px);line-height:1.08}.education{border-top:1px solid var(--line)}.education-list{display:grid;gap:10px;align-content:start;font-size:18px}.education-list p{margin:0}.contact-section{display:grid;grid-template-columns:1fr .8fr;gap:clamp(24px,5vw,60px);align-items:start;padding-bottom:96px}.contact-card{display:grid;gap:14px;padding:26px;font-size:18px}.contact-card a{color:var(--accent);font-weight:900;overflow-wrap:anywhere}@media (max-width:860px){.site-header{align-items:flex-start;flex-direction:column;gap:10px}.nav{width:100%;justify-content:space-between}.hero,.split-section,.education,.contact-section,.works-hero{grid-template-columns:1fr}.hero{min-height:auto;padding-top:48px}.strength-grid,.company-case{grid-template-columns:1fr}.video-strip{grid-template-columns:repeat(3,minmax(140px,1fr));overflow-x:auto;padding-bottom:6px}.video-archive,.image-archive,.project-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.works-heading{align-items:start;flex-direction:column}.job{grid-template-columns:1fr;gap:16px;padding:22px}}@media (max-width:520px){.section{width:min(100% - 28px,1120px);padding:52px 0}.nav{font-size:13px}.hero-actions{flex-direction:column}.button{width:100%}.hero-stats{grid-template-columns:1fr}.video-strip,.video-archive,.image-archive,.project-summary{grid-template-columns:1fr;overflow-x:visible}.showreel-frame{min-height:220px}}