/* ============================================================
   来源：views/master/index.html 内联 <style> 第 1 块（原位抽离，32 行）
   说明：在原位置以 <link rel="stylesheet"> 引入，来源顺序不变，
        层叠结果与抽离前逐字一致，不会引起样式变化。
   ============================================================ */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; background:#f7f4f0; color:#2c2b28; }
a { text-decoration:none; color:inherit; }
.page-hero { background:linear-gradient(135deg,#8a5a1f 0%,#b47a2a 50%,#d9a441 100%); color:#fff; padding:44px 0 40px; }
.page-hero .container { max-width:1180px; margin:0 auto; padding:0 20px; }
.page-hero h2 { font-size:1.9rem; margin-bottom:8px; }
.page-hero p { opacity:.92; font-size:.95rem; }
.page-hero .hero-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; }
.container { max-width:1180px; margin:0 auto; padding:20px 20px 60px; }
.btn { padding:7px 22px; border-radius:30px; border:1px solid #e0d8d0; background:#fff; cursor:pointer; font-size:.9rem; transition:.2s; display:inline-block; }
.btn:hover { border-color:#b47a2a; color:#b47a2a; background:#faf3e8; }
.btn-gold { background:#b47a2a; color:#fff; border-color:#b47a2a; }
.btn-gold:hover { background:#96631f; border-color:#96631f; color:#fff; }
.master-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:18px; }
.cat-bar { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.cat-tab { padding:8px 20px; border-radius:30px; background:#fff; border:1px solid #e8e0d8; cursor:pointer; font-size:.88rem; color:#555; transition:.2s; }
.cat-tab:hover { border-color:#b47a2a; color:#b47a2a; }
.cat-tab.active { background:#b47a2a; color:#fff; border-color:#b47a2a; }
.master-card { background:#fff; border:1px solid #e8e0d8; border-radius:16px; padding:24px; display:flex; gap:18px; transition:.25s; cursor:pointer; }
.master-card:hover { transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.08); border-color:#d9a441; }
.avatar { width:72px; height:72px; border-radius:50%; background:linear-gradient(135deg,#feeede,#fdf3e7); color:#b47a2a; display:flex; align-items:center; justify-content:center; font-size:1.7rem; font-weight:700; flex-shrink:0; border:2px solid #f0e2c8; }
.m-info { flex:1; min-width:0; }
.m-name { font-size:1.15rem; font-weight:700; display:flex; align-items:center; gap:8px; }
.m-name .tag { font-size:.68rem; background:#fdf0dd; color:#b47a2a; padding:2px 10px; border-radius:30px; font-weight:400; }
.m-fields { margin-top:8px; }
.m-fields .f { display:inline-block; font-size:.75rem; background:#f7f4f0; color:#666; padding:2px 10px; border-radius:30px; margin:0 6px 6px 0; }
.m-stats { display:flex; gap:18px; margin-top:10px; font-size:.8rem; color:#888; }
.m-stats .rating { color:#d9a441; font-weight:700; }
.m-intro { font-size:.82rem; color:#777; margin-top:10px; line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.login-tip { text-align:center; padding:60px 20px; }
.login-tip .icon { font-size:3rem; margin-bottom:12px; }
.login-tip .txt { color:#888; margin-bottom:16px; }