/* Blog-specific layout; typography, navigation and colors inherit the site system. */
.blog-main{padding-top:156px}.blog-intro{padding-bottom:60px;max-width:720px}.blog-eyebrow{font-size:13px;color:var(--text-muted);margin-bottom:20px}.blog-intro h1{font-size:clamp(40px,5vw,64px);line-height:1.13;letter-spacing:-2px}.blog-description{margin-top:24px;max-width:540px;color:var(--text-secondary);font-size:16px;line-height:1.8}.blog-feature{display:grid;grid-template-columns:1.05fr 1fr;border:1px solid var(--line-subtle);border-radius:var(--panel-radius);overflow:hidden;background:var(--surface-section)}.feature-story{padding:38px;display:flex;flex-direction:column;justify-content:center}.blog-meta{display:flex;gap:12px;align-items:center;font-size:11px;color:var(--text-muted)}.feature-story>.blog-meta{justify-content:space-between}.feature-story h2{font-size:28px;line-height:1.4;letter-spacing:-.7px;margin:24px 0 18px}.feature-story>p{font-size:14px;line-height:1.8;color:var(--text-secondary)}.story-bottom{margin-top:34px}.story-read{display:flex;gap:10px;align-items:center;margin-top:22px;font-size:12px}.story-read .icon{transition:transform .25s}.blog-feature:hover .story-read .icon{transform:translate(3px,-3px)}.memory-art{position:relative;overflow:hidden;min-height:400px;background:radial-gradient(ellipse at 55% 90%,#9a704340,transparent 65%),#161719;color:#d9c7a5}.memory-art:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,#0002 3px 4px);pointer-events:none}.memory-orbit{position:absolute;width:300px;height:300px;left:50%;top:49%;border-radius:50%;border:1px solid #e9d6b575;background:repeating-radial-gradient(ellipse at center,transparent 0 6px,#d1ba8d8c 7px,transparent 8px 11px);box-shadow:0 0 45px #c7a97e0d;transform:translate(-50%,-50%) rotate(-35deg) scaleX(.52)}.orbit-two{transform:translate(-50%,-50%) rotate(25deg) scaleX(.52);opacity:.65}.orbit-three{transform:translate(-50%,-50%) rotate(85deg) scaleX(.52);opacity:.5}.art-caption{position:absolute;bottom:28px;left:30px;font:10px/1.8 monospace;letter-spacing:2px;opacity:.6}.blog-collection{padding-top:74px}.blog-collection>h2{font-size:26px;letter-spacing:-.5px;margin-bottom:26px}.blog-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid var(--line-subtle);padding-bottom:18px}.blog-filters{display:flex;gap:6px;flex-wrap:wrap}.blog-filters button{border-radius:5px;padding:9px 15px;color:var(--text-muted);font-size:12px;transition:background .2s,color .2s}.blog-filters button[aria-pressed=true]{background:var(--primary);color:var(--on-primary)}.blog-filters button:hover:not([aria-pressed=true]){background:var(--surface-section);color:var(--text)}.blog-search{display:flex;gap:10px;align-items:center;color:var(--text-muted);border:1px solid var(--line-subtle);border-radius:var(--control-radius);padding:10px 12px;width:230px}.blog-search input{width:100%;min-width:0;background:none;border:0;outline:none;color:var(--text);font:inherit;font-size:12px}.blog-search input::placeholder{color:var(--text-muted)}.blog-result-count{font-size:11px;color:var(--text-muted);padding:18px 0}.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 26px}.blog-card{min-width:0}.blog-card[hidden],.blog-empty[hidden]{display:none}.blog-card>a{display:block;height:100%}.card-art{aspect-ratio:1.65;overflow:hidden;border:1px solid var(--line-subtle);border-radius:6px;position:relative;display:grid;place-items:center;color:#e8e7e4;background:#1d2024}.card-art>div{position:relative;text-align:center;z-index:1;font-size:23px;line-height:1.4;letter-spacing:-.7px;transition:transform .4s}.card-art>.icon{position:absolute;right:16px;bottom:16px;opacity:0;transform:translate(-4px,4px);transition:opacity .25s,transform .25s}.blog-card a:hover .card-art>.icon{opacity:1;transform:none}.blog-card a:hover .card-art>div{transform:scale(1.035)}.art-reason{background:repeating-linear-gradient(115deg,transparent 0 15px,#c9bba620 16px,transparent 17px 25px),radial-gradient(ellipse at 50% 100%,#62523d,#1a1918 75%)}.art-reason>div{font-family:var(--font-metric);letter-spacing:3px}.art-papers{background:repeating-linear-gradient(70deg,transparent 0 28px,#b4c4d412 29px,transparent 30px 48px),#20262b}.art-papers strong{font:60px/1 var(--font-metric);color:#bac9d3}.art-code{background:linear-gradient(135deg,#242822,#121713)}.art-code>div{font-size:15px}.art-code span{display:block;font:48px monospace;color:#b6c6a7}.art-api{background:radial-gradient(ellipse at 50% 120%,#514b66,#1b1922)}.art-api>div{font-size:15px}.art-api span{display:block;font:46px/1.6 monospace;color:#beb4d2}.card-meta{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--text-muted);margin:20px 0 12px}.card-meta>span:first-child{color:var(--text-secondary)}.blog-card h3{font-size:18px;line-height:1.5;letter-spacing:-.3px}.blog-card p{color:var(--text-secondary);font-size:13px;line-height:1.8;margin-top:12px}.blog-empty{padding:70px 20px;text-align:center;color:var(--text-secondary)}.blog-empty button{margin-top:20px;text-decoration:underline}.blog-cta{margin-top:90px;padding:40px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line-subtle)}.blog-cta h2{font-size:26px;letter-spacing:-.6px}body[data-page=blog] .site-footer{margin-top:50px}html[lang=zh-CN] .blog-intro h1{letter-spacing:0}html[lang=zh-CN] .feature-story h2{line-height:1.6}
@media(min-width:1400px){.blog-intro{padding-bottom:70px}.feature-story{padding:44px}}
@media(max-width:900px){.blog-main{padding-top:120px}.feature-story{padding:28px}.feature-story h2{font-size:23px}.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.memory-art{min-height:360px}.memory-orbit{width:250px;height:250px}}
@media(max-width:600px){.blog-main{width:calc(100% - 40px);padding-top:105px}.blog-intro{padding-bottom:38px}.blog-intro h1{font-size:40px;letter-spacing:-1px}.blog-description{font-size:14px}.blog-feature{grid-template-columns:1fr}.memory-art{min-height:250px}.memory-orbit{width:220px;height:220px}.feature-story{padding:25px}.feature-story h2{font-size:23px;margin:18px 0 14px}.story-bottom{margin-top:24px}.blog-collection{padding-top:48px}.blog-toolbar{align-items:stretch;flex-direction:column;gap:16px}.blog-search{width:100%}.blog-filters{gap:4px}.blog-filters button{padding:9px 13px}.blog-grid{grid-template-columns:1fr;gap:36px}.blog-card h3{font-size:20px}.blog-cta{align-items:flex-start;flex-direction:column;margin-top:60px}.blog-cta h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.blog-main *{transition:none!important}}
/* Fifteen stories per page: three columns × five rows on desktop. */
.blog-pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin:52px 0 0}.blog-pagination[hidden]{display:none}.blog-pagination button{width:40px;height:40px;border:1px solid var(--line-subtle);border-radius:5px;color:var(--text-secondary);transition:background .2s,color .2s}.blog-pagination button[aria-current=page]{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}.blog-pagination button:hover:not(:disabled):not([aria-current]){background:var(--surface-section);color:var(--text)}.blog-pagination button:disabled{opacity:.3;cursor:default}.sample-label{font-size:9px}.card-meta{flex-wrap:wrap}.blog-collection{scroll-margin-top:100px}

.blog-pagination button{display:inline-flex;align-items:center;justify-content:center}.pagination-arrow--left{transform:rotate(180deg)}
/* Full editorial cards; lighting uses the shared border-light controller. */
.blog-grid{gap:22px;align-items:stretch}
.blog-card.border-light--card{border-radius:var(--panel-radius);background:var(--surface-section);--border-width:1px;--edge-radius:260px;--edge-proximity:140}
.blog-card>a{padding:16px 16px 18px;border-radius:inherit;display:flex;flex-direction:column;height:100%;min-height:0}
.blog-card>a:focus-visible{outline-offset:5px}
.card-cover{position:relative;overflow:hidden;border-radius:10px;flex:none;isolation:isolate}
.card-cover .card-art{aspect-ratio:16/9;border:0;border-radius:inherit}
.card-tags{position:absolute;inset:auto 14px 14px;display:flex;flex-wrap:wrap;gap:7px;z-index:2;pointer-events:none}
.card-tags>span{display:inline-flex;padding:5px 12px;border-radius:100px;background:rgba(28,28,30,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;font-size:11px;line-height:1.5;font-weight:500}
.blog-card .card-meta{justify-content:flex-start;align-items:center;gap:8px 12px;margin:18px 0 10px;font-size:11px;line-height:1.6;min-height:18px}
.blog-card .card-meta .sample-label{color:var(--text-muted);font-size:10px}
.blog-card h3{font-size:17px;line-height:1.5;font-weight:600;letter-spacing:-.3px;overflow-wrap:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis;min-height:3em;max-height:3em;flex-shrink:0}
.blog-card p{font-size:13px;line-height:1.75;margin-top:10px;overflow-wrap:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;text-overflow:ellipsis;max-height:5.25em;flex-shrink:0}
.blog-card .card-art>.icon{top:14px;bottom:auto;right:14px}
.blog-card a:hover .card-art>div{transform:scale(1.035)}
@media(max-width:900px){.blog-grid{gap:20px}.blog-card>a{padding:14px 14px 18px}.blog-card.border-light--card{border-radius:var(--panel-radius)}}
@media(max-width:600px){.blog-grid{gap:20px}.blog-card h3{font-size:18px}.blog-card p{font-size:14px}.card-tags{inset:auto 12px 12px}}
/* Simple list heading with inline result count and search. */
.blog-list-heading{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 16px;min-width:0}
.blog-list-heading h2{font-size:26px;line-height:1.4;letter-spacing:-.5px;margin:0}
.blog-list-heading .blog-result-count{padding:0;font-size:12px;white-space:nowrap}
.blog-toolbar{margin-bottom:26px}
@media(max-width:600px){.blog-list-heading h2{font-size:24px}.blog-toolbar{margin-bottom:22px}}
/* Listing retains the full 16:10 editorial image frame. */
.card-cover .card-art{aspect-ratio:16/10}
.card-art--image{background:var(--surface-section)}
.card-art--image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* Fixed cover insets; only whole tags that fit are displayed. */
.card-tags{flex-wrap:nowrap;overflow:hidden;min-width:0;min-height:27px}
.card-tags>span{flex:0 0 auto;white-space:nowrap;max-width:none}
.card-tags>span[hidden]{display:none}

/* Featured story shares card corners and fades its visual into the panel. */
.blog-feature{border-radius:var(--panel-radius)}
.blog-feature>:is(.memory-art,.feature-cover){-webkit-mask-image:linear-gradient(to right,#000 62%,transparent 100%);mask-image:linear-gradient(to right,#000 62%,transparent 100%)}
.story-read.button-primary{display:inline-flex;margin-top:22px;font-size:var(--primary-button-font-size);gap:10px}
.art-caption .icon{width:10px;height:10px;vertical-align:middle}
@media(max-width:900px){.blog-feature{border-radius:var(--panel-radius)}}
@media(max-width:600px){.blog-feature>:is(.memory-art,.feature-cover){-webkit-mask-image:linear-gradient(to bottom,#000 52%,transparent 100%);mask-image:linear-gradient(to bottom,#000 52%,transparent 100%)}}

/* Featured local article: image, title, tags, summary and primary CTA. */
.feature-cover{position:relative;min-height:400px;overflow:hidden}
.feature-cover img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.blog-feature .feature-story{justify-content:flex-start}
.blog-feature .feature-story h2{margin-top:0;margin-bottom:20px}
.feature-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.feature-tags>span{padding:5px 12px;border-radius:999px;background:var(--surface-card);color:var(--text);font-size:11px;line-height:1.5;white-space:nowrap}
@media(max-width:900px){.feature-cover{min-height:360px}}
@media(max-width:600px){.feature-cover{min-height:250px}.feature-tags{margin-bottom:16px}}
/* Featured card uses the shared pointer-following border light. */
.blog-feature.border-light--card{overflow:visible;--border-width:1px}
.blog-feature>.feature-cover{border-radius:calc(var(--panel-radius) - 1px);border-top-right-radius:0;border-bottom-right-radius:0}
.blog-feature .feature-tags{margin:22px 0 0;gap:8px;align-items:center}
.blog-feature .feature-tags>span{padding:6px 15px;border:0;border-radius:999px;background:rgba(82,82,87,.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff;font-size:12px;font-weight:400;line-height:1.5}
html[data-theme=light] .blog-feature .feature-tags>span{background:rgba(175,183,196,.42);color:#303640;backdrop-filter:blur(24px) saturate(120%);-webkit-backdrop-filter:blur(24px) saturate(120%)}
@media(max-width:600px){.blog-feature>.feature-cover{border-radius:calc(var(--panel-radius) - 1px);border-bottom-left-radius:0;border-bottom-right-radius:0}.blog-feature .feature-tags>span{padding:5px 12px}}

/* Subtle cover zoom, shared by list cards and the featured article. */
.blog-card .card-art,.blog-feature .feature-cover img{transition:transform .55s cubic-bezier(.2,.65,.3,1);transform-origin:center}
@media(hover:hover){
.blog-card:hover .card-art,.blog-feature:hover .feature-cover img{transform:scale(1.035)}
.blog-card a:hover .card-art>div{transform:none}
}
@media(prefers-reduced-motion:reduce){
.blog-card .card-art,.blog-feature .feature-cover img{transition:none!important;transform:none!important}
}

/* Match the inset image clip to the panel outline, including smooth corners. */
@supports(corner-shape:superellipse(1.3)){.blog-search{corner-shape:superellipse(1.3)}.blog-feature>.feature-cover{corner-shape:inherit}}

/* Shared ambient-light treatment for featured panels and article covers. */
:root{--cover-glow-opacity:.36;--cover-glow-blur:42px;--cover-glow-spread:-6px;--cover-glow-saturation:1.2}
html[data-theme=light]{--cover-glow-opacity:.22}
.blog-feature-shell{position:relative;isolation:isolate}
:is(.blog-feature-shell,.article-main .article-cover)::before{content:"";display:block;position:absolute;inset:var(--cover-glow-spread);height:auto;z-index:-1;border-radius:inherit;pointer-events:none;background:var(--cover-glow-image) center top / cover no-repeat;filter:blur(var(--cover-glow-blur)) saturate(var(--cover-glow-saturation));opacity:var(--cover-glow-opacity);transform:none;-webkit-mask-image:none;mask-image:none}
@media(max-width:650px){:root{--cover-glow-blur:28px;--cover-glow-spread:-3px}}
