﻿:root{font-family:Inter,"Microsoft YaHei",Arial,sans-serif;color:#263240;background:#f3f6fa;font-synthesis:none;}
*{box-sizing:border-box;}
html,body{min-height:100%;margin:0;}
body{background:#f3f6fa;}
a{color:#1769d2;text-decoration:none;}
button,input{font:inherit;}
/* 侧栏 */
.sidebar{position:fixed;top:0;bottom:0;left:0;width:230px;color:#d9e4f2;padding:24px 18px;background:#142338;overflow:auto;}
.brand{display:flex;align-items:center;gap:12px;color:#fff;font-size:18px;margin-bottom:32px;}
.brand>span{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;color:#fff;font-weight:800;background:#2877e8;border-radius:11px;}
.nav{display:flex;flex-direction:column;gap:7px;}
.nav>a{display:block;color:#b8c7d9;padding:12px 14px;border-radius:8px;}
.nav>a:hover{color:#fff;background:#203652;}
/* 主体 */
.main{min-height:100vh;margin-left:230px;}
.header{display:flex;align-items:center;justify-content:space-between;height:72px;padding:0 30px;background:#fff;border-bottom:1px solid #e2e8f0;}
.header>div{display:flex;flex-direction:column;gap:3px;}
.header>div>span{color:#8894a3;font-size:12px;}
.header>form{display:flex;align-items:center;gap:15px;}
.content{padding:28px 30px 50px;}
.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;}
.page-head h1{font-size:25px;margin:0 0 6px;}
.page-head p{color:#718096;margin:0;}
.panel{margin-bottom:22px;padding:22px;background:#fff;border:1px solid #e4eaf2;border-radius:12px;box-shadow:0 3px 16px rgba(22,40,66,.04);}
.panel-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.panel-title h2{font-size:17px;margin:0;}
/* 按钮 */
.btn{display:inline-flex;align-items:center;justify-content:center;height:38px;color:#334155;cursor:pointer;padding:0 18px;background:#fff;border:1px solid #cfd8e5;border-radius:7px;}
.btn:hover{background:#f7f9fc;}
.btn.primary{color:#fff;background:#2877e8;border-color:#2877e8;}
.btn.small{height:30px;font-size:13px;padding:0 12px;}
.btn.full{width:100%;}
.link-button{color:#1769d2;cursor:pointer;padding:0;background:none;border:0;}
/* 统计 */
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px;}
.stat{display:flex;flex-direction:column;gap:12px;padding:22px;background:#fff;border:1px solid #e4eaf2;border-radius:12px;}
.stat>span{color:#718096;font-size:13px;}
.stat>b{font-size:30px;}
.text-success{color:#15966d;}
/* 表格 */
.table-wrap{overflow:auto;}
table{width:100%;border-collapse:collapse;}
th{color:#64748b;font-size:12px;font-weight:600;text-align:left;padding:11px 12px;background:#f7f9fc;border-bottom:1px solid #e5eaf1;white-space:nowrap;}
td{font-size:14px;padding:13px 12px;border-bottom:1px solid #edf1f6;vertical-align:middle;}
td>small{display:block;color:#8a96a5;margin-top:4px;}
td.empty{color:#8a96a5;text-align:center;padding:35px;}
code{font-family:Consolas,monospace;font-size:12px;word-break:break-all;}
.status{display:inline-flex;align-items:center;min-height:26px;color:#42526a;font-size:12px;padding:3px 9px;background:#edf2f7;border-radius:20px;white-space:nowrap;}
.status.ok{color:#087955;background:#ddf8ee;}
.status.off{color:#687386;background:#edf0f4;}
/* 表单 */
.form-panel{max-width:980px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.form-grid>div{display:flex;flex-direction:column;gap:7px;}
label{color:#415168;font-size:13px;font-weight:600;}
input{width:100%;height:40px;padding:0 12px;background:#fff;border:1px solid #cbd5e1;border-radius:7px;outline:none;}
input:focus{border-color:#2877e8;box-shadow:0 0 0 3px rgba(40,119,232,.1);}
input[readonly]{color:#7b8797;background:#f2f5f8;}
.field-validation-error,.validation{color:#c43e3e;font-size:12px;}
.checkbox{display:flex;align-items:center;gap:8px;margin:22px 0;}
.checkbox>input{width:17px;height:17px;}
.form-actions{display:flex;gap:10px;padding-top:4px;}
.alert{margin-bottom:18px;padding:13px 16px;border-radius:8px;white-space:pre-line;}
.alert.success{color:#087955;background:#ddf8ee;}
.alert.warning{color:#7b5200;background:#fff3cf;}
.alert.danger{color:#a32626;background:#fde4e4;}
.alert pre{font-family:Consolas,monospace;white-space:pre-wrap;margin:8px 0 0;}
/* 登录 */
.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:25px;background:linear-gradient(135deg,#122033,#1d3d66);}
.login-card{width:390px;padding:34px;background:#fff;border-radius:15px;box-shadow:0 18px 60px rgba(0,0,0,.24);}
.login-logo{display:flex;align-items:center;justify-content:center;width:52px;height:52px;color:#fff;font-size:20px;font-weight:800;margin:0 auto 16px;background:#2877e8;border-radius:13px;}
.login-card h1{text-align:center;margin:0;}
.login-card>p{color:#788596;text-align:center;margin:8px 0 25px;}
.login-card>label{display:block;margin:14px 0 7px;}
.login-card>.btn{margin-top:22px;}
.login-card>small{display:block;color:#8a96a5;text-align:center;margin-top:18px;}
/* 详情 */
.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.detail-card{display:flex;flex-direction:column;gap:9px;}
.detail-card>span,.detail-card>small{color:#7a8797;font-size:12px;}
.detail-card>b{font-size:19px;}
.properties{display:grid;grid-template-columns:150px 1fr;gap:12px;margin:0;}
.properties dt{color:#718096;}
.properties dd{margin:0;}
.timeline{list-style:none;margin:0;padding:0;}
.timeline li{position:relative;display:flex;gap:14px;padding:0 0 20px;}
.timeline li:not(:last-child)::before{position:absolute;top:13px;bottom:0;left:5px;width:2px;background:#dce4ef;content:"";}
.timeline i{position:relative;width:12px;height:12px;margin-top:3px;background:#2877e8;border:3px solid #dceaff;border-radius:50%;z-index:1;}
.timeline li>div{display:flex;flex-direction:column;gap:5px;}
.timeline span{color:#8290a2;font-size:12px;}
.timeline p{margin:0;}
.error-panel{text-align:center;padding:60px 20px;}
@media (max-width:1100px){.detail-grid{grid-template-columns:1fr 1fr;}.stats-grid{grid-template-columns:1fr 1fr 1fr;}}
@media (max-width:767px){.sidebar{position:static;width:100%;}.main{margin-left:0;}.header{padding:0 18px;}.content{padding:20px 15px 40px;}.form-grid,.detail-grid,.stats-grid{grid-template-columns:1fr;}.page-head{align-items:flex-start;gap:15px;}.properties{grid-template-columns:1fr;}}
