*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%;font-family:"Microsoft YaHei","PingFang SC","Segoe UI",Arial,sans-serif;background:#f5f7fb;color:#1f2937}
body{font-size:14px;line-height:1.5}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.6}
.layout{display:flex;min-height:100vh}

/* 左侧导航 */
.sidebar{position:fixed;left:0;top:0;bottom:0;width:220px;background:#111827;color:#fff;padding:24px 14px;z-index:20}
.logo{height:42px;padding:0 14px;display:flex;align-items:center;font-size:20px;font-weight:700;letter-spacing:.5px;color:#fff}
.nav-title{padding:24px 14px 8px;color:#6b7280;font-size:12px}
.menu{display:flex;align-items:center;height:44px;margin:4px 0;padding:0 14px;border-radius:9px;color:#9ca3af;transition:background .18s,color .18s,transform .18s}
.menu:hover{background:#1f2937;color:#fff}
.menu.active{background:#2563eb;color:#fff;box-shadow:0 6px 18px rgba(37,99,235,.25)}

/* 页面主体 */
.main{width:calc(100% - 220px);margin-left:220px;padding:28px 32px 40px}
.page{width:100%;padding:28px 32px}

/* 页面标题 */
.header{min-height:66px;display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.header-title{font-size:25px;line-height:1.25;font-weight:700;color:#111827;letter-spacing:-.2px}
.header-subtitle{margin-top:6px;color:#9ca3af;font-size:13px}
.header-time{padding:9px 14px;background:#fff;border:1px solid #e5e7eb;border-radius:9px;color:#6b7280;font-size:13px;box-shadow:0 2px 8px rgba(15,23,42,.03)}

/* 统计卡片 */
.dashboard{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.dashboard.secondary{grid-template-columns:repeat(5,minmax(0,1fr));margin-top:18px}
.stat-card{position:relative;background:#fff;border:1px solid #e7ebf0;border-radius:14px;padding:22px 22px 20px;min-height:142px;box-shadow:0 4px 16px rgba(15,23,42,.035);overflow:hidden;transition:transform .18s,box-shadow .18s,border-color .18s}
.stat-card:hover{transform:translateY(-2px);border-color:#dbe3ec;box-shadow:0 8px 24px rgba(15,23,42,.07)}
.stat-card:before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:#2563eb}
.stat-card.compact{min-height:126px;padding:19px 20px}
.stat-label{color:#6b7280;font-size:13px}
.stat-value{margin-top:13px;font-size:29px;line-height:1.1;font-weight:700;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-card.compact .stat-value{font-size:25px}
.stat-value.money{font-size:27px}
.stat-value.success{color:#16a34a}
.stat-value.danger{color:#dc2626}
.stat-desc{margin-top:10px;color:#9ca3af;font-size:12px}

/* 快捷入口 */
.quick-panel{margin-top:22px;background:#fff;border:1px solid #e7ebf0;border-radius:14px;padding:22px;box-shadow:0 4px 16px rgba(15,23,42,.035)}
.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.panel-title{font-size:16px;font-weight:700;color:#111827}
.panel-desc{margin-top:5px;color:#9ca3af;font-size:12px}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.quick-item{display:flex;align-items:center;gap:13px;padding:15px;border:1px solid #edf0f4;border-radius:11px;background:#fafbfc;transition:border-color .18s,background .18s,transform .18s,box-shadow .18s}
.quick-item:hover{border-color:#cbd5e1;background:#fff;transform:translateY(-1px);box-shadow:0 5px 14px rgba(15,23,42,.05)}
.quick-icon{width:42px;height:42px;flex:0 0 42px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#eff6ff;color:#2563eb;font-size:12px;font-weight:700}
.quick-item strong{display:block;font-size:14px;color:#1f2937}
.quick-item span{display:block;margin-top:5px;color:#9ca3af;font-size:12px}

/* 通用面板 */
.panel{background:#fff;border:1px solid #e7ebf0;border-radius:14px;padding:22px;box-shadow:0 4px 16px rgba(15,23,42,.035)}
.box{background:#fff;border:1px solid #e7ebf0;border-radius:14px;padding:22px;box-shadow:0 4px 16px rgba(15,23,42,.035)}
.card{background:#fff;border:1px solid #e7ebf0;border-radius:14px;padding:20px;box-shadow:0 4px 16px rgba(15,23,42,.035);transition:box-shadow .18s,border-color .18s}
.card:hover{border-color:#dbe3ec;box-shadow:0 7px 22px rgba(15,23,42,.06)}
.title{font-size:20px;line-height:1.3;font-weight:700;color:#111827;margin-bottom:20px}

/* 搜索/操作栏 */
.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e7ebf0;border-radius:14px;padding:18px 20px;margin-bottom:18px;box-shadow:0 4px 16px rgba(15,23,42,.035)}
.search-box{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* 表单 */
input,select,textarea{border:1px solid #dfe4ea;background:#fff;color:#374151;border-radius:8px;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}
input::placeholder,textarea::placeholder{color:#b0b7c3}
input,select{height:40px;padding:0 12px}
textarea{padding:10px 12px;resize:vertical;min-height:90px}
input:hover,select:hover,textarea:hover{border-color:#cbd5e1}
input:focus,select:focus,textarea:focus{border-color:#60a5fa;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
input:disabled,select:disabled,textarea:disabled{background:#f8fafc;color:#9ca3af;cursor:not-allowed}

/* 按钮 */
button{height:40px;padding:0 17px;border:0;border-radius:8px;background:#2563eb;color:#fff;transition:background .18s,box-shadow .18s,transform .18s}
button:hover{background:#1d4ed8}
button:active{transform:translateY(1px)}
button.secondary{background:#f3f4f6;color:#374151;border:1px solid #e5e7eb}
button.secondary:hover{background:#e5e7eb}
button.danger{background:#dc2626;color:#fff}
button.danger:hover{background:#b91c1c}
button.success{background:#16a34a;color:#fff}
button.success:hover{background:#15803d}

/* 表格 */
table{width:100%;border-collapse:collapse}
thead th{height:48px;background:#f8fafc;color:#6b7280;font-size:13px;font-weight:600;text-align:left;padding:0 14px;border-bottom:1px solid #edf0f4}
tbody td{height:52px;border-bottom:1px solid #f0f2f5;padding:0 14px;color:#374151}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:#fafbfc}

/* 标签 */
.tag{display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:4px 9px;border-radius:999px;background:#f3f4f6;color:#6b7280;font-size:12px;line-height:1.2;white-space:nowrap}
.tag.success{background:#dcfce7;color:#15803d}
.tag.danger{background:#fee2e2;color:#b91c1c}
.tag.warning{background:#fef3c7;color:#b45309}
.tag.info{background:#dbeafe;color:#1d4ed8}

/* 详情/弹窗 */
.detail,.detail-box,.modal{display:none;position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:100}
.detail-content,.modal-box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:600px;max-width:calc(100% - 32px);max-height:85vh;overflow:auto;background:#fff;border-radius:14px;padding:24px;box-shadow:0 20px 50px rgba(0,0,0,.18)}
.detail-title{display:flex;align-items:center;justify-content:space-between;font-size:18px;font-weight:700;color:#111827;margin-bottom:20px}
.detail-title span{cursor:pointer;color:#9ca3af;transition:color .18s}
.detail-title span:hover{color:#374151}
.detail-row{padding:10px 0;border-bottom:1px solid #f0f2f5;line-height:1.5}
.detail-row:last-child{border-bottom:0}

/* 卡片列表 */
.card-list{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card-num{margin-top:10px;font-size:28px;font-weight:700;color:#111827}

/* 通用状态 */
.empty{padding:48px 20px;text-align:center;color:#9ca3af;font-size:13px}
.loading{padding:40px 20px;text-align:center;color:#9ca3af;font-size:13px}

/* 滚动条 */
::-webkit-scrollbar{width:7px;height:7px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:#94a3b8}

/* 响应式 */
@media(max-width:1200px){
.dashboard{grid-template-columns:repeat(2,1fr)}
.dashboard.secondary{grid-template-columns:repeat(3,1fr)}
.quick-grid{grid-template-columns:repeat(2,1fr)}
.card-list{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:800px){
.sidebar{width:72px;padding:16px 8px}
.logo{font-size:0;justify-content:center;padding:0}
.logo:after{content:"千";font-size:20px}
.nav-title{display:none}
.menu{font-size:0;justify-content:center;padding:0}
.main{width:calc(100% - 72px);margin-left:72px;padding:20px 16px 30px}
.page{padding:20px 16px 30px}
.header{align-items:flex-start}
.header-time{display:none}
.dashboard,.dashboard.secondary{grid-template-columns:1fr}
.quick-grid{grid-template-columns:1fr}
.card-list{grid-template-columns:1fr}
.toolbar{align-items:stretch}
.search-box{width:100%}
}
@media(max-width:560px){
.main{padding:16px 12px 24px}
.page{padding:16px 12px 24px}
.header{margin-bottom:18px}
.header-title{font-size:21px}
.header-subtitle{font-size:12px}
.stat-card{min-height:128px;padding:18px}
.stat-value{font-size:26px}
.panel,.quick-panel,.box,.card{padding:16px}
.toolbar{padding:14px}
input,select{width:100%}
.search-box{display:grid;grid-template-columns:1fr}
button{width:100%}
.detail-content,.modal-box{max-height:90vh;padding:18px}
}