/* #region zone:desk.style.elliott — แผงคลื่น Elliott ใต้กราฟ (แผนหลัก/สำรอง) และสวิตช์ในรายการตัวชี้วัด */
/* Owner 2026-10-04: an "Elliott Wave" chart layer plus a plan panel. Reuses the Desk tokens only; every gap is
   >= var(--sp-2) (8px) and the layout is fluid: the two scenarios sit side by side when there is room and stack
   when there is not (auto-fit grid, no breakpoint), so it reflows at 360-1440 and on live resize. */
.sw-ew {
  background: repeating-linear-gradient(90deg, #4c8dff 0 4px, #f59e0b 4px 8px);
}

.ew-card {
  gap: var(--sp-3);
}
.ew-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--muted);
}
.ew-status[data-state='error'] .ew-status-text {
  color: var(--down);
}
.ew-retry {
  padding: var(--sp-1) var(--sp-2);
}

.ew-body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  min-width: 0;
}
.ew-top {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.ew-headline {
  font-size: var(--fs-xl);
  font-weight: 700;
  color: var(--text);
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.ew-conf,
.ew-wedge {
  font-size: var(--fs-md);
  color: var(--muted);
  line-height: 1.5;
}
.ew-meter {
  height: 8px;
  border-radius: var(--u-radius-pill);
  background: var(--panel2);
  overflow: hidden;
  max-width: 320px;
}
.ew-meter-fill {
  display: block;
  height: 100%;
  border-radius: var(--u-radius-pill);
  background: var(--accent);
}

.ew-scns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: var(--sp-3);
  align-items: start;
}
.ew-scn {
  min-width: 0;
  padding: var(--sp-3);
  border: 1px solid var(--line);
  border-radius: var(--r-control);
  background: var(--panel2);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.ew-scn-primary {
  border-color: var(--accent);
}
.ew-scn-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2);
}
.ew-scn-title {
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--text);
  overflow-wrap: anywhere;
  min-width: 0;
}
.ew-chip {
  font-size: var(--fs-xs);
  font-weight: 700;
  padding: var(--sp-1) var(--sp-2);
  border-radius: var(--u-radius-pill);
  flex-shrink: 0;
}
.ew-chip-up {
  background: var(--up-soft);
  color: var(--up);
}
.ew-chip-down {
  background: var(--down-soft);
  color: var(--down);
}
.ew-scn-sum,
.ew-scn-inv,
.ew-scn-conf {
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--muted);
  line-height: 1.5;
}

.ew-rows {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.ew-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-3);
  font-size: var(--fs-md);
}
.ew-row-k {
  color: var(--muted);
  min-width: 0;
  overflow-wrap: anywhere;
}
.ew-row-v {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
  color: var(--text);
}
.ew-tone-target {
  color: var(--up);
}
.ew-tone-stop {
  color: var(--down);
}
.ew-tone-warn {
  color: var(--amber);
}
.ew-scn-note {
  margin: 0;
  padding: var(--sp-2) var(--sp-3);
  border-radius: var(--r-sm, 6px);
  background: var(--amber-soft);
  color: var(--amber);
  font-size: var(--fs-md);
  font-weight: 600;
  overflow-wrap: anywhere;
}

.ew-evidence {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.ew-h3 {
  margin: 0;
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--text);
}
.ew-ev-line,
.ew-explain {
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--muted);
  line-height: 1.55;
}
/* #endregion */
