:root{
  --paper:#f3efe6;--ink:#171713;--muted:#6d695f;--line:#cfc8bb;
  --accent:#e64a2e;--acid:#d8ff55;--dark:#20241d;--white:#fffdf7;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC","Source Han Sans SC","Microsoft YaHei",sans-serif;line-height:1.65}
a{color:inherit;text-decoration:none}
.site-header{height:84px;max-width:1240px;margin:auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.08em}
.brand-mark{width:34px;height:34px;display:grid;place-items:center;background:var(--ink);color:var(--paper);font-family:"Noto Serif SC",serif;font-size:18px}
nav{display:flex;gap:32px;font-size:14px}
nav a{position:relative}
nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:2px;background:var(--accent);transition:right .2s}
nav a:hover:after,nav a:focus-visible:after{right:0}
main{max-width:1240px;margin:auto;padding:0 28px}
.hero{min-height:610px;padding:110px 0 72px;border-bottom:1px solid var(--line);position:relative}
.hero:after{content:"";position:absolute;right:2%;top:95px;width:150px;height:150px;border:1px solid var(--ink);border-radius:50%;box-shadow:30px 38px 0 var(--acid)}
.eyebrow,.section-label{font:700 12px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase}
.hero h1{font-family:"Noto Serif SC","Source Han Serif SC",STSong,serif;font-size:clamp(56px,8.5vw,116px);line-height:1.02;letter-spacing:-.055em;margin:24px 0 34px;font-weight:900}
.hero h1 em{color:var(--accent);font-style:normal}
.lead{max-width:690px;font-size:20px;color:#45423b}
.hero-meta{display:flex;gap:28px;margin-top:54px;font-size:13px;color:var(--muted)}
.dispatch,.tool-section,.cards,.about{padding:84px 0;border-bottom:1px solid var(--line)}
.feature{margin-top:34px;background:var(--white);display:grid;grid-template-columns:1.08fr .92fr;min-height:430px;border:1px solid var(--ink)}
.feature-copy{padding:62px}
.tag{font-size:12px;background:var(--acid);padding:7px 11px;font-weight:800;letter-spacing:.1em}
.feature h2,.section-head h2,.workflow-section h2,.about h2{font-family:"Noto Serif SC","Source Han Serif SC",STSong,serif;font-size:clamp(34px,4vw,57px);line-height:1.18;letter-spacing:-.035em;margin:26px 0}
.feature-copy p{color:var(--muted);max-width:580px}
.text-link{display:inline-block;margin-top:24px;font-weight:800;border-bottom:2px solid var(--ink)}
.text-link span{color:var(--accent)}
.feature-art{position:relative;overflow:hidden;background:var(--dark);min-height:380px}
.frame{position:absolute;width:56%;aspect-ratio:4/3;border:1px solid #7d8177;background:linear-gradient(145deg,#465046,#161912);color:var(--acid)}
.frame span{position:absolute;right:12px;bottom:8px;font:700 12px monospace}
.frame-a{left:10%;top:12%;transform:rotate(-6deg)}
.frame-b{right:6%;bottom:18%;transform:rotate(7deg);background:linear-gradient(145deg,#783c2c,#1a1715)}
.timeline{position:absolute;left:7%;right:7%;bottom:7%;display:flex;gap:5px}
.timeline i{height:6px;background:#777b70;flex:1}.timeline i:nth-child(3){background:var(--accent);flex:2}
.section-head{display:grid;grid-template-columns:1fr .7fr;gap:80px;align-items:end}
.section-head>p{color:var(--muted);font-size:18px;padding-bottom:12px}
.tool-list{margin-top:52px;border-top:1px solid var(--ink)}
.tool-row{display:grid;grid-template-columns:55px 220px 1fr 100px;gap:24px;align-items:center;padding:25px 0;border-bottom:1px solid var(--line)}
.tool-index{font:800 13px monospace;color:var(--accent)}
.tool-row h3{font-size:21px;margin:0}.tool-row div p{font-size:12px;margin:3px 0 0;color:var(--muted)}
.tool-row>p{margin:0;color:#514d45}.tool-row>a{text-align:right;font-size:13px;font-weight:800}
.workflow-section{margin-left:-28px;margin-right:-28px;padding:90px 28px;background:var(--dark);color:var(--white)}
.section-label.light{color:var(--acid)}
.workflow-section>h2{max-width:700px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#55594f;border:1px solid #55594f;margin-top:48px}
.steps article{background:var(--dark);padding:35px 28px;min-height:275px}
.steps span{color:var(--acid);font:800 13px monospace}
.steps h3{font-size:19px;line-height:1.35;margin:36px 0 16px}
.steps p{font-size:14px;color:#b9bcb2;margin:0}
.recipe{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;background:var(--acid);color:var(--ink);padding:34px 40px;margin-top:30px}
.recipe-kicker{display:block;font:800 11px monospace;letter-spacing:.12em;margin-bottom:9px}.recipe strong{font-size:18px}
.recipe p{margin:0}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
.post-card{background:var(--white);border:1px solid var(--line)}
.post-visual{height:190px;display:grid;place-items:center;overflow:hidden;position:relative}
.post-visual:before{content:"";position:absolute;width:160px;height:160px;border:1px solid currentColor;transform:rotate(35deg)}
.post-visual span{z-index:1;font:900 17px monospace;letter-spacing:.2em}
.visual-one{background:#d4e2dd;color:#1d5146}.visual-two{background:#edc8b4;color:#7e2f20}.visual-three{background:#ded6ef;color:#4d3679}
.post-body{padding:26px}.post-body>span{font:700 11px monospace;color:var(--accent)}
.post-body h3{font-family:"Noto Serif SC",serif;font-size:23px;line-height:1.35;margin:14px 0}
.post-body p{color:var(--muted);font-size:14px}
.about{display:grid;grid-template-columns:.35fr 1fr;gap:80px}
.about h2{margin-top:0}.about p{max-width:750px;color:var(--muted);font-size:17px}
footer{max-width:1240px;margin:auto;padding:50px 28px 65px;display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:24px;font-size:12px;color:var(--muted)}
.footer-brand{color:var(--ink)}
@media(max-width:850px){
  nav{display:none}.site-header{height:70px}.hero{min-height:auto;padding:75px 0}.hero:after{width:70px;height:70px;top:55px;opacity:.45;box-shadow:14px 18px 0 var(--acid)}
  .hero h1{font-size:clamp(48px,15vw,78px)}.lead{font-size:17px}.hero-meta{flex-wrap:wrap;gap:8px 20px;margin-top:35px}
  .feature,.section-head,.about{grid-template-columns:1fr}.feature-copy{padding:35px 28px}.section-head{gap:12px}
  .tool-row{grid-template-columns:35px 1fr}.tool-row>p{grid-column:2}.tool-row>a{grid-column:2;text-align:left}
  .steps,.card-grid{grid-template-columns:1fr}.steps article{min-height:auto}.recipe{grid-template-columns:1fr;gap:18px}
  footer{grid-template-columns:1fr}.about{gap:18px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}