*{box-sizing:border-box}html{scroll-behavior:smooth}body{--bg:#f3f2eb;--paper:#fffefa;--ink:#1c2726;--muted:#626d69;--line:#d4d9d0;--accent:#e95b36;--accent-ink:#fff;--screen:#dce1d6;margin:0;background:var(--bg);color:var(--ink);font-family:Arial,"Microsoft YaHei",sans-serif;line-height:1.65}body[data-theme=b]{--bg:#111715;--paper:#1b2521;--ink:#f1f5e9;--muted:#a9b8ad;--line:#35453c;--accent:#d4f573;--accent-ink:#172218;--screen:#29382c}body[data-theme=c]{--bg:#eef4f5;--paper:#fff;--ink:#183c48;--muted:#5d7780;--line:#ccdade;--accent:#087e9b;--accent-ink:#fff;--screen:#dbe8e8}body[data-theme=d]{--accent:#e36538;--accent-ink:#fff}a{color:inherit;text-decoration:none}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.skip-link{position:fixed;left:16px;top:-100px;z-index:100;background:var(--ink);color:var(--bg);padding:12px}.skip-link:focus{top:14px}.page-header,footer{padding:24px 5vw;display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:12px;border-bottom:1px solid var(--line)}.wordmark{display:flex;gap:45px;font-weight:800;letter-spacing:.14em}.wordmark span{color:var(--accent)}main{max-width:1500px;padding:0 5vw;margin:auto}h1,h2,p,figure,dl,dd{margin:0}.eyebrow{font-size:10px;letter-spacing:.16em;color:var(--muted)}.project-heading{padding:70px 0 45px}.version{font-size:13px;margin-top:28px;color:var(--accent);font-weight:700}h1{font-size:clamp(58px,8vw,120px);font-weight:800;line-height:1.05;letter-spacing:-.075em;margin:12px 0 24px}.heading-bottom{display:flex;justify-content:space-between;align-items:center;gap:40px}.lead{max-width:600px;font-size:16px;color:var(--muted)}.primary-button{background:var(--accent);color:var(--accent-ink);padding:15px 22px;font-size:13px;display:flex;gap:28px;white-space:nowrap;font-weight:700}.primary-button:hover{filter:brightness(.94)}.tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:25px}.tags span{font-size:10px;padding:4px 11px;border:1px solid var(--line);border-radius:30px}.project-showcase{display:grid;grid-template-columns:1.1fr 1fr;gap:7vw;align-items:center;padding:0 0 90px}.screenshot-stage{padding:45px 35px 30px;background:var(--screen);position:relative;display:flex;justify-content:center;overflow:hidden}.screenshot-stage:before{content:'+';position:absolute;left:22px;bottom:18px;font:16px monospace;color:var(--muted)}.screen-label{position:absolute;left:22px;top:15px;font-size:9px;letter-spacing:.15em;color:var(--muted)}.screenshot-stage img{width:min(100%,300px);height:auto;display:block;border:5px solid #17201d;border-radius:22px;box-shadow:15px 20px 35px #0003}figcaption{font-size:10px;color:var(--muted);margin-top:10px}.showcase-copy h2,.interaction-study h2{font-size:clamp(32px,4.3vw,58px);line-height:1.3;letter-spacing:-.04em;margin:20px 0 25px}.showcase-copy h2 span{color:var(--accent)}.showcase-copy>p:not(.eyebrow),.interaction-study p:not(.eyebrow){font-size:14px;line-height:1.9;max-width:500px;color:var(--muted)}dl{margin-top:30px;border-top:1px solid var(--line)}dl>div{display:grid;grid-template-columns:85px 1fr;gap:18px;padding:15px 0;border-bottom:1px solid var(--line);font-size:12px}dt{color:var(--muted)}.project-links{display:flex;gap:24px;flex-wrap:wrap;font-size:11px;margin-top:25px}.project-links a{border-bottom:1px solid var(--line);padding-bottom:7px}.project-links a span{margin-left:20px;color:var(--accent)}.interaction-study{display:grid;grid-template-columns:1fr 1fr;gap:7vw;padding:70px 0 90px;border-top:1px solid var(--line);align-items:center}.scope-stage{display:flex;justify-content:center;background:var(--paper);padding:35px}.scope-stage img{display:block;width:min(100%,270px);height:auto;border-radius:14px}.text-link{display:inline-block;margin-top:30px;border-bottom:1px solid var(--ink);padding-bottom:8px;font-size:12px}.text-link span{margin-left:40px;color:var(--accent)}.next-line{border-top:1px solid var(--line);padding:35px 0 55px;display:flex;justify-content:space-between;gap:30px;align-items:center}.next-line>a{font-size:clamp(15px,2vw,24px);letter-spacing:-.025em}footer{border-top:1px solid var(--line);border-bottom:0;color:var(--muted)}noscript p{padding:25px}noscript a{text-decoration:underline}@media(max-width:760px){.project-heading{padding:45px 0 30px}h1{font-size:clamp(48px,11.5vw,80px)}.heading-bottom{align-items:flex-start;flex-direction:column;gap:22px}.lead{font-size:14px}.primary-button{min-height:48px}.project-showcase{grid-template-columns:1fr;gap:35px;padding-bottom:50px}.screenshot-stage{padding:42px 24px 25px}.screenshot-stage img{width:min(100%,280px)}.showcase-copy h2,.interaction-study h2{font-size:36px}.interaction-study{grid-template-columns:1fr;gap:30px;padding:40px 0 50px}.scope-stage{padding:28px}.next-line{display:block;padding:25px 0 40px}.next-line>a{display:block;margin-top:15px;font-size:18px}.page-header,footer{padding:20px 5vw;font-size:10px}.wordmark{gap:20px}dl>div{grid-template-columns:72px 1fr}.project-links{gap:18px}.scope-stage img{width:min(100%,260px)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:760px){
 .page-header a,footer a,.project-links a,.text-link{font-size:15px;min-height:48px;display:inline-flex;align-items:center}
 .page-header{gap:12px}.page-header>.wordmark{display:none}
 .primary-button{font-size:16px;min-height:52px}.project-links{gap:12px 20px}
 .page-header .language-switch,.language-switch{font-size:14px}.language-switch button{min-height:48px}
}