body[data-chapter="4"] .course-intro { left: 575px; width: 420px; }
.course-intro #course-play[hidden] { display: none; }
.course-test-launches { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; margin-top: .55rem; }
.course-test-launches button { display: flex; align-items: center; justify-content: center; gap: 3px; min-width: 0; min-height: 28px; padding: 3px 4px; border: 1px solid var(--map-border); border-radius: 9px; background: var(--map-surface); color: var(--map-text); font-family: inherit; font-size: .59rem; font-weight: 700; line-height: 1.1; cursor: pointer; }
.course-test-launches button:hover, .course-test-launches button:focus-visible { border-color: var(--course-blue); background: color-mix(in srgb, var(--course-blue) 8%, var(--map-surface)); }
.course-test-launches button:focus-visible { outline: 2px solid var(--course-blue); outline-offset: 2px; }
.course-test-launches button:disabled { cursor: default; opacity: .58; }
.course-test-launches button.is-running { border-color: var(--course-blue); color: var(--course-blue); opacity: 1; }
.course-test-launches button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.course-test-launches button svg { flex: none; width: 12px; height: 12px; fill: currentColor; }
body[data-chapter="4"] :is(.course-canvas, .course-lines) { width: 3100px; height: 1100px; }
body[data-chapter="4"] .course-micro-boundaries { display: block; }
body[data-chapter="4"] .course-micro-boundary--payments > span { color: var(--course-blue); }
body[data-chapter="4"] .course-micro-boundary--payments { left: 2445px; top: 790px; width: 240px; height: 150px; }
body[data-chapter="4"] .course-node[data-node^="svc-"] { width: 188px; height: 94px; }
body[data-chapter="4"] .course-node[data-node^="svc-"] .questions-map-card__question { min-height: 62px; padding: .5rem .55rem; border-radius: 18px; font-size: .72rem; }
body[data-chapter="4"] .course-node[data-node^="svc-"] .course-node__icon { top: 1px; left: calc(50% - 14.5px); width: 29px; height: 29px; }
body[data-chapter="4"] .course-node[data-node^="ext-"] { height: 72px; }
body[data-chapter="4"] .course-node[data-node="ext-keycloak"] { width: 160px; }
body[data-chapter="4"] .course-node[data-node="ext-gateway"] { width: 170px; }
body[data-chapter="4"] .course-node[data-node^="ext-"] .questions-map-card__question { min-height: 48px; padding: .38rem .4rem; border-radius: 13px; font-size: .67rem; }
body[data-chapter="4"] .course-node[data-node^="ext-"] .course-node__icon { top: 0; left: calc(50% - 11px); width: 22px; height: 22px; }
body[data-chapter="4"] .course-node[data-node="mobile"] .course-node__icon { top: -5px; left: calc(50% - 25px); width: 50px; height: 50px; }
body[data-chapter="4"] .course-node[data-node="database"] .questions-map-card__question { font-size: .78rem; }
body[data-chapter="4"] .course-node[data-node="client"] .questions-map-card__question,
body[data-chapter="4"] .course-node[data-node="mobile"] .questions-map-card__question { display: flex; align-items: center; justify-content: center; gap: .45rem; }
.course-test-badge { position: absolute; z-index: 4; right: -6px; bottom: 52px; display: grid; place-items: center; min-width: 31px; height: 16px; padding: 0 4px; border: 1px solid color-mix(in srgb, var(--course-blue) 45%, var(--map-border)); border-radius: 6px; background: color-mix(in srgb, var(--course-blue) 12%, var(--map-bg)); color: var(--course-blue); font-size: .43rem; font-weight: 850; line-height: 1; letter-spacing: .05em; pointer-events: none; }
body[data-chapter="4"] .course-node[data-node^="ext-"] .course-test-badge { bottom: 42px; }
.course-test-tools { display: none; position: absolute; z-index: 0; inset: 0; pointer-events: none; }
body[data-chapter="4"] .course-test-tools, .course-chapter-stage .course-test-tools { display: block; }
.course-test-tools__links { position: absolute; inset: 0; width: 3100px; height: 1100px; overflow: visible; }
.course-test-tools__links path { fill: none; stroke: var(--course-blue); stroke-width: 1.3; stroke-linecap: round; stroke-dasharray: 1 8; opacity: .46; }
.course-test-tools__links path[data-test-route="api:database"] { stroke: var(--course-resource); opacity: .32; }
.course-test-tools__links path.is-standby { opacity: 0; }
.course-test-tools__links path.is-running, body[data-chapter="4"] .course-lines path.course-test-route.is-running { stroke: var(--course-blue); stroke-width: 3.4; stroke-dasharray: 12 9; opacity: 1; filter: drop-shadow(0 0 3px var(--course-blue)); animation: course-test-route-flow var(--course-test-duration, 1.1s) linear 1 both; }
.course-test-tools__links path.is-returning, body[data-chapter="4"] .course-lines path.course-test-route.is-returning { animation-direction: reverse; }
.course-test-tools__links path.is-replaying, body[data-chapter="4"] .course-lines path.course-test-route.is-replaying { stroke: var(--course-blue); stroke-width: 3.4; stroke-dasharray: 12 9; opacity: 1; filter: drop-shadow(0 0 3px var(--course-blue)); animation: course-test-route-flow var(--course-replay-duration, 1.25s) linear 1 both; }
.course-test-tools__links path.is-replay-returning, body[data-chapter="4"] .course-lines path.course-test-route.is-replay-returning { animation-direction: reverse; }
.course-test-tools__links path.is-journal-selected, body[data-chapter="4"] .course-lines path.course-test-route.is-journal-selected { stroke: var(--course-blue); stroke-width: 2.4; opacity: .92; }
@keyframes course-test-route-flow { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -84; } }
body[data-chapter="4"] #course-packets { position: absolute; z-index: 4; inset: 0; pointer-events: none; }
.course-test-request-packet { position: absolute; display: inline-flex; align-items: center; gap: 6px; max-width: 190px; padding: 5px 8px; border: 1px solid var(--course-blue); border-radius: 999px; background: var(--map-bg); box-shadow: 0 3px 12px color-mix(in srgb, var(--course-blue) 24%, transparent); color: var(--course-blue); font-size: 12px; font-weight: 800; line-height: 1; white-space: nowrap; opacity: 0; transform: translate(-50%, -50%); animation: course-test-request-label var(--course-test-duration, 1.1s) ease-in-out 1 both; }
@keyframes course-test-request-label { 0%, 100% { opacity: 0; } 17%, 78% { opacity: 1; } }
.course-test-request-packet::before { content: ''; flex: none; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.course-test-request-packet[data-kind="reply"] { border-color: #389e74; color: #26845e; }
.course-test-request-packet[data-kind="error"] { border-color: #cc6b65; color: #bc5d57; }
.course-test-request-packet[data-kind="control"] { border-color: var(--map-border); color: var(--map-muted); }
.course-test-request-packet[data-route="app-a:app-b"] { border-color: #2baf76; color: #22875c; box-shadow: 0 3px 12px color-mix(in srgb, #2baf76 28%, transparent); }
.course-test-tool { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; height: 58px; padding: 4px 6px; border: 1px solid var(--map-border); border-radius: 12px; background: var(--map-surface); color: var(--map-text); font: inherit; line-height: 1; cursor: pointer; pointer-events: auto; }
.course-test-tool:is(:hover, :focus-visible, .is-selected) { border-color: var(--course-blue); }
.course-test-tool:focus-visible { outline: 2px solid var(--course-blue); outline-offset: 3px; }
.course-test-tool strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .68rem; font-weight: 750; }
.course-test-tool small { color: var(--map-muted); font-size: .47rem; font-weight: 650; }
.course-test-tool__stack { display: flex; justify-content: center; gap: 3px; max-width: 100%; }
.course-test-tool__group { display: inline-flex; align-items: center; gap: 2px; }
.course-test-tool__group + .course-test-tool__group::before { content: 'или'; margin: 0 3px; color: var(--map-muted); font-size: .43rem; font-weight: 650; }
.course-test-tool__mark { display: grid; flex: none; place-items: center; width: 23px; height: 23px; border: 1px solid var(--map-border); border-radius: 6px; background: var(--map-bg); }
.course-test-tool__mark iconify-icon { display: block; width: 15px; height: 15px; font-size: 15px; }
.course-test-tool.is-processing { animation: course-infra-pulse .55s ease-in-out; }
body[data-chapter="4"] .course-lines path.course-test-route { stroke: var(--map-line); stroke-width: 1.5; stroke-dasharray: 4 8; opacity: .66; transition: opacity .25s ease; }
body[data-chapter="4"] .course-lines path.course-test-route.is-standby { opacity: 0; pointer-events: none; }
body[data-chapter="4"] .course-lines path.course-test-route.is-faulty:not(.is-running) { stroke: #ce716b; opacity: .88; }
body[data-chapter="4"] .course-lines .course-micro-peer-link__line.course-test-route.is-running { stroke: #2baf76; filter: drop-shadow(0 0 4px #2baf76); }
body[data-chapter="4"] .course-micro-peer-link:has(.is-running) circle { stroke: #2baf76; fill: color-mix(in srgb, #2baf76 16%, var(--map-bg)); }
body[data-chapter="4"] .course-micro-peer-link:has(.is-running) .course-micro-peer-link__check { stroke: #2baf76; }
body[data-chapter="4"] .course-micro-peer-link.is-disabled :is(circle, .course-micro-peer-link__check) { opacity: .38; }
body[data-chapter="4"] .course-node.is-test-processing .questions-map-card__question { border-color: var(--course-blue); box-shadow: 0 0 0 4px color-mix(in srgb, var(--course-blue) 16%, transparent); }
body[data-chapter="4"] .course-node.is-test-replaying .questions-map-card__question, .course-test-tool.is-test-replaying { border-color: var(--course-blue); box-shadow: 0 0 0 4px color-mix(in srgb, var(--course-blue) 16%, transparent); }
body[data-chapter="4"] .course-node.is-journal-selected .questions-map-card__question, .course-test-tool.is-journal-selected { border-color: var(--course-blue); box-shadow: 0 0 0 2px color-mix(in srgb, var(--course-blue) 12%, transparent); }
.course-test-viz { display: grid; align-content: start; gap: .4rem; min-height: 0; margin: .28rem 0 .2rem; padding: .55rem; border: 1px solid var(--map-border); border-radius: 13px; background: color-mix(in srgb, var(--course-blue) 4%, var(--map-bg)); }
.course-test-viz__label { display: flex; justify-content: space-between; align-items: center; color: var(--map-muted); font-size: .66rem; font-weight: 700; }
.course-test-viz__label span { padding: .15rem .3rem; border-radius: 5px; background: color-mix(in srgb, var(--course-blue) 11%, var(--map-bg)); color: var(--course-blue); font-size: .51rem; font-weight: 850; }
.course-test-viz__row { display: flex; align-items: center; justify-content: space-between; gap: .55rem; min-width: 0; padding: .5rem .65rem; border: 1px solid var(--map-border); border-radius: 11px; background: var(--map-bg); color: var(--map-text); font-size: .69rem; }
.course-test-viz__row strong { flex: none; font-size: .69rem; }
.course-test-viz__row small { min-width: 0; overflow: hidden; color: var(--map-muted); font-size: .64rem; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.course-test-db__table-wrap { max-height: 10rem; overflow-y: auto; border: 1px solid var(--map-border); border-radius: 10px; background: var(--map-bg); scrollbar-width: thin; }
.course-test-db__table { width: 100%; border-collapse: collapse; color: var(--map-text); font-size: .62rem; text-align: left; }
.course-test-db__table :is(th, td) { padding: .4rem .38rem; border-bottom: 1px solid var(--map-border); }
.course-test-db__table th { position: sticky; top: 0; z-index: 1; background: var(--map-bg); color: var(--map-muted); font-weight: 750; }
.course-test-db__table tr:last-child td { border-bottom: 0; }
.course-test-db__table td:nth-child(2) { max-width: 9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.course-test-db__form { display: grid; gap: .25rem; color: var(--map-muted); font-size: .63rem; font-weight: 700; }
.course-test-db__command { display: flex; align-items: center; gap: .3rem; min-width: 0; border-bottom: 1px solid var(--course-blue); }
.course-test-db__command input { flex: 1; min-width: 0; padding: .38rem 0; border: 0; outline: 0; background: transparent; color: var(--map-text); font: 500 .61rem/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.course-test-db__command button { flex: none; padding: .3rem .4rem; border: 0; border-radius: 7px; background: color-mix(in srgb, var(--course-blue) 12%, var(--map-bg)); color: var(--course-blue); font-family: inherit; font-size: .62rem; font-weight: 750; line-height: 1.2; cursor: pointer; }
.course-test-db__feedback { margin: 0; color: var(--course-blue); font-size: .61rem; line-height: 1.3; }
.course-test-db__examples { color: var(--map-muted); font-size: .59rem; }
.course-test-db__examples summary { cursor: pointer; }
.course-test-db__examples code { display: block; padding: .2rem 0; overflow-wrap: anywhere; color: var(--map-text); font-size: .57rem; }
body[data-chapter="4"] .course-article[data-article="database"] .course-article__scroll { display: block; overflow-y: auto; overscroll-behavior: contain; }
body[data-chapter="4"] .course-article[data-article="database"] #course-article-visual:not(:empty) { display: grid; flex: none; align-content: start; }
.course-test-project__choices { display: flex; flex-wrap: wrap; gap: .3rem; }
.course-test-project__choices button { padding: .32rem .46rem; border: 1px solid var(--map-border); border-radius: 8px; background: var(--map-bg); color: var(--map-text); font-family: inherit; font-size: .62rem; font-weight: 700; line-height: 1.2; cursor: pointer; }
.course-test-project__choices button[aria-pressed="true"] { border-color: var(--course-blue); background: color-mix(in srgb, var(--course-blue) 12%, var(--map-bg)); color: var(--course-blue); }
.course-test-project__choices button:focus-visible { outline: 2px solid var(--course-blue); outline-offset: 2px; }
.course-test-project__choices button:disabled { cursor: default; opacity: .65; }
.course-test-project__stack { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .45rem; min-width: 0; margin-top: .4rem; color: var(--map-muted); font-size: .61rem; }
.course-test-project__tech { display: inline-flex; align-items: center; gap: .22rem; min-width: 0; white-space: nowrap; }
.course-test-project__tech .course-test-tool__mark { width: 19px; height: 19px; }
.course-test-project__tech iconify-icon { width: 12px; height: 12px; font-size: 12px; }
.course-test-project__profile { display: flex; flex-wrap: wrap; gap: .15rem .35rem; margin-top: .35rem; padding-top: .35rem; border-top: 1px solid var(--map-border); color: var(--map-muted); font-size: .59rem; line-height: 1.35; }
.course-test-project__profile strong { color: var(--map-text); }
.course-test-project__note { display: flex; align-items: center; gap: .35rem; margin-top: .28rem; color: var(--map-muted); font-size: .57rem; line-height: 1.25; }
.course-test-project__note .course-test-tool__mark { width: 18px; height: 18px; }
.course-test-project__note iconify-icon { width: 12px; height: 12px; font-size: 12px; }
body[data-chapter="4"] .course-article[data-article^="project-"] .course-article__scroll { display: block; overflow-y: auto; overscroll-behavior: contain; padding-bottom: .5rem; }
body[data-chapter="4"] .course-article[data-article^="project-"] #course-article-visual:not(:empty) { display: block; flex: none; }
body[data-chapter="4"] .course-article[data-article^="project-"] #course-article-primary { display: block; flex: none; min-height: auto; }
.course-test-code { margin: .25rem 0 .2rem; border: 1px solid var(--map-border); border-radius: 13px; background: var(--map-bg); }
body[data-chapter="4"] .course-article[data-article^="project-"] .course-test-code { display: block; overflow: visible; }
.course-test-code__tabs { display: flex; gap: .15rem; padding: .35rem .45rem 0; border-bottom: 1px solid var(--map-border); }
.course-test-code__tabs button { min-width: 0; padding: .42rem .52rem; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--map-muted); font-family: inherit; font-size: .66rem; font-weight: 700; line-height: 1.2; cursor: pointer; }
.course-test-code__tabs button[aria-selected="true"] { border-bottom-color: var(--course-blue); color: var(--course-blue); }
.course-test-code__tabs button:focus-visible { outline: 2px solid var(--course-blue); outline-offset: -2px; }
.course-test-code__body { padding: .45rem .55rem .55rem; }
.course-test-code__language { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .42rem; color: var(--map-muted); font-size: .61rem; font-weight: 700; }
.course-test-code__status { flex: none; padding: .16rem .34rem; border-radius: 6px; background: color-mix(in srgb, var(--course-blue) 12%, var(--map-bg)); color: var(--course-blue); }
.course-test-code__status[data-status="success"] { color: #278960; background: color-mix(in srgb, #278960 12%, var(--map-bg)); }
.course-test-code__status[data-status="error"] { color: #c35752; background: color-mix(in srgb, #c35752 12%, var(--map-bg)); }
.course-test-code__source { margin: 0; color: var(--map-text); font: 500 .61rem/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.course-test-code__source code { display: block; }
.course-test-code__line { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); min-height: 1.55em; margin: 0 -.35rem; padding: 0 .35rem; border-radius: 4px; }
.course-test-code__line.is-current { background: color-mix(in srgb, var(--course-blue) 13%, var(--map-bg)); }
.course-test-code__number { color: var(--map-muted); user-select: none; }
.course-test-code__keyword { color: #9b5dc4; font-weight: 750; }
.course-test-code__string { color: #248b71; }
.course-test-code__numeric { color: #bc6b3e; }
.course-test-code__call { color: #367dc0; }
.course-test-code__comment { color: var(--map-muted); }
html[data-theme="dark"] .course-test-code__keyword { color: #c995ee; }
html[data-theme="dark"] .course-test-code__string { color: #70d2ad; }
html[data-theme="dark"] .course-test-code__numeric { color: #efae79; }
html[data-theme="dark"] .course-test-code__call { color: #88bded; }
.course-test-code__checks { display: grid; gap: .48rem; color: var(--map-text); font-size: .7rem; }
.course-test-code__checks > div { display: flex; gap: .5rem; align-items: baseline; }
.course-test-code__checks span { color: var(--course-blue); font-weight: 800; }
.course-test-code__result { color: var(--map-text); font-size: .7rem; }
.course-test-code__result p { margin: .42rem 0 0; color: var(--map-muted); line-height: 1.5; }
body[data-chapter="4"] .course-test-journal { grid-template-columns: minmax(105px, 26%) minmax(0, 1fr); gap: .38rem; }
body[data-chapter="4"] .course-test-journal .course-infra-network__list { gap: .22rem; overflow-y: auto; scrollbar-width: thin; }
body[data-chapter="4"] .course-test-journal .course-infra-network__list button { gap: .18rem; padding: .34rem .35rem; border-radius: 8px; font-size: .61rem; }
body[data-chapter="4"] .course-test-journal .course-infra-network__list button small { font-size: .5rem; }
body[data-chapter="4"] .course-test-journal .course-infra-network__detail { display: flex; flex-direction: column; gap: .26rem; padding: .38rem; overflow-y: auto; border-radius: 10px; font-size: .63rem; line-height: 1.3; scrollbar-width: thin; }
.course-test-journal__heading { display: flex; align-items: center; gap: .4rem; min-width: 0; }
.course-test-journal__heading strong { min-width: 0; margin: 0; overflow: hidden; font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.course-test-journal__tag { flex: none; padding: .13rem .25rem; border-radius: 5px; background: color-mix(in srgb, var(--course-blue) 12%, var(--map-bg)); color: var(--course-blue); font-size: .48rem; font-weight: 800; }
.course-test-journal__tag[data-tone="reply"] { background: color-mix(in srgb, #26845e 12%, var(--map-bg)); color: #26845e; }
.course-test-journal__tag[data-tone="error"] { background: color-mix(in srgb, #bc5d57 12%, var(--map-bg)); color: #bc5d57; }
.course-test-journal__code-title { display: flex; justify-content: space-between; align-items: baseline; gap: .3rem; padding-top: .22rem; border-top: 1px solid var(--map-border); color: var(--map-text); font-size: .58rem; font-weight: 750; }
.course-test-journal__code-title small { min-width: 0; overflow: hidden; color: var(--map-muted); font-size: .51rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.course-test-journal__source { flex: 0 0 auto; min-width: 0; padding: .22rem .25rem; overflow-x: auto; border: 1px solid var(--map-border); border-radius: 8px; background: color-mix(in srgb, var(--course-blue) 3%, var(--map-bg)); font-size: .49rem; line-height: 1.25; white-space: pre; }
.course-test-journal__source .course-test-code__line { grid-template-columns: .9rem max-content; min-height: 1.25em; margin: 0 -.15rem; padding: 0 .15rem; }
.course-test-journal__source .course-test-code__line.is-current { box-shadow: inset 2px 0 var(--course-blue); }
.course-chapter-stage .course-test-tools { pointer-events: none; }
.course-chapter-stage .course-test-tool { pointer-events: none; }
.course-chapter-stage .course-node__title--test { position: absolute; z-index: 2; inset: 0; display: grid; place-items: center; padding: 0 .65rem; pointer-events: none; }
.course-chapter-stage .course-intro[data-stage-chapter="4"] { width: 420px; left: 575px; }
@media (prefers-reduced-motion: reduce) { body[data-chapter="4"] .course-lines path.course-test-route.is-running, body[data-chapter="4"] .course-lines path.course-test-route.is-replaying, .course-test-tools__links path.is-running, .course-test-tools__links path.is-replaying, .course-test-tool.is-processing { animation: none; } }