:root{
    --color-primary:#00D4FF;--color-secondary:#FF6B9D;--color-accent:#A855F7;
    --gradient-main:linear-gradient(135deg,var(--color-primary),var(--color-accent));
    --bg-dark:#0A0A0F;--bg-card:#12121A;--bg-card-hover:#1A1A25;--bg-sidebar:#0E0E18;
    --text-primary:#FFFFFF;--text-secondary:rgba(255,255,255,.7);--text-muted:rgba(255,255,255,.4);
    --border-color:rgba(255,255,255,.08);--border-hover:rgba(0,212,255,.35);
    --font-main:'Inter','PingFang SC','Microsoft YaHei',sans-serif;
    --font-mono:'JetBrains Mono','Consolas',monospace;
    --transition:.25s ease;--sidebar-w:240px;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--color-primary) var(--bg-dark)}
html::-webkit-scrollbar{width:6px}
html::-webkit-scrollbar-track{background:var(--bg-dark)}
html::-webkit-scrollbar-thumb{background:var(--color-primary);border-radius:3px}
body{font-family:var(--font-main);background:var(--bg-dark);color:var(--text-primary);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

/* ── 提示框 ── */
.alert{padding:12px 16px;border-radius:8px;font-size:13px;margin-bottom:16px;border:1px solid}
.alert-error{background:rgba(255,77,109,.08);border-color:rgba(255,77,109,.25);color:#FF4D6D}
.alert-success{background:rgba(0,230,118,.08);border-color:rgba(0,230,118,.25);color:#00E676}
.alert-info{background:rgba(0,212,255,.08);border-color:rgba(0,212,255,.2);color:var(--color-primary)}

/* ── 表单 ── */
.form-group{margin-bottom:16px}
.form-label{display:block;font-size:13px;color:var(--text-secondary);margin-bottom:7px;font-weight:500}
.input-wrap{position:relative}
.input-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-muted);display:flex;align-items:center}
.form-input{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--border-color);border-radius:8px;padding:12px 14px 12px 40px;font-size:14px;color:var(--text-primary);font-family:var(--font-main);transition:border-color var(--transition),box-shadow var(--transition);outline:none}
.form-input::placeholder{color:var(--text-muted)}
.form-input:focus{border-color:var(--color-primary);background:rgba(0,212,255,.04);box-shadow:0 0 0 3px rgba(0,212,255,.08)}
.form-input.error{border-color:#FF4D6D;box-shadow:0 0 0 3px rgba(255,77,109,.1)}
.form-hint{font-size:11px;margin-top:5px}
.form-hint.err{color:#FF4D6D}.form-hint.ok{color:var(--color-primary)}
textarea.form-input{padding-left:14px;resize:vertical}

/* ── 按钮 ── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;font-size:13px;font-weight:600;border-radius:8px;cursor:pointer;transition:all var(--transition);font-family:var(--font-main);border:none}
.btn-primary{background:var(--gradient-main);color:#0A0A0F;box-shadow:0 4px 16px rgba(0,212,255,.2)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,212,255,.3)}
.btn-outline{background:transparent;color:var(--text-secondary);border:1px solid var(--border-color)}
.btn-outline:hover{border-color:var(--border-hover);color:var(--text-primary)}
.btn-danger{background:rgba(255,77,109,.1);color:#FF4D6D;border:1px solid rgba(255,77,109,.25)}
.btn-danger:hover{background:rgba(255,77,109,.18)}
.btn-sm{padding:6px 14px;font-size:12px}
.btn-block{width:100%;justify-content:center;padding:13px}

/* ── 卡片 ── */
.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;overflow:hidden;margin-bottom:20px}
.card-header{padding:14px 20px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between}
.card-title{font-size:15px;font-weight:600;display:flex;align-items:center;gap:8px}
.card-title .dot{width:6px;height:6px;border-radius:50%;background:var(--gradient-main);display:inline-block}
.card-body{padding:20px}

/* ── 表格 ── */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{padding:10px 14px;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);border-bottom:1px solid var(--border-color);font-weight:600}
tbody td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.04);color:var(--text-secondary)}
tbody tr:hover td{background:rgba(255,255,255,.02)}
tbody tr:last-child td{border-bottom:none}

/* ── 徽章 ── */
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;font-size:11px;font-weight:600;border-radius:4px}
.badge-green{background:rgba(0,230,118,.1);border:1px solid rgba(0,230,118,.2);color:#00E676}
.badge-red{background:rgba(255,77,109,.1);border:1px solid rgba(255,77,109,.2);color:#FF4D6D}
.badge-cyan{background:rgba(0,212,255,.1);border:1px solid rgba(0,212,255,.2);color:var(--color-primary)}
.badge-gray{background:rgba(255,255,255,.06);border:1px solid var(--border-color);color:var(--text-muted)}
.badge-purple{background:rgba(168,85,247,.1);border:1px solid rgba(168,85,247,.2);color:var(--color-accent)}

/* ── layout ── */
.layout{display:flex;min-height:100vh}
.sidebar{width:var(--sidebar-w);background:var(--bg-sidebar);border-right:1px solid var(--border-color);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:100;overflow-y:auto}
.sidebar-logo{display:flex;align-items:center;gap:10px;padding:22px 20px 18px;border-bottom:1px solid var(--border-color)}
.sidebar-logo img{width:30px;height:30px;object-fit:contain}
.sidebar-logo .logo-text{font-size:14px;font-weight:700;background:var(--gradient-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sidebar-nav{flex:1;padding:12px 0}
.nav-section{padding:8px 20px 4px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-muted)}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 20px;font-size:13px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition);border-left:2px solid transparent;text-decoration:none}
.nav-item:hover{color:var(--text-primary);background:rgba(255,255,255,.04)}
.nav-item.active{color:var(--color-primary);background:rgba(0,212,255,.06);border-left-color:var(--color-primary)}
.nav-item svg{flex-shrink:0;opacity:.7}
.nav-item.active svg{opacity:1}
.sidebar-footer{padding:14px 20px;border-top:1px solid var(--border-color)}
.main{margin-left:var(--sidebar-w);flex:1;padding:28px 32px;min-height:100vh}
.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.page-title{font-size:20px;font-weight:700}
.page-sub{font-size:13px;color:var(--text-muted);margin-top:2px}
.topbar-actions{display:flex;gap:10px}

/* ── 登录/注册页 ── */
.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 24px}
.bg-orbs{position:fixed;inset:0;pointer-events:none;z-index:0}
.orb{position:absolute;border-radius:50%;filter:blur(120px)}
.orb-1{width:500px;height:500px;background:var(--color-primary);opacity:.08;top:-150px;right:-100px}
.orb-2{width:400px;height:400px;background:var(--color-accent);opacity:.07;bottom:-100px;left:-100px}
.orb-3{width:300px;height:300px;background:var(--color-secondary);opacity:.05;top:50%;left:50%;transform:translate(-50%,-50%)}
.auth-wrapper{position:relative;z-index:1;width:100%;max-width:420px}
.auth-topbar{text-align:center;margin-bottom:14px}
.system-tag{display:inline-block;padding:5px 14px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:2px;color:var(--color-primary);background:rgba(0,212,255,.08);border:1px solid rgba(0,212,255,.18);border-radius:20px}
.auth-logo{text-align:center;margin-bottom:24px}
.auth-logo .logo-icon{width:50px;height:50px;object-fit:contain;margin:0 auto 10px;display:block;animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.auth-logo .brand-name{font-size:20px;font-weight:700;background:var(--gradient-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.auth-logo .brand-sub{font-size:12px;color:var(--text-muted);letter-spacing:2px;margin-top:3px}
.auth-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:32px;box-shadow:0 24px 60px rgba(0,0,0,.4)}
.auth-title{font-size:19px;font-weight:600;margin-bottom:4px}
.auth-desc{font-size:13px;color:var(--text-muted);margin-bottom:24px}
.auth-footer{text-align:center;font-size:13px;color:var(--text-muted);margin-top:18px}
.auth-footer a{color:var(--color-primary);font-weight:600}
.input-eye{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;transition:color var(--transition)}
.input-eye:hover{color:var(--color-primary)}

/* ── 统计行 ── */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.stat-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:16px 18px;transition:all var(--transition)}
.stat-card:hover{border-color:var(--border-hover);transform:translateY(-2px)}
.stat-card .s-label{font-size:11px;color:var(--text-muted);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}
.stat-card .s-value{font-size:24px;font-weight:700;background:var(--gradient-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.stat-card .s-desc{font-size:11px;color:var(--text-muted);margin-top:4px}

/* ── 分页 ── */
.pagination{display:flex;gap:6px;align-items:center;margin-top:16px}
.page-btn{padding:6px 12px;font-size:12px;border-radius:6px;border:1px solid var(--border-color);background:transparent;color:var(--text-muted);cursor:pointer;transition:all var(--transition);font-family:var(--font-main)}
.page-btn:hover{border-color:var(--border-hover);color:var(--text-primary)}
.page-btn.active{background:rgba(0,212,255,.12);border-color:var(--color-primary);color:var(--color-primary)}

@media(max-width:900px){.stats-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.sidebar{transform:translateX(-100%)}.main{margin-left:0}.stats-row{grid-template-columns:1fr 1fr}}