:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:#172238;background:#eff3f7;font-size:16px;--border:#dde3ed}
*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:wait}button,a,input,textarea,select{outline-color:#285cff}
button{border:1px solid var(--border);background:#fdfefe;color:#465a75;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:10px 15px;font-size:.875rem;transition:background .15s,box-shadow .15s}button:hover{background:#edf2fc;box-shadow:0 3px 8px #1223410a}button.primary{background:linear-gradient(130deg,#2459e8,#069fab);color:white;border-color:transparent;box-shadow:0 5px 15px #2961ef20}
.icon-button{padding:10px;width:42px;height:42px}.icon{width:20px;height:20px;display:inline-block;flex-shrink:0}.icon svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}[hidden]{display:none!important}
.sidebar{position:fixed;inset:0 auto 0 0;width:242px;background:linear-gradient(170deg,#e0e6f3,#f0f3f7);border-right:1px solid #d3dbe7;padding:40px 18px 22px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:13px;color:#172238;text-decoration:none;padding:12px 8px 24px;border-bottom:1px solid #cfd7e6}.brand strong{font-size:1.1rem;white-space:nowrap}
.brand-mark{width:48px;height:48px;border-radius:15px;background:linear-gradient(130deg,#2557e9,#069fa9);display:flex;align-items:center;justify-content:center;color:white;box-shadow:0 7px 15px #245be423;flex-shrink:0}.brand-mark svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
nav{margin-top:20px;display:grid;gap:7px}nav button,.sidebar-bottom>button{width:100%;justify-content:flex-start;border:0;background:none;padding:15px;font-size:1rem;gap:14px;border-radius:12px}nav button .icon,.sidebar-bottom .icon{width:24px;height:24px}nav button.active,.sidebar-bottom>button.active{background:#cdd9f4;color:#2156f8}nav button:hover,.sidebar-bottom>button:hover{background:#dce4f4}.nav-count{margin-left:auto;font-size:.75rem;padding:2px 6px;background:#ffffff69;border-radius:6px}
.sidebar-bottom{margin-top:auto;border-top:1px solid var(--border);padding-top:16px}.server-label{margin:17px 16px 0;font-size:.75rem;color:#6b7d93;display:flex;align-items:center;gap:8px}.server-label>span{background:#0e9e83;width:6px;height:6px;border-radius:50%}
main{margin-left:242px;padding:30px;min-height:100vh;background:radial-gradient(ellipse at 100% 0,#e0f3ee,transparent 48%),radial-gradient(ellipse at 0 0,#e4e9f6,transparent 40%)}.page-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 22px}.eyebrow{font-size:.7rem;letter-spacing:.16em;color:#8291a8;font-weight:600}h1{font-size:1.55rem;letter-spacing:-.03em;margin:5px 0 0}.private-badge{display:flex;gap:6px;font-size:.8rem;color:#71829a}.private-badge .icon{width:17px;height:17px}
.toolbar{display:flex;gap:12px;align-items:center;background:#ffffffcc;border:1px solid #d8dfe8;border-radius:22px;padding:17px 19px;box-shadow:0 5px 10px #2435530b}.search-box{display:flex;align-items:center;background:#eef2f8;border:1px solid #d7deea;border-radius:15px;padding:12px;gap:10px;width:230px;color:#92a1b7}.search-box input:not([type=checkbox]){min-width:0;width:100%;border:0;background:none;padding:0;color:#21304b;font-size:.875rem;outline:none}.search-box input::placeholder{color:#8d9db6}
.view-switch{display:flex;background:#edf2f8;border:1px solid #d7deea;padding:3px;border-radius:12px}.view-switch button{width:32px;height:32px;border:0;background:none;padding:6px}.view-switch button.active{background:#2561e9;color:white;box-shadow:0 3px 8px #255ced35;border-radius:9px}select{border:1px solid #d7deea;border-radius:11px;color:#475a75;background:#edf2f8;padding:11px 10px;font-weight:500;font-size:.875rem;max-width:160px}.toolbar-actions{margin-left:auto;display:flex;gap:9px}.toolbar-actions>button:not(.primary){box-shadow:0 2px 6px #00000008}
.selection-bar{display:flex;align-items:center;justify-content:space-between;background:#ffffffb8;border:1px solid #d8dfe8;border-radius:18px;padding:16px 19px;margin-top:22px;gap:14px}.select-all{display:flex;align-items:center;gap:9px;font-size:.875rem}input[type=checkbox]{accent-color:#285cff;width:18px;height:18px;cursor:pointer;margin:0}.count-pill{border:1px solid #b7c9fc;background:#f1f5ff;color:#285cff;padding:7px 16px;border-radius:22px;font-size:.875rem;font-weight:600}.count-pill b{background:#dbe5ff;padding:2px 6px;border-radius:7px;margin-left:4px}.batch-actions{display:flex;gap:10px}.batch-actions button{padding:12px 15px;box-shadow:0 2px 6px #00000008}.sync-caption{display:flex;justify-content:space-between;margin:18px 3px 15px;font-size:.75rem;color:#8998ae}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}.account{background:#fbfcfeec;border:1px solid #dce2ea;border-radius:22px;padding:20px 18px 15px;box-shadow:0 3px 7px #12233f0b;min-width:0;transition:border-color .2s,box-shadow .2s}.account.selected{border-color:#3163ff;box-shadow:0 0 0 1px #3163ff,0 5px 12px #2453db12}.account-head{display:flex;align-items:center;gap:10px;margin-bottom:21px}.account-email{font-size:1rem;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;color:#192238}
.plan{flex-shrink:0;margin-left:auto;border:1px solid #7ddfbc;background:linear-gradient(#c3ffec,#78e8d0);color:#116a56;border-radius:16px;font-size:.75rem;padding:3px 11px;letter-spacing:.06em;font-weight:600;box-shadow:0 2px 4px #09a88916}.plan.unknown{background:#eef2f8;border-color:#d4ddea;color:#62728a;letter-spacing:0}.account-team{font-size:.875rem;color:#687b95;display:flex;align-items:center;gap:6px;flex-wrap:wrap;line-height:1.7}.chip{font-size:.75rem;border:1px solid #c3d4ff;border-radius:15px;color:#285cff;background:#ecf1ff;padding:2px 9px;display:inline-flex;align-items:center;gap:4px;line-height:1.4}.chip .icon{width:13px;height:13px}
.credential-chips{display:flex;gap:6px;margin:8px 0 14px;flex-wrap:wrap}.credential-chips>span,.credential-chips button{border:1px solid #d5dfea;border-radius:15px;background:#eef2f8;color:#64758c;padding:3px 9px;font-size:.75rem;gap:4px}.credential-chips .icon{width:13px;height:13px}.account-id{font-size:.75rem;color:#657791;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:18px}
.quota-block{margin-bottom:10px}.quota-title{display:flex;justify-content:space-between;align-items:center;font-size:.875rem;font-weight:650;color:#51647f}.quota-value{color:#16be62}.quota-value.low{color:#ec9d15}.progress-track{margin:8px 0 5px;height:5px;border-radius:10px;background:#eaf0f7;overflow:hidden}.progress-fill{height:100%;background:#16c467;border-radius:10px}.progress-fill.low{background:#f3a112}.quota-reset{font-size:.75rem;color:#91a2bd}
.quota-unknown{height:110px;display:flex;flex-direction:column;justify-content:center;background:#f1f5fa;border-radius:13px;text-align:center;margin-bottom:15px;gap:8px;padding:12px}.quota-unknown strong{color:#687b95;font-size:.875rem}.quota-unknown p{color:#96a3b7;font-size:.75rem;margin:0;line-height:1.6}
.subscription{display:flex;align-items:center;gap:8px;color:#0b8d71;background:#e7f6f2;border:1px solid #aaead9;border-radius:10px;padding:13px 11px;margin-top:17px;flex-wrap:wrap;font-size:.875rem}.subscription .icon{width:17px;height:17px}.subscription strong{font-weight:600}.subscription small{margin-left:auto;color:#637f87;font-size:.75rem}.subscription.unknown{background:#f1f4f8;border-color:#e0e6ef;color:#708199}
.sync-error{font-size:.75rem;color:#bc7740;margin:10px 0 0;line-height:1.5}.account-note{font-size:.75rem;color:#68809d;margin-top:10px;white-space:pre-wrap;overflow-wrap:anywhere}.tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}.tags .chip{color:#63728a;background:#f0f3f7;border-color:#e1e7f0}.account-time{font-size:.75rem;color:#8b9aaf;margin:17px 0 10px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.card-actions{border-top:1px solid #e5eaf1;padding-top:13px;display:flex;justify-content:flex-end;gap:7px}.card-actions button{width:35px;height:35px;border:0;border-radius:11px;background:#eef3f9;padding:8px;color:#536981}.card-actions button .icon{width:18px;height:18px}.card-actions button.danger:hover{color:#d94848;background:#ffeeee}
.cards.list{grid-template-columns:1fr}.cards.list .account{display:grid;grid-template-columns:minmax(180px,1fr) 1fr 1fr;gap:10px 24px}.cards.list .account-head{margin:0}.cards.list .quota-block{margin:0}.cards.list .account-team,.cards.list .credential-chips,.cards.list .account-id,.cards.list .account-note,.cards.list .tags{grid-column:1}.cards.list .quota-area{grid-column:2;grid-row:1/5}.cards.list .subscription{grid-column:3;grid-row:1/3;margin:0;align-self:start}.cards.list .card-actions{grid-column:3;grid-row:3/6}.cards.list .account-time{grid-column:2;margin:0}
.empty{display:flex;align-items:center;flex-direction:column;justify-content:center;background:#ffffff8f;border:1px dashed #cbd7e6;border-radius:24px;padding:90px 20px;min-height:400px;text-align:center}.empty>.icon{width:52px;height:52px;color:#a0b4d5;background:#eaf0fc;padding:10px;border-radius:16px}.empty h2{font-size:1.2rem;margin:22px 0 0}.empty p{font-size:.875rem;color:#8998ae;line-height:1.8;max-width:460px}.empty button{margin-top:10px}footer{display:flex;justify-content:space-between;color:#93a0b2;font-size:.75rem;margin-top:30px;padding:15px 3px}
.auth-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(at 20% 0,#dfe6fc,transparent 60%),radial-gradient(at 100% 10%,#d9f3ee,transparent 65%),#f0f4fa;padding:24px}.auth-card{background:#fffdfef0;border:1px solid #e0e6ef;border-radius:26px;padding:38px;width:min(420px,100%);box-shadow:0 20px 70px #22355b12}.auth-card h1{margin:26px 0 8px;font-size:1.6rem}.auth-card p{color:#8392a8;font-size:.875rem;line-height:1.7;margin-bottom:24px}.auth-card label{margin-top:17px}.auth-card button.primary{width:100%;padding:13px}.auth-foot{color:#9aa6b8;font-size:.75rem;text-align:center;margin-top:26px}
label.form-field,.auth-card label{display:flex;flex-direction:column;gap:8px;font-size:.875rem;color:#556883}input:not([type=checkbox]),textarea{border:1px solid #d6dfea;border-radius:10px;background:#f6f8fc;padding:12px;color:#233650;max-width:100%}.auth-card input{width:100%}.form-error{color:#c84c4c!important;font-size:.8rem!important;min-height:0;margin:12px 0!important}
dialog{border:1px solid #d5dfec;border-radius:22px;background:#fff;box-shadow:0 28px 90px #16305836;width:min(590px,calc(100% - 28px));padding:24px;color:#1c2a40;max-height:90vh;overflow:auto}dialog::backdrop{background:#13213c62;backdrop-filter:blur(4px)}.modal-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.modal-heading h2{font-size:1.2rem;margin:0}.modal-heading button{width:33px;height:33px;border:0;background:#f1f4f8}
#modal-content p{font-size:.875rem;color:#6e8098;line-height:1.8}#modal-content form{display:grid;gap:16px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-row>*{min-width:0}.form-field textarea{resize:vertical;width:100%;line-height:1.7}.modal-actions{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #edf0f5;margin-top:6px;padding-top:18px}.tabs{display:flex;gap:8px;margin-bottom:19px}.tabs button{flex:1;background:#f5f7fb}.tabs button.active{color:#285cff;background:#edf2ff;border-color:#b4c8ff}
.help{font-size:.75rem;color:#8b9ab1;line-height:1.8}.help code{font-size:.75rem;background:#f1f4f8;padding:3px 5px;border-radius:4px}.notice{background:#edf3ff;padding:13px 15px;border-radius:12px;color:#587395;font-size:.8rem;line-height:1.9}.otp-code{font-size:2.8rem;letter-spacing:.2em;text-align:center;font-family:ui-monospace,monospace;font-weight:650;color:#285cff;margin:26px 0 8px}.otp-timer{text-align:center;color:#7c90aa;font-size:.875rem;margin-bottom:22px}.password-value{font-family:ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere;background:#f1f5fb;border-radius:12px;padding:18px;user-select:all}.danger-text{color:#c55252!important}
#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);z-index:30;background:#24334d;color:#fff;padding:13px 21px;border-radius:12px;box-shadow:0 5px 20px #101e3630;font-size:.875rem;max-width:90%;line-height:1.6}.busy .icon{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:1600px){main{padding:35px 40px}.account{padding:23px 20px}.toolbar{padding:20px}}
@media(max-width:1400px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.toolbar{flex-wrap:wrap}.search-box{flex:1;min-width:180px}.toolbar-actions{margin-left:auto}}
@media(max-width:950px){.sidebar{width:190px;padding:24px 10px}.brand{gap:8px;padding-left:2px}.brand strong{font-size:.9rem}.brand-mark{width:40px;height:40px;border-radius:12px}main{margin-left:190px;padding:22px 18px}.cards{gap:15px}.account{padding:17px 14px}.batch-actions button{padding:10px}.batch-actions .icon{display:none}.selection-bar{padding:14px}.count-pill{display:none}.cards.list .account{display:block}.cards.list .account-head{margin-bottom:18px}.cards.list .quota-area{margin-top:18px}.cards.list .subscription{margin-top:15px}.cards.list .card-actions{margin-top:15px}.cards.list .account-time{margin-top:15px}}
@media(max-width:740px){
 .sidebar{position:sticky;top:0;width:100%;padding:8px 13px;background:#e7edf8ed;backdrop-filter:blur(16px);flex-direction:row;align-items:center;border:0;border-bottom:1px solid #d7dfeb;gap:10px}.brand{padding:0;border:0}.brand strong{display:none}.brand-mark{width:35px;height:35px}.brand-mark svg{width:22px;height:22px}nav{display:flex;margin:0;gap:3px;flex:1;justify-content:flex-end}nav button{width:auto;gap:5px;padding:9px 8px;font-size:.75rem}nav button .icon{width:18px;height:18px}.nav-count{display:none}nav button[data-nav=other],nav button[data-nav=all]{display:none}
 .sidebar-bottom{margin:0;padding:0;border:0;display:flex;gap:4px}.sidebar-bottom>button{padding:8px;width:33px;font-size:0;gap:0}.sidebar-bottom .icon{width:19px;height:19px}.server-label{display:none}main{margin:0;padding:20px 15px}.page-heading{margin-bottom:18px}h1{font-size:1.35rem}.eyebrow{font-size:.625rem}.private-badge{font-size:.7rem}.toolbar{padding:12px;border-radius:17px;gap:8px}.search-box{width:calc(100% - 90px);padding:11px}.toolbar select{max-width:none;flex:1;font-size:.75rem;padding:10px 7px}.toolbar-actions{gap:7px;flex-shrink:0}.toolbar-actions button{width:34px;height:36px;border-radius:10px;padding:8px}.view-switch button{width:30px}
 .selection-bar{margin-top:15px;padding:12px 10px;border-radius:15px;gap:6px}.batch-actions{gap:5px}.batch-actions button{font-size:.75rem;padding:9px 7px;border-radius:9px}.select-all{font-size:.75rem;gap:6px}#selected-count{display:none}.sync-caption{font-size:.6875rem;margin:14px 1px}.cards{grid-template-columns:1fr;gap:16px}.account{padding:20px;border-radius:19px}.account-head{margin-bottom:20px}.card-actions button{width:38px;height:38px}.empty{padding:60px 20px;min-height:350px}footer{gap:10px;line-height:1.8;flex-direction:column;margin-top:18px}dialog{padding:20px}.form-row{grid-template-columns:1fr}.auth-card{padding:30px}.otp-code{font-size:2.2rem}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.authorization-status{margin:18px 0;padding:15px;border:1px solid #d4e0f5;background:#f4f7fd;border-radius:12px;font-size:.875rem;line-height:1.7;color:#567293}
.authorization-link{display:inline-flex;align-items:center;background:#285cff;color:white;text-decoration:none;border-radius:12px;padding:10px 14px;font-size:.875rem}
.authorization-fallback{margin-top:22px;border-top:1px solid #e5eaf1;padding-top:16px;font-size:.875rem;color:#7285a0}.authorization-fallback summary{cursor:pointer;margin-bottom:16px}.authorization-fallback form{margin-top:10px}
#device-code{letter-spacing:.1em;font-size:2rem;overflow-wrap:anywhere}#device-expiry{text-align:center}#device-instructions .modal-actions{flex-wrap:wrap}
