From d3f0c5158184df5804371f8929105f90e00d4981 Mon Sep 17 00:00:00 2001
From: Joshua Thijssen <jthijssen@noxlogic.nl>
Date: Sun, 29 Sep 2024 16:40:27 +0200
Subject: [PATCH 1/2] Refactored crates around and added generics

This is a rather large commit that was needed in order to let the
gosub_html5 and gosub_css3 crates to be dependend on eachother. The
problem was that they both need eachother and resulted in a cyclic
dependency. We solve this usually by moving stuff to the gosub_shared
crate, but in this case it would mean we practically move EVERYTHING to
that crate.

So instead we created a lot of traits in the gosub_shared that can be
used by the other crates. This way, both html5 and css3 crates do not
need to be depenended on eachother, but only on the gosub_shared crate.

However, it crates a lot of extra efford in getting this up and running,
the traits and generics means that A LOT of code must be refactored into
this system, during which we found out that a lot of code is not on the
correct places. We moved around much of the code so it kinda makes sense
again.

This resulted in the removal of the gosub_styling crate, which was a
sort of bridge between the css3-system and other things, which now lives
in the css3 crate (which we now properly could manage).

There are still problems we're facing, but overal the refactoring looks
good.

Note that creating this trait setup resulted in redesigning a new engine
architecture (unimaginably named "engine_v2"), in which we are
redesigning the way we deal with all components. It should resolve all
the trait bottlenecks we currently have and hopefully we will be able to
refactor the current engine into that one. For now, we keep on working
on this system.

Co-authored-by: Shark <sharktheone@proton.me>
---
 .gitignore                                    |    2 -
 CONTRIBUTING.md                               |    4 -
 Cargo.lock                                    |  808 ++----
 Cargo.toml                                    |    1 -
 benches/tree_iterator.rs                      |   21 +-
 crates/gosub_bindings/.gitignore              |    3 -
 crates/gosub_bindings/Cargo.toml              |   14 -
 crates/gosub_bindings/Makefile                |   54 -
 crates/gosub_bindings/README.md               |   18 -
 crates/gosub_bindings/include/gosub_api.h     |   37 -
 crates/gosub_bindings/include/nodes.h         |   42 -
 crates/gosub_bindings/include/nodes/text.h    |   25 -
 crates/gosub_bindings/include/properties.h    |   16 -
 crates/gosub_bindings/src/gosub_api.c         |   50 -
 crates/gosub_bindings/src/lib.rs              |  118 -
 crates/gosub_bindings/src/nodes.c             |   67 -
 crates/gosub_bindings/src/nodes/text.c        |   38 -
 crates/gosub_bindings/src/wrapper.rs          |    9 -
 crates/gosub_bindings/src/wrapper/node.rs     |   47 -
 crates/gosub_bindings/src/wrapper/text.rs     |   28 -
 crates/gosub_bindings/tests/rendertree_test.c |  121 -
 crates/gosub_config/Cargo.toml                |    3 +
 crates/gosub_config/src/lib.rs                |   17 +-
 crates/gosub_config/src/settings.rs           |    8 +-
 crates/gosub_config/src/storage/json.rs       |    6 +-
 crates/gosub_config/src/storage/sqlite.rs     |    4 +-
 crates/gosub_css3/Cargo.toml                  |   12 +-
 .../resources/definitions/definitions.json    |    0
 .../definitions/definitions_at-rules.json     |    0
 .../definitions/definitions_properties.json   |    0
 .../definitions/definitions_selectors.json    |    0
 .../definitions/definitions_values.json       |    0
 .../resources/useragent.css                   |    0
 .../src/{convert/ast_converter.rs => ast.rs}  |   89 +-
 crates/gosub_css3/src/colors.rs               |   21 +-
 crates/gosub_css3/src/convert.rs              |    1 -
 crates/gosub_css3/src/errors.rs               |   35 +
 crates/gosub_css3/src/functions.rs            |    7 +
 crates/gosub_css3/src/functions/attr.rs       |   33 +
 .../src/functions/calc.rs                     |    3 +-
 .../src/functions/var.rs                      |   13 +-
 crates/gosub_css3/src/lib.rs                  |  146 +-
 crates/gosub_css3/src/logging.rs              |  528 ++++
 crates/gosub_css3/src/matcher.rs              |    6 +
 .../src/matcher}/property_definitions.rs      |   94 +-
 .../src/matcher}/shorthands.rs                |   69 +-
 .../src => gosub_css3/src/matcher}/styling.rs |  225 +-
 .../src => gosub_css3/src/matcher}/syntax.rs  |  230 +-
 .../src/matcher}/syntax_matcher.rs            |  207 +-
 crates/gosub_css3/src/matcher/walker.rs       |   48 +
 crates/gosub_css3/src/node.rs                 |   16 +-
 crates/gosub_css3/src/parser.rs               |   65 +-
 crates/gosub_css3/src/parser/anplusb.rs       |   64 +-
 crates/gosub_css3/src/parser/at_rule.rs       |   34 +-
 .../src/parser/at_rule/container.rs           |   12 +-
 .../src/parser/at_rule/font_face.rs           |    5 +-
 .../gosub_css3/src/parser/at_rule/import.rs   |   19 +-
 crates/gosub_css3/src/parser/at_rule/layer.rs |    9 +-
 crates/gosub_css3/src/parser/at_rule/media.rs |   52 +-
 crates/gosub_css3/src/parser/at_rule/nest.rs  |    5 +-
 crates/gosub_css3/src/parser/at_rule/page.rs  |    5 +-
 crates/gosub_css3/src/parser/at_rule/scope.rs |    5 +-
 .../src/parser/at_rule/starting_style.rs      |    5 +-
 .../gosub_css3/src/parser/at_rule/supports.rs |    8 +-
 crates/gosub_css3/src/parser/block.rs         |   19 +-
 crates/gosub_css3/src/parser/calc.rs          |    7 +-
 crates/gosub_css3/src/parser/combinator.rs    |   18 +-
 crates/gosub_css3/src/parser/condition.rs     |    8 +-
 crates/gosub_css3/src/parser/declaration.rs   |   18 +-
 .../gosub_css3/src/parser/feature_function.rs |   10 +-
 crates/gosub_css3/src/parser/function.rs      |    7 +-
 crates/gosub_css3/src/parser/operator.rs      |   10 +-
 crates/gosub_css3/src/parser/pseudo.rs        |   30 +-
 crates/gosub_css3/src/parser/rule.rs          |   10 +-
 crates/gosub_css3/src/parser/selector.rs      |   72 +-
 crates/gosub_css3/src/parser/selector_list.rs |    5 +-
 crates/gosub_css3/src/parser/stylesheet.rs    |   14 +-
 crates/gosub_css3/src/parser/url.rs           |   21 +-
 crates/gosub_css3/src/parser/value.rs         |   34 +-
 crates/gosub_css3/src/stylesheet.rs           |  195 +-
 crates/gosub_css3/src/system.rs               |  244 ++
 crates/gosub_css3/src/tokenizer.rs            |  168 +-
 crates/gosub_css3/src/walker.rs               |   11 +-
 .../tools/generate_definitions/go.mod         |    0
 .../tools/generate_definitions/main.go        |    2 +-
 .../tools/generate_definitions/mdn/mdn.go     |    0
 .../patch/patch_darwin.go                     |    0
 .../generate_definitions/patch/patch_linux.go |    0
 .../patch/patch_windows.go                    |    0
 .../generate_definitions/patch/patcher.go     |    0
 .../tools/generate_definitions/specs/specs.go |    0
 .../utils/stringmaybearray.go                 |    0
 .../tools/generate_definitions/utils/types.go |    0
 .../tools/generate_definitions/utils/utils.go |    4 +-
 .../generate_definitions/webref/webref.go     |    0
 crates/gosub_html5/Cargo.toml                 |    2 -
 .../gosub_html5/benches/tree_construction.rs  |   11 +-
 crates/gosub_html5/docs/parsing.md            |    6 +-
 crates/gosub_html5/src/document.rs            |    5 +
 crates/gosub_html5/src/document/builder.rs    |   55 +
 .../gosub_html5/src/document/document_impl.rs | 2277 ++++++++++++++++
 crates/gosub_html5/src/document/fragment.rs   |   63 +
 crates/gosub_html5/src/document/query.rs      |  125 +
 crates/gosub_html5/src/document/task_queue.rs |  235 ++
 crates/gosub_html5/src/element_class.rs       |  159 --
 crates/gosub_html5/src/lib.rs                 |   22 +-
 crates/gosub_html5/src/node.rs                |  732 +-----
 crates/gosub_html5/src/node/arena.rs          |  208 +-
 crates/gosub_html5/src/node/data/comment.rs   |   12 +-
 crates/gosub_html5/src/node/data/doctype.rs   |   17 +-
 crates/gosub_html5/src/node/data/document.rs  |   23 +-
 crates/gosub_html5/src/node/data/element.rs   |  418 ++-
 crates/gosub_html5/src/node/data/text.rs      |   23 +-
 crates/gosub_html5/src/node/elements.rs       |   97 +
 crates/gosub_html5/src/node/node_impl.rs      |  520 ++++
 crates/gosub_html5/src/node/visitor.rs        |   18 +
 crates/gosub_html5/src/parser.rs              | 1135 ++++----
 crates/gosub_html5/src/parser/document.rs     | 2280 -----------------
 .../src/{error_logger.rs => parser/errors.rs} |   42 +-
 crates/gosub_html5/src/parser/helper.rs       |  377 ++-
 crates/gosub_html5/src/parser/query.rs        |   35 +-
 crates/gosub_html5/src/parser/quirks.rs       |   36 +-
 crates/gosub_html5/src/parser/tree_builder.rs |   41 +-
 crates/gosub_html5/src/tokenizer.rs           |  158 +-
 .../src/tokenizer/character_reference.rs      |   99 +-
 .../src/tokenizer/replacement_tables.rs       |    2 +-
 .../gosub_html5/src/tokenizer/test_cases.rs   |    5 +-
 crates/gosub_html5/src/tokenizer/token.rs     |   26 +-
 crates/gosub_html5/src/util.rs                |    5 -
 crates/gosub_html5/src/visit.rs               |   22 -
 crates/gosub_html5/src/writer.rs              |  178 +-
 .../tree-construction/tests19.dat             | 1126 --------
 crates/gosub_jsapi/src/console.rs             |    6 +-
 .../src/console/writable_printer.rs           |   21 +-
 crates/gosub_net/Cargo.toml                   |    2 +-
 crates/gosub_net/src/dns.rs                   |    6 +-
 crates/gosub_net/src/dns/cache.rs             |   20 +-
 crates/gosub_net/src/dns/local.rs             |   36 +-
 crates/gosub_net/src/dns/remote.rs            |    8 +-
 crates/gosub_net/src/http/response.rs         |    4 +-
 crates/gosub_render_backend/Cargo.toml        |   11 +-
 crates/gosub_render_backend/src/layout.rs     |   51 +-
 crates/gosub_render_backend/src/lib.rs        |   17 +-
 crates/gosub_render_backend/src/svg.rs        |   17 +-
 crates/gosub_render_utils/Cargo.toml          |    3 +-
 crates/gosub_render_utils/src/lib.rs          |    1 +
 crates/gosub_render_utils/src/position.rs     |   38 +-
 crates/gosub_render_utils/src/render_tree.rs  |  843 ++++--
 .../src/render_tree/desc.rs                   |   37 +-
 .../src/render_tree/properties.rs             |   91 -
 .../src/render_tree/text.rs                   |   50 -
 .../src/render_tree/util.rs                   |   14 -
 crates/gosub_render_utils/src/style/parse.rs  |    3 +-
 crates/gosub_renderer/Cargo.toml              |    5 -
 crates/gosub_renderer/src/debug/scale.rs      |    4 +-
 crates/gosub_renderer/src/draw.rs             |  317 +--
 crates/gosub_renderer/src/position.rs         |  174 ++
 crates/gosub_renderer/src/render_tree.rs      |   64 +-
 crates/gosub_shared/Cargo.toml                |    1 +
 crates/gosub_shared/src/byte_stream.rs        |   60 +-
 crates/gosub_shared/src/document.rs           |   59 +
 crates/gosub_shared/src/element_data.rs       |   80 +
 crates/gosub_shared/src/errors.rs             |   39 +
 crates/gosub_shared/src/lib.rs                |    7 +
 crates/gosub_shared/src/node.rs               |   80 +
 crates/gosub_shared/src/timing.rs             |   50 +-
 .../src/traits.rs}                            |   16 +-
 crates/gosub_shared/src/traits/css3.rs        |  101 +
 crates/gosub_shared/src/traits/document.rs    |  129 +
 crates/gosub_shared/src/traits/html5.rs       |   31 +
 crates/gosub_shared/src/traits/node.rs        |  196 ++
 crates/gosub_shared/src/traits/render_tree.rs |   21 +
 crates/gosub_shared/src/types.rs              |   19 +-
 crates/gosub_styling/Cargo.toml               |   32 -
 crates/gosub_styling/README.md                |   55 -
 crates/gosub_styling/src/errors.rs            |    8 -
 crates/gosub_styling/src/functions.rs         |    7 -
 crates/gosub_styling/src/functions/attr.rs    |   26 -
 crates/gosub_styling/src/lib.rs               |   34 -
 crates/gosub_styling/src/render_tree.rs       | 1043 --------
 crates/gosub_svg/Cargo.toml                   |    6 +-
 crates/gosub_svg/src/lib.rs                   |   16 +-
 crates/gosub_svg/src/resvg.rs                 |   34 +-
 crates/gosub_taffy/Cargo.toml                 |    3 +-
 crates/gosub_taffy/src/compute/inline.rs      |   84 +-
 crates/gosub_taffy/src/lib.rs                 |   14 +-
 crates/gosub_taffy/src/style/parse.rs         |   26 +-
 .../gosub_taffy/src/style/parse_properties.rs |   30 +-
 crates/gosub_testing/src/testing/tokenizer.rs |   49 +-
 .../src/testing/tree_construction.rs          |  109 +-
 .../testing/tree_construction/generator.rs    |  133 +-
 .../src/testing/tree_construction/parser.rs   |   40 +-
 .../src/testing/tree_construction/result.rs   |    9 +-
 crates/gosub_typeface/Cargo.toml              |    2 +
 crates/gosub_useragent/Cargo.toml             |    2 +
 crates/gosub_useragent/src/application.rs     |   73 +-
 crates/gosub_useragent/src/event_loop.rs      |   25 +-
 crates/gosub_useragent/src/tabs.rs            |   59 +-
 crates/gosub_useragent/src/window.rs          |   30 +-
 crates/gosub_v8/Cargo.toml                    |    2 -
 crates/gosub_v8/src/v8.rs                     |   10 +-
 crates/gosub_v8/src/v8/array.rs               |   97 +-
 crates/gosub_v8/src/v8/context.rs             |   31 +-
 crates/gosub_v8/src/v8/function.rs            |   64 +-
 crates/gosub_v8/src/v8/object.rs              |   63 +-
 crates/gosub_v8/src/v8/value.rs               |   32 +-
 crates/gosub_vello/Cargo.toml                 |    2 +
 crates/gosub_vello/src/border.rs              |   44 +-
 crates/gosub_vello/src/gradient.rs            |   19 +-
 crates/gosub_vello/src/image.rs               |    7 +-
 crates/gosub_vello/src/lib.rs                 |   22 +-
 crates/gosub_vello/src/rect.rs                |    8 +-
 crates/gosub_vello/src/render.rs              |    7 +-
 crates/gosub_vello/src/scene.rs               |   12 +-
 crates/gosub_vello/src/text.rs                |    6 +-
 crates/gosub_vello/src/vello_svg.rs           |   12 +-
 crates/gosub_webexecutor/src/js/array.rs      |    9 +-
 crates/gosub_webexecutor/src/js/function.rs   |   27 +-
 crates/gosub_webexecutor/src/js/object.rs     |    6 +-
 crates/gosub_webexecutor/src/js/runtime.rs    |    5 +-
 crates/gosub_webexecutor/src/js/value.rs      |   17 +-
 crates/gosub_webexecutor/tests/interop.rs     |   49 +-
 crates/gosub_webinterop/Cargo.toml            |    4 +-
 crates/gosub_webinterop/src/function.rs       |    5 +-
 crates/gosub_webinterop/src/lib.rs            |   15 +-
 crates/gosub_webinterop/src/property.rs       |    5 +-
 crates/gosub_webinterop/src/types/args.rs     |   22 +-
 crates/gosub_webinterop/src/types/generics.rs |    5 +-
 .../gosub_webinterop/src/types/primitive.rs   |    4 +-
 crates/gosub_webinterop/src/types/ty.rs       |    5 +-
 examples/html5-parser.rs                      |   13 +-
 rustfmt.toml                                  |    1 +
 src/bin/config-store.rs                       |    7 +-
 src/bin/css3-parser.rs                        |   88 +-
 src/bin/display-text-tree.rs                  |   42 +-
 src/bin/gosub-parser.rs                       |   17 +-
 src/bin/html5-parser-test.rs                  |   18 +-
 src/bin/parser-test.rs                        |   21 +-
 src/bin/renderer.rs                           |   21 +-
 src/engine.rs                                 |   32 +-
 src/wasm/css.rs                               |   10 +-
 src/wasm/renderer.rs                          |    7 +-
 src/wasm/styles.rs                            |    2 +-
 tests/example1.js                             |    2 +-
 244 files changed, 9578 insertions(+), 11134 deletions(-)
 delete mode 100644 crates/gosub_bindings/.gitignore
 delete mode 100644 crates/gosub_bindings/Cargo.toml
 delete mode 100644 crates/gosub_bindings/Makefile
 delete mode 100644 crates/gosub_bindings/README.md
 delete mode 100644 crates/gosub_bindings/include/gosub_api.h
 delete mode 100644 crates/gosub_bindings/include/nodes.h
 delete mode 100644 crates/gosub_bindings/include/nodes/text.h
 delete mode 100644 crates/gosub_bindings/include/properties.h
 delete mode 100644 crates/gosub_bindings/src/gosub_api.c
 delete mode 100644 crates/gosub_bindings/src/lib.rs
 delete mode 100644 crates/gosub_bindings/src/nodes.c
 delete mode 100644 crates/gosub_bindings/src/nodes/text.c
 delete mode 100644 crates/gosub_bindings/src/wrapper.rs
 delete mode 100644 crates/gosub_bindings/src/wrapper/node.rs
 delete mode 100644 crates/gosub_bindings/src/wrapper/text.rs
 delete mode 100644 crates/gosub_bindings/tests/rendertree_test.c
 rename crates/{gosub_styling => gosub_css3}/resources/definitions/definitions.json (100%)
 rename crates/{gosub_styling => gosub_css3}/resources/definitions/definitions_at-rules.json (100%)
 rename crates/{gosub_styling => gosub_css3}/resources/definitions/definitions_properties.json (100%)
 rename crates/{gosub_styling => gosub_css3}/resources/definitions/definitions_selectors.json (100%)
 rename crates/{gosub_styling => gosub_css3}/resources/definitions/definitions_values.json (100%)
 rename crates/{gosub_styling => gosub_css3}/resources/useragent.css (100%)
 rename crates/gosub_css3/src/{convert/ast_converter.rs => ast.rs} (79%)
 delete mode 100644 crates/gosub_css3/src/convert.rs
 create mode 100644 crates/gosub_css3/src/errors.rs
 create mode 100644 crates/gosub_css3/src/functions.rs
 create mode 100644 crates/gosub_css3/src/functions/attr.rs
 rename crates/{gosub_styling => gosub_css3}/src/functions/calc.rs (58%)
 rename crates/{gosub_styling => gosub_css3}/src/functions/var.rs (74%)
 create mode 100644 crates/gosub_css3/src/logging.rs
 create mode 100644 crates/gosub_css3/src/matcher.rs
 rename crates/{gosub_styling/src => gosub_css3/src/matcher}/property_definitions.rs (92%)
 rename crates/{gosub_styling/src => gosub_css3/src/matcher}/shorthands.rs (92%)
 rename crates/{gosub_styling/src => gosub_css3/src/matcher}/styling.rs (78%)
 rename crates/{gosub_styling/src => gosub_css3/src/matcher}/syntax.rs (94%)
 rename crates/{gosub_styling/src => gosub_css3/src/matcher}/syntax_matcher.rs (90%)
 create mode 100644 crates/gosub_css3/src/matcher/walker.rs
 create mode 100644 crates/gosub_css3/src/system.rs
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/go.mod (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/main.go (98%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/mdn/mdn.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/patch/patch_darwin.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/patch/patch_linux.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/patch/patch_windows.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/patch/patcher.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/specs/specs.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/utils/stringmaybearray.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/utils/types.go (100%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/utils/utils.go (89%)
 rename crates/{gosub_styling => gosub_css3}/tools/generate_definitions/webref/webref.go (100%)
 create mode 100644 crates/gosub_html5/src/document.rs
 create mode 100644 crates/gosub_html5/src/document/builder.rs
 create mode 100755 crates/gosub_html5/src/document/document_impl.rs
 create mode 100644 crates/gosub_html5/src/document/fragment.rs
 create mode 100644 crates/gosub_html5/src/document/query.rs
 create mode 100644 crates/gosub_html5/src/document/task_queue.rs
 delete mode 100644 crates/gosub_html5/src/element_class.rs
 create mode 100644 crates/gosub_html5/src/node/elements.rs
 create mode 100644 crates/gosub_html5/src/node/node_impl.rs
 create mode 100644 crates/gosub_html5/src/node/visitor.rs
 delete mode 100755 crates/gosub_html5/src/parser/document.rs
 rename crates/gosub_html5/src/{error_logger.rs => parser/errors.rs} (90%)
 delete mode 100644 crates/gosub_html5/src/util.rs
 delete mode 100644 crates/gosub_html5/src/visit.rs
 rename crates/{gosub_styling => gosub_render_utils}/src/render_tree/desc.rs (53%)
 delete mode 100644 crates/gosub_render_utils/src/render_tree/properties.rs
 delete mode 100644 crates/gosub_render_utils/src/render_tree/text.rs
 delete mode 100644 crates/gosub_render_utils/src/render_tree/util.rs
 create mode 100644 crates/gosub_renderer/src/position.rs
 create mode 100644 crates/gosub_shared/src/document.rs
 create mode 100644 crates/gosub_shared/src/element_data.rs
 create mode 100644 crates/gosub_shared/src/errors.rs
 create mode 100644 crates/gosub_shared/src/node.rs
 rename crates/{gosub_css3/src/parser_config.rs => gosub_shared/src/traits.rs} (65%)
 create mode 100644 crates/gosub_shared/src/traits/css3.rs
 create mode 100644 crates/gosub_shared/src/traits/document.rs
 create mode 100644 crates/gosub_shared/src/traits/html5.rs
 create mode 100644 crates/gosub_shared/src/traits/node.rs
 create mode 100644 crates/gosub_shared/src/traits/render_tree.rs
 delete mode 100644 crates/gosub_styling/Cargo.toml
 delete mode 100644 crates/gosub_styling/README.md
 delete mode 100644 crates/gosub_styling/src/errors.rs
 delete mode 100644 crates/gosub_styling/src/functions.rs
 delete mode 100644 crates/gosub_styling/src/functions/attr.rs
 delete mode 100644 crates/gosub_styling/src/lib.rs
 delete mode 100644 crates/gosub_styling/src/render_tree.rs
 create mode 100644 rustfmt.toml

diff --git a/.gitignore b/.gitignore
index c7a968a96..d8f1c953c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -12,6 +12,4 @@ local/
 settings.db
 
 # C API tests (ignore everything but source files)
-*/gosub_bindings/tests/*
-!*/gosub_bindings/tests/*.c
 *.dSYM
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index f32aa34b2..5f11722df 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -38,10 +38,6 @@ In the root directory, run `make format` to have clippy automatically fix some o
 ### Running Benchmarks
 In the root directory, run `make bench` to run the benchmarks.
 
-### Building C API Bindings
-In the `crates/gosub_bindings` directory, run `make bindings` to build the C static libraries. For more information on this, see the [README](crates/gosub-bindings/README.md).
-
-Can also run `make test` in the same directory to build and run the tests for the C bindings.
 
 ## Code Style
 We use cargo's built-in formatter. When running `make test`, the formatter will also run (after all the tests) and display any issues in a `git diff`-like output in the terminal. Please resolve these formatting issues prior to pushing any code! This is validated in our CI when creating a pull request.
diff --git a/Cargo.lock b/Cargo.lock
index ef084b42f..0d565f97b 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -74,17 +74,6 @@ dependencies = [
  "subtle",
 ]
 
-[[package]]
-name = "ahash"
-version = "0.7.8"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "891477e0c6a8957309ee5c45a6368af3ae14bb510732d2684ffa19af310920f9"
-dependencies = [
- "getrandom",
- "once_cell",
- "version_check",
-]
-
 [[package]]
 name = "ahash"
 version = "0.8.11"
@@ -95,7 +84,7 @@ dependencies = [
  "getrandom",
  "once_cell",
  "version_check",
- "zerocopy 0.7.35",
+ "zerocopy",
 ]
 
 [[package]]
@@ -107,66 +96,18 @@ dependencies = [
  "memchr",
 ]
 
-[[package]]
-name = "aliasable"
-version = "0.1.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "250f629c0161ad8107cf89319e990051fae62832fd343083bea452d93e2205fd"
-
 [[package]]
 name = "aligned-vec"
 version = "0.5.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4aa90d7ce82d4be67b64039a3d588d38dbcc6736577de4a847025ce5b0c468d1"
 
-[[package]]
-name = "alloc-no-stdlib"
-version = "2.0.4"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "cc7bb162ec39d46ab1ca8c77bf72e890535becd1751bb45f64c597edb4c8c6b3"
-
-[[package]]
-name = "alloc-stdlib"
-version = "0.2.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "94fb8275041c72129eb51b7d0322c29b8387a0386127718b096429201a5d6ece"
-dependencies = [
- "alloc-no-stdlib",
-]
-
 [[package]]
 name = "allocator-api2"
 version = "0.2.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "5c6cb57a04249c6480766f7f7cef5467412af1490f8d1e243141daddada3264f"
 
-[[package]]
-name = "allsorts"
-version = "0.14.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "afb67debdbc7e8b0716e7b10ce247ff6cd2811b0b478969158b16ac58995d16b"
-dependencies = [
- "bitflags 1.3.2",
- "bitreader",
- "brotli-decompressor",
- "byteorder",
- "encoding_rs",
- "flate2",
- "glyph-names",
- "itertools 0.10.5",
- "lazy_static",
- "libc",
- "log",
- "num-traits",
- "ouroboros",
- "rustc-hash",
- "tinyvec",
- "ucd-trie",
- "unicode-canonical-combining-class",
- "unicode-general-category",
- "unicode-joining-type",
-]
-
 [[package]]
 name = "android-activity"
 version = "0.6.0"
@@ -278,14 +219,14 @@ checksum = "0ae92a5119aa49cdbcf6b9f893fe4e1d98b04ccbf82ee0584ad948a44a734dea"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
 name = "arrayref"
-version = "0.3.8"
+version = "0.3.9"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9d151e35f61089500b617991b791fc8bfd237ae50cd5950803758a179b41e67a"
+checksum = "76a2e8124351fda1ef8aaaa3bbd7ebbcb486bbcd4225aca0aa0d84bb2db8fecb"
 
 [[package]]
 name = "arrayvec"
@@ -295,9 +236,9 @@ checksum = "23b62fc65de8e4e7f52534fb52b0f3ed04746ae267519eef2a83941e8085068b"
 
 [[package]]
 name = "arrayvec"
-version = "0.7.4"
+version = "0.7.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "96d30a06541fbafbc7f82ed10c06164cfbd2c401138f6addd8404629c4b16711"
+checksum = "7c02d123df017efcdfbd739ef81735b36c5ba83ec3c59c80a9d7ecc718f92e50"
 
 [[package]]
 name = "as-raw-xcb-connection"
@@ -316,13 +257,13 @@ dependencies = [
 
 [[package]]
 name = "async-trait"
-version = "0.1.81"
+version = "0.1.83"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6e0c28dcc82d7c8ead5cb13beb15405b57b8546e93215673ff8ca0349a028107"
+checksum = "721cae7de5c34fbb2acd27e21e6d2cf7b886dce0c27388d46c4e6c47ea4318dd"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -333,9 +274,9 @@ checksum = "1505bd5d3d116872e7271a6d4e16d81d0c8570876c8de68093a09ac269d8aac0"
 
 [[package]]
 name = "autocfg"
-version = "1.3.0"
+version = "1.4.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0c4b4d0bd25bd0b74681c0ad21497610ce1b7c91b1022cd21c80c6fbdd9476b0"
+checksum = "ace50bade8e6234aa140d9a2f552bbee1db4d353f69b8217bc503490fc1a9f26"
 
 [[package]]
 name = "av1-grain"
@@ -344,7 +285,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "6678909d8c5d46a42abcf571271e15fdbc0a225e3646cf23762cd415046c78bf"
 dependencies = [
  "anyhow",
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "log",
  "nom 7.1.3",
  "num-rational",
@@ -357,7 +298,7 @@ version = "0.8.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "876c75a42f6364451a033496a14c44bffe41f5f4a8236f697391f11024e596d2"
 dependencies = [
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
 ]
 
 [[package]]
@@ -400,7 +341,7 @@ dependencies = [
  "regex",
  "rustc-hash",
  "shlex",
- "syn 2.0.77",
+ "syn 2.0.79",
  "which 4.4.2",
 ]
 
@@ -452,20 +393,11 @@ version = "2.6.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "b048fb63fd8b5923fc5aa7b340d8e156aec7ec02f0c78fa8a6ddc2613f6f71de"
 
-[[package]]
-name = "bitreader"
-version = "0.3.8"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "bdd859c9d97f7c468252795b35aeccc412bdbb1e90ee6969c4fa6328272eaeff"
-dependencies = [
- "cfg-if",
-]
-
 [[package]]
 name = "bitstream-io"
-version = "2.5.0"
+version = "2.5.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3dcde5f311c85b8ca30c2e4198d4326bc342c76541590106f5fa4a50946ea499"
+checksum = "b81e1519b0d82120d2fd469d5bfb2919a9361c48b02d82d04befc1cdd2002452"
 
 [[package]]
 name = "block"
@@ -491,16 +423,6 @@ dependencies = [
  "objc2",
 ]
 
-[[package]]
-name = "brotli-decompressor"
-version = "2.5.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4e2e4afe60d7dd600fdd3de8d0f08c2b7ec039712e3b6137ff98b7004e82de4f"
-dependencies = [
- "alloc-no-stdlib",
- "alloc-stdlib",
-]
-
 [[package]]
 name = "built"
 version = "0.7.4"
@@ -521,22 +443,22 @@ checksum = "5ce89b21cab1437276d2650d57e971f9d548a2d9037cc231abdc0562b97498ce"
 
 [[package]]
 name = "bytemuck"
-version = "1.16.3"
+version = "1.18.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "102087e286b4677862ea56cf8fc58bb2cdfa8725c40ffb80fe3a008eb7f2fc83"
+checksum = "94bbb0ad554ad961ddc5da507a12a29b14e4ae5bda06b19f575a3e6079d2e2ae"
 dependencies = [
  "bytemuck_derive",
 ]
 
 [[package]]
 name = "bytemuck_derive"
-version = "1.7.0"
+version = "1.7.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1ee891b04274a59bd38b412188e24b849617b2e45a0fd8d057deb63e7403761b"
+checksum = "0cc8b54b395f2fcfbb3d90c47b01c7f444d94d05bdeb775811dec868ac3bbc26"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -553,9 +475,9 @@ checksum = "8f1fe948ff07f4bd06c30984e69f5b4899c516a3ef74f34df92a2df2ab535495"
 
 [[package]]
 name = "bytes"
-version = "1.7.1"
+version = "1.7.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8318a53db07bb3f8dca91a600466bdb3f2eaadeedfdbcf02e1accbad9271ba50"
+checksum = "428d9aa8fbc0670b7b8d6030a7fadd0f86151cae55e4dbbece15f3780a3dfaf3"
 
 [[package]]
 name = "calloop"
@@ -591,12 +513,13 @@ checksum = "37b2a672a2cb129a2e41c10b1224bb368f9f37a2b16b612598138befd7b37eb5"
 
 [[package]]
 name = "cc"
-version = "1.1.7"
+version = "1.1.22"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "26a5c3fd7bfa1ce3897a3a3501d362b2d87b7f2583ebcb4a949ec25911025cbc"
+checksum = "9540e661f81799159abee814118cc139a2004b3a3aa3ea37724a1b66530b90e0"
 dependencies = [
  "jobserver",
  "libc",
+ "shlex",
 ]
 
 [[package]]
@@ -735,10 +658,10 @@ version = "4.5.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4ac6a0c7b1a9e9a5186361f67dfa1b88213572f427fb9ab038efb2bd8c582dab"
 dependencies = [
- "heck 0.5.0",
+ "heck",
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -855,6 +778,12 @@ dependencies = [
  "web-sys",
 ]
 
+[[package]]
+name = "convert_case"
+version = "0.4.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6245d59a3e82a7fc217c5828a6692dbc6dfb63a0c8c90495621f7b9d79704a0e"
+
 [[package]]
 name = "cookie"
 version = "0.18.1"
@@ -884,9 +813,9 @@ dependencies = [
 
 [[package]]
 name = "core-foundation-sys"
-version = "0.8.6"
+version = "0.8.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "06ea2b9bc92be3c2baa9334a323ebca2d6f074ff852cd1d7b11064035cd3868f"
+checksum = "773648b94d0e5d620f64f280777445740e61fe701025087ec8b57f45c791888b"
 
 [[package]]
 name = "core-graphics"
@@ -935,9 +864,9 @@ dependencies = [
 
 [[package]]
 name = "cpufeatures"
-version = "0.2.12"
+version = "0.2.14"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "53fe5e26ff1b7aef8bca9c6080520cfb8d9333c7568e1829cef191a9723e5504"
+checksum = "608697df725056feaccfa42cffdaeeec3fccc4ffc38358ecd19b243e716a78e0"
 dependencies = [
  "libc",
 ]
@@ -1076,6 +1005,19 @@ dependencies = [
  "powerfmt",
 ]
 
+[[package]]
+name = "derive_more"
+version = "0.99.18"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5f33878137e4dafd7fa914ad4e259e18a4e8e532b9617a2d0150262bf53abfce"
+dependencies = [
+ "convert_case",
+ "proc-macro2",
+ "quote",
+ "rustc_version",
+ "syn 2.0.79",
+]
+
 [[package]]
 name = "derive_more"
 version = "1.0.0"
@@ -1093,7 +1035,7 @@ checksum = "cb7330aeadfbe296029522e6c40f315320aba36fc43a5b3632f3795348f3bd22"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
  "unicode-xid",
 ]
 
@@ -1122,7 +1064,7 @@ checksum = "97369cbbc041bc366949bc74d34658d6cda5621039731c6310521892a3a20ae0"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -1163,9 +1105,9 @@ checksum = "f25c0e292a7ca6d6498557ff1df68f32c99850012b6ea401cf8daf771f22ff53"
 
 [[package]]
 name = "dwrote"
-version = "0.11.0"
+version = "0.11.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "439a1c2ba5611ad3ed731280541d36d2e9c4ac5e7fb818a27b604bdc5a6aa65b"
+checksum = "2da3498378ed373237bdef1eddcc64e7be2d3ba4841f4c22a998e81cadeea83c"
 dependencies = [
  "lazy_static",
  "libc",
@@ -1192,14 +1134,14 @@ dependencies = [
 
 [[package]]
 name = "enum-as-inner"
-version = "0.6.0"
+version = "0.6.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5ffccbb6966c05b32ef8fbac435df276c4ae4d3dc55a8cd0eb9745e6c12f546a"
+checksum = "a1e6a265c649f3f5979b601d26f1d05ada116434c87741c9493cb56218f76cbc"
 dependencies = [
- "heck 0.4.1",
+ "heck",
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -1220,9 +1162,9 @@ dependencies = [
 
 [[package]]
 name = "euclid"
-version = "0.22.10"
+version = "0.22.11"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e0f0eb73b934648cd7a4a61f1b15391cd95dab0b4da6e2e66c2a072c144b4a20"
+checksum = "ad9cdb4b747e485a12abb0e6566612956c7a1bafa3bdb8d682c5b6d403589e48"
 dependencies = [
  "num-traits",
 ]
@@ -1245,21 +1187,21 @@ dependencies = [
 
 [[package]]
 name = "fdeflate"
-version = "0.3.4"
+version = "0.3.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4f9bfee30e4dedf0ab8b422f03af778d9612b63f502710fc500a334ebe2de645"
+checksum = "d8090f921a24b04994d9929e204f50b498a33ea6ba559ffaa05e04f7ee7fb5ab"
 dependencies = [
  "simd-adler32",
 ]
 
 [[package]]
 name = "flate2"
-version = "1.0.30"
+version = "1.0.34"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5f54427cfd1c7829e2a139fcefea601bf088ebca651d2bf53ebc600eac295dae"
+checksum = "a1b589b4dc103969ad3cf85c950899926ec64300a1a46d76c03a6072957036f0"
 dependencies = [
  "crc32fast",
- "miniz_oxide 0.7.4",
+ "miniz_oxide 0.8.0",
 ]
 
 [[package]]
@@ -1358,7 +1300,7 @@ dependencies = [
  "core-text",
  "dwrote",
  "fontconfig-cache-parser",
- "hashbrown 0.14.5",
+ "hashbrown",
  "icu_locid",
  "icu_properties",
  "memmap2",
@@ -1379,7 +1321,7 @@ dependencies = [
  "core-text",
  "dwrote",
  "fontconfig-cache-parser",
- "hashbrown 0.14.5",
+ "hashbrown",
  "icu_locid",
  "memmap2",
  "objc2",
@@ -1410,7 +1352,7 @@ checksum = "1a5c6c585bc94aaf2c7b51dd4c2ba22680844aba4c687be581871a6f518c5742"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -1505,7 +1447,7 @@ checksum = "87750cf4b7a4c0625b1529e4c543c2182106e4dedc60a2a6455e00d212c489ac"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -1635,21 +1577,6 @@ dependencies = [
  "gl_generator",
 ]
 
-[[package]]
-name = "glyph-names"
-version = "0.2.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c3531d702d6c1a3ba92a5fb55a404c7b8c476c8e7ca249951077afcbe4bc807f"
-
-[[package]]
-name = "gosub_bindings"
-version = "0.1.0"
-dependencies = [
- "gosub_html5",
- "gosub_rendering",
- "gosub_shared",
-]
-
 [[package]]
 name = "gosub_config"
 version = "0.1.0"
@@ -1676,9 +1603,15 @@ dependencies = [
  "anyhow",
  "colors-transform",
  "gosub_shared",
+ "itertools 0.13.0",
  "lazy_static",
  "log",
+ "nom 7.1.3",
+ "rand 0.8.5",
+ "serde",
+ "serde_json",
  "simple_logger",
+ "thiserror",
 ]
 
 [[package]]
@@ -1691,7 +1624,7 @@ dependencies = [
  "console_log",
  "cookie",
  "criterion",
- "derive_more",
+ "derive_more 1.0.0",
  "futures",
  "getrandom",
  "gosub_config",
@@ -1703,7 +1636,6 @@ dependencies = [
  "gosub_renderer",
  "gosub_rendering",
  "gosub_shared",
- "gosub_styling",
  "gosub_taffy",
  "gosub_testing",
  "gosub_useragent",
@@ -1732,7 +1664,7 @@ name = "gosub_html5"
 version = "0.1.0"
 dependencies = [
  "criterion",
- "derive_more",
+ "derive_more 1.0.0",
  "gosub_css3",
  "gosub_shared",
  "gosub_testing",
@@ -1760,7 +1692,7 @@ version = "0.1.0"
 dependencies = [
  "anyhow",
  "cookie",
- "derive_more",
+ "derive_more 1.0.0",
  "domain-lookup-tree",
  "gosub_config",
  "gosub_shared",
@@ -1777,10 +1709,13 @@ dependencies = [
 name = "gosub_render_backend"
 version = "0.1.0"
 dependencies = [
+ "anyhow",
+ "gosub_css3",
  "gosub_html5",
  "gosub_shared",
  "gosub_typeface",
  "image",
+ "log",
  "raw-window-handle",
  "smallvec",
 ]
@@ -1796,7 +1731,6 @@ dependencies = [
  "gosub_render_backend",
  "gosub_rendering",
  "gosub_shared",
- "gosub_styling",
  "image",
  "log",
  "url",
@@ -1812,7 +1746,8 @@ dependencies = [
  "gosub_css3",
  "gosub_html5",
  "gosub_render_backend",
- "gosub_styling",
+ "gosub_shared",
+ "log",
  "regex",
  "rstar",
 ]
@@ -1824,6 +1759,7 @@ dependencies = [
  "anyhow",
  "chardet",
  "chardetng",
+ "derive_more 0.99.18",
  "encoding_rs",
  "getrandom",
  "js-sys",
@@ -1836,31 +1772,6 @@ dependencies = [
  "web-sys",
 ]
 
-[[package]]
-name = "gosub_styling"
-version = "0.1.0"
-dependencies = [
- "anyhow",
- "backtrace",
- "colors-transform",
- "gosub_css3",
- "gosub_html5",
- "gosub_render_backend",
- "gosub_shared",
- "gosub_typeface",
- "itertools 0.13.0",
- "lazy_static",
- "log",
- "memoize",
- "nom 7.1.3",
- "rand 0.9.0-alpha.2",
- "regex",
- "rust-fontconfig",
- "serde",
- "serde_json",
- "thiserror",
-]
-
 [[package]]
 name = "gosub_svg"
 version = "0.1.0"
@@ -1880,7 +1791,6 @@ dependencies = [
  "anyhow",
  "gosub_render_backend",
  "gosub_shared",
- "gosub_styling",
  "gosub_typeface",
  "log",
  "parley",
@@ -1963,7 +1873,7 @@ version = "0.1.0"
 dependencies = [
  "anyhow",
  "colored",
- "derive_more",
+ "derive_more 1.0.0",
  "gosub_shared",
  "gosub_v8",
  "gosub_webinterop",
@@ -1981,7 +1891,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "serde",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -2024,7 +1934,7 @@ checksum = "9c08c1f623a8d0b722b8b99f821eb0ba672a1618f0d3b16ddbee1cedd2dd8557"
 dependencies = [
  "bitflags 2.6.0",
  "gpu-descriptor-types",
- "hashbrown 0.14.5",
+ "hashbrown",
 ]
 
 [[package]]
@@ -2080,22 +1990,13 @@ dependencies = [
  "byteorder",
 ]
 
-[[package]]
-name = "hashbrown"
-version = "0.12.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8a9ee70c43aaf417c914396645a0fa852624801b24ebb7ae78fe8272889ac888"
-dependencies = [
- "ahash 0.7.8",
-]
-
 [[package]]
 name = "hashbrown"
 version = "0.14.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e5274423e17b7c9fc20b6e7e208532f9b19825d82dfd615708b70edd83df41f1"
 dependencies = [
- "ahash 0.8.11",
+ "ahash",
  "allocator-api2",
 ]
 
@@ -2124,12 +2025,6 @@ dependencies = [
  "stable_deref_trait",
 ]
 
-[[package]]
-name = "heck"
-version = "0.4.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "95505c38b4572b2d910cecb0281560f54b440a19336cbbcb27bf6ce6adc6f5a8"
-
 [[package]]
 name = "heck"
 version = "0.5.0"
@@ -2339,7 +2234,7 @@ checksum = "1ec89e9337638ecdc08744df490b221a7399bf8d164eb52a665454e60e075ad6"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -2415,12 +2310,12 @@ checksum = "44feda355f4159a7c757171a77de25daf6411e217b4cabd03bd6650690468126"
 
 [[package]]
 name = "indexmap"
-version = "2.2.6"
+version = "2.5.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "168fb715dda47215e360912c096649d23d58bf392ac62f73919e831745e40f26"
+checksum = "68b900aa2f7301e21c36462b170ee99994de34dff39a4a6a528e80e7376d07e5"
 dependencies = [
  "equivalent",
- "hashbrown 0.14.5",
+ "hashbrown",
 ]
 
 [[package]]
@@ -2440,7 +2335,7 @@ checksum = "c34819042dc3d3971c46c2190835914dfbe0c3c13f61449b2997f4e9722dfa60"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -2457,17 +2352,17 @@ dependencies = [
 
 [[package]]
 name = "ipnet"
-version = "2.9.0"
+version = "2.10.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8f518f335dce6725a761382244631d86cf0ccb2863413590b31338feb467f9c3"
+checksum = "187674a687eed5fe42285b40c6291f9a01517d415fad1c3cbc6a9f778af7fcd4"
 
 [[package]]
 name = "is-terminal"
-version = "0.4.12"
+version = "0.4.13"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f23ff5ef2b80d608d61efee834934d862cd92461afc0560dedf493e4c033738b"
+checksum = "261f68e344040fbd0edea105bef17c66edf46f984ddb1115b775ce31be948f4b"
 dependencies = [
- "hermit-abi 0.3.9",
+ "hermit-abi 0.4.0",
  "libc",
  "windows-sys 0.52.0",
 ]
@@ -2576,11 +2471,11 @@ checksum = "e2db585e1d738fc771bf08a151420d3ed193d9d895a36df7f6f8a9456b911ddc"
 
 [[package]]
 name = "kurbo"
-version = "0.11.0"
+version = "0.11.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6e5aa9f0f96a938266bdb12928a67169e8d22c6a786fda8ed984b85e6ba93c3c"
+checksum = "89234b2cc610a7dd927ebde6b41dd1a5d4214cffaef4cf1fb2195d592f92518f"
 dependencies = [
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "smallvec",
 ]
 
@@ -2617,9 +2512,9 @@ dependencies = [
 
 [[package]]
 name = "libc"
-version = "0.2.158"
+version = "0.2.159"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d8adc4bb1803a324070e64a98ae98f38934d91957a99cfb3a43dcbc01bc56439"
+checksum = "561d97a539a36e26a9a5fad1ea11a3039a67714694aaa379433e580854bc3dc5"
 
 [[package]]
 name = "libfuzzer-sys"
@@ -2708,15 +2603,6 @@ dependencies = [
  "imgref",
 ]
 
-[[package]]
-name = "lru"
-version = "0.7.8"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e999beba7b6e8345721bd280141ed958096a2e4abdf74f67ff4ce49b4b54e47a"
-dependencies = [
- "hashbrown 0.12.3",
-]
-
 [[package]]
 name = "lru-cache"
 version = "0.1.2"
@@ -2758,36 +2644,13 @@ checksum = "78ca9ab1a0babb1e7d5695e3530886289c18cf2f87ec19a575a0abdce112e3a3"
 
 [[package]]
 name = "memmap2"
-version = "0.9.4"
+version = "0.9.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "fe751422e4a8caa417e13c3ea66452215d7d63e19e604f4980461212f3ae1322"
+checksum = "fd3f7eed9d3848f8b98834af67102b720745c4ec028fcd0aa0239277e7de374f"
 dependencies = [
  "libc",
 ]
 
-[[package]]
-name = "memoize"
-version = "0.4.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5df4051db13d0816cf23196d3baa216385ae099339f5d0645a8d9ff2305e82b8"
-dependencies = [
- "lazy_static",
- "lru",
- "memoize-inner",
-]
-
-[[package]]
-name = "memoize-inner"
-version = "0.4.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "27bdece7e91f0d1e33df7b46ec187a93ea0d4e642113a1039ac8bfdd4a3273ac"
-dependencies = [
- "lazy_static",
- "proc-macro2",
- "quote",
- "syn 1.0.109",
-]
-
 [[package]]
 name = "metal"
 version = "0.29.0"
@@ -2826,7 +2689,6 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "b8a240ddb74feaf34a79a7add65a741f3167852fba007066dcac1ca548d89c08"
 dependencies = [
  "adler",
- "simd-adler32",
 ]
 
 [[package]]
@@ -2836,13 +2698,14 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e2d80299ef12ff69b16a84bb182e3b9df68b5a91574d3d4fa6e41b65deec4df1"
 dependencies = [
  "adler2",
+ "simd-adler32",
 ]
 
 [[package]]
 name = "mio"
-version = "1.0.1"
+version = "1.0.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4569e456d394deccd22ce1c1913e6ea0e54519f577285001215d33557431afe4"
+checksum = "80e04d1dcff3aae0704555fe5fee3bcfaf3d1fdf8a7e521d5b9d2b42acb52cec"
 dependencies = [
  "hermit-abi 0.3.9",
  "libc",
@@ -2850,23 +2713,13 @@ dependencies = [
  "windows-sys 0.52.0",
 ]
 
-[[package]]
-name = "mmapio"
-version = "0.9.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0204e2cac68f5b2e35b7ec8cb5d906f6e58e78dad8066a30b6ee54da99bb03dd"
-dependencies = [
- "libc",
- "winapi",
-]
-
 [[package]]
 name = "naga"
 version = "0.20.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e536ae46fcab0876853bd4a632ede5df4b1c2527a58f6c5a4150fe86be858231"
 dependencies = [
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "bit-set 0.5.3",
  "bitflags 2.6.0",
  "codespan-reporting",
@@ -2886,7 +2739,7 @@ version = "22.1.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "8bd5a652b6faf21496f2cfd88fc49989c8db0825d1f6746b1a71a6ede24a63ad"
 dependencies = [
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "bit-set 0.6.0",
  "bitflags 2.6.0",
  "cfg_aliases 0.1.1",
@@ -3017,7 +2870,7 @@ checksum = "ed3955f1a9c7c0c15e092f9c887db08b1fc683305fdf6eb6684f22555355e202"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -3068,7 +2921,7 @@ dependencies = [
  "proc-macro-crate",
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -3294,18 +3147,21 @@ dependencies = [
 
 [[package]]
 name = "object"
-version = "0.36.2"
+version = "0.36.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3f203fa8daa7bb185f760ae12bd8e097f63d17041dcdcaf675ac54cdf863170e"
+checksum = "084f1a5821ac4c651660a94a7153d27ac9d8a53736203f58b31945ded098070a"
 dependencies = [
  "memchr",
 ]
 
 [[package]]
 name = "once_cell"
-version = "1.19.0"
+version = "1.20.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3fdb12b2476b595f9358c5161aa467c2438859caa136dec86c26fdd2efe17b92"
+checksum = "82881c4be219ab5faaf2ad5e5e5ecdff8c66bd7402ca3160975c93b24961afd1"
+dependencies = [
+ "portable-atomic",
+]
 
 [[package]]
 name = "oorandom"
@@ -3328,30 +3184,6 @@ dependencies = [
  "libredox",
 ]
 
-[[package]]
-name = "ouroboros"
-version = "0.17.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e2ba07320d39dfea882faa70554b4bd342a5f273ed59ba7c1c6b4c840492c954"
-dependencies = [
- "aliasable",
- "ouroboros_macro",
- "static_assertions",
-]
-
-[[package]]
-name = "ouroboros_macro"
-version = "0.17.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ec4c6225c69b4ca778c0aea097321a64c421cf4577b331c61b229267edabb6f8"
-dependencies = [
- "heck 0.4.1",
- "proc-macro-error",
- "proc-macro2",
- "quote",
- "syn 2.0.77",
-]
-
 [[package]]
 name = "owned_ttf_parser"
 version = "0.24.0"
@@ -3379,7 +3211,7 @@ checksum = "1e401f977ab385c9e4e3ab30627d6f26d00e2c73eef317493c4ec6d468726cf8"
 dependencies = [
  "cfg-if",
  "libc",
- "redox_syscall 0.5.3",
+ "redox_syscall 0.5.6",
  "smallvec",
  "windows-targets 0.52.6",
 ]
@@ -3447,7 +3279,7 @@ dependencies = [
  "phf_shared",
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -3482,7 +3314,7 @@ checksum = "2f38a4412a78282e09a2cf38d195ea5420d15ba0602cb375210efbc877243965"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -3499,15 +3331,15 @@ checksum = "8b870d8c151b6f2fb93e84a13146138f05d02ed11c7e7c54f8826aaaf7c9f184"
 
 [[package]]
 name = "pkg-config"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d231b230927b5e4ad203db57bbcbee2802f6bce620b1e4a9024a07d94e2907ec"
+checksum = "953ec861398dccce10c670dfeaf3ec4911ca479e9c02154b3a215178c5f566f2"
 
 [[package]]
 name = "plotters"
-version = "0.3.6"
+version = "0.3.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a15b6eccb8484002195a3e44fe65a4ce8e93a625797a063735536fd59cb01cf3"
+checksum = "5aeb6f403d7a4911efb1e33402027fc44f29b5bf6def3effcc22d7bb75f2b747"
 dependencies = [
  "num-traits",
  "plotters-backend",
@@ -3518,37 +3350,37 @@ dependencies = [
 
 [[package]]
 name = "plotters-backend"
-version = "0.3.6"
+version = "0.3.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "414cec62c6634ae900ea1c56128dfe87cf63e7caece0852ec76aba307cebadb7"
+checksum = "df42e13c12958a16b3f7f4386b9ab1f3e7933914ecea48da7139435263a4172a"
 
 [[package]]
 name = "plotters-svg"
-version = "0.3.6"
+version = "0.3.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "81b30686a7d9c3e010b84284bdd26a29f2138574f52f5eb6f794fc0ad924e705"
+checksum = "51bae2ac328883f7acdfea3d66a7c35751187f870bc81f94563733a154d7a670"
 dependencies = [
  "plotters-backend",
 ]
 
 [[package]]
 name = "png"
-version = "0.17.13"
+version = "0.17.14"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "06e4b0d3d1312775e782c86c91a111aa1f910cbb65e1337f9975b5f9a554b5e1"
+checksum = "52f9d46a34a05a6a57566bc2bfae066ef07585a6e3fa30fbbdff5936380623f0"
 dependencies = [
  "bitflags 1.3.2",
  "crc32fast",
  "fdeflate",
  "flate2",
- "miniz_oxide 0.7.4",
+ "miniz_oxide 0.8.0",
 ]
 
 [[package]]
 name = "polling"
-version = "3.7.2"
+version = "3.7.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a3ed00ed3fbf728b5816498ecd316d1716eecaced9c0c8d2c5a6740ca214985b"
+checksum = "cc2790cd301dec6cd3b7a025e4815cf825724a51c98dccfe6a3e55f05ffb6511"
 dependencies = [
  "cfg-if",
  "concurrent-queue",
@@ -3556,7 +3388,7 @@ dependencies = [
  "pin-project-lite",
  "rustix",
  "tracing",
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]
 
 [[package]]
@@ -3571,6 +3403,12 @@ dependencies = [
  "universal-hash",
 ]
 
+[[package]]
+name = "portable-atomic"
+version = "1.9.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "cc9c68a3f6da06753e9335d63e27f6b9754dd1920d941135b7ea8224f141adb2"
+
 [[package]]
 name = "powerfmt"
 version = "0.2.0"
@@ -3579,11 +3417,11 @@ checksum = "439ee305def115ba05938db6eb1644ff94165c5ab5e9420d1c1bcedbba909391"
 
 [[package]]
 name = "ppv-lite86"
-version = "0.2.18"
+version = "0.2.20"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "dee4364d9f3b902ef14fab8a1ddffb783a1cb6b4bba3bfc1fa3922732c7de97f"
+checksum = "77957b295656769bb8ad2b6a6b09d897d94f05c41b069aede1fcdaa675eaea04"
 dependencies = [
- "zerocopy 0.6.6",
+ "zerocopy",
 ]
 
 [[package]]
@@ -3594,45 +3432,21 @@ checksum = "e8cf8e6a8aa66ce33f63993ffc4ea4271eb5b0530a9002db8455ea6050c77bfa"
 
 [[package]]
 name = "prettyplease"
-version = "0.2.20"
+version = "0.2.22"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5f12335488a2f3b0a83b14edad48dca9879ce89b2edd10e80237e4e852dd645e"
+checksum = "479cf940fbbb3426c32c5d5176f62ad57549a0bb84773423ba8be9d089f5faba"
 dependencies = [
  "proc-macro2",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
 name = "proc-macro-crate"
-version = "3.1.0"
+version = "3.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6d37c51ca738a55da99dc0c4a34860fd675453b8b36209178c2249bb13651284"
+checksum = "8ecf48c7ca261d60b74ab1a7b20da18bede46776b2e55535cb958eb595c5fa7b"
 dependencies = [
- "toml_edit 0.21.1",
-]
-
-[[package]]
-name = "proc-macro-error"
-version = "1.0.4"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "da25490ff9892aab3fcf7c36f08cfb902dd3e71ca0f9f9517bea02a73a5ce38c"
-dependencies = [
- "proc-macro-error-attr",
- "proc-macro2",
- "quote",
- "syn 1.0.109",
- "version_check",
-]
-
-[[package]]
-name = "proc-macro-error-attr"
-version = "1.0.4"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a1be40180e52ecc98ad80b184934baf3d0d29f979574e439af5a55274b35f869"
-dependencies = [
- "proc-macro2",
- "quote",
- "version_check",
+ "toml_edit",
 ]
 
 [[package]]
@@ -3660,7 +3474,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "8021cf59c8ec9c432cfc2526ac6b8aa508ecaf29cd415f271b8406c1b851c3fd"
 dependencies = [
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -3686,9 +3500,9 @@ checksum = "a993555f31e5a609f617c12db6250dedcac1b0a85076912c436e6fc9b2c8e6a3"
 
 [[package]]
 name = "quick-xml"
-version = "0.34.0"
+version = "0.36.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6f24d770aeca0eacb81ac29dfbc55ebcc09312fdd1f8bbecdc7e4a84e000e3b4"
+checksum = "f7649a7b4df05aed9ea7ec6f628c67c9953a43869b8bc50929569b2999d443fe"
 dependencies = [
  "memchr",
 ]
@@ -3721,7 +3535,7 @@ checksum = "c3e256ff62cee3e03def855c4d4260106d2bb1696fdc01af03e9935b993720a5"
 dependencies = [
  "rand_chacha 0.9.0-alpha.2",
  "rand_core 0.9.0-alpha.2",
- "zerocopy 0.7.35",
+ "zerocopy",
 ]
 
 [[package]]
@@ -3760,7 +3574,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "f4e93f5a5e3c528cda9acb0928c31b2ba868c551cc46e67b778075e34aab9906"
 dependencies = [
  "getrandom",
- "zerocopy 0.7.35",
+ "zerocopy",
 ]
 
 [[package]]
@@ -3777,7 +3591,7 @@ checksum = "cd87ce80a7665b1cce111f8a16c1f3929f6547ce91ade6addf4ec86a8dda5ce9"
 dependencies = [
  "arbitrary",
  "arg_enum_proc_macro",
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "av1-grain",
  "bitstream-io",
  "built",
@@ -3806,9 +3620,9 @@ dependencies = [
 
 [[package]]
 name = "ravif"
-version = "0.11.9"
+version = "0.11.10"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5797d09f9bd33604689e87e8380df4951d4912f01b63f71205e2abd4ae25e6b6"
+checksum = "a8f0bfd976333248de2078d350bfdf182ff96e168a24d23d2436cef320dd4bdd"
 dependencies = [
  "avif-serialize",
  "imgref",
@@ -3875,18 +3689,18 @@ dependencies = [
 
 [[package]]
 name = "redox_syscall"
-version = "0.5.3"
+version = "0.5.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2a908a6e00f1fdd0dfd9c0eb08ce85126f6d8bbda50017e74bc4a4b7d4a926a4"
+checksum = "355ae415ccd3a04315d3f8246e86d67689ea74d88d915576e1589a351062a13b"
 dependencies = [
  "bitflags 2.6.0",
 ]
 
 [[package]]
 name = "regex"
-version = "1.10.6"
+version = "1.11.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4219d74c6b67a3654a9fbebc4b419e22126d13d2f3c4a07ee0cb61ff79a79619"
+checksum = "38200e5ee88914975b69f657f0801b6f6dccafd44fd9326302a4aaeecfacb1d8"
 dependencies = [
  "aho-corasick",
  "memchr",
@@ -3896,9 +3710,9 @@ dependencies = [
 
 [[package]]
 name = "regex-automata"
-version = "0.4.7"
+version = "0.4.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "38caf58cc5ef2fed281f89292ef23f6365465ed9a41b7a7754eb4e26496c92df"
+checksum = "368758f23274712b504848e9d5a6f010445cc8b87a7cdb4d7cbee666c1288da3"
 dependencies = [
  "aho-corasick",
  "memchr",
@@ -3907,9 +3721,9 @@ dependencies = [
 
 [[package]]
 name = "regex-syntax"
-version = "0.8.4"
+version = "0.8.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7a66a03ae7c801facd77a29370b4faec201768915ac14a721ba36f20bc9c209b"
+checksum = "2b15c43186be67a4fd63bee50d0303afffcef381492ebe2c5d87f324e1b8815c"
 
 [[package]]
 name = "renderdoc-sys"
@@ -3946,9 +3760,9 @@ dependencies = [
 
 [[package]]
 name = "rgb"
-version = "0.8.45"
+version = "0.8.50"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ade4539f42266ded9e755c605bdddf546242b2c961b03b06a7375260788a0523"
+checksum = "57397d16646700483b67d2dd6511d79318f9d057fdbd21a4066aeac8b41d310a"
 dependencies = [
  "bytemuck",
 ]
@@ -3991,18 +3805,6 @@ dependencies = [
  "smallvec",
 ]
 
-[[package]]
-name = "rust-fontconfig"
-version = "0.1.7"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ea6002602a06c22f5f4e5ea2ed68854bfce071b48e1092c03874e34d0b59eb4b"
-dependencies = [
- "allsorts",
- "mmapio",
- "rayon",
- "xmlparser",
-]
-
 [[package]]
 name = "rustc-demangle"
 version = "0.1.24"
@@ -4015,11 +3817,20 @@ version = "1.1.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "08d43f7aa6b08d49f382cde6a7982047c3426db949b1424bc4b7ec9ae12c6ce2"
 
+[[package]]
+name = "rustc_version"
+version = "0.4.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "cfcb3a22ef46e85b45de6ee7e79d063319ebb6594faafcf1c225ea92ab6e9b92"
+dependencies = [
+ "semver",
+]
+
 [[package]]
 name = "rustix"
-version = "0.38.34"
+version = "0.38.37"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "70dc5ec042f7a43c4a73241207cecc9873a06d45debb38b329f8541d85c2730f"
+checksum = "8acb788b847c24f28525660c4d7758620a7210875711f79e7f663cc152726811"
 dependencies = [
  "bitflags 2.6.0",
  "errno",
@@ -4030,9 +3841,9 @@ dependencies = [
 
 [[package]]
 name = "rustls"
-version = "0.23.12"
+version = "0.23.13"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c58f8c84392efc0a126acce10fa59ff7b3d2ac06ab451a33f2741989b806b044"
+checksum = "f2dabaac7466917e566adb06783a81ca48944c6898a1b08b9374106dd671f4c8"
 dependencies = [
  "log",
  "once_cell",
@@ -4045,15 +3856,15 @@ dependencies = [
 
 [[package]]
 name = "rustls-pki-types"
-version = "1.7.0"
+version = "1.9.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "976295e77ce332211c0d24d92c0e83e50f5c5f046d11082cea19f3df13a3562d"
+checksum = "0e696e35370c65c9c541198af4543ccd580cf17fc25d8e05c5a242b202488c55"
 
 [[package]]
 name = "rustls-webpki"
-version = "0.102.6"
+version = "0.102.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8e6b52d4fda176fd835fdc55a835d4a89b8499cad995885a21149d5ad62f852e"
+checksum = "64ca1bc8749bd4cf37b5ce386cc146580777b4e8572c7b97baf22c83f444bee9"
 dependencies = [
  "ring",
  "rustls-pki-types",
@@ -4134,6 +3945,12 @@ dependencies = [
  "tiny-skia",
 ]
 
+[[package]]
+name = "semver"
+version = "1.0.23"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "61697e0a1c7e512e84a621326239844a24d8207b4669b41bc18b32ea5cbf988b"
+
 [[package]]
 name = "serde"
 version = "1.0.210"
@@ -4151,7 +3968,7 @@ checksum = "243902eda00fad750862fc144cea25caca5e20d615af0a81bee94ca738f1df1f"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -4169,9 +3986,9 @@ dependencies = [
 
 [[package]]
 name = "serde_spanned"
-version = "0.6.7"
+version = "0.6.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "eb5b1b31579f3811bf615c144393417496f152e12ac8b7663bf664f4a815306d"
+checksum = "87607cb1398ed59d48732e575a4c28a7a8ebf2454b964fe3f224f2afc07909e1"
 dependencies = [
  "serde",
 ]
@@ -4416,9 +4233,9 @@ checksum = "20e16a0f46cf5fd675563ef54f26e83e20f2366bcf027bcb3cc3ed2b98aaf2ca"
 
 [[package]]
 name = "svgtypes"
-version = "0.15.1"
+version = "0.15.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "fae3064df9b89391c9a76a0425a69d124aee9c5c28455204709e72c39868a43c"
+checksum = "794de53cc48eaabeed0ab6a3404a65f40b3e38c067e4435883a65d2aa4ca000e"
 dependencies = [
  "kurbo",
  "siphasher 1.0.1",
@@ -4448,9 +4265,9 @@ dependencies = [
 
 [[package]]
 name = "syn"
-version = "2.0.77"
+version = "2.0.79"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9f35bcdf61fd8e7be6caf75f429fdca8beb3ed76584befb503b1569faee373ed"
+checksum = "89132cd0bf050864e1d38dc3bbc07a0eb8e7530af26344d3d2bbbef83499f590"
 dependencies = [
  "proc-macro2",
  "quote",
@@ -4465,7 +4282,7 @@ checksum = "c8af7666ab7b6390ab78131fb5b0fce11d6b7a6951602017c35fa82800708971"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -4475,7 +4292,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "a3e535eb8dded36d55ec13eddacd30dec501792ff23a0b1682c38601b8cf2349"
 dependencies = [
  "cfg-expr",
- "heck 0.5.0",
+ "heck",
  "pkg-config",
  "toml",
  "version-compare",
@@ -4487,7 +4304,7 @@ version = "0.5.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "9cb893bff0f80ae17d3a57e030622a967b8dbc90e38284d9b4b1442e23873c94"
 dependencies = [
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "grid",
  "num-traits",
  "serde",
@@ -4527,7 +4344,7 @@ dependencies = [
  "cfg-if",
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -4538,7 +4355,7 @@ checksum = "5c89e72a01ed4c579669add59014b9a524d609c0c88c6a585ce37485879f6ffb"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
  "test-case-core",
 ]
 
@@ -4568,7 +4385,7 @@ checksum = "08904e7672f5eb876eaaf87e0ce17857500934f4981c4a0ab2b4aa98baac7fc3"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -4622,7 +4439,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "83d13394d44dae3207b52a326c0c85a8bf87f1541f23b0d143811088497b09ab"
 dependencies = [
  "arrayref",
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "bytemuck",
  "cfg-if",
  "log",
@@ -4678,9 +4495,9 @@ checksum = "1f3ccbac311fea05f86f61904b462b55fb3df8837a366dfc601a0161d0532f20"
 
 [[package]]
 name = "tokio"
-version = "1.39.2"
+version = "1.40.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "daa4fb1bc778bd6f04cbfc4bb2d06a7396a8f299dc33ea1900cedaa316f467b1"
+checksum = "e2b070231665d27ad9ec9b8df639893f46727666c6767db40317fbe920a5d998"
 dependencies = [
  "backtrace",
  "bytes",
@@ -4693,14 +4510,14 @@ dependencies = [
 
 [[package]]
 name = "toml"
-version = "0.8.17"
+version = "0.8.19"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7a44eede9b727419af8095cb2d72fab15487a541f54647ad4414b34096ee4631"
+checksum = "a1ed1f98e3fdc28d6d910e6737ae6ab1a93bf1985935a1193e68f93eeb68d24e"
 dependencies = [
  "serde",
  "serde_spanned",
  "toml_datetime",
- "toml_edit 0.22.18",
+ "toml_edit",
 ]
 
 [[package]]
@@ -4714,26 +4531,15 @@ dependencies = [
 
 [[package]]
 name = "toml_edit"
-version = "0.21.1"
+version = "0.22.22"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6a8534fd7f78b5405e860340ad6575217ce99f38d4d5c8f2442cb5ecb50090e1"
-dependencies = [
- "indexmap",
- "toml_datetime",
- "winnow 0.5.40",
-]
-
-[[package]]
-name = "toml_edit"
-version = "0.22.18"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1490595c74d930da779e944f5ba2ecdf538af67df1a9848cbd156af43c1b7cf0"
+checksum = "4ae48d6208a266e853d946088ed816055e556cc6028c5e8e2b84d9fa5dd7c7f5"
 dependencies = [
  "indexmap",
  "serde",
  "serde_spanned",
  "toml_datetime",
- "winnow 0.6.16",
+ "winnow",
 ]
 
 [[package]]
@@ -4755,7 +4561,7 @@ checksum = "34704c8d6ebcbc939824180af020566b01a7c01f80641264eba0999f6c2b6be7"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -4788,12 +4594,6 @@ version = "1.17.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "42ff0bf0c66b8238c6f3b578df37d0b7848e55df8577b3f74f92a69acceeb825"
 
-[[package]]
-name = "ucd-trie"
-version = "0.1.6"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ed646292ffc8188ef8ea4d1e0e0150fb15a5c2e12ad9b8fc191ae7a8a7f3c4b9"
-
 [[package]]
 name = "unicode-bidi"
 version = "0.3.15"
@@ -4812,12 +4612,6 @@ version = "0.3.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "64af057ad7466495ca113126be61838d8af947f41d93a949980b2389a118082f"
 
-[[package]]
-name = "unicode-canonical-combining-class"
-version = "0.5.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6925586af9268182c711e47c0853ed84131049efaca41776d0ca97f983865c32"
-
 [[package]]
 name = "unicode-ccc"
 version = "0.2.0"
@@ -4830,50 +4624,38 @@ version = "0.3.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "260bc6647b3893a9a90668360803a15f96b85a5257b1c3a0c3daf6ae2496de42"
 
-[[package]]
-name = "unicode-general-category"
-version = "0.6.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2281c8c1d221438e373249e065ca4989c4c36952c211ff21a0ee91c44a3869e7"
-
 [[package]]
 name = "unicode-ident"
-version = "1.0.12"
+version = "1.0.13"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3354b9ac3fae1ff6755cb6db53683adb661634f67557942dea4facebec0fee4b"
-
-[[package]]
-name = "unicode-joining-type"
-version = "0.7.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "22f8cb47ccb8bc750808755af3071da4a10dcd147b68fc874b7ae4b12543f6f5"
+checksum = "e91b56cd4cadaeb79bbf1a5645f6b4f8dc5bde8834ad5894a8db35fda9efa1fe"
 
 [[package]]
 name = "unicode-normalization"
-version = "0.1.23"
+version = "0.1.24"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a56d1686db2308d901306f92a263857ef59ea39678a5458e7cb17f01415101f5"
+checksum = "5033c97c4262335cded6d6fc3e5c18ab755e1a3dc96376350f3d8e9f009ad956"
 dependencies = [
  "tinyvec",
 ]
 
 [[package]]
 name = "unicode-properties"
-version = "0.1.1"
+version = "0.1.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e4259d9d4425d9f0661581b804cb85fe66a4c631cadd8f490d1c13a35d5d9291"
+checksum = "52ea75f83c0137a9b98608359a5f1af8144876eb67bcb1ce837368e906a9f524"
 
 [[package]]
 name = "unicode-script"
-version = "0.5.6"
+version = "0.5.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ad8d71f5726e5f285a935e9fe8edfd53f0491eb6e9a5774097fdabee7cd8c9cd"
+checksum = "9fb421b350c9aff471779e262955939f565ec18b86c15364e6bdf0d662ca7c1f"
 
 [[package]]
 name = "unicode-segmentation"
-version = "1.11.0"
+version = "1.12.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d4c87d22b6e3f4a18d4d40ef354e97c90fcb14dd91d7dc0aa9d8a1172ebf7202"
+checksum = "f6ccf251212114b54433ec949fd6a7841275f9ada20dddd2f29e9ceea4501493"
 
 [[package]]
 name = "unicode-vo"
@@ -4883,15 +4665,15 @@ checksum = "b1d386ff53b415b7fe27b50bb44679e2cc4660272694b7b6f3326d8480823a94"
 
 [[package]]
 name = "unicode-width"
-version = "0.1.13"
+version = "0.1.14"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0336d538f7abc86d282a4189614dfaa90810dfc2c6f6427eaf88e16311dd225d"
+checksum = "7dd6e30e90baa6f72411720665d41d89b9a3d039dc45b8faea1ddd07f617f6af"
 
 [[package]]
 name = "unicode-xid"
-version = "0.2.4"
+version = "0.2.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f962df74c8c05a667b5ee8bcf162993134c104e96440b663c8daa176dc772d8c"
+checksum = "ebc1c04c71510c7f702b52b7c350734c9ff1295c464a03335b00bb84fc54f853"
 
 [[package]]
 name = "universal-hash"
@@ -5019,7 +4801,7 @@ dependencies = [
  "miniz_oxide 0.7.4",
  "once_cell",
  "paste",
- "which 6.0.2",
+ "which 6.0.3",
 ]
 
 [[package]]
@@ -5180,7 +4962,7 @@ dependencies = [
  "once_cell",
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
  "wasm-bindgen-shared",
 ]
 
@@ -5214,7 +4996,7 @@ checksum = "afc340c74d9005395cf9dd098506f7f44e38f2b4a21c6aaacf9a105ea5e1e836"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
  "wasm-bindgen-backend",
  "wasm-bindgen-shared",
 ]
@@ -5248,14 +5030,14 @@ checksum = "4b8220be1fa9e4c889b30fd207d4906657e7e90b12e0e6b0c8b8d8709f5de021"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
 name = "wayland-backend"
-version = "0.3.6"
+version = "0.3.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f90e11ce2ca99c97b940ee83edbae9da2d56a08f9ea8158550fd77fa31722993"
+checksum = "056535ced7a150d45159d3a8dc30f91a2e2d588ca0b23f70e56033622b8016f6"
 dependencies = [
  "cc",
  "downcast-rs",
@@ -5267,9 +5049,9 @@ dependencies = [
 
 [[package]]
 name = "wayland-client"
-version = "0.31.5"
+version = "0.31.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7e321577a0a165911bdcfb39cf029302479d7527b517ee58ab0f6ad09edf0943"
+checksum = "e3f45d1222915ef1fd2057220c1d9d9624b7654443ea35c3877f7a52bd0a5a2d"
 dependencies = [
  "bitflags 2.6.0",
  "rustix",
@@ -5290,9 +5072,9 @@ dependencies = [
 
 [[package]]
 name = "wayland-cursor"
-version = "0.31.5"
+version = "0.31.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6ef9489a8df197ebf3a8ce8a7a7f0a2320035c3743f3c1bd0bdbccf07ce64f95"
+checksum = "3a94697e66e76c85923b0d28a0c251e8f0666f58fc47d316c0f4da6da75d37cb"
 dependencies = [
  "rustix",
  "wayland-client",
@@ -5301,9 +5083,9 @@ dependencies = [
 
 [[package]]
 name = "wayland-protocols"
-version = "0.32.3"
+version = "0.32.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "62989625a776e827cc0f15d41444a3cea5205b963c3a25be48ae1b52d6b4daaa"
+checksum = "2b5755d77ae9040bb872a25026555ce4cb0ae75fd923e90d25fba07d81057de0"
 dependencies = [
  "bitflags 2.6.0",
  "wayland-backend",
@@ -5313,9 +5095,9 @@ dependencies = [
 
 [[package]]
 name = "wayland-protocols-plasma"
-version = "0.3.3"
+version = "0.3.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f79f2d57c7fcc6ab4d602adba364bf59a5c24de57bd194486bf9b8360e06bfc4"
+checksum = "8a0a41a6875e585172495f7a96dfa42ca7e0213868f4f15c313f7c33221a7eff"
 dependencies = [
  "bitflags 2.6.0",
  "wayland-backend",
@@ -5326,9 +5108,9 @@ dependencies = [
 
 [[package]]
 name = "wayland-protocols-wlr"
-version = "0.3.3"
+version = "0.3.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "fd993de54a40a40fbe5601d9f1fbcaef0aebcc5fda447d7dc8f6dcbaae4f8953"
+checksum = "dad87b5fd1b1d3ca2f792df8f686a2a11e3fe1077b71096f7a175ab699f89109"
 dependencies = [
  "bitflags 2.6.0",
  "wayland-backend",
@@ -5339,9 +5121,9 @@ dependencies = [
 
 [[package]]
 name = "wayland-scanner"
-version = "0.31.4"
+version = "0.31.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d7b56f89937f1cf2ee1f1259cf2936a17a1f45d8f0aa1019fae6d470d304cfa6"
+checksum = "597f2001b2e5fc1121e3d5b9791d3e78f05ba6bfa4641053846248e3a13661c3"
 dependencies = [
  "proc-macro2",
  "quick-xml",
@@ -5350,9 +5132,9 @@ dependencies = [
 
 [[package]]
 name = "wayland-sys"
-version = "0.31.4"
+version = "0.31.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "43676fe2daf68754ecf1d72026e4e6c15483198b5d24e888b74d3f22f887a148"
+checksum = "efa8ac0d8e8ed3e3b5c9fc92c7881406a268e11555abe36493efabe649a29e09"
 dependencies = [
  "dlib",
  "log",
@@ -5382,9 +5164,9 @@ dependencies = [
 
 [[package]]
 name = "webpki-roots"
-version = "0.26.3"
+version = "0.26.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "bd7c23921eeb1713a4e851530e9b9756e4fb0e89978582942612524cf09f01cd"
+checksum = "841c67bff177718f1d4dfefde8d8f0e78f9b6589319ba88312f567fc5841a958"
 dependencies = [
  "rustls-pki-types",
 ]
@@ -5401,7 +5183,7 @@ version = "22.1.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e1d1c4ba43f80542cf63a0a6ed3134629ae73e8ab51e4b765a67f3aa062eb433"
 dependencies = [
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "cfg_aliases 0.1.1",
  "document-features",
  "js-sys",
@@ -5426,7 +5208,7 @@ version = "22.1.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0348c840d1051b8e86c3bcd31206080c5e71e5933dabd79be1ce732b0b2f089a"
 dependencies = [
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "bit-vec 0.7.0",
  "bitflags 2.6.0",
  "cfg_aliases 0.1.1",
@@ -5452,7 +5234,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "f6bbf4b4de8b2a83c0401d9e5ae0080a2792055f25859a02bf9be97952bbed4f"
 dependencies = [
  "android_system_properties",
- "arrayvec 0.7.4",
+ "arrayvec 0.7.6",
  "ash",
  "bit-set 0.6.0",
  "bitflags 2.6.0",
@@ -5515,9 +5297,9 @@ dependencies = [
 
 [[package]]
 name = "which"
-version = "6.0.2"
+version = "6.0.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3d9c5ed668ee1f17edb3b627225343d210006a90bb1e3745ce1f30b1fb115075"
+checksum = "b4ee928febd44d98f2f459a4a79bd4d928591333a494a10a868418ac1b39cf1f"
 dependencies = [
  "either",
  "home",
@@ -5555,11 +5337,11 @@ checksum = "ac3b87c63620426dd9b991e5ce0329eff545bccbbb34f3be09ff6fb6ab51b7b6"
 
 [[package]]
 name = "winapi-util"
-version = "0.1.8"
+version = "0.1.9"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4d4cc384e1e73b93bafa6fb4f1df8c41695c8a91cf9c4c64358067d15a7b6c6b"
+checksum = "cf221c93e13a30d793f7645a0e7762c55d169dbb0a49671918a2319d289b10bb"
 dependencies = [
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]
 
 [[package]]
@@ -5614,6 +5396,15 @@ dependencies = [
  "windows-targets 0.52.6",
 ]
 
+[[package]]
+name = "windows-sys"
+version = "0.59.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1e38bc4d79ed67fd075bcc251a1c39b32a1776bbe92e5bef1f0bf1f8c531853b"
+dependencies = [
+ "windows-targets 0.52.6",
+]
+
 [[package]]
 name = "windows-targets"
 version = "0.42.2"
@@ -5798,7 +5589,7 @@ version = "0.30.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0be9e76a1f1077e04a411f0b989cbd3c93339e1771cb41e71ac4aee95bfd2c67"
 dependencies = [
- "ahash 0.8.11",
+ "ahash",
  "android-activity",
  "atomic-waker",
  "bitflags 2.6.0",
@@ -5846,18 +5637,9 @@ dependencies = [
 
 [[package]]
 name = "winnow"
-version = "0.5.40"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f593a95398737aeed53e489c785df13f3618e41dbcd6718c6addbf1395aa6876"
-dependencies = [
- "memchr",
-]
-
-[[package]]
-name = "winnow"
-version = "0.6.16"
+version = "0.6.20"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b480ae9340fc261e6be3e95a1ba86d54ae3f9171132a73ce8d4bbaf68339507c"
+checksum = "36c1fec1a2bb5866f07c25f68c26e565c4c200aebb96d7e55710c19d3e8ac49b"
 dependencies = [
  "memchr",
 ]
@@ -5927,9 +5709,9 @@ checksum = "ec107c4503ea0b4a98ef47356329af139c0a4f7750e621cf2973cd3385ebcb3d"
 
 [[package]]
 name = "xcursor"
-version = "0.3.6"
+version = "0.3.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d491ee231a51ae64a5b762114c3ac2104b967aadba1de45c86ca42cf051513b7"
+checksum = "0ef33da6b1660b4ddbfb3aef0ade110c8b8a781a3b6382fa5f2b5b040fd55f61"
 
 [[package]]
 name = "xkbcommon-dl"
@@ -5952,15 +5734,9 @@ checksum = "b9cc00251562a284751c9973bace760d86c0276c471b4be569fe6b068ee97a56"
 
 [[package]]
 name = "xml-rs"
-version = "0.8.20"
+version = "0.8.22"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "791978798f0597cfc70478424c2b4fdc2b7a8024aaff78497ef00f24ef674193"
-
-[[package]]
-name = "xmlparser"
-version = "0.13.6"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "66fee0b777b0f5ac1c69bb06d361268faafa61cd4682ae064a171c16c433e9e4"
+checksum = "af4e2e2f7cba5a093896c1e150fbfe177d1883e7448200efb81d40b9d339ef26"
 
 [[package]]
 name = "xmlwriter"
@@ -5994,7 +5770,7 @@ checksum = "28cc31741b18cb6f1d5ff12f5b7523e3d6eb0852bbbad19d73905511d9849b95"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
  "synstructure",
 ]
 
@@ -6004,34 +5780,14 @@ version = "0.2.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "dd15f8e0dbb966fd9245e7498c7e9e5055d9e5c8b676b95bd67091cd11a1e697"
 
-[[package]]
-name = "zerocopy"
-version = "0.6.6"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "854e949ac82d619ee9a14c66a1b674ac730422372ccb759ce0c39cabcf2bf8e6"
-dependencies = [
- "byteorder",
- "zerocopy-derive 0.6.6",
-]
-
 [[package]]
 name = "zerocopy"
 version = "0.7.35"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1b9b4fd18abc82b8136838da5d50bae7bdea537c574d8dc1a34ed098d6c166f0"
 dependencies = [
- "zerocopy-derive 0.7.35",
-]
-
-[[package]]
-name = "zerocopy-derive"
-version = "0.6.6"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "125139de3f6b9d625c39e2efdd73d41bdac468ccd556556440e322be0e1bbd91"
-dependencies = [
- "proc-macro2",
- "quote",
- "syn 2.0.77",
+ "byteorder",
+ "zerocopy-derive",
 ]
 
 [[package]]
@@ -6042,7 +5798,7 @@ checksum = "fa4f8080344d4671fb4e831a13ad1e68092748387dfc4f55e356242fae12ce3e"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
@@ -6062,7 +5818,7 @@ checksum = "0ea7b4a3637ea8669cedf0f1fd5c286a17f3de97b8dd5a70a6c167a1730e63a5"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
  "synstructure",
 ]
 
@@ -6091,7 +5847,7 @@ checksum = "6eafa6dfb17584ea3e2bd6e76e0cc15ad7af12b09abdd1ca55961bed9b1063c6"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.77",
+ "syn 2.0.79",
 ]
 
 [[package]]
diff --git a/Cargo.toml b/Cargo.toml
index 17fe717c1..fa96aad2b 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -31,7 +31,6 @@ gosub_shared = { path = "./crates/gosub_shared", features = [] }
 gosub_config = { path = "./crates/gosub_config", features = [] }
 gosub_html5 = { path = "./crates/gosub_html5", features = [] }
 gosub_css3 = { path = "./crates/gosub_css3", features = [] }
-gosub_styling = { path = "./crates/gosub_styling", features = [] }
 gosub_jsapi = { path = "./crates/gosub_jsapi", features = [] }
 gosub_testing = { path = "./crates/gosub_testing", features = [] }
 gosub_rendering = { path = "crates/gosub_render_utils", features = [] }
diff --git a/benches/tree_iterator.rs b/benches/tree_iterator.rs
index 0532ab999..639246007 100644
--- a/benches/tree_iterator.rs
+++ b/benches/tree_iterator.rs
@@ -1,10 +1,13 @@
 use std::fs::File;
 
 use criterion::{criterion_group, criterion_main, Criterion};
-use gosub_html5::node::NodeId;
-use gosub_html5::parser::document::{Document, DocumentBuilder, TreeIterator};
+use gosub_css3::system::Css3System;
+use gosub_html5::document::builder::DocumentBuilderImpl;
+use gosub_html5::document::document_impl::TreeIterator;
 use gosub_html5::parser::Html5Parser;
 use gosub_shared::byte_stream::{ByteStream, Encoding};
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::document::DocumentBuilder;
 
 fn wikipedia_main_page(c: &mut Criterion) {
     // Criterion can report inconsistent results from run to run in some cases.  We attempt to
@@ -17,13 +20,12 @@ fn wikipedia_main_page(c: &mut Criterion) {
     let mut stream = ByteStream::new(Encoding::UTF8, None);
     let _ = stream.read_from_file(html_file);
 
-    let main_document = DocumentBuilder::new_document(None);
-    let document = Document::clone(&main_document);
-    let _ = Html5Parser::parse_document(&mut stream, document, None);
+    let doc_handle = <DocumentBuilderImpl as DocumentBuilder<Css3System>>::new_document(None);
+    let _ = Html5Parser::parse_document(&mut stream, doc_handle.clone(), None);
 
     group.bench_function("wikipedia main page", |b| {
         b.iter(|| {
-            let tree_iterator = TreeIterator::new(&main_document);
+            let tree_iterator = TreeIterator::new(doc_handle.clone());
             let _ = tree_iterator.collect::<Vec<NodeId>>();
         })
     });
@@ -43,13 +45,12 @@ fn stackoverflow_home(c: &mut Criterion) {
     let mut bytestream = ByteStream::new(Encoding::UTF8, None);
     let _ = bytestream.read_from_file(html_file);
 
-    let main_document = DocumentBuilder::new_document(None);
-    let document = Document::clone(&main_document);
-    let _ = Html5Parser::parse_document(&mut bytestream, document, None);
+    let doc_handle = <DocumentBuilderImpl as DocumentBuilder<Css3System>>::new_document(None);
+    let _ = Html5Parser::parse_document(&mut bytestream, doc_handle.clone(), None);
 
     group.bench_function("stackoverflow home", |b| {
         b.iter(|| {
-            let tree_iterator = TreeIterator::new(&main_document);
+            let tree_iterator = TreeIterator::new(doc_handle.clone());
             let _ = tree_iterator.collect::<Vec<NodeId>>();
         })
     });
diff --git a/crates/gosub_bindings/.gitignore b/crates/gosub_bindings/.gitignore
deleted file mode 100644
index e9b24178c..000000000
--- a/crates/gosub_bindings/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-libgosub.a
-lib/
-*.dSYM
diff --git a/crates/gosub_bindings/Cargo.toml b/crates/gosub_bindings/Cargo.toml
deleted file mode 100644
index e6d390d72..000000000
--- a/crates/gosub_bindings/Cargo.toml
+++ /dev/null
@@ -1,14 +0,0 @@
-[package]
-name = "gosub_bindings"
-version = "0.1.0"
-edition = "2021"
-authors = ["Gosub Community <info@gosub.io>"]
-license = "MIT"
-
-[dependencies]
-gosub_shared = { path = "../gosub_shared" }
-gosub_rendering = { path = "../gosub_render_utils" }
-gosub_html5 = { path = "../gosub_html5" }
-
-[lib]
-crate-type = ["staticlib"]
diff --git a/crates/gosub_bindings/Makefile b/crates/gosub_bindings/Makefile
deleted file mode 100644
index 796c1fe1b..000000000
--- a/crates/gosub_bindings/Makefile
+++ /dev/null
@@ -1,54 +0,0 @@
-# "global" compile settings
-
-# compilation mode Release or Debug
-MODE?=Release
-
-CFLAGS_DEBUG := -std=c99 -g -Wall -Wextra -O0
-CFLAGS_RELEASE := -std=c99 -Wall -Wextra -O2
-
-TARGET_DIR_DEBUG := ../../target/debug
-TARGET_DIR_RELEASE := ../../target/release
-
-ifeq ($(MODE), Release)
-$(info ***** COMPILING IN RELEASE MODE *****)
-CFLAGS = $(CFLAGS_RELEASE)
-TARGET_DIR = $(TARGET_DIR_RELEASE)
-else ifeq ($(MODE), Debug)
-$(info ***** COMPILING IN DEBUG MODE *****)
-CFLAGS = $(CFLAGS_DEBUG)
-TARGET_DIR = $(TARGET_DIR_DEBUG)
-else
-$(warning ***** UNKNOWN MODE. DEFAULTING TO RELEASE MODE *****)
-CFLAGS = $(CFLAGS_RELEASE)
-TARGET_DIR = $(TARGET_DIR_RELEASE)
-endif
-
-CC := gcc
-
-INCLUDE_DIR := include
-SRC_DIR := src
-NODE_SRC_DIR := $(SRC_DIR)/nodes
-
-CPPFLAGS := -I$(INCLUDE_DIR) -I$(INCLUDE_DIR)/nodes
-LDFLAGS := -L$(TARGET_DIR)
-
-bindings: # build gosub static library to be used externally
-ifeq ($(MODE), Debug)
-	cargo build
-else
-	cargo build --release
-endif
-	$(CC) $(CFLAGS) $(CPPFLAGS) -c $(SRC_DIR)/gosub_api.c $(SRC_DIR)/nodes.c $(NODE_SRC_DIR)/text.c
-	ar rcs libgosub.a gosub_api.o nodes.o text.o
-	rm *.o
-	test -d lib || mkdir lib
-	cp $(TARGET_DIR)/libgosub_bindings.a lib/
-	cp ./libgosub.a lib/
-
-TEST_SRC_DIR := tests
-test: # build and run tests for bindings
-	$(CC) $(TEST_SRC_DIR)/rendertree_test.c -L./ -lgosub $(LDFLAGS) -lgosub_bindings -lsqlite3 -lm -o $(TEST_SRC_DIR)/rendertree_test $(CPPFLAGS) $(CFLAGS)
-	./$(TEST_SRC_DIR)/rendertree_test
-
-format:
-	cargo clippy --fix --allow-dirty --allow-staged
diff --git a/crates/gosub_bindings/README.md b/crates/gosub_bindings/README.md
deleted file mode 100644
index 2323dbf43..000000000
--- a/crates/gosub_bindings/README.md
+++ /dev/null
@@ -1,18 +0,0 @@
-# Gosub Bindings
-These are bindings that expose some of Gosub's engine to the world via a C API. Typically these bindings will be used by user agents.
-
-## Building
-By default, the bindings will be built in release mode. You can modify this by specifying a `MODE` variable:
-```text
-export MODE=Debug # or MODE=Release (default)
-make bindings
-make test
-```
-
-or alternatively specify it manually (not recommended)
-```text
-make bindings MODE=Debug
-make test MODE=Debug
-```
-
-This approach is not recommended because if you forget to specify it, it will default to release mode and you may be using the wrong version.
diff --git a/crates/gosub_bindings/include/gosub_api.h b/crates/gosub_bindings/include/gosub_api.h
deleted file mode 100644
index c0a7389ab..000000000
--- a/crates/gosub_bindings/include/gosub_api.h
+++ /dev/null
@@ -1,37 +0,0 @@
-#ifndef GOSUB_API_H
-#define GOSUB_API_H
-
-#include "nodes.h"
-
-extern void *gosub_rendertree_init(const char *html);
-extern void *gosub_rendertree_iterator_init(void *rendertree);
-extern const void *gosub_rendertree_next_node(void *tree_iterator);
-extern void gosub_rendertree_get_node_data(const void *current_node,
-                                            struct node_t *node);
-extern void gosub_rendertree_iterator_free(void *tree_iterator);
-extern void gosub_rendertree_free(void *render_free);
-
-struct rendertree_t {
-  void *tree;
-  void *iterator;
-  const void *current_node;
-  struct node_t *data;
-};
-
-/// Initialize a render tree by passing a stack-allocated
-/// struct by address.
-/// Returns 0 on success or -1 if a failure occurred.
-int8_t rendertree_init(struct rendertree_t *rendertree, const char *html);
-
-/// Get the next node in the render tree as a read-only pointer.
-/// Returns NULL when reaching end of tree.
-const struct node_t *rendertree_next(struct rendertree_t *rendertree);
-
-/// Get the type of the current node the render tree is pointing to.
-enum node_type_e
-rendertree_get_current_node_type(const struct rendertree_t *rendertree);
-
-/// Free all memory tied to the render tree
-void rendertree_free(struct rendertree_t *rendertree);
-
-#endif
diff --git a/crates/gosub_bindings/include/nodes.h b/crates/gosub_bindings/include/nodes.h
deleted file mode 100644
index d4c55c369..000000000
--- a/crates/gosub_bindings/include/nodes.h
+++ /dev/null
@@ -1,42 +0,0 @@
-#ifndef GOSUB_API_NODES_H
-#define GOSUB_API_NODES_H
-
-#include <stdbool.h>
-#include <stddef.h> // for NULL (which is basically just 0... but more clear)
-#include <stdint.h>
-#include <stdlib.h>
-
-#include "nodes/text.h"
-#include "properties.h"
-
-struct node_t *rendertree_node_init();
-void rendertree_node_free(struct node_t **node);
-
-enum node_type_e { NODE_TYPE_ROOT = 0u, NODE_TYPE_TEXT };
-
-struct node_t {
-  enum node_type_e type;
-  struct position_t position;
-  struct rectangle_t margin;
-  struct rectangle_t padding;
-  union data {
-    bool root;               // NODE_TYPE_ROOT
-    struct node_text_t text; // NODE_TYPE_TEXT
-  } data;
-};
-
-struct node_t *rendertree_node_init();
-double rendertree_node_get_x(const struct node_t *node);
-double rendertree_node_get_y(const struct node_t *node);
-double rendertree_node_get_margin_top(const struct node_t *node);
-double rendertree_node_get_margin_left(const struct node_t *node);
-double rendertree_node_get_margin_right(const struct node_t *node);
-double rendertree_node_get_margin_bottom(const struct node_t *node);
-double rendertree_node_get_padding_top(const struct node_t *node);
-double rendertree_node_get_padding_left(const struct node_t *node);
-double rendertree_node_get_padding_right(const struct node_t *node);
-double rendertree_node_get_padding_bottom(const struct node_t *node);
-void rendertree_node_free_data(struct node_t *node);
-void rendertree_node_free(struct node_t **node);
-
-#endif
diff --git a/crates/gosub_bindings/include/nodes/text.h b/crates/gosub_bindings/include/nodes/text.h
deleted file mode 100644
index 9873a0193..000000000
--- a/crates/gosub_bindings/include/nodes/text.h
+++ /dev/null
@@ -1,25 +0,0 @@
-#ifndef GOSUB_API_NODES_TEXT_H
-#define GOSUB_API_NODES_TEXT_H
-
-#include <stdbool.h>
-#include <stdint.h>
-
-struct node_t;
-
-struct node_text_t {
-  // this tag is not used but is required to map properly from Rust
-  uint32_t tag;
-  char *value;
-  char *font;
-  double font_size;
-  bool is_bold;
-};
-
-void rendertree_node_text_free_data(struct node_text_t *text);
-
-const char *rendertree_node_text_get_value(const struct node_t *node);
-const char *rendertree_node_text_get_font(const struct node_t *node);
-double rendertree_node_text_get_font_size(const struct node_t *node);
-bool rendertree_node_text_get_bold(const struct node_t *node);
-
-#endif
diff --git a/crates/gosub_bindings/include/properties.h b/crates/gosub_bindings/include/properties.h
deleted file mode 100644
index d9502bf8d..000000000
--- a/crates/gosub_bindings/include/properties.h
+++ /dev/null
@@ -1,16 +0,0 @@
-#ifndef GOSUB_API_PROPERTIES_H
-#define GOSUB_API_PROPERTIES_H
-
-struct position_t {
-  double x;
-  double y;
-};
-
-struct rectangle_t {
-  double top;
-  double left;
-  double right;
-  double bottom;
-};
-
-#endif
diff --git a/crates/gosub_bindings/src/gosub_api.c b/crates/gosub_bindings/src/gosub_api.c
deleted file mode 100644
index 005a9c1e5..000000000
--- a/crates/gosub_bindings/src/gosub_api.c
+++ /dev/null
@@ -1,50 +0,0 @@
-#include "gosub_api.h"
-
-int8_t rendertree_init(struct rendertree_t *rendertree, const char *html) {
-
-  rendertree->tree = gosub_rendertree_init(html);
-  if (!rendertree->tree) {
-    return -1;
-  }
-
-  rendertree->iterator = gosub_rendertree_iterator_init(rendertree->tree);
-  if (!rendertree->iterator) {
-    gosub_rendertree_free(rendertree->tree);
-    return -1;
-  }
-
-  rendertree->current_node = NULL;
-
-  rendertree->data = rendertree_node_init();
-  if (!rendertree->data) {
-    gosub_rendertree_iterator_free(rendertree->iterator);
-    gosub_rendertree_free(rendertree->tree);
-    return -1;
-  }
-
-  return 0;
-}
-
-const struct node_t *rendertree_next(struct rendertree_t *rendertree) {
-  rendertree_node_free_data(rendertree->data);
-  rendertree->current_node =
-      gosub_rendertree_next_node(rendertree->iterator);
-  if (!rendertree->current_node)
-    return NULL;
-  gosub_rendertree_get_node_data(rendertree->current_node, rendertree->data);
-  return (const struct node_t *)rendertree->data;
-}
-
-enum node_type_e
-rendertree_get_current_node_type(const struct rendertree_t *rendertree) {
-  return rendertree->data->type;
-}
-
-void rendertree_free(struct rendertree_t *rendertree) {
-  gosub_rendertree_iterator_free(rendertree->iterator);
-  rendertree->iterator = NULL;
-  gosub_rendertree_free(rendertree->tree);
-  rendertree->tree = NULL;
-  rendertree_node_free(&rendertree->data);
-  rendertree->data = NULL;
-}
diff --git a/crates/gosub_bindings/src/lib.rs b/crates/gosub_bindings/src/lib.rs
deleted file mode 100644
index 0a61eb7c3..000000000
--- a/crates/gosub_bindings/src/lib.rs
+++ /dev/null
@@ -1,118 +0,0 @@
-use std::ffi::c_char;
-use std::ffi::CStr;
-use std::ptr;
-
-pub mod wrapper;
-
-use gosub_html5::parser::document::{Document, DocumentBuilder};
-use gosub_html5::parser::Html5Parser;
-use gosub_rendering::render_tree::{Node, NodeType, RenderTree, TreeIterator};
-use gosub_shared::byte_stream::{ByteStream, Encoding};
-use wrapper::node::CNode;
-
-/// Initialize a render tree and return an owning pointer to it.
-/// If the HTML fails to parse or the html string fails to be converted to Rust,
-/// returns a NULL pointer.
-///
-/// # Safety
-/// Takes a read-only pointer owned from the C API representing the HTML source
-/// to build a render tree. DO NOT take ownership of this pointer in Rust or the
-/// universe might collapse.
-///
-/// Moves an owning pointer to the rendertree using Box::into_raw() to the C API.
-/// This pointer MUST be passed to gosub_rendertree_free() after usage for proper cleanup.
-#[no_mangle]
-pub unsafe extern "C" fn gosub_rendertree_init(html: *const c_char) -> *mut RenderTree {
-    let html_str = unsafe {
-        if let Ok(html_str) = CStr::from_ptr(html).to_str() {
-            html_str
-        } else {
-            return ptr::null_mut();
-        }
-    };
-    let mut stream = ByteStream::new(Encoding::UTF8, None);
-    stream.read_from_str(html_str, Some(Encoding::UTF8));
-    stream.close();
-
-    let doc = DocumentBuilder::new_document(None);
-    let parse_result = Html5Parser::parse_document(&mut stream, Document::clone(&doc), None);
-
-    if parse_result.is_ok() {
-        let mut rendertree = Box::new(RenderTree::new(&doc));
-        rendertree.build();
-
-        Box::into_raw(rendertree)
-    } else {
-        ptr::null_mut()
-    }
-}
-
-/// Construct a tree iterator for a render tree and return an owning pointer to it.
-///
-/// # Safety
-/// Moves an owning pointer to the tree iterator using Box::into_raw() to the C API.
-/// This pointer MUST be passed to gosub_rendertree_iterator_free() after usage for proper cleanup.
-#[no_mangle]
-pub unsafe extern "C" fn gosub_rendertree_iterator_init(
-    rendertree: *const RenderTree,
-) -> *mut TreeIterator {
-    let tree_iterator = Box::new(TreeIterator::new(&(*rendertree)));
-    Box::into_raw(tree_iterator)
-}
-
-/// Takes a tree_iterator and returns a non-owning pointer to the next node
-///
-/// # Safety
-/// Takes a tree_iterator pointer (owned by the C API generated by gosub_rendertree_iterator_init())
-/// and modifies it to point to the next tree-order node in the tree. Any heap-allocated data
-/// on the current node is free'd before pointing to the next node. Returns a ready-only pointer
-/// to the next node.
-#[no_mangle]
-pub unsafe extern "C" fn gosub_rendertree_next_node(
-    tree_iterator: *mut TreeIterator,
-) -> *const Node {
-    let next = (*tree_iterator).next();
-    if let Some(next) = next {
-        next.as_ptr() as *const Node
-    } else {
-        ptr::null()
-    }
-}
-
-/// Fetch the node data according to the NodeType of the current node.
-///
-/// # Safety
-/// Uses a read-only pointer obtained from gosub_rendertree_next_node()
-/// and a mutable pointer owned by the C API to write (copy) the contents
-/// of the read-only pointer into the mutable pointer.
-#[no_mangle]
-pub unsafe extern "C" fn gosub_rendertree_get_node_data(node: *const Node, c_node: *mut CNode) {
-    // Change this to a match when we have more types
-    if let NodeType::Text(text_node) = &(*node).node_type {
-        *c_node = CNode::new_text(&*node, text_node);
-    }
-}
-
-/// Free the iterator pointer obtained from gosub_rendertree_iterator_init()
-///
-/// # Safety
-/// This takes ownership of the pointer from the C API and transfers it to Rust so it can
-/// be deallocated.
-#[no_mangle]
-pub unsafe extern "C" fn gosub_rendertree_iterator_free(tree_iterator: *mut TreeIterator) {
-    let _ = Box::from_raw(tree_iterator);
-}
-
-/// Free the rendertree pointer obtained from gosub_rendertree_init()
-///
-/// # Safety
-/// This takes ownership of the pointer from the C API and transfers it to Rust so it can
-/// be deallocated.
-///
-// INTERNAL NOTE: It seems there's a leak happening with the document handle (if you
-// check with valgrind) although I cannot figure out how to resolve this memory leak...
-// needs more investigation; I've tried various methods.
-#[no_mangle]
-pub unsafe extern "C" fn gosub_rendertree_free(rendertree: *mut RenderTree) {
-    let _ = Box::from_raw(rendertree);
-}
diff --git a/crates/gosub_bindings/src/nodes.c b/crates/gosub_bindings/src/nodes.c
deleted file mode 100644
index 4e88c52dd..000000000
--- a/crates/gosub_bindings/src/nodes.c
+++ /dev/null
@@ -1,67 +0,0 @@
-#include "nodes.h"
-
-struct node_t *rendertree_node_init() {
-  struct node_t *node = malloc(sizeof(*node));
-  if (!node)
-    return NULL;
-
-  node->type = NODE_TYPE_ROOT;
-  node->data.root = true; // dummy value
-
-  return node;
-}
-
-void rendertree_node_free_data(struct node_t *node) {
-  switch (node->type) {
-  case NODE_TYPE_ROOT:
-    break;
-  case NODE_TYPE_TEXT:
-    rendertree_node_text_free_data(&node->data.text);
-    break;
-  }
-}
-
-double rendertree_node_get_x(const struct node_t *node) {
-  return node->position.x;
-}
-
-double rendertree_node_get_y(const struct node_t *node) {
-  return node->position.y;
-}
-
-double rendertree_node_get_margin_top(const struct node_t *node) {
-  return node->margin.top;
-}
-
-double rendertree_node_get_margin_left(const struct node_t *node) {
-  return node->margin.left;
-}
-
-double rendertree_node_get_margin_right(const struct node_t *node) {
-  return node->margin.right;
-}
-
-double rendertree_node_get_margin_bottom(const struct node_t *node) {
-  return node->margin.bottom;
-}
-
-double rendertree_node_get_padding_top(const struct node_t *node) {
-  return node->padding.top;
-}
-
-double rendertree_node_get_padding_left(const struct node_t *node) {
-  return node->padding.left;
-}
-
-double rendertree_node_get_padding_right(const struct node_t *node) {
-  return node->padding.right;
-}
-
-double rendertree_node_get_padding_bottom(const struct node_t *node) {
-  return node->padding.bottom;
-}
-
-void rendertree_node_free(struct node_t **node) {
-  free(*node);
-  *node = NULL;
-}
diff --git a/crates/gosub_bindings/src/nodes/text.c b/crates/gosub_bindings/src/nodes/text.c
deleted file mode 100644
index 76780ce25..000000000
--- a/crates/gosub_bindings/src/nodes/text.c
+++ /dev/null
@@ -1,38 +0,0 @@
-#include "text.h"
-#include "nodes.h"
-
-void rendertree_node_text_free_data(struct node_text_t *text) {
-  free(text->value);
-  text->value = NULL;
-
-  free(text->font);
-  text->font = NULL;
-}
-
-const char *rendertree_node_text_get_value(const struct node_t *node) {
-  if (!node)
-    return NULL;
-
-  return (const char *)node->data.text.value;
-}
-
-const char *rendertree_node_text_get_font(const struct node_t *node) {
-  if (!node)
-    return NULL;
-
-  return (const char *)node->data.text.font;
-}
-
-double rendertree_node_text_get_font_size(const struct node_t *node) {
-  if (!node)
-    return 0.0;
-
-  return node->data.text.font_size;
-}
-
-bool rendertree_node_text_get_bold(const struct node_t *node) {
-  if (!node)
-    return false;
-
-  return node->data.text.is_bold;
-}
diff --git a/crates/gosub_bindings/src/wrapper.rs b/crates/gosub_bindings/src/wrapper.rs
deleted file mode 100644
index 705f04f73..000000000
--- a/crates/gosub_bindings/src/wrapper.rs
+++ /dev/null
@@ -1,9 +0,0 @@
-pub mod node;
-pub mod text;
-
-/// Numerical values that map rendertree::NodeType to C
-#[repr(C)]
-pub enum CNodeType {
-    Root = 0,
-    Text = 1,
-}
diff --git a/crates/gosub_bindings/src/wrapper/node.rs b/crates/gosub_bindings/src/wrapper/node.rs
deleted file mode 100644
index 10e35027f..000000000
--- a/crates/gosub_bindings/src/wrapper/node.rs
+++ /dev/null
@@ -1,47 +0,0 @@
-use gosub_rendering::render_tree::properties::{Position, Rectangle};
-use gosub_rendering::render_tree::{text::TextNode, Node};
-
-use crate::wrapper::{text::CTextNode, CNodeType};
-
-#[repr(C, u32)]
-pub enum CNodeData {
-    Root(bool),
-    Text(CTextNode),
-}
-
-#[repr(C)]
-pub struct CNode {
-    pub tag: CNodeType,
-    pub position: Position,
-    pub margin: Rectangle,
-    pub padding: Rectangle,
-    pub data: CNodeData,
-}
-
-impl Default for CNode {
-    fn default() -> Self {
-        Self {
-            tag: CNodeType::Root,
-            position: Position::new(),
-            margin: Rectangle::new(),
-            padding: Rectangle::new(),
-            data: CNodeData::Root(true),
-        }
-    }
-}
-
-impl CNode {
-    pub fn new_root() -> Self {
-        Self::default()
-    }
-
-    pub fn new_text(node: &Node, text_node: &TextNode) -> Self {
-        Self {
-            tag: CNodeType::Text,
-            position: node.position.clone(),
-            margin: node.margin.clone(),
-            padding: node.padding.clone(),
-            data: CNodeData::Text(CTextNode::from(text_node)),
-        }
-    }
-}
diff --git a/crates/gosub_bindings/src/wrapper/text.rs b/crates/gosub_bindings/src/wrapper/text.rs
deleted file mode 100644
index 78c89312b..000000000
--- a/crates/gosub_bindings/src/wrapper/text.rs
+++ /dev/null
@@ -1,28 +0,0 @@
-use gosub_rendering::render_tree::text::TextNode;
-use std::ffi::c_char;
-use std::ffi::CString;
-
-/// This is a C-friendly wrapper around gosub_render_utils::rendertree::text::TextNode
-/// that converts Rust Strings to owned pointers to pass to the C API.
-#[repr(C)]
-pub struct CTextNode {
-    pub value: *mut c_char,
-    pub font: *mut c_char,
-    pub font_size: f64,
-    pub is_bold: bool,
-}
-
-impl From<&TextNode> for CTextNode {
-    fn from(text_node: &TextNode) -> Self {
-        Self {
-            value: CString::new(text_node.value.clone().into_bytes())
-                .expect("Failed to allocate memory for text node value in CTextNode")
-                .into_raw(),
-            font: CString::new(text_node.font.clone().into_bytes())
-                .expect("Failed to allocate memory for text node font in CTextNode")
-                .into_raw(),
-            font_size: text_node.font_size,
-            is_bold: text_node.is_bold,
-        }
-    }
-}
diff --git a/crates/gosub_bindings/tests/rendertree_test.c b/crates/gosub_bindings/tests/rendertree_test.c
deleted file mode 100644
index dd8104214..000000000
--- a/crates/gosub_bindings/tests/rendertree_test.c
+++ /dev/null
@@ -1,121 +0,0 @@
-#include "gosub_api.h"
-#include <assert.h>
-#include <math.h>
-#include <stdio.h>
-#include <string.h>
-
-int main() {
-  const char *html = "<html>"
-                     "<h1>this is heading 1</h1>"
-                     "<h2>this is heading 2</h2>"
-                     "<h3>this is heading 3</h3>"
-                     "<h4>this is heading 4</h4>"
-                     "<h5>this is heading 5</h5>"
-                     "<h6>this is heading 6</h6>"
-                     "<p>this is a paragraph</p>"
-                     "</html>";
-  struct rendertree_t rendertree;
-  assert(rendertree_init(&rendertree, html) == 0);
-
-  const struct node_t *node = NULL;
-
-  // <html>
-  node = rendertree_next(&rendertree);
-  assert(node->type == NODE_TYPE_ROOT);
-
-  const double tol = 0.00001;
-
-  double y = 0.00;
-
-  // <h1>
-  node = rendertree_next(&rendertree);
-  y += rendertree_node_get_margin_top(node);
-  assert(node->type == NODE_TYPE_TEXT);
-  assert(strcmp(rendertree_node_text_get_value(node), "this is heading 1") == 0);
-  assert(strcmp(rendertree_node_text_get_font(node), "Times New Roman") == 0);
-  assert(fabs(rendertree_node_text_get_font_size(node) - 37.0) < tol);
-  assert(rendertree_node_text_get_bold(node) == true);
-  assert(fabs(rendertree_node_get_x(node) - 0.00) < tol);
-  assert(fabs(rendertree_node_get_y(node) - y) < tol);
-  y += (rendertree_node_text_get_font_size(node) + rendertree_node_get_margin_bottom(node));
-
-  // <h2>
-  node = rendertree_next(&rendertree);
-  y += rendertree_node_get_margin_top(node);
-  assert(node->type == NODE_TYPE_TEXT);
-  assert(strcmp(rendertree_node_text_get_value(node), "this is heading 2") == 0);
-  assert(strcmp(rendertree_node_text_get_font(node), "Times New Roman") == 0);
-  assert(fabs(rendertree_node_text_get_font_size(node) - 27.5) < tol);
-  assert(rendertree_node_text_get_bold(node) == true);
-  assert(fabs(rendertree_node_get_x(node) - 0.00) < tol);
-  assert(fabs(rendertree_node_get_y(node) - y) < tol);
-  y += (rendertree_node_text_get_font_size(node) + rendertree_node_get_margin_bottom(node));
-
-  // <h3>
-  node = rendertree_next(&rendertree);
-  y += rendertree_node_get_margin_top(node);
-  assert(node->type == NODE_TYPE_TEXT);
-  assert(strcmp(rendertree_node_text_get_value(node), "this is heading 3") == 0);
-  assert(strcmp(rendertree_node_text_get_font(node), "Times New Roman") == 0);
-  assert(fabs(rendertree_node_text_get_font_size(node) - 21.5) < tol);
-  assert(rendertree_node_text_get_bold(node) == true);
-  assert(fabs(rendertree_node_get_x(node) - 0.00) < tol);
-  assert(fabs(rendertree_node_get_y(node) - y) < tol);
-  y += (rendertree_node_text_get_font_size(node) + rendertree_node_get_margin_bottom(node));
-
-  // <h4>
-  node = rendertree_next(&rendertree);
-  y += rendertree_node_get_margin_top(node);
-  assert(node->type == NODE_TYPE_TEXT);
-  assert(strcmp(rendertree_node_text_get_value(node), "this is heading 4") == 0);
-  assert(strcmp(rendertree_node_text_get_font(node), "Times New Roman") == 0);
-  assert(fabs(rendertree_node_text_get_font_size(node) - 18.5) < tol);
-  assert(rendertree_node_text_get_bold(node) == true);
-  assert(fabs(rendertree_node_get_x(node) - 0.00) < tol);
-  assert(fabs(rendertree_node_get_y(node) - y) < tol);
-  y += (rendertree_node_text_get_font_size(node) + rendertree_node_get_margin_bottom(node));
-
-  // <h5>
-  node = rendertree_next(&rendertree);
-  y += rendertree_node_get_margin_top(node);
-  assert(node->type == NODE_TYPE_TEXT);
-  assert(strcmp(rendertree_node_text_get_value(node), "this is heading 5") == 0);
-  assert(strcmp(rendertree_node_text_get_font(node), "Times New Roman") == 0);
-  assert(fabs(rendertree_node_text_get_font_size(node) - 15.5) < tol);
-  assert(rendertree_node_text_get_bold(node) == true);
-  assert(fabs(rendertree_node_get_x(node) - 0.00) < tol);
-  assert(fabs(rendertree_node_get_y(node) - y) < tol);
-  y += (rendertree_node_text_get_font_size(node) + rendertree_node_get_margin_bottom(node));
-
-  // <h6>
-  node = rendertree_next(&rendertree);
-  y += rendertree_node_get_margin_top(node);
-  assert(node->type == NODE_TYPE_TEXT);
-  assert(strcmp(rendertree_node_text_get_value(node), "this is heading 6") == 0);
-  assert(strcmp(rendertree_node_text_get_font(node), "Times New Roman") == 0);
-  assert(fabs(rendertree_node_text_get_font_size(node) - 12.0) < tol);
-  assert(rendertree_node_text_get_bold(node) == true);
-  assert(fabs(rendertree_node_get_x(node) - 0.00) < tol);
-  assert(fabs(rendertree_node_get_y(node) - y) < tol);
-  y += (rendertree_node_text_get_font_size(node) + rendertree_node_get_margin_bottom(node));
-
-  // <p>
-  node = rendertree_next(&rendertree);
-  y += rendertree_node_get_margin_top(node);
-  assert(node->type == NODE_TYPE_TEXT);
-  assert(strcmp(rendertree_node_text_get_value(node), "this is a paragraph") == 0);
-  assert(strcmp(rendertree_node_text_get_font(node), "Times New Roman") == 0);
-  assert(fabs(rendertree_node_text_get_font_size(node) - 18.5) < tol);
-  assert(rendertree_node_text_get_bold(node) == false);
-  assert(fabs(rendertree_node_get_x(node) - 0.00) < tol);
-  assert(fabs(rendertree_node_get_y(node) - y) < tol);
-
-  // end of iterator, last node is free'd
-  node = rendertree_next(&rendertree);
-  assert(node == NULL);
-
-  rendertree_free(&rendertree);
-
-  printf("\033[0;32mrendertree_test.c: All assertions passed\n\033[0;30m");
-  return 0;
-}
diff --git a/crates/gosub_config/Cargo.toml b/crates/gosub_config/Cargo.toml
index 4cb6a1cdb..3d8ba12dd 100644
--- a/crates/gosub_config/Cargo.toml
+++ b/crates/gosub_config/Cargo.toml
@@ -2,6 +2,9 @@
 name = "gosub_config"
 version = "0.1.0"
 edition = "2021"
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
+
 
 [dependencies]
 gosub_shared = { path = "../gosub_shared", features = [] }
diff --git a/crates/gosub_config/src/lib.rs b/crates/gosub_config/src/lib.rs
index 40e5f9472..4129e4918 100644
--- a/crates/gosub_config/src/lib.rs
+++ b/crates/gosub_config/src/lib.rs
@@ -166,11 +166,7 @@ impl ConfigStore {
         // Find all keys, and add them to the configuration store
         if let Ok(all_settings) = self.storage.all() {
             for (key, value) in all_settings {
-                self.settings
-                    .lock()
-                    .unwrap()
-                    .borrow_mut()
-                    .insert(key, value);
+                self.settings.lock().unwrap().borrow_mut().insert(key, value);
             }
         }
     }
@@ -258,14 +254,12 @@ impl ConfigStore {
 
     /// Populates the settings in the storage from the settings.json file
     fn populate_default_settings(&mut self) -> Result<()> {
-        let json_data: Value =
-            serde_json::from_str(SETTINGS_JSON).expect("Failed to parse settings.json");
+        let json_data: Value = serde_json::from_str(SETTINGS_JSON).expect("Failed to parse settings.json");
 
         if let Value::Object(data) = json_data {
             for (section_prefix, section_entries) in &data {
                 let section_entries: Vec<JsonEntry> =
-                    serde_json::from_value(section_entries.clone())
-                        .expect("Failed to parse settings.json");
+                    serde_json::from_value(section_entries.clone()).expect("Failed to parse settings.json");
 
                 for entry in section_entries {
                     let key = format!("{}.{}", section_prefix, entry.key);
@@ -317,10 +311,7 @@ mod test {
             assert_eq!(captured_logs.len(), 0);
         });
 
-        config_store_write().set(
-            "dns.local.enabled",
-            Setting::String("wont accept strings".into()),
-        );
+        config_store_write().set("dns.local.enabled", Setting::String("wont accept strings".into()));
 
         testing_logger::validate(|captured_logs| {
             assert_eq!(captured_logs.len(), 1);
diff --git a/crates/gosub_config/src/settings.rs b/crates/gosub_config/src/settings.rs
index 56be2af6e..ec00529dd 100644
--- a/crates/gosub_config/src/settings.rs
+++ b/crates/gosub_config/src/settings.rs
@@ -118,8 +118,7 @@ impl<'de> Deserialize<'de> for Setting {
         D: Deserializer<'de>,
     {
         let value = String::deserialize(deserializer)?;
-        Setting::from_str(&value)
-            .map_err(|err| serde::de::Error::custom(format!("cannot deserialize: {err}")))
+        Setting::from_str(&value).map_err(|err| serde::de::Error::custom(format!("cannot deserialize: {err}")))
     }
 }
 
@@ -241,10 +240,7 @@ mod test {
         assert_eq!(vec!("hello world"), s.to_map());
 
         let s = Setting::from_str("m:foo,bar,baz").unwrap();
-        assert_eq!(
-            s,
-            Setting::Map(vec!["foo".into(), "bar".into(), "baz".into()])
-        );
+        assert_eq!(s, Setting::Map(vec!["foo".into(), "bar".into(), "baz".into()]));
         assert!(s.to_bool());
         assert_eq!(3, s.to_sint());
         assert_eq!(3, s.to_uint());
diff --git a/crates/gosub_config/src/storage/json.rs b/crates/gosub_config/src/storage/json.rs
index be43b5e62..967e81f99 100644
--- a/crates/gosub_config/src/storage/json.rs
+++ b/crates/gosub_config/src/storage/json.rs
@@ -105,9 +105,7 @@ impl JsonStorageAdapter {
         let json = serde_json::to_string_pretty(&self.elements).expect("failed to serialize");
 
         file.set_len(0).expect("failed to truncate file");
-        file.seek(std::io::SeekFrom::Start(0))
-            .expect("failed to seek");
-        file.write_all(json.as_bytes())
-            .expect("failed to write file");
+        file.seek(std::io::SeekFrom::Start(0)).expect("failed to seek");
+        file.write_all(json.as_bytes()).expect("failed to write file");
     }
 }
diff --git a/crates/gosub_config/src/storage/sqlite.rs b/crates/gosub_config/src/storage/sqlite.rs
index 8790f6283..16b23fc3a 100644
--- a/crates/gosub_config/src/storage/sqlite.rs
+++ b/crates/gosub_config/src/storage/sqlite.rs
@@ -52,9 +52,7 @@ impl StorageAdapter for SqliteStorageAdapter {
         let query = "INSERT OR REPLACE INTO settings (key, value) VALUES (:key, :value)";
         let mut statement = db_lock.prepare(query).unwrap();
         statement.bind((":key", key)).unwrap();
-        statement
-            .bind((":value", value.to_string().as_str()))
-            .unwrap();
+        statement.bind((":value", value.to_string().as_str())).unwrap();
 
         statement.next().unwrap();
     }
diff --git a/crates/gosub_css3/Cargo.toml b/crates/gosub_css3/Cargo.toml
index 4245b8ab1..a674f7ed7 100644
--- a/crates/gosub_css3/Cargo.toml
+++ b/crates/gosub_css3/Cargo.toml
@@ -7,8 +7,16 @@ license = "MIT"
 
 [dependencies]
 gosub_shared = { path = "../gosub_shared", features = [] }
-lazy_static = "1.5"
+lazy_static = "1.5.0"
 log = "0.4.22"
 simple_logger = "5.0.0"
 anyhow = { version = "1.0.89", features = [] }
-colors-transform = "0.2.11"
\ No newline at end of file
+colors-transform = "0.2.11"
+rand = "0.8.5"
+itertools = "0.13.0"
+
+[target.'cfg(not(target_arch = "wasm32"))'.dependencies]
+serde = { version = "1.0.210", features = ["derive"] }
+serde_json = "1.0.128"
+thiserror = "1.0.63"
+nom = "7.1.3"
diff --git a/crates/gosub_styling/resources/definitions/definitions.json b/crates/gosub_css3/resources/definitions/definitions.json
similarity index 100%
rename from crates/gosub_styling/resources/definitions/definitions.json
rename to crates/gosub_css3/resources/definitions/definitions.json
diff --git a/crates/gosub_styling/resources/definitions/definitions_at-rules.json b/crates/gosub_css3/resources/definitions/definitions_at-rules.json
similarity index 100%
rename from crates/gosub_styling/resources/definitions/definitions_at-rules.json
rename to crates/gosub_css3/resources/definitions/definitions_at-rules.json
diff --git a/crates/gosub_styling/resources/definitions/definitions_properties.json b/crates/gosub_css3/resources/definitions/definitions_properties.json
similarity index 100%
rename from crates/gosub_styling/resources/definitions/definitions_properties.json
rename to crates/gosub_css3/resources/definitions/definitions_properties.json
diff --git a/crates/gosub_styling/resources/definitions/definitions_selectors.json b/crates/gosub_css3/resources/definitions/definitions_selectors.json
similarity index 100%
rename from crates/gosub_styling/resources/definitions/definitions_selectors.json
rename to crates/gosub_css3/resources/definitions/definitions_selectors.json
diff --git a/crates/gosub_styling/resources/definitions/definitions_values.json b/crates/gosub_css3/resources/definitions/definitions_values.json
similarity index 100%
rename from crates/gosub_styling/resources/definitions/definitions_values.json
rename to crates/gosub_css3/resources/definitions/definitions_values.json
diff --git a/crates/gosub_styling/resources/useragent.css b/crates/gosub_css3/resources/useragent.css
similarity index 100%
rename from crates/gosub_styling/resources/useragent.css
rename to crates/gosub_css3/resources/useragent.css
diff --git a/crates/gosub_css3/src/convert/ast_converter.rs b/crates/gosub_css3/src/ast.rs
similarity index 79%
rename from crates/gosub_css3/src/convert/ast_converter.rs
rename to crates/gosub_css3/src/ast.rs
index ba05aa2ca..c2fefe1f1 100644
--- a/crates/gosub_css3/src/convert/ast_converter.rs
+++ b/crates/gosub_css3/src/ast.rs
@@ -1,10 +1,10 @@
 use crate::node::{Node as CssNode, NodeType};
 use crate::stylesheet::{
-    AttributeSelector, Combinator, CssDeclaration, CssOrigin, CssRule, CssSelector,
-    CssSelectorPart, CssStylesheet, CssValue, MatcherType,
+    AttributeSelector, Combinator, CssDeclaration, CssRule, CssSelector, CssSelectorPart, CssStylesheet, CssValue,
+    MatcherType,
 };
-use anyhow::anyhow;
-use gosub_shared::types::Result;
+use gosub_shared::errors::{CssError, CssResult};
+use gosub_shared::traits::css3::CssOrigin;
 use log::warn;
 
 /*
@@ -60,19 +60,16 @@ vs
 */
 
 /// Converts a CSS AST to a CSS stylesheet structure
-pub fn convert_ast_to_stylesheet(
-    css_ast: &CssNode,
-    origin: CssOrigin,
-    location: &str,
-) -> Result<CssStylesheet> {
+pub fn convert_ast_to_stylesheet(css_ast: &CssNode, origin: CssOrigin, url: &str) -> CssResult<CssStylesheet> {
     if !css_ast.is_stylesheet() {
-        return Err(anyhow!("CSS AST must start with a stylesheet node"));
+        return Err(CssError::new("CSS AST must start with a stylesheet node"));
     }
 
     let mut sheet = CssStylesheet {
         rules: vec![],
         origin,
-        location: location.to_string(),
+        url: url.to_string(),
+        parse_log: vec![],
     };
 
     for node in css_ast.as_stylesheet() {
@@ -91,9 +88,7 @@ pub fn convert_ast_to_stylesheet(
                 continue;
             }
 
-            let mut selector = CssSelector {
-                parts: vec![vec![]],
-            };
+            let mut selector = CssSelector { parts: vec![vec![]] };
             for node in node.as_selector_list().iter() {
                 if !node.is_selector() {
                     continue;
@@ -111,24 +106,18 @@ pub fn convert_ast_to_stylesheet(
                                 " " => Combinator::Descendant,
                                 "||" => Combinator::Column,
                                 "|" => Combinator::Namespace,
-                                _ => return Err(anyhow!("Unknown combinator: {}", value)),
+                                _ => return Err(CssError::new(format!("Unknown combinator: {}", value).as_str())),
                             };
 
                             CssSelectorPart::Combinator(combinator)
                         }
                         NodeType::IdSelector { value } => CssSelectorPart::Id(value.clone()),
-                        NodeType::TypeSelector { value, .. } if value == "*" => {
-                            CssSelectorPart::Universal
-                        }
-                        NodeType::PseudoClassSelector { value, .. } => {
-                            CssSelectorPart::PseudoClass(value.to_string())
-                        }
+                        NodeType::TypeSelector { value, .. } if value == "*" => CssSelectorPart::Universal,
+                        NodeType::PseudoClassSelector { value, .. } => CssSelectorPart::PseudoClass(value.to_string()),
                         NodeType::PseudoElementSelector { value, .. } => {
                             CssSelectorPart::PseudoElement(value.to_string())
                         }
-                        NodeType::TypeSelector { value, .. } => {
-                            CssSelectorPart::Type(value.clone())
-                        }
+                        NodeType::TypeSelector { value, .. } => CssSelectorPart::Type(value.clone()),
                         NodeType::AttributeSelector {
                             name,
                             value,
@@ -170,7 +159,9 @@ pub fn convert_ast_to_stylesheet(
                             continue;
                         }
                         _ => {
-                            return Err(anyhow!("Unsupported selector part: {:?}", node.node_type))
+                            return Err(CssError::new(
+                                format!("Unsupported selector part: {:?}", node.node_type).as_str(),
+                            ));
                         }
                     };
                     if let Some(x) = selector.parts.last_mut() {
@@ -224,12 +215,12 @@ pub fn convert_ast_to_stylesheet(
 #[cfg(test)]
 mod tests {
     use super::*;
-    use crate::parser_config::ParserConfig;
     use crate::Css3;
+    use gosub_shared::traits::ParserConfig;
 
     #[test]
     fn convert_font_family() {
-        let ast = Css3::parse(
+        let stylesheet = Css3::parse_str(
             r#"
               body {
                 border: 1px solid black;
@@ -241,66 +232,42 @@ mod tests {
               }
             "#,
             ParserConfig::default(),
+            CssOrigin::User,
+            "test.css",
         )
         .unwrap();
 
-        let tree = convert_ast_to_stylesheet(&ast, CssOrigin::UserAgent, "test.css").unwrap();
-
-        dbg!(&tree);
+        dbg!(&stylesheet);
     }
 
     #[test]
     fn convert_test() {
-        let ast = Css3::parse(
+        let stylesheet = Css3::parse_str(
             r#"
             h1 { color: red; }
             h3, h4 { border: 1px solid black; }
             "#,
             ParserConfig::default(),
+            CssOrigin::User,
+            "test.css",
         )
         .unwrap();
 
-        let tree = convert_ast_to_stylesheet(&ast, CssOrigin::UserAgent, "test.css").unwrap();
-
         assert_eq!(
-            tree.rules
-                .first()
-                .unwrap()
-                .declarations
-                .first()
-                .unwrap()
-                .property,
+            stylesheet.rules.first().unwrap().declarations.first().unwrap().property,
             "color"
         );
         assert_eq!(
-            tree.rules
-                .first()
-                .unwrap()
-                .declarations
-                .first()
-                .unwrap()
-                .value,
+            stylesheet.rules.first().unwrap().declarations.first().unwrap().value,
             vec![CssValue::String("red".into())]
         );
 
         assert_eq!(
-            tree.rules
-                .get(1)
-                .unwrap()
-                .declarations
-                .first()
-                .unwrap()
-                .property,
+            stylesheet.rules.get(1).unwrap().declarations.first().unwrap().property,
             "border"
         );
         assert_eq!(
-            tree.rules
-                .get(1)
-                .unwrap()
-                .declarations
-                .first()
-                .unwrap()
-                .value,
+            stylesheet.rules.get(1).unwrap().declarations.first().unwrap().value,
             vec![
                 CssValue::Unit(1.0, "px".into()),
                 CssValue::String("solid".into()),
diff --git a/crates/gosub_css3/src/colors.rs b/crates/gosub_css3/src/colors.rs
index 7575cb3bc..75c576d75 100644
--- a/crates/gosub_css3/src/colors.rs
+++ b/crates/gosub_css3/src/colors.rs
@@ -76,12 +76,7 @@ impl From<&str> for RgbColor {
                 return RgbColor::default();
             }
             let rgb = rgb.unwrap();
-            return RgbColor::new(
-                rgb.get_red(),
-                rgb.get_green(),
-                rgb.get_blue(),
-                rgb.get_alpha(),
-            );
+            return RgbColor::new(rgb.get_red(), rgb.get_green(), rgb.get_blue(), rgb.get_alpha());
         }
         if value.starts_with("hsl(") {
             let hsl = Hsl::from_str(value);
@@ -99,12 +94,7 @@ impl From<&str> for RgbColor {
                 return RgbColor::default();
             }
             let rgb: Rgb = hsl.unwrap().to_rgb();
-            return RgbColor::new(
-                rgb.get_red(),
-                rgb.get_green(),
-                rgb.get_blue(),
-                rgb.get_alpha(),
-            );
+            return RgbColor::new(rgb.get_red(), rgb.get_green(), rgb.get_blue(), rgb.get_alpha());
         }
 
         return get_hex_color_from_name(value).map_or(RgbColor::default(), parse_hex);
@@ -146,12 +136,7 @@ fn parse_hex(value: &str) -> RgbColor {
         let r = i32::from_str_radix(&value[1..2], 16).unwrap();
         let g = i32::from_str_radix(&value[2..3], 16).unwrap();
         let b = i32::from_str_radix(&value[3..4], 16).unwrap();
-        return RgbColor::new(
-            (r * 16 + r) as f32,
-            (g * 16 + g) as f32,
-            (b * 16 + b) as f32,
-            255.0,
-        );
+        return RgbColor::new((r * 16 + r) as f32, (g * 16 + g) as f32, (b * 16 + b) as f32, 255.0);
     }
 
     // 4 hex digits (RGBA)
diff --git a/crates/gosub_css3/src/convert.rs b/crates/gosub_css3/src/convert.rs
deleted file mode 100644
index 4637be32d..000000000
--- a/crates/gosub_css3/src/convert.rs
+++ /dev/null
@@ -1 +0,0 @@
-pub mod ast_converter;
diff --git a/crates/gosub_css3/src/errors.rs b/crates/gosub_css3/src/errors.rs
new file mode 100644
index 000000000..e76800e83
--- /dev/null
+++ b/crates/gosub_css3/src/errors.rs
@@ -0,0 +1,35 @@
+//! Error results that can be returned from the css3 parser
+// use gosub_shared::byte_stream::Location;
+
+//
+// /// Parser error that defines an error (message) on the given position
+// #[derive(Clone, Debug, PartialEq)]
+// pub struct CssError {
+//     /// Error message
+//     pub message: String,
+//     /// Location of the error, if available (during parsing mostly)
+//     pub location: Option<Location>,
+// }
+//
+// impl CssError {
+//     pub fn new(message: &str, location: Option<Location>) -> Self {
+//         Self {
+//             message: message.to_string(),
+//             location,
+//         }
+//     }
+// }
+
+// /// Serious errors and errors from third-party libraries
+// #[derive(Debug, Error)]
+// pub enum Error {
+//     #[error("parse error: {0} at {1}")]
+//     Parse(String, Location),
+//
+//     #[allow(dead_code)]
+//     #[error("incorrect value: {0} at {1}")]
+//     IncorrectValue(String, Location),
+//
+//     #[error("css failure: {0}")]
+//     CssFailure(String),
+// }
diff --git a/crates/gosub_css3/src/functions.rs b/crates/gosub_css3/src/functions.rs
new file mode 100644
index 000000000..b8e327dd1
--- /dev/null
+++ b/crates/gosub_css3/src/functions.rs
@@ -0,0 +1,7 @@
+// pub use attr::*;
+// pub use calc::*;
+// pub use var::*;
+
+pub mod attr;
+pub mod calc;
+pub mod var;
diff --git a/crates/gosub_css3/src/functions/attr.rs b/crates/gosub_css3/src/functions/attr.rs
new file mode 100644
index 000000000..8de5951f8
--- /dev/null
+++ b/crates/gosub_css3/src/functions/attr.rs
@@ -0,0 +1,33 @@
+use crate::stylesheet::CssValue;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::node::{ElementDataType, Node};
+
+// Probably this shouldn't quite be in gosub_css3
+#[allow(dead_code)]
+pub fn resolve_attr<N: Node<C>, C: CssSystem>(values: &[CssValue], node: &N) -> Vec<CssValue> {
+    let Some(attr_name) = values.first().map(|v| v.to_string()) else {
+        return vec![];
+    };
+
+    let ty = values.get(1).cloned();
+
+    let Some(data) = node.get_element_data() else {
+        return vec![];
+    };
+
+    let Some(attr_value) = data.attribute(&attr_name) else {
+        let _default_value = values.get(2).cloned();
+
+        if let Some(ty) = ty {
+            return vec![ty];
+        }
+
+        return vec![];
+    };
+
+    let Ok(value) = CssValue::parse_str(attr_value) else {
+        return vec![];
+    };
+
+    vec![value]
+}
diff --git a/crates/gosub_styling/src/functions/calc.rs b/crates/gosub_css3/src/functions/calc.rs
similarity index 58%
rename from crates/gosub_styling/src/functions/calc.rs
rename to crates/gosub_css3/src/functions/calc.rs
index 5e24bd79f..c40bfcf56 100644
--- a/crates/gosub_styling/src/functions/calc.rs
+++ b/crates/gosub_css3/src/functions/calc.rs
@@ -1,5 +1,6 @@
-use gosub_css3::stylesheet::CssValue;
+use crate::stylesheet::CssValue;
 
+#[allow(dead_code)]
 pub fn resolve_calc(_values: &[CssValue]) -> Vec<CssValue> {
     todo!()
 }
diff --git a/crates/gosub_styling/src/functions/var.rs b/crates/gosub_css3/src/functions/var.rs
similarity index 74%
rename from crates/gosub_styling/src/functions/var.rs
rename to crates/gosub_css3/src/functions/var.rs
index 1180456ca..1de85d88e 100644
--- a/crates/gosub_styling/src/functions/var.rs
+++ b/crates/gosub_css3/src/functions/var.rs
@@ -1,16 +1,18 @@
 use std::collections::HashMap;
 
-use gosub_css3::stylesheet::CssValue;
-use gosub_html5::node::Node;
-use gosub_html5::parser::document::Document;
+use crate::stylesheet::CssValue;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
 
+#[allow(dead_code)]
 #[derive(Clone, Debug, Default)]
 pub struct VariableEnvironment {
     pub values: HashMap<String, CssValue>,
 }
 
+#[allow(dead_code)]
 impl VariableEnvironment {
-    pub fn get(&self, name: &str, _doc: &Document, _node: &Node) -> Option<CssValue> {
+    pub fn get<D: Document<C>, C: CssSystem>(&self, name: &str, _doc: &D, _node: &D::Node) -> Option<CssValue> {
         let mut current = Some(self);
 
         while let Some(env) = current {
@@ -29,7 +31,8 @@ impl VariableEnvironment {
     }
 }
 
-pub fn resolve_var(values: &[CssValue], doc: &Document, node: &Node) -> Vec<CssValue> {
+#[allow(dead_code)]
+pub fn resolve_var<D: Document<C>, C: CssSystem>(values: &[CssValue], doc: &D, node: &D::Node) -> Vec<CssValue> {
     let Some(name) = values.first().map(|v| {
         let mut str = v.to_string();
 
diff --git a/crates/gosub_css3/src/lib.rs b/crates/gosub_css3/src/lib.rs
index 8c0a966f6..ab70d8cbf 100644
--- a/crates/gosub_css3/src/lib.rs
+++ b/crates/gosub_css3/src/lib.rs
@@ -1,98 +1,127 @@
-use crate::node::{Node, NodeType};
-use crate::parser_config::{Context, ParserConfig};
+use crate::ast::convert_ast_to_stylesheet;
+use crate::stylesheet::CssStylesheet;
 use crate::tokenizer::Tokenizer;
+
 use gosub_shared::byte_stream::{ByteStream, Encoding, Location};
+use gosub_shared::errors::{CssError, CssResult};
+use gosub_shared::traits::css3::CssOrigin;
+use gosub_shared::traits::Context;
+use gosub_shared::traits::ParserConfig;
 use gosub_shared::{timing_start, timing_stop};
 
+pub mod ast;
+/// This CSS3 parser is heavily based on the MIT licensed CssTree parser written by
+/// Roman Dvornov (https://github.com/lahmatiy).
+/// The original version can be found at https://github.com/csstree/csstree
 pub mod colors;
-pub mod convert;
-mod node;
+pub mod errors;
+mod functions;
+#[allow(dead_code)]
+pub mod matcher;
+pub mod node;
 pub mod parser;
-pub mod parser_config;
 pub mod stylesheet;
+pub mod system;
 pub mod tokenizer;
 mod unicode;
 pub mod walker;
 
-/// This CSS3 parser is heavily based on the MIT licensed CssTree parser written by
-/// Roman Dvornov (https://github.com/lahmatiy).
-/// The original version can be found at https://github.com/csstree/csstree
-
 pub struct Css3<'stream> {
     /// The tokenizer is responsible for reading the input stream and
     pub tokenizer: Tokenizer<'stream>,
-    /// When the last item is true, we allow values in argument lists.
+    /// When true, we allow values in argument lists.
     allow_values_in_argument_list: Vec<bool>,
     /// The parser configuration as given
     config: ParserConfig,
-}
-
-#[derive(Debug)]
-pub struct Error {
-    /// The error message
-    pub message: String,
-    /// The location of the error
-    pub location: Location,
-}
-
-impl Error {
-    pub(crate) fn new(message: String, location: Location) -> Error {
-        Error { message, location }
-    }
+    /// Origin of the stream (useragent, inline etc.)
+    origin: CssOrigin,
+    /// Source of the stream (filename, url, etc.)
+    source: String,
 }
 
 impl<'stream> Css3<'stream> {
-    /// Parse a CSS string, which depends on the context.
-    pub fn parse(data: &str, config: ParserConfig) -> Result<Node, Error> {
-        let t_id = timing_start!("css3.parse", config.source.as_deref().unwrap_or(""));
+    /// Creates a new parser with the given byte stream so only parse() needs to be called.
+    fn new(stream: &'stream mut ByteStream, config: ParserConfig, origin: CssOrigin, source: &str) -> Self {
+        Self {
+            tokenizer: Tokenizer::new(stream, Location::default()),
+            allow_values_in_argument_list: Vec::new(),
+            config,
+            origin,
+            source: source.to_string(),
+        }
+    }
 
+    /// Parses a direct string to a CssStyleSheet
+    pub fn parse_str(
+        data: &str,
+        config: ParserConfig,
+        origin: CssOrigin,
+        source_url: &str,
+    ) -> CssResult<CssStylesheet> {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
         stream.read_from_str(data, Some(Encoding::UTF8));
         stream.close();
 
-        let mut parser = Css3::new(&mut stream);
-        let result = parser.parse_internal(config);
-
-        timing_stop!(t_id);
+        Css3::parse_stream(&mut stream, config, origin, source_url)
+    }
 
-        match result {
-            Ok(Some(node)) => Ok(node),
-            Ok(None) => Ok(Node::new(
-                NodeType::StyleSheet {
-                    children: Vec::new(),
-                },
-                Location::default(),
-            )),
-            Err(e) => Err(e),
-        }
+    /// Parses a direct stream to a CssStyleSheet
+    pub fn parse_stream(
+        stream: &mut ByteStream,
+        config: ParserConfig,
+        origin: CssOrigin,
+        source_url: &str,
+    ) -> CssResult<CssStylesheet> {
+        Css3::new(stream, config, origin, source_url).parse()
     }
 
-    /// Create a new parser with the given bytestream
-    fn new(it: &'stream mut ByteStream) -> Self {
-        Self {
-            tokenizer: Tokenizer::new(it, Location::default()),
-            allow_values_in_argument_list: Vec::new(),
-            config: Default::default(),
+    fn parse(&mut self) -> CssResult<CssStylesheet> {
+        if self.config.context != Context::Stylesheet {
+            return Err(CssError::new("Expected a stylesheet context"));
         }
-    }
 
-    /// Actual parser implementation
-    fn parse_internal(&mut self, config: ParserConfig) -> Result<Option<Node>, Error> {
-        self.config = config;
+        let t_id = timing_start!("css3.parse", self.config.source.as_deref().unwrap_or(""));
 
-        match self.config.context {
-            Context::Stylesheet => self.parse_stylesheet(),
+        // let mut stream = ByteStream::new(Encoding::UTF8, None);
+        // stream.read_from_str(data, Some(Encoding::UTF8));
+        // stream.close();
+
+        let node_tree = match self.config.context {
+            Context::Stylesheet => self.parse_stylesheet_internal(),
             Context::Rule => self.parse_rule(),
             Context::AtRule => self.parse_at_rule(true),
             Context::Declaration => self.parse_declaration(),
+        };
+
+        timing_stop!(t_id);
+
+        match node_tree {
+            Ok(None) => Err(CssError::new("No node tree found")),
+            Ok(Some(node)) => convert_ast_to_stylesheet(&node, self.origin, self.source.clone().as_str()),
+            Err(e) => Err(e),
         }
     }
 }
 
+/// Loads the default user agent stylesheet
+pub fn load_default_useragent_stylesheet() -> CssStylesheet {
+    // @todo: we should be able to browse to gosub:useragent.css and see the actual useragent css file
+    let url = "gosub:useragent.css";
+
+    let config = ParserConfig {
+        ignore_errors: true,
+        match_values: true,
+        ..Default::default()
+    };
+
+    let css_data = include_str!("../resources/useragent.css");
+    Css3::parse_str(css_data, config, CssOrigin::UserAgent, url).expect("Could not parse useragent stylesheet")
+}
+
 #[cfg(test)]
 mod tests {
     use super::*;
-    use crate::walker::Walker;
+    // use crate::walker::Walker;
     use simple_logger::SimpleLogger;
 
     #[test]
@@ -109,14 +138,13 @@ mod tests {
         };
 
         let css = std::fs::read_to_string(filename).unwrap();
-        let res = Css3::parse(css.as_str(), config);
+        let res = Css3::parse_str(css.as_str(), config, CssOrigin::Author, filename);
         if res.is_err() {
             println!("{:?}", res.err().unwrap());
-            return;
         }
 
-        let binding = res.unwrap();
-        let w = Walker::new(&binding);
-        w.walk_stdout();
+        // let binding = res.unwrap();
+        // let w = Walker::new(&binding);
+        // w.walk_stdout();
     }
 }
diff --git a/crates/gosub_css3/src/logging.rs b/crates/gosub_css3/src/logging.rs
new file mode 100644
index 000000000..a1d6032c6
--- /dev/null
+++ b/crates/gosub_css3/src/logging.rs
@@ -0,0 +1,528 @@
+use crate::colors::RgbColor;
+use anyhow::anyhow;
+use core::fmt::Debug;
+use std::cmp::Ordering;
+use std::fmt::Display;
+use gosub_shared::byte_stream::Location;
+
+/// Defines a complete stylesheet with all its rules and the location where it was found
+#[derive(Debug)]
+pub struct CssStylesheet {
+    /// List of rules found in this stylesheet
+    pub rules: Vec<CssRule>,
+    /// Origin of the stylesheet (user agent, author, user)
+    pub origin: CssOrigin,
+    /// Url or file path where the stylesheet was found
+    pub location: String,
+    /// Any issues during parsing of the stylesheet
+    pub parse_log: Vec<CssLog>
+}
+
+/// A CSS rule, which contains a list of selectors and a list of declarations
+#[derive(Debug, PartialEq, Clone)]
+pub struct CssRule {
+    /// Selectors that must match for the declarations to apply
+    pub selectors: Vec<CssSelector>,
+    /// Actual declarations that will be applied if the selectors match
+    pub declarations: Vec<CssDeclaration>,
+}
+
+impl CssRule {
+    pub fn selectors(&self) -> &Vec<CssSelector> {
+        &self.selectors
+    }
+
+    pub fn declarations(&self) -> &Vec<CssDeclaration> {
+        &self.declarations
+    }
+}
+
+/// A CSS declaration, which contains a property, value and a flag for !important
+#[derive(Debug, PartialEq, Clone)]
+pub struct CssDeclaration {
+    // Css property color
+    pub property: String,
+    // Raw values of the declaration. It is not calculated or converted in any way (ie: "red", "50px" etc)
+    // There can be multiple values  (ie:   "1px solid black" are split into 3 values)
+    pub value: Vec<CssValue>,
+    // ie: !important
+    pub important: bool,
+}
+
+#[derive(Debug, PartialEq, Clone)]
+pub struct CssSelector {
+    // List of parts that make up this selector
+    pub parts: Vec<CssSelectorPart>,
+}
+
+impl CssSelector {
+    /// Generate specificity for this selector
+    pub fn specificity(&self) -> Specificity {
+        let mut id_count = 0;
+        let mut class_count = 0;
+        let mut element_count = 0;
+        for part in &self.parts {
+            match part.type_ {
+                CssSelectorType::Id => {
+                    id_count += 1;
+                }
+                CssSelectorType::Class => {
+                    class_count += 1;
+                }
+                CssSelectorType::Type => {
+                    element_count += 1;
+                }
+                _ => {}
+            }
+        }
+        Specificity::new(id_count, class_count, element_count)
+    }
+}
+
+/// @todo: it would be nicer to have a struct for each type of selector part, but for now we'll keep it simple
+/// Represents a CSS selector part, which has a type and value (e.g. type=Class, class="my-class")
+#[derive(PartialEq, Clone, Default)]
+pub struct CssSelectorPart {
+    pub type_: CssSelectorType,
+    pub value: String,
+    pub matcher: MatcherType,
+    pub name: String,
+    pub flags: String,
+}
+
+impl Debug for CssSelectorPart {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        match self.type_ {
+            CssSelectorType::Universal => {
+                write!(f, "*")
+            }
+            CssSelectorType::Attribute => {
+                write!(
+                    f,
+                    "[{} {} {} {}]",
+                    self.name, self.matcher, self.value, self.flags
+                )
+            }
+            CssSelectorType::Class => {
+                write!(f, ".{}", self.value)
+            }
+            CssSelectorType::Id => {
+                write!(f, "#{}", self.value)
+            }
+            CssSelectorType::PseudoClass => {
+                write!(f, ":{}", self.value)
+            }
+            CssSelectorType::PseudoElement => {
+                write!(f, "::{}", self.value)
+            }
+            CssSelectorType::Combinator => {
+                write!(f, "'{}'", self.value)
+            }
+            CssSelectorType::Type => {
+                write!(f, "{}", self.value)
+            }
+        }
+    }
+}
+
+/// Represents a CSS selector type for this part
+#[derive(Debug, PartialEq, Clone, Default)]
+pub enum CssSelectorType {
+    Universal, // '*'
+    #[default]
+    Type, //  ul, a, h1, etc
+    Attribute, // [type ~= "text" i]  (name, matcher, value, flags)
+    Class,     // .myclass
+    Id,        // #myid
+    PseudoClass, // :hover, :active
+    PseudoElement, // ::first-child
+    Combinator,
+}
+
+/// Represents which type of matcher is used (in case of an attribute selector type)
+#[derive(Default, PartialEq, Clone)]
+pub enum MatcherType {
+    #[default]
+    None, // No matcher
+    Equals,         // Equals
+    Includes,       // Must include
+    DashMatch,      // Must start with
+    PrefixMatch,    // Must begin with
+    SuffixMatch,    // Must ends with
+    SubstringMatch, // Must contain
+}
+
+impl Display for MatcherType {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        match self {
+            MatcherType::None => write!(f, ""),
+            MatcherType::Equals => write!(f, "="),
+            MatcherType::Includes => write!(f, "~="),
+            MatcherType::DashMatch => write!(f, "|="),
+            MatcherType::PrefixMatch => write!(f, "^="),
+            MatcherType::SuffixMatch => write!(f, "$="),
+            MatcherType::SubstringMatch => write!(f, "*="),
+        }
+    }
+}
+
+/// Defines the specificity for a selector
+#[derive(Debug, PartialEq, Eq, Clone)]
+pub struct Specificity(u32, u32, u32);
+
+impl Specificity {
+    pub fn new(a: u32, b: u32, c: u32) -> Self {
+        Self(a, b, c)
+    }
+}
+
+impl PartialOrd for Specificity {
+    fn partial_cmp(&self, other: &Self) -> Option<Ordering> {
+        Some(self.cmp(other))
+    }
+}
+
+impl Ord for Specificity {
+    fn cmp(&self, other: &Self) -> Ordering {
+        match self.0.cmp(&other.0) {
+            Ordering::Greater => Ordering::Greater,
+            Ordering::Less => Ordering::Less,
+            Ordering::Equal => match self.1.cmp(&other.1) {
+                Ordering::Greater => Ordering::Greater,
+                Ordering::Less => Ordering::Less,
+                Ordering::Equal => match self.2.cmp(&other.2) {
+                    Ordering::Greater => Ordering::Greater,
+                    Ordering::Less => Ordering::Less,
+                    Ordering::Equal => Ordering::Equal,
+                },
+            },
+        }
+    }
+}
+
+/// Actual CSS value, can be a color, length, percentage, string or unit. Some relative values will be computed
+/// from other values (ie: Percent(50) will convert to Length(100) when the parent width is 200)
+#[derive(Debug, Clone, PartialEq)]
+pub enum CssValue {
+    None,
+    Color(RgbColor),
+    Zero,
+    Number(f32),
+    Percentage(f32),
+    String(String),
+    Unit(f32, String),
+    Function(String, Vec<CssValue>),
+    Initial,
+    Inherit,
+    Comma,
+    List(Vec<CssValue>),
+}
+
+impl Display for CssValue {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        match self {
+            CssValue::None => write!(f, "none"),
+            CssValue::Color(col) => {
+                write!(
+                    f,
+                    "#{:02x}{:02x}{:02x}{:02x}",
+                    col.r as u8, col.g as u8, col.b as u8, col.a as u8
+                )
+            }
+            CssValue::Zero => write!(f, "0"),
+            CssValue::Number(num) => write!(f, "{}", num),
+            CssValue::Percentage(p) => write!(f, "{}%", p),
+            CssValue::String(s) => write!(f, "{}", s),
+            CssValue::Unit(val, unit) => write!(f, "{}{}", val, unit),
+            CssValue::Function(name, args) => {
+                write!(f, "{}(", name)?;
+                for (i, arg) in args.iter().enumerate() {
+                    if i > 0 {
+                        write!(f, ", ")?;
+                    }
+                    write!(f, "{}", arg)?;
+                }
+                write!(f, ")")
+            }
+            CssValue::Initial => write!(f, "initial"),
+            CssValue::Inherit => write!(f, "inherit"),
+            CssValue::Comma => write!(f, ","),
+            CssValue::List(v) => {
+                write!(f, "List(")?;
+                for (i, value) in v.iter().enumerate() {
+                    if i > 0 {
+                        write!(f, ", ")?;
+                    }
+                    write!(f, "{}", value)?;
+                }
+                write!(f, ")")
+            }
+        }
+    }
+}
+
+impl CssValue {
+    pub fn to_color(&self) -> Option<RgbColor> {
+        match self {
+            CssValue::Color(col) => Some(*col),
+            CssValue::String(s) => Some(RgbColor::from(s.as_str())),
+            _ => None,
+        }
+    }
+
+    pub fn unit_to_px(&self) -> f32 {
+        //TODO: Implement the rest of the units
+        match self {
+            CssValue::Unit(val, unit) => match unit.as_str() {
+                "px" => *val,
+                "em" => *val * 16.0,
+                "rem" => *val * 16.0,
+                _ => *val,
+            },
+            CssValue::String(value) => {
+                if value.ends_with("px") {
+                    value.trim_end_matches("px").parse::<f32>().unwrap()
+                } else if value.ends_with("rem") {
+                    value.trim_end_matches("rem").parse::<f32>().unwrap() * 16.0
+                } else if value.ends_with("em") {
+                    value.trim_end_matches("em").parse::<f32>().unwrap() * 16.0
+                } else {
+                    0.0
+                }
+            }
+            _ => 0.0,
+        }
+    }
+
+    /// Converts a CSS AST node to a CSS value
+    pub fn parse_ast_node(node: &crate::node::Node) -> CssResult<CssValue> {
+        match *node.node_type.clone() {
+            crate::node::NodeType::Ident { value } => Ok(CssValue::String(value)),
+            crate::node::NodeType::Number { value } => {
+                if value == 0.0 {
+                    // Zero is a special case since we need to do some pattern matching once in a while, and
+                    // this is not possible (anymore) with floating point 0.0 it seems
+                    Ok(CssValue::Zero)
+                } else {
+                    Ok(CssValue::Number(value))
+                }
+            }
+            crate::node::NodeType::Percentage { value } => Ok(CssValue::Percentage(value)),
+            crate::node::NodeType::Dimension { value, unit } => Ok(CssValue::Unit(value, unit)),
+            crate::node::NodeType::String { value } => Ok(CssValue::String(value)),
+            crate::node::NodeType::Hash { value } => Ok(CssValue::String(value)),
+            crate::node::NodeType::Operator(_) => Ok(CssValue::None),
+            crate::node::NodeType::Calc { .. } => {
+                Ok(CssValue::Function("calc".to_string(), vec![]))
+            }
+            crate::node::NodeType::Url { url } => Ok(CssValue::Function(
+                "url".to_string(),
+                vec![CssValue::String(url)],
+            )),
+            crate::node::NodeType::Function { name, arguments } => {
+                let mut list = vec![];
+                for node in arguments.iter() {
+                    match CssValue::parse_ast_node(node) {
+                        Ok(value) => list.push(value),
+                        Err(e) => return Err(e),
+                    }
+                }
+                Ok(CssValue::Function(name, list))
+            }
+            _ => Err(anyhow!(format!(
+                "Cannot convert node to CssValue: {:?}",
+                node
+            ))),
+        }
+    }
+
+    /// Parses a string into a CSS value or list of css values
+    pub fn parse_str(value: &str) -> CssResult<CssValue> {
+        match value {
+            "initial" => return Ok(CssValue::Initial),
+            "inherit" => return Ok(CssValue::Inherit),
+            "none" => return Ok(CssValue::None),
+            "" => return Ok(CssValue::String("".into())),
+            _ => {}
+        }
+
+        if let Ok(num) = value.parse::<f32>() {
+            return Ok(CssValue::Number(num));
+        }
+
+        // Color values
+        if value.starts_with("color(") && value.ends_with(')') {
+            return Ok(CssValue::Color(RgbColor::from(
+                value[6..value.len() - 1].to_string().as_str(),
+            )));
+        }
+
+        // Percentages
+        if value.ends_with('%') {
+            if let Ok(num) = value[0..value.len() - 1].parse::<f32>() {
+                return Ok(CssValue::Percentage(num));
+            }
+        }
+
+        // units. If the value starts with a number and ends with some non-numerical
+        let mut split_index = None;
+        for (index, char) in value.chars().enumerate() {
+            if char.is_alphabetic() {
+                split_index = Some(index);
+                break;
+            }
+        }
+        if let Some(index) = split_index {
+            let (number_part, unit_part) = value.split_at(index);
+            if let Ok(number) = number_part.parse::<f32>() {
+                return Ok(CssValue::Unit(number, unit_part.to_string()));
+            }
+        }
+
+        Ok(CssValue::String(value.to_string()))
+    }
+}
+
+#[cfg(test)]
+mod test {
+    use super::*;
+
+    // #[test]
+    // fn test_css_value_to_color() {
+    //     assert_eq!(CssValue::from_str("color(#ff0000)").unwrap().to_color().unwrap(), RgbColor::from("#ff0000"));
+    //     assert_eq!(CssValue::from_str("'Hello'").unwrap().to_color().unwrap(), RgbColor::from("#000000"));
+    // }
+    //
+    // #[test]
+    // fn test_css_value_unit_to_px() {
+    //     assert_eq!(CssValue::from_str("10px").unwrap().unit_to_px(), 10.0);
+    //     assert_eq!(CssValue::from_str("10em").unwrap().unit_to_px(), 160.0);
+    //     assert_eq!(CssValue::from_str("10rem").unwrap().unit_to_px(), 160.0);
+    //     assert_eq!(CssValue::from_str("10").unwrap().unit_to_px(), 0.0);
+    // }
+
+    #[test]
+    fn test_css_rule() {
+        let rule = CssRule {
+            selectors: vec![CssSelector {
+                parts: vec![CssSelectorPart {
+                    type_: CssSelectorType::Type,
+                    value: "h1".to_string(),
+                    ..Default::default()
+                }],
+            }],
+            declarations: vec![CssDeclaration {
+                property: "color".to_string(),
+                value: vec![CssValue::String("red".to_string())],
+                important: false,
+            }],
+        };
+
+        assert_eq!(rule.selectors().len(), 1);
+        assert_eq!(
+            rule.selectors()
+                .first()
+                .unwrap()
+                .parts
+                .first()
+                .unwrap()
+                .value,
+            "h1"
+        );
+        assert_eq!(rule.declarations().len(), 1);
+        assert_eq!(rule.declarations().first().unwrap().property, "color");
+    }
+
+    #[test]
+    fn test_specificity() {
+        let selector = CssSelector {
+            parts: vec![
+                CssSelectorPart {
+                    type_: CssSelectorType::Type,
+                    value: "h1".to_string(),
+                    ..Default::default()
+                },
+                CssSelectorPart {
+                    type_: CssSelectorType::Class,
+                    value: "myclass".to_string(),
+                    ..Default::default()
+                },
+                CssSelectorPart {
+                    type_: CssSelectorType::Id,
+                    value: "myid".to_string(),
+                    ..Default::default()
+                },
+            ],
+        };
+
+        let specificity = selector.specificity();
+        assert_eq!(specificity, Specificity::new(1, 1, 1));
+
+        let selector = CssSelector {
+            parts: vec![
+                CssSelectorPart {
+                    type_: CssSelectorType::Type,
+                    value: "h1".to_string(),
+                    ..Default::default()
+                },
+                CssSelectorPart {
+                    type_: CssSelectorType::Class,
+                    value: "myclass".to_string(),
+                    ..Default::default()
+                },
+            ],
+        };
+
+        let specificity = selector.specificity();
+        assert_eq!(specificity, Specificity::new(0, 1, 1));
+
+        let selector = CssSelector {
+            parts: vec![CssSelectorPart {
+                type_: CssSelectorType::Type,
+                value: "h1".to_string(),
+                ..Default::default()
+            }],
+        };
+
+        let specificity = selector.specificity();
+        assert_eq!(specificity, Specificity::new(0, 0, 1));
+
+        let selector = CssSelector {
+            parts: vec![
+                CssSelectorPart {
+                    type_: CssSelectorType::Class,
+                    value: "myclass".to_string(),
+                    ..Default::default()
+                },
+                CssSelectorPart {
+                    type_: CssSelectorType::Class,
+                    value: "otherclass".to_string(),
+                    ..Default::default()
+                },
+            ],
+        };
+
+        let specificity = selector.specificity();
+        assert_eq!(specificity, Specificity::new(0, 2, 0));
+    }
+
+    #[test]
+    fn test_specificity_ordering() {
+        let specificity1 = Specificity::new(1, 1, 1);
+        let specificity2 = Specificity::new(0, 1, 1);
+        let specificity3 = Specificity::new(0, 0, 1);
+        let specificity4 = Specificity::new(0, 2, 0);
+        let specificity5 = Specificity::new(1, 0, 0);
+        let specificity6 = Specificity::new(1, 2, 1);
+        let specificity7 = Specificity::new(1, 1, 2);
+        let specificity8 = Specificity::new(2, 1, 1);
+
+        assert!(specificity1 > specificity2);
+        assert!(specificity2 > specificity3);
+        assert!(specificity3 < specificity4);
+        assert!(specificity4 < specificity5);
+        assert!(specificity5 < specificity6);
+        assert!(specificity6 > specificity7);
+        assert!(specificity7 < specificity8);
+    }
+}
diff --git a/crates/gosub_css3/src/matcher.rs b/crates/gosub_css3/src/matcher.rs
new file mode 100644
index 000000000..299733b55
--- /dev/null
+++ b/crates/gosub_css3/src/matcher.rs
@@ -0,0 +1,6 @@
+pub mod property_definitions;
+pub mod shorthands;
+pub mod styling;
+mod syntax;
+mod syntax_matcher;
+mod walker;
diff --git a/crates/gosub_styling/src/property_definitions.rs b/crates/gosub_css3/src/matcher/property_definitions.rs
similarity index 92%
rename from crates/gosub_styling/src/property_definitions.rs
rename to crates/gosub_css3/src/matcher/property_definitions.rs
index 2ed361366..41fde9c71 100644
--- a/crates/gosub_styling/src/property_definitions.rs
+++ b/crates/gosub_css3/src/matcher/property_definitions.rs
@@ -1,15 +1,13 @@
 use std::collections::HashMap;
+use std::sync::LazyLock;
 
 use log::warn;
 
-use gosub_css3::stylesheet::CssValue;
-
-use crate::shorthands::{FixList, Shorthands};
-use std::sync::LazyLock;
-
-use crate::syntax::GroupCombinators::Juxtaposition;
-use crate::syntax::{CssSyntax, SyntaxComponent};
-use crate::syntax_matcher::CssSyntaxTree;
+use crate::matcher::shorthands::{FixList, Shorthands};
+use crate::matcher::syntax::GroupCombinators::Juxtaposition;
+use crate::matcher::syntax::{CssSyntax, SyntaxComponent};
+use crate::matcher::syntax_matcher::CssSyntaxTree;
+use crate::stylesheet::CssValue;
 
 /// List of elements that are built-in data types in the CSS specification. These will be handled
 /// by the syntax matcher as built-in types.
@@ -240,23 +238,16 @@ impl CssDefinitions {
     }
 
     /// Resolve a syntax component
-    pub fn resolve_component(
-        &mut self,
-        component: &SyntaxComponent,
-        prop_name: &str,
-    ) -> SyntaxComponent {
+    pub fn resolve_component(&mut self, component: &SyntaxComponent, prop_name: &str) -> SyntaxComponent {
         match component {
             SyntaxComponent::Definition {
-                datatype,
-                multipliers,
-                ..
+                datatype, multipliers, ..
             } => {
                 // First step: Resolve by looking the definition up in the syntax defintions.
                 if let Some(syntax_element) = self.syntax.get(datatype) {
                     let mut syntax_element = syntax_element.clone();
                     if !syntax_element.resolved {
-                        syntax_element.syntax =
-                            self.resolve_syntax(&syntax_element.syntax, prop_name);
+                        syntax_element.syntax = self.resolve_syntax(&syntax_element.syntax, prop_name);
                         syntax_element.resolved = true;
                         self.syntax.insert(datatype.clone(), syntax_element.clone());
                     }
@@ -348,21 +339,18 @@ impl CssDefinitions {
     }
 }
 
-pub static CSS_DEFINITIONS: LazyLock<CssDefinitions, fn() -> CssDefinitions> =
-    LazyLock::new(pars_definition_files);
+pub static CSS_DEFINITIONS: LazyLock<CssDefinitions, fn() -> CssDefinitions> = LazyLock::new(pars_definition_files);
 
 /// Parses the internal CSS definition file
 fn pars_definition_files() -> CssDefinitions {
     // parse all syntax, so we can use them in the properties
-    let contents = include_str!("../resources/definitions/definitions_values.json");
-    let json: serde_json::Value =
-        serde_json::from_str(contents).expect("JSON was not well-formatted");
+    let contents = include_str!("../../resources/definitions/definitions_values.json");
+    let json: serde_json::Value = serde_json::from_str(contents).expect("JSON was not well-formatted");
     let syntax = parse_syntax_file(json);
 
     // Parse property definitions
-    let contents = include_str!("../resources/definitions/definitions_properties.json");
-    let json: serde_json::Value =
-        serde_json::from_str(contents).expect("JSON was not well-formatted");
+    let contents = include_str!("../../resources/definitions/definitions_properties.json");
+    let json: serde_json::Value = serde_json::from_str(contents).expect("JSON was not well-formatted");
     let properties = parse_property_file(json);
 
     // Create definition structure, and resolve all definitions
@@ -503,9 +491,8 @@ fn parse_property_file(json: serde_json::Value) -> HashMap<String, PropertyDefin
 
 #[cfg(test)]
 mod tests {
-    use gosub_css3::colors::RgbColor;
-
     use super::*;
+    use crate::colors::RgbColor;
 
     macro_rules! assert_false {
         ($e:expr) => {
@@ -566,9 +553,7 @@ mod tests {
             .matches(&[str!("solid"), CssValue::Color(RgbColor::from("black")),]));
         assert_true!(prop.clone().matches(&[str!("solid")]));
         assert_false!(prop.clone().matches(&[str!("not-solid")]));
-        assert_false!(prop
-            .clone()
-            .matches(&[str!("solid"), str!("solid"), unit!(1.0, "px"),]));
+        assert_false!(prop.clone().matches(&[str!("solid"), str!("solid"), unit!(1.0, "px"),]));
     }
 
     #[test]
@@ -579,9 +564,7 @@ mod tests {
             PropertyDefinition {
                 name: "color".to_string(),
                 computed: vec![],
-                syntax: CssSyntax::new("color()")
-                    .compile()
-                    .expect("Could not compile syntax"),
+                syntax: CssSyntax::new("color()").compile().expect("Could not compile syntax"),
                 inherited: false,
                 initial_value: None,
                 resolved: false,
@@ -604,9 +587,7 @@ mod tests {
                     "border-bottom-style".to_string(),
                     "border-left-style".to_string(),
                 ],
-                syntax: CssSyntax::new("")
-                    .compile()
-                    .expect("Could not compile syntax"),
+                syntax: CssSyntax::new("").compile().expect("Could not compile syntax"),
                 inherited: false,
                 initial_value: Some(str!("thick".to_string())),
                 resolved: false,
@@ -669,9 +650,7 @@ mod tests {
         assert_true!(def.clone().matches(&[str!("Menu")]));
 
         assert_true!(def.clone().matches(&[str!("blue")]));
-        assert_true!(def
-            .clone()
-            .matches(&[CssValue::Color(RgbColor::from("#ff0000"))]));
+        assert_true!(def.clone().matches(&[CssValue::Color(RgbColor::from("#ff0000"))]));
         assert_true!(def.clone().matches(&[str!("rebeccapurple")]));
 
         assert_false!(def.clone().matches(&[str!("thiscolordoesnotexist")]));
@@ -700,12 +679,9 @@ mod tests {
         assert_true!(def.clone().matches(&[str!("left"), unit!(10.0, "px"),]));
 
         // background-position: left 10px top 20px;
-        assert_true!(def.clone().matches(&[
-            str!("left"),
-            unit!(10.0, "px"),
-            str!("top"),
-            unit!(20.0, "px"),
-        ]));
+        assert_true!(def
+            .clone()
+            .matches(&[str!("left"), unit!(10.0, "px"), str!("top"), unit!(20.0, "px"),]));
 
         // background-position: right 15% bottom 5%;
         assert_true!(def.clone().matches(&[
@@ -727,17 +703,12 @@ mod tests {
         assert_true!(def.clone().matches(&[CssValue::Percentage(75.0),]));
 
         // background-position: top 10px center;
-        assert_true!(def
-            .clone()
-            .matches(&[str!("top"), unit!(10.0, "px"), str!("center"),]));
+        assert_true!(def.clone().matches(&[str!("top"), unit!(10.0, "px"), str!("center"),]));
 
         // background-position: bottom 20px right 30px;
-        assert_true!(def.clone().matches(&[
-            str!("bottom"),
-            unit!(20.0, "px"),
-            str!("right"),
-            unit!(30.0, "px"),
-        ]));
+        assert_true!(def
+            .clone()
+            .matches(&[str!("bottom"), unit!(20.0, "px"), str!("right"), unit!(30.0, "px"),]));
 
         // background-position: 20% 80%;
         assert_true!(def
@@ -758,9 +729,7 @@ mod tests {
         ]));
 
         // background-position: center top 35px;
-        assert_true!(def
-            .clone()
-            .matches(&[str!("center"), str!("top"), unit!(35.0, "px"),]));
+        assert_true!(def.clone().matches(&[str!("center"), str!("top"), unit!(35.0, "px"),]));
 
         // background-position: left 45% bottom 25%;
         assert_true!(def.clone().matches(&[
@@ -885,11 +854,8 @@ mod tests {
             .clone()
             .matches(&[unit!(1.0, "px"), unit!(2.0, "px"), unit!(3.0, "px")]));
 
-        assert!(def.clone().matches(&[
-            unit!(1.0, "px"),
-            unit!(2.0, "px"),
-            unit!(3.0, "px"),
-            unit!(4.0, "px"),
-        ]));
+        assert!(def
+            .clone()
+            .matches(&[unit!(1.0, "px"), unit!(2.0, "px"), unit!(3.0, "px"), unit!(4.0, "px"),]));
     }
 }
diff --git a/crates/gosub_styling/src/shorthands.rs b/crates/gosub_css3/src/matcher/shorthands.rs
similarity index 92%
rename from crates/gosub_styling/src/shorthands.rs
rename to crates/gosub_css3/src/matcher/shorthands.rs
index 81386e8e3..38a678f9c 100644
--- a/crates/gosub_styling/src/shorthands.rs
+++ b/crates/gosub_css3/src/matcher/shorthands.rs
@@ -1,11 +1,11 @@
+use crate::stylesheet::{CssValue, Specificity};
+use gosub_shared::traits::css3::CssOrigin;
 use std::collections::hash_map::Entry;
 
-use gosub_css3::stylesheet::{CssOrigin, CssValue, Specificity};
-
-use crate::property_definitions::CssDefinitions;
-use crate::styling::{CssProperties, CssProperty, DeclarationProperty};
-use crate::syntax::{SyntaxComponent, SyntaxComponentMultiplier};
-use crate::syntax_matcher::CssSyntaxTree;
+use crate::matcher::property_definitions::CssDefinitions;
+use crate::matcher::styling::{CssProperties, CssProperty, DeclarationProperty};
+use crate::matcher::syntax::{SyntaxComponent, SyntaxComponentMultiplier};
+use crate::matcher::syntax_matcher::CssSyntaxTree;
 
 impl CssSyntaxTree {
     pub fn has_property_syntax(&self, property: &str) -> Option<Shorthand> {
@@ -28,9 +28,7 @@ impl SyntaxComponent {
     pub fn has_property_syntax(&self, prop: &str, path: &mut Vec<usize>) -> bool {
         match self {
             SyntaxComponent::Property { property, .. } => prop == property,
-            SyntaxComponent::Definition {
-                datatype, quoted, ..
-            } if *quoted => prop == datatype,
+            SyntaxComponent::Definition { datatype, quoted, .. } if *quoted => prop == datatype,
             SyntaxComponent::Group { components, .. } => {
                 for (i, component) in components.iter().enumerate() {
                     path.push(i);
@@ -218,11 +216,7 @@ impl<'a> ShorthandResolver<'a> {
             }
 
             if !complete.is_empty() {
-                let idx = self
-                    .fix_list
-                    .multipliers
-                    .iter_mut()
-                    .find(|m| m.0 == self.name);
+                let idx = self.fix_list.multipliers.iter_mut().find(|m| m.0 == self.name);
 
                 if let Some(idx) = idx {
                     let Some(items) = self.multiplier.get_names(complete, idx.1) else {
@@ -431,12 +425,7 @@ impl CssDefinitions {
         }
     }
 
-    pub fn resolve_shorthands(
-        &self,
-        computed: &[String],
-        syntax: &CssSyntaxTree,
-        name: &str,
-    ) -> Option<Shorthands> {
+    pub fn resolve_shorthands(&self, computed: &[String], syntax: &CssSyntaxTree, name: &str) -> Option<Shorthands> {
         if computed.len() <= 1 || syntax.components.is_empty() {
             return None;
         }
@@ -548,9 +537,7 @@ impl CssDefinitions {
             match component {
                 SyntaxComponent::Definition { datatype, .. } => {
                     if let Some(d) = self.syntax.get(datatype) {
-                        if let Some(mut shorthands) =
-                            self.resolve_shorthands(computed, &d.syntax, name)
-                        {
+                        if let Some(mut shorthands) = self.resolve_shorthands(computed, &d.syntax, name) {
                             shorthands.multiplier = Multiplier::None;
 
                             return Some(shorthands);
@@ -559,9 +546,7 @@ impl CssDefinitions {
 
                     if let Some(p) = self.properties.get(datatype) {
                         //currently properties get parsed as definitions
-                        if let Some(mut shorthands) =
-                            self.resolve_shorthands(computed, &p.syntax, name)
-                        {
+                        if let Some(mut shorthands) = self.resolve_shorthands(computed, &p.syntax, name) {
                             shorthands.multiplier = Multiplier::None;
 
                             return Some(shorthands);
@@ -571,9 +556,7 @@ impl CssDefinitions {
 
                 SyntaxComponent::Property { property, .. } => {
                     if let Some(d) = self.properties.get(property) {
-                        if let Some(mut shorthands) =
-                            self.resolve_shorthands(computed, &d.syntax, name)
-                        {
+                        if let Some(mut shorthands) = self.resolve_shorthands(computed, &d.syntax, name) {
                             shorthands.multiplier = Multiplier::None;
 
                             return Some(shorthands);
@@ -603,11 +586,10 @@ impl CssDefinitions {
 
 #[cfg(test)]
 mod tests {
-    use gosub_css3::colors::RgbColor;
-    use gosub_css3::stylesheet::CssValue;
-
-    use crate::property_definitions::get_css_definitions;
-    use crate::shorthands::FixList;
+    use crate::colors::RgbColor;
+    use crate::matcher::property_definitions::get_css_definitions;
+    use crate::matcher::shorthands::CssValue;
+    use crate::matcher::shorthands::FixList;
 
     macro_rules! str {
         ($s:expr) => {
@@ -666,10 +648,9 @@ mod tests {
         );
 
         fix_list = FixList::new();
-        assert!(prop.clone().matches_and_shorthands(
-            &[unit!(1.0, "px"), unit!(2.0, "px"), unit!(3.0, "px"),],
-            &mut fix_list,
-        ));
+        assert!(prop
+            .clone()
+            .matches_and_shorthands(&[unit!(1.0, "px"), unit!(2.0, "px"), unit!(3.0, "px"),], &mut fix_list,));
 
         assert_eq!(
             fix_list,
@@ -686,12 +667,7 @@ mod tests {
 
         fix_list = FixList::new();
         assert!(prop.clone().matches_and_shorthands(
-            &[
-                unit!(1.0, "px"),
-                unit!(2.0, "px"),
-                unit!(3.0, "px"),
-                unit!(4.0, "px"),
-            ],
+            &[unit!(1.0, "px"), unit!(2.0, "px"), unit!(3.0, "px"), unit!(4.0, "px"),],
             &mut fix_list,
         ));
 
@@ -737,10 +713,7 @@ mod tests {
         fix_list = FixList::new();
 
         assert!(prop.clone().matches_and_shorthands(
-            &[
-                str!("solid"),
-                CssValue::Color(RgbColor::new(0.0, 0.0, 0.0, 0.0))
-            ],
+            &[str!("solid"), CssValue::Color(RgbColor::new(0.0, 0.0, 0.0, 0.0))],
             &mut fix_list,
         ));
 
diff --git a/crates/gosub_styling/src/styling.rs b/crates/gosub_css3/src/matcher/styling.rs
similarity index 78%
rename from crates/gosub_styling/src/styling.rs
rename to crates/gosub_css3/src/matcher/styling.rs
index 631165256..0a1c46004 100644
--- a/crates/gosub_styling/src/styling.rs
+++ b/crates/gosub_css3/src/matcher/styling.rs
@@ -1,17 +1,21 @@
-use crate::property_definitions::{get_css_definitions, CSS_DEFINITIONS};
 use core::fmt::Debug;
-use gosub_css3::stylesheet::{
-    Combinator, CssOrigin, CssSelector, CssSelectorPart, CssValue, MatcherType, Specificity,
-};
-use gosub_html5::node::{Node, NodeId};
-use gosub_html5::parser::document::{Document, DocumentHandle};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::{CssOrigin, CssPropertyMap, CssSystem};
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::node::ClassList;
+use gosub_shared::traits::node::ElementDataType;
+use gosub_shared::traits::node::Node;
 use itertools::Itertools;
 use std::cmp::Ordering;
 use std::collections::HashMap;
 
+use crate::matcher::property_definitions::get_css_definitions;
+use crate::stylesheet::{Combinator, CssSelector, CssSelectorPart, CssValue, MatcherType, Specificity};
+
 // Matches a complete selector (all parts) against the given node(id)
-pub(crate) fn match_selector(
-    document: DocumentHandle,
+pub(crate) fn match_selector<D: Document<C>, C: CssSystem>(
+    document: DocumentHandle<D, C>,
     node_id: NodeId,
     selector: &CssSelector,
 ) -> (bool, Specificity) {
@@ -35,13 +39,13 @@ fn consume<'a, T>(this: &mut &'a [T]) -> Option<&'a T> {
 }
 
 /// Returns true when the given node matches the part(s)
-fn match_selector_parts(
-    document: DocumentHandle,
+fn match_selector_parts<D: Document<C>, C: CssSystem>(
+    handle: DocumentHandle<D, C>,
     node_id: NodeId,
     mut parts: &[CssSelectorPart],
 ) -> bool {
-    let binding = document.get();
-    let mut next_current_node = binding.get_node_by_id(node_id);
+    let binding = handle.get();
+    let mut next_current_node = binding.node_by_id(node_id);
     if next_current_node.is_none() {
         return false;
     }
@@ -55,13 +59,7 @@ fn match_selector_parts(
             return false;
         }
 
-        if !match_selector_part(
-            part,
-            current_node,
-            &binding,
-            &mut next_current_node,
-            &mut parts,
-        ) {
+        if !match_selector_part(part, current_node, &*binding, &mut next_current_node, &mut parts) {
             return false;
         }
 
@@ -74,11 +72,11 @@ fn match_selector_parts(
     true
 }
 
-fn match_selector_part<'a>(
+fn match_selector_part<'a, D: Document<C>, C: CssSystem>(
     part: &CssSelectorPart,
-    current_node: &Node,
-    doc: &'a Document,
-    next_node: &mut Option<&'a Node>,
+    current_node: &D::Node,
+    doc: &'a D,
+    next_node: &mut Option<&'a D::Node>,
     parts: &mut &[CssSelectorPart],
 ) -> bool {
     match part {
@@ -87,24 +85,25 @@ fn match_selector_part<'a>(
             true
         }
         CssSelectorPart::Type(name) => {
-            if !current_node.is_element() {
+            if !current_node.is_element_node() {
                 return false;
             }
-            *name == current_node.as_element().name
+            *name == current_node.get_element_data().unwrap().name()
         }
         CssSelectorPart::Class(name) => {
-            if !current_node.is_element() {
+            if !current_node.is_element_node() {
                 return false;
             }
-            current_node.as_element().classes.contains(name)
+            current_node.get_element_data().unwrap().classlist().contains(name)
         }
         CssSelectorPart::Id(name) => {
-            if !current_node.is_element() {
+            if !current_node.is_element_node() {
                 return false;
             }
             current_node
-                .as_element()
-                .attributes
+                .get_element_data()
+                .unwrap()
+                .attributes()
                 .get("id")
                 .unwrap_or(&"".to_string())
                 == name
@@ -112,15 +111,17 @@ fn match_selector_part<'a>(
         CssSelectorPart::Attribute(attr) => {
             let wanted_attr_name = &attr.name;
 
-            if !current_node.has_attribute(wanted_attr_name) {
+            if current_node.get_element_data().is_none() {
+                return false;
+            }
+
+            let element_data = current_node.get_element_data().unwrap();
+            if !element_data.attributes().contains_key(wanted_attr_name) {
                 return false;
             }
 
             let mut wanted_attr_value = &attr.value;
-            let mut got_attr_value = current_node
-                .get_attribute(wanted_attr_name)
-                .map(|v| v.as_str())
-                .unwrap_or("");
+            let mut got_attr_value = element_data.attributes().get(wanted_attr_name).unwrap();
 
             let mut _wanted_buf = String::new(); //Two buffers, so we don't need to clone the value if we match case-sensitive
             let mut _got_buf = String::new();
@@ -144,9 +145,7 @@ fn match_selector_part<'a>(
                 }
                 MatcherType::Includes => {
                     // Contains word
-                    wanted_attr_value
-                        .split_whitespace()
-                        .any(|s| s == got_attr_value)
+                    wanted_attr_value.split_whitespace().any(|s| s == got_attr_value)
                 }
                 MatcherType::DashMatch => {
                     // Exact value or value followed by a hyphen
@@ -179,18 +178,19 @@ fn match_selector_part<'a>(
             // We don't have the descendant combinator (space), as this is the default behaviour
             match combinator {
                 Combinator::Descendant => {
-                    let Some(mut parent_id) = current_node.parent else {
+                    // let handle_clone = handle.clone();
+
+                    let Some(mut parent_id) = current_node.parent_id() else {
                         return false;
                     };
 
                     let last = consume(parts);
-
                     let Some(last) = last else {
                         return false;
                     };
 
                     loop {
-                        let Some(parent) = doc.get_node_by_id(parent_id) else {
+                        let Some(parent) = doc.node_by_id(parent_id) else {
                             return false;
                         };
 
@@ -200,7 +200,7 @@ fn match_selector_part<'a>(
                             return true;
                         }
 
-                        let Some(p) = parent.parent else {
+                        let Some(p) = parent.parent_id() else {
                             return false;
                         };
 
@@ -209,7 +209,7 @@ fn match_selector_part<'a>(
                 }
                 Combinator::Child => {
                     // Child combinator. Only matches the direct child
-                    let Some(parent) = current_node.parent else {
+                    let Some(parent) = current_node.parent_id() else {
                         return false;
                     };
 
@@ -219,7 +219,7 @@ fn match_selector_part<'a>(
                         return false;
                     };
 
-                    let Some(parent) = doc.get_node_by_id(parent) else {
+                    let Some(parent) = doc.node_by_id(parent) else {
                         return false;
                     };
 
@@ -228,13 +228,14 @@ fn match_selector_part<'a>(
                     match_selector_part(last, parent, doc, next_node, parts)
                 }
                 Combinator::NextSibling => {
-                    let Some(children) = doc.parent_node(current_node).map(|p| &p.children) else {
+                    let parent_node = doc.node_by_id(current_node.parent_id().unwrap());
+                    let Some(children) = parent_node.map(|p| p.children()) else {
                         return false;
                     };
 
                     let Some(my_index) = children
                         .iter()
-                        .find_position(|c| **c == current_node.id)
+                        .find_position(|c| **c == current_node.id())
                         .map(|(i, _)| i)
                     else {
                         return false;
@@ -252,7 +253,7 @@ fn match_selector_part<'a>(
                         return false;
                     };
 
-                    let Some(prev) = doc.get_node_by_id(prev_id) else {
+                    let Some(prev) = doc.node_by_id(prev_id) else {
                         return false;
                     };
 
@@ -261,7 +262,8 @@ fn match_selector_part<'a>(
                     match_selector_part(last, prev, doc, next_node, parts)
                 }
                 Combinator::SubsequentSibling => {
-                    let Some(children) = doc.parent_node(current_node).map(|p| &p.children) else {
+                    let parent_node = doc.node_by_id(current_node.parent_id().unwrap());
+                    let Some(children) = parent_node.map(|p| p.children()) else {
                         return false;
                     };
 
@@ -270,11 +272,11 @@ fn match_selector_part<'a>(
                     };
 
                     for child in children {
-                        if *child == current_node.id {
+                        if *child == current_node.id() {
                             break;
                         }
 
-                        let Some(child) = doc.get_node_by_id(*child) else {
+                        let Some(child) = doc.node_by_id(*child) else {
                             continue;
                         };
 
@@ -289,10 +291,6 @@ fn match_selector_part<'a>(
                     let namespace = consume(parts);
 
                     let Some(namespace) = namespace else {
-                        if current_node.namespace.is_none() {
-                            return true;
-                        }
-
                         return false;
                     };
 
@@ -304,7 +302,7 @@ fn match_selector_part<'a>(
                         return false;
                     };
 
-                    current_node.is_namespace(namespace)
+                    current_node.get_element_data().unwrap().is_namespace(namespace)
                 }
                 Combinator::Column => {
                     //TODO
@@ -326,6 +324,7 @@ pub struct DeclarationProperty {
     pub origin: CssOrigin,
     /// Whether the declaration is !important
     pub important: bool,
+    // @TODO: location should be a Location
     /// The location of the declaration in the stylesheet (name.css:123) or empty
     pub location: String,
     /// The specificity of the selector that declared this property
@@ -492,7 +491,7 @@ impl CssProperty {
         }
     }
 
-    // /// Returns true if the given property is a shorthand property (ie: border, margin etc)
+    // /// Returns true if the given property is a shorthand property (ie: border, margin etc.)
     pub fn is_shorthand(&self) -> bool {
         let defs = get_css_definitions();
         match defs.find_property(&self.name) {
@@ -520,8 +519,74 @@ impl CssProperty {
     // // Returns the initial value for the property, if any
     fn get_initial_value(&self) -> Option<CssValue> {
         let defs = get_css_definitions();
-        defs.find_property(&self.name)
-            .map(|def| def.initial_value())
+        defs.find_property(&self.name).map(|def| def.initial_value())
+    }
+}
+
+impl gosub_shared::traits::css3::CssProperty for CssProperty {
+    type Value = CssValue;
+
+    fn compute_value(&mut self) {
+        self.compute_value();
+    }
+    fn unit_to_px(&self) -> f32 {
+        self.actual.unit_to_px()
+    }
+
+    fn as_string(&self) -> Option<&str> {
+        if let CssValue::String(str) = &self.actual {
+            Some(str)
+        } else {
+            None
+        }
+    }
+
+    fn as_percentage(&self) -> Option<f32> {
+        if let CssValue::Percentage(percent) = &self.actual {
+            Some(*percent)
+        } else {
+            None
+        }
+    }
+
+    fn as_unit(&self) -> Option<(f32, &str)> {
+        if let CssValue::Unit(value, unit) = &self.actual {
+            Some((*value, unit))
+        } else {
+            None
+        }
+    }
+
+    fn as_color(&self) -> Option<(f32, f32, f32, f32)> {
+        if let CssValue::Color(color) = &self.actual {
+            Some((color.r, color.g, color.b, color.a))
+        } else {
+            None
+        }
+    }
+
+    fn parse_color(&self) -> Option<(f32, f32, f32, f32)> {
+        self.actual.to_color().map(|color| (color.r, color.g, color.b, color.a))
+    }
+
+    fn as_number(&self) -> Option<f32> {
+        if let CssValue::Number(num) = &self.actual {
+            Some(*num)
+        } else {
+            None
+        }
+    }
+
+    fn as_list(&self) -> Option<Vec<Self::Value>> {
+        if let CssValue::List(list) = &self.actual {
+            Some(list.to_vec())
+        } else {
+            None
+        }
+    }
+
+    fn is_none(&self) -> bool {
+        matches!(self.actual, CssValue::None)
     }
 }
 
@@ -530,6 +595,7 @@ impl CssProperty {
 #[derive(Debug)]
 pub struct CssProperties {
     pub properties: HashMap<String, CssProperty>,
+    pub dirty: bool,
 }
 
 impl Default for CssProperties {
@@ -542,6 +608,7 @@ impl CssProperties {
     pub fn new() -> Self {
         Self {
             properties: HashMap::new(),
+            dirty: true,
         }
     }
 
@@ -550,17 +617,47 @@ impl CssProperties {
     }
 }
 
-pub fn prop_is_inherit(name: &str) -> bool {
-    CSS_DEFINITIONS
-        .find_property(name)
-        .map(|def| def.inherited)
-        .unwrap_or(false)
+impl CssPropertyMap for CssProperties {
+    type Property = CssProperty;
+
+    fn insert_inherited(&mut self, name: &str, value: Self::Property) {
+        self.properties.entry(name.to_string()).or_insert(value);
+    }
+
+    fn get(&self, name: &str) -> Option<&Self::Property> {
+        self.properties.get(name)
+    }
+
+    fn get_mut(&mut self, name: &str) -> Option<&mut Self::Property> {
+        self.properties.get_mut(name)
+    }
+
+    fn make_dirty(&mut self) {
+        self.dirty = true;
+    }
+
+    fn iter(&self) -> impl Iterator<Item = (&str, &Self::Property)> + '_ {
+        self.properties.iter().map(|(k, v)| (k.as_str(), v))
+    }
+
+    fn iter_mut(&mut self) -> impl Iterator<Item = (&str, &mut Self::Property)> + '_ {
+        self.properties.iter_mut().map(|(k, v)| (k.as_str(), v))
+    }
+
+    fn make_clean(&mut self) {
+        self.dirty = false;
+    }
+
+    fn is_dirty(&self) -> bool {
+        self.dirty
+    }
 }
 
 #[cfg(test)]
 mod tests {
     use super::*;
-    use gosub_css3::colors::RgbColor;
+    use crate::colors::RgbColor;
+    use crate::system::prop_is_inherit;
 
     #[test]
     fn css_props() {
diff --git a/crates/gosub_styling/src/syntax.rs b/crates/gosub_css3/src/matcher/syntax.rs
similarity index 94%
rename from crates/gosub_styling/src/syntax.rs
rename to crates/gosub_css3/src/matcher/syntax.rs
index 1402f1b02..f9e732dfd 100644
--- a/crates/gosub_styling/src/syntax.rs
+++ b/crates/gosub_css3/src/matcher/syntax.rs
@@ -1,10 +1,9 @@
 use std::fmt::{Debug, Display, Formatter};
 
+use gosub_shared::errors::{CssError, CssResult};
 use nom::branch::alt;
 use nom::bytes::complete::{tag, tag_no_case, take_while};
-use nom::character::complete::{
-    alpha1, alphanumeric1, char, digit0, digit1, multispace0, one_of, space0,
-};
+use nom::character::complete::{alpha1, alphanumeric1, char, digit0, digit1, multispace0, one_of, space0};
 use nom::combinator::{map, map_res, opt, recognize};
 use nom::multi::{fold_many1, many0, many1, separated_list0, separated_list1};
 use nom::number::complete::float;
@@ -12,11 +11,8 @@ use nom::sequence::{delimited, pair, preceded, separated_pair, tuple};
 use nom::Err;
 use nom::IResult;
 
-use gosub_css3::stylesheet::CssValue;
-use gosub_shared::types::Result;
-
-use crate::errors::Error;
-use crate::syntax_matcher::CssSyntaxTree;
+use crate::matcher::syntax_matcher::CssSyntaxTree;
+use crate::stylesheet::CssValue;
 
 // When debugging the parser, it's nice to have some additional information ready. This should maybe
 // be inside a cfg setting, but for now (un)commenting the appropriate line is good enough.
@@ -33,6 +29,7 @@ pub struct Group {
     pub components: Vec<SyntaxComponent>,
 }
 
+#[allow(dead_code)]
 #[derive(PartialEq, Debug, Clone)]
 pub enum GroupCombinators {
     /// All elements must be matched in order (space delimited)
@@ -259,7 +256,7 @@ impl CssSyntax {
     }
 
     /// Compiles the current syntax into a list of components or Err on compilation error
-    pub fn compile(self) -> Result<CssSyntaxTree> {
+    pub fn compile(self) -> CssResult<CssSyntaxTree> {
         if self.source.is_empty() {
             return Ok(CssSyntaxTree::new(vec![]));
         }
@@ -268,15 +265,13 @@ impl CssSyntax {
         match p {
             Ok((input, components)) => {
                 if !input.trim().is_empty() {
-                    return Err(Error::CssCompile(format!(
-                        "Failed to parse all input (left: '{}')",
-                        input
-                    ))
-                    .into());
+                    return Err(CssError::new(
+                        format!("Failed to parse all input (left: '{}')", input).as_str(),
+                    ));
                 }
                 Ok(CssSyntaxTree::new(vec![components]))
             }
-            Err(err) => Err(Error::CssCompile(err.to_string()).into()),
+            Err(e) => Err(CssError::new(e.to_string().as_str())),
         }
     }
 }
@@ -297,10 +292,7 @@ fn parse_unit(input: &str) -> IResult<&str, SyntaxComponent> {
                 },
             ))
         } else {
-            Err(Err::Error(nom::error::Error::new(
-                input,
-                nom::error::ErrorKind::Alpha,
-            )))
+            Err(Err::Error(nom::error::Error::new(input, nom::error::ErrorKind::Alpha)))
         };
     }
 
@@ -353,10 +345,7 @@ fn parse_comma_separated_multiplier(input: &str) -> IResult<&str, SyntaxComponen
     ));
 
     let (input, minmax) = alt((
-        map(
-            delimited(ws(tag("#{")), range, ws(tag("}"))),
-            |(min, max)| (min, max),
-        ),
+        map(delimited(ws(tag("#{")), range, ws(tag("}"))), |(min, max)| (min, max)),
         // No range means one or more values
         map(ws(tag("#")), |_| (1, u32::MAX)),
     ))(input)?;
@@ -391,8 +380,7 @@ fn parse_multipliers(input: &str) -> IResult<&str, Vec<SyntaxComponentMultiplier
 fn parse_group(input: &str) -> IResult<&str, SyntaxComponent> {
     debug_print!("Parsing group: {}", input);
 
-    let (input, components) =
-        delimited(ws(tag("[")), parse_component_singlebar_list, ws(tag("]")))(input)?;
+    let (input, components) = delimited(ws(tag("[")), parse_component_singlebar_list, ws(tag("]")))(input)?;
 
     Ok((input, components))
 }
@@ -420,8 +408,7 @@ fn parse_component_singlebar_list(input: &str) -> IResult<&str, SyntaxComponent>
 fn parse_component_doublebar_list(input: &str) -> IResult<&str, SyntaxComponent> {
     debug_print!("Parsing component doublebar list: {}", input);
 
-    let (input, components) =
-        separated_list1(ws(tag("||")), parse_component_doubleampersand_list)(input)?;
+    let (input, components) = separated_list1(ws(tag("||")), parse_component_doubleampersand_list)(input)?;
 
     if components.len() == 1 {
         return Ok((input, components[0].clone()));
@@ -441,8 +428,7 @@ fn parse_component_doublebar_list(input: &str) -> IResult<&str, SyntaxComponent>
 fn parse_component_doubleampersand_list(input: &str) -> IResult<&str, SyntaxComponent> {
     debug_print!("Parsing component doubleampersand list: {}", input);
 
-    let (input, components) =
-        separated_list1(ws(tag("&&")), parse_component_juxtaposition_list)(input)?;
+    let (input, components) = separated_list1(ws(tag("&&")), parse_component_juxtaposition_list)(input)?;
 
     if components.len() == 1 {
         return Ok((input, components[0].clone()));
@@ -597,11 +583,7 @@ fn parse_function(input: &str) -> IResult<&str, SyntaxComponent> {
         space0,
         tuple((space0, char(')'), space0)),
     );
-    let arglist = delimited(
-        ws(tag("(")),
-        ws(parse_component_singlebar_list),
-        ws(tag(")")),
-    );
+    let arglist = delimited(ws(tag("(")), ws(parse_component_singlebar_list), ws(tag(")")));
 
     let (input, name) = parse_keyword(input)?;
     let (input, arglist) = alt((map(empty_arglist, |_| None), map(arglist, Some)))(input)?;
@@ -662,21 +644,18 @@ fn parse_infinity(input: &str) -> IResult<&str, NumberOrInfinity> {
 
 /// Parses an integer (signed or unsigned) and returns NumberOrInfinity::FiniteI64, or errors when the integer is invalid
 fn parse_signed_integer(input: &str) -> IResult<&str, NumberOrInfinity> {
-    map_res(
-        pair(opt(char('-')), digit1),
-        |(sign, digits): (Option<char>, &str)| {
-            let neg_multiplier = if sign == Some('-') { -1 } else { 1 };
-            let num = digits.parse::<i64>().map(|num| num * neg_multiplier);
-            if let Ok(num) = num {
-                Ok(NumberOrInfinity::FiniteI64(num))
-            } else {
-                Err(nom::Err::Error(nom::error::Error::new(
-                    input,
-                    nom::error::ErrorKind::Digit,
-                )))
-            }
-        },
-    )(input)
+    map_res(pair(opt(char('-')), digit1), |(sign, digits): (Option<char>, &str)| {
+        let neg_multiplier = if sign == Some('-') { -1 } else { 1 };
+        let num = digits.parse::<i64>().map(|num| num * neg_multiplier);
+        if let Ok(num) = num {
+            Ok(NumberOrInfinity::FiniteI64(num))
+        } else {
+            Err(nom::Err::Error(nom::error::Error::new(
+                input,
+                nom::error::ErrorKind::Digit,
+            )))
+        }
+    })(input)
 }
 
 fn parse_unit_range(input: &str) -> IResult<&str, NumberOrInfinity> {
@@ -702,17 +681,9 @@ fn parse_unit_range(input: &str) -> IResult<&str, NumberOrInfinity> {
 /// Parses a range for a type definition  (ie: the square bracket part of: <function [1, 10]>)
 fn datatype_range(input: &str) -> IResult<&str, RangeType> {
     let range = separated_pair(
-        opt(ws(alt((
-            parse_infinity,
-            parse_unit_range,
-            parse_signed_integer,
-        )))),
+        opt(ws(alt((parse_infinity, parse_unit_range, parse_signed_integer)))),
         tag(","),
-        opt(ws(alt((
-            parse_infinity,
-            parse_unit_range,
-            parse_signed_integer,
-        )))),
+        opt(ws(alt((parse_infinity, parse_unit_range, parse_signed_integer)))),
     );
 
     let range = map(range, |(min, max)| RangeType {
@@ -735,10 +706,9 @@ fn parse_datatype(input: &str) -> IResult<&str, SyntaxComponent> {
     let (input, (name, quoted, range)) = delimited(
         ws(tag("<")),
         alt((
-            map(
-                pair(keyword_or_function, opt(datatype_range)),
-                |(name, range)| (name, false, range),
-            ),
+            map(pair(keyword_or_function, opt(datatype_range)), |(name, range)| {
+                (name, false, range)
+            }),
             map(
                 pair(
                     delimited(ws(tag("'")), keyword_or_function, ws(tag("'"))),
@@ -789,13 +759,12 @@ fn parse_literal(input: &str) -> IResult<&str, SyntaxComponent> {
             literal: ",".to_string(),
             multipliers: vec![SyntaxComponentMultiplier::Once],
         }),
-        map(
-            delimited(tag("'"), take_while(|c| c != '\''), tag("'")),
-            |s: &str| SyntaxComponent::Literal {
+        map(delimited(tag("'"), take_while(|c| c != '\''), tag("'")), |s: &str| {
+            SyntaxComponent::Literal {
                 literal: s.to_string(),
                 multipliers: vec![SyntaxComponentMultiplier::Once],
-            },
-        ),
+            }
+        }),
     ))(input)
 }
 
@@ -832,9 +801,8 @@ fn parse(input: &str) -> IResult<&str, SyntaxComponent> {
 
 #[cfg(test)]
 mod tests {
-    use crate::property_definitions::get_css_definitions;
-
     use super::*;
+    use crate::matcher::property_definitions::get_css_definitions;
 
     #[test]
     fn test_compile_empty() {
@@ -1016,10 +984,7 @@ mod tests {
             parts.unwrap(),
             CssSyntaxTree::new(vec![SyntaxComponent::GenericKeyword {
                 keyword: "color".to_string(),
-                multipliers: vec![SyntaxComponentMultiplier::CommaSeparatedRepeat(
-                    1,
-                    u32::MAX as usize
-                )],
+                multipliers: vec![SyntaxComponentMultiplier::CommaSeparatedRepeat(1, u32::MAX as usize)],
             }])
         );
 
@@ -1219,10 +1184,7 @@ mod tests {
                 datatype: "foo".to_string(),
                 quoted: false,
                 range: RangeType::empty(),
-                multipliers: vec![SyntaxComponentMultiplier::CommaSeparatedRepeat(
-                    1,
-                    u32::MAX as usize
-                )],
+                multipliers: vec![SyntaxComponentMultiplier::CommaSeparatedRepeat(1, u32::MAX as usize)],
             }]
         );
     }
@@ -1403,9 +1365,7 @@ mod tests {
             }
         );
 
-        let c = CssSyntax::new("left | right || top && bottom")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("left | right || top && bottom").compile().unwrap();
         assert_eq!(
             c.components[0],
             SyntaxComponent::Group {
@@ -1444,9 +1404,7 @@ mod tests {
             }
         );
 
-        let c = CssSyntax::new("left || right | top && bottom")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("left || right | top && bottom").compile().unwrap();
         assert_eq!(
             c.components[0],
             SyntaxComponent::Group {
@@ -1485,9 +1443,7 @@ mod tests {
             }
         );
 
-        let c = CssSyntax::new("left && right || top | bottom")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("left && right || top | bottom").compile().unwrap();
         assert_eq!(
             c.components[0],
             SyntaxComponent::Group {
@@ -1526,9 +1482,7 @@ mod tests {
             }
         );
 
-        let c = CssSyntax::new("left  right || top | bottom")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("left  right || top | bottom").compile().unwrap();
         assert_eq!(
             c.components[0],
             SyntaxComponent::Group {
@@ -1567,9 +1521,7 @@ mod tests {
             }
         );
 
-        let c = CssSyntax::new("left | right || top | bottom")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("left | right || top | bottom").compile().unwrap();
         assert_eq!(
             c.components[0],
             SyntaxComponent::Group {
@@ -1602,9 +1554,7 @@ mod tests {
             }
         );
 
-        let c = CssSyntax::new("left || right | top || bottom")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("left || right | top || bottom").compile().unwrap();
         assert_eq!(
             c.components[0],
             SyntaxComponent::Group {
@@ -1801,49 +1751,31 @@ mod tests {
         // @todo: These tests should also check if the syntax is correct, not only if it can
         // compile. The output could still be wrong.
         assert!(CssSyntax::new("le, ri ,co , bt,tp").compile().is_ok());
-        assert!(CssSyntax::new("left | right | center && top")
-            .compile()
-            .is_ok());
+        assert!(CssSyntax::new("left | right | center && top").compile().is_ok());
         assert!(CssSyntax::new("left , right color()").compile().is_ok());
         assert!(CssSyntax::new("left , right color() ").compile().is_ok());
         assert!(CssSyntax::new("le, ri ,co , bt,tp").compile().is_ok());
         assert!(CssSyntax::new("left, right color()").compile().is_ok());
-        assert!(CssSyntax::new("left | right | center && top")
+        assert!(CssSyntax::new("left | right | center && top").compile().is_ok());
+        assert!(CssSyntax::new("left | right | center && top <length>")
             .compile()
             .is_ok());
-        assert!(CssSyntax::new("left | right | center && top <length>")
+        assert!(CssSyntax::new("[ [ <length-percentage>? ]]").compile().is_ok());
+        assert!(CssSyntax::new("[ [ center | [ top | bottom ]  ]]").compile().is_ok());
+        assert!(CssSyntax::new("[ <length-percentage>? ]").compile().is_ok());
+        assert!(CssSyntax::new("[ center <length-percentage>? ]").compile().is_ok());
+        assert!(CssSyntax::new("center | [ top | bottom ] <length-percentage>")
             .compile()
             .is_ok());
-        assert!(CssSyntax::new("[ [ <length-percentage>? ]]")
+        assert!(CssSyntax::new("[ center | [ top | bottom ] <length-percentage> ]")
             .compile()
             .is_ok());
-        assert!(CssSyntax::new("[ [ center | [ top | bottom ]  ]]")
+        assert!(CssSyntax::new("[ center | [ top | bottom ] <length-percentage>? ]")
             .compile()
             .is_ok());
-        assert!(CssSyntax::new("[ <length-percentage>? ]").compile().is_ok());
-        assert!(CssSyntax::new("[ center <length-percentage>? ]")
+        assert!(CssSyntax::new("[ [ center | [ top | bottom ] <length-percentage>? ]]")
             .compile()
             .is_ok());
-        assert!(
-            CssSyntax::new("center | [ top | bottom ] <length-percentage>")
-                .compile()
-                .is_ok()
-        );
-        assert!(
-            CssSyntax::new("[ center | [ top | bottom ] <length-percentage> ]")
-                .compile()
-                .is_ok()
-        );
-        assert!(
-            CssSyntax::new("[ center | [ top | bottom ] <length-percentage>? ]")
-                .compile()
-                .is_ok()
-        );
-        assert!(
-            CssSyntax::new("[ [ center | [ top | bottom ] <length-percentage>? ]]")
-                .compile()
-                .is_ok()
-        );
         assert!(CssSyntax::new("[ [ top | center | bottom | <length-percentage> ]| [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ]]").compile().is_ok());
         assert!(CssSyntax::new("[ [ left | center | right | top | bottom | <length-percentage> ]| [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ]| [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ]]").compile().is_ok());
     }
@@ -1962,9 +1894,7 @@ mod tests {
             }])
         );
 
-        let c = CssSyntax::new("left && right | foo || bar baz")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("left && right | foo || bar baz").compile().unwrap();
         assert_eq!(
             c,
             CssSyntaxTree::new(vec![SyntaxComponent::Group {
@@ -2013,9 +1943,7 @@ mod tests {
             }])
         );
 
-        let c = CssSyntax::new("[ left ] [ right ] [ top ]")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("[ left ] [ right ] [ top ]").compile().unwrap();
         assert_eq!(
             c,
             CssSyntaxTree::new(vec![SyntaxComponent::Group {
@@ -2127,9 +2055,7 @@ mod tests {
             }])
         );
 
-        let c = CssSyntax::new("[ [ left ] [ right ] [ top ] ] a")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("[ [ left ] [ right ] [ top ] ] a").compile().unwrap();
         assert_eq!(
             c,
             CssSyntaxTree::new(vec![SyntaxComponent::Group {
@@ -2162,9 +2088,7 @@ mod tests {
             }])
         );
 
-        let c = CssSyntax::new("[ [ left ] | [ right ] [ top ] ]")
-            .compile()
-            .unwrap();
+        let c = CssSyntax::new("[ [ left ] | [ right ] [ top ] ]").compile().unwrap();
         assert_eq!(
             c,
             CssSyntaxTree::new(vec![SyntaxComponent::Group {
@@ -2312,15 +2236,11 @@ mod tests {
                                                 components: vec![
                                                     SyntaxComponent::GenericKeyword {
                                                         keyword: "left".to_string(),
-                                                        multipliers: vec![
-                                                            SyntaxComponentMultiplier::Once
-                                                        ],
+                                                        multipliers: vec![SyntaxComponentMultiplier::Once],
                                                     },
                                                     SyntaxComponent::GenericKeyword {
                                                         keyword: "right".to_string(),
-                                                        multipliers: vec![
-                                                            SyntaxComponentMultiplier::Once
-                                                        ],
+                                                        multipliers: vec![SyntaxComponentMultiplier::Once],
                                                     },
                                                 ],
                                                 multipliers: vec![SyntaxComponentMultiplier::Once],
@@ -2332,9 +2252,7 @@ mod tests {
                                                     min: NumberOrInfinity::None,
                                                     max: NumberOrInfinity::None,
                                                 },
-                                                multipliers: vec![
-                                                    SyntaxComponentMultiplier::Optional
-                                                ],
+                                                multipliers: vec![SyntaxComponentMultiplier::Optional],
                                             },
                                         ],
                                         multipliers: vec![SyntaxComponentMultiplier::Once],
@@ -2357,15 +2275,11 @@ mod tests {
                                                 components: vec![
                                                     SyntaxComponent::GenericKeyword {
                                                         keyword: "top".to_string(),
-                                                        multipliers: vec![
-                                                            SyntaxComponentMultiplier::Once
-                                                        ],
+                                                        multipliers: vec![SyntaxComponentMultiplier::Once],
                                                     },
                                                     SyntaxComponent::GenericKeyword {
                                                         keyword: "bottom".to_string(),
-                                                        multipliers: vec![
-                                                            SyntaxComponentMultiplier::Once
-                                                        ],
+                                                        multipliers: vec![SyntaxComponentMultiplier::Once],
                                                     },
                                                 ],
                                                 multipliers: vec![SyntaxComponentMultiplier::Once],
@@ -2377,9 +2291,7 @@ mod tests {
                                                     min: NumberOrInfinity::None,
                                                     max: NumberOrInfinity::None,
                                                 },
-                                                multipliers: vec![
-                                                    SyntaxComponentMultiplier::Optional
-                                                ],
+                                                multipliers: vec![SyntaxComponentMultiplier::Optional],
                                             },
                                         ],
                                         multipliers: vec![SyntaxComponentMultiplier::Once],
@@ -2395,11 +2307,9 @@ mod tests {
             }])
         );
 
-        let c = CssSyntax::new(
-            "[ [ left+ ] | [ center? ] [ top# ]{1,3} | [ center1 ]? && [ center2 ] ]*",
-        )
-        .compile()
-        .unwrap();
+        let c = CssSyntax::new("[ [ left+ ] | [ center? ] [ top# ]{1,3} | [ center1 ]? && [ center2 ] ]*")
+            .compile()
+            .unwrap();
         assert_eq!(
             c,
             CssSyntaxTree::new(vec![SyntaxComponent::Group {
diff --git a/crates/gosub_styling/src/syntax_matcher.rs b/crates/gosub_css3/src/matcher/syntax_matcher.rs
similarity index 90%
rename from crates/gosub_styling/src/syntax_matcher.rs
rename to crates/gosub_css3/src/matcher/syntax_matcher.rs
index 822a2775b..8e70cb4e0 100644
--- a/crates/gosub_styling/src/syntax_matcher.rs
+++ b/crates/gosub_css3/src/matcher/syntax_matcher.rs
@@ -1,8 +1,7 @@
-use gosub_css3::colors::{is_named_color, is_system_color};
-use gosub_css3::stylesheet::CssValue;
-
-use crate::shorthands::{copy_resolver, ShorthandResolver};
-use crate::syntax::{GroupCombinators, SyntaxComponent, SyntaxComponentMultiplier};
+use crate::colors::{is_named_color, is_system_color};
+use crate::matcher::shorthands::{copy_resolver, ShorthandResolver};
+use crate::matcher::syntax::{GroupCombinators, SyntaxComponent, SyntaxComponentMultiplier};
+use crate::stylesheet::CssValue;
 
 /// Structure to return from a matching function.
 #[derive(Debug, Clone)]
@@ -17,9 +16,8 @@ pub struct MatchResult<'a> {
 
 #[allow(dead_code)]
 const LENGTH_UNITS: [&str; 31] = [
-    "cap", "ch", "em", "ex", "ic", "lh", "rcap", "rch", "rem", "rex", "ric", "rlh", "vh", "vw",
-    "vmax", "vmin", "vb", "vi", "cqw", "cqh", "cqi", "cqb", "cqmin", "cqmax", "px", "cm", "mm",
-    "Q", "in", "pc", "pt",
+    "cap", "ch", "em", "ex", "ic", "lh", "rcap", "rch", "rem", "rex", "ric", "rlh", "vh", "vw", "vmax", "vmin", "vb",
+    "vi", "cqw", "cqh", "cqi", "cqb", "cqmin", "cqmax", "px", "cm", "mm", "Q", "in", "pc", "pt",
 ];
 
 /// A CSS Syntax Tree is a tree sof CSS syntax components that can be used to match against CSS values.
@@ -178,8 +176,7 @@ fn match_component<'a>(
 
     // CSV loop
     loop {
-        let inner_result =
-            match_component_inner(input, component, copy_resolver(&mut shorthand_resolver));
+        let inner_result = match_component_inner(input, component, copy_resolver(&mut shorthand_resolver));
         if !comma_separated {
             // We don't need to check for comma separated values, so just return this result
             return inner_result;
@@ -234,25 +231,17 @@ fn match_component_group<'a>(
 ) -> MatchResult<'a> {
     match &component {
         SyntaxComponent::Group {
-            components,
-            combinator,
-            ..
+            components, combinator, ..
         } => {
             // println!("We need to do a group match on {:?}, our value is: {:?}", combinator, input);
 
             match combinator {
-                GroupCombinators::Juxtaposition => {
-                    match_group_juxtaposition(input, components, shorthand_resolver)
-                }
-                GroupCombinators::AllAnyOrder => {
-                    match_group_all_any_order(input, components, shorthand_resolver)
-                }
+                GroupCombinators::Juxtaposition => match_group_juxtaposition(input, components, shorthand_resolver),
+                GroupCombinators::AllAnyOrder => match_group_all_any_order(input, components, shorthand_resolver),
                 GroupCombinators::AtLeastOneAnyOrder => {
                     match_group_at_least_one_any_order(input, components, shorthand_resolver)
                 }
-                GroupCombinators::ExactlyOne => {
-                    match_group_exactly_one(input, components, shorthand_resolver)
-                }
+                GroupCombinators::ExactlyOne => match_group_exactly_one(input, components, shorthand_resolver),
             }
         }
         e => {
@@ -262,10 +251,7 @@ fn match_component_group<'a>(
 }
 
 /// Matches a single component value
-fn match_component_single<'a>(
-    input: &'a [CssValue],
-    component: &SyntaxComponent,
-) -> MatchResult<'a> {
+fn match_component_single<'a>(input: &'a [CssValue], component: &SyntaxComponent) -> MatchResult<'a> {
     // Get the first value from the input which we will use for matching
     let value = input.first().unwrap();
 
@@ -295,20 +281,14 @@ fn match_component_single<'a>(
             "angle" => match value {
                 CssValue::Zero => return first_match(input),
                 CssValue::Unit(_, u) if u.eq_ignore_ascii_case("deg") => return first_match(input),
-                CssValue::Unit(_, u) if u.eq_ignore_ascii_case("grad") => {
-                    return first_match(input)
-                }
+                CssValue::Unit(_, u) if u.eq_ignore_ascii_case("grad") => return first_match(input),
                 CssValue::Unit(_, u) if u.eq_ignore_ascii_case("rad") => return first_match(input),
-                CssValue::Unit(_, u) if u.eq_ignore_ascii_case("turn") => {
-                    return first_match(input)
-                }
+                CssValue::Unit(_, u) if u.eq_ignore_ascii_case("turn") => return first_match(input),
                 _ => {}
             },
             "length" => match value {
                 CssValue::Zero => return first_match(input),
-                CssValue::Unit(_, u) if LENGTH_UNITS.contains(&u.as_str()) => {
-                    return first_match(input)
-                }
+                CssValue::Unit(_, u) if LENGTH_UNITS.contains(&u.as_str()) => return first_match(input),
                 _ => {}
             },
             "system-color" => {
@@ -363,10 +343,7 @@ fn match_component_single<'a>(
             match value {
                 CssValue::Number(n) if *n == 0.0 => return first_match(input),
                 CssValue::Unit(n, u) => {
-                    if unit.contains(u)
-                        && *n >= from.unwrap_or(f32min)
-                        && *n <= to.unwrap_or(f32max)
-                    {
+                    if unit.contains(u) && *n >= from.unwrap_or(f32min) && *n <= to.unwrap_or(f32max) {
                         return first_match(input);
                     }
                 }
@@ -398,9 +375,7 @@ fn match_component_single<'a>(
             // let list = CssValue::List(c_args.clone());
             // return match_internal(&list, arguments);
         }
-        SyntaxComponent::Value {
-            value: css_value, ..
-        } => {
+        SyntaxComponent::Value { value: css_value, .. } => {
             if value == css_value {
                 return first_match(input);
             }
@@ -762,8 +737,7 @@ fn multiplier_fulfilled(component: &SyntaxComponent, cnt: usize) -> Fulfillment
         .filter(|m| {
             !matches!(
                 m,
-                SyntaxComponentMultiplier::AtLeastOneValue
-                    | SyntaxComponentMultiplier::CommaSeparatedRepeat(_, _)
+                SyntaxComponentMultiplier::AtLeastOneValue | SyntaxComponentMultiplier::CommaSeparatedRepeat(_, _)
             )
         })
         .collect();
@@ -818,12 +792,10 @@ fn first_match(input: &[CssValue]) -> MatchResult {
 
 #[cfg(test)]
 mod tests {
-    use gosub_css3::stylesheet::CssValue;
-
-    use crate::property_definitions::{get_css_definitions, PropertyDefinition};
-    use crate::syntax::CssSyntax;
 
     use super::*;
+    use crate::matcher::property_definitions::{get_css_definitions, PropertyDefinition};
+    use crate::matcher::syntax::CssSyntax;
 
     macro_rules! str {
         ($s:expr) => {
@@ -925,12 +897,7 @@ mod tests {
         assert_true!(tree.matches(&[CssValue::None, str!("auto"), str!("block")]));
         assert_false!(tree.matches(&[str!("auto"), str!("block")]));
         assert_false!(tree.matches(&[CssValue::None, str!("block")]));
-        assert_false!(tree.matches(&[
-            str!("block"),
-            str!("block"),
-            CssValue::None,
-            CssValue::None
-        ]));
+        assert_false!(tree.matches(&[str!("block"), str!("block"), CssValue::None, CssValue::None]));
     }
 
     #[test]
@@ -956,12 +923,7 @@ mod tests {
             CssValue::Comma,
             str!("block"),
         ]));
-        assert_false!(tree.matches(&[
-            str!("block"),
-            str!("block"),
-            CssValue::None,
-            CssValue::None,
-        ]));
+        assert_false!(tree.matches(&[str!("block"), str!("block"), CssValue::None, CssValue::None,]));
     }
 
     #[test]
@@ -984,13 +946,7 @@ mod tests {
             let res = match_group_juxtaposition(&input, components, None);
             assert_not_match!(res);
 
-            let input = [
-                str!("none"),
-                str!("block"),
-                str!("block"),
-                str!("auto"),
-                str!("none"),
-            ];
+            let input = [str!("none"), str!("block"), str!("block"), str!("auto"), str!("none")];
             let res = match_group_juxtaposition(&input, components, None);
             assert_not_match!(res);
 
@@ -1044,13 +1000,7 @@ mod tests {
             let res = match_group_all_any_order(&input, components, None);
             assert_match!(res);
 
-            let input = [
-                str!("none"),
-                str!("block"),
-                str!("block"),
-                str!("auto"),
-                str!("none"),
-            ];
+            let input = [str!("none"), str!("block"), str!("block"), str!("auto"), str!("none")];
 
             let res = match_group_all_any_order(&input, components, None);
             assert_not_match!(res);
@@ -1115,26 +1065,20 @@ mod tests {
         let tree = CssSyntax::new("foo bar baz").compile().unwrap();
         assert_false!(tree.clone().matches(&[str!("foo")]));
         assert_false!(tree.clone().matches(&[str!("foo")]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("baz"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("baz"),]));
         assert_false!(tree.clone().matches(&[str!("foo"), str!("baz"),]));
 
         let tree = CssSyntax::new("foo bar?").compile().unwrap();
         dbg!(&tree);
         assert_true!(tree.clone().matches(&[str!("foo")]));
         assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"),]));
-        assert_false!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("bar"),]));
+        assert_false!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("bar"),]));
         assert_false!(tree.clone().matches(&[str!("bar"), str!("foo"),]));
 
         let tree = CssSyntax::new("foo bar? baz").compile().unwrap();
         assert_false!(tree.clone().matches(&[str!("foo")]));
         assert_true!(tree.clone().matches(&[str!("foo"), str!("baz"),]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("baz"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("baz"),]));
 
         assert_false!(tree
             .clone()
@@ -1150,9 +1094,7 @@ mod tests {
         let tree = CssSyntax::new("foo bar* baz").compile().unwrap();
         assert_false!(tree.clone().matches(&[str!("foo")]));
         assert_false!(tree.clone().matches(&[str!("foo")]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("baz"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("baz"),]));
         assert_true!(tree.clone().matches(&[str!("foo"), str!("baz"),]));
         assert_true!(tree.clone().matches(&[
             str!("foo"),
@@ -1175,9 +1117,7 @@ mod tests {
         assert_true!(tree.clone().matches(&[str!("foo")]));
         assert_true!(tree.clone().matches(&[str!("foo")]));
         assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"),]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("bar"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("bar"),]));
         assert_false!(tree.clone().matches(&[str!("bar"), str!("foo"),]));
     }
 
@@ -1186,9 +1126,7 @@ mod tests {
         let tree = CssSyntax::new("foo bar+ baz").compile().unwrap();
         assert_false!(tree.clone().matches(&[str!("foo")]));
         assert_false!(tree.clone().matches(&[str!("foo")]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("baz"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("baz"),]));
         assert_false!(tree.clone().matches(&[str!("foo"), str!("baz"),]));
         assert_true!(tree.clone().matches(&[
             str!("foo"),
@@ -1211,18 +1149,14 @@ mod tests {
         assert_false!(tree.clone().matches(&[str!("foo")]));
         assert_false!(tree.clone().matches(&[str!("bar")]));
         assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"),]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("bar"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("bar"),]));
         assert_false!(tree.clone().matches(&[str!("bar"), str!("foo"),]));
 
         let tree = CssSyntax::new("foo+ bar+").compile().unwrap();
         assert_false!(tree.clone().matches(&[str!("foo")]));
         assert_false!(tree.clone().matches(&[str!("bar")]));
         assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"),]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("bar"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("bar"),]));
         assert_true!(tree
             .clone()
             .matches(&[str!("foo"), str!("foo"), str!("bar"), str!("bar"),]));
@@ -1235,20 +1169,14 @@ mod tests {
         let tree = CssSyntax::new("foo bar{1,3} baz").compile().unwrap();
         assert_false!(tree.clone().matches(&[str!("foo")]));
         assert_false!(tree.clone().matches(&[str!("foo")]));
-        assert_true!(tree
-            .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("baz"),]));
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("baz"),]));
         assert_false!(tree.clone().matches(&[str!("foo"), str!("baz"),]));
         assert_true!(tree
             .clone()
             .matches(&[str!("foo"), str!("bar"), str!("bar"), str!("baz"),]));
-        assert_true!(tree.clone().matches(&[
-            str!("foo"),
-            str!("bar"),
-            str!("bar"),
-            str!("bar"),
-            str!("baz"),
-        ]));
+        assert_true!(tree
+            .clone()
+            .matches(&[str!("foo"), str!("bar"), str!("bar"), str!("bar"), str!("baz"),]));
         assert_false!(tree.clone().matches(&[
             str!("foo"),
             str!("bar"),
@@ -1270,16 +1198,10 @@ mod tests {
         assert_true!(tree.clone().matches(&[str!("foo")]));
         assert_true!(tree.clone().matches(&[str!("foo")]));
         assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"),]));
-        assert_true!(tree
+        assert_true!(tree.clone().matches(&[str!("foo"), str!("bar"), str!("bar"),]));
+        assert_false!(tree
             .clone()
-            .matches(&[str!("foo"), str!("bar"), str!("bar"),]));
-        assert_false!(tree.clone().matches(&[
-            str!("foo"),
-            str!("bar"),
-            str!("bar"),
-            str!("bar"),
-            str!("bar"),
-        ]));
+            .matches(&[str!("foo"), str!("bar"), str!("bar"), str!("bar"), str!("bar"),]));
         assert_false!(tree.clone().matches(&[str!("bar"), str!("foo"),]));
     }
 
@@ -1291,11 +1213,9 @@ mod tests {
             PropertyDefinition {
                 name: "testprop".to_string(),
                 computed: vec![],
-                syntax: CssSyntax::new(
-                    "[ left | right ] <length>? | [ top | bottom ] <length> | [ top | bottom ]",
-                )
-                .compile()
-                .unwrap(),
+                syntax: CssSyntax::new("[ left | right ] <length>? | [ top | bottom ] <length> | [ top | bottom ]")
+                    .compile()
+                    .unwrap(),
                 inherited: false,
                 initial_value: None,
                 resolved: false,
@@ -1306,12 +1226,8 @@ mod tests {
 
         let prop = definitions.find_property("testprop").unwrap();
 
-        assert_true!(prop
-            .clone()
-            .matches(&[str!("left"), CssValue::Unit(5.0, "px".into()),]));
-        assert_true!(prop
-            .clone()
-            .matches(&[str!("top"), CssValue::Unit(5.0, "px".into()),]));
+        assert_true!(prop.clone().matches(&[str!("left"), CssValue::Unit(5.0, "px".into()),]));
+        assert_true!(prop.clone().matches(&[str!("top"), CssValue::Unit(5.0, "px".into()),]));
         assert_true!(prop
             .clone()
             .matches(&[str!("bottom"), CssValue::Unit(5.0, "px".into()),]));
@@ -1362,21 +1278,16 @@ mod tests {
         assert_true!(prop
             .clone()
             .matches(&[CssValue::Percentage(10.0), CssValue::Percentage(20.0),]));
-        assert_true!(prop.clone().matches(&[
-            CssValue::Unit(10.0, "px".into()),
-            CssValue::Percentage(20.0),
-        ]));
         assert_true!(prop
             .clone()
-            .matches(&[str!("left"), CssValue::Percentage(20.0),]));
+            .matches(&[CssValue::Unit(10.0, "px".into()), CssValue::Percentage(20.0),]));
+        assert_true!(prop.clone().matches(&[str!("left"), CssValue::Percentage(20.0),]));
 
         assert_true!(prop
             .clone()
             .matches(&[CssValue::Unit(10.0, "px".into()), str!("center"),]));
 
-        assert_true!(prop
-            .clone()
-            .matches(&[CssValue::Percentage(10.0), str!("top"),]));
+        assert_true!(prop.clone().matches(&[CssValue::Percentage(10.0), str!("top"),]));
 
         assert_true!(prop.clone().matches(&[str!("right")]));
 
@@ -1391,9 +1302,7 @@ mod tests {
             PropertyDefinition {
                 name: "testprop".to_string(),
                 computed: vec![],
-                syntax: CssSyntax::new("foo | [ foo [ foo | bar ] ]")
-                    .compile()
-                    .unwrap(),
+                syntax: CssSyntax::new("foo | [ foo [ foo | bar ] ]").compile().unwrap(),
                 inherited: false,
                 initial_value: None,
                 resolved: false,
@@ -1575,9 +1484,7 @@ mod tests {
         assert_true!(prop.clone().matches(&[str!("left"),]));
         assert_true!(prop.clone().matches(&[str!("right"),]));
 
-        assert_true!(prop
-            .clone()
-            .matches(&[str!("top"), CssValue::Unit(10.0, "px".into()),]));
+        assert_true!(prop.clone().matches(&[str!("top"), CssValue::Unit(10.0, "px".into()),]));
         assert_true!(prop
             .clone()
             .matches(&[str!("bottom"), CssValue::Unit(10.0, "px".into()),]));
@@ -1591,22 +1498,10 @@ mod tests {
         let tree = CssSyntax::new("[foo | bar | baz]#").compile().unwrap();
         assert_true!(tree.matches(&[str!("foo")]));
         assert_true!(tree.matches(&[str!("foo"), CssValue::Comma, str!("foo")]));
-        assert_true!(tree.matches(&[
-            str!("foo"),
-            CssValue::Comma,
-            str!("foo"),
-            CssValue::Comma,
-            str!("foo")
-        ]));
+        assert_true!(tree.matches(&[str!("foo"), CssValue::Comma, str!("foo"), CssValue::Comma, str!("foo")]));
         assert_true!(tree.matches(&[str!("foo"), CssValue::Comma, str!("bar")]));
         assert_true!(tree.matches(&[str!("foo"), CssValue::Comma, str!("baz")]));
-        assert_true!(tree.matches(&[
-            str!("foo"),
-            CssValue::Comma,
-            str!("bar"),
-            CssValue::Comma,
-            str!("baz")
-        ]));
+        assert_true!(tree.matches(&[str!("foo"), CssValue::Comma, str!("bar"), CssValue::Comma, str!("baz")]));
 
         assert_false!(tree.matches(&[str!("foo"), CssValue::Comma]));
         assert_false!(tree.matches(&[str!("foo"), CssValue::Comma, str!("bar"), CssValue::Comma]));
diff --git a/crates/gosub_css3/src/matcher/walker.rs b/crates/gosub_css3/src/matcher/walker.rs
new file mode 100644
index 000000000..dccfc5440
--- /dev/null
+++ b/crates/gosub_css3/src/matcher/walker.rs
@@ -0,0 +1,48 @@
+use crate::matcher::syntax_matcher::CssSyntaxTree;
+
+pub struct MatchWalker {
+    tree: CssSyntaxTree,
+}
+
+impl MatchWalker {
+    pub fn new(tree: &CssSyntaxTree) -> Self {
+        Self { tree: tree.clone() }
+    }
+
+    // pub fn walk(&self) {
+    //     let _ = self.inner_walk(&self.tree);
+    // }
+    //
+    // fn inner_walk(&self, node: &Node) -> Result<(), std::io::Error> {
+    //     match node.node_type.deref() {
+    //         NodeType::StyleSheet { children } => {
+    //             for child in children.iter() {
+    //                 self.inner_walk(child)?;
+    //             }
+    //         }
+    //         NodeType::Rule { block, .. } => {
+    //             if block.is_some() {
+    //                 self.inner_walk(block.as_ref().unwrap())?;
+    //             }
+    //         }
+    //         NodeType::AtRule { block, .. } => {
+    //             if block.is_some() {
+    //                 self.inner_walk(block.as_ref().unwrap())?;
+    //             }
+    //         }
+    //         NodeType::Block { children, .. } => {
+    //             for child in children.iter() {
+    //                 self.inner_walk(child)?;
+    //             }
+    //         }
+    //         NodeType::Declaration { property, value, .. } => {
+    //             println!("Matching property '{}' against value '{:?}'", property, value);
+    //
+    //
+    //         }
+    //         _ => {}
+    //     }
+    //
+    //     Ok(())
+    // }
+}
diff --git a/crates/gosub_css3/src/node.rs b/crates/gosub_css3/src/node.rs
index 34e09fbee..d1a585ae8 100644
--- a/crates/gosub_css3/src/node.rs
+++ b/crates/gosub_css3/src/node.rs
@@ -395,11 +395,7 @@ impl Display for Node {
                 .map(|s| s.to_string())
                 .collect::<Vec<String>>()
                 .join(", "),
-            NodeType::Selector { children } => children
-                .iter()
-                .map(|s| s.to_string())
-                .collect::<Vec<String>>()
-                .join(""),
+            NodeType::Selector { children } => children.iter().map(|s| s.to_string()).collect::<Vec<String>>().join(""),
             NodeType::IdSelector { value } => value.clone(),
             NodeType::Ident { value } => value.clone(),
             NodeType::Number { value } => value.to_string(),
@@ -422,10 +418,7 @@ impl Display for Node {
                 value,
                 flags,
             } => {
-                let matcher = matcher
-                    .as_ref()
-                    .map(|m| m.to_string())
-                    .unwrap_or("".to_string());
+                let matcher = matcher.as_ref().map(|m| m.to_string()).unwrap_or("".to_string());
                 format!("[{}{}{}{}]", name, matcher, value, flags)
             }
             NodeType::PseudoClassSelector { value } => format!(":{}", value),
@@ -441,10 +434,7 @@ impl Display for Node {
             }
             NodeType::Combinator { value } => value.clone(),
             NodeType::Nth { nth, selector } => {
-                let sel = selector
-                    .as_ref()
-                    .map(|s| s.to_string())
-                    .unwrap_or("".to_string());
+                let sel = selector.as_ref().map(|s| s.to_string()).unwrap_or("".to_string());
                 format!("{}{}", nth, sel)
             }
             NodeType::AnPlusB { a, b } => format!("{}n+{}", a, b),
diff --git a/crates/gosub_css3/src/parser.rs b/crates/gosub_css3/src/parser.rs
index 6d2649f18..586486b1f 100644
--- a/crates/gosub_css3/src/parser.rs
+++ b/crates/gosub_css3/src/parser.rs
@@ -1,5 +1,6 @@
 use crate::tokenizer::{Number, Token, TokenType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::{CssError, CssResult};
 
 mod anplusb;
 mod at_rule;
@@ -21,11 +22,11 @@ mod value;
 
 impl Css3<'_> {
     /// Consumes a specific token
-    pub fn consume(&mut self, token_type: TokenType) -> Result<Token, Error> {
+    pub fn consume(&mut self, token_type: TokenType) -> CssResult<Token> {
         let t = self.tokenizer.consume();
         if t.token_type != token_type {
-            return Err(Error::new(
-                format!("Expected {:?}, got {:?}", token_type, t),
+            return Err(CssError::with_location(
+                format!("Expected {:?}, got {:?}", token_type, t).as_str(),
                 self.tokenizer.current_location(),
             ));
         }
@@ -34,60 +35,60 @@ impl Css3<'_> {
     }
 
     /// Consumes any token
-    pub fn consume_any(&mut self) -> Result<Token, Error> {
+    pub fn consume_any(&mut self) -> CssResult<Token> {
         Ok(self.tokenizer.consume())
     }
 
-    pub fn consume_function(&mut self) -> Result<String, Error> {
+    pub fn consume_function(&mut self) -> CssResult<String> {
         let t = self.tokenizer.consume();
         match t.token_type {
             TokenType::Function(name) => Ok(name),
-            _ => Err(Error::new(
-                format!("Expected function, got {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Expected function, got {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn consume_any_number(&mut self) -> Result<Number, Error> {
+    pub fn consume_any_number(&mut self) -> CssResult<Number> {
         let t = self.tokenizer.consume();
         match t.token_type {
             TokenType::Number(value) => Ok(value),
-            _ => Err(Error::new(
-                format!("Expected number, got {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Expected number, got {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn consume_any_delim(&mut self) -> Result<char, Error> {
+    pub fn consume_any_delim(&mut self) -> CssResult<char> {
         let t = self.tokenizer.consume();
         match t.token_type {
             TokenType::Delim(c) => Ok(c),
-            _ => Err(Error::new(
-                format!("Expected delimiter, got {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Expected delimiter, got {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn consume_any_string(&mut self) -> Result<String, Error> {
+    pub fn consume_any_string(&mut self) -> CssResult<String> {
         let t = self.tokenizer.consume();
         match t.token_type {
             TokenType::QuotedString(s) => Ok(s),
-            _ => Err(Error::new(
-                format!("Expected string, got {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Expected string, got {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn consume_delim(&mut self, delimiter: char) -> Result<char, Error> {
+    pub fn consume_delim(&mut self, delimiter: char) -> CssResult<char> {
         let t = self.tokenizer.consume();
         match t.token_type {
             TokenType::Delim(c) if c == delimiter => Ok(c),
-            _ => Err(Error::new(
-                format!("Expected delimiter '{}', got {:?}", delimiter, t),
+            _ => Err(CssError::with_location(
+                format!("Expected delimiter '{}', got {:?}", delimiter, t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
@@ -108,29 +109,29 @@ impl Css3<'_> {
         }
     }
 
-    pub fn consume_ident_ci(&mut self, ident: &str) -> Result<String, Error> {
+    pub fn consume_ident_ci(&mut self, ident: &str) -> CssResult<String> {
         let t = self.tokenizer.consume();
         match t.token_type {
             TokenType::Ident(s) if s.eq_ignore_ascii_case(ident) => Ok(s),
-            _ => Err(Error::new(
-                format!("Expected ident, got {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Expected ident, got {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn consume_ident(&mut self, ident: &str) -> Result<String, Error> {
+    pub fn consume_ident(&mut self, ident: &str) -> CssResult<String> {
         let t = self.tokenizer.consume();
         match t.token_type {
             TokenType::Ident(s) if s == ident => Ok(s),
-            _ => Err(Error::new(
-                format!("Expected ident, got {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Expected ident, got {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn consume_any_ident(&mut self) -> Result<String, Error> {
+    pub fn consume_any_ident(&mut self) -> CssResult<String> {
         let t = self.tokenizer.consume();
 
         match t.token_type {
@@ -138,21 +139,21 @@ impl Css3<'_> {
                 let t = self.tokenizer.consume();
                 match t.token_type {
                     TokenType::Ident(s) => Ok(format!(".{}", s)),
-                    _ => Err(Error::new(
-                        format!("Expected ident, got {:?}", t),
+                    _ => Err(CssError::with_location(
+                        format!("Expected ident, got {:?}", t).as_str(),
                         self.tokenizer.current_location(),
                     )),
                 }
             }
             TokenType::Ident(s) => Ok(s),
-            _ => Err(Error::new(
-                format!("Expected ident, got {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Expected ident, got {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn consume_raw_condition(&mut self) -> Result<String, Error> {
+    pub fn consume_raw_condition(&mut self) -> CssResult<String> {
         let start = self.tokenizer.tell();
 
         while !self.tokenizer.eof() {
diff --git a/crates/gosub_css3/src/parser/anplusb.rs b/crates/gosub_css3/src/parser/anplusb.rs
index 5782acc3e..de440997e 100644
--- a/crates/gosub_css3/src/parser/anplusb.rs
+++ b/crates/gosub_css3/src/parser/anplusb.rs
@@ -1,20 +1,17 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::{Number, TokenType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::{CssError, CssResult};
 
 impl Css3<'_> {
-    fn do_dimension_block(
-        &mut self,
-        value: Number,
-        unit: String,
-    ) -> Result<(String, String), Error> {
+    fn do_dimension_block(&mut self, value: Number, unit: String) -> CssResult<(String, String)> {
         log::trace!("do_dimension_block");
 
         let value = value.to_string();
 
         if unit.chars().nth(0).unwrap().to_lowercase().to_string() != "n" {
-            return Err(Error::new(
-                format!("Expected n, found {}", unit).to_string(),
+            return Err(CssError::with_location(
+                format!("Expected n, found {}", unit).as_str(),
                 self.tokenizer.current_location(),
             ));
         }
@@ -25,24 +22,14 @@ impl Css3<'_> {
         })
     }
 
-    fn check_integer(
-        &mut self,
-        value: &str,
-        offset: usize,
-        allow_sign: bool,
-    ) -> Result<bool, Error> {
-        let sign = value
-            .chars()
-            .nth(offset)
-            .unwrap_or(' ')
-            .to_lowercase()
-            .to_string();
+    fn check_integer(&mut self, value: &str, offset: usize, allow_sign: bool) -> CssResult<bool> {
+        let sign = value.chars().nth(offset).unwrap_or(' ').to_lowercase().to_string();
         let mut pos = offset;
 
         if sign == "+" || sign == "-" {
             if !allow_sign {
-                return Err(Error::new(
-                    format!("Unexpected sign {}", sign).to_string(),
+                return Err(CssError::with_location(
+                    format!("Unexpected sign {}", sign).as_str(),
                     self.tokenizer.current_location(),
                 ));
             }
@@ -58,16 +45,11 @@ impl Css3<'_> {
         Ok(true)
     }
 
-    fn expect_char(&mut self, value: &str, c: &str, offset: usize) -> Result<bool, Error> {
-        let nval = value
-            .chars()
-            .nth(offset)
-            .unwrap_or(' ')
-            .to_lowercase()
-            .to_string();
+    fn expect_char(&mut self, value: &str, c: &str, offset: usize) -> CssResult<bool> {
+        let nval = value.chars().nth(offset).unwrap_or(' ').to_lowercase().to_string();
         if nval != c {
-            return Err(Error::new(
-                format!("Expected {}", c).to_string(),
+            return Err(CssError::with_location(
+                format!("Expected {}", c).as_str(),
                 self.tokenizer.current_location(),
             ));
         }
@@ -75,7 +57,7 @@ impl Css3<'_> {
         Ok(true)
     }
 
-    fn parse_anplusb_b(&mut self) -> Result<String, Error> {
+    fn parse_anplusb_b(&mut self) -> CssResult<String> {
         log::trace!("parse_anplusb_b");
 
         self.consume_whitespace_comments();
@@ -107,12 +89,12 @@ impl Css3<'_> {
                 false
             }
             _ => {
-                return Err(Error::new(
+                return Err(CssError::with_location(
                     format!(
                         "Expected +, - or number, found {:?}",
                         self.tokenizer.lookahead(0).token_type
                     )
-                    .to_string(),
+                    .as_str(),
                     self.tokenizer.current_location(),
                 ));
             }
@@ -128,7 +110,7 @@ impl Css3<'_> {
         Ok(val.to_string())
     }
 
-    fn do_negative_block(&mut self, value: &str) -> Result<(String, String), Error> {
+    fn do_negative_block(&mut self, value: &str) -> CssResult<(String, String)> {
         log::trace!("do_negative_block");
 
         let a = String::from("-1");
@@ -162,7 +144,7 @@ impl Css3<'_> {
         Ok((a, b))
     }
 
-    fn do_plus_block(&mut self, value: &str) -> Result<(String, String), Error> {
+    fn do_plus_block(&mut self, value: &str) -> CssResult<(String, String)> {
         log::trace!("do_plus_block");
 
         let a = String::from("1");
@@ -196,7 +178,7 @@ impl Css3<'_> {
         Ok((a, b))
     }
 
-    pub fn parse_anplusb(&mut self) -> Result<Node, Error> {
+    pub fn parse_anplusb(&mut self) -> CssResult<Node> {
         log::trace!("parse_anplusb");
 
         let loc = self.tokenizer.current_location();
@@ -228,8 +210,8 @@ impl Css3<'_> {
             }
             _ => {
                 self.tokenizer.reconsume();
-                return Err(Error::new(
-                    "Expected anplusb".to_string(),
+                return Err(CssError::with_location(
+                    "Expected anplusb",
                     self.tokenizer.current_location(),
                 ));
             }
@@ -251,6 +233,8 @@ impl Css3<'_> {
 mod test {
     use super::*;
     use gosub_shared::byte_stream::{ByteStream, Encoding};
+    use gosub_shared::traits::css3::CssOrigin;
+    use gosub_shared::traits::ParserConfig;
 
     macro_rules! test {
         ($func:ident, $input:expr, $expected:expr) => {
@@ -258,7 +242,7 @@ mod test {
             stream.read_from_str($input, Some(Encoding::UTF8));
             stream.close();
 
-            let mut parser = crate::Css3::new(&mut stream);
+            let mut parser = crate::Css3::new(&mut stream, ParserConfig::default(), CssOrigin::User, "");
             let result = parser.$func().unwrap();
 
             assert_eq!(result.node_type, $expected);
diff --git a/crates/gosub_css3/src/parser/at_rule.rs b/crates/gosub_css3/src/parser/at_rule.rs
index 6fb154577..409ad909d 100644
--- a/crates/gosub_css3/src/parser/at_rule.rs
+++ b/crates/gosub_css3/src/parser/at_rule.rs
@@ -12,7 +12,8 @@ mod supports;
 use crate::node::{Node, NodeType};
 use crate::parser::block::BlockParseMode;
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::{CssError, CssResult};
 
 impl Css3<'_> {
     fn declaration_block_at_rule(&mut self) -> BlockParseMode {
@@ -41,10 +42,10 @@ impl Css3<'_> {
         }
     }
 
-    fn read_sequence_at_rule_prelude(&mut self) -> Result<Node, Error> {
+    fn read_sequence_at_rule_prelude(&mut self) -> CssResult<Node> {
         log::trace!("read_sequence_at_rule_prelude");
 
-        let loc = self.tokenizer.lookahead(0).location.clone();
+        let loc = self.tokenizer.lookahead(0).location;
 
         Ok(Node::new(
             NodeType::Container {
@@ -54,7 +55,7 @@ impl Css3<'_> {
         ))
     }
 
-    fn parse_at_rule_prelude(&mut self, name: String) -> Result<Option<Node>, Error> {
+    fn parse_at_rule_prelude(&mut self, name: String) -> CssResult<Option<Node>> {
         log::trace!("parse_at_rule_prelude");
 
         self.consume_whitespace_comments();
@@ -75,24 +76,17 @@ impl Css3<'_> {
         self.consume_whitespace_comments();
 
         let t = self.tokenizer.lookahead(0);
-        if !self.tokenizer.eof()
-            && t.token_type != TokenType::Semicolon
-            && t.token_type != TokenType::LCurly
-        {
-            return Err(Error::new(
-                "Expected semicolon or left curly brace".to_string(),
-                t.location.clone(),
+        if !self.tokenizer.eof() && t.token_type != TokenType::Semicolon && t.token_type != TokenType::LCurly {
+            return Err(CssError::with_location(
+                "Expected semicolon or left curly brace",
+                t.location,
             ));
         }
 
         Ok(node)
     }
 
-    fn parse_at_rule_block(
-        &mut self,
-        name: String,
-        is_declaration: bool,
-    ) -> Result<Option<Node>, Error> {
+    fn parse_at_rule_block(&mut self, name: String, is_declaration: bool) -> CssResult<Option<Node>> {
         log::trace!("parse_at_rule_block");
 
         let t = self.tokenizer.consume();
@@ -136,7 +130,7 @@ impl Css3<'_> {
     // Either the at_rule parsing succeeds as a whole, or not. When not a valid at_rule is found, we
     // return None if the config.ignore_errors is set to true, otherwise this will return an Err
     // and is handled by the caller
-    pub fn parse_at_rule(&mut self, is_declaration: bool) -> Result<Option<Node>, Error> {
+    pub fn parse_at_rule(&mut self, is_declaration: bool) -> CssResult<Option<Node>> {
         log::trace!("parse_at_rule");
 
         let result = self.parse_at_rule_internal(is_declaration);
@@ -153,14 +147,14 @@ impl Css3<'_> {
         Ok(None)
     }
 
-    fn parse_at_rule_internal(&mut self, is_declaration: bool) -> Result<Node, Error> {
+    fn parse_at_rule_internal(&mut self, is_declaration: bool) -> CssResult<Node> {
         let name;
 
         let t = self.consume_any()?;
         if let TokenType::AtKeyword(keyword) = t.token_type {
             name = keyword;
         } else {
-            return Err(Error::new("Expected at keyword".to_string(), t.location));
+            return Err(CssError::with_location("Expected at keyword", t.location));
         }
         self.consume_whitespace_comments();
 
@@ -176,7 +170,7 @@ impl Css3<'_> {
                 prelude,
                 block,
             },
-            t.location.clone(),
+            t.location,
         ))
     }
 }
diff --git a/crates/gosub_css3/src/parser/at_rule/container.rs b/crates/gosub_css3/src/parser/at_rule/container.rs
index d1f3129c2..df6025479 100644
--- a/crates/gosub_css3/src/parser/at_rule/container.rs
+++ b/crates/gosub_css3/src/parser/at_rule/container.rs
@@ -1,9 +1,10 @@
 use crate::node::{FeatureKind, Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_at_rule_container_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_container_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_container_prelude");
 
         let mut children = Vec::new();
@@ -11,15 +12,12 @@ impl Css3<'_> {
         let t = self.consume_any()?;
         if let TokenType::Ident(value) = t.token_type {
             if !["none", "and", "not", "or"].contains(&value.as_str()) {
-                children.push(Node::new(NodeType::Ident { value }, t.location.clone()));
+                children.push(Node::new(NodeType::Ident { value }, t.location));
             }
         }
 
         children.push(self.parse_condition(FeatureKind::Container)?);
 
-        Ok(Node::new(
-            NodeType::Container { children },
-            t.location.clone(),
-        ))
+        Ok(Node::new(NodeType::Container { children }, t.location))
     }
 }
diff --git a/crates/gosub_css3/src/parser/at_rule/font_face.rs b/crates/gosub_css3/src/parser/at_rule/font_face.rs
index 7310a08f5..dc9248e4d 100644
--- a/crates/gosub_css3/src/parser/at_rule/font_face.rs
+++ b/crates/gosub_css3/src/parser/at_rule/font_face.rs
@@ -1,8 +1,9 @@
 use crate::node::Node;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_at_rule_font_face_block(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_font_face_block(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_font_face_block");
 
         todo!();
diff --git a/crates/gosub_css3/src/parser/at_rule/import.rs b/crates/gosub_css3/src/parser/at_rule/import.rs
index 9aa50aaa0..088c3f2bc 100644
--- a/crates/gosub_css3/src/parser/at_rule/import.rs
+++ b/crates/gosub_css3/src/parser/at_rule/import.rs
@@ -1,9 +1,10 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::{CssError, CssResult};
 
 impl Css3<'_> {
-    pub fn parse_at_rule_import_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_import_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_import");
 
         let mut children = Vec::new();
@@ -13,19 +14,19 @@ impl Css3<'_> {
         let t = self.consume_any()?;
         match t.token_type {
             TokenType::QuotedString(value) => {
-                children.push(Node::new(NodeType::String { value }, loc.clone()));
+                children.push(Node::new(NodeType::String { value }, loc));
             }
             TokenType::Url(url) => {
-                children.push(Node::new(NodeType::Url { url }, loc.clone()));
+                children.push(Node::new(NodeType::Url { url }, loc));
             }
             TokenType::Function(name) if name.eq_ignore_ascii_case("url") => {
                 self.tokenizer.reconsume();
                 children.push(self.parse_url()?);
             }
             _ => {
-                return Err(Error::new(
-                    "Expected string or url()".to_string(),
-                    t.location.clone(),
+                return Err(CssError::with_location(
+                    "Expected string or url()",
+                    self.tokenizer.current_location(),
                 ));
             }
         }
@@ -35,7 +36,7 @@ impl Css3<'_> {
         let t = self.tokenizer.lookahead_sc(0);
         match t.token_type {
             TokenType::Ident(value) if value.eq_ignore_ascii_case("layer") => {
-                children.push(Node::new(NodeType::Ident { value }, t.location.clone()));
+                children.push(Node::new(NodeType::Ident { value }, t.location));
             }
             TokenType::Function(name) if name.eq_ignore_ascii_case("layer") => {
                 children.push(self.parse_function()?);
@@ -69,6 +70,6 @@ impl Css3<'_> {
         //     _ => {}
         // }
 
-        Ok(Node::new(NodeType::ImportList { children }, loc.clone()))
+        Ok(Node::new(NodeType::ImportList { children }, loc))
     }
 }
diff --git a/crates/gosub_css3/src/parser/at_rule/layer.rs b/crates/gosub_css3/src/parser/at_rule/layer.rs
index fd797ea1f..6ca1e1dd4 100644
--- a/crates/gosub_css3/src/parser/at_rule/layer.rs
+++ b/crates/gosub_css3/src/parser/at_rule/layer.rs
@@ -1,20 +1,21 @@
 use crate::node::{Node, NodeType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
     #[allow(dead_code)]
-    fn parse_at_rule_layer_list(&mut self) -> Result<Node, Error> {
+    fn parse_at_rule_layer_list(&mut self) -> CssResult<Node> {
         let _children: Vec<Node> = Vec::new();
 
         todo!();
     }
 
-    fn parse_layer_query(&mut self) -> Result<Node, Error> {
+    fn parse_layer_query(&mut self) -> CssResult<Node> {
         let _children: Vec<Node> = Vec::new();
         todo!();
     }
 
-    pub fn parse_at_rule_layer_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_layer_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_layer_prelude");
 
         let loc = self.tokenizer.current_location();
diff --git a/crates/gosub_css3/src/parser/at_rule/media.rs b/crates/gosub_css3/src/parser/at_rule/media.rs
index 50e05f2cc..421d92263 100644
--- a/crates/gosub_css3/src/parser/at_rule/media.rs
+++ b/crates/gosub_css3/src/parser/at_rule/media.rs
@@ -1,9 +1,10 @@
 use crate::node::{FeatureKind, Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::{CssError, CssResult};
 
 impl Css3<'_> {
-    fn parse_media_read_term(&mut self) -> Result<Node, Error> {
+    fn parse_media_read_term(&mut self) -> CssResult<Node> {
         self.consume_whitespace_comments();
 
         let loc = self.tokenizer.current_location();
@@ -12,9 +13,7 @@ impl Css3<'_> {
         match t.token_type {
             TokenType::Ident(ident) => Ok(Node::new(NodeType::Ident { value: ident }, loc)),
             TokenType::Number(value) => Ok(Node::new(NodeType::Number { value }, loc)),
-            TokenType::Dimension { value, unit } => {
-                Ok(Node::new(NodeType::Dimension { value, unit }, loc))
-            }
+            TokenType::Dimension { value, unit } => Ok(Node::new(NodeType::Dimension { value, unit }, loc)),
             TokenType::Function(name) => {
                 let name = name.to_lowercase();
                 let args = self.parse_pseudo_function(name.as_str())?;
@@ -28,14 +27,14 @@ impl Css3<'_> {
                     loc,
                 ))
             }
-            _ => Err(Error::new(
-                "Expected identifier, number, dimension, or ratio".to_string(),
+            _ => Err(CssError::with_location(
+                "Expected identifier, number, dimension, or ratio",
                 loc,
             )),
         }
     }
 
-    fn parse_media_read_comparison(&mut self) -> Result<Node, Error> {
+    fn parse_media_read_comparison(&mut self) -> CssResult<Node> {
         self.consume_whitespace_comments();
 
         let loc = self.tokenizer.current_location();
@@ -55,10 +54,10 @@ impl Css3<'_> {
             return Ok(Node::new(NodeType::Operator(format!("{}", delim)), loc));
         }
 
-        Err(Error::new("Expected comparison operator".to_string(), loc))
+        Err(CssError::with_location("Expected comparison operator", loc))
     }
 
-    pub fn parse_media_query_list(&mut self) -> Result<Node, Error> {
+    pub fn parse_media_query_list(&mut self) -> CssResult<Node> {
         log::trace!("parse_media_query_list");
 
         let loc = self.tokenizer.current_location();
@@ -78,15 +77,10 @@ impl Css3<'_> {
             }
         }
 
-        Ok(Node::new(
-            NodeType::MediaQueryList {
-                media_queries: queries,
-            },
-            loc,
-        ))
+        Ok(Node::new(NodeType::MediaQueryList { media_queries: queries }, loc))
     }
 
-    fn parse_media_feature_feature(&mut self, kind: FeatureKind) -> Result<Node, Error> {
+    fn parse_media_feature_feature(&mut self, kind: FeatureKind) -> CssResult<Node> {
         log::trace!("parse_media_feature_feature");
 
         let loc = self.tokenizer.current_location();
@@ -105,7 +99,7 @@ impl Css3<'_> {
 
         if t.token_type != TokenType::RParen {
             if !t.is_colon() {
-                return Err(Error::new("Expected colon".to_string(), t.location));
+                return Err(CssError::with_location("Expected colon", t.location));
             }
             self.consume_whitespace_comments();
 
@@ -130,8 +124,8 @@ impl Css3<'_> {
                     ))
                 }
                 _ => {
-                    return Err(Error::new(
-                        "Expected identifier, number, dimension, or ratio".to_string(),
+                    return Err(CssError::with_location(
+                        "Expected identifier, number, dimension, or ratio",
                         t.location,
                     ));
                 }
@@ -147,7 +141,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::Feature { kind, name, value }, loc))
     }
 
-    fn parse_media_feature_range(&mut self, _kind: FeatureKind) -> Result<Node, Error> {
+    fn parse_media_feature_range(&mut self, _kind: FeatureKind) -> CssResult<Node> {
         log::trace!("parse_media_feature_range");
 
         let loc = self.tokenizer.current_location();
@@ -181,7 +175,7 @@ impl Css3<'_> {
         ))
     }
 
-    pub fn parse_media_feature_or_range(&mut self, kind: FeatureKind) -> Result<Node, Error> {
+    pub fn parse_media_feature_or_range(&mut self, kind: FeatureKind) -> CssResult<Node> {
         log::trace!("parse_media_feature_or_range");
 
         let t = self.tokenizer.lookahead_sc(1);
@@ -195,7 +189,7 @@ impl Css3<'_> {
         self.parse_media_feature_range(kind)
     }
 
-    pub fn parse_media_query(&mut self) -> Result<Node, Error> {
+    pub fn parse_media_query(&mut self) -> CssResult<Node> {
         log::trace!("parse_media_query");
 
         let loc = self.tokenizer.current_location();
@@ -228,7 +222,7 @@ impl Css3<'_> {
             match nt.token_type {
                 TokenType::Ident(s) => {
                     if s != "and" {
-                        return Err(Error::new("Expected 'and'".to_string(), nt.location));
+                        return Err(CssError::with_location("Expected 'and'", t.location));
                     }
 
                     self.consume_ident("and")?;
@@ -238,8 +232,8 @@ impl Css3<'_> {
                     // skip;
                 }
                 _ => {
-                    return Err(Error::new(
-                        "Expected identifier or parenthesis".to_string(),
+                    return Err(CssError::with_location(
+                        "Expected identifier or parenthesis",
                         t.location,
                     ));
                 }
@@ -255,8 +249,8 @@ impl Css3<'_> {
                     // skip
                 }
                 _ => {
-                    return Err(Error::new(
-                        "Expected identifier or parenthesis".to_string(),
+                    return Err(CssError::with_location(
+                        "Expected identifier or parenthesis",
                         t.location,
                     ));
                 }
@@ -273,7 +267,7 @@ impl Css3<'_> {
         ))
     }
 
-    pub fn parse_at_rule_media_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_media_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_media_prelude");
 
         self.parse_media_query_list()
diff --git a/crates/gosub_css3/src/parser/at_rule/nest.rs b/crates/gosub_css3/src/parser/at_rule/nest.rs
index f1fd96c9a..a54420280 100644
--- a/crates/gosub_css3/src/parser/at_rule/nest.rs
+++ b/crates/gosub_css3/src/parser/at_rule/nest.rs
@@ -1,8 +1,9 @@
 use crate::node::{Node, NodeType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_at_rule_nest_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_nest_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_nest_prelude");
 
         let loc = self.tokenizer.current_location();
diff --git a/crates/gosub_css3/src/parser/at_rule/page.rs b/crates/gosub_css3/src/parser/at_rule/page.rs
index 86e04f669..cbbb4dd58 100644
--- a/crates/gosub_css3/src/parser/at_rule/page.rs
+++ b/crates/gosub_css3/src/parser/at_rule/page.rs
@@ -1,8 +1,9 @@
 use crate::node::{Node, NodeType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_at_rule_page_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_page_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_page_prelude");
 
         let loc = self.tokenizer.current_location();
diff --git a/crates/gosub_css3/src/parser/at_rule/scope.rs b/crates/gosub_css3/src/parser/at_rule/scope.rs
index af0f3a1e0..f129ff378 100644
--- a/crates/gosub_css3/src/parser/at_rule/scope.rs
+++ b/crates/gosub_css3/src/parser/at_rule/scope.rs
@@ -1,9 +1,10 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_at_rule_scope_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_scope_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_scope_prelude");
 
         let mut root = None;
diff --git a/crates/gosub_css3/src/parser/at_rule/starting_style.rs b/crates/gosub_css3/src/parser/at_rule/starting_style.rs
index ea5f3c1a9..0189fe084 100644
--- a/crates/gosub_css3/src/parser/at_rule/starting_style.rs
+++ b/crates/gosub_css3/src/parser/at_rule/starting_style.rs
@@ -1,8 +1,9 @@
 use crate::node::Node;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_at_rule_starting_style_block(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_starting_style_block(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_starting_style_block");
         todo!();
     }
diff --git a/crates/gosub_css3/src/parser/at_rule/supports.rs b/crates/gosub_css3/src/parser/at_rule/supports.rs
index dfae55621..903397347 100644
--- a/crates/gosub_css3/src/parser/at_rule/supports.rs
+++ b/crates/gosub_css3/src/parser/at_rule/supports.rs
@@ -1,8 +1,9 @@
 use crate::node::{Node, NodeType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_at_rule_supports_prelude(&mut self) -> Result<Node, Error> {
+    pub fn parse_at_rule_supports_prelude(&mut self) -> CssResult<Node> {
         log::trace!("parse_at_rule_supports_prelude");
 
         let loc = self.tokenizer.current_location();
@@ -17,6 +18,7 @@ impl Css3<'_> {
 #[cfg(test)]
 mod tests {
     use crate::walker::Walker;
+    use crate::{CssOrigin, ParserConfig};
     use gosub_shared::byte_stream::{ByteStream, Encoding};
 
     #[test]
@@ -25,7 +27,7 @@ mod tests {
         stream.read_from_str("(display: flex)", Some(Encoding::UTF8));
         stream.close();
 
-        let mut parser = crate::Css3::new(&mut stream);
+        let mut parser = crate::Css3::new(&mut stream, ParserConfig::default(), CssOrigin::User, "");
         let node = parser.parse_at_rule_supports_prelude().unwrap();
 
         let w = Walker::new(&node);
diff --git a/crates/gosub_css3/src/parser/block.rs b/crates/gosub_css3/src/parser/block.rs
index 656e107b7..22334aca4 100644
--- a/crates/gosub_css3/src/parser/block.rs
+++ b/crates/gosub_css3/src/parser/block.rs
@@ -1,6 +1,7 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::{CssError, CssResult};
 
 #[derive(Debug, PartialEq)]
 pub enum BlockParseMode {
@@ -9,12 +10,12 @@ pub enum BlockParseMode {
 }
 
 impl Css3<'_> {
-    fn parse_consume_rule(&mut self) -> Result<Option<Node>, Error> {
+    fn parse_consume_rule(&mut self) -> CssResult<Option<Node>> {
         log::trace!("parse_consume_rule");
         self.parse_rule()
     }
 
-    fn parse_consume_declaration(&mut self) -> Result<Option<Node>, Error> {
+    fn parse_consume_declaration(&mut self) -> CssResult<Option<Node>> {
         log::trace!("parse_consume_declaration");
 
         match self.parse_declaration()? {
@@ -48,7 +49,7 @@ impl Css3<'_> {
         }
     }
 
-    pub fn parse_block(&mut self, mode: BlockParseMode) -> Result<Node, Error> {
+    pub fn parse_block(&mut self, mode: BlockParseMode) -> CssResult<Node> {
         log::trace!("parse_block with parse mode: {:?}", mode);
 
         let loc = self.tokenizer.current_location();
@@ -62,7 +63,7 @@ impl Css3<'_> {
                     // End the block
                     self.tokenizer.reconsume();
 
-                    let n = Node::new(NodeType::Block { children }, t.location.clone());
+                    let n = Node::new(NodeType::Block { children }, t.location);
                     return Ok(n);
                 }
                 TokenType::Whitespace(_) | TokenType::Comment(_) => {
@@ -71,9 +72,7 @@ impl Css3<'_> {
 
                 TokenType::AtKeyword(_) => {
                     self.tokenizer.reconsume();
-                    if let Some(at_rule_node) =
-                        self.parse_at_rule(mode == BlockParseMode::StyleBlock)?
-                    {
+                    if let Some(at_rule_node) = self.parse_at_rule(mode == BlockParseMode::StyleBlock)? {
                         children.push(at_rule_node);
                     }
                     semicolon_seperated = false;
@@ -85,8 +84,8 @@ impl Css3<'_> {
                 _ => match mode {
                     BlockParseMode::StyleBlock => {
                         if !semicolon_seperated {
-                            return Err(Error::new(
-                                format!("Expected a ; got {:?}", t),
+                            return Err(CssError::with_location(
+                                format!("Expected a ; got {:?}", t).as_str(),
                                 self.tokenizer.current_location(),
                             ));
                         }
diff --git a/crates/gosub_css3/src/parser/calc.rs b/crates/gosub_css3/src/parser/calc.rs
index 74f3643d7..b9ae1d578 100644
--- a/crates/gosub_css3/src/parser/calc.rs
+++ b/crates/gosub_css3/src/parser/calc.rs
@@ -1,9 +1,10 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_calc(&mut self) -> Result<Node, Error> {
+    pub fn parse_calc(&mut self) -> CssResult<Node> {
         log::trace!("parse_calc");
 
         let loc = self.tokenizer.current_location();
@@ -13,7 +14,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::Calc { expr }, loc))
     }
 
-    fn parse_calc_expr(&mut self) -> Result<Node, Error> {
+    fn parse_calc_expr(&mut self) -> CssResult<Node> {
         log::trace!("parse_calc_expr");
 
         let loc = self.tokenizer.current_location();
diff --git a/crates/gosub_css3/src/parser/combinator.rs b/crates/gosub_css3/src/parser/combinator.rs
index e8613044e..2003c8663 100644
--- a/crates/gosub_css3/src/parser/combinator.rs
+++ b/crates/gosub_css3/src/parser/combinator.rs
@@ -1,9 +1,11 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_combinator(&mut self) -> Result<Node, Error> {
+    pub fn parse_combinator(&mut self) -> CssResult<Node> {
         log::trace!("parse_combinator");
         let t = self.consume_any()?;
 
@@ -15,20 +17,18 @@ impl Css3<'_> {
             TokenType::Delim('/') => {
                 let tn1 = self.tokenizer.lookahead(1);
                 let tn2 = self.tokenizer.lookahead(2);
-                if tn1.token_type == TokenType::Ident("deep".to_string())
-                    && tn2.token_type == TokenType::Delim('/')
-                {
+                if tn1.token_type == TokenType::Ident("deep".to_string()) && tn2.token_type == TokenType::Delim('/') {
                     "/deep/".to_string()
                 } else {
-                    return Err(Error::new(
-                        format!("Unexpected token {:?}", tn1),
+                    return Err(CssError::with_location(
+                        format!("Unexpected token {:?}", tn1).as_str(),
                         self.tokenizer.current_location(),
                     ));
                 }
             }
             _ => {
-                return Err(Error::new(
-                    format!("Unexpected token {:?}", t),
+                return Err(CssError::with_location(
+                    format!("Unexpected token {:?}", t).as_str(),
                     self.tokenizer.current_location(),
                 ));
             }
diff --git a/crates/gosub_css3/src/parser/condition.rs b/crates/gosub_css3/src/parser/condition.rs
index e53234e5a..95cadbe29 100644
--- a/crates/gosub_css3/src/parser/condition.rs
+++ b/crates/gosub_css3/src/parser/condition.rs
@@ -1,9 +1,11 @@
 use crate::node::{FeatureKind, Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_condition(&mut self, kind: FeatureKind) -> Result<Node, Error> {
+    pub fn parse_condition(&mut self, kind: FeatureKind) -> CssResult<Node> {
         log::trace!("parse_condition");
 
         let loc = self.tokenizer.current_location();
@@ -55,7 +57,7 @@ impl Css3<'_> {
         }
 
         if list.is_empty() {
-            return Err(Error::new("Expected condition".to_string(), loc));
+            return Err(CssError::with_location("Expected condition", loc));
         }
 
         Ok(Node::new(NodeType::Condition { list }, loc))
diff --git a/crates/gosub_css3/src/parser/declaration.rs b/crates/gosub_css3/src/parser/declaration.rs
index 4569ae8e4..f51c10245 100644
--- a/crates/gosub_css3/src/parser/declaration.rs
+++ b/crates/gosub_css3/src/parser/declaration.rs
@@ -1,9 +1,11 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_property_name(&mut self) -> Result<String, Error> {
+    pub fn parse_property_name(&mut self) -> CssResult<String> {
         log::trace!("parse_property_name");
         let t = self.consume_any()?;
         match t.token_type {
@@ -27,14 +29,14 @@ impl Css3<'_> {
         match t.token_type {
             TokenType::Ident(value) => Ok(value),
             TokenType::Hash(value) => Ok(value),
-            _ => Err(Error::new(
-                format!("Unexpected token {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Unexpected token {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    pub fn parse_declaration(&mut self) -> Result<Option<Node>, Error> {
+    pub fn parse_declaration(&mut self) -> CssResult<Option<Node>> {
         log::trace!("parse_declaration");
 
         let result = self.parse_declaration_internal();
@@ -50,7 +52,7 @@ impl Css3<'_> {
         Ok(None)
     }
 
-    fn parse_declaration_internal(&mut self) -> Result<Node, Error> {
+    fn parse_declaration_internal(&mut self) -> CssResult<Node> {
         let loc = self.tokenizer.current_location();
 
         let mut important = false;
@@ -69,8 +71,8 @@ impl Css3<'_> {
         let value = self.parse_value_sequence()?;
 
         if value.is_empty() {
-            return Err(Error::new(
-                "Expected value in declaration".to_string(),
+            return Err(CssError::with_location(
+                "Expected value in declaration",
                 self.tokenizer.current_location(),
             ));
         }
diff --git a/crates/gosub_css3/src/parser/feature_function.rs b/crates/gosub_css3/src/parser/feature_function.rs
index 36ddfc6f1..db8a92166 100644
--- a/crates/gosub_css3/src/parser/feature_function.rs
+++ b/crates/gosub_css3/src/parser/feature_function.rs
@@ -1,13 +1,11 @@
 use crate::node::{FeatureKind, Node, NodeType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_feature_function(&mut self, _kind: FeatureKind) -> Result<Node, Error> {
+    pub fn parse_feature_function(&mut self, _kind: FeatureKind) -> CssResult<Node> {
         log::trace!("parse_feature_function");
 
-        Ok(Node::new(
-            NodeType::FeatureFunction,
-            self.tokenizer.current_location(),
-        ))
+        Ok(Node::new(NodeType::FeatureFunction, self.tokenizer.current_location()))
     }
 }
diff --git a/crates/gosub_css3/src/parser/function.rs b/crates/gosub_css3/src/parser/function.rs
index 56ae01dfe..2f11af83b 100644
--- a/crates/gosub_css3/src/parser/function.rs
+++ b/crates/gosub_css3/src/parser/function.rs
@@ -1,14 +1,15 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    fn parse_function_arguments(&mut self) -> Result<Vec<Node>, Error> {
+    fn parse_function_arguments(&mut self) -> CssResult<Vec<Node>> {
         log::trace!("parse_function_arguments");
         self.parse_value_sequence()
     }
 
-    pub fn parse_function(&mut self) -> Result<Node, Error> {
+    pub fn parse_function(&mut self) -> CssResult<Node> {
         log::trace!("parse_function");
 
         let loc = self.tokenizer.current_location();
diff --git a/crates/gosub_css3/src/parser/operator.rs b/crates/gosub_css3/src/parser/operator.rs
index 073f9522e..a78d087c0 100644
--- a/crates/gosub_css3/src/parser/operator.rs
+++ b/crates/gosub_css3/src/parser/operator.rs
@@ -1,9 +1,11 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_operator(&mut self) -> Result<Node, Error> {
+    pub fn parse_operator(&mut self) -> CssResult<Node> {
         log::trace!("parse_operator");
 
         let loc = self.tokenizer.current_location();
@@ -18,8 +20,8 @@ impl Css3<'_> {
             }
         }
 
-        Err(Error::new(
-            format!("Expected operator, got {:?}", operator),
+        Err(CssError::with_location(
+            format!("Expected operator, got {:?}", operator).as_str(),
             self.tokenizer.current_location(),
         ))
     }
diff --git a/crates/gosub_css3/src/parser/pseudo.rs b/crates/gosub_css3/src/parser/pseudo.rs
index 8e5ff612e..2651ac211 100644
--- a/crates/gosub_css3/src/parser/pseudo.rs
+++ b/crates/gosub_css3/src/parser/pseudo.rs
@@ -1,20 +1,22 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    fn parse_pseudo_function_selector_list(&mut self) -> Result<Node, Error> {
+    fn parse_pseudo_function_selector_list(&mut self) -> CssResult<Node> {
         log::trace!("parse_pseudo_function_selector_list");
         self.parse_selector_list()
     }
 
-    fn parse_pseudo_function_selector(&mut self) -> Result<Node, Error> {
+    fn parse_pseudo_function_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_pseudo_function_selector");
 
         self.parse_selector()
     }
 
-    fn parse_pseudo_function_ident_list(&mut self) -> Result<Node, Error> {
+    fn parse_pseudo_function_ident_list(&mut self) -> CssResult<Node> {
         log::trace!("parse_pseudo_function_ident_list");
 
         let loc = self.tokenizer.current_location();
@@ -24,7 +26,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::Ident { value }, loc))
     }
 
-    fn parse_pseudo_function_nth(&mut self) -> Result<Node, Error> {
+    fn parse_pseudo_function_nth(&mut self) -> CssResult<Node> {
         log::trace!("parse_pseudo_function_nth");
 
         self.consume_whitespace_comments();
@@ -39,14 +41,14 @@ impl Css3<'_> {
                     a: "2".into(),
                     b: "1".into(),
                 },
-                loc.clone(),
+                loc,
             ),
             TokenType::Ident(value) if value == "even" => Node::new(
                 NodeType::AnPlusB {
                     a: "2".into(),
                     b: "0".into(),
                 },
-                loc.clone(),
+                loc,
             ),
             TokenType::Ident(_) => {
                 self.tokenizer.reconsume();
@@ -56,10 +58,10 @@ impl Css3<'_> {
                 self.tokenizer.reconsume();
                 self.parse_anplusb()?
             }
-            TokenType::Number(value) => Node::new(NodeType::Number { value }, loc.clone()),
+            TokenType::Number(value) => Node::new(NodeType::Number { value }, loc),
             _ => {
-                return Err(Error::new(
-                    format!("Unexpected token {:?}", self.tokenizer.lookahead(0)),
+                return Err(CssError::with_location(
+                    format!("Unexpected token {:?}", self.tokenizer.lookahead(0)).as_str(),
                     self.tokenizer.current_location(),
                 ));
             }
@@ -76,10 +78,10 @@ impl Css3<'_> {
             }
         }
 
-        Ok(Node::new(NodeType::Nth { nth, selector }, loc.clone()))
+        Ok(Node::new(NodeType::Nth { nth, selector }, loc))
     }
 
-    pub(crate) fn parse_pseudo_function(&mut self, name: &str) -> Result<Node, Error> {
+    pub(crate) fn parse_pseudo_function(&mut self, name: &str) -> CssResult<Node> {
         log::trace!("parse_pseudo_function");
         match name {
             "dir" => self.parse_pseudo_function_ident_list(),
@@ -98,8 +100,8 @@ impl Css3<'_> {
             "slotted" => self.parse_pseudo_function_selector(),
             "host" => self.parse_pseudo_function_selector(),
             "host-context" => self.parse_pseudo_function_selector(),
-            _ => Err(Error::new(
-                format!("Unexpected pseudo function {:?}", name),
+            _ => Err(CssError::with_location(
+                format!("Unexpected pseudo function {:?}", name).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
diff --git a/crates/gosub_css3/src/parser/rule.rs b/crates/gosub_css3/src/parser/rule.rs
index c76fa1049..72b7d1eb2 100644
--- a/crates/gosub_css3/src/parser/rule.rs
+++ b/crates/gosub_css3/src/parser/rule.rs
@@ -1,13 +1,14 @@
 use crate::node::{Node, NodeType};
 use crate::parser::block::BlockParseMode;
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
     // Either the rule parsing succeeds as a whole, or not. When not a valid rule is found, we
     // return None if the config.ignore_errors is set to true, otherwise this will return an Err
     // and is handled by the caller
-    pub fn parse_rule(&mut self) -> Result<Option<Node>, Error> {
+    pub fn parse_rule(&mut self) -> CssResult<Option<Node>> {
         log::trace!("parse_rule");
 
         let result = self.parse_rule_internal();
@@ -24,7 +25,7 @@ impl Css3<'_> {
         Ok(None)
     }
 
-    fn parse_rule_internal(&mut self) -> Result<Node, Error> {
+    fn parse_rule_internal(&mut self) -> CssResult<Node> {
         let loc = self.tokenizer.current_location();
 
         let prelude = self.parse_selector_list()?;
@@ -49,6 +50,7 @@ impl Css3<'_> {
 #[cfg(test)]
 mod tests {
     use crate::walker::Walker;
+    use crate::{CssOrigin, ParserConfig};
     use gosub_shared::byte_stream::{ByteStream, Encoding};
 
     macro_rules! test {
@@ -57,7 +59,7 @@ mod tests {
             stream.read_from_str($input, Some(Encoding::UTF8));
             stream.close();
 
-            let mut parser = crate::Css3::new(&mut stream);
+            let mut parser = crate::Css3::new(&mut stream, ParserConfig::default(), CssOrigin::User, "");
             let result = parser.$func().unwrap().unwrap();
 
             let w = Walker::new(&result);
diff --git a/crates/gosub_css3/src/parser/selector.rs b/crates/gosub_css3/src/parser/selector.rs
index 90535e92f..97b44bf2f 100644
--- a/crates/gosub_css3/src/parser/selector.rs
+++ b/crates/gosub_css3/src/parser/selector.rs
@@ -1,9 +1,11 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    fn parse_attribute_operator(&mut self) -> Result<Node, Error> {
+    fn parse_attribute_operator(&mut self) -> CssResult<Node> {
         log::trace!("parse_attribute_operator");
 
         let mut value = String::new();
@@ -17,8 +19,8 @@ impl Css3<'_> {
             _ => {
                 self.tokenizer.reconsume();
 
-                return Err(Error::new(
-                    format!("Expected attribute operator, got {:?}", c),
+                return Err(CssError::with_location(
+                    format!("Expected attribute operator, got {:?}", c).as_str(),
                     loc,
                 ));
             }
@@ -32,7 +34,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::Operator(value), loc))
     }
 
-    fn parse_class_selector(&mut self) -> Result<Node, Error> {
+    fn parse_class_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_class_selector");
 
         let loc = self.tokenizer.current_location();
@@ -44,7 +46,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::ClassSelector { value }, loc))
     }
 
-    fn parse_nesting_selector(&mut self) -> Result<Node, Error> {
+    fn parse_nesting_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_nesting_selector");
 
         let loc = self.tokenizer.current_location();
@@ -54,7 +56,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::NestingSelector, loc))
     }
 
-    fn parse_type_selector_ident_or_asterisk(&mut self) -> Result<String, Error> {
+    fn parse_type_selector_ident_or_asterisk(&mut self) -> CssResult<String> {
         let t = self.tokenizer.lookahead(0);
         match t.token_type {
             TokenType::Ident(value) => {
@@ -65,14 +67,14 @@ impl Css3<'_> {
                 self.tokenizer.consume();
                 Ok("*".to_string())
             }
-            _ => Err(Error::new(
-                format!("Unexpected token {:?}", t),
+            _ => Err(CssError::with_location(
+                format!("Unexpected token {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             )),
         }
     }
 
-    fn parse_type_selector(&mut self) -> Result<Node, Error> {
+    fn parse_type_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_type_selector");
 
         let loc = self.tokenizer.current_location();
@@ -108,7 +110,7 @@ impl Css3<'_> {
         ))
     }
 
-    fn parse_attribute_selector(&mut self) -> Result<Node, Error> {
+    fn parse_attribute_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_attribute_selector");
 
         let loc = self.tokenizer.current_location();
@@ -137,8 +139,8 @@ impl Css3<'_> {
                 } else if t.is_ident() {
                     value = self.consume_any_ident()?;
                 } else {
-                    return Err(Error::new(
-                        format!("Unexpected token {:?}", t),
+                    return Err(CssError::with_location(
+                        format!("Unexpected token {:?}", t).as_str(),
                         self.tokenizer.current_location(),
                     ));
                 }
@@ -167,7 +169,7 @@ impl Css3<'_> {
         ))
     }
 
-    fn parse_id_selector(&mut self) -> Result<Node, Error> {
+    fn parse_id_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_id_selector");
 
         let loc = self.tokenizer.current_location();
@@ -178,8 +180,8 @@ impl Css3<'_> {
         let value = match t.token_type {
             TokenType::Ident(s) => s,
             _ => {
-                return Err(Error::new(
-                    format!("Unexpected token {:?}", t),
+                return Err(CssError::with_location(
+                    format!("Unexpected token {:?}", t).as_str(),
                     self.tokenizer.current_location(),
                 ));
             }
@@ -188,7 +190,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::IdSelector { value }, loc))
     }
 
-    fn parse_pseudo_element_selector(&mut self) -> Result<Node, Error> {
+    fn parse_pseudo_element_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_pseudo_element_selector");
 
         let loc = self.tokenizer.current_location();
@@ -200,8 +202,8 @@ impl Css3<'_> {
         let value = if t.is_ident() {
             self.consume_any_ident()?
         } else {
-            return Err(Error::new(
-                format!("Unexpected token {:?}", t),
+            return Err(CssError::with_location(
+                format!("Unexpected token {:?}", t).as_str(),
                 self.tokenizer.current_location(),
             ));
         };
@@ -209,7 +211,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::PseudoElementSelector { value }, loc))
     }
 
-    fn parse_pseudo_selector(&mut self) -> Result<Node, Error> {
+    fn parse_pseudo_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_pseudo_selector");
 
         let loc = self.tokenizer.current_location();
@@ -233,8 +235,8 @@ impl Css3<'_> {
                 )
             }
             _ => {
-                return Err(Error::new(
-                    format!("Unexpected token {:?}", t),
+                return Err(CssError::with_location(
+                    format!("Unexpected token {:?}", t).as_str(),
                     self.tokenizer.current_location(),
                 ));
             }
@@ -243,7 +245,7 @@ impl Css3<'_> {
         Ok(Node::new(NodeType::PseudoClassSelector { value }, loc))
     }
 
-    pub fn parse_selector(&mut self) -> Result<Node, Error> {
+    pub fn parse_selector(&mut self) -> CssResult<Node> {
         log::trace!("parse_selector");
 
         let loc = self.tokenizer.current_location();
@@ -253,7 +255,7 @@ impl Css3<'_> {
 
         // When true, we have encountered a space which means we need to emit a descendant combinator
         let mut space = false;
-        let mut whitespace_location = loc.clone();
+        let mut whitespace_location = loc;
 
         let mut skip_space = false;
 
@@ -273,7 +275,7 @@ impl Css3<'_> {
 
             if t.is_whitespace() {
                 // on whitespace for selector
-                whitespace_location = t.location.clone();
+                whitespace_location = t.location;
                 space = true;
                 continue;
             }
@@ -299,18 +301,11 @@ impl Css3<'_> {
 
                 TokenType::Number(value) => Node::new(NodeType::Number { value }, t.location),
 
-                TokenType::Percentage(value) => {
-                    Node::new(NodeType::Percentage { value }, t.location)
-                }
+                TokenType::Percentage(value) => Node::new(NodeType::Percentage { value }, t.location),
 
-                TokenType::Dimension { value, unit } => {
-                    Node::new(NodeType::Dimension { value, unit }, t.location)
-                }
+                TokenType::Dimension { value, unit } => Node::new(NodeType::Dimension { value, unit }, t.location),
 
-                TokenType::Delim('+')
-                | TokenType::Delim('>')
-                | TokenType::Delim('~')
-                | TokenType::Delim('/') => {
+                TokenType::Delim('+') | TokenType::Delim('>') | TokenType::Delim('~') | TokenType::Delim('/') => {
                     // Dont add descendant combinator since we are now adding another one
                     space = false;
 
@@ -347,12 +342,7 @@ impl Css3<'_> {
 
             if space {
                 // Detected a space previously, so we need to emit a descendant combinator
-                let node = Node::new(
-                    NodeType::Combinator {
-                        value: " ".to_string(),
-                    },
-                    whitespace_location.clone(),
-                );
+                let node = Node::new(NodeType::Combinator { value: " ".to_string() }, whitespace_location);
                 // insert before the last added node
                 children.push(node);
                 space = false;
diff --git a/crates/gosub_css3/src/parser/selector_list.rs b/crates/gosub_css3/src/parser/selector_list.rs
index 1e068c640..3f2c92fbb 100644
--- a/crates/gosub_css3/src/parser/selector_list.rs
+++ b/crates/gosub_css3/src/parser/selector_list.rs
@@ -1,8 +1,9 @@
 use crate::node::{Node, NodeType};
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_selector_list(&mut self) -> Result<Node, Error> {
+    pub fn parse_selector_list(&mut self) -> CssResult<Node> {
         log::trace!("parse_selector_list");
 
         let loc = self.tokenizer.current_location();
diff --git a/crates/gosub_css3/src/parser/stylesheet.rs b/crates/gosub_css3/src/parser/stylesheet.rs
index 8bb2eb42c..741946566 100644
--- a/crates/gosub_css3/src/parser/stylesheet.rs
+++ b/crates/gosub_css3/src/parser/stylesheet.rs
@@ -1,9 +1,10 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_stylesheet(&mut self) -> Result<Option<Node>, Error> {
+    pub fn parse_stylesheet_internal(&mut self) -> CssResult<Option<Node>> {
         log::trace!("parse_stylesheet");
 
         let loc = self.tokenizer.current_location();
@@ -18,17 +19,14 @@ impl Css3<'_> {
                 TokenType::Whitespace(_) => {}
                 TokenType::Comment(comment) => {
                     if comment.chars().nth(2) == Some('!') {
-                        children.push(Node::new(
-                            NodeType::Comment { value: comment },
-                            t.location.clone(),
-                        ));
+                        children.push(Node::new(NodeType::Comment { value: comment }, t.location));
                     }
                 }
                 TokenType::Cdo => {
-                    children.push(Node::new(NodeType::Cdo, t.location.clone()));
+                    children.push(Node::new(NodeType::Cdo, t.location));
                 }
                 TokenType::Cdc => {
-                    children.push(Node::new(NodeType::Cdc, t.location.clone()));
+                    children.push(Node::new(NodeType::Cdc, t.location));
                 }
                 TokenType::AtKeyword(_keyword) => {
                     self.tokenizer.reconsume();
diff --git a/crates/gosub_css3/src/parser/url.rs b/crates/gosub_css3/src/parser/url.rs
index 979ea42de..71e400461 100644
--- a/crates/gosub_css3/src/parser/url.rs
+++ b/crates/gosub_css3/src/parser/url.rs
@@ -1,17 +1,19 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_url(&mut self) -> Result<Node, Error> {
+    pub fn parse_url(&mut self) -> CssResult<Node> {
         log::trace!("parse_url");
 
         let loc = self.tokenizer.current_location();
 
         let name = self.consume_function()?;
         if name.to_ascii_lowercase() != "url" {
-            return Err(Error::new(
-                format!("Expected url, got {:?}", name),
+            return Err(CssError::with_location(
+                format!("Expected url, got {:?}", name).as_str(),
                 self.tokenizer.current_location(),
             ));
         }
@@ -20,10 +22,10 @@ impl Css3<'_> {
         let url = match t.token_type {
             TokenType::QuotedString(url) => url,
             _ => {
-                return Err(Error::new(
-                    format!("Expected url, got {:?}", t),
+                return Err(CssError::with_location(
+                    format!("Expected url, got {:?}", t).as_str(),
                     self.tokenizer.current_location(),
-                ))
+                ));
             }
         };
 
@@ -36,6 +38,7 @@ impl Css3<'_> {
 #[cfg(test)]
 mod tests {
     use crate::walker::Walker;
+    use crate::{CssOrigin, ParserConfig};
     use gosub_shared::byte_stream::{ByteStream, Encoding};
 
     macro_rules! test {
@@ -44,7 +47,7 @@ mod tests {
             stream.read_from_str($input, Some(Encoding::UTF8));
             stream.close();
 
-            let mut parser = crate::Css3::new(&mut stream);
+            let mut parser = crate::Css3::new(&mut stream, ParserConfig::default(), CssOrigin::User, "");
             let result = parser.$func().unwrap();
 
             let w = Walker::new(&result);
@@ -58,7 +61,7 @@ mod tests {
     //         stream.read_from_str($input, Some(Encoding::UTF8));
     //         stream.close();
     //
-    //         let mut parser = crate::Css3::new(&mut stream);
+    //         let mut parser = crate::Css3::new(&mut stream, Default::default(), Default::default(), "");
     //         let result = parser.$func();
     //
     //         assert_eq!(true, result.is_err());
diff --git a/crates/gosub_css3/src/parser/value.rs b/crates/gosub_css3/src/parser/value.rs
index d7697b3c0..7c5b1567d 100644
--- a/crates/gosub_css3/src/parser/value.rs
+++ b/crates/gosub_css3/src/parser/value.rs
@@ -1,9 +1,11 @@
 use crate::node::{Node, NodeType};
 use crate::tokenizer::TokenType;
-use crate::{Css3, Error};
+use crate::Css3;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
 
 impl Css3<'_> {
-    pub fn parse_value_sequence(&mut self) -> Result<Vec<Node>, Error> {
+    pub fn parse_value_sequence(&mut self) -> CssResult<Vec<Node>> {
         log::trace!("parse_value_sequence");
 
         let mut children = Vec::new();
@@ -38,7 +40,7 @@ impl Css3<'_> {
     //    none: no value is found (but this is not an error)
     // err:
     //    parsing went wrong
-    fn parse_value(&mut self) -> Result<Option<Node>, Error> {
+    fn parse_value(&mut self) -> CssResult<Option<Node>> {
         log::trace!("parse_value");
 
         let t = self.consume_any()?;
@@ -51,8 +53,8 @@ impl Css3<'_> {
                 let node = Node::new(NodeType::Operator(",".into()), t.location);
                 Ok(Some(node))
             }
-            TokenType::LBracket => Err(Error::new(
-                "Unexpected token [".to_string(),
+            TokenType::LBracket => Err(CssError::with_location(
+                "Unexpected token [",
                 self.tokenizer.current_location(),
             )),
             TokenType::QuotedString(value) => {
@@ -104,9 +106,7 @@ impl Css3<'_> {
                     return Ok(Some(n));
                 }
 
-                if !self.allow_values_in_argument_list.is_empty()
-                    && self.tokenizer.lookahead(0).is_delim('=')
-                {
+                if !self.allow_values_in_argument_list.is_empty() && self.tokenizer.lookahead(0).is_delim('=') {
                     self.consume_delim('=')?;
                     let t = self.consume_any()?;
                     let node = match t.token_type {
@@ -124,16 +124,12 @@ impl Css3<'_> {
                             },
                             t.location,
                         ),
-                        TokenType::Ident(default_value) => Node::new(
-                            NodeType::MSIdent {
-                                value,
-                                default_value,
-                            },
-                            t.location,
-                        ),
+                        TokenType::Ident(default_value) => {
+                            Node::new(NodeType::MSIdent { value, default_value }, t.location)
+                        }
                         _ => {
-                            return Err(Error::new(
-                                format!("Expected number or ident, got {:?}", t),
+                            return Err(CssError::with_location(
+                                format!("Expected number or ident, got {:?}", t).as_str(),
                                 self.tokenizer.current_location(),
                             ))
                         }
@@ -156,8 +152,8 @@ impl Css3<'_> {
                     let node = self.parse_operator()?;
                     Ok(Some(node))
                 }
-                '#' => Err(Error::new(
-                    format!("Unexpected token {:?}", t),
+                '#' => Err(CssError::with_location(
+                    format!("Unexpected token {:?}", t).as_str(),
                     self.tokenizer.current_location(),
                 )),
                 _ => {
diff --git a/crates/gosub_css3/src/stylesheet.rs b/crates/gosub_css3/src/stylesheet.rs
index 1a4a40a8b..54ca3a00f 100644
--- a/crates/gosub_css3/src/stylesheet.rs
+++ b/crates/gosub_css3/src/stylesheet.rs
@@ -1,33 +1,120 @@
 use core::fmt::Debug;
+use gosub_shared::byte_stream::Location;
+use gosub_shared::errors::CssError;
+use gosub_shared::errors::CssResult;
+use gosub_shared::traits::css3::CssOrigin;
 use std::cmp::Ordering;
 use std::fmt::Display;
 
-use anyhow::anyhow;
+use crate::colors::RgbColor;
 
-use gosub_shared::types::Result;
+/// Severity of a CSS error
+#[derive(Debug, PartialEq)]
+pub enum Severity {
+    /// A critical error that will prevent the stylesheet from being applied
+    Error,
+    /// A warning that will be displayed but will not prevent the stylesheet from being applied
+    Warning,
+    /// An information message that can be displayed to the user
+    Info,
+}
 
-use crate::colors::RgbColor;
+impl Display for Severity {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        match self {
+            Severity::Error => write!(f, "Error"),
+            Severity::Warning => write!(f, "Warning"),
+            Severity::Info => write!(f, "Info"),
+        }
+    }
+}
+
+/// Defines a CSS log during
+#[derive(PartialEq)]
+pub struct CssLog {
+    /// Severity of the error
+    pub severity: Severity,
+    /// Error message
+    pub message: String,
+    /// Location of the error
+    pub location: Location,
+}
+
+impl CssLog {
+    pub fn log(severity: Severity, message: &str, location: Location) -> Self {
+        Self {
+            severity,
+            message: message.to_string(),
+            location,
+        }
+    }
+
+    pub fn error(message: &str, location: Location) -> Self {
+        Self {
+            severity: Severity::Error,
+            message: message.to_string(),
+            location,
+        }
+    }
+
+    pub fn warn(message: &str, location: Location) -> Self {
+        Self {
+            severity: Severity::Warning,
+            message: message.to_string(),
+            location,
+        }
+    }
+
+    pub fn info(message: &str, location: Location) -> Self {
+        Self {
+            severity: Severity::Info,
+            message: message.to_string(),
+            location,
+        }
+    }
+}
+
+impl Display for CssLog {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        write!(
+            f,
+            "[{}] ({}:{}): {}",
+            self.severity, self.location.line, self.location.column, self.message
+        )
+    }
+}
+
+impl Debug for CssLog {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        write!(
+            f,
+            "[{}] ({}:{}): {}",
+            self.severity, self.location.line, self.location.column, self.message
+        )
+    }
+}
 
 /// Defines a complete stylesheet with all its rules and the location where it was found
-#[derive(Debug, PartialEq, Clone)]
+#[derive(Debug, PartialEq)]
 pub struct CssStylesheet {
     /// List of rules found in this stylesheet
     pub rules: Vec<CssRule>,
     /// Origin of the stylesheet (user agent, author, user)
     pub origin: CssOrigin,
     /// Url or file path where the stylesheet was found
-    pub location: String,
+    pub url: String,
+    /// Any issues during parsing of the stylesheet
+    pub parse_log: Vec<CssLog>,
 }
 
-/// Defines the origin of the stylesheet (or declaration)
-#[derive(Debug, PartialEq, Clone)]
-pub enum CssOrigin {
-    /// Browser/user agent defined stylesheets
-    UserAgent,
-    /// Author defined stylesheets that are linked or embedded in the HTML files
-    Author,
-    /// User defined stylesheets that will override the author and user agent stylesheets (for instance, custom user styles or extensions)
-    User,
+impl gosub_shared::traits::css3::CssStylesheet for CssStylesheet {
+    fn origin(&self) -> CssOrigin {
+        self.origin
+    }
+
+    fn url(&self) -> &str {
+        &self.url
+    }
 }
 
 /// A CSS rule, which contains a list of selectors and a list of declarations
@@ -54,7 +141,7 @@ impl CssRule {
 pub struct CssDeclaration {
     // Css property color
     pub property: String,
-    // Raw values of the declaration. It is not calculated or converted in any way (ie: "red", "50px" etc)
+    // Raw values of the declaration. It is not calculated or converted in any way (ie: "red", "50px" etc.)
     // There can be multiple values  (ie:   "1px solid black" are split into 3 values)
     pub value: Vec<CssValue>,
     // ie: !important
@@ -352,7 +439,7 @@ impl CssValue {
     }
 
     /// Converts a CSS AST node to a CSS value
-    pub fn parse_ast_node(node: &crate::node::Node) -> Result<CssValue> {
+    pub fn parse_ast_node(node: &crate::node::Node) -> CssResult<CssValue> {
         match *node.node_type.clone() {
             crate::node::NodeType::Ident { value } => Ok(CssValue::String(value)),
             crate::node::NodeType::Number { value } => {
@@ -373,13 +460,10 @@ impl CssValue {
                 Ok(CssValue::String(value))
             }
             crate::node::NodeType::Operator(_) => Ok(CssValue::None),
-            crate::node::NodeType::Calc { .. } => {
-                Ok(CssValue::Function("calc".to_string(), vec![]))
+            crate::node::NodeType::Calc { .. } => Ok(CssValue::Function("calc".to_string(), vec![])),
+            crate::node::NodeType::Url { url } => {
+                Ok(CssValue::Function("url".to_string(), vec![CssValue::String(url)]))
             }
-            crate::node::NodeType::Url { url } => Ok(CssValue::Function(
-                "url".to_string(),
-                vec![CssValue::String(url)],
-            )),
             crate::node::NodeType::Function { name, arguments } => {
                 let mut list = vec![];
                 for node in arguments.iter() {
@@ -390,15 +474,14 @@ impl CssValue {
                 }
                 Ok(CssValue::Function(name, list))
             }
-            _ => Err(anyhow!(format!(
-                "Cannot convert node to CssValue: {:?}",
-                node
-            ))),
+            _ => Err(CssError::new(
+                format!("Cannot convert node to CssValue: {:?}", node).as_str(),
+            )),
         }
     }
 
     /// Parses a string into a CSS value or list of css values
-    pub fn parse_str(value: &str) -> Result<CssValue> {
+    pub fn parse_str(value: &str) -> CssResult<CssValue> {
         match value {
             "initial" => return Ok(CssValue::Initial),
             "inherit" => return Ok(CssValue::Inherit),
@@ -444,6 +527,64 @@ impl CssValue {
     }
 }
 
+impl gosub_shared::traits::css3::CssValue for CssValue {
+    fn unit_to_px(&self) -> f32 {
+        self.unit_to_px()
+    }
+
+    fn as_string(&self) -> Option<&str> {
+        if let CssValue::String(str) = &self {
+            Some(str)
+        } else {
+            None
+        }
+    }
+
+    fn as_percentage(&self) -> Option<f32> {
+        if let CssValue::Percentage(percent) = &self {
+            Some(*percent)
+        } else {
+            None
+        }
+    }
+
+    fn as_unit(&self) -> Option<(f32, &str)> {
+        if let CssValue::Unit(value, unit) = &self {
+            Some((*value, unit))
+        } else {
+            None
+        }
+    }
+
+    fn as_color(&self) -> Option<(f32, f32, f32, f32)> {
+        if let CssValue::Color(color) = &self {
+            Some((color.r, color.g, color.b, color.a))
+        } else {
+            None
+        }
+    }
+
+    fn as_number(&self) -> Option<f32> {
+        if let CssValue::Number(num) = &self {
+            Some(*num)
+        } else {
+            None
+        }
+    }
+
+    fn as_list(&self) -> Option<Vec<Self>> {
+        if let CssValue::List(list) = &self {
+            Some(list.to_vec())
+        } else {
+            None
+        }
+    }
+
+    fn is_none(&self) -> bool {
+        matches!(self, CssValue::None)
+    }
+}
+
 #[cfg(test)]
 mod test {
     use std::vec;
diff --git a/crates/gosub_css3/src/system.rs b/crates/gosub_css3/src/system.rs
new file mode 100644
index 000000000..1c44c83c7
--- /dev/null
+++ b/crates/gosub_css3/src/system.rs
@@ -0,0 +1,244 @@
+use crate::functions::attr::resolve_attr;
+use crate::functions::calc::resolve_calc;
+use crate::functions::var::resolve_var;
+use crate::matcher::property_definitions::get_css_definitions;
+use crate::matcher::shorthands::FixList;
+use crate::matcher::styling::{match_selector, CssProperties, CssProperty, DeclarationProperty};
+use crate::stylesheet::{CssDeclaration, CssValue, Specificity};
+use crate::Css3;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::errors::CssResult;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::{CssOrigin, CssPropertyMap, CssSystem};
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::node::{ElementDataType, Node, TextDataType};
+use gosub_shared::traits::render_tree::{RenderTree, RenderTreeNode};
+use gosub_shared::traits::ParserConfig;
+use log::warn;
+
+#[derive(Debug, Clone)]
+pub struct Css3System;
+
+impl CssSystem for Css3System {
+    type Stylesheet = crate::stylesheet::CssStylesheet;
+
+    type PropertyMap = CssProperties;
+
+    type Property = CssProperty;
+
+    fn parse_str(str: &str, config: ParserConfig, origin: CssOrigin, url: &str) -> CssResult<Self::Stylesheet> {
+        Css3::parse_str(str, config, origin, url)
+    }
+
+    fn properties_from_node<D: Document<Self>>(
+        node: &D::Node,
+        sheets: &[Self::Stylesheet],
+        handle: DocumentHandle<D, Self>,
+        id: NodeId,
+    ) -> Option<Self::PropertyMap> {
+        let mut css_map_entry = CssProperties::new();
+
+        if node_is_unrenderable::<D, Self>(node) {
+            return None;
+        }
+
+        let definitions = get_css_definitions();
+
+        let mut fix_list = FixList::new();
+
+        for sheet in sheets {
+            for rule in &sheet.rules {
+                for selector in rule.selectors().iter() {
+                    let (matched, specificity) = match_selector(DocumentHandle::clone(&handle), id, selector);
+
+                    if !matched {
+                        continue;
+                    }
+
+                    // Selector matched, so we add all declared values to the map
+                    for declaration in rule.declarations().iter() {
+                        // Step 1: find the property in our CSS definition list
+                        let Some(definition) = definitions.find_property(&declaration.property) else {
+                            // If not found, we skip this declaration
+                            warn!("Definition is not found for property {:?}", declaration.property);
+                            continue;
+                        };
+
+                        let value = resolve_functions(&declaration.value, node, handle.clone());
+
+                        // Check if the declaration matches the definition and return the "expanded" order
+                        let res = definition.matches_and_shorthands(&value, &mut fix_list);
+                        if !res {
+                            warn!("Declaration does not match definition: {:?}", declaration);
+                            continue;
+                        }
+
+                        // create property for the given values
+                        let property_name = declaration.property.clone();
+                        let decl = CssDeclaration {
+                            property: property_name.to_string(),
+                            value,
+                            important: declaration.important,
+                        };
+
+                        add_property_to_map(&mut css_map_entry, sheet, specificity.clone(), &decl);
+                    }
+                }
+            }
+        }
+
+        fix_list.resolve_nested(definitions);
+
+        fix_list.apply(&mut css_map_entry);
+
+        Some(css_map_entry)
+    }
+
+    fn inheritance<T: RenderTree<Self>>(tree: &mut T) {
+        Self::resolve_inheritance(tree, tree.root(), &Vec::new());
+    }
+}
+
+impl Css3System {
+    fn resolve_inheritance<T: RenderTree<Self>>(
+        tree: &mut T,
+        node_id: T::NodeId,
+        inherit_props: &Vec<(String, CssValue)>,
+    ) {
+        let Some(current_node) = tree.get_node_mut(node_id) else {
+            return;
+        };
+
+        for prop in inherit_props {
+            let mut p = CssProperty::new(prop.0.as_str());
+
+            p.inherited = prop.1.clone();
+
+            current_node.props_mut().insert_inherited(prop.0.as_str(), p);
+        }
+
+        let mut inherit_props = inherit_props.clone();
+
+        'props: for (name, prop) in &mut current_node.props_mut().iter_mut() {
+            prop.compute_value();
+
+            let value = prop.actual.clone();
+
+            if prop_is_inherit(name) {
+                for (k, v) in &mut inherit_props {
+                    if k == name {
+                        *v = value;
+                        continue 'props;
+                    }
+                }
+
+                inherit_props.push((name.to_owned(), value));
+            }
+        }
+
+        let Some(children) = tree.get_children(node_id) else {
+            return;
+        };
+
+        for child in children {
+            Self::resolve_inheritance(tree, child, &inherit_props);
+        }
+    }
+}
+
+pub fn prop_is_inherit(name: &str) -> bool {
+    get_css_definitions()
+        .find_property(name)
+        .map(|def| def.inherited)
+        .unwrap_or(false)
+}
+
+pub fn add_property_to_map(
+    css_map_entry: &mut CssProperties,
+    sheet: &crate::stylesheet::CssStylesheet,
+    specificity: Specificity,
+    declaration: &CssDeclaration,
+) {
+    let property_name = declaration.property.clone();
+    // let entry = CssProperty::new(property_name.as_str());
+
+    // If the property is a shorthand css property, we need fetch the individual properties
+    // It's possible that need to recurse here as these individual properties can be shorthand as well
+    // if entry.is_shorthand() {
+    //     for property_name in entry.get_props_from_shorthand() {
+    //         let decl = CssDeclaration {
+    //             property: property_name.to_string(),
+    //             value: declaration.value.clone(),
+    //             important: declaration.important,
+    //         };
+    //
+    //         add_property_to_map(css_map_entry, sheet, selector, &decl);
+    //     }
+    // }
+    //
+    let declaration = DeclarationProperty {
+        // @todo: this seems wrong. We only get the first values from the declared values
+        value: declaration.value.first().unwrap().clone(),
+        origin: sheet.origin,
+        important: declaration.important,
+        location: sheet.url.clone(),
+        specificity,
+    };
+
+    if let std::collections::hash_map::Entry::Vacant(e) = css_map_entry.properties.entry(property_name.clone()) {
+        // Generate new property in the css map
+        let mut entry = CssProperty::new(property_name.as_str());
+        entry.declared.push(declaration);
+        e.insert(entry);
+    } else {
+        // Just add the declaration to the existing property
+        let entry = css_map_entry.properties.get_mut(&property_name).unwrap();
+        entry.declared.push(declaration);
+    }
+}
+
+pub fn node_is_unrenderable<D: Document<C>, C: CssSystem>(node: &D::Node) -> bool {
+    // There are more elements that are not renderable, but for now we only remove the most common ones
+
+    const REMOVABLE_ELEMENTS: [&str; 6] = ["head", "script", "style", "svg", "noscript", "title"];
+
+    if let Some(element_data) = node.get_element_data() {
+        if REMOVABLE_ELEMENTS.contains(&element_data.name()) {
+            return true;
+        }
+    }
+
+    if let Some(text_data) = &node.get_text_data() {
+        if text_data.value().chars().all(|c| c.is_whitespace()) {
+            return true;
+        }
+    }
+
+    false
+}
+
+pub fn resolve_functions<D: Document<C>, C: CssSystem>(
+    value: &[CssValue],
+    node: &D::Node,
+    handle: DocumentHandle<D, C>,
+) -> Vec<CssValue> {
+    let mut result = Vec::with_capacity(value.len()); //TODO: we could give it a &mut Vec and reuse the allocation
+
+    for val in value {
+        match val {
+            CssValue::Function(func, values) => {
+                let resolved = match func.as_str() {
+                    "calc" => resolve_calc(values),
+                    "attr" => resolve_attr(values, node),
+                    "var" => resolve_var(values, &*handle.get(), node),
+                    _ => vec![val.clone()],
+                };
+
+                result.extend(resolved);
+            }
+            _ => result.push(val.clone()),
+        }
+    }
+
+    result
+}
diff --git a/crates/gosub_css3/src/tokenizer.rs b/crates/gosub_css3/src/tokenizer.rs
index 8dce822a8..4925cf6e8 100644
--- a/crates/gosub_css3/src/tokenizer.rs
+++ b/crates/gosub_css3/src/tokenizer.rs
@@ -95,10 +95,7 @@ impl Debug for Token {
 impl Token {
     /// Returns a new token for the given type on the given location
     fn new(token_type: TokenType, location: Location) -> Token {
-        Token {
-            token_type,
-            location,
-        }
+        Token { token_type, location }
     }
 
     fn new_delim(c: char, location: Location) -> Token {
@@ -256,7 +253,7 @@ impl<'stream> Tokenizer<'stream> {
 
     /// Returns the current location (line/col) of the tokenizer
     pub fn current_location(&self) -> Location {
-        self.location_handler.cur_location.clone()
+        self.location_handler.cur_location
     }
 
     /// Returns true when there is no next element, and the stream is closed
@@ -602,9 +599,7 @@ impl<'stream> Tokenizer<'stream> {
 
         value.push_str(&self.consume_digits());
 
-        if self.current_char() == Ch('.')
-            && matches!(self.stream.look_ahead(1), Ch(c) if c.is_numeric())
-        {
+        if self.current_char() == Ch('.') && matches!(self.stream.look_ahead(1), Ch(c) if c.is_numeric()) {
             value.push_str(&self.consume_chars(2));
 
             // type should be "number"
@@ -747,9 +742,7 @@ impl<'stream> Tokenizer<'stream> {
 
         // todo: look for better implementation
         if let Some(char) = char::from_u32(as_u32) {
-            if char == get_unicode_char(&UnicodeChar::Null)
-                || char >= get_unicode_char(&UnicodeChar::MaxAllowed)
-            {
+            if char == get_unicode_char(&UnicodeChar::Null) || char >= get_unicode_char(&UnicodeChar::MaxAllowed) {
                 return default_char;
             }
 
@@ -842,8 +835,7 @@ impl<'stream> Tokenizer<'stream> {
     /// def: [non-printable code point](https://www.w3.org/TR/css-syntax-3/#non-printable-code-point)
     fn is_non_printable_char(&self) -> bool {
         if let Ch(char) = self.current_char() {
-            (char >= get_unicode_char(&UnicodeChar::Null)
-                && char <= get_unicode_char(&UnicodeChar::Backspace))
+            (char >= get_unicode_char(&UnicodeChar::Null) && char <= get_unicode_char(&UnicodeChar::Backspace))
                 || (char >= get_unicode_char(&UnicodeChar::ShiftOut)
                     && char <= get_unicode_char(&UnicodeChar::InformationSeparatorOne))
                 || char == get_unicode_char(&UnicodeChar::Tab)
@@ -867,9 +859,7 @@ impl<'stream> Tokenizer<'stream> {
         let second = self.stream.look_ahead(start + 1);
 
         if first == Ch('-') {
-            return self.is_ident_start(second.into())
-                || second == Ch('-')
-                || self.is_start_of_escape(start + 1);
+            return self.is_ident_start(second.into()) || second == Ch('-') || self.is_start_of_escape(start + 1);
         }
 
         if first == Ch('\\') {
@@ -885,8 +875,7 @@ impl<'stream> Tokenizer<'stream> {
         let last = self.stream.look_ahead(start + 2);
 
         // e.g. +1, -1, +.1, -0.01
-        matches!(current, Ch('+' | '-'))
-            && ((next == Ch('.') && last.is_numeric()) || next.is_numeric())
+        matches!(current, Ch('+' | '-')) && ((next == Ch('.') && last.is_numeric()) || next.is_numeric())
     }
 
     fn is_any_of(&self, chars: Vec<char>) -> bool {
@@ -990,9 +979,7 @@ mod test {
         let mut tokenizer = Tokenizer::new(&mut chars, Location::default());
 
         for (raw_num, num_token) in num_tokens {
-            tokenizer
-                .stream
-                .read_from_str(raw_num, Some(Encoding::UTF8));
+            tokenizer.stream.read_from_str(raw_num, Some(Encoding::UTF8));
             assert_eq!(tokenizer.consume_number(), num_token);
         }
     }
@@ -1012,9 +999,7 @@ mod test {
         let mut tokenizer = Tokenizer::new(&mut chars, Location::default());
 
         for (raw_ident, ident_tokens) in ident_tokens {
-            tokenizer
-                .stream
-                .read_from_str(raw_ident, Some(Encoding::UTF8));
+            tokenizer.stream.read_from_str(raw_ident, Some(Encoding::UTF8));
 
             assert_eq!(tokenizer.consume_ident(), ident_tokens);
         }
@@ -1028,26 +1013,15 @@ mod test {
             let escaped_chars = vec![
                 ("\\005F ", get_unicode_char(&UnicodeChar::LowLine)),
                 ("\\2A", '*'),
-                (
-                    "\\000000 ",
-                    get_unicode_char(&UnicodeChar::ReplacementCharacter),
-                ),
-                (
-                    "\\FFFFFF ",
-                    get_unicode_char(&UnicodeChar::ReplacementCharacter),
-                ),
-                (
-                    "\\10FFFF ",
-                    get_unicode_char(&UnicodeChar::ReplacementCharacter),
-                ),
+                ("\\000000 ", get_unicode_char(&UnicodeChar::ReplacementCharacter)),
+                ("\\FFFFFF ", get_unicode_char(&UnicodeChar::ReplacementCharacter)),
+                ("\\10FFFF ", get_unicode_char(&UnicodeChar::ReplacementCharacter)),
             ];
 
             let mut tokenizer = Tokenizer::new(&mut chars, Location::default());
 
             for (raw_escaped, escaped_char) in escaped_chars {
-                tokenizer
-                    .stream
-                    .read_from_str(raw_escaped, Some(Encoding::UTF8));
+                tokenizer.stream.read_from_str(raw_escaped, Some(Encoding::UTF8));
                 assert_eq!(tokenizer.consume_escaped_token(), escaped_char);
             }
         }
@@ -1062,30 +1036,16 @@ mod test {
                 "url(https://gosub.io/)",
                 Token::new_url("https://gosub.io/", Location::default()),
             ),
-            (
-                "url(  gosub.io   )",
-                Token::new_url("gosub.io", Location::default()),
-            ),
-            (
-                "url(gosub\u{002E}io)",
-                Token::new_url("gosub.io", Location::default()),
-            ),
-            (
-                "url(gosub\u{FFFD}io)",
-                Token::new_url("gosub�io", Location::default()),
-            ),
-            (
-                "url(gosub\u{0000}io)",
-                Token::new_bad_url("gosub", Location::default()),
-            ),
+            ("url(  gosub.io   )", Token::new_url("gosub.io", Location::default())),
+            ("url(gosub\u{002E}io)", Token::new_url("gosub.io", Location::default())),
+            ("url(gosub\u{FFFD}io)", Token::new_url("gosub�io", Location::default())),
+            ("url(gosub\u{0000}io)", Token::new_bad_url("gosub", Location::default())),
         ];
 
         let mut tokenizer = Tokenizer::new(&mut chars, Location::default());
 
         for (raw_url, url_token) in urls {
-            tokenizer
-                .stream
-                .read_from_str(raw_url, Some(Encoding::UTF8));
+            tokenizer.stream.read_from_str(raw_url, Some(Encoding::UTF8));
             assert_token_eq!(tokenizer.consume_ident_like_seq(), url_token);
         }
     }
@@ -1101,47 +1061,24 @@ mod test {
             ("url( \'", Token::new_function("url", Location::default())),
             ("url(\"", Token::new_function("url", Location::default())),
             ("attr('", Token::new_function("attr", Location::default())),
-            (
-                "rotateX(    '",
-                Token::new_function("rotateX", Location::default()),
-            ),
-            (
-                "rotateY(    \"",
-                Token::new_function("rotateY", Location::default()),
-            ),
+            ("rotateX(    '", Token::new_function("rotateX", Location::default())),
+            ("rotateY(    \"", Token::new_function("rotateY", Location::default())),
             ("-rgba(", Token::new_function("-rgba", Location::default())),
-            (
-                "--rgba(",
-                Token::new_function("--rgba", Location::default()),
-            ),
-            (
-                "-\\26 -rgba(",
-                Token::new_function("-&-rgba", Location::default()),
-            ),
+            ("--rgba(", Token::new_function("--rgba", Location::default())),
+            ("-\\26 -rgba(", Token::new_function("-&-rgba", Location::default())),
             ("0rgba()", Token::new_function("0rgba", Location::default())),
-            (
-                "-0rgba()",
-                Token::new_function("-0rgba", Location::default()),
-            ),
+            ("-0rgba()", Token::new_function("-0rgba", Location::default())),
             ("_rgba()", Token::new_function("_rgba", Location::default())),
             ("rgbâ()", Token::new_function("rgbâ", Location::default())),
-            (
-                "\\30rgba()",
-                Token::new_function("0rgba", Location::default()),
-            ),
+            ("\\30rgba()", Token::new_function("0rgba", Location::default())),
             ("rgba ()", Token::new_ident("rgba", Location::default())),
-            (
-                "-\\-rgba(",
-                Token::new_function("--rgba", Location::default()),
-            ),
+            ("-\\-rgba(", Token::new_function("--rgba", Location::default())),
         ];
 
         let mut tokenizer = Tokenizer::new(&mut chars, Location::default());
 
         for (raw_function, function_token) in functions {
-            tokenizer
-                .stream
-                .read_from_str(raw_function, Some(Encoding::UTF8));
+            tokenizer.stream.read_from_str(raw_function, Some(Encoding::UTF8));
             assert_token_eq!(tokenizer.consume_ident_like_seq(), function_token);
         }
     }
@@ -1151,10 +1088,7 @@ mod test {
         let mut chars = ByteStream::new(Encoding::UTF8, None);
 
         let numeric_tokens = vec![
-            (
-                "1.1rem",
-                Token::new_dimension(1.1, "rem", Location::default()),
-            ),
+            ("1.1rem", Token::new_dimension(1.1, "rem", Location::default())),
             ("1px", Token::new_dimension(1.0, "px", Location::default())),
             ("1em", Token::new_dimension(1.0, "em", Location::default())),
             ("1 em", Token::new_number(1.0, Location::default())),
@@ -1167,9 +1101,7 @@ mod test {
         let mut tokenizer = Tokenizer::new(&mut chars, Location::default());
 
         for (raw_token, token) in numeric_tokens {
-            tokenizer
-                .stream
-                .read_from_str(raw_token, Some(Encoding::UTF8));
+            tokenizer.stream.read_from_str(raw_token, Some(Encoding::UTF8));
             assert_token_eq!(tokenizer.consume_numeric_token(), token);
         }
     }
@@ -1179,10 +1111,7 @@ mod test {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
 
         let string_tokens = vec![
-            (
-                "'line\nnewline'",
-                Token::new_bad_string("line", Location::default()),
-            ),
+            ("'line\nnewline'", Token::new_bad_string("line", Location::default())),
             (
                 "\"double quotes\"",
                 Token::new_quoted_string("double quotes", Location::default()),
@@ -1191,22 +1120,14 @@ mod test {
                 "\'single quotes\'",
                 Token::new_quoted_string("single quotes", Location::default()),
             ),
-            (
-                "#hash#",
-                Token::new_quoted_string("hash", Location::default()),
-            ),
-            (
-                "\"eof",
-                Token::new_quoted_string("eof", Location::default()),
-            ),
+            ("#hash#", Token::new_quoted_string("hash", Location::default())),
+            ("\"eof", Token::new_quoted_string("eof", Location::default())),
             ("\"\"", Token::new_quoted_string("", Location::default())),
         ];
 
         for (raw_string, string_token) in string_tokens {
             let mut tokenizer = Tokenizer::new(&mut stream, Location::default());
-            tokenizer
-                .stream
-                .read_from_str(raw_string, Some(Encoding::UTF8));
+            tokenizer.stream.read_from_str(raw_string, Some(Encoding::UTF8));
             tokenizer.stream.close();
 
             let t = tokenizer.consume_string_token();
@@ -1218,10 +1139,7 @@ mod test {
     fn produce_stream_of_double_quoted_strings() {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
 
-        stream.read_from_str(
-            "\"\" \"Lorem 'îpsum'\" \"a\\\nb\" \"a\nb \"eof",
-            Some(Encoding::UTF8),
-        );
+        stream.read_from_str("\"\" \"Lorem 'îpsum'\" \"a\\\nb\" \"a\nb \"eof", Some(Encoding::UTF8));
         stream.close();
 
         let tokens = vec![
@@ -1253,10 +1171,7 @@ mod test {
     fn procude_stream_of_single_quoted_strings() {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
 
-        stream.read_from_str(
-            "'' 'Lorem \"îpsum\"' 'a\\\nb' 'a\nb 'eof",
-            Some(Encoding::UTF8),
-        );
+        stream.read_from_str("'' 'Lorem \"îpsum\"' 'a\\\nb' 'a\nb 'eof", Some(Encoding::UTF8));
         stream.close();
 
         let tokens = vec![
@@ -1446,10 +1361,7 @@ mod test {
     fn parse_cdo_and_cdc() {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
 
-        stream.read_from_str(
-            "/* CDO/CDC are not special */ <!-- --> {}",
-            Some(Encoding::UTF8),
-        );
+        stream.read_from_str("/* CDO/CDC are not special */ <!-- --> {}", Some(Encoding::UTF8));
         stream.close();
 
         let tokens = vec![
@@ -1857,7 +1769,10 @@ mod test {
     fn parse_css_seq_3() {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
 
-        stream.read_from_str("\\- red0 -red --red -\\-red\\ blue 0red -0red \\0000red _Red .red rêd r\\êd \\007F\\0080\\0081", Some(Encoding::UTF8));
+        stream.read_from_str(
+            "\\- red0 -red --red -\\-red\\ blue 0red -0red \\0000red _Red .red rêd r\\êd \\007F\\0080\\0081",
+            Some(Encoding::UTF8),
+        );
         stream.close();
 
         let tokens = vec![
@@ -1954,10 +1869,7 @@ mod test {
             tokenizer.lookahead(1),
             Token::new(TokenType::RBracket, Location::default())
         );
-        assert_token_eq!(
-            tokenizer.lookahead(4),
-            Token::new(TokenType::Eof, Location::default())
-        );
+        assert_token_eq!(tokenizer.lookahead(4), Token::new(TokenType::Eof, Location::default()));
 
         assert_token_eq!(
             tokenizer.consume(),
diff --git a/crates/gosub_css3/src/walker.rs b/crates/gosub_css3/src/walker.rs
index e0e93d7c3..955020334 100644
--- a/crates/gosub_css3/src/walker.rs
+++ b/crates/gosub_css3/src/walker.rs
@@ -46,11 +46,7 @@ fn inner_walk(node: &Node, depth: usize, f: &mut dyn Write) -> Result<(), std::i
             // writeln!(f, "{}  - block: ", prefix)?;
             inner_walk(block.as_ref().unwrap(), depth + 1, f)?;
         }
-        NodeType::AtRule {
-            name,
-            prelude,
-            block,
-        } => {
+        NodeType::AtRule { name, prelude, block } => {
             writeln!(f, "{}[AtRule] name: {}", prefix, name)?;
             if prelude.is_some() {
                 inner_walk(prelude.as_ref().unwrap(), depth + 1, f)?;
@@ -219,10 +215,7 @@ fn inner_walk(node: &Node, depth: usize, f: &mut dyn Write) -> Result<(), std::i
             writeln!(f, "{}[MSFunction]", prefix)?;
             inner_walk(func, depth + 1, f)?;
         }
-        NodeType::MSIdent {
-            value,
-            default_value,
-        } => {
+        NodeType::MSIdent { value, default_value } => {
             writeln!(
                 f,
                 "{}[MSIdent] value: {} default_value: {}",
diff --git a/crates/gosub_styling/tools/generate_definitions/go.mod b/crates/gosub_css3/tools/generate_definitions/go.mod
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/go.mod
rename to crates/gosub_css3/tools/generate_definitions/go.mod
diff --git a/crates/gosub_styling/tools/generate_definitions/main.go b/crates/gosub_css3/tools/generate_definitions/main.go
similarity index 98%
rename from crates/gosub_styling/tools/generate_definitions/main.go
rename to crates/gosub_css3/tools/generate_definitions/main.go
index 584d4fcba..64fae373c 100644
--- a/crates/gosub_styling/tools/generate_definitions/main.go
+++ b/crates/gosub_css3/tools/generate_definitions/main.go
@@ -21,7 +21,7 @@ const (
 
 const (
 	exportType      = Both
-	ResourcePath    = "crates/gosub_styling/resources/definitions"
+	ResourcePath    = "crates/gosub_css3/resources/definitions"
 	SingleFilePath  = ResourcePath + "/definitions.json"
 	MultiFileDir    = ResourcePath
 	MultiFilePrefix = "definitions_"
diff --git a/crates/gosub_styling/tools/generate_definitions/mdn/mdn.go b/crates/gosub_css3/tools/generate_definitions/mdn/mdn.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/mdn/mdn.go
rename to crates/gosub_css3/tools/generate_definitions/mdn/mdn.go
diff --git a/crates/gosub_styling/tools/generate_definitions/patch/patch_darwin.go b/crates/gosub_css3/tools/generate_definitions/patch/patch_darwin.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/patch/patch_darwin.go
rename to crates/gosub_css3/tools/generate_definitions/patch/patch_darwin.go
diff --git a/crates/gosub_styling/tools/generate_definitions/patch/patch_linux.go b/crates/gosub_css3/tools/generate_definitions/patch/patch_linux.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/patch/patch_linux.go
rename to crates/gosub_css3/tools/generate_definitions/patch/patch_linux.go
diff --git a/crates/gosub_styling/tools/generate_definitions/patch/patch_windows.go b/crates/gosub_css3/tools/generate_definitions/patch/patch_windows.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/patch/patch_windows.go
rename to crates/gosub_css3/tools/generate_definitions/patch/patch_windows.go
diff --git a/crates/gosub_styling/tools/generate_definitions/patch/patcher.go b/crates/gosub_css3/tools/generate_definitions/patch/patcher.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/patch/patcher.go
rename to crates/gosub_css3/tools/generate_definitions/patch/patcher.go
diff --git a/crates/gosub_styling/tools/generate_definitions/specs/specs.go b/crates/gosub_css3/tools/generate_definitions/specs/specs.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/specs/specs.go
rename to crates/gosub_css3/tools/generate_definitions/specs/specs.go
diff --git a/crates/gosub_styling/tools/generate_definitions/utils/stringmaybearray.go b/crates/gosub_css3/tools/generate_definitions/utils/stringmaybearray.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/utils/stringmaybearray.go
rename to crates/gosub_css3/tools/generate_definitions/utils/stringmaybearray.go
diff --git a/crates/gosub_styling/tools/generate_definitions/utils/types.go b/crates/gosub_css3/tools/generate_definitions/utils/types.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/utils/types.go
rename to crates/gosub_css3/tools/generate_definitions/utils/types.go
diff --git a/crates/gosub_styling/tools/generate_definitions/utils/utils.go b/crates/gosub_css3/tools/generate_definitions/utils/utils.go
similarity index 89%
rename from crates/gosub_styling/tools/generate_definitions/utils/utils.go
rename to crates/gosub_css3/tools/generate_definitions/utils/utils.go
index 3599e0866..fd2a06441 100644
--- a/crates/gosub_styling/tools/generate_definitions/utils/utils.go
+++ b/crates/gosub_css3/tools/generate_definitions/utils/utils.go
@@ -10,9 +10,9 @@ const (
 	REPO             = "w3c/webref"
 	LOCATION         = "ed/css"
 	PATCH_LOCATION   = "ed/csspatches"
-	CACHE_DIR        = "crates/gosub_styling/resources/cache"
+	CACHE_DIR        = "crates/gosub_css3/resources/cache"
 	CACHE_INDEX_FILE = CACHE_DIR + "/index/cache_index.json"
-	CUSTOM_PATCH_DIR = "crates/gosub_styling/resources/patches"
+	CUSTOM_PATCH_DIR = "crates/gosub_css3/resources/patches"
 	BRANCH           = "curated"
 )
 
diff --git a/crates/gosub_styling/tools/generate_definitions/webref/webref.go b/crates/gosub_css3/tools/generate_definitions/webref/webref.go
similarity index 100%
rename from crates/gosub_styling/tools/generate_definitions/webref/webref.go
rename to crates/gosub_css3/tools/generate_definitions/webref/webref.go
diff --git a/crates/gosub_html5/Cargo.toml b/crates/gosub_html5/Cargo.toml
index 25ec4762f..ce51b8e9c 100644
--- a/crates/gosub_html5/Cargo.toml
+++ b/crates/gosub_html5/Cargo.toml
@@ -15,8 +15,6 @@ thiserror = "1.0.64"
 url = { version = "2.5.2", features = [] }
 log = { version = "0.4.22", features = [] }
 
-
-
 [target.'cfg(not(target_arch = "wasm32"))'.dependencies]
 ureq = "2.10.1"
 
diff --git a/crates/gosub_html5/benches/tree_construction.rs b/crates/gosub_html5/benches/tree_construction.rs
index 077cf0aae..b118414d1 100644
--- a/crates/gosub_html5/benches/tree_construction.rs
+++ b/crates/gosub_html5/benches/tree_construction.rs
@@ -1,4 +1,7 @@
 use criterion::{criterion_group, criterion_main, Criterion};
+use gosub_css3::system::Css3System;
+use gosub_html5::document::document_impl::DocumentImpl;
+use gosub_html5::parser::Html5Parser;
 use gosub_testing::testing::tree_construction;
 use gosub_testing::testing::tree_construction::Harness;
 
@@ -8,8 +11,7 @@ fn criterion_benchmark(c: &mut Criterion) {
 
     // Careful about reading files inside the closure
     let filenames = Some(&["tests1.dat"][..]);
-    let fixtures =
-        tree_construction::fixture::read_fixtures(filenames).expect("problem loading fixtures");
+    let fixtures = tree_construction::fixture::read_fixtures(filenames).expect("problem loading fixtures");
 
     let mut harness = Harness::new();
 
@@ -18,7 +20,10 @@ fn criterion_benchmark(c: &mut Criterion) {
             for root in &fixtures {
                 for test in &root.tests {
                     for &scripting_enabled in test.script_modes() {
-                        let _ = harness.run_test(test.clone(), scripting_enabled);
+                        let _ = harness.run_test::<Html5Parser<DocumentImpl<Css3System>, Css3System>, Css3System>(
+                            test.clone(),
+                            scripting_enabled,
+                        );
                     }
                 }
             }
diff --git a/crates/gosub_html5/docs/parsing.md b/crates/gosub_html5/docs/parsing.md
index 04dc7631d..2eec449f6 100644
--- a/crates/gosub_html5/docs/parsing.md
+++ b/crates/gosub_html5/docs/parsing.md
@@ -16,14 +16,14 @@ Next, we need to create a document, which will be the main object that will be f
 data that is generated during the parsing of the HTML. This also includes any stylesheets that are found, both internally and externally.
     
 ```rust
-    let document = DocumentBuilder::new_document();
+    let doc_handle = DocumentBuilderImpl::new_document();
 ```
 
-Note that a document itself isn't a document, but a HANDLE to a document (a `DocumentHandle`). Once we have our document handle, we can start the parser
+Note that a doc_handle itself isn't a document, but a HANDLE to a document (a `DocumentHandle`). Once we have our document handle, we can start the parser
 by calling the `parse_document` method on the `Html5Parser` struct. This method will return a list of parse errors, if any. 
 
 ```rust
-    let parse_errors = Html5Parser::parse_document(&mut stream, Document::clone(&document), None)?;
+    let parse_errors = Html5Parser::parse_document(&mut stream, doc_handle.clone(), None)?;
 
     for e in parse_errors {
         println!("Parse Error: {}", e.message);
diff --git a/crates/gosub_html5/src/document.rs b/crates/gosub_html5/src/document.rs
new file mode 100644
index 000000000..6456d6b49
--- /dev/null
+++ b/crates/gosub_html5/src/document.rs
@@ -0,0 +1,5 @@
+pub mod builder;
+pub mod document_impl;
+pub mod fragment;
+pub mod query;
+pub mod task_queue;
diff --git a/crates/gosub_html5/src/document/builder.rs b/crates/gosub_html5/src/document/builder.rs
new file mode 100644
index 000000000..2cdd48dc3
--- /dev/null
+++ b/crates/gosub_html5/src/document/builder.rs
@@ -0,0 +1,55 @@
+use std::collections::HashMap;
+
+use gosub_shared::traits::css3::CssSystem;
+use url::Url;
+
+use crate::document::document_impl::DocumentImpl;
+use crate::node::HTML_NAMESPACE;
+use crate::DocumentHandle;
+use gosub_shared::traits::document::DocumentBuilder;
+use gosub_shared::traits::document::{Document, DocumentType};
+use gosub_shared::traits::node::{Node, QuirksMode};
+
+/// This struct will be used to create a fully initialized document or document fragment
+pub struct DocumentBuilderImpl {}
+
+impl<C: CssSystem> DocumentBuilder<C> for DocumentBuilderImpl {
+    type Document = DocumentImpl<C>;
+
+    /// Creates a new document with a document root node
+    fn new_document(url: Option<Url>) -> DocumentHandle<Self::Document, C> {
+        <Self::Document as Document<C>>::new(DocumentType::HTML, url, None)
+    }
+
+    /// Creates a new document fragment with the context as the root node
+    fn new_document_fragment(
+        context_node: &<Self::Document as Document<C>>::Node,
+        quirks_mode: QuirksMode,
+    ) -> DocumentHandle<Self::Document, C> {
+        let handle = context_node.handle();
+
+        // Create a new document with an HTML node as the root node
+        let fragment_root_node = <Self::Document as Document<C>>::new_element_node(
+            handle.clone(),
+            "html",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            context_node.location(),
+        );
+        let mut fragment_handle =
+            <Self::Document as Document<C>>::new(DocumentType::HTML, None, Some(fragment_root_node));
+
+        // let context_node = context_node.clone();
+        match quirks_mode {
+            QuirksMode::Quirks => {
+                fragment_handle.get_mut().set_quirks_mode(QuirksMode::Quirks);
+            }
+            QuirksMode::LimitedQuirks => {
+                fragment_handle.get_mut().set_quirks_mode(QuirksMode::LimitedQuirks);
+            }
+            _ => {}
+        }
+
+        fragment_handle
+    }
+}
diff --git a/crates/gosub_html5/src/document/document_impl.rs b/crates/gosub_html5/src/document/document_impl.rs
new file mode 100755
index 000000000..374677a9f
--- /dev/null
+++ b/crates/gosub_html5/src/document/document_impl.rs
@@ -0,0 +1,2277 @@
+use crate::DocumentHandle;
+use core::fmt::Debug;
+use gosub_shared::traits::document::{Document as OtherDocument, Document, DocumentType};
+use std::cell::RefCell;
+use std::collections::hash_map::Entry;
+use std::collections::HashMap;
+use std::fmt;
+use std::fmt::{Display, Formatter};
+use std::rc::Rc;
+use url::Url;
+
+use crate::document::builder::DocumentBuilderImpl;
+use crate::document::fragment::DocumentFragmentImpl;
+use crate::document::task_queue::is_valid_id_attribute_value;
+use crate::node::arena::NodeArena;
+use crate::node::data::comment::CommentData;
+use crate::node::data::doctype::DocTypeData;
+use crate::node::data::document::DocumentData;
+use crate::node::data::element::{ClassListImpl, ElementData};
+use crate::node::data::text::TextData;
+use crate::node::node_impl::{NodeDataTypeInternal, NodeImpl};
+use crate::node::visitor::Visitor;
+use gosub_shared::byte_stream::Location;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::node::Node;
+use gosub_shared::traits::node::QuirksMode;
+
+/// Defines a document
+#[derive(Debug)]
+pub struct DocumentImpl<C: CssSystem> {
+    // pub handle: Weak<DocumentHandle<Self>>,
+    /// URL of the given document (if any)
+    pub url: Option<Url>,
+    /// Holds and owns all nodes in the document
+    pub(crate) arena: NodeArena<NodeImpl<C>, C>,
+    /// HTML elements with ID (e.g., <div id="myid">)
+    named_id_elements: HashMap<String, NodeId>,
+    /// Document type of this document
+    pub doctype: DocumentType,
+    /// Quirks mode of this document
+    pub quirks_mode: QuirksMode,
+    /// Loaded stylesheets as extracted from the document
+    pub stylesheets: Vec<C::Stylesheet>,
+}
+
+impl<C: CssSystem> PartialEq for DocumentImpl<C> {
+    fn eq(&self, other: &Self) -> bool {
+        self.url == other.url
+            && self.arena == other.arena
+            && self.named_id_elements == other.named_id_elements
+            && self.doctype == other.doctype
+            && self.quirks_mode == other.quirks_mode
+            && self.stylesheets == other.stylesheets
+    }
+}
+
+impl<C: CssSystem> Document<C> for DocumentImpl<C> {
+    type Node = NodeImpl<C>;
+    type Fragment = DocumentFragmentImpl<C>;
+    type Builder = DocumentBuilderImpl;
+
+    /// Creates a new document without a doc handle
+    #[must_use]
+    fn new(document_type: DocumentType, url: Option<Url>, root_node: Option<Self::Node>) -> DocumentHandle<Self, C> {
+        let doc = Self {
+            url,
+            arena: NodeArena::new(),
+            named_id_elements: HashMap::new(),
+            doctype: document_type,
+            quirks_mode: QuirksMode::NoQuirks,
+            stylesheets: Vec::new(),
+        };
+
+        let mut doc_handle = DocumentHandle(Rc::new(RefCell::new(doc)), Default::default());
+
+        if let Some(node) = root_node {
+            doc_handle.get_mut().register_node(node);
+        } else {
+            let node = Self::Node::new_document(doc_handle.clone(), Location::default(), QuirksMode::NoQuirks);
+            doc_handle.get_mut().arena.register_node(node);
+        }
+
+        doc_handle
+    }
+
+    /// Returns the URL of the document, or "" when no location is set
+    fn url(&self) -> Option<Url> {
+        self.url.clone()
+    }
+
+    fn set_quirks_mode(&mut self, quirks_mode: QuirksMode) {
+        self.quirks_mode = quirks_mode;
+    }
+
+    fn quirks_mode(&self) -> QuirksMode {
+        self.quirks_mode
+    }
+
+    fn set_doctype(&mut self, doctype: DocumentType) {
+        self.doctype = doctype;
+    }
+
+    fn doctype(&self) -> DocumentType {
+        self.doctype
+    }
+
+    /// Fetches a node by id or returns None when no node with this ID is found
+    fn node_by_id(&self, node_id: NodeId) -> Option<&Self::Node> {
+        self.arena.node_ref(node_id)
+    }
+
+    fn node_by_named_id(&self, id: &str) -> Option<&Self::Node> {
+        self.named_id_elements
+            .get(id)
+            .and_then(|node_id| self.arena.node_ref(*node_id))
+    }
+
+    fn stylesheets(&self) -> &Vec<C::Stylesheet> {
+        &self.stylesheets
+    }
+
+    // /// Add given node to the named ID elements
+    // fn add_named_id(&mut self, id: &str, node_id: NodeId) {
+    //     self.named_id_elements.insert(id.to_string(), node_id);
+    // }
+    //
+    // /// Remove a named ID from the document
+    // fn remove_named_id(&mut self, id: &str) {
+    //     self.named_id_elements.remove(id);
+    // }
+
+    fn add_stylesheet(&mut self, stylesheet: C::Stylesheet) {
+        self.stylesheets.push(stylesheet);
+    }
+
+    /// returns the root node
+    fn get_root(&self) -> &Self::Node {
+        self.arena.node_ref(NodeId::root()).expect("Root node not found !?")
+    }
+
+    fn attach_node(&mut self, node_id: NodeId, parent_id: NodeId, position: Option<usize>) {
+        // Check if any children of node have parent as child. This will keep adding the node to itself
+        if parent_id == node_id || self.has_node_id_recursive(node_id, parent_id) {
+            return;
+        }
+
+        if let Some(parent_node) = self.node_by_id(parent_id) {
+            let mut parent_node = parent_node.clone();
+
+            // Make sure position can never be larger than the number of children in the parent
+            match position {
+                Some(position) => {
+                    if position > parent_node.children().len() {
+                        parent_node.push(node_id);
+                    } else {
+                        parent_node.insert(node_id, position);
+                    }
+                }
+                None => {
+                    // No position given, add to end of the children list
+                    parent_node.push(node_id);
+                }
+            }
+
+            self.update_node(parent_node);
+        }
+
+        let mut node = self.arena.node(node_id).unwrap();
+        node.parent = Some(parent_id);
+        self.update_node(node);
+    }
+
+    // /// returns the root node
+    // fn get_root_mut(&mut self) -> &mut Self::Node {
+    //     self.arena.node_mut(NodeId::root()).expect("Root node not found !?")
+    // }
+
+    fn detach_node(&mut self, node_id: NodeId) {
+        let parent = self.node_by_id(node_id).expect("node not found").parent_id();
+
+        if let Some(parent_id) = parent {
+            let mut parent_node = self.node_by_id(parent_id).expect("parent node not found").clone();
+            parent_node.remove(node_id);
+            self.update_node(parent_node);
+
+            let mut node = self.node_by_id(node_id).expect("node not found").clone();
+            node.set_parent(None);
+            self.update_node(node);
+        }
+    }
+
+    /// Relocates a node to another parent node
+    fn relocate_node(&mut self, node_id: NodeId, parent_id: NodeId) {
+        let node = self.arena.node_ref(node_id).unwrap();
+        assert!(node.registered, "Node is not registered to the arena");
+
+        if node.parent.is_some() && node.parent.unwrap() == parent_id {
+            // Nothing to do when we want to relocate to its own parent
+            return;
+        }
+
+        self.detach_node(node_id);
+        self.attach_node(node_id, parent_id, None);
+    }
+
+    fn update_node(&mut self, node: Self::Node) {
+        if !node.is_registered() {
+            log::warn!("Node is not registered to the arena");
+            return;
+        }
+
+        self.on_document_node_mutation(&node);
+        self.arena.update_node(node);
+    }
+
+    fn update_node_ref(&mut self, node: &Self::Node) {
+        if !node.is_registered() {
+            log::warn!("Node is not registered to the arena");
+            return;
+        }
+
+        self.on_document_node_mutation(node);
+        self.arena.update_node(node.clone());
+    }
+
+    /// Removes a node by id from the arena. Note that this does not check the nodelist itself to see
+    /// if the node is still available as a child or parent in the tree.
+    fn delete_node_by_id(&mut self, node_id: NodeId) {
+        let node = self.arena.node(node_id).unwrap();
+        let parent_id = node.parent_id();
+
+        if let Some(parent_id) = parent_id {
+            let mut parent = self.node_by_id(parent_id).unwrap().clone();
+            parent.remove(node_id);
+            self.update_node(parent);
+        }
+
+        self.arena.delete_node(node_id);
+    }
+
+    // /// Returns the parent node of the given node, or None when no parent is found
+    // fn parent_node(&self, node: &Self::Node) -> Option<&Self::Node> {
+    //     match node.parent_id() {
+    //         Some(parent_node_id) => self.node_by_id(parent_node_id),
+    //         None => None,
+    //     }
+    // }
+
+    /// Retrieves the next sibling NodeId (to the right) of the reference_node or None.
+    fn get_next_sibling(&self, reference_node: NodeId) -> Option<NodeId> {
+        let node = self.node_by_id(reference_node)?;
+        let parent = self.node_by_id(node.parent_id()?)?;
+
+        let idx = parent
+            .children()
+            .iter()
+            .position(|&child_id| child_id == reference_node)?;
+
+        let next_idx = idx + 1;
+        if parent.children().len() > next_idx {
+            return Some(parent.children()[next_idx]);
+        }
+
+        None
+    }
+
+    fn node_count(&self) -> usize {
+        self.arena.node_count()
+    }
+
+    fn peek_next_id(&self) -> NodeId {
+        self.arena.peek_next_id()
+    }
+
+    /// Register a node. It is not connected to anything yet, but it does receive a nodeId
+    fn register_node(&mut self, mut node: Self::Node) -> NodeId {
+        let node_id = self.arena.get_next_id();
+
+        node.set_id(node_id);
+
+        if node.is_element_node() {
+            let element_data = node.get_element_data_mut().unwrap();
+            element_data.node_id = Some(node_id);
+        }
+
+        self.on_document_node_mutation(&node);
+
+        self.arena.register_node_with_node_id(node, node_id);
+
+        node_id
+    }
+
+    /// Inserts a node to the parent node at the given position in the children (or none
+    /// to add at the end). Will automatically register the node if not done so already
+    fn register_node_at(&mut self, node: Self::Node, parent_id: NodeId, position: Option<usize>) -> NodeId {
+        self.on_document_node_mutation(&node);
+
+        let node_id = self.register_node(node);
+        self.attach_node(node_id, parent_id, position);
+
+        node_id
+    }
+
+    /// Creates a new document node
+    fn new_document_node(handle: DocumentHandle<Self, C>, quirks_mode: QuirksMode, location: Location) -> Self::Node {
+        NodeImpl::new(
+            handle.clone(),
+            location,
+            &NodeDataTypeInternal::Document(DocumentData::new(quirks_mode)),
+        )
+    }
+
+    fn new_doctype_node(
+        handle: DocumentHandle<Self, C>,
+        name: &str,
+        public_id: Option<&str>,
+        system_id: Option<&str>,
+        location: Location,
+    ) -> Self::Node {
+        NodeImpl::new(
+            handle.clone(),
+            location,
+            &NodeDataTypeInternal::DocType(DocTypeData::new(name, public_id.unwrap_or(""), system_id.unwrap_or(""))),
+        )
+    }
+
+    /// Creates a new comment node
+    fn new_comment_node(handle: DocumentHandle<Self, C>, comment: &str, location: Location) -> Self::Node {
+        NodeImpl::new(
+            handle.clone(),
+            location,
+            &NodeDataTypeInternal::Comment(CommentData::with_value(comment)),
+        )
+    }
+
+    /// Creates a new text node
+    fn new_text_node(handle: DocumentHandle<Self, C>, value: &str, location: Location) -> Self::Node {
+        NodeImpl::new(
+            handle.clone(),
+            location,
+            &NodeDataTypeInternal::Text(TextData::with_value(value)),
+        )
+    }
+
+    /// Creates a new element node
+    fn new_element_node(
+        handle: DocumentHandle<Self, C>,
+        name: &str,
+        namespace: Option<&str>,
+        attributes: HashMap<String, String>,
+        location: Location,
+    ) -> Self::Node {
+        // Extract class list from the class-attribute (if exists)
+        let class_list = match attributes.get("class") {
+            Some(class_value) => ClassListImpl::from(class_value.as_str()),
+            None => ClassListImpl::default(),
+        };
+
+        NodeImpl::new(
+            handle.clone(),
+            location,
+            &NodeDataTypeInternal::Element(ElementData::new(
+                handle.clone(),
+                name,
+                namespace,
+                attributes,
+                class_list,
+            )),
+        )
+    }
+
+    fn write(&self) -> String {
+        self.write_from_node(NodeId::root())
+    }
+
+    fn write_from_node(&self, _node_id: NodeId) -> String {
+        todo!(); //This should definitely be implemented
+    }
+
+    fn cloned_node_by_id(&self, node_id: NodeId) -> Option<Self::Node> {
+        self.arena.node(node_id)
+    }
+}
+
+impl<C: CssSystem> DocumentImpl<C> {
+    // Called whenever a node is being mutated in the document.
+    fn on_document_node_mutation(&mut self, node: &NodeImpl<C>) {
+        // self.on_document_node_mutation_update_id_in_node(node);
+        self.on_document_node_mutation_update_named_id(node);
+    }
+
+    /// Update document's named id structure when the node has ID elements
+    fn on_document_node_mutation_update_named_id(&mut self, node: &NodeImpl<C>) {
+        if !node.is_element_node() {
+            return;
+        }
+
+        let element_data = node.get_element_data().unwrap();
+        if let Some(id_value) = element_data.attributes.get("id") {
+            // When we have an ID attribute: update the named ID element map.
+            if is_valid_id_attribute_value(id_value) {
+                match self.named_id_elements.entry(id_value.clone()) {
+                    Entry::Vacant(entry) => {
+                        entry.insert(node.id());
+                    }
+                    Entry::Occupied(_) => {}
+                }
+            }
+        } else {
+            // If we don't have an ID attribute in the node, make sure that we remove and "old" id's that might be in the map.
+            self.named_id_elements.retain(|_, id| *id != node.id());
+        }
+    }
+
+    /// Print a node and all its children in a tree-like structure
+    pub fn print_tree(
+        &self,
+        node: &<DocumentImpl<C> as Document<C>>::Node,
+        prefix: String,
+        last: bool,
+        f: &mut Formatter,
+    ) {
+        let mut buffer = prefix.clone();
+        if last {
+            buffer.push_str("└─ ");
+        } else {
+            buffer.push_str("├─ ");
+        }
+        // buffer.push_str(format!("{} ", node.id).as_str());
+
+        match &node.data {
+            NodeDataTypeInternal::Document(_) => {
+                _ = writeln!(f, "{buffer}Document");
+            }
+            NodeDataTypeInternal::DocType(DocTypeData {
+                name,
+                pub_identifier,
+                sys_identifier,
+            }) => {
+                _ = writeln!(f, r#"{buffer}<!DOCTYPE {name} "{pub_identifier}" "{sys_identifier}">"#,);
+            }
+            NodeDataTypeInternal::Text(TextData { value, .. }) => {
+                _ = writeln!(f, r#"{buffer}"{value}""#);
+            }
+            NodeDataTypeInternal::Comment(CommentData { value, .. }) => {
+                _ = writeln!(f, "{buffer}<!-- {value} -->");
+            }
+            NodeDataTypeInternal::Element(element) => {
+                _ = write!(f, "{}<{}", buffer, element.name);
+                for (key, value) in &element.attributes {
+                    _ = write!(f, " {key}={value}");
+                }
+
+                // for (key, value) in node.style.borrow().iter() {
+                //     _ = write!(f, "[CSS: {key}={value}]");
+                // }
+
+                _ = writeln!(f, ">");
+            }
+        }
+
+        if prefix.len() > 40 {
+            _ = writeln!(f, "...");
+            return;
+        }
+
+        let mut buffer = prefix;
+        if last {
+            buffer.push_str("   ");
+        } else {
+            buffer.push_str("│  ");
+        }
+
+        let len = node.children.len();
+        for (i, child_id) in node.children.iter().enumerate() {
+            let child_node = self.node_by_id(*child_id).expect("Child not found");
+            self.print_tree(child_node, buffer.clone(), i == len - 1, f);
+        }
+    }
+}
+
+impl<C: CssSystem> Display for DocumentImpl<C> {
+    fn fmt(&self, f: &mut Formatter) -> fmt::Result {
+        let root = self.get_root();
+        self.print_tree(root, "".to_string(), true, f);
+        Ok(())
+    }
+}
+
+impl<C: CssSystem> DocumentImpl<C> {
+    /// Fetches a node by named id (string) or returns None when no node with this ID is found
+    pub fn get_node_by_named_id(&self, named_id: &str) -> Option<&<DocumentImpl<C> as Document<C>>::Node> {
+        let node_id = self.named_id_elements.get(named_id)?;
+        self.arena.node_ref(*node_id)
+    }
+
+    // /// Fetches a mutable node by named id (string) or returns None when no node with this ID is found
+    // pub fn get_node_by_named_id_mut<D>(
+    //     &mut self,
+    //     named_id: &str,
+    // ) -> Option<&mut <DocumentImpl<C> as Document<C>>::Node> {
+    //     let node_id = self.named_id_elements.get(named_id)?;
+    //     self.arena.node_mut(*node_id)
+    // }
+
+    // pub fn count_nodes(&self) -> usize {
+    //     self.arena.count_nodes()
+    // }
+
+    pub fn has_node_id_recursive(&self, parent_id: NodeId, target_node_id: NodeId) -> bool {
+        let parent = self.arena.node_ref(parent_id);
+        if parent.is_none() {
+            return false;
+        }
+
+        for child_node_id in parent.unwrap().children() {
+            if *child_node_id == target_node_id {
+                return true;
+            }
+            if self.has_node_id_recursive(*child_node_id, target_node_id) {
+                return true;
+            }
+        }
+
+        false
+    }
+
+    pub fn peek_next_id(&self) -> NodeId {
+        self.arena.peek_next_id()
+    }
+
+    pub fn nodes(&self) -> &HashMap<NodeId, <DocumentImpl<C> as Document<C>>::Node> {
+        self.arena.nodes()
+    }
+}
+
+// Walk the document tree with the given visitor
+pub fn walk_document_tree<C: CssSystem>(
+    handle: DocumentHandle<DocumentImpl<C>, C>,
+    visitor: &mut Box<dyn Visitor<<DocumentImpl<C> as Document<C>>::Node, C>>,
+) {
+    let binding = handle.get();
+    let root = binding.get_root();
+    internal_visit(handle.clone(), root, visitor);
+}
+
+fn internal_visit<C: CssSystem>(
+    handle: DocumentHandle<DocumentImpl<C>, C>,
+    node: &<DocumentImpl<C> as Document<C>>::Node,
+    visitor: &mut Box<dyn Visitor<<DocumentImpl<C> as Document<C>>::Node, C>>,
+) {
+    visitor.document_enter(node);
+
+    let binding = handle.get();
+    for child_id in node.children() {
+        let child = binding.node_by_id(*child_id).unwrap();
+        internal_visit(handle.clone(), child, visitor);
+    }
+    drop(binding);
+
+    // Leave node
+    visitor.document_leave(node);
+}
+
+/// Constructs an iterator from a given DocumentHandle.
+/// WARNING: mutations in the document would be reflected
+/// in the iterator. It's advised to consume the entire iterator
+/// before mutating the document again.
+pub struct TreeIterator<D: Document<C>, C: CssSystem> {
+    current_node_id: Option<NodeId>,
+    node_stack: Vec<NodeId>,
+    document: DocumentHandle<D, C>,
+}
+
+impl<D: Document<C>, C: CssSystem> TreeIterator<D, C> {
+    #[must_use]
+    pub fn new(doc: DocumentHandle<D, C>) -> Self {
+        let node_stack = vec![doc.get().get_root().id()];
+
+        Self {
+            current_node_id: None,
+            document: doc,
+            node_stack,
+        }
+    }
+}
+
+impl<D: Document<C>, C: CssSystem> Iterator for TreeIterator<D, C> {
+    type Item = NodeId;
+
+    fn next(&mut self) -> Option<NodeId> {
+        self.current_node_id = self.node_stack.pop();
+
+        if let Some(current_node_id) = self.current_node_id {
+            let doc_read = self.document.get();
+
+            if let Some(sibling_id) = self.document.get().get_next_sibling(current_node_id) {
+                self.node_stack.push(sibling_id);
+            }
+
+            if let Some(current_node) = doc_read.node_by_id(current_node_id) {
+                if let Some(&child_id) = current_node.children().first() {
+                    self.node_stack.push(child_id);
+                }
+            }
+        }
+
+        self.current_node_id
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::document::builder::DocumentBuilderImpl;
+    use crate::document::query::DocumentQuery;
+    use crate::document::task_queue::DocumentTaskQueue;
+    use crate::node::HTML_NAMESPACE;
+    use crate::parser::query::Query;
+    use crate::parser::tree_builder::TreeBuilder;
+    use gosub_css3::system::Css3System;
+    use gosub_shared::byte_stream::Location;
+    use gosub_shared::traits::document::DocumentBuilder;
+    use gosub_shared::traits::node::ClassList;
+    use gosub_shared::traits::node::ElementDataType;
+    use gosub_shared::traits::node::NodeType;
+    use std::collections::HashMap;
+
+    type Document = DocumentImpl<Css3System>;
+
+    #[test]
+    fn relocate() {
+        let mut doc_handle = DocumentBuilderImpl::new_document(None);
+
+        let parent_node = Document::new_element_node(
+            doc_handle.clone(),
+            "parent",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let node1 = Document::new_element_node(
+            doc_handle.clone(),
+            "div1",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let node2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div2",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let node3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div3",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let node3_1 = Document::new_element_node(
+            doc_handle.clone(),
+            "div3_1",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+
+        let parent_id = doc_handle.get_mut().register_node_at(parent_node, NodeId::root(), None);
+        let node1_id = doc_handle.get_mut().register_node_at(node1, parent_id, None);
+        let node2_id = doc_handle.get_mut().register_node_at(node2, parent_id, None);
+        let node3_id = doc_handle.get_mut().register_node_at(node3, parent_id, None);
+        let node3_1_id = doc_handle.get_mut().register_node_at(node3_1, node3_id, None);
+
+        assert_eq!(
+            format!("{}", doc_handle.get()),
+            r#"└─ Document
+   └─ <parent>
+      ├─ <div1>
+      ├─ <div2>
+      └─ <div3>
+         └─ <div3_1>
+"#
+        );
+
+        doc_handle.get_mut().relocate_node(node3_1_id, node1_id);
+        assert_eq!(
+            format!("{}", doc_handle.get()),
+            r#"└─ Document
+   └─ <parent>
+      ├─ <div1>
+      │  └─ <div3_1>
+      ├─ <div2>
+      └─ <div3>
+"#
+        );
+
+        doc_handle.get_mut().relocate_node(node1_id, node2_id);
+        assert_eq!(
+            format!("{}", doc_handle.get()),
+            r#"└─ Document
+   └─ <parent>
+      ├─ <div2>
+      │  └─ <div1>
+      │     └─ <div3_1>
+      └─ <div3>
+"#
+        );
+    }
+
+    #[test]
+    fn verify_node_ids_in_element_data() {
+        let mut doc_handle = DocumentBuilderImpl::new_document(None);
+
+        let node_1: NodeImpl<Css3System> = DocumentImpl::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let node_2: NodeImpl<Css3System> = DocumentImpl::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+
+        doc_handle.get_mut().register_node_at(node_1, NodeId::root(), None);
+        doc_handle.get_mut().register_node_at(node_2, NodeId::root(), None);
+
+        let binding = doc_handle.get();
+        let get_node1 = binding.node_by_id(NodeId::from(1usize)).unwrap();
+        let get_node2 = binding.node_by_id(NodeId::from(2usize)).unwrap();
+
+        let NodeDataTypeInternal::Element(_) = &get_node1.data else {
+            panic!()
+        };
+        assert_eq!(get_node1.id(), NodeId::from(1usize));
+
+        let NodeDataTypeInternal::Element(_) = &get_node2.data else {
+            panic!()
+        };
+        assert_eq!(get_node2.id(), NodeId::from(2usize));
+    }
+
+    #[test]
+    fn document_task_queue() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        // Using task queue to create the following structure initially:
+        // <div>
+        //   <p>
+        //     <!-- comment inside p -->
+        //     hey
+        //   </p>
+        //   <!-- comment inside div -->
+        // </div>
+
+        // then flush the queue and use it again to add an attribute to <p>:
+        // <p id="myid">hey</p>
+        let mut task_queue = DocumentTaskQueue::new(doc_handle.clone());
+
+        // NOTE: only elements return the ID
+        let div_id = task_queue.create_element("div", NodeId::root(), None, HTML_NAMESPACE, Location::default());
+        assert_eq!(div_id, NodeId::from(1usize));
+
+        let p_id = task_queue.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
+        assert_eq!(p_id, NodeId::from(2usize));
+
+        task_queue.create_comment("comment inside p", p_id, Location::default());
+        task_queue.create_text("hey", p_id, Location::default());
+        task_queue.create_comment("comment inside div", div_id, Location::default());
+
+        // at this point, the DOM should have NO nodes (besides root)
+        assert_eq!(doc_handle.get().node_count(), 1);
+
+        // validate our queue is loaded
+        assert!(!task_queue.is_empty());
+        let errors = task_queue.flush();
+        assert!(errors.is_empty());
+
+        // validate queue is empty
+        assert!(task_queue.is_empty());
+
+        // DOM should now have all our nodes
+        assert_eq!(doc_handle.get().arena.node_count(), 6);
+
+        // NOTE: these checks are scoped separately since this is using an
+        // immutable borrow, and we make a mutable borrow after (to insert the attribute).
+        // We need this immutable borrow to die off before making a new mutable borrow
+        // (and again an immutable borrow for validation afterward)
+        {
+            // validate DOM is correctly laid out
+            let doc_read = doc_handle.get();
+            let root = doc_read.get_root(); // <!DOCTYPE html>
+            let root_children = &root.children;
+
+            // div child
+            let div_child = doc_read.node_by_id(root_children[0]).unwrap();
+            assert_eq!(div_child.type_of(), NodeType::ElementNode);
+            assert_eq!(div_child.get_element_data().unwrap().name, "div");
+            let div_children = &div_child.children;
+
+            // p child
+            let p_child = doc_read.node_by_id(div_children[0]).unwrap();
+            assert_eq!(p_child.type_of(), NodeType::ElementNode);
+            assert_eq!(p_child.get_element_data().unwrap().name, "p");
+            let p_children = &p_child.children;
+
+            // comment inside p
+            let p_comment = doc_read.node_by_id(p_children[0]).unwrap();
+            assert_eq!(p_comment.type_of(), NodeType::CommentNode);
+            let NodeDataTypeInternal::Comment(p_comment_data) = &p_comment.data else {
+                panic!()
+            };
+            assert_eq!(p_comment_data.value, "comment inside p");
+
+            // body inside p
+            let p_body = doc_read.node_by_id(p_children[1]).unwrap();
+            assert_eq!(p_body.type_of(), NodeType::TextNode);
+            let NodeDataTypeInternal::Text(p_body_data) = &p_body.data else {
+                panic!()
+            };
+            assert_eq!(p_body_data.value, "hey");
+
+            // comment inside div
+            let div_comment = doc_read.node_by_id(div_children[1]).unwrap();
+            assert_eq!(div_comment.type_of(), NodeType::CommentNode);
+            let NodeDataTypeInternal::Comment(div_comment_data) = &div_comment.data else {
+                panic!()
+            };
+            assert_eq!(div_comment_data.value, "comment inside div");
+        }
+
+        // use task queue again to add an ID attribute
+        // NOTE: inserting attribute in task queue always succeeds
+        // since it doesn't touch DOM until flush
+        let _ = task_queue.insert_attribute("id", "myid", p_id, Location::default());
+        let errors = task_queue.flush();
+        println!("{:?}", errors);
+        assert!(errors.is_empty());
+
+        let doc_read = doc_handle.get();
+        // validate ID is searchable in dom
+        assert_eq!(*doc_read.named_id_elements.get("myid").unwrap(), p_id);
+
+        // validate attribute is applied to underlying element
+        let p_node = doc_read.node_by_id(p_id).unwrap();
+        let NodeDataTypeInternal::Element(p_element) = &p_node.data else {
+            panic!()
+        };
+        assert_eq!(p_element.attributes().get("id").unwrap(), "myid");
+    }
+
+    #[test]
+    fn task_queue_insert_attribute_failues() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            <DocumentBuilderImpl as DocumentBuilder<Css3System>>::new_document(None);
+
+        let mut task_queue = DocumentTaskQueue::new(doc_handle.clone());
+        let div_id = task_queue.create_element("div", NodeId::root(), None, HTML_NAMESPACE, Location::default());
+        task_queue.create_comment("content", div_id, Location::default()); // this is NodeId::from(2)
+        task_queue.flush();
+
+        // NOTE: inserting attribute in task queue always succeeds
+        // since it doesn't touch DOM until flush
+        let _ = task_queue.insert_attribute("id", "myid", NodeId::from(1usize), Location::default());
+        let _ = task_queue.insert_attribute("id", "myid", NodeId::from(2usize), Location::default());
+        let _ = task_queue.insert_attribute("id", "otherid", NodeId::from(2usize), Location::default());
+        let _ = task_queue.insert_attribute("id", "dummyid", NodeId::from(42usize), Location::default());
+        let _ = task_queue.insert_attribute("id", "my id", NodeId::from(1usize), Location::default());
+        let _ = task_queue.insert_attribute("id", "123", NodeId::from(1usize), Location::default());
+        let _ = task_queue.insert_attribute("id", "", NodeId::from(1usize), Location::default());
+        let errors = task_queue.flush();
+        for error in &errors {
+            println!("{}", error);
+        }
+        assert_eq!(errors.len(), 5);
+        assert_eq!(errors[0], "ID attribute value 'myid' already exists in DOM");
+        assert_eq!(errors[1], "Node id 2 is not an element");
+        assert_eq!(errors[2], "Node id 42 not found");
+        assert_eq!(errors[3], "ID attribute value 'my id' did not pass validation");
+        assert_eq!(errors[4], "ID attribute value '' did not pass validation");
+
+        // validate that invalid changes did not apply to DOM
+        let doc_read = doc_handle.get();
+        assert!(!doc_read.named_id_elements.contains_key("my id"));
+        assert!(!doc_read.named_id_elements.contains_key(""));
+    }
+
+    // this is basically a replica of document_task_queue() test
+    // but using tree builder directly instead of the task queue
+    #[test]
+    fn document_tree_builder() {
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            <DocumentBuilderImpl as DocumentBuilder<Css3System>>::new_document(None);
+
+        // Using tree builder to create the following structure:
+        // <div>
+        //   <p id="myid">
+        //     <!-- comment inside p -->
+        //     hey
+        //   </p>
+        //   <!-- comment inside div -->
+        // </div>
+
+        // NOTE: only elements return the ID
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+        assert_eq!(div_id, NodeId::from(1usize));
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id, None);
+        assert_eq!(p_id, NodeId::from(2usize));
+
+        let node = Document::new_comment_node(doc_handle.clone(), "comment inside p", Location::default());
+        doc_handle.get_mut().register_node_at(node, p_id, None);
+
+        let node = Document::new_text_node(doc_handle.clone(), "hey", Location::default());
+        doc_handle.get_mut().register_node_at(node, p_id, None);
+
+        let node = Document::new_comment_node(doc_handle.clone(), "comment inside div", Location::default());
+        doc_handle.get_mut().register_node_at(node, div_id, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("id", "myid");
+        }
+        binding.update_node(node);
+        // binding.add_named_id("myid", p_id);
+        drop(binding);
+
+        // DOM should now have all our nodes
+        assert_eq!(doc_handle.get().node_count(), 6);
+
+        // validate DOM is correctly laid out
+        let doc_read = doc_handle.get();
+        let root = doc_read.get_root(); // <!DOCTYPE html>
+        let root_children = &root.children;
+
+        // div child
+        let div_child = doc_read.node_by_id(root_children[0]).unwrap();
+        assert_eq!(div_child.type_of(), NodeType::ElementNode);
+        assert_eq!(div_child.get_element_data().unwrap().name, "div");
+        let div_children = &div_child.children;
+
+        // p child
+        let p_child = doc_read.node_by_id(div_children[0]).unwrap();
+        assert_eq!(p_child.type_of(), NodeType::ElementNode);
+        assert_eq!(p_child.get_element_data().unwrap().name, "p");
+        let p_children = &p_child.children;
+
+        // comment inside p
+        let p_comment = doc_read.node_by_id(p_children[0]).unwrap();
+        assert_eq!(p_comment.type_of(), NodeType::CommentNode);
+        let NodeDataTypeInternal::Comment(p_comment_data) = &p_comment.data else {
+            panic!()
+        };
+        assert_eq!(p_comment_data.value, "comment inside p");
+
+        // body inside p
+        let p_body = doc_read.node_by_id(p_children[1]).unwrap();
+        assert_eq!(p_body.type_of(), NodeType::TextNode);
+        let NodeDataTypeInternal::Text(p_body_data) = &p_body.data else {
+            panic!()
+        };
+        assert_eq!(p_body_data.value, "hey");
+
+        // comment inside div
+        let div_comment = doc_read.node_by_id(div_children[1]).unwrap();
+        assert_eq!(div_comment.type_of(), NodeType::CommentNode);
+        let NodeDataTypeInternal::Comment(div_comment_data) = &div_comment.data else {
+            panic!()
+        };
+        assert_eq!(div_comment_data.value, "comment inside div");
+
+        // validate ID is searchable in dom
+        assert_eq!(*doc_read.named_id_elements.get("myid").unwrap(), p_id);
+
+        // validate attribute is applied to underlying element
+        let p_node = doc_read.node_by_id(p_id).unwrap();
+        let NodeDataTypeInternal::Element(p_element) = &p_node.data else {
+            panic!()
+        };
+        assert_eq!(p_element.attributes().get("id").unwrap(), "myid");
+    }
+
+    #[test]
+    fn insert_generic_attribute() {
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            <DocumentBuilderImpl as DocumentBuilder<Css3System>>::new_document(None);
+
+        let node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let node_id = doc_handle.get_mut().register_node_at(node, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(node_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("key", "value");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let doc_read = doc_handle.get();
+        let Some(data) = doc_read.node_by_id(node_id).unwrap().get_element_data() else {
+            panic!()
+        };
+        assert_eq!(data.attributes().get("key").unwrap(), "value");
+    }
+
+    #[test]
+    fn task_queue_insert_generic_attribute() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            <DocumentBuilderImpl as DocumentBuilder<Css3System>>::new_document(None);
+
+        let mut task_queue = DocumentTaskQueue::new(doc_handle.clone());
+        let div_id = task_queue.create_element("div", NodeId::root(), None, HTML_NAMESPACE, Location::default());
+        let _ = task_queue.insert_attribute("key", "value", div_id, Location::default());
+        let errors = task_queue.flush();
+        assert!(errors.is_empty());
+        let doc_read = doc_handle.get();
+        let NodeDataTypeInternal::Element(element) = &doc_read.node_by_id(div_id).unwrap().data else {
+            panic!()
+        };
+        assert_eq!(element.attributes().get("key").unwrap(), "value");
+    }
+
+    #[test]
+    fn insert_class_attribute() {
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            <DocumentBuilderImpl as DocumentBuilder<Css3System>>::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(div_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "one two three");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let binding = doc_handle.get();
+        let NodeDataTypeInternal::Element(element_data) = &binding.node_by_id(div_id).unwrap().data else {
+            panic!()
+        };
+        assert!(element_data.classlist().contains("one"));
+        assert!(element_data.classlist().contains("two"));
+        assert!(element_data.classlist().contains("three"));
+    }
+
+    #[test]
+    fn task_queue_insert_class_attribute() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let mut task_queue = DocumentTaskQueue::new(doc_handle.clone());
+        let div_id = task_queue.create_element("div", NodeId::root(), None, HTML_NAMESPACE, Location::default());
+        let _ = task_queue.insert_attribute("class", "one two three", div_id, Location::default());
+        let errors = task_queue.flush();
+        println!("{:?}", errors);
+        assert!(errors.is_empty());
+
+        let binding = doc_handle.get();
+        let element = binding.node_by_id(div_id).unwrap().get_element_data().unwrap();
+
+        assert!(element.classlist().contains("one"));
+        assert!(element.classlist().contains("two"));
+        assert!(element.classlist().contains("three"));
+    }
+
+    #[test]
+    fn uninitialized_query() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let query = Query::new();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query);
+        if let Err(err) = found_ids {
+            assert_eq!(
+                err.to_string(),
+                "query: generic error: Query predicate is uninitialized"
+            );
+        } else {
+            panic!()
+        }
+    }
+
+    #[test]
+    fn single_query_equals_tag_find_first() {
+        // <div>
+        //     <div>
+        //         <p>
+        //     <p>
+        // <div>
+        //     <p>
+        // <p>
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_3, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        doc_handle.get_mut().register_node_at(p_node, NodeId::root(), None);
+
+        let query = Query::new().equals_tag("p").find_first();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 1);
+        assert_eq!(found_ids, [p_id]);
+    }
+
+    #[test]
+    fn single_query_equals_tag_find_all() {
+        // <div>
+        //     <div>
+        //         <p>
+        //     <p>
+        // <div>
+        //     <p>
+        // <p>
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let p_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_2 = doc_handle.get_mut().register_node_at(p_node_2, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_3 = doc_handle.get_mut().register_node_at(p_node_3, div_id_3, None);
+
+        let p_node_4 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_4 = doc_handle.get_mut().register_node_at(p_node_4, NodeId::root(), None);
+
+        let query = Query::new().equals_tag("p").find_all();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 4);
+        assert_eq!(found_ids, [p_id, p_id_2, p_id_3, p_id_4]);
+    }
+
+    #[test]
+    fn single_query_equals_id() {
+        // <div>
+        //     <div>
+        //         <p>
+        //     <p id="myid">
+        // <div>
+        //     <p>
+        // <p>
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let p_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_2 = doc_handle.get_mut().register_node_at(p_node_2, div_id, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_2).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("id", "myid");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_3, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, NodeId::root(), None);
+
+        let query = Query::new().equals_id("myid").find_first();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 1);
+        assert_eq!(found_ids, [p_id_2]);
+    }
+
+    #[test]
+    fn single_query_contains_class_find_first() {
+        // <div>
+        //     <div>
+        //         <p class="one two">
+        //     <p class="one">
+        // <div>
+        //     <p class="two three">
+        // <p class="three">
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "one two");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node_2, div_id, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(div_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "one");
+            data.add_attribute("id", "myid");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_3 = doc_handle.get_mut().register_node_at(p_node_3, div_id_3, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_3).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "two_tree");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node_4 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_4 = doc_handle.get_mut().register_node_at(p_node_4, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_4).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "three");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let query = Query::new().contains_class("two").find_first();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 1);
+        assert_eq!(found_ids, [p_id]);
+    }
+
+    #[test]
+    fn single_query_contains_class_find_all() {
+        // <div>
+        //     <div>
+        //         <p class="one two">
+        //     <p class="one">
+        // <div>
+        //     <p class="two three">
+        // <p class="three">
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "one two");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_2 = doc_handle.get_mut().register_node_at(p_node_2, div_id, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_2).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "one");
+            data.add_attribute("id", "myid");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_3 = doc_handle.get_mut().register_node_at(p_node_3, div_id_3, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_3).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "two three");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node_4 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_4 = doc_handle.get_mut().register_node_at(p_node_4, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_4).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("class", "three");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let query = Query::new().contains_class("two").find_all();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 2);
+        assert_eq!(found_ids, [p_id, p_id_3]);
+    }
+
+    #[test]
+    fn single_query_contains_attribute_find_first() {
+        // <div>
+        //     <div id="myid" style="somestyle">
+        //         <p title="hey">
+        //     <p>
+        // <div style="otherstyle" id="otherid">
+        //     <p>
+        // <p title="yo" style="cat">
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(div_id_2).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("id", "myid");
+            data.add_attribute("style", "somestyle");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("title", "key");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(div_id_3).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("style", "otherstyle");
+            data.add_attribute("id", "otherid");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_3, None);
+
+        let p_node_4 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_4 = doc_handle.get_mut().register_node_at(p_node_4, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_4).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("title", "yo");
+            data.add_attribute("style", "cat");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let query = Query::new().contains_attribute("style").find_first();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 1);
+        assert_eq!(found_ids, [div_id_2]);
+    }
+
+    #[test]
+    fn single_query_contains_attribute_find_all() {
+        // <div>
+        //     <div id="myid" style="somestyle">
+        //         <p title="hey">
+        //     <p>
+        // <div style="otherstyle" id="otherid">
+        //     <p>
+        // <p title="yo" style="cat">
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(div_id_2).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("id", "myid");
+            data.add_attribute("style", "somestyle");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("title", "key");
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(div_id_3).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("style", "otherstyle");
+            data.add_attribute("id", "otherid");
+
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_3, None);
+
+        let p_node_4 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_4 = doc_handle.get_mut().register_node_at(p_node_4, NodeId::root(), None);
+
+        let mut binding = doc_handle.get_mut();
+        let mut node = binding.cloned_node_by_id(p_id_4).unwrap();
+        if let Some(data) = node.get_element_data_mut() {
+            data.add_attribute("title", "yo");
+            data.add_attribute("style", "cat");
+
+            binding.update_node(node);
+        }
+        drop(binding);
+
+        let query = Query::new().contains_attribute("style").find_all();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 3);
+        assert_eq!(found_ids, [div_id_2, div_id_3, p_id_4]);
+    }
+
+    #[test]
+    fn single_query_contains_child_find_first() {
+        // <div>
+        //     <div>
+        //         <p>
+        //     <p>
+        // <div>
+        //     <p>
+        // <p>
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_3, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, NodeId::root(), None);
+
+        let query = Query::new().contains_child_tag("p").find_first();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 1);
+        assert_eq!(found_ids, [NodeId::root()]);
+    }
+
+    #[test]
+    fn single_query_contains_child_find_all() {
+        // <div>
+        //     <div>
+        //         <p>
+        //     <p>
+        // <div>
+        //     <p>
+        // <p>
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_3, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, NodeId::root(), None);
+
+        let query = Query::new().contains_child_tag("p").find_all();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 4);
+        assert_eq!(found_ids, [NodeId::root(), div_id, div_id_2, div_id_3]);
+    }
+
+    #[test]
+    fn single_query_has_parent_find_first() {
+        // <div>
+        //     <div>
+        //         <p>
+        //     <p>
+        // <div>
+        //     <p>
+        // <p>
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, div_id_3, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, NodeId::root(), None);
+
+        let query = Query::new().has_parent_tag("div").find_first();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 1);
+        assert_eq!(found_ids, [div_id_2]);
+    }
+
+    #[test]
+    fn single_query_has_parent_find_all() {
+        // <div>
+        //     <div>
+        //         <p>
+        //     <p>
+        // <div>
+        //     <p>
+        // <p>
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let p_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_2 = doc_handle.get_mut().register_node_at(p_node_2, div_id, None);
+
+        let div_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_3 = doc_handle.get_mut().register_node_at(div_node_3, NodeId::root(), None);
+
+        let p_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_3 = doc_handle.get_mut().register_node_at(p_node_3, div_id_3, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let _ = doc_handle.get_mut().register_node_at(p_node, NodeId::root(), None);
+
+        let query = Query::new().has_parent_tag("div").find_all();
+        let found_ids = DocumentQuery::query(doc_handle.clone(), &query).unwrap();
+        assert_eq!(found_ids.len(), 4);
+        assert_eq!(found_ids, [div_id_2, p_id, p_id_2, p_id_3]);
+    }
+
+    #[test]
+    fn tree_iterator() {
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        // <div>
+        //     <div>
+        //         <p>first p tag
+        //         <p>second p tag
+        //     <p>third p tag
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, div_id, None);
+
+        let p_node = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id = doc_handle.get_mut().register_node_at(p_node, div_id_2, None);
+
+        let text_node = Document::new_text_node(doc_handle.clone(), "first p tag", Location::default());
+        let text_id = doc_handle.get_mut().register_node_at(text_node, p_id, None);
+
+        let p_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_2 = doc_handle.get_mut().register_node_at(p_node_2, div_id_2, None);
+
+        let text_node_2 = Document::new_text_node(doc_handle.clone(), "second p tag", Location::default());
+        let text_id_2 = doc_handle.get_mut().register_node_at(text_node_2, p_id_2, None);
+        let p_node_3 = Document::new_element_node(
+            doc_handle.clone(),
+            "p",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let p_id_3 = doc_handle.get_mut().register_node_at(p_node_3, div_id, None);
+
+        let text_node_3 = Document::new_text_node(doc_handle.clone(), "third p tag", Location::default());
+        let text_id_3 = doc_handle.get_mut().register_node_at(text_node_3, p_id_3, None);
+
+        let tree_iterator = TreeIterator::new(doc_handle.clone());
+
+        let expected_order = vec![
+            NodeId::root(),
+            div_id,
+            div_id_2,
+            p_id,
+            text_id,
+            p_id_2,
+            text_id_2,
+            p_id_3,
+            text_id_3,
+        ];
+
+        let mut traversed_nodes = Vec::new();
+        for current_node_id in tree_iterator {
+            traversed_nodes.push(current_node_id);
+        }
+
+        assert_eq!(expected_order, traversed_nodes);
+    }
+
+    #[test]
+    fn tree_iterator_mutation() {
+        let mut doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> =
+            DocumentBuilderImpl::new_document(None);
+
+        let div_node = Document::new_element_node(
+            doc_handle.clone(),
+            "div",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id = doc_handle.get_mut().register_node_at(div_node, NodeId::root(), None);
+
+        let mut tree_iterator = TreeIterator::new(doc_handle.clone());
+        let mut current_node_id;
+
+        current_node_id = tree_iterator.next();
+        assert_eq!(current_node_id.unwrap(), NodeId::root());
+
+        // we mutate the tree while the iterator is still "open"
+        let div_node_2 = Document::new_element_node(
+            doc_handle.clone(),
+            "div_1",
+            Some(HTML_NAMESPACE),
+            HashMap::new(),
+            Location::default(),
+        );
+        let div_id_2 = doc_handle.get_mut().register_node_at(div_node_2, NodeId::root(), None);
+
+        current_node_id = tree_iterator.next();
+        assert_eq!(current_node_id.unwrap(), div_id);
+
+        // and find this node on next iteration
+        current_node_id = tree_iterator.next();
+        assert_eq!(current_node_id.unwrap(), div_id_2);
+    }
+}
diff --git a/crates/gosub_html5/src/document/fragment.rs b/crates/gosub_html5/src/document/fragment.rs
new file mode 100644
index 000000000..4853a3803
--- /dev/null
+++ b/crates/gosub_html5/src/document/fragment.rs
@@ -0,0 +1,63 @@
+use crate::DocumentHandle;
+use core::fmt;
+use core::fmt::Debug;
+
+use crate::document::document_impl::DocumentImpl;
+use crate::node::arena::NodeArena;
+use crate::node::node_impl::NodeImpl;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::DocumentFragment;
+
+/// Defines a document fragment which can be attached to for instance a <template> element
+#[derive(PartialEq)]
+pub struct DocumentFragmentImpl<C: CssSystem> {
+    /// Node elements inside this fragment
+    arena: NodeArena<NodeImpl<C>, C>,
+    /// Document handle of the parent
+    pub handle: DocumentHandle<DocumentImpl<C>, C>,
+    /// Host node on which this fragment is attached
+    host: NodeId,
+}
+
+impl<C: CssSystem> Clone for DocumentFragmentImpl<C> {
+    /// Clones the document fragment
+    fn clone(&self) -> Self {
+        Self {
+            arena: self.arena.clone(),
+            handle: self.handle.clone(),
+            host: self.host,
+        }
+    }
+}
+
+impl<C: CssSystem> Debug for DocumentFragmentImpl<C> {
+    fn fmt(&self, f: &mut fmt::Formatter) -> fmt::Result {
+        write!(f, "DocumentFragment")
+    }
+}
+
+impl<C: CssSystem> DocumentFragmentImpl<C> {
+    /// Creates a new document fragment and attaches it to "host" node inside "handle"
+    #[must_use]
+    pub(crate) fn new(handle: DocumentHandle<DocumentImpl<C>, C>, host: NodeId) -> Self {
+        Self {
+            arena: NodeArena::new(),
+            handle,
+            host,
+        }
+    }
+}
+
+impl<C: CssSystem> DocumentFragment<C> for DocumentFragmentImpl<C> {
+    type Document = DocumentImpl<C>;
+
+    /// Returns the document handle for this document
+    fn handle(&self) -> DocumentHandle<Self::Document, C> {
+        self.handle.clone()
+    }
+
+    fn new(handle: DocumentHandle<Self::Document, C>, node_id: NodeId) -> Self {
+        Self::new(handle, node_id)
+    }
+}
diff --git a/crates/gosub_html5/src/document/query.rs b/crates/gosub_html5/src/document/query.rs
new file mode 100644
index 000000000..8983f746e
--- /dev/null
+++ b/crates/gosub_html5/src/document/query.rs
@@ -0,0 +1,125 @@
+use crate::document::document_impl::TreeIterator;
+use crate::errors::Error;
+use crate::parser::query::{Condition, Query, SearchType};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::node::ClassList;
+use gosub_shared::traits::node::ElementDataType;
+use gosub_shared::traits::node::Node;
+
+pub struct DocumentQuery<D: Document<C>, C: CssSystem> {
+    _phantom: std::marker::PhantomData<(D, C)>,
+}
+
+impl<D: Document<C>, C: CssSystem> DocumentQuery<D, C> {
+    /// Perform a single query against the document.
+    /// If query search type is uninitialized, returns an error.
+    /// Otherwise, returns a vector of NodeIds that match the predicate in tree order (preorder depth-first.)
+    pub fn query(doc_handle: DocumentHandle<D, C>, query: &Query) -> gosub_shared::types::Result<Vec<NodeId>> {
+        if query.search_type == SearchType::Uninitialized {
+            return Err(Error::Query("Query predicate is uninitialized".to_owned()).into());
+        }
+
+        let tree_iterator = TreeIterator::new(doc_handle.clone());
+
+        let mut found_ids = Vec::new();
+        for current_node_id in tree_iterator {
+            let mut predicate_result: bool = true;
+            for condition in &query.conditions {
+                if !Self::matches_query_condition(doc_handle.clone(), &current_node_id, condition) {
+                    predicate_result = false;
+                    break;
+                }
+            }
+
+            if predicate_result {
+                found_ids.push(current_node_id);
+                if query.search_type == SearchType::FindFirst {
+                    return Ok(found_ids);
+                }
+            }
+        }
+
+        Ok(found_ids)
+    }
+
+    /// Check if a given node's children contain a certain tag name
+    pub fn contains_child_tag(doc_handle: DocumentHandle<D, C>, node_id: NodeId, tag: &str) -> bool {
+        if let Some(node) = doc_handle.get().node_by_id(node_id) {
+            for child_id in &node.children().to_vec() {
+                if let Some(child) = doc_handle.get().node_by_id(*child_id) {
+                    if let Some(data) = child.get_element_data() {
+                        if data.name() == tag {
+                            return true;
+                        }
+                    }
+                }
+            }
+        }
+
+        false
+    }
+
+    fn matches_query_condition(
+        doc_handle: DocumentHandle<D, C>,
+        current_node_id: &NodeId,
+        condition: &Condition,
+    ) -> bool {
+        let binding = doc_handle.get();
+        let Some(current_node) = binding.node_by_id(*current_node_id) else {
+            return false;
+        };
+
+        match condition {
+            Condition::EqualsTag(tag) => {
+                let Some(current_node_data) = current_node.get_element_data() else {
+                    return false;
+                };
+                current_node_data.name() == *tag
+            }
+            Condition::EqualsId(id) => {
+                let Some(current_node_data) = current_node.get_element_data() else {
+                    return false;
+                };
+
+                if let Some(id_attr) = current_node_data.attributes().get("id") {
+                    return *id_attr == *id;
+                }
+
+                false
+            }
+            Condition::ContainsClass(class_name) => {
+                let Some(current_node_data) = current_node.get_element_data() else {
+                    return false;
+                };
+
+                return current_node_data.classlist().contains(class_name);
+            }
+            Condition::ContainsAttribute(attribute) => {
+                let Some(current_node_data) = current_node.get_element_data() else {
+                    return false;
+                };
+
+                return current_node_data.attributes().contains_key(attribute);
+            }
+            Condition::ContainsChildTag(child_tag) => {
+                Self::contains_child_tag(doc_handle.clone(), current_node.id(), child_tag)
+            }
+            Condition::HasParentTag(parent_tag) => {
+                if let Some(parent_id) = current_node.parent_id() {
+                    // making an assumption here that the parent node is actually valid
+                    let parent = binding.node_by_id(parent_id).unwrap();
+                    if let Some(parent_data) = parent.get_element_data() {
+                        return parent_data.name() == *parent_tag;
+                    } else {
+                        return false;
+                    }
+                }
+
+                false
+            }
+        }
+    }
+}
diff --git a/crates/gosub_html5/src/document/task_queue.rs b/crates/gosub_html5/src/document/task_queue.rs
new file mode 100644
index 000000000..7f7b0daa9
--- /dev/null
+++ b/crates/gosub_html5/src/document/task_queue.rs
@@ -0,0 +1,235 @@
+use crate::DocumentHandle;
+use gosub_shared::traits::document::Document;
+use std::collections::HashMap;
+
+use crate::parser::tree_builder::TreeBuilder;
+use gosub_shared::byte_stream::Location;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::node::{ElementDataType, Node};
+use gosub_shared::types::Result;
+
+/// Enum of tasks that can be performed to add or
+/// update nodes in the tree.
+///
+/// These tasks are generated by a TreeBuilder which is implemented
+/// by DocumentTaskQueue which holds a handle to the actual Document
+/// to commit changes to.
+pub enum DocumentTask {
+    CreateElement {
+        name: String,
+        namespace: String,
+        parent_id: NodeId,
+        position: Option<usize>,
+        location: Location,
+    },
+    CreateText {
+        content: String,
+        parent_id: NodeId,
+        location: Location,
+    },
+    CreateComment {
+        content: String,
+        parent_id: NodeId,
+        location: Location,
+    },
+    InsertAttribute {
+        key: String,
+        value: String,
+        element_id: NodeId,
+        location: Location,
+    },
+}
+
+/// Queue of tasks that will mutate the document to add/update
+/// nodes in the tree. These tasks are performed sequentially in the
+/// order they are created.
+///
+/// Once tasks are queued up, a call to flush() will commit all changes
+/// to the DOM. If there are errors during the application of these changes,
+/// flush() will return a list of the errors encountered but execution is not halted.
+///
+/// create_element() will generate and return a new NodeId for the parser to keep
+/// track of the current context node and optionally store this in a list of open elements.
+/// When encountering a closing tag, the parser must pop this ID off of its list.
+pub struct DocumentTaskQueue<D: Document<C>, C: CssSystem> {
+    /// Internal counter of the next ID to generate from the NodeArena
+    /// without actually registering the node.
+    /// WARNING: if nodes are registered in the arena while tasks are being queued
+    /// this could lead to conflicts in NodeIds. NodeArena should NOT be used directly
+    /// if using a DocumentTaskQueue.
+    #[allow(dead_code)]
+    next_node_id: NodeId,
+    /// Reference to the document to commit changes to
+    pub(crate) doc_handle: DocumentHandle<D, C>,
+    /// List of tasks to commit upon flush() which is cleared after execution finishes.
+    // IMPLEMENTATION NOTE: using a vec here since I'm assuming we are
+    // executing all tasks at once. If we need to support stopping task
+    // execution midway, then maybe a real "queue" structure that pops
+    // completed tasks is needed.
+    pub(crate) tasks: Vec<DocumentTask>,
+}
+
+impl<D: Document<C>, C: CssSystem> DocumentTaskQueue<D, C> {
+    pub fn is_empty(&self) -> bool {
+        self.tasks.is_empty()
+    }
+
+    pub fn flush(&mut self) -> Vec<String> {
+        let mut errors = Vec::new();
+
+        for current_task in &self.tasks {
+            match current_task {
+                DocumentTask::CreateElement {
+                    name,
+                    namespace,
+                    parent_id,
+                    position,
+                    location,
+                } => {
+                    let node = D::new_element_node(
+                        self.doc_handle.clone(),
+                        name,
+                        Some(namespace),
+                        HashMap::new(),
+                        *location,
+                    );
+                    self.doc_handle.get_mut().register_node_at(node, *parent_id, *position);
+                }
+                DocumentTask::CreateText {
+                    content,
+                    parent_id,
+                    location,
+                } => {
+                    let node = D::new_text_node(self.doc_handle.clone(), content, *location);
+                    self.doc_handle.get_mut().register_node_at(node, *parent_id, None);
+                }
+                DocumentTask::CreateComment {
+                    content,
+                    parent_id,
+                    location,
+                } => {
+                    let node = D::new_comment_node(self.doc_handle.clone(), content, *location);
+                    self.doc_handle.get_mut().register_node_at(node, *parent_id, None);
+                }
+                DocumentTask::InsertAttribute {
+                    key, value, element_id, ..
+                } => {
+                    // Invalid ID value?
+                    if key == "id" && !is_valid_id_attribute_value(value) {
+                        errors.push(format!("ID attribute value '{value}' did not pass validation"));
+                        continue;
+                    }
+
+                    // An ID must be tied to only one element
+                    let binding = self.doc_handle.get();
+                    let named_node = binding.node_by_named_id(value);
+                    if named_node.is_some() && named_node.unwrap().id() != *element_id {
+                        errors.push(format!("ID attribute value '{value}' already exists in DOM"));
+                        continue;
+                    }
+                    drop(binding);
+
+                    let mut binding = self.doc_handle.get_mut();
+                    let Some(node) = binding.node_by_id(*element_id) else {
+                        errors.push(format!("Node id {} not found", element_id));
+                        continue;
+                    };
+
+                    if !node.is_element_node() {
+                        errors.push(format!("Node id {} is not an element", element_id));
+                        continue;
+                    }
+
+                    let mut node = node.clone();
+
+                    let element_data = node.get_element_data_mut().unwrap();
+                    element_data.add_attribute(key, value);
+
+                    binding.update_node(node);
+                }
+            }
+        }
+        self.tasks.clear();
+
+        errors
+    }
+}
+
+/// according to HTML spec: https://html.spec.whatwg.org/#global-attributes
+pub(crate) fn is_valid_id_attribute_value(value: &str) -> bool {
+    !(value.is_empty() || value.contains(|ref c| char::is_ascii_whitespace(c)))
+}
+
+// See tree_builder.rs for method comments
+impl<D: Document<C>, C: CssSystem> TreeBuilder for DocumentTaskQueue<D, C> {
+    fn create_element(
+        &mut self,
+        name: &str,
+        parent_id: NodeId,
+        position: Option<usize>,
+        namespace: &str,
+        location: Location,
+    ) -> NodeId {
+        let element = DocumentTask::CreateElement {
+            name: name.to_owned(),
+            parent_id,
+            position,
+            namespace: namespace.to_owned(),
+            location,
+        };
+        let new_id = self.next_node_id;
+        self.next_node_id = self.next_node_id.next();
+        self.tasks.push(element);
+
+        new_id
+    }
+
+    fn create_text(&mut self, content: &str, parent_id: NodeId, location: Location) -> NodeId {
+        let text = DocumentTask::CreateText {
+            content: content.to_owned(),
+            parent_id,
+            location,
+        };
+        let new_id = self.next_node_id;
+        self.next_node_id = self.next_node_id.next();
+        self.tasks.push(text);
+
+        new_id
+    }
+
+    fn create_comment(&mut self, content: &str, parent_id: NodeId, location: Location) -> NodeId {
+        let comment = DocumentTask::CreateComment {
+            content: content.to_owned(),
+            parent_id,
+            location,
+        };
+        let new_id = self.next_node_id;
+        self.next_node_id = self.next_node_id.next();
+        self.tasks.push(comment);
+
+        new_id
+    }
+
+    fn insert_attribute(&mut self, key: &str, value: &str, element_id: NodeId, location: Location) -> Result<()> {
+        let attribute = DocumentTask::InsertAttribute {
+            key: key.to_owned(),
+            value: value.to_owned(),
+            element_id,
+            location,
+        };
+        self.tasks.push(attribute);
+        Ok(())
+    }
+}
+
+impl<D: Document<C>, C: CssSystem> DocumentTaskQueue<D, C> {
+    pub fn new(doc_handle: DocumentHandle<D, C>) -> Self {
+        let next_node_id = doc_handle.get().peek_next_id();
+        Self {
+            next_node_id,
+            doc_handle: doc_handle.clone(),
+            tasks: Vec::new(),
+        }
+    }
+}
diff --git a/crates/gosub_html5/src/element_class.rs b/crates/gosub_html5/src/element_class.rs
deleted file mode 100644
index 3951e58c4..000000000
--- a/crates/gosub_html5/src/element_class.rs
+++ /dev/null
@@ -1,159 +0,0 @@
-use std::collections::HashMap;
-
-#[derive(Debug, Clone, PartialEq)]
-pub struct ElementClass {
-    /// a map of classes applied to an HTML element.
-    /// key = name, value = is_active
-    /// the is_active is used to toggle a class (JavaScript API)
-    class_map: HashMap<String, bool>,
-}
-
-impl Default for ElementClass {
-    fn default() -> Self {
-        Self::new()
-    }
-}
-
-impl ElementClass {
-    /// Initialise a new (empty) ElementClass
-    #[must_use]
-    pub fn new() -> Self {
-        Self {
-            class_map: HashMap::new(),
-        }
-    }
-
-    /// Count the number of classes (active or inactive)
-    /// assigned to an element
-    pub fn len(&self) -> usize {
-        self.class_map.len()
-    }
-
-    /// Check if any classes are present
-    pub fn is_empty(&self) -> bool {
-        self.class_map.is_empty()
-    }
-
-    /// Check if class name exists
-    pub fn contains(&self, name: &str) -> bool {
-        self.class_map.contains_key(name)
-    }
-
-    /// Add a new class (if already exists, does nothing)
-    pub fn add(&mut self, name: &str) {
-        // by default, adding a new class will be active.
-        // however, map.insert will update a key if it exists
-        // and we don't want to overwrite an inactive class to make it active unintentionally
-        // so we ignore this operation if the class already exists
-        if !self.contains(name) {
-            self.class_map.insert(name.to_owned(), true);
-        }
-    }
-
-    /// Remove a class (does nothing if not exists)
-    pub fn remove(&mut self, name: &str) {
-        self.class_map.remove(name);
-    }
-
-    /// Toggle a class active/inactive. Does nothing if class doesn't exist
-    pub fn toggle(&mut self, name: &str) {
-        if let Some(is_active) = self.class_map.get_mut(name) {
-            *is_active = !*is_active;
-        }
-    }
-
-    /// Set explicitly if a class is active or not. Does nothing if class doesn't exist
-    pub fn set_active(&mut self, name: &str, is_active: bool) {
-        if let Some(is_active_item) = self.class_map.get_mut(name) {
-            *is_active_item = is_active;
-        }
-    }
-
-    /// Check if a class is active. Returns false if class doesn't exist
-    pub fn is_active(&self, name: &str) -> bool {
-        if let Some(is_active) = self.class_map.get(name) {
-            return *is_active;
-        }
-
-        false
-    }
-}
-
-/// Initialize a class from a class string
-/// with space-delimited class names
-impl From<&str> for ElementClass {
-    fn from(class_string: &str) -> Self {
-        let class_map_local = class_string
-            .split_whitespace()
-            .map(|class| (class.to_owned(), true))
-            .collect::<HashMap<String, bool>>();
-
-        ElementClass {
-            class_map: class_map_local,
-        }
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::*;
-
-    #[test]
-    fn is_empty() {
-        let mut classes = ElementClass::new();
-        assert!(classes.is_empty());
-        classes.add("one");
-        assert!(!classes.is_empty());
-    }
-
-    #[test]
-    fn count_classes() {
-        let mut classes = ElementClass::new();
-        classes.add("one");
-        classes.add("two");
-        assert_eq!(classes.len(), 2);
-    }
-
-    #[test]
-    fn contains_nonexistant_class() {
-        let classes = ElementClass::new();
-        assert!(!classes.contains("nope"));
-    }
-
-    #[test]
-    fn contains_valid_class() {
-        let mut classes = ElementClass::new();
-        classes.add("yep");
-        assert!(classes.contains("yep"));
-    }
-
-    #[test]
-    fn add_class() {
-        let mut classes = ElementClass::new();
-        classes.add("yep");
-        assert!(classes.is_active("yep"));
-
-        classes.set_active("yep", false);
-        classes.add("yep"); // should be ignored
-        assert!(!classes.is_active("yep"));
-    }
-
-    #[test]
-    fn remove_class() {
-        let mut classes = ElementClass::new();
-        classes.add("yep");
-        classes.remove("yep");
-        assert!(!classes.contains("yep"));
-    }
-
-    #[test]
-    fn toggle_class() {
-        let mut classes = ElementClass::new();
-        classes.add("yep");
-        assert!(classes.is_active("yep"));
-        classes.toggle("yep");
-        assert!(!classes.is_active("yep"));
-        classes.toggle("yep");
-        assert!(classes.is_active("yep"));
-    }
-}
diff --git a/crates/gosub_html5/src/lib.rs b/crates/gosub_html5/src/lib.rs
index 3fb4b1238..ed7d501dd 100644
--- a/crates/gosub_html5/src/lib.rs
+++ b/crates/gosub_html5/src/lib.rs
@@ -2,29 +2,31 @@
 //!
 //! The parser's job is to take a stream of bytes and turn it into a DOM tree. The parser is
 //! implemented as a state machine and runs in the current thread.
-use crate::parser::document::{Document, DocumentBuilder, DocumentHandle};
+use crate::document::builder::DocumentBuilderImpl;
+use crate::document::document_impl::DocumentImpl;
 use crate::parser::Html5Parser;
 use gosub_shared::byte_stream::{ByteStream, Encoding};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::DocumentBuilder as _;
 
+pub mod document;
 pub mod dom;
-pub mod element_class;
-pub mod error_logger;
-mod errors;
+pub mod errors;
 pub mod node;
 pub mod parser;
 pub mod tokenizer;
-pub mod util;
-pub mod visit;
+#[allow(dead_code)]
 pub mod writer;
 
 /// Parses the given HTML string and returns a handle to the resulting DOM tree.
-pub fn html_compile(html: &str) -> DocumentHandle {
+pub fn html_compile<C: CssSystem>(html: &str) -> DocumentHandle<DocumentImpl<C>, C> {
     let mut stream = ByteStream::new(Encoding::UTF8, None);
     stream.read_from_str(html, Some(Encoding::UTF8));
     stream.close();
 
-    let document = DocumentBuilder::new_document(None);
-    let _ = Html5Parser::parse_document(&mut stream, Document::clone(&document), None);
+    let doc_handle = DocumentBuilderImpl::new_document(None);
+    let _ = Html5Parser::parse_document(&mut stream, doc_handle.clone(), None);
 
-    document
+    doc_handle
 }
diff --git a/crates/gosub_html5/src/node.rs b/crates/gosub_html5/src/node.rs
index 25b0d34c7..135689721 100644
--- a/crates/gosub_html5/src/node.rs
+++ b/crates/gosub_html5/src/node.rs
@@ -1,16 +1,3 @@
-use crate::node::data::comment::CommentData;
-use crate::node::data::doctype::DocTypeData;
-use crate::node::data::document::DocumentData;
-use crate::node::data::element::ElementData;
-use crate::node::data::text::TextData;
-use crate::parser::document::{Document, DocumentHandle};
-use core::fmt::Debug;
-use derive_more::Display;
-use gosub_shared::byte_stream::Location;
-use std::cell::RefCell;
-use std::collections::HashMap;
-use std::rc::Weak;
-
 pub const HTML_NAMESPACE: &str = "http://www.w3.org/1999/xhtml";
 pub const MATHML_NAMESPACE: &str = "http://www.w3.org/1998/Math/MathML";
 pub const SVG_NAMESPACE: &str = "http://www.w3.org/2000/svg";
@@ -20,719 +7,6 @@ pub const XMLNS_NAMESPACE: &str = "http://www.w3.org/2000/xmlns/";
 
 pub mod arena;
 pub mod data;
-
-/// Different types of nodes
-#[derive(Debug, PartialEq)]
-pub enum NodeType {
-    Document,
-    DocType,
-    Text,
-    Comment,
-    Element,
-}
-
-/// Different type of node data
-#[derive(Debug, Clone, PartialEq)]
-pub enum NodeData {
-    /// Represents a document
-    Document(DocumentData),
-    // Represents a doctype
-    DocType(DocTypeData),
-    /// Represents a text
-    Text(TextData),
-    /// Represents a comment
-    Comment(CommentData),
-    /// Represents an element
-    Element(Box<ElementData>),
-}
-
-/// Id used to identify a node
-#[derive(Clone, Copy, Debug, Default, Display, Eq, Hash, PartialEq, PartialOrd)]
-pub struct NodeId(pub(crate) usize);
-
-impl From<NodeId> for usize {
-    /// Converts a NodeId into a usize
-    fn from(value: NodeId) -> Self {
-        value.0
-    }
-}
-
-impl From<usize> for NodeId {
-    /// Converts a usize into a NodeId
-    fn from(value: usize) -> Self {
-        Self(value)
-    }
-}
-
-impl From<u64> for NodeId {
-    /// Converts a u64 into a NodeId
-    fn from(value: u64) -> Self {
-        Self(value as usize)
-    }
-}
-
-impl From<NodeId> for u64 {
-    /// Converts a NodeId into a u64
-    fn from(value: NodeId) -> Self {
-        value.0 as u64
-    }
-}
-
-impl Default for &NodeId {
-    /// Returns the default NodeId, which is 0
-    fn default() -> Self {
-        &NodeId(0)
-    }
-}
-
-impl NodeId {
-    // TODO: Drop Default derive and only use 0 for the root, or choose another id for the root
-    pub const ROOT_NODE: usize = 0;
-
-    /// Returns the root node ID
-    pub fn root() -> Self {
-        Self(Self::ROOT_NODE)
-    }
-
-    /// Returns true when this nodeId is the root node
-    pub fn is_root(&self) -> bool {
-        self.0 == Self::ROOT_NODE
-    }
-
-    /// Returns the next node ID
-    #[must_use]
-    pub fn next(&self) -> Self {
-        if self.0 == usize::MAX {
-            return Self(usize::MAX);
-        }
-
-        Self(self.0 + 1)
-    }
-
-    /// Returns the nodeID as usize
-    pub fn as_usize(&self) -> usize {
-        self.0
-    }
-
-    /// Returns the previous node ID
-    #[must_use]
-    pub fn prev(&self) -> Self {
-        if self.0 == 0 {
-            return Self::root();
-        }
-
-        Self(self.0 - 1)
-    }
-}
-
-/// Node structure that resembles a DOM node
-pub struct Node {
-    /// ID of the node, 0 is always the root / document node
-    pub id: NodeId,
-    /// parent of the node, if any
-    pub parent: Option<NodeId>,
-    /// children of the node
-    pub children: Vec<NodeId>,
-    /// name of the node, or empty when it's not a tag
-    pub name: String,
-    /// namespace of the node
-    pub namespace: Option<String>,
-    /// actual data of the node
-    pub data: NodeData,
-    /// weak pointer to document this node is attached to
-    pub document: Weak<RefCell<Document>>,
-    // Returns true when the given node is registered into an arena
-    pub is_registered: bool,
-    // Location of the node in the source code
-    pub location: Location,
-}
-
-impl Node {
-    pub fn is_root(&self) -> bool {
-        self.id.is_root()
-    }
-}
-
-impl PartialEq for Node {
-    fn eq(&self, other: &Node) -> bool {
-        self.id == other.id
-    }
-}
-
-impl Debug for Node {
-    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
-        let mut debug = f.debug_struct("Node");
-        debug.field("id", &self.id);
-        debug.field("parent", &self.parent);
-        debug.field("children", &self.children);
-        debug.field("name", &self.name);
-        match &self.namespace {
-            Some(namespace) if namespace == HTML_NAMESPACE => debug.field("namespace", &"HTML"),
-            Some(namespace) if namespace == XML_NAMESPACE => debug.field("namespace", &"XML"),
-            Some(namespace) if namespace == XMLNS_NAMESPACE => debug.field("namespace", &"XMLNS"),
-            Some(namespace) if namespace == MATHML_NAMESPACE => debug.field("namespace", &"MATHML"),
-            Some(namespace) if namespace == SVG_NAMESPACE => debug.field("namespace", &"SVG"),
-            Some(namespace) if namespace == XLINK_NAMESPACE => debug.field("namespace", &"XLINK"),
-            None => debug.field("namespace", &"None"),
-            _ => debug.field("namespace", &"unknown"),
-        };
-        debug.field("data", &self.data);
-        debug.finish_non_exhaustive()
-    }
-}
-
-impl Clone for Node {
-    fn clone(&self) -> Self {
-        Node {
-            id: self.id,
-            parent: self.parent,
-            children: self.children.clone(),
-            name: self.name.clone(),
-            namespace: self.namespace.clone(),
-            data: self.data.clone(),
-            document: Weak::clone(&self.document),
-            is_registered: self.is_registered,
-            location: self.location.clone(),
-        }
-    }
-}
-
-impl Node {
-    /// create a new `Node`
-    #[must_use]
-    pub fn new(data: NodeData, document: &DocumentHandle, location: Location) -> Self {
-        let (id, parent, children, name, namespace, is_registered) = <_>::default();
-        Self {
-            id,
-            parent,
-            children,
-            data,
-            name,
-            namespace,
-            document: document.to_weak(),
-            is_registered,
-            location,
-        }
-    }
-
-    /// Create a new document node
-    #[must_use]
-    pub fn new_document(document: &DocumentHandle, location: Location) -> Self {
-        Self::new(NodeData::Document(DocumentData::new()), document, location)
-    }
-
-    #[must_use]
-    pub fn new_doctype(
-        document: &DocumentHandle,
-        name: &str,
-        pub_identifier: &str,
-        sys_identifier: &str,
-        loc: Location,
-    ) -> Self {
-        Self::new(
-            NodeData::DocType(DocTypeData::new(name, pub_identifier, sys_identifier)),
-            document,
-            loc,
-        )
-    }
-
-    /// Create a new element node with the given name and attributes and namespace
-    #[must_use]
-    pub fn new_element(
-        document: &DocumentHandle,
-        name: &str,
-        attributes: HashMap<String, String>,
-        namespace: &str,
-        location: Location,
-    ) -> Self {
-        Self {
-            name: name.to_owned(),
-            namespace: Some(namespace.into()),
-            ..Self::new(
-                NodeData::Element(Box::new(ElementData::with_name_and_attributes(
-                    NodeId::default(),
-                    name,
-                    attributes,
-                ))),
-                document,
-                location,
-            )
-        }
-    }
-
-    /// Creates a new comment node
-    #[must_use]
-    pub fn new_comment(document: &DocumentHandle, location: Location, value: &str) -> Self {
-        Self::new(
-            NodeData::Comment(CommentData::with_value(value)),
-            document,
-            location,
-        )
-    }
-
-    /// Creates a new text node
-    #[must_use]
-    pub fn new_text(document: &DocumentHandle, location: Location, value: &str) -> Self {
-        Self::new(
-            NodeData::Text(TextData::with_value(value)),
-            document,
-            location,
-        )
-    }
-
-    /// Returns true if the given node is a "formatting" node
-    pub fn is_formatting(&self) -> bool {
-        self.namespace == Some(HTML_NAMESPACE.into())
-            && FORMATTING_HTML_ELEMENTS.contains(&self.name.as_str())
-    }
-
-    /// Returns true if the given node is "special" node based on the namespace and name
-    pub fn is_special(&self) -> bool {
-        if self.namespace == Some(HTML_NAMESPACE.into())
-            && SPECIAL_HTML_ELEMENTS.contains(&self.name.as_str())
-        {
-            return true;
-        }
-        if self.namespace == Some(MATHML_NAMESPACE.into())
-            && SPECIAL_MATHML_ELEMENTS.contains(&self.name.as_str())
-        {
-            return true;
-        }
-        if self.namespace == Some(SVG_NAMESPACE.into())
-            && SPECIAL_SVG_ELEMENTS.contains(&self.name.as_str())
-        {
-            return true;
-        }
-
-        false
-    }
-
-    /// Returns true if this node is registered into an arena
-    pub fn is_registered(&self) -> bool {
-        self.is_registered
-    }
-
-    /// This will only compare against the tag, namespace and data same except element data.
-    /// for element data compaare against the tag, namespace and attributes without order.
-    /// Both nodes could still have other parents and children.
-    pub fn matches_tag_and_attrs_without_order(&self, other: &Self) -> bool {
-        if self.name != other.name || self.namespace != other.namespace {
-            return false;
-        }
-
-        if self.type_of() != other.type_of() {
-            return false;
-        }
-
-        match self.type_of() {
-            NodeType::Element => {
-                let mut self_attributes = None;
-                let mut other_attributes = None;
-                if let NodeData::Element(element) = &self.data {
-                    self_attributes = Some(element.attributes.clone());
-                }
-                if let NodeData::Element(element) = &other.data {
-                    other_attributes = Some(element.attributes.clone());
-                }
-                self_attributes.eq(&other_attributes)
-            }
-            _ => self.data == other.data,
-        }
-    }
-
-    /// Returns true when the given node is of the given namespace
-    pub fn is_namespace(&self, namespace: &str) -> bool {
-        self.namespace == Some(namespace.into())
-    }
-
-    /// Returns true if the given node is a html integration point
-    /// See: https://html.spec.whatwg.org/multipage/parsing.html#html-integration-point
-    pub(crate) fn is_html_integration_point(&self) -> bool {
-        let namespace = self.namespace.clone().unwrap_or_default();
-
-        if namespace == MATHML_NAMESPACE && self.name == "annotation-xml" {
-            if let NodeData::Element(element) = &self.data {
-                if let Some(value) = element.attributes.get("encoding") {
-                    if value.eq_ignore_ascii_case("text/html") {
-                        return true;
-                    }
-                    if value.eq_ignore_ascii_case("application/xhtml+xml") {
-                        return true;
-                    }
-                }
-            }
-        }
-
-        namespace == SVG_NAMESPACE
-            && ["foreignObject", "desc", "title"].contains(&self.name.as_str())
-    }
-
-    /// Returns true if the given node is a mathml integration point
-    /// See: https://html.spec.whatwg.org/multipage/parsing.html#mathml-text-integration-point
-    pub(crate) fn is_mathml_integration_point(&self) -> bool {
-        let namespace = self.namespace.clone().unwrap_or_default();
-
-        namespace == MATHML_NAMESPACE
-            && ["mi", "mo", "mn", "ms", "mtext"].contains(&self.name.as_str())
-    }
-
-    /// Returns true if the node is an element node
-    pub fn is_element(&self) -> bool {
-        if let NodeData::Element(_) = &self.data {
-            return true;
-        }
-
-        false
-    }
-
-    pub fn is_text(&self) -> bool {
-        if let NodeData::Text(_) = &self.data {
-            return true;
-        }
-
-        false
-    }
-
-    pub fn as_text(&self) -> &TextData {
-        if let NodeData::Text(text) = &self.data {
-            return text;
-        }
-
-        panic!("Node is not a text");
-    }
-
-    pub fn as_element(&self) -> &ElementData {
-        if let NodeData::Element(element) = &self.data {
-            return element;
-        }
-
-        panic!("Node is not an element");
-    }
-
-    pub fn as_element_mut(&mut self) -> &mut ElementData {
-        if let NodeData::Element(ref mut element) = self.data {
-            element
-        } else {
-            panic!("Node is not an element");
-        }
-    }
-
-    /// Returns true when the given attribute has been set on the node
-    pub fn has_attribute(&self, name: &str) -> bool {
-        if let NodeData::Element(element) = &self.data {
-            return element.attributes.contains_key(name);
-        }
-
-        false
-    }
-
-    /// Returns the given attribute value or None when the attribute is not found
-    pub fn get_attribute(&self, name: &str) -> Option<&String> {
-        if let NodeData::Element(element) = &self.data {
-            return element.attributes.get(name);
-        }
-
-        None
-    }
-}
-
-pub trait NodeTrait {
-    /// Returns the token type of the given token
-    fn type_of(&self) -> NodeType;
-}
-
-// Each node implements the NodeTrait and has a type_of that will return the node type.
-impl NodeTrait for Node {
-    /// Returns the token type of the given token
-    fn type_of(&self) -> NodeType {
-        match self.data {
-            NodeData::Document { .. } => NodeType::Document,
-            NodeData::DocType { .. } => NodeType::DocType,
-            NodeData::Text { .. } => NodeType::Text,
-            NodeData::Comment { .. } => NodeType::Comment,
-            NodeData::Element { .. } => NodeType::Element,
-        }
-    }
-}
-
-/// HTML elements that are considered formatting elements
-pub static FORMATTING_HTML_ELEMENTS: [&str; 14] = [
-    "a", "b", "big", "code", "em", "font", "i", "nobr", "s", "small", "strike", "strong", "tt", "u",
-];
-
-/// HTML elements that are considered special elements
-pub static SPECIAL_HTML_ELEMENTS: [&str; 83] = [
-    "address",
-    "applet",
-    "area",
-    "article",
-    "aside",
-    "base",
-    "basefont",
-    "bgsound",
-    "blockquote",
-    "body",
-    "br",
-    "button",
-    "caption",
-    "center",
-    "col",
-    "colgroup",
-    "dd",
-    "details",
-    "dir",
-    "div",
-    "dl",
-    "dt",
-    "embed",
-    "fieldset",
-    "figcaption",
-    "figure",
-    "footer",
-    "form",
-    "frame",
-    "frameset",
-    "h1",
-    "h2",
-    "h3",
-    "h4",
-    "h5",
-    "h6",
-    "head",
-    "header",
-    "hgroup",
-    "hr",
-    "html",
-    "iframe",
-    "img",
-    "input",
-    "keygen",
-    "li",
-    "link",
-    "listing",
-    "main",
-    "marquee",
-    "menu",
-    "meta",
-    "nav",
-    "noembed",
-    "noframes",
-    "noscript",
-    "object",
-    "ol",
-    "p",
-    "param",
-    "plaintext",
-    "pre",
-    "script",
-    "search",
-    "section",
-    "select",
-    "source",
-    "style",
-    "summary",
-    "table",
-    "tbody",
-    "td",
-    "template",
-    "textarea",
-    "tfoot",
-    "th",
-    "thead",
-    "title",
-    "tr",
-    "track",
-    "ul",
-    "wbr",
-    "xmp",
-];
-
-/// MathML elements that are considered special elements
-pub static SPECIAL_MATHML_ELEMENTS: [&str; 6] = ["mi", "mo", "mn", "ms", "mtext", "annotation-xml"];
-
-/// SVG elements that are considered special elements
-pub static SPECIAL_SVG_ELEMENTS: [&str; 3] = ["foreignObject", "desc", "title"];
-
-#[cfg(test)]
-mod tests {
-    use super::*;
-    use crate::parser::document::Document;
-
-    #[test]
-    fn new_document() {
-        let document = Document::shared(None);
-        let node = Node::new_document(&document, Location::default());
-        assert_eq!(node.id, NodeId::default());
-        assert_eq!(node.parent, None);
-        assert!(node.children.is_empty());
-        assert_eq!(node.name, "".to_string());
-        assert_eq!(node.namespace, None);
-        match &node.data {
-            NodeData::Document(_) => (),
-            _ => panic!(),
-        }
-    }
-
-    #[test]
-    fn new_element() {
-        let mut attributes = HashMap::new();
-        attributes.insert("id".to_string(), "test".to_string());
-        let document = Document::shared(None);
-        let node = Node::new_element(
-            &document,
-            "div",
-            attributes.clone(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        assert_eq!(node.id, NodeId::default());
-        assert_eq!(node.parent, None);
-        assert!(node.children.is_empty());
-        assert_eq!(node.name, "div".to_string());
-        assert_eq!(node.namespace, Some(HTML_NAMESPACE.into()));
-        let NodeData::Element(element) = &node.data else {
-            panic!()
-        };
-        assert_eq!(element.name, "div");
-        assert!(element.attributes.contains_key("id"));
-        assert_eq!(element.attributes.get("id").unwrap(), "test");
-    }
-
-    #[test]
-    fn new_comment() {
-        let document = Document::shared(None);
-        let node = Node::new_comment(&document, Location::default(), "test");
-        assert_eq!(node.id, NodeId::default());
-        assert_eq!(node.parent, None);
-        assert!(node.children.is_empty());
-        assert_eq!(node.name, "".to_string());
-        assert_eq!(node.namespace, None);
-        let NodeData::Comment(CommentData { value, .. }) = &node.data else {
-            panic!()
-        };
-        assert_eq!(value, "test");
-    }
-
-    #[test]
-    fn new_text() {
-        let document = Document::shared(None);
-        let node = Node::new_text(&document, Location::default(), "test");
-        assert_eq!(node.id, NodeId::default());
-        assert_eq!(node.parent, None);
-        assert!(node.children.is_empty());
-        assert_eq!(node.name, "".to_string());
-        assert_eq!(node.namespace, None);
-        let NodeData::Text(TextData { value }) = &node.data else {
-            panic!()
-        };
-        assert_eq!(value, "test");
-    }
-
-    #[test]
-    fn is_special() {
-        let mut attributes = HashMap::new();
-        attributes.insert("id".to_string(), "test".to_string());
-        let document = Document::shared(None);
-        let node = Node::new_element(
-            &document,
-            "div",
-            attributes,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        assert!(node.is_special());
-    }
-
-    #[test]
-    fn type_of() {
-        let document = Document::shared(None);
-        let node = Node::new_document(&document, Location::default());
-        assert_eq!(node.type_of(), NodeType::Document);
-        let node = Node::new_text(&document, Location::default(), "test");
-        assert_eq!(node.type_of(), NodeType::Text);
-        let node = Node::new_comment(&document, Location::default(), "test");
-        assert_eq!(node.type_of(), NodeType::Comment);
-        let mut attributes = HashMap::new();
-        attributes.insert("id".to_string(), "test".to_string());
-        let node = Node::new_element(
-            &document,
-            "div",
-            attributes,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        assert_eq!(node.type_of(), NodeType::Element);
-    }
-
-    #[test]
-    fn special_html_elements() {
-        let document = Document::shared(None);
-        for element in SPECIAL_HTML_ELEMENTS.iter() {
-            let mut attributes = HashMap::new();
-            attributes.insert("id".to_string(), "test".to_string());
-            let node = Node::new_element(
-                &document,
-                element,
-                attributes,
-                HTML_NAMESPACE,
-                Location::default(),
-            );
-            assert!(node.is_special());
-        }
-    }
-
-    #[test]
-    fn special_mathml_elements() {
-        let document = Document::shared(None);
-        for element in SPECIAL_MATHML_ELEMENTS.iter() {
-            let mut attributes = HashMap::new();
-            attributes.insert("id".to_string(), "test".to_string());
-            let node = Node::new_element(
-                &document,
-                element,
-                attributes,
-                MATHML_NAMESPACE,
-                Location::default(),
-            );
-            assert!(node.is_special());
-        }
-    }
-
-    #[test]
-    fn special_svg_elements() {
-        let document = Document::shared(None);
-        for element in SPECIAL_SVG_ELEMENTS.iter() {
-            let mut attributes = HashMap::new();
-            attributes.insert("id".to_string(), "test".to_string());
-            let node = Node::new_element(
-                &document,
-                element,
-                attributes,
-                SVG_NAMESPACE,
-                Location::default(),
-            );
-            assert!(node.is_special());
-        }
-    }
-
-    #[test]
-    fn type_of_node() {
-        let document = Document::shared(None);
-        let node = Node::new_document(&document, Location::default());
-        assert_eq!(node.type_of(), NodeType::Document);
-        let node = Node::new_text(&document, Location::default(), "test");
-        assert_eq!(node.type_of(), NodeType::Text);
-        let node = Node::new_comment(&document, Location::default(), "test");
-        assert_eq!(node.type_of(), NodeType::Comment);
-        let mut attributes = HashMap::new();
-        attributes.insert("id".to_string(), "test".to_string());
-        let node = Node::new_element(
-            &document,
-            "div",
-            attributes,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        assert_eq!(node.type_of(), NodeType::Element);
-    }
-}
+mod elements;
+pub mod node_impl;
+pub mod visitor;
diff --git a/crates/gosub_html5/src/node/arena.rs b/crates/gosub_html5/src/node/arena.rs
index 2d13b58b2..c5a96b9f2 100644
--- a/crates/gosub_html5/src/node/arena.rs
+++ b/crates/gosub_html5/src/node/arena.rs
@@ -1,31 +1,52 @@
-use crate::node::Node;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::node::Node;
 use std::collections::HashMap;
-
-use super::NodeId;
+use std::marker::PhantomData;
 
 /// The node arena is the single source for nodes in a document (or fragment).
-#[derive(Debug, Clone, PartialEq)]
-pub struct NodeArena {
+#[derive(Debug, Clone)]
+pub struct NodeArena<N: Node<C>, C: CssSystem> {
     /// Current nodes stored as <id, node>
-    nodes: HashMap<NodeId, Node>,
+    nodes: HashMap<NodeId, N>,
     /// Next node ID to use
     next_id: NodeId,
+
+    _marker: PhantomData<C>,
+}
+
+impl<C: CssSystem, N: Node<C>> NodeArena<N, C> {
+    pub fn node_count(&self) -> usize {
+        self.nodes.len()
+    }
+}
+
+impl<C: CssSystem, N: Node<C>> PartialEq for NodeArena<N, C> {
+    fn eq(&self, other: &Self) -> bool {
+        if self.next_id != other.next_id {
+            return false;
+        }
+
+        self.nodes == other.nodes
+    }
 }
 
-impl NodeArena {
+impl<N: Node<C>, C: CssSystem> NodeArena<N, C> {
     /// Creates a new NodeArena
     #[must_use]
     pub fn new() -> Self {
         Self {
             nodes: HashMap::new(),
             next_id: NodeId::default(),
+            _marker: PhantomData,
         }
     }
 
-    /// Count the number of nodes registered in the arena
-    #[allow(dead_code)]
-    pub(crate) fn count_nodes(&self) -> usize {
-        self.nodes.len()
+    pub(crate) fn get_next_id(&mut self) -> NodeId {
+        let node_id = self.next_id;
+        self.next_id = node_id.next();
+
+        node_id
     }
 
     /// Peek what the next node ID is without incrementing the internal counter.
@@ -35,39 +56,57 @@ impl NodeArena {
     }
 
     /// Gets the node with the given id
-    pub fn get_node(&self, node_id: NodeId) -> Option<&Node> {
+    pub fn node_ref(&self, node_id: NodeId) -> Option<&N> {
         self.nodes.get(&node_id)
     }
 
-    /// Get the node with the given id as a mutable reference
-    pub fn get_node_mut(&mut self, node_id: NodeId) -> Option<&mut Node> {
-        self.nodes.get_mut(&node_id)
+    /// Gets the node with the given id
+    pub fn node(&self, node_id: NodeId) -> Option<N> {
+        self.nodes.get(&node_id).cloned()
     }
 
+    // /// Get the node with the given id as a mutable reference
+    // pub fn node_mut(&mut self, node_id: NodeId) -> Option<&mut N> {
+    //     self.nodes.get_mut(&node_id)
+    // }
+
     pub fn delete_node(&mut self, node_id: NodeId) {
         self.nodes.remove(&node_id);
     }
 
+    pub fn update_node(&mut self, node: N) {
+        self.nodes.insert(node.id(), node);
+    }
+
+    pub fn register_node_with_node_id(&mut self, mut node: N, node_id: NodeId) {
+        assert!(!node.is_registered(), "Node is already attached to an arena");
+
+        node.set_id(node_id);
+        node.set_registered(true);
+
+        self.nodes.insert(node_id, node);
+    }
+
     /// Registered an unregistered node into the arena
-    pub fn register_node(&mut self, mut node: Node) -> NodeId {
-        assert!(!node.is_registered, "Node is already attached to an arena");
+    pub fn register_node(&mut self, mut node: N) -> NodeId {
+        assert!(!node.is_registered(), "Node is already attached to an arena");
 
         let id = self.next_id;
         self.next_id = id.next();
 
-        node.is_registered = true;
-        node.id = id;
+        node.set_id(id);
+        node.set_registered(true);
 
         self.nodes.insert(id, node);
         id
     }
 
-    pub fn nodes(&self) -> &HashMap<NodeId, Node> {
+    pub fn nodes(&self) -> &HashMap<NodeId, N> {
         &self.nodes
     }
 }
 
-impl Default for NodeArena {
+impl<N: Node<C>, C: CssSystem> Default for NodeArena<N, C> {
     fn default() -> Self {
         Self::new()
     }
@@ -76,114 +115,123 @@ impl Default for NodeArena {
 #[cfg(test)]
 mod tests {
     use super::*;
-    use crate::node::HTML_NAMESPACE;
-    use crate::parser::document::Document;
+    use crate::document::document_impl::DocumentImpl;
+    use gosub_css3::system::Css3System;
     use gosub_shared::byte_stream::Location;
+    use gosub_shared::traits::document::Document;
+
+    use crate::document::builder::DocumentBuilderImpl;
+    use gosub_shared::traits::document::DocumentBuilder;
+
+    use crate::node::HTML_NAMESPACE;
 
     #[test]
     fn register_node() {
-        let mut doc = Document::shared(None);
+        let mut doc_handle = DocumentBuilderImpl::new_document(None);
 
-        let node = Node::new_element(
-            &doc,
+        let node = DocumentImpl::<Css3System>::new_element_node(
+            doc_handle.clone(),
             "test",
+            Some(HTML_NAMESPACE),
             HashMap::new(),
-            HTML_NAMESPACE,
             Location::default(),
         );
-        let mut document = doc.get_mut();
-        let id = document.arena.register_node(node);
 
-        assert_eq!(document.arena.nodes.len(), 1);
-        assert_eq!(document.arena.next_id, 1usize.into());
-        assert_eq!(id, NodeId::default());
+        let id = doc_handle.get_mut().arena.register_node(node);
+
+        let binding = doc_handle.get();
+        assert_eq!(binding.arena.nodes.len(), 2);
+        assert_eq!(binding.arena.next_id, 2usize.into());
+        assert_eq!(id, NodeId::from(1_usize));
     }
 
     #[test]
-    #[should_panic]
+    #[should_panic(expected = "Node is already attached to an arena")]
     fn register_node_twice() {
-        let mut doc = Document::shared(None);
+        let mut doc_handle = DocumentBuilderImpl::new_document(None);
 
-        let node = Node::new_element(
-            &doc,
+        let node = DocumentImpl::<Css3System>::new_element_node(
+            doc_handle.clone(),
             "test",
+            Some(HTML_NAMESPACE),
             HashMap::new(),
-            HTML_NAMESPACE,
             Location::default(),
         );
-        let mut document = doc.get_mut();
-        document.arena.register_node(node);
+        doc_handle.get_mut().arena.register_node(node);
 
-        let node = document.get_node_by_id(NodeId(0)).unwrap().to_owned();
-        document.arena.register_node(node);
+        let node = doc_handle.get_mut().node_by_id(NodeId::root()).unwrap().to_owned();
+        doc_handle.get_mut().arena.register_node(node);
     }
 
     #[test]
     fn get_node() {
-        let mut doc = Document::shared(None);
-        let node = Node::new_element(
-            &doc,
-            "test",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let mut document = doc.get_mut();
-        let id = document.arena.register_node(node);
-        let node = document.arena.get_node(id);
-        assert!(node.is_some());
-        assert_eq!(node.unwrap().name, "test");
-    }
+        let mut doc_handle = DocumentBuilderImpl::new_document(None);
 
-    #[test]
-    fn get_node_mut() {
-        let mut doc = Document::shared(None);
-        let node = Node::new_element(
-            &doc,
+        let node = DocumentImpl::<Css3System>::new_element_node(
+            doc_handle.clone(),
             "test",
+            Some(HTML_NAMESPACE),
             HashMap::new(),
-            HTML_NAMESPACE,
             Location::default(),
         );
 
-        let mut document = doc.get_mut();
+        let id = doc_handle.get_mut().arena.register_node(node);
 
-        let node_id = document.arena.register_node(node);
-        let node = document.arena.get_node_mut(node_id);
+        let binding = doc_handle.get();
+        let node = binding.arena.node(id);
         assert!(node.is_some());
-        assert_eq!(node.unwrap().name, "test");
+        assert_eq!(node.unwrap().get_element_data().unwrap().name, "test");
     }
 
+    // #[test]
+    // fn get_node_mut() {
+    //     let mut doc_handle = DocumentBuilderImpl::new_document(None);
+    //
+    //     let node = DocumentImpl::<Css3System>::new_element_node(
+    //         doc_handle.clone(),
+    //         "test",
+    //         Some(HTML_NAMESPACE),
+    //         HashMap::new(),
+    //         Location::default(),
+    //     );
+    //
+    //     let node_id = doc_handle.get_mut().arena.register_node(node);
+    //
+    //     let binding = doc_handle.get();
+    //     let node = binding.arena.node(node_id);
+    //     assert!(node.is_some());
+    //     assert_eq!(node.unwrap().get_element_data().unwrap().name, "test");
+    // }
+
     #[test]
     fn register_node_through_document() {
-        let mut doc = Document::shared(None);
+        let mut doc_handle = DocumentBuilderImpl::new_document(None);
 
-        let parent = Node::new_element(
-            &doc,
+        let parent = DocumentImpl::<Css3System>::new_element_node(
+            doc_handle.clone(),
             "parent",
+            Some(HTML_NAMESPACE),
             HashMap::new(),
-            HTML_NAMESPACE,
             Location::default(),
         );
-        let child = Node::new_element(
-            &doc,
+        let child = DocumentImpl::<Css3System>::new_element_node(
+            doc_handle.clone(),
             "child",
+            Some(HTML_NAMESPACE),
             HashMap::new(),
-            HTML_NAMESPACE,
             Location::default(),
         );
 
-        let mut document = doc.get_mut();
-        let parent_id = document.arena.register_node(parent);
-        let child_id = document.add_node(child, parent_id, None);
+        let parent_id = doc_handle.get_mut().arena.register_node(parent);
+        let child_id = doc_handle.get_mut().register_node_at(child, parent_id, None);
 
-        let parent = document.get_node_by_id(parent_id);
+        let binding = doc_handle.get();
+        let parent = binding.node_by_id(parent_id);
         assert!(parent.is_some());
-        assert_eq!(parent.unwrap().children.len(), 1);
-        assert_eq!(parent.unwrap().children[0], child_id);
+        assert_eq!(parent.unwrap().children().len(), 1);
+        assert_eq!(parent.unwrap().children()[0], child_id);
 
-        let child = document.get_node_by_id(child_id);
+        let child = binding.node_by_id(child_id);
         assert!(child.is_some());
         assert_eq!(child.unwrap().parent, Some(parent_id));
     }
diff --git a/crates/gosub_html5/src/node/data/comment.rs b/crates/gosub_html5/src/node/data/comment.rs
index 21287ecfb..56115e409 100644
--- a/crates/gosub_html5/src/node/data/comment.rs
+++ b/crates/gosub_html5/src/node/data/comment.rs
@@ -1,3 +1,5 @@
+use gosub_shared::traits::node::CommentDataType;
+
 #[derive(Debug, PartialEq, Clone)]
 /// Data structure for comment nodes
 pub struct CommentData {
@@ -13,10 +15,8 @@ impl Default for CommentData {
 
 impl CommentData {
     #[must_use]
-    pub(crate) fn new() -> Self {
-        Self {
-            value: String::new(),
-        }
+    fn new() -> Self {
+        Self { value: String::new() }
     }
 
     pub(crate) fn with_value(value: &str) -> Self {
@@ -24,8 +24,10 @@ impl CommentData {
             value: value.to_owned(),
         }
     }
+}
 
-    pub fn value(&self) -> &str {
+impl CommentDataType for CommentData {
+    fn value(&self) -> &str {
         &self.value
     }
 }
diff --git a/crates/gosub_html5/src/node/data/doctype.rs b/crates/gosub_html5/src/node/data/doctype.rs
index 4be0bd56f..d0622d330 100644
--- a/crates/gosub_html5/src/node/data/doctype.rs
+++ b/crates/gosub_html5/src/node/data/doctype.rs
@@ -1,4 +1,5 @@
 use core::fmt::{Debug, Formatter};
+use gosub_shared::traits::node::DocTypeDataType;
 use std::fmt;
 
 #[derive(PartialEq, Clone)]
@@ -24,7 +25,7 @@ impl Debug for DocTypeData {
 
 impl DocTypeData {
     #[must_use]
-    pub(crate) fn new(name: &str, pub_identifier: &str, sys_identifier: &str) -> Self {
+    pub fn new(name: &str, pub_identifier: &str, sys_identifier: &str) -> Self {
         Self {
             name: name.to_owned(),
             pub_identifier: pub_identifier.to_owned(),
@@ -32,3 +33,17 @@ impl DocTypeData {
         }
     }
 }
+
+impl DocTypeDataType for DocTypeData {
+    fn name(&self) -> &str {
+        &self.name
+    }
+
+    fn pub_identifier(&self) -> &str {
+        &self.pub_identifier
+    }
+
+    fn sys_identifier(&self) -> &str {
+        &self.sys_identifier
+    }
+}
diff --git a/crates/gosub_html5/src/node/data/document.rs b/crates/gosub_html5/src/node/data/document.rs
index dbaf70b68..53799c59f 100644
--- a/crates/gosub_html5/src/node/data/document.rs
+++ b/crates/gosub_html5/src/node/data/document.rs
@@ -1,13 +1,18 @@
 use core::fmt::{Debug, Formatter};
+use gosub_shared::traits::node::{DocumentDataType, QuirksMode};
 use std::fmt;
 
 #[derive(PartialEq, Clone)]
 /// Data structure for document nodes
-pub struct DocumentData {}
+pub struct DocumentData {
+    quirks_mode: QuirksMode,
+}
 
 impl Default for DocumentData {
     fn default() -> Self {
-        Self::new()
+        Self {
+            quirks_mode: QuirksMode::NoQuirks,
+        }
     }
 }
 
@@ -20,7 +25,17 @@ impl Debug for DocumentData {
 
 impl DocumentData {
     #[must_use]
-    pub(crate) fn new() -> Self {
-        Self {}
+    pub(crate) fn new(quirks_mode: QuirksMode) -> Self {
+        Self { quirks_mode }
+    }
+}
+
+impl DocumentDataType for DocumentData {
+    fn quirks_mode(&self) -> QuirksMode {
+        self.quirks_mode
+    }
+
+    fn set_quirks_mode(&mut self, quirks_mode: QuirksMode) {
+        self.quirks_mode = quirks_mode;
     }
 }
diff --git a/crates/gosub_html5/src/node/data/element.rs b/crates/gosub_html5/src/node/data/element.rs
index ce64b8ece..44bbfe735 100644
--- a/crates/gosub_html5/src/node/data/element.rs
+++ b/crates/gosub_html5/src/node/data/element.rs
@@ -1,77 +1,427 @@
-use crate::element_class::ElementClass;
-use crate::node::NodeId;
-use crate::parser::document::DocumentFragment;
+use crate::document::document_impl::DocumentImpl;
+use crate::document::fragment::DocumentFragmentImpl;
+use crate::node::elements::{
+    FORMATTING_HTML_ELEMENTS, SPECIAL_HTML_ELEMENTS, SPECIAL_MATHML_ELEMENTS, SPECIAL_SVG_ELEMENTS,
+};
+use crate::node::{HTML_NAMESPACE, MATHML_NAMESPACE, SVG_NAMESPACE};
 use core::fmt::{Debug, Formatter};
-
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::node::{ClassList, ElementDataType};
+use std::collections::hash_map::IntoIter;
 use std::collections::HashMap;
 use std::fmt;
 
-#[derive(PartialEq, Clone)]
+#[derive(Debug)]
+pub struct ClassListImpl {
+    /// a map of classes applied to an HTML element.
+    /// key = name, value = is_active
+    /// the is_active is used to toggle a class (JavaScript API)
+    class_map: HashMap<String, bool>,
+}
+
+impl Clone for ClassListImpl {
+    fn clone(&self) -> Self {
+        Self {
+            class_map: self.class_map.clone(),
+        }
+    }
+}
+
+impl PartialEq for ClassListImpl {
+    fn eq(&self, other: &Self) -> bool {
+        self.class_map == other.class_map
+    }
+}
+
+impl Default for ClassListImpl {
+    fn default() -> Self {
+        Self::new()
+    }
+}
+
+impl ClassListImpl {
+    /// Initialise a new (empty) ClassList
+    #[must_use]
+    pub fn new() -> Self {
+        Self {
+            class_map: HashMap::new(),
+        }
+    }
+}
+
+impl ClassList for ClassListImpl {
+    fn iter(&self) -> IntoIter<String, bool> {
+        self.class_map.clone().into_iter()
+    }
+
+    /// Count the number of classes (active or inactive)
+    /// assigned to an element
+    fn len(&self) -> usize {
+        self.class_map.len()
+    }
+
+    /// Check if any classes are present
+    fn is_empty(&self) -> bool {
+        self.class_map.is_empty()
+    }
+
+    /// Check if class name exists
+    fn contains(&self, name: &str) -> bool {
+        self.class_map.contains_key(name)
+    }
+
+    /// Add a new class (if already exists, does nothing)
+    fn add(&mut self, name: &str) {
+        // by default, adding a new class will be active.
+        // however, map.insert will update a key if it exists,
+        // and we don't want to overwrite an inactive class to make it active unintentionally,
+        // so we ignore this operation if the class already exists
+        if !self.contains(name) {
+            self.class_map.insert(name.to_owned(), true);
+        }
+    }
+
+    /// Remove a class (does nothing if not exists)
+    fn remove(&mut self, name: &str) {
+        self.class_map.remove(name);
+    }
+
+    /// Toggle a class active/inactive. Does nothing if class doesn't exist
+    fn toggle(&mut self, name: &str) {
+        if let Some(is_active) = self.class_map.get_mut(name) {
+            *is_active = !*is_active;
+        }
+    }
+
+    /// Set explicitly if a class is active or not. Does nothing if class doesn't exist
+    fn set_active(&mut self, name: &str, is_active: bool) {
+        if let Some(is_active_item) = self.class_map.get_mut(name) {
+            *is_active_item = is_active;
+        }
+    }
+
+    /// Check if a class is active. Returns false if class doesn't exist
+    fn is_active(&self, name: &str) -> bool {
+        if let Some(is_active) = self.class_map.get(name) {
+            return *is_active;
+        }
+
+        false
+    }
+
+    fn replace(&mut self, old_class_name: &str, new_class_name: &str) {
+        if let Some(is_active) = self.class_map.remove(old_class_name) {
+            self.class_map.insert(new_class_name.to_owned(), is_active);
+        }
+    }
+
+    fn length(&self) -> usize {
+        self.class_map.len()
+    }
+
+    fn as_vec(&self) -> Vec<String> {
+        self.class_map.keys().cloned().collect()
+    }
+
+    fn active_classes(&self) -> Vec<String> {
+        self.class_map
+            .iter()
+            .filter(|(_, &active)| active)
+            .map(|(name, _)| name.clone())
+            .collect()
+    }
+}
+
+/// Initialize a class from a class string
+/// with space-delimited class names
+impl From<&str> for ClassListImpl {
+    fn from(class_string: &str) -> Self {
+        let class_map_local = class_string
+            .split_whitespace()
+            .map(|class| (class.to_owned(), true))
+            .collect::<HashMap<String, bool>>();
+
+        ClassListImpl {
+            class_map: class_map_local,
+        }
+    }
+}
+
 /// Data structure for element nodes
-pub struct ElementData {
-    /// Numerical ID of the node this data is attached to
-    pub node_id: NodeId,
+#[derive(PartialEq, Clone)]
+pub struct ElementData<C: CssSystem> {
+    pub doc_handle: DocumentHandle<DocumentImpl<C>, C>,
+    pub node_id: Option<NodeId>,
     /// Name of the element (e.g., div)
     pub name: String,
+    /// Namespace of the element
+    pub namespace: Option<String>,
     /// Element's attributes stored as key-value pairs.
     /// Note that it is NOT RECOMMENDED to modify this
     /// attribute map directly and instead use TreeBuilder.insert_attribute
     /// to keep attributes in sync with the DOM.
     pub attributes: HashMap<String, String>,
-    /// CSS classes
-    pub classes: ElementClass,
+    /// CSS list of classes
+    pub class_list: ClassListImpl,
     // Only used for <script> elements
     pub force_async: bool,
     // Template contents (when it's a template element)
-    pub template_contents: Option<DocumentFragment>,
+    pub template_contents: Option<DocumentFragmentImpl<C>>,
 }
 
-impl Debug for ElementData {
+impl<C: CssSystem> Debug for ElementData<C> {
     fn fmt(&self, f: &mut Formatter<'_>) -> fmt::Result {
         let mut debug = f.debug_struct("ElementData");
-        debug.field("node_id", &self.node_id);
         debug.field("name", &self.name);
         debug.field("attributes", &self.attributes);
-        debug.field("classes", &self.classes);
+        debug.field("classes", &self.class_list);
         debug.finish()
     }
 }
 
-impl ElementData {
-    #[allow(dead_code)]
-    pub(crate) fn new(node_id: NodeId) -> Self {
-        let (name, attributes, classes, force_async, template_contents) = <_>::default();
-        Self {
-            node_id,
-            name,
-            attributes,
-            classes,
-            force_async,
-            template_contents,
+impl<C: CssSystem> ElementDataType<C> for ElementData<C> {
+    type Document = DocumentImpl<C>;
+    type DocumentFragment = DocumentFragmentImpl<C>;
+
+    fn name(&self) -> &str {
+        self.name.as_str()
+    }
+
+    fn namespace(&self) -> &str {
+        match self.namespace {
+            Some(ref namespace) => namespace.as_str(),
+            None => HTML_NAMESPACE,
         }
     }
 
-    pub(crate) fn with_name_and_attributes(
-        node_id: NodeId,
+    fn is_namespace(&self, namespace: &str) -> bool {
+        if self.namespace.is_none() {
+            return namespace == HTML_NAMESPACE;
+        }
+
+        self.namespace == Some(namespace.into())
+    }
+
+    fn classlist(&self) -> &impl ClassList {
+        &self.class_list
+    }
+
+    fn classlist_mut(&mut self) -> &mut impl ClassList {
+        &mut self.class_list
+    }
+
+    fn active_class_names(&self) -> Vec<String> {
+        self.class_list
+            .iter()
+            .filter(|(_, active)| *active)
+            .map(|(name, _)| name.clone())
+            .collect()
+    }
+
+    fn attribute(&self, name: &str) -> Option<&String> {
+        self.attributes.get(name)
+    }
+
+    fn attributes(&self) -> &HashMap<String, String> {
+        &self.attributes
+    }
+
+    /// Note that adding attributes should not be done directly, but rather through the document.insert_attribute
+    /// function. This way, the document can keep track of ID attributes.
+    fn add_attribute(&mut self, name: &str, value: &str) {
+        self.attributes.insert(name.into(), value.into());
+
+        // Classes are treated as a special attributes as they are stored separately
+        if name == "class" {
+            self.class_list = ClassListImpl::new();
+            for class in value.split_whitespace() {
+                self.class_list.add(class);
+            }
+        }
+    }
+
+    // removes attribute from element
+    fn remove_attribute(&mut self, name: &str) {
+        if name == "class" {
+            if let Some(value) = self.attributes.get(name) {
+                self.class_list.remove(value);
+            }
+        }
+
+        self.attributes.remove(name);
+    }
+
+    fn add_class(&mut self, class_name: &str) {
+        self.class_list.add(class_name);
+    }
+
+    /// This will only compare against the tag, namespace and data same except element data.
+    /// for element data compare against the tag, namespace and attributes without order.
+    /// Both nodes could still have other parents and children.
+    fn matches_tag_and_attrs_without_order(&self, other_data: &ElementData<C>) -> bool {
+        if self.name != other_data.name || self.namespace != other_data.namespace {
+            return false;
+        }
+
+        if self.name != other_data.name {
+            return false;
+        }
+
+        if self.namespace != other_data.namespace {
+            return false;
+        }
+
+        self.attributes.eq(&other_data.attributes)
+    }
+
+    /// Returns true if the given node is a mathml integration point
+    /// See: https://html.spec.whatwg.org/multipage/parsing.html#mathml-text-integration-point
+    fn is_mathml_integration_point(&self) -> bool {
+        let namespace = self.namespace.clone().unwrap_or_default();
+
+        namespace == MATHML_NAMESPACE && ["mi", "mo", "mn", "ms", "mtext"].contains(&self.name.as_str())
+    }
+
+    /// Returns true if the given node is a html integration point
+    /// See: https://html.spec.whatwg.org/multipage/parsing.html#html-integration-point
+    fn is_html_integration_point(&self) -> bool {
+        match self.namespace {
+            Some(ref namespace) => {
+                if namespace == MATHML_NAMESPACE && self.name == "annotation-xml" {
+                    if let Some(value) = self.attributes().get("encoding") {
+                        if value.eq_ignore_ascii_case("text/html") {
+                            return true;
+                        }
+                        if value.eq_ignore_ascii_case("application/xhtml+xml") {
+                            return true;
+                        }
+                    }
+
+                    return false;
+                }
+
+                namespace == SVG_NAMESPACE && ["foreignObject", "desc", "title"].contains(&self.name.as_str())
+            }
+            None => false,
+        }
+    }
+
+    /// Returns true if the given node is "special" node based on the namespace and name
+    fn is_special(&self) -> bool {
+        if self.namespace == Some(HTML_NAMESPACE.into()) && SPECIAL_HTML_ELEMENTS.contains(&self.name()) {
+            return true;
+        }
+        if self.namespace == Some(MATHML_NAMESPACE.into()) && SPECIAL_MATHML_ELEMENTS.contains(&self.name()) {
+            return true;
+        }
+        if self.namespace == Some(SVG_NAMESPACE.into()) && SPECIAL_SVG_ELEMENTS.contains(&self.name()) {
+            return true;
+        }
+
+        false
+    }
+
+    fn template_contents(&self) -> Option<&Self::DocumentFragment> {
+        match &self.template_contents {
+            Some(fragment) => Some(fragment),
+            None => None,
+        }
+    }
+
+    /// Returns true if the given node is a "formatting" node
+    fn is_formatting(&self) -> bool {
+        self.namespace == Some(HTML_NAMESPACE.into()) && FORMATTING_HTML_ELEMENTS.contains(&self.name.as_str())
+    }
+
+    fn set_template_contents(&mut self, template_contents: Self::DocumentFragment) {
+        self.template_contents = Some(template_contents);
+    }
+}
+
+impl<C: CssSystem> ElementData<C> {
+    pub(crate) fn new(
+        doc_handle: DocumentHandle<DocumentImpl<C>, C>,
         name: &str,
+        namespace: Option<&str>,
         attributes: HashMap<String, String>,
+        classlist: ClassListImpl,
     ) -> Self {
-        let (classes, force_async, template_contents) = <_>::default();
+        let (force_async, template_contents) = <_>::default();
         Self {
-            node_id,
+            doc_handle: doc_handle.clone(),
+            node_id: None, // We are not yet registered in the document, so we have no node-id
             name: name.into(),
+            namespace: Some(namespace.unwrap_or(HTML_NAMESPACE).into()),
             attributes,
-            classes,
+            class_list: classlist,
             force_async,
             template_contents,
         }
     }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn is_empty() {
+        let mut classes = ClassListImpl::new();
+        assert!(classes.is_empty());
+        classes.add("one");
+        assert!(!classes.is_empty());
+    }
+
+    #[test]
+    fn count_classes() {
+        let mut classes = ClassListImpl::new();
+        classes.add("one");
+        classes.add("two");
+        assert_eq!(classes.len(), 2);
+    }
+
+    #[test]
+    fn contains_nonexistent_class() {
+        let classes = ClassListImpl::new();
+        assert!(!classes.contains("nope"));
+    }
+
+    #[test]
+    fn contains_valid_class() {
+        let mut classes = ClassListImpl::new();
+        classes.add("yep");
+        assert!(classes.contains("yep"));
+    }
+
+    #[test]
+    fn add_class() {
+        let mut classlist = ClassListImpl::new();
+        classlist.add("yep");
+        assert!(classlist.is_active("yep"));
+
+        classlist.set_active("yep", false);
+        classlist.add("yep"); // should be ignored
+        assert!(!classlist.is_active("yep"));
+    }
 
-    pub fn name(&self) -> &str {
-        &self.name
+    #[test]
+    fn remove_class() {
+        let mut classlist = ClassListImpl::new();
+        classlist.add("yep");
+        classlist.remove("yep");
+        assert!(!classlist.contains("yep"));
     }
 
-    pub(crate) fn set_id(&mut self, node_id: NodeId) {
-        self.node_id = node_id;
+    #[test]
+    fn toggle_class() {
+        let mut classlist = ClassListImpl::new();
+        classlist.add("yep");
+        assert!(classlist.is_active("yep"));
+        classlist.toggle("yep");
+        assert!(!classlist.is_active("yep"));
+        classlist.toggle("yep");
+        assert!(classlist.is_active("yep"));
     }
 }
diff --git a/crates/gosub_html5/src/node/data/text.rs b/crates/gosub_html5/src/node/data/text.rs
index d241e7cfe..679e90308 100644
--- a/crates/gosub_html5/src/node/data/text.rs
+++ b/crates/gosub_html5/src/node/data/text.rs
@@ -1,4 +1,7 @@
+use gosub_shared::traits::node::TextDataType;
+
 #[derive(Clone, Debug, PartialEq)]
+
 /// Data structure for text nodes
 pub struct TextData {
     /// Actual text
@@ -13,19 +16,27 @@ impl Default for TextData {
 
 impl TextData {
     #[must_use]
-    pub(crate) fn new() -> Self {
-        Self {
-            value: String::new(),
-        }
+    pub fn new() -> Self {
+        Self { value: String::new() }
     }
 
-    pub(crate) fn with_value(value: &str) -> Self {
+    pub fn with_value(value: &str) -> Self {
         Self {
             value: value.to_owned(),
         }
     }
+}
 
-    pub fn value(&self) -> &str {
+impl TextDataType for TextData {
+    fn value(&self) -> &str {
         &self.value
     }
+
+    fn string_value(&self) -> String {
+        self.value.clone()
+    }
+
+    fn value_mut(&mut self) -> &mut String {
+        &mut self.value
+    }
 }
diff --git a/crates/gosub_html5/src/node/elements.rs b/crates/gosub_html5/src/node/elements.rs
new file mode 100644
index 000000000..05a03c156
--- /dev/null
+++ b/crates/gosub_html5/src/node/elements.rs
@@ -0,0 +1,97 @@
+/// HTML elements that are considered formatting elements
+pub static FORMATTING_HTML_ELEMENTS: [&str; 14] = [
+    "a", "b", "big", "code", "em", "font", "i", "nobr", "s", "small", "strike", "strong", "tt", "u",
+];
+
+/// HTML elements that are considered special elements
+pub static SPECIAL_HTML_ELEMENTS: [&str; 83] = [
+    "address",
+    "applet",
+    "area",
+    "article",
+    "aside",
+    "base",
+    "basefont",
+    "bgsound",
+    "blockquote",
+    "body",
+    "br",
+    "button",
+    "caption",
+    "center",
+    "col",
+    "colgroup",
+    "dd",
+    "details",
+    "dir",
+    "div",
+    "dl",
+    "dt",
+    "embed",
+    "fieldset",
+    "figcaption",
+    "figure",
+    "footer",
+    "form",
+    "frame",
+    "frameset",
+    "h1",
+    "h2",
+    "h3",
+    "h4",
+    "h5",
+    "h6",
+    "head",
+    "header",
+    "hgroup",
+    "hr",
+    "html",
+    "iframe",
+    "img",
+    "input",
+    "keygen",
+    "li",
+    "link",
+    "listing",
+    "main",
+    "marquee",
+    "menu",
+    "meta",
+    "nav",
+    "noembed",
+    "noframes",
+    "noscript",
+    "object",
+    "ol",
+    "p",
+    "param",
+    "plaintext",
+    "pre",
+    "script",
+    "search",
+    "section",
+    "select",
+    "source",
+    "style",
+    "summary",
+    "table",
+    "tbody",
+    "td",
+    "template",
+    "textarea",
+    "tfoot",
+    "th",
+    "thead",
+    "title",
+    "tr",
+    "track",
+    "ul",
+    "wbr",
+    "xmp",
+];
+
+/// MathML elements that are considered special elements
+pub static SPECIAL_MATHML_ELEMENTS: [&str; 6] = ["mi", "mo", "mn", "ms", "mtext", "annotation-xml"];
+
+/// SVG elements that are considered special elements
+pub static SPECIAL_SVG_ELEMENTS: [&str; 3] = ["foreignObject", "desc", "title"];
diff --git a/crates/gosub_html5/src/node/node_impl.rs b/crates/gosub_html5/src/node/node_impl.rs
new file mode 100644
index 000000000..22d6827b4
--- /dev/null
+++ b/crates/gosub_html5/src/node/node_impl.rs
@@ -0,0 +1,520 @@
+use crate::document::document_impl::DocumentImpl;
+use crate::node::data::comment::CommentData;
+use crate::node::data::doctype::DocTypeData;
+use crate::node::data::document::DocumentData;
+use crate::node::data::element::ElementData;
+use crate::node::data::text::TextData;
+use core::fmt::Debug;
+use gosub_shared::byte_stream::Location;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::node::{Node, NodeData, NodeType, QuirksMode};
+use std::collections::HashMap;
+
+/// Implementation of the NodeDataType trait
+#[derive(Debug, Clone, PartialEq)]
+pub enum NodeDataTypeInternal<C: CssSystem> {
+    /// Represents a document
+    Document(DocumentData),
+    // Represents a doctype
+    DocType(DocTypeData),
+    /// Represents a text
+    Text(TextData),
+    /// Represents a comment
+    Comment(CommentData),
+    /// Represents an element
+    Element(ElementData<C>),
+}
+
+/// Node structure that resembles a DOM node
+pub struct NodeImpl<C: CssSystem> {
+    /// ID of the node, 0 is always the root / document node
+    pub id: NodeId,
+    /// parent of the node, if any
+    pub parent: Option<NodeId>,
+    /// any children of the node
+    pub children: Vec<NodeId>,
+    /// actual data of the node
+    pub data: NodeDataTypeInternal<C>,
+    /// Handle to the document in which this node resides
+    pub document: DocumentHandle<DocumentImpl<C>, C>,
+    // Returns true when the given node is registered into the document arena
+    pub registered: bool,
+    // Location of the node in the source code
+    pub location: Location,
+}
+
+impl<C: CssSystem> Node<C> for NodeImpl<C> {
+    type Document = DocumentImpl<C>;
+    type DocumentData = DocumentData;
+    type DocTypeData = DocTypeData;
+    type TextData = TextData;
+    type CommentData = CommentData;
+    type ElementData = ElementData<C>;
+
+    fn id(&self) -> NodeId {
+        self.id
+    }
+
+    fn set_id(&mut self, id: NodeId) {
+        self.id = id
+    }
+
+    fn location(&self) -> Location {
+        self.location
+    }
+
+    fn parent_id(&self) -> Option<NodeId> {
+        self.parent
+    }
+
+    fn set_parent(&mut self, parent_id: Option<NodeId>) {
+        self.parent = parent_id;
+    }
+
+    fn set_registered(&mut self, registered: bool) {
+        self.registered = registered;
+    }
+
+    fn is_registered(&self) -> bool {
+        self.registered
+    }
+
+    fn is_root(&self) -> bool {
+        self.parent_id().is_none()
+    }
+
+    fn children(&self) -> &[NodeId] {
+        self.children.as_slice()
+    }
+
+    fn type_of(&self) -> NodeType {
+        match self.data {
+            NodeDataTypeInternal::Document(_) => NodeType::DocumentNode,
+            NodeDataTypeInternal::DocType(_) => NodeType::DocTypeNode,
+            NodeDataTypeInternal::Text(_) => NodeType::TextNode,
+            NodeDataTypeInternal::Comment(_) => NodeType::CommentNode,
+            NodeDataTypeInternal::Element(_) => NodeType::ElementNode,
+        }
+    }
+
+    fn is_element_node(&self) -> bool {
+        self.type_of() == NodeType::ElementNode
+    }
+
+    fn get_element_data(&self) -> Option<&Self::ElementData> {
+        if let NodeDataTypeInternal::Element(data) = &self.data {
+            return Some(data);
+        }
+        None
+    }
+
+    fn get_element_data_mut(&mut self) -> Option<&mut ElementData<C>> {
+        if let NodeDataTypeInternal::Element(data) = &mut self.data {
+            return Some(data);
+        }
+        None
+    }
+
+    fn is_text_node(&self) -> bool {
+        matches!(self.data, NodeDataTypeInternal::Text(_))
+    }
+
+    fn get_text_data(&self) -> Option<&Self::TextData> {
+        if let NodeDataTypeInternal::Text(data) = &self.data {
+            return Some(data);
+        }
+        None
+    }
+
+    fn get_text_data_mut(&mut self) -> Option<&mut TextData> {
+        if let NodeDataTypeInternal::Text(data) = &mut self.data {
+            return Some(data);
+        }
+        None
+    }
+
+    fn get_comment_data(&self) -> Option<&Self::CommentData> {
+        if let NodeDataTypeInternal::Comment(data) = &self.data {
+            return Some(data);
+        }
+        None
+    }
+
+    fn get_doctype_data(&self) -> Option<&Self::DocTypeData> {
+        if let NodeDataTypeInternal::DocType(data) = &self.data {
+            return Some(data);
+        }
+        None
+    }
+
+    fn handle(&self) -> DocumentHandle<Self::Document, C> {
+        self.document.clone()
+    }
+
+    fn remove(&mut self, node_id: NodeId) {
+        self.children.retain(|x| x != &node_id);
+    }
+
+    fn insert(&mut self, node_id: NodeId, idx: usize) {
+        self.children.insert(idx, node_id);
+    }
+
+    fn push(&mut self, node_id: NodeId) {
+        self.children.push(node_id);
+    }
+
+    fn data(&self) -> NodeData<C, Self> {
+        match self.data {
+            NodeDataTypeInternal::Document(ref data) => NodeData::Document(data),
+            NodeDataTypeInternal::DocType(ref data) => NodeData::DocType(data),
+            NodeDataTypeInternal::Text(ref data) => NodeData::Text(data),
+            NodeDataTypeInternal::Comment(ref data) => NodeData::Comment(data),
+            NodeDataTypeInternal::Element(ref data) => NodeData::Element(data),
+        }
+    }
+
+    /// Creates a new node based on the original node, but without any attachments (childs, parents) or a node-id
+    fn new_from_node(org_node: &Self) -> Self {
+        let (id, parent, children, registered) = <_>::default();
+
+        Self {
+            id,
+            parent,
+            children,
+            data: org_node.data.clone(),
+            document: org_node.document.clone(),
+            registered,
+            location: org_node.location(),
+        }
+    }
+}
+
+impl<C: CssSystem> PartialEq for NodeImpl<C> {
+    fn eq(&self, other: &Self) -> bool {
+        self.id == other.id()
+    }
+}
+
+impl<C: CssSystem> Debug for NodeImpl<C> {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        let mut debug = f.debug_struct("Node");
+        debug.field("id", &self.id);
+        debug.field("parent", &self.parent);
+        debug.field("children", &self.children);
+        // @todo: add element/doctype etc data
+        debug.finish_non_exhaustive()
+    }
+}
+
+impl<C: CssSystem> Clone for NodeImpl<C> {
+    fn clone(&self) -> Self {
+        NodeImpl {
+            id: self.id,
+            parent: self.parent,
+            children: self.children.clone(),
+            data: self.data.clone(),
+            document: self.document.clone(),
+            registered: self.registered,
+            location: self.location,
+        }
+    }
+}
+
+impl<C: CssSystem> NodeImpl<C> {
+    /// create a new `Node`
+    #[must_use]
+    pub fn new(
+        document: DocumentHandle<DocumentImpl<C>, C>,
+        location: Location,
+        data: &NodeDataTypeInternal<C>,
+    ) -> Self {
+        let (id, parent, children, registered) = <_>::default();
+
+        Self {
+            id,
+            parent,
+            children,
+            data: data.clone(),
+            document: document.clone(),
+            registered,
+            location,
+        }
+    }
+
+    /// Create a new document node
+    #[must_use]
+    pub fn new_document(
+        document: DocumentHandle<DocumentImpl<C>, C>,
+        location: Location,
+        quirks_mode: QuirksMode,
+    ) -> Self {
+        Self::new(
+            document,
+            location,
+            &NodeDataTypeInternal::Document(DocumentData::new(quirks_mode)),
+        )
+    }
+
+    #[must_use]
+    pub fn new_doctype(
+        document: DocumentHandle<DocumentImpl<C>, C>,
+        location: Location,
+        name: &str,
+        pub_identifier: &str,
+        sys_identifier: &str,
+    ) -> Self {
+        Self::new(
+            document,
+            location,
+            &NodeDataTypeInternal::DocType(DocTypeData::new(name, pub_identifier, sys_identifier)),
+        )
+    }
+
+    /// Create a new element node with the given name and attributes and namespace
+    #[must_use]
+    pub fn new_element(
+        doc_handle: DocumentHandle<DocumentImpl<C>, C>,
+        location: Location,
+        name: &str,
+        namespace: Option<&str>,
+        attributes: HashMap<String, String>,
+    ) -> Self {
+        Self::new(
+            doc_handle.clone(),
+            location,
+            &NodeDataTypeInternal::Element(ElementData::new(
+                doc_handle.clone(),
+                name,
+                namespace,
+                attributes,
+                Default::default(),
+            )),
+        )
+    }
+
+    /// Creates a new comment node
+    #[must_use]
+    pub fn new_comment(doc_handle: DocumentHandle<DocumentImpl<C>, C>, location: Location, value: &str) -> Self {
+        Self::new(
+            doc_handle.clone(),
+            location,
+            &NodeDataTypeInternal::Comment(CommentData::with_value(value)),
+        )
+    }
+
+    /// Creates a new text node
+    #[must_use]
+    pub fn new_text(doc_handle: DocumentHandle<DocumentImpl<C>, C>, location: Location, value: &str) -> Self {
+        Self::new(
+            doc_handle.clone(),
+            location,
+            &NodeDataTypeInternal::Text(TextData::with_value(value)),
+        )
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::node::elements::SPECIAL_HTML_ELEMENTS;
+    use crate::node::elements::SPECIAL_MATHML_ELEMENTS;
+    use crate::node::elements::SPECIAL_SVG_ELEMENTS;
+    use crate::node::HTML_NAMESPACE;
+    use crate::node::MATHML_NAMESPACE;
+    use crate::node::SVG_NAMESPACE;
+    use crate::DocumentBuilderImpl;
+    use gosub_css3::system::Css3System;
+    use gosub_shared::traits::document::DocumentBuilder;
+    use gosub_shared::traits::node::ElementDataType;
+    use std::collections::HashMap;
+
+    #[test]
+    fn new_document() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let node = NodeImpl::new_document(doc_handle.clone(), Location::default(), QuirksMode::NoQuirks);
+        assert_eq!(node.id, NodeId::default());
+        assert_eq!(node.parent, None);
+        assert!(node.children.is_empty());
+        match &node.data {
+            NodeDataTypeInternal::Document(_) => (),
+            _ => panic!(),
+        }
+    }
+
+    #[test]
+    fn new_element() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let mut attributes = HashMap::new();
+        attributes.insert("id".to_string(), "test".to_string());
+
+        let node = NodeImpl::new_element(
+            doc_handle.clone(),
+            Location::default(),
+            "div",
+            Some(HTML_NAMESPACE),
+            attributes.clone(),
+        );
+        assert_eq!(node.id, NodeId::default());
+        assert_eq!(node.parent, None);
+        assert!(node.children.is_empty());
+
+        match &node.data {
+            NodeDataTypeInternal::Element(data) => {
+                assert_eq!(data.name(), "div");
+                assert!(data.attributes().contains_key("id"));
+                assert_eq!(data.attributes().get("id").unwrap(), "test");
+            }
+            _ => panic!(),
+        }
+    }
+
+    #[test]
+    fn new_comment() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let node = NodeImpl::new_comment(doc_handle.clone(), Location::default(), "test");
+        assert_eq!(node.id, NodeId::default());
+        assert_eq!(node.parent, None);
+        assert!(node.children.is_empty());
+        let NodeDataTypeInternal::Comment(CommentData { value, .. }) = &node.data else {
+            panic!()
+        };
+        assert_eq!(value, "test");
+    }
+
+    #[test]
+    fn new_text() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let node = NodeImpl::new_text(doc_handle.clone(), Location::default(), "test");
+        assert_eq!(node.id, NodeId::default());
+        assert_eq!(node.parent, None);
+        assert!(node.children.is_empty());
+        let NodeDataTypeInternal::Text(TextData { value }) = &node.data else {
+            panic!()
+        };
+        assert_eq!(value, "test");
+    }
+
+    #[test]
+    fn is_special() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let mut attributes = HashMap::new();
+        attributes.insert("id".to_string(), "test".to_string());
+
+        let node = NodeImpl::new_element(
+            doc_handle.clone(),
+            Location::default(),
+            "div",
+            Some(HTML_NAMESPACE),
+            attributes,
+        );
+        assert!(node.get_element_data().unwrap().is_special());
+    }
+
+    #[test]
+    fn type_of() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let node = NodeImpl::new_document(doc_handle.clone(), Location::default(), QuirksMode::NoQuirks);
+        assert_eq!(node.type_of(), NodeType::DocumentNode);
+        let node = NodeImpl::new_text(doc_handle.clone(), Location::default(), "test");
+        assert_eq!(node.type_of(), NodeType::TextNode);
+        let node = NodeImpl::new_comment(doc_handle.clone(), Location::default(), "test");
+        assert_eq!(node.type_of(), NodeType::CommentNode);
+        let mut attributes = HashMap::new();
+        attributes.insert("id".to_string(), "test".to_string());
+        let node = NodeImpl::new_element(
+            doc_handle.clone(),
+            Location::default(),
+            "div",
+            Some(HTML_NAMESPACE),
+            attributes,
+        );
+        assert_eq!(node.type_of(), NodeType::ElementNode);
+    }
+
+    #[test]
+    fn special_html_elements() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        for element in SPECIAL_HTML_ELEMENTS.iter() {
+            let mut attributes = HashMap::new();
+            attributes.insert("id".to_string(), "test".to_string());
+
+            let node = NodeImpl::new_element(
+                doc_handle.clone(),
+                Location::default(),
+                element,
+                Some(HTML_NAMESPACE),
+                attributes,
+            );
+
+            assert!(node.get_element_data().unwrap().is_special());
+        }
+    }
+
+    #[test]
+    fn special_mathml_elements() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        for element in SPECIAL_MATHML_ELEMENTS.iter() {
+            let mut attributes = HashMap::new();
+            attributes.insert("id".to_string(), "test".to_string());
+            let node = NodeImpl::new_element(
+                doc_handle.clone(),
+                Location::default(),
+                element,
+                Some(MATHML_NAMESPACE),
+                attributes.clone(),
+            );
+
+            assert!(node.get_element_data().unwrap().is_special());
+        }
+    }
+
+    #[test]
+    fn special_svg_elements() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        for element in SPECIAL_SVG_ELEMENTS.iter() {
+            let mut attributes = HashMap::new();
+            attributes.insert("id".to_string(), "test".to_string());
+            let node = NodeImpl::new_element(
+                doc_handle.clone(),
+                Location::default(),
+                element,
+                Some(SVG_NAMESPACE),
+                attributes,
+            );
+            assert!(node.get_element_data().unwrap().is_special());
+        }
+    }
+
+    #[test]
+    fn type_of_node() {
+        let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+        let node = NodeImpl::new_document(doc_handle.clone(), Location::default(), QuirksMode::NoQuirks);
+        assert_eq!(node.type_of(), NodeType::DocumentNode);
+        let node = NodeImpl::new_text(doc_handle.clone(), Location::default(), "test");
+        assert_eq!(node.type_of(), NodeType::TextNode);
+        let node = NodeImpl::new_comment(doc_handle.clone(), Location::default(), "test");
+        assert_eq!(node.type_of(), NodeType::CommentNode);
+        let mut attributes = HashMap::new();
+        attributes.insert("id".to_string(), "test".to_string());
+        let node = NodeImpl::new_element(
+            doc_handle.clone(),
+            Location::default(),
+            "div",
+            Some(HTML_NAMESPACE),
+            attributes,
+        );
+        assert_eq!(node.type_of(), NodeType::ElementNode);
+    }
+}
diff --git a/crates/gosub_html5/src/node/visitor.rs b/crates/gosub_html5/src/node/visitor.rs
new file mode 100644
index 000000000..65703af1e
--- /dev/null
+++ b/crates/gosub_html5/src/node/visitor.rs
@@ -0,0 +1,18 @@
+use gosub_shared::traits::css3::CssSystem;
+
+pub trait Visitor<Node: gosub_shared::traits::node::Node<C>, C: CssSystem> {
+    fn document_enter(&mut self, node: &Node);
+    fn document_leave(&mut self, node: &Node);
+
+    fn doctype_enter(&mut self, node: &Node);
+    fn doctype_leave(&mut self, node: &Node);
+
+    fn text_enter(&mut self, node: &Node);
+    fn text_leave(&mut self, node: &Node);
+
+    fn comment_enter(&mut self, node: &Node);
+    fn comment_leave(&mut self, node: &Node);
+
+    fn element_enter(&mut self, node: &Node);
+    fn element_leave(&mut self, node: &Node);
+}
diff --git a/crates/gosub_html5/src/parser.rs b/crates/gosub_html5/src/parser.rs
index 37fd436dd..9e1155068 100644
--- a/crates/gosub_html5/src/parser.rs
+++ b/crates/gosub_html5/src/parser.rs
@@ -8,29 +8,28 @@ use std::rc::Rc;
 use log::warn;
 use url::Url;
 
-use gosub_css3::convert::ast_converter::convert_ast_to_stylesheet;
-use gosub_css3::parser_config::ParserConfig;
-use gosub_css3::stylesheet::{CssOrigin, CssStylesheet};
-use gosub_css3::Css3;
-use gosub_shared::byte_stream::{ByteStream, Location};
-use gosub_shared::types::{ParseError, Result};
-use gosub_shared::{timing_start, timing_stop};
-
-use crate::error_logger::{ErrorLogger, ParserError};
-use crate::node::NodeId;
-use crate::node::{Node, NodeData, HTML_NAMESPACE, MATHML_NAMESPACE, SVG_NAMESPACE};
+use crate::node::{HTML_NAMESPACE, MATHML_NAMESPACE, SVG_NAMESPACE};
 use crate::parser::attr_replacements::{
     MATHML_ADJUSTMENTS, SVG_ADJUSTMENTS_ATTRIBUTES, SVG_ADJUSTMENTS_TAGS, XML_ADJUSTMENTS,
 };
-use crate::parser::document::DocumentHandle;
-use crate::parser::document::{Document, DocumentBuilder, DocumentFragment, DocumentType};
-use crate::parser::quirks::QuirksMode;
+use crate::parser::errors::{ErrorLogger, ParserError};
 use crate::tokenizer::state::State;
 use crate::tokenizer::token::Token;
 use crate::tokenizer::{ParserData, Tokenizer, CHAR_REPLACEMENT};
+use gosub_shared::byte_stream::{ByteStream, Location};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::{CssOrigin, CssSystem};
+use gosub_shared::traits::document::{Document, DocumentBuilder, DocumentFragment, DocumentType};
+use gosub_shared::traits::html5::ParserOptions;
+use gosub_shared::traits::node::TextDataType;
+use gosub_shared::traits::node::{ElementDataType, Node, QuirksMode};
+use gosub_shared::traits::{Context, ParserConfig};
+use gosub_shared::types::{ParseError, Result};
+use gosub_shared::{timing_start, timing_stop};
 
 mod attr_replacements;
-pub mod document;
+pub mod errors;
 pub mod query;
 mod quirks;
 pub mod tree_builder;
@@ -69,20 +68,40 @@ macro_rules! get_node_by_id {
     ($doc_handle:expr, $id:expr) => {
         $doc_handle
             .get()
-            .get_node_by_id($id)
+            .node_by_id($id)
             .expect("Node not found")
+            // @todo: clone or not?
             .clone()
     };
 }
 
+macro_rules! get_element_data {
+    ($node:expr) => {
+        $node.get_element_data().expect("Node is not an element node")
+    };
+}
+
+macro_rules! get_element_data_mut {
+    ($node:expr) => {
+        $node.get_element_data_mut().expect("Node is not an element node")
+    };
+}
+
+macro_rules! get_text_data_mut {
+    ($node:expr) => {
+        $node.get_text_data_mut().expect("Node is not an text node")
+    };
+}
+
 macro_rules! current_node {
     ($self:expr) => {{
         let current_node_idx = $self.open_elements.last().unwrap_or_default();
         $self
             .document
             .get()
-            .get_node_by_id(*current_node_idx)
+            .node_by_id(*current_node_idx)
             .expect("Current node not found")
+            // @todo: clone or not?
             .clone()
     }};
 }
@@ -92,8 +111,9 @@ macro_rules! open_elements_get {
         $self
             .document
             .get()
-            .get_node_by_id($self.open_elements[$idx])
-            .expect("Current node not found")
+            .node_by_id($self.open_elements[$idx])
+            .expect("node in open_elements not found")
+            // @todo: clone or not?
             .clone()
     }};
 }
@@ -121,6 +141,14 @@ pub struct Html5ParserOptions {
     pub scripting_enabled: bool,
 }
 
+impl ParserOptions for Html5ParserOptions {
+    fn new(scripting: bool) -> Self {
+        Self {
+            scripting_enabled: scripting,
+        }
+    }
+}
+
 impl Default for Html5ParserOptions {
     fn default() -> Self {
         Self {
@@ -130,7 +158,7 @@ impl Default for Html5ParserOptions {
 }
 
 /// The main parser object
-pub struct Html5Parser<'chars> {
+pub struct Html5Parser<'chars, D: Document<C>, C: CssSystem> {
     /// tokenizer object
     tokenizer: Tokenizer<'chars>,
     /// current insertion mode
@@ -161,14 +189,14 @@ pub struct Html5Parser<'chars> {
     script_already_started: bool,
     /// Pending table character tokens
     pending_table_character_tokens: String,
-    /// Acknowledge self closing tags
+    /// Acknowledge self-closing tags
     ack_self_closing: bool,
     /// List of active formatting elements or markers
     active_formatting_elements: Vec<ActiveElement>,
     /// Is the current parsing a fragment case. If so, the context_node_id and context_doc should be set as well.
     is_fragment_case: bool,
     /// A reference to the document we are parsing
-    document: DocumentHandle,
+    document: DocumentHandle<D, C>,
     /// Error logger, which is shared with the tokenizer
     error_logger: Rc<RefCell<ErrorLogger>>,
     /// Levels of scripting we currently are in
@@ -186,7 +214,30 @@ pub struct Html5Parser<'chars> {
     /// Context node id for fragment parsing
     context_node_id: Option<NodeId>,
     /// Context node document for fragment parsing (we don't want to keep Option<Node> as this clones a whole node
-    context_doc: Option<DocumentHandle>,
+    context_doc: Option<DocumentHandle<D, C>>,
+}
+
+impl<D: Document<C>, C: CssSystem> gosub_shared::traits::html5::Html5Parser<C> for Html5Parser<'_, D, C> {
+    type Document = D;
+    type Options = Html5ParserOptions;
+
+    fn parse(
+        stream: &mut ByteStream,
+        doc: DocumentHandle<Self::Document, C>,
+        opts: Option<Self::Options>,
+    ) -> Result<Vec<ParseError>> {
+        Self::parse_document(stream, doc, opts)
+    }
+
+    fn parse_fragment(
+        stream: &mut ByteStream,
+        doc: DocumentHandle<Self::Document, C>,
+        context_node: &<Self::Document as Document<C>>::Node,
+        options: Option<Self::Options>,
+        start_location: Location,
+    ) -> Result<Vec<ParseError>> {
+        Self::parse_fragment(stream, doc, context_node, options, start_location)
+    }
 }
 
 /// Defines the scopes for in_scope()
@@ -205,11 +256,17 @@ enum DispatcherMode {
     Html,
 }
 
-impl<'chars> Html5Parser<'chars> {
+impl<'chars, D, C> Html5Parser<'chars, D, C>
+where
+    D: Document<C>,
+    C: CssSystem,
+    // <<D as Document<C>>::Node as Node<C>>::ElementData: ElementDataType<C, Document=D>,
+    // <<<D as Document<C>>::Node as Node<C>>::ElementData as ElementDataType<C>>::DocumentFragment: DocumentFragment<C, Document=D>,
+{
     // Initializes the parser for whole document parsing
     fn init(
         tokenizer: Tokenizer<'chars>,
-        document: DocumentHandle,
+        document: DocumentHandle<D, C>,
         error_logger: Rc<RefCell<ErrorLogger>>,
         options: Option<Html5ParserOptions>,
     ) -> Self {
@@ -250,7 +307,7 @@ impl<'chars> Html5Parser<'chars> {
     /// Creates a new parser with a dummy document and dummy tokenizer. This is ONLY used for testing purposes.
     /// Regular users should use the parse_document() and parse_fragment() functions instead.
     pub fn new_parser(stream: &'chars mut ByteStream, start_location: Location) -> Self {
-        let doc = DocumentBuilder::new_document(None);
+        let doc_handle = D::Builder::new_document(None);
         let error_logger = Rc::new(RefCell::new(ErrorLogger::new()));
         let tokenizer = Tokenizer::new(stream, None, error_logger.clone(), start_location);
 
@@ -275,7 +332,7 @@ impl<'chars> Html5Parser<'chars> {
             ack_self_closing: false,
             active_formatting_elements: vec![],
             is_fragment_case: false,
-            document: Document::clone(&doc),
+            document: doc_handle.clone(),
             error_logger,
             script_nesting_level: 0,
             parser_pause_flag: false,
@@ -292,28 +349,26 @@ impl<'chars> Html5Parser<'chars> {
     /// This is used for parsing innerHTML and document fragments.
     pub fn parse_fragment(
         stream: &mut ByteStream,
-        mut document: DocumentHandle,
-        context_node: &Node,
+        mut document: DocumentHandle<D, C>,
+        context_node: &D::Node,
         options: Option<Html5ParserOptions>,
         start_location: Location,
     ) -> Result<Vec<ParseError>> {
         // https://html.spec.whatwg.org/multipage/parsing.html#parsing-html-fragments
 
+        let context_node_element_data = context_node.get_element_data().expect("context node is not an element");
+
         // 1.
-        document.get_mut().doctype = DocumentType::HTML;
+        document.get_mut().set_doctype(DocumentType::HTML);
 
         // 2.
-        // if doc_weak is none for some reason, it will default to no quirks mode
-        if let Some(doc_weak) = context_node.document.upgrade() {
-            document.get_mut().quirks_mode = doc_weak.borrow().quirks_mode;
-        }
+        // Obsoleted: if doc_weak is none for some reason, it will default to no quirks mode
 
         // 3.
         let error_logger = Rc::new(RefCell::new(ErrorLogger::new()));
 
-        let tokenizer = Tokenizer::new(stream, None, error_logger.clone(), start_location.clone());
-        let mut parser =
-            Html5Parser::init(tokenizer, Document::clone(&document), error_logger, options);
+        let tokenizer = Tokenizer::new(stream, None, error_logger.clone(), start_location);
+        let mut parser = Html5Parser::init(tokenizer, document.clone(), error_logger, options);
 
         // 4. / 12.
         parser.initialize_fragment_case(context_node);
@@ -325,26 +380,18 @@ impl<'chars> Html5Parser<'chars> {
         parser.open_elements.push(NodeId::root());
 
         // 8.
-        if context_node.name == "template" {
-            parser
-                .template_insertion_mode
-                .push(InsertionMode::InTemplate);
+        if context_node_element_data.name() == "template" {
+            parser.template_insertion_mode.push(InsertionMode::InTemplate);
         }
 
         // 9.
         // @Todo: this does not do anything yet
-        let _token = match &context_node.data {
-            NodeData::Element(element) => {
-                let node_attributes = element.attributes.clone();
-
-                Token::StartTag {
-                    name: context_node.name.clone(),
-                    is_self_closing: false,
-                    attributes: node_attributes,
-                    location: start_location.clone(),
-                }
-            }
-            _ => panic!("not an element"),
+        let node_attributes = context_node_element_data.attributes().clone();
+        let _token = Token::StartTag {
+            name: context_node_element_data.name().to_string(),
+            is_self_closing: false,
+            attributes: node_attributes,
+            location: start_location,
         };
 
         // 10.
@@ -353,16 +400,16 @@ impl<'chars> Html5Parser<'chars> {
         // 11. Set the parser's form element pointer to the nearest node to the context element that is a form element (going straight up the ancestor chain, and including the element itself, if it is a form element), if any. (If there is no such form element, the form element pointer keeps its initial value, null.)
         let mut node = context_node.clone();
         loop {
-            if node.name == "form" {
-                parser.form_element = Some(node.id);
+            if context_node_element_data.name() == "form" {
+                parser.form_element = Some(node.id());
                 break;
             }
 
-            if node.parent.is_none() {
+            if node.parent_id().is_none() {
                 break;
             }
 
-            node = get_node_by_id!(document, node.parent.unwrap());
+            node = get_node_by_id!(document, node.parent_id().unwrap());
         }
 
         // 13. / 14.
@@ -375,14 +422,14 @@ impl<'chars> Html5Parser<'chars> {
     /// node where this document fragment needs to be inserted into.
     pub fn parse_document(
         stream: &mut ByteStream,
-        document: DocumentHandle,
+        document: DocumentHandle<D, C>,
         options: Option<Html5ParserOptions>,
     ) -> Result<Vec<ParseError>> {
         // Create a new error logger that will be used in both the tokenizer and the parser
         let error_logger = Rc::new(RefCell::new(ErrorLogger::new()));
 
-        let t_id = match &document.get().location {
-            Some(location) => timing_start!("html5.parse", location),
+        let t_id = match &document.get().url() {
+            Some(url) => timing_start!("html5.parse", url.as_str()),
             None => timing_start!("html5.parse", "unknown"),
         };
         let tokenizer = Tokenizer::new(stream, None, error_logger.clone(), Location::default());
@@ -513,12 +560,11 @@ impl<'chars> Html5Parser<'chars> {
             {
                 self.process_unexpected_html_tag();
             }
-            Token::StartTag {
-                name, attributes, ..
-            } if name == "font"
-                && (attributes.contains_key("color")
-                    || attributes.contains_key("face")
-                    || attributes.contains_key("size")) =>
+            Token::StartTag { name, attributes, .. }
+                if name == "font"
+                    && (attributes.contains_key("color")
+                        || attributes.contains_key("face")
+                        || attributes.contains_key("size")) =>
             {
                 self.process_unexpected_html_tag();
             }
@@ -526,32 +572,26 @@ impl<'chars> Html5Parser<'chars> {
                 self.process_unexpected_html_tag();
             }
             Token::StartTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } => {
                 let mut current_token = self.current_token.clone();
 
                 let acn = self.get_adjusted_current_node();
-                if acn.is_namespace(MATHML_NAMESPACE) {
+                let acn_element_data = get_element_data!(acn);
+                if acn_element_data.is_namespace(MATHML_NAMESPACE) {
                     self.adjust_mathml_attributes(&mut current_token);
                 }
 
-                if acn.is_namespace(SVG_NAMESPACE) {
+                if acn_element_data.is_namespace(SVG_NAMESPACE) {
                     self.adjust_svg_tag_names(&mut current_token);
                     self.adjust_svg_attributes(&mut current_token);
                 }
 
                 self.adjust_foreign_attributes(&mut current_token);
-                self.insert_foreign_element(
-                    &current_token,
-                    acn.namespace.expect("namespace").as_str(),
-                );
+                self.insert_foreign_element(&current_token, acn_element_data.namespace());
 
                 if *is_self_closing {
-                    if name == "script"
-                        && current_node!(self).namespace.unwrap_or_default() == SVG_NAMESPACE
-                    {
+                    if name == "script" && get_element_data!(current_node!(self)).namespace() == SVG_NAMESPACE {
                         self.ack_self_closing = true;
                         handle_as_script_endtag = true;
                     } else {
@@ -572,7 +612,7 @@ impl<'chars> Html5Parser<'chars> {
                 let mut node_idx = self.open_elements.len() - 1;
                 let mut node = get_node_by_id!(self.document, self.open_elements[node_idx]);
 
-                if node.name.to_lowercase() != *name {
+                if get_element_data!(node).name().to_lowercase() != *name {
                     self.parse_error("end tag does not match current node");
                 }
 
@@ -580,13 +620,13 @@ impl<'chars> Html5Parser<'chars> {
                     // Fragment case is when the first element in the stack is this node
                     match self.open_elements.first() {
                         // fragment case
-                        Some(node_id) if *node_id == node.id => return,
+                        Some(node_id) if *node_id == node.id() => return,
                         _ => {}
                     }
 
-                    if node.name.to_lowercase() == *name {
+                    if get_element_data!(node).name().to_lowercase() == *name {
                         while let Some(node_id) = self.open_elements.pop() {
-                            if node_id == node.id {
+                            if node_id == node.id() {
                                 break;
                             }
                         }
@@ -596,7 +636,7 @@ impl<'chars> Html5Parser<'chars> {
                     node_idx -= 1;
                     node = get_node_by_id!(self.document, self.open_elements[node_idx]);
 
-                    if !node.is_namespace(HTML_NAMESPACE) {
+                    if !get_element_data!(node).is_namespace(HTML_NAMESPACE) {
                         continue;
                     }
 
@@ -631,16 +671,12 @@ impl<'chars> Html5Parser<'chars> {
     /// Process a token in HTML content
     fn process_html_content(&mut self) {
         if self.ignore_lf {
-            if let Token::Text {
-                text: value,
-                location,
-            } = &self.current_token
-            {
+            if let Token::Text { text: value, location } = &self.current_token {
                 if value.starts_with('\n') {
                     // We don't need to skip 1 char, but we can skip 1 byte, as we just checked for \n
                     self.current_token = Token::Text {
                         text: value.chars().skip(1).collect::<String>(),
-                        location: location.clone(),
+                        location: *location,
                     };
                 }
             }
@@ -661,10 +697,7 @@ impl<'chars> Html5Parser<'chars> {
                         // ignore token
                     }
                     Token::Comment { .. } => {
-                        self.insert_comment_element(
-                            &self.current_token.clone(),
-                            Some(NodeId::root()),
-                        );
+                        self.insert_comment_element(&self.current_token.clone(), Some(NodeId::root()));
                     }
                     Token::DocType {
                         name,
@@ -675,8 +708,7 @@ impl<'chars> Html5Parser<'chars> {
                     } => {
                         if name.is_some() && name.as_ref().unwrap() != "html"
                             || pub_identifier.is_some()
-                            || (sys_identifier.is_some()
-                                && sys_identifier.as_ref().unwrap() != "about:legacy-compat")
+                            || (sys_identifier.is_some() && sys_identifier.as_ref().unwrap() != "about:legacy-compat")
                         {
                             self.parse_error("doctype not allowed in initial insertion mode");
                         }
@@ -732,10 +764,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.parse_error("doctype not allowed in before html insertion mode");
                     }
                     Token::Comment { .. } => {
-                        self.insert_comment_element(
-                            &self.current_token.clone(),
-                            Some(NodeId::root()),
-                        );
+                        self.insert_comment_element(&self.current_token.clone(), Some(NodeId::root()));
                     }
                     Token::Text { text: value, .. } if self.current_token.is_mixed() => {
                         let tokens = self.split_mixed_token(value);
@@ -872,9 +901,7 @@ impl<'chars> Html5Parser<'chars> {
                         anything_else = true;
                     }
                     Token::StartTag { name, .. } if name == "head" || name == "noscript" => {
-                        self.parse_error(
-                            "head or noscript tag not allowed in after head insertion mode",
-                        );
+                        self.parse_error("head or noscript tag not allowed in after head insertion mode");
                         // ignore token
                     }
                     Token::EndTag { .. } => {
@@ -930,17 +957,14 @@ impl<'chars> Html5Parser<'chars> {
                     }
                     Token::StartTag { name, .. }
                         if [
-                            "base", "basefont", "bgsound", "link", "meta", "noframes", "script",
-                            "style", "template", "title",
+                            "base", "basefont", "bgsound", "link", "meta", "noframes", "script", "style", "template",
+                            "title",
                         ]
                         .contains(&name.as_str()) =>
                     {
                         self.parse_error("invalid start tag in after head insertion mode");
 
-                        assert!(
-                            self.head_element.is_some(),
-                            "Head element should not be None"
-                        );
+                        assert!(self.head_element.is_some(), "Head element should not be None");
 
                         if let Some(node_id) = self.head_element {
                             self.open_elements.push(node_id);
@@ -956,9 +980,7 @@ impl<'chars> Html5Parser<'chars> {
                     Token::EndTag { name, .. } if name == "template" => {
                         self.handle_in_head();
                     }
-                    Token::EndTag { name, .. }
-                        if name == "body" || name == "html" || name == "br" =>
-                    {
+                    Token::EndTag { name, .. } if name == "body" || name == "html" || name == "br" => {
                         anything_else = true;
                     }
                     Token::StartTag { name, .. } if name == "head" => {
@@ -996,7 +1018,7 @@ impl<'chars> Html5Parser<'chars> {
                     Token::Eof { .. } => {
                         self.parse_error("eof not allowed in text insertion mode");
 
-                        if current_node!(self).name == "script" {
+                        if get_element_data!(current_node!(self)).name() == "script" {
                             self.script_already_started = true;
                         }
                         self.open_elements.pop();
@@ -1006,27 +1028,25 @@ impl<'chars> Html5Parser<'chars> {
                     Token::EndTag { name, .. } if name == "style" => {
                         // Fetch first child node id. This should be the inline stylesheet text
                         let style_node = current_node!(self);
-                        if style_node.children.is_empty() {
+                        if style_node.children().is_empty() {
                             self.open_elements.pop();
                             self.insertion_mode = self.original_insertion_mode;
                             return;
                         }
 
-                        let style_text_node_id = *style_node.children.first().unwrap();
+                        let style_text_node_id = *style_node.children().first().unwrap();
 
                         // Fetch node
                         let style_text_node = self
                             .document
                             .get()
-                            .get_node_by_id(style_text_node_id)
+                            .node_by_id(style_text_node_id)
                             .expect("Style text node not found")
                             .clone();
 
                         // Load stylesheet from text node
-                        if let Some(stylesheet) =
-                            self.load_inline_stylesheet(CssOrigin::Author, &style_text_node)
-                        {
-                            self.document.get_mut().stylesheets.push(stylesheet);
+                        if let Some(stylesheet) = self.load_inline_stylesheet(CssOrigin::Author, &style_text_node) {
+                            self.document.get_mut().add_stylesheet(stylesheet);
                         }
 
                         self.open_elements.pop();
@@ -1067,9 +1087,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.tokenizer.insert_tokens_at_queue_start(&tokens);
                     }
                     Token::Text { .. } if self.current_token.is_null() => {
-                        self.parse_error(
-                            "null character not allowed in in table text insertion mode",
-                        );
+                        self.parse_error("null character not allowed in in table text insertion mode");
                         // ignore token
                     }
                     Token::Text { text: value, .. } => {
@@ -1082,9 +1100,7 @@ impl<'chars> Html5Parser<'chars> {
 
                         for c in self.pending_table_character_tokens.chars() {
                             if !c.is_ascii_whitespace() {
-                                self.parse_error(
-                                    "non whitespace character in pending table character tokens",
-                                );
+                                self.parse_error("non whitespace character in pending table character tokens");
                                 process_as_intable_anything_else = true;
                                 break;
                             }
@@ -1125,8 +1141,7 @@ impl<'chars> Html5Parser<'chars> {
                     }
                     Token::StartTag { name, .. }
                         if [
-                            "caption", "col", "colgroup", "tbody", "td", "tfoot", "th", "thead",
-                            "tr",
+                            "caption", "col", "colgroup", "tbody", "td", "tfoot", "th", "thead", "tr",
                         ]
                         .contains(&name.as_str()) =>
                     {
@@ -1158,9 +1173,7 @@ impl<'chars> Html5Parser<'chars> {
                 if process_incaption_body {
                     if !self.open_elements_has("caption") {
                         // fragment case
-                        self.parse_error(
-                            "caption end tag not allowed in in caption insertion mode",
-                        );
+                        self.parse_error("caption end tag not allowed in in caption insertion mode");
                         // ignore token
                         self.reprocess_token = false;
                         return;
@@ -1168,7 +1181,7 @@ impl<'chars> Html5Parser<'chars> {
 
                     self.generate_implied_end_tags(None, false);
 
-                    if current_node!(self).name != "caption" {
+                    if get_element_data!(current_node!(self)).name() != "caption" {
                         self.parse_error("caption end tag not at top of stack");
                     }
 
@@ -1198,9 +1211,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.handle_in_body();
                     }
                     Token::StartTag {
-                        name,
-                        is_self_closing,
-                        ..
+                        name, is_self_closing, ..
                     } if name == "col" => {
                         self.acknowledge_closing_tag(*is_self_closing);
 
@@ -1217,7 +1228,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.handle_in_body();
                     }
                     Token::EndTag { name, .. } if name == "colgroup" => {
-                        if current_node!(self).name != "colgroup" {
+                        if get_element_data!(current_node!(self)).name() != "colgroup" {
                             self.parse_error("colgroup end tag not at top of stack");
                             // ignore token
                             return;
@@ -1232,7 +1243,7 @@ impl<'chars> Html5Parser<'chars> {
                         // ignore token
                     }
                     _ => {
-                        if current_node!(self).name != "colgroup" {
+                        if get_element_data!(current_node!(self)).name() != "colgroup" {
                             self.parse_error("colgroup end tag not at top of stack");
                             // ignore token
                             return;
@@ -1253,9 +1264,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.insertion_mode = InsertionMode::InRow;
                     }
                     Token::StartTag { name, .. } if name == "th" || name == "td" => {
-                        self.parse_error(
-                            "th or td tag not allowed in in table body insertion mode",
-                        );
+                        self.parse_error("th or td tag not allowed in in table body insertion mode");
 
                         self.clear_stack_back_to_table_body_context();
 
@@ -1270,9 +1279,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.insertion_mode = InsertionMode::InRow;
                         self.reprocess_token = true;
                     }
-                    Token::EndTag { name, .. }
-                        if name == "tbody" || name == "tfoot" || name == "thead" =>
-                    {
+                    Token::EndTag { name, .. } if name == "tbody" || name == "tfoot" || name == "thead" => {
                         if !self.is_in_scope(name, HTML_NAMESPACE, Scope::Table) {
                             self.parse_error("tbody, tfoot or thead tag not allowed in in table body insertion mode");
                             // ignore token
@@ -1285,8 +1292,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.insertion_mode = InsertionMode::InTable;
                     }
                     Token::StartTag { name, .. }
-                        if ["caption", "col", "colgroup", "tbody", "tfoot", "thead"]
-                            .contains(&name.as_str()) =>
+                        if ["caption", "col", "colgroup", "tbody", "tfoot", "thead"].contains(&name.as_str()) =>
                     {
                         if !self.is_in_scope("tbody", HTML_NAMESPACE, Scope::Table)
                             && !self.is_in_scope("tfoot", HTML_NAMESPACE, Scope::Table)
@@ -1308,9 +1314,7 @@ impl<'chars> Html5Parser<'chars> {
                             && !self.is_in_scope("tfoot", HTML_NAMESPACE, Scope::Table)
                             && !self.is_in_scope("thead", HTML_NAMESPACE, Scope::Table)
                         {
-                            self.parse_error(
-                                "table end tag not allowed in in table body insertion mode",
-                            );
+                            self.parse_error("table end tag not allowed in in table body insertion mode");
                             return;
                         }
 
@@ -1321,10 +1325,8 @@ impl<'chars> Html5Parser<'chars> {
                         self.reprocess_token = true;
                     }
                     Token::EndTag { name, .. }
-                        if [
-                            "body", "caption", "col", "colgroup", "html", "td", "th", "tr",
-                        ]
-                        .contains(&name.as_str()) =>
+                        if ["body", "caption", "col", "colgroup", "html", "td", "th", "tr"]
+                            .contains(&name.as_str()) =>
                     {
                         self.parse_error("end tag not allowed in in table body insertion mode");
                         // ignore token
@@ -1357,10 +1359,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.insertion_mode = InsertionMode::InTableBody;
                     }
                     Token::StartTag { name, .. }
-                        if [
-                            "caption", "col", "colgroup", "tbody", "tfoot", "thead", "tr",
-                        ]
-                        .contains(&name.as_str()) =>
+                        if ["caption", "col", "colgroup", "tbody", "tfoot", "thead", "tr"].contains(&name.as_str()) =>
                     {
                         if !self.is_in_scope("tr", HTML_NAMESPACE, Scope::Table) {
                             self.parse_error("caption, col, colgroup, tbody, tfoot or thead tag not allowed in in row insertion mode");
@@ -1387,9 +1386,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.insertion_mode = InsertionMode::InTableBody;
                         self.reprocess_token = true;
                     }
-                    Token::EndTag { name, .. }
-                        if name == "tbody" || name == "tfoot" || name == "thead" =>
-                    {
+                    Token::EndTag { name, .. } if name == "tbody" || name == "tfoot" || name == "thead" => {
                         if !self.is_in_scope(name, HTML_NAMESPACE, Scope::Table) {
                             self.parse_error("tbody, tfoot or thead tag not allowed in in table body insertion mode");
                             // ignore token
@@ -1434,7 +1431,7 @@ impl<'chars> Html5Parser<'chars> {
                         }
                         self.generate_implied_end_tags(None, false);
 
-                        if current_node!(self).name != token_name {
+                        if get_element_data!(current_node!(self)).name() != token_name {
                             self.parse_error("current node should be th or td");
                         }
 
@@ -1446,8 +1443,7 @@ impl<'chars> Html5Parser<'chars> {
                     }
                     Token::StartTag { name, .. }
                         if [
-                            "caption", "col", "colgroup", "tbody", "td", "tfoot", "th", "thead",
-                            "tr",
+                            "caption", "col", "colgroup", "tbody", "td", "tfoot", "th", "thead", "tr",
                         ]
                         .contains(&name.as_str()) =>
                     {
@@ -1474,11 +1470,7 @@ impl<'chars> Html5Parser<'chars> {
                         // ignore token
                     }
                     Token::EndTag { name, .. }
-                        if name == "table"
-                            || name == "tbody"
-                            || name == "tfoot"
-                            || name == "thead"
-                            || name == "tr" =>
+                        if name == "table" || name == "tbody" || name == "tfoot" || name == "thead" || name == "tr" =>
                     {
                         if !self.is_in_scope(name.as_str(), HTML_NAMESPACE, Scope::Table) {
                             self.parse_error("tbody, tfoot or thead tag not allowed in in table body insertion mode");
@@ -1547,10 +1539,7 @@ impl<'chars> Html5Parser<'chars> {
                     }
                     Token::Comment { .. } => {
                         let html_node_id = self.open_elements.first().unwrap_or_default();
-                        self.insert_comment_element(
-                            &self.current_token.clone(),
-                            Some(*html_node_id),
-                        );
+                        self.insert_comment_element(&self.current_token.clone(), Some(*html_node_id));
                     }
                     Token::DocType { .. } => {
                         self.parse_error("doctype not allowed in after body insertion mode");
@@ -1562,9 +1551,7 @@ impl<'chars> Html5Parser<'chars> {
                     Token::EndTag { name, .. } if name == "html" => {
                         if self.is_fragment_case {
                             // fragment case
-                            self.parse_error(
-                                "html end tag not allowed in after body insertion mode",
-                            );
+                            self.parse_error("html end tag not allowed in after body insertion mode");
                             // ignore token
                             return;
                         }
@@ -1603,7 +1590,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.insert_html_element(&self.current_token.clone());
                     }
                     Token::EndTag { name, .. } if name == "frameset" => {
-                        if current_node!(self).name == "html" {
+                        if get_element_data!(current_node!(self)).name() == "html" {
                             // fragment case
                             self.parse_error("frameset tag not allowed in frameset insertion mode");
                             // ignore token
@@ -1612,15 +1599,13 @@ impl<'chars> Html5Parser<'chars> {
 
                         self.open_elements.pop();
 
-                        if !self.is_fragment_case && current_node!(self).name != "frameset" {
+                        if !self.is_fragment_case && get_element_data!(current_node!(self)).name() != "frameset" {
                             // fragment case
                             self.insertion_mode = InsertionMode::AfterFrameset;
                         }
                     }
                     Token::StartTag {
-                        name,
-                        is_self_closing,
-                        ..
+                        name, is_self_closing, ..
                     } if name == "frame" => {
                         self.acknowledge_closing_tag(*is_self_closing);
 
@@ -1631,7 +1616,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.handle_in_head();
                     }
                     Token::Eof { .. } => {
-                        if current_node!(self).name != "html" {
+                        if get_element_data!(current_node!(self)).name() != "html" {
                             self.parse_error("eof not allowed in frameset insertion mode");
                         }
                         self.stop_parsing();
@@ -1671,9 +1656,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.stop_parsing();
                     }
                     _ => {
-                        self.parse_error(
-                            "anything else not allowed in after frameset insertion mode",
-                        );
+                        self.parse_error("anything else not allowed in after frameset insertion mode");
                         // ignore token
                     }
                 }
@@ -1699,9 +1682,7 @@ impl<'chars> Html5Parser<'chars> {
                     self.stop_parsing();
                 }
                 _ => {
-                    self.parse_error(
-                        "anything else not allowed in after after body insertion mode",
-                    );
+                    self.parse_error("anything else not allowed in after after body insertion mode");
                     self.insertion_mode = InsertionMode::InBody;
                     self.reprocess_token = true;
                 }
@@ -1709,10 +1690,7 @@ impl<'chars> Html5Parser<'chars> {
             InsertionMode::AfterAfterFrameset => {
                 match &self.current_token {
                     Token::Comment { .. } => {
-                        self.insert_comment_element(
-                            &self.current_token.clone(),
-                            Some(NodeId::root()),
-                        );
+                        self.insert_comment_element(&self.current_token.clone(), Some(NodeId::root()));
                     }
                     Token::DocType { .. } => {
                         self.handle_in_body();
@@ -1734,9 +1712,7 @@ impl<'chars> Html5Parser<'chars> {
                         self.handle_in_head();
                     }
                     _ => {
-                        self.parse_error(
-                            "anything else not allowed in after after frameset insertion mode",
-                        );
+                        self.parse_error("anything else not allowed in after after frameset insertion mode");
                         // ignore token
                     }
                 }
@@ -1744,12 +1720,12 @@ impl<'chars> Html5Parser<'chars> {
         }
     }
 
-    fn set_quirks_mode(&mut self, mode: QuirksMode) {
-        self.document.get_mut().quirks_mode = mode;
+    fn set_quirks_mode(&mut self, quirks_mode: QuirksMode) {
+        self.document.get_mut().set_quirks_mode(quirks_mode);
     }
 
     fn is_iframesrcdoc(&self) -> bool {
-        self.document.get().doctype == DocumentType::IframeSrcDoc
+        self.document.get().doctype() == DocumentType::IframeSrcDoc
     }
 
     /// Enables or disables scripting
@@ -1770,8 +1746,9 @@ impl<'chars> Html5Parser<'chars> {
                 break;
             }
 
-            if current_node!(self).name == name && current_node!(self).is_namespace(HTML_NAMESPACE)
-            {
+            let node = current_node!(self);
+            let element_data = get_element_data!(node);
+            if element_data.name() == name && element_data.is_namespace(HTML_NAMESPACE) {
                 self.open_elements.pop();
                 break;
             }
@@ -1788,7 +1765,7 @@ impl<'chars> Html5Parser<'chars> {
                 break;
             }
 
-            if current_node!(self).name == name {
+            if get_element_data!(current_node!(self)).name() == name {
                 self.open_elements.pop();
                 break;
             }
@@ -1805,8 +1782,9 @@ impl<'chars> Html5Parser<'chars> {
                 break;
             }
 
-            let tag = get_node_by_id!(self.document, node_id.expect("node_id not found")).name;
-            if arr.contains(&tag.as_str()) {
+            let element_node = get_node_by_id!(self.document, node_id.unwrap());
+            let data = get_element_data!(element_node);
+            if arr.contains(&data.name()) {
                 break;
             }
         }
@@ -1814,15 +1792,16 @@ impl<'chars> Html5Parser<'chars> {
 
     /// Remove the given node_id from the open elements stack. Will do nothing when the node_id is not found
     fn open_elements_remove(&mut self, target_node_id: NodeId) {
-        self.open_elements
-            .retain(|&node_id| node_id != target_node_id);
+        self.open_elements.retain(|&node_id| node_id != target_node_id);
     }
 
     /// Pops the last element from the open elements, and panics if it is not $name
     fn pop_check(&mut self, name: &str) {
         let node_id = self.open_elements.pop().expect("Open elements is empty");
+        let node = get_node_by_id!(self.document, node_id);
+
         assert_eq!(
-            get_node_by_id!(self.document, node_id).name,
+            get_element_data!(node).name(),
             name,
             "{name} tag should be popped from open elements",
         );
@@ -1831,8 +1810,10 @@ impl<'chars> Html5Parser<'chars> {
     /// Checks if the last element on the open elements is $name, and panics if not
     fn check_last_element(&self, name: &str) {
         let node_id = self.open_elements.last().unwrap_or_default();
+        let node = get_node_by_id!(self.document, *node_id);
+
         assert_eq!(
-            get_node_by_id!(self.document, *node_id).name,
+            get_element_data!(node).name(),
             name,
             "{name} tag should be last element in open elements"
         );
@@ -1841,12 +1822,10 @@ impl<'chars> Html5Parser<'chars> {
     /// Returns true when the open elements have $name
     fn open_elements_has(&self, name: &str) -> bool {
         self.open_elements.iter().rev().any(|node_id| {
-            self.document
-                .get()
-                .get_node_by_id(*node_id)
-                .expect("node not found")
-                .name
-                == name
+            let node = get_node_by_id!(self.document, *node_id);
+            let data = get_element_data!(node);
+
+            data.name() == name
         })
     }
 
@@ -1863,7 +1842,7 @@ impl<'chars> Html5Parser<'chars> {
     }
 
     /// Create a new node that is not connected or attached to the document arena
-    fn create_node(&self, token: &Token, namespace: &str) -> Node {
+    fn create_node(&self, token: &Token, namespace: &str) -> D::Node {
         match token {
             Token::DocType {
                 name,
@@ -1871,42 +1850,42 @@ impl<'chars> Html5Parser<'chars> {
                 pub_identifier,
                 sys_identifier,
                 location,
-            } => Node::new_doctype(
-                &self.document,
+            } => D::new_doctype_node(
+                self.document.clone(),
                 &name.clone().unwrap_or_default(),
-                &pub_identifier.clone().unwrap_or_default(),
-                &sys_identifier.clone().unwrap_or_default(),
-                location.clone(),
+                match pub_identifier {
+                    Some(value) => Some(value.as_str()),
+                    None => None,
+                },
+                match sys_identifier {
+                    Some(value) => Some(value.as_str()),
+                    None => None,
+                },
+                *location,
             ),
             Token::StartTag {
                 name,
                 attributes,
                 location,
                 ..
-            } => Node::new_element(
-                &self.document,
+            } => D::new_element_node(
+                self.document.clone(),
                 name,
+                namespace.into(),
                 attributes.clone(),
-                namespace,
-                location.clone(),
-            ),
-            Token::EndTag { name, location, .. } => Node::new_element(
-                &self.document,
-                name,
-                HashMap::new(),
-                namespace,
-                location.clone(),
+                *location,
             ),
+            Token::EndTag { name, location, .. } => {
+                D::new_element_node(self.document.clone(), name, namespace.into(), HashMap::new(), *location)
+            }
             Token::Comment {
                 comment: value,
                 location,
                 ..
-            } => Node::new_comment(&self.document, location.clone(), value),
+            } => D::new_comment_node(self.document.clone(), value, *location),
             Token::Text {
-                text: value,
-                location,
-                ..
-            } => Node::new_text(&self.document, location.clone(), value.to_string().as_str()),
+                text: value, location, ..
+            } => D::new_text_node(self.document.clone(), value.as_str(), *location),
             Token::Eof { .. } => {
                 panic!("EOF token not allowed");
             }
@@ -1926,8 +1905,11 @@ impl<'chars> Html5Parser<'chars> {
                 return;
             }
 
-            let tag = current_node!(self).name.clone();
-            let is_html = current_node!(self).is_namespace(HTML_NAMESPACE);
+            let node = current_node!(self);
+            let data = get_element_data!(node);
+            let tag = data.name();
+
+            let is_html = get_element_data!(node).is_namespace(HTML_NAMESPACE);
             if let Some(except) = except {
                 if except == tag && is_html {
                     return;
@@ -1935,18 +1917,15 @@ impl<'chars> Html5Parser<'chars> {
             }
             if thoroughly {
                 if !([
-                    "tbody", "td", "tfoot", "th", "thead", "tr", "dd", "dt", "li", "option",
-                    "optgroup", "p", "rb", "rp", "rt", "rtc",
+                    "tbody", "td", "tfoot", "th", "thead", "tr", "dd", "dt", "li", "option", "optgroup", "p", "rb",
+                    "rp", "rt", "rtc",
                 ]
-                .contains(&tag.as_str())
+                .contains(&tag)
                     && is_html)
                 {
                     return;
                 }
-            } else if !([
-                "dd", "dt", "li", "option", "optgroup", "p", "rb", "rp", "rt", "rtc",
-            ]
-            .contains(&tag.as_str())
+            } else if !(["dd", "dt", "li", "option", "optgroup", "p", "rb", "rp", "rt", "rtc"].contains(&tag)
                 && is_html)
             {
                 return;
@@ -1975,7 +1954,7 @@ impl<'chars> Html5Parser<'chars> {
                     .clone();
                 }
             }
-            match node.name.as_str() {
+            match get_element_data!(node).name() {
                 "select" => {
                     if last {
                         self.insertion_mode = InsertionMode::InSelect;
@@ -1991,7 +1970,8 @@ impl<'chars> Html5Parser<'chars> {
 
                         ancestor_idx -= 1;
                         let ancestor = open_elements_get!(self, ancestor_idx);
-                        match ancestor.name.as_str() {
+                        let data = get_element_data!(ancestor);
+                        match data.name() {
                             "template" => {
                                 self.insertion_mode = InsertionMode::InSelect;
                                 return;
@@ -2070,7 +2050,7 @@ impl<'chars> Html5Parser<'chars> {
     /// Pop all elements back to a table context
     fn clear_stack_back_to_table_context(&mut self) {
         while !self.open_elements.is_empty() {
-            if ["table", "template", "html"].contains(&current_node!(self).name.as_str()) {
+            if ["table", "template", "html"].contains(&get_element_data!(current_node!(self)).name()) {
                 return;
             }
             self.open_elements.pop();
@@ -2080,8 +2060,7 @@ impl<'chars> Html5Parser<'chars> {
     /// Pop all elements back to a table context
     fn clear_stack_back_to_table_body_context(&mut self) {
         while !self.open_elements.is_empty() {
-            if ["tbody", "tfoot", "thead", "template", "html"]
-                .contains(&current_node!(self).name.as_str())
+            if ["tbody", "tfoot", "thead", "template", "html"].contains(&get_element_data!(current_node!(self)).name())
             {
                 return;
             }
@@ -2092,8 +2071,9 @@ impl<'chars> Html5Parser<'chars> {
     /// Pop all elements back to a table row context
     fn clear_stack_back_to_table_row_context(&mut self) {
         while !self.open_elements.is_empty() {
-            let val = current_node!(self).name.clone();
-            if ["tr", "template", "html"].contains(&val.as_str()) {
+            let node = current_node!(self);
+            let data = get_element_data!(node);
+            if ["tr", "template", "html"].contains(&data.name()) {
                 return;
             }
             self.open_elements.pop();
@@ -2104,7 +2084,12 @@ impl<'chars> Html5Parser<'chars> {
     fn is_in_scope(&self, tag: &str, namespace: &str, scope: Scope) -> bool {
         for &node_id in self.open_elements.iter().rev() {
             let node = get_node_by_id!(self.document, node_id).clone();
-            if node.name == tag && node.is_namespace(namespace) {
+            if !node.is_element_node() {
+                return false;
+            }
+
+            let node_element_data = get_element_data!(node);
+            if node_element_data.name() == tag && node_element_data.is_namespace(namespace) {
                 return true;
             }
             let default_html_scope = [
@@ -2114,50 +2099,50 @@ impl<'chars> Html5Parser<'chars> {
             let default_svg_scope = ["foreignObject", "desc", "title"];
             match scope {
                 Scope::Regular => {
-                    if (node.is_namespace(HTML_NAMESPACE)
-                        && default_html_scope.contains(&node.name.as_str()))
-                        || (node.is_namespace(MATHML_NAMESPACE)
-                            && default_mathml_scope.contains(&node.name.as_str()))
-                        || (node.is_namespace(SVG_NAMESPACE)
-                            && default_svg_scope.contains(&node.name.as_str()))
+                    if (node_element_data.is_namespace(HTML_NAMESPACE)
+                        && default_html_scope.contains(&node_element_data.name()))
+                        || (node_element_data.is_namespace(MATHML_NAMESPACE)
+                            && default_mathml_scope.contains(&node_element_data.name()))
+                        || (node_element_data.is_namespace(SVG_NAMESPACE)
+                            && default_svg_scope.contains(&node_element_data.name()))
                     {
                         return false;
                     }
                 }
                 Scope::ListItem => {
-                    if (node.is_namespace(HTML_NAMESPACE)
-                        && (default_html_scope.contains(&node.name.as_str())
-                            || ["ol", "ul"].contains(&node.name.as_str())))
-                        || (node.is_namespace(MATHML_NAMESPACE)
-                            && default_mathml_scope.contains(&node.name.as_str()))
-                        || (node.is_namespace(SVG_NAMESPACE)
-                            && default_svg_scope.contains(&node.name.as_str()))
+                    if (node_element_data.is_namespace(HTML_NAMESPACE)
+                        && (default_html_scope.contains(&node_element_data.name())
+                            || ["ol", "ul"].contains(&node_element_data.name())))
+                        || (node_element_data.is_namespace(MATHML_NAMESPACE)
+                            && default_mathml_scope.contains(&node_element_data.name()))
+                        || (node_element_data.is_namespace(SVG_NAMESPACE)
+                            && default_svg_scope.contains(&node_element_data.name()))
                     {
                         return false;
                     }
                 }
                 Scope::Button => {
-                    if (node.is_namespace(HTML_NAMESPACE)
-                        && (default_html_scope.contains(&node.name.as_str())
-                            || node.name == "button"))
-                        || (node.is_namespace(MATHML_NAMESPACE)
-                            && default_mathml_scope.contains(&node.name.as_str()))
-                        || (node.is_namespace(SVG_NAMESPACE)
-                            && default_svg_scope.contains(&node.name.as_str()))
+                    if (node_element_data.is_namespace(HTML_NAMESPACE)
+                        && (default_html_scope.contains(&node_element_data.name())
+                            || node_element_data.name() == "button"))
+                        || (node_element_data.is_namespace(MATHML_NAMESPACE)
+                            && default_mathml_scope.contains(&node_element_data.name()))
+                        || (node_element_data.is_namespace(SVG_NAMESPACE)
+                            && default_svg_scope.contains(&node_element_data.name()))
                     {
                         return false;
                     }
                 }
                 Scope::Table => {
-                    if node.is_namespace(HTML_NAMESPACE)
-                        && ["html", "template", "table"].contains(&node.name.as_str())
+                    if node_element_data.is_namespace(HTML_NAMESPACE)
+                        && ["html", "template", "table"].contains(&node_element_data.name())
                     {
                         return false;
                     }
                 }
                 Scope::Select => {
-                    if !(node.is_namespace(HTML_NAMESPACE)
-                        && ["optgroup", "option"].contains(&node.name.as_str()))
+                    if !(node_element_data.is_namespace(HTML_NAMESPACE)
+                        && ["optgroup", "option"].contains(&node_element_data.name()))
                     {
                         return false;
                     }
@@ -2172,7 +2157,10 @@ impl<'chars> Html5Parser<'chars> {
     fn close_cell(&mut self) {
         self.generate_implied_end_tags(None, false);
 
-        let tag = current_node!(self).name;
+        let node = current_node!(self);
+        let data = get_element_data!(node);
+        let tag = data.name();
+
         if tag != "td" && tag != "th" {
             self.parse_error("current node should be td or th");
         }
@@ -2211,9 +2199,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.parse_error("doctype not allowed in in body insertion mode");
                 // ignore token
             }
-            Token::StartTag {
-                name, attributes, ..
-            } if name == "html" => {
+            Token::StartTag { name, attributes, .. } if name == "html" => {
                 self.parse_error("html tag not allowed in in body insertion mode");
 
                 if self.open_elements_has("template") {
@@ -2223,17 +2209,19 @@ impl<'chars> Html5Parser<'chars> {
 
                 // Add attributes to html element
                 let first_node_id = *self.open_elements.first().unwrap();
-                let mut doc = self.document.get_mut();
-                let first_node = doc
-                    .get_node_by_id_mut(first_node_id)
-                    .expect("node not found");
-                if let NodeData::Element(element) = &mut first_node.data {
+                let mut first_node = get_node_by_id!(self.document, first_node_id);
+                // let mut first_node = doc.node_by_id(first_node_id).expect("node not found");
+
+                if first_node.is_element_node() {
+                    let element_data = get_element_data_mut!(first_node);
                     for (key, value) in attributes {
-                        if !element.attributes.contains_key(key) {
-                            element.attributes.insert(key.to_owned(), value.to_owned());
+                        if !element_data.attributes().contains_key(key) {
+                            element_data.add_attribute(key, value);
                         }
                     }
-                };
+                    let mut doc = self.document.get_mut();
+                    doc.update_node(first_node);
+                }
             }
             Token::StartTag { name, .. }
                 if name == "base"
@@ -2252,13 +2240,11 @@ impl<'chars> Html5Parser<'chars> {
             Token::EndTag { name, .. } if name == "template" => {
                 self.handle_in_head();
             }
-            Token::StartTag {
-                name, attributes, ..
-            } if name == "body" => {
+            Token::StartTag { name, attributes, .. } if name == "body" => {
                 self.parse_error("body tag not allowed in in body insertion mode");
 
                 if self.open_elements.len() == 1
-                    || open_elements_get!(self, 1).name != "body"
+                    || get_element_data!(open_elements_get!(self, 1)).name() != "body"
                     || self.open_elements_has("template")
                 {
                     // fragment case
@@ -2268,30 +2254,32 @@ impl<'chars> Html5Parser<'chars> {
 
                 self.frameset_ok = false;
 
-                let body_node_id = self.open_elements.iter().find(|node_id| {
-                    let node = get_node_by_id!(self.document, **node_id);
-                    node.name == "body" && node.is_namespace(HTML_NAMESPACE)
+                let body_node_id = self.open_elements.iter().find(|&node_id| {
+                    let node = get_node_by_id!(self.document, *node_id);
+                    let node_element_data = get_element_data!(node);
+
+                    node_element_data.name() == "body" && node_element_data.is_namespace(HTML_NAMESPACE)
                 });
 
-                if let Some(body_node_id) = body_node_id {
-                    let mut doc = self.document.get_mut();
-                    let body_node = doc
-                        .get_node_by_id_mut(*body_node_id)
-                        .expect("node not found");
+                if let Some(&body_node_id) = body_node_id {
+                    let mut body_node = get_node_by_id!(self.document, body_node_id);
 
-                    if let NodeData::Element(element) = &mut body_node.data {
+                    if body_node.is_element_node() {
+                        let element_data = get_element_data_mut!(body_node);
                         for (key, value) in attributes {
-                            if !element.attributes.contains_key(key) {
-                                element.attributes.insert(key.to_owned(), value.to_owned());
+                            if !element_data.attributes().contains_key(key) {
+                                element_data.add_attribute(key, value);
                             }
                         }
+                        let mut doc = self.document.get_mut();
+                        doc.update_node(body_node);
                     }
                 }
             }
             Token::StartTag { name, .. } if name == "frameset" => {
                 self.parse_error("frameset tag not allowed in in body insertion mode");
 
-                if self.open_elements.len() == 1 || open_elements_get!(self, 1).name != "body" {
+                if self.open_elements.len() == 1 || get_element_data!(open_elements_get!(self, 1)).name() != "body" {
                     // ignore token
                     return;
                 }
@@ -2304,14 +2292,12 @@ impl<'chars> Html5Parser<'chars> {
                 if self.open_elements.len() > 1 {
                     let second_node_id = self.open_elements[1];
                     let second_node = get_node_by_id!(self.document, second_node_id);
-                    if second_node.parent.is_some() {
-                        self.document
-                            .get_mut()
-                            .detach_node_from_parent(second_node_id);
+                    if second_node.parent_id().is_some() {
+                        self.document.get_mut().detach_node(second_node_id)
                     }
                 }
 
-                while current_node!(self).name != "html" {
+                while get_element_data!(current_node!(self)).name() != "html" {
                     self.open_elements.pop();
                 }
 
@@ -2384,19 +2370,13 @@ impl<'chars> Html5Parser<'chars> {
                 self.insert_html_element(&self.current_token.clone());
             }
             Token::StartTag { name, .. }
-                if name == "h1"
-                    || name == "h2"
-                    || name == "h3"
-                    || name == "h4"
-                    || name == "h5"
-                    || name == "h6" =>
+                if name == "h1" || name == "h2" || name == "h3" || name == "h4" || name == "h5" || name == "h6" =>
             {
                 if self.is_in_scope("p", HTML_NAMESPACE, Scope::Button) {
                     self.close_p_element();
                 }
 
-                if ["h1", "h2", "h3", "h4", "h5", "h6"].contains(&current_node!(self).name.as_str())
-                {
+                if ["h1", "h2", "h3", "h4", "h5", "h6"].contains(&get_element_data!(current_node!(self)).name()) {
                     self.parse_error("h1-h6 not allowed in in body insertion mode");
                     self.open_elements.pop();
                 }
@@ -2436,12 +2416,13 @@ impl<'chars> Html5Parser<'chars> {
                 let mut idx = self.open_elements.len() - 1;
                 loop {
                     let node = open_elements_get!(self, idx);
-                    let tag = node.name.clone();
+                    let node_element_data = get_element_data!(node);
+                    let tag = node_element_data.name();
 
                     if tag == "li" {
                         self.generate_implied_end_tags(Some("li"), false);
 
-                        if current_node!(self).name != "li" {
+                        if get_element_data!(current_node!(self)).name() != "li" {
                             self.parse_error("li tag not at top of stack");
                         }
 
@@ -2449,7 +2430,7 @@ impl<'chars> Html5Parser<'chars> {
                         break;
                     }
 
-                    if !["address", "div", "p"].contains(&tag.as_str()) && node.is_special() {
+                    if !["address", "div", "p"].contains(&tag) && node_element_data.is_special() {
                         break;
                     }
 
@@ -2468,20 +2449,21 @@ impl<'chars> Html5Parser<'chars> {
                 let mut idx = self.open_elements.len() - 1;
                 loop {
                     let node = open_elements_get!(self, idx);
-                    let tag = node.name.clone();
+                    let node_element_data = get_element_data!(node);
+                    let tag = node_element_data.name();
 
-                    if ["dd", "dt"].contains(&tag.as_str()) {
-                        self.generate_implied_end_tags(Some(tag.as_str()), false);
+                    if ["dd", "dt"].contains(&tag) {
+                        self.generate_implied_end_tags(Some(tag), false);
 
-                        if current_node!(self).name != tag {
+                        if get_element_data!(current_node!(self)).name() != tag {
                             self.parse_error("{tag} tag not at top of stack");
                         }
 
-                        self.pop_until_named(tag.as_str());
+                        self.pop_until_named(tag);
                         break;
                     }
 
-                    if !["address", "div", "p"].contains(&tag.as_str()) && node.is_special() {
+                    if !["address", "div", "p"].contains(&tag) && node_element_data.is_special() {
                         break;
                     }
 
@@ -2551,8 +2533,7 @@ impl<'chars> Html5Parser<'chars> {
 
                 self.generate_implied_end_tags(None, false);
 
-                let cn = current_node!(self);
-                if cn.name != *name {
+                if get_element_data!(current_node!(self)).name() != *name {
                     self.parse_error("end tag not at top of stack");
                 }
 
@@ -2568,8 +2549,7 @@ impl<'chars> Html5Parser<'chars> {
 
                     self.generate_implied_end_tags(None, false);
 
-                    let cn = current_node!(self);
-                    if cn.name != *name {
+                    if get_element_data!(current_node!(self)).name() != *name {
                         self.parse_error("end tag not at top of stack");
                     }
 
@@ -2578,8 +2558,7 @@ impl<'chars> Html5Parser<'chars> {
                     let node_id = self.form_element;
                     self.form_element = None;
 
-                    if node_id.is_none() || !self.is_in_scope(name, HTML_NAMESPACE, Scope::Regular)
-                    {
+                    if node_id.is_none() || !self.is_in_scope(name, HTML_NAMESPACE, Scope::Regular) {
                         self.parse_error("end tag not in scope");
                         // ignore token
                         return;
@@ -2588,12 +2567,11 @@ impl<'chars> Html5Parser<'chars> {
 
                     self.generate_implied_end_tags(None, false);
 
-                    let cn = current_node!(self);
-                    if cn.name != *name {
+                    if get_element_data!(current_node!(self)).name() != *name {
                         self.parse_error("end tag not at top of stack");
                     }
 
-                    if node_id != cn.id {
+                    if node_id != current_node!(self).id() {
                         self.parse_error("end tag not at top of stack");
                     }
                     self.open_elements_remove(node_id);
@@ -2623,7 +2601,7 @@ impl<'chars> Html5Parser<'chars> {
 
                 self.generate_implied_end_tags(Some("li"), false);
 
-                if current_node!(self).name != *name {
+                if get_element_data!(current_node!(self)).name() != *name {
                     self.parse_error("end tag not at top of stack");
                 }
 
@@ -2638,19 +2616,14 @@ impl<'chars> Html5Parser<'chars> {
 
                 self.generate_implied_end_tags(Some(name), false);
 
-                if current_node!(self).name != *name {
+                if get_element_data!(current_node!(self)).name() != *name {
                     self.parse_error("end tag not at top of stack");
                 }
 
                 self.pop_until_named(name);
             }
             Token::EndTag { name, .. }
-                if name == "h1"
-                    || name == "h2"
-                    || name == "h3"
-                    || name == "h4"
-                    || name == "h5"
-                    || name == "h6" =>
+                if name == "h1" || name == "h2" || name == "h3" || name == "h4" || name == "h5" || name == "h6" =>
             {
                 if ["h1", "h2", "h3", "h4", "h5", "h6"]
                     .iter()
@@ -2659,7 +2632,7 @@ impl<'chars> Html5Parser<'chars> {
                 {
                     self.generate_implied_end_tags(Some(name), false);
 
-                    if current_node!(self).name != *name {
+                    if get_element_data!(current_node!(self)).name() != *name {
                         self.parse_error("end tag not at top of stack");
                     }
 
@@ -2740,9 +2713,7 @@ impl<'chars> Html5Parser<'chars> {
                 #[cfg(all(feature = "debug_parser", test))]
                 self.display_debug_info();
             }
-            Token::StartTag { name, .. }
-                if name == "applet" || name == "marquee" || name == "object" =>
-            {
+            Token::StartTag { name, .. } if name == "applet" || name == "marquee" || name == "object" => {
                 self.reconstruct_formatting();
 
                 self.insert_html_element(&self.current_token.clone());
@@ -2750,9 +2721,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.active_formatting_elements_push_marker();
                 self.frameset_ok = false;
             }
-            Token::EndTag { name, .. }
-                if name == "applet" || name == "marquee" || name == "object" =>
-            {
+            Token::EndTag { name, .. } if name == "applet" || name == "marquee" || name == "object" => {
                 if !self.is_in_scope(name, HTML_NAMESPACE, Scope::Regular) {
                     self.parse_error("end tag not in scope");
                     // ignore token
@@ -2761,7 +2730,7 @@ impl<'chars> Html5Parser<'chars> {
 
                 self.generate_implied_end_tags(None, false);
 
-                if current_node!(self).name != *name {
+                if get_element_data!(current_node!(self)).name() != *name {
                     self.parse_error("end tag not at top of stack");
                 }
 
@@ -2769,7 +2738,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.active_formatting_elements_clear_until_marker();
             }
             Token::StartTag { name, .. } if name == "table" => {
-                if self.document.get_mut().quirks_mode != QuirksMode::Quirks
+                if self.document.get_mut().quirks_mode() != QuirksMode::Quirks
                     && self.is_in_scope("p", HTML_NAMESPACE, Scope::Button)
                 {
                     self.close_p_element();
@@ -2781,9 +2750,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.insertion_mode = InsertionMode::InTable;
             }
             Token::EndTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } if name == "br" => {
                 self.parse_error("br end tag not allowed");
                 self.reconstruct_formatting();
@@ -2801,9 +2768,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.frameset_ok = false;
             }
             Token::StartTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } if name == "area"
                 || name == "br"
                 || name == "embed"
@@ -2832,16 +2797,12 @@ impl<'chars> Html5Parser<'chars> {
 
                 self.acknowledge_closing_tag(*is_self_closing);
 
-                if !attributes.contains_key("type")
-                    || attributes.get("type").unwrap().to_lowercase() != *"hidden"
-                {
+                if !attributes.contains_key("type") || attributes.get("type").unwrap().to_lowercase() != *"hidden" {
                     self.frameset_ok = false;
                 }
             }
             Token::StartTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } if name == "param" || name == "source" || name == "track" => {
                 self.insert_html_element(&self.current_token.clone());
                 self.open_elements.pop();
@@ -2849,9 +2810,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.acknowledge_closing_tag(*is_self_closing);
             }
             Token::StartTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } if name == "hr" => {
                 if self.is_in_scope("p", HTML_NAMESPACE, Scope::Button) {
                     self.close_p_element();
@@ -2926,7 +2885,7 @@ impl<'chars> Html5Parser<'chars> {
                 }
             }
             Token::StartTag { name, .. } if name == "optgroup" || name == "option" => {
-                if current_node!(self).name == "option" {
+                if get_element_data!(current_node!(self)).name() == "option" {
                     self.open_elements.pop();
                 }
 
@@ -2939,7 +2898,7 @@ impl<'chars> Html5Parser<'chars> {
                     self.generate_implied_end_tags(None, false);
                 }
 
-                if current_node!(self).name != "ruby" {
+                if get_element_data!(current_node!(self)).name() != "ruby" {
                     self.parse_error("rb or rtc not in scope");
                 }
 
@@ -2950,7 +2909,9 @@ impl<'chars> Html5Parser<'chars> {
                     self.generate_implied_end_tags(Some("rtc"), false);
                 }
 
-                if current_node!(self).name != "rtc" && current_node!(self).name != "ruby" {
+                if get_element_data!(current_node!(self)).name() != "rtc"
+                    && get_element_data!(current_node!(self)).name() != "ruby"
+                {
                     self.parse_error("rp or rt not in scope");
                 }
 
@@ -3072,9 +3033,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.open_elements.pop();
             }
             Token::StartTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } if name == "meta" => {
                 self.acknowledge_closing_tag(*is_self_closing);
 
@@ -3104,7 +3063,7 @@ impl<'chars> Html5Parser<'chars> {
             Token::StartTag { name, .. } if name == "script" => {
                 let insert_position = self.appropriate_place_insert(None);
                 let node = self.create_node(&self.current_token.clone(), HTML_NAMESPACE);
-                let node_id = self.document.get_mut().add_new_node(node);
+                let node_id = self.document.get_mut().register_node(node);
                 self.insert_element_helper(node_id, insert_position);
 
                 // TODO Set the element's parser document to the Document, and set the element's force async to false.
@@ -3149,13 +3108,17 @@ impl<'chars> Html5Parser<'chars> {
                 //
 
                 {
-                    let current_node_id = current_node!(self).id;
+                    let current_node_id = current_node!(self).id();
 
-                    let doc = Document::clone(&self.document);
-                    let mut doc_mut = self.document.get_mut();
-                    let node = doc_mut.get_node_by_id_mut(node_id).expect("node not found");
-                    if let NodeData::Element(ref mut data) = node.data {
-                        data.template_contents = Some(DocumentFragment::new(doc, current_node_id));
+                    let clone_document = self.document.clone();
+
+                    let mut binding = self.document.get_mut();
+                    let mut node = binding.cloned_node_by_id(node_id).expect("node not found");
+                    if node.is_element_node() {
+                        let element_data = get_element_data_mut!(node);
+                        element_data.set_template_contents(D::Fragment::new(clone_document, current_node_id));
+
+                        binding.update_node(node);
                     }
                 }
             }
@@ -3168,7 +3131,7 @@ impl<'chars> Html5Parser<'chars> {
 
                 self.generate_implied_end_tags(None, true);
 
-                if current_node!(self).name != "template" {
+                if get_element_data!(current_node!(self)).name() != "template" {
                     self.parse_error("template end tag not at top of stack");
                 }
 
@@ -3222,11 +3185,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.handle_in_head();
             }
             Token::StartTag { name, .. }
-                if name == "caption"
-                    || name == "colgroup"
-                    || name == "tbody"
-                    || name == "tfoot"
-                    || name == "thead" =>
+                if name == "caption" || name == "colgroup" || name == "tbody" || name == "tfoot" || name == "thead" =>
             {
                 self.template_insertion_mode.pop();
                 self.template_insertion_mode.push(InsertionMode::InTable);
@@ -3236,15 +3195,13 @@ impl<'chars> Html5Parser<'chars> {
             }
             Token::StartTag { name, .. } if name == "col" => {
                 self.template_insertion_mode.pop();
-                self.template_insertion_mode
-                    .push(InsertionMode::InColumnGroup);
+                self.template_insertion_mode.push(InsertionMode::InColumnGroup);
                 self.insertion_mode = InsertionMode::InColumnGroup;
                 self.reprocess_token = true;
             }
             Token::StartTag { name, .. } if name == "tr" => {
                 self.template_insertion_mode.pop();
-                self.template_insertion_mode
-                    .push(InsertionMode::InTableBody);
+                self.template_insertion_mode.push(InsertionMode::InTableBody);
                 self.insertion_mode = InsertionMode::InTableBody;
                 self.reprocess_token = true;
             }
@@ -3290,7 +3247,7 @@ impl<'chars> Html5Parser<'chars> {
             Token::Text { .. }
                 if ["table", "tbody", "template", "tfoot", "tr"]
                     .iter()
-                    .any(|&node| node == current_node!(self).name) =>
+                    .any(|&node| node == get_element_data!(current_node!(self)).name()) =>
             {
                 self.pending_table_character_tokens = String::new();
                 self.original_insertion_mode = self.insertion_mode;
@@ -3329,9 +3286,7 @@ impl<'chars> Html5Parser<'chars> {
                 self.insertion_mode = InsertionMode::InColumnGroup;
                 self.reprocess_token = true;
             }
-            Token::StartTag { name, .. }
-                if name == "tbody" || name == "tfoot" || name == "thead" =>
-            {
+            Token::StartTag { name, .. } if name == "tbody" || name == "tfoot" || name == "thead" => {
                 self.clear_stack_back_to_table_context();
 
                 self.insert_html_element(&self.current_token.clone());
@@ -3391,9 +3346,7 @@ impl<'chars> Html5Parser<'chars> {
                 // ignore token
                 return;
             }
-            Token::StartTag { name, .. }
-                if name == "style" || name == "script" || name == "template" =>
-            {
+            Token::StartTag { name, .. } if name == "style" || name == "script" || name == "template" => {
                 self.handle_in_head();
             }
             Token::EndTag { name, .. } if name == "template" => {
@@ -3405,9 +3358,7 @@ impl<'chars> Html5Parser<'chars> {
                 attributes,
                 ..
             } if name == "input" => {
-                if !attributes.contains_key("type")
-                    || attributes.get("type").unwrap().to_lowercase() != *"hidden"
-                {
+                if !attributes.contains_key("type") || attributes.get("type").unwrap().to_lowercase() != *"hidden" {
                     anything_else = true;
                 } else {
                     self.parse_error("input tag not allowed in in table insertion mode");
@@ -3471,33 +3422,31 @@ impl<'chars> Html5Parser<'chars> {
                 self.handle_in_body();
             }
             Token::StartTag { name, .. } if name == "option" => {
-                if current_node!(self).name == "option" {
+                if get_element_data!(current_node!(self)).name() == "option" {
                     self.open_elements.pop();
                 }
 
                 self.insert_html_element(&self.current_token.clone());
             }
             Token::StartTag { name, .. } if name == "optgroup" => {
-                if current_node!(self).name == "option" {
+                if get_element_data!(current_node!(self)).name() == "option" {
                     self.open_elements.pop();
                 }
 
-                if current_node!(self).name == "optgroup" {
+                if get_element_data!(current_node!(self)).name() == "optgroup" {
                     self.open_elements.pop();
                 }
 
                 self.insert_html_element(&self.current_token.clone());
             }
             Token::StartTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } if name == "hr" => {
-                if current_node!(self).name == "option" {
+                if get_element_data!(current_node!(self)).name() == "option" {
                     self.open_elements.pop();
                 }
 
-                if current_node!(self).name == "optgroup" {
+                if get_element_data!(current_node!(self)).name() == "optgroup" {
                     self.open_elements.pop();
                 }
 
@@ -3507,14 +3456,14 @@ impl<'chars> Html5Parser<'chars> {
                 self.open_elements.pop();
             }
             Token::EndTag { name, .. } if name == "optgroup" => {
-                if current_node!(self).name == "option"
+                if get_element_data!(current_node!(self)).name() == "option"
                     && self.open_elements.len() > 1
-                    && open_elements_get!(self, self.open_elements.len() - 2).name == "optgroup"
+                    && get_element_data!(open_elements_get!(self, self.open_elements.len() - 2)).name() == "optgroup"
                 {
                     self.open_elements.pop();
                 }
 
-                if current_node!(self).name == "optgroup" {
+                if get_element_data!(current_node!(self)).name() == "optgroup" {
                     self.open_elements.pop();
                 } else {
                     self.parse_error("optgroup end tag not allowed in in select insertion mode");
@@ -3522,7 +3471,7 @@ impl<'chars> Html5Parser<'chars> {
                 }
             }
             Token::EndTag { name, .. } if name == "option" => {
-                if current_node!(self).name == "option" {
+                if get_element_data!(current_node!(self)).name() == "option" {
                     self.open_elements.pop();
                 } else {
                     self.parse_error("option end tag not allowed in in select insertion mode");
@@ -3552,12 +3501,8 @@ impl<'chars> Html5Parser<'chars> {
                 self.pop_until_named("select");
                 self.reset_insertion_mode();
             }
-            Token::StartTag { name, .. }
-                if name == "input" || name == "keygen" || name == "textarea" =>
-            {
-                self.parse_error(
-                    "input, keygen or textarea tag not allowed in in select insertion mode",
-                );
+            Token::StartTag { name, .. } if name == "input" || name == "keygen" || name == "textarea" => {
+                self.parse_error("input, keygen or textarea tag not allowed in in select insertion mode");
 
                 if !self.is_in_scope("select", HTML_NAMESPACE, Scope::Select) {
                     // fragment case
@@ -3597,7 +3542,7 @@ impl<'chars> Html5Parser<'chars> {
             match self.active_formatting_elements[idx] {
                 ActiveElement::Marker => return None,
                 ActiveElement::Node(node_id) => {
-                    if get_node_by_id!(self.document, node_id).name == tag {
+                    if get_element_data!(get_node_by_id!(self.document, node_id)).name() == tag {
                         return Some(node_id);
                     }
                 }
@@ -3629,11 +3574,10 @@ impl<'chars> Html5Parser<'chars> {
 
     /// Remove the given node_id from the active formatting elements list. Will do nothing when the node is not found
     fn active_formatting_elements_remove(&mut self, target_node_id: NodeId) {
-        self.active_formatting_elements
-            .retain(|node_id| match node_id {
-                ActiveElement::Node(node_id) => *node_id != target_node_id,
-                ActiveElement::Marker => true,
-            });
+        self.active_formatting_elements.retain(|node_id| match node_id {
+            ActiveElement::Node(node_id) => *node_id != target_node_id,
+            ActiveElement::Marker => true,
+        });
     }
 
     /// Push a node onto the active formatting stack, make sure only max 3 of them can be added (between markers)
@@ -3641,12 +3585,14 @@ impl<'chars> Html5Parser<'chars> {
         let mut matched = 0;
         let mut first_matched = None;
         let node = get_node_by_id!(self.document, node_id);
+        let node_element_data = get_element_data!(node);
+
         for entry in self.active_formatting_elements.iter().rev() {
             match entry {
                 ActiveElement::Marker => break,
                 &ActiveElement::Node(id) => {
                     let current_node = get_node_by_id!(self.document, id);
-                    if current_node.matches_tag_and_attrs_without_order(&node) {
+                    if get_element_data!(current_node).matches_tag_and_attrs_without_order(node_element_data) {
                         if matched >= 2 {
                             first_matched = Some(id);
                             break;
@@ -3661,8 +3607,7 @@ impl<'chars> Html5Parser<'chars> {
                 .retain(|n| n != &ActiveElement::Node(first_matched));
         }
 
-        self.active_formatting_elements
-            .push(ActiveElement::Node(node_id));
+        self.active_formatting_elements.push(ActiveElement::Node(node_id));
     }
 
     fn reconstruct_formatting(&mut self) {
@@ -3737,7 +3682,7 @@ impl<'chars> Html5Parser<'chars> {
     fn close_p_element(&mut self) {
         self.generate_implied_end_tags(Some("p"), false);
 
-        if current_node!(self).name != "p" {
+        if get_element_data!(current_node!(self)).name() != "p" {
             self.parse_error("p element not at top of stack");
         }
 
@@ -3750,9 +3695,7 @@ impl<'chars> Html5Parser<'chars> {
             let mut new_attributes = HashMap::new();
             for (name, value) in attributes.iter() {
                 if SVG_ADJUSTMENTS_ATTRIBUTES.contains_key(name) {
-                    let &new_name = SVG_ADJUSTMENTS_ATTRIBUTES
-                        .get(name)
-                        .expect("svg adjustments");
+                    let &new_name = SVG_ADJUSTMENTS_ATTRIBUTES.get(name).expect("svg adjustments");
                     new_attributes.insert(new_name.to_owned(), value.clone());
                 } else {
                     new_attributes.insert(name.clone(), value.clone());
@@ -3792,8 +3735,7 @@ impl<'chars> Html5Parser<'chars> {
             let mut new_attributes = HashMap::new();
             for (name, value) in attributes.iter() {
                 if XML_ADJUSTMENTS.contains_key(name) {
-                    let (prefix, local_name, _namespace) =
-                        XML_ADJUSTMENTS.get(name).expect("cml adjustments");
+                    let (prefix, local_name, _namespace) = XML_ADJUSTMENTS.get(name).expect("cml adjustments");
                     new_attributes.insert(format!("{prefix} {local_name}"), value.clone());
                 } else {
                     new_attributes.insert(name.clone(), value.clone());
@@ -3831,7 +3773,11 @@ impl<'chars> Html5Parser<'chars> {
         print!("Open elements   : [ ");
         for node_id in &self.open_elements {
             let node = get_node_by_id!(self.document, *node_id);
-            print!("({}) {}, ", node_id, node.name);
+            if node.is_element_node() {
+                print!("({}) {}, ", node_id, node.get_element_data().unwrap().name());
+            } else {
+                print!("({}), ", node_id);
+            }
         }
         println!("]");
 
@@ -3840,7 +3786,11 @@ impl<'chars> Html5Parser<'chars> {
             match elem {
                 ActiveElement::Node(node_id) => {
                     let node = get_node_by_id!(self.document, *node_id);
-                    print!("({}) {}, ", node_id, node.name);
+                    if node.is_element_node() {
+                        print!("({}) {}, ", node_id, node.get_element_data().unwrap().name());
+                    } else {
+                        print!("({}), ", node_id);
+                    }
                 }
                 ActiveElement::Marker => {
                     print!("marker, ");
@@ -3849,9 +3799,6 @@ impl<'chars> Html5Parser<'chars> {
         }
         println!("]");
 
-        println!("Output:");
-        println!("{}", self.document);
-
         std::io::stdout().flush().ok();
     }
 
@@ -3868,16 +3815,16 @@ impl<'chars> Html5Parser<'chars> {
             let node_id = self.open_elements[idx];
             let node = get_node_by_id!(self.document, node_id).clone();
 
-            if node.name == tag_name {
-                self.generate_implied_end_tags(Some(node.name.as_str()), false);
+            if get_element_data!(node).name() == tag_name {
+                self.generate_implied_end_tags(Some(get_element_data!(node).name()), false);
 
                 // It might be possible that the last item is not our node_id. Emit parse error if so
-                if current_node!(self).id != node.id {
+                if current_node!(self).id() != node.id() {
                     self.parse_error("end tag not at top of stack");
                 }
 
                 // Pop until we reach the node.id
-                while current_node!(self).id != node.id {
+                while current_node!(self).id() != node.id() {
                     self.open_elements.pop();
                 }
                 // Pop node_id as well
@@ -3886,7 +3833,7 @@ impl<'chars> Html5Parser<'chars> {
                 break;
             }
 
-            if node.is_special() {
+            if get_element_data!(node).is_special() {
                 self.parse_error("special node");
                 // ignore token
                 return;
@@ -3901,13 +3848,10 @@ impl<'chars> Html5Parser<'chars> {
             };
         }
 
-        let namespace = self
-            .get_adjusted_current_node()
-            .namespace
-            .expect("namespace not found");
-
+        let node = self.get_adjusted_current_node();
+        let data = get_element_data!(node);
         ParserData {
-            adjusted_node_namespace: namespace,
+            adjusted_node_namespace: data.namespace().to_string(),
         }
     }
 
@@ -3917,20 +3861,10 @@ impl<'chars> Html5Parser<'chars> {
     fn fetch_next_token(&mut self) -> Token {
         // If there are no tokens to fetch, fetch the next token from the tokenizer
         if self.token_queue.is_empty() {
-            let token = self
-                .tokenizer
-                .next_token(self.parser_data())
-                .expect("tokenizer error");
+            let token = self.tokenizer.next_token(self.parser_data()).expect("tokenizer error");
 
-            if let Token::Text {
-                text: value,
-                location,
-            } = token
-            {
-                self.token_queue.push(Token::Text {
-                    text: value,
-                    location: location.clone(),
-                });
+            if let Token::Text { text: value, location } = token {
+                self.token_queue.push(Token::Text { text: value, location });
                 // for c in value.chars() {
                 //     self.token_queue.push(Token::Text(c.to_string()));
                 // }
@@ -3946,7 +3880,7 @@ impl<'chars> Html5Parser<'chars> {
         token.expect("no token found")
     }
 
-    fn get_adjusted_current_node(&self) -> Node {
+    fn get_adjusted_current_node(&self) -> D::Node {
         if self.is_fragment_case && self.open_elements.len() == 1 {
             // fragment case
             return get_node_by_id!(
@@ -3968,33 +3902,33 @@ impl<'chars> Html5Parser<'chars> {
             return DispatcherMode::Html;
         }
 
-        if acn.is_namespace(HTML_NAMESPACE) {
+        let acn_element_data = get_element_data!(acn);
+        if acn_element_data.is_namespace(HTML_NAMESPACE) {
             return DispatcherMode::Html;
         }
 
-        if acn.is_mathml_integration_point()
-            && (!self.current_token.is_start_tag("mglyph")
-                && !self.current_token.is_start_tag("malignmark"))
+        if acn_element_data.is_mathml_integration_point()
+            && (!self.current_token.is_start_tag("mglyph") && !self.current_token.is_start_tag("malignmark"))
         {
             return DispatcherMode::Html;
         }
 
-        if acn.is_mathml_integration_point() && self.current_token.is_text_token() {
+        if acn_element_data.is_mathml_integration_point() && self.current_token.is_text_token() {
             return DispatcherMode::Html;
         }
 
-        if acn.is_namespace(MATHML_NAMESPACE)
-            && acn.name == "annotation-xml"
+        if acn_element_data.is_namespace(MATHML_NAMESPACE)
+            && acn_element_data.name() == "annotation-xml"
             && self.current_token.is_start_tag("svg")
         {
             return DispatcherMode::Html;
         }
 
-        if acn.is_html_integration_point() && self.current_token.is_any_start_tag() {
+        if acn_element_data.is_html_integration_point() && self.current_token.is_any_start_tag() {
             return DispatcherMode::Html;
         }
 
-        if acn.is_html_integration_point() && self.current_token.is_text_token() {
+        if acn_element_data.is_html_integration_point() && self.current_token.is_text_token() {
             return DispatcherMode::Html;
         }
 
@@ -4010,18 +3944,23 @@ impl<'chars> Html5Parser<'chars> {
     fn process_unexpected_html_tag(&mut self) {
         self.parse_error("process_unexpected_html_tag");
 
-        let mut current_node = current_node!(self);
+        let mut tmp_node = current_node!(self);
+        let mut current_node_element_data = get_element_data!(tmp_node);
 
-        while !current_node.is_mathml_integration_point()
-            && !current_node.is_html_integration_point()
-            && !current_node.is_namespace(HTML_NAMESPACE)
+        while !current_node_element_data.is_mathml_integration_point()
+            && !current_node_element_data.is_html_integration_point()
+            && !current_node_element_data.is_namespace(HTML_NAMESPACE)
         {
             self.open_elements.pop();
             if self.open_elements.is_empty() {
                 return;
             }
 
-            current_node = current_node!(self);
+            // Make sure tmp_node that current_node_element_data relies on is dropped, so we can change it.
+            let _ = current_node_element_data;
+
+            tmp_node = current_node!(self);
+            current_node_element_data = get_element_data!(tmp_node);
         }
 
         // Process as HTML content
@@ -4029,11 +3968,13 @@ impl<'chars> Html5Parser<'chars> {
     }
 
     /// Find the correct tokenizer state when we are about to parse a fragment case
-    fn find_initial_state_for_context(&self, context_node: &Node) -> State {
-        if !context_node.is_namespace(HTML_NAMESPACE) {
+    fn find_initial_state_for_context(&self, context_node: &D::Node) -> State {
+        let context_node_element_data = get_element_data!(context_node);
+        if !context_node_element_data.is_namespace(HTML_NAMESPACE) {
             return State::Data;
         }
-        match context_node.name.as_str() {
+
+        match context_node_element_data.name() {
             "title" | "textarea" => State::RCDATA,
             "style" | "xmp" | "iframe" | "noembed" | "noframes" => State::RAWTEXT,
             "script" => State::ScriptData,
@@ -4050,12 +3991,12 @@ impl<'chars> Html5Parser<'chars> {
     }
 
     // Initialize all parser settings for parsing a fragment case
-    fn initialize_fragment_case(&mut self, context_node: &Node) {
+    fn initialize_fragment_case(&mut self, context_node: &D::Node) {
         self.is_fragment_case = true;
-        if let Some(doc) = context_node.document.upgrade() {
-            self.context_doc = Some(DocumentHandle(doc));
-        }
-        self.context_node_id = Some(context_node.id);
+
+        self.context_doc = Some(context_node.handle().clone());
+        self.context_node_id = Some(context_node.id());
+
         self.tokenizer
             .set_state(self.find_initial_state_for_context(context_node));
     }
@@ -4157,38 +4098,34 @@ impl<'chars> Html5Parser<'chars> {
     }
 
     /// Load an inline stylesheet from the <style>-node
-    fn load_inline_stylesheet(&self, origin: CssOrigin, node: &Node) -> Option<CssStylesheet> {
-        if !node.is_text() {
+    fn load_inline_stylesheet(&self, origin: CssOrigin, node: &D::Node) -> Option<C::Stylesheet> {
+        if !node.is_text_node() {
             return None;
         }
 
-        let source = match &self.document.get().location {
-            Some(location) => format!("{}#inline", location),
+        let source_url = match &self.document.get().url() {
+            Some(url) => format!("{}#inline", url),
             None => "<unknown>#inline".into(),
         };
 
         let config = ParserConfig {
-            source: Some(source.clone()),
+            context: Context::Stylesheet,
+            location: Default::default(),
+            source: Some(source_url.clone()),
             ignore_errors: true,
-            ..Default::default()
+            match_values: false,
         };
 
-        match Css3::parse(node.as_text().value.as_str(), config) {
-            Ok(ast) => {
-                match convert_ast_to_stylesheet(&ast, origin, &source) {
-                    Ok(sheet) => return Some(sheet),
-                    Err(err) => warn!("Error while converting CSS AST to rules: {} ", err),
+        if let Some(data) = node.get_text_data() {
+            match C::parse_str(data.value(), config, origin, &source_url.clone()) {
+                Ok(stylesheet) => return Some(stylesheet),
+                Err(err) => {
+                    warn!("Error while parsing CSS stylesheet: {} ", err.to_string());
                 }
-                None
-            }
-            Err(err) => {
-                warn!(
-                    "Error while parsing CSS stylesheet: {} ",
-                    err.message.clone()
-                );
-                None
             }
         }
+
+        None
     }
 
     /// Load and parse an external stylesheet by URL
@@ -4198,7 +4135,7 @@ impl<'chars> Html5Parser<'chars> {
     }
 
     #[cfg(not(target_arch = "wasm32"))]
-    fn load_external_stylesheet(&self, origin: CssOrigin, url: Url) -> Option<CssStylesheet> {
+    fn load_external_stylesheet(&self, origin: CssOrigin, url: Url) -> Option<C::Stylesheet> {
         let css = if url.scheme() == "http" || url.scheme() == "https" {
             // Fetch the html from the url
             let response = ureq::get(url.as_ref()).call();
@@ -4208,7 +4145,6 @@ impl<'chars> Html5Parser<'chars> {
                     url,
                     response.unwrap_err()
                 );
-
                 return None;
             }
             let response = response.expect("result");
@@ -4219,7 +4155,6 @@ impl<'chars> Html5Parser<'chars> {
                     url,
                     response.status()
                 );
-
                 return None;
             }
             if response.content_type() != "text/css" {
@@ -4232,11 +4167,7 @@ impl<'chars> Html5Parser<'chars> {
             match response.into_string() {
                 Ok(css) => css,
                 Err(err) => {
-                    warn!(
-                        "Could not load external stylesheet from {}. Error: {}",
-                        url, err
-                    );
-
+                    warn!("Could not load external stylesheet from {}. Error: {}", url, err);
                     return None;
                 }
             }
@@ -4246,19 +4177,12 @@ impl<'chars> Html5Parser<'chars> {
             match std::fs::read_to_string(path) {
                 Ok(css) => css,
                 Err(err) => {
-                    warn!(
-                        "Could not load external stylesheet from {}. Error: {}",
-                        url, err
-                    );
-
+                    warn!("Could not load external stylesheet from {}. Error: {}", url, err);
                     return None;
                 }
             }
         } else {
-            warn!(
-                "Unsupported URL scheme for external stylesheet: {}",
-                url.scheme()
-            );
+            warn!("Unsupported URL scheme for external stylesheet: {}", url.scheme());
             return None;
         };
 
@@ -4268,19 +4192,10 @@ impl<'chars> Html5Parser<'chars> {
             ..Default::default()
         };
 
-        match Css3::parse(css.as_str(), config) {
-            Ok(ast) => {
-                match convert_ast_to_stylesheet(&ast, origin, url.to_string().as_str()) {
-                    Ok(sheet) => return Some(sheet),
-                    Err(err) => warn!("Error while converting CSS AST to rules: {} ", err),
-                }
-                None
-            }
+        match C::parse_str(css.as_str(), config, origin, url.as_str()) {
+            Ok(stylesheet) => Some(stylesheet),
             Err(err) => {
-                warn!(
-                    "Error while parsing CSS stylesheet: {} ",
-                    err.message.clone()
-                );
+                warn!("Error while parsing CSS stylesheet: {} ", err.to_string());
                 None
             }
         }
@@ -4319,11 +4234,7 @@ impl<'chars> Html5Parser<'chars> {
         ];
         if parser_in_body && !body_ok_types.contains(&rel.as_str()) {
             self.parse_error(
-                format!(
-                    "link element with rel attribute '{}' is not supported in the body",
-                    rel
-                )
-                .as_str(),
+                format!("link element with rel attribute '{}' is not supported in the body", rel).as_str(),
             );
             return;
         }
@@ -4335,9 +4246,11 @@ impl<'chars> Html5Parser<'chars> {
                     Ok(url) => url,
                     Err(_err) => {
                         // Relative URL
-                        if self.document.get().location.is_some() {
+                        if self.document.get().url().is_some() {
                             let binding = self.document.get();
-                            let base_url = binding.location.as_ref().unwrap();
+                            let url = binding.url();
+
+                            let base_url = url.as_ref().unwrap();
                             base_url.join(href).unwrap()
                         } else {
                             self.parse_error("link element without base url not supported yet");
@@ -4345,17 +4258,16 @@ impl<'chars> Html5Parser<'chars> {
                         }
                     }
                 };
-                if let Some(stylesheet) = self.load_external_stylesheet(CssOrigin::Author, css_url)
-                {
-                    self.document.get_mut().stylesheets.push(stylesheet);
+                if let Some(stylesheet) = self.load_external_stylesheet(CssOrigin::Author, css_url) {
+                    println!("success: loaded external stylesheet");
+                    let mut mut_handle = self.document.clone();
+                    mut_handle.get_mut().add_stylesheet(stylesheet);
                 } else {
                     println!("failed loading stylesheet")
                 }
             }
             _ => {
-                self.parse_error(
-                    format!("link element with rel attribute '{}' is not supported", rel).as_str(),
-                );
+                self.parse_error(format!("link element with rel attribute '{}' is not supported", rel).as_str());
             }
         }
     }
@@ -4363,25 +4275,34 @@ impl<'chars> Html5Parser<'chars> {
 
 #[cfg(test)]
 mod test {
-    use gosub_shared::byte_stream::Encoding;
-
-    use crate::parser::document::DocumentBuilder;
-
     use super::*;
+    use crate::document::builder::DocumentBuilderImpl;
+    use crate::document::document_impl::DocumentImpl;
+    use crate::node::data::element::ElementData;
+    use crate::node::node_impl::NodeDataTypeInternal;
+    use crate::node::node_impl::NodeImpl;
+    use gosub_css3::system::Css3System;
+    use gosub_shared::byte_stream::Encoding;
+    use gosub_shared::traits::node::ClassList;
 
     macro_rules! node_create {
         ($self:expr, $name:expr) => {{
-            let node = Node::new_element(
-                &$self.document,
-                $name,
-                HashMap::new(),
-                HTML_NAMESPACE,
+            let node = NodeImpl::new(
+                $self.document.clone(),
                 Location::default(),
+                &NodeDataTypeInternal::Element(ElementData::new(
+                    $self.document.clone(),
+                    $name,
+                    Some(HTML_NAMESPACE),
+                    HashMap::new(),
+                    Default::default(),
+                )),
             );
             let node_id = $self
                 .document
+                .clone()
                 .get_mut()
-                .add_node(node, NodeId::root(), None);
+                .register_node_at(node, NodeId::root(), None);
             $self.open_elements.push(node_id);
         }};
     }
@@ -4389,7 +4310,7 @@ mod test {
     #[test]
     fn is_in_scope() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "div");
@@ -4404,7 +4325,7 @@ mod test {
     #[test]
     fn is_in_scope_empty_stack() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         parser.open_elements.clear();
         assert!(!parser.is_in_scope("p", HTML_NAMESPACE, Scope::Regular));
@@ -4416,7 +4337,7 @@ mod test {
     #[test]
     fn is_in_scope_non_existing_node() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "div");
@@ -4432,7 +4353,7 @@ mod test {
     #[test]
     fn is_in_scope_1() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "div");
@@ -4470,7 +4391,7 @@ mod test {
     #[test]
     fn is_in_scope_2() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "body");
@@ -4489,7 +4410,7 @@ mod test {
     #[test]
     fn is_in_scope_3() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "body");
@@ -4508,7 +4429,7 @@ mod test {
     #[test]
     fn is_in_scope_4() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "body");
@@ -4529,7 +4450,7 @@ mod test {
     #[test]
     fn is_in_scope_5() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "body");
@@ -4549,7 +4470,7 @@ mod test {
     #[test]
     fn is_in_scope_6() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "body");
@@ -4569,7 +4490,7 @@ mod test {
     #[test]
     fn is_in_scope_7() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "body");
@@ -4588,7 +4509,7 @@ mod test {
     #[test]
     fn is_in_scope_8() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let mut parser = Html5Parser::new_parser(stream, Location::default());
+        let mut parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         node_create!(parser, "html");
         node_create!(parser, "body");
@@ -4606,16 +4527,14 @@ mod test {
     #[test]
     fn reconstruct_formatting() {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
-        stream.read_from_str(
-            "<p><b>bold<i>bold and italic</b>italic</i></p>",
-            Some(Encoding::UTF8),
-        );
+        stream.read_from_str("<p><b>bold<i>bold and italic</b>italic</i></p>", Some(Encoding::UTF8));
         stream.close();
 
-        let document = DocumentBuilder::new_document(None);
-        let _ = Html5Parser::parse_document(&mut stream, Document::clone(&document), None);
+        let doc_handle = DocumentBuilderImpl::new_document(None);
+        let _ =
+            Html5Parser::<DocumentImpl<Css3System>, Css3System>::parse_document(&mut stream, doc_handle.clone(), None);
 
-        println!("{}", document);
+        println!("{}", doc_handle.get());
     }
 
     #[test]
@@ -4624,59 +4543,58 @@ mod test {
         stream.read_from_str("<div class=\"one two three\"></div>", Some(Encoding::UTF8));
         stream.close();
 
-        let document = DocumentBuilder::new_document(None);
-        let _ = Html5Parser::parse_document(&mut stream, Document::clone(&document), None);
+        let doc_handle = DocumentBuilderImpl::new_document(None);
+        let _ =
+            Html5Parser::<DocumentImpl<Css3System>, Css3System>::parse_document(&mut stream, doc_handle.clone(), None);
 
-        let binding = document.get();
+        let binding = doc_handle.get();
 
         // document -> html -> head -> body -> div
-        let div = binding.get_node_by_id(4usize.into()).unwrap();
+        let div = binding.node_by_id(4usize.into()).unwrap();
 
-        let NodeData::Element(element) = &div.data else {
+        let NodeDataTypeInternal::Element(element) = &div.data else {
             panic!()
         };
 
-        assert_eq!(element.classes.len(), 3);
+        assert_eq!(element.classlist().len(), 3);
 
-        assert!(element.classes.contains("one"));
-        assert!(element.classes.contains("two"));
-        assert!(element.classes.contains("three"));
+        assert!(element.classlist().contains("one"));
+        assert!(element.classlist().contains("two"));
+        assert!(element.classlist().contains("three"));
 
-        assert!(element.classes.is_active("one"));
-        assert!(element.classes.is_active("two"));
-        assert!(element.classes.is_active("three"));
+        assert!(element.classlist().is_active("one"));
+        assert!(element.classlist().is_active("two"));
+        assert!(element.classlist().is_active("three"));
     }
 
     #[test]
     fn element_with_classes_extra_whitespace() {
         let mut stream = ByteStream::new(Encoding::UTF8, None);
-        stream.read_from_str(
-            "<div class=\" one    two     three   \"></div>",
-            Some(Encoding::UTF8),
-        );
+        stream.read_from_str("<div class=\" one    two     three   \"></div>", Some(Encoding::UTF8));
         stream.close();
 
-        let document = DocumentBuilder::new_document(None);
-        let _ = Html5Parser::parse_document(&mut stream, Document::clone(&document), None);
+        let doc_handle = DocumentBuilderImpl::new_document(None);
+        let _ =
+            Html5Parser::<DocumentImpl<Css3System>, Css3System>::parse_document(&mut stream, doc_handle.clone(), None);
 
-        let binding = document.get();
+        let binding = doc_handle.get();
 
         // document -> html -> head -> body -> div
-        let div = binding.get_node_by_id(4usize.into()).unwrap();
+        let div = binding.node_by_id(4usize.into()).unwrap();
 
-        let NodeData::Element(element) = &div.data else {
+        let NodeDataTypeInternal::Element(element) = &div.data else {
             panic!()
         };
 
-        assert_eq!(element.classes.len(), 3);
+        assert_eq!(element.classlist().len(), 3);
 
-        assert!(element.classes.contains("one"));
-        assert!(element.classes.contains("two"));
-        assert!(element.classes.contains("three"));
+        assert!(element.classlist().contains("one"));
+        assert!(element.classlist().contains("two"));
+        assert!(element.classlist().contains("three"));
 
-        assert!(element.classes.is_active("one"));
-        assert!(element.classes.is_active("two"));
-        assert!(element.classes.is_active("three"));
+        assert!(element.classlist().is_active("one"));
+        assert!(element.classlist().is_active("two"));
+        assert!(element.classlist().is_active("three"));
     }
 
     #[test]
@@ -4689,11 +4607,13 @@ mod test {
         );
         stream.close();
 
-        let document = DocumentBuilder::new_document(None);
-        let _ = Html5Parser::parse_document(&mut stream, Document::clone(&document), None);
+        let doc_handle = DocumentBuilderImpl::new_document(None);
+        let _ =
+            Html5Parser::<DocumentImpl<Css3System>, Css3System>::parse_document(&mut stream, doc_handle.clone(), None);
 
-        assert!(document.get().get_node_by_named_id("my id").is_none());
-        assert!(document.get().get_node_by_named_id("").is_none());
+        // Any invalid id's are not stored in the document, and thus not searchable
+        assert!(doc_handle.get().get_node_by_named_id("my id").is_none());
+        assert!(doc_handle.get().get_node_by_named_id("").is_none());
     }
 
     #[test]
@@ -4706,13 +4626,14 @@ mod test {
         );
         stream.close();
 
-        let document = DocumentBuilder::new_document(None);
-        let _ = Html5Parser::parse_document(&mut stream, Document::clone(&document), None);
+        let doc_handle = DocumentBuilderImpl::new_document(None);
+        let _ =
+            Html5Parser::<DocumentImpl<Css3System>, Css3System>::parse_document(&mut stream, doc_handle.clone(), None);
 
         // we are expecting the div (ID: 4) and p would be ignored
-        let doc_read = document.get();
+        let doc_read = doc_handle.get();
         let div = doc_read.get_node_by_named_id("myid").unwrap();
         assert_eq!(div.id, NodeId::from(4usize));
-        assert_eq!(div.name, "div");
+        assert_eq!(div.get_element_data().unwrap().name(), "div");
     }
 }
diff --git a/crates/gosub_html5/src/parser/document.rs b/crates/gosub_html5/src/parser/document.rs
deleted file mode 100755
index 249b2cf24..000000000
--- a/crates/gosub_html5/src/parser/document.rs
+++ /dev/null
@@ -1,2280 +0,0 @@
-use core::fmt;
-use core::fmt::Debug;
-use std::cell::RefCell;
-use std::collections::HashMap;
-use std::fmt::Display;
-use std::ops::{Deref, DerefMut};
-use std::rc::{Rc, Weak};
-
-use url::Url;
-
-use gosub_css3::stylesheet::CssStylesheet;
-use gosub_shared::byte_stream::Location;
-use gosub_shared::types::Result;
-
-use crate::element_class::ElementClass;
-use crate::errors::Error;
-use crate::node::arena::NodeArena;
-use crate::node::data::doctype::DocTypeData;
-use crate::node::data::{comment::CommentData, text::TextData};
-use crate::node::HTML_NAMESPACE;
-use crate::node::{Node, NodeData, NodeId};
-use crate::parser::query::SearchType;
-use crate::parser::query::{Condition, Query};
-use crate::parser::quirks::QuirksMode;
-use crate::parser::tree_builder::TreeBuilder;
-use crate::util::is_valid_id_attribute_value;
-use crate::visit::Visitor;
-
-/// Type of the given document
-#[derive(PartialEq, Debug, Copy, Clone)]
-pub enum DocumentType {
-    /// HTML document
-    HTML,
-    /// Iframe source document
-    IframeSrcDoc,
-}
-
-/// Defines a document fragment which can be attached to for instance a <template> element
-#[derive(PartialEq)]
-pub struct DocumentFragment {
-    /// Node elements inside this fragment
-    arena: NodeArena,
-    /// Document handle of the parent
-    pub doc: DocumentHandle,
-    /// Host node on which this fragment is attached
-    host: NodeId,
-}
-
-impl Clone for DocumentFragment {
-    /// Clones the document fragment
-    fn clone(&self) -> Self {
-        Self {
-            arena: self.arena.clone(),
-            doc: Document::clone(&self.doc),
-            host: self.host,
-        }
-    }
-}
-
-impl Debug for DocumentFragment {
-    fn fmt(&self, f: &mut fmt::Formatter) -> fmt::Result {
-        write!(f, "DocumentFragment")
-    }
-}
-
-impl DocumentFragment {
-    /// Creates a new document fragment and attaches it to "host" node inside "doc"
-    #[must_use]
-    pub(crate) fn new(doc: DocumentHandle, host: NodeId) -> Self {
-        Self {
-            arena: NodeArena::new(),
-            doc,
-            host,
-        }
-    }
-}
-
-/// Enum of tasks that can be performed to add or update
-/// update nodes in the tree.
-///
-/// These tasks are generated by a TreeBuilder which is implemented
-/// by DocumentTaskQueue which holds a handle to the actual Document
-/// to commit changes to.
-pub enum DocumentTask {
-    CreateElement {
-        name: String,
-        parent_id: NodeId,
-        position: Option<usize>,
-        namespace: String,
-        location: Location,
-    },
-    CreateText {
-        content: String,
-        parent_id: NodeId,
-        location: Location,
-    },
-    CreateComment {
-        content: String,
-        parent_id: NodeId,
-        location: Location,
-    },
-    InsertAttribute {
-        key: String,
-        value: String,
-        element_id: NodeId,
-        location: Location,
-    },
-}
-
-/// Queue of tasks that will mutate the document to add/update
-/// nodes in the tree. These tasks are performed sequentially in the
-/// order they are created.
-///
-/// Once tasks are queued up, a call to flush() will commit all changes
-/// to the DOM. If there are errors during the application of these changes,
-/// flush() will return a list of the errors encountered but execution is not halted.
-///
-/// create_element() will generate and return a new NodeId for the parser to keep
-/// track of the current context node and optionally store this in a list of open elements.
-/// When encountering a closing tag, the parser must pop this ID off of its list.
-pub struct DocumentTaskQueue {
-    /// Internal counter of the next ID to generate from the NodeArena
-    /// without actually registering the node.
-    /// WARNING: if nodes are registered in the arena while tasks are being queued
-    /// this could lead to conflicts in NodeIds. NodeArena should NOT be used directly
-    /// if using a DocumentTaskQueue.
-    next_node_id: NodeId,
-    /// Reference to the document to commit changes to
-    pub(crate) document: DocumentHandle,
-    /// List of tasks to commit upon flush() which is cleared after execution finishes.
-    // IMPLEMENTATION NOTE: using a vec here since I'm assuming we are
-    // executing all tasks at once. If we need to support stopping task
-    // execution midway, then maybe a real "queue" structure that pops
-    // completed tasks is needed.
-    pub(crate) tasks: Vec<DocumentTask>,
-}
-
-impl DocumentTaskQueue {
-    pub fn is_empty(&self) -> bool {
-        self.tasks.is_empty()
-    }
-
-    #[allow(dead_code)]
-    fn flush(&mut self) -> Vec<String> {
-        let mut errors = Vec::new();
-        for current_task in &self.tasks {
-            match current_task {
-                DocumentTask::CreateElement {
-                    name,
-                    parent_id,
-                    position,
-                    namespace,
-                    location,
-                } => {
-                    self.document.create_element(
-                        name,
-                        *parent_id,
-                        *position,
-                        namespace,
-                        location.clone(),
-                    );
-                }
-                DocumentTask::CreateText {
-                    content,
-                    parent_id,
-                    location,
-                } => {
-                    self.document
-                        .create_text(content, *parent_id, location.clone());
-                }
-                DocumentTask::CreateComment {
-                    content,
-                    parent_id,
-                    location,
-                } => {
-                    self.document
-                        .create_comment(content, *parent_id, location.clone());
-                }
-                DocumentTask::InsertAttribute {
-                    key,
-                    value,
-                    element_id,
-                    location,
-                } => {
-                    if let Err(err) =
-                        self.document
-                            .insert_attribute(key, value, *element_id, location.clone())
-                    {
-                        errors.push(err.to_string());
-                    }
-                }
-            }
-        }
-        self.tasks.clear();
-
-        errors
-    }
-}
-
-// See tree_builder.rs for method comments
-impl TreeBuilder for DocumentTaskQueue {
-    fn create_element(
-        &mut self,
-        name: &str,
-        parent_id: NodeId,
-        position: Option<usize>,
-        namespace: &str,
-        location: Location,
-    ) -> NodeId {
-        let element = DocumentTask::CreateElement {
-            name: name.to_owned(),
-            parent_id,
-            position,
-            namespace: namespace.to_owned(),
-            location,
-        };
-        let new_id = self.next_node_id;
-        self.next_node_id = self.next_node_id.next();
-        self.tasks.push(element);
-
-        new_id
-    }
-
-    fn create_text(&mut self, content: &str, parent_id: NodeId, location: Location) -> NodeId {
-        let text = DocumentTask::CreateText {
-            content: content.to_owned(),
-            parent_id,
-            location,
-        };
-        let new_id = self.next_node_id;
-        self.next_node_id = self.next_node_id.next();
-        self.tasks.push(text);
-
-        new_id
-    }
-
-    fn create_comment(&mut self, content: &str, parent_id: NodeId, location: Location) -> NodeId {
-        let comment = DocumentTask::CreateComment {
-            content: content.to_owned(),
-            parent_id,
-            location,
-        };
-        let new_id = self.next_node_id;
-        self.next_node_id = self.next_node_id.next();
-        self.tasks.push(comment);
-
-        new_id
-    }
-
-    fn insert_attribute(
-        &mut self,
-        key: &str,
-        value: &str,
-        element_id: NodeId,
-        location: Location,
-    ) -> Result<()> {
-        let attribute = DocumentTask::InsertAttribute {
-            key: key.to_owned(),
-            value: value.to_owned(),
-            element_id,
-            location,
-        };
-        self.tasks.push(attribute);
-        Ok(())
-    }
-}
-
-impl DocumentTaskQueue {
-    pub fn new(document: &DocumentHandle) -> Self {
-        let document = Document::clone(document);
-        let next_node_id = document.get().arena.peek_next_id();
-        Self {
-            next_node_id,
-            document,
-            tasks: Vec::new(),
-        }
-    }
-}
-
-/// Defines a document
-#[derive(Debug, PartialEq)]
-pub struct Document {
-    /// Location of the given document (if any)
-    pub location: Option<Url>,
-    /// Holds and owns all nodes in the document
-    pub(crate) arena: NodeArena,
-    /// HTML elements with ID (e.g., <div id="myid">)
-    named_id_elements: HashMap<String, NodeId>,
-    /// Document type of this document
-    pub doctype: DocumentType,
-    /// Quirks mode of this document
-    pub quirks_mode: QuirksMode,
-    /// Loaded stylesheets as extracted from the document
-    pub stylesheets: Vec<CssStylesheet>,
-}
-
-impl Default for Document {
-    /// Returns a default document
-    fn default() -> Self {
-        Self::new(None)
-    }
-}
-
-impl Document {
-    /// Creates a new document
-    #[must_use]
-    pub fn new(location: Option<Url>) -> Self {
-        Self {
-            location,
-            arena: NodeArena::new(),
-            named_id_elements: HashMap::new(),
-            doctype: DocumentType::HTML,
-            quirks_mode: QuirksMode::NoQuirks,
-            stylesheets: Vec::new(),
-        }
-    }
-
-    pub fn count_nodes(&self) -> usize {
-        self.arena.count_nodes()
-    }
-    /// Returns a shared reference-counted handle for the document
-    pub fn shared(location: Option<Url>) -> DocumentHandle {
-        DocumentHandle(Rc::new(RefCell::new(Self::new(location))))
-    }
-
-    pub fn peek_next_id(&self) -> NodeId {
-        self.arena.peek_next_id()
-    }
-
-    /// Fast clone of a lightweight reference-counted handle for the document.  This is a shallow
-    /// clone, and different handles will see the same underlying document.
-    pub fn clone(handle: &DocumentHandle) -> DocumentHandle {
-        DocumentHandle(Rc::clone(&handle.0))
-    }
-
-    /// Fetches a node by id or returns None when no node with this ID is found
-    pub fn get_node_by_id(&self, node_id: NodeId) -> Option<&Node> {
-        self.arena.get_node(node_id)
-    }
-
-    /// Fetches a mutable node by id or returns None when no node with this ID is found
-    pub fn get_node_by_id_mut(&mut self, node_id: NodeId) -> Option<&mut Node> {
-        self.arena.get_node_mut(node_id)
-    }
-
-    /// Removes a node by id from the arena. Note that this does not check the nodelist itself to see
-    /// if the node is still available as a child or parent in the tree.
-    pub fn delete_node(&mut self, node: &Node) {
-        self.arena.delete_node(node.id);
-
-        if node.parent.is_some() {
-            let parent = self.arena.get_node_mut(node.parent.unwrap()).unwrap();
-            parent.children.retain(|&x| x != node.id);
-        }
-    }
-
-    /// Fetches a node by named id (string) or returns None when no node with this ID is found
-    pub fn get_node_by_named_id(&self, named_id: &str) -> Option<&Node> {
-        let node_id = self.named_id_elements.get(named_id)?;
-        self.arena.get_node(*node_id)
-    }
-
-    /// Fetches a mutable node by named id (string) or returns None when no node with this ID is found
-    pub fn get_node_by_named_id_mut(&mut self, named_id: &str) -> Option<&mut Node> {
-        let node_id = self.named_id_elements.get(named_id)?;
-        self.arena.get_node_mut(*node_id)
-    }
-
-    /// Retrieves the next sibling NodeId (to the right) of the reference_node or None.
-    pub fn get_next_sibling(&self, reference_node: NodeId) -> Option<NodeId> {
-        let node = self.get_node_by_id(reference_node)?;
-        let parent = self.get_node_by_id(node.parent?)?;
-
-        let idx = parent
-            .children
-            .iter()
-            .position(|&child_id| child_id == reference_node)
-            .unwrap();
-
-        let next_idx = idx + 1;
-        if parent.children.len() > next_idx {
-            return Some(parent.children[next_idx]);
-        }
-
-        None
-    }
-
-    /// Returns the parent node of the given node, or None when no parent is found
-    pub fn parent_node(&self, node: &Node) -> Option<&Node> {
-        match node.parent {
-            Some(parent_node_id) => self.get_node_by_id(parent_node_id),
-            None => None,
-        }
-    }
-
-    pub fn add_new_node(&mut self, node: Node) -> NodeId {
-        // if a node contains attributes when adding to the tree,
-        // be sure to handle the special attributes "id" and "class"
-        // which need to by queryable by the DOM
-        let mut node_named_id: Option<String> = None;
-        if let NodeData::Element(element) = &node.data {
-            if let Some(named_id) = element.attributes.get("id") {
-                node_named_id = Some(named_id.clone());
-            }
-        }
-
-        // Register the node if needed
-        let node_id = if node.is_registered {
-            node.id
-        } else {
-            self.arena.register_node(node)
-        };
-
-        // update the node's ID (it uses default ID when first created)
-        if let Some(node) = self.get_node_by_id_mut(node_id) {
-            if let NodeData::Element(element) = &mut node.data {
-                element.set_id(node_id);
-            }
-        }
-
-        // make named_id (if present) queryable in DOM if it's not mapped already
-        if let Some(node_named_id) = node_named_id {
-            if !self.named_id_elements.contains_key(&node_named_id)
-                && is_valid_id_attribute_value(&node_named_id)
-            {
-                self.named_id_elements
-                    .insert(node_named_id.clone(), node_id);
-            }
-        }
-
-        node_id
-    }
-
-    /// Inserts a node to the parent node at the given position in the children (or none
-    /// to add at the end). Will automatically register the node if not done so already
-    pub fn add_node(&mut self, node: Node, parent_id: NodeId, position: Option<usize>) -> NodeId {
-        let node_id = self.add_new_node(node);
-
-        self.attach_node_to_parent(node_id, parent_id, position);
-
-        node_id
-    }
-
-    /// Relocates a node to another parent node
-    pub fn relocate(&mut self, node_id: NodeId, parent_id: NodeId) {
-        let node = self.arena.get_node_mut(node_id).unwrap();
-        assert!(node.is_registered, "Node is not registered to the arena");
-
-        if node.parent.is_some() && node.parent.unwrap() == parent_id {
-            // Nothing to do when we want to relocate to its own parent
-            return;
-        }
-
-        self.detach_node_from_parent(node_id);
-        self.attach_node_to_parent(node_id, parent_id, None);
-    }
-
-    /// Adds the node as a child the parent node. If position is given, it will be inserted as a
-    /// child at that given position
-    pub fn attach_node_to_parent(
-        &mut self,
-        node_id: NodeId,
-        parent_id: NodeId,
-        position: Option<usize>,
-    ) -> bool {
-        //check if any children of node have parent as child
-        if parent_id == node_id || self.has_cyclic_reference(node_id, parent_id) {
-            return false;
-        }
-
-        if let Some(parent_node) = self.get_node_by_id_mut(parent_id) {
-            // Make sure position can never be larger than the number of children in the parent
-            if let Some(mut position) = position {
-                if position > parent_node.children.len() {
-                    position = parent_node.children.len();
-                }
-                parent_node.children.insert(position, node_id);
-            } else {
-                // No position given, add to end of the children list
-                parent_node.children.push(node_id);
-            }
-        }
-
-        let node = self.arena.get_node_mut(node_id).unwrap();
-        node.parent = Some(parent_id);
-
-        true
-    }
-
-    /// Separates the given node from its parent node (if any)
-    pub fn detach_node_from_parent(&mut self, node_id: NodeId) {
-        let parent = self.get_node_by_id(node_id).expect("node not found").parent;
-
-        if let Some(parent_id) = parent {
-            let parent_node = self
-                .get_node_by_id_mut(parent_id)
-                .expect("parent node not found");
-            parent_node.children.retain(|&id| id != node_id);
-
-            let node = self.get_node_by_id_mut(node_id).expect("node not found");
-            node.parent = None;
-        }
-    }
-
-    /// returns the root node
-    pub fn get_root(&self) -> &Node {
-        self.arena
-            .get_node(NodeId::root())
-            .expect("Root node not found !?")
-    }
-
-    /// returns the root node
-    pub fn get_root_mut(&mut self) -> &mut Node {
-        self.arena
-            .get_node_mut(NodeId::root())
-            .expect("Root node not found !?")
-    }
-
-    /// Returns true when the given parent_id is a child of the node_id
-    pub fn has_cyclic_reference(&self, node_id: NodeId, parent_id: NodeId) -> bool {
-        has_child_recursive(&self.arena, node_id, parent_id)
-    }
-
-    /// Check if a given node's children contain a certain tag name
-    pub fn contains_child_tag(&self, node_id: NodeId, tag: &str) -> bool {
-        if let Some(node) = self.get_node_by_id(node_id) {
-            for child_id in &node.children {
-                if let Some(child) = self.get_node_by_id(*child_id) {
-                    if child.name == tag {
-                        return true;
-                    }
-                }
-            }
-        }
-
-        false
-    }
-
-    pub fn nodes(&self) -> &HashMap<NodeId, Node> {
-        self.arena.nodes()
-    }
-}
-
-// Walk the document tree with the given visitor
-pub fn walk_document_tree(doc: &DocumentHandle, visitor: &mut Box<dyn Visitor<Node>>) {
-    let binding = doc.get();
-    let root = binding.get_root();
-    internal_visit(doc, root, visitor);
-}
-
-fn internal_visit(doc: &DocumentHandle, node: &Node, visitor: &mut Box<dyn Visitor<Node>>) {
-    // Enter node
-    match &node.data {
-        NodeData::Document(document) => visitor.document_enter(node, document),
-        NodeData::DocType(doctype) => visitor.doctype_enter(node, doctype),
-        NodeData::Text(text) => visitor.text_enter(node, text),
-        NodeData::Comment(comment) => visitor.comment_enter(node, comment),
-        NodeData::Element(element) => visitor.element_enter(node, element),
-    }
-
-    let binding = doc.get();
-    for child_id in &node.children {
-        let child = binding.arena.get_node(*child_id).unwrap();
-        internal_visit(doc, child, visitor);
-    }
-
-    // Leave node
-    match &node.data {
-        NodeData::Document(document) => visitor.document_leave(node, document),
-        NodeData::DocType(doctype) => visitor.doctype_leave(node, doctype),
-        NodeData::Text(text) => visitor.text_leave(node, text),
-        NodeData::Comment(comment) => visitor.comment_leave(node, comment),
-        NodeData::Element(element) => visitor.element_leave(node, element),
-    }
-}
-
-/// Returns true when the parent node has the child node as a child, or if any of the children of
-/// the parent node have the child node as a child.
-fn has_child_recursive(arena: &NodeArena, parent_id: NodeId, child_id: NodeId) -> bool {
-    let node = arena.get_node(parent_id).cloned();
-    if node.is_none() {
-        return false;
-    }
-
-    let node = node.unwrap();
-    for id in &node.children {
-        if *id == child_id {
-            return true;
-        }
-        let child = arena.get_node(*id).cloned();
-        if has_child(arena, child, child_id) {
-            return true;
-        }
-    }
-    false
-}
-
-fn has_child(arena: &NodeArena, parent: Option<Node>, child_id: NodeId) -> bool {
-    let Some(parent_node) = parent else {
-        return false;
-    };
-
-    if parent_node.children.is_empty() {
-        return false;
-    }
-
-    for id in parent_node.children {
-        if id == child_id {
-            return true;
-        }
-        let node = arena.get_node(id).cloned();
-        if has_child(arena, node, child_id) {
-            return true;
-        }
-    }
-
-    false
-}
-
-impl Document {
-    /// Print a node and all its children in a tree-like structure
-    pub fn print_tree(&self, node: &Node, prefix: String, last: bool, f: &mut fmt::Formatter) {
-        let mut buffer = prefix.clone();
-        if last {
-            buffer.push_str("└─ ");
-        } else {
-            buffer.push_str("├─ ");
-        }
-
-        // buffer.push_str(format!("{} ", node.id).as_str());
-
-        match &node.data {
-            NodeData::Document(_) => {
-                _ = writeln!(f, "{buffer}Document");
-            }
-            NodeData::DocType(DocTypeData {
-                name,
-                pub_identifier,
-                sys_identifier,
-            }) => {
-                _ = writeln!(
-                    f,
-                    r#"{buffer}<!DOCTYPE {name} "{pub_identifier}" "{sys_identifier}">"#,
-                );
-            }
-            NodeData::Text(TextData { value, .. }) => {
-                _ = writeln!(f, r#"{buffer}"{value}""#);
-            }
-            NodeData::Comment(CommentData { value, .. }) => {
-                _ = writeln!(f, "{buffer}<!-- {value} -->");
-            }
-            NodeData::Element(element) => {
-                _ = write!(f, "{}<{}", buffer, element.name);
-                for (key, value) in &element.attributes {
-                    _ = write!(f, " {key}={value}");
-                }
-
-                // for (key, value) in node.style.borrow().iter() {
-                //     _ = write!(f, "[CSS: {key}={value}]");
-                // }
-
-                _ = writeln!(f, ">");
-            }
-        }
-
-        if prefix.len() > 40 {
-            _ = writeln!(f, "...");
-            return;
-        }
-
-        let mut buffer = prefix;
-        if last {
-            buffer.push_str("   ");
-        } else {
-            buffer.push_str("│  ");
-        }
-
-        let len = node.children.len();
-        for (i, child) in node.children.iter().enumerate() {
-            let child = self.arena.get_node(*child).expect("Child not found");
-            self.print_tree(child, buffer.clone(), i == len - 1, f);
-        }
-    }
-}
-
-impl Display for Document {
-    fn fmt(&self, f: &mut fmt::Formatter) -> fmt::Result {
-        self.print_tree(self.get_root(), String::new(), true, f);
-        Ok(())
-    }
-}
-
-#[derive(Debug)]
-pub struct DocumentHandle(pub(crate) Rc<RefCell<Document>>);
-
-impl Display for DocumentHandle {
-    fn fmt(&self, f: &mut fmt::Formatter<'_>) -> fmt::Result {
-        write!(f, "{}", self.0.borrow())
-    }
-}
-
-impl PartialEq for DocumentHandle {
-    fn eq(&self, other: &Self) -> bool {
-        self.0.eq(&other.0)
-    }
-}
-
-// NOTE: it is preferred to use Document::clone() when
-// copying a DocumentHandle reference. However, for
-// any structs using this handle that use #[derive(Clone)],
-// this implementation is required.
-impl Clone for DocumentHandle {
-    fn clone(&self) -> DocumentHandle {
-        DocumentHandle(Rc::clone(&self.0))
-    }
-}
-
-impl Eq for DocumentHandle {}
-
-impl DocumentHandle {
-    /// Retrieves a weak pointer to the document
-    pub fn to_weak(&self) -> Weak<RefCell<Document>> {
-        Rc::downgrade(&self.0)
-    }
-
-    /// Retrieves an immutable reference to the document
-    pub fn get(&self) -> impl Deref<Target = Document> + '_ {
-        self.0.borrow()
-    }
-
-    /// Retrieves a mutable reference to the document
-    pub fn get_mut(&mut self) -> impl DerefMut<Target = Document> + '_ {
-        self.0.borrow_mut()
-    }
-
-    /// Attaches a node to the parent node at the given position in the children (or none
-    /// to add at the end).
-    pub fn attach_node_to_parent(
-        &mut self,
-        node_id: NodeId,
-        parent_id: NodeId,
-        position: Option<usize>,
-    ) -> bool {
-        self.get_mut()
-            .attach_node_to_parent(node_id, parent_id, position)
-    }
-
-    /// Separates the given node from its parent node (if any)
-    pub fn detach_node_from_parent(&mut self, node_id: NodeId) {
-        self.get_mut().detach_node_from_parent(node_id);
-    }
-
-    /// Inserts a node to the parent node at the given position in the children (or none
-    /// to add at the end). Will automatically register the node if not done so already
-    /// Returns the node ID of the inserted node
-    pub fn add_node(&mut self, node: Node, parent_id: NodeId, position: Option<usize>) -> NodeId {
-        self.get_mut().add_node(node, parent_id, position)
-    }
-
-    /// Relocates a node to another parent node
-    pub fn relocate(&mut self, node_id: NodeId, parent_id: NodeId) {
-        self.get_mut().relocate(node_id, parent_id);
-    }
-
-    /// Returns true when there is a cyclic reference from the given node_id to the parent_id
-    pub fn has_cyclic_reference(&self, node_id: NodeId, parent_id: NodeId) -> bool {
-        self.get().has_cyclic_reference(node_id, parent_id)
-    }
-
-    fn insert_id_attribute(
-        &mut self,
-        value: &str,
-        element_id: NodeId,
-        _location: Location,
-    ) -> Result<()> {
-        if !is_valid_id_attribute_value(value) {
-            return Err(Error::DocumentTask(format!(
-                "Attribute value '{value}' did not pass validation",
-            ))
-            .into());
-        }
-
-        // an ID must be tied to only one element
-        if self.get().named_id_elements.contains_key(value) {
-            return Err(Error::DocumentTask(format!("ID '{value}' already exists in DOM",)).into());
-        }
-
-        let mut doc = self.get_mut();
-        let data = &mut doc
-            .get_node_by_id_mut(element_id)
-            .ok_or(Box::new(Error::DocumentTask(format!(
-                "Node ID {element_id} not found",
-            ))))?
-            .data;
-
-        let old_id = if let NodeData::Element(element) = data {
-            let attributes = &mut element.attributes;
-            let old_id = attributes.get("id").map(ToOwned::to_owned);
-            attributes.insert("id".into(), value.into());
-            old_id
-        } else {
-            return Err(
-                Error::DocumentTask(format!("Node ID {element_id} is not an element")).into(),
-            );
-        };
-
-        old_id.map(|id| doc.named_id_elements.remove(&id));
-        doc.named_id_elements.insert(value.to_owned(), element_id);
-
-        Ok(())
-    }
-
-    fn insert_class_attribute(
-        &mut self,
-        value: &str,
-        element_id: NodeId,
-        _location: Location,
-    ) -> Result<()> {
-        let mut doc = self.get_mut();
-        let node = doc
-            .get_node_by_id_mut(element_id)
-            .ok_or(Box::new(Error::DocumentTask(format!(
-                "Node ID {element_id} not found",
-            ))))?;
-        if let NodeData::Element(element) = &mut node.data {
-            element.classes = ElementClass::from(value);
-        } else {
-            return Err(
-                Error::DocumentTask(format!("Node ID {element_id} is not an element",)).into(),
-            );
-        }
-
-        Ok(())
-    }
-
-    fn insert_generic_attribute(
-        &mut self,
-        key: &str,
-        value: &str,
-        element_id: NodeId,
-        _location: Location,
-    ) -> Result<()> {
-        let mut doc = self.get_mut();
-        let node = doc
-            .get_node_by_id_mut(element_id)
-            .ok_or(Box::new(Error::DocumentTask(format!(
-                "Node ID {element_id} not found"
-            ))))?;
-        if let NodeData::Element(element) = &mut node.data {
-            element.attributes.insert(key.to_owned(), value.to_owned());
-        } else {
-            return Err(
-                Error::DocumentTask(format!("Node ID {element_id} is not an element")).into(),
-            );
-        }
-
-        Ok(())
-    }
-
-    fn matches_query_condition(
-        &self,
-        doc_read: &Document,
-        current_node: &Node,
-        condition: &Condition,
-    ) -> bool {
-        match condition {
-            Condition::EqualsTag(tag) => current_node.name == *tag,
-            Condition::EqualsId(id) => {
-                let node_data = &current_node.data;
-                if let NodeData::Element(element) = node_data {
-                    if let Some(id_attr) = element.attributes.get("id") {
-                        return *id_attr == *id;
-                    }
-                }
-
-                false
-            }
-            Condition::ContainsClass(class) => {
-                let node_data = &current_node.data;
-                if let NodeData::Element(element) = node_data {
-                    return element.classes.contains(class.as_str());
-                }
-
-                false
-            }
-            Condition::ContainsAttribute(attribute) => {
-                let node_data = &current_node.data;
-                if let NodeData::Element(element) = node_data {
-                    return element.attributes.contains_key(attribute);
-                }
-
-                false
-            }
-            Condition::ContainsChildTag(child_tag) => {
-                doc_read.contains_child_tag(current_node.id, child_tag)
-            }
-            Condition::HasParentTag(parent_tag) => {
-                if let Some(parent_id) = current_node.parent {
-                    // making an assumption here that the parent node is actually valid
-                    let parent = doc_read.get_node_by_id(parent_id).unwrap();
-                    return parent.name == *parent_tag;
-                }
-
-                false
-            }
-        }
-    }
-
-    /// Perform a single query against the document.
-    /// If query search type is uninitialized, returns an error.
-    /// Otherwise, returns a vector of NodeIds that match the predicate in tree order (preorder depth-first.)
-    pub fn query(&self, query: &Query) -> Result<Vec<NodeId>> {
-        if query.search_type == SearchType::Uninitialized {
-            return Err(Error::Query("Query predicate is uninitialized".to_owned()).into());
-        }
-
-        let doc_read = self.get();
-        let mut found_ids = Vec::new();
-        let tree_iterator = TreeIterator::new(self);
-
-        for current_node_id in tree_iterator {
-            let current_node = doc_read.get_node_by_id(current_node_id).unwrap();
-
-            let mut predicate_result: bool = true;
-
-            for condition in &query.conditions {
-                if !self.matches_query_condition(&doc_read, current_node, condition) {
-                    predicate_result = false;
-                    break;
-                }
-            }
-
-            if predicate_result {
-                found_ids.push(current_node_id);
-                if query.search_type == SearchType::FindFirst {
-                    return Ok(found_ids);
-                }
-            }
-        }
-
-        Ok(found_ids)
-    }
-
-    pub fn deep_clone(&self) -> DocumentHandle {
-        let mut doc_handle = Document::shared(None);
-
-        doc_handle
-            .get_mut()
-            .location
-            .clone_from(&self.get().location);
-        doc_handle
-            .get_mut()
-            .named_id_elements
-            .clone_from(&self.get().named_id_elements);
-        doc_handle.get_mut().doctype = self.get().doctype;
-        doc_handle.get_mut().quirks_mode = self.get().quirks_mode;
-        doc_handle
-            .get_mut()
-            .stylesheets
-            .clone_from(&self.get().stylesheets);
-        doc_handle.get_mut().arena = self.get().arena.clone();
-
-        doc_handle
-    }
-}
-
-impl TreeBuilder for DocumentHandle {
-    /// Creates and attaches a new element node to the document
-    fn create_element(
-        &mut self,
-        name: &str,
-        parent_id: NodeId,
-        position: Option<usize>,
-        namespace: &str,
-        location: Location,
-    ) -> NodeId {
-        let new_element = Node::new_element(self, name, HashMap::new(), namespace, location);
-        self.add_node(new_element, parent_id, position)
-    }
-
-    /// Creates and attaches a new text node to the document
-    fn create_text(&mut self, content: &str, parent_id: NodeId, location: Location) -> NodeId {
-        let new_text = Node::new_text(self, location, content);
-        self.add_node(new_text, parent_id, None)
-    }
-
-    /// Creates and attaches a new comment node to the document
-    fn create_comment(&mut self, content: &str, parent_id: NodeId, location: Location) -> NodeId {
-        let new_comment = Node::new_comment(self, location, content);
-        self.add_node(new_comment, parent_id, None)
-    }
-
-    /// Inserts an attribute to an element node.
-    /// If node is not an element or if passing an invalid attribute value, returns an Err()
-    fn insert_attribute(
-        &mut self,
-        key: &str,
-        value: &str,
-        element_id: NodeId,
-        location: Location,
-    ) -> Result<()> {
-        match key {
-            "id" => self.insert_id_attribute(value, element_id, location),
-            "class" => self.insert_class_attribute(value, element_id, location),
-            _ => self.insert_generic_attribute(key, value, element_id, location),
-        }
-    }
-}
-
-/// This struct will be used to create a fully initialized document or document fragment
-pub struct DocumentBuilder;
-
-impl DocumentBuilder {
-    /// Creates a new document with a document root node
-    pub fn new_document(url: Option<Url>) -> DocumentHandle {
-        let mut doc = Document::shared(url);
-
-        let handle = &Document::clone(&doc);
-        let node = Node::new_document(handle, Location::default());
-        doc.get_mut().arena.register_node(node);
-
-        doc
-    }
-
-    /// Creates a new document fragment with the context as the root node
-    pub fn new_document_fragment(context: &Node) -> DocumentHandle {
-        let mut doc = Document::shared(None);
-        doc.get_mut().doctype = DocumentType::HTML;
-
-        let doc_weak = Weak::clone(&context.document);
-        if let Some(doc_get) = doc_weak.upgrade() {
-            if doc_get.borrow().quirks_mode == QuirksMode::Quirks {
-                doc.get_mut().quirks_mode = QuirksMode::Quirks;
-            } else if doc_get.borrow().quirks_mode == QuirksMode::LimitedQuirks {
-                doc.get_mut().quirks_mode = QuirksMode::LimitedQuirks;
-            }
-
-            // Copy location
-            doc.get_mut()
-                .location
-                .clone_from(&doc_get.borrow().location);
-        }
-
-        // @TODO: Set tokenizer state based on context element
-
-        let html_node = Node::new_element(
-            &doc,
-            "html",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            context.location.clone(),
-        );
-        // doc.get_mut().arena.register_node(html_node);
-        doc.add_node(html_node, NodeId::root(), None);
-
-        doc
-    }
-}
-
-/// Constructs an iterator from a given DocumentHandle.
-/// WARNING: mutations in the document would be reflected
-/// in the iterator. It's advised to consume the entire iterator
-/// before mutating the document again.
-pub struct TreeIterator {
-    current_node_id: Option<NodeId>,
-    node_stack: Vec<NodeId>,
-    document: DocumentHandle,
-}
-
-impl TreeIterator {
-    #[must_use]
-    pub fn new(document: &DocumentHandle) -> Self {
-        Self {
-            current_node_id: None,
-            document: Document::clone(document),
-            node_stack: vec![document.get().get_root().id],
-        }
-    }
-}
-
-impl Iterator for TreeIterator {
-    type Item = NodeId;
-
-    fn next(&mut self) -> Option<NodeId> {
-        self.current_node_id = self.node_stack.pop();
-
-        if let Some(current_node_id) = self.current_node_id {
-            let doc_read = self.document.get();
-
-            if let Some(sibling_id) = self.document.get().get_next_sibling(current_node_id) {
-                self.node_stack.push(sibling_id);
-            }
-
-            if let Some(current_node) = doc_read.get_node_by_id(current_node_id) {
-                if let Some(&child_id) = current_node.children.first() {
-                    self.node_stack.push(child_id);
-                }
-            }
-        }
-
-        self.current_node_id
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use crate::node::{NodeTrait, NodeType, HTML_NAMESPACE};
-    use crate::parser::document::{DocumentBuilder, DocumentTaskQueue, TreeIterator};
-    use crate::parser::query::Query;
-    use crate::parser::tree_builder::TreeBuilder;
-    use crate::parser::{Node, NodeData, NodeId};
-    use gosub_shared::byte_stream::Location;
-    use std::collections::HashMap;
-
-    #[test]
-    fn relocate() {
-        let mut document = DocumentBuilder::new_document(None);
-
-        let parent = Node::new_element(
-            &document,
-            "parent",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let node1 = Node::new_element(
-            &document,
-            "div1",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let node2 = Node::new_element(
-            &document,
-            "div2",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let node3 = Node::new_element(
-            &document,
-            "div3",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let node3_1 = Node::new_element(
-            &document,
-            "div3_1",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let parent_id = document
-            .get_mut()
-            .add_node(parent, NodeId::from(0usize), None);
-        let node1_id = document.get_mut().add_node(node1, parent_id, None);
-        let node2_id = document.get_mut().add_node(node2, parent_id, None);
-        let node3_id = document.get_mut().add_node(node3, parent_id, None);
-        let node3_1_id = document.get_mut().add_node(node3_1, node3_id, None);
-
-        assert_eq!(
-            format!("{}", document),
-            r#"└─ Document
-   └─ <parent>
-      ├─ <div1>
-      ├─ <div2>
-      └─ <div3>
-         └─ <div3_1>
-"#
-        );
-
-        document.get_mut().relocate(node3_1_id, node1_id);
-        assert_eq!(
-            format!("{}", document),
-            r#"└─ Document
-   └─ <parent>
-      ├─ <div1>
-      │  └─ <div3_1>
-      ├─ <div2>
-      └─ <div3>
-"#
-        );
-
-        document.get_mut().relocate(node1_id, node2_id);
-        assert_eq!(
-            format!("{}", document),
-            r#"└─ Document
-   └─ <parent>
-      ├─ <div2>
-      │  └─ <div1>
-      │     └─ <div3_1>
-      └─ <div3>
-"#
-        );
-    }
-
-    #[test]
-    fn duplicate_named_id_elements() {
-        let mut document = DocumentBuilder::new_document(None);
-
-        let div_1 = document.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_2 = document.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        // when adding duplicate IDs, our current implementation will prevent duplicates.
-        let mut res = document.insert_attribute("id", "myid", div_1, Location::default());
-        assert!(res.is_ok());
-
-        res = document.insert_attribute("id", "myid", div_2, Location::default());
-        assert!(res.is_err());
-        if let Err(err) = res {
-            assert_eq!(
-                err.to_string(),
-                "document task error: ID 'myid' already exists in DOM"
-            );
-        }
-
-        assert_eq!(
-            document.get().get_node_by_named_id("myid").unwrap().id,
-            div_1
-        );
-
-        // when div_1's ID changes, "myid" should be removed from the DOM
-        res = document.insert_attribute("id", "newid", div_1, Location::default());
-        assert!(res.is_ok());
-        assert!(document.get().get_node_by_named_id("myid").is_none());
-        assert_eq!(
-            document.get().get_node_by_named_id("newid").unwrap().id,
-            div_1
-        );
-    }
-
-    #[test]
-    fn verify_node_ids_in_element_data() {
-        let mut document = DocumentBuilder::new_document(None);
-
-        let node1 = Node::new_element(
-            &document,
-            "div",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let node2 = Node::new_element(
-            &document,
-            "div",
-            HashMap::new(),
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        document
-            .get_mut()
-            .add_node(node1, NodeId::from(0usize), None);
-        document
-            .get_mut()
-            .add_node(node2, NodeId::from(0usize), None);
-
-        let doc_ptr = document.get();
-
-        let get_node1 = doc_ptr.get_node_by_id(NodeId::from(1usize)).unwrap();
-        let get_node2 = doc_ptr.get_node_by_id(NodeId::from(2usize)).unwrap();
-
-        let NodeData::Element(element1) = &get_node1.data else {
-            panic!()
-        };
-
-        assert_eq!(element1.node_id, NodeId::from(1usize));
-
-        let NodeData::Element(element2) = &get_node2.data else {
-            panic!()
-        };
-
-        assert_eq!(element2.node_id, NodeId::from(2usize));
-    }
-
-    #[test]
-    fn document_task_queue() {
-        let document = DocumentBuilder::new_document(None);
-
-        // Using task queue to create the following structure initially:
-        // <div>
-        //   <p>
-        //     <!-- comment inside p -->
-        //     hey
-        //   </p>
-        //   <!-- comment inside div -->
-        // </div>
-
-        // then flush the queue and use it again to add an attribute to <p>:
-        // <p id="myid">hey</p>
-        let mut task_queue = DocumentTaskQueue::new(&document);
-
-        // NOTE: only elements return the ID
-        let div_id = task_queue.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        assert_eq!(div_id, NodeId::from(1usize));
-
-        let p_id =
-            task_queue.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-        assert_eq!(p_id, NodeId::from(2usize));
-
-        task_queue.create_comment("comment inside p", p_id, Location::default());
-        task_queue.create_text("hey", p_id, Location::default());
-        task_queue.create_comment("comment inside div", div_id, Location::default());
-
-        // at this point, the DOM should have NO nodes (besides root)
-        assert_eq!(document.get().arena.count_nodes(), 1);
-
-        // validate our queue is loaded
-        assert!(!task_queue.is_empty());
-        let errors = task_queue.flush();
-        assert!(errors.is_empty());
-
-        // validate queue is empty
-        assert!(task_queue.is_empty());
-
-        // DOM should now have all our nodes
-        assert_eq!(document.get().arena.count_nodes(), 6);
-
-        // NOTE: these checks are scoped separately since this is using an
-        // immutable borrow and we make a mutable borrow after (to insert the attribute).
-        // We need this immutable borrow to die off before making a new mutable borrow
-        // (and again an immutable borrow for validation afterwards)
-        {
-            // validate DOM is correctly laid out
-            let doc_read = document.get();
-            let root = doc_read.get_root(); // <!DOCTYPE html>
-            let root_children = &root.children;
-
-            // div child
-            let div_child = doc_read.get_node_by_id(root_children[0]).unwrap();
-            assert_eq!(div_child.type_of(), NodeType::Element);
-            assert_eq!(div_child.name, "div");
-            let div_children = &div_child.children;
-
-            // p child
-            let p_child = doc_read.get_node_by_id(div_children[0]).unwrap();
-            assert_eq!(p_child.type_of(), NodeType::Element);
-            assert_eq!(p_child.name, "p");
-            let p_children = &p_child.children;
-
-            // comment inside p
-            let p_comment = doc_read.get_node_by_id(p_children[0]).unwrap();
-            assert_eq!(p_comment.type_of(), NodeType::Comment);
-            let NodeData::Comment(p_comment_data) = &p_comment.data else {
-                panic!()
-            };
-            assert_eq!(p_comment_data.value, "comment inside p");
-
-            // body inside p
-            let p_body = doc_read.get_node_by_id(p_children[1]).unwrap();
-            assert_eq!(p_body.type_of(), NodeType::Text);
-            let NodeData::Text(p_body_data) = &p_body.data else {
-                panic!()
-            };
-            assert_eq!(p_body_data.value, "hey");
-
-            // comment inside div
-            let div_comment = doc_read.get_node_by_id(div_children[1]).unwrap();
-            assert_eq!(div_comment.type_of(), NodeType::Comment);
-            let NodeData::Comment(div_comment_data) = &div_comment.data else {
-                panic!()
-            };
-            assert_eq!(div_comment_data.value, "comment inside div");
-        }
-
-        // use task queue again to add an ID attribute
-        // NOTE: inserting attribute in task queue always succeeds
-        // since it doesn't touch DOM until flush
-        let _ = task_queue.insert_attribute("id", "myid", p_id, Location::default());
-        let errors = task_queue.flush();
-        assert!(errors.is_empty());
-
-        let doc_read = document.get();
-        // validate ID is searchable in dom
-        assert_eq!(*doc_read.named_id_elements.get("myid").unwrap(), p_id);
-
-        // validate attribute is applied to underlying element
-        let p_node = doc_read.get_node_by_id(p_id).unwrap();
-        let NodeData::Element(p_element) = &p_node.data else {
-            panic!()
-        };
-        assert_eq!(p_element.attributes.get("id").unwrap(), "myid");
-    }
-
-    #[test]
-    fn task_queue_insert_attribute_failues() {
-        let document = DocumentBuilder::new_document(None);
-
-        let mut task_queue = DocumentTaskQueue::new(&document);
-        let div_id = task_queue.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        task_queue.create_comment("content", div_id, Location::default()); // this is NodeId::from(2)
-        task_queue.flush();
-
-        // NOTE: inserting attribute in task queue always succeeds
-        // since it doesn't touch DOM until flush
-        let _ =
-            task_queue.insert_attribute("id", "myid", NodeId::from(1usize), Location::default());
-        let _ =
-            task_queue.insert_attribute("id", "myid", NodeId::from(1usize), Location::default());
-        let _ =
-            task_queue.insert_attribute("id", "otherid", NodeId::from(2usize), Location::default());
-        let _ = task_queue.insert_attribute(
-            "id",
-            "dummyid",
-            NodeId::from(42usize),
-            Location::default(),
-        );
-        let _ =
-            task_queue.insert_attribute("id", "my id", NodeId::from(1usize), Location::default());
-        let _ = task_queue.insert_attribute("id", "123", NodeId::from(1usize), Location::default());
-        let _ = task_queue.insert_attribute("id", "", NodeId::from(1usize), Location::default());
-        let errors = task_queue.flush();
-        for error in &errors {
-            println!("{}", error);
-        }
-        assert_eq!(errors.len(), 5);
-        assert_eq!(
-            errors[0],
-            "document task error: ID 'myid' already exists in DOM",
-        );
-        assert_eq!(
-            errors[1],
-            "document task error: Node ID 2 is not an element",
-        );
-        assert_eq!(errors[2], "document task error: Node ID 42 not found");
-        assert_eq!(
-            errors[3],
-            "document task error: Attribute value 'my id' did not pass validation",
-        );
-        assert_eq!(
-            errors[4],
-            "document task error: Attribute value '' did not pass validation",
-        );
-
-        // validate that invalid changes did not apply to DOM
-        let doc_read = document.get();
-        assert!(!doc_read.named_id_elements.contains_key("my id"));
-        assert!(!doc_read.named_id_elements.contains_key(""));
-    }
-
-    // this is basically a replica of document_task_queue() test
-    // but using tree builder directly instead of the task queue
-    #[test]
-    fn document_tree_builder() {
-        let mut document = DocumentBuilder::new_document(None);
-
-        // Using tree builder to create the following structure:
-        // <div>
-        //   <p id="myid">
-        //     <!-- comment inside p -->
-        //     hey
-        //   </p>
-        //   <!-- comment inside div -->
-        // </div>
-
-        // NOTE: only elements return the ID
-        let div_id = document.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        assert_eq!(div_id, NodeId::from(1usize));
-
-        let p_id = document.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-        assert_eq!(p_id, NodeId::from(2usize));
-
-        document.create_comment("comment inside p", p_id, Location::default());
-        document.create_text("hey", p_id, Location::default());
-        document.create_comment("comment inside div", div_id, Location::default());
-
-        let res = document.insert_attribute("id", "myid", p_id, Location::default());
-        assert!(res.is_ok());
-
-        // DOM should now have all our nodes
-        assert_eq!(document.get().arena.count_nodes(), 6);
-
-        // validate DOM is correctly laid out
-        let doc_read = document.get();
-        let root = doc_read.get_root(); // <!DOCTYPE html>
-        let root_children = &root.children;
-
-        // div child
-        let div_child = doc_read.get_node_by_id(root_children[0]).unwrap();
-        assert_eq!(div_child.type_of(), NodeType::Element);
-        assert_eq!(div_child.name, "div");
-        let div_children = &div_child.children;
-
-        // p child
-        let p_child = doc_read.get_node_by_id(div_children[0]).unwrap();
-        assert_eq!(p_child.type_of(), NodeType::Element);
-        assert_eq!(p_child.name, "p");
-        let p_children = &p_child.children;
-
-        // comment inside p
-        let p_comment = doc_read.get_node_by_id(p_children[0]).unwrap();
-        assert_eq!(p_comment.type_of(), NodeType::Comment);
-        let NodeData::Comment(p_comment_data) = &p_comment.data else {
-            panic!()
-        };
-        assert_eq!(p_comment_data.value, "comment inside p");
-
-        // body inside p
-        let p_body = doc_read.get_node_by_id(p_children[1]).unwrap();
-        assert_eq!(p_body.type_of(), NodeType::Text);
-        let NodeData::Text(p_body_data) = &p_body.data else {
-            panic!()
-        };
-        assert_eq!(p_body_data.value, "hey");
-
-        // comment inside div
-        let div_comment = doc_read.get_node_by_id(div_children[1]).unwrap();
-        assert_eq!(div_comment.type_of(), NodeType::Comment);
-        let NodeData::Comment(div_comment_data) = &div_comment.data else {
-            panic!()
-        };
-        assert_eq!(div_comment_data.value, "comment inside div");
-
-        // validate ID is searchable in dom
-        assert_eq!(*doc_read.named_id_elements.get("myid").unwrap(), p_id);
-
-        // validate attribute is applied to underlying element
-        let p_node = doc_read.get_node_by_id(p_id).unwrap();
-        let NodeData::Element(p_element) = &p_node.data else {
-            panic!()
-        };
-        assert_eq!(p_element.attributes.get("id").unwrap(), "myid");
-    }
-
-    #[test]
-    fn insert_generic_attribute() {
-        let mut doc = DocumentBuilder::new_document(None);
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let res = doc.insert_attribute("key", "value", div_id, Location::default());
-        assert!(res.is_ok());
-        let doc_read = doc.get();
-        let NodeData::Element(element) = &doc_read.get_node_by_id(div_id).unwrap().data else {
-            panic!()
-        };
-        assert_eq!(element.attributes.get("key").unwrap(), "value");
-    }
-
-    #[test]
-    fn task_queue_insert_generic_attribute() {
-        let doc = DocumentBuilder::new_document(None);
-        let mut task_queue = DocumentTaskQueue::new(&doc);
-        let div_id = task_queue.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let _ = task_queue.insert_attribute("key", "value", div_id, Location::default());
-        let errors = task_queue.flush();
-        assert!(errors.is_empty());
-        let doc_read = doc.get();
-        let NodeData::Element(element) = &doc_read.get_node_by_id(div_id).unwrap().data else {
-            panic!()
-        };
-        assert_eq!(element.attributes.get("key").unwrap(), "value");
-    }
-
-    #[test]
-    fn insert_class_attribute() {
-        let mut doc = DocumentBuilder::new_document(None);
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let res = doc.insert_attribute("class", "one two three", div_id, Location::default());
-        assert!(res.is_ok());
-        let doc_read = doc.get();
-        let NodeData::Element(element) = &doc_read.get_node_by_id(div_id).unwrap().data else {
-            panic!()
-        };
-        assert!(element.classes.contains("one"));
-        assert!(element.classes.contains("two"));
-        assert!(element.classes.contains("three"));
-    }
-
-    #[test]
-    fn task_queue_insert_class_attribute() {
-        let doc = DocumentBuilder::new_document(None);
-        let mut task_queue = DocumentTaskQueue::new(&doc);
-        let div_id = task_queue.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let _ = task_queue.insert_attribute("class", "one two three", div_id, Location::default());
-        let errors = task_queue.flush();
-        assert!(errors.is_empty());
-        let doc_read = doc.get();
-        let NodeData::Element(element) = &doc_read.get_node_by_id(div_id).unwrap().data else {
-            panic!()
-        };
-        assert!(element.classes.contains("one"));
-        assert!(element.classes.contains("two"));
-        assert!(element.classes.contains("three"));
-    }
-
-    #[test]
-    fn uninitialized_query() {
-        let doc = DocumentBuilder::new_document(None);
-
-        let query = Query::new();
-        let found_ids = doc.query(&query);
-        if let Err(err) = found_ids {
-            assert_eq!(
-                err.to_string(),
-                "query: generic error: Query predicate is uninitialized"
-            );
-        } else {
-            panic!()
-        }
-    }
-
-    #[test]
-    fn single_query_equals_tag_find_first() {
-        // <div>
-        //     <div>
-        //         <p>
-        //     <p>
-        // <div>
-        //     <p>
-        // <p>
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let _ = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let _ = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let query = Query::new().equals_tag("p").find_first();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 1);
-        assert_eq!(found_ids, [p_id]);
-    }
-
-    #[test]
-    fn single_query_equals_tag_find_all() {
-        // <div>
-        //     <div>
-        //         <p>
-        //     <p>
-        // <div>
-        //     <p>
-        // <p>
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let p_id_2 = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let p_id_3 = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let p_id_4 = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let query = Query::new().equals_tag("p").find_all();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 4);
-        assert_eq!(found_ids, [p_id, p_id_2, p_id_3, p_id_4]);
-    }
-
-    #[test]
-    fn single_query_equals_id() {
-        // <div>
-        //     <div>
-        //         <p>
-        //     <p id="myid">
-        // <div>
-        //     <p>
-        // <p>
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let p_id_2 = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-        let res = doc.insert_attribute("id", "myid", p_id_2, Location::default());
-        assert!(res.is_ok());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let _ = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let _ = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let query = Query::new().equals_id("myid").find_first();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 1);
-        assert_eq!(found_ids, [p_id_2]);
-    }
-
-    #[test]
-    fn single_query_contains_class_find_first() {
-        // <div>
-        //     <div>
-        //         <p class="one two">
-        //     <p class="one">
-        // <div>
-        //     <p class="two three">
-        // <p class="three">
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let mut res = doc.insert_attribute("class", "one two", p_id, Location::default());
-        assert!(res.is_ok());
-        let p_id_2 = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-        res = doc.insert_attribute("class", "one", p_id_2, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("id", "myid", p_id_2, Location::default());
-        assert!(res.is_ok());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let p_id_3 = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-        res = doc.insert_attribute("class", "two three", p_id_3, Location::default());
-        assert!(res.is_ok());
-
-        let p_id_4 = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        res = doc.insert_attribute("class", "three", p_id_4, Location::default());
-        assert!(res.is_ok());
-
-        let query = Query::new().contains_class("two").find_first();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 1);
-        assert_eq!(found_ids, [p_id]);
-    }
-
-    #[test]
-    fn single_query_contains_class_find_all() {
-        // <div>
-        //     <div>
-        //         <p class="one two">
-        //     <p class="one">
-        // <div>
-        //     <p class="two three">
-        // <p class="three">
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let mut res = doc.insert_attribute("class", "one two", p_id, Location::default());
-        assert!(res.is_ok());
-        let p_id_2 = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-        res = doc.insert_attribute("class", "one", p_id_2, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("id", "myid", p_id_2, Location::default());
-        assert!(res.is_ok());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let p_id_3 = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-        res = doc.insert_attribute("class", "two three", p_id_3, Location::default());
-        assert!(res.is_ok());
-
-        let p_id_4 = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        res = doc.insert_attribute("class", "three", p_id_4, Location::default());
-        assert!(res.is_ok());
-
-        let query = Query::new().contains_class("two").find_all();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 2);
-        assert_eq!(found_ids, [p_id, p_id_3]);
-    }
-
-    #[test]
-    fn single_query_contains_attribute_find_first() {
-        // <div>
-        //     <div id="myid" style="somestyle">
-        //         <p title="hey">
-        //     <p>
-        // <div style="otherstyle" id="otherid">
-        //     <p>
-        // <p title="yo" style="cat">
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let mut res = doc.insert_attribute("id", "myid", div_id_2, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("style", "somestyle", div_id_2, Location::default());
-        assert!(res.is_ok());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        res = doc.insert_attribute("title", "key", p_id, Location::default());
-        assert!(res.is_ok());
-        let _ = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        res = doc.insert_attribute("style", "otherstyle", div_id_3, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("id", "otherid", div_id_3, Location::default());
-        assert!(res.is_ok());
-        let _ = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let p_id_4 = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        res = doc.insert_attribute("title", "yo", p_id_4, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("style", "cat", p_id_4, Location::default());
-        assert!(res.is_ok());
-
-        let query = Query::new().contains_attribute("style").find_first();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 1);
-        assert_eq!(found_ids, [div_id_2]);
-    }
-
-    #[test]
-    fn single_query_contains_attribute_find_all() {
-        // <div>
-        //     <div id="myid" style="somestyle">
-        //         <p title="hey">
-        //     <p>
-        // <div style="otherstyle" id="otherid">
-        //     <p>
-        // <p title="yo" style="cat">
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let mut res = doc.insert_attribute("id", "myid", div_id_2, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("style", "somestyle", div_id_2, Location::default());
-        assert!(res.is_ok());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        res = doc.insert_attribute("title", "key", p_id, Location::default());
-        assert!(res.is_ok());
-        let _ = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        res = doc.insert_attribute("style", "otherstyle", div_id_3, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("id", "otherid", div_id_3, Location::default());
-        assert!(res.is_ok());
-        let _ = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let p_id_4 = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        res = doc.insert_attribute("title", "yo", p_id_4, Location::default());
-        assert!(res.is_ok());
-        res = doc.insert_attribute("style", "cat", p_id_4, Location::default());
-        assert!(res.is_ok());
-
-        let query = Query::new().contains_attribute("style").find_all();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 3);
-        assert_eq!(found_ids, [div_id_2, div_id_3, p_id_4]);
-    }
-
-    #[test]
-    fn single_query_contains_child_find_first() {
-        // <div>
-        //     <div>
-        //         <p>
-        //     <p>
-        // <div>
-        //     <p>
-        // <p>
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let _ = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let _ = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let query = Query::new().contains_child_tag("p").find_first();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 1);
-        assert_eq!(found_ids, [NodeId::root()]);
-    }
-
-    #[test]
-    fn single_query_contains_child_find_all() {
-        // <div>
-        //     <div>
-        //         <p>
-        //     <p>
-        // <div>
-        //     <p>
-        // <p>
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let _ = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let _ = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let query = Query::new().contains_child_tag("p").find_all();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 4);
-        assert_eq!(found_ids, [NodeId::root(), div_id, div_id_2, div_id_3]);
-    }
-
-    #[test]
-    fn single_query_has_parent_find_first() {
-        // <div>
-        //     <div>
-        //         <p>
-        //     <p>
-        // <div>
-        //     <p>
-        // <p>
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let _ = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let _ = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let _ = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let query = Query::new().has_parent_tag("div").find_first();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 1);
-        assert_eq!(found_ids, [div_id_2]);
-    }
-
-    #[test]
-    fn single_query_has_parent_find_all() {
-        // <div>
-        //     <div>
-        //         <p>
-        //     <p>
-        // <div>
-        //     <p>
-        // <p>
-        let mut doc = DocumentBuilder::new_document(None);
-
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let p_id_2 = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-
-        let div_id_3 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let p_id_3 = doc.create_element("p", div_id_3, None, HTML_NAMESPACE, Location::default());
-
-        let _ = doc.create_element(
-            "p",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let query = Query::new().has_parent_tag("div").find_all();
-        let found_ids = doc.query(&query).unwrap();
-        assert_eq!(found_ids.len(), 4);
-        assert_eq!(found_ids, [div_id_2, p_id, p_id_2, p_id_3]);
-    }
-
-    #[test]
-    fn tree_iterator() {
-        let mut doc = DocumentBuilder::new_document(None);
-
-        // <div>
-        //     <div>
-        //         <p>first p tag
-        //         <p>second p tag
-        //     <p>third p tag
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        let div_id_2 = doc.create_element("div", div_id, None, HTML_NAMESPACE, Location::default());
-        let p_id = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let text_id = doc.create_text("first p tag", p_id, Location::default());
-        let p_id_2 = doc.create_element("p", div_id_2, None, HTML_NAMESPACE, Location::default());
-        let text_id_2 = doc.create_text("second p tag", p_id_2, Location::default());
-        let p_id_3 = doc.create_element("p", div_id, None, HTML_NAMESPACE, Location::default());
-        let text_id_3 = doc.create_text("third p tag", p_id_3, Location::default());
-
-        let tree_iterator = TreeIterator::new(&doc);
-
-        let expected_order = vec![
-            NodeId::root(),
-            div_id,
-            div_id_2,
-            p_id,
-            text_id,
-            p_id_2,
-            text_id_2,
-            p_id_3,
-            text_id_3,
-        ];
-
-        let mut traversed_nodes = Vec::new();
-        for current_node_id in tree_iterator {
-            traversed_nodes.push(current_node_id);
-        }
-
-        assert_eq!(expected_order, traversed_nodes);
-    }
-
-    #[test]
-    fn tree_iterator_mutation() {
-        let mut doc = DocumentBuilder::new_document(None);
-        let div_id = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-
-        let mut tree_iterator = TreeIterator::new(&doc);
-        let mut current_node_id;
-
-        current_node_id = tree_iterator.next();
-        assert_eq!(current_node_id.unwrap(), NodeId::root());
-
-        // we mutate the tree while the iterator is still "open"
-        let div_id_2 = doc.create_element(
-            "div",
-            NodeId::root(),
-            None,
-            HTML_NAMESPACE,
-            Location::default(),
-        );
-        current_node_id = tree_iterator.next();
-        assert_eq!(current_node_id.unwrap(), div_id);
-
-        // and find this node on next iteration
-        current_node_id = tree_iterator.next();
-        assert_eq!(current_node_id.unwrap(), div_id_2);
-    }
-}
diff --git a/crates/gosub_html5/src/error_logger.rs b/crates/gosub_html5/src/parser/errors.rs
similarity index 90%
rename from crates/gosub_html5/src/error_logger.rs
rename to crates/gosub_html5/src/parser/errors.rs
index 2f5304238..e339d6935 100755
--- a/crates/gosub_html5/src/error_logger.rs
+++ b/crates/gosub_html5/src/parser/errors.rs
@@ -69,9 +69,7 @@ impl ParserError {
                 "absence-of-digits-in-numeric-character-reference"
             }
             ParserError::CdataInHtmlContent => "cdata-in-html-content",
-            ParserError::CharacterReferenceOutsideUnicodeRange => {
-                "character-reference-outside-unicode-range"
-            }
+            ParserError::CharacterReferenceOutsideUnicodeRange => "character-reference-outside-unicode-range",
             ParserError::ControlCharacterInInputStream => "control-character-in-input-stream",
             ParserError::ControlCharacterReference => "control-character-reference",
             ParserError::EndTagWithAttributes => "end-tag-with-attributes",
@@ -86,36 +84,24 @@ impl ParserError {
             ParserError::EofInTag => "eof-in-tag",
             ParserError::IncorrectlyClosedComment => "incorrectly-closed-comment",
             ParserError::IncorrectlyOpenedComment => "incorrectly-opened-comment",
-            ParserError::InvalidCharacterSequenceAfterDoctypeName => {
-                "invalid-character-sequence-after-doctype-name"
-            }
+            ParserError::InvalidCharacterSequenceAfterDoctypeName => "invalid-character-sequence-after-doctype-name",
             ParserError::InvalidFirstCharacterOfTagName => "invalid-first-character-of-tag-name",
             ParserError::MissingAttributeValue => "missing-attribute-value",
             ParserError::MissingDoctypeName => "missing-doctype-name",
             ParserError::MissingDoctypePublicIdentifier => "missing-doctype-public-identifier",
             ParserError::MissingDoctypeSystemIdentifier => "missing-doctype-system-identifier",
             ParserError::MissingEndTagName => "missing-end-tag-name",
-            ParserError::MissingQuoteBeforeDoctypePublicIdentifier => {
-                "missing-quote-before-doctype-public-identifier"
-            }
-            ParserError::MissingQuoteBeforeDoctypeSystemIdentifier => {
-                "missing-quote-before-doctype-system-identifier"
-            }
-            ParserError::MissingSemicolonAfterCharacterReference => {
-                "missing-semicolon-after-character-reference"
-            }
+            ParserError::MissingQuoteBeforeDoctypePublicIdentifier => "missing-quote-before-doctype-public-identifier",
+            ParserError::MissingQuoteBeforeDoctypeSystemIdentifier => "missing-quote-before-doctype-system-identifier",
+            ParserError::MissingSemicolonAfterCharacterReference => "missing-semicolon-after-character-reference",
             ParserError::MissingWhitespaceAfterDoctypePublicKeyword => {
                 "missing-whitespace-after-doctype-public-keyword"
             }
             ParserError::MissingWhitespaceAfterDoctypeSystemKeyword => {
                 "missing-whitespace-after-doctype-system-keyword"
             }
-            ParserError::MissingWhitespaceBeforeDoctypeName => {
-                "missing-whitespace-before-doctype-name"
-            }
-            ParserError::MissingWhitespaceBetweenAttributes => {
-                "missing-whitespace-between-attributes"
-            }
+            ParserError::MissingWhitespaceBeforeDoctypeName => "missing-whitespace-before-doctype-name",
+            ParserError::MissingWhitespaceBetweenAttributes => "missing-whitespace-between-attributes",
             ParserError::MissingWhitespaceBetweenDoctypePublicAndSystemIdentifiers => {
                 "missing-whitespace-between-doctype-public-and-system-identifiers"
             }
@@ -131,19 +117,13 @@ impl ParserError {
             ParserError::UnexpectedCharacterAfterDoctypeSystemIdentifier => {
                 "unexpected-character-after-doctype-system-identifier"
             }
-            ParserError::UnexpectedCharacterInAttributeName => {
-                "unexpected-character-in-attribute-name"
-            }
+            ParserError::UnexpectedCharacterInAttributeName => "unexpected-character-in-attribute-name",
             ParserError::UnexpectedCharacterInUnquotedAttributeValue => {
                 "unexpected-character-in-unquoted-attribute-value"
             }
-            ParserError::UnexpectedEqualsSignBeforeAttributeName => {
-                "unexpected-equals-sign-before-attribute-name"
-            }
+            ParserError::UnexpectedEqualsSignBeforeAttributeName => "unexpected-equals-sign-before-attribute-name",
             ParserError::UnexpectedNullCharacter => "unexpected-null-character",
-            ParserError::UnexpectedQuestionMarkInsteadOfTagName => {
-                "unexpected-question-mark-instead-of-tag-name"
-            }
+            ParserError::UnexpectedQuestionMarkInsteadOfTagName => "unexpected-question-mark-instead-of-tag-name",
             ParserError::UnexpectedSolidusInTag => "unexpected-solidus-in-tag",
             ParserError::UnknownNamedCharacterReference => "unknown-named-character-reference",
             ParserError::AbruptClosingOfEmptyComment => "abrupt-closing-of-empty-comment",
@@ -190,7 +170,7 @@ impl ErrorLogger {
 
         self.errors.push(ParseError {
             message: message.to_string(),
-            location: location.clone(),
+            location,
         });
     }
 }
diff --git a/crates/gosub_html5/src/parser/helper.rs b/crates/gosub_html5/src/parser/helper.rs
index 2ba256ac0..3eb25566e 100644
--- a/crates/gosub_html5/src/parser/helper.rs
+++ b/crates/gosub_html5/src/parser/helper.rs
@@ -1,25 +1,26 @@
-use crate::element_class::ElementClass;
-use crate::node::data::text::TextData;
-use crate::node::{Node, NodeData, NodeId, HTML_NAMESPACE};
+use crate::node::HTML_NAMESPACE;
 use crate::parser::{ActiveElement, Html5Parser, Scope};
 use crate::tokenizer::token::Token;
-use std::collections::HashMap;
-
-use super::document::{Document, DocumentHandle};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::document::DocumentFragment;
+use gosub_shared::traits::node::{ElementDataType, Node, TextDataType};
 
 const ADOPTION_AGENCY_OUTER_LOOP_DEPTH: usize = 8;
 const ADOPTION_AGENCY_INNER_LOOP_DEPTH: usize = 3;
 
 #[derive(Debug)]
-pub enum InsertionPositionMode<NodeId> {
+pub enum InsertionPositionMode<D: Document<C>, C: CssSystem, NodeId> {
     LastChild {
-        handle: DocumentHandle,
-        parent: NodeId,
+        handle: DocumentHandle<D, C>,
+        parent_id: NodeId,
     },
     Sibling {
-        handle: DocumentHandle,
-        parent: NodeId,
-        before: NodeId,
+        handle: DocumentHandle<D, C>,
+        parent_id: NodeId,
+        before_id: NodeId,
     },
 }
 
@@ -28,7 +29,14 @@ pub enum BookMark<NodeId> {
     InsertAfter(NodeId),
 }
 
-impl Html5Parser<'_> {
+impl<'chars, D, C> Html5Parser<'chars, D, C>
+where
+    D: Document<C>,
+    C: CssSystem,
+    <<D as Document<C>>::Node as Node<C>>::ElementData: ElementDataType<C, Document = D>,
+    <<<D as Document<C>>::Node as Node<C>>::ElementData as ElementDataType<C>>::DocumentFragment:
+        DocumentFragment<C, Document = D>,
+{
     fn find_position_in_active_format(&self, node_id: NodeId) -> Option<usize> {
         self.active_formatting_elements
             .iter()
@@ -46,7 +54,8 @@ impl Html5Parser<'_> {
             .rev()
             .find_map(|(i, &node_id)| {
                 if let ActiveElement::Node(node_id) = node_id {
-                    if get_node_by_id!(self.document, node_id).name == subject {
+                    let node = get_node_by_id!(self.document, node_id);
+                    if get_element_data!(node).name() == subject {
                         Some((i, node_id))
                     } else {
                         None
@@ -63,7 +72,8 @@ impl Html5Parser<'_> {
             .enumerate()
             .skip(format_ele_position)
             .find_map(|(i, &node_id)| {
-                if get_node_by_id!(self.document, node_id).is_special() {
+                let node = get_node_by_id!(self.document, node_id);
+                if get_element_data!(node).is_special() {
                     Some((i, node_id))
                 } else {
                     None
@@ -71,78 +81,74 @@ impl Html5Parser<'_> {
             })
     }
 
-    pub fn insert_element_helper(&mut self, node: NodeId, position: InsertionPositionMode<NodeId>) {
+    pub fn insert_element_helper(&mut self, node_id: NodeId, position: InsertionPositionMode<D, C, NodeId>) {
         match position {
             InsertionPositionMode::Sibling {
                 handle,
-                parent,
-                before,
+                parent_id,
+                before_id,
             } => {
-                let mut doc = handle;
-                let parent_node = get_node_by_id!(doc, parent);
-                let position = parent_node.children.iter().position(|&x| x == before);
-                doc.attach_node_to_parent(node, parent, position);
+                let parent_node = get_node_by_id!(handle, parent_id);
+                let position = parent_node.children().iter().position(|&x| x == before_id);
+
+                let mut_handle = &mut handle.clone();
+                mut_handle.get_mut().attach_node(node_id, parent_id, position);
             }
-            InsertionPositionMode::LastChild { handle, parent } => {
-                let mut doc = handle;
-                doc.attach_node_to_parent(node, parent, None);
+            InsertionPositionMode::LastChild { handle, parent_id } => {
+                let mut_handle = &mut handle.clone();
+                mut_handle.get_mut().attach_node(node_id, parent_id, None);
             }
         }
     }
 
-    pub fn insert_text_helper(&mut self, position: InsertionPositionMode<NodeId>, token: &Token) {
+    pub fn insert_text_helper(&mut self, position: InsertionPositionMode<D, C, NodeId>, token: &Token) {
         match position {
             InsertionPositionMode::Sibling {
                 handle,
-                parent,
-                before,
+                parent_id,
+                before_id,
             } => {
-                let mut doc = handle;
-                let parent_node = get_node_by_id!(doc, parent);
-                let position = parent_node.children.iter().position(|&x| x == before);
+                let parent_node = get_node_by_id!(handle, parent_id);
+                let position = parent_node.children().iter().position(|&x| x == before_id);
                 match position {
                     None | Some(0) => {
                         let node = self.create_node(token, HTML_NAMESPACE);
-                        doc.add_node(node, parent, position);
+                        let mut_handle = &mut handle.clone();
+                        mut_handle.get_mut().register_node_at(node, parent_id, position);
                     }
                     Some(index) => {
-                        let last_node_id = parent_node.children[index - 1];
-                        if let NodeData::Text(TextData { ref mut value, .. }) = doc
-                            .get_mut()
-                            .get_node_by_id_mut(last_node_id)
-                            .expect("node not found")
-                            .data
-                        {
-                            value.push_str(&token.to_string());
+                        let last_node_id = parent_node.children()[index - 1];
+
+                        // If last node is a text node, we merge the text to that node instead of adding a new extra node
+                        let mut last_node = get_node_by_id!(handle.clone(), last_node_id);
+                        if last_node.is_text_node() {
+                            let data = get_text_data_mut!(&mut last_node);
+                            data.value_mut().push_str(&token.to_string());
+                            handle.clone().get_mut().update_node(last_node);
                             return;
-                        };
+                        }
 
                         let node = self.create_node(token, HTML_NAMESPACE);
-                        doc.add_node(node, parent, Some(index));
+                        handle.clone().get_mut().register_node_at(node, parent_id, Some(index));
                     }
                 }
             }
-            InsertionPositionMode::LastChild { handle, parent } => {
-                let mut doc = handle;
-                let parent_node = get_node_by_id!(doc, parent);
-                if let Some(last_node_id) = parent_node.children.last() {
-                    if let NodeData::Text(TextData { ref mut value, .. }) = self
-                        .document
-                        .get_mut()
-                        .get_node_by_id_mut(*last_node_id)
-                        .expect("node not found")
-                        .data
-                    {
-                        value.push_str(&token.to_string());
+            InsertionPositionMode::LastChild { handle, parent_id } => {
+                let parent_node = get_node_by_id!(handle, parent_id);
+                if let Some(&last_node_id) = parent_node.children().last() {
+                    // If the last node is a text node we merge the text to that node instead of adding a new extra node
+                    let mut last_node = get_node_by_id!(handle.clone(), last_node_id);
+                    if last_node.is_text_node() {
+                        let data = last_node.get_text_data_mut().unwrap();
+                        data.value_mut().push_str(&token.to_string());
+                        handle.clone().get_mut().update_node(last_node);
                         return;
-                    };
-                    let node = self.create_node(token, HTML_NAMESPACE);
-                    doc.add_node(node, parent, None);
-                    return;
+                    }
                 }
 
+                // Just add the node to the parent as the last node
                 let node = self.create_node(token, HTML_NAMESPACE);
-                doc.add_node(node, parent, None);
+                handle.clone().get_mut().register_node_at(node, parent_id, None);
             }
         }
     }
@@ -161,79 +167,51 @@ impl Html5Parser<'_> {
         override_node: Option<NodeId>,
         namespace: Option<&str>,
     ) -> NodeId {
-        let mut node = self.create_node(token, namespace.unwrap_or(HTML_NAMESPACE));
-        // add CSS classes from class attribute in element
-        // e.g., <div class="one two three">
-        // TODO: this will be refactored later in ElementAttributes to do this
-        // when inserting a "class" attribute. Similar to "id" to attach it to the DOM
-        // named_id_list. Although this will require some shared pointers
-
-        if let NodeData::Element(ref mut element) = node.data {
-            if element.attributes.contains_key("class") {
-                if let Some(class_string) = element.attributes.get("class") {
-                    element.classes = ElementClass::from(class_string.as_str());
-                }
-            }
-        }
+        let node = self.create_node(token, namespace.unwrap_or(HTML_NAMESPACE));
         self.insert_element(node, override_node)
     }
 
-    pub fn insert_element_from_node(
-        &mut self,
-        org_node: &Node,
-        override_node: Option<NodeId>,
-    ) -> NodeId {
+    pub fn insert_element_from_node(&mut self, org_node: &D::Node, override_node: Option<NodeId>) -> NodeId {
         // Create a node, but without children and push it onto the open elements stack (if needed)
-        let mut new_node = org_node.clone();
-        new_node.children = Vec::new();
-        new_node.parent = None;
-        new_node.is_registered = false;
-
-        if let NodeData::Element(ref mut element) = new_node.data {
-            if element.attributes.contains_key("class") {
-                if let Some(class_string) = element.attributes.get("class") {
-                    element.classes = ElementClass::from(class_string.as_str());
-                }
-            }
-        }
+        let new_node = D::Node::new_from_node(org_node);
         self.insert_element(new_node, override_node)
     }
 
-    pub fn insert_element(&mut self, node: Node, override_node: Option<NodeId>) -> NodeId {
-        let node_id = self.document.get_mut().add_new_node(node);
+    pub fn insert_element(&mut self, node: D::Node, override_node: Option<NodeId>) -> NodeId {
+        let node_id = self.document.get_mut().register_node(node);
+
         let insert_position = self.appropriate_place_insert(override_node);
         self.insert_element_helper(node_id, insert_position);
 
         //     if parser not created as part of html fragment parsing algorithm
         //       pop the top element queue from the relevant agent custom element reactions stack (???)
 
-        // push element onto the stack of open elements so that is the new current node
         self.open_elements.push(node_id);
-
-        // return element
         node_id
     }
 
     pub fn insert_doctype_element(&mut self, token: &Token) {
         let node = self.create_node(token, HTML_NAMESPACE);
-        self.document.get_mut().add_node(node, NodeId::root(), None);
+        self.document.get_mut().register_node_at(node, NodeId::root(), None);
     }
 
     pub fn insert_document_element(&mut self, token: &Token) {
         let node = self.create_node(token, HTML_NAMESPACE);
-        let node_id = self.document.get_mut().add_node(node, NodeId::root(), None);
+        let node_id = self.document.get_mut().register_node_at(node, NodeId::root(), None);
+
         self.open_elements.push(node_id);
     }
 
     pub fn insert_comment_element(&mut self, token: &Token, insert_position: Option<NodeId>) {
         let node = self.create_node(token, HTML_NAMESPACE);
         if let Some(position) = insert_position {
-            self.document.get_mut().add_node(node, position, None);
-        } else {
-            let node_id = self.document.get_mut().add_new_node(node);
-            let insert_position = self.appropriate_place_insert(None);
-            self.insert_element_helper(node_id, insert_position);
+            self.document.get_mut().register_node_at(node, position, None);
+            return;
         }
+
+        let node_id = self.document.get_mut().register_node(node);
+        let insert_position = self.appropriate_place_insert(None);
+        self.insert_element_helper(node_id, insert_position);
     }
 
     pub fn insert_text_element(&mut self, token: &Token) {
@@ -249,64 +227,69 @@ impl Html5Parser<'_> {
         self.insert_text_helper(insertion_position, token);
     }
 
-    // @todo: where is the fragment case handled? (substep 4: https://html.spec.whatwg.org/multipage/parsing.html#appropriate-place-for-inserting-a-node)
-    pub fn appropriate_place_insert(
-        &self,
-        override_node: Option<NodeId>,
-    ) -> InsertionPositionMode<NodeId> {
-        let current_node_id = current_node!(self).id;
-        let target_id = override_node.unwrap_or(current_node_id);
+    // @todo: where is the fragment case handled? (sub step 4: https://html.spec.whatwg.org/multipage/parsing.html#appropriate-place-for-inserting-a-node)
+    pub fn appropriate_place_insert(&self, override_node: Option<NodeId>) -> InsertionPositionMode<D, C, NodeId> {
+        let current_node = current_node!(self);
+
+        // if current_node.id() == NodeId::root() {
+        //     return InsertionPositionMode::LastChild {
+        //         handle: self.document.clone(),
+        //         parent_id: NodeId::root(),
+        //     };
+        // }
+
+        // let element_data = get_element_data!(current_node);
+        let target_id = override_node.unwrap_or(current_node.id());
         let target_node = get_node_by_id!(self.document, target_id);
-        if !(self.foster_parenting
-            && ["table", "tbody", "thead", "tfoot", "tr"].contains(&target_node.name.as_str()))
+        let target_element_data = get_element_data!(target_node);
+
+        if !(self.foster_parenting && ["table", "tbody", "thead", "tfoot", "tr"].contains(&target_element_data.name()))
         {
-            if target_node.name == "template" && target_node.is_namespace(HTML_NAMESPACE) {
-                if let NodeData::Element(element) = target_node.data {
-                    if let Some(template_contents) = element.template_contents {
-                        return InsertionPositionMode::LastChild {
-                            handle: Document::clone(&template_contents.doc),
-                            parent: target_id,
-                        };
-                    }
+            if target_element_data.name() == "template" && target_element_data.is_namespace(HTML_NAMESPACE) {
+                if let Some(template_fragment) = target_element_data.template_contents() {
+                    return InsertionPositionMode::LastChild {
+                        handle: template_fragment.handle(),
+                        parent_id: target_id,
+                    };
                 }
             } else {
                 return InsertionPositionMode::LastChild {
-                    handle: Document::clone(&self.document),
-                    parent: target_id,
+                    handle: self.document.clone(),
+                    parent_id: target_id,
                 };
             }
         }
         let mut iter = self.open_elements.iter().rev().peekable();
         while let Some(node_id) = iter.next() {
             let node = get_node_by_id!(self.document, *node_id);
-            if node.name == "template" {
-                if let NodeData::Element(element) = node.data {
-                    if let Some(template_contents) = &element.template_contents {
-                        return InsertionPositionMode::LastChild {
-                            handle: Document::clone(&template_contents.doc),
-                            parent: *node_id,
-                        };
-                    }
+            let element_data = get_element_data!(node);
+
+            if element_data.name() == "template" {
+                if let Some(template_fragment) = element_data.template_contents() {
+                    return InsertionPositionMode::LastChild {
+                        handle: template_fragment.handle(),
+                        parent_id: *node_id,
+                    };
                 }
-            } else if node.name == "table" {
-                if node.parent.is_some() {
+            } else if element_data.name() == "table" {
+                if let Some(parent_id) = node.parent_id() {
                     return InsertionPositionMode::Sibling {
-                        handle: Document::clone(&self.document),
-                        parent: node.parent.unwrap(),
-                        before: *node_id,
+                        handle: self.document.clone(),
+                        parent_id,
+                        before_id: *node_id,
                     };
                 }
                 // TODO has some question? can reached?
                 return InsertionPositionMode::LastChild {
-                    handle: Document::clone(&self.document),
-                    parent: *(*iter.peek().unwrap()),
+                    handle: self.document.clone(),
+                    parent_id: *(*iter.peek().unwrap()),
                 };
             }
         }
-        return InsertionPositionMode::LastChild {
-            handle: Document::clone(&self.document),
-            parent: *self.open_elements.first().unwrap(),
-        };
+        InsertionPositionMode::LastChild {
+            handle: self.document.clone(),
+            parent_id: *self.open_elements.first().unwrap(),
+        }
     }
 
     pub fn adoption_agency_algorithm(&mut self, token: &Token) {
@@ -316,14 +299,13 @@ impl Html5Parser<'_> {
             _ => panic!("un reached"),
         };
         let current_node = current_node!(self);
-        let current_node_id = current_node.id;
+        // let current_node_id = current_node.id();
+        let current_data = get_element_data!(current_node);
 
         // step 2
-        if current_node.name == *subject
-            && current_node.is_namespace(HTML_NAMESPACE)
-            && self
-                .find_position_in_active_format(current_node_id)
-                .is_none()
+        if current_data.name() == *subject
+            && current_data.is_namespace(HTML_NAMESPACE)
+            && self.find_position_in_active_format(current_node.id()).is_none()
         {
             self.open_elements.pop();
             return;
@@ -343,19 +325,16 @@ impl Html5Parser<'_> {
             outer_loop_counter += 1;
 
             // step 4.3
-            let (format_elem_idx, format_elem_node_id) =
-                match self.find_format_element_index(subject) {
-                    None => {
-                        return self.handle_in_body_any_other_end_tag(subject);
-                    }
-                    Some((idx, node_id)) => (idx, node_id),
-                };
-            let format_elem_node = get_node_by_id!(self.document, format_elem_node_id);
-            let format_ele_stack_position = match self
-                .open_elements
-                .iter()
-                .rposition(|&x| x == format_elem_node_id)
-            {
+            let (format_elem_idx, format_elem_node_id) = match self.find_format_element_index(subject) {
+                None => {
+                    return self.handle_in_body_any_other_end_tag(subject);
+                }
+                Some((idx, node_id)) => (idx, node_id),
+            };
+
+            let format_node = get_node_by_id!(self.document, format_elem_node_id);
+            let format_element_data = get_element_data!(format_node);
+            let format_ele_stack_position = match self.open_elements.iter().rposition(|&x| x == format_elem_node_id) {
                 // step 4.4
                 None => {
                     self.parse_error("not found format_element_node in open_elements");
@@ -366,13 +345,13 @@ impl Html5Parser<'_> {
             };
 
             // step 4.5
-            if !self.is_in_scope(&format_elem_node.name, HTML_NAMESPACE, Scope::Regular) {
+            if !self.is_in_scope(format_element_data.name(), HTML_NAMESPACE, Scope::Regular) {
                 self.parse_error("format_element_node not in regular scope");
                 return;
             }
 
             // step 4.6
-            if format_elem_node_id != current_node_id {
+            if format_elem_node_id != current_node.id() {
                 self.parse_error("format_element_node not current_node");
             }
 
@@ -424,29 +403,25 @@ impl Html5Parser<'_> {
                     continue;
                 }
                 // step 4.13.5
-                let Some(node_active_position) = self.find_position_in_active_format(node_id)
-                else {
+                let Some(node_active_position) = self.find_position_in_active_format(node_id) else {
                     self.open_elements.remove(node_idx);
                     continue;
                 };
 
                 // step 4.13.6
-                let element = get_node_by_id!(self.document, node_id);
-                let node_attributes = match element.data {
-                    NodeData::Element(element) => element.attributes.clone(),
-                    _ => HashMap::new(),
-                };
-                let replacement_node = Node::new_element(
-                    &self.document,
-                    &element.name,
-                    node_attributes,
-                    HTML_NAMESPACE,
-                    element.location.clone(),
+                let element_node = get_node_by_id!(self.document, node_id);
+                let element_data = get_element_data!(element_node);
+
+                let replacement_node = D::new_element_node(
+                    self.document.clone(),
+                    element_data.name(),
+                    Some(element_data.namespace()),
+                    element_data.attributes().clone(),
+                    element_node.location(),
                 );
-                let replace_node_id = self.document.get_mut().add_new_node(replacement_node);
+                let replace_node_id = self.document.get_mut().register_node(replacement_node);
 
-                self.active_formatting_elements[node_active_position] =
-                    ActiveElement::Node(replace_node_id);
+                self.active_formatting_elements[node_active_position] = ActiveElement::Node(replace_node_id);
 
                 self.open_elements[node_idx] = replace_node_id;
 
@@ -458,60 +433,48 @@ impl Html5Parser<'_> {
                 }
 
                 // step 4.13.8
-                self.document.detach_node_from_parent(last_node_id);
-                self.document
-                    .attach_node_to_parent(last_node_id, replace_node_id, None);
+                self.document.get_mut().detach_node(last_node_id);
+                self.document.get_mut().attach_node(last_node_id, replace_node_id, None);
 
                 // step 4.13.9
                 last_node_id = node_id;
             }
 
             // step 4.14
-            self.document.detach_node_from_parent(last_node_id);
+            self.document.get_mut().detach_node(last_node_id);
             let insert_position = self.appropriate_place_insert(Some(common_ancestor));
             self.insert_element_helper(last_node_id, insert_position);
 
             // step 4.15
-            let format_elem_attributes = match format_elem_node.data {
-                NodeData::Element(element) => element.attributes.clone(),
-                _ => HashMap::new(),
-            };
-            let new_format_node: Node = Node::new_element(
-                &self.document,
-                &format_elem_node.name,
-                format_elem_attributes,
-                HTML_NAMESPACE,
-                format_elem_node.location.clone(),
+            let new_format_node = D::new_element_node(
+                self.document.clone(),
+                format_element_data.name(),
+                Some(format_element_data.namespace()),
+                format_element_data.attributes().clone(),
+                format_node.location(),
             );
 
             // step 4.16
-            let new_node_id = self
-                .document
-                .get_mut()
-                .add_new_node(new_format_node.clone());
+            let new_node_id = self.document.get_mut().register_node(new_format_node);
+
             let further_block_node = get_node_by_id!(self.document, further_block_node_id);
-            for child in &further_block_node.children {
-                self.document.get_mut().relocate(*child, new_node_id);
+            for child in further_block_node.children() {
+                self.document.get_mut().relocate_node(*child, new_node_id);
             }
 
             // step 4.17
             self.document
                 .get_mut()
-                .attach_node_to_parent(new_node_id, further_block_node_id, None);
+                .attach_node(new_node_id, further_block_node_id, None);
 
             // step 4.18
             match bookmark_node_id {
                 BookMark::Replace(current) => {
-                    let index = self
-                        .find_position_in_active_format(current)
-                        .expect("node not found");
+                    let index = self.find_position_in_active_format(current).expect("node not found");
                     self.active_formatting_elements[index] = ActiveElement::Node(new_node_id);
                 }
                 BookMark::InsertAfter(previous) => {
-                    let index = self
-                        .find_position_in_active_format(previous)
-                        .expect("node not foudn")
-                        + 1;
+                    let index = self.find_position_in_active_format(previous).expect("node not found") + 1;
                     self.active_formatting_elements
                         .insert(index, ActiveElement::Node(new_node_id));
                     let position = self.find_position_in_active_format(format_elem_node_id);
@@ -521,9 +484,7 @@ impl Html5Parser<'_> {
 
             // step 4.19
             self.open_elements.retain(|x| x != &format_elem_node_id);
-            let position = self
-                .find_position_in_open_element(further_block_node_id)
-                .unwrap();
+            let position = self.find_position_in_open_element(further_block_node_id).unwrap();
             self.open_elements.insert(position + 1, new_node_id);
         }
     }
diff --git a/crates/gosub_html5/src/parser/query.rs b/crates/gosub_html5/src/parser/query.rs
index 4036e8952..3dcbaad49 100644
--- a/crates/gosub_html5/src/parser/query.rs
+++ b/crates/gosub_html5/src/parser/query.rs
@@ -31,8 +31,7 @@ impl Query {
 
     #[allow(dead_code)]
     pub(crate) fn equals_tag(mut self, tag_name: &str) -> Self {
-        self.conditions
-            .push(Condition::EqualsTag(tag_name.to_owned()));
+        self.conditions.push(Condition::EqualsTag(tag_name.to_owned()));
         self
     }
 
@@ -44,29 +43,25 @@ impl Query {
 
     #[allow(dead_code)]
     pub(crate) fn contains_class(mut self, class: &str) -> Self {
-        self.conditions
-            .push(Condition::ContainsClass(class.to_owned()));
+        self.conditions.push(Condition::ContainsClass(class.to_owned()));
         self
     }
 
     #[allow(dead_code)]
     pub(crate) fn contains_attribute(mut self, attribute: &str) -> Self {
-        self.conditions
-            .push(Condition::ContainsAttribute(attribute.to_owned()));
+        self.conditions.push(Condition::ContainsAttribute(attribute.to_owned()));
         self
     }
 
     #[allow(dead_code)]
     pub(crate) fn contains_child_tag(mut self, child_tag: &str) -> Self {
-        self.conditions
-            .push(Condition::ContainsChildTag(child_tag.to_owned()));
+        self.conditions.push(Condition::ContainsChildTag(child_tag.to_owned()));
         self
     }
 
     #[allow(dead_code)]
     pub(crate) fn has_parent_tag(mut self, parent_tag: &str) -> Self {
-        self.conditions
-            .push(Condition::HasParentTag(parent_tag.to_owned()));
+        self.conditions.push(Condition::HasParentTag(parent_tag.to_owned()));
         self
     }
 
@@ -119,21 +114,9 @@ mod tests {
         assert_eq!(query.conditions.len(), 6);
         assert_eq!(query.conditions[0], Condition::EqualsTag("div".to_owned()));
         assert_eq!(query.conditions[1], Condition::EqualsId("myid".to_owned()));
-        assert_eq!(
-            query.conditions[2],
-            Condition::ContainsClass("myclass".to_owned())
-        );
-        assert_eq!(
-            query.conditions[3],
-            Condition::ContainsAttribute("myattr".to_owned())
-        );
-        assert_eq!(
-            query.conditions[4],
-            Condition::ContainsChildTag("h1".to_owned())
-        );
-        assert_eq!(
-            query.conditions[5],
-            Condition::HasParentTag("html".to_owned())
-        );
+        assert_eq!(query.conditions[2], Condition::ContainsClass("myclass".to_owned()));
+        assert_eq!(query.conditions[3], Condition::ContainsAttribute("myattr".to_owned()));
+        assert_eq!(query.conditions[4], Condition::ContainsChildTag("h1".to_owned()));
+        assert_eq!(query.conditions[5], Condition::HasParentTag("html".to_owned()));
     }
 }
diff --git a/crates/gosub_html5/src/parser/quirks.rs b/crates/gosub_html5/src/parser/quirks.rs
index 3049f1ba8..084b81d96 100644
--- a/crates/gosub_html5/src/parser/quirks.rs
+++ b/crates/gosub_html5/src/parser/quirks.rs
@@ -1,18 +1,21 @@
 use crate::parser::Html5Parser;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::{Document, DocumentFragment};
+use gosub_shared::traits::node::{ElementDataType, Node, QuirksMode};
 
-#[derive(PartialEq, Debug, Copy, Clone)]
-pub enum QuirksMode {
-    Quirks,
-    LimitedQuirks,
-    NoQuirks,
-}
-
-impl Html5Parser<'_> {
+impl<'chars, D, C> Html5Parser<'chars, D, C>
+where
+    C: CssSystem,
+    D: Document<C>,
+    <<D as Document<C>>::Node as Node<C>>::ElementData: ElementDataType<C, Document = D>,
+    <<<D as Document<C>>::Node as Node<C>>::ElementData as ElementDataType<C>>::DocumentFragment:
+        DocumentFragment<C, Document = D>,
+{
     // returns the correct quirk mode for the given doctype
     pub(crate) fn identify_quirks_mode(
         &self,
         name: &Option<String>,
-        pub_identifer: Option<String>,
+        pub_identifier: Option<String>,
         sys_identifier: Option<String>,
         force_quirks: bool,
     ) -> QuirksMode {
@@ -20,7 +23,7 @@ impl Html5Parser<'_> {
             return QuirksMode::Quirks;
         }
 
-        if let Some(value) = pub_identifer {
+        if let Some(value) = pub_identifier {
             let pub_id = value.to_lowercase();
             if QUIRKS_PUB_IDENTIFIER_EQ.contains(&pub_id.as_str()) {
                 return QuirksMode::Quirks;
@@ -140,8 +143,7 @@ static QUIRKS_PUB_IDENTIFIER_PREFIX_MISSING_SYS: &[&str] = &[
     "-//w3c//dtd html 4.01 transitional//",
 ];
 
-static QUIRKS_SYS_IDENTIFIER_EQ: &[&str] =
-    &["http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd"];
+static QUIRKS_SYS_IDENTIFIER_EQ: &[&str] = &["http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd"];
 
 static LIMITED_QUIRKS_PUB_IDENTIFIER_PREFIX: &[&str] = &[
     "-//w3c//dtd xhtml 1.0 frameset//",
@@ -155,14 +157,16 @@ static LIMITED_QUIRKS_PUB_IDENTIFIER_PREFIX_NOT_MISSING_SYS: &[&str] = &[
 
 #[cfg(test)]
 mod tests {
+    use crate::document::document_impl::DocumentImpl;
     use crate::parser::Html5Parser;
     use crate::parser::QuirksMode;
+    use gosub_css3::system::Css3System;
     use gosub_shared::byte_stream::{ByteStream, Encoding, Location};
 
     #[test]
     fn test_quirks_mode() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let parser = Html5Parser::new_parser(stream, Location::default());
+        let parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         assert_eq!(
             parser.identify_quirks_mode(&None, None, None, false),
@@ -248,7 +252,7 @@ mod tests {
     #[test]
     fn test_quirks_mode_force() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let parser = Html5Parser::new_parser(stream, Location::default());
+        let parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         assert_eq!(
             parser.identify_quirks_mode(&Some("html".to_string()), None, None, true),
@@ -322,7 +326,7 @@ mod tests {
     #[test]
     fn test_quirks_mode_sys() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let parser = Html5Parser::new_parser(stream, Location::default());
+        let parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         assert_eq!(
             parser.identify_quirks_mode(
@@ -347,7 +351,7 @@ mod tests {
     #[test]
     fn test_quirks_mode_sys_missing() {
         let stream = &mut ByteStream::new(Encoding::UTF8, None);
-        let parser = Html5Parser::new_parser(stream, Location::default());
+        let parser = Html5Parser::<DocumentImpl<Css3System>, Css3System>::new_parser(stream, Location::default());
 
         assert_eq!(
             parser.identify_quirks_mode(
diff --git a/crates/gosub_html5/src/parser/tree_builder.rs b/crates/gosub_html5/src/parser/tree_builder.rs
index d27c756f9..59d6607ae 100644
--- a/crates/gosub_html5/src/parser/tree_builder.rs
+++ b/crates/gosub_html5/src/parser/tree_builder.rs
@@ -1,5 +1,5 @@
-use crate::parser::NodeId;
 use gosub_shared::byte_stream::Location;
+use gosub_shared::node::NodeId;
 use gosub_shared::types::Result;
 
 /// TreeBuilder is an interface to abstract DOM tree modifications.
@@ -25,20 +25,15 @@ pub trait TreeBuilder {
     fn create_comment(&mut self, content: &str, parent_id: NodeId, location: Location) -> NodeId;
 
     /// Insert/update an attribute for an element node.
-    fn insert_attribute(
-        &mut self,
-        key: &str,
-        value: &str,
-        element_id: NodeId,
-        location: Location,
-    ) -> Result<()>;
+    fn insert_attribute(&mut self, key: &str, value: &str, element_id: NodeId, location: Location) -> Result<()>;
 }
 
 #[cfg(test)]
 mod tests {
-    use gosub_testing::testing::tree_construction::fixture::{
-        fixture_root_path, read_fixture_from_path,
-    };
+    use crate::document::document_impl::DocumentImpl;
+    use crate::parser::Html5Parser;
+    use gosub_css3::system::Css3System;
+    use gosub_testing::testing::tree_construction::fixture::{fixture_root_path, read_fixture_from_path};
     use gosub_testing::testing::tree_construction::Harness;
     use test_case::test_case;
 
@@ -105,8 +100,7 @@ mod tests {
     #[test_case("webkit01.dat")]
     #[test_case("webkit02.dat")]
     fn tree_construction(filename: &str) {
-        let fixture_file =
-            read_fixture_from_path(fixture_root_path().join(filename)).expect("fixture");
+        let fixture_file = read_fixture_from_path(fixture_root_path().join(filename)).expect("fixture");
         let mut harness = Harness::new();
 
         for test in fixture_file.tests {
@@ -118,15 +112,22 @@ mod tests {
             // for each test, run it with and without scripting enabled based on the test file
             for &scripting_enabled in test.script_modes() {
                 let result = harness
-                    .run_test(test.clone(), scripting_enabled)
+                    .run_test::<Html5Parser<DocumentImpl<Css3System>, Css3System>, Css3System>(
+                        test.clone(),
+                        scripting_enabled,
+                    )
                     .expect("problem parsing");
 
-                println!(
-                    "tree construction: {}:{}\n{}",
-                    test.file_path,
-                    test.line,
-                    test.document_as_str()
-                );
+                // println!(
+                //     "tree construction: {}:{}\n{}",
+                //     test.file_path,
+                //     test.line,
+                //     test.document_as_str()
+                // );
+                if !result.is_success() {
+                    println!("tree construction failed: {:#?}", result);
+                }
+                // println!("{:?}\n", result);
                 assert!(result.is_success());
             }
         }
diff --git a/crates/gosub_html5/src/tokenizer.rs b/crates/gosub_html5/src/tokenizer.rs
index a0fb09de8..192df95f0 100644
--- a/crates/gosub_html5/src/tokenizer.rs
+++ b/crates/gosub_html5/src/tokenizer.rs
@@ -7,9 +7,9 @@ mod replacement_tables;
 #[cfg(test)]
 mod test_cases;
 
-use crate::error_logger::{ErrorLogger, ParserError};
 use crate::errors::Error;
 use crate::node::HTML_NAMESPACE;
+use crate::parser::errors::{ErrorLogger, ParserError};
 use crate::tokenizer::state::State;
 use crate::tokenizer::token::Token;
 use gosub_shared::byte_stream::Character::{Ch, StreamEnd};
@@ -138,7 +138,7 @@ impl<'stream> Tokenizer<'stream> {
     /// Returns the current location in the stream (with line/col number and byte offset)
     #[inline]
     pub(crate) fn get_location(&self) -> Location {
-        self.location_handler.cur_location.clone()
+        self.location_handler.cur_location
     }
 
     /// Retrieves the next token from the input stream or Token::EOF when the end is reached
@@ -180,7 +180,7 @@ impl<'stream> Tokenizer<'stream> {
                         Ch('&') => self.state = State::CharacterReferenceInData,
                         Ch('<') => {
                             self.state = {
-                                self.last_token_location = loc.clone();
+                                self.last_token_location = loc;
                                 State::TagOpen
                             }
                         }
@@ -274,7 +274,7 @@ impl<'stream> Tokenizer<'stream> {
                                 name: String::new(),
                                 is_self_closing: false,
                                 attributes: HashMap::new(),
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
                             self.stream_prev();
                             self.state = State::TagName;
@@ -282,12 +282,9 @@ impl<'stream> Tokenizer<'stream> {
                         Ch('?') => {
                             self.current_token = Some(Token::Comment {
                                 comment: String::new(),
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
-                            self.parse_error(
-                                ParserError::UnexpectedQuestionMarkInsteadOfTagName,
-                                loc,
-                            );
+                            self.parse_error(ParserError::UnexpectedQuestionMarkInsteadOfTagName, loc);
                             self.stream_prev();
                             self.state = State::BogusComment;
                         }
@@ -312,7 +309,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.current_token = Some(Token::EndTag {
                                 name: String::new(),
                                 is_self_closing: false,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
                             self.stream_prev();
                             self.state = State::TagName;
@@ -331,7 +328,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.parse_error(ParserError::InvalidFirstCharacterOfTagName, loc);
                             self.current_token = Some(Token::Comment {
                                 comment: String::new(),
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
                             self.stream_prev();
                             self.state = State::BogusComment;
@@ -380,7 +377,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.current_token = Some(Token::EndTag {
                                 name: String::new(),
                                 is_self_closing: false,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
                             self.stream_prev();
                             self.state = State::RCDATAEndTagName;
@@ -467,7 +464,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.current_token = Some(Token::EndTag {
                                 name: String::new(),
                                 is_self_closing: false,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
                             self.stream_prev();
                             self.state = State::RAWTEXTEndTagName;
@@ -562,7 +559,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.current_token = Some(Token::EndTag {
                                 name: format!("{}", to_lowercase!(ch)),
                                 is_self_closing: false,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
 
                             self.temporary_buffer.push(ch);
@@ -760,7 +757,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.current_token = Some(Token::EndTag {
                                 name: String::new(),
                                 is_self_closing: false,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
 
                             self.stream_prev();
@@ -973,10 +970,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::AfterAttributeName;
                         }
                         Ch('=') => {
-                            self.parse_error(
-                                ParserError::UnexpectedEqualsSignBeforeAttributeName,
-                                loc,
-                            );
+                            self.parse_error(ParserError::UnexpectedEqualsSignBeforeAttributeName, loc);
 
                             self.store_and_clear_current_attribute();
                             self.current_attr_name.push(c.into());
@@ -1148,10 +1142,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.current_attr_value.push(CHAR_REPLACEMENT);
                         }
                         Ch('"' | '\'' | '<' | '=' | '`') => {
-                            self.parse_error(
-                                ParserError::UnexpectedCharacterInUnquotedAttributeValue,
-                                loc,
-                            );
+                            self.parse_error(ParserError::UnexpectedCharacterInUnquotedAttributeValue, loc);
                             self.current_attr_value.push(c.into());
                         }
                         StreamEnd => {
@@ -1244,9 +1235,7 @@ impl<'stream> Tokenizer<'stream> {
                         continue;
                     }
 
-                    if Character::slice_to_string(self.stream.get_slice(7)).to_uppercase()
-                        == "DOCTYPE"
-                    {
+                    if Character::slice_to_string(self.stream.get_slice(7)).to_uppercase() == "DOCTYPE" {
                         self.stream_next_n(7);
                         self.state = State::DOCTYPE;
                         continue;
@@ -1275,7 +1264,7 @@ impl<'stream> Tokenizer<'stream> {
                     self.parse_error(ParserError::IncorrectlyOpenedComment, self.get_location());
                     self.current_token = Some(Token::Comment {
                         comment: String::new(),
-                        location: self.last_token_location.clone(),
+                        location: self.last_token_location,
                     });
 
                     self.state = State::BogusComment;
@@ -1513,7 +1502,7 @@ impl<'stream> Tokenizer<'stream> {
                                 force_quirks: false,
                                 pub_identifier: None,
                                 sys_identifier: None,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
 
                             self.add_to_token_name(to_lowercase!(ch));
@@ -1526,7 +1515,7 @@ impl<'stream> Tokenizer<'stream> {
                                 force_quirks: false,
                                 pub_identifier: None,
                                 sys_identifier: None,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
 
                             self.add_to_token_name(CHAR_REPLACEMENT);
@@ -1539,7 +1528,7 @@ impl<'stream> Tokenizer<'stream> {
                                 force_quirks: true,
                                 pub_identifier: None,
                                 sys_identifier: None,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
 
                             self.state = State::Data;
@@ -1553,7 +1542,7 @@ impl<'stream> Tokenizer<'stream> {
                                 force_quirks: true,
                                 pub_identifier: None,
                                 sys_identifier: None,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
 
                             self.state = State::Data;
@@ -1564,7 +1553,7 @@ impl<'stream> Tokenizer<'stream> {
                                 force_quirks: false,
                                 pub_identifier: None,
                                 sys_identifier: None,
-                                location: self.last_token_location.clone(),
+                                location: self.last_token_location,
                             });
 
                             self.add_to_token_name(c.into());
@@ -1616,16 +1605,12 @@ impl<'stream> Tokenizer<'stream> {
                         }
                         _ => {
                             self.stream_prev();
-                            if Character::slice_to_string(self.stream.get_slice(6)).to_uppercase()
-                                == "PUBLIC"
-                            {
+                            if Character::slice_to_string(self.stream.get_slice(6)).to_uppercase() == "PUBLIC" {
                                 self.stream_next_n(6);
                                 self.state = State::AfterDOCTYPEPublicKeyword;
                                 continue;
                             }
-                            if Character::slice_to_string(self.stream.get_slice(6)).to_uppercase()
-                                == "SYSTEM"
-                            {
+                            if Character::slice_to_string(self.stream.get_slice(6)).to_uppercase() == "SYSTEM" {
                                 self.stream_next_n(6);
                                 self.state = State::AfterDOCTYPESystemKeyword;
                                 continue;
@@ -1634,10 +1619,7 @@ impl<'stream> Tokenizer<'stream> {
                             // unread the character
                             let loc = self.get_location();
                             self.stream_next_n(1);
-                            self.parse_error(
-                                ParserError::InvalidCharacterSequenceAfterDoctypeName,
-                                loc,
-                            );
+                            self.parse_error(ParserError::InvalidCharacterSequenceAfterDoctypeName, loc);
                             self.stream_prev();
                             self.set_quirks_mode(true);
                             self.stream_prev();
@@ -1653,18 +1635,12 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::BeforeDOCTYPEPublicIdentifier;
                         }
                         Ch('"') => {
-                            self.parse_error(
-                                ParserError::MissingWhitespaceAfterDoctypePublicKeyword,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingWhitespaceAfterDoctypePublicKeyword, loc);
                             self.set_public_identifier(String::new());
                             self.state = State::DOCTYPEPublicIdentifierDoubleQuoted;
                         }
                         Ch('\'') => {
-                            self.parse_error(
-                                ParserError::MissingWhitespaceAfterDoctypePublicKeyword,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingWhitespaceAfterDoctypePublicKeyword, loc);
                             self.set_public_identifier(String::new());
                             self.state = State::DOCTYPEPublicIdentifierSingleQuoted;
                         }
@@ -1681,10 +1657,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::Data;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::MissingQuoteBeforeDoctypePublicIdentifier,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingQuoteBeforeDoctypePublicIdentifier, loc);
                             self.stream_prev();
                             self.set_quirks_mode(true);
                             self.state = State::BogusDOCTYPE;
@@ -1720,10 +1693,7 @@ impl<'stream> Tokenizer<'stream> {
                         }
                         _ => {
                             self.stream_prev();
-                            self.parse_error(
-                                ParserError::MissingQuoteBeforeDoctypePublicIdentifier,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingQuoteBeforeDoctypePublicIdentifier, loc);
                             self.set_quirks_mode(true);
                             self.state = State::BogusDOCTYPE;
                         }
@@ -1789,12 +1759,18 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::Data;
                         }
                         Ch('"') => {
-                            self.parse_error(ParserError::MissingWhitespaceBetweenDoctypePublicAndSystemIdentifiers, loc);
+                            self.parse_error(
+                                ParserError::MissingWhitespaceBetweenDoctypePublicAndSystemIdentifiers,
+                                loc,
+                            );
                             self.set_system_identifier(String::new());
                             self.state = State::DOCTYPESystemIdentifierDoubleQuoted;
                         }
                         Ch('\'') => {
-                            self.parse_error(ParserError::MissingWhitespaceBetweenDoctypePublicAndSystemIdentifiers, loc);
+                            self.parse_error(
+                                ParserError::MissingWhitespaceBetweenDoctypePublicAndSystemIdentifiers,
+                                loc,
+                            );
                             self.set_system_identifier(String::new());
                             self.state = State::DOCTYPESystemIdentifierSingleQuoted;
                         }
@@ -1805,10 +1781,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::Data;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::MissingQuoteBeforeDoctypeSystemIdentifier,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingQuoteBeforeDoctypeSystemIdentifier, loc);
                             self.stream_prev();
                             self.set_quirks_mode(true);
                             self.state = State::BogusDOCTYPE;
@@ -1841,10 +1814,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::Data;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::MissingQuoteBeforeDoctypeSystemIdentifier,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingQuoteBeforeDoctypeSystemIdentifier, loc);
                             self.stream_prev();
                             self.set_quirks_mode(true);
                             self.state = State::BogusDOCTYPE;
@@ -1859,18 +1829,12 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::BeforeDOCTYPESystemIdentifier;
                         }
                         Ch('"') => {
-                            self.parse_error(
-                                ParserError::MissingWhitespaceAfterDoctypeSystemKeyword,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingWhitespaceAfterDoctypeSystemKeyword, loc);
                             self.set_system_identifier(String::new());
                             self.state = State::DOCTYPESystemIdentifierDoubleQuoted;
                         }
                         Ch('\'') => {
-                            self.parse_error(
-                                ParserError::MissingWhitespaceAfterDoctypeSystemKeyword,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingWhitespaceAfterDoctypeSystemKeyword, loc);
                             self.set_system_identifier(String::new());
                             self.state = State::DOCTYPESystemIdentifierSingleQuoted;
                         }
@@ -1887,10 +1851,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::Data;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::MissingQuoteBeforeDoctypeSystemIdentifier,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingQuoteBeforeDoctypeSystemIdentifier, loc);
                             self.stream_prev();
                             self.set_quirks_mode(true);
                             self.state = State::BogusDOCTYPE;
@@ -1925,10 +1886,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::Data;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::MissingQuoteBeforeDoctypeSystemIdentifier,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingQuoteBeforeDoctypeSystemIdentifier, loc);
                             self.stream_prev();
                             self.set_quirks_mode(true);
                             self.state = State::BogusDOCTYPE;
@@ -2001,10 +1959,7 @@ impl<'stream> Tokenizer<'stream> {
                             self.state = State::Data;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::UnexpectedCharacterAfterDoctypeSystemIdentifier,
-                                loc,
-                            );
+                            self.parse_error(ParserError::UnexpectedCharacterAfterDoctypeSystemIdentifier, loc);
                             self.stream_prev();
                             self.state = State::BogusDOCTYPE;
                         }
@@ -2178,7 +2133,7 @@ impl<'stream> Tokenizer<'stream> {
 
             self.token_queue.push(Token::Text {
                 text: value.to_string(),
-                location: self.last_token_location.clone(),
+                location: self.last_token_location,
             });
 
             self.clear_consume_buffer();
@@ -2232,9 +2187,7 @@ impl<'stream> Tokenizer<'stream> {
 
     /// Creates a parser log error message
     pub(crate) fn parse_error(&mut self, message: ParserError, location: Location) {
-        self.error_logger
-            .borrow_mut()
-            .add_error(location, message.as_str());
+        self.error_logger.borrow_mut().add_error(location, message.as_str());
     }
 
     /// Set is_closing_tag in current token
@@ -2245,9 +2198,7 @@ impl<'stream> Tokenizer<'stream> {
                 self.parse_error(ParserError::EndTagWithTrailingSolidus, self.get_location());
                 self.stream_next_n(1);
             }
-            Token::StartTag {
-                is_self_closing, ..
-            } => {
+            Token::StartTag { is_self_closing, .. } => {
                 *is_self_closing = is_closing;
             }
             _ => {}
@@ -2278,12 +2229,7 @@ impl<'stream> Tokenizer<'stream> {
             Token::StartTag { name, .. } | Token::EndTag { name, .. } => {
                 *name = new_name;
             }
-            _ => {
-                return Err(Error::Parse(
-                    "trying to set the name of a non start/end tag token".into(),
-                )
-                .into())
-            }
+            _ => return Err(Error::Parse("trying to set the name of a non start/end tag token".into()).into()),
         }
 
         Ok(())
@@ -2296,13 +2242,9 @@ impl<'stream> Tokenizer<'stream> {
 
     /// Saves the current attribute name and value onto the current_attrs stack, if there is anything to store
     fn store_and_clear_current_attribute(&mut self) {
-        if !self.current_attr_name.is_empty()
-            && !self.current_attrs.contains_key(&self.current_attr_name)
-        {
-            self.current_attrs.insert(
-                self.current_attr_name.clone(),
-                self.current_attr_value.clone(),
-            );
+        if !self.current_attr_name.is_empty() && !self.current_attrs.contains_key(&self.current_attr_name) {
+            self.current_attrs
+                .insert(self.current_attr_name.clone(), self.current_attr_value.clone());
         }
 
         self.current_attr_name = String::new();
diff --git a/crates/gosub_html5/src/tokenizer/character_reference.rs b/crates/gosub_html5/src/tokenizer/character_reference.rs
index c5888c3a3..d5502125c 100644
--- a/crates/gosub_html5/src/tokenizer/character_reference.rs
+++ b/crates/gosub_html5/src/tokenizer/character_reference.rs
@@ -1,6 +1,6 @@
 extern crate lazy_static;
 
-use crate::error_logger::ParserError;
+use crate::parser::errors::ParserError;
 use crate::tokenizer::replacement_tables::{TOKEN_NAMED_CHARS, TOKEN_REPLACEMENTS};
 use crate::tokenizer::{Tokenizer, CHAR_REPLACEMENT};
 use gosub_shared::byte_stream::Character::Ch;
@@ -25,11 +25,7 @@ impl Tokenizer<'_> {
     /// ref: 8.2.4.69 Tokenizing character references
     ///
     /// @TODO: fix additional allowed char
-    pub fn consume_character_reference(
-        &mut self,
-        _additional_allowed_char: Option<Character>,
-        as_attribute: bool,
-    ) {
+    pub fn consume_character_reference(&mut self, _additional_allowed_char: Option<Character>, as_attribute: bool) {
         let mut ccr_state = CcrState::CharacterReference;
         let mut char_ref_code: Option<u32> = Some(0);
 
@@ -117,10 +113,7 @@ impl Tokenizer<'_> {
                         }
                         Ch(';') => {
                             self.stream_prev();
-                            self.parse_error(
-                                ParserError::UnknownNamedCharacterReference,
-                                self.get_location(),
-                            );
+                            self.parse_error(ParserError::UnknownNamedCharacterReference, self.get_location());
                             return;
                         }
                         Character::StreamEnd => {
@@ -162,18 +155,12 @@ impl Tokenizer<'_> {
                             ccr_state = CcrState::HexadecimalCharacterReference;
                         }
                         Character::StreamEnd => {
-                            self.parse_error(
-                                ParserError::AbsenceOfDigitsInNumericCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::AbsenceOfDigitsInNumericCharacterReference, loc);
                             self.consume_temp_buffer(as_attribute);
                             return;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::AbsenceOfDigitsInNumericCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::AbsenceOfDigitsInNumericCharacterReference, loc);
                             self.consume_temp_buffer(as_attribute);
 
                             self.stream_prev();
@@ -190,18 +177,12 @@ impl Tokenizer<'_> {
                             ccr_state = CcrState::DecimalCharacterReference;
                         }
                         Character::StreamEnd => {
-                            self.parse_error(
-                                ParserError::AbsenceOfDigitsInNumericCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::AbsenceOfDigitsInNumericCharacterReference, loc);
                             self.consume_temp_buffer(as_attribute);
                             return;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::AbsenceOfDigitsInNumericCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::AbsenceOfDigitsInNumericCharacterReference, loc);
                             self.consume_temp_buffer(as_attribute);
 
                             self.stream_prev();
@@ -217,42 +198,30 @@ impl Tokenizer<'_> {
                         Ch(c @ '0'..='9') => {
                             let i = c as u32 - 0x30;
                             if let Some(value) = char_ref_code {
-                                char_ref_code = value
-                                    .checked_mul(16)
-                                    .and_then(|mul_result| mul_result.checked_add(i));
+                                char_ref_code = value.checked_mul(16).and_then(|mul_result| mul_result.checked_add(i));
                             }
                         }
                         Ch(c @ 'A'..='F') => {
                             let i = c as u32 - 0x37;
                             if let Some(value) = char_ref_code {
-                                char_ref_code = value
-                                    .checked_mul(16)
-                                    .and_then(|mul_result| mul_result.checked_add(i));
+                                char_ref_code = value.checked_mul(16).and_then(|mul_result| mul_result.checked_add(i));
                             }
                         }
                         Ch(c @ 'a'..='f') => {
                             let i = c as u32 - 0x57;
                             if let Some(value) = char_ref_code {
-                                char_ref_code = value
-                                    .checked_mul(16)
-                                    .and_then(|mul_result| mul_result.checked_add(i));
+                                char_ref_code = value.checked_mul(16).and_then(|mul_result| mul_result.checked_add(i));
                             }
                         }
                         Ch(';') => {
                             ccr_state = CcrState::NumericalCharacterReferenceEnd;
                         }
                         Character::StreamEnd => {
-                            self.parse_error(
-                                ParserError::MissingSemicolonAfterCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingSemicolonAfterCharacterReference, loc);
                             ccr_state = CcrState::NumericalCharacterReferenceEnd;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::MissingSemicolonAfterCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingSemicolonAfterCharacterReference, loc);
                             self.stream_prev();
                             ccr_state = CcrState::NumericalCharacterReferenceEnd;
                         }
@@ -266,26 +235,18 @@ impl Tokenizer<'_> {
                         Ch(c @ '0'..='9') => {
                             let i = c as u32 - 0x30;
                             if let Some(value) = char_ref_code {
-                                char_ref_code = value
-                                    .checked_mul(10)
-                                    .and_then(|mul_result| mul_result.checked_add(i));
+                                char_ref_code = value.checked_mul(10).and_then(|mul_result| mul_result.checked_add(i));
                             }
                         }
                         Ch(';') => {
                             ccr_state = CcrState::NumericalCharacterReferenceEnd;
                         }
                         Character::StreamEnd => {
-                            self.parse_error(
-                                ParserError::MissingSemicolonAfterCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingSemicolonAfterCharacterReference, loc);
                             ccr_state = CcrState::NumericalCharacterReferenceEnd;
                         }
                         _ => {
-                            self.parse_error(
-                                ParserError::MissingSemicolonAfterCharacterReference,
-                                loc,
-                            );
+                            self.parse_error(ParserError::MissingSemicolonAfterCharacterReference, loc);
                             ccr_state = CcrState::NumericalCharacterReferenceEnd;
                             self.stream_prev();
                         }
@@ -301,32 +262,20 @@ impl Tokenizer<'_> {
                     }
 
                     if char_ref_code > 0x10FFFF || overflow {
-                        self.parse_error(
-                            ParserError::CharacterReferenceOutsideUnicodeRange,
-                            self.get_location(),
-                        );
+                        self.parse_error(ParserError::CharacterReferenceOutsideUnicodeRange, self.get_location());
                         char_ref_code = CHAR_REPLACEMENT as u32;
                     }
 
                     if self.is_surrogate(char_ref_code) {
-                        self.parse_error(
-                            ParserError::SurrogateCharacterReference,
-                            self.get_location(),
-                        );
+                        self.parse_error(ParserError::SurrogateCharacterReference, self.get_location());
                         char_ref_code = CHAR_REPLACEMENT as u32;
                     }
                     if self.is_noncharacter(char_ref_code) {
-                        self.parse_error(
-                            ParserError::NoncharacterCharacterReference,
-                            self.get_location(),
-                        );
+                        self.parse_error(ParserError::NoncharacterCharacterReference, self.get_location());
                         // char_ref_code = CHAR_REPLACEMENT as u32;
                     }
                     if self.is_control_char(char_ref_code) || char_ref_code == 0x0D {
-                        self.parse_error(
-                            ParserError::ControlCharacterReference,
-                            self.get_location(),
-                        );
+                        self.parse_error(ParserError::ControlCharacterReference, self.get_location());
 
                         if TOKEN_REPLACEMENTS.contains_key(&char_ref_code) {
                             char_ref_code = *TOKEN_REPLACEMENTS.get(&char_ref_code).unwrap() as u32;
@@ -360,10 +309,10 @@ impl Tokenizer<'_> {
     pub(crate) fn is_noncharacter(&self, num: u32) -> bool {
         (0xFDD0..=0xFDEF).contains(&num)
             || [
-                0xFFFE, 0xFFFF, 0x1FFFE, 0x1FFFF, 0x2FFFE, 0x2FFFF, 0x3FFFE, 0x3FFFF, 0x4FFFE,
-                0x4FFFF, 0x5FFFE, 0x5FFFF, 0x6FFFE, 0x6FFFF, 0x7FFFE, 0x7FFFF, 0x8FFFE, 0x8FFFF,
-                0x9FFFE, 0x9FFFF, 0xAFFFE, 0xAFFFF, 0xBFFFE, 0xBFFFF, 0xCFFFE, 0xCFFFF, 0xDFFFE,
-                0xDFFFF, 0xEFFFE, 0xEFFFF, 0xFFFFE, 0xFFFFF, 0x10FFFE, 0x10FFFF,
+                0xFFFE, 0xFFFF, 0x1FFFE, 0x1FFFF, 0x2FFFE, 0x2FFFF, 0x3FFFE, 0x3FFFF, 0x4FFFE, 0x4FFFF, 0x5FFFE,
+                0x5FFFF, 0x6FFFE, 0x6FFFF, 0x7FFFE, 0x7FFFF, 0x8FFFE, 0x8FFFF, 0x9FFFE, 0x9FFFF, 0xAFFFE, 0xAFFFF,
+                0xBFFFE, 0xBFFFF, 0xCFFFE, 0xCFFFF, 0xDFFFE, 0xDFFFF, 0xEFFFE, 0xEFFFF, 0xFFFFE, 0xFFFFF, 0x10FFFE,
+                0x10FFFF,
             ]
             .contains(&num)
     }
@@ -404,7 +353,7 @@ lazy_static! {
 
 #[cfg(test)]
 mod tests {
-    use crate::error_logger::ErrorLogger;
+    use crate::tokenizer::ErrorLogger;
     use crate::tokenizer::{ParserData, Tokenizer};
     use gosub_shared::byte_stream::{ByteStream, Encoding, Location};
     use std::cell::RefCell;
diff --git a/crates/gosub_html5/src/tokenizer/replacement_tables.rs b/crates/gosub_html5/src/tokenizer/replacement_tables.rs
index 825ad2e82..04f3c543c 100644
--- a/crates/gosub_html5/src/tokenizer/replacement_tables.rs
+++ b/crates/gosub_html5/src/tokenizer/replacement_tables.rs
@@ -3,7 +3,7 @@ use phf::phf_map;
 /// These are token replacements as defined by
 /// https://dev.w3.org/html5/spec-LC/tokenization.html#consume-a-character-reference
 /// If a character (#0x80; for instance) is found, it must be replaced by the given character
-pub static TOKEN_REPLACEMENTS: phf::Map<u32, char> = phf::phf_map! {
+pub static TOKEN_REPLACEMENTS: phf::Map<u32, char> = phf_map! {
     // REPLACEMENT CHARACTER
     0x00_u32 => '\u{FFFD}',
     // CARRIAGE RETURN (CR)
diff --git a/crates/gosub_html5/src/tokenizer/test_cases.rs b/crates/gosub_html5/src/tokenizer/test_cases.rs
index ec4916c32..a0aff123a 100644
--- a/crates/gosub_html5/src/tokenizer/test_cases.rs
+++ b/crates/gosub_html5/src/tokenizer/test_cases.rs
@@ -29,10 +29,7 @@ const DISABLED_CASES: &[&str] = &[
 ];
 
 lazy_static! {
-    static ref DISABLED: HashSet<String> = DISABLED_CASES
-        .iter()
-        .map(|s| s.to_string())
-        .collect::<HashSet<_>>();
+    static ref DISABLED: HashSet<String> = DISABLED_CASES.iter().map(|s| s.to_string()).collect::<HashSet<_>>();
 }
 
 #[test_case("contentModelFlags.test")]
diff --git a/crates/gosub_html5/src/tokenizer/token.rs b/crates/gosub_html5/src/tokenizer/token.rs
index 977ef91e6..ef960b118 100644
--- a/crates/gosub_html5/src/tokenizer/token.rs
+++ b/crates/gosub_html5/src/tokenizer/token.rs
@@ -55,10 +55,7 @@ impl Token {
             if value.chars().any(|ch| ch == '\0') {
                 found += 1;
             }
-            if value
-                .chars()
-                .any(|ch| !ch.is_ascii_whitespace() && ch != '\0')
-            {
+            if value.chars().any(|ch| !ch.is_ascii_whitespace() && ch != '\0') {
                 found += 1;
             }
             found > 1
@@ -79,12 +76,12 @@ impl Token {
 
     pub fn get_location(&self) -> Location {
         match self {
-            Token::DocType { location, .. } => location.clone(),
-            Token::StartTag { location, .. } => location.clone(),
-            Token::EndTag { location, .. } => location.clone(),
-            Token::Comment { location, .. } => location.clone(),
-            Token::Text { location, .. } => location.clone(),
-            Token::Eof { location, .. } => location.clone(),
+            Token::DocType { location, .. } => *location,
+            Token::StartTag { location, .. } => *location,
+            Token::EndTag { location, .. } => *location,
+            Token::Comment { location, .. } => *location,
+            Token::Text { location, .. } => *location,
+            Token::Eof { location, .. } => *location,
         }
     }
 
@@ -182,9 +179,7 @@ impl std::fmt::Display for Token {
                 write!(f, "{result}")
             }
             Token::EndTag {
-                name,
-                is_self_closing,
-                ..
+                name, is_self_closing, ..
             } => write!(f, "</{}{}>", name, if *is_self_closing { "/" } else { "" }),
             Token::Eof { .. } => write!(f, "EOF"),
         }
@@ -239,10 +234,7 @@ mod tests {
             sys_identifier: Some("bar".to_string()),
             location: Location::default(),
         };
-        assert_eq!(
-            format!("{token}"),
-            r#"<!DOCTYPE html PUBLIC "foo" SYSTEM "bar" />"#
-        );
+        assert_eq!(format!("{token}"), r#"<!DOCTYPE html PUBLIC "foo" SYSTEM "bar" />"#);
     }
 
     #[test]
diff --git a/crates/gosub_html5/src/util.rs b/crates/gosub_html5/src/util.rs
deleted file mode 100644
index 1780b8395..000000000
--- a/crates/gosub_html5/src/util.rs
+++ /dev/null
@@ -1,5 +0,0 @@
-/// according to HTML spec:
-/// https://html.spec.whatwg.org/#global-attributes
-pub(crate) fn is_valid_id_attribute_value(value: &str) -> bool {
-    !(value.is_empty() || value.contains(|ref c| char::is_ascii_whitespace(c)))
-}
diff --git a/crates/gosub_html5/src/visit.rs b/crates/gosub_html5/src/visit.rs
deleted file mode 100644
index b7b1d6019..000000000
--- a/crates/gosub_html5/src/visit.rs
+++ /dev/null
@@ -1,22 +0,0 @@
-use crate::node::data::comment::CommentData;
-use crate::node::data::doctype::DocTypeData;
-use crate::node::data::document::DocumentData;
-use crate::node::data::element::ElementData;
-use crate::node::data::text::TextData;
-
-pub trait Visitor<Node> {
-    fn document_enter(&mut self, node: &Node, data: &DocumentData);
-    fn document_leave(&mut self, node: &Node, data: &DocumentData);
-
-    fn doctype_enter(&mut self, node: &Node, data: &DocTypeData);
-    fn doctype_leave(&mut self, node: &Node, data: &DocTypeData);
-
-    fn text_enter(&mut self, node: &Node, data: &TextData);
-    fn text_leave(&mut self, node: &Node, data: &TextData);
-
-    fn comment_enter(&mut self, node: &Node, data: &CommentData);
-    fn comment_leave(&mut self, node: &Node, data: &CommentData);
-
-    fn element_enter(&mut self, node: &Node, data: &ElementData);
-    fn element_leave(&mut self, node: &Node, data: &ElementData);
-}
diff --git a/crates/gosub_html5/src/writer.rs b/crates/gosub_html5/src/writer.rs
index 8cfe2219c..c308fd1d3 100644
--- a/crates/gosub_html5/src/writer.rs
+++ b/crates/gosub_html5/src/writer.rs
@@ -1,136 +1,128 @@
-use crate::{
-    node::{Node, NodeData, NodeId},
-    parser::document::Document,
-    visit::Visitor,
-};
-
-impl Document {
-    pub fn write_document(&self) -> String {
-        Writer::write_from_node(NodeId::root(), self)
-    }
-
-    pub fn write_from_node(&self, node: NodeId) -> String {
-        Writer::write_from_node(node, self)
-    }
-}
-
-struct Writer {
+use crate::node::visitor::Visitor;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::node::ElementDataType;
+use gosub_shared::traits::node::{CommentDataType, DocTypeDataType, Node, NodeType, TextDataType};
+
+// Writer to convert a document to a string
+pub struct DocumentWriter {
+    /// The buffer to write to
     buffer: String,
+    /// Whether to include comments in the output
     comments: bool,
 }
 
-impl Writer {
-    pub fn write_from_node(node: NodeId, doc: &Document) -> String {
+impl DocumentWriter {
+    pub fn write_from_node<D: Document<C>, C: CssSystem>(node: NodeId, handle: DocumentHandle<D, C>) -> String {
         let mut w = Self {
             comments: false,
             buffer: String::new(),
         };
 
-        w.visit_node(node, doc);
-
+        w.visit_node(node, handle);
         w.buffer
     }
 
-    pub fn visit_node(&mut self, id: NodeId, doc: &Document) {
-        let Some(node) = doc.get_node_by_id(id) else {
-            return;
+    pub fn visit_node<D: Document<C>, C: CssSystem>(&mut self, id: NodeId, handle: DocumentHandle<D, C>) {
+        let binding = handle.get();
+        let node = match binding.node_by_id(id) {
+            Some(node) => node,
+            None => return,
         };
 
-        match node.data {
-            NodeData::Document(ref data) => {
-                self.document_enter(node, data);
-
-                self.visit_children(&node.children, doc);
-
-                self.document_leave(node, data);
+        match node.type_of() {
+            NodeType::DocumentNode => {
+                self.document_enter(node);
+                self.visit_children(node.children(), handle.clone());
+                self.document_leave(node);
             }
-
-            NodeData::DocType(ref data) => {
-                self.doctype_enter(node, data);
-
-                self.visit_children(&node.children, doc);
-
-                self.doctype_leave(node, data);
+            NodeType::DocTypeNode => {
+                self.doctype_enter(node);
+                self.visit_children(node.children(), handle.clone());
+                self.doctype_leave(node);
             }
-
-            NodeData::Text(ref data) => {
-                self.text_enter(node, data);
-
-                self.visit_children(&node.children, doc);
-
-                self.text_leave(node, data);
+            NodeType::TextNode => {
+                self.text_enter(node);
+                self.visit_children(node.children(), handle.clone());
+                self.text_leave(node);
             }
-            NodeData::Comment(ref data) => {
-                self.comment_enter(node, data);
-
-                self.visit_children(&node.children, doc);
-
-                self.comment_leave(node, data);
+            NodeType::CommentNode => {
+                self.comment_enter(node);
+                self.visit_children(node.children(), handle.clone());
+                self.comment_leave(node);
             }
-
-            NodeData::Element(ref data) => {
-                self.element_enter(node, data);
-
-                self.visit_children(&node.children, doc);
-
-                self.element_leave(node, data);
+            NodeType::ElementNode => {
+                self.element_enter(node);
+                self.visit_children(node.children(), handle.clone());
+                self.element_leave(node);
             }
         }
     }
 
-    pub fn visit_children(&mut self, children: &Vec<NodeId>, doc: &Document) {
+    pub fn visit_children<D: Document<C>, C: CssSystem>(&mut self, children: &[NodeId], handle: DocumentHandle<D, C>) {
         for child in children {
-            self.visit_node(*child, doc);
+            self.visit_node(*child, handle.clone());
         }
     }
 }
 
-impl Visitor<Node> for Writer {
-    fn text_enter(&mut self, _node: &Node, data: &crate::node::data::text::TextData) {
-        self.buffer.push_str(&data.value);
+impl<N: Node<C>, C: CssSystem> Visitor<N, C> for DocumentWriter {
+    fn document_enter(&mut self, _node: &N) {}
+
+    fn document_leave(&mut self, _node: &N) {}
+
+    fn doctype_enter(&mut self, node: &N) {
+        if let Some(data) = node.get_doctype_data() {
+            self.buffer.push_str("<!DOCTYPE ");
+            self.buffer.push_str(data.name());
+            self.buffer.push('>');
+        }
     }
 
-    fn text_leave(&mut self, _node: &Node, _data: &crate::node::data::text::TextData) {}
+    fn doctype_leave(&mut self, _node: &N) {}
 
-    fn doctype_enter(&mut self, _node: &Node, data: &crate::node::data::doctype::DocTypeData) {
-        self.buffer.push_str("<!DOCTYPE ");
-        self.buffer.push_str(&data.name);
-        self.buffer.push('>');
+    fn text_enter(&mut self, node: &N) {
+        if let Some(data) = node.get_text_data() {
+            self.buffer.push_str(data.value());
+        }
     }
 
-    fn doctype_leave(&mut self, _node: &Node, _data: &crate::node::data::doctype::DocTypeData) {}
+    fn text_leave(&mut self, _node: &N) {}
 
-    fn comment_enter(&mut self, _node: &Node, data: &crate::node::data::comment::CommentData) {
-        if self.comments {
+    fn comment_enter(&mut self, node: &N) {
+        if let Some(data) = node.get_comment_data() {
             self.buffer.push_str("<!--");
-            self.buffer.push_str(&data.value);
+            self.buffer.push_str(data.value());
             self.buffer.push_str("-->");
         }
     }
 
-    fn comment_leave(&mut self, _node: &Node, _data: &crate::node::data::comment::CommentData) {}
-
-    fn element_enter(&mut self, _node: &Node, data: &crate::node::data::element::ElementData) {
-        self.buffer.push('<');
-        self.buffer.push_str(&data.name);
-        for (name, value) in &data.attributes {
-            self.buffer.push(' ');
-            self.buffer.push_str(name);
-            self.buffer.push_str("=\"");
-            self.buffer.push_str(value);
-            self.buffer.push('"');
-        }
+    fn comment_leave(&mut self, _node: &N) {}
 
-        self.buffer.push('>');
-    }
+    fn element_enter(&mut self, node: &N) {
+        if let Some(data) = node.get_element_data() {
+            self.buffer.push('<');
+            self.buffer.push_str(data.name());
 
-    fn element_leave(&mut self, _node: &Node, data: &crate::node::data::element::ElementData) {
-        self.buffer.push_str("</");
-        self.buffer.push_str(&data.name);
-        self.buffer.push('>');
-    }
+            for (name, value) in data.attributes() {
+                self.buffer.push(' ');
+                self.buffer.push_str(name);
+                self.buffer.push_str("=\"");
+                self.buffer.push_str(value);
+                self.buffer.push('"');
+            }
 
-    fn document_enter(&mut self, _node: &Node, _data: &crate::node::data::document::DocumentData) {}
+            self.buffer.push('>');
+        }
+    }
 
-    fn document_leave(&mut self, _node: &Node, _data: &crate::node::data::document::DocumentData) {}
+    fn element_leave(&mut self, node: &N) {
+        if let Some(data) = node.get_element_data() {
+            self.buffer.push_str("</");
+            self.buffer.push_str(data.name().to_string().as_str());
+            self.buffer.push('>');
+        }
+    }
 }
diff --git a/crates/gosub_html5/tests/data/html5lib-tests/tree-construction/tests19.dat b/crates/gosub_html5/tests/data/html5lib-tests/tree-construction/tests19.dat
index 20cdeabcc..c42a6b5b2 100644
--- a/crates/gosub_html5/tests/data/html5lib-tests/tree-construction/tests19.dat
+++ b/crates/gosub_html5/tests/data/html5lib-tests/tree-construction/tests19.dat
@@ -1,1129 +1,3 @@
-#data
-<!doctype html><math><mn DefinitionUrl="foo">
-#errors
-(1,45): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <math math>
-|       <math mn>
-|         definitionURL="foo"
-
-#data
-<!doctype html><html></p><!--foo-->
-#errors
-(1,25): end-tag-after-implied-root
-#document
-| <!DOCTYPE html>
-| <html>
-|   <!-- foo -->
-|   <head>
-|   <body>
-
-#data
-<!doctype html><head></head></p><!--foo-->
-#errors
-(1,32): unexpected-end-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <!-- foo -->
-|   <body>
-
-#data
-<!doctype html><body><p><pre>
-#errors
-(1,29): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|     <pre>
-
-#data
-<!doctype html><body><p><listing>
-#errors
-(1,33): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|     <listing>
-
-#data
-<!doctype html><p><plaintext>
-#errors
-(1,29): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|     <plaintext>
-
-#data
-<!doctype html><p><h1>
-#errors
-(1,22): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|     <h1>
-
-#data
-<!doctype html><isindex type="hidden">
-#errors
-(1,38): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <isindex>
-|       type="hidden"
-
-#data
-<!doctype html><ruby><p><rp>
-#errors
-(1,28): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       <p>
-|       <rp>
-
-#data
-<!doctype html><ruby><div><span><rp>
-#errors
-(1,36): XXX-undefined-error
-(1,36): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       <div>
-|         <span>
-|           <rp>
-
-#data
-<!doctype html><ruby><div><p><rp>
-#errors
-(1,33): XXX-undefined-error
-(1,33): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       <div>
-|         <p>
-|         <rp>
-
-#data
-<!doctype html><ruby><p><rt>
-#errors
-(1,28): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       <p>
-|       <rt>
-
-#data
-<!doctype html><ruby><div><span><rt>
-#errors
-(1,36): XXX-undefined-error
-(1,36): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       <div>
-|         <span>
-|           <rt>
-
-#data
-<!doctype html><ruby><div><p><rt>
-#errors
-(1,33): XXX-undefined-error
-(1,33): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       <div>
-|         <p>
-|         <rt>
-
-#data
-<html><ruby>a<rb>b<rt></ruby></html>
-#errors
-(1,6): expected-doctype-but-got-start-tag
-#document
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       "a"
-|       <rb>
-|         "b"
-|       <rt>
-
-#data
-<html><ruby>a<rp>b<rt></ruby></html>
-#errors
-(1,6): expected-doctype-but-got-start-tag
-#document
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       "a"
-|       <rp>
-|         "b"
-|       <rt>
-
-#data
-<html><ruby>a<rt>b<rt></ruby></html>
-#errors
-(1,6): expected-doctype-but-got-start-tag
-#document
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       "a"
-|       <rt>
-|         "b"
-|       <rt>
-
-#data
-<html><ruby>a<rtc>b<rt>c<rb>d</ruby></html>
-#errors
-(1,6): expected-doctype-but-got-start-tag
-#document
-| <html>
-|   <head>
-|   <body>
-|     <ruby>
-|       "a"
-|       <rtc>
-|         "b"
-|         <rt>
-|           "c"
-|       <rb>
-|         "d"
-
-#data
-<!doctype html><math/><foo>
-#errors
-(1,27): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <math math>
-|     <foo>
-
-#data
-<!doctype html><svg/><foo>
-#errors
-(1,26): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <svg svg>
-|     <foo>
-
-#data
-<!doctype html><div></body><!--foo-->
-#errors
-(1,27): expected-one-end-tag-but-got-another
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <div>
-|   <!-- foo -->
-
-#data
-<!doctype html><h1><div><h3><span></h1>foo
-#errors
-(1,39): end-tag-too-early
-(1,42): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <h1>
-|       <div>
-|         <h3>
-|           <span>
-|         "foo"
-
-#data
-<!doctype html><p></h3>foo
-#errors
-(1,23): end-tag-too-early
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       "foo"
-
-#data
-<!doctype html><h3><li>abc</h2>foo
-#errors
-(1,31): end-tag-too-early
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <h3>
-|       <li>
-|         "abc"
-|     "foo"
-
-#data
-<!doctype html><table>abc<!--foo-->
-#errors
-(1,23): foster-parenting-character
-(1,24): foster-parenting-character
-(1,25): foster-parenting-character
-(1,35): eof-in-table
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     "abc"
-|     <table>
-|       <!-- foo -->
-
-#data
-<!doctype html><table>  <!--foo-->
-#errors
-(1,34): eof-in-table
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <table>
-|       "  "
-|       <!-- foo -->
-
-#data
-<!doctype html><table> b <!--foo-->
-#errors
-(1,23): foster-parenting-character
-(1,24): foster-parenting-character
-(1,25): foster-parenting-character
-(1,35): eof-in-table
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     " b "
-|     <table>
-|       <!-- foo -->
-
-#data
-<!doctype html><select><option><option>
-#errors
-(1,39): eof-in-select
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <select>
-|       <option>
-|       <option>
-
-#data
-<!doctype html><select><option></optgroup>
-#errors
-(1,42): unexpected-end-tag-in-select
-(1,42): eof-in-select
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <select>
-|       <option>
-
-#data
-<!doctype html><dd><optgroup><dd>
-#errors
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <dd>
-|       <optgroup>
-|     <dd>
-
-#data
-<!doctype html><p><math><mi><p><h1>
-#errors
-(1,35): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       <math math>
-|         <math mi>
-|           <p>
-|           <h1>
-
-#data
-<!doctype html><p><math><mo><p><h1>
-#errors
-(1,35): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       <math math>
-|         <math mo>
-|           <p>
-|           <h1>
-
-#data
-<!doctype html><p><math><mn><p><h1>
-#errors
-(1,35): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       <math math>
-|         <math mn>
-|           <p>
-|           <h1>
-
-#data
-<!doctype html><p><math><ms><p><h1>
-#errors
-(1,35): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       <math math>
-|         <math ms>
-|           <p>
-|           <h1>
-
-#data
-<!doctype html><p><math><mtext><p><h1>
-#errors
-(1,38): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       <math math>
-|         <math mtext>
-|           <p>
-|           <h1>
-
-#data
-<!doctype html><frameset></noframes>
-#errors
-(1,36): unexpected-end-tag-in-frameset
-(1,36): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-
-#data
-<!doctype html><html c=d><body></html><html a=b>
-#errors
-(1,48): non-html-root
-#document
-| <!DOCTYPE html>
-| <html>
-|   a="b"
-|   c="d"
-|   <head>
-|   <body>
-
-#data
-<!doctype html><html c=d><frameset></frameset></html><html a=b>
-#errors
-(1,63): non-html-root
-#document
-| <!DOCTYPE html>
-| <html>
-|   a="b"
-|   c="d"
-|   <head>
-|   <frameset>
-
-#data
-<!doctype html><html><frameset></frameset></html><!--foo-->
-#errors
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-| <!-- foo -->
-
-#data
-<!doctype html><html><frameset></frameset></html>  
-#errors
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-|   "  "
-
-#data
-<!doctype html><html><frameset></frameset></html>abc
-#errors
-(1,50): expected-eof-but-got-char
-(1,51): expected-eof-but-got-char
-(1,52): expected-eof-but-got-char
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-
-#data
-<!doctype html><html><frameset></frameset></html><p>
-#errors
-(1,52): expected-eof-but-got-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-
-#data
-<!doctype html><html><frameset></frameset></html></p>
-#errors
-(1,53): expected-eof-but-got-end-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-
-#data
-<html><frameset></frameset></html><!doctype html>
-#errors
-(1,6): expected-doctype-but-got-start-tag
-(1,49): unexpected-doctype
-#document
-| <html>
-|   <head>
-|   <frameset>
-
-#data
-<!doctype html><body><frameset>
-#errors
-(1,31): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-
-#data
-<!doctype html><p><frameset><frame>
-#errors
-(1,28): unexpected-start-tag
-(1,35): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-|     <frame>
-
-#data
-<!doctype html><p>a<frameset>
-#errors
-(1,29): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       "a"
-
-#data
-<!doctype html><p> <frameset><frame>
-#errors
-(1,29): unexpected-start-tag
-(1,36): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-|     <frame>
-
-#data
-<!doctype html><pre><frameset>
-#errors
-(1,30): unexpected-start-tag
-(1,30): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <pre>
-
-#data
-<!doctype html><listing><frameset>
-#errors
-(1,34): unexpected-start-tag
-(1,34): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <listing>
-
-#data
-<!doctype html><li><frameset>
-#errors
-(1,29): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <li>
-
-#data
-<!doctype html><dd><frameset>
-#errors
-(1,29): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <dd>
-
-#data
-<!doctype html><dt><frameset>
-#errors
-(1,29): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <dt>
-
-#data
-<!doctype html><button><frameset>
-#errors
-(1,33): unexpected-start-tag
-(1,33): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <button>
-
-#data
-<!doctype html><applet><frameset>
-#errors
-(1,33): unexpected-start-tag
-(1,33): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <applet>
-
-#data
-<!doctype html><marquee><frameset>
-#errors
-(1,34): unexpected-start-tag
-(1,34): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <marquee>
-
-#data
-<!doctype html><object><frameset>
-#errors
-(1,33): unexpected-start-tag
-(1,33): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <object>
-
-#data
-<!doctype html><table><frameset>
-#errors
-(1,32): unexpected-start-tag-implies-table-voodoo
-(1,32): unexpected-start-tag
-(1,32): eof-in-table
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <table>
-
-#data
-<!doctype html><area><frameset>
-#errors
-(1,31): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <area>
-
-#data
-<!doctype html><basefont><frameset>
-#errors
-(1,35): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|     <basefont>
-|   <frameset>
-
-#data
-<!doctype html><bgsound><frameset>
-#errors
-(1,34): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|     <bgsound>
-|   <frameset>
-
-#data
-<!doctype html><br><frameset>
-#errors
-(1,29): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <br>
-
-#data
-<!doctype html><embed><frameset>
-#errors
-(1,32): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <embed>
-
-#data
-<!doctype html><img><frameset>
-#errors
-(1,30): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <img>
-
-#data
-<!doctype html><input><frameset>
-#errors
-(1,32): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <input>
-
-#data
-<!doctype html><keygen><frameset>
-#errors
-(1,33): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <keygen>
-
-#data
-<!doctype html><wbr><frameset>
-#errors
-(1,30): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <wbr>
-
-#data
-<!doctype html><hr><frameset>
-#errors
-(1,29): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <hr>
-
-#data
-<!doctype html><textarea></textarea><frameset>
-#errors
-(1,46): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <textarea>
-
-#data
-<!doctype html><xmp></xmp><frameset>
-#errors
-(1,36): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <xmp>
-
-#data
-<!doctype html><iframe></iframe><frameset>
-#errors
-(1,42): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <iframe>
-
-#data
-<!doctype html><select></select><frameset>
-#errors
-(1,42): unexpected-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <select>
-
-#data
-<!doctype html><svg></svg><frameset><frame>
-#errors
-(1,36): unexpected-start-tag
-(1,43): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-|     <frame>
-
-#data
-<!doctype html><math></math><frameset><frame>
-#errors
-(1,38): unexpected-start-tag
-(1,45): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-|     <frame>
-
-#data
-<!doctype html><svg><foreignObject><div> <frameset><frame>
-#errors
-(1,51): unexpected-start-tag
-(1,58): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-|     <frame>
-
-#data
-<!doctype html><svg>a</svg><frameset><frame>
-#errors
-(1,37): unexpected-start-tag
-(1,44): unexpected-start-tag-ignored
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <svg svg>
-|       "a"
-
-#data
-<!doctype html><svg> </svg><frameset><frame>
-#errors
-(1,37): unexpected-start-tag
-(1,44): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-|     <frame>
-
-#data
-<html>aaa<frameset></frameset>
-#errors
-(1,6): expected-doctype-but-got-start-tag
-(1,19): unexpected-start-tag
-(1,30): unexpected-end-tag
-#document
-| <html>
-|   <head>
-|   <body>
-|     "aaa"
-
-#data
-<html> a <frameset></frameset>
-#errors
-(1,6): expected-doctype-but-got-start-tag
-(1,19): unexpected-start-tag
-(1,30): unexpected-end-tag
-#document
-| <html>
-|   <head>
-|   <body>
-|     "a "
-
-#data
-<!doctype html><div><frameset>
-#errors
-(1,30): unexpected-start-tag
-(1,30): eof-in-frameset
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <frameset>
-
-#data
-<!doctype html><div><body><frameset>
-#errors
-(1,26): unexpected-start-tag
-(1,36): unexpected-start-tag
-(1,36): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <div>
-
-#data
-<!doctype html><p><math></p>a
-#errors
-(1,28): unexpected-end-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       <math math>
-|     "a"
-
-#data
-<!doctype html><p><math><mn><span></p>a
-#errors
-(1,38): unexpected-end-tag
-(1,39): expected-closing-tag-but-got-eof
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <p>
-|       <math math>
-|         <math mn>
-|           <span>
-|             <p>
-|             "a"
-
-#data
-<!doctype html><math></html>
-#errors
-(1,28): unexpected-end-tag
-(1,28): expected-one-end-tag-but-got-another
-(1,28): unexpected-end-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <math math>
-
-#data
-<!doctype html><meta charset="ascii">
-#errors
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|     <meta>
-|       charset="ascii"
-|   <body>
-
-#data
-<!doctype html><meta http-equiv="content-type" content="text/html;charset=ascii">
-#errors
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|     <meta>
-|       content="text/html;charset=ascii"
-|       http-equiv="content-type"
-|   <body>
-
-#data
-<!doctype html><head><!--aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa--><meta charset="utf8">
-#errors
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|     <!-- aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa -->
-|     <meta>
-|       charset="utf8"
-|   <body>
-
-#data
-<!doctype html><html a=b><head></head><html c=d>
-#errors
-(1,48): non-html-root
-#document
-| <!DOCTYPE html>
-| <html>
-|   a="b"
-|   c="d"
-|   <head>
-|   <body>
-
-#data
-<!doctype html><image/>
-#errors
-(1,23): image-start-tag
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     <img>
-
-#data
-<!doctype html>a<i>b<table>c<b>d</i>e</b>f
-#errors
-(1,28): foster-parenting-character
-(1,31): foster-parenting-start-tag
-(1,32): foster-parenting-character
-(1,36): foster-parenting-end-tag
-(1,36): adoption-agency-1.3
-(1,37): foster-parenting-character
-(1,41): foster-parenting-end-tag
-(1,42): foster-parenting-character
-(1,42): eof-in-table
-#document
-| <!DOCTYPE html>
-| <html>
-|   <head>
-|   <body>
-|     "a"
-|     <i>
-|       "bc"
-|       <b>
-|         "de"
-|       "f"
-|       <table>
-
 #data
 <!doctype html><table><i>a<b>b<div>c<a>d</i>e</b>f
 #errors
diff --git a/crates/gosub_jsapi/src/console.rs b/crates/gosub_jsapi/src/console.rs
index 7fa8c9a8a..834c70143 100755
--- a/crates/gosub_jsapi/src/console.rs
+++ b/crates/gosub_jsapi/src/console.rs
@@ -211,8 +211,7 @@ impl Console {
             label: group_label.clone(),
         };
 
-        self.printer
-            .print(LogLevel::GroupCollapsed, &[&group.label], &[]);
+        self.printer.print(LogLevel::GroupCollapsed, &[&group.label], &[]);
 
         self.group_stacks.push(group);
     }
@@ -295,8 +294,7 @@ impl Console {
             return;
         }
 
-        self.printer
-            .print(log_level, &[&self.formatter.format(args)], &[]);
+        self.printer.print(log_level, &[&self.formatter.format(args)], &[]);
     }
 }
 
diff --git a/crates/gosub_jsapi/src/console/writable_printer.rs b/crates/gosub_jsapi/src/console/writable_printer.rs
index 2fd30aa70..5f3c85bd1 100755
--- a/crates/gosub_jsapi/src/console/writable_printer.rs
+++ b/crates/gosub_jsapi/src/console/writable_printer.rs
@@ -21,10 +21,7 @@ impl<W: Write> WritablePrinter<W> {
     /// Creates a new writable printer
     #[allow(dead_code)]
     pub fn new(writer: Rc<RefCell<W>>) -> Self {
-        Self {
-            writer,
-            groups: vec![],
-        }
+        Self { writer, groups: vec![] }
     }
 
     /// Returns a reference to the writer
@@ -70,11 +67,7 @@ impl<W: Write> Printer for WritablePrinter<W> {
         let mut writer = self.writer.borrow_mut();
 
         let _ = match log_level {
-            LogLevel::Info
-            | LogLevel::Warn
-            | LogLevel::Error
-            | LogLevel::Log
-            | LogLevel::Assert => {
+            LogLevel::Info | LogLevel::Warn | LogLevel::Error | LogLevel::Log | LogLevel::Assert => {
                 writeln!(writer, "{group_prefix}[{log_level}] {data}")
             }
             LogLevel::Group => writeln!(writer, "{group_prefix}Expanded group: {data}"),
@@ -110,10 +103,7 @@ mod tests {
 
         printer.print(LogLevel::Log, &[&"Hello", &"World"], &[]);
         assert_eq!(
-            buffer
-                .borrow_mut()
-                .try_to_string()
-                .expect("failed to convert"),
+            buffer.borrow_mut().try_to_string().expect("failed to convert"),
             "[log] Hello World\n"
         );
 
@@ -123,10 +113,7 @@ mod tests {
         printer.print(LogLevel::Warn, &[&"a", &"b"], &[]);
         printer.print(LogLevel::Error, &[], &[]);
         assert_eq!(
-            buffer
-                .borrow_mut()
-                .try_to_string()
-                .expect("failed to convert"),
+            buffer.borrow_mut().try_to_string().expect("failed to convert"),
             "[info] Foo 2 false\n[warn] a b\n"
         );
     }
diff --git a/crates/gosub_net/Cargo.toml b/crates/gosub_net/Cargo.toml
index 672e63521..ae511b626 100644
--- a/crates/gosub_net/Cargo.toml
+++ b/crates/gosub_net/Cargo.toml
@@ -8,7 +8,7 @@ license = "MIT"
 [dependencies]
 gosub_shared = { path = "../gosub_shared", features = [] }
 gosub_config = { path = "../gosub_config", features = [] }
-derive_more = { version = "1", features = ["from"] }
+derive_more = { version = "1", features = ["from", "display"] }
 thiserror = "1.0.64"
 ureq = "2.10.1"
 anyhow = "1.0.89"
diff --git a/crates/gosub_net/src/dns.rs b/crates/gosub_net/src/dns.rs
index 0eb1f837a..1eede8f8d 100644
--- a/crates/gosub_net/src/dns.rs
+++ b/crates/gosub_net/src/dns.rs
@@ -58,11 +58,7 @@ impl DnsEntry {
 
     /// Returns true if the dns entry has expired
     pub fn expired(&self) -> bool {
-        self.expires
-            < SystemTime::now()
-                .duration_since(UNIX_EPOCH)
-                .unwrap()
-                .as_secs()
+        self.expires < SystemTime::now().duration_since(UNIX_EPOCH).unwrap().as_secs()
     }
 
     #[allow(dead_code)]
diff --git a/crates/gosub_net/src/dns/cache.rs b/crates/gosub_net/src/dns/cache.rs
index 050cab856..539efb1a2 100644
--- a/crates/gosub_net/src/dns/cache.rs
+++ b/crates/gosub_net/src/dns/cache.rs
@@ -109,14 +109,8 @@ mod test {
     fn test_cache() {
         let mut cache = CacheResolver::new(3);
 
-        cache.announce(
-            "example.com",
-            &DnsEntry::new("example.com", vec!["127.0.0.1"]),
-        );
-        cache.announce(
-            "example.org",
-            &DnsEntry::new("example.org", vec!["127.0.0.1"]),
-        );
+        cache.announce("example.com", &DnsEntry::new("example.com", vec!["127.0.0.1"]));
+        cache.announce("example.org", &DnsEntry::new("example.org", vec!["127.0.0.1"]));
 
         assert_eq!(cache.values.len(), 2);
         assert_eq!(cache.lru.len(), 2);
@@ -124,10 +118,7 @@ mod test {
         assert_eq!(cache.lru[0], "example.com");
         assert_eq!(cache.lru[1], "example.org");
 
-        cache.announce(
-            "example.net",
-            &DnsEntry::new("example.net", vec!["127.0.0.1"]),
-        );
+        cache.announce("example.net", &DnsEntry::new("example.net", vec!["127.0.0.1"]));
         assert_eq!(cache.values.len(), 3);
         assert_eq!(cache.lru.len(), 3);
         assert_eq!(cache.lru[0], "example.com");
@@ -141,10 +132,7 @@ mod test {
         assert_eq!(cache.lru[1], "example.net");
         assert_eq!(cache.lru[2], "example.org");
 
-        cache.announce(
-            "example.net",
-            &DnsEntry::new("example.net", vec!["127.0.0.1"]),
-        );
+        cache.announce("example.net", &DnsEntry::new("example.net", vec!["127.0.0.1"]));
         assert_eq!(cache.values.len(), 3);
         assert_eq!(cache.lru.len(), 3);
         assert_eq!(cache.lru[0], "example.com");
diff --git a/crates/gosub_net/src/dns/local.rs b/crates/gosub_net/src/dns/local.rs
index 093cc8924..078059474 100644
--- a/crates/gosub_net/src/dns/local.rs
+++ b/crates/gosub_net/src/dns/local.rs
@@ -115,40 +115,20 @@ mod test {
 
         // Simple resolve
         let e = table.resolve("example.com", ResolveType::Ipv4).unwrap();
-        assert_eq!(
-            &IpAddr::from_str("1.2.3.4").unwrap(),
-            e.ips.first().unwrap()
-        );
+        assert_eq!(&IpAddr::from_str("1.2.3.4").unwrap(), e.ips.first().unwrap());
         assert!(table.resolve("xample.com", ResolveType::Ipv4).is_err());
         assert!(table.resolve("com", ResolveType::Ipv4).is_err());
         assert!(table.resolve("example", ResolveType::Ipv4).is_err());
 
         // Wildcard
-        let e = table
-            .resolve("specific.wildcard.com", ResolveType::Ipv4)
-            .unwrap();
-        assert_eq!(
-            &IpAddr::from_str("8.8.8.8").unwrap(),
-            e.ips.first().unwrap()
-        );
-        let e = table
-            .resolve("something.wildcard.com", ResolveType::Ipv4)
-            .unwrap();
-        assert_eq!(
-            &IpAddr::from_str("6.6.6.6").unwrap(),
-            e.ips.first().unwrap()
-        );
-        let e = table
-            .resolve("foobar.wildcard.com", ResolveType::Ipv4)
-            .unwrap();
-        assert_eq!(
-            &IpAddr::from_str("6.6.6.6").unwrap(),
-            e.ips.first().unwrap()
-        );
+        let e = table.resolve("specific.wildcard.com", ResolveType::Ipv4).unwrap();
+        assert_eq!(&IpAddr::from_str("8.8.8.8").unwrap(), e.ips.first().unwrap());
+        let e = table.resolve("something.wildcard.com", ResolveType::Ipv4).unwrap();
+        assert_eq!(&IpAddr::from_str("6.6.6.6").unwrap(), e.ips.first().unwrap());
+        let e = table.resolve("foobar.wildcard.com", ResolveType::Ipv4).unwrap();
+        assert_eq!(&IpAddr::from_str("6.6.6.6").unwrap(), e.ips.first().unwrap());
         assert!(table.resolve("foo.custom.com", ResolveType::Ipv4).is_err());
-        assert!(table
-            .resolve("too.specific.wildcard.com", ResolveType::Ipv4)
-            .is_err());
+        assert!(table.resolve("too.specific.wildcard.com", ResolveType::Ipv4).is_err());
         assert!(table.resolve("custom.com", ResolveType::Ipv4).is_err());
 
         // round robin on both ipv4 and ipv6
diff --git a/crates/gosub_net/src/dns/remote.rs b/crates/gosub_net/src/dns/remote.rs
index 9e07b5540..93bf107e7 100644
--- a/crates/gosub_net/src/dns/remote.rs
+++ b/crates/gosub_net/src/dns/remote.rs
@@ -41,9 +41,7 @@ impl DnsResolver for RemoteResolver {
                     }
                     e.unwrap().iter().for_each(|ip| {
                         trace!("{domain}: found ipv4 address {ip}");
-                        entry
-                            .ips
-                            .push(IpAddr::from_str(ip.to_string().as_str()).unwrap());
+                        entry.ips.push(IpAddr::from_str(ip.to_string().as_str()).unwrap());
                         entry.has_ipv4 = true;
                     });
                 }
@@ -54,9 +52,7 @@ impl DnsResolver for RemoteResolver {
                     }
                     e.unwrap().iter().for_each(|ip| {
                         trace!("{domain}: found ipv6 address {ip}");
-                        entry
-                            .ips
-                            .push(IpAddr::from_str(ip.to_string().as_str()).unwrap());
+                        entry.ips.push(IpAddr::from_str(ip.to_string().as_str()).unwrap());
                         entry.has_ipv6 = true;
                     });
                 }
diff --git a/crates/gosub_net/src/http/response.rs b/crates/gosub_net/src/http/response.rs
index ac30620a7..5b4384db2 100644
--- a/crates/gosub_net/src/http/response.rs
+++ b/crates/gosub_net/src/http/response.rs
@@ -119,9 +119,7 @@ mod tests {
 
         response.status = 200;
         response.headers.set_str("Content-Type", "application/json");
-        response
-            .cookies
-            .insert("session".to_string(), "1234567890".to_string());
+        response.cookies.insert("session".to_string(), "1234567890".to_string());
         response.body = b"Hello, world!".to_vec();
 
         let s = format!("{}", response);
diff --git a/crates/gosub_render_backend/Cargo.toml b/crates/gosub_render_backend/Cargo.toml
index 250722f5e..6dc46d917 100644
--- a/crates/gosub_render_backend/Cargo.toml
+++ b/crates/gosub_render_backend/Cargo.toml
@@ -2,12 +2,17 @@
 name = "gosub_render_backend"
 version = "0.1.0"
 edition = "2021"
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
 
 [dependencies]
-smallvec = "1.13.2"
-image = "0.25.2"
-raw-window-handle = "0.6.2"
 gosub_shared = { path = "../gosub_shared" }
 gosub_html5 = { path = "../gosub_html5" }
+gosub_css3 = { path = "../gosub_css3" }
 gosub_typeface = { path = "../gosub_typeface" }
+smallvec = "1.13.2"
+image = "0.25.2"
+raw-window-handle = "0.6.2"
+log = "0.4.14"
+anyhow = "1.0.89"
 
diff --git a/crates/gosub_render_backend/src/layout.rs b/crates/gosub_render_backend/src/layout.rs
index 974de083f..e787d7bfc 100644
--- a/crates/gosub_render_backend/src/layout.rs
+++ b/crates/gosub_render_backend/src/layout.rs
@@ -1,3 +1,4 @@
+use gosub_shared::traits::css3::CssProperty;
 use std::fmt::Debug;
 
 use gosub_shared::types::Result;
@@ -35,12 +36,7 @@ pub trait Layouter: Sized + Clone {
 
     const COLLAPSE_INLINE: bool;
 
-    fn layout<LT: LayoutTree<Self>>(
-        &self,
-        tree: &mut LT,
-        root: LT::NodeId,
-        space: SizeU32,
-    ) -> Result<()>;
+    fn layout<LT: LayoutTree<Self>>(&self, tree: &mut LT, root: LT::NodeId, space: SizeU32) -> Result<()>;
 }
 
 pub trait Layout: Default {
@@ -78,12 +74,7 @@ pub trait Layout: Default {
         let pos = self.rel_pos();
         let content = self.content();
         let size = self.scrollbar();
-        Rect::new(
-            pos.x,
-            pos.y,
-            content.width + size.width,
-            content.height + size.height,
-        )
+        Rect::new(pos.x, pos.y, content.width + size.width, content.height + size.height)
     }
 
     fn border(&self) -> Rect;
@@ -121,11 +112,10 @@ pub trait Layout: Default {
     }
 }
 
-/// TODO: This struct should be removed and done somehow differently...
 pub trait Node {
     type Property: CssProperty;
 
-    fn get_property(&mut self, name: &str) -> Option<&mut Self::Property>;
+    fn get_property(&self, name: &str) -> Option<&Self::Property>;
     fn text_data(&self) -> Option<&str>;
 
     fn text_size(&self) -> Option<Size>;
@@ -139,39 +129,6 @@ pub trait HasTextLayout<L: Layouter> {
     fn set_text_layout(&mut self, layout: L::TextLayout);
 }
 
-pub trait CssProperty: Debug + Sized {
-    type Value: CssValue;
-
-    fn compute_value(&mut self);
-
-    fn unit_to_px(&self) -> f32;
-
-    fn as_string(&self) -> Option<&str>;
-    fn as_percentage(&self) -> Option<f32>;
-    fn as_unit(&self) -> Option<(f32, &str)>;
-    fn as_color(&self) -> Option<(f32, f32, f32, f32)>;
-
-    fn parse_color(&self) -> Option<(f32, f32, f32, f32)>;
-
-    fn as_number(&self) -> Option<f32>;
-    fn as_list(&self) -> Option<Vec<Self::Value>>;
-
-    fn is_none(&self) -> bool;
-}
-
-pub trait CssValue: Sized {
-    fn unit_to_px(&self) -> f32;
-
-    fn as_string(&self) -> Option<&str>;
-    fn as_percentage(&self) -> Option<f32>;
-    fn as_unit(&self) -> Option<(f32, &str)>;
-    fn as_color(&self) -> Option<(f32, f32, f32, f32)>;
-    fn as_number(&self) -> Option<f32>;
-    fn as_list(&self) -> Option<Vec<Self>>;
-
-    fn is_none(&self) -> bool;
-}
-
 pub trait TextLayout {
     type Font: Font;
     fn dbg_layout(&self) -> String;
diff --git a/crates/gosub_render_backend/src/lib.rs b/crates/gosub_render_backend/src/lib.rs
index caba549db..757d3ed61 100644
--- a/crates/gosub_render_backend/src/lib.rs
+++ b/crates/gosub_render_backend/src/lib.rs
@@ -35,12 +35,7 @@ pub trait RenderBackend: Sized + Debug {
 
     fn draw_rect(&mut self, data: &mut Self::WindowData<'_>, rect: &RenderRect<Self>);
     fn draw_text(&mut self, data: &mut Self::WindowData<'_>, text: &RenderText<Self>);
-    fn apply_scene(
-        &mut self,
-        data: &mut Self::WindowData<'_>,
-        scene: &Self::Scene,
-        transform: Option<Self::Transform>,
-    );
+    fn apply_scene(&mut self, data: &mut Self::WindowData<'_>, scene: &Self::Scene, transform: Option<Self::Transform>);
     fn reset(&mut self, data: &mut Self::WindowData<'_>);
     // fn layer_push(&mut self, data: &mut Self::WindowData<'_>);
     // fn layer_pop(&mut self, data: &mut Self::WindowData<'_>);
@@ -58,8 +53,7 @@ pub trait RenderBackend: Sized + Debug {
         window_data: &mut Self::WindowData<'_>,
     ) -> Result<()>;
 
-    fn create_window_data<'a>(&mut self, handle: impl WindowHandle)
-        -> Result<Self::WindowData<'a>>;
+    fn create_window_data<'a>(&mut self, handle: impl WindowHandle) -> Result<Self::WindowData<'a>>;
 
     fn resize_window(
         &mut self,
@@ -191,12 +185,7 @@ pub trait Border<B: RenderBackend> {
 
     fn empty() -> Self;
 
-    fn all(
-        left: B::BorderSide,
-        right: B::BorderSide,
-        top: B::BorderSide,
-        bottom: B::BorderSide,
-    ) -> Self;
+    fn all(left: B::BorderSide, right: B::BorderSide, top: B::BorderSide, bottom: B::BorderSide) -> Self;
 
     fn left(&mut self, side: B::BorderSide);
 
diff --git a/crates/gosub_render_backend/src/svg.rs b/crates/gosub_render_backend/src/svg.rs
index ccbf1a39c..67f25d682 100644
--- a/crates/gosub_render_backend/src/svg.rs
+++ b/crates/gosub_render_backend/src/svg.rs
@@ -1,5 +1,7 @@
-use gosub_html5::node::NodeId;
-use gosub_html5::parser::document::DocumentHandle;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
 use gosub_shared::types::{Result, Size};
 
 use crate::{ImageBuffer, RenderBackend};
@@ -10,12 +12,11 @@ pub trait SvgRenderer<B: RenderBackend> {
     fn new() -> Self;
 
     fn parse_external(data: String) -> Result<Self::SvgDocument>;
-    fn parse_internal(tree: DocumentHandle, id: NodeId) -> Result<Self::SvgDocument>;
+    fn parse_internal<D: Document<C>, C: CssSystem>(
+        tree: DocumentHandle<D, C>,
+        id: NodeId,
+    ) -> Result<Self::SvgDocument>;
 
     fn render(&mut self, doc: &Self::SvgDocument) -> Result<ImageBuffer<B>>;
-    fn render_with_size(
-        &mut self,
-        doc: &Self::SvgDocument,
-        size: Size<u32>,
-    ) -> Result<ImageBuffer<B>>;
+    fn render_with_size(&mut self, doc: &Self::SvgDocument, size: Size<u32>) -> Result<ImageBuffer<B>>;
 }
diff --git a/crates/gosub_render_utils/Cargo.toml b/crates/gosub_render_utils/Cargo.toml
index 207adbffe..24673e115 100644
--- a/crates/gosub_render_utils/Cargo.toml
+++ b/crates/gosub_render_utils/Cargo.toml
@@ -7,9 +7,10 @@ license = "MIT"
 
 [dependencies]
 gosub_html5 = { path = "../gosub_html5" }
-gosub_styling = { path = "../gosub_styling" }
 gosub_css3 = { path = "../gosub_css3" }
+gosub_shared = { path = "../gosub_shared" }
 gosub_render_backend = { path = "../gosub_render_backend" }
 anyhow = "1.0.89"
 regex = "1.10.6"
 rstar = "0.12.0"
+log = "0.4.14"
diff --git a/crates/gosub_render_utils/src/lib.rs b/crates/gosub_render_utils/src/lib.rs
index c075d3275..949b917a5 100644
--- a/crates/gosub_render_utils/src/lib.rs
+++ b/crates/gosub_render_utils/src/lib.rs
@@ -4,5 +4,6 @@
 //!
 
 pub mod position;
+// pub mod macos_render_tree;
 pub mod render_tree;
 pub mod text;
diff --git a/crates/gosub_render_utils/src/position.rs b/crates/gosub_render_utils/src/position.rs
index acb3d1ac5..eec82d510 100644
--- a/crates/gosub_render_utils/src/position.rs
+++ b/crates/gosub_render_utils/src/position.rs
@@ -2,10 +2,12 @@ use std::cmp::Ordering;
 
 use rstar::{RTree, RTreeObject, AABB};
 
-use gosub_html5::node::NodeId;
+use crate::render_tree::RenderTree;
 use gosub_render_backend::layout::{Layout, LayoutTree, Layouter};
 use gosub_render_backend::RenderBackend;
-use gosub_styling::render_tree::RenderTree;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
 
 #[derive(Debug)]
 pub struct Element {
@@ -33,7 +35,9 @@ pub struct PositionTree {
 }
 
 impl PositionTree {
-    pub fn from_tree<B: RenderBackend, L: Layouter>(from_tree: &RenderTree<L>) -> Self {
+    pub fn from_tree<B: RenderBackend, L: Layouter, D: Document<C>, C: CssSystem>(
+        from_tree: &RenderTree<L, D, C>,
+    ) -> Self {
         let mut tree = RTree::new();
 
         //TODO: we somehow need to get the border radius and a potential stacking context of the element here
@@ -43,8 +47,8 @@ impl PositionTree {
         Self { tree }
     }
 
-    fn add_node_to_tree<L: Layouter>(
-        from_tree: &RenderTree<L>,
+    fn add_node_to_tree<L: Layouter, D: Document<C>, C: CssSystem>(
+        from_tree: &RenderTree<L, D, C>,
         id: NodeId,
         z_index: i32,
         tree: &mut RTree<Element>,
@@ -97,22 +101,14 @@ impl PositionTree {
                             // top left
                             Ordering::Less => {
                                 if (e.x + radi.0) > x && (e.y + radi.0) > y {
-                                    return is_point_in_circle(
-                                        (e.x + radi.0, e.y + radi.0),
-                                        radi.0,
-                                        (x, y),
-                                    );
+                                    return is_point_in_circle((e.x + radi.0, e.y + radi.0), radi.0, (x, y));
                                 }
                                 false
                             }
                             // top right
                             Ordering::Greater => {
                                 if (e.x + e.width - radi.1) < x && (e.y + radi.1) < y {
-                                    return is_point_in_circle(
-                                        (e.x + radi.1, e.y + radi.1),
-                                        radi.1,
-                                        (x, y),
-                                    );
+                                    return is_point_in_circle((e.x + radi.1, e.y + radi.1), radi.1, (x, y));
                                 }
 
                                 false
@@ -125,22 +121,14 @@ impl PositionTree {
                             // bottom left
                             Ordering::Less => {
                                 if (e.x + radi.2) > x && (e.y + e.height - radi.2) < y {
-                                    return is_point_in_circle(
-                                        (e.x + radi.2, e.y + e.height - radi.2),
-                                        radi.2,
-                                        (x, y),
-                                    );
+                                    return is_point_in_circle((e.x + radi.2, e.y + e.height - radi.2), radi.2, (x, y));
                                 }
                                 false
                             }
                             // bottom right
                             Ordering::Greater => {
                                 if (e.x + e.width - radi.3) < x && (e.y + e.height - radi.3) < y {
-                                    return is_point_in_circle(
-                                        (e.x + radi.3, e.y + radi.3),
-                                        radi.3,
-                                        (x, y),
-                                    );
+                                    return is_point_in_circle((e.x + radi.3, e.y + radi.3), radi.3, (x, y));
                                 }
                                 false
                             }
diff --git a/crates/gosub_render_utils/src/render_tree.rs b/crates/gosub_render_utils/src/render_tree.rs
index 4116970e0..cd3d63aae 100644
--- a/crates/gosub_render_utils/src/render_tree.rs
+++ b/crates/gosub_render_utils/src/render_tree.rs
@@ -1,284 +1,703 @@
-use std::borrow::BorrowMut;
-use std::{cell::RefCell, rc::Rc};
-
-use gosub_html5::node::NodeData;
-use gosub_html5::parser::document;
-use gosub_html5::parser::document::{Document, DocumentHandle};
-
-use crate::render_tree::properties::Position;
-use crate::render_tree::{properties::Rectangle, text::TextNode};
-
-pub mod properties;
-pub mod text;
-pub mod util;
-
-/// A RenderTree is a data structure to be consumed by a user agent
-/// that combines the DOM and CSSOM to compute layouts and styles
-/// for objects to draw on the screen.
-pub struct RenderTree {
-    /// Pointer to the underlying document that builds this render tree
-    // TODO: Add CSSOM here as well when we get to that point
-    document: DocumentHandle,
-    /// Entry point of the render tree
-    // TODO: make this a NodeHandle to make operations easier and not
-    // have to keep doing borrow(), borrow_mut() etc.
-    pub root: Rc<RefCell<Node>>,
-    /// Global render cursor position managed by the tree
-    /// that determines where to draw objects on the screen.
-    /// Whenever a node is created, the current value of the
-    /// position is copied into the node.
-    pub position: Position,
+use gosub_html5::document::document_impl::TreeIterator;
+use gosub_render_backend::layout::{HasTextLayout, Layout, LayoutTree, Layouter, TextLayout};
+use gosub_render_backend::{layout, Size};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::{CssProperty, CssPropertyMap, CssSystem};
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::node::NodeData;
+use gosub_shared::traits::node::{ElementDataType, Node as DocumentNode, TextDataType};
+use gosub_shared::types::Result;
+use std::collections::HashMap;
+use std::fmt::{Debug, Formatter};
+
+mod desc;
+
+const INLINE_ELEMENTS: [&str; 31] = [
+    "a", "abbr", "acronym", "b", "bdo", "big", "br", "button", "cite", "code", "dfn", "em", "i", "img", "input", "kbd",
+    "label", "map", "object", "q", "samp", "script", "select", "small", "span", "strong", "sub", "sup", "textarea",
+    "tt", "var",
+];
+
+/// Map of all declared values for all nodes in the document
+#[derive(Debug)]
+pub struct RenderTree<L: Layouter, D: Document<C>, C: CssSystem> {
+    pub nodes: HashMap<NodeId, RenderTreeNode<L, C>>,
+    pub root: NodeId,
+    pub dirty: bool,
+    next_id: NodeId,
+    pub handle: Option<DocumentHandle<D, C>>,
 }
 
-impl RenderTree {
-    #[must_use]
-    pub fn new(document: &DocumentHandle) -> Self {
-        Self {
-            document: Document::clone(document),
-            root: Rc::new(RefCell::new(Node::new())),
-            position: Position::new(),
+#[allow(unused)]
+impl<L: Layouter, D: Document<C>, C: CssSystem> LayoutTree<L> for RenderTree<L, D, C> {
+    type NodeId = NodeId;
+    type Node = RenderTreeNode<L, C>;
+
+    fn children(&self, id: Self::NodeId) -> Option<Vec<Self::NodeId>> {
+        self.get_children(id).cloned()
+    }
+
+    fn contains(&self, id: &Self::NodeId) -> bool {
+        self.nodes.contains_key(id)
+    }
+
+    fn child_count(&self, id: Self::NodeId) -> usize {
+        self.child_count(id)
+    }
+
+    fn parent_id(&self, id: Self::NodeId) -> Option<Self::NodeId> {
+        self.get_node(id).and_then(|node| node.parent)
+    }
+
+    fn get_cache(&self, id: Self::NodeId) -> Option<&L::Cache> {
+        self.get_node(id).map(|node| &node.cache)
+    }
+
+    fn get_layout(&self, id: Self::NodeId) -> Option<&L::Layout> {
+        self.get_node(id).map(|node| &node.layout)
+    }
+
+    fn get_cache_mut(&mut self, id: Self::NodeId) -> Option<&mut L::Cache> {
+        self.get_node_mut(id).map(|node| &mut node.cache)
+    }
+
+    fn get_layout_mut(&mut self, id: Self::NodeId) -> Option<&mut L::Layout> {
+        self.get_node_mut(id).map(|node| &mut node.layout)
+    }
+
+    fn set_cache(&mut self, id: Self::NodeId, cache: L::Cache) {
+        if let Some(node) = self.get_node_mut(id) {
+            node.cache = cache;
         }
     }
 
-    pub fn build(&mut self) {
-        // start with a clean root (if build is called multiple times)
-        self.root = Rc::new(RefCell::new(Node::new()));
-
-        let tree_iterator = document::TreeIterator::new(&self.document);
-        let mut reference_element = Rc::clone(&self.root);
-
-        for current_node_id in tree_iterator {
-            let doc_read = self.document.get();
-            if let Some(current_node) = doc_read.get_node_by_id(current_node_id) {
-                match &current_node.data {
-                    NodeData::Element(element) => {
-                        let new_node = match element.name.as_str() {
-                            "h1" => Node::new_heading1,
-                            "h2" => Node::new_heading2,
-                            "h3" => Node::new_heading3,
-                            "h4" => Node::new_heading4,
-                            "h5" => Node::new_heading5,
-                            "h6" => Node::new_heading6,
-                            "p" => Node::new_paragraph,
-                            _ => continue, /* add more here, for now ignore */
-                        }(&mut self.position);
-
-                        let new_node = Rc::new(RefCell::new(new_node));
-
-                        util::add_node_to_element(&reference_element, &new_node);
-                        reference_element = Rc::clone(&new_node);
-                    }
-                    NodeData::Text(text) => {
-                        let mut mut_element_ref = reference_element.as_ref().borrow_mut();
-                        if let NodeType::Text(element_text) = &mut mut_element_ref.node_type {
-                            element_text.value.push_str(text.value());
-                        }
-                    }
-                    _ => { /* ignore */ }
-                }
-            }
+    fn set_layout(&mut self, id: Self::NodeId, layout: L::Layout) {
+        if let Some(node) = self.get_node_mut(id) {
+            node.layout = layout;
         }
     }
-}
 
-/// An individual node that sits inside a RenderTree.
-/// A RenderTree Node mimics a Node from the DOM but
-/// contains more visual information such as width,
-/// height, font sizes, colors, etc. A RenderTree Node
-/// can have children just like regular DOM nodes.
-#[derive(Debug, PartialEq)]
-#[repr(C)]
-pub struct Node {
-    pub node_type: NodeType,
-    pub margin: Rectangle,
-    pub padding: Rectangle,
-    // TODO: border and other common properties
-    pub parent: Option<Rc<RefCell<Node>>>,
-    pub next_sibling: Option<Rc<RefCell<Node>>>,
-    pub children: Vec<Rc<RefCell<Node>>>,
-    pub position: Position,
-}
+    fn style_dirty(&self, id: Self::NodeId) -> bool {
+        self.get_node(id).map(|node| node.properties.is_dirty()).unwrap_or(true)
+    }
 
-impl Node {
-    #[must_use]
-    pub fn new() -> Self {
-        Self {
-            node_type: NodeType::Root(true),
-            margin: Rectangle::new(),
-            padding: Rectangle::new(),
-            parent: None,
-            next_sibling: None,
-            children: Vec::new(),
-            position: Position::new(),
+    fn clean_style(&mut self, id: Self::NodeId) {
+        if let Some(node) = self.get_node_mut(id) {
+            node.properties.make_clean();
         }
     }
 
-    fn new_text(node: TextNode, margin: f64, position: &mut Position) -> Self {
-        position.offset_y(margin);
-        let fs = node.font_size;
-        let new_node = Self {
-            node_type: NodeType::Text(node),
-            margin: Rectangle::with_values(margin, 0., 0., margin),
-            padding: Rectangle::new(),
-            parent: None,
-            next_sibling: None,
-            children: Vec::new(),
-            position: Position::new_from_existing(position),
+    fn get_node(&mut self, id: Self::NodeId) -> Option<&mut Self::Node> {
+        self.get_node_mut(id)
+    }
+}
+
+impl<L: Layouter, D: Document<C>, C: CssSystem> RenderTree<L, D, C> {
+    // Generates a new render tree with a root node
+    pub fn with_capacity(capacity: usize) -> Self {
+        let mut tree = Self {
+            nodes: HashMap::with_capacity(capacity),
+            root: NodeId::root(),
+            dirty: false,
+            next_id: NodeId::from(1u64),
+            handle: None,
         };
 
-        position.offset_y(fs + margin);
+        tree.insert_node(
+            NodeId::root(),
+            RenderTreeNode {
+                id: NodeId::root(),
+                properties: C::PropertyMap::default(),
+                children: Vec::new(),
+                parent: None,
+                name: String::from("root"),
+                namespace: None,
+                data: RenderNodeData::Document,
+                cache: L::Cache::default(),
+                layout: L::Layout::default(),
+            },
+        );
+
+        tree
+    }
 
-        new_node
+    /// Returns the root node of the render tree
+    pub fn get_root(&self) -> &RenderTreeNode<L, C> {
+        self.nodes.get(&self.root).expect("root node")
     }
 
-    // I took the margins/font sizes from Chrome dev tools.
-    // There are still some slight differences but it's very close
+    /// Returns the node with the given id
+    pub fn get_node(&self, id: NodeId) -> Option<&RenderTreeNode<L, C>> {
+        self.nodes.get(&id)
+    }
 
-    pub fn new_heading1(position: &mut Position) -> Self {
-        let margin = 10.72;
-        let heading = TextNode::new_heading1();
+    /// Returns a mutable reference to the node with the given id
+    pub fn get_node_mut(&mut self, id: NodeId) -> Option<&mut RenderTreeNode<L, C>> {
+        self.nodes.get_mut(&id)
+    }
+
+    /// Returns the children of the given node
+    pub fn get_children(&self, id: NodeId) -> Option<&Vec<NodeId>> {
+        self.nodes.get(&id).map(|node| &node.children)
+    }
+
+    /// Returns the children of the given node
+    pub fn child_count(&self, id: NodeId) -> usize {
+        self.nodes.get(&id).map(|node| node.children.len()).unwrap_or(0)
+    }
 
-        Node::new_text(heading, margin, position)
+    /// Inserts a new node into the render tree, note that you are responsible for the node id
+    /// and the children of the node
+    pub fn insert_node(&mut self, id: NodeId, node: RenderTreeNode<L, C>) {
+        self.nodes.insert(id, node);
     }
 
-    pub fn new_heading2(position: &mut Position) -> Self {
-        let margin = 9.96;
-        let heading = TextNode::new_heading2();
+    /// Deletes the node with the given id from the render tree
+    pub fn delete_node(&mut self, id: &NodeId) -> Option<(NodeId, RenderTreeNode<L, C>)> {
+        // println!("Deleting node: {id:?}");
+
+        if let Some(n) = self.nodes.get(id) {
+            let parent = n.parent;
+
+            if let Some(parent) = parent {
+                if let Some(parent_node) = self.nodes.get_mut(&parent) {
+                    parent_node.children.retain(|child| child != id);
+                }
+            }
 
-        Node::new_text(heading, margin, position)
+            self.nodes.remove_entry(id)
+        } else {
+            None
+        }
     }
 
-    pub fn new_heading3(position: &mut Position) -> Self {
-        let margin = 9.36;
-        let heading = TextNode::new_heading3();
+    /// Returns a recursive list of all child node ids for the given node id
+    fn get_child_node_ids(&self, node_id: NodeId) -> Vec<NodeId> {
+        let mut result = vec![node_id];
 
-        Node::new_text(heading, margin, position)
+        let node = self.nodes.get(&node_id);
+        if node.is_none() {
+            return result;
+        }
+        node.expect("node").children.iter().for_each(|child| {
+            let mut childs = self.get_child_node_ids(*child);
+            result.append(&mut childs);
+        });
+
+        result
     }
 
-    pub fn new_heading4(position: &mut Position) -> Self {
-        let margin = 10.64;
-        let heading = TextNode::new_heading4();
+    /// Mark the given node as dirty, so it will be recalculated
+    pub fn mark_dirty(&mut self, node_id: NodeId) {
+        if let Some(props) = self.nodes.get_mut(&node_id) {
+            props.properties.make_dirty();
+        }
+    }
 
-        Node::new_text(heading, margin, position)
+    /// Mark the given node as clean, so it will not be recalculated
+    pub fn mark_clean(&mut self, node_id: NodeId) {
+        if let Some(props) = self.nodes.get_mut(&node_id) {
+            props.properties.make_clean();
+        }
     }
 
-    pub fn new_heading5(position: &mut Position) -> Self {
-        let margin = 11.089;
-        let heading = TextNode::new_heading5();
+    /// Retrieves the property for the given node, or None when not found
+    pub fn get_property(&self, node_id: NodeId, prop_name: &str) -> Option<&C::Property> {
+        let props = self.nodes.get(&node_id)?;
 
-        Node::new_text(heading, margin, position)
+        props.properties.get(prop_name)
     }
 
-    pub fn new_heading6(position: &mut Position) -> Self {
-        let margin = 12.489;
-        let heading = TextNode::new_heading6();
+    /// Retrieves the value for the given property for the given node, or None when not found
+    pub fn get_all_properties(&self, node_id: NodeId) -> Option<&C::PropertyMap> {
+        self.nodes.get(&node_id).map(|props| &props.properties)
+    }
+
+    /// Generate a render tree from the given document
+    pub fn from_document(document: DocumentHandle<D, C>) -> Self {
+        let mut render_tree = RenderTree::with_capacity(document.get().node_count());
+
+        render_tree.generate_from(document);
 
-        Node::new_text(heading, margin, position)
+        render_tree
     }
 
-    pub fn new_paragraph(position: &mut Position) -> Self {
-        let margin = 8.;
-        let paragraph = TextNode::new_paragraph();
+    fn generate_from(&mut self, handle: DocumentHandle<D, C>) {
+        // Iterate the complete document tree
 
-        Node::new_text(paragraph, margin, position)
+        let iter_handle = DocumentHandle::clone(&handle);
+
+        for current_node_id in TreeIterator::new(iter_handle) {
+            let doc = handle.get();
+
+            let node = doc.node_by_id(current_node_id).unwrap();
+
+            let Some(properties) = C::properties_from_node(node, doc.stylesheets(), handle.clone(), current_node_id)
+            else {
+                //we need to remove it  from the parent in the render tree and from the document
+
+                todo!("unrenderable node");
+            };
+
+            let data = node.data();
+
+            let render_data = match RenderNodeData::from_node_data(data) {
+                ControlFlow::Ok(data) => data,
+                ControlFlow::Drop => continue,
+                ControlFlow::Error(e) => {
+                    log::error!("Failed to create node data for node: {current_node_id:?} ({e}");
+                    continue;
+                }
+            };
+
+            let mut namespace: Option<String> = None;
+
+            let name = match data {
+                NodeData::Element(data) => {
+                    namespace = Some(data.namespace().to_string());
+                    data.name().to_string()
+                }
+                NodeData::Text(_) => "#text".to_owned(),
+                NodeData::Document(_) => "#document".to_owned(),
+                _ => String::new(),
+            };
+
+            let render_tree_node = RenderTreeNode {
+                id: current_node_id,
+                properties,
+                children: node.children().to_vec(),
+                parent: node.parent_id(),
+                name, // We might be able to move node into render_tree_node
+                namespace,
+                data: render_data,
+                cache: L::Cache::default(),
+                layout: L::Layout::default(),
+            };
+
+            self.nodes.insert(current_node_id, render_tree_node);
+        }
+
+        self.next_id = handle.get().peek_next_id();
+
+        self.remove_unrenderable_nodes();
+
+        C::inheritance(self);
+
+        if L::COLLAPSE_INLINE {
+            self.collapse_inline(self.root);
+        }
+
+        // self.print_tree();
     }
 
-    pub fn add_child(&mut self, child: &Rc<RefCell<Node>>) {
-        if let Some(last_child) = &self.children.last().borrow_mut() {
-            last_child.as_ref().borrow_mut().next_sibling = Some(Rc::clone(child));
+    /// Removes all unrenderable nodes from the render tree
+    fn remove_unrenderable_nodes(&mut self) {
+        // There are more elements that are not renderable, but for now we only remove the most common ones
+        let mut delete_list = Vec::new();
+
+        for id in self.nodes.keys() {
+            // Check CSS styles and remove if not renderable
+            if let Some(prop) = self.get_property(*id, "display") {
+                if prop.as_string() == Some("none") {
+                    delete_list.append(&mut self.get_child_node_ids(*id));
+                    delete_list.push(*id);
+                    continue;
+                }
+            }
+        }
+
+        for id in delete_list {
+            self.delete_node(&id);
+        }
+    }
+
+    /// Collapse all inline elements / wrap inline elements with anonymous boxes
+    fn collapse_inline(&mut self, node_id: NodeId) {
+        let Some(node) = self.nodes.get(&node_id) else {
+            eprintln!("Node not found: {node_id}");
+            return;
+        };
+
+        let mut inline_wrapper = None;
+
+        for child_id in node.children.clone() {
+            let Some(child) = self.nodes.get_mut(&child_id) else {
+                eprintln!("Child not found: {child_id}");
+                continue;
+            };
+
+            if child.is_inline() {
+                if let Some(wrapper_id) = inline_wrapper {
+                    let old_parent = child.parent;
+                    child.parent = Some(wrapper_id);
+
+                    let Some(wrapper) = self.nodes.get_mut(&wrapper_id) else {
+                        eprintln!("Wrapper not found: {wrapper_id}");
+                        continue;
+                    };
+
+                    wrapper.children.push(child_id);
+
+                    if let Some(old_parent) = old_parent {
+                        let Some(old_parent) = self.nodes.get_mut(&old_parent) else {
+                            eprintln!("Old parent not found: {old_parent}");
+                            continue;
+                        };
+
+                        old_parent.children.retain(|id| *id != child_id);
+                    }
+                } else {
+                    let wrapper_node = RenderTreeNode {
+                        id: self.next_id,
+                        properties: C::PropertyMap::default(),
+                        children: vec![child_id],
+                        parent: Some(node_id),
+                        name: "#anonymous".to_string(),
+                        namespace: None,
+                        data: RenderNodeData::AnonymousInline,
+                        cache: L::Cache::default(),
+                        layout: L::Layout::default(),
+                    };
+                    let id = wrapper_node.id;
+
+                    self.next_id = self.next_id.next();
+
+                    let old_parent = child.parent;
+                    child.parent = Some(id);
+                    inline_wrapper = Some(id);
+
+                    self.nodes.insert(id, wrapper_node);
+
+                    if let Some(old_parent) = old_parent {
+                        let Some(old_parent) = self.nodes.get_mut(&old_parent) else {
+                            eprintln!("Old parent not found: {old_parent}");
+                            continue;
+                        };
+
+                        if let Some(pos) = old_parent.children.iter().position(|id| *id == child_id) {
+                            old_parent.children[pos] = id;
+                        }
+                    }
+                }
+            } else {
+                inline_wrapper = None;
+            }
+
+            self.collapse_inline(child_id)
+        }
+    }
+
+    pub fn print_tree(&self) {
+        self.print_tree_from(self.root, 0);
+    }
+
+    fn print_tree_from(&self, node_id: NodeId, depth: usize) {
+        let Some(node) = self.nodes.get(&node_id) else {
+            return;
+        };
+        let indent = "  ".repeat(depth);
+
+        let size = node.layout.size();
+        let w = size.width;
+        let h = size.height;
+
+        let pos = node.layout.rel_pos();
+        let x = pos.x;
+        let y = pos.y;
+
+        println!("{indent}{node_id}: {} @ ({x}:{y}) [{w}x{h}]", node.name);
+
+        for child_id in &node.children {
+            self.print_tree_from(*child_id, depth + 1);
         }
-        self.children.push(Rc::clone(child));
     }
 }
 
-impl Default for Node {
-    fn default() -> Self {
-        Self::new()
+impl<L: Layouter, D: Document<C>, C: CssSystem> gosub_shared::traits::render_tree::RenderTree<C>
+    for RenderTree<L, D, C>
+{
+    type NodeId = NodeId;
+    type Node = RenderTreeNode<L, C>;
+
+    fn root(&self) -> Self::NodeId {
+        self.root
+    }
+
+    fn get_node(&self, id: Self::NodeId) -> Option<&Self::Node> {
+        self.get_node(id)
+    }
+
+    fn get_node_mut(&mut self, id: Self::NodeId) -> Option<&mut Self::Node> {
+        self.get_node_mut(id)
+    }
+
+    fn get_children(&self, id: Self::NodeId) -> Option<Vec<Self::NodeId>> {
+        self.get_children(id).cloned()
     }
 }
 
-/// Different types of RenderTree Nodes
-// NOTE: tag size must be u32 otherwise it wont work with a C enum (originally I tried u8)
-#[derive(Debug, PartialEq)]
-#[repr(C, u32)]
-pub enum NodeType {
-    /// Serves no purpose besides being the entry point
-    // NOTE: the bool is a dummy value, otherwise it appears to be ignored when transferring to C API
-    Root(bool),
-    /// Represents text to render. Usually created from heading or paragraph elements in the DOM.
-    Text(TextNode),
-    // TODO: add more types as we build out the RenderTree
+impl<L: Layouter, C: CssSystem> gosub_shared::traits::render_tree::RenderTreeNode<C> for RenderTreeNode<L, C> {
+    fn props(&self) -> &C::PropertyMap {
+        &self.properties
+    }
+
+    fn props_mut(&mut self) -> &mut C::PropertyMap {
+        &mut self.properties
+    }
 }
 
-/// Constructs an iterator for a RenderTree
-pub struct TreeIterator {
-    current_node: Option<Rc<RefCell<Node>>>,
-    node_stack: Vec<Rc<RefCell<Node>>>,
+// Generates a declaration property and adds it to the css_map_entry
+
+pub enum RenderNodeData<L: Layouter> {
+    Document,
+    Element,
+    Text(Box<TextData<L>>),
+    AnonymousInline,
 }
 
-impl TreeIterator {
-    #[must_use]
-    pub fn new(render_tree: &RenderTree) -> Self {
-        Self {
-            current_node: None,
-            node_stack: vec![Rc::clone(&render_tree.root)],
+impl<L: Layouter> Debug for RenderNodeData<L> {
+    fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
+        match self {
+            RenderNodeData::Document => f.write_str("Document"),
+            RenderNodeData::Element => f.write_str("Element"),
+            RenderNodeData::Text(data) => f.debug_struct("TextData").field("data", data).finish(),
+            RenderNodeData::AnonymousInline => f.write_str("AnonymousInline"),
         }
     }
+}
+
+// impl<L: Layouter> Debug for RenderNodeData<L> {
+//     fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
+//         match self {
+//             RenderNodeData::Document => f.write_str("Document"),
+//             RenderNodeData::Element => {
+//                 f.debug_struct("ElementData").field("data", data).finish()
+//             }
+//             RenderNodeData::Text(data) => f.debug_struct("TextData").field("data", data).finish(),
+//             RenderNodeData::AnonymousInline => f.write_str("AnonymousInline"),
+//         }
+//     }
+// }
+//
+
+pub struct TextData<L: Layouter> {
+    pub text: String,
+    pub layout: Option<L::TextLayout>,
+}
+
+impl<L: Layouter> Debug for TextData<L> {
+    fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
+        f.debug_struct("TextData")
+            .field("text", &self.text)
+            .field("layout", &self.layout.as_ref().map(|x| x.dbg_layout()))
+            .finish()
+    }
+}
+
+pub enum ControlFlow<T> {
+    Ok(T),
+    Drop,
+    Error(anyhow::Error),
+}
+
+impl<L: Layouter> RenderNodeData<L> {
+    pub fn from_node_data<N: DocumentNode<C>, C: CssSystem>(node: NodeData<C, N>) -> ControlFlow<Self> {
+        ControlFlow::Ok(match node {
+            NodeData::Element(_) => RenderNodeData::Element,
+            NodeData::Text(data) => {
+                let text = pre_transform_text(data.string_value());
 
-    pub fn current(&self) -> Option<Rc<RefCell<Node>>> {
-        if let Some(node) = &self.current_node {
-            return Some(Rc::clone(node));
+                RenderNodeData::Text(Box::new(TextData { text, layout: None }))
+            }
+            NodeData::Document(_) => RenderNodeData::Document,
+            _ => return ControlFlow::Drop,
+        })
+    }
+}
+
+fn pre_transform_text(text: String) -> String {
+    let mut new_text = String::with_capacity(text.len());
+
+    let mut last_was_ws = false;
+    for c in text.chars() {
+        if c.is_whitespace() {
+            if !last_was_ws {
+                new_text.push(' ');
+                last_was_ws = true;
+            }
+        } else {
+            new_text.push(c);
+            last_was_ws = false;
         }
+    }
+
+    new_text
+}
 
-        None
+pub struct RenderTreeNode<L: Layouter, C: CssSystem> {
+    pub id: NodeId,
+    pub properties: C::PropertyMap,
+    pub children: Vec<NodeId>,
+    pub parent: Option<NodeId>,
+    pub name: String,
+    pub namespace: Option<String>,
+    pub data: RenderNodeData<L>,
+    pub cache: L::Cache,
+    pub layout: L::Layout,
+}
+
+impl<L: Layouter, C: CssSystem> Debug for RenderTreeNode<L, C> {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        f.debug_struct("RenderTreeNode")
+            .field("id", &self.id)
+            .field("properties", &self.properties)
+            .field("children", &self.children)
+            .field("parent", &self.parent)
+            .field("name", &self.name)
+            .field("namespace", &self.namespace)
+            .field("data", &self.data)
+            .finish()
     }
 }
 
-impl Iterator for TreeIterator {
-    type Item = Rc<RefCell<Node>>;
+impl<L: Layouter, C: CssSystem> RenderTreeNode<L, C> {
+    /// Returns true if the node is an element node
+    pub fn is_element(&self) -> bool {
+        matches!(self.data, RenderNodeData::Element)
+    }
 
-    fn next(&mut self) -> Option<Rc<RefCell<Node>>> {
-        self.current_node = self.node_stack.pop();
-        if let Some(current_node) = &self.current_node {
-            self.current_node.as_ref()?;
+    /// Returns true if the node is a text node
+    pub fn is_text(&self) -> bool {
+        matches!(self.data, RenderNodeData::Text(_))
+    }
 
-            if let Some(node) = &self.current_node {
-                if let Some(sibling) = &node.borrow().next_sibling {
-                    self.node_stack.push(Rc::clone(sibling));
-                }
+    /// Returns the requested property for the node
+    pub fn get_property(&mut self, prop_name: &str) -> Option<&mut C::Property> {
+        self.properties.get_mut(prop_name)
+    }
 
-                if let Some(first_child) = node.borrow().children.first() {
-                    self.node_stack.push(Rc::clone(first_child));
-                }
+    pub fn is_inline(&mut self) -> bool {
+        if matches!(self.data, RenderNodeData::Text(_)) {
+            return true;
+        }
+
+        if let Some(d) = self.properties.get("display").and_then(|prop| {
+            let val = prop.as_string()?;
+
+            // const NON_INLINE_DISPLAYS: [&str; 6] = ["block", "flex", "grid", "table", "list-item", "none"];
+            // if NON_INLINE_DISPLAYS.contains(&val.as_str()) {
+            //     return Some(false);
+            // } //TODO: somehow this causes problems with the inline elements
+
+            if val == "inline" || val == "inline-block" || val == "inline-table" || val == "inline-flex" {
+                return Some(true);
             }
 
-            return Some(Rc::clone(current_node));
+            None
+        }) {
+            return d;
         }
 
-        None
+        let tag_name = self.name.to_lowercase();
+
+        INLINE_ELEMENTS.contains(&tag_name.as_str())
+    }
+}
+
+impl<L: Layouter, C: CssSystem> HasTextLayout<L> for RenderTreeNode<L, C> {
+    fn set_text_layout(&mut self, layout: L::TextLayout) {
+        if let RenderNodeData::Text(text) = &mut self.data {
+            text.layout = Some(layout);
+        }
     }
 }
 
-#[cfg(test)]
-mod tests {
-    use std::{cell::RefCell, rc::Rc};
-
-    use crate::render_tree::Node;
-
-    #[test]
-    fn next_sibling() {
-        let mut root = Node::new();
-        let t1 = Rc::new(RefCell::new(Node::new_heading1(&mut root.position)));
-        root.add_child(&Rc::clone(&t1));
-        assert!(t1.as_ref().borrow().next_sibling.is_none());
-        let t2 = Rc::new(RefCell::new(Node::new_heading1(&mut root.position)));
-        root.add_child(&Rc::clone(&t2));
-        assert!(t1.as_ref().borrow().next_sibling.is_some());
-        let t1_ref = t1.as_ref().borrow();
-        if let Some(sibling) = &t1_ref.next_sibling {
-            assert_eq!(sibling.as_ref(), t2.as_ref());
+impl<L: Layouter, C: CssSystem> layout::Node for RenderTreeNode<L, C> {
+    type Property = C::Property;
+
+    fn get_property(&self, name: &str) -> Option<&Self::Property> {
+        self.properties.get(name)
+    }
+    fn text_data(&self) -> Option<&str> {
+        if let RenderNodeData::Text(text) = &self.data {
+            Some(&text.text)
         } else {
-            panic!()
+            None
         }
     }
+
+    fn text_size(&self) -> Option<Size> {
+        if let RenderNodeData::Text(text) = &self.data {
+            text.layout.as_ref().map(|layout| layout.size())
+        } else {
+            None
+        }
+    }
+
+    fn is_anon_inline_parent(&self) -> bool {
+        matches!(self.data, RenderNodeData::AnonymousInline)
+    }
 }
+
+/// Generates a render tree for the given document based on its loaded stylesheets
+pub fn generate_render_tree<L: Layouter, D: Document<C>, C: CssSystem>(
+    document: DocumentHandle<D, C>,
+) -> Result<RenderTree<L, D, C>> {
+    let render_tree = RenderTree::from_document(document);
+
+    Ok(render_tree)
+}
+
+// pub fn walk_render_tree(tree: &RenderTree, visitor: &mut Box<dyn TreeVisitor<RenderTreeNode>>) {
+//     let root = tree.get_root();
+//     internal_walk_render_tree(tree, root, visitor);
+// }
+//
+// fn internal_walk_render_tree(
+//     tree: &RenderTree,
+//     node: &RenderTreeNode,
+//     visitor: &mut Box<dyn TreeVisitor<RenderTreeNode>>,
+// ) {
+//     // Enter node
+//     match &node.data {
+//         RenderNodeData::Document(document) => visitor.document_enter(tree, node, document),
+//         RenderNodeData::DocType(doctype) => visitor.doctype_enter(tree, node, doctype),
+//         RenderNodeData::Text(text) => visitor.text_enter(tree, node, &text.into()),
+//         RenderNodeData::Comment(comment) => visitor.comment_enter(tree, node, comment),
+//         RenderNodeData::Element(element) => visitor.element_enter(tree, node, element),
+//     }
+//
+//     for child_id in &node.children {
+//         if tree.nodes.contains_key(child_id) {
+//             let child_node = tree.nodes.get(child_id).expect("node");
+//             internal_walk_render_tree(tree, child_node, visitor);
+//         }
+//     }
+//
+//     // Leave node
+//     match &node.data {
+//         RenderNodeData::Document(document) => visitor.document_leave(tree, node, document),
+//         RenderNodeData::DocType(doctype) => visitor.doctype_leave(tree, node, doctype),
+//         RenderNodeData::Text(text) => visitor.text_leave(tree, node, &text.into()),
+//         RenderNodeData::Comment(comment) => visitor.comment_leave(tree, node, comment),
+//         RenderNodeData::Element(element) => visitor.element_leave(tree, node, element),
+//     }
+// }
+//
+// pub trait TreeVisitor<Node> {
+//     fn document_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocumentData);
+//     fn document_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocumentData);
+//
+//     fn doctype_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocTypeData);
+//     fn doctype_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocTypeData);
+//
+//     fn text_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &TextData);
+//     fn text_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &TextData);
+//
+//     fn comment_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &CommentData);
+//     fn comment_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &CommentData);
+//
+//     fn element_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &ElementData);
+//     fn element_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &ElementData);
+// }
diff --git a/crates/gosub_styling/src/render_tree/desc.rs b/crates/gosub_render_utils/src/render_tree/desc.rs
similarity index 53%
rename from crates/gosub_styling/src/render_tree/desc.rs
rename to crates/gosub_render_utils/src/render_tree/desc.rs
index 119f0166c..2b32eec19 100644
--- a/crates/gosub_styling/src/render_tree/desc.rs
+++ b/crates/gosub_render_utils/src/render_tree/desc.rs
@@ -1,9 +1,12 @@
 use crate::render_tree::{RenderNodeData, RenderTree};
-use gosub_html5::node::NodeId;
 use gosub_render_backend::layout::{Layout, Layouter};
 use gosub_render_backend::{NodeDesc, Point, Size};
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::{CssPropertyMap, CssSystem};
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::node::{ElementDataType, Node};
 
-impl<L: Layouter> RenderTree<L> {
+impl<L: Layouter, D: Document<C>, C: CssSystem> RenderTree<L, D, C> {
     pub fn desc(&self) -> NodeDesc {
         self.desc_node(self.root)
     }
@@ -22,13 +25,22 @@ impl<L: Layouter> RenderTree<L> {
             };
         };
 
-        let attributes = if let RenderNodeData::Element(e) = &node.data {
-            e.attributes
-                .iter()
-                .map(|(k, v)| (k.clone(), v.clone()))
-                .collect()
+        let attributes = if let RenderNodeData::Element = &node.data {
+            // we need to get the attributes from the document, not from the render tree
+
+            if let Some(handle) = &self.handle {
+                let doc = handle.get();
+
+                doc.node_by_id(node.id)
+                    .and_then(|n| n.get_element_data())
+                    .map(|e| e.attributes())
+                    .map(|a| a.iter().map(|(k, v)| (k.clone(), v.clone())).collect::<Vec<_>>())
+                    .unwrap_or_default()
+            } else {
+                Vec::new()
+            }
         } else {
-            vec![]
+            Vec::new()
         };
 
         let (name, text) = if let RenderNodeData::Text(t) = &node.data {
@@ -40,17 +52,12 @@ impl<L: Layouter> RenderTree<L> {
         NodeDesc {
             id: node.id.into(),
             name,
-            children: node
-                .children
-                .iter()
-                .map(|child| self.desc_node(*child))
-                .collect(),
+            children: node.children.iter().map(|child| self.desc_node(*child)).collect(),
             attributes,
             properties: node
-                .properties
                 .properties
                 .iter()
-                .map(|(k, v)| (k.clone(), v.actual.to_string()))
+                .map(|(k, v)| (k.to_owned(), format!("{v:?}")))
                 .collect(),
             text,
             pos: node.layout.rel_pos(),
diff --git a/crates/gosub_render_utils/src/render_tree/properties.rs b/crates/gosub_render_utils/src/render_tree/properties.rs
deleted file mode 100644
index b7ffc601c..000000000
--- a/crates/gosub_render_utils/src/render_tree/properties.rs
+++ /dev/null
@@ -1,91 +0,0 @@
-/// Rectangular dimensions commonly used for certain properties such as margin/padding
-#[derive(Debug, PartialEq, Clone)]
-#[repr(C)]
-pub struct Rectangle {
-    pub top: f64,
-    pub left: f64,
-    pub right: f64,
-    pub bottom: f64,
-}
-
-impl Default for Rectangle {
-    fn default() -> Self {
-        Self::new()
-    }
-}
-
-impl Rectangle {
-    #[must_use]
-    pub fn new() -> Self {
-        Self {
-            top: 0.,
-            left: 0.,
-            right: 0.,
-            bottom: 0.,
-        }
-    }
-
-    pub fn with_values(top: f64, left: f64, right: f64, bottom: f64) -> Self {
-        Self {
-            top,
-            left,
-            right,
-            bottom,
-        }
-    }
-}
-
-/// The position of the render cursor used to determine where
-/// to draw an object
-#[derive(Debug, PartialEq, Clone)]
-#[repr(C)]
-pub struct Position {
-    pub x: f64,
-    pub y: f64,
-}
-
-impl Position {
-    #[must_use]
-    pub fn new() -> Self {
-        Self { x: 0., y: 0. }
-    }
-
-    pub fn new_from_existing(position: &Position) -> Self {
-        Self {
-            x: position.x,
-            y: position.y,
-        }
-    }
-
-    /// Move position to (x, y)
-    pub fn move_to(&mut self, x: f64, y: f64) {
-        self.x = x;
-        self.y = y;
-    }
-
-    /// Move position relative to another position.
-    /// x = relative.x + x_offset
-    /// y = relative.y + y_offset
-    pub fn move_relative_to(&mut self, relative_position: &Position, x_offset: f64, y_offset: f64) {
-        self.x = relative_position.x + x_offset;
-        self.y = relative_position.y + y_offset;
-    }
-
-    /// Adjust y by an offset.
-    /// y += offset_y
-    pub fn offset_y(&mut self, offset_y: f64) {
-        self.y += offset_y;
-    }
-
-    /// Adjust x by an offset.
-    /// x += offset_x
-    pub fn offset_x(&mut self, offset_x: f64) {
-        self.x += offset_x;
-    }
-}
-
-impl Default for Position {
-    fn default() -> Self {
-        Self::new()
-    }
-}
diff --git a/crates/gosub_render_utils/src/render_tree/text.rs b/crates/gosub_render_utils/src/render_tree/text.rs
deleted file mode 100644
index d83e79ce4..000000000
--- a/crates/gosub_render_utils/src/render_tree/text.rs
+++ /dev/null
@@ -1,50 +0,0 @@
-#[derive(Debug, PartialEq)]
-#[repr(C)]
-pub struct TextNode {
-    /// Body of the text node that will be drawn
-    pub value: String,
-    pub font: String,
-    pub font_size: f64,
-    pub is_bold: bool,
-    // TODO: color, styles, visiblity, etc
-}
-
-impl TextNode {
-    #[must_use]
-    fn new(fs: f64, bold: bool) -> Self {
-        Self {
-            value: "".to_owned(),
-            font: "Times New Roman".to_owned(),
-            font_size: fs,
-            is_bold: bold,
-        }
-    }
-
-    pub fn new_heading1() -> Self {
-        TextNode::new(37., true)
-    }
-
-    pub fn new_heading2() -> Self {
-        TextNode::new(27.5, true)
-    }
-
-    pub fn new_heading3() -> Self {
-        TextNode::new(21.5, true)
-    }
-
-    pub fn new_heading4() -> Self {
-        TextNode::new(18.5, true)
-    }
-
-    pub fn new_heading5() -> Self {
-        TextNode::new(15.5, true)
-    }
-
-    pub fn new_heading6() -> Self {
-        TextNode::new(12., true)
-    }
-
-    pub fn new_paragraph() -> Self {
-        TextNode::new(18.5, false)
-    }
-}
diff --git a/crates/gosub_render_utils/src/render_tree/util.rs b/crates/gosub_render_utils/src/render_tree/util.rs
deleted file mode 100644
index 212766d12..000000000
--- a/crates/gosub_render_utils/src/render_tree/util.rs
+++ /dev/null
@@ -1,14 +0,0 @@
-use std::{cell::RefCell, rc::Rc};
-
-use super::Node;
-
-// TODO: we need a NodeHandle wrapper to clean up this borrow_mut() stuff
-
-pub fn add_node_to_element(reference_element: &Rc<RefCell<Node>>, new_node: &Rc<RefCell<Node>>) {
-    let mut mut_ref = reference_element.as_ref().borrow_mut();
-    if let Some(parent) = &mut_ref.parent {
-        parent.as_ref().borrow_mut().add_child(&Rc::clone(new_node));
-    } else {
-        mut_ref.add_child(&Rc::clone(new_node));
-    }
-}
diff --git a/crates/gosub_render_utils/src/style/parse.rs b/crates/gosub_render_utils/src/style/parse.rs
index b8685081b..1c0b90005 100644
--- a/crates/gosub_render_utils/src/style/parse.rs
+++ b/crates/gosub_render_utils/src/style/parse.rs
@@ -5,9 +5,8 @@ use taffy::{
 };
 
 use gosub_render_backend::{PreRenderText, RenderBackend};
-// use gosub_styling::css_values::CssValue;
 use gosub_css3::stylesheet::CssValue;
-use gosub_styling::render_tree::{RenderTreeNode, TextData};
+use gosub_css3::render_tree::{RenderTreeNode, TextData};
 
 pub(crate) fn parse_len<B: RenderBackend>(
     node: &mut RenderTreeNode<B>,
diff --git a/crates/gosub_renderer/Cargo.toml b/crates/gosub_renderer/Cargo.toml
index 4ba1625f6..67be23cff 100644
--- a/crates/gosub_renderer/Cargo.toml
+++ b/crates/gosub_renderer/Cargo.toml
@@ -5,13 +5,10 @@ edition = "2021"
 authors = ["Gosub Community <info@gosub.io>"]
 license = "MIT"
 
-# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
-
 [dependencies]
 gosub_rendering = { path = "../gosub_render_utils" }
 gosub_html5 = { path = "../gosub_html5" }
 gosub_shared = { path = "../gosub_shared" }
-gosub_styling = { path = "../gosub_styling" }
 gosub_css3 = { path = "../gosub_css3" }
 gosub_net = { path = "../gosub_net" }
 gosub_render_backend = { path = "../gosub_render_backend" }
@@ -20,8 +17,6 @@ image = "0.25.2"
 url = "2.5.2"
 log = "0.4.22"
 
-
-
 [target.'cfg(target_arch = "wasm32")'.dependencies]
 wasm-bindgen-futures = "0.4.42"
 web-sys = "0.3.70"
diff --git a/crates/gosub_renderer/src/debug/scale.rs b/crates/gosub_renderer/src/debug/scale.rs
index bc6730dc5..9a0d154ed 100644
--- a/crates/gosub_renderer/src/debug/scale.rs
+++ b/crates/gosub_renderer/src/debug/scale.rs
@@ -1,6 +1,4 @@
-use gosub_render_backend::{
-    Brush, Color, Point, Rect, RenderBackend, RenderRect, Scene, SizeU32, Transform,
-};
+use gosub_render_backend::{Brush, Color, Point, Rect, RenderBackend, RenderRect, Scene, SizeU32, Transform};
 use std::cmp::max;
 use std::f32::consts::PI;
 
diff --git a/crates/gosub_renderer/src/draw.rs b/crates/gosub_renderer/src/draw.rs
index b7a0f5552..96909603a 100644
--- a/crates/gosub_renderer/src/draw.rs
+++ b/crates/gosub_renderer/src/draw.rs
@@ -4,20 +4,23 @@ use anyhow::anyhow;
 use log::warn;
 use url::Url;
 
-use gosub_css3::colors::RgbColor;
-use gosub_css3::stylesheet::CssValue;
-use gosub_html5::node::NodeId;
 use gosub_net::http::fetcher::Fetcher;
 use gosub_render_backend::geo::{Size, SizeU32, FP};
 use gosub_render_backend::layout::{Layout, LayoutTree, Layouter, TextLayout};
 use gosub_render_backend::svg::SvgRenderer;
 use gosub_render_backend::{
-    Border, BorderSide, BorderStyle, Brush, Color, ImageBuffer, NodeDesc, Rect, RenderBackend,
-    RenderBorder, RenderRect, RenderText, Scene as TScene, Text, Transform,
+    Border, BorderSide, BorderStyle, Brush, Color, ImageBuffer, NodeDesc, Rect, RenderBackend, RenderBorder,
+    RenderRect, RenderText, Scene as TScene, Text, Transform,
 };
+
 use gosub_rendering::position::PositionTree;
+use gosub_rendering::render_tree::{RenderNodeData, RenderTree, RenderTreeNode};
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::{CssProperty, CssPropertyMap, CssSystem};
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::html5::Html5Parser;
+use gosub_shared::traits::node::{ElementDataType, Node};
 use gosub_shared::types::Result;
-use gosub_styling::render_tree::{RenderNodeData, RenderTree, RenderTreeNode};
 
 use crate::debug::scale::px_scale;
 use crate::draw::img::request_img;
@@ -25,14 +28,15 @@ use crate::render_tree::{load_html_rendertree, TreeDrawer};
 
 mod img;
 
-pub trait SceneDrawer<B: RenderBackend, L: Layouter, LT: LayoutTree<L>> {
+pub trait SceneDrawer<B: RenderBackend, L: Layouter, LT: LayoutTree<L>, D: Document<C>, C: CssSystem> {
     fn draw(&mut self, backend: &mut B, data: &mut B::WindowData<'_>, size: SizeU32) -> bool;
     fn mouse_move(&mut self, backend: &mut B, x: FP, y: FP) -> bool;
 
     fn scroll(&mut self, point: Point);
-    fn from_url(url: Url, layouter: L, debug: bool) -> Result<Self>
+    fn from_url<P>(url: Url, layouter: L, debug: bool) -> Result<Self>
     where
-        Self: Sized;
+        Self: Sized,
+        P: Html5Parser<C, Document = D>;
 
     fn clear_buffers(&mut self);
     fn toggle_debug(&mut self);
@@ -52,10 +56,10 @@ const DEBUG_BORDER_COLOR: (u8, u8, u8) = (255, 72, 72); //rgb(255, 72, 72)
 
 type Point = gosub_shared::types::Point<FP>;
 
-impl<B: RenderBackend, L: Layouter> SceneDrawer<B, L, RenderTree<L>> for TreeDrawer<B, L>
+impl<B: RenderBackend, L: Layouter, D: Document<C>, C: CssSystem> SceneDrawer<B, L, RenderTree<L, D, C>, D, C>
+    for TreeDrawer<B, L, D, C>
 where
-    <<B as RenderBackend>::Text as Text>::Font:
-        From<<<L as Layouter>::TextLayout as TextLayout>::Font>,
+    <<B as RenderBackend>::Text as Text>::Font: From<<<L as Layouter>::TextLayout as TextLayout>::Font>,
 {
     fn draw(&mut self, backend: &mut B, data: &mut B::WindowData<'_>, size: SizeU32) -> bool {
         if !self.dirty && self.size == Some(size) {
@@ -129,11 +133,7 @@ where
                 .map(|x| Point::new(x.tx(), x.ty()))
                 .unwrap_or(Point::ZERO);
 
-            let scale = px_scale::<B>(
-                size,
-                pos,
-                self.size.as_ref().map(|x| x.width as f32).unwrap_or(0.0),
-            );
+            let scale = px_scale::<B>(size, pos, self.size.as_ref().map(|x| x.width as f32).unwrap_or(0.0));
 
             backend.apply_scene(data, &scale, None);
         }
@@ -148,16 +148,8 @@ where
     }
 
     fn mouse_move(&mut self, _backend: &mut B, x: FP, y: FP) -> bool {
-        let x = x - self
-            .scene_transform
-            .clone()
-            .unwrap_or(B::Transform::IDENTITY)
-            .tx();
-        let y = y - self
-            .scene_transform
-            .clone()
-            .unwrap_or(B::Transform::IDENTITY)
-            .ty();
+        let x = x - self.scene_transform.clone().unwrap_or(B::Transform::IDENTITY).tx();
+        let y = y - self.scene_transform.clone().unwrap_or(B::Transform::IDENTITY).ty();
 
         if let Some(e) = self.position.find(x, y) {
             if self.last_hover != Some(e) {
@@ -172,10 +164,7 @@ where
     }
 
     fn scroll(&mut self, point: Point) {
-        let mut transform = self
-            .scene_transform
-            .take()
-            .unwrap_or(B::Transform::IDENTITY);
+        let mut transform = self.scene_transform.take().unwrap_or(B::Transform::IDENTITY);
 
         let x = transform.tx() + point.x;
         let y = transform.ty() + point.y;
@@ -196,8 +185,11 @@ where
         self.dirty = true;
     }
 
-    fn from_url(url: Url, layouter: L, debug: bool) -> Result<Self> {
-        let rt = load_html_rendertree(url.clone())?;
+    fn from_url<P>(url: Url, layouter: L, debug: bool) -> Result<Self>
+    where
+        P: Html5Parser<C, Document = D>,
+    {
+        let rt = load_html_rendertree::<L, P, C>(url.clone())?;
 
         Ok(Self::new(rt, layouter, url, debug))
     }
@@ -236,31 +228,26 @@ where
     }
 }
 
-struct Drawer<'s, 't, B: RenderBackend, L: Layouter> {
+struct Drawer<'s, 't, B: RenderBackend, L: Layouter, D: Document<C>, C: CssSystem> {
     scene: &'s mut B::Scene,
-    drawer: &'t mut TreeDrawer<B, L>,
+    drawer: &'t mut TreeDrawer<B, L, D, C>,
     svg: B::SVGRenderer,
 }
 
-impl<B: RenderBackend, L: Layouter> Drawer<'_, '_, B, L>
+impl<B: RenderBackend, L: Layouter, D: Document<C>, C: CssSystem> Drawer<'_, '_, B, L, D, C>
 where
-    <<B as RenderBackend>::Text as Text>::Font:
-        From<<<L as Layouter>::TextLayout as TextLayout>::Font>,
+    <<B as RenderBackend>::Text as Text>::Font: From<<<L as Layouter>::TextLayout as TextLayout>::Font>,
 {
     pub(crate) fn render(&mut self, size: SizeU32) {
         let root = self.drawer.tree.root;
-        if let Err(e) = self
-            .drawer
-            .layouter
-            .layout(&mut self.drawer.tree, root, size)
-        {
+        if let Err(e) = self.drawer.layouter.layout(&mut self.drawer.tree, root, size) {
             eprintln!("Failed to compute layout: {:?}", e);
             return;
         }
 
         // print_tree(&self.taffy, self.root, &self.style);
 
-        self.drawer.position = PositionTree::from_tree::<B, L>(&self.drawer.tree);
+        self.drawer.position = PositionTree::from_tree::<B, L, D, C>(&self.drawer.tree);
 
         self.render_node_with_children(self.drawer.tree.root, Point::ZERO);
     }
@@ -282,56 +269,64 @@ where
     }
 
     fn render_node(&mut self, id: NodeId, pos: &mut Point) -> anyhow::Result<()> {
-        let mut needs_redraw = false;
-
-        let node = self
-            .drawer
-            .tree
-            .get_node_mut(id)
-            .ok_or(anyhow!("Node {id} not found"))?;
+        let node = self.drawer.tree.get_node(id).ok_or(anyhow!("Node {id} not found"))?;
 
         let p = node.layout.rel_pos();
         pos.x += p.x as FP;
         pos.y += p.y as FP;
 
-        let (border_radius, redraw) =
-            render_bg::<B, L>(node, self.scene, pos, &mut self.svg, &self.drawer.fetcher);
+        let (border_radius, new_size) =
+            render_bg::<B, L, C>(node, self.scene, pos, &mut self.svg, &self.drawer.fetcher);
 
-        needs_redraw |= redraw;
+        let mut size_change = new_size;
 
-        if let RenderNodeData::Element(element) = &node.data {
-            if element.name() == "img" {
-                let src = element
-                    .attributes
-                    .get("src")
-                    .ok_or(anyhow!("Image element has no src attribute"))?;
+        if node.name == "img" {
+            let Some(handle) = self.drawer.tree.handle.as_ref() else {
+                return Err(anyhow!("No document handle"));
+            };
 
-                let url = src.as_str();
+            let doc = handle.get();
 
-                let size = node.layout.size_or().map(|x| x.u32());
+            let dom_node = doc.node_by_id(id).ok_or(anyhow!("Node not found"))?;
 
-                let img = request_img(&self.drawer.fetcher, &mut self.svg, url, size)?;
+            let element = dom_node.get_element_data().ok_or(anyhow!("Node is not an element"))?;
 
-                if size.is_none() {
-                    node.layout.set_size_and_content(img.size());
-                    needs_redraw |= true;
-                }
+            let src = element
+                .attribute("src")
+                .ok_or(anyhow!("Image element has no src attribute"))?;
+
+            let url = src.as_str();
 
-                let fit = element
-                    .attributes
-                    .get("object-fit")
-                    .map(|prop| prop.as_str())
-                    .unwrap_or("contain");
+            let size = node.layout.size_or().map(|x| x.u32());
 
-                let size = size.unwrap_or(img.size()).f32();
+            let img = request_img(&self.drawer.fetcher, &mut self.svg, url, size)?;
 
-                render_image::<B>(img, self.scene, *pos, size, border_radius, fit)?;
+            if size.is_none() {
+                size_change = Some(img.size());
             }
+
+            let fit = node
+                .properties
+                .get("object-fit")
+                .and_then(|prop| prop.as_string())
+                .unwrap_or("contain");
+
+            let size = size.unwrap_or(img.size()).f32();
+
+            render_image::<B>(img, self.scene, *pos, size, border_radius, fit)?;
         }
 
-        render_text::<B, L>(node, self.scene, pos);
+        render_text::<B, L, C>(node, self.scene, pos);
+
+        if let Some(new) = size_change {
+            let node = self
+                .drawer
+                .tree
+                .get_node_mut(id)
+                .ok_or(anyhow!("Node {id} not found"))?;
+
+            node.layout.set_size(new);
 
-        if needs_redraw {
             self.drawer.set_needs_redraw()
         }
 
@@ -339,13 +334,12 @@ where
     }
 }
 
-fn render_text<B: RenderBackend, L: Layouter>(
-    node: &mut RenderTreeNode<L>,
+fn render_text<B: RenderBackend, L: Layouter, C: CssSystem>(
+    node: &RenderTreeNode<L, C>,
     scene: &mut B::Scene,
     pos: &Point,
 ) where
-    <<B as RenderBackend>::Text as Text>::Font:
-        From<<<L as Layouter>::TextLayout as TextLayout>::Font>,
+    <<B as RenderBackend>::Text as Text>::Font: From<<<L as Layouter>::TextLayout as TextLayout>::Font>,
 {
     // if u64::from(node.id) < 204 && u64::from(node.id) > 202 {
     //     return;
@@ -358,19 +352,11 @@ fn render_text<B: RenderBackend, L: Layouter>(
     let color = node
         .properties
         .get("color")
-        .and_then(|prop| {
-            prop.compute_value();
-
-            match &prop.actual {
-                CssValue::Color(color) => Some(*color),
-                CssValue::String(color) => Some(RgbColor::from(color.as_str())),
-                _ => None,
-            }
-        })
-        .map(|color| Color::rgba(color.r as u8, color.g as u8, color.b as u8, color.a as u8))
+        .and_then(|prop| prop.parse_color())
+        .map(|color| Color::rgba(color.0 as u8, color.1 as u8, color.2 as u8, color.3 as u8))
         .unwrap_or(Color::BLACK);
 
-    if let RenderNodeData::Text(ref text) = node.data {
+    if let RenderNodeData::Text(text) = &node.data {
         let Some(layout) = text.layout.as_ref() else {
             warn!("No layout for text node");
             return;
@@ -380,12 +366,7 @@ fn render_text<B: RenderBackend, L: Layouter>(
 
         let size = node.layout.size();
 
-        let rect = Rect::new(
-            pos.x as FP,
-            pos.y as FP,
-            size.width as FP,
-            size.height as FP,
-        );
+        let rect = Rect::new(pos.x as FP, pos.y as FP, size.width as FP, size.height as FP);
 
         let render_text = RenderText {
             text,
@@ -399,61 +380,41 @@ fn render_text<B: RenderBackend, L: Layouter>(
     }
 }
 
-fn render_bg<B: RenderBackend, L: Layouter>(
-    node: &mut RenderTreeNode<L>,
+fn render_bg<B: RenderBackend, L: Layouter, C: CssSystem>(
+    node: &RenderTreeNode<L, C>,
     scene: &mut B::Scene,
     pos: &Point,
     svg: &mut B::SVGRenderer,
     fetcher: &Fetcher,
-) -> ((FP, FP, FP, FP), bool) {
+) -> ((FP, FP, FP, FP), Option<SizeU32>) {
     let bg_color = node
         .properties
         .get("background-color")
-        .and_then(|prop| {
-            prop.compute_value();
-
-            match &prop.actual {
-                CssValue::Color(color) => Some(*color),
-                CssValue::String(color) => Some(RgbColor::from(color.as_str())),
-                _ => None,
-            }
-        })
-        .map(|color| Color::rgba(color.r as u8, color.g as u8, color.b as u8, color.a as u8));
+        .and_then(|prop| prop.parse_color())
+        .map(|color| Color::rgba(color.0 as u8, color.1 as u8, color.2 as u8, color.3 as u8));
 
     let border_radius_left = node
         .properties
         .get("border-radius-left")
-        .map(|prop| {
-            prop.compute_value();
-            prop.actual.unit_to_px() as f64
-        })
+        .map(|prop| prop.unit_to_px() as f64)
         .unwrap_or(0.0);
 
     let border_radius_right = node
         .properties
         .get("border-radius-right")
-        .map(|prop| {
-            prop.compute_value();
-            prop.actual.unit_to_px() as f64
-        })
+        .map(|prop| prop.unit_to_px() as f64)
         .unwrap_or(0.0);
 
     let border_radius_top = node
         .properties
         .get("border-radius-top")
-        .map(|prop| {
-            prop.compute_value();
-            prop.actual.unit_to_px() as f64
-        })
+        .map(|prop| prop.unit_to_px() as f64)
         .unwrap_or(0.0);
 
     let border_radius_bottom = node
         .properties
         .get("border-radius-bottom")
-        .map(|prop| {
-            prop.compute_value();
-            prop.actual.unit_to_px() as f64
-        })
+        .map(|prop| prop.unit_to_px() as f64)
         .unwrap_or(0.0);
 
     let border_radius = (
@@ -463,17 +424,12 @@ fn render_bg<B: RenderBackend, L: Layouter>(
         border_radius_left as FP,
     );
 
-    let border = get_border::<B, L>(node).map(|border| RenderBorder::new(border));
+    let border = get_border::<B, L, C>(node).map(|border| RenderBorder::new(border));
 
     if let Some(bg_color) = bg_color {
         let size = node.layout.size();
 
-        let rect = Rect::new(
-            pos.x as FP,
-            pos.y as FP,
-            size.width as FP,
-            size.height as FP,
-        );
+        let rect = Rect::new(pos.x as FP, pos.y as FP, size.width as FP, size.height as FP);
 
         let rect = RenderRect {
             rect,
@@ -488,12 +444,7 @@ fn render_bg<B: RenderBackend, L: Layouter>(
     } else if let Some(border) = border {
         let size = node.layout.size();
 
-        let rect = Rect::new(
-            pos.x as FP,
-            pos.y as FP,
-            size.width as FP,
-            size.height as FP,
-        );
+        let rect = Rect::new(pos.x as FP, pos.y as FP, size.width as FP, size.height as FP);
 
         let rect = RenderRect {
             rect,
@@ -507,16 +458,12 @@ fn render_bg<B: RenderBackend, L: Layouter>(
         scene.draw_rect(&rect);
     }
 
-    let background_image = node.properties.get("background-image").and_then(|prop| {
-        prop.compute_value();
-
-        match &prop.actual {
-            CssValue::String(url) => Some(url.as_str()),
-            _ => None,
-        }
-    });
+    let background_image = node
+        .properties
+        .get("background-image")
+        .and_then(|prop| prop.as_string());
 
-    let mut redraw = false;
+    let mut img_size = None;
 
     if let Some(url) = background_image {
         let size = node.layout.size_or().map(|x| x.u32());
@@ -525,23 +472,20 @@ fn render_bg<B: RenderBackend, L: Layouter>(
             Ok(img) => img,
             Err(e) => {
                 eprintln!("Error loading image: {:?}", e);
-                return (border_radius, false);
+                return (border_radius, None);
             }
         };
 
         if size.is_none() {
-            node.layout.set_size_and_content(img.size());
-
-            redraw = true;
+            img_size = Some(img.size());
         }
 
-        let _ = render_image::<B>(img, scene, *pos, node.layout.size(), border_radius, "fill")
-            .map_err(|e| {
-                eprintln!("Error rendering image: {:?}", e);
-            });
+        let _ = render_image::<B>(img, scene, *pos, node.layout.size(), border_radius, "fill").map_err(|e| {
+            eprintln!("Error rendering image: {:?}", e);
+        });
     }
 
-    (border_radius, redraw)
+    (border_radius, img_size)
 }
 
 enum Side {
@@ -707,11 +651,11 @@ pub fn print_tree<B: RenderBackend, L: Layouter>(
 }
 */
 
-fn get_border<B: RenderBackend, L: Layouter>(node: &mut RenderTreeNode<L>) -> Option<B::Border> {
-    let left = get_border_side::<B, L>(node, Side::Left);
-    let right = get_border_side::<B, L>(node, Side::Right);
-    let top = get_border_side::<B, L>(node, Side::Top);
-    let bottom = get_border_side::<B, L>(node, Side::Bottom);
+fn get_border<B: RenderBackend, L: Layouter, C: CssSystem>(node: &RenderTreeNode<L, C>) -> Option<B::Border> {
+    let left = get_border_side::<B, L, C>(node, Side::Left);
+    let right = get_border_side::<B, L, C>(node, Side::Right);
+    let top = get_border_side::<B, L, C>(node, Side::Top);
+    let bottom = get_border_side::<B, L, C>(node, Side::Bottom);
 
     if left.is_none() && right.is_none() && top.is_none() && bottom.is_none() {
         return None;
@@ -738,53 +682,34 @@ fn get_border<B: RenderBackend, L: Layouter>(node: &mut RenderTreeNode<L>) -> Op
     Some(border)
 }
 
-fn get_border_side<B: RenderBackend, L: Layouter>(
-    node: &mut RenderTreeNode<L>,
+fn get_border_side<B: RenderBackend, L: Layouter, C: CssSystem>(
+    node: &RenderTreeNode<L, C>,
     side: Side,
 ) -> Option<B::BorderSide> {
     let width = node
         .properties
         .get(&format!("border-{}-width", side.to_str()))
-        .map(|prop| {
-            prop.compute_value();
-            prop.actual.unit_to_px()
-        })?;
+        .map(|prop| prop.unit_to_px())?;
 
     let color = node
         .properties
         .get(&format!("border-{}-color", side.to_str()))
-        .and_then(|prop| {
-            prop.compute_value();
-
-            match &prop.actual {
-                CssValue::Color(color) => Some(*color),
-                CssValue::String(color) => Some(RgbColor::from(color.as_str())),
-                _ => None,
-            }
-        })?;
+        .and_then(|prop| prop.parse_color())?;
 
     let style = node
         .properties
         .get(&format!("border-{}-style", side.to_str()))
-        .map(|prop| {
-            prop.compute_value();
-            prop.actual.to_string()
-        })
-        .unwrap_or("none".to_string());
+        .and_then(|prop| prop.as_string())
+        .unwrap_or("none");
 
-    let style = BorderStyle::from_str(&style);
+    let style = BorderStyle::from_str(style);
 
-    let brush = Brush::color(Color::rgba(
-        color.r as u8,
-        color.g as u8,
-        color.b as u8,
-        color.a as u8,
-    ));
+    let brush = Brush::color(Color::rgba(color.0 as u8, color.1 as u8, color.2 as u8, color.3 as u8));
 
     Some(BorderSide::new(width as FP, style, brush))
 }
 
-impl<B: RenderBackend, L: Layouter> TreeDrawer<B, L> {
+impl<B: RenderBackend, L: Layouter, D: Document<C>, C: CssSystem> TreeDrawer<B, L, D, C> {
     fn debug_annotate(&mut self, e: NodeId) -> bool {
         let Some(node) = self.tree.get_node(e) else {
             return false;
@@ -834,11 +759,7 @@ impl<B: RenderBackend, L: Layouter> TreeDrawer<B, L> {
             padding_brush.clone(),
         ));
 
-        border.bottom(BorderSide::new(
-            padding.y2 as FP,
-            BorderStyle::Solid,
-            padding_brush,
-        ));
+        border.bottom(BorderSide::new(padding.y2 as FP, BorderStyle::Solid, padding_brush));
 
         let padding_border = RenderBorder::new(border);
 
@@ -873,11 +794,7 @@ impl<B: RenderBackend, L: Layouter> TreeDrawer<B, L> {
             border_brush.clone(),
         ));
 
-        border_border.bottom(BorderSide::new(
-            border_size.y2 as FP,
-            BorderStyle::Solid,
-            border_brush,
-        ));
+        border_border.bottom(BorderSide::new(border_size.y2 as FP, BorderStyle::Solid, border_brush));
 
         let border_border = RenderBorder::new(border_border);
 
diff --git a/crates/gosub_renderer/src/position.rs b/crates/gosub_renderer/src/position.rs
new file mode 100644
index 000000000..c17322e08
--- /dev/null
+++ b/crates/gosub_renderer/src/position.rs
@@ -0,0 +1,174 @@
+use std::cmp::Ordering;
+use std::marker::PhantomData;
+
+use rstar::{RTree, RTreeObject, AABB};
+
+use gosub_render_backend::layout::Layouter;
+use gosub_render_backend::RenderBackend;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+
+#[derive(Debug)]
+pub struct Element {
+    id: NodeId,
+    x: f32,
+    y: f32,
+    width: f32,
+    height: f32,
+    radius: Option<(f32, f32, f32, f32)>,
+    z_index: i32,
+}
+
+impl RTreeObject for Element {
+    type Envelope = AABB<(f32, f32)>;
+    fn envelope(&self) -> Self::Envelope {
+        let lower = (self.x, self.y);
+        let upper = (self.x + self.width, self.y + self.height);
+        AABB::from_corners(lower, upper)
+    }
+}
+
+#[derive(Default)]
+pub struct PositionTree<D, C> {
+    tree: RTree<Element>,
+    phantom_data_d: PhantomData<D>,
+    phantom_data_c: PhantomData<C>,
+}
+
+impl<D: Document<C>, C: CssSystem> PositionTree<D, C> {
+    pub fn from_tree<B: RenderBackend, L: Layouter>(from_tree: &MacOSRenderTree<D, C>) -> Self {
+        let mut tree = RTree::new();
+
+        //TODO: we somehow need to get the border radius and a potential stacking context of the element here
+
+        Self::add_node_to_tree(from_tree, from_tree.root, 0, &mut tree, (0.0, 0.0));
+
+        Self { tree, phantom_data_d: PhantomData, phantom_data_c: PhantomData }
+    }
+
+    fn add_node_to_tree<L: Layouter>(
+        from_tree: &MacOSRenderTree<D, C>,
+        id: NodeId,
+        z_index: i32,
+        tree: &mut RTree<Element>,
+        mut pos: (f32, f32),
+    ) {
+        let Some(layout) = from_tree.get_layout(id) else {
+            return;
+        };
+
+        let p = layout.rel_pos();
+
+        pos.0 += p.x;
+        pos.1 += p.y;
+
+        let size = layout.size();
+        let element = Element {
+            id,
+            x: pos.0,
+            y: pos.1,
+            width: size.width,
+            height: size.height,
+            radius: None, //TODO: border radius
+            z_index,
+        };
+
+        tree.insert(element);
+
+        for child in from_tree.children(id).unwrap_or_default() {
+            Self::add_node_to_tree(from_tree, child, z_index + 1, tree, pos);
+        }
+    }
+
+    pub fn find(&self, x: f32, y: f32) -> Option<NodeId> {
+        let envelope = AABB::from_point((x, y));
+
+        self.tree
+            .locate_in_envelope_intersecting(&envelope)
+            .filter(|e| {
+                let Some(radi) = e.radius else {
+                    return true;
+                };
+
+                let middle = (e.x + e.width / 2.0, e.y + e.height / 2.0);
+
+                match middle.0.total_cmp(&x) {
+                    Ordering::Equal => true,
+                    Ordering::Less => {
+                        match middle.1.total_cmp(&y) {
+                            Ordering::Equal => true,
+                            // top left
+                            Ordering::Less => {
+                                if (e.x + radi.0) > x && (e.y + radi.0) > y {
+                                    return is_point_in_circle(
+                                        (e.x + radi.0, e.y + radi.0),
+                                        radi.0,
+                                        (x, y),
+                                    );
+                                }
+                                false
+                            }
+                            // top right
+                            Ordering::Greater => {
+                                if (e.x + e.width - radi.1) < x && (e.y + radi.1) < y {
+                                    return is_point_in_circle(
+                                        (e.x + radi.1, e.y + radi.1),
+                                        radi.1,
+                                        (x, y),
+                                    );
+                                }
+
+                                false
+                            }
+                        }
+                    }
+                    Ordering::Greater => {
+                        match middle.1.total_cmp(&y) {
+                            Ordering::Equal => true,
+                            // bottom left
+                            Ordering::Less => {
+                                if (e.x + radi.2) > x && (e.y + e.height - radi.2) < y {
+                                    return is_point_in_circle(
+                                        (e.x + radi.2, e.y + e.height - radi.2),
+                                        radi.2,
+                                        (x, y),
+                                    );
+                                }
+                                false
+                            }
+                            // bottom right
+                            Ordering::Greater => {
+                                if (e.x + e.width - radi.3) < x && (e.y + e.height - radi.3) < y {
+                                    return is_point_in_circle(
+                                        (e.x + radi.3, e.y + radi.3),
+                                        radi.3,
+                                        (x, y),
+                                    );
+                                }
+                                false
+                            }
+                        }
+                    }
+                }
+            })
+            .reduce(|a, b| if a.z_index >= b.z_index { a } else { b }) // >= because we just hope that the last-drawn element is last in the list
+            .map(|e| e.id)
+    }
+
+    pub fn get_node(&self, id: NodeId) -> Option<&Element> {
+        self.tree.iter().find(|e| e.id == id)
+    }
+
+    pub fn position(&self, id: NodeId) -> Option<(f32, f32)> {
+        self.get_node(id).map(|e| (e.x, e.y))
+    }
+}
+
+fn is_point_in_circle(circle_center: (f32, f32), circle_radius: f32, point: (f32, f32)) -> bool {
+    let dx = circle_center.0 - point.0;
+    let dy = circle_center.1 - point.1;
+    let distance = (dx * dx + dy * dy).sqrt();
+
+    distance <= circle_radius
+}
diff --git a/crates/gosub_renderer/src/render_tree.rs b/crates/gosub_renderer/src/render_tree.rs
index 5480cb4cd..48e45b24f 100644
--- a/crates/gosub_renderer/src/render_tree.rs
+++ b/crates/gosub_renderer/src/render_tree.rs
@@ -1,24 +1,24 @@
 use std::fs;
 
 use anyhow::bail;
-use url::Url;
-
-use gosub_html5::node::NodeId;
-use gosub_html5::parser::document::{Document, DocumentBuilder};
-use gosub_html5::parser::Html5Parser;
 use gosub_net::http::fetcher::Fetcher;
 use gosub_net::http::ureq;
 use gosub_render_backend::geo::SizeU32;
 use gosub_render_backend::layout::Layouter;
 use gosub_render_backend::RenderBackend;
 use gosub_rendering::position::PositionTree;
+use gosub_rendering::render_tree::{generate_render_tree, RenderTree};
 use gosub_shared::byte_stream::{ByteStream, Encoding};
-use gosub_styling::render_tree::{generate_render_tree, RenderNodeData, RenderTree};
-use gosub_styling::styling::CssProperties;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::{Document, DocumentBuilder};
+use gosub_shared::traits::html5::Html5Parser;
+use url::Url;
 
-pub struct TreeDrawer<B: RenderBackend, L: Layouter> {
+pub struct TreeDrawer<B: RenderBackend, L: Layouter, D: Document<C>, C: CssSystem> {
     pub(crate) fetcher: Fetcher,
-    pub(crate) tree: RenderTree<L>,
+    pub(crate) tree: RenderTree<L, D, C>,
     pub(crate) layouter: L,
     pub(crate) size: Option<SizeU32>,
     pub(crate) position: PositionTree,
@@ -31,8 +31,8 @@ pub struct TreeDrawer<B: RenderBackend, L: Layouter> {
     pub(crate) scene_transform: Option<B::Transform>,
 }
 
-impl<B: RenderBackend, L: Layouter> TreeDrawer<B, L> {
-    pub fn new(tree: RenderTree<L>, layouter: L, url: Url, debug: bool) -> Self {
+impl<B: RenderBackend, L: Layouter, D: Document<C>, C: CssSystem> TreeDrawer<B, L, D, C> {
+    pub fn new(tree: RenderTree<L, D, C>, layouter: L, url: Url, debug: bool) -> Self {
         Self {
             tree,
             layouter,
@@ -50,27 +50,24 @@ impl<B: RenderBackend, L: Layouter> TreeDrawer<B, L> {
     }
 }
 
-pub struct RenderTreeNode<L: Layouter> {
-    pub parent: Option<NodeId>,
-    pub children: Vec<NodeId>,
-    pub layout: i32, //TODO
-    pub name: String,
-    pub properties: CssProperties,
-    pub namespace: Option<String>,
-    pub data: RenderNodeData<L>,
-}
+// pub struct RenderTreeNode<L: Layouter> {
+//     pub parent: Option<NodeId>,
+//     pub children: Vec<NodeId>,
+//     pub layout: i32, //TODO
+//     pub name: String,
+//     pub properties: CssProperties,
+//     pub namespace: Option<String>,
+//     pub data: RenderNodeData<L>,
+// }
 
-pub(crate) fn load_html_rendertree<L: Layouter>(
+pub(crate) fn load_html_rendertree<L: Layouter, P: Html5Parser<C>, C: CssSystem>(
     url: Url,
-) -> gosub_shared::types::Result<RenderTree<L>> {
+) -> gosub_shared::types::Result<RenderTree<L, P::Document, C>> {
     let html = if url.scheme() == "http" || url.scheme() == "https" {
         // Fetch the html from the url
         let response = ureq::get(url.as_ref()).call()?;
         if response.status() != 200 {
-            bail!(format!(
-                "Could not get url. Status code {}",
-                response.status()
-            ));
+            bail!(format!("Could not get url. Status code {}", response.status()));
         }
         response.into_string()?
     } else if url.scheme() == "file" {
@@ -83,19 +80,18 @@ pub(crate) fn load_html_rendertree<L: Layouter>(
     stream.read_from_str(&html, Some(Encoding::UTF8));
     stream.close();
 
-    let mut doc_handle = DocumentBuilder::new_document(Some(url));
-    let parse_errors =
-        Html5Parser::parse_document(&mut stream, Document::clone(&doc_handle), None)?;
+    let mut doc_handle = <P::Document as Document<C>>::Builder::new_document(Some(url));
+    let parse_errors = P::parse(&mut stream, DocumentHandle::clone(&doc_handle), None)?;
 
     for error in parse_errors {
         eprintln!("Parse error: {:?}", error);
     }
 
-    let mut doc = doc_handle.get_mut();
-    doc.stylesheets
-        .push(gosub_styling::load_default_useragent_stylesheet()?);
+    _ = doc_handle.get_mut();
+
+    // doc.add_stylesheet(C::load_default_useragent_stylesheet()?);
 
-    drop(doc);
+    // drop(doc);
 
-    generate_render_tree(Document::clone(&doc_handle))
+    generate_render_tree(DocumentHandle::clone(&doc_handle))
 }
diff --git a/crates/gosub_shared/Cargo.toml b/crates/gosub_shared/Cargo.toml
index e0a8389d8..298785cf9 100644
--- a/crates/gosub_shared/Cargo.toml
+++ b/crates/gosub_shared/Cargo.toml
@@ -15,6 +15,7 @@ uuid = { version = "1.10.0", features = ["v4"] }
 rand = "0.9.0-alpha.1"
 chardetng = "0.1.17"
 encoding_rs = "0.8.34"
+derive_more = "0.99"
 
 
 [target.'cfg(target_arch = "wasm32")'.dependencies]
diff --git a/crates/gosub_shared/src/byte_stream.rs b/crates/gosub_shared/src/byte_stream.rs
index fc92aeee7..c318debad 100644
--- a/crates/gosub_shared/src/byte_stream.rs
+++ b/crates/gosub_shared/src/byte_stream.rs
@@ -1,7 +1,7 @@
 use std::cell::RefCell;
 use std::char::REPLACEMENT_CHARACTER;
 use std::collections::HashMap;
-use std::fmt::{Debug, Formatter};
+use std::fmt::{Debug, Display, Formatter};
 use std::io::Read;
 use std::{fmt, io};
 
@@ -249,10 +249,7 @@ impl Stream for ByteStream {
         for _ in 0..n {
             self.move_back(1);
 
-            if self.config.cr_lf_as_one
-                && self.read() == Ch(CHAR_CR)
-                && self.look_ahead(1) == Ch(CHAR_LF)
-            {
+            if self.config.cr_lf_as_one && self.read() == Ch(CHAR_CR) && self.look_ahead(1) == Ch(CHAR_LF) {
                 self.move_back(1);
             }
         }
@@ -363,10 +360,7 @@ impl ByteStream {
 
                 let ch = match width {
                     1 => first_byte as u32,
-                    2 => {
-                        ((first_byte as u32 & 0x1F) << 6)
-                            | (self.buffer[*buf_pos + 1] as u32 & 0x3F)
-                    }
+                    2 => ((first_byte as u32 & 0x1F) << 6) | (self.buffer[*buf_pos + 1] as u32 & 0x3F),
                     3 => {
                         ((first_byte as u32 & 0x0F) << 12)
                             | ((self.buffer[*buf_pos + 1] as u32 & 0x3F) << 6)
@@ -384,16 +378,12 @@ impl ByteStream {
                 if ch > 0x10FFFF || (ch > 0xD800 && ch <= 0xDFFF) {
                     (Surrogate(ch as u16), width)
                 } else {
-                    (
-                        char::from_u32(ch).map_or(Ch(REPLACEMENT_CHARACTER), Ch),
-                        width,
-                    )
+                    (char::from_u32(ch).map_or(Ch(REPLACEMENT_CHARACTER), Ch), width)
                 }
             }
             Encoding::UTF16LE => {
                 if *buf_pos + 1 < self.buffer.len() {
-                    let code_unit =
-                        u16::from_le_bytes([self.buffer[*buf_pos], self.buffer[*buf_pos + 1]]);
+                    let code_unit = u16::from_le_bytes([self.buffer[*buf_pos], self.buffer[*buf_pos + 1]]);
                     (
                         char::from_u32(u32::from(code_unit)).map_or(Ch(REPLACEMENT_CHARACTER), Ch),
                         2,
@@ -404,8 +394,7 @@ impl ByteStream {
             }
             Encoding::UTF16BE => {
                 if *buf_pos + 1 < self.buffer.len() {
-                    let code_unit =
-                        u16::from_be_bytes([self.buffer[*buf_pos], self.buffer[*buf_pos + 1]]);
+                    let code_unit = u16::from_be_bytes([self.buffer[*buf_pos], self.buffer[*buf_pos + 1]]);
                     (
                         char::from_u32(u32::from(code_unit)).map_or(Ch(REPLACEMENT_CHARACTER), Ch),
                         2,
@@ -541,7 +530,7 @@ impl ByteStream {
 }
 
 /// Location holds the start position of the given element in the data source
-#[derive(Clone, PartialEq)]
+#[derive(Clone, PartialEq, Copy)]
 pub struct Location {
     /// Line number, starting with 1
     pub line: usize,
@@ -561,11 +550,13 @@ impl Default for Location {
 impl Location {
     /// Create a new Location
     pub fn new(line: usize, column: usize, offset: usize) -> Self {
-        Self {
-            line,
-            column,
-            offset,
-        }
+        Self { line, column, offset }
+    }
+}
+
+impl Display for Location {
+    fn fmt(&self, f: &mut Formatter<'_>) -> fmt::Result {
+        write!(f, "({}:{})", self.line, self.column)
     }
 }
 
@@ -916,19 +907,16 @@ mod test {
 
         // Quizdeltagerne spiste jordbær med fløde, mens cirkusklovnen Wolther spillede på xylofon.
         let _ = stream.read_from_bytes(&[
-            0x00, 0x51, 0x00, 0x75, 0x00, 0x69, 0x00, 0x7a, 0x00, 0x64, 0x00, 0x65, 0x00, 0x6c,
-            0x00, 0x74, 0x00, 0x61, 0x00, 0x67, 0x00, 0x65, 0x00, 0x72, 0x00, 0x6e, 0x00, 0x65,
-            0x00, 0x20, 0x00, 0x73, 0x00, 0x70, 0x00, 0x69, 0x00, 0x73, 0x00, 0x74, 0x00, 0x65,
-            0x00, 0x20, 0x00, 0x6a, 0x00, 0x6f, 0x00, 0x72, 0x00, 0x64, 0x00, 0x62, 0x00, 0xe6,
-            0x00, 0x72, 0x00, 0x20, 0x00, 0x6d, 0x00, 0x65, 0x00, 0x64, 0x00, 0x20, 0x00, 0x66,
-            0x00, 0x6c, 0x00, 0xf8, 0x00, 0x64, 0x00, 0x65, 0x00, 0x2c, 0x00, 0x20, 0x00, 0x6d,
-            0x00, 0x65, 0x00, 0x6e, 0x00, 0x73, 0x00, 0x20, 0x00, 0x63, 0x00, 0x69, 0x00, 0x72,
-            0x00, 0x6b, 0x00, 0x75, 0x00, 0x73, 0x00, 0x6b, 0x00, 0x6c, 0x00, 0x6f, 0x00, 0x76,
-            0x00, 0x6e, 0x00, 0x65, 0x00, 0x6e, 0x00, 0x20, 0x00, 0x57, 0x00, 0x6f, 0x00, 0x6c,
-            0x00, 0x74, 0x00, 0x68, 0x00, 0x65, 0x00, 0x72, 0x00, 0x20, 0x00, 0x73, 0x00, 0x70,
-            0x00, 0x69, 0x00, 0x6c, 0x00, 0x6c, 0x00, 0x65, 0x00, 0x64, 0x00, 0x65, 0x00, 0x20,
-            0x00, 0x70, 0x00, 0xe5, 0x00, 0x20, 0x00, 0x78, 0x00, 0x79, 0x00, 0x6c, 0x00, 0x6f,
-            0x00, 0x66, 0x00, 0x6f, 0x00, 0x6e, 0x00, 0x2e,
+            0x00, 0x51, 0x00, 0x75, 0x00, 0x69, 0x00, 0x7a, 0x00, 0x64, 0x00, 0x65, 0x00, 0x6c, 0x00, 0x74, 0x00, 0x61,
+            0x00, 0x67, 0x00, 0x65, 0x00, 0x72, 0x00, 0x6e, 0x00, 0x65, 0x00, 0x20, 0x00, 0x73, 0x00, 0x70, 0x00, 0x69,
+            0x00, 0x73, 0x00, 0x74, 0x00, 0x65, 0x00, 0x20, 0x00, 0x6a, 0x00, 0x6f, 0x00, 0x72, 0x00, 0x64, 0x00, 0x62,
+            0x00, 0xe6, 0x00, 0x72, 0x00, 0x20, 0x00, 0x6d, 0x00, 0x65, 0x00, 0x64, 0x00, 0x20, 0x00, 0x66, 0x00, 0x6c,
+            0x00, 0xf8, 0x00, 0x64, 0x00, 0x65, 0x00, 0x2c, 0x00, 0x20, 0x00, 0x6d, 0x00, 0x65, 0x00, 0x6e, 0x00, 0x73,
+            0x00, 0x20, 0x00, 0x63, 0x00, 0x69, 0x00, 0x72, 0x00, 0x6b, 0x00, 0x75, 0x00, 0x73, 0x00, 0x6b, 0x00, 0x6c,
+            0x00, 0x6f, 0x00, 0x76, 0x00, 0x6e, 0x00, 0x65, 0x00, 0x6e, 0x00, 0x20, 0x00, 0x57, 0x00, 0x6f, 0x00, 0x6c,
+            0x00, 0x74, 0x00, 0x68, 0x00, 0x65, 0x00, 0x72, 0x00, 0x20, 0x00, 0x73, 0x00, 0x70, 0x00, 0x69, 0x00, 0x6c,
+            0x00, 0x6c, 0x00, 0x65, 0x00, 0x64, 0x00, 0x65, 0x00, 0x20, 0x00, 0x70, 0x00, 0xe5, 0x00, 0x20, 0x00, 0x78,
+            0x00, 0x79, 0x00, 0x6c, 0x00, 0x6f, 0x00, 0x66, 0x00, 0x6f, 0x00, 0x6e, 0x00, 0x2e,
         ]);
         stream.close();
 
diff --git a/crates/gosub_shared/src/document.rs b/crates/gosub_shared/src/document.rs
new file mode 100644
index 000000000..b6ade75a9
--- /dev/null
+++ b/crates/gosub_shared/src/document.rs
@@ -0,0 +1,59 @@
+use crate::traits::css3::CssSystem;
+use crate::traits::document::Document;
+use std::cell::{Ref, RefCell, RefMut};
+use std::fmt::Debug;
+use std::marker::PhantomData;
+use std::rc::Rc;
+
+pub struct DocumentHandle<D: Document<C>, C: CssSystem>(pub Rc<RefCell<D>>, pub PhantomData<C>);
+
+impl<C, D> DocumentHandle<D, C>
+where
+    C: CssSystem,
+    D: Document<C>,
+{
+    /// Create a new DocumentHandle from a document
+    pub fn create(document: D) -> Self {
+        DocumentHandle(Rc::new(RefCell::new(document)), PhantomData)
+    }
+
+    /// Returns the document as referenced by the handle
+    pub fn get(&self) -> Ref<D> {
+        self.0.borrow()
+    }
+
+    /// Returns a
+    pub fn get_mut(&mut self) -> RefMut<D> {
+        self.0.borrow_mut()
+    }
+}
+
+impl<C: CssSystem, D: Document<C> + Debug> Debug for DocumentHandle<D, C> {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        write!(f, "{:?}", self.0.borrow())
+    }
+}
+
+// impl<D: Document + PartialEq> PartialEq for DocumentHandle<D> {
+//     fn eq(&self, other: &Self) -> bool {
+//         self.0.eq(&other.0)
+//     }
+// }
+
+impl<C: CssSystem, D: Document<C> + PartialEq> PartialEq for DocumentHandle<D, C> {
+    fn eq(&self, other: &Self) -> bool {
+        self.0.borrow().eq(&other.0.borrow())
+    }
+}
+
+impl<C: CssSystem, D: Document<C> + Eq> Eq for DocumentHandle<D, C> {}
+
+// NOTE: it is preferred to use Document::clone() when
+// copying a DocumentHandle reference. However, for
+// any structs using this handle that use #[derive(Clone)],
+// this implementation is required.
+impl<C: CssSystem, D: Document<C>> Clone for DocumentHandle<D, C> {
+    fn clone(&self) -> DocumentHandle<D, C> {
+        DocumentHandle(Rc::clone(&self.0), PhantomData)
+    }
+}
diff --git a/crates/gosub_shared/src/element_data.rs b/crates/gosub_shared/src/element_data.rs
new file mode 100644
index 000000000..93e286b3d
--- /dev/null
+++ b/crates/gosub_shared/src/element_data.rs
@@ -0,0 +1,80 @@
+use derive_more::Display;
+
+/// A NodeID is a unique identifier for a node in a node tree.
+#[derive(Clone, Copy, Debug, Default, Display, Eq, Hash, PartialEq, PartialOrd)]
+pub struct NodeId(usize);
+
+impl From<NodeId> for usize {
+    /// Converts a NodeId into a usize
+    fn from(value: NodeId) -> Self {
+        value.0
+    }
+}
+
+impl From<usize> for NodeId {
+    /// Converts a usize into a NodeId
+    fn from(value: usize) -> Self {
+        Self(value)
+    }
+}
+
+impl From<u64> for NodeId {
+    /// Converts a u64 into a NodeId
+    fn from(value: u64) -> Self {
+        Self(value as usize)
+    }
+}
+
+impl From<NodeId> for u64 {
+    /// Converts a NodeId into a u64
+    fn from(value: NodeId) -> Self {
+        value.0 as u64
+    }
+}
+
+impl Default for &NodeId {
+    /// Returns the default NodeId, which is 0
+    fn default() -> Self {
+        &NodeId(0)
+    }
+}
+
+impl NodeId {
+    // TODO: Drop Default derive and only use 0 for the root, or choose another id for the root
+    pub const ROOT_NODE: usize = 0;
+
+    /// Returns the root node ID
+    pub fn root() -> Self {
+        Self(Self::ROOT_NODE)
+    }
+
+    /// Returns true when this nodeId is the root node
+    pub fn is_root(&self) -> bool {
+        self.0 == Self::ROOT_NODE
+    }
+
+    /// Returns the next node ID
+    #[must_use]
+    pub fn next(&self) -> Self {
+        if self.0 == usize::MAX {
+            return Self(usize::MAX);
+        }
+
+        Self(self.0 + 1)
+    }
+
+    /// Returns the nodeID as usize
+    pub fn as_usize(&self) -> usize {
+        self.0
+    }
+
+    /// Returns the previous node ID
+    #[must_use]
+    pub fn prev(&self) -> Self {
+        if self.0 == 0 {
+            return Self::root();
+        }
+
+        Self(self.0 - 1)
+    }
+}
diff --git a/crates/gosub_shared/src/errors.rs b/crates/gosub_shared/src/errors.rs
new file mode 100644
index 000000000..707a2df94
--- /dev/null
+++ b/crates/gosub_shared/src/errors.rs
@@ -0,0 +1,39 @@
+use crate::byte_stream::Location;
+use std::fmt::{Display, Formatter};
+
+/// Parser error that defines an error (message) on the given position
+#[derive(Clone, Debug, PartialEq)]
+pub struct CssError {
+    /// Error message
+    pub message: String,
+    /// Location of the error, if available (during parsing mostly)
+    pub location: Option<Location>,
+}
+
+impl CssError {
+    pub fn new(message: &str) -> Self {
+        CssError {
+            message: message.to_string(),
+            location: None,
+        }
+    }
+
+    pub fn with_location(message: &str, location: Location) -> Self {
+        CssError {
+            message: message.to_string(),
+            location: Some(location),
+        }
+    }
+}
+
+impl Display for CssError {
+    fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
+        if self.location.is_some() {
+            write!(f, "{} at {:?}", self.message, self.location)
+        } else {
+            write!(f, "{}", self.message)
+        }
+    }
+}
+
+pub type CssResult<T> = Result<T, CssError>;
diff --git a/crates/gosub_shared/src/lib.rs b/crates/gosub_shared/src/lib.rs
index 9e46b5c77..08b6b56e0 100644
--- a/crates/gosub_shared/src/lib.rs
+++ b/crates/gosub_shared/src/lib.rs
@@ -2,6 +2,13 @@
 //!
 //! This crate supplies a lot of shared functionality in the gosub engine.
 //!
+
+extern crate core;
+
 pub mod byte_stream;
+pub mod document;
+pub mod errors;
+pub mod node;
 pub mod timing;
+pub mod traits;
 pub mod types;
diff --git a/crates/gosub_shared/src/node.rs b/crates/gosub_shared/src/node.rs
new file mode 100644
index 000000000..93e286b3d
--- /dev/null
+++ b/crates/gosub_shared/src/node.rs
@@ -0,0 +1,80 @@
+use derive_more::Display;
+
+/// A NodeID is a unique identifier for a node in a node tree.
+#[derive(Clone, Copy, Debug, Default, Display, Eq, Hash, PartialEq, PartialOrd)]
+pub struct NodeId(usize);
+
+impl From<NodeId> for usize {
+    /// Converts a NodeId into a usize
+    fn from(value: NodeId) -> Self {
+        value.0
+    }
+}
+
+impl From<usize> for NodeId {
+    /// Converts a usize into a NodeId
+    fn from(value: usize) -> Self {
+        Self(value)
+    }
+}
+
+impl From<u64> for NodeId {
+    /// Converts a u64 into a NodeId
+    fn from(value: u64) -> Self {
+        Self(value as usize)
+    }
+}
+
+impl From<NodeId> for u64 {
+    /// Converts a NodeId into a u64
+    fn from(value: NodeId) -> Self {
+        value.0 as u64
+    }
+}
+
+impl Default for &NodeId {
+    /// Returns the default NodeId, which is 0
+    fn default() -> Self {
+        &NodeId(0)
+    }
+}
+
+impl NodeId {
+    // TODO: Drop Default derive and only use 0 for the root, or choose another id for the root
+    pub const ROOT_NODE: usize = 0;
+
+    /// Returns the root node ID
+    pub fn root() -> Self {
+        Self(Self::ROOT_NODE)
+    }
+
+    /// Returns true when this nodeId is the root node
+    pub fn is_root(&self) -> bool {
+        self.0 == Self::ROOT_NODE
+    }
+
+    /// Returns the next node ID
+    #[must_use]
+    pub fn next(&self) -> Self {
+        if self.0 == usize::MAX {
+            return Self(usize::MAX);
+        }
+
+        Self(self.0 + 1)
+    }
+
+    /// Returns the nodeID as usize
+    pub fn as_usize(&self) -> usize {
+        self.0
+    }
+
+    /// Returns the previous node ID
+    #[must_use]
+    pub fn prev(&self) -> Self {
+        if self.0 == 0 {
+            return Self::root();
+        }
+
+        Self(self.0 - 1)
+    }
+}
diff --git a/crates/gosub_shared/src/timing.rs b/crates/gosub_shared/src/timing.rs
index 4aff52c1e..a5a4244f3 100644
--- a/crates/gosub_shared/src/timing.rs
+++ b/crates/gosub_shared/src/timing.rs
@@ -68,10 +68,7 @@ impl TimingTable {
     pub fn start_timer(&mut self, namespace: &str, context: Option<String>) -> TimerId {
         let timer = Timer::new(context);
         self.timers.insert(timer.id, timer.clone());
-        self.namespaces
-            .entry(namespace.to_string())
-            .or_default()
-            .push(timer.id);
+        self.namespaces.entry(namespace.to_string()).or_default().push(timer.id);
 
         timer.id
     }
@@ -140,16 +137,18 @@ impl TimingTable {
         println!("----------------------------------------------------------------------------------------------------------------------------------------");
         for (namespace, timers) in &self.namespaces {
             let stats = self.get_stats(timers);
-            println!("{:20} | {:>8} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10}", namespace,
-                     stats.count,
-                     self.scale(stats.total, scale.clone()),
-                     self.scale(stats.min, scale.clone()),
-                     self.scale(stats.max, scale.clone()),
-                     self.scale(stats.avg, scale.clone()),
-                     self.scale(stats.p50, scale.clone()),
-                     self.scale(stats.p75, scale.clone()),
-                     self.scale(stats.p95, scale.clone()),
-                     self.scale(stats.p99, scale.clone()),
+            println!(
+                "{:20} | {:>8} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10} | {:>10}",
+                namespace,
+                stats.count,
+                self.scale(stats.total, scale.clone()),
+                self.scale(stats.min, scale.clone()),
+                self.scale(stats.max, scale.clone()),
+                self.scale(stats.avg, scale.clone()),
+                self.scale(stats.p50, scale.clone()),
+                self.scale(stats.p75, scale.clone()),
+                self.scale(stats.p95, scale.clone()),
+                self.scale(stats.p99, scale.clone()),
             );
 
             if show_details {
@@ -203,10 +202,7 @@ macro_rules! timing_start {
 #[macro_export]
 macro_rules! timing_stop {
     ($timer_id:expr) => {{
-        $crate::timing::TIMING_TABLE
-            .lock()
-            .unwrap()
-            .stop_timer($timer_id);
+        $crate::timing::TIMING_TABLE.lock().unwrap().stop_timer($timer_id);
     }};
 }
 
@@ -294,10 +290,7 @@ impl Timer {
     #[cfg(target_arch = "wasm32")]
     pub fn end(&mut self) {
         self.end = window().and_then(|w| w.performance()).map(|p| p.now());
-        self.duration_us = self
-            .end
-            .map(|e| (e - self.start) * 1000.0)
-            .unwrap_or(f64::NAN) as u64;
+        self.duration_us = self.end.map(|e| (e - self.start) * 1000.0).unwrap_or(f64::NAN) as u64;
     }
 
     pub(crate) fn has_finished(&self) -> bool {
@@ -323,8 +316,7 @@ mod tests {
     #[cfg(target_arch = "wasm32")]
     use {
         js_sys::wasm_bindgen::closure::Closure, std::sync::atomic::AtomicBool, std::sync::Arc,
-        wasm_bindgen_test::wasm_bindgen_test_configure, wasm_bindgen_test::*,
-        web_sys::wasm_bindgen::JsCast,
+        wasm_bindgen_test::wasm_bindgen_test_configure, wasm_bindgen_test::*, web_sys::wasm_bindgen::JsCast,
     };
 
     use super::*;
@@ -361,10 +353,7 @@ mod tests {
         sleep(Duration::from_millis(20));
         timing_stop!(t);
 
-        TIMING_TABLE
-            .lock()
-            .unwrap()
-            .print_timings(true, Scale::Auto);
+        TIMING_TABLE.lock().unwrap().print_timings(true, Scale::Auto);
     }
 
     #[wasm_bindgen_test]
@@ -398,10 +387,7 @@ mod tests {
         sleep(window, Duration::from_millis(20));
         timing_stop!(t);
 
-        TIMING_TABLE
-            .lock()
-            .unwrap()
-            .print_timings(true, Scale::Auto);
+        TIMING_TABLE.lock().unwrap().print_timings(true, Scale::Auto);
     }
 
     //This should only be used for testing purposes
diff --git a/crates/gosub_css3/src/parser_config.rs b/crates/gosub_shared/src/traits.rs
similarity index 65%
rename from crates/gosub_css3/src/parser_config.rs
rename to crates/gosub_shared/src/traits.rs
index b4a7b4c8c..f3b2e2e67 100644
--- a/crates/gosub_css3/src/parser_config.rs
+++ b/crates/gosub_shared/src/traits.rs
@@ -1,6 +1,14 @@
-use gosub_shared::byte_stream::Location;
+use crate::byte_stream::Location;
+
+pub mod css3;
+pub mod document;
+pub mod html5;
+pub mod node;
+
+pub mod render_tree;
 
 /// Context defines how the data needs to be parsed
+#[derive(Debug, Clone, Copy, PartialEq)]
 pub enum Context {
     Stylesheet,
     Rule,
@@ -10,7 +18,7 @@ pub enum Context {
 
 /// ParserConfig holds the configuration for the CSS3 parser
 pub struct ParserConfig {
-    /// Context defines how the data needs to be parsed
+    /// Context defines what kind of data we are providing: a stylesheet, a rule, an at-rule or a declaration
     pub context: Context,
     /// Location holds the start position of the given element in the data source
     pub location: Location,
@@ -19,6 +27,9 @@ pub struct ParserConfig {
     /// Ignore errors and continue parsing. Any errors will not be returned in the final AST
     /// (this means if a selector is invalid, all rules will be ignored, even when they are valid)
     pub ignore_errors: bool,
+    /// When true, the values in the declaration will be matched against the property syntax. If it doesn't
+    /// match it will trigger an error
+    pub match_values: bool,
 }
 
 impl Default for ParserConfig {
@@ -28,6 +39,7 @@ impl Default for ParserConfig {
             location: Location::default(),
             source: None,
             ignore_errors: false,
+            match_values: true,
         }
     }
 }
diff --git a/crates/gosub_shared/src/traits/css3.rs b/crates/gosub_shared/src/traits/css3.rs
new file mode 100644
index 000000000..76c8b5752
--- /dev/null
+++ b/crates/gosub_shared/src/traits/css3.rs
@@ -0,0 +1,101 @@
+use crate::document::DocumentHandle;
+use crate::errors::CssResult;
+use crate::node::NodeId;
+use crate::traits::document::Document;
+use crate::traits::render_tree::RenderTree;
+use crate::traits::ParserConfig;
+use std::fmt::Debug;
+
+/// Defines the origin of the stylesheet (or declaration)
+#[derive(Debug, PartialEq, Clone, Copy)]
+pub enum CssOrigin {
+    /// Browser/user agent defined stylesheets
+    UserAgent,
+    /// Author defined stylesheets that are linked or embedded in the HTML files
+    Author,
+    /// User defined stylesheets that will override the author and user agent stylesheets (for instance, custom user styles or extensions)
+    User,
+}
+
+/// The CssSystem trait is a trait that defines all things CSS3 that are used by other non-css3 crates. This is the main trait that
+/// is used to parse CSS3 files. It contains sub elements like the Stylesheet trait that is used in for instance the Document trait.
+pub trait CssSystem: Clone {
+    type Stylesheet: CssStylesheet;
+
+    type PropertyMap: CssPropertyMap<Property = Self::Property>;
+
+    type Property: CssProperty;
+
+    /// Parses a string into a CSS3 stylesheet
+    fn parse_str(str: &str, config: ParserConfig, origin: CssOrigin, source_url: &str) -> CssResult<Self::Stylesheet>;
+
+    /// Returns the properties of a node
+    /// If `None` is returned, the node is not renderable
+    fn properties_from_node<D: Document<Self>>(
+        node: &D::Node,
+        sheets: &[Self::Stylesheet],
+        handle: DocumentHandle<D, Self>,
+        id: NodeId,
+    ) -> Option<Self::PropertyMap>;
+
+    fn inheritance<T: RenderTree<Self>>(tree: &mut T);
+}
+
+pub trait CssStylesheet: PartialEq {
+    /// Returns the origin of the stylesheet
+    fn origin(&self) -> CssOrigin;
+
+    /// Returns the source URL of the stylesheet
+    fn url(&self) -> &str;
+}
+
+pub trait CssPropertyMap: Default + Debug {
+    type Property: CssProperty;
+
+    fn insert_inherited(&mut self, name: &str, value: Self::Property);
+
+    fn get(&self, name: &str) -> Option<&Self::Property>;
+
+    fn get_mut(&mut self, name: &str) -> Option<&mut Self::Property>;
+
+    fn make_dirty(&mut self);
+
+    fn iter(&self) -> impl Iterator<Item = (&str, &Self::Property)> + '_;
+
+    fn iter_mut(&mut self) -> impl Iterator<Item = (&str, &mut Self::Property)> + '_;
+
+    fn make_clean(&mut self);
+    fn is_dirty(&self) -> bool;
+}
+pub trait CssProperty: Debug + Sized {
+    type Value: CssValue;
+
+    fn compute_value(&mut self); // this should probably be removed
+
+    fn unit_to_px(&self) -> f32;
+
+    fn as_string(&self) -> Option<&str>;
+    fn as_percentage(&self) -> Option<f32>;
+    fn as_unit(&self) -> Option<(f32, &str)>;
+    fn as_color(&self) -> Option<(f32, f32, f32, f32)>;
+
+    fn parse_color(&self) -> Option<(f32, f32, f32, f32)>;
+
+    fn as_number(&self) -> Option<f32>;
+    fn as_list(&self) -> Option<Vec<Self::Value>>;
+
+    fn is_none(&self) -> bool;
+}
+
+pub trait CssValue: Sized {
+    fn unit_to_px(&self) -> f32;
+
+    fn as_string(&self) -> Option<&str>;
+    fn as_percentage(&self) -> Option<f32>;
+    fn as_unit(&self) -> Option<(f32, &str)>;
+    fn as_color(&self) -> Option<(f32, f32, f32, f32)>;
+    fn as_number(&self) -> Option<f32>;
+    fn as_list(&self) -> Option<Vec<Self>>;
+
+    fn is_none(&self) -> bool;
+}
diff --git a/crates/gosub_shared/src/traits/document.rs b/crates/gosub_shared/src/traits/document.rs
new file mode 100644
index 000000000..6cb0ccf48
--- /dev/null
+++ b/crates/gosub_shared/src/traits/document.rs
@@ -0,0 +1,129 @@
+use crate::byte_stream::Location;
+use crate::document::DocumentHandle;
+use crate::node::NodeId;
+use crate::traits::css3::CssSystem;
+use crate::traits::node::{Node, QuirksMode};
+use std::collections::HashMap;
+use std::fmt::Display;
+use url::Url;
+
+/// Type of the given document
+#[derive(PartialEq, Debug, Copy, Clone)]
+pub enum DocumentType {
+    /// HTML document
+    HTML,
+    /// Iframe source document
+    IframeSrcDoc,
+}
+
+pub trait DocumentBuilder<C: CssSystem> {
+    type Document: Document<C>;
+
+    fn new_document(url: Option<Url>) -> DocumentHandle<Self::Document, C>;
+    fn new_document_fragment(
+        context_node: &<Self::Document as Document<C>>::Node,
+        quirks_mode: QuirksMode,
+    ) -> DocumentHandle<Self::Document, C>;
+}
+
+pub trait DocumentFragment<C: CssSystem>: Sized {
+    type Document: Document<C, Fragment = Self>;
+
+    /// Returns the document handle for this document
+    fn handle(&self) -> DocumentHandle<Self::Document, C>;
+
+    fn new(handle: DocumentHandle<Self::Document, C>, node_id: NodeId) -> Self;
+}
+
+pub trait Document<C: CssSystem>: Sized + Display {
+    type Node: Node<C, Document = Self>;
+    type Fragment: DocumentFragment<C, Document = Self>;
+    type Builder: DocumentBuilder<C, Document = Self>;
+
+    // Creates a new doc with an optional document root node
+    fn new(document_type: DocumentType, url: Option<Url>, root_node: Option<Self::Node>) -> DocumentHandle<Self, C>;
+
+    // /// Creates a new document with an optional document root node
+    // fn new_with_handle(document_type: DocumentType, url: Option<Url>, location: &Location, root_node: Option<&Self::Node>) -> DocumentHandle<Self>;
+
+    // /// Returns the document handle for this document
+    // fn handle(&self) -> DocumentHandle<Self, C>;
+
+    /// Location of the document (URL, file path, etc.)
+    fn url(&self) -> Option<Url>;
+
+    fn set_quirks_mode(&mut self, quirks_mode: QuirksMode);
+    fn quirks_mode(&self) -> QuirksMode;
+    fn set_doctype(&mut self, doctype: DocumentType);
+    fn doctype(&self) -> DocumentType;
+
+    /// Return a node by its node ID
+    fn node_by_id(&self, node_id: NodeId) -> Option<&Self::Node>;
+
+    // Return an element node by the "id" attribute
+    fn node_by_named_id(&self, id: &str) -> Option<&Self::Node>;
+
+    // fn add_named_id(&mut self, id: &str, node_id: NodeId);
+    // /// Remove a named ID from the document
+    // fn remove_named_id(&mut self, id: &str);
+
+    fn stylesheets(&self) -> &Vec<C::Stylesheet>;
+    fn add_stylesheet(&mut self, stylesheet: C::Stylesheet);
+
+    /// Return the root node of the document
+    fn get_root(&self) -> &Self::Node;
+    // fn get_root_mut(&mut self) -> &mut Self::Node;
+
+    fn attach_node(&mut self, node_id: NodeId, parent_id: NodeId, position: Option<usize>);
+    fn detach_node(&mut self, node_id: NodeId);
+    fn relocate_node(&mut self, node_id: NodeId, parent_id: NodeId);
+
+    /// Updates a node into the document
+    fn update_node(&mut self, node: Self::Node);
+
+    // Updates a node that is referenced into the document. This is useful for instance when a node is fetched with node_by_id() for instance.
+    fn update_node_ref(&mut self, node: &Self::Node);
+
+    // /// Return the parent node from a given ID
+    // fn parent_node(&self, node: &Self::Node) -> Option<&Self::Node>;
+
+    /// Removes a node from the document
+    fn delete_node_by_id(&mut self, node_id: NodeId);
+
+    /// Returns the next sibling of the reference node
+    fn get_next_sibling(&self, node: NodeId) -> Option<NodeId>;
+
+    /// Return number of nodes in the document
+    fn node_count(&self) -> usize;
+
+    /// Returns the next node ID that will be used when registering a new node
+    fn peek_next_id(&self) -> NodeId;
+
+    /// Register a new node
+    fn register_node(&mut self, node: Self::Node) -> NodeId;
+    /// Register a new node at a specific position
+    fn register_node_at(&mut self, node: Self::Node, parent_id: NodeId, position: Option<usize>) -> NodeId;
+
+    /// Node creation methods. The root node is needed in order to fetch the document handle (it can't be created from the document itself)
+    fn new_document_node(handle: DocumentHandle<Self, C>, quirks_mode: QuirksMode, location: Location) -> Self::Node;
+    fn new_doctype_node(
+        handle: DocumentHandle<Self, C>,
+        name: &str,
+        public_id: Option<&str>,
+        system_id: Option<&str>,
+        location: Location,
+    ) -> Self::Node;
+    fn new_comment_node(handle: DocumentHandle<Self, C>, comment: &str, location: Location) -> Self::Node;
+    fn new_text_node(handle: DocumentHandle<Self, C>, value: &str, location: Location) -> Self::Node;
+    fn new_element_node(
+        handle: DocumentHandle<Self, C>,
+        name: &str,
+        namespace: Option<&str>,
+        attributes: HashMap<String, String>,
+        location: Location,
+    ) -> Self::Node;
+
+    fn write(&self) -> String;
+    fn write_from_node(&self, node_id: NodeId) -> String;
+    fn cloned_node_by_id(&self, node_id: NodeId) -> Option<Self::Node>;
+}
diff --git a/crates/gosub_shared/src/traits/html5.rs b/crates/gosub_shared/src/traits/html5.rs
new file mode 100644
index 000000000..10916e2cc
--- /dev/null
+++ b/crates/gosub_shared/src/traits/html5.rs
@@ -0,0 +1,31 @@
+use crate::byte_stream::{ByteStream, Location};
+use crate::document::DocumentHandle;
+use crate::traits::css3::CssSystem;
+use crate::traits::document::Document;
+
+use crate::types::{ParseError, Result};
+
+pub trait Html5Parser<C: CssSystem> {
+    type Document: Document<C>;
+
+    type Options: ParserOptions;
+
+    fn parse(
+        stream: &mut ByteStream,
+        doc: DocumentHandle<Self::Document, C>,
+        opts: Option<Self::Options>,
+    ) -> Result<Vec<ParseError>>;
+
+    #[allow(clippy::type_complexity)]
+    fn parse_fragment(
+        stream: &mut ByteStream,
+        doc: DocumentHandle<Self::Document, C>,
+        context_node: &<Self::Document as Document<C>>::Node,
+        options: Option<Self::Options>,
+        start_location: Location,
+    ) -> Result<Vec<ParseError>>;
+}
+
+pub trait ParserOptions {
+    fn new(scripting: bool) -> Self;
+}
diff --git a/crates/gosub_shared/src/traits/node.rs b/crates/gosub_shared/src/traits/node.rs
new file mode 100644
index 000000000..c0e21708f
--- /dev/null
+++ b/crates/gosub_shared/src/traits/node.rs
@@ -0,0 +1,196 @@
+use crate::byte_stream::Location;
+use crate::document::DocumentHandle;
+use crate::node::NodeId;
+use crate::traits::css3::CssSystem;
+use crate::traits::document::Document;
+use crate::traits::document::DocumentFragment;
+use std::collections::hash_map::IntoIter;
+use std::collections::HashMap;
+
+#[derive(PartialEq, Debug, Copy, Clone)]
+pub enum QuirksMode {
+    Quirks,
+    LimitedQuirks,
+    NoQuirks,
+}
+
+/// Different types of nodes that all have their own data structures (NodeData)
+#[derive(Debug, PartialEq)]
+pub enum NodeType {
+    DocumentNode,
+    DocTypeNode,
+    TextNode,
+    CommentNode,
+    ElementNode,
+}
+
+/// Different types of nodes
+#[derive(Debug, PartialEq)]
+pub enum NodeData<'a, C: CssSystem, N: Node<C>> {
+    Document(&'a N::DocumentData),
+    DocType(&'a N::DocTypeData),
+    Text(&'a N::TextData),
+    Comment(&'a N::CommentData),
+    Element(&'a N::ElementData),
+}
+
+impl<C: CssSystem, N: Node<C>> Copy for NodeData<'_, C, N> {}
+
+impl<C: CssSystem, N: Node<C>> Clone for NodeData<'_, C, N> {
+    fn clone(&self) -> Self {
+        *self
+    }
+}
+
+pub trait DocumentDataType {
+    fn quirks_mode(&self) -> QuirksMode;
+    fn set_quirks_mode(&mut self, quirks_mode: QuirksMode);
+}
+
+pub trait DocTypeDataType {
+    fn name(&self) -> &str;
+    fn pub_identifier(&self) -> &str;
+    fn sys_identifier(&self) -> &str;
+}
+
+pub trait TextDataType {
+    fn value(&self) -> &str;
+
+    fn string_value(&self) -> String;
+    fn value_mut(&mut self) -> &mut String;
+}
+
+pub trait CommentDataType {
+    fn value(&self) -> &str;
+}
+
+pub trait ClassList {
+    /// Returns true when the classlist contains the given class name
+    fn contains(&self, class_name: &str) -> bool;
+    /// Adds a class to the classlist
+    fn add(&mut self, class_name: &str);
+    /// Removes a class from the classlist
+    fn remove(&mut self, class_name: &str);
+    /// Toggles a class active/inactive in the classlist
+    fn toggle(&mut self, class_name: &str);
+    /// Replaces a class in the classlist
+    fn replace(&mut self, old_class_name: &str, new_class_name: &str);
+    /// Returns the number of classes in the classlist
+    fn length(&self) -> usize;
+    /// Returns the classes as a vector
+    fn as_vec(&self) -> Vec<String>;
+    /// Returns true if the classlist is empty
+    fn is_active(&self, class_name: &str) -> bool;
+    /// Returns the active classes of the classlist
+    fn active_classes(&self) -> Vec<String>;
+    /// Returns the active classes of the classlist as a string
+    fn len(&self) -> usize;
+    /// Returns true if the classlist is empty
+    fn is_empty(&self) -> bool;
+    /// Sets the active state of a class
+    fn set_active(&mut self, name: &str, is_active: bool);
+    fn iter(&self) -> IntoIter<String, bool>;
+}
+
+pub trait ElementDataType<C: CssSystem> {
+    type Document: Document<C>;
+    type DocumentFragment: DocumentFragment<C>;
+
+    /// Returns the name of the element
+    fn name(&self) -> &str;
+
+    /// Returns the namespace
+    fn namespace(&self) -> &str;
+    /// Returns true if the namespace matches the element
+    fn is_namespace(&self, namespace: &str) -> bool;
+
+    /// Returns the classes of the element
+    fn classlist(&self) -> &impl ClassList;
+    fn classlist_mut(&mut self) -> &mut impl ClassList;
+    /// Returns the active classes of the element
+    fn active_class_names(&self) -> Vec<String>;
+
+    /// Returns the given attribute (or None when not found)
+    fn attribute(&self, name: &str) -> Option<&String>;
+    /// Returns all attributes of the element
+    fn attributes(&self) -> &HashMap<String, String>;
+    /// Add attribute
+    fn add_attribute(&mut self, name: &str, value: &str);
+    /// Remove an attribute
+    fn remove_attribute(&mut self, name: &str);
+    /// Add a class to the element
+    fn add_class(&mut self, class: &str);
+
+    fn matches_tag_and_attrs_without_order(&self, other_data: &Self) -> bool;
+    fn is_mathml_integration_point(&self) -> bool;
+    fn is_html_integration_point(&self) -> bool;
+
+    /// Returns true if this is a "special" element node
+    fn is_special(&self) -> bool;
+
+    // Return the template document of the element
+    fn template_contents(&self) -> Option<&Self::DocumentFragment>;
+    /// Returns true if the given node is a "formatting" node
+    fn is_formatting(&self) -> bool;
+
+    fn set_template_contents(&mut self, template_contents: Self::DocumentFragment);
+}
+
+pub trait Node<C: CssSystem>: Clone + PartialEq {
+    type Document: Document<C>;
+    type DocumentData: DocumentDataType;
+    type DocTypeData: DocTypeDataType;
+    type TextData: TextDataType;
+    type CommentData: CommentDataType;
+    type ElementData: ElementDataType<
+        C,
+        Document = Self::Document,
+        DocumentFragment = <Self::Document as Document<C>>::Fragment,
+    >;
+
+    fn new_from_node(org_node: &Self) -> Self;
+
+    /// Return the ID of the node
+    fn id(&self) -> NodeId;
+    /// Sets the ID of the node
+    fn set_id(&mut self, id: NodeId);
+    /// Returns the location of the node
+    fn location(&self) -> Location;
+    /// Returns the ID of the parent node or None when the node is the root
+    fn parent_id(&self) -> Option<NodeId>;
+    /// Sets the parent of the node, or None when the node is the root
+    fn set_parent(&mut self, parent_id: Option<NodeId>);
+
+    fn set_registered(&mut self, registered: bool);
+    fn is_registered(&self) -> bool;
+
+    /// Returns true when this node is the root node
+    fn is_root(&self) -> bool;
+    /// Returns the children of the node
+    fn children(&self) -> &[NodeId];
+
+    /// Returns the type of the node
+    fn type_of(&self) -> NodeType;
+
+    fn is_element_node(&self) -> bool;
+    fn get_element_data(&self) -> Option<&Self::ElementData>;
+    fn get_element_data_mut(&mut self) -> Option<&mut Self::ElementData>;
+
+    fn is_text_node(&self) -> bool;
+    fn get_text_data(&self) -> Option<&Self::TextData>;
+    fn get_text_data_mut(&mut self) -> Option<&mut Self::TextData>;
+
+    fn get_comment_data(&self) -> Option<&Self::CommentData>;
+    fn get_doctype_data(&self) -> Option<&Self::DocTypeData>;
+
+    /// Returns the document handle of the node
+    fn handle(&self) -> DocumentHandle<Self::Document, C>;
+    /// Removes a child node from the node
+    fn remove(&mut self, node_id: NodeId);
+    /// Inserts a child node to the node at a specific index
+    fn insert(&mut self, node_id: NodeId, idx: usize);
+    /// Pushes a child node to the node
+    fn push(&mut self, node_id: NodeId);
+
+    fn data(&self) -> NodeData<C, Self>;
+}
diff --git a/crates/gosub_shared/src/traits/render_tree.rs b/crates/gosub_shared/src/traits/render_tree.rs
new file mode 100644
index 000000000..e440b0123
--- /dev/null
+++ b/crates/gosub_shared/src/traits/render_tree.rs
@@ -0,0 +1,21 @@
+use crate::traits::css3::CssSystem;
+
+pub trait RenderTree<C: CssSystem> {
+    type NodeId: Copy;
+
+    type Node: RenderTreeNode<C>;
+
+    fn root(&self) -> Self::NodeId;
+
+    fn get_node(&self, id: Self::NodeId) -> Option<&Self::Node>;
+
+    fn get_node_mut(&mut self, id: Self::NodeId) -> Option<&mut Self::Node>;
+
+    fn get_children(&self, id: Self::NodeId) -> Option<Vec<Self::NodeId>>;
+}
+
+pub trait RenderTreeNode<C: CssSystem> {
+    fn props(&self) -> &C::PropertyMap;
+
+    fn props_mut(&mut self) -> &mut C::PropertyMap;
+}
diff --git a/crates/gosub_shared/src/types.rs b/crates/gosub_shared/src/types.rs
index c6fb88afa..8c1edb5ee 100644
--- a/crates/gosub_shared/src/types.rs
+++ b/crates/gosub_shared/src/types.rs
@@ -184,10 +184,7 @@ impl Point<f64> {
 }
 
 impl Size<u32> {
-    pub const ZERO: Self = Self {
-        width: 0,
-        height: 0,
-    };
+    pub const ZERO: Self = Self { width: 0, height: 0 };
 
     pub fn f64(&self) -> Size<f64> {
         Size::new(self.width as f64, self.height as f64)
@@ -322,21 +319,11 @@ impl Rect<u32> {
     };
 
     pub fn f64(&self) -> Rect<f64> {
-        Rect::new(
-            self.x1 as f64,
-            self.y1 as f64,
-            self.x2 as f64,
-            self.y2 as f64,
-        )
+        Rect::new(self.x1 as f64, self.y1 as f64, self.x2 as f64, self.y2 as f64)
     }
 
     pub fn f32(&self) -> Rect<f32> {
-        Rect::new(
-            self.x1 as f32,
-            self.y1 as f32,
-            self.x2 as f32,
-            self.y2 as f32,
-        )
+        Rect::new(self.x1 as f32, self.y1 as f32, self.x2 as f32, self.y2 as f32)
     }
 
     pub fn x1_f32(&self) -> f32 {
diff --git a/crates/gosub_styling/Cargo.toml b/crates/gosub_styling/Cargo.toml
deleted file mode 100644
index 6c224e5ca..000000000
--- a/crates/gosub_styling/Cargo.toml
+++ /dev/null
@@ -1,32 +0,0 @@
-[package]
-name = "gosub_styling"
-version = "0.1.0"
-edition = "2021"
-authors = ["Gosub Community <info@gosub.io>"]
-license = "MIT"
-
-[dependencies]
-gosub_shared = { path = "../gosub_shared" }
-gosub_css3 = { path = "../gosub_css3" }
-gosub_html5 = { path = "../gosub_html5" }
-gosub_render_backend = { path = "../gosub_render_backend" }
-gosub_typeface = { path = "../gosub_typeface" }
-lazy_static = "1.5"
-anyhow = "1.0.89"
-regex = "1.10.6"
-colors-transform = "0.2.11"
-backtrace = "0.3.74"
-log = "0.4.21"
-rand = "0.9.0-alpha.1"
-
-#[target.'cfg(target_arch = "wasm32")'.dependencies]
-#web-sys = { version = "0.3.69", features = ["fontface"] }
-
-[target.'cfg(not(target_arch = "wasm32"))'.dependencies]
-rust-fontconfig = "0.1.7"
-itertools = "0.13.0"
-serde = { version = "1.0.210", features = ["derive"] }
-serde_json = "1.0.128"
-memoize = "0.4.2"
-thiserror = "1.0.64"
-nom = "7.1.3"
diff --git a/crates/gosub_styling/README.md b/crates/gosub_styling/README.md
deleted file mode 100644
index a6b7cdcd0..000000000
--- a/crates/gosub_styling/README.md
+++ /dev/null
@@ -1,55 +0,0 @@
-# Gosub Styling crate
-
-This crate holds the CSS3 styling functionality. It allows the engine to query CSS3 properties and returns the correct values based 
-on the HTML and CSS3 documents parsed. 
-
-## It consists of the following parts:
-
- - The CSS property definitions, as found in `resources/definitions`. This holds the syntax for each CSS property.
- - Css Value Syntax parser, which is used to parse the CSS property definitions syntax.
- - CSs Matcher that matches CSS values (ie: `1px solid red`) to the CSS property definitions.
-
-
-## Still missing, but needs to be added:
-
- - API for querying CSS properties, and returning the correct values, minding things like inherited and initial values.
- - API for querying CSS properties at different levels. So normally we want to use the `"actual"` value, but we also need to 
-   be able to query the `"computed"` value, and the `"used"` value. This is the case in for instance developer toolbars and such.
-
-
-> Note that this crate might be merged later on with the gosub_ccs3 crate. 
-
-# Css Property Definitions
-
-The CSS property definitions are generated from the CSS3 specification and MDN, and are stored in the `resources/definitions` folder.
-The tool to generate this data can be found in the `tools/generate_definitions` folder. The definitions are generated in a JSON format, 
-which is then parsed on each run for now. Each property holds a `CSS Syntax Tree` that is used to match against CSS values. 
-
-An example definition looks like this:
-
-```json
-    {
-      "name": "border-clip-top",
-      "syntax": "normal | [ <length-percentage [0,∞]> | <flex> ]+",
-      "computed": [],
-      "initial": "normal",
-      "inherited": false
-    }
-```
-
-This defines the `border-clip-top` property. It's syntax tells us that it can have the value `normal`, or a list of `<length-percentage>` or `<flex>` 
-values. The bracketed values are actually other properties or values that are definined in the json as well. Some of these values are built-in properties, 
-like `<length>`, `<string>`, `<number>` etc.
-
-There are no computed values, meaning normally that there are no special rules for computing the value, and that there are no shorthand elements.
-For instance, the `"border"` property has three computed elements: `border-color`, `border-style` and `border-width`, and thus results in three different
-properties to be filled as well.
-
-The initial value of `border-clip-top` is `normal`, and it is not inherited, so it does not inherit the value from the parent element.
-
-
-# Css Value Syntax Parser 
-
-In order to check if the CSS property value is correct, we first need to parse the value syntax for that property. Even though this syntax is fairly 
-simple in setup, we use a nom-parser system (`syntax.rs`) to parse the syntax. This results in a `CSS Syntax Tree` that can be used to match against 
-the CSS values. This syntax matching is done within `syntax_matcher.rs`.
diff --git a/crates/gosub_styling/src/errors.rs b/crates/gosub_styling/src/errors.rs
deleted file mode 100644
index 3e3187039..000000000
--- a/crates/gosub_styling/src/errors.rs
+++ /dev/null
@@ -1,8 +0,0 @@
-//! Error results that can be returned from the Gosub styling module
-use thiserror::Error;
-
-#[derive(Debug, Error)]
-pub enum Error {
-    #[error("css: compilation error: {0}")]
-    CssCompile(String),
-}
diff --git a/crates/gosub_styling/src/functions.rs b/crates/gosub_styling/src/functions.rs
deleted file mode 100644
index 7e0dfe812..000000000
--- a/crates/gosub_styling/src/functions.rs
+++ /dev/null
@@ -1,7 +0,0 @@
-pub use attr::*;
-pub use calc::*;
-pub use var::*;
-
-mod attr;
-mod calc;
-mod var;
diff --git a/crates/gosub_styling/src/functions/attr.rs b/crates/gosub_styling/src/functions/attr.rs
deleted file mode 100644
index 56ca22797..000000000
--- a/crates/gosub_styling/src/functions/attr.rs
+++ /dev/null
@@ -1,26 +0,0 @@
-use gosub_css3::stylesheet::CssValue;
-use gosub_html5::node::Node;
-
-pub fn resolve_attr(values: &[CssValue], node: &Node) -> Vec<CssValue> {
-    let Some(attr_name) = values.first().map(|v| v.to_string()) else {
-        return vec![];
-    };
-
-    let ty = values.get(1).cloned();
-
-    let Some(attr_value) = node.get_attribute(&attr_name) else {
-        let _default_value = values.get(2).cloned();
-
-        if let Some(ty) = ty {
-            return vec![ty];
-        }
-
-        return vec![];
-    };
-
-    let Ok(value) = CssValue::parse_str(attr_value) else {
-        return vec![];
-    };
-
-    vec![value]
-}
diff --git a/crates/gosub_styling/src/lib.rs b/crates/gosub_styling/src/lib.rs
deleted file mode 100644
index 3ca26bbe9..000000000
--- a/crates/gosub_styling/src/lib.rs
+++ /dev/null
@@ -1,34 +0,0 @@
-//! Styling functionality
-//!
-//! This crate connects CSS3 and HTML5 into a styling pipeline
-//!
-
-use gosub_css3::convert::ast_converter::convert_ast_to_stylesheet;
-use gosub_css3::parser_config::ParserConfig;
-use gosub_css3::stylesheet::{CssOrigin, CssStylesheet};
-use gosub_css3::Css3;
-
-mod errors;
-mod functions;
-pub mod property_definitions;
-pub mod render_tree;
-mod shorthands;
-pub mod styling;
-mod syntax;
-mod syntax_matcher;
-
-/// Loads the default user agent stylesheet
-pub fn load_default_useragent_stylesheet() -> anyhow::Result<CssStylesheet> {
-    // @todo: we should be able to browse to gosub:useragent.css and see the actual useragent css file
-    let location = "gosub:useragent.css";
-    let config = ParserConfig {
-        source: Some(String::from(location)),
-        ignore_errors: true,
-        ..Default::default()
-    };
-
-    let css = include_str!("../resources/useragent.css");
-    let css_ast = Css3::parse(css, config).expect("Could not parse useragent stylesheet");
-
-    convert_ast_to_stylesheet(&css_ast, CssOrigin::UserAgent, location)
-}
diff --git a/crates/gosub_styling/src/render_tree.rs b/crates/gosub_styling/src/render_tree.rs
deleted file mode 100644
index 4529e3f31..000000000
--- a/crates/gosub_styling/src/render_tree.rs
+++ /dev/null
@@ -1,1043 +0,0 @@
-use std::collections::HashMap;
-use std::fmt::{Debug, Formatter};
-
-use log::warn;
-
-use gosub_css3::stylesheet::{CssDeclaration, CssStylesheet, CssValue, Specificity};
-use gosub_html5::node::data::element::ElementData;
-use gosub_html5::node::{NodeData, NodeId};
-use gosub_html5::parser::document::{Document, DocumentHandle, TreeIterator};
-use gosub_render_backend::geo::Size;
-use gosub_render_backend::layout::{HasTextLayout, Layout, LayoutTree, Layouter, Node, TextLayout};
-use gosub_shared::types::Result;
-
-use crate::functions::{resolve_attr, resolve_calc, resolve_var};
-use crate::property_definitions::get_css_definitions;
-use crate::shorthands::FixList;
-use crate::styling::{
-    match_selector, prop_is_inherit, CssProperties, CssProperty, DeclarationProperty,
-};
-
-mod desc;
-
-const INLINE_ELEMENTS: [&str; 31] = [
-    "a", "abbr", "acronym", "b", "bdo", "big", "br", "button", "cite", "code", "dfn", "em", "i",
-    "img", "input", "kbd", "label", "map", "object", "q", "samp", "script", "select", "small",
-    "span", "strong", "sub", "sup", "textarea", "tt", "var",
-];
-
-/// Map of all declared values for all nodes in the document
-#[derive(Debug)]
-pub struct RenderTree<L: Layouter> {
-    pub nodes: HashMap<NodeId, RenderTreeNode<L>>,
-    pub root: NodeId,
-    pub dirty: bool,
-    next_id: NodeId,
-}
-
-#[allow(unused)]
-impl<L: Layouter> LayoutTree<L> for RenderTree<L> {
-    type NodeId = NodeId;
-
-    type Node = RenderTreeNode<L>;
-
-    fn children(&self, id: Self::NodeId) -> Option<Vec<Self::NodeId>> {
-        self.get_children(id).cloned()
-    }
-
-    fn contains(&self, id: &Self::NodeId) -> bool {
-        self.nodes.contains_key(id)
-    }
-
-    fn child_count(&self, id: Self::NodeId) -> usize {
-        self.child_count(id)
-    }
-
-    fn parent_id(&self, id: Self::NodeId) -> Option<Self::NodeId> {
-        self.get_node(id).and_then(|node| node.parent)
-    }
-
-    fn get_cache(&self, id: Self::NodeId) -> Option<&L::Cache> {
-        self.get_node(id).map(|node| &node.cache)
-    }
-
-    fn get_layout(&self, id: Self::NodeId) -> Option<&L::Layout> {
-        self.get_node(id).map(|node| &node.layout)
-    }
-
-    fn get_cache_mut(&mut self, id: Self::NodeId) -> Option<&mut L::Cache> {
-        self.get_node_mut(id).map(|node| &mut node.cache)
-    }
-
-    fn get_layout_mut(&mut self, id: Self::NodeId) -> Option<&mut L::Layout> {
-        self.get_node_mut(id).map(|node| &mut node.layout)
-    }
-
-    fn set_cache(&mut self, id: Self::NodeId, cache: L::Cache) {
-        if let Some(node) = self.get_node_mut(id) {
-            node.cache = cache;
-        }
-    }
-
-    fn set_layout(&mut self, id: Self::NodeId, layout: L::Layout) {
-        if let Some(node) = self.get_node_mut(id) {
-            node.layout = layout;
-        }
-    }
-
-    fn style_dirty(&self, id: Self::NodeId) -> bool {
-        self.get_node(id).map(|node| node.css_dirty).unwrap_or(true)
-    }
-
-    fn clean_style(&mut self, id: Self::NodeId) {
-        if let Some(node) = self.get_node_mut(id) {
-            node.css_dirty = false;
-        }
-    }
-
-    fn get_node(&mut self, id: Self::NodeId) -> Option<&mut Self::Node> {
-        self.get_node_mut(id)
-    }
-}
-
-impl<L: Layouter> RenderTree<L> {
-    // Generates a new render tree with a root node
-    pub fn with_capacity(capacity: usize) -> Self {
-        let mut tree = Self {
-            nodes: HashMap::with_capacity(capacity),
-            root: NodeId::root(),
-            dirty: false,
-            next_id: NodeId::from(1u64),
-        };
-
-        tree.insert_node(
-            NodeId::root(),
-            RenderTreeNode {
-                id: NodeId::root(),
-                properties: CssProperties::new(),
-                css_dirty: true,
-                children: Vec::new(),
-                parent: None,
-                name: String::from("root"),
-                namespace: None,
-                data: RenderNodeData::Document,
-                cache: L::Cache::default(),
-                layout: L::Layout::default(),
-            },
-        );
-
-        tree
-    }
-
-    /// Returns the root node of the render tree
-    pub fn get_root(&self) -> &RenderTreeNode<L> {
-        self.nodes.get(&self.root).expect("root node")
-    }
-
-    /// Returns the node with the given id
-    pub fn get_node(&self, id: NodeId) -> Option<&RenderTreeNode<L>> {
-        self.nodes.get(&id)
-    }
-
-    /// Returns a mutable reference to the node with the given id
-    pub fn get_node_mut(&mut self, id: NodeId) -> Option<&mut RenderTreeNode<L>> {
-        self.nodes.get_mut(&id)
-    }
-
-    /// Returns the children of the given node
-    pub fn get_children(&self, id: NodeId) -> Option<&Vec<NodeId>> {
-        self.nodes.get(&id).map(|node| &node.children)
-    }
-
-    /// Returns the children of the given node
-    pub fn child_count(&self, id: NodeId) -> usize {
-        self.nodes
-            .get(&id)
-            .map(|node| node.children.len())
-            .unwrap_or(0)
-    }
-
-    /// Inserts a new node into the render tree, note that you are responsible for the node id
-    /// and the children of the node
-    pub fn insert_node(&mut self, id: NodeId, node: RenderTreeNode<L>) {
-        self.nodes.insert(id, node);
-    }
-
-    /// Deletes the node with the given id from the render tree
-    pub fn delete_node(&mut self, id: &NodeId) -> Option<(NodeId, RenderTreeNode<L>)> {
-        // println!("Deleting node: {id:?}");
-
-        if let Some(n) = self.nodes.get(id) {
-            let parent = n.parent;
-
-            if let Some(parent) = parent {
-                if let Some(parent_node) = self.nodes.get_mut(&parent) {
-                    parent_node.children.retain(|child| child != id);
-                }
-            }
-
-            self.nodes.remove_entry(id)
-        } else {
-            None
-        }
-    }
-
-    /// Returns a recursive list of all child node ids for the given node id
-    fn get_child_node_ids(&self, node_id: NodeId) -> Vec<NodeId> {
-        let mut result = vec![node_id];
-
-        let node = self.nodes.get(&node_id);
-        if node.is_none() {
-            return result;
-        }
-        node.expect("node").children.iter().for_each(|child| {
-            let mut childs = self.get_child_node_ids(*child);
-            result.append(&mut childs);
-        });
-
-        result
-    }
-
-    /// Mark the given node as dirty, so it will be recalculated
-    pub fn mark_dirty(&mut self, node_id: NodeId) {
-        if let Some(props) = self.nodes.get_mut(&node_id) {
-            for prop in props.properties.properties.values_mut() {
-                prop.mark_dirty();
-            }
-        }
-    }
-
-    /// Mark the given node as clean, so it will not be recalculated
-    pub fn mark_clean(&mut self, node_id: NodeId) {
-        if let Some(props) = self.nodes.get_mut(&node_id) {
-            for prop in props.properties.properties.values_mut() {
-                prop.mark_clean();
-            }
-        }
-    }
-
-    /// Retrieves the property for the given node, or None when not found
-    pub fn get_property(&self, node_id: NodeId, prop_name: &str) -> Option<CssProperty> {
-        let props = self.nodes.get(&node_id);
-        props?;
-
-        props
-            .expect("props")
-            .properties
-            .properties
-            .get(prop_name)
-            .cloned()
-    }
-
-    /// Retrieves the value for the given property for the given node, or None when not found
-    pub fn get_all_properties(&self, node_id: NodeId) -> Option<&CssProperties> {
-        self.nodes.get(&node_id).map(|props| &props.properties)
-    }
-
-    /// Generate a render tree from the given document
-    pub fn from_document(document: DocumentHandle) -> Self {
-        let mut render_tree = RenderTree::with_capacity(document.get().count_nodes());
-
-        render_tree.generate_from(document);
-
-        render_tree
-    }
-
-    fn generate_from(&mut self, mut document: DocumentHandle) {
-        // Iterate the complete document tree
-        let tree_iterator = TreeIterator::new(&document);
-
-        {
-            let doc = document.get();
-
-            println!("Stylesheets: {:?}", doc.stylesheets.len());
-
-            for stylesheet in &doc.stylesheets {
-                println!("   {:?}", stylesheet.location);
-                println!("   {:?}", stylesheet.origin);
-            }
-        }
-
-        for current_node_id in tree_iterator {
-            let mut css_map_entry = CssProperties::new();
-
-            let doc = document.get();
-            let node = doc.get_node_by_id(current_node_id).expect("node not found");
-
-            if node_is_undernderable(node) {
-                if let Some(parent) = node.parent {
-                    if let Some(parent) = self.get_node_mut(parent) {
-                        parent.children.retain(|id| *id != current_node_id);
-                        // continue
-                        //TODO: somehow we still can't continue here, I don't know why
-                    }
-                }
-
-                drop(doc);
-
-                let mut doc = document.get_mut();
-
-                doc.detach_node_from_parent(current_node_id);
-
-                continue;
-            }
-
-            let definitions = get_css_definitions();
-
-            let mut fix_list = FixList::new();
-
-            for sheet in document.get().stylesheets.iter() {
-                for rule in sheet.rules.iter() {
-                    for selector in rule.selectors().iter() {
-                        let (matched, specificity) = match_selector(
-                            DocumentHandle::clone(&document),
-                            current_node_id,
-                            selector,
-                        );
-
-                        if !matched {
-                            continue;
-                        }
-
-                        // Selector matched, so we add all declared values to the map
-                        for declaration in rule.declarations().iter() {
-                            // Step 1: find the property in our CSS definition list
-                            let Some(definition) = definitions.find_property(&declaration.property)
-                            else {
-                                // If not found, we skip this declaration
-                                warn!(
-                                    "Definition is not found for property {:?}",
-                                    declaration.property
-                                );
-                                continue;
-                            };
-
-                            let value = resolve_functions(&declaration.value, node, &doc);
-
-                            // Check if the declaration matches the definition and return the "expanded" order
-                            let res = definition.matches_and_shorthands(&value, &mut fix_list);
-                            if !res {
-                                warn!("Declaration does not match definition: {:?}", declaration);
-                                continue;
-                            }
-
-                            // create property for the given values
-                            let property_name = declaration.property.clone();
-                            let decl = CssDeclaration {
-                                property: property_name.to_string(),
-                                value,
-                                important: declaration.important,
-                            };
-
-                            add_property_to_map(
-                                &mut css_map_entry,
-                                sheet,
-                                specificity.clone(),
-                                &decl,
-                            );
-                        }
-                    }
-                }
-            }
-
-            fix_list.resolve_nested(definitions);
-
-            fix_list.apply(&mut css_map_entry);
-
-            let binding = document.get();
-            let current_node = binding.get_node_by_id(current_node_id).unwrap();
-
-            let data = || RenderNodeData::from_node_data(current_node.data.clone());
-
-            let data = match data() {
-                ControlFlow::Ok(data) => data,
-                ControlFlow::Drop => continue,
-                ControlFlow::Error(e) => {
-                    log::error!("Failed to create node data for node: {current_node_id:?} ({e}");
-                    continue;
-                }
-            };
-
-            let render_tree_node = RenderTreeNode {
-                id: current_node_id,
-                properties: css_map_entry,
-                children: current_node.children.clone(),
-                parent: node.parent,
-                name: node.name.clone(), // We might be able to move node into render_tree_node
-                namespace: node.namespace.clone(),
-                data,
-                css_dirty: true,
-                cache: L::Cache::default(),
-                layout: L::Layout::default(),
-            };
-
-            self.nodes.insert(current_node_id, render_tree_node);
-        }
-
-        self.next_id = document.get().peek_next_id();
-
-        self.remove_unrenderable_nodes();
-
-        self.resolve_inheritance(self.root, &Vec::new());
-
-        if L::COLLAPSE_INLINE {
-            self.collapse_inline(self.root);
-        }
-
-        // self.print_tree();
-    }
-
-    fn resolve_inheritance(&mut self, node_id: NodeId, inherit_props: &Vec<(String, CssValue)>) {
-        let Some(current_node) = self.get_node(node_id) else {
-            return;
-        };
-
-        for prop in inherit_props {
-            current_node
-                .properties
-                .properties
-                .entry(prop.0.clone())
-                .or_insert_with(|| {
-                    let mut p = CssProperty::new(prop.0.as_str());
-
-                    p.inherited = prop.1.clone();
-
-                    p
-                });
-        }
-
-        let mut inherit_props = inherit_props.clone();
-
-        'props: for (name, prop) in &mut current_node.properties.properties {
-            prop.compute_value();
-
-            let value = prop.actual.clone();
-
-            if prop_is_inherit(name) {
-                for (k, v) in &mut inherit_props {
-                    if k == name {
-                        *v = value;
-                        continue 'props;
-                    }
-                }
-
-                inherit_props.push((name.clone(), value));
-            }
-        }
-
-        let Some(children) = self.get_children(node_id) else {
-            return;
-        };
-
-        for child in children.clone() {
-            self.resolve_inheritance(child, &inherit_props);
-        }
-    }
-
-    /// Removes all unrenderable nodes from the render tree
-    fn remove_unrenderable_nodes(&mut self) {
-        // There are more elements that are not renderable, but for now we only remove the most common ones
-        let mut delete_list = Vec::new();
-
-        for id in self.nodes.keys() {
-            // Check CSS styles and remove if not renderable
-            if let Some(mut prop) = self.get_property(*id, "display") {
-                if prop.compute_value().to_string() == "none" {
-                    delete_list.append(&mut self.get_child_node_ids(*id));
-                    delete_list.push(*id);
-                    continue;
-                }
-            }
-        }
-
-        for id in delete_list {
-            self.delete_node(&id);
-        }
-    }
-
-    /// Collapse all inline elements / wrap inline elements with anonymous boxes
-    fn collapse_inline(&mut self, node_id: NodeId) {
-        let Some(node) = self.nodes.get(&node_id) else {
-            eprintln!("Node not found: {node_id}");
-            return;
-        };
-
-        let mut inline_wrapper = None;
-
-        for child_id in node.children.clone() {
-            let Some(child) = self.nodes.get_mut(&child_id) else {
-                eprintln!("Child not found: {child_id}");
-                continue;
-            };
-
-            if child.is_inline() {
-                if let Some(wrapper_id) = inline_wrapper {
-                    let old_parent = child.parent;
-                    child.parent = Some(wrapper_id);
-
-                    let Some(wrapper) = self.nodes.get_mut(&wrapper_id) else {
-                        eprintln!("Wrapper not found: {wrapper_id}");
-                        continue;
-                    };
-
-                    wrapper.children.push(child_id);
-
-                    if let Some(old_parent) = old_parent {
-                        let Some(old_parent) = self.nodes.get_mut(&old_parent) else {
-                            eprintln!("Old parent not found: {old_parent}");
-                            continue;
-                        };
-
-                        old_parent.children.retain(|id| *id != child_id);
-                    }
-                } else {
-                    let wrapper_node = RenderTreeNode {
-                        id: self.next_id,
-                        properties: CssProperties::new(),
-                        css_dirty: true,
-                        children: vec![child_id],
-                        parent: Some(node_id),
-                        name: "#anonymous".to_string(),
-                        namespace: None,
-                        data: RenderNodeData::AnonymousInline,
-                        cache: L::Cache::default(),
-                        layout: L::Layout::default(),
-                    };
-                    let id = wrapper_node.id;
-
-                    self.next_id = self.next_id.next();
-
-                    let old_parent = child.parent;
-                    child.parent = Some(id);
-                    inline_wrapper = Some(id);
-
-                    self.nodes.insert(id, wrapper_node);
-
-                    if let Some(old_parent) = old_parent {
-                        let Some(old_parent) = self.nodes.get_mut(&old_parent) else {
-                            eprintln!("Old parent not found: {old_parent}");
-                            continue;
-                        };
-
-                        if let Some(pos) = old_parent.children.iter().position(|id| *id == child_id)
-                        {
-                            old_parent.children[pos] = id;
-                        }
-                    }
-                }
-            } else {
-                inline_wrapper = None;
-            }
-
-            self.collapse_inline(child_id)
-        }
-    }
-
-    pub fn print_tree(&self) {
-        self.print_tree_from(self.root, 0);
-    }
-
-    fn print_tree_from(&self, node_id: NodeId, depth: usize) {
-        let Some(node) = self.nodes.get(&node_id) else {
-            return;
-        };
-        let indent = "  ".repeat(depth);
-
-        let size = node.layout.size();
-        let w = size.width;
-        let h = size.height;
-
-        let pos = node.layout.rel_pos();
-        let x = pos.x;
-        let y = pos.y;
-
-        println!("{indent}{node_id}: {} @ ({x}:{y}) [{w}x{h}]", node.name);
-
-        for child_id in &node.children {
-            self.print_tree_from(*child_id, depth + 1);
-        }
-    }
-}
-
-// Generates a declaration property and adds it to the css_map_entry
-pub fn add_property_to_map(
-    css_map_entry: &mut CssProperties,
-    sheet: &CssStylesheet,
-    specificity: Specificity,
-    declaration: &CssDeclaration,
-) {
-    let property_name = declaration.property.clone();
-    // let entry = CssProperty::new(property_name.as_str());
-
-    // If the property is a shorthand css property, we need fetch the individual properties
-    // It's possible that need to recurse here as these individual properties can be shorthand as well
-    // if entry.is_shorthand() {
-    //     for property_name in entry.get_props_from_shorthand() {
-    //         let decl = CssDeclaration {
-    //             property: property_name.to_string(),
-    //             value: declaration.value.clone(),
-    //             important: declaration.important,
-    //         };
-    //
-    //         add_property_to_map(css_map_entry, sheet, selector, &decl);
-    //     }
-    // }
-    //
-    let declaration = DeclarationProperty {
-        // @todo: this seems wrong. We only get the first values from the declared values
-        value: declaration.value.first().unwrap().clone(),
-        origin: sheet.origin.clone(),
-        important: declaration.important,
-        location: sheet.location.clone(),
-        specificity,
-    };
-
-    if let std::collections::hash_map::Entry::Vacant(e) =
-        css_map_entry.properties.entry(property_name.clone())
-    {
-        // Generate new property in the css map
-        let mut entry = CssProperty::new(property_name.as_str());
-        entry.declared.push(declaration);
-        e.insert(entry);
-    } else {
-        // Just add the declaration to the existing property
-        let entry = css_map_entry.properties.get_mut(&property_name).unwrap();
-        entry.declared.push(declaration);
-    }
-}
-
-pub enum RenderNodeData<L: Layouter> {
-    Document,
-    Element(Box<ElementData>),
-    Text(Box<TextData<L>>),
-    AnonymousInline,
-}
-
-impl<L: Layouter> Debug for RenderNodeData<L> {
-    fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
-        match self {
-            RenderNodeData::Document => f.write_str("Document"),
-            RenderNodeData::Element(data) => {
-                f.debug_struct("ElementData").field("data", data).finish()
-            }
-            RenderNodeData::Text(data) => f.debug_struct("TextData").field("data", data).finish(),
-            RenderNodeData::AnonymousInline => f.write_str("AnonymousInline"),
-        }
-    }
-}
-
-pub struct TextData<L: Layouter> {
-    pub text: String,
-    pub layout: Option<L::TextLayout>,
-}
-
-impl<L: Layouter> Debug for TextData<L> {
-    fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
-        f.debug_struct("TextData")
-            .field("text", &self.text)
-            .field("layout", &self.layout.as_ref().map(|x| x.dbg_layout()))
-            .finish()
-    }
-}
-
-pub enum ControlFlow<T> {
-    Ok(T),
-    Drop,
-    Error(anyhow::Error),
-}
-
-impl<L: Layouter> RenderNodeData<L> {
-    pub fn from_node_data(node: NodeData) -> ControlFlow<Self> {
-        ControlFlow::Ok(match node {
-            NodeData::Element(data) => RenderNodeData::Element(data),
-            NodeData::Text(data) => {
-                let text = pre_transform_text(data.value);
-
-                RenderNodeData::Text(Box::new(TextData { text, layout: None }))
-            }
-            NodeData::Document(_) => RenderNodeData::Document,
-            _ => return ControlFlow::Drop,
-        })
-    }
-}
-
-fn pre_transform_text(text: String) -> String {
-    let mut new_text = String::with_capacity(text.len());
-
-    let mut last_was_ws = false;
-    for c in text.chars() {
-        if c.is_whitespace() {
-            if !last_was_ws {
-                new_text.push(' ');
-                last_was_ws = true;
-            }
-        } else {
-            new_text.push(c);
-            last_was_ws = false;
-        }
-    }
-
-    new_text
-}
-
-pub struct RenderTreeNode<L: Layouter> {
-    pub id: NodeId,
-    pub properties: CssProperties,
-    pub css_dirty: bool,
-    pub children: Vec<NodeId>,
-    pub parent: Option<NodeId>,
-    pub name: String,
-    pub namespace: Option<String>,
-    pub data: RenderNodeData<L>,
-    pub cache: L::Cache,
-    pub layout: L::Layout,
-}
-
-impl<L: Layouter> Debug for RenderTreeNode<L> {
-    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
-        f.debug_struct("RenderTreeNode")
-            .field("id", &self.id)
-            .field("properties", &self.properties)
-            .field("css_dirty", &self.css_dirty)
-            .field("children", &self.children)
-            .field("parent", &self.parent)
-            .field("name", &self.name)
-            .field("namespace", &self.namespace)
-            .field("data", &self.data)
-            .finish()
-    }
-}
-
-impl<L: Layouter> RenderTreeNode<L> {
-    /// Returns true if the node is an element node
-    pub fn is_element(&self) -> bool {
-        matches!(self.data, RenderNodeData::Element(_))
-    }
-
-    /// Returns true if the node is a text node
-    pub fn is_text(&self) -> bool {
-        matches!(self.data, RenderNodeData::Text(_))
-    }
-
-    /// Returns the requested property for the node
-    pub fn get_property(&mut self, prop_name: &str) -> Option<&mut CssProperty> {
-        self.properties.properties.get_mut(prop_name)
-    }
-
-    /// Returns the requested attribute for the node
-    pub fn get_attribute(&self, attr_name: &str) -> Option<&String> {
-        match &self.data {
-            RenderNodeData::Element(element) => element.attributes.get(attr_name),
-            _ => None,
-        }
-    }
-
-    pub fn is_inline(&mut self) -> bool {
-        if matches!(self.data, RenderNodeData::Text(_)) {
-            return true;
-        }
-
-        if let Some(d) = self.properties.get("display").and_then(|prop| {
-            let CssValue::String(val) = &prop.actual else {
-                return None;
-            };
-
-            // const NON_INLINE_DISPLAYS: [&str; 6] = ["block", "flex", "grid", "table", "list-item", "none"];
-            // if NON_INLINE_DISPLAYS.contains(&val.as_str()) {
-            //     return Some(false);
-            // } //TODO: somehow this causes problems with the inline elements
-
-            if val == "inline"
-                || val == "inline-block"
-                || val == "inline-table"
-                || val == "inline-flex"
-            {
-                return Some(true);
-            }
-
-            None
-        }) {
-            return d;
-        }
-
-        let tag_name = self.name.to_lowercase();
-
-        INLINE_ELEMENTS.contains(&tag_name.as_str())
-    }
-}
-
-impl<L: Layouter> HasTextLayout<L> for RenderTreeNode<L> {
-    fn set_text_layout(&mut self, layout: L::TextLayout) {
-        if let RenderNodeData::Text(text) = &mut self.data {
-            text.layout = Some(layout);
-        }
-    }
-}
-
-impl<L: Layouter> Node for RenderTreeNode<L> {
-    type Property = CssProperty;
-
-    fn get_property(&mut self, name: &str) -> Option<&mut Self::Property> {
-        self.properties.properties.get_mut(name)
-    }
-    fn text_data(&self) -> Option<&str> {
-        if let RenderNodeData::Text(text) = &self.data {
-            Some(&text.text)
-        } else {
-            None
-        }
-    }
-
-    fn text_size(&self) -> Option<Size> {
-        if let RenderNodeData::Text(text) = &self.data {
-            text.layout.as_ref().map(|layout| layout.size())
-        } else {
-            None
-        }
-    }
-
-    fn is_anon_inline_parent(&self) -> bool {
-        matches!(self.data, RenderNodeData::AnonymousInline)
-    }
-}
-
-pub struct Value(pub CssValue);
-
-impl gosub_render_backend::layout::CssProperty for CssProperty {
-    type Value = Value;
-
-    fn compute_value(&mut self) {
-        self.compute_value();
-    }
-    fn unit_to_px(&self) -> f32 {
-        self.actual.unit_to_px()
-    }
-
-    fn as_string(&self) -> Option<&str> {
-        if let CssValue::String(str) = &self.actual {
-            Some(str)
-        } else {
-            None
-        }
-    }
-
-    fn as_percentage(&self) -> Option<f32> {
-        if let CssValue::Percentage(percent) = &self.actual {
-            Some(*percent)
-        } else {
-            None
-        }
-    }
-
-    fn as_unit(&self) -> Option<(f32, &str)> {
-        if let CssValue::Unit(value, unit) = &self.actual {
-            Some((*value, unit))
-        } else {
-            None
-        }
-    }
-
-    fn as_color(&self) -> Option<(f32, f32, f32, f32)> {
-        if let CssValue::Color(color) = &self.actual {
-            Some((color.r, color.g, color.b, color.a))
-        } else {
-            None
-        }
-    }
-
-    fn parse_color(&self) -> Option<(f32, f32, f32, f32)> {
-        self.actual
-            .to_color()
-            .map(|color| (color.r, color.g, color.b, color.a))
-    }
-
-    fn as_number(&self) -> Option<f32> {
-        if let CssValue::Number(num) = &self.actual {
-            Some(*num)
-        } else {
-            None
-        }
-    }
-
-    fn as_list(&self) -> Option<Vec<Self::Value>> {
-        if let CssValue::List(list) = &self.actual {
-            Some(list.iter().map(|v| v.clone().into()).collect())
-        } else {
-            None
-        }
-    }
-
-    fn is_none(&self) -> bool {
-        matches!(self.actual, CssValue::None)
-    }
-}
-
-impl gosub_render_backend::layout::CssValue for Value {
-    fn unit_to_px(&self) -> f32 {
-        self.0.unit_to_px()
-    }
-
-    fn as_string(&self) -> Option<&str> {
-        if let CssValue::String(str) = &self.0 {
-            Some(str)
-        } else {
-            None
-        }
-    }
-
-    fn as_percentage(&self) -> Option<f32> {
-        if let CssValue::Percentage(percent) = &self.0 {
-            Some(*percent)
-        } else {
-            None
-        }
-    }
-
-    fn as_unit(&self) -> Option<(f32, &str)> {
-        if let CssValue::Unit(value, unit) = &self.0 {
-            Some((*value, unit))
-        } else {
-            None
-        }
-    }
-
-    fn as_color(&self) -> Option<(f32, f32, f32, f32)> {
-        if let CssValue::Color(color) = &self.0 {
-            Some((color.r, color.g, color.b, color.a))
-        } else {
-            None
-        }
-    }
-
-    fn as_number(&self) -> Option<f32> {
-        if let CssValue::Number(num) = &self.0 {
-            Some(*num)
-        } else {
-            None
-        }
-    }
-
-    fn as_list(&self) -> Option<Vec<Self>> {
-        if let CssValue::List(list) = &self.0 {
-            Some(list.iter().map(|v| v.clone().into()).collect())
-        } else {
-            None
-        }
-    }
-
-    fn is_none(&self) -> bool {
-        matches!(self.0, CssValue::None)
-    }
-}
-
-impl From<CssValue> for Value {
-    fn from(val: CssValue) -> Self {
-        Value(val)
-    }
-}
-
-/// Generates a render tree for the given document based on its loaded stylesheets
-pub fn generate_render_tree<L: Layouter>(document: DocumentHandle) -> Result<RenderTree<L>> {
-    let render_tree = RenderTree::from_document(document);
-
-    Ok(render_tree)
-}
-
-pub fn node_is_undernderable(node: &gosub_html5::node::Node) -> bool {
-    // There are more elements that are not renderable, but for now we only remove the most common ones
-
-    const REMOVABLE_ELEMENTS: [&str; 6] = ["head", "script", "style", "svg", "noscript", "title"];
-
-    if let NodeData::Element(element) = &node.data {
-        if REMOVABLE_ELEMENTS.contains(&element.name.as_str()) {
-            return true;
-        }
-    }
-
-    if let NodeData::Text(text) = &node.data {
-        if text.value.chars().all(|c| c.is_whitespace()) {
-            return true;
-        }
-    }
-
-    false
-}
-
-pub fn resolve_functions(
-    value: &[CssValue],
-    node: &gosub_html5::node::Node,
-    doc: &Document,
-) -> Vec<CssValue> {
-    let mut result = Vec::with_capacity(value.len()); //TODO: we could give it a &mut Vec and reuse the allocation
-
-    for val in value {
-        match val {
-            CssValue::Function(func, values) => {
-                let resolved = match func.as_str() {
-                    "calc" => resolve_calc(values),
-                    "attr" => resolve_attr(values, node),
-                    "var" => resolve_var(values, doc, node),
-                    _ => vec![val.clone()],
-                };
-
-                result.extend(resolved);
-            }
-            _ => result.push(val.clone()),
-        }
-    }
-
-    result
-}
-
-// pub fn walk_render_tree(tree: &RenderTree, visitor: &mut Box<dyn TreeVisitor<RenderTreeNode>>) {
-//     let root = tree.get_root();
-//     internal_walk_render_tree(tree, root, visitor);
-// }
-//
-// fn internal_walk_render_tree(
-//     tree: &RenderTree,
-//     node: &RenderTreeNode,
-//     visitor: &mut Box<dyn TreeVisitor<RenderTreeNode>>,
-// ) {
-//     // Enter node
-//     match &node.data {
-//         RenderNodeData::Document(document) => visitor.document_enter(tree, node, document),
-//         RenderNodeData::DocType(doctype) => visitor.doctype_enter(tree, node, doctype),
-//         RenderNodeData::Text(text) => visitor.text_enter(tree, node, &text.into()),
-//         RenderNodeData::Comment(comment) => visitor.comment_enter(tree, node, comment),
-//         RenderNodeData::Element(element) => visitor.element_enter(tree, node, element),
-//     }
-//
-//     for child_id in &node.children {
-//         if tree.nodes.contains_key(child_id) {
-//             let child_node = tree.nodes.get(child_id).expect("node");
-//             internal_walk_render_tree(tree, child_node, visitor);
-//         }
-//     }
-//
-//     // Leave node
-//     match &node.data {
-//         RenderNodeData::Document(document) => visitor.document_leave(tree, node, document),
-//         RenderNodeData::DocType(doctype) => visitor.doctype_leave(tree, node, doctype),
-//         RenderNodeData::Text(text) => visitor.text_leave(tree, node, &text.into()),
-//         RenderNodeData::Comment(comment) => visitor.comment_leave(tree, node, comment),
-//         RenderNodeData::Element(element) => visitor.element_leave(tree, node, element),
-//     }
-// }
-//
-// pub trait TreeVisitor<Node> {
-//     fn document_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocumentData);
-//     fn document_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocumentData);
-//
-//     fn doctype_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocTypeData);
-//     fn doctype_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &DocTypeData);
-//
-//     fn text_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &TextData);
-//     fn text_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &TextData);
-//
-//     fn comment_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &CommentData);
-//     fn comment_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &CommentData);
-//
-//     fn element_enter(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &ElementData);
-//     fn element_leave(&mut self, tree: &RenderTree, node: &RenderTreeNode, data: &ElementData);
-// }
diff --git a/crates/gosub_svg/Cargo.toml b/crates/gosub_svg/Cargo.toml
index bae8ad0c0..a5862bc0c 100644
--- a/crates/gosub_svg/Cargo.toml
+++ b/crates/gosub_svg/Cargo.toml
@@ -2,16 +2,16 @@
 name = "gosub_svg"
 version = "0.1.0"
 edition = "2021"
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
 
 [dependencies]
-tiny-skia = "0.11.4"
 gosub_shared = { path = "../gosub_shared" }
 gosub_html5 = { path = "../gosub_html5" }
 gosub_render_backend = { path = "../gosub_render_backend" }
+tiny-skia = "0.11.4"
 resvg = { version = "0.43.0", optional = true }
 anyhow = "1.0.89"
 
-
-
 [features]
 resvg = ["dep:resvg"]
diff --git a/crates/gosub_svg/src/lib.rs b/crates/gosub_svg/src/lib.rs
index 33b9f2fe9..9c1e3b1b1 100644
--- a/crates/gosub_svg/src/lib.rs
+++ b/crates/gosub_svg/src/lib.rs
@@ -1,6 +1,8 @@
 use ::resvg::usvg;
-
-use gosub_html5::{node::NodeId, parser::document::DocumentHandle};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
 use gosub_shared::types::Result;
 
 #[cfg(feature = "resvg")]
@@ -13,16 +15,16 @@ pub struct SVGDocument {
 impl SVGDocument {
     #[allow(clippy::should_implement_trait)]
     pub fn from_str(svg: &str) -> Result<Self> {
-        let opts = usvg::Options {
-            ..Default::default()
-        };
+        let opts = usvg::Options { ..Default::default() };
 
         let tree = usvg::Tree::from_str(svg, &opts)?;
         Ok(Self { tree })
     }
 
-    pub fn from_html_doc(id: NodeId, doc: DocumentHandle) -> Result<Self> {
-        let str = doc.get().write_from_node(id);
+    pub fn from_html_doc<D: Document<C>, C: CssSystem>(id: NodeId, doc: DocumentHandle<D, C>) -> Result<Self> {
+        let doc = doc.get();
+
+        let str = doc.write_from_node(id);
 
         Self::from_str(&str)
     }
diff --git a/crates/gosub_svg/src/resvg.rs b/crates/gosub_svg/src/resvg.rs
index 4857cfb90..648ecf573 100644
--- a/crates/gosub_svg/src/resvg.rs
+++ b/crates/gosub_svg/src/resvg.rs
@@ -1,11 +1,13 @@
 use anyhow::anyhow;
 use tiny_skia::Pixmap;
 
-use gosub_html5::node::NodeId;
-use gosub_html5::parser::document::DocumentHandle;
 use gosub_render_backend::geo::FP;
 use gosub_render_backend::svg::SvgRenderer;
 use gosub_render_backend::{Image, ImageBuffer, RenderBackend};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
 use gosub_shared::types::{Result, Size};
 
 use crate::SVGDocument;
@@ -23,7 +25,10 @@ impl<B: RenderBackend> SvgRenderer<B> for Resvg {
         SVGDocument::from_str(&data)
     }
 
-    fn parse_internal(tree: DocumentHandle, id: NodeId) -> Result<Self::SvgDocument> {
+    fn parse_internal<D: Document<C>, C: CssSystem>(
+        tree: DocumentHandle<D, C>,
+        id: NodeId,
+    ) -> Result<Self::SvgDocument> {
         SVGDocument::from_html_doc(id, tree)
     }
 
@@ -34,11 +39,7 @@ impl<B: RenderBackend> SvgRenderer<B> for Resvg {
         self.render_with_size(doc, size)
     }
 
-    fn render_with_size(
-        &mut self,
-        doc: &Self::SvgDocument,
-        size: Size<u32>,
-    ) -> Result<ImageBuffer<B>> {
+    fn render_with_size(&mut self, doc: &Self::SvgDocument, size: Size<u32>) -> Result<ImageBuffer<B>> {
         let img: B::Image = Self::render_to_image::<B>(self, doc, size)?;
 
         Ok(ImageBuffer::Image(img))
@@ -46,19 +47,10 @@ impl<B: RenderBackend> SvgRenderer<B> for Resvg {
 }
 
 impl Resvg {
-    pub fn render_to_image<B: RenderBackend>(
-        &mut self,
-        doc: &SVGDocument,
-        size: Size<u32>,
-    ) -> Result<B::Image> {
-        let mut pixmap = Pixmap::new(size.width, size.height)
-            .ok_or_else(|| anyhow!("Failed to create pixmap"))?;
-
-        resvg::render(
-            &doc.tree,
-            tiny_skia::Transform::default(),
-            &mut pixmap.as_mut(),
-        );
+    pub fn render_to_image<B: RenderBackend>(&mut self, doc: &SVGDocument, size: Size<u32>) -> Result<B::Image> {
+        let mut pixmap = Pixmap::new(size.width, size.height).ok_or_else(|| anyhow!("Failed to create pixmap"))?;
+
+        resvg::render(&doc.tree, tiny_skia::Transform::default(), &mut pixmap.as_mut());
 
         Ok(tiny_skia_pixmap_to_img::<B>(pixmap))
     }
diff --git a/crates/gosub_taffy/Cargo.toml b/crates/gosub_taffy/Cargo.toml
index d6c3b3b8c..76802bd7d 100644
--- a/crates/gosub_taffy/Cargo.toml
+++ b/crates/gosub_taffy/Cargo.toml
@@ -2,11 +2,12 @@
 name = "gosub_taffy"
 version = "0.1.0"
 edition = "2021"
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
 
 [dependencies]
 gosub_shared = { path = "../gosub_shared" }
 gosub_render_backend = { path = "../gosub_render_backend" }
-gosub_styling = { path = "../gosub_styling" }
 gosub_typeface = { path = "../gosub_typeface" }
 taffy = "0.5.2"
 anyhow = "1.0.89"
diff --git a/crates/gosub_taffy/src/compute/inline.rs b/crates/gosub_taffy/src/compute/inline.rs
index f2d6f27ec..0d62d8f49 100644
--- a/crates/gosub_taffy/src/compute/inline.rs
+++ b/crates/gosub_taffy/src/compute/inline.rs
@@ -5,14 +5,13 @@ use parley::layout::{Alignment, PositionedLayoutItem};
 use parley::style::{FontSettings, FontStack, FontStyle, FontVariation, FontWeight, StyleProperty};
 use parley::{FontContext, InlineBox, LayoutContext};
 use taffy::{
-    AvailableSpace, CollapsibleMarginSet, Layout, LayoutInput, LayoutOutput, LayoutPartialTree,
-    NodeId, Point, Rect, RunMode, Size,
+    AvailableSpace, CollapsibleMarginSet, Layout, LayoutInput, LayoutOutput, LayoutPartialTree, NodeId, Point, Rect,
+    RunMode, Size,
 };
 
 use gosub_render_backend::geo;
-use gosub_render_backend::layout::{
-    CssProperty, CssValue, Decoration, DecorationStyle, HasTextLayout, LayoutTree, Node,
-};
+use gosub_render_backend::layout::{Decoration, DecorationStyle, HasTextLayout, LayoutTree, Node};
+use gosub_shared::traits::css3::{CssProperty, CssValue};
 use gosub_typeface::font::Glyph;
 
 use crate::text::{Font, TextLayout};
@@ -63,10 +62,7 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
                 .map(|s| s.to_string())
                 .unwrap_or("sans-serif".to_string());
 
-            let font_size = node
-                .get_property("font-size")
-                .map(|s| s.unit_to_px())
-                .unwrap_or(16.0);
+            let font_size = node.get_property("font-size").map(|s| s.unit_to_px()).unwrap_or(16.0);
 
             let alignment = parse_alignment(node);
 
@@ -142,10 +138,7 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
                         decoration_color = c;
                     }
 
-                    if let Some(o) = node
-                        .get_property("text-underline-offset")
-                        .map(|s| s.unit_to_px())
-                    {
+                    if let Some(o) = node.get_property("text-underline-offset").map(|s| s.unit_to_px()) {
                         underline_offset = o;
                     }
                 }
@@ -221,9 +214,7 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
     let mut align = Alignment::default();
 
     if let Some(default) = text_node_data.first() {
-        builder.push_default(&StyleProperty::FontStack(FontStack::Source(
-            &default.font_family,
-        )));
+        builder.push_default(&StyleProperty::FontStack(FontStack::Source(&default.font_family)));
         builder.push_default(&StyleProperty::FontSize(default.font_size));
         if let Some(line_height) = default.line_height {
             builder.push_default(&StyleProperty::LineHeight(line_height));
@@ -236,31 +227,23 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
         }
         builder.push_default(&StyleProperty::FontWeight(default.font_weight));
         builder.push_default(&StyleProperty::FontStyle(default.font_style));
-        builder.push_default(&StyleProperty::FontVariations(FontSettings::List(
-            &default.var_axes,
-        )));
+        builder.push_default(&StyleProperty::FontVariations(FontSettings::List(&default.var_axes)));
 
         if default.decoration.overline && default.decoration.underline {
             builder.push_default(&StyleProperty::Underline(true));
 
-            builder.push_default(&StyleProperty::UnderlineSize(Some(
-                default.decoration.width * 2.0,
-            )));
+            builder.push_default(&StyleProperty::UnderlineSize(Some(default.decoration.width * 2.0)));
             builder.push_default(&StyleProperty::UnderlineOffset(Some(
                 default.decoration.underline_offset,
             )));
         } else if default.decoration.overline {
             builder.push_default(&StyleProperty::Underline(true));
 
-            builder.push_default(&StyleProperty::UnderlineSize(Some(
-                default.decoration.width,
-            )));
+            builder.push_default(&StyleProperty::UnderlineSize(Some(default.decoration.width)));
         } else if default.decoration.underline {
             builder.push_default(&StyleProperty::Underline(true));
 
-            builder.push_default(&StyleProperty::UnderlineSize(Some(
-                default.decoration.width,
-            )));
+            builder.push_default(&StyleProperty::UnderlineSize(Some(default.decoration.width)));
             builder.push_default(&StyleProperty::UnderlineOffset(Some(
                 default.decoration.underline_offset,
             )));
@@ -272,43 +255,23 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
 
         let mut from = default.to;
 
-        for (idx, text_node) in text_node_data
-            .get(1..)
-            .unwrap_or_default()
-            .iter()
-            .enumerate()
-        {
+        for (idx, text_node) in text_node_data.get(1..).unwrap_or_default().iter().enumerate() {
             builder.push(
                 &StyleProperty::FontStack(FontStack::Source(&text_node.font_family)),
                 from..text_node.to,
             );
-            builder.push(
-                &StyleProperty::FontSize(text_node.font_size),
-                from..text_node.to,
-            );
+            builder.push(&StyleProperty::FontSize(text_node.font_size), from..text_node.to);
             if let Some(line_height) = text_node.line_height {
                 builder.push(&StyleProperty::LineHeight(line_height), from..text_node.to);
             }
             if let Some(word_spacing) = text_node.word_spacing {
-                builder.push(
-                    &StyleProperty::WordSpacing(word_spacing),
-                    from..text_node.to,
-                );
+                builder.push(&StyleProperty::WordSpacing(word_spacing), from..text_node.to);
             }
             if let Some(letter_spacing) = text_node.letter_spacing {
-                builder.push(
-                    &StyleProperty::LetterSpacing(letter_spacing),
-                    from..text_node.to,
-                );
+                builder.push(&StyleProperty::LetterSpacing(letter_spacing), from..text_node.to);
             }
-            builder.push(
-                &StyleProperty::FontWeight(text_node.font_weight),
-                from..text_node.to,
-            );
-            builder.push(
-                &StyleProperty::FontStyle(text_node.font_style),
-                from..text_node.to,
-            );
+            builder.push(&StyleProperty::FontWeight(text_node.font_weight), from..text_node.to);
+            builder.push(&StyleProperty::FontStyle(text_node.font_style), from..text_node.to);
             builder.push(
                 &StyleProperty::FontVariations(FontSettings::List(&text_node.var_axes)),
                 from..text_node.to,
@@ -324,9 +287,7 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
                     from..text_node.to,
                 );
                 builder.push(
-                    &StyleProperty::UnderlineOffset(Some(
-                        default.decoration.underline_offset + 4.0,
-                    )),
+                    &StyleProperty::UnderlineOffset(Some(default.decoration.underline_offset + 4.0)),
                     from..text_node.to,
                 );
             } else if default.decoration.overline {
@@ -336,10 +297,7 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
                     &StyleProperty::UnderlineSize(Some(default.decoration.width)),
                     from..text_node.to,
                 );
-                builder.push(
-                    &StyleProperty::UnderlineOffset(Some(4.0)),
-                    from..text_node.to,
-                );
+                builder.push(&StyleProperty::UnderlineOffset(Some(4.0)), from..text_node.to);
             } else if default.decoration.underline {
                 builder.push(&StyleProperty::Underline(true), from..text_node.to);
 
@@ -354,9 +312,7 @@ pub fn compute_inline_layout<LT: LayoutTree<TaffyLayouter>>(
             }
 
             builder.push(
-                &StyleProperty::Underline(
-                    default.decoration.underline || default.decoration.overline,
-                ),
+                &StyleProperty::Underline(default.decoration.underline || default.decoration.overline),
                 from..text_node.to,
             );
 
diff --git a/crates/gosub_taffy/src/lib.rs b/crates/gosub_taffy/src/lib.rs
index 573605595..2c7a6208d 100644
--- a/crates/gosub_taffy/src/lib.rs
+++ b/crates/gosub_taffy/src/lib.rs
@@ -1,10 +1,9 @@
 use std::vec::IntoIter;
 
 use taffy::{
-    compute_block_layout, compute_cached_layout, compute_flexbox_layout, compute_grid_layout,
-    compute_hidden_layout, compute_root_layout, AvailableSpace, Cache as TaffyCache,
-    Display as TaffyDisplay, Layout as TaffyLayout, LayoutInput, LayoutOutput, LayoutPartialTree,
-    NodeId as TaffyId, Style, TraversePartialTree,
+    compute_block_layout, compute_cached_layout, compute_flexbox_layout, compute_grid_layout, compute_hidden_layout,
+    compute_root_layout, AvailableSpace, Cache as TaffyCache, Display as TaffyDisplay, Layout as TaffyLayout,
+    LayoutInput, LayoutOutput, LayoutPartialTree, NodeId as TaffyId, Style, TraversePartialTree,
 };
 
 use gosub_render_backend::geo::{Point, Rect, Size, SizeU32};
@@ -116,12 +115,7 @@ impl Layouter for TaffyLayouter {
 
     const COLLAPSE_INLINE: bool = true;
 
-    fn layout<LT: LayoutTree<Self>>(
-        &self,
-        tree: &mut LT,
-        root: LT::NodeId,
-        space: SizeU32,
-    ) -> Result<()> {
+    fn layout<LT: LayoutTree<Self>>(&self, tree: &mut LT, root: LT::NodeId, space: SizeU32) -> Result<()> {
         let size = taffy::Size {
             width: AvailableSpace::Definite(space.width as f32),
             height: AvailableSpace::Definite(space.height as f32),
diff --git a/crates/gosub_taffy/src/style/parse.rs b/crates/gosub_taffy/src/style/parse.rs
index 6ceb4615d..8b4c07ded 100644
--- a/crates/gosub_taffy/src/style/parse.rs
+++ b/crates/gosub_taffy/src/style/parse.rs
@@ -5,15 +5,14 @@ use taffy::{
 };
 
 use gosub_render_backend::geo::Size;
-use gosub_render_backend::layout::{CssProperty, Node};
+use gosub_render_backend::layout::Node;
+use gosub_shared::traits::css3::CssProperty;
 
 pub fn parse_len(node: &mut impl Node, name: &str) -> LengthPercentage {
     let Some(property) = node.get_property(name) else {
         return LengthPercentage::Length(0.0);
     };
 
-    property.compute_value();
-
     if let Some(percent) = property.as_percentage() {
         return LengthPercentage::Percent(percent / 100.0);
     }
@@ -26,8 +25,6 @@ pub fn parse_len_auto(node: &mut impl Node, name: &str) -> LengthPercentageAuto
         return LengthPercentageAuto::Length(0.0);
     };
 
-    property.compute_value();
-
     if let Some(str) = property.as_string() {
         if str == "auto" {
             return LengthPercentageAuto::Auto;
@@ -46,8 +43,6 @@ pub fn parse_dimension(node: &mut impl Node, name: &str) -> Dimension {
         return Dimension::Auto;
     };
 
-    property.compute_value();
-
     if let Some(str) = property.as_string() {
         if str == "auto" {
             return Dimension::Auto;
@@ -73,8 +68,6 @@ pub fn parse_text_dim(size: Size, name: &str) -> Dimension {
 
 pub fn parse_align_i(node: &mut impl Node, name: &str) -> Option<AlignItems> {
     let display = node.get_property(name)?;
-    display.compute_value();
-
     let value = display.as_string()?;
 
     match value {
@@ -92,8 +85,6 @@ pub fn parse_align_i(node: &mut impl Node, name: &str) -> Option<AlignItems> {
 pub fn parse_align_c(node: &mut impl Node, name: &str) -> Option<AlignContent> {
     let display = node.get_property(name)?;
 
-    display.compute_value();
-
     let value = display.as_string()?;
 
     match value {
@@ -109,16 +100,11 @@ pub fn parse_align_c(node: &mut impl Node, name: &str) -> Option<AlignContent> {
     }
 }
 
-pub fn parse_tracking_sizing_function(
-    node: &mut impl Node,
-    name: &str,
-) -> Vec<TrackSizingFunction> {
+pub fn parse_tracking_sizing_function(node: &mut impl Node, name: &str) -> Vec<TrackSizingFunction> {
     let Some(display) = node.get_property(name) else {
         return Vec::new();
     };
 
-    display.compute_value();
-
     let Some(_value) = display.as_string() else {
         return Vec::new();
     };
@@ -139,8 +125,6 @@ pub fn parse_grid_auto(node: &mut impl Node, name: &str) -> Vec<NonRepeatedTrack
         return Vec::new();
     };
 
-    display.compute_value();
-
     let Some(_value) = display.as_string() else {
         return Vec::new();
     };
@@ -153,8 +137,6 @@ pub fn parse_grid_placement(node: &mut impl Node, name: &str) -> GridPlacement {
         return GridPlacement::Auto;
     };
 
-    display.compute_value();
-
     if let Some(value) = &display.as_string() {
         return if value.starts_with("span") {
             let value = value.trim_start_matches("span").trim();
@@ -172,7 +154,7 @@ pub fn parse_grid_placement(node: &mut impl Node, name: &str) -> GridPlacement {
     }
 
     if let Some(value) = display.as_number() {
-        return GridPlacement::from_line_index((value) as i16);
+        return GridPlacement::from_line_index(value as i16);
     }
     GridPlacement::Auto
 }
diff --git a/crates/gosub_taffy/src/style/parse_properties.rs b/crates/gosub_taffy/src/style/parse_properties.rs
index 37a9aadc5..546ce6890 100644
--- a/crates/gosub_taffy/src/style/parse_properties.rs
+++ b/crates/gosub_taffy/src/style/parse_properties.rs
@@ -2,20 +2,18 @@ use regex::Regex;
 use taffy::prelude::*;
 use taffy::{Overflow, Point};
 
-use gosub_render_backend::layout::{CssProperty, Node};
-
 use crate::style::parse::{
-    parse_align_c, parse_align_i, parse_dimension, parse_grid_auto, parse_grid_placement,
-    parse_len, parse_len_auto, parse_text_dim, parse_tracking_sizing_function,
+    parse_align_c, parse_align_i, parse_dimension, parse_grid_auto, parse_grid_placement, parse_len, parse_len_auto,
+    parse_text_dim, parse_tracking_sizing_function,
 };
+use gosub_render_backend::layout::Node;
+use gosub_shared::traits::css3::CssProperty;
 
 pub fn parse_display(node: &mut impl Node) -> (Display, crate::Display) {
     let Some(display) = node.get_property("display") else {
         return (Display::Block, crate::Display::Taffy);
     };
 
-    display.compute_value();
-
     let Some(value) = display.as_string() else {
         return (Display::Block, crate::Display::Taffy);
     };
@@ -48,8 +46,6 @@ pub fn parse_overflow(node: &mut impl Node) -> Point<Overflow> {
     };
 
     if let Some(display) = node.get_property("overflow-x") {
-        display.compute_value();
-
         if let Some(value) = display.as_string() {
             let x = parse(value);
             overflow.x = x;
@@ -57,8 +53,6 @@ pub fn parse_overflow(node: &mut impl Node) -> Point<Overflow> {
     };
 
     if let Some(display) = node.get_property("overflow-y") {
-        display.compute_value();
-
         if let Some(value) = display.as_string() {
             let y = parse(value);
             overflow.y = y;
@@ -73,8 +67,6 @@ pub fn parse_position(node: &mut impl Node) -> Position {
         return Position::Relative;
     };
 
-    position.compute_value();
-
     let Some(value) = position.as_string() else {
         return Position::Relative;
     };
@@ -140,8 +132,6 @@ pub fn parse_max_size(node: &mut impl Node) -> Size<Dimension> {
 pub fn parse_aspect_ratio(node: &mut impl Node) -> Option<f32> {
     let aspect_ratio = node.get_property("aspect-ratio")?;
 
-    aspect_ratio.compute_value();
-
     if let Some(value) = aspect_ratio.as_number() {
         return Some(value);
     }
@@ -204,8 +194,6 @@ pub fn parse_border(node: &mut impl Node) -> Rect<LengthPercentage> {
 pub fn parse_align_items(node: &mut impl Node) -> Option<AlignItems> {
     let display = node.get_property("align-items")?;
 
-    display.compute_value();
-
     let value = display.as_string()?;
 
     match value {
@@ -252,8 +240,6 @@ pub fn parse_flex_direction(node: &mut impl Node) -> FlexDirection {
         return FlexDirection::Row;
     };
 
-    property.compute_value();
-
     if let Some(value) = property.as_string() {
         match value {
             "row" => FlexDirection::Row,
@@ -272,8 +258,6 @@ pub fn parse_flex_wrap(node: &mut impl Node) -> FlexWrap {
         return FlexWrap::NoWrap;
     };
 
-    property.compute_value();
-
     if let Some(value) = property.as_string() {
         match value {
             "nowrap" => FlexWrap::NoWrap,
@@ -295,8 +279,6 @@ pub fn parse_flex_grow(node: &mut impl Node) -> f32 {
         return 0.0;
     };
 
-    property.compute_value();
-
     property.as_number().unwrap_or(0.0)
 }
 
@@ -305,8 +287,6 @@ pub fn parse_flex_shrink(node: &mut impl Node) -> f32 {
         return 1.0;
     };
 
-    property.compute_value();
-
     property.as_number().unwrap_or(1.0)
 }
 
@@ -331,8 +311,6 @@ pub fn parse_grid_auto_flow(node: &mut impl Node) -> GridAutoFlow {
         return GridAutoFlow::Row;
     };
 
-    property.compute_value();
-
     if let Some(value) = property.as_string() {
         match value {
             "row" => GridAutoFlow::Row,
diff --git a/crates/gosub_testing/src/testing/tokenizer.rs b/crates/gosub_testing/src/testing/tokenizer.rs
index e0d00ea40..d85c32458 100644
--- a/crates/gosub_testing/src/testing/tokenizer.rs
+++ b/crates/gosub_testing/src/testing/tokenizer.rs
@@ -1,12 +1,10 @@
 use super::FIXTURE_ROOT;
+use gosub_html5::parser::errors::ErrorLogger;
 use gosub_html5::tokenizer::ParserData;
-use gosub_html5::{
-    error_logger::ErrorLogger,
-    tokenizer::{
-        state::State as TokenState,
-        token::Token,
-        {Options, Tokenizer},
-    },
+use gosub_html5::tokenizer::{
+    state::State as TokenState,
+    token::Token,
+    {Options, Tokenizer},
 };
 use gosub_shared::byte_stream::{ByteStream, Config, Encoding, Location};
 use gosub_shared::types::Result;
@@ -171,12 +169,7 @@ where
                 _ => return Err(Error::invalid_value(Unexpected::Str(kind), &"DOCTYPE")),
             },
 
-            _ => {
-                return Err(Error::invalid_length(
-                    values.len(),
-                    &"an array of length 2, 3, 4 or 5",
-                ))
-            }
+            _ => return Err(Error::invalid_length(values.len(), &"an array of length 2, 3, 4 or 5")),
         };
 
         output.push(token);
@@ -225,8 +218,6 @@ impl TestSpec {
     }
 
     pub fn assert_valid(&self) {
-        println!("Test: {}", self.description);
-
         for mut builder in self.builders() {
             let mut tokenizer = builder.build();
 
@@ -289,10 +280,7 @@ impl TestSpec {
             if actual.message == expected.code
                 && (actual.location.line != expected.line || actual.location.column != expected.col)
             {
-                panic!(
-                    "[{}]: wanted {:?}, got {:?}",
-                    self.description, expected, actual
-                );
+                panic!("[{}]: wanted {:?}, got {:?}", self.description, expected, actual);
             }
         }
 
@@ -315,7 +303,7 @@ impl TestSpec {
                 location,
             } => Token::Comment {
                 comment: escape(value),
-                location: location.clone(),
+                location: *location,
             },
 
             Token::DocType {
@@ -329,7 +317,7 @@ impl TestSpec {
                 force_quirks: *force_quirks,
                 pub_identifier: pub_identifier.as_ref().map(Into::into),
                 sys_identifier: sys_identifier.as_ref().map(Into::into),
-                location: location.clone(),
+                location: *location,
             },
 
             Token::EndTag {
@@ -339,12 +327,10 @@ impl TestSpec {
             } => Token::EndTag {
                 name: escape(name),
                 is_self_closing: *is_self_closing,
-                location: location.clone(),
+                location: *location,
             },
 
-            Token::Eof { location } => Token::Eof {
-                location: location.clone(),
-            },
+            Token::Eof { location } => Token::Eof { location: *location },
 
             Token::StartTag {
                 name,
@@ -355,15 +341,12 @@ impl TestSpec {
                 name: escape(name),
                 is_self_closing: *is_self_closing,
                 attributes: attributes.clone(),
-                location: location.clone(),
+                location: *location,
             },
 
-            Token::Text {
-                text: value,
-                location,
-            } => Token::Text {
+            Token::Text { text: value, location } => Token::Text {
                 text: escape(value),
-                location: location.clone(),
+                location: *location,
             },
         }
     }
@@ -394,9 +377,7 @@ pub fn from_utf16_lossy(input: &str) -> String {
         let n = u16::from_str_radix(&cap[1], 16).unwrap();
         // There are UTF-16 characters that the following will not decode into UTF-8, so we might
         // be dropping characters when a DecodeUtf16Error error is encountered.
-        std::char::decode_utf16([n])
-            .filter_map(|r| r.ok())
-            .collect::<String>()
+        std::char::decode_utf16([n]).filter_map(|r| r.ok()).collect::<String>()
     })
     .to_string()
 }
diff --git a/crates/gosub_testing/src/testing/tree_construction.rs b/crates/gosub_testing/src/testing/tree_construction.rs
index 693c3c563..15c5c1707 100644
--- a/crates/gosub_testing/src/testing/tree_construction.rs
+++ b/crates/gosub_testing/src/testing/tree_construction.rs
@@ -4,17 +4,20 @@ pub(crate) mod parser;
 pub mod result;
 
 use generator::TreeOutputGenerator;
-use gosub_html5::node::NodeId;
 use gosub_html5::node::{HTML_NAMESPACE, MATHML_NAMESPACE, SVG_NAMESPACE};
-use gosub_html5::parser::document::DocumentBuilder;
-use gosub_html5::parser::document::{Document, DocumentHandle};
-use gosub_html5::parser::tree_builder::TreeBuilder;
-use gosub_html5::parser::{Html5Parser, Html5ParserOptions};
 use gosub_shared::byte_stream::{ByteStream, Config, Encoding, Location};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::{Document, DocumentBuilder};
+use gosub_shared::traits::html5::{Html5Parser, ParserOptions};
 use gosub_shared::types::{ParseError, Result};
 use parser::{ScriptMode, TestSpec};
 use result::TestResult;
 use result::{ResultStatus, TreeLineResult};
+use std::collections::HashMap;
+
+type ParseResult<T> = Result<(T, Vec<ParseError>)>;
 
 /// Holds a single parser test
 #[derive(Debug, Default, PartialEq, Clone)]
@@ -74,19 +77,26 @@ impl Harness {
     }
 
     /// Runs a single test and returns the test result of that run
-    pub fn run_test(&mut self, test: Test, scripting_enabled: bool) -> Result<TestResult> {
+    pub fn run_test<P: Html5Parser<C>, C: CssSystem>(
+        &mut self,
+        test: Test,
+        scripting_enabled: bool,
+    ) -> Result<TestResult> {
         self.test = test;
         self.next_document_line = 0;
 
-        let (actual_document, actual_errors) = self.do_parse(scripting_enabled)?;
-        let result = self.generate_test_result(Document::clone(&actual_document), &actual_errors);
+        let (actual_document, actual_errors) = self.do_parse::<P, C>(scripting_enabled)?;
+        let result = self.generate_test_result::<P, C>(actual_document.clone(), &actual_errors);
 
         Ok(result)
     }
 
     /// Run the html5 parser and return the document tree and errors
-    fn do_parse(&mut self, scripting_enabled: bool) -> Result<(DocumentHandle, Vec<ParseError>)> {
-        let options = Html5ParserOptions { scripting_enabled };
+    fn do_parse<P: Html5Parser<C>, C: CssSystem>(
+        &mut self,
+        scripting_enabled: bool,
+    ) -> ParseResult<DocumentHandle<P::Document, C>> {
+        let options = <P::Options as ParserOptions>::new(scripting_enabled);
         let mut stream = ByteStream::new(
             Encoding::UTF8,
             Some(Config {
@@ -98,66 +108,61 @@ impl Harness {
         stream.read_from_str(self.test.spec_data(), None);
         stream.close();
 
-        let (document, parse_errors) =
-            if let Some(fragment) = self.test.spec.document_fragment.clone() {
-                self.parse_fragment(fragment, stream, options, Location::default())?
-            } else {
-                let document = DocumentBuilder::new_document(None);
-                let parser_errors = Html5Parser::parse_document(
-                    &mut stream,
-                    Document::clone(&document),
-                    Some(options),
-                )?;
-                (document, parser_errors)
-            };
+        let (document, parse_errors) = if let Some(fragment) = self.test.spec.document_fragment.clone() {
+            self.parse_fragment::<P, C>(fragment, stream, options, Location::default())?
+        } else {
+            let document = <P::Document as Document<C>>::Builder::new_document(None);
+            let parser_errors = P::parse(&mut stream, DocumentHandle::clone(&document), Some(options))?;
+
+            (document, parser_errors)
+        };
 
         Ok((document, parse_errors))
     }
 
-    fn parse_fragment(
+    fn parse_fragment<P: Html5Parser<C>, C: CssSystem>(
         &mut self,
         fragment: String,
         mut stream: ByteStream,
-        options: Html5ParserOptions,
+        options: P::Options,
         start_location: Location,
-    ) -> Result<(DocumentHandle, Vec<ParseError>)> {
+    ) -> ParseResult<DocumentHandle<P::Document, C>> {
         // First, create a (fake) main document that contains only the fragment as node
-        let main_document = DocumentBuilder::new_document(None);
-        let mut main_document = Document::clone(&main_document);
+        let mut main_doc_handle = <P::Document as Document<C>>::Builder::new_document(None);
+
+        // let mut main_document = main_document.clone();
         let (element, namespace) = if fragment.starts_with("svg ") {
-            (
-                fragment.strip_prefix("svg ").unwrap().to_string(),
-                SVG_NAMESPACE,
-            )
+            (fragment.strip_prefix("svg ").unwrap().to_string(), SVG_NAMESPACE)
         } else if fragment.starts_with("math ") {
-            (
-                fragment.strip_prefix("math ").unwrap().to_string(),
-                MATHML_NAMESPACE,
-            )
+            (fragment.strip_prefix("math ").unwrap().to_string(), MATHML_NAMESPACE)
         } else {
             (fragment, HTML_NAMESPACE)
         };
 
-        // Add context node
-        let context_node_id = main_document.create_element(
+        let quirks_mode = main_doc_handle.get().quirks_mode();
+
+        // let doc_clone = DocumentHandle::clone(&main_document);
+        // let mut doc = main_document.get_mut();
+
+        let node = <P::Document as Document<C>>::new_element_node(
+            main_doc_handle.clone(),
             element.as_str(),
-            NodeId::root(),
-            None,
-            namespace,
-            start_location.clone(),
+            Some(namespace),
+            HashMap::new(),
+            start_location,
         );
-        let context_node = main_document
-            .get()
-            .get_node_by_id(context_node_id)
-            .unwrap()
-            .clone();
 
-        let document = DocumentBuilder::new_document_fragment(&context_node);
+        let context_node_id = main_doc_handle.get_mut().register_node_at(node, NodeId::root(), None);
+        let binding = main_doc_handle.get();
+        let context_node = binding.node_by_id(context_node_id).unwrap();
+        let _ = context_node_id;
+
+        let document = <P::Document as Document<C>>::Builder::new_document_fragment(context_node, quirks_mode);
 
-        let parser_errors = Html5Parser::parse_fragment(
+        let parser_errors = P::parse_fragment(
             &mut stream,
-            Document::clone(&document),
-            &context_node,
+            document.clone(),
+            context_node,
             Some(options),
             start_location,
         )?;
@@ -208,9 +213,9 @@ impl Harness {
         Some(line.to_string())
     }
 
-    fn generate_test_result(
+    fn generate_test_result<P: Html5Parser<C>, C: CssSystem>(
         &mut self,
-        document: DocumentHandle,
+        document: DocumentHandle<P::Document, C>,
         _parse_errors: &[ParseError],
     ) -> TestResult {
         let mut result = TestResult::default();
diff --git a/crates/gosub_testing/src/testing/tree_construction/generator.rs b/crates/gosub_testing/src/testing/tree_construction/generator.rs
index b15e1880e..ac638d343 100644
--- a/crates/gosub_testing/src/testing/tree_construction/generator.rs
+++ b/crates/gosub_testing/src/testing/tree_construction/generator.rs
@@ -1,16 +1,19 @@
-use gosub_html5::node::{Node, NodeData, NodeTrait, NodeType, HTML_NAMESPACE};
+use gosub_html5::node::HTML_NAMESPACE;
 use gosub_html5::node::{MATHML_NAMESPACE, SVG_NAMESPACE, XLINK_NAMESPACE, XMLNS_NAMESPACE};
-use gosub_html5::parser::document::DocumentHandle;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::node::{CommentDataType, DocTypeDataType, ElementDataType, Node, NodeType, TextDataType};
 
 /// Generates a tree output that can be used for matching with the expected output
-pub struct TreeOutputGenerator {
-    document: DocumentHandle,
+pub struct TreeOutputGenerator<D: Document<C>, C: CssSystem> {
+    document: DocumentHandle<D, C>,
 }
 
-impl TreeOutputGenerator {
+impl<D: Document<C>, C: CssSystem> TreeOutputGenerator<D, C> {
     /// Initializes a new tree output generator
     #[must_use]
-    pub fn new(document: DocumentHandle) -> Self {
+    pub fn new(document: DocumentHandle<D, C>) -> Self {
         Self { document }
     }
 
@@ -20,48 +23,39 @@ impl TreeOutputGenerator {
     }
 
     /// Generates an array of indented tree line and its children. Note that text lines can have newlines in them
-    fn output_treeline(&self, node: &Node, indent_level: usize) -> Vec<String> {
+    fn output_treeline(&self, node: &D::Node, indent_level: usize) -> Vec<String> {
         let mut indent_level = indent_level;
         let mut output = Vec::new();
 
         // We can skip the document node, as it is always the root node (either a document node, or
         // a html node when it's a fragment)
         if indent_level > 0 {
-            output.push(format!(
-                "| {}{}",
-                "  ".repeat(indent_level - 1),
-                self.output_node(node)
-            ));
-
-            if node.type_of() == NodeType::Element {
-                if let NodeData::Element(element) = &node.data {
+            output.push(format!("| {}{}", "  ".repeat(indent_level - 1), self.output_node(node)));
+
+            if node.type_of() == NodeType::ElementNode {
+                if let Some(element) = &node.get_element_data() {
                     let mut sorted_attrs = vec![];
-                    for attr in &element.attributes {
+                    for attr in element.attributes() {
                         sorted_attrs.push(attr);
                     }
                     sorted_attrs.sort_by(|a, b| a.0.cmp(b.0));
 
                     for attr in &sorted_attrs {
-                        output.push(format!(
-                            r#"| {}{}="{}""#,
-                            "  ".repeat(indent_level),
-                            attr.0,
-                            attr.1
-                        ));
+                        output.push(format!(r#"| {}{}="{}""#, "  ".repeat(indent_level), attr.0, attr.1));
                     }
-                }
-            }
 
-            // Template tags have an extra "content" node in the test tree ouput
-            if node.name == "template" && node.is_namespace(HTML_NAMESPACE) {
-                output.push(format!("| {}content", "  ".repeat(indent_level)));
-                indent_level += 1;
+                    // Template tags have an extra "content" node in the test tree ouput
+                    if element.name() == "template" && element.is_namespace(HTML_NAMESPACE) {
+                        output.push(format!("| {}content", "  ".repeat(indent_level)));
+                        indent_level += 1;
+                    }
+                }
             }
         }
 
-        for child_id in &node.children {
+        for child_id in node.children() {
             let doc = self.document.get();
-            let child_node = doc.get_node_by_id(*child_id).expect("node not found");
+            let child_node = doc.node_by_id(*child_id).expect("node not found");
 
             output.append(&mut self.output_treeline(child_node, indent_level + 1));
         }
@@ -70,41 +64,58 @@ impl TreeOutputGenerator {
     }
 
     /// Generate the output for a single node
-    fn output_node(&self, node: &Node) -> String {
-        match node.data.clone() {
-            NodeData::Element(element) => {
-                if let Some(ns) = node.namespace.clone() {
-                    let ns_prefix = match ns.as_str() {
-                        MATHML_NAMESPACE => "math ",
-                        SVG_NAMESPACE => "svg ",
-                        XMLNS_NAMESPACE => "xml ",
-                        XLINK_NAMESPACE => "xlink ",
-                        _ => "",
-                    };
-                    format!("<{}{}>", ns_prefix, element.name())
-                } else {
-                    // format!("<{}{}>", ns_prefix, element.name())
-                    format!("<{}>", element.name())
-                }
+    fn output_node(&self, node: &D::Node) -> String {
+        match node.type_of() {
+            NodeType::ElementNode => {
+                let Some(data) = node.get_element_data() else {
+                    return "<unknown>".to_owned();
+                };
+
+                let ns_prefix = match data.namespace() {
+                    MATHML_NAMESPACE => "math ",
+                    SVG_NAMESPACE => "svg ",
+                    XMLNS_NAMESPACE => "xml ",
+                    XLINK_NAMESPACE => "xlink ",
+                    _ => "",
+                };
+
+                format!("<{}{}>", ns_prefix, data.name())
+            }
+            NodeType::TextNode => {
+                let Some(data) = node.get_text_data() else {
+                    return "<unknown>".to_owned();
+                };
+
+                format!(r#""{}""#, data.value())
             }
-            NodeData::Text(text) => format!(r#""{}""#, text.value()),
-            NodeData::Comment(comment) => format!("<!-- {} -->", comment.value()),
-            NodeData::DocType(doctype) => {
-                let doctype_text =
-                    if doctype.pub_identifier.is_empty() && doctype.sys_identifier.is_empty() {
-                        // <!DOCTYPE html>
-                        doctype.name
-                    } else {
-                        // <!DOCTYPE html "pubid" "sysid">
-                        format!(
-                            r#"{0} "{1}" "{2}""#,
-                            doctype.name, doctype.pub_identifier, doctype.sys_identifier
-                        )
-                    };
+            NodeType::CommentNode => {
+                let Some(data) = node.get_comment_data() else {
+                    return "unknown".to_owned();
+                };
+
+                format!("<!-- {} -->", data.value())
+            }
+            NodeType::DocTypeNode => {
+                let Some(data) = node.get_doctype_data() else {
+                    return "<unknown>".to_owned();
+                };
+
+                let doctype_text = if data.pub_identifier().is_empty() && data.sys_identifier().is_empty() {
+                    // <!DOCTYPE html>
+                    data.name()
+                } else {
+                    // <!DOCTYPE html "pubid" "sysid">
+                    &*format!(
+                        r#"{0} "{1}" "{2}""#,
+                        data.name(),
+                        data.pub_identifier(),
+                        data.sys_identifier()
+                    )
+                };
 
                 format!("<!DOCTYPE {}>", doctype_text.trim())
             }
-            NodeData::Document(_) => String::new(),
+            NodeType::DocumentNode => String::new(),
         }
     }
 }
diff --git a/crates/gosub_testing/src/testing/tree_construction/parser.rs b/crates/gosub_testing/src/testing/tree_construction/parser.rs
index 49a7de3e7..f744bacac 100644
--- a/crates/gosub_testing/src/testing/tree_construction/parser.rs
+++ b/crates/gosub_testing/src/testing/tree_construction/parser.rs
@@ -127,11 +127,7 @@ fn error_2(i: Span) -> IResult<Span, ErrorSpec> {
 
 fn error_3(i: Span) -> IResult<Span, ErrorSpec> {
     let location = map(
-        tuple((
-            nom::character::complete::u64,
-            tag(":"),
-            nom::character::complete::u64,
-        )),
+        tuple((nom::character::complete::u64, tag(":"), nom::character::complete::u64)),
         |(line, _, col): (u64, Span, u64)| (line as usize, col as usize),
     );
 
@@ -189,17 +185,7 @@ fn error_6(i: Span) -> IResult<Span, ErrorSpec> {
             nom::character::complete::u64,
             tag(")"),
         )),
-        |(_, line1, _, col1, _, line2, _, col2, _): (
-            Span,
-            u64,
-            Span,
-            u64,
-            Span,
-            u64,
-            Span,
-            u64,
-            Span,
-        )| {
+        |(_, line1, _, col1, _, line2, _, col2, _): (Span, u64, Span, u64, Span, u64, Span, u64, Span)| {
             (
                 Position {
                     line: line1 as _,
@@ -225,10 +211,7 @@ fn error_6(i: Span) -> IResult<Span, ErrorSpec> {
 
 fn error_messages(i: Span) -> IResult<Span, Vec<ErrorSpec>> {
     map(take_until1("#"), |string: Span| {
-        string
-            .lines()
-            .map(|s| ErrorSpec::Message(s.into()))
-            .collect::<Vec<_>>()
+        string.lines().map(|s| ErrorSpec::Message(s.into())).collect::<Vec<_>>()
     })(i)
 }
 
@@ -377,10 +360,7 @@ mod tests {
             .into(),
         )
         .unwrap();
-        assert_eq!(
-            doc.to_string(),
-            "| <html>\n|   <head>\n|   <body>\n|     \"Test\""
-        );
+        assert_eq!(doc.to_string(), "| <html>\n|   <head>\n|   <body>\n|     \"Test\"");
     }
 
     #[test]
@@ -408,10 +388,7 @@ Test
                 message: "expected-doctype-but-got-chars".into(),
             }]
         );
-        assert_eq!(
-            test.document,
-            "| <html>\n|   <head>\n|   <body>\n|     \"Test\""
-        );
+        assert_eq!(test.document, "| <html>\n|   <head>\n|   <body>\n|     \"Test\"");
     }
 
     #[test]
@@ -736,8 +713,7 @@ x"
 
     #[test]
     fn parse_error_5() {
-        let (_, error) =
-            error_5("52: End of file seen and there were open elements.\n".into()).unwrap();
+        let (_, error) = error_5("52: End of file seen and there were open elements.\n".into()).unwrap();
 
         assert_eq!(
             error,
@@ -750,9 +726,7 @@ x"
 
     #[test]
     fn parse_error_6() {
-        let (_, error) =
-            error_6("(1:44-1:49) non-void-html-element-start-tag-with-trailing-solidus\n".into())
-                .unwrap();
+        let (_, error) = error_6("(1:44-1:49) non-void-html-element-start-tag-with-trailing-solidus\n".into()).unwrap();
 
         assert_eq!(
             error,
diff --git a/crates/gosub_testing/src/testing/tree_construction/result.rs b/crates/gosub_testing/src/testing/tree_construction/result.rs
index e4c6dc10d..503997c40 100644
--- a/crates/gosub_testing/src/testing/tree_construction/result.rs
+++ b/crates/gosub_testing/src/testing/tree_construction/result.rs
@@ -61,12 +61,7 @@ pub struct TestResult {
 impl TestResult {
     /// Returns true when both results and error_results are either empty or have a result that is not Success
     pub fn is_success(&self) -> bool {
-        self.tree_results
-            .iter()
-            .all(|r| r.result == ResultStatus::Success)
-            && self
-                .error_results
-                .iter()
-                .all(|r| r.result == ResultStatus::Success)
+        self.tree_results.iter().all(|r| r.result == ResultStatus::Success)
+            && self.error_results.iter().all(|r| r.result == ResultStatus::Success)
     }
 }
diff --git a/crates/gosub_typeface/Cargo.toml b/crates/gosub_typeface/Cargo.toml
index 4ee3db92a..a6e215112 100644
--- a/crates/gosub_typeface/Cargo.toml
+++ b/crates/gosub_typeface/Cargo.toml
@@ -2,6 +2,8 @@
 name = "gosub_typeface"
 version = "0.1.0"
 edition = "2021"
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
 
 [dependencies]
 lazy_static = "1.5.0"
diff --git a/crates/gosub_useragent/Cargo.toml b/crates/gosub_useragent/Cargo.toml
index 9c0ca8143..df7e820e9 100644
--- a/crates/gosub_useragent/Cargo.toml
+++ b/crates/gosub_useragent/Cargo.toml
@@ -2,6 +2,8 @@
 name = "gosub_useragent"
 version = "0.1.0"
 edition = "2021"
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
 
 [dependencies]
 gosub_shared = { path = "../gosub_shared" }
diff --git a/crates/gosub_useragent/src/application.rs b/crates/gosub_useragent/src/application.rs
index aca7241de..d1384ee2d 100644
--- a/crates/gosub_useragent/src/application.rs
+++ b/crates/gosub_useragent/src/application.rs
@@ -10,28 +10,43 @@ use winit::window::WindowId;
 use gosub_render_backend::layout::{LayoutTree, Layouter};
 use gosub_render_backend::{NodeDesc, RenderBackend};
 use gosub_renderer::draw::SceneDrawer;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::html5::Html5Parser;
 use gosub_shared::types::Result;
 
 use crate::window::Window;
 
 pub struct Application<
     'a,
-    D: SceneDrawer<B, L, LT>,
+    D: SceneDrawer<B, L, LT, Doc, C>,
     B: RenderBackend,
     L: Layouter,
     LT: LayoutTree<L>,
+    Doc: Document<C>,
+    C: CssSystem,
+    P: Html5Parser<C, Document = Doc>,
 > {
     open_windows: Vec<Vec<Url>>, // Vec of Windows, each with a Vec of URLs, representing tabs
-    windows: HashMap<WindowId, Window<'a, D, B, L, LT>>,
+    windows: HashMap<WindowId, Window<'a, D, B, L, LT, Doc, C>>,
     backend: B,
     layouter: L,
     proxy: Option<EventLoopProxy<CustomEvent>>,
     event_loop: Option<EventLoop<CustomEvent>>,
     debug: bool,
+    _marker: std::marker::PhantomData<&'a P>,
 }
 
-impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>>
-    ApplicationHandler<CustomEvent> for Application<'a, D, B, L, LT>
+impl<
+        'a,
+        D: SceneDrawer<B, L, LT, Doc, C>,
+        B: RenderBackend,
+        L: Layouter,
+        LT: LayoutTree<L>,
+        Doc: Document<C>,
+        C: CssSystem,
+        P: Html5Parser<C, Document = Doc>,
+    > ApplicationHandler<CustomEvent> for Application<'a, D, B, L, LT, Doc, C, P>
 {
     fn resumed(&mut self, _event_loop: &ActiveEventLoop) {
         for window in self.windows.values_mut() {
@@ -44,19 +59,14 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
     fn user_event(&mut self, event_loop: &ActiveEventLoop, event: CustomEvent) {
         match event {
             CustomEvent::OpenWindow(url) => {
-                let mut window = match Window::new(
-                    event_loop,
-                    &mut self.backend,
-                    self.layouter.clone(),
-                    url,
-                    self.debug,
-                ) {
-                    Ok(window) => window,
-                    Err(e) => {
-                        eprintln!("Error opening window: {e:?}");
-                        return;
-                    }
-                };
+                let mut window =
+                    match Window::new::<P>(event_loop, &mut self.backend, self.layouter.clone(), url, self.debug) {
+                        Ok(window) => window,
+                        Err(e) => {
+                            eprintln!("Error opening window: {e:?}");
+                            return;
+                        }
+                    };
 
                 if let Err(e) = window.resumed(&mut self.backend) {
                     eprintln!("Error resuming window: {e:?}");
@@ -69,7 +79,7 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
             }
             CustomEvent::OpenInitial => {
                 for urls in self.open_windows.drain(..) {
-                    let mut window = match Window::new(
+                    let mut window = match Window::new::<P>(
                         event_loop,
                         &mut self.backend,
                         self.layouter.clone(),
@@ -112,12 +122,7 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
         }
     }
 
-    fn window_event(
-        &mut self,
-        event_loop: &ActiveEventLoop,
-        window_id: WindowId,
-        event: WindowEvent,
-    ) {
+    fn window_event(&mut self, event_loop: &ActiveEventLoop, window_id: WindowId, event: WindowEvent) {
         if let Some(window) = self.windows.get_mut(&window_id) {
             if let Err(e) = window.event(event_loop, &mut self.backend, event) {
                 eprintln!("Error handling window event: {e:?}");
@@ -132,8 +137,16 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
     }
 }
 
-impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>>
-    Application<'a, D, B, L, LT>
+impl<
+        'a,
+        D: SceneDrawer<B, L, LT, Doc, C>,
+        B: RenderBackend,
+        L: Layouter,
+        LT: LayoutTree<L>,
+        Doc: Document<C>,
+        C: CssSystem,
+        P: Html5Parser<C, Document = Doc>,
+    > Application<'a, D, B, L, LT, Doc, C, P>
 {
     pub fn new(backend: B, layouter: L, debug: bool) -> Self {
         Self {
@@ -144,6 +157,7 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
             event_loop: None,
             open_windows: Vec::new(),
             debug,
+            _marker: std::marker::PhantomData,
         }
     }
 
@@ -155,7 +169,7 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
         self.open_windows.append(&mut windows);
     }
 
-    pub fn add_window(&mut self, window: Window<'a, D, B, L, LT>) {
+    pub fn add_window(&mut self, window: Window<'a, D, B, L, LT, Doc, C>) {
         self.windows.insert(window.window.id(), window);
     }
 
@@ -179,10 +193,7 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
             self.initialize()?;
         }
 
-        let event_loop = self
-            .event_loop
-            .take()
-            .ok_or(anyhow!("No event loop; unreachable!"))?;
+        let event_loop = self.event_loop.take().ok_or(anyhow!("No event loop; unreachable!"))?;
 
         let proxy = self.proxy()?;
 
diff --git a/crates/gosub_useragent/src/event_loop.rs b/crates/gosub_useragent/src/event_loop.rs
index 7a53b3899..71d7e77c8 100644
--- a/crates/gosub_useragent/src/event_loop.rs
+++ b/crates/gosub_useragent/src/event_loop.rs
@@ -5,19 +5,23 @@ use winit::keyboard::{KeyCode, PhysicalKey};
 use gosub_render_backend::layout::{LayoutTree, Layouter};
 use gosub_render_backend::{Point, RenderBackend, SizeU32, FP};
 use gosub_renderer::draw::SceneDrawer;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
 use gosub_shared::types::Result;
 
 use crate::window::{Window, WindowState};
 
-impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>>
-    Window<'a, D, B, L, LT>
+impl<
+        'a,
+        D: SceneDrawer<B, L, LT, Doc, C>,
+        B: RenderBackend,
+        L: Layouter,
+        LT: LayoutTree<L>,
+        Doc: Document<C>,
+        C: CssSystem,
+    > Window<'a, D, B, L, LT, Doc, C>
 {
-    pub fn event(
-        &mut self,
-        el: &ActiveEventLoop,
-        backend: &mut B,
-        event: WindowEvent,
-    ) -> Result<()> {
+    pub fn event(&mut self, el: &ActiveEventLoop, backend: &mut B, event: WindowEvent) -> Result<()> {
         let WindowState::Active {
             surface: active_window_data,
         } = &mut self.state
@@ -62,10 +66,7 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
                     return Ok(());
                 };
 
-                if tab
-                    .data
-                    .mouse_move(backend, position.x as FP, position.y as FP)
-                {
+                if tab.data.mouse_move(backend, position.x as FP, position.y as FP) {
                     self.window.request_redraw();
                 }
             }
diff --git a/crates/gosub_useragent/src/tabs.rs b/crates/gosub_useragent/src/tabs.rs
index 4a100b205..4be45c3a5 100644
--- a/crates/gosub_useragent/src/tabs.rs
+++ b/crates/gosub_useragent/src/tabs.rs
@@ -5,16 +5,34 @@ use url::Url;
 use gosub_render_backend::layout::{LayoutTree, Layouter};
 use gosub_render_backend::{NodeDesc, RenderBackend};
 use gosub_renderer::draw::SceneDrawer;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::html5::Html5Parser;
 use gosub_shared::types::Result;
 
-pub struct Tabs<D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>> {
-    pub tabs: SlotMap<DefaultKey, Tab<D, B, L, LT>>,
+pub struct Tabs<
+    D: SceneDrawer<B, L, LT, Doc, C>,
+    B: RenderBackend,
+    L: Layouter,
+    LT: LayoutTree<L>,
+    Doc: Document<C>,
+    C: CssSystem,
+> {
+    pub tabs: SlotMap<DefaultKey, Tab<D, B, L, LT, Doc, C>>,
     pub active: TabID,
     _marker: std::marker::PhantomData<(B, L, LT)>,
 }
 
-impl<D: SceneDrawer<B, L, LT>, L: Layouter, LT: LayoutTree<L>, B: RenderBackend> Tabs<D, B, L, LT> {
-    pub fn new(initial: Tab<D, B, L, LT>) -> Self {
+impl<
+        D: SceneDrawer<B, L, LT, Doc, C>,
+        L: Layouter,
+        LT: LayoutTree<L>,
+        B: RenderBackend,
+        Doc: Document<C>,
+        C: CssSystem,
+    > Tabs<D, B, L, LT, Doc, C>
+{
+    pub fn new(initial: Tab<D, B, L, LT, Doc, C>) -> Self {
         let mut tabs = SlotMap::new();
         let active = TabID(tabs.insert(initial));
 
@@ -25,7 +43,7 @@ impl<D: SceneDrawer<B, L, LT>, L: Layouter, LT: LayoutTree<L>, B: RenderBackend>
         }
     }
 
-    pub fn add_tab(&mut self, tab: Tab<D, B, L, LT>) -> TabID {
+    pub fn add_tab(&mut self, tab: Tab<D, B, L, LT, Doc, C>) -> TabID {
         TabID(self.tabs.insert(tab))
     }
 
@@ -37,12 +55,12 @@ impl<D: SceneDrawer<B, L, LT>, L: Layouter, LT: LayoutTree<L>, B: RenderBackend>
         self.active = id;
     }
 
-    pub fn get_current_tab(&mut self) -> Option<&mut Tab<D, B, L, LT>> {
+    pub fn get_current_tab(&mut self) -> Option<&mut Tab<D, B, L, LT, Doc, C>> {
         self.tabs.get_mut(self.active.0)
     }
 
-    pub(crate) fn from_url(url: Url, layouter: L, debug: bool) -> Result<Self> {
-        let tab = Tab::from_url(url, layouter, debug)?;
+    pub(crate) fn from_url<P: Html5Parser<C, Document = Doc>>(url: Url, layouter: L, debug: bool) -> Result<Self> {
+        let tab = Tab::from_url::<P>(url, layouter, debug)?;
 
         Ok(Self::new(tab))
     }
@@ -66,14 +84,29 @@ impl<D: SceneDrawer<B, L, LT>, L: Layouter, LT: LayoutTree<L>, B: RenderBackend>
     }
 }
 
-pub struct Tab<D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>> {
+pub struct Tab<
+    D: SceneDrawer<B, L, LT, Doc, C>,
+    B: RenderBackend,
+    L: Layouter,
+    LT: LayoutTree<L>,
+    Doc: Document<C>,
+    C: CssSystem,
+> {
     pub title: String,
     pub url: Url,
     pub data: D,
-    _marker: std::marker::PhantomData<(B, L, LT)>,
+    _marker: std::marker::PhantomData<(B, L, LT, Doc, C)>,
 }
 
-impl<D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>> Tab<D, B, L, LT> {
+impl<
+        D: SceneDrawer<B, L, LT, Doc, C>,
+        B: RenderBackend,
+        L: Layouter,
+        LT: LayoutTree<L>,
+        Doc: Document<C>,
+        C: CssSystem,
+    > Tab<D, B, L, LT, Doc, C>
+{
     pub fn new(title: String, url: Url, data: D) -> Self {
         Self {
             title,
@@ -83,8 +116,8 @@ impl<D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>>
         }
     }
 
-    pub fn from_url(url: Url, layouter: L, debug: bool) -> Result<Self> {
-        let data = D::from_url(url.clone(), layouter, debug)?;
+    pub fn from_url<P: Html5Parser<C, Document = Doc>>(url: Url, layouter: L, debug: bool) -> Result<Self> {
+        let data = D::from_url::<P>(url.clone(), layouter, debug)?;
 
         Ok(Self {
             title: url.as_str().to_string(),
diff --git a/crates/gosub_useragent/src/window.rs b/crates/gosub_useragent/src/window.rs
index 8afc3f5b5..5862ad41c 100644
--- a/crates/gosub_useragent/src/window.rs
+++ b/crates/gosub_useragent/src/window.rs
@@ -14,6 +14,9 @@ use gosub_render_backend::geo::SizeU32;
 use gosub_render_backend::layout::{LayoutTree, Layouter};
 use gosub_render_backend::{NodeDesc, RenderBackend};
 use gosub_renderer::draw::SceneDrawer;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
+use gosub_shared::traits::html5::Html5Parser;
 use gosub_shared::types::Result;
 
 use crate::tabs::Tabs;
@@ -45,17 +48,32 @@ static ICON: LazyCell<Icon> = LazyCell::new(|| {
 });
 }
 
-pub struct Window<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>> {
+pub struct Window<
+    'a,
+    D: SceneDrawer<B, L, LT, Doc, C>,
+    B: RenderBackend,
+    L: Layouter,
+    LT: LayoutTree<L>,
+    Doc: Document<C>,
+    C: CssSystem,
+> {
     pub(crate) state: WindowState<'a, B>,
     pub(crate) window: Arc<WinitWindow>,
     pub(crate) renderer_data: B::WindowData<'a>,
-    pub(crate) tabs: Tabs<D, B, L, LT>,
+    pub(crate) tabs: Tabs<D, B, L, LT, Doc, C>,
 }
 
-impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree<L>>
-    Window<'a, D, B, L, LT>
+impl<
+        'a,
+        D: SceneDrawer<B, L, LT, Doc, C>,
+        B: RenderBackend,
+        L: Layouter,
+        LT: LayoutTree<L>,
+        Doc: Document<C>,
+        C: CssSystem,
+    > Window<'a, D, B, L, LT, Doc, C>
 {
-    pub fn new(
+    pub fn new<P: Html5Parser<C, Document = Doc>>(
         event_loop: &ActiveEventLoop,
         backend: &mut B,
         layouter: L,
@@ -70,7 +88,7 @@ impl<'a, D: SceneDrawer<B, L, LT>, B: RenderBackend, L: Layouter, LT: LayoutTree
             state: WindowState::Suspended,
             window,
             renderer_data,
-            tabs: Tabs::from_url(default_url, layouter, debug)?,
+            tabs: Tabs::from_url::<P>(default_url, layouter, debug)?,
         })
     }
 
diff --git a/crates/gosub_v8/Cargo.toml b/crates/gosub_v8/Cargo.toml
index 379fdc5a6..87f02d50e 100644
--- a/crates/gosub_v8/Cargo.toml
+++ b/crates/gosub_v8/Cargo.toml
@@ -5,8 +5,6 @@ edition = "2021"
 authors = ["Gosub Community <info@gosub.io>"]
 license = "MIT"
 
-# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
-
 [dependencies]
 gosub_shared = { path = "../gosub_shared" }
 gosub_webexecutor = { path = "../gosub_webexecutor" }
diff --git a/crates/gosub_v8/src/v8.rs b/crates/gosub_v8/src/v8.rs
index 43d0fca79..865fd1a4f 100644
--- a/crates/gosub_v8/src/v8.rs
+++ b/crates/gosub_v8/src/v8.rs
@@ -48,10 +48,7 @@ impl V8Engine<'_> {
                 std::thread::sleep(std::time::Duration::from_millis(10));
                 wait_time -= 10;
                 if wait_time <= 9 {
-                    panic!(
-                        "V8 initialization timed out after {} seconds",
-                        MAX_V8_INIT_SECONDS
-                    );
+                    panic!("V8 initialization timed out after {} seconds", MAX_V8_INIT_SECONDS);
                 }
             }
             return;
@@ -93,10 +90,7 @@ impl<'a> V8Context<'a> {
         scope.throw_exception(e);
     }
 
-    pub fn create_exception<'b>(
-        scope: &mut HandleScope<'b>,
-        error: impl Display,
-    ) -> Option<Local<'b, Value>> {
+    pub fn create_exception<'b>(scope: &mut HandleScope<'b>, error: impl Display) -> Option<Local<'b, Value>> {
         let err = error.to_string();
         let Some(e) = v8::String::new(scope, &err) else {
             eprintln!("failed to create exception string\nexception was: {}", err);
diff --git a/crates/gosub_v8/src/v8/array.rs b/crates/gosub_v8/src/v8/array.rs
index e8658a3e8..fb256d09e 100644
--- a/crates/gosub_v8/src/v8/array.rs
+++ b/crates/gosub_v8/src/v8/array.rs
@@ -14,11 +14,7 @@ pub struct V8Array<'a> {
 
 impl<'a> FromContext<'a, Local<'a, Array>> for V8Array<'a> {
     fn from_ctx(ctx: V8Context<'a>, value: Local<'a, Array>) -> Self {
-        Self {
-            value,
-            ctx,
-            next: 0,
-        }
+        Self { value, ctx, next: 0 }
     }
 }
 
@@ -49,25 +45,16 @@ impl<'a> JSArray for V8Array<'a> {
 
     fn get(&self, index: usize) -> Result<<Self::RT as JSRuntime>::Value> {
         let Some(value) = self.value.get_index(self.ctx.scope(), index as u32) else {
-            return Err(Error::JS(JSError::Generic(
-                "failed to get a value from an array".to_owned(),
-            ))
-            .into());
+            return Err(Error::JS(JSError::Generic("failed to get a value from an array".to_owned())).into());
         };
 
         Ok(V8Value::from_value(self.ctx.clone(), value))
     }
 
     fn set(&self, index: usize, value: &V8Value) -> Result<()> {
-        match self
-            .value
-            .set_index(self.ctx.scope(), index as u32, value.value)
-        {
+        match self.value.set_index(self.ctx.scope(), index as u32, value.value) {
             Some(_) => Ok(()),
-            None => Err(Error::JS(JSError::Conversion(
-                "failed to set a value in an array".to_owned(),
-            ))
-            .into()),
+            None => Err(Error::JS(JSError::Conversion("failed to set a value in an array".to_owned())).into()),
         }
     }
 
@@ -76,9 +63,7 @@ impl<'a> JSArray for V8Array<'a> {
 
         match self.value.set_index(self.ctx.scope(), index, value.value) {
             Some(_) => Ok(()),
-            None => {
-                Err(Error::JS(JSError::Conversion("failed to push to an array".to_owned())).into())
-            }
+            None => Err(Error::JS(JSError::Conversion("failed to push to an array".to_owned())).into()),
         }
     }
 
@@ -86,32 +71,19 @@ impl<'a> JSArray for V8Array<'a> {
         let index = self.value.length() - 1;
 
         let Some(value) = self.value.get_index(self.ctx.scope(), index) else {
-            return Err(Error::JS(JSError::Generic(
-                "failed to get a value from an array".to_owned(),
-            ))
-            .into());
+            return Err(Error::JS(JSError::Generic("failed to get a value from an array".to_owned())).into());
         };
 
         if self.value.delete_index(self.ctx.scope(), index).is_none() {
-            return Err(Error::JS(JSError::Generic(
-                "failed to delete a value from an array".to_owned(),
-            ))
-            .into());
+            return Err(Error::JS(JSError::Generic("failed to delete a value from an array".to_owned())).into());
         }
 
         Ok(V8Value::from_value(self.ctx.clone(), value))
     }
 
     fn remove(&self, index: usize) -> Result<()> {
-        if self
-            .value
-            .delete_index(self.ctx.scope(), index as u32)
-            .is_none()
-        {
-            return Err(Error::JS(JSError::Generic(
-                "failed to delete a value from an array".to_owned(),
-            ))
-            .into());
+        if self.value.delete_index(self.ctx.scope(), index as u32).is_none() {
+            return Err(Error::JS(JSError::Generic("failed to delete a value from an array".to_owned())).into());
         }
 
         Ok(())
@@ -162,8 +134,7 @@ impl<'a> JSArray for V8Array<'a> {
 #[cfg(test)]
 mod tests {
     use gosub_webexecutor::js::{
-        ArrayConversion, IntoJSValue, IntoRustValue, JSArray, JSContext, JSObject, JSRuntime,
-        JSValue,
+        ArrayConversion, IntoJSValue, IntoRustValue, JSArray, JSContext, JSObject, JSRuntime, JSValue,
     };
 
     use crate::v8::{V8Array, V8Engine, V8Value};
@@ -174,12 +145,8 @@ mod tests {
         let context = engine.new_context().unwrap();
 
         let array = V8Array::new(context.clone(), 2).unwrap();
-        array
-            .set(0, &1234.0.to_js_value(context.clone()).unwrap())
-            .unwrap();
-        array
-            .set(1, &"Hello World!".to_js_value(context).unwrap())
-            .unwrap();
+        array.set(0, &1234.0.to_js_value(context.clone()).unwrap()).unwrap();
+        array.set(1, &"Hello World!".to_js_value(context).unwrap()).unwrap();
 
         assert_eq!(array.len(), 2);
     }
@@ -191,12 +158,8 @@ mod tests {
 
         let array = V8Array::new(context.clone(), 2).unwrap();
 
-        array
-            .set(0, &1234.0.to_js_value(context.clone()).unwrap())
-            .unwrap();
-        array
-            .set(1, &"Hello World!".to_js_value(context).unwrap())
-            .unwrap();
+        array.set(0, &1234.0.to_js_value(context.clone()).unwrap()).unwrap();
+        array.set(1, &"Hello World!".to_js_value(context).unwrap()).unwrap();
 
         assert_eq!(array.get(0).unwrap().as_number().unwrap(), 1234.0);
         assert_eq!(array.get(1).unwrap().as_string().unwrap(), "Hello World!");
@@ -209,12 +172,8 @@ mod tests {
 
         let array = V8Array::new(context.clone(), 2).unwrap();
 
-        array
-            .push(1234.0.to_js_value(context.clone()).unwrap())
-            .unwrap();
-        array
-            .push("Hello World!".to_js_value(context).unwrap())
-            .unwrap();
+        array.push(1234.0.to_js_value(context.clone()).unwrap()).unwrap();
+        array.push("Hello World!".to_js_value(context).unwrap()).unwrap();
 
         assert_eq!(array.len(), 4);
     }
@@ -226,12 +185,8 @@ mod tests {
 
         let array = V8Array::new(context.clone(), 2).unwrap();
 
-        array
-            .set(0, &1234.0.to_js_value(context.clone()).unwrap())
-            .unwrap();
-        array
-            .set(1, &"Hello World!".to_js_value(context).unwrap())
-            .unwrap();
+        array.set(0, &1234.0.to_js_value(context.clone()).unwrap()).unwrap();
+        array.set(1, &"Hello World!".to_js_value(context).unwrap()).unwrap();
 
         assert!(array.get(2).unwrap().is_undefined());
     }
@@ -243,12 +198,8 @@ mod tests {
 
         let array = V8Array::new(context.clone(), 2).unwrap();
 
-        array
-            .set(0, &1234.0.to_js_value(context.clone()).unwrap())
-            .unwrap();
-        array
-            .set(1, &"Hello World!".to_js_value(context).unwrap())
-            .unwrap();
+        array.set(0, &1234.0.to_js_value(context.clone()).unwrap()).unwrap();
+        array.set(1, &"Hello World!".to_js_value(context).unwrap()).unwrap();
 
         assert_eq!(array.pop().unwrap().as_string().unwrap(), "Hello World!");
         assert_eq!(array.get(0).unwrap().as_number().unwrap(), 1234.0);
@@ -262,15 +213,11 @@ mod tests {
 
         let array = V8Array::new(context.clone(), 2).unwrap();
 
-        array
-            .set(0, &1234.0.to_js_value(context.clone()).unwrap())
-            .unwrap();
+        array.set(0, &1234.0.to_js_value(context.clone()).unwrap()).unwrap();
         array
             .set(1, &"Hello World!".to_js_value(context.clone()).unwrap())
             .unwrap();
-        array
-            .set(2, &1234.0.to_js_value(context.clone()).unwrap())
-            .unwrap();
+        array.set(2, &1234.0.to_js_value(context.clone()).unwrap()).unwrap();
         array
             .set(3, &"Hello World!".to_js_value(context.clone()).unwrap())
             .unwrap();
diff --git a/crates/gosub_v8/src/v8/context.rs b/crates/gosub_v8/src/v8/context.rs
index 475e9c88a..0e197cc35 100644
--- a/crates/gosub_v8/src/v8/context.rs
+++ b/crates/gosub_v8/src/v8/context.rs
@@ -1,8 +1,8 @@
 use std::ptr::NonNull;
 
 use v8::{
-    CallbackScope, ContextScope, CreateParams, HandleScope, Isolate, Local, Object, OwnedIsolate,
-    StackFrame, StackTrace, TryCatch,
+    CallbackScope, ContextScope, CreateParams, HandleScope, Isolate, Local, Object, OwnedIsolate, StackFrame,
+    StackTrace, TryCatch,
 };
 
 use gosub_shared::types::Result;
@@ -87,22 +87,14 @@ impl<'a> V8Ctx<'a> {
         let handle_scope = Box::new(HandleScopeType::new(unsafe { v8_ctx.isolate.as_mut() }));
 
         let Some(handle_scope) = NonNull::new(Box::into_raw(handle_scope)) else {
-            return Err(
-                Error::JS(JSError::Compile("Failed to create handle scope".to_owned())).into(),
-            );
+            return Err(Error::JS(JSError::Compile("Failed to create handle scope".to_owned())).into());
         };
 
         v8_ctx.handle_scope = handle_scope;
 
-        let ctx = v8::Context::new(
-            unsafe { v8_ctx.handle_scope.as_mut() }.get(),
-            Default::default(),
-        );
+        let ctx = v8::Context::new(unsafe { v8_ctx.handle_scope.as_mut() }.get(), Default::default());
 
-        let ctx_scope = Box::new(ContextScope::new(
-            unsafe { v8_ctx.handle_scope.as_mut() }.get(),
-            ctx,
-        ));
+        let ctx_scope = Box::new(ContextScope::new(unsafe { v8_ctx.handle_scope.as_mut() }.get(), ctx));
 
         let Some(ctx) = NonNull::new(Box::into_raw(Box::new(ctx))) else {
             return Err(Error::JS(JSError::Compile("Failed to create context".to_owned())).into());
@@ -111,10 +103,7 @@ impl<'a> V8Ctx<'a> {
         v8_ctx.ctx = ctx;
 
         let Some(ctx_scope) = NonNull::new(Box::into_raw(ctx_scope)) else {
-            return Err(Error::JS(JSError::Compile(
-                "Failed to create context scope".to_owned(),
-            ))
-            .into());
+            return Err(Error::JS(JSError::Compile("Failed to create context scope".to_owned())).into());
         };
 
         v8_ctx.context_scope = ctx_scope;
@@ -174,9 +163,7 @@ impl<'a> V8Ctx<'a> {
 
     fn handle_stack_frame(ctx: &mut HandleScope, frame: Local<StackFrame>) -> Option<String> {
         let function = frame.get_function_name(ctx)?.to_rust_string_lossy(ctx);
-        let script = frame
-            .get_script_name_or_source_url(ctx)?
-            .to_rust_string_lossy(ctx);
+        let script = frame.get_script_name_or_source_url(ctx)?.to_rust_string_lossy(ctx);
         let line = frame.get_line_number();
         let column = frame.get_column();
 
@@ -238,9 +225,7 @@ pub fn ctx_from_scope_isolate<'a>(
 
         return Err((
             *scope,
-            Error::JS(JSError::Compile(
-                "Failed to create context scope".to_owned(),
-            )),
+            Error::JS(JSError::Compile("Failed to create context scope".to_owned())),
         ));
     };
 
diff --git a/crates/gosub_v8/src/v8/function.rs b/crates/gosub_v8/src/v8/function.rs
index 4309ccfa4..31b250002 100644
--- a/crates/gosub_v8/src/v8/function.rs
+++ b/crates/gosub_v8/src/v8/function.rs
@@ -1,14 +1,14 @@
 use core::fmt::Display;
 
 use v8::{
-    undefined, CallbackScope, External, Function, FunctionBuilder, FunctionCallbackArguments,
-    FunctionCallbackInfo, Local, ReturnValue, TryCatch,
+    undefined, CallbackScope, External, Function, FunctionBuilder, FunctionCallbackArguments, FunctionCallbackInfo,
+    Local, ReturnValue, TryCatch,
 };
 
 use gosub_shared::types::Result;
 use gosub_webexecutor::js::{
-    Args, IntoRustValue, JSError, JSFunction, JSFunctionCallBack, JSFunctionCallBackVariadic,
-    JSFunctionVariadic, JSRuntime, VariadicArgs, VariadicArgsInternal,
+    Args, IntoRustValue, JSError, JSFunction, JSFunctionCallBack, JSFunctionCallBackVariadic, JSFunctionVariadic,
+    JSRuntime, VariadicArgs, VariadicArgsInternal,
 };
 use gosub_webexecutor::Error;
 
@@ -48,11 +48,7 @@ impl<'a> Iterator for V8Args<'a> {
 impl<'a> Args for V8Args<'a> {
     type RT = V8Engine<'a>;
 
-    fn get(
-        &self,
-        index: usize,
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> Option<<Self::RT as JSRuntime>::Value> {
+    fn get(&self, index: usize, ctx: <Self::RT as JSRuntime>::Context) -> Option<<Self::RT as JSRuntime>::Value> {
         if index < self.args.len() {
             Some(V8Value {
                 context: V8Context::clone(&ctx),
@@ -198,14 +194,8 @@ struct CallbackWrapper<'a> {
 
 impl<'a> CallbackWrapper<'a> {
     #[allow(clippy::new_ret_no_self)]
-    fn new(
-        ctx: V8Context<'a>,
-        f: impl Fn(&mut V8FunctionCallBack<'a>) + 'static,
-    ) -> *mut std::ffi::c_void {
-        let data = Box::new(Self {
-            ctx,
-            f: Box::new(f),
-        });
+    fn new(ctx: V8Context<'a>, f: impl Fn(&mut V8FunctionCallBack<'a>) + 'static) -> *mut std::ffi::c_void {
+        let data = Box::new(Self { ctx, f: Box::new(f) });
 
         Box::into_raw(data) as *mut std::ffi::c_void
     }
@@ -234,10 +224,7 @@ impl<'a> JSFunction for V8Function<'a> {
         }
     }
 
-    fn call(
-        &mut self,
-        args: &[<Self::RT as JSRuntime>::Value],
-    ) -> Result<<Self::RT as JSRuntime>::Value> {
+    fn call(&mut self, args: &[<Self::RT as JSRuntime>::Value]) -> Result<<Self::RT as JSRuntime>::Value> {
         let scope = &mut TryCatch::new(self.ctx.scope());
 
         let recv = Local::from(v8::undefined(scope));
@@ -295,11 +282,7 @@ impl<'a> Iterator for V8VariadicArgsInternal<'a> {
 impl<'a> VariadicArgsInternal for V8VariadicArgsInternal<'a> {
     type RT = V8Engine<'a>;
 
-    fn get(
-        &self,
-        index: usize,
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> Option<<Self::RT as JSRuntime>::Value> {
+    fn get(&self, index: usize, ctx: <Self::RT as JSRuntime>::Context) -> Option<<Self::RT as JSRuntime>::Value> {
         if index < self.args.len() {
             Some(V8Value {
                 context: V8Context::clone(&ctx),
@@ -330,13 +313,8 @@ impl<'a> VariadicArgsInternal for V8VariadicArgsInternal<'a> {
         a
     }
 
-    fn variadic(
-        &self,
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> <Self::RT as JSRuntime>::VariadicArgs {
-        V8VariadicArgs {
-            args: self.as_vec(ctx),
-        }
+    fn variadic(&self, ctx: <Self::RT as JSRuntime>::Context) -> <Self::RT as JSRuntime>::VariadicArgs {
+        V8VariadicArgs { args: self.as_vec(ctx) }
     }
 
     fn variadic_start(
@@ -379,10 +357,7 @@ impl<'a> VariadicArgs for V8VariadicArgs<'a> {
     where
         <Self::RT as JSRuntime>::Value: IntoRustValue<T>,
     {
-        self.args
-            .iter()
-            .map(|x| x.to_rust_value().unwrap())
-            .collect()
+        self.args.iter().map(|x| x.to_rust_value().unwrap()).collect()
     }
 
     fn get_as<T>(&self, index: usize) -> Option<T>
@@ -509,14 +484,8 @@ struct CallbackWrapperVariadic<'a> {
 
 impl<'a> CallbackWrapperVariadic<'a> {
     #[allow(clippy::new_ret_no_self)]
-    fn new(
-        ctx: V8Context<'a>,
-        f: impl Fn(&mut V8FunctionCallBackVariadic<'a>) + 'static,
-    ) -> *mut std::ffi::c_void {
-        let data = Box::new(Self {
-            ctx,
-            f: Box::new(f),
-        });
+    fn new(ctx: V8Context<'a>, f: impl Fn(&mut V8FunctionCallBackVariadic<'a>) + 'static) -> *mut std::ffi::c_void {
+        let data = Box::new(Self { ctx, f: Box::new(f) });
 
         Box::into_raw(data) as *mut _ as *mut std::ffi::c_void
     }
@@ -544,10 +513,7 @@ impl<'a> JSFunctionVariadic for V8FunctionVariadic<'a> {
         }
     }
 
-    fn call(
-        &mut self,
-        args: &[<Self::RT as JSRuntime>::Value],
-    ) -> Result<<Self::RT as JSRuntime>::Value> {
+    fn call(&mut self, args: &[<Self::RT as JSRuntime>::Value]) -> Result<<Self::RT as JSRuntime>::Value> {
         let scope = &mut v8::TryCatch::new(self.ctx.scope());
         let recv = Local::from(v8::undefined(scope));
         let ret = self.function.call(
diff --git a/crates/gosub_v8/src/v8/object.rs b/crates/gosub_v8/src/v8/object.rs
index 65cda3be3..01dda7d52 100644
--- a/crates/gosub_v8/src/v8/object.rs
+++ b/crates/gosub_v8/src/v8/object.rs
@@ -2,19 +2,14 @@ use core::fmt::Display;
 use std::ffi::c_void;
 
 use v8::{
-    AccessorConfiguration, External, HandleScope, Local, Name, Object, PropertyCallbackArguments,
-    ReturnValue, Value,
+    AccessorConfiguration, External, HandleScope, Local, Name, Object, PropertyCallbackArguments, ReturnValue, Value,
 };
 
 use gosub_shared::types::Result;
-use gosub_webexecutor::js::{
-    JSError, JSGetterCallback, JSObject, JSRuntime, JSSetterCallback, JSValue,
-};
+use gosub_webexecutor::js::{JSError, JSGetterCallback, JSObject, JSRuntime, JSSetterCallback, JSValue};
 use gosub_webexecutor::Error;
 
-use crate::{
-    ctx_from, FromContext, V8Context, V8Ctx, V8Engine, V8Function, V8FunctionVariadic, V8Value,
-};
+use crate::{ctx_from, FromContext, V8Context, V8Ctx, V8Engine, V8Function, V8FunctionVariadic, V8Value};
 
 pub struct V8Object<'a> {
     pub ctx: V8Context<'a>,
@@ -85,15 +80,8 @@ impl<'a> JSObject for V8Object<'a> {
             return Err(Error::JS(JSError::Generic("failed to create a string".to_owned())).into());
         };
 
-        if self
-            .value
-            .set(self.ctx.scope(), name.into(), value.value)
-            .is_none()
-        {
-            Err(Error::JS(JSError::Generic(
-                "failed to set a property in an object".to_owned(),
-            ))
-            .into())
+        if self.value.set(self.ctx.scope(), name.into(), value.value).is_none() {
+            Err(Error::JS(JSError::Generic("failed to set a property in an object".to_owned())).into())
         } else {
             Ok(())
         }
@@ -108,12 +96,7 @@ impl<'a> JSObject for V8Object<'a> {
 
         self.value
             .get(scope, name.into())
-            .ok_or_else(|| {
-                Error::JS(JSError::Generic(
-                    "failed to get a property from an object".to_owned(),
-                ))
-                .into()
-            })
+            .ok_or_else(|| Error::JS(JSError::Generic("failed to get a property from an object".to_owned())).into())
             .map(|value| V8Value::from_value(self.ctx.clone(), value))
     }
 
@@ -125,9 +108,7 @@ impl<'a> JSObject for V8Object<'a> {
         let func = self.get_property(name)?.value;
 
         if !func.is_function() {
-            return Err(
-                Error::JS(JSError::Generic("property is not a function".to_owned())).into(),
-            );
+            return Err(Error::JS(JSError::Generic("property is not a function".to_owned())).into());
         }
 
         let function = Local::<v8::Function>::try_from(func).unwrap();
@@ -152,9 +133,7 @@ impl<'a> JSObject for V8Object<'a> {
         };
 
         if !func.function.is_function() {
-            return Err(
-                Error::JS(JSError::Generic("property is not a function".to_owned())).into(),
-            );
+            return Err(Error::JS(JSError::Generic("property is not a function".to_owned())).into());
         }
 
         if self
@@ -162,10 +141,7 @@ impl<'a> JSObject for V8Object<'a> {
             .set(self.ctx.scope(), name.into(), func.function.into())
             .is_none()
         {
-            Err(Error::JS(JSError::Generic(
-                "failed to set a property in an object".to_owned(),
-            ))
-            .into())
+            Err(Error::JS(JSError::Generic("failed to set a property in an object".to_owned())).into())
         } else {
             Ok(())
         }
@@ -177,9 +153,7 @@ impl<'a> JSObject for V8Object<'a> {
         };
 
         if !func.function.is_function() {
-            return Err(
-                Error::JS(JSError::Generic("property is not a function".to_owned())).into(),
-            );
+            return Err(Error::JS(JSError::Generic("property is not a function".to_owned())).into());
         }
 
         if self
@@ -187,10 +161,7 @@ impl<'a> JSObject for V8Object<'a> {
             .set(self.ctx.scope(), name.into(), func.function.into())
             .is_none()
         {
-            Err(Error::JS(JSError::Generic(
-                "failed to set a property in an object".to_owned(),
-            ))
-            .into())
+            Err(Error::JS(JSError::Generic("failed to set a property in an object".to_owned())).into())
         } else {
             Ok(())
         }
@@ -216,10 +187,7 @@ impl<'a> JSObject for V8Object<'a> {
         let data = External::new(scope, Box::into_raw(gs) as *mut c_void);
 
         let config = AccessorConfiguration::new(
-            |scope: &mut HandleScope,
-             _name: Local<Name>,
-             args: PropertyCallbackArguments,
-             mut rv: ReturnValue| {
+            |scope: &mut HandleScope, _name: Local<Name>, args: PropertyCallbackArguments, mut rv: ReturnValue| {
                 let external = match Local::<External>::try_from(args.data()) {
                     Ok(external) => external,
                     Err(e) => {
@@ -322,8 +290,7 @@ impl<'a> JSObject for V8Object<'a> {
         )
         .data(Local::from(data));
 
-        self.value
-            .set_accessor_with_configuration(scope, name.into(), config);
+        self.value.set_accessor_with_configuration(scope, name.into(), config);
 
         Ok(())
     }
@@ -343,8 +310,8 @@ mod tests {
     use serde_json::to_string;
 
     use gosub_webexecutor::js::{
-        IntoJSValue, JSFunction, JSFunctionCallBack, JSFunctionCallBackVariadic,
-        JSFunctionVariadic, VariadicArgsInternal,
+        IntoJSValue, JSFunction, JSFunctionCallBack, JSFunctionCallBackVariadic, JSFunctionVariadic,
+        VariadicArgsInternal,
     };
 
     use crate::v8::{V8FunctionCallBack, V8FunctionCallBackVariadic};
diff --git a/crates/gosub_v8/src/v8/value.rs b/crates/gosub_v8/src/v8/value.rs
index c3c4b47e2..b7d6e2f99 100644
--- a/crates/gosub_v8/src/v8/value.rs
+++ b/crates/gosub_v8/src/v8/value.rs
@@ -3,9 +3,7 @@ use v8::{Array, Local, Value};
 use gosub_shared::types::Result;
 
 use crate::{FromContext, IntoContext, V8Array, V8Context, V8Engine, V8Object};
-use gosub_webexecutor::js::{
-    ArrayConversion, AsArray, IntoJSValue, JSArray, JSError, JSRuntime, JSType, JSValue, Ref,
-};
+use gosub_webexecutor::js::{ArrayConversion, AsArray, IntoJSValue, JSArray, JSError, JSRuntime, JSType, JSValue, Ref};
 use gosub_webexecutor::Error;
 
 pub struct V8Value<'a> {
@@ -15,10 +13,7 @@ pub struct V8Value<'a> {
 
 impl<'a> V8Value<'a> {
     pub fn from_value(ctx: V8Context<'a>, value: Local<'a, Value>) -> Self {
-        Self {
-            context: ctx,
-            value,
-        }
+        Self { context: ctx, value }
     }
 }
 
@@ -67,10 +62,7 @@ impl<'a> JSValue for V8Value<'a> {
         if let Some(value) = self.value.number_value(self.context.scope()) {
             Ok(value)
         } else {
-            Err(Error::JS(JSError::Conversion(
-                "could not convert to number".to_owned(),
-            ))
-            .into())
+            Err(Error::JS(JSError::Conversion("could not convert to number".to_owned())).into())
         }
     }
 
@@ -82,10 +74,7 @@ impl<'a> JSValue for V8Value<'a> {
         if let Some(value) = self.value.to_object(self.context.scope()) {
             Ok(V8Object::from_ctx(V8Context::clone(&self.context), value))
         } else {
-            Err(Error::JS(JSError::Conversion(
-                "could not convert to number".to_owned(),
-            ))
-            .into())
+            Err(Error::JS(JSError::Conversion("could not convert to number".to_owned())).into())
         }
     }
 
@@ -134,9 +123,7 @@ impl<'a> JSValue for V8Value<'a> {
         }
     }
 
-    fn new_object(
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> Result<<Self::RT as JSRuntime>::Object> {
+    fn new_object(ctx: <Self::RT as JSRuntime>::Context) -> Result<<Self::RT as JSRuntime>::Object> {
         V8Object::new(ctx)
     }
 
@@ -147,9 +134,7 @@ impl<'a> JSValue for V8Value<'a> {
         value.to_js_array(ctx)
     }
 
-    fn new_empty_array(
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> Result<<Self::RT as JSRuntime>::Array> {
+    fn new_empty_array(ctx: <Self::RT as JSRuntime>::Context) -> Result<<Self::RT as JSRuntime>::Array> {
         V8Array::new(ctx, 0)
     }
 
@@ -160,10 +145,7 @@ impl<'a> JSValue for V8Value<'a> {
                 value: Local::from(value),
             })
         } else {
-            Err(Error::JS(JSError::Conversion(
-                "could not convert to string".to_owned(),
-            ))
-            .into())
+            Err(Error::JS(JSError::Conversion("could not convert to string".to_owned())).into())
         }
     }
 
diff --git a/crates/gosub_vello/Cargo.toml b/crates/gosub_vello/Cargo.toml
index a3a82cb83..c0d236c5e 100644
--- a/crates/gosub_vello/Cargo.toml
+++ b/crates/gosub_vello/Cargo.toml
@@ -2,6 +2,8 @@
 name = "gosub_vello"
 version = "0.1.0"
 edition = "2021"
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
 
 [dependencies]
 gosub_shared = { path = "../gosub_shared" }
diff --git a/crates/gosub_vello/src/border.rs b/crates/gosub_vello/src/border.rs
index b858317bd..04d5a0344 100644
--- a/crates/gosub_vello/src/border.rs
+++ b/crates/gosub_vello/src/border.rs
@@ -5,8 +5,7 @@ use vello::Scene;
 use crate::{Brush, Rect, Transform, VelloBackend};
 use gosub_render_backend::geo::FP;
 use gosub_render_backend::{
-    Border as TBorder, BorderRadius as TBorderRadius, BorderSide as TBorderSide, BorderStyle,
-    Radius, RenderBorder,
+    Border as TBorder, BorderRadius as TBorderRadius, BorderSide as TBorderSide, BorderStyle, Radius, RenderBorder,
 };
 
 pub struct Border {
@@ -133,16 +132,10 @@ impl Border {
                         let offset_left = left.offset();
                         let offset_right = right.offset();
 
-                        path.move_to((
-                            pos.x - offset_left.width as f64,
-                            pos.y - offset_left.height as f64,
-                        ));
+                        path.move_to((pos.x - offset_left.width as f64, pos.y - offset_left.height as f64));
 
                         let arc = Arc::new(
-                            (
-                                pos.x + offset_left.width as f64,
-                                pos.y - offset_left.height as f64,
-                            ),
+                            (pos.x + offset_left.width as f64, pos.y - offset_left.height as f64),
                             left.radii_f64(),
                             -std::f64::consts::PI * 3.0 / 4.0,
                             std::f64::consts::PI / 4.0,
@@ -159,10 +152,7 @@ impl Border {
                         ));
 
                         let arc = Arc::new(
-                            (
-                                pos.x + width - right.radi_x() as f64,
-                                pos.y + right.radi_y() as f64,
-                            ),
+                            (pos.x + width - right.radi_x() as f64, pos.y + right.radi_y() as f64),
                             right.radii_f64(),
                             0.0,
                             std::f64::consts::PI / 4.0,
@@ -254,16 +244,10 @@ impl Border {
                         path.curve_to(p1, p2, p3);
                     });
 
-                    path.line_to((
-                        pos.x + left.radi_x() as f64,
-                        pos.y + height - offset_left.height as f64,
-                    ));
+                    path.line_to((pos.x + left.radi_x() as f64, pos.y + height - offset_left.height as f64));
 
                     let arc = Arc::new(
-                        (
-                            pos.x + left.radi_x() as f64,
-                            pos.y + height - offset_left.height as f64,
-                        ),
+                        (pos.x + left.radi_x() as f64, pos.y + height - offset_left.height as f64),
                         left.radii_f64(),
                         -std::f64::consts::PI * 3.0 / 2.0,
                         std::f64::consts::PI / 4.0,
@@ -304,16 +288,10 @@ impl Border {
                         path.curve_to(p1, p2, p3);
                     });
 
-                    path.line_to((
-                        pos.x + offset_bottom.width as f64,
-                        pos.y + bottom.radi_y() as f64,
-                    ));
+                    path.line_to((pos.x + offset_bottom.width as f64, pos.y + bottom.radi_y() as f64));
 
                     let arc = Arc::new(
-                        (
-                            pos.x + offset_bottom.width as f64,
-                            pos.y + bottom.radi_y() as f64,
-                        ),
+                        (pos.x + offset_bottom.width as f64, pos.y + bottom.radi_y() as f64),
                         bottom.radii_f64(),
                         -std::f64::consts::PI,
                         std::f64::consts::PI / 4.0,
@@ -425,11 +403,7 @@ pub struct BorderSide {
 
 impl TBorderSide<VelloBackend> for BorderSide {
     fn new(width: FP, style: BorderStyle, brush: Brush) -> Self {
-        Self {
-            width,
-            style,
-            brush,
-        }
+        Self { width, style, brush }
     }
 }
 
diff --git a/crates/gosub_vello/src/gradient.rs b/crates/gosub_vello/src/gradient.rs
index 82c059f70..27b844daa 100644
--- a/crates/gosub_vello/src/gradient.rs
+++ b/crates/gosub_vello/src/gradient.rs
@@ -1,6 +1,4 @@
-use vello::peniko::{
-    ColorStop as VelloColorStop, ColorStops as VelloColorStops, Gradient as VelloGradient,
-};
+use vello::peniko::{ColorStop as VelloColorStop, ColorStops as VelloColorStops, Gradient as VelloGradient};
 
 use crate::{Convert, VelloBackend};
 use gosub_render_backend::geo::{Point, FP};
@@ -29,12 +27,8 @@ impl TGradient<VelloBackend> for Gradient {
         end_radius: FP,
         stops: ColorStops<VelloBackend>,
     ) -> Self {
-        let mut gradient = VelloGradient::new_two_point_radial(
-            start_center.convert(),
-            start_radius,
-            end_center.convert(),
-            end_radius,
-        );
+        let mut gradient =
+            VelloGradient::new_two_point_radial(start_center.convert(), start_radius, end_center.convert(), end_radius);
 
         gradient.stops = stops.convert();
 
@@ -51,12 +45,7 @@ impl TGradient<VelloBackend> for Gradient {
         Gradient(gradient)
     }
 
-    fn new_sweep(
-        center: Point,
-        start_angle: FP,
-        end_angle: FP,
-        stops: ColorStops<VelloBackend>,
-    ) -> Self {
+    fn new_sweep(center: Point, start_angle: FP, end_angle: FP, stops: ColorStops<VelloBackend>) -> Self {
         let mut gradient = VelloGradient::new_sweep(center.convert(), start_angle, end_angle);
         gradient.stops = stops.convert();
 
diff --git a/crates/gosub_vello/src/image.rs b/crates/gosub_vello/src/image.rs
index 977c286b6..b264345ed 100644
--- a/crates/gosub_vello/src/image.rs
+++ b/crates/gosub_vello/src/image.rs
@@ -18,12 +18,7 @@ impl TImage for Image {
     fn new(size: (FP, FP), data: Vec<u8>) -> Self {
         let blob = Blob::new(Arc::new(data));
 
-        Image(VelloImage::new(
-            blob,
-            Format::Rgba8,
-            size.0 as u32,
-            size.1 as u32,
-        ))
+        Image(VelloImage::new(blob, Format::Rgba8, size.0 as u32, size.1 as u32))
     }
 
     fn from_img(img: DynamicImage) -> Self {
diff --git a/crates/gosub_vello/src/lib.rs b/crates/gosub_vello/src/lib.rs
index 59f2d5121..0a5743dad 100644
--- a/crates/gosub_vello/src/lib.rs
+++ b/crates/gosub_vello/src/lib.rs
@@ -92,12 +92,9 @@ impl RenderBackend for VelloBackend {
         data: &mut Self::WindowData<'_>,
         size: SizeU32,
     ) -> Result<Self::ActiveWindowData<'a>> {
-        let surface = data.adapter.create_surface(
-            handle,
-            size.width,
-            size.height,
-            wgpu::PresentMode::AutoVsync,
-        )?;
+        let surface = data
+            .adapter
+            .create_surface(handle, size.width, size.height, wgpu::PresentMode::AutoVsync)?;
 
         let renderer = data.adapter.create_renderer(Some(surface.config.format))?;
 
@@ -115,10 +112,7 @@ impl RenderBackend for VelloBackend {
         Ok(())
     }
 
-    fn create_window_data<'a>(
-        &mut self,
-        _handle: impl WindowHandle,
-    ) -> Result<Self::WindowData<'a>> {
+    fn create_window_data<'a>(&mut self, _handle: impl WindowHandle) -> Result<Self::WindowData<'a>> {
         let renderer = futures::executor::block_on(Renderer::new(RendererOptions::default()))?;
 
         let adapter = renderer.instance_adapter;
@@ -138,11 +132,9 @@ impl RenderBackend for VelloBackend {
         active_window_data: &mut Self::ActiveWindowData<'a>,
         size: SizeU32,
     ) -> Result<()> {
-        window_data.adapter.resize_surface(
-            &mut active_window_data.surface,
-            size.width,
-            size.height,
-        );
+        window_data
+            .adapter
+            .resize_surface(&mut active_window_data.surface, size.width, size.height);
 
         Ok(())
     }
diff --git a/crates/gosub_vello/src/rect.rs b/crates/gosub_vello/src/rect.rs
index 52dfc292a..440dd2059 100644
--- a/crates/gosub_vello/src/rect.rs
+++ b/crates/gosub_vello/src/rect.rs
@@ -12,13 +12,7 @@ impl From<VelloRect> for Rect {
 
 impl TRect for Rect {
     fn new(x: FP, y: FP, width: FP, height: FP) -> Self {
-        VelloRect::new(
-            x as f64,
-            y as f64,
-            x as f64 + width as f64,
-            y as f64 + height as f64,
-        )
-        .into()
+        VelloRect::new(x as f64, y as f64, x as f64 + width as f64, y as f64 + height as f64).into()
     }
 
     fn from_point(point: Point, size: Size) -> Self {
diff --git a/crates/gosub_vello/src/render.rs b/crates/gosub_vello/src/render.rs
index 8f91d2e3b..a800a4138 100644
--- a/crates/gosub_vello/src/render.rs
+++ b/crates/gosub_vello/src/render.rs
@@ -5,12 +5,11 @@ use anyhow::anyhow;
 use gosub_render_backend::WindowHandle;
 use vello::{AaSupport, Renderer as VelloRenderer, RendererOptions as VelloRendererOptions};
 use wgpu::util::{
-    backend_bits_from_env, dx12_shader_compiler_from_env, gles_minor_version_from_env,
-    power_preference_from_env,
+    backend_bits_from_env, dx12_shader_compiler_from_env, gles_minor_version_from_env, power_preference_from_env,
 };
 use wgpu::{
-    Adapter, Backends, CompositeAlphaMode, Device, Dx12Compiler, Gles3MinorVersion, Instance,
-    InstanceDescriptor, PowerPreference, Queue, Surface, SurfaceConfiguration, TextureFormat,
+    Adapter, Backends, CompositeAlphaMode, Device, Dx12Compiler, Gles3MinorVersion, Instance, InstanceDescriptor,
+    PowerPreference, Queue, Surface, SurfaceConfiguration, TextureFormat,
 };
 
 use gosub_shared::types::Result;
diff --git a/crates/gosub_vello/src/scene.rs b/crates/gosub_vello/src/scene.rs
index 33e3e76f1..dc17579bf 100644
--- a/crates/gosub_vello/src/scene.rs
+++ b/crates/gosub_vello/src/scene.rs
@@ -28,11 +28,9 @@ impl TScene<VelloBackend> for Scene {
 
         if let Some(radius) = &rect.radius {
             let shape = RoundedRect::from_rect(rect.rect.0, radius.clone());
-            self.0
-                .fill(Fill::NonZero, affine, brush, brush_transform, &shape)
+            self.0.fill(Fill::NonZero, affine, brush, brush_transform, &shape)
         } else {
-            self.0
-                .fill(Fill::NonZero, affine, brush, brush_transform, &rect.rect.0)
+            self.0.fill(Fill::NonZero, affine, brush, brush_transform, &rect.rect.0)
         }
 
         if let Some(border) = &rect.border {
@@ -55,11 +53,7 @@ impl TScene<VelloBackend> for Scene {
         render_text_simple(self, text, pos, size)
     }
 
-    fn apply_scene(
-        &mut self,
-        scene: &<VelloBackend as RenderBackend>::Scene,
-        transform: Option<Transform>,
-    ) {
+    fn apply_scene(&mut self, scene: &<VelloBackend as RenderBackend>::Scene, transform: Option<Transform>) {
         // let enc = self.0.encoding();
         //
         // enc.
diff --git a/crates/gosub_vello/src/text.rs b/crates/gosub_vello/src/text.rs
index 8bfa7d54c..55aeeb005 100644
--- a/crates/gosub_vello/src/text.rs
+++ b/crates/gosub_vello/src/text.rs
@@ -35,11 +35,7 @@ impl TText for Text {
             })
             .collect();
 
-        let coords = layout
-            .coords()
-            .iter()
-            .map(|c| NormalizedCoord::from_bits(*c))
-            .collect();
+        let coords = layout.coords().iter().map(|c| NormalizedCoord::from_bits(*c)).collect();
 
         Self {
             glyphs,
diff --git a/crates/gosub_vello/src/vello_svg.rs b/crates/gosub_vello/src/vello_svg.rs
index 99dd2f4fb..e5bb838f7 100644
--- a/crates/gosub_vello/src/vello_svg.rs
+++ b/crates/gosub_vello/src/vello_svg.rs
@@ -1,10 +1,11 @@
-use gosub_html5::node::NodeId;
-use gosub_html5::parser::document::DocumentHandle;
 use gosub_render_backend::svg::SvgRenderer;
 use gosub_render_backend::ImageBuffer;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::Document;
 use gosub_shared::types::{Result, Size};
 
-use crate::render::window::WindowData;
 use crate::VelloBackend;
 use gosub_svg::SVGDocument;
 
@@ -21,7 +22,10 @@ impl SvgRenderer<VelloBackend> for VelloSVG {
         SVGDocument::from_str(&data)
     }
 
-    fn parse_internal(tree: DocumentHandle, id: NodeId) -> Result<Self::SvgDocument> {
+    fn parse_internal<D: Document<C>, C: CssSystem>(
+        tree: DocumentHandle<D, C>,
+        id: NodeId,
+    ) -> Result<Self::SvgDocument> {
         SVGDocument::from_html_doc(id, tree)
     }
 
diff --git a/crates/gosub_webexecutor/src/js/array.rs b/crates/gosub_webexecutor/src/js/array.rs
index 8a82e2546..fe3ab8d17 100644
--- a/crates/gosub_webexecutor/src/js/array.rs
+++ b/crates/gosub_webexecutor/src/js/array.rs
@@ -2,9 +2,7 @@ use gosub_shared::types::Result;
 
 use crate::js::{AsArray, JSRuntime};
 
-pub trait JSArray:
-    Iterator + Into<<Self::RT as JSRuntime>::Value> + AsArray<Runtime = Self::RT>
-{
+pub trait JSArray: Iterator + Into<<Self::RT as JSRuntime>::Value> + AsArray<Runtime = Self::RT> {
     type RT: JSRuntime<Array = Self>;
 
     fn get(&self, index: usize) -> Result<<Self::RT as JSRuntime>::Value>;
@@ -25,10 +23,7 @@ pub trait JSArray:
     where
         Self: Sized;
 
-    fn new_with_data(
-        ctx: <Self::RT as JSRuntime>::Context,
-        data: &[<Self::RT as JSRuntime>::Value],
-    ) -> Result<Self>
+    fn new_with_data(ctx: <Self::RT as JSRuntime>::Context, data: &[<Self::RT as JSRuntime>::Value]) -> Result<Self>
     where
         Self: Sized;
 
diff --git a/crates/gosub_webexecutor/src/js/function.rs b/crates/gosub_webexecutor/src/js/function.rs
index 5dc9b8894..2805778ad 100644
--- a/crates/gosub_webexecutor/src/js/function.rs
+++ b/crates/gosub_webexecutor/src/js/function.rs
@@ -16,10 +16,7 @@ pub trait JSFunction {
     where
         Self: Sized;
 
-    fn call(
-        &mut self,
-        args: &[<Self::RT as JSRuntime>::Value],
-    ) -> Result<<Self::RT as JSRuntime>::Value>;
+    fn call(&mut self, args: &[<Self::RT as JSRuntime>::Value]) -> Result<<Self::RT as JSRuntime>::Value>;
 }
 
 pub trait JSFunctionCallBack {
@@ -43,11 +40,7 @@ pub trait JSFunctionCallBack {
 pub trait Args: Iterator {
     type RT: JSRuntime<Args = Self>;
 
-    fn get(
-        &self,
-        index: usize,
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> Option<<Self::RT as JSRuntime>::Value>;
+    fn get(&self, index: usize, ctx: <Self::RT as JSRuntime>::Context) -> Option<<Self::RT as JSRuntime>::Value>;
 
     fn len(&self) -> usize;
 
@@ -68,10 +61,7 @@ pub trait JSFunctionVariadic {
     where
         Self: Sized;
 
-    fn call(
-        &mut self,
-        args: &[<Self::RT as JSRuntime>::Value],
-    ) -> Result<<Self::RT as JSRuntime>::Value>;
+    fn call(&mut self, args: &[<Self::RT as JSRuntime>::Value]) -> Result<<Self::RT as JSRuntime>::Value>;
 }
 
 pub trait JSFunctionCallBackVariadic {
@@ -95,11 +85,7 @@ pub trait JSFunctionCallBackVariadic {
 pub trait VariadicArgsInternal: Iterator {
     type RT: JSRuntime<VariadicArgsInternal = Self>;
 
-    fn get(
-        &self,
-        index: usize,
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> Option<<Self::RT as JSRuntime>::Value>;
+    fn get(&self, index: usize, ctx: <Self::RT as JSRuntime>::Context) -> Option<<Self::RT as JSRuntime>::Value>;
 
     fn len(&self) -> usize;
 
@@ -109,10 +95,7 @@ pub trait VariadicArgsInternal: Iterator {
 
     fn as_vec(&self, ctx: <Self::RT as JSRuntime>::Context) -> Vec<<Self::RT as JSRuntime>::Value>;
 
-    fn variadic(
-        &self,
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> <Self::RT as JSRuntime>::VariadicArgs;
+    fn variadic(&self, ctx: <Self::RT as JSRuntime>::Context) -> <Self::RT as JSRuntime>::VariadicArgs;
 
     fn variadic_start(
         &self,
diff --git a/crates/gosub_webexecutor/src/js/object.rs b/crates/gosub_webexecutor/src/js/object.rs
index 8c9813877..9c6e540cc 100644
--- a/crates/gosub_webexecutor/src/js/object.rs
+++ b/crates/gosub_webexecutor/src/js/object.rs
@@ -19,11 +19,7 @@ pub trait JSObject: Into<<Self::RT as JSRuntime>::Value> {
 
     fn set_method(&self, name: &str, func: &<Self::RT as JSRuntime>::Function) -> Result<()>;
 
-    fn set_method_variadic(
-        &self,
-        name: &str,
-        func: &<Self::RT as JSRuntime>::FunctionVariadic,
-    ) -> Result<()>;
+    fn set_method_variadic(&self, name: &str, func: &<Self::RT as JSRuntime>::FunctionVariadic) -> Result<()>;
 
     #[allow(clippy::type_complexity)]
     fn set_property_accessor(
diff --git a/crates/gosub_webexecutor/src/js/runtime.rs b/crates/gosub_webexecutor/src/js/runtime.rs
index b4a8721bf..b2e32a701 100644
--- a/crates/gosub_webexecutor/src/js/runtime.rs
+++ b/crates/gosub_webexecutor/src/js/runtime.rs
@@ -1,9 +1,8 @@
 use gosub_shared::types::Result;
 
 use crate::js::{
-    Args, JSArray, JSCompiled, JSContext, JSFunction, JSFunctionCallBack,
-    JSFunctionCallBackVariadic, JSFunctionVariadic, JSGetterCallback, JSObject, JSSetterCallback,
-    JSValue, VariadicArgs, VariadicArgsInternal,
+    Args, JSArray, JSCompiled, JSContext, JSFunction, JSFunctionCallBack, JSFunctionCallBackVariadic,
+    JSFunctionVariadic, JSGetterCallback, JSObject, JSSetterCallback, JSValue, VariadicArgs, VariadicArgsInternal,
 };
 
 //trait around the main JS engine (e.g V8, SpiderMonkey, JSC, etc.)
diff --git a/crates/gosub_webexecutor/src/js/value.rs b/crates/gosub_webexecutor/src/js/value.rs
index 48bc46016..65edfb0c9 100644
--- a/crates/gosub_webexecutor/src/js/value.rs
+++ b/crates/gosub_webexecutor/src/js/value.rs
@@ -3,10 +3,7 @@ use gosub_shared::types::Result;
 use crate::js::{AsArray, IntoJSValue, JSRuntime, JSType};
 
 pub trait JSValue:
-    Sized
-    + From<<Self::RT as JSRuntime>::Object>
-    + From<<Self::RT as JSRuntime>::Array>
-    + AsArray<Runtime = Self::RT>
+    Sized + From<<Self::RT as JSRuntime>::Object> + From<<Self::RT as JSRuntime>::Array> + AsArray<Runtime = Self::RT>
 where
     Self: Sized,
 {
@@ -40,24 +37,18 @@ where
 
     fn type_of(&self) -> JSType;
 
-    fn new_object(ctx: <Self::RT as JSRuntime>::Context)
-        -> Result<<Self::RT as JSRuntime>::Object>;
+    fn new_object(ctx: <Self::RT as JSRuntime>::Context) -> Result<<Self::RT as JSRuntime>::Object>;
 
     fn new_array<T: IntoJSValue<Self, Value = Self>>(
         ctx: <Self::RT as JSRuntime>::Context,
         value: &[T],
     ) -> Result<<Self::RT as JSRuntime>::Array>;
 
-    fn new_empty_array(
-        ctx: <Self::RT as JSRuntime>::Context,
-    ) -> Result<<Self::RT as JSRuntime>::Array>;
+    fn new_empty_array(ctx: <Self::RT as JSRuntime>::Context) -> Result<<Self::RT as JSRuntime>::Array>;
 
     fn new_string(ctx: <Self::RT as JSRuntime>::Context, value: &str) -> Result<Self>;
 
-    fn new_number<N: Into<f64>>(
-        context: <Self::RT as JSRuntime>::Context,
-        value: N,
-    ) -> Result<Self>;
+    fn new_number<N: Into<f64>>(context: <Self::RT as JSRuntime>::Context, value: N) -> Result<Self>;
 
     fn new_bool(ctx: <Self::RT as JSRuntime>::Context, value: bool) -> Result<Self>;
 
diff --git a/crates/gosub_webexecutor/tests/interop.rs b/crates/gosub_webexecutor/tests/interop.rs
index bbaaaa10e..b77d3323f 100644
--- a/crates/gosub_webexecutor/tests/interop.rs
+++ b/crates/gosub_webexecutor/tests/interop.rs
@@ -4,9 +4,9 @@ use std::rc::Rc;
 use gosub_shared::types::Result;
 use gosub_v8::V8Engine;
 use gosub_webexecutor::js::{
-    Args, IntoJSValue, IntoRustValue, JSContext, JSFunction, JSFunctionCallBack,
-    JSFunctionCallBackVariadic, JSFunctionVariadic, JSGetterCallback, JSInterop, JSObject,
-    JSRuntime, JSSetterCallback, JSValue, VariadicArgs, VariadicArgsInternal,
+    Args, IntoJSValue, IntoRustValue, JSContext, JSFunction, JSFunctionCallBack, JSFunctionCallBackVariadic,
+    JSFunctionVariadic, JSGetterCallback, JSInterop, JSObject, JSRuntime, JSSetterCallback, JSValue, VariadicArgs,
+    VariadicArgsInternal,
 };
 use gosub_webinterop::{web_fns, web_interop};
 
@@ -99,10 +99,7 @@ impl T1 for String {}
 
 #[test]
 fn macro_interop() {
-    let test_struct = TestStruct {
-        field: 14,
-        field2: 14,
-    };
+    let test_struct = TestStruct { field: 14, field2: 14 };
 
     let mut engine = V8Engine::new();
     let mut context = engine.new_context().unwrap();
@@ -132,7 +129,9 @@ fn macro_interop() {
         calls.push([TestStruct.generic2(1, 2), TestStruct.field, TestStruct.field2])
         
         calls
-        "#).expect("failed to run");
+        "#,
+        )
+        .expect("failed to run");
 
     let mut expected = vec![
         "17,14,14",
@@ -154,9 +153,7 @@ fn macro_interop() {
         ",17,14",
     ];
 
-    let arr = out
-        .as_array()
-        .expect("failed to get array from run ret value");
+    let arr = out.as_array().expect("failed to get array from run ret value");
 
     for v in arr {
         assert_eq!(v.as_string().unwrap(), expected.remove(0));
@@ -343,11 +340,7 @@ impl JSInterop for Test2 {
                 };
 
                 #[allow(clippy::unit_arg)]
-                let ret = s
-                    .borrow_mut()
-                    .add(arg0 as i32)
-                    .to_js_value(ctx.clone())
-                    .unwrap();
+                let ret = s.borrow_mut().add(arg0 as i32).to_js_value(ctx.clone()).unwrap();
 
                 cb.ret(ret);
             })?
@@ -403,11 +396,7 @@ impl JSInterop for Test2 {
                     return;
                 };
 
-                let ret = s
-                    .borrow()
-                    .takes_ref(&arg0)
-                    .to_js_value(ctx.clone())
-                    .unwrap();
+                let ret = s.borrow().takes_ref(&arg0).to_js_value(ctx.clone()).unwrap();
 
                 cb.ret(ret);
             })?
@@ -464,11 +453,7 @@ impl JSInterop for Test2 {
                             return;
                         };
 
-                        let ret = s
-                            .borrow()
-                            .generic(arg0, arg1)
-                            .to_js_value(ctx.clone())
-                            .unwrap();
+                        let ret = s.borrow().generic(arg0, arg1).to_js_value(ctx.clone()).unwrap();
 
                         cb.ret(ret);
                     }
@@ -486,11 +471,7 @@ impl JSInterop for Test2 {
                             return;
                         };
 
-                        let ret = s
-                            .borrow()
-                            .generic(arg0, arg1)
-                            .to_js_value(ctx.clone())
-                            .unwrap();
+                        let ret = s.borrow().generic(arg0, arg1).to_js_value(ctx.clone()).unwrap();
 
                         cb.ret(ret);
 
@@ -503,11 +484,7 @@ impl JSInterop for Test2 {
                             return;
                         };
 
-                        let ret = s
-                            .borrow()
-                            .generic(arg0, arg1)
-                            .to_js_value(ctx.clone())
-                            .unwrap();
+                        let ret = s.borrow().generic(arg0, arg1).to_js_value(ctx.clone()).unwrap();
 
                         cb.ret(ret);
                     }
diff --git a/crates/gosub_webinterop/Cargo.toml b/crates/gosub_webinterop/Cargo.toml
index c063d433f..32baee30c 100644
--- a/crates/gosub_webinterop/Cargo.toml
+++ b/crates/gosub_webinterop/Cargo.toml
@@ -2,8 +2,8 @@
 name = "gosub_webinterop"
 version = "0.1.0"
 edition = "2021"
-
-# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
+authors = ["Gosub Community <info@gosub.io>"]
+license = "MIT"
 
 [dependencies]
 syn = { version = "2.0.77", features = ["full", "extra-traits"] }
diff --git a/crates/gosub_webinterop/src/function.rs b/crates/gosub_webinterop/src/function.rs
index aad0a20e7..e4354d0f6 100644
--- a/crates/gosub_webinterop/src/function.rs
+++ b/crates/gosub_webinterop/src/function.rs
@@ -151,10 +151,7 @@ impl Function {
             .generics
             .iter()
             .filter_map(|matcher| {
-                if matcher
-                    .matcher
-                    .is_match(&arg.ty.ty.generics().unwrap(), arg.index)
-                {
+                if matcher.matcher.is_match(&arg.ty.ty.generics().unwrap(), arg.index) {
                     Some(matcher.types.clone())
                 } else {
                     None
diff --git a/crates/gosub_webinterop/src/lib.rs b/crates/gosub_webinterop/src/lib.rs
index 3d5909e26..d597c0433 100644
--- a/crates/gosub_webinterop/src/lib.rs
+++ b/crates/gosub_webinterop/src/lib.rs
@@ -37,9 +37,7 @@ pub fn web_interop(_: TokenStream, item: TokenStream) -> TokenStream {
     for field in &mut input.fields {
         if let Some(property) = FieldProperty::parse(&mut field.attrs) {
             let f = Field {
-                name: property
-                    .rename
-                    .unwrap_or(field.ident.as_ref().unwrap().to_string()),
+                name: property.rename.unwrap_or(field.ident.as_ref().unwrap().to_string()),
                 executor: property.executor,
                 ty: field.ty.clone(),
                 ident: field.ident.as_ref().unwrap().clone(),
@@ -82,8 +80,7 @@ pub fn web_fns(attr: TokenStream, item: TokenStream) -> TokenStream {
                 name,
                 arguments: Vec::with_capacity(args.len()), // we don't know if the first is self, so no args.len() - 1
                 self_type: SelfType::NoSelf,
-                return_type: ReturnType::parse(&method.sig.output)
-                    .expect("failed to parse return type"),
+                return_type: ReturnType::parse(&method.sig.output).expect("failed to parse return type"),
                 executor: property.executor,
                 generics: GenericsMatcher::get_matchers(property.generics, method),
                 func_generics: method.sig.generics.clone(),
@@ -105,8 +102,7 @@ pub fn web_fns(attr: TokenStream, item: TokenStream) -> TokenStream {
             let mut index = 0;
             for arg in args {
                 if let FnArg::Typed(arg) = arg {
-                    let arg =
-                        Arg::parse(&arg.ty, index, &func.generics).expect("failed to parse arg");
+                    let arg = Arg::parse(&arg.ty, index, &func.generics).expect("failed to parse arg");
                     if arg.variant == ArgVariant::Variadic {
                         func.variadic = true;
                     } else if arg.variant == ArgVariant::Context {
@@ -148,10 +144,7 @@ pub fn web_fns(attr: TokenStream, item: TokenStream) -> TokenStream {
         }
     }
 
-    let name = Ident::new(
-        &input.self_ty.to_token_stream().to_string(),
-        input.self_ty.span(),
-    );
+    let name = Ident::new(&input.self_ty.to_token_stream().to_string(), input.self_ty.span());
 
     let options = parse_attrs(attr);
 
diff --git a/crates/gosub_webinterop/src/property.rs b/crates/gosub_webinterop/src/property.rs
index e865ffd51..7d48202a5 100644
--- a/crates/gosub_webinterop/src/property.rs
+++ b/crates/gosub_webinterop/src/property.rs
@@ -81,10 +81,7 @@ impl FieldProperty {
                                     }
                                     property.as_mut().unwrap().executor = Executor::None;
                                 }
-                                _ => Err(syn::Error::new_spanned(
-                                    attr,
-                                    "Unknown attribute in property attribute",
-                                ))?,
+                                _ => Err(syn::Error::new_spanned(attr, "Unknown attribute in property attribute"))?,
                             }
 
                             Ok(())
diff --git a/crates/gosub_webinterop/src/types/args.rs b/crates/gosub_webinterop/src/types/args.rs
index 8ffe829e6..a1a856d3d 100644
--- a/crates/gosub_webinterop/src/types/args.rs
+++ b/crates/gosub_webinterop/src/types/args.rs
@@ -21,9 +21,7 @@ impl Arg {
 
         let conv = handle_slice_conv(&self.ty, &arg_name);
 
-        let mutability = &self
-            .ty
-            .mutability(conv.to_string() == TokenStream::new().to_string());
+        let mutability = &self.ty.mutability(conv.to_string() == TokenStream::new().to_string());
 
         let get_args = if index == 0 {
             quote! {
@@ -94,11 +92,7 @@ pub(crate) enum ArgVariant {
 }
 
 impl Arg {
-    pub(crate) fn parse(
-        arg: &syn::Type,
-        index: usize,
-        generics: &[Generics],
-    ) -> Result<Arg, &'static str> {
+    pub(crate) fn parse(arg: &syn::Type, index: usize, generics: &[Generics]) -> Result<Arg, &'static str> {
         let ty = Type::parse(arg, true)?;
         let mut variant = ArgVariant::Normal;
 
@@ -110,10 +104,10 @@ impl Arg {
                     } else if s.ident == "VariadicArgs" {
                         variant = ArgVariant::Variadic;
                     }
-                    if generics.iter().any(|gen| {
-                        gen.matcher
-                            .is_match(&p.to_token_stream().to_string(), index)
-                    }) {
+                    if generics
+                        .iter()
+                        .any(|gen| gen.matcher.is_match(&p.to_token_stream().to_string(), index))
+                    {
                         variant = ArgVariant::Generic;
                     }
                 }
@@ -160,9 +154,7 @@ impl ReturnType {
     }
 }
 
-pub(crate) fn parse_impl(
-    bounds: &Punctuated<TypeParamBound, Token![+]>,
-) -> Result<Vec<Path>, &'static str> {
+pub(crate) fn parse_impl(bounds: &Punctuated<TypeParamBound, Token![+]>) -> Result<Vec<Path>, &'static str> {
     let mut out = Vec::with_capacity(bounds.len());
 
     for bound in bounds {
diff --git a/crates/gosub_webinterop/src/types/generics.rs b/crates/gosub_webinterop/src/types/generics.rs
index ad1a5fcb1..2f6756a4b 100644
--- a/crates/gosub_webinterop/src/types/generics.rs
+++ b/crates/gosub_webinterop/src/types/generics.rs
@@ -52,10 +52,7 @@ impl GenericsMatcher {
         GenericsMatcher::Trait(generic)
     }
 
-    pub(crate) fn get_matchers(
-        generics: Vec<GenericProperty>,
-        func: &syn::ImplItemFn,
-    ) -> Vec<Generics> {
+    pub(crate) fn get_matchers(generics: Vec<GenericProperty>, func: &syn::ImplItemFn) -> Vec<Generics> {
         let mut gen = Vec::new();
 
         for generic in generics {
diff --git a/crates/gosub_webinterop/src/types/primitive.rs b/crates/gosub_webinterop/src/types/primitive.rs
index 1b928b2d5..a3200cdb0 100644
--- a/crates/gosub_webinterop/src/types/primitive.rs
+++ b/crates/gosub_webinterop/src/types/primitive.rs
@@ -14,8 +14,8 @@ impl Primitive {
     pub(crate) fn get(ty: &str) -> Self {
         let ty = ty.replace('&', "");
         match &*ty {
-            "i8" | "u8" | "i16" | "u16" | "i32" | "u32" | "i64" | "u64" | "i128" | "u128"
-            | "isize" | "usize" | "f32" | "f64" => Primitive::Number,
+            "i8" | "u8" | "i16" | "u16" | "i32" | "u32" | "i64" | "u64" | "i128" | "u128" | "isize" | "usize"
+            | "f32" | "f64" => Primitive::Number,
             "String" | "&str" => Primitive::String,
             "bool" => Primitive::Boolean,
             "()" => Primitive::UndefinedNull,
diff --git a/crates/gosub_webinterop/src/types/ty.rs b/crates/gosub_webinterop/src/types/ty.rs
index f6a6d6672..b1e4b8e70 100644
--- a/crates/gosub_webinterop/src/types/ty.rs
+++ b/crates/gosub_webinterop/src/types/ty.rs
@@ -45,10 +45,7 @@ impl Type {
             }
             syn::Type::Array(a) => Ok(Type {
                 reference: Reference::None,
-                ty: TypeT::Array(
-                    Box::new(Self::parse(&a.elem, allow_ref)?),
-                    Some(a.len.clone()),
-                ),
+                ty: TypeT::Array(Box::new(Self::parse(&a.elem, allow_ref)?), Some(a.len.clone())),
             }),
             syn::Type::Slice(s) => Ok(Type {
                 reference: Reference::None,
diff --git a/examples/html5-parser.rs b/examples/html5-parser.rs
index 6ae07518a..af826442d 100644
--- a/examples/html5-parser.rs
+++ b/examples/html5-parser.rs
@@ -1,6 +1,10 @@
-use gosub_html5::parser::document::{Document, DocumentBuilder};
+use gosub_css3::system::Css3System;
+use gosub_html5::document::builder::DocumentBuilderImpl;
+use gosub_html5::document::document_impl::DocumentImpl;
 use gosub_html5::parser::Html5Parser;
 use gosub_shared::byte_stream::{ByteStream, Encoding};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::traits::document::DocumentBuilder;
 
 fn main() {
     // Creates an input stream
@@ -9,9 +13,10 @@ fn main() {
     stream.close();
 
     // Initialize a document and feed it together with the stream to the html5 parser
-    let document = DocumentBuilder::new_document(None);
-    let _ = Html5Parser::parse_document(&mut stream, Document::clone(&document), None);
+    let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+
+    let _ = Html5Parser::parse_document(&mut stream, doc_handle.clone(), None);
 
     // document now contains the html5 node tree
-    println!("Generated tree: \n\n {}", document);
+    println!("Generated tree: \n\n {}", doc_handle.get());
 }
diff --git a/rustfmt.toml b/rustfmt.toml
new file mode 100644
index 000000000..866c75610
--- /dev/null
+++ b/rustfmt.toml
@@ -0,0 +1 @@
+max_width = 120
\ No newline at end of file
diff --git a/src/bin/config-store.rs b/src/bin/config-store.rs
index e896f3c28..b97a17591 100644
--- a/src/bin/config-store.rs
+++ b/src/bin/config-store.rs
@@ -61,12 +61,7 @@ impl std::str::FromStr for Engine {
 struct GlobalOpts {
     #[clap(short = 'e', long = "engine", global = true, default_value = "sqlite")]
     engine: Engine,
-    #[clap(
-        short = 'p',
-        long = "path",
-        global = true,
-        default_value = "settings.db"
-    )]
+    #[clap(short = 'p', long = "path", global = true, default_value = "settings.db")]
     path: String,
 }
 
diff --git a/src/bin/css3-parser.rs b/src/bin/css3-parser.rs
index bfc2e5847..68a03ba21 100644
--- a/src/bin/css3-parser.rs
+++ b/src/bin/css3-parser.rs
@@ -1,8 +1,10 @@
 use anyhow::{anyhow, bail, Result};
-use gosub_css3::parser_config::ParserConfig;
 use gosub_css3::tokenizer::{TokenType, Tokenizer};
-use gosub_css3::{walker, Css3, Error};
+use gosub_css3::Css3;
 use gosub_shared::byte_stream::{ByteStream, Encoding, Location};
+use gosub_shared::errors::CssError;
+use gosub_shared::traits::css3::CssOrigin;
+use gosub_shared::traits::ParserConfig;
 use simple_logger::SimpleLogger;
 use std::fs;
 use std::time::Instant;
@@ -23,12 +25,6 @@ fn main() -> Result<()> {
                 .long("debug")
                 .action(clap::ArgAction::SetTrue),
         )
-        .arg(
-            clap::Arg::new("tokens")
-                .help("Just print the tokens")
-                .long("tokens")
-                .action(clap::ArgAction::SetTrue),
-        )
         .arg(
             clap::Arg::new("ignore-errors")
                 .help("Ignore errors")
@@ -36,28 +32,30 @@ fn main() -> Result<()> {
                 .action(clap::ArgAction::SetTrue),
         )
         .arg(
-            clap::Arg::new("quiet")
-                .help("Don't display AST")
-                .long("quiet")
-                .short('q')
+            clap::Arg::new("match-values")
+                .help("Check if values given for each property matches its property syntax")
+                .long("match-values")
+                .action(clap::ArgAction::SetTrue),
+        )
+        .arg(
+            clap::Arg::new("tokenizer")
+                .help("Just print the tokens generated by the tokenizer")
+                .long("tokenizer")
                 .action(clap::ArgAction::SetTrue),
         )
         .get_matches();
 
     let debug = matches.get_flag("debug");
-    let quiet = matches.get_flag("quiet");
     let ignore_errors = matches.get_flag("ignore-errors");
-    let tokens = matches.get_flag("tokens");
+    let match_values = matches.get_flag("match-values");
     let url: String = matches.get_one::<String>("url").expect("url").to_string();
+    let display_tokenizer = matches.get_flag("tokenizer");
 
     let css = if url.starts_with("http://") || url.starts_with("https://") {
         // Fetch the html from the url
         let response = ureq::get(&url).call()?;
         if response.status() != 200 {
-            bail!(format!(
-                "Could not get url. Status code {}",
-                response.status()
-            ));
+            bail!(format!("Could not get url. Status code {}", response.status()));
         }
         response.into_string()?
     } else if url.starts_with("file://") {
@@ -67,23 +65,24 @@ fn main() -> Result<()> {
         bail!("Unsupported url scheme: {}", url);
     };
 
-    if tokens {
-        print_tokens(css);
-        return Ok(());
+    if debug {
+        SimpleLogger::new().init().unwrap();
     }
 
     let config = ParserConfig {
-        source: Some("stylesheet.css".into()),
+        source: Some(url.clone()),
         ignore_errors,
+        match_values,
         ..Default::default()
     };
 
-    if debug {
-        SimpleLogger::new().init().unwrap();
+    if display_tokenizer {
+        print_tokens(&css);
+        return Ok(());
     }
 
     let now = Instant::now();
-    let result = Css3::parse(css.as_str(), config);
+    let result = Css3::parse_str(&css, config, CssOrigin::User, url.as_str());
     let elapsed_time = now.elapsed();
     println!(
         "Running css3 parser of ({}) took {} ms.",
@@ -92,24 +91,34 @@ fn main() -> Result<()> {
     );
 
     if result.is_err() {
+        // Err is a anyhow::Error, which wraps a Css3::Error
         let err = result.err().unwrap();
-        let message = err.message.clone();
+        let message = err.to_string();
         display_snippet(&css, err);
 
         return Err(anyhow!(message));
     }
 
-    if !quiet {
-        let binding = result.unwrap();
-        let walker = walker::Walker::new(&binding);
-        walker.walk_stdout();
+    let tree = result.unwrap();
+
+    println!("\n------- Log messages -------");
+    for log in tree.parse_log.iter() {
+        println!("{}", log);
     }
 
     Ok(())
 }
 
-fn display_snippet(css: &str, err: Error) {
-    let loc = err.location.clone();
+/// Print snippet where the error occurred
+fn display_snippet(css: &str, err: CssError) {
+    let loc = match err.location {
+        Some(l) => l,
+        None => {
+            println!("Error: {}", err.message);
+            return;
+        }
+    };
+
     let lines: Vec<&str> = css.split('\n').collect();
     let line_nr = loc.line - 1;
     let col_nr = if loc.column < 2 { 0 } else { loc.column - 2 };
@@ -144,9 +153,10 @@ fn display_snippet(css: &str, err: Error) {
     println!();
 }
 
-fn print_tokens(css: String) {
+/// Print tokens generated by the tokenizer
+fn print_tokens(css: &str) {
     let mut stream = ByteStream::new(Encoding::UTF8, None);
-    stream.read_from_str(&css, Some(Encoding::UTF8));
+    stream.read_from_str(css, Some(Encoding::UTF8));
     stream.close();
 
     let mut tokenizer = Tokenizer::new(&mut stream, Location::default());
@@ -160,16 +170,12 @@ fn print_tokens(css: String) {
     }
 }
 
-/// Returns a human-readable byte size
+/// Returns a human-readable byte size (1024-based)
 fn byte_size(bytes: u64) -> String {
     let sizes = ["B", "KB", "MB", "GB", "TB"];
     if bytes == 0 {
         return "0 B".to_string();
     }
-    let i = (bytes as f64).log2().floor() as i32 / 10;
-    format!(
-        "{:.2} {}",
-        bytes as f64 / 2_f64.powi(i * 10),
-        sizes[i as usize]
-    )
+    let i = (bytes as f64).log(1024.0).floor() as usize;
+    format!("{:.2} {}", bytes as f64 / 1024_f64.powi(i as i32), sizes[i])
 }
diff --git a/src/bin/display-text-tree.rs b/src/bin/display-text-tree.rs
index 4fdf13ac2..dbfc81670 100644
--- a/src/bin/display-text-tree.rs
+++ b/src/bin/display-text-tree.rs
@@ -1,10 +1,17 @@
-use gosub_html5::node::{Node, NodeData};
-use gosub_html5::parser::document::DocumentBuilder;
-use gosub_html5::parser::{document::Document, Html5Parser};
+use gosub_css3::system::Css3System;
+use gosub_html5::document::builder::DocumentBuilderImpl;
+use gosub_html5::parser::Html5Parser;
 use gosub_shared::byte_stream::{ByteStream, Encoding};
 use gosub_shared::types::Result;
 use std::process::exit;
 
+use gosub_html5::document::document_impl::DocumentImpl;
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::node::NodeId;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::{Document, DocumentBuilder};
+use gosub_shared::traits::node::Node;
+
 fn main() -> Result<()> {
     let url = std::env::args()
         .nth(1)
@@ -26,27 +33,34 @@ fn main() -> Result<()> {
     stream.read_from_str(&html, Some(Encoding::UTF8));
     stream.close();
 
-    let document = DocumentBuilder::new_document(None);
-    let parse_errors = Html5Parser::parse_document(&mut stream, Document::clone(&document), None)?;
+    let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(None);
+    let parse_errors =
+        Html5Parser::<DocumentImpl<Css3System>, Css3System>::parse_document(&mut stream, doc_handle.clone(), None)?;
 
     for e in parse_errors {
         println!("Parse Error: {}", e.message);
     }
 
-    display_node(&document.get(), document.get().get_root());
+    display_node::<DocumentImpl<Css3System>, Css3System>(doc_handle.clone(), doc_handle.get().get_root().id());
 
     Ok(())
 }
 
-fn display_node(document: &Document, node: &Node) {
-    if let NodeData::Text(text) = &node.data {
-        if !text.value().eq("\n") {
-            println!("{}", text.value());
+fn display_node<D: Document<C>, C: CssSystem>(
+    doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System>,
+    node_id: NodeId,
+) {
+    let binding = doc_handle.get();
+    let node = binding.node_by_id(node_id).unwrap();
+    if node.is_text_node() {
+        if let Some(data) = node.get_text_data() {
+            if !data.value.eq("\n") {
+                println!("{}", data.value);
+            }
         }
     }
-    for child_id in &node.children {
-        if let Some(child) = document.get_node_by_id(*child_id) {
-            display_node(document, child);
-        }
+
+    for &child_id in &node.children().to_vec() {
+        display_node::<D, C>(doc_handle.clone(), child_id);
     }
 }
diff --git a/src/bin/gosub-parser.rs b/src/bin/gosub-parser.rs
index ad32d47e4..d895fc172 100644
--- a/src/bin/gosub-parser.rs
+++ b/src/bin/gosub-parser.rs
@@ -1,9 +1,13 @@
 use anyhow::bail;
-use gosub_html5::parser::document::{Document, DocumentBuilder};
+use gosub_css3::system::Css3System;
+use gosub_html5::document::builder::DocumentBuilderImpl;
+use gosub_html5::document::document_impl::DocumentImpl;
 use gosub_html5::parser::Html5Parser;
 use gosub_shared::byte_stream::{ByteStream, Encoding};
+use gosub_shared::document::DocumentHandle;
 use gosub_shared::timing::Scale;
 use gosub_shared::timing_display;
+use gosub_shared::traits::document::DocumentBuilder;
 use gosub_shared::types::Result;
 use std::fs;
 use std::process::exit;
@@ -57,12 +61,13 @@ fn main() -> Result<()> {
     // SimpleLogger::new().init().unwrap();
 
     // Create a new document that will be filled in by the parser
-    let handle = DocumentBuilder::new_document(Some(url));
-    let parse_errors = Html5Parser::parse_document(&mut stream, Document::clone(&handle), None)?;
+    let doc_handle: DocumentHandle<DocumentImpl<Css3System>, Css3System> = DocumentBuilderImpl::new_document(Some(url));
+    let parse_errors =
+        Html5Parser::<DocumentImpl<Css3System>, Css3System>::parse_document(&mut stream, doc_handle.clone(), None)?;
 
-    println!("Found {} stylesheets", handle.get().stylesheets.len());
-    for sheet in &handle.get().stylesheets {
-        println!("Stylesheet location: {:?}", sheet.location);
+    println!("Found {} stylesheets", doc_handle.get().stylesheets.len());
+    for sheet in &doc_handle.get().stylesheets {
+        println!("Stylesheet url: {:?}", sheet.url);
     }
 
     // let mut handle_mut = handle.get_mut();
diff --git a/src/bin/html5-parser-test.rs b/src/bin/html5-parser-test.rs
index 6c59d9d32..de38697e2 100755
--- a/src/bin/html5-parser-test.rs
+++ b/src/bin/html5-parser-test.rs
@@ -1,7 +1,8 @@
+use gosub_css3::system::Css3System;
+use gosub_html5::document::document_impl::DocumentImpl;
+use gosub_html5::parser::Html5Parser;
 use gosub_shared::types::Result;
-use gosub_testing::testing::tree_construction::fixture::{
-    fixture_root_path, read_fixture_from_path,
-};
+use gosub_testing::testing::tree_construction::fixture::{fixture_root_path, read_fixture_from_path};
 use gosub_testing::testing::tree_construction::Harness;
 use std::io::Write;
 use std::path::{Path, PathBuf};
@@ -29,7 +30,10 @@ fn main() -> Result<()> {
         for test in &fixture.tests {
             for &scripting_enabled in test.script_modes() {
                 let result = harness
-                    .run_test(test.clone(), scripting_enabled)
+                    .run_test::<Html5Parser<DocumentImpl<Css3System>, Css3System>, Css3System>(
+                        test.clone(),
+                        scripting_enabled,
+                    )
                     .expect("problem parsing");
 
                 total += 1;
@@ -60,11 +64,7 @@ fn main() -> Result<()> {
 fn get_files_from_path(dir: PathBuf) -> Vec<String> {
     let mut files = Vec::new();
 
-    for entry in WalkDir::new(dir.clone())
-        .follow_links(true)
-        .into_iter()
-        .flatten()
-    {
+    for entry in WalkDir::new(dir.clone()).follow_links(true).into_iter().flatten() {
         if entry.file_type().is_file() {
             if let Some(extension) = entry.path().extension() {
                 if extension == "dat" {
diff --git a/src/bin/parser-test.rs b/src/bin/parser-test.rs
index d13c36634..49b7789fb 100755
--- a/src/bin/parser-test.rs
+++ b/src/bin/parser-test.rs
@@ -1,3 +1,6 @@
+use gosub_css3::system::Css3System;
+use gosub_html5::document::document_impl::DocumentImpl;
+use gosub_html5::parser::Html5Parser;
 use gosub_testing::testing::tree_construction::fixture::read_fixtures;
 use gosub_testing::testing::tree_construction::result::ResultStatus;
 use gosub_testing::testing::tree_construction::Harness;
@@ -44,11 +47,7 @@ fn main() {
         println!(
             "\
     🏁 Tests completed: Ran {} tests, {} assertions, {} succeeded, {} failed ({} position failures)\n",
-            results.tests,
-            results.assertions,
-            results.succeeded,
-            results.failed,
-            results.failed_position
+            results.tests, results.assertions, results.succeeded, results.failed, results.failed_position
         );
     }
 
@@ -63,16 +62,13 @@ fn main() {
 
 fn run_test(test_idx: usize, test: Test, all_results: &mut TotalTestResults) {
     #[cfg(all(feature = "debug_parser_verbose", test))]
-    println!(
-        "🧪 Running test #{test_idx}: {}:{}",
-        test.file_path, test.line
-    );
+    println!("🧪 Running test #{test_idx}: {}:{}", test.file_path, test.line);
 
     all_results.tests += 1;
 
     let mut harness = Harness::new();
     let result = harness
-        .run_test(test.clone(), false)
+        .run_test::<Html5Parser<DocumentImpl<Css3System>, Css3System>, Css3System>(test.clone(), false)
         .expect("problem parsing");
 
     // #[cfg(all(feature = "debug_parser", not(test)))]
@@ -147,10 +143,7 @@ fn run_test(test_idx: usize, test: Test, all_results: &mut TotalTestResults) {
                 #[cfg(all(feature = "debug_parser", test))]
                 println!(
                     "❌ ({}:{}) {} (wanted: {})",
-                    entry.actual.line,
-                    entry.actual.col,
-                    entry.actual.message,
-                    entry.expected.message
+                    entry.actual.line, entry.actual.col, entry.actual.message, entry.expected.message
                 );
             }
             ResultStatus::IncorrectPosition => {
diff --git a/src/bin/renderer.rs b/src/bin/renderer.rs
index 1bf023b58..02e5e8fb5 100644
--- a/src/bin/renderer.rs
+++ b/src/bin/renderer.rs
@@ -2,19 +2,28 @@ use std::sync::mpsc;
 use std::{io, thread};
 
 use clap::ArgAction;
-use url::Url;
-
+use gosub_css3::system::Css3System;
+use gosub_html5::document::document_impl::DocumentImpl;
+use gosub_html5::parser::Html5Parser;
 use gosub_renderer::render_tree::TreeDrawer;
+use gosub_rendering::render_tree::RenderTree;
 use gosub_shared::types::Result;
-use gosub_styling::render_tree::RenderTree;
 use gosub_taffy::TaffyLayouter;
 use gosub_useragent::application::{Application, CustomEvent};
 use gosub_vello::VelloBackend;
+use url::Url;
 
 type Backend = VelloBackend;
 type Layouter = TaffyLayouter;
-type Drawer = TreeDrawer<Backend, Layouter>;
-type Tree = RenderTree<Layouter>;
+
+type CssSystem = Css3System;
+
+type Document = DocumentImpl<CssSystem>;
+
+type HtmlParser<'a> = Html5Parser<'a, Document, CssSystem>;
+
+type Drawer = TreeDrawer<Backend, Layouter, Document, CssSystem>;
+type Tree = RenderTree<Layouter, Document, CssSystem>;
 
 fn main() -> Result<()> {
     let matches = clap::Command::new("Gosub Renderer")
@@ -39,7 +48,7 @@ fn main() -> Result<()> {
 
     // let mut rt = load_html_rendertree(&url)?;
     //
-    let mut application: Application<Drawer, Backend, Layouter, Tree> =
+    let mut application: Application<Drawer, Backend, Layouter, Tree, Document, CssSystem, HtmlParser> =
         Application::new(VelloBackend::new(), TaffyLayouter, debug);
 
     application.initial_tab(Url::parse(&url)?);
diff --git a/src/engine.rs b/src/engine.rs
index 917c82379..eb1ae7b90 100644
--- a/src/engine.rs
+++ b/src/engine.rs
@@ -1,10 +1,13 @@
 use gosub_shared::byte_stream::{ByteStream, Encoding};
+use gosub_shared::document::DocumentHandle;
+use gosub_shared::traits::css3::CssSystem;
+use gosub_shared::traits::document::{Document, DocumentBuilder};
+use gosub_shared::traits::html5::Html5Parser as Html5ParserT;
+
 #[cfg(not(target_arch = "wasm32"))]
 use {
     cookie::CookieJar,
     core::fmt::Debug,
-    gosub_html5::parser::document::{Document, DocumentBuilder, DocumentHandle},
-    gosub_html5::parser::Html5Parser,
     gosub_net::{
         dns::{Dns, ResolveType},
         http::{headers::Headers, request::Request, response::Response},
@@ -23,13 +26,13 @@ const MAX_BYTES: u64 = 10_000_000;
 
 /// Response that is returned from the fetch function
 #[cfg(not(target_arch = "wasm32"))]
-pub struct FetchResponse {
+pub struct FetchResponse<D: Document<C>, C: CssSystem> {
     /// Request that has been send
     pub request: Request,
     /// Response that has been received
     pub response: Response,
     /// Document tree that is made from the response
-    pub document: DocumentHandle,
+    pub document: DocumentHandle<D, C>,
     /// Parse errors that occurred while parsing the document tree
     pub parse_errors: Vec<ParseError>,
     /// Rendertree that is generated from the document tree and css tree
@@ -37,14 +40,14 @@ pub struct FetchResponse {
 }
 
 #[cfg(not(target_arch = "wasm32"))]
-impl Debug for FetchResponse {
+impl<D: Document<C> + Debug, C: CssSystem> Debug for FetchResponse<D, C> {
     fn fmt(&self, f: &mut core::fmt::Formatter<'_>) -> core::fmt::Result {
         writeln!(f, "Request:")?;
         writeln!(f, "{}", self.request)?;
         writeln!(f, "Response:")?;
         writeln!(f, "{}", self.response)?;
         writeln!(f, "Document tree:")?;
-        writeln!(f, "{}", self.document)?;
+        writeln!(f, "{:?}", self.document)?;
         writeln!(f, "Parse errors:")?;
         for error in &self.parse_errors {
             writeln!(
@@ -62,12 +65,12 @@ impl Debug for FetchResponse {
 
 #[cfg(not(target_arch = "wasm32"))]
 #[allow(dead_code)]
-fn fetch_url(
+fn fetch_url<P: Html5ParserT<C>, C: CssSystem>(
     method: &str,
     url: &str,
     headers: Headers,
     cookies: CookieJar,
-) -> Result<FetchResponse> {
+) -> Result<FetchResponse<P::Document, C>> {
     let mut http_req = Request::new(method, url, "HTTP/1.1");
     http_req.headers = headers.clone();
     http_req.cookies = cookies.clone();
@@ -77,7 +80,7 @@ fn fetch_url(
     let mut fetch_response = FetchResponse {
         request: http_req,
         response: Response::new(),
-        document: DocumentBuilder::new_document(Some(parts.clone())),
+        document: <P::Document as Document<C>>::Builder::new_document(Some(parts.clone())),
         parse_errors: vec![],
         render_tree: String::new(),
     };
@@ -140,10 +143,9 @@ fn fetch_url(
 
     let mut stream = ByteStream::new(Encoding::UTF8, None);
     let _ = stream.read_from_bytes(&fetch_response.response.body);
-    fetch_response.document = DocumentBuilder::new_document(Some(parts));
+    fetch_response.document = <P::Document as Document<C>>::Builder::new_document(Some(parts));
 
-    match Html5Parser::parse_document(&mut stream, Document::clone(&fetch_response.document), None)
-    {
+    match P::parse(&mut stream, DocumentHandle::clone(&fetch_response.document), None) {
         Ok(parse_errors) => {
             fetch_response.parse_errors = parse_errors;
         }
@@ -160,6 +162,9 @@ fn fetch_url(
 #[cfg(test)]
 mod tests {
     use super::*;
+    use gosub_css3::system::Css3System;
+    use gosub_html5::document::document_impl::DocumentImpl;
+    use gosub_html5::parser::Html5Parser;
 
     #[cfg(not(target_arch = "wasm32"))]
     #[test]
@@ -169,7 +174,8 @@ mod tests {
         headers.set_str("User-Agent", USER_AGENT);
         let cookies = CookieJar::new();
 
-        let resp = fetch_url("GET", url, headers, cookies);
+        let resp =
+            fetch_url::<Html5Parser<DocumentImpl<Css3System>, Css3System>, Css3System>("GET", url, headers, cookies);
         assert!(resp.is_ok());
     }
 }
diff --git a/src/wasm/css.rs b/src/wasm/css.rs
index 3cda2158a..68de0ac53 100644
--- a/src/wasm/css.rs
+++ b/src/wasm/css.rs
@@ -15,10 +15,7 @@ pub struct CssOptions {
 impl CssOptions {
     #[wasm_bindgen(constructor)]
     pub fn new(tokens: bool, ignore_errors: bool) -> Self {
-        Self {
-            tokens,
-            ignore_errors,
-        }
+        Self { tokens, ignore_errors }
     }
 }
 
@@ -64,10 +61,7 @@ pub fn css3_parser(input: &str, opts: CssOptions) -> CssOutput {
         }
         Err(err) => {
             let snippet = display_snippet(&input, err);
-            CssOutput {
-                tokens,
-                out: snippet,
-            }
+            CssOutput { tokens, out: snippet }
         }
     }
 }
diff --git a/src/wasm/renderer.rs b/src/wasm/renderer.rs
index 01ab9d78e..e7ecac9ff 100644
--- a/src/wasm/renderer.rs
+++ b/src/wasm/renderer.rs
@@ -2,13 +2,13 @@ use js_sys::Promise;
 use url::Url;
 use wasm_bindgen::prelude::*;
 
+use gobub_css3::render_tree::generate_render_tree;
+use gobub_css3::render_tree::RenderTree as StyleTree;
 use gosub_html5::parser::document::{Document, DocumentBuilder};
 use gosub_html5::parser::Html5Parser;
 use gosub_renderer::render_tree::TreeDrawer;
 use gosub_renderer::renderer::{Renderer, RendererOptions as GRendererOptions};
 use gosub_shared::types::Result;
-use gosub_styling::render_tree::generate_render_tree;
-use gosub_styling::render_tree::RenderTree as StyleTree;
 use gosub_taffy::layout::generate_taffy_tree;
 
 #[wasm_bindgen]
@@ -92,8 +92,7 @@ fn load_html_rendertree(input: &str, url: Url) -> Result<StyleTree> {
     stream.close();
 
     let doc_handle = DocumentBuilder::new_document(Some(url));
-    let _parse_errors =
-        Html5Parser::parse_document(&mut stream, Document::clone(&doc_handle), None)?;
+    let _parse_errors = Html5Parser::parse_document(&mut stream, Document::clone(&doc_handle), None)?;
 
     generate_render_tree(Document::clone(&doc_handle))
 }
diff --git a/src/wasm/styles.rs b/src/wasm/styles.rs
index 769688c59..a955ec442 100644
--- a/src/wasm/styles.rs
+++ b/src/wasm/styles.rs
@@ -1,8 +1,8 @@
 use url::Url;
 
+use gobub_css3::render_tree::generate_render_tree;
 use gosub_html5::parser::document::{Document, DocumentBuilder};
 use gosub_html5::parser::Html5Parser;
-use gosub_styling::render_tree::generate_render_tree;
 use wasm_bindgen::prelude::wasm_bindgen;
 
 #[wasm_bindgen]
diff --git a/tests/example1.js b/tests/example1.js
index 5c0d671b7..8a1fb7f73 100644
--- a/tests/example1.js
+++ b/tests/example1.js
@@ -1,3 +1,3 @@
-var a = 1 + 3
+let a = 1 + 3
 
 a
\ No newline at end of file

From 8338cc96d8999761be4c68f8446916b357c85b99 Mon Sep 17 00:00:00 2001
From: Shark <sharktheone@proton.me>
Date: Sun, 29 Sep 2024 19:59:26 +0200
Subject: [PATCH 2/2] load useragent stylesheet again

---
 crates/gosub_css3/src/system.rs              | 6 +++++-
 crates/gosub_render_utils/src/render_tree.rs | 4 +++-
 crates/gosub_renderer/src/render_tree.rs     | 6 +++---
 crates/gosub_shared/src/traits/css3.rs       | 2 ++
 4 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/crates/gosub_css3/src/system.rs b/crates/gosub_css3/src/system.rs
index 1c44c83c7..22b07f32f 100644
--- a/crates/gosub_css3/src/system.rs
+++ b/crates/gosub_css3/src/system.rs
@@ -5,7 +5,7 @@ use crate::matcher::property_definitions::get_css_definitions;
 use crate::matcher::shorthands::FixList;
 use crate::matcher::styling::{match_selector, CssProperties, CssProperty, DeclarationProperty};
 use crate::stylesheet::{CssDeclaration, CssValue, Specificity};
-use crate::Css3;
+use crate::{load_default_useragent_stylesheet, Css3};
 use gosub_shared::document::DocumentHandle;
 use gosub_shared::errors::CssResult;
 use gosub_shared::node::NodeId;
@@ -97,6 +97,10 @@ impl CssSystem for Css3System {
     fn inheritance<T: RenderTree<Self>>(tree: &mut T) {
         Self::resolve_inheritance(tree, tree.root(), &Vec::new());
     }
+
+    fn load_default_useragent_stylesheet() -> Self::Stylesheet {
+        load_default_useragent_stylesheet()
+    }
 }
 
 impl Css3System {
diff --git a/crates/gosub_render_utils/src/render_tree.rs b/crates/gosub_render_utils/src/render_tree.rs
index cd3d63aae..590a0827e 100644
--- a/crates/gosub_render_utils/src/render_tree.rs
+++ b/crates/gosub_render_utils/src/render_tree.rs
@@ -237,7 +237,9 @@ impl<L: Layouter, D: Document<C>, C: CssSystem> RenderTree<L, D, C> {
             else {
                 //we need to remove it  from the parent in the render tree and from the document
 
-                todo!("unrenderable node");
+                // todo!("unrenderable node");
+
+                continue;
             };
 
             let data = node.data();
diff --git a/crates/gosub_renderer/src/render_tree.rs b/crates/gosub_renderer/src/render_tree.rs
index 48e45b24f..a5866f3a2 100644
--- a/crates/gosub_renderer/src/render_tree.rs
+++ b/crates/gosub_renderer/src/render_tree.rs
@@ -87,11 +87,11 @@ pub(crate) fn load_html_rendertree<L: Layouter, P: Html5Parser<C>, C: CssSystem>
         eprintln!("Parse error: {:?}", error);
     }
 
-    _ = doc_handle.get_mut();
+    let mut doc = doc_handle.get_mut();
 
-    // doc.add_stylesheet(C::load_default_useragent_stylesheet()?);
+    doc.add_stylesheet(C::load_default_useragent_stylesheet());
 
-    // drop(doc);
+    drop(doc);
 
     generate_render_tree(DocumentHandle::clone(&doc_handle))
 }
diff --git a/crates/gosub_shared/src/traits/css3.rs b/crates/gosub_shared/src/traits/css3.rs
index 76c8b5752..04f5f8791 100644
--- a/crates/gosub_shared/src/traits/css3.rs
+++ b/crates/gosub_shared/src/traits/css3.rs
@@ -39,6 +39,8 @@ pub trait CssSystem: Clone {
     ) -> Option<Self::PropertyMap>;
 
     fn inheritance<T: RenderTree<Self>>(tree: &mut T);
+
+    fn load_default_useragent_stylesheet() -> Self::Stylesheet;
 }
 
 pub trait CssStylesheet: PartialEq {