@layer components{.cf,.cf-grid{gap:1.6rem;display:grid}@media (min-width:640px){.cf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.cf-route{--p:0;font:500 var(--text-micro) / 1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--color-fg-dim);grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.85rem;display:grid}.cf-route-line{background:repeating-linear-gradient(90deg, var(--color-line-strong) 0 4px, transparent 4px 8px);height:1px;position:relative}.cf-route-fill{background:var(--color-fg-muted);transform:scaleX(var(--p));transform-origin:0;transition:transform var(--dur-enter) var(--ease-out-quart), background-color var(--dur-base) ease;position:absolute;inset:0}.cf-route-ticks{justify-content:space-around;display:flex;position:absolute;inset:-4px 0 auto}.cf-route-ticks i{border:1px solid var(--color-fg-dim);background:var(--color-surface);width:9px;height:9px;transition:background-color var(--dur-fast) ease, border-color var(--dur-fast) ease, transform var(--dur-fast) var(--ease-spring)}.cf-route-ticks i[data-on]{background:var(--color-ok);border-color:var(--color-ok);transform:rotate(45deg)}.cf-route-packet{background:var(--color-accent);opacity:0;width:7px;height:7px;position:absolute;top:-3px;left:0}.cf[data-status=sending] .cf-route-fill{background:var(--color-accent)}.cf[data-status=sending] .cf-route-packet{opacity:1;animation:cf-packet 1.1s var(--ease-in-out-cubic) infinite}@keyframes cf-packet{0%{left:0}to{left:calc(100% - 7px)}}.cf[data-status=failed] .cf-route-fill{background:var(--color-fail);transform:scaleX(.5)}.cf[data-status=failed] .cf-route-line:after{content:"";background:var(--color-fail);width:1px;height:11px;position:absolute;top:-5px;left:calc(50% + 2px);transform:rotate(30deg)}.cf-route-note{font:500 var(--text-micro) / 1.4 var(--font-mono);letter-spacing:.06em;color:var(--color-fg-dim);margin-top:-.85rem}.cf[data-status=failed] .cf-route-note{color:var(--color-fail)}.cf-summary{border:1px solid color-mix(in srgb, var(--color-fail) 55%, transparent);border-left:3px solid var(--color-fail);border-radius:var(--radius-xs);background:color-mix(in srgb, var(--color-fail) 7%, transparent);padding:1rem 1.1rem 1.05rem}html:not([data-motion=reduced]) .cf-summary{animation:enter-up var(--dur-base) var(--ease-out-quart) both}.cf-summary-title{color:var(--color-fg);font-weight:600}.cf-summary ul{gap:.3rem;margin-top:.55rem;display:grid}.cf-summary a{font-size:var(--text-small);color:var(--color-fail);text-underline-offset:.2em;padding-block:.15rem;text-decoration:underline;display:inline-block}.cf-summary li[data-fixed] a{color:var(--color-fg-dim);text-decoration:line-through}.cf-label-row{justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.cf-label{font:500 .9375rem/1.3 var(--font-sans);color:var(--color-fg);align-items:baseline;gap:.6rem;display:inline-flex}.cf-index{font:500 .625rem/1 var(--font-mono);color:var(--color-fg-dim);transition:color var(--dur-fast) ease}.cf-req{font:500 .625rem/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-fg-dim);align-items:center;gap:.4rem;display:inline-flex}.cf-field[data-state=valid] .cf-req:before{content:"";background:var(--color-ok);width:7px;height:7px;transform:rotate(45deg)}.cf-control{margin-top:.55rem;position:relative}.cf-input{width:100%;font:400 1rem/1.5 var(--font-sans);color:var(--color-fg);background:var(--color-void);border:1px solid var(--color-line-strong);border-radius:var(--radius-xs);transition:border-color var(--dur-fast) ease, box-shadow var(--dur-fast) ease, background-color var(--dur-fast) ease;padding:.85rem .95rem;display:block}textarea.cf-input{resize:vertical;min-height:11rem}.cf-input:hover{border-color:var(--color-fg-dim)}.cf-input:focus{border-color:var(--color-signal);box-shadow:0 0 0 3px color-mix(in srgb, var(--color-signal) 24%, transparent);outline:none}.cf-input[readonly]{color:var(--color-fg-muted);background:color-mix(in srgb, var(--color-void) 60%, var(--color-surface))}.cf-focus-line{background:var(--color-accent);transform-origin:0;height:2px;transition:transform var(--dur-base) var(--ease-out-quart);pointer-events:none;position:absolute;bottom:1px;left:1px;right:1px;transform:scaleX(0)}.cf-field:focus-within .cf-focus-line{transform:none}.cf-field:focus-within .cf-index{color:var(--color-signal)}.cf-field[data-state=invalid] .cf-input{border-color:var(--color-fail)}.cf-field[data-state=invalid] .cf-input:focus{box-shadow:0 0 0 3px color-mix(in srgb, var(--color-fail) 24%, transparent)}.cf-field[data-state=invalid] .cf-focus-line{background:var(--color-fail)}.cf-field[data-state=invalid] .cf-index{color:var(--color-fail)}.cf-hint{color:var(--color-fg-dim);justify-content:space-between;gap:1rem;margin-top:.5rem;font-size:.8125rem;line-height:1.4;display:flex}.cf-counter{font:500 .6875rem/1.4 var(--font-mono);margin-left:auto}.cf-error{color:var(--color-fail);gap:.55rem;margin-top:.55rem;font-size:.875rem;line-height:1.45;display:flex}.cf-error-mark{background:var(--color-fail);flex:none;width:6px;height:6px;margin-top:.5em;transform:rotate(45deg)}html:not([data-motion=reduced]) .cf-error{animation:enter-up var(--dur-fast) var(--ease-out-quart) both}.cf-failed{border:1px solid color-mix(in srgb, var(--color-fail) 55%, transparent);border-left:3px solid var(--color-fail);border-radius:var(--radius-xs);background:color-mix(in srgb, var(--color-fail) 7%, transparent);padding:1.1rem 1.15rem 1.2rem}.cf-failed-title{color:var(--color-fg);gap:.6rem;font-weight:600;display:flex}.cf-failed-text{max-width:58ch;font-size:var(--text-small);color:var(--color-fg-muted);margin-top:.45rem;line-height:1.55}.cf-failed-actions{flex-wrap:wrap;gap:.5rem;margin-top:.9rem;display:flex}.cf-failed-actions .btn{min-height:44px}.cf-submit-row{flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;display:flex}.cf-submit{justify-content:center;min-width:11rem;position:relative;overflow:hidden}.cf-submit[aria-disabled=true]{cursor:progress}.cf-submit-progress{background:var(--color-accent);transform-origin:0;height:2px;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.cf-submit[data-sending] .cf-submit-progress{animation:cf-progress 1.4s var(--ease-in-out-cubic) infinite}html[data-motion=reduced] .cf-submit[data-sending] .cf-submit-progress{animation:none;transform:scaleX(.6)}@keyframes cf-progress{0%{transform-origin:0;transform:scaleX(0)}50%{transform-origin:0;transform:scaleX(1)}50.01%{transform-origin:100%}to{transform-origin:100%;transform:scaleX(0)}}.cf-submit-note{color:var(--color-fg-dim);font-size:.8125rem;line-height:1.4}.cf-done{padding-block:.5rem}.cf-done-route{font:500 var(--text-micro) / 1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--color-fg-dim);grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.85rem;display:grid}.cf-done-rk{color:var(--color-on-accent);background:var(--color-ok);border-radius:var(--radius-xs);padding:.3rem .45rem}.cf-done-line{background:var(--color-line-strong);height:1px;position:relative}.cf-done-fill{background:var(--color-ok);transform-origin:0;position:absolute;inset:0}.cf-done-packet{background:var(--color-ok);width:7px;height:7px;position:absolute;top:-3px;right:0}.cf-done-code{font:500 var(--text-micro) / 1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--color-ok);margin-top:2.25rem}.cf-done-title{font-family:var(--font-display);font-size:var(--text-display);line-height:var(--text-display--line-height);letter-spacing:var(--text-display--letter-spacing);color:var(--color-fg);outline:none;margin-top:.75rem}.cf-done-text{max-width:46ch;font-size:var(--text-lead);color:var(--color-fg-muted);overflow-wrap:anywhere;margin-top:1.25rem;line-height:1.55}.cf-done-nav{flex-wrap:wrap;gap:.75rem;margin-top:2.5rem;display:flex}html:not([data-motion=reduced]) .cf-done-fill{animation:cf-done-draw var(--dur-hero) var(--ease-out-expo) both}html:not([data-motion=reduced]) .cf-done-packet{animation:cf-done-land var(--dur-hero) var(--ease-out-expo) both}html:not([data-motion=reduced]) .cf-done-rk{animation:cf-done-rk var(--dur-base) var(--ease-out-quart) both;animation-delay:.52s}html:not([data-motion=reduced]) .cf-done :is(.cf-done-code,.cf-done-title,.cf-done-text,.cf-done-nav){animation:enter-up var(--dur-enter) var(--ease-out-quart) both}html:not([data-motion=reduced]) .cf-done .cf-done-code{animation-delay:.56s}html:not([data-motion=reduced]) .cf-done .cf-done-title{animation-delay:.62s}html:not([data-motion=reduced]) .cf-done .cf-done-text{animation-delay:.7s}html:not([data-motion=reduced]) .cf-done .cf-done-nav{animation-delay:.78s}@keyframes cf-done-draw{0%{transform:scaleX(0)}}@keyframes cf-done-land{0%{right:100%}}@keyframes cf-done-rk{0%{color:var(--color-fg-dim);box-shadow:inset 0 0 0 1px var(--color-line-strong);background:0 0}}html[data-motion=reduced] .cf :is(.cf-route-fill,.cf-route-ticks i,.cf-input,.cf-focus-line,.cf-index){transition:none}html[data-motion=reduced] .cf[data-status=sending] .cf-route-packet{animation:none;left:calc(50% - 3.5px)}}
