:root {
    --shell-bg: #111822;
    --shell-surface: #18222f;
    --shell-surface-raised: #202d3d;
    --shell-text: #d5dce7;
    --shell-muted: #8492a5;
    --shell-border: #304257;
    --shell-accent: #35e0a1;
    --shell-cyan: #7dd3fc;
    --shell-magenta: #e697ff;
    --shell-yellow: #facc6b;
    --shell-danger: #ff7b88;
    --shell-shadow: 0 18px 60px rgba(0, 0, 0, .28);
    --shell-mono: ui-monospace, "Cascadia Code", "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    --shell-body: var(--gh-font-body, var(--shell-mono));
    --shell-heading: var(--gh-font-heading, var(--shell-mono));
}

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

html {
    min-height: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: 5.5rem;
    background: var(--shell-bg);
}

body {
    min-width: 320px;
    margin: 0;
    color: var(--shell-text);
    background:
        radial-gradient(circle at 90% -10%, rgba(125, 211, 252, .08), transparent 26rem),
        radial-gradient(circle at 0 35%, rgba(230, 151, 255, .055), transparent 24rem),
        var(--shell-bg);
    font-family: var(--shell-body);
    font-size: 16px;
    line-height: 1.75;
    text-rendering: optimizeLegibility;
}

button,
input,
textarea,
select {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

img,
svg,
video {
    display: block;
    max-width: 100%;
}

img {
    height: auto;
}

a {
    color: var(--shell-accent);
    text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
    text-underline-offset: .17em;
    transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}

a:hover {
    color: var(--shell-cyan);
}

a:focus-visible,
button:focus-visible,
.is-zoomable:focus-visible {
    outline: 2px solid var(--shell-cyan);
    outline-offset: 3px;
}

::selection {
    color: #06130e;
    background: var(--shell-accent);
}

[hidden] {
    display: none !important;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    z-index: 100;
    top: .75rem;
    left: .75rem;
    padding: .6rem .9rem;
    color: #07130f;
    background: var(--shell-accent);
    transform: translateY(-150%);
}

.skip-link:focus {
    transform: translateY(0);
}

.reading-progress {
    position: fixed;
    z-index: 50;
    top: 0;
    right: 0;
    left: 0;
    height: 2px;
    pointer-events: none;
}

.reading-progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, var(--shell-accent), var(--shell-cyan));
    box-shadow: 0 0 .75rem rgba(53, 224, 161, .72);
    transform: scaleX(0);
    transform-origin: left center;
}

.site-header {
    position: sticky;
    z-index: 30;
    top: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--shell-border) 74%, transparent);
    background: rgba(17, 24, 34, .88);
    backdrop-filter: blur(16px);
}

.site-header__inner {
    display: flex;
    align-items: center;
    width: min(1240px, calc(100% - 3rem));
    min-height: 3.65rem;
    margin: 0 auto;
    gap: 1.4rem;
}

.site-brand {
    display: inline-flex;
    flex: 0 1 auto;
    align-items: center;
    min-width: 0;
    gap: .6rem;
    color: var(--shell-text);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .045em;
    text-decoration: none;
    text-transform: uppercase;
}

.site-brand:hover {
    color: var(--shell-accent);
}

.site-brand img {
    width: auto;
    max-width: 10.5rem;
    max-height: 1.9rem;
}

.site-brand__mark {
    color: var(--shell-accent);
    font-size: 1.2rem;
    line-height: 1;
}

.site-nav {
    min-width: 0;
    margin-left: auto;
}

.site-nav__menu ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
    padding: 0;
    gap: .15rem;
    list-style: none;
}

.site-nav__menu a {
    display: block;
    padding: .3rem .52rem;
    border: 1px solid transparent;
    color: var(--shell-muted);
    font-size: .79rem;
    letter-spacing: .03em;
    text-decoration: none;
}

.site-nav__menu a:hover,
.site-nav__menu .nav-current a {
    border-color: color-mix(in srgb, var(--shell-accent) 45%, transparent);
    color: var(--shell-accent);
    background: rgba(53, 224, 161, .08);
}

.site-nav__menu .nav-external a::after {
    margin-left: .28rem;
    color: var(--shell-cyan);
    content: "↗";
}

.site-nav__toggle {
    display: none;
    padding: .32rem .5rem;
    border: 1px solid var(--shell-border);
    color: var(--shell-text);
    background: var(--shell-surface);
    cursor: pointer;
}

.site-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .5rem;
}

.icon-button,
.back-to-top {
    display: inline-grid;
    width: 2rem;
    height: 2rem;
    padding: 0;
    place-items: center;
    border: 1px solid var(--shell-border);
    color: var(--shell-muted);
    background: transparent;
    cursor: pointer;
}

.icon-button:hover,
.back-to-top:hover {
    border-color: var(--shell-accent);
    color: var(--shell-accent);
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 2.25rem;
    padding: .45rem .85rem;
    border: 1px solid var(--shell-accent);
    color: #07130f;
    background: var(--shell-accent);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .055em;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
}

.button:hover {
    border-color: var(--shell-cyan);
    color: #061015;
    background: var(--shell-cyan);
}

.button--quiet {
    color: var(--shell-accent);
    background: transparent;
}

.button--quiet:hover {
    color: #07130f;
    background: var(--shell-accent);
}

.site-actions .button {
    min-height: 1.95rem;
    padding-inline: .65rem;
    font-size: .67rem;
}

.site-main {
    width: min(1120px, calc(100% - 3rem));
    min-height: 64vh;
    margin: 0 auto;
    padding: clamp(2.75rem, 6vw, 5.25rem) 0;
}

.site-main--home {
    padding-top: clamp(1.25rem, 3vw, 2.5rem);
}

.home-hero {
    position: relative;
    display: grid;
    overflow: hidden;
    align-items: center;
    margin: 0 0 clamp(2.25rem, 4vw, 3.25rem);
    padding: clamp(1.25rem, 3vw, 2.25rem);
    border: 1px solid var(--shell-border);
    background:
        linear-gradient(100deg, rgba(13, 21, 31, .98) 18%, rgba(13, 21, 31, .77) 62%, rgba(13, 21, 31, .5)),
        var(--hero-image, none) center / cover,
        var(--shell-surface);
    box-shadow: 0 12px 36px rgba(0, 0, 0, .16);
}

.home-hero::after {
    position: absolute;
    right: 0;
    bottom: 0;
    width: clamp(10rem, 34vw, 27rem);
    height: 1px;
    content: "";
    background: linear-gradient(90deg, transparent, var(--shell-accent));
}

.home-hero__grid {
    position: absolute;
    z-index: 0;
    inset: 0;
    opacity: .2;
    background-image: linear-gradient(rgba(125, 211, 252, .17) 1px, transparent 1px), linear-gradient(90deg, rgba(125, 211, 252, .17) 1px, transparent 1px);
    background-size: 2.5rem 2.5rem;
    mask-image: linear-gradient(90deg, #000, transparent 78%);
}

.home-hero__content {
    position: relative;
    z-index: 1;
    width: min(52rem, 100%);
}

.eyebrow,
.prompt {
    margin: 0 0 .75rem;
    color: var(--shell-magenta);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    line-height: 1.35;
    text-transform: uppercase;
}

.prompt {
    color: var(--shell-accent);
}

.home-hero h1,
.listing-header h1,
.article-header h1,
.error-page h1 {
    margin: 0;
    color: var(--shell-text);
    font-family: var(--shell-heading);
    font-size: clamp(2.25rem, 6vw, 5.5rem);
    font-weight: 700;
    letter-spacing: -.065em;
    line-height: .98;
    overflow-wrap: anywhere;
}

.home-hero h1 {
    font-size: clamp(1.9rem, 4.2vw, 3.45rem);
}

.home-hero__content > p:not(.eyebrow) {
    max-width: 42rem;
    margin: .9rem 0 0;
    color: #b6c2d0;
    font-size: clamp(.94rem, 1.6vw, 1.08rem);
}

.home-hero__status {
    display: flex;
    flex-wrap: wrap;
    margin: 1rem 0 0;
    padding: 0;
    gap: .3rem .95rem;
    color: var(--shell-muted);
    font-size: .68rem;
    letter-spacing: .045em;
    list-style: none;
    text-transform: uppercase;
}

.home-hero__status li {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
}

.home-hero__status li + li {
    padding-left: .95rem;
    border-left: 1px solid var(--shell-border);
}

.home-hero__status li:first-child span {
    width: .38rem;
    height: .38rem;
    border-radius: 50%;
    background: var(--shell-accent);
    box-shadow: 0 0 .6rem var(--shell-accent);
}

.home-hero__actions {
    display: flex;
    flex-wrap: wrap;
    margin-top: 1.1rem;
    gap: .75rem;
}

.lab-index {
    display: grid;
    grid-template-columns: minmax(8rem, 12rem) minmax(0, 1fr);
    align-items: center;
    margin: 0 0 clamp(2rem, 4vw, 3rem);
    padding: .75rem 0;
    border-top: 1px solid var(--shell-border);
    border-bottom: 1px solid var(--shell-border);
    gap: 1rem;
}

.lab-index .eyebrow {
    margin: 0;
}

.lab-index__tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .35rem;
}

.lab-index__tags a {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .3rem .5rem;
    border: 1px solid color-mix(in srgb, var(--shell-border) 80%, transparent);
    color: var(--shell-text);
    font-size: .7rem;
    line-height: 1.15;
    text-decoration: none;
}

.lab-index__tags a:hover {
    border-color: var(--shell-accent);
    color: var(--shell-accent);
    background: rgba(53, 224, 161, .06);
}

.lab-index__tags span {
    color: var(--shell-muted);
    font-size: .64rem;
}

.section-heading {
    margin: 0 0 2rem;
}

.section-heading h2,
.listing-header h1 {
    font-size: clamp(1.9rem, 4vw, 3.3rem);
}

.listing-header {
    max-width: 48rem;
    margin: 0 0 2.75rem;
}

.listing-header > p:last-child {
    margin: 1.3rem 0 0;
    color: var(--shell-muted);
}

.listing-header--author {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

.listing-header--author img {
    width: 5.5rem;
    height: 5.5rem;
    border: 1px solid var(--shell-accent);
    border-radius: 50%;
    object-fit: cover;
}

.post-feed {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.home-feed {
    grid-template-columns: 1fr;
    gap: 0;
    border-top: 1px solid var(--shell-border);
}

.home-feed .section-heading {
    display: block;
    grid-column: 1;
    margin: 0;
    padding: .8rem 0;
}

.home-feed .section-heading .eyebrow {
    margin: 0;
}

.home-feed .post-card {
    display: grid;
    grid-template-columns: minmax(9rem, 14rem) minmax(0, 1fr);
    align-items: center;
    border: 0;
    border-bottom: 1px solid var(--shell-border);
    background: transparent;
    box-shadow: none;
}

.home-feed .post-card:hover {
    border-color: var(--shell-border);
    background: linear-gradient(90deg, rgba(53, 224, 161, .06), transparent 56%);
    box-shadow: none;
    transform: none;
}

.home-feed .post-card__image {
    align-self: stretch;
    border: 0;
    background: transparent;
}

.home-feed .post-card__image img {
    height: 100%;
    min-height: 9rem;
    aspect-ratio: 4 / 3;
}

.home-feed .post-card__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    padding: 1.25rem clamp(1rem, 3vw, 2.25rem);
}

.home-feed .post-card--text-only .post-card__body {
    grid-column: 1 / -1;
}

.home-feed .post-card__meta,
.home-feed .post-card h2,
.home-feed .post-card p,
.home-feed .post-card .post-type {
    grid-column: 1;
}

.home-feed .post-card .post-type {
    margin-bottom: .7rem;
}

.home-feed .post-card h2 {
    margin-top: .5rem;
    font-size: clamp(1.15rem, 2vw, 1.45rem);
}

.home-feed .post-card p:not(.eyebrow) {
    margin: .55rem 0 0;
    font-size: .82rem;
}

.home-feed .post-card__read {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
    margin-top: .85rem;
    white-space: nowrap;
}

.post-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid var(--shell-border);
    background: linear-gradient(145deg, rgba(32, 45, 61, .6), rgba(24, 34, 47, .6));
    box-shadow: 0 9px 28px rgba(0, 0, 0, .11);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.post-card:hover {
    border-color: color-mix(in srgb, var(--shell-accent) 65%, var(--shell-border));
    box-shadow: 0 18px 40px rgba(0, 0, 0, .2);
    transform: translateY(-3px);
}

.post-card__image {
    display: block;
    overflow: hidden;
    border-bottom: 1px solid var(--shell-border);
    background: #0c121a;
}

.post-card__image img {
    width: 100%;
    aspect-ratio: 16 / 8.5;
    object-fit: cover;
    transition: transform .35s ease;
}

.post-card:hover .post-card__image img {
    transform: scale(1.035);
}

.post-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    padding: clamp(1.25rem, 3vw, 1.8rem);
}

.post-type {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: .22rem .42rem;
    border: 1px solid color-mix(in srgb, var(--shell-border) 82%, transparent);
    color: var(--shell-cyan);
    background: rgba(125, 211, 252, .055);
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
}

.post-type--field {
    color: var(--shell-accent);
    background: rgba(53, 224, 161, .055);
}

.post-type--deep {
    color: var(--shell-magenta);
    background: rgba(230, 151, 255, .055);
}

.post-type--lab {
    color: var(--shell-yellow);
    background: rgba(250, 204, 107, .055);
}

.post-type--advisory {
    color: var(--shell-danger);
    background: rgba(255, 123, 136, .055);
}

.article-header .post-type {
    margin-bottom: .85rem;
}

.post-card__meta,
.article-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45rem;
    color: var(--shell-muted);
    font-size: .73rem;
    line-height: 1.4;
}

.post-card__meta a {
    color: var(--shell-yellow);
    text-decoration: none;
}

.post-card h2 {
    margin: .8rem 0 0;
    font-family: var(--shell-heading);
    font-size: clamp(1.22rem, 2.3vw, 1.65rem);
    letter-spacing: -.04em;
    line-height: 1.2;
}

.post-card h2 a {
    color: var(--shell-text);
    text-decoration: none;
}

.post-card h2 a:hover {
    color: var(--shell-accent);
}

.post-card p:not(.eyebrow) {
    margin: .8rem 0 1.15rem;
    color: #a7b3c1;
    font-size: .88rem;
    line-height: 1.7;
}

.post-card__read {
    margin-top: auto;
    color: var(--shell-accent);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-decoration: none;
    text-transform: uppercase;
}

.post-card__read span {
    display: inline-block;
    transition: transform .16s ease;
}

.post-card__read:hover span {
    transform: translateX(.2rem);
}

.pagination {
    display: flex;
    justify-content: space-between;
    margin: 3rem 0 0;
    color: var(--shell-muted);
    font-size: .8rem;
}

.pagination a {
    padding: .35rem .65rem;
    border: 1px solid var(--shell-border);
    color: var(--shell-text);
    text-decoration: none;
}

.pagination a:hover {
    border-color: var(--shell-accent);
    color: var(--shell-accent);
}

.site-main--article {
    width: min(1240px, calc(100% - 3rem));
    padding: clamp(2.25rem, 5vw, 4.25rem) 0 0;
}

.article-header {
    width: min(940px, 100%);
    margin: 0 auto clamp(2.25rem, 5vw, 4rem);
}

.article-header__content {
    width: min(740px, 100%);
    margin: 0 auto;
}

.article-header h1 {
    font-size: clamp(2.15rem, 5vw, 4.1rem);
}

.article-header--long-title h1 {
    font-size: clamp(1.95rem, 4.35vw, 3.55rem);
    line-height: 1.03;
}

.article-header--very-long-title h1 {
    font-size: clamp(1.8rem, 3.8vw, 3.1rem);
}

.article-header .eyebrow a {
    color: inherit;
    text-decoration: none;
}

.article-header__excerpt {
    margin: 1.5rem 0 0;
    color: #b9c4d2;
    font-size: clamp(1rem, 2vw, 1.22rem);
}

.article-meta {
    margin-top: 1.5rem;
}

.article-meta img {
    width: 1.5rem;
    height: 1.5rem;
    border: 1px solid var(--shell-border);
    border-radius: 50%;
    object-fit: cover;
}

.article-meta a {
    color: var(--shell-text);
    text-decoration: none;
}

.article-meta__updated {
    width: 100%;
    color: var(--shell-muted);
}

.article-feature-image {
    width: min(1120px, 100%);
    margin: 2.25rem auto 0;
}

.article-feature-image img {
    width: 100%;
    border: 1px solid var(--shell-border);
    background: var(--shell-surface);
}

.article-feature-image figcaption,
.article-content figcaption {
    margin-top: .65rem;
    color: var(--shell-muted);
    font-size: .76rem;
    text-align: center;
}

.article-layout {
    display: grid;
    grid-template-columns: minmax(0, 740px) minmax(11rem, 13.5rem);
    justify-content: center;
    gap: clamp(2rem, 5vw, 5.5rem);
}

.article-layout--without-toc {
    grid-template-columns: minmax(0, 740px);
}

.article-content {
    min-width: 0;
    grid-column: 1;
    color: #c4ceda;
    font-size: clamp(.98rem, 1.2vw, 1.06rem);
    overflow-wrap: break-word;
}

.article-content > :first-child {
    margin-top: 0;
}

.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6 {
    margin: 2.4em 0 .65em;
    color: var(--shell-cyan);
    font-family: var(--shell-heading);
    font-weight: 700;
    letter-spacing: -.045em;
    line-height: 1.18;
    scroll-margin-top: 0;
}

.article-content h2 {
    font-size: clamp(1.55rem, 3vw, 2.2rem);
}

.article-content h3 {
    color: #b8f6db;
    font-size: clamp(1.22rem, 2.4vw, 1.6rem);
}

.article-content h4 {
    font-size: 1.14rem;
}

.article-content p,
.article-content ul,
.article-content ol,
.article-content dl {
    margin: 1.25em 0;
}

.article-content ul,
.article-content ol {
    padding-left: 1.4em;
}

.article-content li + li {
    margin-top: .45em;
}

.article-content li::marker {
    color: var(--shell-magenta);
}

.article-content strong {
    color: #edf3fa;
}

.article-content hr {
    height: 1px;
    margin: 3rem 0;
    border: 0;
    background: var(--shell-border);
}

.article-content blockquote {
    margin: 1.8rem 0;
    padding: .35rem 0 .35rem 1.3rem;
    border-left: .2rem solid var(--shell-magenta);
    color: #b6c3d4;
    font-size: 1.08em;
}

.article-content blockquote p:first-child {
    margin-top: 0;
}

.article-content blockquote p:last-child {
    margin-bottom: 0;
}

.article-content .kg-blockquote-alt {
    padding: 1.4rem;
    border: 1px solid color-mix(in srgb, var(--shell-magenta) 45%, var(--shell-border));
    border-left: 1px solid color-mix(in srgb, var(--shell-magenta) 45%, var(--shell-border));
    background: rgba(230, 151, 255, .06);
}

.article-content blockquote.research-block {
    --research-tone: var(--shell-cyan);
    position: relative;
    margin: 2rem 0;
    padding: 1.15rem 1.25rem 1.2rem;
    border: 1px solid color-mix(in srgb, var(--research-tone) 45%, var(--shell-border));
    border-left: .22rem solid var(--research-tone);
    color: #c7d4e3;
    background: color-mix(in srgb, var(--research-tone) 7%, var(--shell-surface));
    font-size: .94em;
}

.research-block::before {
    display: block;
    margin-bottom: .65rem;
    color: var(--research-tone);
    content: attr(data-research-label);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.article-content blockquote.research-block > strong:first-child,
.article-content blockquote.research-block p > strong:first-child {
    display: none;
}

.article-content blockquote.research-block p:last-child {
    margin-bottom: 0;
}

.research-block--environment,
.research-block--reproduction {
    --research-tone: var(--shell-cyan);
}

.research-block--hypothesis,
.research-block--method {
    --research-tone: var(--shell-accent);
}

.research-block--finding {
    --research-tone: var(--shell-magenta);
}

.research-block--limitation,
.research-block--safety {
    --research-tone: var(--shell-yellow);
}

.research-section {
    position: relative;
    margin: 3.5rem 0;
    padding: 1.25rem clamp(1rem, 3vw, 1.6rem) 1.4rem;
    border: 1px solid color-mix(in srgb, var(--shell-cyan) 42%, var(--shell-border));
    background: linear-gradient(110deg, rgba(125, 211, 252, .07), rgba(32, 45, 61, .28));
}

.research-section::before {
    display: block;
    margin-bottom: .75rem;
    color: var(--shell-yellow);
    content: "evidence trail";
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.research-section h2 {
    margin: 0 0 .75rem;
    color: var(--shell-cyan);
}

.research-section > :last-child {
    margin-bottom: 0;
}

.research-section li::marker {
    color: var(--shell-cyan);
}

.article-content code {
    padding: .12em .33em;
    border: 1px solid var(--shell-border);
    border-radius: .2rem;
    color: #f1d5ff;
    background: #0c121a;
    font-family: var(--shell-mono);
    font-size: .85em;
}

.shell-code-block {
    position: relative;
    margin: 1.8rem 0;
    overflow: hidden;
    border: 1px solid #33465b;
    background: #0b1118;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .18);
}

.shell-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 2.35rem;
    padding: 0 .55rem 0 .85rem;
    border-bottom: 1px solid #27394d;
    color: #8ba1b8;
    font-size: .68rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.shell-code-toolbar__identity {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: .55rem;
}

.shell-code-toolbar__file {
    overflow: hidden;
    color: var(--shell-text);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shell-code-toolbar__language {
    flex: 0 0 auto;
    color: var(--shell-muted);
}

.copy-code {
    min-height: 2rem;
    padding: .28rem .5rem;
    border: 1px solid #3d5268;
    color: var(--shell-accent);
    background: #152231;
    font-size: .67rem;
    line-height: 1.1;
    cursor: pointer;
}

.copy-code:hover {
    border-color: var(--shell-accent);
    background: rgba(53, 224, 161, .11);
}

.shell-code-block pre,
.article-content pre {
    max-width: 100%;
    margin: 0;
    padding: 1.15rem 1.25rem;
    overflow: auto;
    color: #d6e0eb;
    background: #0b1118;
    font-family: var(--shell-mono);
    font-size: .82rem;
    line-height: 1.68;
    tab-size: 4;
}

.shell-code-block--numbered pre {
    grid-column: 2;
    grid-row: 2;
    padding-left: 1.25rem;
}

.shell-code-block--numbered {
    display: grid;
    grid-template-columns: 3.1rem minmax(0, 1fr);
}

.shell-code-block--numbered .shell-code-toolbar {
    grid-column: 1 / -1;
    grid-row: 1;
}

.article-content .code-line-numbers {
    grid-column: 1;
    grid-row: 2;
    margin: 0;
    padding: 1.15rem .6rem;
    overflow: hidden;
    border-right: 1px solid #27394d;
    color: #61778e;
    font-family: var(--shell-mono);
    font-size: .82rem;
    line-height: 1.68;
    list-style: none;
    text-align: right;
    user-select: none;
}

.article-content .code-line-numbers li {
    height: 1.68em;
}

.article-content .code-line-numbers li + li {
    margin-top: 0;
}

.shell-code-block pre code,
.article-content pre code {
    display: block;
    min-width: max-content;
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    font-size: inherit;
}

.hljs-comment,
.hljs-quote {
    color: #718096;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-subst {
    color: #e697ff;
}

.hljs-number,
.hljs-literal,
.hljs-variable,
.hljs-template-variable,
.hljs-tag .hljs-attr {
    color: #facc6b;
}

.hljs-string,
.hljs-doctag {
    color: #86efac;
}

.hljs-title,
.hljs-section,
.hljs-selector-id {
    color: #7dd3fc;
}

.hljs-type,
.hljs-class .hljs-title {
    color: #c4b5fd;
}

.hljs-attribute,
.hljs-name,
.hljs-tag {
    color: #fda4af;
}

.hljs-regexp,
.hljs-link {
    color: #5eead4;
}

.hljs-symbol,
.hljs-bullet {
    color: #fb923c;
}

.article-content figure {
    position: relative;
    margin: 2rem 0;
    border: 1px solid var(--shell-border);
    background: rgba(12, 18, 26, .52);
}

.article-content figure img,
.article-content > img {
    max-width: 100%;
    height: auto;
}

.article-content .kg-image-card img,
.article-content .kg-gallery-image img,
.article-content .kg-product-card img {
    border: 0;
}

.figure-artifact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .48rem .7rem;
    border-bottom: 1px solid var(--shell-border);
    color: var(--shell-muted);
    font-size: .64rem;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
}

.figure-artifact__number {
    color: var(--shell-accent);
}

.figure-artifact__hint {
    color: var(--shell-muted);
    font-weight: 400;
}

.article-content figure figcaption {
    margin: 0;
    padding: .65rem .75rem .72rem;
    border-top: 1px solid color-mix(in srgb, var(--shell-border) 70%, transparent);
    font-size: .72rem;
    text-align: left;
}

.article-content .is-zoomable {
    cursor: zoom-in;
}

.article-content .kg-width-wide,
.article-content .kg-width-full {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    transform: none;
}

.article-content .kg-width-full {
    width: 100%;
}

.article-content .kg-gallery-container {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.article-content .kg-gallery-row {
    display: flex;
    justify-content: center;
    gap: .55rem;
}

.article-content .kg-gallery-image {
    min-width: 0;
}

.article-content .kg-gallery-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-content .kg-embed-card iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    border: 0;
    aspect-ratio: 16 / 9;
}

/* Raw HTML cards can contain directly embedded iframes without Ghost's kg-embed wrapper. */
.article-content > iframe {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    border: 0;
}

.raw-embed-frame {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid var(--shell-border);
    background: #05080c;
    aspect-ratio: var(--raw-embed-ratio, 16 / 9);
}

.raw-embed-frame > iframe {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    border: 0;
}

.article-content .kg-bookmark-container,
.article-content .kg-file-card-container {
    border-color: var(--shell-border);
    color: var(--shell-text);
    background: var(--shell-surface);
}

.article-content .kg-bookmark-content,
.article-content .kg-file-card-contents {
    color: inherit;
}

.article-content .kg-callout-card {
    border: 1px solid var(--shell-border);
    background: var(--shell-surface);
}

.article-content .kg-toggle-card {
    border-color: var(--shell-border);
    background: var(--shell-surface);
}

.article-content .kg-btn-accent,
.article-content .kg-signup-card-button {
    border-radius: 0;
}

.article-content table {
    display: block;
    width: 100%;
    margin: 1.8rem 0;
    overflow-x: auto;
    border-spacing: 0;
    border-collapse: collapse;
    font-size: .88em;
}

.article-content th,
.article-content td {
    padding: .75rem;
    border: 1px solid var(--shell-border);
    text-align: left;
}

.article-content th {
    color: #e6f8ff;
    background: var(--shell-surface-raised);
}

.article-content tr:nth-child(even) {
    background: rgba(32, 45, 61, .3);
}

.article-content kbd {
    padding: .12em .34em;
    border: 1px solid #596b7f;
    border-bottom-width: .18rem;
    border-radius: .25rem;
    color: #e5edf6;
    background: #283748;
    font-family: var(--shell-mono);
    font-size: .82em;
}

.article-toc {
    position: relative;
    grid-column: 2;
    grid-row: 1;
}

.toc {
    position: sticky;
    top: 6rem;
    max-height: calc(100vh - 7.5rem);
    padding: .85rem 0 .85rem .95rem;
    overflow: auto;
    border-left: 1px solid var(--shell-border);
}

.toc__title {
    margin: 0 0 .5rem;
    color: var(--shell-yellow);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.toc__count {
    margin: -.25rem 0 .65rem;
    color: var(--shell-muted);
    font-size: .62rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.toc__toggle {
    display: none;
}

.toc ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.toc ol ol {
    margin: .18rem 0 0;
    padding-left: .62rem;
    border-left: 1px solid color-mix(in srgb, var(--shell-border) 72%, transparent);
}

.toc__item + .toc__item {
    margin-top: .16rem;
}

.toc__item--sub {
    padding-left: 0;
}

.toc a {
    display: flex;
    min-height: 1.65rem;
    align-items: center;
    padding: .08rem 0;
    color: var(--shell-muted);
    font-size: .71rem;
    line-height: 1.45;
    text-decoration: none;
}

.toc a:hover,
.toc a[aria-current="location"] {
    color: var(--shell-accent);
}

.article-footer {
    width: min(740px, 100%);
    margin: 4rem auto 0;
    padding-top: 2.25rem;
    border-top: 1px solid var(--shell-border);
}

.article-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    margin-bottom: 2.25rem;
    padding: 1.1rem 1.2rem;
    border: 1px solid var(--shell-border);
    background: rgba(32, 45, 61, .28);
    gap: 1rem;
}

.article-actions .eyebrow {
    margin: 0 0 .35rem;
}

.article-actions p:not(.eyebrow) {
    margin: 0;
    color: var(--shell-muted);
    font-size: .77rem;
    line-height: 1.5;
}

.article-actions__buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .45rem;
}

.article-action {
    min-height: 2rem;
    padding: .38rem .55rem;
    border: 1px solid var(--shell-border);
    color: var(--shell-text);
    background: transparent;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .055em;
    line-height: 1;
    text-transform: uppercase;
    cursor: pointer;
}

.article-action:hover {
    border-color: var(--shell-accent);
    color: var(--shell-accent);
    background: rgba(53, 224, 161, .06);
}

.article-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.article-tags > span {
    color: var(--shell-muted);
    font-size: .7rem;
    text-transform: uppercase;
}

.article-tags a {
    display: inline-block;
    padding: .18rem .45rem;
    border: 1px solid var(--shell-border);
    color: var(--shell-cyan);
    font-size: .72rem;
    text-decoration: none;
}

.article-tags a:hover {
    border-color: var(--shell-cyan);
}

.author-list {
    display: grid;
    gap: 1rem;
    margin-top: 2.25rem;
}

.author-card {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
    padding: 1rem;
    border: 1px solid var(--shell-border);
    background: rgba(32, 45, 61, .36);
}

.author-card > img {
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
    object-fit: cover;
}

.author-card h2 {
    margin: 0;
    font-size: .9rem;
}

.author-card h2 a {
    color: var(--shell-text);
    text-decoration: none;
}

.author-card p {
    margin: .28rem 0 0;
    color: var(--shell-muted);
    font-size: .8rem;
    line-height: 1.55;
}

.article-comments {
    margin-top: 2.5rem;
}

.article-neighbours,
.related-posts {
    margin-top: 2.5rem;
}

.article-neighbours > .eyebrow,
.related-posts__heading > .eyebrow {
    margin: 0 0 .7rem;
}

.article-neighbours__grid,
.related-posts__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.article-neighbour,
.related-post {
    display: flex;
    min-height: 6.7rem;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    border: 1px solid var(--shell-border);
    color: var(--shell-text);
    background: rgba(32, 45, 61, .3);
    text-decoration: none;
}

.article-neighbour:hover,
.related-post:hover {
    border-color: var(--shell-accent);
    color: var(--shell-text);
    background: rgba(53, 224, 161, .06);
}

.article-neighbour > span,
.related-post > span {
    color: var(--shell-muted);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.article-neighbour > strong,
.related-post > strong {
    margin-top: .9rem;
    font-size: .86rem;
    line-height: 1.42;
}

.article-neighbour--next {
    text-align: right;
}

.related-posts__heading h2 {
    margin: 0 0 .9rem;
    font-size: 1.1rem;
}

.related-posts__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.related-post {
    min-height: 8.5rem;
    justify-content: flex-start;
}

.site-main--topics {
    max-width: 920px;
}

.topic-directory__intro {
    max-width: 46rem;
    margin: -1.8rem 0 3rem;
}

.topic-directory {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--shell-border);
    border-left: 1px solid var(--shell-border);
}

.topic-card {
    display: flex;
    min-height: 10.5rem;
    flex-direction: column;
    padding: 1.15rem;
    border-right: 1px solid var(--shell-border);
    border-bottom: 1px solid var(--shell-border);
    color: var(--shell-text);
    background: rgba(32, 45, 61, .2);
    text-decoration: none;
}

.topic-card:hover {
    color: var(--shell-text);
    background: linear-gradient(135deg, rgba(53, 224, 161, .1), transparent 68%);
}

.topic-card__count {
    color: var(--shell-cyan);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.topic-card > strong {
    margin-top: auto;
    font-size: 1.05rem;
}

.topic-card__description {
    margin-top: .55rem;
    color: var(--shell-muted);
    font-size: .76rem;
    line-height: 1.5;
}

.archive-list {
    border-top: 1px solid var(--shell-border);
}

.archive-list article {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 1rem;
    padding: .9rem 0;
    border-bottom: 1px solid var(--shell-border);
}

.archive-list time,
.archive-list span {
    color: var(--shell-muted);
    font-size: .75rem;
}

.archive-list a {
    color: var(--shell-text);
    text-decoration: none;
}

.archive-list a:hover {
    color: var(--shell-accent);
}

.error-page {
    max-width: 48rem;
    padding-top: 12vw;
}

.error-page h1 {
    color: var(--shell-danger);
    font-size: clamp(4rem, 14vw, 9rem);
}

.error-page > p:not(.eyebrow) {
    margin: 1rem 0 2rem;
    color: var(--shell-muted);
}

.error-page__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
}

.site-actions .back-to-top {
    border-color: color-mix(in srgb, var(--shell-accent) 55%, var(--shell-border));
    color: var(--shell-accent);
    background: rgba(53, 224, 161, .06);
}

.site-footer {
    border-top: 1px solid var(--shell-border);
    background: #0d131c;
}

.site-footer__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    width: min(1240px, calc(100% - 3rem));
    margin: 0 auto;
    padding: 1.55rem 0;
    gap: 1rem;
    color: var(--shell-muted);
    font-size: .75rem;
}

.site-footer p {
    margin: 0;
}

.site-footer__status {
    margin-top: .25rem !important;
    color: color-mix(in srgb, var(--shell-muted) 80%, transparent);
    font-size: .65rem;
    letter-spacing: .04em;
}

.site-footer__navigation {
    display: grid;
    justify-items: end;
    gap: .65rem;
}

.footer-nav__links,
.site-footer__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
    gap: .45rem 1rem;
    list-style: none;
}

.footer-nav__links a {
    color: var(--shell-text);
}

.footer-nav__links .nav-current a,
.footer-nav__links a:hover {
    color: var(--shell-accent);
}

.site-footer__links {
    gap: .45rem 1rem;
}

.site-footer a {
    color: var(--shell-muted);
}

.site-footer a:hover {
    color: var(--shell-accent);
}

.muted {
    color: var(--shell-muted);
}

.image-lightbox {
    width: min(96vw, 92rem);
    max-width: none;
    max-height: 94vh;
    padding: 3.65rem 1rem 1rem;
    overflow: visible;
    border: 1px solid var(--shell-border);
    color: var(--shell-text);
    background: #090e14;
    box-shadow: var(--shell-shadow);
}

.image-lightbox::backdrop {
    background: rgba(3, 7, 11, .88);
    backdrop-filter: blur(3px);
}

.image-lightbox img {
    max-width: 100%;
    max-height: calc(94vh - 4.5rem);
    margin: 0 auto;
    object-fit: contain;
}

.image-lightbox__controls {
    position: absolute;
    top: .65rem;
    right: .65rem;
    left: .65rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
}

.image-lightbox__close,
.image-lightbox__original {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    padding: .35rem .55rem;
    border: 1px solid var(--shell-border);
    color: var(--shell-text);
    background: var(--shell-surface);
    font-size: .72rem;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

.image-lightbox__close:hover,
.image-lightbox__original:hover {
    border-color: var(--shell-accent);
    color: var(--shell-accent);
}

@media (max-width: 900px) {
    html {
        scroll-padding-top: 8rem;
    }

    .article-layout {
        display: block;
    }

    .article-toc {
        position: sticky;
        z-index: 15;
        top: 3.9rem;
        margin: 0 0 1.5rem;
    }

    .toc {
        position: static;
        max-height: none;
        padding: .65rem;
        border: 1px solid var(--shell-border);
        background: rgba(20, 30, 42, .97);
        box-shadow: 0 10px 24px rgba(0, 0, 0, .22);
    }

    .toc > .toc__list {
        columns: 2;
        column-gap: 1.5rem;
    }

    .toc__item {
        break-inside: avoid;
    }

    .toc.toc--collapsible .toc__count {
        display: none;
    }

    .toc.toc--collapsible .toc__title {
        display: none;
    }

    .toc.toc--collapsible .toc__toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        min-height: 2.75rem;
        margin: 0;
        padding: .55rem .65rem;
        border: 1px solid var(--shell-border);
        color: var(--shell-text);
        background: rgba(17, 24, 34, .5);
        font-family: var(--shell-mono);
        font-size: .68rem;
        letter-spacing: .04em;
        text-transform: uppercase;
        cursor: pointer;
    }

    .toc.toc--collapsible .toc__toggle::after {
        content: '+';
        color: var(--shell-accent);
        font-size: 1rem;
        line-height: 1;
    }

    .toc.toc--collapsible.toc--expanded .toc__toggle::after {
        content: '−';
    }

    .toc.toc--collapsible .toc__list {
        display: none;
        margin-top: .8rem;
    }

    .toc.toc--collapsible.toc--expanded .toc__list {
        display: block;
        max-height: calc(100vh - 9.5rem);
        overflow: auto;
    }

    .toc a {
        min-height: 2.75rem;
        padding: .35rem .25rem;
    }
}

/* Collapse primary navigation before the logo and menu start wrapping. */
@media (max-width: 960px) {
    .site-header__inner {
        gap: .7rem;
    }

    .site-nav {
        order: 3;
        margin-left: 0;
    }

    .site-nav__toggle {
        display: inline-grid;
        place-items: center;
    }

    .site-nav__menu {
        position: absolute;
        top: calc(100% + 1px);
        right: 1rem;
        left: 1rem;
        display: none;
        padding: .5rem;
        border: 1px solid var(--shell-border);
        background: #141e2a;
        box-shadow: var(--shell-shadow);
    }

    .site-nav__menu.is-open {
        display: block;
    }

    .site-nav__menu ul {
        display: block;
    }

    .site-nav__menu a {
        padding: .65rem .75rem;
    }

    .site-actions {
        margin-left: auto;
    }
}

@media (max-width: 700px) {
    .site-header__inner,
    .site-main,
    .site-main--article,
    .site-footer__inner {
        width: min(100% - 2rem, 1240px);
    }

    .site-header__inner {
        min-height: 3.35rem;
        gap: .7rem;
    }

    .site-actions .button {
        display: none;
    }

    .post-feed {
        grid-template-columns: 1fr;
    }

    .home-hero {
        margin-bottom: 2.25rem;
        padding: 1.25rem;
        background:
            linear-gradient(100deg, rgba(13, 21, 31, .98) 18%, rgba(13, 21, 31, .77) 62%, rgba(13, 21, 31, .5)),
            var(--hero-image-small, var(--hero-image, none)) center / cover,
            var(--shell-surface);
    }

    .lab-index {
        grid-template-columns: 1fr;
        gap: .65rem;
    }

    .lab-index__tags {
        justify-content: flex-start;
    }

    .home-feed .post-card {
        grid-template-columns: 1fr;
    }

    .home-feed .post-card__image img {
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .home-feed .post-card__body {
        grid-template-columns: 1fr;
        padding: 1rem 1.15rem 1.3rem;
    }

    .home-feed .post-card__read {
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
        margin-top: .85rem;
    }

    .article-content .kg-width-wide,
    .article-content .kg-width-full {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
        transform: none;
    }

    .toc > .toc__list {
        columns: 1;
    }

    .article-actions {
        grid-template-columns: 1fr;
    }

    .article-actions__buttons {
        justify-content: flex-start;
    }

    .article-neighbours__grid,
    .related-posts__grid,
    .topic-directory {
        grid-template-columns: 1fr;
    }

    .article-neighbour--next {
        text-align: left;
    }

    .archive-list article {
        grid-template-columns: 1fr;
        gap: .1rem;
    }

    .site-footer__inner {
        display: grid;
        grid-template-columns: 1fr;
        align-items: start;
    }

    .site-footer__navigation {
        justify-items: start;
    }

    .footer-nav__links,
    .site-footer__links {
        justify-content: flex-start;
    }
}

@media (max-width: 440px) {
    .home-hero {
        margin-right: -.15rem;
        margin-left: -.15rem;
        padding: 1.25rem;
    }

    .home-hero__status {
        gap: .25rem .6rem;
        font-size: .62rem;
    }

    .home-hero__status li + li {
        padding-left: .6rem;
    }

    .article-content pre,
    .shell-code-block pre {
        padding: 1rem;
        font-size: .75rem;
    }

    .shell-code-block--numbered pre {
        padding-left: 1rem;
    }

    .code-line-numbers {
        padding-right: .45rem;
        padding-left: .35rem;
        font-size: .75rem;
    }

    .shell-code-block--numbered {
        grid-template-columns: 2.7rem minmax(0, 1fr);
    }

    .article-meta__updated {
        margin-top: .2rem;
    }
}

@media print {
    :root {
        color-scheme: light;
    }

    body {
        color: #111;
        background: #fff;
    }

    .site-header,
    .site-footer,
    .reading-progress,
    .article-toc,
    .article-actions,
    .article-neighbours,
    .related-posts,
    .article-comments,
    .figure-artifact__hint,
    .copy-code,
    .image-lightbox {
        display: none !important;
    }

    .site-main,
    .site-main--article,
    .article-header,
    .article-header__content,
    .article-layout,
    .article-content,
    .article-footer {
        display: block;
        width: 100%;
        max-width: none;
        margin-right: 0;
        margin-left: 0;
        padding-right: 0;
        padding-left: 0;
        color: #111;
    }

    .article-header h1,
    .article-content h2,
    .article-content h3,
    .article-content h4,
    .article-content strong {
        color: #111;
    }

    .article-content pre,
    .shell-code-block,
    .shell-code-block pre {
        color: #111;
        background: #f5f5f5;
        box-shadow: none;
        break-inside: avoid;
    }

    .article-content a {
        color: #111;
        text-decoration: underline;
    }

    .article-feature-image,
    .article-content figure,
    .article-content table,
    .research-block {
        break-inside: avoid;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}