:root {
    --bg: #f8f9fb;
    --bg-soft: #eceff3;
    --bg-strong: #dbe1e8;

    --surface: #fff;
    --surface-soft: #f2f4f7;
    --surface-hover: var(--surface-soft);

    --text: #1c1f26;
    --text-soft: #4a4f57;
    --text-subtle: #6c717a;

    --accent: #d64032;
    --accent-dark: #ad2f25;
    --accent-soft: rgb(214 64 50 / 8%);

    --line: rgb(0 0 0 / 14%);
    --border-color: var(--line);

    --shadow: 0 8px 22px rgb(0 0 0 / 5.5%);

    --container: 72rem;

    --radius: 1rem;
    --radius-small: 0.5rem;
    --radius-pill: 999px;

    --gap: 1rem;
    --gap-large: 1.5rem;

    --logo-size: 100px;
    --photo-width: 60px;
    --photo-height: 70px;

    --scroll-offset: 6rem;

    --search-highlight-bg: #fff2a8;
    --search-highlight-text: inherit;

    --font-body:
    "DejaVu Serif",
    Georgia,
    "Times New Roman",
    serif;

    --font-monospace:
    "DejaVu Sans Mono",
    "SFMono-Regular",
    Consolas,
    monospace;
}

[data-theme="dark"] {
    --bg: #0d1117;
    --bg-soft: #161b22;
    --bg-strong: #21262d;

    --surface: #161b22;
    --surface-soft: #1c2128;
    --surface-hover: var(--surface-soft);

    --text: #e6edf3;
    --text-soft: #c9d1d9;
    --text-subtle: #8b949e;

    --accent: #ff6b5f;
    --accent-dark: #ff877d;
    --accent-soft: rgb(255 107 95 / 12%);

    --line: rgb(240 246 252 / 12%);
    --border-color: var(--line);

    --shadow: 0 8px 22px rgb(0 0 0 / 35%);

    --search-highlight-bg: #5f4a00;
    --search-highlight-text: #fff;
}

/* ============================================================
 *  Typography & Fonts
 *  ============================================================ */

@font-face {

    font-family: "DejaVu Serif";

    src:
    local("DejaVu Serif"),
    local("DejaVuSerif"),
    url("../fonts/DejaVuSerif-Regular.woff2")
    format("woff2");

    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {

    font-family: "DejaVu Serif";

    src:
    local("DejaVu Serif Bold"),
    local("DejaVuSerif-Bold"),
    url("../fonts/DejaVuSerif-Bold.woff2")
    format("woff2");

    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {

    font-family: "DejaVu Serif";

    src:
    local("DejaVu Serif Italic"),
    local("DejaVuSerif-Italic"),
    url("../fonts/DejaVuSerif-Italic.woff2")
    format("woff2");

    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

@font-face {

    font-family: "DejaVu Serif";

    src:
    local("DejaVu Serif Bold Italic"),
    local("DejaVuSerif-BoldItalic"),
    url("../fonts/DejaVuSerif-BoldItalic.woff2")
    format("woff2");

    font-style: italic;
    font-weight: 700;
    font-display: swap;
}


/* ============================================================
 *  Reset & Base Layout
 *  ============================================================ */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-height: 100vh;
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;

    background: var(--bg);
    color: var(--text);
}

body {
    display: flex;
    flex-direction: column;

    min-height: 100vh;
    margin: 0;

    background-color: transparent;
    color: inherit;

    font-family: var(--font-body);
    line-height: 1.62;
}

main {
    width: 100%;
    flex: 1;
}

main.container {
    padding-top: 2.8rem;
    padding-bottom: 4rem;
}

.container {
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 var(--gap-large);
}

.visually-hidden {
    position: absolute;

    width: 1px;
    height: 1px;

    overflow: hidden;

    clip-path: inset(100%);
}

[id] {
    scroll-margin-top: var(--scroll-offset);
}

/* ============================================================
 *  Typography
 *  ============================================================ */

h1,
h2,
h3 {
    line-height: 1.22;
    margin: 0 0 0.8rem;
}

h1 {
    font-size: clamp(1.35rem, 2.7vw, 2rem);
    letter-spacing: 0.035em;
}

h2 {
    font-size: 1.55rem;
}

h3 {
    font-size: 1.18rem;
}

p {
    margin: 0 0 1rem;
    color: var(--text-soft);
}

ul,
ol {
    padding-left: 1.4rem;
}

li {
    margin: 0.35rem 0;
}

/* ============================================================
 *  Links & Inline Elements
 *  ============================================================ */

a {
    color: var(--accent);
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: underline;
}

a.external::after {
    font-family: "Font Awesome 7 Free", sans-serif;
    font-weight: 900;
    content: "\f08e";
    margin-left: 0.25rem;
    font-size: 0.8em;
}

mark {
    background: var(--search-highlight-bg);
    color: var(--search-highlight-text);

    padding: 0;
    margin: 0;

    border-radius: 0.2em;
}

/* ============================================================
 *  Forms
 *  ============================================================ */

input[type="search"] {
    width: 100%;

    padding: 0.8rem 1rem;

    background: var(--surface);
    color: var(--text);

    border: 1px solid var(--line);
    border-radius: var(--radius-pill);

    font: inherit;
}

input[type="search"]:focus {
    outline: 2px solid var(--accent-soft);
    border-color: var(--accent);
}

/* ============================================================
 *  Common Cards
 *  ============================================================ */

section,
article {
    margin: 1.35rem 0;
    padding: 1.35rem var(--gap-large);

    background: var(--surface);

    border: 1px solid var(--line);
    border-radius: var(--radius);

    box-shadow: var(--shadow);
}

/* ============================================================
 *  Header
 *  ============================================================ */

.site-header {
    padding: 1.15rem 0 1rem;

    background: var(--bg-soft);
    border-bottom: 1px solid var(--line);
}

.conference-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gap);
}

.conference-logo {
    width: var(--logo-size);
    height: var(--logo-size);
    flex: 0 0 auto;
    max-width: 18vw;
}

.conference-logo-dark {
    display: none;
}

[data-theme="dark"] .conference-logo-light {
    display: none;
}

[data-theme="dark"] .conference-logo-dark {
    display: block;
}

.conference-title {
    font-size: clamp(2.7rem, 6vw, 5rem);
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    max-width: 80vw;
}

.conference-title a {
    color: var(--text);
    text-decoration: none;
    display: block;
    overflow: hidden;
}

.conference-divider {
    display: block;

    width: min(500px, 80%);
    height: auto;

    margin: 0.6rem auto 0.45rem;

    color: var(--text-subtle);
    opacity: 0.8;
}

.conference-subtitle {
    text-align: center;
    color: var(--text-soft);

    font-size: clamp(1rem, 2vw, 1.45rem);
    letter-spacing: 0.045em;
}

/* ============================================================
 *  Main Navigation
 *  ============================================================ */

.site-nav {
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.site-nav .container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;

    gap: 1.2rem;

    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
}

.site-nav a {
    color: var(--text-soft);

    font-size: 0.92rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.theme-toggle {
    padding: 0.25rem 0.5rem;

    border: 0;
    background: transparent;
    color: var(--text-soft);

    cursor: pointer;

    font-size: 1.1rem;
}

.theme-toggle:hover {
    color: var(--text);
}

/* ============================================================
 *  Page Navigation
 *  ============================================================ */

.page-nav-toggle {

    display: none;
    color: var(--text);
    line-height: 1;
}

.page-nav-toggle i {
    line-height: 1;
}

.page-nav {
    position: sticky;
    top: 0;
    z-index: 100;

    padding: 0.5rem 0;

    background: var(--bg);
}

.page-nav a {
    display: inline-block;

    padding: 0.4rem 0.8rem;

    background: var(--surface);

    border: 1px solid var(--line);
    border-radius: var(--radius-pill);

    font-size: 0.9rem;
    margin: 0.1rem;
}
@media (width <= 960px) {

    .page-nav-toggle {

        display: flex;

        position: fixed;

        top: 0.8rem;
        left: 0.8rem;

        z-index: 1100;

        width: 2.4rem;
        height: 2.4rem;

        align-items: center;
        justify-content: center;

        background: var(--surface);

        border: 1px solid var(--line);
        border-radius: 50%;

        box-shadow: var(--shadow);

        font-size: 1.3rem;

        cursor: pointer;
    }

    .page-nav {

        position: fixed;

        top: 0.8rem;
        left: 4rem;

        z-index: 1050;

        display: none;

        max-width: calc(100vw - 5rem);

        padding: 0.5rem;

        background: var(--surface);

        border: 1px solid var(--line);
        border-radius: var(--radius);

        box-shadow: var(--shadow);
    }

    .page-nav.open {

        display: flex;

        flex-wrap: wrap;

        gap: 0.35rem;
    }
}

/* ============================================================
 *  Footer
 *  ============================================================ */

.site-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--gap);

    margin-top: 3rem;
    padding: 1rem var(--gap-large);

    background: var(--bg-strong);
    color: var(--text-subtle);

    border-top: 1px solid var(--line);

    font-size: 0.9rem;
}

/* ============================================================
 *  Home Page
 *  ============================================================ */

.conference-title-h1 {
    font-size: 1.1rem;
}

.home-actions {
    display: grid;

    grid-template-columns:
    repeat(
        auto-fit,
        minmax(260px, 1fr)
    );

    gap: var(--gap);

    margin: 0 0 2rem;
}

.action-card {
    display: block;

    padding: 1.25rem;

    color: inherit;
    text-decoration: none;

    border: 1px solid var(--border-color);
    border-radius: var(--radius-small);

    transition:
    background-color 0.15s,
    border-color 0.15s;
}

.action-card:hover {
    background: var(--surface-hover);
}

.action-card h2 {
    margin-top: 0;
}

.seminar-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 3rem;
}

/* ============================================================
 *  Talks & Sessions
 *  ============================================================ */

.session-talks {
    list-style: none;
    margin: 0;
    padding: 0;
}

.session-talks li {
    position: relative;

    margin-bottom: 0.75rem;
    padding-left: 5.5rem;
}

.session-talks .talk-time {
    position: absolute;
    left: 0;
    top: 0;

    width: 4.5rem;

    text-align: right;
    white-space: nowrap;
}

[id^="talk-"]:target {
    animation:
    talk-highlight
    2.5s
    ease-out;

    border-radius: var(--radius-small);

    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

@keyframes talk-highlight {
    0% {
        background: var(--search-highlight-bg);

        box-shadow:
        0 0 0 4px
        var(--search-highlight-bg);
    }

    100% {
        background: transparent;
        box-shadow: none;
    }
}

/* ============================================================
 *  Programme
 *  ============================================================ */

.programme-day {
    margin-top: 3rem;
}

.programme-slot {
    margin: 1.25rem 0;
    padding: 1rem 1.25rem;

    background: var(--surface);

    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.programme-slot h3 {
    margin-top: 0;
}

.programme-slot-list {
    margin-bottom: 0;
}

.programme-entry {
    margin: 0.8rem 0;

    font-size: 1.15rem;
    font-weight: 600;
}

.programme-time {
    display: inline-block;

    min-width: 8rem;

    white-space: nowrap;
}

.programme-title {
    margin-left: 1rem;
}

.programme-seminar summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--gap);
    list-style: none;
    cursor: pointer;
}

.programme-seminar-title {
    font-weight: 600;
}

.programme-seminar-title::before {
    font: var(--fa-font-solid);
    content: "\f105";   /* angle-right */
    display: inline-block;
    width: 1.2em;
}

.programme-seminar[open]
.programme-seminar-title::before {
    content: "\f103";   /* angles-down */
}

.programme-seminar[open] .session-talks {
    border-left: 0.1rem solid var(--border-color);
    margin-left: 0.325rem;
}

.programme-seminar-meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;

    color: var(--text-subtle);

    font-size: 0.9rem;
}

.programme-seminar-link {
    color: var(--text-subtle);
}

.programme-seminar-link:hover {
    color: var(--accent);
}

/* ============================================================
 *  Search
 *  ============================================================ */

.search-box {
    margin-bottom: 2rem;
}

#search-input {
font-size: 1.05rem;
border-radius: 0.8rem;
}

.search-status {
    margin-top: 0.6rem;

    color: var(--text-subtle);
}

.search-result {
    margin: 1.4rem 0;
    padding: 1.25rem;

    background: var(--surface);

    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.search-result-meta,
.search-result-authors {
    margin: 0.35rem 0;

    color: var(--text-soft);
}

.search-result-excerpt {
    margin-top: 0.8rem;
}

.search-result-links {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);

    margin-top: 0.9rem;
}

/* ============================================================
 *  Abstracts, Figures & TeX Content
 *  ============================================================ */

.abstract {
    max-width: 100%;
    padding: 1.2rem 1.4rem;
    margin-bottom: 1.4rem;

    background: var(--surface);

    border-left: 4px solid var(--accent);

    line-height: 1.6;
}

.abstract::after {
    content: "";
    display: block;
    clear: both;
}

.tex-content {
    line-height: 1.6;
}

.tex-content p {
    margin: 0 0 1rem;
}

figure {
    float: right;

    width: min(45%, 550px);
    min-width: 320px;

    margin: 0 0 1.5rem 2rem;
    padding: var(--gap);

    background: var(--surface);

    border: 1px solid var(--line);
    border-radius: var(--radius);
}

figure img {
    display: block;

    width: 100%;
    height: auto;
}

figcaption {
    margin-top: 0.8rem;

    color: var(--text-subtle);

    font-size: 0.9rem;
    line-height: 1.4;
}

.figure-pdf {
    display: block;

    width: 100%;
    height: 24rem;

    background: var(--surface-soft);

    border: 0;
}

/* ============================================================
 *  References
 *  ============================================================ */

.references {
    list-style: none;
    counter-reset: refs;

    padding-left: 0;
}

.references li {
    counter-increment: refs;

    position: relative;

    margin-bottom: 0.5rem;
    padding-left: 1.9rem;
}

.references li:nth-child(n+10) {
    padding-left: 2.5rem;
}

.references li::before {
    content: "[" counter(refs) "]";

    position: absolute;
    left: 0;

    color: var(--text);
}

/* ============================================================
 *  Floating Controls
 *  ============================================================ */

.back-to-top {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;

    z-index: 1000;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 2.5rem;
    height: 2.5rem;

    background: var(--accent);
    color: white;

    border-radius: 50%;

    box-shadow: var(--shadow);

    font-size: 1.2rem;
    font-weight: bold;
    text-decoration: none;

    opacity: 0;
    visibility: hidden;

    transition:
    opacity 0.2s,
    transform 0.2s,
    visibility 0.2s;
}

.back-to-top.visible {
    opacity: 0.8;
    visibility: visible;
}

.back-to-top:hover {
    opacity: 1;
    transform: translateY(-2px);
}

/* ============================================================
 *  Responsive
 *  ============================================================ */

@media (width <= 1070px) {
    .theme-toggle {
        position: fixed;
        top: 0.8rem;
        right: 0.8rem;

        z-index: 1000;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 2.4rem;
        height: 2.4rem;

        background: var(--surface);

        border: 1px solid var(--line);
        border-radius: var(--radius-pill);

        box-shadow: var(--shadow);

        opacity: 0.86;
    }

    .theme-toggle:hover {
        opacity: 1;
    }

    .site-footer {
        flex-direction: column;
        gap: 0.5rem;
    }

    .seminar-list {
        grid-template-columns: 1fr;
    }
}

@media (width <= 768px) {
    figure {
        float: none;

        width: auto;
        max-width: none;

        margin: 1rem 0;
    }
}

@media (width <= 640px) {
    .container {
        padding-left: var(--gap);
        padding-right: var(--gap);
    }

    .site-nav .container {
        gap: 0.75rem;
    }

    section,
    article {
        padding: var(--gap);
        border-radius: 0.75rem;
    }
}

@media (width <= 520px) {
    .person-card {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
 *  Print
 *  ============================================================ */

@media print {

    @page {
        margin: 15mm;
    }

    html,
    body {

        background: white !important;
        color: black !important;

        min-height: auto !important;
        height: auto !important;

        font-size: 11pt;
        line-height: 1.4;
    }

    .site-header,
    .site-nav,
    .site-footer,
    .back-to-top,
    .theme-toggle,
    .page-nav,
    .page-nav-toggle {

        display: none !important;
    }

    body {

        display: block !important;
        min-height: auto;
    }

    main {
        flex: none !important;
    }

    main,
    .container {

        max-width: none;
        width: auto;

        margin: 0;
        padding: 0;
    }

    section,
    article,
    .abstract,
    .person-card {

        border: none !important;
        box-shadow: none !important;
        background: transparent !important;

        margin: 0;
        padding: 0;
    }

    h1 {

        font-size: 20pt;
        margin-bottom: 0.5cm;
    }

    h2 {

        font-size: 14pt;
        margin-top: 0.6cm;

        break-after: avoid;
    }

    h3 {

        break-after: avoid;
    }

    p,
    li {

        orphans: 3;
        widows: 3;
    }

    figure {

        float: right;

        width: 50%;

        max-width: 50%;

        min-width: 0;

        margin:
        0
        0
        0.5cm
        0.8cm;

        break-inside: avoid;
    }

    figure img {

        width: 100%;
        height: auto;
    }

    .figure-pdf {

        height: 12cm;
    }

    .references {

        font-size: 9pt;
    }

    a {

        color: black !important;
        text-decoration: none;
    }

    a.external::after {

        content: "";
    }

    mjx-container,
    mjx-container *,
    .MathJax,
    .MathJax * {

        color: black !important;
    }
}


/* ============================================================
 *  Person Cards
 *  ============================================================ */

.person-card {
    display: grid;
    grid-template-columns: 72px 1fr;
    align-items: start;
    gap: var(--gap);

    padding: 0.9rem 1rem;

    background: var(--surface);

    border: 1px solid var(--line);
    border-radius: 0.9rem;

    box-shadow: var(--shadow);
}

.person-photo-link {
    display: block;

    width: var(--photo-width);
    height: var(--photo-height);
}

.person-photo {
    display: block;

    width: var(--photo-width);
    height: var(--photo-height);

    object-fit: cover;

    background: var(--bg-soft);

    border-radius: 0.25rem;
}

.person-body {
    padding: 0;
}

.person-body h3 {
    margin: 0 0 0.25rem;

    font-size: 1.08rem;
}

.person-org {
    margin-top: 0.25rem;
}

.person-affiliation {
    color: var(--text-soft);
    font-size: 0.95rem;
}

.person-location,
.person-country {
    color: var(--text-subtle);
    font-size: 0.9rem;
}

.person-bio {
    grid-column: 1 / -1;

    margin-top: 0.25rem;

    margin-left: calc(
        var(--photo-width)
        + var(--gap)
    );

    padding-left: 1rem;

    border-left: 2px solid
    var(--border-color);
}

.person-bio p:last-child {
    margin-bottom: 0;
}


/* ============================================================
 *  Company Logos
 *  ============================================================ */

.organisations-layout {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 2rem;

    margin-top: 2rem;
}

.organisations {
    flex: 1 1 0;
    margin-top: 2rem;
}

.organisations:first-child {
    text-align: left;
}

.organisations:last-child {
    text-align: right;
}

.organisations h2 {
    margin: 1.5rem 0 0.75rem;
}

.logo-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    align-items: center;
}

.organisations:first-child .logo-grid {
    justify-content: flex-start;
}

.organisations:last-child .logo-grid {
    justify-content: flex-end;
}

.logo-link {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 11rem;
    height: 5rem;

    padding: 0.4rem 1rem;

    background: #fff;

    border: 1px solid var(--line);
    border-radius: var(--radius-small);
}

.logo-link:hover {
    transform: translateY(-1px);
}

.logo-image {
    display: block;

    max-width: 100%;
    max-height: 4rem;

    width: auto;
    height: 4rem;
}


@media (width <= 900px) {

    .organisations-layout {
        flex-direction: column;
        gap: 1.5rem;
    }

    .organisations {
        width: 100%;
    }

    .organisations:first-child .logo-grid,
    .organisations:last-child .logo-grid {
        justify-content: center;
    }

    .organisations:first-child,
    .organisations:last-child {
        text-align: center;
    }

}

/* ============================================================
 *  Photo preview
 *  ============================================================ */

#image-preview {
padding: 0;
border: none;
background: transparent;
}

#image-preview::backdrop {
background: rgb(
    0 0 0 / 80%
);
}

#image-preview-img {
    display: block;

    max-width: 90vw;
    max-height: 90vh;

    width: auto;
    height: auto;
}

#image-preview-close {
    position: fixed;

    top: 1rem;
    right: 1rem;

    padding: 0;

    border: none;
    background: none;

    color: white;

    font-size: 2rem;

    cursor: pointer;

    z-index: 1000;
}

#image-preview-close:hover {
    opacity: 0.8;
}