/* public/assets/app.css */
:root { --bg:#0f172a; --panel:#111827; --muted:#94a3b8; --text:#e5e7eb; --accent:#22c55e; }
* { box-sizing: border-box; }
html, body { margin:0; padding:0; height:100%; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--text); background:#0b1220; }
.app-header { display:flex; align-items:center; justify-content:space-between; padding:12px 16px; background:var(--panel); border-bottom:1px solid #1f2937; }
.app-header h1 { margin:0; font-size:18px; }
.actions > * { margin-left:8px; }
button, select, input { background:#0b1220; color:var(--text); border:1px solid #334155; border-radius:6px; padding:6px 10px; }
button:hover { border-color:#475569; }
.layout { display:flex; min-height:calc(100vh - 96px); }
.sidebar { width:300px; padding:16px; background:var(--panel); border-right:1px solid #1f2937; overflow:auto; }
.sidebar section { margin-bottom:18px; }
.sidebar h3 { margin:10px 0; font-size:14px; color:#cbd5e1; }
.row { display:flex; gap:8px; }
.stage { flex:1; display:flex; align-items:center; justify-content:center; padding:16px; }
#canvasWrap { background:#fff; border:1px dashed #64748b; box-shadow: 0 0 0 4px #0b1220, inset 0 0 0 1px #cbd5e1; }
.app-footer { padding:10px 16px; background:var(--panel); border-top:1px solid #1f2937; color:var(--muted); font-size:12px; }
.toolbox button { margin:2px; }
.small { font-size:12px; color:#cbd5e1; word-break: break-all; }