pythonfmu3 1.0.0__tar.gz → 1.1.0__tar.gz

{pythonfmu3-1.0.0 → pythonfmu3-1.1.0}/MANIFEST.in

@@ -7,5 +7,8 @@ recursive-include pythonfmu3/tests/slaves *
 recursive-include pythonfmu3/resources *
 recursive-include pythonfmu3/pythonfmu-export *
 
+recursive-include pythonfmu3/studio/static *
+recursive-include pythonfmu3/studio/templates *.py
+
 prune pythonfmu3/pythonfmu-export/build
 global-exclude __pycache__ *.py[cod]

{pythonfmu3-1.0.0/pythonfmu3.egg-info → pythonfmu3-1.1.0}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: pythonfmu3
-Version: 1.0.0
+Version: 1.1.0
 Summary: A lightweight framework that enables the packaging of Python 3 code as FMI 3.0 co-simulation and model exchange FMUs.
 Author: Stephen Smith
 License-Expression: MIT
@@ -74,6 +74,14 @@ On Windows, `python3.dll` must be on the `PATH`. See
 [Running FMUs outside Python](docs/install.md#running-fmus-outside-python-linux-and-macos)
 for the full lookup order.
 
+### PythonFMU3 Studio
+
+`pythonfmu3 studio` opens a local web app to write, check, simulate, build and inspect
+FMUs, with live plots, a model-description preview, an FMU inspector and templates. It
+needs no extra dependencies. See the [Studio docs](docs/studio.md).
+
+![PythonFMU3 Studio](docs/assets/studio-simulate.png)
+
 ### How do I build an FMU from python code?
 
 1. Install `pythonfmu3` package:

{pythonfmu3-1.0.0 → pythonfmu3-1.1.0}/README.md

@@ -39,6 +39,14 @@ On Windows, `python3.dll` must be on the `PATH`. See
 [Running FMUs outside Python](docs/install.md#running-fmus-outside-python-linux-and-macos)
 for the full lookup order.
 
+### PythonFMU3 Studio
+
+`pythonfmu3 studio` opens a local web app to write, check, simulate, build and inspect
+FMUs, with live plots, a model-description preview, an FMU inspector and templates. It
+needs no extra dependencies. See the [Studio docs](docs/studio.md).
+
+![PythonFMU3 Studio](docs/assets/studio-simulate.png)
+
 ### How do I build an FMU from python code?
 
 1. Install `pythonfmu3` package:

{pythonfmu3-1.0.0 → pythonfmu3-1.1.0}/pyproject.toml

@@ -58,6 +58,8 @@ pythonfmu3 = [
     "pythonfmu-export/**/*",
     "tests/data/*",
     "tests/slaves/*",
+    "studio/static/*",
+    "studio/templates/*.py",
 ]
 
 [tool.setuptools.exclude-package-data]

{pythonfmu3-1.0.0 → pythonfmu3-1.1.0}/pythonfmu3/__main__.py

@@ -43,6 +43,14 @@ def cli_main():
     )
     deploy.create_command_parser(deploy_parser)
 
+    studio_parser = subparsers.add_parser(
+        "studio",
+        description="Open PythonFMU3 Studio, a local web app to edit, check, simulate, build and inspect FMUs.",
+        help="Open the PythonFMU3 Studio web app."
+    )
+    from .studio.server import create_command_parser as create_studio_parser
+    create_studio_parser(studio_parser)
+
     options = vars(parser.parse_args())
     execute = options.pop("execute")
     execute(**options)

pythonfmu3-1.1.0/pythonfmu3/_version.py

@@ -0,0 +1 @@
+__version__ = "1.1.0"

pythonfmu3-1.1.0/pythonfmu3/studio/__init__.py

@@ -0,0 +1 @@
+"""PythonFMU3 Studio: a local web app for building and checking FMUs (``pythonfmu3 studio``)."""

pythonfmu3-1.1.0/pythonfmu3/studio/server.py

@@ -0,0 +1,358 @@
+"""PythonFMU3 Studio: a local web app to edit, check, simulate, build and inspect FMUs.
+
+Start it with ``pythonfmu3 studio [folder]``. It uses only the standard library: a
+threaded HTTP server on 127.0.0.1 serving the static app and a small JSON API. Model
+code runs in a separate worker process per request (see worker.py).
+
+Security: the server only listens on the loopback interface, only answers requests
+whose Host header is the loopback address, and requires a random token (generated per
+run and passed to the browser in the URL) on every API call, so other web pages open in
+the browser can't drive it.
+"""
+import argparse
+import json
+import mimetypes
+import os
+import re
+import secrets
+import shutil
+import subprocess
+import sys
+import tempfile
+import threading
+import webbrowser
+from http import HTTPStatus
+from http.server import BaseHTTPRequestHandler, ThreadingHTTPServer
+from pathlib import Path
+from typing import Any, Dict, Optional
+from urllib.parse import parse_qs, quote, urlparse
+
+from .._version import __version__
+
+HERE = Path(__file__).parent
+STATIC = HERE / "static"
+TEMPLATES = HERE / "templates"
+WORKER_TIMEOUT = 300
+MAX_UPLOAD = 200 * 1024 * 1024
+TEMPLATE_INFO = {
+    "pid_controller": ("PID controller", "Co-Simulation", "control",
+                       "Setpoint and measurement in, actuator command out, with tunable gains and output limits.",
+                       ["inputs", "tunable parameters"]),
+    "bouncing_ball": ("Bouncing ball", "Model Exchange", "me",
+                      "Free fall with a state event at each impact and a restitution coefficient.",
+                      ["events", "units"]),
+    "van_der_pol": ("Van der Pol", "Model Exchange", "me",
+                    "A nonlinear oscillator with two continuous states, for testing solvers.",
+                    ["continuous states"]),
+    "dahlquist": ("Dahlquist", "Model Exchange + Co-Simulation", "me cs",
+                  "dx/dt = -k·x in both interfaces: the smallest model, with an exact solution.",
+                  ["both interfaces"]),
+    "thermostat": ("Thermostat", "Co-Simulation", "control",
+                   "A heated room with on/off control and hysteresis: Boolean output and a discrete state.",
+                   ["Boolean", "discrete"]),
+    "surrogate": ("Polynomial surrogate", "Co-Simulation", "ml",
+                  "A fitted NumPy polynomial exposed as an FMU: the pattern for ML surrogate models.",
+                  ["numpy", "data-driven"]),
+    "signal_generator": ("Signal generator", "Co-Simulation", "cs",
+                         "Sine, square and ramp signals selected by an Int32 mode: a test-bench source.",
+                         ["Int32 mode", "outputs"]),
+}
+
+
+class StudioState:
+    def __init__(self, workspace: Path):
+        self.workspace = workspace.resolve()
+        self.token = secrets.token_urlsafe(24)
+        self.uploads = Path(tempfile.mkdtemp(prefix="pythonfmu3_studio_"))
+        self.last_build: Dict[str, str] = {}
+
+    def resolve(self, relative: str, must_exist: bool = True) -> Path:
+        """Resolve a workspace-relative path, refusing anything outside the workspace."""
+        if not relative or "\x00" in relative:
+            raise ValueError("empty path")
+        path = (self.workspace / relative).resolve()
+        if path != self.workspace and self.workspace not in path.parents:
+            raise PermissionError(f"{relative} is outside the workspace")
+        if must_exist and not path.exists():
+            raise FileNotFoundError(relative)
+        return path
+
+    def rel(self, path: Path) -> str:
+        return path.resolve().relative_to(self.workspace).as_posix()
+
+
+def run_worker(request: Dict[str, Any], cwd: Path) -> Dict[str, Any]:
+    env = dict(os.environ)
+    package_root = str(HERE.parent.parent)
+    env["PYTHONPATH"] = package_root + os.pathsep + env.get("PYTHONPATH", "")
+    try:
+        proc = subprocess.run(
+            [sys.executable, "-m", "pythonfmu3.studio.worker"], input=json.dumps(request),
+            capture_output=True, text=True, timeout=WORKER_TIMEOUT, cwd=str(cwd), env=env,
+        )
+    except subprocess.TimeoutExpired:
+        return {"ok": False, "error": f"Timed out after {WORKER_TIMEOUT} s"}
+    try:
+        return json.loads(proc.stdout)
+    except json.JSONDecodeError:
+        return {"ok": False, "error": "The worker process failed", "traceback": (proc.stdout + proc.stderr)[-8000:]}
+
+
+def environment() -> Dict[str, Any]:
+    from .worker import find_fmusim
+
+    def has(module):
+        import importlib.util
+        return importlib.util.find_spec(module) is not None
+
+    return {
+        "version": __version__,
+        "python": sys.version.split()[0],
+        "fmusim": find_fmusim(),
+        "fmpy": has("fmpy"),
+        "numpy": has("numpy"),
+    }
+
+
+class Handler(BaseHTTPRequestHandler):
+    server_version = f"PythonFMU3Studio/{__version__}"
+    state: StudioState  # set on the class by serve()
+
+    # -- plumbing ---------------------------------------------------------------------------
+
+    def log_message(self, fmt, *args):  # keep the terminal quiet
+        if os.environ.get("PYTHONFMU3_STUDIO_DEBUG"):
+            super().log_message(fmt, *args)
+
+    def _send(self, status: int, body: bytes, content_type: str, extra: Optional[Dict[str, str]] = None):
+        self.send_response(status)
+        self.send_header("Content-Type", content_type)
+        self.send_header("Content-Length", str(len(body)))
+        self.send_header("Cache-Control", "no-store")
+        self.send_header("X-Content-Type-Options", "nosniff")
+        self.send_header("Referrer-Policy", "no-referrer")
+        for k, v in (extra or {}).items():
+            self.send_header(k, v)
+        self.end_headers()
+        self.wfile.write(body)
+
+    def _json(self, payload: Any, status: int = 200):
+        self._send(status, json.dumps(payload, default=str).encode("utf-8"), "application/json; charset=utf-8")
+
+    def _error(self, status: int, message: str, detail: str = ""):
+        self._json({"ok": False, "error": message, "traceback": detail}, status)
+
+    def _host_ok(self) -> bool:
+        host = (self.headers.get("Host") or "").rsplit(":", 1)[0].strip("[]")
+        return host in ("127.0.0.1", "localhost", "::1")
+
+    def _token_ok(self, query: Dict[str, list]) -> bool:
+        supplied = self.headers.get("X-Studio-Token") or (query.get("token") or [""])[0]
+        return secrets.compare_digest(supplied, self.state.token)
+
+    def _body(self) -> bytes:
+        length = int(self.headers.get("Content-Length") or 0)
+        if length > MAX_UPLOAD:
+            raise ValueError("Upload too large")
+        return self.rfile.read(length) if length else b""
+
+    def _json_body(self) -> Dict[str, Any]:
+        data = self._body()
+        return json.loads(data or b"{}")
+
+    # -- routing ----------------------------------------------------------------------------
+
+    def do_GET(self):
+        self._dispatch("GET")
+
+    def do_POST(self):
+        self._dispatch("POST")
+
+    def _dispatch(self, method: str):
+        if not self._host_ok():
+            return self._error(HTTPStatus.FORBIDDEN, "Invalid Host header")
+        url = urlparse(self.path)
+        query = parse_qs(url.query)
+        if method == "GET" and not url.path.startswith("/api/"):
+            return self._static(url.path)
+        if not self._token_ok(query):
+            return self._error(HTTPStatus.FORBIDDEN, "Missing or invalid token")
+        route = getattr(self, f"api_{method.lower()}_{url.path[5:].replace('/', '_')}", None)
+        if route is None:
+            return self._error(HTTPStatus.NOT_FOUND, f"No such endpoint: {url.path}")
+        try:
+            route(query)
+        except (FileNotFoundError, PermissionError, ValueError, KeyError) as exc:
+            self._error(HTTPStatus.BAD_REQUEST, f"{type(exc).__name__}: {exc}")
+        except Exception as exc:  # pragma: no cover - unexpected
+            import traceback
+            self._error(HTTPStatus.INTERNAL_SERVER_ERROR, f"{type(exc).__name__}: {exc}", traceback.format_exc())
+
+    def _static(self, path: str):
+        name = "index.html" if path in ("", "/") else path.lstrip("/")
+        target = (STATIC / name).resolve()
+        if STATIC.resolve() not in target.parents or not target.is_file():
+            return self._error(HTTPStatus.NOT_FOUND, "Not found")
+        ctype = mimetypes.guess_type(str(target))[0] or "application/octet-stream"
+        if ctype.startswith("text/") or ctype in ("application/javascript",):
+            ctype += "; charset=utf-8"
+        csp = ("default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data: blob:; "
+               "connect-src 'self'; frame-ancestors 'none'; base-uri 'none'; form-action 'none'")
+        self._send(200, target.read_bytes(), ctype, {"Content-Security-Policy": csp})
+
+    # -- API: environment and files ---------------------------------------------------------
+
+    def api_get_env(self, query):
+        info = environment()
+        info["workspace"] = str(self.state.workspace)
+        self._json({"ok": True, "result": info})
+
+    def api_get_files(self, query):
+        files = []
+        skip = {".git", "__pycache__", ".venv", "venv", "node_modules"}
+        for path in sorted(self.state.workspace.rglob("*")):
+            rel = path.relative_to(self.state.workspace)
+            if any(part in skip or part.startswith(".") for part in rel.parts[:-1]):
+                continue
+            if path.is_file() and path.suffix in (".py", ".fmu"):
+                files.append({"path": rel.as_posix(), "kind": path.suffix[1:], "size": path.stat().st_size})
+            if len(files) >= 500:
+                break
+        self._json({"ok": True, "result": files})
+
+    def api_get_file(self, query):
+        path = self.state.resolve(query["path"][0])
+        if path.suffix != ".py":
+            raise ValueError("Only .py files can be opened in the editor")
+        self._json({"ok": True, "result": {"path": self.state.rel(path), "content": path.read_text(encoding="utf-8")}})
+
+    def api_post_file(self, query):
+        body = self._json_body()
+        path = self.state.resolve(body["path"], must_exist=False)
+        if path.suffix != ".py":
+            raise ValueError("Only .py files can be saved")
+        path.parent.mkdir(parents=True, exist_ok=True)
+        path.write_text(body["content"], encoding="utf-8")
+        self._json({"ok": True, "result": {"path": self.state.rel(path)}})
+
+    # -- API: model operations (worker process) ---------------------------------------------
+
+    def _model_request(self, command: str, body: Dict[str, Any]):
+        path = self.state.resolve(body["path"])
+        request = dict(body, command=command, path=str(path))
+        return path, run_worker(request, path.parent)
+
+    def api_post_analyze(self, query):
+        _, response = self._model_request("analyze", self._json_body())
+        self._json(response)
+
+    def api_post_simulate(self, query):
+        _, response = self._model_request("simulate", self._json_body())
+        self._json(response)
+
+    def api_post_build(self, query):
+        body = self._json_body()
+        path = self.state.resolve(body["path"])
+        response = run_worker({"command": "build", "path": str(path),
+                               "dest": str(path.parent / "build")}, path.parent)
+        if response.get("ok"):
+            fmu = Path(response["result"]["fmu"])
+            response["result"]["fmu"] = self.state.rel(fmu)
+            self.state.last_build[self.state.rel(path)] = self.state.rel(fmu)
+        self._json(response)
+
+    def api_post_validate(self, query):
+        body = self._json_body()
+        fmu = self.state.resolve(body["fmu"])
+        self._json(run_worker({"command": "validate", "fmu": str(fmu)}, self.state.workspace))
+
+    def api_get_download(self, query):
+        path = self.state.resolve(query["path"][0])
+        if path.suffix != ".fmu":
+            raise ValueError("Only FMUs can be downloaded")
+        self._send(200, path.read_bytes(), "application/octet-stream",
+                   {"Content-Disposition": f"attachment; filename*=UTF-8''{quote(path.name)}"})
+
+    def api_post_inspect(self, query):
+        if (self.headers.get("Content-Type") or "").startswith("application/json"):
+            body = self._json_body()
+            fmu = self.state.resolve(body["path"])
+            name = fmu.name
+        else:
+            name = re.sub(r"[^A-Za-z0-9._-]", "_", (query.get("name") or ["upload.fmu"])[0]) or "upload.fmu"
+            fmu = self.state.uploads / secrets.token_hex(8) / name
+            fmu.parent.mkdir(parents=True)
+            fmu.write_bytes(self._body())
+        response = run_worker({"command": "inspect", "path": str(fmu), "name": name}, self.state.workspace)
+        if response.get("ok") and environment()["fmusim"]:
+            response["result"]["validation"] = run_worker({"command": "validate", "fmu": str(fmu)},
+                                                          self.state.workspace).get("result")
+        self._json(response)
+
+    # -- API: templates -----------------------------------------------------------------------
+
+    def api_get_templates(self, query):
+        items = []
+        for key, (title, iface, cats, desc, tags) in TEMPLATE_INFO.items():
+            if (TEMPLATES / f"{key}.py").exists():
+                items.append({"id": key, "title": title, "interface": iface, "categories": cats.split(),
+                              "description": desc, "tags": tags})
+        self._json({"ok": True, "result": items})
+
+    def api_post_templates_use(self, query):
+        body = self._json_body()
+        key = body["id"]
+        if key not in TEMPLATE_INFO:
+            raise KeyError(key)
+        target = self.state.resolve(body.get("name") or f"{key}.py", must_exist=False)
+        if target.suffix != ".py":
+            raise ValueError("The file name must end in .py")
+        if target.exists():
+            raise ValueError(f"{self.state.rel(target)} already exists")
+        target.parent.mkdir(parents=True, exist_ok=True)
+        shutil.copyfile(TEMPLATES / f"{key}.py", target)
+        self._json({"ok": True, "result": {"path": self.state.rel(target)}})
+
+
+def serve(workspace: Path, port: int = 0, open_browser: bool = True) -> ThreadingHTTPServer:
+    state = StudioState(workspace)
+    handler = type("StudioHandler", (Handler,), {"state": state})
+    httpd = ThreadingHTTPServer(("127.0.0.1", port), handler)
+    httpd.studio_state = state
+    url = f"http://127.0.0.1:{httpd.server_address[1]}/?token={state.token}"
+    httpd.studio_url = url
+    if open_browser:
+        threading.Timer(0.3, lambda: webbrowser.open(url)).start()
+    return httpd
+
+
+def main(folder: str = ".", port: int = 0, no_browser: bool = False, **_):
+    workspace = Path(folder).resolve()
+    if not workspace.is_dir():
+        raise SystemExit(f"{workspace} is not a folder")
+    httpd = serve(workspace, port, open_browser=not no_browser)
+    print(f"PythonFMU3 Studio {__version__}")
+    print(f"  workspace: {workspace}")
+    print(f"  open:      {httpd.studio_url}")
+    print("  (Ctrl+C to stop)")
+    try:
+        httpd.serve_forever()
+    except KeyboardInterrupt:
+        pass
+    finally:
+        httpd.server_close()
+        shutil.rmtree(httpd.studio_state.uploads, ignore_errors=True)
+
+
+def create_command_parser(parser: argparse.ArgumentParser):
+    parser.add_argument("folder", nargs="?", default=".", help="Workspace folder with your model scripts (default: current folder).")
+    parser.add_argument("-p", "--port", type=int, default=0, help="Port to listen on (default: a free port).")
+    parser.add_argument("--no-browser", action="store_true", help="Don't open a browser window.")
+    parser.set_defaults(execute=main)
+
+
+if __name__ == "__main__":
+    p = argparse.ArgumentParser(prog="pythonfmu3 studio")
+    create_command_parser(p)
+    args = vars(p.parse_args())
+    args.pop("execute")(**args)

pythonfmu3-1.1.0/pythonfmu3/studio/static/app.css

@@ -0,0 +1,179 @@
+:root {
+  --blue: #2F5D8A; --blue-dark: #1F4468; --blue-soft: #E8EEF5;
+  --gold: #E8B11C; --gold-soft: #FEF6DD; --gold-ink: #6B4E00;
+  --ink: #1F2933; --ink-2: #46515E; --muted: #5B6673;
+  --bg: #F4F6F9; --panel: #FFFFFF; --line: #E3E8EF; --line-2: #C9D2DE;
+  --ok-bg: #ECFDF3; --ok: #05603A; --warn-bg: #FEF0C7; --warn: #7A2E0E; --err-bg: #FEE4E2; --err: #912018;
+  --code-bg: #0F1720; --code-fg: #D6DEEB; --code-gutter: #6B7A8A;
+  --mono: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;
+  --sans: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+}
+* { box-sizing: border-box; }
+html, body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 14px; }
+body { min-height: 100vh; display: flex; flex-direction: column; }
+h1 { font-size: 26px; margin: 0 0 6px; }
+h2 { font-size: 16px; margin: 0; }
+h3 { font-size: 13px; margin: 14px 0 8px; color: var(--ink-2); }
+button, input, select, textarea { font: inherit; color: inherit; }
+a { color: var(--blue); }
+.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
+.muted { color: var(--muted); }
+.small { font-size: 12px; }
+.spacer, .grow { flex: 1 1 auto; }
+.push { margin-left: auto; }
+[hidden] { display: none !important; }
+
+/* top bar */
+.topbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; padding: 10px 20px; background: var(--panel); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 5; }
+.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 17px; }
+.accent { color: var(--blue); }
+.tabs { display: flex; flex-wrap: wrap; gap: 4px; }
+.tab { min-height: 38px; padding: 0 14px; border: none; border-radius: 8px; background: transparent; color: var(--ink-2); font-weight: 500; cursor: pointer; }
+.tab:hover { background: var(--bg); }
+.tab[aria-current="page"] { background: var(--blue-soft); color: var(--blue-dark); font-weight: 600; }
+.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
+.file-picker select, select, input[type=number], input[type=text], input[type=search] { min-height: 38px; padding: 0 10px; border: 1px solid var(--line-2); border-radius: 8px; background: #fff; }
+.file-picker select { font-family: var(--mono); font-size: 13px; max-width: 260px; }
+.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 0 14px; border-radius: 8px; border: 1px solid var(--line-2); background: #fff; color: var(--ink); font-weight: 600; cursor: pointer; text-decoration: none; }
+.btn:hover { border-color: var(--blue); }
+.btn.primary { background: var(--blue); border-color: var(--blue); color: #fff; }
+.btn.primary:hover { background: var(--blue-dark); }
+.btn.gold { background: var(--gold); border-color: var(--gold); color: var(--ink); }
+.btn:disabled { opacity: 0.55; cursor: progress; }
+.btn-row { display: flex; flex-wrap: wrap; gap: 8px; }
+:focus-visible { outline: 3px solid #7FB0DE; outline-offset: 2px; }
+
+.banner { margin: 14px 20px 0; padding: 10px 14px; border-radius: 8px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
+.banner.ok { background: #DCFAE6; color: var(--ok); }
+.banner.error { background: var(--err-bg); color: var(--err); }
+.banner.info { background: var(--blue-soft); color: var(--blue-dark); }
+.banner pre { flex-basis: 100%; margin: 0; white-space: pre-wrap; font-family: var(--mono); font-size: 12px; max-height: 240px; overflow: auto; }
+
+main { flex: 1 1 auto; padding: 16px 20px 20px; }
+.view { display: flex; flex-direction: column; gap: 16px; }
+.view.narrow { max-width: 1240px; margin: 0 auto; width: 100%; }
+.row { display: flex; flex-wrap: wrap; gap: 16px; align-items: stretch; }
+.row.top { align-items: flex-start; }
+.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; min-width: 0; }
+.panel-head { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line); }
+
+/* code editor */
+.code-panel { flex: 999 1 560px; display: flex; flex-direction: column; background: var(--code-bg); border-color: var(--code-bg); height: min(72vh, 760px); min-height: 420px; }
+.code-head { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid #22303D; color: #A9B4C2; font-size: 13px; font-family: var(--mono); }
+.code-head .muted { color: #8A99A8; font-family: var(--sans); }
+.dirty { color: var(--gold); font-family: var(--sans); font-weight: 600; }
+.code-body { position: relative; display: flex; flex: 1 1 auto; min-height: 0; }
+.gutter { margin: 0; padding: 14px 12px 14px 0; width: 48px; flex: none; text-align: right; color: var(--code-gutter); font: 13px/21px var(--mono); overflow: hidden; user-select: none; }
+#code { flex: 1 1 auto; min-width: 0; border: none; resize: none; margin: 0; padding: 14px 14px 14px 4px; background: transparent; color: var(--code-fg); font: 13px/21px var(--mono); tab-size: 4; outline: none; white-space: pre; overflow: auto; }
+
+/* preview */
+.preview { flex: 1 1 420px; display: flex; flex-direction: column; height: min(72vh, 760px); min-height: 420px; }
+.subtabs { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px; border-bottom: 1px solid var(--line); }
+.subtab { min-height: 38px; padding: 0 12px; border: none; border-radius: 8px; background: transparent; color: var(--ink-2); cursor: pointer; }
+.subtab[aria-selected="true"] { background: var(--blue-soft); color: var(--blue-dark); font-weight: 600; }
+.badge { margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 12px; background: #DCFAE6; color: var(--ok); }
+.badge.bad { background: var(--warn-bg); color: var(--warn); }
+.preview-body { flex: 1 1 auto; overflow: auto; padding: 16px; min-height: 0; }
+.xml { margin: 0; font: 12px/20px var(--mono); background: #FAFBFC; white-space: pre; }
+.checks { display: flex; flex-direction: column; gap: 10px; }
+.check-item { display: flex; gap: 10px; padding: 10px 12px; border-radius: 8px; }
+.check-item strong { width: 56px; flex: none; font-size: 12px; }
+.check-item .title { font-weight: 600; }
+.check-item.ok { background: var(--ok-bg); color: var(--ok); }
+.check-item.warning { background: var(--warn-bg); color: var(--warn); }
+.check-item.error { background: var(--err-bg); color: var(--err); }
+
+/* FMU block */
+.block-wrap { display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 12px 0; }
+.chips { display: flex; flex-wrap: wrap; gap: 6px; }
+.chip-param { padding: 5px 10px; border-radius: 999px; background: var(--gold-soft); color: var(--gold-ink); font-size: 13px; font-weight: 500; }
+.block-row { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 520px; }
+.ports { display: flex; flex-direction: column; gap: 12px; flex: 1 1 0; min-width: 0; }
+.ports.in { align-items: flex-end; }
+.ports.out { align-items: flex-start; }
+.port { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-2); }
+.port i { width: 20px; height: 12px; border-radius: 3px; background: var(--gold); flex: none; }
+.port span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }
+.block { width: 150px; min-height: 150px; flex: none; border-radius: 22px; background: var(--blue); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 12px; text-align: center; }
+.block b { font-size: 15px; word-break: break-word; }
+.block small { color: #D6E2EE; }
+
+/* tables */
+.table-wrap { overflow-x: auto; }
+.table { width: 100%; border-collapse: collapse; min-width: 760px; }
+.table th { text-align: left; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; padding: 10px 8px; }
+.table td { padding: 8px; border-top: 1px solid #EEF1F5; vertical-align: top; }
+.table th:first-child, .table td:first-child { padding-left: 16px; }
+.mono { font-family: var(--mono); font-size: 13px; }
+.pill { display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 6px; background: var(--blue-soft); color: var(--blue-dark); }
+.caus-input { background: var(--gold-soft); color: var(--gold-ink); }
+.caus-output { background: #E3F2EA; color: var(--ok); }
+.caus-structuralParameter { background: #EDE7F6; color: #4A2C83; }
+.caus-independent, .caus-local { background: #F2F4F7; color: var(--ink-2); }
+.flag { font-size: 12px; padding: 3px 8px; border-radius: 6px; }
+.flag.warning { background: var(--warn-bg); color: var(--warn); }
+.flag.error { background: var(--err-bg); color: var(--err); }
+.flag.ok { color: var(--ok); }
+
+/* simulate */
+.settings { flex: 1 1 320px; max-width: 100%; padding: 18px; display: flex; flex-direction: column; gap: 14px; overflow: visible; }
+fieldset { border: none; margin: 0; padding: 0; }
+legend { font-size: 13px; font-weight: 600; color: var(--ink-2); margin-bottom: 8px; }
+.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
+.grid2 select, .grid2 input[type=number] { width: 100%; }
+.grid2 label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; color: var(--ink-2); }
+.grid2 label.check { flex-direction: row; align-items: center; gap: 8px; font-weight: 500; }
+.chip-btn { min-height: 38px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; cursor: pointer; }
+.chip-btn[aria-pressed="true"] { background: var(--blue); border-color: var(--blue); color: #fff; font-weight: 600; }
+.chip-btn:disabled { opacity: 0.5; cursor: not-allowed; }
+.params { display: flex; flex-direction: column; gap: 12px; }
+.param { display: flex; flex-direction: column; gap: 4px; }
+.param-head { display: flex; align-items: center; gap: 8px; }
+.param-head .mono { font-weight: 600; }
+.param-head input { width: 110px; margin-left: auto; min-height: 32px; }
+.param input[type=range] { width: 100%; accent-color: var(--blue); }
+.results { flex: 999 1 600px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
+.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
+.stat { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; }
+.stat .k { font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; }
+.stat .v { font-size: 24px; font-weight: 700; margin-top: 4px; }
+.series-picker { display: flex; flex-wrap: wrap; gap: 6px; }
+.series-picker label { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 10px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; font-family: var(--mono); font-size: 12px; cursor: pointer; }
+.series-picker input { accent-color: var(--blue); }
+.charts { display: flex; flex-direction: column; gap: 14px; }
+.chart { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px 8px; }
+.chart figcaption { display: flex; gap: 10px; align-items: baseline; font-weight: 600; margin-bottom: 4px; }
+.chart figcaption .mono { font-weight: 400; color: var(--muted); }
+.chart svg { display: block; width: 100%; height: auto; }
+.chart .readout { margin-left: auto; font-family: var(--mono); font-size: 12px; color: var(--ink-2); font-weight: 400; }
+.empty { padding: 40px 16px; text-align: center; color: var(--muted); background: #fff; border: 1px dashed var(--line-2); border-radius: 12px; }
+.log summary { padding: 12px 16px; cursor: pointer; font-weight: 600; }
+.log pre { margin: 0; padding: 0 16px 16px; font: 12px/18px var(--mono); white-space: pre-wrap; max-height: 300px; overflow: auto; }
+
+/* inspector */
+.drop { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 16px 18px; border: 2px dashed #B8C3D0; border-radius: 12px; background: #fff; }
+.drop.over { border-color: var(--blue); background: var(--blue-soft); }
+.drop .grow { display: flex; flex-direction: column; gap: 2px; min-width: 220px; }
+.summary { display: flex; flex-direction: column; gap: 12px; padding: 18px; }
+.summary dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px 24px; }
+.summary dt { color: var(--muted); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
+.summary dd { margin: 2px 0 0; word-break: break-word; }
+.tag { padding: 4px 10px; border-radius: 999px; background: #F2F4F7; color: var(--ink-2); font-size: 13px; }
+.tag.strong { background: var(--blue-soft); color: var(--blue-dark); font-weight: 600; }
+
+/* templates */
+.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 8px 0; }
+.search { flex: 1 1 260px; }
+.search input { width: 100%; }
+.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
+.card { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 18px; }
+.card h2 { font-size: 16px; }
+.card p { margin: 0; color: var(--ink-2); flex: 1 1 auto; }
+
+.statusbar { display: flex; flex-wrap: wrap; gap: 12px; padding: 8px 20px; border-top: 1px solid var(--line); background: #fff; color: var(--muted); font-size: 12px; }
+
+@media (max-width: 640px) {
+  .topbar { padding: 10px 16px; }
+  main { padding: 12px 16px; }
+  .grid2 { grid-template-columns: minmax(0, 1fr); }
+}