@font-face { font-family: 'Manrope'; src: url('/fonts/manrope-v50.woff2') format('woff2'); font-weight: 200 800; font-display: swap; }
:root, html[data-theme="dark"] {
  --bg: #161321; --bg: oklch(19.757% 0.02800 293.51);
  --bg-2: #211b31; --bg-2: oklch(24.041% 0.04189 295.63);
  --ink: #f2eef9; --ink: oklch(95.537% 0.01521 302.56);
  --muted: #b5abc8; --muted: oklch(75.894% 0.04237 301.11);
  --accent: #cfacf5; --accent: oklch(80.065% 0.10739 306.03);
  --accent-fg: #292035;
  --line: #3a304b; --line-strong: #716080; --pink: #f09bcb; --violet: #b49aed;
  --success: #c2e7a0; --warning: #e9ce88; --error: #f2aba0;
  --surface: var(--bg); --surface-alt: var(--bg-2); --surface-1: var(--bg-2); --surface-2: var(--bg-2);
  --text: var(--ink); --text-secondary: var(--muted); --focus: var(--accent);
  --a1: var(--accent); --a2: var(--accent); --a3: var(--accent); --sec-a: var(--accent);
  --font: 'Manrope', 'PingFang SC', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
  --font-serif: var(--font); --font-mono: 'Cascadia Code', Consolas, monospace;
  --font-latin: 'Manrope', sans-serif;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px;
  --size-body: 1rem; --size-small: .875rem; --radius: 4px; --radius-lg: 12px;
  --duration-fast: 180ms; --duration-base: 240ms; --ease: cubic-bezier(.2,.7,.2,1);
  color-scheme: dark;
}
html[data-theme="light"] {
  --bg: #f4f0f9; --bg: oklch(96.080% 0.01265 306.03);
  --bg-2: #eae3f3; --bg-2: oklch(92.601% 0.02267 305.59);
  --ink: #292035; --ink: oklch(26.398% 0.04018 303.44);
  --muted: #695776; --muted: oklch(48.635% 0.05327 310.72);
  --accent: #704193; --accent: oklch(46.883% 0.13455 308.55);
  --accent-fg: #f2eef9; --line: #d8cde4; --line-strong: #9680a6; --pink: #a32d79; --violet: #7251a0;
  --success: #704193; --warning: #79530b; --error: #9c332a;
  --surface: var(--bg); --surface-alt: var(--bg-2); --surface-1: var(--bg-2); --surface-2: var(--bg-2);
  --text: var(--ink); --text-secondary: var(--muted); --focus: var(--accent);
  --a1: var(--accent); --a2: var(--accent); --a3: var(--accent); --sec-a: var(--accent);
  color-scheme: light;
}
body, html[data-theme="light"] body { background: var(--bg); color: var(--text); font-family: var(--font); -webkit-font-smoothing: antialiased; }
::selection { background: var(--accent); color: var(--accent-fg); }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
button:disabled { opacity: .55; cursor: not-allowed; }
[lang="en"]:not(.tiny-label):not(.post__kicker), .signature { font-family: var(--font-mono); }
.grain, .noise, .stars, .vignette, .cursor-glow, .cursor-dot, .cursor-ring, .frame { display: none !important; }
body.has-cursor, body.has-cursor * { cursor: revert; }
.reveal, .reveal.is-visible { opacity: 1; transform: none; transition: none; }
.blog-main::before, .chapter::before, .chapter::after { display: none; }
.blog-head, html.is-scrolled .blog-head, html[data-theme="light"] .blog-head, html[data-theme="light"].is-scrolled .blog-head { background: var(--bg); backdrop-filter: none; border-color: var(--line); }
.blog-intro__title, .post__title { font-weight: 600; }
.post__title { max-width: 20em; }
.post-item a, html[data-theme="light"] .post-item a { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; padding: 28px 0; }
.post-list { gap: 0; border-top: 1px solid var(--line); }
.post-item a:hover, html[data-theme="light"] .post-item a:hover { background: none; transform: none; border-color: var(--accent); }
.post-item a:hover .post-item__title { color: var(--accent); }
.post-item__title { font-size: 21px; font-weight: 500; }
.post-pager__item, html[data-theme="light"] .post-pager__item, .lab__panel, html[data-theme="light"] .lab__panel { background: var(--surface-alt); border-radius: var(--radius); box-shadow: none; }
.post-toc { background: var(--surface-alt); }
.post-pager__item:hover, html[data-theme="light"] .post-pager__item:hover { transform: none; background: var(--surface-alt); }
.source-note { margin-top: 28px; color: var(--text-secondary); font-size: 13px; line-height: 1.8; padding-block: 14px; border-block: 1px solid var(--line); }
.chapter__head { color: var(--text-secondary); }
.chapter__num { color: var(--accent); }
.chapter .tags li { border-radius: var(--radius); }
.chapter .contacts a { border-radius: 0; }
.stickers { display: none; }
.log__item--now::before { box-shadow: none; }
html[data-theme="light"] .lab__badge--pass { color:#3b642d; background:#e0eadb; }
.home-page .cmdk-open { flex-shrink: 0; }
html:not([data-js]) .theme-toggle, html:not([data-js]) [data-copy] { display: none; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.toast { position:fixed; z-index:100; left:50%; bottom:24px; transform:translate(-50%,10px); padding:12px 20px; color:var(--text); background:var(--bg-2); border:1px solid var(--line-strong); border-radius:4px; font-size:14px; opacity:0; pointer-events:none; }
.toast.is-on { opacity:1; transform:translate(-50%,0); }
@media print {
  :root, html[data-theme="dark"], html[data-theme="light"] { --bg:#fff; --bg-2:#fff; --text:#111; --text-secondary:#444; --accent:#222; --line:#ccc; color-scheme:light; }
}

.cmdk-open {
  display: inline-flex; align-items: center; gap: var(--space-2);
  height: 36px; padding-inline: var(--space-3);
  border: 1px solid var(--line); border-radius: var(--radius);
  background: transparent; color: var(--text-secondary);
  font-family: var(--font-mono); font-size: 0.8125rem;
  cursor: pointer;
  transition: color var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease);
}
.cmdk-open svg { width: 15px; height: 15px; }
.cmdk-open kbd {
  font-family: inherit; font-size: 0.6875rem; color: var(--text-secondary);
  border: 1px solid var(--line-strong); border-radius: 6px; padding: 1px 5px;
}
.cmdk-open:hover { color: var(--text); border-color: var(--line-strong); }
@media (max-width: 767px) {
  .cmdk-open kbd { display: none; }
  .cmdk-open span { display: none; }  /* 窄屏只留一枚放大镜 */
  .cmdk-open { width: 36px; justify-content: center; padding-inline: 0; }
}

.cmdk { position: fixed; inset: 0; z-index: 90; display: flex; align-items: flex-start; justify-content: center; }
/* hidden 属性的 UA display:none 会被上面的 display:flex 干掉，必须显式压回来 */
.cmdk[hidden] { display: none; }
.cmdk__backdrop { position: absolute; inset: 0; background: rgb(8 8 10 / 62%); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
html[data-theme="light"] .cmdk__backdrop { background: rgb(246 246 248 / 55%); }
.cmdk__panel {
  position: relative; z-index: 1;
  margin-top: clamp(48px, 12vh, 120px);
  width: min(92vw, 560px); max-height: min(70vh, 560px);
  display: flex; flex-direction: column;
  border: 1px solid var(--line-strong); border-radius: var(--radius-lg);
  background: var(--bg-2);
  box-shadow: 0 24px 80px -24px rgb(0 0 0 / 55%);
  overflow: hidden;
}
.cmdk__bar {
  display: flex; align-items: center; gap: var(--space-3);
  padding: var(--space-4) var(--space-4);
  border-bottom: 1px solid var(--line);
}
.cmdk__bar svg { width: 18px; height: 18px; color: var(--text-secondary); flex: 0 0 auto; }
.cmdk__bar kbd { margin-left: auto; font-family: var(--font-mono); font-size: 0.6875rem; color: var(--text-secondary); border: 1px solid var(--line); border-radius: 6px; padding: 2px 6px; }
.cmdk__input {
  flex: 1; min-width: 0; border: 0; outline: none; background: transparent;
  color: var(--text); font-family: var(--font); font-size: 1rem;
}
.cmdk__input::placeholder { color: var(--text-secondary); }

.cmdk__list { list-style: none; margin: 0; padding: var(--space-2); overflow-y: auto; overscroll-behavior: contain; }
.cmdk__item {
  display: grid; grid-template-columns: auto 1fr; gap: 2px var(--space-3);
  align-items: baseline; width: 100%; text-align: left;
  padding: var(--space-2) var(--space-3); border: 0; border-radius: 10px;
  background: transparent; cursor: pointer;
}
.cmdk__item.is-active { background: rgb(127 127 160 / 14%); }
.cmdk__badge {
  grid-row: span 2;
  font-family: var(--font-mono); font-style: normal; font-size: 0.6875rem;
  color: var(--sec-a, var(--accent));
  border: 1px solid currentColor; border-radius: 6px;
  padding: 1px 5px; transform: translateY(-2px);
}
.cmdk__title { color: var(--text); font-size: 0.9375rem; font-weight: 600; }
.cmdk__meta {
  grid-column: 2; color: var(--text-secondary); font-size: 0.8125rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cmdk__empty { padding: var(--space-6) var(--space-4); color: var(--text-secondary); font-size: 0.9375rem; }
.cmdk__hints {
  display: flex; gap: var(--space-4);
  padding: var(--space-2) var(--space-4); border-top: 1px solid var(--line);
  font-family: var(--font-mono); font-size: 0.6875rem; color: var(--text-secondary);
}
.cmdk__hints kbd { font-family: inherit; border: 1px solid var(--line); border-radius: 5px; padding: 0 4px; margin-right: 2px; }

@media (prefers-reduced-motion: reduce) {
  .cmdk, .cmdk * { transition: none !important; animation: none !important; }
}
@media (prefers-reduced-motion: no-preference) {
  .cmdk:not([hidden]) .cmdk__panel { animation: cmdk-in 200ms var(--ease); }
  .cmdk:not([hidden]) .cmdk__backdrop { animation: cmdk-fade 200ms var(--ease); }
}
@keyframes cmdk-in { from { opacity: 0; transform: translateY(-10px); } }
@keyframes cmdk-fade { from { opacity: 0; } }


.cmdk-open { height:44px; border-radius:4px; }
.cmdk__panel { box-shadow:none; border-radius:12px; }
.cmdk__item { min-height:54px; border-radius:4px; }
.cmdk__item.is-active { background:var(--surface-alt); outline:1px solid var(--line-strong); }
