/* Scope every control to this tool: preserve the site's menu/card hover styles. */
.dax-interactive .triangle-indices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 24px}
.dax-interactive .triangle-indices button{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;border:1px solid #becfd7;border-radius:13px;padding:17px 20px;background:#edf3f6;color:#183746;font:700 17px/1.3 Arial,sans-serif;cursor:pointer;transition:background .18s,color .18s}
.dax-interactive .triangle-indices button small{font-size:12px;font-weight:400;color:inherit}
.dax-interactive .triangle-indices button:is(:hover,[aria-pressed=true]){background:var(--brand-primary,#183746);color:var(--brand-highlight,#d8ff51)}
.dax-interactive :is(.triangle-indices,.triangle-horizon) button:focus-visible{outline:3px solid #458096;outline-offset:3px}
.dax-interactive .dax-intro{align-items:flex-start}.dax-interactive .dax-intro>div{max-width:850px}
.dax-interactive .dax-intro #dax-zoom{flex-shrink:0}
.dax-interactive .dax-scroll{background:#f8fafb;border-radius:16px;padding:15px 8px;overflow:auto}
.dax-interactive .dax-cell.chosen rect{stroke:#183746;stroke-width:3}
.dax-interactive .triangle-reading{fill:#496371;pointer-events:none}
.dax-interactive .triangle-chart-title{font:700 31px Arial,sans-serif;fill:#183746}
.dax-interactive .triangle-chart-sub{font:700 14px Arial,sans-serif;letter-spacing:1.5px}
.dax-interactive .triangle-chart-key{font:15px Arial,sans-serif}
.dax-interactive .dax-axis{fill:#496371}.dax-interactive .dax-axis.selected{fill:#183746;font-weight:900}
.dax-interactive .triangle-stair{pointer-events:none}.dax-interactive .triangle-stair path{fill:none;stroke-linejoin:miter}
.dax-interactive .stair-base{stroke:white;stroke-width:3.7}.dax-interactive .stair-line{stroke:#496371;stroke-width:1.2}
.dax-interactive .stair-label{font:700 10px Arial,sans-serif;fill:#496371}
.dax-interactive .triangle-stair.active .stair-line{stroke:#183746;stroke-width:2.3}.dax-interactive .triangle-stair.active .stair-base{stroke:#d8ff51;stroke-width:5}.dax-interactive .triangle-stair.active .stair-label{fill:#183746;font-size:12px}
.dax-interactive .triangle-observation{padding:22px;border-radius:15px;background:#edf3f6;margin-top:20px;color:#183746}
.dax-interactive .triangle-observation h4{font-size:18px;line-height:1.4;margin:0 0 14px;color:#183746}
.dax-interactive .triangle-horizon{display:flex;gap:8px;flex-wrap:wrap}
.dax-interactive .triangle-horizon button{border:1px solid #b7cbd5;border-radius:9px;padding:9px 12px;font:600 12px/1.4 Arial,sans-serif;background:white;color:#183746;cursor:pointer}
.dax-interactive .triangle-horizon button:is(:hover,[aria-pressed=true]){background:#183746;color:#d8ff51}
.dax-interactive #triangle-summary{font-size:14px;line-height:1.65;margin:16px 0 0;color:#294b5b}
.dax-interactive .triangle-source-note{font-size:12px;line-height:1.65;color:#496371}
.dax-interactive #triangle-source{color:#285e72;text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){.dax-interactive .triangle-indices{gap:6px}.dax-interactive .triangle-indices button{padding:12px 9px;font-size:13px;border-radius:10px}.dax-interactive .triangle-indices button small{font-size:10px;line-height:1.4}.dax-interactive .dax-scroll{padding:8px 0;overflow:hidden}.dax-interactive .dax-scroll svg{min-width:0}.dax-interactive .triangle-observation{padding:16px}.dax-interactive .triangle-chart-key{font-size:19px}.dax-interactive .dax-controls{margin:18px 0}.dax-interactive .dax-controls #dax-detail{min-height:0}}
@media(prefers-reduced-motion:reduce){.dax-interactive .triangle-indices button{transition:none}}
/* Programmatic heading focus should orient screen readers without a visual frame. */
.generator151 #tg-editor-heading:focus{outline:none!important;box-shadow:none!important}