/* 全站样式：基础 + 页面框架 + 通用控件
 * 各页按 <link>common.css</link> 再 <link>本页.css</link> 的顺序引入，本页可覆盖
 * 改全站宽度：只改下面 .wrap 的 max-width
 * 换配色：只改 :root 里的变量
 */

:root{
  --brand:#1668dc;        /* 主色：导航条 / 按钮 */
  --brand-dark:#0f52b0;   /* 深：hover、标题 */
  --brand-light:#eaf2fd;  /* 浅：表头、悬浮底、提示块 */
  --line:#c9d9ee;         /* 分隔线、边框 */
  --ink:#1a1a1a;          /* 正文 */
  --danger:#c00;
}

/* ---------- 基础 ---------- */
*{box-sizing:border-box}
body{margin:0;padding:32px 16px;background:#fff;color:var(--ink);
     font:13px/1.7 -apple-system,"Segoe UI","Microsoft YaHei",sans-serif}
h1{font-size:18px;font-weight:600;margin:0 0 6px;color:var(--brand-dark)}
.sub{color:#666;font-size:12px;margin:0 0 18px}
a{color:var(--brand)}
code{background:#f0f0f0;padding:1px 5px;font-family:Consolas,monospace}

/* ---------- 页面框架（宽度 / 页头 / 页脚） ---------- */
.wrap{max-width:1180px;margin:0 auto}
.head{margin:0 0 22px;padding-bottom:13px;border-bottom:1px solid var(--line)}
.head h1{font-size:18px;font-weight:600;margin:0 0 6px}
.head .sub{color:#666;font-size:12px;margin:0}
.foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
      margin-top:34px;padding-top:11px;border-top:1px solid var(--line);font-size:12px;color:#777}
.foot a{color:var(--brand);text-decoration:none;border-bottom:1px solid transparent}
.foot a:hover{color:var(--brand-dark);border-bottom-color:var(--brand-dark)}
.foot .sp{flex:1}

/* ---------- 顶部导航条 ---------- */
.bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 18px;padding:9px 12px;
     border:1px solid var(--brand);background:var(--brand);color:#fff;font-size:12px;border-radius:2px}
.bar b{font-size:13px;font-weight:600;margin-right:4px;color:#fff}
.bar a{color:#fff;text-decoration:none;border-bottom:1px solid transparent}
.bar a:hover{border-bottom-color:#fff}
.bar .sp{flex:1}
.bar .who{color:#d6e6fb}
.bar .out{color:#ffd0d0}
.bar .out:hover{border-bottom-color:#ffd0d0}

/* ---------- 表单与表格 ---------- */
fieldset{border:1px solid var(--line);padding:14px;margin:0 0 18px;border-radius:2px}
legend{padding:0 6px;font-size:13px;font-weight:600;color:var(--brand-dark)}
table{border-collapse:collapse;width:100%;margin-top:6px;font-size:12px}
td,th{border:1px solid var(--line);padding:6px 9px;vertical-align:middle;text-align:left;word-break:break-all}
th{background:var(--brand-light);font-weight:600;white-space:nowrap;color:var(--brand-dark)}
textarea{padding:9px;border:1px solid var(--line);border-radius:2px;resize:vertical;outline:none;background:#fff;color:var(--ink);
         font:13px/1.6 -apple-system,"Microsoft YaHei",sans-serif}
input[type=text],input[type=number],input[type=password],select{padding:6px 9px;border:1px solid var(--line);
    border-radius:2px;font:13px/1.4 -apple-system,"Microsoft YaHei",sans-serif;outline:none;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--brand)}
button{padding:6px 16px;border:1px solid var(--brand);background:var(--brand);color:#fff;border-radius:2px;
       font-size:13px;cursor:pointer;margin-left:6px}
button:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
.lbl{display:inline-block;min-width:78px;color:#333}
.row{margin:9px 0}

/* ---------- 通用小部件 ---------- */
.mono{font-family:Consolas,Monaco,monospace}
.num{text-align:right;white-space:nowrap}
.mini{padding:2px 9px;font-size:11px;margin:0 3px 0 0;border:1px solid var(--brand);background:var(--brand);color:#fff;
      border-radius:2px;cursor:pointer;text-decoration:none;display:inline-block;font-family:inherit}
.mini:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
.err{color:var(--danger);margin:10px 0}
.ok,.okbar{margin:10px 0;padding:8px 10px;border:1px solid var(--brand);background:var(--brand-light);color:var(--brand-dark)}
.tips,.hint{margin-top:18px;border:1px solid var(--line);padding:11px 13px;font-size:12px;color:#444;background:var(--brand-light)}
.stat{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:14px;font-size:12px;color:#444}
.stat b{font-size:16px;color:var(--brand-dark);display:block}