/* All selectors are scoped under #lcx-root to avoid conflicts */
#lcx-root { --bg:#f7faff;--card:#ffffff;--text:#0f172a;--muted:#64748b;--accent:#2563eb;--accent-weak:#dbeafe;--border:#e5e7eb;--danger:#dc2626;--ok:#059669;--shadow:0 8px 24px rgba(15,23,42,.08); }
#lcx-root.lcx-wrap{background:linear-gradient(180deg,var(--bg),#fff 60%);color:var(--text);padding:24px;border-radius:16px;border:1px solid var(--border);box-shadow:var(--shadow)}
#lcx-root .lcx-header{display:flex;align-items:center;gap:14px;margin-bottom:18px}
#lcx-root .lcx-logo{width:40px;height:40px;border-radius:12px;background:var(--accent-weak);display:grid;place-items:center;color:var(--accent);font-weight:800}
#lcx-root .lcx-h1{font-size:clamp(20px,3vw,28px);margin:0}
#lcx-root .lcx-lead{color:var(--muted);margin:.25rem 0 0}
#lcx-root .lcx-grid{display:grid;gap:14px}
@media (min-width:720px){ #lcx-root .lcx-grid{grid-template-columns:1.1fr .9fr} }
#lcx-root .lcx-section-title{font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin:14px 0 8px}
#lcx-root .lcx-card{background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:18px}
#lcx-root .lcx-label{font-size:13px;color:var(--muted);display:block;margin-bottom:6px}
#lcx-root .lcx-row{display:flex;gap:10px;align-items:center}
#lcx-root .lcx-flex1{flex:1} #lcx-root .lcx-flex2{flex:2}
#lcx-root .lcx-input, #lcx-root .lcx-range, #lcx-root select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:#fff;font-size:16px;color:var(--text);outline:none;transition:box-shadow .15s,border-color .15s}
#lcx-root .lcx-input:focus, #lcx-root .lcx-range:focus, #lcx-root select:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-weak)}
#lcx-root .lcx-input.lcx-error{border-color:var(--danger);box-shadow:0 0 0 4px rgba(220,38,38,.12)}
#lcx-root .lcx-segmented{display:flex;gap:8px;flex-wrap:wrap}
#lcx-root .lcx-segmented input{display:none}
#lcx-root .lcx-btn{user-select:none;cursor:pointer;padding:10px 12px;border:1px solid var(--border);border-radius:999px;background:#fff;font-weight:600;font-size:14px;color:#0b1a36;transition:all .15s ease}
#lcx-root .lcx-segmented input:checked + label.lcx-btn{background:var(--accent);color:#fff;border-color:var(--accent)}
#lcx-root .lcx-hint{font-size:12px;color:var(--muted)}
#lcx-root .lcx-controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;justify-content:flex-end}
#lcx-root .lcx-button{appearance:none;border:1px solid var(--border);background:#fff;padding:10px 14px;border-radius:12px;font-weight:700;cursor:pointer}
#lcx-root .lcx-button:focus{outline:none;box-shadow:0 0 0 4px var(--accent-weak)}
#lcx-root .lcx-ghost{background:#fff}
#lcx-root .lcx-result{padding:16px;border:1px dashed var(--border);border-radius:14px;background:#fcfdff}
#lcx-root .lcx-h2{margin:.2rem 0 .4rem;font-size:22px}
#lcx-root .lcx-value{font-size:clamp(22px,3.2vw,28px);font-weight:800}
#lcx-root .lcx-steps{margin-top:8px;font-size:14px;line-height:1.6}
#lcx-root .lcx-steps code{background:#f3f4f6;padding:2px 6px;border-radius:6px}
#lcx-root .lcx-examples{display:flex;flex-wrap:wrap;gap:8px}
#lcx-root .lcx-chip{padding:8px 10px;border:1px solid var(--border);background:#fff;border-radius:999px;cursor:pointer;font-size:14px}
#lcx-root .lcx-chip:hover{border-color:var(--accent)}
#lcx-root .lcx-errors{color:var(--danger);font-size:14px}
#lcx-root .lcx-ok{color:var(--ok)}
#lcx-root .lcx-history{display:grid;gap:8px}
#lcx-root .lcx-history-item{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--border);background:#fff;border-radius:12px;padding:10px 12px}
#lcx-root .lcx-history-item button{border:none;background:transparent;cursor:pointer}
#lcx-root .lcx-footer{margin-top:20px;color:var(--muted);font-size:12px;text-align:center}

/* Anti-copy confined to root only */
#lcx-root[data-anticopy="1"] * { user-select: none; -webkit-user-select: none; -ms-user-select:none; }
#lcx-root[data-anticopy="1"] { -webkit-touch-callout: none; }
/* v1.1.3 – Theme override fixes (buttons & code visibility) */
#lcx-root button,
#lcx-root .lcx-button,
#lcx-root .lcx-chip {
  color: var(--text) !important;
  background: #ffffff !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
#lcx-root .lcx-chip:hover { border-color: var(--accent) !important; }
#lcx-root .lcx-button:disabled { opacity: .6 !important; }

/* Ensure code and result text readable */
#lcx-root code { 
  background: #eef2ff !important; 
  color: #0f172a !important; 
  padding: 2px 6px; 
  border-radius: 6px; 
}
#lcx-root .lcx-result { background: #ffffff !important; border-style: solid !important; }
#lcx-root .lcx-value { color: #0f172a !important; }
#lcx-root .lcx-ok { color: #059669 !important; }

/* Inputs text color against theme resets */
#lcx-root input[type="text"], 
#lcx-root input[type="number"], 
#lcx-root input[type="range"], 
#lcx-root select {
  color: var(--text) !important;
  background: #ffffff !important;
  border-color: var(--border) !important;
}

/* Radios/labels inside segmented */
#lcx-root .lcx-segmented label.lcx-btn { color: #0b1a36 !important; background: #fff !important; }
#lcx-root .lcx-segmented input:checked + label.lcx-btn { color: #fff !important; background: var(--accent) !important; border-color: var(--accent) !important; }

/* v1.1.4 – minimal embed: remove outer container visuals */
#lcx-root { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }