@layer components{.ct{position:relative}.ct-hero{isolation:isolate;background-color:var(--color-void);min-height:min(100svh,60rem);padding-top:calc(var(--header-h) + clamp(2rem, 5vw, 4.5rem));border-bottom:1px solid var(--color-line);padding-bottom:clamp(3.5rem,6vw,6rem);position:relative;overflow:clip}.ct-wires{pointer-events:none;z-index:0;width:100%;height:100%;position:absolute;inset:0}.ct-hero-glow{z-index:-1;pointer-events:none;background:radial-gradient(48% 58% at 80% 40%, color-mix(in srgb, var(--color-fg) 5%, transparent), transparent 72%);position:absolute;inset:0}.ct-hero-grid{z-index:1;gap:3.5rem;display:grid;position:relative}@media (min-width:1024px){.ct-hero-grid{min-height:calc(min(100svh, 60rem) - var(--header-h) - 9rem);grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;column-gap:clamp(3rem,6vw,6.5rem)}}.ct-request{font:500 var(--text-micro) / 1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--color-fg-dim);flex-wrap:wrap;align-items:center;gap:.25rem .75rem;display:flex}.ct-request-wire{background:var(--color-line-strong);width:2.5rem;height:1px}.ct-live{font:500 var(--text-micro) / 1.4 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--color-ok);align-items:center;gap:.6rem;margin-top:clamp(1.75rem,3vw,2.5rem);display:flex}.ct-live-dot{background:var(--color-ok);width:7px;height:7px;box-shadow:0 0 0 4px color-mix(in srgb, var(--color-ok) 18%, transparent);border-radius:50%}html:not([data-motion=reduced]) .ct-live-dot{animation:1.6s ease-in-out infinite pulse-dot}.ct-title{max-width:8ch;font-size:var(--text-display-xl);line-height:var(--text-display-xl--line-height);letter-spacing:var(--text-display-xl--letter-spacing);color:var(--color-fg);margin-top:1.1rem}@media (max-width:639px){.ct-title{font-size:clamp(3.5rem,19vw,5.5rem)}}.ct-lede{max-width:40ch;margin-top:clamp(1.5rem,2.5vw,2.25rem)}.ct-lede+.ct-lede{margin-top:1rem}.ct-actions{flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:clamp(2rem,3vw,2.75rem);display:flex}.ct-copy .btn[data-state=copied]{border-color:var(--color-ok);color:var(--color-ok)}.ct-copy-status{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.ct-message{scroll-margin-top:calc(var(--header-h) - 1px);padding-block:clamp(4.5rem,3rem + 6vw,8.5rem) clamp(3rem,2rem + 4vw,5.5rem)}.ct-message-grid{gap:3rem;display:grid}@media (min-width:1024px){.ct-message-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;column-gap:clamp(3rem,6vw,6.5rem)}.ct-message-intro{top:calc(var(--header-h) + 2rem);position:sticky}}.ct-steps{border-top:1px solid var(--color-line);margin-top:2.25rem}.ct-steps li{border-bottom:1px solid var(--color-line);font-size:var(--text-small);color:var(--color-fg-muted);transition:color var(--dur-base) ease;align-items:baseline;gap:.9rem;padding:.8rem 0 .8rem 1.4rem;display:flex;position:relative}.ct-steps li:before{content:"";border:1px solid var(--color-fg-dim);width:7px;height:7px;transition:background-color var(--dur-base) ease, border-color var(--dur-base) ease;margin-top:-3.5px;position:absolute;top:50%;left:0}.ct-steps li span{font:500 .625rem/1 var(--font-mono);color:var(--color-fg-dim)}.ct-message:has(.cf :is(input,textarea):focus) .ct-steps li:first-child{color:var(--color-fg)}.ct-message:has(.cf[data-status=sending]) .ct-steps li:nth-child(-n+2){color:var(--color-fg)}.ct-message:has(.cf[data-status=failed]) .ct-steps li:first-child{color:var(--color-fg)}.ct-message:has(.cf-done) .ct-steps li{color:var(--color-fg)}.ct-message:has(.cf :is(input,textarea):focus) .ct-steps li:first-child:before{background:var(--color-accent);border-color:var(--color-accent)}.ct-message:has(.cf[data-status=sending]) .ct-steps li:nth-child(-n+2):before{background:var(--color-accent);border-color:var(--color-accent)}.ct-message:has(.cf[data-status=failed]) .ct-steps li:first-child:before{background:var(--color-accent);border-color:var(--color-accent)}.ct-message:has(.cf[data-status=failed]) .ct-steps li:nth-child(2):before{border-color:var(--color-fail);background:0 0;transform:rotate(45deg)}.ct-message:has(.cf-done) .ct-steps li:before{background:var(--color-ok);border-color:var(--color-ok)}.ct-form-panel{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius-sm);padding:clamp(1.25rem,3.5vw,2.75rem)}}
