.md-typeset__table {
    display: table;
    min-width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0px none transparent;
    margin: 0;
    padding: 0;
}

td, th, table {
    border: none!important;
}

hr {
    margin: 2px 0px!important;
}

.details {
    display: inline-block;
    min-width: 115px;
    vertical-align: top;
}

.details-img {
    width: 100px;
    min-width: 100px;
    max-width: 100px;
}

/* The institution logos are dark artwork on a transparent background, so they
   vanish on the dark (slate) scheme. Render them there as white line art
   (every opaque pixel turns white), keeping the transparent background. */
[data-md-color-scheme="slate"] .details-img {
    filter: brightness(0) invert(1);
}

.support-list {
    list-style-type: none !important;
    display: inline-block !important;
    margin: 0px !important;
}

.support-item {
    margin-left: 0px !important;
    padding-left: 0px !important;
}

/* The page-to-pdf plugin injects its own floating PDF button; we provide an
   explicit "Download CV (PDF)" link instead, so hide the redundant one. */
.md-content__button[title="PDF"] {
    display: none;
}

/* Keep the header download button the same color as the other header icons
   (white on the grey bar) instead of the default link blue. */
.md-header__button.md-icon {
    color: inherit;
}

/* Larger, more readable base text than Material's default 0.8rem */
.md-typeset {
    font-size: 0.9rem;
}

/* Material shrinks class-less tables to 0.64rem; the CV timeline content
   lives in such tables, so bump it back up for readability. */
.md-typeset table:not([class]) {
    font-size: 0.8rem;
}

/* Section headings — subtle rule under each major CV section.
   clear: both makes each section start below the floated photo/contact box
   instead of wrapping beside it (fixes the cramped "Research Interests"). */
.md-typeset h2 {
    clear: both;
    border-bottom: 2px solid var(--md-default-fg-color--lightest);
    padding-bottom: 0.2em;
    margin-top: 1.4em;
}

/* Keep a heading attached to the content that follows it when printing */
.md-typeset h2,
.md-typeset h3 {
    break-after: avoid;
}

/* Inline site favicon used as a link icon (e.g. graphole.com). Rendered as a
   currentColor mask so it matches the Material contact icons in both size and
   color (and adapts to light/dark), rather than a fixed-color raster. */
.md-typeset .favicon-inline {
    display: inline-flex;
    height: 1.125em;
    width: 1.125em;
    vertical-align: text-top;
    background-color: currentColor;
    -webkit-mask: url(../assets/img/graphole.png) center / contain no-repeat;
    mask: url(../assets/img/graphole.png) center / contain no-repeat;
}

/* Small AI-contribution disclaimer at the foot of the CV */
.md-typeset .cv-disclaimer {
    clear: both;
    margin-top: 2.5em;
    color: var(--md-default-fg-color--light);
    font-size: 0.7rem;
    text-align: center;
}

/* ----------------------------------------------------------------------------
   Mobile layout (below Material's 45em tablet breakpoint, ~720px).
   The CV is written as wide multi-column HTML tables; on a phone they are
   restacked as blocks: date line on top, institution logo beside it, then
   the details full width. Nested course tables become indented lists.
   ---------------------------------------------------------------------------- */
@media screen and (max-width: 44.9375em) {

    /* Header: photo, then the contact card full width (it was squeezed into a
       narrow column beside the photo). */
    .md-typeset img.photo {
        float: none;
        display: block;
        width: 140px;
        margin: 0 0 1em;
    }

    .md-typeset .admonition.inline.end {
        float: none;
        width: auto;
        margin: 0 0 1.2em;
    }

    /* Material pulls table wrappers to the screen edge on phones; keep them
       aligned with the text instead. */
    .md-typeset__scrollwrap {
        margin-left: 0;
        margin-right: 0;
    }

    .md-typeset__table {
        padding: 0;
    }

    /* Timeline tables (raw HTML, no header row) -> stacked entries */
    .md-typeset table:not(:has(thead)),
    .md-typeset table:not(:has(thead)) > tbody,
    .md-typeset table:not(:has(thead)) > tbody > tr > td {
        display: block;
        width: auto !important;
        padding: 0 !important;
    }

    .md-typeset table:not(:has(thead)) {
        overflow: visible;
    }

    .md-typeset table:not(:has(thead)) > tbody > tr {
        display: grid;
        grid-template-columns: 1fr auto;
        column-gap: 0.8em;
        padding: 0.9em 0;
        border-bottom: 1px solid var(--md-default-fg-color--lightest);
    }

    .md-typeset table:not(:has(thead)) > tbody > tr:last-child {
        border-bottom: none;
    }

    .md-typeset table:not(:has(thead)) > tbody > tr > td {
        grid-column: 1 / -1;
    }

    .md-typeset table:not(:has(thead)) > tbody > tr > td:empty {
        display: none;
    }

    /* Period cell ("mar.2012 ↑ mar.2007") on one line, as a small caption */
    .md-typeset table:not(:has(thead)) > tbody > tr > td[align="center"] {
        grid-column: 1;
        text-align: left;
        font-size: 0.75rem;
        color: var(--md-default-fg-color--light);
        margin-bottom: 0.3em;
    }

    .md-typeset table:not(:has(thead)) > tbody > tr > td[align="center"] br {
        display: none;
    }

    /* Institution logo: top right, beside the period */
    .md-typeset table:not(:has(thead)) > tbody > tr > td:has(.details-img) {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .md-typeset .details-img {
        width: 56px;
        min-width: 56px;
        max-width: 56px;
    }

    /* Third column without a logo (Experience keywords): a muted caption */
    .md-typeset table:not(:has(thead)) > tbody > tr > td:nth-child(3):not(:has(.details-img)) {
        margin-top: 0.3em;
        font-size: 0.75rem;
        color: var(--md-default-fg-color--light);
    }

    /* Field labels (thesis, advisor, doi...) become small captions above
       their value instead of a fixed-width left column. */
    .md-typeset .details {
        display: block;
        min-width: 0;
        margin-top: 0.5em;
        font-size: 0.7rem;
        color: var(--md-default-fg-color--light);
    }

    .md-typeset .details:empty {
        display: none;
    }

    /* Nested course tables (Teaching): indented, one course per entry */
    .md-typeset table.institution {
        margin: 0.6em 0 0;
        padding-left: 0.8em;
        border-left: 2px solid var(--md-default-fg-color--lightest);
    }

    .md-typeset table.institution > tbody > tr {
        padding: 0.6em 0;
    }

    .md-typeset table.institution > tbody > tr:not(:has(> td[align])) > td:first-child {
        font-weight: 600;
    }

    .md-typeset table.institution > tbody > tr:not(:has(> td[align])) > td:nth-child(n+2) {
        font-size: 0.75rem;
        color: var(--md-default-fg-color--light);
    }

    /* Markdown tables (Grants, Conference, Media, Languages): first column as a
       title, second as text, the rest (date, place, link) as a caption line. */
    .md-typeset__table {
        display: block;
    }

    .md-typeset table:has(thead) {
        display: block;
    }

    .md-typeset table:has(thead) thead {
        display: none;
    }

    .md-typeset table:has(thead) tbody,
    .md-typeset table:has(thead) tr {
        display: block;
    }

    .md-typeset table:has(thead) tr {
        padding: 0.7em 0;
        border-bottom: 1px solid var(--md-default-fg-color--lightest);
    }

    .md-typeset table:has(thead) tr:last-child {
        border-bottom: none;
    }

    .md-typeset table:has(thead) td {
        display: block;
        padding: 0 !important;
    }

    .md-typeset table:has(thead) td:nth-child(n+3) {
        display: inline-block;
        margin-right: 0.8em;
        font-size: 0.75rem;
        color: var(--md-default-fg-color--light);
    }

    .md-typeset table:has(thead) td:empty {
        display: none;
    }
}

@media print {

    /* Force a light, readable rendering — the PDF is generated via a headless
       browser, so pin the scheme and text color to avoid white-on-white text. */
    :root {
        color-scheme: light;
    }

    body,
    .md-typeset {
        color: #000 !important;
    }

    /* Force embeddable fonts for the PDF. The headless browser cannot embed the
       macOS system font (San Francisco) or the Roboto web font, so it falls back
       to Type3 glyphs that render blank in many PDF viewers. Helvetica/Arial
       (macOS) and Liberation/DejaVu Sans (CI) embed as TrueType (Type0) and
       display everywhere. Screen typography is unaffected. */
    html, body,
    .md-typeset, .md-typeset *,
    h1, h2, h3, h4, h5, h6 {
        font-family: Helvetica, Arial, "Liberation Sans", "DejaVu Sans", sans-serif !important;
    }

    /* Subdue the bright web links to a document-like tone in print. */
    .md-typeset a {
        color: #1f3a5f !important;
    }

    /* Print only the CV content: drop the site chrome (the white header text on
       the unprinted grey bar was the "white font" in the PDF), nav and TOC
       sidebars, footer, and the floating buttons. */
    .md-header,
    .md-sidebar,
    .md-footer,
    .md-content__button,
    .md-source {
        display: none !important;
    }

    .md-main__inner {
        margin-top: 0 !important;
    }

    .md-content {
        max-width: none !important;
    }

    html {
        font-size: 90%!important;
    }

    .details-img {
        width: 75px;
        min-width: 75px;
        max-width: 75px;
    }

    .photo {
        max-width: 120px!important;
        height: auto!important;
    }
    
    .details {
        min-width: 100px;
    }

    /* Neutralise the hardcoded section page-breaks so content flows and fills
       each page instead of leaving large gaps. */
    div[style*="page-break-after"] {
        page-break-after: auto !important;
    }

    /* Keep each section heading with the content that follows it, and never
       split a heading itself. */
    .md-typeset h2,
    .md-typeset h3 {
        break-inside: avoid;
        break-after: avoid;
    }

    /* Give major sections a little breathing room at the top when they do land
       mid-page. */
    .md-typeset h2 {
        margin-top: 1.2em;
    }

}