:root { --pri:#1e6fff; --ok:#16a34a; --err:#dc2626; --warn:#d97706; --bg:#f4f6fa; }
* { box-sizing: border-box; }
body { margin:0; font:14px/1.6 "Microsoft YaHei",system-ui,sans-serif; background:var(--bg); color:#1f2937; }
.login-page { display:flex; min-height:100vh; align-items:center; justify-content:center; }
.login-box { background:#fff; padding:36px; border-radius:12px; width:340px; box-shadow:0 8px 30px rgba(0,0,0,.12); }
.login-box h2 { text-align:center; margin-top:0; color:var(--pri); }
.login-box input, .login-box button { width:100%; padding:10px; margin-bottom:12px; border:1px solid #d1d5db; border-radius:8px; font-size:14px; }
.login-box button { background:var(--pri); color:#fff; border:0; cursor:pointer; }
.topbar { background:#fff; border-bottom:1px solid #e5e7eb; padding:0 20px; display:flex; align-items:center; gap:24px; height:52px; position:sticky; top:0; z-index:5; }
.topbar .brand { font-weight:700; color:var(--pri); white-space:nowrap; }
.topbar nav { flex:1; display:flex; gap:4px; overflow-x:auto; }
.topbar nav a { padding:6px 12px; border-radius:8px; color:#374151; text-decoration:none; white-space:nowrap; }
.topbar nav a.active, .topbar nav a:hover { background:#eef4ff; color:var(--pri); }
.topbar .userbox { display:flex; gap:12px; align-items:center; }
.container { max-width:1400px; margin:20px auto; padding:0 16px; }
h1 { font-size:20px; } h2 { font-size:16px; margin:20px 0 8px; }
table { width:100%; border-collapse:collapse; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,.06); }
th, td { padding:8px 10px; border-bottom:1px solid #f1f5f9; text-align:left; vertical-align:top; }
th { background:#f8fafc; font-weight:600; color:#475569; white-space:nowrap; }
tr:hover td { background:#f8fbff; }
.empty { text-align:center; color:#9ca3af; padding:24px; }
.row-active { background:#f0fdf4 !important; }
.cards { display:flex; gap:12px; flex-wrap:wrap; }
.card { background:#fff; border-radius:10px; padding:14px 22px; min-width:120px; box-shadow:0 1px 4px rgba(0,0,0,.06); text-align:center; }
.card b { display:block; font-size:24px; color:var(--pri); }
.card.ok b { color:var(--ok); } .card.err b { color:var(--err); } .card.warn b { color:var(--warn); }
.card span { color:#6b7280; font-size:12px; }
button.card { border:none; font:inherit; cursor:pointer; }
a.card { text-decoration:none; }
.card:hover { box-shadow:0 2px 8px rgba(0,0,0,.14); }
.dlg table { margin:10px 0; }
.tpl-table { table-layout:fixed; }
.tpl-table td, .tpl-table th { word-break:break-all; overflow:hidden; }
.grid-form input, .grid-form select { min-width:0; }
.alert { padding:10px 14px; border-radius:8px; margin:10px 0; }
.alert-ok { background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; }
.alert-error { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }
.inline-form { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:8px 0; }
.inline-form input, .inline-form select, .inline-form textarea { padding:6px 8px; border:1px solid #d1d5db; border-radius:6px; }
button, .btn { background:var(--pri); color:#fff; border:0; border-radius:6px; padding:5px 12px; cursor:pointer; text-decoration:none; font-size:13px; display:inline-block; }
button.danger { background:var(--err); }
button:hover, .btn:hover { opacity:.88; }
.ops { display:flex; flex-wrap:nowrap; gap:6px; align-items:center; white-space:nowrap; }
.ops .inline-form { margin:0; display:inline-flex; flex-wrap:nowrap; gap:4px; }
.ops .inline-form button { white-space:nowrap; }
.ops details summary.btn { white-space:nowrap; }
.toolbar { display:flex; gap:10px; flex-wrap:wrap; margin:10px 0; }
.dot { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; }
.dot-online { background:var(--ok); } .dot-offline { background:var(--err); } .dot-never { background:#9ca3af; }
.tag { background:#e5e7eb; color:#4b5563; border-radius:4px; padding:1px 6px; font-size:12px; }
.tag-ok { background:#dcfce7; color:var(--ok); }
.ip.red { color:var(--err); font-weight:700; }
.mac.green { color:var(--ok); font-weight:700; }
.clip { max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block; vertical-align:bottom; }
.pre, textarea.pre { white-space:pre-wrap; word-break:break-all; }
code { background:#f1f5f9; padding:1px 5px; border-radius:4px; font-size:12px; }
.hint { color:#6b7280; font-size:12px; }
.form-block { background:#fff; padding:16px; border-radius:10px; box-shadow:0 1px 4px rgba(0,0,0,.06); display:flex; flex-wrap:wrap; gap:12px; }
.form-block label { display:flex; flex-direction:column; gap:4px; min-width:200px; }
.form-block input, .form-block select, .form-block textarea { padding:7px 9px; border:1px solid #d1d5db; border-radius:6px; }
.grid-form { background:#fff; padding:14px; border-radius:10px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:10px 0; }
.grid-form label { display:flex; flex-direction:column; font-size:12px; color:#4b5563; gap:3px; }
.grid-form input, .grid-form select { padding:6px 8px; border:1px solid #d1d5db; border-radius:6px; }
details > summary { cursor:pointer; list-style:none; }
details[open] { position:relative; }
details[open] .grid-form, details[open] .modal-form { position:absolute; z-index:9; right:0; box-shadow:0 8px 24px rgba(0,0,0,.15); width:640px; }
details.drop-up[open] .grid-form, details.drop-up[open] .modal-form { top:auto; bottom:28px; }
.modal-form { background:#fff; padding:10px; border-radius:8px; display:flex; gap:8px; }
.pager { display:flex; gap:6px; margin:14px 0; }
.pager a, .pager b { padding:4px 10px; background:#fff; border-radius:6px; text-decoration:none; color:#374151; box-shadow:0 1px 2px rgba(0,0,0,.08); }
.pager b { background:var(--pri); color:#fff; }
.dlg { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:50; display:flex; align-items:center; justify-content:center; }
.dlg-body { background:#fff; border-radius:12px; padding:20px; width:560px; max-width:92vw; max-height:86vh; overflow:auto; }
.dlg-body h3 { margin-top:0; }
.dlg-close { background:#6b7280; }
.checklist { max-height:280px; overflow:auto; border:1px solid #e5e7eb; border-radius:8px; padding:8px; margin-bottom:10px; }
.checklist label { display:block; padding:4px; }
#ai-fab { position:fixed; right:22px; bottom:22px; width:52px; height:52px; border-radius:50%; background:var(--pri); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; cursor:pointer; box-shadow:0 6px 18px rgba(30,111,255,.4); z-index:60; }
#ai-panel { position:fixed; right:22px; bottom:84px; width:360px; height:480px; background:#fff; border-radius:14px; box-shadow:0 10px 40px rgba(0,0,0,.2); display:flex; flex-direction:column; z-index:60; }
.ai-head { padding:12px 16px; font-weight:700; border-bottom:1px solid #e5e7eb; display:flex; justify-content:space-between; }
#ai-close { cursor:pointer; color:#6b7280; }
#ai-msgs { flex:1; overflow-y:auto; padding:12px; display:flex; flex-direction:column; gap:8px; }
.ai-msg { padding:8px 12px; border-radius:10px; max-width:85%; white-space:pre-wrap; word-break:break-word; }
.ai-user { align-self:flex-end; background:var(--pri); color:#fff; }
.ai-assistant { align-self:flex-start; background:#f3f4f6; }
.ai-input { display:flex; gap:8px; padding:10px; border-top:1px solid #e5e7eb; }
.ai-input input { flex:1; padding:8px 10px; border:1px solid #d1d5db; border-radius:8px; }

/* 用户管理 - 模块权限模态弹窗 */
dialog.mods-dlg{border:1px solid #d0d5dd;border-radius:10px;padding:18px 22px;min-width:360px;max-width:92vw;box-shadow:0 10px 40px rgba(0,0,0,.25)}
dialog.mods-dlg::backdrop{background:rgba(0,0,0,.35)}
.mods-dlg h3{margin:0 0 12px;font-size:15px}
.mods-grid{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:8px 18px;margin:4px 0 12px}
.mods-grid label{display:flex;align-items:center;gap:5px;font-size:13px;white-space:nowrap;cursor:pointer}
.mods-btns{display:flex;gap:8px;justify-content:flex-end}
.mods-tip2{font-size:13px;color:#666}
/* 模块权限弹窗 - 辅助工具子权限 */
.mods-sub{border-top:1px dashed #d0d5dd;margin-top:2px;padding-top:10px}
.mods-sub-title{font-size:12px;color:#666;margin-bottom:6px}
.mods-sub-grid{display:grid;grid-template-columns:repeat(4,minmax(64px,1fr));gap:6px 10px;padding-left:8px}
.mods-sub-grid label{display:flex;align-items:center;gap:4px;font-size:13px;white-space:nowrap;cursor:pointer}
/* 已注册网吧 - 绑定网吧模态弹窗 */
.bind-form select{width:100%;padding:6px 8px;font-size:14px}
/* ICP 备案号页脚 */
.icp{position:fixed;left:0;right:0;bottom:0;text-align:center;padding:4px 0;font-size:12px;color:#888;background:transparent;z-index:5}
.icp a{color:#888;text-decoration:none}
.icp a:hover{color:#666;text-decoration:underline}
