/* ===== Custom Fonts ===== */

/* iA Writer Quattro S — self-hosted */
@font-face {
    font-family: "iA Writer Quattro S";
    src: url("/fonts/iAWriterQuattroSRegular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
n/* Noto Sans SC — self-hosted */
@font-face {
    font-family: "Noto Sans SC";
    src: url("/fonts/noto-sans-sc-400.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Noto Sans SC";
    src: url("/fonts/noto-sans-sc-500.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Noto Sans SC";
    src: url("/fonts/noto-sans-sc-700.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
}

/* Global font stack: English → Chinese → system fallback */
html,
body {
    font-family: "iA Writer Quattro S", "Noto Sans SC", sans-serif;
}

/* Code blocks keep monospace */
code,
pre,
kbd {
    font-family:
        "SF Mono", "Fira Code", "Fira Mono", "Roboto Mono", "Noto Sans SC",
        monospace;
}

/* Remove navbar bottom border shadow */
.hextra-nav-container-blur {
    box-shadow: none !important;
}

/* Shift logo left to compensate for internal whitespace */
nav a:first-of-type img {
    margin-left: -10px;
}

/* Unified widths — all sections aligned at 76rem */
:root {
    --hx-color-dark: #000;
    --hextra-max-page-width: 76rem;
    --hextra-max-content-width: 76rem;
    --hextra-max-navbar-width: 76rem;
    --hextra-max-footer-width: 76rem;
}

/* Narrow left sidebar to half width — desktop only */
@media (min-width: 48rem) {
    .hextra-sidebar-container {
        width: 8rem !important;
    }
}

.dark body,
body:where(.dark) {
    background-color: #000;
}

/* Footer: #fff light / #000 dark */
.hextra-footer {
    background-color: #fff !important;
}
.dark .hextra-footer,
.hextra-footer:where(.dark *) {
    background-color: #000 !important;
}

/* Theme toggle icon visibility */
.theme-toggle-dark {
    display: none;
}
.theme-toggle-light {
    display: inline;
}
html.dark .theme-toggle-dark {
    display: inline;
}
html.dark .theme-toggle-light {
    display: none;
}

/* Vim-style block cursor via ::after */
#typewriter-text::after {
    content: "";
    display: inline-block;
    width: 0.6em;
    height: 1.1em;
    background: #999;
    vertical-align: text-bottom;
    transform: translateY(-2px);
    margin-left: 1px;
    animation: vim-blink 0.8s step-end infinite;
}
@keyframes vim-blink {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}
.dark #typewriter-text::after {
    background: #ccc;
}

/* Hide current page title in breadcrumb */

/* Image caption */
figcaption.post-caption {
    font-size: 0.85em;
    color: #888;
    text-align: center;
    margin-top: -0.25em;
    margin-bottom: 1em;
}
.dark figcaption.post-caption {
    color: #999;
}

.mermaid svg {
    max-width: 100%;
    height: auto;
}

.mermaid svg {
    max-width: 100%;
    height: auto;
}

.mermaid svg {
    width: 100% !important;
    height: auto !important;
}

.mermaid svg {
    max-width: none !important;
    height: auto;
}

/*
.content .mermaid svg {
    max-width: 100%;
    height: auto;
}
*/

/* Footer 3-column grid on desktop */
@media (min-width: 48rem) {
  .hextra-footer .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Footer brand column — extra breathing room */
.footer-brand .hx\:whitespace-pre-line {
  max-width: 18rem;
}
.footer-nav {
  padding-left: 1rem;
  padding-right: 1rem;
}
.footer-links {
  padding-left: 2rem;
}
.footer-roadmap { padding: 1rem; }