added theming

CHANGELOG.de.md

@@ -1,78 +1,5 @@
 # Changelog
 
-## [0.9.13] – 2026-05-20
-
-### Fixes
-- **Self-Update war in 0.9.12 kaputt (wichtig):** Der In-App-Updater ersetzte
-  nur `kobrax_moonraker_bridge.py`, aber seit 0.9.12 importiert diese Datei das
-  ausgelagerte `_web_assets.py` (gebündeltes Frontend). Ein Update auf 0.9.12
-  crashte daher mit `ModuleNotFoundError: No module named '_web_assets'` und die
-  Bridge kam nicht wieder hoch. Der Updater lädt jetzt **alle** Bridge-Module
-  (Hauptdatei + `_web_assets.py` + Client + Loader) erst vollständig herunter
-  und ersetzt sie dann atomar — und verweigert das Self-Update im Binary-Modus
-  (stattdessen neue Binary/neues Docker-Image laden).
-
-> Falls du nach dem Update auf 0.9.12 hängengeblieben bist: einmalig das
-> Docker-Image neu bauen/deployen oder die 0.9.13-Binary holen, danach
-> funktioniert das Self-Update wieder.
-
-## [0.9.12] – 2026-05-20
-
-### Fixes
-- **Pause-Status** wird jetzt korrekt erkannt: Die Bridge las den Geräte-State
-  statt des verschachtelten Druckauftrags-States, dadurch wurde ein pausierter
-  Druck teils noch als „druckend" angezeigt. Layer/Fortschritt/Restzeit kommen
-  jetzt ebenfalls aus dem Auftrags-Report.
-
-### Intern
-- Frontend (HTML/CSS/JS) aus der Python-Datei nach `web/index.html` ausgelagert,
-  zur Build-Zeit wieder eingebettet — besser wartbar, für Nutzer keine Änderung.
-
-### Doku
-- Community-**Home-Assistant-Integration** von @gangoke verlinkt.
-
-## [0.9.11] – 2026-05-20
-
-### Neu
-- **ACE Pro 2 Support (experimentell, Community-Beitrag von @gangoke, PR #26):** Die Bridge erkennt jetzt die Filament-Hardware automatisch und passt sich an:
-  - **Modi:** `toolhead` (kein ACE, Standard-4-Slot-Box), `ace_direct` (ein ACE Pro 2 direkt am Toolhead), `ace_hub` (bis zu 4 ACE-Units am Slot-4-Hub) — insgesamt bis zu **19 Slots**.
-  - **AMS Auto-Refill** Umschalter.
-  - **Trockner:** Temperatur-/Luftfeuchte-Monitor, Start/Stop/Temp/Dauer-Steuerung, mit Material-Presets in einer neuen Config-Sektion `[ace_dry_presets]` (PLA, PLA+, PETG, TPU, ABS/ASA, PA/PC + 3 Custom).
-  - **UI:** Filament-Sektion skaliert auf 19 Slots, Modus-Label, geladener Slot grün umrandet mit Lade-/Entlade-Puls-Animation, Unload/Load direkt aus dem Slot-Edit-Dialog.
-  - **GCode-Farb-Mapping:** ACE2-fähig, Farbe-aus-GCode-Fix, Hinweis bei Inkonsistenz zwischen Mapping und Objekten, besseres Default-Mapping.
-
-> **⚠️ Experimentell:** Die ACE-Pro-2-Hardware-Pfade wurden vom Contributor mit einer einzelnen ACE2-Unit entwickelt und getestet; die 2–4-Unit-Hub-Konfigurationen sind theoretisch und auf echter Hardware ungetestet. Wir haben hier ebenfalls keine ACE2-Hardware zur Verifikation. Der Standard-`toolhead`-Pfad (ohne ACE) wurde live gegen einen echten Kobra X getestet. Wer ein Multi-ACE-Setup betreibt: bitte per Issue Rückmeldung geben.
-
-### Fixes
-- **Happy-Hare-MMU-Emulation:** Es werden nur belegte Slots gesynct — kein Placeholder für leere Slots (kompatibel mit OrcaSlicer PR #13372).
-- **GCode-Farb-Dialog** zeigt nach einem neuen Upload nicht mehr die Daten der vorherigen Datei.
-
----
-
-## [0.9.10] – 2026-05-17
-
-> **Hinweis:** Mit diesem Release wird der Fokus von neuen Features auf
-> **Stabilisierung und Bugfixing** verlagert. Die Kern-Workflows
-> (Multi-Printer, Drucker hinzufügen/entfernen, Filament-Dialog,
-> Skip-Objekte, Standalone-Binaries) sind funktional ausreichend — ab jetzt
-> steht Robustheit vor neuen Features. Größere Feature-Wünsche (ACE Pro 2,
-> Home-Assistant-Integration vervollständigen, …) bleiben vorerst im Backlog.
-
-### Neu
-- **Objekte überspringen (vor und während des Drucks):** Aus dem AnycubicSlicerNext-Workbench-Bundle rekonstruiert — der Kobra X kann das nativ über sein Protokoll, der Anycubic-Slicer bietet es bloß nicht im UI an. Die Bridge schon, in zwei Varianten:
-  - **Vor dem Druck:** beim Starten eines Multi-Object-Drucks aus dem Browser-Tab hat der Filament-Dialog jetzt einen zusätzlichen Abschnitt „Objekte". Einzelne Objekte abwählen (oder Polygon direkt im Build-Plate-SVG anklicken) — sie werden vor dem Druck herausgenommen.
-  - **Während des Drucks:** neuer ✂-Button im Dashboard (nur während eines laufenden Drucks sichtbar). Öffnet einen Dialog mit derselben interaktiven SVG-Vorschau — Teil anklicken, bestätigen, der Drucker druckt es nicht weiter. Bereits übersprungene Teile bleiben ausgegraut, der Dialog aktualisiert sich live damit man sieht welche schon weg sind.
-- **Filament-Dialog – farbige Kanal- und Slot-Marker (Issue #23):** Die GCode-Kanal-Nummer sitzt jetzt in einer farbigen Box links (Hintergrund = Kanal-Farbe, Auto-Kontrast-Text statt des alten kleinen Punktes), der zugewiesene AMS-Slot bekommt rechts neben dem Dropdown denselben Look — aktualisiert sich live wenn man die Auswahl ändert. Funktioniert mit 4 Kanälen; das Layout iteriert sauber für mehr, aber >4 echte Filament-Slots brauchen eine ACE-Pro-2-Box und sind ohne entsprechende Hardware nicht durchgängig testbar (geparkt als Feature-Request, Issues #22 und #23).
-
-### Intern
-- Neue Helfer `kobrax_client.skip_objects(names)` / `query_skip_objects()`.
-- Neue Endpunkte: `GET /kx/files/{id}/objects`, `POST /kx/skip`, `POST /kx/skip/query`, `GET /kx/skip/state`.
-- SQLite-Schema: `gcode_files` bekommt die Spalten `objects_skip_parts` und `svg_image` (Auto-Migration auf bestehenden DBs).
-- `_on_file` extrahiert die vom Drucker gelieferte Objektliste + SVG-Vorschau und speichert sie pro Datei.
-- `_on_skip`-Callback verfolgt, welche Objekte der Drucker aktuell als übersprungen meldet.
-
----
-
 ## [0.9.9] – 2026-05-14
 
 ### Fixes

CHANGELOG.md

@@ -1,77 +1,5 @@
 # Changelog
 
-## [0.9.13] – 2026-05-20
-
-### Fixes
-- **Self-update was broken for 0.9.12 (important):** the in-app updater only
-  replaced `kobrax_moonraker_bridge.py`, but since 0.9.12 that file imports the
-  extracted `_web_assets.py` (bundled frontend). Updating to 0.9.12 therefore
-  crashed with `ModuleNotFoundError: No module named '_web_assets'` and the
-  bridge wouldn't come back up. The updater now downloads **all** bridge modules
-  (main file + `_web_assets.py` + client + loaders), fully, then swaps them
-  atomically — and refuses to self-update in binary mode (use the new
-  binary/Docker image instead).
-
-> If you got stuck on 0.9.12 after pressing update: rebuild/redeploy the Docker
-> image or grab the 0.9.13 binary once, then self-update works again.
-
-## [0.9.12] – 2026-05-20
-
-### Fixes
-- **Pause state** is now read correctly: the bridge was looking at the device-level
-  state instead of the nested print-job state, so a paused print sometimes still
-  showed as printing. Layer/progress/remaining-time are now also taken from the
-  job report.
-
-### Internal
-- Frontend (HTML/CSS/JS) extracted from the Python file into `web/index.html`,
-  bundled back in at build time — easier to maintain, no change for users.
-
-### Docs
-- Linked the community **Home Assistant integration** by @gangoke.
-
-## [0.9.11] – 2026-05-20
-
-### New
-- **ACE Pro 2 support (experimental, community contribution by @gangoke, PR #26):** the bridge now auto-detects the filament hardware and adapts:
-  - **Modes:** `toolhead` (no ACE, stock 4-slot box), `ace_direct` (one ACE Pro 2 directly on the toolhead), `ace_hub` (up to 4 ACE units on the slot-4 hub) — up to **19 slots** total.
-  - **AMS auto-refill** toggle.
-  - **Dryer:** temperature/humidity monitor, start/stop/temp/duration control, with material presets configurable in a new `[ace_dry_presets]` config section (PLA, PLA+, PETG, TPU, ABS/ASA, PA/PC + 3 custom).
-  - **UI:** filament section scales to 19 slots, mode label, loaded slot is green-outlined with a load/unload pulse animation, unload/load straight from the slot-edit dialog.
-  - **GCode color mapping:** ACE2-aware, color-from-GCode fix, inconsistency notifier when the mapping doesn't match the objects, better default mapping.
-
-> **⚠️ Experimental:** the ACE Pro 2 hardware paths were developed and tested by the contributor with a single ACE2 unit; the 2–4 unit hub configurations are theoretical and untested on real hardware. We don't have ACE2 hardware to verify against either. The standard `toolhead` (no-ACE) path was verified live against a real Kobra X here. If you run a multi-ACE setup, please report back via Issues.
-
-### Fixes
-- **Happy Hare MMU emulation:** only populated slots are now synced — no placeholder for empty slots (aligns with OrcaSlicer PR #13372).
-- **GCode color dialog** no longer shows the previously-uploaded file's data after a new upload.
-
----
-
-## [0.9.10] – 2026-05-17
-
-> **Heads-up:** with this release the focus shifts from new features to
-> **stabilization and bug-fixing**. The core flows (multi-printer, add/remove,
-> filament dialog, skip objects, standalone binaries) are feature-complete
-> enough — from now on the priority is making them rock-solid before adding
-> more on top. Bigger feature requests (ACE Pro 2, Home Assistant integration
-> completeness, …) stay on the backlog for now.
-
-### New
-- **Skip objects (pre-print and mid-print):** Reverse-engineered from the AnycubicSlicerNext Workbench bundle — the Kobra X actually supports object skipping over its native protocol, but the Anycubic slicer doesn't expose it. The bridge does now, in both flavors:
-  - **Pre-print:** when starting a multi-object print from the Browser tab, the filament dialog now has an additional "Objects" section. Uncheck individual objects (or click the polygon directly on the build-plate SVG preview) and they're stripped from the print before it starts.
-  - **Mid-print:** new ✂ button on the dashboard (only visible during an active print). Opens a dialog with the same interactive SVG preview — click a part to mark it for skipping, hit confirm, and the printer drops it from the rest of the run. Already-skipped parts stay greyed out and the dialog refreshes live so you can see which ones are gone.
-- **Filament dialog – colored channel and slot markers (Issue #23):** the GCode channel number now sits in a colored box on the left (background = channel color, auto-contrast text instead of the old tiny dot), and the assigned AMS slot gets the same treatment on the right of the dropdown — updates live as you change the selection. Plays well with 4 channels; the layout iterates so more channels render correctly, but >4 actual filament slots still need an ACE Pro 2 hub to be testable end-to-end (parked as a feature request, Issues #22 and #23).
-
-### Internal
-- New `kobrax_client.skip_objects(names)` / `query_skip_objects()` helpers.
-- New endpoints: `GET /kx/files/{id}/objects`, `POST /kx/skip`, `POST /kx/skip/query`, `GET /kx/skip/state`.
-- SQLite schema: `gcode_files` gained `objects_skip_parts` and `svg_image` columns (auto-migrates on existing DBs).
-- `_on_file` now extracts the printer-provided object list + SVG preview and persists them per file.
-- `_on_skip` callback tracks which objects the printer reports as currently skipped.
-
----
-
 ## [0.9.9] – 2026-05-14
 
 ### Fixes

Dockerfile

@@ -6,7 +6,7 @@ COPY requirements.txt .
 RUN pip install --no-cache-dir -r requirements.txt
 
 COPY kobrax_moonraker_bridge.py .
-COPY _web_assets.py .
+COPY web ./web
 COPY config_loader.py .
 COPY env_loader.py .
 COPY kobrax_client.py .

LICENSE

@@ -1,674 +0,0 @@
-                    GNU GENERAL PUBLIC LICENSE
-                       Version 3, 29 June 2007
-
- Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
- Everyone is permitted to copy and distribute verbatim copies
- of this license document, but changing it is not allowed.
-
-                            Preamble
-
-  The GNU General Public License is a free, copyleft license for
-software and other kinds of works.
-
-  The licenses for most software and other practical works are designed
-to take away your freedom to share and change the works.  By contrast,
-the GNU General Public License is intended to guarantee your freedom to
-share and change all versions of a program--to make sure it remains free
-software for all its users.  We, the Free Software Foundation, use the
-GNU General Public License for most of our software; it applies also to
-any other work released this way by its authors.  You can apply it to
-your programs, too.
-
-  When we speak of free software, we are referring to freedom, not
-price.  Our General Public Licenses are designed to make sure that you
-have the freedom to distribute copies of free software (and charge for
-them if you wish), that you receive source code or can get it if you
-want it, that you can change the software or use pieces of it in new
-free programs, and that you know you can do these things.
-
-  To protect your rights, we need to prevent others from denying you
-these rights or asking you to surrender the rights.  Therefore, you have
-certain responsibilities if you distribute copies of the software, or if
-you modify it: responsibilities to respect the freedom of others.
-
-  For example, if you distribute copies of such a program, whether
-gratis or for a fee, you must pass on to the recipients the same
-freedoms that you received.  You must make sure that they, too, receive
-or can get the source code.  And you must show them these terms so they
-know their rights.
-
-  Developers that use the GNU GPL protect your rights with two steps:
-(1) assert copyright on the software, and (2) offer you this License
-giving you legal permission to copy, distribute and/or modify it.
-
-  For the developers' and authors' protection, the GPL clearly explains
-that there is no warranty for this free software.  For both users' and
-authors' sake, the GPL requires that modified versions be marked as
-changed, so that their problems will not be attributed erroneously to
-authors of previous versions.
-
-  Some devices are designed to deny users access to install or run
-modified versions of the software inside them, although the manufacturer
-can do so.  This is fundamentally incompatible with the aim of
-protecting users' freedom to change the software.  The systematic
-pattern of such abuse occurs in the area of products for individuals to
-use, which is precisely where it is most unacceptable.  Therefore, we
-have designed this version of the GPL to prohibit the practice for those
-products.  If such problems arise substantially in other domains, we
-stand ready to extend this provision to those domains in future versions
-of the GPL, as needed to protect the freedom of users.
-
-  Finally, every program is threatened constantly by software patents.
-States should not allow patents to restrict development and use of
-software on general-purpose computers, but in those that do, we wish to
-avoid the special danger that patents applied to a free program could
-make it effectively proprietary.  To prevent this, the GPL assures that
-patents cannot be used to render the program non-free.
-
-  The precise terms and conditions for copying, distribution and
-modification follow.
-
-                       TERMS AND CONDITIONS
-
-  0. Definitions.
-
-  "This License" refers to version 3 of the GNU General Public License.
-
-  "Copyright" also means copyright-like laws that apply to other kinds of
-works, such as semiconductor masks.
-
-  "The Program" refers to any copyrightable work licensed under this
-License.  Each licensee is addressed as "you".  "Licensees" and
-"recipients" may be individuals or organizations.
-
-  To "modify" a work means to copy from or adapt all or part of the work
-in a fashion requiring copyright permission, other than the making of an
-exact copy.  The resulting work is called a "modified version" of the
-earlier work or a work "based on" the earlier work.
-
-  A "covered work" means either the unmodified Program or a work based
-on the Program.
-
-  To "propagate" a work means to do anything with it that, without
-permission, would make you directly or secondarily liable for
-infringement under applicable copyright law, except executing it on a
-computer or modifying a private copy.  Propagation includes copying,
-distribution (with or without modification), making available to the
-public, and in some countries other activities as well.
-
-  To "convey" a work means any kind of propagation that enables other
-parties to make or receive copies.  Mere interaction with a user through
-a computer network, with no transfer of a copy, is not conveying.
-
-  An interactive user interface displays "Appropriate Legal Notices"
-to the extent that it includes a convenient and prominently visible
-feature that (1) displays an appropriate copyright notice, and (2)
-tells the user that there is no warranty for the work (except to the
-extent that warranties are provided), that licensees may convey the
-work under this License, and how to view a copy of this License.  If
-the interface presents a list of user commands or options, such as a
-menu, a prominent item in the list meets this criterion.
-
-  1. Source Code.
-
-  The "source code" for a work means the preferred form of the work
-for making modifications to it.  "Object code" means any non-source
-form of a work.
-
-  A "Standard Interface" means an interface that either is an official
-standard defined by a recognized standards body, or, in the case of
-interfaces specified for a particular programming language, one that
-is widely used among developers working in that language.
-
-  The "System Libraries" of an executable work include anything, other
-than the work as a whole, that (a) is included in the normal form of
-packaging a Major Component, but which is not part of that Major
-Component, and (b) serves only to enable use of the work with that
-Major Component, or to implement a Standard Interface for which an
-implementation is available to the public in source code form.  A
-"Major Component", in this context, means a major essential component
-(kernel, window system, and so on) of the specific operating system
-(if any) on which the executable work runs, or a compiler used to
-produce the work, or an object code interpreter used to run it.
-
-  The "Corresponding Source" for a work in object code form means all
-the source code needed to generate, install, and (for an executable
-work) run the object code and to modify the work, including scripts to
-control those activities.  However, it does not include the work's
-System Libraries, or general-purpose tools or generally available free
-programs which are used unmodified in performing those activities but
-which are not part of the work.  For example, Corresponding Source
-includes interface definition files associated with source files for
-the work, and the source code for shared libraries and dynamically
-linked subprograms that the work is specifically designed to require,
-such as by intimate data communication or control flow between those
-subprograms and other parts of the work.
-
-  The Corresponding Source need not include anything that users
-can regenerate automatically from other parts of the Corresponding
-Source.
-
-  The Corresponding Source for a work in source code form is that
-same work.
-
-  2. Basic Permissions.
-
-  All rights granted under this License are granted for the term of
-copyright on the Program, and are irrevocable provided the stated
-conditions are met.  This License explicitly affirms your unlimited
-permission to run the unmodified Program.  The output from running a
-covered work is covered by this License only if the output, given its
-content, constitutes a covered work.  This License acknowledges your
-rights of fair use or other equivalent, as provided by copyright law.
-
-  You may make, run and propagate covered works that you do not
-convey, without conditions so long as your license otherwise remains
-in force.  You may convey covered works to others for the sole purpose
-of having them make modifications exclusively for you, or provide you
-with facilities for running those works, provided that you comply with
-the terms of this License in conveying all material for which you do
-not control copyright.  Those thus making or running the covered works
-for you must do so exclusively on your behalf, under your direction
-and control, on terms that prohibit them from making any copies of
-your copyrighted material outside their relationship with you.
-
-  Conveying under any other circumstances is permitted solely under
-the conditions stated below.  Sublicensing is not allowed; section 10
-makes it unnecessary.
-
-  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
-
-  No covered work shall be deemed part of an effective technological
-measure under any applicable law fulfilling obligations under article
-11 of the WIPO copyright treaty adopted on 20 December 1996, or
-similar laws prohibiting or restricting circumvention of such
-measures.
-
-  When you convey a covered work, you waive any legal power to forbid
-circumvention of technological measures to the extent such circumvention
-is effected by exercising rights under this License with respect to
-the covered work, and you disclaim any intention to limit operation or
-modification of the work as a means of enforcing, against the work's
-users, your or third parties' legal rights to forbid circumvention of
-technological measures.
-
-  4. Conveying Verbatim Copies.
-
-  You may convey verbatim copies of the Program's source code as you
-receive it, in any medium, provided that you conspicuously and
-appropriately publish on each copy an appropriate copyright notice;
-keep intact all notices stating that this License and any
-non-permissive terms added in accord with section 7 apply to the code;
-keep intact all notices of the absence of any warranty; and give all
-recipients a copy of this License along with the Program.
-
-  You may charge any price or no price for each copy that you convey,
-and you may offer support or warranty protection for a fee.
-
-  5. Conveying Modified Source Versions.
-
-  You may convey a work based on the Program, or the modifications to
-produce it from the Program, in the form of source code under the
-terms of section 4, provided that you also meet all of these conditions:
-
-    a) The work must carry prominent notices stating that you modified
-    it, and giving a relevant date.
-
-    b) The work must carry prominent notices stating that it is
-    released under this License and any conditions added under section
-    7.  This requirement modifies the requirement in section 4 to
-    "keep intact all notices".
-
-    c) You must license the entire work, as a whole, under this
-    License to anyone who comes into possession of a copy.  This
-    License will therefore apply, along with any applicable section 7
-    additional terms, to the whole of the work, and all its parts,
-    regardless of how they are packaged.  This License gives no
-    permission to license the work in any other way, but it does not
-    invalidate such permission if you have separately received it.
-
-    d) If the work has interactive user interfaces, each must display
-    Appropriate Legal Notices; however, if the Program has interactive
-    interfaces that do not display Appropriate Legal Notices, your
-    work need not make them do so.
-
-  A compilation of a covered work with other separate and independent
-works, which are not by their nature extensions of the covered work,
-and which are not combined with it such as to form a larger program,
-in or on a volume of a storage or distribution medium, is called an
-"aggregate" if the compilation and its resulting copyright are not
-used to limit the access or legal rights of the compilation's users
-beyond what the individual works permit.  Inclusion of a covered work
-in an aggregate does not cause this License to apply to the other
-parts of the aggregate.
-
-  6. Conveying Non-Source Forms.
-
-  You may convey a covered work in object code form under the terms
-of sections 4 and 5, provided that you also convey the
-machine-readable Corresponding Source under the terms of this License,
-in one of these ways:
-
-    a) Convey the object code in, or embodied in, a physical product
-    (including a physical distribution medium), accompanied by the
-    Corresponding Source fixed on a durable physical medium
-    customarily used for software interchange.
-
-    b) Convey the object code in, or embodied in, a physical product
-    (including a physical distribution medium), accompanied by a
-    written offer, valid for at least three years and valid for as
-    long as you offer spare parts or customer support for that product
-    model, to give anyone who possesses the object code either (1) a
-    copy of the Corresponding Source for all the software in the
-    product that is covered by this License, on a durable physical
-    medium customarily used for software interchange, for a price no
-    more than your reasonable cost of physically performing this
-    conveying of source, or (2) access to copy the
-    Corresponding Source from a network server at no charge.
-
-    c) Convey individual copies of the object code with a copy of the
-    written offer to provide the Corresponding Source.  This
-    alternative is allowed only occasionally and noncommercially, and
-    only if you received the object code with such an offer, in accord
-    with subsection 6b.
-
-    d) Convey the object code by offering access from a designated
-    place (gratis or for a charge), and offer equivalent access to the
-    Corresponding Source in the same way through the same place at no
-    further charge.  You need not require recipients to copy the
-    Corresponding Source along with the object code.  If the place to
-    copy the object code is a network server, the Corresponding Source
-    may be on a different server (operated by you or a third party)
-    that supports equivalent copying facilities, provided you maintain
-    clear directions next to the object code saying where to find the
-    Corresponding Source.  Regardless of what server hosts the
-    Corresponding Source, you remain obligated to ensure that it is
-    available for as long as needed to satisfy these requirements.
-
-    e) Convey the object code using peer-to-peer transmission, provided
-    you inform other peers where the object code and Corresponding
-    Source of the work are being offered to the general public at no
-    charge under subsection 6d.
-
-  A separable portion of the object code, whose source code is excluded
-from the Corresponding Source as a System Library, need not be
-included in conveying the object code work.
-
-  A "User Product" is either (1) a "consumer product", which means any
-tangible personal property which is normally used for personal, family,
-or household purposes, or (2) anything designed or sold for incorporation
-into a dwelling.  In determining whether a product is a consumer product,
-doubtful cases shall be resolved in favor of coverage.  For a particular
-product received by a particular user, "normally used" refers to a
-typical or common use of that class of product, regardless of the status
-of the particular user or of the way in which the particular user
-actually uses, or expects or is expected to use, the product.  A product
-is a consumer product regardless of whether the product has substantial
-commercial, industrial or non-consumer uses, unless such uses represent
-the only significant mode of use of the product.
-
-  "Installation Information" for a User Product means any methods,
-procedures, authorization keys, or other information required to install
-and execute modified versions of a covered work in that User Product from
-a modified version of its Corresponding Source.  The information must
-suffice to ensure that the continued functioning of the modified object
-code is in no case prevented or interfered with solely because
-modification has been made.
-
-  If you convey an object code work under this section in, or with, or
-specifically for use in, a User Product, and the conveying occurs as
-part of a transaction in which the right of possession and use of the
-User Product is transferred to the recipient in perpetuity or for a
-fixed term (regardless of how the transaction is characterized), the
-Corresponding Source conveyed under this section must be accompanied
-by the Installation Information.  But this requirement does not apply
-if neither you nor any third party retains the ability to install
-modified object code on the User Product (for example, the work has
-been installed in ROM).
-
-  The requirement to provide Installation Information does not include a
-requirement to continue to provide support service, warranty, or updates
-for a work that has been modified or installed by the recipient, or for
-the User Product in which it has been modified or installed.  Access to a
-network may be denied when the modification itself materially and
-adversely affects the operation of the network or violates the rules and
-protocols for communication across the network.
-
-  Corresponding Source conveyed, and Installation Information provided,
-in accord with this section must be in a format that is publicly
-documented (and with an implementation available to the public in
-source code form), and must require no special password or key for
-unpacking, reading or copying.
-
-  7. Additional Terms.
-
-  "Additional permissions" are terms that supplement the terms of this
-License by making exceptions from one or more of its conditions.
-Additional permissions that are applicable to the entire Program shall
-be treated as though they were included in this License, to the extent
-that they are valid under applicable law.  If additional permissions
-apply only to part of the Program, that part may be used separately
-under those permissions, but the entire Program remains governed by
-this License without regard to the additional permissions.
-
-  When you convey a copy of a covered work, you may at your option
-remove any additional permissions from that copy, or from any part of
-it.  (Additional permissions may be written to require their own
-removal in certain cases when you modify the work.)  You may place
-additional permissions on material, added by you to a covered work,
-for which you have or can give appropriate copyright permission.
-
-  Notwithstanding any other provision of this License, for material you
-add to a covered work, you may (if authorized by the copyright holders of
-that material) supplement the terms of this License with terms:
-
-    a) Disclaiming warranty or limiting liability differently from the
-    terms of sections 15 and 16 of this License; or
-
-    b) Requiring preservation of specified reasonable legal notices or
-    author attributions in that material or in the Appropriate Legal
-    Notices displayed by works containing it; or
-
-    c) Prohibiting misrepresentation of the origin of that material, or
-    requiring that modified versions of such material be marked in
-    reasonable ways as different from the original version; or
-
-    d) Limiting the use for publicity purposes of names of licensors or
-    authors of the material; or
-
-    e) Declining to grant rights under trademark law for use of some
-    trade names, trademarks, or service marks; or
-
-    f) Requiring indemnification of licensors and authors of that
-    material by anyone who conveys the material (or modified versions of
-    it) with contractual assumptions of liability to the recipient, for
-    any liability that these contractual assumptions directly impose on
-    those licensors and authors.
-
-  All other non-permissive additional terms are considered "further
-restrictions" within the meaning of section 10.  If the Program as you
-received it, or any part of it, contains a notice stating that it is
-governed by this License along with a term that is a further
-restriction, you may remove that term.  If a license document contains
-a further restriction but permits relicensing or conveying under this
-License, you may add to a covered work material governed by the terms
-of that license document, provided that the further restriction does
-not survive such relicensing or conveying.
-
-  If you add terms to a covered work in accord with this section, you
-must place, in the relevant source files, a statement of the
-additional terms that apply to those files, or a notice indicating
-where to find the applicable terms.
-
-  Additional terms, permissive or non-permissive, may be stated in the
-form of a separately written license, or stated as exceptions;
-the above requirements apply either way.
-
-  8. Termination.
-
-  You may not propagate or modify a covered work except as expressly
-provided under this License.  Any attempt otherwise to propagate or
-modify it is void, and will automatically terminate your rights under
-this License (including any patent licenses granted under the third
-paragraph of section 11).
-
-  However, if you cease all violation of this License, then your
-license from a particular copyright holder is reinstated (a)
-provisionally, unless and until the copyright holder explicitly and
-finally terminates your license, and (b) permanently, if the copyright
-holder fails to notify you of the violation by some reasonable means
-prior to 60 days after the cessation.
-
-  Moreover, your license from a particular copyright holder is
-reinstated permanently if the copyright holder notifies you of the
-violation by some reasonable means, this is the first time you have
-received notice of violation of this License (for any work) from that
-copyright holder, and you cure the violation prior to 30 days after
-your receipt of the notice.
-
-  Termination of your rights under this section does not terminate the
-licenses of parties who have received copies or rights from you under
-this License.  If your rights have been terminated and not permanently
-reinstated, you do not qualify to receive new licenses for the same
-material under section 10.
-
-  9. Acceptance Not Required for Having Copies.
-
-  You are not required to accept this License in order to receive or
-run a copy of the Program.  Ancillary propagation of a covered work
-occurring solely as a consequence of using peer-to-peer transmission
-to receive a copy likewise does not require acceptance.  However,
-nothing other than this License grants you permission to propagate or
-modify any covered work.  These actions infringe copyright if you do
-not accept this License.  Therefore, by modifying or propagating a
-covered work, you indicate your acceptance of this License to do so.
-
-  10. Automatic Licensing of Downstream Recipients.
-
-  Each time you convey a covered work, the recipient automatically
-receives a license from the original licensors, to run, modify and
-propagate that work, subject to this License.  You are not responsible
-for enforcing compliance by third parties with this License.
-
-  An "entity transaction" is a transaction transferring control of an
-organization, or substantially all assets of one, or subdividing an
-organization, or merging organizations.  If propagation of a covered
-work results from an entity transaction, each party to that
-transaction who receives a copy of the work also receives whatever
-licenses to the work the party's predecessor in interest had or could
-give under the previous paragraph, plus a right to possession of the
-Corresponding Source of the work from the predecessor in interest, if
-the predecessor has it or can get it with reasonable efforts.
-
-  You may not impose any further restrictions on the exercise of the
-rights granted or affirmed under this License.  For example, you may
-not impose a license fee, royalty, or other charge for exercise of
-rights granted under this License, and you may not initiate litigation
-(including a cross-claim or counterclaim in a lawsuit) alleging that
-any patent claim is infringed by making, using, selling, offering for
-sale, or importing the Program or any portion of it.
-
-  11. Patents.
-
-  A "contributor" is a copyright holder who authorizes use under this
-License of the Program or a work on which the Program is based.  The
-work thus licensed is called the contributor's "contributor version".
-
-  A contributor's "essential patent claims" are all patent claims
-owned or controlled by the contributor, whether already acquired or
-hereafter acquired, that would be infringed by some manner, permitted
-by this License, of making, using, or selling its contributor version,
-but do not include claims that would be infringed only as a
-consequence of further modification of the contributor version.  For
-purposes of this definition, "control" includes the right to grant
-patent sublicenses in a manner consistent with the requirements of
-this License.
-
-  Each contributor grants you a non-exclusive, worldwide, royalty-free
-patent license under the contributor's essential patent claims, to
-make, use, sell, offer for sale, import and otherwise run, modify and
-propagate the contents of its contributor version.
-
-  In the following three paragraphs, a "patent license" is any express
-agreement or commitment, however denominated, not to enforce a patent
-(such as an express permission to practice a patent or covenant not to
-sue for patent infringement).  To "grant" such a patent license to a
-party means to make such an agreement or commitment not to enforce a
-patent against the party.
-
-  If you convey a covered work, knowingly relying on a patent license,
-and the Corresponding Source of the work is not available for anyone
-to copy, free of charge and under the terms of this License, through a
-publicly available network server or other readily accessible means,
-then you must either (1) cause the Corresponding Source to be so
-available, or (2) arrange to deprive yourself of the benefit of the
-patent license for this particular work, or (3) arrange, in a manner
-consistent with the requirements of this License, to extend the patent
-license to downstream recipients.  "Knowingly relying" means you have
-actual knowledge that, but for the patent license, your conveying the
-covered work in a country, or your recipient's use of the covered work
-in a country, would infringe one or more identifiable patents in that
-country that you have reason to believe are valid.
-
-  If, pursuant to or in connection with a single transaction or
-arrangement, you convey, or propagate by procuring conveyance of, a
-covered work, and grant a patent license to some of the parties
-receiving the covered work authorizing them to use, propagate, modify
-or convey a specific copy of the covered work, then the patent license
-you grant is automatically extended to all recipients of the covered
-work and works based on it.
-
-  A patent license is "discriminatory" if it does not include within
-the scope of its coverage, prohibits the exercise of, or is
-conditioned on the non-exercise of one or more of the rights that are
-specifically granted under this License.  You may not convey a covered
-work if you are a party to an arrangement with a third party that is
-in the business of distributing software, under which you make payment
-to the third party based on the extent of your activity of conveying
-the work, and under which the third party grants, to any of the
-parties who would receive the covered work from you, a discriminatory
-patent license (a) in connection with copies of the covered work
-conveyed by you (or copies made from those copies), or (b) primarily
-for and in connection with specific products or compilations that
-contain the covered work, unless you entered into that arrangement,
-or that patent license was granted, prior to 28 March 2007.
-
-  Nothing in this License shall be construed as excluding or limiting
-any implied license or other defenses to infringement that may
-otherwise be available to you under applicable patent law.
-
-  12. No Surrender of Others' Freedom.
-
-  If conditions are imposed on you (whether by court order, agreement or
-otherwise) that contradict the conditions of this License, they do not
-excuse you from the conditions of this License.  If you cannot convey a
-covered work so as to satisfy simultaneously your obligations under this
-License and any other pertinent obligations, then as a consequence you may
-not convey it at all.  For example, if you agree to terms that obligate you
-to collect a royalty for further conveying from those to whom you convey
-the Program, the only way you could satisfy both those terms and this
-License would be to refrain entirely from conveying the Program.
-
-  13. Use with the GNU Affero General Public License.
-
-  Notwithstanding any other provision of this License, you have
-permission to link or combine any covered work with a work licensed
-under version 3 of the GNU Affero General Public License into a single
-combined work, and to convey the resulting work.  The terms of this
-License will continue to apply to the part which is the covered work,
-but the special requirements of the GNU Affero General Public License,
-section 13, concerning interaction through a network will apply to the
-combination as such.
-
-  14. Revised Versions of this License.
-
-  The Free Software Foundation may publish revised and/or new versions of
-the GNU General Public License from time to time.  Such new versions will
-be similar in spirit to the present version, but may differ in detail to
-address new problems or concerns.
-
-  Each version is given a distinguishing version number.  If the
-Program specifies that a certain numbered version of the GNU General
-Public License "or any later version" applies to it, you have the
-option of following the terms and conditions either of that numbered
-version or of any later version published by the Free Software
-Foundation.  If the Program does not specify a version number of the
-GNU General Public License, you may choose any version ever published
-by the Free Software Foundation.
-
-  If the Program specifies that a proxy can decide which future
-versions of the GNU General Public License can be used, that proxy's
-public statement of acceptance of a version permanently authorizes you
-to choose that version for the Program.
-
-  Later license versions may give you additional or different
-permissions.  However, no additional obligations are imposed on any
-author or copyright holder as a result of your choosing to follow a
-later version.
-
-  15. Disclaimer of Warranty.
-
-  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
-APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
-HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
-OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
-THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
-PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
-IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
-ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
-
-  16. Limitation of Liability.
-
-  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
-WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
-THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
-GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
-USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
-DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
-PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
-EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
-SUCH DAMAGES.
-
-  17. Interpretation of Sections 15 and 16.
-
-  If the disclaimer of warranty and limitation of liability provided
-above cannot be given local legal effect according to their terms,
-reviewing courts shall apply local law that most closely approximates
-an absolute waiver of all civil liability in connection with the
-Program, unless a warranty or assumption of liability accompanies a
-copy of the Program in return for a fee.
-
-                     END OF TERMS AND CONDITIONS
-
-            How to Apply These Terms to Your New Programs
-
-  If you develop a new program, and you want it to be of the greatest
-possible use to the public, the best way to achieve this is to make it
-free software which everyone can redistribute and change under these terms.
-
-  To do so, attach the following notices to the program.  It is safest
-to attach them to the start of each source file to most effectively
-state the exclusion of warranty; and each file should have at least
-the "copyright" line and a pointer to where the full notice is found.
-
-    <one line to give the program's name and a brief idea of what it does.>
-    Copyright (C) <year>  <name of author>
-
-    This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    This program is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU General Public License for more details.
-
-    You should have received a copy of the GNU General Public License
-    along with this program.  If not, see <https://www.gnu.org/licenses/>.
-
-Also add information on how to contact you by electronic and paper mail.
-
-  If the program does terminal interaction, make it output a short
-notice like this when it starts in an interactive mode:
-
-    <program>  Copyright (C) <year>  <name of author>
-    This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
-    This is free software, and you are welcome to redistribute it
-    under certain conditions; type `show c' for details.
-
-The hypothetical commands `show w' and `show c' should show the appropriate
-parts of the General Public License.  Of course, your program's commands
-might be different; for a GUI interface, you would use an "about box".
-
-  You should also get your employer (if you work as a programmer) or school,
-if any, to sign a "copyright disclaimer" for the program, if necessary.
-For more information on this, and how to apply and follow the GNU GPL, see
-<https://www.gnu.org/licenses/>.
-
-  The GNU General Public License does not permit incorporating your program
-into proprietary programs.  If your program is a subroutine library, you
-may consider it more useful to permit linking proprietary applications with
-the library.  If this is what you want to do, use the GNU Lesser General
-Public License instead of this License.  But first, please read
-<https://www.gnu.org/licenses/why-not-lgpl.html>.

NOTICE.md

@@ -1,68 +0,0 @@
-# NOTICE
-
-This repository contains code licensed under the **GNU General Public License
-v3.0** (see [LICENSE](LICENSE)) and material that is **not** covered by that
-license. Read this file before forking, distributing, or building from source.
-
-## What is GPLv3-licensed
-
-The original work in this repository:
-
-- `bridge/` — Bridge daemon, MQTT client, web UI, configuration loader,
-  protocol implementation
-- `tools/` — `extract_credentials`, `fetch_credentials` utilities
-- `_archive/tools/kx_printer_emulator.py` — printer emulator
-- `Dockerfile`, `docker-compose.yml`, `release.sh`, build scripts
-- Documentation files (`README*`, `CHANGELOG*`, `_archive/RE/06_docs/*`)
-- `kobra_x_orcaslicer_preset.zip` — slicer profile derived from public OrcaSlicer
-  presets, adapted for the Kobra X
-
-You are free to use, modify and redistribute this code under the terms of
-GPLv3 — including for commercial purposes — provided downstream forks remain
-under GPLv3 and source is made available to recipients.
-
-## What is **not** GPLv3-licensed
-
-The following items are **third-party material**, included here only for
-**interoperability purposes** as permitted under §69e UrhG (German Copyright
-Act; equivalent: EU Software Directive Art. 6, US fair-use for reverse
-engineering for interoperability):
-
-- **`bridge/anycubic_slicer.crt`** and **`bridge/anycubic_slicer.key`** —
-  TLS client certificate and private key extracted from Anycubic Slicer Next
-  binaries. Copyright remains with Anycubic / their respective authors.
-  Included solely to enable the bridge to authenticate against the LAN MQTT
-  broker that runs on a Kobra X printer the end-user already owns. No
-  ownership claim is made.
-
-- **MQTT protocol structures, payload formats and signature algorithms** —
-  reverse-engineered from `Workbench.dll` / `cloud_mqtt.dll` of the Anycubic
-  Slicer Next application. The protocol itself is documented in
-  `_archive/RE/06_docs/` for transparency. Any reproduction of code or
-  protocol details serves interoperability only.
-
-- **AMS material naming, slot numbering, GCode markers (`EXCLUDE_OBJECT_*`)**
-  — follow conventions established by Anycubic and the wider Klipper
-  ecosystem; usage here is purely interoperability-driven.
-
-## What this means for forks
-
-If you fork KX-Bridge:
-
-1. **You must keep this `NOTICE.md` and `LICENSE` file** in your fork.
-2. Your modifications and additions to the bridge code, UI, tools and docs
-   inherit GPLv3 — they must be made available under the same license if you
-   distribute them.
-3. The third-party material listed above is **not** something you can
-   relicense; it stays under the original (implicit) rights of its owners.
-4. Removing the certificates and rebuilding them from your own Anycubic
-   Slicer installation is the safest path for redistribution if you are
-   unsure about the §69e situation in your jurisdiction.
-
-## Disclaimer
-
-This project is independent, non-commercial reverse-engineering work. It is
-**not** affiliated with, endorsed by, or supported by Anycubic Technology
-Co., Ltd. or any of their subsidiaries.
-
-All trademarks are property of their respective owners.

README.de.md

@@ -16,8 +16,6 @@ Eine Moonraker-kompatible Bridge, die direkt mit dem Drucker spricht.
  
 [![Releases](https://img.shields.io/badge/Download-Releases-2EA043?style=for-the-badge&logo=gitea&logoColor=white)](https://gitea.it-drui.de/viewit/KX-Bridge-Release/releases)
  
-[![Downloads](https://img.shields.io/badge/Downloads-800%2B-8957E5?style=for-the-badge&logo=gitea&logoColor=white)](https://gitea.it-drui.de/viewit/KX-Bridge-Release/releases)
- 
 [![Video](https://img.shields.io/badge/YouTube-Tutorial-FF0000?style=for-the-badge&logo=youtube&logoColor=white)](https://www.youtube.com/watch?v=1Ql4wfH27fM)
 
 <sub>Gefällt dir KX-Bridge? Ein Kaffee auf <a href="https://ko-fi.com/viewitde">Ko-fi</a> hält das Projekt am Leben. ☕</sub>
@@ -101,17 +99,6 @@ Drucker → Verbindungstyp **Moonraker** → Host: `http://BRIDGE-IP:7125`
 
 ---
 
-## 🏠 Community & Integrationen
-
-- **[Home-Assistant-Integration](https://github.com/gangoke/kobrax-lan-hass-component)**
-  von [@gangoke](https://github.com/gangoke) — bindet Sensoren, Drucksteuerung,
-  Licht, Kamera und das GCode-Vorschaubild als native Home-Assistant-Entitäten ein.
-
-> Dies sind **Community-Projekte**, die nicht von KX-Bridge betreut oder
-> supportet werden. Bei Fragen oder Problemen bitte das verlinkte Repository nutzen.
-
----
-
 ## 🔧 Zugangsdaten manuell ermitteln
 
 Normalerweise nicht nötig — *„+ Drucker hinzufügen"* macht das automatisch. Falls doch:
@@ -183,19 +170,7 @@ Die Migration läuft automatisch beim ersten Start nach dem Upgrade — keine Ak
 
 ## 📄 Lizenz
 
-[![License: GPL v3](https://img.shields.io/badge/License-GPL_v3-blue.svg)](LICENSE)
-
-KX-Bridge steht unter der **GNU General Public License v3.0** ([LICENSE](LICENSE)).
-Forks und Erweiterungen müssen bei Weitergabe ebenfalls unter GPLv3 stehen.
-
-Die MQTT-Protokoll-Implementierung ist das Ergebnis unabhängiger
-Reverse-Engineering-Arbeit zur Herstellung der Interoperabilität (§69e UrhG /
-EU-Softwarerichtlinie Art. 6). Drittmaterial im Repository (Anycubic-
-TLS-Zertifikate) fällt **nicht** unter die GPLv3 und ist ausschließlich
-enthalten, um die Authentifizierung am eigenen Drucker zu ermöglichen.
-Details + Disclaimer in [NOTICE.md](NOTICE.md).
-
-Dieses Projekt ist unabhängig und steht in keinem Zusammenhang mit Anycubic.
+Interoperabilitätsforschung gem. §69e UrhG — private, nicht-kommerzielle Nutzung.
 
 <div align="center">
 <br>

README.md

@@ -16,8 +16,6 @@ A Moonraker-compatible bridge that talks directly to the printer.
  
 [![Releases](https://img.shields.io/badge/Download-Releases-2EA043?style=for-the-badge&logo=gitea&logoColor=white)](https://gitea.it-drui.de/viewit/KX-Bridge-Release/releases)
  
-[![Downloads](https://img.shields.io/badge/Downloads-800%2B-8957E5?style=for-the-badge&logo=gitea&logoColor=white)](https://gitea.it-drui.de/viewit/KX-Bridge-Release/releases)
- 
 [![Video](https://img.shields.io/badge/YouTube-Tutorial-FF0000?style=for-the-badge&logo=youtube&logoColor=white)](https://www.youtube.com/watch?v=1Ql4wfH27fM)
 
 <sub>Like KX-Bridge? A coffee on <a href="https://ko-fi.com/viewitde">Ko-fi</a> keeps the project alive. ☕</sub>
@@ -101,17 +99,6 @@ Printer → Connection type **Moonraker** → Host: `http://BRIDGE-IP:7125`
 
 ---
 
-## 🏠 Community & Integrations
-
-- **[Home Assistant integration](https://github.com/gangoke/kobrax-lan-hass-component)**
-  by [@gangoke](https://github.com/gangoke) — exposes sensors, print controls,
-  light, camera and the GCode thumbnail as native Home Assistant entities.
-
-> These are **community projects**, not maintained or supported by KX-Bridge.
-> For questions or issues, please use the linked repository.
-
----
-
 ## 🔧 Getting credentials manually
 
 Normally not needed — *"+ Add printer"* does this automatically. If you do need it:
@@ -183,20 +170,7 @@ Migration runs automatically on first start after the upgrade — no action requ
 
 ## 📄 License
 
-[![License: GPL v3](https://img.shields.io/badge/License-GPL_v3-blue.svg)](LICENSE)
-
-KX-Bridge is released under the **GNU General Public License v3.0**. See
-[LICENSE](LICENSE) for the full text. Forks and modifications must remain
-under GPLv3 if redistributed.
-
-The MQTT protocol implementation is the result of independent
-reverse-engineering for interoperability purposes (§69e UrhG / EU Software
-Directive Art. 6). Third-party material in the repository (Anycubic TLS
-certificates) is **not** covered by GPLv3 and is included solely to enable
-authentication against printers the end-user already owns. See
-[NOTICE.md](NOTICE.md) for details and disclaimer.
-
-This project is independent and not affiliated with Anycubic.
+Interoperability research under §69e UrhG — private, non-commercial use only.
 
 <div align="center">
 <br>

VERSION

@@ -1 +1 @@
-0.9.13
+0.9.9

kobrax_client.py

@@ -14,13 +14,6 @@ Verwendung:
   info = client.query_info()
   print(info["data"]["temp"])
   client.disconnect()
-
-────────────────────────────────────────────────────────────────────────────
-Copyright (C) 2026 viewit (KX-Bridge contributors)
-
-Licensed under GPLv3 — see LICENSE in the project root.
-Protocol reverse-engineered for interoperability (§69e UrhG / EU Software
-Directive Art. 6). Not affiliated with Anycubic. See NOTICE.md.
 """
 
 import hashlib
@@ -465,20 +458,6 @@ class KobraXClient:
     def stop_print(self, taskid: str = "-1") -> dict | None:
         return self.publish("print", "stop", {"taskid": taskid})
 
-    # -- Part-Skip ("Exclude Object") ---------------------------------------
-
-    def query_skip_objects(self) -> dict | None:
-        """Fragt den Drucker nach der aktuellen Objekt-/Skip-Liste."""
-        return self.publish("skip", "query_obj")
-
-    def skip_objects(self, names: list[str]) -> dict | None:
-        """Überspringt die genannten Objekte – auch mid-print möglich.
-
-        Namen entsprechen den EXCLUDE_OBJECT_DEFINE NAME=… Einträgen
-        im GCode-Header bzw. file_details.objects_skip_parts.
-        """
-        return self.publish("skip", "start", {"objects_skip_parts": list(names)})
-
     # -- G-Code Upload -------------------------------------------------------
 
     def upload_gcode(self, filepath: str, remote_filename: str | None = None,

web/themes/THEME-ID-CHECKLIST.md

@@ -0,0 +1,338 @@
+# KX-Bridge Theme – Element-ID-Checkliste
+
+Alle IDs, die `default/app.js` erwartet oder nutzt. Beim Umbau eines Themes (`new1`, …) müssen diese **IDs beibehalten** werden, sonst brechen Features still (null-Check) oder mit Fehler (ohne null-Check).
+
+**Legende**
+
+| Symbol | Bedeutung |
+|--------|-----------|
+| **Pflicht** | Fehlt → Laufzeitfehler oder zentraler Ablauf bricht |
+| **Empfohlen** | Fehlt → Feature funktioniert nicht (meist mit `if(el)` abgesichert) |
+| **Optional** | Nur i18n, Dekoration oder rein HTML-seitig |
+
+**Quelle:** automatisch aus `default/app.js` extrahiert + Abgleich mit `default/index.html`
+
+---
+
+## Navigation & Panels
+
+| ID | Pflicht | Verwendung in app.js |
+|----|---------|----------------------|
+| `panel-dashboard` | **Pflicht** | `showPanel('dashboard')` |
+| `panel-printers` | **Pflicht** | `showPanel('printers')` |
+| `panel-store` | **Pflicht** | `showPanel('store')` |
+| `panel-console` | **Pflicht** | `showPanel('console')` |
+| `nb-dashboard` | Empfohlen | Sidebar active + i18n `.nav-text` |
+| `nb-printers` | Empfohlen | Sidebar active + i18n |
+| `nb-store` | Empfohlen | Sidebar active + i18n |
+| `nb-console` | Empfohlen | Sidebar active + i18n + `#log-badge` |
+| `bnb-dashboard` | Empfohlen | Bottom-Nav active + i18n |
+| `bnb-printers` | Empfohlen | Bottom-Nav |
+| `bnb-store` | Empfohlen | Bottom-Nav |
+| `bnb-console` | Empfohlen | Bottom-Nav + `#log-badge-bot` |
+| `log-badge` | Empfohlen | Fehler-Badge Sidebar-Konsole |
+| `log-badge-bot` | Empfohlen | Fehler-Badge Bottom-Nav |
+
+**CSS-Klassen:** `.panel`, `.nav-btn`, `.bnav-btn`, `.nav-text` (in Sidebar-Buttons)
+
+---
+
+## Header & Banner
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `lang-btn` | **Pflicht** | Sprachumschalter (ohne null-Check) |
+| `conn-btn` | **Pflicht** | Verbinden/Trennen, `updateConnBtn()` |
+| `settings-btn` | Optional | Nur HTML – `openSettings()` per onclick |
+| `printer-dropdown-wrap` | Empfohlen | Multi-Drucker UI |
+| `printer-dropdown-btn` | Optional | Nur HTML-onclick |
+| `printer-dropdown-menu` | Empfohlen | Dropdown-Inhalt |
+| `h-pname` | Empfohlen | Druckername (Multi-Modus) |
+| `h-pname-single` | Empfohlen | Druckername (Einzel-Modus) |
+| `h-version` | Empfohlen | Bridge-Version aus `/api/state` |
+| `h-badge` | Empfohlen | Status-Badge CSS-Klasse |
+| `h-state` | Empfohlen | Status-Text |
+| `conn-error-banner` | Empfohlen | MQTT-Verbindungsfehler |
+| `file-ready-banner` | Empfohlen | Slicer-Upload bereit |
+| `file-ready-name` | Empfohlen | Dateiname im Banner |
+| `file-ready-btn` | Empfohlen | Druck starten |
+| `file-slots-btn` | Empfohlen | Slots wählen |
+| `file-cancel-btn` | Empfohlen | Banner abbrechen |
+
+---
+
+## Dashboard – Kamera
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `d-light-toggle` | **Pflicht** | Licht sync in `applyState()` (`.checked`) |
+| `cam-toggle-btn` | Empfohlen | Start/Stop-Label |
+| `cam-img` | Empfohlen | MJPEG-Stream |
+| `cam-placeholder` | Empfohlen | Platzhalter sichtbar/unsichtbar |
+| `cam-placeholder-txt` | Empfohlen | i18n Platzhaltertext |
+| `cam-spinner` | Empfohlen | Lade-Animation |
+| `cam-overlay` | Empfohlen | Dateiname über Video |
+| `cam-fname` | Empfohlen | Dateiname in Overlay |
+| `cam-wrap` | Optional | Nur HTML/CSS |
+
+---
+
+## Dashboard – Fortschritt & Druck
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `d-pct` | Empfohlen | Prozent-Anzeige |
+| `d-pbar` | Empfohlen | Fortschrittsbalken |
+| `d-layers` | Empfohlen | Layer X / Y |
+| `d-elapsed` | Empfohlen | Verstrichene Zeit |
+| `d-remain` | Empfohlen | Restzeit |
+| `d-slicer-row` | Empfohlen | Slicer-Schätzung ein/aus |
+| `d-slicer-time` | Empfohlen | Slicer-Zeitwert |
+| `d-fname` | Empfohlen | Aktueller Dateiname |
+| `d-thumbnail` | Empfohlen | GCode-Vorschaubild |
+| `d-btn-pause` | Empfohlen | i18n + onclick |
+| `d-btn-resume` | Empfohlen | i18n + onclick |
+| `d-btn-cancel` | Empfohlen | i18n + onclick |
+| `d-ctrl-btns` | Optional | Nur Layout |
+| `p-fname` | Optional | Legacy/Print-Panel (falls vorhanden) |
+| `d-card-progress` | Optional | i18n Kartentitel |
+| `d-lbl-elapsed` | Optional | i18n |
+| `d-lbl-remain` | Optional | i18n |
+| `d-lbl-layers` | Optional | i18n |
+| `d-slicer-label` | Optional | i18n |
+
+---
+
+## Dashboard – Temperaturen
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `d-nt` | Empfohlen | Ist-Temperatur Düse |
+| `d-nt-t` | Empfohlen | Soll-Temperatur Düse |
+| `d-bt` | Empfohlen | Ist-Temperatur Bett |
+| `d-bt-t` | Empfohlen | Soll-Temperatur Bett |
+| `d-ntbar` | Empfohlen | Fortschrittsbalken Düse |
+| `d-btbar` | Empfohlen | Fortschrittsbalken Bett |
+| `p-nozzle-inp` | Empfohlen | Eingabe Ziel Düse (`setNozzle`) |
+| `p-bed-inp` | Empfohlen | Eingabe Ziel Bett (`setBed`) |
+| `d-chart` | Empfohlen | Canvas Temperatur-Verlauf |
+| `d-chart-label` | Optional | i18n |
+| `d-card-temps` | Optional | i18n |
+| `d-lbl-bed` | Optional | i18n |
+
+**CSS-Klassen:** `.lbl-set`, `.lbl-off`, `.temp-input`
+
+---
+
+## Dashboard – Achsen & Schrittweite
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `step-display` | Empfohlen | Anzeige aktuelle Schrittweite |
+| `ptitle-motion-xy` | Optional | i18n |
+| `ptitle-motion-z` | Optional | i18n |
+
+**CSS-Klassen:** `.step-btn`, `.joy`, `.lbl-home-z`, `.lbl-home-xy`, `.lbl-home-all`, `.lbl-disable-motors`, `.lbl-step`
+
+---
+
+## Dashboard – Geschwindigkeit & Lüfter
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `d-spd-1` | Empfohlen | Speed-Modus Leise |
+| `d-spd-2` | Empfohlen | Speed-Modus Normal |
+| `d-spd-3` | Empfohlen | Speed-Modus Sport |
+| `d-spd-bar` | Empfohlen | Speed-Balken |
+| `d-fan` | Empfohlen | Lüfter-Slider |
+| `d-fan-val` | Empfohlen | Lüfter-Prozent-Anzeige |
+| `d-card-speed` | Optional | i18n |
+| `d-card-lightfan` | Optional | i18n |
+| `d-spd-lbl-1` | Optional | i18n |
+| `d-spd-lbl-2` | Optional | i18n |
+| `d-spd-lbl-3` | Optional | i18n |
+| `d-lbl-light` | Optional | i18n |
+
+**CSS-Klassen:** `.lbl-feed`, `.lbl-unload` (AMS-Bereich)
+
+---
+
+## Dashboard – AMS
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `ams-slots` | **Pflicht** | Container für dynamische Slot-Kacheln |
+| `ams-slot-sel` | Empfohlen | Slot-Auswahl für Feed/Unload |
+| `ams-slot-label` | Optional | Nur HTML-oninput Label |
+| `ams-no-data` | Optional | Platzhalter (wird durch JS ersetzt) |
+| `btn-unload` | Optional | Nur HTML |
+| `d-card-ams` | Optional | i18n |
+| `d-card-cam` | Optional | i18n |
+
+---
+
+## Einstellungen (`#settings-modal`)
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `settings-modal` | **Pflicht** | Modal open/close (`.classList`) |
+| `s-printer-name` | Empfohlen | Config-Feld |
+| `s-printer-ip` | **Pflicht** | Config + IP-Hinweis-Listener |
+| `s-mqtt-port` | Empfohlen | Config |
+| `s-username` | Empfohlen | Config |
+| `s-password` | Empfohlen | Config |
+| `s-device-id` | Empfohlen | Config |
+| `s-mode-id` | Empfohlen | Config |
+| `s-default-slot` | Empfohlen | AMS-Standard-Slot |
+| `s-auto-leveling` | Empfohlen | Checkbox Auto-Leveling |
+| `poll-1` | Empfohlen | Poll 1 s |
+| `poll-2` | Empfohlen | Poll 2 s |
+| `poll-5` | Empfohlen | Poll 5 s |
+| `s-version-label` | Empfohlen | Versionsanzeige |
+| `update-status` | Empfohlen | Update-Status-Text |
+| `btn-update-apply` | Empfohlen | Update installieren |
+| `update-changelog` | Empfohlen | Changelog-Anzeige |
+| `btn-save-settings` | Empfohlen | Speichern |
+| `btn-update-check` | Optional | Nur HTML-onclick |
+| `lbl-ip-hint` | Empfohlen | IP-Format-Warnung |
+| `modal-title-settings` | Optional | i18n |
+| `modal-sec-connection` | Optional | i18n |
+| `modal-sec-print` | Optional | i18n |
+| `modal-sec-poll` | Optional | i18n |
+| `modal-sec-version` | Optional | i18n |
+| `lbl-printer-name` … `lbl-mode-id` | Optional | i18n Labels |
+| `lbl-default-slot` | Optional | i18n |
+| `lbl-auto-leveling` | Optional | i18n |
+| `opt-slot-auto` | Optional | i18n |
+| `opt-slot-0` … `opt-slot-3` | Optional | Nur HTML |
+| `lbl-update-check` | Optional | i18n |
+| `lbl-update-apply` | Optional | i18n |
+
+**CSS-Klasse:** `.poll-btn`
+
+---
+
+## AMS-Slot-Dialog (`#slot-edit-modal`)
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `slot-edit-modal` | **Pflicht** | Modal open/close |
+| `slot-edit-title` | Empfohlen | Dialogtitel |
+| `slot-edit-color` | Empfohlen | Farbwähler |
+| `slot-edit-preview` | Empfohlen | Farbvorschau |
+| `slot-edit-mat` | Empfohlen | Material-Text |
+| `slot-mat-btns` | Empfohlen | Preset-Buttons (dynamisch) |
+| `btn-slot-edit-save` | Empfohlen | Speichern |
+| `lbl-slot-color` | Optional | i18n |
+| `lbl-slot-material` | Optional | i18n |
+
+**CSS-Klasse:** `.mat-preset-btn` (dynamisch)
+
+---
+
+## Filament-Druck-Dialog (`#filament-dialog`)
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `filament-dialog` | **Pflicht** | Modal open/close |
+| `fd-title` | Empfohlen | Dateiname im Titel |
+| `fd-slots` | Empfohlen | Kanal→Slot-Zuordnung (dynamisch) |
+
+---
+
+## Drucker hinzufügen (`#add-printer-dialog`)
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `add-printer-dialog` | **Pflicht** | Modal open/close |
+| `apd-ip` | Empfohlen | IP-Eingabe |
+| `apd-name` | Empfohlen | Name optional |
+| `apd-status` | Empfohlen | Status/Fehlermeldung |
+| `apd-confirm` | Empfohlen | Bestätigen |
+| `apd-title` | Optional | i18n |
+| `apd-lbl-ip` | Optional | i18n |
+| `apd-lbl-name` | Optional | i18n |
+| `add-printer-btn-label` | Optional | i18n |
+
+---
+
+## Drucker-Tab
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `printers-grid` | Empfohlen | Container Drucker-Karten |
+| `printers-panel-title` | Optional | i18n |
+
+---
+
+## Datei-Browser
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `store-grid` | Empfohlen | Datei-Karten (dynamisch) |
+| `store-empty` | Empfohlen | Leer-/Kein-Treffer-Hinweis |
+| `store-search` | Empfohlen | Suche |
+| `store-filter` | Empfohlen | Filter Select |
+| `store-sort` | Empfohlen | Sortierung Select |
+| `store-refresh-btn` | Optional | i18n Button-Text |
+| `store-panel-title` | Optional | i18n |
+| `sf-all`, `sf-ok`, `sf-err`, `sf-new` | Optional | i18n Optionen |
+| `ss-date`, `ss-name`, `ss-dur` | Optional | i18n Optionen |
+
+---
+
+## Konsole
+
+| ID | Pflicht | Verwendung |
+|----|---------|------------|
+| `console-log` | Empfohlen | Log-Ausgabe |
+| `log-filter` | Empfohlen | Textfilter |
+| `btn-autoscroll` | Empfohlen | Auto-Scroll Toggle |
+| `logdir-all` | Empfohlen | Filter Alle |
+| `logdir-rx` | Empfohlen | Filter RX |
+| `logdir-tx` | Empfohlen | Filter TX |
+| `ptitle-console` | Optional | i18n |
+| `btn-log-dl` | Optional | Nur HTML – Download-Link `/api/log/download` |
+
+**CSS-Klassen:** `.log-dir-btn`, `.log-topic-btn` (Topic-Buttons nutzen `data-topic`, keine festen IDs)
+
+---
+
+## IDs nur in HTML (nicht in app.js)
+
+Diese IDs sind im Default-Theme vorhanden, werden von `app.js` aber nicht per `getElementById` angesprochen:
+
+| ID | Anmerkung |
+|----|-----------|
+| `settings-btn` | Nur `onclick="openSettings()"` |
+| `printer-dropdown-btn` | Nur onclick |
+| `btn-update-check` | Nur onclick |
+| `opt-slot-0` … `opt-slot-3` | Option-Labels statisch |
+| `cam-wrap` | Layout |
+| `d-ctrl-btns` | Layout |
+| `ams-no-data` | Initial-Platzhalter, wird von JS überschrieben |
+| `ams-slot-label` | Nur inline oninput |
+| `btn-unload` | Nur HTML |
+| `btn-log-dl` | Statischer Download-Link |
+
+---
+
+## Schnell-Check vor Theme-Release
+
+- [ ] Alle vier `panel-*` vorhanden und in `.panel` gewrappt
+- [ ] `lang-btn`, `conn-btn`, `d-light-toggle`, `settings-modal`, `ams-slots` vorhanden
+- [ ] Alle Modals: `settings-modal`, `slot-edit-modal`, `filament-dialog`, `add-printer-dialog`
+- [ ] Navigation: `nb-*` / `bnb-*` für `dashboard`, `printers`, `store`, `console`
+- [ ] Dashboard-Kern: Temps, Progress, Fan, Speed, AMS-Container
+- [ ] Store: `store-grid`, `store-search`, `store-filter`, `store-sort`
+- [ ] Konsole: `console-log`, `log-filter`
+- [ ] `index.html` bindet `/kx/ui/style.css` und `/kx/ui/app.js` ein
+- [ ] Alle `onclick`-Handler aus [THEME-JS-HOOKS.md](./THEME-JS-HOOKS.md) gesetzt oder ersetzt
+
+---
+
+## Siehe auch
+
+- [THEME-JS-HOOKS.md](./THEME-JS-HOOKS.md) – alle JS-Funktionsaufrufe mit Kontext
+- Theme-Ordner: `web/themes/<name>/` mit `index.html`, `style.css`, `app.js`
+- Aktivierung: `--ui-theme <name>` oder `KX_UI_THEME=<name>`

web/themes/THEME-JS-HOOKS.md

@@ -0,0 +1,290 @@
+# KX-Bridge Theme – JavaScript-Hooks
+
+Referenz für eigenes Theme-Layout (`index.html` + gemeinsames `app.js`).
+
+**Quelle:** `default/index.html` und `default/app.js`  
+**Stand:** Theme-Struktur mit getrennten Dateien (`index.html`, `style.css`, `app.js`)
+
+---
+
+## Hinweise für Theme-Entwickler
+
+- Alle `onclick`-Handler rufen **globale Funktionen** aus `app.js` auf – Namen beibehalten oder in eigenem JS neu binden.
+- `app.js` wird unter `/kx/ui/app.js` geladen und ist pro Theme austauschbar; die Standard-Implementierung erwartet die Hooks unten.
+- Dynamisch erzeugtes HTML (AMS-Slots, Datei-Karten, Drucker-Karten) setzt zusätzliche `onclick`-Handler – siehe Abschnitt **Dynamisch aus app.js**.
+
+---
+
+## Globale / Header
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `startReadyFile()` | `#file-ready-btn` | GCode vom Slicer bereit → sofort drucken |
+| `startReadyFileWithSlots()` | `#file-slots-btn` | Druck mit AMS-Slot-Zuordnung |
+| `cancelReadyFile()` | `#file-cancel-btn` | Upload-Banner schließen |
+| `togglePrinterDropdown()` | `#printer-dropdown-btn` | Multi-Drucker-Dropdown |
+| `toggleTheme()` | Theme-Button | Hell/Dunkel (`data-theme`, localStorage) |
+| `toggleLang()` | `#lang-btn` | DE/EN umschalten |
+| `openSettings()` | `#settings-btn` | Einstellungs-Modal |
+| `toggleConnection()` | `#conn-btn` | MQTT verbinden / trennen |
+
+---
+
+## Einstellungs-Modal (`#settings-modal`)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `closeSettings()` | Overlay (Backdrop), Schließen-Button | Modal schließen |
+| `setPoll(1000)` | `#poll-1` | Status-Poll 1 s |
+| `setPoll(2000)` | `#poll-2` | Status-Poll 2 s |
+| `setPoll(5000)` | `#poll-5` | Status-Poll 5 s |
+| `checkUpdate()` | `#btn-update-check` | Update prüfen |
+| `applyUpdate()` | `#btn-update-apply` | Update installieren |
+| `saveSettings()` | `#btn-save-settings` | Config speichern → Neustart |
+
+**Ohne `onclick` in HTML:** IP-Hinweis für `#s-printer-ip` wird in `app.js` per `addEventListener('input', …)` gebunden.
+
+---
+
+## AMS-Slot bearbeiten (`#slot-edit-modal`)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `closeSlotEdit()` | Overlay, ✕ | Dialog schließen |
+| `highlightMatBtn(this.value)` | `#slot-edit-mat` `oninput` | Material-Presets hervorheben |
+| `saveSlotEdit()` | `#btn-slot-edit-save` | Farbe/Material speichern |
+
+**Inline (keine benannte Funktion):**
+
+| Code | Element | Zweck |
+|------|---------|--------|
+| `document.getElementById('slot-edit-preview').style.background=this.value` | `#slot-edit-color` | Farbvorschau |
+
+**Dynamisch aus `app.js`:**
+
+| Aufruf | Kontext |
+|--------|---------|
+| `openSlotEdit(i)` | Klick auf AMS-Kachel in `#ams-slots` |
+| `selectMatPreset('PLA'…)` | Material-Preset-Buttons in `#slot-mat-btns` |
+
+---
+
+## Navigation (Sidebar + Bottom-Nav)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `showPanel('dashboard')` | `#nb-dashboard`, `#bnb-dashboard` | Dashboard |
+| `showPanel('printers'); loadPrinterTab()` | `#nb-printers`, `#bnb-printers` | Drucker-Tab |
+| `showPanel('store'); loadStore()` | `#nb-store`, `#bnb-store` | Datei-Browser |
+| `showPanel('console'); clearLogBadge()` | `#nb-console`, `#bnb-console` | Konsole, Badge leeren |
+
+**Erforderliche Panel-IDs:** `panel-dashboard`, `panel-printers`, `panel-store`, `panel-console`  
+**Nav-IDs:** `nb-*` und `bnb-*` mit gleichem Suffix (`dashboard`, `printers`, `store`, `console`)
+
+---
+
+## Dashboard – Kamera
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `setLight()` | `#d-light-toggle` `onchange` | Drucker-Licht |
+| `toggleCam()` | `#cam-toggle-btn` | Stream starten/stoppen |
+
+Intern: `toggleCam()` → `camStart()` / `camStop()` (nur in `app.js`).
+
+---
+
+## Dashboard – Drucksteuerung
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `printAction('pause')` | `#d-btn-pause` | Pausieren |
+| `printAction('resume')` | `#d-btn-resume` | Fortsetzen |
+| `confirmCancel()` | `#d-btn-cancel` | Bestätigung → `printAction('cancel')` |
+
+---
+
+## Dashboard – Temperaturen
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `setNozzle()` | Set-Button Nozzle | Zieltemperatur Düse (`#p-nozzle-inp`) |
+| `setBed()` | Set-Button Bett | Zieltemperatur Bett (`#p-bed-inp`) |
+
+**Inline:** Aus-Button setzt Input auf `0`, dann `setNozzle()` bzw. `setBed()`.
+
+---
+
+## Dashboard – Achsensteuerung
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `move(1, 1, getStep())` | Joypad ▲ | Y+ |
+| `move(1, -1, getStep())` | Joypad ▼ | Y− |
+| `move(0, -1, getStep())` | Joypad ◀ | X− |
+| `move(0, 1, getStep())` | Joypad ▶ | X+ |
+| `move(2, 1, getStep())` | Z ▲ | Z+ |
+| `move(2, -1, getStep())` | Z ▼ | Z− |
+| `homeAll()` | Joypad ⌂, Home-All | Referenzfahrt alle Achsen |
+| `homeZ()` | Home Z | Nur Z |
+| `homeXY()` | Home XY | Nur X/Y |
+| `disableMotors()` | Motors Off | Motoren aus |
+| `setStep(this, 0.1\|1\|5\|10)` | Schrittweiten-Buttons | Jog-Schrittweite |
+| `getStep()` | in allen `move(…)` | Aktuelle Schrittweite (Hilfsfunktion) |
+
+---
+
+## Dashboard – Druckgeschwindigkeit
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `setSpeed(1)` | `#d-spd-1` | Leise |
+| `setSpeed(2)` | `#d-spd-2` | Normal |
+| `setSpeed(3)` | `#d-spd-3` | Sport |
+
+---
+
+## Dashboard – Lüfter
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `setFan()` | `#d-fan` `onchange` | Slider-Wert senden |
+| `quickFan(0\|25\|50\|75\|100)` | Schnell-Buttons | Vordefinierte Stufen |
+
+**Inline:** `#d-fan` `oninput` → `#d-fan-val` aktualisieren.
+
+---
+
+## Dashboard – AMS / Filament
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `amsFeed(1)` | Einziehen | Filament laden |
+| `amsFeed(2)` | Ausziehen | Filament entladen |
+
+**Inline:** `#ams-slot-sel` `oninput` → `#ams-slot-label` („Slot 1…4“).
+
+---
+
+## Drucker-Tab (`#panel-printers`)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `openAddPrinterDialog()` | „+ Drucker hinzufügen“ | Dialog öffnen |
+| `loadPrinterTab()` | ↻-Button | Liste neu laden |
+
+**Dynamisch:** `removePrinter(id, name)` auf Drucker-Karten in `#printers-grid`.
+
+---
+
+## Datei-Browser (`#panel-store`)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `loadStore()` | `#store-refresh-btn` | Dateiliste laden |
+| `renderStore()` | `#store-search`, `#store-filter`, `#store-sort` | Filtern/Sortieren |
+
+**Dynamisch:** `storePrint(fileId, filename)`, `storeDelete(fileId)` auf Karten in `#store-grid`.
+
+---
+
+## Konsole (`#panel-console`)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `renderLog()` | `#log-filter` `oninput`, Clear-Button | Filtern / leeren |
+| `toggleAutoScroll()` | `#btn-autoscroll` | Auto-Scroll |
+| `setLogDir('all'\|'rx'\|'tx')` | `#logdir-all`, `#logdir-rx`, `#logdir-tx` | Richtungsfilter |
+| `setLogTopic('multiColorBox'\|'print'\|'info'\|'status')` | Topic-Buttons | MQTT-Topic |
+| `onLogScroll()` | `#console-log` `onscroll` | Auto-Scroll bei manuellem Scroll deaktivieren |
+
+**Inline Clear:** `consoleLogs=[]; renderLog()` (keine eigene Funktion).
+
+---
+
+## Filament-Dialog (`#filament-dialog`)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `closeFilamentDialog()` | Overlay, Abbrechen, ✕ | Schließen |
+| `confirmFilamentPrint()` | „▶ Drucken“ | Slot-Zuordnung bestätigen |
+
+Inhalt von `#fd-slots` wird von `openFilamentDialog()` befüllt (nach `startReadyFileWithSlots()` / `storePrint()`).
+
+---
+
+## Drucker-hinzufügen-Dialog (`#add-printer-dialog`)
+
+| Aufruf | HTML-Element | Kontext |
+|--------|--------------|---------|
+| `closeAddPrinterDialog()` | Overlay, Abbrechen, ✕ | Schließen |
+| `confirmAddPrinter()` | `#apd-confirm` | IP/Name senden → Neustart |
+
+---
+
+## Modal-Backdrop-Muster
+
+Mehrere Overlays nutzen:
+
+```html
+onclick="if(event.target===this)closeSettings()"
+```
+
+| Funktion | Modal-ID |
+|----------|----------|
+| `closeSettings()` | `#settings-modal` |
+| `closeSlotEdit()` | `#slot-edit-modal` |
+| `closeFilamentDialog()` | `#filament-dialog` |
+| `closeAddPrinterDialog()` | `#add-printer-dialog` |
+
+---
+
+## Funktionen ohne HTML-Hook (automatisch)
+
+| Funktion | Wann / wofür |
+|----------|----------------|
+| `poll()` | Periodisch `/api/state` – Dashboard-Update |
+| `applyState()` | Poll-Daten ins DOM schreiben |
+| `initPrinters()` | Multi-Drucker-Liste beim Start |
+| `renderPrinterDropdown()` | Header-Dropdown |
+| `applyLang()` | Übersetzungen (Start + nach `toggleLang()`) |
+| `updateConnBtn()` | Verbindungs-Button |
+| `updateHistory()` / `drawChart()` | Temperatur-Verlauf `#d-chart` |
+| `connect()` (SSE) | Live-Server-Log |
+| `openFilamentDialog()` | Multi-Farben-Druck |
+| `openSlotEdit()` | AMS-Kacheln |
+| `storePrint()` / `storeDelete()` | Datei-Karten |
+| `removePrinter()` | Drucker-Karten |
+| `camStart()` / `camStop()` | Kamera (auch auto bei Druckstart) |
+
+---
+
+## CSS-Klassen (keine IDs, aber von app.js genutzt)
+
+| Klasse | Verwendung |
+|--------|------------|
+| `.panel` | Tab-Panels (`showPanel`) |
+| `.nav-btn`, `.bnav-btn` | Navigation active-State |
+| `.nav-text` | Sidebar-Label (i18n) |
+| `.lbl-set`, `.lbl-off` | Temp-Button-Texte |
+| `.lbl-home-z`, `.lbl-home-xy`, `.lbl-home-all`, `.lbl-disable-motors` | Home-Buttons |
+| `.lbl-step` | Schrittweiten-Label |
+| `.lbl-feed`, `.lbl-unload` | AMS-Buttons |
+| `.temp-input` | Placeholder i18n |
+| `.step-btn` | Schrittweiten-Auswahl |
+| `.poll-btn` | Poll-Intervall |
+| `.log-dir-btn`, `.log-topic-btn` | Log-Filter |
+| `.mat-preset-btn` | Slot-Material (dynamisch) |
+| `.ams-slot` | AMS-Kacheln (dynamisch) |
+
+---
+
+## Theme aktivieren
+
+```bash
+python kobrax_moonraker_bridge.py … --ui-theme default
+# oder
+KX_UI_THEME=new1 python kobrax_moonraker_bridge.py …
+```
+
+Pro Theme-Ordner: `index.html`, `style.css`, `app.js` unter `web/themes/<name>/`.

web/themes/default/index.html

@@ -0,0 +1,492 @@
+<!DOCTYPE html>
+<html lang="de" data-theme="dark">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>KX-Bridge</title>
+<link rel="stylesheet" href="/kx/ui/style.css?v=__UI_ASSETS_VER__">
+</head>
+<body>
+
+<div id="conn-error-banner" style="display:none;background:#c0392b;color:#fff;padding:10px 18px;font-size:14px;text-align:center;position:sticky;top:0;z-index:999;"></div>
+<div id="file-ready-banner" style="display:none;background:#1a6e3c;color:#fff;padding:10px 18px;font-size:14px;text-align:center;position:sticky;top:0;z-index:998;display:none;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap">
+  <span>📄 <span id="file-ready-name"></span></span>
+  <button id="file-ready-btn" onclick="startReadyFile()"
+    style="padding:5px 16px;background:#fff;color:#1a6e3c;border:none;border-radius:6px;font-weight:700;cursor:pointer;font-size:13px"></button>
+  <button id="file-slots-btn" onclick="startReadyFileWithSlots()"
+    style="padding:5px 16px;background:rgba(255,255,255,0.15);color:#fff;border:1px solid rgba(255,255,255,0.5);border-radius:6px;font-weight:700;cursor:pointer;font-size:13px"></button>
+  <button id="file-cancel-btn" onclick="cancelReadyFile()"
+    style="padding:5px 16px;background:rgba(255,255,255,0.15);color:#fff;border:1px solid rgba(255,255,255,0.5);border-radius:6px;font-weight:700;cursor:pointer;font-size:13px"></button>
+</div>
+
+<header>
+  <div class="logo">⬡ KX-Bridge</div>
+  <div style="flex:1"></div>
+  <div id="printer-dropdown-wrap" style="display:none;position:relative">
+    <button id="printer-dropdown-btn" onclick="togglePrinterDropdown()" style="background:var(--raised);border:1px solid var(--border);border-radius:6px;padding:4px 10px;color:var(--txt);cursor:pointer;font-size:13px;display:flex;align-items:center;gap:6px">
+      <span id="h-pname">Anycubic Kobra X</span><span style="opacity:.5">▾</span>
+    </button>
+    <div id="printer-dropdown-menu" style="display:none;position:absolute;top:calc(100% + 4px);right:0;background:var(--card);border:1px solid var(--border);border-radius:8px;min-width:200px;z-index:200;box-shadow:0 4px 16px #0006;overflow:hidden">
+    </div>
+  </div>
+  <div id="h-pname-single" class="hname">Anycubic Kobra X</div>
+  <span id="h-version" style="font-size:11px;opacity:.5;margin-left:6px"></span>
+  <div class="hbadge" id="h-badge"><span class="dot"></span><span id="h-state">Standby</span></div>
+  <button class="theme-btn" onclick="toggleTheme()">☀ / ☾</button>
+  <button class="theme-btn" onclick="toggleLang()" id="lang-btn">EN</button>
+  <button class="theme-btn" onclick="openSettings()" id="settings-btn" title="Einstellungen">⚙</button>
+  <button class="conn-btn disconnected" id="conn-btn" onclick="toggleConnection()">⚡ Verbinden</button>
+</header>
+
+<!-- ═══ SETTINGS MODAL ═══ -->
+<div class="modal-overlay" id="settings-modal" onclick="if(event.target===this)closeSettings()">
+  <div class="modal-box">
+    <div class="modal-header">
+      <span class="modal-title" id="modal-title-settings">Einstellungen</span>
+      <button class="modal-close" onclick="closeSettings()">✕</button>
+    </div>
+
+    <div>
+      <div class="modal-field" style="margin-bottom:12px">
+        <label id="lbl-printer-name" style="font-weight:600">Drucker-Name</label>
+        <input type="text" id="s-printer-name" placeholder="z.B. Kobra X Links">
+      </div>
+      <div class="modal-section" id="modal-sec-connection">Verbindung</div>
+      <div class="modal-field">
+        <label id="lbl-printer-ip">Drucker-IP</label>
+        <input type="text" id="s-printer-ip" placeholder="192.168.x.x">
+        <small id="lbl-ip-hint" style="color:#f80;display:none"></small>
+      </div>
+      <div class="modal-field">
+        <label id="lbl-mqtt-port">MQTT-Port</label>
+        <input type="number" id="s-mqtt-port" placeholder="9883">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-username">MQTT-Benutzername</label>
+        <input type="text" id="s-username" placeholder="userXXXXXXXX" autocomplete="new-password">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-password">MQTT-Passwort</label>
+        <input type="password" id="s-password" autocomplete="new-password">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-device-id">Device-ID</label>
+        <input type="text" id="s-device-id" placeholder="32 Hex-Zeichen">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-mode-id">Mode-ID</label>
+        <input type="text" id="s-mode-id" placeholder="20030">
+      </div>
+    </div>
+
+    <div>
+      <div class="modal-section" id="modal-sec-print">Druckeinstellungen</div>
+      <div class="modal-field">
+        <label id="lbl-default-slot">Standard-Slot (Einfarbdruck)</label>
+        <select id="s-default-slot">
+          <option value="auto" id="opt-slot-auto">Auto (alle belegten Slots)</option>
+          <option value="0" id="opt-slot-0">Slot 1</option>
+          <option value="1" id="opt-slot-1">Slot 2</option>
+          <option value="2" id="opt-slot-2">Slot 3</option>
+          <option value="3" id="opt-slot-3">Slot 4</option>
+        </select>
+      </div>
+      <div class="modal-field" style="flex-direction:row;align-items:center;gap:10px">
+        <input type="checkbox" id="s-auto-leveling" style="width:auto;margin:0">
+        <label id="lbl-auto-leveling" style="margin:0;cursor:pointer" for="s-auto-leveling">Auto-Leveling vor Druck</label>
+      </div>
+    </div>
+
+    <div>
+      <div class="modal-section" id="modal-sec-poll">Poll-Intervall</div>
+      <div class="poll-btns">
+        <button class="poll-btn" onclick="setPoll(1000)" id="poll-1">1s</button>
+        <button class="poll-btn active" onclick="setPoll(2000)" id="poll-2">2s</button>
+        <button class="poll-btn" onclick="setPoll(5000)" id="poll-5">5s</button>
+      </div>
+    </div>
+
+    <div>
+      <div class="modal-section" id="modal-sec-version">Version</div>
+      <div class="update-row">
+        <span id="s-version-label" style="font-size:13px;color:var(--txt)">–</span>
+        <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="checkUpdate()" id="btn-update-check">🔄 <span id="lbl-update-check">Auf Updates prüfen</span></button>
+      </div>
+      <div class="update-status" id="update-status" style="margin-top:6px"></div>
+      <button class="btn btn-sm btn-accent" id="btn-update-apply" style="display:none;margin-top:8px" onclick="applyUpdate()">
+        <span id="lbl-update-apply">Jetzt installieren</span>
+      </button>
+      <div id="update-changelog" style="display:none;margin-top:10px;background:var(--raised);border-radius:6px;padding:10px;font-size:11px;font-family:var(--mono);color:var(--txt2);white-space:pre-wrap;max-height:180px;overflow-y:auto;line-height:1.6"></div>
+    </div>
+
+    <button class="modal-save" onclick="saveSettings()" id="btn-save-settings">Speichern &amp; Neustart</button>
+  </div>
+</div>
+
+<!-- ═══ AMS SLOT EDIT DIALOG ═══ -->
+<div class="modal-overlay" id="slot-edit-modal" onclick="if(event.target===this)closeSlotEdit()">
+  <div class="modal-box" style="max-width:340px">
+    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:16px">
+      <span class="modal-title" id="slot-edit-title"></span>
+      <button onclick="closeSlotEdit()" style="background:none;border:none;color:var(--txt2);font-size:20px;cursor:pointer;line-height:1">✕</button>
+    </div>
+    <div style="display:flex;align-items:center;gap:16px;margin-bottom:20px">
+      <div id="slot-edit-preview" style="width:56px;height:56px;border-radius:50%;border:3px solid rgba(255,255,255,.2);flex-shrink:0"></div>
+      <div style="flex:1">
+        <div style="font-size:11px;color:var(--txt2);margin-bottom:4px" id="lbl-slot-color"></div>
+        <input type="color" id="slot-edit-color"
+          oninput="document.getElementById('slot-edit-preview').style.background=this.value"
+          style="width:100%;height:36px;border:1px solid var(--border);border-radius:6px;background:var(--raised);cursor:pointer;padding:2px">
+      </div>
+    </div>
+    <div style="margin-bottom:20px">
+      <div style="font-size:11px;color:var(--txt2);margin-bottom:6px" id="lbl-slot-material"></div>
+      <div style="display:flex;flex-wrap:wrap;gap:6px" id="slot-mat-btns">
+      </div>
+      <input type="text" id="slot-edit-mat"
+        oninput="highlightMatBtn(this.value)"
+        style="margin-top:8px;width:100%;padding:6px 10px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px;box-sizing:border-box">
+    </div>
+    <button class="modal-save" id="btn-slot-edit-save" onclick="saveSlotEdit()"></button>
+  </div>
+</div>
+
+<div class="layout">
+  <nav class="sidebar">
+    <button class="nav-btn active" onclick="showPanel('dashboard')" id="nb-dashboard">
+      <span class="nav-icon">⊞</span><span class="nav-text">Dashboard</span></button>
+    <button class="nav-btn" onclick="showPanel('printers');loadPrinterTab()" id="nb-printers">
+      <span class="nav-icon">🖨</span><span class="nav-text">Drucker</span></button>
+    <button class="nav-btn" onclick="showPanel('store');loadStore()" id="nb-store">
+      <span class="nav-icon">🗂</span><span class="nav-text">Browser</span></button>
+    <button class="nav-btn" onclick="showPanel('console');clearLogBadge()" id="nb-console">
+      <span class="nav-icon">≡</span><span class="nav-text">Konsole</span><span id="log-badge" style="display:none;margin-left:4px;background:var(--err);color:#fff;border-radius:10px;font-size:10px;padding:1px 5px;font-weight:700"></span></button>
+  </nav>
+
+  <main>
+    <!-- ═══ DASHBOARD ═══ -->
+    <div class="panel active" id="panel-dashboard">
+      <div class="grid">
+        <!-- Kamera -->
+        <div class="card" style="grid-column:1/-1">
+          <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:10px">
+            <div class="card-title" style="margin-bottom:0"><span>📷</span> <span id="d-card-cam">Kamera</span></div>
+            <div style="display:flex;align-items:center;gap:10px">
+              <span id="d-lbl-light" style="font-size:12px;color:var(--txt2)">💡 Licht</span>
+              <label class="toggle">
+                <input type="checkbox" id="d-light-toggle" onchange="setLight()">
+                <span class="toggle-track"></span>
+                <span class="toggle-thumb"></span>
+              </label>
+            </div>
+          </div>
+          <div class="cam-wrap" id="cam-wrap">
+            <div class="cam-placeholder" id="cam-placeholder"><span id="cam-placeholder-txt">📷 Kamera nicht gestartet</span></div>
+            <div class="cam-spinner" id="cam-spinner"></div>
+            <img id="cam-img" style="display:none;width:100%;height:auto" alt="Kamera">
+            <div class="cam-overlay" id="cam-overlay" style="display:none">
+              <div style="font-size:12px;color:#fff" id="cam-fname"></div>
+            </div>
+            <button class="cam-toggle" onclick="toggleCam()" id="cam-toggle-btn">▶ Kamera</button>
+          </div>
+        </div>
+
+        <!-- Fortschritt -->
+        <div class="card" style="grid-column:1/-1">
+          <div class="card-title"><span>◉</span> <span id="d-card-progress">Fortschritt</span></div>
+          <img id="d-thumbnail" src="" alt="" style="display:none;width:100%;max-height:160px;object-fit:contain;border-radius:8px;background:#111;margin-bottom:10px">
+          <div class="pct-big"><span id="d-pct">0</span><small>%</small></div>
+          <div style="display:flex;align-items:center;gap:10px;margin:8px 0">
+            <div class="progress-bar" style="flex:1;margin:0"><div class="progress-fill" id="d-pbar" style="width:0%"></div></div>
+            <div class="time-block" style="padding:6px 10px;min-width:72px;text-align:center;flex-shrink:0">
+              <div class="time-label" id="d-lbl-layers"></div>
+              <div class="time-val" style="font-size:16px" id="d-layers">–</div>
+            </div>
+          </div>
+          <div class="time-grid">
+            <div class="time-block">
+              <div class="time-label" id="d-lbl-elapsed"></div>
+              <div class="time-val" id="d-elapsed">–</div>
+            </div>
+            <div class="time-block" id="d-slicer-row" style="display:none">
+              <div class="time-label" id="d-slicer-label"></div>
+              <div class="time-val" id="d-slicer-time">–</div>
+            </div>
+            <div class="time-block" style="color:var(--acc)">
+              <div class="time-label" id="d-lbl-remain"></div>
+              <div class="time-val" id="d-remain" style="color:var(--acc)">–</div>
+            </div>
+          </div>
+          <div class="fname" id="d-fname" title="" style="margin-top:6px">–</div>
+          <div class="ctrl-btns" id="d-ctrl-btns" style="margin-top:12px">
+            <button class="btn btn-pause btn-sm" id="d-btn-pause" onclick="printAction('pause')">⏸ Pause</button>
+            <button class="btn btn-resume btn-sm" id="d-btn-resume" onclick="printAction('resume')">▶ Weiter</button>
+            <button class="btn btn-cancel btn-sm" id="d-btn-cancel" onclick="confirmCancel()">✕ Stopp</button>
+          </div>
+        </div>
+
+        <!-- Temperatursteuerung + Verlauf -->
+        <div class="card" style="grid-column:1/-1">
+          <div class="card-title"><span>⊙</span> <span id="d-card-temps">Temperaturen</span></div>
+          <div class="temp-card-inner">
+            <div class="temp-block">
+              <div class="temp-label">Nozzle</div>
+              <div class="temp-row">
+                <div class="temp-val" id="d-nt">–</div>
+                <div class="temp-unit">°C</div>
+              </div>
+              <div class="temp-target">→ <span id="d-nt-t">0</span>°C</div>
+              <div class="progress-bar" style="margin:8px 0 0">
+                <div class="progress-fill" id="d-ntbar" style="width:0%;background:linear-gradient(90deg,var(--accent2),#ffb020)"></div>
+              </div>
+              <div class="temp-edit" style="margin-top:10px">
+                <input type="number" class="temp-input" id="p-nozzle-inp" placeholder="Ziel" min="0" max="300" style="flex:1">
+                <button class="btn btn-sm btn-accent" onclick="setNozzle()"><span class="lbl-set">Set</span></button>
+                <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="document.getElementById('p-nozzle-inp').value=0;setNozzle()"><span class="lbl-off">Aus</span></button>
+              </div>
+            </div>
+            <div class="temp-block">
+              <div class="temp-label" id="d-lbl-bed">Bett</div>
+              <div class="temp-row">
+                <div class="temp-val" id="d-bt">–</div>
+                <div class="temp-unit">°C</div>
+              </div>
+              <div class="temp-target">→ <span id="d-bt-t">0</span>°C</div>
+              <div class="progress-bar" style="margin:8px 0 0">
+                <div class="progress-fill" id="d-btbar" style="width:0%;background:linear-gradient(90deg,#ff6b35,var(--warn))"></div>
+              </div>
+              <div class="temp-edit" style="margin-top:10px">
+                <input type="number" class="temp-input" id="p-bed-inp" placeholder="Ziel" min="0" max="120" style="flex:1">
+                <button class="btn btn-sm btn-accent" onclick="setBed()"><span class="lbl-set">Set</span></button>
+                <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="document.getElementById('p-bed-inp').value=0;setBed()"><span class="lbl-off">Aus</span></button>
+              </div>
+            </div>
+          </div>
+          <div style="margin-top:14px">
+            <div style="font-size:10px;color:var(--txt2);margin-bottom:4px" id="d-chart-label">Verlauf (letzte 60 Messungen)</div>
+            <canvas id="d-chart" width="800" height="120" style="width:100%;height:120px;background:var(--raised);border-radius:8px"></canvas>
+          </div>
+        </div>
+
+        <!-- Achsensteuerung -->
+        <div class="card">
+          <div class="card-title"><span>✛</span> <span id="ptitle-motion-xy">XY-Achsen</span></div>
+          <div class="joypad">
+            <div></div>
+            <button class="joy" onclick="move(1,1,getStep())" title="Y+">▲</button>
+            <div></div>
+            <button class="joy" onclick="move(0,-1,getStep())" title="X−">◀</button>
+            <button class="joy home" onclick="homeAll()" title="Home All">⌂</button>
+            <button class="joy" onclick="move(0,1,getStep())" title="X+">▶</button>
+            <div></div>
+            <button class="joy" onclick="move(1,-1,getStep())" title="Y−">▼</button>
+            <div></div>
+          </div>
+          <div class="step-btns">
+            <button class="step-btn" onclick="setStep(this,0.1)">0.1</button>
+            <button class="step-btn active" onclick="setStep(this,1)">1</button>
+            <button class="step-btn" onclick="setStep(this,5)">5</button>
+            <button class="step-btn" onclick="setStep(this,10)">10 mm</button>
+          </div>
+          <div class="home-btns">
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="homeZ()"><span class="lbl-home-z">Home Z</span></button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="homeXY()"><span class="lbl-home-xy">Home XY</span></button>
+            <button class="btn btn-sm btn-accent" onclick="homeAll()"><span class="lbl-home-all">Home All</span></button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="disableMotors()"><span class="lbl-disable-motors">Motors Off</span></button>
+          </div>
+        </div>
+        <div class="card">
+          <div class="card-title"><span>↕</span> <span id="ptitle-motion-z">Z-Achse</span></div>
+          <div class="joypad" style="grid-template-columns:52px;grid-template-rows:repeat(2,52px)">
+            <button class="joy" onclick="move(2,1,getStep())" title="Z+">▲</button>
+            <button class="joy" onclick="move(2,-1,getStep())" title="Z−">▼</button>
+          </div>
+          <div style="text-align:center;margin-top:8px;font-size:12px;color:var(--txt2)"><span class="lbl-step">Schrittweite:</span> <span id="step-display">1</span> mm</div>
+        </div>
+
+        <!-- Print Speed -->
+        <div class="card">
+          <div class="card-title"><span>🏎</span> <span id="d-card-speed">Druckgeschwindigkeit</span></div>
+          <div style="display:flex;gap:8px;margin-top:4px">
+            <button class="spd-btn" id="d-spd-1" onclick="setSpeed(1)">
+              <span class="spd-icon">🐢</span>
+              <span id="d-spd-lbl-1">Leise</span>
+            </button>
+            <button class="spd-btn spd-active" id="d-spd-2" onclick="setSpeed(2)">
+              <span class="spd-icon">⚡</span>
+              <span id="d-spd-lbl-2">Normal</span>
+            </button>
+            <button class="spd-btn" id="d-spd-3" onclick="setSpeed(3)">
+              <span class="spd-icon">🚀</span>
+              <span id="d-spd-lbl-3">Sport</span>
+            </button>
+          </div>
+          <div class="spd-bar" style="margin-top:12px">
+            <div class="spd-bar-fill" id="d-spd-bar" style="width:50%"></div>
+          </div>
+        </div>
+
+        <!-- Lüfter -->
+        <div class="card">
+          <div class="card-title"><span>🌀</span> <span id="d-card-lightfan">Lüfter</span></div>
+          <div class="slider-row">
+            <input type="range" class="slider" min="0" max="100" value="0" id="d-fan" oninput="document.getElementById('d-fan-val').textContent=this.value" onchange="setFan()">
+            <span class="slider-val" id="d-fan-val">0</span>
+          </div>
+          <div style="margin-top:12px;display:flex;gap:8px;flex-wrap:wrap">
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(0)">Aus</button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(25)">25%</button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(50)">50%</button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(75)">75%</button>
+            <button class="btn btn-sm btn-accent" onclick="quickFan(100)">100%</button>
+          </div>
+        </div>
+
+        <!-- AMS -->
+        <div class="card" style="grid-column:1/-1" id="d-ams-card">
+          <div class="card-title"><span>◫</span> <span id="d-card-ams">AMS / Filamentbox</span></div>
+          <div class="ams-slots" id="ams-slots">
+            <div style="grid-column:1/-1;text-align:center;color:var(--txt2);padding:20px" id="ams-no-data">Keine AMS-Daten empfangen</div>
+          </div>
+          <div id="ams-controls" style="margin-top:16px;display:flex;flex-direction:column;gap:10px">
+            <div style="font-size:12px;color:var(--txt2);margin-bottom:2px" id="ams-slot-lbl">Slot auswählen</div>
+            <div style="display:flex;align-items:center;gap:10px">
+              <input type="range" id="ams-slot-sel" min="0" max="3" step="1" value="0"
+                class="slider" style="flex:1"
+                oninput="document.getElementById('ams-slot-label').textContent='Slot '+(parseInt(this.value)+1)">
+              <span id="ams-slot-label" style="min-width:48px;font-size:13px;font-weight:600">Slot 1</span>
+            </div>
+            <div style="display:flex;gap:10px">
+              <button class="btn" style="flex:1" onclick="amsFeed(1)">⬇ <span class="lbl-feed">Einziehen</span></button>
+              <button id="btn-unload" class="btn" style="flex:1" onclick="amsFeed(2)">⬆ <span class="lbl-unload">Ausziehen</span></button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- ═══ CONSOLE ═══ -->
+    <!-- ═══ DRUCKER ═══ -->
+    <div class="panel" id="panel-printers">
+      <div class="card">
+        <div class="card-title" style="display:flex;justify-content:space-between;align-items:center;margin-bottom:12px">
+          <span id="printers-panel-title">🖨 Drucker</span>
+          <div style="display:flex;gap:8px">
+            <button onclick="openAddPrinterDialog()" style="font-size:12px;padding:4px 12px;background:var(--accent);border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:600">+ <span id="add-printer-btn-label">Drucker hinzufügen</span></button>
+            <button onclick="loadPrinterTab()" style="font-size:12px;padding:4px 12px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt2);cursor:pointer">↻</button>
+          </div>
+        </div>
+        <div id="printers-grid" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px"></div>
+      </div>
+    </div>
+
+    <!-- ═══ GCODE STORE ═══ -->
+    <div class="panel" id="panel-store">
+      <div class="card">
+        <div class="card-title" style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px">
+          <span id="store-panel-title">🗂 Datei-Browser</span>
+          <button id="store-refresh-btn" onclick="loadStore()" style="font-size:12px;padding:4px 12px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt2);cursor:pointer">↻ Aktualisieren</button>
+        </div>
+        <div style="display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap">
+          <input id="store-search" type="text" placeholder="🔍 Suche…" oninput="renderStore()"
+            style="flex:1;min-width:140px;padding:6px 10px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px">
+          <select id="store-filter" onchange="renderStore()"
+            style="padding:6px 8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px">
+            <option value="all" id="sf-all">Alle</option>
+            <option value="completed" id="sf-ok">✓ Erfolgreich</option>
+            <option value="failed" id="sf-err">✗ Fehler</option>
+            <option value="never" id="sf-new">Neu</option>
+          </select>
+          <select id="store-sort" onchange="renderStore()"
+            style="padding:6px 8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px">
+            <option value="date_desc" id="ss-date">↓ Datum</option>
+            <option value="name_asc" id="ss-name">A–Z Name</option>
+            <option value="duration_asc" id="ss-dur">⏱ Druckzeit</option>
+          </select>
+        </div>
+        <div id="store-empty" style="display:none;color:var(--txt2);text-align:center;padding:40px 0;font-size:14px">
+        </div>
+        <div id="store-grid" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px"></div>
+      </div>
+    </div>
+
+    <div class="panel" id="panel-console">
+      <div class="card">
+        <div class="card-title" style="display:flex;justify-content:space-between;align-items:center">
+          <span><span>≡</span> <span id="ptitle-console">Ereignis-Log</span></span>
+          <a id="btn-log-dl" href="/api/log/download" download="kx-bridge.log"
+             style="font-size:12px;padding:4px 10px;background:var(--raised);border-radius:6px;color:var(--txt2);text-decoration:none">⬇ Download</a>
+        </div>
+        <div style="display:flex;gap:6px;margin-bottom:6px;flex-wrap:wrap;align-items:center">
+          <input id="log-filter" type="text" placeholder="Filter…"
+            oninput="renderLog()"
+            style="flex:1;min-width:120px;padding:5px 10px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:12px;font-family:var(--mono)">
+          <button id="btn-autoscroll" onclick="toggleAutoScroll()"
+            style="font-size:12px;padding:5px 10px;border-radius:6px;border:1px solid var(--border);background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap">⬇ Auto</button>
+          <button onclick="consoleLogs=[];renderLog()"
+            style="font-size:12px;padding:5px 10px;border-radius:6px;border:1px solid var(--border);background:var(--raised);color:var(--txt2);cursor:pointer">✕ Clear</button>
+        </div>
+        <div style="display:flex;gap:5px;margin-bottom:8px;flex-wrap:wrap">
+          <span style="font-size:11px;color:var(--txt2);align-self:center;margin-right:2px">Dir:</span>
+          <button class="log-dir-btn active" id="logdir-all"  onclick="setLogDir('all')"  style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer"></button>
+          <button class="log-dir-btn"        id="logdir-rx"   onclick="setLogDir('rx')"   style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">RX</button>
+          <button class="log-dir-btn"        id="logdir-tx"   onclick="setLogDir('tx')"   style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">TX</button>
+          <span style="font-size:11px;color:var(--txt2);align-self:center;margin-left:6px;margin-right:2px">Topic:</span>
+          <button class="log-topic-btn" data-topic="multiColorBox" onclick="setLogTopic('multiColorBox')" style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">AMS</button>
+          <button class="log-topic-btn" data-topic="print"         onclick="setLogTopic('print')"         style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">print</button>
+          <button class="log-topic-btn" data-topic="info"          onclick="setLogTopic('info')"          style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">info</button>
+          <button class="log-topic-btn" data-topic="status"        onclick="setLogTopic('status')"        style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">status</button>
+        </div>
+        <div class="console" id="console-log" style="height:calc(100vh - 260px);min-height:160px" onscroll="onLogScroll()"></div>
+      </div>
+    </div>
+  </main>
+</div>
+
+<nav class="bottom-nav">
+  <button class="bnav-btn active" onclick="showPanel('dashboard')" id="bnb-dashboard"><span class="bnav-icon">⊞</span>Dashboard</button>
+  <button class="bnav-btn" onclick="showPanel('printers');loadPrinterTab()" id="bnb-printers"><span class="bnav-icon">🖨</span>Drucker</button>
+  <button class="bnav-btn" onclick="showPanel('store');loadStore()" id="bnb-store"><span class="bnav-icon">🗂</span>Browser</button>
+  <button class="bnav-btn" onclick="showPanel('console');clearLogBadge()" id="bnb-console"><span class="bnav-icon">≡</span>Log<span id="log-badge-bot" style="display:none;margin-left:3px;background:var(--err);color:#fff;border-radius:10px;font-size:10px;padding:1px 4px;font-weight:700"></span></button>
+</nav>
+
+<!-- Filament-Slot-Dialog -->
+<div class="modal-overlay" id="filament-dialog" onclick="if(event.target===this)closeFilamentDialog()">
+  <div class="modal-box" style="max-width:380px;width:100%">
+    <div class="modal-header" style="margin-bottom:14px">
+      <span class="modal-title" id="fd-title" style="font-size:14px;word-break:break-all"></span>
+      <button onclick="closeFilamentDialog()" style="background:none;border:none;font-size:18px;cursor:pointer;color:var(--txt2)">✕</button>
+    </div>
+    <p style="font-size:12px;color:var(--txt2);margin-bottom:10px">GCode-Kanal → AMS-Slot zuweisen:</p>
+    <div id="fd-slots" style="display:flex;flex-direction:column;gap:8px;margin-bottom:16px"></div>
+    <div style="display:flex;gap:8px;justify-content:flex-end">
+      <button onclick="closeFilamentDialog()" style="padding:8px 16px;background:var(--raised);border:1px solid var(--border);border-radius:8px;color:var(--txt);cursor:pointer">Abbrechen</button>
+      <button onclick="confirmFilamentPrint()" style="padding:8px 18px;background:var(--accent);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600">▶ Drucken</button>
+    </div>
+  </div>
+</div>
+<!-- Drucker-hinzufügen-Dialog -->
+<div class="modal-overlay" id="add-printer-dialog" onclick="if(event.target===this)closeAddPrinterDialog()">
+  <div class="modal-box" style="max-width:380px;width:100%">
+    <div class="modal-header" style="margin-bottom:14px">
+      <span class="modal-title" id="apd-title">Drucker hinzufügen</span>
+      <button onclick="closeAddPrinterDialog()" style="background:none;border:none;font-size:18px;cursor:pointer;color:var(--txt2)">✕</button>
+    </div>
+    <label id="apd-lbl-ip" style="display:block;font-size:12px;color:var(--txt2);margin-bottom:4px">Drucker-IP</label>
+    <input type="text" id="apd-ip" placeholder="192.168.1.100" style="width:100%;box-sizing:border-box;padding:8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);margin-bottom:10px">
+    <label id="apd-lbl-name" style="display:block;font-size:12px;color:var(--txt2);margin-bottom:4px">Name (optional)</label>
+    <input type="text" id="apd-name" placeholder="z.B. Kobra X Wohnzimmer" style="width:100%;box-sizing:border-box;padding:8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);margin-bottom:6px">
+    <div id="apd-status" style="font-size:12px;margin:8px 0;min-height:16px;color:var(--txt2)"></div>
+    <div style="display:flex;gap:8px;justify-content:flex-end">
+      <button onclick="closeAddPrinterDialog()" style="padding:8px 16px;background:var(--raised);border:1px solid var(--border);border-radius:8px;color:var(--txt);cursor:pointer">Abbrechen</button>
+      <button id="apd-confirm" onclick="confirmAddPrinter()" style="padding:8px 18px;background:var(--accent);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600">Hinzufügen</button>
+    </div>
+  </div>
+</div>
+
+<footer style="text-align:center;padding:12px;font-size:11px;color:var(--txt2);border-top:1px solid var(--border);margin-top:auto">
+  &copy; ViewIT 2026
+</footer>
+<script src="/kx/ui/app.js?v=__UI_ASSETS_VER__"></script>
+</body>
+</html>

web/themes/default/style.css

@@ -0,0 +1,277 @@
+:root{
+  --bg:#1a1a1f;--card:#24242c;--raised:#2e2e3a;--border:#3a3a4a;
+  --txt:#f0f0f5;--txt2:#8888aa;--accent:#00c8ff;--accent2:#ff6b35;
+  --ok:#4cde80;--err:#ff4d6d;--warn:#ffb020;
+  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
+  --mono:"JetBrains Mono","Fira Code",monospace;
+}
+[data-theme=light]{
+  --bg:#f0f0f5;--card:#fff;--raised:#e8e8f0;--border:#d0d0e0;
+  --txt:#1a1a2e;--txt2:#666680;
+}
+*{box-sizing:border-box;margin:0;padding:0}
+body{background:var(--bg);color:var(--txt);font-family:var(--font);font-size:14px;min-height:100vh;display:flex;flex-direction:column}
+a{color:var(--accent);text-decoration:none}
+
+/* ── HEADER ── */
+header{background:var(--card);border-bottom:1px solid var(--border);
+  display:flex;align-items:center;gap:12px;padding:0 20px;height:52px;
+  position:sticky;top:0;z-index:100}
+.logo{font-size:18px;font-weight:700;color:var(--accent);letter-spacing:-.02em}
+.hname{font-size:13px;color:var(--txt2)}
+.hbadge{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;
+  padding:4px 10px;border-radius:20px;background:var(--raised);color:var(--txt2);
+  text-transform:uppercase;letter-spacing:.04em}
+.hbadge.printing{background:#0d2d1a;color:var(--ok)}
+.hbadge.complete{background:#0d1f38;color:#60b0ff}
+.hbadge.error{background:#2d0d0d;color:var(--err)}
+.hbadge .dot{width:7px;height:7px;border-radius:50%;background:currentColor}
+.hbadge.printing .dot{animation:pulse 1.4s infinite}
+@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
+.theme-btn{background:none;border:1px solid var(--border);color:var(--txt2);
+  border-radius:8px;padding:6px 10px;cursor:pointer;font-size:13px;transition:.15s}
+.theme-btn:hover{border-color:var(--accent);color:var(--accent)}
+.conn-btn{border-radius:8px;padding:6px 12px;cursor:pointer;font-size:13px;
+  font-weight:600;border:none;transition:.15s}
+.conn-btn.disconnected{background:var(--accent);color:#fff}
+.conn-btn.disconnected:hover{opacity:.85}
+.conn-btn.connected{background:transparent;border:1px solid var(--border);color:var(--txt2)}
+.conn-btn.connected:hover{border-color:#e05;color:#e05}
+
+/* ── LAYOUT ── */
+.layout{display:flex;flex:1;min-height:0}
+nav.sidebar{width:200px;background:var(--card);border-right:1px solid var(--border);
+  display:flex;flex-direction:column;padding:12px 8px;gap:2px;flex-shrink:0}
+.nav-btn{background:none;border:none;color:var(--txt2);text-align:left;
+  padding:9px 12px;border-radius:8px;cursor:pointer;font-size:13px;
+  display:flex;align-items:center;gap:10px;transition:.12s;width:100%}
+.nav-btn:hover{background:var(--raised);color:var(--txt)}
+.nav-btn.active{background:var(--raised);color:var(--accent)}
+.nav-icon{font-size:16px;width:20px;text-align:center}
+main{flex:1;overflow-y:auto;padding:20px}
+.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
+
+/* ── CARD ── */
+.card{background:var(--card);border:1px solid var(--border);border-radius:12px;
+  padding:18px;transition:box-shadow .15s,transform .15s}
+.card:hover{box-shadow:0 4px 20px rgba(0,0,0,.3);transform:translateY(-1px)}
+.card-title{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--txt2);
+  margin-bottom:14px;display:flex;align-items:center;gap:8px}
+.card-title span{font-size:14px}
+
+/* ── HERO ── */
+.hero{grid-column:1/-1;display:grid;grid-template-columns:1fr 320px;gap:16px}
+@media(max-width:900px){.hero{grid-template-columns:1fr}}
+.cam-wrap{background:#0a0a0e;border-radius:10px;overflow:hidden;
+  min-height:180px;max-height:320px;display:flex;align-items:center;justify-content:center;position:relative}
+.cam-wrap img,.cam-wrap video{width:100%;max-height:320px;height:auto;display:block;object-fit:contain}
+.cam-placeholder{color:var(--txt2);font-size:13px;text-align:center;padding:20px}
+@keyframes spin{to{transform:rotate(360deg)}}
+.cam-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.15);
+  border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;display:none}
+.cam-overlay{position:absolute;bottom:0;left:0;right:0;
+  background:linear-gradient(transparent,rgba(0,0,0,.75));padding:14px}
+.cam-toggle{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.5);
+  border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:8px;
+  padding:6px 10px;cursor:pointer;font-size:12px;backdrop-filter:blur(4px)}
+.cam-toggle:hover{background:rgba(0,0,0,.7)}
+
+/* ── PROGRESS ── */
+.hero-info{display:flex;flex-direction:column;gap:12px}
+.pct-big{font-size:52px;font-weight:700;line-height:1;color:var(--txt)}
+.pct-big small{font-size:20px;font-weight:400;color:var(--txt2)}
+.progress-bar{height:8px;background:var(--raised);border-radius:4px;overflow:hidden;margin:4px 0}
+.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),#0080cc);
+  border-radius:4px;transition:width .6s ease}
+.meta-row{display:flex;justify-content:space-between;font-size:12px;color:var(--txt2)}
+.layer-badge{background:var(--raised);border-radius:6px;padding:4px 8px;
+  font-family:var(--mono);font-size:12px;color:var(--txt)}
+.fname{font-size:12px;color:var(--txt2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
+  background:var(--raised);border-radius:6px;padding:6px 8px}
+
+/* ── PRINT CONTROLS ── */
+.ctrl-btns{display:flex;gap:8px;flex-wrap:wrap}
+.btn{border:none;border-radius:8px;padding:10px 16px;font-size:13px;font-weight:600;
+  cursor:pointer;transition:opacity .15s,transform .1s;white-space:nowrap}
+.btn:hover{opacity:.85;transform:translateY(-1px)}
+.btn:active{transform:translateY(0)}
+.btn-start{background:var(--ok);color:#0d2010}
+.btn-pause{background:var(--raised);color:var(--txt);border:1px solid var(--border)}
+.btn-resume{background:#0d2d1a;color:var(--ok);border:1px solid var(--ok)}
+.btn-cancel{background:#2d0d0d;color:var(--err);border:1px solid var(--err)}
+.btn-accent{background:var(--accent);color:#001a24}
+.btn-sm{padding:7px 12px;font-size:12px}
+.spd-btn{flex:1;border:1.5px solid var(--border);background:var(--raised);color:var(--txt);
+  border-radius:10px;padding:14px 8px;font-size:13px;font-weight:600;cursor:pointer;
+  transition:all .15s;display:flex;flex-direction:column;align-items:center;gap:4px}
+.spd-btn:hover{border-color:var(--accent);color:var(--accent)}
+.spd-btn.spd-active{border-color:var(--accent);background:rgba(0,200,255,.12);color:var(--accent)}
+.spd-btn .spd-icon{font-size:22px}
+.spd-bar{height:4px;border-radius:2px;background:var(--border);margin-top:10px;overflow:hidden}
+.spd-bar-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:width .3s}
+
+/* ── TIME CARDS ── */
+.time-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:8px}
+.time-block{background:var(--raised);border-radius:10px;padding:10px 12px}
+.time-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--txt2);margin-bottom:4px}
+.time-val{font-size:20px;font-weight:700;font-family:var(--mono);color:var(--txt)}
+/* ── TEMPS ── */
+.temp-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
+.temp-card-inner{display:grid;grid-template-columns:1fr 1fr;gap:12px}
+.temp-block{background:var(--raised);border-radius:10px;padding:14px;position:relative}
+.temp-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--txt2);margin-bottom:6px}
+.temp-row{display:flex;align-items:baseline;gap:6px}
+.temp-val{font-size:30px;font-weight:700;font-family:var(--mono)}
+.temp-unit{font-size:14px;color:var(--txt2)}
+.temp-target{font-size:11px;color:var(--txt2);margin-top:2px}
+.temp-arc{position:absolute;top:12px;right:12px}
+.temp-edit{display:flex;gap:6px;margin-top:10px}
+.temp-input{background:var(--bg);border:1px solid var(--border);color:var(--txt);
+  border-radius:6px;padding:5px 8px;font-size:13px;font-family:var(--mono);width:70px}
+.temp-input:focus{outline:none;border-color:var(--accent)}
+.chart-wrap{margin-top:12px}
+canvas.tchart{width:100%;height:60px;display:block;border-radius:6px;background:var(--raised)}
+
+/* ── MOTION ── */
+.joypad{display:grid;grid-template-columns:repeat(3,52px);
+  grid-template-rows:repeat(3,52px);gap:6px;justify-content:center;margin:8px auto}
+.joy{background:var(--raised);border:1px solid var(--border);color:var(--txt);
+  border-radius:10px;font-size:18px;cursor:pointer;transition:.12s;
+  display:flex;align-items:center;justify-content:center}
+.joy:hover{background:var(--accent);color:#001a24;border-color:var(--accent)}
+.joy:active{transform:scale(.93)}
+.joy.home{font-size:14px;background:var(--bg)}
+.step-btns{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:10px}
+.step-btn{background:var(--raised);border:1px solid var(--border);color:var(--txt2);
+  border-radius:6px;padding:5px 10px;font-size:12px;cursor:pointer;transition:.12s}
+.step-btn.active,.step-btn:hover{background:var(--accent);color:#001a24;border-color:var(--accent)}
+.home-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;justify-content:center}
+
+/* ── AMS ── */
+.ams-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
+.ams-slot{background:var(--raised);border-radius:10px;padding:10px;text-align:center;
+  border:2px solid transparent;transition:.2s;position:relative}
+.ams-slot.active{border-color:var(--slot-color,var(--accent));
+  box-shadow:0 0 12px rgba(var(--slot-rgb,0,200,255),.3)}
+.slot-circle{width:36px;height:36px;border-radius:50%;margin:0 auto 6px;border:2px solid rgba(255,255,255,.15)}
+.slot-label{font-size:11px;color:var(--txt2);font-family:var(--mono)}
+.slot-material{font-size:12px;font-weight:600;margin-bottom:2px}
+
+/* ── LIGHT + FAN ── */
+.toggle-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
+.toggle-label{font-size:13px;font-weight:600}
+.toggle{position:relative;width:44px;height:24px;cursor:pointer}
+.toggle input{opacity:0;width:0;height:0;position:absolute}
+.toggle-track{width:44px;height:24px;background:var(--raised);border-radius:12px;
+  border:1px solid var(--border);transition:.25s;display:block}
+.toggle input:checked+.toggle-track{background:var(--accent)}
+.toggle-thumb{position:absolute;top:3px;left:3px;width:18px;height:18px;
+  background:#fff;border-radius:50%;transition:.25s;pointer-events:none}
+.toggle input:checked~.toggle-thumb{transform:translateX(20px)}
+.slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}
+.slider-label{font-size:12px;color:var(--txt2);width:80px}
+.slider{flex:1;-webkit-appearance:none;height:4px;border-radius:2px;
+  background:var(--raised);outline:none;cursor:pointer}
+.slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;
+  border-radius:50%;background:var(--accent);cursor:pointer;transition:.1s}
+.slider::-webkit-slider-thumb:hover{transform:scale(1.2)}
+.slider-val{font-family:var(--mono);font-size:12px;color:var(--txt);width:30px;text-align:right}
+
+/* ── CONSOLE ── */
+.console{background:#0a0a0e;border-radius:8px;padding:10px;font-family:var(--mono);
+  font-size:11px;color:#8888aa;overflow-y:auto;line-height:1.6}
+.console .ts{color:#444;margin-right:6px}
+.console .msg-info{color:#8888aa}
+.console .msg-ok{color:var(--ok)}
+.console .msg-err{color:var(--err)}
+.console .msg-warn{color:var(--warn)}
+
+/* ── PANELS ── */
+.panel{display:none}
+.panel.active{display:block}
+
+/* ── MODAL ── */
+.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);
+  z-index:200;align-items:center;justify-content:center;padding:16px}
+.modal-overlay.open{display:flex}
+.modal-box{background:var(--card);border:1px solid var(--border);border-radius:14px;
+  width:100%;max-width:480px;max-height:90vh;overflow-y:auto;padding:24px;
+  display:flex;flex-direction:column;gap:18px}
+.modal-header{display:flex;align-items:center;justify-content:space-between}
+.modal-title{font-size:15px;font-weight:700;color:var(--txt)}
+.modal-close{background:none;border:none;color:var(--txt2);font-size:20px;
+  cursor:pointer;padding:4px 8px;border-radius:6px}
+.modal-close:hover{background:var(--raised);color:var(--txt)}
+.modal-section{font-size:10px;text-transform:uppercase;letter-spacing:.1em;
+  color:var(--txt2);margin-bottom:6px;margin-top:4px}
+.modal-field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
+.modal-field label{font-size:12px;color:var(--txt2)}
+.modal-field input{background:var(--raised);border:1px solid var(--border);
+  border-radius:7px;color:var(--txt);padding:7px 10px;font-size:13px;width:100%}
+.modal-field input:focus{outline:none;border-color:var(--accent)}
+.poll-btns{display:flex;gap:8px}
+.poll-btn{flex:1;padding:7px;background:var(--raised);border:1px solid var(--border);
+  border-radius:7px;color:var(--txt2);cursor:pointer;font-size:13px;transition:all .15s}
+.poll-btn.active{background:var(--accent);border-color:var(--accent);color:#000;font-weight:600}
+.update-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
+.update-status{font-size:12px;color:var(--txt2);flex:1;min-width:0}
+.modal-save{width:100%;padding:10px;background:var(--accent);border:none;
+  border-radius:8px;color:#000;font-weight:700;font-size:14px;cursor:pointer;margin-top:4px}
+.modal-save:hover{opacity:.88}
+
+/* ── BOTTOM NAV (mobile) ── */
+nav.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;
+  background:var(--card);border-top:1px solid var(--border);
+  justify-content:space-around;padding:8px 0 max(8px,env(safe-area-inset-bottom))}
+.bnav-btn{background:none;border:none;color:var(--txt2);display:flex;
+  flex-direction:column;align-items:center;gap:3px;cursor:pointer;font-size:10px;padding:4px 8px}
+.bnav-btn.active{color:var(--accent)}
+.bnav-icon{font-size:20px}
+
+/* ── Tablet (769–1100px): schmale Sidebar ── */
+@media(min-width:769px) and (max-width:1100px){
+  nav.sidebar{width:52px;padding:12px 4px}
+  .nav-btn .nav-text{display:none}
+  .nav-btn{justify-content:center;padding:10px}
+  .nav-icon{width:auto}
+  .grid{grid-template-columns:repeat(2,1fr)}
+  .hero{grid-template-columns:1fr}
+}
+
+/* ── Mobile (≤768px): Bottom-Nav, 1-Spalte ── */
+@media(max-width:768px){
+  nav.sidebar{display:none}
+  nav.bottom-nav{display:flex}
+  main{padding:10px;padding-bottom:72px}
+
+  /* Header kompakt */
+  header{padding:0 12px;gap:8px}
+  .hname{display:none}
+
+  /* 1-Spalten-Grid, full-width spans funktionieren weiterhin */
+  .grid{grid-template-columns:1fr;gap:12px}
+
+  /* Hero: Kamera über Info */
+  .hero{grid-template-columns:1fr}
+  .cam-wrap{max-height:220px}
+
+  /* Temp-Pair und Temp-Card übereinander */
+  .temp-pair{grid-template-columns:1fr}
+  .temp-card-inner{grid-template-columns:1fr}
+
+  /* AMS: 2 Spalten */
+  .ams-slots{grid-template-columns:repeat(2,1fr)}
+
+  /* Joypad etwas kleiner */
+  .joypad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:5px}
+  .joy{font-size:16px}
+
+  /* Buttons größere Touch-Targets */
+  .btn{padding:10px 14px;font-size:13px}
+  .btn-sm{padding:8px 12px}
+  .step-btn{padding:8px 12px;font-size:13px}
+
+  /* Modal vollbreite auf kleinen Screens */
+  .modal-box{padding:16px;border-radius:10px}
+  .poll-btns{gap:6px}
+}

web/themes/new1/index.html

@@ -0,0 +1,492 @@
+<!DOCTYPE html>
+<html lang="de" data-theme="dark">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>KX-Bridge</title>
+<link rel="stylesheet" href="/kx/ui/style.css?v=__UI_ASSETS_VER__">
+</head>
+<body>
+
+<div id="conn-error-banner" style="display:none;background:#c0392b;color:#fff;padding:10px 18px;font-size:14px;text-align:center;position:sticky;top:0;z-index:999;"></div>
+<div id="file-ready-banner" style="display:none;background:#1a6e3c;color:#fff;padding:10px 18px;font-size:14px;text-align:center;position:sticky;top:0;z-index:998;display:none;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap">
+  <span>📄 <span id="file-ready-name"></span></span>
+  <button id="file-ready-btn" onclick="startReadyFile()"
+    style="padding:5px 16px;background:#fff;color:#1a6e3c;border:none;border-radius:6px;font-weight:700;cursor:pointer;font-size:13px"></button>
+  <button id="file-slots-btn" onclick="startReadyFileWithSlots()"
+    style="padding:5px 16px;background:rgba(255,255,255,0.15);color:#fff;border:1px solid rgba(255,255,255,0.5);border-radius:6px;font-weight:700;cursor:pointer;font-size:13px"></button>
+  <button id="file-cancel-btn" onclick="cancelReadyFile()"
+    style="padding:5px 16px;background:rgba(255,255,255,0.15);color:#fff;border:1px solid rgba(255,255,255,0.5);border-radius:6px;font-weight:700;cursor:pointer;font-size:13px"></button>
+</div>
+
+<header>
+  <div class="logo">⬡ KX-Bridge (new1)</div>
+  <div style="flex:1"></div>
+  <div id="printer-dropdown-wrap" style="display:none;position:relative">
+    <button id="printer-dropdown-btn" onclick="togglePrinterDropdown()" style="background:var(--raised);border:1px solid var(--border);border-radius:6px;padding:4px 10px;color:var(--txt);cursor:pointer;font-size:13px;display:flex;align-items:center;gap:6px">
+      <span id="h-pname">Anycubic Kobra X</span><span style="opacity:.5">▾</span>
+    </button>
+    <div id="printer-dropdown-menu" style="display:none;position:absolute;top:calc(100% + 4px);right:0;background:var(--card);border:1px solid var(--border);border-radius:8px;min-width:200px;z-index:200;box-shadow:0 4px 16px #0006;overflow:hidden">
+    </div>
+  </div>
+  <div id="h-pname-single" class="hname">Anycubic Kobra X</div>
+  <span id="h-version" style="font-size:11px;opacity:.5;margin-left:6px"></span>
+  <div class="hbadge" id="h-badge"><span class="dot"></span><span id="h-state">Standby</span></div>
+  <button class="theme-btn" onclick="toggleTheme()">☀ / ☾</button>
+  <button class="theme-btn" onclick="toggleLang()" id="lang-btn">EN</button>
+  <button class="theme-btn" onclick="openSettings()" id="settings-btn" title="Einstellungen">⚙</button>
+  <button class="conn-btn disconnected" id="conn-btn" onclick="toggleConnection()">⚡ Verbinden</button>
+</header>
+
+<!-- ═══ SETTINGS MODAL ═══ -->
+<div class="modal-overlay" id="settings-modal" onclick="if(event.target===this)closeSettings()">
+  <div class="modal-box">
+    <div class="modal-header">
+      <span class="modal-title" id="modal-title-settings">Einstellungen</span>
+      <button class="modal-close" onclick="closeSettings()">✕</button>
+    </div>
+
+    <div>
+      <div class="modal-field" style="margin-bottom:12px">
+        <label id="lbl-printer-name" style="font-weight:600">Drucker-Name</label>
+        <input type="text" id="s-printer-name" placeholder="z.B. Kobra X Links">
+      </div>
+      <div class="modal-section" id="modal-sec-connection">Verbindung</div>
+      <div class="modal-field">
+        <label id="lbl-printer-ip">Drucker-IP</label>
+        <input type="text" id="s-printer-ip" placeholder="192.168.x.x">
+        <small id="lbl-ip-hint" style="color:#f80;display:none"></small>
+      </div>
+      <div class="modal-field">
+        <label id="lbl-mqtt-port">MQTT-Port</label>
+        <input type="number" id="s-mqtt-port" placeholder="9883">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-username">MQTT-Benutzername</label>
+        <input type="text" id="s-username" placeholder="userXXXXXXXX" autocomplete="new-password">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-password">MQTT-Passwort</label>
+        <input type="password" id="s-password" autocomplete="new-password">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-device-id">Device-ID</label>
+        <input type="text" id="s-device-id" placeholder="32 Hex-Zeichen">
+      </div>
+      <div class="modal-field">
+        <label id="lbl-mode-id">Mode-ID</label>
+        <input type="text" id="s-mode-id" placeholder="20030">
+      </div>
+    </div>
+
+    <div>
+      <div class="modal-section" id="modal-sec-print">Druckeinstellungen</div>
+      <div class="modal-field">
+        <label id="lbl-default-slot">Standard-Slot (Einfarbdruck)</label>
+        <select id="s-default-slot">
+          <option value="auto" id="opt-slot-auto">Auto (alle belegten Slots)</option>
+          <option value="0" id="opt-slot-0">Slot 1</option>
+          <option value="1" id="opt-slot-1">Slot 2</option>
+          <option value="2" id="opt-slot-2">Slot 3</option>
+          <option value="3" id="opt-slot-3">Slot 4</option>
+        </select>
+      </div>
+      <div class="modal-field" style="flex-direction:row;align-items:center;gap:10px">
+        <input type="checkbox" id="s-auto-leveling" style="width:auto;margin:0">
+        <label id="lbl-auto-leveling" style="margin:0;cursor:pointer" for="s-auto-leveling">Auto-Leveling vor Druck</label>
+      </div>
+    </div>
+
+    <div>
+      <div class="modal-section" id="modal-sec-poll">Poll-Intervall</div>
+      <div class="poll-btns">
+        <button class="poll-btn" onclick="setPoll(1000)" id="poll-1">1s</button>
+        <button class="poll-btn active" onclick="setPoll(2000)" id="poll-2">2s</button>
+        <button class="poll-btn" onclick="setPoll(5000)" id="poll-5">5s</button>
+      </div>
+    </div>
+
+    <div>
+      <div class="modal-section" id="modal-sec-version">Version</div>
+      <div class="update-row">
+        <span id="s-version-label" style="font-size:13px;color:var(--txt)">–</span>
+        <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="checkUpdate()" id="btn-update-check">🔄 <span id="lbl-update-check">Auf Updates prüfen</span></button>
+      </div>
+      <div class="update-status" id="update-status" style="margin-top:6px"></div>
+      <button class="btn btn-sm btn-accent" id="btn-update-apply" style="display:none;margin-top:8px" onclick="applyUpdate()">
+        <span id="lbl-update-apply">Jetzt installieren</span>
+      </button>
+      <div id="update-changelog" style="display:none;margin-top:10px;background:var(--raised);border-radius:6px;padding:10px;font-size:11px;font-family:var(--mono);color:var(--txt2);white-space:pre-wrap;max-height:180px;overflow-y:auto;line-height:1.6"></div>
+    </div>
+
+    <button class="modal-save" onclick="saveSettings()" id="btn-save-settings">Speichern &amp; Neustart</button>
+  </div>
+</div>
+
+<!-- ═══ AMS SLOT EDIT DIALOG ═══ -->
+<div class="modal-overlay" id="slot-edit-modal" onclick="if(event.target===this)closeSlotEdit()">
+  <div class="modal-box" style="max-width:340px">
+    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:16px">
+      <span class="modal-title" id="slot-edit-title"></span>
+      <button onclick="closeSlotEdit()" style="background:none;border:none;color:var(--txt2);font-size:20px;cursor:pointer;line-height:1">✕</button>
+    </div>
+    <div style="display:flex;align-items:center;gap:16px;margin-bottom:20px">
+      <div id="slot-edit-preview" style="width:56px;height:56px;border-radius:50%;border:3px solid rgba(255,255,255,.2);flex-shrink:0"></div>
+      <div style="flex:1">
+        <div style="font-size:11px;color:var(--txt2);margin-bottom:4px" id="lbl-slot-color"></div>
+        <input type="color" id="slot-edit-color"
+          oninput="document.getElementById('slot-edit-preview').style.background=this.value"
+          style="width:100%;height:36px;border:1px solid var(--border);border-radius:6px;background:var(--raised);cursor:pointer;padding:2px">
+      </div>
+    </div>
+    <div style="margin-bottom:20px">
+      <div style="font-size:11px;color:var(--txt2);margin-bottom:6px" id="lbl-slot-material"></div>
+      <div style="display:flex;flex-wrap:wrap;gap:6px" id="slot-mat-btns">
+      </div>
+      <input type="text" id="slot-edit-mat"
+        oninput="highlightMatBtn(this.value)"
+        style="margin-top:8px;width:100%;padding:6px 10px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px;box-sizing:border-box">
+    </div>
+    <button class="modal-save" id="btn-slot-edit-save" onclick="saveSlotEdit()"></button>
+  </div>
+</div>
+
+<div class="layout">
+  <nav class="sidebar">
+    <button class="nav-btn active" onclick="showPanel('dashboard')" id="nb-dashboard">
+      <span class="nav-icon">⊞</span><span class="nav-text">Dashboard</span></button>
+    <button class="nav-btn" onclick="showPanel('printers');loadPrinterTab()" id="nb-printers">
+      <span class="nav-icon">🖨</span><span class="nav-text">Drucker</span></button>
+    <button class="nav-btn" onclick="showPanel('store');loadStore()" id="nb-store">
+      <span class="nav-icon">🗂</span><span class="nav-text">Browser</span></button>
+    <button class="nav-btn" onclick="showPanel('console');clearLogBadge()" id="nb-console">
+      <span class="nav-icon">≡</span><span class="nav-text">Konsole</span><span id="log-badge" style="display:none;margin-left:4px;background:var(--err);color:#fff;border-radius:10px;font-size:10px;padding:1px 5px;font-weight:700"></span></button>
+  </nav>
+
+  <main>
+    <!-- ═══ DASHBOARD ═══ -->
+    <div class="panel active" id="panel-dashboard">
+      <div class="grid">
+        <!-- Kamera -->
+        <div class="card" style="grid-column:1/-1">
+          <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:10px">
+            <div class="card-title" style="margin-bottom:0"><span>📷</span> <span id="d-card-cam">Kamera</span></div>
+            <div style="display:flex;align-items:center;gap:10px">
+              <span id="d-lbl-light" style="font-size:12px;color:var(--txt2)">💡 Licht</span>
+              <label class="toggle">
+                <input type="checkbox" id="d-light-toggle" onchange="setLight()">
+                <span class="toggle-track"></span>
+                <span class="toggle-thumb"></span>
+              </label>
+            </div>
+          </div>
+          <div class="cam-wrap" id="cam-wrap">
+            <div class="cam-placeholder" id="cam-placeholder"><span id="cam-placeholder-txt">📷 Kamera nicht gestartet</span></div>
+            <div class="cam-spinner" id="cam-spinner"></div>
+            <img id="cam-img" style="display:none;width:100%;height:auto" alt="Kamera">
+            <div class="cam-overlay" id="cam-overlay" style="display:none">
+              <div style="font-size:12px;color:#fff" id="cam-fname"></div>
+            </div>
+            <button class="cam-toggle" onclick="toggleCam()" id="cam-toggle-btn">▶ Kamera</button>
+          </div>
+        </div>
+
+        <!-- Fortschritt -->
+        <div class="card" style="grid-column:1/-1">
+          <div class="card-title"><span>◉</span> <span id="d-card-progress">Fortschritt</span></div>
+          <img id="d-thumbnail" src="" alt="" style="display:none;width:100%;max-height:160px;object-fit:contain;border-radius:8px;background:#111;margin-bottom:10px">
+          <div class="pct-big"><span id="d-pct">0</span><small>%</small></div>
+          <div style="display:flex;align-items:center;gap:10px;margin:8px 0">
+            <div class="progress-bar" style="flex:1;margin:0"><div class="progress-fill" id="d-pbar" style="width:0%"></div></div>
+            <div class="time-block" style="padding:6px 10px;min-width:72px;text-align:center;flex-shrink:0">
+              <div class="time-label" id="d-lbl-layers"></div>
+              <div class="time-val" style="font-size:16px" id="d-layers">–</div>
+            </div>
+          </div>
+          <div class="time-grid">
+            <div class="time-block">
+              <div class="time-label" id="d-lbl-elapsed"></div>
+              <div class="time-val" id="d-elapsed">–</div>
+            </div>
+            <div class="time-block" id="d-slicer-row" style="display:none">
+              <div class="time-label" id="d-slicer-label"></div>
+              <div class="time-val" id="d-slicer-time">–</div>
+            </div>
+            <div class="time-block" style="color:var(--acc)">
+              <div class="time-label" id="d-lbl-remain"></div>
+              <div class="time-val" id="d-remain" style="color:var(--acc)">–</div>
+            </div>
+          </div>
+          <div class="fname" id="d-fname" title="" style="margin-top:6px">–</div>
+          <div class="ctrl-btns" id="d-ctrl-btns" style="margin-top:12px">
+            <button class="btn btn-pause btn-sm" id="d-btn-pause" onclick="printAction('pause')">⏸ Pause</button>
+            <button class="btn btn-resume btn-sm" id="d-btn-resume" onclick="printAction('resume')">▶ Weiter</button>
+            <button class="btn btn-cancel btn-sm" id="d-btn-cancel" onclick="confirmCancel()">✕ Stopp</button>
+          </div>
+        </div>
+
+        <!-- Temperatursteuerung + Verlauf -->
+        <div class="card" style="grid-column:1/-1">
+          <div class="card-title"><span>⊙</span> <span id="d-card-temps">Temperaturen</span></div>
+          <div class="temp-card-inner">
+            <div class="temp-block">
+              <div class="temp-label">Nozzle</div>
+              <div class="temp-row">
+                <div class="temp-val" id="d-nt">–</div>
+                <div class="temp-unit">°C</div>
+              </div>
+              <div class="temp-target">→ <span id="d-nt-t">0</span>°C</div>
+              <div class="progress-bar" style="margin:8px 0 0">
+                <div class="progress-fill" id="d-ntbar" style="width:0%;background:linear-gradient(90deg,var(--accent2),#ffb020)"></div>
+              </div>
+              <div class="temp-edit" style="margin-top:10px">
+                <input type="number" class="temp-input" id="p-nozzle-inp" placeholder="Ziel" min="0" max="300" style="flex:1">
+                <button class="btn btn-sm btn-accent" onclick="setNozzle()"><span class="lbl-set">Set</span></button>
+                <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="document.getElementById('p-nozzle-inp').value=0;setNozzle()"><span class="lbl-off">Aus</span></button>
+              </div>
+            </div>
+            <div class="temp-block">
+              <div class="temp-label" id="d-lbl-bed">Bett</div>
+              <div class="temp-row">
+                <div class="temp-val" id="d-bt">–</div>
+                <div class="temp-unit">°C</div>
+              </div>
+              <div class="temp-target">→ <span id="d-bt-t">0</span>°C</div>
+              <div class="progress-bar" style="margin:8px 0 0">
+                <div class="progress-fill" id="d-btbar" style="width:0%;background:linear-gradient(90deg,#ff6b35,var(--warn))"></div>
+              </div>
+              <div class="temp-edit" style="margin-top:10px">
+                <input type="number" class="temp-input" id="p-bed-inp" placeholder="Ziel" min="0" max="120" style="flex:1">
+                <button class="btn btn-sm btn-accent" onclick="setBed()"><span class="lbl-set">Set</span></button>
+                <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="document.getElementById('p-bed-inp').value=0;setBed()"><span class="lbl-off">Aus</span></button>
+              </div>
+            </div>
+          </div>
+          <div style="margin-top:14px">
+            <div style="font-size:10px;color:var(--txt2);margin-bottom:4px" id="d-chart-label">Verlauf (letzte 60 Messungen)</div>
+            <canvas id="d-chart" width="800" height="120" style="width:100%;height:120px;background:var(--raised);border-radius:8px"></canvas>
+          </div>
+        </div>
+
+        <!-- Achsensteuerung -->
+        <div class="card">
+          <div class="card-title"><span>✛</span> <span id="ptitle-motion-xy">XY-Achsen</span></div>
+          <div class="joypad">
+            <div></div>
+            <button class="joy" onclick="move(1,1,getStep())" title="Y+">▲</button>
+            <div></div>
+            <button class="joy" onclick="move(0,-1,getStep())" title="X−">◀</button>
+            <button class="joy home" onclick="homeAll()" title="Home All">⌂</button>
+            <button class="joy" onclick="move(0,1,getStep())" title="X+">▶</button>
+            <div></div>
+            <button class="joy" onclick="move(1,-1,getStep())" title="Y−">▼</button>
+            <div></div>
+          </div>
+          <div class="step-btns">
+            <button class="step-btn" onclick="setStep(this,0.1)">0.1</button>
+            <button class="step-btn active" onclick="setStep(this,1)">1</button>
+            <button class="step-btn" onclick="setStep(this,5)">5</button>
+            <button class="step-btn" onclick="setStep(this,10)">10 mm</button>
+          </div>
+          <div class="home-btns">
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="homeZ()"><span class="lbl-home-z">Home Z</span></button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="homeXY()"><span class="lbl-home-xy">Home XY</span></button>
+            <button class="btn btn-sm btn-accent" onclick="homeAll()"><span class="lbl-home-all">Home All</span></button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="disableMotors()"><span class="lbl-disable-motors">Motors Off</span></button>
+          </div>
+        </div>
+        <div class="card">
+          <div class="card-title"><span>↕</span> <span id="ptitle-motion-z">Z-Achse</span></div>
+          <div class="joypad" style="grid-template-columns:52px;grid-template-rows:repeat(2,52px)">
+            <button class="joy" onclick="move(2,1,getStep())" title="Z+">▲</button>
+            <button class="joy" onclick="move(2,-1,getStep())" title="Z−">▼</button>
+          </div>
+          <div style="text-align:center;margin-top:8px;font-size:12px;color:var(--txt2)"><span class="lbl-step">Schrittweite:</span> <span id="step-display">1</span> mm</div>
+        </div>
+
+        <!-- Print Speed -->
+        <div class="card">
+          <div class="card-title"><span>🏎</span> <span id="d-card-speed">Druckgeschwindigkeit</span></div>
+          <div style="display:flex;gap:8px;margin-top:4px">
+            <button class="spd-btn" id="d-spd-1" onclick="setSpeed(1)">
+              <span class="spd-icon">🐢</span>
+              <span id="d-spd-lbl-1">Leise</span>
+            </button>
+            <button class="spd-btn spd-active" id="d-spd-2" onclick="setSpeed(2)">
+              <span class="spd-icon">⚡</span>
+              <span id="d-spd-lbl-2">Normal</span>
+            </button>
+            <button class="spd-btn" id="d-spd-3" onclick="setSpeed(3)">
+              <span class="spd-icon">🚀</span>
+              <span id="d-spd-lbl-3">Sport</span>
+            </button>
+          </div>
+          <div class="spd-bar" style="margin-top:12px">
+            <div class="spd-bar-fill" id="d-spd-bar" style="width:50%"></div>
+          </div>
+        </div>
+
+        <!-- Lüfter -->
+        <div class="card">
+          <div class="card-title"><span>🌀</span> <span id="d-card-lightfan">Lüfter</span></div>
+          <div class="slider-row">
+            <input type="range" class="slider" min="0" max="100" value="0" id="d-fan" oninput="document.getElementById('d-fan-val').textContent=this.value" onchange="setFan()">
+            <span class="slider-val" id="d-fan-val">0</span>
+          </div>
+          <div style="margin-top:12px;display:flex;gap:8px;flex-wrap:wrap">
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(0)">Aus</button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(25)">25%</button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(50)">50%</button>
+            <button class="btn btn-sm" style="background:var(--raised);color:var(--txt)" onclick="quickFan(75)">75%</button>
+            <button class="btn btn-sm btn-accent" onclick="quickFan(100)">100%</button>
+          </div>
+        </div>
+
+        <!-- AMS -->
+        <div class="card" style="grid-column:1/-1" id="d-ams-card">
+          <div class="card-title"><span>◫</span> <span id="d-card-ams">AMS / Filamentbox</span></div>
+          <div class="ams-slots" id="ams-slots">
+            <div style="grid-column:1/-1;text-align:center;color:var(--txt2);padding:20px" id="ams-no-data">Keine AMS-Daten empfangen</div>
+          </div>
+          <div id="ams-controls" style="margin-top:16px;display:flex;flex-direction:column;gap:10px">
+            <div style="font-size:12px;color:var(--txt2);margin-bottom:2px" id="ams-slot-lbl">Slot auswählen</div>
+            <div style="display:flex;align-items:center;gap:10px">
+              <input type="range" id="ams-slot-sel" min="0" max="3" step="1" value="0"
+                class="slider" style="flex:1"
+                oninput="document.getElementById('ams-slot-label').textContent='Slot '+(parseInt(this.value)+1)">
+              <span id="ams-slot-label" style="min-width:48px;font-size:13px;font-weight:600">Slot 1</span>
+            </div>
+            <div style="display:flex;gap:10px">
+              <button class="btn" style="flex:1" onclick="amsFeed(1)">⬇ <span class="lbl-feed">Einziehen</span></button>
+              <button id="btn-unload" class="btn" style="flex:1" onclick="amsFeed(2)">⬆ <span class="lbl-unload">Ausziehen</span></button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- ═══ CONSOLE ═══ -->
+    <!-- ═══ DRUCKER ═══ -->
+    <div class="panel" id="panel-printers">
+      <div class="card">
+        <div class="card-title" style="display:flex;justify-content:space-between;align-items:center;margin-bottom:12px">
+          <span id="printers-panel-title">🖨 Drucker</span>
+          <div style="display:flex;gap:8px">
+            <button onclick="openAddPrinterDialog()" style="font-size:12px;padding:4px 12px;background:var(--accent);border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:600">+ <span id="add-printer-btn-label">Drucker hinzufügen</span></button>
+            <button onclick="loadPrinterTab()" style="font-size:12px;padding:4px 12px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt2);cursor:pointer">↻</button>
+          </div>
+        </div>
+        <div id="printers-grid" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px"></div>
+      </div>
+    </div>
+
+    <!-- ═══ GCODE STORE ═══ -->
+    <div class="panel" id="panel-store">
+      <div class="card">
+        <div class="card-title" style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px">
+          <span id="store-panel-title">🗂 Datei-Browser</span>
+          <button id="store-refresh-btn" onclick="loadStore()" style="font-size:12px;padding:4px 12px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt2);cursor:pointer">↻ Aktualisieren</button>
+        </div>
+        <div style="display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap">
+          <input id="store-search" type="text" placeholder="🔍 Suche…" oninput="renderStore()"
+            style="flex:1;min-width:140px;padding:6px 10px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px">
+          <select id="store-filter" onchange="renderStore()"
+            style="padding:6px 8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px">
+            <option value="all" id="sf-all">Alle</option>
+            <option value="completed" id="sf-ok">✓ Erfolgreich</option>
+            <option value="failed" id="sf-err">✗ Fehler</option>
+            <option value="never" id="sf-new">Neu</option>
+          </select>
+          <select id="store-sort" onchange="renderStore()"
+            style="padding:6px 8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:13px">
+            <option value="date_desc" id="ss-date">↓ Datum</option>
+            <option value="name_asc" id="ss-name">A–Z Name</option>
+            <option value="duration_asc" id="ss-dur">⏱ Druckzeit</option>
+          </select>
+        </div>
+        <div id="store-empty" style="display:none;color:var(--txt2);text-align:center;padding:40px 0;font-size:14px">
+        </div>
+        <div id="store-grid" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px"></div>
+      </div>
+    </div>
+
+    <div class="panel" id="panel-console">
+      <div class="card">
+        <div class="card-title" style="display:flex;justify-content:space-between;align-items:center">
+          <span><span>≡</span> <span id="ptitle-console">Ereignis-Log</span></span>
+          <a id="btn-log-dl" href="/api/log/download" download="kx-bridge.log"
+             style="font-size:12px;padding:4px 10px;background:var(--raised);border-radius:6px;color:var(--txt2);text-decoration:none">⬇ Download</a>
+        </div>
+        <div style="display:flex;gap:6px;margin-bottom:6px;flex-wrap:wrap;align-items:center">
+          <input id="log-filter" type="text" placeholder="Filter…"
+            oninput="renderLog()"
+            style="flex:1;min-width:120px;padding:5px 10px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);font-size:12px;font-family:var(--mono)">
+          <button id="btn-autoscroll" onclick="toggleAutoScroll()"
+            style="font-size:12px;padding:5px 10px;border-radius:6px;border:1px solid var(--border);background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap">⬇ Auto</button>
+          <button onclick="consoleLogs=[];renderLog()"
+            style="font-size:12px;padding:5px 10px;border-radius:6px;border:1px solid var(--border);background:var(--raised);color:var(--txt2);cursor:pointer">✕ Clear</button>
+        </div>
+        <div style="display:flex;gap:5px;margin-bottom:8px;flex-wrap:wrap">
+          <span style="font-size:11px;color:var(--txt2);align-self:center;margin-right:2px">Dir:</span>
+          <button class="log-dir-btn active" id="logdir-all"  onclick="setLogDir('all')"  style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer"></button>
+          <button class="log-dir-btn"        id="logdir-rx"   onclick="setLogDir('rx')"   style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">RX</button>
+          <button class="log-dir-btn"        id="logdir-tx"   onclick="setLogDir('tx')"   style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">TX</button>
+          <span style="font-size:11px;color:var(--txt2);align-self:center;margin-left:6px;margin-right:2px">Topic:</span>
+          <button class="log-topic-btn" data-topic="multiColorBox" onclick="setLogTopic('multiColorBox')" style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">AMS</button>
+          <button class="log-topic-btn" data-topic="print"         onclick="setLogTopic('print')"         style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">print</button>
+          <button class="log-topic-btn" data-topic="info"          onclick="setLogTopic('info')"          style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">info</button>
+          <button class="log-topic-btn" data-topic="status"        onclick="setLogTopic('status')"        style="font-size:11px;padding:3px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer">status</button>
+        </div>
+        <div class="console" id="console-log" style="height:calc(100vh - 260px);min-height:160px" onscroll="onLogScroll()"></div>
+      </div>
+    </div>
+  </main>
+</div>
+
+<nav class="bottom-nav">
+  <button class="bnav-btn active" onclick="showPanel('dashboard')" id="bnb-dashboard"><span class="bnav-icon">⊞</span>Dashboard</button>
+  <button class="bnav-btn" onclick="showPanel('printers');loadPrinterTab()" id="bnb-printers"><span class="bnav-icon">🖨</span>Drucker</button>
+  <button class="bnav-btn" onclick="showPanel('store');loadStore()" id="bnb-store"><span class="bnav-icon">🗂</span>Browser</button>
+  <button class="bnav-btn" onclick="showPanel('console');clearLogBadge()" id="bnb-console"><span class="bnav-icon">≡</span>Log<span id="log-badge-bot" style="display:none;margin-left:3px;background:var(--err);color:#fff;border-radius:10px;font-size:10px;padding:1px 4px;font-weight:700"></span></button>
+</nav>
+
+<!-- Filament-Slot-Dialog -->
+<div class="modal-overlay" id="filament-dialog" onclick="if(event.target===this)closeFilamentDialog()">
+  <div class="modal-box" style="max-width:380px;width:100%">
+    <div class="modal-header" style="margin-bottom:14px">
+      <span class="modal-title" id="fd-title" style="font-size:14px;word-break:break-all"></span>
+      <button onclick="closeFilamentDialog()" style="background:none;border:none;font-size:18px;cursor:pointer;color:var(--txt2)">✕</button>
+    </div>
+    <p style="font-size:12px;color:var(--txt2);margin-bottom:10px">GCode-Kanal → AMS-Slot zuweisen:</p>
+    <div id="fd-slots" style="display:flex;flex-direction:column;gap:8px;margin-bottom:16px"></div>
+    <div style="display:flex;gap:8px;justify-content:flex-end">
+      <button onclick="closeFilamentDialog()" style="padding:8px 16px;background:var(--raised);border:1px solid var(--border);border-radius:8px;color:var(--txt);cursor:pointer">Abbrechen</button>
+      <button onclick="confirmFilamentPrint()" style="padding:8px 18px;background:var(--accent);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600">▶ Drucken</button>
+    </div>
+  </div>
+</div>
+<!-- Drucker-hinzufügen-Dialog -->
+<div class="modal-overlay" id="add-printer-dialog" onclick="if(event.target===this)closeAddPrinterDialog()">
+  <div class="modal-box" style="max-width:380px;width:100%">
+    <div class="modal-header" style="margin-bottom:14px">
+      <span class="modal-title" id="apd-title">Drucker hinzufügen</span>
+      <button onclick="closeAddPrinterDialog()" style="background:none;border:none;font-size:18px;cursor:pointer;color:var(--txt2)">✕</button>
+    </div>
+    <label id="apd-lbl-ip" style="display:block;font-size:12px;color:var(--txt2);margin-bottom:4px">Drucker-IP</label>
+    <input type="text" id="apd-ip" placeholder="192.168.1.100" style="width:100%;box-sizing:border-box;padding:8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);margin-bottom:10px">
+    <label id="apd-lbl-name" style="display:block;font-size:12px;color:var(--txt2);margin-bottom:4px">Name (optional)</label>
+    <input type="text" id="apd-name" placeholder="z.B. Kobra X Wohnzimmer" style="width:100%;box-sizing:border-box;padding:8px;background:var(--raised);border:1px solid var(--border);border-radius:6px;color:var(--txt);margin-bottom:6px">
+    <div id="apd-status" style="font-size:12px;margin:8px 0;min-height:16px;color:var(--txt2)"></div>
+    <div style="display:flex;gap:8px;justify-content:flex-end">
+      <button onclick="closeAddPrinterDialog()" style="padding:8px 16px;background:var(--raised);border:1px solid var(--border);border-radius:8px;color:var(--txt);cursor:pointer">Abbrechen</button>
+      <button id="apd-confirm" onclick="confirmAddPrinter()" style="padding:8px 18px;background:var(--accent);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600">Hinzufügen</button>
+    </div>
+  </div>
+</div>
+
+<footer style="text-align:center;padding:12px;font-size:11px;color:var(--txt2);border-top:1px solid var(--border);margin-top:auto">
+  &copy; ViewIT 2026
+</footer>
+<script src="/kx/ui/app.js?v=__UI_ASSETS_VER__"></script>
+</body>
+</html>

web/themes/new1/style.css

@@ -0,0 +1,277 @@
+:root{
+  --bg:#1a1a1f;--card:#24242c;--raised:#2e2e3a;--border:#3a3a4a;
+  --txt:#f0f0f5;--txt2:#8888aa;--accent:#00c8ff;--accent2:#ff6b35;
+  --ok:#4cde80;--err:#ff4d6d;--warn:#ffb020;
+  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
+  --mono:"JetBrains Mono","Fira Code",monospace;
+}
+[data-theme=light]{
+  --bg:#f0f0f5;--card:#fff;--raised:#e8e8f0;--border:#d0d0e0;
+  --txt:#1a1a2e;--txt2:#666680;
+}
+*{box-sizing:border-box;margin:0;padding:0}
+body{background:var(--bg);color:var(--txt);font-family:var(--font);font-size:14px;min-height:100vh;display:flex;flex-direction:column}
+a{color:var(--accent);text-decoration:none}
+
+/* ── HEADER ── */
+header{background:var(--card);border-bottom:1px solid var(--border);
+  display:flex;align-items:center;gap:12px;padding:0 20px;height:52px;
+  position:sticky;top:0;z-index:100}
+.logo{font-size:18px;font-weight:700;color:var(--accent);letter-spacing:-.02em}
+.hname{font-size:13px;color:var(--txt2)}
+.hbadge{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;
+  padding:4px 10px;border-radius:20px;background:var(--raised);color:var(--txt2);
+  text-transform:uppercase;letter-spacing:.04em}
+.hbadge.printing{background:#0d2d1a;color:var(--ok)}
+.hbadge.complete{background:#0d1f38;color:#60b0ff}
+.hbadge.error{background:#2d0d0d;color:var(--err)}
+.hbadge .dot{width:7px;height:7px;border-radius:50%;background:currentColor}
+.hbadge.printing .dot{animation:pulse 1.4s infinite}
+@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
+.theme-btn{background:none;border:1px solid var(--border);color:var(--txt2);
+  border-radius:8px;padding:6px 10px;cursor:pointer;font-size:13px;transition:.15s}
+.theme-btn:hover{border-color:var(--accent);color:var(--accent)}
+.conn-btn{border-radius:8px;padding:6px 12px;cursor:pointer;font-size:13px;
+  font-weight:600;border:none;transition:.15s}
+.conn-btn.disconnected{background:var(--accent);color:#fff}
+.conn-btn.disconnected:hover{opacity:.85}
+.conn-btn.connected{background:transparent;border:1px solid var(--border);color:var(--txt2)}
+.conn-btn.connected:hover{border-color:#e05;color:#e05}
+
+/* ── LAYOUT ── */
+.layout{display:flex;flex:1;min-height:0}
+nav.sidebar{width:200px;background:var(--card);border-right:1px solid var(--border);
+  display:flex;flex-direction:column;padding:12px 8px;gap:2px;flex-shrink:0}
+.nav-btn{background:none;border:none;color:var(--txt2);text-align:left;
+  padding:9px 12px;border-radius:8px;cursor:pointer;font-size:13px;
+  display:flex;align-items:center;gap:10px;transition:.12s;width:100%}
+.nav-btn:hover{background:var(--raised);color:var(--txt)}
+.nav-btn.active{background:var(--raised);color:var(--accent)}
+.nav-icon{font-size:16px;width:20px;text-align:center}
+main{flex:1;overflow-y:auto;padding:20px}
+.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
+
+/* ── CARD ── */
+.card{background:var(--card);border:1px solid var(--border);border-radius:12px;
+  padding:18px;transition:box-shadow .15s,transform .15s}
+.card:hover{box-shadow:0 4px 20px rgba(0,0,0,.3);transform:translateY(-1px)}
+.card-title{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--txt2);
+  margin-bottom:14px;display:flex;align-items:center;gap:8px}
+.card-title span{font-size:14px}
+
+/* ── HERO ── */
+.hero{grid-column:1/-1;display:grid;grid-template-columns:1fr 320px;gap:16px}
+@media(max-width:900px){.hero{grid-template-columns:1fr}}
+.cam-wrap{background:#0a0a0e;border-radius:10px;overflow:hidden;
+  min-height:180px;max-height:320px;display:flex;align-items:center;justify-content:center;position:relative}
+.cam-wrap img,.cam-wrap video{width:100%;max-height:320px;height:auto;display:block;object-fit:contain}
+.cam-placeholder{color:var(--txt2);font-size:13px;text-align:center;padding:20px}
+@keyframes spin{to{transform:rotate(360deg)}}
+.cam-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.15);
+  border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;display:none}
+.cam-overlay{position:absolute;bottom:0;left:0;right:0;
+  background:linear-gradient(transparent,rgba(0,0,0,.75));padding:14px}
+.cam-toggle{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.5);
+  border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:8px;
+  padding:6px 10px;cursor:pointer;font-size:12px;backdrop-filter:blur(4px)}
+.cam-toggle:hover{background:rgba(0,0,0,.7)}
+
+/* ── PROGRESS ── */
+.hero-info{display:flex;flex-direction:column;gap:12px}
+.pct-big{font-size:52px;font-weight:700;line-height:1;color:var(--txt)}
+.pct-big small{font-size:20px;font-weight:400;color:var(--txt2)}
+.progress-bar{height:8px;background:var(--raised);border-radius:4px;overflow:hidden;margin:4px 0}
+.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),#0080cc);
+  border-radius:4px;transition:width .6s ease}
+.meta-row{display:flex;justify-content:space-between;font-size:12px;color:var(--txt2)}
+.layer-badge{background:var(--raised);border-radius:6px;padding:4px 8px;
+  font-family:var(--mono);font-size:12px;color:var(--txt)}
+.fname{font-size:12px;color:var(--txt2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
+  background:var(--raised);border-radius:6px;padding:6px 8px}
+
+/* ── PRINT CONTROLS ── */
+.ctrl-btns{display:flex;gap:8px;flex-wrap:wrap}
+.btn{border:none;border-radius:8px;padding:10px 16px;font-size:13px;font-weight:600;
+  cursor:pointer;transition:opacity .15s,transform .1s;white-space:nowrap}
+.btn:hover{opacity:.85;transform:translateY(-1px)}
+.btn:active{transform:translateY(0)}
+.btn-start{background:var(--ok);color:#0d2010}
+.btn-pause{background:var(--raised);color:var(--txt);border:1px solid var(--border)}
+.btn-resume{background:#0d2d1a;color:var(--ok);border:1px solid var(--ok)}
+.btn-cancel{background:#2d0d0d;color:var(--err);border:1px solid var(--err)}
+.btn-accent{background:var(--accent);color:#001a24}
+.btn-sm{padding:7px 12px;font-size:12px}
+.spd-btn{flex:1;border:1.5px solid var(--border);background:var(--raised);color:var(--txt);
+  border-radius:10px;padding:14px 8px;font-size:13px;font-weight:600;cursor:pointer;
+  transition:all .15s;display:flex;flex-direction:column;align-items:center;gap:4px}
+.spd-btn:hover{border-color:var(--accent);color:var(--accent)}
+.spd-btn.spd-active{border-color:var(--accent);background:rgba(0,200,255,.12);color:var(--accent)}
+.spd-btn .spd-icon{font-size:22px}
+.spd-bar{height:4px;border-radius:2px;background:var(--border);margin-top:10px;overflow:hidden}
+.spd-bar-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:width .3s}
+
+/* ── TIME CARDS ── */
+.time-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:8px}
+.time-block{background:var(--raised);border-radius:10px;padding:10px 12px}
+.time-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--txt2);margin-bottom:4px}
+.time-val{font-size:20px;font-weight:700;font-family:var(--mono);color:var(--txt)}
+/* ── TEMPS ── */
+.temp-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
+.temp-card-inner{display:grid;grid-template-columns:1fr 1fr;gap:12px}
+.temp-block{background:var(--raised);border-radius:10px;padding:14px;position:relative}
+.temp-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--txt2);margin-bottom:6px}
+.temp-row{display:flex;align-items:baseline;gap:6px}
+.temp-val{font-size:30px;font-weight:700;font-family:var(--mono)}
+.temp-unit{font-size:14px;color:var(--txt2)}
+.temp-target{font-size:11px;color:var(--txt2);margin-top:2px}
+.temp-arc{position:absolute;top:12px;right:12px}
+.temp-edit{display:flex;gap:6px;margin-top:10px}
+.temp-input{background:var(--bg);border:1px solid var(--border);color:var(--txt);
+  border-radius:6px;padding:5px 8px;font-size:13px;font-family:var(--mono);width:70px}
+.temp-input:focus{outline:none;border-color:var(--accent)}
+.chart-wrap{margin-top:12px}
+canvas.tchart{width:100%;height:60px;display:block;border-radius:6px;background:var(--raised)}
+
+/* ── MOTION ── */
+.joypad{display:grid;grid-template-columns:repeat(3,52px);
+  grid-template-rows:repeat(3,52px);gap:6px;justify-content:center;margin:8px auto}
+.joy{background:var(--raised);border:1px solid var(--border);color:var(--txt);
+  border-radius:10px;font-size:18px;cursor:pointer;transition:.12s;
+  display:flex;align-items:center;justify-content:center}
+.joy:hover{background:var(--accent);color:#001a24;border-color:var(--accent)}
+.joy:active{transform:scale(.93)}
+.joy.home{font-size:14px;background:var(--bg)}
+.step-btns{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:10px}
+.step-btn{background:var(--raised);border:1px solid var(--border);color:var(--txt2);
+  border-radius:6px;padding:5px 10px;font-size:12px;cursor:pointer;transition:.12s}
+.step-btn.active,.step-btn:hover{background:var(--accent);color:#001a24;border-color:var(--accent)}
+.home-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;justify-content:center}
+
+/* ── AMS ── */
+.ams-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
+.ams-slot{background:var(--raised);border-radius:10px;padding:10px;text-align:center;
+  border:2px solid transparent;transition:.2s;position:relative}
+.ams-slot.active{border-color:var(--slot-color,var(--accent));
+  box-shadow:0 0 12px rgba(var(--slot-rgb,0,200,255),.3)}
+.slot-circle{width:36px;height:36px;border-radius:50%;margin:0 auto 6px;border:2px solid rgba(255,255,255,.15)}
+.slot-label{font-size:11px;color:var(--txt2);font-family:var(--mono)}
+.slot-material{font-size:12px;font-weight:600;margin-bottom:2px}
+
+/* ── LIGHT + FAN ── */
+.toggle-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
+.toggle-label{font-size:13px;font-weight:600}
+.toggle{position:relative;width:44px;height:24px;cursor:pointer}
+.toggle input{opacity:0;width:0;height:0;position:absolute}
+.toggle-track{width:44px;height:24px;background:var(--raised);border-radius:12px;
+  border:1px solid var(--border);transition:.25s;display:block}
+.toggle input:checked+.toggle-track{background:var(--accent)}
+.toggle-thumb{position:absolute;top:3px;left:3px;width:18px;height:18px;
+  background:#fff;border-radius:50%;transition:.25s;pointer-events:none}
+.toggle input:checked~.toggle-thumb{transform:translateX(20px)}
+.slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}
+.slider-label{font-size:12px;color:var(--txt2);width:80px}
+.slider{flex:1;-webkit-appearance:none;height:4px;border-radius:2px;
+  background:var(--raised);outline:none;cursor:pointer}
+.slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;
+  border-radius:50%;background:var(--accent);cursor:pointer;transition:.1s}
+.slider::-webkit-slider-thumb:hover{transform:scale(1.2)}
+.slider-val{font-family:var(--mono);font-size:12px;color:var(--txt);width:30px;text-align:right}
+
+/* ── CONSOLE ── */
+.console{background:#0a0a0e;border-radius:8px;padding:10px;font-family:var(--mono);
+  font-size:11px;color:#8888aa;overflow-y:auto;line-height:1.6}
+.console .ts{color:#444;margin-right:6px}
+.console .msg-info{color:#8888aa}
+.console .msg-ok{color:var(--ok)}
+.console .msg-err{color:var(--err)}
+.console .msg-warn{color:var(--warn)}
+
+/* ── PANELS ── */
+.panel{display:none}
+.panel.active{display:block}
+
+/* ── MODAL ── */
+.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);
+  z-index:200;align-items:center;justify-content:center;padding:16px}
+.modal-overlay.open{display:flex}
+.modal-box{background:var(--card);border:1px solid var(--border);border-radius:14px;
+  width:100%;max-width:480px;max-height:90vh;overflow-y:auto;padding:24px;
+  display:flex;flex-direction:column;gap:18px}
+.modal-header{display:flex;align-items:center;justify-content:space-between}
+.modal-title{font-size:15px;font-weight:700;color:var(--txt)}
+.modal-close{background:none;border:none;color:var(--txt2);font-size:20px;
+  cursor:pointer;padding:4px 8px;border-radius:6px}
+.modal-close:hover{background:var(--raised);color:var(--txt)}
+.modal-section{font-size:10px;text-transform:uppercase;letter-spacing:.1em;
+  color:var(--txt2);margin-bottom:6px;margin-top:4px}
+.modal-field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
+.modal-field label{font-size:12px;color:var(--txt2)}
+.modal-field input{background:var(--raised);border:1px solid var(--border);
+  border-radius:7px;color:var(--txt);padding:7px 10px;font-size:13px;width:100%}
+.modal-field input:focus{outline:none;border-color:var(--accent)}
+.poll-btns{display:flex;gap:8px}
+.poll-btn{flex:1;padding:7px;background:var(--raised);border:1px solid var(--border);
+  border-radius:7px;color:var(--txt2);cursor:pointer;font-size:13px;transition:all .15s}
+.poll-btn.active{background:var(--accent);border-color:var(--accent);color:#000;font-weight:600}
+.update-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
+.update-status{font-size:12px;color:var(--txt2);flex:1;min-width:0}
+.modal-save{width:100%;padding:10px;background:var(--accent);border:none;
+  border-radius:8px;color:#000;font-weight:700;font-size:14px;cursor:pointer;margin-top:4px}
+.modal-save:hover{opacity:.88}
+
+/* ── BOTTOM NAV (mobile) ── */
+nav.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;
+  background:var(--card);border-top:1px solid var(--border);
+  justify-content:space-around;padding:8px 0 max(8px,env(safe-area-inset-bottom))}
+.bnav-btn{background:none;border:none;color:var(--txt2);display:flex;
+  flex-direction:column;align-items:center;gap:3px;cursor:pointer;font-size:10px;padding:4px 8px}
+.bnav-btn.active{color:var(--accent)}
+.bnav-icon{font-size:20px}
+
+/* ── Tablet (769–1100px): schmale Sidebar ── */
+@media(min-width:769px) and (max-width:1100px){
+  nav.sidebar{width:52px;padding:12px 4px}
+  .nav-btn .nav-text{display:none}
+  .nav-btn{justify-content:center;padding:10px}
+  .nav-icon{width:auto}
+  .grid{grid-template-columns:repeat(2,1fr)}
+  .hero{grid-template-columns:1fr}
+}
+
+/* ── Mobile (≤768px): Bottom-Nav, 1-Spalte ── */
+@media(max-width:768px){
+  nav.sidebar{display:none}
+  nav.bottom-nav{display:flex}
+  main{padding:10px;padding-bottom:72px}
+
+  /* Header kompakt */
+  header{padding:0 12px;gap:8px}
+  .hname{display:none}
+
+  /* 1-Spalten-Grid, full-width spans funktionieren weiterhin */
+  .grid{grid-template-columns:1fr;gap:12px}
+
+  /* Hero: Kamera über Info */
+  .hero{grid-template-columns:1fr}
+  .cam-wrap{max-height:220px}
+
+  /* Temp-Pair und Temp-Card übereinander */
+  .temp-pair{grid-template-columns:1fr}
+  .temp-card-inner{grid-template-columns:1fr}
+
+  /* AMS: 2 Spalten */
+  .ams-slots{grid-template-columns:repeat(2,1fr)}
+
+  /* Joypad etwas kleiner */
+  .joypad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:5px}
+  .joy{font-size:16px}
+
+  /* Buttons größere Touch-Targets */
+  .btn{padding:10px 14px;font-size:13px}
+  .btn-sm{padding:8px 12px}
+  .step-btn{padding:8px 12px;font-size:13px}
+
+  /* Modal vollbreite auf kleinen Screens */
+  .modal-box{padding:16px;border-radius:10px}
+  .poll-btns{gap:6px}
+}