.dn-visual-builder {
	--dn-builder-primary: #05509c;
	--dn-builder-secondary: #2586db;
	--dn-builder-text: #334155;
	--dn-builder-muted: #64748b;
	--dn-builder-border: #dbe8f4;
	--dn-builder-surface: #fff;
	--dn-builder-soft: #f6faff;
	container: dn-builder / inline-size;
	width: 100%;
	color: var(--dn-builder-text);
	font: 14px/1.45 Inter, Arial, sans-serif;
	margin: 20px 0;
}

.dn-visual-builder *, .dn-visual-builder *::before, .dn-visual-builder *::after { box-sizing: border-box; }
.dn-builder-loading, .dn-builder-error, .dn-builder-empty { padding: 20px; border: 1px solid var(--dn-builder-border); border-radius: 10px; background: var(--dn-builder-soft); text-align: center; }
.dn-builder-error { border-color: #fecaca; background: #fef2f2; color: #991b1b; }
.dn-builder-controls {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	align-items: start;
	gap: 10px;
	margin-bottom: 16px;
	padding: 12px;
	border: 1px solid var(--dn-builder-border);
	border-radius: 10px;
	background: var(--dn-builder-soft);
}

.dn-builder-primary-controls { display: contents; }
.dn-visual-builder label.dn-builder-control { display: grid; grid-column: span 1; gap: 5px; min-width: 0; margin: 0; padding: 0; border: 0; background: transparent; }
.dn-builder-control-period { grid-column: span 2; }
.dn-builder-control-label { color: var(--dn-builder-muted); font-size: 12px; font-weight: 700; letter-spacing: .02em; }
.dn-visual-builder .dn-builder-control > select, .dn-visual-builder .dn-builder-category-picker > summary {
	display: block;
	width: 100%;
	height: 48px;
	min-height: 48px;
	max-height: 48px;
	margin: 0;
	padding: 10px 36px 10px 12px;
	border: 1px solid #b8cee2;
	border-radius: 7px;
	background: #fff;
	box-shadow: none;
	color: var(--dn-builder-text);
	font: 15px/1.35 Inter, Arial, sans-serif;
	letter-spacing: normal;
	text-transform: none;
}
.dn-visual-builder .dn-builder-control > select {
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2305509c' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: right 14px center;
	background-repeat: no-repeat;
	background-size: 10px 6px;
}

.dn-builder-category-picker { position: relative; }
.dn-visual-builder .dn-builder-category-picker > summary { display: flex; align-items: center; min-width: 0; cursor: pointer; list-style: none; }
.dn-builder-category-picker > summary::-webkit-details-marker { display: none; }
.dn-builder-category-picker > summary::after {
	position: absolute;
	top: 50%;
	right: 14px;
	width: 10px;
	height: 6px;
	content: '';
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2305509c' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px 6px no-repeat;
	transform: translateY(-50%);
}
.dn-builder-category-panel {
	position: absolute;
	z-index: 20;
	top: calc(100% + 6px);
	left: 0;
	width: min(300px, 85vw);
	padding: 10px;
	border: 1px solid var(--dn-builder-border);
	border-radius: 9px;
	background: #fff;
	box-shadow: 0 15px 38px rgba(15, 35, 70, .16);
}
.dn-builder-category-panel input[type="search"] { width: 100%; min-height: 36px; padding: 7px 9px; border: 1px solid #b8cee2; border-radius: 6px; }
.dn-builder-category-actions { display: flex; gap: 6px; margin: 8px 0; }
.dn-builder-category-actions button { padding: 5px 8px; border: 0; border-radius: 5px; background: var(--dn-builder-soft); color: var(--dn-builder-primary); font: inherit; cursor: pointer; }
.dn-builder-category-list { max-height: 235px; overflow: auto; }
.dn-builder-category-list label { display: block; padding: 5px 3px; }
.dn-builder-category-list label[hidden] { display: none; }

.dn-builder-range-group { display: grid; gap: 4px; min-width: 0; padding: 7px 11px 6px; border: 1px solid #b8cee2; border-radius: 7px; background: #fff; }
.dn-builder-dual-range { position: relative; width: 100%; height: 24px; }
.dn-builder-range-track { position: absolute; top: 9px; right: 0; left: 0; height: 6px; border-radius: 999px; }
.dn-builder-range-track { background: #dceeff; box-shadow: inset 0 1px 1px rgba(5, 80, 156, .08); }
/* The former ::after guide was intentionally removed; .dn-builder-range-track is the only base track. */
.dn-builder-range-fill { position: absolute; z-index: 1; top: 0; right: calc(100% - var(--dn-range-end, 100%)); left: var(--dn-range-start, 0%); height: 6px; border-radius: 999px; background: linear-gradient(90deg, #05509c, #4fb3ff); box-shadow: 0 1px 2px rgba(5, 80, 156, .2); }
.dn-builder-dual-range.is-snapshot .dn-builder-range-fill { left: 0; }
.dn-builder-dual-range.is-snapshot input[aria-label="Chart period"] { z-index: 5; }
.dn-builder-dual-range input[type="range"] { position: absolute; z-index: 3; top: 0; left: 0; width: 100%; height: 24px; margin: 0; padding: 0; border: 0; outline: 0; appearance: none; -webkit-appearance: none; background: transparent; pointer-events: none; }
.dn-builder-dual-range input[type="range"]:last-child { z-index: 4; }
.dn-builder-dual-range input[type="range"]::-webkit-slider-runnable-track { height: 5px; background: transparent; }
.dn-builder-dual-range input[type="range"]::-webkit-slider-thumb { width: 18px; height: 18px; margin-top: -6px; border: 2px solid #fff; border-radius: 50%; appearance: none; -webkit-appearance: none; background: #05509c; box-shadow: 0 0 0 1px #05509c, 0 2px 6px rgba(0, 63, 125, .25); cursor: grab; pointer-events: auto; }
.dn-builder-dual-range input[type="range"]:last-child::-webkit-slider-thumb { background: #4fb3ff; box-shadow: 0 0 0 1px #05509c, 0 2px 6px rgba(0, 63, 125, .25); }
.dn-builder-dual-range.is-snapshot input[type="range"]:last-child::-webkit-slider-thumb { background: #05509c; }
.dn-builder-dual-range input[type="range"]::-moz-range-track { height: 5px; background: transparent; }
.dn-builder-dual-range input[type="range"]::-moz-range-thumb { width: 16px; height: 16px; border: 2px solid #fff; border-radius: 50%; background: #05509c; box-shadow: 0 0 0 1px #05509c, 0 2px 6px rgba(0, 63, 125, .25); cursor: grab; pointer-events: auto; }
.dn-builder-dual-range input[type="range"]:last-child::-moz-range-thumb { background: #4fb3ff; box-shadow: 0 0 0 1px #05509c, 0 2px 6px rgba(0, 63, 125, .25); }
.dn-builder-dual-range.is-snapshot input[type="range"]:last-child::-moz-range-thumb { background: #05509c; }
.dn-builder-dual-range input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 3px #b8dcfa, 0 0 0 5px #2586db; }
.dn-builder-dual-range input[type="range"]:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 3px #b8dcfa, 0 0 0 5px #2586db; }
.dn-builder-range-output { color: var(--dn-builder-primary); font-size: 12px; font-weight: 700; line-height: 1.35; text-align: center; }
.dn-builder-single-period { display: flex; align-items: center; height: 48px; min-height: 48px; padding: 10px 12px; border: 1px solid #b8cee2; border-radius: 7px; background: #fff; color: var(--dn-builder-primary); font-weight: 700; }

.dn-builder-view-switcher { display: inline-flex; grid-column: 1 / -1; justify-self: end; justify-content: flex-end; width: auto; max-width: 100%; min-width: 0; flex-wrap: wrap; gap: 4px; padding: 3px; border: 1px solid var(--dn-builder-border); border-radius: 8px; background: #fff; }
.dn-builder-view-button { min-height: 34px; padding: 6px 9px; border: 0; border-radius: 6px; background: transparent; color: var(--dn-builder-muted); font: 600 12px/1.2 Inter, Arial, sans-serif; cursor: pointer; }
.dn-builder-view-button:hover, .dn-builder-view-button:focus-visible { background: #edf6ff; color: var(--dn-builder-primary); }
.dn-builder-view-button.is-active { background: var(--dn-builder-primary); color: #fff; }
.dn-builder-axis-swap { min-height: 34px; padding: 6px 10px; border: 1px solid #b8cee2; border-radius: 6px; background: #fff; color: var(--dn-builder-primary); font: 700 12px/1.2 Inter, Arial, sans-serif; cursor: pointer; }
.dn-builder-axis-swap:hover, .dn-builder-axis-swap:focus-visible, .dn-builder-axis-swap.is-active { border-color: var(--dn-builder-secondary); background: #e7f3ff; color: #003f7d; }
.dn-builder-axis-swap[hidden] { display: none; }
.dn-visual-builder button.dn-builder-reset {
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	align-self: end;
	justify-content: center;
	justify-self: start;
	width: auto;
	min-width: 0;
	height: 38px;
	min-height: 38px;
	max-height: 38px;
	margin: 0;
	padding: 0 10px;
	border: 1px solid #b8cee2;
	border-radius: 7px;
	background: #fff;
	box-shadow: none;
	color: var(--dn-builder-primary);
	font: 700 12px/1 Inter, Arial, sans-serif;
	font-style: normal;
	letter-spacing: normal;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
}
.dn-visual-builder button.dn-builder-reset:hover, .dn-visual-builder button.dn-builder-reset:focus-visible { border-color: var(--dn-builder-secondary); background: #edf6ff; box-shadow: none; color: #003f7d; }
.dn-builder-view-button:focus-visible, .dn-builder-control select:focus-visible, .dn-builder-category-picker > summary:focus-visible { outline: 2px solid var(--dn-builder-secondary); outline-offset: 2px; }

.dn-builder-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.dn-builder-kpi { display: grid; gap: 4px; min-width: 0; padding: 12px 14px; border: 1px solid var(--dn-builder-border); border-radius: 9px; background: #fff; }
.dn-builder-kpi span { overflow: hidden; color: var(--dn-builder-muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.dn-builder-kpi strong { overflow: hidden; color: #0f3b68; font-size: 19px; text-overflow: ellipsis; white-space: nowrap; }

.dn-builder-chart-area { width: 100%; min-height: 440px; padding: 12px 12px 0; border: 1px solid var(--dn-builder-border); border-radius: 10px; background: #fff; overflow: hidden; }
.dn-builder-chart { width: 100%; min-height: 430px; }
.dn-builder-chart-area.is-table-view { min-height: 0; padding: 0; overflow: auto; }
.dn-builder-chart.is-table-view { min-height: 0; }
.dn-builder-chart .google-visualization-table-table { width: 100%; border: 0 !important; border-collapse: separate; border-spacing: 0; border-radius: 9px; overflow: hidden; background: #fff; box-shadow: 0 5px 14px rgba(20, 70, 110, .14); color: #14283d; font: 14px/1.35 Inter, Arial, sans-serif; }
.dn-builder-chart .google-visualization-table-th { position: relative; height: auto !important; padding: 14px 42px 14px 18px !important; border-color: rgba(255, 255, 255, .55) !important; background: #2c89d5 !important; color: #fff; font-weight: 700; letter-spacing: .01em; text-align: left; text-transform: uppercase; white-space: nowrap; cursor: pointer; }
.dn-builder-chart .google-visualization-table-th::after { position: absolute; top: 50%; right: 16px; content: '\21C5'; color: rgba(255, 255, 255, .78); font-size: 15px; line-height: 1; transform: translateY(-50%); }
.dn-builder-chart .google-visualization-table-th.sort-ascending::after { content: '\25B2'; color: #fff; font-size: 12px; }
.dn-builder-chart .google-visualization-table-th.sort-descending::after { content: '\25BC'; color: #fff; font-size: 12px; }
.dn-builder-chart .google-visualization-table-sortind { display: none !important; }
.dn-builder-chart .google-visualization-table-td { height: auto !important; padding: 12px 18px !important; border-color: #dfeaf4 !important; background: #fff; color: #14283d; line-height: 1.35; vertical-align: middle; }
.dn-builder-chart .google-visualization-table-tr-odd .google-visualization-table-td { background: #f1f7fc; }
.dn-builder-chart .google-visualization-table-tr-over .google-visualization-table-td { background: #e5f2fc; }
.dn-builder-chart .google-visualization-table-td-number { color: #14283d; font-variant-numeric: tabular-nums; text-align: right; }
.dn-builder-chart .google-visualization-table-div-page { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 42px; padding: 8px 4px 2px; color: #05509c; font-size: 14px; text-align: center; }
.dn-builder-chart .google-visualization-table-page-numbers { display: inline-flex; align-items: center; gap: 5px; order: 2; }
.dn-builder-chart .google-visualization-table-page-number { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; min-height: 28px; padding: 3px 7px; border: 1px solid #b3d9ff; border-radius: 5px; background: #fff; color: #05509c; font-weight: 700; text-decoration: none; cursor: pointer; }
.dn-builder-chart .google-visualization-table-page-number:hover { background: #eaf5ff; }
.dn-builder-chart .google-visualization-table-page-number.current { border-color: #05509c; background: #05509c; color: #fff; }
.dn-builder-chart .google-visualization-table-div-page .goog-custom-button { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; min-height: 30px; margin: 0 !important; border: 1px solid #b3d9ff; border-radius: 5px; background: #fff; color: #05509c; font-size: 0; cursor: pointer; }
.dn-builder-chart .google-visualization-table-div-page .goog-custom-button-outer-box { display: none !important; }
.dn-builder-chart .google-visualization-table-div-page .goog-custom-button:first-child::before { content: '‹'; font-size: 22px; line-height: 1; }
.dn-builder-chart .google-visualization-table-div-page .goog-custom-button:nth-child(2)::before { content: '›'; font-size: 22px; line-height: 1; }
.dn-builder-chart .google-visualization-table-div-page .goog-custom-button:first-child { order: 1; }
.dn-builder-chart .google-visualization-table-div-page .goog-custom-button:nth-child(2) { order: 3; }
.dn-builder-chart .google-visualization-table-div-page .goog-custom-button-disabled { opacity: .42; cursor: default; }
.dn-builder-chart .google-visualization-table-page-prev, .dn-builder-chart .google-visualization-table-page-next { display: none; }
.dn-builder-status { margin: 8px 2px 0; color: var(--dn-builder-muted); font-size: 12px; }

.dn-builder-embed-body { margin: 0; overflow-x: hidden; background: #fff; }
.dn-builder-embed-main { min-height: 0; padding: 12px 12px 4px; }
.dn-builder-embed-main .dn-visual-builder { margin: 0; }
.dn-builder-embed-main .dn-builder-chart-area { min-height: 420px; }
.dn-builder-embed-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 42px; padding: 8px 14px; border-top: 1px solid #eaf4ff; color: #64748b; font: 12px/1.3 Inter, Arial, sans-serif; }
.dn-builder-embed-footer a { color: #05509c; font-weight: 700; text-decoration: none; }
.dn-builder-powered-by { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.dn-builder-powered-by img { display: block; flex: 0 0 18px; width: 18px; height: 18px; object-fit: contain; }

@container dn-builder (min-width: 1220px) {
	.dn-builder-controls { grid-template-columns: minmax(140px, 1fr) minmax(250px, 1.65fr) minmax(105px, .7fr) auto minmax(450px, 2.4fr); }
	.dn-builder-control-period { grid-column: span 1; }
	.dn-builder-view-switcher { grid-column: 5; grid-row: 1; align-self: end; }
	.dn-builder-controls:has(.dn-builder-control-metric) { grid-template-columns: minmax(125px, 1fr) minmax(225px, 1.65fr) minmax(105px, .75fr) minmax(105px, .75fr) auto minmax(340px, 2.35fr); }
	.dn-builder-controls:has(.dn-builder-control-metric) .dn-builder-view-switcher { grid-column: 6; }
}

@media (max-width: 760px) {
	.dn-builder-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
	.dn-builder-control { min-width: 0; }
	.dn-builder-control-period { grid-column: span 2; }
	.dn-builder-view-switcher { grid-column: 1 / -1; }
	.dn-builder-view-switcher { width: 100%; justify-content: flex-start; }
	.dn-builder-view-button { flex: 1 1 auto; }
	.dn-builder-kpis { grid-template-columns: 1fr; }
	.dn-builder-chart-area { padding-right: 5px; padding-left: 5px; }
}

@media (max-width: 480px) {
	.dn-builder-controls { grid-template-columns: 1fr; }
	.dn-builder-control-period { grid-column: span 1; }
	.dn-builder-range-group { min-width: 0; }
	.dn-builder-chart-area { min-height: 390px; }
	.dn-builder-chart { min-height: 380px; }
	.dn-builder-embed-footer { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
	.dn-visual-builder *, .dn-visual-builder *::before, .dn-visual-builder *::after { scroll-behavior: auto !important; transition: none !important; }
}