/* TJSP 25PROCIV01 · mapa em camadas (V6)
   Mapa/Fluxo/Relações são visões do mesmo corpus, sem menus duplicados ou rolagem de página. */
:root{--ink:#1c3a53;--mid:#52728b;--edge:#d6e2ed;--panel:#fff;--back:#f5f8fb;font:13px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--back)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,[tabindex="0"]:focus-visible{outline:3px solid #d9a66a;outline-offset:2px}
.mapApp{height:100vh;height:100dvh;display:flex;flex-direction:column;min-height:0;overflow:hidden;background:#f6f9fc}
.mapHeader{height:58px;flex:0 0 58px;display:flex;align-items:center;gap:16px;padding:0 18px;border-bottom:1px solid #dbe6ed;background:#fff;box-shadow:0 1px 5px #19344d06;z-index:10;position:relative}
.backCourse{display:inline-flex;align-items:center;gap:6px;border:1px solid #d5e3ed;border-radius:9px;padding:8px 12px;color:#345c7b;font-weight:800;white-space:nowrap;background:#fff}
.backCourse:hover{background:#f1f6fa}
.crumbs{display:flex;align-items:center;gap:5px;flex:1;min-width:0;overflow:hidden;white-space:nowrap;color:#74889b}
.crumbs strong{color:#2c526f;font-size:12px;letter-spacing:.15px}
.crumbs button{border:0;background:transparent;color:#427192;padding:6px 5px;border-radius:6px;font-size:11px;white-space:nowrap;max-width:205px;overflow:hidden;text-overflow:ellipsis}
.crumbs button:hover{background:#edf4fa}
.crumbs .chev{font-size:12px;color:#a4b5c5}
.viewSwitch{display:flex;align-items:center;gap:3px;padding:4px;background:#eaf0f5;border:1px solid #dfe7ed;border-radius:10px;flex:0 0 auto}
.viewSwitch button{font-size:12px;font-weight:750;color:#607b8e;padding:9px 14px;border:0;border-radius:7px;background:transparent;white-space:nowrap}
.viewSwitch button:hover{background:#f7fbfe}
.viewSwitch button[aria-selected=true]{background:#fff;color:#1e557b;box-shadow:0 2px 7px #28486117}
.viewport{flex:1;min-width:0;min-height:0;overflow:hidden;position:relative;touch-action:none;background:radial-gradient(circle at 52% 42%,#fff 1%,#f5f9fc 70%,#eef4f9)}
.viewport::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#739cbd28 .9px,transparent 1px);background-size:24px 24px}
.mindSvg{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab;user-select:none}
.mindSvg.isPanning,.mindSvg.isMoving{cursor:grabbing}
.mindSvg .way{fill:none;stroke:#bdd4e5;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;pointer-events:stroke}
.mindSvg .way.order{stroke:#76aac4;stroke-width:4.3;stroke-opacity:.9}
.mindSvg .way.association{stroke:#d7ad78;stroke-width:2.8;stroke-opacity:.78;stroke-dasharray:8 7;cursor:pointer}
.mindSvg .way.association:hover{stroke:#a77739;stroke-width:4.6;stroke-dasharray:none}
.mindSvg .way.current{stroke:#db914e;stroke-width:4}
.mindSvg .arrowTip{fill:#80acc5}
.mindSvg .routeCount{font-size:12px;fill:#825f40;font-weight:850;pointer-events:none;text-anchor:middle}
.mindSvg .node{cursor:grab;outline:none}
.mindSvg .node:active{cursor:grabbing}
.mindSvg .node .face{fill:#fff;stroke:#c7d9e7;stroke-width:2;filter:drop-shadow(0px 5px 13px #18375113)}
.mindSvg .node:focus .face,.mindSvg .node:hover .face{stroke:#608ea9;stroke-width:3;fill:#fbfdff}
.mindSvg .node .stripe{fill:var(--tone,#7c9bb3)}
.mindSvg .node .code{font-size:12px;fill:#39769b;font-weight:900;pointer-events:none}
.mindSvg .node .head{font-size:17px;fill:#1e4059;font-weight:800;pointer-events:none}
.mindSvg .node .hint{font-size:11px;fill:#758da0;pointer-events:none}
.mindSvg .node.root .face{fill:#1a425f;stroke:#9bc0d8;stroke-width:2}
.mindSvg .node.root .head{fill:#fff;font-size:21px;text-anchor:middle}
.mindSvg .node.root .hint{fill:#c3dce9;text-anchor:middle}
.mindSvg .node.focus .face{fill:#fff4e3;stroke:#d4a25e;stroke-width:3.5}
.mindSvg .node.portal .face{fill:#eff5f9;stroke:#a7c9dd;stroke-dasharray:5 4}
.mindSvg .node.portal .head{fill:#436982;font-size:14px}
.mindSvg .node .detailTag{fill:#e8f4f9;stroke:#b7d6e9;stroke-width:1}
.mindSvg .node .detailNumber{font-size:11px;fill:#235f84;font-weight:850}
.mindSvg .node .dragMarker{fill:#adc5d5}
.canvasLoading{position:absolute;inset:16px;display:grid;place-items:center;z-index:3;font-size:12px;color:#7190a6;pointer-events:none}
html[data-map-ready=true] .canvasLoading{display:none}
.fallback{position:absolute;inset:25px;z-index:6;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:17px}
.fallback p{font-size:13px;color:#648097;text-align:center}
.fallbackGrid{max-width:900px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;width:100%}
.fallbackGrid a{border:1px solid #d2e2ee;background:white;border-left:4px solid #5d9ac0;border-radius:9px;padding:12px 15px;font-size:12px;font-weight:750}
.fallbackGrid a:hover{background:#edf7fc}
html[data-map-ready=true] .fallback{display:none}
html:not([data-map-ready=true]) #mindSvg,html:not([data-map-ready=true]) .mapControls,html:not([data-map-ready=true]) .mapGuide{visibility:hidden}
html[data-map-ready=failed] .canvasLoading{display:block;inset:auto 12px calc(100% - 74px);padding:10px;background:#fff2e8;color:#985123;border:1px solid #efd4ae;border-radius:9px;pointer-events:none}
.mapControls{position:absolute;right:17px;bottom:66px;z-index:4;display:flex;flex-direction:column;border:1px solid #cfdfea;border-radius:12px;overflow:hidden;box-shadow:0 7px 22px #193c5a1a;background:#fff}
.mapControls button{width:41px;height:42px;background:#fff;color:#315f7f;border:0;border-bottom:1px solid #e1eaf2;font-size:23px;display:grid;place-items:center;line-height:1}
.mapControls button:last-child{border-bottom:0;font-size:21px}
.mapControls button:hover{background:#edf6fb}
.mapGuide{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);z-index:3;color:#607d91;background:#ffffffdd;border:1px solid #dde9f1;border-radius:99px;padding:8px 14px;font-size:11px;text-align:center;max-width:80%;white-space:nowrap;pointer-events:none;overflow:hidden;text-overflow:ellipsis}
.mapFooter{height:36px;flex:0 0 36px;display:flex;justify-content:space-between;align-items:center;gap:10px;background:#fff;border-top:1px solid #e0e9f0;padding:0 20px;font-size:11px;color:#617e92}
.footerActions{display:flex;align-items:center;gap:14px}
.footerActions button{background:none;border:0;padding:7px 0;color:#4d7c9b;font-size:11px}
.footerActions button:hover{text-decoration:underline}
#zoomLabel{font-size:10px;min-width:32px;text-align:right}
.routeToast{position:absolute;left:50%;bottom:55px;transform:translateX(-50%);z-index:5;max-width:min(90%,640px);padding:11px 16px;background:#193f59;color:#f1f7fa;border-radius:11px;box-shadow:0 8px 26px #1b3e5b3a;font-size:12px;text-align:center}
.routeToast[hidden]{display:none}
.veil{position:fixed;inset:0;background:#0e2c4375;z-index:20}
.veil[hidden]{display:none}
.studyPanel{position:fixed;top:0;right:0;bottom:0;z-index:21;width:min(490px,100%);background:#fff;box-shadow:-14px 0 46px #0d243f42;transform:translateX(103%);visibility:hidden;display:flex;flex-direction:column;transition:transform .18s ease,visibility .18s}
.studyPanel.open{transform:translateX(0);visibility:visible}
.panelTop{flex:0 0 59px;height:59px;border-bottom:1px solid #e1e8f0;display:flex;align-items:center;justify-content:space-between;padding:0 21px;background:#f8fbfd;color:#56758b;font-size:11px;font-weight:850}
.panelTop button{background:#edf4f9;border:0;color:#2c5e82;border-radius:8px;font-size:24px;line-height:1;width:35px;height:35px}
.panelContents{padding:19px 22px 35px;overflow:auto;flex:1;min-height:0;overscroll-behavior:contain}
.panelContents .kicker{font-size:10px;font-weight:900;letter-spacing:1px;color:#a37742;text-transform:uppercase}
.panelContents h2{font-size:22px;line-height:1.28;letter-spacing:-.5px;margin:8px 0 12px;color:#213d53}
.panelContents .explain{font-size:13px;color:#3a596f;line-height:1.8;white-space:pre-line}
.panelContents .sectionTitle{font-weight:900;font-size:10px;letter-spacing:.9px;color:#7992a4;text-transform:uppercase;margin:21px 0 10px}
.panelContents .topicLinks{display:flex;gap:6px;flex-wrap:wrap}
.panelContents .topicLinks a{padding:10px 12px;background:#f0f7fb;border:1px solid #c9dce8;color:#295d81;font-size:11px;border-radius:8px;font-weight:750}
.panelContents .topicLinks a:first-child{background:#21587c;border-color:#21587c;color:#fff}
.panelContents .topicLinks a:hover{opacity:.8}
.panelContents .related{display:block;width:100%;background:#fff;border:1px solid #dae6ef;border-radius:9px;padding:10px 12px;margin:5px 0;text-align:left;color:#2d5775;font-size:12px}
.panelContents .related small{display:block;color:#718da1;font-size:10px;margin-top:4px}
.panelContents .related:hover{background:#eef7fc}
.panelContents details{border:1px solid #d3e5ef;border-radius:9px;margin-top:13px;overflow:hidden}
.panelContents summary{cursor:pointer;padding:12px;color:#285d7b;font-weight:750;font-size:11px;background:#f5fafc}
.panelContents .fullText{white-space:pre-wrap;padding:13px;line-height:1.8;color:#3b586c;font-size:12px}
.panelContents .note{border-top:1px solid #e4edf3;padding-top:12px;font-size:10px;color:#8598a7;margin-top:18px}
@media(max-width:820px){
 .mapHeader{padding:0 9px;gap:6px;height:52px;flex-basis:52px}
 .backCourse{padding:7px 8px;font-size:11px}
 .crumbs strong{font-size:11px}
 .crumbs button{font-size:10px;max-width:100px}
 .viewSwitch{padding:2px;gap:1px}
 .viewSwitch button{padding:9px 7px;font-size:11px}
 .mapControls{right:9px;bottom:42px}
 .mapGuide{font-size:10px;bottom:9px;max-width:calc(100% - 115px);left:9px;transform:none;text-align:left;padding:6px 8px;white-space:normal}
 .mapFooter{height:32px;flex-basis:32px;padding:0 10px;font-size:10px}
}
@media(max-width:560px){
 .mapHeader{height:50px;flex-basis:50px;gap:4px}
 .backCourse span{display:none}
 .backCourse{padding:7px 8px}
 .crumbs strong{font-size:10px}
 .crumbs .chev{display:none}
 .crumbs button{max-width:66px;font-size:9px}
 .viewSwitch button{padding:9px 6px;font-size:10px}
 .fallback{inset:7px;gap:8px}
 .fallback p{font-size:10px}
 .fallbackGrid{display:flex;flex-direction:column;gap:5px}
 .fallbackGrid a{padding:8px 10px;font-size:11px}
 .studyPanel{width:100%}
 .panelContents{padding:14px 15px 30px}
 .panelContents h2{font-size:20px}
 .mapGuide{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.studyPanel{transition:none!important}}

.routeToast strong{display:block;font-size:12px;margin-bottom:5px}
.routeToast .toastItems{display:flex;flex-direction:column;gap:6px;max-height:200px;overflow:auto}
.routeToast .routePair{display:flex;align-items:center;gap:6px;flex-wrap:wrap;border-top:1px solid #5d859a55;padding-top:7px}
.routeToast .routePair span{font-size:10px;color:#d8e7ef;width:100%}
.routeToast .toastPick{border:1px solid #77a1b9;background:#265777;color:#fff;padding:6px 8px;border-radius:7px;font-size:10px;cursor:pointer}
.routeToast .toastPick:hover{background:#366e90}
@media(max-width:560px){.routeToast{bottom:38px;max-width:96%;min-width:84%;font-size:10px}.routeToast .toastPick{font-size:9px}}
