@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap');

:root{--ink:#111827;--muted:#6b7280;--soft:#9ca3af;--line:#e5e7eb;--brand:#3167f4;--brand-dark:#2450c7;--brand-soft:#edf3ff;--bg:#f7f8fa;--card:#fff;--success:#1f9d62}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Manrope,"Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}
.site-header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(229,231,235,.82)}
.header-inner{max-width:1180px;height:72px;padding:0 28px;margin:auto;display:flex;align-items:center;justify-content:space-between}
.public-header-inner{position:relative;justify-content:center}.public-header-inner .brand{font-size:28px;font-weight:900;letter-spacing:-.06em}.public-header-inner .brand span{font-weight:800}
.search-trigger{position:absolute;right:28px;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:1px solid var(--line);border-radius:12px;color:var(--muted);background:rgba(255,255,255,.78);cursor:pointer;transition:color .2s,background .2s,border-color .2s,transform .2s}.search-trigger svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.search-trigger:hover{border-color:#cbd6f5;color:var(--brand);background:#f8faff;transform:translateY(-1px)}
.brand{font-size:19px;font-weight:800;letter-spacing:-.045em;color:var(--ink);text-decoration:none}.brand span{font-weight:600;color:var(--brand);margin-left:3px}
nav{display:flex;gap:24px}nav a{color:var(--muted);font-size:13px;font-weight:600;text-decoration:none}nav a:hover{color:var(--brand)}
.container{width:min(1180px,100% - 56px);margin:0 auto}
.hero{padding:96px 0 54px}.eyebrow{display:inline-flex;align-items:center;margin:0 0 18px;padding:5px 11px;border:1px solid #dbe5ff;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-size:11px;font-weight:800;letter-spacing:.15em}.hero h1{max-width:820px;margin:0;font-size:clamp(38px,6.4vw,72px);line-height:1.08;letter-spacing:-.075em;font-weight:800}.hero p:last-child{max-width:650px;margin:22px 0 0;color:var(--muted);font-size:17px;line-height:1.8}
.post-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.post-card,.article-card{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:0 10px 34px rgba(17,24,39,.035)}.post-card{min-height:220px;padding:26px 27px;display:flex;flex-direction:column;transition:transform .2s,border-color .2s,box-shadow .2s}.post-card:hover{transform:translateY(-3px);border-color:#cfdcff;box-shadow:0 16px 42px rgba(49,103,244,.1)}.post-category{display:inline-flex;align-self:flex-start;padding:4px 10px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-size:12px;font-weight:700}.post-card h2{margin:16px 0 9px;font-size:21px;line-height:1.4;letter-spacing:-.035em}.post-card h2 a{color:var(--ink);text-decoration:none}.post-card h2 a:hover{color:var(--brand)}.post-excerpt{margin:0;color:#667085;font-size:14px;line-height:1.8;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.post-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:auto;padding-top:19px;color:var(--soft);font-size:12px}.post-meta span+span{position:relative;padding-left:14px}.post-meta span+span:before{content:"";position:absolute;left:0;top:50%;width:3px;height:3px;border-radius:50%;background:#cbd5e1;transform:translateY(-50%)}
.load-more{width:max-content;margin:28px auto 62px;padding:9px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:13px;cursor:pointer}.load-more:hover{border-color:#cbd6f5;color:var(--brand)}.load-more.is-loading{color:var(--brand)}.load-more.is-done{color:#b0b8c6}.noscript{text-align:center;color:var(--muted)}
.article-container{width:min(1000px,100% - 56px);padding:58px 0 80px}.article-card{padding:clamp(28px,5vw,64px)}.article-card h1{margin:0;font-size:clamp(34px,5.3vw,62px);line-height:1.15;letter-spacing:-.075em;font-weight:800}.article-content{padding-top:34px;margin-top:32px;border-top:1px solid var(--line);font-size:18px;line-height:1.4;overflow-wrap:anywhere}.article-content p{margin:0 0 .7em}.article-content h2,.article-content h3,.article-content h4{line-height:1.35;letter-spacing:-.035em;margin-top:1.7em}.article-content img{display:block;max-width:100%;height:auto!important;margin:26px auto;border-radius:12px}.article-content a{color:var(--brand)}.article-content blockquote{margin:1.5em 0;padding:14px 20px;border-left:4px solid var(--brand);background:#f3f6ff;color:#5e687a}.article-content pre{padding:18px;overflow:auto;background:#111827;color:#eef3ff;border-radius:12px}.article-content code{font-family:"DM Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.site-footer{max-width:1180px;width:calc(100% - 56px);margin:auto;padding:24px 0 48px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;display:flex;justify-content:space-between;gap:12px}.site-footer a{color:inherit}
.search-modal[hidden]{display:none}.search-modal{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:20px}.search-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.4);backdrop-filter:blur(5px)}.search-dialog{position:relative;width:min(680px,100%);max-height:min(760px,calc(100vh - 40px));overflow:auto;padding:34px 34px 28px;border:1px solid rgba(255,255,255,.78);border-radius:24px;background:#fff;box-shadow:0 28px 90px rgba(15,23,42,.25);animation:searchDialogIn .26s cubic-bezier(.2,.75,.25,1) both}.search-close{position:absolute;top:14px;right:15px;width:34px;height:34px;padding:0;border:0;border-radius:50%;color:var(--muted);background:#f3f6fb;font-size:23px;line-height:1;cursor:pointer}.search-close:hover{color:var(--brand);background:#edf3ff}.search-heading{display:flex;align-items:center;gap:14px;margin-bottom:20px}.search-dialog-icon{display:grid;flex:0 0 auto;width:44px;height:44px;place-items:center;border-radius:14px;color:var(--brand);background:var(--brand-soft)}.search-dialog-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.search-dialog h2{margin:0;color:var(--ink);font-size:24px;letter-spacing:-.04em}.search-heading p{margin:5px 0 0;color:var(--muted);font-size:13px}.search-input-wrap{display:flex;align-items:center;gap:10px;padding:7px 8px 7px 14px;border:1px solid #dbe3f0;border-radius:14px;background:#fbfcfe;transition:border-color .2s,box-shadow .2s,background .2s}.search-input-wrap:focus-within{border-color:#7799ff;background:#fff;box-shadow:0 0 0 4px rgba(53,109,243,.11)}.search-input-wrap>svg{flex:0 0 auto;width:19px;height:19px;color:#9aa5b7;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.search-input-wrap input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:14px}.search-input-wrap input::placeholder{color:#aeb8c8}.search-input-wrap button{flex:0 0 auto;min-height:37px;padding:0 16px;border:0;border-radius:10px;color:#fff;background:linear-gradient(135deg,#3167f4,#6659ee);cursor:pointer;font:inherit;font-size:13px;font-weight:800}.search-message{min-height:20px;margin:14px 2px 10px;color:var(--muted);font-size:12px}.search-message.is-error{color:#c44949}.search-results{display:grid;gap:10px}.search-result{display:block;padding:15px 16px;border:1px solid var(--line);border-radius:14px;color:var(--ink);text-decoration:none;transition:border-color .2s,background .2s,transform .2s,box-shadow .2s}.search-result:hover{border-color:#cbd6f5;background:#f8faff;box-shadow:0 8px 22px rgba(49,103,244,.08);transform:translateY(-1px)}.search-result-category{display:inline-flex;margin-bottom:7px;padding:3px 8px;border-radius:999px;color:var(--brand);background:var(--brand-soft);font-size:11px;font-weight:800}.search-result strong{display:block;font-size:16px;line-height:1.45}.search-result-excerpt{display:-webkit-box;margin-top:5px;overflow:hidden;color:var(--muted);font-size:13px;line-height:1.65;-webkit-box-orient:vertical;-webkit-line-clamp:2}.search-result-meta{display:block;margin-top:9px;color:var(--soft);font-size:11px}.search-empty{text-align:center;padding:30px 12px;color:var(--muted);font-size:13px}.search-loading{display:flex;justify-content:center;gap:6px;padding:30px}.search-loading span{width:7px;height:7px;border-radius:50%;background:var(--brand);animation:searchDot 1s ease-in-out infinite}.search-loading span:nth-child(2){animation-delay:.12s}.search-loading span:nth-child(3){animation-delay:.24s}.search-modal-open{overflow:hidden}@keyframes searchDialogIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes searchDot{0%,80%,100%{opacity:.3;transform:scale(.7)}40%{opacity:1;transform:scale(1)}}
@media(max-width:760px){.header-inner{height:62px;padding:0 18px}.brand{font-size:18px}.search-trigger{right:18px;width:38px;height:38px}nav{gap:15px}.container,.article-container{width:calc(100% - 32px)}.hero{padding:62px 0 36px}.hero h1{font-size:clamp(35px,12vw,54px)}.hero p:last-child{font-size:15px}.post-list{grid-template-columns:1fr;gap:14px}.post-card{min-height:0;padding:22px 21px}.post-card h2{font-size:20px}.article-container{padding:24px 0 52px}.article-card{border-radius:16px;padding:26px 20px}.article-card h1{font-size:clamp(32px,10vw,48px)}.article-content{font-size:17px;padding-top:25px;margin-top:25px}.site-footer{display:block;width:calc(100% - 32px)}.site-footer a{display:block;margin-top:5px}}
@media(max-width:560px){.search-modal{padding:12px}.search-dialog{max-height:calc(100vh - 24px);padding:28px 18px 18px;border-radius:19px}.search-input-wrap{gap:7px;padding-left:11px}.search-input-wrap button{padding:0 12px}.search-result{padding:13px 14px}}
.hero{padding:48px 0 42px}
@media(max-width:760px){.hero{padding:38px 0 30px}}
@media(max-width:760px){.public-header-inner .brand{font-size:24px}}
.post-card{position:relative;overflow:hidden}
.post-card-enter{animation:postCardReveal .82s cubic-bezier(.2,.75,.25,1) var(--card-delay,0ms) both}
.post-card-enter:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.72) 48%,transparent 68%);transform:translateX(-120%);animation:postCardSheen .9s ease-out calc(var(--card-delay,0ms) + 120ms) both}
.load-more{position:relative;overflow:hidden;min-width:132px;text-align:center;transition:transform .25s,box-shadow .25s,border-color .25s}.load-more-content{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:8px}.load-more.is-loading{border-color:transparent;color:#fff;background:linear-gradient(115deg,#2563eb,#7c3aed,#ec4899,#2563eb);background-size:260% 100%;animation:loadMoreGradient 2.2s linear infinite;box-shadow:0 8px 28px rgba(87,82,218,.28)}.load-more.is-loading:before{content:"";position:absolute;inset:1px;border-radius:inherit;border:1px solid rgba(255,255,255,.34);pointer-events:none}.load-more-spinner{width:13px;height:13px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:loadMoreSpin .7s linear infinite}.load-more.is-done{min-width:150px}.load-more:not(.is-loading):not(.is-done):hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(49,103,244,.12)}
@keyframes postCardReveal{0%{opacity:0;transform:translateY(28px) scale(.96) rotateX(-5deg);filter:blur(6px)}65%{opacity:1;transform:translateY(-5px) scale(1.01) rotateX(0);filter:blur(0)}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes postCardSheen{0%{transform:translateX(-120%);opacity:0}25%{opacity:1}100%{transform:translateX(120%);opacity:0}}
@keyframes loadMoreGradient{0%{background-position:0 50%}100%{background-position:260% 50%}}
@keyframes loadMoreSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.post-card-enter,.post-card-enter:after,.load-more.is-loading,.load-more-spinner{animation:none}.post-card-enter{opacity:1;transform:none;filter:none}}
@media(prefers-reduced-motion:reduce){.search-dialog,.search-loading span{animation:none}.search-trigger,.search-result{transition:none}}
.article-card{position:relative;overflow:hidden;animation:detailCardIn .86s cubic-bezier(.2,.75,.25,1) both}
.article-card:before{content:"";position:absolute;top:0;left:0;width:34%;height:3px;border-radius:0 99px 99px 0;background:linear-gradient(90deg,#2563eb,#8b5cf6,#ec4899);animation:detailAccentIn 1.1s ease-out .15s both}
.article-actions{animation:detailRise .6s ease-out .12s both}.article-card h1{animation:detailRise .75s cubic-bezier(.2,.75,.25,1) .2s both}.article-meta{animation:detailRise .65s ease-out .34s both}.article-content{animation:detailContentIn .8s ease-out .46s both}.article-content img{animation:detailImageIn .8s cubic-bezier(.2,.75,.25,1) .62s both}.article-content img:nth-of-type(2){animation-delay:.76s}.article-content img:nth-of-type(3){animation-delay:.9s}.article-bottom-meta{animation:detailRise .6s ease-out 1s both}
@keyframes detailCardIn{0%{opacity:0;transform:translateY(24px) scale(.985);filter:blur(5px)}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes detailRise{0%{opacity:0;transform:translateY(18px)}100%{opacity:1;transform:translateY(0)}}
@keyframes detailContentIn{0%{opacity:0;transform:translateY(22px)}100%{opacity:1;transform:translateY(0)}}
@keyframes detailImageIn{0%{opacity:0;transform:translateY(18px) scale(.97);filter:blur(4px)}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes detailAccentIn{0%{width:0;opacity:0}100%{width:34%;opacity:1}}
@media(prefers-reduced-motion:reduce){.article-card,.article-card:before,.article-actions,.article-card h1,.article-meta,.article-content,.article-content img,.article-bottom-meta{animation:none;opacity:1;transform:none;filter:none}}
@media(max-width:760px){.site-footer{text-align:center}}
.article-card:before{display:none}