:root {
  --ink: #17211f;
  --muted: #6f7b77;
  --line: #dde4df;
  --surface: #ffffff;
  --canvas: #f4f7f3;
  --forest: #173f35;
  --forest-2: #285f4f;
  --mint: #dff2e6;
  --mint-2: #eef8f1;
  --gold: #c7954b;
  --amber: #fff1d6;
  --red: #a94b45;
  --shadow: 0 18px 50px rgba(31, 61, 51, 0.08);
}

/* Smart editing workspace ------------------------------------------------ */
.editing-capability-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0;
}
.editing-capability-strip > div {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
}
.editing-capability-strip b { color: var(--forest); }
.editing-capability-strip span { color: var(--muted); font-size: .9rem; }
.editing-project-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.editing-project-card {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.editing-project-card header,
.editing-project-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.editing-project-card h3 { margin: 18px 0 8px; font-size: 1.12rem; }
.editing-project-card p { min-height: 42px; margin: 0; color: var(--muted); }
.editing-project-card footer { margin-top: 18px; color: var(--muted); font-size: .82rem; }
.editing-project-card footer > div { display: flex; gap: 6px; }
.editing-project-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 16px 0;
}
.editing-project-facts span { padding: 9px; border-radius: 10px; background: var(--mint-2); color: var(--muted); font-size: .78rem; }
.editing-project-facts b { display: block; color: var(--forest); font-size: 1rem; }
.editing-workspace-toolbar { margin-bottom: 16px; }
.editing-layout {
  display: grid;
  grid-template-columns: minmax(220px, .75fr) minmax(420px, 1.5fr) minmax(260px, .85fr);
  gap: 14px;
  align-items: stretch;
}
.editing-assets-panel,
.editing-preview-panel,
.editing-review-panel { padding: 18px; min-width: 0; }
.search-box.compact { min-height: 42px; margin-bottom: 12px; }
.editing-asset-bin {
  display: grid;
  gap: 10px;
  max-height: 570px;
  overflow: auto;
  padding-right: 4px;
}
.editing-asset-bin article {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 10px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--canvas);
}
.editing-asset-bin img,
.editing-asset-bin video { width: 72px; height: 72px; object-fit: cover; border-radius: 9px; background: #0c1512; }
.editing-audio-thumb { display: grid; width: 72px; height: 72px; place-items: center; border-radius: 9px; color: #dff2e6; background: linear-gradient(145deg, #173f35, #35765f); font-size: 28px; }
.editing-asset-bin article > div { display: grid; gap: 3px; align-content: center; min-width: 0; }
.editing-asset-bin b,
.editing-asset-bin span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.editing-asset-bin span { color: var(--muted); font-size: .76rem; }
.editing-asset-bin .mini-button { justify-self: start; margin-top: 3px; }
.editing-project-settings {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) repeat(3, minmax(95px, .35fr));
  gap: 10px;
  margin-bottom: 14px;
}
.editing-project-settings label { display: grid; gap: 5px; color: var(--muted); font-size: .78rem; }
.editing-project-settings input,
.editing-project-settings select { min-width: 0; }
.editing-audio-settings {
  display: grid;
  grid-template-columns: minmax(210px, .8fr) minmax(180px, .55fr) minmax(260px, 1fr);
  gap: 10px;
  align-items: end;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--mint-2);
}
.editing-audio-settings > label { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 9px; align-items: center; color: var(--muted); font-size: .78rem; }
.editing-audio-settings > label:first-child { grid-template-columns: 1fr; }
.editing-audio-settings select,
.editing-audio-settings input { min-width: 0; }
.editing-audio-settings input[type="range"] { padding: 0; }
#editing-background-preview { min-width: 0; display: grid; grid-template-columns: minmax(90px, .5fr) minmax(140px, 1fr); gap: 10px; align-items: center; }
#editing-background-preview span { color: var(--muted); font-size: .8rem; }
#editing-background-preview b { overflow: hidden; color: var(--forest); font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
#editing-background-preview audio { width: 100%; height: 36px; }
.editing-preview-stage {
  display: grid;
  place-items: center;
  min-height: 470px;
  overflow: hidden;
  border-radius: 18px;
  background: #111a17;
}
.editing-preview-stage > div { display: grid; gap: 6px; color: #dce8e3; text-align: center; }
.editing-preview-stage > div span { color: #91a49c; }
.editing-preview-stage img,
.editing-preview-stage video { display: block; max-width: 100%; max-height: 570px; object-fit: contain; }
.editing-preview-meta { display: flex; justify-content: space-between; gap: 12px; padding-top: 12px; }
.editing-preview-meta span { color: var(--muted); font-size: .84rem; text-align: right; }
.editing-review-status { display: grid; gap: 8px; margin: 12px 0; }
.editing-review-status .status { justify-self: start; }
.editing-review-status small { color: var(--muted); line-height: 1.5; }
.editing-suggestion-list { display: grid; gap: 8px; max-height: 310px; overflow: auto; margin-bottom: 12px; }
.editing-suggestion-list article { display: grid; gap: 4px; padding: 11px 12px; border-left: 3px solid var(--forest-2); border-radius: 8px; background: var(--mint-2); }
.editing-suggestion-list article.warning { border-left-color: #c68b2c; background: #fff7e8; }
.editing-suggestion-list article.blocking { border-left-color: #b64b44; background: #fff0ee; }
.editing-suggestion-list article span { color: var(--muted); font-size: .82rem; line-height: 1.5; }
.editing-review-panel > label { display: grid; gap: 6px; color: var(--muted); font-size: .82rem; }
.editing-review-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.editing-timeline-panel,
.editing-render-panel { margin-top: 14px; padding: 18px; }
.editing-timeline { display: flex; gap: 10px; overflow-x: auto; padding: 6px 2px 14px; }
.editing-clip {
  position: relative;
  flex: 0 0 360px;
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--canvas);
}
.editing-clip.selected { border-color: var(--forest-2); box-shadow: 0 0 0 2px rgba(36,112,84,.12); }
.editing-clip > img,
.editing-clip > video { width: 80px; height: 100%; min-height: 118px; object-fit: cover; border-radius: 10px; background: #101816; }
.editing-clip-number { position: absolute; top: 5px; left: 5px; z-index: 2; padding: 3px 6px; border-radius: 7px; background: rgba(9,41,31,.82); color: white; font-size: .7rem; }
.editing-clip-fields { display: grid; gap: 7px; min-width: 0; }
.editing-clip-fields > b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.editing-clip-fields > div { display: grid; grid-template-columns: .55fr .55fr 1.2fr; gap: 5px; }
.editing-clip-fields label { display: grid; gap: 3px; color: var(--muted); font-size: .68rem; }
.editing-clip-fields input,
.editing-clip-fields select { min-width: 0; min-height: 34px; padding: 6px 7px; font-size: .76rem; }
.editing-clip-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 5px; }
.editing-timeline-empty { flex: 1; display: grid; justify-items: center; gap: 5px; padding: 38px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); }
.editing-render-row {
  display: grid;
  grid-template-columns: auto minmax(220px, 1fr) minmax(220px, .7fr) auto;
  gap: 14px;
  align-items: center;
  padding: 13px 0;
  border-top: 1px solid var(--line);
}
.editing-render-row:first-child { border-top: 0; }
.editing-render-row > div:nth-child(2) { display: grid; gap: 3px; }
.editing-render-row span,
.editing-render-row small { color: var(--muted); }
.task-type-badge.editing_project { background: #e4f0ff; color: #27558f; }
.agent-node.video_editing b:first-of-type { color: var(--forest-2); }
.agent-check { display: flex !important; grid-template-columns: auto 1fr; align-items: start; }
.agent-check input { width: auto; margin-top: 3px; }
.agent-check span { display: grid; gap: 3px; }

@media (max-width: 1320px) {
  .editing-project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .editing-layout { grid-template-columns: 240px minmax(420px, 1fr); }
  .editing-review-panel { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .editing-capability-strip,
  .editing-project-grid,
  .editing-layout { grid-template-columns: 1fr; }
  .editing-project-settings { grid-template-columns: 1fr 1fr; }
  .editing-audio-settings { grid-template-columns: 1fr; }
  .editing-preview-stage { min-height: 360px; }
  .editing-render-row { grid-template-columns: 1fr; }
}

* { box-sizing: border-box; }
html { background: var(--canvas); }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 92% 2%, rgba(185, 221, 202, 0.25), transparent 26rem),
    var(--canvas);
  font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 252px 1fr; }
.sidebar {
  position: sticky; top: 0; height: 100vh; padding: 28px 20px 20px;
  color: #eaf3ef; background: #102d27;
  display: flex; flex-direction: column;
  box-shadow: 10px 0 40px rgba(16, 45, 39, 0.12);
}
.brand { display: flex; align-items: center; gap: 13px; padding: 0 8px 24px; }
.brand-mark {
  width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.24); border-radius: 14px;
  display: grid; place-items: center; color: #143d33; background: #dbeee3;
  font-family: Georgia, serif; font-weight: 800; font-size: 20px;
}
.brand strong, .brand span { display: block; }
.brand strong { font-size: 17px; letter-spacing: .04em; }
.brand span { margin-top: 4px; color: #8eb1a7; font-size: 10px; letter-spacing: .15em; text-transform: uppercase; }
.stage-badge {
  margin: 0 8px 26px; padding: 9px 11px; border: 1px solid rgba(167, 209, 190, .15);
  border-radius: 10px; color: #b8d2c9; background: rgba(255,255,255,.045); font-size: 12px;
}
.stage-badge i, .domain-chip i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #66c390; margin-right: 7px; box-shadow: 0 0 0 4px rgba(102,195,144,.12); }
.nav-list { display: grid; gap: 6px; }
.nav-item {
  width: 100%; display: flex; align-items: center; gap: 13px; border: 0; border-radius: 11px;
  padding: 12px 13px; color: #9fbab2; background: transparent; text-align: left; transition: .18s ease;
}
.nav-item:hover { color: white; background: rgba(255,255,255,.055); }
.nav-item.active { color: #12392f; background: #dceee4; box-shadow: 0 8px 24px rgba(0,0,0,.12); font-weight: 650; }
.nav-icon { width: 22px; font-size: 17px; text-align: center; }
.sidebar-footer {
  margin-top: auto; display: flex; gap: 10px; align-items: center; padding: 15px 9px 4px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.tenant-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #173f35; background: #c8e1d3; font-weight: 700; }
.sidebar-footer strong, .sidebar-footer span { display: block; }
.sidebar-footer strong { font-size: 12px; }
.sidebar-footer span { margin-top: 3px; color: #7e9d94; font-size: 10px; }

.main-panel { min-width: 0; padding: 0 42px 60px; }
.topbar {
  min-height: 104px; display: flex; justify-content: space-between; align-items: center;
  border-bottom: 1px solid rgba(118, 136, 130, .16);
}
.eyebrow, .section-kicker { margin: 0 0 7px; color: #779087; font-size: 9px; font-weight: 750; letter-spacing: .18em; }
.topbar h1 { margin: 0; font-family: Georgia, "Songti SC", serif; font-size: 25px; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.domain-chip, .provider-chip, .policy-pill {
  padding: 9px 12px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.75); color: #52645e; font-size: 11px;
}
.provider-chip.ready { color: #216047; background: #e8f6ed; border-color: #c6e6d2; }
.provider-chip.waiting { color: #8a622a; background: #fff6e6; border-color: #f0d8aa; }

.page { display: none; padding-top: 30px; animation: reveal .22s ease; }
.page.active { display: block; }
@keyframes reveal { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.hero-panel {
  min-height: 386px; overflow: hidden; position: relative; display: grid; grid-template-columns: 1.15fr .85fr;
  border: 1px solid rgba(32, 87, 70, .12); border-radius: 22px; background:
    linear-gradient(110deg, rgba(255,255,255,.98), rgba(238,247,240,.95)); box-shadow: var(--shadow);
}
.hero-panel::before { content: ""; position: absolute; width: 340px; height: 340px; border: 1px solid rgba(55, 108, 88, .08); border-radius: 50%; right: -80px; top: -130px; }
.hero-copy { padding: 52px 20px 45px 52px; align-self: center; }
.hero-label { display: inline-flex; padding: 7px 10px; border-radius: 8px; color: #42655a; background: #e3f0e7; font-size: 10px; letter-spacing: .09em; }
.hero-copy h2 { margin: 22px 0 16px; font-family: Georgia, "Songti SC", serif; font-size: clamp(31px, 3.5vw, 48px); line-height: 1.2; font-weight: 500; letter-spacing: -.02em; }
.hero-copy h2 em { color: var(--forest-2); font-style: normal; }
.hero-copy p { max-width: 650px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.85; }
.hero-actions { display: flex; gap: 10px; margin-top: 28px; }
.primary-button, .ghost-button {
  border-radius: 10px; padding: 10px 15px; border: 1px solid transparent; font-weight: 650; font-size: 12px; transition: .18s ease;
}
.primary-button { color: white; background: var(--forest); box-shadow: 0 8px 20px rgba(23,63,53,.16); }
.primary-button:hover { background: #235848; transform: translateY(-1px); }
.ghost-button { color: #40554e; background: white; border-color: var(--line); }
.ghost-button:hover { border-color: #a8bcb4; background: #f8fbf9; }

.hero-orbit { position: relative; min-height: 360px; margin: 12px 25px 12px 0; }
.hero-orbit::before, .hero-orbit::after { content: ""; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); border: 1px dashed rgba(52,101,84,.25); border-radius: 50%; }
.hero-orbit::before { width: 300px; height: 300px; }
.hero-orbit::after { width: 210px; height: 210px; }
.orbit-center { position: absolute; z-index: 2; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 128px; height: 128px; border-radius: 50%; display: grid; place-content: center; text-align: center; color: white; background: linear-gradient(145deg,#17483b,#2c705c); box-shadow: 0 24px 45px rgba(28,86,68,.25); }
.orbit-center b { font-family: Georgia, serif; font-size: 34px; line-height: 1; }
.orbit-center span { margin-top: 8px; font-size: 10px; color: #cce3d8; }
.orbit-node { position: absolute; z-index: 3; padding: 8px 11px; border: 1px solid #d6e4dc; border-radius: 9px; color: #476057; background: white; box-shadow: 0 10px 24px rgba(30,75,60,.09); font-size: 11px; }
.orbit-node.n1 { left: 6%; top: 17%; }.orbit-node.n2 { right: 2%; top: 22%; }.orbit-node.n3 { right: 0; bottom: 21%; }.orbit-node.n4 { left: 13%; bottom: 9%; }.orbit-node.n5 { left: -1%; top: 48%; }

.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 18px 0; }
.stat-card { padding: 20px 21px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.88); }
.stat-card span { color: var(--muted); font-size: 11px; }.stat-card strong { display: block; margin: 8px 0 5px; font-family: Georgia, serif; font-size: 30px; font-weight: 500; }.stat-card small { color: #87938f; font-size: 10px; }
.two-column-grid, .settings-grid { display: grid; grid-template-columns: .95fr 1.35fr; gap: 16px; }
.panel { border: 1px solid var(--line); border-radius: 16px; padding: 22px; background: rgba(255,255,255,.9); box-shadow: 0 10px 32px rgba(36,63,53,.04); }
.panel-heading, .section-toolbar { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.panel-heading h3 { margin: 0; font-size: 15px; }.muted { color: var(--muted); font-size: 10px; }
.stage-list { display: grid; gap: 2px; margin-top: 17px; }
.stage-item { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-top: 1px solid #edf1ee; }
.stage-item b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; color: #285a4a; background: var(--mint); font-size: 10px; }.stage-item span { font-size: 11px; }.stage-item small { color: #8a9691; font-size: 9px; }.stage-item small.ready { color: #2b7857; }.stage-item small.waiting_for_key { color: #a06d25; }
.workflow-panel { overflow: hidden; }
.flow-row { display: flex; align-items: stretch; margin-top: 22px; }
.flow-row > i { align-self: center; margin: 0 5px; color: #92a39d; font-style: normal; }
.flow-step { min-width: 105px; flex: 1; border: 1px solid var(--line); border-radius: 12px; padding: 13px; background: #fbfcfb; }
.flow-step.accent { border-color: #bcdacb; background: var(--mint-2); }.flow-step.warning { border-color: #eed5a6; background: #fff9ee; }
.flow-step b, .flow-step span, .flow-step small { display: block; }.flow-step b { color: #91a19b; font-size: 9px; }.flow-step span { margin: 10px 0 5px; font-weight: 700; font-size: 11px; }.flow-step small { color: #89948f; font-size: 9px; }
.policy-note { display: flex; gap: 10px; margin-top: 17px; padding: 12px 13px; border-left: 3px solid var(--gold); color: #796442; background: #fff9ed; font-size: 10px; }

.section-toolbar { margin-bottom: 20px; align-items: center; }
.section-toolbar h2 { margin: 0 0 8px; font-family: Georgia, "Songti SC", serif; font-size: 27px; font-weight: 500; }
.section-toolbar p { margin: 0; color: var(--muted); font-size: 12px; }
.toolbar-count { display: grid; place-items: center; min-width: 70px; height: 58px; border-radius: 14px; color: #1f5543; background: var(--mint); font-family: Georgia, serif; font-size: 24px; }
.filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 13px; }
.search-box { min-width: 300px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.search-box input { width: 100%; border: 0; outline: 0; padding: 10px 0; background: transparent; font-size: 12px; }
select, input, textarea { border: 1px solid #d8e1dc; border-radius: 9px; padding: 10px 11px; color: var(--ink); background: white; outline: none; }
select:focus, input:focus, textarea:focus { border-color: #77a892; box-shadow: 0 0 0 3px rgba(85,148,119,.11); }
.filter-bar select { min-width: 125px; font-size: 11px; }
.table-panel { overflow: auto; border: 1px solid var(--line); border-radius: 14px; background: white; }
table { width: 100%; border-collapse: collapse; }
th { padding: 12px 15px; color: #7d8985; background: #f5f8f5; font-size: 9px; letter-spacing: .08em; text-align: left; white-space: nowrap; }
td { padding: 13px 15px; border-top: 1px solid #edf1ee; vertical-align: middle; font-size: 11px; }
tbody tr:hover { background: #fbfdfb; }
.cell-primary { display: block; max-width: 300px; font-weight: 700; overflow-wrap: anywhere; }.cell-secondary { display: block; margin-top: 4px; color: #83908b; font-size: 9px; }
.job-error { max-width: 260px; color: #9a4d46; line-height: 1.45; }
.tag { display: inline-flex; align-items: center; padding: 5px 8px; border-radius: 999px; color: #335f50; background: #e8f3ec; font-size: 9px; }.tag.video { color: #725128; background: #fff0d6; }.tag.image { color: #584e7b; background: #eeeafa; }.tag.audio { color: #316078; background: #e5f2f8; }
.status { display: inline-flex; padding: 5px 8px; border-radius: 7px; color: #687772; background: #eef2ef; font-size: 9px; }.status.queued, .status.ready, .status.approved, .status.completed { color: #216a49; background: #e1f3e8; }.status.review_required, .status.pending, .status.provider_submitted, .status.submitted, .status.processing, .status.running, .status.planning, .status.in_progress { color: #936524; background: #fff1d6; }.status.rejected, .status.failed { color: #95433e; background: #fde9e7; }.status.draft { color: #5e687a; background: #eceff5; }
.mini-button { border: 1px solid #d5dfda; border-radius: 8px; padding: 6px 8px; margin: 2px; color: #36534a; background: white; font-size: 9px; }.mini-button:hover { border-color: #8cb09f; }.mini-button.danger { color: #9a4942; }

.asset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.asset-card { min-width: 0; overflow: hidden; display: grid; grid-template-rows: 178px 1fr; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 8px 24px rgba(25,66,52,.035); }
.asset-preview { position: relative; width: 100%; height: 178px; overflow: hidden; padding: 0; border: 0; border-bottom: 1px solid #e7eee9; border-radius: 0; background: linear-gradient(135deg, #eff7f2, #e4f0e9); cursor: pointer; }
.asset-preview > img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .25s ease; }.asset-preview:hover > img { transform: scale(1.025); }
.asset-preview-placeholder { width: 100%; height: 100%; display: grid; place-content: center; justify-items: center; gap: 9px; color: #477161; background: radial-gradient(circle at 76% 22%, rgba(125,183,155,.24), transparent 34%), linear-gradient(135deg, #f3f8f5, #e7f2ec); }
.asset-preview-placeholder b { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 17px; color: #225a47; background: rgba(255,255,255,.82); font: 700 22px Georgia, serif; box-shadow: 0 8px 24px rgba(30,78,60,.08); }.asset-preview-placeholder span { font-size: 10px; }
.asset-preview-placeholder.video { color: #685a42; background: linear-gradient(135deg, #f7f4ed, #ede8dc); }.asset-preview-placeholder.audio { color: #365d71; background: linear-gradient(135deg, #f1f7f9, #e3eff3); }
.asset-type { position: absolute; left: 14px; top: 14px; display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; border: 1px solid rgba(255,255,255,.72); border-radius: 999px; color: #245b49; background: rgba(236,248,241,.9); font-size: 10px; font-weight: 700; backdrop-filter: blur(8px); }
.asset-card-body { min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 17px 18px 16px; }.asset-card h3 { margin: 0; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }.asset-card p { margin: -3px 0 0; color: var(--muted); font-size: 10px; }
.asset-tags { display: flex; flex-wrap: wrap; gap: 5px; min-height: 24px; }.asset-tags span { padding: 4px 7px; border: 1px solid #dfeae4; border-radius: 999px; color: #3f6658; background: #f4f8f6; font-size: 9px; }
.asset-meta { display: flex; flex-wrap: wrap; gap: 6px; }.asset-card-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 2px; }.asset-card-actions .mini-button { margin: 0; text-decoration: none; }
.asset-preview-modal { gap: 15px; }.asset-preview-viewer { min-height: 280px; max-height: 44vh; overflow: hidden; display: grid; place-items: center; border: 1px solid #dbe6e0; border-radius: 13px; background: #13231e; }
.asset-preview-viewer img,.asset-preview-viewer video { width: 100%; max-height: 44vh; display: block; object-fit: contain; }.asset-preview-viewer iframe { width: 100%; height: min(44vh, 460px); border: 0; background: white; }.asset-preview-viewer pre { width: 100%; max-height: 44vh; overflow: auto; margin: 0; padding: 24px; color: #253b33; background: white; font: 13px/1.8 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; white-space: pre-wrap; box-sizing: border-box; }
.asset-audio-preview { width: min(520px, 90%); display: grid; gap: 20px; justify-items: center; color: #d9eee5; }.asset-audio-preview span { font-size: 62px; }.asset-audio-preview audio { width: 100%; }.asset-preview-empty { display: grid; justify-items: center; gap: 14px; color: #d4e4dd; text-align: center; }.asset-preview-empty b { width: 72px; height: 72px; display: grid; place-items: center; border: 1px solid #49675c; border-radius: 20px; font: 30px Georgia,serif; }.asset-preview-empty p { margin: 0; font-size: 11px; }
.asset-preview-meta { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }.asset-preview-meta div { min-width: 0; padding: 10px 12px; border-radius: 10px; background: #f1f6f3; }.asset-preview-meta span { display: block; color: var(--muted); font-size: 9px; }.asset-preview-meta b { display: block; margin-top: 5px; color: #29483d; font-size: 11px; overflow-wrap: anywhere; }.asset-tag-editor { display: grid; gap: 6px; }
.asset-preview-viewer.is-comparison { display: block; min-height: 0; max-height: none; overflow: visible; border: 0; background: transparent; }
.clothes-comparison-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.clothes-comparison-panel { min-width: 0; margin: 0; padding: 12px; border: 1px solid #dbe6e0; border-radius: 14px; background: #f5f8f6; }
.clothes-comparison-panel.after { border-color: #aacdbd; background: #edf6f1; }
.clothes-comparison-panel figcaption { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px; padding: 2px 0 12px; }
.clothes-comparison-panel figcaption b { color: #214b3c; font-size: 15px; }
.clothes-comparison-panel figcaption span { color: #718178; font-size: 11px; }
.clothes-comparison-image { height: clamp(240px,44vh,520px); display: grid; place-items: center; overflow: hidden; border-radius: 9px; background: #14241e; }
.asset-preview-viewer .clothes-comparison-image img { width: 100%; height: 100%; max-height: 100%; min-height: 0; object-fit: contain; }
.asset-preview-viewer .clothes-comparison-image img.hidden { display: none; }
.clothes-comparison-image p { margin: 0; padding: 28px; color: #d8e6de; text-align: center; font-size: 12px; line-height: 1.8; }
.clothes-comparison-panel > a { display: inline-flex; margin-top: 10px; text-decoration: none; }
.asset-comparison-notice { margin: 0; color: #718178; font-size: 11px; line-height: 1.7; }
@media (max-width: 600px) {
  .clothes-comparison-grid { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .clothes-comparison-image { height: min(55vh,420px); }
}
.asset-rights-panel { display: grid; gap: 10px; padding: 16px; border: 1px solid #ebd5a8; border-radius: 12px; background: #fffaf0; }
.asset-rights-panel[data-state="ready"] { border-color: #c6e0d2; background: #f2f9f5; }
.asset-rights-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.asset-rights-heading h4 { margin: 0; color: #244b3d; }
.asset-rights-panel p { margin: 0; color: #5c6e64; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
#asset-rights-form { display: grid; gap: 10px; }
#asset-rights-form.hidden { display: none; }
#asset-rights-form .checkbox-label { align-items: flex-start; line-height: 1.7; }
#asset-rights-form .checkbox-label input { flex: 0 0 auto; margin-top: 5px; }
#asset-rights-form button { justify-self: start; }
.asset-upload-dropzone { padding: 18px; border: 1px dashed #8eb5a3; border-radius: 13px; background: #f2f8f5; }.asset-upload-dropzone input { padding: 8px; background: white; }.asset-upload-dropzone span { color: var(--muted); font-weight: 400; }
.asset-upload-queue { max-height: 290px; overflow: auto; display: grid; gap: 7px; padding: 9px; border: 1px solid var(--line); border-radius: 12px; background: white; }.asset-upload-item { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 9px; background: #f5f8f6; }.asset-upload-item > span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 8px; color: #356653; background: #e2f1e9; font-size: 10px; }.asset-upload-item b,.asset-upload-item small { display: block; overflow-wrap: anywhere; }.asset-upload-item small { margin-top: 3px; color: var(--muted); }.asset-upload-item em { color: var(--muted); font-size: 10px; font-style: normal; }.asset-upload-item.success em { color: #26704f; }.asset-upload-item.failed em { max-width: 220px; color: #a44c44; text-align: right; }.asset-upload-item.uploading { background: #fff8eb; }
.pipeline-strip { display: flex; align-items: center; gap: 0; margin-bottom: 15px; padding: 13px 17px; border: 1px solid var(--line); border-radius: 12px; background: white; }
.pipeline-strip span { color: #8b9792; font-size: 10px; }.pipeline-strip span.done { color: #225e49; font-weight: 700; }.pipeline-strip i { flex: 1; height: 1px; margin: 0 12px; background: #dce4df; }
.risk-score { font-family: Georgia, serif; font-size: 16px; }.risk-score.high { color: var(--red); }.risk-score.medium { color: #9c6b2c; }.risk-score.low { color: #2d7658; }

.approval-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 16px; }.approval-kpi { padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: white; }.approval-kpi strong { font-family: Georgia, serif; font-size: 24px; }.approval-kpi span { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.approval-list { display: grid; gap: 10px; }.approval-card { display: grid; grid-template-columns: 42px 1fr auto; gap: 14px; align-items: center; padding: 16px 18px; border: 1px solid var(--line); border-radius: 13px; background: white; }.approval-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #edf4ef; color: #245e49; }.approval-card h4 { margin: 0 0 6px; font-size: 12px; }.approval-card p { margin: 0; color: var(--muted); font-size: 9px; }.approval-actions { display: flex; gap: 5px; }

.settings-grid { grid-template-columns: minmax(0, 1fr); }.settings-grid > * { min-width: 0; }.provider-card h3 { margin: 10px 0 7px; font-size: 17px; }.provider-card p { color: var(--muted); font-size: 10px; line-height: 1.6; }.provider-status-box { display: flex; justify-content: space-between; align-items: center; margin: 18px 0; padding: 13px; border-radius: 11px; background: #f4f8f5; }.provider-status-box span { font-size: 10px; }.provider-status-box strong { color: #9c6b2c; font-size: 10px; }.provider-status-box strong.ready { color: #22684a; }.code-line { padding: 10px; border-radius: 8px; background: #152621; color: #c9e3d8; font: 10px ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; }
.provider-list { min-width: 0; max-width: 100%; }.provider-table-wrap { width: 100%; max-width: 100%; min-width: 0; display: block; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }.provider-table { width: 1040px; min-width: 1040px; }.provider-table td { vertical-align: top; }.provider-name-cell,.provider-table td { min-width: 0; }.provider-name-cell b,.provider-name-cell span,.provider-name-cell small,.provider-cell-note { display: block; }.provider-name-cell span,.provider-name-cell small,.provider-cell-note { margin-top: 4px; color: var(--muted); font-size: 10px; }.provider-url { display: block; max-width: 250px; color: #49645b; font-size: 10px; overflow-wrap: anywhere; white-space: normal; }.provider-row-actions { min-width: 170px; display: flex; flex-wrap: wrap; gap: 4px; }.provider-row-actions .mini-button { margin: 0; }.routing-toolbar { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }.routing-toolbar label { display: grid; gap: 6px; color: var(--muted); font-size: 9px; }.routing-preview { display: grid; gap: 9px; }.routing-row { display: grid; grid-template-columns: minmax(110px, 1fr) 2fr 58px; gap: 10px; align-items: center; font-size: 10px; }.routing-bar { height: 8px; overflow: hidden; border-radius: 8px; background: #e7ede9; }.routing-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2c7b59, #75b896); }.routing-row.ineligible { opacity: .5; }.endpoint-panel { margin-top: 16px; }
.production-policy-panel { max-width: 900px; }.setting-switch-row { display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center; padding: 22px; border: 1px solid var(--line); border-radius: 14px; background: #f7faf8; }.setting-switch-row b { display: block; font-size: 15px; }.setting-switch-row p { max-width: 650px; margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.65; }.toggle-switch { position: relative; display: inline-flex; }.toggle-switch input { position: absolute; opacity: 0; pointer-events: none; }.toggle-switch span { width: 52px; height: 29px; display: block; border-radius: 999px; background: #cfd9d4; transition: .2s; cursor: pointer; }.toggle-switch span::after { content: ""; width: 23px; height: 23px; position: absolute; top: 3px; left: 3px; border-radius: 50%; background: white; box-shadow: 0 2px 8px rgba(24,55,45,.2); transition: .2s; }.toggle-switch input:checked + span { background: #246b51; }.toggle-switch input:checked + span::after { transform: translateX(23px); }.toggle-switch input:disabled + span { opacity: .55; cursor: wait; }
.endpoint-list { display: grid; gap: 7px; margin-top: 15px; }.endpoint-row { display: grid; grid-template-columns: 120px 1fr 50px; gap: 10px; align-items: center; padding: 10px 11px; border: 1px solid #edf1ee; border-radius: 9px; }.endpoint-row b { font-size: 10px; }.endpoint-row code { color: #4e625b; font-size: 9px; }.endpoint-row span { color: #82908b; font-size: 9px; text-align: right; }
.audit-panel { margin-top: 16px; }.audit-list { display: grid; margin-top: 15px; }.audit-row { display: grid; grid-template-columns: 125px 160px 1fr; gap: 16px; padding: 10px 0; border-top: 1px solid #edf1ee; font-size: 9px; }.audit-row time { color: #889590; }.audit-row b { color: #36534a; }.audit-row span { color: #71807a; }

dialog { width: min(620px, calc(100dvw - 32px)); max-width: calc(100dvw - 32px); max-height: calc(100dvh - 32px); overflow: hidden; border: 0; border-radius: 18px; padding: 0; box-shadow: 0 30px 90px rgba(19,46,38,.26); }
dialog.wide-dialog { width: min(880px, calc(100dvw - 32px)); }
dialog .modal-form { width: 100%; max-width: 100%; max-height: calc(100dvh - 32px); min-width: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
dialog::backdrop { background: rgba(13,32,27,.45); backdrop-filter: blur(3px); }
.modal-form { display: grid; gap: 15px; min-width: 0; padding: 24px; background: #fbfdfb; }.modal-form.wide { width: 100%; }.modal-form > *, .form-grid > *, .modal-form label { min-width: 0; }.modal-form input:not([type="checkbox"]):not([type="radio"]), .modal-form select, .modal-form textarea { width: 100%; max-width: 100%; min-width: 0; }.modal-heading { display: flex; justify-content: space-between; align-items: flex-start; min-width: 0; }.dialog-drag-handle { cursor: grab; user-select: none; touch-action: none; }.dialog-drag-handle:active { cursor: grabbing; }.modal-heading > div { min-width: 0; }.modal-heading h3 { overflow-wrap: anywhere; margin: 0; font-size: 18px; }.icon-button { flex: 0 0 auto; border: 0; color: #73817c; background: transparent; font-size: 22px; }.modal-form label { display: grid; gap: 7px; color: #586761; font-size: 10px; font-weight: 650; }.field-help { color: #7c8b85; font-size: 10px; font-weight: 400; line-height: 1.45; }.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.checkbox-label { grid-template-columns: 18px minmax(0, 1fr); align-items: center; align-content: center; padding-top: 22px; }.checkbox-label input { width: 15px; height: 15px; }.modal-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 5px; }.modal-form pre { max-width: 100%; max-height: 440px; overflow: auto; padding: 18px; border-radius: 12px; color: #d6e9e1; background: #14261f; font: 10px/1.7 ui-monospace, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.provider-credential-box { display: grid; gap: 12px; padding: 14px; border: 1px solid #d9e6e0; border-radius: 12px; background: #f4f8f6; }.provider-credential-box > b { color: #244a3d; font-size: 12px; }.provider-credential-box > small { color: #71827b; line-height: 1.55; }.provider-card-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }.recommendation-panel { margin-top: 16px; }.recommendation-list { display: grid; gap: 8px; }.recommendation-row { display: grid; grid-template-columns: minmax(160px,1fr) minmax(230px,1.3fr) auto; gap: 14px; align-items: center; padding: 12px 14px; border: 1px solid #e1ebe6; border-radius: 11px; background: #fbfdfc; }.recommendation-row div { display: grid; gap: 3px; min-width: 0; }.recommendation-row b, .recommendation-row strong { color: #173e32; overflow-wrap: anywhere; }.recommendation-row span { color: #75847e; font-size: 10px; line-height: 1.45; }.agent-asset-note { display: flex; justify-content: space-between; gap: 8px; padding: 8px 10px; border-radius: 9px; color: #22624d; background: #edf7f2; font-size: 10px; }.asset-open-button { display: inline-flex; justify-content: center; margin-top: 10px; text-decoration: none; }
.provider-material-modal { max-height: calc(100dvh - 32px); }.provider-material-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 11px; background: #eef6f2; }.provider-material-toolbar p { margin: 0; color: var(--muted); font-size: 12px; }.provider-material-toolbar > div { display: flex; flex-wrap: wrap; gap: 7px; }.provider-material-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.provider-material-columns > section { min-width: 0; padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: white; }.remote-material-list { display: grid; gap: 7px; max-height: 260px; overflow: auto; margin: 12px 0; }.remote-material-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 10px; border: 1px solid #e5ece8; border-radius: 9px; background: #f8fbf9; }.remote-material-row b, .remote-material-row span { display: block; overflow-wrap: anywhere; }.remote-material-row b { font-size: 12px; }.remote-material-row span { margin-top: 3px; color: var(--muted); font-size: 10px; }.remote-material-form { display: grid; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }.remote-material-form > b { color: #244a3d; font-size: 13px; }.remote-material-form label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; }
.provider-face-auth-panel { display: grid; gap: 9px; padding: 13px; border: 1px solid #d6b76f; border-radius: 10px; color: #624b1d; background: #fff8e7; }.provider-face-auth-panel.hidden { display: none; }.provider-face-auth-panel > b { font-size: 13px; }.provider-face-auth-panel p { margin: 0; font-size: 12px; line-height: 1.6; }.provider-face-auth-panel > div { display: flex; flex-wrap: wrap; gap: 8px; }.provider-face-auth-panel a { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.provider-local-upload-form { margin-top: 4px; }.provider-file-picker input[type="file"] { padding: 10px; border: 1px dashed #9ab7aa; border-radius: 9px; background: #f5faf7; cursor: pointer; }.provider-upload-result { display: grid; grid-template-columns: 104px minmax(0,1fr); gap: 12px; align-items: center; padding: 12px; border: 1px solid #acd2bd; border-radius: 11px; background: #edf8f1; }.provider-upload-result.hidden { display: none; }.provider-upload-result img { width: 104px; height: 104px; border-radius: 9px; background: #dfe9e4; object-fit: contain; }.provider-upload-result > div { display: grid; min-width: 0; gap: 6px; }.provider-upload-result b { overflow-wrap: anywhere; color: #204d3d; font-size: 12px; }.provider-upload-result label,.provider-upload-result small { color: #657970; font-size: 10px; }.provider-copy-url-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; }.provider-copy-url-row input { min-width: 0; font-size: 10px; }.provider-copy-url-row button { white-space: nowrap; }.provider-recent-local-block { display: grid; gap: 8px; padding: 11px 0 2px; }.provider-recent-local-block > b { color: #244a3d; font-size: 12px; }.provider-local-image-list { display: grid; gap: 6px; }.provider-local-image-row { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 8px; align-items: center; padding: 7px; border: 1px solid #e2ebe6; border-radius: 9px; background: #fafcfb; }.provider-local-image-row img { width: 42px; height: 42px; border-radius: 7px; background: #e8efeb; object-fit: cover; }.provider-local-image-row div { min-width: 0; }.provider-local-image-row b,.provider-local-image-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.provider-local-image-row b { font-size: 10px; }.provider-local-image-row small { margin-top: 3px; color: var(--muted); font-size: 9px; }.provider-local-image-row aside { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.provider-setup-callout { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 10px 0; padding: 11px 12px; border: 1px solid #e7c992; border-radius: 10px; background: #fff8e9; }.provider-setup-callout > div { display: grid; gap: 3px; }.provider-setup-callout b { color: #704d17; font-size: 11px; }.provider-setup-callout span { color: #8b744d; font-size: 9px; }.compact-button { flex: 0 0 auto; padding: 8px 12px; font-size: 10px; }.edit-provider-button { border-color: #77a58e; color: #175642; background: #edf7f2; font-weight: 700; }
.form-feedback { display: none; padding: 11px 13px; border: 1px solid #efc8c4; border-radius: 9px; color: #8d3e38; background: #fff0ee; font-size: 10px; line-height: 1.5; }.form-feedback.show { display: block; }.form-feedback.success { border-color: #b9dcc8; color: #206045; background: #eaf7ef; }.primary-button:disabled, .ghost-button:disabled { cursor: wait; opacity: .58; }.result-modal { width: min(430px, calc(100vw - 36px)); justify-items: center; padding: 34px; text-align: center; }.result-icon { display: grid; width: 54px; height: 54px; place-items: center; border-radius: 50%; color: white; background: #287052; box-shadow: 0 10px 24px rgba(32, 96, 69, .2); font-size: 26px; font-weight: 700; }.result-modal h3 { margin: -4px 0 0; font-size: 21px; }.result-modal p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }.result-details { display: grid; width: 100%; gap: 0; overflow: hidden; border: 1px solid #dfe8e3; border-radius: 11px; background: #f7faf8; text-align: left; }.result-detail { display: grid; grid-template-columns: 105px 1fr; gap: 10px; padding: 10px 12px; border-bottom: 1px solid #e5ece8; font-size: 10px; }.result-detail:last-child { border-bottom: 0; }.result-detail span { color: var(--muted); }.result-detail b { overflow-wrap: anywhere; color: #263b34; }.result-modal .modal-actions { width: 100%; justify-content: center; }.result-modal .primary-button { min-width: 145px; }
.text-result-dialog { width: min(900px, calc(100dvw - 32px)); }.text-result-modal { gap: 18px; }.text-result-meta { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 8px; }.text-result-meta span { min-width: 0; padding: 10px 12px; border-radius: 9px; color: var(--muted); background: #f1f6f3; font-size: 11px; }.text-result-meta b { display: block; margin-top: 5px; overflow-wrap: anywhere; color: #29453b; font-size: 12px; }.generated-text-output { min-height: 260px; max-height: min(58vh, 620px); overflow: auto; padding: 22px 24px; border: 1px solid #dce6e0; border-radius: 12px; color: #263b34; background: white; font: 14px/1.9 -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; white-space: pre-wrap; overflow-wrap: anywhere; user-select: text; }
.toast { position: fixed; z-index: 99; inset: auto 24px 22px auto; width: max-content; min-width: 230px; max-width: min(430px, calc(100vw - 32px)); margin: 0; transform: translateY(20px); opacity: 0; pointer-events: none; border: 1px solid rgba(255,255,255,.18); padding: 14px 17px; border-radius: 11px; color: white; background: #173f35; box-shadow: 0 16px 48px rgba(0,0,0,.28); font-size: 13px; font-weight: 650; line-height: 1.55; text-wrap: balance; transition: .22s ease; }.toast.show { transform: none; opacity: 1; }.empty-state { padding: 45px 20px; color: var(--muted); text-align: center; font-size: 11px; }

/* 全站可读性：正文、表格、标签、表单和辅助信息统一提升字号。 */
body { font-size: 15px; }
.nav-item { font-size: 14px; }
.brand span, .sidebar-footer span { font-size: 12px; }
.sidebar-footer strong { font-size: 14px; }
.eyebrow, .section-kicker { font-size: 11px; }
.topbar h1 { font-size: 29px; }
.domain-chip, .provider-chip, .policy-pill { font-size: 13px; }
.hero-label, .flow-step b, .flow-step small, .stage-item small { font-size: 11px; }
.panel-heading h3 { font-size: 18px; }
.muted, .policy-note, .stat-card small { font-size: 12px; }
.stage-item span, .flow-step span, .stat-card span { font-size: 13px; }
.section-toolbar h2 { font-size: 31px; }
.section-toolbar p { font-size: 14px; }
.search-box input, .filter-bar select, .filter-bar input { font-size: 13px; }
th { font-size: 11px; }
td { font-size: 13px; line-height: 1.5; }
.cell-secondary, .tag, .status, .mini-button { font-size: 11px; }
.asset-card h3 { font-size: 17px; }
.asset-card p, .pipeline-strip span { font-size: 12px; }
.approval-kpi span, .approval-card p { font-size: 11px; }
.approval-card h4, .provider-connection h4 { font-size: 14px; }
.provider-card p, .provider-status-box span, .provider-status-box strong, .routing-row, .endpoint-row b, .endpoint-row code, .endpoint-row span, .audit-row { font-size: 11px; }
.provider-health-warning { margin: 10px 0; padding: 9px 11px; border: 1px solid #efc4bd; border-radius: 9px; background: #fff1ef; color: #9b433b !important; font-size: 12px !important; }
.modal-form label, .form-feedback, .result-detail { font-size: 12px; }
.result-modal p { font-size: 13px; }

.filter-result { margin-left: auto; color: var(--muted); font-size: 12px; white-space: nowrap; }
.pagination { display: flex; justify-content: space-between; align-items: center; min-height: 44px; margin-top: 10px; padding: 7px 2px; color: var(--muted); font-size: 12px; }
.pagination-summary { flex: 0 0 auto; line-height: 1.5; white-space: nowrap; }.pagination-buttons,.pagination-nav,.pagination-pages { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }.pagination-buttons { justify-content: flex-end; }.pagination-pages { justify-content: center; }.pagination .mini-button:disabled { cursor: default; opacity: .45; }.pagination .page-number.active { border-color: #24664f; color: white; background: #24664f; }.page-ellipsis { display: inline-flex; align-items: center; padding: 0 2px; }
.section-toolbar > .toolbar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.compact-filter { margin: 16px 0 4px; }.compact-filter .search-box { min-width: 260px; flex: 1; }
.source-badge { max-width: 520px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: white; font-size: 11px; line-height: 1.5; text-align: right; }
.billing-identity-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 16px; margin-bottom: 16px; }
.user-profile-card h3, .balance-card h3 { margin: 0 0 16px; font-size: 19px; }
.profile-layout { display: flex; align-items: center; gap: 13px; margin-bottom: 17px; }.profile-avatar { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 15px; color: white; background: linear-gradient(145deg, #1d5747, #3e8669); font-size: 21px; font-weight: 750; }.profile-layout strong, .profile-layout span { display: block; }.profile-layout strong { font-size: 16px; }.profile-layout span { margin-top: 4px; color: var(--muted); font-size: 12px; }
.profile-details { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0; }.profile-details div { min-width: 0; padding: 10px 11px; border-radius: 9px; background: #f5f8f6; }.profile-details dt { color: var(--muted); font-size: 11px; }.profile-details dd { overflow-wrap: anywhere; margin: 5px 0 0; font-size: 13px; font-weight: 650; }
.balance-card { container-type: inline-size; min-width: 0; padding: 24px; background: linear-gradient(135deg, #173f35, #245f4d); color: #fff; }
.balance-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.balance-heading .section-kicker { color: #b8d4c8; font-size: 10px; letter-spacing: .16em; }
.balance-heading h3 { margin: 7px 0 0; font-size: 19px; line-height: 1.4; }
.balance-unit { flex-shrink: 0; padding-top: 2px; color: #b8d4c8; font-size: 11px; line-height: 1.5; white-space: nowrap; }
.balance-value { display: flex; justify-content: flex-end; margin: 24px 0 22px; font-size: 40px; font-size: clamp(28px, 10cqi, 48px); line-height: 1.15; }
.balance-amount { display: inline-flex; align-items: baseline; justify-content: flex-end; gap: .18em; max-width: 100%; font-family: "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif; font-variant-numeric: lining-nums tabular-nums; font-feature-settings: "lnum" 1, "tnum" 1; font-weight: 600; letter-spacing: 0; white-space: nowrap; }
.balance-currency { flex-shrink: 0; font-size: .56em; font-weight: 500; }
.balance-digits { min-width: 0; }
.balance-amount-long { font-size: .82em; }
.balance-amount-extra-long { font-size: .66em; }
.balance-unavailable { color: #b8d4c8; }
.balance-breakdown { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 0; padding: 16px 0; border-top: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); }
.balance-breakdown > div { min-width: 0; padding-right: 18px; }
.balance-breakdown > div + div { padding: 0 0 0 18px; border-left: 1px solid rgba(255,255,255,.18); }
.balance-breakdown dt { color: #b8d4c8; font-size: 12px; line-height: 1.5; }
.balance-breakdown dd { margin: 8px 0 0; font-size: 18px; font-size: clamp(14px, 4.6cqi, 20px); line-height: 1.3; text-align: right; }
.balance-breakdown .balance-currency { font-size: .78em; }
.balance-card .balance-policy { margin: 18px 0; color: #c2dbd0; font-size: 12px; line-height: 1.75; }
.balance-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.balance-actions .mini-button { min-width: 0; min-height: 40px; margin: 0; padding: 9px 8px; border-color: rgba(255,255,255,.25); border-radius: 9px; font-size: 11px; font-weight: 600; line-height: 1.5; }
.balance-actions .mini-button + .mini-button { color: #e8f3ed; background: rgba(255,255,255,.08); }
.balance-actions .mini-button:hover { border-color: #b5d1c4; background: #edf6f1; color: #173f35; }
.balance-actions .mini-button:focus-visible { outline: 2px solid #e4f4eb; outline-offset: 3px; }
.balance-card .balance-footnote { margin: 12px 0 0; color: #b8d4c8; font-size: 11px; line-height: 1.65; }
@media (max-width: 1100px) { .billing-identity-grid { grid-template-columns: minmax(0, 1fr); } }
@container (max-width: 300px) {
  .balance-heading { gap: 8px; }
  .balance-heading .section-kicker { font-size: 9px; letter-spacing: .1em; }
  .balance-heading h3 { font-size: 18px; }
  .balance-breakdown > div { padding-right: 12px; }
  .balance-breakdown > div + div { padding-left: 12px; }
  .balance-actions { grid-template-columns: minmax(0, 1fr); }
}
.billing-filters { padding: 20px; margin-bottom: 16px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.9); }
.billing-filter-fields { display: grid; grid-template-columns: minmax(220px,1.7fr) repeat(3,minmax(0,1fr)); gap: 14px; }
.billing-filter-field { display: grid; gap: 8px; min-width: 0; color: #536b60; font-size: 12px; font-weight: 600; }
.billing-filters input,.billing-filters select { width: 100%; min-width: 0; height: 44px; margin: 0; padding: 10px 12px; font-size: 13px; font-weight: 400; line-height: 1.5; background: #fff; }
.billing-filters input[type="date"] { font-variant-numeric: lining-nums tabular-nums; }
.billing-filter-footer { display: grid; grid-template-columns: minmax(160px,200px) minmax(0,1fr) auto; align-items: end; gap: 14px; margin-top: 16px; }
.billing-date-range { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: end; gap: 10px; max-width: 460px; }
.billing-date-range[hidden] { display: none; }
.billing-date-separator { align-self: end; line-height: 44px; color: var(--muted); font-size: 12px; }
.billing-query-button { grid-column: 3; min-width: 112px; height: 44px; padding: 10px 26px; border-radius: 9px; font-weight: 650; }
.billing-query-button:focus-visible { outline: 3px solid #83b89e; outline-offset: 3px; }
.billing-query-button:disabled { cursor: wait; opacity: .65; transform: none; }
.billing-filter-feedback { margin: 12px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.billing-filter-feedback.is-pending { color: #916416; }
.billing-filter-feedback.is-error { color: #b64739; }
@media (max-width:1100px) { .billing-filter-fields { grid-template-columns: repeat(2,minmax(0,1fr)); } .billing-filter-footer { grid-template-columns: minmax(150px,1fr) auto; } .billing-date-range { grid-column: 1 / -1; grid-row: 2; max-width: none; } .billing-query-button { grid-column: 2; grid-row: 1; } }
@media (max-width:600px) { .billing-filters { padding: 16px; } .billing-filter-fields { grid-template-columns: minmax(0,1fr); gap: 12px; } .billing-filter-footer { grid-template-columns: minmax(0,1fr); gap: 12px; } .billing-date-range { gap: 6px; } .billing-filters input[type="date"] { padding: 8px 5px; font-size: 12px; } .billing-query-button { grid-column: 1; grid-row: auto; width: 100%; } .billing-filter-feedback { font-size: 11px; } }
.billing-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 15px 0; }.billing-stats .stat-card { min-width: 0; }.billing-stats .stat-card strong { overflow-wrap: anywhere; font-size: 25px; }
.billing-analysis-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 16px; }
.billing-detail-panel .panel-heading { flex-wrap: wrap; gap: 16px; }
.billing-detail-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.billing-trend, .billing-breakdown { display: grid; gap: 10px; margin-top: 18px; }.trend-row { display: grid; grid-template-columns: 90px minmax(110px, 1fr) 48px 105px; gap: 10px; align-items: center; font-size: 11px; }.trend-row time { color: var(--muted); }.trend-row span { color: var(--muted); text-align: right; }.trend-bar { height: 9px; overflow: hidden; border-radius: 10px; background: #e7ede9; }.trend-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2b7257, #79b896); }
.breakdown-row { display: grid; grid-template-columns: minmax(110px, 1fr) 1.2fr 42px; gap: 10px; align-items: center; }.breakdown-row span b, .breakdown-row span small { display: block; }.breakdown-row span b { font-size: 13px; }.breakdown-row span small { margin-top: 4px; color: var(--muted); font-size: 11px; }.breakdown-row strong { font-size: 12px; text-align: right; }
.billing-detail-panel, .billing-transactions-panel { margin-top: 16px; }.billing-detail-panel .table-panel, .billing-transactions-panel .table-panel { margin-top: 15px; }.billing-detail-panel table { min-width: 1180px; }.billing-transactions-panel table { min-width: 900px; }

.menu-inaccessible { display: none !important; }
.permission-empty { padding: 32px; }
.permission-empty p { color: var(--muted); line-height: 1.7; }

/* 接入与运行：模型服务 / 发布平台子模块 */
.submodule-tabs { display: inline-flex; gap: 4px; margin: 0 0 18px; padding: 4px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.78); }
.submodule-tabs button { border: 0; border-radius: 8px; padding: 9px 14px; color: #66766f; background: transparent; font-size: 13px; font-weight: 650; }
.submodule-tabs button.active { color: white; background: var(--forest); box-shadow: 0 6px 15px rgba(23,63,53,.14); }
.publishing-platform-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.publishing-platform-card { display: grid; gap: 12px; min-width: 0; padding: 19px; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 10px 28px rgba(36,63,53,.045); }
.publishing-platform-card > header, .publishing-platform-card > footer { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.publishing-platform-card h3 { margin: 0; font-size: 19px; }.publishing-platform-card > p { margin: -5px 0 0; color: var(--muted); font-size: 12px; }
.publishing-platform-card > code { overflow-wrap: anywhere; padding: 9px 10px; border-radius: 8px; color: #d7eee4; background: #173129; font: 11px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }
.publishing-scope, .publishing-account { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 7px 10px; align-items: baseline; padding: 10px 11px; border-radius: 9px; background: #f4f8f5; }
.publishing-scope span, .publishing-account span { color: var(--muted); font-size: 11px; }.publishing-scope b, .publishing-account b { overflow-wrap: anywhere; font-size: 12px; }
.publishing-account small { grid-column: 2; overflow-wrap: anywhere; color: #76857f; font-size: 10px; line-height: 1.5; }
.publishing-platform-card details { padding: 10px 11px; border: 1px solid #e4ebe7; border-radius: 9px; color: #50645d; background: #fbfdfc; font-size: 11px; }
.publishing-platform-card summary { cursor: pointer; color: #315a4c; font-weight: 700; }.publishing-platform-card details ul { margin: 10px 0; padding-left: 19px; line-height: 1.65; }.publishing-platform-card details p { margin: 8px 0 0; color: var(--muted); line-height: 1.6; }
.publishing-platform-card > footer { align-items: center; margin-top: auto; }.publishing-platform-card > footer .mini-button { display: inline-flex; align-items: center; justify-content: center; min-height: 31px; text-decoration: none; }
.publishing-api-note { display: grid; gap: 5px; padding: 12px 14px; border-left: 3px solid #4b876d; border-radius: 8px; color: #536760; background: #edf6f0; }
.publishing-api-note b { color: #235c47; font-size: 13px; }.publishing-api-note span { overflow-wrap: anywhere; font: 11px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }.publishing-api-note p { margin: 2px 0 0; font-size: 11px; line-height: 1.6; }
.publishing-required-box { padding: 12px 14px; border: 1px solid #e5dfcf; border-radius: 9px; background: #fffaf0; }.publishing-required-box > b { color: #775e35; font-size: 12px; }.publishing-required-box ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 24px; margin: 9px 0 0; padding-left: 18px; color: #695c45; font-size: 11px; line-height: 1.5; }
.manual-publishing-message { grid-column: 1 / -1; padding: 14px; border: 1px dashed #c7d7cf; border-radius: 9px; color: #526760; background: #f3f8f5; font-size: 12px; line-height: 1.65; }
.account-isolation-note { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; padding: 13px 16px; border: 1px solid #cfe2d8; border-left: 4px solid #2f775d; border-radius: 10px; color: #526760; background: #eef7f2; font-size: 12px; line-height: 1.6; }
.account-isolation-note strong { flex: 0 0 auto; color: #245c47; }
.account-isolation-note.compact { margin: 0; }
.publishing-target-section { display: grid; gap: 12px; min-width: 0; padding: 14px; border: 1px solid #d8e4de; border-radius: 12px; background: #f7faf8; }
.publishing-target-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.publishing-target-heading b,.publishing-target-heading small { display: block; }
.publishing-target-heading b { color: #294e41; font-size: 13px; }
.publishing-target-heading small { max-width: 680px; margin-top: 4px; color: var(--muted); font-size: 10px; font-weight: 400; line-height: 1.55; }
.publishing-target-heading > span { flex: 0 0 auto; padding: 5px 8px; border-radius: 999px; color: #356552; background: #e6f2eb; font-size: 10px; font-weight: 700; }
.publishing-target-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; min-width: 0; max-height: 245px; overflow: auto; }
.publishing-target-choice { display: grid !important; grid-template-columns: 18px minmax(0,1fr) auto !important; gap: 9px; align-items: center; min-width: 0; margin: 0; padding: 11px 12px; border: 1px solid #dce6e0; border-radius: 10px; background: white; cursor: pointer; transition: border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.publishing-target-choice:hover,.publishing-target-choice:has(input:checked) { border-color: #73a98f; background: #f0f8f3; box-shadow: 0 5px 14px rgba(33,87,65,.07); }
.publishing-target-choice.manual:has(input:checked) { border-color: #d6aa64; background: #fff9ec; }
.publishing-target-choice input { width: 16px; height: 16px; margin: 0; accent-color: #21684e; }
.publishing-target-choice > span { min-width: 0; }
.publishing-target-choice b,.publishing-target-choice small { display: block; overflow-wrap: anywhere; }
.publishing-target-choice b { color: #29483d; font-size: 12px; }
.publishing-target-choice small { margin-top: 4px; color: #72827c; font-size: 9px; font-weight: 400; line-height: 1.45; }
.publishing-target-choice em { align-self: start; padding: 4px 7px; border-radius: 999px; color: #267052; background: #e2f3e9; font-size: 9px; font-style: normal; font-weight: 750; white-space: nowrap; }
.publishing-target-choice.manual em { color: #805b24; background: #fff0d3; }
.publishing-target-empty { grid-column: 1 / -1; display: grid; gap: 6px; justify-items: start; padding: 18px; border: 1px dashed #c9d8d1; border-radius: 10px; color: #536b62; background: white; }
.publishing-target-empty b { font-size: 12px; }.publishing-target-empty span { color: var(--muted); font-size: 10px; line-height: 1.6; }
.asset-publishing-summary { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 15px; align-items: center; min-width: 0; padding: 12px; border: 1px solid #dce6e0; border-radius: 12px; background: white; }
.asset-publishing-summary > img,.asset-publishing-summary > .asset-preview-placeholder { width: 150px; height: 96px; border-radius: 9px; object-fit: cover; }
.asset-publishing-summary > div:last-child { display: grid; gap: 5px; min-width: 0; }.asset-publishing-summary > div:last-child > b { overflow-wrap: anywhere; color: #213f35; font-size: 15px; }.asset-publishing-summary > div:last-child > small { color: var(--muted); font-size: 10px; line-height: 1.5; }
.publishing-consent { display: grid !important; grid-template-columns: 18px minmax(0,1fr) !important; gap: 9px; align-items: start; padding: 12px 14px; border-radius: 10px; color: #725a2e !important; background: #fff8e9; font-size: 11px !important; font-weight: 550 !important; line-height: 1.55; }
.publishing-consent input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: #21684e; }
.publishing-action-button { color: #1f694d !important; border-color: #9ac9b3 !important; background: #edf8f2 !important; }
.publishing-composer-dialog { width: min(880px, calc(100dvw - 32px)); }
.platform-compose-section { display: grid; gap: 14px; padding: 17px; border: 1px solid #cbded4; border-radius: 13px; background: linear-gradient(135deg, #f7fbf8, #edf6f0); }
.platform-compose-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }.platform-compose-heading h4 { margin: 0 0 5px; font-size: 17px; }.platform-compose-heading p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }.platform-compose-heading .mini-button { flex: 0 0 auto; }
.publishing-field-groups { display: grid; gap: 12px; }.publishing-field-group { padding: 13px; border: 1px solid #dfe9e3; border-radius: 11px; background: rgba(255,255,255,.9); }.publishing-field-group h5 { margin: 0 0 11px; color: #35604f; font-size: 12px; }.publishing-field-group textarea { resize: vertical; }.publishing-field-group .field-help { min-height: 16px; }
.publishing-checkbox-field { grid-template-columns: 20px 1fr !important; align-items: flex-start; align-content: flex-start; min-height: 62px; padding: 11px; border: 1px solid #e0e8e3; border-radius: 9px; background: #f8fbf9; }.publishing-checkbox-field input { width: 16px; height: 16px; margin-top: 2px; }.publishing-checkbox-field span, .publishing-checkbox-field b, .publishing-checkbox-field small { display: block; }.publishing-checkbox-field b { color: #354d44; font-size: 12px; }.publishing-checkbox-field small { margin-top: 5px; color: var(--muted); font-size: 10px; font-weight: 400; line-height: 1.45; }
.drama-publishing-panel { margin: 0 0 15px; }.publishing-panel-actions { display: flex; align-items: center; gap: 8px; }.publishing-panel-note { margin: 9px 0 14px; color: var(--muted); font-size: 12px; line-height: 1.6; }.publishing-profile-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }.publishing-profile-item { display: grid; gap: 7px; min-width: 0; padding: 10px 11px; border: 1px solid #e2e9e5; border-radius: 9px; background: #f8fbf9; }.publishing-profile-item span, .publishing-profile-item span small { display: block; }.publishing-profile-item span { color: #66766f; font-size: 10px; }.publishing-profile-item span small { margin-top: 3px; color: #94a09b; font: 9px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; }.publishing-profile-item b { overflow: hidden; color: #304a40; font-size: 12px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }.publishing-profile-item.missing { border-color: #e8b9b4; background: #fff3f1; }.publishing-profile-item.missing b { color: #994a43; }
.drama-card-tags .profile-ready { color: #236848; background: #e1f3e8; }.drama-card-tags .profile-missing { color: #914640; background: #fde9e7; }
.publishing-edit-toolbar { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: end; }.publishing-edit-toolbar > label { min-width: 0; }.publishing-edit-toolbar .mini-button { min-height: 39px; margin: 0; }

/* 登录与会话 */
.auth-pending { display: none !important; }
.login-screen { position: fixed; z-index: 200; inset: 0; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(500px, .85fr); min-height: 100vh; color: #eaf5ef; background: #102f28; }
.login-screen.hidden { display: none; }.login-visual { display: grid; align-content: center; padding: clamp(45px, 8vw, 120px); background: radial-gradient(circle at 70% 20%, rgba(119,190,157,.2), transparent 30%), linear-gradient(140deg,#102f28,#1c5945); }
.login-visual h1 { margin: 15px 0; font-family: Georgia,"Songti SC",serif; font-size: clamp(48px,7vw,88px); font-weight: 500; letter-spacing: .08em; }.login-visual p { max-width: 680px; color: #bcd4c9; font-size: 17px; line-height: 1.9; }
.login-flow { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 35px; }.login-flow span { padding: 9px 13px; border: 1px solid rgba(206,235,221,.18); border-radius: 999px; background: rgba(255,255,255,.05); font-size: 12px; }.login-flow i { color: #80b69e; font-style: normal; }
.login-card { display: grid; align-content: start; gap: 18px; min-width: 0; max-height: 100dvh; overflow-y: auto; padding: clamp(28px, 5vw, 72px); color: var(--ink); background: #f6f8f6; }.login-card h2 { margin: 6px 0; font-family: Georgia,"Songti SC",serif; font-size: 32px; font-weight: 500; }.login-card p,.login-card small { margin: 0; color: var(--muted); }.login-card label { display: grid; gap: 7px; min-width: 0; color: #465b53; font-size: 13px; font-weight: 650; }.login-card input { min-width: 0; min-height: 46px; font-size: 14px; }.login-brand { color: #173f35; }.user-chip { padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: #466158; background: white; font-size: 11px; }
.auth-heading p { line-height: 1.6; }.auth-view-tabs,.login-method-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 11px; background: #e6ede9; }.auth-view-tabs button,.login-method-tabs button { min-height: 38px; border: 0; border-radius: 8px; color: #667b72; background: transparent; font-weight: 700; cursor: pointer; }.auth-view-tabs button.active,.login-method-tabs button.active { color: #174d3a; background: white; box-shadow: 0 3px 10px rgba(21,62,47,.08); }
.auth-view,.auth-form { display: none; }.auth-view.active,.auth-form.active { display: grid; gap: 15px; animation: reveal .18s ease; }.login-method-tabs { margin-bottom: 1px; }.auth-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; min-width: 0; }.auth-code-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; }.auth-code-row button { min-width: 116px; margin: 0; }.auth-form > small { font-size: 11px; line-height: 1.5; }.auth-consent { grid-template-columns: 18px 1fr !important; align-items: start; font-weight: 500 !important; line-height: 1.45; }.auth-consent input { width: 16px; min-height: 16px; margin-top: 2px; }.auth-consent span { color: #60746c; font-size: 11px; }
.social-login-section { display: grid; gap: 11px; }.auth-divider { display: flex; align-items: center; gap: 12px; color: #84938d; font-size: 10px; }.auth-divider::before,.auth-divider::after { content: ""; flex: 1; height: 1px; background: #d8e1dc; }.social-login-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.social-login-grid button { display: grid; grid-template-columns: 31px 1fr; grid-template-rows: auto auto; gap: 1px 8px; align-items: center; min-width: 0; padding: 9px; border: 1px solid #d6e1db; border-radius: 10px; color: #39564a; background: white; text-align: left; cursor: pointer; }.social-login-grid button:hover:not(:disabled) { border-color: #69a086; background: #f2f8f4; }.social-login-grid button:disabled { cursor: not-allowed; opacity: .56; }.social-login-grid b { grid-row: 1 / 3; display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; color: white; font-size: 12px; }.social-login-grid b.wechat { background: #20b766; }.social-login-grid b.alipay { background: #1677ff; }.social-login-grid b.douyin { background: #16181c; }.social-login-grid span { overflow: hidden; font-size: 12px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }.social-login-grid small { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.oauth-config-note { font-size: 10px; line-height: 1.5; }
.oauth-dialog { width: min(430px,calc(100dvw - 24px)); }.oauth-dialog-body { display: grid; gap: 13px; justify-items: center; padding: 2px 24px 26px; text-align: center; }.oauth-qr-frame { display: grid; width: 230px; height: 230px; place-items: center; padding: 10px; border: 1px solid #d7e2dc; border-radius: 16px; background: white; }.oauth-qr-frame img { display: block; width: 100%; height: 100%; object-fit: contain; }.oauth-dialog-body p { margin: 0; color: #40584e; line-height: 1.6; }.oauth-dialog-body small { color: var(--muted); font-size: 10px; line-height: 1.5; }
.credential-security-note,.sms-provider-note { display: block; color: #74877e; font-size: 10px; line-height: 1.55; }
.auth-link-button { justify-self: center; padding: 2px 4px; border: 0; color: #2f6a55; background: transparent; font-size: 11px; cursor: pointer; }
.auth-link-button:hover { color: #154c38; text-decoration: underline; }
.sms-provider-note.unavailable { color: #9b4c45; }
.sms-provider-note.available { color: #286c51; }
.social-register-section { margin-top: 14px; }
.social-register-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }

.account-summary-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; margin-bottom: 16px; }
.account-summary-card { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.88); box-shadow: 0 8px 24px rgba(24,66,51,.05); }
.account-summary-card span { display: block; margin-bottom: 8px; color: var(--muted); font-size: 11px; }
.account-summary-card strong { display: block; overflow-wrap: anywhere; color: #173f35; font-size: 24px; }
.account-summary-card small { display: block; margin-top: 6px; color: #789087; font-size: 10px; line-height: 1.45; }
.account-list-panel,.password-panel { margin-top: 16px; }
.account-list-panel .panel-heading { gap: 20px; align-items: end; }
.search-box.compact { width: min(380px,45vw); min-width: 240px; }
.account-table { min-width: 1120px; }
.account-level-badge { display: inline-flex; margin-top: 4px; padding: 3px 7px; border-radius: 999px; color: #27644d; background: #e3f2e9; font-size: 9px; }
.account-contact { display: grid; gap: 3px; color: #526960; font-size: 10px; }
.account-contact span:empty::after { content: "未绑定"; color: #9aa6a1; }
.password-form { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) auto; gap: 12px; align-items: end; margin-top: 15px; }
.password-form label { display: grid; gap: 7px; color: #4f645b; font-size: 11px; font-weight: 650; }
.password-form .form-feedback { grid-column: 1 / -1; }
.account-dialog { width: min(720px,calc(100vw - 28px)); }

/* 多模态生产任务 */
.job-input-assets { display: grid; gap: 12px; min-width: 0; padding: 14px; border: 1px solid #d8e4de; border-radius: 11px; background: #f6faf7; }.job-input-assets-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; }.job-input-assets b { font-size: 12px; }.job-input-assets span { color: var(--muted); font-size: 11px; }.job-asset-source-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(230px, .65fr); gap: 10px; min-width: 0; }.job-asset-library, .job-local-upload { display: grid; align-content: start; gap: 9px; min-width: 0; padding: 11px; border: 1px solid #e0e9e4; border-radius: 10px; background: rgba(255,255,255,.7); }.job-asset-source-title b,.job-asset-source-title small { display: block; }.job-asset-source-title b { color: #35554a; font-size: 12px; }.job-asset-source-title small { margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.45; }.job-asset-picker { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; max-height: 230px; min-width: 0; overflow: auto; }.job-asset-choice { display: grid !important; grid-template-columns: 18px minmax(0,1fr) !important; gap: 9px; align-items: center; min-width: 0; padding: 10px; border: 1px solid #e1e9e4; border-radius: 9px; background: white; }.job-asset-choice input { width: 16px; height: 16px; }.job-asset-choice span { min-width: 0; }.job-asset-choice b,.job-asset-choice small { display: block; overflow-wrap: anywhere; }.job-asset-choice b { font-size: 12px; }.job-asset-choice small { margin-top: 3px; color: var(--muted); font-size: 10px; }.local-file-picker { display: block !important; padding: 13px 12px; border: 1px dashed #7fae98; border-radius: 9px; color: #245f49 !important; background: #edf7f1; text-align: center; cursor: pointer; }.local-file-picker:hover { border-color: #397d60; background: #e5f3eb; }.local-file-picker input { position: absolute; width: 1px !important; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }.local-file-picker span { color: inherit; font-size: 12px; font-weight: 700; }.job-local-upload p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }.local-upload-status { min-height: 18px; color: #2b6b51; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }.local-upload-status.error { color: #9a4943; }
.production-summary-strip { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 9px; margin-bottom: 13px; }.production-summary-strip article { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.82); }.production-summary-strip span { color: var(--muted); font-size: 11px; }.production-summary-strip b { color: #235d46; font: 500 22px Georgia,serif; }.live-refresh-state { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; white-space: nowrap; }.live-refresh-state i { width: 7px; height: 7px; border-radius: 50%; background: #4f9f76; box-shadow: 0 0 0 4px rgba(79,159,118,.12); }.task-type-badge { display: inline-flex; margin-bottom: 5px; padding: 4px 7px; border-radius: 999px; color: #35604f; background: #e8f3ec; font-size: 9px; font-weight: 750; }.task-type-badge.short_drama { color: #6b5130; background: #f7eedc; }.task-type-badge.agent_workflow { color: #4f4e78; background: #eeedf8; }.unified-progress { min-width: 150px; }.unified-progress > div { display: flex; justify-content: space-between; margin-bottom: 6px; color: #52675f; font-size: 10px; }.unified-progress > div b { color: #226148; font-size: 12px; }.unified-progress > i { display: block; overflow: hidden; height: 8px; border-radius: 999px; background: #e8eeea; }.unified-progress > i em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#286b51,#7eb79d); transition: width .3s ease; }.unified-progress.failed > i em { background: #b35c55; }.unified-stage { display: grid; gap: 5px; }.unified-stage b { font-size: 12px; }.unified-stage span { color: var(--muted); font-size: 10px; }.task-parent-link { display: block; margin-top: 4px; color: #5d7e70; font-size: 9px; }

/* 智能体可视化编排 */
.agent-workspace-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 12px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.78); }.agent-workspace-bar h2 { margin: 2px 0 3px; font-family: Georgia,"Songti SC",serif; font-size: 24px; font-weight: 500; }.agent-workspace-bar p { margin: 0; color: var(--muted); font-size: 11px; }.agent-workspace-bar .toolbar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }.agent-workspace-bar button { min-height: 38px; padding: 0 13px; }.agent-studio { display: grid; grid-template-columns: 188px minmax(700px,1fr) 286px; gap: 10px; align-items: stretch; min-height: 720px; }.agent-sidebar,.agent-inspector,.agent-canvas-panel { min-width: 0; padding: 12px; }.agent-sidebar h3,.agent-inspector h3 { margin: 3px 0 10px; font-size: 15px; }.agent-sidebar hr { height: 1px; margin: 12px 0; border: 0; background: var(--line); }.agent-sidebar p { margin: -6px 0 8px; color: var(--muted); font-size: 10px; }
.agent-workflow-list { display: grid; gap: 6px; max-height: 142px; overflow: auto; }.agent-workflow-item { display: grid; gap: 4px; width: 100%; padding: 8px 9px; border: 1px solid #e1e8e4; border-radius: 9px; color: #43584f; background: #fafcfb; text-align: left; }.agent-workflow-item b { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.agent-workflow-item span { color: var(--muted); font-size: 9px; }.agent-workflow-item.active { border-color: #77a991; color: #164c38; background: #eaf5ee; }
.agent-sidebar .pagination { display: grid; grid-template-columns: minmax(0,1fr); gap: 8px; align-items: stretch; min-height: 0; padding: 9px 0 2px; }.agent-sidebar .pagination-summary { width: 100%; padding-bottom: 7px; border-bottom: 1px solid #e4ebe7; text-align: center; }.agent-sidebar .pagination-buttons { display: grid; grid-template-columns: minmax(0,1fr); gap: 6px; width: 100%; }.agent-sidebar .pagination-pages { grid-row: 1; min-height: 32px; }.agent-sidebar .pagination-nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; width: 100%; }.agent-sidebar .pagination .mini-button { width: 100%; min-width: 0; min-height: 31px; padding: 0 5px; }.agent-sidebar .pagination .page-number { width: 34px; }
.agent-node-library { display: grid; gap: 5px; }.agent-node-library button { display: grid; grid-template-columns: 28px 1fr; gap: 7px; align-items: center; padding: 7px; border: 1px solid #dfe8e3; border-radius: 9px; color: #354f45; background: white; text-align: left; cursor: grab; }.agent-node-library button > b { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; color: white; background: #2a6b52; font-size: 10px; }.agent-node-library span,.agent-node-library small { display: block; }.agent-node-library span { font-size: 10px; font-weight: 700; }.agent-node-library small { margin-top: 1px; color: var(--muted); font-size: 8px; font-weight: 400; }
.agent-node-library [data-agent-node-type="digital_human"] > b { background: linear-gradient(145deg,#554f8b,#8580bc); }.agent-node-library [data-agent-node-type="clothes_change"] > b { background: linear-gradient(145deg,#96672d,#cca763); }
.agent-canvas-panel { display: grid; grid-template-rows: auto 1fr; gap: 11px; overflow: hidden; }.agent-canvas-heading { display: grid; grid-template-columns: minmax(220px,1fr) 120px auto; gap: 10px; align-items: end; }.agent-canvas-heading label { display: grid; gap: 5px; color: var(--muted); font-size: 10px; }.agent-canvas-heading input,.agent-canvas-heading select { min-height: 36px; }.agent-canvas-heading > span { padding-bottom: 10px; color: var(--muted); font-size: 10px; }
.agent-canvas { position: relative; overflow: auto; min-height: 650px; height: calc(100dvh - 330px); max-height: 860px; border: 1px solid #cfddd5; border-radius: 12px; background-color: #f6faf7; background-image: radial-gradient(#b9cec3 1px,transparent 1px); background-size: 20px 20px; }.agent-canvas.drag-over { outline: 2px solid #4b8c6e; outline-offset: -4px; }.agent-canvas svg,.agent-canvas #agent-node-layer { position: absolute; inset: 0; width: 1800px; height: 1050px; }.agent-canvas svg { overflow: visible; pointer-events: none; }.agent-edge { fill: none; stroke: #81a795; stroke-width: 2.5; stroke-dasharray: 6 4; }.agent-edge-arrow { fill: #4e836b; }
.agent-node { position: absolute; display: grid; grid-template-columns: 38px 1fr; gap: 10px; width: 188px; min-height: 82px; padding: 12px; border: 1px solid #cadbd2; border-radius: 12px; color: #304c41; background: white; box-shadow: 0 8px 20px rgba(24,67,51,.09); cursor: move; user-select: none; }.agent-node.selected { border-color: #267353; box-shadow: 0 0 0 3px rgba(52,132,96,.13),0 10px 24px rgba(24,67,51,.12); }.agent-node-index { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 9px; color: white; background: #1d5b45; font: 700 12px Georgia,serif; }.agent-node b,.agent-node span,.agent-node small { display: block; }.agent-node b { margin: 2px 0 5px; font-size: 12px; }.agent-node span { color: #668078; font-size: 9px; }.agent-node small { margin-top: 5px; overflow: hidden; color: #87958f; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.agent-node-port { position: absolute; top: 35px; width: 10px; height: 10px; border: 2px solid white; border-radius: 50%; background: #4a866b; }.agent-node-port.in { left: -6px; }.agent-node-port.out { right: -6px; }.agent-canvas-empty { position: absolute; inset: 0; display: grid; place-content: center; color: #6f827a; text-align: center; pointer-events: none; }.agent-canvas-empty b,.agent-canvas-empty span { display: block; }.agent-canvas-empty span { margin-top: 7px; font-size: 11px; }
.agent-node.digital_human { border-color: #cbc8e4; background: linear-gradient(145deg,#fff,#f4f3fb); }.agent-node.digital_human .agent-node-index { background: #5c578d; }.agent-node.clothes_change { border-color: #e1d1b7; background: linear-gradient(145deg,#fff,#fbf7ee); }.agent-node.clothes_change .agent-node-index { background: #986b32; }
.agent-node.start,.agent-node.end { border-width: 2px; background: #eef8f2; }.agent-node.end { background: #f7f3e8; }.agent-inspector-empty { padding: 18px 13px; border: 1px dashed #cbd9d2; border-radius: 10px; color: var(--muted); font-size: 11px; line-height: 1.7; }.agent-node-form { display: grid; gap: 10px; align-content: start; max-height: 650px; overflow: auto; }.agent-node-guide { padding: 10px; border-left: 3px solid #3d8768; border-radius: 8px; color: #466157; background: #edf6f1; font-size: 10px; line-height: 1.55; }.agent-node-guide b,.agent-node-guide span { display: block; }.agent-node-guide span { margin-top: 4px; color: #688078; }.agent-node-form label { display: grid; gap: 5px; color: #52675f; font-size: 10px; }.agent-node-form label small { color: #82928c; font-size: 9px; line-height: 1.45; }.agent-node-form textarea { min-height: 80px; resize: vertical; }.agent-node-form .danger-link { border: 0; color: #9a4943; background: transparent; font-size: 11px; text-align: left; }.schedule-mode-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.schedule-mode-grid label { display: grid; grid-template-columns: 18px 1fr; gap: 8px; align-items: start; padding: 11px; border: 1px solid #d9e4de; border-radius: 10px; background: #f8fbf9; cursor: pointer; }.schedule-mode-grid input { margin-top: 3px; }.schedule-mode-grid b,.schedule-mode-grid small { display: block; }.schedule-mode-grid small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.agent-dedicated-workflow-note { padding: 10px 11px; border: 1px solid #d8e3de; border-left: 3px solid #5f739b; border-radius: 9px; background: #f3f6fa; line-height: 1.5; }.agent-dedicated-workflow-note b,.agent-dedicated-workflow-note span { display: block; }.agent-dedicated-workflow-note b { color: #3d526c; font-size: 11px; }.agent-dedicated-workflow-note span { margin-top: 3px; color: var(--muted); font-size: 9px; }.agent-node-form .agent-rights-confirm { grid-template-columns: 18px minmax(0,1fr); align-items: start; padding: 10px; border: 1px solid #ead2a4; border-radius: 9px; color: #6d5229; background: #fff8e9; cursor: pointer; }.agent-node-form .agent-rights-confirm input { width: 16px; height: 16px; margin: 1px 0 0; }.agent-node-form .agent-rights-confirm span,.agent-node-form .agent-rights-confirm small { display: block; }.agent-node-form .agent-rights-confirm small { margin-top: 4px; color: #8a724c; }

/* AI 短剧制作工作台 */
.nav-group { display: grid; }.nav-caret { margin-left: auto; font-size: 12px; transition: transform .18s ease; }.nav-group.expanded .nav-caret { transform: rotate(180deg); }
.subnav-list { display: none; gap: 4px; margin: 2px 0 4px 35px; padding-left: 13px; border-left: 1px solid rgba(174,210,195,.2); }.nav-group.expanded .subnav-list { display: grid; }
.subnav-item { border: 0; border-radius: 8px; padding: 8px 10px; color: #83a39a; background: transparent; text-align: left; font-size: 12px; }.subnav-item:hover { color: white; background: rgba(255,255,255,.05); }.subnav-item.active { color: #dff2e7; background: rgba(102,195,144,.12); font-weight: 700; }
.production-panel { display: none; }.production-panel.active { display: block; animation: reveal .2s ease; }.hidden { display: none !important; }.full-width { width: 100%; }
.drama-capability-banner { display: flex; align-items: stretch; margin-bottom: 16px; padding: 14px; border: 1px solid #cfe1d7; border-radius: 15px; background: linear-gradient(110deg, #f7fbf8, #eaf5ee); }
.drama-capability-banner > div { flex: 1; min-width: 0; padding: 4px 12px; }.drama-capability-banner > div span, .drama-capability-banner > div b, .drama-capability-banner > div small { display: block; }.drama-capability-banner > div span { color: #70a08b; font-size: 10px; font-weight: 750; }.drama-capability-banner > div b { margin: 7px 0 5px; font-size: 13px; }.drama-capability-banner > div small { color: var(--muted); font-size: 11px; line-height: 1.45; }.drama-capability-banner > i { align-self: center; color: #9bb0a7; font-style: normal; }
.short-drama-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }.short-drama-card { overflow: hidden; border: 1px solid var(--line); border-radius: 17px; background: white; box-shadow: 0 12px 30px rgba(28,67,53,.055); }.drama-card-cover { position: relative; min-height: 105px; padding: 15px; color: white; background: radial-gradient(circle at 80% 15%, rgba(211,233,220,.45), transparent 42%), linear-gradient(135deg,#153f34,#397b61); }.drama-card-cover::after { content: "剧"; position: absolute; right: 18px; bottom: -22px; color: rgba(255,255,255,.09); font-family: Georgia,"Songti SC",serif; font-size: 95px; line-height: 1; }.drama-card-cover span, .drama-card-cover b { position: relative; z-index: 1; display: inline-flex; padding: 5px 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: rgba(255,255,255,.08); font-size: 10px; }.drama-card-cover b { float: right; }.drama-card-body { padding: 18px; }.drama-card-heading { display: flex; justify-content: space-between; gap: 10px; }.drama-card-heading h3 { margin: 0; font-size: 18px; }.drama-card-body > p { min-height: 44px; margin: 11px 0; color: var(--muted); font-size: 12px; line-height: 1.7; }.drama-card-tags { display: flex; flex-wrap: wrap; gap: 5px; }.drama-card-tags span { padding: 5px 7px; border-radius: 7px; color: #547066; background: #edf5f0; font-size: 10px; }
.drama-progress { margin: 15px 0; }.drama-progress > div { display: flex; justify-content: space-between; margin-bottom: 7px; color: var(--muted); font-size: 11px; }.drama-progress > div b { color: #2c6e54; }.drama-progress > i { display: block; overflow: hidden; height: 7px; border-radius: 8px; background: #e7ede9; }.drama-progress > i em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#287155,#7fbea0); }.drama-card-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; margin-bottom: 14px; }.drama-card-metrics span { color: var(--muted); font-size: 10px; text-align: center; }.drama-card-metrics b { display: block; margin-bottom: 2px; color: var(--ink); font-family: Georgia,serif; font-size: 16px; }.drama-empty { grid-column: 1 / -1; display: grid; gap: 8px; min-height: 240px; place-content: center; border: 1px dashed #c9d7cf; border-radius: 16px; background: rgba(255,255,255,.55); }.drama-empty b { color: #36564a; font-size: 17px; }
.workspace-toolbar { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; margin-bottom: 17px; }.workspace-toolbar h2 { margin: 0 0 6px; font-family: Georgia,"Songti SC",serif; font-size: 29px; font-weight: 500; }.workspace-toolbar p { margin: 0; color: var(--muted); font-size: 13px; }
.drama-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 14px; }.drama-stats article { padding: 16px 18px; border: 1px solid var(--line); border-radius: 13px; background: white; }.drama-stats span, .drama-stats strong, .drama-stats small { display: block; }.drama-stats span { color: var(--muted); font-size: 11px; }.drama-stats strong { margin: 7px 0 4px; font-family: Georgia,serif; font-size: 26px; font-weight: 500; }.drama-stats small { color: #8b9793; font-size: 10px; }
.drama-stage-track { display: grid; grid-template-columns: repeat(7,1fr); margin-bottom: 16px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: white; }.drama-stage-track div { position: relative; padding: 8px 9px; border-right: 1px solid #e7ece9; }.drama-stage-track div:last-child { border-right: 0; }.drama-stage-track b, .drama-stage-track span { display: block; }.drama-stage-track b { color: #9ba8a3; font-size: 9px; }.drama-stage-track span { margin-top: 5px; color: #7d8b86; font-size: 11px; }.drama-stage-track div.done { background: #f1f8f3; }.drama-stage-track div.done span { color: #2c7255; }.drama-stage-track div.active { border-radius: 8px; background: #173f35; }.drama-stage-track div.active b { color: #8fc3ac; }.drama-stage-track div.active span { color: white; font-weight: 700; }
.drama-overview-grid, .drama-assets-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 15px; }.drama-overview-grid .panel, .drama-assets-grid .panel { min-width: 0; }.drama-overview-grid h3 { margin: 0 0 13px; font-size: 18px; }.drama-story-text { max-height: 145px; overflow: auto; margin: 0 0 15px; color: #465a53; font-size: 12px; line-height: 1.8; white-space: pre-wrap; }.drama-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.drama-info-grid span { padding: 9px 10px; border-radius: 8px; background: #f3f7f4; }.drama-info-grid small, .drama-info-grid b { display: block; }.drama-info-grid small { color: var(--muted); font-size: 10px; }.drama-info-grid b { margin-top: 4px; font-size: 12px; }.art-direction-list { display: grid; gap: 8px; }.art-direction-list div { padding: 10px 11px; border-left: 3px solid #82aa98; border-radius: 7px; background: #f5f8f6; }.art-direction-list small, .art-direction-list b { display: block; }.art-direction-list small { color: var(--muted); font-size: 10px; }.art-direction-list b { margin-top: 5px; font-size: 12px; }.art-direction-list p { margin: 5px 0 0; color: #4e625b; font-size: 11px; line-height: 1.6; }
.drama-card-list { display: grid; gap: 8px; margin-top: 15px; }.drama-asset-item { display: grid; grid-template-columns: 43px 1fr; gap: 11px; padding: 11px; border: 1px solid #e5ebe7; border-radius: 11px; background: #fafcfb; }.drama-avatar { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 12px; color: white; background: linear-gradient(145deg,#215643,#62a17f); font-family: Georgia,"Songti SC",serif; font-size: 18px; }.drama-asset-item h4 { margin: 0 0 4px; font-size: 13px; }.drama-asset-item h4 small { margin-left: 4px; color: #6d837a; font-size: 10px; font-weight: 500; }.drama-asset-item p { margin: 0 0 5px; color: #566a62; font-size: 11px; line-height: 1.55; }.drama-asset-item div > span { display: block; color: #8a9692; font-size: 10px; line-height: 1.45; }.scene-number { display: grid; width: 43px; height: 43px; place-content: center; border-radius: 10px; color: #2b614f; background: #e4f1e8; font-size: 9px; text-align: center; }.scene-number b { font-size: 14px; }.drama-asset-panel .drama-card-list { max-height: 410px; overflow: auto; }
.drama-storyboard-panel { margin-bottom: 20px; }.storyboard-list { display: grid; gap: 10px; margin-top: 15px; }.storyboard-shot { display: grid; grid-template-columns: 76px minmax(0,1fr) 240px; gap: 14px; align-items: stretch; padding: 13px; border: 1px solid #dfe7e2; border-radius: 13px; background: #fbfdfc; }.shot-index { display: grid; place-content: center; border-radius: 10px; color: white; background: #173f35; text-align: center; }.shot-index span, .shot-index b, .shot-index small { display: block; }.shot-index span { color: #a8c9bb; font-size: 9px; }.shot-index b { margin: 4px 0; font-family: Georgia,serif; font-size: 22px; }.shot-index small { color: #c7ddd4; font-size: 10px; }.shot-heading { display: flex; justify-content: space-between; gap: 10px; }.shot-heading h4 { margin: 0; font-size: 14px; }.shot-heading span { color: var(--muted); font-size: 10px; }.shot-main > p { margin: 8px 0; color: #40564e; font-size: 12px; line-height: 1.65; }.shot-main blockquote { margin: 8px 0; padding: 8px 10px; border-left: 3px solid var(--gold); color: #765d37; background: #fff9ed; font-size: 11px; }.shot-prompts { display: flex; gap: 8px; }.shot-prompts details { flex: 1; padding: 7px 9px; border-radius: 8px; background: #f0f5f2; }.shot-prompts summary { color: #48635a; cursor: pointer; font-size: 10px; }.shot-prompts p { margin: 7px 0 0; color: #61736d; font-size: 10px; line-height: 1.5; }.shot-jobs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.shot-jobs > div { display: grid; align-content: center; gap: 5px; padding: 10px; border: 1px solid #e2e9e5; border-radius: 9px; background: white; text-align: center; }.shot-jobs span { color: var(--muted); font-size: 10px; }.shot-jobs b { font-size: 11px; }.shot-jobs .mini-button { margin: 0; }

.agent-results-dialog { width: min(1040px, calc(100dvw - 32px)); }.agent-results-modal { gap: 17px; }.agent-results-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }.agent-results-meta span { min-width: 0; padding: 10px 12px; border-radius: 9px; color: var(--muted); background: #f1f6f3; font-size: 11px; }.agent-results-meta b { display: block; margin-top: 5px; overflow-wrap: anywhere; color: #29453b; font-size: 13px; }.agent-results-notice { padding: 14px 16px; border: 1px solid #edc78c; border-radius: 11px; color: #73521f; background: #fff8e9; font-size: 13px; line-height: 1.65; }.agent-results-content { display: grid; gap: 17px; }.agent-result-section { display: grid; gap: 11px; }.agent-result-section > h4 { margin: 0; color: #23483b; font-size: 16px; }.agent-result-empty { padding: 28px; border: 1px dashed #cad8d1; border-radius: 12px; color: var(--muted); background: #f8fbf9; text-align: center; font-size: 13px; }.agent-text-deliverable { padding: 20px 22px; border: 1px solid #dce6e0; border-radius: 12px; background: white; }.agent-text-deliverable header { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 12px; }.agent-text-deliverable header b { color: #254a3d; font-size: 14px; }.agent-text-deliverable header span { color: var(--muted); font-size: 11px; }.agent-text-deliverable p { max-height: 420px; overflow: auto; margin: 0; color: #263b34; font: 14px/1.9 -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; white-space: pre-wrap; overflow-wrap: anywhere; user-select: text; }.agent-media-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }.agent-media-card { display: grid; min-width: 0; gap: 10px; padding: 12px; border: 1px solid #dce6e0; border-radius: 12px; background: white; }.agent-media-card img, .agent-media-card video, .agent-media-card audio { width: 100%; max-height: 420px; border-radius: 8px; background: #10251f; object-fit: contain; }.agent-media-card audio { min-height: 54px; }.agent-media-card footer { display: flex; justify-content: space-between; align-items: center; gap: 10px; }.agent-media-card footer b { overflow-wrap: anywhere; font-size: 13px; }.agent-media-card footer a { flex: 0 0 auto; }.agent-results-reports { padding: 13px 15px; border: 1px solid #e4e9e6; border-radius: 10px; color: #65756f; background: #f8faf9; font-size: 12px; }.agent-results-reports summary { cursor: pointer; font-weight: 700; }.agent-results-reports > div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }

/* Digital human production */
.digital-human-capabilities { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 0 0 16px; }.digital-human-capabilities article { padding: 17px 19px; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(135deg,#fff,#f1f8f4); }.digital-human-capabilities article.ready { border-color: #a9d8be; background: #edf8f1; }.digital-human-capabilities span,.digital-human-capabilities b,.digital-human-capabilities p { display: block; }.digital-human-capabilities span { color: #729487; font-size: 9px; font-weight: 750; letter-spacing: .12em; }.digital-human-capabilities b { margin: 8px 0 5px; font-size: 14px; }.digital-human-capabilities p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.digital-human-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }.digital-human-card { display: grid; grid-template-columns: 210px minmax(0,1fr); overflow: hidden; min-height: 245px; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 11px 28px rgba(30,67,54,.055); }.digital-human-card.failed { border-color: #efc7c3; }.digital-human-preview { display: grid; min-height: 245px; place-items: center; background: radial-gradient(circle at 70% 20%,#dbeee3,transparent 45%),#173f35; }.digital-human-preview img,.digital-human-preview video { width: 100%; height: 100%; max-height: 310px; object-fit: contain; }.digital-human-placeholder { display: grid; gap: 7px; color: #d8eee4; text-align: center; }.digital-human-placeholder b { font-family: Georgia,"Songti SC",serif; font-size: 58px; font-weight: 400; opacity: .6; }.digital-human-placeholder span { font-size: 11px; }.digital-human-card-body { display: grid; gap: 12px; align-content: start; padding: 18px; min-width: 0; }.digital-human-card-heading { display: flex; justify-content: space-between; gap: 10px; }.digital-human-card-heading h3 { margin: 5px 0 0; font-size: 17px; }.digital-human-progress { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; }.digital-human-progress i { display: block; overflow: hidden; height: 7px; border-radius: 9px; background: #e8efeb; }.digital-human-progress em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#277354,#83bea2); }.digital-human-progress b { color: #2d7257; font-size: 11px; }.digital-human-card dl { display: grid; gap: 6px; margin: 0; }.digital-human-card dl div { display: grid; grid-template-columns: 80px minmax(0,1fr); gap: 8px; font-size: 10px; }.digital-human-card dt { color: var(--muted); }.digital-human-card dd { overflow-wrap: anywhere; margin: 0; color: #3e5950; }.digital-human-card footer { display: flex; justify-content: space-between; align-items: center; gap: 9px; margin-top: auto; color: var(--muted); font-size: 10px; }.digital-human-empty { grid-column: 1/-1; min-height: 260px; }.digital-human-form-note { padding: 12px 14px; border-left: 3px solid #347a5d; border-radius: 9px; color: #49675c; background: #edf6f1; font-size: 12px; line-height: 1.65; }.digital-human-input-section { display: grid; gap: 9px; padding: 14px; border: 1px solid #dce7e1; border-radius: 12px; background: #fafcfb; }.digital-human-input-section h4 { margin: 0; color: #244b3d; font-size: 13px; }.digital-human-input-section h4 small { margin-left: 6px; color: var(--muted); font-size: 10px; font-weight: 400; }.asset-or-upload { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.digital-human-rights { padding: 12px 14px; border-radius: 10px; color: #705629; background: #fff8e9; }.inline-actions { display: inline-flex; align-items: center; gap: 6px; }

@media (max-width: 1100px) {
  .app-shell { grid-template-columns: 220px 1fr; }.main-panel { padding-left: 25px; padding-right: 25px; }.hero-panel { grid-template-columns: 1fr; }.hero-orbit { display: none; }.stats-grid { grid-template-columns: 1fr 1fr; }.two-column-grid, .settings-grid, .billing-analysis-grid { grid-template-columns: 1fr; }.asset-grid { grid-template-columns: 1fr 1fr; }.billing-stats { grid-template-columns: repeat(3, 1fr); }.account-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.password-form { grid-template-columns: repeat(2,minmax(0,1fr)); }.short-drama-grid, .publishing-platform-grid { grid-template-columns: 1fr 1fr; }.publishing-profile-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }.storyboard-shot { grid-template-columns: 68px 1fr; }.shot-jobs { grid-column: 2; }.digital-human-grid { grid-template-columns: 1fr; }
}
@media (max-width: 1450px) {
  .agent-studio { grid-template-columns: 170px minmax(560px,1fr) 250px; }.agent-canvas { height: 660px; }.agent-workspace-bar { align-items: flex-start; }.agent-workspace-bar .toolbar-actions { max-width: 440px; }
}
@media (max-width: 760px) {
  .provider-material-columns { grid-template-columns: 1fr; }.provider-material-toolbar { align-items: stretch; flex-direction: column; }
  .app-shell { display: block; }.sidebar { position: static; height: auto; padding: 14px; }.brand { padding-bottom: 12px; }.stage-badge, .sidebar-footer { display: none; }.nav-list { position: relative; grid-template-columns: repeat(4,1fr); }.nav-item { justify-content: center; padding: 10px 5px; font-size: 12px; }.nav-icon, .nav-caret { display: none; }.nav-group { position: relative; min-width: 0; }.nav-group.expanded .subnav-list { position: absolute; z-index: 30; top: calc(100% + 5px); left: 0; display: grid; width: 165px; margin: 0; padding: 8px; border: 1px solid rgba(174,210,195,.22); border-radius: 10px; background: #153a31; box-shadow: 0 14px 30px rgba(5,22,18,.25); }.subnav-item { color: #b9d0c7; }.main-panel { padding: 0 14px 35px; }.topbar { min-height: 84px; }.topbar-actions .domain-chip { display: none; }.hero-copy { padding: 32px 25px; }.hero-copy h2 { font-size: 31px; }.stats-grid, .asset-grid, .approval-summary, .billing-stats, .billing-identity-grid, .account-summary-grid, .short-drama-grid, .publishing-platform-grid, .publishing-profile-summary, .drama-stats, .drama-overview-grid, .drama-assets-grid { grid-template-columns: 1fr; }.password-form { grid-template-columns: 1fr; }.account-list-panel .panel-heading { align-items: stretch; }.search-box.compact { width: 100%; }.section-toolbar { align-items: flex-start; }.filter-bar { flex-wrap: wrap; }.search-box { min-width: 100%; }.form-grid, .publishing-required-box ul, .publishing-edit-toolbar { grid-template-columns: 1fr; }.platform-compose-heading { display: grid; }.flow-row, .drama-capability-banner, .drama-stage-track { overflow-x: auto; }.drama-capability-banner > div { min-width: 180px; }.drama-stage-track { display: flex; }.drama-stage-track div { min-width: 115px; }.workspace-toolbar { grid-template-columns: 1fr; }.storyboard-shot { grid-template-columns: 1fr; }.shot-index { min-height: 70px; }.shot-jobs { grid-column: 1; }.approval-card { grid-template-columns: 38px 1fr; }.approval-actions { grid-column: 2; }.audit-row { grid-template-columns: 1fr; gap: 4px; }.profile-details { grid-template-columns: 1fr 1fr; }.trend-row { grid-template-columns: 75px 1fr 44px; }.trend-row span { display: none; }.pagination { align-items: flex-start; gap: 8px; flex-direction: column; }
  .recommendation-row { grid-template-columns: 1fr; gap: 7px; }
  .provider-upload-result { grid-template-columns: 1fr; }.provider-upload-result img { width: 100%; height: 180px; }.provider-copy-url-row { grid-template-columns: 1fr; }.provider-local-image-row { grid-template-columns: 42px minmax(0,1fr); }.provider-local-image-row aside { grid-column: 1 / -1; justify-content: stretch; }.provider-local-image-row aside button { flex: 1; }
  .digital-human-capabilities,.asset-or-upload,.publishing-target-list { grid-template-columns: 1fr; }.digital-human-card { grid-template-columns: 1fr; }.digital-human-preview { min-height: 190px; }.digital-human-input-section h4 small { display: block; margin: 5px 0 0; }
  .publishing-target-heading { display: grid; }.publishing-target-heading > span { justify-self: start; }.asset-publishing-summary { grid-template-columns: 1fr; }.asset-publishing-summary > img,.asset-publishing-summary > .asset-preview-placeholder { width: 100%; height: 180px; }
}
@media (max-width: 760px) {
  dialog, dialog.wide-dialog, .publishing-composer-dialog, .text-result-dialog { width: calc(100dvw - 20px); max-width: calc(100dvw - 20px); max-height: calc(100dvh - 20px); }.modal-form { gap: 12px; padding: 18px; }.modal-actions > button { flex: 1; min-width: 105px; }.login-screen { grid-template-columns: 1fr; }.login-visual { display: none; }.login-card { min-height: 100vh; }.user-chip { display: none; }.agent-workspace-bar { display: grid; }.agent-studio { display: block; }.agent-sidebar,.agent-canvas-panel,.agent-inspector { margin-bottom: 12px; }.agent-canvas { min-height: 520px; height: 560px; }.agent-canvas-heading,.agent-node-form,.job-asset-picker,.job-asset-source-grid,.production-summary-strip,.text-result-meta,.agent-results-meta,.agent-media-grid,.schedule-mode-grid,.asset-preview-meta { grid-template-columns: 1fr; }.asset-preview-viewer { min-height: 220px; }
}
@media (max-height: 720px) {
  dialog, dialog.wide-dialog { max-height: calc(100dvh - 16px); }.modal-form { gap: 11px; padding: 17px; }.modal-form textarea { max-height: 150px; }
  .login-card { gap: 12px; padding-top: 20px; padding-bottom: 20px; }.login-card h2 { font-size: 28px; }.auth-form.active { gap: 11px; }.login-card input { min-height: 42px; }.social-login-section { gap: 8px; }
}

.result-detail b { white-space: pre-wrap; }
.provider-response-detail { overflow: hidden; border: 1px solid #e8c5c1; border-radius: 10px; background: #fff7f6; }
.provider-response-detail summary { cursor: pointer; padding: 10px 12px; color: #8f403a; font-size: 11px; font-weight: 700; }
.provider-response-detail > dl { gap: 0; border-top: 1px solid #efd4d1; }
.provider-response-detail > dl > div { grid-template-columns: 112px minmax(0,1fr); padding: 9px 12px; border-bottom: 1px solid #f2ddda; }
.provider-response-detail > dl > div:last-child { border-bottom: 0; }
.provider-response-detail pre { overflow: auto; max-height: 240px; margin: 0; color: #593b38; white-space: pre-wrap; overflow-wrap: anywhere; font: 10px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.digital-human-preview audio { width: calc(100% - 24px); margin: 12px; }
[data-digital-human-tts] details { border-top: 1px solid var(--line); margin-top: 14px; padding-top: 12px; }
[data-digital-human-tts] details[open] { display: grid; gap: 12px; }
.status.cancelled { background: #edf0ef; color: #63726b; }
@media (min-width: 1200px) { .digital-human-capabilities { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media (min-width: 701px) and (max-width: 1199px) { .digital-human-capabilities { grid-template-columns: repeat(2,minmax(0,1fr)); } }

/* A consistent, accessible close control across all platform dialogs. */
dialog .dialog-dismiss {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 40px; height: 40px; min-width: 40px; padding: 0; box-sizing: border-box;
  border: 1px solid #dce5e1; border-radius: 12px; color: #60746c;
  background: #f4f7f5; cursor: pointer; line-height: 1; appearance: none;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}
dialog .dialog-dismiss svg { display: block; width: 18px; height: 18px; pointer-events: none; }
dialog .dialog-dismiss:hover { color: #173f34; background: #e4efe9; border-color: #a9c6b9; }
dialog .dialog-dismiss:focus-visible { outline: 2px solid #438b72; outline-offset: 3px; }
dialog .dialog-dismiss:active { background: #d5e6dc; }
dialog .dialog-dismiss:disabled { opacity: .45; cursor: wait; }
@media (pointer: coarse) { dialog .dialog-dismiss { width: 44px; height: 44px; min-width: 44px; } }
@media (prefers-reduced-motion: reduce) { dialog .dialog-dismiss { transition: none; } }

.modal-heading { gap: 16px; }
.job-model-choice { grid-column:1 / -1; display:grid; gap:12px; min-width:0; padding:16px; border:1px solid #cddfd6; border-radius:14px; background:#f1f7f3; }
.job-model-choice label { min-width:0; margin:0; }
.job-model-choice .field-help { line-height:1.8; font-weight:400; }
.job-duration-overview { grid-column: 1 / -1; min-width: 0; padding: 16px; border: 1px solid #ccdfd5; border-radius: 14px; background: #f3f8f5; }
.job-duration-summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.job-duration-summary > div { min-width: 0; }
.job-duration-summary h4 { margin: 0; color: #244f40; font-size: 13px; }
.job-duration-summary p { margin: 6px 0 0; color: #587466; font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
#job-duration-maximum { flex: 0 0 auto; color: #1d624b; font: 700 21px/1.4 system-ui, sans-serif; font-variant-numeric: lining-nums tabular-nums; }
.job-duration-overview details { margin-top: 12px; border-top: 1px solid #dbe7e0; }
.job-duration-overview summary { padding: 12px 0 4px; color: #285b47; font-size: 12px; font-weight: 650; cursor: pointer; }
.job-duration-overview summary:focus-visible, .job-duration-table-wrap:focus-visible { outline: 2px solid #438b72; outline-offset: 3px; border-radius: 4px; }
.job-duration-table-wrap { max-height: 300px; overflow: auto; margin-top: 10px; border: 1px solid #dbe7e0; border-radius: 10px; background: #fff; }
.job-duration-table { table-layout: fixed; }
.job-duration-table th { position: sticky; top: 0; z-index: 1; padding: 10px; letter-spacing: 0; }
.job-duration-table th:nth-child(1) { width: 21%; }
.job-duration-table th:nth-child(2) { width: 29%; }
.job-duration-table th:nth-child(3) { width: 34%; }
.job-duration-table th:last-child { width: 16%; text-align: right; }
.job-duration-table td { padding: 10px; color: #3e5e50; font-size: 12px; overflow-wrap: anywhere; }
.job-duration-table td small { display: block; margin-top: 3px; color: #647c70; line-height: 1.6; }
.job-duration-table .is-selected { background: #eef7f1; }
.job-duration-current { display: inline-block; margin-top: 4px; padding: 1px 6px; border-radius: 5px; color: #23664d; background: #dceee3; font-size: 10px; }
.job-duration-table .job-duration-max-cell { text-align: right; font-weight: 700; white-space: nowrap; font-variant-numeric: lining-nums tabular-nums; }
#job-duration-note { margin: 10px 0 0; color: #647c70; font-size: 11px; line-height: 1.65; }
@media (max-width: 640px) {
  .job-duration-overview { padding: 12px; }
  .job-duration-summary { flex-direction: column; align-items: flex-start; gap: 8px; }
  .job-duration-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .job-duration-table tr { display: block; padding: 8px 10px; border-bottom: 1px solid #dbe7e0; }
  .job-duration-table tr:last-child { border-bottom: 0; }
  .job-duration-table td { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 2px 8px; padding: 4px 0; border: 0; }
  .job-duration-table td::before { content: attr(data-label); grid-column: 1; color: #73857b; font-size: 11px; font-weight: 400; }
  .job-duration-table td > * { grid-column: 2; }
  .job-duration-table .job-duration-max-cell { text-align: left; }
  .job-duration-current { justify-self: start; }
}
.video-creative-section { min-width: 0; padding: 20px; border: 1px solid #d6e4dd; border-radius: 16px; background: #f2f8f5; }
.video-creative-heading { display: flex; align-items: center; gap: 10px; }
.video-creative-heading h4 { margin: 0; color: #214e3f; font-size: 15px; }
.video-creative-heading span { border-radius: 6px; padding: 2px 8px; color: #5d7c6d; background: #e4efe8; font-size: 12px; }
.video-creative-section p { margin: 8px 0 16px; color: #71857b; font-size: 12px; line-height: 1.7; }
.video-creative-section textarea { min-height: 78px; resize: vertical; background: #fff; }
@media (max-width: 640px) { .video-creative-section { padding: 14px; } .video-creative-section .form-grid { grid-template-columns: 1fr; } }