:root{--ease:cubic-bezier(.2,.8,.2,1);--soft:#f4f4f6;--muted:#86868b;--ink:#111113;--danger:#c4352d;font-family:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:#fff;font-synthesis:none;color-scheme:light;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}body{margin:0;min-height:100dvh;display:grid;place-items:start center;padding:max(48px,11vh) 24px max(32px,env(safe-area-inset-bottom));background:#fff}main{width:100%;max-width:380px;margin:auto}.booting>*{visibility:hidden;animation:unhide 0s 3s forwards}@keyframes unhide{to{visibility:visible}}
.brand{display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;color:var(--ink);font-size:17px;font-weight:600;letter-spacing:-.3px;margin-bottom:44px}.mark{width:30px;height:30px;flex:none}
.card{position:relative}h1{font-size:30px;font-weight:600;line-height:1.25;letter-spacing:-.8px;margin:0 0 30px}h2{font-size:19px;line-height:1.4;font-weight:600;letter-spacing:-.3px;margin:0 0 18px;overflow-wrap:anywhere}
input,select,button{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit;min-height:44px}
.field{position:relative;display:block;margin-bottom:12px}.field input,.field select{display:block;width:100%;min-width:0;height:60px;padding:25px 18px 9px;border:0;border-radius:18px;background:var(--soft);color:var(--ink);font-size:16px;outline:none;-webkit-appearance:none;appearance:none;transition:background-color .3s var(--ease),box-shadow .35s var(--ease)}.field input:focus,.field select:focus{background:#fff;box-shadow:0 12px 32px -12px rgba(0,0,0,.24),0 2px 8px -2px rgba(0,0,0,.08)}
.field label{position:absolute;left:18px;top:19px;font-size:16px;line-height:22px;color:var(--muted);pointer-events:none;transform-origin:0 0;transition:transform .3s var(--ease),color .3s var(--ease)}.field input:focus+label,.field input:not(:placeholder-shown)+label,.field.static label{transform:translateY(-11px) scale(.75)}.field input:focus+label{color:var(--ink)}
.field select{padding-right:48px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1.5 5 5 5-5' fill='none' stroke='%2386868b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 20px center}
.password-wrap input{padding-right:70px}.reveal{position:absolute;right:8px;top:8px;height:44px;padding:0 12px;border-radius:12px;font-size:13px;color:var(--muted);transition:color .2s,background-color .2s}.reveal:hover{color:var(--ink);background:rgba(0,0,0,.04)}
.primary{position:relative;display:block;width:100%;height:56px;margin-top:22px;border-radius:18px;background:var(--ink);color:#fff;font-size:16px;font-weight:600;letter-spacing:.2px;box-shadow:0 14px 28px -14px rgba(0,0,0,.5);transition:transform .25s var(--ease),background-color .2s,opacity .25s,box-shadow .3s var(--ease)}.primary:hover{background:#2c2c2e}.primary:active{transform:scale(.98);box-shadow:0 6px 16px -10px rgba(0,0,0,.5)}
.primary.busy{color:transparent}.primary.busy::after{content:"";position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;animation:spin .8s linear infinite}
.sent-to{margin:-20px 0 24px;font-size:15px;color:var(--muted);overflow-wrap:anywhere}#code{letter-spacing:.32em;font-variant-numeric:tabular-nums}.closed{padding:9px 12px;font-size:14px;color:#b4b4b9}.links{display:flex;justify-content:center;gap:28px;margin-top:16px}.text-button{display:block;padding:9px 12px;border-radius:12px;font-size:14px;color:var(--muted);transition:color .2s,background-color .2s}.text-button:hover{color:var(--ink);background:var(--soft)}#resend{margin:16px auto 0}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.section-head h1{margin:0}.icon-button{width:44px;height:44px;border-radius:14px;font-size:22px;line-height:1;transition:background-color .2s}.icon-button:hover,.icon-button[aria-expanded=true]{background:var(--soft)}
.menu{position:absolute;right:0;top:56px;min-width:168px;padding:6px;border-radius:18px;background:#fff;box-shadow:0 20px 50px -14px rgba(0,0,0,.28),0 4px 14px -6px rgba(0,0,0,.1);z-index:5;transform-origin:top right;animation:pop .26s var(--ease)}.menu button{display:block;width:100%;padding:11px 14px;border-radius:12px;text-align:left;font-size:15px;transition:background-color .15s}.menu button:hover{background:var(--soft)}
#devices{list-style:none;margin:0;padding:0;display:grid;gap:10px}#devices li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:16px 12px 16px 20px;border-radius:22px;background:var(--soft)}.device-name{display:block;font-size:16px;font-weight:600;overflow-wrap:anywhere}.device-state{display:flex;align-items:center;gap:7px;margin-top:4px;font-size:13px;color:var(--muted)}.device-state.online::before{content:"";width:7px;height:7px;border-radius:50%;background:#34a76d}
.device-actions{display:flex;gap:4px;align-items:center}.device-actions>button{min-height:40px;padding:0 18px;border-radius:999px;background:var(--ink);color:#fff;font-size:14px;font-weight:500;transition:transform .2s var(--ease),background-color .2s}.device-actions>button:hover{background:#2c2c2e}.device-actions>button:active{transform:scale(.95)}
.device-menu{position:relative}.device-menu summary{list-style:none;display:grid;place-items:center;width:40px;height:40px;border-radius:13px;cursor:pointer;font-size:20px;transition:background-color .2s}.device-menu summary::-webkit-details-marker{display:none}.device-menu summary:hover,.device-menu[open] summary{background:rgba(0,0,0,.05)}
.device-options{position:absolute;right:0;top:46px;min-width:128px;padding:6px;border-radius:16px;background:#fff;box-shadow:0 20px 50px -14px rgba(0,0,0,.28),0 4px 14px -6px rgba(0,0,0,.1);z-index:4;transform-origin:top right;animation:pop .24s var(--ease)}.device-options button{display:block;width:100%;padding:10px 14px;border-radius:11px;text-align:left;font-size:14px;transition:background-color .15s}.device-options button:hover{background:var(--soft)}
#signed:not([hidden]){display:flex;flex-direction:column}.section-head{order:-2}.muted{font-size:15px;color:var(--muted);text-align:center;margin:28px 0}#approval{order:-1;margin:0 0 24px;padding:22px;border-radius:26px;background:var(--soft)}#approval .field select{background-color:#fff}#approval .primary{margin-top:16px}
#message{min-height:24px;margin:24px 8px 0;text-align:center;font-size:14px;line-height:1.7;color:var(--muted);overflow-wrap:anywhere}#message.error{color:var(--danger)}
dialog{width:min(380px,calc(100vw - 40px));max-width:none;padding:28px;border:0;border-radius:30px;background:#fff;color:var(--ink);box-shadow:0 40px 90px -24px rgba(0,0,0,.4)}dialog[open]{animation:dialogIn .38s var(--ease)}dialog::backdrop{background:rgba(17,17,19,.2);animation:fade .3s var(--ease)}dialog h2{margin-bottom:22px}#dialogMessage{font-size:13px;color:var(--danger);line-height:1.6}#dialogMessage:empty{display:none}
.dialog-actions{display:flex;gap:10px;margin-top:22px}.dialog-actions>*{flex:1}.secondary{height:52px;border-radius:16px;background:var(--soft);font-size:15px;font-weight:500;transition:background-color .2s}.secondary:hover{background:#ececef}.dialog-actions .primary{width:auto;height:52px;margin:0;box-shadow:none}
button:disabled{opacity:.45;cursor:default}.primary.busy:disabled{opacity:1}:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.field input:focus-visible,.field select:focus-visible{outline:none}[hidden]{display:none!important}
.rise{animation:rise .7s var(--ease) both;animation-delay:calc(var(--i,0) * 70ms)}@keyframes rise{from{opacity:0;transform:translateY(14px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}@keyframes fade{from{opacity:0}}@keyframes pop{from{opacity:0;transform:scale(.94) translateY(-6px)}}@keyframes dialogIn{from{opacity:0;transform:translateY(18px) scale(.96)}}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:360px){body{padding:28px 18px}.brand{margin-bottom:32px}h1{font-size:27px}}@media(max-height:650px){body{place-items:start center}.brand{margin-bottom:28px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after,dialog::backdrop{animation:none!important;transition:none!important}}

.action-menu{width:min(320px,calc(100vw - 32px));padding:8px;border-radius:20px}.action-menu button{display:block;width:100%;min-height:48px;padding:12px 16px;text-align:left;border-radius:12px}.action-menu button:hover{background:var(--soft)}#dialogDescription{font-size:14px;line-height:1.6;color:var(--muted)}

/* Device selection is a home screen, not a vertically centred login form. */
body:has(#signed:not([hidden])){display:block;padding: max(28px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}
body:has(#signed:not([hidden])) main{margin:0 auto;max-width:440px}
body:has(#signed:not([hidden])) .brand{justify-content:flex-start;font-size:26px;line-height:1.2;font-weight:650;letter-spacing:-.7px;gap:12px;margin:0}
body:has(#signed:not([hidden])) .mark{width:36px;height:36px}
#signed .section-head{margin-bottom:20px}
#signed .section-head h1{font-size:24px;letter-spacing:-.5px}
.device-actions>.icon-button{width:44px;min-width:44px;padding:0;background:transparent;color:var(--ink);border-radius:14px}
.device-actions>.icon-button:hover{background:#e8e8ec}
@media(max-width:360px){body:has(#signed:not([hidden])){padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}body:has(#signed:not([hidden])) .brand{font-size:24px}}

html[data-input="pointer"] button:focus,html[data-input="pointer"] [tabindex]:focus,html[data-input="pointer"] dialog:focus{outline:none!important}html[data-input="pointer"] .tree-row:focus,html[data-input="pointer"] .tree-add:focus{box-shadow:none!important}

/* 删除账号 in the account menu and its confirm button; the footer every public page carries (隐私政策, ICP number). */
.action-menu button.danger,.dialog-actions .primary.danger{color:var(--danger)}.dialog-actions .primary.danger{background:var(--soft)}:root[data-theme=dark] .dialog-actions .primary.danger{background:#351d20;color:#ff9a9a;border-color:#bb7777}
.site-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:40px 0 0;font-size:12px;line-height:1.6}.site-foot a{color:var(--muted);text-decoration:none}.site-foot a:hover{color:var(--ink)}