/* fexumo editorial theme */
:root {
  --font-head: "Space Grotesk", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", ui-sans-serif, system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "PingFang SC", "Microsoft YaHei", monospace;
  --font-size-scale:.82;
  --background:#f5f5f5; --foreground:#0c0a09; --card:#fff;
  --primary:#292524; --primary-foreground:#fff;
  --secondary:#f0efed; --panel:#f0efed; --content:#3f3d3a;
  --muted-foreground:#777169; --border:#e7e5e4; --hairline-strong:#d6d3d1;
  --code-bg:#fbf1c7; --code-border:#e7e5e4;
  --code-fg:#504945; --code-tab-fg:#7c6f64;
  --inline-code-bg:#f0efed;
  --inline-code-fg:#0c0a09; --inline-code-border:#e7e5e4;
  --link-wave:#777169; --sparkle:#a8a29e;
  --wave-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 6'%3E%3Cpath d='M0 3 Q5 0 10 3 T20 3' fill='none' stroke='%23a8a29e' stroke-width='2'/%3E%3C/svg%3E");
  --shadow-sm:0 2px 8px rgb(12 10 9 / .04);
  --shadow-md:0 4px 16px rgb(12 10 9 / .06);
}
html[data-theme="dark"] {
  --background:#0c0a09; --foreground:#f5f5f4; --card:#231d18;
  --primary:#f5f5f4; --primary-foreground:#0c0a09;
  --secondary:#292524; --panel:#171412; --content:#d6d3d1;
  --muted-foreground:#a8a29e; --border:#2a2624; --hairline-strong:#44403c;
  --code-bg:#171412; --code-border:#2a2624;
  --code-fg:#d5c4a1; --code-tab-fg:#a8a29e;
  --inline-code-bg:#3b2e19;
  --inline-code-fg:#f0d9a5; --inline-code-border:#55411f;
  --link-wave:#ffcc00; --sparkle:#ffcc00;
  --wave-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 6'%3E%3Cpath d='M0 3 Q5 0 10 3 T20 3' fill='none' stroke='%23ffcc00' stroke-width='2'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:light;scroll-behavior:smooth;scroll-padding-top:80px;overflow-x:clip;-webkit-text-size-adjust:100%}
html[data-theme="dark"]{color-scheme:dark}
body{margin:0;min-height:100dvh;padding-top:64px;overflow-x:clip;font-family:var(--font-head);font-size:calc(16px * var(--font-size-scale));background:var(--background);color:var(--foreground);-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--link-wave);outline-offset:3px}
:target{scroll-margin-top:80px}
a{color:inherit}
h1,h2,h3{font-family:var(--font-head);font-weight:500;letter-spacing:-.025em}
time,code,pre,.meta{font-family:var(--font-mono)}

/* header */
.site-header{position:fixed;inset:0 0 auto;z-index:1000;height:64px;background:var(--background);border-bottom:1px solid var(--border)}
.header-inner{max-width:1200px;height:100%;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.brand-mark{width:28px;height:30px;display:block;flex:0 0 auto;color:var(--foreground)}
.header-actions{display:flex;align-items:center;gap:0}
.nav{display:flex;align-items:center;gap:2px}
.nav a{font-size:calc(15px * var(--font-size-scale));font-weight:500;color:var(--content);text-decoration:none;padding:6px 12px;background:transparent;touch-action:manipulation}
.rss-link{width:32px;height:44px;padding:0;display:inline-flex;align-items:center;justify-content:center;color:var(--muted-foreground);text-decoration:none;border-radius:9999px}
.rss-link svg{width:18px;height:18px;pointer-events:none}
.nav-active{background-image:var(--wave-image);background-position:0 100%;background-repeat:repeat-x;background-size:20px 6px;padding-bottom:4px;color:var(--foreground)}
.icon-btn{width:32px;height:44px;padding:0;border:0;border-radius:0;touch-action:manipulation;background:transparent;color:var(--muted-foreground);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.icon-btn svg{width:18px;height:18px;pointer-events:none}
.theme-icon-sun,.menu-icon-close{display:none}
.theme-icon-moon{display:block}
html[data-theme="dark"] .theme-icon-sun{display:block}
html[data-theme="dark"] .theme-icon-moon{display:none}
.menu-toggle{display:none}
.menu-toggle[aria-expanded="true"] .menu-icon-open{display:none}
.menu-toggle[aria-expanded="true"] .menu-icon-close{display:block}

/* layout + home hero */
.site-main{max-width:1080px;margin:0 auto;padding:0 24px 50px}
.hero{position:relative;overflow:hidden;text-align:center;padding:0 20px;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.hero h1{position:relative;z-index:1;margin:0;line-height:1.15}
.hero-kicker{position:relative;z-index:1;margin:18px 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 11px;color:var(--content)}
.dot-sep{color:color-mix(in srgb,var(--muted-foreground) 45%,transparent);user-select:none}
.hero-sparkle-field{position:absolute;inset:0;pointer-events:none}
.sparkle,.sparkle-dot{position:absolute;pointer-events:none;background:var(--sparkle);animation:sparkle-twinkle var(--sp-dur,3s) ease-in-out var(--sp-delay,0s) infinite}
.sparkle{clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.sparkle-dot{border-radius:9999px}
@keyframes sparkle-twinkle{0%,100%{opacity:.15;transform:scale(.7)}50%{opacity:.9;transform:scale(1)}}
.post-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.post-list li{position:relative;min-width:0;min-height:242px;padding:28px;text-align:left;background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column}
.post-list .card-main{min-width:0}
.post-list h2{margin:0;font-size:inherit;line-height:inherit}
.post-list a{font-weight:550;line-height:1.3;text-decoration:none}
.post-list .meta{display:block;margin-top:13px;color:var(--muted-foreground);line-height:1.7}
.post-list p{position:relative;z-index:1;margin:14px 0 0;color:var(--content);line-height:1.65}
.empty-state{padding:28px;background:var(--card);border:1px solid var(--border);border-radius:16px;color:var(--content)}

/* archives */
.archives{max-width:760px;margin:0 auto;padding-top:50px}
.archive-year{margin:0 0 16px;font-size:calc(20px * var(--font-size-scale));font-weight:600;letter-spacing:-.02em;color:var(--foreground)}
.archive-list{list-style:none;margin:0 0 44px;padding:0;display:flex;flex-direction:column;gap:12px}
.archive-list li{display:flex;align-items:baseline;min-width:0}
.archive-list time{flex:0 0 auto;margin-right:20px;color:var(--muted-foreground);font-size:calc(13px * var(--font-size-scale))}
.archive-list a{color:var(--content);text-decoration:none;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* article */
.article-hero{position:relative;overflow:hidden;text-align:center;margin-top:50px;padding:40px 20px 32px;min-height:194px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.article-hero h1{position:relative;z-index:1;margin:0;max-width:1032px;line-height:1.4}
.article-hero>.date{position:relative;z-index:1;margin:16px 0 0;color:var(--muted-foreground);line-height:1.7}
.article-shell{max-width:1032px;margin:0 auto;background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm)}
.about-shell{margin-top:50px}
.heading-anchor{display:inline-block;font-family:var(--font-mono);font-weight:400;text-decoration:none;background:none;color:inherit;opacity:.75}
.body blockquote p{margin:0}
.body a{color:var(--foreground);font-weight:500;text-decoration:none;padding-bottom:4px;background-image:var(--wave-image);background-position:0 100%;background-repeat:repeat-x;background-size:20px 6px}
.body img{display:block;max-width:100%;height:auto;border:1px solid var(--border)}
.body code{margin:0 2px;font-size:.875em;font-weight:500;line-height:1.75;color:var(--inline-code-fg);border:1px solid var(--inline-code-border)}
.body table{display:block;width:100%;overflow-x:auto;border-collapse:collapse}
.body th,.body td{text-align:left;white-space:nowrap}
.body th{color:var(--foreground)}
.body hr{border:0;border-top:1px solid var(--border)}

/* code window */
.code-window{background:var(--code-bg);color:var(--code-fg);border:1px solid var(--code-border);overflow:hidden;box-shadow:var(--shadow-sm)}
.code-window-bar{display:flex;align-items:center;gap:7px;background:var(--code-bg);border-bottom:1px solid var(--code-border)}
.code-dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}.code-dot.red{background:#ff5f57}.code-dot.yellow{background:#febc2e}.code-dot.green{background:#28c840}
.code-lang{margin-left:6px;color:var(--code-tab-fg);font-family:var(--font-mono);line-height:1}
.code-copy{margin-left:auto;padding:0 12px;border:1px solid var(--code-border);border-radius:9999px;background:transparent;color:var(--code-tab-fg);font-family:var(--font-mono);line-height:1;cursor:pointer;touch-action:manipulation}
.code-copy[disabled]{cursor:default;opacity:.72}
.code-window pre{margin:0;padding:16px 20px;overflow:auto;font-size:calc(15.2px * var(--font-size-scale));line-height:1.45;tab-size:2;scrollbar-color:var(--code-border) transparent}
.code-window pre code{margin:0;background:none;border:0;padding:0;color:inherit;border-radius:0;font-size:inherit;font-weight:400;line-height:inherit}
.code-window pre ::selection{background:rgba(255,219,51,.28)}

/* floating article tools */
.floating-btn{position:fixed;right:16px;z-index:920;width:40px;height:40px;padding:0;border:1px solid var(--hairline-strong);border-radius:9999px;background:var(--primary);color:var(--primary-foreground);box-shadow:var(--shadow-md);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation}
.floating-btn svg{width:20px;height:20px;pointer-events:none}
.toc-open{bottom:16px}.back-top{bottom:68px;opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none}.back-top.is-visible{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.toc-overlay{position:fixed;inset:0;z-index:900;display:none;background:rgb(245 245 245 / .72);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px)}
html[data-theme="dark"] .toc-overlay{background:rgb(12 10 9 / .76)}
.toc-overlay.is-open{display:block}
.toc-panel{position:fixed;right:16px;bottom:16px;z-index:910;display:none;width:min(400px,calc(100vw - 32px));max-height:min(640px,calc(100dvh - 96px));overflow:hidden;background:var(--card);border:1px solid var(--border);box-shadow:0 16px 48px rgb(12 10 9 / .10)}
.toc-panel.is-open{display:block}

.toc-header{height:56px;padding:0 16px 0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}
.toc-header h2{margin:0;font-weight:500}.toc-close{width:44px;height:44px;padding:0;border:0;border-radius:9999px;background:transparent;color:var(--muted-foreground);display:grid;place-items:center;cursor:pointer}.toc-close svg{width:20px;height:20px;pointer-events:none}
.toc-nav{max-height:calc(min(640px,100dvh - 96px) - 57px);overflow:auto;padding:16px 12px 20px}
.toc-nav a{display:block;padding:8px 10px;border-radius:8px;color:var(--content);line-height:1.45;text-decoration:none}.toc-nav a[data-level="3"]{padding-left:26px}.toc-nav a.is-active{color:var(--foreground);background:var(--secondary);font-weight:500}.toc-empty{margin:0;padding:8px 10px;color:var(--muted-foreground)}
body.toc-locked{overflow:hidden}body.toc-locked .floating-btn{opacity:0;visibility:hidden;pointer-events:none}

/* pager + footer */
.pager{max-width:1032px;margin:50px auto 0;padding:20px 8px 0;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:18px}
.pager a{display:flex;flex-direction:column;gap:5px;max-width:48%;color:var(--muted-foreground);text-decoration:none}
.pager a.next{margin-left:auto;align-items:flex-end;text-align:right}.pager .label{font-family:var(--font-mono);line-height:1.4}
.pager .title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--foreground);font-weight:500}
.site-footer{border-top:1px solid var(--border);padding:28px 20px 46px;text-align:center;color:var(--content)}
.footer-inner{max-width:1080px;margin:auto;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

@media(max-width:720px){
  .header-inner{gap:8px;padding-inline:16px}.menu-toggle{display:inline-flex}
  .nav{position:fixed;top:64px;right:0;left:0;z-index:999;display:none;flex-direction:row;align-items:center;gap:2px;padding:8px 16px;background:var(--background);border-bottom:1px solid var(--border);box-shadow:var(--shadow-md)}
  .nav.is-open{display:flex}.nav a{padding:6px 12px;text-align:center}
  .site-main{padding-inline:20px;padding-bottom:50px}.hero{padding:0;min-height:198px}.hero-kicker{max-width:100%}
  .article-hero{min-height:165px;margin-top:0;padding:28px 8px 24px}.article-hero h1{line-height:1.35}.article-shell{margin-inline:0}.body{line-height:1.76}.code-window pre{padding:15px 16px}
  .post-list{grid-template-columns:1fr;gap:16px}.post-list li{min-height:0;padding:24px}
  .pager{padding-inline:0}.footer-inner{justify-content:center}
  .toc-panel{width:calc(100vw - 32px);max-height:calc(100dvh - 96px)}.toc-nav{max-height:calc(100dvh - 153px)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.sparkle,.sparkle-dot{opacity:.45;animation:none!important}}

.brand-name{font-size:calc(18px * var(--font-size-scale));font-weight:550;letter-spacing:-.025em}
.hero h1{font-size:calc(48px * var(--font-size-scale))}
.hero-kicker{font-size:calc(16px * var(--font-size-scale))}
.post-list a{font-size:calc(22px * var(--font-size-scale))}
.post-list .meta{font-size:calc(12px * var(--font-size-scale))}
.post-list p{font-size:calc(15px * var(--font-size-scale))}
.article-hero h1{font-size:calc(36px * var(--font-size-scale))}
.article-hero>.date{font-size:calc(12px * var(--font-size-scale))}
.body{font-size:calc(16px * var(--font-size-scale))}
.body h2{font-size:calc(24px * var(--font-size-scale))}
.body h3{font-size:calc(20px * var(--font-size-scale))}
.code-lang,.code-copy{font-size:calc(12px * var(--font-size-scale))}
.toc-header h2{font-size:calc(17px * var(--font-size-scale))}
.toc-nav a{font-size:calc(15px * var(--font-size-scale))}
.toc-nav a[data-level="3"]{font-size:calc(14px * var(--font-size-scale))}
.toc-empty{font-size:calc(14px * var(--font-size-scale))}
.pager .label{font-size:calc(12px * var(--font-size-scale))}
.site-footer{font-size:calc(13px * var(--font-size-scale))}

/* Markdown UI: tighter rhythm, clearer hierarchy, quieter surfaces. */
.article-shell{padding:40px 44px}
.body{max-width:760px;margin:0 auto;color:var(--content);line-height:1.78}
.body p{margin:0 0 1.05em}
.body h2,.body h3{display:flex;align-items:baseline;gap:0;margin:2.1em 0 .7em;line-height:1.3;color:var(--foreground)}
.body h2{padding-top:.8em;border-top:1px solid var(--border);font-weight:600}
.body h3{margin-top:1.65em;font-weight:600}
.heading-anchor{flex:0 0 1.45em;width:1.45em;margin:0 0 0 -1.45em!important;padding:0!important;text-align:left;color:var(--muted-foreground)!important;font-weight:400!important;text-decoration:none!important;background:none!important;opacity:.6}
.heading-anchor span{display:block}
.heading-text{min-width:0}
.body ul,.body ol{margin:0 0 1.1em;padding-left:1.35em}
.body li{margin:.28em 0;padding-left:.18em}
.body blockquote{margin:1.35em 0;padding:10px 16px;border-left:3px solid var(--hairline-strong);background:var(--panel);color:var(--content);border-radius:0 8px 8px 0}
.body hr{margin:2.2em 0;border-color:var(--border)}
.body img{margin:1.8em auto;border-radius:10px}
.body table{margin:1.35em 0 1.5em;border:1px solid var(--border);border-radius:10px;background:var(--card);font-size:.92em}
.body th,.body td{padding:.55em .72em;border:1px solid var(--border)}
.body th{font-weight:600;background:var(--panel)}
.body code{border-radius:5px;padding:.1em .34em;background:var(--inline-code-bg)}
.code-window{margin:1.35em 0 1.5em;border-radius:10px}
.code-window-bar{min-height:42px;padding:8px 12px 8px 14px}
.code-window pre{padding:14px 16px;line-height:1.5}
.code-copy{min-height:30px;min-width:60px}
.toc-panel{border-radius:12px}

@media(max-width:720px){
  .hero h1{font-size:calc(36px * var(--font-size-scale))}
  .hero-kicker{font-size:calc(14px * var(--font-size-scale))}
  .article-hero h1{font-size:calc(30px * var(--font-size-scale))}
  .body{line-height:1.8}
  .article-shell{padding:24px 20px}
  .body h2,.body h3{margin-top:1.8em}
  .heading-anchor{margin-left:-.25em!important;width:1.35em;flex-basis:1.35em}
  .code-window pre{font-size:calc(12px * var(--font-size-scale));padding:13px 14px}
  .post-list a{font-size:calc(21px * var(--font-size-scale))}
}
@media(max-width:390px){
  .brand-name{font-size:calc(16px * var(--font-size-scale))}
  .article-hero h1{font-size:calc(28px * var(--font-size-scale))}
  .article-shell{padding-inline:18px}
}