/* Independent editorial / bento layout. No third-party code or template assets. */
:root{
  /* 升级色彩系统 - 绿色系 */
  --green-950:#0a1f1c;
  --green-900:#183f39;
  --green-700:#24594d;
  --green-500:#3d7a6d;
  --green-300:#7ab89f;
  --green-100:#c4e0d5;
  --green-50:#e0f0e9;

  /* 原有色彩 */
  --paper:#f8f8f6;
  --ink:#1b1b1d;
  --muted:#636367;
  --line:#dedee0;
  --accent:var(--green-700);
  --soft:#eceef9;

  /* 字体系统 */
  --font-display:-apple-system,"SF Pro Display","PingFang SC","Microsoft YaHei",sans-serif;
  --font-body:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono:"JetBrains Mono",Monaco,Consolas,monospace;
}
html{scroll-padding-top:100px}body{background:var(--paper);color:var(--ink);font-family:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}body:before{display:none}header,main,footer{max-width:1200px;margin-left:auto;margin-right:auto}a{color:inherit}a:focus-visible{outline:3px solid var(--accent);outline-offset:5px;border-radius:4px}.header{min-height:96px;border-bottom:1px solid var(--line);gap:32px;background:var(--paper)}.brand{font-size:18px;gap:12px}.brand small{color:#76767a;font-size:11px;letter-spacing:2px;margin-left:8px}.monogram{border-radius:0;background:none;color:var(--ink);font-size:26px;font-weight:900;letter-spacing:-3px;width:44px;height:42px}.header nav{gap:29px;font-size:14px}.header nav a{padding:8px 0;text-decoration:none}.header nav a:hover{color:var(--accent)}.header nav a[aria-current=page]{color:var(--accent);border-bottom:2px solid var(--accent)}.skip{background:var(--ink);color:#fff}.kicker{font-size:11px;letter-spacing:1.6px;font-weight:650;color:var(--muted);line-height:1.6;margin:0 0 18px}.status-dot{display:inline-block;width:7px;height:7px;background:var(--accent);border-radius:50%;margin-right:8px}.intro-layout{display:grid;grid-template-columns:1.8fr 1fr;gap:55px;padding:72px 0 48px;align-items:center}.intro-copy h1{font-size:clamp(35px,3.5vw,51px);line-height:1.42;letter-spacing:-2.3px;margin:23px 0 24px;font-weight:750}.serif{display:block;font-family:"Songti SC","SimSun",serif;font-weight:400;font-size:1.1em;letter-spacing:-1px}.intro-text{font-size:16px;line-height:1.95;color:var(--muted);max-width:560px;margin:0}.hero-actions{display:flex;align-items:center;gap:28px;margin:30px 0 35px}.primary-link{display:inline-flex;gap:30px;align-items:center;padding:13px 21px;background:var(--ink);color:white;text-decoration:none;font-size:14px;border-radius:5px}.primary-link:hover{background:var(--accent)}.quiet-link,.text-link{font-size:14px;font-weight:600;text-decoration:none}.quiet-link:hover,.text-link:hover{color:var(--accent)}.intro-meta{display:flex;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:11px;padding-top:20px;border-top:1px solid var(--line);max-width:580px}.identity-art{position:relative;align-self:stretch;min-height:430px;overflow:hidden;border-radius:14px;background:#e9ebf9;padding:28px;color:#272c63;border:1px solid #dce0f4;display:flex;flex-direction:column}.art-top,.art-bottom{font-size:9px;letter-spacing:2px;font-weight:650;position:relative;z-index:1}.art-orbits{position:relative;height:222px;display:grid;place-items:center;margin:6px 0}.art-orbits i{position:absolute;width:200px;height:125px;border:1px solid #929ddf;border-radius:50%;transform:rotate(-33deg)}.art-orbits i:nth-child(2){transform:rotate(33deg)}.art-orbits i:nth-child(3){transform:rotate(90deg)}.art-orbits b{font-family:Georgia,serif;font-size:76px;font-style:italic;letter-spacing:-10px;color:#384cf0;padding-right:12px}.art-labels{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;gap:5px}.identity-art p{font-family:"Songti SC","SimSun",serif;font-size:20px;line-height:1.7;margin:22px 0}.art-bottom{margin-top:auto;padding-top:12px;border-top:1px solid #ccd1ef}.path-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:28px}.path-grid>a{padding:24px;text-decoration:none;background:#fff;transition:background .18s}.path-grid>a+a{border-left:1px solid var(--line)}.path-grid>a:hover{background:var(--soft)}.path-number{font-size:10px;letter-spacing:1.5px;color:var(--muted)}.path-grid h2{font-size:16px;margin:14px 0 8px;display:flex;justify-content:space-between;gap:10px}.path-grid h2 span{color:var(--accent)}.path-grid p{font-size:12px;color:var(--muted);margin:0;line-height:1.7}.home-section{padding:48px 0 20px}.editorial-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:27px}.editorial-heading .kicker{margin-bottom:10px}.editorial-heading h2{font-size:30px;letter-spacing:-1px;line-height:1.4;margin:0}.editorial-heading>.text-link{font-size:12px;white-space:nowrap;margin-bottom:4px}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.work-card{min-width:0;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}.work-visual{height:216px;display:block;position:relative;background:#e5e7ed;padding:25px 0 0 25px;overflow:hidden}.work-card:nth-child(2) .work-visual{background:#e3e6df}.work-card:nth-child(3) .work-visual{background:#e9e4dd;padding:15px;display:grid;place-items:center}.work-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:top left;border-radius:5px 0 0 0;box-shadow:0 8px 25px #0000000c;transition:transform .25s}.work-card:nth-child(3) img{height:auto;object-fit:contain;border-radius:4px}.work-visual:hover img{transform:translateY(-4px)}.visual-index{position:absolute;top:10px;left:10px;background:#ffffffed;padding:3px 7px;font-size:9px;border-radius:3px}.work-body{padding:23px}.work-body .kicker{font-size:9px;letter-spacing:.8px;margin-bottom:11px}.work-body h3{font-size:21px;letter-spacing:-.5px;margin:0 0 12px;line-height:1.5}.work-body h3 a{display:flex;justify-content:space-between;text-decoration:none;gap:10px}.work-body h3 a span{font-size:19px;font-weight:400;color:var(--muted)}.work-body>p:not(.kicker){font-size:13px;line-height:1.85;color:var(--muted);margin:0 0 20px}.chips{display:flex;flex-wrap:wrap;gap:7px}.chips span{font-size:10px;color:#55555b;border:1px solid #e2e2e6;border-radius:4px;line-height:1.4;padding:5px 7px;background:transparent}.section-note{font-size:11px;line-height:1.85;color:var(--muted);margin-top:18px}.creation-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.essay-tile{background:#ededeb;padding:34px;border-radius:12px;min-height:320px;text-decoration:none;display:block;position:relative;overflow:hidden;border:1px solid #e3e3df}.essay-tile h3{font-family:"Songti SC","SimSun",serif;font-size:31px;line-height:1.6;font-weight:400;margin:18px 0}.essay-tile>p:not(.kicker){font-size:13px;line-height:1.85;color:var(--muted)}.tile-link{display:block;font-size:12px;margin-top:30px}.fiction-tile{background:#252631;color:#fff;border-color:#252631}.fiction-tile .kicker,.fiction-tile>p:not(.kicker){color:#c1c2d0}.essay-tile:hover .tile-link{text-decoration:underline}.closing-strip{padding:55px 0 60px;border-top:1px solid var(--line);margin-top:45px;max-width:none}.closing-strip h2{font-size:30px;letter-spacing:-.8px;margin:0 0 16px;line-height:1.5}.closing-strip p:not(.kicker){max-width:740px;font-size:15px;line-height:1.9;color:var(--muted);margin:0 0 22px}footer{border-top:1px solid var(--line);font-size:11px;color:var(--muted);padding:25px 0 35px;gap:20px}footer a{text-underline-offset:3px}.page-intro{padding:68px 0 40px;max-width:840px}.page-intro h1{font-size:46px;line-height:1.45;letter-spacing:-2px;margin:18px 0 23px}.page-intro>p:last-child{font-size:16px;line-height:1.95;color:var(--muted);max-width:700px}.index-nav{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 40px}.index-nav a{padding:9px 15px;border:1px solid var(--line);border-radius:5px;font-size:12px;text-decoration:none;background:#fff}.index-nav a:hover{border-color:var(--accent)}.archive-entry{display:grid;grid-template-columns:230px 1fr;gap:50px;border-top:1px solid var(--line);padding:42px 0;scroll-margin-top:24px}.archive-aside{display:flex;align-items:flex-start;flex-direction:column;gap:16px}.archive-number{font-family:Georgia,serif;font-size:48px;line-height:1.1;color:#b8b8c0}.state{display:inline-block;font-size:11px;padding:5px 9px;color:#394260;background:#e9ecf4;border:1px solid #dde1ec;border-radius:4px}.state-plan{color:#695c43;background:#f0ece4;border-color:#e8dfcc}.archive-aside p{font-size:11px;color:var(--muted);margin:0}.archive-body h2{font-size:29px;letter-spacing:-.5px;margin:0 0 5px}.archive-body .kicker{margin-bottom:10px}.archive-subtitle{font-size:16px;color:var(--muted);margin:0 0 20px}.archive-body>p:not(.kicker):not(.archive-subtitle){font-size:14px;line-height:1.95;max-width:770px}.archive-body dl{font-size:13px;line-height:1.9;background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px 24px;margin:20px 0}.archive-body dl div{display:grid;grid-template-columns:65px 1fr;gap:18px}.archive-body dl div+div{margin-top:12px}.archive-body dt{font-weight:650}.archive-body dd{margin:0;color:var(--muted)}.archive-body>.text-link{display:inline-block;margin-top:23px}.story-section{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;padding:48px 0;border-top:1px solid var(--line)}.story-section h2{font-size:32px;line-height:1.5;letter-spacing:-1px;margin:0 0 23px}.story-section p:not(.kicker):not(.section-note){font-size:14px;line-height:2;color:var(--muted)}.story-section .text-link{display:inline-block;margin-top:18px}.pull-quote{border-left:2px solid var(--accent);padding:4px 0 4px 22px;font-family:"Songti SC","SimSun",serif;font-size:23px;line-height:1.8;margin-top:30px}.note-stack{display:grid;gap:18px}.content-note{border:1px solid var(--line);background:#fff;border-radius:10px;padding:27px}.content-note h3{font-size:20px;line-height:1.6;margin:16px 0 12px}.content-note p:not(.kicker){font-size:13px;line-height:1.9;color:var(--muted)}.mini-label{font-size:10px;color:#545969;border-top:1px solid var(--line);padding-top:14px;margin-top:15px}.public-note{border:1px solid var(--line);border-radius:8px;padding:21px 25px;margin:0 0 45px;font-size:12px;line-height:1.9}.public-note p{margin:6px 0 0;color:var(--muted)}.fiction-process{padding:30px;background:#efefec;border-radius:10px}.fiction-process ol{list-style:none;counter-reset:flow;margin:0;padding:0}.fiction-process li{counter-increment:flow;padding:15px 0;border-bottom:1px solid #dcdcda;position:relative;padding-left:40px}.fiction-process li:before{content:'0'counter(flow);position:absolute;left:0;top:18px;font-size:11px;color:var(--muted)}.fiction-process b{display:block;font-size:16px;margin-bottom:7px}.fiction-process li span{font-size:12px;color:var(--muted)}.about-banner{display:flex;justify-content:space-between;gap:20px;background:#262733;color:#f7f7fc;padding:34px 38px;border-radius:10px;font-family:"Songti SC","SimSun",serif;font-size:22px;line-height:1.7}.preference-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.preference-grid article{padding:26px 0;border-top:1px solid var(--line)}.preference-grid h3{font-size:21px;line-height:1.6;margin:14px 0 12px}.preference-grid p{font-size:14px;line-height:1.9;color:var(--muted);max-width:480px}.plain-list{padding-left:20px;margin:0}.plain-list li{font-size:13px;line-height:1.9;color:var(--muted);margin-bottom:12px}.now-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.now-grid h2{font-size:22px;line-height:1.6}.update-row{display:grid;grid-template-columns:180px 1fr;gap:30px;padding:25px 0;border-top:1px solid var(--line)}.update-row time{font-size:12px;color:var(--muted)}.update-row h3{font-size:20px;line-height:1.5;margin:0 0 15px}.update-row p{font-size:14px;line-height:1.9;color:var(--muted)}.detail-top{padding-top:35px}.detail-top h1{color:var(--ink)}.detail-top .lead{max-width:860px}.detail-section{border-color:var(--line);grid-template-columns:210px 1fr}.section-label{color:var(--muted)}.detail-section h2{color:var(--ink)}.detail-metrics{background:#eeeff4;color:var(--ink);border:1px solid var(--line)}.detail-metrics strong{color:var(--ink)}.detail-metrics span{color:var(--muted)}.eyebrow{color:var(--muted)}.tags span{background:#eeeeef;color:#45454a;border:1px solid #dedee0}.steps>div,.step{background:#fff;border-color:var(--line)}.award-banner{background:#e9ebf9;color:#272c63}.next a,.back{color:var(--ink)}.callout{background:#efeff4;border-color:#d5d6df;color:var(--ink)}
@media(max-width:1280px){header,main,footer{margin-left:40px;margin-right:40px}.intro-layout{gap:35px}.work-body{padding:20px}.work-body h3{font-size:19px}.work-visual{height:195px}}
@media(max-width:960px){.intro-layout{grid-template-columns:1.5fr 1fr;gap:26px}.intro-copy h1{font-size:37px;letter-spacing:-1.5px}.identity-art{padding:23px;min-height:420px}.art-orbits i{width:165px;height:105px}.art-labels{font-size:7px;letter-spacing:0}.path-grid>a{padding:19px}.path-grid h2{font-size:14px}.work-grid{gap:14px}.work-body{padding:17px}.work-body h3{font-size:17px}.work-visual{height:165px;padding:18px 0 0 18px}.archive-entry{grid-template-columns:170px 1fr;gap:30px}.story-section{gap:35px}.about-banner{font-size:18px;padding:25px}.detail-section{grid-template-columns:170px 1fr}}
@media(max-width:760px){header,main,footer{margin-left:22px;margin-right:22px}.header{gap:12px;min-height:105px;padding:18px 0 14px;align-items:center}.brand{font-size:17px}.brand small{display:inline;font-size:9px;letter-spacing:1px}.header nav{width:100%;justify-content:space-between;gap:12px;font-size:13px}.header nav a{padding:5px 0}.intro-layout{grid-template-columns:1fr;padding:40px 0 25px;gap:30px}.intro-copy h1{font-size:36px;letter-spacing:-1.8px;margin-top:18px}.intro-text{font-size:14px}.hero-actions{margin:25px 0}.intro-meta{gap:8px 18px;font-size:10px}.identity-art{min-height:300px;padding:23px}.art-orbits{position:absolute;right:12px;top:12px;width:145px;height:240px;margin:0;opacity:.65}.art-orbits i{width:150px;height:95px}.art-orbits b{font-size:59px;letter-spacing:-8px}.art-top{font-size:8px}.art-labels{margin-top:30px;flex-direction:column;gap:10px;font-size:8px;letter-spacing:1px}.identity-art p{font-size:19px;margin:25px 0;position:relative;z-index:1}.art-bottom{font-size:8px}.path-grid{grid-template-columns:1fr;margin-bottom:5px}.path-grid>a{padding:20px}.path-grid>a+a{border-left:0;border-top:1px solid var(--line)}.path-grid h2{font-size:17px;margin-top:10px}.path-grid p{font-size:12px}.home-section{padding:32px 0 14px}.editorial-heading{align-items:flex-start;flex-direction:column;gap:15px;margin-bottom:22px}.editorial-heading h2{font-size:27px}.work-grid{grid-template-columns:1fr;gap:23px}.work-visual{height:240px;padding:22px 0 0 22px}.work-card:nth-child(3) .work-visual{height:220px;padding:18px}.work-body{padding:23px}.work-body h3{font-size:23px}.work-body>p:not(.kicker){font-size:14px}.work-body .kicker{font-size:10px}.creation-grid{grid-template-columns:1fr;gap:20px}.essay-tile{padding:28px;min-height:300px}.essay-tile h3{font-size:29px}.closing-strip{padding:38px 0;margin-top:30px}.closing-strip h2{font-size:27px}.closing-strip p:not(.kicker){font-size:14px}footer{padding:22px 0;display:block;font-size:10px}footer span{display:block;margin-bottom:9px}.page-intro{padding:40px 0 24px}.page-intro h1{font-size:33px;letter-spacing:-1.3px}.page-intro>p:last-child{font-size:14px}.index-nav{gap:8px;margin-bottom:25px}.index-nav a{padding:8px 11px;font-size:11px}.archive-entry{grid-template-columns:1fr;gap:20px;padding:28px 0}.archive-aside{flex-direction:row;align-items:center;gap:12px;flex-wrap:wrap}.archive-number{font-size:25px}.archive-aside p{font-size:10px}.archive-body h2{font-size:25px}.archive-subtitle{font-size:14px}.archive-body dl{padding:18px;font-size:12px}.archive-body dl div{grid-template-columns:1fr;gap:4px}.archive-body dl div+div{margin-top:17px}.story-section{grid-template-columns:1fr;gap:26px;padding:30px 0}.story-section h2{font-size:28px}.content-note{padding:23px}.about-banner{display:block;padding:24px;font-size:18px}.about-banner span{display:block;margin-bottom:6px}.preference-grid{grid-template-columns:1fr;gap:3px}.preference-grid h3{font-size:20px}.preference-grid p{font-size:14px}.now-grid{grid-template-columns:1fr;gap:18px}.update-row{grid-template-columns:1fr;gap:15px}.update-row h3{font-size:19px}.detail-section{grid-template-columns:1fr;gap:12px}.detail-top h1{font-size:30px}.detail-top .lead{font-size:17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.work-visual img,.path-grid>a{transition:none}.work-visual:hover img{transform:none}}
@media print{body{background:#fff}header,main,footer{margin:0;max-width:none}.header nav,.identity-art,.hero-actions,.path-grid{display:none}.intro-layout{display:block;padding:20px 0}.intro-copy h1{font-size:30px}.home-section{padding:20px 0}.work-grid,.creation-grid{display:block}.work-card{break-inside:avoid;margin-bottom:20px}.work-visual{height:200px}.story-section,.archive-entry{display:block}.archive-aside{margin-bottom:20px}.essay-tile{break-inside:avoid;margin-bottom:20px}.fiction-tile{background:#eee;color:#222}.fiction-tile .kicker,.fiction-tile>p:not(.kicker){color:#555}.closing-strip{padding:20px 0}.page-intro{padding:20px 0}}

:root{--green:#384cf0}a:hover{color:var(--accent)}.primary-link:hover,.fiction-tile:hover{color:#fff}.identity-art p{color:#272c63}.art-orbits{pointer-events:none}.intro-copy,.archive-body,.story-section>div{min-width:0}

/* Signature motion, interaction feedback, and the ToolGate demo. */
.identity-art{isolation:isolate}.identity-art .art-orbits i{will-change:transform,opacity}.identity-art .art-labels span,.identity-art>p,.identity-art .art-top,.identity-art .art-bottom{will-change:transform,opacity}.work-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.work-card:hover,.work-card:focus-within{transform:translateY(-4px);box-shadow:0 14px 30px #17211d12;border-color:#bcc9c0}.card-actions{margin-top:15px;padding-top:12px;border-top:1px solid var(--line)}.card-action{font-size:12px;font-weight:700;text-decoration:none;color:var(--accent)}.card-action:hover,.card-action:focus-visible{text-decoration:underline}.art-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px;padding-top:12px;border-top:1px solid #ccd1ef;position:relative;z-index:1}.art-replay{appearance:none;border:1px solid #929ddf;border-radius:999px;background:transparent;color:#272c63;padding:7px 10px;font:inherit;font-size:11px;cursor:pointer}.art-replay:hover,.art-replay:focus-visible{background:#fff}.motion-note{font-size:10px;line-height:1.5;color:#5f6697}.path-grid>a{transition:background .18s ease,transform .18s ease,box-shadow .18s ease}.path-grid>a:hover,.path-grid>a:focus-visible{transform:translateY(-2px);box-shadow:0 10px 22px #17211d0d}.primary-link,.quiet-link,.text-link{transition:color .18s ease,background .18s ease,transform .18s ease}.primary-link:hover,.primary-link:focus-visible{transform:translateY(-2px)}
@media (prefers-reduced-motion:no-preference){.motion-ready .identity-art .art-orbits i:nth-child(1){animation:orbit-one .9s cubic-bezier(.2,.8,.2,1) both}.motion-ready .identity-art .art-orbits i:nth-child(2){animation:orbit-two 1s .1s cubic-bezier(.2,.8,.2,1) both}.motion-ready .identity-art .art-orbits i:nth-child(3){animation:orbit-three 1.1s .18s cubic-bezier(.2,.8,.2,1) both}.motion-ready .identity-art .art-orbits b{animation:mark-in .7s .32s cubic-bezier(.2,.8,.2,1) both}.motion-ready .identity-art .art-labels span{animation:label-in .55s .5s cubic-bezier(.2,.8,.2,1) both}.motion-ready .identity-art .art-labels span:nth-child(2){animation-delay:.59s}.motion-ready .identity-art .art-labels span:nth-child(3){animation-delay:.68s}.motion-ready .identity-art>p{animation:copy-in .65s .58s cubic-bezier(.2,.8,.2,1) both}.motion-ready .identity-art .art-top{animation:copy-in .5s .15s both}.motion-ready .identity-art .art-bottom{animation:copy-in .5s .78s both}}
@keyframes orbit-one{from{opacity:0;transform:rotate(-33deg) scale(.72)}to{opacity:1;transform:rotate(-33deg) scale(1)}}@keyframes orbit-two{from{opacity:0;transform:rotate(33deg) scale(.72)}to{opacity:1;transform:rotate(33deg) scale(1)}}@keyframes orbit-three{from{opacity:0;transform:rotate(90deg) scale(.72)}to{opacity:1;transform:rotate(90deg) scale(1)}}@keyframes mark-in{from{opacity:0;transform:scale(.84) rotate(-7deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes label-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes copy-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.demo-section h2{margin-bottom:12px}.toolgate-demo{margin-top:24px;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}.demo-controls{display:flex;flex-wrap:wrap;gap:8px;padding:16px;border-bottom:1px solid var(--line);background:#f5f7f3}.demo-button{appearance:none;border:1px solid #b9c6bc;border-radius:999px;background:#fff;color:var(--ink);padding:9px 13px;font:inherit;font-size:12px;line-height:1.3;cursor:pointer;transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease}.demo-button:hover,.demo-button:focus-visible{transform:translateY(-1px);border-color:var(--green)}.demo-button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.demo-output{padding:24px}.demo-output-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}.demo-status,.demo-code{font-size:11px;font-weight:700;letter-spacing:.08em}.demo-status{color:var(--green)}.demo-code{color:var(--muted);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.demo-output h3{font-size:22px;margin-bottom:8px}.demo-output>p{font-size:14px;margin-bottom:20px}.demo-result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:18px 0}.demo-result-grid>div{padding:14px;border:1px solid var(--line);border-radius:7px;background:#fbfcf9}.demo-result-grid span,.demo-label{display:block;color:var(--muted);font-size:11px;margin-bottom:6px}.demo-result-grid strong{font-size:15px}.demo-timeline-wrap{border-top:1px solid var(--line);padding-top:18px}.demo-timeline{list-style:none;padding:0;margin:0;display:grid;gap:10px}.demo-timeline li{display:grid;grid-template-columns:minmax(180px,.7fr) 1fr;gap:16px;padding:9px 0;border-bottom:1px dashed #dfe5df;font-size:12px}.demo-timeline b{color:var(--ink);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px}.demo-timeline span{color:var(--muted)}.demo-why{padding:14px 16px;margin:20px 0 0!important;background:#edf1e9;border-left:3px solid var(--green);font-size:13px!important}
@media(max-width:760px){.work-card:hover,.work-card:focus-within,.path-grid>a:hover,.path-grid>a:focus-visible,.primary-link:hover,.primary-link:focus-visible,.demo-button:hover,.demo-button:focus-visible{transform:none}.demo-output{padding:18px}.demo-output h3{font-size:20px}.demo-result-grid{grid-template-columns:1fr}.demo-timeline li{grid-template-columns:1fr;gap:3px}.demo-controls{display:grid;grid-template-columns:1fr}.demo-button{text-align:left}}
@media(prefers-reduced-motion:reduce){.work-card,.path-grid>a,.primary-link,.quiet-link,.text-link,.demo-button{transition:none}.identity-art *{animation:none!important}}

/* AI product case callout */
.case-callout{margin-top:4mm;border:1px solid #111;padding:5mm;background:#f5f3ee}.case-callout h3{margin:.8mm 0 1.5mm;font-size:15pt}.case-callout p{margin:0 0 2mm}.case-callout .text-link{font-weight:800}

/* ========== 优先级 1：极简 Hero 区 ========== */
.read-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: var(--green-700);
  width: 0;
  z-index: 1000;
  transition: width 0.1s linear;
}

#particleCanvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}

.hero-video {
  min-height: 85vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 80px 20px 60px;
  position: relative;
}

.hero-content {
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.hero-label {
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 650;
  color: var(--muted);
  margin-bottom: 32px;
}

.hero-title {
  font-size: clamp(48px, 7vw, 72px);
  line-height: 1.1;
  letter-spacing: -0.04em;
  font-weight: 700;
  font-family: var(--font-display);
  margin: 0 0 28px;
  color: var(--green-900);
}

.hero-subtitle {
  font-size: clamp(18px, 2.5vw, 24px);
  color: var(--muted);
  font-weight: 500;
  margin: 0 0 40px;
  line-height: 1.6;
}

.hero-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 40px 0 0;
}

.hero-scroll-hint {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 1.5px;
  opacity: 0.6;
  animation: bounce 2s infinite;
}

@keyframes bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(-8px); }
}

/* ========== 优先级 2：Hero 项目 + 不对称布局 ========== */
.work-showcase {
  margin-bottom: 32px;
}

.hero-project {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 40px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 32px;
  min-height: 460px;
}

.hero-visual {
  display: block;
  position: relative;
  background: #e5e7ed;
  overflow: hidden;
}

.hero-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top left;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.hero-project:hover .hero-visual img {
  transform: scale(1.05);
}

.hero-body {
  padding: 48px 42px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero-body .kicker {
  font-size: 10px;
  letter-spacing: 1.8px;
  margin-bottom: 14px;
}

.hero-body h3 {
  font-size: 32px;
  letter-spacing: -1px;
  line-height: 1.3;
  margin: 0 0 18px;
  font-weight: 700;
}

.hero-body h3 a {
  text-decoration: none;
  color: var(--ink);
  transition: color 0.2s;
}

.hero-body h3 a:hover {
  color: var(--green-700);
}

.hero-desc {
  font-size: 15px;
  line-height: 1.8;
  color: var(--muted);
  margin: 0 0 24px;
}

.hero-actions {
  display: flex;
  gap: 12px;
  margin-top: 24px;
}

.card-action.primary {
  background: var(--green-900);
  color: #fff;
  padding: 12px 20px;
  border-radius: 6px;
  font-weight: 700;
  transition: background 0.2s, transform 0.2s;
}

.card-action.primary:hover {
  background: var(--green-700);
  transform: translateY(-2px);
  text-decoration: none;
}

.secondary-projects {
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

/* ========== 优先级 3：增强交互反馈 ========== */
.work-visual {
  overflow: hidden;
}

.work-visual img {
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.work-card:hover .work-visual img {
  transform: scale(1.08);
}

.primary-link {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.primary-link::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.25);
  transform: translate(-50%, -50%);
  transition: width 0.6s ease, height 0.6s ease;
  z-index: -1;
}

.primary-link:hover::before {
  width: 300px;
  height: 300px;
}

.work-card {
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), 
              box-shadow 0.3s cubic-bezier(0.25, 0.8, 0.25, 1),
              border-color 0.3s;
}

.work-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(23, 33, 29, 0.12);
  border-color: var(--green-300);
}

/* ========== 优先级 4：视觉优化细节 ========== */
h1, h2, h3 {
  font-family: var(--font-display);
}

.primary-link {
  background: var(--green-900);
  font-weight: 600;
}

.primary-link:hover {
  background: var(--green-700);
}

.path-grid > a:hover {
  background: var(--green-50);
  border-color: var(--green-300);
}

.status-dot {
  background: var(--green-700);
}

/* ========== 响应式优化 ========== */
@media (max-width: 1024px) {
  .hero-project {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  
  .hero-visual {
    height: 320px;
  }
  
  .hero-body {
    padding: 36px 32px;
  }
  
  .secondary-projects {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .hero-simple {
    min-height: 70vh;
    padding: 60px 20px 40px;
  }
  
  .hero-title {
    font-size: 42px;
    margin-bottom: 20px;
  }
  
  .hero-subtitle {
    font-size: 16px;
  }
  
  .hero-actions {
    flex-direction: column;
    width: 100%;
    max-width: 300px;
    margin: 30px auto 0;
  }
  
  .hero-actions a {
    width: 100%;
    text-align: center;
    justify-content: center;
  }
  
  .hero-scroll-hint {
    display: none;
  }
  
  .hero-body h3 {
    font-size: 26px;
  }
  
  .hero-actions {
    flex-direction: column;
    gap: 10px;
  }
  
  .card-action.primary {
    width: 100%;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-scroll-hint {
    animation: none;
  }
  
  .work-visual img,
  .primary-link::before {
    transition: none;
  }
}

/* ========== 2026-09-30 岗位简历入口 ========== */
.resume-section {
  padding-top: 86px;
}

.resume-intro {
  max-width: 520px;
  color: var(--muted);
  line-height: 1.75;
}

.resume-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.resume-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 34px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 14px 34px rgba(23, 33, 29, 0.06);
}

.resume-card h3 {
  margin: 8px 0 14px;
  font-size: clamp(24px, 3vw, 34px);
}

.resume-card p {
  color: var(--muted);
  line-height: 1.75;
}

.resume-card ul {
  margin: 22px 0 26px;
  padding-left: 20px;
  line-height: 1.8;
}

.resume-card li + li {
  margin-top: 6px;
}

.resume-card .card-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 760px) {
  .resume-section {
    padding-top: 54px;
  }

  .resume-grid {
    grid-template-columns: 1fr;
  }

  .resume-card {
    padding: 26px 22px;
  }
}

/* 2026-09-30 mobile overflow repair */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.hero-content {
  width: 100%;
  min-width: 0;
}

@media (max-width: 768px) {
  header,
  main,
  footer {
    margin-left: 16px;
    margin-right: 16px;
  }

  .header nav {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
  }

  .hero-video {
    min-height: 70vh;
    padding: 56px 0 38px;
  }

  .hero-title {
    max-width: 100%;
    font-size: clamp(32px, 10vw, 40px);
    line-height: 1.14;
    letter-spacing: -0.045em;
    overflow-wrap: anywhere;
  }

  .hero-subtitle {
    max-width: 100%;
    font-size: 15px;
    overflow-wrap: anywhere;
  }

  .hero-actions,
  .hero-actions a,
  .primary-link,
  .quiet-link {
    max-width: 100%;
  }

  .path-grid {
    grid-template-columns: 1fr;
  }

  .path-grid > a + a {
    border-left: 0;
    border-top: 1px solid var(--line);
  }
}

/* ========== 2026-10-11 首页入口与证据层级 ========== */
#particleCanvas {
  opacity: 0.42;
}

.hero-video {
  min-height: 64vh;
  padding-top: 54px;
  padding-bottom: 46px;
}

.hero-label {
  letter-spacing: 1px;
}

.hero-proof {
  max-width: 720px;
  margin: -18px auto 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.hero-project {
  height: 620px;
  min-height: 0;
}

.hero-visual {
  height: 620px;
}

.project-facts {
  display: grid;
  gap: 7px;
  margin: 15px 0 0;
  padding-top: 13px;
  border-top: 1px solid var(--line);
}

.project-facts p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.project-facts strong {
  display: inline-block;
  min-width: 34px;
  margin-right: 8px;
  color: var(--ink);
  font-size: 11px;
}

.secondary-projects .work-card:last-child {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.secondary-projects .work-card:last-child .work-visual {
  height: 100%;
  min-height: 216px;
}

.footer-special a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

h1,
h2,
h3,
.hero-title,
.editorial-heading h2 {
  letter-spacing: 0;
}

@media (max-width: 1024px) {
  .hero-project {
    height: auto;
  }

  .hero-visual {
    height: 320px;
  }

  .secondary-projects .work-card:last-child {
    display: block;
  }

  .secondary-projects .work-card:last-child .work-visual {
    height: 216px;
  }
}

@media (max-width: 768px) {
  #particleCanvas {
    opacity: 0.26;
  }

  .hero-video {
    min-height: 62vh;
    padding-top: 42px;
    padding-bottom: 30px;
  }

  .hero-title {
    font-size: clamp(31px, 9.5vw, 40px);
    letter-spacing: 0;
  }

  .hero-proof {
    margin-top: -13px;
    font-size: 12px;
  }

  .hero-project {
    height: auto;
  }

  .hero-visual {
    height: 320px;
  }

  .project-facts p {
    -webkit-line-clamp: 3;
  }

  .secondary-projects .work-card:last-child {
    display: block;
  }

  .secondary-projects .work-card:last-child .work-visual {
    height: 220px;
  }
}

/* ===== 2026.10 升级版：指标条 / 前后对比 / 首页升级带 ===== */

.metric-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:26px 0 0}
.metric-strip>div{background:#fff;padding:18px 20px;min-width:0}
.metric-strip strong{display:block;font-family:var(--font-display);font-size:26px;line-height:1.15;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.metric-strip span{display:block;margin-top:6px;font-size:11px;line-height:1.6;color:var(--muted)}

.delta-grid{margin:26px 0 0;border-top:1px solid var(--line)}
.delta-row{display:grid;grid-template-columns:minmax(120px,1fr) 190px minmax(150px,1.4fr);gap:18px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.delta-label{font-size:13px;font-weight:650;color:var(--ink)}
.delta-values{display:flex;align-items:baseline;gap:10px;font-variant-numeric:tabular-nums}
.delta-before{font-family:var(--font-mono);font-size:13px;font-weight:500;color:#8a8a90;text-decoration:line-through;text-decoration-thickness:1px}
.delta-values i{font-style:normal;color:var(--muted);font-size:12px}
.delta-after{font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--accent)}
.delta-note{font-size:11.5px;line-height:1.75;color:var(--muted)}

.upgrade-band{padding:36px 0 6px}
.upgrade-head{margin-bottom:18px}
.upgrade-head h2{font-size:24px;letter-spacing:-.02em;margin:0}
.upgrade-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.upgrade-card{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;text-decoration:none;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.upgrade-card:hover{transform:translateY(-2px);border-color:#c9cbf0;box-shadow:0 12px 26px #1b1b1d12}
.upgrade-tag{font-size:10px;letter-spacing:1.4px;font-weight:650;color:var(--accent)}
.upgrade-card h3{font-size:17px;margin:0;letter-spacing:-.01em}
.upgrade-card p{font-size:12.5px;line-height:1.8;color:var(--muted);margin:0}
.upgrade-metric{margin-top:auto;padding-top:10px;border-top:1px solid var(--line);font-family:var(--font-mono);font-size:11px;line-height:1.6;color:var(--ink)}

.hero-subtitle{max-width:36em;margin-left:auto;margin-right:auto;text-wrap:balance}
h1,h2,h3{text-wrap:balance}
.page-intro>p:last-child,.detail-top .lead,.work-body>p:not(.kicker),.archive-body p,.detail-section p{text-wrap:pretty}

@media(max-width:960px){.upgrade-grid{grid-template-columns:1fr}}
@media(max-width:760px){
  .metric-strip{grid-template-columns:repeat(2,1fr)}
  .metric-strip strong{font-size:22px}
  .delta-row{grid-template-columns:1fr;gap:4px;padding:14px 0}
  .delta-values{order:2}
  .delta-note{order:3;margin-top:2px}
  .upgrade-band{padding-top:24px}
  .upgrade-card:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){.upgrade-card{transition:none}.upgrade-card:hover{transform:none}}
.delta-new{font-size:10px;letter-spacing:.08em;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 9px;white-space:nowrap}
.screenshot.screenshot-full a{max-height:none}
.screenshot.screenshot-full img{display:block}