:root {
  --cream: #faf7f1; --paper: #fff; --soft: #f5f1e8; --line: #ece6d9;
  --orange: #ff8a3d; --orange-hover: #f4762a; --orange-soft: #ffe9d6;
  --mint: #2dd4bf; --mint-soft: #dff9f4; --blue: #4da3ff; --blue-soft: #e6f2ff;
  --yellow: #ffd23f; --yellow-soft: #fff5c8; --pink: #ff6b9a; --pink-soft: #ffe5ee;
  --text: #23272f; --muted: #6b7280; --weak: #a3a8b3; --green: #29a66f; --red: #db5b58;
  --shadow: 0 12px 38px rgba(111, 83, 50, .08); --shadow-hover: 0 17px 44px rgba(111, 83, 50, .13);
}
* { box-sizing: border-box; }
html { min-width: 320px; background: var(--cream); }
body { margin: 0; color: var(--text); background: var(--cream); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "PingFang SC", sans-serif; line-height: 1.55; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
button, select { cursor: pointer; }
svg { width: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.app-shell { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; z-index: 20; display: flex; flex-direction: column; height: 100vh; padding: 28px 20px 22px; background: rgba(255,255,255,.86); border-right: 1px solid var(--line); backdrop-filter: blur(16px); }
.brand { display: flex; align-items: center; gap: 12px; padding: 0 6px 22px; }
.brand-mark { position: relative; display: grid; place-items: center; width: 43px; height: 43px; overflow: hidden; color: #fff; background: var(--orange); border-radius: 14px; font-size: 21px; font-weight: 800; box-shadow: 0 8px 20px rgba(255,138,61,.28); }
.brand-mark span { position: absolute; top: 0; width: 100%; height: 8px; background: repeating-linear-gradient(120deg,#fff 0 8px,transparent 8px 16px); opacity: .8; }
.brand strong { display: block; font-size: 21px; line-height: 1.15; letter-spacing: .08em; }
.brand small { display: block; margin-top: 2px; color: var(--weak); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.new-project, .primary-btn { border: 0; color: #fff; background: var(--orange); border-radius: 12px; box-shadow: 0 7px 17px rgba(255,138,61,.22); font-weight: 720; transition: transform .2s, background .2s, box-shadow .2s; }
.new-project { width: 100%; padding: 12px 16px; margin-bottom: 22px; }
.new-project span { margin-right: 4px; font-size: 19px; }
.new-project:hover, .primary-btn:hover { background: var(--orange-hover); box-shadow: 0 9px 22px rgba(244,118,42,.28); transform: translateY(-1px); }
.new-project:active, .primary-btn:active { transform: scale(.98); }
.nav { display: grid; gap: 6px; }
.nav-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 13px; border: 0; border-radius: 12px; color: var(--muted); background: transparent; text-align: left; transition: .2s; }
.nav-item:hover { color: var(--text); background: var(--soft); }
.nav-item.active { color: var(--orange-hover); background: var(--orange-soft); font-weight: 720; }
.scope-note { margin-top: 26px; padding: 15px; background: linear-gradient(145deg,#fff8ec,#fff); border: 1px solid #f4e5d3; border-radius: 15px; }
.scope-note span { display: inline-flex; padding: 3px 8px; color: #9b5b26; background: var(--yellow-soft); border-radius: 99px; font-size: 11px; font-weight: 750; }
.scope-note p { margin: 9px 0 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.sidebar-foot { margin-top: auto; }
.model-pill { display: flex; align-items: center; gap: 10px; padding: 11px; background: var(--soft); border-radius: 13px; }
.dot { width: 9px; height: 9px; border-radius: 50%; background: var(--weak); }
.dot.online { background: var(--green); box-shadow: 0 0 0 4px rgba(41,166,111,.12); }
.dot.preview { background: #e2a52d; box-shadow: 0 0 0 4px rgba(226,165,45,.12); }
.model-pill small, .model-pill b { display: block; overflow: hidden; max-width: 145px; white-space: nowrap; text-overflow: ellipsis; }
.model-pill small { color: var(--weak); font-size: 10px; }
.model-pill b { font-size: 12px; }
.settings-link { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; padding: 9px; margin-top: 8px; border: 0; color: var(--muted); background: transparent; border-radius: 10px; font-size: 12px; }
.settings-link:hover { color: var(--orange-hover); background: var(--orange-soft); }
.settings-link svg { width: 16px; }
.main { min-width: 0; padding: 0 42px 60px; }
.topbar { display: flex; align-items: center; justify-content: space-between; min-height: 104px; padding: 20px 0; }
.eyebrow { color: var(--orange-hover); font-size: 11px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.topbar h1 { margin: 3px 0 0; font-size: 25px; letter-spacing: -.035em; }
.truth-pill { display: flex; align-items: center; gap: 8px; padding: 9px 13px; color: var(--muted); background: rgba(255,255,255,.72); border: 1px solid var(--line); border-radius: 99px; font-size: 11px; }
.truth-pill span { width: 7px; height: 7px; background: var(--mint); border-radius: 50%; box-shadow: 0 0 0 4px rgba(45,212,191,.13); }
.tab-panel { display: none; animation: appear .25s ease; }
.tab-panel.active { display: block; }
@keyframes appear { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.hero { position: relative; display: grid; grid-template-columns: minmax(0,1.45fr) minmax(220px,.7fr) minmax(160px,.46fr); gap: 24px; min-height: 305px; padding: 34px 36px; overflow: hidden; background: linear-gradient(126deg,#fff 0%,#fffaf4 60%,#fff1e5 100%); border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); }
.hero::after { content: ""; position: absolute; right: -80px; top: -100px; width: 290px; height: 290px; border: 44px solid rgba(255,210,63,.12); border-radius: 50%; }
.tag, .source-badge, .safe-label { display: inline-flex; align-items: center; padding: 5px 10px; color: #b25b22; background: var(--orange-soft); border-radius: 99px; font-size: 10px; font-weight: 800; letter-spacing: .05em; }
.hero-copy { position: relative; z-index: 2; align-self: center; }
.hero h2 { max-width: 660px; margin: 14px 0 13px; font-size: clamp(30px,3.1vw,48px); line-height: 1.16; letter-spacing: -.055em; }
.hero h2 em { color: var(--orange); font-style: normal; }
.hero-copy > p { max-width: 610px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.9; }
.hero-points { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 19px; color: var(--muted); font-size: 12px; }
.hero-points i { display: inline-grid; place-items: center; width: 17px; height: 17px; margin-right: 4px; color: #fff; background: var(--mint); border-radius: 50%; font-style: normal; font-size: 10px; }
.mascot-card { position: relative; display: grid; place-items: center; min-height: 225px; align-self: center; background: var(--yellow-soft); border: 1px solid #f6e8a8; border-radius: 22px; transform: rotate(-1deg); }
.sun { position: absolute; top: 22px; right: 24px; width: 32px; height: 32px; background: var(--yellow); border-radius: 50%; box-shadow: 0 0 0 8px rgba(255,210,63,.16); }
.mascot { position: relative; width: 112px; height: 105px; margin-top: 18px; }
.board-top { position: absolute; top: 0; left: 2px; width: 110px; height: 24px; background: repeating-linear-gradient(130deg,#49372c 0 15px,#fff 15px 29px); border: 4px solid #49372c; border-radius: 7px 7px 3px 3px; transform: rotate(-7deg); transform-origin: left bottom; }
.board-body { position: absolute; top: 24px; left: 0; width: 112px; height: 75px; background: var(--orange); border: 4px solid #49372c; border-radius: 8px 8px 14px 14px; }
.board-body i { display: block; width: 68px; height: 4px; margin: 11px auto; background: rgba(255,255,255,.8); border-radius: 4px; }
.mascot .eye { position: absolute; z-index: 3; top: 52px; width: 7px; height: 10px; background: #49372c; border-radius: 50%; }
.mascot .eye.left { left: 36px; } .mascot .eye.right { right: 36px; }
.mascot b { position: absolute; z-index: 3; top: 68px; left: 50%; width: 20px; height: 9px; border-bottom: 3px solid #49372c; border-radius: 50%; transform: translateX(-50%); }
.bubble { position: absolute; bottom: 16px; padding: 7px 11px; color: #795a27; background: #fff; border-radius: 10px; box-shadow: 0 5px 14px rgba(125,92,38,.1); font-size: 11px; font-weight: 700; }
.stats-card { position: relative; z-index: 2; display: grid; align-content: center; gap: 9px; }
.stat { display: grid; grid-template-columns: 48px 1fr; align-items: center; min-height: 63px; padding: 10px 13px; background: rgba(255,255,255,.78); border: 1px solid rgba(236,230,217,.9); border-radius: 15px; }
.stat b { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 12px; font-size: 20px; }
.stat span { color: var(--muted); font-size: 11px; }
.stat.orange b { color: var(--orange-hover); background: var(--orange-soft); }.stat.blue b { color: #357fd3; background: var(--blue-soft); }.stat.mint b { color: #159a89; background: var(--mint-soft); }
.pipeline-wrap { margin: 22px 0; padding: 21px 23px; background: rgba(255,255,255,.72); border: 1px solid var(--line); border-radius: 18px; }
.mini-head { display: flex; align-items: end; justify-content: space-between; margin-bottom: 17px; }
.mini-head span { color: var(--orange); font-size: 9px; font-weight: 850; letter-spacing: .16em; }.mini-head h3 { margin: 2px 0 0; font-size: 16px; }.mini-head p { margin: 0; color: var(--weak); font-size: 11px; }
.canvas-tools { display: flex; align-items: center; gap: 12px; }.expert-canvas { position: relative; height: 555px; margin-top: 16px; overflow: auto; background-color: #fdfbf7; background-image: radial-gradient(#dfd7ca 1px,transparent 1px); background-size: 18px 18px; border: 1px solid var(--line); border-radius: 14px; }.expert-canvas.hidden { display: none; }.canvas-hint { position: sticky; z-index: 5; left: 12px; top: 10px; display: inline-flex; padding: 5px 9px; color: var(--muted); background: rgba(255,255,255,.9); border: 1px solid var(--line); border-radius: 99px; font-size: 9px; }.canvas-world { position: relative; width: 1100px; height: 540px; }.canvas-world svg { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none; }.canvas-world path { fill: none; stroke: #d7cbbc; stroke-width: 2; stroke-dasharray: 7 7; }.canvas-world path.done { stroke: var(--orange); stroke-dasharray: none; }.expert-node { position: absolute; z-index: 2; display: grid; grid-template-columns: 42px 1fr; gap: 10px; width: 208px; min-height: 128px; padding: 14px; cursor: grab; user-select: none; background: #fff; border: 1px solid var(--line); border-radius: 15px; box-shadow: 0 8px 22px rgba(87,67,45,.08); }.expert-node:active { cursor: grabbing; }.expert-node.running { border-color: #ffbc8f; box-shadow: 0 0 0 4px rgba(255,138,61,.08); }.expert-node.done { border-color: #bce9df; }.expert-node.failed { border-color: #efb0ad; }.expert-avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; font-weight: 850; }.color-橘 { color: var(--orange-hover); background: var(--orange-soft); }.color-黄 { color: #9b711c; background: var(--yellow-soft); }.color-粉 { color: #b04468; background: var(--pink-soft); }.color-蓝 { color: #337dcc; background: var(--blue-soft); }.color-绿 { color: #168c7d; background: var(--mint-soft); }.expert-copy strong { font-size: 12px; }.expert-copy p { height: 32px; margin: 3px 0 8px; color: var(--muted); font-size: 9px; line-height: 1.6; }.expert-copy span { display: block; overflow: hidden; max-width: 130px; color: var(--weak); white-space: nowrap; text-overflow: ellipsis; font-size: 8px; }.expert-copy span i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; background: var(--weak); border-radius: 50%; }.expert-node.running .expert-copy span i { background: var(--orange); animation: breathe 1.4s infinite; }.expert-node.done .expert-copy span i { background: var(--mint); }.expert-node.failed .expert-copy span i { background: var(--red); }
.pipeline-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; }
.pipeline-step { position: relative; display: flex; align-items: center; gap: 10px; min-width: 0; padding: 10px; border: 1px solid var(--line); background: #fff; border-radius: 13px; transition: .2s; }
.pipeline-step > i { position: absolute; left: calc(100% + 1px); z-index: 2; width: 8px; border-top: 1px dashed #d6ccbc; }.pipeline-step:last-child > i { display: none; }
.pipeline-index { flex: 0 0 29px; display: grid; place-items: center; width: 29px; height: 29px; color: var(--weak); background: var(--soft); border-radius: 9px; font-size: 11px; font-weight: 800; }
.pipeline-step strong, .pipeline-step span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }.pipeline-step strong { font-size: 11px; }.pipeline-step span { max-width: 130px; color: var(--weak); font-size: 9px; }
.pipeline-step.running { border-color: #ffc69f; background: #fffaf6; box-shadow: 0 0 0 3px rgba(255,138,61,.07); }.pipeline-step.running .pipeline-index { color: #fff; background: var(--orange); animation: breathe 1.4s infinite; }
.pipeline-step.done { border-color: #bfece3; }.pipeline-step.done .pipeline-index { color: #fff; background: var(--mint); }.pipeline-step.failed { border-color: #f1b7b4; }.pipeline-step.failed .pipeline-index { color: #fff; background: var(--red); }
@keyframes breathe { 50% { box-shadow: 0 0 0 6px rgba(255,138,61,.14); } }
.workspace-grid { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,.72fr); gap: 22px; }
.panel { background: var(--paper); border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 8px 28px rgba(111,83,50,.055); }
.panel:hover { box-shadow: 0 12px 34px rgba(111,83,50,.075); }
.import-panel, .setup-panel { padding: 23px; }
.panel-head, .title-with-step, .panel-head > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.title-with-step { justify-content: flex-start !important; }.step-num { display: grid; place-items: center; flex: 0 0 37px; width: 37px; height: 37px; color: var(--orange-hover); background: var(--orange-soft); border-radius: 12px; font-weight: 850; }
.panel h3 { margin: 0; font-size: 16px; }.panel-head p { margin: 2px 0 0; color: var(--weak); font-size: 10px; }
.upload-btn, .secondary-btn, .copy-btn { padding: 8px 12px; color: var(--orange-hover); background: #fff; border: 1px solid #ffc396; border-radius: 10px; font-size: 11px; font-weight: 750; transition: .2s; }
.copy-btn.danger-btn { color: #b75551; border-color: #f0c0bd; background: #fffdfc; }
.copy-btn.danger-btn:hover { background: #fff0ef; }
.copy-btn.danger-btn.confirming { color: #fff; background: #b75551; border-color: #b75551; }
.upload-btn:hover, .secondary-btn:hover, .copy-btn:hover { background: var(--orange-soft); transform: translateY(-1px); }.upload-btn input { display: none; }
.textarea-wrap { position: relative; margin-top: 18px; }
textarea, input, select { width: 100%; color: var(--text); background: var(--soft); border: 1px solid var(--line); border-radius: 12px; outline: 0; transition: border .2s, box-shadow .2s, background .2s; }
textarea:focus, input:focus, select:focus { background: #fff; border-color: var(--orange); box-shadow: 0 0 0 4px rgba(255,138,61,.12); }
#scriptInput { min-height: 274px; padding: 18px; resize: vertical; font-family: ui-monospace, "SFMono-Regular", Consolas, "Microsoft YaHei", monospace; font-size: 12px; line-height: 1.8; }
.textarea-corner { position: absolute; right: 8px; bottom: 8px; width: 10px; height: 10px; border-right: 2px solid #d2c9b9; border-bottom: 2px solid #d2c9b9; }
.import-foot { display: flex; justify-content: space-between; margin-top: 9px; color: var(--weak); font-size: 10px; }
.safe-label { color: #178b7d; background: var(--mint-soft); letter-spacing: 0; }
.field { display: block; margin-top: 17px; color: var(--muted); font-size: 11px; font-weight: 700; }.field select, .field input { height: 43px; padding: 0 13px; margin-top: 7px; }
.model-boundary { margin-top: 18px; padding: 13px; background: var(--blue-soft); border-radius: 12px; }.model-boundary span { color: #3179c6; font-size: 9px; font-weight: 850; letter-spacing: .12em; }.model-boundary p { margin: 4px 0 0; color: #54708d; font-size: 10px; line-height: 1.6; }
.model-settings-card { width: min(680px, calc(100vw - 30px)); }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.routing-board { margin: 16px 0; padding: 14px; background: var(--soft); border: 1px solid var(--line); border-radius: 14px; }
.routing-board > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.routing-board strong { font-size: 12px; }.routing-board span { color: var(--weak); font-size: 9px; }
.routing-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.route-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; padding: 8px 10px; background: #fff; border: 1px solid var(--line); border-radius: 10px; }
.route-item b { flex: 0 0 auto; color: var(--muted); font-size: 9px; }.route-item code { overflow: hidden; color: var(--orange-hover); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.primary-btn { padding: 10px 16px; }.analyze-btn { width: 100%; min-height: 47px; margin-top: 18px; }.primary-btn:disabled { cursor: not-allowed; opacity: .65; transform: none; }
.notice { margin-top: 11px; padding: 10px 11px; color: var(--muted); background: var(--soft); border-radius: 10px; font-size: 10px; line-height: 1.6; }.notice.warning { color: #8a6721; background: var(--yellow-soft); }.notice.error { color: #a94743; background: #fff0ef; }.notice.success { color: #18785f; background: var(--mint-soft); }.notice.working { color: #aa5a24; background: linear-gradient(90deg,var(--orange-soft),#fff8f2,var(--orange-soft)); background-size: 200%; animation: shimmer 1.3s linear infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }.spinner { display: inline-block; width: 13px; height: 13px; margin-right: 8px; vertical-align: -2px; border: 2px solid rgba(255,255,255,.5); border-top-color: #fff; border-radius: 50%; animation: spin .8s linear infinite; }@keyframes spin { to { transform: rotate(1turn); } }
.understanding { min-height: 230px; margin-top: 22px; padding: 24px; }.understanding:not(.ready) { display: grid; place-items: center; }.empty-state { grid-column: 1/-1; display: grid; place-items: center; min-height: 240px; padding: 30px; color: var(--weak); text-align: center; }.empty-state h3 { margin: 14px 0 4px; color: var(--text); }.empty-state p { max-width: 430px; margin: 0; font-size: 11px; }
.clapper { position: relative; width: 62px; height: 47px; margin-top: 8px; background: var(--orange-soft); border: 2px solid var(--orange); border-radius: 8px 8px 12px 12px; }.clapper::before { content: ""; position: absolute; left: -3px; top: -13px; width: 64px; height: 13px; background: repeating-linear-gradient(130deg,var(--orange) 0 11px,#fff 11px 21px); border: 2px solid var(--orange); border-radius: 5px; transform: rotate(-5deg); transform-origin: left bottom; }.clapper i { position: absolute; left: 15px; top: 19px; width: 30px; border-top: 3px solid var(--orange); box-shadow: 0 8px 0 var(--orange); }.clapper.small { transform: scale(.8); }
.understanding-head { padding-bottom: 19px; border-bottom: 1px solid var(--line); }.badge-row { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }.source-badge.model { color: #147e6f; background: var(--mint-soft); }.source-badge.preview { color: #9a7120; background: var(--yellow-soft); }
.understanding-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 14px; margin-top: 17px; }.understanding-card { min-width: 0; padding: 18px; background: #fffdf9; border: 1px solid var(--line); border-radius: 15px; }.understanding-card label { color: var(--muted); font-size: 10px; font-weight: 700; }.card-kicker { margin-bottom: 13px; color: var(--orange-hover); font-size: 10px; font-weight: 850; letter-spacing: .08em; }.mint-text { color: #168c7d; }.blue-text { color: #357fcf; }.amber-text { color: #a67518; }
.edit-text { min-height: 106px; padding: 12px; margin-top: 7px; resize: vertical; font-size: 11px; line-height: 1.7; }.theme-box { margin-top: 12px; padding: 12px; background: var(--pink-soft); border-radius: 11px; }.theme-box span { color: #a23f63; font-size: 9px; font-weight: 800; }.theme-box p { margin: 4px 0 0; color: #75485a; font-size: 11px; }
.edit-list, .scene-check-list { display: grid; gap: 8px; }.edit-row { display: grid; grid-template-columns: 26px minmax(0,1fr) auto; align-items: center; gap: 8px; }.edit-row > span, .scene-edit > span { display: grid; place-items: center; width: 26px; height: 26px; color: #168c7d; background: var(--mint-soft); border-radius: 8px; font-size: 9px; }.edit-row input, .scene-edit input { height: 34px; padding: 0 10px; background: #fff; font-size: 11px; }.edit-row small, .scene-edit small { color: var(--weak); font-size: 9px; font-weight: 500; }
.scene-edit { display: grid; grid-template-columns: 28px 1fr; gap: 9px; align-items: start; }.scene-edit div { min-width: 0; }.scene-edit small { display: block; margin: 3px 2px 0; }.scene-check-card { max-height: 320px; overflow: auto; }.question-card { background: #fffdf3; }.question-card ul { padding-left: 18px; margin: 0; color: #735f35; font-size: 11px; }.question-card li + li { margin-top: 8px; }.question-clear { display: flex; align-items: center; gap: 10px; color: #277b66; }.question-clear span { display: grid; place-items: center; width: 30px; height: 30px; color: #fff; background: var(--mint); border-radius: 50%; }.question-clear p { margin: 0; font-size: 11px; }.inline-empty { color: var(--weak); font-size: 11px; }
.confirm-bar { display: flex; align-items: center; gap: 10px; margin-top: 18px; padding: 15px 16px; background: linear-gradient(90deg,#fff8f1,#fffdfb); border: 1px solid #f5dfcc; border-radius: 14px; }.confirm-bar > div { margin-right: auto; }.confirm-bar strong, .confirm-bar small { display: block; }.confirm-bar strong { font-size: 12px; }.confirm-bar small { color: var(--muted); font-size: 10px; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 16px 0 24px; padding: 26px 29px; background: #fff; border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); }.section-head h2 { margin: 8px 0 3px; font-size: 27px; letter-spacing: -.04em; }.section-head p { margin: 0; color: var(--muted); font-size: 11px; }.blue-tag { color: #337bc8; background: var(--blue-soft); }.mint-tag { color: #168c7d; background: var(--mint-soft); }.head-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.project-list { display: grid; gap: 10px; }.project-row { display: grid; grid-template-columns: 47px 1fr auto; align-items: center; gap: 13px; width: 100%; padding: 16px; border: 1px solid var(--line); color: var(--text); background: #fff; border-radius: 15px; text-align: left; transition: .2s; }.project-row:hover { border-color: #ffc7a1; box-shadow: var(--shadow-hover); transform: translateY(-2px); }.project-mark { display: grid; place-items: center; width: 43px; height: 43px; color: var(--orange-hover); background: var(--orange-soft); border-radius: 13px; font-weight: 850; }.project-row strong, .project-row small { display: block; }.project-row small { margin-top: 2px; color: var(--weak); font-size: 10px; }.project-row i { padding: 4px 9px; color: #178673; background: var(--mint-soft); border-radius: 99px; font-size: 9px; font-style: normal; }.project-empty { display: grid; place-items: center; min-height: 300px; color: var(--muted); background: #fff; border: 1px dashed #ddd2c2; border-radius: 18px; text-align: center; }.project-empty p { margin: 4px 0; font-size: 11px; }.clapper-mini { width: 42px; height: 34px; background: var(--orange-soft); border: 2px solid var(--orange); border-radius: 8px; }
.review-panel { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; padding: 16px 18px; background: #fff; border: 1px solid #bfeadf; border-radius: 15px; }.review-panel.hidden { display: none; }.review-pass { display: flex; align-items: center; gap: 11px; }.review-pass > span { display: grid; place-items: center; width: 35px; height: 35px; color: #fff; background: var(--mint); border-radius: 12px; font-weight: 850; }.review-pass strong, .review-pass p { display: block; margin: 0; }.review-pass p { color: var(--muted); font-size: 10px; }.review-checks { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }.review-checks span { padding: 4px 8px; border-radius: 99px; font-size: 9px; }.review-checks .passed { color: #177a66; background: var(--mint-soft); }.review-failed { width: 100%; color: #984440; }.review-failed ul { margin: 6px 0 0; font-size: 10px; }
.adapter-panel { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 16px; padding: 16px 18px; background: linear-gradient(115deg,#f2f8ff,#fff); border: 1px solid #d7e9ff; border-radius: 15px; }.adapter-panel.hidden { display: none; }.adapter-panel strong { display: inline-block; margin-left: 8px; font-size: 12px; }.adapter-panel p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }.adapter-actions { display: flex; align-items: center; gap: 10px; }.adapter-actions > span { color: var(--weak); font-size: 9px; white-space: nowrap; }.merge-check { display: grid; place-items: center; flex: 0 0 20px; width: 20px; height: 20px; cursor: pointer; }.merge-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }.merge-check i { display: grid; place-items: center; width: 18px; height: 18px; border: 1px solid #c8d6e6; background: #fff; border-radius: 6px; }.merge-check input:checked + i { border-color: var(--blue); background: var(--blue); }.merge-check input:checked + i::after { content: "✓"; color: #fff; font-size: 11px; font-style: normal; }.variant-list { display: grid; gap: 12px; margin-bottom: 16px; }.variant-card { overflow: hidden; background: #fff; border: 1px solid #cfe4ff; border-radius: 16px; box-shadow: 0 8px 26px rgba(77,163,255,.08); }.variant-card header { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; background: var(--blue-soft); }.variant-card header strong, .variant-card header small { display: block; }.variant-card header strong { margin-top: 5px; font-size: 12px; }.variant-card header small { color: var(--muted); font-size: 9px; }.variant-card pre { margin: 0; padding: 18px; white-space: pre-wrap; font: 10px/1.8 ui-monospace,Consolas,"Microsoft YaHei",monospace; }
.delivery-list { display: grid; gap: 17px; }.delivery-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 8px 26px rgba(111,83,50,.05); overflow: hidden; transition: .2s; }.delivery-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }.delivery-card header { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 15px 17px; border-bottom: 1px solid var(--line); }.delivery-card header > div { display: flex; align-items: center; gap: 11px; min-width: 0; }.delivery-card header strong, .delivery-card header small { display: block; }.delivery-card header strong { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; }.delivery-card header small { color: var(--weak); font-size: 9px; }.card-index { display: grid; place-items: center; width: 34px; height: 34px; color: var(--orange-hover); background: var(--orange-soft); border-radius: 10px; font-size: 10px; font-weight: 850; }
.episode-badge { flex: 0 0 auto; padding: 4px 9px; color: #9a6b1d; background: var(--yellow-soft); border-radius: 99px; font-size: 9px; font-weight: 800; white-space: nowrap; }
.episode-nav { position: sticky; top: 0; z-index: 30; margin: -4px 0 17px; padding: 12px 14px; background: rgba(255,253,248,.92); border: 1px solid var(--line); border-radius: 15px; box-shadow: 0 8px 24px rgba(111,83,50,.08); backdrop-filter: blur(8px); }
.episode-nav.hidden { display: none; }.episode-nav-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 9px; }.episode-nav-head span { color: var(--text); font-size: 11px; font-weight: 850; }.episode-nav-head small { color: var(--weak); font-size: 9px; }
.episode-nav-pills { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 3px; scrollbar-width: thin; }.episode-pill { flex: 0 0 auto; padding: 6px 12px; color: var(--muted); background: #fff; border: 1px solid #e9e0d2; border-radius: 99px; font-size: 10px; font-weight: 750; cursor: pointer; transition: .2s; }.episode-pill:hover { border-color: #ffc396; background: var(--orange-soft); transform: translateY(-1px); }.episode-pill.active { color: #fff; background: var(--orange); border-color: var(--orange); box-shadow: 0 4px 12px rgba(255,138,61,.28); }
.back-to-top { position: fixed; right: 28px; bottom: 30px; z-index: 40; display: none; place-items: center; width: 44px; height: 44px; color: #fff; background: var(--orange); border: 0; border-radius: 14px; box-shadow: 0 10px 26px rgba(255,138,61,.35); font-size: 18px; cursor: pointer; transition: .2s; }.back-to-top.show { display: grid; }.back-to-top:hover { background: var(--orange-hover); transform: translateY(-2px); }
.shot-edit-actions { display: flex; gap: 10px; margin-top: 18px; }.shot-edit-actions .primary-btn { flex: 1; margin-top: 0; }
.storyboard-image-card { width: min(860px, 100%); }.storyboard-image-tools { display: flex; align-items: flex-end; gap: 12px; margin-top: 14px; }.storyboard-image-tools .field { flex: 1; }.storyboard-image-tools .primary-btn { width: auto; margin: 0; white-space: nowrap; }.storyboard-image-status { margin-top: 12px; padding: 9px 11px; color: var(--muted); background: var(--soft); border-radius: 10px; font-size: 10px; line-height: 1.6; }.storyboard-image-status.loading { color: #a5531e; background: var(--orange-soft); }.storyboard-image-status.error { color: #a94743; background: #fff0ef; }.storyboard-image-preview { margin-top: 14px; }.storyboard-image-preview img.storyboard-image-result { display: block; width: 100%; max-height: 72vh; object-fit: contain; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 12px 32px rgba(87,67,45,.12); cursor: zoom-in; }.storyboard-image-preview img.storyboard-image-result.zoomed { cursor: zoom-out; }.storyboard-image-actions { display: flex; gap: 8px; margin-top: 12px; }
.shot-card pre { max-height: 620px; overflow: auto; margin: 0; padding: 21px; color: #343940; background: #fffdfa; white-space: pre-wrap; word-break: break-word; font: 11px/1.9 ui-monospace,"SFMono-Regular",Consolas,"Microsoft YaHei",monospace; }
.keyframe-list { border-top: 1px solid var(--line); background: #f8fbff; }.keyframe-list summary { list-style: none; }.keyframe-list summary::-webkit-details-marker { display: none; }.keyframe-title { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; cursor: pointer; user-select: none; }.keyframe-title::before { content: "▸"; margin-right: 8px; color: #337dcc; transition: transform .2s; }.keyframe-list[open] .keyframe-title::before { transform: rotate(90deg); }.keyframe-title strong { color: #337dcc; font-size: 11px; }.keyframe-title span { color: var(--weak); font-size: 9px; }.keyframe-list > .keyframe-item, .keyframe-list > .version-list { margin: 0 16px 16px; }.keyframe-item { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 12px; padding: 11px 12px; background: #fff; border: 1px solid #dcecff; border-radius: 11px; }.keyframe-item + .keyframe-item { margin-top: 8px; }.keyframe-item b { display: block; color: #337dcc; font-size: 9px; }.keyframe-item p { margin: 4px 0 0; color: #4a5562; font: 9px/1.7 ui-monospace,Consolas,monospace; }
.asset-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; }.asset-icon { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; border-radius: 11px; font-size: 11px; font-weight: 800; }.asset-icon.face { color: #bd4f73; background: var(--pink-soft); }.asset-icon.full { color: #337dcc; background: var(--blue-soft); }.asset-icon.scene { color: #168c7d; background: var(--mint-soft); }.asset-icon.prop { color: #997019; background: var(--yellow-soft); }.asset-section { margin: 14px 16px; padding: 13px; border-radius: 12px; }.asset-section span { font-size: 8px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }.asset-section p { margin: 6px 0 0; color: #454a52; font: 10px/1.75 ui-monospace,Consolas,monospace; }.asset-section.positive { background: #f2fbf8; }.asset-section.positive span { color: #168c7d; }.asset-section.negative { background: #fff5f4; }.asset-section.negative span { color: #b75551; }.asset-card details { margin: 0 16px 16px; padding: 9px 12px; color: var(--muted); background: var(--soft); border-radius: 10px; font-size: 9px; }.asset-card summary { cursor: pointer; color: var(--text); font-weight: 750; }.asset-empty-symbol { position: relative; width: 58px; height: 58px; background: var(--mint-soft); border: 2px solid var(--mint); border-radius: 18px; transform: rotate(8deg); }.asset-empty-symbol i { position: absolute; inset: 15px; border: 2px dashed var(--mint); border-radius: 8px; }
.asset-actions { display: flex; gap: 6px; }.version-list { display: grid; gap: 6px; margin-top: 10px; }.version-list > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 8px; background: #fff; border-radius: 8px; }.version-list button { border: 0; color: var(--orange-hover); background: var(--orange-soft); border-radius: 7px; font-size: 8px; }.no-version { color: var(--weak); }.refine-modal-card { width: min(580px,100%); }.current-asset-summary { margin-top: 16px; padding: 12px; background: var(--mint-soft); border-radius: 11px; }.current-asset-summary span { color: #168c7d; font-size: 9px; font-weight: 800; }.current-asset-summary p { max-height: 100px; overflow: auto; margin: 5px 0 0; color: #42635e; font: 9px/1.65 ui-monospace,Consolas,monospace; }.refine-modal-card textarea { min-height: 110px; padding: 12px; margin-top: 7px; resize: vertical; font-size: 11px; }
.modal { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 20px; background: rgba(35,39,47,.35); backdrop-filter: blur(6px); }.modal.hidden { display: none; }.modal-card { width: min(500px,100%); padding: 24px; background: #fff; border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 28px 80px rgba(38,31,25,.22); }.modal-head { display: flex; align-items: flex-start; justify-content: space-between; }.modal-head h2 { margin: 8px 0 0; font-size: 23px; }.close-btn { width: 34px; height: 34px; border: 0; color: var(--muted); background: var(--soft); border-radius: 10px; font-size: 21px; }.settings-status { margin-top: 17px; padding: 10px 12px; color: #9a6b1d; background: var(--yellow-soft); border-radius: 10px; font-size: 10px; }.modal-desc { color: var(--muted); font-size: 10px; line-height: 1.7; }.full-btn { width: 100%; margin-top: 20px; }.settings-result { min-height: 20px; margin-top: 10px; color: var(--muted); font-size: 10px; }
.toast { position: fixed; right: 28px; bottom: 28px; z-index: 100; padding: 11px 15px; color: #fff; background: #303740; border-radius: 11px; box-shadow: 0 10px 30px rgba(0,0,0,.18); font-size: 11px; opacity: 0; pointer-events: none; transform: translateY(10px); transition: .2s; }.toast.show { opacity: 1; transform: none; }.toast.warning { background: #9a7225; }.toast.error { background: #a44743; }
@media (max-width: 1120px) { .hero { grid-template-columns: 1.25fr .7fr; }.stats-card { grid-column: 1/-1; grid-template-columns: repeat(3,1fr); }.pipeline-steps { grid-template-columns: repeat(3,1fr); }.pipeline-step > i { display: none; }.asset-grid { grid-template-columns: 1fr; } }
@media (max-width: 840px) { .app-shell { grid-template-columns: 78px minmax(0,1fr); }.sidebar { padding: 22px 13px; }.brand { justify-content: center; padding-inline: 0; }.brand > div:last-child, .nav-item span, .scope-note, .model-pill div, .settings-link { display: none; }.new-project { padding: 10px 4px; font-size: 0; }.new-project span { margin: 0; font-size: 21px; }.nav-item { justify-content: center; padding: 12px; }.model-pill { justify-content: center; }.main { padding-inline: 24px; }.hero { grid-template-columns: 1fr; }.mascot-card { display: none; }.workspace-grid, .understanding-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .app-shell { display: block; }.sidebar { position: fixed; inset: auto 0 0 0; flex-direction: row; align-items: center; width: auto; height: 68px; padding: 8px; border: 1px solid var(--line); }.brand, .new-project, .sidebar-foot { display: none; }.nav { grid-template-columns: repeat(auto-fit,minmax(55px,1fr)); width: 100%; }.nav-item { gap: 2px; padding: 7px 4px; }.nav-item span { display: block; font-size: 8px; }.nav-item svg { width: 19px; }.main { padding: 0 14px 90px; }.topbar { min-height: 86px; }.truth-pill { display: none; }.hero { padding: 24px 20px; }.hero h2 { font-size: 31px; }.stats-card { grid-template-columns: 1fr; }.pipeline-steps { grid-template-columns: 1fr; }.mini-head p { display: none; }.panel-head, .section-head { align-items: flex-start; }.section-head { flex-direction: column; padding: 21px; }.head-actions { justify-content: flex-start; }.confirm-bar { align-items: stretch; flex-direction: column; }.confirm-bar > div { margin: 0; }.review-panel { align-items: flex-start; flex-direction: column; }.asset-grid { display: block; }.asset-card + .asset-card { margin-top: 15px; }.settings-grid, .routing-list { grid-template-columns: 1fr; } }

/* 2026 multi-project production workspace */
.hero { grid-template-columns: minmax(0,1.45fr) minmax(220px,.72fr) minmax(160px,.46fr); }
.auto-flow-card { position: relative; z-index: 2; align-self: center; padding: 20px; background: rgba(255,255,255,.88); border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 12px 28px rgba(111,83,50,.08); }
.auto-flow-card > span { color: var(--orange-hover); font-size: 10px; font-weight: 850; letter-spacing: .08em; }
.auto-flow-card ol { display: grid; gap: 9px; padding: 0; margin: 14px 0; list-style: none; }
.auto-flow-card li { display: flex; align-items: center; gap: 10px; padding: 10px; color: var(--muted); background: var(--soft); border-radius: 12px; font-size: 11px; }
.auto-flow-card li b { display: grid; place-items: center; width: 27px; height: 27px; color: var(--orange-hover); background: var(--orange-soft); border-radius: 9px; font-size: 9px; }
.auto-flow-card button { width: 100%; }
.work-status-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 22px 0; padding: 14px 17px; background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.work-status-bar > div { display: flex; align-items: center; gap: 11px; }.work-status-bar strong,.work-status-bar small { display: block; }.work-status-bar strong { font-size: 12px; }.work-status-bar small { color: var(--muted); font-size: 10px; }
.status-pulse { width: 10px; height: 10px; background: var(--weak); border-radius: 50%; }.work-status-bar.active .status-pulse { background: var(--orange); animation: breathe 1.4s infinite; }.work-status-bar.done .status-pulse { background: var(--mint); }.work-status-bar.failed .status-pulse { background: var(--red); }
.field-help { margin: 7px 2px 0; color: var(--weak); font-size: 9px; line-height: 1.55; }
.project-overview { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 14px; }.project-overview article { padding: 14px 16px; background: #fff; border: 1px solid var(--line); border-radius: 14px; }.project-overview b,.project-overview span { display: block; }.project-overview b { font-size: 23px; }.project-overview span { color: var(--muted); font-size: 9px; }
.project-tools { display: grid; grid-template-columns: minmax(220px,1fr) 210px; gap: 10px; margin-bottom: 14px; }.project-tools label { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; padding: 8px 12px; color: var(--muted); background: #fff; border: 1px solid var(--line); border-radius: 12px; font-size: 10px; }.project-tools input,.project-tools select { height: 32px; padding: 0 10px; background: var(--soft); }
.project-row { grid-template-columns: 47px minmax(0,1fr) auto; cursor: default; }.project-copy strong,.project-copy small { display: block; }.project-copy small { margin-top: 2px; color: var(--weak); font-size: 10px; }.project-metrics { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }.project-metrics span { padding: 3px 7px; color: var(--muted); background: var(--soft); border-radius: 99px; font-size: 8px; }.project-actions { display: flex; align-items: center; gap: 7px; }.project-status { padding: 5px 9px; color: #178673; background: var(--mint-soft); border-radius: 99px; font-size: 9px; font-style: normal; }.project-status.active,.project-status.queued { color: #a25722; background: var(--orange-soft); }.project-status.needs_review { color: #8d681c; background: var(--yellow-soft); }.project-status.failed,.project-status.review_failed { color: #a94743; background: #fff0ef; }
.progress-workspace { margin-top: 0; }.progress-grid { display: grid; grid-template-columns: minmax(300px,.8fr) minmax(0,1.2fr); gap: 16px; }.progress-summary,.event-panel { padding: 20px; }.progress-summary-body { display: grid; gap: 10px; }.summary-stat { padding: 12px; background: var(--soft); border-radius: 12px; }.summary-stat strong,.summary-stat span { display: block; }.summary-stat strong { font-size: 11px; }.summary-stat span { margin-top: 3px; color: var(--muted); font-size: 9px; }.event-list { display: grid; max-height: 410px; overflow: auto; }.event-row { display: grid; grid-template-columns: 10px minmax(0,1fr) auto; gap: 9px; padding: 10px 4px; border-bottom: 1px solid var(--line); }.event-row > i { width: 7px; height: 7px; margin-top: 5px; background: var(--weak); border-radius: 50%; }.event-row.running > i { background: var(--orange); }.event-row.completed > i { background: var(--mint); }.event-row.failed > i { background: var(--red); }.event-row strong,.event-row small { display: block; }.event-row strong { font-size: 10px; }.event-row small { color: var(--muted); font-size: 8px; }.event-row time { color: var(--weak); font-size: 8px; }
.progress-project-context { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: -8px 0 16px; padding: 17px 19px; background: linear-gradient(100deg,#fff8f1,#fff 56%); border: 1px solid #f3d7c0; border-left: 5px solid var(--orange); border-radius: 17px; box-shadow: 0 10px 28px rgba(111,83,50,.07); }
.progress-project-identity { display: flex; align-items: center; gap: 13px; min-width: 0; }.progress-project-identity > div { min-width: 0; }.progress-project-identity small,.progress-project-identity strong,.progress-project-identity p { display: block; }.progress-project-identity small { color: var(--orange-hover); font-size: 10px; font-weight: 850; letter-spacing: .08em; }.progress-project-identity strong { overflow: hidden; margin-top: 2px; font-size: 18px; white-space: nowrap; text-overflow: ellipsis; }.progress-project-identity p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.progress-project-controls { display: flex; align-items: center; gap: 12px; }.progress-project-controls label { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 10px; font-weight: 700; }.progress-project-controls select { width: min(330px,30vw); height: 40px; padding: 0 36px 0 12px; background: #fff; }
.asset-tools { display: grid; grid-template-columns: minmax(220px,1fr) 180px; gap: 10px; margin-bottom: 14px; }.asset-tools input,.asset-tools select { height: 40px; padding: 0 12px; background: #fff; }
.modal-card { max-height: calc(100vh - 40px); overflow: auto; }.shot-edit-card { width: min(820px,100%); }.continuity-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 16px 0; }.continuity-strip > div { min-width: 0; padding: 10px; background: var(--soft); border: 1px solid var(--line); border-radius: 11px; }.continuity-strip .current { background: var(--orange-soft); border-color: #ffd2b3; }.continuity-strip span { color: var(--weak); font-size: 8px; font-weight: 800; }.continuity-strip p { overflow: hidden; margin: 4px 0 0; color: var(--muted); white-space: nowrap; text-overflow: ellipsis; font-size: 9px; }.shot-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }.shot-edit-grid .wide { grid-column: 1/-1; }.shot-edit-grid textarea { min-height: 90px; padding: 12px; margin-top: 7px; resize: vertical; font-size: 10px; }.adapter-modal-card { width: min(640px,100%); }.adapter-modal-card textarea { min-height: 150px; padding: 12px; margin-top: 7px; resize: vertical; font-size: 10px; }
@media (max-width: 1120px) { .hero { grid-template-columns: 1.25fr .7fr; } }
@media (max-width: 620px) { .nav { grid-template-columns: repeat(5,1fr); }.nav-item { padding-inline: 2px; }.nav-item span { font-size: 7px; }.adapter-panel,.adapter-actions { align-items: stretch; flex-direction: column; }.project-overview,.project-tools,.progress-grid,.asset-tools,.continuity-strip,.shot-edit-grid { grid-template-columns: 1fr; }.shot-edit-grid .wide { grid-column: auto; }.project-row { grid-template-columns: 43px minmax(0,1fr); }.project-actions { grid-column: 1/-1; justify-content: flex-end; } }
@media (max-width: 760px) { .progress-project-context,.progress-project-controls { align-items: stretch; flex-direction: column; }.progress-project-controls label { display: block; }.progress-project-controls label span { display: block; margin-bottom: 5px; }.progress-project-controls select { width: 100%; } }

.brand-logo { width: 43px; height: 43px; border-radius: 14px; box-shadow: 0 8px 20px rgba(255,138,61,.22); }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid rgba(255,138,61,.25); outline-offset: 2px; }
.section-head p { font-size: 12px; }.copy-btn,.secondary-btn { font-size: 12px; }.project-copy strong { font-size: 15px; }.project-copy small { font-size: 11px; }.project-metrics span,.project-status { font-size: 10px; }

/* 2.2 platform, account and upload experience */
.hidden{display:none!important}.topbar-account{display:flex;align-items:center;gap:10px}.credit-pill{display:flex;align-items:center;gap:7px;padding:8px 12px;background:var(--orange-soft);border:1px solid #ffd3b4;border-radius:12px}.credit-pill small{color:var(--muted)}.credit-pill b{color:var(--orange-hover);font-size:17px}.account-chip{padding:9px 13px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--text);font-weight:750}.upload-page{padding-bottom:50px}.upload-hero{position:relative;overflow:hidden;padding:42px;margin-bottom:20px;border:1px solid #f4d6bf;border-radius:24px;background:linear-gradient(135deg,#fffaf4 0%,#fff 52%,#f1fbf7 100%);box-shadow:0 18px 50px rgba(91,65,42,.08)}.upload-hero:after{content:"镜";position:absolute;right:38px;top:-45px;color:rgba(255,135,61,.07);font-size:240px;font-weight:900}.upload-hero h2{position:relative;margin:12px 0;font-size:34px;line-height:1.18}.upload-hero em{color:var(--orange);font-style:normal}.upload-hero p{position:relative;max-width:680px;color:var(--muted);line-height:1.8}.upload-spotlight{position:relative;z-index:1;display:inline-grid;grid-template-columns:42px auto;column-gap:12px;align-items:center;margin-top:20px;padding:15px 22px;border:0;border-radius:16px;color:#fff;background:linear-gradient(135deg,#ff8a3d,#f56d2c);box-shadow:0 12px 30px rgba(245,109,44,.28);text-align:left}.upload-spotlight span{grid-row:1/3;font-size:30px}.upload-spotlight strong{font-size:15px}.upload-spotlight small{opacity:.8}.credit-estimate{margin:14px 0;padding:12px 14px;border:1px solid #ffd6b9;border-radius:12px;background:#fff9f3}.credit-estimate span,.credit-estimate small{display:block;color:var(--muted);font-size:10px}.credit-estimate strong{display:block;margin:4px 0;color:var(--orange-hover);font-size:17px}.auth-gate{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,rgba(250,247,241,.97),rgba(241,251,247,.97));backdrop-filter:blur(14px)}.auth-gate.hidden{display:none}.auth-card{width:min(440px,100%);padding:34px;border:1px solid #eddccf;border-radius:24px;background:#fff;box-shadow:0 28px 80px rgba(80,58,40,.16)}.auth-brand{margin-bottom:24px}.auth-card h1{margin:12px 0 6px}.auth-card>p{color:var(--muted);line-height:1.7}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;margin:22px 0 16px;padding:4px;border-radius:12px;background:var(--soft)}.auth-tabs button{padding:9px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-weight:700}.auth-tabs button.active{color:var(--orange-hover);background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.06)}.verify-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.verify-row .secondary-btn{height:42px;margin-bottom:0}.overall-progress-card{margin:16px 0;padding:17px 19px;border:1px solid #f2d7c3;border-radius:15px;background:linear-gradient(90deg,#fffaf5,#fff)}.overall-progress-card>div:first-child{display:flex;justify-content:space-between}.overall-progress-card strong{color:var(--orange-hover);font-size:20px}.overall-progress-track{height:11px;margin:10px 0;overflow:hidden;border-radius:99px;background:#f2ece7}.overall-progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff9c58,#50bda5);transition:width .45s}.overall-progress-card p{margin:0;color:var(--muted);font-size:11px}.node-recovery{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:12px 0;padding:14px 16px;border:1px solid #f3bab6;border-radius:13px;background:#fff5f4}.node-recovery strong{color:#a94743}.node-recovery p{margin:3px 0 0;color:var(--muted);font-size:11px}.node-recovery-actions{display:flex;gap:8px;flex-wrap:wrap}.canvas-tools{display:flex;align-items:center;gap:7px}.canvas-tools #canvasZoomLabel{min-width:38px;color:var(--muted);font-size:10px;text-align:center}.canvas-tools #zoomOutCanvas,.canvas-tools #zoomInCanvas{padding:6px 10px}.canvas-world{transform-origin:top left}.expert-progress-track.indeterminate i{width:34%!important;animation:indeterminate 1.3s ease-in-out infinite}@keyframes indeterminate{0%{transform:translateX(-120%)}100%{transform:translateX(320%)}}.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.admin-stats article{padding:16px;border:1px solid var(--line);border-radius:14px;background:#fff}.admin-stats b,.admin-stats span{display:block}.admin-stats b{font-size:24px}.admin-stats span{color:var(--muted);font-size:10px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.admin-users-panel{grid-column:1/-1}.admin-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.admin-form label{color:var(--muted);font-size:10px}.admin-form input,.admin-form select{width:100%;margin-top:4px}.admin-row,.ledger-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.admin-row small,.ledger-row small{display:block;color:var(--muted)}.profile-balance{padding:18px;border-radius:16px;background:linear-gradient(135deg,var(--orange-soft),#f0fbf8)}.profile-balance span,.profile-balance small{display:block;color:var(--muted)}.profile-balance strong{display:block;margin:5px 0;font-size:34px}.redeem-row{display:flex;gap:9px;margin:18px 0}.redeem-row input{flex:1}.ledger-list{max-height:300px;overflow:auto}.logout-btn{margin-top:16px;color:#a94743}.model-config-card{margin-bottom:10px;padding:12px;border:1px solid var(--line);border-radius:12px}.model-config-card header{display:flex;justify-content:space-between;gap:10px}.model-config-card p{color:var(--muted);font-size:10px}.coupon-code{font-family:monospace;letter-spacing:.08em}.retry-node-btn{position:relative;z-index:3}
.admin-user-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.user-role-badge{display:inline-flex!important;padding:2px 7px;border-radius:99px;font-size:9px!important;font-weight:800;vertical-align:middle}.user-role-badge.user{color:var(--muted);background:var(--soft)}.user-role-badge.admin{color:#167966;background:var(--mint-soft)}.user-role-badge.super_admin{color:#a5521e;background:var(--orange-soft)}
.admin-page{padding-bottom:72px}.admin-page>.section-head{margin-bottom:24px;padding:28px 30px;border:1px solid #f1ddcb;border-radius:22px;background:linear-gradient(135deg,#fffaf5 0%,#fff 58%,#f4fbf8 100%);box-shadow:0 12px 35px rgba(111,83,50,.06)}.admin-page>.section-head h2{font-size:32px;letter-spacing:-.03em}.admin-page>.section-head p{max-width:760px;margin-top:8px;font-size:13px;line-height:1.7}.admin-page .head-actions,.admin-page>.section-head>.secondary-btn{align-self:center}.admin-stats{gap:18px;margin-bottom:22px}.admin-stats article{min-height:112px;padding:22px 24px;border-color:#eee4d8;border-radius:18px;box-shadow:0 8px 22px rgba(111,83,50,.045)}.admin-stats b{font-size:30px;line-height:1.1}.admin-stats span{margin-top:8px;font-size:12px}.admin-grid{gap:22px}.admin-grid>.panel{padding:25px 27px;border-color:#eee4d8;border-radius:20px;box-shadow:0 10px 28px rgba(111,83,50,.045)}.admin-grid .card-kicker{margin-bottom:14px;font-size:13px;letter-spacing:.04em}.admin-section-intro{margin:0 0 18px;color:var(--muted);font-size:13px;line-height:1.75}.admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px}.admin-form-grid label{display:grid;gap:7px;color:#5f6670;font-size:13px;font-weight:700}.admin-form-grid input,.admin-page .model-config-card input,.admin-page .model-config-card select{width:100%;height:46px;padding:0 14px;border:1px solid #e5ddd1;border-radius:11px;background:#fff;color:var(--text);font-size:15px;box-shadow:inset 0 1px 2px rgba(70,50,30,.03);transition:border-color .2s,box-shadow .2s,background .2s}.admin-form-grid input:hover{border-color:#d6c5b4;background:#fffdfa}.admin-form-grid input:focus,.admin-page input:focus,.admin-page select:focus,.admin-page textarea:focus{outline:none;border-color:#ffae77;box-shadow:0 0 0 4px rgba(255,138,61,.13);background:#fff}.admin-form-actions{display:flex;align-items:center;gap:16px;margin-top:21px;padding-top:17px;border-top:1px solid #f0e8df}.admin-form-actions .primary-btn{min-height:46px;padding:0 23px;font-size:14px}.admin-form-actions small{max-width:430px;color:var(--muted);font-size:11px;line-height:1.65}.admin-field-wide{grid-column:1/-1}.admin-page .model-config-card{margin-top:14px;padding:17px 18px;border-color:#e9e0d5;border-radius:15px;background:#fdfbf8}.admin-page .model-config-card header{align-items:flex-start}.admin-page .model-config-card strong{font-size:15px}.admin-page .model-config-card header small{display:block;margin-top:5px;color:var(--muted);font-size:11px}.admin-page .model-config-card p{margin-top:11px;font-size:12px;line-height:1.6}.admin-page #addModelConfig{min-height:45px;margin-top:15px;padding:0 18px;font-size:14px}.admin-page #couponList{margin-top:16px}.admin-page .admin-row{min-height:70px;padding:15px 0;border-bottom-color:#efe7dd}.admin-page .admin-row strong{font-size:14px}.admin-page .admin-row small{margin-top:4px;font-size:11px}.admin-page .admin-row>b,.admin-page .admin-row>div>b{font-size:14px}.admin-user-actions .copy-btn{min-height:34px;padding:0 12px;font-size:11px}.admin-page .inline-empty{padding:20px 0;color:var(--muted);font-size:13px}.admin-page .primary-btn,.admin-page .secondary-btn,.admin-page .copy-btn{border-radius:11px}.admin-page .danger-btn{color:#a94743;background:#fff2f0;border-color:#f1c1bd}
@media(max-width:900px){.admin-grid,.admin-stats{grid-template-columns:1fr}.admin-users-panel{grid-column:auto}.admin-row{align-items:flex-start;flex-direction:column}.admin-user-actions{justify-content:flex-start}.upload-hero{padding:26px}.upload-hero h2{font-size:27px}.topbar-account{gap:5px}.credit-pill{display:none}.admin-form,.admin-form-grid{grid-template-columns:1fr}.admin-field-wide{grid-column:auto}.admin-page>.section-head{padding:23px 21px}.admin-page>.section-head h2{font-size:27px}.admin-grid>.panel{padding:21px 19px}}
.admin-page #billingEditor,.admin-page #couponCreator{display:block}
.merged-progress-panel{display:block;margin-top:30px;padding-top:4px;border-top:1px solid #eee5da}.merged-progress-panel>.section-head{margin-top:20px}.merged-progress-panel .progress-workspace{margin-top:0}
.project-overview span,.project-tools label { font-size: 11px; }.summary-stat strong { font-size: 13px; }.summary-stat span { font-size: 11px; }.event-row strong { font-size: 12px; }.event-row small { font-size: 10px; }.event-row time { font-size: 9px; }
.pipeline-step strong { font-size: 12px; }.pipeline-step span { font-size: 10px; }.adapter-panel p { font-size: 11px; }.variant-card header strong { font-size: 13px; }.variant-card header small { font-size: 10px; }.variant-card pre { font-size: 11px; line-height: 1.9; }
.shot-card pre { font-size: 12px; }.asset-section p { font-size: 11px; }.asset-card details { font-size: 10px; }

/* Humanized expert pipeline cards */
.expert-canvas { height: 706px; background-color: #fdfbf7; }
.canvas-world { width: 1268px; height: 670px; }
.expert-node { display: block; width: 288px; height: 278px; min-height: 278px; padding: 14px; overflow: hidden; background: #fff; border-radius: 20px; box-shadow: 0 12px 30px rgba(87,67,45,.09); transition: border-color .2s, box-shadow .2s, transform .2s; }
.expert-node:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(87,67,45,.12); }
.expert-node.running { border-color: #ffbc8f; box-shadow: 0 0 0 4px rgba(255,138,61,.08),0 14px 32px rgba(87,67,45,.1); }
.expert-head { display: grid; grid-template-columns: 52px minmax(0,1fr) auto; align-items: center; gap: 10px; }
.expert-avatar { display: block; width: 52px; height: 52px; object-fit: cover; object-position: center; background: var(--soft); border: 3px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px var(--line),0 5px 12px rgba(87,67,45,.1); }
.expert-identity { min-width: 0; }.expert-identity > div { display: flex; align-items: center; gap: 7px; }.expert-identity strong { overflow: hidden; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }.expert-identity small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }.expert-identity i { flex: 0 0 7px; width: 7px; height: 7px; background: var(--weak); border-radius: 50%; }.expert-node.running .expert-identity i { background: var(--orange); animation: breathe 1.4s infinite; }.expert-node.done .expert-identity i { background: var(--mint); }.expert-node.failed .expert-identity i { background: var(--red); }
.expert-status-pill { align-self: start; padding: 5px 8px; color: var(--muted); background: var(--soft); border-radius: 99px; font-size: 8px; font-weight: 800; white-space: nowrap; }.expert-node.running .expert-status-pill { color: #a5531e; background: var(--orange-soft); }.expert-node.done .expert-status-pill { color: #168c7d; background: var(--mint-soft); }.expert-node.failed .expert-status-pill { color: #a94743; background: #fff0ef; }
.expert-responsibility { display: -webkit-box; height: 29px; margin: 8px 1px 7px; overflow: hidden; color: var(--muted); font-size: 9px; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.expert-stage-card { padding: 8px 10px; background: var(--soft); border-radius: 12px; }.expert-stage-card > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.expert-stage-card span { overflow: hidden; color: #525963; white-space: nowrap; text-overflow: ellipsis; font-size: 8px; }.expert-stage-card b { color: var(--orange-hover); font-size: 9px; }.expert-progress-track { height: 6px; margin-top: 7px; overflow: hidden; background: #e9e1d5; border-radius: 99px; }.expert-progress-track i { display: block; height: 100%; background: var(--orange); border-radius: inherit; transition: width .35s ease; }.expert-node.done .expert-progress-track i { background: var(--mint); }.expert-node.failed .expert-progress-track i { background: var(--red); }
.expert-io { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }.expert-io > div { min-width: 0; padding: 5px 7px; background: #fffdfa; border: 1px solid #f0eadf; border-radius: 9px; }.expert-io span { display: block; color: var(--weak); font-size: 7px; }.expert-io b { font: 10px/1.4 ui-monospace,Consolas,monospace; }.expert-io small { margin-left: 3px; color: var(--weak); font-size: 7px; }
.expert-meta { display: grid; gap: 2px; margin-top: 7px; padding-top: 6px; border-top: 1px solid var(--line); }.expert-meta > div { display: flex; align-items: center; justify-content: space-between; gap: 9px; min-width: 0; }.expert-meta span { color: var(--weak); font-size: 7px; }.expert-meta b { overflow: hidden; max-width: 190px; color: #555b63; white-space: nowrap; text-overflow: ellipsis; font-size: 8px; font-weight: 700; }.expert-meta > div:last-child b { color: var(--orange-hover); }

/* Two-slot asset refinement */
.asset-version-board { margin: 14px 16px 4px; padding: 12px; background: #fbf8f2; border: 1px solid var(--line); border-radius: 14px; }
.asset-version-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 9px; }.asset-version-heading strong,.asset-version-heading span { display: block; }.asset-version-heading strong { font-size: 11px; }.asset-version-heading span { margin-top: 2px; color: var(--orange-hover); font-size: 8px; font-weight: 800; }.asset-version-heading p { margin: 0; color: var(--weak); font-size: 8px; text-align: right; }
.asset-version-slots { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.asset-version-slot { position: relative; min-width: 0; min-height: 126px; padding: 10px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }.asset-version-slot.latest { background: #fff8f1; border-color: #f3c6a5; box-shadow: inset 0 0 0 1px rgba(255,138,61,.06); }.asset-version-slot.latest.fresh { border-color: var(--orange); box-shadow: 0 0 0 4px rgba(255,138,61,.1); animation: asset-arrive .45s ease-out; }.asset-version-slot.empty { display: grid; align-content: start; background: rgba(255,255,255,.55); border-style: dashed; }
.version-slot-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.version-slot-head span { color: var(--muted); font-size: 8px; font-weight: 800; }.version-slot-head b { padding: 3px 6px; color: var(--orange-hover); background: var(--orange-soft); border-radius: 99px; font-size: 8px; }.asset-version-slot.history .version-slot-head b { color: var(--muted); background: var(--soft); }.asset-version-slot > small { display: block; overflow: hidden; margin-top: 5px; color: var(--weak); white-space: nowrap; text-overflow: ellipsis; font-size: 7px; }.asset-version-slot > p { display: -webkit-box; min-height: 39px; margin: 6px 0 7px; overflow: hidden; color: #4f555d; font: 8px/1.6 ui-monospace,Consolas,monospace; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }.asset-version-slot > i { display: block; color: #a5531e; font-size: 7px; font-style: normal; font-weight: 750; }.asset-version-slot .secondary-btn { min-height: 27px; padding: 5px 8px; font-size: 8px; }.version-empty-copy { padding-top: 21px; text-align: center; }.version-empty-copy strong,.version-empty-copy span { display: block; }.version-empty-copy strong { color: var(--muted); font-size: 9px; }.version-empty-copy span { margin-top: 4px; color: var(--weak); font-size: 8px; line-height: 1.5; }
.asset-card.fresh-version { border-color: #f3bd96; box-shadow: 0 12px 32px rgba(255,138,61,.12); }.asset-refine-feedback { padding: 9px 10px; border-radius: 9px; }.asset-refine-feedback.loading { color: #a5531e; background: var(--orange-soft); }.asset-refine-feedback.error { color: #a94743; background: #fff0ef; }
@keyframes asset-arrive { from { opacity: .55; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 620px) { .asset-version-heading { align-items: flex-start; flex-direction: column; }.asset-version-heading p { text-align: left; }.asset-version-slots { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .expert-node,.expert-progress-track i,.asset-version-slot.latest.fresh { transition: none; animation: none; } }

/* 分镜图放大预览 Lightbox（覆盖旧 zoomed 光标行为，提供真正的大图查看） */
.storyboard-image-preview img.storyboard-image-result { cursor: zoom-in; }
.storyboard-image-preview img.storyboard-image-result.zoomed { cursor: zoom-in; }
.image-lightbox { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 28px; background: rgba(18,20,24,.92); cursor: zoom-out; backdrop-filter: blur(4px); }
.image-lightbox.hidden { display: none; }
.image-lightbox img { max-width: 96vw; max-height: 94vh; object-fit: contain; border-radius: 12px; box-shadow: 0 24px 80px rgba(0,0,0,.5); cursor: zoom-out; transition: transform .15s ease; }
.image-lightbox-close { position: fixed; top: 16px; right: 20px; z-index: 301; display: grid; place-items: center; width: 42px; height: 42px; border: 0; color: #fff; background: rgba(255,255,255,.14); border-radius: 12px; font-size: 26px; cursor: pointer; transition: .2s; }
.image-lightbox-close:hover { background: rgba(255,255,255,.26); transform: rotate(90deg); }