.terminal-stage-panel,
.terminal-bottom-panel,
.terminal-notes {
    display: grid;
    gap: 18px;
}

.chart-block {
    display: grid;
    gap: 12px;
    min-width: 0;
    max-width: 100%;
}

.compare-summary-panel,
.advanced-intro-panel {
    display: grid;
    gap: 10px;
}

.compare-summary-head,
.compare-summary-copy,
.advanced-intro-copy,
.advanced-intro-pills {
    display: grid;
    gap: 6px;
}

.advanced-intro-pills {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

#chart.terminal-panel {
    min-width: 0;
    max-width: 100%;
}

.chart-block-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.chart-block-head .terminal-panel-head {
    margin: 0;
}

.chart-filter-bar,
.chart-filter-more,
.chart-filter-more-section,
.chart-filter-export,
.chart-filter-shortcuts-wrap {
    display: grid;
    gap: 12px;
}

.chart-filter-bar {
    padding: 14px 16px;
    border: 1px solid var(--ar-line);
    border-radius: 16px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ar-surface-2) 92%, transparent), color-mix(in srgb, var(--ar-surface-3) 88%, transparent)),
        radial-gradient(circle at top right, color-mix(in srgb, var(--ar-accent) 10%, transparent), transparent 42%);
}

.chart-filter-bar.chart-filter-bar-below-chart {
    margin-top: 6px;
    padding: 12px 14px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--ar-surface-2) 94%, var(--ar-surface));
    display: grid;
    gap: 12px;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.chart-filter-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    min-width: 0;
    max-width: 100%;
}

.chart-filter-actions-export {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.chart-filter-download-label {
    margin: 0;
}

.chart-filter-bar-head,
.chart-filter-bar-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.chart-filter-bar-head {
    justify-content: space-between;
}

.chart-filter-bar-copy {
    display: grid;
    gap: 4px;
}

.chart-filter-bar-copy p {
    margin: 0;
    color: var(--ar-text-soft);
    font-size: 0.8rem;
}

.chart-filter-grid,
.chart-filter-more-grid {
    display: grid;
    gap: 10px;
}

.chart-filter-grid-primary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.chart-filter-grid-secondary {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.chart-filter-field {
    gap: 8px;
    min-width: 0;
}

.chart-filter-state-row {
    align-items: center;
}

.chart-filter-state-row .terminal-copy-status[hidden] {
    display: none;
}

.chart-filter-state-row .terminal-copy-status:not([hidden]) {
    margin: 0;
}

.chart-filter-more {
    border: 1px solid var(--ar-line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--ar-surface-2) 84%, var(--ar-surface));
    overflow: hidden;
}

.chart-filter-more > summary {
    padding: 10px 12px;
}

.chart-filter-more-grid {
    padding: 0 12px 12px;
}

.chart-filter-more-section {
    padding-top: 12px;
    border-top: 1px solid color-mix(in srgb, var(--ar-line) 82%, transparent);
}

.chart-filter-more-section:first-child {
    border-top: 0;
}

.bank-picker-grid-compact {
    grid-template-columns: repeat(auto-fit, minmax(124px, 1fr));
    max-height: 240px;
    overflow-y: auto;
}

.chart-filter-export {
    align-content: start;
}

.chart-figure {
    border: 1px solid var(--ar-line);
    border-radius: 12px 12px 0 0;
    background: var(--ar-surface-2);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto 1fr;
    min-height: 0;
}

.chart-figure:last-child {
    border-radius: 12px;
}

.chart-footer {
    border-radius: 0 0 12px 12px;
}

.chart-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--ar-line);
    background: color-mix(in srgb, var(--ar-surface-2) 70%, var(--ar-surface));
}

.chart-toolbar .chart-toolbar-stack {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.chart-overlay-picker {
    flex: 0 0 auto;
    min-width: min(220px, 100%);
    align-self: flex-start;
    border: 1px solid var(--ar-line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--ar-surface-2) 92%, var(--ar-surface));
    overflow: hidden;
}

.chart-overlay-picker.is-disabled {
    opacity: 0.8;
}

.chart-overlay-picker-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 34px;
    padding: 6px 10px;
    list-style: none;
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ar-text-soft);
}

.chart-overlay-picker-summary::-webkit-details-marker {
    display: none;
}

.chart-overlay-picker-title {
    color: var(--ar-text);
}

.chart-overlay-picker-count {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid var(--ar-line);
    border-radius: 999px;
    background: var(--ar-surface);
    font-size: 0.68rem;
    font-family: var(--ar-font-mono, ui-monospace, "SF Mono", Consolas, monospace);
}

.chart-overlay-picker-panel {
    display: grid;
    gap: 6px;
    padding: 6px 8px 8px;
    border-top: 1px solid var(--ar-line);
}

.chart-overlay-picker-panel .hint {
    font-size: 0.68rem;
    line-height: 1.35;
    margin: 0;
}

.chart-overlay-picker-options {
    display: grid;
    gap: 6px;
    max-height: min(168px, 36vh);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 2px 0 0;
    scrollbar-gutter: stable;
}

.chart-overlay-group {
    display: grid;
    gap: 3px;
}

.chart-overlay-group + .chart-overlay-group {
    padding-top: 3px;
    border-top: 1px solid color-mix(in srgb, var(--ar-line) 70%, transparent);
}

.chart-overlay-group-title {
    margin: 0;
    color: var(--ar-text-soft);
    font-size: 0.58rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.chart-overlay-group-options {
    display: flex;
    flex-wrap: wrap;
    gap: 3px 5px;
    align-items: stretch;
}

.chart-overlay-option {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    max-width: 100%;
    padding: 2px 6px 2px 5px;
    border: 1px solid color-mix(in srgb, var(--ar-line) 92%, transparent);
    border-radius: 6px;
    background: color-mix(in srgb, var(--ar-surface-2) 78%, var(--ar-surface));
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.chart-overlay-option:hover {
    border-color: color-mix(in srgb, var(--ar-text-soft) 28%, var(--ar-line));
    background: color-mix(in srgb, var(--ar-surface-2) 88%, var(--ar-surface));
}

.chart-overlay-option:has(input:checked) {
    border-color: color-mix(in srgb, var(--ar-accent) 42%, var(--ar-line));
    background: color-mix(in srgb, var(--ar-accent) 9%, var(--ar-surface));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ar-accent) 18%, transparent);
}

.chart-overlay-option:has(input:focus-visible) {
    outline: 2px solid color-mix(in srgb, var(--ar-accent) 55%, transparent);
    outline-offset: 1px;
}

.chart-overlay-option-swatch {
    flex-shrink: 0;
    width: 20px;
    height: 0;
    margin: 2px 0;
    border: none;
    border-radius: 1px;
    border-top: 2px dashed var(--chart-overlay-swatch, #64748b);
    opacity: 0.92;
}

.chart-overlay-option:has(input:checked) .chart-overlay-option-swatch {
    opacity: 1;
    border-top-width: 2px;
    filter: saturate(1.08) brightness(1.06);
}

.chart-overlay-option input[type="checkbox"] {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    margin: 0;
    accent-color: var(--ar-accent);
    cursor: pointer;
}

.chart-overlay-option-body {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.1rem 0.3rem;
    min-width: 0;
    flex: 1;
    line-height: 1.2;
}

.chart-overlay-option-label {
    font-size: 0.66rem;
    font-weight: 600;
    color: var(--ar-text);
    min-width: 0;
}

.chart-overlay-option-caption {
    font-size: 0.58rem;
    font-weight: 500;
    color: var(--ar-text-soft);
    min-width: 0;
    max-width: 9.5rem;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-clamp: 1;
}

.chart-overlay-option-caption::before {
    content: '·';
    margin-right: 0.3em;
    opacity: 0.55;
}

.chart-overlay-picker-empty {
    color: var(--ar-text-soft);
    font-size: 0.7rem;
}

.chart-toolbar .chart-question-row {
    flex: 1 1 auto;
    min-width: 0;
}

.chart-engine-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.chart-engine-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-right: 4px;
}

.chart-engine-btn {
    min-height: 40px;
}

.chart-toolbar-btn {
    flex-shrink: 0;
}

.chart-options-details {
    border: 1px solid var(--ar-line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--ar-surface-2) 94%, var(--ar-surface));
    overflow: hidden;
}

.chart-options-summary {
    padding: 7px 10px;
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--ar-text-soft);
    cursor: pointer;
    list-style: none;
}

.chart-options-summary::-webkit-details-marker {
    display: none;
}

.chart-options-summary:hover {
    color: var(--ar-text);
}

.chart-options-details[open] .chart-options-summary {
    border-bottom: 1px solid var(--ar-line);
}

.chart-options-details .terminal-chart-controls {
    padding: 10px;
}

.chart-guidance-wrap,
.chart-summary,
.terminal-bottom-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.terminal-chart-controls {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
    gap: 8px;
    align-items: end;
}

.terminal-chart-controls .terminal-field {
    min-width: 0;
}

.chart-structure-filters-wrap {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.chart-structure-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    align-items: center;
}

.chart-structure-filters .chart-structure-checkbox {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    white-space: nowrap;
}

.chart-preset,
.tab-btn {
    border-radius: 999px;
    white-space: normal;
    font-size: 0.78rem;
}

.chart-preset,
.tab-btn,
.terminal-more-summary {
    gap: 8px;
}

.control-chip-label {
    justify-content: center;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
    text-align: center;
    line-height: 1.15;
}

.control-chip-label .ar-icon {
    width: 1rem;
    height: 1rem;
}

/* Ensure longer labels wrap within pill buttons instead of overflowing. */
.chip-btn .ar-icon-label-text,
.tab-btn .ar-icon-label-text,
.chart-preset .ar-icon-label-text,
.terminal-more-summary .ar-icon-label-text {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
    text-align: center;
    line-height: 1.15;
}

.chart-preset.is-active,
.tab-btn.active {
    border-color: rgba(37, 99, 235, 0.32);
    background: var(--ar-accent-soft);
    color: var(--ar-text);
}

.terminal-chart-surface {
    min-height: 220px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.chart-figure .terminal-chart-surface {
    border: none;
    border-radius: 0;
    background: transparent;
}

.chart-workspace {
    --ar-chart-side-panel-width: 50%;
    --ar-chart-mobile-top-height: 50dvh;
    display: grid;
    grid-template-columns: minmax(240px, 1fr) 12px minmax(240px, var(--ar-chart-side-panel-width));
    grid-template-areas: "chart resize rail";
    align-items: stretch;
    min-width: 0;
    /* Bound the side-panel scroll area so the product list never stretches the chart column into empty space. */
    max-height: min(78vh, 880px);
    min-height: 420px;
}

.terminal-chart-surface {
    grid-area: chart;
    min-width: 0;
    min-height: 0;
}

.chart-workspace-resizer {
    grid-area: resize;
    position: relative;
    min-width: 12px;
    min-height: 100%;
    cursor: col-resize;
    touch-action: none;
    outline: none;
    background: transparent;
}

.chart-workspace-resizer::before {
    content: "";
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 50%;
    width: 2px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: color-mix(in srgb, var(--ar-line-strong) 78%, transparent);
    transition: background 0.15s ease, box-shadow 0.15s ease;
}

.chart-workspace-resizer:hover::before,
.chart-workspace-resizer:focus-visible::before,
.chart-workspace-resizer.is-active::before,
.is-resizing-chart-workspace .chart-workspace-resizer::before {
    background: color-mix(in srgb, var(--ar-accent) 65%, var(--ar-line-strong));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ar-accent) 14%, transparent);
}

.chart-side-panel {
    grid-area: rail;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    border-left: 1px solid var(--ar-line);
    background: color-mix(in srgb, var(--ar-surface-2) 88%, var(--ar-surface));
}

.chart-side-panel-head {
    display: none !important;
}

.chart-side-summary {
    justify-content: flex-start;
}

.chart-selection-rail {
    display: grid;
    gap: 10px;
    min-width: 0;
    min-height: 0;
    overflow: auto;
    padding: 12px 14px 16px;
    border-top: 0;
    background: transparent;
}

.chart-selection-rail.has-ribbon-hierarchy > :not(.ar-report-underchart-tree) {
    display: none;
}

.ar-report-underchart-tree {
    display: none;
    min-width: 0;
    min-height: 0;
    height: 100%;
    padding: 10px 12px 12px;
    font: 11px/1.45 "Space Grotesk", system-ui, sans-serif;
    color: var(--ar-ribbon-tree-text, var(--ar-text));
    background: var(--ar-ribbon-tree-bg, var(--ar-surface-2));
    border: 1px solid var(--ar-ribbon-tree-border, var(--ar-line));
    border-radius: 12px;
    overflow: hidden;
}

.chart-selection-rail.has-ribbon-hierarchy .ar-report-underchart-tree {
    display: flex;
    flex-direction: column;
}

.ar-report-underchart-tree-body {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 10px;
    min-height: 0;
    height: 100%;
}

.ar-report-underchart-tree-head {
    display: grid;
    gap: 4px;
}

.ar-report-underchart-tree-heading {
    min-width: 0;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
}

.ar-report-underchart-tree-meta {
    min-width: 0;
    color: var(--ar-ribbon-tree-muted, var(--ar-text-soft));
    font-size: 0.66rem;
    line-height: 1.3;
}

.ar-report-underchart-tree-scroll {
    display: grid;
    align-content: start;
    gap: 0;
    min-height: 0;
    overflow: auto;
    padding-right: 2px;
    scrollbar-gutter: stable;
}

.ar-report-underchart-tree-breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px 3px;
    min-width: 0;
    margin-bottom: 4px;
    padding-bottom: 4px;
    border-bottom: 1px solid color-mix(in srgb, var(--ar-ribbon-tree-border, var(--ar-line)) 60%, transparent);
}

.ar-report-underchart-tree-crumb {
    flex: 0 1 auto;
    max-width: 100%;
    min-height: 0;
    padding: 1px 5px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: var(--ar-ribbon-tree-muted, var(--ar-text-soft));
    font: inherit;
    font-size: 0.64rem;
    font-weight: 500;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease;
}

.ar-report-underchart-tree-crumb:hover,
.ar-report-underchart-tree-crumb:focus-visible {
    background: color-mix(in srgb, var(--ar-text-muted) 10%, transparent);
    color: var(--ar-text);
    outline: none;
}

.ar-report-underchart-tree-crumb.is-current {
    color: var(--ar-text);
    font-weight: 600;
    background: transparent;
}

.ar-report-underchart-tree-crumb-sep {
    flex: 0 0 auto;
    color: var(--ar-ribbon-tree-muted, var(--ar-text-soft));
    font-size: 0.6rem;
    opacity: 0.5;
    padding: 0 1px;
}

.terminal-chart-output,
#chart-output,
#chart-detail-output {
    min-height: 220px;
    width: 100%;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    touch-action: manipulation;
    position: relative;
}

.chart-status-line {
    position: absolute;
    top: 8px;
    left: 10px;
    z-index: 2;
    pointer-events: none;
    font-family: var(--ar-font-mono, "JetBrains Mono", "SF Mono", "Consolas", monospace);
    font-size: 12px;
    line-height: 1.4;
    color: var(--ar-text-soft, #64748b);
    background: color-mix(in srgb, var(--ar-bg, #0f1419) 92%, transparent);
    border: 1px solid var(--ar-line, rgba(148, 163, 184, 0.2));
    border-radius: 4px;
    padding: 6px 10px;
    white-space: pre;
    visibility: hidden;
}

.chart-status-line.visible {
    visibility: visible;
}

.chart-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 20px;
    padding: 12px 16px;
    border: 1px solid var(--ar-line);
    border-top: none;
    background: color-mix(in srgb, var(--ar-surface-2) 85%, var(--ar-surface));
    border-radius: 0 0 12px 12px;
}

.chart-footer-guidance {
    flex: 0 0 auto;
    font-size: 0.78rem;
}

.chart-footer-stats {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin: 0;
}

.chart-footer-stats .terminal-stat {
    min-width: 0;
}

.chart-footer-summary {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
}

.chart-figure + .chart-footer {
    border-radius: 0;
}

.chart-output-empty,
.chart-detail-empty,
.chart-data-summary-empty,
.chart-series-empty,
.chart-spotlight-empty {
    display: grid;
    place-items: center;
    min-height: 240px;
    color: var(--ar-text-soft);
    font-size: 0.8rem;
}

.terminal-inline-feedback {
    padding: 10px 12px;
    border: 1px solid var(--ar-line);
    border-radius: 12px;
    background: var(--ar-surface-2);
    color: var(--ar-text-soft);
    font-size: 0.82rem;
    line-height: 1.5;
}

.terminal-inline-feedback.is-error {
    border-color: color-mix(in srgb, var(--ar-danger) 24%, var(--ar-line));
    background: color-mix(in srgb, var(--ar-danger) 8%, var(--ar-surface-2));
    color: var(--ar-danger);
}

.terminal-inline-feedback.is-warning {
    border-color: color-mix(in srgb, var(--ar-warning) 24%, var(--ar-line));
    background: color-mix(in srgb, var(--ar-warning) 10%, var(--ar-surface-2));
    color: var(--ar-text);
}

.workspace-status {
    display: grid;
    gap: 10px;
}

.workspace-status-copy {
    display: grid;
    gap: 4px;
}

.workspace-status-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chart-summary-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid var(--ar-line);
    border-radius: 999px;
    background: var(--ar-surface-2);
    color: var(--ar-text-soft);
    font-size: 0.72rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-family: var(--ar-font-mono, ui-monospace, "SF Mono", Consolas, monospace);
}

.chart-summary-pill.is-emphasis {
    color: var(--ar-accent-2);
}

.chart-summary-pill.is-warning {
    color: var(--ar-warning);
}

.chart-series-list,
.chart-point-details,
.chart-data-summary,
.rate-change-list {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.chart-series-card,
.chart-spotlight-card,
.rate-change-details {
    display: grid;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid var(--ar-line);
    border-radius: 10px;
    background: var(--ar-surface-2);
}

.chart-series-card {
    text-align: left;
}

.chart-series-group {
    display: grid;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid color-mix(in srgb, var(--ar-line) 88%, transparent);
}

.chart-series-group:first-child {
    padding-top: 0;
    border-top: 0;
}

.chart-series-group-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 12px;
    align-items: baseline;
}

.chart-series-group-title {
    margin: 0;
    font-size: 0.82rem;
    font-weight: 700;
}

.chart-series-group-meta {
    color: var(--ar-text-soft);
    font-size: 0.72rem;
}

.chart-series-group-list {
    display: grid;
    gap: 8px;
}

.chart-series-card.is-reference {
    cursor: default;
}

.chart-series-card.is-compact {
    gap: 8px;
    padding: 10px 12px;
}

.chart-series-topline,
.chart-series-meta,
.chart-spotlight-grid,
.rate-change-main,
.rate-change-sub {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 12px;
    align-items: center;
}

.chart-guidance-wrap,
.chart-summary,
.chart-series-name-wrap,
.chart-spotlight-copy,
.chart-spotlight-metrics,
.chart-spotlight-grid,
.chart-spotlight-link-row,
.chart-point-details > *,
.chart-data-summary > * {
    min-width: 0;
}

.chart-series-name-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.chart-series-swatch {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--series-accent, var(--ar-accent));
}

.chart-series-card.is-active,
.chart-series-card.is-selected {
    border-color: color-mix(in srgb, var(--series-accent, var(--ar-accent)) 42%, var(--ar-line));
    border-left: 3px solid var(--series-accent, var(--ar-accent));
    background: color-mix(in srgb, var(--series-accent, var(--ar-accent)) 8%, var(--ar-surface-2));
}

.chart-series-name,
.rate-change-bank,
.rate-change-product,
.rate-change-headline {
    font-weight: 700;
}

.chart-series-value {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    font-family: var(--ar-font-mono, ui-monospace, "SF Mono", Consolas, monospace);
}

.rate-change-bank {
    display: inline-flex;
    align-items: center;
}

.chart-series-caption,
.chart-series-note,
.chart-series-meta,
.chart-spotlight-subtitle,
.rate-change-warning,
.rate-change-detail,
.rate-change-rates {
    color: var(--ar-text-soft);
    font-size: 0.74rem;
}

.chart-series-caption,
.chart-series-name,
.chart-spotlight-subtitle,
.chart-summary-pill,
.chart-point-link,
.chart-spotlight-copy strong,
.chart-spotlight-field,
.chart-spotlight-value {
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
}

.chart-spotlight-grid span,
.chart-spotlight-field {
    min-width: 0;
    flex: 1 1 180px;
}

.chart-spotlight-field {
    display: grid;
    gap: 4px;
    align-content: start;
}

.chart-spotlight-value {
    min-width: 0;
    max-width: 100%;
}

.chart-side-panel .chart-point-details {
    padding-top: 2px;
}

@media (max-width: 980px) {
    .chart-workspace {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(200px, var(--ar-chart-mobile-top-height)) 12px minmax(220px, 1fr);
        grid-template-areas:
            "chart"
            "resize"
            "rail";
        /* When stacked, let each section use natural height - side panel becomes its own scroll zone. */
        max-height: none;
        min-height: 0;
        height: 100%;
    }

    .chart-side-panel {
        border-left: 0;
        border-top: 1px solid var(--ar-line);
    }

    .chart-selection-rail {
        max-height: none;
        height: 100%;
    }

    .chart-workspace-resizer {
        min-width: 100%;
        min-height: 12px;
        cursor: row-resize;
    }

    .chart-workspace-resizer::before {
        top: 50%;
        bottom: auto;
        left: 12px;
        right: 12px;
        width: auto;
        height: 2px;
        transform: translateY(-50%);
    }
}

.chart-point-link {
    color: var(--ar-text);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 0.18em;
}

.chart-point-link:hover {
    color: var(--ar-accent);
}

.tab-panel {
    display: grid;
    gap: 14px;
}

.terminal-notes summary {
    list-style: none;
}

.terminal-notes summary::-webkit-details-marker {
    display: none;
}

.terminal-notes-body {
    display: grid;
    gap: 12px;
    margin-top: 12px;
    color: var(--ar-text-soft);
    font-size: 0.82rem;
    line-height: 1.6;
}

#pivot-output .pvtUi,
#pivot-output .pvtTable {
    background: transparent;
    color: var(--ar-text);
}

#pivot-output .pvtUi select,
#pivot-output .pvtUi input,
#pivot-output .pvtUi button {
    background: var(--ar-surface-2);
    color: var(--ar-text);
}

#pivot-output .pvtTable th,
#pivot-output .pvtTable td {
    border-color: var(--ar-line);
    background: var(--ar-surface-2);
    color: var(--ar-text);
}

.rate-change-details {
    padding: 0;
}

.rate-change-summary {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    list-style: none;
    padding: 12px;
}

.rate-change-summary::-webkit-details-marker {
    display: none;
}

.rate-change-warning,
.rate-change-status,
.rate-change-list {
    padding-inline: 12px;
}

.rate-change-list {
    margin: 0;
    padding-bottom: 12px;
    list-style: none;
}

.rate-change-item {
    display: grid;
    gap: 8px;
    padding: 10px 0;
    border-bottom: 1px solid var(--ar-line);
}

.rate-change-item:last-child {
    border-bottom: 0;
}

.rate-change-delta.up {
    color: var(--ar-warning);
}

.rate-change-delta.down {
    color: var(--ar-positive);
}

.rate-change-delta.flat {
    color: var(--ar-text-muted);
}

/* --- Ultra-modern chart interface: responsive, slick, interactive --- */

.chart-figure {
    transition:
        border-color var(--ar-motion-base, 240ms) var(--ar-ease, cubic-bezier(0.22, 1, 0.36, 1)),
        box-shadow var(--ar-motion-base, 240ms) var(--ar-ease);
}

.chart-figure:has(#chart-output[data-chart-rendered="true"]) {
    border-color: color-mix(in srgb, var(--ar-accent, #2563eb) 28%, var(--ar-line));
}

.terminal-chart-surface {
    transition: opacity var(--ar-motion-base, 240ms) var(--ar-ease);
    contain: layout style;
}

.terminal-chart-output,
#chart-output,
#chart-detail-output {
    transition: opacity var(--ar-motion-base, 240ms) var(--ar-ease);
    contain: layout style paint;
}

#chart-output[data-chart-rendered="true"] {
    opacity: 1;
}

#chart-output:focus-within,
#chart-detail-output:focus-within {
    outline: none;
}

.chart-figure:focus-within {
    border-color: color-mix(in srgb, var(--ar-accent, #2563eb) 38%, var(--ar-line));
}

.chart-output-empty,
.chart-detail-empty {
    animation: chart-fade-in 0.4s var(--ar-ease, cubic-bezier(0.22, 1, 0.36, 1)) both;
}

#chart-output:not([data-chart-rendered="true"]) .chart-output-empty,
#chart-detail-output:not([data-chart-rendered="true"]) .chart-detail-empty {
    animation: chart-fade-in 0.4s var(--ar-ease) both, chart-loading-pulse 1.6s ease-in-out infinite 0.5s;
}

@keyframes chart-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes chart-loading-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.72; }
}

.chart-question-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.chart-preset {
    transition:
        border-color var(--ar-motion-fast, 180ms) var(--ar-ease),
        background-color var(--ar-motion-fast, 180ms) var(--ar-ease),
        color var(--ar-motion-fast, 180ms) var(--ar-ease),
        box-shadow var(--ar-motion-fast, 180ms) var(--ar-ease),
        transform var(--ar-motion-fast, 180ms) var(--ar-ease);
    min-height: 44px;
    -webkit-tap-highlight-color: transparent;
}

.chart-preset:hover {
    border-color: color-mix(in srgb, var(--ar-accent) 36%, var(--ar-line));
    background: color-mix(in srgb, var(--ar-accent-soft) 60%, var(--ar-surface-2));
}

.chart-preset:focus-visible {
    outline: 2px solid var(--ar-accent);
    outline-offset: 2px;
}

.chart-preset.is-active {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--ar-accent) 40%, transparent);
}

.chart-series-card,
.chart-spotlight-card {
    transition:
        transform var(--ar-motion-fast, 180ms) var(--ar-ease),
        box-shadow var(--ar-motion-fast, 180ms) var(--ar-ease),
        border-color var(--ar-motion-fast, 180ms) var(--ar-ease),
        background-color var(--ar-motion-fast, 180ms) var(--ar-ease);
    -webkit-tap-highlight-color: transparent;
}

.chart-series-card:hover,
.chart-spotlight-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.chart-series-card:focus-visible,
.chart-spotlight-card:focus-visible {
    outline: 2px solid var(--ar-accent);
    outline-offset: 2px;
}

.chart-series-card.is-active,
.chart-series-card.is-selected {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--series-accent, var(--ar-accent)) 50%, transparent);
}

.chart-spotlight-card {
    border-left: 3px solid var(--ar-accent);
}

.chart-summary-pill {
    transition:
        transform var(--ar-motion-fast, 180ms) var(--ar-ease),
        opacity var(--ar-motion-fast, 180ms) var(--ar-ease);
}

.chart-summary-pill:hover {
    opacity: 1;
}

.chart-point-link {
    transition: color var(--ar-motion-fast, 180ms) var(--ar-ease);
}

.terminal-chart-controls select,
.terminal-chart-controls .terminal-field input {
    transition: border-color var(--ar-motion-fast, 180ms) var(--ar-ease), background-color var(--ar-motion-fast, 180ms) var(--ar-ease);
}

#draw-chart {
    transition:
        border-color var(--ar-motion-fast, 180ms) var(--ar-ease),
        background-color var(--ar-motion-fast, 180ms) var(--ar-ease),
        transform var(--ar-motion-fast, 180ms) var(--ar-ease);
    -webkit-tap-highlight-color: transparent;
}

#draw-chart:hover {
    transform: translateY(-1px);
}

#draw-chart:active {
    transform: translateY(0);
}

#draw-chart:focus-visible {
    outline: 2px solid var(--ar-accent);
    outline-offset: 2px;
}

@media (max-width: 760px) {
    .chart-block,
    .chart-figure {
        min-width: 0;
    }

    .terminal-bottom-tabs {
        flex-direction: column;
        align-items: stretch;
    }

    .terminal-chart-controls {
        grid-template-columns: 1fr;
    }

    .chart-filter-grid-primary,
    .chart-filter-grid-secondary {
        grid-template-columns: 1fr 1fr;
    }

    .chart-filter-bar-head {
        align-items: flex-start;
    }

    .chart-filter-bar-actions {
        width: 100%;
    }

    .chart-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .chart-overlay-picker {
        width: 100%;
        min-width: 0;
    }

    .chart-toolbar .chart-toolbar-btn {
        width: 100%;
    }

    .terminal-chart-surface,
    .terminal-chart-output,
    #chart-output,
    #chart-detail-output {
        min-height: 320px;
    }

    .chart-question-row {
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x proximity;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }

    .chart-preset {
        flex: 0 0 auto;
        scroll-snap-align: start;
        min-height: var(--ar-touch-min);
    }

    .chart-series-card,
    .chart-spotlight-card {
        min-height: var(--ar-touch-min);
        padding: 14px;
    }
}

/* Landscape mobile: maximise chart height, minimise chrome */
@media (max-height: 760px) and (orientation: landscape) {
    .chart-workspace {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(160px, var(--ar-chart-mobile-top-height)) 12px minmax(180px, 1fr);
        grid-template-areas:
            "chart"
            "resize"
            "rail";
    }

    .chart-side-panel {
        border-left: 0;
        border-top: 1px solid var(--ar-line);
    }

    .terminal-chart-surface,
    .terminal-chart-output,
    #chart-output,
    #chart-detail-output {
        min-height: max(200px, calc(100dvh - var(--ar-header-height) - 80px));
    }

    .chart-toolbar {
        flex-direction: row;
        flex-wrap: wrap;
        padding: 8px 12px;
        gap: 8px;
    }

    .chart-footer {
        padding: 8px 12px;
        gap: 8px 12px;
    }

    .chart-filter-grid-primary {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .chart-selection-rail {
        max-height: none;
    }
}

@media (max-width: 420px) {
    .chart-workspace {
        grid-template-columns: minmax(0, 1fr);
    }

    .chart-side-panel {
        border-left: 0;
        border-top: 1px solid var(--ar-line);
    }

    .chart-toolbar {
        padding: 12px;
    }

    .chart-filter-bar {
        padding: 12px;
    }

    .chart-filter-grid-primary,
    .chart-filter-grid-secondary {
        grid-template-columns: 1fr;
    }

    .chart-footer {
        padding: 10px 12px;
        gap: 10px 14px;
    }

    .terminal-chart-surface,
    .terminal-chart-output,
    #chart-output,
    #chart-detail-output {
        min-height: 280px;
    }

    #pivot-output {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* Rate report: horizontal lender logo tray (ribbon chart) */
body.ar-public .lwc-report-viewmode {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 0;
    flex-shrink: 0;
    padding: 2px 0 4px;
    min-height: 26px;
}

body.ar-public .lwc-report-range {
    display: grid;
    gap: 6px;
    padding: 0 0 8px;
}

body.ar-public .lwc-report-range-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

body.ar-public .lwc-report-range-note {
    margin: 0;
}

body.ar-public .lwc-report-viewmode-tab {
    margin: 0;
    padding: 5px 11px;
    min-height: 0;
    height: auto;
    border: 1px solid var(--ar-line-strong);
    border-radius: 0;
    background: transparent;
    color: var(--ar-text);
    font: 600 0.78rem/1.25 "Space Grotesk", system-ui, sans-serif;
    cursor: pointer;
    opacity: 0.55;
    transition:
        opacity var(--ar-motion-fast, 150ms) var(--ar-ease, ease),
        background var(--ar-motion-fast, 150ms) var(--ar-ease, ease),
        border-color var(--ar-motion-fast, 150ms) var(--ar-ease, ease);
}

body.ar-public .lwc-report-viewmode-tab--first {
    border-radius: 4px 0 0 4px;
}

body.ar-public .lwc-report-viewmode-tab + .lwc-report-viewmode-tab {
    border-left: none;
}

body.ar-public .lwc-report-viewmode-tab:hover {
    opacity: 0.88;
}

body.ar-public .lwc-report-viewmode-tab.is-active {
    opacity: 1;
    background: var(--ar-surface-2);
    font-weight: 600;
}

body.ar-public .lwc-report-viewmode-tab:focus-visible {
    outline: 2px solid var(--ar-accent);
    outline-offset: 1px;
    z-index: 1;
}

body.ar-public .lwc-report-viewmode-select-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: -1px;
    border: 1px solid var(--ar-line-strong);
    border-radius: 0 4px 4px 0;
    background: transparent;
    opacity: 0.72;
    transition:
        opacity var(--ar-motion-fast, 150ms) var(--ar-ease, ease),
        background var(--ar-motion-fast, 150ms) var(--ar-ease, ease),
        border-color var(--ar-motion-fast, 150ms) var(--ar-ease, ease);
}

body.ar-public .lwc-report-viewmode-select-wrap:hover {
    opacity: 0.95;
}

body.ar-public .lwc-report-viewmode-select-wrap.is-active {
    opacity: 1;
    background: var(--ar-surface-2);
}

body.ar-public .lwc-report-viewmode-select {
    min-height: 0;
    height: auto;
    padding: 5px 28px 5px 11px;
    margin: 0;
    border: 0;
    background:
        linear-gradient(45deg, transparent 50%, var(--ar-text) 50%) calc(100% - 15px) calc(50% - 1px) / 6px 6px no-repeat,
        linear-gradient(135deg, var(--ar-text) 50%, transparent 50%) calc(100% - 10px) calc(50% - 1px) / 6px 6px no-repeat,
        transparent;
    color: var(--ar-text);
    font: 600 0.78rem/1.25 "Space Grotesk", system-ui, sans-serif;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

body.ar-public .lwc-report-viewmode-select:focus-visible {
    outline: 2px solid var(--ar-accent);
    outline-offset: 1px;
}

body.ar-public .lwc-focus-bank-tray-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex: 1 1 240px;
    min-width: 0;
    margin: 0;
    padding: 0;
    scrollbar-gutter: stable;
}

body.ar-public .lwc-focus-bank-tray {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    min-height: 30px;
    max-height: 36px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 0 2px;
    -webkit-overflow-scrolling: touch;
}

body.ar-public .lwc-focus-bank-tray::-webkit-scrollbar {
    height: 4px;
}

body.ar-public .lwc-focus-bank-tray::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--ar-text-muted) 45%, transparent);
    border-radius: 3px;
}

body.ar-public .lwc-focus-bank-clear {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    min-height: 0;
    padding: 0;
    margin: 0;
    border: 1px solid var(--ar-line-strong);
    border-radius: 4px;
    background: var(--ar-surface-2);
    color: var(--ar-text-muted);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
}

body.ar-public .lwc-focus-bank-clear:disabled {
    opacity: 0.35;
    cursor: default;
}

body.ar-public .lwc-focus-bank-clear:not(:disabled):hover {
    color: var(--ar-text);
}

body.ar-public .lwc-focus-bank-chip {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    cursor: default;
    opacity: 1;
    transition:
        opacity var(--ar-motion-fast, 150ms) var(--ar-ease, ease),
        transform var(--ar-motion-fast, 150ms) var(--ar-ease, ease);
}

body.ar-public .lwc-focus-bank-chip-body {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-width: 0;
    padding: 0;
}

body.ar-public .lwc-focus-bank-chip-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    opacity: 0.28;
    filter: grayscale(1) saturate(0) brightness(0.72);
    transform: scale(0.96);
    transition:
        opacity var(--ar-motion-fast, 150ms) var(--ar-ease, ease),
        filter var(--ar-motion-fast, 150ms) var(--ar-ease, ease),
        transform var(--ar-motion-fast, 150ms) var(--ar-ease, ease);
}

body.ar-public .lwc-focus-bank-chip-copy {
    display: none;
}

body.ar-public .lwc-focus-bank-chip-name {
    font: 700 0.62rem/1 "Space Grotesk", system-ui, sans-serif;
    color: var(--ar-text);
    letter-spacing: 0.03em;
    text-transform: uppercase;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.ar-public .lwc-focus-bank-chip-metric {
    font: 700 0.72rem/1.05 "Space Grotesk", system-ui, sans-serif;
    color: var(--ar-text);
    font-variant-numeric: tabular-nums;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.ar-public .lwc-focus-bank-chip-sub {
    font: 500 0.58rem/1 "Space Grotesk", system-ui, sans-serif;
    color: var(--ar-text-muted);
    font-variant-numeric: tabular-nums;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.ar-public .lwc-focus-bank-chip.is-ribbon-active .lwc-focus-bank-chip-brand {
    opacity: 0.88;
    filter: saturate(0.92) brightness(0.96);
    transform: scale(1);
}

body.ar-public .lwc-focus-bank-chip.is-ribbon-hover .lwc-focus-bank-chip-brand,
body.ar-public .lwc-focus-bank-chip.is-ribbon-selected .lwc-focus-bank-chip-brand {
    opacity: 1;
    filter: none;
    transform: scale(1.06);
}

body.ar-public .lwc-focus-bank-chip.is-ribbon-dim {
    opacity: 1;
}

body.ar-public .lwc-focus-bank-chip.is-ribbon-dim .lwc-focus-bank-chip-brand {
    opacity: 0.22;
    filter: grayscale(1) saturate(0) brightness(0.62);
    transform: scale(0.94);
}

/* Ribbon chart: macro overlay toggle bar */
body.ar-public .lwc-report-macro-bar {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    padding: 2px 0 6px;
    font-size: 11px;
}

body.ar-public .lwc-report-macro-label {
    opacity: 0.7;
    margin-right: 2px;
}

body.ar-public .lwc-report-macro-toggle {
    appearance: none;
    -webkit-appearance: none;
    padding: 2px 8px;
    border-radius: 4px;
    border: 1px solid rgba(148, 163, 184, 0.40);
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
    opacity: 0.52;
    transition: opacity 0.14s, border-color 0.14s;
}

body.ar-public .lwc-report-macro-toggle:hover {
    opacity: 0.82;
}

body.ar-public .lwc-report-macro-toggle.is-active {
    opacity: 1;
    border-color: color-mix(in srgb, var(--ar-section-accent, #f59e0b) 55%, transparent);
}

body.ar-public .lwc-report-macro-toggle.is-active:hover {
    opacity: 0.9;
}

body.ar-public .lwc-report-macro-toggle:focus-visible {
    outline: 2px solid var(--ar-accent);
    outline-offset: 1px;
}

body.ar-public .lwc-ribbon-hover-bank-label {
    margin-left: 8px;
    font: 600 0.74rem/1.25 "Space Grotesk", system-ui, sans-serif;
    color: var(--ar-text);
    letter-spacing: 0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(420px, 42vw);
    align-self: center;
    flex-shrink: 1;
}

body.ar-public .ar-report-infobox--ribbon-tree.ar-report-infobox--compact {
    margin-top: 10px;
    border-color: color-mix(in srgb, var(--ar-line-strong) 70%, var(--ar-line));
    background: color-mix(in srgb, var(--ar-surface-2) 72%, var(--ar-surface));
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--ar-text) 6%, transparent),
        inset 0 1px 0 color-mix(in srgb, var(--ar-text) 4%, transparent);
}

body.ar-public .ar-report-infobox-ribbon-tree {
    margin-top: 4px;
    padding: 6px 4px 3px 8px;
    border-left: 2px solid color-mix(in srgb, var(--ar-line-strong) 88%, transparent);
    border-radius: 0 8px 8px 0;
    background: color-mix(in srgb, var(--ar-surface-2) 68%, transparent);
}

body.ar-public .ar-report-infobox-tnest {
    margin: 0 0 0 4px;
    padding: 0 0 2px 8px;
    border-left: 2px solid color-mix(in srgb, var(--ar-line-strong) 82%, transparent);
}

/* Compact hierarchy tree rows (branch + leaf). Uses --ar-ribbon-depth custom property to indent. */
body.ar-public .ar-report-infobox-trow {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    border-top: 1px solid rgba(148, 163, 184, 0.18);
    font-size: 11px;
    line-height: 1.25;
    min-width: 0;
    padding-left: calc(4px + var(--ar-ribbon-depth, 0) * 12px);
}

body.ar-public .ar-report-infobox-trow--branch {
    cursor: pointer;
    font-weight: 600;
}

body.ar-public .ar-report-infobox-trow--leaf {
    align-items: baseline;
    padding: 2px 0 2px calc(6px + var(--ar-ribbon-depth, 0) * 12px);
    cursor: default;
    font-weight: 500;
}

body.ar-public .ar-report-infobox-tsw {
    width: 6px;
    height: 6px;
    border-radius: 1px;
    flex-shrink: 0;
    margin-top: 2px;
    background: var(--ar-swatch-color, #666);
}

body.ar-public .ar-report-infobox-tlabel {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.ar-public .ar-ribbon-tleaf-bank {
    font-weight: 600;
}

body.ar-public .ar-ribbon-tleaf-sep {
    opacity: 0.4;
}

body.ar-public .ar-ribbon-tleaf-product {
    opacity: 0.9;
}

body.ar-public .ar-report-infobox-trate {
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 1px;
    opacity: 0.9;
}

body.ar-public .ar-ribbon-rate-sep {
    opacity: 0.55;
}

body.ar-public .ar-ribbon-best {
    color: #22c55e;
    font-weight: 700;
    text-shadow: 0 0 2px color-mix(in srgb, #22c55e 28%, transparent);
}

@media (prefers-color-scheme: light) {
    body.ar-public .ar-ribbon-best {
        color: #15803d;
        text-shadow: none;
    }
}

body.ar-public .ar-report-infobox-twist {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    height: 1.15rem;
    min-width: 1.15rem;
    margin-right: 1px;
    border-radius: 3px;
    border: 1px solid color-mix(in srgb, var(--ar-line-strong) 90%, transparent);
    background: color-mix(in srgb, var(--ar-surface-2) 92%, transparent);
    font-size: 0.55rem;
    line-height: 1;
    color: var(--ar-text-muted);
}

body.ar-public .ar-report-infobox-trow--branch:hover .ar-report-infobox-twist,
body.ar-public .ar-report-infobox-trow--branch:focus-visible .ar-report-infobox-twist {
    border-color: color-mix(in srgb, var(--ar-text-muted) 34%, var(--ar-line-strong));
    color: var(--ar-text);
    background: color-mix(in srgb, var(--ar-text-muted) 12%, var(--ar-surface-2));
}

body.ar-public .ar-report-infobox-trow--branch:focus-visible {
    outline: 2px solid var(--ar-accent);
    outline-offset: 1px;
}

body.ar-public .ar-report-infobox--compact .ar-report-infobox-row:hover {
    background: color-mix(in srgb, var(--ar-text-muted) 7%, transparent);
}

body.ar-public .ar-report-infobox--compact .ar-report-infobox-row.is-ribbon-chart-sync {
    background: color-mix(in srgb, var(--ar-text-muted) 11%, transparent);
}

body.ar-public .ar-report-infobox-trow--branch:hover {
    background: color-mix(in srgb, var(--ar-text-muted) 7%, transparent);
    border-radius: 6px;
}

body.ar-public .ar-report-infobox-trow--branch.is-ribbon-chart-sync {
    background: color-mix(in srgb, var(--ar-text-muted) 10%, transparent);
    border-radius: 6px;
    box-shadow: inset 2px 0 0 color-mix(in srgb, var(--ar-text-muted) 36%, transparent);
}

body.ar-public .lwc-focus-bank-chip-logo {
    display: block;
    width: 24px;
    height: 24px;
    object-fit: contain;
    border-radius: 4px;
}

body.ar-public .lwc-focus-bank-chip-fallback {
    font: 700 0.7rem/1 "Space Grotesk", system-ui, sans-serif;
    color: var(--ar-text);
}

body.ar-public .lwc-report-moves-strip {
    display: grid;
    gap: 6px;
    flex-shrink: 0;
    margin-top: 8px;
    padding: 6px 8px 8px;
    border: 1px solid var(--ar-line);
    border-radius: 6px;
    background: color-mix(in srgb, var(--ar-surface-2) 76%, transparent);
}

body.ar-public .lwc-report-moves-strip-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font: 700 0.62rem/1 "Space Grotesk", system-ui, sans-serif;
    color: var(--ar-text-muted);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.ar-public .lwc-report-moves-strip-plot {
    position: relative;
    display: flex;
    align-items: stretch;
    gap: 1px;
    height: 56px;
    overflow: hidden;
}

body.ar-public .lwc-report-moves-strip-plot::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    border-top: 1px solid color-mix(in srgb, var(--ar-text-muted) 28%, transparent);
    pointer-events: none;
}

body.ar-public .lwc-report-moves-strip-col {
    position: relative;
    flex: 1 1 0;
    min-width: 1px;
    display: grid;
    grid-template-rows: 1fr 1fr;
}

body.ar-public .lwc-report-moves-strip-lane {
    position: relative;
}

body.ar-public .lwc-report-moves-strip-bar {
    position: absolute;
    left: 0;
    right: 0;
    display: block;
    border-radius: 2px;
    opacity: 0.92;
}

body.ar-public .lwc-report-moves-strip-lane.is-up .lwc-report-moves-strip-bar {
    bottom: 2px;
}

body.ar-public .lwc-report-moves-strip-lane.is-down .lwc-report-moves-strip-bar {
    top: 2px;
}

@media (max-width: 1040px) {
    body.ar-public .lwc-focus-bank-tray-wrap {
        flex-basis: 100%;
        padding-left: 0;
    }
}

@media (max-width: 760px) {
    body.ar-public .lwc-focus-bank-tray-wrap {
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 6px 0;
    }

    body.ar-public .lwc-focus-bank-tray {
        flex: 1 1 100%;
        min-width: 0;
        max-height: none;
        padding-bottom: 1px;
    }

    body.ar-public .lwc-ribbon-hover-bank-label {
        order: 2;
        flex: 1 1 100%;
        margin-left: 0;
        max-width: 100%;
        font-size: 0.8rem;
        line-height: 1.3;
    }

    body.ar-public .lwc-focus-bank-chip {
        width: 28px;
        height: 28px;
    }

    body.ar-public .ar-report-infobox--ribbon-tree.ar-report-infobox--compact {
        margin-top: 12px;
    }

    body.ar-public .ar-report-infobox-ribbon-tree {
        padding: 8px 0 4px 10px;
    }
}

@media (max-width: 420px) {
    body.ar-public .lwc-focus-bank-chip {
        width: 26px;
        height: 26px;
    }

    body.ar-public .lwc-ribbon-hover-bank-label {
        font-size: 0.78rem;
    }

    body.ar-public .ar-report-infobox-ribbon-tree {
        padding-left: 8px;
    }

    body.ar-public .lwc-focus-bank-chip-metric {
        font-size: 0.68rem;
    }

    body.ar-public .lwc-focus-bank-chip-sub {
        display: none;
    }
}

@media (max-width: 360px) {
    body.ar-public .lwc-report-range {
        gap: 4px;
        padding-bottom: 6px;
    }

    body.ar-public .lwc-report-range-row {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 2px 4px 0;
        margin-right: -2px;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }

    body.ar-public .lwc-report-range-row::-webkit-scrollbar {
        display: none;
    }

    body.ar-public .lwc-report-range-row > * {
        flex: 0 0 auto;
        scroll-snap-align: start;
    }

    body.ar-public .ar-report-underchart-tree {
        padding: 8px 10px 10px;
    }

    body.ar-public .ar-report-underchart-tree-meta {
        font-size: 0.62rem;
        line-height: 1.35;
    }

    body.ar-public .ar-report-infobox-ribbon-tree {
        padding: 6px 0 3px 6px;
    }

    body.ar-public .ar-report-infobox-tnest {
        margin-left: 2px;
        padding-left: 6px;
    }

    body.ar-public .ar-report-infobox-trow {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: start;
        gap: 4px 6px;
        padding-top: 4px;
        padding-bottom: 4px;
    }

    body.ar-public .ar-report-infobox-trow--leaf {
        padding-top: 3px;
        padding-bottom: 3px;
    }

    body.ar-public .ar-report-infobox-tlabel {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        line-height: 1.2;
    }

    body.ar-public .ar-report-infobox-trate {
        justify-self: end;
        text-align: right;
        white-space: nowrap;
    }
}