:root{--page-bg:#f4f7fc;--surface:#fff;--text:#171b27;--muted:#7d8496;--line:#e8ecf4;--primary:#3567f6;--primary-soft:#edf2ff;--radius-sm:12px;--radius-md:18px;--radius-lg:26px;--shadow:0 18px 48px #27385f14;--content-width:1360px;--motion-fast:.2s;--motion-medium:.3s;--motion-slow:.6s;--ease-standard:cubic-bezier(.4, 0, .2, 1);--ease-spring-avatar:cubic-bezier(.69, .39, 0, 1.21);--ease-spring-flip:cubic-bezier(0, 0, 0, 1.29)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--text);background:radial-gradient(circle at 12% 5%, #4c82ff14, transparent 26rem), radial-gradient(circle at 90% 14%, #6df1c914, transparent 24rem), var(--page-bg);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,-apple-system,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}:where(a,button,input,textarea,select,[tabindex]):focus-visible{outline-offset:3px;outline:3px solid #3567f657}.site-shell{width:min(calc(100% - 40px), var(--content-width));margin-inline:auto}[data-reveal]{opacity:0;transition:opacity .58s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0s), transform .58s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0s);transform:translateY(22px)}[data-reveal].is-revealed{opacity:1;transform:none}.site-header{z-index:30;height:56px;box-shadow:none;backdrop-filter:none;background:0 0;border-bottom:1px solid #0000;transition:background-color .26s,border-color .26s,box-shadow .26s,backdrop-filter .26s;position:sticky;top:0}.site-header.is-scrolled{backdrop-filter:blur(16px)saturate(145%);background:#ffffffeb;border-bottom-color:#e4e9f3c7;box-shadow:0 8px 24px #23304e0e}.header-inner{justify-content:space-between;align-items:center;gap:28px;height:100%;display:flex}.brand{letter-spacing:-.025em;white-space:nowrap;align-items:center;gap:9px;font-size:16px;display:inline-flex}.brand-label-stack{min-width:0;display:grid;overflow:hidden}.brand-label-stack>*{white-space:nowrap;text-overflow:ellipsis;opacity:1;min-width:0;transition:opacity .25s var(--ease-standard), transform .25s var(--ease-standard);grid-area:1/1;overflow:hidden;transform:none}[data-header-context-title]{opacity:0;transform:translateY(100%)}.brand-grid{grid-template-columns:repeat(2,1fr);gap:2.5px;width:20px;height:20px;display:grid;transform:rotate(2deg)}.brand-grid i{background:#212635;border-radius:2.5px;display:block}.header-actions{align-items:center;gap:3px;margin-left:auto;display:flex}.icon-button,.menu-button,.shop-button{color:#343a4a;box-shadow:none;cursor:pointer;background:0 0;border-radius:10px;place-items:center;padding:0;transition:color .2s,background-color .2s,border-color .2s,transform .2s;display:grid}.icon-button{border:0;width:40px;height:40px}.icon-button svg{fill:currentColor;width:22px;height:22px}.menu-button{border:0;align-content:center;gap:3px;width:36px;height:36px;display:none}.menu-button span{background:currentColor;border-radius:99px;width:17px;height:2px}.shop-button{white-space:nowrap;background:#ffffff94;border:1px solid #dce1ebdb;gap:7px;width:auto;height:38px;padding:0 12px 0 9px;font-size:13px;font-weight:720;display:inline-flex}.shop-button img{object-fit:contain;width:62px;height:17px}@media (hover:hover) and (pointer:fine){.icon-button:hover,.menu-button:hover{color:var(--primary);background:#3567f617;transform:translateY(-1px)}.shop-button:hover{color:#d94b14;background:#ff661f14;border-color:#ff5b1f3d;transform:translateY(-1px)}}[hidden]{display:none!important}body.search-open{overflow:hidden}.search-overlay{z-index:100;backdrop-filter:blur(16px)saturate(80%);background:#f8faffbd;justify-content:center;align-items:flex-start;padding:128px 20px 40px;display:flex;position:fixed;inset:0}.search-dialog{width:min(640px,100%);max-height:calc(100vh - 168px);color:var(--text);background:#fffffff5;border:1px solid #e2e7f1;border-radius:16px;overflow:hidden;box-shadow:0 28px 80px #2c3c6029}.search-dialog-header{border-bottom:1px solid #e8ebf2;justify-content:space-between;align-items:center;min-height:57px;padding:13px 20px;display:flex}.search-dialog-header strong{font-size:16px}.search-dialog-header button{color:#697284;cursor:pointer;background:0 0;border:0;border-radius:9px;place-items:center;width:32px;height:32px;font-size:22px;display:grid}.search-dialog-header button:hover{background:#f1f4f9}.search-dialog-body{max-height:calc(100vh - 225px);padding:18px 20px 20px;overflow-y:auto}.search-field{background:#f2f5fa;border:1px solid #dfe5ef;border-radius:10px;align-items:center;gap:10px;height:42px;padding:0 12px;transition:all .2s;display:flex}.search-field:focus-within{background:#fff;border-color:#6f8fff;box-shadow:0 0 0 3px #3567f61a}.search-field svg{color:#70798c;flex:none;width:18px;height:18px}.search-field input{color:#2e3544;width:100%;font:inherit;background:0 0;border:0;outline:0;font-size:14px}.search-field input::placeholder{color:#939baa}.search-shortcuts{color:#959dab;text-align:center;margin:15px 0 0;font-size:12px}.search-shortcuts kbd{color:inherit;font:inherit;background:0 0;border:0}.search-results>p:first-child{color:#7d8595;margin:17px 4px 10px;font-size:12px}.search-result-list{gap:9px;display:grid}.search-result-list>a{background:#fff;border:1px solid #e3e7f0;border-radius:13px;grid-template-columns:78px minmax(0,1fr);align-items:center;gap:14px;padding:12px;transition:all .18s;display:grid}.search-result-list>a:hover{background:#f9faff;border-color:#b9c7fb;transform:translateY(-1px)}.search-result-list img{object-fit:cover;background:#1785f4;border-radius:10px;width:78px;height:78px}.search-result-copy{gap:7px;min-width:0;display:grid}.search-result-title{align-items:center;gap:10px;display:flex}.search-result-title strong{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:14px;overflow:hidden}.search-result-title small{color:var(--primary);background:var(--primary-soft);border-radius:6px;flex:none;margin-left:auto;padding:4px 7px;font-size:9px}.search-result-description{color:#7e8697;white-space:nowrap;text-overflow:ellipsis;font-size:11px;line-height:1.55;overflow:hidden}.search-result-meta{color:#969eac;flex-wrap:wrap;gap:5px 8px;font-size:9px;display:flex}.search-result-meta b{color:#5576ec;background:#edf1ff;border-radius:5px;padding:3px 5px;font-weight:650}.search-empty{color:#9199a8;text-align:center;margin:20px 0 6px;font-size:12px}@media (width<=760px){.search-overlay{padding:76px 12px 20px}.search-dialog{max-height:calc(100vh - 96px)}.search-dialog-body{max-height:calc(100vh - 153px);padding-inline:14px}.search-result-list>a{grid-template-columns:62px minmax(0,1fr);padding:10px}.search-result-list img{width:62px;height:62px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}[data-reveal]{opacity:1;transition:none;transform:none}}@view-transition{navigation:auto}.site-header{view-transition-name:site-header}@keyframes page-transition-out{to{opacity:0;transform:translateY(-8px)}}@keyframes page-transition-in{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}::view-transition-old(root){animation:.24s ease-in both page-transition-out}::view-transition-new(root){animation:.5s ease-out .22s both page-transition-in}::view-transition-old(site-header),::view-transition-new(site-header){animation-duration:.3s}[data-page-enter]{opacity:1;transform:none}.motion-enhanced:not(.is-page-ready) [data-page-enter=home]{opacity:0;transform:translateY(14px)}.motion-enhanced:not(.is-page-ready) [data-page-enter=hero]{opacity:0;transform:translateY(10px)}.motion-enhanced:not(.is-page-ready) [data-page-enter=content]{opacity:0;transform:translateY(18px)}.motion-enhanced.is-page-ready [data-page-enter=home],.motion-enhanced.is-page-ready [data-page-enter=hero]{transition:opacity .5s ease-out,transform .5s ease-out}.motion-enhanced.is-page-ready [data-page-enter=content]{transition:opacity .5s ease-out .12s,transform .5s ease-out .12s}.article-hero-backdrop{opacity:.8;transition:opacity .5s ease-out}.motion-enhanced:not(.is-page-ready) .article-hero-backdrop{opacity:0}@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}.site-header,.tutorial-cover,.article-hero{view-transition-name:none!important}[data-page-enter],.motion-enhanced:not(.is-page-ready) [data-page-enter]{opacity:1;transition:none;transform:none}.article-hero-backdrop,.motion-enhanced:not(.is-page-ready) .article-hero-backdrop{opacity:.8;transition:none}}
