M6.7: Parchment theme pass

Lights up the M5 codex design system across the wizard. Default
palette swaps from dark leather to aged-parchment cream with
sealing-wax red selection emphasis, matching the React prototype's
default theme variant. CodexTheme.Build() is applied at the wizard
root so every step + Aside + popover cascades through it.

Theme additions:
- Parchment palette in CodexPalette (Dark retained as alt)
- Type variations registered for Card, CodexPopover, Pill,
  PillDetriment, AbilityToken, AbilitySlot, SkillRow — without
  SetTypeVariation, panel-stylebox lookup falls through to Godot's
  default dark slate, which is what was happening to every bare
  PanelContainer before this pass.
- panel_hover stylebox on Card (gild border) wired via CodexCard's
  MouseEntered/Exited helper; panel_selected bumped to 3px seal-red
  border + soft shadow so selection reads at a glance.

Card selection refactor:
- Replaced the warm-cream Modulate hint on cards with stylebox swaps
  via the new CodexCard.SetSelected helper. The Modulate approach
  was a no-op on cream-on-cream parchment; the stylebox swap looks
  the same on either palette.
- Step intros + Aside section headers now use the existing Eyebrow /
  H2 / H3 / CardName / CardMeta / CardBody label variations.
- Confirm button on Step VIII uses the PrimaryButton variation.

Popover + chip behaviour:
- PopoverLayer is now MouseFilter=Ignore so clicks/scroll/hover all
  pass through. Adjacent chips fire reliably even when the previous
  popover overlaps them spatially.
- Dropped the 80ms grace timer; chip MouseExited closes immediately.
- TraitChip MouseFilter Stop → Pass so clicks bubble up to the
  parent card's GuiInput (selecting the card).

Misc:
- Wizard._Ready inserts a backing Panel so the parchment Bg fills
  the canvas — Wizard root is a plain Control, which paints nothing.
- CodexTheme font lookup tries Cormorant-Medium before -Regular and
  globalizes res://Fonts/ for runtime FontFile load (the previous
  fallback used ContentPaths which points at a sibling data tree).
- StepStats final-score Label rendered at font_size 22 to match the
  AbilityToken die.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Theriapolis.Godot/Scenes/Aside.cs

@@ -75,6 +75,7 @@ public partial class Aside : MarginContainer
         {
             Text = name,
             HorizontalAlignment = HorizontalAlignment.Center,
+            ThemeTypeVariation = "H3",
         });
         _content.AddChild(new HSeparator());
     }
@@ -143,6 +144,7 @@ public partial class Aside : MarginContainer
         {
             Text = label,
             HorizontalAlignment = HorizontalAlignment.Center,
+            ThemeTypeVariation = "Eyebrow",
         });
         col.AddChild(new HSeparator());
         return col;
@@ -155,8 +157,7 @@ public partial class Aside : MarginContainer
 
         // Smaller font on the label tag — keeps the row compact in the
         // narrow side rail.
-        var lbl = new Label { Text = label.ToUpperInvariant() };
-        lbl.AddThemeFontSizeOverride("font_size", 11);
+        var lbl = new Label { Text = label.ToUpperInvariant(), ThemeTypeVariation = "Eyebrow" };
         v.AddChild(lbl);
 
         // Autowrap on the value so long names ("Hybrid Underground")
@@ -176,7 +177,7 @@ public partial class Aside : MarginContainer
 
     private void BuildAttributes()
     {
-        _content.AddChild(new Label { Text = "ATTRIBUTES" });
+        _content.AddChild(new Label { Text = "ATTRIBUTES", ThemeTypeVariation = "Eyebrow" });
 
         // Self-contained sub-panel so the attributes table never widens
         // beyond the Aside's own rect. Columns: ab | bonus | final | d20.
@@ -241,7 +242,7 @@ public partial class Aside : MarginContainer
 
     private void BuildPills()
     {
-        _content.AddChild(new Label { Text = "TRAITS · FEATS · SKILLS" });
+        _content.AddChild(new Label { Text = "TRAITS · FEATS · SKILLS", ThemeTypeVariation = "Eyebrow" });
 
         var flow = new HFlowContainer();
         flow.AddThemeConstantOverride("h_separation", 6);

Theriapolis.Godot/Scenes/Steps/StepBackground.cs

@@ -33,8 +33,8 @@ public partial class StepBackground : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO V · HISTORY" });
-        intro.AddChild(new Label { Text = "Choose a History" });
+        intro.AddChild(new Label { Text = "FOLIO V · HISTORY", ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Choose a History",  ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "Where your character came from before the wandering began. "
@@ -66,12 +66,9 @@ public partial class StepBackground : VBoxContainer, IStep
     {
         bool selected = _draft.BackgroundId == bg.Id;
 
-        var card = new PanelContainer
-        {
-            CustomMinimumSize = new Vector2(200, 0),
-            MouseFilter = MouseFilterEnum.Stop,
-        };
-        if (selected) card.Modulate = new Color(1f, 0.95f, 0.85f);
+        var card = CodexCard.Make();
+        card.CustomMinimumSize = new Vector2(200, 0);
+        CodexCard.SetSelected(card, selected);
 
         card.GuiInput += (InputEvent e) =>
         {
@@ -83,13 +80,14 @@ public partial class StepBackground : VBoxContainer, IStep
         box.AddThemeConstantOverride("separation", 6);
         card.AddChild(box);
 
-        box.AddChild(new Label { Text = bg.Name });
+        box.AddChild(new Label { Text = bg.Name, ThemeTypeVariation = "CardName" });
         if (!string.IsNullOrEmpty(bg.Flavor))
         {
             box.AddChild(new Label
             {
                 Text = bg.Flavor,
                 AutowrapMode = TextServer.AutowrapMode.WordSmart,
+                ThemeTypeVariation = "CardBody",
             });
         }
 
@@ -113,7 +111,7 @@ public partial class StepBackground : VBoxContainer, IStep
             var featRow = new HBoxContainer();
             featRow.AddThemeConstantOverride("separation", 6);
             box.AddChild(featRow);
-            featRow.AddChild(new Label { Text = "FEATURE" });
+            featRow.AddChild(new Label { Text = "FEATURE", ThemeTypeVariation = "Eyebrow" });
             featRow.AddChild(new TraitChip
             {
                 TraitName = bg.FeatureName,

Theriapolis.Godot/Scenes/Steps/StepClade.cs

@@ -21,7 +21,7 @@ namespace Theriapolis.GodotHost.Scenes.Steps;
 public partial class StepClade : VBoxContainer, IStep
 {
     private CharacterDraft _draft = null!;
-    private CheckBox _hybridToggle = null!;
+    private Button _hybridToggle = null!;
     private VBoxContainer _purebredSection = null!;
     private VBoxContainer _hybridSection = null!;
     private OptionButton _dominantToggle = null!;
@@ -61,8 +61,8 @@ public partial class StepClade : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO I · CLADE" });
-        intro.AddChild(new Label { Text = "Choose a Clade" });
+        intro.AddChild(new Label { Text = "FOLIO I · CLADE", ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Choose a Clade",  ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "The broad mammalian family of your line. Clade defines the largest "
@@ -71,10 +71,18 @@ public partial class StepClade : VBoxContainer, IStep
             AutowrapMode = TextServer.AutowrapMode.WordSmart,
         });
 
+        // Toggle Button (not CheckBox) so the inverted-on-press button style
+        // from the codex theme handles selection visually — no checkbox glyph
+        // needed, the bg colour shift is the affordance.
         var toggleRow = new HBoxContainer();
         toggleRow.AddThemeConstantOverride("separation", 12);
         AddChild(toggleRow);
-        _hybridToggle = new CheckBox { Text = "Hybrid Origin (two parent lineages)" };
+        _hybridToggle = new Button
+        {
+            Text = "Hybrid Origin (two parent lineages)",
+            ToggleMode = true,
+            FocusMode = Control.FocusModeEnum.None,
+        };
         _hybridToggle.Toggled += OnHybridToggled;
         toggleRow.AddChild(_hybridToggle);
 
@@ -91,12 +99,12 @@ public partial class StepClade : VBoxContainer, IStep
         _hybridSection.AddThemeConstantOverride("separation", 16);
         AddChild(_hybridSection);
 
-        _hybridSection.AddChild(new Label { Text = "SIRE — Paternal Lineage" });
+        _hybridSection.AddChild(new Label { Text = "SIRE — Paternal Lineage", ThemeTypeVariation = "Eyebrow" });
         var sireGrid = MakeGrid();
         _hybridSection.AddChild(sireGrid);
         PopulateGrid(sireGrid, _sireCards, id => OnLineageCladePicked("sire", id));
 
-        _hybridSection.AddChild(new Label { Text = "DAM — Maternal Lineage" });
+        _hybridSection.AddChild(new Label { Text = "DAM — Maternal Lineage", ThemeTypeVariation = "Eyebrow" });
         var damGrid = MakeGrid();
         _hybridSection.AddChild(damGrid);
         PopulateGrid(damGrid, _damCards, id => OnLineageCladePicked("dam", id));
@@ -106,7 +114,7 @@ public partial class StepClade : VBoxContainer, IStep
         _bonusSection = new VBoxContainer();
         _bonusSection.AddThemeConstantOverride("separation", 8);
         _hybridSection.AddChild(_bonusSection);
-        _bonusSection.AddChild(new Label { Text = "LINEAGE BONUSES" });
+        _bonusSection.AddChild(new Label { Text = "LINEAGE BONUSES", ThemeTypeVariation = "Eyebrow" });
 
         _sireBonusRow = new HBoxContainer();
         _sireBonusRow.AddThemeConstantOverride("separation", 8);
@@ -119,7 +127,7 @@ public partial class StepClade : VBoxContainer, IStep
         var dominantRow = new HBoxContainer();
         dominantRow.AddThemeConstantOverride("separation", 8);
         _hybridSection.AddChild(dominantRow);
-        dominantRow.AddChild(new Label { Text = "DOMINANT LINEAGE" });
+        dominantRow.AddChild(new Label { Text = "DOMINANT LINEAGE", ThemeTypeVariation = "Eyebrow" });
         _dominantToggle = new OptionButton();
         _dominantToggle.AddItem("Sire", 0);
         _dominantToggle.AddItem("Dam", 1);
@@ -253,7 +261,7 @@ public partial class StepClade : VBoxContainer, IStep
     private static void UpdateSelection(Dictionary<string, PanelContainer> cards, string selectedId)
     {
         foreach (var (id, card) in cards)
-            card.Modulate = id == selectedId ? new Color(1f, 0.95f, 0.85f) : Colors.White;
+            CodexCard.SetSelected(card, id == selectedId);
     }
 
     private void OnPurebredCladePicked(string cladeId)
@@ -318,11 +326,8 @@ public partial class StepClade : VBoxContainer, IStep
 
     private PanelContainer BuildCard(CladeDef clade, System.Action<string> onClick)
     {
-        var card = new PanelContainer
-        {
-            CustomMinimumSize = new Vector2(200, 0),
-            MouseFilter = MouseFilterEnum.Stop,
-        };
+        var card = CodexCard.Make();
+        card.CustomMinimumSize = new Vector2(200, 0);
         card.GuiInput += (InputEvent e) =>
         {
             if (e is InputEventMouseButton mb && mb.Pressed && mb.ButtonIndex == MouseButton.Left)
@@ -333,8 +338,8 @@ public partial class StepClade : VBoxContainer, IStep
         box.AddThemeConstantOverride("separation", 6);
         card.AddChild(box);
 
-        box.AddChild(new Label { Text = clade.Name });
-        box.AddChild(new Label { Text = clade.Kind.ToUpperInvariant() });
+        box.AddChild(new Label { Text = clade.Name, ThemeTypeVariation = "CardName" });
+        box.AddChild(new Label { Text = clade.Kind.ToUpperInvariant(), ThemeTypeVariation = "CardMeta" });
 
         if (clade.AbilityMods.Count > 0)
         {

Theriapolis.Godot/Scenes/Steps/StepClass.cs

@@ -37,8 +37,8 @@ public partial class StepClass : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO III · CALLING" });
-        intro.AddChild(new Label { Text = "Choose a Calling" });
+        intro.AddChild(new Label { Text = "FOLIO III · CALLING", ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Choose a Calling",   ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "Your character's path — fighter, hunter, scholar, or something stranger. "
@@ -67,12 +67,9 @@ public partial class StepClass : VBoxContainer, IStep
     {
         bool selected = _draft.ClassId == cls.Id;
 
-        var card = new PanelContainer
-        {
-            CustomMinimumSize = new Vector2(200, 0),
-            MouseFilter = MouseFilterEnum.Stop,
-        };
-        if (selected) card.Modulate = new Color(1f, 0.95f, 0.85f);
+        var card = CodexCard.Make();
+        card.CustomMinimumSize = new Vector2(200, 0);
+        CodexCard.SetSelected(card, selected);
 
         card.GuiInput += (InputEvent e) =>
         {
@@ -93,10 +90,11 @@ public partial class StepClass : VBoxContainer, IStep
         box.AddThemeConstantOverride("separation", 6);
         card.AddChild(box);
 
-        box.AddChild(new Label { Text = cls.Name });
+        box.AddChild(new Label { Text = cls.Name, ThemeTypeVariation = "CardName" });
         box.AddChild(new Label
         {
             Text = $"d{cls.HitDie}  ·  {string.Join("/", cls.PrimaryAbility)}",
+            ThemeTypeVariation = "CardMeta",
         });
 
         if (cls.Saves.Length > 0)
@@ -104,9 +102,9 @@ public partial class StepClass : VBoxContainer, IStep
             var savesRow = new HBoxContainer();
             savesRow.AddThemeConstantOverride("separation", 6);
             box.AddChild(savesRow);
-            savesRow.AddChild(new Label { Text = "SAVES" });
+            savesRow.AddChild(new Label { Text = "SAVES", ThemeTypeVariation = "Eyebrow" });
             foreach (var s in cls.Saves)
-                savesRow.AddChild(new Label { Text = s });
+                savesRow.AddChild(new Label { Text = s, ThemeTypeVariation = "CardMeta" });
         }
 
         // Level-1 features. Filter out stubs and subclass-selection markers

Theriapolis.Godot/Scenes/Steps/StepReview.cs

@@ -43,8 +43,8 @@ public partial class StepReview : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO VIII · SIGN" });
-        intro.AddChild(new Label { Text = "Sign the Codex" });
+        intro.AddChild(new Label { Text = "FOLIO VIII · SIGN", ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Sign the Codex",    ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "Review the right-rail summary, then sign your name. "
@@ -56,7 +56,7 @@ public partial class StepReview : VBoxContainer, IStep
         var nameBlock = new VBoxContainer();
         nameBlock.AddThemeConstantOverride("separation", 6);
         AddChild(nameBlock);
-        nameBlock.AddChild(new Label { Text = "NAME" });
+        nameBlock.AddChild(new Label { Text = "NAME", ThemeTypeVariation = "Eyebrow" });
         _nameField = new LineEdit
         {
             PlaceholderText = "Enter your character's name...",
@@ -82,6 +82,7 @@ public partial class StepReview : VBoxContainer, IStep
         {
             Text = "Confirm & Begin",
             CustomMinimumSize = new Vector2(220, 0),
+            ThemeTypeVariation = "PrimaryButton",
         };
         _confirmBtn.Pressed += OnConfirmPressed;
         actionBlock.AddChild(_confirmBtn);

Theriapolis.Godot/Scenes/Steps/StepSkills.cs

@@ -41,8 +41,8 @@ public partial class StepSkills : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO VII · SKILLS" });
-        intro.AddChild(new Label { Text = "Choose Your Skills" });
+        intro.AddChild(new Label { Text = "FOLIO VII · SKILLS", ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Choose Your Skills", ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "Your background grants two skills automatically (sealed). From your "
@@ -51,7 +51,7 @@ public partial class StepSkills : VBoxContainer, IStep
             AutowrapMode = TextServer.AutowrapMode.WordSmart,
         });
 
-        _countLabel = new Label { Text = "0 / 0 chosen" };
+        _countLabel = new Label { Text = "0 / 0 chosen", ThemeTypeVariation = "Meta" };
         AddChild(_countLabel);
 
         _groupsGrid = new GridContainer
@@ -96,7 +96,11 @@ public partial class StepSkills : VBoxContainer, IStep
                                        HashSet<string> chosen,
                                        int required)
     {
-        var panel = new PanelContainer { SizeFlagsHorizontal = SizeFlags.ExpandFill };
+        var panel = new PanelContainer
+        {
+            SizeFlagsHorizontal = SizeFlags.ExpandFill,
+            ThemeTypeVariation = "Card",
+        };
         var col = new VBoxContainer();
         col.AddThemeConstantOverride("separation", 4);
         panel.AddChild(col);
@@ -105,10 +109,10 @@ public partial class StepSkills : VBoxContainer, IStep
         var header = new HBoxContainer();
         header.AddThemeConstantOverride("separation", 8);
         col.AddChild(header);
-        header.AddChild(new Label { Text = SkillsCatalog.AbilityFullName[ability] });
+        header.AddChild(new Label { Text = SkillsCatalog.AbilityFullName[ability], ThemeTypeVariation = "H3" });
         var spacer = new Control { SizeFlagsHorizontal = SizeFlags.ExpandFill };
         header.AddChild(spacer);
-        header.AddChild(new Label { Text = ability });
+        header.AddChild(new Label { Text = ability, ThemeTypeVariation = "Eyebrow" });
 
         foreach (var s in SkillsCatalog.ByAbility(ability))
             col.AddChild(BuildSkillRow(s, lockedFromBg, classOptions, chosen, required));
@@ -130,6 +134,7 @@ public partial class StepSkills : VBoxContainer, IStep
         var row = new PanelContainer
         {
             MouseFilter = MouseFilterEnum.Stop,
+            ThemeTypeVariation = "SkillRow",
         };
 
         // Visual state: dim unavailable rows, gild-tint background-locked,

Theriapolis.Godot/Scenes/Steps/StepSpecies.cs

@@ -39,8 +39,8 @@ public partial class StepSpecies : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO II · SPECIES" });
-        intro.AddChild(new Label { Text = "Choose a Species" });
+        intro.AddChild(new Label { Text = "FOLIO II · SPECIES", ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Choose a Species",   ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "Refine your line. Species inherits the clade's traits and adds its "
@@ -59,11 +59,11 @@ public partial class StepSpecies : VBoxContainer, IStep
         _hybridSection.AddThemeConstantOverride("separation", 16);
         AddChild(_hybridSection);
 
-        _hybridSection.AddChild(new Label { Text = "SIRE — Paternal Lineage" });
+        _hybridSection.AddChild(new Label { Text = "SIRE — Paternal Lineage", ThemeTypeVariation = "Eyebrow" });
         _sireGrid = MakeGrid();
         _hybridSection.AddChild(_sireGrid);
 
-        _hybridSection.AddChild(new Label { Text = "DAM — Maternal Lineage" });
+        _hybridSection.AddChild(new Label { Text = "DAM — Maternal Lineage", ThemeTypeVariation = "Eyebrow" });
         _damGrid = MakeGrid();
         _hybridSection.AddChild(_damGrid);
 
@@ -109,12 +109,9 @@ public partial class StepSpecies : VBoxContainer, IStep
 
     private static Control BuildCard(SpeciesDef sp, bool selected, System.Action<string> onClick)
     {
-        var card = new PanelContainer
-        {
-            CustomMinimumSize = new Vector2(200, 0),
-            MouseFilter = MouseFilterEnum.Stop,
-        };
-        if (selected) card.Modulate = new Color(1f, 0.95f, 0.85f);
+        var card = CodexCard.Make();
+        card.CustomMinimumSize = new Vector2(200, 0);
+        CodexCard.SetSelected(card, selected);
 
         card.GuiInput += (InputEvent e) =>
         {
@@ -126,8 +123,12 @@ public partial class StepSpecies : VBoxContainer, IStep
         box.AddThemeConstantOverride("separation", 6);
         card.AddChild(box);
 
-        box.AddChild(new Label { Text = sp.Name });
-        box.AddChild(new Label { Text = $"{sp.Size.ToUpperInvariant()} · {sp.BaseSpeedFt} FT/TURN" });
+        box.AddChild(new Label { Text = sp.Name, ThemeTypeVariation = "CardName" });
+        box.AddChild(new Label
+        {
+            Text = $"{sp.Size.ToUpperInvariant()} · {sp.BaseSpeedFt} FT/TURN",
+            ThemeTypeVariation = "CardMeta",
+        });
 
         if (sp.AbilityMods.Count > 0)
         {

Theriapolis.Godot/Scenes/Steps/StepStats.cs

@@ -61,8 +61,8 @@ public partial class StepStats : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO VI · ABILITIES" });
-        intro.AddChild(new Label { Text = "Assign your Ability Scores" });
+        intro.AddChild(new Label { Text = "FOLIO VI · ABILITIES",        ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Assign your Ability Scores",  ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "Pick a method, then drag a value from the pool into one of the six "
@@ -135,14 +135,17 @@ public partial class StepStats : VBoxContainer, IStep
             _bonusChips[captured] = bonus;
             row.AddChild(bonus);
 
-            // Final score (= base + total bonus).
+            // Final score (= base + total bonus). Sized to match the
+            // AbilityToken numeric label so the 'before / after' values
+            // read at the same visual weight.
             var finalLbl = new Label
             {
                 Text = "—",
-                CustomMinimumSize = new Vector2(48, 0),
+                CustomMinimumSize = new Vector2(56, 0),
                 HorizontalAlignment = HorizontalAlignment.Right,
                 VerticalAlignment = VerticalAlignment.Center,
             };
+            finalLbl.AddThemeFontSizeOverride("font_size", 22);
             _finalLabels[captured] = finalLbl;
             row.AddChild(finalLbl);
 

Theriapolis.Godot/Scenes/Steps/StepSubclass.cs

@@ -40,8 +40,8 @@ public partial class StepSubclass : VBoxContainer, IStep
         var intro = new VBoxContainer();
         intro.AddThemeConstantOverride("separation", 6);
         AddChild(intro);
-        intro.AddChild(new Label { Text = "FOLIO IV · SUBCLASS" });
-        intro.AddChild(new Label { Text = "Choose a Subclass" });
+        intro.AddChild(new Label { Text = "FOLIO IV · SUBCLASS", ThemeTypeVariation = "Eyebrow" });
+        intro.AddChild(new Label { Text = "Choose a Subclass",   ThemeTypeVariation = "H2" });
         intro.AddChild(new Label
         {
             Text = "Specialization within your calling. Subclass features unlock at "
@@ -77,12 +77,9 @@ public partial class StepSubclass : VBoxContainer, IStep
     {
         bool selected = _draft.SubclassId == sub.Id;
 
-        var card = new PanelContainer
-        {
-            CustomMinimumSize = new Vector2(200, 0),
-            MouseFilter = MouseFilterEnum.Stop,
-        };
-        if (selected) card.Modulate = new Color(1f, 0.95f, 0.85f);
+        var card = CodexCard.Make();
+        card.CustomMinimumSize = new Vector2(200, 0);
+        CodexCard.SetSelected(card, selected);
 
         card.GuiInput += (InputEvent e) =>
         {
@@ -94,13 +91,14 @@ public partial class StepSubclass : VBoxContainer, IStep
         box.AddThemeConstantOverride("separation", 6);
         card.AddChild(box);
 
-        box.AddChild(new Label { Text = sub.Name });
+        box.AddChild(new Label { Text = sub.Name, ThemeTypeVariation = "CardName" });
         if (!string.IsNullOrEmpty(sub.Flavor))
         {
             box.AddChild(new Label
             {
                 Text = sub.Flavor,
                 AutowrapMode = TextServer.AutowrapMode.WordSmart,
+                ThemeTypeVariation = "CardBody",
             });
         }
 

Theriapolis.Godot/Scenes/Widgets/AbilitySlot.cs

@@ -23,6 +23,7 @@ public partial class AbilitySlot : PanelContainer
     public override void _Ready()
     {
         CustomMinimumSize = new Vector2(56, 56);
+        ThemeTypeVariation = "AbilitySlot";
         MouseFilter = MouseFilterEnum.Stop;
     }
 

Theriapolis.Godot/Scenes/Widgets/AbilityToken.cs

@@ -25,6 +25,7 @@ public partial class AbilityToken : PanelContainer
     public override void _Ready()
     {
         CustomMinimumSize = new Vector2(56, 56);
+        ThemeTypeVariation = "AbilityToken";
         // PASS so clicks propagate up to the parent AbilitySlot's GuiInput
         // handler (click-to-return). Drag detection still triggers on the
         // deepest non-IGNORE Control under the cursor, so PASS works for

Theriapolis.Godot/Scenes/Widgets/CodexCard.cs

@@ -0,0 +1,67 @@
+using Godot;
+
+namespace Theriapolis.GodotHost.Scenes.Widgets;
+
+/// <summary>
+/// Card-style PanelContainer helpers. The codex Theme defines three
+/// styleboxes for type-variation "Card":
+///   - "panel"           → unselected look (Bg2 fill, Rule border)
+///   - "panel_hover"     → gild border, slightly heavier weight
+///   - "panel_selected"  → seal-red border + soft red shadow
+///
+/// State is held in Godot meta on the card so hover and selected can be
+/// driven independently by different call sites (Make wires the hover
+/// signals; SetSelected is called by step Refresh handlers). The active
+/// stylebox is picked by Apply: selected beats hover beats default.
+/// </summary>
+public static class CodexCard
+{
+    private const string SelectedMeta = "codex_card_selected";
+    private const string HoverMeta    = "codex_card_hover";
+
+    /// <summary>
+    /// Creates a PanelContainer with ThemeTypeVariation = "Card" plus
+    /// hover signal wiring. The MouseEntered/MouseExited handlers update
+    /// the hover meta and re-apply the right stylebox.
+    /// </summary>
+    public static PanelContainer Make()
+    {
+        var card = new PanelContainer
+        {
+            ThemeTypeVariation = "Card",
+            MouseFilter = Control.MouseFilterEnum.Stop,
+        };
+        card.MouseEntered += () => SetHover(card, true);
+        card.MouseExited  += () => SetHover(card, false);
+        return card;
+    }
+
+    public static void SetSelected(PanelContainer card, bool selected)
+    {
+        card.SetMeta(SelectedMeta, selected);
+        Apply(card);
+    }
+
+    private static void SetHover(PanelContainer card, bool hover)
+    {
+        card.SetMeta(HoverMeta, hover);
+        Apply(card);
+    }
+
+    private static void Apply(PanelContainer card)
+    {
+        bool selected = card.HasMeta(SelectedMeta) && (bool)card.GetMeta(SelectedMeta);
+        bool hover    = card.HasMeta(HoverMeta)    && (bool)card.GetMeta(HoverMeta);
+
+        // Priority: selected > hover > default. The default branch removes
+        // the override so the type variation's "panel" stylebox applies.
+        StringName picked = selected ? "panel_selected"
+                          : hover    ? "panel_hover"
+                                     : "panel";
+
+        if (picked == "panel" || !card.HasThemeStylebox(picked, "Card"))
+            card.RemoveThemeStyleboxOverride("panel");
+        else
+            card.AddThemeStyleboxOverride("panel", card.GetThemeStylebox(picked, "Card"));
+    }
+}

Theriapolis.Godot/Scenes/Widgets/PopoverLayer.cs

@@ -6,8 +6,15 @@ namespace Theriapolis.GodotHost.Scenes.Widgets;
 /// Shared overlay layer that owns one reusable trait popover panel.
 /// Per GODOT_PORTING_GUIDE.md §6.1 — TraitChip triggers ask
 /// <see cref="Instance"/> to show the popover at their global rect; the
-/// popover stays open while either the trigger or the popover itself is
-/// hovered (80 ms grace via close timer).
+/// popover hides as soon as the trigger fires MouseExited.
+///
+/// The popover itself is MouseFilter=Ignore so it never intercepts
+/// input — clicks pass through to the chip's parent (card selection),
+/// scroll wheel events go to the underlying ScrollContainer, and the
+/// chip's hover state stays accurate when the cursor moves onto the
+/// popover area (the cursor is registered as "outside the chip", so
+/// MouseExited fires and we hide). This lets adjacent chips fire
+/// reliably even when the previous popover overlaps them spatially.
 ///
 /// One PopoverLayer per scene; lives as a CanvasLayer child of
 /// Wizard.tscn so popovers float above every step's content. Mirrors
@@ -17,7 +24,6 @@ public partial class PopoverLayer : CanvasLayer
 {
     public static PopoverLayer? Instance { get; private set; }
 
-    private const float GracePeriodSec = 0.08f;
     private const float ArrowOffsetPx  = 6f;
     private const int   ViewportPadPx  = 8;
 
@@ -25,7 +31,6 @@ public partial class PopoverLayer : CanvasLayer
     private Label _titleLabel = null!;
     private Label _tagLabel = null!;
     private Label _descLabel = null!;
-    private Timer _closeTimer = null!;
 
     public override void _EnterTree()
     {
@@ -45,14 +50,15 @@ public partial class PopoverLayer : CanvasLayer
 
     private void BuildPopover()
     {
+        // Ignore so clicks/scroll/hover all pass through to whatever's
+        // beneath. The popover is purely a visual readout; the chip
+        // owns the lifecycle entirely.
         _popup = new PanelContainer
         {
             Visible = false,
-            MouseFilter = Control.MouseFilterEnum.Pass,
+            MouseFilter = Control.MouseFilterEnum.Ignore,
             ZIndex = 100,
         };
-        _popup.MouseEntered += CancelClose;
-        _popup.MouseExited += ScheduleClose;
         AddChild(_popup);
 
         var v = new VBoxContainer { CustomMinimumSize = new Vector2(240, 0) };
@@ -75,15 +81,10 @@ public partial class PopoverLayer : CanvasLayer
             CustomMinimumSize = new Vector2(220, 0),
         };
         v.AddChild(_descLabel);
-
-        _closeTimer = new Timer { OneShot = true, WaitTime = GracePeriodSec };
-        _closeTimer.Timeout += HidePopover;
-        AddChild(_closeTimer);
     }
 
     public void ShowFor(Control trigger, string title, string description, string tag, bool detriment)
     {
-        CancelClose();
         _titleLabel.Text = title;
         _descLabel.Text = description;
         _tagLabel.Visible = !string.IsNullOrEmpty(tag) || detriment;
@@ -100,10 +101,11 @@ public partial class PopoverLayer : CanvasLayer
         Reposition(trigger);
     }
 
-    public void ScheduleClose() => _closeTimer.Start();
-    public void CancelClose()   => _closeTimer.Stop();
-
-    private void HidePopover() => _popup.Visible = false;
+    /// <summary>Hide the popover. Was previously a 80ms-grace timer when
+    /// the popover stayed alive across chip→popover hover transitions, but
+    /// the popover is now non-interactive so there's no transition to
+    /// cover for — close immediately.</summary>
+    public void ScheduleClose() => _popup.Visible = false;
 
     private void Reposition(Control trigger)
     {

Theriapolis.Godot/Scenes/Widgets/TraitChip.cs

@@ -24,7 +24,12 @@ public partial class TraitChip : PanelContainer
 
     public override void _Ready()
     {
-        MouseFilter = MouseFilterEnum.Stop;
+        // Pass so click events bubble up to the parent card's GuiInput
+        // (selecting the card). Hover signals fire regardless of filter
+        // mode — they're driven by cursor-rect intersection, not input
+        // event routing.
+        MouseFilter = MouseFilterEnum.Pass;
+        ApplyVariation();
         _label = new Label
         {
             Text = TraitName,
@@ -42,6 +47,12 @@ public partial class TraitChip : PanelContainer
         Tag = tag;
         Detriment = detriment;
         if (_label is not null) _label.Text = name;
+        ApplyVariation();
+    }
+
+    private void ApplyVariation()
+    {
+        ThemeTypeVariation = Detriment ? "PillDetriment" : "Pill";
     }
 
     private void OnHoverEntered()

Theriapolis.Godot/Scenes/Wizard.cs

@@ -8,10 +8,8 @@ namespace Theriapolis.GodotHost.Scenes;
 /// nav bar. Owns the <see cref="CharacterDraft"/> resource and dispatches
 /// each step's content into the StepHost.
 ///
-/// Default theme only at this layer — per guide §12 (build order),
-/// the parchment Theme lands as a final pass once structural correctness
-/// is verified. Until then, font/colour issues are clearly font/colour
-/// issues, not layout issues.
+/// The codex Theme is applied at this root in <see cref="_Ready"/> and
+/// cascades through every descendant — steps, Aside, popover layer.
 /// </summary>
 public partial class Wizard : Control
 {
@@ -56,6 +54,22 @@ public partial class Wizard : Control
 
     public override void _Ready()
     {
+        Theme = UI.CodexTheme.Build();
+
+        // The wizard root is a Control, which paints nothing — without a
+        // backing Panel the viewport's default grey clear color shows
+        // through. Insert a Panel sized to the full rect so the theme's
+        // parchment Bg fills the canvas, then move it behind the existing
+        // children so it doesn't intercept mouse events.
+        var bg = new Panel
+        {
+            AnchorRight = 1,
+            AnchorBottom = 1,
+            MouseFilter = MouseFilterEnum.Ignore,
+        };
+        AddChild(bg);
+        MoveChild(bg, 0);
+
         Character = new UI.CharacterDraft();
 
         _stepper     = GetNode<UI.Widgets.CodexStepper>("%Stepper");