@charset "UTF-8";
@import url("/lib/font-awesome/css/all.min.css");
@import url("/assets/reading.css");

@font-face { font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/ibm-plex-mono-regular.ttf") format("truetype"); }
@font-face { font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/ibm-plex-mono-medium.ttf") format("truetype"); }
@font-face { font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/ibm-plex-mono-semibold.ttf") format("truetype"); }
@font-face { font-family:"IBM Plex Mono";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/ibm-plex-mono-bold.ttf") format("truetype"); }

:root {
  color-scheme:light;
  --bg:#fff;--surface:#f8fafc;--surface-raised:#f1f5f9;--paper:#fff;
  --text:#1f2937;--soft:#475569;--muted:#64748b;--line:#e2e8f0;
  --accent:#1d4ed8;--accent-dim:#eff4ff;--header:#ffffffd9;
  --grid:#cbd5e17a;--glow:#1d4ed82b;--shadow:0 20px 60px #0f172a0c;
  --max:1248px;--radius:16px;
  --mono:"IBM Plex Mono",Consolas,"PingFang SC","Microsoft YaHei",monospace;
  --sans:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  font-family:var(--mono);font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:110px;
}
:root[data-theme=dark] {
  color-scheme:dark;--bg:#111827;--surface:#182234;--surface-raised:#202e43;--paper:#111827;
  --text:#edf2fb;--soft:#c0cbdb;--muted:#99a9bf;--line:#2c3b51;
  --accent:#93b4ff;--accent-dim:#203354;--header:#111827e8;
  --grid:#8ca6cd22;--glow:#467be32b;--shadow:0 20px 60px #0002;
}
* { box-sizing:border-box; }
body { margin:0;background:var(--bg);color:var(--text);font-size:15px;line-height:1.7;overflow-wrap:break-word; }
a { color:inherit;text-decoration:none; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { color:inherit;cursor:pointer; }
button:disabled { cursor:wait; }
img { max-width:100%;height:auto;vertical-align:middle; }
svg { vertical-align:middle; }
::selection { background:#bfdbfe;color:#172554; }
:focus-visible { outline:2px solid var(--accent);outline-offset:5px; }
button:focus:not(:focus-visible) { outline:none; }
[hidden] { display:none!important; }
.icon { width:20px;height:20px;flex-shrink:0; }
.sr-only { 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 { position:fixed;z-index:100;top:-70px;left:20px;padding:12px 20px;background:var(--accent);color:#fff; }
.skip-link:focus { top:10px; }
.page-container { width:calc(100% - 128px);max-width:var(--max);margin-inline:auto; }
.eyebrow { display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:1.2px;line-height:1.6;font-weight:500;color:var(--accent); }
.heading-dot,.brand-dot { color:var(--accent); }
.section-rule { display:block;width:64px;height:4px;border-radius:4px;background:var(--accent);margin-top:18px; }
.text-link { display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:500;color:var(--text); }
.text-link .icon { width:18px;height:18px;transition:transform .2s; }
.text-link:hover { color:var(--accent); }
.text-link:hover .icon { transform:translate(2px,-2px); }
.button { min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:12px 23px;border:1px solid transparent;border-radius:7px;font-size:13px;font-weight:500;transition:background .2s,transform .2s; }
.button-primary { background:var(--accent);color:white; }
.button-primary:hover { background:#1e40af;transform:translateY(-2px); }
[data-theme=dark] .button-primary { background:#93b4ff;color:#14213b; }
.button-outline,.button-ghost { border-color:var(--line);background:var(--bg); }
.button-outline:hover,.button-ghost:hover { border-color:var(--accent);color:var(--accent); }

/* Quiet centered navigation, with the blog identity and tools at the edges. */
.site-header { height:80px;position:sticky;top:0;z-index:30;background:var(--header);backdrop-filter:blur(16px);border-bottom:1px solid var(--line); }
.header-inner { width:calc(100% - 64px);max-width:1360px;height:100%;margin:auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px; }
.brand { display:inline-flex;align-items:center;gap:12px;font-size:19px;font-weight:600;letter-spacing:-.8px;width:max-content; }
.brand-symbol { color:var(--accent);font-size:18px;letter-spacing:-1px; }
.site-nav { display:flex;align-items:center;gap:32px;height:100%; }
.nav-link { display:flex;align-items:center;position:relative;height:100%;font-size:13px;font-weight:500;color:var(--soft); }
.nav-link:hover,.nav-link.is-active { color:var(--accent); }
.nav-link.is-active:after { content:"";position:absolute;bottom:18px;left:50%;width:4px;height:4px;background:var(--accent);border-radius:50%; }
.header-actions { justify-self:end;display:flex;align-items:center;gap:10px; }
.icon-button { display:inline-flex;align-items:center;justify-content:center;border:0;width:36px;height:36px;padding:7px;background:transparent;border-radius:6px;color:var(--soft); }
.icon-button:hover { background:var(--accent-dim);color:var(--accent); }
.header-divider { width:1px;height:17px;background:var(--line);margin-inline:2px; }
.menu-toggle { display:none; }
.moon-icon { display:block; }
.sun-icon { display:none; }
[data-theme=dark] .moon-icon { display:none; }
[data-theme=dark] .sun-icon { display:block; }

/* Memory-Blog composition, using this blog's own landscape and avatar. */
.hero { position:relative;isolation:isolate;overflow:hidden;min-height:650px;height:calc(100svh - 80px);max-height:1100px;background:#bcd7e1;color:#102834;font-family:var(--sans); }
.hero-background { position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 55%;filter:saturate(.65) brightness(1.1); }
.hero-shade { position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#c5dfe8f0 0%,#c5dfe8bd 42%,#bfd8e14f 100%),linear-gradient(0deg,#bfd7e28c,#c5dfe833); }
.hero-inner { width:calc(100% - 128px);max-width:1160px;height:100%;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:90px;align-items:center;padding-block:20px 100px; }
.hero-intro { min-width:0; }
.hero-greeting { font-size:60px;line-height:1.1;font-weight:700;letter-spacing:-1.5px;margin:0 0 18px;color:#102834; }
.hero h1 { font-size:80px;line-height:1.12;font-weight:700;letter-spacing:-2.8px;margin:0;color:#102834; }
.hero-name { color:#4d66b1;font-weight:750; }
.hero-subtitle { margin:20px 0 0;font-size:22px;font-weight:600;line-height:1.6;color:#1c3845; }
.hero-socials { display:flex;align-items:center;gap:14px;margin-top:25px; }
.hero-socials a { display:flex;align-items:center;justify-content:center;width:45px;height:45px;border:1px solid #ffffff80;border-radius:8px;background:#ffffff66;color:#264855;box-shadow:0 4px 18px #304c6010;transition:background .2s,color .2s,transform .2s; }
.hero-socials a:hover { background:#3d5b9a;border-color:#3d5b9a;color:white;transform:translateY(-2px); }
.hero-socials .icon { width:23px;height:23px; }
.hero-portrait { display:block;width:340px;aspect-ratio:1;border:7px solid #fff;border-radius:50%;overflow:hidden;background:#d9e8ed;box-shadow:0 18px 60px #274a602a; }
.hero-portrait img { width:100%;height:100%;object-fit:cover; }
.hero-bottom { position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;width:max-content;max-width:calc(100% - 48px);text-align:center;color:#344f5d;font-size:12px;font-weight:500;line-height:1.6; }
.hero-bottom>.icon { width:32px;height:32px;opacity:.7;stroke-width:2; }
.hero-bottom:hover { color:#274f9e; }
[data-theme=dark] .hero { background:#18313e;color:#e6f2f8; }
[data-theme=dark] .hero-background { filter:saturate(.55) brightness(.65); }
[data-theme=dark] .hero-shade { background:linear-gradient(90deg,#142d3ce8,#142d3ca8 55%,#142d3c50); }
[data-theme=dark] .hero-greeting,[data-theme=dark] .hero h1,[data-theme=dark] .hero-subtitle,[data-theme=dark] .hero-bottom { color:#e6f2f8; }
[data-theme=dark] .hero-name { color:#acc6ff; }
[data-theme=dark] .hero-socials a { color:#e6f2f8;border-color:#dce9f533;background:#dce9f51a; }
[data-theme=dark] .hero-portrait { border-color:#dce9f5; }

/* Section proportions and pale cards echo the reference's project layout. */
.home-content { padding-top:100px; }
.featured-section { display:grid;grid-template-columns:270px minmax(0,1fr);gap:58px;margin-bottom:112px;align-items:start; }
.section-label>.eyebrow { margin:0 0 16px; }
.section-label h2,.section-heading h2 { font-size:42px;line-height:1.25;margin:12px 0 0;font-weight:700;letter-spacing:-1.5px; }
.section-label>p:last-child { color:var(--muted);font-size:13px;line-height:1.9;margin-top:28px; }
.featured { position:relative;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);overflow:hidden; }
.featured-slide { display:grid;grid-template-columns:.9fr 1.1fr;min-height:350px; }
.featured-image { display:block;position:relative;overflow:hidden;background:var(--accent-dim);border-right:1px solid var(--line); }
.featured-image img { width:100%;height:100%;position:absolute;inset:0;object-fit:cover; }
.featured-content { padding:30px 30px 65px;min-width:0; }
.featured-content>.eyebrow { font-size:10px;letter-spacing:1px;justify-content:space-between;gap:8px; }
.slide-number { color:var(--muted);white-space:nowrap; }
.featured-category { display:inline-block;margin-top:23px;background:var(--accent-dim);color:var(--accent);padding:3px 9px;font-size:10px;border-radius:4px; }
.featured h3 { font-size:26px;line-height:1.35;letter-spacing:-1px;margin:13px 0;font-weight:600;overflow-wrap:anywhere; }
.featured h3 a:hover { color:var(--accent); }
.featured-content>p { color:var(--muted);font-family:var(--sans);font-size:13px;line-height:1.9;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 23px; }
.featured-content>.text-link { font-size:11px; }
.featured-controls { display:flex;gap:8px;position:absolute;right:30px;bottom:22px; }
.slide-dot { background:transparent;color:var(--muted);border:0;border-bottom:2px solid var(--line);font-size:10px;padding:3px 6px 7px;min-width:28px; }
.slide-dot.active { color:var(--accent);border-color:var(--accent); }
.section-heading { display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:36px; }
.section-heading>.text-link { margin-bottom:4px; }
.small-count { background:var(--accent-dim);color:var(--accent);padding:2px 7px;border-radius:4px;font-size:10px;letter-spacing:0; }
.notes-toolbar { display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:19px 0 24px;color:var(--muted);font-size:11px; }
.notes-toolbar>span { display:flex;align-items:center;gap:9px; }
.notes-toolbar .icon { width:15px;height:15px; }
.article-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px; }
.article-card { min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);transition:transform .2s,box-shadow .2s,border-color .2s; }
.article-card:hover { transform:translateY(-4px);border-color:#bac8db;box-shadow:var(--shadow); }
.card-cover { position:relative;display:block;aspect-ratio:1.8;overflow:hidden;background:var(--accent-dim);border-bottom:1px solid var(--line); }
.card-cover img { width:100%;height:100%;object-fit:cover; }
.cover-category { position:absolute;bottom:17px;left:21px;color:#3155a4;font-size:10px;letter-spacing:1px; }
.cover-open { position:absolute;right:14px;top:14px;width:32px;height:32px;background:var(--text);color:var(--bg);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s; }
.cover-open>.icon { width:15px;height:15px; }
.article-card:hover .cover-open { background:var(--accent);color:white; }
.card-content { padding:24px; }
.card-meta { display:flex;justify-content:space-between;gap:8px;color:var(--accent);font-size:10px; }
.card-meta time { color:var(--muted);white-space:nowrap; }
.article-card h3 { font-size:21px;line-height:1.5;letter-spacing:-.6px;margin:14px 0 10px;font-weight:600;overflow-wrap:anywhere; }
.article-card h3 a:hover { color:var(--accent); }
.card-content>p { color:var(--muted);font-family:var(--sans);font-size:13px;line-height:1.9;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0;min-height:49px; }
.card-bottom { display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:18px;margin-top:22px;font-size:10px;color:var(--muted); }
.card-bottom span,.card-bottom a { display:flex;align-items:center;gap:6px; }
.card-bottom a { color:var(--text);font-weight:500; }
.card-bottom a:hover { color:var(--accent); }
.card-bottom .icon { width:13px;height:13px; }
/* Screenshots and formulas are shown whole and keep their original colors. */
.card-cover.article-cover,.featured-image.article-cover { background:white; }
.card-cover.article-cover img { object-fit:contain;padding:20px; }
.featured-image.article-cover img { object-fit:contain;padding:24px; }
.card-cover.article-cover .cover-category { display:none; }
.pagination { display:flex;align-items:center;justify-content:center;gap:10px;margin:50px 0 0;font-size:12px; }
.pagination a,.pagination .current { min-width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:6px; }
.pagination a:hover { border-color:var(--accent);color:var(--accent); }
.pagination .current { background:var(--accent);border-color:var(--accent);color:#fff; }
.pagination .gap { padding:5px; }
.about-strip { display:grid;grid-template-columns:270px minmax(0,1fr);gap:58px;padding:86px 0 30px;margin-top:90px;border-top:1px solid var(--line); }
.about-strip h3 { font-family:var(--sans);font-weight:600;letter-spacing:.5px;font-size:30px;line-height:1.6;margin:0 0 23px; }
.about-strip>div:last-child>p { font-family:var(--sans);font-size:16px;line-height:2;color:var(--soft);max-width:650px; }
.topic-chips { display:flex;flex-wrap:wrap;gap:10px;margin:26px 0; }
.topic-chips>span { padding:6px 13px;border-radius:30px;background:var(--surface-raised);font-size:11px;color:var(--soft); }

/* Archive, tags, and secondary pages. */
.page-heading { padding-top:85px;padding-bottom:46px;margin-bottom:45px;border-bottom:1px solid var(--line); }
.page-heading h1 { font-size:clamp(40px,5vw,64px);font-weight:600;line-height:1.3;letter-spacing:-2px;margin:17px 0 0; }
.page-heading p { color:var(--muted);font-size:14px;line-height:1.9;margin:25px 0 0; }
.archive-layout { display:grid;grid-template-columns:270px minmax(0,1fr);gap:58px;margin-bottom:100px; }
.archive-summary { position:sticky;top:130px;align-self:start; }
.big-number { font-size:80px;line-height:1.2;font-weight:600;letter-spacing:-6px; }
.big-number>span { font-family:var(--sans);font-size:16px;color:var(--muted);font-weight:400;margin-left:15px;letter-spacing:0; }
.archive-summary>p { font-size:12px;color:var(--muted);margin:13px 0 25px; }
.year-filters { display:flex;flex-wrap:wrap;gap:8px; }
.year-filters a { border:1px solid var(--line);border-radius:5px;padding:5px 11px;font-size:11px; }
.year-filters a:hover { background:var(--accent);color:white;border-color:var(--accent); }
.archive-note { color:var(--muted);font-size:14px;line-height:1.9;border-left:3px solid var(--accent);padding-left:20px;margin-top:45px; }
.timeline-year { font-size:31px;letter-spacing:-1.5px;margin:0;padding-bottom:17px;border-bottom:2px solid var(--text);font-weight:500; }
.timeline-year:not(:first-child) { margin-top:45px; }
.timeline-year>span { font-size:10px;color:var(--muted);margin-left:15px;letter-spacing:1px; }
.timeline-entry { display:flex;align-items:center;gap:32px;padding:25px 0;border-bottom:1px solid var(--line); }
.timeline-entry time { font-size:13px;color:var(--muted);min-width:45px; }
.timeline-entry>div { flex:1;min-width:0; }
.timeline-entry>div>span { font-size:10px;color:var(--accent); }
.timeline-entry h3 { font-size:20px;font-weight:500;line-height:1.5;letter-spacing:-.4px;margin:6px 0 0; }
.timeline-entry>.icon { width:19px;color:var(--muted); }
.timeline-entry:hover h3,.timeline-entry:hover>.icon { color:var(--accent); }
.tag-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin-bottom:90px; }
.tag-card { position:relative;min-height:218px;padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);transition:transform .2s,border-color .2s; }
.tag-card:hover { border-color:var(--accent);transform:translateY(-3px); }
.tag-number { color:var(--accent);font-size:11px; }
.tag-card>.icon { position:absolute;top:28px;right:28px;color:var(--muted); }
.tag-card h2 { font-size:25px;line-height:1.4;font-weight:500;letter-spacing:-1px;margin:27px 0 22px;overflow-wrap:anywhere; }
.tag-card>div { display:flex;justify-content:space-between;font-size:12px;color:var(--muted); }
.back-link { display:inline-flex;color:var(--muted);font-size:12px;margin-bottom:26px; }
.back-link:hover { color:var(--accent); }
.page-tag .article-grid { margin-bottom:100px; }

/* Chinese prose stays readable; code and metadata use the reference font. */
.article-heading { padding-top:46px; }
.article-heading h1 { font-family:var(--mono);font-weight:600;letter-spacing:-1.8px; }
.article-heading .eyebrow { font-size:11px; }
.article-meta { font-size:11px; }
.author-meta { font-size:12px; }
.author-initial { font-family:var(--mono);font-style:normal;font-weight:600;font-size:15px; }
.article-tags a { font-family:var(--mono);font-size:10px;background:var(--surface);border-radius:5px;padding:3px 9px; }
.post-body { font-family:var(--sans);font-size:16px;color:var(--soft);line-height:2; }
.post-body h1,.post-body h2,.post-body h3,.post-body h4 { font-weight:600; }
.post-body blockquote { background:var(--surface);border-radius:0 7px 7px 0; }
.post-body pre,.post-body code { font-family:var(--mono); }
.post-body .highlight { border-radius:10px; }
.post-body .highlight .gutter { color:#8090a5; }
.post-body .highlight .comment { color:#9baaba; }
.code-language,.code-copy { font-family:var(--mono);color:#a3b6ca; }
.post-toc a { font-size:11px;padding-block:6px; }
.toc-heading { font-family:var(--mono);font-size:10px; }
.reading-progress { font-family:var(--mono); }
.article-end { display:flex;align-items:center;gap:15px;margin-top:60px;color:var(--muted);font-size:10px;letter-spacing:1px; }
.article-end i { flex:1;height:1px;background:var(--line); }
.article-end .icon { width:18px; }
.article-license { display:flex;justify-content:space-between;gap:20px;padding-block:20px;font-size:10px;color:var(--muted);line-height:1.8; }
.article-license a { color:var(--accent); }
.article-neighbors>a { border-radius:9px;background:var(--surface); }
.article-neighbors strong { font-size:14px;font-weight:500; }
.comments-section .section-heading h2 { font-size:25px; }
.page-resource .reading-article { margin-bottom:90px; }
.about-page { display:grid;grid-template-columns:.8fr 1.2fr;gap:75px;margin-bottom:100px;align-items:start; }
.about-portrait { min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(135deg,var(--accent-dim),var(--surface));position:relative;overflow:hidden; }
.about-portrait:before { content:"{ }";position:absolute;top:8px;right:20px;color:var(--accent);opacity:.1;font-size:100px; }
.about-portrait>span { font-family:var(--mono);font-size:140px;line-height:1.3;color:var(--accent);font-weight:600;letter-spacing:-14px; }
.about-portrait>.eyebrow { font-size:9px;letter-spacing:.5px;color:var(--muted); }
.about-copy h2 { font-family:var(--sans);font-size:32px;font-weight:600;line-height:1.6;letter-spacing:.5px;margin:20px 0; }
.about-copy>p { font-family:var(--sans);color:var(--soft);font-size:16px;line-height:2; }
.about-copy>.button { margin-top:13px; }
.about-stats { display:flex;justify-content:space-between;gap:25px;border-top:1px solid var(--line);padding-top:30px;margin-top:35px; }
.about-stats>div { display:flex;flex-direction:column;gap:7px; }
.about-stats strong { font-size:30px;font-weight:500; }
.about-stats span { font-size:11px;color:var(--muted); }

/* Search and navigation tools. */
.search-dialog { border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);color:var(--text);box-shadow:var(--shadow);padding:28px;width:min(680px,calc(100% - 32px));max-height:min(710px,82svh);overflow-y:auto;margin:10svh auto auto; }
.search-dialog::backdrop { background:#0f172a55;backdrop-filter:blur(7px); }
.search-heading { display:flex;justify-content:space-between;align-items:center;margin-bottom:20px; }
.search-heading h2 { font-size:21px;font-weight:600;margin:0; }
.search-form { display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:8px;padding:14px;background:var(--surface); }
.search-form>.icon { width:19px;height:19px;color:var(--accent); }
.search-form input { min-width:0;width:100%;border:0;outline:none;background:transparent;color:var(--text);font-size:14px; }
.search-form input::placeholder { color:var(--muted); }
.search-form kbd { font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:1px 5px; }
.search-status { font-size:12px;color:var(--muted);margin:22px 0 12px; }
.search-result { display:block;padding:20px 0;border-top:1px solid var(--line); }
.search-result:hover h3 { color:var(--accent); }
.search-result h3 { font-size:18px;line-height:1.5;font-weight:500;margin:0 0 8px; }
.search-result p { font-family:var(--sans);font-size:13px;line-height:1.9;color:var(--muted);margin:0; }
.search-result time { display:block;font-size:10px;color:var(--muted);margin-top:10px; }
.search-result mark { background:var(--accent-dim);color:var(--accent);padding:0 2px;border-radius:2px; }
.back-top { position:fixed;right:25px;bottom:25px;width:39px;height:39px;z-index:15;border:1px solid var(--line);background:var(--bg);opacity:0;visibility:hidden;transition:opacity .2s; }
.back-top.is-visible { opacity:1;visibility:visible; }
.back-top .icon { transform:rotate(-90deg);width:17px; }
.site-footer { border-top:1px solid var(--line);margin-top:70px;padding:40px max(64px,calc((100% - var(--max))/2)) 25px; }
.footer-main { display:flex;align-items:center;gap:30px;padding-bottom:30px; }
.footer-main>.brand { font-size:20px;gap:0; }
.footer-main>p { font-size:12px;color:var(--muted);margin:0; }
.footer-main>a:last-child { display:flex;align-items:center;gap:10px;font-size:11px;color:var(--soft);margin-left:auto; }
.footer-main>a:last-child:hover { color:var(--accent); }
.footer-main .icon { width:15px;height:15px; }
.footer-bottom { display:flex;justify-content:space-between;gap:25px;border-top:1px solid var(--line);padding-top:20px;color:var(--muted);font-size:10px; }


@media(max-width:1100px) {
  .page-container { width:calc(100% - 80px); }
  .site-nav { gap:24px; }
  .header-actions { gap:5px; }
  .featured-section,.about-strip,.archive-layout { grid-template-columns:220px minmax(0,1fr);gap:36px; }
  .featured-slide { grid-template-columns:.85fr 1.15fr; }
  .featured-content { padding:24px 24px 65px; }
  .featured h3 { font-size:23px; }
  .featured-controls { right:24px; }
  .slide-number { display:none; }
  .article-grid { gap:20px; }
  .card-content { padding:20px; }
  .article-card h3 { font-size:19px; }
  .card-meta { flex-wrap:wrap; }
  .section-label h2,.section-heading h2 { font-size:36px; }
  .reading-layout { gap:35px;grid-template-columns:minmax(0,1fr) 190px; }
  .about-page { gap:40px; }
  .site-footer { padding-inline:40px; }
}
@media(max-width:800px) {
  :root { scroll-padding-top:95px; }
  .site-header { height:72px; }
  .header-inner { width:calc(100% - 40px);display:flex;justify-content:space-between;gap:15px; }
  .brand { font-size:18px;gap:9px; }
  .brand-symbol { font-size:16px; }
  .site-nav { display:none;position:absolute;top:71px;left:0;right:0;height:auto;padding:15px 24px;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0; }
  .site-nav.is-open { display:flex; }
  .nav-link { padding:14px 0;height:auto; }
  .nav-link.is-active:after { left:auto;right:4px;bottom:24px; }
  .menu-toggle { display:inline-flex; }
  .github-link { display:none; }
  .header-actions { gap:5px; }
  .header-divider { margin:0; }
  .page-container { width:calc(100% - 48px); }
  .home-content { padding-top:65px; }
  .featured-section { grid-template-columns:1fr;gap:30px;margin-bottom:75px; }
  .section-label>p:last-child { display:none; }
  .featured-slide { min-height:320px;grid-template-columns:1fr 1fr; }
  .featured h3 { font-size:26px; }
  .featured-content { padding:25px 26px 60px; }
  .article-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:22px; }
  .card-meta { font-size:9px; }
  .section-heading { margin-bottom:28px; }
  .about-strip { grid-template-columns:1fr;gap:32px;padding-top:55px;margin-top:65px; }
  .about-strip h3 { font-size:28px; }
  .page-heading { padding-top:50px;padding-bottom:35px;margin-bottom:35px; }
  .page-heading h1 { font-size:42px; }
  .page-heading p { font-size:13px; }
  .archive-layout { grid-template-columns:1fr;gap:40px; }
  .archive-summary { position:static;display:grid;grid-template-columns:1fr 1fr;align-items:center; }
  .big-number { font-size:60px; }
  .archive-summary>p { margin:0; }
  .year-filters { grid-column:1/3;margin-top:20px; }
  .archive-note { display:none; }
  .tag-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .reading-layout { display:block;margin-top:30px; }
  .reading-sidebar { display:none; }
  .article-heading { padding-top:30px; }
  .article-heading h1 { font-size:38px; }
  .article-license { display:block; }
  .article-license>span { display:block;margin-top:6px; }
  .about-page { grid-template-columns:.8fr 1.2fr;gap:32px; }
  .about-portrait { min-height:300px; }
  .about-portrait>span { font-size:100px; }
  .about-portrait>.eyebrow { font-size:7px; }
  .about-copy h2 { font-size:27px; }
  .about-copy>p { font-size:14px; }
  .about-copy>.eyebrow { font-size:9px; }
  .about-stats { gap:18px; }
  .about-stats strong { font-size:24px; }
  .about-stats span { font-size:9px; }
  .site-footer { padding-inline:24px; }
  .footer-main { gap:20px; }
  .footer-main>p { font-size:10px; }
}
@media(max-width:520px) {
  .header-actions { gap:1px; }
  .icon-button { width:34px;height:36px; }
  .section-label h2,.section-heading h2 { font-size:32px;letter-spacing:-1px; }
  .eyebrow { font-size:10px;letter-spacing:1px; }
  .section-rule { width:54px;margin-top:15px; }
  .featured-slide { grid-template-columns:1fr; }
  .featured-image { height:220px;border-right:0;border-bottom:1px solid var(--line); }
  .featured-content { padding:24px 24px 68px; }
  .featured h3 { font-size:26px; }
  .slide-number { display:inline; }
  .featured-category { margin-top:22px; }
  .featured-content>p { font-size:13px; }
  .featured-controls { right:24px; }
  .section-heading { gap:15px; }
  .section-heading>.text-link { font-size:10px;gap:6px;margin-bottom:4px; }
  .small-count { font-size:9px; }
  .notes-toolbar { font-size:10px;padding-top:18px; }
  .toolbar-order { display:none!important; }
  .article-grid { grid-template-columns:1fr;gap:26px; }
  .card-cover { aspect-ratio:1.8; }
  .card-content { padding:23px; }
  .card-meta { font-size:10px; }
  .article-card h3 { font-size:22px; }
  .card-content>p { font-size:13px; }
  .card-bottom { font-size:10px; }
  .about-strip h3 { font-size:25px; }
  .about-strip>div:last-child>p { font-size:14px; }
  .topic-chips { gap:7px; }
  .topic-chips>span { font-size:9px;padding-inline:10px; }
  .page-heading h1 { font-size:35px;letter-spacing:-1.5px; }
  .page-heading p { font-size:12px; }
  .timeline-entry { gap:19px;padding-block:21px; }
  .timeline-entry h3 { font-size:17px; }
  .timeline-entry time { font-size:11px; }
  .tag-grid { grid-template-columns:1fr;gap:20px; }
  .tag-card { min-height:190px; }
  .article-heading h1 { font-size:32px;letter-spacing:-1px; }
  .article-heading>.eyebrow { font-size:10px; }
  .article-meta { gap:12px;font-size:9px; }
  .author-meta { font-size:10px; }
  .article-tags { flex-wrap:wrap;gap:8px; }
  .post-body { font-size:15px;line-height:1.95; }
  .post-body h1 { font-size:25px; }
  .post-body h2 { font-size:22px; }
  .post-body h3 { font-size:19px; }
  .post-body .highlight td { padding-inline:10px; }
  .post-body .highlight .code { padding-left:12px; }
  .post-body pre { font-size:11px; }
  .post-body th,.post-body td { padding:8px 10px; }
  .article-neighbors { grid-template-columns:1fr;gap:13px; }
  .article-neighbors>span { display:none; }
  .about-page { grid-template-columns:1fr;gap:35px; }
  .about-portrait { min-height:260px; }
  .about-portrait>span { font-size:125px; }
  .about-portrait>.eyebrow { font-size:9px; }
  .about-copy h2 { font-size:29px; }
  .about-stats strong { font-size:27px; }
  .about-stats span { font-size:10px; }
  .search-dialog { padding:20px;margin-top:7svh; }
  .search-form { gap:9px;padding:12px; }
  .search-form input { font-size:12px; }
  .search-form kbd { display:none; }
  .search-result h3 { font-size:17px; }
  .search-result p { font-size:12px; }
  .footer-main { flex-wrap:wrap;gap:18px;padding-bottom:25px; }
  .footer-main>p { margin-left:auto; }
  .footer-main>a:last-child { width:100%;margin-left:0;font-size:10px; }
  .footer-bottom { font-size:8px;gap:20px;line-height:1.9; }
  .footer-bottom>a { flex-shrink:0; }
  .back-top { right:12px;bottom:15px;width:34px;height:34px; }
}

[data-i18n] { white-space:pre-line; }
.language-toggle { display:inline-flex;align-items:center;justify-content:center;min-width:43px;height:31px;padding:4px 7px;border:1px solid var(--line);border-radius:5px;background:transparent;color:var(--soft);font-size:11px;font-weight:500;line-height:1;white-space:nowrap; }
.language-toggle:hover { color:var(--accent);background:var(--accent-dim);border-color:var(--accent); }
@media(max-width:1100px) {
  .hero-inner { width:calc(100% - 80px);grid-template-columns:minmax(0,1fr) 280px;gap:55px; }
  .hero-portrait { width:280px; }
  .hero-greeting { font-size:52px; }
  .hero h1 { font-size:67px; }
  .hero-subtitle { font-size:19px; }
}
@media(min-width:801px) and (max-width:1000px) {
  .header-inner { grid-template-columns:auto minmax(0,1fr) auto;gap:16px; }
  .site-nav { justify-content:center;gap:18px; }
}
@media(max-width:800px) {
  .hero { height:calc(100svh - 72px);min-height:650px;max-height:1000px; }
  .hero-inner { width:calc(100% - 48px);grid-template-columns:minmax(0,1fr) 220px;gap:30px; }
  .hero-portrait { width:220px;border-width:6px; }
  .hero-greeting { font-size:44px; }
  .hero h1 { font-size:56px;letter-spacing:-2px; }
  .hero-subtitle { font-size:17px; }
  .language-toggle { min-width:40px;padding-inline:5px; }
}
@media(max-width:600px) {
  .hero-inner { display:flex;flex-direction:column;justify-content:center;gap:24px;padding-block:32px 105px; }
  .hero-portrait { order:-1;width:160px;border-width:5px;flex-shrink:0; }
  .hero-intro { text-align:center;flex-shrink:0; }
  .hero-greeting { font-size:32px;margin-bottom:12px;letter-spacing:-.5px; }
  .hero h1 { font-size:46px;letter-spacing:-1.5px; }
  .hero-subtitle { font-size:16px;margin-top:14px; }
  .hero-socials { justify-content:center;margin-top:18px; }
  .hero-socials a { width:42px;height:42px; }
  .hero-bottom { bottom:23px;font-size:11px;gap:7px; }
  .hero-bottom>.icon { width:28px;height:28px; }
}

@media(prefers-reduced-motion:reduce) {
  :root { scroll-behavior:auto; }
  *,*:before,*:after { animation:none!important;transition:none!important; }
  .article-card:hover,.button:hover { transform:none; }
}