*{box-sizing:border-box}
:root{
  --primary:#1677ff;--primary-soft:#eaf3ff;--text:#172033;--muted:#7a879b;
  --bg:#f4f7fb;--card:#fff;--line:#e9eef5;--danger:#d92d20;
  --shadow:0 10px 30px rgba(35,67,120,.08)
}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
body{min-height:100vh}
button,input{font:inherit}
.shell{width:100%;max-width:520px;min-height:100vh;margin:0 auto;padding-bottom:28px}
.head{
  position:sticky;top:0;z-index:20;display:grid;grid-template-columns:44px 1fr 44px;align-items:center;
  padding:calc(10px + env(safe-area-inset-top)) 14px 10px;background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--line);backdrop-filter:blur(16px)
}
.back{width:38px;height:38px;border:0;border-radius:12px;background:#f1f6fd;color:#263449;font-size:28px;line-height:1}
.head h1{font-size:18px;margin:0;text-align:center}.head p{display:none}
.main{padding:14px}
.loading,.empty,.error-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;text-align:center;color:var(--muted);box-shadow:var(--shadow)}
.error-card strong{display:block;color:#c0392b;margin-bottom:8px}
.login-btn,.primary-btn{border:0;border-radius:13px;background:var(--primary);color:#fff;padding:12px 16px;font-weight:700}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);background:#172033;color:#fff;padding:10px 14px;border-radius:99px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:99;max-width:88%;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}