:root{--bg:#f7f6ef;--ink:#263225;--muted:#697360;--green:#d7ef67;--line:#dce0d2}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}header,main,footer{max-width:1280px;margin:auto}header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 36px}.logo{font-size:26px;font-weight:800;letter-spacing:-1px}.logo span{font-weight:400}.logo sup{margin-left:7px;color:#657e29}nav{display:flex;gap:30px;font-size:14px}.small-button{border:1px solid #263225;padding:10px 17px;border-radius:5px;font-size:13px}main{padding:0 36px}.hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;min-height:620px;gap:20px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:600;color:#697552}h1{font-size:clamp(38px,4.5vw,62px);line-height:1.3;letter-spacing:-2px;margin:24px 0}h1 span{color:#6c8437}h2{font-size:34px;line-height:1.4;margin:12px 0 20px;letter-spacing:-1px}p{color:var(--muted)}.intro{font-size:17px;line-height:1.95}.actions{display:flex;gap:26px;align-items:center;margin-top:30px}.button{background:var(--ink);color:white;display:inline-flex;gap:35px;align-items:center;padding:15px 23px;border:0;border-radius:5px;font-size:14px}.button:hover{background:#465e38}.text-link{font-size:13px}.micro{font-size:11px;margin-top:19px}.art{height:460px;position:relative}.record{width:345px;height:345px;border-radius:50%;background:repeating-radial-gradient(circle,#20271f 0,#20271f 2px,#343c30 3px,#20271f 4px);position:absolute;right:10px;top:14px;box-shadow:20px 24px 30px #26322516;display:grid;place-items:center;transform:rotate(-14deg)}.label{width:130px;height:130px;border-radius:50%;background:var(--green);text-align:center;font-size:24px;font-weight:700;line-height:1.1;padding-top:28px}.label small{font-size:6px;display:block;margin-top:11px;letter-spacing:1px}.word-note{position:absolute;left:0;top:190px;width:235px;padding:26px;background:#fffefa;transform:rotate(5deg);border:1px solid var(--line);box-shadow:0 15px 25px #26322512}.word-note span{font-size:9px;letter-spacing:2px;color:#87916e}.word-note h2{font-family:Georgia,serif;font-size:43px;font-weight:400;margin:12px 0 0}.word-note p{font-size:14px}.note-line{border-top:1px solid var(--line);margin:20px 0 12px}.word-note small{font-size:11px}.art-caption{position:absolute;right:0;bottom:15px;font-size:10px;letter-spacing:2px}.strip{display:flex;gap:30px;align-items:center;background:#e8eddc;padding:22px 32px;font-size:14px}.strip b{font-weight:400;color:#7c8b61}.strip small{margin-left:auto;color:#68765b}.section{padding:90px 0 10px;scroll-margin-top:25px}.steps{display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px;gap:45px}.steps article{border-top:1px solid var(--line);padding-top:25px}.steps em{font-size:12px;font-style:normal;color:#7d8c64}.steps h3{font-size:20px;margin:13px 0}.steps p{font-size:14px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.section-heading p{font-size:14px}.toolbar{display:flex;gap:12px;align-items:center;margin-top:28px}.toolbar input{padding:14px 16px;border:1px solid var(--line);background:#fffefa;border-radius:5px;flex:1;min-width:0}.toolbar button{border:0;background:transparent;font-size:12px;color:#52623c}#status{font-size:12px}.word-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-height:520px;overflow:auto;padding:2px}.word{display:flex;gap:12px;align-items:flex-start;padding:20px;background:#fffefa;border:1px solid var(--line);border-radius:4px;cursor:pointer}.word:has(input:checked){background:#edf4d5;border-color:#82965b}.word input{margin-top:8px;accent-color:#536d37}.word b{display:block;font-family:Georgia,serif;font-size:23px;font-weight:400}.word small{font-size:12px;color:#697360}.connection{margin:90px 0 70px;padding:40px;background:var(--ink);color:#f5f5e9;display:flex;align-items:center;gap:60px}.connection p{color:#c3cbb7;font-size:14px;max-width:730px}.badge{flex-shrink:0;border:1px solid #758166;border-radius:30px;padding:8px 15px;font-size:12px;color:#d7ef67}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:32px 36px;gap:25px}footer p,footer>a:last-child{font-size:11px}:focus-visible{outline:3px solid #91ad42;outline-offset:4px}@media(max-width:800px){header{padding:20px;height:auto;flex-wrap:wrap;gap:18px}nav{gap:18px;font-size:12px}header .small-button{display:none}main{padding:0 20px}.hero{grid-template-columns:1fr;padding-top:35px}.art{height:380px;max-width:420px;width:100%;margin:auto}.record{width:285px;height:285px}.word-note{top:145px;width:200px;padding:20px}.art-caption{bottom:4px}.strip{gap:12px;padding:18px 14px;font-size:12px}.strip small{display:none}.steps{grid-template-columns:1fr;gap:15px}.section{padding-top:55px}.section-heading{align-items:start;flex-direction:column}.toolbar{flex-wrap:wrap}.toolbar input{flex-basis:100%}.word-grid{grid-template-columns:repeat(2,1fr)}.word{padding:14px 10px;gap:6px}.word b{font-size:21px}.connection{padding:24px;gap:15px;flex-direction:column;align-items:start}footer{flex-wrap:wrap;padding:25px 20px}h2{font-size:28px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
