.scenario-view { max-width: none; }
.scenario-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:16px 0 10px; }
.scenario-toolbar input { flex:1; min-width:180px; }
.scenario-toolbar select { width:220px; }
.scenario-toolbar input,.scenario-toolbar select,.scenario-inspector input,.scenario-inspector textarea,.scenario-inspector select,.scenario-preview input {
  box-sizing:border-box; color:#eee; background:#202024; border:1px solid #414149; border-radius:7px; padding:10px; font:14px system-ui,sans-serif;
}
.scenario-action { font:600 13px system-ui,sans-serif; color:#eee; background:#292930; border:1px solid #45454f; border-radius:7px; padding:10px 13px; cursor:pointer; }
.scenario-action.primary { background:#2481cc; border-color:#2481cc; color:white; }
.scenario-action.danger { color:#ffacac; margin-top:15px; }
.scenario-action:disabled { opacity:.45; cursor:default; }
.scenario-action:focus-visible,.scenario-node:focus-visible { outline:3px solid #66b8ff; outline-offset:2px; }
.scenario-hint { font-size:13px; color:#adadb7; min-height:22px; margin-bottom:12px; }
.scenario-hint.is-error { color:#ffb6b6; }
.scenario-workspace { display:grid; grid-template-columns:190px minmax(300px,1fr) 270px; min-height:610px; border:1px solid #36363d; border-radius:10px; overflow:hidden; }
.scenario-palette,.scenario-inspector { background:#18181c; padding:16px; }
.scenario-palette { border-right:1px solid #36363d; }
.scenario-palette .scenario-action { width:100%; text-align:left; margin-bottom:7px; }
.scenario-inspector { border-left:1px solid #36363d; max-height:750px; overflow-y:auto; }
.scenario-workspace h2 { font-size:16px; margin:3px 0 14px; }
.scenario-workspace h3 { font-size:14px; margin:20px 0 10px; }
.scenario-palette h2:not(:first-child) { margin-top:24px; }
.scenario-note { color:#a0a0ab; font-size:12px; line-height:1.6; }
.scenario-canvas-area { background-color:#111116; background-image:radial-gradient(#3b3b45 1px,transparent 1px); background-size:20px 20px; overflow:auto; max-height:750px; min-height:610px; }
.scenario-board { position:relative; min-width:980px; min-height:600px; }
.scenario-lines { position:absolute; inset:0; overflow:visible; pointer-events:none; }
.scenario-lines path { fill:none; stroke:#6b7da1; stroke-width:2; }
.scenario-lines marker path { fill:#6b7da1; stroke:none; }
.scenario-lines text { fill:#bdc8de; font:11px system-ui,sans-serif; paint-order:stroke; stroke:#111116; stroke-width:4px; stroke-linejoin:round; }
.scenario-node { position:absolute; width:240px; height:86px; text-align:left; display:flex; flex-direction:column; justify-content:center; gap:6px; padding:14px 16px; border:1px solid #4c4c57; border-left:4px solid #6695e0; border-radius:9px; background:#24242c; color:#f4f4f7; cursor:grab; box-shadow:0 4px 16px #0004; touch-action:none; }
.scenario-node:active { cursor:grabbing; }
.scenario-node.selected { outline:2px solid #78b6ff; outline-offset:2px; }
.scenario-node strong { display:block; font:600 14px system-ui,sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.scenario-node-kind { font:11px system-ui,sans-serif; color:#b6b6c7; }
.scenario-node[data-kind=question] { border-left-color:#bb86ef; }
.scenario-node[data-kind=condition] { border-left-color:#e4b35f; }
.scenario-node[data-kind=delay] { border-left-color:#d9887e; }
.scenario-node[data-kind=start],.scenario-node[data-kind=end] { border-left-color:#76b8a0; }
.scenario-field { display:block; font-size:12px; margin:12px 0; }
.scenario-field span { display:block; color:#bbbcc7; margin-bottom:6px; }
.scenario-field input,.scenario-field textarea,.scenario-field select { width:100%; margin:0; }
.scenario-field textarea { min-height:120px; resize:vertical; }
.scenario-empty { padding:40px; color:#a0a0ab; }
.scenario-preview { margin:24px 0; padding:22px; border:1px solid #41414a; border-radius:10px; max-width:760px; scroll-margin-top:72px; }
.scenario-preview[hidden] { display:none; }
.scenario-preview .scenario-action { margin:7px 8px 0 0; }
.scenario-preview-log { display:flex; flex-direction:column; gap:9px; margin:18px 0; }
.scenario-bubble { align-self:flex-start; background:#262631; border-radius:12px 12px 12px 2px; padding:12px 15px; max-width:90%; font-size:14px; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
.scenario-bubble.user { align-self:flex-end; background:#1b4567; border-radius:12px 12px 2px 12px; }
.scenario-bubble.guide { border:1px solid #576e81; }
.scenario-preview-link { display:block; color:#90c9ff; margin-top:10px; font-size:12px; }
.scenario-fields { display:grid; grid-template-columns:120px 1fr; gap:9px; font-size:13px; }
.scenario-fields dt { color:#b6b6c7; }.scenario-fields dd { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; }
@media(max-width:1050px) { .scenario-workspace { grid-template-columns:150px minmax(260px,1fr); }.scenario-inspector { grid-column:1/-1; border-left:0; border-top:1px solid #36363d; max-height:none; }.scenario-inspector .scenario-field { max-width:550px; } }
@media(max-width:600px) { .scenario-toolbar>* { width:100%!important; }.scenario-toolbar .scenario-action { width:auto!important; }.scenario-workspace { display:flex; flex-direction:column; }.scenario-palette { display:flex; gap:6px; flex-wrap:wrap; }.scenario-palette h2,.scenario-palette .scenario-note { width:100%; }.scenario-palette .scenario-action { width:auto; }.scenario-canvas-area { min-height:400px; max-height:480px; }.scenario-preview { padding:14px; }.scenario-fields { grid-template-columns:80px 1fr; } }