/* 深色简洁风格 */
* { box-sizing: border-box; }
body {
  margin: 0; background: #14161a; color: #d8dce3;
  font-family: "Segoe UI", "Microsoft YaHei", sans-serif; font-size: 15px;
}
a { color: #6ea8fe; text-decoration: none; }
a:hover { text-decoration: underline; }
nav {
  display: flex; align-items: center; gap: 18px;
  background: #1c1f26; padding: 12px 24px; border-bottom: 1px solid #2a2e37;
  position: sticky; top: 0;
}
nav .brand { font-weight: 700; color: #fff; }
nav .spacer { flex: 1; }
nav .who { color: #9aa3b2; font-size: 13px; }
main { max-width: 1000px; margin: 24px auto; padding: 0 16px; }
h1 { font-size: 22px; } h2 { font-size: 17px; margin-top: 28px; }
.card {
  background: #1c1f26; border: 1px solid #2a2e37; border-radius: 8px;
  padding: 16px 20px; margin: 12px 0;
}
.card.narrow { max-width: 380px; margin: 48px auto; }
.row { display: flex; gap: 16px; flex-wrap: wrap; }
.row label { flex: 1; min-width: 140px; }
label { display: block; margin: 12px 0 4px; color: #9aa3b2; }
input, select, textarea {
  display: block; width: 100%; margin-top: 4px; padding: 8px 10px;
  background: #12141a; color: #d8dce3; border: 1px solid #333947; border-radius: 6px;
}
button {
  margin-top: 12px; padding: 8px 20px; border: 0; border-radius: 6px;
  background: #3b82f6; color: #fff; cursor: pointer; font-size: 14px;
}
button:hover { background: #2f6fdd; }
button.danger { background: #b4433a; }
button.danger:hover { background: #98372f; }
table { width: 100%; border-collapse: collapse; margin: 12px 0; }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid #2a2e37; }
th { color: #9aa3b2; font-weight: 600; }
.muted { color: #7d8695; font-size: 13px; }
.flash { padding: 10px 14px; border-radius: 6px; margin: 10px 0; }
.flash.ok { background: #1e3a2a; color: #7fdca0; }
.flash.error { background: #3a2020; color: #f0958e; }
.st { padding: 2px 10px; border-radius: 10px; font-size: 13px; }
.st.queued { background: #333a2a; color: #d8c56e; }
.st.running { background: #26314a; color: #6ea8fe; }
.st.done { background: #1e3a2a; color: #7fdca0; }
.st.failed { background: #3a2020; color: #f0958e; }
.pos { color: #7fdca0; }
.stat { text-align: center; min-width: 120px; }
.stat .num { font-size: 28px; font-weight: 700; }
video { max-width: 100%; max-height: 360px; }
audio { width: 100%; }
img.preview { max-width: 100%; max-height: 360px; border-radius: 6px; }
form.inline { display: flex; gap: 6px; align-items: center; }
form.inline input { width: auto; margin: 0; }
form.inline button { margin: 0; padding: 6px 12px; }
.num-input { width: 6em; }
.note-input { width: 12em; }
a.on { color: #fff; font-weight: 600; }
code.token { background: #12141a; padding: 6px 10px; border-radius: 6px; user-select: all; }
pre { white-space: pre-wrap; word-break: break-all; font-size: 13px; }
