:root{--ink:#10231f;--muted:#66746f;--paper:#f4f6f1;--card:#fff;--green:#0c5b47;--mint:#bfe9d5;--lime:#d9ef74;--line:#d9dfd9;--orange:#ed7146;--shadow:0 18px 45px rgba(18,48,39,.1)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;line-height:1.65}.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.7rem;z-index:10}.topbar{height:78px;padding:0 clamp(22px,5vw,76px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(244,246,241,.93);backdrop-filter:blur(12px);position:sticky;top:0;z-index:5}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-weight:800;line-height:1.1}.brand small{display:block;font-size:9px;letter-spacing:.16em;color:var(--muted);margin-top:5px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;background:var(--green);color:#fff;border-radius:50%}.topbar nav{display:flex;gap:28px}.topbar nav a{color:var(--ink);text-decoration:none;font-size:14px}.topbar nav a:hover{color:var(--green)}main{overflow:hidden}.hero{min-height:650px;padding:86px clamp(24px,7vw,110px);display:grid;grid-template-columns:1.15fr .85fr;gap:7vw;align-items:center;background:radial-gradient(circle at 82% 18%,#d8f2e4 0,transparent 31%)}.kicker{font-size:12px;font-weight:800;color:var(--green);letter-spacing:.16em;text-transform:uppercase}.hero h1{font-size:clamp(48px,6.4vw,88px);line-height:1.04;letter-spacing:-.055em;margin:18px 0 26px}.hero h1 em{font-style:normal;color:var(--green)}.hero-copy>p:not(.kicker){font-size:18px;max-width:720px;color:#53645e}.hero-actions{display:flex;gap:12px;margin-top:36px}.primary,.secondary{padding:13px 20px;border-radius:8px;text-decoration:none;font-weight:700}.primary{background:var(--green);color:white}.secondary{border:1px solid var(--ink);color:var(--ink)}.hero-panel{min-height:390px;background:var(--ink);color:white;border-radius:34px;display:grid;place-items:center;box-shadow:var(--shadow);transform:rotate(1.5deg);padding:40px}.hero-panel>p{margin:0;color:var(--mint);letter-spacing:.13em}.orbit{display:grid;grid-template-columns:1fr;justify-items:center;gap:4px}.orbit span{width:180px;text-align:center;border:1px solid #56716a;border-radius:99px;padding:12px;background:#183a32}.orbit span:nth-of-type(2){background:var(--green)}.orbit span:nth-of-type(3){color:var(--ink);background:var(--lime);border:0}.orbit i{height:25px;border-left:1px dashed var(--mint)}.stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:1180px;margin:-42px auto 70px;background:white;border-radius:18px;box-shadow:var(--shadow);position:relative}.stats article{padding:25px 30px;border-right:1px solid var(--line)}.stats article:last-child{border:0}.stats strong{display:block;font-size:34px;color:var(--green)}.stats span{font-size:13px;color:var(--muted)}.section{max-width:1320px;margin:auto;padding:85px clamp(22px,5vw,66px);scroll-margin-top:70px}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:34px}.section h2{font-size:clamp(32px,4vw,54px);letter-spacing:-.04em;line-height:1.1;margin:8px 0}.section-head p{max-width:670px;color:var(--muted)}.search{display:block;min-width:290px}.search span{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}.search input,select{width:100%;background:white;border:1px solid var(--line);border-radius:9px;padding:12px 14px;color:var(--ink);font:inherit}.pattern-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.pattern-card{border:1px solid var(--line);background:var(--card);border-radius:15px;padding:25px;min-height:250px;display:flex;flex-direction:column;cursor:pointer;transition:.2s}.pattern-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#a9c6b8}.pattern-card .id{font:700 12px ui-monospace,monospace;color:var(--orange)}.pattern-card h3{font-size:21px;line-height:1.3;margin:18px 0 6px}.en{color:var(--muted);font-size:12px}.pattern-card p{color:var(--muted);font-size:14px}.pattern-meta{display:flex;justify-content:space-between;margin-top:auto;padding-top:20px;font-size:12px;color:var(--green)}.more{display:block;margin:28px auto 0;border:1px solid var(--ink);background:transparent;border-radius:8px;padding:11px 22px;cursor:pointer}.controls-section{max-width:none;background:#e8ede7;padding-left:max(clamp(22px,7vw,110px),calc((100vw - 1320px)/2));padding-right:max(clamp(22px,7vw,110px),calc((100vw - 1320px)/2))}.control-toolbar{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;align-items:end}.control-toolbar .search{min-width:0}.control-list{margin-top:20px;background:white;border-radius:14px;overflow:hidden;border:1px solid var(--line)}.control-row{display:grid;grid-template-columns:90px minmax(240px,1.3fr) minmax(260px,2fr) 150px;gap:18px;padding:17px 20px;border-bottom:1px solid var(--line);align-items:center;cursor:pointer}.control-row:last-child{border:0}.control-row:hover{background:#f7faf6}.control-id{font:800 14px ui-monospace,monospace;color:var(--green)}.control-name b{display:block}.control-desc{font-size:13px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.badges{display:flex;gap:4px}.badge{border-radius:99px;padding:3px 7px;font-size:10px;background:#edf1ed;color:#87918d}.badge.on{background:var(--lime);color:#344010}.result{font-size:13px;color:var(--muted)}.pagination{display:flex;gap:6px;justify-content:center;margin-top:24px;flex-wrap:wrap}.pagination button{border:1px solid var(--line);background:white;border-radius:6px;padding:7px 11px}.pagination button.active{background:var(--green);color:#fff}.framework-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.framework-card{background:white;border:1px solid var(--line);border-radius:12px;padding:20px}.framework-card strong{display:block;font-size:15px}.framework-card span{font-size:12px;color:var(--muted)}.framework-card i{display:block;height:5px;background:#e8ede7;border-radius:99px;margin-top:16px;overflow:hidden}.framework-card i:after{content:"";display:block;width:var(--coverage);height:100%;background:var(--green)}.guide{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.guide ol{list-style:none;margin:0;padding:0}.guide li{display:grid;grid-template-columns:45px 180px 1fr;gap:15px;border-top:1px solid var(--line);padding:20px 0;counter-increment:item}.guide li:before{content:"0" counter(item);font:700 12px ui-monospace;color:var(--orange)}.guide li span{color:var(--muted);font-size:14px}footer{background:var(--ink);color:#fff;padding:55px max(clamp(24px,7vw,110px),calc((100vw - 1180px)/2));display:flex;justify-content:space-between;gap:40px}footer p{font-size:13px;color:#a8b8b3;max-width:570px}.license{text-align:right}.license span,.license small{display:block;color:#a8b8b3;font-size:11px}.license b{display:block;margin:6px 0}dialog{border:0;border-radius:18px;max-width:760px;width:calc(100% - 32px);padding:40px;box-shadow:0 30px 100px #0006;color:var(--ink)}dialog::backdrop{background:#09221cb8;backdrop-filter:blur(3px)}.dialog-close{position:absolute;right:18px;top:14px;border:0;background:transparent;font-size:26px;cursor:pointer}.detail-label{color:var(--green);font:800 12px ui-monospace}.detail-desc{background:#f1f4ef;padding:18px;border-radius:10px}.detail-controls{display:flex;flex-wrap:wrap;gap:6px}.detail-controls span{font:12px ui-monospace;background:#e5efe9;border-radius:5px;padding:5px 8px}@media(max-width:900px){.topbar nav{display:none}.hero{grid-template-columns:1fr;padding-top:55px}.hero-panel{min-height:320px}.stats{margin:0 18px 30px;grid-template-columns:1fr 1fr}.stats article:nth-child(2){border-right:0}.pattern-grid{grid-template-columns:1fr 1fr}.framework-grid{grid-template-columns:1fr 1fr}.control-toolbar{grid-template-columns:1fr 1fr}.control-toolbar .wide{grid-column:1/-1}.control-row{grid-template-columns:75px 1fr 110px}.control-desc{display:none}.guide{grid-template-columns:1fr}footer{flex-direction:column}.license{text-align:left}}@media(max-width:600px){.hero{padding-left:22px;padding-right:22px}.hero h1{font-size:46px}.hero-actions{flex-direction:column;text-align:center}.hero-panel{display:none}.section-head{display:block}.search{min-width:0;margin-top:20px}.pattern-grid,.framework-grid{grid-template-columns:1fr}.control-row{grid-template-columns:65px 1fr}.control-row .badges{display:none}.guide li{grid-template-columns:35px 1fr}.guide li span{grid-column:2}.stats article{padding:18px}.stats strong{font-size:28px}}