:root {
  color-scheme: light;
  --paper:#f4f6f8; --surface:#fff; --ink:#172b3b; --muted:#617383; --green:#196b61;
  --line:#e0e6eb; --green-soft:#e7f2ef; --blue-soft:#e9eff8; --blue:#3f6093; --purple-soft:#f0ecf7; --purple:#71608e;
  --heading:"Microsoft YaHei UI","Microsoft YaHei",sans-serif;
  --body:"Segoe UI","Microsoft YaHei",sans-serif; --mono:Consolas,"Courier New",monospace;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:14px/1.6 var(--body); }
button,input,select,textarea { font:inherit; color:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; opacity:.5; }
a { color:inherit; }
button { border:0; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid #69a99f; outline-offset:3px; }
[hidden] { display:none!important; }
svg { width:20px; height:20px; flex-shrink:0; vertical-align:middle; }
h1,h2,h3,h4,p { margin:0; }
h1,h2,h3,h4 { font-family:var(--heading); }
h1 { font-size:28px; letter-spacing:-.6px; line-height:1.4; font-weight:650; }
h2 { font-size:21px; line-height:1.5; font-weight:650; }
h3 { font-size:16px; line-height:1.6; }
small { font-size:12px; }
.skip-link { position:fixed; left:12px; top:-70px; background:var(--ink); color:white; padding:12px; z-index:100; border-radius:6px; }
.skip-link:focus { top:12px; }
.sidebar { position:fixed; inset:0 auto 0 0; width:224px; background:#fff; border-right:1px solid var(--line); padding:30px 16px 24px; display:flex; flex-direction:column; z-index:30; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; padding:0 10px 39px; }
.brand-mark { width:39px; height:39px; color:var(--green); }
.brand strong { display:block; font:700 24px/1.35 var(--heading); letter-spacing:3px; }
.brand small { display:block; color:var(--muted); font-size:10px; margin-top:2px; letter-spacing:1px; }
.nav-label { color:#7f8d97; font-size:11px; letter-spacing:1px; margin:0 16px 11px; }
.nav-item { width:100%; display:flex; align-items:center; gap:12px; min-height:44px; padding:9px 14px; border-radius:7px; background:transparent; text-align:left; margin:3px 0; font-size:13px; color:#536675; }
.nav-item:hover { background:#f1f5f5; }
.nav-item.active { color:var(--green); background:var(--green-soft); font-weight:600; }
.nav-item .nav-count { margin-left:auto; color:#89959e; font:12px var(--mono); }
.nav-item.active .nav-count { color:var(--green); }
.nav-icon svg { width:18px; height:18px; }
.nav-separator { border-top:1px solid var(--line); margin:24px 14px 23px; }
.mode-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; margin:0 5px; background:var(--green); }
.mode-dot.reference { background:var(--blue); }
.mode-dot.copy { background:var(--purple); }
.sidebar-bottom { margin-top:auto; padding:28px 14px 0; }
.local-indicator { color:#506975; display:flex; align-items:center; gap:8px; font-size:12px; }
.live-dot { display:inline-block; width:6px; height:6px; border-radius:100%; background:#46897a; flex-shrink:0; }
.sidebar-bottom p { color:#8a979f; font-size:10px; margin:8px 0 15px; }
.text-button { background:none; padding:0; color:var(--green); font-size:12px; }
.help-link { display:flex; align-items:center; justify-content:space-between; width:100%; }
.app-shell { margin-left:224px; min-height:100vh; display:flex; flex-direction:column; }
.topbar { min-height:72px; border-bottom:1px solid var(--line); background:#fff; padding:0 40px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.topbar-left,.topbar-right { display:flex; align-items:center; gap:24px; }
.breadcrumb { color:#80909c; font-size:12px; }
.breadcrumb>span { margin:0 12px; color:#b4bdc5; }
.breadcrumb strong { color:#506575; font-weight:500; }
.library-switch { display:flex; padding:3px; background:var(--paper); border:1px solid #e8ecef; border-radius:7px; gap:2px; }
.library-switch button { background:transparent; border-radius:4px; min-width:65px; padding:4px 12px; color:var(--muted); font-size:12px; }
.library-switch button.selected { background:white; color:var(--ink); box-shadow:0 1px 4px #172b3b10; font-weight:600; }
.connection-status { color:#7c8a93; font-size:11px; display:flex; align-items:center; gap:7px; }
.connection-status.offline { color:#9d6258; }
.connection-status.offline .live-dot { background:#b8796d; }
.account-menu { display:flex; align-items:center; gap:12px; border-left:1px solid var(--line); padding-left:18px; font-size:11px; color:var(--muted); }
.account-menu>span { max-width:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-menu .text-button { font-size:11px; white-space:nowrap; }
#workspace { flex:1; padding:37px 40px 48px; min-width:0; }
#workspace:focus { outline:0; }
.page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:27px; }
.eyebrow { color:var(--green); font:10px/1.4 var(--mono); text-transform:uppercase; letter-spacing:2px; margin-bottom:8px; }
.page-head .subtitle { color:var(--muted); font-size:13px; margin-top:8px; }
.head-actions { display:flex; gap:8px; align-items:center; padding-top:9px; flex-shrink:0; }
.button { border:1px solid var(--line); border-radius:6px; min-height:36px; padding:7px 14px; background:white; display:inline-flex; align-items:center; justify-content:center; gap:7px; color:#475e6e; font-size:12px; text-decoration:none; line-height:1.6; }
.button:hover { background:#f7faf9; border-color:#b8c9c9; }
.button.primary { background:var(--green); border-color:var(--green); color:white; box-shadow:0 2px 3px #196b610d; }
.button.primary:hover { background:#12574f; }
.button svg { width:15px; height:15px; }
.button.small { min-height:30px; padding:4px 10px; font-size:11px; }
.icon-button { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border-radius:6px; padding:6px; background:transparent; color:var(--muted); flex-shrink:0; }
.icon-button:hover { background:#e9eef1; color:var(--ink); }
.mobile-menu { display:none; }
.demo-banner { display:flex; align-items:center; gap:10px; padding:11px 15px; color:#7b663c; background:#f6f2e7; border:1px solid #eae2cd; border-radius:6px; font-size:12px; margin-bottom:21px; }
.demo-banner svg { width:16px; height:16px; }
.list-panel { background:white; border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.library-tabs { display:flex; align-items:center; border-bottom:1px solid var(--line); padding:0 22px; gap:27px; }
.library-tab { position:relative; background:transparent; color:var(--muted); padding:17px 0; font-size:12px; white-space:nowrap; }
.library-tab.selected { color:var(--ink); font-weight:650; }
.library-tab.selected:after { position:absolute; content:""; bottom:0; left:0; right:0; height:2px; background:var(--green); }
.tab-count { margin-left:7px; font:11px var(--mono); color:#8b99a3; }
.filters { display:flex; align-items:center; gap:9px; padding:19px 22px 16px; flex-wrap:wrap; }
.search-field { position:relative; flex:1; min-width:190px; }
.search-field svg { position:absolute; left:11px; top:10px; width:16px; height:16px; color:#94a1ab; pointer-events:none; }
input,select,textarea { border:1px solid var(--line); background:#fff; border-radius:5px; padding:9px 11px; min-width:0; outline:none; }
input::placeholder,textarea::placeholder { color:#9aa6ae; }
input:hover,select:hover,textarea:hover { border-color:#b6c7cc; }
input:focus,select:focus,textarea:focus { border-color:#76a39b; }
.search-field input { width:100%; padding:8px 11px 8px 34px; background:#fafbfc; height:36px; font-size:12px; }
.select-filter { position:relative; }
.select-filter select { height:36px; max-width:180px; padding:6px 28px 6px 10px; font-size:12px; cursor:pointer; }
.filter-summary { margin:0 22px; border-top:1px solid #eef1f3; padding:12px 0; display:flex; justify-content:space-between; align-items:center; color:#85949e; font-size:11px; min-height:43px; gap:14px; }
.filter-summary strong { font:12px var(--mono); color:#566c7a; margin:0 3px; }
.filter-summary .summary-left { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.filter-chip { color:var(--green); background:var(--green-soft); border-radius:4px; padding:3px 7px; display:inline-flex; align-items:center; gap:5px; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.filter-chip button { background:transparent; color:inherit; padding:0; height:16px; }
.filter-chip button svg { width:12px; height:12px; }
.sort-note { white-space:nowrap; }
.table-head { display:grid; grid-template-columns:minmax(0,1fr) 150px 104px 75px 20px; gap:20px; background:#f8fafb; padding:10px 22px; font-size:10px; color:#8b99a4; border-block:1px solid #edf0f2; }
.script-row { padding:22px; border-bottom:1px solid #edf0f2; display:grid; grid-template-columns:minmax(0,1fr) 150px 104px 75px 20px; align-items:center; gap:20px; transition:background .12s; }
.script-row:last-child { border-bottom:0; }
.script-row:hover { background:#fbfcfd; }
.script-main { min-width:0; }
.script-heading { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:7px; }
.script-title { background:none; text-align:left; font:600 14px/1.6 var(--heading); padding:0; color:var(--ink); overflow-wrap:anywhere; }
.script-title:hover { color:var(--green); text-decoration:underline; text-underline-offset:4px; }
.mode-badge { display:inline-flex; align-items:center; gap:5px; flex-shrink:0; border-radius:4px; background:var(--green-soft); color:var(--green); font-size:10px; padding:2px 7px; font-weight:500; white-space:nowrap; }
.mode-badge.reference { color:var(--blue); background:var(--blue-soft); }
.mode-badge.copy { color:var(--purple); background:var(--purple-soft); }
.script-summary { color:var(--muted); font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:550px; }
.script-bottom { display:flex; align-items:center; gap:12px; margin-top:13px; flex-wrap:wrap; }
.mini-timeline { display:flex; gap:3px; width:85px; height:5px; }
.mini-timeline i { background:#b7cfc8; flex:1; border-radius:1px; }
.mini-timeline.reference i { background:#b9c7dc; }
.mini-timeline.copy i { background:#d0c7df; }
.mini-timeline i:nth-child(even) { opacity:.55; }
.shot-label { color:#93a0a9; font:10px var(--mono); }
.tags-line { display:flex; gap:5px; flex-wrap:wrap; align-items:center; }
.tag { display:inline-flex; background:#f2f5f7; color:#788b99; border:1px solid transparent; border-radius:3px; padding:1px 6px; font-size:10px; max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
button.tag:hover { border-color:#c9d5da; color:var(--green); }
.product-cell { min-width:0; }
.product-cell strong { display:block; font-size:12px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.product-cell small { display:block; font-size:10px; color:#95a1aa; margin-top:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--mono); }
.script-format { color:#718594; font:11px var(--mono); }
.script-format small { font-size:10px; display:block; margin-top:5px; color:#9aa6ae; }
.status { font-size:10px; display:inline-flex; align-items:center; gap:5px; color:#668074; white-space:nowrap; }
.status:before { content:""; display:inline-block; width:5px; height:5px; border-radius:100%; background:#86a697; }
.status.draft { color:#9b8358; }
.status.draft:before { background:#bca373; }
.row-arrow { color:#a3b0b9; padding:0; background:transparent; }
.row-arrow svg { width:17px; height:17px; }
.pagination { border-top:1px solid var(--line); display:flex; padding:15px 22px; align-items:center; justify-content:space-between; color:#8a99a3; font-size:11px; }
.pagination-controls { display:flex; align-items:center; gap:12px; }
.page-number { font:11px var(--mono); }
.library-note { display:flex; align-items:center; gap:7px; color:#8c9aa5; font-size:11px; margin-top:16px; }
.library-note svg { width:13px; height:13px; }
.empty-state { text-align:center; padding:68px 26px 62px; }
.empty-mark { width:68px; height:68px; border-radius:17px; display:grid; place-items:center; color:var(--green); background:#edf4f1; margin:0 auto 22px; border:1px solid #dceae5; }
.empty-mark svg { width:30px; height:30px; }
.empty-state h2 { font-size:19px; margin-bottom:9px; }
.empty-state p { max-width:450px; margin:auto; color:var(--muted); line-height:1.9; font-size:13px; }
.empty-actions { display:flex; justify-content:center; align-items:center; gap:10px; margin-top:23px; flex-wrap:wrap; }
.empty-functions { margin:40px auto 0; display:flex; gap:22px; justify-content:center; flex-wrap:wrap; max-width:560px; padding-top:25px; border-top:1px solid #edf1f3; }
.empty-function { display:flex; align-items:center; gap:8px; color:#7f919e; font-size:11px; }
.empty-function svg { width:14px; height:14px; }
.loading { color:#8a9ba5; text-align:center; padding:85px 25px; font-size:13px; }
.loading:before { content:""; display:block; width:20px; height:20px; border:2px solid #e0e7e9; border-top-color:var(--green); border-radius:50%; animation:spin .7s linear infinite; margin:0 auto 14px; }
@keyframes spin { to { transform:rotate(360deg); } }
.aggregate-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(255px,1fr)); gap:16px; }
.aggregate-card { display:flex; flex-direction:column; background:white; border:1px solid var(--line); padding:23px; border-radius:8px; text-align:left; transition:border .15s,box-shadow .15s; min-width:0; }
.aggregate-card:hover { border-color:#a6c2ba; box-shadow:0 3px 14px #172b3b06; }
.aggregate-icon { color:var(--green); width:36px; height:36px; background:#edf4f1; display:grid; place-items:center; border-radius:7px; margin-bottom:20px; }
.aggregate-card h3 { overflow-wrap:anywhere; }
.aggregate-card p { font-size:12px; color:var(--muted); margin-top:7px; overflow-wrap:anywhere; }
.aggregate-bottom { display:flex; justify-content:space-between; align-items:center; width:100%; border-top:1px solid #edf1f3; padding-top:15px; margin-top:24px; color:var(--muted); font-size:11px; }
.aggregate-bottom strong { color:var(--green); font:15px var(--mono); margin-right:4px; }
.tag-collection { display:flex; flex-wrap:wrap; gap:12px; padding:28px; background:white; border:1px solid var(--line); border-radius:8px; }
.tag-card { background:#f8fafb; border:1px solid var(--line); border-radius:6px; padding:11px 15px; display:flex; align-items:center; gap:16px; }
.tag-card:hover { background:var(--green-soft); border-color:#c6dcd4; }
.tag-card span { font:11px var(--mono); color:#8e9ba5; padding-left:14px; border-left:1px solid var(--line); }
.detail-topline { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:20px; }
.back-button { padding:0; border:0; background:transparent; color:var(--muted); display:inline-flex; align-items:center; gap:7px; font-size:12px; }
.back-button svg { width:15px; height:15px; }
.detail-saved { font-size:11px; color:#8d9ca6; }
.detail-heading { padding:26px 29px; background:#fff; border:1px solid var(--line); border-radius:9px 9px 0 0; }
.detail-heading h1 { font-size:25px; margin:12px 0 10px; overflow-wrap:anywhere; }
.detail-badges { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.version-pill { color:#8b97a2; font:11px var(--mono); }
.detail-summary { color:var(--muted); font-size:13px; max-width:850px; line-height:1.9; white-space:pre-wrap; overflow-wrap:anywhere; }
.detail-meta { display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:17px; color:#78909e; font-size:11px; }
.detail-meta span { display:flex; align-items:center; gap:5px; }
.detail-meta svg { width:13px; height:13px; }
.detail-toolbar { padding:15px 29px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; background:#fff; border:1px solid var(--line); border-top:0; border-radius:0 0 9px 9px; margin-bottom:24px; }
.toolbar-buttons { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.detail-toolbar .select-filter { display:flex; gap:8px; align-items:center; color:var(--muted); font-size:11px; }
.detail-tabs { display:flex; gap:28px; border-bottom:1px solid var(--line); margin-bottom:24px; overflow-x:auto; }
.detail-tab { white-space:nowrap; font-size:13px; color:var(--muted); padding:0 0 12px; background:transparent; border-bottom:2px solid transparent; }
.detail-tab.selected { color:var(--green); font-weight:600; border-color:var(--green); }
.reader-layout { display:grid; grid-template-columns:minmax(0,1fr) 160px; gap:22px; align-items:start; }
.reader-main { min-width:0; }
.reader-toc { position:sticky; top:24px; border-left:1px solid var(--line); padding:0 0 5px 16px; font-size:11px; }
.reader-toc h3 { font:10px var(--mono); color:#91a0ab; margin:2px 0 12px; letter-spacing:1px; }
.reader-toc a { display:block; text-decoration:none; padding:6px 0; color:#788b99; }
.reader-toc a:hover { color:var(--green); }
.reading-section { background:white; border:1px solid var(--line); border-radius:7px; padding:24px; margin-bottom:18px; min-width:0; scroll-margin-top:24px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:18px; }
.section-heading h2 { font-size:16px; }
.section-label { font:10px var(--mono); letter-spacing:1.2px; color:#94a3ac; margin-bottom:4px; }
.preserved { font:14px/1.95 var(--body); white-space:pre-wrap; overflow-wrap:anywhere; margin:0; color:#405a6c; }
.voiceover-text { font-size:16px; line-height:2; color:#304e5e; padding-left:17px; border-left:3px solid #c9dfd7; }
.prompt-text { background:#f7f9fa; border:1px solid #eaf0f2; border-radius:5px; padding:18px; }
.muted-empty { font-size:12px; color:#99a6af; padding:5px 0; }
.timeline-ruler { display:flex; justify-content:space-between; font:10px var(--mono); color:#93a0aa; margin-bottom:7px; }
.full-timeline { display:flex; height:24px; gap:3px; margin-bottom:24px; }
.full-timeline button { background:#dcebe6; color:#528475; font:10px var(--mono); border-radius:2px; min-width:5px; flex:1; padding:0; overflow:hidden; }
.full-timeline button:nth-child(even) { background:#eaf3ef; }
.full-timeline button:hover { background:#b8d6ca; }
.shot { display:grid; grid-template-columns:72px minmax(0,1fr); padding-bottom:24px; }
.shot:last-child { padding-bottom:0; }
.shot-rail { position:relative; }
.shot-rail:after { content:""; position:absolute; left:18px; top:38px; bottom:0; border-left:1px solid #e5ecef; }
.shot:last-child .shot-rail:after { display:none; }
.shot-number { width:37px; height:31px; display:flex; align-items:center; justify-content:center; border:1px solid #d8e4e1; border-radius:4px; color:#598879; background:#f8fbfa; font:12px var(--mono); }
.shot-time { font:10px/1.4 var(--mono); color:#93a3ad; padding-top:9px; }
.shot-content { background:#fbfcfd; border:1px solid #e7edf0; border-radius:6px; padding:18px; }
.shot-visual { font-size:14px; color:#355362; margin-bottom:14px; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.9; }
.shot-fields { display:grid; grid-template-columns:1fr 1fr; gap:13px 22px; }
.shot-field { min-width:0; }
.shot-field .field-title { color:var(--muted); font-size:12px; margin-bottom:4px; display:block; }
.shot-field p { font-size:13px; color:#526e7e; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere; }
.shot-assets { margin-top:13px; padding-top:11px; border-top:1px solid #e8edf0; font-size:12px; color:var(--muted); }
.segment { padding:17px 0; border-top:1px solid #e8edf0; }
.segment:first-child { border-top:0; padding-top:0; }
.segment-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:10px; color:var(--muted); font-size:11px; }
.segment-head span { font-family:var(--mono); }
.content-list { margin:0; padding-left:18px; color:#4a6475; font-size:13px; line-height:1.9; }
.content-list li { margin:0 0 8px; white-space:pre-wrap; overflow-wrap:anywhere; }
.content-list li:last-child { margin-bottom:0; }
.asset-item { padding:16px 0; border-bottom:1px solid #edf0f2; }
.asset-item:first-child { padding-top:0; }
.asset-item:last-child { border-bottom:0; padding-bottom:0; }
.asset-name { display:flex; gap:10px; align-items:center; font-size:12px; margin-bottom:7px; }
.asset-kind { font:10px var(--mono); color:#8a9aa5; border:1px solid var(--line); border-radius:3px; padding:1px 5px; }
.asset-location { font:11px/1.7 var(--mono); color:#718996; background:#f5f7f9; padding:8px 10px; margin-bottom:8px; border-radius:4px; white-space:pre-wrap; overflow-wrap:anywhere; }
.asset-usage { font-size:13px; color:var(--muted); white-space:pre-wrap; overflow-wrap:anywhere; }
.metadata-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.metadata-item { min-width:0; }
.metadata-item dt { font-size:11px; color:#8c9ea9; margin-bottom:5px; }
.metadata-item dd { margin:0; color:#405e70; font-size:13px; overflow-wrap:anywhere; }
.raw-details { border:1px solid var(--line); border-radius:7px; background:#fff; margin-bottom:18px; overflow:hidden; }
.raw-details summary { cursor:pointer; padding:16px 20px; color:var(--muted); font-size:12px; }
.raw-details[open] summary { border-bottom:1px solid var(--line); }
.raw-text { margin:0; padding:20px; font:11px/1.8 var(--mono); white-space:pre-wrap; overflow-wrap:anywhere; color:#667c8c; max-height:650px; overflow:auto; }
.version-row { display:flex; gap:20px; align-items:flex-start; border-bottom:1px solid #e8edf0; padding:18px 0; }
.version-row:first-child { padding-top:0; }
.version-row:last-child { border-bottom:0; padding-bottom:0; }
.version-bullet { width:34px; height:30px; display:grid; place-items:center; font:11px var(--mono); border:1px solid #dfe8e6; border-radius:4px; background:#f2f7f5; color:var(--green); flex-shrink:0; }
.version-info { flex:1; min-width:0; }
.version-info h3 { font-size:12px; font-weight:500; }
.version-info p { font-size:11px; color:var(--muted); white-space:pre-wrap; overflow-wrap:anywhere; margin-top:7px; }
.history-note { padding:11px 14px; border:1px solid #ddd7e9; background:#f1eef6; color:#7d6c94; border-radius:5px; margin-bottom:18px; font-size:12px; }
.app-footer { display:flex; justify-content:space-between; gap:18px; padding:0 40px 22px; color:#9ba8b1; font-size:10px; }
.app-footer span:first-child { font-family:var(--mono); letter-spacing:1px; }
dialog { width:580px; max-width:calc(100% - 32px); max-height:calc(100dvh - 48px); overflow:auto; border:1px solid var(--line); border-radius:12px; box-shadow:0 24px 80px #172b3b26; padding:28px; color:var(--ink); background:#fff; }
dialog::backdrop { background:#172b3b60; backdrop-filter:blur(3px); }
.dialog-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; }
.dialog-heading .eyebrow { margin-bottom:6px; }
.dialog-intro { color:var(--muted); font-size:13px; line-height:1.9; margin:14px 0 18px; }
.dialog-actions { display:flex; justify-content:flex-end; gap:9px; border-top:1px solid var(--line); padding-top:20px; margin-top:22px; }
.import-target { display:inline-flex; align-items:center; gap:7px; padding:4px 9px; background:var(--green-soft); color:var(--green); border-radius:4px; font-size:11px; margin-bottom:13px; }
.file-picker { border:1px dashed #b6cfc7; border-radius:6px; background:#f8fbfa; padding:20px; display:flex; flex-direction:column; align-items:center; gap:6px; cursor:pointer; color:var(--green); }
.file-picker:hover { border-color:var(--green); background:#f1f8f4; }
.file-picker strong { font-size:12px; font-weight:600; }
.file-picker>span:last-child { font-size:11px; color:#8a9b9b; max-width:100%; overflow-wrap:anywhere; }
.file-input { display:block; width:100%; padding:8px 0; border:0; font-size:11px; color:var(--muted); }
.field-label { display:block; margin:16px 0 7px; font-size:13px; font-weight:500; }
.field-label span { font-weight:400; font-size:10px; color:#99a6ae; margin-left:8px; }
.json-input { width:100%; font:11px/1.7 var(--mono); resize:vertical; min-height:150px; background:#fafbfc; }
.form-error { padding:12px; margin-top:15px; background:#fcf0ed; border:1px solid #edd8d2; color:#9d5c4a; font-size:12px; border-radius:5px; overflow-wrap:anywhere; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-field { display:flex; flex-direction:column; gap:6px; min-width:0; }
.form-field>span { font-size:13px; }
.form-field small { font-size:10px; color:#92a1aa; margin-left:5px; font-weight:400; }
.form-field input,.form-field textarea { font-size:13px; width:100%; }
.form-field.full { grid-column:1/-1; }
.form-field textarea { resize:vertical; }
.help-steps { margin-top:28px; }
.help-steps section { display:flex; gap:16px; margin-bottom:24px; }
.help-steps h3 { font-size:14px; margin-bottom:5px; }
.help-steps p { font-size:13px; color:var(--muted); line-height:1.9; }
.step-number { font:12px var(--mono); color:var(--green); background:var(--green-soft); border-radius:5px; width:30px; height:30px; display:grid; place-items:center; flex-shrink:0; }
.help-note { font-size:11px; padding:14px; border-radius:5px; background:var(--paper); color:var(--muted); }
.help-steps code { font-size:11px; font-family:var(--mono); overflow-wrap:anywhere; }
.toast-region { position:fixed; bottom:28px; left:calc(50% + 112px); transform:translateX(-50%); z-index:100; max-width:min(500px,calc(100% - 32px)); }
.toast { padding:12px 18px; background:var(--ink); color:white; border-radius:7px; box-shadow:0 5px 22px #172b3b20; font-size:12px; animation:toast-in .2s ease-out; }
.toast.error { background:#8a5145; }
@keyframes toast-in { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.auth-pending .sidebar,.auth-pending .app-shell,.auth-locked .sidebar,.auth-locked .app-shell { visibility:hidden; }
.auth-locked { overflow:hidden; }
.login-dialog { inset:0; width:100%; max-width:none; height:100dvh; max-height:none; margin:0; border:0; border-radius:0; padding:32px 20px; background:var(--paper); box-shadow:none; }
.login-dialog[open] { display:flex; align-items:center; justify-content:center; }
.login-dialog::backdrop { background:var(--paper); backdrop-filter:none; }
.login-card { width:420px; max-width:100%; padding:38px; margin:auto; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:0 12px 45px #172b3b08; }
.login-brand { display:flex; align-items:center; gap:12px; margin-bottom:34px; font:700 25px/1.35 var(--heading); letter-spacing:3px; }
.login-card h1 { font-size:23px; line-height:1.5; }
#login-intro { color:var(--muted); font-size:13px; margin:12px 0 26px; line-height:1.9; }
.login-card .form-field { margin-top:18px; gap:8px; }
.login-card .form-field input { min-height:44px; }
.login-remember { margin-top:16px; }
.login-remember-label { display:inline-flex; align-items:center; gap:9px; min-height:32px; cursor:pointer; font-size:13px; }
.login-remember-label input[type="checkbox"] { appearance:auto; width:16px; height:16px; min-height:0; padding:0; margin:0; flex:0 0 16px; accent-color:var(--green); cursor:pointer; }
.login-remember-label input:disabled { cursor:wait; }
#login-remember-help { margin:3px 0 0 25px; color:var(--muted); font-size:11px; line-height:1.8; }
.login-submit { width:100%; margin-top:24px; min-height:44px; font-size:13px; }
.login-footnote { margin-top:22px; color:#87959e; font-size:10px; text-align:center; }
.login-notice { background:var(--green-soft); padding:12px; border-radius:5px; color:var(--green); font-size:12px; line-height:1.8; }
.noscript-message { padding:32px; text-align:center; }
.source-badge { display:inline-flex; align-items:center; max-width:100%; border:1px solid #e1e8ec; border-radius:4px; padding:2px 7px; font-size:10px; color:#607787; background:#f7f9fa; text-align:left; overflow-wrap:anywhere; }
.source-badge:hover { border-color:#aac6bd; color:var(--green); background:var(--green-soft); }
.sharing-current { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; padding:26px; background:#edf5f1; border:1px solid #cfdfd8; border-radius:9px; }
.sharing-current>div:first-child { min-width:0; }
.sharing-current h2 { font:600 23px/1.5 var(--mono); overflow-wrap:anywhere; }
.sharing-current p:not(.eyebrow) { color:#526f64; font-size:13px; margin-top:9px; line-height:1.9; }
.sharing-current .release-notes { white-space:pre-wrap; overflow-wrap:anywhere; }
.sharing-current .sharing-row-actions { flex-shrink:0; }
.sharing-explainer { color:var(--muted); font-size:11px; line-height:1.9; margin:12px 0 25px; }
.sharing-section { background:white; border:1px solid var(--line); border-radius:9px; margin-top:20px; overflow:hidden; }
.sharing-section-head { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 24px; border-bottom:1px solid var(--line); }
.sharing-section-head h2 { font-size:17px; }
.sharing-section-head p { font-size:12px; color:var(--muted); margin-top:5px; }
.sharing-section-head>.button { flex-shrink:0; }
.sharing-empty { color:var(--muted); font-size:13px; padding:27px 24px; }
.sharing-row { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 24px; border-bottom:1px solid #edf1f3; }
.sharing-row:last-child { border-bottom:0; }
.sharing-row-info { min-width:0; }
.sharing-row-title { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.sharing-row-title h3 { font-size:14px; overflow-wrap:anywhere; }
.sharing-row-info p { color:var(--muted); font-size:11px; margin-top:5px; white-space:pre-wrap; overflow-wrap:anywhere; }
.sharing-row-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; flex-shrink:0; }
.sharing-status { color:var(--green); font-size:10px; border-radius:4px; padding:2px 7px; background:var(--green-soft); white-space:nowrap; }
.sharing-status.muted { color:var(--muted); background:#f0f3f5; }
.sharing-form-note { margin-top:16px; overflow-wrap:anywhere; white-space:pre-wrap; }
.invite-result { background:#f0f7f3; border:1px solid #cfdfd8; border-radius:7px; padding:17px; margin-top:20px; }
.invite-result h3 { font-size:15px; color:var(--green); }
.invite-result p { color:var(--muted); font-size:12px; line-height:1.9; margin:8px 0 12px; }
.invite-result .form-field { margin-bottom:12px; }
.invite-result input { font:12px/1.8 var(--mono); }
.join-page { background:var(--paper); }
.join-shell { width:min(800px,calc(100% - 40px)); margin:46px auto 0; }
.join-heading { padding:0 10px 30px; }
.join-heading .login-brand { margin-bottom:32px; }
.join-heading h1 { font-size:30px; }
.join-subtitle { font-size:14px; line-height:1.9; color:var(--muted); margin-top:12px; max-width:650px; }
.join-disclosure { padding:25px 28px; background:#edf5f1; border:1px solid #cfdfd8; border-radius:9px; margin-bottom:23px; }
.join-disclosure h2,.join-step h2,.join-ready h2 { font-size:17px; }
.join-disclosure p { color:#48675b; font-size:13px; line-height:1.9; margin-top:12px; }
.join-step { display:flex; align-items:flex-start; gap:18px; padding:28px; background:white; border:1px solid var(--line); border-radius:9px; margin-bottom:16px; }
.join-step-content { min-width:0; flex:1; }
.join-step-content>p:not(.help-note) { color:var(--muted); font-size:13px; line-height:1.9; margin:10px 0 18px; }
.join-instructions { width:100%; resize:vertical; min-height:260px; font:12px/1.85 var(--body); background:#fafbfc; margin-bottom:11px; }
.join-code-actions { display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.join-code-actions input { flex:1; min-width:140px; font:12px var(--mono); }
.join-step-content .join-small { font-size:11px!important; margin-bottom:0!important; }
.join-ready { padding:14px 10px; }
.join-ready p { color:var(--muted); font-size:13px; line-height:1.9; margin-top:11px; }
.join-page code { font:12px var(--mono); overflow-wrap:anywhere; }
.join-feedback { min-height:25px; margin:14px 10px; color:var(--green); font-size:13px; }
.join-footer { padding:18px 10px 28px; color:#8d9aa2; font-size:11px; }
@media(max-width:1100px) { .sharing-current { flex-direction:column; gap:18px; } .sharing-current .sharing-row-actions { justify-content:flex-start; } }
@media(max-width:760px) {
  .sharing-current { padding:20px; }
  .sharing-current h2 { font-size:20px; }
  .sharing-section-head { padding:18px; gap:12px; }
  .sharing-section-head h2 { font-size:16px; }
  .sharing-row { padding:18px; align-items:flex-start; flex-direction:column; gap:14px; }
  .sharing-row-actions { justify-content:flex-start; }
  .sharing-empty { padding:23px 18px; }
  .join-shell { width:calc(100% - 28px); margin-top:25px; }
  .join-heading { padding-inline:5px; }
  .join-heading h1 { font-size:24px; }
  .join-disclosure { padding:21px; }
  .join-step { padding:21px 17px; gap:12px; }
  .join-step>.step-number { width:25px; height:25px; font-size:11px; }
  .join-instructions { min-height:330px; }
}
@media(min-width:1600px) { #workspace { padding-inline:60px; max-width:1540px; width:100%; margin:0 auto; } .topbar { padding-inline:60px; } }
@media(max-width:1200px) { #workspace { padding:30px 26px; } .topbar { padding-inline:26px; } .table-head,.script-row { grid-template-columns:minmax(0,1fr) 130px 78px 20px; gap:15px; } .status-cell { display:none; } .reader-layout { grid-template-columns:minmax(0,1fr); } .reader-toc { display:none; } }
@media(max-width:950px) { .sidebar { width:200px; padding-inline:10px; } .app-shell { margin-left:200px; } .library-tabs { gap:20px; padding-inline:17px; overflow-x:auto; } .script-row { padding:20px 17px; } .table-head { padding-inline:17px; } .filters { padding-inline:17px; } .filter-summary { margin-inline:17px; } .product-cell { display:none; } .table-head,.script-row { grid-template-columns:minmax(0,1fr) 70px 20px; } .table-head .product-head { display:none; } .page-head { gap:14px; } h1 { font-size:25px; } .toast-region { left:calc(50% + 100px); } }
@media(max-width:760px) {
  .sidebar { width:224px; transform:translateX(-100%); transition:transform .2s; }
  body.menu-open .sidebar { transform:translateX(0); box-shadow:10px 0 50px #172b3b20; }
  .sidebar-scrim { position:fixed; inset:0; background:#172b3b60; z-index:29; }
  .app-shell { margin-left:0; }
  .topbar { min-height:63px; padding:0 17px; gap:8px; }
  .topbar-left { gap:8px; }
  .topbar-right { gap:8px; }
  .account-menu { gap:0; padding-left:9px; }
  .account-menu>span { display:none; }
  .login-card { padding:30px 24px; }
  .mobile-menu { display:inline-flex; }
  .breadcrumb { font-size:11px; }
  .breadcrumb>span { margin:0 7px; }
  .connection-status { display:none; }
  .library-switch button { min-width:53px; padding:4px 8px; font-size:11px; }
  #workspace { padding:25px 17px 36px; }
  .page-head { margin-bottom:22px; }
  .page-head .subtitle { font-size:12px; max-width:270px; }
  .head-actions { padding-top:4px; }
  .head-actions .refresh-label { display:none; }
  .eyebrow { font-size:9px; margin-bottom:7px; }
  h1 { font-size:24px; }
  .button { padding:7px 11px; }
  .library-tabs { gap:22px; }
  .library-tab { font-size:11px; }
  .tab-count { font-size:10px; margin-left:4px; }
  .filters { gap:8px; }
  .search-field { flex-basis:100%; }
  .select-filter { flex:1; }
  .select-filter select { width:100%; max-width:none; font-size:11px; }
  .filter-summary { align-items:flex-start; }
  .sort-note { display:none; }
  .table-head { display:none; }
  .script-row { grid-template-columns:minmax(0,1fr) 50px; gap:9px; }
  .row-arrow { display:none; }
  .script-title { font-size:13px; }
  .script-heading { gap:7px; }
  .script-format { font-size:10px; text-align:right; align-self:start; padding-top:4px; }
  .script-format small { font-size:9px; }
  .script-summary { font-size:13px; }
  .script-bottom { gap:7px; }
  .mini-timeline { width:57px; }
  .tags-line { gap:4px; }
  .tag { font-size:9px; max-width:110px; }
  .pagination { padding-inline:17px; }
  .empty-state { padding:47px 20px; }
  .empty-state h2 { font-size:17px; }
  .empty-functions { gap:13px; margin-top:30px; }
  .empty-function { font-size:10px; }
  .detail-heading { padding:22px 20px; }
  .detail-heading h1 { font-size:22px; }
  .detail-summary { font-size:13px; }
  .detail-meta { gap:12px; }
  .detail-toolbar { padding:13px 20px; }
  .detail-toolbar .select-filter { flex:none; }
  .detail-tabs { gap:23px; }
  .detail-tab { font-size:12px; }
  .reading-section { padding:19px 17px; }
  .section-heading h2 { font-size:15px; }
  .voiceover-text { font-size:15px; }
  .preserved { font-size:14px; }
  .shot { grid-template-columns:49px minmax(0,1fr); }
  .shot-fields { grid-template-columns:1fr; gap:12px; }
  .shot-content { padding:14px; }
  .shot-time { font-size:8px; }
  .shot-number { width:30px; height:28px; }
  .shot-rail:after { left:14px; top:35px; }
  .metadata-grid { gap:16px; }
  .metadata-item dd { font-size:12px; }
  .detail-saved { font-size:10px; }
  .app-footer { padding:0 18px 20px; font-size:9px; }
  .toast-region { left:50%; }
  dialog { padding:22px; max-height:calc(100dvh - 28px); }
  .form-grid { gap:13px; }
}
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { animation-duration:.001ms!important; transition-duration:.001ms!important; scroll-behavior:auto!important; } }
