PineDesk

<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&amp;family=IBM+Plex+Sans:wght@400;500;600&amp;display=swap" />
<style>
/* Layout: terminal. Header strip, chart column left, tabbed Pine/Watchlist/Backtest panel right; stacks on phones. */
:root {
  --bg: #f3f5f8; --panel: #ffffff; --chart: #ffffff; --fg: #1a2230; --muted: #667284; --line: #d9dfe8; --grid: #eef1f5;
  --accent: #2459d6; --accent-fg: #ffffff; --up: #0f9d7a; --down: #d6374a; --warn: #b7791f; --field: #f6f8fb; --hover: #eaeff6;
  --sel: rgba(36, 89, 214, .12);
  --font-ui: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --syn-kw: #8a3ffc; --syn-fn: #1d5fd1; --syn-num: #b45309; --syn-str: #0f7b5f; --syn-com: #8b95a5; --syn-const: #c2410c;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --bg: #0b0f14; --panel: #11171e; --chart: #0e1319; --fg: #d8dee8; --muted: #7b8796; --line: #212a35; --grid: #19212b;
  --accent: #4d8dff; --accent-fg: #07101f; --up: #22b894; --down: #ef5062; --warn: #e0b04a; --field: #0b1015; --hover: #18212b;
  --sel: rgba(77, 141, 255, .16);
  --syn-kw: #c49bff; --syn-fn: #6fb0ff; --syn-num: #f0b36a; --syn-str: #6fd4b0; --syn-com: #5f6b7a; --syn-const: #ff9b6b;
  color-scheme: dark; } }
:root[data-theme="dark"] {
  --bg: #0b0f14; --panel: #11171e; --chart: #0e1319; --fg: #d8dee8; --muted: #7b8796; --line: #212a35; --grid: #19212b;
  --accent: #4d8dff; --accent-fg: #07101f; --up: #22b894; --down: #ef5062; --warn: #e0b04a; --field: #0b1015; --hover: #18212b;
  --sel: rgba(77, 141, 255, .16);
  --syn-kw: #c49bff; --syn-fn: #6fb0ff; --syn-num: #f0b36a; --syn-str: #6fd4b0; --syn-com: #5f6b7a; --syn-const: #ff9b6b;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { background: var(--bg); color: var(--fg); font: 13px/1.45 var(--font-ui); padding-block: 0; padding-left: max(12px, env(safe-area-inset-left, 0px)); padding-right: max(12px, env(safe-area-inset-right, 0px)); }
button, select, input, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.app { height: 100%; display: grid; grid-template-columns: minmax(0, 1fr) 420px; grid-template-rows: auto minmax(0, 1fr); gap: 10px; padding-block: 10px; }
.top { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; min-width: 0; }
.brand { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15px; letter-spacing: .01em; margin-right: 4px; }
.brand svg { display: block; }
.sep { width: 1px; height: 22px; background: var(--line); }
.grow { flex: 1 1 auto; }
.field { background: var(--field); border: 1px solid var(--line); border-radius: 6px; height: 30px; padding: 0 8px; min-width: 0; }
select.field { padding-right: 4px; }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: var(--field); }
.seg button { border: 0; background: transparent; height: 28px; padding: 0 10px; color: var(--muted); font-family: var(--font-mono); font-size: 12px; border-right: 1px solid var(--line); }
.seg button:last-child { border-right: 0; }
.seg button:hover { background: var(--hover); color: var(--fg); }
.seg button[aria-pressed="true"], .seg button[aria-selected="true"] { background: var(--sel); color: var(--accent); font-weight: 500; }
.seg button:disabled { opacity: .4; cursor: not-allowed; }
.btn { height: 30px; padding: 0 12px; border-radius: 6px; border: 1px solid var(--line); background: var(--field); display: inline-flex; align-items: center; gap: 6px; }
.btn:hover { background: var(--hover); }
.btn.primary { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); font-weight: 500; }
.btn.primary:hover { filter: brightness(1.08); }
.btn.icon { width: 30px; padding: 0; justify-content: center; }
.btn[aria-pressed="true"] { background: var(--sel); color: var(--accent); border-color: var(--accent); }
.demo-tag { font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--warn); border: 1px solid currentColor; border-radius: 4px; padding: 1px 5px; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.btn[aria-pressed="true"] .live-dot { background: var(--down); animation: pulse 1.2s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .btn[aria-pressed="true"] .live-dot { animation: none; } }

.chartcol { position: relative; min-width: 0; min-height: 0; background: var(--chart); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
#cv { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: pan-y; cursor: crosshair; outline-offset: -2px; }
.legend { position: absolute; left: 10px; top: 8px; right: 70px; pointer-events: none; display: flex; flex-direction: column; gap: 3px; font-family: var(--font-mono); font-size: 11.5px; }
.legend .row { display: flex; flex-wrap: wrap; gap: 2px 12px; align-items: baseline; }
.legend .sym { font-family: var(--font-ui); font-weight: 600; font-size: 13px; }
.legend .k { color: var(--muted); } .legend .up { color: var(--up); } .legend .down { color: var(--down); }
.legend .ind { color: var(--muted); } .legend .ind b { font-weight: 500; }

.side { min-width: 0; min-height: 0; display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.tabs { display: flex; border-bottom: 1px solid var(--line); }
.tabs button { flex: 1; border: 0; background: transparent; height: 38px; color: var(--muted); border-bottom: 2px solid transparent; font-weight: 500; }
.tabs button:hover { color: var(--fg); background: var(--hover); }
.tabs button[aria-selected="true"] { color: var(--fg); border-bottom-color: var(--accent); }
.pane { display: none; flex: 1 1 auto; min-height: 0; flex-direction: column; }
.pane.on { display: flex; }

.chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--line); align-items: center; }
.chip { display: inline-flex; align-items: center; height: 26px; border: 1px solid var(--line); border-radius: 13px; background: var(--field); overflow: hidden; max-width: 100%; }
.chip.active { border-color: var(--accent); background: var(--sel); }
.chip button { border: 0; background: transparent; height: 100%; padding: 0 8px; color: var(--muted); display: inline-flex; align-items: center; }
.chip button:hover { color: var(--fg); background: var(--hover); }
.chip .name { color: var(--fg); max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.chip .off { opacity: .45; }
.edbar { display: flex; flex-wrap: nowrap; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--line); align-items: center; }
.edbar select { flex: 1 1 140px; min-width: 0; max-width: 240px; } .edbar .btn { flex: none; }
.editor { position: relative; flex: 1 1 200px; min-height: 180px; display: grid; grid-template-columns: 38px minmax(0, 1fr); background: var(--field); font-family: var(--font-mono); font-size: 12.5px; line-height: 20px; overflow: hidden; }
.gutter { overflow: hidden; color: var(--muted); text-align: right; user-select: none; border-right: 1px solid var(--line); padding-top: 8px; }
.gutter div { padding-right: 8px; height: 20px; }
.gutter .err { color: var(--down); background: rgba(239, 80, 98, .14); }
.stack { position: relative; min-width: 0; }
.stack pre, .stack textarea { position: absolute; inset: 0; margin: 0; padding: 8px 10px; font: inherit; line-height: inherit; white-space: pre; overflow: auto; tab-size: 4; border: 0; }
.stack pre { pointer-events: none; color: var(--fg); overflow: hidden; }
.stack pre .ln { height: 20px; }
.stack pre .ln.err { background: rgba(239, 80, 98, .14); }
.stack textarea { background: transparent; color: transparent; caret-color: var(--fg); resize: none; outline: none; }
.stack textarea::selection { background: var(--sel); color: transparent; }
.t-kw { color: var(--syn-kw); } .t-fn { color: var(--syn-fn); } .t-num { color: var(--syn-num); } .t-str { color: var(--syn-str); } .t-com { color: var(--syn-com); font-style: italic; } .t-const { color: var(--syn-const); }
.status { padding: 7px 10px; border-top: 1px solid var(--line); font-family: var(--font-mono); font-size: 11.5px; color: var(--muted); min-height: 32px; display: flex; gap: 8px; align-items: baseline; }
.status.bad { color: var(--down); }
.status.ok::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--up); align-self: center; flex: none; }
.inputs { border-top: 1px solid var(--line); padding: 8px 10px; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px 12px; max-height: 150px; overflow: auto; }
.inputs:empty { display: none; }
.inputs label { display: flex; flex-direction: column; gap: 3px; font-size: 11px; color: var(--muted); min-width: 0; }
.inputs .field { height: 28px; color: var(--fg); font-family: var(--font-mono); width: 100%; }
.inputs .chk { flex-direction: row; align-items: center; gap: 8px; color: var(--fg); font-size: 12px; }
.inputs-h { grid-column: 1 / -1; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }

.wl { overflow: auto; flex: 1; }
.wl-row { display: grid; grid-template-columns: minmax(0, 1fr) 64px auto; align-items: center; gap: 10px; width: 100%; padding: 9px 12px; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; }
.wl-row:hover { background: var(--hover); }
.wl-row[aria-current="true"] { background: var(--sel); }
.wl-row .s { font-weight: 600; } .wl-row .n { color: var(--muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl-row .p { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.wl-row .c { font-family: var(--font-mono); font-size: 11.5px; }
.up { color: var(--up); } .down { color: var(--down); }
.wl-note { padding: 10px 12px; color: var(--muted); font-size: 12px; }

.report { overflow: auto; flex: 1; padding: 12px; display: flex; flex-direction: column; gap: 14px; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
.stat { border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px; background: var(--field); min-width: 0; }
.stat .l { font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.stat .v { font-family: var(--font-mono); font-size: 16px; font-variant-numeric: tabular-nums; margin-top: 2px; overflow-wrap: anywhere; }
.eq { width: 100%; height: 130px; display: block; border: 1px solid var(--line); border-radius: 6px; background: var(--field); }
.tbl-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; }
table { border-collapse: collapse; width: 100%; font-family: var(--font-mono); font-size: 11.5px; font-variant-numeric: tabular-nums; }
th, td { padding: 6px 8px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--line); }
th:first-child, td:first-child { text-align: left; }
th { color: var(--muted); font-weight: 500; position: sticky; top: 0; background: var(--panel); }
.empty { color: var(--muted); padding: 24px 16px; text-align: center; line-height: 1.6; }
.h { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0 0 6px; font-weight: 500; }

@media (max-width: 900px) {
  html, body { height: auto; }
  .app { height: auto; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; }
  .chartcol { height: 62vh; min-height: 360px; }
  .side { min-height: 560px; }
  .editor { flex-basis: 260px; }
  .sep { display: none; }
}

#symIn { width: 130px; font-family: var(--font-mono); text-transform: uppercase; }
.demo-tag.real { color: var(--up); }
.notice { position: absolute; left: 12px; right: 70px; bottom: 12px; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 9px 12px; border-radius: 8px; background: var(--panel); border: 1px solid var(--line); box-shadow: 0 6px 24px rgba(0,0,0,.25); font-size: 12.5px; }
.notice.center { left: 50%; right: auto; bottom: auto; top: 50%; transform: translate(-50%, -50%); width: min(440px, calc(100% - 32px)); flex-direction: column; align-items: stretch; padding: 16px; }
.notice.warn { border-color: var(--warn); }
.notice b { font-weight: 600; }
.notice p { margin: 0; color: var(--muted); line-height: 1.5; }
.notice .row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.notice .field { flex: 1 1 180px; font-family: var(--font-mono); }
.notice a { color: var(--accent); }
.spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--line); border-top-color: var(--accent); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spin { animation-duration: 3s; } }
.wl-row.nospark { grid-template-columns: minmax(0, 1fr) auto; }
.wl-tools { padding: 8px 12px; border-bottom: 1px solid var(--line); display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: 12px; }
@media (max-width: 900px) { #symIn { width: 110px; } .notice { right: 12px; } }
</style>

<div class="app">
  <header class="top">
    <div class="brand">
      <svg width="22" height="22" viewbox="0 0 22 22" aria-hidden="true"><rect x="3" y="7" width="4" height="9" rx="1" fill="var(--up)"/><rect x="5" y="3" width="0.01" height="0.01"/><path d="M5 4v14" stroke="var(--up)" stroke-width="1.4"/><rect x="10" y="4" width="4" height="10" rx="1" fill="var(--down)"/><path d="M12 2v18" stroke="var(--down)" stroke-width="1.4"/><rect x="17" y="8" width="4" height="8" rx="1" fill="var(--accent)"/><path d="M19 5v14" stroke="var(--accent)" stroke-width="1.4"/></path></rect></path></rect></path></rect></rect></svg>
      PineDesk
    </div>
    <select id="market" class="field" aria-label="Market">
      <option value="crypto" />Crypto<option value="stocks" />Stocks<option value="forex" />Forex<option value="demo" />Demo
    </select>
    <input id="symIn" class="field" list="symList" aria-label="Symbol" placeholder="Symbol" autocomplete="off" autocapitalize="characters" spellcheck="false" />
    <datalist id="symList"></datalist>
    <span class="demo-tag" id="srcTag"></span>
    <div class="seg" id="tfs" role="group" aria-label="Timeframe"></div>
    <div class="seg" id="types" role="group" aria-label="Chart type">
      <button data-t="candles" aria-pressed="true">Candles</button><button data-t="line" aria-pressed="false">Line</button><button data-t="area" aria-pressed="false">Area</button>
    </div>
    <button class="btn" id="volBtn" aria-pressed="true">Volume</button>
    <button class="btn" id="liveBtn" aria-pressed="false" title="Simulated tick feed. Scripts re-run on every tick."><span class="live-dot"></span>Live</button>
    <span class="grow"></span>
    <button class="btn" id="csvBtn" title="Columns: time, open, high, low, close, volume">Import CSV</button>
    <input type="file" id="csvFile" accept=".csv,text/csv,text/plain" hidden />
    <button class="btn" id="keyBtn" hidden title="Set your Twelve Data API key">API key</button>
    <button class="btn" id="themeBtn" title="Theme: Auto follows your blog">Theme: Auto</button>
  </header>

  <main class="chartcol">
    <canvas id="cv" tabindex="0" aria-label="Price chart. Drag to pan, scroll to zoom, double-click to reset."></canvas>
    <div class="legend" id="legend"></div>
    <div class="notice" id="notice" hidden></div>
  </main>

  <aside class="side">
    <div class="tabs" role="tablist">
      <button role="tab" id="tab-ed" aria-selected="true" data-p="ed">Pine Editor</button>
      <button role="tab" id="tab-wl" aria-selected="false" data-p="wl">Watchlist</button>
      <button role="tab" id="tab-bt" aria-selected="false" data-p="bt">Backtest</button>
    </div>
    <section class="pane on" id="p-ed" role="tabpanel" aria-labelledby="tab-ed">
      <div class="chips" id="chips"></div>
      <div class="edbar">
        <select id="examples" class="field" aria-label="Load example"><option value="" />Load example…</select>
        <span class="grow"></span>
        <button class="btn" id="newBtn">New</button>
        <button class="btn primary" id="applyBtn" title="Ctrl/Cmd + Enter">Apply to chart</button>
      </div>
      <div class="editor" id="editor">
        <div class="gutter" id="gutter"></div>
        <div class="stack"><pre id="hl" aria-hidden="true"></pre><textarea id="code" spellcheck="false" autocapitalize="off" autocomplete="off" wrap="off" aria-label="Pine Script code"></textarea></div>
      </div>
      <div class="inputs" id="inputs"></div>
      <div class="status" id="status"></div>
    </section>
    <section class="pane" id="p-wl" role="tabpanel" aria-labelledby="tab-wl">
      <div class="wl" id="wl"></div>
      <div class="wl-note" id="wlNote"></div>
    </section>
    <section class="pane" id="p-bt" role="tabpanel" aria-labelledby="tab-bt">
      <div class="report" id="report"></div>
    </section>
  </aside>
</div>
<script>
/* Pine Script interpreter (subset of v5/v4). Part A: lexer + parser */
(function (root) {
'use strict';
const NA = NaN;
class PineError extends Error { constructor(msg, line) { super(msg); this.line = line; } }
let UID = 1;
const uid = () => UID++;

function tokenize(text, line) {
  const toks = []; let i = 0;
  while (i < text.length) {
    const c = text[i];
    if (c === ' ' || c === '\t') { i++; continue; }
    if (/[0-9]/.test(c) || (c === '.' && /[0-9]/.test(text[i + 1] || ''))) {
      const m = /^(\d+\.?\d*|\.\d+)(e[+-]?\d+)?/i.exec(text.slice(i));
      toks.push({ t: 'num', v: parseFloat(m[0]) }); i += m[0].length; continue;
    }
    if (c === '"' || c === "'") {
      let j = i + 1, s = '';
      while (j < text.length && text[j] !== c) {
        if (text[j] === '\\') { j++; s += text[j] === 'n' ? '\n' : text[j]; } else s += text[j];
        j++;
      }
      toks.push({ t: 'str', v: s }); i = j + 1; continue;
    }
    if (c === '#') {
      const m = /^#[0-9a-fA-F]{6,8}/.exec(text.slice(i));
      if (m) { toks.push({ t: 'str', v: m[0] }); i += m[0].length; continue; }
    }
    if (/[A-Za-z_]/.test(c)) {
      const m = /^[A-Za-z_][A-Za-z0-9_]*(\.[A-Za-z_][A-Za-z0-9_]*)*/.exec(text.slice(i));
      toks.push({ t: 'id', v: m[0] }); i += m[0].length; continue;
    }
    const two = text.substr(i, 2);
    if ([':=', '==', '!=', '>=', '<=', '=>', '+=', '-=', '*=', '/=', '%='].includes(two)) {
      toks.push({ t: 'op', v: two }); i += 2; continue;
    }
    if ('+-*/%<>=?:,()[]'.includes(c)) { toks.push({ t: 'op', v: c }); i++; continue; }
    throw new PineError('Unexpected character "' + c + '"', line);
  }
  return toks;
}

function stripComment(l) {
  let q = null;
  for (let i = 0; i < l.length; i++) {
    const c = l[i];
    if (q) { if (c === '\\') i++; else if (c === q) q = null; }
    else if (c === '"' || c === "'") q = c;
    else if (c === '/' && l[i + 1] === '/') return l.slice(0, i);
  }
  return l;
}
function depthOf(t) {
  let d = 0, q = null;
  for (let i = 0; i < t.length; i++) {
    const c = t[i];
    if (q) { if (c === '\\') i++; else if (c === q) q = null; continue; }
    if (c === '"' || c === "'") q = c;
    else if (c === '(' || c === '[') d++;
    else if (c === ')' || c === ']') d--;
  }
  return d;
}
function needsMore(t) {
  if (depthOf(t) > 0) return true;
  if (t.endsWith('=>')) return false;
  return /[-+*\/%<>=,?:]$/.test(t) || /\b(and|or)$/.test(t);
}

function preprocess(src) {
  const raw = src.replace(/\r/g, '').split('\n');
  const out = []; let buf = null;
  for (let n = 0; n < raw.length; n++) {
    const l = stripComment(raw[n]);
    if (buf) {
      if (!l.trim()) continue;
      buf.text += ' ' + l.trim();
      if (!needsMore(buf.text)) { out.push(buf); buf = null; }
      continue;
    }
    if (!l.trim()) continue;
    const indent = l.match(/^[ \t]*/)[0].replace(/\t/g, '    ').length;
    const text = l.trim();
    const prev = out[out.length - 1];
    if (prev && indent > prev.indent && /^(\?|:(?!=)|and\b|or\b|[-+*\/%]|==|!=|<|>)/.test(text)) {
      prev.text += ' ' + text;
      if (needsMore(prev.text)) { out.pop(); buf = prev; }
      continue;
    }
    const item = { indent, text, line: n + 1 };
    if (needsMore(text)) buf = item; else out.push(item);
  }
  if (buf) out.push(buf);
  return out;
}

class Parser {
  constructor(toks, line) { this.t = toks; this.i = 0; this.line = line; }
  peek() { return this.t[this.i]; }
  next() { return this.t[this.i++]; }
  isOp(v) { const k = this.peek(); return !!k && k.t === 'op' && k.v === v; }
  isKw(v) { const k = this.peek(); return !!k && k.t === 'id' && k.v === v; }
  eat(v) { if (!this.isOp(v)) this.err('Expected "' + v + '"'); this.i++; }
  end() { if (this.i < this.t.length) this.err('Unexpected "' + this.t[this.i].v + '"'); }
  err(m) { throw new PineError(m, this.line); }
  expr() { return this.ternary(); }
  ternary() {
    const c = this.or();
    if (this.isOp('?')) { this.i++; const a = this.ternary(); this.eat(':'); const b = this.ternary(); return { k: 'tern', c, a, b }; }
    return c;
  }
  or() { let l = this.and(); while (this.isKw('or')) { this.i++; l = { k: 'bin', op: 'or', l, r: this.and() }; } return l; }
  and() { let l = this.not(); while (this.isKw('and')) { this.i++; l = { k: 'bin', op: 'and', l, r: this.not() }; } return l; }
  not() { if (this.isKw('not')) { this.i++; return { k: 'un', op: 'not', e: this.not() }; } return this.cmp(); }
  cmp() {
    let l = this.add();
    for (;;) {
      const k = this.peek();
      if (k && k.t === 'op' && ['==', '!=', '<', '>', '<=', '>='].includes(k.v)) { this.i++; l = { k: 'bin', op: k.v, l, r: this.add() }; } else break;
    }
    return l;
  }
  add() {
    let l = this.mul();
    for (;;) {
      const k = this.peek();
      if (k && k.t === 'op' && (k.v === '+' || k.v === '-')) { this.i++; l = { k: 'bin', op: k.v, l, r: this.mul() }; } else break;
    }
    return l;
  }
  mul() {
    let l = this.unary();
    for (;;) {
      const k = this.peek();
      if (k && k.t === 'op' && (k.v === '*' || k.v === '/' || k.v === '%')) { this.i++; l = { k: 'bin', op: k.v, l, r: this.unary() }; } else break;
    }
    return l;
  }
  unary() {
    if (this.isOp('-')) { this.i++; return { k: 'un', op: '-', e: this.unary() }; }
    if (this.isOp('+')) { this.i++; return this.unary(); }
    return this.postfix();
  }
  postfix() {
    let e = this.primary();
    while (this.isOp('[')) { this.i++; const n = this.expr(); this.eat(']'); e = { k: 'idx', e, n, id: uid() }; }
    return e;
  }
  primary() {
    const k = this.next();
    if (!k) this.err('Unexpected end of line');
    if (k.t === 'num') return { k: 'num', v: k.v };
    if (k.t === 'str') return { k: 'str', v: k.v };
    if (k.t === 'op' && k.v === '(') { const e = this.expr(); this.eat(')'); return e; }
    if (k.t === 'op' && k.v === '[') {
      const items = [];
      if (!this.isOp(']')) { items.push(this.expr()); while (this.isOp(',')) { this.i++; items.push(this.expr()); } }
      this.eat(']');
      return { k: 'tuple', items };
    }
    if (k.t === 'id') {
      if (k.v === 'true') return { k: 'bool', v: true };
      if (k.v === 'false') return { k: 'bool', v: false };
      if (this.isOp('(')) {
        this.i++;
        const args = [], kw = [];
        if (!this.isOp(')')) {
          for (;;) {
            const a = this.peek(), b = this.t[this.i + 1];
            if (a && a.t === 'id' && b && b.t === 'op' && b.v === '=') { this.i += 2; kw.push([a.v, this.expr()]); }
            else args.push(this.expr());
            if (this.isOp(',')) { this.i++; continue; }
            break;
          }
        }
        this.eat(')');
        return { k: 'call', name: k.v, args, kw, id: uid() };
      }
      return { k: 'id', name: k.v };
    }
    this.err('Unexpected "' + k.v + '"');
  }
}

const TYPES = new Set(['float', 'int', 'bool', 'string', 'color', 'series', 'simple', 'const']);

function parseProgram(lines) {
  let pos = 0;
  function block(indent) {
    const stmts = [];
    while (pos < lines.length && lines[pos].indent >= indent) {
      if (lines[pos].indent > indent) throw new PineError('Unexpected indentation', lines[pos].line);
      stmts.push(statement(indent));
    }
    return stmts;
  }
  function body(parent) {
    if (pos < lines.length && lines[pos].indent > parent) return block(lines[pos].indent);
    return [];
  }
  function statement(indent) {
    const L = lines[pos++];
    const toks = tokenize(L.text, L.line);
    const p = new Parser(toks, L.line);
    const f = toks[0];
    const line = L.line;
    if (f.t === 'id') {
      if (f.v === 'if') {
        p.i = 1; const cond = p.expr(); p.end();
        const then = body(indent); let els = null;
        if (pos < lines.length && lines[pos].indent === indent && /^else\b/.test(lines[pos].text)) {
          const t = lines[pos].text;
          if (/^else\s+if\b/.test(t)) { lines[pos] = Object.assign({}, lines[pos], { text: t.replace(/^else\s+/, '') }); els = [statement(indent)]; }
          else { pos++; els = body(indent); }
        }
        return { k: 'if', cond, then, els, line };
      }
      if (f.v === 'for') {
        p.i = 1; const name = p.next().v; p.eat('=');
        const from = p.expr();
        if (!p.isKw('to')) p.err('Expected "to"'); p.i++;
        const to = p.expr(); let step = null;
        if (p.isKw('by')) { p.i++; step = p.expr(); }
        p.end();
        return { k: 'for', name, from, to, step, body: body(indent), line };
      }
      if (f.v === 'while') { p.i = 1; const cond = p.expr(); p.end(); return { k: 'while', cond, body: body(indent), line }; }
      if (f.v === 'break' || f.v === 'continue') return { k: f.v, line };
      // function definition
      if (toks[1] && toks[1].t === 'op' && toks[1].v === '(') {
        let d = 0, m = -1;
        for (let j = 1; j < toks.length; j++) {
          if (toks[j].t === 'op' && toks[j].v === '(') d++;
          if (toks[j].t === 'op' && toks[j].v === ')') { d--; if (d === 0) { m = j; break; } }
        }
        if (m > 0 && toks[m + 1] && toks[m + 1].t === 'op' && toks[m + 1].v === '=>') {
          const params = [];
          for (let j = 2; j < m; j++) { if (toks[j].t === 'id' && !TYPES.has(toks[j].v)) params.push(toks[j].v); else if (toks[j].t === 'op' && toks[j].v === '=') { let dd = 0; while (j + 1 < m && !(dd === 0 && toks[j + 1].v === ',')) { j++; } } }
          if (m + 2 < toks.length) {
            const pe = new Parser(toks, line); pe.i = m + 2; const expr = pe.expr(); pe.end();
            return { k: 'fn', name: f.v, params, body: [{ k: 'expr', e: expr, line }], line };
          }
          return { k: 'fn', name: f.v, params, body: body(indent), line };
        }
      }
    }
    // tuple assignment
    if (f.t === 'op' && f.v === '[') {
      let j = 1; const names = [];
      while (toks[j] && toks[j].t === 'id') { names.push(toks[j].v); j++; if (toks[j] && toks[j].v === ',') j++; else break; }
      if (toks[j] && toks[j].v === ']' && toks[j + 1] && toks[j + 1].v === '=') {
        p.i = j + 2; const e = p.expr(); p.end();
        return { k: 'tuple', names, e, line };
      }
    }
    // declaration / assignment
    let i = 0, isVar = false;
    if (toks[i] && toks[i].t === 'id' && (toks[i].v === 'var' || toks[i].v === 'varip')) { isVar = true; i++; }
    if (toks[i] && toks[i + 1] && toks[i + 2] && toks[i].t === 'id' && toks[i + 1].t === 'id' && toks[i + 2].t === 'op' && toks[i + 2].v === '=' && TYPES.has(toks[i].v)) i++;
    if (toks[i] && toks[i].t === 'id' && toks[i + 1] && toks[i + 1].t === 'op' && [':=', '=', '+=', '-=', '*=', '/=', '%='].includes(toks[i + 1].v) && !toks[i].v.includes('.')) {
      const name = toks[i].v, op = toks[i + 1].v;
      p.i = i + 2; const e = p.expr(); p.end();
      return { k: 'assign', name, op, e, isVar, line };
    }
    p.i = 0; const e = p.expr(); p.end();
    return { k: 'expr', e, line };
  }
  const prog = block(lines.length ? lines[0].indent : 0);
  if (pos < lines.length) throw new PineError('Unexpected indentation', lines[pos].line);
  return prog;
}
/* Part B: stateful technical-analysis primitives */
const MK = {
  sma(len) { const b = []; return v => { b.push(v); if (b.length < len) return NA; let s = 0; for (let k = b.length - len; k < b.length; k++) s += b[k]; return s / len; }; },
  ema(len, alpha) {
    let prev = NA, n = 0, sum = 0; const a = alpha || 2 / (len + 1);
    return v => {
      if (isNaN(v)) return prev;
      if (isNaN(prev) && n < len) { n++; sum += v; if (n < len) return NA; prev = sum / len; return prev; }
      prev = a * v + (1 - a) * prev; return prev;
    };
  },
  rma(len) { return MK.ema(len, 1 / len); },
  wma(len) {
    const b = []; const den = len * (len + 1) / 2;
    return v => { b.push(v); if (b.length < len) return NA; let s = 0; for (let k = 0; k < len; k++) s += (k + 1) * b[b.length - len + k]; return s / den; };
  },
  vwma(len) {
    const a = [], w = [];
    return (v, vol) => { a.push(v * vol); w.push(vol); if (a.length < len) return NA; let s = 0, t = 0; for (let k = a.length - len; k < a.length; k++) { s += a[k]; t += w[k]; } return s / t; };
  },
  hma(len) {
    const half = Math.max(1, Math.floor(len / 2)), sq = Math.max(1, Math.round(Math.sqrt(len)));
    const w1 = MK.wma(half), w2 = MK.wma(len), w3 = MK.wma(sq);
    return v => w3(2 * w1(v) - w2(v));
  },
  stdev(len) {
    const b = [];
    return v => { b.push(v); if (b.length < len) return NA; let s = 0; for (let k = b.length - len; k < b.length; k++) s += b[k]; const m = s / len; let q = 0; for (let k = b.length - len; k < b.length; k++) q += (b[k] - m) * (b[k] - m); return Math.sqrt(q / len); };
  },
  highest(len) { const b = []; return v => { b.push(v); if (b.length < len) return NA; let m = -Infinity; for (let k = b.length - len; k < b.length; k++) if (b[k] > m) m = b[k]; return m; }; },
  lowest(len) { const b = []; return v => { b.push(v); if (b.length < len) return NA; let m = Infinity; for (let k = b.length - len; k < b.length; k++) if (b[k] < m) m = b[k]; return m; }; },
  sum(len) { const b = []; return v => { b.push(v); if (b.length < len) return NA; let s = 0; for (let k = b.length - len; k < b.length; k++) s += b[k]; return s; }; },
  rsi(len) {
    const up = MK.rma(len), dn = MK.rma(len); let prev = NA;
    return v => {
      const ch = isNaN(prev) ? NA : v - prev; prev = v;
      const u = up(isNaN(ch) ? NA : Math.max(ch, 0)), d = dn(isNaN(ch) ? NA : Math.max(-ch, 0));
      if (isNaN(u) || isNaN(d)) return NA;
      if (d === 0) return 100; if (u === 0) return 0;
      return 100 - 100 / (1 + u / d);
    };
  },
  macd(f, s, g) {
    const ef = MK.ema(f), es = MK.ema(s), sg = MK.ema(g);
    return v => { const m = ef(v) - es(v); const sig = sg(m); return [m, sig, m - sig]; };
  },
  change(len) { const b = []; return v => { b.push(v); return b.length > len ? v - b[b.length - 1 - len] : NA; }; },
  roc(len) { const b = []; return v => { b.push(v); if (b.length <= len) return NA; const p = b[b.length - 1 - len]; return 100 * (v - p) / p; }; },
  cum() { let s = 0; return v => (s += isNaN(v) ? 0 : v); },
  cross() { let pa = NA, pb = NA; return (a, b) => { const r = [a > b && pa <= pb, a < b && pa >= pb]; pa = a; pb = b; return r; }; },
  tr(bars) { return i => { const h = bars.h[i], l = bars.l[i]; if (i === 0) return h - l; const pc = bars.c[i - 1]; return Math.max(h - l, Math.abs(h - pc), Math.abs(l - pc)); }; },
  atr(len, bars) { const r = MK.rma(len), tr = MK.tr(bars); return i => r(tr(i)); },
  cci(len) {
    const b = [];
    return v => { b.push(v); if (b.length < len) return NA; let s = 0; for (let k = b.length - len; k < b.length; k++) s += b[k]; const m = s / len; let d = 0; for (let k = b.length - len; k < b.length; k++) d += Math.abs(b[k] - m); d /= len; return d === 0 ? 0 : (v - m) / (0.015 * d); };
  },
  stoch(len) {
    const hi = MK.highest(len), lo = MK.lowest(len);
    return (src, h, l) => { const H = hi(h), L = lo(l); if (isNaN(H) || isNaN(L)) return NA; return H === L ? 0 : 100 * (src - L) / (H - L); };
  },
  dmi(dl, al, bars) {
    const trr = MK.rma(dl), pr = MK.rma(dl), mr = MK.rma(dl), ar = MK.rma(al), tr = MK.tr(bars);
    return i => {
      let pdm = 0, mdm = 0;
      if (i > 0) { const up = bars.h[i] - bars.h[i - 1], dn = bars.l[i - 1] - bars.l[i]; pdm = up > dn && up > 0 ? up : 0; mdm = dn > up && dn > 0 ? dn : 0; }
      const t = trr(tr(i)), p = 100 * pr(pdm) / t, m = 100 * mr(mdm) / t;
      const s = p + m; const adx = ar(isNaN(p) ? NA : 100 * Math.abs(p - m) / (s === 0 ? 1 : s));
      return [p, m, adx];
    };
  },
  supertrend(factor, len, bars) {
    const atr = MK.atr(len, bars); let pl = NA, pu = NA, pst = NA, pAtr = NA;
    return i => {
      const a = atr(i), src = (bars.h[i] + bars.l[i]) / 2, c = bars.c[i], pc = i > 0 ? bars.c[i - 1] : NA;
      let u = src + factor * a, l = src - factor * a;
      const lb = (l > pl || pc < pl || isNaN(pl)) ? l : pl;
      const ub = (u < pu || pc > pu || isNaN(pu)) ? u : pu;
      let dir;
      if (isNaN(pAtr)) dir = 1; else if (pst === pu) dir = c > ub ? -1 : 1; else dir = c < lb ? 1 : -1;
      const st = dir === -1 ? lb : ub;
      pl = lb; pu = ub; pst = st; pAtr = a;
      return [st, dir];
    };
  },
  pivot(left, right, high) {
    const b = [];
    return v => {
      b.push(v);
      if (b.length < left + right + 1) return NA;
      const c = b[b.length - 1 - right];
      if (isNaN(c)) return NA;
      for (let k = 1; k <= left; k++) { const x = b[b.length - 1 - right - k]; if (high ? x > c : x < c) return NA; }
      for (let k = 1; k <= right; k++) { const x = b[b.length - 1 - right + k]; if (high ? x >= c : x <= c) return NA; }
      return c;
    };
  }
};

const COLORS = {
  red: '#F23645', green: '#089981', blue: '#2962FF', orange: '#FF9800', yellow: '#FDD835', aqua: '#00BCD4', teal: '#089981',
  purple: '#9C27B0', lime: '#00E676', fuchsia: '#E040FB', white: '#FFFFFF', black: '#000000', gray: '#787B86', silver: '#B2B5BE',
  maroon: '#880E4F', navy: '#311B92', olive: '#808000'
};
function hexToRgb(h) {
  if (typeof h !== 'string') return null;
  h = h.trim();
  if (h[0] !== '#') return null;
  h = h.slice(1);
  if (h.length === 3) h = h.split('').map(x => x + x).join('');
  const n = parseInt(h.slice(0, 6), 16);
  if (isNaN(n)) return null;
  return [(n >> 16) & 255, (n >> 8) & 255, n & 255, h.length >= 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1];
}
function rgba(r, g, b, a) { return 'rgba(' + Math.round(r) + ',' + Math.round(g) + ',' + Math.round(b) + ',' + (+a.toFixed(3)) + ')'; }
/* Part C: runtime */
const CONSTMAP = {
  'plot.style_line': 'line', 'plot.style_linebr': 'line', 'plot.style_histogram': 'histogram', 'plot.style_columns': 'columns',
  'plot.style_circles': 'circles', 'plot.style_cross': 'cross', 'plot.style_area': 'area', 'plot.style_areabr': 'area', 'plot.style_stepline': 'stepline',
  'strategy.long': 'long', 'strategy.short': 'short', 'strategy.fixed': 'fixed', 'strategy.cash': 'cash', 'strategy.percent_of_equity': 'percent_of_equity',
  'math.pi': Math.PI, 'math.e': Math.E, 'syminfo.tickerid': 'SYMBOL', 'syminfo.ticker': 'SYMBOL', 'timeframe.period': 'D',
  'timeframe.isintraday': false, 'timeframe.isdaily': true, 'hline.style_dashed': 'dashed', 'hline.style_dotted': 'dotted', 'hline.style_solid': 'solid'
};
Object.keys(COLORS).forEach(k => { CONSTMAP['color.' + k] = COLORS[k]; });
const PREFIX_CONST = ['shape.', 'location.', 'size.', 'label.style_', 'line.style_', 'extend.', 'xloc.', 'yloc.', 'display.', 'format.', 'barmerge.', 'text.', 'position.', 'scale.', 'strategy.commission.', 'strategy.oca.', 'alert.freq_', 'order.', 'currency.'];
const IGNORED_NS = ['label', 'line', 'box', 'table', 'array', 'map', 'alert', 'linefill', 'polyline', 'request', 'matrix', 'log', 'chart', 'runtime'];
const SRC_NAMES = ['open', 'high', 'low', 'close', 'hl2', 'hlc3', 'ohlc4', 'hlcc4', 'volume'];

const truthy = v => v === true || (typeof v === 'number' && !isNaN(v) && v !== 0) || (typeof v === 'string' && v.length > 0);
const fmtNum = v => typeof v === 'number' ? (Number.isInteger(v) ? String(v) : String(+v.toFixed(8))) : String(v);
function toRgb(c) {
  if (typeof c !== 'string') return null;
  if (c[0] === '#') return hexToRgb(c);
  const m = /^rgba?\(([^)]+)\)/.exec(c);
  if (m) { const p = m[1].split(',').map(Number); return [p[0], p[1], p[2], p[3] === undefined ? 1 : p[3]]; }
  return null;
}

function execute(prog, bars, opts) {
  opts = opts || {};
  const n = bars.t.length;
  const out = { meta: { title: 'Script', short: 'Script', overlay: false, strategy: false, set: false }, plots: [], hlines: [], markers: [], fills: [], bg: null, barcolors: null, inputs: [], strategy: null, tradeMarkers: [], n };
  const G = new Map(), hist = new Map(), persist = new Set(), states = new Map(), fns = new Map();
  const plotMap = new Map(), inputMap = new Map(), fillMap = new Map(), hlineMap = new Map();
  const cache = {};
  const globalScope = { vars: G, parent: null, isGlobal: true };
  let i = 0, curLine = 0, ctxKey = '', flag = null, depth = 0;

  // ---------- strategy engine ----------
  const S = { active: false, init: 10000, pos: 0, avg: 0, realized: 0, trades: [], pending: [], exits: {}, eq: new Float64Array(n), qtyType: 'fixed', qtyVal: 1, commType: 'percent', commVal: 0, cur: null };
  const equityNow = px => S.init + S.realized + S.pos * (px - S.avg);
  const fee = (notional, qty) => /percent/.test(S.commType) ? notional * S.commVal / 100 : /contract/.test(S.commType) ? S.commVal * qty : S.commVal;
  function openPos(dir, px, id, qty) {
    let q = qty;
    if (q === undefined || isNaN(q)) q = S.qtyType === 'percent_of_equity' ? equityNow(px) * S.qtyVal / 100 / px : S.qtyType === 'cash' ? S.qtyVal / px : S.qtyVal;
    if (!(q > 0)) return;
    const f = fee(px * q, q);
    S.pos = dir * q; S.avg = px; S.realized -= f;
    S.cur = { id, dir, entryBar: i, entryPrice: px, qty: q, fee: f, open: true, exitBar: null, exitPrice: null, pnl: 0 };
    S.trades.push(S.cur);
  }
  function closePos(px) {
    if (!S.pos) return;
    const t = S.cur, q = Math.abs(S.pos), f = fee(px * q, q);
    const gross = S.pos * (px - S.avg);
    S.realized += gross - f;
    t.exitBar = i; t.exitPrice = px; t.open = false; t.fee += f; t.pnl = gross - t.fee;
    S.pos = 0; S.avg = 0; S.cur = null; S.exits = {};
  }
  function broker() {
    const orders = S.pending; S.pending = [];
    const px = bars.o[i];
    for (const o of orders) {
      if (o.type === 'entry') {
        if (S.pos !== 0 && Math.sign(S.pos) === o.dir) continue;
        if (S.pos !== 0) closePos(px);
        openPos(o.dir, px, o.id, o.qty);
      } else if (o.type === 'close') { if (S.pos !== 0 && (o.id === undefined || S.cur.id === o.id)) closePos(px); }
      else if (o.type === 'closeAll') closePos(px);
    }
    if (S.pos !== 0) {
      const o = bars.o[i], h = bars.h[i], l = bars.l[i];
      for (const key in S.exits) {
        const e = S.exits[key];
        if (e.from !== undefined && e.from !== S.cur.id) continue;
        const ok = v => v !== undefined && v !== null && !isNaN(v);
        let fp = null;
        if (S.pos > 0) { if (ok(e.stop) && l <= e.stop) fp = Math.min(o, e.stop); else if (ok(e.limit) && h >= e.limit) fp = Math.max(o, e.limit); }
        else { if (ok(e.stop) && h >= e.stop) fp = Math.max(o, e.stop); else if (ok(e.limit) && l <= e.limit) fp = Math.min(o, e.limit); }
        if (fp !== null) { closePos(fp); break; }
      }
    }
  }

  // ---------- builtins ----------
  function trAt(j) { const h = bars.h[j], l = bars.l[j]; if (j === 0) return h - l; const pc = bars.c[j - 1]; return Math.max(h - l, Math.abs(h - pc), Math.abs(l - pc)); }
  function builtin(name) {
    switch (name) {
      case 'open': return bars.o[i]; case 'high': return bars.h[i]; case 'low': return bars.l[i]; case 'close': return bars.c[i]; case 'volume': return bars.v[i];
      case 'hl2': return (bars.h[i] + bars.l[i]) / 2;
      case 'hlc3': return (bars.h[i] + bars.l[i] + bars.c[i]) / 3;
      case 'ohlc4': return (bars.o[i] + bars.h[i] + bars.l[i] + bars.c[i]) / 4;
      case 'hlcc4': return (bars.h[i] + bars.l[i] + 2 * bars.c[i]) / 4;
      case 'time': return bars.t[i] * 1000;
      case 'bar_index': return i; case 'last_bar_index': return n - 1; case 'na': return NA;
      case 'ta.tr': case 'tr': return trAt(i);
      case 'ta.vwap': case 'vwap': {
        if (!cache.vwap) { cache.vwap = new Float64Array(n); let pv = 0, vv = 0; for (let j = 0; j < n; j++) { const p = (bars.h[j] + bars.l[j] + bars.c[j]) / 3; pv += p * bars.v[j]; vv += bars.v[j]; cache.vwap[j] = vv ? pv / vv : p; } }
        return cache.vwap[i];
      }
      case 'ta.obv': case 'obv': {
        if (!cache.obv) { cache.obv = new Float64Array(n); let s = 0; for (let j = 0; j < n; j++) { if (j > 0) s += Math.sign(bars.c[j] - bars.c[j - 1]) * bars.v[j]; cache.obv[j] = s; } }
        return cache.obv[i];
      }
      case 'barstate.isfirst': return i === 0;
      case 'barstate.islast': case 'barstate.islastconfirmedhistory': return i === n - 1;
      case 'barstate.isconfirmed': case 'barstate.ishistory': return true;
      case 'barstate.isrealtime': case 'barstate.isnew': return false;
      case 'dayofweek': return new Date(bars.t[i] * 1000).getUTCDay() + 1;
      case 'hour': return new Date(bars.t[i] * 1000).getUTCHours();
      case 'minute': return new Date(bars.t[i] * 1000).getUTCMinutes();
      case 'month': return new Date(bars.t[i] * 1000).getUTCMonth() + 1;
      case 'year': return new Date(bars.t[i] * 1000).getUTCFullYear();
      case 'dayofmonth': return new Date(bars.t[i] * 1000).getUTCDate();
      case 'strategy.position_size': return S.pos;
      case 'strategy.position_avg_price': return S.pos ? S.avg : NA;
      case 'strategy.equity': return equityNow(bars.c[i]);
      case 'strategy.netprofit': return S.realized;
      case 'strategy.opentrades': return S.pos ? 1 : 0;
      case 'strategy.closedtrades': return S.trades.filter(t => !t.open).length;
      case 'strategy.initial_capital': return S.init;
    }
    return undefined;
  }
  function builtinAt(name, j) { const s = i; i = j; try { return builtin(name); } finally { i = s; } }

  function lookup(name, scope) {
    for (let s = scope; s; s = s.parent) if (s.vars.has(name)) return s.vars.get(name);
    const b = builtin(name); if (b !== undefined) return b;
    if (name in CONSTMAP) return name === 'syminfo.tickerid' || name === 'syminfo.ticker' ? (opts.symbol || 'SYMBOL') : CONSTMAP[name];
    for (const p of PREFIX_CONST) if (name.startsWith(p)) return name.slice(p.length);
    throw new PineError('Undeclared identifier "' + name + '"', curLine);
  }
  const stateOf = node => { const key = node.id + '|' + ctxKey; let s = states.get(key); if (!s) { s = {}; states.set(key, s); } return s; };

  // ---------- evaluator ----------
  function binop(op, l, r) {
    switch (op) {
      case '+': if (typeof l === 'string' || typeof r === 'string') return fmtNum(l) + fmtNum(r); return l + r;
      case '-': return l - r; case '*': return l * r; case '/': return l / r; case '%': return l % r;
      case '==': return l === r; case '!=': return l !== r;
      case '<': return l < r; case '>': return l > r; case '<=': return l <= r; case '>=': return l >= r;
    }
    throw new PineError('Bad operator ' + op, curLine);
  }
  function ev(node, scope) {
    switch (node.k) {
      case 'num': case 'str': case 'bool': return node.v;
      case 'id': return lookup(node.name, scope);
      case 'un': { const v = ev(node.e, scope); return node.op === '-' ? -v : !truthy(v); }
      case 'bin': {
        if (node.op === 'and') return truthy(ev(node.l, scope)) && truthy(ev(node.r, scope));
        if (node.op === 'or') return truthy(ev(node.l, scope)) || truthy(ev(node.r, scope));
        return binop(node.op, ev(node.l, scope), ev(node.r, scope));
      }
      case 'tern': return truthy(ev(node.c, scope)) ? ev(node.a, scope) : ev(node.b, scope);
      case 'tuple': return node.items.map(x => ev(x, scope));
      case 'call': return call(node, scope);
      case 'idx': {
        const kk = ev(node.n, scope); const k = Math.trunc(kk);
        if (isNaN(k) || k < 0) return NA;
        const e = node.e;
        if (e.k === 'id') {
          let owner = null;
          for (let s = scope; s; s = s.parent) if (s.vars.has(e.name)) { owner = s; break; }
          if (owner && owner.isGlobal) {
            if (k === 0) return G.get(e.name);
            const h = hist.get(e.name); const v = h && h[i - k]; return v === undefined ? NA : v;
          }
          if (!owner && builtin(e.name) !== undefined) { const j = i - k; return j < 0 ? NA : builtinAt(e.name, j); }
        }
        const st = stateOf(node); const cur = ev(e, scope);
        if (!st.h) st.h = []; st.h[i] = cur;
        if (k === 0) return cur;
        const v = st.h[i - k]; return v === undefined ? NA : v;
      }
    }
    throw new PineError('Cannot evaluate', curLine);
  }
  function setExisting(name, v, scope) {
    for (let s = scope; s; s = s.parent) if (s.vars.has(name)) { s.vars.set(name, v); return; }
    scope.vars.set(name, v);
  }
  function execBlock(list, scope) {
    let last = NA;
    for (const s of list) { last = exec(s, scope); if (flag) break; }
    return last;
  }
  function exec(s, scope) {
    curLine = s.line;
    switch (s.k) {
      case 'expr': return ev(s.e, scope);
      case 'assign': {
        if (s.isVar && scope.isGlobal) { if (persist.has(s)) return G.get(s.name); persist.add(s); }
        let v = ev(s.e, scope);
        if (s.op.length === 2 && s.op !== ':=') v = binop(s.op[0], lookup(s.name, scope), v);
        if (s.op === '=') scope.vars.set(s.name, v); else setExisting(s.name, v, scope);
        return v;
      }
      case 'tuple': {
        const v = ev(s.e, scope);
        if (!Array.isArray(v)) throw new PineError('Right side of tuple assignment must return a tuple', s.line);
        s.names.forEach((nm, k) => scope.vars.set(nm, v[k] === undefined ? NA : v[k]));
        return NA;
      }
      case 'if': { const blk = truthy(ev(s.cond, scope)) ? s.then : s.els; return blk ? execBlock(blk, scope) : NA; }
      case 'for': {
        const a = ev(s.from, scope), b = ev(s.to, scope), st = s.step ? ev(s.step, scope) : (a <= b ? 1 : -1);
        if (!st) throw new PineError('Loop step cannot be zero', s.line);
        let guard = 0;
        for (let x = a; st > 0 ? x <= b : x >= b; x += st) {
          if (++guard > 100000) throw new PineError('Loop ran too long', s.line);
          scope.vars.set(s.name, x); execBlock(s.body, scope);
          if (flag === 'break') { flag = null; break; }
          if (flag === 'continue') flag = null;
        }
        return NA;
      }
      case 'while': {
        let guard = 0;
        while (truthy(ev(s.cond, scope))) {
          if (++guard > 100000) throw new PineError('Loop ran too long', s.line);
          execBlock(s.body, scope);
          if (flag === 'break') { flag = null; break; }
          if (flag === 'continue') flag = null;
        }
        return NA;
      }
      case 'break': case 'continue': flag = s.k; return NA;
      case 'fn': return NA;
    }
    return NA;
  }
  function callUser(f, args, kw, node) {
    if (++depth > 60) throw new PineError('Call stack too deep', curLine);
    const vars = new Map();
    f.params.forEach((p, k) => vars.set(p, kw[p] !== undefined ? kw[p] : args[k]));
    const sc = { vars, parent: globalScope, isGlobal: false };
    const pk = ctxKey; ctxKey += '>' + node.id;
    const line = curLine;
    try { return execBlock(f.body, sc); } finally { ctxKey = pk; depth--; curLine = line; }
  }
  function call(node, scope) {
    const name = node.name;
    const args = node.args.map(a => ev(a, scope));
    const kw = {}; for (const [k, e] of node.kw) kw[k] = ev(e, scope);
    const uf = fns.get(name);
    if (uf) return callUser(uf, args, kw, node);
    const impl = FN[name] || FN[name.replace(/^(ta|math)\./, '')];
    if (impl) return impl(node, args, kw, scope);
    const ns = name.split('.')[0];
    if (IGNORED_NS.includes(ns) || name === 'alertcondition' || name === 'max_bars_back') return NA;
    throw new PineError('Unknown function "' + name + '"', curLine);
  }

  // ---------- function library ----------
  const A = (a, k, idx, nm, d) => k[nm] !== undefined ? k[nm] : (a[idx] !== undefined ? a[idx] : d);
  const FN = {};
  const single = (factory) => (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = factory(A(a, k, 1, 'length', 14)); return st.f(A(a, k, 0, 'source', NA)); };
  ['sma', 'ema', 'rma', 'wma', 'hma', 'stdev', 'rsi', 'cci', 'roc'].forEach(nm => { FN[nm] = single(MK[nm]); });
  FN.sum = single(MK.sum);
  FN.vwma = (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = MK.vwma(A(a, k, 1, 'length', 14)); return st.f(A(a, k, 0, 'source', NA), bars.v[i]); };
  const winFn = (factory, bar) => (node, a, k) => {
    const st = stateOf(node); let src, len;
    if (a.length + Object.keys(k).length === 1) { len = a.length ? a[0] : k.length; src = bars[bar][i]; }
    else { src = A(a, k, 0, 'source', NA); len = A(a, k, 1, 'length', 14); }
    if (!st.f) st.f = factory(len); return st.f(src);
  };
  FN.highest = winFn(MK.highest, 'h'); FN.lowest = winFn(MK.lowest, 'l');
  FN.change = (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = MK.change(A(a, k, 1, 'length', 1)); return st.f(A(a, k, 0, 'source', NA)); };
  FN.mom = FN.change;
  FN.cum = (node, a) => { const st = stateOf(node); if (!st.f) st.f = MK.cum(); return st.f(a[0]); };
  FN.atr = (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = MK.atr(A(a, k, 0, 'length', 14), bars); return st.f(i); };
  FN.tr = () => trAt(i);
  FN.vwap = () => builtin('vwap');
  FN.macd = (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = MK.macd(A(a, k, 1, 'fastlen', 12), A(a, k, 2, 'slowlen', 26), A(a, k, 3, 'siglen', 9)); return st.f(A(a, k, 0, 'source', NA)); };
  FN.bb = (node, a, k) => {
    const st = stateOf(node); const len = A(a, k, 1, 'length', 20), mult = A(a, k, 2, 'mult', 2);
    if (!st.s) { st.s = MK.sma(len); st.d = MK.stdev(len); }
    const v = A(a, k, 0, 'source', NA), m = st.s(v), d = st.d(v) * mult; return [m, m + d, m - d];
  };
  FN.stoch = (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = MK.stoch(A(a, k, 3, 'length', 14)); return st.f(a[0], a[1], a[2]); };
  FN.dmi = (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = MK.dmi(A(a, k, 0, 'diLength', 14), A(a, k, 1, 'adxSmoothing', 14), bars); return st.f(i); };
  FN.supertrend = (node, a, k) => { const st = stateOf(node); if (!st.f) st.f = MK.supertrend(A(a, k, 0, 'factor', 3), A(a, k, 1, 'atrPeriod', 10), bars); return st.f(i); };
  const crossFn = pick => (node, a) => { const st = stateOf(node); if (!st.f) st.f = MK.cross(); return pick(st.f(a[0], a[1])); };
  FN.crossover = crossFn(r => r[0]); FN.crossunder = crossFn(r => r[1]); FN.cross = crossFn(r => r[0] || r[1]);
  const trendFn = up => (node, a, k) => {
    const st = stateOf(node); const len = A(a, k, 1, 'length', 1); if (!st.b) st.b = [];
    st.b.push(A(a, k, 0, 'source', NA)); const b = st.b; if (b.length <= len) return false;
    for (let q = b.length - len; q < b.length; q++) if (up ? !(b[q] > b[q - 1]) : !(b[q] < b[q - 1])) return false;
    return true;
  };
  FN.rising = trendFn(true); FN.falling = trendFn(false);
  const pivFn = high => (node, a, k) => {
    const st = stateOf(node); let src, l, r;
    if (a.length === 2) { l = a[0]; r = a[1]; src = high ? bars.h[i] : bars.l[i]; } else { src = a[0]; l = a[1]; r = a[2]; }
    if (!st.f) st.f = MK.pivot(l, r, high); return st.f(src);
  };
  FN.pivothigh = pivFn(true); FN.pivotlow = pivFn(false);
  FN.barssince = (node, a) => { const st = stateOf(node); st.v = truthy(a[0]) ? 0 : (st.v === undefined || isNaN(st.v) ? NA : st.v + 1); return st.v; };
  FN.valuewhen = (node, a) => { const st = stateOf(node); if (!st.l) st.l = []; if (truthy(a[0])) st.l.push(a[1]); const q = st.l.length - 1 - (a[2] || 0); return q >= 0 ? st.l[q] : NA; };
  FN.fixnan = (node, a) => { const st = stateOf(node); if (!isNaN(a[0])) st.v = a[0]; return st.v === undefined ? NA : st.v; };
  FN.nz = (node, a, k) => { const v = a[0], r = A(a, k, 1, 'replacement', 0); return typeof v === 'number' && isNaN(v) ? r : v; };
  FN.na = (node, a) => typeof a[0] === 'number' && isNaN(a[0]);
  FN.abs = (n, a) => Math.abs(a[0]); FN.sqrt = (n, a) => Math.sqrt(a[0]); FN.exp = (n, a) => Math.exp(a[0]);
  FN.log = (n, a) => Math.log(a[0]); FN.log10 = (n, a) => Math.log10(a[0]); FN.pow = (n, a) => Math.pow(a[0], a[1]);
  FN.sign = (n, a) => Math.sign(a[0]); FN.floor = (n, a) => Math.floor(a[0]); FN.ceil = (n, a) => Math.ceil(a[0]);
  FN.round = (n, a) => { const p = Math.pow(10, a[1] || 0); return Math.round(a[0] * p) / p; };
  FN.max = (n, a) => Math.max(...a); FN.min = (n, a) => Math.min(...a);
  FN.avg = (n, a) => a.reduce((x, y) => x + y, 0) / a.length;
  FN.sin = (n, a) => Math.sin(a[0]); FN.cos = (n, a) => Math.cos(a[0]); FN.tan = (n, a) => Math.tan(a[0]);
  FN.int = (n, a) => Math.trunc(a[0]); FN.float = (n, a) => a[0]; FN.bool = (n, a) => truthy(a[0]);
  FN['str.tostring'] = (n, a) => fmtNum(a[0]);
  FN['str.length'] = (n, a) => String(a[0]).length;
  FN['color.new'] = (n, a, k) => {
    const c = toRgb(a[0]); if (!c) return NA; const t = A(a, k, 1, 'transp', 0);
    return rgba(c[0], c[1], c[2], c[3] * (1 - t / 100));
  };
  FN['color.rgb'] = (n, a, k) => rgba(a[0], a[1], a[2], 1 - A(a, k, 3, 'transp', 0) / 100);

  // declarations
  const declare = (node, a, k) => {
    if (out.meta.set) return NA;
    const m = out.meta; m.set = true; m.title = A(a, k, 0, 'title', 'Script'); m.short = A(a, k, 1, 'shorttitle', m.title);
    m.overlay = truthy(A(a, k, 2, 'overlay', false));
    return NA;
  };
  FN.indicator = declare; FN.study = declare;
  FN.strategy = (node, a, k) => {
    if (out.meta.set) return NA;
    declare(node, a, k); out.meta.strategy = true; S.active = true;
    S.init = k.initial_capital !== undefined ? k.initial_capital : 10000;
    S.qtyType = k.default_qty_type || 'fixed'; S.qtyVal = k.default_qty_value !== undefined ? k.default_qty_value : 1;
    S.commType = k.commission_type || 'percent'; S.commVal = k.commission_value || 0;
    return NA;
  };

  // inputs
  const inputFn = type => (node, a, k, scope) => {
    let inp = inputMap.get(node.id);
    if (!inp) {
      let t = type; const def = a[0] !== undefined ? a[0] : k.defval;
      if (t === 'any') t = typeof def === 'boolean' ? 'bool' : typeof def === 'number' ? (Number.isInteger(def) ? 'int' : 'float') : 'string';
      inp = { title: A(a, k, 1, 'title', 'Input ' + (out.inputs.length + 1)), type: t, def, min: k.minval, max: k.maxval, step: k.step, options: type === 'string' ? A(a, k, 2, 'options', null) : null, value: def };
      if (t === 'source') { inp.def = node.args[0] && node.args[0].k === 'id' ? node.args[0].name : 'close'; inp.value = inp.def; inp.options = SRC_NAMES; }
      const ov = opts.inputs && opts.inputs[inp.title];
      if (ov !== undefined && ov !== null && ov !== '') {
        if (t === 'int') inp.value = Math.round(Number(ov)); else if (t === 'float') inp.value = Number(ov);
        else if (t === 'bool') inp.value = ov === true || ov === 'true'; else inp.value = ov;
        if (typeof inp.value === 'number' && isNaN(inp.value)) inp.value = inp.def;
      }
      inputMap.set(node.id, inp); out.inputs.push(inp);
    }
    if (inp.type === 'source') return lookup(inp.value, scope);
    return inp.value;
  };
  FN.input = inputFn('any'); FN['input.int'] = inputFn('int'); FN['input.float'] = inputFn('float'); FN['input.bool'] = inputFn('bool');
  FN['input.string'] = inputFn('string'); FN['input.source'] = inputFn('source'); FN['input.color'] = inputFn('color');
  FN['input.timeframe'] = inputFn('string'); FN['input.symbol'] = inputFn('string');

  // outputs
  FN.plot = (node, a, k) => {
    const v = A(a, k, 0, 'series', NA); let P = plotMap.get(node.id);
    if (!P) {
      P = { title: A(a, k, 1, 'title', 'plot ' + (out.plots.length + 1)), style: A(a, k, 4, 'style', 'line'), lw: A(a, k, 3, 'linewidth', 1), overlay: out.meta.overlay,
        hidden: k.display === 'none', offset: k.offset | 0, base: k.histbase || 0, vals: new Float64Array(n).fill(NaN), colors: new Array(n).fill(null) };
      plotMap.set(node.id, P); out.plots.push(P);
    }
    const col = A(a, k, 2, 'color', '#2962FF'); const j = i + P.offset;
    if (j >= 0 && j < n) { P.vals[j] = typeof v === 'number' ? v : v === true ? 1 : v === false ? 0 : NaN; P.colors[j] = typeof col === 'string' ? col : null; }
    return P;
  };
  FN.hline = (node, a, k) => {
    let H = hlineMap.get(node.id);
    if (!H) { H = { price: A(a, k, 0, 'price', 0), title: A(a, k, 1, 'title', ''), color: A(a, k, 2, 'color', '#787B86'), style: A(a, k, 3, 'linestyle', 'dashed'), overlay: out.meta.overlay }; hlineMap.set(node.id, H); out.hlines.push(H); }
    return H;
  };
  FN.fill = (node, a, k) => {
    let F = fillMap.get(node.id);
    if (!F) { F = { a: a[0], b: a[1], colors: new Array(n).fill(null) }; fillMap.set(node.id, F); out.fills.push(F); }
    const c = A(a, k, 2, 'color', null); F.colors[i] = typeof c === 'string' ? c : null; return NA;
  };
  const addMarker = m => { if (out.markers.length < 3000) out.markers.push(m); };
  FN.plotshape = (node, a, k) => {
    if (!truthy(A(a, k, 0, 'series', false))) return NA;
    const mi = i + (A(a, k, 5, 'offset', 0) | 0); if (mi < 0 || mi >= n) return NA;
    addMarker({ i: mi, shape: A(a, k, 2, 'style', 'xcross'), loc: A(a, k, 3, 'location', 'abovebar'), color: A(a, k, 4, 'color', '#2962FF'), text: A(a, k, 6, 'text', ''), tcolor: A(a, k, 7, 'textcolor', null), y: A(a, k, 0, 'series', 0), overlay: out.meta.overlay });
    return NA;
  };
  FN.plotchar = (node, a, k) => {
    if (!truthy(A(a, k, 0, 'series', false))) return NA;
    addMarker({ i, shape: 'char', loc: A(a, k, 3, 'location', 'abovebar'), color: A(a, k, 4, 'color', '#2962FF'), text: A(a, k, 2, 'char', '•'), overlay: out.meta.overlay });
    return NA;
  };
  FN.plotarrow = (node, a, k) => {
    const v = A(a, k, 0, 'series', NA); if (!(v > 0 || v < 0)) return NA;
    addMarker({ i, shape: v > 0 ? 'arrowup' : 'arrowdown', loc: v > 0 ? 'belowbar' : 'abovebar', color: v > 0 ? A(a, k, 2, 'colorup', '#089981') : A(a, k, 3, 'colordown', '#F23645'), text: '', overlay: out.meta.overlay });
    return NA;
  };
  FN['label.new'] = (node, a, k) => {
    const x = A(a, k, 0, 'x', i), y = A(a, k, 1, 'y', NA), t = A(a, k, 2, 'text', '');
    let j = Math.round(x); if (!(j >= 0 && j < n)) j = i;
    addMarker({ i: j, shape: 'label', loc: 'absolute', y, text: String(t), color: A(a, k, 5, 'color', '#2962FF'), tcolor: A(a, k, 6, 'textcolor', '#FFFFFF'), style: A(a, k, 4, 'style', 'label_down'), overlay: true });
    return NA;
  };
  FN.bgcolor = (node, a, k) => {
    const c = A(a, k, 0, 'color', null); if (!out.bg) out.bg = { colors: new Array(n).fill(null), overlay: out.meta.overlay };
    out.bg.colors[i] = typeof c === 'string' ? c : null; return NA;
  };
  FN.barcolor = (node, a, k) => {
    const c = A(a, k, 0, 'color', null); if (!out.barcolors) out.barcolors = new Array(n).fill(null);
    out.barcolors[i] = typeof c === 'string' ? c : null; return NA;
  };

  // strategy orders
  FN['strategy.entry'] = (node, a, k) => {
    if (k.when !== undefined && !truthy(k.when)) return NA;
    const id = String(A(a, k, 0, 'id', 'Entry')), dir = A(a, k, 1, 'direction', 'long') === 'short' ? -1 : 1;
    S.pending = S.pending.filter(o => !(o.type === 'entry')); S.pending.push({ type: 'entry', id, dir, qty: A(a, k, 2, 'qty', undefined) });
    return NA;
  };
  FN['strategy.order'] = FN['strategy.entry'];
  FN['strategy.close'] = (node, a, k) => { if (k.when !== undefined && !truthy(k.when)) return NA; S.pending.push({ type: 'close', id: a[0] !== undefined ? String(a[0]) : undefined }); return NA; };
  FN['strategy.close_all'] = (node, a, k) => { if (k.when !== undefined && !truthy(k.when)) return NA; S.pending.push({ type: 'closeAll' }); return NA; };
  FN['strategy.exit'] = (node, a, k) => {
    const id = String(A(a, k, 0, 'id', 'Exit')); const from = A(a, k, 1, 'from_entry', undefined);
    S.exits[id] = { from: from === undefined || from === '' ? undefined : String(from), stop: k.stop, limit: k.limit };
    return NA;
  };
  FN['strategy.cancel'] = FN['strategy.cancel_all'] = () => { S.pending = []; return NA; };

  // ---------- run ----------
  try {
    for (const s of prog) if (s.k === 'fn') fns.set(s.name, s);
    for (i = 0; i < n; i++) {
      flag = null; ctxKey = ''; depth = 0;
      if (S.active) broker();
      execBlock(prog, globalScope);
      for (const [key, val] of G) { let h = hist.get(key); if (!h) { h = []; hist.set(key, h); } h[i] = val; }
      if (S.active) S.eq[i] = equityNow(bars.c[i]);
    }
  } catch (e) {
    out.error = { message: e.message || String(e), line: e.line || curLine, bar: i };
  }
  if (S.active) finishStrategy(out, S, bars, n);
  return out;
}

function finishStrategy(out, S, bars, n) {
  const last = n - 1;
  if (S.cur) { const t = S.cur; t.pnl = S.pos * (bars.c[last] - S.avg) - t.fee; }
  const closed = S.trades.filter(t => !t.open);
  const wins = closed.filter(t => t.pnl > 0), losses = closed.filter(t => t.pnl <= 0);
  const gp = wins.reduce((s, t) => s + t.pnl, 0), gl = -losses.reduce((s, t) => s + t.pnl, 0);
  let peak = -Infinity, mdd = 0, mddPct = 0;
  for (let j = 0; j < n; j++) { const e = S.eq[j]; if (e > peak) peak = e; const d = peak - e; if (d > mdd) { mdd = d; mddPct = peak ? d / peak * 100 : 0; } }
  const finalEq = n ? S.eq[last] : S.init;
  out.strategy = {
    init: S.init, equity: S.eq, trades: S.trades,
    stats: {
      netProfit: S.realized, finalEquity: finalEq, returnPct: (finalEq - S.init) / S.init * 100,
      openPnl: S.cur ? S.cur.pnl : 0, total: closed.length, winRate: closed.length ? wins.length / closed.length * 100 : NaN,
      profitFactor: gl > 0 ? gp / gl : (gp > 0 ? Infinity : NaN), avgTrade: closed.length ? closed.reduce((s, t) => s + t.pnl, 0) / closed.length : NaN,
      maxDD: mdd, maxDDPct: mddPct, wins: wins.length, losses: losses.length
    }
  };
  for (const t of S.trades) {
    out.tradeMarkers.push({ i: t.entryBar, shape: t.dir > 0 ? 'arrowup' : 'arrowdown', loc: t.dir > 0 ? 'belowbar' : 'abovebar', color: t.dir > 0 ? '#089981' : '#F23645', text: t.dir > 0 ? 'Long' : 'Short', overlay: true });
    if (t.exitBar !== null) out.tradeMarkers.push({ i: t.exitBar, shape: 'xcross', loc: 'absolute', y: t.exitPrice, color: t.pnl > 0 ? '#089981' : '#F23645', text: '', overlay: true });
  }
}

function run(code, bars, opts) {
  let prog;
  try { prog = parseProgram(preprocess(code)); }
  catch (e) { return { error: { message: e.message, line: e.line || 0 }, plots: [], hlines: [], markers: [], fills: [], inputs: [], tradeMarkers: [], meta: { title: 'Script', overlay: false } }; }
  return execute(prog, bars, opts);
}

root.Pine = { run, PineError, preprocess, parseProgram };
if (typeof module !== 'undefined') module.exports = root.Pine;
})(typeof globalThis !== 'undefined' ? globalThis : this);

/* Canvas chart: candles, overlays, sub-panes, crosshair, pan/zoom */
(function (root) {
'use strict';
const FONT = '11px "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace';
const AXIS_W = 62, TIME_H = 24, MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

function niceStep(range, target) {
  const raw = range / target, mag = Math.pow(10, Math.floor(Math.log10(raw))), f = raw / mag;
  return (f < 1.5 ? 1 : f < 3.5 ? 2 : f < 7.5 ? 5 : 10) * mag;
}
function decimalsFor(step) { return Math.min(8, Math.max(0, -Math.floor(Math.log10(step) + 1e-9))); }
const pad2 = v => (v < 10 ? '0' : '') + v;

class Chart {
  constructor(canvas) {
    this.cv = canvas; this.ctx = canvas.getContext('2d');
    this.bars = null; this.n = 0; this.tf = 86400; this.scripts = [];
    this.type = 'candles'; this.volume = true;
    this.barW = 9; this.right = 0; this.cross = null; this.hover = -1;
    this.theme = { bg: '#0f1318', fg: '#d6dbe3', muted: '#7d8694', grid: '#1b222b', up: '#21b58f', down: '#ef4f60', accent: '#e8b341', line: '#2a323d' };
    this.onHover = null; this.dirty = false; this.pointers = new Map(); this.drag = null;
    this.w = 0; this.h = 0; this.dpr = 1; this.panes = [];
    this._bind();
    this.resize();
  }
  setTheme(t) { Object.assign(this.theme, t); this.draw(); }
  setBars(bars, tf, reset) {
    const old = this.n;
    this.bars = bars; this.n = bars.t.length; if (tf) this.tf = tf;
    if (reset || !old) this.resetView();
    else if (this.n > old && this.right >= old - 1 + 0.5) this.right += this.n - old;
    this.draw();
  }
  setScripts(list) { this.scripts = list; this.draw(); }
  setType(t) { this.type = t; this.draw(); }
  setVolume(v) { this.volume = v; this.draw(); }
  resetView() { this.barW = Math.max(3, Math.min(14, (this.w - AXIS_W) / 110)); this.right = this.n - 1 + 6; this.draw(); }
  focus(i) { const vis = this.plotW() / this.barW; this.right = i + vis / 2; this.clampView(); this.draw(); }
  plotW() { return Math.max(40, this.w - AXIS_W); }
  xOf(i) { return this.plotW() - (this.right - i) * this.barW; }
  iOf(x) { return this.right - (this.plotW() - x) / this.barW; }
  resize() {
    const r = this.cv.getBoundingClientRect(); this.dpr = window.devicePixelRatio || 1;
    this.w = Math.max(100, r.width); this.h = Math.max(100, r.height);
    this.cv.width = Math.round(this.w * this.dpr); this.cv.height = Math.round(this.h * this.dpr);
    this.draw();
  }
  draw() { if (this.dirty) return; this.dirty = true; requestAnimationFrame(() => { this.dirty = false; this._render(); }); }
  clampView() {
    const vis = this.plotW() / this.barW;
    this.right = Math.min(this.n - 1 + vis * 0.6, Math.max(vis * 0.4, this.right));
  }

  _bind() {
    const cv = this.cv;
    cv.addEventListener('pointerdown', e => {
      cv.setPointerCapture(e.pointerId); this.pointers.set(e.pointerId, { x: e.offsetX, y: e.offsetY });
      if (this.pointers.size === 1) this.drag = { x: e.offsetX, right: this.right };
      if (this.pointers.size === 2) { const p = [...this.pointers.values()]; this.pinch = { d: Math.hypot(p[0].x - p[1].x, p[0].y - p[1].y), bw: this.barW }; this.drag = null; }
      this._setCross(e.offsetX, e.offsetY);
    });
    cv.addEventListener('pointermove', e => {
      if (this.pointers.has(e.pointerId)) this.pointers.set(e.pointerId, { x: e.offsetX, y: e.offsetY });
      if (this.pinch && this.pointers.size === 2) {
        const p = [...this.pointers.values()], d = Math.hypot(p[0].x - p[1].x, p[0].y - p[1].y);
        const cx = (p[0].x + p[1].x) / 2, idx = this.iOf(cx);
        this.barW = Math.max(2, Math.min(40, this.pinch.bw * d / this.pinch.d));
        this.right = idx + (this.plotW() - cx) / this.barW; this.clampView();
      } else if (this.drag && this.pointers.size === 1) {
        this.right = this.drag.right - (e.offsetX - this.drag.x) / this.barW; this.clampView();
      }
      this._setCross(e.offsetX, e.offsetY);
    });
    const up = e => { this.pointers.delete(e.pointerId); if (this.pointers.size < 2) this.pinch = null; if (!this.pointers.size) this.drag = null; };
    cv.addEventListener('pointerup', up); cv.addEventListener('pointercancel', up);
    cv.addEventListener('pointerleave', e => { if (e.pointerType === 'mouse' && !this.drag) { this.cross = null; this._emit(-1); this.draw(); } });
    cv.addEventListener('wheel', e => {
      e.preventDefault();
      if (e.shiftKey || Math.abs(e.deltaX) > Math.abs(e.deltaY)) { this.right += (e.deltaX || e.deltaY) / this.barW; }
      else {
        const idx = this.iOf(e.offsetX); this.barW = Math.max(2, Math.min(40, this.barW * Math.exp(-e.deltaY * 0.0015)));
        this.right = idx + (this.plotW() - e.offsetX) / this.barW;
      }
      this.clampView(); this._setCross(e.offsetX, e.offsetY);
    }, { passive: false });
    cv.addEventListener('dblclick', () => this.resetView());
    cv.addEventListener('keydown', e => {
      const k = e.key;
      if (k === 'ArrowLeft') this.right -= 5; else if (k === 'ArrowRight') this.right += 5;
      else if (k === '+' || k === '=') this.barW = Math.min(40, this.barW * 1.15); else if (k === '-') this.barW = Math.max(2, this.barW / 1.15);
      else if (k === 'Home') this.resetView(); else return;
      e.preventDefault(); this.clampView(); this.draw();
    });
    new ResizeObserver(() => this.resize()).observe(cv);
  }
  _setCross(x, y) {
    this.cross = { x, y };
    const i = Math.round(this.iOf(x)); this._emit(i >= 0 && i < this.n ? i : -1);
    this.draw();
  }
  _emit(i) { if (i !== this.hover) { this.hover = i; if (this.onHover) this.onHover(i); } }

  _layout() {
    const subs = this.scripts.filter(s => s.visible && s.res && hasSub(s.res));
    const total = this.h - TIME_H;
    let subH = subs.length ? Math.max(70, Math.min(total * 0.24, 170)) : 0;
    if (subs.length * subH > total * 0.62) subH = total * 0.62 / subs.length;
    const mainH = total - subs.length * subH;
    const panes = [{ main: true, y0: 0, y1: mainH }];
    subs.forEach((s, k) => panes.push({ main: false, s, y0: mainH + k * subH, y1: mainH + (k + 1) * subH }));
    this.panes = panes; return panes;
  }

  _scale(p, i0, i1) {
    let lo = Infinity, hi = -Infinity; const b = this.bars;
    const upd = v => { if (isFinite(v)) { if (v < lo) lo = v; if (v > hi) hi = v; } };
    if (p.main) {
      for (let i = i0; i <= i1; i++) { upd(b.h[i]); upd(b.l[i]); }
      for (const s of this.scripts) if (s.visible && s.res) {
        for (const pl of s.res.plots) if (pl.overlay && !pl.hidden) for (let i = i0; i <= i1; i++) upd(pl.vals[i]);
        for (const hl of s.res.hlines) if (hl.overlay) upd(hl.price);
      }
    } else {
      for (const pl of p.s.res.plots) if (!pl.overlay && !pl.hidden) { for (let i = i0; i <= i1; i++) upd(pl.vals[i]); if (/histogram|columns|area/.test(pl.style)) upd(pl.base); }
      for (const hl of p.s.res.hlines) if (!hl.overlay) upd(hl.price);
    }
    if (!isFinite(lo)) { lo = 0; hi = 1; }
    if (hi === lo) { hi = lo + Math.abs(lo) * 0.01 + 1; lo -= Math.abs(lo) * 0.01; }
    const r = hi - lo; hi += r * (p.main ? 0.06 : 0.1); lo -= r * (p.main ? (this.volume ? 0.16 : 0.06) : 0.1);
    p.lo = lo; p.hi = hi;
    const top = p.y0 + 8, bot = p.y1 - 6;
    p.y = v => bot - (v - lo) / (hi - lo) * (bot - top);
    p.v = y => lo + (bot - y) / (bot - top) * (hi - lo);
  }

  _fmtTime(t, full) {
    const d = new Date(t * 1000);
    const date = pad2(d.getUTCDate()) + ' ' + MONTHS[d.getUTCMonth()] + " '" + String(d.getUTCFullYear()).slice(2);
    if (this.tf >= 86400) return full ? date : date;
    return full ? date + ' ' + pad2(d.getUTCHours()) + ':' + pad2(d.getUTCMinutes()) : pad2(d.getUTCHours()) + ':' + pad2(d.getUTCMinutes());
  }

  _render() {
    const ctx = this.ctx, th = this.theme, W = this.w, H = this.h, pw = this.plotW();
    ctx.setTransform(this.dpr, 0, 0, this.dpr, 0, 0);
    ctx.fillStyle = th.bg; ctx.fillRect(0, 0, W, H);
    if (!this.bars || !this.n) return;
    this.clampView();
    const panes = this._layout(), b = this.bars;
    const i0 = Math.max(0, Math.floor(this.iOf(0)) - 1), i1 = Math.min(this.n - 1, Math.ceil(this.right));
    ctx.font = FONT; ctx.textBaseline = 'middle';
    for (const p of panes) this._scale(p, i0, i1);

    // grid + axes
    for (const p of panes) {
      ctx.save(); ctx.beginPath(); ctx.rect(0, p.y0, pw, p.y1 - p.y0); ctx.clip();
      const step = niceStep(p.hi - p.lo, Math.max(2, (p.y1 - p.y0) / 46)), dec = decimalsFor(step);
      p.dec = dec;
      ctx.strokeStyle = th.grid; ctx.lineWidth = 1; ctx.beginPath();
      for (let v = Math.ceil(p.lo / step) * step; v < p.hi; v += step) { const y = Math.round(p.y(v)) + 0.5; ctx.moveTo(0, y); ctx.lineTo(pw, y); }
      ctx.stroke(); ctx.restore();
      ctx.fillStyle = th.muted; ctx.textAlign = 'left';
      for (let v = Math.ceil(p.lo / step) * step; v < p.hi; v += step) { const y = p.y(v); if (y > p.y0 + 8 && y < p.y1 - 6) ctx.fillText(v.toFixed(dec), pw + 8, y); }
      ctx.strokeStyle = th.line; ctx.beginPath(); ctx.moveTo(0, p.y1 + 0.5); ctx.lineTo(W, p.y1 + 0.5); ctx.stroke();
    }
    // time axis + vertical grid
    const per = Math.max(1, Math.ceil(84 / this.barW)), tstep = [1, 2, 5, 10, 20, 25, 50, 100, 200, 500].find(s => s >= per) || 500;
    ctx.textAlign = 'center'; ctx.fillStyle = th.muted; ctx.strokeStyle = th.grid;
    const lastY = panes[panes.length - 1].y1;
    ctx.beginPath();
    for (let i = Math.ceil(i0 / tstep) * tstep; i <= i1; i += tstep) {
      const x = Math.round(this.xOf(i)) + 0.5; ctx.moveTo(x, 0); ctx.lineTo(x, lastY);
    }
    ctx.stroke();
    for (let i = Math.ceil(i0 / tstep) * tstep; i <= i1; i += tstep) ctx.fillText(this._fmtTime(b.t[i]), this.xOf(i), H - TIME_H / 2 + 1);
    ctx.strokeStyle = th.line; ctx.beginPath(); ctx.moveTo(pw + 0.5, 0); ctx.lineTo(pw + 0.5, lastY); ctx.stroke();

    const bw = Math.max(1, Math.floor(this.barW * 0.72)) | 1;
    // background colors from scripts
    for (const s of this.scripts) if (s.visible && s.res && s.res.bg) {
      const cols = s.res.bg.colors;
      for (const p of panes) {
        if (s.res.bg.overlay ? !p.main : p.s !== s) continue;
        for (let i = i0; i <= i1; i++) if (cols[i]) { ctx.fillStyle = cols[i]; ctx.fillRect(this.xOf(i) - this.barW / 2, p.y0, this.barW, p.y1 - p.y0); }
      }
    }
    // main pane
    const mp = panes[0];
    ctx.save(); ctx.beginPath(); ctx.rect(0, mp.y0, pw, mp.y1 - mp.y0); ctx.clip();
    if (this.volume && b.v) {
      let vm = 0; for (let i = i0; i <= i1; i++) if (b.v[i] > vm) vm = b.v[i];
      const vh = (mp.y1 - mp.y0) * 0.14;
      for (let i = i0; i <= i1; i++) {
        ctx.fillStyle = (b.c[i] >= b.o[i] ? th.up : th.down) + '55';
        const h = vm ? b.v[i] / vm * vh : 0; ctx.fillRect(this.xOf(i) - bw / 2, mp.y1 - 6 - h, bw, h);
      }
    }
    const bc = this._barColors();
    if (this.type === 'candles') {
      for (let i = i0; i <= i1; i++) {
        const x = Math.round(this.xOf(i)), up = b.c[i] >= b.o[i];
        const col = bc && bc[i] ? bc[i] : (up ? th.up : th.down);
        ctx.fillStyle = col; ctx.strokeStyle = col; ctx.lineWidth = 1;
        const yh = mp.y(b.h[i]), yl = mp.y(b.l[i]), yo = mp.y(b.o[i]), yc = mp.y(b.c[i]);
        ctx.beginPath(); ctx.moveTo(x + 0.5, yh); ctx.lineTo(x + 0.5, yl); ctx.stroke();
        ctx.fillRect(x - (bw >> 1), Math.min(yo, yc), bw, Math.max(1, Math.abs(yc - yo)));
      }
    } else {
      ctx.beginPath();
      for (let i = i0; i <= i1; i++) { const x = this.xOf(i), y = mp.y(b.c[i]); if (i === i0) ctx.moveTo(x, y); else ctx.lineTo(x, y); }
      ctx.strokeStyle = th.accent; ctx.lineWidth = 1.6; ctx.stroke();
      if (this.type === 'area') {
        ctx.lineTo(this.xOf(i1), mp.y1); ctx.lineTo(this.xOf(i0), mp.y1); ctx.closePath();
        const g = ctx.createLinearGradient(0, mp.y0, 0, mp.y1); g.addColorStop(0, th.accent + '55'); g.addColorStop(1, th.accent + '00'); ctx.fillStyle = g; ctx.fill();
      }
    }
    // last price line
    const lp = b.c[this.n - 1], ly = mp.y(lp);
    ctx.setLineDash([2, 3]); ctx.strokeStyle = b.c[this.n - 1] >= b.o[this.n - 1] ? th.up : th.down; ctx.beginPath(); ctx.moveTo(0, Math.round(ly) + 0.5); ctx.lineTo(pw, Math.round(ly) + 0.5); ctx.stroke(); ctx.setLineDash([]);
    ctx.restore();

    // script layers
    for (const s of this.scripts) {
      if (!s.visible || !s.res) continue;
      for (const p of panes) {
        const mine = p.main ? null : (p.s === s ? p : null);
        if (!p.main && !mine) continue;
        ctx.save(); ctx.beginPath(); ctx.rect(0, p.y0, pw, p.y1 - p.y0); ctx.clip();
        this._drawScript(s.res, p, p.main, i0, i1);
        ctx.restore();
      }
    }
    // pane titles for sub panes + last price tag
    for (const p of panes) if (!p.main) this._subTitle(p);
    this._tag(pw, ly, lp.toFixed(mp.dec), b.c[this.n - 1] >= b.o[this.n - 1] ? th.up : th.down, '#fff');
    this._crosshair(panes, pw);
  }

  _barColors() {
    for (const s of this.scripts) if (s.visible && s.res && s.res.barcolors) return s.res.barcolors;
    return null;
  }

  _drawScript(res, p, isMain, i0, i1) {
    const ctx = this.ctx, th = this.theme;
    const mine = pl => (isMain ? pl.overlay : !pl.overlay);
    // fills
    for (const f of res.fills) {
      if (!f.a || !f.b || !mine(f.a) || !mine(f.b)) continue;
      let i = i0;
      while (i < i1) {
        const c = f.colors[i];
        if (!c || !isFinite(f.a.vals[i]) || !isFinite(f.b.vals[i]) || !isFinite(f.a.vals[i + 1]) || !isFinite(f.b.vals[i + 1])) { i++; continue; }
        let j = i; while (j + 1 <= i1 - 0 && f.colors[j] === c && isFinite(f.a.vals[j + 1]) && isFinite(f.b.vals[j + 1])) j++;
        ctx.beginPath();
        for (let q = i; q <= j; q++) { const x = this.xOf(q), y = p.y(f.a.vals[q]); if (q === i) ctx.moveTo(x, y); else ctx.lineTo(x, y); }
        for (let q = j; q >= i; q--) ctx.lineTo(this.xOf(q), p.y(f.b.vals[q]));
        ctx.closePath(); ctx.fillStyle = c; ctx.fill(); i = Math.max(j, i + 1);
      }
    }
    for (const hl of res.hlines) {
      if (!mine(hl)) continue;
      const y = Math.round(p.y(hl.price)) + 0.5;
      ctx.strokeStyle = hl.color || th.muted; ctx.lineWidth = 1; ctx.setLineDash(hl.style === 'dotted' ? [1, 3] : hl.style === 'dashed' ? [5, 4] : []);
      ctx.beginPath(); ctx.moveTo(0, y); ctx.lineTo(this.plotW(), y); ctx.stroke(); ctx.setLineDash([]);
    }
    for (const pl of res.plots) {
      if (!mine(pl) || pl.hidden) continue;
      const st = pl.style, lw = Math.max(1, Math.min(5, pl.lw || 1));
      if (st === 'histogram' || st === 'columns') {
        const w = Math.max(1, st === 'columns' ? this.barW * 0.8 : Math.max(1, this.barW * 0.4)), y0 = p.y(pl.base || 0);
        for (let i = i0; i <= i1; i++) { const v = pl.vals[i]; if (!isFinite(v) || !pl.colors[i]) continue; ctx.fillStyle = pl.colors[i]; const y = p.y(v); ctx.fillRect(this.xOf(i) - w / 2, Math.min(y, y0), w, Math.max(1, Math.abs(y - y0))); }
      } else if (st === 'circles' || st === 'cross') {
        for (let i = i0; i <= i1; i++) {
          const v = pl.vals[i]; if (!isFinite(v) || !pl.colors[i]) continue; const x = this.xOf(i), y = p.y(v);
          ctx.fillStyle = ctx.strokeStyle = pl.colors[i];
          if (st === 'circles') { ctx.beginPath(); ctx.arc(x, y, Math.max(1.5, lw), 0, 6.283); ctx.fill(); }
          else { ctx.beginPath(); ctx.moveTo(x - 3, y); ctx.lineTo(x + 3, y); ctx.moveTo(x, y - 3); ctx.lineTo(x, y + 3); ctx.stroke(); }
        }
      } else {
        ctx.lineWidth = lw; ctx.lineJoin = 'round';
        let started = false, cur = null, px = 0, py = 0;
        const flush = () => { if (started) { ctx.stroke(); started = false; } };
        for (let i = Math.max(0, i0 - 1); i <= i1; i++) {
          const v = pl.vals[i], c = pl.colors[i];
          if (!isFinite(v) || !c) { flush(); cur = null; continue; }
          const x = this.xOf(i), y = p.y(v);
          if (st === 'stepline' && started) { if (c === cur) ctx.lineTo(x, py); }
          if (!started || c !== cur) {
            flush(); ctx.beginPath(); ctx.strokeStyle = c; cur = c; started = true;
            if (isFinite(pl.vals[i - 1]) && i > 0 && pl.colors[i - 1]) { ctx.moveTo(this.xOf(i - 1), p.y(pl.vals[i - 1])); ctx.lineTo(x, y); } else ctx.moveTo(x, y);
          } else ctx.lineTo(x, y);
          px = x; py = y;
        }
        flush();
        if (st === 'area') {
          ctx.beginPath(); let open = false, lastx = 0;
          for (let i = i0; i <= i1; i++) { const v = pl.vals[i]; if (!isFinite(v)) continue; const x = this.xOf(i), y = p.y(v); if (!open) { ctx.moveTo(x, p.y1); ctx.lineTo(x, y); open = true; } else ctx.lineTo(x, y); lastx = x; }
          if (open) { ctx.lineTo(lastx, p.y1); ctx.closePath(); const c = pl.colors[i1] || pl.colors[i1 - 1] || th.accent; ctx.globalAlpha = 0.18; ctx.fillStyle = c; ctx.fill(); ctx.globalAlpha = 1; }
        }
      }
    }
    // markers
    const stack = new Map();
    const all = res.markers.concat(isMain ? res.tradeMarkers : []);
    for (const m of all) {
      if (m.i < i0 || m.i > i1) continue;
      if (isMain !== !!m.overlay) continue;
      this._marker(m, p, isMain, stack);
    }
  }

  _marker(m, p, isMain, stack) {
    const ctx = this.ctx, b = this.bars, x = this.xOf(m.i), S = Math.max(5, Math.min(9, this.barW * 0.6 + 2));
    let loc = m.loc, y;
    if (!isMain && (loc === 'abovebar')) loc = 'top'; if (!isMain && loc === 'belowbar') loc = 'bottom';
    const key = m.i + '|' + loc, k = stack.get(key) || 0; stack.set(key, k + 1);
    const gap = k * (S * 2 + (m.text ? 11 : 3));
    if (loc === 'abovebar') y = p.y(b.h[m.i]) - 8 - S - gap;
    else if (loc === 'belowbar') y = p.y(b.l[m.i]) + 8 + S + gap;
    else if (loc === 'top') y = p.y0 + 10 + S + gap;
    else if (loc === 'bottom') y = p.y1 - 10 - S - gap;
    else y = p.y(isFinite(m.y) ? m.y : b.c[m.i]);
    const above = loc === 'abovebar' || loc === 'top';
    ctx.fillStyle = ctx.strokeStyle = typeof m.color === 'string' ? m.color : '#2962FF'; ctx.lineWidth = 1.6;
    const sh = m.shape; ctx.beginPath();
    if (sh === 'label') {
      ctx.font = FONT; const tw = ctx.measureText(m.text).width + 10;
      ctx.fillRect(x - tw / 2, y - 18, tw, 15); ctx.fillStyle = m.tcolor || '#fff'; ctx.textAlign = 'center'; ctx.fillText(m.text, x, y - 10); return;
    }
    if (sh === 'arrowup') { ctx.moveTo(x, y - S); ctx.lineTo(x + S * 0.9, y + S * 0.2); ctx.lineTo(x + S * 0.35, y + S * 0.2); ctx.lineTo(x + S * 0.35, y + S); ctx.lineTo(x - S * 0.35, y + S); ctx.lineTo(x - S * 0.35, y + S * 0.2); ctx.lineTo(x - S * 0.9, y + S * 0.2); ctx.closePath(); ctx.fill(); }
    else if (sh === 'arrowdown') { ctx.moveTo(x, y + S); ctx.lineTo(x + S * 0.9, y - S * 0.2); ctx.lineTo(x + S * 0.35, y - S * 0.2); ctx.lineTo(x + S * 0.35, y - S); ctx.lineTo(x - S * 0.35, y - S); ctx.lineTo(x - S * 0.35, y - S * 0.2); ctx.lineTo(x - S * 0.9, y - S * 0.2); ctx.closePath(); ctx.fill(); }
    else if (sh === 'triangleup' || sh === 'labelup') { ctx.moveTo(x, y - S); ctx.lineTo(x + S, y + S * 0.8); ctx.lineTo(x - S, y + S * 0.8); ctx.closePath(); ctx.fill(); }
    else if (sh === 'triangledown' || sh === 'labeldown') { ctx.moveTo(x, y + S); ctx.lineTo(x + S, y - S * 0.8); ctx.lineTo(x - S, y - S * 0.8); ctx.closePath(); ctx.fill(); }
    else if (sh === 'circle') { ctx.arc(x, y, S * 0.7, 0, 6.283); ctx.fill(); }
    else if (sh === 'square') ctx.fillRect(x - S * 0.7, y - S * 0.7, S * 1.4, S * 1.4);
    else if (sh === 'diamond') { ctx.moveTo(x, y - S); ctx.lineTo(x + S, y); ctx.lineTo(x, y + S); ctx.lineTo(x - S, y); ctx.closePath(); ctx.fill(); }
    else if (sh === 'cross') { ctx.moveTo(x - S * 0.7, y); ctx.lineTo(x + S * 0.7, y); ctx.moveTo(x, y - S * 0.7); ctx.lineTo(x, y + S * 0.7); ctx.stroke(); }
    else if (sh === 'flag') { ctx.moveTo(x, y + S); ctx.lineTo(x, y - S); ctx.lineTo(x + S, y - S * 0.4); ctx.lineTo(x, y + S * 0.2); ctx.stroke(); }
    else if (sh === 'char') { /* text only */ }
    else { ctx.moveTo(x - S * 0.6, y - S * 0.6); ctx.lineTo(x + S * 0.6, y + S * 0.6); ctx.moveTo(x + S * 0.6, y - S * 0.6); ctx.lineTo(x - S * 0.6, y + S * 0.6); ctx.stroke(); }
    if (m.text) {
      ctx.font = '10px "IBM Plex Mono", ui-monospace, monospace'; ctx.textAlign = 'center';
      ctx.fillStyle = m.tcolor && typeof m.tcolor === 'string' ? m.tcolor : (typeof m.color === 'string' ? m.color : '#2962FF');
      ctx.fillText(m.text, x, above ? y - S - 6 : y + S + 7);
    }
  }

  _subTitle(p) {
    const ctx = this.ctx, th = this.theme, res = p.s.res, i = this.hover >= 0 ? this.hover : this.n - 1;
    ctx.font = FONT; ctx.textAlign = 'left'; ctx.fillStyle = th.fg;
    let x = 8; const y = p.y0 + 10; const name = res.meta.short || res.meta.title;
    ctx.fillText(name, x, y); x += ctx.measureText(name).width + 10;
    for (const pl of res.plots) {
      if (pl.overlay || pl.hidden) continue; const v = pl.vals[i]; if (!isFinite(v)) continue;
      const t = v.toFixed(Math.abs(v) >= 100 ? 2 : Math.abs(v) >= 1 ? 2 : 4); ctx.fillStyle = pl.colors[i] || pl.colors[this.n - 1] || th.muted; ctx.fillText(t, x, y); x += ctx.measureText(t).width + 10;
      if (x > this.plotW() - 40) break;
    }
  }

  _tag(pw, y, text, bg, fg) {
    const ctx = this.ctx; ctx.fillStyle = bg; ctx.fillRect(pw, y - 9, AXIS_W, 18);
    ctx.fillStyle = fg; ctx.textAlign = 'left'; ctx.font = FONT; ctx.fillText(text, pw + 8, y);
  }

  _crosshair(panes, pw) {
    if (!this.cross) return;
    const ctx = this.ctx, th = this.theme, { x, y } = this.cross;
    if (x < 0 || x > pw) return;
    const i = Math.round(this.iOf(x)); if (i < 0 || i >= this.n) return;
    const cx = Math.round(this.xOf(i)) + 0.5, lastY = panes[panes.length - 1].y1;
    ctx.setLineDash([4, 4]); ctx.strokeStyle = th.muted; ctx.lineWidth = 1;
    ctx.beginPath(); ctx.moveTo(cx, 0); ctx.lineTo(cx, lastY); ctx.moveTo(0, Math.round(y) + 0.5); ctx.lineTo(pw, Math.round(y) + 0.5); ctx.stroke(); ctx.setLineDash([]);
    const p = panes.find(q => y >= q.y0 && y <= q.y1);
    if (p) this._tag(pw, y, p.v(y).toFixed(p.dec), th.fg, th.bg);
    const label = this._fmtTime(this.bars.t[i], true); ctx.font = FONT;
    const tw = ctx.measureText(label).width + 14; ctx.fillStyle = th.fg; ctx.fillRect(cx - tw / 2, lastY + 3, tw, 18);
    ctx.fillStyle = th.bg; ctx.textAlign = 'center'; ctx.fillText(label, cx, lastY + 12.5);
  }
}

function hasSub(res) {
  return res.plots.some(p => !p.overlay) || res.hlines.some(h => !h.overlay) || (res.markers.some(m => !m.overlay));
}
root.PChart = Chart;
})(window);

const SAMPLES = [
{ id: 'ema-cross', name: 'EMA Cross (strategy)', code: `//@version=5
strategy("EMA Cross", overlay=true, initial_capital=10000, default_qty_type=strategy.percent_of_equity, default_qty_value=100, commission_type=strategy.commission.percent, commission_value=0.05)

fastLen = input.int(9, "Fast EMA", minval=1)
slowLen = input.int(21, "Slow EMA", minval=2)
atrMult = input.float(3.0, "Stop (ATR x)", step=0.5)

fast = ta.ema(close, fastLen)
slow = ta.ema(close, slowLen)
atr  = ta.atr(14)

plot(fast, "Fast", color=color.new(color.aqua, 0), linewidth=2)
plot(slow, "Slow", color=color.new(color.orange, 0), linewidth=2)

if ta.crossover(fast, slow)
    strategy.entry("Long", strategy.long)
if ta.crossunder(fast, slow)
    strategy.close("Long")

strategy.exit("Stop", "Long", stop=strategy.position_avg_price - atrMult * atr)
` },
{ id: 'rsi', name: 'RSI', code: `//@version=5
indicator("RSI", overlay=false)

len = input.int(14, "Length", minval=1)
ob  = input.int(70, "Overbought")
os  = input.int(30, "Oversold")

r = ta.rsi(close, len)
plot(r, "RSI", color=color.purple, linewidth=2)
hline(ob, "Overbought", color=color.red)
hline(50, "Mid", color=color.gray)
hline(os, "Oversold", color=color.green)
bgcolor(r > ob ? color.new(color.red, 88) : r < os ? color.new(color.green, 88) : na)
` },
{ id: 'macd', name: 'MACD', code: `//@version=5
indicator("MACD", overlay=false)

fastLen = input.int(12, "Fast")
slowLen = input.int(26, "Slow")
sigLen  = input.int(9, "Signal")

[macdLine, signal, hist] = ta.macd(close, fastLen, slowLen, sigLen)

plot(hist, "Histogram", style=plot.style_histogram, color = hist >= 0 ? color.new(color.green, 30) : color.new(color.red, 30))
plot(macdLine, "MACD", color=color.blue, linewidth=2)
plot(signal, "Signal", color=color.orange, linewidth=2)
hline(0, "Zero", color=color.gray)
` },
{ id: 'bb', name: 'Bollinger Bands', code: `//@version=5
indicator("Bollinger Bands", overlay=true)

len  = input.int(20, "Length")
mult = input.float(2.0, "StdDev", step=0.1)
src  = input.source(close, "Source")

[basis, upper, lower] = ta.bb(src, len, mult)

p1 = plot(upper, "Upper", color=color.new(color.blue, 20))
p2 = plot(lower, "Lower", color=color.new(color.blue, 20))
plot(basis, "Basis", color=color.orange)
fill(p1, p2, color=color.new(color.blue, 92))

plotshape(ta.crossover(close, lower), "Buy", style=shape.triangleup, location=location.belowbar, color=color.green, text="Buy")
plotshape(ta.crossunder(close, upper), "Sell", style=shape.triangledown, location=location.abovebar, color=color.red, text="Sell")
` },
{ id: 'supertrend', name: 'Supertrend', code: `//@version=5
indicator("Supertrend", overlay=true)

factor = input.float(3.0, "Factor", step=0.1)
period = input.int(10, "ATR Period")

[st, dir] = ta.supertrend(factor, period)
upTrend = dir < 0

plot(upTrend ? st : na, "Up", color=color.green, linewidth=2, style=plot.style_linebr)
plot(upTrend ? na : st, "Down", color=color.red, linewidth=2, style=plot.style_linebr)
bgcolor(upTrend ? color.new(color.green, 94) : color.new(color.red, 94))
` },
{ id: 'rsi-strategy', name: 'RSI Mean Reversion (strategy)', code: `//@version=5
strategy("RSI Reversion", overlay=true, initial_capital=10000, default_qty_type=strategy.percent_of_equity, default_qty_value=50, commission_type=strategy.commission.percent, commission_value=0.05)

len   = input.int(14, "RSI length")
buyAt = input.int(30, "Buy below")
exitAt = input.int(55, "Exit above")
trend = ta.sma(close, 100)

r = ta.rsi(close, len)
plot(trend, "SMA 100", color=color.gray)

if r < buyAt and close > trend * 0.97
    strategy.entry("Long", strategy.long)
if r > exitAt
    strategy.close("Long")
strategy.exit("SL", "Long", stop=strategy.position_avg_price * 0.95)
` },
{ id: 'pivots', name: 'Pivot Highs and Lows', code: `//@version=5
indicator("Pivots", overlay=true)

left  = input.int(6, "Left bars")
right = input.int(6, "Right bars")

ph = ta.pivothigh(left, right)
pl = ta.pivotlow(left, right)

plotshape(not na(ph), "Pivot high", style=shape.triangledown, location=location.abovebar, color=color.red, offset=-right)
plotshape(not na(pl), "Pivot low", style=shape.triangleup, location=location.belowbar, color=color.green, offset=-right)
` },
{ id: 'stoch', name: 'Stochastic', code: `//@version=5
indicator("Stochastic", overlay=false)

kLen = input.int(14, "%K length")
dLen = input.int(3, "%D smoothing")

k = ta.stoch(close, high, low, kLen)
d = ta.sma(k, dLen)

plot(k, "%K", color=color.blue, linewidth=2)
plot(d, "%D", color=color.orange, linewidth=2)
hline(80, "Upper", color=color.red)
hline(20, "Lower", color=color.green)
` }
];
const BLANK = `//@version=5
indicator("My Script", overlay=true)

len = input.int(20, "Length")
ma = ta.sma(close, len)

plot(ma, "SMA", color=color.yellow, linewidth=2)
`;

(function () {
'use strict';
const $ = s => document.querySelector(s);
const esc = s => s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
const YEAR = 365 * 86400;

// Blog owner: paste your free Twelve Data key between the quotes to give every visitor stocks and forex data.
// Leave it empty and each visitor is asked for their own key (kept only in their browser).
const CONFIG = { twelveDataKey: '', proxy: 'https://ranaalgo.hazzor786.workers.dev' };
const TD_BASE = CONFIG.proxy || 'https://api.twelvedata.com';

const SYMS = [
  { id: 'BTCUSDT', name: 'Bitcoin / TetherUS', base: 67250, vol: 0.55, dec: 2, volu: 900 },
  { id: 'ETHUSDT', name: 'Ethereum / TetherUS', base: 3180, vol: 0.7, dec: 2, volu: 5000 },
  { id: 'AAPL', name: 'Apple Inc.', base: 228.4, vol: 0.28, dec: 2, volu: 4e6 },
  { id: 'TSLA', name: 'Tesla, Inc.', base: 241.7, vol: 0.6, dec: 2, volu: 6e6 },
  { id: 'EURUSD', name: 'Euro / U.S. Dollar', base: 1.0842, vol: 0.07, dec: 5, volu: 2e4 },
  { id: 'XAUUSD', name: 'Gold / U.S. Dollar', base: 2655.3, vol: 0.15, dec: 2, volu: 3e4 },
  { id: 'SPX', name: 'S&P 500 Index', base: 5821.5, vol: 0.16, dec: 2, volu: 2e6 }
];
const TFS = [['1m', 60], ['5m', 300], ['15m', 900], ['1h', 3600], ['4h', 14400], ['1D', 86400]];
const tfLabel = s => (TFS.find(t => t[1] === s) || [s >= 86400 ? Math.round(s / 86400) + 'D' : s >= 3600 ? Math.round(s / 3600) + 'h' : Math.round(s / 60) + 'm'])[0];

// ---------- state ----------
const WL = {
  crypto: [['BTCUSDT', 'Bitcoin'], ['ETHUSDT', 'Ethereum'], ['SOLUSDT', 'Solana'], ['BNBUSDT', 'BNB'], ['XRPUSDT', 'XRP'], ['DOGEUSDT', 'Dogecoin'], ['ADAUSDT', 'Cardano'], ['LINKUSDT', 'Chainlink']],
  stocks: [['AAPL', 'Apple'], ['MSFT', 'Microsoft'], ['NVDA', 'NVIDIA'], ['TSLA', 'Tesla'], ['AMZN', 'Amazon'], ['GOOGL', 'Alphabet'], ['META', 'Meta'], ['SPY', 'S&P 500 ETF']],
  forex: [['EUR/USD', 'Euro / Dollar'], ['GBP/USD', 'Pound / Dollar'], ['USD/JPY', 'Dollar / Yen'], ['XAU/USD', 'Gold / Dollar'], ['AUD/USD', 'Aussie / Dollar'], ['USD/CAD', 'Dollar / CAD'], ['USD/CHF', 'Dollar / Franc'], ['XAG/USD', 'Silver / Dollar']]
};
const st = { market: 'crypto', symbols: { crypto: 'BTCUSDT', stocks: 'AAPL', forex: 'EUR/USD', demo: 'BTCUSDT' }, tf: 3600, type: 'candles', volume: true, live: false, custom: null,
  ds: null, key: '', theme: 'auto', scripts: [], active: null, panel: 'ed', nextId: 1 };
const cache = new Map(), quotes = { crypto: {}, stocks: {}, forex: {} };
let tickN = 0, liveTimer = null, ws = null, saveT = null, applyT = null, loadToken = 0, liveRefreshT = null, pollN = 0, wlTimer = null;

// ---------- demo data ----------
function rng(seed) { let s = seed >>> 0 || 1; return () => { s ^= s << 13; s >>>= 0; s ^= s >>> 17; s ^= s << 5; s >>>= 0; return s / 4294967296; }; }
function hash(str) { let h = 2166136261; for (let i = 0; i < str.length; i++) { h ^= str.charCodeAt(i); h = Math.imul(h, 16777619); } return h >>> 0; }
function gauss(r) { let u = 0; while (!u) u = r(); return Math.sqrt(-2 * Math.log(u)) * Math.cos(6.2831853 * r()); }
function genBars(sym, tf, n) {
  const r = rng(hash(sym.id + ':' + tf)), sig0 = sym.vol * Math.sqrt(tf / YEAR);
  const end = Math.floor(Date.now() / 1000 / tf) * tf, t0 = end - (n - 1) * tf;
  const b = { t: [], o: [], h: [], l: [], c: [], v: [] };
  let p = 100, vs = 1, drift = 0;
  for (let i = 0; i < n; i++) {
    vs = 0.94 * vs + 0.06 * (0.6 + Math.abs(gauss(r)) * 0.9);
    if (i % 90 === 0) drift = (r() - 0.5) * sig0 * 0.3;
    const sig = sig0 * vs, ret = drift + sig * gauss(r), o = p, c = o * Math.exp(ret);
    const h = Math.max(o, c) * (1 + Math.abs(gauss(r)) * sig * 0.3), l = Math.min(o, c) * (1 - Math.abs(gauss(r)) * sig * 0.3);
    b.t.push(t0 + i * tf); b.o.push(o); b.h.push(h); b.l.push(l); b.c.push(c);
    b.v.push(Math.round(sym.volu * (0.45 + Math.abs(ret) / sig0 * 0.5 + r() * 0.6) * 100) / 100);
    p = c;
  }
  const k = sym.base / p;
  for (let i = 0; i < n; i++) { b.o[i] *= k; b.h[i] *= k; b.l[i] *= k; b.c[i] *= k; }
  return b;
}
const demoSym = id => SYMS.find(x => x.id === id) || { id, name: id, base: 100, vol: 0.5, dec: 2, volu: 1000 };
function demoDS(id, fallback) {
  const sym = demoSym(id), key = 'demo:' + sym.id + ':' + st.tf;
  if (!cache.has(key)) cache.set(key, { t: 0, ds: { bars: genBars(sym, st.tf, 1500), tf: st.tf, dec: sym.dec, name: sym.id, symbol: sym.id, source: 'Demo data', demo: true } });
  return Object.assign({}, cache.get(key).ds, { fallback: !!fallback });
}
const dataset = () => st.ds;
function dailyOf(sym) {
  const key = sym.id + ':d';
  if (!cache.has(key)) cache.set(key, genBars(sym, 86400, 120));
  return cache.get(key);
}

// ---------- real data ----------
const BIN_BASES = ['https://data-api.binance.vision', 'https://api.binance.com'];
const BIN_INT = { 60: '1m', 300: '5m', 900: '15m', 3600: '1h', 14400: '4h', 86400: '1d' };
const TD_INT = { 60: '1min', 300: '5min', 900: '15min', 3600: '1h', 14400: '4h', 86400: '1day' };
class NeedKey extends Error {}
const tdKey = () => CONFIG.proxy ? 'proxy' : (CONFIG.twelveDataKey || st.key || '');
async function getJSON(url, ms) {
  const c = new AbortController(), t = setTimeout(() => c.abort(), ms || 12000);
  try { const r = await fetch(url, { signal: c.signal }); let j = null; try { j = await r.json(); } catch (e) { /* not json */ } return { ok: r.ok, status: r.status, json: j }; }
  finally { clearTimeout(t); }
}
function decFor(market, p) { return market === 'forex' ? (p >= 20 ? 3 : 5) : (p >= 1 ? 2 : p >= 0.01 ? 4 : 8); }
function normSymbol(market, raw) {
  let v = String(raw || '').trim().toUpperCase();
  if (market === 'crypto') { v = v.replace(/[^A-Z0-9]/g, ''); if (/USD$/.test(v) && !/USDT$/.test(v)) v += 'T'; return v; }
  if (market === 'forex') { v = v.replace(/[^A-Z]/g, ''); return v.length === 6 ? v.slice(0, 3) + '/' + v.slice(3) : String(raw).trim().toUpperCase(); }
  return v.replace(/[^A-Z0-9.\-:]/g, '');
}
function finishBars(b, market, symbol, tf, source, min) {
  if (b.t.length < (min || 5)) throw new Error('No price history returned for ' + symbol + '.');
  return { bars: b, tf, dec: decFor(market, b.c[b.c.length - 1]), name: symbol, symbol, source, market };
}
async function fetchBinance(sym, tf) {
  if (!sym) throw new Error('Type a symbol, for example BTCUSDT.');
  let last;
  for (const base of BIN_BASES) {
    try {
      const r = await getJSON(base + '/api/v3/klines?symbol=' + sym + '&interval=' + BIN_INT[tf] + '&limit=1000');
      if (!r.ok) { const e = new Error(r.json && r.json.msg ? r.json.msg : 'Binance returned HTTP ' + r.status); e.final = r.status === 400; throw e; }
      const b = { t: [], o: [], h: [], l: [], c: [], v: [] };
      for (const k of r.json) { b.t.push(Math.floor(k[0] / 1000)); b.o.push(+k[1]); b.h.push(+k[2]); b.l.push(+k[3]); b.c.push(+k[4]); b.v.push(+k[5]); }
      return finishBars(b, 'crypto', sym, tf, 'Binance');
    } catch (e) { last = e; if (e.final) break; }
  }
  throw last;
}
function parseTD(values) {
  const b = { t: [], o: [], h: [], l: [], c: [], v: [] };
  for (const x of values) {
    const t = Date.parse(String(x.datetime).replace(' ', 'T') + (String(x.datetime).length > 10 ? 'Z' : 'T00:00:00Z')) / 1000;
    if (!isFinite(t)) continue;
    b.t.push(t); b.o.push(+x.open); b.h.push(+x.high); b.l.push(+x.low); b.c.push(+x.close); b.v.push(+x.volume || 0);
  }
  return b;
}
async function fetchTD(market, sym, tf, size) {
  if (!tdKey()) throw new NeedKey('Stocks and forex need a Twelve Data API key.');
  if (!sym) throw new Error('Type a symbol, for example AAPL or EUR/USD.');
  const url = TD_BASE + '/time_series?symbol=' + encodeURIComponent(sym) + '&interval=' + TD_INT[tf] + '&outputsize=' + (size || 1500) + '&timezone=UTC&order=asc&apikey=' + encodeURIComponent(tdKey());
  const r = await getJSON(url, 15000);
  const j = r.json;
  if (!j) throw new Error('Twelve Data returned an unreadable answer (HTTP ' + r.status + ').');
  if (j.status === 'error' || !Array.isArray(j.values)) {
    const e = new Error(j.message || 'Twelve Data returned an error.');
    if (j.code === 401 || /apikey|api key/i.test(j.message || '')) e.badKey = true;
    throw e;
  }
  return finishBars(parseTD(j.values), market, sym, tf, 'Twelve Data', size && size < 5 ? 1 : 5);
}
async function fetchReal(market, sym, tf) { return market === 'crypto' ? fetchBinance(sym, tf) : fetchTD(market, sym, tf); }
function explain(e) {
  if (e && e.name === 'AbortError') return 'The data server took too long to answer.';
  if (e instanceof TypeError) return 'Could not reach the data server. Check your connection, or turn off a VPN or ad blocker for this site.';
  return (e && e.message) || 'Unknown error.';
}

// ---------- notices ----------
const noticeEl = $('#notice');
function hideNotice() { noticeEl.hidden = true; noticeEl.innerHTML = ''; noticeEl.className = 'notice'; }
function showLoading(text) { noticeEl.className = 'notice'; noticeEl.hidden = false; noticeEl.innerHTML = '<span class="spin"></span><span>' + esc(text) + '</span>'; }
function showBanner(msg, retry) {
  noticeEl.className = 'notice warn'; noticeEl.hidden = false;
  noticeEl.innerHTML = '<span style="flex:1 1 220px;min-width:0">' + esc(msg) + '</span>' + (retry ? '<button class="btn" id="retryBtn">Retry</button>' : '') + '<button class="btn" id="dismissBtn" aria-label="Dismiss">Dismiss</button>';
  const r = $('#retryBtn'); if (r) r.onclick = () => { cache.delete(cacheKey()); dataChanged(false); };
  $('#dismissBtn').onclick = hideNotice;
}
function showKeyCard(msg) {
  noticeEl.className = 'notice center'; noticeEl.hidden = false;
  noticeEl.innerHTML = '<b>Add your Twelve Data key for stocks and forex</b><p>' + esc(msg || 'Crypto works without a key. Stocks and forex come from Twelve Data, which has a free plan (800 requests a day). Paste your key below. It is saved only in this browser.') + '</p>' +
    '<div class="row"><input class="field" id="keyIn" type="password" placeholder="API key" aria-label="Twelve Data API key" autocomplete="off" value="' + esc(st.key) + '"><button class="btn primary" id="keySave">Save and load</button></div>' +
    '<div class="row"><a href="https://twelvedata.com/pricing" target="_blank" rel="noopener">Get a free key</a><span style="flex:1"></span><button class="btn" id="keySkip">Use crypto instead</button></div>';
  $('#keySave').onclick = saveKey; $('#keyIn').onkeydown = e => { if (e.key === 'Enter') saveKey(); };
  $('#keySkip').onclick = () => { hideNotice(); st.market = 'crypto'; dataChanged(true); };
  setTimeout(() => $('#keyIn') && $('#keyIn').focus(), 30);
}
function saveKey() {
  const v = $('#keyIn').value.trim(); if (!v) return;
  st.key = v; try { localStorage.setItem('pinedesk.tdkey', v); } catch (e) { /* ignore */ }
  cache.clear(); hideNotice(); dataChanged(true);
}

// ---------- chart + theme ----------
const chart = new PChart($('#cv'));
function readTheme() {
  const cs = getComputedStyle(document.documentElement), g = n => cs.getPropertyValue(n).trim();
  chart.setTheme({ bg: g('--chart'), fg: g('--fg'), muted: g('--muted'), grid: g('--grid'), up: g('--up'), down: g('--down'), accent: g('--accent'), line: g('--line') });
}
// "Auto" follows the page this chart is embedded in (Blogger), then the visitor's system setting.
function parentIsDark() {
  try {
    if (window.parent === window) return null;
    const pw = window.parent, pd = pw.document;
    const parse = c => { const m = /rgba?\(([^)]+)\)/.exec(c || ''); if (!m) return null; const p = m[1].split(',').map(parseFloat); return { r: p[0], g: p[1], b: p[2], a: p[3] === undefined ? 1 : p[3] }; };
    const lum = c => (0.2126 * c.r + 0.7152 * c.g + 0.0722 * c.b) / 255;
    for (const el of [pd.body, pd.documentElement]) { const c = parse(pw.getComputedStyle(el).backgroundColor); if (c && c.a > 0.05) return lum(c) < 0.5; }
    const t = parse(pw.getComputedStyle(pd.body).color); if (t) return lum(t) > 0.6;
  } catch (e) { /* cross-origin */ }
  return null;
}
function resolveTheme() {
  if (st.theme !== 'auto') return st.theme;
  const p = parentIsDark();
  if (p !== null) return p ? 'dark' : 'light';
  return matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
}
function applyTheme() {
  const t = resolveTheme(); if (document.documentElement.dataset.theme !== t) document.documentElement.dataset.theme = t;
  $('#themeBtn').textContent = 'Theme: ' + st.theme[0].toUpperCase() + st.theme.slice(1);
}
new MutationObserver(() => { readTheme(); renderReport(); }).observe(document.documentElement, { attributes: true, attributeFilter: ['data-theme'] });
matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => { if (st.theme === 'auto') applyTheme(); });
setInterval(() => { if (st.theme === 'auto') applyTheme(); }, 1500);
$('#themeBtn').addEventListener('click', () => { st.theme = st.theme === 'auto' ? 'light' : st.theme === 'light' ? 'dark' : 'auto'; applyTheme(); save(); });

// ---------- scripts ----------
const activeSlot = () => st.scripts.find(s => s.id === st.active) || null;
function newSlot(code, name, sampleId) {
  const s = { id: st.nextId++, name: name || 'Script', code, visible: true, inputs: {}, res: null, error: null, ms: 0, sampleId: sampleId || null };
  st.scripts.push(s); return s;
}
function runSlot(s, keepOld) {
  const ds = dataset(), t0 = performance.now();
  const res = Pine.run(s.code, ds.bars, { symbol: ds.symbol, inputs: s.inputs });
  s.ms = performance.now() - t0;
  if (res.error) { s.error = res.error; if (!keepOld || !s.res) s.res = res; }
  else { s.error = null; s.res = res; s.name = res.meta.short || res.meta.title || 'Script'; }
}
function pushToChart() {
  chart.setScripts(st.scripts.filter(s => s.res).map(s => ({ id: s.id, visible: s.visible, res: s.res })));
}
function runAll() { for (const s of st.scripts) runSlot(s, false); pushToChart(); }
function refresh(opts) {
  opts = opts || {};
  pushToChart(); renderChips(); renderStatus(); if (!opts.skipInputs) renderInputs(); renderReport(); renderLegend(chart.hover);
  save();
}

// ---------- editor ----------
const ta = $('#code'), hl = $('#hl'), gutter = $('#gutter');
const TOKEN = /(\/\/.*)|("(?:[^"\\\n]|\\.)*"|'(?:[^'\\\n]|\\.)*')|(#[0-9a-fA-F]{6,8}\b)|(\b\d+\.?\d*\b)|\b(if|else|for|to|by|while|var|varip|and|or|not|true|false|break|continue|na)\b|\b((?:color|shape|location|plot|strategy|display|size|math|hline|barstate)\.[A-Za-z_]+)\b(?!\s*\()|\b([A-Za-z_][\w.]*)(?=\s*\()/g;
function hlLine(line) {
  let out = '', last = 0, m; TOKEN.lastIndex = 0;
  while ((m = TOKEN.exec(line))) {
    out += esc(line.slice(last, m.index));
    const cls = m[1] ? 't-com' : m[2] || m[3] ? 't-str' : m[4] ? 't-num' : m[5] ? 't-kw' : m[6] ? 't-const' : 't-fn';
    out += '<span class="' + cls + '">' + esc(m[0]) + '</span>'; last = TOKEN.lastIndex;
    if (m[0].length === 0) TOKEN.lastIndex++;
  }
  return out + esc(line.slice(last));
}
function renderEditor() {
  const s = activeSlot(), lines = (ta.value || '').split('\n'), errLine = s && s.error ? s.error.line : -1;
  hl.innerHTML = lines.map((l, i) => '<div class="ln' + (i + 1 === errLine ? ' err' : '') + '">' + (hlLine(l) || '&#8203;') + '</div>').join('');
  gutter.innerHTML = lines.map((_, i) => '<div' + (i + 1 === errLine ? ' class="err"' : '') + '>' + (i + 1) + '</div>').join('');
  syncScroll();
}
function syncScroll() { hl.scrollTop = ta.scrollTop; hl.scrollLeft = ta.scrollLeft; gutter.scrollTop = ta.scrollTop; }
function loadActiveIntoEditor() {
  const s = activeSlot();
  ta.disabled = !s; ta.value = s ? s.code : '';
  renderEditor();
}
function setActive(id) { st.active = id; loadActiveIntoEditor(); refresh(); }
function applyActive() {
  const s = activeSlot(); if (!s) return;
  s.code = ta.value; runSlot(s, true); refresh({ skipInputs: false }); renderEditor();
}
ta.addEventListener('input', () => {
  const s = activeSlot(); if (!s) return;
  s.code = ta.value; s.sampleId = s.sampleId; renderEditor(); clearTimeout(applyT);
  applyT = setTimeout(() => { runSlot(s, true); refresh(); renderEditor(); }, 700);
});
ta.addEventListener('scroll', syncScroll);
let trapTab = true;
ta.addEventListener('blur', () => { trapTab = true; });
ta.addEventListener('keydown', e => {
  if (e.key === 'Escape') { trapTab = false; return; }
  if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') { e.preventDefault(); clearTimeout(applyT); applyActive(); return; }
  if (e.key === 'Tab' && trapTab && !e.shiftKey) { e.preventDefault(); if (!document.execCommand('insertText', false, '    ')) { const a = ta.selectionStart; ta.setRangeText('    ', a, ta.selectionEnd, 'end'); ta.dispatchEvent(new Event('input')); } return; }
  if (e.key === 'Enter' && !e.ctrlKey && !e.metaKey && ta.selectionStart === ta.selectionEnd) {
    const pos = ta.selectionStart, before = ta.value.slice(0, pos), cur = before.slice(before.lastIndexOf('\n') + 1);
    let ind = cur.match(/^ */)[0];
    if (/(=>|^\s*(if|for|while|else)\b.*)\s*$/.test(cur.replace(/\/\/.*$/, ''))) ind += '    ';
    if (ind) { e.preventDefault(); if (!document.execCommand('insertText', false, '\n' + ind)) { ta.setRangeText('\n' + ind, pos, pos, 'end'); ta.dispatchEvent(new Event('input')); } }
  }
});
$('#applyBtn').addEventListener('click', () => { clearTimeout(applyT); applyActive(); });
$('#newBtn').addEventListener('click', () => { const s = newSlot(BLANK, 'My Script'); runSlot(s); setActive(s.id); ta.focus(); });
const exSel = $('#examples');
SAMPLES.forEach(x => { const o = document.createElement('option'); o.value = x.id; o.textContent = x.name; exSel.appendChild(o); });
exSel.addEventListener('change', () => {
  const x = SAMPLES.find(q => q.id === exSel.value); exSel.value = ''; if (!x) return;
  let s = st.scripts.find(q => q.sampleId === x.id);
  if (!s) { s = newSlot(x.code, x.name, x.id); runSlot(s); }
  s.visible = true; setActive(s.id);
});

// ---------- chips / status / inputs ----------
function renderChips() {
  const box = $('#chips'); box.innerHTML = '';
  if (!st.scripts.length) { box.innerHTML = '<span style="color:var(--muted)">No scripts on the chart. Load an example or press New.</span>'; return; }
  for (const s of st.scripts) {
    const c = document.createElement('div'); c.className = 'chip' + (s.id === st.active ? ' active' : '');
    const eye = document.createElement('button'); eye.title = s.visible ? 'Hide on chart' : 'Show on chart'; eye.setAttribute('aria-label', eye.title);
    eye.innerHTML = '<svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" class="' + (s.visible ? '' : 'off') + '"><path d="M1 8s2.5-5 7-5 7 5 7 5-2.5 5-7 5-7-5-7-5z"/><circle cx="8" cy="8" r="2"/>' + (s.visible ? '' : '<path d="M2 14L14 2"/>') + '</svg>';
    eye.onclick = () => { s.visible = !s.visible; refresh({ skipInputs: true }); };
    const nm = document.createElement('button'); nm.className = 'name'; nm.textContent = s.name + (s.res && s.res.meta.strategy ? ' (strategy)' : ''); nm.onclick = () => setActive(s.id);
    const x = document.createElement('button'); x.title = 'Remove from chart'; x.setAttribute('aria-label', 'Remove ' + s.name); x.innerHTML = '<svg width="12" height="12" viewBox="0 0 12 12" stroke="currentColor" stroke-width="1.6"><path d="M2 2l8 8M10 2l-8 8"/></svg>';
    x.onclick = () => {
      st.scripts = st.scripts.filter(q => q.id !== s.id);
      if (st.active === s.id) st.active = st.scripts.length ? st.scripts[st.scripts.length - 1].id : null;
      loadActiveIntoEditor(); refresh();
    };
    c.append(eye, nm, x); box.appendChild(c);
  }
}
function renderStatus() {
  const s = activeSlot(), el = $('#status'); el.className = 'status';
  if (!s) { el.textContent = 'No script selected.'; return; }
  if (s.error) { el.classList.add('bad'); el.textContent = (s.error.line ? 'Line ' + s.error.line + ': ' : '') + s.error.message; return; }
  el.classList.add('ok');
  const n = dataset().bars.t.length, extra = s.res && s.res.strategy ? ' · ' + s.res.strategy.trades.length + ' trades' : '';
  el.textContent = 'Compiled in ' + s.ms.toFixed(0) + ' ms · ' + n.toLocaleString() + ' bars' + extra;
}
function renderInputs() {
  const box = $('#inputs'), s = activeSlot(); box.innerHTML = '';
  if (!s || !s.res || !s.res.inputs.length) return;
  const h = document.createElement('div'); h.className = 'inputs-h'; h.textContent = 'Inputs'; box.appendChild(h);
  s.res.inputs.forEach((inp, k) => {
    const id = 'in-' + s.id + '-' + k;
    const set = v => { s.inputs[inp.title] = v; runSlot(s, true); refresh({ skipInputs: true }); renderEditor(); };
    const lab = document.createElement('label'); lab.htmlFor = id;
    if (inp.type === 'bool') {
      lab.className = 'chk'; const c = document.createElement('input'); c.type = 'checkbox'; c.id = id; c.checked = !!inp.value; c.onchange = () => set(c.checked);
      lab.append(c, document.createTextNode(inp.title));
    } else if ((inp.options && inp.options.length) || inp.type === 'source') {
      lab.append(document.createTextNode(inp.title)); const sel = document.createElement('select'); sel.id = id; sel.className = 'field';
      inp.options.forEach(o => { const op = document.createElement('option'); op.value = o; op.textContent = o; if (String(o) === String(inp.value)) op.selected = true; sel.appendChild(op); });
      sel.onchange = () => set(sel.value); lab.appendChild(sel);
    } else {
      lab.append(document.createTextNode(inp.title)); const f = document.createElement('input'); f.id = id; f.className = 'field';
      if (inp.type === 'int' || inp.type === 'float') { f.type = 'number'; if (inp.min !== undefined) f.min = inp.min; if (inp.max !== undefined) f.max = inp.max; f.step = inp.step || (inp.type === 'int' ? 1 : 0.1); }
      f.value = inp.value; f.onchange = () => set(f.value); lab.appendChild(f);
    }
    box.appendChild(lab);
  });
}

// ---------- legend ----------
const fmtV = v => v >= 1e9 ? (v / 1e9).toFixed(2) + 'B' : v >= 1e6 ? (v / 1e6).toFixed(2) + 'M' : v >= 1e3 ? (v / 1e3).toFixed(1) + 'K' : v.toFixed(0);
function renderLegend(i) {
  const ds = dataset(), b = ds.bars, n = b.t.length; if (!n) return;
  if (i === undefined || i < 0 || i >= n) i = n - 1;
  const dec = ds.dec, up = b.c[i] >= b.o[i], cls = up ? 'up' : 'down', prev = i > 0 ? b.c[i - 1] : b.o[i];
  const chg = b.c[i] - prev, pct = chg / prev * 100;
  const f = v => v.toFixed(dec);
  let h = '<div class="row"><span class="sym">' + esc(ds.name) + '</span><span class="k">' + tfLabel(ds.tf) + '</span>' +
    '<span><span class="k">O</span> <span class="' + cls + '">' + f(b.o[i]) + '</span></span><span><span class="k">H</span> <span class="' + cls + '">' + f(b.h[i]) + '</span></span>' +
    '<span><span class="k">L</span> <span class="' + cls + '">' + f(b.l[i]) + '</span></span><span><span class="k">C</span> <span class="' + cls + '">' + f(b.c[i]) + '</span></span>' +
    '<span class="' + cls + '">' + (chg >= 0 ? '+' : '') + f(chg) + ' (' + (pct >= 0 ? '+' : '') + pct.toFixed(2) + '%)</span>' +
    '<span><span class="k">Vol</span> ' + fmtV(b.v[i]) + '</span></div>';
  for (const s of st.scripts) {
    if (!s.visible || !s.res) continue;
    const vals = s.res.plots.filter(p => p.overlay && !p.hidden && isFinite(p.vals[i])).map(p => '<b style="color:' + esc(p.colors[i] || p.colors[n - 1] || 'var(--muted)') + '">' + p.vals[i].toFixed(dec) + '</b>').join(' ');
    if (s.res.plots.some(p => p.overlay)) h += '<div class="row ind"><span>' + esc(s.name) + '</span>' + vals + '</div>';
  }
  $('#legend').innerHTML = h;
}
chart.onHover = renderLegend;

// ---------- watchlist ----------
function spark(vals, color) {
  const lo = Math.min(...vals), hi = Math.max(...vals), w = 64, hh = 22;
  const pts = vals.map((v, i) => (i / (vals.length - 1) * w).toFixed(1) + ',' + (hh - 2 - (v - lo) / (hi - lo || 1) * (hh - 4)).toFixed(1)).join(' ');
  return '<svg width="64" height="22" viewBox="0 0 64 22" aria-hidden="true"><polyline points="' + pts + '" fill="none" stroke="' + color + '" stroke-width="1.5" stroke-linejoin="round"/></svg>';
}
const wlMarket = () => (st.custom ? st.market : st.market);
function renderWatchlist() {
  const box = $('#wl'), note = $('#wlNote'), m = st.market; let h = '';
  const ds = st.ds, curSymbol = ds && !st.custom ? ds.symbol : null;
  if (m === 'demo') {
    for (const s of SYMS) {
      const d = dailyOf(s), n = d.c.length, active = curSymbol === s.id;
      const price = active ? ds.bars.c[ds.bars.c.length - 1] : d.c[n - 1], open = d.o[n - 1], pct = (price - open) / open * 100, up = pct >= 0;
      h += '<button class="wl-row" data-s="' + s.id + '"' + (active ? ' aria-current="true"' : '') + '><div style="min-width:0"><div class="s">' + s.id + '</div><div class="n">' + esc(s.name) + '</div></div>' + spark(d.c.slice(-40), up ? 'var(--up)' : 'var(--down)') +
        '<div style="text-align:right"><div class="p">' + price.toFixed(s.dec) + '</div><div class="c ' + (up ? 'up' : 'down') + '">' + (up ? '+' : '') + pct.toFixed(2) + '%</div></div></button>';
    }
    note.textContent = 'Demo quotes are simulated and move only while Live is on.';
  } else {
    const q = quotes[m];
    if (m !== 'crypto') h += '<div class="wl-tools"><button class="btn" id="wlLoad">Load prices</button><span>Uses one request per symbol from your free limit.</span></div>';
    for (const [sym, name] of WL[m]) {
      const x = q[sym], active = curSymbol === sym, up = x && x.pct >= 0;
      h += '<button class="wl-row nospark" data-s="' + esc(sym) + '"' + (active ? ' aria-current="true"' : '') + '><div style="min-width:0"><div class="s">' + esc(sym) + '</div><div class="n">' + esc(name) + '</div></div>' +
        '<div style="text-align:right"><div class="p">' + (x ? x.price : '–') + '</div><div class="c ' + (x ? (up ? 'up' : 'down') : '') + '">' + (x ? (up ? '+' : '') + x.pct.toFixed(2) + '%' : '') + '</div></div></button>';
    }
    note.textContent = m === 'crypto' ? 'Prices and 24h change from Binance, refreshed every 20 seconds.' : 'Prices from Twelve Data. Press Load prices to refresh.';
  }
  box.innerHTML = h;
  const lb = $('#wlLoad'); if (lb) lb.onclick = loadTDQuotes;
}
$('#wl').addEventListener('click', e => { const b = e.target.closest('.wl-row'); if (b) setSymbolFor(st.market, b.dataset.s); });
const fmtQ = (m, p) => p.toFixed(decFor(m, p));
async function loadCryptoQuotes() {
  if (st.market !== 'crypto') return;
  const list = encodeURIComponent(JSON.stringify(WL.crypto.map(x => x[0])));
  for (const base of BIN_BASES) {
    try {
      const r = await getJSON(base + '/api/v3/ticker/24hr?symbols=' + list, 10000);
      if (!r.ok || !Array.isArray(r.json)) continue;
      for (const x of r.json) quotes.crypto[x.symbol] = { price: fmtQ('crypto', +x.lastPrice), pct: +x.priceChangePercent };
      if (st.market === 'crypto') renderWatchlist(); return;
    } catch (e) { /* try next */ }
  }
}
async function loadTDQuotes() {
  const m = st.market; if (m === 'crypto' || m === 'demo') return;
  if (!tdKey()) { showKeyCard(); return; }
  const btn = $('#wlLoad'); if (btn) { btn.disabled = true; btn.textContent = 'Loading…'; }
  try {
    const syms = WL[m].map(x => x[0]).join(',');
    const r = await getJSON(TD_BASE + '/quote?symbol=' + encodeURIComponent(syms) + '&apikey=' + encodeURIComponent(tdKey()), 15000);
    const j = r.json || {};
    if (j.status === 'error') throw new Error(j.message);
    for (const [sym] of WL[m]) { const x = j[sym]; if (x && x.close) quotes[m][sym] = { price: fmtQ(m, +x.close), pct: +x.percent_change || 0 }; }
  } catch (e) { showBanner('Could not load prices: ' + explain(e), false); }
  if (st.market === m) renderWatchlist();
}
function startWlTimer() { clearInterval(wlTimer); wlTimer = setInterval(() => { if (!document.hidden) loadCryptoQuotes(); }, 20000); }

// ---------- backtest report ----------
const nf = (v, d) => isFinite(v) ? v.toLocaleString(undefined, { minimumFractionDigits: d, maximumFractionDigits: d }) : '–';
function renderReport() {
  const box = $('#report');
  const slot = (activeSlot() && activeSlot().res && activeSlot().res.strategy && activeSlot()) || st.scripts.find(s => s.res && s.res.strategy);
  if (!slot) { box.innerHTML = '<div class="empty">No strategy on the chart.<br>Load <b>EMA Cross (strategy)</b> from the examples and press Apply to see results here.</div>'; return; }
  const R = slot.res.strategy, S = R.stats, ds = dataset(), cls = v => (v > 0 ? 'up' : v < 0 ? 'down' : '');
  const sgn = v => (v > 0 ? '+' : '');
  let h = '<div><p class="h">' + esc(slot.name) + ' · ' + esc(ds.name) + ' · ' + tfLabel(ds.tf) + '</p><div class="stats">' +
    stat('Net profit', '<span class="' + cls(S.netProfit) + '">' + sgn(S.netProfit) + nf(S.netProfit, 2) + '</span>') +
    stat('Return', '<span class="' + cls(S.returnPct) + '">' + sgn(S.returnPct) + nf(S.returnPct, 2) + '%</span>') +
    stat('Closed trades', S.total) + stat('Win rate', nf(S.winRate, 1) + '%') + stat('Profit factor', S.profitFactor === Infinity ? '∞' : nf(S.profitFactor, 2)) +
    stat('Max drawdown', nf(S.maxDDPct, 2) + '%') + stat('Avg trade', nf(S.avgTrade, 2)) + stat('Open P&L', '<span class="' + cls(S.openPnl) + '">' + sgn(S.openPnl) + nf(S.openPnl, 2) + '</span>') + '</div></div>';
  h += '<div><p class="h">Equity curve</p>' + equitySvg(R) + '</div>';
  const trades = R.trades.slice().reverse().slice(0, 150);
  h += '<div><p class="h">Trades (latest first)</p><div class="tbl-wrap" style="max-height:260px;overflow:auto"><table><thead><tr><th>#</th><th>Side</th><th>Entry</th><th>Exit</th><th>P&amp;L</th></tr></thead><tbody>' +
    (trades.length ? trades.map((t, k) => '<tr style="cursor:pointer" data-bar="' + t.entryBar + '"><td>' + (R.trades.length - k) + '</td><td class="' + (t.dir > 0 ? 'up' : 'down') + '">' + (t.dir > 0 ? 'Long' : 'Short') + '</td><td>' + t.entryPrice.toFixed(ds.dec) + '</td><td>' + (t.open ? 'open' : t.exitPrice.toFixed(ds.dec)) + '</td><td class="' + cls(t.pnl) + '">' + sgn(t.pnl) + nf(t.pnl, 2) + '</td></tr>').join('') : '<tr><td colspan="5" style="text-align:center;color:var(--muted)">No trades yet</td></tr>') +
    '</tbody></table></div></div>';
  box.innerHTML = h;
}
const stat = (l, v) => '<div class="stat"><div class="l">' + l + '</div><div class="v">' + v + '</div></div>';
function equitySvg(R) {
  const eq = R.equity, n = eq.length, W = 600, H = 130, P = 8, step = Math.max(1, Math.floor(n / 300));
  let lo = Infinity, hi = -Infinity; for (let i = 0; i < n; i++) { if (eq[i] < lo) lo = eq[i]; if (eq[i] > hi) hi = eq[i]; }
  lo = Math.min(lo, R.init); hi = Math.max(hi, R.init); const rg = hi - lo || 1;
  const X = i => P + i / (n - 1 || 1) * (W - 2 * P - 44), Y = v => H - P - (v - lo) / rg * (H - 2 * P);
  let pts = ''; for (let i = 0; i < n; i += step) pts += X(i).toFixed(1) + ',' + Y(eq[i]).toFixed(1) + ' ';
  pts += X(n - 1).toFixed(1) + ',' + Y(eq[n - 1]).toFixed(1);
  const up = eq[n - 1] >= R.init, col = up ? 'var(--up)' : 'var(--down)';
  return '<svg class="eq" viewBox="0 0 ' + W + ' ' + H + '" preserveAspectRatio="none" role="img" aria-label="Equity curve"><line x1="' + P + '" x2="' + (W - P - 44) + '" y1="' + Y(R.init) + '" y2="' + Y(R.init) + '" stroke="var(--muted)" stroke-dasharray="4 4" stroke-width="1" vector-effect="non-scaling-stroke"/>' +
    '<polygon points="' + P + ',' + (H - P) + ' ' + pts + ' ' + X(n - 1) + ',' + (H - P) + '" fill="' + col + '" opacity=".12"/><polyline points="' + pts + '" fill="none" stroke="' + col + '" stroke-width="1.6" vector-effect="non-scaling-stroke"/>' +
    '<text x="' + (W - 4) + '" y="' + (Y(hi) + 10) + '" text-anchor="end" font-size="10" fill="var(--muted)" font-family="IBM Plex Mono, monospace">' + Math.round(hi).toLocaleString() + '</text>' +
    '<text x="' + (W - 4) + '" y="' + (Y(lo) - 3) + '" text-anchor="end" font-size="10" fill="var(--muted)" font-family="IBM Plex Mono, monospace">' + Math.round(lo).toLocaleString() + '</text></svg>';
}
$('#report').addEventListener('click', e => { const r = e.target.closest('tr[data-bar]'); if (r) chart.focus(+r.dataset.bar); });

// ---------- data controls ----------
const cacheKey = () => st.market + ':' + st.symbols[st.market] + ':' + st.tf;
function buildTfs() {
  const box = $('#tfs'); box.innerHTML = '';
  TFS.forEach(([l, s]) => { const b = document.createElement('button'); b.textContent = l; b.dataset.s = s; b.disabled = !!st.custom; b.setAttribute('aria-pressed', String(!st.custom && s === st.tf)); b.onclick = () => { st.tf = s; dataChanged(true); }; box.appendChild(b); });
}
function buildHeader() {
  $('#market').value = st.market;
  $('#symIn').value = st.custom ? st.custom.name : st.symbols[st.market];
  const dl = $('#symList'); dl.innerHTML = '';
  (st.market === 'demo' ? SYMS.map(x => [x.id, x.name]) : WL[st.market]).forEach(([id, n]) => { const o = document.createElement('option'); o.value = id; o.label = n; dl.appendChild(o); });
  const tag = $('#srcTag'), ds = st.ds; let text = '', real = false, title = '';
  if (st.custom) { text = 'Your CSV'; real = true; }
  else if (ds && ds.demo) { text = ds.fallback ? 'Demo data (offline)' : 'Demo data'; title = 'Prices are simulated in your browser.'; }
  else if (ds) { text = ds.source; real = true; title = 'Real prices from ' + ds.source; }
  tag.textContent = text; tag.title = title; tag.className = 'demo-tag' + (real ? ' real' : '');
  $('#keyBtn').hidden = !(st.market === 'stocks' || st.market === 'forex');
  $('#liveBtn').title = st.market === 'crypto' ? 'Real-time prices from Binance. Scripts re-run on every update.' : st.market === 'demo' ? 'Simulated ticks. Scripts re-run on every tick.' : 'Refreshes the latest bar once a minute for up to 30 minutes.';
}
function setSymbolFor(market, raw) {
  st.custom = null; st.market = market;
  if (market === 'demo') { if (SYMS.some(x => x.id === raw)) st.symbols.demo = raw; }
  else st.symbols[market] = normSymbol(market, raw);
  dataChanged(true);
}
$('#market').addEventListener('change', e => { st.custom = null; st.market = e.target.value; dataChanged(true); });
$('#symIn').addEventListener('change', e => setSymbolFor(st.market, e.target.value));
$('#keyBtn').addEventListener('click', () => showKeyCard('Paste a different key to replace the saved one.'));
function applyData(reset) {
  buildHeader(); const ds = st.ds;
  chart.setBars(ds.bars, ds.tf, reset); runAll(); refresh(); renderWatchlist(); renderEditor();
  if (st.market === 'crypto') loadCryptoQuotes();
  if (!st.custom && !ds.demo && !ds.fallback) setTimeout(() => { if (!st.live) $('#liveBtn').click(); }, 500);
}
async function dataChanged(reset) {
  stopLive(); const token = ++loadToken; hideNotice(); buildTfs(); buildHeader();
  const m = st.market, sym = st.symbols[m];
  if (st.custom) { st.ds = st.custom; applyData(reset); return; }
  if (m === 'demo') { st.ds = demoDS(sym); applyData(reset); return; }
  const key = cacheKey(), hit = cache.get(key);
  if (hit && Date.now() - hit.t < 60000) { st.ds = hit.ds; applyData(reset); return; }
  if ((m === 'stocks' || m === 'forex') && !tdKey()) { st.ds = demoDS(sym, true); applyData(reset); showKeyCard(); return; }
  showLoading('Loading ' + sym + ' ' + tfLabel(st.tf) + '…');
  try {
    const ds = await fetchReal(m, sym, st.tf);
    if (token !== loadToken) return;
    cache.set(key, { t: Date.now(), ds }); st.ds = ds; hideNotice(); applyData(reset);
  } catch (e) {
    if (token !== loadToken) return;
    st.ds = demoDS(sym, true); applyData(reset);
    if (e instanceof NeedKey) showKeyCard();
    else if (e.badKey) showKeyCard('Twelve Data did not accept this key: ' + e.message);
    else showBanner(explain(e) + ' Showing demo data instead.', true);
  }
}
$('#types').addEventListener('click', e => {
  const b = e.target.closest('button'); if (!b) return; st.type = b.dataset.t; chart.setType(st.type);
  $('#types').querySelectorAll('button').forEach(x => x.setAttribute('aria-pressed', String(x === b))); save();
});
$('#volBtn').addEventListener('click', e => { st.volume = !st.volume; e.currentTarget.setAttribute('aria-pressed', String(st.volume)); chart.setVolume(st.volume); save(); });

// ---------- live ----------
function stopLive() {
  st.live = false; clearInterval(liveTimer); liveTimer = null; clearTimeout(liveRefreshT); liveRefreshT = null;
  if (ws) { try { ws.onclose = null; ws.close(); } catch (e) { /* ignore */ } ws = null; }
  $('#liveBtn').setAttribute('aria-pressed', 'false');
}
function liveRefresh() {
  if (liveRefreshT) return;
  liveRefreshT = setTimeout(() => {
    liveRefreshT = null; const ds = st.ds; if (!ds) return;
    chart.setBars(ds.bars, ds.tf, false); runAll(); renderStatus(); renderReport(); renderLegend(chart.hover);
    if (st.panel === 'wl' && st.market === 'demo') renderWatchlist();
  }, 350);
}
function tick() {
  const ds = st.ds, b = ds.bars, n = b.t.length, sym = demoSym(ds.symbol), r = Math.random;
  const sig = sym.vol * Math.sqrt(ds.tf / YEAR) * 0.2;
  if (++tickN % 30 === 0) { b.t.push(b.t[n - 1] + ds.tf); b.o.push(b.c[n - 1]); b.h.push(b.c[n - 1]); b.l.push(b.c[n - 1]); b.c.push(b.c[n - 1]); b.v.push(0); }
  const i = b.t.length - 1, c = b.c[i] * Math.exp(sig * gauss(r));
  b.c[i] = c; if (c > b.h[i]) b.h[i] = c; if (c < b.l[i]) b.l[i] = c; b.v[i] += Math.round(sym.volu * r() * 0.04 * 100) / 100;
  liveRefresh();
}
function putBar(b, t, o, h, l, c, v) {
  let i = b.t.lastIndexOf(t);
  if (i < 0) { if (t < b.t[b.t.length - 1]) return; b.t.push(t); b.o.push(0); b.h.push(0); b.l.push(0); b.c.push(0); b.v.push(0); i = b.t.length - 1; }
  b.o[i] = o; b.h[i] = h; b.l[i] = l; b.c[i] = c; b.v[i] = v;
}
function openWS() {
  const ds = st.ds, sym = ds.symbol.toLowerCase(), iv = BIN_INT[ds.tf];
  const urls = ['wss://data-stream.binance.vision/ws/' + sym + '@kline_' + iv, 'wss://stream.binance.com:9443/ws/' + sym + '@kline_' + iv];
  let ui = 0, got = false, tries = 0;
  const connect = () => {
    if (!st.live || st.ds !== ds) return;
    let sock; try { sock = new WebSocket(urls[ui]); } catch (e) { stopLive(); showBanner('Live prices are not available here.', false); return; }
    ws = sock;
    sock.onmessage = ev => { got = true; try { const m = JSON.parse(ev.data); if (m.k) { putBar(ds.bars, Math.floor(m.k.t / 1000), +m.k.o, +m.k.h, +m.k.l, +m.k.c, +m.k.v); liveRefresh(); } } catch (e) { /* ignore */ } };
    sock.onclose = () => {
      if (!st.live || ws !== sock) return;
      if (!got) ui++;
      if (ui >= urls.length || ++tries > 6) { stopLive(); showBanner('Could not open the live price stream.', false); return; }
      setTimeout(connect, 1500);
    };
  };
  connect();
}
async function pollTD() {
  const ds = st.ds; if (!st.live) return;
  if (++pollN > 30) { stopLive(); showBanner('Live updates paused after 30 minutes to protect your free request limit.', false); return; }
  try {
    const f = await fetchTD(st.market, ds.symbol, ds.tf, 3);
    if (!st.live || st.ds !== ds) return;
    f.bars.t.forEach((t, j) => putBar(ds.bars, t, f.bars.o[j], f.bars.h[j], f.bars.l[j], f.bars.c[j], f.bars.v[j]));
    liveRefresh();
  } catch (e) { stopLive(); showBanner('Live update failed: ' + explain(e), false); }
}
$('#liveBtn').addEventListener('click', () => {
  if (st.live) { stopLive(); return; }
  if (st.custom || !st.ds) return;
  hideNotice(); st.live = true; $('#liveBtn').setAttribute('aria-pressed', 'true');
  if (st.ds.demo) liveTimer = setInterval(tick, 600);
  else if (st.market === 'crypto') openWS();
  else { pollN = 0; pollTD(); liveTimer = setInterval(pollTD, 60000); }
});

// CSV import
$('#csvBtn').addEventListener('click', () => $('#csvFile').click());
$('#csvFile').addEventListener('change', e => {
  const f = e.target.files[0]; if (!f) return;
  const rd = new FileReader();
  rd.onload = () => {
    try { const d = parseCSV(String(rd.result)); const nm = f.name.replace(/\.[^.]+$/, ''); st.custom = { bars: d.bars, tf: d.tf, dec: d.dec, name: nm, symbol: nm, source: 'Your CSV' }; dataChanged(true); }
    catch (err) { const el = $('#status'); el.className = 'status bad'; el.textContent = 'CSV import failed: ' + err.message; showPanel('ed'); }
  };
  rd.readAsText(f); e.target.value = '';
});
function parseCSV(text) {
  const lines = text.trim().split(/\r?\n/); if (lines.length < 3) throw new Error('File has too few rows.');
  const sep = lines[0].includes('\t') ? '\t' : (lines[0].includes(';') && !lines[0].includes(',') ? ';' : ',');
  const clean = x => x.trim().replace(/^"|"$/g, '');
  const head = lines[0].split(sep).map(x => clean(x).toLowerCase());
  const ix = names => head.findIndex(h => names.includes(h));
  const it = ix(['time', 'date', 'datetime', 'timestamp', 't', 'date/time', 'open time', 'gmt time']), io = ix(['open', 'o']), ih = ix(['high', 'h']), il = ix(['low', 'l']), ic = ix(['close', 'c', 'adj close', 'price']), iv = ix(['volume', 'vol', 'v', 'tick volume']);
  if ([it, io, ih, il, ic].some(q => q < 0)) throw new Error('Need columns named time, open, high, low, close (volume is optional).');
  const rows = [];
  for (let k = 1; k < lines.length; k++) {
    const p = lines[k].split(sep).map(clean); if (p.length < 5) continue;
    let t = Number(p[it]);
    if (isFinite(t)) { if (t > 1e11) t /= 1000; }
    else { let s = p[it]; if (/^\d{4}-\d{2}-\d{2}[ T]\d{2}:\d{2}(:\d{2})?$/.test(s)) s = s.replace(' ', 'T') + 'Z'; t = Date.parse(s) / 1000; }
    const o = +p[io], h = +p[ih], l = +p[il], c = +p[ic], v = iv >= 0 ? +p[iv] : 0;
    if ([t, o, h, l, c].every(isFinite)) rows.push([t, o, h, l, c, isFinite(v) ? v : 0]);
  }
  if (rows.length < 5) throw new Error('Could not read enough valid rows.');
  rows.sort((a, b) => a[0] - b[0]);
  const bars = { t: [], o: [], h: [], l: [], c: [], v: [] };
  rows.slice(-20000).forEach((r, k, arr) => { if (k && r[0] === arr[k - 1][0]) return; bars.t.push(r[0]); bars.o.push(r[1]); bars.h.push(r[2]); bars.l.push(r[3]); bars.c.push(r[4]); bars.v.push(r[5]); });
  const d = bars.t.slice(1).map((x, k) => x - bars.t[k]).sort((a, b) => a - b), tf = d[Math.floor(d.length / 2)] || 86400, p0 = bars.c[bars.c.length - 1];
  return { bars, tf, dec: p0 >= 100 ? 2 : p0 >= 1 ? 4 : 6 };
}

// ---------- tabs ----------
function showPanel(p) {
  st.panel = p;
  document.querySelectorAll('.tabs button').forEach(b => b.setAttribute('aria-selected', String(b.dataset.p === p)));
  document.querySelectorAll('.pane').forEach(el => el.classList.toggle('on', el.id === 'p-' + p));
  if (p === 'ed') renderEditor();
}
document.querySelector('.tabs').addEventListener('click', e => { const b = e.target.closest('button'); if (b) showPanel(b.dataset.p); });

// ---------- persistence ----------
function save() {
  clearTimeout(saveT);
  saveT = setTimeout(() => {
    try {
      localStorage.setItem('pinedesk.v2', JSON.stringify({
        scripts: st.scripts.map(s => ({ name: s.name, code: s.code, visible: s.visible, inputs: s.inputs, sampleId: s.sampleId })),
        active: st.scripts.findIndex(s => s.id === st.active), market: st.market, symbols: st.symbols, tf: st.tf, type: st.type, volume: st.volume, theme: st.theme
      }));
    } catch (e) { /* storage unavailable */ }
  }, 400);
}
function restore() {
  let d = null;
  try { d = JSON.parse(localStorage.getItem('pinedesk.v2') || 'null'); st.key = localStorage.getItem('pinedesk.tdkey') || ''; } catch (e) { d = null; }
  if (d && Array.isArray(d.scripts)) {
    d.scripts.forEach(x => { const s = newSlot(String(x.code || ''), x.name, x.sampleId); s.visible = x.visible !== false; s.inputs = x.inputs || {}; });
    st.active = d.active >= 0 && st.scripts[d.active] ? st.scripts[d.active].id : (st.scripts[0] ? st.scripts[0].id : null);
    if (['crypto', 'stocks', 'forex', 'demo'].includes(d.market)) st.market = d.market;
    if (d.symbols) for (const k of Object.keys(st.symbols)) if (typeof d.symbols[k] === 'string' && d.symbols[k]) st.symbols[k] = d.symbols[k];
    if (TFS.some(t => t[1] === d.tf)) st.tf = d.tf;
    if (d.type) st.type = d.type; if (typeof d.volume === 'boolean') st.volume = d.volume;
    if (['auto', 'light', 'dark'].includes(d.theme)) st.theme = d.theme;
  }
  if (!st.scripts.length && !(d && Array.isArray(d.scripts))) {
    const a = SAMPLES[0], b = SAMPLES[1];
    newSlot(a.code, a.name, a.id); newSlot(b.code, b.name, b.id); st.active = st.scripts[0].id;
  }
}

// ---------- boot ----------
restore();
applyTheme(); readTheme();
chart.setType(st.type); chart.setVolume(st.volume);
$('#types').querySelectorAll('button').forEach(x => x.setAttribute('aria-pressed', String(x.dataset.t === st.type)));
$('#volBtn').setAttribute('aria-pressed', String(st.volume));
st.ds = demoDS(st.symbols[st.market] || 'BTCUSDT');
buildTfs(); buildHeader();
chart.setBars(st.ds.bars, st.ds.tf, true);
runAll(); loadActiveIntoEditor(); refresh(); renderWatchlist();
if (st.market !== 'demo') dataChanged(true);
startWlTimer();
if (document.fonts && document.fonts.ready) document.fonts.ready.then(() => chart.draw());
window.__pd = { st, chart, runAll };
})();
</script>