:root{
  --bg:#f4f6fb; --card:#ffffff; --ink:#0f172a; --muted:#64748b; --line:#e6e9ef;
  --primary:#2563eb; --primary-d:#1d4ed8; --primary-soft:#eef4ff;
  --ok:#16a34a; --ok-soft:#e9f9ef; --warn:#d97706; --warn-soft:#fef3c7;
  --bad:#dc2626; --bad-soft:#fef2f2; --violet:#6d28d9; --violet-soft:#f1ecfe;
  --radius:14px; --radius-sm:9px; --shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.06);
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--ink); font-size:14px; line-height:1.5;
}
a{color:var(--primary);text-decoration:none}

/* ---------- 顶栏 ---------- */
.topbar{
  background:var(--card); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20;
  display:flex; align-items:center; gap:8px; padding:0 22px; height:56px;
}
.brand{display:flex; align-items:center; gap:9px; font-weight:700; font-size:15px; margin-right:14px}
.brand .logo{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,var(--primary),#60a5fa);
  display:flex;align-items:center;justify-content:center}
.brand .logo svg{width:16px;height:16px;fill:#fff}
.nav{display:flex; gap:4px}
.nav a{padding:7px 13px; border-radius:8px; color:var(--muted); font-weight:500}
.nav a:hover{background:var(--primary-soft); color:var(--primary)}
.nav a.active{background:var(--primary-soft); color:var(--primary); font-weight:600}
.navdrop{position:relative}
.navdrop > a{padding:7px 13px; border-radius:8px; color:var(--muted); font-weight:500; display:inline-block}
.navdrop > a:hover{background:var(--primary-soft); color:var(--primary)}
.navdrop > a.active{background:var(--primary-soft); color:var(--primary); font-weight:600}
.navdrop .navmenu{display:none; position:absolute; top:100%; left:0; margin-top:4px; background:#fff;
  border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); padding:6px; min-width:128px; z-index:30}
.navdrop:hover .navmenu{display:block}
.navdrop .navmenu a{display:block; padding:8px 12px; border-radius:7px; color:var(--ink); font-size:14px}
.navdrop .navmenu a:hover{background:var(--primary-soft); color:var(--primary)}
.navdrop .navmenu a.active{background:var(--primary-soft); color:var(--primary); font-weight:600}
/* 基础配置子页的页内切换 */
.subtabs{display:flex; gap:8px; margin-bottom:16px}
.subtabs a{padding:7px 14px; border-radius:8px; font-size:14px; color:var(--muted); background:var(--card); border:1px solid var(--line)}
.subtabs a.active{background:var(--primary-soft); color:var(--primary-d); border-color:#c7d8ff; font-weight:600}
/* 竖排选项：紧凑分隔列表 */
.listhead{display:flex; align-items:center; justify-content:space-between; padding:13px 16px; border-bottom:1px solid var(--line)}
.listhead .ttl{font-weight:600; font-size:14px}
.listhead .ct{color:var(--muted); font-weight:400; font-size:13px; margin-left:6px}
.saveflag{font-size:12px; color:var(--ok); opacity:0; transition:opacity .2s}
.saveflag.on{opacity:1}
.saveflag.err{color:var(--bad)}
.vadd{display:flex; gap:8px; padding:12px 16px; border-bottom:1px solid var(--line); background:#fafbfd}
.vadd input{flex:1}
.vlist{display:flex; flex-direction:column}
.vrow{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 16px; border-bottom:1px solid var(--line)}
.vrow:last-child{border-bottom:none}
.vrow:hover{background:#fafcff}
.vrow .t{font-size:14px}
.vrow .x{cursor:pointer; color:#cbd5e1; font-weight:700; border:none; background:none; font-size:16px; line-height:1; padding:0 2px}
.vrow:hover .x{color:var(--bad)}
.topbar .right{margin-left:auto; display:flex; align-items:center; gap:14px; color:var(--muted); font-size:13px}

/* ---------- 布局 ---------- */
.container{max-width:1180px; margin:0 auto; padding:22px 22px 70px}
.page-head{display:flex; align-items:flex-end; justify-content:space-between; margin:4px 0 16px; gap:12px; flex-wrap:wrap}
.page-head h1{font-size:20px; margin:0}
.page-head p{margin:4px 0 0; color:var(--muted); font-size:13px}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow)}
.card.pad{padding:18px}

/* ---------- 工具条 ---------- */
.toolbar{display:flex; flex-wrap:wrap; gap:14px 18px; align-items:flex-end}
.field{display:flex; flex-direction:column; gap:6px; font-size:12px; color:var(--muted)}
.field label{font-weight:600}
.checks{display:flex; flex-wrap:wrap; gap:8px}
.checks label{display:inline-flex; align-items:center; gap:6px; background:var(--bg); border:1px solid var(--line);
  padding:6px 11px; border-radius:8px; cursor:pointer; color:var(--ink); font-size:13px; user-select:none}
.checks label:hover{border-color:#c7d2fe}
.checks input{accent-color:var(--primary)}

/* ---------- 控件 ---------- */
input[type=text],input[type=password],input[type=date],select{
  width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font-size:14px; color:var(--ink); background:#fff; transition:border-color .15s, box-shadow .15s;
}
input:focus,select:focus{outline:none; border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft)}
select{cursor:pointer; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8.5L1.5 4h9z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center; padding-right:28px}

.btn{display:inline-flex; align-items:center; gap:7px; padding:9px 18px; border:1px solid transparent;
  border-radius:var(--radius-sm); font-size:14px; font-weight:600; cursor:pointer; transition:.15s; background:var(--primary); color:#fff}
.btn:hover{background:var(--primary-d)}
.btn:disabled{background:#94a3b8; cursor:not-allowed}
.btn.sec{background:#fff; color:var(--ink); border-color:var(--line)}
.btn.sec:hover{background:var(--bg); border-color:#cbd5e1}
.btn.ghost{background:transparent; color:var(--muted)}
.btn.ghost:hover{background:var(--bg)}
.btn.sm{padding:6px 12px; font-size:13px}

/* ---------- 表格 ---------- */
.table-wrap{overflow:auto; border-radius:var(--radius); border:1px solid var(--line)}
table{width:100%; border-collapse:collapse; background:#fff; font-size:13px}
th,td{padding:10px 12px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line)}
th{background:#fafbfd; color:var(--muted); font-weight:600; white-space:nowrap; position:sticky; top:0}
tbody tr:hover{background:#fafcff}
tbody tr:last-child td{border-bottom:none}
td input,td select{padding:7px 9px}

/* ---------- 徽标/标签 ---------- */
.chip{display:inline-block; padding:4px 11px; border-radius:20px; font-size:12px; font-weight:600;
  background:var(--primary-soft); color:var(--primary-d)}
.chip.ok{background:var(--ok-soft); color:var(--ok)}
.tag{display:inline-block; font-size:11px; padding:2px 8px; border-radius:6px; margin:1px 3px 1px 0; font-weight:600; white-space:nowrap}
.tag.seat{background:var(--violet-soft); color:var(--violet)}
.tag.base{background:var(--ok-soft); color:var(--ok)}
.tag.contact{background:var(--warn-soft); color:var(--warn)}

/* ---------- 提示框 ---------- */
.notice{padding:14px 16px; border-radius:var(--radius); font-size:13px; line-height:1.6}
.notice.bad{background:var(--bad-soft); border:1px solid #fecaca; color:#b91c1c}
.notice.bad a{color:#b91c1c; font-weight:700}
.notice.info{background:var(--primary-soft); border:1px solid #c7d8ff; color:var(--primary-d)}
.muted{color:var(--muted)}
.empty,.loading{padding:40px; text-align:center; color:var(--muted)}
.spinner{display:inline-block;width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--primary);
  border-radius:50%;animation:spin .7s linear infinite;vertical-align:-3px;margin-right:7px}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- 分组标题 ---------- */
.group{margin-top:24px}
.group-title{display:flex; align-items:center; gap:10px; margin:0 0 10px}
.group-title h2{font-size:15px; margin:0}
.group-title .bar{width:4px; height:16px; border-radius:3px; background:var(--primary)}

/* ---------- 全局加载遮罩（萌系飞行主题） ---------- */
#__loading{position:fixed; inset:0; display:none; align-items:center; justify-content:center;
  background:rgba(228,237,250,.55); backdrop-filter:blur(3px); z-index:9999}
#__loading.on{display:flex}
.ld-card{position:relative; width:300px; padding:24px 28px 22px; border-radius:20px; text-align:center; overflow:hidden;
  background:linear-gradient(135deg,#e3f0ff 0%,#ffe6f1 100%);
  box-shadow:0 16px 48px rgba(96,128,200,.22); animation:ldPop .45s cubic-bezier(.34,1.56,.64,1)}
@keyframes ldPop{0%{transform:scale(.78);opacity:0}100%{transform:scale(1);opacity:1}}
.ld-sky{position:relative; width:100%; height:96px; margin-bottom:4px; overflow:hidden}
.ld-plane{position:absolute; left:50%; top:34px; margin-left:-22px; font-size:40px; line-height:1; z-index:2;
  filter:drop-shadow(0 6px 5px rgba(80,110,170,.25)); animation:ldPlane 1.4s ease-in-out infinite}
@keyframes ldPlane{0%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-11px) rotate(7deg)}100%{transform:translateY(0) rotate(-7deg)}}
.ld-cloud{position:absolute; left:0; font-size:26px; line-height:1; z-index:1; opacity:.92}
.ld-cloud.c1{top:2px; animation:ldDrift 4s linear infinite}
.ld-cloud.c2{top:54px; font-size:20px; animation:ldDrift 6.4s linear infinite; animation-delay:-1.3s}
.ld-cloud.c3{top:26px; font-size:32px; animation:ldDrift 5.2s linear infinite; animation-delay:-2.6s}
@keyframes ldDrift{from{transform:translateX(160px)}to{transform:translateX(-180px)}}
.ld-dots{display:flex; justify-content:center; gap:9px; margin:2px 0 14px}
.ld-dots i{width:9px; height:9px; border-radius:50%; display:inline-block; animation:ldBounce .9s ease-in-out infinite}
.ld-dots .d1{background:#ec4899}
.ld-dots .d2{background:#3b82f6; animation-delay:.15s}
.ld-dots .d3{background:#f59e0b; animation-delay:.3s}
@keyframes ldBounce{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-9px)}}
.ld-text{font-size:15px; font-weight:600; color:#3a4a63; min-height:21px; opacity:1; transition:opacity .18s}
.ld-sub{font-size:12px; color:#8b94a8; margin-top:7px}

/* ---------- 成员列表 ---------- */
.members{margin:0; padding:0; list-style:none}
.members li{padding:3px 0}
.members .who{font-weight:600}
.members .role{color:var(--muted); font-size:12px; margin-left:4px}
