/* ============================================================================
   BARBAROS — lp-pixels.css (root #lpxRoot) — « Pixels publicitaires » under the generator in « Pages de vente ».
   --buld-* tokens (light + dark), same pane as #lfRoot. Class names avoid the legacy painters' fragments
   (card, -chip, -tag, -box, block, badge, status); lp-studio.css hides the panel's other children, hence the
   two-ID selector.
   ============================================================================ */
html[data-buld-theme] #panel-landing-pages > #lpxRoot { display: block !important; margin: 0 0 18px; min-width: 0; }
html[data-buld-theme] #panel-landing-pages.lg-studio > #lpxRoot { display: none !important; }
html[data-buld-theme] #lpxRoot {
    --x-card: var(--p-card-bg, var(--buld-elevated)); --x-s2: var(--buld-surface-2, var(--buld-page)); --x-ink: var(--buld-ink-1); --x-ink2: var(--buld-ink-2);
    --x-ink3: var(--buld-ink-3); --x-line: var(--buld-hairline, rgba(127,127,127,.18)); --x-cta: var(--buld-cta); --x-ok: var(--buld-success, #14ae5c);
    --x-warn: var(--buld-warning, #c2660d); --x-bad: var(--buld-danger, #d33a2b);
    color: var(--x-ink); font: 13.5px/1.45 var(--font, "SF Pro Text", Inter, system-ui, sans-serif);
}
html[data-buld-theme] #lpxRoot, html[data-buld-theme] #lpxRoot * { box-sizing: border-box; }
html[data-buld-theme] #lpxRoot svg { flex: none; display: block; }
html[data-buld-theme] #lpxRoot .lpx-card { padding: 18px 20px; border-radius: 22px; background: var(--x-card); border: 1px solid var(--x-line); display: grid; gap: 14px; }
html[data-buld-theme] #lpxRoot .lpx-h { display: flex; align-items: center; gap: 12px; min-width: 0; }
html[data-buld-theme] #lpxRoot .lpx-ic { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; flex: none; color: #fff; background: linear-gradient(135deg, #0866FF, #111 140%); }
html[data-buld-theme] #lpxRoot .lpx-t { display: grid; gap: 2px; min-width: 0; flex: 1; }
html[data-buld-theme] #lpxRoot .lpx-t b { font: 600 16px/1.2 var(--disp, "SF Pro Display", Inter, system-ui, sans-serif); letter-spacing: -.016em; }
html[data-buld-theme] #lpxRoot .lpx-t span { color: var(--x-ink3); font-size: 12.5px; }
html[data-buld-theme] #lpxRoot .lpx-sum { flex: none; padding: 4px 10px; border-radius: 980px; font-size: 12px; font-weight: 600; background: var(--x-s2); color: var(--x-ink2); }
html[data-buld-theme] #lpxRoot .lpx-sum[data-s="ok"] { color: var(--x-ok); background: color-mix(in srgb, var(--x-ok) 12%, transparent); }
html[data-buld-theme] #lpxRoot .lpx-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 12px; align-items: start; }
html[data-buld-theme] #lpxRoot .lpx-fld { display: grid; gap: 5px; min-width: 0; }
html[data-buld-theme] #lpxRoot .lpx-fld > span { font-size: 12px; font-weight: 600; color: var(--x-ink2); }
html[data-buld-theme] #lpxRoot .lpx-fld input { width: 100%; font: 500 14px/1.2 ui-monospace, "SF Mono", Menlo, monospace; letter-spacing: .02em; padding: 11px 12px; border-radius: 12px; border: 1px solid var(--x-line); background: var(--buld-elevated-2, var(--x-s2)); color: var(--x-ink); outline: none; }
html[data-buld-theme] #lpxRoot .lpx-fld input:focus { border-color: var(--x-cta); box-shadow: 0 0 0 3px var(--buld-cta-soft, rgba(0,113,227,.12)); }
html[data-buld-theme] #lpxRoot .lpx-fld small { font-size: 11.5px; color: var(--x-ink3); }
html[data-buld-theme] #lpxRoot .lpx-fld.is-bad input { border-color: var(--x-bad); }
html[data-buld-theme] #lpxRoot .lpx-fld.is-bad small { color: var(--x-bad); }
html[data-buld-theme] #lpxRoot .lpx-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; padding: 0 16px; margin-top: 22px; border: 0; border-radius: 980px; background: var(--x-cta); color: #fff; font-family: inherit; font-size: 13.5px; font-weight: 600; line-height: 1; cursor: pointer; white-space: nowrap; transition: background .15s, opacity .15s; }
html[data-buld-theme] #lpxRoot .lpx-btn:hover { background: var(--buld-cta-hover, var(--x-cta)); }
html[data-buld-theme] #lpxRoot .lpx-btn:disabled { opacity: .55; cursor: default; }
html[data-buld-theme] #lpxRoot .lpx-btn--ghost { margin: 0; height: 32px; padding: 0 12px; background: transparent; color: var(--x-cta); border: 1px solid var(--x-line); font-size: 12.5px; }
html[data-buld-theme] #lpxRoot .lpx-btn--ghost:hover { background: var(--buld-cta-soft, rgba(0,113,227,.1)); }
html[data-buld-theme] #lpxRoot .lpx-msg { margin: 0; display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--x-ok); }
html[data-buld-theme] #lpxRoot .lpx-msg.is-bad { color: var(--x-bad); }
html[data-buld-theme] #lpxRoot .lpx-lh { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 12px; border-top: 1px solid var(--x-line); font-size: 12px; font-weight: 600; color: var(--x-ink3); text-transform: uppercase; letter-spacing: .05em; }
html[data-buld-theme] #lpxRoot .lpx-lh .lpx-btn { text-transform: none; letter-spacing: 0; }
html[data-buld-theme] #lpxRoot .lpx-pgs { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; background: none !important; border: 0 !important; box-shadow: none !important; }
html[data-buld-theme] #lpxRoot .lpx-row { box-shadow: none !important; border: 0 !important; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.6fr) auto; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: var(--x-s2); }
html[data-buld-theme] #lpxRoot .lpx-pg { display: grid; gap: 2px; min-width: 0; }
html[data-buld-theme] #lpxRoot .lpx-pg b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-buld-theme] #lpxRoot .lpx-pg a { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--x-ink3); text-decoration: none; overflow: hidden; white-space: nowrap; }
html[data-buld-theme] #lpxRoot .lpx-pg a:hover { color: var(--x-cta); }
html[data-buld-theme] #lpxRoot .lpx-sts { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
html[data-buld-theme] #lpxRoot .lpx-st { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 980px; font-size: 12px; color: var(--x-ink2); background: var(--x-card); border: 1px solid var(--x-line); }
html[data-buld-theme] #lpxRoot .lpx-st b { font-weight: 600; }
html[data-buld-theme] #lpxRoot .lpx-st i { width: 7px; height: 7px; border-radius: 50%; background: var(--x-ink3); }
html[data-buld-theme] #lpxRoot .lpx-st[data-s="ok"] i { background: var(--x-ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--x-ok) 20%, transparent); }
html[data-buld-theme] #lpxRoot .lpx-st[data-s="ok"] b { color: var(--x-ok); }
html[data-buld-theme] #lpxRoot .lpx-st[data-s="blocked"] i { background: var(--x-warn); }
html[data-buld-theme] #lpxRoot .lpx-st[data-s="blocked"] b { color: var(--x-warn); }
html[data-buld-theme] #lpxRoot .lpx-st[data-s="missing"] i { background: var(--x-bad); }
html[data-buld-theme] #lpxRoot .lpx-st[data-s="missing"] b { color: var(--x-bad); }
html[data-buld-theme] #lpxRoot .lpx-muted { color: var(--x-ink3); font-size: 12.5px; }
html[data-buld-theme] #lpxRoot .lpx-pad { padding: 4px 0; }
html[data-buld-theme] #lpxRoot .lpx-spin { width: 12px; height: 12px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: lpx-spin .8s linear infinite; }
@keyframes lpx-spin { to { transform: rotate(360deg); } }
/* the check frame: a real phone-size page, off screen */
iframe.lpx-probe { position: fixed; left: -10000px; top: 0; width: 390px; height: 800px; border: 0; opacity: 0; pointer-events: none; }
@media (max-width: 760px) {
    html[data-buld-theme] #lpxRoot .lpx-card { padding: 16px; }
    html[data-buld-theme] #lpxRoot .lpx-h { flex-wrap: wrap; }
    html[data-buld-theme] #lpxRoot .lpx-t { flex-basis: calc(100% - 48px); }
    html[data-buld-theme] #lpxRoot .lpx-sum { margin-left: 48px; }
    html[data-buld-theme] #lpxRoot .lpx-form { grid-template-columns: minmax(0, 1fr); }
    html[data-buld-theme] #lpxRoot .lpx-btn { margin-top: 0; width: 100%; height: 44px; }
    html[data-buld-theme] #lpxRoot .lpx-row { grid-template-columns: minmax(0, 1fr) auto; }
    html[data-buld-theme] #lpxRoot .lpx-sts { grid-column: 1 / -1; grid-row: 2; }
    html[data-buld-theme] #lpxRoot .lpx-btn--ghost { width: auto; height: 32px; }
}
@media (prefers-reduced-motion: reduce) { html[data-buld-theme] #lpxRoot .lpx-spin { animation: none; } }