/* Sidebar numbering — all levels (h1 through h6)
   Docsify generates: ul > li (h2) + ul (h3 list) as siblings, not nested li > ul > li */
.sidebar-nav {
    counter-reset: h1toc !important;
}

/* Level 1 — pages */
.sidebar-nav>ul>li {
    counter-reset: h2toc;
}
.sidebar-nav>ul>li>a:before {
    counter-increment: h1toc;
    content: counter(h1toc) ". ";
}

/* Level 2 — h2 (li inside the page's sub-sidebar ul) */
.sidebar-nav>ul>li>ul>li>a:before {
    counter-increment: h2toc;
    content: counter(h1toc) ". " counter(h2toc) ". ";
}

/* Level 3 — h3 (ul sibling of h2 li) */
.sidebar-nav>ul>li>ul>ul {
    counter-reset: h3toc;
}
.sidebar-nav>ul>li>ul>ul>li>a:before {
    counter-increment: h3toc;
    content: counter(h1toc) ". " counter(h2toc) ". " counter(h3toc) ". ";
}

/* Level 4 — h4 (ul inside h3 ul) */
.sidebar-nav>ul>li>ul>ul>ul {
    counter-reset: h4toc;
}
.sidebar-nav>ul>li>ul>ul>ul>li>a:before {
    counter-increment: h4toc;
    content: counter(h1toc) ". " counter(h2toc) ". " counter(h3toc) ". " counter(h4toc) ". ";
}

/* Level 5 — h5 */
.sidebar-nav>ul>li>ul>ul>ul>ul {
    counter-reset: h5toc;
}
.sidebar-nav>ul>li>ul>ul>ul>ul>li>a:before {
    counter-increment: h5toc;
    content: counter(h1toc) ". " counter(h2toc) ". " counter(h3toc) ". " counter(h4toc) ". " counter(h5toc) ". ";
}

/* Level 6 — h6 */
.sidebar-nav>ul>li>ul>ul>ul>ul>ul {
    counter-reset: h6toc;
}
.sidebar-nav>ul>li>ul>ul>ul>ul>ul>li>a:before {
    counter-increment: h6toc;
    content: counter(h1toc) ". " counter(h2toc) ". " counter(h3toc) ". " counter(h4toc) ". " counter(h5toc) ". " counter(h6toc) ". ";
}

/* Content heading numbering (synced with sidebar via JS) */
.markdown-section h1[data-prefix]::before,
.markdown-section h2[data-prefix]::before,
.markdown-section h3[data-prefix]::before,
.markdown-section h4[data-prefix]::before,
.markdown-section h5[data-prefix]::before,
.markdown-section h6[data-prefix]::before {
    content: attr(data-prefix);
}

.markdown-section img {
    max-width: 100%;
    max-height: 500px;
    height: auto;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin: 1rem 0;
}

[data-theme="dark"] .markdown-section img {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
    filter: brightness(0.92);
}

blockquote {
    padding: 12px 16px;
    position: relative;
    border-left: 4px solid #2e7d32;
    border-radius: 4px;
    background-color: #d9f1e6;
    color: #1a3a1a;
}

blockquote p {
    font-weight: normal !important;
}

blockquote strong {
    font-weight: bold !important;
    color: #1a3a1a;
}

[data-theme="dark"] blockquote {
    background-color: rgba(46, 125, 50, 0.15);
    border-left-color: #66bb6a;
    color: #c8e6c9;
}

[data-theme="dark"] blockquote strong {
    color: #a5d6a7;
}

/* Typography system */
body, .markdown-section {
    font-family: 'Space Grotesk', -apple-system, sans-serif;
    font-size: 16px;
    line-height: 1.7;
}

.markdown-section h1,
.markdown-section h2,
.markdown-section h3,
.markdown-section h4,
.markdown-section h5,
.markdown-section h6 {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 700;
}

.markdown-section h1 {
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.markdown-section h2 {
    font-size: 1.6rem;
    margin-top: 2.5rem;
}

code[class*=language-],
pre[class*=language-],
.markdown-section code {
    font-family: 'JetBrains Mono', 'Fira Code', Consolas, monospace;
    font-size: 0.875em;
}

.sidebar-nav {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
}

/* Line length control */
.markdown-section {
    max-width: 48rem;
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Focus indicators for keyboard navigation */
a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #1976d2;
    outline-offset: 2px;
    border-radius: 2px;
}

[data-theme="dark"] a:focus-visible,
[data-theme="dark"] button:focus-visible,
[data-theme="dark"] input:focus-visible,
[data-theme="dark"] [tabindex]:focus-visible {
    outline-color: #64b5f6;
}

/* Dark mode code blocks */
[data-theme="dark"] code[class*=language-],
[data-theme="dark"] pre[class*=language-] {
    color: #e0e0e0;
    background: #1e1e2e;
    text-shadow: none;
}

[data-theme="dark"] :not(pre) > code[class*=language-],
[data-theme="dark"] pre[class*=language-] {
    background: #1e1e2e;
}

[data-theme="dark"] .token.comment,
[data-theme="dark"] .token.prolog,
[data-theme="dark"] .token.doctype,
[data-theme="dark"] .token.cdata {
    color: #6a9955;
}

[data-theme="dark"] .token.punctuation {
    color: #d4d4d4;
}

[data-theme="dark"] .token.property,
[data-theme="dark"] .token.tag,
[data-theme="dark"] .token.boolean,
[data-theme="dark"] .token.number,
[data-theme="dark"] .token.constant,
[data-theme="dark"] .token.symbol,
[data-theme="dark"] .token.deleted {
    color: #b5cea8;
}

[data-theme="dark"] .token.selector,
[data-theme="dark"] .token.attr-name,
[data-theme="dark"] .token.string,
[data-theme="dark"] .token.char,
[data-theme="dark"] .token.builtin,
[data-theme="dark"] .token.inserted {
    color: #ce9178;
}

[data-theme="dark"] .token.operator,
[data-theme="dark"] .token.entity,
[data-theme="dark"] .token.url,
[data-theme="dark"] .language-css .token.string,
[data-theme="dark"] .style .token.string {
    color: #d4d4d4;
    background: transparent;
}

[data-theme="dark"] .token.atrule,
[data-theme="dark"] .token.attr-value,
[data-theme="dark"] .token.keyword {
    color: #569cd6;
}

[data-theme="dark"] .token.function,
[data-theme="dark"] .token.class-name {
    color: #dcdcaa;
}

[data-theme="dark"] .token.regex,
[data-theme="dark"] .token.important,
[data-theme="dark"] .token.variable {
    color: #d16969;
}

/* Dark mode inline code */
[data-theme="dark"] .markdown-section code:not([class*=language-]) {
    background: rgba(255, 255, 255, 0.08);
    color: #e06c75;
}

/* Dark mode copy button */
[data-theme="dark"] div.code-toolbar > .toolbar > .toolbar-item > a,
[data-theme="dark"] div.code-toolbar > .toolbar > .toolbar-item > button,
[data-theme="dark"] div.code-toolbar > .toolbar > .toolbar-item > span {
    background: rgba(255, 255, 255, 0.1);
    color: #ccc;
}

/* Mobile optimizations */
@media screen and (max-width: 768px) {
    .markdown-section {
        font-size: 15px;
        padding: 0 16px;
    }

    .markdown-section h1 {
        font-size: 1.75rem;
    }

    .markdown-section h2 {
        font-size: 1.35rem;
    }

    .markdown-section pre {
        font-size: 13px;
        padding: 12px;
        border-radius: 6px;
        -webkit-overflow-scrolling: touch;
    }

    div.code-toolbar > .toolbar > .toolbar-item > button,
    div.code-toolbar > .toolbar > .toolbar-item > a {
        min-width: 44px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .markdown-section table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .markdown-section img {
        max-height: none;
    }

    .sidebar-nav a {
        display: block;
        padding: 8px 0;
        min-height: 44px;
        line-height: 28px;
    }
}
