/* styles for dashboard output */ 


/* Header style */
body {
  padding-top: 44px;
}

/* #39446: dashboard font family. A dashboard with a non-Classic font defines --exp-content-font on :root (its custom
   CSS); the dashboard title, page tabs, panel titles, filter / parameter labels and everything else without a stack of
   its own inherit it from here. The fallback is Bootstrap's own body stack, so a dashboard that never defines the
   variable computes exactly what it did before. Edit-mode chrome declares its own stack (dashboard-preview-edit.css). */
body {
  font-family: var(--exp-content-font, "Helvetica Neue", Helvetica, Arial, sans-serif);
}

.navbar-inverse {
  background-color: #ffffff;
  border-bottom: 1px solid #d7d7d7;
  min-height: 35px;
  height: 35px;
}
.navbar-collapse.collapse {
  min-height: 35px;
  height: 35px;
}

.navbar-inverse .container-fluid {
  padding-left: 8px;
  padding-right: 8px;
}

.navbar-inverse ul.navbar-nav.navbar-right {
  display:none;
}

.navbar-inverse ul.navbar-nav {
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  float: none!important;
  height:35px;
}

.navbar-inverse ul.navbar-nav::-webkit-scrollbar {
  -webkit-appearance: none;
  height: 5px;
}

.navbar-inverse ul.navbar-nav::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 1px rgb(255 255 255 / 30%);
}

.navbar-inverse ul.navbar-nav > li {
  float: none;
  display: inline-block;
}

.navbar-inverse ul.navbar-nav > li > a {
  padding-top: 7px;
  padding-bottom: 7px;
  display: inline-block;
  /* max-width will be dynamically calculated by js if needed. */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* #35798: top-strip tab minimum width. The side-column media block below
     clears this so vertical tabs are not forced to the top-strip floor. */
  min-width: var(--exp-page-tab-min-width, 84px);
}
.navbar-inverse ul.navbar-nav > li > a:hover {
  background-color: #eeeeee;
  text-decoration: none;
  color: #777777;
}

/* Bootstrap sets "outline: 5px auto -webkit-focus-ring-color" on a:focus. That is an
   author-level rule, not the browser default, so it is not limited to :focus-visible and
   also fires when a page tab is clicked with the mouse -- leaving a blue ring around the
   tab the user just switched to (#38482). Drop it for pointer interaction only. Keyboard
   users keep the ring through :focus-visible, which is their only cue for where the
   focus currently is. */
.navbar-inverse ul.navbar-nav > li > a:focus:not(:focus-visible) {
  outline: none;
}

.navbar-inverse ul.navbar-nav > .active {
  border-top: 2px solid #00ab6d;
}

.navbar-inverse ul.navbar-nav > .active > a,
.navbar-inverse ul.navbar-nav > .active > a:hover,
.navbar-inverse ul.navbar-nav > .active > a:focus {
  background-color: transparent;
  font-weight: bold;
  padding-top: 5px;
}
.navbar-inverse .navbar-brand {
  padding-top: 7px;
  color: rgba(77, 77, 77, 1); 
  font-weight:500;
  font-family: var(--exp-content-font, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, Helvetica, lato, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif);
}

/* mobile view adjustment */
.navbar-inverse .navbar-toggle {
  padding: 2px;
  border: 0;
}

.navbar-inverse .navbar-toggle:focus ,
.navbar-inverse .navbar-toggle:hover ,
.navbar-inverse .navbar-toggle:hover:focus {
  background-color: transparent;
}

.navbar-inverse ul.navbar-nav > li {
  float: none;
  display: inline-block;
}

@media (max-width: 768px) {
  .navbar-inverse  ,
  .navbar-inverse ul.navbar-nav,
  .navbar-collapse.collapse  {
    height: unset;
  }
  .navbar-inverse ul.navbar-nav > li {
    /* float: left; */
    display: block;
  }
  .navbar-inverse ul.navbar-nav > li > a {
    width: 100%;
  }
  .comment-balloon {
    display:none!important;
  }
  .navbar-inverse ul.navbar-nav > .active {
    border-top-color: transparent;
  }
}

@media screen and (min-width: 769px) {
  /* #38150: page tabs as a vertical column on the left (gear: Page Tab Setting). The footer
     fragment adds exp-page-tabs-side plus exp-page-tabs-left to the body (only with 2+ pages)
     before flexdashboard lays the pages out. Screen and desktop width only: mobile keeps the collapsed
     navbar above, and print hides the navbar as it does today. The title stays in the 35px bar; the
     tab list leaves it (position: fixed), so the bar keeps its height and so does body padding-top.
     Every rule starts from the body class, which out-specifies the strip rules above without
     !important. The one exception is position: the busy bar (_showBusyBarOnTabs in the footer
     fragment) sets an inline position: relative on this same list, and only !important beats an inline
     style; without it the column would fall back into the 35px bar while a page is busy.
     Width: the column's width is the CSS custom property --exp-page-tab-width (the footer fragment sets
     it on the body from #page-tab-position's data-width, and _setPageTabWidth changes it at run time; the
     Edit mode drag resizes it). The var() fallback is the 200px default, so a page that never sets it (and
     an older footer that ignores it) is unchanged. The body's left offset is the same width plus the 8px
     gap, so the content box is always 100% - width and panel code that measures its parent is untouched. */
  body.exp-page-tabs-left {
    padding-left: calc(var(--exp-page-tab-width, 200px) + 8px);
  }
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav:not(.navbar-right) {
    position: fixed !important;
    top: 35px;
    bottom: 0;
    width: var(--exp-page-tab-width, 200px);
    height: auto;
    margin: 0;
    padding: 0 0 8px; /* no top band: the first row sits right under the title bar; the bottom 8px is the scroll end's room */
    overflow-x: hidden;
    overflow-y: auto;
    white-space: normal;
    background-color: #ffffff;
  }
  body.exp-page-tabs-left .navbar-inverse ul.navbar-nav:not(.navbar-right) {
    left: 0;
    border-right: 1px solid #d7d7d7;
  }
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav::-webkit-scrollbar {
    width: 5px;
  }
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav > li {
    display: block;
  }
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav > li > a {
    display: block;
    max-width: none;
    /* #35798: the top-strip min-width must not force wide rows in the side column. */
    min-width: 0;
    padding: 8px 12px 8px 14px;
  }
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav > .active {
    border-top: 0;
    background-color: #f5f5f5;
  }
  body.exp-page-tabs-left .navbar-inverse ul.navbar-nav > .active {
    box-shadow: inset 3px 0 0 #00ab6d;
  }
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav > .active > a,
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav > .active > a:hover,
  body.exp-page-tabs-side .navbar-inverse ul.navbar-nav > .active > a:focus {
    padding-top: 8px;
  }
  /* No title: the bar collapses and the column starts at the top. body{padding-top:44px} above is static
     (nothing shrinks it for a multi-page dashboard), so it is reset here to the 8px a header-less
     dashboard uses. Bootstrap's .navbar-collapse.collapse{height:auto!important} still wins over the
     height below, which is harmless: the list is out of flow, so min-height: 0 is what empties it. */
  body.exp-page-tabs-no-title {
    padding-top: 8px;
  }
  body.exp-page-tabs-no-title .navbar-inverse,
  body.exp-page-tabs-no-title .navbar-collapse.collapse {
    min-height: 0;
    height: 0;
    border-bottom: 0;
  }
  body.exp-page-tabs-no-title .navbar-inverse ul.navbar-nav:not(.navbar-right) {
    top: 0;
  }
}

.navbar-logo img {
  height: 30px;
  margin-top: 8px;
  border-right: 1px solid #ddd;
  padding-right: 10px;
}
.navbar-inverse .navbar-brand > .navbar-author {
  display: none;
}

/* Dashboard panel title */

.chart-wrapper {
  overflow: hidden;
  position: relative;
}

.chart-wrapper.text-bold > .chart-title {
  font-weight: bold !important;
}

.chart-wrapper.text-italic > .chart-title {
  font-style: italic !important;
}

.chart-wrapper.text-bold-italic > .chart-title {
  font-weight: bold !important;
  font-style: italic !important;
}
.chart-wrapper.text-bold > .chart-stage .single-value-header,
.chart-wrapper.text-bold-italic > .chart-stage .single-value-header {
  font-weight: bold;
}
.chart-wrapper.text-italic > .chart-stage .single-value-header,
.chart-wrapper.text-bold-italic > .chart-stage .single-value-header {
  font-style: italic;
}
/* Panel title font stacks (Edit Title > Font). Latin fonts first, then the Japanese ones, so an English title renders in
   the Latin font and a Japanese one falls through. The sans-serif stack is the dashboard's own (the default option inherits
   it). The Edit Title dialog probes the installed fonts of the same lists and names the first one
   (DashboardPanelTitleUtil.TITLE_FONT_CANDIDATES): keep the two in step (a test compares them). The inline style carries
   var(--exp-title-font-...) because it cannot hold a space or a quote. */
:root {
  --exp-title-font-sans-serif: -apple-system, BlinkMacSystemFont, "SF Pro", "Helvetica Neue", Arial, Helvetica, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック", "Hiragino Sans", "Hiragino Kaku Gothic", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --exp-title-font-serif: "Times New Roman", "Hiragino Mincho ProN", "ヒラギノ明朝 ProN", "游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  --exp-title-font-monospace: Menlo, Consolas, "Courier New", "Osaka-Mono", "ＭＳ ゴシック", "MS Gothic", monospace;
}
.chart-wrapper.dashboard-title-style > .chart-title {
  color: var(--dashboard-panel-title-color, inherit);
  font-family: var(--dashboard-panel-title-family, inherit);
  font-size: var(--dashboard-panel-title-size, inherit);
}
/* A Number panel draws its title as a caption inside the viz. VizUtil sets inline color and font size there, so the
   panel-specific title settings need !important to override those generated values. Gate each property on its own
   custom property so an unset dashboard title option leaves the generated caption style alone. */
.chart-wrapper.dashboard-title-style[style*="--dashboard-panel-title-color"] .single-value-header {
  color: var(--dashboard-panel-title-color, inherit) !important;
}
.chart-wrapper.dashboard-title-style[style*="--dashboard-panel-title-family"] .single-value-header {
  font-family: var(--dashboard-panel-title-family, inherit) !important;
}
.chart-wrapper.dashboard-title-style[style*="--dashboard-panel-title-size"] .single-value-header {
  font-size: var(--dashboard-panel-title-size, inherit) !important;
}
/* Single download button styling - shows only download icon */
.download-single-btn {
  position: relative;
  width: 20px;
  height: 20px;
  margin: 1px 4px;
  margin-top: -2px;
  cursor: pointer;
  display: none;
  float: left;
}

.download-single-btn > a {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzODQgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBzdHJva2U9IiM0ZDRkNGQiIGQ9Ik0xODAuNyAzOTUuM0MxODMuOCAzOTguNCAxODcuOSA0MDAgMTkyIDQwMHM4LjE4OC0xLjU2MiAxMS4zMS00LjY4OGwxNDQtMTQ0YzYuMjUtNi4yNSA2LjI1LTE2LjM4IDAtMjIuNjJzLTE2LjM4LTYuMjUtMjIuNjIgMEwyMDggMzQ1LjRWNDhDMjA4IDM5LjE2IDIwMC44IDMyIDE5MiAzMlMxNzYgMzkuMTYgMTc2IDQ4djI5Ny40TDU5LjMxIDIyOC43Yy02LjI1LTYuMjUtMTYuMzgtNi4yNS0yMi42MiAwcy02LjI1IDE2LjM4IDAgMjIuNjJMMTgwLjcgMzk1LjN6TTM2OCA0NDhoLTM1MkM3LjE1NiA0NDggMCA0NTUuMiAwIDQ2NFM3LjE1NiA0ODAgMTYgNDgwaDM1MmM4Ljg0NCAwIDE2LTcuMTU2IDE2LTE2UzM3Ni44IDQ0OCAzNjggNDQ4eiIvPjwvc3ZnPg==);
  width: 13px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  opacity: 0.6;
  transition: opacity 0.2s;
  text-decoration: none;
  border: none;
  outline: none;
}

.download-single-btn > a:hover {
  opacity: 1;
}

.download-single-btn > a:focus {
  outline: none;
}

/* Hide any potential duplicate download elements */
.download-single-btn ~ .hidden-download-menu {
  display: none !important;
}


.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .download-single-btn {
  display: block;
}

.chart-title {
  font-weight: normal;
  border-bottom-color: #e2e2e2;
  position: relative;
  /* This overflow setting will be reset once chart-title-text is rendered in order to show the LOV dropdown properly */
  overflow: hidden; 
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chart-title .chart-title-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.chart-shim > div[data-r-code-id] {
  height: 100%;
  width: 100%;
  overflow-y: auto;
}

.chart-shim > div[data-r-code-id] img {
  max-width: 100%;
  object-fit: contain;
}

.chart-shim .filter-tokens {
  position: absolute;
  top: 0px;
  right: 0px;
  max-width: 100%;
  /*overflow-x: hidden;*/
  z-index: 1000;
}
.chart-shim .filter-token {
  height: 26px;
}

.chart-shim .filter-token.condition-token {
  display: inline-block;
  margin-left: 2px;
  border: 1px solid #0b8ee3;
  border-radius: 4px;
  padding: 3px 8px 3px 10px;
  font-size: 12px;
  background-color: #c2e7ff; /*google docs share button blue*/
}
.chart-shim .filter-token .token-text {
  display: inline-block;
  max-width: 130px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: translateY(1px);
  height: 16px;
  line-height: 16px;
}
.chart-shim .filter-token .delete-token {
  padding-left: 8px;
  display: inline-block;
  color: #0b8ee3;
  cursor: pointer;
  font-size: 14px;
  height: 16px;
  line-height: 16px;
  transform: translateY(-2px);
}
.chart-shim .filter-token.show-detail-toggle-btn {
  display: inline-block;
  margin-left: 2px;
  border: 1px solid #00ab6d;
  border-radius: 4px;
  padding: 3px 10px;
  color: transparent;
  cursor: pointer;
  /* Table (table) icon from FA5 */
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjMDBhYjdkIiBkPSJNNDY0IDMySDQ4QzIxLjQ5IDMyIDAgNTMuNDkgMCA4MHYzNTJjMCAyNi41MSAyMS40OSA0OCA0OCA0OGg0MTZjMjYuNTEgMCA0OC0yMS40OSA0OC00OFY4MGMwLTI2LjUxLTIxLjQ5LTQ4LTQ4LTQ4ek0xNjAgNDQ4SDQ4Yy04LjgzNyAwLTE2LTcuMTYzLTE2LTE2di04MGgxMjh2OTZ6bTAtMTI4SDMydi05NmgxMjh2OTZ6bTAtMTI4SDMyVjk2aDEyOHY5NnptMTYwIDI1NkgxOTJ2LTk2aDEyOHY5NnptMC0xMjhIMTkydi05NmgxMjh2OTZ6bTAtMTI4SDE5MlY5NmgxMjh2OTZ6bTE2MCAxNjB2ODBjMCA4LjgzNy03LjE2MyAxNi0xNiAxNkgzNTJ2LTk2aDEyOHptMC0zMkgzNTJ2LTk2aDEyOHY5NnptMC0xMjhIMzUyVjk2aDEyOHY5NnoiLz48L3N2Zz4=");
  background-color: rgb(255, 255, 255);
  background-repeat: no-repeat;
  background-size: 15px;
  background-position: center center;
  font-size: 14px;
  line-height: 22px;
}
/* In case of scroll layout, make sure the panel scrollable in case 
   you have a taller content such as a long text content. */
.vertical-layout-scroll .chart-stage {
  /* 40px = 32px (.chart-title area height) + 8px (bottom margin) */ 
  height: calc( 100% - 40px );
  overflow: auto;
}

/* Dashboard content */

.dashboard-container {
  color: inherit;
}

.dashboard-container a {
  background-color: transparent;
  color: #00ab6d;
  text-decoration: none;
}

.dashboard-container a:active,
.dashboard-container a:hover {
  outline-width: 0;
}


/* Exploratory specific styles */

/* error message that rmd engine shows */
.dashboard-container .viz-not-found {
  border: 1px solid #e0e0e0;
  width: 100%;
  height: 500px;
  font-size: 14px;
  font-family: var(--exp-content-font, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, Helvetica, lato, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif);
  text-align:center;
  padding-top:247px;
  padding-left:20px;
  padding-right:20px;
  color: #999;
  background-color:#f8f8f8;
  
}
/* error message that viz rendering engine shows */
.dashboard-container .viz-rendering-error {
  border: 1px solid #e0e0e0;
  color: #999;
  background-color:#f8f8f8;
}


.viz-loading {
  height: 100%!important;
}

.viz-loading > div:first-of-type > div:first-of-type ,
.viz-loading > div:first-of-type > div:first-of-type:after {
  width: 5em;
  height: 5em;
}
.viz-loading > div:first-of-type > div:first-of-type {
  margin: 10px ;
  font-size: 10px;
  color:transparent;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 2s infinite linear;
  /* fa-spinner icon from FA5. fill="#999999" */
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjOTk5OTk5IiBkPSJNMzA0IDQ4YTQ4IDQ4IDAgMSAwIC05NiAwIDQ4IDQ4IDAgMSAwIDk2IDB6bTAgNDE2YTQ4IDQ4IDAgMSAwIC05NiAwIDQ4IDQ4IDAgMSAwIDk2IDB6TTQ4IDMwNGE0OCA0OCAwIDEgMCAwLTk2IDQ4IDQ4IDAgMSAwIDAgOTZ6bTQ2NC00OGE0OCA0OCAwIDEgMCAtOTYgMCA0OCA0OCAwIDEgMCA5NiAwek0xNDIuOSA0MzdBNDggNDggMCAxIDAgNzUgMzY5LjEgNDggNDggMCAxIDAgMTQyLjkgNDM3em0wLTI5NC4yQTQ4IDQ4IDAgMSAwIDc1IDc1YTQ4IDQ4IDAgMSAwIDY3LjkgNjcuOXpNMzY5LjEgNDM3QTQ4IDQ4IDAgMSAwIDQzNyAzNjkuMSA0OCA0OCAwIDEgMCAzNjkuMSA0Mzd6Ii8+PC9zdmc+');
  background-size: 23px;
  width: 23px;
  height: 23px;
  display: inline-block;
  background-repeat: no-repeat;

}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.dashboard-container pre.missing-message {
  border: 1px solid #e0e0e0;
  color: #999;
  background-color:#f8f8f8;
  padding:20px;
  margin-top: 0;
  margin-bottom: 20px;
  overflow: hidden;
  
} 
.dashboard-container pre.missing-message code {
  font-size: 13px;
  color: #999;
  font-family: var(--exp-content-font, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, Helvetica, lato, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif);
}

.dashboard-column-orientation > .dashboard-column {
  overflow: hidden;
}

/**
 * Each row should have a static height except rows that contain 
 * only single values in scroll layout mode. 
 */
.vertical-layout-scroll .dashboard-row.charts-only, 
.vertical-layout-scroll .dashboard-row.single-values-and-charts {
  height: 480px;
  flex: 0 0 480px;
}

/**
 * Single value chart handling. 
 * Rmarkdown html transforms the DOM tree on the fly depending on the available 
 * window width such as taking off dashboard-row class so don't depend on their
 * css classes. 
 */
.single-values-only {
  min-height:120px;
  flex:1 1 0px!important;
}
/** 
 * Use this at the last single value row if the page contains only 
 * singe values in order to avoid having extra spaces between rows.
 * This class doesn't apply flex: 1 1 configuration so that it expands
 * the height of the panel to use the rest of page space. 
 */
.single-values-only-last-row {
  min-height:120px;
}
.single-value {
  /* #38545: the Number's design height is 100px everywhere (the smallest container the
     product has for one, the KPI row's render area). This rule only reaches a legacy
     "all Numbers in this row" dashboard -- see DashboardLayoutTranslator's
     backwardCompatibilityMode -- but it should agree with every other host. */
  height:100px;
  max-height:100px;
}
.single-value.responsive {
  height:unset;
  max-height:unset;
}


/**
 * Dashboard header row. It expects only Number charts for now.
 *
 * The row just fits its tiles (a 102px Number + the wrapper's 8px margin = 110px). It used to
 * be a fixed 135px, from when a Number was ~135px tall. That height was invisible on a page
 * that also has a regular chart, because the row is a flex item there and `flex-basis: 0%`
 * overrides `height`. On a page with ONLY Number rows the rows sit in a block container, the
 * 135px applied, and every row left 25px of dead space below it (#38893).
 */
.dashboard-row.dashboard-row-flex.dashboard-header-row {
  height:auto;
}

/* #38545: the value's font size and margins used to be re-declared here to squeeze a
   ~135px Number into the KPI row's 100px window, on top of a `transform: translateY(-7px)`
   on the sub-metric that hid the remaining overflow instead of removing it. pivot.css now
   IS the 100px design (VizUtil.SINGLE_VALUE_LAYOUT), so re-compensating here would apply
   the correction twice. Removed: .single-value-text-with-ratio (font-size 38px /
   margin-top -5px), its .no-sub-display variant (font-size 40px / margin-top 6px),
   .single-value-ratio's `margin:0; transform: translateY(-7px)`,
   .single-value-header's `margin-top: -3px`, and .single-value-ratio-token's
   padding-top/bottom 2px (now the shared default). */

.dashboard-row.dashboard-row-flex.dashboard-header-row .single-value-text-with-ratio.large {
  font-size: 42px;
  margin-top: -3px;
}

.dashboard-row.dashboard-row-flex.dashboard-header-row .single-value.text-bold .single-value-header,
.dashboard-column .single-value.text-bold .single-value-header {
  font-weight: bold;
}
.dashboard-row.dashboard-row-flex.dashboard-header-row .single-value.text-italic .single-value-header,
.dashboard-column .single-value.text-italic .single-value-header {
  font-style: italic;
}
.dashboard-row.dashboard-row-flex.dashboard-header-row .single-value.text-bold-italic .single-value-header,
.dashboard-column .single-value.text-bold-italic .single-value-header {
  font-weight: bold;
  font-style: italic;
}

.dashboard-row.dashboard-row-flex.dashboard-header-row .single-value-ratio.additional {
  font-size: revert !important;
  transform: translateY(-2.5px);
  margin-top: 0 !important;
  font-weight: normal;
}


/**
 * Dashboard header item for Number charts.  
 */
.single-value.dashboard-header-row-item {
  height:102px;
  max-height:102px;
  flex-direction:row;
}

.single-value.dashboard-header-row-item .single-value-text {
 margin-top: 3px;
}

.single-value > .chart-title {
  /* hack to return 0 for $(".chart-title") in adjustedHeight in flexdashboard
     to avoid adding extra height to the original data-height value to 
     make the shorter row height work properly. */
  padding:0;
  border:0;
  height:0;
  z-index:1;
}

.single-value.chart-wrapper-flex {
  position: relative;
}

.single-value.chart-wrapper-flex > .chart-title {
  color: transparent;
  position: absolute;
  top: 0;
  right: 0;
}

.single-value > .chart-stage.chart-stage-flex{
  padding:0;
  overflow: hidden;
}
.single-value > .chart-stage.chart-stage-flex > .chart-shim {
  top:0; bottom:0; left:3px; right:0;
}
/* #32879 / #38545: the Repeat By facet grid's 10px inset from the panel frame, and the
   ONLY host that gets one. The rule two below strips each tile's own
   .single-value-innerbox border here (a Dashboard panel draws its own frame) and the
   .single-value-facet-cell rule further down re-draws it as a card -- an ADDED border
   that would touch the panel's frame without this inset. Every other host keeps the
   tile's inner border, which IS the Number's border, and renders the grid flush exactly
   like the same Number without Repeat By; a shared inset in pivot.scss gave the Note
   editor / published Note / Chart View a gap the non-faceted Number does not have
   (reported 2026-09-08). Mirrors VizUtil.SINGLE_VALUE_FACET_CONTAINER_PADDING.

   padding-left is 3px short on purpose: the shim above already carries a 3px left offset
   (none on the other three sides), so a plain 10px would put the grid's left edge 13px
   from the panel frame against 10px everywhere else. 10 - 3 = 7. */
.single-value > .chart-stage.chart-stage-flex > .chart-shim .single-value-facet-container {
  padding: 10px;
  padding-left: 7px;
}
.single-value > .chart-stage.chart-stage-flex > .chart-shim .viz-container.markdown-viz-container .single-value-box {
  height:100%;
}
.single-value > .chart-stage.chart-stage-flex > .chart-shim .viz-container.markdown-viz-container .single-value-innerbox {
  border:none!important;
}
/* #32879: the rule directly above strips each Number's own inline .single-value-innerbox
   border, on a Dashboard and nowhere else, because a Dashboard panel draws the frame
   itself. A Repeat By Number used to be N such panels; one facet grid now replaces them
   all with a single panel, so without this each tile inside the grid would have no frame
   at all. Give the tile the bordered-card look here instead of in the shared pivot.scss:
   every other host (Chart View, Note editor, published Note) keeps the inner border, so a
   shared card border painted two nested frames per tile there. Same ancestor chain as the
   rule above on purpose -- the compensation must appear exactly where the suppression
   does, and nowhere else. */
.single-value > .chart-stage.chart-stage-flex > .chart-shim .viz-container.markdown-viz-container .single-value-facet-cell {
  border: 1px solid #e0e0e0;
  border-radius: 3px;
  padding: 8px;
}

/* #38893 (2026-09-22 user feedback): in the "Number" (KPI) row a faceted Number must be
   indistinguishable from N plain Numbers dropped in that same row -- same frame, same
   size, same gaps, same type. The five rules below are how that is arranged, and they
   apply ONLY to the single-row-scroll mode, i.e. only inside a KPI row.

   The rules above this one are #32879's geometry for a facet grid inside an ORDINARY
   dashboard panel: the panel draws the card, so the grid needs a 10px inset from it and
   each tile needs its own inner card. Stacked in a KPI row that costs 38px of vertical
   chrome (10+10 container inset, 8+8 tile padding, 1+1 tile border) on top of a Number
   whose whole design height is VizUtil.SINGLE_VALUE_LAYOUT's 98px -- 136px inside a
   102px row, which is why the sub-metric pill was clipped. It was never a font-size
   problem: the tile's contents were already the same k=1 rendering a plain Number panel
   gets. It was a doubled frame.

   So here the PANEL stops drawing flexdashboard's card and the TILE draws it instead:

     panel 102px (box-sizing:border-box, border now none)
       -> tile border 1px x 2
         -> 100px interior == exactly what a plain Number panel gives its Number
           -> 98px of Number (VizUtil.SINGLE_VALUE_LAYOUT.contentBudget) + 2px slack

   which is the plain panel's arithmetic term for term, so no font scaling is involved
   anywhere. SingleValueFacetKpiRowPanelStyle.test.js pins that arithmetic against
   VizUtil.SINGLE_VALUE_LAYOUT so the two cannot drift apart.

   Gated with :has() rather than a class written by the renderer so the geometry is
   correct by construction on every re-render -- there is no "on" state to clear when the
   grid goes away. dashboard-base.css already depends on :has() elsewhere. The tile gap is
   NOT here: PivotTableGenerator writes column-gap inline (it is user-adjustable), from
   VizUtil.SINGLE_VALUE_FACET_KPI_ROW_GAP in this mode. */
.single-value.dashboard-header-row-item:has(.single-value-facet-grid.single-row-scroll) {
  border: none;
  border-radius: 0;
  background: transparent;
}
/* The shim's historical 3px left offset (see the rule near the top of this block) would
   push the FIRST tile's frame 3px right of where a plain Number panel's frame sits in the
   row above. Removing the panel border gives those 3px back on the other side, so the
   tile frames land on the panel frames' own x positions. */
.single-value.dashboard-header-row-item > .chart-stage.chart-stage-flex > .chart-shim:has(.single-value-facet-grid.single-row-scroll) {
  left: 0;
}
/* #39733: the footer script pins every chart's .viz-container to a PIXEL width it reads
   once per render from .chart-shim (`$div.css({width: width + "px"})`). That render can
   land while a transient 15px page scrollbar has narrowed the flex row, and nothing
   re-measures once the scrollbar goes, so the tiles (width:100% of that stale box) stop
   ~12px short of the panel's right edge -- visible only because these tiles, unlike a
   plain Number's left-hugging card, fill their box edge to edge. A page switch re-measured
   and "fixed" it. The panel is a flex item; let its box follow it. !important because the
   width is written inline. In CSS, not in the footer, so it also reaches saved dashboards
   (their baked footer script is not re-rendered, libs CSS is refreshed on open). */
.single-value > .chart-stage.chart-stage-flex > .chart-shim > .viz-container.markdown-viz-container:has(.single-value-facet-grid.single-row-scroll) {
  width: 100% !important;
}
.single-value > .chart-stage.chart-stage-flex > .chart-shim .single-value-facet-container:has(> .single-value-facet-grid.single-row-scroll) {
  padding: 0;
  height: 100%;
}
/* height:100% is what lets the tiles be height:100% and land on a plain Number panel's
   geometry. The other two declarations keep that true when the row actually scrolls.

   A 102px strip cannot hold a 100px panel AND a scrollbar: any scrollbar with a height
   comes out of the grid's content box, so the tiles would resolve shorter than their
   contents exactly while the row is scrolling -- the one state where the user is looking
   at it. The KPI row therefore scrolls with NO scrollbar chrome at all (2026-09-22 user
   request): wheel, shift+wheel and trackpad still scroll it, the tiles stay the full
   panel height in every state, and the geometry above holds unconditionally rather than
   only until the facets overflow.

   Both properties are needed -- `scrollbar-width` is the standard one (Chromium 121+,
   Firefox), `::-webkit-scrollbar { display: none }` covers older WebKit/Blink, and a
   published dashboard can be opened in any of them.

   overflow-y:hidden is belt and braces: `overflow-x: auto` computes overflow-y to auto
   as well, so a sub-pixel rounding of the tiles' height:100% could otherwise raise a
   VERTICAL scrollbar inside a 102px strip. */
.single-value > .chart-stage.chart-stage-flex > .chart-shim .viz-container.markdown-viz-container .single-value-facet-grid.single-row-scroll {
  height: 100%;
  overflow-y: hidden;
  scrollbar-width: none;
}
.single-value > .chart-stage.chart-stage-flex > .chart-shim .viz-container.markdown-viz-container .single-value-facet-grid.single-row-scroll::-webkit-scrollbar {
  display: none;
}
/* border-color matches flexdashboard's own `.chart-wrapper { border: 1px solid #e2e2e2 }`
   (inlined in the generated dashboard HTML's <head>) rather than the #e0e0e0 the
   ordinary-panel tile card above uses: this tile is standing in for a panel, beside real
   panels. background is needed because padding:0 lets the square-cornered
   .single-value-innerbox fill the card, leaving only the rounded corners to paint. */
.single-value > .chart-stage.chart-stage-flex > .chart-shim .viz-container.markdown-viz-container .single-value-facet-grid.single-row-scroll > .single-value-facet-cell {
  padding: 0;
  height: 100%;
  background: #fff;
  border-color: #e2e2e2;
}

.chart-wrapper.text-box > .chart-title {
  /* hack to return 0 for $(".chart-title") in adjustedHeight in flexdashboard
     to avoid adding extra height to the original data-height value to 
     make the shorter row height work properly. */
  display: block;
  padding:0;
  border:0;
  font-size:0;
}
.chart-wrapper.text-box > .chart-title .dashboard-pane-toolbar .show-comment-btn, 
.chart-wrapper.text-box > .chart-title .dashboard-pane-toolbar .download-dropdown-menu
{
  display: none;
}

.text-box > .chart-stage {
  height: 100%;
  padding: 13px 14px;
  overflow: hidden;
}
.text-box > .chart-stage .markdown-note-content {
  padding: 0;
  overflow: auto;
}
.text-box > .chart-stage > .chart-shim {
  left: 14px;
  right: 14px;
  top: 13px;
  bottom: 13px;
}

.text-box > .chart-stage > .flowing-content-container {
  padding: 0;
  overflow: hidden;
}

/* A text panel with custom HTML may paint its own background. The opt-in class removes the
   default inset around that content while keeping the dashboard panel's frame and title. */
.chart-wrapper.text-panel-no-padding > .chart-stage {
  padding: 0;
}
.chart-wrapper.text-panel-no-padding > .chart-stage > .chart-shim {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.chart-wrapper.text-panel-no-padding > .chart-stage > .chart-shim > .markdown-note-content {
  padding: 0;
}

/* R output text in dashboard: transparent pre with gray panel background */
.chart-stage .r-output-text {
  border: none;
  background-color: transparent;
}

/* Subset of styles used in the markdown note. */

.markdown-note-content {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  line-height: 1.7em;
  color:#333333; 
  font-family: var(--exp-content-font, -apple-system, BlinkMacSystemFont, "SF Pro", "Helvetica Neue", Arial, Helvetica, "ヒラギノ角ゴシック","Hiragino Sans", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif);
  /* #39446: the dashboard Weight is the text panel's body weight; headings and bold keep their own rules. */
  font-weight: var(--exp-content-font-weight, inherit);
  font-size: 16px;
  word-wrap: break-word;
  padding: 14px;
  /* #15819: Use the full available height of the current dashboard panel. */
  height:100%; 
}

.markdown-note-content .viz-container, .markdown-note-content table {
  font-family: var(--exp-content-font, -apple-system, BlinkMacSystemFont, "SF Pro", "Helvetica Neue", Arial, Helvetica, "ヒラギノ角ゴシック","Hiragino Sans", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif);
}
.markdown-note-content .pl-c {
  color: #6a737d;
}

.markdown-note-content .pl-c1,
.markdown-note-content .pl-s .pl-v {
  color: #005cc5;
}

.markdown-note-content .pl-e,
.markdown-note-content .pl-en {
  color: #6f42c1;
}

.markdown-note-content .pl-smi,
.markdown-note-content .pl-s .pl-s1 {
  color: #24292e;
}

.markdown-note-content .pl-ent {
  color: #22863a;
}

.markdown-note-content .pl-k {
  color: #d73a49;
}

.markdown-note-content .pl-s,
.markdown-note-content .pl-pds,
.markdown-note-content .pl-s .pl-pse .pl-s1,
.markdown-note-content .pl-sr,
.markdown-note-content .pl-sr .pl-cce,
.markdown-note-content .pl-sr .pl-sre,
.markdown-note-content .pl-sr .pl-sra {
  color: #032f62;
}

.markdown-note-content .pl-v,
.markdown-note-content .pl-smw {
  color: #e36209;
}

.markdown-note-content .pl-bu {
  color: #b31d28;
}

.markdown-note-content .pl-ii {
  color: #fafbfc;
  background-color: #b31d28;
}

.markdown-note-content .pl-c2 {
  color: #fafbfc;
  background-color: #d73a49;
}

.markdown-note-content .pl-c2::before {
  content: "^M";
}

.markdown-note-content .pl-sr .pl-cce {
  font-weight: bold;
  color: #22863a;
}

.markdown-note-content .pl-ml {
  color: #735c0f;
}

.markdown-note-content .pl-mh,
.markdown-note-content .pl-mh .pl-en,
.markdown-note-content .pl-ms {
  font-weight: bold;
  color: #005cc5;
}

.markdown-note-content .pl-mi {
  font-style: italic;
  color: #24292e;
}

.markdown-note-content .pl-mb {
  font-weight: bold;
  color: #24292e;
}

.markdown-note-content .pl-md {
  color: #b31d28;
  background-color: #ffeef0;
}

.markdown-note-content .pl-mi1 {
  color: #22863a;
  background-color: #f0fff4;
}

.markdown-note-content .pl-mc {
  color: #e36209;
  background-color: #ffebda;
}

.markdown-note-content .pl-mi2 {
  color: #f6f8fa;
  background-color: #005cc5;
}

.markdown-note-content .pl-mdr {
  font-weight: bold;
  color: #6f42c1;
}

.markdown-note-content .pl-ba {
  color: #586069;
}

.markdown-note-content .pl-sg {
  color: #959da5;
}

.markdown-note-content .pl-corl {
  text-decoration: underline;
  color: #032f62;
}

.markdown-note-content .octicon {
  display: inline-block;
  vertical-align: text-top;
  fill: currentColor;
}

.markdown-note-content a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}

.markdown-note-content a:active,
.markdown-note-content a:hover {
  outline-width: 0;
}

.markdown-note-content strong {
  font-weight: inherit;
}

.markdown-note-content strong {
  font-weight: bolder;
}


.markdown-note-content img {
  border-style: none;
}

/* iframe such as youtube embed, twitter embed etc. */
.markdown-note-content iframe {
  margin-bottom: 1.4em; 
}

.markdown-note-content .figure {
  margin-bottom: 38px;
}

.markdown-note-content svg:not(:root) {
  overflow: hidden;
}

.markdown-note-content code,
.markdown-note-content kbd,
.markdown-note-content pre {
  font-family: Menlo, Monaco, "Courier New", Courier, monospace;
  font-size: 13px;
  color: #333333;
  line-height: 1.8em;
}

.markdown-note-content hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

.markdown-note-content input {
  font: inherit;
  margin: 0;
}

.markdown-note-content input {
  overflow: visible;
}

.markdown-note-content [type="checkbox"] {
  box-sizing: border-box;
  padding: 0;
}

.markdown-note-content * {
  box-sizing: border-box;
}

.markdown-note-content input {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

.markdown-note-content a {
  color: #00ab6d;
  text-decoration: none;

}

.markdown-note-content .nav-tabs>li>a {
  color: #00ab6d;
}

.markdown-note-content .nav-tabs>li.active>a {
  color: #555;
}

.markdown-note-content a:hover {
  text-decoration: underline;
}

.markdown-note-content strong {
  font-weight: 600;
}

.markdown-note-content hr {
  height: 0;
  margin: 15px 0;
  overflow: hidden;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #dfe2e5;
}

.markdown-note-content hr::before {
  display: table;
  content: "";
}

.markdown-note-content hr::after {
  display: table;
  clear: both;
  content: "";
}

.markdown-note-content table {
  border-spacing: 0;
  border-collapse: collapse;
}

/* Markdown notation tables use no .table class. Keep their surface white
   without changing result tables such as kable/pagedtable. */
.markdown-note-content table:not(.table),
.markdown-note-content table:not(.table) tr,
.markdown-note-content table:not(.table) th,
.markdown-note-content table:not(.table) td {
  background-color: #fff !important;
}

.markdown-spec-table table,
.markdown-spec-table table tr,
.markdown-spec-table table th,
.markdown-spec-table table td {
  background-color: #fff !important;
}

.markdown-note-content td,
.markdown-note-content th {
  padding: 0;
}

/* Plain table support. Overriding bootstrap table style */
.markdown-note-content .table>tbody>tr>td, 
.markdown-note-content .table>tbody>tr>th, 
.markdown-note-content .table>tfoot>tr>td, 
.markdown-note-content .table>tfoot>tr>th, 
.markdown-note-content .table>thead>tr>td, 
.markdown-note-content .table>thead>tr>th {
  border-top:1px solid #dfe2e5;
  border-bottom:1px solid #dfe2e5;
  border-left:1px solid #dfe2e5;
  border-right:1px solid #dfe2e5;
}

.markdown-note-content .table>caption+thead>tr:first-child>td, 
.markdown-note-content .table>caption+thead>tr:first-child>th, 
.markdown-note-content .table>colgroup+thead>tr:first-child>td, 
.markdown-note-content .table>colgroup+thead>tr:first-child>th, 
.markdown-note-content .table>thead:first-child>tr:first-child>td, 
.markdown-note-content .table>thead:first-child>tr:first-child>th {
  border-top:1px solid #dfe2e5;
  border-bottom:1px solid #dfe2e5;
  border-left:1px solid #dfe2e5;
  border-right:1px solid #dfe2e5;
} 

/* Restore the table styles for kable/pagedtable table types */
.markdown-note-content .pagedtable .table>tbody>tr>td, 
.markdown-note-content .pagedtable .table>tbody>tr>th, 
.markdown-note-content .pagedtable .table>tfoot>tr>td, 
.markdown-note-content .pagedtable .table>tfoot>tr>th, 
.markdown-note-content .pagedtable .table>thead>tr>td,
.markdown-note-content .pagedtable .table>thead>tr>th,
.markdown-note-content .kable-table .table>tbody>tr>td, 
.markdown-note-content .kable-table .table>tbody>tr>th, 
.markdown-note-content .kable-table .table>tfoot>tr>td, 
.markdown-note-content .kable-table .table>tfoot>tr>th, 
.markdown-note-content .kable-table .table>thead>tr>td,
.markdown-note-content .kable-table .table>thead>tr>th {
  border-top: 1px solid #ddd;
  border-bottom:0;
  border-left:0;
  border-right:0;
}

.markdown-note-content .pagedtable .table>caption+thead>tr:first-child>td, 
.markdown-note-content .pagedtable .table>caption+thead>tr:first-child>th, 
.markdown-note-content .pagedtable .table>colgroup+thead>tr:first-child>td, 
.markdown-note-content .pagedtable .table>colgroup+thead>tr:first-child>th, 
.markdown-note-content .pagedtable .table>thead:first-child>tr:first-child>td, 
.markdown-note-content .pagedtable .table>thead:first-child>tr:first-child>th,
.markdown-note-content .kable-table .table>caption+thead>tr:first-child>td, 
.markdown-note-content .kable-table .table>caption+thead>tr:first-child>th, 
.markdown-note-content .kable-table .table>colgroup+thead>tr:first-child>td, 
.markdown-note-content .kable-table .table>colgroup+thead>tr:first-child>th, 
.markdown-note-content .kable-table .table>thead:first-child>tr:first-child>td, 
.markdown-note-content .kable-table .table>thead:first-child>tr:first-child>th {
  border-top: 0;
  border-bottom:0;
  border-left:0;
  border-right:0;
}

.markdown-note-content .pagedtable .table>thead>tr>th ,
.markdown-note-content .pagedtable .table>thead:first-child>tr:first-child>th,
.markdown-note-content .kable-table .table>thead>tr>th ,
.markdown-note-content .kable-table .table>thead:first-child>tr:first-child>th {
  border-bottom:2px solid #ddd;
}

.markdown-note-content li {
  margin-left: 15px;
  margin-bottom: 5px;
}
.markdown-note-content li:first-child {
  margin-top: 5px;
}

.markdown-note-content blockquote {
  margin: 0;
}

.markdown-note-content ul,
.markdown-note-content ol {
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 0;
}

.markdown-note-content ol ol,
.markdown-note-content ul ol {
  list-style-type: lower-roman;
}

.markdown-note-content ul ul ol,
.markdown-note-content ul ol ol,
.markdown-note-content ol ul ol,
.markdown-note-content ol ol ol {
  list-style-type: lower-alpha;
}

.markdown-note-content dd {
  margin-left: 0;
}

.markdown-note-content pre {
  margin-top: 0;
  margin-bottom: 0;
}

.markdown-note-content .octicon {
  vertical-align: text-bottom;
}

.markdown-note-content .pl-0 {
  padding-left: 0 !important;
}

.markdown-note-content .pl-1 {
  padding-left: 4px !important;
}

.markdown-note-content .pl-2 {
  padding-left: 8px !important;
}

.markdown-note-content .pl-3 {
  padding-left: 16px !important;
}

.markdown-note-content .pl-4 {
  padding-left: 24px !important;
}

.markdown-note-content .pl-5 {
  padding-left: 32px !important;
}

.markdown-note-content .pl-6 {
  padding-left: 40px !important;
}

.markdown-note-content::before {
  display: table;
  content: "";
}

.markdown-note-content::after {
  display: table;
  clear: both;
  content: "";
}

.markdown-note-content>*:first-child {
  margin-top: 0 !important;
}

.markdown-note-content>*:last-child {
  margin-bottom: 0 !important;
}

.markdown-note-content a:not([href]) {
  color: inherit;
  text-decoration: none;
}

.markdown-note-content .anchor {
  float: left;
  padding-right: 4px;
  margin-left: -20px;
  line-height: 1;
}

.markdown-note-content .anchor:focus {
  outline: none;
}

.markdown-note-content blockquote,
.markdown-note-content ul,
.markdown-note-content ol,
.markdown-note-content dl,
.markdown-note-content table,
.markdown-note-content pre {
  margin-top: 0;
  margin-bottom: 1.4em; 
}

.markdown-note-content table {
  margin-bottom: 38px; 
}

.markdown-note-content blockquote {
  font-size: 16px;
}

.markdown-note-content p {
  margin-top: 0;
  margin-bottom: 1.4em;
}

.markdown-note-content hr {
  height: 0.25em;
  padding: 0;
  margin: 24px 0;
  background-color: #e1e4e8;
  border: 0;
}

.markdown-note-content blockquote {
  padding: 0 1em;
  border-left: 0.25em solid #00ab6d;
}

.markdown-note-content blockquote>:first-child {
  margin-top: 0;
}

.markdown-note-content blockquote>:last-child {
  margin-bottom: 0;
}

.markdown-note-content kbd {
  display: inline-block;
  padding: 3px 5px;
  font-size: 11px;
  line-height: 10px;
  color: #444d56;
  vertical-align: middle;
  background-color: #fafbfc;
  border: solid 1px #c6cbd1;
  border-bottom-color: #959da5;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 #959da5;
}

.markdown-note-content h1,
.markdown-note-content h2,
.markdown-note-content h3,
.markdown-note-content h4,
.markdown-note-content h5,
.markdown-note-content h6 {
  margin: 1.7em 0 1.0em 0;
  line-height:1.24; 
  color:#444659; 
  font-weight: 600;
}

.markdown-note-content h1 .octicon-link,
.markdown-note-content h2 .octicon-link,
.markdown-note-content h3 .octicon-link,
.markdown-note-content h4 .octicon-link,
.markdown-note-content h5 .octicon-link,
.markdown-note-content h6 .octicon-link {
  color: #1b1f23;
  vertical-align: middle;
  visibility: hidden;
}

.markdown-note-content h1:hover .anchor,
.markdown-note-content h2:hover .anchor,
.markdown-note-content h3:hover .anchor,
.markdown-note-content h4:hover .anchor,
.markdown-note-content h5:hover .anchor,
.markdown-note-content h6:hover .anchor {
  text-decoration: none;
}

.markdown-note-content h1:hover .anchor .octicon-link,
.markdown-note-content h2:hover .anchor .octicon-link,
.markdown-note-content h3:hover .anchor .octicon-link,
.markdown-note-content h4:hover .anchor .octicon-link,
.markdown-note-content h5:hover .anchor .octicon-link,
.markdown-note-content h6:hover .anchor .octicon-link {
  visibility: visible;
}

.markdown-note-content h1 {
  border-bottom: 1px solid transparent;
  font-size: 24px;
  margin: 1.3em 0 0.67em;
}

.markdown-note-content h2 {
  font-size: 20px;
  border-bottom: 1px solid transparent;
}

.markdown-note-content h3 {
  font-size: 18px;
}

.markdown-note-content h4 {
  font-size: 16px;
  color: #6a737d;
}

.markdown-note-content h5 {
  font-size: 14px;
  color: #6a737d;
}

.markdown-note-content h6 {
  font-size: 13px;
  color: #6a737d;
  font-weight: normal;
}

.markdown-note-content ul,
.markdown-note-content ol {
  padding-left: 2em;
}

.markdown-note-content ul ul,
.markdown-note-content ul ol,
.markdown-note-content ol ol,
.markdown-note-content ol ul {
  margin-top: 0;
  margin-bottom: 0;
}

.markdown-note-content p.caption {
  font-size:0.8em;
  margin-top:4px;
  color:#999999;
  /* Center align doesn't work well. It aligns to the center of the whole text area, not aligned to the image. */
  /* text-align:center; */
}

.markdown-note-content li>p {
  margin-top: 24px;
}

.markdown-note-content dl {
  padding: 0;
}

.markdown-note-content dl dt {
  padding: 0;
  margin-top: 24px;
  font-size: 1em;
  font-style: italic;
  font-weight: 600;
}

.markdown-note-content dl dd {
  padding: 0 16px;
  margin-bottom: 24px;
}

.markdown-note-content img {
  max-width: 100%;
  box-sizing: content-box;
  background-color: #fff;
}

.markdown-note-content code {
  padding: 0;
  padding-top: 0.2em;
  padding-bottom: 0.2em;
  margin: 0;
  background-color: rgba(27,31,35,0.05);
  border-radius: 3px;
}

.markdown-note-content code::before,
.markdown-note-content code::after {
  letter-spacing: -0.2em;
  content: "\00a0";
}

.markdown-note-content pre {
  word-wrap: normal;
}

.markdown-note-content pre>code {
  padding: 0;
  margin: 0;
  word-break: normal;
  white-space: pre-wrap;
  background: transparent;
  border: 0;
}

.markdown-note-content .highlight {
  margin-bottom: 24px;
}

.markdown-note-content .highlight pre {
  margin-bottom: 0;
  word-break: normal;
}

.markdown-note-content .highlight pre,
.markdown-note-content pre {
  padding: 24px;
  overflow: auto;
  background-color: #f8f8f8!important;
  border-radius: 3px;
  border: none;
}

.markdown-note-content pre code {
  display: inline;
  max-width: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  word-wrap: normal;
  background-color: transparent;
  border: 0;
}

@media (max-width : 766px) { 
  /* Avoid having very wide content width on mobile #14646 */
  .markdown-note-content pre code {
    word-break: break-all;
  }
}

.markdown-note-content pre code::before,
.markdown-note-content pre code::after {
  content: normal;
}

.markdown-note-content .full-commit .btn-outline:not(:disabled):hover {
  color: #005cc5;
  border-color: #005cc5;
}

.markdown-note-content kbd {
  display: inline-block;
  padding: 3px 5px;
  font: 11px Menlo, Monaco, "Courier New", Courier, monospace;
  
  line-height: 10px;
  color: #444d56;
  vertical-align: middle;
  background-color: #f8f8f8;
  border: solid 1px #d1d5da;
  border-bottom-color: #c6cbd1;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 #c6cbd1;
}

.markdown-note-content :checked+.radio-label {
  position: relative;
  z-index: 1;
  border-color: #0366d6;
}

.markdown-note-content .task-list-item {
  list-style-type: none;
}

.markdown-note-content .task-list-item+.task-list-item {
  margin-top: 3px;
}

.markdown-note-content .task-list-item input {
  margin: 0 0.2em 0.25em -1.6em;
  vertical-align: middle;
}

.markdown-note-content hr {
  border-bottom-color: #eaecef;
  height:1px; 
  width:80%;
  margin-left:auto; 
  margin-right:auto;
  margin-top:48px; 
  margin-bottom:48px;
}

.markdown-note-content ul.nav li {
  margin: 10px 0 -2px 0;
}

.markdown-note-content ul.nav > a {
  color: #00ab6d;
}

.markdown-note-content ul.nav {
  padding-left: 0;
}

.markdown-note-content .nav-pills>li.active>a, 
.markdown-note-content .nav-pills>li.active>a:focus,
.markdown-note-content .nav-pills>li.active>a:hover {
  background-color: #00ab6d;
  color: #fff;
}

.markdown-note-content .nav-pills>li>a {
  color: #00ab6d;
}

.dashboard-pane-toolbar {
  position: absolute;
  top: 8px;
  right: 1px;
  background-color: white;
  padding-left: 8px;
}

.dashboard-pane-toolbar .full-screen-toggle-btn,
.dashboard-pane-toolbar .download-dropdown-menu,
.dashboard-pane-toolbar .edit-text-btn,
.dashboard-pane-toolbar .adhoc-chart-btn,
.dashboard-pane-toolbar .flow-chart-note-btn {
  display: none;
}

/* Every hover rule in this file is written against a .chart-wrapper that contains no other
   .chart-wrapper. A page with ONLY Number (KPI) rows has no chart section, so flexdashboard
   wraps all of its rows in an implicit .chart-wrapper of its own; that wrapper is hovered
   whenever ANY tile is, and an ungated rule would reveal every tile's toolbar at once (#38893).
   :where() keeps the gate at zero specificity, so it cannot change which rule wins against
   the .text-box rules above. DashboardKpiOnlyPageStyle.test.js fails on a rule without it. */
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar .full-screen-toggle-btn,
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar .edit-text-btn,
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar .download-dropdown-menu,
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar .adhoc-chart-btn,
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar .flow-chart-note-btn {
    display: inline-block;
}

.chart-wrapper .adhoc-chart-btn.only-data-download {
  float: left;
  margin-right: 5px;
  margin-top: 2px;
}

.show-comment-btn {
  cursor: pointer;
  display: inline-block;
  /* Comment (comment) icon from FA6 */
  /* fill = "#00ab6d*/
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiMwMGFiNmQiIGQ9Ik0yNTYgMzJDMTE0LjYgMzIgLjAyNzIgMTI1LjEgLjAyNzIgMjQwYzAgNDkuNjMgMjEuMzUgOTQuOTggNTYuOTcgMTMwLjdjLTEyLjUgNTAuMzctNTQuMjcgOTUuMjctNTQuNzcgOTUuNzdjLTIuMjUgMi4yNS0yLjg3NSA1LjczNC0xLjUgOC43MzRDMS45NzkgNDc4LjIgNC43NSA0ODAgOCA0ODBjNjYuMjUgMCAxMTUuMS0zMS43NiAxNDAuNi01MS4zOUMxODEuMiA0NDAuOSAyMTcuNiA0NDggMjU2IDQ0OGMxNDEuNCAwIDI1NS4xLTkzLjEzIDI1NS4xLTIwOFMzOTcuNCAzMiAyNTYgMzJ6Ii8+PC9zdmc+");
  background-size: 13px;
  width: 13px;
  height: 13px;
  background-repeat: no-repeat;
  /* make sure to show over the map */
  z-index: 1001;
  margin-right: 13px;
}

.adhoc-chart-btn {
  cursor: pointer;
  display: inline-block;
  /* Line chart icon from FA6 */
  /* stroke = "#4d4d4d*/
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBzdHJva2U9IiM0ZDRkNGQiIGZpbGw9IiM0ZDRkNGQiIGQ9Ik0zMiA0MDBDMzIgNDI2LjUgNTMuNDkgNDQ4IDgwIDQ0OEg0OTZDNTA0LjggNDQ4IDUxMiA0NTUuMiA1MTIgNDY0QzUxMiA0NzIuOCA1MDQuOCA0ODAgNDk2IDQ4MEg4MEMzNS44MiA0ODAgMCA0NDQuMiAwIDQwMFY0OEMwIDM5LjE2IDcuMTY0IDMyIDE2IDMyQzI0Ljg0IDMyIDMyIDM5LjE2IDMyIDQ4VjQwMHpNMzMxLjMgMjk5LjNDMzI1LjEgMzA1LjYgMzE0LjkgMzA1LjYgMzA4LjcgMjk5LjNMMjIzLjEgMjE0LjZMMTIzLjMgMzE1LjNDMTE3LjEgMzIxLjYgMTA2LjkgMzIxLjYgMTAwLjcgMzE1LjNDOTQuNDQgMzA5LjEgOTQuNDQgMjk4LjkgMTAwLjcgMjkyLjdMMjEyLjcgMTgwLjdDMjE4LjkgMTc0LjQgMjI5LjEgMTc0LjQgMjM1LjMgMTgwLjdMMzIwIDI2NS40TDQ1Mi43IDEzMi43QzQ1OC45IDEyNi40IDQ2OS4xIDEyNi40IDQ3NS4zIDEzMi43QzQ4MS42IDEzOC45IDQ4MS42IDE0OS4xIDQ3NS4zIDE1NS4zTDMzMS4zIDI5OS4zeiIvPjwvc3ZnPg==");
  background-size: 13px;
  width: 13px;
  height: 13px;
  background-repeat: no-repeat;
  /* make sure to show over the map */
  z-index: 1001;
  margin-right: 13px;
}

.flow-chart-note-btn {
  cursor: pointer;
  display: inline-block;
  /* chart-diagram (FA6), dark fill — matches transform step flow chart */
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%234d4d4d%22%20d%3D%22M96%2064C78.3%2064%2064%2078.3%2064%2096s14.3%2032%2032%2032l320%200c17.7%200%2032-14.3%2032-32s-14.3-32-32-32L96%2064zM32%2096c0-35.3%2028.7-64%2064-64l320%200c35.3%200%2064%2028.7%2064%2064s-28.7%2064-64%2064l-144%200%200%2024%206.6%206.6%2042.7%2042.7L328%20240l56%200c44.2%200%2080%2035.8%2080%2080l0%2032%2016%200c17.7%200%2032%2014.3%2032%2032l0%2064c0%2017.7-14.3%2032-32%2032l-64%200c-17.7%200-32-14.3-32-32l0-64c0-17.7%2014.3-32%2032-32l16%200%200-32c0-26.5-21.5-48-48-48l-56%200-6.6%206.6-42.7%2042.7L272%20328l0%2024%2016%200c17.7%200%2032%2014.3%2032%2032l0%2064c0%2017.7-14.3%2032-32%2032l-64%200c-17.7%200-32-14.3-32-32l0-64c0-17.7%2014.3-32%2032-32l16%200%200-24-6.6-6.6-42.7-42.7L184%20272l-56%200c-26.5%200-48%2021.5-48%2048l0%2032%2016%200c17.7%200%2032%2014.3%2032%2032l0%2064c0%2017.7-14.3%2032-32%2032l-64%200c-17.7%200-32-14.3-32-32l0-64c0-17.7%2014.3-32%2032-32l16%200%200-32c0-44.2%2035.8-80%2080-80l56%200%206.6-6.6%2042.7-42.7L240%20184l0-24L96%20160c-35.3%200-64-28.7-64-64zM48%20384l-16%200%200%2064%2064%200%200-64-16%200-32%200zm192%200l-16%200%200%2064%2064%200%200-64-16%200-32%200zm192%200l-16%200%200%2064%2064%200%200-64-16%200-32%200zM213.3%20256L256%20298.7%20298.7%20256%20256%20213.3%20213.3%20256z%22%2F%3E%3C%2Fsvg%3E");
  background-size: 13px;
  width: 13px;
  height: 13px;
  background-repeat: no-repeat;
  z-index: 1001;
  margin-right: 13px;
}


/* #38891: a Number panel has no header band, so its toolbar floats over the value and the
   target bar. Give its buttons the Note toolbar look (note-base.css .note-pane-toolbar: #777
   chip, 3px radius, white icons, same per-icon centering) so the icons stay readable. The
   class is set by dashboard-footer-fragment.html for marker "singlevalue" only; every other
   chart keeps the white toolbar in its own header band. Hover-only, because the buttons are
   display:none until hover; :not(:empty) so a Number with no toolbar buttons shows no chip.
   The comment icon is never part of the chip: it is always shown, so it keeps its green look
   and its place on hover too, and the chip opens to its left (team review). */

/* Without a comment the whole toolbar is the chip. top/right 0 put it flush in the panel's
   top-right corner like the Note toolbar; the base top:8px/right:1px left a gap. */
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar.single-value-toolbar:not(:empty):not(:has(> .show-comment-btn)) {
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  height: 25px;
  padding-left: 0;
  background-color: #777;
  border-radius: 3px;
}
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar.single-value-toolbar > div:not(.show-comment-btn) {
  margin-right: 0;
  padding: 0 13px;
}

/* With a comment the toolbar keeps its inline layout, so the comment icon does not move on
   hover. The other buttons paint the chip themselves: each grows from the 13px icon to the
   25px chip height, and a -6px margin on each side keeps its margin box at 13px, so the
   line box, and the comment icon on it, stay where they were. Set height, not vertical
   padding: Bootstrap's box-sizing:border-box keeps a height:13px button 13px tall and
   squeezes the padding inside it. Not hover-scoped, so the comment icon sits in the same
   place with or without the chip: top 4px / right -3px move the row 4px up and 4px right
   of the base top:8px/right:1px, closer to the panel corner (user request). padding-left 0
   drops the white strip left of the chip; nowrap keeps the wider row on one line inside
   the narrow .chart-title. */
.dashboard-pane-toolbar.single-value-toolbar:has(> .show-comment-btn) {
  top: 4px;
  right: -3px;
  padding-left: 0;
  white-space: nowrap;
}
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar.single-value-toolbar:has(> .show-comment-btn) > div:not(.show-comment-btn) {
  height: 25px;
  margin-top: -6px;
  margin-bottom: -6px;
  background-color: #777;
  background-position-y: 50%;
}
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar.single-value-toolbar:has(> .show-comment-btn) > div:first-child {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar.single-value-toolbar:has(> .show-comment-btn) > div:has(+ .show-comment-btn) {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  margin-right: 8px;
}
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar.single-value-toolbar .adhoc-chart-btn {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBzdHJva2U9IiNmZmZmZmYiIGZpbGw9IiNmZmZmZmYiIGQ9Ik0zMiA0MDBDMzIgNDI2LjUgNTMuNDkgNDQ4IDgwIDQ0OEg0OTZDNTA0LjggNDQ4IDUxMiA0NTUuMiA1MTIgNDY0QzUxMiA0NzIuOCA1MDQuOCA0ODAgNDk2IDQ4MEg4MEMzNS44MiA0ODAgMCA0NDQuMiAwIDQwMFY0OEMwIDM5LjE2IDcuMTY0IDMyIDE2IDMyQzI0Ljg0IDMyIDMyIDM5LjE2IDMyIDQ4VjQwMHpNMzMxLjMgMjk5LjNDMzI1LjEgMzA1LjYgMzE0LjkgMzA1LjYgMzA4LjcgMjk5LjNMMjIzLjEgMjE0LjZMMTIzLjMgMzE1LjNDMTE3LjEgMzIxLjYgMTA2LjkgMzIxLjYgMTAwLjcgMzE1LjNDOTQuNDQgMzA5LjEgOTQuNDQgMjk4LjkgMTAwLjcgMjkyLjdMMjEyLjcgMTgwLjdDMjE4LjkgMTc0LjQgMjI5LjEgMTc0LjQgMjM1LjMgMTgwLjdMMzIwIDI2NS40TDQ1Mi43IDEzMi43QzQ1OC45IDEyNi40IDQ2OS4xIDEyNi40IDQ3NS4zIDEzMi43QzQ4MS42IDEzOC45IDQ4MS42IDE0OS4xIDQ3NS4zIDE1NS4zTDMzMS4zIDI5OS4zeiIvPjwvc3ZnPg==");
  background-position-x: 60%;
}
.chart-wrapper:where(:not(:has(.chart-wrapper))):hover .dashboard-pane-toolbar.single-value-toolbar .flow-chart-note-btn {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M96%2064C78.3%2064%2064%2078.3%2064%2096s14.3%2032%2032%2032l320%200c17.7%200%2032-14.3%2032-32s-14.3-32-32-32L96%2064zM32%2096c0-35.3%2028.7-64%2064-64l320%200c35.3%200%2064%2028.7%2064%2064s-28.7%2064-64%2064l-144%200%200%2024%206.6%206.6%2042.7%2042.7L328%20240l56%200c44.2%200%2080%2035.8%2080%2080l0%2032%2016%200c17.7%200%2032%2014.3%2032%2032l0%2064c0%2017.7-14.3%2032-32%2032l-64%200c-17.7%200-32-14.3-32-32l0-64c0-17.7%2014.3-32%2032-32l16%200%200-32c0-26.5-21.5-48-48-48l-56%200-6.6%206.6-42.7%2042.7L272%20328l0%2024%2016%200c17.7%200%2032%2014.3%2032%2032l0%2064c0%2017.7-14.3%2032-32%2032l-64%200c-17.7%200-32-14.3-32-32l0-64c0-17.7%2014.3-32%2032-32l16%200%200-24-6.6-6.6-42.7-42.7L184%20272l-56%200c-26.5%200-48%2021.5-48%2048l0%2032%2016%200c17.7%200%2032%2014.3%2032%2032l0%2064c0%2017.7-14.3%2032-32%2032l-64%200c-17.7%200-32-14.3-32-32l0-64c0-17.7%2014.3-32%2032-32l16%200%200-32c0-44.2%2035.8-80%2080-80l56%200%206.6-6.6%2042.7-42.7L240%20184l0-24L96%20160c-35.3%200-64-28.7-64-64zM48%20384l-16%200%200%2064%2064%200%200-64-16%200-32%200zm192%200l-16%200%200%2064%2064%200%200-64-16%200-32%200zm192%200l-16%200%200%2064%2064%200%200-64-16%200-32%200zM213.3%20256L256%20298.7%20298.7%20256%20256%20213.3%20213.3%20256z%22%2F%3E%3C%2Fsvg%3E");
  background-position-x: 50%;
}

.pixel-ratio-hint-toggle-btn {
  cursor: pointer;
  display: inline-block;
  /* Question (circle-question) icon from FA6 */
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBkPSJNMjU2IDBDMTE0LjYgMCAwIDExNC42IDAgMjU2czExNC42IDI1NiAyNTYgMjU2czI1Ni0xMTQuNiAyNTYtMjU2UzM5Ny40IDAgMjU2IDB6TTI1NiA0ODBjLTEyMy41IDAtMjI0LTEwMC41LTIyNC0yMjRzMTAwLjUtMjI0IDIyNC0yMjRzMjI0IDEwMC41IDIyNCAyMjRTMzc5LjUgNDgwIDI1NiA0ODB6TTI0MCAzNDRjLTEzLjI1IDAtMjQgMTAuNzUtMjQgMjRzMTAuNzUgMjQgMjQgMjRzMjQtMTAuNzUgMjQtMjRTMjUzLjMgMzQ0IDI0MCAzNDR6TTI4NS42IDEyOEgyMjYuNEMxODkuOCAxMjggMTYwIDE1Ny44IDE2MCAxOTQuNFYyMDRjMCA4Ljg0NCA3LjE1NiAxNiAxNiAxNlMxOTIgMjEyLjggMTkyIDIwNFYxOTQuNEMxOTIgMTc1LjQgMjA3LjQgMTYwIDIyNi40IDE2MGg1OS4yNUMzMDQuNiAxNjAgMzIwIDE3NS40IDMyMCAxOTQuNGMwIDEyLjQ4LTYuNzgxIDI0LTE3LjA2IDI5LjcyTDI0Mi41IDI1NC4zQzIzMS4xIDI2MC43IDIyNCAyNzIuNyAyMjQgMjg1LjhWMzA0QzIyNCAzMTIuOCAyMzEuMiAzMjAgMjQwIDMyMFMyNTYgMzEyLjggMjU2IDMwNFYyODUuOGMwLTEuNDUzIC43ODEzLTIuNzk3IDEuNDM4LTMuMTcybDYwLjQxLTMwLjIyQzMzOC45IDI0MC43IDM1MiAyMTguNSAzNTIgMTk0LjRDMzUyIDE1Ny44IDMyMi4yIDEyOCAyODUuNiAxMjh6Ii8+PC9zdmc+");
  background-size: 14px;
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  /* make sure to show over the map */
  z-index: 1001;
  opacity: 0.8;
  transform: translateY(1px);
  margin-left: 2px;
}
.pixel-ratio-hint-toggle-btn:hover {
  display: inline-block;
  opacity: 1;
}
.pixel-ratio-hint-toggle-btn:hover::after {
  width: 150px!important;
  height: unset!important;
  white-space:normal!important;
}
.pixel-ratio-hint-toggle-btn:hover::before{
  transform: translate3d(-50%, -6px, 0)!important;
}
.edit-text-btn {
  cursor: pointer;
  display: inline-block;
  /* Edit (pencil) icon from FA6 */
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuNC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIzIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBkPSJNNDU0LjYgNDUuM2wxMi4xIDEyLjFjMTIuNSAxMi41IDEyLjUgMzIuOCAwIDQ1LjNMNDQwIDEyOS40IDM4Mi42IDcybDI2LjctMjYuN2MxMi41LTEyLjUgMzIuOC0xMi41IDQ1LjMgMHpNMTg5IDI2NS42bDE3MS0xNzFMNDE3LjQgMTUybC0xNzEgMTcxYy00LjIgNC4yLTkuNiA3LjItMTUuNCA4LjZsLTY1LjYgMTUuMUwxODAuNSAyODFjMS4zLTUuOCA0LjMtMTEuMiA4LjYtMTUuNHptMTk3LjctMjQzTDE2Ni40IDI0M2MtOC41IDguNS0xNC40IDE5LjItMTcuMSAzMC45bC0yMC45IDkwLjZjLTEuMiA1LjQgLjQgMTEgNC4zIDE0LjlzOS41IDUuNSAxNC45IDQuM2w5MC42LTIwLjljMTEuNy0yLjcgMjIuNC04LjYgMzAuOS0xNy4xTDQ4OS40IDEyNS4zYzI1LTI1IDI1LTY1LjUgMC05MC41TDQ3Ny4zIDIyLjZjLTI1LTI1LTY1LjUtMjUtOTAuNSAwek04MCA2NEMzNS44IDY0IDAgOTkuOCAwIDE0NFY0MzJjMCA0NC4yIDM1LjggODAgODAgODBIMzY4YzQ0LjIgMCA4MC0zNS44IDgwLTgwVjMwNGMwLTguOC03LjItMTYtMTYtMTZzLTE2IDcuMi0xNiAxNlY0MzJjMCAyNi41LTIxLjUgNDgtNDggNDhIODBjLTI2LjUgMC00OC0yMS41LTQ4LTQ4VjE0NGMwLTI2LjUgMjEuNS00OCA0OC00OEgyMDhjOC44IDAgMTYtNy4yIDE2LTE2cy03LjItMTYtMTYtMTZIODB6Ii8+PC9zdmc+");
  background-size: 12px;
  width: 13px;
  height: 13px;
  background-repeat: no-repeat;
  /* make sure to show over the map */
  z-index: 1001;
  opacity: 0.6;
  margin-right: 7px;
}
.full-screen-toggle-btn {
  cursor: pointer;
  display: inline-block;
  /* Expand (arrow-up-right-and-arrow-down-left-from-center) icon from FA6 */
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBzdHJva2U9IiM0ZDRkNGQiIGQ9Ik00OTYgMGgtMTYwQzMyNy4yIDAgMzIwIDcuMTU2IDMyMCAxNlMzMjcuMiAzMiAzMzYgMzJoMTIxLjRsLTE2NC43IDE2NC43Yy02LjI1IDYuMjUtNi4yNSAxNi4zOCAwIDIyLjYyczE2LjM4IDYuMjUgMjIuNjIgMEw0ODAgNTQuNjNWMTc2QzQ4MCAxODQuOCA0ODcuMiAxOTIgNDk2IDE5MlM1MTIgMTg0LjggNTEyIDE3NnYtMTYwQzUxMiA3LjE1NiA1MDQuOCAwIDQ5NiAwek0xOTYuNyAyOTIuN0wzMiA0NTcuNFYzMzZDMzIgMzI3LjIgMjQuODQgMzIwIDE2IDMyMFMwIDMyNy4yIDAgMzM2djE2MEMwIDUwNC44IDcuMTU2IDUxMiAxNiA1MTJoMTYwQzE4NC44IDUxMiAxOTIgNTA0LjggMTkyIDQ5NlMxODQuOCA0ODAgMTc2IDQ4MEg1NC42M2wxNjQuNy0xNjQuN2M2LjI1LTYuMjUgNi4yNS0xNi4zOCAwLTIyLjYyUzIwMi45IDI4Ni40IDE5Ni43IDI5Mi43eiIvPjwvc3ZnPg==");
  background-size: 12px;
  width: 13px;
  height: 13px;
  background-repeat: no-repeat;
  /* make sure to show over the map */
  z-index: 1001;
  opacity: 0.6;
  margin-right: 7px;
}
.edit-text-btn:hover,
.full-screen-toggle-btn:hover {
  display: inline-block;
  opacity: 1;
}
.full-screen-pane {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  padding: 10px;
  border-radius: 5px;
  background-color: white;
  /* make sure to show over the map */
  z-index: 1002;
}
.full-screen-pane-inner {
  width: 100%;
  height: 100%;
  /* we need this to make the wordcloud center-aligned */
  text-align:left!important; 
  border: 1px solid #eee;
  border-radius: 4px;
  padding: 10px;

}
.full-screen-close-btn {
  position: absolute;
  top: 16px;
  right: 16px;
  cursor: pointer;
  display: inline-block;
  /* Close (xmark) icon from FA6 */
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMjAgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBzdHJva2U9IiM0ZDRkNGQiIGQ9Ik0zMTUuMyA0MTEuM2MtNi4yNTMgNi4yNTMtMTYuMzcgNi4yNTMtMjIuNjMgMEwxNjAgMjc4LjZsLTEzMi43IDEzMi43Yy02LjI1MyA2LjI1My0xNi4zNyA2LjI1My0yMi42MyAwYy02LjI1My02LjI1My02LjI1My0xNi4zNyAwLTIyLjYzTDEzNy40IDI1Nkw0LjY5IDEyMy4zYy02LjI1My02LjI1My02LjI1My0xNi4zNyAwLTIyLjYzYzYuMjUzLTYuMjUzIDE2LjM3LTYuMjUzIDIyLjYzIDBMMTYwIDIzMy40bDEzMi43LTEzMi43YzYuMjUzLTYuMjUzIDE2LjM3LTYuMjUzIDIyLjYzIDBjNi4yNTMgNi4yNTMgNi4yNTMgMTYuMzcgMCAyMi42M0wxODIuNiAyNTZsMTMyLjcgMTMyLjdDMzIxLjYgMzk0LjkgMzIxLjYgNDA1LjEgMzE1LjMgNDExLjN6Ii8+PC9zdmc+");
  background-size: 14px;
  width: 25px;
  height: 23px;
  background-repeat: no-repeat;
  opacity: 1;
  /* make sure to show over the map */
  z-index: 1003;
  background-position-x: 48%;
  background-color: white;
  border-radius: 4px;
}

/*
 * Download dropdown menu at the toolbar.
 */
.download-dropdown-menu {
  display: inline-block;
  position: relative;
  /* Download (arrow-down-to-link) icon from FA6 */
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzODQgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBzdHJva2U9IiM0ZDRkNGQiIGQ9Ik0xODAuNyAzOTUuM0MxODMuOCAzOTguNCAxODcuOSA0MDAgMTkyIDQwMHM4LjE4OC0xLjU2MiAxMS4zMS00LjY4OGwxNDQtMTQ0YzYuMjUtNi4yNSA2LjI1LTE2LjM4IDAtMjIuNjJzLTE2LjM4LTYuMjUtMjIuNjIgMEwyMDggMzQ1LjRWNDhDMjA4IDM5LjE2IDIwMC44IDMyIDE5MiAzMlMxNzYgMzkuMTYgMTc2IDQ4djI5Ny40TDU5LjMxIDIyOC43Yy02LjI1LTYuMjUtMTYuMzgtNi4yNS0yMi42MiAwcy02LjI1IDE2LjM4IDAgMjIuNjJMMTgwLjcgMzk1LjN6TTM2OCA0NDhoLTM1MkM3LjE1NiA0NDggMCA0NTUuMiAwIDQ2NFM3LjE1NiA0ODAgMTYgNDgwaDM1MmM4Ljg0NCAwIDE2LTcuMTU2IDE2LTE2UzM3Ni44IDQ0OCAzNjggNDQ4eiIvPjwvc3ZnPg==");
  background-size: 11px;
  width: 13px;
  background-repeat: no-repeat;
  z-index: 1001;
  opacity: 0.6;
  margin-right: 11px;
  font-size: 12px;
  cursor:pointer;
  vertical-align: text-bottom;
}

.download-dropdown-menu:hover {
  opacity: 1;
}

.download-dropdown-menu a {
  opacity:1;
  color: #666;
  text-decoration: none;
}

.download-dropdown-menu ul {
  list-style: none;
  margin: 0;
  padding-left: 0;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  left: 0;
  display: none;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 3px;
  transform: translateX(-80%); 
  padding-top: 3px;
  padding-bottom: 3px;
  background-color: #fff;
}

.download-dropdown-menu ul li {
  clear: both;
  white-space: nowrap;
  padding: 4px 10px;
  background-color: #fff;
}

.download-dropdown-menu ul li:hover,
.download-dropdown-menu ul li:focus-within {
  background: #f7f7f7;
  cursor: pointer;
}

.download-dropdown-menu ul li:focus-within a {
  outline: none;
}

.download-dropdown-menu:hover > ul,
.download-dropdown-menu ul:hover{
  visibility: visible;
  opacity: 1;
  display: block;
}

.download-dropdown-menu ul li.hidden-download-menu {
  display:none;
}

/*
 * Dashboard editing inside the Desktop preview (#37106, PRD 6.1): the per-panel hover icon bar
 * (grip, Edit Title, Choose a different chart / Edit Text, Text Settings, Delete), like Edit mode's
 * dark panel bar. Every selector starts with body.exp-pe-enabled, a class only the fragment's
 * PREVIEW_EDIT block sets (Desktop preview), so these rules match nothing in published, server or
 * local HTML (PRD R21; DashboardFooterFragmentPreviewEditMenu.test.js). A text panel's Edit Text
 * item is one of this bar's buttons (.exp-pe-bar-edit-text below); it is not drawn a second time
 * on the panel's own .edit-text-btn toolbar button (#39487).
 */

/* Over the top-left of the title band (full band height), or of a panel without one (a Number, a
   hidden title); shown while that band / panel is hovered or a button in it has keyboard focus. */
body.exp-pe-enabled .exp-pe-panel-bar {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1002;
  box-sizing: border-box;
  height: 32px;
  padding: 0 4px;
  align-items: center;
  background-color: #666666;
  border-radius: 0 0 3px 0;
  white-space: nowrap;
  font-size: 12px;
}
body.exp-pe-enabled .chart-title > .exp-pe-panel-bar {
  height: 100%;
  min-height: 32px;
}
body.exp-pe-enabled .chart-title:hover > .exp-pe-panel-bar,
body.exp-pe-enabled .chart-wrapper:where(:not(:has(.chart-wrapper))):hover > .exp-pe-panel-bar,
/* a titled panel's bar lives in its .chart-title: show it while the pointer is anywhere over the panel,
   like the .dashboard-pane-toolbar icons (#39716) */
body.exp-pe-enabled .chart-wrapper:where(:not(:has(.chart-wrapper))):hover > .chart-title > .exp-pe-panel-bar,
body.exp-pe-enabled .exp-pe-panel-bar:focus-within,
/* the selected panel (#37106 Q47; the engine marks its wrapper) keeps its bar shown, hovered or not */
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-selected > .exp-pe-panel-bar,
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-selected > .chart-title > .exp-pe-panel-bar {
  display: flex;
}

/* The bar is editing chrome: a print / PDF of the preview never carries it, selected or not. */
@media print {
  body.exp-pe-enabled .exp-pe-panel-bar {
    display: none !important;
  }
}

/* White icons on the dark bar, no `filter` (it would also recolor the tooltip). */
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-btn,
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-grip {
  position: relative;
  box-sizing: border-box;
  width: 38px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background-color: transparent;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 17px 17px;
  cursor: pointer;
  opacity: 0.85;
}
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-grip {
  width: 22px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22%23ffffff%22%3E%3Ccircle%20cx%3D%222%22%20cy%3D%222%22%20r%3D%221.5%22%2F%3E%3Ccircle%20cx%3D%226%22%20cy%3D%222%22%20r%3D%221.5%22%2F%3E%3Ccircle%20cx%3D%222%22%20cy%3D%227%22%20r%3D%221.5%22%2F%3E%3Ccircle%20cx%3D%226%22%20cy%3D%227%22%20r%3D%221.5%22%2F%3E%3Ccircle%20cx%3D%222%22%20cy%3D%2212%22%20r%3D%221.5%22%2F%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2212%22%20r%3D%221.5%22%2F%3E%3C%2Fsvg%3E");
  background-size: 7px 12px;
  cursor: grab;
}
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-btn:hover,
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-btn:focus-visible,
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-grip:hover {
  background-color: #555555;
  opacity: 1;
  outline: none;
}
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-edit-title {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20576%20512%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20transform%3D%22matrix%281%200%200%20-1%200%20448%29%22%20d%3D%22M417.8%20132.5l20%2020c3.8%203.8%2010.2%201.1%2010.2%20-4.2v-164.3c0%20-26.5%20-21.5%20-48%20-48%20-48h-352c-26.5%200%20-48%2021.5%20-48%2048v352c0%2026.5%2021.5%2048%2048%2048h292.3c5.3%200%208%20-6.5%204.2%20-10.2l-20%20-20c-1.1%20-1.1%20-2.7%20-1.8%20-4.2%20-1.8%20h-272.3c-8.8%200%20-16%20-7.2%20-16%20-16v-352c0%20-8.8%207.2%20-16%2016%20-16h352c8.8%200%2016%207.2%2016%2016v144.3c0%201.6%200.6%203.1%201.8%204.2zM563.7%20323.7l-312.5%20-312.5l-99.9%20-11.1c-13.4%20-1.5%20-24.7%209.8%20-23.2%2023.2%20l11.1%2099.9l312.5%20312.5c16.4%2016.4%2043%2016.4%2059.4%200l52.6%20-52.6c16.4%20-16.4%2016.4%20-43%200%20-59.4zM470.1%20275.3l-66.7%2066.7l-233.6%20-233.5l-8.3%20-75.1l75.1%208.3zM541.1%20360.5l-52.6%2052.6%20c-3.8%203.8%20-10.2%204%20-14.1%200l-48.4%20-48.4l66.7%20-66.7l48.4%2048.4c3.9%203.8%203.9%2010.2%200%2014.1z%22%2F%3E%3C%2Fsvg%3E");
}
/* external-link (#39424): the Edit Chart / Edit Analytics button, drawn like Edit mode's fa-external-link */
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-open-chart {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22%23ffffff%22%3E%3Cpath%20d%3D%22M2%204H7V5.3H3.3V12.7H10.7V9H12V14H2Z%22%2F%3E%3Cpath%20d%3D%22M9%202H14V7H12.7V4.2L7.9%209L7%208.1L11.8%203.3H9Z%22%2F%3E%3C%2Fsvg%3E");
}
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-replace {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20transform%3D%22matrix%281%200%200%20-1%200%20448%29%22%20d%3D%22M512%20192c0%20-88.2%20-71.8%20-160%20-160%20-160h-241.4l68.2%20-68.2c4.7%20-4.7%204.7%20-12.3%200%20-17l-5.7%20-5.7c-4.7%20-4.7%20-12.3%20-4.7%20-17%200l-98.3%2098.3c-4.7%204.7%20-4.7%2012.3%200%2017%20l98.3%2098.3c4.7%204.7%2012.3%204.7%2017%200l5.7%20-5.7c4.7%20-4.7%204.7%20-12.3%200%20-17l-68.2%20-68.2h241.4c70.6%200%20128%2057.4%20128%20128c0%2028.6%20-9.4%2055%20-25.3%2076.3%20c-3.6%204.8%20-3.1%2011.5%201.1%2015.7l5.7%205.7c5.2%205.2%2013.7%204.5%2018.1%20-1.3c20.3%20-26.8%2032.4%20-60.2%2032.4%20-96.4zM57.3%20115.7c3.6%20-4.8%203.1%20-11.5%20-1.1%20-15.7l-5.7%20-5.7%20c-5.2%20-5.2%20-13.7%20-4.5%20-18.1%201.3c-20.3%2026.8%20-32.4%2060.2%20-32.4%2096.4c0%2088.2%2071.8%20160%20160%20160h241.4l-68.2%2068.2c-4.7%204.7%20-4.7%2012.3%200%2017l5.7%205.7%20c4.7%204.7%2012.3%204.7%2017%200l98.3%20-98.3c4.7%20-4.7%204.7%20-12.3%200%20-17l-98.3%20-98.3c-4.7%20-4.7%20-12.3%20-4.7%20-17%200l-5.7%205.7c-4.7%204.7%20-4.7%2012.3%200%2017l68.2%2068.2h-241.4%20c-70.6%200%20-128%20-57.4%20-128%20-128c0%20-28.6%209.4%20-55%2025.3%20-76.3z%22%2F%3E%3C%2Fsvg%3E");
}
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-edit-text {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20384%20512%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20transform%3D%22matrix%281%200%200%20-1%200%20448%29%22%20d%3D%22M369.9%20350.1c9%20-9%2014.1%20-21.3%2014.1%20-34v-332.1c0%20-26.5%20-21.5%20-48%20-48%20-48h-288c-26.5%200%20-48%2021.5%20-48%2048v416c0%2026.5%2021.5%2048%2048%2048.1h204.1c12.7%200%2024.9%20-5.1%2033.9%20-14.1zM347.3%20327.4l-83.9%2083.9%20c-2.1%202.1%20-4.6%203.5%20-7.4%204.2v-95.5h95.5c-0.7%202.8%20-2.1%205.3%20-4.2%207.4zM336%20-32c8.8%200%2016%207.2%2016%2016v304h-104c-13.3%200%20-24%2010.7%20-24%2024v104h-176c-8.8%200%20-16%20-7.2%20-16%20-16v-416c0%20-8.8%207.2%20-16%2016%20-16%20h288zM219.2%20200.8l29.6%20-29.6c1.8%20-1.8%201.8%20-4.6%200%20-6.4l-112.4%20-112.4l-30.1%20-4.3c-5.9%20-0.8%20-11%204.2%20-10.2%2010.2l4.3%2030.1l112.4%20112.4c1.8%201.8%204.6%201.8%206.4%200zM283.6%20199.6%20l-16.4%20-16.4c-1.8%20-1.8%20-4.6%20-1.8%20-6.4%200l-29.6%2029.6c-1.8%201.8%20-1.8%204.6%200%206.4l16.4%2016.4c5.9%205.9%2015.4%205.9%2021.2%200l14.8%20-14.8c5.9%20-5.8%205.9%20-15.3%200%20-21.2z%22%2F%3E%3C%2Fsvg%3E");
}
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-text-settings {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20transform%3D%22matrix%281%200%200%20-1%200%20448%29%22%20d%3D%22M482.7%20148.7c9.6%20-5.5%2014.2%20-16.9%2011%20-27.5c-11.2%20-37.7%20-31.2%20-71.7%20-57.5%20-99.6c-7.6%20-8.1%20-19.8%20-9.8%20-29.4%20-4.3l-32.6%2018.8c-10.8%20-8.2%20-29.8%20-19.2%20-42.3%20-24.5%20v-37.6c0%20-11.1%20-7.7%20-20.8%20-18.5%20-23.4c-37.7%20-8.9%20-77.1%20-8.9%20-114.8%200c-10.8%202.6%20-18.5%2012.2%20-18.5%2023.4v37.6c-12.5%205.3%20-31.5%2016.2%20-42.3%2024.5l-32.6%20-18.8%20c-9.6%20-5.6%20-21.8%20-3.8%20-29.4%204.3c-26.4%2027.9%20-46.3%2061.8%20-57.5%2099.6c-3.1%2010.6%201.5%2022%2011%2027.5l32.6%2018.8c-0.8%206.7%20-1.5%2017.7%20-1.5%2024.5%20c0%206.8%200.7%2017.7%201.5%2024.4l-32.6%2018.8c-9.6%205.5%20-14.2%2016.9%20-11%2027.5c11.2%2037.7%2031.2%2071.7%2057.5%2099.6c7.6%208.1%2019.8%209.8%2029.4%204.3l32.6%20-18.8%20c10.8%208.2%2029.8%2019.2%2042.3%2024.5v37.6c0%2011.1%207.7%2020.8%2018.5%2023.4c37.7%208.9%2077.1%208.9%20114.8%200c10.8%20-2.6%2018.5%20-12.2%2018.5%20-23.4v-37.6c12.5%20-5.3%2031.5%20-16.2%2042.3%20-24.5%20l32.6%2018.8c9.6%205.6%2021.8%203.8%2029.4%20-4.3c26.4%20-27.9%2046.3%20-61.8%2057.5%20-99.6c3.1%20-10.6%20-1.5%20-22%20-11%20-27.5l-32.6%20-18.8c0.8%20-6.7%201.5%20-17.7%201.5%20-24.4%20c0%20-6.8%20-0.7%20-17.7%20-1.5%20-24.5zM417.2%2048.3c19.7%2022.1%2034.7%2048%2043.9%2076l-46.3%2026.7c6.5%2035.4%206.5%2046.7%200%2082.1l46.3%2026.7c-9.2%2028%20-24.2%2053.9%20-43.9%2076l-46.3%20-26.8%20c-27.4%2023.4%20-37.1%2029.1%20-71%2041.1v53.5c-12%202.5%20-31.6%204.5%20-43.9%204.5s-31.9%20-2%20-43.9%20-4.5v-53.5c-34%20-12%20-43.7%20-17.6%20-71%20-41.1l-46.3%2026.8%20c-19.7%20-22.1%20-34.7%20-48%20-43.9%20-76l46.3%20-26.7c-6.5%20-35.4%20-6.5%20-46.7%200%20-82.1l-46.3%20-26.7c9.2%20-28%2024.2%20-53.9%2043.9%20-76l46.3%2026.7c27.7%20-23.7%2037.4%20-29.2%2071%20-41.1%20v-53.5c12%20-2.5%2031.6%20-4.5%2043.9%20-4.5s31.9%202%2043.9%204.5v53.5c34.5%2012.2%2044.1%2018%2071%2041.1zM256%20288c52.9%200%2096%20-43.1%2096%20-96s-43.1%20-96%20-96%20-96s-96%2043.1%20-96%2096s43.1%2096%2096%2096zM256%20128%20c35.3%200%2064%2028.7%2064%2064s-28.7%2064%20-64%2064s-64%20-28.7%20-64%20-64s28.7%20-64%2064%20-64z%22%2F%3E%3C%2Fsvg%3E");
}
/* fal fa-image (#8667): the image panel's Image Settings button */
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-edit-image {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20transform%3D%22matrix%281%200%200%20-1%200%20448%29%22%20d%3D%22M464%20384c26.51%200%2048%20-21.49%2048%20-48v-288c0%20-26.51%20-21.49%20-48%20-48%20-48h-416c-26.51%200%20-48%2021.49%20-48%2048v288c0%2026.51%2021.49%2048%2048%2048h416zM480%2048v288c0%208.82%20-7.18%2016%20-16%2016h-416c-8.82%200%20-16%20-7.18%20-16%20-16v-288c0%20-8.82%207.18%20-16%2016%20-16h416c8.82%200%2016%207.18%2016%2016zM112%20216c-30.93%200%20-56%2025.07%20-56%2056s25.07%2056%2056%2056s56%20-25.07%2056%20-56s-25.07%20-56%20-56%20-56zM112%20296c-13.23%200%20-24%20-10.77%20-24%20-24s10.77%20-24%2024%20-24s24%2010.77%2024%2024s-10.77%2024%20-24%2024zM319.03%20272.97c9.37%209.37%2024.57%209.37%2033.94%200l88%20-88c4.5%20-4.5%207.03%20-10.61%207.03%20-16.97v-92c0%20-6.63%20-5.37%20-12%20-12%20-12h-360c-6.63%200%20-12%205.37%20-12%2012v28c0%205.49%203.15%2013.09%207.03%2016.97l88%2088c9.37%209.37%2024.57%209.37%2033.94%200l31.03%20-31.03zM416%2096v68.69l-80%2080l-112%20-112l-48%2048l-80%20-80v-4.69h320z%22%2F%3E%3C%2Fsvg%3E");
}
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-bar-delete {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20512%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20transform%3D%22matrix%281%200%200%20-1%200%20448%29%22%20d%3D%22M296%2016c-4.4%200%20-8%203.6%20-8%208v272c0%204.4%203.6%208%208%208h16c4.4%200%208%20-3.6%208%20-8v-272c0%20-4.4%20-3.6%20-8%20-8%20-8h-16zM136%2016c-4.4%200%20-8%203.6%20-8%208v272c0%204.4%203.6%208%208%208h16c4.4%200%208%20-3.6%208%20-8v-272%20c0%20-4.4%20-3.6%20-8%20-8%20-8h-16zM440%20384c4.4%200%208%20-3.6%208%20-8v-16c0%20-4.4%20-3.6%20-8%20-8%20-8h-24v-368c0%20-26.5%20-21.5%20-48%20-48%20-48h-288c-26.5%200%20-48%2021.5%20-48%2048v368h-24c-4.4%200%20-8%203.6%20-8%208v16c0%204.4%203.6%208%208%208h104%20l33.6%2044.8c7.9%2010.6%2025.2%2019.2%2038.4%2019.2h80c13.2%200%2030.5%20-8.6%2038.4%20-19.2l33.6%20-44.8h104zM171.2%20409.6l-19.2%20-25.6h144l-19.2%2025.6c-2.7%203.5%20-8.4%206.4%20-12.8%206.4h-80%20c-4.4%20-0%20-10.1%20-2.9%20-12.8%20-6.4zM384%20-16v368h-320v-368c0%20-8.8%207.2%20-16%2016%20-16h288c8.8%200%2016%207.2%2016%2016zM216%2016c-4.4%200%20-8%203.6%20-8%208v272c0%204.4%203.6%208%208%208h16c4.4%200%208%20-3.6%208%20-8v-272%20c0%20-4.4%20-3.6%20-8%20-8%20-8h-16z%22%2F%3E%3C%2Fsvg%3E");
}

/* Busy (window._previewEditBusy / body.exp-pe-busy): visible but disabled (PRD 6.6). */
body.exp-pe-enabled.exp-pe-busy .exp-pe-panel-bar .exp-pe-bar-btn,
body.exp-pe-enabled.exp-pe-busy .exp-pe-panel-bar .exp-pe-grip,
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
body.exp-pe-enabled.exp-pe-busy .exp-pe-panel-bar .exp-pe-bar-btn:hover,
body.exp-pe-enabled .exp-pe-panel-bar .exp-pe-disabled:hover {
  background-color: transparent;
}

/* A multi-selection's bar (#37106 Q47 phase 2): the leftmost selected panel's bar controls the whole selection, so the
   items that only make sense for one panel (edit title, choose a chart, edit text, text settings, image settings) are dimmed and inert. */
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-multi .exp-pe-panel-bar .exp-pe-bar-edit-title,
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-multi .exp-pe-panel-bar .exp-pe-bar-open-chart,
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-multi .exp-pe-panel-bar .exp-pe-bar-replace,
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-multi .exp-pe-panel-bar .exp-pe-bar-edit-text,
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-multi .exp-pe-panel-bar .exp-pe-bar-text-settings,
body.exp-pe-enabled .chart-wrapper.exp-pe-panel-multi .exp-pe-panel-bar .exp-pe-bar-edit-image {
  opacity: 0.35;
  pointer-events: none;
}
/* The grip moves the whole selection (phase 3) and the trash deletes it (phase 2b): both stay live. */

/* No editing chrome over the full-screen chart pane (PRD 6.6). */
body.exp-pe-enabled:has(> .full-screen-pane) .exp-pe-panel-bar {
  display: none;
}

/*
 * The Desktop preview's Edit / Run mode (#39334). The page is the same for both (switching must not reload it: every
 * chart would redraw), so the footer fragment sets body.exp-pe-mode-edit or body.exp-pe-mode-run at load and when the
 * parent switches. Neither class exists outside the Desktop preview (server, local HTML, published), so every rule
 * below matches nothing there. Charts are never touched: only chrome and affordances change.
 */

/* Run: no edit chrome from the fragment (the panel hover bar, including a text panel's Edit Text item). */
body.exp-pe-mode-run .exp-pe-panel-bar {
  display: none !important;
}

/* Edit: no Show Details / Dashboard Filter (the footer's callback does nothing then; these are its entry points).
   Plotly: the click balloon's "Show Detail" item (a dashboard passes no Keep Only / Exclude, so it is the only one). */
body.exp-pe-mode-edit #viz-balloon .balloon-header .balloon-header-item:has(.fa-table) {
  display: none;
}
/* Pivot / Summary table: a cell is not a link (not while a column edge shows its resize cursor, .body-resize-hover). */
body.exp-pe-mode-edit .pivot-view:not(.body-resize-hover) .pivot-table-frame .pivot-row .pivot-cell.clickable {
  cursor: default;
}
body.exp-pe-mode-edit .pivot-view .pivot-table-frame .pivot-row .pivot-cell.clickable:hover {
  background-color: inherit !important;
}
/* Map: a shape is not clickable (it shows the map's own grab cursor; hover highlight and info box stay). */
body.exp-pe-mode-edit .leaflet-container .leaflet-interactive {
  cursor: inherit;
}

/* Style for green button */
a.btn.btn-primary {
  color: #fff;
  background-color: #00ab6d;
  border-color: #00ab6d;
  text-decoration: none;
  font-weight:700;
  padding:14px;
  font-size:16px;
  line-height:100%;
  border:none;
  border-radius:3px;
}

a.btn.btn-primary:hover,  
a.btn.btn-primary:active,  
a.btn.btn-primary:visited
{
  text-decoration: none;
  background-color: #00ab6d;
  border-color: #00ab6d;
}

/* Microtip customization */
[aria-label][role~="tooltip"]::after {
  line-height: 17px;
}

/* Sankey Network specific fix.*/
.sankeyNetwork.html-widget.html-widget-static-bound {
  overflow-y: hidden;
}

/* Adjustment for PDF printing */
@media print {
  @page { 
    margin: 0;
  }

  body {
    /* Hide tabs if exists. */
    padding-top: 8px!important;
  }
  /* Hide tabs if exists. */
  body .navbar-fixed-top {
    display: none!important;
  }

  /* Force the text and background color to be printed. */
  * {
    -webkit-print-color-adjust: exact; /* Chrome, Edge, Safari */
    print-color-adjust: exact;         /* Standard */
  }
  /* Hide Number chart title */
  body .single-value.chart-wrapper-flex > .chart-title {
    display: none;
  }
  /* Hide extra bottom border in Pivot Table */
  body .viz-container.markdown-viz-container .pivot-body-view .pivot-table-frame.pivot-table-body-frame .pivot-row .pivot-cell.header.row-header {
    border-bottom: none;
  }
  /* Hide Leaflet control container */
  body .viz-container.markdown-viz-container .leaflet-control-container {
    display: none;
  }
  a[href]:after { content: none !important; }

  blockquote {
    border: none !important;
    border-left: 4px solid #00ab6d !important;
    padding-left: 16px !important;
    margin: 16px 0 !important;
    color: #333333 !important;
    background: transparent !important;
  }
  .dashboard-page-wrapper.tab-pane {
    break-inside: avoid;
    page-break-inside: avoid;
  }
  /* Show all dashboard pages in browser print preview (not only active tab). */
  .tab-content > .dashboard-page-wrapper.tab-pane {
    display: flex !important;
  }
  .tab-content > .dashboard-page-wrapper.tab-pane:not(:first-child) {
    break-before: page;
    page-break-before: always;
  }


}

/* Interactive Decision Tree chart (#34678). Mirror of src/style/dtree.scss --
   published notes/dashboards cannot load app SCSS, so the rules are duplicated
   here as plain CSS. Keep in sync with dtree.scss. */
.dtree-view{position:relative;overflow:hidden;width:100%;height:100%;background:#fff}
.dtree-view.dtree-panning{cursor:grabbing}
.dtree-canvas{position:relative;transform-origin:0 0}
.dtree-edges{position:absolute;left:0;top:0;pointer-events:none}
.dtree-node{position:absolute;background:#fff;border:1px solid #cbd2d9;border-radius:7px;box-shadow:0 1px 3px rgba(0,0,0,.10);overflow:hidden;font-size:18px;box-sizing:border-box}
.dtree-node.is-leaf{border-width:2px;border-color:#2F6FB8}
.dtree-node.dtree-clickable{cursor:pointer}
.dtree-node-header{position:relative;display:flex;align-items:center;color:#fff;font-weight:600;padding:5px 9px;font-size:18px;letter-spacing:.3px;text-shadow:0 1px 1px rgba(0,0,0,.25)}
.dtree-node-header .dtree-node-id{position:absolute;left:9px;top:50%;transform:translateY(-50%);font-weight:400;font-size:16px;line-height:1;padding:1px 5px;border:1px solid currentColor;border-radius:3px;background:rgba(127,127,127,0.14);opacity:0.85}
.dtree-node-header .dtree-pred{flex:1 1 auto;text-align:center;padding:0 26px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtree-node-header .dtree-collapse-caret{position:absolute;right:9px;top:50%;transform:translateY(-50%);cursor:pointer;font-weight:400;font-size:16px;line-height:1;padding:1px 5px;border:1px solid currentColor;border-radius:3px;background:rgba(127,127,127,.14)}
.dtree-node-header .dtree-collapse-caret:hover{background:rgba(127,127,127,.28)}
.dtree-leaf-badge{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-weight:400;font-size:15px;opacity:.85;border:1px solid currentColor;border-radius:3px;padding:0 4px}
.dtree-thead{display:flex;align-items:baseline;padding:3px 9px 2px;color:#8a939b;font-size:16px;border-bottom:1px solid #eef1f4}
.dtree-thead .lb{flex:1 1 auto;min-width:0;margin-left:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtree-thead .nn{flex:0 0 62px;text-align:right}
.dtree-thead .pc{flex:0 0 62px;text-align:right}
.dtree-class-row{display:flex;align-items:center;padding:2px 9px}
.dtree-class-row .sw{width:9px;height:9px;border-radius:2px;margin-right:6px;flex:0 0 auto}
.dtree-class-row .lb{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtree-class-row .nn{flex:0 0 62px;text-align:right;font-variant-numeric:tabular-nums}
.dtree-class-row .pc{flex:0 0 62px;text-align:right;font-variant-numeric:tabular-nums;color:#57606a}
.dtree-class-row.dtree-class-more{color:#8a939b;padding-left:24px}
.dtree-node-bar{display:flex;height:12px;margin:5px 9px 4px;border-radius:3px;overflow:hidden;background:#eef1f4}
.dtree-node-bar span{display:block;height:100%}
.dtree-reg{padding:4px 9px 2px}
.dtree-reg .dtree-reg-row{display:flex;align-items:baseline;padding:1px 0}
.dtree-reg .dtree-reg-row .lb{flex:1 1 auto;color:#57606a}
.dtree-reg .dtree-reg-row .vv{flex:0 0 auto;font-variant-numeric:tabular-nums}
.dtree-node-dist{position:relative;display:flex;align-items:flex-end;height:34px;margin:5px 0 3px;gap:1px}
.dtree-node-dist .dtree-dist-bar{flex:1 1 0;min-height:1px;background:#6aa0c8;border-radius:1px 1px 0 0}
.dtree-node-dist .dtree-dist-bar.dtree-dist-empty{min-height:0;background:transparent}
.dtree-node-dist .dtree-dist-mean{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:#d1495b;pointer-events:none}
.dtree-node-footer{padding:3px 9px 6px;font-size:17px;color:#57606a;border-top:1px solid #eef1f4}
.dtree-edge-label{position:absolute;transform:translate(-50%,-50%);pointer-events:none;text-align:center}
.dtree-edge-label span{background:#fff;border:1px solid #d0d7de;border-radius:4px;padding:1px 6px;font-size:18px;color:#334;white-space:nowrap;pointer-events:auto;cursor:pointer}
.dtree-split-stat-label{position:absolute;transform:translate(-50%,-50%);pointer-events:none;text-align:center}
.dtree-split-stat-label span{display:block;background:#fff;border-radius:3px;padding:0 4px;white-space:nowrap}
.dtree-split-stat-label .dtree-split-var{font-size:16px;font-weight:600;color:#334}
.dtree-split-stat-label .dtree-split-stat{font-size:15px;color:#6e7781}
.dtree-target-title{position:absolute;font-size:16px;line-height:20px;font-weight:600;color:#334;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.dtree-target-title.is-truncated{pointer-events:auto;cursor:default}
.dtree-message{padding:24px;color:#57606a;font-size:13px;text-align:center}
.dtree-tooltip{position:absolute;z-index:20;max-width:320px;background:rgba(31,41,55,.8);color:#f3f4f6;border-radius:6px;padding:8px 10px;font-size:12px;line-height:1.5;box-shadow:0 4px 14px rgba(0,0,0,.28);pointer-events:none}
.dtree-tooltip .dtree-tt-sec+.dtree-tt-sec{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.15)}
.dtree-tooltip .dtree-tt-head{font-weight:700;margin-bottom:2px}
.dtree-tooltip .dtree-tt-path{margin-bottom:5px;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.15)}
.dtree-tooltip .dtree-tt-root{color:#9ca3af}
.dtree-tooltip .dtree-tt-stat{font-weight:600}
.dtree-tooltip .dtree-tt-class{color:#cbd5e1}
.dtree-tooltip.dtree-tt-pinned{pointer-events:auto}
.dtree-tooltip .dtree-tt-copyable{display:flex;align-items:flex-start;gap:6px}
.dtree-tooltip .dtree-tt-cond-text{flex:1 1 auto}
.dtree-tooltip .dtree-tt-copy-icon{flex:0 0 auto;width:14px;height:14px;margin-top:1px;cursor:pointer;background-color:transparent;background-repeat:no-repeat;background-size:13px;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIyIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBmaWxsPSIjZjNmNGY2IiBkPSJNMjcyIDQxNkMyNjMuMiA0MTYgMjU2IDQyMy4yIDI1NiA0MzJWNDQ4YzAgMTcuNjctMTQuMzMgMzItMzIgMzJINjRjLTE3LjY3IDAtMzItMTQuMzMtMzItMzJWMTkyYzAtMTcuNjcgMTQuMzMtMzIgMzItMzJoMTEyQzE4NC44IDE2MCAxOTIgMTUyLjggMTkyIDE0NEMxOTIgMTM1LjIgMTg0LjggMTI4IDE3NiAxMjhINjMuOTljLTM1LjM1IDAtNjQgMjguNjUtNjQgNjRsLjAwOTggMjU2QzAgNDgzLjMgMjguNjUgNTEyIDY0IDUxMmgxNjBjMzUuMzUgMCA2NC0yOC42NSA2NC02NHYtMTZDMjg4IDQyMy4yIDI4MC44IDQxNiAyNzIgNDE2ek01MDIuNiA4Ni42M2wtNzcuMjUtNzcuMjVDNDE5LjQgMy4zNzEgNDExLjIgMCA0MDIuNyAwSDI4OEMyNTIuNyAwIDIyNCAyOC42NSAyMjQgNjR2MjU2YzAgMzUuMzUgMjguNjUgNjQgNjQgNjRoMTYwYzM1LjM1IDAgNjQtMjguNjUgNjQtNjRWMTA5LjNDNTEyIDEwMC44IDUwOC42IDkyLjYzIDUwMi42IDg2LjYzek00MTYgNDUuMjVMNDY2LjcgOTZINDE2VjQ1LjI1ek00ODAgMzIwYzAgMTcuNjctMTQuMzMgMzItMzIgMzJoLTE2MGMtMTcuNjcgMC0zMi0xNC4zMy0zMi0zMlY2NGMwLTE3LjY3IDE0LjMzLTMyIDMyLTMyaDk2bC4wMDI2IDY0YzAgMTcuNjcgMTQuMzMgMzIgMzIgMzJINDgwVjMyMHoiLz48L3N2Zz4=")}
.dtree-tooltip .dtree-tt-copy-icon.copied{cursor:default;background-size:14px;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjZjNmNGY2IiBkPSJNMTczLjg5OCA0MzkuNDA0bC0xNjYuNC0xNjYuNGMtOS45OTctOS45OTctOS45OTctMjYuMjA2IDAtMzYuMjA0bDM2LjIwMy0zNi4yMDRjOS45OTctOS45OTggMjYuMjA3LTkuOTk4IDM2LjIwNCAwTDE5MiAzMTIuNjkgNDMyLjA5NSA3Mi41OTZjOS45OTctOS45OTcgMjYuMjA3LTkuOTk3IDM2LjIwNCAwbDM2LjIwMyAzNi4yMDRjOS45OTcgOS45OTcgOS45OTcgMjYuMjA2IDAgMzYuMjA0bC0yOTQuNCAyOTQuNDAxYy05Ljk5OCA5Ljk5Ny0yNi4yMDcgOS45OTctMzYuMjA0LS4wMDF6Ii8+PC9zdmc+")}
.dtree-zoom-controls{position:absolute;left:12px;bottom:12px;z-index:15;display:flex;flex-direction:column;gap:4px}
.dtree-zoom-controls .dtree-zoom-btn{width:30px;height:30px;border:1px solid #d0d7de;border-radius:6px;background:#fff;color:#334;font-size:14px;line-height:1;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.10);padding:0}
.dtree-zoom-controls .dtree-zoom-btn:hover{border-color:#00ab6d;color:#00ab6d}
.dtree-zoom-controls .dtree-zoom-reset{font-size:11px}
.dtree-sync-axis{position:absolute;top:10px;right:12px;z-index:15;display:inline-flex;align-items:center;gap:5px;margin:0;font-size:12px;font-weight:normal;line-height:1;color:#334;cursor:pointer;user-select:none}
.dtree-sync-axis input[type="checkbox"]{cursor:pointer;margin:0;vertical-align:middle;flex:0 0 auto}
.dendrogram-view{position:relative;width:100%;height:100%;min-height:180px;overflow:hidden;background:#fff;color:#263238;font-family:var(--exp-content-font, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif)}
.dendrogram-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;padding:0 10px 10px;border-bottom:1px solid #eceff1;background:#fff;position:relative;z-index:2}
.dendrogram-zoom-controls{margin-left:auto}
.dendrogram-controls{display:flex;align-items:center;font-size:11px}
.dendrogram-cluster-controls{gap:7px;color:#4b5563}
.dendrogram-controls label{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:normal;margin:0}
.dendrogram-controls input[type="range"]{width:92px;height:11px;margin:0;-webkit-appearance:none;appearance:none;background:transparent}
.dendrogram-controls input[type="range"]::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(to right, #00ab6d 0%, #00ab6d var(--val, 0%), #dfe3e0 var(--val, 0%), #dfe3e0 100%)}
.dendrogram-controls input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:11px;height:11px;margin-top:-4px;border-radius:50%;background:#00ab6d;border:none;cursor:pointer}
.dendrogram-controls output{display:inline-flex;align-items:center;min-width:12px;padding:0;margin:0;text-align:right;font-size:11px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;color:#1b2320}
.dendrogram-stepper{display:inline-flex}
.dendrogram-stepper button{width:20px;height:22px;padding:0;border:1px solid #d0d7de;background:#fff;color:#334;font-size:12px;line-height:1;cursor:pointer}
.dendrogram-stepper button:first-child{border-radius:5px 0 0 5px}
.dendrogram-stepper button:last-child{border-radius:0 5px 5px 0;border-left-width:0}
.dendrogram-mode-controls{gap:6px}
.dendrogram-zoom-controls{gap:4px}
.dendrogram-zoom-btn{width:24px;height:22px;padding:0;border:1px solid #d0d7de;border-radius:5px;background:#fff;color:#334;font-size:12px;line-height:1;cursor:pointer}
.dendrogram-segmented{display:inline-flex}
.dendrogram-segmented button{display:inline-flex;align-items:center;justify-content:center;height:22px;min-width:26px;padding:0 7px;border:1px solid #d0d7de;background:#fff;color:#6b7280;font-family:inherit;font-size:11px;line-height:1;cursor:pointer}
.dendrogram-segmented button + button{border-left-width:0}
.dendrogram-segmented button:first-child{border-radius:5px 0 0 5px}
.dendrogram-segmented button:last-child{border-radius:0 5px 5px 0}
.dendrogram-segmented button[aria-pressed="true"]{background:#00ab6d;border-color:#00ab6d;color:#fff}
.dendrogram-segmented button:not([aria-pressed="true"]):hover{border-color:#00ab6d;color:#00ab6d}
.dendrogram-segmented svg{display:block}
.dendrogram-controls button:not(.dendrogram-segmented button):hover{border-color:#00ab6d;color:#00ab6d}
.dendrogram-canvas{position:relative;transform-origin:0 0}
.dendrogram-svg{display:block;overflow:visible}
.dendro-branches path{vector-effect:non-scaling-stroke;stroke-linejoin:round}
.dendro-region{pointer-events:none}
.dendro-hit{stroke:transparent;stroke-width:12px;cursor:pointer}
.dendro-labels text{fill:#374151;font-size:11px;dominant-baseline:central}
.dendro-cutline{stroke:#6b7280;stroke-width:1;stroke-dasharray:4 3;pointer-events:none}
.dendro-axis-label{fill:#6b7280;font-size:11px}
.dendro-axis line{stroke:#9ca3af;stroke-width:1}
.dendro-axis text{fill:#6b7280;font-size:10px}
.dendrogram-tooltip{position:absolute;z-index:20;max-width:320px;padding:8px 10px;border-radius:6px;background:rgba(31, 41, 55, 0.8);color:#f3f4f6;box-shadow:0 4px 14px rgba(0, 0, 0, 0.28);font-size:12px;line-height:1.5;pointer-events:none}
.dendrogram-tooltip strong{font-weight:700}
.dendrogram-view.dendrogram-dragging{cursor:grabbing}

/* #8667: dashboard image panel. The HTML is written by ONE function, DashboardImagePanelHtml.buildImagePanelHtml
   (src/js/util), for the Run, the in-place preview and the settings dialog, so this block is the whole look:
   fit, alignment and crop are pure CSS (no script) and work the same in a published page and a scheduled refresh.
   The .exp-image-box is the size container: its cqw / cqh are the panel's content box, padding excluded, so a
   crop box is sized against what is left. Alignment uses flex overflow alignment WITHOUT `safe`, so a cover
   image larger than the box overflows equally on both sides and the alignment picks the part that is cut.
   The selectors are specific enough to beat `.markdown-note-content img { max-width: 100% }`. The app-side copy
   for the dialog preview (src/style/dashboard-image-panel.scss) must stay identical: DashboardImagePanelCssParity.test.js. */
.exp-image-panel { box-sizing: border-box; width: 100%; height: 100%; overflow: hidden; }
.exp-image-panel.exp-image-empty { background: #f5f5f5; }
/* #39323: a parameterised URL is inline R, which MarkdownUtil wraps in <span data-r-code-id>. The span must be neither a
   flex item nor a containing block, so the crop element it holds is laid out as if it were the box's child. */
.exp-image-panel span[data-r-code-id] { display: contents; }
.exp-image-panel .exp-image-box {
  container-type: size; box-sizing: border-box; width: 100%; height: 100%; display: flex; overflow: hidden;
}
.exp-image-panel .exp-image-align-h-left { justify-content: flex-start; --exp-pos-x: left; }
.exp-image-panel .exp-image-align-h-center { justify-content: center; --exp-pos-x: center; }
.exp-image-panel .exp-image-align-h-right { justify-content: flex-end; --exp-pos-x: right; }
.exp-image-panel .exp-image-align-v-top { align-items: flex-start; --exp-pos-y: top; }
.exp-image-panel .exp-image-align-v-middle { align-items: center; --exp-pos-y: center; }
.exp-image-panel .exp-image-align-v-bottom { align-items: flex-end; --exp-pos-y: bottom; }
.exp-image-panel .exp-image-crop {
  position: relative; display: block; overflow: hidden; flex: none; min-width: 0; min-height: 0;
  aspect-ratio: var(--exp-crop-ar);
}
.exp-image-panel .exp-image-fit-contain .exp-image-crop { width: min(100cqw, calc(100cqh * var(--exp-crop-ar))); }
.exp-image-panel .exp-image-fit-cover .exp-image-crop { width: max(100cqw, calc(100cqh * var(--exp-crop-ar))); }
.exp-image-panel .exp-image-fit-fill .exp-image-crop { width: 100%; height: 100%; aspect-ratio: auto; }
.exp-image-panel .exp-image-fit-none .exp-image-crop { width: var(--exp-crop-natural-w); }
.exp-image-panel .exp-image-crop img {
  position: absolute; display: block; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
  object-fit: fill;
}
/* The natural size is unknown (a web image that could not be probed): the crop box fills the box and the browser
   fits the whole image with object-fit / object-position. */
.exp-image-panel .exp-image-nosize .exp-image-crop { width: 100%; height: 100%; aspect-ratio: auto; }
.exp-image-panel .exp-image-nosize .exp-image-crop img { object-position: var(--exp-pos-x, center) var(--exp-pos-y, center); }
.exp-image-panel .exp-image-nosize.exp-image-fit-contain .exp-image-crop img { object-fit: contain; }
.exp-image-panel .exp-image-nosize.exp-image-fit-cover .exp-image-crop img { object-fit: cover; }
.exp-image-panel .exp-image-nosize.exp-image-fit-fill .exp-image-crop img { object-fit: fill; }
.exp-image-panel .exp-image-nosize.exp-image-fit-none .exp-image-crop img { object-fit: none; }
.exp-image-panel a.exp-image-link, .exp-image-panel a.exp-image-link:hover, .exp-image-panel a.exp-image-link:focus {
  text-decoration: none; cursor: pointer;
}
/* The panel wrapper (the translator's `.image-panel`, the Number row item's `.image`): a hidden title's 14px / 13px
   text inset (.text-box above) and a Number's 3px shim offset belong to text and Numbers. The image panel's own
   padding is the only inset. */
.chart-wrapper.image-panel.text-box > .chart-stage { padding: 0; }
.chart-wrapper.image-panel.text-box > .chart-stage > .chart-shim { left: 0; right: 0; top: 0; bottom: 0; }
.single-value.dashboard-header-row-item.image > .chart-stage.chart-stage-flex > .chart-shim { left: 0; }

/* #39032: a Dashboard authored with multiple side-by-side columns
   (".dashboard-column-orientation" > ".dashboard-column", built by flexdashboard) has no
   breakpoint that collapses to one column on a narrow screen, so on a phone it renders too
   crushed to read. Stack the columns vertically instead; each panel keeps its own authored
   height, only the width / orientation changes.
   This lives here and NOT in note-mobile.css: a Dashboard links dashboard-base.css only
   (MarkdownPreprocessor._getDashboardCssFilePaths); note-mobile.css is added for Notes. */
@media only screen and (max-width : 766px) {
  .dashboard-column-orientation {
    flex-direction: column !important;
  }

  .dashboard-column-orientation > .dashboard-column {
    /* Desktop keeps "flex: 1 1 0%" (equal WIDTH split). Once the axis flips to vertical that
       same rule would equal-split a fixed HEIGHT instead and re-crush the panels, so grow
       must be 0 here: each stacked column sizes to its own content. */
    flex: 0 1 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
  }

  /* A "fill" layout gives every panel "flex: N N 0px" and relies on the page being exactly one
     screen high to turn that share into a height. Stacked columns are auto height, so each panel
     would collapse to its title row (a flat, unreadable chart). Give each a real height; grow 1
     so a taller column still shares its space. A Number keeps its own 100px, and a "scroll"
     layout already carries explicit inline heights, so neither is touched. */
  .vertical-layout-fill.dashboard-column-orientation > .dashboard-column > .chart-wrapper-flex:not(.single-value) {
    flex: 1 0 auto !important;
    min-height: 320px !important;
  }

  /* A fixed-viewport ("fill" vertical_layout) Dashboard holds ~N times the vertical content
     once its columns stack, so it must become a normal scrolling page instead of clipping the
     lower panels. */
  html, body {
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  .dashboard-container {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .dashboard-row-orientation {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}