/* Opt-in chart viewer: isolated from calculators, navigation and ads. */
img[data-kb-chart-zoom] { cursor: zoom-in; }
img[data-kb-chart-zoom]:focus-visible { outline: 3px solid #2176f5; outline-offset: 5px; }
.kb-chart-zoom-prompt { display: block; margin-top: 8px; color: #456488; font-size: .86rem; font-weight: 600; }
.kb-chart-lightbox[hidden] { display: none !important; }
.kb-chart-lightbox { position: fixed; inset: 0; z-index: 2147483640; background: rgba(8, 18, 37, .97); color: #fff; display: flex; flex-direction: column; font-family: system-ui, sans-serif; overscroll-behavior: contain; }
.kb-chart-toolbar { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-height: 64px; padding: 10px max(16px, env(safe-area-inset-right)); flex: 0 0 auto; }
.kb-chart-caption { margin-right: auto; font-weight: 700; font-size: .95rem; }
.kb-chart-level { font-size: .85rem; font-variant-numeric: tabular-nums; min-width: 46px; text-align: center; }
.kb-chart-control { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border: 1px solid #7183a3; border-radius: 12px; background: #1b3152; color: white; font-size: 27px; line-height: 1; cursor: pointer; }
.kb-chart-control:hover,.kb-chart-control:focus-visible { background: #2c5484; outline-offset: 2px; }
.kb-chart-close { margin-left: 4px; }
.kb-chart-surface { flex: 1 1 auto; min-height: 0; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; touch-action: none; user-select: none; cursor: zoom-in; }
.kb-chart-surface.is-zoomed { cursor: grab; }
.kb-chart-surface.is-zoomed:active { cursor: grabbing; }
.kb-chart-enlarged { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; transform-origin: center center; will-change: transform; pointer-events: none; }
.kb-chart-hint { margin: 0; padding: 12px 18px max(12px, env(safe-area-inset-bottom)); text-align: center; color: #c5d5ef; font-size: .8rem; }
@media (max-width: 460px) { .kb-chart-toolbar { gap: 5px; padding-inline: 10px; } .kb-chart-caption { font-size: .77rem; } .kb-chart-hint { font-size: .72rem; } }