/* ─── Brand palette ────────────────────────────────────────────────────────── */
:root {
    --qt-blue-300: #a9c6ff;
    --qt-blue-400: #7fadff;
    --qt-blue-500: #4d89fb;
    --qt-blue-600: #2f6fe8;
    --qt-blue-700: #1f56c5;
    --qt-blue-800: #173f93;

    --qt-ice-50: #fbfdff;
    --qt-ice-100: #f2f7ff;
    --qt-ice-200: #e4eeff;

    --qt-ink-900: #0a1730;
    --qt-ink-800: #102142;
    --qt-ink-700: #162b57;
    --qt-ink-100: #dbe7ff;
}

/* ─── Light scheme tokens ─────────────────────────────────────────────────── */
[data-md-color-scheme="default"] {
    --md-default-fg-color: #1a395d;
    --md-default-fg-color--light: #537090;
    --md-default-fg-color--lighter: #89a0bc;
    --md-default-fg-color--lightest: rgba(77, 137, 251, 0.16);

    --md-default-bg-color: var(--qt-ice-50);
    --md-default-bg-color--light: #ffffff;
    --md-default-bg-color--lighter: var(--qt-ice-100);
    --md-default-bg-color--lightest: var(--qt-ice-200);

    --md-primary-fg-color: var(--qt-blue-700);
    --md-primary-fg-color--light: var(--qt-blue-500);
    --md-primary-fg-color--dark: var(--qt-blue-800);
    --md-primary-bg-color: #ffffff;

    --md-accent-fg-color: var(--qt-blue-600);
    --md-accent-fg-color--transparent: #4d89fb1a;

    --md-typeset-a-color: var(--qt-blue-600);
    --md-code-fg-color: #1b3150;
    --md-code-bg-color: #eef4ff;

    --qt-drawer-title-fg: rgba(255, 255, 255, 0.96);
    --qt-drawer-title-bg: linear-gradient(
        145deg,
        #1b4b97 0%,
        #245fc6 54%,
        #2f6fe8 100%
    );
    --qt-drawer-source-fg: rgba(255, 255, 255, 0.94);
    --qt-drawer-source-bg: linear-gradient(
        145deg,
        #14346f 0%,
        #184896 52%,
        #1f56b8 100%
    );
    --qt-drawer-edge: rgba(255, 255, 255, 0.14);
    --qt-drawer-list-shadow: rgba(31, 86, 184, 0.14);
}

/* ─── Dark scheme tokens ──────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] {
    --md-default-fg-color: #eaf2ff;
    --md-default-fg-color--light: #c8d9f2;
    --md-default-fg-color--lighter: #91abd0;
    --md-default-fg-color--lightest: rgba(127, 195, 255, 0.18);

    --md-default-bg-color: #09111f;
    --md-default-bg-color--light: #0e172b;
    --md-default-bg-color--lighter: #13203a;
    --md-default-bg-color--lightest: #1a2a49;

    --md-primary-fg-color: #4f97ff;
    --md-primary-fg-color--light: #7fc3ff;
    --md-primary-fg-color--dark: #2b63d0;
    --md-primary-bg-color: #f8fbff;

    --md-accent-fg-color: #8ed8ff;
    --md-accent-fg-color--transparent: #8ed8ff24;

    --md-typeset-a-color: #9edfff;
    --md-code-fg-color: var(--qt-ink-100);
    --md-code-bg-color: #101b33;

    --qt-drawer-title-fg: rgba(232, 240, 255, 0.94);
    --qt-drawer-title-bg: linear-gradient(
        145deg,
        #14346f 0%,
        #1b4b97 52%,
        #225ab1 100%
    );
    --qt-drawer-source-fg: rgba(232, 240, 255, 0.94);
    --qt-drawer-source-bg: linear-gradient(
        145deg,
        #102b5d 0%,
        #163f82 52%,
        #1b4c96 100%
    );
    --qt-drawer-edge: rgba(127, 195, 255, 0.16);
    --qt-drawer-list-shadow: rgba(127, 195, 255, 0.16);
}

/* ─── Header and tabs ─────────────────────────────────────────────────────── */
.md-header {
    background:
        radial-gradient(
            circle at 18% -14%,
            rgba(255, 255, 255, 0.1),
            rgba(255, 255, 255, 0) 24%
        ),
        radial-gradient(
            circle at 72% 0%,
            rgba(143, 216, 255, 0.14),
            rgba(143, 216, 255, 0) 24%
        ),
        linear-gradient(118deg, #2258bc 0%, #2b6fd4 46%, #277dca 100%);
}

.md-tabs {
    background:
        linear-gradient(
            90deg,
            rgba(143, 216, 255, 0.06),
            rgba(143, 216, 255, 0) 24%
        ),
        linear-gradient(118deg, #245fbf 0%, #2b6fd4 48%, #2a7bc9 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

[data-md-color-scheme="slate"] .md-header {
    background:
        radial-gradient(
            circle at 20% -16%,
            rgba(127, 195, 255, 0.12),
            rgba(127, 195, 255, 0) 24%
        ),
        radial-gradient(
            circle at 78% 0%,
            rgba(78, 151, 255, 0.14),
            rgba(78, 151, 255, 0) 24%
        ),
        linear-gradient(118deg, #14346f 0%, #1b4b97 48%, #225ab1 100%);
}

[data-md-color-scheme="slate"] .md-tabs {
    background:
        linear-gradient(
            90deg,
            rgba(127, 195, 255, 0.08),
            rgba(127, 195, 255, 0) 22%
        ),
        linear-gradient(118deg, #163877 0%, #1c4b97 48%, #1d58a5 100%);
    box-shadow: inset 0 1px 0 rgba(127, 195, 255, 0.1);
}

.md-header__title {
    margin-left: 0;
    min-width: 0;
    font-weight: 700;
    letter-spacing: 0;
}

.md-header__button,
.md-header__title-link,
.md-header__topic,
.md-header__source {
    color: rgba(255, 255, 255, 0.98);
}

.md-header__topic[data-md-component="header-topic"] {
    color: rgba(255, 255, 255, 0.88);
}

[data-md-color-scheme="default"]
    .md-header__topic[data-md-component="header-topic"] {
    color: rgba(255, 255, 255, 0.96);
}

.md-header__title-link {
    color: inherit;
    display: flex;
    flex: 1 1 auto;
    margin-right: auto;
    min-width: 0;
    margin-left: 0;
    padding: 0;
    text-decoration: none;
}

[dir="ltr"] .md-header__title.md-header__title-link {
    margin-left: 0;
}

[dir="rtl"] .md-header__title.md-header__title-link {
    margin-right: 0;
}

.md-header__title-link .md-header__ellipsis {
    min-width: 0;
}

.md-header__button.md-logo {
    flex-shrink: 0;
    margin-right: 0.1rem;
}

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
    height: 2.05rem;
    width: 2.05rem;
}

.md-header__button:hover,
.md-header__title-link:hover,
.md-header__source .md-source:hover {
    opacity: 1;
    background: none;
    box-shadow: none;
}

.md-header__button:focus-visible,
.md-header__title-link:focus-visible,
.md-header__source .md-source:focus-visible {
    outline: 0.12rem solid rgba(255, 255, 255, 0.28);
    outline-offset: 0;
}

[data-md-color-scheme="default"] .md-header__button:focus-visible,
[data-md-color-scheme="default"] .md-header__title-link:focus-visible,
[data-md-color-scheme="default"] .md-header__source .md-source:focus-visible {
    outline-color: rgba(10, 23, 48, 0.48);
}

.md-tabs__link {
    color: rgba(255, 255, 255, 0.88);
    margin-top: 0;
    padding: 0.7rem 0.78rem 0.62rem;
    border-radius: 0;
    transition:
        color 125ms,
        opacity 125ms,
        box-shadow 125ms;
}

.md-tabs__list {
    gap: 0.65rem;
}

.md-tabs__item {
    height: auto;
}

[data-md-color-scheme="slate"] .md-tabs__link:is(:focus, :hover) {
    background-color: transparent;
    box-shadow: inset 0 -0.12rem 0 rgba(127, 195, 255, 0.3);
}

[data-md-color-scheme="slate"] .md-tabs__link--active {
    background-color: transparent;
    box-shadow: inset 0 -0.14rem 0 rgba(127, 195, 255, 0.75);
}

[data-md-color-scheme="default"] .md-tabs__link:is(:focus, :hover) {
    background-color: transparent;
    box-shadow: inset 0 -0.12rem 0 rgba(255, 255, 255, 0.34);
}

[data-md-color-scheme="default"] .md-tabs__link--active {
    background-color: transparent;
    box-shadow: inset 0 -0.14rem 0 rgba(255, 255, 255, 0.82);
}

/* ─── Sidebar and navigation ──────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-sidebar {
    background-color: var(--md-default-bg-color);
}

[data-md-color-scheme="default"] .md-nav--primary .md-nav__link {
    color: var(--md-default-fg-color--light);
}

[data-md-color-scheme="slate"] .md-nav--primary .md-nav__link {
    color: var(--md-default-fg-color--light);
}

[data-md-color-scheme="default"]
    .md-nav--primary
    .md-nav__item
    .md-nav
    .md-nav__link {
    color: #506987;
}

[data-md-color-scheme="slate"]
    .md-nav--primary
    .md-nav__item
    .md-nav
    .md-nav__link {
    color: #8aa6d8;
}

[data-md-color-scheme="default"]
    .md-nav--primary
    .md-nav__item--nested
    > .md-nav__link {
    color: #17304d;
    font-weight: 600;
}

[data-md-color-scheme="slate"]
    .md-nav--primary
    .md-nav__item--nested
    > .md-nav__link {
    color: #e8f0ff;
    font-weight: 600;
}

.md-nav__link--active,
.md-nav__link:is(:focus, :hover) {
    color: var(--md-accent-fg-color) !important;
}

.md-tabs__link--active,
.md-tabs__link:is(:focus, :hover) {
    color: #ffffff !important;
}

.md-nav--primary .md-nav__item .md-nav {
    border-left: 0;
}

@media screen and (max-width: 76.234375em) {
    .md-nav--primary > .md-nav__list > .md-nav__item {
        border-top: 0;
    }

    .md-nav--primary > .md-nav__title,
    .md-nav--primary > .md-nav__source {
        background:
            radial-gradient(
                circle at 84% 0%,
                rgba(255, 255, 255, 0.05),
                rgba(255, 255, 255, 0) 24%
            ),
            var(--qt-drawer-title-bg);
        color: var(--qt-drawer-title-fg);
    }

    .md-nav--primary > .md-nav__source {
        color: var(--qt-drawer-source-fg);
    }

    .md-nav--primary > .md-nav__title .md-nav__icon,
    .md-nav--primary > .md-nav__source .md-source__icon {
        color: inherit;
    }

    .md-nav--primary > .md-nav__title .md-ellipsis,
    .md-nav--primary > .md-nav__source .md-source,
    .md-nav--primary > .md-nav__source .md-source__repository,
    .md-nav--primary > .md-nav__source .md-source__facts {
        color: inherit;
    }

    .md-nav--primary > .md-nav__source .md-source {
        padding-block: 0.25rem;
    }

    .md-nav--primary > .md-nav__source .md-source__repository {
        font-weight: 600;
    }

    .md-nav--primary > .md-nav__source .md-source__facts {
        opacity: 0.96;
    }

    .md-nav--primary > .md-nav__title ~ .md-nav__list {
        box-shadow: 0 0.05rem 0 var(--qt-drawer-list-shadow) inset;
    }
}

@media screen and (max-width: 44.984375em) {
    .md-header__button.md-logo {
        display: none;
    }

    .md-header__title-link {
        padding-left: 0;
    }

    .md-header__title-link .md-header__topic[data-md-component="header-topic"] {
        display: none;
    }

    .md-header__title-link .md-header__topic:first-child,
    .md-header__title--active .md-header__topic:first-child {
        opacity: 1;
        pointer-events: auto;
        position: static;
        transform: none;
        z-index: 0;
    }

    .md-typeset p:has(> .md-button) {
        flex-direction: column;
        align-items: stretch;
    }

    .md-typeset p:has(> .md-button) > .md-button {
        text-align: center;
    }
}

/* ─── Code blocks ─────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .highlight pre,
[data-md-color-scheme="slate"] code,
[data-md-color-scheme="default"] .highlight pre,
[data-md-color-scheme="default"] code {
    border-radius: 6px;
}

/* ─── Typography ──────────────────────────────────────────────────────────── */
.md-typeset h1 {
    font-weight: 800;
    letter-spacing: 0;
}

.md-typeset h2 {
    font-weight: 700;
    letter-spacing: 0;
}

.md-typeset h3 {
    font-weight: 600;
}

.md-typeset p:has(> .md-button) {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.md-typeset p:has(> .md-button) > .md-button {
    margin: 0;
}

/* ─── Admonitions ─────────────────────────────────────────────────────────── */
.md-typeset .admonition,
.md-typeset details {
    border-radius: 6px;
}

/* ─── Homepage redesign ─────────────────────────────────────────────────── */
.md-main__inner:has(.qt-home) {
    margin-top: 0;
}

.md-content__inner:has(.qt-home) {
    margin: 0;
    padding-top: 0;
}

.md-content__inner:has(.qt-home)::before {
    display: none;
}

.qt-home {
    --qt-home-ink: #102142;
    --qt-home-muted: #5d7190;
    --qt-home-line: rgba(47, 111, 232, 0.14);
    --qt-home-panel: rgba(255, 255, 255, 0.92);
    --qt-home-panel-soft: rgba(255, 255, 255, 0.68);
    --qt-home-shadow: 0 0.55rem 1.6rem rgba(31, 86, 184, 0.1);
    --qt-space-1: 0.5rem;
    --qt-space-2: 0.75rem;
    --qt-space-3: 1rem;
    --qt-space-4: 1.5rem;
    --qt-space-5: 2.25rem;
    --qt-space-6: 3.5rem;
    box-sizing: border-box;
    color: var(--qt-home-ink);
    display: grid;
    gap: var(--qt-space-6);
    letter-spacing: 0;
    margin-inline: auto;
    max-width: 62rem;
    padding: var(--qt-space-3) clamp(1rem, 4vw, 2rem) var(--qt-space-6);
}

[data-md-color-scheme="slate"] .qt-home {
    --qt-home-ink: #eff6ff;
    --qt-home-muted: #a9bbd4;
    --qt-home-line: rgba(142, 216, 255, 0.16);
    --qt-home-panel: rgba(16, 27, 51, 0.9);
    --qt-home-panel-soft: rgba(19, 32, 58, 0.7);
    --qt-home-shadow: 0 0.65rem 1.8rem rgba(0, 0, 0, 0.28);
}

.qt-home :is(h1, h2, h3, p, figure) {
    margin: 0;
}

.qt-home :is(h1, h2, h3) {
    color: var(--qt-home-ink);
    letter-spacing: 0;
}

.qt-home h1 {
    font-size: clamp(3rem, 5vw, 3.8rem);
    line-height: 0.95;
}

.qt-home h2 {
    max-width: 15em;
    font-size: clamp(1.65rem, 3.2vw, 2.5rem);
    line-height: 1.04;
}

.qt-home h3 {
    font-size: 0.92rem;
    line-height: 1.28;
}

.qt-home p {
    color: var(--qt-home-muted);
    font-size: 0.78rem;
    line-height: 1.62;
}

.qt-eyebrow {
    color: var(--md-accent-fg-color) !important;
    font-size: 0.58rem !important;
    font-weight: 800;
    letter-spacing: 0 !important;
    line-height: 1.1 !important;
    text-transform: uppercase;
}

.qt-hero {
    align-items: center;
    background:
        linear-gradient(135deg, #071226 0%, #102a58 56%, #1f62bd 100%);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    box-shadow: var(--qt-home-shadow);
    display: grid;
    gap: clamp(1.2rem, 4vw, 2.4rem);
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.94fr);
    overflow: hidden;
    padding: clamp(1.5rem, 4vw, 2.6rem);
    position: relative;
}

.qt-hero::after {
    background: linear-gradient(90deg, rgba(184, 255, 0, 0.32), rgba(142, 216, 255, 0.22));
    content: "";
    height: 1px;
    inset: 0 0 auto;
    position: absolute;
}

.qt-hero__copy {
    display: grid;
    gap: var(--qt-space-3);
    min-width: 0;
    position: relative;
    z-index: 1;
}

.qt-hero__copy :is(h1, p) {
    color: #ffffff;
}

.qt-hero__lede {
    color: rgba(239, 246, 255, 0.84) !important;
    font-size: clamp(0.88rem, 1.6vw, 1rem) !important;
    max-width: 29rem;
}

.md-typeset .qt-hero__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    list-style: none;
    margin: 0.2rem 0 0 !important;
    padding: 0 !important;
}

.md-typeset .qt-hero__pills li {
    align-items: center;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: rgba(239, 246, 255, 0.84);
    display: inline-flex;
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1;
    margin: 0 !important;
    margin-left: 0 !important;
    padding: 0.42rem 0.58rem;
}

.md-typeset .qt-hero__pills li::before {
    display: none !important;
}

.qt-hero__preview {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04));
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    box-shadow: 0 0.8rem 2rem rgba(0, 0, 0, 0.22);
    overflow: hidden;
    padding: 0.45rem;
}

.qt-hero__preview img {
    aspect-ratio: 16 / 9;
    border-radius: 6px;
    display: block;
    object-fit: cover;
    width: 100%;
}

.qt-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--qt-space-2);
}

.qt-home .md-button {
    border-radius: 6px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0;
    padding: 0.58rem 0.86rem;
    transition:
        background-color 140ms,
        border-color 140ms,
        box-shadow 140ms,
        color 140ms,
        transform 140ms;
}

.qt-home .md-button:is(:hover, :focus-visible) {
    box-shadow: 0 0.32rem 1rem rgba(47, 111, 232, 0.22);
    transform: translateY(-1px);
}

.qt-hero .md-button:not(.md-button--primary) {
    border-color: rgba(255, 255, 255, 0.46);
    color: #ffffff;
}

.qt-section {
    display: grid;
    gap: var(--qt-space-4);
}

.qt-section__header {
    align-items: end;
    display: grid;
    gap: var(--qt-space-3);
    grid-template-columns: minmax(0, 1fr) minmax(15rem, 0.45fr);
}

.qt-section__header > p,
.qt-section__header > .qt-inline-link {
    justify-self: end;
    max-width: 20rem;
}

.qt-feature-grid,
.qt-gallery {
    display: grid;
    gap: var(--qt-space-3);
}

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

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

.qt-card,
.qt-launch {
    background:
        linear-gradient(180deg, var(--qt-home-panel), var(--qt-home-panel-soft));
    border: 1px solid var(--qt-home-line);
    border-radius: 8px;
    box-shadow: var(--qt-home-shadow);
}

.qt-card {
    display: grid;
    gap: var(--qt-space-2);
    min-width: 0;
    padding: var(--qt-space-3);
    transition:
        border-color 140ms,
        box-shadow 140ms,
        transform 140ms;
}

.qt-card:is(:hover, :focus-within) {
    border-color: rgba(47, 111, 232, 0.28);
    box-shadow: 0 0.7rem 1.8rem rgba(31, 86, 184, 0.14);
    transform: translateY(-2px);
}

.qt-example {
    overflow: hidden;
}

.qt-example img {
    background:
        linear-gradient(180deg, rgba(47, 111, 232, 0.05), rgba(47, 111, 232, 0.02));
    aspect-ratio: 16 / 9;
    border-radius: 6px;
    display: block;
    height: auto;
    object-fit: contain;
    width: 100%;
}

.qt-example figcaption {
    color: var(--qt-home-muted);
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1.2;
}

.qt-inline-link {
    color: var(--md-accent-fg-color);
    font-size: 0.72rem;
    font-weight: 800;
    text-decoration: none;
}

.qt-inline-link:is(:hover, :focus-visible) {
    color: var(--md-typeset-a-color);
    text-decoration: underline;
    text-underline-offset: 0.16rem;
}

.qt-code-section,
.qt-launch {
    align-items: center;
    display: grid;
    gap: var(--qt-space-4);
    grid-template-columns: minmax(0, 0.42fr) minmax(0, 0.58fr);
}

.qt-code-section__copy,
.qt-launch__copy {
    display: grid;
    gap: var(--qt-space-3);
    min-width: 0;
}

.qt-code-card {
    background: #ecf4ff;
    border: 1px solid var(--qt-home-line);
    border-radius: 8px;
    box-shadow: var(--qt-home-shadow);
    margin: 0;
    min-width: 0;
    overflow: hidden;
}

[data-md-color-scheme="slate"] .qt-code-card {
    background: #101b33;
}

.qt-code-card__bar {
    align-items: center;
    border-bottom: 1px solid var(--qt-home-line);
    color: var(--qt-home-muted);
    display: flex;
    font-size: 0.62rem;
    font-weight: 800;
    justify-content: space-between;
    line-height: 1;
    padding: 0.62rem 0.75rem;
}

.qt-code-card pre {
    background: transparent;
    border-radius: 0;
    font-size: 0.64rem;
    line-height: 1.55;
    margin: 0;
    max-height: 21rem;
    overflow: auto;
    padding: var(--qt-space-3);
}

.qt-launch {
    padding: var(--qt-space-3);
}

.qt-launch__image img {
    border-radius: 6px;
    display: block;
    width: 100%;
}

@media screen and (max-width: 59.984375em) {
    .qt-home {
        gap: var(--qt-space-5);
        padding-top: var(--qt-space-2);
    }

    .qt-hero,
    .qt-section__header,
    .qt-code-section,
    .qt-launch {
        grid-template-columns: 1fr;
    }

    .qt-section__header > p,
    .qt-section__header > .qt-inline-link {
        justify-self: start;
        max-width: 31rem;
    }

    .qt-feature-grid,
    .qt-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qt-code-section {
        align-items: start;
    }
}

@media screen and (max-width: 44.984375em) {
    .qt-home {
        gap: 2rem;
        overflow-x: clip;
    }

    .qt-hero {
        padding: 1rem;
    }

    .qt-home h1 {
        font-size: clamp(2.45rem, 13vw, 3.2rem);
    }

    .qt-home h2 {
        font-size: clamp(1.45rem, 8vw, 1.9rem);
    }

    .qt-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .qt-section__header > .qt-inline-link {
        align-items: center;
        background: rgba(47, 111, 232, 0.06);
        border: 1px solid rgba(47, 111, 232, 0.32);
        border-radius: 6px;
        display: inline-flex;
        justify-content: center;
        padding: 0.58rem 0.8rem;
        width: 100%;
    }

    .qt-home .md-button {
        text-align: center;
        width: 100%;
    }

    .qt-feature-grid,
    .qt-gallery {
        grid-template-columns: 1fr;
    }

    .qt-code-card pre {
        font-size: 0.66rem;
        max-height: none;
    }
}