.kcf{--kcf-line:color-mix(in oklab, var(--color-base-content) 16%, transparent);--kcf-mute:color-mix(in oklab, var(--color-base-content) 58%, transparent);--kcf-ok:#46b450;--kcf-inv:#ffb900;--kcf-spam:#f56e28;--kcf-err:#dc3232;margin:1.75rem 0;container-type:inline-size}.kcf__grid{border:1px solid var(--kcf-line);border-radius:var(--radius-box);background:color-mix(in oklab, var(--color-base-200) 70%, var(--color-base-100));gap:1rem;padding:1rem;display:grid}@container (width>=34rem){.kcf__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}}.kcf__eye{font:600 .6875rem/1rem var(--font-mono);letter-spacing:.04em;color:var(--kcf-mute);margin:0 0 .5rem}.kcf .wpcf7{font-size:.9375rem;line-height:1.4}.kcf form p{margin:0 0 1.35rem;position:relative}.kcf label{display:block}.kcf input:not([type=submit]),.kcf textarea{width:100%;font:inherit;color:inherit;background:var(--color-base-100);border:1px solid color-mix(in oklab, var(--color-base-content) 30%, transparent);border-radius:2px;margin-top:.2rem;padding:.35rem .5rem;display:block}.kcf textarea{resize:none;height:4.2rem}.kcf :is(input,textarea):focus-visible,.kcf .wpcf7-submit:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px}.kcf .wpcf7-not-valid{border-color:var(--kcf-err)}.kcf .wpcf7-not-valid-tip{inset-inline-start:0;color:var(--kcf-err);font-size:.8125rem;position:absolute;top:100%}.kcf p:last-of-type{align-items:center;margin-bottom:0;display:flex}.kcf .wpcf7-submit{font:inherit;color:inherit;cursor:pointer;background:color-mix(in oklab, var(--color-base-content) 9%, var(--color-base-100));border:1px solid color-mix(in oklab, var(--color-base-content) 32%, transparent);border-radius:3px;padding:.35rem 1.1rem}.kcf .wpcf7-submit:active{transform:translateY(1px)}.kcf .wpcf7-spinner{visibility:hidden;background:color-mix(in oklab, var(--color-base-content) 75%, transparent);border-radius:50%;width:24px;height:24px;margin:0 24px;position:relative}.kcf .wpcf7-spinner:before{content:"";background:var(--color-base-100);transform-origin:8px 8px;border-radius:50%;width:6px;height:6px;animation:1s linear infinite kcf-spin;position:absolute;top:4px;left:4px}.kcf .submitting .wpcf7-spinner{visibility:visible}@keyframes kcf-spin{to{transform:rotate(360deg)}}.kcf .wpcf7-response-output{visibility:hidden;border:2px solid #0000;min-height:3.3em;margin:1rem 0 0;padding:.2em 1em;font-size:.875rem}.kcf .invalid .wpcf7-response-output{visibility:visible;border-color:var(--kcf-inv)}.kcf .spam .wpcf7-response-output{visibility:visible;border-color:var(--kcf-spam)}.kcf .sent .wpcf7-response-output{visibility:visible;border-color:var(--kcf-ok)}.kcf__log{font:.75rem/1.35 var(--font-mono);margin:0;padding:0;list-style:none;position:relative}.kcf__log:before{content:"";border-left:1px dashed var(--kcf-line);position:absolute;top:.9rem;bottom:.9rem;left:.6rem}.kcf__log li{--c:var(--kcf-line);border:1px solid var(--kcf-line);border-radius:var(--radius-field);background:var(--color-base-100);color:var(--kcf-mute);margin:0 0 .5rem;padding:.45rem .6rem .45rem 1.6rem;transition:border-color .25s,color .25s,box-shadow .25s;position:relative}.kcf__log li:before{content:"";border:1px solid var(--kcf-mute);background:var(--color-base-100);border-radius:50%;width:.5rem;height:.5rem;position:absolute;top:.75rem;left:.36rem}.kcf__log li[data-state]:not([data-state=""]){color:var(--color-base-content);border-color:var(--c);box-shadow:inset 3px 0 0 var(--c);animation:.45s ease-out kcf-pop}.kcf__log li[data-state]:not([data-state=""]):before{background:var(--c);border-color:var(--c)}.kcf__log [data-state=on]{--c:var(--color-primary)}.kcf__log [data-state=invalid]{--c:var(--kcf-inv)}.kcf__log [data-state=spam]{--c:var(--kcf-spam)}.kcf__log [data-state=sent]{--c:var(--kcf-ok)}.kcf__log [data-ev=sub]{transition-delay:.12s;animation-delay:.12s}@keyframes kcf-pop{30%{transform:translate(4px)}}.kcf__log code{font:600 .8125rem/1.35 var(--font-mono);color:inherit;overflow-wrap:anywhere;background:0 0;padding:0;display:block}.kcf__log span{-webkit-line-clamp:2;overflow-wrap:anywhere;-webkit-box-orient:vertical;min-height:2.7em;display:-webkit-box;overflow:hidden}.kcf__log [data-stage]{margin-inline-end:.6em;display:inline}.kcf__log [data-ok=y]{color:var(--kcf-ok)}.kcf__log [data-ok=y]:before{content:"✓ "}.kcf__log [data-ok=n]{color:var(--kcf-err)}.kcf__log [data-ok=n]:before{content:"✗ "}.kcf figcaption{color:var(--kcf-mute);margin-top:.6rem;font-size:.875rem}@media (prefers-reduced-motion:reduce){.kcf *,.kcf :before{transition:none!important;animation:none!important}}
