.kxl,.kxl-passkeys{--kxl-brand:var(--kxl-brand-light);--kxl-on-brand:var(--kxl-on-brand-light);--kxl-brand-strong:color-mix(in srgb, var(--kxl-brand) 82%, black);--kxl-brand-ink:color-mix(in srgb, var(--kxl-brand) 90%, black);--kxl-panel-start:color-mix(in srgb, var(--kxl-brand-light) 80%, white);--kxl-panel-mid:var(--kxl-brand-light);--kxl-panel-end:color-mix(in srgb, var(--kxl-brand-light) 52%, black);--kxl-background:#f2f4f8;--kxl-foreground:#0c0f17;--kxl-surface:#fff;--kxl-muted:#4e556e;--kxl-border:#d6dbe6;--kxl-destructive:#b3413d;--kxl-radius:.625rem;color:var(--kxl-foreground);font-synthesis:none;text-rendering:optimizelegibility;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.dark .kxl,.dark .kxl-passkeys,[data-theme=dark] .kxl,[data-theme=dark] .kxl-passkeys{--kxl-brand:var(--kxl-brand-dark);--kxl-on-brand:var(--kxl-on-brand-dark);--kxl-brand-strong:color-mix(in srgb, var(--kxl-brand) 84%, white);--kxl-brand-ink:var(--kxl-brand-strong);--kxl-panel-start:color-mix(in srgb, var(--kxl-brand-light) 88%, black);--kxl-panel-mid:color-mix(in srgb, var(--kxl-brand-light) 60%, black);--kxl-panel-end:color-mix(in srgb, var(--kxl-brand-light) 36%, black);--kxl-background:#0a0b12;--kxl-foreground:#f2f4fb;--kxl-surface:#14161f;--kxl-muted:#c6cbdd;--kxl-border:#272b39;--kxl-destructive:#f0908c}.kxl *,.kxl-passkeys *{box-sizing:border-box}.kxl button,.kxl input,.kxl-passkeys button{font:inherit}.kxl{background:var(--kxl-background);min-height:100vh;margin:0;display:flex}.kxl-story{color:#fff;background:radial-gradient(circle at 20% 15%, #ffffff38, transparent 55%), linear-gradient(165deg, var(--kxl-panel-start) 0%, var(--kxl-panel-mid) 58%, var(--kxl-panel-end) 100%);flex-direction:column;flex:0 0 44%;justify-content:space-between;width:44%;min-height:100vh;padding:40px;display:flex;position:relative;overflow:hidden}.kxl-brand{z-index:1;color:inherit;align-items:center;gap:8px;display:flex;position:relative}.kxl-brand-mark{flex:none;width:28px;height:28px;display:inline-flex}.kxl-brand-mark>*,.kxl-network-mark>*{width:100%;height:100%}.kxl-brand strong{letter-spacing:-.025em;font-size:18px;font-weight:700}.kxl-story-copy{z-index:1;max-width:390px;margin:auto 0 22px;position:relative}.kxl-story-copy h2{letter-spacing:-.035em;margin:0;font-size:clamp(24px,2.2vw,34px);font-weight:650;line-height:1.16}.kxl-story-copy p{color:#ffffffc7;max-width:350px;margin:14px 0 0;font-size:14px;line-height:1.65}.kxl-network{z-index:1;color:#fff;width:min(100%,520px);height:auto;position:relative}.kxl-network-lines{fill:none;stroke:currentColor;stroke-width:1.5px;opacity:.22}.kxl-network-nodes{fill:currentColor;opacity:.62}.kxl-network-center{fill:#ffffff29;stroke:#ffffff61}.kxl-network-mark{color:#fff;width:56px;height:56px;display:flex}.kxl-entry{flex:1;justify-content:center;align-items:center;min-height:100vh;padding:40px 24px;display:flex;position:relative}.kxl-theme{border:1px solid var(--kxl-border);background:color-mix(in srgb, var(--kxl-surface) 88%, transparent);border-radius:999px;gap:2px;min-inline-size:0;margin:0;padding:3px;display:inline-flex;position:absolute;top:24px;right:24px;box-shadow:0 1px 3px #0a0b1212}.kxl-theme button{color:var(--kxl-muted);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:600;line-height:1.25}.kxl-theme button:hover{color:var(--kxl-foreground)}.kxl-theme button[aria-pressed=true]{color:var(--kxl-on-brand);background:var(--kxl-brand)}.kxl-card{width:min(100%,384px)}.kxl-mobile-brand{display:none}.kxl-card h1{color:var(--kxl-foreground);letter-spacing:-.025em;margin:0;font-size:20px;font-weight:650}.kxl-intro{color:var(--kxl-muted);margin:6px 0 24px;font-size:14px;line-height:1.55}.kxl-intro strong{color:var(--kxl-foreground);font-weight:600}.kxl-form{gap:14px;display:grid}.kxl-form label{color:var(--kxl-foreground);margin-bottom:-7px;font-size:13px;font-weight:500}.kxl-form input{border:1px solid var(--kxl-border);border-radius:var(--kxl-radius);width:100%;height:40px;color:var(--kxl-foreground);background:var(--kxl-surface);outline:none;padding:0 12px;transition:border-color .14s,box-shadow .14s;box-shadow:0 1px 2px #10131c0a}.kxl-form input::placeholder{color:#8d93a7}.kxl-form input:read-only{color:var(--kxl-muted);background:color-mix(in srgb, var(--kxl-surface) 60%, var(--kxl-background))}.kxl-form input:focus{border-color:var(--kxl-brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--kxl-brand) 18%, transparent)}.kxl-primary,.kxl-secondary{border-radius:var(--kxl-radius);cursor:pointer;justify-content:center;align-items:center;width:100%;height:40px;padding:0 14px;font-size:14px;font-weight:600;transition:background .14s,border-color .14s,box-shadow .14s;display:inline-flex}.kxl-primary{color:var(--kxl-on-brand);background:var(--kxl-brand);border:0}.kxl-primary:hover:not(:disabled){background:var(--kxl-brand-strong);box-shadow:0 4px 12px color-mix(in srgb, var(--kxl-brand) 24%, transparent)}.kxl-secondary{border:1px solid var(--kxl-border);color:var(--kxl-foreground);background:var(--kxl-surface)}.kxl-secondary:hover:not(:disabled){border-color:var(--kxl-brand)}.kxl button:disabled,.kxl-passkeys button:disabled{cursor:not-allowed;opacity:.55}.kxl-divider{color:var(--kxl-muted);align-items:center;gap:12px;margin:16px 0;font-size:12px;display:flex}.kxl-divider:before,.kxl-divider:after{background:var(--kxl-border);content:"";flex:1;height:1px}.kxl-link,.kxl-dev-code{cursor:pointer;background:0 0;border:0}.kxl-link{color:var(--kxl-muted);border-radius:4px;justify-self:center;padding:5px 8px;font-size:13px;font-weight:500}.kxl-link:hover:not(:disabled){color:var(--kxl-foreground)}.kxl-dev-code{border-radius:var(--kxl-radius);color:var(--kxl-brand-ink);background:color-mix(in srgb, var(--kxl-brand) 14%, var(--kxl-surface));text-align:left;margin:0;padding:9px 12px;font-size:12px}.kxl button:focus-visible,.kxl-passkeys button:focus-visible{outline:2px solid var(--kxl-brand);outline-offset:2px}.kxl-error{border-radius:var(--kxl-radius);color:var(--kxl-destructive);background:color-mix(in srgb, var(--kxl-destructive) 10%, var(--kxl-surface));margin:16px 0 0;padding:10px 12px;font-size:13px;line-height:1.45}.kxl-help{color:var(--kxl-muted);text-align:center;margin:24px 0 0;font-size:12px}.kxl-passkeys{max-width:480px}.kxl-passkeys h2{letter-spacing:-.02em;margin:0;font-size:16px;font-weight:650}.kxl-passkeys .kxl-intro{margin-bottom:16px}.kxl-passkeys ul{gap:8px;margin:0 0 16px;padding:0;list-style:none;display:grid}.kxl-passkeys li{border:1px solid var(--kxl-border);border-radius:var(--kxl-radius);background:var(--kxl-surface);justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;font-size:14px;display:flex}.kxl-passkeys li small{color:var(--kxl-muted);font-size:12px;display:block}.kxl-passkeys-add{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.kxl-passkeys-add label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.kxl-passkeys-add input{border:1px solid var(--kxl-border);border-radius:var(--kxl-radius);min-width:0;height:40px;color:var(--kxl-foreground);background:var(--kxl-surface);outline:none;flex:180px;padding:0 12px}.kxl-passkeys-add input:focus{border-color:var(--kxl-brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--kxl-brand) 18%, transparent)}.kxl-passkeys .kxl-secondary{width:auto}.kxl-empty{color:var(--kxl-muted);margin:0 0 16px;font-size:13px}@media (max-width:959px){.kxl-story{display:none}.kxl-entry{min-height:100svh}.kxl-mobile-brand{color:var(--kxl-brand);margin-bottom:40px;display:block}.kxl-mobile-brand .kxl-brand strong{color:var(--kxl-foreground)}}@media (max-width:480px){.kxl-entry{align-items:flex-start;padding:76px 20px 32px}.kxl-theme{right:20px}}
