/* SVGMotion Characters — studio shell. Only styles for char-added
   surfaces: #charBar, rig/micro/macro/world sidebar panels, #worldStage,
   the rail's World mode, context gating. Everything else comes from
   styles.css/layout.css via the injected editor DOM. */

#charBoot { z-index: 999; background: var(--bg); }
#charBoot.gone { display: none; }

/* ---- char-specific chrome removals — the scene tour would wipe the rig */
#tourBtn, #gsTour, #tourBtn2 { display: none !important; }

/* ---- char bar — floats top-right over the canvas hud ---- */
#charBar{position:fixed;top:10px;right:14px;z-index:60;display:flex;align-items:center;gap:8px;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:6px 10px;
  box-shadow:0 4px 18px #0004;font:12px/1 'DM Sans',sans-serif}
#charBar .cb-badge{display:flex;align-items:baseline;gap:6px;color:var(--ink)}
#charBar .cb-badge em{font-style:normal;font-size:10px;color:#f2b84b;letter-spacing:.04em}
#charBar button,#charBar .cb-link{border:1px solid var(--line);background:var(--chrome-2);color:var(--ink);
  border-radius:8px;padding:5px 9px;font:inherit;cursor:pointer;text-decoration:none}
#charBar button:hover,#charBar .cb-link:hover{border-color:var(--purple)}
#charBar button.on{background:var(--purple);color:#fff;border-color:var(--purple)}

/* ---- context gating -------------------------------------------------------
   Connect view: world stage can never overlay the graph (the 1/2 keys call
   shared setView directly, so this must be CSS, not a JS hook). Rig/micro
   panels are canvas-context; the macro composer stays (it IS graph work). */
.app-shell[data-view="connect"] #worldStage{display:none}
.app-shell[data-view="connect"] .pt-rig,.app-shell[data-view="connect"] #rigPanel,
.app-shell[data-view="connect"] .pt-parts,.app-shell[data-view="connect"] #partsPanel,
.app-shell[data-view="connect"] .pt-micro,.app-shell[data-view="connect"] #microPanel{display:none}

/* World mode: the sidebar shows the world panel instead of rig panels, and
   editor-only chrome (transport, canvas toolbar) parks. */
body[data-char-world="1"] .pt-rig,body[data-char-world="1"] #rigPanel,
body[data-char-world="1"] .pt-parts,body[data-char-world="1"] #partsPanel,
body[data-char-world="1"] .pt-micro,body[data-char-world="1"] #microPanel,
body[data-char-world="1"] .pt-macro,body[data-char-world="1"] #macroPanel,
body[data-char-world="1"] .pt-layers,body[data-char-world="1"] #layerList,
body[data-char-world="1"] .pt-act,body[data-char-world="1"] #actionList,
body[data-char-world="1"] .pt-gs,body[data-char-world="1"] #gsBody{display:none}
body[data-char-world="1"] .transport{display:none}
body[data-char-world="1"] .timeline{display:none} /* timeline + inspector park in world mode */
/* stage mode takes the whole canvas — sidebar + inspector hide entirely */
body[data-char-world="1"] .app-shell{grid-template-columns:52px 0 minmax(0,1fr) 0}
body[data-char-world="1"] .sidebar,body[data-char-world="1"] .inspector{display:none}
.pt-world,#worldPanel{display:none}
body[data-char-world="1"] .pt-world{display:flex}
body[data-char-world="1"] #worldPanel{display:block}
body[data-char-world="1"] #worldPanel[hidden]{display:none}

/* ---- rig panel ---- */
.rig-panel{padding:6px 10px 10px;font:12px/1.5 'DM Sans',sans-serif;color:var(--ink)}
.rig-hint{font-size:10.5px;color:var(--muted);margin-bottom:6px}
.rig-arch{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:8px}
.arch-chip{border:1px solid var(--line);background:var(--chrome-2);color:var(--ink);
  border-radius:999px;padding:2px 9px;font:10.5px/1.5 'DM Sans',sans-serif;cursor:pointer}
.arch-chip.sel{background:var(--purple);border-color:var(--purple);color:#fff}
.rig-row{display:flex;align-items:center;gap:7px;padding:3px 4px;border-radius:6px;cursor:pointer}
.rig-row:hover{background:var(--bg-2)}
.rig-row .rig-dot{color:#f2b84b;font-size:9px}
.rig-row.ok .rig-dot{color:#7ee0c3}
.rig-row .rig-role{flex:1}
.rig-row .rig-at{color:var(--muted);font-family:'DM Mono',monospace;font-size:10.5px}

/* ---- micro panel ---- */
.micro-panel{padding:6px 10px 10px;font:12px/1.4 'DM Sans',sans-serif}
.micro-row{display:flex;align-items:center;gap:7px;padding:3px 4px;border-radius:6px}
.micro-row:hover{background:var(--bg-2)}
.micro-row.off{opacity:.45}
.micro-row .micro-ic{width:16px;text-align:center}
.micro-row .micro-label{flex:1;color:var(--ink)}
.micro-add{border:1px solid var(--line);background:var(--chrome-2);color:var(--ink);
  border-radius:7px;padding:2px 8px;font:11px/1.4 'DM Sans',sans-serif;cursor:pointer}
.micro-add:hover:not(:disabled){border-color:var(--purple)}
.micro-add:disabled{opacity:.5;cursor:default}
.micro-custom{display:flex;gap:6px;margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.wp-btn{border:1px solid var(--line);background:var(--chrome-2);color:var(--ink);
  border-radius:7px;padding:4px 9px;font:11px/1.4 'DM Sans',sans-serif;cursor:pointer}
.wp-btn:hover{border-color:var(--purple)}
.wp-btn.on{background:var(--purple);color:#fff;border-color:var(--purple)}

/* ---- parts panel — slot chips, style chips, thumb grid, AI row ---- */
.parts-panel{padding:6px 10px 10px;font:12px/1.4 'DM Sans',sans-serif}
.part-slots,.part-styles{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:6px}
.part-styles{margin-bottom:8px}
.arch-chip.sm{font-size:9.5px;padding:2px 7px}
.part-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:8px}
.part-thumb{display:flex;flex-direction:column;align-items:center;gap:2px;
  border:1px solid var(--line);background:var(--chrome-2);color:var(--ink);
  border-radius:9px;padding:5px 3px 4px;font:10px/1.2 'DM Sans',sans-serif;cursor:pointer}
.part-thumb:hover{border-color:var(--purple)}
.part-thumb.on{border-color:#7ee0c3;background:#7ee0c318}
.part-thumb.orig{border-color:#f2b84b;background:#f2b84b14}
.part-thumb.orig span{color:#f2b84b}
.part-thumb.gal span{color:var(--ink-dim,#8f88c0)}
.part-thumb svg{width:40px;height:40px;display:block}
.part-thumb span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.part-ai{display:flex;gap:5px;padding-top:8px;border-top:1px dashed var(--line)}
.part-ai input{flex:1;min-width:60px;border:1px solid var(--line);background:var(--chrome-2);
  color:var(--ink);border-radius:7px;padding:4px 8px;font:11.5px/1.4 'DM Sans',sans-serif}
/* #partPop — canvas right-click picker, same grid in a floating card */
#partPop{position:fixed;z-index:70;width:250px;max-height:280px;overflow:auto;
  background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:8px;
  box-shadow:0 14px 40px #000a}
#partPop[hidden]{display:none}
#partPop .part-grid{margin-bottom:0}

/* ---- macro composer ---- */
.macro-panel{padding:6px 10px 10px;font:12px/1.4 'DM Sans',sans-serif}
.macro-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}
.mchip{border:1px solid var(--line);background:var(--chrome-2);color:var(--ink);
  border-radius:999px;padding:3px 10px;font:11.5px/1.4 'DM Sans',sans-serif;cursor:pointer}
.mchip.sel{background:var(--purple);color:#fff;border-color:var(--purple)}
.macro-form{display:flex;gap:5px;margin-bottom:8px}
.macro-form input{flex:1;min-width:60px;border:1px solid var(--line);background:var(--chrome-2);
  color:var(--ink);border-radius:7px;padding:4px 8px;font:11.5px/1.4 'DM Sans',sans-serif}
.macro-form select{border:1px solid var(--line);background:var(--chrome-2);color:var(--ink);
  border-radius:7px;padding:4px 6px;font:11px/1.4 'DM Sans',sans-serif}
.macro-go{border:1px solid var(--purple);background:var(--purple);color:#fff;
  border-radius:7px;padding:4px 10px;font:12px/1.4 'DM Sans',sans-serif;cursor:pointer;white-space:nowrap}
.macro-go:disabled{opacity:.4;cursor:default}
.macro-row{display:flex;align-items:center;gap:6px;padding:3px 5px;border-radius:6px;
  cursor:pointer;border:1px solid transparent}
.macro-row:hover{background:var(--bg-2);border-color:var(--line)}
.macro-row .macro-name{color:#7ee0c3;font-weight:600}
.macro-row .macro-steps{color:var(--muted);font-size:10.5px;font-family:'DM Mono',monospace;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---- world stage ---- */
.artboard-stage{position:relative} /* anchor #worldStage over the artboard */
#worldStage{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;
  background:radial-gradient(ellipse at 50% 30%,#262145 0%,#171430 70%);
  border-radius:14px;overflow:hidden}
#worldStage[hidden]{display:none}
#worldBar{display:flex;align-items:center;gap:10px;padding:10px 14px;
  border-bottom:1px solid #ffffff14;background:#00000033}
#worldBar .wb-title{color:var(--ink);font:600 13px/1 'DM Sans',sans-serif;white-space:nowrap}
#worldBar .wb-empty{color:#8f88c0;font:11px/1 'DM Sans',sans-serif}
#worldChips{display:flex;gap:6px;flex:0 1 auto;flex-wrap:wrap}
.wchip{border:1px solid #ffffff22;background:#ffffff10;color:#e8e6ff;border-radius:999px;
  padding:4px 12px;font:11.5px/1 'DM Sans',sans-serif;cursor:pointer}
.wchip.prop{border-style:dashed}
.wchip.sel{background:var(--purple);border-color:var(--purple);color:#fff}
.wb-hint{color:#8f88c0;font:10.5px/1 'DM Sans',sans-serif;align-self:center;white-space:nowrap}
#worldImport,#worldBack{border:1px solid #ffffff22;background:#ffffff10;color:#e8e6ff;
  border-radius:8px;padding:5px 10px;font:12px/1 'DM Sans',sans-serif;cursor:pointer;white-space:nowrap}
#worldImport:hover,#worldBack:hover{border-color:var(--purple)}
#worldCmd{flex:1;min-width:100px;border:1px solid #ffffff22;background:#00000044;color:#fff;
  border-radius:8px;padding:6px 10px;font:12px/1.2 'DM Sans',sans-serif}
#worldCmd::placeholder{color:#8f88c0}

#worldFloor{flex:1;position:relative;overflow:hidden;
  background:
    radial-gradient(110% 70% at 50% -8%,#3a2f6b3d,transparent 55%),
    linear-gradient(#0000 61.7%,#7c5cff2e 62%,#0000 62.3%),
    linear-gradient(#0000 62%,#0e0c1a80 100%)}
#worldFloor.droppable{outline:2px dashed var(--purple);outline-offset:-6px}
#worldCast,#worldAuto,#worldConsoleBtn{border:1px solid #ffffff22;background:#ffffff10;color:#e8e6ff;
  border-radius:8px;padding:5px 10px;font:12px/1 'DM Sans',sans-serif;cursor:pointer;white-space:nowrap}
#worldCast:hover,#worldAuto:hover,#worldConsoleBtn:hover{border-color:var(--purple)}
#worldAuto.on{background:var(--purple);border-color:var(--purple);color:#fff}
#worldAuto.busy{animation:mf-autopulse 1.1s ease-in-out infinite}
@keyframes mf-autopulse{0%,100%{box-shadow:0 0 0 0 #7c5cff00}50%{box-shadow:0 0 0 5px #7c5cff44}}

/* ---- cast tray — bundled characters/props + recents, drag onto the floor ---- */
#worldTray{position:absolute;left:10px;top:62px;bottom:12px;width:78px;z-index:45;
  display:flex;flex-direction:column;gap:2px;overflow-y:auto;padding:8px 6px;
  background:#14121fd9;border:1px solid #ffffff1a;border-radius:12px;backdrop-filter:blur(6px)}
#worldTray[hidden]{display:none}
.wt-sect{font:600 8.5px/1 'DM Sans',sans-serif;color:#8f88c0;letter-spacing:.08em;
  text-transform:uppercase;margin:7px 0 4px;text-align:center}
.wt-list{display:flex;flex-direction:column;gap:6px;align-items:center}
.wt-list .wb-empty{font-size:9.5px}
.wtray-tile{width:56px;height:46px;border:1px solid #ffffff22;border-radius:9px;
  background:#ffffff0a;cursor:grab;display:flex;align-items:center;justify-content:center;
  overflow:hidden;transition:border-color .15s,transform .15s}
.wtray-tile:hover{border-color:var(--purple);transform:translateY(-1px)}
.wtray-tile img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.wtray-tile .wtr-thumb{width:100%;height:100%;display:flex;align-items:center;justify-content:center;pointer-events:none}
.wtr-thumb svg{width:100%;height:100%}
.wtray-tile.txt{flex-direction:column;gap:1px;color:#e8e6ff;font-size:16px}
.wtray-tile.txt em{font:9px/1 'DM Sans',sans-serif;color:#8f88c0;font-style:normal}

/* ---- console drawer — director log, links, events, world state ---- */
#worldConsole{flex:0 0 auto;height:176px;display:flex;flex-direction:column;
  border-top:1px solid #ffffff1a;background:#100e1ae8;backdrop-filter:blur(8px)}
#worldConsole[hidden]{display:none}
.wc-tabs{display:flex;gap:2px;padding:6px 10px 0;align-items:center}
.wc-tab{border:none;background:none;color:#8f88c0;font:600 11px/1 'DM Sans',sans-serif;
  padding:5px 9px;border-radius:7px 7px 0 0;cursor:pointer}
.wc-tab:hover{color:#e8e6ff}
.wc-tab.on{color:#fff;background:#ffffff12}
.wc-gap{flex:1}
.wc-panes{flex:1;min-height:0;display:flex}
.wc-pane{flex:1;overflow-y:auto;padding:6px 12px;display:none;font:11px/1.5 'DM Sans',sans-serif;color:#c9c4ee}
.wc-pane.on{display:block}
.wc-pane .link-form{margin-bottom:4px}
.wc-pane .link-form select{max-width:120px;background:#ffffff10;border-color:#ffffff22;color:#e8e6ff}
#wcJson{margin:0;font:9.5px/1.4 'DM Mono',monospace;color:#8f88c0;white-space:pre-wrap}

/* ---- thoughts + thinking + spawn ---- */
.wthought{position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%);
  max-width:230px;background:#1e1a33f2;border:1px dashed #7c5cff99;color:#d8d4f5;
  border-radius:12px 12px 12px 3px;padding:5px 9px;font:italic 10.5px/1.35 'DM Sans',sans-serif;
  pointer-events:none;z-index:6;white-space:normal;transition:opacity .4s,transform .4s}
.wthought.out{opacity:0;transform:translateX(-50%) translateY(-6px)}
.wthought.narrator{left:50%;top:52px;bottom:auto}
.wthinking{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);
  color:#b8b0ee;font:700 15px/1 'DM Sans',sans-serif;letter-spacing:2px;
  pointer-events:none;z-index:6;animation:mf-think 1s ease-in-out infinite}
.wthinking.narrator{top:52px;bottom:auto}
@keyframes mf-think{0%,100%{opacity:.3}50%{opacity:1}}
.went.spawning{animation:mf-spawn .26s ease}
@keyframes mf-spawn{from{opacity:0;scale:.55}to{opacity:1;scale:1}}
.went-shadow{position:absolute;left:12%;right:12%;bottom:-2px;height:9px;border-radius:50%;
  background:radial-gradient(ellipse at center,#0000005e,transparent 68%);pointer-events:none}
.went{position:absolute;transform:translateY(-6%);cursor:grab;user-select:none;touch-action:none;
  transition:left var(--walk-ms,.6s) cubic-bezier(.45,.05,.5,.95),top var(--walk-ms,.6s) cubic-bezier(.45,.05,.5,.95)}
/* manual drag — the walk-glide transition must die or the entity lags the pointer */
.went.dragging{transition:none!important;cursor:grabbing;z-index:6}
.went.dragging .went-stage{animation:none}
/* floating controls — ⋯ menu / ✕ remove, revealed on hover or selection */
.went-ctl{position:absolute;top:-9px;right:-6px;display:flex;gap:3px;z-index:3;
  opacity:0;transition:opacity .15s;pointer-events:none}
.went:hover .went-ctl,.went.sel .went-ctl,.went.dragging .went-ctl{opacity:1;pointer-events:auto}
.went-ctl-b{width:18px;height:18px;padding:0;display:grid;place-items:center;border-radius:6px;
  border:1px solid #ffffff38;background:#1c1930e8;color:#d8d4f5;font:11px/1 'DM Sans',sans-serif;cursor:pointer}
.went-ctl-b:hover{border-color:var(--purple);color:#fff}
.went-ctl-b[data-ctl="rm"]:hover{border-color:#ff9bb0;color:#ff9bb0}
/* walking gait — bob + alternating rock while .moving; reads as steps even
   for entities with no loco action */
.went.moving .went-stage{animation:mf-wgait .34s ease-in-out infinite}
@keyframes mf-wgait{
  0%,100%{transform:scaleX(var(--face,1)) rotate(calc(var(--spin,0deg) - 1.4deg)) translateY(0)}
  50%{transform:scaleX(var(--face,1)) rotate(calc(var(--spin,0deg) + 1.4deg)) translateY(-4%)}
}
.went-stage svg{display:block;width:100%;height:auto}
.went .went-stage{transform:scaleX(var(--face,1)) rotate(var(--spin,0deg));transition:transform .18s ease}
.went .wsay{position:absolute;left:50%;bottom:calc(100% + 2px);transform:translateX(-50%);
  background:#fdfcff;color:#221f3a;font:12px/1.35 'DM Sans',system-ui,sans-serif;
  padding:5px 9px;border-radius:9px 9px 9px 2px;max-width:180px;white-space:normal;
  box-shadow:0 4px 14px #00000055;pointer-events:none;opacity:1;transition:opacity .4s,transform .4s}
.went .wsay.out{opacity:0;transform:translateX(-50%) translateY(-6px)}
.wuser{position:absolute;transform:translate(-50%,-50%);color:#ffd76a;font-size:15px;
  text-shadow:0 0 8px #ffd76a88;pointer-events:none;animation:wpulse 2.4s ease-in-out infinite}
@keyframes wpulse{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}}
.went.sel .went-stage{outline:1.5px dashed var(--purple);outline-offset:4px;border-radius:10px}
.went.prop .went-stage{filter:saturate(.92)}
.went.consuming{animation:consume .38s ease forwards}
@keyframes consume{to{transform:translateY(-6%) scale(.1);opacity:0}}
.went-label{display:inline-block;background:#00000066;color:#e8e6ff;border:1px solid #ffffff22;
  border-radius:7px;padding:3px 9px;font:11px/1 'DM Sans',sans-serif;margin-bottom:2px;
  cursor:grab;touch-action:none}
.went-label:active{cursor:grabbing}
.went-actions{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;opacity:0;transition:opacity .15s}
.went:hover .went-actions,.went.sel .went-actions{opacity:1}
.went-actions button{border:1px solid #ffffff22;background:#1c1930dd;color:#d8d4f5;
  border-radius:6px;padding:2px 8px;font:10.5px/1.4 'DM Sans',sans-serif;cursor:pointer}
.went-actions button:hover{border-color:var(--purple);color:#fff}
.went-actions button.mac{border-color:#7ee0c344;color:#7ee0c3}

/* ---- world panel (sidebar) ---- */
.world-panel{padding:6px 10px 10px;font:12px/1.5 'DM Sans',sans-serif;color:var(--ink)}
.went-row{display:flex;align-items:center;gap:7px;padding:3px 5px;border-radius:6px;cursor:pointer}
.went-row:hover{background:var(--bg-2)}
.went-row.sel{background:var(--bg-2);outline:1px solid var(--purple)}
.went-kind{color:#f2b84b;font-size:10px}
.went-row .went-name{flex:1}
.went-state{color:var(--muted);font:10.5px 'DM Mono',monospace}
.went-menu{border:none;background:none;color:var(--muted);cursor:pointer;
  font-size:13px;padding:0 4px;line-height:1;opacity:.6}
.went-menu:hover{opacity:1;color:var(--ink)}
.wp-sect{margin:10px 0 5px;font:600 10.5px/1 'DM Sans',sans-serif;color:var(--muted);
  letter-spacing:.06em;text-transform:uppercase;border-top:1px solid var(--line);padding-top:9px}
.link-form{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-bottom:6px}
.link-form.off{opacity:.35;pointer-events:none}
.link-form select{max-width:96px;border:1px solid var(--line);background:var(--chrome-2);
  color:var(--ink);border-radius:6px;padding:3px 5px;font:10.5px/1.4 'DM Sans',sans-serif}
.link-row{display:flex;align-items:center;gap:4px;font-size:11px;padding:2px 0}
.link-row em{color:var(--muted);font-style:normal;font-size:10px}
.link-x{margin-left:auto;border:none;background:none;color:var(--muted);cursor:pointer;font-size:10px}
.link-x:hover{color:#ff9bb0}
.ev-row{font-size:10.5px;color:var(--muted);padding:1px 0}
.ev-row .ev-type{color:#7ee0c3;font-family:'DM Mono',monospace;font-size:9.5px}
.dir-row{font-size:10.5px;padding:2px 0;color:var(--ink)}
.dir-row em{display:block;color:var(--muted);font-style:italic}
.dir-call{display:inline-block;background:var(--bg-2);border-radius:4px;padding:1px 5px;
  margin:1px 2px 1px 0;font-family:'DM Mono',monospace;font-size:9.5px;color:#7ee0c3}
.wp-state{margin:4px 0}
.wp-state summary{font-size:10.5px;color:var(--muted);cursor:pointer}
.wp-state pre{max-height:160px;overflow:auto;font:9.5px/1.4 'DM Mono',monospace;
  color:#8f88c0;background:var(--bg-2);border-radius:6px;padding:6px;margin-top:4px}

/* ---- menus (reuses .tl-menu from the key menu) ---- */
.tl-menu-head{padding:6px 10px 4px;font:600 10px/1 'DM Sans',sans-serif;color:var(--muted);
  letter-spacing:.06em;text-transform:uppercase}

/* empty-floor guidance — centered, non-interactive except its action chips */
#worldFloor>.es-row{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);
  max-width:340px;text-align:center;align-items:center;color:#b9b4d8;pointer-events:none}
#worldFloor>.es-row .es-chips{justify-content:center}
#worldFloor>.es-row .es-chips button{pointer-events:auto}
