body.kt-passkey-page { --text:var(--kt-text); --muted:var(--kt-muted); --dim:var(--kt-muted); --brand:var(--kt-accent); --cyan:var(--kt-accent); --line:var(--kt-border); --line-2:var(--kt-border-active); --font:var(--kt-font-body); --disp:var(--kt-font-display); --mono:var(--kt-font-mono); --chamfer-sm:none; min-height:100svh; padding:0; display:block; background:radial-gradient(ellipse at 90% 25%,rgba(139,68,255,.09),transparent 50%),var(--kt-bg); }
.kt-passkey-page .ky-bg { display:none; }
.pk-access { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:clamp(40px,8vw,140px); min-height:calc(100svh - 170px); padding-block:70px; }
.pk-identity { position:relative; }
.pk-identity__mark { width:64px; height:72px; object-fit:contain; margin-bottom:36px; }
.pk-identity h2 { margin:20px 0; font:500 clamp(42px,5vw,72px)/1.04 var(--kt-font-display); letter-spacing:-.065em; }
.pk-identity h2 span { color:var(--kt-accent); }
.pk-identity p { max-width:410px; margin:0; color:var(--kt-muted); font-size:15px; line-height:1.8; }
.pk-identity__line { width:52px; height:1px; margin:38px 0 24px; background:var(--kt-accent); }
.pk-identity__meta { font:500 10px/1.8 var(--kt-font-mono); color:var(--kt-muted); letter-spacing:.12em; }
.pk-card,.pk-login { position:relative; width:100%; max-width:none; padding:clamp(28px,4vw,50px); border:1px solid var(--kt-border); border-radius:24px; text-align:left; background:linear-gradient(145deg,rgba(183,133,255,.055),transparent 55%),var(--kt-glass); box-shadow:var(--kt-shadow); backdrop-filter:blur(20px); }
.pk-card::before,.pk-login::before { content:''; position:absolute; top:-1px; left:40px; right:40px; height:1px; background:linear-gradient(90deg,transparent,var(--kt-accent),transparent); opacity:.6; }
.pk-card h1,.pk-login h1 { margin:16px 0 14px; font:500 clamp(25px,3vw,34px)/1.15 var(--kt-font-display); letter-spacing:-.04em; }
.pk-card .sub,.pk-login .sub { margin:0 0 28px; color:var(--kt-muted); font-size:14px; line-height:1.8; }
.pk-card .kt-eyebrow,.pk-login .kt-eyebrow { font-size:10px; }
.pk-login .brand { display:none; }
.pk-symbol { display:grid; place-items:center; width:48px; height:48px; border-radius:14px; border:1px solid var(--kt-border-active); background:var(--kt-light); color:var(--kt-accent); margin-bottom:26px; }
.pk-symbol svg { width:24px; height:24px; }
.pk-btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:48px; padding:14px 22px; border:1px solid var(--kt-accent); border-radius:9px; background:var(--kt-accent); color:var(--kt-bg); font:600 13px var(--kt-font-body); }
.pk-login .pk-btn { width:100%; }
.pk-btn:hover { box-shadow:0 4px 30px rgba(183,133,255,.24); transform:none; }
.pk-btn:disabled { opacity:.5; transform:none; cursor:not-allowed; }
.pk-alt { padding-top:24px; margin-top:24px; border-top:1px solid var(--kt-border); color:var(--kt-muted); font-size:12px; line-height:1.8; }
.pk-alt a,.pk-back { color:var(--kt-accent); text-decoration:none; }
.pk-alt a:hover,.pk-back:hover { text-decoration:underline; }
.pk-msg { display:none; margin-bottom:20px; border:1px solid var(--kt-border); border-radius:9px; padding:14px; font-size:13px; line-height:1.6; }
.pk-msg.error { display:block; border-color:rgba(255,93,122,.3); background:rgba(255,93,122,.06); color:var(--kt-error); }
.pk-msg.ok { display:block; border-color:rgba(52,245,197,.25); background:rgba(52,245,197,.06); color:var(--kt-ok); }
.pk-wrap { width:min(720px,calc(100% - var(--kt-gutter) * 2)); margin:64px auto; }
.pk-row { display:flex; align-items:stretch; gap:12px; margin:8px 0 30px; }
.pk-row input { min-width:0; flex:1; padding:14px; border:1px solid var(--kt-border); border-radius:9px; color:var(--kt-text); background:rgba(0,0,0,.2); font-size:13px; }
.pk-label { display:block; margin:0 0 10px; font:500 11px var(--kt-font-mono); color:var(--kt-muted); }
.pk-list { padding:0; margin:0; list-style:none; border-top:1px solid var(--kt-border); }
.pk-item { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:20px 0; border-bottom:1px solid var(--kt-border); }
.pk-item .meta { flex:1; min-width:160px; }
.pk-item .name { font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.pk-item .info { margin-top:7px; color:var(--kt-muted); font:400 10px/1.8 var(--kt-font-mono); }
.pk-item button { min-height:44px; padding:10px 14px; border:1px solid var(--kt-border); border-radius:8px; background:var(--kt-glass-raised); color:var(--kt-text); font-size:11px; }
.pk-item button:hover { border-color:var(--kt-border-active); }
.pk-item button.danger:hover { color:var(--kt-error); border-color:var(--kt-error); }
.pk-back { display:inline-flex; align-items:center; gap:10px; min-height:44px; margin-top:18px; font-size:12px; }
.pk-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; border-top:1px solid var(--kt-border); color:var(--kt-muted); font:400 10px/1.8 var(--kt-font-mono); }
.pk-bottom a { color:inherit; text-decoration:none; }
.pk-bottom a:hover { color:var(--kt-accent); }
.pk-bottom div { display:flex; gap:24px; }
.kt-passkey-page :is(.pk-btn,.pk-item button,.pk-alt a,.pk-back,.pk-bottom a) {
  transition-property:color,background-color,border-color,box-shadow,opacity;
  transition-duration:var(--kt-duration-feedback);
  transition-timing-function:var(--kt-ease-in-out);
}
.kt-passkey-page :is(.pk-btn,.pk-item button):is(:hover,:active) {transform:none}
@media(max-width:760px) { .pk-access { grid-template-columns:1fr; gap:32px; padding-block:40px; min-height:auto; } .pk-identity__mark,.pk-identity__line,.pk-identity__meta { display:none; } .pk-identity h2 { font-size:44px; } .pk-identity p { font-size:13px; } .pk-bottom { flex-direction:column; align-items:flex-start; } .pk-wrap { margin-block:40px; } }
@media(max-width:440px) { .pk-row { flex-direction:column; } .pk-card,.pk-login { padding:26px; } }