:root { --green:#188453; --deep:#073c2b; --ink:#182238; --muted:#778193; --line:#dfede5; --paper:#fff; --mint:#eef9f2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:85px; }
body { margin:0; background:linear-gradient(180deg,#fff 25%,#f7fcf9 68%,#edf8f1); color:var(--ink); font:14px/1.55 "PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; text-decoration:none; }
a:hover { color:var(--green); }
button,input { font:inherit; }
button { cursor:pointer; }
img { max-width:100%; }
h1,h2,h3,p { margin:0; }
a:focus-visible,button:focus-visible,input:focus-visible { outline:3px solid #38a977; outline-offset:4px; }
.shell { width:min(1250px,calc(100% - 88px)); margin-inline:auto; }
.icon { width:25px; height:25px; flex-shrink:0; vertical-align:middle; color:var(--green); object-fit:contain; }
.sr-only,.skip-link:not(:focus) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link:focus { position:fixed; top:0; left:0; z-index:99; background:#fff; padding:12px; }
.site-header { height:66px; background:#fbfefcf5; position:sticky; top:0; z-index:20; border-bottom:1px solid #e8f2eb; backdrop-filter:blur(12px); }
.header-inner { height:100%; display:flex; align-items:center; gap:30px; }
.brand { display:inline-flex; align-items:center; gap:9px; flex-shrink:0; color:#103e31; }
.brand>img { object-fit:contain; width:45px; height:45px; }
.brand strong { display:block; font-size:24px; line-height:1.2; letter-spacing:-.7px; font-weight:750; }
.brand small { display:block; color:#6b827b; font-size:8px; margin-top:2px; letter-spacing:1.5px; }
.site-header nav { display:flex; align-self:stretch; align-items:stretch; gap:28px; margin-left:auto; }
.site-header nav>a { font-size:13px; font-weight:600; position:relative; white-space:nowrap; display:flex; align-items:center; }
.site-header nav>a[aria-current] { color:var(--green); }
.site-header nav>a[aria-current]:after { content:""; position:absolute; bottom:11px; left:0; right:0; height:2px; background:#21a968; }
.search { display:flex; align-items:center; background:#fff; border:1px solid #a8d6bb; border-radius:10px; overflow:hidden; }
.search .icon { width:22px; height:22px; margin-left:17px; }
.search input { flex:1; min-width:0; border:0; background:transparent; outline:none; padding:12px; color:var(--ink); }
.search input::placeholder { color:#8d98aa; }
.search button,.button { display:inline-flex; justify-content:center; align-items:center; border:0; background:linear-gradient(110deg,#178b57,#127c4d); color:white; border-radius:8px; font-weight:600; padding:10px 28px; }
.search button:hover,.button:hover { background:#08673f; color:#fff; }
.nav-search { width:268px; height:35px; margin-left:auto; border-color:#b4c4c4; border-radius:9px; }
.nav-search input { font-size:11px; padding:8px; }
.nav-search .icon { height:16px; width:16px; margin-left:11px; color:#3c7769; }
.menu-toggle { display:none; border:0; background:transparent; font-size:25px; color:var(--deep); }
.hero { background:radial-gradient(ellipse at 84% 15%,#c9efd780,transparent 58%),linear-gradient(105deg,#edf9f2,#effaf4 60%,#e2f5e9); overflow:hidden; position:relative; }
.hero:before { content:""; position:absolute; width:1000px; height:320px; background:#b7e7cb22; transform:rotate(22deg); border-radius:50%; top:120px; left:-90px; }
.hero-inner { min-height:410px; display:grid; grid-template-columns:1.1fr 1fr; gap:10px; position:relative; }
.hero-copy { padding:38px 0 26px 20px; z-index:2; }
.hero h1 { font-size:43px; color:var(--deep); line-height:1.18; font-weight:850; letter-spacing:1.5px; }
.hero h1 span { font-size:51px; letter-spacing:1px; }
.hero-promise { font-size:17px; font-weight:600; color:#267550; margin:9px 0 3px; }
.hero-description { color:#486872; font-size:15px; line-height:1.55; margin:5px 0 17px; letter-spacing:.2px; }
.hero-search { height:49px; width:100%; box-shadow:0 2px 4px #22734205; }
.hero-search input { font-size:13px; }
.hero-search button { min-width:94px; height:41px; margin-right:4px; }
.hot-search { display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; align-items:center; font-size:10px; }
.hot-search strong { color:#2a6b54; font-size:11px; }
.hot-search a { background:#e4edeb; color:#4c6067; padding:2px 9px; border-radius:16px; font-size:10px; white-space:nowrap; }
.hot-search a:hover { background:#d0eadb; color:var(--deep); }
.metrics { display:flex; align-items:center; gap:26px; margin-top:27px; }
.metrics>div { display:flex; gap:11px; align-items:center; position:relative; }
.metrics>div+div:before { content:""; position:absolute; top:4px; bottom:4px; left:-14px; width:1px; background:#d3e9dd; }
.metrics .icon { width:36px; height:36px; color:#21895b; }
.metrics>div:first-child>.icon { background:#7dbb96; color:#fff; border-radius:50%; padding:7px; }
.metrics strong { display:block; color:#097347; font-size:22px; font-weight:750; line-height:1.1; letter-spacing:.4px; }
.metrics small { color:#688079; font-size:11px; display:block; margin-top:4px; }
.hero-art { position:relative; min-width:0; align-self:stretch; }
.hero-illustration { position:absolute; width:110%; height:100%; max-width:none; object-fit:contain; right:-25px; bottom:-4px; mix-blend-mode:multiply; }
.art-label { position:absolute; padding:9px 17px; color:#14603c; background:#ffffffeb; border-radius:14px; box-shadow:0 8px 16px #3a8a4d0c; font-size:16px; font-weight:650; white-space:nowrap; }
.label-doc { left:18%; top:10%; }
.label-github { right:12%; top:27%; display:flex; gap:6px; align-items:center; font-size:14px; }
.label-github .icon { width:17px; height:17px; }
.art-words { display:grid; gap:9px; position:absolute; right:0; top:47%; }
.art-words span { background:#ffffffdc; padding:5px 13px; border-radius:5px; box-shadow:0 4px 8px #3287510b; color:#398a5c; font-size:13px; }
.art-note { position:absolute; right:0; bottom:28px; transform:rotate(-9deg); color:#315e4e; font-size:15px; font-family:"STKaiti","Kaiti SC",serif; letter-spacing:4px; text-align:right; }
.homepage-content { padding-top:23px; padding-bottom:18px; }
.homepage-content>section { margin-bottom:27px; }
.homepage-content>section:last-child { margin-bottom:0; }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:13px; }
.section-heading>div { display:flex; gap:12px; align-items:flex-start; border-left:3px solid var(--green); padding-left:12px; }
.section-heading h2 { font-size:20px; line-height:1.35; font-weight:750; }
.section-heading p { font-size:12px; color:#7a8990; line-height:1.55; margin-top:2px; letter-spacing:.25px; }
.section-heading>div>.icon { margin-top:1px; }
.section-heading>a { color:#277d56; font-size:12px; white-space:nowrap; display:flex; gap:7px; align-items:center; }
.section-heading>a .icon { width:16px; height:16px; }
.categories-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:12px; }
.category-card { background:#ffffffda; border:1px solid var(--line); border-radius:9px; box-shadow:0 5px 12px #185c3106; padding:17px 8px 12px; text-align:center; transition:transform .16s,box-shadow .16s; }
.category-card:hover,.content-card:hover,.topic-card:hover { transform:translateY(-3px); box-shadow:0 9px 22px #26764212; border-color:#b9ddc7; }
.category-card>.icon { height:32px; width:32px; margin-bottom:9px; color:#2b9a76; stroke-width:2.2; }
.category-card h3 { font-size:14px; margin-bottom:7px; font-weight:650; white-space:nowrap; }
.category-card p { color:var(--muted); font-size:12px; line-height:1.65; }
.category-foot { display:flex; justify-content:center; align-items:center; gap:6px; margin-top:9px; }
.category-foot small { font-size:9px; color:#889990; }
.category-foot b { border-radius:50%; display:inline-flex; width:22px; height:22px; background:#ddf5e7; align-items:center; justify-content:center; font-size:14px; font-weight:400; color:#279567; }
.docs-grid,.projects-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:13px; }
.content-card { min-width:0; background:#ffffffeb; border:1px solid #dceee4; border-radius:11px; padding:14px 16px 12px; box-shadow:0 6px 13px #1c7f400a; display:flex; flex-direction:column; transition:transform .16s,box-shadow .16s; }
.card-top { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:11px; min-height:46px; }
.product-logo { width:43px; height:43px; object-fit:contain; }
.status { font-size:10px; padding:3px 9px; line-height:1.2; white-space:nowrap; border-radius:20px; color:#398d61; background:#d7f3e3; }
.status.update { color:#bd702e; background:#fff0e3; }
.status.archived { color:#67717d; background:#f0f1f2; }
.content-card h3 { font-size:14px; line-height:1.45; margin-bottom:9px; font-weight:650; }
.content-card>p { font-size:12px; color:var(--muted); line-height:1.65; min-height:79px; margin-bottom:12px; }
.tags { display:flex; flex-wrap:wrap; gap:5px; margin-top:auto; margin-bottom:13px; min-height:21px; align-items:start; }
.tags span { font-size:10px; background:#edf6fb; color:#55718a; padding:3px 7px; border-radius:5px; white-space:nowrap; }
.card-meta { display:flex; align-items:center; justify-content:space-between; gap:6px; font-size:11px; color:#647085; }
.card-meta .icon { height:12px; width:12px; color:#647085; margin-right:3px; }
.card-meta a { white-space:nowrap; }
.card-meta>span { font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.project-language { font-size:10px; background:#f0fbf3; color:#479367; padding:3px 7px; border-radius:20px; }
.project-card .card-top { margin-bottom:9px; }
.project-card>p { min-height:79px; }
.project-card h3 { margin-bottom:7px; }
.snapshot-note { font-size:9px; text-align:right; color:#829b8c; margin-top:6px; }
.topics-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; }
.topic-card { border:1px solid #e2efe7; border-radius:10px; overflow:hidden; background:#ffffffed; box-shadow:0 6px 15px #297a3808; transition:transform .16s,box-shadow .16s; }
.topic-cover { height:80px; background:#093d2a; position:relative; overflow:hidden; }
.topic-cover>img { display:block; width:100%; height:100%; object-fit:cover; }
.topic-cover:after { content:""; position:absolute; inset:0; background:linear-gradient(30deg,#00673244,transparent); }
.topic-cover.apache-cover { background:#c5ead2 url('/assets/home/mountains.webp') center/cover; }
.apache-cover>img { object-fit:contain; width:70%; padding:13px; margin:auto; transform:rotate(18deg); }
.topic-body { padding:10px 12px 11px; }
.topic-body h3 { font-size:13px; line-height:1.4; margin-bottom:5px; }
.topic-body p { font-size:11px; color:#7e8998; line-height:1.5; min-height:32px; }
.topic-body>span { display:block; font-size:11px; color:#65758a; margin-top:6px; }
.library-strip { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 21px; border:1px solid #daebe0; background:#edf7f0aa; border-radius:10px; }
.library-strip>div { display:flex; gap:13px; align-items:center; }
.library-strip h2 { font-size:16px; font-weight:650; color:#285d42; }
.library-strip p { color:#708677; font-size:11px; margin-top:3px; }
.library-strip nav { display:flex; gap:20px; white-space:nowrap; font-size:11px; color:#267d50; }
.how-panel { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) 1.2fr; gap:12px; background:#ffffffdb; border:1px solid #ebf4ee; border-radius:12px; padding:19px 17px 15px; min-height:126px; }
.how-step { display:flex; gap:12px; align-items:flex-start; position:relative; }
.step-number { display:flex; align-items:center; justify-content:center; height:33px; width:33px; border-radius:50%; background:#c9efd7; color:#167a4b; font-size:18px; font-weight:700; flex-shrink:0; }
.how-step .icon { width:26px; height:26px; margin-bottom:6px; }
.how-step h3 { font-size:12px; font-weight:650; color:#204a38; margin-bottom:5px; }
.how-step p { font-size:10px; color:#7a8594; line-height:1.65; }
.step-arrow { position:absolute; top:3px; right:0; color:#59af81; }
.how-step:nth-child(4) .step-arrow { display:none; }
.how-landscape { display:flex; flex-direction:column; justify-content:flex-end; text-align:right; background:url('/assets/home/mountains.webp') 66% 50%/cover; color:#458668; margin:-32px -17px -15px 0; padding:40px 20px 15px 0; border-radius:0 12px 12px 0; }
.how-landscape strong { font-size:15px; font-weight:500; }
.how-landscape span { font-size:10px; }
.how-landscape small { font-size:8px; margin-top:5px; white-space:nowrap; }
.site-footer { border-top:1px solid #deeee3; background:#fbfcfd; padding-top:22px; }
.footer-grid { display:grid; grid-template-columns:1.35fr 1.05fr 1.45fr 1fr; gap:26px; padding-bottom:20px; }
.site-footer .brand>img { width:39px; height:39px; }
.site-footer .brand strong { font-size:19px; }
.site-footer .brand small { font-size:7px; letter-spacing:1px; }
.footer-about p { color:#7a8596; font-size:11px; line-height:1.8; margin-top:12px; }
.footer-group { border-left:1px solid #e7edeb; padding-left:25px; }
.footer-grid h2 { font-size:13px; margin-bottom:13px; font-weight:650; }
.footer-group>div { display:flex; flex-wrap:wrap; gap:9px 17px; font-size:11px; color:#657288; }
.footer-mission { border-left:1px solid #e7edeb; padding-left:20px; background:url('/assets/home/mountains.webp') bottom center/100% auto no-repeat; }
.footer-mission h2 { margin-bottom:4px; font-size:12px; }
.footer-mission p { font-size:10px; color:#8893a2; }
.footer-bottom { border-top:1px solid #e4ece8; padding:9px 0 12px; font-size:9px; color:#83909e; display:flex; justify-content:space-between; gap:16px; }
.footer-bottom>span>a { padding-left:14px; }
.footer-bottom>div { display:flex; gap:18px; }
.ad-slot[hidden] { display:none; }
.ad-slot:not([hidden]) { min-height:120px; max-width:1250px; margin:24px auto; overflow:hidden; }
.inner-page { padding:28px 0 60px; min-height:70vh; }
.breadcrumbs { font-size:12px; color:#718a7c; margin-bottom:25px; }
.inner-page h1 { font-size:34px; color:var(--deep); }
.page-intro { font-size:15px; color:#75857b; margin:10px 0 25px; max-width:950px; }
.inner-page .docs-grid,.inner-page .projects-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.inner-page .content-card>p { min-height:40px; }
.inner-page .topics-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.inner-page .topic-cover { height:145px; }
.inner-page .topic-body p { min-height:0; }
.filter-links { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:20px; }
.filter-links a { border:1px solid #d2e6da; border-radius:20px; padding:6px 15px; background:#fff; color:#35825c; }
.content-note { padding:13px 18px; border-left:3px solid #6bb58c; background:#edf7f0; color:#607968; margin-bottom:22px; font-size:13px; }
.article-panel { max-width:880px; border:1px solid var(--line); border-radius:12px; padding:28px; background:#fff; font-size:15px; line-height:1.8; }
.article-panel h2 { font-size:21px; margin:25px 0 10px; }
.article-panel p { color:#617468; margin-bottom:15px; }
.article-panel dl { display:grid; grid-template-columns:150px 1fr; gap:10px; background:#f2f8f4; padding:20px; border-radius:8px; margin:20px 0; }
.article-panel dt { color:#728678; }
.article-panel dd { margin:0; }
.detail-summary { display:flex; gap:20px; align-items:center; margin-bottom:20px; }
.detail-summary img { object-fit:contain; }
.detail-actions { display:flex; gap:20px; flex-wrap:wrap; align-items:center; margin:22px 0; color:var(--green); }
.subheading { font-size:22px; margin:30px 0 18px; }
.resource-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.resource-list>a { background:#fff; border:1px solid var(--line); border-radius:9px; padding:20px; overflow-wrap:anywhere; }
.resource-list h2 { font-size:19px; margin-bottom:8px; }
.resource-list p { color:#74877b; margin-bottom:12px; }
.resource-list span { color:var(--green); font-size:12px; }
.empty-state { background:#edf8f1; border:1px solid #d9ecdf; border-radius:12px; padding:25px; }
.empty-state p { margin:10px 0 20px; color:#6b8173; }
.page-search { max-width:750px; margin-bottom:20px; }
#search-status { margin-bottom:20px; color:#62806c; }
@media(min-width:1400px) { .hero-inner { min-height:450px; }.hero-copy { padding-top:40px; }.hero h1 { font-size:47px; }.hero h1 span { font-size:57px; }.hero-description { font-size:17px; }.metrics { margin-top:29px; }.metrics strong { font-size:24px; }.hero-art { margin-left:-25px; }.content-card>p { min-height:79px; } }
@media(max-width:1199px) { .shell { width:calc(100% - 64px); }.header-inner { gap:20px; }.brand strong { font-size:22px; }.site-header nav { gap:20px; }.site-header nav>a { font-size:12px; }.nav-search { width:235px; }.hero-copy { padding-left:15px; padding-top:32px; }.hero-inner { grid-template-columns:1.12fr 1fr; min-height:398px; }.hero h1 { font-size:38px; }.hero h1 span { font-size:47px; }.hero-promise { font-size:15px; }.hero-description { font-size:13px; }.hero-search input { font-size:11px; }.hot-search { gap:6px; }.hot-search a { font-size:9px; padding:2px 7px; }.hot-search strong { font-size:10px; }.metrics { gap:24px; margin-top:23px; }.metrics .icon { width:31px; height:31px; }.metrics strong { font-size:21px; }.metrics small { font-size:10px; }.hero-art { margin-left:-25px; }.art-note { font-size:13px; }.art-label { font-size:14px; padding:8px 14px; }.label-github { right:8%; font-size:12px; }.art-words { right:-4px; }.art-words span { font-size:12px; padding:4px 11px; }.categories-grid { gap:10px; }.category-card { padding-inline:5px; }.category-card h3 { font-size:13px; }.category-card p { font-size:11px; }.category-foot { gap:4px; }.category-foot small { font-size:8px; }.docs-grid,.projects-grid { gap:10px; }.content-card { padding:12px 11px; }.product-logo { width:38px; height:38px; }.status { font-size:9px; padding:3px 6px; }.content-card h3 { font-size:12px; }.content-card>p { font-size:11px; min-height:74px; }.tags { gap:4px; min-height:43px; margin-bottom:9px; }.tags span { font-size:9px; padding:2px 5px; }.card-meta { font-size:10px; }.card-meta .icon { display:none; }.card-top { gap:3px; }.topics-grid { gap:12px; }.topic-cover { height:72px; }.topic-body { padding:9px; }.topic-body h3 { font-size:12px; }.topic-body p { font-size:10px; }.topic-body>span { font-size:10px; }.library-strip nav { gap:12px; font-size:10px; }.library-strip p { max-width:440px; }.how-panel { grid-template-columns:repeat(4,minmax(0,1fr)) 1fr; gap:9px; padding:16px 15px 12px; }.how-step { gap:9px; }.step-number { width:29px; height:29px; font-size:16px; }.how-step h3 { font-size:11px; }.how-step p { font-size:9px; }.how-landscape { margin-right:-15px; margin-bottom:-12px; padding-right:13px; }.how-landscape small { font-size:7px; white-space:normal; }.footer-grid { gap:20px; }.footer-group { padding-left:20px; }.footer-about p { font-size:10px; }.footer-group>div { gap:9px 12px; font-size:10px; } }
@media(max-width:1000px) { .site-header nav { gap:15px; }.header-inner { gap:15px; }.nav-search { width:190px; }.brand strong { font-size:20px; }.brand small { font-size:7px; letter-spacing:1px; }.brand>img { width:40px; height:40px; }.hero-inner { grid-template-columns:1.2fr 1fr; }.hero h1 { font-size:35px; }.hero h1 span { font-size:42px; }.hero-description br { display:none; }.hero-copy { padding-left:5px; }.metrics { gap:20px; }.metrics>div { gap:8px; }.metrics strong { font-size:19px; }.metrics small { font-size:9px; }.art-label { padding:7px 10px; font-size:12px; }.art-words { display:none; }.art-note { right:-10px; }.categories-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.category-card { padding:17px 10px 12px; }.category-card h3 { font-size:14px; }.category-card p { font-size:12px; }.category-foot small { font-size:10px; }.docs-grid,.projects-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.content-card { padding:17px; }.content-card h3 { font-size:15px; }.content-card>p { font-size:13px; min-height:65px; }.tags { min-height:21px; }.tags span { font-size:10px; }.card-meta { font-size:11px; }.status { font-size:10px; }.topics-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.topic-cover { height:105px; }.topic-body { padding:12px; }.topic-body h3 { font-size:14px; }.topic-body p { font-size:12px; min-height:0; }.topic-body>span { font-size:11px; }.library-strip { align-items:start; flex-direction:column; gap:12px; }.library-strip p { max-width:none; }.library-strip nav { font-size:12px; gap:20px; }.how-panel { grid-template-columns:repeat(4,minmax(0,1fr)); padding:20px; }.how-landscape { display:none; }.how-step p { font-size:10px; }.how-step h3 { font-size:12px; }.footer-grid { grid-template-columns:1.4fr 1fr 1fr; }.footer-mission { display:none; } }
@media(max-width:800px) { .shell { width:calc(100% - 40px); }.site-header { height:66px; }.header-inner { gap:15px; }.site-header nav { display:none; position:absolute; top:66px; left:0; right:0; background:#fff; padding:16px 22px 20px; box-shadow:0 12px 20px #0c523310; grid-template-columns:repeat(4,1fr); gap:14px; }.site-header nav.is-open { display:grid; }.site-header nav>a { padding:8px 0; }.site-header nav>a[aria-current]:after { bottom:0; }.menu-toggle { display:block; }.nav-search { width:210px; margin-left:auto; }.hero-inner { min-height:380px; grid-template-columns:1.4fr 1fr; }.hero-copy { padding:30px 0 25px; }.hero h1 { font-size:32px; }.hero h1 span { font-size:38px; }.hero-promise { font-size:14px; }.hero-description { font-size:12px; }.hero-search .icon { margin-left:12px; height:19px; width:19px; }.hero-search button { padding:8px 20px; min-width:68px; }.hero-search input { padding:10px 7px; }.hot-search { gap:5px; }.metrics { gap:15px; }.metrics>div { gap:6px; }.metrics .icon { height:27px; width:27px; }.metrics strong { font-size:17px; }.metrics small { font-size:8px; }.metrics>div+div:before { left:-8px; }.hero-art { margin-left:-12px; }.hero-illustration { width:130%; right:-50px; }.label-doc { left:10%; top:19%; }.label-github { right:-5%; top:38%; font-size:11px; }.art-note { bottom:45px; font-size:11px; letter-spacing:2px; }.section-heading h2 { font-size:19px; }.section-heading p { font-size:11px; }.section-heading>a { font-size:11px; }.homepage-content>section { margin-bottom:24px; }.content-card { padding:13px; }.content-card h3 { font-size:13px; }.content-card>p { font-size:12px; min-height:80px; }.tags { min-height:44px; }.how-panel { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }.how-step p { font-size:12px; }.how-step h3 { font-size:14px; }.how-step .icon { margin-bottom:8px; }.step-arrow { right:20px; }.how-step:nth-child(2) .step-arrow { display:none; }.step-number { width:32px; height:32px; }.footer-bottom { flex-direction:column; gap:8px; }.inner-page .docs-grid,.inner-page .projects-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.inner-page .categories-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:540px) { .shell { width:calc(100% - 32px); }.header-inner { gap:10px; }.brand>img { width:39px; height:39px; }.brand strong { font-size:21px; }.brand small { font-size:7px; }.nav-search { width:34px; border:0; background:transparent; position:relative; overflow:visible; }.nav-search .icon { margin-left:5px; width:19px; height:19px; }.nav-search input { position:absolute; opacity:0; right:0; width:34px; cursor:pointer; }.nav-search:focus-within { position:absolute; left:16px; right:55px; width:auto; z-index:5; height:42px; background:#fff; border:1px solid #b7d6c2; }.nav-search:focus-within input { position:static; opacity:1; width:100%; cursor:text; }.nav-search:focus-within button { position:static; width:auto; height:auto; margin:0; clip:auto; overflow:visible; padding:8px 12px; }.menu-toggle { font-size:24px; }.hero-inner { display:block; min-height:0; }.hero-art { display:none; }.hero-copy { padding:30px 0 25px; }.hero h1 { font-size:35px; line-height:1.22; letter-spacing:.7px; }.hero h1 span { font-size:41px; letter-spacing:.5px; }.hero-promise { font-size:15px; margin-top:12px; }.hero-description { font-size:13px; line-height:1.7; margin-top:7px; margin-bottom:17px; }.hero-search { height:49px; }.hero-search input { font-size:11px; }.hero-search button { min-width:70px; }.hot-search { margin-top:14px; gap:6px; }.hot-search a { font-size:10px; }.hot-search strong { font-size:10px; }.metrics { justify-content:space-between; gap:10px; margin-top:24px; }.metrics>div { gap:7px; }.metrics .icon { width:26px; height:26px; }.metrics strong { font-size:18px; }.metrics small { font-size:8px; }.metrics>div+div:before { display:none; }.homepage-content { padding-top:23px; }.section-heading { gap:8px; align-items:flex-start; margin-bottom:13px; }.section-heading>div { gap:8px; padding-left:8px; }.section-heading>div>.icon { width:21px; height:21px; }.section-heading h2 { font-size:18px; }.section-heading p { font-size:10px; max-width:240px; line-height:1.6; }.section-heading>a { font-size:10px; gap:3px; margin-top:4px; }.section-heading>a .icon { width:13px; height:13px; }.categories-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }.category-card { padding:17px 9px 13px; }.category-card h3 { font-size:14px; }.category-card p { font-size:12px; }.category-card:last-child { grid-column:1 / -1; }.category-card:last-child .category-foot { margin-top:7px; }.category-foot small { font-size:10px; }.docs-grid,.projects-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }.content-card { padding:12px; border-radius:9px; }.card-top { gap:3px; min-height:39px; margin-bottom:10px; }.product-logo { width:35px; height:35px; }.status { font-size:8px; padding:3px 5px; }.content-card h3 { font-size:12px; min-height:35px; margin-bottom:7px; }.content-card>p { font-size:11px; min-height:90px; margin-bottom:10px; line-height:1.6; }.tags { gap:4px; margin-bottom:9px; min-height:42px; }.tags span { font-size:9px; padding:2px 5px; }.card-meta { font-size:9px; gap:4px; }.project-language { font-size:9px; padding:3px 5px; }.project-card h3 { min-height:20px; }.project-card>p { min-height:89px; }.snapshot-note { font-size:8px; }.topics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.topic-cover { height:79px; }.topic-body { padding:10px; }.topic-body h3 { font-size:12px; }.topic-body p { font-size:10px; min-height:30px; }.topic-body>span { font-size:10px; }.library-strip { padding:15px; }.library-strip>div { gap:9px; align-items:flex-start; }.library-strip h2 { font-size:15px; }.library-strip p { font-size:11px; line-height:1.7; }.library-strip nav { gap:10px; font-size:10px; flex-wrap:wrap; }.how-panel { padding:17px 13px; gap:23px 15px; }.how-step { gap:8px; }.step-number { width:24px; height:24px; font-size:14px; }.how-step .icon { width:23px; height:23px; }.how-step h3 { font-size:11px; }.how-step p { font-size:9px; }.step-arrow { right:0; font-size:12px; }.footer-grid { grid-template-columns:1fr 1fr; gap:20px; }.footer-about { grid-column:1 / -1; }.footer-about p { font-size:11px; }.footer-group { padding:0; border:0; }.footer-group>div { font-size:11px; gap:9px 14px; }.footer-bottom { font-size:8px; }.footer-bottom>span>a { display:block; padding:3px 0 0; }.footer-bottom>div { flex-wrap:wrap; gap:14px; }.inner-page h1 { font-size:27px; }.page-intro { font-size:14px; }.inner-page .categories-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.inner-page .docs-grid,.inner-page .projects-grid,.inner-page .topics-grid,.resource-list { grid-template-columns:1fr; }.inner-page .content-card h3 { font-size:17px; min-height:0; }.inner-page .content-card>p { min-height:0; font-size:13px; }.inner-page .tags { min-height:0; }.inner-page .card-meta { font-size:12px; }.inner-page .status { font-size:10px; }.article-panel { padding:20px; font-size:14px; }.article-panel dl { grid-template-columns:1fr; gap:4px; padding:14px; }.article-panel dd { margin-bottom:8px; }.detail-actions { gap:16px; }.content-note { font-size:12px; }.filter-links { gap:8px; }.filter-links a { padding:5px 10px; font-size:12px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }
/* Blend the lightweight illustration into the mint hero without a rectangular edge. */
.hero-illustration { mask-image:linear-gradient(90deg,transparent,#000 15%,#000 88%,transparent),linear-gradient(0deg,transparent,#000 13%,#000 88%,transparent); mask-composite:intersect; }
.legacy-stat-widget { text-align:center; font-size:10px; color:#809086; }
.version-note { display:block; font-size:9px; color:#879489; margin:-4px 0 10px; line-height:1.4; }

.pagination{display:flex;justify-content:center;gap:10px;margin:28px 0;flex-wrap:wrap}.pagination a{display:grid;place-items:center;min-width:40px;min-height:40px;border:1px solid #d8e9e0;border-radius:8px;background:#fff}.pagination a[aria-current="page"]{background:#168554;color:#fff;border-color:#168554}

.sponsor-card .card-meta>span { flex-shrink:0; }