:root { color-scheme: light; --ink:#171719; --muted:#6f7078; --line:#dfe0e5; --blue:#2f55d4; --blue-dark:#223fa3; --soft:#f4f5f8; }
* { box-sizing:border-box; }
html { background:#fff; }
body { min-height:100vh; margin:0; color:var(--ink); background:radial-gradient(circle at 12% 8%,rgba(47,85,212,.14),transparent 31%),radial-gradient(circle at 92% 88%,rgba(17,128,83,.1),transparent 27%),#f6f7f9; font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif; }
.toolbox-login-page { background:transparent; }
.login-shell { width:min(1050px,calc(100% - 36px)); min-height:100vh; margin:auto; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:72px; padding:54px 0; }
.brand-mark { width:54px; height:54px; display:grid; place-items:center; border-radius:17px; color:#fff; background:var(--ink); font-size:23px; font-weight:800; box-shadow:0 16px 28px rgba(0,0,0,.15); }
.eyebrow { margin:38px 0 12px; color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.16em; }
.login-intro h1 { margin:0; font-size:clamp(58px,8vw,92px); line-height:.98; letter-spacing:-.065em; }
.subtitle { max-width:560px; margin:24px 0 0; color:#3e4047; font-size:21px; line-height:1.6; }
.privacy-card { max-width:530px; margin-top:42px; padding:18px 20px; border:1px solid rgba(47,85,212,.16); border-radius:16px; background:rgba(255,255,255,.55); }
.privacy-card strong { font-size:13px; }
.privacy-card p { margin:7px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }
.privacy-note-prefix { display:none; }
.product-heading-group,.login-action-group { display:contents; }
.mobile-login-trigger { display:none; }
.login-sheet-layer { display:contents; }
.login-sheet-backdrop { display:none; }
.login-card { padding:38px; border:1px solid rgba(0,0,0,.09); border-radius:26px; background:rgba(255,255,255,.94); box-shadow:0 30px 80px rgba(29,34,54,.12); backdrop-filter:blur(18px); }
.step-label { color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.1em; }
.login-card h2 { margin:8px 0 4px; font-size:31px; letter-spacing:-.035em; }
.login-card header p { margin:0; color:var(--muted); font-size:14px; }
.method-tabs { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin:28px 0 22px; padding:4px; border-radius:12px; background:var(--soft); }
.method-tab { padding:10px; border:0; border-radius:9px; color:var(--muted); background:transparent; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.method-tab.active { color:var(--ink); background:#fff; box-shadow:0 2px 7px rgba(0,0,0,.08); }
.login-form { display:grid; gap:16px; }
.login-form[hidden] { display:none; }
.login-form label { display:grid; gap:7px; font-size:12px; font-weight:700; }
.login-form input { width:100%; padding:13px 14px; border:1px solid #cfd1d8; border-radius:11px; outline:none; background:#fff; font:inherit; font-size:14px; }
.login-form input:focus { border-color:var(--blue); box-shadow:0 0 0 4px rgba(47,85,212,.11); }
.code-row { display:grid; grid-template-columns:1fr auto; align-items:end; gap:9px; }
.primary-btn,.secondary-btn,.google-btn { min-height:46px; display:flex; align-items:center; justify-content:center; border-radius:11px; font:inherit; font-size:14px; font-weight:750; text-decoration:none; cursor:pointer; }
.primary-btn { border:0; color:#fff; background:var(--blue); }
.primary-btn:hover { background:var(--blue-dark); }
.secondary-btn { padding:0 15px; border:1px solid var(--line); background:#fff; color:var(--ink); }
.secondary-btn:disabled { color:#aaa; cursor:not-allowed; }
.divider { display:flex; align-items:center; gap:12px; margin:23px 0; color:#96979d; font-size:11px; }
.divider::before,.divider::after { content:""; height:1px; flex:1; background:var(--line); }
.google-btn { width:100%; gap:12px; border:1px solid var(--line); color:var(--ink); background:#fff; }
.google-btn.disabled { color:#999; background:#f8f8f9; cursor:not-allowed; }
.google-g { font-size:17px; font-weight:900; color:#4285f4; }
.login-form small { color:var(--muted); line-height:1.5; }
.form-message { min-height:20px; margin:15px 0 0; color:#b42318; font-size:12px; text-align:center; }
.form-message.success { color:#137a45; }
.admin-login-form { margin-top:28px; }
.admin-not-configured { margin-top:28px; padding:14px; border-radius:11px; color:#b42318; background:#fff0ee; font-size:12px; line-height:1.6; }
.admin-back-link { display:block; margin-top:8px; color:var(--muted); font-size:12px; text-align:center; text-decoration:none; }
.admin-back-link:hover { color:var(--blue); }
.login-footer { display:flex; justify-content:center; gap:12px; padding:0 18px 24px; color:#85868d; font-size:11px; }
.login-footer a { color:inherit; text-decoration:none; }
.login-footer a:hover { color:var(--ink); text-decoration:underline; }
@media (max-width:800px) {
    .login-shell { grid-template-columns:1fr; gap:36px; padding:34px 0; }
    .login-intro h1 { font-size:58px; }
    .privacy-card { margin-top:24px; }

    html { width:100%; height:100%; overflow:hidden; overscroll-behavior:none; background:#fff; }
    .toolbox-login-page { position:fixed; inset:0; width:100%; height:100dvh; min-height:100%; display:flex; flex-direction:column; overflow:hidden; overscroll-behavior:none; background:transparent; }
    .toolbox-login-page .login-shell { width:min(100% - 36px,560px); min-height:0; flex:1; display:flex; align-items:center; justify-content:center; margin:0 auto; padding:calc(env(safe-area-inset-top) + 14px) 0 12px; }
    .toolbox-login-page .login-intro { width:100%; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; touch-action:none; }
    .toolbox-login-page .brand-mark { width:46px; height:46px; border-radius:15px; font-size:19px; box-shadow:0 13px 25px rgba(0,0,0,.14); }
    .toolbox-login-page .product-heading-group,.toolbox-login-page .login-action-group { display:flex; flex-direction:column; align-items:center; }
    .toolbox-login-page .eyebrow { margin:clamp(15px,2.8dvh,24px) 0 8px; font-size:10px; }
    .toolbox-login-page .login-intro h1 { font-size:clamp(50px,14vw,66px); }
    .toolbox-login-page .subtitle { max-width:360px; margin-top:clamp(12px,2.1dvh,18px); font-size:16px; line-height:1.55; }
    .toolbox-login-page .login-action-group { margin-top:clamp(44px,6.5dvh,66px); }
    .toolbox-login-page .mobile-login-trigger { width:auto; min-width:174px; min-height:46px; margin-top:0; padding:0 13px 0 20px; display:flex; align-items:center; justify-content:center; gap:13px; border:0; border-radius:999px; color:#fff; background:var(--ink); box-shadow:0 12px 26px rgba(18,20,28,.2); font:inherit; font-size:14px; font-weight:780; cursor:pointer; }
    .toolbox-login-page .mobile-login-trigger i { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.14); font-size:12px; font-style:normal; }
    .toolbox-login-page .privacy-card { width:min(100%,360px); margin-top:10px; padding:0; border:0; border-radius:0; background:transparent; }
    .toolbox-login-page .privacy-card strong { display:none; }
    .toolbox-login-page .privacy-card p { margin:0; color:#8b8e93; font-size:8px; line-height:1.5; text-align:center; }
    .toolbox-login-page .privacy-note-prefix { display:inline; }
    .toolbox-login-page .login-sheet-layer { position:fixed; inset:0; z-index:100; display:block; visibility:hidden; pointer-events:none; transition:visibility 0s linear 520ms; }
    .toolbox-login-page .login-sheet-backdrop { position:absolute; inset:0; width:100%; height:100%; display:block; padding:0; border:0; opacity:0; background:rgba(2,4,8,.58); -webkit-backdrop-filter:blur(18px) saturate(.72); backdrop-filter:blur(18px) saturate(.72); transition:opacity 440ms cubic-bezier(.4,0,.2,1); cursor:default; }
    .toolbox-login-page .login-sheet-panel { position:absolute; right:0; bottom:0; left:0; width:100%; max-height:min(84dvh,720px); margin:0; padding:30px 22px calc(22px + env(safe-area-inset-bottom)); overflow-y:auto; overscroll-behavior:contain; border:0; border-radius:28px 28px 0 0; opacity:.86; background:rgba(252,252,253,.97); box-shadow:0 -28px 80px rgba(0,0,0,.3); transform:translate3d(0,calc(100% + 24px),0); transition:transform 520ms cubic-bezier(.4,0,.2,1),opacity 420ms cubic-bezier(.4,0,.2,1); outline:none; will-change:transform,opacity; }
    .toolbox-login-page .login-sheet-panel::before { content:""; width:38px; height:4px; display:block; margin:-14px auto 19px; border-radius:999px; background:#d2d3d8; }
    .toolbox-login-page.login-sheet-open .login-sheet-layer { visibility:visible; pointer-events:auto; transition-delay:0s; }
    .toolbox-login-page.login-sheet-open .login-sheet-backdrop { opacity:1; }
    .toolbox-login-page.login-sheet-open .login-sheet-panel { opacity:1; transform:translate3d(0,0,0); }
    .toolbox-login-page .login-card h2 { font-size:28px; }
    .toolbox-login-page .method-tabs { margin:22px 0 18px; }
    .toolbox-login-page .login-form input { font-size:16px; }
    .toolbox-login-page .login-footer { position:relative; z-index:1; flex:none; flex-wrap:wrap; padding:8px 16px calc(12px + env(safe-area-inset-bottom)); touch-action:none; }
}
@media (max-width:480px) {
    .login-shell { width:min(100% - 24px,1050px); }
    .login-card { padding:25px 20px; border-radius:20px; }
    .code-row { grid-template-columns:1fr; }
    .secondary-btn { min-height:42px; }
    .login-footer { flex-direction:column; align-items:center; gap:4px; }
    .toolbox-login-page .login-shell { width:min(100% - 32px,560px); }
    .toolbox-login-page .login-sheet-panel { padding:27px 18px calc(18px + env(safe-area-inset-bottom)); border-radius:25px 25px 0 0; }
}
@media (max-width:800px) and (max-height:700px) {
    .toolbox-login-page .brand-mark { width:40px; height:40px; border-radius:13px; font-size:17px; }
    .toolbox-login-page .eyebrow { margin-top:11px; }
    .toolbox-login-page .login-intro h1 { font-size:46px; }
    .toolbox-login-page .subtitle { margin-top:9px; font-size:14px; }
    .toolbox-login-page .login-action-group { margin-top:30px; }
    .toolbox-login-page .mobile-login-trigger { min-height:42px; }
    .toolbox-login-page .privacy-card { margin-top:8px; padding:0; }
    .toolbox-login-page .login-footer { padding-top:4px; font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
    .toolbox-login-page .login-sheet-layer,
    .toolbox-login-page .login-sheet-backdrop,
    .toolbox-login-page .login-sheet-panel { transition-duration:1ms !important; }
}