/* 瓦特AI - 全局样式 v1.0.0 */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#f7f8fa; --card:#fff; --border:#e8e9ed; --text:#1f2329; --sub:#86909c;
  --primary:#4facfe; --primary2:#764ba2; --danger:#e74c3c; --ok:#1a7f37;
  --radius:12px; --shadow:0 2px 12px rgba(0,0,0,.06);
}
body{font-family:-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;background:var(--bg);color:var(--text);font-size:14px}
a{text-decoration:none;color:inherit}
button{font-family:inherit}

/* ===== 布局 ===== */
.layout{display:flex;min-height:100vh}
.sidebar{width:230px;background:#fff;border-right:1px solid var(--border);position:fixed;top:0;bottom:0;left:0;display:flex;flex-direction:column;z-index:20}
.sidebar .brand{padding:20px 22px 14px;display:flex;align-items:center;gap:10px}
.sidebar .brand .logo{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#4facfe,#764ba2);display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff}
.sidebar .brand b{font-size:17px}
.sidebar .nav{flex:1;overflow-y:auto;padding:8px 12px}
.sidebar .nav .group{font-size:12px;color:#b0b7c3;padding:12px 10px 6px}
.sidebar .nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;color:#3d4452;font-size:14px;margin-bottom:2px;transition:.15s}
.sidebar .nav a:hover{background:#f2f3f5}
.sidebar .nav a.active{background:linear-gradient(135deg,#4facfe,#764ba2);color:#fff;font-weight:600}
.sidebar .nav a .icon{width:22px;text-align:center}
.sidebar .user{margin:12px;padding:11px;border-radius:10px;background:#f7f8fa;display:flex;align-items:center;gap:10px;cursor:pointer}
.sidebar .user .avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#4facfe,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.sidebar .user .avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.main{margin-left:230px;flex:1;min-height:100vh;display:flex;flex-direction:column}

/* ===== 通用 ===== */
.page{max-width:1100px;width:100%;margin:0 auto;padding:28px 32px;flex:1}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 20px;border-radius:9px;border:none;cursor:pointer;font-size:14px;background:var(--primary);color:#fff;transition:.2s;font-weight:500}
.btn:hover{opacity:.88}
.btn-block{width:100%}
.btn-ghost{background:#fff;color:#4e5969;border:1px solid #dcdfe6}
.btn-danger{background:var(--danger)}
.btn-sm{padding:5px 12px;font-size:12px;border-radius:7px}
.btn-disabled{opacity:.5;cursor:not-allowed}
.input{width:100%;padding:11px 14px;border:1px solid #dcdfe6;border-radius:10px;font-size:14px;outline:none;background:#fff;transition:.2s}
.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(79,172,254,.12)}
textarea.input{resize:none}
.tag{display:inline-block;padding:3px 12px;border-radius:20px;background:#f2f3f5;color:#4e5969;font-size:12px;margin:3px 4px 3px 0;cursor:pointer;transition:.2s;border:1px solid transparent}
.tag.active{background:linear-gradient(135deg,#4facfe,#764ba2);color:#fff}
.tag.tag-small{padding:2px 9px;font-size:11px}
.empty{text-align:center;padding:60px 0;color:#b0b7c3}
.empty .big{font-size:44px;margin-bottom:12px}
.loading{text-align:center;padding:40px;color:#86909c}
.loading .spin{width:28px;height:28px;border:3px solid #e8e9ed;border-top-color:var(--primary);border-radius:50%;margin:0 auto 10px;animation:rot 1s linear infinite}
@keyframes rot{to{transform:rotate(360deg)}}
.toast{position:fixed;top:70px;left:50%;transform:translateX(-50%);background:rgba(31,35,41,.92);color:#fff;padding:10px 22px;border-radius:10px;font-size:14px;z-index:999;opacity:0;transition:.3s;pointer-events:none}
.toast.show{opacity:1}
.toast.err{background:rgba(231,76,60,.95)}
/* 弹窗 */
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:.2s}
.modal-mask.show{opacity:1;pointer-events:auto}
.modal{background:#fff;border-radius:16px;padding:30px;width:min(420px,92vw);position:relative;animation:pop .25s}
@keyframes pop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
.modal h3{font-size:18px;margin-bottom:18px}
.modal .close{position:absolute;top:14px;right:16px;font-size:20px;cursor:pointer;color:#999;border:none;background:none}
.modal .form-item{margin-bottom:16px}
.modal .form-item label{display:block;font-size:13px;color:#6b7280;margin-bottom:6px}
.modal .link{color:var(--primary);cursor:pointer;font-size:13px}
/* 表格 */
.mini-table{width:100%;border-collapse:collapse;font-size:13px}
.mini-table th{background:#fafbfc;text-align:left;padding:9px 12px;color:#86909c;border-bottom:1px solid var(--border)}
.mini-table td{padding:9px 12px;border-bottom:1px solid #f0f1f3}
/* 响应式 */
@media(max-width:900px){
  .sidebar{width:64px}
  .sidebar .brand b,.sidebar .nav .group,.sidebar .nav a span:last-child,.sidebar .user .info{display:none}
  .sidebar .nav a{justify-content:center}
  .main{margin-left:64px}
  .page{padding:16px}
}
/* 页脚 */
.footer{text-align:center;padding:18px;color:#b0b7c3;font-size:12px;border-top:1px solid var(--border);background:#fff}
/* 滚动条 */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-thumb{background:#d6d9e0;border-radius:3px}