:root {
  --miradlo-navy: #000046;
  --miradlo-navy-deep: #00002f;
  --miradlo-link: #182f8a;
  --miradlo-ink: #111827;
  --miradlo-slate: #334155;
  --miradlo-line: #475569;
  --miradlo-border: #cbd5e1;
  --miradlo-surface: #ffffff;
  --miradlo-page: #f8fafc;
  --miradlo-soft: #eef2ff;
  --miradlo-focus: #f0b429;
  --miradlo-radius: .38rem;
  --miradlo-shadow: 0 2px 10px rgba(0, 0, 70, .08);
}
body { margin: 0; font-family: system-ui, sans-serif; line-height: 1.55; color: var(--miradlo-ink); background: var(--miradlo-page); }
header { background: var(--miradlo-navy); color: white; padding: 0.8rem 1rem; }
.environment-marker { margin: 0; padding: .4rem 1rem; background: #f0b429; color: #241600; font-weight: 800; text-align: center; }
.layout { display: grid; grid-template-columns: minmax(260px, 360px) minmax(0, 1fr); min-height: calc(100vh - 56px); }
.layout > nav { background: #fff; border-right: 1px solid #d9dde3; padding: 1rem; overflow: auto; position: sticky; top: 0; align-self: start; max-height: 100vh; box-sizing: border-box; }
main { background: #fff; margin: 1rem; padding: 1.5rem 2rem; border: 1px solid #d9dde3; border-radius: 8px; max-width: 1100px; min-width: 0; }
a { color: #174ea6; text-decoration: none; } a:hover { text-decoration: underline; }
.navigation-home { margin: 0 0 0.85rem; padding: 0 0 0.75rem; border-bottom: 1px solid #d9dde3; font-weight: 650; }
.navigation-home a { display: block; }
.tree-level { list-style: none; margin: 0; padding-left: 1rem; } nav > .tree-level { padding-left: 0; }
.tree-directory { margin: 0.2rem 0; } .tree-directory summary { cursor: pointer; font-weight: 650; padding: 0.15rem 0; }
.tree-document { margin: 0.12rem 0; } .tree-document a { display: block; padding: 0.18rem 0.35rem; border-radius: 4px; font-size: 0.92rem; }
.tree-document.active a { background: #e8f0fe; color: #0b3d91; font-weight: 650; }
code { background: #eef1f5; padding: 0.1rem 0.25rem; border-radius: 4px; overflow-wrap: anywhere; }
pre { background: #f3f5f7; color: #202124; border: 1px solid #d9dde3; padding: 1rem; overflow: auto; border-radius: 6px; line-height: 1.45; }
pre code { display: block; background: transparent; color: inherit; padding: 0; border-radius: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; overflow-wrap: normal; }
.artifact-ref { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: #e8f0fe; border: 1px solid #9bbcf1; padding: 0.05rem 0.25rem; border-radius: 4px; }
.artifact-ref.unresolved { background: #fff7d6; border-color: #f2d36b; color: #7a4d00; }
.artifact-id { margin: 0 0 1.2rem; color: #5f6368; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.9rem; }
.presentation-badge { position: relative; display: inline-flex; align-items: center; gap: .35rem; margin: 0 0 1rem; padding: .25rem .5rem; border: 1px solid currentColor; border-radius: 999px; color: #365f91; background: #f2f7ff; font-size: .82rem; font-weight: 700; }
.presentation-badge-icon { font-size: .75rem; }
.presentation-badge-tooltip { position: absolute; left: 0; bottom: calc(100% + .45rem); z-index: 30; width: max-content; max-width: min(26rem, 80vw); padding: .45rem .6rem; border: 1px solid #9bbcf1; border-radius: .35rem; background: #fff; color: #202124; box-shadow: 0 4px 14px rgba(31,41,55,.2); font-weight: 400; line-height: 1.35; visibility: hidden; opacity: 0; pointer-events: none; }
.presentation-badge:hover .presentation-badge-tooltip, .presentation-badge:focus-within .presentation-badge-tooltip { visibility: visible; opacity: 1; }
.presentation-dimension-artifact { color: #5b4b8a; background: #f7f4ff; }
.presentation-dimension-relationship { color: #7a4d00; background: #fff8e8; }
.presentation-dimension-context-time { color: #1c6b5c; background: #edf9f6; }
.presentation-dimension-structure { color: #505a6b; background: #f4f6f8; }
.presentation-dimension-control { color: #8a3c3c; background: #fff3f3; }
.presentation-dimension-report { color: #235e88; background: #eef7fc; }
.heading-anchor { margin-left: 0.4rem; opacity: 0; font-size: 0.8em; } h1:hover .heading-anchor, h2:hover .heading-anchor, h3:hover .heading-anchor, h4:hover .heading-anchor { opacity: 1; }
blockquote { margin: 1rem 0; padding: 0.5rem 1rem; border-left: 4px solid #9bbcf1; background: #f7f9fc; }
.table-wrap { overflow-x: auto; margin: 1rem 0; } table { border-collapse: collapse; width: 100%; } th, td { border: 1px solid #d9dde3; padding: 0.45rem 0.6rem; text-align: left; vertical-align: top; } th { background: #f3f5f7; }
img { max-width: 100%; height: auto; }
@media print { nav, header { display: none; } .layout { display: block; } main { border: 0; margin: 0; padding: 0; max-width: none; } a { color: inherit; text-decoration: none; } }
@media (max-width: 800px) { .layout { display: block; } .layout > nav { border-right: 0; border-bottom: 1px solid #d9dde3; } main { margin: 0; border: 0; border-radius: 0; } }
.presentation-title-block { margin: 1.6rem 0; padding: 0.9rem 0; border-top: 2px solid #9aa0a6; border-bottom: 2px solid #9aa0a6; text-align: center; }
.presentation-title { font-size: 1.25rem; font-weight: 750; letter-spacing: 0.02em; }
.presentation-subtitle { margin-top: 0.2rem; color: #5f6368; font-style: italic; }

.document-pager { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; margin-top: 2.5rem; padding: 1.25rem 0 0; border-top: 1px solid #d9dde3; background: transparent; overflow: visible; }
.document-pager a { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.8rem 1rem; border: 1px solid #d9dde3; border-radius: 7px; background: #f7f9fc; }
.document-pager-next { text-align: right; align-items: flex-end; }
.document-pager-direction { font-weight: 700; }
.document-pager-title { color: #5f6368; font-size: 0.92rem; }
.back-to-top { position: fixed; right: 1.25rem; bottom: 1.25rem; display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: 1px solid #9bbcf1; border-radius: 999px; background: #fff; box-shadow: 0 3px 12px rgba(31, 41, 55, 0.18); font-size: 1.35rem; font-weight: 750; z-index: 20; }
html { scroll-behavior: smooth; }
@media (max-width: 800px) { .layout > nav { position: static; max-height: none; } .document-pager { grid-template-columns: 1fr; } .document-pager-next { text-align: left; align-items: flex-start; } .back-to-top { right: 0.8rem; bottom: 0.8rem; } }
@media print { .document-pager, .back-to-top { display: none; } }
.processing-annotation { margin: 1rem 0; padding: .85rem 1rem; border-left: .35rem solid; border-radius: .35rem; }
.processing-annotation.todo { background: #fff8dc; border-color: #b7791f; }
.processing-annotation.review { background: #eef6ff; border-color: #2b6cb0; }
.processing-annotation-title { font-weight: 750; margin-bottom: .35rem; }
.processing-annotation-body > :first-child { margin-top: 0; }
.processing-annotation-body > :last-child { margin-bottom: 0; }
.processing-annotation-marker { display: inline-block; margin: 0 .2rem; padding: .05rem .35rem; border: 1px solid; border-radius: 999px; font-size: .82em; font-weight: 700; vertical-align: baseline; }
.processing-annotation-marker.todo { background: #fff8dc; border-color: #b7791f; }
.processing-annotation-marker.review { background: #eef6ff; border-color: #2b6cb0; }


/* Semantic knowledge presentation: explicit references only. */
.knowledge-reference { display: inline; position: relative; }
.semantic-reference, .interactive-code-reference { display: inline; position: relative; }
.semantic-reference details, .interactive-code-reference details { display: inline; }
.semantic-reference summary, .interactive-code-reference summary { display: inline-flex; align-items: baseline; gap: .22rem; cursor: pointer; color: #174ea6; border-bottom: 1px dotted currentColor; list-style: none; }
.semantic-reference summary::-webkit-details-marker, .interactive-code-reference summary::-webkit-details-marker { display: none; }
.semantic-reference-icon { display: inline-flex; width: 1.05em; height: 1.05em; align-items: center; justify-content: center; border: 1px solid currentColor; border-radius: .22rem; font-size: .68em; }
.semantic-reference-hover { position: absolute; left: 0; bottom: calc(100% + .45rem); z-index: 30; width: min(28rem, 80vw); padding: .55rem .7rem; border: 1px solid #9bbcf1; border-radius: .4rem; background: #fff; color: #202124; box-shadow: 0 4px 14px rgba(31,41,55,.2); font-size: .9rem; line-height: 1.35; visibility: hidden; opacity: 0; pointer-events: none; }
.semantic-reference summary:hover .semantic-reference-hover, .semantic-reference summary:focus .semantic-reference-hover, .semantic-reference summary:focus-visible .semantic-reference-hover { visibility: visible; opacity: 1; }
.semantic-reference details[open] .semantic-reference-hover { display: none; }
.semantic-reference-panel { display: block; margin: .65rem 0 1rem; padding: .85rem 1rem; border: 1px solid #9bbcf1; border-left-width: .35rem; border-radius: .45rem; background: #f7f9fc; max-width: 42rem; box-shadow: 0 3px 12px rgba(31,41,55,.10); }
.semantic-reference.relationship .semantic-reference-panel { border-color: #c78d26; background: #fffaf0; }
.semantic-reference.context-time .semantic-reference-panel { border-color: #328a77; background: #f0fbf8; }
.semantic-reference-kind { font-size: .82rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; margin-bottom: .2rem; }
.semantic-reference-title { font-weight: 700; margin-bottom: .2rem; }
.semantic-reference-meta { color: #5f6368; font-size: .88rem; margin-bottom: .35rem; }
.semantic-reference-summary { margin-bottom: .45rem; }
.semantic-reference-full-link { display: inline-flex; min-height: 2.2rem; align-items: center; font-weight: 650; }
.semantic-reference summary:focus-visible, .interactive-code-reference summary:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; border-radius: .2rem; }
.semantic-reference summary::after, .interactive-code-reference summary::after { content: " +"; font-size: .78em; font-weight: 750; }
.semantic-reference details[open] summary::after, .interactive-code-reference details[open] summary::after { content: " −"; }
.knowledge-reference details { display: inline; }
.knowledge-reference summary { display: inline-flex; align-items: baseline; gap: .22rem; cursor: pointer; color: #174ea6; border-bottom: 1px dotted currentColor; list-style: none; }
.knowledge-reference summary::-webkit-details-marker { display: none; }
.knowledge-icon { display: inline-flex; width: 1.1em; height: 1.1em; align-items: center; justify-content: center; border: 1px solid currentColor; border-radius: 50%; font-size: .78em; font-weight: 750; }
.knowledge-reference.learning-nugget .knowledge-icon { border-radius: .2rem; transform: rotate(45deg); }
.knowledge-reference.learning-nugget .knowledge-icon::first-letter { transform: rotate(-45deg); }
.knowledge-hover { position: absolute; left: 0; bottom: calc(100% + .45rem); z-index: 30; width: min(28rem, 80vw); padding: .55rem .7rem; border: 1px solid #9bbcf1; border-radius: .4rem; background: #fff; color: #202124; box-shadow: 0 4px 14px rgba(31,41,55,.2); font-size: .9rem; line-height: 1.35; visibility: hidden; opacity: 0; pointer-events: none; }
.knowledge-reference summary:hover .knowledge-hover, .knowledge-reference summary:focus .knowledge-hover, .knowledge-reference summary:focus-visible .knowledge-hover { visibility: visible; opacity: 1; }
.knowledge-reference details[open] .knowledge-hover { display: none; }
.knowledge-panel { display: block; margin: .65rem 0 1rem; padding: .85rem 1rem; border: 1px solid #9bbcf1; border-left-width: .35rem; border-radius: .45rem; background: #f7f9fc; max-width: 42rem; }
.knowledge-reference.learning-nugget .knowledge-panel { border-color: #8b6bb8; background: #faf7ff; }
.knowledge-kind { font-size: .82rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; margin-bottom: .35rem; }
.knowledge-detail { margin-bottom: .45rem; }
.knowledge-meta { color: #5f6368; font-size: .88rem; margin-bottom: .45rem; }
.knowledge-full-link { font-weight: 650; }
@media print { .knowledge-hover { display: none; } .knowledge-panel { break-inside: avoid; } }

/* KNOWLEDGE-PRESENTATION-FOUNDATION-001 */
.knowledge-reference summary:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; border-radius: .2rem; }
.knowledge-reference summary::after { content: " +"; font-size: .78em; font-weight: 750; }
.knowledge-reference details[open] summary::after { content: " −"; }
.knowledge-panel { box-shadow: 0 3px 12px rgba(31,41,55,.10); }
.knowledge-full-link { display: inline-flex; min-height: 2.2rem; align-items: center; }
.knowledge-navigation-link { margin: .75rem 0 1rem; padding-bottom: .75rem; border-bottom: 1px solid #d9dde3; font-weight: 700; }
.knowledge-directory { max-width: 72rem; }
.knowledge-directory-controls { display: grid; gap: .45rem; margin: 1rem 0 1.4rem; }
.knowledge-search { max-width: 34rem; padding: .65rem .75rem; border: 1px solid #9aa0a6; border-radius: .4rem; font: inherit; }
.knowledge-search:focus-visible { outline: 3px solid #174ea6; outline-offset: 2px; }
.knowledge-group { margin: 1.8rem 0; }
.knowledge-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(18rem,100%),1fr)); gap: .8rem; }
.knowledge-card { padding: .9rem 1rem; border: 1px solid #d9dde3; border-radius: .5rem; background: #fff; }
.knowledge-card h3 { margin-top: 0; }
.knowledge-card-meta { color: #5f6368; font-size: .88rem; }

/* Derived context graphs: source relationships remain in Markdown. */
.context-graph { margin: 2rem 0; padding: 1rem; border: 1px solid #9bbbd3; border-radius: .6rem; background: #f7fbff; }
.context-graph h2 { margin-top: 0; }
.context-graph-canvas { max-width: 100%; overflow: auto; padding: .35rem; border: 1px solid rgba(71, 85, 105, .18); border-radius: var(--miradlo-radius); background: rgba(255,255,255,.5); }
.context-graph-canvas:focus-visible { outline: 3px solid var(--miradlo-focus); outline-offset: 3px; }
.context-graph svg { display: block; min-width: 56rem; min-height: 18rem; overflow: visible; }
.context-edge { stroke: #315a7d; stroke-width: 2.25; fill: none; }
.context-arrow-head { fill: #315a7d; }
.context-edge.incoming { stroke-dasharray: 7 5; }
.context-edge-label { font: 12px system-ui, sans-serif; fill: #315a7d; text-anchor: middle; paint-order: stroke; stroke: #f7fbff; stroke-width: 4px; stroke-linejoin: round; }
.context-node { stroke: #315a7d; stroke-width: 2; fill: #fff; }
.context-node.center { fill: #dceefa; stroke: #173f5e; stroke-width: 3; }
.context-node.neighbor:hover, .context-node.neighbor:focus { fill: #e8f4fd; stroke-width: 3; }
.context-node-title { font: 14px system-ui, sans-serif; fill: #17324d; text-anchor: middle; font-weight: 700; pointer-events: none; }
.context-node-meta { font: 11px system-ui, sans-serif; fill: #456275; text-anchor: middle; pointer-events: none; }
.context-stereotype { fill: none; stroke: #315a7d; stroke-width: 1.7; pointer-events: none; }
.context-stereotype.meaning { fill: #e3f1fb; } .context-stereotype.artifact { fill: #e9f6ec; } .context-stereotype.relationship { fill: #fff4db; } .context-stereotype.context-time { fill: #f1e9fb; }
.context-graph-more { margin: .7rem 0 0; } .context-graph-more summary { cursor: pointer; color: #174ea6; font-weight: 650; }
.context-graph-todo { margin: 2rem 0; padding: .9rem 1rem; border-left: .35rem solid #b3261e; background: #fff0ef; color: #6b1713; }
.context-graph-gaps code { color: #5b1a15; }

/* Inline controls must remain valid phrasing content inside Markdown paragraphs. */
.inline-reference-toggle { display: inline-flex; align-items: baseline; gap: .22rem; padding: 0; border: 0; background: transparent; font: inherit; cursor: pointer; color: #174ea6; border-bottom: 1px dotted currentColor; text-align: inherit; }
.inline-reference-toggle::after { content: " +"; font-size: .78em; font-weight: 750; }
.inline-reference-toggle[aria-expanded="true"]::after { content: " −"; }
.inline-reference-toggle:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; border-radius: .2rem; }
.inline-reference-toggle:hover .knowledge-hover, .inline-reference-toggle:focus .knowledge-hover, .inline-reference-toggle:hover .semantic-reference-hover, .inline-reference-toggle:focus .semantic-reference-hover { visibility: visible; opacity: 1; }
.knowledge-panel[hidden], .semantic-reference-panel[hidden] { display: none; }
.knowledge-panel, .semantic-reference-panel { display: block; }
.knowledge-kind, .knowledge-detail, .knowledge-meta, .semantic-reference-kind, .semantic-reference-title, .semantic-reference-meta, .semantic-reference-summary { display: block; }
.knowledge-card[hidden] { display: none; }

/* Miradlo Visual Theme — solution-specific presentation, never semantics. */
header { background: linear-gradient(110deg, var(--miradlo-navy-deep), var(--miradlo-navy)); border-bottom: 3px solid var(--miradlo-focus); box-shadow: 0 2px 8px rgba(0,0,70,.16); }
header a { color: #fff; }
.layout > nav { background: #fbfcff; border-right-color: var(--miradlo-border); }
main { background: var(--miradlo-surface); border-color: var(--miradlo-border); border-radius: var(--miradlo-radius); box-shadow: var(--miradlo-shadow); }
h1, h2, h3, h4 { color: var(--miradlo-navy); line-height: 1.2; }
h1 { border-bottom: 2px solid var(--miradlo-navy); padding-bottom: .5rem; }
h2 { margin-top: 2rem; }
a, .tree-document a, .knowledge-reference summary, .semantic-reference summary, .interactive-code-reference summary, .inline-reference-toggle { color: var(--miradlo-link); }
a:hover { color: var(--miradlo-navy); text-decoration-thickness: .12em; text-underline-offset: .14em; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible { outline: 3px solid var(--miradlo-focus); outline-offset: 3px; border-radius: .18rem; }
.navigation-home { border-bottom-color: var(--miradlo-border); color: var(--miradlo-navy); }
.tree-directory summary { color: var(--miradlo-slate); }
.tree-document a:hover { background: var(--miradlo-soft); text-decoration: none; }
.tree-document.active a { background: var(--miradlo-soft); color: var(--miradlo-navy); border-left: 3px solid var(--miradlo-navy); border-radius: 0 var(--miradlo-radius) var(--miradlo-radius) 0; }
code { background: #f1f5f9; color: #172554; border: 1px solid #dbe3ee; }
pre { background: #101827; color: #e5edf8; border-color: #243247; border-radius: var(--miradlo-radius); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
pre code { border: 0; color: inherit; }
blockquote { border-left-color: var(--miradlo-navy); background: #f5f7ff; color: var(--miradlo-slate); }
th { background: #e9edff; color: var(--miradlo-navy); }
th, td { border-color: var(--miradlo-border); }
tr:nth-child(even) td { background: #fbfcff; }
.presentation-title-block { border-color: var(--miradlo-navy); }
.presentation-title { color: var(--miradlo-navy); }
.presentation-badge { color: var(--miradlo-navy); background: var(--miradlo-soft); border-radius: var(--miradlo-radius); }
.presentation-badge > a { display: inline-flex; align-items: center; gap: .35rem; color: inherit; text-decoration: none; }
.presentation-badge > a:hover { color: var(--miradlo-navy-deep); text-decoration: none; }
.presentation-badge > a:focus-visible { outline-color: var(--miradlo-focus); }
.presentation-badge-tooltip, .knowledge-hover, .semantic-reference-hover { border-color: var(--miradlo-border); box-shadow: var(--miradlo-shadow); }
.document-pager { border-top-color: var(--miradlo-border); }
.document-pager a, .knowledge-card { border-color: var(--miradlo-border); border-radius: var(--miradlo-radius); background: #fbfcff; box-shadow: none; }
.document-pager a:hover, .knowledge-card:hover { border-color: var(--miradlo-navy); background: var(--miradlo-soft); text-decoration: none; }
.back-to-top { color: #fff; background: var(--miradlo-navy); border-color: var(--miradlo-navy); box-shadow: var(--miradlo-shadow); }
.back-to-top:hover { background: var(--miradlo-navy-deep); }
.processing-annotation { border-radius: var(--miradlo-radius); }
.processing-annotation.review { background: #eef2ff; border-color: var(--miradlo-navy); }
.semantic-reference-panel, .knowledge-panel { border-color: #9db0de; background: #f7f9ff; box-shadow: var(--miradlo-shadow); }
.knowledge-search { border-color: var(--miradlo-border); border-radius: var(--miradlo-radius); }
.knowledge-search:focus-visible { outline-color: var(--miradlo-focus); }
.presentation-notation { margin: 1.25rem 0; padding: 1rem 1.15rem; border-left: .3rem solid var(--miradlo-navy); border-radius: 0 var(--miradlo-radius) var(--miradlo-radius) 0; background: #f5f7ff; }
.presentation-notation h2 { margin-top: 0; }
.presentation-notation dl { display: grid; grid-template-columns: minmax(16rem, .9fr) minmax(0, 1.6fr); gap: .5rem 1rem; margin-bottom: 0; }
.presentation-notation dt { color: var(--miradlo-navy); font-weight: 750; }
.presentation-notation dd { margin: 0; color: var(--miradlo-slate); }

/* Context graph: quiet, precise relations; symbols carry the dimension. */
.context-graph { border-color: var(--miradlo-border); border-radius: var(--miradlo-radius); background: linear-gradient(180deg, #fbfcff, #f6f8ff); box-shadow: var(--miradlo-shadow); }
.context-graph > h2 { color: var(--miradlo-navy); }
.context-graph-controls { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: .75rem 0; }
.context-graph-controls button { min-width: 2.15rem; min-height: 2.15rem; border: 1px solid var(--miradlo-border); border-radius: var(--miradlo-radius); background: #fff; color: var(--miradlo-navy); cursor: pointer; font: inherit; font-weight: 700; }
.context-graph-controls button:hover { border-color: var(--miradlo-navy); background: var(--miradlo-soft); }
.context-graph-controls-hint { flex: 1 1 17rem; color: var(--miradlo-slate); font-size: .84rem; }
.context-graph-canvas { cursor: grab; }
.context-graph-canvas.is-panning { cursor: grabbing; user-select: none; }
.context-edge { stroke: var(--miradlo-line); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.context-arrow-head { fill: var(--miradlo-line); }
.context-edge.incoming { stroke-dasharray: 5 4; opacity: .88; }
.context-edge.external-evidence { stroke: #8a5a15; stroke-dasharray: 2 5; }
.context-edge-label { fill: var(--miradlo-slate); font-size: 11px; stroke: #f8faff; stroke-width: 3px; pointer-events: none; }
.context-edge-hit { stroke: transparent; stroke-width: 16; fill: none; pointer-events: stroke; }
.context-edge-group { cursor: help; }
.context-edge-group:hover .context-edge, .context-edge-group:focus .context-edge { stroke: var(--miradlo-navy); stroke-width: 2.5; opacity: 1; }
.context-edge-group:hover .context-arrow-head, .context-edge-group:focus .context-arrow-head { fill: var(--miradlo-navy); }
.context-edge-group:hover .context-edge-label, .context-edge-group:focus .context-edge-label { fill: var(--miradlo-navy); font-weight: 700; }
.context-node { stroke: var(--miradlo-line); stroke-width: 1.25; fill: #fff; }
.context-node.center { fill: #eef1ff; stroke: var(--miradlo-navy); stroke-width: 1.75; }
.context-node.neighbor:hover, .context-node.neighbor:focus { fill: #f0f3ff; stroke: var(--miradlo-navy); stroke-width: 1.75; }
.context-node.external-evidence { fill: #fff8e7; stroke: #8a5a15; stroke-width: 1.6; stroke-dasharray: 5 3; }
.context-node-link.external-evidence:hover .context-node.external-evidence, .context-node-link.external-evidence:focus .context-node.external-evidence { fill: #fff0c9; stroke-width: 2.3; }
.context-external-icon { fill: #8a5a15; font: 700 18px system-ui, sans-serif; pointer-events: none; }
.context-node-panel.external-evidence { border-left: .3rem solid #8a5a15; }
.context-external-lane-label { fill: #765217; font: 650 12px system-ui, sans-serif; }
.context-node-link, .context-node-center { cursor: help; }
.context-node-link { cursor: pointer; }
.context-node-link:focus .context-node, .context-node-center:focus .context-node { stroke: var(--miradlo-navy); stroke-width: 2.5; }
.context-node-title { fill: var(--miradlo-ink); font-size: 13px; font-weight: 650; }
.context-stereotype { stroke: var(--miradlo-navy); stroke-width: 1.35; }
.context-stereotype.meaning { fill: #e6eaff; }
.context-stereotype.artifact { fill: #e7f5ec; }
.context-stereotype.relationship { fill: #fff2d9; }
.context-stereotype.context-time { fill: #f1e8fb; }
.context-graph-more summary { color: var(--miradlo-link); }
.context-graph-todo { border-left-color: #b42318; background: #fff4f2; color: #7a271a; }
.realization-view { margin: 2rem 0; padding: 1rem; border: 1px solid var(--miradlo-border); border-radius: var(--miradlo-radius); background: #fbfcff; box-shadow: var(--miradlo-shadow); }
.realization-view > h2 { color: var(--miradlo-navy); }
.deployment-view { margin: 2rem 0; padding: 1rem; border: 1px solid var(--miradlo-border); border-radius: var(--miradlo-radius); background: #fbfcff; box-shadow: var(--miradlo-shadow); }
.deployment-view > h2 { color: var(--miradlo-navy); }
.deployment-node-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 1rem; align-items: start; }
.deployment-node { min-height: 17rem; padding: .8rem; border: 2px solid var(--miradlo-navy); border-radius: .45rem; background: #f7f9ff; box-shadow: inset 0 0 0 .3rem rgba(40,59,120,.06); }
.deployment-node.external-work-environment { border-style: dashed; background: #fffaf0; }
.deployment-node-title { display: grid; grid-template-columns: auto 1fr; gap: .2rem .45rem; align-items: center; color: var(--miradlo-navy); text-decoration: none; cursor: pointer; }
.deployment-node-title span:nth-child(2) { font-size: .78rem; font-weight: 700; }
.deployment-node-title strong { grid-column: 1 / -1; font-size: 1.05rem; }
.deployment-node-title:hover strong, .deployment-node-title:focus-visible strong { text-decoration: underline; }
.deployment-parameters { margin: .75rem 0; padding: .55rem .7rem .55rem 1.5rem; border: 1px solid var(--miradlo-border); border-radius: .3rem; background: #fff; font-size: .86rem; }
.deployment-parameters li + li { margin-top: .2rem; }
.deployment-components { display: grid; gap: .45rem; }
.deployment-component { display: block; padding: .55rem .65rem; border: 1px solid #7486b9; border-radius: .3rem; background: #fff; color: var(--miradlo-ink); text-decoration: none; cursor: pointer; font-weight: 650; }
.deployment-component.runtime-target { border-style: dashed; background: #f4faf7; }
.deployment-component:hover, .deployment-component:focus-visible { border-color: var(--miradlo-navy); background: var(--miradlo-soft); outline: none; }
.deployment-external-links { display: grid; gap: .25rem; margin-top: .75rem; font-size: .86rem; }
.deployment-external-link { overflow-wrap: anywhere; }
.deployment-relations { margin: 1rem 0 0; padding: .7rem 1rem .7rem 2rem; border-left: .3rem solid #c1531c; background: #fff; }
.building-block-view { margin: 2rem 0; padding: 1rem; border: 1px solid var(--miradlo-border); border-radius: var(--miradlo-radius); background: #fbfcff; box-shadow: var(--miradlo-shadow); }
.building-block-view > h2 { color: var(--miradlo-navy); }
.building-block-boundaries { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .7rem; margin: 1rem 0; }
.building-block-focus { padding: .9rem; border: 2px solid var(--miradlo-navy); border-radius: .45rem; background: #f5f7ff; box-shadow: inset 0 0 0 .3rem rgba(40,59,120,.06); }
.building-block-focus-title { display: grid; gap: .2rem; color: var(--miradlo-navy); text-decoration: none; }
.building-block-focus-title span { font-size: .78rem; font-weight: 700; }
.building-block-focus-title strong { font-size: 1.05rem; }
.building-block-focus-title:hover strong, .building-block-focus-title:focus-visible strong { text-decoration: underline; }
.building-block-programs { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: .65rem; margin-top: .8rem; }
.building-block-card { display: grid; gap: .25rem; min-height: 4rem; padding: .6rem .7rem; border: 1px solid #7486b9; border-radius: .3rem; background: #fff; color: var(--miradlo-ink); text-decoration: none; cursor: pointer; }
.building-block-card.boundary { border-style: dashed; background: #fffaf0; }
.building-block-card:hover, .building-block-card:focus-visible { border-color: var(--miradlo-navy); background: var(--miradlo-soft); outline: none; }
.building-block-card code { color: var(--miradlo-slate); font-size: .76rem; overflow-wrap: anywhere; }
.realization-canvas { position: relative; height: min(42rem, 72vh); min-height: 25rem; overflow: hidden; padding: 0; background: #fff; touch-action: none; }
.realization-canvas .context-graph-svg { width: 100%; height: 100%; min-width: 0; min-height: 0; }
.context-minimap { position: absolute; right: .8rem; bottom: .8rem; z-index: 4; width: 11.25rem; padding: .35rem; border: 1px solid rgba(0, 0, 70, .28); border-radius: .45rem; background: rgba(255,255,255,.92); box-shadow: 0 4px 16px rgba(0,0,70,.16); cursor: crosshair; }
.context-minimap svg { display: block; width: 100%; height: auto; min-width: 0; min-height: 0; background: #f5f7ff; }
.context-minimap span { display: block; margin-top: .18rem; color: var(--miradlo-slate); font-size: .72rem; text-align: center; }
.context-minimap-node { fill: #8091c8; stroke: #34477d; stroke-width: .5; }
.context-minimap-node.is-focus { fill: #283b78; stroke: #111d4e; }
.context-minimap-viewport { fill: rgba(193,83,28,.13); stroke: rgba(193,83,28,.78); stroke-width: 1.35; pointer-events: none; }
.context-minimap-controls { display: grid; grid-template-columns: repeat(auto-fit, minmax(1.3rem, 1fr)); gap: .16rem; margin-top: .3rem; }
.context-minimap-controls button { min-width: 0; min-height: 1.65rem; padding: 0; border: 1px solid rgba(0,0,70,.22); border-radius: .25rem; background: rgba(255,255,255,.9); color: var(--miradlo-navy); cursor: pointer; font: 700 .84rem/1 system-ui, sans-serif; }
.context-minimap-controls button:hover, .context-minimap-controls button:focus-visible { border-color: var(--miradlo-navy); background: var(--miradlo-soft); outline: none; }
.context-lane { stroke: rgba(0, 0, 70, .16); stroke-width: 1; }
.context-lane.enterprise { fill: #eef0ff; }
.context-lane.solution { fill: #f4f6ff; }
.context-lane.engineering { fill: #f4f8fb; }
.context-lane.runtime { fill: #f4faf7; }
.context-lane-label { fill: var(--miradlo-navy); font: 700 14px system-ui, sans-serif; pointer-events: none; }
.context-node.realization { fill: #fff; }
.context-node.center.realization { fill: #e8ecff; }
.context-edge.realization { stroke: var(--miradlo-navy); }
.context-node.realization.secondary { fill: #fbfcff; stroke: #8091c8; stroke-dasharray: 3 2; opacity: .92; }
.context-edge.realization.secondary { stroke: #7183b7; stroke-dasharray: 4 4; opacity: .75; }
.context-edge-label.secondary { fill: #5b6d9b; font-size: 10px; }
.context-minimap-controls button[data-context-action="toggle-secondary"][aria-pressed="true"] { background: #dfe5ff; border-color: var(--miradlo-navy); }
.context-node-preview { position: fixed; z-index: 100; width: min(19rem, calc(100vw - 2rem)); padding: .65rem .75rem; border: 1px solid var(--miradlo-border); border-left: .3rem solid var(--miradlo-navy); border-radius: var(--miradlo-radius); background: #fff; color: var(--miradlo-ink); box-shadow: 0 8px 22px rgba(0,0,70,.18); pointer-events: none; font-size: .9rem; line-height: 1.35; }
.context-node-preview strong, .context-node-preview span { display: block; }
.context-node-preview-kind, .context-node-panel-kind { margin: .2rem 0 .4rem; color: var(--miradlo-slate); font-size: .82rem; font-weight: 700; }
.context-node-panel { position: fixed; z-index: 101; box-sizing: border-box; width: min(32rem, calc(100vw - 1.75rem)); max-height: min(30rem, calc(100vh - 1.75rem)); overflow: auto; padding: .9rem 1rem; border: 1px solid var(--miradlo-border); border-left: .3rem solid var(--miradlo-navy); border-radius: var(--miradlo-radius); background: #fff; box-shadow: 0 12px 30px rgba(0,0,70,.22); }
.context-node-panel-header { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; color: var(--miradlo-navy); }
.context-node-panel-header button { min-width: 2rem; min-height: 2rem; border: 1px solid var(--miradlo-border); border-radius: var(--miradlo-radius); background: #fff; color: var(--miradlo-navy); cursor: pointer; font-size: 1.2rem; line-height: 1; }
.context-node-panel-header button:hover { border-color: var(--miradlo-navy); background: var(--miradlo-soft); }
.historical-reference { border-bottom: 1px dashed var(--miradlo-slate); color: var(--miradlo-slate); cursor: help; }
.historical-reference::after { content: "historische Quelle"; display: inline-block; margin-left: .35rem; padding: .05rem .3rem; border-radius: .3rem; background: #edf0f5; color: #526176; font-size: .72em; font-weight: 700; white-space: nowrap; }
@media (max-width: 600px) {
  .knowledge-hover { display: none; }
  .knowledge-panel { max-width: calc(100vw - 2rem); }
  .knowledge-reference summary { min-height: 2.4rem; align-items: center; }
  .presentation-notation dl { grid-template-columns: 1fr; gap: .18rem; }
  .presentation-notation dd { margin-bottom: .65rem; }
}
@media print {
  .knowledge-reference summary::after { content: ""; }
  .knowledge-reference details:not([open]) .knowledge-panel { display: none; }
  .knowledge-navigation-link, .knowledge-directory-controls { display: none; }
  .knowledge-card-grid { display: block; }
  .knowledge-card { break-inside: avoid; margin-bottom: .7rem; }
}
footer.public-imprint { max-width: 92rem; margin: 2rem auto; padding: 1rem; color: #52677a; border-top: 1px solid #c8d6dd; }