jsvg
jsvg copied to clipboard
CSS @-rules
<svg id="mermaid-svg" width="100%" xmlns="http://www.w3.org/2000/svg" class="flowchart" style="max-width: 675.92578125px;" viewBox="0 0 675.92578125 969.375" role="graphics-document document" aria-roledescription="flowchart-v2" xmlns:xlink="http://www.w3.org/1999/xlink"><style xmlns="http://www.w3.org/1999/xhtml">@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css");</style><style>#mermaid-svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#000000;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg .error-icon{fill:#552222;}#mermaid-svg .error-text{fill:#552222;stroke:#552222;}#mermaid-svg .edge-thickness-normal{stroke-width:1px;}#mermaid-svg .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg .marker{fill:#666;stroke:#666;}#mermaid-svg .marker.cross{stroke:#666;}#mermaid-svg svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg p{margin:0;}#mermaid-svg .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#000000;}#mermaid-svg .cluster-label text{fill:#333;}#mermaid-svg .cluster-label span{color:#333;}#mermaid-svg .cluster-label span p{background-color:transparent;}#mermaid-svg .label text,#mermaid-svg span{fill:#000000;color:#000000;}#mermaid-svg .node rect,#mermaid-svg .node circle,#mermaid-svg .node ellipse,#mermaid-svg .node polygon,#mermaid-svg .node path{fill:#eee;stroke:#999;stroke-width:1px;}#mermaid-svg .rough-node .label text,#mermaid-svg .node .label text,#mermaid-svg .image-shape .label,#mermaid-svg .icon-shape .label{text-anchor:middle;}#mermaid-svg .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg .rough-node .label,#mermaid-svg .node .label,#mermaid-svg .image-shape .label,#mermaid-svg .icon-shape .label{text-align:center;}#mermaid-svg .node.clickable{cursor:pointer;}#mermaid-svg .root .anchor path{fill:#666!important;stroke-width:0;stroke:#666;}#mermaid-svg .arrowheadPath{fill:#333333;}#mermaid-svg .edgePath .path{stroke:#666;stroke-width:2.0px;}#mermaid-svg .flowchart-link{stroke:#666;fill:none;}#mermaid-svg .edgeLabel{background-color:white;text-align:center;}#mermaid-svg .edgeLabel p{background-color:white;}#mermaid-svg .edgeLabel rect{opacity:0.5;background-color:white;fill:white;}#mermaid-svg .labelBkg{background-color:rgba(255, 255, 255, 0.5);}#mermaid-svg .cluster rect{fill:hsl(0, 0%, 98.9215686275%);stroke:#707070;stroke-width:1px;}#mermaid-svg .cluster text{fill:#333;}#mermaid-svg .cluster span{color:#333;}#mermaid-svg div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(-160, 0%, 93.3333333333%);border:1px solid #707070;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#000000;}#mermaid-svg rect.text{fill:none;stroke-width:0;}#mermaid-svg .icon-shape,#mermaid-svg .image-shape{background-color:white;text-align:center;}#mermaid-svg .icon-shape p,#mermaid-svg .image-shape p{background-color:white;padding:2px;}#mermaid-svg .icon-shape rect,#mermaid-svg .image-shape rect{opacity:0.5;background-color:white;fill:white;}#mermaid-svg .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}</style><g><marker id="mermaid-svg_flowchart-v2-pointEnd" class="marker flowchart-v2" viewBox="0 0 10 10" refX="5" refY="5" markerUnits="userSpaceOnUse" markerWidth="8" markerHeight="8" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowMarkerPath" style="stroke-width: 1; stroke-dasharray: 1, 0;"/></marker><marker id="mermaid-svg_flowchart-v2-pointStart" class="marker flowchart-v2" viewBox="0 0 10 10" refX="4.5" refY="5" markerUnits="userSpaceOnUse" markerWidth="8" markerHeight="8" orient="auto"><path d="M 0 5 L 10 10 L 10 0 z" class="arrowMarkerPath" style="stroke-width: 1; stroke-dasharray: 1, 0;"/></marker><marker id="mermaid-svg_flowchart-v2-circleEnd" class="marker flowchart-v2" viewBox="0 0 10 10" refX="11" refY="5" markerUnits="userSpaceOnUse" markerWidth="11" markerHeight="11" orient="auto"><circle cx="5" cy="5" r="5" class="arrowMarkerPath" style="stroke-width: 1; stroke-dasharray: 1, 0;"/></marker><marker id="mermaid-svg_flowchart-v2-circleStart" class="marker flowchart-v2" viewBox="0 0 10 10" refX="-1" refY="5" markerUnits="userSpaceOnUse" markerWidth="11" markerHeight="11" orient="auto"><circle cx="5" cy="5" r="5" class="arrowMarkerPath" style="stroke-width: 1; stroke-dasharray: 1, 0;"/></marker><marker id="mermaid-svg_flowchart-v2-crossEnd" class="marker cross flowchart-v2" viewBox="0 0 11 11" refX="12" refY="5.2" markerUnits="userSpaceOnUse" markerWidth="11" markerHeight="11" orient="auto"><path d="M 1,1 l 9,9 M 10,1 l -9,9" class="arrowMarkerPath" style="stroke-width: 2; stroke-dasharray: 1, 0;"/></marker><marker id="mermaid-svg_flowchart-v2-crossStart" class="marker cross flowchart-v2" viewBox="0 0 11 11" refX="-1" refY="5.2" markerUnits="userSpaceOnUse" markerWidth="11" markerHeight="11" orient="auto"><path d="M 1,1 l 9,9 M 10,1 l -9,9" class="arrowMarkerPath" style="stroke-width: 2; stroke-dasharray: 1, 0;"/></marker><g class="root"><g class="clusters"/><g class="edgePaths"><path d="M417.105,62L417.105,66.167C417.105,70.333,417.105,78.667,417.176,86.417C417.246,94.167,417.387,101.334,417.457,104.917L417.527,108.501" id="L_A_B_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M417.605,268.781L417.522,274.865C417.439,280.948,417.272,293.115,417.189,304.698C417.105,316.281,417.105,327.281,417.105,332.781L417.105,338.281" id="L_B_C_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M360.059,211.234L315.942,226.909C271.826,242.583,183.592,273.932,139.476,300.273C95.359,326.615,95.359,347.948,95.359,369.281C95.359,390.615,95.359,411.948,95.359,433.281C95.359,454.615,95.359,475.948,95.359,495.281C95.359,514.615,95.359,531.948,95.359,552.539C95.359,573.13,95.359,596.979,95.359,608.904L95.359,620.828" id="L_B_D_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M417.105,396.281L417.105,402.448C417.105,408.615,417.105,420.948,417.105,432.615C417.105,444.281,417.105,455.281,417.105,460.781L417.105,466.281" id="L_C_E_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M95.359,678.828L95.359,693.419C95.359,708.01,95.359,737.193,95.359,757.284C95.359,777.375,95.359,788.375,95.359,793.875L95.359,799.375" id="L_D_F_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M417.105,524.281L417.105,528.448C417.105,532.615,417.105,540.948,417.176,548.698C417.246,556.448,417.387,563.615,417.457,567.199L417.527,570.782" id="L_E_G_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M379.71,691.979L367.696,704.378C355.683,716.778,331.656,741.576,319.642,759.476C307.629,777.375,307.629,788.375,307.629,793.875L307.629,799.375" id="L_G_H_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M455.501,691.979L467.348,704.378C479.195,716.778,502.888,741.576,514.735,759.476C526.582,777.375,526.582,788.375,526.582,793.875L526.582,799.375" id="L_G_I_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M95.359,857.375L95.359,861.542C95.359,865.708,95.359,874.042,104.859,882.921C114.359,891.801,133.359,901.227,142.858,905.939L152.358,910.652" id="L_F_J_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M307.629,857.375L307.629,861.542C307.629,865.708,307.629,874.042,297.693,883.017C287.756,891.992,267.883,901.609,257.947,906.418L248.011,911.226" id="L_H_J_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M526.582,857.375L526.582,861.542C526.582,865.708,526.582,874.042,530.971,881.943C535.36,889.844,544.137,897.314,548.526,901.048L552.915,904.783" id="L_I_K_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/><path d="M616.34,907.375L620.762,903.208C625.183,899.042,634.025,890.708,638.446,877.875C642.867,865.042,642.867,847.708,642.867,828.375C642.867,809.042,642.867,787.708,642.867,757.951C642.867,728.193,642.867,690.01,642.867,653.828C642.867,617.646,642.867,583.464,642.867,557.706C642.867,531.948,642.867,514.615,642.867,495.281C642.867,475.948,642.867,454.615,642.867,433.281C642.867,411.948,642.867,390.615,642.867,369.281C642.867,347.948,642.867,326.615,614.543,301.542C586.218,276.47,529.569,247.658,501.244,233.252L472.919,218.846" id="L_K_B_0" class=" edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" style="" marker-end="url(#mermaid-svg_flowchart-v2-pointEnd)"/></g><g class="edgeLabels"><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(417.10546875, 305.28125)"><g class="label" transform="translate(-13.0546875, -12)"><foreignObject width="26.109375" height="24"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "><p>Yes</p></span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(95.359375, 433.28125)"><g class="label" transform="translate(-10.2265625, -12)"><foreignObject width="20.453125" height="24"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "><p>No</p></span></div></foreignObject></g></g><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(307.62890625, 766.375)"><g class="label" transform="translate(-17.1953125, -12)"><foreignObject width="34.390625" height="24"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "><p>Valid</p></span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(526.58203125, 766.375)"><g class="label" transform="translate(-23.125, -12)"><foreignObject width="46.25" height="24"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "><p>Invalid</p></span></div></foreignObject></g></g><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g><g class="edgeLabel"><g class="label" transform="translate(0, 0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" class="labelBkg" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel "></span></div></foreignObject></g></g></g><g class="nodes"><g class="node default " id="flowchart-A-0" transform="translate(417.10546875, 35)"><rect class="basic label-container" style="fill:#e1f5fe !important" x="-46.8984375" y="-27" width="93.796875" height="54"/><g class="label" style="" transform="translate(-16.8984375, -12)"><rect/><foreignObject width="33.796875" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Start</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-B-1" transform="translate(417.10546875, 190.140625)"><polygon points="78.140625,0 156.28125,-78.140625 78.140625,-156.28125 0,-78.140625" class="label-container" transform="translate(-77.640625, 78.140625)"/><g class="label" style="" transform="translate(-51.140625, -12)"><rect/><foreignObject width="102.28125" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Decision Point</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-C-3" transform="translate(417.10546875, 369.28125)"><rect class="basic label-container" style="" x="-78.0234375" y="-27" width="156.046875" height="54"/><g class="label" style="" transform="translate(-48.0234375, -12)"><rect/><foreignObject width="96.046875" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Process Data</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-D-5" transform="translate(95.359375, 651.828125)"><rect class="basic label-container" style="" x="-87.359375" y="-27" width="174.71875" height="54"/><g class="label" style="" transform="translate(-57.359375, -12)"><rect/><foreignObject width="114.71875" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Skip Processing</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-E-7" transform="translate(417.10546875, 497.28125)"><rect class="basic label-container" style="" x="-87.21875" y="-27" width="174.4375" height="54"/><g class="label" style="" transform="translate(-57.21875, -12)"><rect/><foreignObject width="114.4375" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Validate Results</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-F-9" transform="translate(95.359375, 830.375)"><rect class="basic label-container" style="" x="-66.03125" y="-27" width="132.0625" height="54"/><g class="label" style="" transform="translate(-36.03125, -12)"><rect/><foreignObject width="72.0625" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Log Event</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-G-11" transform="translate(417.10546875, 651.828125)"><polygon points="77.546875,0 155.09375,-77.546875 77.546875,-155.09375 0,-77.546875" class="label-container" transform="translate(-77.046875, 77.546875)"/><g class="label" style="" transform="translate(-50.546875, -12)"><rect/><foreignObject width="101.09375" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Results Valid?</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-H-13" transform="translate(307.62890625, 830.375)"><rect class="basic label-container" style="fill:#e8f5e8 !important" x="-93.6015625" y="-27" width="187.203125" height="54"/><g class="label" style="" transform="translate(-63.6015625, -12)"><rect/><foreignObject width="127.203125" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Save to Database</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-I-15" transform="translate(526.58203125, 830.375)"><rect class="basic label-container" style="fill:#ffebee !important" x="-75.3515625" y="-27" width="150.703125" height="54"/><g class="label" style="" transform="translate(-45.3515625, -12)"><rect/><foreignObject width="90.703125" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Handle Error</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-J-17" transform="translate(200.17578125, 934.375)"><rect class="basic label-container" style="fill:#f3e5f5 !important" x="-44.234375" y="-27" width="88.46875" height="54"/><g class="label" style="" transform="translate(-14.234375, -12)"><rect/><foreignObject width="28.46875" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>End</p></span></div></foreignObject></g></g><g class="node default " id="flowchart-K-21" transform="translate(587.69140625, 934.375)"><rect class="basic label-container" style="" x="-80.234375" y="-27" width="160.46875" height="54"/><g class="label" style="" transform="translate(-50.234375, -12)"><rect/><foreignObject width="100.46875" height="24"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel "><p>Retry Process</p></span></div></foreignObject></g></g></g></g></g></svg>
JSVG rendering:
Apologies for the vagueness of the issue title; I'm not quite sure what's going on.
Seems like the CSS isn't working (eg, fill: none on .flowchart-link isn't being applied).
Logs:
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.Lexer - Identifier starting with unexpected char '@'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=IDENTIFIER, data='edge-animation-frame'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'identifier' but got 'Token{type=CURLY_CLOSE, data='null'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.Lexer - Identifier starting with unexpected char '@'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'identifier' but got 'Token{type=CURLY_CLOSE, data='null'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-animation-slow'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-animation-fast'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='error-icon'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='error-text'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-thickness-normal'}'
2025-09-12 19:27:32,767 [ 4512] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-thickness-thick'}'
2025-09-12 19:27:32,770 [ 4515] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-pattern-solid'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-thickness-invisible'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-pattern-dashed'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edge-pattern-dotted'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='marker'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='marker'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=IDENTIFIER, data='svg'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=IDENTIFIER, data='p'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='label'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='cluster-label'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='cluster-label'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='cluster-label'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='label'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='node'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='rough-node'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='node'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='rough-node'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='node'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='root'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='arrowheadPath'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edgePath'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='flowchart-link'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edgeLabel'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edgeLabel'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='edgeLabel'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='labelBkg'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='cluster'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='cluster'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='cluster'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=IDENTIFIER, data='div'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='flowchartTitleText'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=IDENTIFIER, data='rect'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='icon-shape'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='icon-shape'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='icon-shape'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='label-icon'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=CLASS_NAME, data='node'}'
2025-09-12 19:27:32,771 [ 4516] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=COLON, data='null'}'
2025-09-12 19:27:32,772 [ 4517] WARN - com.github.weisj.jsvg.parser.css.impl.SimpleCssParser - Expected 'CURLY_OPEN' but got 'Token{type=EOF, data='null'}'
I am currently unable to view the source of your svg file. Though based on your error log the issue is that Jsvg does not support CSS media queries (or other @-rules). The CSS parser and engine is currently quite barebones.
I think a good first step would be to make the parser aware of @-rules and have it ignore them explicitly. This way at least the subsequent legal declarations can be parsed correctly.