:root { --quick-nav-ink:#171719; --quick-nav-muted:#72767a; --quick-nav-surface:#fff; --quick-nav-line:#dedfe1; --quick-nav-control:#f1f1f1; --quick-nav-active:#eaf3ee; --quick-nav-accent:#197b4b; }
html[data-theme="dark"] { --quick-nav-ink:#f0f1ee; --quick-nav-muted:#aeb5b3; --quick-nav-surface:#171b1d; --quick-nav-line:#363c3f; --quick-nav-control:#292e31; --quick-nav-active:#203c2f; --quick-nav-accent:#8dd4ad; }
.quick-nav-toggle { position:relative; display:inline-flex; align-items:center; justify-content:center; flex:none; gap:6px; min-width:64px; height:36px; padding:8px 11px; border:1px solid transparent; border-radius:999px; background:var(--quick-nav-control); color:var(--quick-nav-ink); font:12px/1.4 'Microsoft YaHei',sans-serif; cursor:pointer; touch-action:manipulation; }
.quick-nav-toggle::after { content:""; position:absolute; inset:-4px; }
.quick-nav-toggle svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.quick-nav-toggle .quick-nav-close-icon { display:none; }
.quick-nav-toggle.is-open .quick-nav-menu-icon { display:none; }
.quick-nav-toggle.is-open .quick-nav-close-icon { display:block; }
.quick-nav-toggle:hover,.quick-nav-toggle.is-open { border-color:var(--quick-nav-line); }
.quick-nav-toggle:focus-visible { outline:2px solid var(--quick-nav-accent); outline-offset:3px; }
.scroll-header .quick-nav-toggle { background-color:color-mix(in srgb,var(--quick-nav-control) calc((1 - var(--scroll-header-progress)) * 100%),transparent); }
.quick-nav-panel { position:fixed; z-index:2147483605; box-sizing:border-box; width:224px; max-width:calc(100vw - 28px); margin:0; padding:12px; border:1px solid var(--quick-nav-line); border-radius:16px; background:var(--quick-nav-surface); color:var(--quick-nav-ink); box-shadow:0 14px 48px #00000024; overflow:auto; overscroll-behavior:contain; font:14px/1.6 'Space Grotesk','Microsoft YaHei',sans-serif; -webkit-tap-highlight-color:transparent; }
.quick-nav-panel[hidden] { display:none!important; }
.quick-nav-heading { margin:4px 12px 8px; color:var(--quick-nav-muted); font-size:11px; line-height:1.6; }
.quick-nav-link,.quick-nav-projects>summary { display:flex; align-items:center; justify-content:space-between; min-height:46px; padding:10px 12px; border-radius:9px; color:inherit; text-decoration:none; box-sizing:border-box; cursor:pointer; touch-action:manipulation; }
.quick-nav-link:hover,.quick-nav-projects>summary:hover,.quick-nav-case:hover { background:var(--quick-nav-control); }
.quick-nav-panel a:focus-visible,.quick-nav-projects>summary:focus-visible { outline:2px solid var(--quick-nav-accent); outline-offset:-2px; }
.quick-nav-link[aria-current],.quick-nav-case[aria-current],.quick-nav-projects>summary.is-current { color:var(--quick-nav-accent); background:var(--quick-nav-active); }
.quick-nav-link[aria-current]::after,.quick-nav-case[aria-current]::after { content:""; width:5px; height:5px; flex:none; margin-left:8px; border-radius:50%; background:currentColor; }
.quick-nav-projects>summary { list-style:none; }
.quick-nav-projects>summary::-webkit-details-marker { display:none; }
.quick-nav-projects>summary svg { width:16px; height:16px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; transition:transform .15s ease; }
.quick-nav-projects[open]>summary svg { transform:rotate(180deg); }
.quick-nav-case-list { display:grid; grid-template-columns:minmax(0,1fr); gap:4px; padding:8px 0 10px; margin:0 6px 6px; border-bottom:1px solid var(--quick-nav-line); }
.quick-nav-case { display:flex; align-items:center; justify-content:space-between; min-width:0; min-height:44px; padding:9px 10px; border-radius:7px; font-size:13px; line-height:1.6; color:inherit; text-decoration:none; box-sizing:border-box; touch-action:manipulation; }
.case-actions,.page-actions { align-items:center; }
@media (max-width:700px) {
  .quick-nav-toggle { width:36px; min-width:36px; height:36px; padding:9px; }
  .quick-nav-toggle>span { display:none; }
  .image-actions:has([data-quick-nav-toggle]) { bottom:calc(90px + env(safe-area-inset-bottom,0px)); }
}
@media (prefers-reduced-motion:reduce) {
  .quick-nav-projects>summary svg { transition:none; }
}