:root { --bg: #f4f7fb; --panel: #ffffff; --panel-2: #f9fbfe; --ink: #111827; --text: #263241; --muted: #677282; --subtle: #98a3b3; --line: #dde6ef; --line-strong: #c9d6e4; --side: #101820; --side-2: #172230; --side-line: rgba(255, 255, 255, .11); --cyan: #08a8d8; --cyan-soft: #e9f8ff; --green: #19b879; --green-soft: #e9f9f2; --amber: #f4ad34; --amber-soft: #fff4dc; --blue: #3278ff; --indigo: #6578f2; --purple: #7a35ff; --shadow: 0 18px 45px rgba(22, 34, 52, .08); --shadow-soft: 0 10px 28px rgba(31, 48, 72, .06); --radius: 8px; --radius-sm: 6px; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-height: 100vh; color: var(--text); background: linear-gradient(180deg, #fbfdff 0%, var(--bg) 32%, #eef3f8 100%); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif; letter-spacing: 0; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
img.brand-logo-emblem, img.mobile-brand-logo-full { object-fit: contain; }
.app-shell { display: grid; grid-template-columns: 230px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; height: 100vh; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 20px; overflow: hidden; padding: 18px 18px 26px; color: #f8fbff; background: linear-gradient(180deg, rgba(23, 34, 48, .94), rgba(10, 15, 23, .98)), var(--side); border-right: 1px solid #dce5ee; }
.brand { display: flex; align-items: center; gap: 8px; padding: 0 6px 12px; color: inherit; text-decoration: none; }
.brand img { flex: 0 0 auto; width: 28px; max-width: 100%; height: 28px; object-fit: contain; }
.brand .brand-logo-full { display: none; }
.brand .brand-logo-emblem { display: block; width: 28px; height: 28px; object-fit: contain; filter: drop-shadow(0 0 14px rgba(39, 213, 255, .72)); }
.brand strong, .brand small { display: block; }
.brand strong { color: #f8fbff; font-size: 15px; font-weight: 900; line-height: 1; letter-spacing: 0; white-space: nowrap; }
.brand strong em { color: #9cefff; font-style: normal; font-weight: 900; }
.brand small { margin-top: 4px; color: rgba(237, 245, 255, .68); font-size: 12px; font-weight: 700; }
.nav { min-height: 0; display: grid; align-content: start; gap: 8px; overflow-y: auto; }
.nav a { display: flex; align-items: center; gap: 11px; height: 44px; padding: 0 12px; color: rgba(235, 243, 252, .72); border: 1px solid transparent; border-radius: var(--radius); text-decoration: none; font-size: 14px; font-weight: 800; }
.nav a:hover, .nav a.active { color: #ffffff; border-color: var(--side-line); background: rgba(255, 255, 255, .09); }
.nav a.active { box-shadow: inset 3px 0 0 var(--cyan); }
.side-card { align-self: end; padding: 15px; border: 1px solid var(--side-line); border-radius: var(--radius); background: rgba(255, 255, 255, .07); }
.side-card div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.side-card span { color: rgba(235, 243, 252, .65); font-size: 12px; font-weight: 800; }
.side-card strong { color: #79f0c3; font-size: 12px; }
.side-card p { margin: 11px 0 0; color: rgba(235, 243, 252, .72); font-size: 12px; line-height: 1.7; }
.workspace { min-width: 0; padding: 22px 26px 30px; }
dialog[open]:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .batch-video-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog, .launch-readiness-dialog) {
  z-index: 40;
}

.task-center-dialog { inset: 0 0 0 204px; width: auto; max-width: none; height: 100vh; max-height: 100vh; margin: 0; border: 0; border-radius: 0; background: transparent; }
.task-center-page { min-height: 100vh; padding: 22px 24px; background: linear-gradient(180deg, #f7f9ff 0%, #eef3fb 100%); }
.task-center-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 0 0 16px; }
.task-center-head strong { display: block; color: #1d2738; font-size: 24px; font-weight: 950; letter-spacing: 0; }
.task-center-head strong em { color: #71809a; font-style: normal; font-weight: 850; }
.task-center-head small { display: block; margin-top: 6px; color: #6c7b91; font-size: 13px; font-weight: 850; }
.task-center-head-actions { display: inline-flex; align-items: center; gap: 10px; }
.task-center-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.task-center-summary article { min-height: 86px; border: 1px solid rgba(201, 212, 235, .86); border-radius: 12px; padding: 14px 16px; background: rgba(255, 255, 255, .86); box-shadow: 0 14px 28px rgba(45, 67, 111, .06); }
.task-center-summary span { color: #6d7b91; font-size: 12px; font-weight: 850; }
.task-center-summary strong { display: block; margin-top: 8px; color: #172235; font-size: 28px; line-height: 1; font-weight: 950; }
.task-center-filters { display: inline-flex; gap: 8px; margin-bottom: 12px; border: 1px solid rgba(201, 212, 235, .9); border-radius: 10px; padding: 4px; background: rgba(255, 255, 255, .78); }
.task-center-filters button { min-height: 32px; border: 0; border-radius: 8px; padding: 0 14px; background: transparent; color: #63728a; font-size: 12px; font-weight: 900; }
.task-center-filters button.active { background: #eef3ff; color: #4e48ff; box-shadow: inset 0 0 0 1px rgba(92, 82, 255, .18); }
.task-center-table { border: 1px solid rgba(201, 212, 235, .86); border-radius: 14px; background: rgba(255, 255, 255, .9); box-shadow: 0 18px 38px rgba(45, 67, 111, .07); overflow: hidden; }
.task-center-table-head, .task-center-row { display: grid; grid-template-columns: minmax(320px, 1.15fr) 112px 190px 120px 120px; align-items: center; gap: 12px; min-width: 0; }
.task-center-table-head { min-height: 40px; padding: 0 16px 0 102px; background: #f3f6fb; color: #718095; font-size: 12px; font-weight: 950; }
.task-center-table-head span:first-child { margin-left: -86px; }
.task-center-row { min-height: 76px; border-top: 1px solid rgba(224, 231, 243, .92); padding: 10px 16px; }
.task-center-row > img { width: 74px; height: 52px; border-radius: 10px; object-fit: cover; }
.task-center-title { display: grid; gap: 6px; min-width: 0; margin-left: -86px; padding-left: 86px; }
.task-center-title strong { overflow: hidden; color: #172235; font-size: 14px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.task-center-title small { overflow: hidden; color: #718095; font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.task-center-status { display: grid; gap: 4px; color: #176fda; font-size: 12px; font-weight: 950; }
.task-center-status em { color: #748299; font-style: normal; font-weight: 850; }
.task-center-status.ready b { color: #16a66d; }
.task-center-status.failed b, .task-center-status.error b { color: #e3475d; }
.task-center-progress { display: grid; gap: 6px; color: #64738a; font-size: 11px; font-weight: 850; }
.task-center-progress i { overflow: hidden; height: 6px; border-radius: 999px; background: #dfe7f3; }
.task-center-progress i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2c73ff, #28c79f); }
.task-center-publish { color: #64738a; font-size: 12px; font-weight: 850; }
.task-center-actions { display: inline-flex; gap: 8px; justify-content: flex-end; }
.task-center-actions button { min-height: 30px; border: 1px solid rgba(201, 212, 235, .94); border-radius: 8px; padding: 0 10px; background: #fbfdff; color: #4e48ff; font-size: 12px; font-weight: 900; }
.task-center-actions button:disabled { color: #9aa7b8; background: #f2f5fa; cursor: not-allowed; }
.task-center-empty { display: grid; place-items: center; min-height: 220px; color: #718095; font-size: 13px; font-weight: 850; text-align: center; }
.task-center-empty.is-danger { color: #de3d55; gap: 6px; }
.topbar { display: grid; grid-template-columns: minmax(420px, 1fr) minmax(300px, 420px) auto; align-items: center; gap: 18px; margin-bottom: 18px; }
.title-block span { display: block; margin-bottom: 4px; color: var(--cyan); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.title-block h1 { margin: 0; color: var(--ink); font-size: 28px; line-height: 1.15; }
.title-block p { margin: 8px 0 0; color: var(--muted); font-size: 14px; }
.command { display: flex; align-items: center; gap: 11px; height: 46px; padding: 0 12px; color: var(--subtle); border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255, 255, 255, .86); box-shadow: var(--shadow-soft); }
.command input { min-width: 0; width: 100%; color: var(--text); border: 0; outline: 0; background: transparent; font-size: 13px; }
.command kbd { padding: 2px 6px; color: #7a8796; border: 1px solid var(--line); border-radius: 5px; background: #f5f8fb; font-size: 11px; font-weight: 800; }
.top-actions { display: flex; align-items: center; gap: 10px; }
.primary-button, .ghost-button, .outline-button, .text-button, .avatar, .source-dock button, .dropzone, .scene-strip button, .engine, .draft-row, .platform-grid button { border: 0; }
.primary-button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 16px; color: #ffffff; border-radius: var(--radius); background: linear-gradient(135deg, #176dff, var(--purple)); box-shadow: 0 14px 28px rgba(104, 60, 255, .24); font-size: 13px; font-weight: 900; }
.primary-button.large { min-height: 48px; padding: 0 20px; font-size: 14px; }
.ghost-button, .outline-button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 15px; color: #304154; border: 1px solid var(--line); border-radius: var(--radius); background: #ffffff; font-size: 13px; font-weight: 900; }
.outline-button { background: var(--panel-2); }
.text-button { display: inline-flex; align-items: center; gap: 5px; padding: 0; color: #42627f; background: transparent; font-size: 12px; font-weight: 900; }
.avatar { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 10px; color: var(--ink); border-radius: var(--radius); background: transparent; font-size: 13px; font-weight: 900; white-space: nowrap; }
.avatar span { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; overflow: hidden; border-radius: 50%; background: rgba(255, 255, 255, .78); }
.status-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.status-row article { display: grid; gap: 5px; padding: 13px 16px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255, 255, 255, .88); box-shadow: var(--shadow-soft); }
.status-row span { color: var(--muted); font-size: 12px; font-weight: 800; }
.status-row strong { color: var(--ink); font-size: 24px; line-height: 1; }
.status-row small { color: var(--subtle); font-size: 11px; font-weight: 800; }
.mobile-workbench,
.mobile-scan-confirm { display: none; }
.studio-grid { display: grid; grid-template-columns: minmax(0, 1fr) 370px; gap: 14px; }
.studio-main { min-width: 0; display: grid; gap: 14px; }
.studio-panel { border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255, 255, 255, .92); box-shadow: var(--shadow-soft); }
.hero-panel { overflow: hidden; }
.source-dock { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 12px; gap: 8px; border-bottom: 1px solid var(--line); background: linear-gradient(180deg, #ffffff, #f8fbff); }
.source-dock button { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px 10px; min-height: 66px; padding: 10px; text-align: left; color: #485b70; border: 1px solid transparent; border-radius: var(--radius); background: transparent; }
.source-dock button i { grid-row: span 2; }
.source-dock button span { color: #263241; font-size: 13px; font-weight: 900; }
.source-dock button small { color: var(--muted); font-size: 11px; line-height: 1.3; }
.source-dock button.active { border-color: #9bdcf4; background: var(--cyan-soft); }
.studio-body { display: grid; grid-template-columns: minmax(300px, .82fr) minmax(0, 1.18fr); gap: 18px; padding: 18px; }
.composer { display: grid; gap: 14px; }
.section-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.section-title.slim { padding: 18px 18px 0; }
.section-title h2 { margin: 0; color: var(--ink); font-size: 17px; line-height: 1.25; }
.section-title p { margin: 7px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.section-actions { display: inline-flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.text-button:disabled { color: #9aacbd; cursor:not-allowed; }
#engineHint { flex: 0 0 auto; padding: 7px 9px; color: #006e8c; border-radius: 999px; background: var(--cyan-soft); font-size: 11px; font-weight: 900; }
.dropzone { display: grid; place-items: center; min-height: 132px; padding: 18px; color: #356077; border: 1px dashed #9bcbe0; border-radius: var(--radius); background: linear-gradient(180deg, rgba(255, 255, 255, .78), rgba(238, 248, 255, .65)); }
.dropzone i { margin-bottom: 8px; color: var(--cyan); }
.dropzone strong { color: var(--ink); font-size: 14px; }
.dropzone span { margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.prompt-box { display: grid; gap: 8px; }
.prompt-box span { color: var(--muted); font-size: 12px; font-weight: 900; }
.prompt-box textarea { width: 100%; min-height: 104px; resize: vertical; padding: 13px 14px; color: var(--text); border: 1px solid var(--line); border-radius: var(--radius); outline: 0; background: #fbfdff; font-size: 13px; line-height: 1.7; }
.prompt-box textarea:focus { border-color: #91d7f0; box-shadow: 0 0 0 3px rgba(8, 168, 216, .12); }
.control-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.quality-score { margin-left: auto; display: grid; gap: 2px; min-width: 96px; padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--radius); background: #ffffff; }
.quality-score span { color: var(--muted); font-size: 11px; font-weight: 900; }
.quality-score strong { color: var(--green); font-size: 22px; line-height: 1; }
.preview-stage { min-width: 0; padding: 14px; color: #ecf7ff; border-radius: var(--radius); background: linear-gradient(180deg, rgba(21, 32, 45, .96), rgba(8, 12, 19, .98)); }
.preview-top { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 12px; }
.preview-top span { color: rgba(236, 247, 255, .58); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.preview-top strong { min-width: 0; overflow: hidden; color: #ffffff; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }
.preview-top button { display: grid; place-items: center; width: 34px; height: 34px; color: #052c37; border: 0; border-radius: 50%; background: #79ecff; }
.video-frame { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--radius); background: #0d151f; }
.video-frame img { width: 100%; height: 100%; object-fit: cover; }
.video-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .54)); pointer-events: none; }
.frame-overlay { position: absolute; z-index: 1; left: 14px; right: 14px; bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.frame-overlay span, .frame-overlay strong { padding: 7px 9px; border-radius: var(--radius-sm); background: rgba(8, 13, 20, .74); backdrop-filter: blur(8px); }
.frame-overlay span { font-size: 11px; font-weight: 900; }
.frame-overlay strong { min-width: 0; overflow: hidden; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.scene-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.scene-strip button { display: grid; gap: 5px; min-width: 0; padding: 10px; text-align: left; color: rgba(236, 247, 255, .72); border: 1px solid rgba(255, 255, 255, .11); border-radius: var(--radius); background: rgba(255, 255, 255, .06); }
.scene-strip button.active { color: #ffffff; border-color: rgba(121, 236, 255, .58); background: rgba(8, 168, 216, .22); }
.scene-strip b { color: #79ecff; font-size: 11px; }
.scene-strip span { overflow: hidden; font-size: 12px; font-weight: 900; white-space: nowrap; text-overflow: ellipsis; }
.render-console { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.render-console div { padding: 10px; border: 1px solid rgba(255, 255, 255, .1); border-radius: var(--radius); background: rgba(255, 255, 255, .05); }
.render-console span, .render-console strong { display: block; min-width: 0; }
.render-console span { color: rgba(236, 247, 255, .5); font-size: 11px; font-weight: 900; }
.render-console strong { margin-top: 5px; overflow: hidden; color: #ffffff; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.audio-line { display: flex; align-items: center; gap: 5px; height: 42px; margin-top: 12px; padding: 0 10px; border: 1px solid rgba(255, 255, 255, .1); border-radius: var(--radius); background: rgba(255, 255, 255, .04); }
.audio-line b { flex: 1; height: 12px; border-radius: 999px; background: linear-gradient(180deg, rgba(121, 236, 255, .82), rgba(25, 184, 121, .72)); }
.audio-line b:nth-child(2n) { height: 22px; }
.audio-line b:nth-child(3n) { height: 28px; }
.audio-line b:nth-child(5n) { height: 16px; }
.orchestration { padding-bottom: 18px; }
.engine-lane { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; padding: 14px 18px 0; }
.engine { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: center; min-height: 84px; padding: 13px; text-align: left; border: 1px solid var(--line); border-radius: var(--radius); background: #ffffff; }
.engine.active { border-color: #8bd8ef; background: linear-gradient(180deg, #ffffff, #edf9ff); box-shadow: 0 10px 24px rgba(8, 168, 216, .13); }
.engine div { min-width: 0; }
.engine strong, .engine small, .engine em { display: block; }
.engine strong { overflow: hidden; color: var(--ink); font-size: 13px; white-space: nowrap; text-overflow: ellipsis; }
.engine small { margin-top: 5px; color: var(--muted); font-size: 11px; }
.engine em { grid-column: 2; color: var(--green); font-size: 11px; font-style: normal; font-weight: 900; }
.mark { display: grid; place-items: center; width: 34px; height: 34px; color: #ffffff; border-radius: var(--radius-sm); font-size: 14px; font-weight: 900; }
.mark.cyan { background: var(--cyan); }
.mark.amber { background: var(--amber); color: #241707; }
.mark.blue { background: var(--blue); }
.mark.indigo { background: var(--indigo); }
.mark.green { background: var(--green); }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }
@media (min-width: 761px) {:root { --bg: #edf4ff; --panel: rgba(255, 255, 255, .82); --ink: #111827; --text: #243348; --muted: #6d7a94; --line: rgba(178, 194, 224, .48); --side: #071225; --radius: 14px; --radius-sm: 10px; --shadow-soft: 0 20px 55px rgba(45, 67, 111, .10); }
body { background: radial-gradient(circle at 58% -8%, rgba(102, 95, 255, .22), rgba(102, 95, 255, 0) 34%), radial-gradient(circle at 82% 0%, rgba(72, 199, 255, .16), rgba(72, 199, 255, 0) 25%), linear-gradient(135deg, #f8fbff 0%, #eef5ff 42%, #f7fbff 100%); font-family: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.app-shell { grid-template-columns: 230px minmax(0, 1fr); background: #061025; }
.sidebar { height: max(100vh, 1088px); gap: 20px; padding: 18px 18px 26px; background: radial-gradient(circle at 38% 4%, rgba(54, 119, 255, .24), rgba(54, 119, 255, 0) 24%), linear-gradient(180deg, #061025 0%, #081226 58%, #07101f 100%); border-right: 0; box-shadow: inset -1px 0 0 rgba(255, 255, 255, .04); }
.brand { gap: 8px; padding: 0 6px 12px; }
.brand img { width: 28px; height: 28px; }
.brand .brand-logo-full { display: none; }
.brand .brand-logo-emblem { width: 28px; height: 28px; }
.brand strong { color: #f8fbff; font-size: 15px; font-weight: 900; letter-spacing: 0; }
.nav { gap: 8px; }
.nav a { height: 44px; padding: 0 14px; gap: 13px; color: rgba(233, 241, 255, .72); border-radius: 10px; font-size: 14px; box-shadow: none; }
body:has(.campaign-create-dialog[open]) .sidebar,
body:has(.material-assets-page-dialog[open]) .sidebar,
body:has(.script-center-dialog[open]) .sidebar,
body:has(.platform-account-page-dialog[open]) .sidebar,
body:has(.publish-planner-page-dialog[open]) .sidebar,
body:has(.lead-review-page-dialog[open]) .sidebar { height: 100vh; min-height: 0; max-height: 100vh; gap: 20px; padding: 18px 18px 26px; }
body:has(.campaign-create-dialog[open]) .app-shell,
body:has(.material-assets-page-dialog[open]) .app-shell,
body:has(.script-center-dialog[open]) .app-shell,
body:has(.platform-account-page-dialog[open]) .app-shell,
body:has(.publish-planner-page-dialog[open]) .app-shell,
body:has(.lead-review-page-dialog[open]) .app-shell { grid-template-columns: 204px minmax(0, 1fr); height: 100vh; min-height: 0; max-height: 100vh; overflow: hidden; }
body:has(.campaign-create-dialog[open]) .workspace,
body:has(.material-assets-page-dialog[open]) .workspace,
body:has(.script-center-dialog[open]) .workspace,
body:has(.platform-account-page-dialog[open]) .workspace,
body:has(.publish-planner-page-dialog[open]) .workspace,
body:has(.lead-review-page-dialog[open]) .workspace { height: 100vh; min-height: 0; max-height: 100vh; overflow: hidden; }
body:has(.campaign-create-dialog[open]) .brand,
body:has(.material-assets-page-dialog[open]) .brand,
body:has(.script-center-dialog[open]) .brand,
body:has(.platform-account-page-dialog[open]) .brand,
body:has(.publish-planner-page-dialog[open]) .brand,
body:has(.lead-review-page-dialog[open]) .brand { gap: 8px; padding: 0 6px 12px; }
body:has(.campaign-create-dialog[open]) .brand .brand-logo-full,
body:has(.material-assets-page-dialog[open]) .brand .brand-logo-full,
body:has(.script-center-dialog[open]) .brand .brand-logo-full,
body:has(.platform-account-page-dialog[open]) .brand .brand-logo-full,
body:has(.publish-planner-page-dialog[open]) .brand .brand-logo-full,
body:has(.lead-review-page-dialog[open]) .brand .brand-logo-full { display: none !important; }
body:has(.campaign-create-dialog[open]) .brand .brand-logo-emblem,
body:has(.material-assets-page-dialog[open]) .brand .brand-logo-emblem,
body:has(.script-center-dialog[open]) .brand .brand-logo-emblem,
body:has(.platform-account-page-dialog[open]) .brand .brand-logo-emblem,
body:has(.publish-planner-page-dialog[open]) .brand .brand-logo-emblem,
body:has(.lead-review-page-dialog[open]) .brand .brand-logo-emblem { display: block !important; content: url("../aivideo_final_premium_site/assets/logo-mark.svg"); width: 28px !important; height: 28px !important; object-fit: contain; filter: drop-shadow(0 0 14px rgba(39, 213, 255, .72)); }
body:has(.campaign-create-dialog[open]) .brand strong,
body:has(.material-assets-page-dialog[open]) .brand strong,
body:has(.script-center-dialog[open]) .brand strong,
body:has(.platform-account-page-dialog[open]) .brand strong,
body:has(.publish-planner-page-dialog[open]) .brand strong,
body:has(.lead-review-page-dialog[open]) .brand strong { position: static !important; display: inline !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; color: #fff; font-size: 15px; font-weight: 900; line-height: 1; letter-spacing: 0; white-space: nowrap !important; }
body:has(.campaign-create-dialog[open]) .brand strong em,
body:has(.material-assets-page-dialog[open]) .brand strong em,
body:has(.script-center-dialog[open]) .brand strong em,
body:has(.platform-account-page-dialog[open]) .brand strong em,
body:has(.publish-planner-page-dialog[open]) .brand strong em,
body:has(.lead-review-page-dialog[open]) .brand strong em { color: #fff; font-style: normal; font-weight: 900; }
body:has(.campaign-create-dialog[open]) .nav,
body:has(.material-assets-page-dialog[open]) .nav,
body:has(.script-center-dialog[open]) .nav,
body:has(.platform-account-page-dialog[open]) .nav,
body:has(.publish-planner-page-dialog[open]) .nav,
body:has(.lead-review-page-dialog[open]) .nav { gap: 8px; }
body:has(.campaign-create-dialog[open]) .nav a,
body:has(.material-assets-page-dialog[open]) .nav a,
body:has(.script-center-dialog[open]) .nav a,
body:has(.platform-account-page-dialog[open]) .nav a,
body:has(.publish-planner-page-dialog[open]) .nav a,
body:has(.lead-review-page-dialog[open]) .nav a { height: 44px; }
.nav a i { color: rgba(233, 241, 255, .78); }
.nav a.active { color: #fff; border-color: rgba(104, 141, 255, .52); background: linear-gradient(135deg, #6539ff 0%, #1279ff 100%); box-shadow: 0 14px 34px rgba(50, 93, 255, .42); }
.nav a.active i { color: #fff; }
.side-card { overflow: hidden; padding: 18px 14px 12px; border-color: rgba(120, 149, 219, .18); border-radius: 14px; background: linear-gradient(180deg, rgba(13, 30, 66, .9), rgba(7, 18, 39, .78)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08); }
.side-visual { position: relative; display: block; height: 148px; margin: -10px 0 14px; overflow: hidden; border-radius: 12px; background: radial-gradient(ellipse at 50% 76%, rgba(72, 118, 255, .42), rgba(72, 118, 255, 0) 48%), radial-gradient(circle at 50% 38%, rgba(77, 219, 255, .23), rgba(77, 219, 255, 0) 38%), linear-gradient(180deg, rgba(14, 31, 68, .16), rgba(7, 17, 38, .42)); box-shadow: inset 0 0 0 1px rgba(96, 136, 255, .12); pointer-events: none; }
.side-visual::before { content: ""; position: absolute; left: 50%; top: 30px; width: 72px; height: 88px; border: 1px solid rgba(117, 214, 255, .62); border-radius: 16px 16px 10px 10px; background: radial-gradient(circle at 50% 18%, rgba(255, 255, 255, .95), rgba(154, 239, 255, .62) 18%, rgba(83, 145, 255, .16) 34%, transparent 35%), linear-gradient(145deg, rgba(159, 235, 255, .88), rgba(69, 122, 255, .66) 44%, rgba(23, 40, 116, .22) 76%), linear-gradient(90deg, rgba(34, 72, 170, .42), rgba(135, 232, 255, .62) 45%, rgba(33, 70, 165, .42)); clip-path: polygon(23% 0, 77% 0, 93% 16%, 88% 76%, 50% 100%, 12% 76%, 7% 16%); box-shadow: 0 0 32px rgba(54, 168, 255, .66), 0 28px 52px rgba(72, 82, 255, .42), -58px 28px 0 -38px rgba(67, 125, 255, .28), 58px 28px 0 -38px rgba(67, 125, 255, .28); transform: translateX(-50%); }
.side-visual::after { content: ""; position: absolute; left: 50%; bottom: 14px; width: 150px; height: 54px; border: 1px solid rgba(68, 134, 255, .34); border-radius: 50%; background: radial-gradient(ellipse at 50% 42%, rgba(103, 230, 255, .52), rgba(69, 218, 255, 0) 38%), repeating-radial-gradient(ellipse at 50% 50%, rgba(75, 113, 255, .24) 0 2px, rgba(75, 113, 255, 0) 2px 10px); box-shadow: 0 0 32px rgba(45, 117, 255, .44); transform: translateX(-50%); }
.side-card > div:not(.side-visual) { display: grid; justify-items: center; gap: 0; text-align: center; }
.side-card > div:not(.side-visual) span { color: #f8fbff; font-size: 14px; font-weight: 950; line-height: 1.25; }
#sideEngineStatus { display: none; }
#sideEngineCopy { margin-top: 6px; font-size: 0; text-align: center; }
#sideEngineCopy::before { content: "商家短视频获客工厂"; display: block; color: #f8fbff; font-size: 12px; font-weight: 900; line-height: 1.45; white-space: nowrap; }
#sideEngineCopy::after { content: "让每一次发布，都带来生意增长"; display: block; margin-top: 2px; color: rgba(235, 243, 252, .64); font-size: 11px; font-weight: 700; line-height: 1.45; }
.side-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 16px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .1); }
.side-card footer::before { content: ""; flex: 0 0 auto; width: 30px; height: 30px; border: 2px solid rgba(255, 255, 255, .72); border-radius: 50%; background: url("../aivideo_final_premium_site/assets/generated/mobile/m08-lead-avatar-01.png") center / cover no-repeat, #10213f; box-shadow: 0 8px 18px rgba(0, 0, 0, .24); }
.side-card footer span { margin-right: auto; }
.side-card footer button { min-height: 26px; padding: 0 10px; color: #fff; border: 0; border-radius: 999px; background: linear-gradient(135deg, #8b5cff, #236dff); font-size: 11px; font-weight: 900; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) .side-card { position: relative; overflow: visible; margin-bottom: 64px; padding: 18px 14px 16px; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) .side-card > div:not(.side-visual) { display: grid; justify-items: center; gap: 0; text-align: center; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) .side-card > div:not(.side-visual) span { font-size: 0; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) .side-card > div:not(.side-visual) span::before { content: "星河 AIVideo"; color: #f8fbff; font-size: 14px; font-weight: 950; line-height: 1.25; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) #sideEngineStatus { display: none; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) #sideEngineCopy { margin-top: 6px; font-size: 0; text-align: center; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) #sideEngineCopy::before { content: "商家短视频获客工厂"; display: block; color: #f8fbff; font-size: 12px; font-weight: 900; line-height: 1.45; white-space: nowrap; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) #sideEngineCopy::after { content: "让每一次发布，都带来生意增长"; display: block; margin-top: 2px; color: rgba(235, 243, 252, .64); font-size: 11px; font-weight: 700; line-height: 1.45; }
body:has(:is(.campaign-create-dialog, .material-assets-page-dialog, .script-center-dialog, .platform-account-page-dialog, .publish-planner-page-dialog, .lead-review-page-dialog)[open]) .side-card footer { position: absolute; top: calc(100% + 18px); left: 0; right: 0; margin: 0; padding: 0; border-top: 0; }
body:has(.campaign-create-dialog[open]) .sidebar::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 190px; pointer-events: none; background: radial-gradient(ellipse at 50% 88%, rgba(83, 72, 255, .46), rgba(83, 72, 255, 0) 52%), radial-gradient(ellipse at 28% 86%, rgba(24, 173, 255, .34), rgba(24, 173, 255, 0) 44%), linear-gradient(155deg, transparent 8%, rgba(28, 80, 255, .22) 72%, transparent 100%); opacity: .95; }
body:has(.campaign-create-dialog[open]) .side-card { z-index: 1; align-self: end; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
body:has(.campaign-create-dialog[open]) .side-visual,
body:has(.campaign-create-dialog[open]) .side-card > div:not(.side-visual),
body:has(.campaign-create-dialog[open]) #sideEngineCopy { display: none; }
body:has(.campaign-create-dialog[open]) .side-card footer { position: static; margin: 0; padding: 0; border-top: 0; }
@media (min-width: 761px) and (max-height: 980px) {
  .sidebar { height: 100vh; gap: 18px; padding: 18px 18px 18px; }
  .brand { padding: 0 6px 10px; }
  .nav { gap: 8px; }
  .nav a { height: 44px; }
  .side-card { padding: 14px 14px 12px; }
  .side-visual { height: 100px; margin: -4px 0 12px; }
  .side-card p { margin-top: 8px; line-height: 1.45; }
  .side-card footer { margin-top: 10px; padding-top: 10px; }
}
.workspace { position: relative; overflow: hidden; padding: 20px 24px 24px; border-radius: 32px 0 0 32px; background: radial-gradient(circle at 58% -8%, rgba(102, 95, 255, .18), rgba(102, 95, 255, 0) 34%), radial-gradient(circle at 82% 0%, rgba(72, 199, 255, .12), rgba(72, 199, 255, 0) 25%), linear-gradient(135deg, #f8fbff 0%, #eef5ff 42%, #f7fbff 100%); }
.workspace::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 210px; pointer-events: none; background: linear-gradient(128deg, rgba(255, 255, 255, 0) 0 38%, rgba(118, 166, 255, .16) 56%, rgba(147, 117, 255, .13) 72%, rgba(255, 255, 255, 0) 92%), linear-gradient(180deg, rgba(236, 244, 255, .86), rgba(236, 244, 255, 0)); }
.workspace > * { position: relative; z-index: 1; }
.topbar { grid-template-columns: minmax(0, 1fr) auto; margin-bottom: 14px; }
.topbar .command { display: none; }
#openMaterialBtn, #openScriptBtn { display: none; }
.title-block h1 { display: flex; align-items: baseline; gap: 16px; font-size: 32px; font-weight: 950; }
.title-block h1 em { color: #111827; font-size: 24px; font-style: normal; font-weight: 600; }
.title-block p { margin-top: 8px; font-size: 15px; }
.top-actions { display: grid; grid-template-columns: 34px auto; grid-template-areas: "notify account" ". board"; justify-content: end; justify-items: end; align-items: center; gap: 8px 12px; }
.icon-button { position: relative; display: grid; place-items: center; width: 42px; height: 42px; color: #fff; border: 0; border-radius: 50%; background: #111827; font-size: 11px; font-weight: 950; }
.top-actions .notify-button { grid-area: notify; width: 34px; height: 38px; color: #0f172a; border-radius: 12px; background: transparent; box-shadow: none; }
.icon-button::before { content: ""; width: 15px; height: 17px; border: 2px solid #fff; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom: 0; }
.top-actions .notify-button::before { width: 13px; height: 16px; border: 2px solid currentColor; border-bottom: 0; border-radius: 8px 8px 5px 5px; box-shadow: 0 12px 0 -10px currentColor, 0 17px 0 -15px currentColor; }
.icon-button::after { content: attr(data-count); position: absolute; top: -5px; right: -5px; width: 17px; height: 17px; display: grid; place-items: center; border-radius: 50%; background: #ff284f; font-size: 10px; }
.top-actions .notify-button::after { top: 0; right: 0; width: 15px; height: 15px; color: #fff; border: 2px solid #f4f8ff; background: #ff1f32; font-size: 9px; line-height: 1; }
.avatar { height: 42px; padding: 0 14px; border: 1px solid rgba(178, 194, 224, .68); border-radius: 999px; background: rgba(255, 255, 255, .72); }
.top-actions .avatar { grid-area: account; }
.avatar::after { content: none; color: #6d7a94; }
#openSettingsBoardBtn { grid-area: board; min-height: 38px; padding: 0 14px; border-radius: 10px; box-shadow: 0 12px 24px rgba(36, 52, 86, .05); }
.today-shell { display: grid; grid-template-columns: minmax(0, 1fr) 264px; gap: 12px; margin-bottom: 14px; }
.today-panel, .today-actions, .studio-panel { border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255, 255, 255, .82); box-shadow: var(--shadow-soft); backdrop-filter: blur(16px); }
.dashboard-panel-head { display: flex; align-items: center; gap: 14px; padding: 14px 18px 0; }
.dashboard-panel-head h2 { margin: 0; color: var(--ink); font-size: 17px; font-weight: 950; }
.dashboard-panel-head span, .dashboard-panel-head small { color: var(--muted); font-size: 13px; font-weight: 800; }
.status-row { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 14px 18px 14px; }
.status-row article { position: relative; grid-template-columns: 58px minmax(0, 1fr); grid-template-areas: "icon label" "icon value" "icon delta"; gap: 3px 16px; min-height: 104px; padding: 16px 18px; border-color: rgba(204, 214, 235, .78); border-radius: 12px; background: linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(255, 255, 255, .78)); box-shadow: 0 16px 34px rgba(45, 67, 111, .06); }
.status-row article i { grid-area: icon; display: grid; place-items: center; width: 58px; height: 58px; color: #5b4bff; border-radius: 14px; background: linear-gradient(135deg, rgba(126, 93, 255, .2), rgba(30, 136, 255, .1)); }
.status-row article:nth-child(2) i { color: #126cff; background: linear-gradient(135deg, rgba(18, 108, 255, .16), rgba(41, 198, 255, .08)); }
.status-row article:nth-child(3) i { color: #4b55ff; }
.status-row article:nth-child(4) i { color: #6b5dff; }
.today-shell .status-row article > i[data-icon]::before, .today-shell .status-row article > i[data-icon]::after { content: ""; position: absolute; inset: auto; transform: none; }
.today-shell .status-row article:nth-child(1) > i[data-icon]::before { left: 18px; top: 17px; width: 18px; height: 20px; border: 0; border-radius: 5px; background: linear-gradient(135deg, #7655ff, #216dff); }
.today-shell .status-row article:nth-child(1) > i[data-icon]::after { left: 34px; top: 22px; width: 0; height: 0; border-left: 10px solid #6a46ff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.today-shell .status-row article:nth-child(2) > i[data-icon]::before { left: 17px; top: 18px; width: 27px; height: 20px; border: 0; border-radius: 2px; background: linear-gradient(135deg, #2f7dff, #23c4ff); clip-path: polygon(0 48%, 100% 0, 72% 100%, 47% 64%); }
.today-shell .status-row article:nth-child(2) > i[data-icon]::after { left: 28px; top: 28px; width: 10px; height: 2px; border: 0; border-radius: 99px; background: rgba(255, 255, 255, .8); transform: rotate(-35deg); }
.today-shell .status-row article:nth-child(3) > i[data-icon]::before { left: 15px; top: 15px; width: 28px; height: 28px; border: 3px solid #5d5cff; border-radius: 50%; background: transparent; }
.today-shell .status-row article:nth-child(3) > i[data-icon]::after { left: 24px; top: 27px; width: 13px; height: 7px; border-left: 3px solid #5d5cff; border-bottom: 3px solid #5d5cff; transform: rotate(-45deg); }
.today-shell .status-row article:nth-child(4) > i[data-icon]::before { left: 18px; top: 16px; width: 14px; height: 14px; border: 0; border-radius: 50%; background: #6c54ff; box-shadow: 14px 2px 0 rgba(108, 84, 255, .74); }
.today-shell .status-row article:nth-child(4) > i[data-icon]::after { left: 15px; top: 33px; width: 32px; height: 14px; border: 0; border-radius: 16px 16px 6px 6px; background: linear-gradient(135deg, #6c54ff, #2d78ff); }
.status-row span { grid-area: label; color: #66738d; font-size: 13px; }
.status-row strong { grid-area: value; font-size: 28px; font-weight: 950; }
.status-row small { grid-area: delta; color: #0da35d; font-size: 12px; }
.today-actions { display: grid; gap: 12px; padding: 18px; }
.today-actions .large { gap: 8px; min-height: 60px; width: 100%; font-size: 17px; border-radius: 12px; }
.today-actions .large i { width: 18px; height: 18px; }
.today-actions .outline-button { color: #5b4bff; border-color: rgba(91, 75, 255, .38); background: rgba(255, 255, 255, .72); }
.studio-grid { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(390px, .82fr); gap: 14px; }
.studio-main, .inspector { display: grid; gap: 14px; align-content: start; }
.orchestration { display: none; }
.hero-panel, .approval-card, .publish-card, .lead-card, .draft-panel { overflow: hidden; }
.activity-panel { height: 290px; min-height: 0; padding: 18px 20px; }
.activity-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.activity-head span { color: #111827; font-size: 16px; font-weight: 950; }
.activity-head h2 { margin: 12px 0 0; color: var(--ink); font-size: 24px; line-height: 1.12; font-weight: 950; }
.activity-status-line { display: inline-flex; align-items: center; gap: 12px; margin-top: 8px; }
.activity-status-line strong { padding: 7px 12px; color: #11a96d; border-radius: 999px; background: rgba(40, 214, 142, .13); font-size: 12px; font-weight: 950; }
.activity-status-line span { color: #66738d; font-size: 13px; font-weight: 800; }
.activity-steps { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 20px 0 12px; padding: 0; list-style: none; }
.activity-steps::before { content: ""; position: absolute; left: 24px; right: 24px; top: 16px; height: 4px; border-radius: 999px; background: linear-gradient(90deg, #10c59d 0 68%, #2b61ff 68% 82%, #dbe3f2 82% 100%); }
.activity-steps li { position: relative; z-index: 1; display: grid; justify-items: center; gap: 10px; min-width: 0; color: #67738c; font-size: 12px; font-weight: 850; }
.activity-steps b { display: grid; place-items: center; width: 32px; height: 32px; color: #fff; border-radius: 50%; background: #d9e2f1; font-size: 13px; }
.activity-steps .done b { background: #10c59d; }
.activity-steps .active b { background: #3159ff; box-shadow: 0 12px 24px rgba(49, 89, 255, .22); }
.activity-steps .active span { color: #111827; }
.activity-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 13px 16px; border: 1px solid rgba(204, 214, 235, .72); border-radius: 12px; background: rgba(255, 255, 255, .72); }
.activity-metrics article { min-width: 0; padding: 0 18px; border-right: 1px solid rgba(204, 214, 235, .72); }
.activity-metrics article:last-child { border-right: 0; }
.activity-metrics span, .activity-progress-card span { display: block; color: #68758d; font-size: 13px; font-weight: 850; }
.activity-metrics strong { display: block; margin-top: 8px; color: var(--ink); font-size: 25px; font-weight: 950; }
.activity-progress-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 16px; }
.activity-progress-card span { grid-column: 1 / -1; }
.activity-progress-card i { overflow: hidden; display: block; height: 7px; border-radius: 999px; background: #dce5f3; }
.activity-progress-card b { display: block; width: 0%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #6a3cff, #215fff); transition: width .35s ease; }
.asset-panel, .lead-report-card, .project-card { display: none; }
.studio-main .bottom-grid { display: block; grid-template-columns: minmax(0, 1fr); width: 100%; }
.draft-panel { min-height: 442px; width: 100%; }
.draft-list { display: grid; gap: 10px; padding: 16px 18px 20px; }
.draft-row, .dashboard-task-row { display: grid; grid-template-columns: 74px minmax(0, 1.25fr) minmax(84px, .45fr) minmax(70px, .35fr) 72px; align-items: center; gap: 14px; min-height: 80px; padding: 12px; text-align: left; border: 1px solid rgba(204, 214, 235, .7); border-radius: 12px; background: rgba(255, 255, 255, .76); }
.draft-row { grid-template-columns: 74px minmax(0, 1fr) 68px 126px 92px 58px; grid-template-areas: "thumb info status progress remain action"; gap: 12px; min-height: 74px; padding: 10px 14px; border-color: rgba(204, 214, 235, .86); background: rgba(255, 255, 255, .82); }
.draft-row.active { border-color: rgba(44, 199, 169, .42); box-shadow: 0 0 0 1px rgba(44, 199, 169, .14), 0 14px 28px rgba(45, 67, 111, .06); }
.draft-row img, .dashboard-task-row img { width: 74px; height: 56px; border-radius: 8px; object-fit: cover; }
.draft-row img { grid-area: thumb; }
.draft-row span, .dashboard-task-row span { min-width: 0; }
.draft-row > span { grid-area: info; }
.draft-row strong, .dashboard-task-row strong { display: block; overflow: hidden; color: #182235; font-size: 14px; font-weight: 950; white-space: nowrap; text-overflow: ellipsis; }
.draft-row small, .dashboard-task-row small { display: inline-flex; width: fit-content; margin-top: 8px; padding: 4px 8px; color: #2866d8; border-radius: 999px; background: #eef5ff; font-size: 11px; font-weight: 900; }
.draft-row .task-status { grid-area: status; justify-self: start; margin-top: 0; padding: 0; color: #12a875; background: transparent; font-size: 12px; font-weight: 950; }
.draft-row::after { content: none; }
.draft-row i, .dashboard-task-row i { overflow: hidden; display: block; height: 5px; border-radius: 999px; background: #dbe3f2; }
.draft-row .task-progress { grid-area: progress; display: grid; grid-template-columns: minmax(0, 1fr) 34px; align-items: center; gap: 10px; }
.draft-row i b, .dashboard-task-row i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #12c7a0, #216dff); }
.draft-row .task-progress > b { color: #64718a; font-size: 12px; font-weight: 850; text-align: right; }
.draft-row:nth-child(2) i b { background: linear-gradient(90deg, #266dff, #7c59ff); }
.draft-row:nth-child(4) i b { background: linear-gradient(90deg, #7c59ff, #2c75ff); }
.draft-row .task-remaining, .draft-row em, .dashboard-task-row em { color: #69758c; font-size: 12px; font-style: normal; font-weight: 850; text-align: right; }
.draft-row .task-remaining { grid-area: remain; display: grid; gap: 3px; justify-items: start; text-align: left; }
.draft-row .task-remaining small { margin: 0; padding: 0; color: #768199; border-radius: 0; background: transparent; font-size: 11px; font-weight: 800; }
.draft-row .task-remaining b { color: #5c6880; font-size: 13px; font-weight: 850; }
.draft-row > em { grid-area: action; justify-self: end; display: grid; place-items: center; width: 48px; min-height: 30px; color: #263447; border: 1px solid rgba(204, 214, 235, .94); border-radius: 8px; background: rgba(255, 255, 255, .94); box-shadow: 0 8px 18px rgba(32, 48, 76, .04); font-size: 12px; font-weight: 900; text-align: center; }
.studio-main .draft-row { grid-template-columns: 74px minmax(170px, 1fr) 72px 130px 92px 58px; grid-template-areas: "thumb info status progress remain action"; gap: 12px; }
.studio-main .draft-row.active { border-color: rgba(204, 214, 235, .86); background: rgba(255, 255, 255, .82); box-shadow: none; }
.studio-main .draft-row img { grid-area: thumb; width: 74px; height: 56px; }
.studio-main .draft-row > span:not(.task-progress, .task-remaining) { grid-area: info; }
.studio-main .draft-row .task-status { grid-area: status; }
.studio-main .draft-row .task-progress { grid-area: progress; display: grid; grid-template-columns: minmax(0, 1fr) 34px; }
.studio-main .draft-row .task-progress i { height: 5px; }
.studio-main .draft-row .task-remaining { grid-area: remain; }
.studio-main .draft-row > em { grid-area: action; }
.draft-list-more { display: inline-flex; align-items: center; justify-content: center; gap: 6px; justify-self: center; min-height: 28px; margin: 0 auto; padding: 0 10px; color: #3159ff; border: 0; background: transparent; font-size: 13px; font-weight: 900; }
.draft-list-more i { width: 14px; height: 14px; color: currentColor; }
.approval-card { height: 290px; min-height: 0; }
.section-title.slim { padding: 20px 20px 0; }
.section-title h2 { font-size: 16px; font-weight: 950; }
.section-title h2 em { color: #78849a; font-style: normal; font-weight: 850; }
.publish-overview { display: grid; grid-template-columns: 176px minmax(0, 1fr); gap: 18px; padding: 8px 20px 12px; }
.studio-grid .approval-card .readiness { position: relative; display: grid; place-items: center; align-content: center; width: 144px; height: 144px; margin: 8px auto 0; color: #111827; border: 0; border-radius: 50%; background: radial-gradient(circle at center, #ffffff 0 45%, rgba(255, 255, 255, .94) 46% 56%, transparent 57%), conic-gradient(from -36deg, #6d44ff 0 39%, #f54059 39% 61%, #ff9b26 61% 75%, #42d96b 75% 89%, #4fb4ff 89% 100%); box-shadow: 0 18px 38px rgba(75, 91, 166, .16), inset 0 0 0 12px rgba(255, 255, 255, .72); }
.studio-grid .approval-card .readiness strong { color: #111827; font-size: 34px; line-height: 1; font-weight: 950; }
.studio-grid .approval-card .readiness span { margin-top: 8px; color: #69758c; font-size: 13px; font-weight: 850; }
.platform-grid { display: grid; gap: 7px; }
.platform-grid button { display: grid; grid-template-columns: minmax(82px, 1fr) 34px 58px; align-items: center; gap: 8px; min-height: 20px; padding: 0; color: #1b2738; border: 0; background: transparent; text-align: left; }
.platform-grid span { display: inline-flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; font-size: 13px; font-weight: 850; white-space: nowrap; text-overflow: ellipsis; }
.platform-grid span::before { content: ""; flex: 0 0 auto; display: grid; place-items: center; width: 18px; height: 18px; color: #fff; border-radius: 6px; background-color: #111827; background-position: center; background-repeat: no-repeat; background-size: 11px 11px; }
.platform-grid [data-platform="douyin"] span::before { background-color: #111827; background-image: url("../aivideo_final_premium_site/assets/generated/platform-icons/douyin.svg"); }
.platform-grid [data-platform="xhs"] span::before { background-color: #ff2442; background-image: url("../aivideo_final_premium_site/assets/generated/platform-icons/xhs.svg"); }
.platform-grid [data-platform="wechat_channels"] span::before { background-color: #ff8a00; background-image: url("../aivideo_final_premium_site/assets/generated/platform-icons/wechat-channels.svg"); }
.platform-grid [data-platform="tiktok"] span::before { background-color: #111827; background-image: url("../aivideo_final_premium_site/assets/generated/platform-icons/tiktok.svg"); }
.platform-grid [data-platform="youtube"] span::before { background-color: #ff1d1d; background-image: url("../aivideo_final_premium_site/assets/generated/platform-icons/youtube.svg"); }
.platform-grid [data-platform="bilibili"] span::before { background-color: #36a8ff; background-image: url("../aivideo_final_premium_site/assets/generated/platform-icons/bilibili.svg"); }
.platform-grid strong, .platform-grid em { color: #1b2738; font-size: 13px; font-style: normal; font-weight: 900; text-align: right; }
.platform-grid em { color: #7a8499; }
.publish-card { height: 270px; min-height: 0; }
.trend-card { position: relative; margin: 14px 20px 0; min-height: 138px; padding: 16px 16px 28px; border-radius: 12px; background: rgba(255, 255, 255, .58); }
.trend-legend { display: flex; align-items: center; gap: 22px; color: #6f7c94; font-size: 12px; font-weight: 850; }
.trend-legend span { display: inline-flex; align-items: center; gap: 7px; }
.trend-legend b { width: 8px; height: 8px; border-radius: 50%; background: #6b4cff; }
.trend-legend span:nth-child(2) b { background: #1a82ff; }
.trend-legend span:nth-child(3) b { background: #27c77b; }
.trend-plot { position: relative; height: 102px; margin-top: 8px; border-bottom: 1px solid #dfe7f3; background: linear-gradient(#e7edf7 1px, transparent 1px) 0 16px / 100% 28px; }
.trend-plot::before { content: none; }
.trend-plot i { display: none; }
.trend-plot canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.trend-axis { position: absolute; left: 18px; right: 8px; bottom: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.trend-axis span { color: #7b879a; font-size: 11px; font-weight: 800; text-align: center; }
.trend-popover { position: absolute; top: 58px; right: 38px; display: grid; gap: 5px; min-width: 140px; padding: 10px 12px; border: 1px solid rgba(198, 210, 234, .86); border-radius: 10px; background: rgba(255, 255, 255, .88); box-shadow: 0 14px 30px rgba(50, 70, 116, .12); }
.trend-popover b, .trend-popover span { color: #65718a; font-size: 11px; font-weight: 850; }
.trend-popover strong { float: right; color: #1f2b3e; }
.publish-note { margin: 12px 20px 0; color: #69758c; font-size: 12px; font-weight: 800; line-height: 1.6; }
.publish-card > .publish-note { display: none; }
.publish-card .publish-actions { display: none; }
.lead-card { position: relative; height: 150px; min-height: 0; padding-bottom: 18px; }
.lead-card::after { content: ""; position: absolute; right: -2px; top: 6px; display: grid; place-items: center; width: 136px; height: 142px; border: 0; border-radius: 28px; background: url("../aivideo_final_premium_site/assets/generated/pc01-ai-robot.png") center bottom / 100px auto no-repeat; box-shadow: 0 18px 38px rgba(83, 116, 209, .12); mask-image: radial-gradient(ellipse 60px 72px at 52% 57%, #000 0 72%, rgba(0, 0, 0, .94) 82%, transparent 100%); }
.insight-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 12px; padding: 12px 104px 0 20px; }
.insight-grid article { display: grid; grid-template-rows: 18px 16px 14px; gap: 2px; min-height: 62px; height: 62px; overflow: hidden; padding: 7px 12px; border: 1px solid rgba(204, 214, 235, .76); border-radius: 10px; background: rgba(255, 255, 255, .68); }
.insight-grid i { width: 18px; height: 18px; color: #2e64ff; }
.insight-grid strong { display: block; min-width: 0; overflow: hidden; color: #1e2a3d; font-size: 12px; font-weight: 950; line-height: 16px; text-overflow: ellipsis; white-space: nowrap; }
.insight-grid span { display: block; min-width: 0; overflow: hidden; color: #6f7c94; font-size: 11px; font-weight: 800; line-height: 14px; text-overflow: ellipsis; white-space: nowrap; }
.approval-card .platform-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.approval-card .platform-grid button { display: grid; grid-template-columns: minmax(82px, 1fr) 34px 58px; align-items: center; min-height: 25px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.approval-card .platform-grid button.active { border: 0; background: transparent; box-shadow: none; }
.approval-card .platform-grid span, .approval-card .platform-grid strong, .approval-card .platform-grid em { display: block; min-width: 0; margin: 0; padding: 0; color: #1b2738; border: 0; background: transparent; font-size: 13px; line-height: 1.2; white-space: nowrap; text-align: left; }
.approval-card .platform-grid span { display: inline-flex; align-items: center; gap: 8px; }
.approval-card .platform-grid strong, .approval-card .platform-grid em { text-align: right; }
.approval-card .platform-grid em { color: #7a8499; font-style: normal; }
}