/* Sign-in and first run, in the Apple design language. Values from tokens.css. */
*{box-sizing:border-box;margin:0;padding:0}
body{font-variant-numeric:tabular-nums;font-family:var(--font-body);color:var(--ink-700);-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:48px 20px;line-height:1.43;letter-spacing:-.01em;background:var(--canvas)}
strong,b{font-weight:600}
a{color:var(--link);text-decoration:none}
@keyframes ipFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wrap{width:100%;max-width:420px;display:flex;flex-direction:column;align-items:center;animation:ipFade 360ms var(--ease)}
.wrap-wide{max-width:480px}
.logo-mark{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.logo-mark .tb-mark,.logo-mark .brand-logo{width:34px;height:34px}
.brand-logo{width:auto!important;max-width:160px;object-fit:contain}
.logo-text{font:600 19px/1.2 var(--font-display);letter-spacing:-.022em;color:var(--fg-1)}
.logo-sub{font:400 14px/1.25 var(--font-body);color:var(--fg-2);margin-top:2px}
.server-band{width:100%;display:flex;gap:14px;align-items:center;padding:20px 24px;border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--sea-800);color:#fff}
.server-band .ico{color:var(--sea-200)}
.band-kind{font:600 12px/1 var(--font-body);letter-spacing:0;color:var(--sea-200)}
.band-name{font:600 21px/1.19 var(--font-display);letter-spacing:-.015em;margin-top:4px}
.band-note{font-size:13px;color:var(--sea-200)}
.card{width:100%;background:var(--bg-1);border:1px solid var(--line-1);border-top:none;border-radius:0 0 var(--r-lg) var(--r-lg);padding:32px}
.step-bar{display:flex;gap:6px;margin-bottom:24px}
.step-bar i{flex:1;height:3px;border-radius:var(--r-pill);background:var(--line-1)}
.step-bar i.on{background:var(--brand-navy)}
.card-title{font:600 34px/1.12 var(--font-display);letter-spacing:-.025em;color:var(--fg-1)}
.card-sub{font-size:15px;line-height:1.45;color:var(--fg-2);margin:8px 0 24px}
.err{padding:12px 16px;margin-bottom:16px;border-radius:var(--r-md);background:var(--err-tint);color:var(--err);font-size:14px;font-weight:600;text-align:center}
.field-label{display:block;font:600 13px/1.35 var(--font-body);letter-spacing:-.01em;color:var(--fg-1);margin-bottom:8px}
.field-label .opt{color:var(--fg-2);font-weight:400}
.req{color:var(--err)}
.field{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--bg-1);color:var(--fg-2);margin-bottom:16px}
.field:focus-within{border-color:var(--info);box-shadow:var(--sh-focus)}
.field input,.field textarea{flex:1;align-self:stretch;min-width:0;border:none;outline:none;background:none;font:400 15px var(--font-body);letter-spacing:-.015em;color:var(--fg-1)}
.field textarea{padding:12px 0;resize:vertical}
.pw-eye{position:relative;display:grid;place-items:center;width:32px;height:32px;margin-right:-8px;border:none;border-radius:var(--r-sm);background:none;color:var(--fg-2);cursor:pointer}
.pw-eye:hover{color:var(--fg-1);background:var(--ink-100)}
.pw-eye::after{content:"";position:absolute;inset:-6px}
.field-note{font-size:13px;line-height:1.5;color:var(--fg-2);margin:-4px 0 12px}
.sep{margin-top:20px;padding-top:16px;border-top:1px solid var(--line-1)}
.btn{width:100%;height:48px;border:none;border-radius:var(--r-pill);background:var(--brand-navy);color:var(--on-brand);font:400 17px/1.4 var(--font-body);letter-spacing:-.022em;transition:transform 120ms;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:4px;cursor:pointer}
.btn:hover,.btn:active{background:var(--brand-navy-deep)}
.btn:active{transform:scale(.98)}
.sa-link{margin-top:18px;height:44px;padding:0 12px;border:none;border-radius:var(--r-pill);background:none;font:400 15px var(--font-body);color:var(--link);display:flex;align-items:center;gap:8px;cursor:pointer}
.sa-link:hover{background:var(--bg-2)}
.powered{margin-top:10px;font-size:12px;color:var(--fg-2)}
.powered .ver{display:inline-block;margin-left:2px;padding:1px 5px;border-radius:var(--r-xs);font:400 11px/1.3 var(--font-mono);background:var(--ink-200);color:var(--fg-1)}
.card-foot{margin-top:14px;font-size:12px;line-height:1.5;color:var(--fg-2);text-align:center}
[x-cloak]{display:none!important}
