@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;600;700&display=swap');

:root { --ink:#172027; --muted:#69747a; --line:#dfe5e4; --paper:#f7f8f6; --card:#fff; --lime:#d5ff35; --lime-dark:#b8e514; --orange:#ff7139; --pink:#ffd3c2; --teal:#aee7d8; }
* { box-sizing:border-box; } body { margin:0; background:var(--paper); color:var(--ink); font-family:'Noto Sans SC','PingFang SC',sans-serif; font-size:14px; }
.topbar { height:68px; border-bottom:1px solid var(--line); background:#fff; padding:0 max(32px,calc((100vw - 1450px)/2)); display:flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; font-size:16px; letter-spacing:.02em; }.brand-mark { display:grid; place-items:center; width:28px; height:28px; background:var(--ink); color:var(--lime); font:500 16px 'DM Mono'; clip-path:polygon(0 0,100% 0,100% 72%,72% 100%,0 100%); }.topbar-note { font:12px 'DM Mono'; color:var(--muted); }
.layout { width:min(1450px,calc(100% - 64px)); margin:0 auto; display:grid; grid-template-columns:minmax(420px,.9fr) minmax(550px,1.35fr); gap:48px; padding:52px 0 70px; }.input-panel { padding:8px 0; }.section-label { font:500 11px 'DM Mono'; letter-spacing:.12em; color:#7c8882; text-transform:uppercase; } h1 { margin:13px 0 16px; font-size:34px; line-height:1.36; letter-spacing:-.045em; } h1 em { font-style:normal; position:relative; z-index:0; } h1 em:after { content:''; position:absolute; left:0; bottom:4px; width:100%; height:10px; background:var(--lime); z-index:-1; } .lead { max-width:500px; color:var(--muted); line-height:1.85; margin-bottom:27px; }
.role-card { background:#eaf0e6; padding:13px; margin:18px 0; border-left:3px solid var(--lime-dark); }.role-card-head { display:flex; align-items:baseline; gap:8px; font-size:12px; }.role-card-head span { color:var(--muted); font-size:11px; }.role-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:10px 0 9px; }.role-card label { display:block; color:#56645e; font-size:11px; font-weight:600; }.role-card input { margin-top:5px; padding:8px 9px; font-size:12px; }.upload-card { background:var(--card); border:1px dashed #aeb9b4; min-height:92px; padding:18px; display:flex; align-items:center; gap:13px; transition:.18s; }.upload-card.drag { border-color:#4b5b51; background:#f4fae3; }.upload-icon { font:400 23px 'DM Mono'; display:grid; place-items:center; width:42px; height:42px; background:var(--lime); }.upload-card strong { display:block; font-size:14px; }.upload-card span { display:block; color:var(--muted); font-size:12px; margin-top:3px; }.secondary,.ghost,.primary,.text-button,.stepper button { border:0; font:600 13px 'Noto Sans SC'; cursor:pointer; }.secondary { margin-left:auto; background:#edf0ed; color:var(--ink); padding:9px 12px; }.or { display:flex; align-items:center; gap:10px; color:#96a09c; margin:13px 0; font-size:11px; }.or:before,.or:after { content:''; height:1px; background:var(--line); flex:1; }.field-label,.setting label { display:block; margin:0 0 7px; font-size:12px; font-weight:600; }.field-label small,.setting small { color:var(--muted); font-weight:400; } textarea,input { font:14px/1.65 'Noto Sans SC'; color:var(--ink); width:100%; background:#fff; border:1px solid var(--line); outline:none; padding:12px; } textarea:focus,input:focus { border-color:#6b7e73; box-shadow:0 0 0 3px #dff0da; } #transcript { height:205px; resize:vertical; }.settings-row { display:flex; gap:16px; align-items:end; margin:16px 0; }.setting:first-child { min-width:162px; }.setting.grow { flex:1; }.stepper { display:flex; height:38px; }.stepper button { width:38px; font-size:20px; background:#fff; border:1px solid var(--line); }.stepper output { display:grid; place-items:center; width:58px; background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font:500 16px 'DM Mono'; }.correction-panel { background:#f0f3ef; padding:12px 14px; }.correction-panel summary { cursor:pointer; font-size:12px; font-weight:600; }.correction-panel summary span { color:var(--muted); font-weight:400; margin-left:4px; }.correction-panel p { color:var(--muted); font-size:12px; margin:10px 0 7px; line-height:1.6; }.correction-panel textarea { min-height:96px; font:12px/1.5 'DM Mono'; }.input-actions { display:flex; justify-content:space-between; margin-top:20px; }.ghost { background:transparent; color:var(--muted); padding:10px 0; }.primary { background:var(--ink); color:#fff; padding:11px 17px; }.primary span { color:var(--lime); font-size:17px; margin-left:8px; }.primary:disabled { opacity:.5; cursor:wait; }
.results-panel { background:#e9eeeb; padding:27px; min-height:680px; }.results-head { display:flex; justify-content:space-between; align-items:start; }.results-head h2 { margin:7px 0 0; font-size:22px; letter-spacing:-.04em; }.source-status { background:#d6f7c5; padding:6px 9px; font-size:11px; color:#315127; }.empty-state { text-align:center; max-width:320px; margin:190px auto 0; color:var(--muted); }.empty-state .spark { color:#74a664; font-size:38px; }.empty-state h3 { color:var(--ink); margin:12px 0 7px; }.empty-state p { line-height:1.75; font-size:13px; }.clip-card { display:flex; margin-top:21px; border-top:1px solid #cdd5d0; padding-top:21px; }.clip-index { width:48px; flex:none; font:500 15px 'DM Mono'; color:#88a192; }.clip-main { min-width:0; flex:1; }.clip-title-row { display:flex; align-items:center; gap:9px; }.tag { font-size:10px; background:var(--orange); color:#fff; padding:3px 6px; }.clip-title-row h3 { margin:0; font-size:18px; letter-spacing:-.03em; }.copy-clip { margin-left:auto; font:11px 'Noto Sans SC'; border:0; background:transparent; color:#65736b; cursor:pointer; }.summary { color:#4e5a57; line-height:1.7; font-size:13px; margin:9px 0; }.meta-row { display:flex; gap:7px; flex-wrap:wrap; }.meta-row span { background:#fff; padding:3px 7px; font:11px 'DM Mono'; color:#54625c; }.deliverable-box { display:grid; grid-template-columns:76px 1fr; gap:5px 8px; background:#f4f7f2; padding:10px; margin-top:12px; font-size:12px; line-height:1.55; }.deliverable-box b { color:#738279; }.script-flow { position:relative; padding:14px 0 5px 14px; border-left:1px solid #aab6ae; margin:15px 0 9px; }.script-block { position:relative; padding:0 0 13px 10px; }.script-block:before { content:''; width:6px; height:6px; border-radius:50%; background:#60756a; position:absolute; left:-18px; top:7px; }.script-block:last-child { padding-bottom:0; }.script-role { display:block; color:#718078; font:500 10px 'DM Mono'; letter-spacing:.08em; text-transform:uppercase; margin-bottom:3px; }.script-quote { font-size:13px; line-height:1.65; }.script-quote mark { background:var(--lime); padding:0 2px; }.edit-box { background:#fff; margin-top:14px; }.edit-box summary { cursor:pointer; padding:9px 11px; font-size:12px; font-weight:600; }.edit-table { padding:0 11px 11px; overflow:auto; }.story-head,.story-row { display:grid; grid-template-columns:70px 92px minmax(220px,2fr) minmax(170px,1.3fr) minmax(105px,.8fr) minmax(125px,1fr) minmax(145px,1fr); min-width:1030px; }.story-head { color:#668072; background:#eff3ed; font-size:10px; font-weight:700; }.story-head span,.story-row span { padding:7px 6px; border-top:1px solid #edf0ed; line-height:1.55; }.story-row { font-size:11px; }.story-row span:nth-child(3) { color:#25332d; }.clip-actions { display:flex; gap:10px; align-items:center; margin-top:13px; }.clip-actions .secondary { margin:0; }.text-button { background:transparent; padding:7px 0; color:#4d6256; }.select-clip.selected { background:var(--lime); }.source-list { margin-top:9px; padding:11px; background:#f4f6f2; font-size:12px; }.source-line { margin:7px 0; line-height:1.6; }.source-time { color:#6f8077; font:500 11px 'DM Mono'; margin-right:6px; }
.direction-card { display:flex; margin-top:18px; padding:17px 0; border-top:1px solid #cdd5d0; }.direction-index { width:48px; flex:none; font:500 15px 'DM Mono'; color:#88a192; }.direction-main { min-width:0; flex:1; }.direction-title-row { display:flex; align-items:center; gap:9px; }.direction-title-row h3 { margin:0; font-size:18px; letter-spacing:-.03em; }.select-direction { margin-left:auto; background:#fff; border:1px solid #bdc8c1; padding:7px 10px; font:600 12px 'Noto Sans SC'; cursor:pointer; }.select-direction.selected { background:var(--lime); border-color:var(--lime-dark); }.direction-reason { color:#4e5a57; line-height:1.65; font-size:13px; margin:8px 0 10px; }.direction-hook { border-left:3px solid var(--lime-dark); background:#f5f9ed; padding:9px 10px; font-size:13px; line-height:1.6; }.direction-support { margin-top:8px; color:#53615a; font-size:12px; line-height:1.6; }.direction-meta { display:flex; gap:7px; flex-wrap:wrap; margin-top:10px; }.direction-meta span { background:#fff; padding:3px 7px; font:11px 'DM Mono'; color:#54625c; }.direction-actions { display:flex; align-items:center; justify-content:space-between; margin-top:22px; padding-top:16px; border-top:1px solid #cdd5d0; }.direction-actions p { margin:0; color:#66726c; font-size:12px; }.direction-actions button { background:var(--ink); color:white; border:0; padding:10px 13px; font:600 13px 'Noto Sans SC'; cursor:pointer; }.direction-actions button:disabled { opacity:.45; cursor:not-allowed; }
.direction-task-group { margin-top:18px; padding:0 14px 6px; background:rgba(255,255,255,.35); border:1px solid #d5dfd8; }.direction-task-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0 3px; }.direction-task-head b { font:600 12px 'DM Mono'; color:#53665a; margin-right:9px; }.direction-task-head span { color:#5a6760; font-size:12px; }.direction-task-head .ghost { margin-left:auto; white-space:nowrap; font-size:11px; color:#355d46; }.direction-task-group .direction-card:first-of-type { margin-top:7px; }
.form-feedback,.action-feedback { margin:10px 0 0; padding:8px 10px; font-size:12px; line-height:1.55; background:#fff0d3; color:#7b5416; border-left:3px solid #e9b74d; }.form-feedback[data-state="success"],.action-feedback[data-state="success"] { background:#dff4dc; color:#315127; border-left-color:#79b86a; }
.direction-task-head .task-head-actions { display:flex; align-items:center; gap:10px; margin-left:auto; }.direction-task-head .history-task { white-space:nowrap; font-size:11px; color:#355d46; }.direction-history-list { display:grid; gap:10px; margin-top:16px; }.direction-history-item { padding:12px; border:1px solid #d5dfd8; background:#f8faf7; }.direction-history-item b { display:block; color:#33443a; font-size:13px; }.direction-history-item p { margin:6px 0 10px; color:#5a6760; font-size:12px; line-height:1.6; }.direction-history-item button { border:1px solid #bdc8c1; background:#fff; padding:7px 10px; color:#355d46; font:600 12px 'Noto Sans SC'; cursor:pointer; }
.edit-direction { background:transparent; border:0; color:#52685b; padding:7px 4px; font:600 12px 'Noto Sans SC'; cursor:pointer; }.modal-backdrop { position:fixed; inset:0; z-index:10; display:grid; place-items:center; background:rgba(23,32,39,.45); padding:24px; }.modal-backdrop[hidden] { display:none; }.direction-modal { width:min(680px,100%); max-height:calc(100vh - 48px); overflow:auto; background:#fff; padding:24px; box-shadow:0 18px 60px rgba(15,25,18,.3); }.modal-head { display:flex; justify-content:space-between; align-items:start; }.modal-head h2 { margin:7px 0 0; font-size:22px; letter-spacing:-.04em; }.modal-close { background:transparent; border:0; cursor:pointer; color:#58655e; font-size:27px; line-height:1; }.modal-note { background:#f2f6ed; padding:10px; color:#536059; font-size:12px; line-height:1.65; }.modal-field { display:block; margin-top:13px; color:#4a5851; font-size:12px; font-weight:600; }.modal-field input,.modal-field textarea,.modal-field select { display:block; width:100%; margin-top:6px; border:1px solid var(--line); padding:9px; background:#fff; color:var(--ink); font:13px/1.55 'Noto Sans SC'; }.modal-field select { cursor:pointer; }.modal-field small { color:var(--muted); font-weight:400; }.quote-preview { margin-top:6px; padding:8px 10px; background:#f7f8f6; color:#56625c; font-size:12px; line-height:1.6; border-left:2px solid #c5d3c9; }.modal-actions { display:flex; justify-content:flex-end; align-items:center; gap:10px; margin-top:20px; }.modal-actions .ghost { padding:10px; }.modal-actions .primary { border:0; }.modal-actions .primary { cursor:pointer; }
footer { border-top:1px solid var(--line); padding:18px 32px; color:#7b8580; font-size:11px; text-align:center; } @media(max-width:950px){ .layout { grid-template-columns:1fr; gap:24px; }.results-panel{min-height:500px}.empty-state{margin:80px auto}.topbar{padding:0 20px}.layout{width:calc(100% - 40px)} } @media(max-width:540px){.layout{width:calc(100% - 28px);padding-top:30px}.settings-row,.role-grid{display:block}.setting{margin-bottom:14px}.role-card label{margin-top:8px}.topbar-note{display:none}h1{font-size:28px}.results-panel{padding:19px}.clip-index{width:30px}.upload-card{flex-wrap:wrap}.upload-card .secondary{margin-left:auto}}

/* Campaign-task controls */
.campaign-row .setting.grow { min-width:190px; }.campaign-row select { height:48px; font:14px/1.65 'Noto Sans SC'; color:var(--ink); width:100%; background:#fff; border:1px solid var(--line); outline:none; padding:10px; cursor:pointer; }.campaign-row select:focus { border-color:#6b7e73; box-shadow:0 0 0 3px #dff0da; }.campaign-hint { margin:-7px 0 16px; color:#68756e; font-size:11px; line-height:1.65; }.direction-meta .priority-badge.matched { background:#d6f7c5; color:#315127; }.direction-meta .priority-badge.fallback { background:#fff0d3; color:#7c5416; }
/* Script-level planning controls */
.clip-brief { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; padding:12px; background:#eaf1e5; border-left:3px solid var(--lime-dark); color:#46554d; font-size:12px; line-height:1.65; }.clip-brief b { color:#314138; }.clip-brief small { color:#768279; font-size:10px; font-weight:400; }.clip-brief p { margin:4px 0 0; }.edit-script { position:absolute; right:10px; top:8px; border:0; background:#fff; color:#4d6256; padding:6px 8px; font:600 11px 'Noto Sans SC'; cursor:pointer; }.script-modal { width:min(860px,100%); }.script-select-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 12px; }.script-modal .quote-preview strong { color:#657c6b; font-size:11px; }
@media(max-width:540px){.clip-brief,.script-select-grid{display:block}.clip-brief>div{margin-bottom:10px}.edit-script{position:static;margin-top:7px}}
 .meta-row .clip-alert { background:#fff2e7; color:#8a4d1f; font-family:'Noto Sans SC'; }
.task-planner{margin:16px 0;background:#f0f3ef;padding:12px}.task-planner-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.task-planner-head small{display:block;color:#66726c;font-size:11px;margin-top:3px}.task-card{border-top:1px solid #d5ddd7;padding:11px 0}.task-card:first-child{border-top:0}.task-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}.task-card strong{font:600 12px 'DM Mono';color:#53665a}.task-fields{display:grid;grid-template-columns:170px 1fr;gap:8px}.task-core-fields{grid-template-columns:150px 150px minmax(180px,1fr) 125px}.task-fields select,.task-fields input{padding:8px;font-size:12px}.combo-fields{margin-top:9px;padding:10px;background:#fff;border-left:3px solid var(--lime-dark)}.combo-fields label{display:block;font-size:12px;font-weight:600;color:#46554d;margin-top:8px}.combo-fields label:first-child{margin-top:0}.combo-fields small{display:block;margin-top:3px;color:#68756e;font-size:11px;font-weight:400;line-height:1.55}.combo-fields textarea{margin-top:6px;min-height:88px;padding:8px;font-size:12px}.combo-evidence{display:inline-block;margin-top:4px}.combo-evidence b{color:#3e6548}.remove-task{border:0;background:transparent;color:#7b5b4e;font-size:11px;cursor:pointer}
@media(max-width:720px){.task-core-fields{grid-template-columns:1fr 1fr}.task-core-fields input{grid-column:span 2}}
.role-card .fuzzy-role{margin:9px 0 0;display:flex;align-items:center;gap:6px;color:#53625a}.role-card .fuzzy-role input{width:auto;margin:0}.role-card .fuzzy-role small{font-size:10px;font-weight:400;color:#748078}
.task-speaker-scope{margin-top:8px;padding:8px 10px;background:#f8faf7;border-left:2px solid #c5d3c9;color:#4c5b53;font-size:11px}.task-speaker-scope>b{margin-right:8px}.task-speaker-scope>small{color:#738078}.task-speaker-choices{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.task-speaker-chip{display:flex;align-items:center;gap:4px;padding:4px 7px;background:#fff;border:1px solid #d7e0da;cursor:pointer}.task-speaker-chip input{width:auto;margin:0}.task-speaker-choices>small{color:#738078}
