:root {
    --bg: #ffffff;
    --fg: #1a1a1a;
    --muted: #6a6a6a;
    --accent: #15803d;
    --border: #e6e6e6;
    --measure: 64ch;
    --mono:
        ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas,
        "Liberation Mono", "DejaVu Sans Mono", monospace;
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #0f1110;
        --fg: #e7e7e7;
        --muted: #9aa09a;
        --accent: #4ade80;
        --border: #262a27;
    }
}

* {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    background: var(--bg);
    color: var(--fg);
    font-family: var(--mono);
    font-size: 16px;
    line-height: 1.7;
}

main {
    max-width: var(--measure);
    margin: 0 auto;
    padding: 3rem 1.5rem 4rem;
}

.avail {
    color: var(--muted);
    font-size: 0.85rem;
    margin: 0 0 1.6rem;
}
.avail::before {
    content: "// ";
}

h1 {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.25;
    margin: 0;
}
h1::before {
    content: "# ";
    color: var(--accent);
}

.subtitle {
    color: var(--muted);
    margin: 0.25rem 0 0;
}

section {
    margin-top: 2.25rem;
}

h2 {
    font-size: 1rem;
    font-weight: 500;
    margin: 0 0 0.5rem;
}
h2::before {
    content: "## ";
    color: var(--accent);
}

p {
    margin: 0 0 0.6rem;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
ul li {
    padding-left: 1.25rem;
    position: relative;
}
ul li::before {
    content: "-";
    color: var(--muted);
    position: absolute;
    left: 0;
}

dl.contact,
dl.fields {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.3rem 1.5rem;
    margin: 0;
}
dl.contact dt,
dl.fields dt {
    color: var(--muted);
}
dl.contact dd,
dl.fields dd {
    margin: 0;
}

/* Bootstrap Icons — self-hosted subset (envelope-fill, linkedin) */
@font-face {
    font-family: "bootstrap-icons";
    font-display: swap;
    src: url("icons.woff2") format("woff2");
}
.bi {
    display: inline-flex;
    font-family: "bootstrap-icons";
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    text-rendering: auto;
}
.bi-envelope-fill::before {
    content: "\f32c";
}
.bi-linkedin::before {
    content: "\f472";
}

/* Contact labels that carry a leading icon */
dl.contact dt.with-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.45em;
}

.pubs {
    margin: 0;
    color: var(--muted);
}

a {
    color: var(--accent);
    text-underline-offset: 2px;
}
a:hover {
    text-decoration: none;
}

a:focus-visible,
:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

footer {
    margin-top: 2.75rem;
    padding-top: 1.5rem;
    border-top: 0.5px solid var(--border);
    font-size: 0.85rem;
    color: var(--muted);
}

/* Narrow screens: tighten spacing, keep lines comfortable */
@media (max-width: 30rem) {
    body {
        font-size: 15px;
    }
    main {
        padding: 2rem 1.1rem 3rem;
    }
    dl.contact,
    dl.fields {
        grid-template-columns: 1fr;
        gap: 0;
    }
    dl.contact dd,
    dl.fields dd {
        margin: 0 0 0.4rem;
    }
}

/* Print: single A4 page, ink-friendly, nav hidden */
@page {
    size: A4;
    margin: 16mm;
}

@media print {
    :root {
        --bg: #ffffff;
        --fg: #000000;
        --muted: #444444;
        --accent: #000000;
        --border: #000000;
    }
    body {
        font-size: 11pt;
        line-height: 1.5;
    }
    main {
        max-width: none;
        margin: 0;
        padding: 0;
    }
    section {
        margin-top: 1.1rem;
        break-inside: avoid;
    }
    a {
        color: #000;
        text-decoration: underline;
    }
    footer {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
    }
}