:root {
    color-scheme: light dark;
    --text: #2a2a3e;
    --muted: #596477;
    --accent: #285fcf;
    --purple: #8052b1;
    --surface: rgba(255, 255, 255, 0.9);
    --border: rgba(46, 111, 242, 0.16);
    --soft: rgba(46, 111, 242, 0.07);
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-padding-top: 8rem; }
body {
    margin: 0;
    min-height: 100vh;
    font-family: var(--font-sans);
    line-height: 1.8;
    color: var(--text);
    background: linear-gradient(135deg, #fefdfb 0%, #f5f3ff 50%, #fff8fc 100%);
}
a { color: var(--accent); text-underline-offset: 0.2em; }
a:hover { color: var(--purple); }
a:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; border-radius: 3px; }
.container { width: min(100%, 920px); margin-inline: auto; padding-inline: 24px; }
nav {
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--surface);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border);
    box-shadow: 0 2px 20px rgba(46, 111, 242, 0.06);
}
nav .container {
    width: min(100%, 1280px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 2rem;
    padding-block: 1rem;
}
.brand { font-size: 1.3rem; font-weight: 750; text-decoration: none; }
.breadcrumbs { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; font-size: 0.85rem; color: var(--muted); }
.breadcrumbs li + li::before { content: '›'; padding-inline: 0.65rem; color: var(--purple); }
.breadcrumbs a { color: var(--muted); text-decoration: none; }
.breadcrumbs a:hover { color: var(--accent); text-decoration: underline; }
header.hero { padding-block: clamp(3rem, 7vw, 6rem) 2.5rem; }
.kicker {
    display: inline-block;
    margin: 0 0 1.5rem;
    padding: 0.35rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: 2rem;
    background: var(--soft);
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.75rem;
    font-weight: 750;
}
h1 {
    margin: 0 0 1.5rem;
    max-width: 17ch;
    font-size: clamp(2.6rem, 6vw, 4.8rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.045em;
    color: var(--accent);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
    h1 {
        background: linear-gradient(120deg, #2e6ff2 0%, #8b5fbf 65%, #008f87 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }
}
.subtitle { max-width: 58ch; margin: 0 0 1.5rem; font-size: clamp(1.15rem, 2.5vw, 1.4rem); line-height: 1.6; color: var(--muted); }
.meta, .byline { font-size: 0.95rem; color: var(--muted); }
.meta { padding-left: 1.2rem; border-left: 3px solid var(--purple); }
.meta p { margin: 0.4rem 0; }
.note { margin: 1.75rem 0 0; padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: 16px; background: var(--soft); font-size: 0.95rem; }
main { padding-bottom: 4rem; }
section.part, article {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 24px;
    padding: clamp(1.25rem, 4vw, 3rem);
    box-shadow: 0 12px 40px rgba(46, 111, 242, 0.06);
    overflow-wrap: break-word;
}
section.part { margin: 0 0 1.5rem; }
h2 { color: var(--accent); font-size: clamp(1.35rem, 3vw, 1.8rem); line-height: 1.3; letter-spacing: -0.025em; }
section.part h2 { margin: 0 0 0.75rem; }
article { font-size: 1.075rem; }
article h2 { margin: 2.5rem 0 1rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
section.part p, article p { margin: 0 0 1.2rem; }
section.part p:last-child, article > :last-child { margin-bottom: 0; }
.slide-ref { color: var(--purple); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.ts { display: inline-block; margin-right: 0.6rem; padding: 0.1rem 0.45rem; border-radius: 6px; background: var(--soft); color: var(--accent); font: 0.8rem/1.6 'SF Mono', Monaco, Consolas, monospace; }
article blockquote { margin: 1.75rem 0; padding: 1rem 1.5rem; border-left: 3px solid var(--purple); border-radius: 0 12px 12px 0; background: var(--soft); color: var(--muted); font-style: italic; }
code, pre { font-family: 'SF Mono', Monaco, Consolas, monospace; }
article pre { padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: 12px; background: var(--soft); font-size: 0.9rem; overflow-x: auto; }
article ol { padding-left: 1.4rem; }
article li { margin-bottom: 0.5rem; }
.endnote { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.95rem; }
footer { padding-block: 2rem; border-top: 1px solid var(--border); background: var(--surface); color: var(--muted); font-size: 0.9rem; }
footer p { margin: 0.4rem 0; }
.talk-photo { margin: 2rem 0; }
.talk-photo img { display: block; width: 100%; height: auto; border-radius: 16px; border: 1px solid var(--border); }
.talk-photo figcaption { margin-top: 0.75rem; color: var(--muted); font-size: 0.85rem; line-height: 1.6; }
.talk-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-block: 2rem; }
.talk-gallery .talk-photo { margin: 0; min-width: 0; }
@media (max-width: 600px) {
    .talk-gallery { grid-template-columns: 1fr; }
    .container { padding-inline: 16px; }
    nav { position: static; }
    nav .container { gap: 0.5rem; }
    .breadcrumbs { font-size: 0.75rem; }
    header.hero { padding-top: 2.5rem; }
    section.part, article { border-radius: 18px; }
}
@media (prefers-color-scheme: dark) {
    :root { --text: #e7e7f2; --muted: #b3b8cd; --accent: #95b8ff; --purple: #c5a2ed; --surface: rgba(27, 30, 49, 0.94); --border: rgba(149, 184, 255, 0.2); --soft: rgba(149, 184, 255, 0.08); }
    body { background: linear-gradient(135deg, #101725, #1c1830 55%, #251a2b); }
    h1 { background-image: linear-gradient(120deg, #95b8ff, #c5a2ed 65%, #6ce1d4); }
}
@media print {
    body { background: white; color: black; }
    nav { position: static; }
    h1 { background: none; color: black; }
    section.part, article { background: white; box-shadow: none; border-color: #ccc; }
    a, h2, .subtitle, .meta, .byline, .slide-ref, .ts, footer { color: black; }
}