/* dcm-engine.css — GENERATED by scripts/build-dcm.ts from templates-host/templates/dcm/assets/canvas-template.html
   (Deep Cause Mapping™, Solving Forces — the card notation). Do not edit: change the template and rebuild.
   Every rule is scoped under .sf-dcm-scope; the platform's own layout and the steps / focus states are in dcm.css.
   font-display: block, as the template has it: the map is laid out for Khand — a fallback face would overflow the boxes
   for the moment until Khand arrives (the element preloads the two weights it draws with). */
@font-face{font-family:Khand;font-style:normal;font-weight:400;font-display:block;src:url(/ext/dcm/khand-400.woff2) format("woff2")}
@font-face{font-family:Khand;font-style:normal;font-weight:500;font-display:block;src:url(/ext/dcm/khand-500.woff2) format("woff2")}
@font-face{font-family:Khand;font-style:normal;font-weight:600;font-display:block;src:url(/ext/dcm/khand-600.woff2) format("woff2")}
.sf-dcm-scope {
  --dcm-ink: #0e0d11;          
  --dcm-blue: #2782a9;         
  --dcm-line: #48a4c8;         
  --dcm-mint: #e7f0e7;         
  --dcm-cream: #fdf5e2;        
  --dcm-cyan: #7fd1e2;         
  --dcm-muted: #55707a;
  --dcm-rule: rgba(39, 130, 169, .28);
  --dcm-stroke: 3.25px;
}
.sf-dcm-scope * { box-sizing: border-box; }
.sf-dcm-scope .cec-head { display: flex; align-items: center; gap: .8rem 1.4rem; flex-wrap: wrap;
  padding: .55rem 1rem .5rem; background: var(--dcm-cream); border-bottom: 3px solid var(--dcm-blue); }
.sf-dcm-scope .cec-logo { height: 34px; width: auto; align-self: center; margin-right: .6rem; }
.sf-dcm-scope .cec-brand { font-size: .82rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--dcm-blue); line-height: 1.1; }
.sf-dcm-scope .cec-head h1 { font-size: 1.45rem; font-weight: 600; margin: 0; line-height: 1.05; color: var(--dcm-ink); }
.sf-dcm-scope .cec-head-meta { font-size: .9rem; color: var(--dcm-blue); line-height: 1.15; }
.sf-dcm-scope .cec-tools { display: inline-flex; align-items: center; gap: .45rem; margin-left: auto; flex-wrap: wrap; }
.sf-dcm-scope .cec-btn, .sf-dcm-scope .cec-lang button { font-family: inherit; font-size: .9rem; font-weight: 500; line-height: 1;
  color: var(--dcm-blue); background: transparent; border: 0; padding: .38rem .6rem; cursor: pointer; }
.sf-dcm-scope .cec-btn { border: 2px solid var(--dcm-line); }
.sf-dcm-scope .cec-btn:hover, .sf-dcm-scope .cec-lang button:hover { color: var(--dcm-ink); }
.sf-dcm-scope .cec-btn.is-active { background: var(--dcm-blue); border-color: var(--dcm-blue); color: var(--dcm-cream); }
.sf-dcm-scope .cec-lang { display: inline-flex; border: 2px solid var(--dcm-line); }
.sf-dcm-scope .cec-lang button + button { border-left: 2px solid var(--dcm-line); }
.sf-dcm-scope .cec-lang button.is-active { background: var(--dcm-blue); color: var(--dcm-cream); cursor: default; }
.sf-dcm-scope .cec-toast { padding: .28rem 1rem; font-size: .92rem; color: var(--dcm-blue); background: var(--dcm-cream);
  border-bottom: 1px solid var(--dcm-rule); }
.sf-dcm-scope .cec-body { flex: 1 1 auto; display: flex; align-items: stretch; }
.sf-dcm-scope .cec-canvas-wrap { flex: 1 1 auto; overflow-x: auto; overflow-y: visible; position: relative;
  background: var(--dcm-mint); }
.sf-dcm-scope .cec-scale { position: relative; margin: 0 auto; }
.sf-dcm-scope .cec-canvas { position: relative; transform-origin: top left; }
.sf-dcm-scope .cec-canvas.is-locked .cec-block { cursor: default; }
.sf-dcm-scope .cec-svg { position: absolute; inset: 0; z-index: 1; overflow: visible; }
.sf-dcm-scope .cec-edge, .sf-dcm-scope .cec-wire-unk, .sf-dcm-scope .cec-wire-bar, .sf-dcm-scope .cec-act-arrow, .sf-dcm-scope .cec-bar-line, .sf-dcm-scope .cec-contrib-line, .sf-dcm-scope .cec-factor-line, .sf-dcm-scope .cec-gen {
  fill: none; stroke: var(--dcm-line); stroke-width: var(--dcm-stroke);
  stroke-linecap: butt; stroke-linejoin: miter; }
.sf-dcm-scope .cec-gen.is-from { stroke-dasharray: 7 6; }
.sf-dcm-scope .cec-edge-note { font-family: Khand, sans-serif; font-size: 13.5px; fill: var(--dcm-muted); }
.sf-dcm-scope .cec-block { position: absolute; z-index: 2; display: flex; flex-direction: column; justify-content: center;
  gap: 1px; padding: 6px 10px 8px; background: var(--dcm-mint); border: var(--dcm-stroke) solid var(--dcm-line);
  border-radius: 0; font-size: 16px; line-height: 1.12; cursor: grab; }
.sf-dcm-scope .cec-block:active { cursor: grabbing; }
.sf-dcm-scope .cec-lbl { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; font-size: 12.5px; line-height: 1;
  color: var(--dcm-blue); letter-spacing: .02em; margin-bottom: 3px; }
.sf-dcm-scope .cec-lbl .n { flex: 0 0 auto; }
.sf-dcm-scope .cec-lbl .n { font-weight: 600; }
.sf-dcm-scope .cec-obj { font-weight: 400; color: var(--dcm-ink); }
.sf-dcm-scope .cec-dev { font-weight: 600; color: var(--dcm-ink); }
.sf-dcm-scope .cec-txt { color: var(--dcm-ink); }
.sf-dcm-scope .cec-when { font-size: 12.5px; color: var(--dcm-muted); margin-top: 1px; }
.sf-dcm-scope .cec-block.is-unknown { align-items: center; justify-content: center; text-align: center; padding: 6px 12px;
  color: var(--dcm-blue); font-size: 21px; line-height: 1; }
.sf-dcm-scope .cec-block.st-eliminated { opacity: .5; }
.sf-dcm-scope .cec-block.st-eliminated .cec-dev { text-decoration: line-through; }
.sf-dcm-scope .cec-rail { order: -1; width: 330px; flex: 0 0 330px; padding: .7rem .85rem 1.2rem;
  background: var(--dcm-cream); border-right: 1px solid var(--dcm-rule);
  position: sticky; top: 0; align-self: flex-start; max-height: 100vh; overflow-y: auto; }
.sf-dcm-scope .cec-rail.is-collapsed { display: none; }
.sf-dcm-scope .cec-rail h2 { font-size: 1rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em;
  color: var(--dcm-blue); margin: 1rem 0 .3rem; }
.sf-dcm-scope .cec-rail h2:first-child { margin-top: 0; }
.sf-dcm-scope .cec-rail ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; }
.sf-dcm-scope .cec-mrow { font-size: .98rem; line-height: 1.18; padding: .12rem 0 .12rem .55rem; border-left: 2.5px solid var(--dcm-line); }
.sf-dcm-scope .cec-mrow .n { font-weight: 600; color: var(--dcm-blue); }
.sf-dcm-scope .cec-mrow .to, .sf-dcm-scope .cec-mrow small { color: var(--dcm-blue); }
.sf-dcm-scope .cec-mrow.is-q { border-left-style: dotted; }
.sf-dcm-scope .cec-rail-src { font-size: .85rem; color: var(--dcm-muted); margin-top: 1.1rem; }
.sf-dcm-scope .cec-legend-float { position: fixed; bottom: 14px; z-index: 30; display: flex; flex-direction: column;
  gap: .3rem; padding: .5rem .7rem .55rem; background: var(--dcm-cream); border: 2px solid var(--dcm-line); }
.sf-dcm-scope .cec-legend-float .chip { display: flex; align-items: center; gap: .5rem; font-size: .9rem; line-height: 1.05; }
.sf-dcm-scope .cec-legend-float svg { flex: 0 0 auto; }
.sf-dcm-scope .cec-legend-float .w { color: var(--dcm-blue); font-weight: 600; }
.sf-dcm-scope .cec-legend-float .q { color: var(--dcm-blue); }
.sf-dcm-scope .cec-legend-float .k { color: var(--dcm-ink); }
.sf-dcm-scope .cec-print-foot { display: none; }

@media (max-width: 860px) {
.sf-dcm-scope .cec-rail { width: 250px; flex-basis: 250px; } }
.sf-dcm-scope { --def-purple: #542992; --def-line: #7c2e99; --def-lav: #ac7fc6; --def-green: #3db653; }
.sf-dcm-scope .cec-btn.is-define { border-color: var(--def-line); color: var(--def-purple); }
.sf-dcm-scope .cec-btn.is-define.is-active, .sf-dcm-scope .cec-btn.is-define:hover { background: var(--def-purple); border-color: var(--def-purple); color: var(--dcm-cream); }
.sf-dcm-scope .cec-rail-head { font-size: 1.25rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 .5rem; padding: .15rem 0 .2rem;
  border-bottom: 3px solid currentColor; }
.sf-dcm-scope .cec-rail-head.is-discover { color: var(--dcm-blue); }
.sf-dcm-scope .cec-rail-head.is-define { color: var(--def-purple); margin-top: 1.6rem; }
.sf-dcm-scope .cec-mrow.is-def { border-left-width: 4px; }
.sf-dcm-scope .cec-mrow.is-def .rt { font-weight: 600; }
.sf-dcm-scope .cec-rail .cec-btn.is-define { margin-top: .7rem; }
.sf-dcm-scope .cec-def-none { color: var(--dcm-muted); font-size: .98rem; }
.sf-dcm-scope .cec-define-wrap { flex: 1 1 auto; overflow: auto; background: var(--dcm-cream); }
.sf-dcm-scope .cec-define { padding: 1.1rem 1.6rem 2.2rem; max-width: 1240px; }
.sf-dcm-scope .cec-def-title { font-size: 2.1rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--def-purple); margin-bottom: .8rem; }
.sf-dcm-scope .cec-def-block { position: relative; border-left: 6px solid var(--def-line); padding: 0 0 .4rem 1.3rem; margin: 0 0 2rem; }
.sf-dcm-scope .cec-def-block > h3 { position: relative; margin: 0 0 .4rem; font-size: 1.75rem; font-weight: 600; color: var(--def-purple); text-transform: uppercase; line-height: 1.1; }
.sf-dcm-scope .cec-def-block.is-list > h3::before { content: ""; position: absolute; left: calc(-1.3rem - 15px); top: .2em; width: 18px; height: 18px;
  border: 5px solid var(--dcm-ink); border-radius: 50%; background: var(--dcm-cream); }
.sf-dcm-scope .cec-def-block > h3.pill { display: inline-block; border: 3px solid var(--def-line); border-radius: 999px; padding: .15rem .9rem;
  font-size: 1.3rem; margin-left: -2.25rem; background: var(--dcm-cream); color: var(--dcm-ink); }
.sf-dcm-scope .cec-def-explain { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem 1.6rem; margin: 0 0 .5rem; }
.sf-dcm-scope .cec-def-explain.is-two { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
@media (max-width: 900px) {
.sf-dcm-scope .cec-def-explain, .sf-dcm-scope .cec-def-explain.is-two { grid-template-columns: minmax(0, 1fr); } }
.sf-dcm-scope .cec-def-chunk.is-people { border-left: 6px solid var(--def-green); padding-left: .9rem; }
.sf-dcm-scope .cec-def-chunk.is-people h4 { color: #2e8c40; }
.sf-dcm-scope .cec-define h4 { margin: .5rem 0 .1rem; font-size: 1.08rem; font-weight: 600; text-transform: uppercase; color: var(--dcm-ink); }
.sf-dcm-scope .cec-define p { margin: .1rem 0; font-size: 1.04rem; line-height: 1.22; }
.sf-dcm-scope .cec-define p.q, .sf-dcm-scope .cec-define .q { color: var(--dcm-blue); }
.sf-dcm-scope .cec-define .ref { color: var(--dcm-blue); font-size: .9rem; white-space: nowrap; }
.sf-dcm-scope .cec-def-route { display: flex; align-items: baseline; gap: .55rem; margin: .35rem 0 0; font-size: 1rem; line-height: 1.2; }
.sf-dcm-scope .cec-define .rt { display: inline-block; flex: 0 0 auto; min-width: 7.6em; text-align: center; font-weight: 600; font-size: .92rem; border: 2px solid currentColor; padding: 0 .3rem; text-transform: lowercase; }
.sf-dcm-scope .cec-define .sft-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.sf-dcm-scope .cec-def-table { width: 100%; margin: .6rem 0 0; border-collapse: collapse; font-size: 1rem; }
.sf-dcm-scope .cec-def-table th { white-space: nowrap; text-align: left; font-weight: 600; color: var(--def-purple); border-bottom: 2px solid var(--def-lav); padding: .25rem .45rem; }
.sf-dcm-scope .cec-def-table th.g { color: #2e8c40; border-bottom-color: var(--def-green); }
.sf-dcm-scope .cec-def-table td { vertical-align: top; padding: .3rem .45rem; border-bottom: 1px solid var(--dcm-rule); line-height: 1.22; }
.sf-dcm-scope .cec-def-table td.p { white-space: nowrap; color: var(--def-purple); font-weight: 600; }
.sf-dcm-scope .cec-def-table td.k { white-space: nowrap; color: var(--def-purple); font-size: .92rem; }
.sf-dcm-scope .cec-def-table td.r { white-space: nowrap; }
.sf-dcm-scope .cec-def-table .un { color: var(--dcm-muted); font-size: .9rem; }
.sf-dcm-scope [data-cec-chal] { cursor: default; }
