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