* { margin:0; padding:0; box-sizing:border-box; }
body {
  font-family: -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  background:#f5f7fa; color:#1f2937; font-size:14px; line-height:1.6;
}
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; }
select, input, textarea { font-family:inherit; font-size:13px; outline:none; }

/* ===== 顶部导航 ===== */
.topbar {
  background:#fff; border-bottom:1px solid #e8ecf2;
  display:flex; align-items:center; padding:0 24px; height:52px;
  position:sticky; top:0; z-index:100; gap:8px;
}
.logo { display:flex; align-items:center; gap:8px; font-weight:700; font-size:16px; margin-right:24px; color:#1667d9; }
.logo .mark {
  width:26px; height:26px; border-radius:7px; background:#1667d9; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700;
}
.nav { display:flex; gap:2px; flex:1; overflow-x:auto; }
.nav a {
  padding:6px 13px; border-radius:8px; color:#4b5563; font-size:13.5px; white-space:nowrap;
}
.nav a:hover { background:#f0f4fa; color:#1667d9; }
.nav a.active { color:#1667d9; font-weight:600; }
.top-right { display:flex; align-items:center; gap:14px; color:#6b7280; font-size:13px; }
.balance { color:#1667d9; font-weight:600; }
.icon-btn { width:30px; height:30px; border:none; background:transparent; border-radius:8px; position:relative; }
.icon-btn:hover { background:#f0f4fa; }
.icon-btn svg { width:17px; height:17px; stroke:#6b7280; }
.badge {
  position:absolute; top:2px; right:2px; background:#ef4444; color:#fff;
  font-size:10px; min-width:15px; height:15px; border-radius:8px; line-height:15px; text-align:center; padding:0 3px;
}
.avatar { width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg,#7fb2e5,#1667d9); color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; }

/* ===== 公告条 ===== */
.notice {
  background:#eaf2fd; color:#3b6cb0; font-size:12.5px; padding:7px 24px;
  display:flex; align-items:center; gap:6px; border-bottom:1px solid #dbe7f7;
}
.notice .dot { color:#f59e0b; }

/* ===== 页面容器 ===== */
.view { max-width:1440px; margin:0 auto; padding:20px 24px 60px; }

/* ===== 登录页 ===== */
.login-wrap { min-height:calc(100vh - 200px); display:flex; align-items:center; justify-content:center; }
.login-card { background:#fff; border:1px solid #e8ecf2; border-radius:16px; padding:40px 44px; width:380px; }
.login-card h1 { font-size:20px; text-align:center; margin-bottom:28px; color:#1f2937; }
.field { margin-bottom:16px; }
.field label { display:block; font-size:12.5px; color:#6b7280; margin-bottom:6px; }
.field input, .field select, .field textarea {
  width:100%; border:1px solid #d8dfe8; border-radius:8px; padding:9px 12px; background:#fff; transition:border .15s;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color:#1667d9; }
.btn-primary {
  width:100%; background:#1667d9; color:#fff; border:none; border-radius:8px;
  padding:10px; font-size:14px; font-weight:600; transition:background .15s;
}
.btn-primary:hover { background:#1257ba; }
.login-links { display:flex; justify-content:space-between; margin-top:14px; font-size:12.5px; color:#1667d9; }
.login-foot { text-align:center; color:#9ca3af; font-size:12px; margin-top:40px; }

/* ===== 通用卡片 ===== */
.card { background:#fff; border:1px solid #e8ecf2; border-radius:12px; }
.section-title { font-size:16px; font-weight:700; display:flex; align-items:center; gap:8px; margin-bottom:14px; }
.count-chip { background:#eef2f7; color:#6b7280; font-size:11px; padding:1px 7px; border-radius:99px; font-weight:500; }

/* ===== 视频工作台 ===== */
.wb-layout { display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:18px; align-items:start; }
@media (max-width:1100px){ .wb-layout { grid-template-columns:1fr; } }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 18px; }
.form-grid .full { grid-column:1/-1; }
@media (max-width:640px){ .form-grid { grid-template-columns:1fr; } }
.hint { font-size:12px; color:#9ca3af; margin-top:4px; }
.tips-box { background:#f8fafc; border:1px solid #eef2f7; border-radius:8px; padding:10px 12px; font-size:12px; color:#6b7280; margin-top:8px; }
.tips-box b { color:#374151; }
.ref-tabs { display:flex; gap:16px; border-bottom:1px solid #eef2f7; margin:20px 0 14px; }
.ref-tabs span { padding-bottom:8px; font-size:13.5px; color:#6b7280; cursor:pointer; border-bottom:2px solid transparent; }
.ref-tabs span.on { color:#1667d9; font-weight:600; border-color:#1667d9; }
.upload-row { display:flex; gap:12px; }
.upload-box {
  width:110px; height:76px; border:1.5px dashed #cdd6e2; border-radius:10px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  color:#6b7280; font-size:12px; background:#fafbfd; cursor:pointer;
}
.upload-box:hover { border-color:#1667d9; color:#1667d9; }
.price-bar { display:flex; align-items:center; gap:10px; margin-top:22px; padding-top:16px; border-top:1px solid #eef2f7; font-size:13px; color:#6b7280; flex-wrap:wrap; }
.price { font-size:22px; font-weight:700; color:#1667d9; }
.pill { font-size:11.5px; padding:2px 9px; border-radius:99px; border:1px solid #d8dfe8; color:#6b7280; }
.pill.blue { color:#1667d9; border-color:#b9d2f2; background:#f0f6ff; }
.btn-go { margin-left:auto; background:#1667d9; color:#fff; border:none; border-radius:9px; padding:10px 34px; font-size:14px; font-weight:600; }
.btn-go:hover { background:#1257ba; }
.btn-ghost { background:#fff; color:#1667d9; border:1px solid #b9d2f2; border-radius:9px; padding:9px 18px; font-size:13px; }

/* 生成记录 */
.rec-head { display:flex; align-items:center; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.rec-head .info { font-size:12px; color:#9ca3af; }
.chip-tabs { display:flex; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
.chip { font-size:12.5px; padding:5px 13px; border-radius:99px; border:1px solid #e2e8f0; background:#fff; color:#4b5563; }
.chip.on { background:#1667d9; border-color:#1667d9; color:#fff; }
.search-input { width:100%; border:1px solid #e2e8f0; border-radius:8px; padding:8px 12px; margin-bottom:14px; }
.rec-grid { display:grid; grid-template-columns:1fr; gap:14px; }
.rec-card { border:1px solid #e8ecf2; border-radius:12px; overflow:hidden; background:#fff; }
.thumb { position:relative; height:150px; background:#111; display:flex; align-items:center; justify-content:center; }
.thumb .play {
  width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.22); backdrop-filter:blur(2px);
  display:flex; align-items:center; justify-content:center;
}
.thumb .play::after { content:""; border-style:solid; border-width:7px 0 7px 12px; border-color:transparent transparent transparent #fff; margin-left:3px; }
.thumb .done { position:absolute; top:8px; right:8px; background:#22c55e; color:#fff; font-size:11px; padding:2px 9px; border-radius:6px; }
.thumb .checkbox { position:absolute; top:8px; left:8px; width:15px; height:15px; border:1.5px solid rgba(255,255,255,.75); border-radius:4px; background:rgba(0,0,0,.2); }
.rec-body { padding:12px 14px; }
.rec-title { font-size:13px; font-weight:600; color:#1f2937; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.rec-meta { font-size:11.5px; color:#9ca3af; margin-top:6px; display:flex; gap:5px; flex-wrap:wrap; align-items:center; }
.tag-green { color:#16a34a; border:1px solid #bbe7c8; background:#f0fcf4; font-size:11px; padding:1px 7px; border-radius:6px; }
.tag-blue { color:#1667d9; border:1px solid #b9d2f2; background:#f0f6ff; font-size:11px; padding:1px 7px; border-radius:6px; }
.rec-price { margin-left:auto; color:#1667d9; font-weight:700; }
.rec-actions { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.mini-btn { font-size:12px; padding:5px 12px; border-radius:7px; border:1px solid #e2e8f0; background:#fff; color:#4b5563; }
.mini-btn:hover { border-color:#1667d9; color:#1667d9; }
.mini-btn.danger { color:#dc2626; border-color:#f3c1c1; }
.mini-btn.danger:hover { background:#fef2f2; }

/* ===== 模型中心 ===== */
.mc-layout { display:grid; grid-template-columns:200px minmax(0,1fr); gap:18px; align-items:start; }
@media (max-width:900px){ .mc-layout { grid-template-columns:1fr; } }
.mc-side { padding:14px; }
.mc-side .item { display:flex; justify-content:space-between; padding:9px 12px; border-radius:8px; color:#4b5563; font-size:13.5px; cursor:pointer; }
.mc-side .item:hover { background:#f5f8fc; }
.mc-side .item.on { background:#eaf2fd; color:#1667d9; font-weight:600; }
.mc-side .item .n { color:#9ca3af; font-size:12px; }
.mc-head h2 { font-size:17px; font-weight:700; }
.mc-head p { font-size:12.5px; color:#9ca3af; margin-top:3px; }
.model-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:16px; margin-top:16px; }
.model-card { padding:18px; display:flex; flex-direction:column; gap:10px; position:relative; }
.model-card .fav { position:absolute; top:14px; right:14px; color:#c3ccd8; font-size:16px; }
.model-name { font-size:14.5px; font-weight:700; color:#1f2937; padding-right:24px; }
.model-desc { font-size:12.5px; color:#6b7280; min-height:34px; }
.spec-row { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; background:#f8fafc; border-radius:9px; padding:10px 12px; }
.spec div b { display:block; font-size:11px; color:#9ca3af; font-weight:500; }
.spec div span { font-size:12.5px; color:#374151; }
.model-actions { display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:8px; }
.price-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.price-row .p { font-size:16px; font-weight:700; color:#1667d9; }

/* ===== 分销中心 ===== */
.stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media (max-width:900px){ .stats-row { grid-template-columns:repeat(2,1fr); } }
.stat { padding:20px; text-align:center; }
.stat .label { font-size:12.5px; color:#6b7280; }
.stat .num { font-size:24px; font-weight:700; margin-top:6px; }
.stat .num.red { color:#ef4444; }
.stat .num.blue { color:#1667d9; }
.stat .sub { font-size:11.5px; color:#9ca3af; margin-top:4px; }
.stat .apply { margin-top:10px; font-size:12px; color:#1667d9; border:1px solid #b9d2f2; background:#f0f6ff; border-radius:7px; padding:4px 14px; }
.rate-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
@media (max-width:700px){ .rate-row { grid-template-columns:1fr; } }
.rate { padding:18px 20px; }
.rate .r-label { font-size:12.5px; color:#6b7280; }
.rate .r-val { font-size:24px; font-weight:700; color:#1f2937; margin-top:4px; }
.rate .r-sub { font-size:11.5px; color:#9ca3af; }
.invite { padding:18px 20px; margin-top:14px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.invite .code { font-size:16px; font-weight:700; letter-spacing:1px; color:#1667d9; background:#f0f6ff; border:1px dashed #b9d2f2; padding:6px 16px; border-radius:8px; }
.invite .link { font-size:12.5px; color:#6b7280; word-break:break-all; }
.copy-btn { background:#1667d9; color:#fff; border:none; border-radius:7px; padding:7px 16px; font-size:12.5px; }
.copy-btn.ghost { background:#fff; color:#4b5563; border:1px solid #e2e8f0; }
.table-tabs { display:flex; gap:20px; margin:20px 0 0; border-bottom:1px solid #eef2f7; }
.table-tabs a, .table-tabs span { padding-bottom:9px; font-size:13.5px; color:#6b7280; cursor:pointer; border-bottom:2px solid transparent; }
.table-tabs a.on, .table-tabs span.on { color:#1667d9; font-weight:600; border-color:#1667d9; }
table.data { width:100%; border-collapse:collapse; margin-top:14px; font-size:13px; }
table.data th { text-align:left; font-weight:500; color:#9ca3af; font-size:12px; padding:10px 14px; border-bottom:1px solid #eef2f7; background:#fafbfd; }
table.data td { padding:11px 14px; border-bottom:1px solid #f3f6fa; color:#374151; }

/* ===== 开放 API ===== */
.api-layout { display:grid; grid-template-columns:210px minmax(0,1fr); gap:18px; align-items:start; }
@media (max-width:900px){ .api-layout { grid-template-columns:1fr; } }
.api-side { padding:14px; position:sticky; top:70px; }
.api-side .group { font-size:11.5px; color:#9ca3af; margin:12px 0 4px; padding-left:12px; }
.api-side .item { display:block; padding:7px 12px; border-radius:8px; color:#4b5563; font-size:13px; cursor:pointer; }
.api-side .item:hover { background:#f5f8fc; color:#1667d9; }
.api-side .item.on { background:#eaf2fd; color:#1667d9; font-weight:600; }
.doc h2 { font-size:17px; font-weight:700; }
.doc .lead { font-size:12.5px; color:#9ca3af; margin-top:4px; }
.doc-box { background:#f8fafc; border:1px solid #eef2f7; border-radius:10px; padding:14px 16px; margin-top:14px; }
.doc-box h3 { font-size:13.5px; font-weight:700; margin-bottom:8px; }
.doc-box p, .doc-box li { font-size:13px; color:#4b5563; }
.doc-box ol { padding-left:18px; }
.endpoint { background:#1667d9; color:#fff; border-radius:8px; padding:9px 14px; font-size:12.5px; font-family:ui-monospace,Consolas,monospace; margin-top:10px; }
pre.code {
  background:#0f172a; color:#dbe7f7; border-radius:10px; padding:14px 16px;
  font-size:12px; line-height:1.7; overflow-x:auto; font-family:ui-monospace,Consolas,monospace; margin-top:12px;
}
pre.code .c { color:#7d8db1; }
pre.code .k { color:#8ec6ff; }
pre.code .s { color:#a5e2a5; }

/* ===== 视频保留期提醒（上游仅保留 24 小时） ===== */
.keep-note {
  display:flex; align-items:flex-start; gap:8px;
  font-size:12.5px; line-height:1.65; color:#92400e;
  background:#fffbeb; border:1px solid #fde68a; border-radius:9px;
  padding:9px 12px; margin:10px 0 6px;
}
.keep-note .ico { flex:0 0 auto; font-size:13px; line-height:1.5; }
.keep-note b, .keep-note strong { color:#b45309; }
.keep-line { margin:6px 0 2px; }
.keep-tip {
  display:inline-block; font-size:11px; line-height:1.5; color:#b45309;
  background:#fffbeb; border:1px solid #fde68a; border-radius:6px;
  padding:2px 7px; margin-right:6px;
}
.keep-tip.urgent { color:#b91c1c; background:#fef2f2; border-color:#fecaca; font-weight:600; }
.keep-tip.expired { color:#6b7280; background:#f3f4f6; border-color:#e5e7eb; }

/* ===== 页脚 ===== */
.footer { text-align:center; color:#9ca3af; font-size:12px; padding:26px 0 34px; }
