:root{--bg:#f5f6f8;--ink:#171b22;--muted:#656b76;--blue:#3862ed;--line:#dce0e7}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--blue);outline-offset:7px}::selection{background:#ced9ff}.header,main,footer{max-width:1320px;margin:auto;padding-left:64px;padding-right:64px}.header{height:104px;display:flex;align-items:center;justify-content:space-between}.logo{font-size:34px;font-weight:800;letter-spacing:-2px}.logo span{color:var(--blue)}nav{display:flex;gap:34px;align-items:center;font-size:14px;font-weight:500}nav a:hover{color:var(--blue)}.nav-contact{border:1px solid var(--line);padding:11px 18px;border-radius:6px}.nav-contact span{margin-left:18px}.hero{padding-top:48px}.hero-top{display:flex;justify-content:space-between;align-items:center}.eyebrow,.small-note,.section-label>span,.project-meta,.side-label{font:500 12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.4px}.eyebrow{color:var(--blue)}.small-note{color:var(--muted)}.hero-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:68px;align-items:center;padding:30px 0 68px}.hero h1{font-size:clamp(52px,5.8vw,78px);letter-spacing:-4px;margin:0 0 22px;line-height:1.12;font-weight:650}.blue{color:var(--blue)}.hero h2{font-size:clamp(26px,2.6vw,35px);font-weight:550;line-height:1.6;letter-spacing:-.9px;margin:0 0 23px}.underline{background:linear-gradient(transparent 84%,#d9e1fc 84%)}.hero-copy>p{color:var(--muted);font-size:16px;line-height:1.95;margin:0 0 30px}.button{display:inline-flex;align-items:center;gap:36px;background:var(--ink);color:white;padding:16px 22px;border-radius:5px;font-size:14px;transition:background .2s,transform .2s}.button:hover{background:var(--blue);transform:translateY(-2px)}.code-panel{background:#181d29;border:1px solid #2c3342;color:#e4e8f1;border-radius:10px;box-shadow:0 22px 50px #222e5117;transform:rotate(2deg)}.code-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #303646;padding:17px 22px;font:12px ui-monospace,monospace;color:#a0a8bb}.code-mark{color:#c8cede}.code-body{padding:25px 24px 27px;font:14px/1.9 ui-monospace,SFMono-Regular,Consolas,monospace}.code-body p{margin:0}.purple{color:#ac9cf1}.lime{color:#b6dba8}.muted{color:#a3adc1}.indent{padding-left:20px}.indent2{padding-left:40px}.code-comment{color:#8994ac;font-size:12px;margin-top:21px}.code-footer{display:flex;justify-content:space-between;border-top:1px solid #303646;padding:15px 22px;font-size:12px;color:#9da8be}.hero-bottom{padding:22px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.hero-bottom a span{margin-left:16px}.section{padding:92px 0;border-bottom:1px solid var(--line)}.about{display:grid;grid-template-columns:1fr 1.3fr;gap:90px}.section-label>span{color:var(--blue)}.section-label h2{font-size:34px;line-height:1.5;letter-spacing:-1px;margin-top:21px;font-weight:550}.about-copy p{color:var(--muted);font-size:16px;line-height:1.95;margin:0 0 18px}.about-copy .lead{color:var(--ink);font-size:23px;line-height:1.7;font-weight:500;margin-bottom:24px}.about-copy p:last-child{margin-bottom:0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:38px}.section-heading h2{font-size:34px;letter-spacing:-1px;margin:12px 0 0;font-weight:550}.section-heading>p{font-size:14px;color:var(--muted);margin-bottom:4px}.skill-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:7px;background:#fafbfc;overflow:hidden}.skill-grid article{padding:26px 24px;border-right:1px solid var(--line)}.skill-grid article:last-child{border:0}.skill-symbol{display:flex;align-items:center;justify-content:center;font-size:23px;color:var(--blue);width:40px;height:40px;background:#e9edfc;border:1px solid #dfe5fa;border-radius:7px;margin-bottom:28px}.skill-grid h3{font-size:19px;font-weight:550;margin:0 0 14px}.skill-grid p{font-size:16px;line-height:1.8;color:var(--muted);margin:0}.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.tags span{font-size:12px;color:#646b7a}.tags span+span:before{content:'·';margin-right:8px}.project{display:grid;grid-template-columns:55px 1fr 145px;gap:24px;padding:38px 30px;border:1px solid var(--line);border-radius:7px;margin-top:18px;background:#fafbfc}.project.featured{border-color:#bdcaf5;background:#f0f3fc}.project-index{font:14px ui-monospace,monospace;color:#8c94a4;padding-top:3px}.project-meta{display:flex;align-items:center;gap:20px;color:var(--muted);letter-spacing:1px}.status{font-family:inherit;font-size:12px;letter-spacing:0;padding:3px 8px;border:1px solid #d5dce9;border-radius:4px;white-space:nowrap}.project h3{font-size:32px;font-weight:550;letter-spacing:-1px;margin:15px 0 10px}.project h4{font-size:18px;font-weight:500;margin:0 0 15px}.project p{font-size:16px;line-height:1.9;color:var(--muted);max-width:650px;margin:0}.project-tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:22px}.project-tags span{font:12px ui-monospace,monospace;padding:7px 10px;background:#e6eaf2;border-radius:4px;color:#565f72}.project-side{border-left:1px solid var(--line);padding-left:28px;display:flex;flex-direction:column;gap:17px;align-self:center;font-size:14px;color:#555f72}.project-side .side-label{color:#8790a1;font-size:12px;letter-spacing:0;margin-bottom:4px}.contact{padding:94px 0 82px;display:grid;grid-template-columns:1.2fr 1fr;gap:55px;align-items:center}.contact h2{font-size:49px;line-height:1.4;letter-spacing:-2px;font-weight:550;margin:20px 0 0}.contact-copy p{font-size:16px;line-height:1.9;color:var(--muted);margin:0 0 25px}.contact-pending{font-size:14px;padding:12px 0;border-bottom:1px solid var(--line);color:#555f72}.contact-note{display:block;font:12px ui-monospace,monospace;color:#828a99;margin-top:14px}footer{display:flex;align-items:center;gap:34px;border-top:1px solid var(--line);padding-top:26px;padding-bottom:26px;font-size:12px;color:var(--muted)}footer .logo{font-size:26px;color:var(--ink)}footer a:last-child{margin-left:auto}.skip{position:fixed;top:-100px;left:15px;background:white;padding:12px;z-index:10}.skip:focus{top:15px}@media(min-width:1450px){.hero{padding-top:65px}.hero-layout{padding-bottom:85px}.hero h1{font-size:84px}}@media(max-width:1000px){.header,main,footer{padding-left:32px;padding-right:32px}.hero-layout{gap:30px;grid-template-columns:1.1fr 1fr}.hero h1{font-size:59px}.hero h2{font-size:27px}.code-body{font-size:12px;padding:22px 18px}.code-comment{font-size:12px;letter-spacing:-.5px}.skill-grid{grid-template-columns:repeat(2,1fr)}.skill-grid article:nth-child(2){border-right:0}.skill-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}.about{gap:45px}.project{grid-template-columns:30px 1fr 120px;gap:15px;padding:30px 24px}.project-side{padding-left:20px}.project-meta{flex-wrap:wrap;gap:9px}.contact h2{font-size:43px}}@media(max-width:700px){.header,main,footer{padding-left:22px;padding-right:22px}.header{height:82px}.logo{font-size:30px}nav{gap:19px;font-size:14px}nav a:nth-child(2){display:none}.nav-contact{padding:0;border:0}.nav-contact span{margin-left:2px}.hero{padding-top:30px}.small-note{font-size:10px;letter-spacing:1px}.hero-layout{grid-template-columns:1fr;gap:40px;padding:25px 0 40px}.hero h1{font-size:63px;letter-spacing:-3px}.hero h2{font-size:28px}.hero-copy>p{font-size:16px}.code-panel{transform:none;max-width:500px;width:100%}.code-body{font-size:14px;padding:24px}.code-comment{letter-spacing:0}.hero-bottom{font-size:12px;gap:12px}.section{padding:62px 0}.about{grid-template-columns:1fr;gap:12px}.section-label h2{font-size:30px;margin-bottom:18px}.about-copy .lead{font-size:22px}.section-heading{display:block;margin-bottom:26px}.section-heading h2{font-size:30px}.section-heading>p{margin-top:15px;line-height:1.7}.skill-grid article{padding:22px 17px}.skill-grid h3{font-size:18px}.skill-grid p{font-size:16px}.skill-symbol{margin-bottom:23px}.tags{gap:5px}.tags span{font-size:12px}.project{grid-template-columns:1fr;padding:26px 22px;gap:12px}.project-index{font-size:12px}.project-side{display:none}.project h3{font-size:29px}.project h4{line-height:1.7}.project-meta{font-size:10px;letter-spacing:.7px;justify-content:space-between}.project-tags{gap:6px}.project-tags span{font-size:12px;padding:6px 8px}.contact{grid-template-columns:1fr;gap:30px;padding:65px 0}.contact h2{font-size:42px}.contact-copy p br{display:none}footer{gap:20px;flex-wrap:wrap}footer>span:nth-of-type(2){display:none}}@media(max-width:360px){.hero h1{font-size:53px}.hero h2{font-size:25px}.skill-grid{grid-template-columns:1fr}.skill-grid article{border-right:0;border-bottom:1px solid var(--line)}.small-note{display:none}.code-body{font-size:12px}.code-comment{font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Domain identity and readable small-screen typography */
.logo small{display:inline-block;font-size:14px;letter-spacing:.02em;font-weight:500;margin-left:10px;color:var(--muted);vertical-align:middle}.eyebrow,.small-note,.section-label>span,.project-meta,.side-label,.status,.tags span,.project-tags span,.hero-bottom,.contact-note{font-size:14px}.code-body{overflow-wrap:anywhere}@media(max-width:700px){.logo small{font-size:12px;margin-left:6px}.header{gap:15px}nav{gap:14px}.small-note{font-size:12px}.project-meta{font-size:12px}.hero h1{font-size:clamp(42px,12vw,63px)}.code-comment{font-size:12px}}@media(max-width:360px){.logo small{display:none}.code-comment{font-size:12px}}