/* ============================================================
   Aurora 设计系统 — 通千算智AI短剧 全站重设计（v1）
   策略：设计令牌 + 稳定 ID 锚点 + !important 压制注入内联样式
   范围：全站共享壳（header/用户菜单/铃铛/浮窗/弹层）+ 首页启动台
   红线：不改动任何功能 DOM/JS；walk-fix.css 断点规则保持兼容
   ============================================================ */

:root {
  --au-bg: #f4f5fa;
  --au-surface: #ffffff;
  --au-ink: #101322;
  --au-ink-2: #4b5163;
  --au-ink-3: #8a90a3;
  --au-line: #e7e9f2;
  --au-line-2: #d9dcec;

  --au-brand: #5b2ee5;
  --au-brand-2: #8b5cf6;
  --au-brand-deep: #3b1d8f;
  --au-brand-soft: #f2efff;
  --au-brand-line: #ddd4fb;

  --au-amber: #92400e;
  --au-amber-bg: #fffaf0;
  --au-amber-line: #f5e3bb;
  --au-green: #0a8a5f;
  --au-red: #d92d20;

  --au-dark: #12101f;
  --au-dark-2: #1b1830;
  --au-dark-line: rgba(255, 255, 255, 0.1);

  --au-r: 14px;
  --au-r-s: 10px;
  --au-shadow-1: 0 1px 2px rgba(16, 19, 34, 0.05), 0 6px 20px rgba(16, 19, 34, 0.06);
  --au-shadow-2: 0 2px 6px rgba(16, 19, 34, 0.08), 0 16px 44px rgba(59, 29, 143, 0.14);
  --au-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Segoe UI", sans-serif;
}

/* ---------- 基底 ---------- */
body {
  background: var(--au-bg) !important;
  font-family: var(--au-font) !important;
  -webkit-font-smoothing: antialiased;
  color: var(--au-ink);
}
::selection { background: rgba(139, 92, 246, 0.22); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #c9cdda; border-radius: 8px; border: 2px solid var(--au-bg); }
::-webkit-scrollbar-track { background: transparent; }

a { color: var(--au-brand); }

/* ---------- 顶栏 ---------- */
header.header,
header {
  background: rgba(255, 255, 255, 0.86) !important;
  backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid var(--au-line) !important;
}
header.header .logo-text,
header.header h1,
header.header .title { font-weight: 800 !important; letter-spacing: 0.2px; }

header.header nav.header-nav a,
header.header nav a {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  padding: 7px 16px !important;
  font-weight: 600 !important;
  color: var(--au-ink-2) !important;
  transition: all 0.16s ease;
}
header.header nav.header-nav a:hover,
header.header nav a:hover { background: var(--au-brand-soft) !important; color: var(--au-brand) !important; }
header.header nav.header-nav a.router-link-active,
header.header nav a.active {
  background: var(--au-ink) !important;
  color: #fff !important;
  border-color: var(--au-ink) !important;
}

/* ---------- 主内容画布 ---------- */
main { max-width: 1180px; }
main h1 {
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: 0.3px !important;
  color: var(--au-ink) !important;
}

/* ---------- 启动台 Hero（#tqOneBox）：深色影院卡 ---------- */
#tqOneBox {
  background: linear-gradient(135deg, var(--au-dark) 0%, var(--au-dark-2) 55%, #251d4d 100%) !important;
  border: 1px solid rgba(139, 92, 246, 0.35) !important;
  border-radius: 20px !important;
  padding: 22px 24px 18px !important;
  box-shadow: var(--au-shadow-2) !important;
  position: relative !important;
  overflow: hidden !important;
}
#tqOneBox::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(560px 200px at 88% -10%, rgba(139, 92, 246, 0.35), transparent 60%),
    radial-gradient(420px 180px at -6% 110%, rgba(59, 29, 143, 0.5), transparent 60%);
  pointer-events: none;
}
#tqOneBox > * { position: relative !important; z-index: 1 !important; }

#tqOneBox > div:first-child {
  font-size: 17px !important;
  font-weight: 800 !important;
  color: #fff !important;
  letter-spacing: 0.3px !important;
  margin-bottom: 4px !important;
}
#tqOneBox > div:nth-child(2) { color: rgba(255, 255, 255, 0.62) !important; margin-bottom: 12px !important; }

#tqOneIdea {
  background: rgba(255, 255, 255, 0.07) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  border-radius: 12px !important;
  color: #fff !important;
  font-size: 14px !important;
  padding: 13px 14px !important;
  min-height: 76px !important;
  transition: border 0.16s ease, background 0.16s ease;
}
#tqOneIdea::placeholder { color: rgba(255, 255, 255, 0.38) !important; }
#tqOneIdea:focus {
  outline: none !important;
  border-color: rgba(139, 92, 246, 0.75) !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

/* 控制行：统一下拉为暗色 chip */
#tqOneBox select {
  appearance: none !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  border-radius: 999px !important;
  color: #e9e7fb !important;
  padding: 8px 30px 8px 14px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' stroke='%23b9b3e8' stroke-width='1.6' fill='none' stroke-linecap='round'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  transition: border 0.16s ease;
}
#tqOneBox select:hover, #tqOneBox select:focus { border-color: rgba(139, 92, 246, 0.7) !important; outline: none !important; }
#tqOneBox select option { background: #1b1830; color: #e9e7fb; }

/* 主 CTA：品牌渐变 + 光晕 */
#tqOneGo {
  background: linear-gradient(135deg, #8b5cf6, #5b2ee5) !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 11px 26px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
  color: #fff !important;
  box-shadow: 0 6px 22px rgba(124, 58, 237, 0.45) !important;
  transition: transform 0.14s ease, box-shadow 0.14s ease, filter 0.14s ease;
}
#tqOneGo:hover { transform: translateY(-1px); filter: brightness(1.08); box-shadow: 0 10px 30px rgba(124, 58, 237, 0.55) !important; }
#tqOneGo:active { transform: translateY(0); }

/* 时长说明与预估行：暗色化 */
#tqOneBox > span { color: rgba(255, 255, 255, 0.45) !important; font-size: 11.5px !important; }

/* ---------- 新手引导条（#tqNewbieCard）：降噪为一条纤细提示 ---------- */
#tqNewbieCard {
  background: var(--au-amber-bg) !important;
  border: 1px solid var(--au-amber-line) !important;
  border-left: 3px solid #d97706 !important;
  border-radius: 12px !important;
  padding: 10px 16px !important;
  box-shadow: none !important;
}
#tqNewbieCard > div:first-child { font-size: 12.5px !important; color: var(--au-amber) !important; margin-bottom: 6px !important; }
#tqNewbieCard br { display: none; }
#tqNewbieCard > div:nth-child(2) { gap: 8px !important; font-size: 12px !important; color: #7c5e1e !important; }
#tqNewbieCard > div:nth-child(2) > div {
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  padding: 2px 4px !important;
  min-width: 150px !important;
}
#tqNewbieCard > div:nth-child(2) > div b { color: var(--au-amber) !important; }
#tqNewbieCard a, #tqNewbieCard #tqNewbieMarkPub { color: #b45309 !important; font-weight: 600 !important; }
#tqNewbieCard > div:last-child, #tqNewbieCard > div:nth-child(3) { font-size: 11.5px !important; color: #a16207 !important; }

/* ---------- 搜索 / 筛选 / 排序 行（Nuxt 渲染区）---------- */
main input[type="text"],
main input:not([type]),
main .search input {
  background: var(--au-surface) !important;
  border: 1px solid var(--au-line-2) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  font-size: 13.5px !important;
  color: var(--au-ink) !important;
  box-shadow: 0 1px 2px rgba(16, 19, 34, 0.03) !important;
  transition: border 0.16s ease, box-shadow 0.16s ease;
}
main input:focus {
  outline: none !important;
  border-color: var(--au-brand-2) !important;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.14) !important;
}

/* ---------- 项目卡与网格：卡片化 + 悬浮 ---------- */
main .card,
main [class*="drama-card"],
main [class*="DramaCard"] {
  background: var(--au-surface) !important;
  border: 1px solid var(--au-line) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: var(--au-shadow-1) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}
main .card:hover,
main [class*="drama-card"]:hover {
  transform: translateY(-3px) !important;
  border-color: var(--au-brand-line) !important;
  box-shadow: var(--au-shadow-2) !important;
}
main .card img, main [class*="drama-card"] img { transition: transform 0.3s ease; }
main .card:hover img, main [class*="drama-card"]:hover img { transform: scale(1.03); }

/* ---------- 右下浮动入口 + 反馈 FAB：统一右轨 ---------- */
a[href*="/ideas.html?v="],
a[href*="/publish.html?v="],
a[href*="/qc.html?v="] {
  background: var(--au-surface) !important;
  color: var(--au-ink) !important;
  border: 1px solid var(--au-line) !important;
  border-radius: 999px !important;
  box-shadow: var(--au-shadow-1) !important;
  font-weight: 700 !important;
  backdrop-filter: blur(8px);
  transition: all 0.16s ease !important;
}
a[href*="/ideas.html?v="]:hover,
a[href*="/publish.html?v="]:hover,
a[href*="/qc.html?v="]:hover {
  border-color: var(--au-brand-line) !important;
  color: var(--au-brand) !important;
  transform: translateY(-2px) !important;
  box-shadow: var(--au-shadow-2) !important;
}

/* ---------- 用户菜单 / 铃铛 / 充值弹层（共享壳）---------- */
#tqUserBtn {
  border-radius: 999px !important;
  border: 1px solid var(--au-line) !important;
  background: var(--au-surface) !important;
  transition: all 0.16s ease;
}
#tqUserBtn:hover { border-color: var(--au-brand-line) !important; box-shadow: var(--au-shadow-1) !important; }
#tqUserMenu, #tqNotifMenu {
  background: var(--au-surface) !important;
  border: 1px solid var(--au-line) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 48px rgba(16, 19, 34, 0.16) !important;
  overflow: hidden;
}
#tqUserMenu .head {
  background: linear-gradient(135deg, var(--au-brand-soft), #faf8ff) !important;
  color: var(--au-ink) !important;
  border-bottom: 1px solid var(--au-line) !important;
}
#tqUserMenu .mi:hover { background: var(--au-brand-soft) !important; }
#tqUserMenu .mi.danger:hover { background: #fef2f2 !important; }

/* ---------- 全局弹层 / 对话框 ---------- */
#tqDlgMerge, #tqPayModal, [id*="tqDlg"], [id*="Modal"] {
  border-radius: 18px !important;
  box-shadow: 0 24px 80px rgba(16, 19, 34, 0.24) !important;
}
#tqToast {
  border-radius: 12px !important;
  box-shadow: var(--au-shadow-2) !important;
}

/* ---------- 移动端（与 walk-fix 协同）---------- */
@media (max-width: 768px) {
  #tqOneBox { padding: 18px 16px 16px !important; border-radius: 16px !important; }
  main h1 { font-size: 21px !important; }
}

/* ============================================================
   v2 迭代：布局重构（启动台全宽 + 统计行下移）+ 画布质感
   ============================================================ */

/* 画布：顶部微光晕 */
body {
  background:
    radial-gradient(900px 320px at 70% -8%, rgba(139, 92, 246, 0.07), transparent 60%),
    radial-gradient(700px 300px at 8% 0%, rgba(59, 29, 143, 0.05), transparent 55%),
    var(--au-bg) !important;
}

/* 启动台占满内容宽度，统计行自然落到 Hero 下方 */
.launcher-head { display: block !important; }
.launcher-head > * { width: auto !important; }
#tqOneBox { width: 100% !important; box-sizing: border-box !important; }

/* 控制行单行化：下拉横排、按钮右送 */
#tqOneBox > div:nth-child(3) {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
}
#tqOneBox > div:nth-child(3) select { flex: 0 1 auto !important; min-width: 0 !important; }
#tqOneBox > div:nth-child(3) #tqOneGo { margin-left: auto !important; flex: 0 0 auto !important; }

/* 统计行（Hero 下方）：胶囊化 + 数字强调 */
.hero-stats {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin: 14px 0 4px !important;
  align-items: center !important;
}
.hero-stats .tag,
.hero-stats > * {
  background: var(--au-surface) !important;
  border: 1px solid var(--au-line) !important;
  border-radius: 999px !important;
  padding: 7px 16px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: var(--au-ink) !important;
  box-shadow: 0 1px 2px rgba(16, 19, 34, 0.04) !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* 搜索 / 筛选行与统计行之间留白 */
main h1 { margin-top: 26px !important; }

/* 右轨浮窗：等宽对齐 */
a[href*="/ideas.html?v="],
a[href*="/publish.html?v="],
a[href*="/qc.html?v="] { min-width: 132px !important; text-align: center !important; }

/* 项目卡标题/元信息字重 */
main .card b, main [class*="drama-card"] b { font-weight: 700 !important; }

@media (max-width: 900px) {
  #tqOneBox > div:nth-child(3) { flex-wrap: wrap !important; }
  #tqOneBox > div:nth-child(3) #tqOneGo { margin-left: 0 !important; width: 100% !important; }
}

/* ============================================================
   v3：副标语收编 + 新建项目品牌化
   ============================================================ */

/* 副标语：从悬浮残段收编为 Hero 下方的安静标语行 */
.launcher-sub {
  position: static !important;
  display: block !important;
  width: 100% !important;
  margin: -6px 0 14px !important;
  padding: 0 !important;
  font-size: 13px !important;
  color: var(--au-ink-3) !important;
  text-align: left !important;
  overflow: visible !important;
  white-space: normal !important;
  text-overflow: clip !important;
}

/* 新建项目：橙色孤行 → 品牌主按钮（作为项目区段的动作行） */
main button[class*="new"],
main .hero-actions button,
main button {
  font-family: var(--au-font) !important;
}
main button {
  border-radius: 12px !important;
  transition: filter 0.14s ease, transform 0.14s ease, box-shadow 0.14s ease, background 0.14s ease !important;
}

/* 筛选 chip 组（全部/待开始/进行中/已完成） */
main .filter button,
main [class*="filter"] button {
  border-radius: 999px !important;
  font-weight: 600 !important;
}

/* 排序下拉 */
main select {
  font-family: var(--au-font) !important;
}

/* ============================================================
   v4：全站页面模块（auto/publish/qc/ideas/login 通用）
   ============================================================ */

/* 通用表单控件 */
textarea, input[type="text"], input[type="password"], input[type="number"], input[type="date"], select {
  font-family: var(--au-font) !important;
  border-radius: 10px !important;
  border-color: var(--au-line-2) !important;
}
textarea:focus, input:focus, select:focus {
  outline: none !important;
  border-color: var(--au-brand-2) !important;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.13) !important;
}
button {
  font-family: var(--au-font) !important;
  letter-spacing: 0.2px !important;
}

/* 主行动按钮（绿色/橙色硬编码 → 品牌渐变统一） */
button[style*="background:#059669"],
button[style*="background:#059669;"],
button[style*="background:#ea580c"],
button[style*="background:#f97316"],
button[style*="background:#16a34a"] {
  background: linear-gradient(135deg, #8b5cf6, #5b2ee5) !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 16px rgba(124, 58, 237, 0.32) !important;
}

/* 面板/卡片类容器（各页 section 盒） */
body > .wrap, body > .container,
section[class*="panel"], div[class*="panel-"],
.card, .panel, .box, .sect {
  border-radius: 16px !important;
}

/* 表格 */
table { border-collapse: collapse !important; }
table th {
  background: var(--au-brand-soft) !important;
  color: var(--au-brand-deep) !important;
  font-weight: 700 !important;
}
table th, table td { border-color: var(--au-line) !important; }
table tr:hover td { background: #faf9ff !important; }

/* 登录页（login.html）：居中卡升级 */
body[class] .login-card, .login-wrap, #loginBox {
  border-radius: 20px !important;
  box-shadow: var(--au-shadow-2) !important;
}
button.btn-primary, .btn-primary {
  background: linear-gradient(135deg, #8b5cf6, #5b2ee5) !important;
  border: 0 !important;
  box-shadow: 0 4px 16px rgba(124, 58, 237, 0.3) !important;
  font-weight: 700 !important;
}

/* 页面主标题统一 */
h1, h2 { font-weight: 800 !important; letter-spacing: 0.2px !important; }

/* 链接 hover 一致 */
a { transition: color 0.14s ease; }

/* v3.1 移动端：h1 列与 Hero 同行挤压修复（生产 390 实拍）——
   launcher-head 的父容器是 Nuxt flex 行，窄屏强制堆叠；:has 现代浏览器可用，旧内核优雅降级 */
@media (max-width: 768px) {
  main > *:has(.launcher-head),
  body > *:has(.launcher-head),
  div:has(> .launcher-head) { display: block !important; width: 100% !important; }
  .launcher-head { width: 100% !important; }
  #tqOneBox { width: 100% !important; }
}

/* v3.2 精确修复：.head-left（tqOneBox 直接父级）被 Nuxt 定宽——390 实测窄列竖排根因 */
@media (max-width: 768px) {
  .launcher-head { display: block !important; width: 100% !important; }
  .launcher-head .head-left {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
    min-width: 0 !important;
  }
}

/* v3.3 根因修复：.head-left 是 flex 行，启动台卡与标语并排 → 卡被压缩至 126px 竖排
   （diag3 实测 disp=flex w=358 / box w=126）。移动端改纵向堆叠，卡全宽。 */
@media (max-width: 768px) {
  .head-left { flex-direction: column !important; }
  #tqOneBox { width: 100% !important; flex: 1 1 auto !important; }
}

/* ============================================================
   v4：全站内容列居中 + 限宽（用户反馈：靠左/顶部过宽）
   统一内容列 = 1180px 居中；顶栏全幅但内容随列居中
   ============================================================ */

:root { --au-col: 1180px; }

main.content,
main {
  max-width: var(--au-col) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box !important;
}
.page {
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 顶栏：全幅背景 + 内容随列居中（padding 百分比=视口差值的一半） */
header.header {
  box-sizing: border-box !important;
  padding-left: max(20px, calc((100% - var(--au-col)) / 2)) !important;
  padding-right: max(20px, calc((100% - var(--au-col)) / 2)) !important;
}

/* 新手横幅：随内容列居中 */
#tqNewbieCard {
  max-width: calc(var(--au-col) - 48px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 大屏（>1600px）内容列略放宽，保持呼吸感 */
@media (min-width: 1600px) {
  :root { --au-col: 1320px; }
}