:host{user-select:none;& .chart{box-sizing:border-box;width:100%;height:100%;padding:12px;position:absolute;top:0;left:0;overflow:hidden;&.yline{& .y-series:not(:first-child) .gridline-x{display:none}}& text{font-family:var(--psp-interface-monospace--font-family)}&.heatmap,&.treemap{& d3fc-group.cartesian-chart{grid-template-rows:minmax(0,max-content) auto 1fr auto minmax(0,max-content);grid-template-columns:minmax(0,max-content) auto 1fr auto minmax(0,max-content)}}& .chart-label{display:none}&.heatmap{padding-right:120px}&.xyscatter{padding:0;font-size:14px;& d3fc-group:first-child{width:calc(100% - 32px);height:calc(100% - 16px);padding:0 16px 16px}& .multi-xlabel{background:var(--psp-d3fc--legend--background);justify-content:center;align-items:center;width:100%;height:2.5em;display:flex;position:absolute;bottom:0}& .multi-ylabel{background:var(--psp-d3fc--legend--background);justify-content:center;align-items:center;width:2.5em;height:100%;display:flex;position:absolute;top:0}& .outer-container{height:100%}& .inner-container{width:calc(100% - 16px);height:100%;margin:0;padding:0;display:inline-grid;overflow-y:auto;& div{overflow:hidden}& text.segment,& text.parent{text-anchor:middle;user-select:none;pointer-events:none;fill:var(--psp-d3fc--treemap--labels,#333)}& div.xy-scatter-container{margin:5px 0}}}&.sunburst{padding:0;font-size:14px;& .outer-container{height:100%}& .inner-container{width:100%;height:100%;margin:0;padding:0;display:inline-grid;overflow:hidden auto;& div{overflow:hidden}& .sunburst-container:not(:only-child) svg{transform:translateY(-27px)}& svg{width:100%;height:100%}& path{fill:var(--psp-d3fc--series--color,#1f77b480)}& text.segment,& text.parent{text-anchor:middle;user-select:none;pointer-events:none;fill:var(--psp-d3fc--treemap--labels,#333)}& div.title-container{margin-top:5px}}}&.has-legend{padding-right:120px}&.treemap{& .treemap-container{position:relative;&:not(:only-child){width:calc(100% - 12px);height:calc(100% - 12px)}}& .outer-container{height:100%}& .inner-container{width:100%;height:100%;margin:0;padding:0;display:inline-grid;overflow:hidden auto;& div{overflow:hidden}& svg{width:100%;height:100%}& .treerect{stroke:var(--psp-d3fc--treemap-axis--lines,var(--psp-d3fc--axis-lines--color,white));fill:var(--psp-d3fc--series--color,#1f77b480);&:hover{cursor:pointer;stroke:var(--psp-d3fc--treemap--hover-highlight,black);stroke-opacity:1}}& .rootnode{opacity:0;pointer-events:none;z-index:0}& .branchnode{opacity:0;&:hover{fill-opacity:.1;opacity:1;fill:var(--psp-d3fc--treemap--hover-highlight,black)}}& .leafnode{fill-opacity:.8;&:hover{fill-opacity:.5}}& #hidden{opacity:0;pointer-events:none;z-index:0}& .top{z-index:5;pointer-events:none;font-size:14px}& .mid{opacity:.7;z-index:4;font-size:8px}& .lower{opacity:0;z-index:4;font-size:0}& text{fill:var(--psp-d3fc--treemap--labels,#333);&.title{dominant-baseline:hanging}}& .parent-controls{z-index:4;width:auto;transition:box-shadow 1s;position:absolute;top:12px;left:30px;right:auto;&:hover{transition:box-shadow .2s;box-shadow:2px 2px 6px #000}}}}& .x-label{height:1.2em!important;line-height:1em!important}& .x-label,& .y-label{color:var(--psp-d3fc--label--color,inherit);font-size:14px}& d3fc-canvas.plot-area{display:none}&.xyscatter,&.xyline,&.ohlc,&.candlestick,&.heatmap{& d3fc-canvas.plot-area{display:block}}& .y-axis text,& .y2-axis text,& .x-axis text{fill:var(--psp-d3fc--axis-ticks--color,#505050);font-size:11px}& .y-axis path,& .y2-axis path,& .x-axis path{stroke:var(--psp-d3fc--axis-lines--color,#b4d2e1)}& .splitter-label{cursor:pointer;margin:0 10px;display:inline-block;&:after{color:var(--psp-d3fc--axis-lines--color,#b4d2e1);margin-left:5px}&:hover{&:after{color:var(--psp-d3fc--axis-ticks--color,#505050)}}&.disabled{&:after{color:#5050504d}cursor:default}}& .y-label.left-label .splitter-label:after{background-repeat:no-repeat;background-color:var(--psp--color);content:"";width:16px;height:12px;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--psp-icon--sort-desc--mask-image);mask-image:var(--psp-icon--sort-desc--mask-image);display:inline-block}& .y-label.right-label .splitter-label:after{background-repeat:no-repeat;background-color:var(--psp--color);content:"";width:16px;height:12px;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--psp-icon--sort-asc--mask-image);mask-image:var(--psp-icon--sort-asc--mask-image);display:inline-block}&.ybar .y-axis path,&.yline .y-axis path,&.xyline .y-axis path,&.ybar .y2-axis path,&.yline .y2-axis path,&.xyline .y2-axis path,&.xyline .x-axis path,&.yarea .y-axis path,&.yscatter .y-axis path,&.xyscatter .y-axis path,&.yarea .y2-axis path,&.yscatter .y2-axis path,&.xyscatter .y2-axis path,&.xyscatter .x-axis path,&.xbar .x-axis path{visibility:hidden}& .y-label{white-space:nowrap}& .nearbyTip{fill:var(--psp-d3fc--series--color,#1f77b480)}}& #dragHandles{pointer-events:none;position:absolute;top:0;left:auto;right:0;& rect{pointer-events:all}}& .label rect{fill:none}& .legend-container{width:150px;height:280px;position:absolute;top:12px;left:auto;right:12px;&.legend-color{width:90px;height:150px}&[borderbox-on-hover=true]{transition:box-shadow 1s;&:hover{background-color:var(--psp-d3fc--legend--background,#fff);transition:box-shadow .2s,background-color .2s}}& .legend{width:100%;font-size:8pt;& .cell{cursor:pointer;& path{fill:var(--psp-d3fc--series--color,#1f77b480);stroke:var(--psp-d3fc--series--color,#1f77b4)}&.hidden path{fill:#cccccc80;stroke:#ccc}&.hidden circle{fill:#ccc!important}}}& text{fill:var(--psp-d3fc--legend--color,#333)}& .label{&:hover{fill:#22a0ce}}& #legend-axis path{stroke:var(--psp-d3fc--legend--color,#333)}& .legend-controls{margin-left:12px;& #up-arrow,& #down-arrow{cursor:pointer;color:#1f77b4}& #up-arrow.disabled,& #down-arrow.disabled{cursor:default;color:#333}}}& .heatmap .legend-container.legend-color,& .treemap .legend-container.legend-color{height:200px}& .treemap .legend-container:not(.legend-color){width:100px}& .zoom-controls{text-align:center;width:100%;position:absolute;top:10px;left:0;& button{-webkit-appearance:none;background:var(--psp--background-color,#f7f7f7);border:1px solid var(--psp-inactive--color,#ccc);color:var(--psp-d3fc--label--color,inherit);opacity:.5;cursor:pointer;padding:8px;font-size:12px;&:hover{opacity:1}}}& .parent-controls{text-align:right;width:100%;position:absolute;top:30px;right:145px;& button{-webkit-appearance:none;opacity:.5;cursor:pointer;background:#f7f7f7;border:1px solid #ccc;padding:10px;&:hover{background:#e6e6e6}}}& div.tooltip{text-align:left;white-space:nowrap;background:var(--psp-d3fc--tooltip--background,#fff);color:var(--psp-d3fc--tooltip--color,black);border:1px solid var(--psp-d3fc--tooltip--border-color,#777);box-shadow:var(--psp-d3fc--tooltip--box-shadow,none);pointer-events:none;padding:.5em;font-size:12px;font-weight:300;position:absolute}& div.tooltip ul{margin:0;padding:0;list-style-type:none}}