* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
       background: #0f1115; color: #e6e6e6; font-size: 14px; }
header { padding: 14px 20px; background: #161a21; border-bottom: 1px solid #262c36; }
h1 { margin: 0 0 10px; font-size: 18px; }
h2 { font-size: 16px; margin: 4px 0 14px; }
h3 { font-size: 14px; color: #9fb3c8; margin: 18px 0 8px; }
nav { display: flex; gap: 8px; }
.tab { background: #222835; color: #cbd5e1; border: 1px solid #2d3748; padding: 7px 14px;
       border-radius: 6px; cursor: pointer; }
.tab.active { background: #2563eb; color: #fff; border-color: #2563eb; }
main { padding: 20px; max-width: 1100px; margin: 0 auto; }
.panel { display: none; }
.panel.active { display: block; }
.row { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; flex-wrap: wrap; }
.row.right { justify-content: flex-end; }
input, select, button { font-size: 14px; }
input, select { background: #0c0e12; color: #e6e6e6; border: 1px solid #2d3748;
                padding: 7px 9px; border-radius: 6px; flex: 1; min-width: 80px; }
button { background: #2d3748; color: #e6e6e6; border: 1px solid #3a4557; padding: 7px 13px;
         border-radius: 6px; cursor: pointer; }
button:hover { background: #3a4557; }
button.primary { background: #2563eb; border-color: #2563eb; color: #fff; }
button.danger { background: #7f1d1d; border-color: #7f1d1d; }
.card { background: #161a21; border: 1px solid #262c36; border-radius: 8px; padding: 14px; margin-bottom: 14px; }
table { width: 100%; border-collapse: collapse; margin-top: 8px; }
th, td { text-align: left; padding: 7px 9px; border-bottom: 1px solid #262c36; }
th { color: #9fb3c8; font-weight: 600; }
.hint { color: #6b7a8d; font-size: 12px; }
.badge { display: inline-block; padding: 1px 7px; border-radius: 10px; font-size: 12px; }
.badge.cn { background: #14532d; color: #86efac; }
.badge.m1 { background: #1e3a8a; color: #93c5fd; }
.badge.m2 { background: #78350f; color: #fcd34d; }
.badge.m3 { background: #334155; color: #cbd5e1; }
.region-group { border: 1px solid #262c36; border-radius: 6px; padding: 8px; margin-bottom: 8px; }
.region-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.chk { display: inline-flex; align-items: center; gap: 4px; margin: 2px 10px 2px 0; }
.toolbar { display: flex; gap: 8px; align-items: center; margin: 10px 0; flex-wrap: wrap; }
.modal { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.6); }
.modal.open { display: flex; align-items: center; justify-content: center; }
.modal-box { background: #161a21; border: 1px solid #2d3748; border-radius: 10px; padding: 20px;
             width: 760px; max-width: 94vw; max-height: 88vh; overflow: auto; }
pre { background: #0c0e12; border: 1px solid #262c36; border-radius: 8px; padding: 12px;
      overflow: auto; max-height: 460px; font-size: 12px; white-space: pre; }
small { color: #6b7a8d; }
label { white-space: nowrap; }