/* Global */
:root { --t-page: #0b0b09; --t-text: #f3f3f1; --t-highlight: #5f83dd; --t-hero-text: #f8f8f7; --t-wash: #1f1d19; --t-panel: #161513; --t-rule: #292823; --t-link: #e2b236; --t-text-2: #a4a198; --t-link-hover: #c9981d }
* { box-sizing: border-box }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100% }
body { margin: 0px; color: var(--t-text); -webkit-font-smoothing: antialiased; font-size: 18px; line-height: 1.63; font-family: 'Josefin Slab', Cambria, Georgia, serif; background-color: var(--t-page) }
pre { overflow-x: auto; max-inline-size: 100% }
code { overflow-wrap: anywhere }
img { display: block; block-size: auto; max-inline-size: 100% }
.statusbar { color: var(--t-text); z-index: 20; font-size: .9em; align-items: center; line-height: 1.35; inset-block-start: 0; gap: 9px; padding-inline: 10px; padding-block: 10px; margin: 0; justify-content: space-between; display: flex; background-color: var(--t-wash); position: sticky }
.statusbar p { margin: 0px; flex: 1 1 auto }
.statusbar span { flex: 1 1 auto; margin: 0px }
/* Forms */
.statusbar a { text-decoration: underline; color: var(--t-text); font-weight: 700 }
.barX { cursor: pointer; border: 0; background-color: transparent; color: var(--t-text) }
.barX { font-size: 1.1em; padding-block: 2px; padding-inline: 5px; line-height: 1 }
.statusbar[hidden] { display: none }
a { color: var(--t-link) }
a:hover { color: var(--t-link-hover) }
h1 { font-family: 'Josefin Sans', 'Segoe UI', Roboto, sans-serif; font-weight: 700 }
h2 { font-weight: 700; font-family: 'Josefin Sans', 'Segoe UI', Roboto, sans-serif }
h3 { font-weight: 700; font-family: 'Josefin Sans', 'Segoe UI', Roboto, sans-serif }
h4 { font-family: 'Josefin Sans', 'Segoe UI', Roboto, sans-serif; font-weight: 700 }
/* Header */
h1 { margin-block-end: 0.52em; letter-spacing: 0; line-height: 1.2 }
h2 { line-height: 1.2; letter-spacing: 0; margin-block-end: 0.52em }
h3 { margin-block-end: 0.52em; letter-spacing: 0; line-height: 1.2 }
h4 { margin-block-end: 0.52em; line-height: 1.2; letter-spacing: 0 }
h1 { font-size: 2.10rem }
h2 { font-size: 1.55rem; margin-block-start: 1.72em }
h3 { font-size: 1.18rem; margin-block-start: 1.41em }
h2 span[id],h3 span[id] { scroll-margin-block-start: 90px }
.articleText { max-inline-size: 100% }
.articleText p { margin: 0 0 1.09em }
/* Components */
.articleText ol { margin: 0 0 0.97em; padding-inline-start: 1.4em }
.articleText ul { margin: 0 0 0.97em; padding-inline-start: 1.4em }
.articleText li { margin-block-start: 0.38em; margin-block-end: 0.38em }
.articleText hr { border: 0; margin: 1.91em 0 1.73em; border-block-start: 1px solid var(--t-rule) }
.articleText table { border-collapse: collapse; font-size: .94em }
.articleText table { inline-size: 100%; margin-block-start: 1.14em; display: block; overflow-x: auto; margin-block-end: 1.14em }
.articleText th { padding: 10px 11px 10px 11px; text-align: start; border: 1px solid var(--t-rule) }
.articleText td { text-align: start; border: 1px solid var(--t-rule); padding: 10px 11px 10px 11px }
.articleText th { font-weight: 600; background-color: var(--t-wash) }
.articleText blockquote { margin: 1.37em 0 1.37em 0; padding: 13px 18px 13px 18px }
/* Typography */
.articleText blockquote { border-inline-start: 4px solid var(--t-highlight); border-radius: 9px; background-color: var(--t-panel) }
.articleText sup a { padding-block: 0; font-size: .72em; padding-inline: 2px; text-decoration-line: none }
.articleText code { padding-inline: 5px; background-color: var(--t-wash); border-radius: 4px; font-size: .92em; padding-block: 1px }
.articleText img { border-radius: 11px; margin-block-start: 0.94em; margin-block-end: 0.94em }
.answerBox { border-inline-start: 4px solid var(--t-link); background-color: var(--t-wash); border-radius: 10px }
.answerBox { margin: 0 0 29px; padding: 20px 22px 20px 22px; font-size: 1.06em }
.answerBox p:last-child { margin-block-end: 0 }
.plusMinus { display: grid; grid-template-columns: 1fr 1fr }
.plusMinus { margin-block: 18px; margin-inline: 0; gap: 5px 16px }
.plusMinus dt { grid-row: 1; font-family: 'Josefin Sans', 'Segoe UI', Roboto, sans-serif; font-weight: 700; font-size: 1.1em }
/* Cards */
.plusMinus dd { grid-row: 2; border: 1px solid var(--t-rule); margin: 0px; padding: 16px 18px 16px 18px; background-color: var(--t-panel); border-radius: 9px }
.plusMinus ul { margin: 0; padding-inline-start: 1.16em }
.references { margin: 36px 0 0; border-block-start: 1px solid var(--t-rule); color: var(--t-text-2); padding-block-start: 17px; font-size: .9em }
.references p { margin: 0.32em 0 0.32em 0 }
.references p>span { display: inline-block; min-inline-size: 2.2em; color: var(--t-highlight) }
.references a { color: var(--t-text-2) }
.quote { padding-inline: 26px; border-radius: 9px; font-size: 1.15em; padding-block: 20px; font-style: italic }
.quote { margin-inline: 0; margin-block: 24px }
.quote { border-inline-start: 4px solid var(--t-highlight); background-color: var(--t-panel) }
.callout { border: 1px solid var(--t-rule); text-align: center; border-radius: 9px }
/* Blocks */
.callout { background-color: var(--t-panel); padding: 30px; box-shadow: inset 0 1px 0 #e2b23659, 0 24px 60px -30px #e2b23699; color: var(--t-text); margin: 39px 0 39px 0 }
.callout p:first-child { color: inherit; font-size: 1.40rem; font-family: 'Josefin Sans', 'Segoe UI', Roboto, sans-serif; line-height: 1.2; margin-block-start: 0 }
.button { padding-block: 13px; color: var(--t-page); padding-inline: 24px; display: inline-block; font-weight: 600; background-color: var(--t-link); text-decoration: none; border-radius: 11px; margin-block-start: 11px }
.button:hover { color: var(--t-page); filter: brightness(1.08) }
.cardGrid { margin-block-start: 22px; grid-template-columns: repeat(auto-fill,minmax(250px,1fr)); display: grid; column-gap: 24px; margin-block-end: 22px; row-gap: 24px }
.teaser { gap: 8px; padding: 23px; background-color: var(--t-panel); display: grid; border: 1px solid var(--t-rule) }
.teaser { color: #ffffff; border-radius: 9px }
.teaser h2 { margin: 0px; font-size: 1.08em; color: #ffffff }
.teaser h3 { font-size: 1.08em; margin: 0px; color: #ffffff }
.teaser p { font-size: .95em; margin: 0; color: var(--t-text-2) }
/* Widgets */
.teaser a { text-decoration: none; color: #ffffff; font-weight: 600 }
.cards { gap: 18px; grid-template-columns: repeat(2,minmax(0,1fr)); display: grid; margin: 24px 0 24px 0 }
.cards .teaser { box-shadow: 0 3px 14px #f3f3f114; padding: 0; overflow: hidden }
.cards .teaser .cardMedia { inline-size: 100%; padding: 12px }
.cards .teaser .cardMedia { aspect-ratio: 16 / 9; border: 1px solid #f3f3f140; object-fit: contain }
.cards .teaser .cardMedia { max-inline-size: 100%; background-color: #f3f3f1e6; block-size: auto }
.cards .cardBody { column-gap: 7px; row-gap: 7px; padding: 19px; min-inline-size: 0; display: grid }
.cards .cardActions { gap: 9px; display: flex; margin-block-start: auto; flex-wrap: wrap; align-items: center }
.cards .cardOnion { display: block; color: var(--t-text-2) }
.cards .cardOnion { font-size: .85em; min-inline-size: 0; line-height: 1.35 }
/* Base */
.cards .cardOnion code { font-family: inherit; overflow-wrap: anywhere }
.cards .cardReverse { grid-column: span 1 }
.cardsV2 { grid-template-columns: 1fr }
.cards.cardsV2 > .teaser { display: flex; flex-direction: row }
.cards.cardsV2 > .teaser { align-items: stretch; text-align: start }
.cardsV2 .cardReverse .cardMedia { order: 2 }
.cardsV2 .teaser .cardMedia { flex-shrink: 0; aspect-ratio: 4 / 3; inline-size: min(34%,260px) }
.cardsV3 { grid-template-columns: 1fr }
.cards.cardsV3 > .teaser { flex-direction: row; display: flex; padding: 12px; align-items: center; text-align: start }
.cards.cardsV3 > .teaser .cardMedia { inline-size: 107px; border-radius: 1038px; flex-shrink: 0; block-size: 107px; aspect-ratio: 1 / 1 }
/* Reset */
.cards.cardsV3 > .teaser .cardBody { flex: 1 1 auto; min-inline-size: 0; padding-inline: 12px; padding-block: 8px }
.cardsV4 { grid-template-columns: 1fr }
.cards.cardsV4 > .teaser { display: grid; text-align: start; grid-template-columns: minmax(180px,34%) 1fr }
.cardsV4 .teaser .cardMedia { block-size: 100%; aspect-ratio: 4 / 3 }
.cardLead { max-inline-size: 70ch; margin-block-end: 18px; color: var(--t-text-2) }
.cards .button { margin-block-start: 0; white-space: normal; text-align: center }
.notea { background-color: var(--t-wash); padding-inline: 9px; display: block; padding-block: 11px; margin-block-start: 18px }
.statusBar { display: block; background-color: var(--t-wash); padding-block: 11px; padding-inline: 9px; margin-block-start: 18px }
.utility { display: block; padding-inline: 9px; background-color: var(--t-wash); padding-block: 11px; margin-block-start: 18px }
.notea { border: 1px solid #292823d9; border-radius: 8px }
/* Media */
.statusBar { border: 1px solid #292823d9; border-radius: 8px }
.utility { border: 1px solid #292823d9; border-radius: 8px }
.utility { line-height: 1.45; font-size: .88em; margin-block-end: 18px }
.statusBar { margin-block-end: 18px; font-size: .88em; line-height: 1.45 }
.notea { margin-block-end: 18px; line-height: 1.45; font-size: .88em }
.utility a { font-weight: 600 }
.statusBar a { font-weight: 600 }
.notea a { font-weight: 600 }
.utility { text-align: start }
.ctx { background-color: var(--t-wash); border-inline-start: 5px solid var(--t-highlight); padding: 20px 18px 20px 18px; max-inline-size: 100% }
/* Navigation */
.ctx { margin-inline: 0; margin-block: 29px; border: 1px solid #292823e6; border-radius: 11px }
.ctx h2 { margin-block-start: 0; font-size: 1.08em }
.ctx h3 { font-size: 1.08em; margin-block-start: 0 }
.ctx p:last-child { margin-block-end: 0 }
.ctx ul { padding-inline-start: 1.26em; margin: 0px }
.catLink { color: #ffffff }
.pageEnd .catLink { color: #ffffff }
.links .catLink { color: #ffffff }
.links .catLink.catLink0,.pageEnd .catLink.catLink0,.catLink.catLink0 { font-weight: 700; color: #ffffff }
.catLink.catLink1 { padding-block: 2px; color: #111111; background-color: var(--t-highlight); display: inline-block; border-radius: 10px; padding-inline: 8px }
/* Utilities */
.pageEnd .catLink.catLink1 { display: inline-block; border-radius: 10px; padding-block: 2px; padding-inline: 8px; color: #111111; background-color: var(--t-highlight) }
.links .catLink.catLink1 { padding-block: 2px; color: #111111; padding-inline: 8px; display: inline-block; background-color: var(--t-highlight); border-radius: 10px }
.links .catLink.catLink1 { text-decoration: none; font-weight: 600 }
.pageEnd .catLink.catLink1 { text-decoration: none; font-weight: 600 }
.catLink.catLink1 { text-decoration: none; font-weight: 600 }
.links .catLink.catLink2,.pageEnd .catLink.catLink2,.catLink.catLink2 { font-weight: 600; padding-inline: 9px; padding-block: 2px; border-radius: 8px; text-decoration: none }
.catLink.catLink2 { color: #ffffff; border: 1.5px solid var(--t-highlight); display: inline-block }
.pageEnd .catLink.catLink2 { color: #ffffff; display: inline-block; border: 1.5px solid var(--t-highlight) }
.links .catLink.catLink2 { display: inline-block; color: #ffffff; border: 1.5px solid var(--t-highlight) }
.links .catLink.catLink3,.pageEnd .catLink.catLink3,.catLink.catLink3 { color: #ffffff; text-underline-offset: 3px; text-decoration: underline; text-decoration-thickness: 2px }
/* Misc */
.links .catLink.catLink4,.pageEnd .catLink.catLink4,.catLink.catLink4 { color: #ffffff; font-weight: 600 }
.links .catLink.catLink4::before { color: #ffffff; margin-inline-end: 0.31em; content: "•" }
.pageEnd .catLink.catLink4::before { content: "•"; margin-inline-end: 0.31em; color: #ffffff }
.catLink.catLink4::before { color: #ffffff; margin-inline-end: 0.31em; content: "•" }
.catLink.catLink4:hover { opacity: 1 }
.pageEnd .catLink.catLink4 { opacity: 1 }
.links .catLink.catLink4 { opacity: 1 }
.catLink.catLink3:hover { opacity: 1 }
.pageEnd .catLink.catLink3 { opacity: 1 }
.links .catLink.catLink3 { opacity: 1 }
/* Layout */
.catLink.catLink2:hover { opacity: 1 }
.pageEnd .catLink.catLink2 { opacity: 1 }
.links .catLink.catLink2 { opacity: 1 }
.catLink.catLink1:hover { opacity: 1 }
.pageEnd .catLink.catLink1 { opacity: 1 }
.links .catLink.catLink1 { opacity: 1 }
.catLink.catLink0:hover { opacity: 1 }
.pageEnd .catLink.catLink0 { opacity: 1 }
.links .catLink.catLink0 { opacity: 1 }
.burger { background: none; color: inherit }
/* Footer */
.burger { border: 0; align-items: center; cursor: pointer; display: none; inline-size: 28px; block-size: 22px }
.burger span { position: relative; block-size: 2px; display: block; background: currentColor; inline-size: 100% }
.burger span::before,.burger span::after { content: "" }
.burger span::before { background: currentColor; display: block; inset-inline-start: 0; position: absolute; inset-inline-end: 0; block-size: 2px }
.burger span::after { position: absolute; block-size: 2px; background: currentColor; display: block; inset-inline-start: 0; inset-inline-end: 0 }
.burger span::before { inset-block-start: -8px }
.burger span::after { inset-block-end: -8px }
.detailsLine { flex-wrap: wrap; margin: 0 0 20px }
.detailsLine { display: flex; font-size: .9em; row-gap: 9px; color: var(--t-text-2); column-gap: 15px }
.trail { margin-block-end: 12px; color: var(--t-text-2); font-size: .88em }
/* Responsive */
.trail a { text-decoration: none; color: var(--t-text-2) }
.labelj { display: inline-block; letter-spacing: 0.09em; margin-block-end: 11px; text-transform: uppercase; font-size: .76em }
.labelj { color: var(--t-highlight); font-weight: 700 }
.visual figcaption { color: var(--t-text-2); font-size: .85em; margin: 7px 0 0 }
.sequence .visual { margin: 14px 0 6px }
.articleText .visual { margin: 14px 0 6px }
.sequence .visual img { inline-size: 100%; border-radius: 7px }
.further { margin-block-start: 43px }
p.labelj { margin-block-end: 10px }
.articleText .task { margin-inline-end: 4px; color: var(--t-highlight) }
/* Lists */
.qa details { border: 1px solid var(--t-rule) }
.qa details { margin-inline: 0; margin-block: 11px; background-color: var(--t-panel); border-radius: 11px; padding-inline: 17px; padding-block: 13px }
.qa summary { font-weight: 600; cursor: pointer }
.qa details>div { padding-block-start: 8px }
.sequence { margin-block: 19px; margin-inline: 0 }
.sequence>div { gap: 16px; display: flex; margin-block-end: 17px; align-items: flex-start; margin-block-start: 17px }
.sequence>div>span { font-weight: 700; color: #111111; border-radius: 50%; font-family: 'Josefin Sans', 'Segoe UI', Roboto, sans-serif; display: grid; place-items: center; flex: 0 0 38px; background-color: var(--t-link); block-size: 38px }
.sequence h3 { margin: 6px 0 4px }
.responsiveTable { overflow-x: auto; max-inline-size: 100% }
figcaption { overflow-wrap: anywhere }
/* Article */
blockquote { overflow-wrap: anywhere }
td { overflow-wrap: anywhere }
dd { overflow-wrap: anywhere }
li { overflow-wrap: anywhere }
p { overflow-wrap: anywhere }
/* media */
@media (max-width: 39.31rem){h1,h2,h3 { overflow-wrap: anywhere }}
@media (max-width: 45.19rem){table { display: block; overflow-x: auto; max-inline-size: 100% }}
@media (max-width: 39.31rem){.plusMinus { grid-template-columns: minmax(0,1fr) }}
@media (max-width: 39.31rem){.plusMinus dd { grid-row: auto }}
@media (max-width: 39.31rem){.plusMinus dt { grid-row: auto }}
@media (max-width: 39.31rem){.cards { grid-template-columns: 1fr }}
@media (max-width: 39.31rem){.cards.cardsV2 > .teaser,.cards.cardsV4 > .teaser { display: block }}
@media (max-width: 39.31rem){.cards.cardsV2 > .teaser .cardMedia,.cards.cardsV4 > .teaser .cardMedia { inline-size: 100%; block-size: auto; aspect-ratio: 16 / 9 }}
@media (max-width: 39.31rem){.plusMinus { grid-template-columns: minmax(0,1fr) }}
