/* JTC exploration map: content-sized choices, stable routes, contextual coaching. */
.map-heading .map-tools{gap:20px}
.shuffle-map{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:7px 12px;background:#fff;border:1px solid #bccbd6;border-radius:999px;color:#365166;font:inherit;font-size:12px;font-weight:650;cursor:pointer}
.shuffle-map svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.shuffle-map:hover{background:#edf6fc;border-color:#0875b9}.shuffle-map:focus-visible{outline:3px solid #0875b9;outline-offset:3px}
#diagram{padding:18px 20px 21px;border:2px solid #273440;border-radius:26px;box-shadow:4px 5px 0 #dbe6ee;background-color:#fff;background-image:radial-gradient(#d7e2eb .9px,transparent .9px);background-size:20px 20px}
#diagram>.coach-message{position:relative;display:flex;align-items:center;gap:14px;z-index:6;margin:0 4px 21px}
.coach-face{flex:none;position:relative;width:55px;height:55px;border:1.5px solid #41657c;border-radius:50%;background:#e2f1fc;overflow:hidden}
.coach-face img{display:block;width:100%;height:109%;object-fit:contain;object-position:bottom;transform:translateY(3px)}
.coach-bubble{position:relative;flex:1;min-width:0;padding:11px 18px 12px;border:1.5px solid #314e61;background:#def1ff;border-radius:19px 19px 19px 5px;box-shadow:0 3px 0 #c9dce9}
.coach-bubble:before{content:"";position:absolute;left:-8px;bottom:13px;width:13px;height:13px;background:#def1ff;border-left:1.5px solid #314e61;border-bottom:1.5px solid #314e61;transform:rotate(45deg)}
.coach-speaker{display:block;color:#466d88;font-size:10px;font-weight:650;line-height:1.3;margin-bottom:4px}
#diagram .map-status{display:block;min-height:0;padding:0;margin:0;background:transparent;border:0;border-radius:0;color:#182c3c;text-align:left;font-size:15px;font-weight:750;line-height:1.5}
#diagram .map-status:before{display:none}
#map-caption{display:block;color:#45647b;font-size:11px;line-height:1.5;margin-top:3px}
#diagram>.symptoms-column,#diagram>.parts-column,#diagram>.directions-column,#diagram>.goal-column{grid-template-columns:48px minmax(0,1fr);gap:12px}
#diagram .column-title{width:48px;font-size:11px;line-height:1.4;color:#5c7182;background:transparent;align-self:center;gap:4px}
#diagram .column-title span{background:#edf5fc;color:#406681;width:23px;height:23px;font-size:11px;border:1px solid #c8dce9}
#symptoms-list{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 9px;padding:2px 5px 5px;max-width:760px;margin-inline:auto}
#diagram .symptom{width:auto;flex:0 0 auto;min-height:34px;max-width:100%;padding:6px 13px;line-height:1.4;white-space:nowrap;border:1.5px solid #afc1ce;border-radius:999px;background:#fff;font-size:13px;font-weight:650;color:#3b5262}
#diagram .symptom:nth-child(5n+2){padding-inline:19px}
#diagram .symptom:nth-child(7n){border-radius:14px 22px 22px 22px}
#diagram .parts-column,#diagram .directions-column{margin-top:17px;padding-top:15px;border-top:1px dashed #c2d2de}
#parts-list{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 11px;max-width:740px;margin-inline:auto;padding:2px 5px 3px}
#parts-list .part-wrap{display:contents}
#diagram .part-node,#diagram .part-node[data-direction]{display:flex;flex:0 0 auto;width:auto;gap:7px;min-height:37px;padding:6px 13px;border:1.5px solid #6f8ba1;border-radius:999px;background:#eaf5ff;box-shadow:0 2px 0 #d1e1ec}
#diagram .part-node[data-direction=direction-personal]{background:#f0f1f3;border-color:#929ca5}
#diagram .part-node[data-direction=direction-team]{background:#e7f1f6;border-color:#8ca8b8}
#diagram .part-node strong{font-size:14px;line-height:1.4;white-space:nowrap}
#diagram .part-node .node-kicker{display:grid;place-items:center;flex:none;width:20px;height:20px;border:1px solid currentColor;border-radius:50%;font-size:10px;font-weight:700;color:inherit;opacity:.7}
#directions-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;padding-top:1px}
#directions-list .direction-wrap{display:contents}
#diagram .direction-node{width:auto;min-height:36px;flex:0 0 auto;border:1.5px solid #7998ae;border-radius:999px;padding:7px 22px;background:#eaf5ff}
#diagram .direction-node[data-direction=direction-personal]{background:#f1f2f4;border-color:#939da7}
#diagram .direction-node[data-direction=direction-team]{background:#e8f1f6;border-color:#8da8ba}
#diagram .direction-node strong{font-size:13px;line-height:1.4}
#diagram .goal-column{margin-top:17px;align-items:center}
#diagram .goal-node,#diagram.has-selection .node.goal-node.related{background:#202a34;color:#fff;border:1.5px solid #202a34;border-radius:15px;min-height:39px;padding:9px 10px;font-size:12px;box-shadow:0 3px 0 #cad8e3}
#diagram.has-selection .node.selected{background:#17232e;border-color:#17232e;color:#fff;box-shadow:0 0 0 2px #fff,0 0 0 4px #57acd9}
#diagram.has-selection .node.primary-related{background:#0875b9;border-color:#07649e;color:#fff;box-shadow:0 2px 0 #b4d6ea}
#diagram.has-selection .node.related:not(.primary-related):not(.goal-node){background:#dcefff;border:1.5px solid #4c8fb9;color:#173b54;box-shadow:0 2px 0 #bcd7e8}
#diagram.has-selection .node.unrelated{opacity:.28;background:#fff;border-color:#9baebc;color:#536a7a;box-shadow:none}
#diagram.has-selection .node.unrelated:hover,#diagram.has-selection .node.unrelated:focus-visible{opacity:1}
#diagram .connection{stroke:#253b4b;stroke-width:2.5}#diagram .connection.cross{stroke:#6b8da3;stroke-width:1.8;stroke-dasharray:5 4}
.map-footer{position:relative;display:flex;align-items:center;gap:14px;margin-top:15px;max-width:calc(100% - 342px)}
.map-help-trigger{display:inline-flex;align-items:center;gap:9px;border:0;border-radius:999px;background:#0875b9;color:#fff;padding:9px 15px;min-height:42px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;box-shadow:0 3px 0 #c8deec;flex:none}
.map-help-trigger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.map-help-trigger:hover{background:#075f96}.map-help-trigger:focus-visible,.map-back:focus-visible{outline:3px solid #0875b9;outline-offset:4px}
.map-footer .map-note{margin:0;font-size:11px;line-height:1.6;color:#637c8e}
.map-back{display:grid;place-items:center;width:39px;height:39px;flex:none;border:1.5px solid #819daf;border-radius:50%;color:#27495e;background:#fff;margin-left:auto}
.map-back svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.map-help-dialog{width:min(430px,calc(100vw - 32px));padding:30px;border:2px solid #253b4b;border-radius:24px;box-shadow:7px 8px 0 #192c3d26}
.help-coach{display:flex;align-items:center;gap:12px;color:#45718d;font-size:12px;font-weight:700;margin-bottom:20px}
.help-coach img{width:53px;height:53px;object-fit:contain;border-radius:50%;background:#deeffb;border:1px solid #b9d5e8}
.map-help-dialog h2{font-size:24px;line-height:1.5;letter-spacing:-.03em;margin:0 0 17px;color:#192e3d;padding-right:12px}
#map-help-content p,#map-help-content li{font-size:15px;line-height:1.8;color:#41596b}
#map-help-content ol{padding-left:22px;margin:15px 0 20px}
#map-help-content li{padding-left:3px;margin-bottom:8px}
#map-help-content .help-route{font-size:13px;background:#eef6fc;padding:13px 15px;border-radius:10px;margin-top:16px}
.map-help-dialog .button{width:100%;margin-top:10px;min-height:45px;font-size:14px}
.map-help-dialog .help-note{font-size:11px;color:#6e8190;margin:12px 0 0;text-align:center}
@media(min-width:1400px){#symptoms-list{max-width:840px}#diagram .symptom{padding-inline:15px}.map-footer{max-width:calc(100% - 352px)}}
@media(max-width:1100px) and (min-width:1001px){#diagram{padding-inline:13px}#symptoms-list{gap:8px 6px}#diagram .symptom{padding-inline:9px}#diagram .symptom:nth-child(5n+2){padding-inline:12px}#parts-list{gap:8px}.map-footer{max-width:calc(100% - 312px)}}
@media(max-width:1000px){.map-footer{max-width:none}.map-heading .map-tools{gap:14px}}
@media(max-width:650px){
 .diagnose-section{padding-top:15px}.map-heading{margin-bottom:13px}.map-heading h2{font-size:24px}.map-heading p{font-size:12px}
 .map-heading .map-tools{display:flex;justify-content:space-between;gap:10px;margin-top:10px}.map-heading .legend{font-size:10px}.shuffle-map{min-height:34px;font-size:11px;padding:6px 10px;gap:6px}.shuffle-map svg{width:15px;height:15px}
 #diagram{padding:12px 10px 15px;border-radius:23px;border-width:1.5px;box-shadow:3px 4px 0 #dbe6ee;background-size:17px 17px}
 #diagram>.coach-message{gap:10px;margin:0 2px 15px}.coach-face{width:38px;height:38px}.coach-bubble{padding:9px 11px 10px;border-radius:15px 15px 15px 4px}.coach-speaker{font-size:9px;margin-bottom:3px}
 #diagram .map-status{font-size:12px;line-height:1.5}#map-caption{font-size:10px;line-height:1.5;margin-top:2px}
 #diagram>.symptoms-column,#diagram>.parts-column,#diagram>.directions-column,#diagram>.goal-column{display:block}
 #diagram .column-title{width:auto;margin:0 0 7px;font-size:10px;line-height:1.4;display:flex;gap:5px;align-items:center;justify-content:flex-start}#diagram .column-title span{display:inline-grid;width:17px;height:17px;font-size:9px;border:0}
 #symptoms-list{gap:7px 6px;padding:1px 0 3px;max-width:none}
 #diagram .symptom,#diagram .symptom.label-long{min-height:31px;font-size:12px;line-height:1.35;padding:5px 9px;border-width:1.3px;letter-spacing:0}
 #diagram .symptom:nth-child(5n+2){padding-inline:11px}
 #parts-list{gap:8px 7px;padding:1px 0 3px;max-width:none}
 #diagram .part-node,#diagram .part-node[data-direction]{padding:5px 9px;min-height:33px;gap:5px;border-width:1.3px}
 #diagram .part-node strong{font-size:12px}#diagram .part-node .node-kicker{width:16px;height:16px;font-size:8px}
 #diagram .parts-column,#diagram .directions-column{margin-top:11px;padding-top:10px}
 #directions-list{gap:8px}
 #diagram .direction-node{min-height:34px;padding:6px 12px;border-width:1.3px}
 #diagram .direction-node strong{font-size:12px}
 #diagram .goal-column{margin-top:13px}#diagram .goal-column .column-title{display:none}
 #diagram .goal-node,#diagram.has-selection .node.goal-node.related{min-height:36px;font-size:11px;padding:8px 5px;border-radius:13px}
 .map-footer{margin-top:13px;gap:10px}.map-help-trigger{font-size:11px;min-height:40px;padding:8px 12px;gap:6px}.map-help-trigger svg{width:20px;height:20px}.map-footer .map-note{font-size:10px;max-width:105px}.map-back{width:35px;height:35px}
 .map-help-dialog{padding:25px 22px}.map-help-dialog h2{font-size:23px}
}
@media(max-width:370px){#diagram .symptom,#diagram .symptom.label-long{font-size:12px;padding-inline:10px}#diagram .symptom:nth-child(5n+2){padding-inline:13px}#diagram .part-node,#diagram .part-node[data-direction]{padding-inline:11px}#diagram .direction-node{padding-inline:8px}.map-footer .map-note{display:none}}
@media(prefers-reduced-motion:reduce){#diagram .node{transition:none}}

/* Compact the framing, while keeping node text at its readable size. */
@media(min-width:1001px){
 .diagnose-section{padding-top:10px}.map-heading{margin-bottom:10px}
 #diagram{padding-block:12px 14px}
 #diagram>.coach-message{margin-bottom:14px}
 .coach-bubble{padding-block:8px}.coach-speaker{margin-bottom:2px}
 #diagram .map-status{font-size:14px;line-height:1.4}
 #map-caption{margin-top:1px}
 #parts-list{max-width:580px;gap:8px 11px}
 #diagram .parts-column,#diagram .directions-column{margin-top:11px;padding-top:10px}
 #diagram .goal-column{margin-top:11px}
 #diagram .column-title{flex-direction:column;align-items:flex-start}
}

.map-canvas-stack{min-width:0}.map-canvas-stack .map-footer{max-width:none}
@media(max-width:650px){
 .map-heading-copy>p{display:none}
 .coach-speaker{display:none}
 #diagram .part-node,#diagram .part-node[data-direction]{padding-inline:4px;gap:3px}
 #diagram .part-node .node-kicker{width:14px;height:14px;font-size:8px}
}

.map-canvas-stack .map-footer{margin-top:-17px;padding-inline:8px;z-index:8;pointer-events:none}
.map-help-trigger{width:44px;height:44px;min-height:44px;padding:10px;justify-content:center;border:2px solid #fff;border-radius:50%;pointer-events:auto;box-shadow:0 3px 0 #c8deec}
.map-help-trigger>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.map-footer .map-note{visibility:hidden}
.map-back{width:40px;height:40px;border:2px solid #fff;background:#deeffa;pointer-events:auto;box-shadow:0 2px 0 #c3d9e7}
@media(max-width:650px){
 .diagnose-section{padding-top:10px}
 #diagram .symptom,#diagram .symptom.label-long,#diagram .symptom:nth-child(5n+2){padding-inline:7px;border-width:1.5px}
 #diagram .part-node,#diagram .part-node[data-direction],#diagram .direction-node{border-width:1.5px}
 #diagram>.coach-message{margin-bottom:11px}
 #diagram .parts-column,#diagram .directions-column{margin-top:9px;padding-top:8px}
}
