@layer dreamviewTypography{
 html:root body .cp-controls{display:flex!important;align-items:center!important;gap:16px!important;flex-wrap:wrap!important;padding:5px 14px 14px!important;color:#24465f!important}
 html:root body .cp-controls button,html:root body .cp-chart select{background:#e8f1fc66!important;border:1px solid #6c8da94d!important;border-radius:8px!important;padding:7px 10px!important;color:inherit!important;font:600 12px/1.3 system-ui!important;cursor:pointer!important}
 html:root body .cp-locations{display:flex!important;gap:7px!important;flex-wrap:wrap!important}
 html:root body .cp-locations button[aria-pressed=false]{opacity:.4!important}
 html:root body .cp-locations i,html:root body .cp-tooltip i{display:inline-block!important;height:8px!important;width:8px!important;margin-right:6px!important;border-radius:50%!important}
 html:root body .cp-scope{font:400 11px/1.3 system-ui!important;opacity:.8!important}
 html:root body .cp-active>:not(:first-child):not(.cp-chart){display:none!important}
 html:root body .cp-active.dv-panel-monthly>:first-child>div:nth-child(2),html:root body .cp-active .dv-monthly-order-average,html:root body .cp-active>:first-child button{display:none!important}
 html:root body .cp-chart{width:100%!important;min-height:0!important;flex:1!important;color:#24465f!important;overflow:visible!important;padding-top:8px!important}
 html:root body .cp-horizontal{display:flex!important;flex-direction:column!important;gap:10px!important}
 html:root body .cp-group{display:grid!important;grid-template-columns:95px minmax(0,1fr)!important;gap:9px!important;border-bottom:1px solid #5f7b9322!important;padding-bottom:8px!important;align-items:center!important;outline-offset:3px!important}
 html:root body .cp-group:last-child{border-bottom:0!important}
 html:root body .cp-row-label{font:600 11px/1.25 system-ui!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;color:inherit!important}
 html:root body .cp-bars{display:flex!important;flex-direction:column!important;gap:4px!important;padding-right:47px!important}
 html:root body .cp-line{height:8px!important;position:relative!important;display:flex!important;align-items:center!important;gap:5px!important}
 html:root body .cp-bar{height:5px!important;display:block!important;border-radius:3px!important;min-width:0!important;flex-shrink:0!important}
 html:root body .cp-number{font:500 9px/1 system-ui!important;position:relative!important;white-space:nowrap!important;color:inherit!important}
 html:root body .cp-chart select{margin-bottom:10px!important}
 html:root body .cp-monthly{width:100%!important;height:100%!important;max-height:360px!important;min-height:220px!important;overflow:visible!important}
 html:root body .cp-axis{fill:currentColor!important;font:500 14px system-ui!important}
 html:root body .cp-grid{stroke:currentColor!important;opacity:.12!important}
 html:root body .cp-note{display:block!important;font:400 10px/1.3 system-ui!important;margin-top:3px!important;opacity:.8!important}
 html:root body .cp-active.dv-panel-products{min-height:480px!important}
 html:root body .cp-active.dv-panel-monthly{grid-template-rows:auto minmax(0,1fr)!important}
 html:root body .cp-tooltip{position:fixed!important;z-index:999999!important;padding:12px 15px!important;border-radius:10px!important;background:#edf3faff!important;color:#173b58!important;box-shadow:0 5px 25px #112b4c44!important;font:500 13px/1.8 system-ui!important;pointer-events:none!important}
 html:root body .cp-tooltip[hidden]{display:none!important}
 html:root body .cp-unavailable{font:400 13px/1.5 system-ui!important}
 html[data-theme=dark] body .cp-controls,html[data-theme=dark] body .cp-chart{color:#dce8f7!important}
 html[data-theme=dark] body .cp-controls button,html[data-theme=dark] body .cp-chart select{background:#25446566!important;border-color:#97b4d34d!important}
 html[data-theme=dark] body .cp-tooltip{background:#17324e!important;color:#e7effb!important}
 @media(max-width:900px){html:root body .cp-controls{display:none!important}}
}

@layer dreamviewTypography{html:root body #root .dv-chart-content>.cp-controls{grid-area:1 / 1 / 2 / -1!important;position:relative!important;z-index:3!important;min-height:38px!important}html:root.cp-on body #root .dv-chart-content{grid-template-rows:auto auto minmax(350px,1fr) minmax(520px,1fr)!important}html:root body .cp-number{font-size:11px!important}html:root body .cp-row-label{font-size:12px!important}}
@layer dreamviewTypography{
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 350px 570px!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .cp-active.dv-panel-products .dom-fill-row-list.dom-ranked-list{display:none!important}
html:root.cp-on body #root .cp-active .dom-section-subtitle,html:root.cp-on body #root .cp-active .dom-section-note,html:root.cp-on body #root .cp-active .dv-monthly-order-average{display:none!important}
html:root.cp-on body #root .cp-active .cp-chart{min-height:0!important;overflow:visible!important}
html:root.cp-on body #root .cp-active.dv-panel-monthly .cp-chart{height:calc(100% - 14px)!important}
html:root.cp-on body #root .cp-active .cp-group{padding-bottom:7px!important}
}
@layer dreamviewTypography{html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 430px 740px!important}}
@layer dreamviewTypography{
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto auto auto!important;align-items:start!important;min-height:0!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .cp-active{height:auto!important;min-height:0!important;max-height:none!important;align-self:start!important}
html:root.cp-on body #root .dv-panel-monthly.cp-active>.cp-chart{height:auto!important;min-height:0!important;max-height:none!important}
html:root.cp-on body #root .cp-monthly{display:block!important;width:100%!important;height:260px!important;min-height:220px!important;max-height:260px!important}
html:root.cp-on body #root .cp-horizontal{gap:7px!important}
html:root.cp-on body #root .cp-group{grid-template-columns:110px minmax(0,1fr)!important;padding-block:5px!important;min-height:35px!important}
html:root.cp-on body #root .cp-row-label{font-size:12px!important}
html:root.cp-on body #root .cp-number{font-size:11px!important}
html:root.cp-on body #root .cp-line{height:10px!important}
html:root.cp-on body #root .cp-bars{gap:5px!important}
html:root.cp-on body #root .cp-top-star{display:inline-block!important;margin-left:4px!important;color:#597794!important;font-size:11px!important}
html:root.cp-on[data-theme=dark] body #root .cp-top-star{color:#b3c9de!important}
}
@layer dreamviewTypography{
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-panel-monthly.cp-active{height:400px!important;min-height:400px!important}
html:root.cp-on body #root .dv-panel-monthly.cp-active>.cp-chart{display:flex!important;flex-direction:column!important;justify-content:flex-start!important;min-height:0!important;height:auto!important}
html:root.cp-on body #root .cp-monthly{flex:0 0 260px!important}
}

/* Keep the existing dashboard grid fully occupied and distribute comparisons across it. */
@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-chart-content.dv-chart-content{align-items:stretch!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .cp-active{align-self:stretch!important;height:100%!important;display:flex!important;flex-direction:column!important;box-sizing:border-box!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-panel-monthly.cp-active{height:100%!important;min-height:400px!important}
html:root.cp-on body #root .cp-active>.cp-chart{display:flex!important;flex-direction:column!important;flex:1 1 auto!important}
html:root.cp-on body #root .cp-horizontal{flex:1 1 auto!important;justify-content:space-around!important}
html:root.cp-on body #root .cp-group{flex:1 1 auto!important}
html:root.cp-on body #root .cp-monthly{flex:1 1 auto!important;height:100%!important;max-height:none!important;min-height:260px!important}
html:root.cp-on body #root .cp-zero .cp-bar{height:3px!important;opacity:.65!important}
}}

/* Compact comparison grid: do not let ten product groups stretch every chart. */
@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 320px 440px!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .cp-active{min-height:0!important;max-height:100%!important;overflow:visible!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-panel-monthly.cp-active{min-height:0!important}
html:root.cp-on body #root#root .cp-chart{padding-top:4px!important;min-height:0!important}
html:root.cp-on body #root#root .cp-horizontal{gap:3px!important;min-height:0!important}
html:root.cp-on body #root#root .cp-group{padding-block:3px!important;min-height:0!important}
html:root.cp-on body #root#root .cp-bars{gap:3px!important}
html:root.cp-on body #root#root .cp-line{height:7px!important}
html:root.cp-on body #root#root .cp-row-label{font-size:12px!important}
html:root.cp-on body #root#root .cp-number{font-size:11px!important}
html:root.cp-on body #root#root .cp-chart select{align-self:flex-start!important;width:auto!important;max-width:100%!important;padding:5px 9px!important;margin-bottom:6px!important}
html:root.cp-on body #root#root .cp-monthly{min-height:0!important}
}}

@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 340px 520px!important}
html:root.cp-on body #root#root .cp-line{height:12px!important}
html:root.cp-on body #root#root .cp-number{font-size:12px!important}
html:root.cp-on body #root#root .cp-row-label{font-size:12px!important}
html:root.cp-on body #root#root .cp-bar{height:6px!important}
}}

@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on body #root#root .cp-bar{height:8px!important;border-radius:4px!important}
html:root.cp-on body #root#root .dv-panel-order .cp-bars{gap:8px!important}
html:root.cp-on body #root#root .dv-panel-order .cp-line{height:22px!important;gap:8px!important}
html:root.cp-on body #root#root .dv-panel-order .cp-bar{height:12px!important;border-radius:6px!important}
html:root.cp-on body #root#root .dv-panel-order .cp-number{font-size:13px!important;font-weight:600!important}
html:root.cp-on body #root#root .cp-small .cp-bar{height:7px!important;width:7px!important;border-radius:50%!important;flex:0 0 7px!important}
html:root.cp-on body #root#root .cp-zero .cp-bar{height:3px!important;width:3px!important;flex:0 0 3px!important}
}}

@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on body #root#root .cp-vertical-wrap{display:flex!important;flex:1 1 auto!important;min-height:0!important;width:100%!important}
html:root.cp-on body #root#root .cp-vertical-wrap.cp-vertical-pair{display:grid!important;grid-template-rows:minmax(0,1fr) minmax(0,1fr)!important;gap:12px!important}
html:root.cp-on body #root#root .cp-vertical{display:block!important;flex:1 1 auto!important;width:100%!important;height:100%!important;min-height:0!important;overflow:visible!important;color:inherit!important}
html:root.cp-on body #root#root .cp-v-axis{font:500 10px system-ui!important;fill:currentColor!important}
html:root.cp-on body #root#root .cp-v-label{font:600 11px system-ui!important;fill:currentColor!important}
html:root.cp-on body #root#root .cp-v-amount{font:600 11px system-ui!important;fill:currentColor!important}
html:root.cp-on body #root#root .cp-v-star{font:600 11px system-ui!important;fill:#597794!important}
html:root.cp-on[data-theme=dark] body #root#root .cp-v-star{fill:#b3c9de!important}
}}

@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on body #root#root .dv-panel-products.cp-active>:first-child{display:none!important}
html:root.cp-on body #root#root .cp-location-tops{display:flex!important;flex-direction:column!important;flex:1 1 auto!important;gap:10px!important;min-height:0!important}
html:root.cp-on body #root#root .cp-metrics-title{font-size:18px!important;font-weight:750!important;line-height:1.2!important;margin:0 0 2px!important;color:inherit!important}
html:root.cp-on body #root#root .cp-location-top{flex:1 1 auto!important;border-bottom:1px solid #7b92ad33!important;padding:4px 0 10px!important;min-height:0!important}
html:root.cp-on body #root#root .cp-location-top:last-child{border-bottom:0!important;padding-bottom:0!important}
html:root.cp-on body #root#root .cp-location-top h3{display:flex!important;align-items:center!important;gap:7px!important;font:650 14px/1.3 system-ui!important;margin:0 0 7px!important;color:inherit!important}
html:root.cp-on body #root#root .cp-location-top h3 i{display:inline-block!important;width:8px!important;height:8px!important;border-radius:50%!important;background:var(--location-color)!important}
html:root.cp-on body #root#root .cp-location-top dl{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)!important;gap:7px 12px!important;margin:0!important}
html:root.cp-on body #root#root .cp-location-top dl>div{min-width:0!important}
html:root.cp-on body #root#root .cp-location-top dt{font:400 10px/1.3 system-ui!important;opacity:.8!important;margin:0 0 1px!important}
html:root.cp-on body #root#root .cp-location-top dd{font:650 12px/1.3 system-ui!important;margin:0!important;overflow-wrap:anywhere!important}
}}

/* One horizontal metric row per location, matching the focused-card footer. */
@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 340px 400px auto!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root#root .dv-panel-monthly{grid-area:4 / 2 / 5 / 4!important}
html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root#root .dv-panel-products{grid-area:5 / 1 / 6 / 4!important;height:auto!important;max-height:none!important}
html:root.cp-on body #root#root .cp-location-tops{gap:0!important}
html:root.cp-on body #root#root .cp-metrics-title{margin-bottom:10px!important}
html:root.cp-on body #root#root .cp-location-top{display:grid!important;grid-template-columns:130px repeat(4,minmax(0,1fr))!important;align-items:center!important;gap:14px!important;flex:0 0 auto!important;min-height:48px!important;padding:10px 0!important}
html:root.cp-on body #root#root .cp-location-top h3{margin:0!important;font-size:14px!important}
html:root.cp-on body #root#root .cp-location-top dl{display:contents!important}
html:root.cp-on body #root#root .cp-location-top dl>div{display:flex!important;align-items:baseline!important;gap:7px!important;flex-wrap:wrap!important}
html:root.cp-on body #root#root .cp-location-top dt{font-size:12px!important;margin:0!important;white-space:nowrap!important}
html:root.cp-on body #root#root .cp-location-top dd{font-size:14px!important;white-space:nowrap!important;overflow-wrap:normal!important}
}}

@layer dreamviewTypography {
 html:root body #root .cp-location-check{display:inline-flex;align-items:center;justify-content:center;flex:0 0 15px;width:15px;height:15px;border:1.5px solid currentColor;border-radius:3px;font:750 12px/1 system-ui}
 html:root body #root .cp-locations [aria-pressed=true] .cp-location-check{background:#254763;color:white;border-color:#254763}
 html:root[data-theme=dark] body #root .cp-locations [aria-pressed=true] .cp-location-check{background:#c5d2e5;color:#142d48;border-color:#c5d2e5}
}
@layer dreamviewTypography{html:root body #root .cp-locations [aria-pressed=true] .cp-location-check::before{content:'✓'}}

@layer dreamviewTypography {
 html:root body .cp-stack-legend{font:550 11px system-ui;fill:currentColor}
 html:root body .cp-stack-total{font:650 12px system-ui;fill:currentColor}
}
@layer dreamviewTypography{
 html:root body .cp-stack-month{font:650 12px system-ui;fill:currentColor}
 html:root body .cp-stack-location{font:550 9px system-ui;fill:currentColor}
}

/* Give the checkbox, location dot and label separate slots. */
@layer dreamviewTypography {
 html:root[data-theme] body #root#root#root .cp-controls .cp-locations button{display:inline-flex!important;align-items:center!important;gap:8px!important;white-space:nowrap!important}
 html:root[data-theme] body #root#root#root .cp-controls .cp-locations button>.cp-location-check{position:static!important;flex:0 0 15px!important;margin:0!important;box-sizing:border-box!important}
 html:root[data-theme] body #root#root#root .cp-controls .cp-locations button>i{position:static!important;flex:0 0 8px!important;margin:0!important}
}

@layer dreamviewTypography {
 html:root body .cp-tooltip-years{margin-top:6px!important}
 html:root body .cp-tooltip-location{font-weight:600!important}
 html:root body .cp-tooltip-year{display:flex!important;justify-content:space-between!important;gap:24px!important;padding-left:14px!important}
 html:root body .cp-tooltip-year>strong{font-weight:650!important;font-variant-numeric:tabular-nums!important}
}
@layer dreamviewTypography{
 html:root.cp-on body #root#root#root .cp-zero .cp-bar{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:10px!important;height:12px!important;flex:0 0 10px!important;background:transparent!important;border-radius:0!important;font:750 13px/1 system-ui!important}
}

/* Long category/account names read horizontally; retain shared location scales and exact details. */
@layer dreamviewTypography{@media(min-width:901px){
 html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto max(340px,var(--cp-comparison-height,340px)) 280px auto!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-horizontal{width:100%!important;gap:6px!important;justify-content:space-evenly!important;min-height:0!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-group{grid-template-columns:110px minmax(0,1fr)!important;gap:8px!important;padding-block:5px!important;min-height:0!important;flex:1 1 0!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-row-label{font-size:13px!important;line-height:1.3!important;white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-bars{gap:4px!important;padding-right:56px!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-line{height:14px!important;gap:6px!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-bar{height:8px!important;border-radius:4px!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-number{font-size:12px!important}
 html:root.cp-on body #root#root#root#root#root#root .dv-panel-monthly.cp-active{height:280px!important;min-height:280px!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-note{flex:0 0 auto!important}
}
@media(min-width:1800px){
 html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto max(clamp(340px,17vw,440px),var(--cp-comparison-height,340px)) clamp(280px,13vw,340px) auto!important}
 html:root.cp-on body #root#root#root#root#root#root .dv-panel-monthly.cp-active{height:clamp(280px,13vw,340px)!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-group{grid-template-columns:145px minmax(0,1fr)!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-row-label{font-size:16px!important}
 html:root.cp-on body #root#root#root#root#root#root .cp-number{font-size:14px!important}
}}

/* Expanded locations need actual content space, including a clear share footer. */
@layer dreamviewTypography{@media(min-width:1800px){
 html:root.cp-on:has(#dv-location-cards[data-visible-locations="2"]) body #root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto max(400px,var(--cp-comparison-height,340px)) clamp(280px,13vw,340px) auto!important}
 html:root body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"]>.dv-location-card{grid-template-rows:auto 100px minmax(0,1fr) auto!important;padding:16px!important;gap:10px!important}
 html:root body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-location-copy b{font-size:48px!important}
 html:root body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-location-copy small{font-size:16px!important}
 html:root body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-card-ranking li{font-size:16px!important}
 html:root body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-visible-city{font-size:12px!important}
 html:root body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-focused-destination-value{font-size:14px!important}
 html:root body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-destinations-heading{font-size:14px!important}
}}

/* Three locations use equal full-width rows instead of squeezing names into half cards. */
@layer dreamviewTypography{@media(min-width:901px){
 html:root.cp-on:has(#dv-location-cards[data-visible-locations="3"]) body #root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 480px 280px auto!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"]{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:repeat(3,minmax(0,1fr))!important;gap:10px!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"]>.dv-location-card{grid-area:auto!important;justify-self:stretch!important;width:100%!important;grid-template-columns:minmax(100px,.9fr) minmax(110px,1.1fr) 64px!important;grid-template-rows:24px minmax(0,1fr) 22px!important;padding:10px 12px!important;gap:3px 8px!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-location-heading{grid-area:1 / 1 / 2 / 3!important;padding:0!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-location-copy{grid-area:2 / 1!important;text-align:center!important;gap:2px!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-card-destinations{display:flex!important;flex-direction:column!important;grid-area:2 / 2!important;align-self:center!important;gap:3px!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-destinations-heading{grid-area:auto!important;white-space:nowrap!important;font-size:12px!important;margin:0!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-card-ranking{grid-area:auto!important;gap:3px!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-card-ranking li{white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;font-size:13px!important;line-height:1.25!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-location-artwork{grid-area:1 / 3 / 3 / 4!important;width:64px!important;height:86px!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-region-shape{width:64px!important;height:86px!important}
 html:root.cp-on body #root#root#root#root#root#root #dv-location-cards[data-visible-locations="3"] .dv-location-share{grid-area:3 / 1 / 4 / 4!important;position:static!important;margin:0!important;min-height:0!important}
 /* Order-class comparisons can include a separate DI row. Reserve its full set of bars. */
 html:root.cp-on body #root#root#root#root#root#root .dv-panel-order .cp-group{min-height:max-content!important}
}}

/* Pair the time comparison with location details, matching the dashboard's three columns. */
@layer dreamviewTypography{@media(min-width:901px){
 html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root#root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto max(340px,var(--cp-comparison-height,340px)) var(--cp-detail-height,320px)!important}
 html:root.cp-on:has(#dv-location-cards[data-visible-locations="3"]) body #root#root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 480px var(--cp-detail-height,320px)!important}
 html:root.cp-on body #root#root#root#root#root#root#root .dv-panel-monthly.cp-active{grid-area:4 / 2 / 5 / 3!important;height:100%!important;min-height:0!important}
 html:root.cp-on body #root#root#root#root#root#root#root .dv-panel-products.cp-active{grid-area:4 / 3 / 5 / 4!important;height:100%!important;max-height:none!important;align-self:stretch!important}
 html:root.cp-on body #root#root#root#root#root#root#root .cp-location-tops{height:100%!important;justify-content:space-evenly!important}
 html:root.cp-on body #root#root#root#root#root#root#root .cp-location-top{display:block!important;flex:1 1 auto!important;min-height:0!important;padding-block:8px!important}
 html:root.cp-on body #root#root#root#root#root#root#root .cp-location-top h3{margin-bottom:8px!important}
 html:root.cp-on body #root#root#root#root#root#root#root .cp-location-top dl{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px 10px!important}
 html:root.cp-on body #root#root#root#root#root#root#root .cp-location-top dl>div{display:block!important}
 html:root.cp-on body #root#root#root#root#root#root#root .cp-location-top dt{font-size:11px!important;white-space:normal!important;margin-bottom:3px!important}
 html:root.cp-on body #root#root#root#root#root#root#root .cp-location-top dd{font-size:12px!important;white-space:normal!important;overflow-wrap:anywhere!important}
}
@media(min-width:1800px){
 html:root.cp-on[data-dv-sales-layout="desktop"][data-dv-layout="overview"][data-dv-spacing="on"] body #root#root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto max(400px,var(--cp-comparison-height,340px)) var(--cp-detail-height,320px)!important}
 html:root.cp-on:has(#dv-location-cards[data-visible-locations="3"]) body #root#root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto auto 480px var(--cp-detail-height,320px)!important}
}}
@layer dreamviewTypography{
 html:root body #root .cp-locations button[aria-pressed=true]:disabled{opacity:1!important;cursor:default!important}
 html:root[data-theme] body .dv-location-compare-launch:disabled{opacity:.55!important;cursor:not-allowed!important}
}


/* Preserve the location-row presentation when the metrics card sits beside the chart. */
@layer dreamviewTypography{@media(min-width:901px){
 html:root.cp-on body #root#root#root#root#root#root#root#root .cp-location-tops{justify-content:flex-start!important;gap:0!important}
 html:root.cp-on body #root#root#root#root#root#root#root#root .cp-location-top{display:flex!important;flex-wrap:wrap!important;align-content:center!important;align-items:baseline!important;gap:9px 16px!important;padding:12px 0!important;flex:1 1 0!important}
 html:root.cp-on body #root#root#root#root#root#root#root#root .cp-location-top h3{flex:0 0 100%!important;margin:0!important}
 html:root.cp-on body #root#root#root#root#root#root#root#root .cp-location-top dl{display:contents!important}
 html:root.cp-on body #root#root#root#root#root#root#root#root .cp-location-top dl>div{display:flex!important;align-items:baseline!important;gap:6px!important;flex:1 1 145px!important;flex-wrap:wrap!important}
 html:root.cp-on body #root#root#root#root#root#root#root#root .cp-location-top dt{font-size:11px!important;white-space:nowrap!important;margin:0!important}
 html:root.cp-on body #root#root#root#root#root#root#root#root .cp-location-top dd{font-size:12px!important;white-space:nowrap!important;overflow-wrap:normal!important}
}}

/* Comparison prioritizes location details above account comparisons, without global KPIs. */
@layer dreamviewTypography{
 html:root.cp-on body #root#root#root#root#root#root#root#root#root .dv-kpi-row{display:none!important}
 @media(min-width:901px){
  html:root.cp-on body #root#root#root#root#root#root#root#root#root .dv-panel-products.cp-active{grid-area:3 / 3 / 4 / 4!important;height:100%!important;min-height:0!important;max-height:none!important}
  html:root.cp-on body #root#root#root#root#root#root#root#root#root .dv-panel-account.cp-active{grid-area:4 / 3 / 5 / 4!important;height:100%!important;min-height:0!important;max-height:none!important}
 }
}

/* Redistribute the space freed by hidden KPIs using the parent scroll pane height. */
@layer dreamviewTypography{@media(min-width:901px){
 html:root.cp-on[data-dv-sales-layout="desktop"] body #root#root#root#root#root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto 0 max(340px,var(--cp-comparison-height,340px),calc((var(--cp-viewport-height,710px) - var(--cp-content-reserve,60px))*.52)) max(var(--cp-detail-height,320px),calc((var(--cp-viewport-height,710px) - var(--cp-content-reserve,60px))*.48))!important}
 html:root.cp-on:has(#dv-location-cards[data-visible-locations="3"]) body #root#root#root#root#root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto 0 max(480px,calc((var(--cp-viewport-height,710px) - var(--cp-content-reserve,60px))*.52)) max(var(--cp-detail-height,320px),calc((var(--cp-viewport-height,710px) - var(--cp-content-reserve,60px))*.48))!important}
}}



/* Comparison tracks retain readable thickness as their cards gain room. */
@layer dreamviewTypography{@media(min-width:901px){
 html:root.cp-on body #root#root#root#root#root#root#root#root#root#root .cp-line:not(.cp-zero):not(.cp-small) .cp-bar{height:12px!important;border-radius:6px!important}
}}
/* Compact desktops scale the same comparison layout before requiring overflow. */
@layer dreamviewTypography{@media(min-width:901px){
 html:root.cp-on[data-cp-compact="true"]:has(#dv-location-cards[data-visible-locations="2"]) body #root#root#root#root#root#root#root#root#root#root#root .dv-chart-content.dv-chart-content{grid-template-rows:auto 0 max(250px,calc((var(--cp-viewport-height,610px) - var(--cp-content-reserve,60px))*.52)) max(260px,calc((var(--cp-viewport-height,610px) - var(--cp-content-reserve,60px))*.48))!important}
 html:root.cp-on[data-cp-compact="true"] body #root#root#root#root#root#root#root#root#root#root#root .cp-line{height:12px!important}
 html:root.cp-on[data-cp-compact="true"] body #root#root#root#root#root#root#root#root#root#root#root .cp-line:not(.cp-zero):not(.cp-small) .cp-bar{height:10px!important}
 html:root.cp-on[data-cp-compact="true"] body #root#root#root#root#root#root#root#root#root#root#root .cp-group{padding-bottom:4px!important}
 html:root.cp-on[data-cp-compact="true"] body #root#root#root#root#root#root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"]>.dv-location-card{grid-template-rows:auto 65px minmax(0,1fr) auto!important;gap:8px!important;padding:12px!important}
 html:root.cp-on[data-cp-compact="true"] body #root#root#root#root#root#root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-location-copy b{font-size:32px!important}
 html:root.cp-on[data-cp-compact="true"] body #root#root#root#root#root#root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-visible-city{display:none!important}
 html:root.cp-on[data-cp-compact="true"] body #root#root#root#root#root#root#root#root#root#root#root #dv-location-cards[data-visible-locations="2"] .dv-card-ranking li{font-size:13px!important;min-height:20px!important}
}}

@layer dreamviewTypography{html:root body #root .cp-minimum-note{font:500 12px/1.35 system-ui!important;color:inherit!important;border:1px solid #819bb966!important;border-radius:6px!important;padding:4px 8px!important}html:root body #root .cp-minimum-note[hidden]{display:none!important}}

@layer dreamviewTypography{@media(min-width:901px){
html:root.cp-on[data-dv-sales-layout="desktop"]:not([data-cp-compact="true"]) body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .dv-chart-content{--cp-roomy-bar-size:clamp(12px,calc((var(--cp-viewport-height,710px) - 200px)/(24 * var(--cp-selected-count,2))),16px)}
html:root.cp-on[data-dv-sales-layout="desktop"]:not([data-cp-compact="true"]) body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-line{height:calc(var(--cp-roomy-bar-size) + 2px)!important}
html:root.cp-on[data-dv-sales-layout="desktop"]:not([data-cp-compact="true"]) body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-line:not(.cp-zero):not(.cp-small) .cp-bar{height:var(--cp-roomy-bar-size)!important;border-radius:8px!important}
}}

@layer dreamviewTypography{
html:root.cp-on body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-prior-key{display:inline-flex!important;align-items:center!important;gap:5px!important;font:500 12px/1.3 system-ui!important;color:inherit!important;margin-left:auto!important;margin-right:30px!important;white-space:nowrap!important}
html:root.cp-on body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-prior-key i{width:11px!important;height:11px!important;border-radius:2px!important;background:#889fb9!important;display:inline-block!important;flex:none!important}
html:root.cp-on body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-overlay-track{position:relative!important;display:block!important;flex:0 0 100%!important;min-width:0!important;height:var(--cp-roomy-bar-size,12px)!important}
html:root.cp-on body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-overlay-year{position:absolute!important;top:50%!important;transform:translateY(-50%)!important;min-width:1px!important}
html:root.cp-on body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-overlay-zero{position:absolute!important;top:50%!important;transform:translate(-50%,-50%)!important;font:700 12px/1 system-ui!important}
html:root.cp-on body #root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root#root .cp-overlay-baseline{position:absolute!important;top:0!important;bottom:0!important;border-left:1px solid currentColor!important;opacity:.3!important}
}