/****************************************************************************
 ** @license
 ** This demo file is part of yFiles for HTML 3.0.0.2.
 ** Copyright (c) 2000-2025 by yWorks GmbH, Vor dem Kreuzberg 28,
 ** 72070 Tuebingen, Germany. All rights reserved.
 **
 ** yFiles demo files exhibit yFiles for HTML functionalities. Any redistribution
 ** of demo files in source code or binary form, with or without
 ** modification, is not permitted.
 **
 ** Owners of a valid software license for a yFiles for HTML version that this
 ** demo is shipped with are allowed to use the demo source code as basis
 ** for their own yFiles for HTML powered applications. Use of such programs is
 ** governed by the rights and conditions as set out in the yFiles for HTML
 ** license agreement.
 **
 ** THIS SOFTWARE IS PROVIDED ''AS IS'' AND ANY EXPRESS OR IMPLIED
 ** WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
 ** MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN
 ** NO EVENT SHALL yWorks BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
 ** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
 ** TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
 ** PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
 ** LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
 ** NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
 ** SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 **
 ***************************************************************************/#detailLevelPopup{position:absolute;bottom:10%;left:0;right:0;height:100px;margin-top:-50px;box-sizing:border-box;background-color:#ffffff80;color:#646464;padding-top:10px;text-align:center;font-size:30pt;opacity:0;transition:opacity 1s ease-in-out}#detailLevelPopup.visible{opacity:1}aside input{width:auto!important;margin-right:5px}aside label{vertical-align:text-bottom;display:inline-block}.form-border{padding:10px;margin:15px;border:1px solid lightgray}.checkbox-form label{display:inline-block!important;vertical-align:top!important;margin-top:auto;margin-bottom:5px}.control-button{overflow:visible;margin-bottom:4px;width:70px!important;height:70px!important;padding:4px}.control-button svg{fill:#fff;stroke-width:1}.button-content.button-content{background:none no-repeat 1px 50%;min-width:18px;display:inline-block;height:auto}.disabled-button{background-color:#bbb!important}.disabled-button svg{opacity:.5;stroke-width:0}.selectionBtn{width:70px!important;margin-right:6px!important;line-height:1.5em}.demo-properties fieldset{border:1px solid #888;background:#fff;margin-bottom:1ex}.demo-properties label{display:inline-block!important}.information{display:block;margin-bottom:.25em}.information label,input{margin:0}.demo-sidebar select{width:100%}#fpsMeter{width:100%;height:75px;position:absolute;top:0;left:0}#gt40{position:absolute;top:9px;left:6px;font-size:14px;color:#fff}#lt20{position:absolute;top:52px;left:6px;font-size:14px;color:#fff}legend{font-weight:700}#tooltip{position:absolute;margin:5px;width:380px;z-index:999;transition:opacity .3s ease-in-out}#tooltip p{padding:5px;margin:5px 0}.tooltip-gray{border:2px solid #6c6c6c}.tooltip-lightgray{border:2px solid #adadad}.tooltip-green{border:2px solid #6da663}.info-visible{opacity:1}.info-hidden{opacity:0;pointer-events:none}.unrecommended{position:relative}.unrecommended:after{content:"";background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20version='1.1'%20id='Ebene_4'%20xmlns='http://www.w3.org/2000/svg'%20x='0px'%20y='0px'%20width='24px'%20height='24px'%20viewBox='0%200%2024%2024'%20xml:space='preserve'%3e%3cpath%20stroke='white'%20fill='%23CC0000'%20d='M3%2022.5c-0.708%200-1.27-0.276-1.55-0.759-0.278-0.481-0.235-1.11%200.119-1.72l9-15.6c0.354-0.613%200.876-0.965%201.43-0.965s1.08%200.352%201.43%200.965l9%2015.6c0.354%200.613%200.397%201.24%200.119%201.72-0.279%200.482-0.844%200.759-1.55%200.759h-18'/%3e%3cellipse%20fill='white'%20rx='1.25'%20ry='1.25'%20cx='12.00'%20cy='18.40'/%3e%3cpath%20fill='white'%20d='M12%208.69c-0.6%200-1%200.45-1%201v5.01c0%200.5%200.4%201%201%201s1-0.5%201-1v-5.01c0-0.55-0.4-1-1-1z'/%3e%3c/svg%3e");position:absolute;background-size:20px 20px;width:20px;height:20px;top:-3px}.warning{position:relative}.warning:after{content:"";background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20version='1.1'%20id='Ebene_4'%20xmlns='http://www.w3.org/2000/svg'%20x='0px'%20y='0px'%20width='24px'%20height='24px'%20viewBox='0%200%2024%2024'%20xml:space='preserve'%3e%3cpath%20stroke='white'%20fill='%23FFA45E'%20d='M3%2022.5c-0.708%200-1.27-0.276-1.55-0.759-0.278-0.481-0.235-1.11%200.119-1.72l9-15.6c0.354-0.613%200.876-0.965%201.43-0.965s1.08%200.352%201.43%200.965l9%2015.6c0.354%200.613%200.397%201.24%200.119%201.72-0.279%200.482-0.844%200.759-1.55%200.759h-18'/%3e%3cellipse%20fill='white'%20rx='1.25'%20ry='1.25'%20cx='12.00'%20cy='18.40'/%3e%3cpath%20fill='white'%20d='M12%208.69c-0.6%200-1%200.45-1%201v5.01c0%200.5%200.4%201%201%201s1-0.5%201-1v-5.01c0-0.55-0.4-1-1-1z'/%3e%3c/svg%3e");position:absolute;background-size:20px 20px;width:20px;height:20px;top:-3px}.warning.unrecommended:after{content:"";background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'%20standalone='no'?%3e%3csvg%20xmlns='http://www.w3.org/2000/svg'%20version='1.1'%20x='0px'%20y='0px'%20width='50px'%20height='24px'%20viewBox='0%200%2050%2024'%20xml:space='preserve'%3e%3cg%3e%3cpath%20stroke='white'%20fill='%23FFA45E'%20d='M3%2022.5c-0.708%200-1.27-0.276-1.55-0.759-0.278-0.481-0.235-1.11%200.119-1.72l9-15.6c0.354-0.613%200.876-0.965%201.43-0.965s1.08%200.352%201.43%200.965l9%2015.6c0.354%200.613%200.397%201.24%200.119%201.72-0.279%200.482-0.844%200.759-1.55%200.759h-18'/%3e%3cellipse%20fill='white'%20rx='1.25'%20ry='1.25'%20cx='12.00'%20cy='18.40'/%3e%3cpath%20fill='white'%20d='M12%208.69c-0.6%200-1%200.45-1%201v5.01c0%200.5%200.4%201%201%201s1-0.5%201-1v-5.01c0-0.55-0.4-1-1-1z'/%3e%3c/g%3e%3cg%20transform='translate(26,%200)'%3e%3cpath%20stroke='white'%20fill='%23CC0000'%20d='M3%2022.5c-0.708%200-1.27-0.276-1.55-0.759-0.278-0.481-0.235-1.11%200.119-1.72l9-15.6c0.354-0.613%200.876-0.965%201.43-0.965s1.08%200.352%201.43%200.965l9%2015.6c0.354%200.613%200.397%201.24%200.119%201.72-0.279%200.482-0.844%200.759-1.55%200.759h-18'/%3e%3cellipse%20fill='white'%20rx='1.25'%20ry='1.25'%20cx='12.00'%20cy='18.40'/%3e%3cpath%20fill='white'%20d='M12%208.69c-0.6%200-1%200.45-1%201v5.01c0%200.5%200.4%201%201%201s1-0.5%201-1v-5.01c0-0.55-0.4-1-1-1z'/%3e%3c/g%3e%3c/svg%3e") no-repeat;position:absolute;background-size:42px 20px;width:42px;height:20px;top:-3px}.warningToolTip{margin-top:10px}.warningIcon{font-weight:700;font-size:24px;display:inline;width:10%;float:left;line-height:30px}#unrecommended-text{color:red}#warning-text,#webgl-warning-text{color:orange}.arrow{display:inline-block;background:#efefef;padding:15px}.arrow:after{content:"";border:10px solid transparent;border-left-color:#efefef;display:block;position:absolute;left:100%;top:50%;margin-top:-10px}.demo-textcontent{height:auto!important}#detailLevelIndicator{color:#585858;background-color:#fff9;border:2px solid #efefef;font-size:12pt;text-align:center;padding:2px}.background-highlight{background-color:#fff9;animation:highlight 2s}.styleSample{position:relative}.styleSample:after{width:16px;height:16px;background-size:cover;background-repeat:no-repeat;content:"";position:absolute;margin:4px 0 0 5px;top:-4px}.styleSample.simpleSvg:after{background-color:#ab2346}.styleSample.complexSvg:after{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20width='74px'%20height='74px'%20viewBox='0%200%2074%2074'%3e%3cg%20id='usericon_female3'%20%3e%3ccircle%20fill='%23D9D3E2'%20stroke='%23D9C6DA'%20stroke-miterlimit='10'%20cx='37.5'%20cy='37.5'%20r='37'/%3e%3crect%20x='18.37'%20y='29.42'%20fill='%23CE6D1D'%20width='37.66'%20height='25.01'/%3e%3cpath%20fill='%23EAD6BE'%20d='M47.08,52.05h-5.69v-5.67H33v5.67h-6.52c-7.32,0-13.35,5.48-14.24,12.55c6.6,6.14,15.45,9.9,25.18,9.9%20c9.16,0,17.53-3.33,23.99-8.84C61.01,58.08,54.76,52.05,47.08,52.05z'/%3e%3cpath%20fill='%23E2CCB7'%20d='M47.08,52.05h-5.69v-5.67h-3.97V74.5c0.03,0,0.06,0,0.09,0c9.12,0,17.46-3.3,23.91-8.77%20C61.05,58.12,54.78,52.05,47.08,52.05z'/%3e%3ccircle%20opacity='0.05'%20cx='37.19'%20cy='33.39'%20r='15.62'/%3e%3ccircle%20fill='%23EAD6BE'%20cx='36.78'%20cy='32.05'%20r='15.62'/%3e%3cpath%20fill='%23E2CCB7'%20d='M37.19,16.45v31.2c8.43-0.22,15.21-7.11,15.21-15.6S45.63,16.67,37.19,16.45z'/%3e%3cpath%20opacity='0.1'%20fill='%2356513A'%20d='M56.71,42.07l-0.23-15.12c-1.23-9.81-9.59-16.07-19.74-16.07c-9.9,0-18.09,6.6-19.62,16.07%20l-0.47,15.1c-3.37,0.5-5.95,3.4-5.95,6.9c0,3.86,3.13,6.99,6.99,6.99c3.35,0,6.88-2.35,7.56-5.49l0,0%20c0.07-0.42,0.16-0.86,0.16-1.3c0,0-0.04-14.81,0-19.42c1.52,0.54,2.51,0.84,4.22,0.84c6.11,0,11.55-1.66,13.71-7%20c1.16,1.45,2.66,2.75,4.69,2.75c0.11,0,0,29.5,0,29.5l8.89,0c3.23-0.62,5.67-3.45,5.67-6.86C62.58,45.48,60.03,42.6,56.71,42.07z'%20/%3e%3cpath%20fill='%23E8961F'%20d='M56.71,40.82L56.48,25.7c-1.23-9.81-9.59-16.07-19.74-16.07c-9.9,0-18.09,6.6-19.62,16.07l-0.47,15.1%20c-3.37,0.5-5.95,3.4-5.95,6.9c0,3.86,3.13,6.99,6.99,6.99c3.35,0,6.3-2.35,6.98-5.49h-0.03c0.07-0.42,0.11-0.86,0.11-1.3%20c0,0-0.01-14.81,0.03-19.42c1.52,0.54,3.14,0.84,4.85,0.84c6.11,0,11.34-2.13,13.5-7.47c1.16,1.45,3.28,3.21,5.31,3.21%20c0.11,0,0,29.5,0,29.5l8.48,0c3.23-0.62,5.67-3.45,5.67-6.86C62.58,44.23,60.03,41.35,56.71,40.82z'/%3e%3cpath%20fill='%23D38A20'%20d='M21.41,27.98V46.2h-0.03c-0.25,2.66-2.49,4.74-5.22,4.74c-2.83,0-5.13-2.24-5.23-5.04%20c-0.16,0.58-0.24,1.19-0.24,1.81c0,3.86,3.13,6.99,6.99,6.99c3.35,0,6.3-2.35,6.98-5.49h-0.03c0.07-0.42,0.11-0.86,0.11-1.3%20c0,0-0.01-14.48,0.03-19.25C23.62,28.55,22.49,28.32,21.41,27.98z'/%3e%3cg%3e%3cpath%20fill='%23CC801B'%20d='M56.71,40.85l-0.23-15.12c-1.03-8.25-7.11-13.97-15.05-15.59c0.19,0.97,0.29,1.96,0.29,2.98%20c0,8.63-6.99,15.62-15.62,15.62c-0.23,0-0.46-0.02-0.7-0.04c1.34,0.41,2.75,0.65,4.22,0.65c6.11,0,11.34-2.13,13.5-7.47%20c1.16,1.45,3.28,3.21,5.31,3.21c0.11,0,0,29.5,0,29.5l8.48,0c3.23-0.62,5.67-3.45,5.67-6.86C62.58,44.26,60.03,41.38,56.71,40.85%20z'/%3e%3c/g%3e%3cpath%20fill='%23D33D81'%20d='M47.08,52.05l-9.53,13.16L26.48,52.05c-7.29,0-13.3,5.44-14.23,12.48c6.61,6.18,15.49,9.97,25.25,9.97%20c9.12,0,17.46-3.3,23.91-8.77C61.05,58.12,54.78,52.05,47.08,52.05z'/%3e%3cpath%20fill='%23C12963'%20d='M47.08,52.05L37.5,65.21v9.29h0c9.12,0,17.46-3.31,23.91-8.77C61.05,58.12,54.78,52.05,47.08,52.05z'/%3e%3c/g%3e%3c/svg%3e")}.styleSample.simpleCanvas:after{background-color:#0b7189}.styleSample.complexCanvas:after{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20width='74px'%20height='74px'%20viewBox='0%200%2074%2074'%3e%3cg%20id='usericon_female2'%20%3e%3ccircle%20fill='%23CAEACA'%20stroke='%23C6E5C6'%20stroke-miterlimit='10'%20cx='37.5'%20cy='37.5'%20r='37'/%3e%3crect%20x='18.37'%20y='29.42'%20fill='%23A87E5A'%20width='37.66'%20height='25.01'/%3e%3cpath%20fill='%23EAD6BE'%20d='M47.08,52.05h-5.69v-5.67H33v5.67h-6.52c-7.32,0-13.35,5.48-14.24,12.55c6.6,6.14,15.45,9.9,25.18,9.9%20c9.16,0,17.53-3.33,23.99-8.84C61.01,58.08,54.76,52.05,47.08,52.05z'/%3e%3cpath%20fill='%23E2CCB7'%20d='M47.08,52.05h-5.69v-5.67h-3.97V74.5c0.03,0,0.06,0,0.09,0c9.12,0,17.46-3.3,23.91-8.77%20C61.05,58.12,54.78,52.05,47.08,52.05z'/%3e%3ccircle%20opacity='0.05'%20cx='37.19'%20cy='33.39'%20r='15.62'/%3e%3ccircle%20fill='%23EAD6BE'%20cx='36.78'%20cy='32.05'%20r='15.62'/%3e%3cpath%20fill='%23E2CCB7'%20d='M37.19,16.45v31.2c8.43-0.22,15.21-7.11,15.21-15.6S45.63,16.67,37.19,16.45z'/%3e%3cpath%20opacity='0.1'%20fill='%2356513A'%20d='M56.71,42.07l-0.23-15.12c-1.23-9.81-9.59-16.07-19.74-16.07c-9.9,0-18.09,6.6-19.62,16.07%20l-0.47,15.1c-3.37,0.5-5.95,3.4-5.95,6.9c0,3.86,3.13,6.99,6.99,6.99c3.35,0,6.88-2.35,7.56-5.49l0,0%20c0.07-0.42,0.16-0.86,0.16-1.3c0,0-0.04-14.81,0-19.42c1.52,0.54,2.51,0.84,4.22,0.84c6.11,0,11.55-1.66,13.71-7%20c1.16,1.45,2.66,2.75,4.69,2.75c0.11,0,0,29.5,0,29.5l8.89,0c3.23-0.62,5.67-3.45,5.67-6.86C62.58,45.48,60.03,42.6,56.71,42.07z'%20/%3e%3cpath%20fill='%23C49A6C'%20d='M56.71,40.82L56.48,25.7c-1.23-9.81-9.59-16.07-19.74-16.07c-9.9,0-18.09,6.6-19.62,16.07l-0.47,15.1%20c-3.37,0.5-5.95,3.4-5.95,6.9c0,3.86,3.13,6.99,6.99,6.99c3.35,0,6.3-2.35,6.98-5.49h-0.03c0.07-0.42,0.11-0.86,0.11-1.3%20c0,0-0.01-14.81,0.03-19.42c1.52,0.54,3.14,0.84,4.85,0.84c6.11,0,11.34-2.13,13.5-7.47c1.16,1.45,3.28,3.21,5.31,3.21%20c0.11,0,0,29.5,0,29.5l8.48,0c3.23-0.62,5.67-3.45,5.67-6.86C62.58,44.23,60.03,41.35,56.71,40.82z'/%3e%3cpath%20fill='%23B78D63'%20d='M21.41,27.98V46.2h-0.03c-0.25,2.66-2.49,4.74-5.22,4.74c-2.83,0-5.13-2.24-5.23-5.04%20c-0.16,0.58-0.24,1.19-0.24,1.81c0,3.86,3.13,6.99,6.99,6.99c3.35,0,6.3-2.35,6.98-5.49h-0.03c0.07-0.42,0.11-0.86,0.11-1.3%20c0,0-0.01-14.48,0.03-19.25C23.62,28.55,22.49,28.32,21.41,27.98z'/%3e%3cg%3e%3cpath%20fill='%23AD7E53'%20d='M56.71,40.85l-0.23-15.12c-1.03-8.25-7.11-13.97-15.05-15.59c0.19,0.97,0.29,1.96,0.29,2.98%20c0,8.63-6.99,15.62-15.62,15.62c-0.23,0-0.46-0.02-0.7-0.04c1.34,0.41,2.75,0.65,4.22,0.65c6.11,0,11.34-2.13,13.5-7.47%20c1.16,1.45,3.28,3.21,5.31,3.21c0.11,0,0,29.5,0,29.5l8.48,0c3.23-0.62,5.67-3.45,5.67-6.86C62.58,44.26,60.03,41.38,56.71,40.85%20z'/%3e%3c/g%3e%3cpath%20fill='%232D77AA'%20d='M47.08,52.05l-9.53,13.16L26.48,52.05c-7.29,0-13.3,5.44-14.23,12.48c6.61,6.18,15.49,9.97,25.25,9.97%20c9.12,0,17.46-3.3,23.91-8.77C61.05,58.12,54.78,52.05,47.08,52.05z'/%3e%3cpath%20fill='%231F639B'%20d='M47.08,52.05L37.5,65.21v9.29h0c9.12,0,17.46-3.31,23.91-8.77C61.05,58.12,54.78,52.05,47.08,52.05z'/%3e%3c/g%3e%3c/svg%3e")}.styleSample.simpleWebgl:after{background-color:#ff6c00}@keyframes highlight{0%{background-color:#ffd400}to{background-color:#fff9}}.demo-sidebar button{height:29px;padding:3px;border:1px solid #888;background-repeat:no-repeat;background-position:50% 50%;background-color:#ddd;color:#343f4a}.demo-sidebar button:hover{background-color:#bbb!important;cursor:pointer}#fpsContainer{position:relative;height:75px;float:right;width:180px;display:inline-block}#fpsDescription{width:160px;float:left;margin-top:5px}.animations-grid{display:grid;grid:1fr / auto-flow}.animations-button{display:grid;grid:auto-flow / 1fr;justify-items:center;user-select:none;cursor:pointer}.animations-button button{user-select:none;cursor:pointer}.section{font-size:1.6em!important}.vertical-button-list{display:grid;grid:auto-flow / auto 1fr;align-items:center}.vertical-button-list input{cursor:pointer}.selection-grid{display:grid;grid:auto-flow / 1fr 1fr 1fr 1fr;align-items:center;justify-items:stretch}.selection-grid button{user-select:none;cursor:pointer}.selection-title{text-align:center}.selection-button{margin-right:6px!important;line-height:1.5em}div.show-icon{width:10%;float:left;text-align:center}img.show-icon{display:inline-block;vertical-align:top;margin-right:5px}div.document-icon{width:90%;float:left;margin-bottom:5px}.select-button{outline:none;border:none;background-repeat:no-repeat;background-position:50% 50%;background-color:transparent;height:24px;width:24px;line-height:24px;box-sizing:border-box;padding:0 10px}.content{display:grid;margin-bottom:8px;grid-template-columns:[start] 25px [mid] auto [end] 25px;justify-items:center}.demo-main__sidebar{--sidebar-width: 380px}