/* /lead-attribution/wordpress-forms/ only (prefix wpf-): the plug strip, the field finder,
   the hidden field view, the filter playground and the secret stack. Each mirrors
   kit/leads/wordpress/skald-leads/skald-leads.php. */

.wpf-k{margin:0 0 .7rem;font:500 .68rem var(--sk-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--sk-text-3)}
.fold-paper .wpf-k{color:#4a5866}
.wpf-small{margin:.9rem 0 0;font-size:.85rem}
.wpf-gap{margin-top:1.4rem}
.wpf-find{align-items:start}
.wpf-json{margin:0;padding:.9rem 1rem;border-radius:6px;background:#0b1117;border:1px solid var(--sk-line);font:400 .8rem/1.55 var(--sk-mono);color:var(--sk-text-2);white-space:pre-wrap;overflow-wrap:anywhere}
.wpf-json b{font-weight:600;color:var(--sk-people-t)}
.wpf-json.flash{animation:wpfFlash .6s ease-out}
.wpf-kept{margin:.8rem 0 0;font:600 .88rem var(--sk-sans);color:var(--sk-text)}
.wpf-kept.no .tag{background:rgba(237,161,0,.14);color:var(--sk-bots);border-color:rgba(237,161,0,.4)}

/* ---------- hero: the plug strip ---------- */
.wpf-plug{border:1px solid var(--sk-line-2);border-radius:10px;background:var(--sk-deep);overflow:hidden}
.wpf-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.6rem .9rem;border-bottom:1px solid var(--sk-line);font:400 .7rem var(--sk-mono);letter-spacing:.04em;color:var(--sk-text-3)}
.wpf-btn{flex:none;padding:.25rem .55rem;border:1px solid var(--sk-line-2);border-radius:3px;background:none;color:var(--sk-text-2);font:500 .68rem var(--sk-mono);cursor:pointer}
.wpf-board{display:grid;grid-template-columns:minmax(0,1fr) 2.2rem minmax(0,10.5rem);align-items:center;padding:1.1rem 1rem;background:linear-gradient(160deg,#1c2a36,#121b24)}
.wpf-plugs{margin:0;padding:0;list-style:none;display:grid;gap:.45rem}
.wpf-plugs li{position:relative;display:grid;gap:.1rem;padding:.5rem .7rem;border:1px solid var(--sk-line-2);border-radius:5px;background:#16212b;transition:border-color .3s,background .3s}
.wpf-plugs li::after{content:"";position:absolute;left:100%;top:50%;width:1.1rem;height:2px;background:var(--sk-line-2);transition:background .3s}
.wpf-plugs b{font:600 .86rem var(--sk-sans);color:var(--sk-text)}
.wpf-plugs code{font:400 .68rem var(--sk-mono);color:var(--sk-text-3);overflow-wrap:anywhere}
.wpf-plugs li.on{border-color:var(--sk-ai);background:#2a1c15}
.wpf-plugs li.on::after{background:var(--sk-ai)}
.wpf-plugs li.on code{color:#f3a37f}
.wpf-bus{position:relative;align-self:stretch}
.wpf-bus i{position:absolute;left:1.1rem;top:9%;bottom:9%;width:2px;background:var(--sk-line-2)}
.wpf-bus::after{content:"";position:absolute;left:1.1rem;right:0;top:50%;height:2px;background:var(--sk-line-2)}
.wpf-socket{display:grid;gap:.3rem;padding:.9rem .8rem;border:2px solid var(--sk-text-3);border-radius:8px;background:#0b1117;text-align:center}
.wpf-socket code{font:600 .74rem var(--sk-mono);color:var(--sk-text);white-space:nowrap}
.wpf-socket .wpf-k{margin:0;font-size:.6rem}
.wpf-socket.hit{animation:wpfHit .6s ease-out}
.wpf-lead{padding:.9rem 1rem 1rem;border-top:1px dashed var(--sk-line-2)}
.wpf-lead pre{margin:0;font:400 .76rem/1.5 var(--sk-mono);color:var(--sk-text-2);white-space:pre-wrap;overflow-wrap:anywhere}
.wpf-lead pre b{font-weight:600;color:var(--sk-ai)}
.wpf-lead .wpf-kept{margin-top:.6rem}
.wpf-plug.js .wpf-lead{transition:opacity .35s}
.wpf-plug.js.wait .wpf-lead{opacity:.25}
.wpf-plug .pulse{position:absolute;top:50%;left:100%;width:8px;height:8px;margin:-4px 0 0;border-radius:50%;background:var(--sk-ai);box-shadow:0 0 0 4px rgba(235,104,52,.25);animation:wpfRun .55s ease-in forwards}

/* ---------- 01: the field finder ---------- */
.wpf-find{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.25rem;margin-top:1.5rem}
.wpf-form,.wpf-seen{padding:1.3rem;border:1px solid var(--sk-line-2);border-radius:8px;background:var(--sk-deep);min-width:0}
.wpf-rows{display:grid;gap:.75rem}
.wpf-row{display:grid;grid-template-columns:5.6rem minmax(0,1fr) minmax(0,1.2fr);gap:.5rem;align-items:center}
.wpf-type{font:500 .66rem var(--sk-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--sk-text-4)}
.wpf-row label{display:block;min-width:0}
.wpf-row input{width:100%;box-sizing:border-box;padding:.5rem .6rem;border:1px solid #33475a;border-radius:4px;background:#0b1117;color:var(--sk-text);font:400 .9rem var(--sk-sans)}
.wpf-row input[data-l]{font-weight:600}
.wpf-row input:focus{outline:2px solid var(--sk-ai);outline-offset:1px;border-color:transparent}
.wpf-row.pick input{border-color:var(--sk-search)}
.wpf-hint{margin:1rem 0 0;font-size:.86rem;line-height:1.55;color:var(--sk-text-3)}
.wpf-hint b{color:var(--sk-text-2)}
.wpf-reset{margin-left:.3rem;padding:.15rem .5rem;border:1px solid var(--sk-line-2);border-radius:3px;background:none;color:var(--sk-text-2);font:500 .72rem var(--sk-mono);cursor:pointer}
.wpf-keys{margin:0 0 1rem;padding:0;list-style:none;display:grid;gap:.4rem}
.wpf-keys li{display:grid;gap:.15rem;padding:.5rem .7rem;border:1px solid var(--sk-line);border-left:3px solid var(--sk-line-2);border-radius:4px}
.wpf-keys code{font:500 .78rem var(--sk-mono);color:var(--sk-text);overflow-wrap:anywhere}
.wpf-keys span{font-size:.82rem;color:var(--sk-text-3)}
.wpf-keys li.pick{border-left-color:var(--sk-search);background:rgba(27,175,122,.07)}
.wpf-keys li.pick span{color:#7fd8b5}
.wpf-keys li.skip{border-left-color:var(--sk-bots)}
.wpf-keys li.skip span{color:#f0c35c}
.wpf-keys li.ring{animation:wpfRing .7s ease-out}

/* ---------- 02: the hidden field ---------- */
.wpf-dom{border:1px solid var(--sk-line-2);border-radius:8px;background:var(--sk-deep);overflow:hidden;min-width:0}
.wpf-dom-bar{display:flex;justify-content:space-between;align-items:center;gap:.8rem;flex-wrap:wrap;padding:.6rem .9rem;border-bottom:1px solid var(--sk-line);font:400 .7rem var(--sk-mono);color:var(--sk-text-3)}
.wpf-tree{margin:0;padding:1rem;font:400 .76rem/1.6 var(--sk-mono);color:var(--sk-text-2);white-space:pre-wrap;overflow-wrap:anywhere;background:#0b1117}
.wpf-new{display:block;max-height:0;overflow:hidden;opacity:0;color:var(--sk-search);background:rgba(27,175,122,.1);transition:max-height .5s,opacity .5s}
.wpf-dom.sent.has .wpf-new{max-height:4em;opacity:1}
.wpf-reads{margin:0;padding:.8rem 1rem;list-style:none;display:grid;gap:.35rem;border-top:1px solid var(--sk-line)}
.wpf-reads li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.8rem;font-size:.86rem}
.wpf-reads span{font:400 .76rem var(--sk-mono);color:var(--sk-text-3);overflow-wrap:anywhere}
.wpf-reads b{font-weight:600;color:var(--sk-text)}
.wpf-reads b.no{font-weight:400;color:var(--sk-text-4)}
.wpf-reads b.flash{animation:wpfFlash .6s ease-out}
.wpf-say{margin:0;padding:.8rem 1rem 1rem;font-size:.9rem;line-height:1.5;color:var(--sk-text-2);border-top:1px dashed var(--sk-line-2)}

/* ---------- 03: the filter playground ---------- */
.wpf-filt{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:1.25rem;margin-top:1.5rem;align-items:start}
.wpf-code{margin:0;min-width:0}
.wpf-code pre{white-space:pre-wrap;overflow-wrap:anywhere}
.wpf-code pre span{display:inline-block;width:100%;transition:color .3s,background .3s,opacity .3s}
.wpf-filt.off .wpf-code pre span{opacity:.35}
.wpf-filt:not(.off)[data-state="call"] [data-c="call"],
.wpf-filt:not(.off)[data-state="news"] [data-c="news"],
.wpf-filt:not(.off)[data-state="contact"] [data-c="contact"]{background:rgba(235,104,52,.16);color:#ffd2bf}
.wpf-body{padding:1.3rem;border:1px solid var(--sk-line-2);border-radius:8px;background:var(--sk-deep);min-width:0}

/* ---------- 04: the secret stack (on paper) ---------- */
.wpf-steps{margin:1.2rem 0 1.4rem;padding-left:1.2rem;display:grid;gap:.6rem;line-height:1.55;color:var(--sk-paper-ink-2)}
.wpf-steps b{color:var(--sk-paper-ink)}
.wpf-stack{padding:1.4rem;border:1px solid var(--sk-paper-line);border-radius:8px;background:#fbf8f2}
.wpf-cards{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.55rem}
.wpf-cards li{transition:transform .35s}
.wpf-sw{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.15rem .8rem;width:100%;padding:.75rem .9rem;text-align:left;border:1px solid var(--sk-paper-line);border-radius:6px;background:#fff;cursor:pointer;font:inherit;color:var(--sk-paper-ink)}
.wpf-sw b{font:600 .95rem var(--sk-sans)}
.wpf-sw code{grid-column:1;font:400 .74rem var(--sk-mono);color:#4a5866;overflow-wrap:anywhere}
.wpf-on{grid-column:2;grid-row:1 / span 2;align-self:center;padding:.2rem .5rem;border-radius:3px;font:600 .68rem var(--sk-mono);text-transform:uppercase;letter-spacing:.06em;background:#e7e1d6;color:#6b7580}
.wpf-sw[aria-checked="false"] .wpf-on::before{content:"not "}
.wpf-sw[aria-checked="false"]{border-style:dashed;background:transparent;color:#6b7580}
.wpf-sw[aria-checked="false"] b{font-weight:500}
.wpf-sw:focus-visible{outline:2px solid var(--sk-ai);outline-offset:2px}
.wpf-cards li.used .wpf-sw{border:2px solid var(--sk-search);box-shadow:0 6px 18px -10px rgba(15,22,29,.35)}
.wpf-cards li.used .wpf-on{background:var(--sk-search);color:#fff}
.wpf-cards li.used .wpf-on::after{content:" · used"}
.wpf-cards li.under .wpf-sw{opacity:.65}
.wpf-used{margin:1rem 0 0;font:600 .92rem var(--sk-sans);color:var(--sk-paper-ink)}
.wpf-used.no .tag{background:rgba(237,161,0,.18);color:#8a5d00}
.fold-paper .wpf-small{color:#4a5866}

@keyframes wpfRun{to{left:calc(100% + 1.1rem);opacity:0}}
@keyframes wpfHit{0%{border-color:var(--sk-ai);box-shadow:0 0 0 0 rgba(235,104,52,.5)}100%{border-color:var(--sk-text-3);box-shadow:0 0 0 12px rgba(235,104,52,0)}}
@keyframes wpfFlash{0%{background:rgba(235,104,52,.25)}100%{background:transparent}}
@keyframes wpfRing{0%{box-shadow:0 0 0 0 rgba(27,175,122,.55)}100%{box-shadow:0 0 0 8px rgba(27,175,122,0)}}

@media (max-width:980px){
  .wpf-find,.wpf-filt{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .wpf-board{grid-template-columns:minmax(0,1fr);gap:.8rem}
  .wpf-bus,.wpf-plugs li::after{display:none}
  .wpf-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .wpf-type{grid-column:1 / -1}
  .wpf-reads li{grid-template-columns:minmax(0,1fr);gap:.1rem}
}
@media (prefers-reduced-motion:reduce){
  .wpf-new,.wpf-cards li,.wpf-plug.js .wpf-lead{transition:none}
}