/* 环境设计第九课（剧本、分镜与剪映成片）：沿用 journey-space-workflow.css 与页面内第九课样式，这里只补新工作台独有的部分 */
#l09Mode .workflow-panel{display:block}
.l09e-modes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.l09e-mode{font-family:inherit;color:inherit;text-align:left;cursor:pointer;padding:12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;display:flex;flex-direction:column;gap:6px}
.l09e-mode:hover{border-color:var(--forest)}
.l09e-mode.is-on{border-color:var(--forest);background:var(--forest-soft);box-shadow:inset 0 0 0 1px var(--forest)}
.l09e-mode b{font-size:.92rem}
.l09e-mode small{font-size:.74rem;color:var(--ink-3);line-height:1.55}
.l09e-mode ol{margin:2px 0 0;padding-left:1.2em;font-size:.74rem;line-height:1.6;color:var(--ink-2,#3f4a44)}
.l09e-up{display:block;width:100%;border-radius:8px;border:1px solid var(--line)}
.l09e-rows,.l09e-srows{display:grid;gap:8px;margin-top:6px}
.l09e-row,.l09e-srow{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff}
.l09e-srow{grid-template-columns:44px 7.5em minmax(0,2fr) minmax(0,1.2fr) 5.5em;align-items:end}
.l09e-no{display:grid;place-items:center;align-content:center;gap:2px;width:44px;height:44px;border-radius:10px;background:var(--forest);color:#fff;font-weight:700;font-size:1rem}
.l09e-no span{font-size:.62rem;font-weight:400;opacity:.85}
.l09e-act{font-size:.8rem;align-self:center}
.l09e-cols{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.9fr) minmax(0,.9fr) 5.5em;gap:8px}
.l09e-cols .l09e-wide{grid-column:1 / -1}
.l09e-ops{display:flex;flex-direction:column;gap:4px}
.l09e-ops .btn{min-width:32px;padding:3px 6px}
.l09e-strip{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
.l09e-tipbox{margin:10px 0 12px;padding:10px 12px;border-radius:var(--radius-sm);background:rgba(201,138,43,.10);border:1px solid rgba(201,138,43,.35);font-size:.78rem;line-height:1.7}
.l09e-tipbox p{margin:2px 0}
.l09e-tipbox code{display:inline-block;margin:0 3px;padding:0 6px;border-radius:5px;background:#fff;border:1px solid var(--line);font-family:inherit}
.l09e-asm{position:relative;margin:4px 0 12px}
.l09e-asm pre{margin:0;max-height:260px;overflow:auto;padding:12px 14px;border-radius:var(--radius-sm);background:#1d2420;color:#e8efe9;font-size:.74rem;line-height:1.65;white-space:pre-wrap}
.l09e-asm .btn{position:absolute;top:8px;right:8px}
.l09e-keys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.l09e-key{display:flex;flex-direction:column;gap:6px;padding:10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff}
.l09e-key img,.l09e-key .ph{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:6px;background:var(--paper)}
.l09e-key .ph{display:grid;place-items:center;font-size:.74rem;color:var(--ink-3);border:1px dashed var(--line)}
.l09e-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);opacity:0;pointer-events:none;padding:9px 16px;border-radius:999px;background:#1d2420;color:#fff;font-size:.82rem;transition:.25s;z-index:60}
.l09e-toast.show{opacity:1;transform:translateX(-50%)}
.l09e-toast.warn{background:#9a4a20}
@media (max-width:1080px){.l09e-modes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .l09e-cols{grid-template-columns:1fr 1fr}
  .l09e-srow{grid-template-columns:44px minmax(0,1fr)}
  .l09e-srow>*:nth-child(n+3){grid-column:1 / -1}
  .l09e-keys{grid-template-columns:1fr}
}