.wsdex-market-canvas__viewport {
 position: relative;
 display: grid;
 gap: 1rem;
 width: 100%;
 min-width: 0;
 color: var(--wsdex-text);
}

.wsdex-market-canvas__stage {
 touch-action: pan-y;
 user-select: none;
}

.wsdex-market-canvas__surface {
 cursor: crosshair;
}

.wsdex-market-canvas__surface:focus-visible {
 outline: 2px solid var(--wsdex-accent);
 outline-offset: -3px;
}

.wsdex-market-canvas__tooltip {
 position: absolute;
 z-index: 8;
 max-width: min(28rem,calc(100% - 1rem));
 padding: .5rem .65rem;
 border: 1px solid var(--wsdex-tooltip-border,var(--wsdex-border-strong));
 border-radius: .5rem;
 background: var(--wsdex-tooltip-surface);
 color: var(--wsdex-tooltip-text,#f3f6fa);
 font-size: .72rem;
 line-height: 1.45;
 pointer-events: none;
 box-shadow: 0 .45rem 1.1rem rgba(0,0,0,.22);
}

.wsdex-market-canvas__point-detail {
 position: absolute;
 width: 1px;
 height: 1px;
 padding: 0;
 margin: -1px;
 overflow: hidden;
 clip: rect(0,0,0,0);
 white-space: nowrap;
 border: 0;
}

.wsdex-market-canvas__summary-list {
 grid-template-columns: repeat(7,minmax(0,1fr));
}

.wsdex-market-canvas[data-wsdex-canvas-state="partial"] .wsdex-market-canvas__status,
.wsdex-market-canvas[data-wsdex-canvas-state="stale"] .wsdex-market-canvas__status {
 border-color: color-mix(in srgb,#c9a400 55%,var(--wsdex-border));
 color: #b89600;
}

.wsdex-market-canvas[data-wsdex-canvas-state="error"] .wsdex-market-canvas__status,
.wsdex-market-canvas[data-wsdex-canvas-state="unavailable"] .wsdex-market-canvas__status {
 border-color: color-mix(in srgb,#c44242 55%,var(--wsdex-border));
 color: #c44242;
}

.wsdex-provider-filter__item[data-wsdex-provider-state="blocked"],
.wsdex-provider-filter__item[data-wsdex-provider-state="error"] {
 border-color: color-mix(in srgb,#c44242 48%,var(--wsdex-border));
}

.wsdex-provider-filter__item[data-wsdex-provider-state="live"] .wsdex-provider-filter__state {
 color: var(--wsdex-candle-up);
}

.wsdex-provider-filter__item[data-wsdex-provider-state="blocked"] .wsdex-provider-filter__state,
.wsdex-provider-filter__item[data-wsdex-provider-state="error"] .wsdex-provider-filter__state {
 color: var(--wsdex-candle-down);
}

.wsdex-market-canvas__viewport--full {
 position: fixed;
 inset: 0;
 z-index: 100000;
 display: grid;
 grid-template-rows: auto auto minmax(0,1fr) auto;
 gap: .7rem;
 width: 100vw;
 height: 100dvh;
 max-width: none;
 padding: .8rem;
 overflow: auto;
 background: var(--wsdex-surface);
}

.wsdex-market-canvas__viewport--full .wsdex-market-canvas__header {
 grid-row: 1;
}

.wsdex-market-canvas__viewport--full .wsdex-market-canvas__controls {
 grid-row: 2;
}

.wsdex-market-canvas__viewport--full .wsdex-market-canvas__chart-region {
 grid-row: 3;
 grid-template-rows: minmax(0,1fr) auto;
 min-height: 0;
}

.wsdex-market-canvas__viewport--full .wsdex-market-canvas__stage {
 min-height: min(68dvh,64rem);
 height: 100%;
 touch-action: none;
}

.wsdex-market-canvas__viewport--full .wsdex-market-canvas__summary {
 grid-row: 4;
}

.wsdex-canvas-viewport-open {
 overflow: hidden;
}

@media (max-width: 1200px) {
 .wsdex-market-canvas__summary-list {
  grid-template-columns: repeat(4,minmax(0,1fr));
 }
}

@media (max-width: 760px) {
 .wsdex-market-canvas__summary-list {
  grid-template-columns: repeat(2,minmax(0,1fr));
 }

 .wsdex-market-canvas__viewport--full {
  padding: .55rem;
 }
}

@media (max-width: 480px) {
 .wsdex-market-canvas__summary-list {
  grid-template-columns: 1fr;
 }
}

.wsdex-canvas-omode-mount {
 display: block;
 width: 100%;
 min-width: 0;
}

.wsdex-canvas-omode-mount > [hidden] {
 display: none;
}

.wsdex-canvas-omode-fallback {
 display: grid;
 gap: .45rem;
 width: 100%;
 min-width: 0;
 padding: clamp(.85rem,2vw,1.2rem);
 border: 1px solid var(--wsdex-border,#d7dde5);
 border-radius: .75rem;
 background: var(--wsdex-surface,#fff);
 color: var(--wsdex-text,#1d2733);
 overflow-wrap: anywhere;
}

.wsdex-canvas-omode-fallback h2,
.wsdex-canvas-omode-fallback p {
 margin: 0;
}

.wsdex-canvas-omode-fallback h2 {
 font-size: clamp(1rem,2vw,1.25rem);
 line-height: 1.25;
}

.wsdex-canvas-omode-fallback__runtime {
 color: var(--wsdex-text-muted,#647184);
 font-size: .875rem;
}

.wsdex-canvas-omode-mount[data-wsdex-runtime-state="runtime_unavailable"] .wsdex-canvas-omode-fallback,
.wsdex-canvas-omode-fallback[data-wsdex-runtime-state="invalid_config"] {
 border-color: color-mix(in srgb,#c44242 45%,var(--wsdex-border,#d7dde5));
}

@media (prefers-reduced-motion: reduce) {
 .wsdex-canvas-omode-mount *,
 .wsdex-market-canvas * {
  scroll-behavior: auto;
  transition-duration: .01ms;
  animation-duration: .01ms;
  animation-iteration-count: 1;
 }
}