/* JugnuCRM Custom Config Builder — self-contained, no external fonts/CDN */
:root{
  --bg:#0f1720; --panel:#ffffff; --ink:#1c2430; --muted:#6b7785;
  --line:#e3e8ef; --line2:#eef2f7; --brand:#2563eb; --brand-d:#1d4ed8;
  --ok:#16a34a; --warn:#d97706; --err:#dc2626; --chip:#eef4ff; --chip-b:#c9dbff;
  --code-bg:#0d1b2a; --code-ink:#d6e2f0; --radius:10px;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:#f3f5f8;font-size:14px;line-height:1.45}
code{font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  background:#eef2f7;padding:1px 5px;border-radius:4px;font-size:.86em}
.muted{color:var(--muted)} .tiny{font-size:12px} h1,h2,h3{margin:.2em 0 .5em}
a{color:var(--brand);text-decoration:none} a:hover{text-decoration:underline}

/* Buttons */
.btn{border:1px solid var(--line);background:#fff;color:var(--ink);padding:8px 14px;
  border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;transition:.12s}
.btn:hover{background:#f7f9fc}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-d)}
.btn.danger{color:var(--err);border-color:#f3c6c6}
.btn.danger:hover{background:#fdeaea}
.btn.ghost{background:transparent}
.btn.sm{padding:5px 10px;font-size:12.5px;border-radius:7px}
.btn.dashed{border-style:dashed;color:var(--brand);background:transparent}

/* Brand / topbar */
.brand{font-weight:800;font-size:18px;letter-spacing:-.3px}
.brand span{color:var(--brand)}
.brand em{font-style:normal;font-weight:600;color:var(--muted);font-size:14px;margin-left:6px}
.brand .back{margin-right:10px;font-size:20px;font-weight:800}
.topbar{display:flex;justify-content:space-between;align-items:center;
  padding:12px 22px;background:#fff;border-bottom:1px solid var(--line)}
.top-right{display:flex;align-items:center;gap:10px}
.pill{background:#f1f5fb;border:1px solid var(--line);border-radius:999px;
  padding:4px 12px;font-size:12.5px;color:var(--muted)}
.pill b{color:var(--ink)}

/* Login */
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(1200px 600px at 50% -10%,#1e293b,#0f1720)}
.login-card{background:#fff;padding:34px 32px;border-radius:16px;width:360px;
  box-shadow:0 24px 60px rgba(0,0,0,.35)}
.login-card h1{font-size:20px;margin-top:6px}
.login-card label{display:block;font-weight:600;margin:16px 0 6px}
.login-card input{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:9px;font-size:15px}
.login-card .btn{width:100%;margin-top:16px}
.alert{padding:9px 12px;border-radius:8px;margin:10px 0;font-size:13px}
.alert.err{background:#fdeaea;color:var(--err);border:1px solid #f3c6c6}

/* Dashboard */
.wrap{max-width:1080px;margin:22px auto;padding:0 22px}
.source-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.source-bar label{font-weight:700}
.source-bar select{padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:14px;min-width:260px}
.summary{display:flex;gap:14px;margin:18px 0 6px}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px 20px;text-align:center}
.stat b{display:block;font-size:24px} .stat span{color:var(--muted);font-size:12.5px}
.filter{width:100%;padding:11px 14px;border:1px solid var(--line);border-radius:10px;margin:14px 0;font-size:14px}
.module-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.mod-card{display:flex;justify-content:space-between;align-items:center;gap:8px;
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 16px;
  color:var(--ink);font-weight:600;transition:.12s}
.mod-card:hover{border-color:var(--brand);box-shadow:0 4px 14px rgba(37,99,235,.12);text-decoration:none;transform:translateY(-1px)}
.mod-card.has{border-left:4px solid var(--ok)}
.badge{background:#e7f7ee;color:var(--ok);font-size:10.5px;font-weight:700;
  padding:2px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.3px}

/* Builder layout */
.builder{display:grid;grid-template-columns:minmax(300px,1fr) minmax(420px,1.35fr);
  gap:16px;max-width:1320px;margin:18px auto;padding:0 18px;align-items:start}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.base-panel h3{margin-top:18px;font-size:13px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.base-tbl{display:flex;flex-direction:column;gap:6px}
.base-tbl .bt{display:flex;justify-content:space-between;gap:10px;border:1px solid var(--line2);
  border-radius:8px;padding:7px 10px}
.base-tbl .bt small{color:var(--muted)}
.base-tbl .st{font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:999px}
.base-tbl .st.A{background:#e7f7ee;color:var(--ok)} .base-tbl .st.D{background:#fdeaea;color:var(--err)}
.base-tbl .addq{cursor:pointer;color:var(--brand);font-size:12px;font-weight:700}

.chips{display:flex;flex-wrap:wrap;gap:7px;margin:6px 0 4px;min-height:8px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--chip);border:1px solid var(--chip-b);
  color:var(--brand-d);border-radius:999px;padding:4px 10px;font-size:12.5px;font-weight:600}
.chip b{cursor:pointer;font-weight:800;opacity:.7} .chip b:hover{opacity:1}
.chips.readonly .chip{background:#f1f4f8;border-color:var(--line);color:var(--muted)}

/* Tabs */
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:16px}
.tab{border:none;background:none;padding:9px 14px;cursor:pointer;font-weight:700;
  color:var(--muted);border-bottom:2px solid transparent;font-size:13.5px}
.tab.active{color:var(--brand);border-bottom-color:var(--brand)}
.tab-body.hidden{display:none}
.build-panel h3{font-size:13px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-top:20px}

.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}
.grow{flex:1;min-width:180px}
input[type=text],select,textarea{padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit}
input[type=text]:focus,select:focus,textarea:focus{outline:2px solid #c9dbff;border-color:var(--brand)}

/* tbl_col rows */
.tbl-row{border:1px solid var(--line);border-radius:10px;padding:12px;margin:10px 0;background:#fbfcfe}
.tbl-row-grid{display:grid;grid-template-columns:1fr 1fr 1fr .9fr;gap:10px}
.tbl-row-grid label{display:flex;flex-direction:column;font-size:11.5px;font-weight:700;color:var(--muted);gap:4px}
.tbl-row-grid input,.tbl-row-grid select{font-weight:500;color:var(--ink)}
.mods{margin-top:10px;border-top:1px dashed var(--line);padding-top:8px}
.mod-list{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}

/* Code blocks */
.code,.code-edit{background:var(--code-bg);color:var(--code-ink);border-radius:9px;
  padding:14px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;
  line-height:1.5;white-space:pre;overflow:auto;max-height:340px}
.code.out{max-height:300px}
.code-edit{width:100%;min-height:300px;white-space:pre;border:none}
.raw-details{margin-top:16px} .raw-details summary{cursor:pointer;font-weight:600;color:var(--brand)}

/* Output block */
.output{margin-top:20px;border-top:1px solid var(--line);padding-top:14px}
.output-head{display:flex;justify-content:space-between;align-items:center}
.valid-tag{font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px}
.valid-tag.ok{background:#e7f7ee;color:var(--ok)} .valid-tag.bad{background:#fdeaea;color:var(--err)}
.actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}

/* History */
#historyList .hrow{border:1px solid var(--line);border-radius:8px;padding:10px;margin:8px 0}
#historyList .hmeta{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:6px}
#historyList pre{max-height:160px;margin:0}

/* Toast */
.toast{position:fixed;top:18px;left:50%;transform:translateX(-50%) translateY(-80px);
  background:#111827;color:#fff;padding:11px 20px;border-radius:10px;font-weight:600;
  box-shadow:0 12px 30px rgba(0,0,0,.3);transition:.28s;z-index:50;opacity:0;pointer-events:none}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
.toast.ok{background:#15803d} .toast.err{background:#b91c1c}

@media(max-width:900px){.builder{grid-template-columns:1fr}}

/* Mode selector + partial include picks */
.tbl-row-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  margin-bottom:10px;padding-bottom:8px;border-bottom:1px dashed var(--line)}
.mode-label{display:flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;color:var(--muted)}
.mode-label select{font-weight:600;color:var(--ink)}
.partial-picks{display:flex;gap:12px;align-items:center;background:#fff7ed;
  border:1px dashed #f0c184;border-radius:8px;padding:5px 12px}
.partial-picks.hidden{display:none}
.ck{display:flex;gap:5px;align-items:center;font-size:12px;font-weight:600;cursor:pointer;color:#92400e}
.ck input{cursor:pointer}
.base-tbl .addq{white-space:nowrap}

/* Clickable base column cards + focus flash on existing overlay rows */
.base-tbl .bt{cursor:pointer;transition:.12s}
.base-tbl .bt:hover{border-color:var(--brand);background:#f7faff}
.tbl-row.flash{border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.18)}

/* Extra-props editor inside a tbl row */
.extra-box{margin-top:10px;border-top:1px dashed var(--line);padding-top:8px}
.extra-box summary{cursor:pointer;font-weight:700;font-size:12px;color:var(--brand)}
.extra-box .code-edit.sm{min-height:140px;font-size:12px;margin-top:8px}
#baseRefs h3{margin-top:18px;font-size:13px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}

/* Visual Buttons editor */
.btn-editor{margin:10px 0 4px;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.be-head{background:#f1f5fb;padding:7px 12px;font-size:11.5px;font-weight:700;color:var(--muted);
  text-transform:uppercase;letter-spacing:.3px;border-bottom:1px solid var(--line)}
.be-row{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:7px 12px;border-bottom:1px solid var(--line2)}
.be-row:last-child{border-bottom:none}
.be-left b{font-size:13px}
.be-tag{font-size:10px;font-weight:700;background:#eef2f7;color:var(--muted);
  border-radius:999px;padding:1px 7px;margin-left:4px;text-transform:uppercase;letter-spacing:.3px}
.be-tag.be-custom{background:#eef4ff;color:var(--brand-d)}
.be-tag.be-chg{background:#fff3d6;color:#92400e}
.be-right{display:flex;align-items:center;gap:8px}
.be-right .st{font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:999px}
.be-right .st.A{background:#e7f7ee;color:var(--ok)} .be-right .st.D{background:#fdeaea;color:var(--err)}
.be-right select{padding:4px 8px;font-size:12px}

/* Per-button expanded editor */
.be-panel{padding:12px;background:#fbfcfe;border-bottom:1px solid var(--line2)}
.be-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:10px}
.be-field{display:flex;flex-direction:column;gap:4px;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
.be-field input{font-weight:500;color:var(--ink);text-transform:none;letter-spacing:0}
.be-field.dirty input{border-color:#f0b429;background:#fffbeb}
.be-json{width:100%;min-height:110px;margin-top:4px}
.be-json-label{margin:4px 0 0}
.be-edit{white-space:nowrap}

/* Popup builder + dashboard section */
.section-head{margin:26px 0 12px;font-size:16px}
.be-tag.be-pop{background:#e7f7ee;color:var(--ok);text-transform:none;letter-spacing:0;text-decoration:none}
.be-tag.be-pop:hover{text-decoration:underline}
.pp-scalars{margin-bottom:14px}
.pp-json-block{margin:16px 0;padding-top:8px;border-top:1px dashed var(--line)}
.pp-json-block.dirty textarea{border:2px solid #f0b429}
.pp-json-block .code-edit{width:100%;min-height:260px}
.pp-json-block .code-edit.sm{min-height:140px}

/* Popup editor modal (in-flow editing from the buttons editor) */
.jcb-modal{position:fixed;inset:0;background:rgba(10,16,26,.55);z-index:100;
  display:flex;align-items:center;justify-content:center;padding:2vh 2vw}
.jcb-modal-box{background:#f3f5f8;border-radius:14px;width:94vw;height:92vh;max-width:1400px;
  display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.jcb-modal-head{display:flex;align-items:center;gap:12px;padding:12px 18px;
  background:#fff;border-bottom:1px solid var(--line);font-size:15px}
.jcb-modal-head .muted{flex:1}
.jcb-modal-close{cursor:pointer;font-size:26px;font-weight:800;color:var(--muted);line-height:1}
.jcb-modal-close:hover{color:var(--err)}
.jcb-modal-frame{flex:1 1 auto;border:none;width:100%;height:100%;min-height:0;display:block}
.be-tag.be-pop{cursor:pointer}
.be-popline{display:flex;justify-content:space-between;align-items:center;gap:10px;
  background:#e9f7ef;border:1px solid #bfe6cd;border-radius:9px;padding:9px 12px;margin-bottom:12px}
.be-popline b{color:var(--ok)}

/* Embedded (modal) popup page: hide chrome */
body.embed .topbar{display:none}
body.embed .builder{margin:12px auto;padding:0 14px}

/* Visual popup form editor */
.pp-visual{margin:8px 0}
.pv-row{border:1px solid var(--line);border-radius:10px;padding:12px;margin:10px 0;background:#fff}
.pv-row-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px;
  padding-bottom:8px;border-bottom:1px dashed var(--line)}
.pv-row-head b{font-size:13.5px}
.pv-row-head select{padding:5px 8px;font-size:12.5px}
.pv-style{flex:1;min-width:160px;padding:6px 9px;font-size:12.5px}
.pv-field{border:1px solid var(--line2);border-radius:9px;padding:10px;margin:8px 0;background:#fbfcfe}
.pv-field-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.pv-field-head b{font-size:12.5px}
.pv-field-head select{padding:4px 8px;font-size:12px}
.pv-field-head .btn{margin-left:auto}
.pv-btnkey{font-weight:700;padding:6px 9px;font-size:13px;min-width:140px}
.pv-opts{min-height:90px}
.pv-json{margin-top:8px}
.pv-json .code-edit.sm{min-height:100px;font-size:11.5px}
.pv-check{flex-direction:row;align-items:center;gap:8px}
.pv-check input{width:auto;margin-top:2px}
.pv-warn{background:#fdeaea;color:var(--err);border:1px solid #f3c6c6;border-radius:8px;
  padding:10px 12px;font-size:13px}
.pv-field details summary{cursor:pointer;color:var(--brand);font-weight:600}

/* Hidden/system parameters fold inside a popup row */
.pv-hidden{margin-top:12px;border-top:1px dashed var(--line);padding-top:8px}
.pv-hidden>summary{cursor:pointer;font-weight:700;color:var(--muted)}
.pv-hidden>summary:hover{color:var(--ink)}
.pv-hiddenfield{background:#f4f6f8;border-style:dashed;opacity:.92}
.pv-field-head .muted{margin-right:auto}

/* Small paste-JSON modal */
.jcb-modal-box.jcb-modal-small{width:680px;max-width:94vw;height:auto;max-height:82vh}
.jcb-modal-body{padding:14px 16px;display:flex;flex-direction:column;gap:10px;overflow:auto;flex:1 1 auto;min-height:0}
.jcb-modal-body .code-edit{min-height:280px;width:100%}

/* Force-replace toggles */
.pv-rep{background:#fff3d6;border:1px dashed #e2b14c;border-radius:7px;padding:3px 9px;
  font-size:11px;color:#92400e;white-space:nowrap}
.pv-row.pv-forced,.pv-field.pv-forced{border-color:#e2b14c;box-shadow:0 0 0 2px rgba(226,177,76,.18)}

/* Other-keys override cards + filter helper */
.pv-field.flash{border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.18)}
#otherRows .code-edit.sm{width:100%;min-height:130px;margin-top:6px}
#baseOther .raw-details{margin:6px 0}
#baseOther summary b{font-size:13px}
.fh-box{margin-top:10px;border-top:1px dashed var(--line);padding-top:8px}
.fh-box .pv-opts{width:100%;min-height:120px;margin-top:6px}

/* ---------- Tree editor (beta) ---------- */
.beta-tag{font-size:9.5px;font-weight:800;background:#eef4ff;color:var(--brand-d);border:1px solid var(--chip-b);
  border-radius:999px;padding:1px 6px;vertical-align:middle;letter-spacing:.4px;text-transform:uppercase}
.jt-app{max-width:1280px;margin:16px auto;padding:0 18px}
.jt-hint{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 14px;
  font-size:12.5px;color:var(--muted);margin-bottom:12px}
.jt-main{display:flex;background:#fff;border:1px solid var(--line);border-radius:12px 12px 0 0;
  overflow:hidden;min-height:420px}
.jt-tree{width:280px;border-right:1px solid var(--line);overflow:auto;max-height:560px;padding:6px 0;background:#fbfcfe}
.jt-detail{flex:1;min-width:0;padding:14px 18px;background:#fff}
.jtr{display:flex;align-items:center;gap:6px;padding:3px 10px 3px 4px;font-size:13px;cursor:pointer;white-space:nowrap}
.jtr:hover{background:#f1f5fb}
.jtr.sel{background:var(--chip);color:var(--brand-d);font-weight:600}
.jtr-ch{width:16px;text-align:center;color:var(--muted);font-size:11px;flex:none}
.jtr-hint{font-size:11px;color:var(--muted);margin-left:auto;padding-left:8px;font-weight:400}
.jtr-dot{width:8px;height:8px;border-radius:50%;background:#ef9f27;flex:none;margin-left:4px}
.jtr-pin{color:#b45309;font-size:11px}
.jt-crumb{font-size:12.5px;color:var(--muted);margin-bottom:12px}
.jt-crumb a{color:var(--brand);cursor:pointer}
.jt-dhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.jt-dhead b{font-size:16px}
.jt-seclab{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin:16px 0 6px}
.jt-sum{font-size:11.5px;color:var(--muted)}
.jt-pop{font-size:10.5px;font-weight:700;background:#e7f7ee;color:var(--ok);border-radius:999px;padding:1px 8px;cursor:pointer}
.jt-pop:hover{text-decoration:underline}
.jt-x{cursor:pointer;color:var(--err);opacity:.6}.jt-x:hover{opacity:1}
.jt-opts{width:100%;min-height:180px}
.jt-out{background:#fbfcfe;border:1px solid var(--line);border-top:none;border-radius:0 0 12px 12px;padding:12px 16px}
.jt-outhead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.jt-outlab{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.jt-out .btn.on{background:#eef4ff;border-color:var(--brand)}
.jt-out pre{max-height:240px}
.stA2{background:#e7f7ee;color:var(--ok)}.stD2{background:#fdeaea;color:var(--err)}
@media(max-width:900px){.jt-main{flex-direction:column}.jt-tree{width:100%;max-height:240px;border-right:none;border-bottom:1px solid var(--line)}}

/* Tree editor — right panel (was unstyled: nested cards + status pills) */
.jt-detail .ccard{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  border:1px solid var(--line);border-radius:9px;padding:9px 12px;margin:7px 0;
  background:#fbfcfe;transition:.12s}
.jt-detail .ccard:hover{border-color:var(--brand);box-shadow:0 2px 8px rgba(37,99,235,.08)}
.jt-detail .ccard b{font-size:13px}
.jt-detail .ccard .btn{white-space:nowrap}
.jt-detail .st{font-size:10.5px;font-weight:700;padding:1px 8px;border-radius:999px}
.jt-detail .be-grid{margin:6px 0 4px}
.jt-detail .be-field input,.jt-detail .be-field select{max-width:100%}
.jt-detail .chips{align-items:center}
.jt-detail .row{margin-top:10px}
.jt-detail .btn.dashed{margin-top:8px}

/* Friendly labels (labels.js) in the tree editor */
.jtr-fr{font-size:10.5px;color:var(--muted);font-weight:400;max-width:130px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:italic}
.jtr.sel .jtr-fr{color:var(--brand-d);opacity:.75}
.jt-friendly{font-size:12.5px;color:var(--muted);margin:-2px 0 10px;line-height:1.5}
.jt-friendly b{color:var(--ink);font-weight:600}
.jt-kf{font-weight:400;text-transform:none;letter-spacing:0;color:var(--muted);font-style:italic}
.jt-vhint{font-size:10.5px;font-weight:400;text-transform:none;letter-spacing:0;
  color:var(--brand-d);background:#eef4ff;border-radius:6px;padding:2px 7px;margin-top:3px;align-self:flex-start}

/* where/search condition editor */
.jt-cond{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;margin-top:2px}
.jt-cond .be-field{min-width:110px}
.jt-cond .be-field.grow{flex:1;min-width:170px}
.jt-cond select{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:600}
.jt-condnote{font-size:11px;font-weight:400;text-transform:none;letter-spacing:0;
  color:var(--muted);align-self:center;margin-top:16px}
.jt-condfix{flex-basis:100%;font-size:11px;font-weight:600;text-transform:none;letter-spacing:0;
  background:#fff3d6;color:#92400e;border:1px dashed #e2b14c;border-radius:7px;padding:3px 9px}

/* Guided where editor (Option A) */
.jt-where{display:flex;flex-direction:column;gap:8px;margin:8px 0}
.jt-wrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.jt-wfld{min-width:150px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13px;font-weight:600}
.jt-wop{width:160px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13px}
.jt-wval{width:120px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13px}
.jt-where .en{font-size:12px;color:var(--brand-d);background:#eef4ff;border:1px solid var(--chip-b);border-radius:7px;padding:2px 9px}
.jt-where .jt-x{cursor:pointer;color:var(--err);font-weight:800;opacity:.55}.jt-where .jt-x:hover{opacity:1}

/* Column picker + col list in tree editor */
.jt-colpick{display:inline-flex;align-items:center;gap:6px}
.jt-colsel{padding:6px 9px;border:1px solid var(--line);border-radius:8px;font-size:13px;min-width:150px;background:#fff}
.jt-inlinepick .jt-colsel{min-width:130px}
.jt-colwarn{font-size:11px;color:var(--warn)}
.jt-collist{display:flex;flex-direction:column;gap:7px;margin:6px 0}
.jt-collist .jt-wrow{gap:8px}
.ac-slot{display:block;margin-top:4px}
.ac-colnote{background:#eef4ff;border:1px solid var(--chip-b);border-radius:7px;padding:6px 10px}

/* col list: base tag + cleaner add row */
.jt-basetag{font-size:9.5px;font-weight:700;background:#f1f4f8;color:var(--muted);border-radius:999px;padding:1px 7px}
.jt-collist .jt-colsel{min-width:170px}

/* Framed inline "add" controls in the tree editor (property / item / formatter) */
.jt-addrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;
  background:#f6f8fb;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.jt-addrow-lbl{font-size:11px;font-weight:700;color:var(--brand-d);background:#eef4ff;
  border:1px solid var(--chip-b);border-radius:999px;padding:3px 10px;white-space:nowrap;letter-spacing:.2px}
.jt-addrow-sep{color:var(--muted);font-weight:700}
.jt-in{height:34px;padding:0 11px;border:1px solid var(--line);border-radius:8px;font-size:13px;background:#fff;transition:.12s}
.jt-in:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.jt-in-key{width:150px}
.jt-in-val{flex:1;min-width:120px}
.jt-addrow .grow{flex:1;min-width:140px}
.jt-addrow .btn.sm{height:34px}

/* Tidy the property inputs in the detail grid */
.jt-detail .be-field input[type=text],.jt-detail .be-field select{height:34px;border-radius:8px}
.jt-detail .be-field input[type=text]:focus,.jt-detail .be-field select:focus{
  outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.12)}

/* Value pipeline: friendly formatter chips + add-modifier dropdown */
.jt-modlist{display:flex;flex-direction:column;gap:6px;margin:6px 0}
.jt-modchip{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);
  border-radius:9px;padding:7px 10px}
.jt-modlbl{font-size:13px;font-weight:600;color:var(--ink)}
.jt-modraw{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:var(--muted);
  background:#f1f4f8;border-radius:5px;padding:1px 6px}
.jt-modbtn{margin-left:0;border:1px solid var(--line);background:#fff;border-radius:7px;
  width:26px;height:26px;cursor:pointer;font-size:13px;line-height:1;color:var(--muted)}
.jt-modbtn:last-child{margin-left:auto}
.jt-modbtn:hover{background:#f1f5fb}
.jt-modbtn.danger{color:var(--err)}
.jt-modchip .jt-modbtn:nth-last-child(2){margin-left:auto}

/* Drag-to-reorder tbl_col columns in the tree */
.jtr-drag{position:relative}
.jtr-grip{cursor:grab;color:var(--muted);opacity:.45;font-size:13px;line-height:1;padding:0 2px;user-select:none}
.jtr-grip:hover{opacity:.9}
.jtr-grip:active{cursor:grabbing}
.jtr-dragging{opacity:.5}
.jtr-ord{font-size:10px;color:var(--brand-d);background:#eef4ff;border:1px solid var(--chip-b);
  border-radius:999px;padding:0 6px;margin-left:4px;white-space:nowrap}
.jtr.drop-before{box-shadow:inset 0 2px 0 var(--brand)}
.jtr.drop-after{box-shadow:inset 0 -2px 0 var(--brand)}

/* Resolved load-from-global_config box */
.jt-loadbox{border:1px solid var(--chip-b);background:#f5f9ff;border-radius:10px;padding:10px 12px;margin:4px 0 12px}
.jt-loadhead{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.jt-loadicon{color:var(--brand-d)}
.jt-loadhead b{font-size:13px}
.jt-loadwhere{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:var(--muted);
  background:#fff;border:1px solid var(--line);border-radius:5px;padding:1px 7px;margin-left:auto}
.jt-loadpre{max-height:220px;margin:8px 0 0}
.jt-loadmiss{font-size:12px;color:var(--warn);background:var(--warnbg);border:1px solid var(--warnln);border-radius:7px;padding:7px 10px}

/* Read-only friendly tree for loaded/global definitions */
.jt-ro{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 6px;margin-top:8px;max-height:280px;overflow:auto}
.jt-roline{display:flex;align-items:center;gap:7px;font-size:12.5px;padding:2px 6px;white-space:nowrap}
.jt-rohdr{font-weight:600;color:var(--ink);margin-top:2px}
.jt-rokey{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:var(--brand-d)}
.jt-rofr{font-size:11px;color:var(--muted);font-style:italic}
.jt-rosep{color:var(--muted)}
.jt-roval{color:var(--ink);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;max-width:340px}
.jt-rohint{font-size:11px;color:var(--brand-d);background:#eef4ff;border-radius:5px;padding:0 6px}
.jt-ropop{border:1px solid var(--chip-b);background:#e7f7ee;color:var(--ok);border-radius:999px;
  padding:1px 9px;font-size:11.5px;font-weight:600;cursor:pointer}
.jt-ropop:hover{text-decoration:underline}

/* Editable loaded-definition rows */
.jt-roedit{height:28px;padding:0 8px;border:1px solid var(--line);border-radius:6px;font-size:12.5px;min-width:120px;background:#fff}
.jt-roedit:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 2px rgba(37,99,235,.14)}
.jt-ovr{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;
  background:#fff3d6;color:#92400e;border:1px solid #e2b14c;border-radius:999px;padding:1px 7px}
.jt-rorst{font-size:11px;border:1px solid var(--line);background:#fff;border-radius:6px;padding:1px 8px;cursor:pointer;color:var(--muted)}
.jt-rorst:hover{background:#f1f5fb;color:var(--ink)}

/* ---------- Embedded popup tree (inside the modal iframe) ---------- */
body.embedded{background:#fff;margin:0}
body.embedded .jt-app.popup-tree{
  max-width:none;margin:0;padding:10px 14px;
  height:100vh;display:flex;flex-direction:column;gap:10px;box-sizing:border-box}
body.embedded .jt-app.popup-tree .jt-hint{flex:0 0 auto;margin:0}
body.embedded .jt-app.popup-tree .jt-main{
  flex:1 1 auto;min-height:220px;border-radius:12px}
body.embedded .jt-app.popup-tree .jt-tree{max-height:none;height:100%}
body.embedded .jt-app.popup-tree .jt-detail{overflow:auto}
body.embedded .jt-app.popup-tree .jt-out{flex:0 0 auto;border-radius:12px;border-top:1px solid var(--line)}
body.embedded .jt-app.popup-tree .jt-out pre{max-height:120px}