Visual overhaul: theme, illustrations, redesigned screens (0.3.0)

Phase "habillage" of the post-0.1.0 plan. Rendering was reviewed on real
screenshots (new tools/screenshot.gd, `make screenshot`), which also
caught and fixed map markers overlapping and truncated titles.

- Global Godot theme (Atkinson Hyperlegible font, cream/green/gold
  palette, raised buttons, rounded cards, thick keyboard focus).
- Original vector art: forest/marsh backdrops, Plume the owl, stars,
  exercise-type icons, correct/try-again icons, 10 collection items.
- Redesigned world map (markers as cards with icon, title and stars,
  responsive layout), profile screens, mission intro, exercise host,
  rule/feedback panels, reward screen and collection grid.
- Motion helper (pop-in, fade) honouring an animations setting.
- Settings: animations flag; base window 1152x648 with canvas_items.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

scenes/characters/guide_owl.gd

@@ -1,15 +1,23 @@
 extends Control
-## Plume, le hibou guide : affiche une remarque ou un indice sous forme de
-## texte. Portrait provisoire (forme simple, voir assets/CREDITS.md), a
-## remplacer fichier par fichier sans toucher ce script.
+## Plume, le hibou guide : affiche une remarque ou un indice dans une bulle.
+## Illustration vectorielle provisoire (voir assets/CREDITS.md), a remplacer
+## fichier par fichier sans toucher ce script.
 
+@onready var _bubble: Control = $HBox/Bubble
 @onready var _dialogue_label: Label = %DialogueLabel
 
 
+func _ready() -> void:
+    _bubble.visible = _dialogue_label.visible
+
+
 func say(text: String) -> void:
     _dialogue_label.text = text
     _dialogue_label.visible = true
+    _bubble.visible = true
+    Motion.fade_in(_bubble)
 
 
 func clear() -> void:
     _dialogue_label.visible = false
+    _bubble.visible = false

scenes/characters/guide_owl.tscn

@@ -1,15 +1,16 @@
-[gd_scene load_steps=2 format=3]
+[gd_scene load_steps=3 format=3]
 
 [ext_resource type="Script" path="res://scenes/characters/guide_owl.gd" id="1"]
+[ext_resource type="Texture2D" path="res://assets/characters/owl_plume.svg" id="2"]
 
 [node name="GuideOwl" type="Control"]
 layout_mode = 3
 size_flags_horizontal = 3
-custom_minimum_size = Vector2(0, 96)
+custom_minimum_size = Vector2(0, 112)
 script = ExtResource("1")
 
 [node name="HBox" type="HBoxContainer" parent="."]
-layout_mode = 2
+layout_mode = 1
 anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
@@ -17,15 +18,19 @@ grow_horizontal = 2
 grow_vertical = 2
 theme_override_constants/separation = 12
 
-[node name="Portrait" type="ColorRect" parent="HBox"]
+[node name="Portrait" type="TextureRect" parent="HBox"]
 layout_mode = 2
-custom_minimum_size = Vector2(80, 80)
-color = Color(0.56, 0.75, 0.42, 1)
+custom_minimum_size = Vector2(104, 104)
+size_flags_vertical = 4
+texture = ExtResource("2")
+expand_mode = 1
+stretch_mode = 5
 
 [node name="Bubble" type="PanelContainer" parent="HBox"]
+theme_type_variation = &"SoftCard"
 layout_mode = 2
 size_flags_horizontal = 3
-size_flags_vertical = 1
+size_flags_vertical = 4
 
 [node name="DialogueLabel" type="Label" parent="HBox/Bubble"]
 unique_name_in_owner = true

scenes/exercises/dictation.tscn

@@ -29,6 +29,7 @@ theme_override_constants/separation = 16
 
 [node name="InstructionLabel" type="Label" parent="Margin/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
 layout_mode = 2
 autowrap_mode = 2
 

scenes/exercises/exercise_host.gd

@@ -29,6 +29,7 @@ var _pending_outcome := ""
 @onready var _exercise_container: Control = %ExerciseContainer
 @onready var _overlay_container: Control = %OverlayContainer
 @onready var _progress_label: Label = %ProgressLabel
+@onready var _progress_pill: Control = %ProgressPill
 @onready var _abandon_button: Button = %AbandonButton
 @onready var _abandon_confirm_dialog: ConfirmationDialog = %AbandonConfirmDialog
 
@@ -64,6 +65,7 @@ func _ready() -> void:
     _rule = ExerciseEngine.get_rule(_mission["rule_id"])
     _skill_id = _rule.get("skill", "")
     _current_difficulty = ProgressManager.next_difficulty_for_skill(_skill_id, 1)
+    $Backdrop.kind = "marsh" if _rule.get("level", "CE1") == "CE2" else "forest"
     _show_rule_panel()
 
 
@@ -114,6 +116,7 @@ func _load_next_exercise() -> void:
 ## peut faire redonner le meme exercice d'une mission a l'autre tentative :
 ## sans ce repere, ca ressemble a un blocage plutot qu'a une progression.
 func _update_progress_label() -> void:
+    _progress_pill.visible = true
     _progress_label.text = "%s %d/%d" % [
         UIText.get_text("exercise_host.progress_label"), _completed_count + 1, MISSION_LENGTH
     ]

scenes/exercises/exercise_host.tscn

@@ -1,6 +1,7 @@
-[gd_scene load_steps=2 format=3]
+[gd_scene load_steps=3 format=3]
 
 [ext_resource type="Script" path="res://scenes/exercises/exercise_host.gd" id="1"]
+[ext_resource type="PackedScene" path="res://scenes/ui/backdrop.tscn" id="backdrop"]
 
 [node name="ExerciseHost" type="Control"]
 layout_mode = 3
@@ -11,12 +12,36 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1")
 
+[node name="Backdrop" parent="." instance=ExtResource("backdrop")]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+unique_name_in_owner = true
+
+[node name="ContentCard" type="Panel" parent="."]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+offset_left = 24.0
+offset_top = 64.0
+offset_right = -24.0
+offset_bottom = -24.0
+grow_horizontal = 2
+grow_vertical = 2
+
 [node name="ExerciseContainer" type="Control" parent="."]
 unique_name_in_owner = true
 layout_mode = 1
 anchor_right = 1.0
 anchor_bottom = 1.0
-offset_top = 48.0
+offset_left = 40.0
+offset_top = 76.0
+offset_right = -40.0
+offset_bottom = -36.0
 grow_horizontal = 2
 grow_vertical = 2
 
@@ -33,7 +58,7 @@ mouse_filter = 2
 [node name="HeaderBar" type="MarginContainer" parent="."]
 layout_mode = 1
 anchor_right = 1.0
-offset_bottom = 48.0
+offset_bottom = 56.0
 grow_horizontal = 2
 theme_override_constants/margin_left = 16
 theme_override_constants/margin_top = 8
@@ -45,16 +70,24 @@ layout_mode = 2
 
 [node name="AbandonButton" type="Button" parent="HeaderBar/HBox"]
 unique_name_in_owner = true
+theme_type_variation = &"SecondaryButton"
 layout_mode = 2
 
 [node name="Spacer" type="Control" parent="HeaderBar/HBox"]
 layout_mode = 2
 size_flags_horizontal = 3
 
-[node name="ProgressLabel" type="Label" parent="HeaderBar/HBox"]
+[node name="ProgressPill" type="PanelContainer" parent="HeaderBar/HBox"]
 unique_name_in_owner = true
+visible = false
+theme_type_variation = &"Pill"
 layout_mode = 2
-horizontal_alignment = 2
+
+[node name="ProgressLabel" type="Label" parent="HeaderBar/HBox/ProgressPill"]
+unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
+layout_mode = 2
+horizontal_alignment = 1
 
 [node name="AbandonConfirmDialog" type="ConfirmationDialog" parent="."]
 unique_name_in_owner = true

scenes/exercises/multiple_choice.gd

@@ -21,7 +21,8 @@ func load_exercise(exercise: Dictionary) -> void:
     for i in answers.size():
         var button := Button.new()
         button.text = answers[i]
-        button.custom_minimum_size = Vector2(0, 56)
+        button.custom_minimum_size = Vector2(0, 64)
+        button.add_theme_font_size_override("font_size", 28)
         button.pressed.connect(_on_answer_pressed.bind(i))
         _answers_box.add_child(button)
 

scenes/exercises/multiple_choice.tscn

@@ -29,6 +29,7 @@ theme_override_constants/separation = 16
 
 [node name="InstructionLabel" type="Label" parent="Margin/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
 layout_mode = 2
 autowrap_mode = 2
 
@@ -36,7 +37,7 @@ autowrap_mode = 2
 unique_name_in_owner = true
 layout_mode = 2
 autowrap_mode = 2
-theme_override_font_sizes/font_size = 24
+theme_type_variation = &"CardTitle"
 
 [node name="AnswersBox" type="VBoxContainer" parent="Margin/VBox"]
 unique_name_in_owner = true

scenes/exercises/sentence_correction.gd

@@ -33,6 +33,9 @@ func load_exercise(exercise: Dictionary) -> void:
         var button := Button.new()
         button.text = tokens[i]["text"]
         button.toggle_mode = true
+        button.theme_type_variation = &"SecondaryButton"
+        button.custom_minimum_size = Vector2(0, 60)
+        button.add_theme_font_size_override("font_size", 30)
         button.toggled.connect(_on_token_toggled.bind(i))
         _tokens_box.add_child(button)
 

scenes/exercises/sentence_correction.tscn

@@ -29,6 +29,7 @@ theme_override_constants/separation = 16
 
 [node name="InstructionLabel" type="Label" parent="Margin/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
 layout_mode = 2
 autowrap_mode = 2
 

scenes/profiles/profile_create.tscn

@@ -1,7 +1,9 @@
-[gd_scene load_steps=3 format=3]
+[gd_scene load_steps=4 format=3]
 
 [ext_resource type="Script" path="res://scenes/profiles/profile_create.gd" id="1"]
 
+[ext_resource type="PackedScene" path="res://scenes/ui/backdrop.tscn" id="backdrop"]
+
 [sub_resource type="ButtonGroup" id="SchoolLevelGroup"]
 
 [node name="ProfileCreate" type="Control"]
@@ -13,6 +15,14 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1")
 
+[node name="Backdrop" parent="." instance=ExtResource("backdrop")]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+
 [node name="Margin" type="MarginContainer" parent="."]
 layout_mode = 1
 anchors_preset = 15
@@ -25,58 +35,70 @@ theme_override_constants/margin_top = 32
 theme_override_constants/margin_right = 32
 theme_override_constants/margin_bottom = 32
 
-[node name="VBox" type="VBoxContainer" parent="Margin"]
+[node name="Center" type="CenterContainer" parent="Margin"]
 layout_mode = 2
-theme_override_constants/separation = 16
 
-[node name="TitleLabel" type="Label" parent="Margin/VBox"]
+[node name="Card" type="PanelContainer" parent="Margin/Center"]
+layout_mode = 2
+custom_minimum_size = Vector2(640, 0)
+
+[node name="VBox" type="VBoxContainer" parent="Margin/Center/Card"]
+layout_mode = 2
+theme_override_constants/separation = 14
+
+[node name="TitleLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
-theme_override_font_sizes/font_size = 32
+theme_type_variation = &"CardTitle"
+horizontal_alignment = 1
 
-[node name="NameLabel" type="Label" parent="Margin/VBox"]
+[node name="NameLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 
-[node name="NameEdit" type="LineEdit" parent="Margin/VBox"]
+[node name="NameEdit" type="LineEdit" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 custom_minimum_size = Vector2(0, 48)
 
-[node name="ErrorLabel" type="Label" parent="Margin/VBox"]
+[node name="ErrorLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 autowrap_mode = 2
 
-[node name="LevelLabel" type="Label" parent="Margin/VBox"]
+[node name="LevelLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 
-[node name="LevelBox" type="HBoxContainer" parent="Margin/VBox"]
+[node name="LevelBox" type="HBoxContainer" parent="Margin/Center/Card/VBox"]
 layout_mode = 2
 theme_override_constants/separation = 16
 
-[node name="CE1Button" type="Button" parent="Margin/VBox/LevelBox"]
+[node name="CE1Button" type="Button" parent="Margin/Center/Card/VBox/LevelBox"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
 custom_minimum_size = Vector2(0, 56)
+theme_type_variation = &"SecondaryButton"
 toggle_mode = true
 button_group = SubResource("SchoolLevelGroup")
 
-[node name="CE2Button" type="Button" parent="Margin/VBox/LevelBox"]
+[node name="CE2Button" type="Button" parent="Margin/Center/Card/VBox/LevelBox"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
 custom_minimum_size = Vector2(0, 56)
+theme_type_variation = &"SecondaryButton"
 toggle_mode = true
 button_group = SubResource("SchoolLevelGroup")
 
-[node name="ConfirmButton" type="Button" parent="Margin/VBox"]
+[node name="ConfirmButton" type="Button" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 custom_minimum_size = Vector2(0, 56)
 
-[node name="CancelButton" type="Button" parent="Margin/VBox"]
+[node name="CancelButton" type="Button" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"SecondaryButton"
 layout_mode = 2
+custom_minimum_size = Vector2(0, 48)

scenes/profiles/profile_select.gd

@@ -41,14 +41,17 @@ func _refresh_profile_list() -> void:
 
 func _build_profile_row(summary: Dictionary) -> Control:
     var row := HBoxContainer.new()
+    row.add_theme_constant_override("separation", 10)
 
     var select_button := Button.new()
     select_button.text = "%s (%s)" % [summary["display_name"], summary["school_level"]]
     select_button.size_flags_horizontal = Control.SIZE_EXPAND_FILL
+    select_button.custom_minimum_size = Vector2(0, 56)
     select_button.pressed.connect(_on_profile_selected.bind(summary["profile_id"]))
     row.add_child(select_button)
 
     var delete_button := Button.new()
+    delete_button.theme_type_variation = &"SecondaryButton"
     delete_button.text = UIText.get_text("profile_select.delete_button")
     delete_button.pressed.connect(_on_delete_requested.bind(summary["profile_id"]))
     row.add_child(delete_button)

scenes/profiles/profile_select.tscn

@@ -1,6 +1,7 @@
-[gd_scene load_steps=2 format=3]
+[gd_scene load_steps=3 format=3]
 
 [ext_resource type="Script" path="res://scenes/profiles/profile_select.gd" id="1"]
+[ext_resource type="PackedScene" path="res://scenes/ui/backdrop.tscn" id="backdrop"]
 
 [node name="ProfileSelect" type="Control"]
 layout_mode = 3
@@ -11,6 +12,14 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1")
 
+[node name="Backdrop" parent="." instance=ExtResource("backdrop")]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+
 [node name="Margin" type="MarginContainer" parent="."]
 layout_mode = 1
 anchors_preset = 15
@@ -23,31 +32,40 @@ theme_override_constants/margin_top = 32
 theme_override_constants/margin_right = 32
 theme_override_constants/margin_bottom = 32
 
-[node name="VBox" type="VBoxContainer" parent="Margin"]
+[node name="Center" type="CenterContainer" parent="Margin"]
+layout_mode = 2
+
+[node name="Card" type="PanelContainer" parent="Margin/Center"]
+layout_mode = 2
+custom_minimum_size = Vector2(720, 0)
+
+[node name="VBox" type="VBoxContainer" parent="Margin/Center/Card"]
 layout_mode = 2
 theme_override_constants/separation = 16
 
-[node name="TitleLabel" type="Label" parent="Margin/VBox"]
+[node name="TitleLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
-theme_override_font_sizes/font_size = 32
+theme_type_variation = &"CardTitle"
+horizontal_alignment = 1
 
-[node name="Scroll" type="ScrollContainer" parent="Margin/VBox"]
+[node name="Scroll" type="ScrollContainer" parent="Margin/Center/Card/VBox"]
 layout_mode = 2
+custom_minimum_size = Vector2(0, 260)
 size_flags_vertical = 3
 
-[node name="ProfileList" type="VBoxContainer" parent="Margin/VBox/Scroll"]
+[node name="ProfileList" type="VBoxContainer" parent="Margin/Center/Card/VBox/Scroll"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
 theme_override_constants/separation = 8
 
-[node name="EmptyStateLabel" type="Label" parent="Margin/VBox"]
+[node name="EmptyStateLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 autowrap_mode = 2
 
-[node name="NewProfileButton" type="Button" parent="Margin/VBox"]
+[node name="NewProfileButton" type="Button" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 custom_minimum_size = Vector2(0, 56)

scenes/ui/backdrop.gd

@@ -0,0 +1,24 @@
+extends Control
+## Decor plein ecran derriere un ecran (illustration vectorielle provisoire,
+## voir assets/CREDITS.md). "forest" pour le CE1, "marsh" pour le CE2.
+
+const TEXTURES := {
+    "forest": "res://assets/environments/forest_backdrop.svg",
+    "marsh": "res://assets/environments/marsh_backdrop.svg",
+}
+
+@export_enum("forest", "marsh") var kind: String = "forest":
+    set(value):
+        kind = value
+        _apply()
+
+@onready var _picture: TextureRect = $Picture
+
+
+func _ready() -> void:
+    _apply()
+
+
+func _apply() -> void:
+    if _picture != null:
+        _picture.texture = load(TEXTURES.get(kind, TEXTURES["forest"]))

scenes/ui/backdrop.gd.uid

@@ -0,0 +1 @@
+uid://xc0ialw4cfk0

scenes/ui/backdrop.tscn

@@ -0,0 +1,24 @@
+[gd_scene load_steps=2 format=3]
+
+[ext_resource type="Script" path="res://scenes/ui/backdrop.gd" id="1"]
+
+[node name="Backdrop" type="Control"]
+layout_mode = 3
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+mouse_filter = 2
+script = ExtResource("1")
+
+[node name="Picture" type="TextureRect" parent="."]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+mouse_filter = 2
+expand_mode = 1
+stretch_mode = 6

scenes/ui/collection.gd

@@ -2,9 +2,11 @@ extends Control
 ## Collection d'objets gagnes avec les etoiles. Un objet non debloque reste
 ## mysterieux mais indique comment l'obtenir (jamais de mystere frustrant).
 
+const ICON_SIZE := 72.0
+
 @onready var _title_label: Label = %TitleLabel
 @onready var _progress_label: Label = %ProgressLabel
-@onready var _items_box: VBoxContainer = %ItemsBox
+@onready var _items_box: GridContainer = %ItemsBox
 @onready var _back_button: Button = %BackButton
 
 
@@ -26,20 +28,39 @@ func _ready() -> void:
     )
 
 
+## Une ligne = pictogramme + texte (le Label s'appelle "TextLabel").
 func _build_row(item: Dictionary, is_owned: bool) -> Control:
+    var card := PanelContainer.new()
+    card.theme_type_variation = &"SoftCard"
+    card.size_flags_horizontal = Control.SIZE_EXPAND_FILL
+
+    var row := HBoxContainer.new()
+    row.add_theme_constant_override("separation", 12)
+    card.add_child(row)
+
+    var icon := TextureRect.new()
+    icon.texture = (
+        ItemIcons.texture_for(item["item_id"]) if is_owned else ItemIcons.locked_texture()
+    )
+    icon.custom_minimum_size = Vector2(ICON_SIZE, ICON_SIZE)
+    icon.expand_mode = TextureRect.EXPAND_IGNORE_SIZE
+    icon.stretch_mode = TextureRect.STRETCH_KEEP_ASPECT_CENTERED
+    icon.size_flags_vertical = Control.SIZE_SHRINK_CENTER
+    row.add_child(icon)
+
     var label := Label.new()
+    label.name = "TextLabel"
     label.autowrap_mode = TextServer.AUTOWRAP_WORD_SMART
-    label.custom_minimum_size = Vector2(560, 0)
+    label.size_flags_horizontal = Control.SIZE_EXPAND_FILL
+    label.size_flags_vertical = Control.SIZE_SHRINK_CENTER
     if is_owned:
-        label.text = (
-            "%s — %s\n%s"
-            % [item["title"], UIText.get_text("collection.owned_marker"), item["description"]]
-        )
+        label.text = "%s\n%s" % [item["title"], item["description"]]
     else:
         label.text = (
             "%s\n%s" % [UIText.get_text("collection.locked_title"), _unlock_hint(item["unlock"])]
         )
-    return label
+    row.add_child(label)
+    return card
 
 
 func _unlock_hint(unlock: Dictionary) -> String:

scenes/ui/collection.tscn

@@ -1,6 +1,7 @@
-[gd_scene load_steps=2 format=3]
+[gd_scene load_steps=3 format=3]
 
 [ext_resource type="Script" path="res://scenes/ui/collection.gd" id="1"]
+[ext_resource type="PackedScene" path="res://scenes/ui/backdrop.tscn" id="backdrop"]
 
 [node name="Collection" type="Control"]
 layout_mode = 3
@@ -11,6 +12,14 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1")
 
+[node name="Backdrop" parent="." instance=ExtResource("backdrop")]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+
 [node name="Margin" type="MarginContainer" parent="."]
 layout_mode = 1
 anchors_preset = 15
@@ -18,37 +27,44 @@ anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
-theme_override_constants/margin_left = 24
+theme_override_constants/margin_left = 40
 theme_override_constants/margin_top = 24
-theme_override_constants/margin_right = 24
+theme_override_constants/margin_right = 40
 theme_override_constants/margin_bottom = 24
 
-[node name="VBox" type="VBoxContainer" parent="Margin"]
+[node name="Card" type="PanelContainer" parent="Margin"]
+layout_mode = 2
+
+[node name="VBox" type="VBoxContainer" parent="Margin/Card"]
 layout_mode = 2
 theme_override_constants/separation = 12
 
-[node name="TitleLabel" type="Label" parent="Margin/VBox"]
-unique_name_in_owner = true
-layout_mode = 2
-theme_override_font_sizes/font_size = 32
-horizontal_alignment = 1
-
-[node name="ProgressLabel" type="Label" parent="Margin/VBox"]
+[node name="TitleLabel" type="Label" parent="Margin/Card/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"CardTitle"
 layout_mode = 2
 horizontal_alignment = 1
 
-[node name="Scroll" type="ScrollContainer" parent="Margin/VBox"]
+[node name="ProgressLabel" type="Label" parent="Margin/Card/VBox"]
+unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
+layout_mode = 2
+horizontal_alignment = 1
+
+[node name="Scroll" type="ScrollContainer" parent="Margin/Card/VBox"]
 layout_mode = 2
 size_flags_vertical = 3
+horizontal_scroll_mode = 0
 
-[node name="ItemsBox" type="VBoxContainer" parent="Margin/VBox/Scroll"]
+[node name="ItemsBox" type="GridContainer" parent="Margin/Card/VBox/Scroll"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
-theme_override_constants/separation = 16
+theme_override_constants/h_separation = 16
+theme_override_constants/v_separation = 12
+columns = 2
 
-[node name="BackButton" type="Button" parent="Margin/VBox"]
+[node name="BackButton" type="Button" parent="Margin/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 custom_minimum_size = Vector2(0, 56)

scenes/ui/feedback_panel.gd

@@ -5,6 +5,10 @@ extends Control
 
 signal continue_pressed
 
+const ICON_CORRECT := preload("res://assets/interface/icon_correct.svg")
+const ICON_TRY_AGAIN := preload("res://assets/interface/icon_try_again.svg")
+
+@onready var _icon: TextureRect = %Icon
 @onready var _title_label: Label = %TitleLabel
 @onready var _hint_box: VBoxContainer = %HintBox
 @onready var _hint_label: Label = %HintLabel
@@ -21,6 +25,8 @@ func _ready() -> void:
 
 
 func show_result(result: CorrectionResult, support_level: AttemptFlow.SupportLevel) -> void:
+    _icon.texture = ICON_CORRECT if result.is_correct else ICON_TRY_AGAIN
+    Motion.pop_in(_icon)
     _title_label.text = (
         UIText.get_text("feedback_panel.correct_title")
         if result.is_correct

scenes/ui/feedback_panel.tscn

@@ -31,7 +31,7 @@ grow_vertical = 2
 
 [node name="Panel" type="PanelContainer" parent="CenterContainer"]
 layout_mode = 2
-custom_minimum_size = Vector2(480, 0)
+custom_minimum_size = Vector2(560, 0)
 
 [node name="Margin" type="MarginContainer" parent="CenterContainer/Panel"]
 layout_mode = 2
@@ -44,10 +44,19 @@ theme_override_constants/margin_bottom = 24
 layout_mode = 2
 theme_override_constants/separation = 12
 
-[node name="TitleLabel" type="Label" parent="CenterContainer/Panel/Margin/VBox"]
+[node name="Icon" type="TextureRect" parent="CenterContainer/Panel/Margin/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
-theme_override_font_sizes/font_size = 28
+custom_minimum_size = Vector2(72, 72)
+size_flags_horizontal = 4
+expand_mode = 1
+stretch_mode = 5
+
+[node name="TitleLabel" type="Label" parent="CenterContainer/Panel/Margin/VBox"]
+unique_name_in_owner = true
+theme_type_variation = &"CardTitle"
+layout_mode = 2
+horizontal_alignment = 1
 
 [node name="HintBox" type="VBoxContainer" parent="CenterContainer/Panel/Margin/VBox"]
 unique_name_in_owner = true

scenes/ui/reward_screen.gd

@@ -5,23 +5,37 @@ extends Control
 ## au moins une etoile. Sauvegarde groupee ici, en fin de mission
 ## (docs/specs/decisions.md point 7).
 
+const STAR_FULL := preload("res://assets/interface/star_full.svg")
+const STAR_EMPTY := preload("res://assets/interface/star_empty.svg")
+const STAR_SIZE := 88.0
+const ITEM_SIZE := 72.0
+
+@onready var _backdrop: Control = %Backdrop
 @onready var _title_label: Label = %TitleLabel
+@onready var _stars_row: HBoxContainer = %StarsRow
 @onready var _stars_label: Label = %StarsLabel
 @onready var _message_label: Label = %MessageLabel
 @onready var _record_label: Label = %RecordLabel
 @onready var _total_label: Label = %TotalLabel
+@onready var _new_items_box: VBoxContainer = %NewItemsBox
 @onready var _new_items_label: Label = %NewItemsLabel
+@onready var _new_items_row: HBoxContainer = %NewItemsRow
 @onready var _collection_button: Button = %CollectionButton
 @onready var _continue_button: Button = %ContinueButton
 
 
 func _ready() -> void:
+    var mission := ExerciseEngine.get_mission(GameManager.pending_mission_id)
+    var rule := ExerciseEngine.get_rule(mission.get("rule_id", ""))
+    _backdrop.kind = "marsh" if rule.get("level", "CE1") == "CE2" else "forest"
+
     var summary := ProgressManager.complete_mission(
         GameManager.pending_mission_id, GameManager.last_outcomes
     )
     ProgressManager.save_now()
 
     _title_label.text = UIText.get_text("reward_screen.title")
+    _show_stars(summary["stars"])
     _stars_label.text = (
         "%s %d/%d"
         % [UIText.get_text("reward_screen.stars_label"), summary["stars"], MissionScoring.MAX_STARS]
@@ -32,17 +46,7 @@ func _ready() -> void:
     _total_label.text = (
         "%s %d" % [UIText.get_text("reward_screen.total_label"), summary["total_stars"]]
     )
-
-    var new_items: Array = summary["new_items"]
-    _new_items_label.visible = not new_items.is_empty()
-    if not new_items.is_empty():
-        var titles: Array[String] = []
-        for item in ExerciseEngine.get_reward_items():
-            if new_items.has(item["item_id"]):
-                titles.append(item["title"])
-        _new_items_label.text = (
-            "%s\n%s" % [UIText.get_text("reward_screen.new_items_label"), "\n".join(titles)]
-        )
+    _show_new_items(summary["new_items"])
 
     _collection_button.text = UIText.get_text("reward_screen.collection_button")
     _collection_button.pressed.connect(_on_collection_pressed)
@@ -50,6 +54,45 @@ func _ready() -> void:
     _continue_button.pressed.connect(_on_continue_pressed)
 
 
+func _show_stars(earned: int) -> void:
+    for i in MissionScoring.MAX_STARS:
+        var star := TextureRect.new()
+        star.texture = STAR_FULL if i < earned else STAR_EMPTY
+        star.custom_minimum_size = Vector2(STAR_SIZE, STAR_SIZE)
+        star.expand_mode = TextureRect.EXPAND_IGNORE_SIZE
+        star.stretch_mode = TextureRect.STRETCH_KEEP_ASPECT_CENTERED
+        _stars_row.add_child(star)
+        if i < earned:
+            Motion.pop_in(star, 0.25 + 0.2 * i)
+
+
+func _show_new_items(new_items: Array) -> void:
+    _new_items_box.visible = not new_items.is_empty()
+    if new_items.is_empty():
+        return
+    _new_items_label.text = UIText.get_text("reward_screen.new_items_label")
+    var index := 0
+    for item in ExerciseEngine.get_reward_items():
+        if not new_items.has(item["item_id"]):
+            continue
+        var holder := VBoxContainer.new()
+        var icon := TextureRect.new()
+        icon.texture = ItemIcons.texture_for(item["item_id"])
+        icon.custom_minimum_size = Vector2(ITEM_SIZE, ITEM_SIZE)
+        icon.expand_mode = TextureRect.EXPAND_IGNORE_SIZE
+        icon.stretch_mode = TextureRect.STRETCH_KEEP_ASPECT_CENTERED
+        icon.size_flags_horizontal = Control.SIZE_SHRINK_CENTER
+        holder.add_child(icon)
+        var name_label := Label.new()
+        name_label.text = item["title"]
+        name_label.horizontal_alignment = HORIZONTAL_ALIGNMENT_CENTER
+        name_label.theme_type_variation = &"Small"
+        holder.add_child(name_label)
+        _new_items_row.add_child(holder)
+        Motion.pop_in(holder, 0.8 + 0.15 * index)
+        index += 1
+
+
 func _on_collection_pressed() -> void:
     GameManager.pending_mission_id = ""
     GameManager.goto(GameManager.SCENE_COLLECTION)

scenes/ui/reward_screen.tscn

@@ -1,6 +1,8 @@
-[gd_scene load_steps=2 format=3]
+[gd_scene load_steps=4 format=3]
 
 [ext_resource type="Script" path="res://scenes/ui/reward_screen.gd" id="1"]
+[ext_resource type="PackedScene" path="res://scenes/ui/backdrop.tscn" id="backdrop"]
+[ext_resource type="Texture2D" path="res://assets/characters/owl_plume.svg" id="3"]
 
 [node name="RewardScreen" type="Control"]
 layout_mode = 3
@@ -11,59 +13,104 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1")
 
-[node name="CenterContainer" type="CenterContainer" parent="."]
+[node name="Backdrop" parent="." instance=ExtResource("backdrop")]
 layout_mode = 1
 anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
-
-[node name="VBox" type="VBoxContainer" parent="CenterContainer"]
-layout_mode = 2
-theme_override_constants/separation = 20
-
-[node name="TitleLabel" type="Label" parent="CenterContainer/VBox"]
 unique_name_in_owner = true
-layout_mode = 2
-theme_override_font_sizes/font_size = 36
-horizontal_alignment = 1
 
-[node name="StarsLabel" type="Label" parent="CenterContainer/VBox"]
+[node name="Margin" type="MarginContainer" parent="."]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 32
+theme_override_constants/margin_top = 24
+theme_override_constants/margin_right = 32
+theme_override_constants/margin_bottom = 24
+
+[node name="Center" type="CenterContainer" parent="Margin"]
+layout_mode = 2
+
+[node name="Card" type="PanelContainer" parent="Margin/Center"]
+layout_mode = 2
+custom_minimum_size = Vector2(720, 0)
+
+[node name="VBox" type="VBoxContainer" parent="Margin/Center/Card"]
+layout_mode = 2
+theme_override_constants/separation = 12
+
+[node name="TitleLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"CardTitle"
 layout_mode = 2
 horizontal_alignment = 1
 
-[node name="MessageLabel" type="Label" parent="CenterContainer/VBox"]
+[node name="StarsRow" type="HBoxContainer" parent="Margin/Center/Card/VBox"]
+unique_name_in_owner = true
+layout_mode = 2
+alignment = 1
+theme_override_constants/separation = 10
+
+[node name="StarsLabel" type="Label" parent="Margin/Center/Card/VBox"]
+unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
+layout_mode = 2
+horizontal_alignment = 1
+
+[node name="MessageLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 horizontal_alignment = 1
 autowrap_mode = 2
-custom_minimum_size = Vector2(480, 0)
 
-[node name="RecordLabel" type="Label" parent="CenterContainer/VBox"]
+[node name="RecordLabel" type="Label" parent="Margin/Center/Card/VBox"]
+unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
+layout_mode = 2
+horizontal_alignment = 1
+
+[node name="TotalLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 horizontal_alignment = 1
 
-[node name="TotalLabel" type="Label" parent="CenterContainer/VBox"]
+[node name="NewItemsBox" type="VBoxContainer" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
-horizontal_alignment = 1
+theme_override_constants/separation = 6
 
-[node name="NewItemsLabel" type="Label" parent="CenterContainer/VBox"]
+[node name="NewItemsLabel" type="Label" parent="Margin/Center/Card/VBox/NewItemsBox"]
 unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
 layout_mode = 2
 horizontal_alignment = 1
 autowrap_mode = 2
-custom_minimum_size = Vector2(480, 0)
 
-[node name="CollectionButton" type="Button" parent="CenterContainer/VBox"]
+[node name="NewItemsRow" type="HBoxContainer" parent="Margin/Center/Card/VBox/NewItemsBox"]
 unique_name_in_owner = true
 layout_mode = 2
-custom_minimum_size = Vector2(200, 56)
+alignment = 1
+theme_override_constants/separation = 16
 
-[node name="ContinueButton" type="Button" parent="CenterContainer/VBox"]
+[node name="Buttons" type="HBoxContainer" parent="Margin/Center/Card/VBox"]
+layout_mode = 2
+theme_override_constants/separation = 16
+
+[node name="CollectionButton" type="Button" parent="Margin/Center/Card/VBox/Buttons"]
+unique_name_in_owner = true
+theme_type_variation = &"SecondaryButton"
+layout_mode = 2
+size_flags_horizontal = 3
+custom_minimum_size = Vector2(0, 56)
+
+[node name="ContinueButton" type="Button" parent="Margin/Center/Card/VBox/Buttons"]
 unique_name_in_owner = true
 layout_mode = 2
-custom_minimum_size = Vector2(200, 56)
+size_flags_horizontal = 3
+custom_minimum_size = Vector2(0, 56)

scenes/ui/rule_panel.tscn

@@ -31,7 +31,7 @@ grow_vertical = 2
 
 [node name="Panel" type="PanelContainer" parent="CenterContainer"]
 layout_mode = 2
-custom_minimum_size = Vector2(480, 0)
+custom_minimum_size = Vector2(560, 0)
 
 [node name="Margin" type="MarginContainer" parent="CenterContainer/Panel"]
 layout_mode = 2
@@ -46,8 +46,9 @@ theme_override_constants/separation = 16
 
 [node name="TitleLabel" type="Label" parent="CenterContainer/Panel/Margin/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"CardTitle"
 layout_mode = 2
-theme_override_font_sizes/font_size = 28
+horizontal_alignment = 1
 
 [node name="StatementLabel" type="Label" parent="CenterContainer/Panel/Margin/VBox"]
 unique_name_in_owner = true

scenes/world/mission_intro.gd

@@ -4,7 +4,6 @@ extends Control
 ## (voir "Points durs" du prompt de lancement, Sens de l'aventure).
 
 @onready var _title_label: Label = %TitleLabel
-@onready var _narrative_label: Label = %NarrativeLabel
 @onready var _guide: Control = %Guide
 @onready var _start_button: Button = %StartButton
 @onready var _back_button: Button = %BackButton
@@ -13,8 +12,9 @@ extends Control
 func _ready() -> void:
     var mission := ExerciseEngine.get_mission(GameManager.pending_mission_id)
     _title_label.text = mission.get("title", "")
-    _narrative_label.text = mission.get("narrative_context", "")
     _guide.say(mission.get("narrative_context", ""))
+    var rule := ExerciseEngine.get_rule(mission.get("rule_id", ""))
+    $Backdrop.kind = "marsh" if rule.get("level", "CE1") == "CE2" else "forest"
 
     _start_button.text = UIText.get_text("mission_intro.start_button")
     _back_button.text = UIText.get_text("mission_intro.back_button")

scenes/world/mission_intro.tscn

@@ -1,7 +1,8 @@
-[gd_scene load_steps=3 format=3]
+[gd_scene load_steps=4 format=3]
 
 [ext_resource type="Script" path="res://scenes/world/mission_intro.gd" id="1"]
 [ext_resource type="PackedScene" path="res://scenes/characters/guide_owl.tscn" id="2"]
+[ext_resource type="PackedScene" path="res://scenes/ui/backdrop.tscn" id="backdrop"]
 
 [node name="MissionIntro" type="Control"]
 layout_mode = 3
@@ -12,6 +13,14 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1")
 
+[node name="Backdrop" parent="." instance=ExtResource("backdrop")]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+
 [node name="Margin" type="MarginContainer" parent="."]
 layout_mode = 1
 anchors_preset = 15
@@ -19,40 +28,45 @@ anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
-theme_override_constants/margin_left = 32
-theme_override_constants/margin_top = 32
-theme_override_constants/margin_right = 32
-theme_override_constants/margin_bottom = 32
+theme_override_constants/margin_left = 48
+theme_override_constants/margin_top = 40
+theme_override_constants/margin_right = 48
+theme_override_constants/margin_bottom = 40
 
-[node name="VBox" type="VBoxContainer" parent="Margin"]
+[node name="Center" type="CenterContainer" parent="Margin"]
 layout_mode = 2
-theme_override_constants/separation = 16
 
-[node name="TitleLabel" type="Label" parent="Margin/VBox"]
-unique_name_in_owner = true
-layout_mode = 2
-theme_override_font_sizes/font_size = 32
-
-[node name="NarrativeLabel" type="Label" parent="Margin/VBox"]
+[node name="Card" type="PanelContainer" parent="Margin/Center"]
+layout_mode = 2
+custom_minimum_size = Vector2(760, 0)
+
+[node name="VBox" type="VBoxContainer" parent="Margin/Center/Card"]
+layout_mode = 2
+theme_override_constants/separation = 18
+
+[node name="TitleLabel" type="Label" parent="Margin/Center/Card/VBox"]
 unique_name_in_owner = true
+theme_type_variation = &"CardTitle"
 layout_mode = 2
+horizontal_alignment = 1
 autowrap_mode = 2
-size_flags_vertical = 3
 
-[node name="Guide" type="Control" parent="Margin/VBox" instance=ExtResource("2")]
+[node name="Guide" type="Control" parent="Margin/Center/Card/VBox" instance=ExtResource("2")]
 unique_name_in_owner = true
 layout_mode = 2
+custom_minimum_size = Vector2(0, 150)
 
-[node name="Buttons" type="HBoxContainer" parent="Margin/VBox"]
+[node name="Buttons" type="HBoxContainer" parent="Margin/Center/Card/VBox"]
 layout_mode = 2
 theme_override_constants/separation = 16
 
-[node name="BackButton" type="Button" parent="Margin/VBox/Buttons"]
+[node name="BackButton" type="Button" parent="Margin/Center/Card/VBox/Buttons"]
 unique_name_in_owner = true
+theme_type_variation = &"SecondaryButton"
 layout_mode = 2
 custom_minimum_size = Vector2(0, 56)
 
-[node name="StartButton" type="Button" parent="Margin/VBox/Buttons"]
+[node name="StartButton" type="Button" parent="Margin/Center/Card/VBox/Buttons"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3

scenes/world/mission_marker.gd

@@ -0,0 +1,37 @@
+extends Button
+## Un lieu de la carte : pictogramme du type d'exercice, titre, etoiles
+## gagnees (pleines/vides : la forme porte l'information, pas la couleur) et
+## etat de la competence. Scene autonome : la carte la configure et ecoute
+## `pressed`.
+
+const STAR_FULL := preload("res://assets/interface/star_full.svg")
+const STAR_EMPTY := preload("res://assets/interface/star_empty.svg")
+const TYPE_ICONS := {
+    "multiple_choice": "res://assets/interface/icon_multiple_choice.svg",
+    "sentence_correction": "res://assets/interface/icon_sentence_correction.svg",
+    "dictation": "res://assets/interface/icon_dictation.svg",
+}
+const STAR_SIZE := 24.0
+
+@onready var _type_icon: TextureRect = %TypeIcon
+@onready var _title_label: Label = %TitleLabel
+@onready var _stars_row: HBoxContainer = %StarsRow
+@onready var _status_label: Label = %StatusLabel
+
+
+func setup(mission: Dictionary, stars: int, max_stars: int, status_text: String) -> void:
+    _title_label.text = mission["title"]
+    _status_label.text = status_text
+    _status_label.visible = not status_text.is_empty()
+    _type_icon.texture = load(TYPE_ICONS.get(mission["exercise_type"], TYPE_ICONS["multiple_choice"]))
+
+    for child in _stars_row.get_children():
+        child.queue_free()
+    for i in max_stars:
+        var star := TextureRect.new()
+        star.texture = STAR_FULL if i < stars else STAR_EMPTY
+        star.custom_minimum_size = Vector2(STAR_SIZE, STAR_SIZE)
+        star.expand_mode = TextureRect.EXPAND_IGNORE_SIZE
+        star.stretch_mode = TextureRect.STRETCH_KEEP_ASPECT_CENTERED
+        star.mouse_filter = Control.MOUSE_FILTER_IGNORE
+        _stars_row.add_child(star)

scenes/world/mission_marker.gd.uid

@@ -0,0 +1 @@
+uid://cd6db5ude6pwq

scenes/world/mission_marker.tscn

@@ -0,0 +1,59 @@
+[gd_scene load_steps=3 format=3]
+
+[ext_resource type="Script" path="res://scenes/world/mission_marker.gd" id="1"]
+[ext_resource type="Texture2D" path="res://assets/interface/star_empty.svg" id="2"]
+
+[node name="MissionMarker" type="Button"]
+theme_type_variation = &"MarkerButton"
+custom_minimum_size = Vector2(220, 120)
+script = ExtResource("1")
+
+[node name="Content" type="VBoxContainer" parent="."]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+mouse_filter = 2
+theme_override_constants/separation = 2
+alignment = 1
+
+[node name="Header" type="HBoxContainer" parent="Content"]
+layout_mode = 2
+mouse_filter = 2
+theme_override_constants/separation = 8
+alignment = 1
+
+[node name="TypeIcon" type="TextureRect" parent="Content/Header"]
+unique_name_in_owner = true
+layout_mode = 2
+custom_minimum_size = Vector2(36, 36)
+size_flags_vertical = 4
+mouse_filter = 2
+expand_mode = 1
+stretch_mode = 5
+
+[node name="TitleLabel" type="Label" parent="Content/Header"]
+unique_name_in_owner = true
+layout_mode = 2
+size_flags_horizontal = 3
+mouse_filter = 2
+theme_override_font_sizes/font_size = 18
+autowrap_mode = 3
+max_lines_visible = 3
+text_overrun_behavior = 3
+vertical_alignment = 1
+
+[node name="StarsRow" type="HBoxContainer" parent="Content"]
+unique_name_in_owner = true
+layout_mode = 2
+mouse_filter = 2
+alignment = 1
+
+[node name="StatusLabel" type="Label" parent="Content"]
+unique_name_in_owner = true
+layout_mode = 2
+mouse_filter = 2
+theme_type_variation = &"Small"
+horizontal_alignment = 1

scenes/world/world_map.gd

@@ -3,20 +3,22 @@ extends Control
 ## (cahier des charges §15) se limitait a trois lieux ; le perimetre a ete
 ## etendu (docs/specs/decisions.md, points 25 et 27). La position de chaque
 ## mission vient de data/missions/*.json (fractions 0..1 de la zone de
-## carte), jamais d'une position fixe en dur dans le script. Un profil CE2
-## peut basculer sur la carte CE1 pour revoir les notions precedentes.
+## carte), jamais d'une position fixe en dur dans le script : chaque lieu est
+## replace quand la zone change de taille. Un profil CE2 peut basculer sur la
+## carte CE1 pour revoir les notions precedentes.
 
-const MARKER_HALF_WIDTH := 80.0
-const MARKER_HALF_HEIGHT := 48.0
+const MARKER_SCENE := preload("res://scenes/world/mission_marker.tscn")
 
 var _viewed_level := "CE1"
 
+@onready var _backdrop: Control = %Backdrop
 @onready var _title_label: Label = %TitleLabel
 @onready var _map_area: Control = %MapArea
 @onready var _level_toggle_button: Button = %LevelToggleButton
 @onready var _total_stars_label: Label = %TotalStarsLabel
 @onready var _collection_button: Button = %CollectionButton
 @onready var _profile_button: Button = %ProfileButton
+@onready var _guide: Control = %Guide
 
 
 func _ready() -> void:
@@ -27,19 +29,19 @@ func _ready() -> void:
     _collection_button.pressed.connect(_on_collection_pressed)
     _profile_button.text = UIText.get_text("world_map.change_profile_button")
     _profile_button.pressed.connect(_on_change_profile_pressed)
+    _map_area.resized.connect(_layout_markers)
+    _guide.say(UIText.get_text("world_map.guide_hint"))
     _refresh()
 
 
 func _refresh() -> void:
-    var title_key := "world_map.title_ce2" if _viewed_level == "CE2" else "world_map.title"
-    _title_label.text = UIText.get_text(title_key)
-    var toggle_key := (
-        "world_map.review_ce1_button" if _viewed_level == "CE2" else "world_map.back_to_ce2_button"
-    )
-    _level_toggle_button.text = UIText.get_text(toggle_key)
-    _total_stars_label.text = (
-        "%s %d" % [UIText.get_text("world_map.total_stars_label"), ProgressManager.stars()]
+    var is_ce2 := _viewed_level == "CE2"
+    _backdrop.kind = "marsh" if is_ce2 else "forest"
+    _title_label.text = UIText.get_text("world_map.title_ce2" if is_ce2 else "world_map.title")
+    _level_toggle_button.text = UIText.get_text(
+        "world_map.review_ce1_button" if is_ce2 else "world_map.back_to_ce2_button"
     )
+    _total_stars_label.text = str(ProgressManager.stars())
     _populate_missions()
 
 
@@ -48,8 +50,64 @@ func _populate_missions() -> void:
         _map_area.remove_child(child)
         child.queue_free()
 
+    var index := 0
     for mission: Dictionary in ExerciseEngine.get_missions_for_level(_viewed_level):
-        _map_area.add_child(_build_marker(mission))
+        var marker: Button = MARKER_SCENE.instantiate()
+        _map_area.add_child(marker)
+        marker.set_meta("map_position", mission["map_position"])
+        marker.setup(
+            mission,
+            ProgressManager.mission_best_stars(mission["mission_id"]),
+            MissionScoring.MAX_STARS,
+            _status_label_for(mission)
+        )
+        marker.pressed.connect(_on_mission_pressed.bind(mission["mission_id"]))
+        Motion.pop_in(marker, 0.04 * index)
+        index += 1
+    _layout_markers()
+
+
+## Replace chaque lieu selon sa position fractionnelle. Les positions du
+## niveau affiche sont etalees sur toute la zone (la plus petite colle au
+## bord, la plus grande au bord oppose) : les lieux restent entierement
+## visibles et ne se chevauchent pas, quelle que soit la taille de la fenetre.
+func _layout_markers() -> void:
+    var markers: Array[Control] = []
+    var low := Vector2(INF, INF)
+    var high := Vector2(-INF, -INF)
+    for child in _map_area.get_children():
+        var control := child as Control
+        if control == null or not control.has_meta("map_position"):
+            continue
+        var fraction: Dictionary = control.get_meta("map_position")
+        var point := Vector2(float(fraction["x"]), float(fraction["y"]))
+        low = Vector2(minf(low.x, point.x), minf(low.y, point.y))
+        high = Vector2(maxf(high.x, point.x), maxf(high.y, point.y))
+        markers.append(control)
+
+    for control in markers:
+        var fraction: Dictionary = control.get_meta("map_position")
+        var free_space := _map_area.size - control.size
+        control.position = Vector2(
+            _spread(float(fraction["x"]), low.x, high.x) * maxf(free_space.x, 0.0),
+            _spread(float(fraction["y"]), low.y, high.y) * maxf(free_space.y, 0.0)
+        )
+
+
+func _spread(value: float, low: float, high: float) -> float:
+    if high - low < 0.0001:
+        return 0.5
+    return (value - low) / (high - low)
+
+
+func _status_label_for(mission: Dictionary) -> String:
+    var rule: Dictionary = ExerciseEngine.get_rule(mission["rule_id"])
+    var skill_id: String = rule.get("skill", "")
+    var skill_state := ProgressManager.get_skill_state(skill_id)
+    var status: String = skill_state["status"]
+    if status == "decouverte":
+        return ""
+    return UIText.get_text("world_map.status_%s" % status)
 
 
 ## Revient au choix du profil sans rien perdre : la progression est ecrite
@@ -68,44 +126,6 @@ func _on_level_toggle_pressed() -> void:
     _refresh()
 
 
-func _build_marker(mission: Dictionary) -> Control:
-    var button := Button.new()
-    button.autowrap_mode = TextServer.AUTOWRAP_WORD_SMART
-    button.text = (
-        "%s\n%s\n%s %d/%d"
-        % [
-            mission["title"],
-            _status_label_for(mission),
-            UIText.get_text("world_map.mission_stars_label"),
-            ProgressManager.mission_best_stars(mission["mission_id"]),
-            MissionScoring.MAX_STARS,
-        ]
-    )
-
-    var map_position: Dictionary = mission["map_position"]
-    var x: float = map_position["x"]
-    var y: float = map_position["y"]
-    button.anchor_left = x
-    button.anchor_right = x
-    button.anchor_top = y
-    button.anchor_bottom = y
-    button.offset_left = -MARKER_HALF_WIDTH
-    button.offset_right = MARKER_HALF_WIDTH
-    button.offset_top = -MARKER_HALF_HEIGHT
-    button.offset_bottom = MARKER_HALF_HEIGHT
-
-    button.pressed.connect(_on_mission_pressed.bind(mission["mission_id"]))
-    return button
-
-
-func _status_label_for(mission: Dictionary) -> String:
-    var rule: Dictionary = ExerciseEngine.get_rule(mission["rule_id"])
-    var skill_id: String = rule.get("skill", "")
-    var skill_state := ProgressManager.get_skill_state(skill_id)
-    var status: String = skill_state["status"]
-    return UIText.get_text("world_map.status_%s" % status)
-
-
 func _on_mission_pressed(mission_id: String) -> void:
     GameManager.pending_mission_id = mission_id
     GameManager.goto(GameManager.SCENE_MISSION_INTRO)

scenes/world/world_map.tscn

@@ -1,7 +1,9 @@
-[gd_scene load_steps=3 format=3]
+[gd_scene load_steps=5 format=3]
 
 [ext_resource type="Script" path="res://scenes/world/world_map.gd" id="1"]
 [ext_resource type="PackedScene" path="res://scenes/characters/guide_owl.tscn" id="2"]
+[ext_resource type="PackedScene" path="res://scenes/ui/backdrop.tscn" id="backdrop"]
+[ext_resource type="Texture2D" path="res://assets/interface/star_full.svg" id="3"]
 
 [node name="WorldMap" type="Control"]
 layout_mode = 3
@@ -12,55 +14,89 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1")
 
-[node name="Background" type="ColorRect" parent="."]
+[node name="Backdrop" parent="." instance=ExtResource("backdrop")]
+unique_name_in_owner = true
 layout_mode = 1
 anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
-color = Color(0.3, 0.52, 0.33, 1)
 
-[node name="VBox" type="VBoxContainer" parent="."]
+[node name="Margin" type="MarginContainer" parent="."]
 layout_mode = 1
 anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
+theme_override_constants/margin_left = 20
+theme_override_constants/margin_top = 14
+theme_override_constants/margin_right = 20
+theme_override_constants/margin_bottom = 10
+
+[node name="VBox" type="VBoxContainer" parent="Margin"]
+layout_mode = 2
+theme_override_constants/separation = 8
+
+[node name="TopBar" type="HBoxContainer" parent="Margin/VBox"]
+layout_mode = 2
 theme_override_constants/separation = 12
 
-[node name="TitleLabel" type="Label" parent="VBox"]
+[node name="ProfileButton" type="Button" parent="Margin/VBox/TopBar"]
 unique_name_in_owner = true
+theme_type_variation = &"SecondaryButton"
 layout_mode = 2
-theme_override_font_sizes/font_size = 32
+custom_minimum_size = Vector2(0, 52)
+
+[node name="TitleLabel" type="Label" parent="Margin/VBox/TopBar"]
+unique_name_in_owner = true
+theme_type_variation = &"HeaderTitle"
+layout_mode = 2
+size_flags_horizontal = 3
 horizontal_alignment = 1
 
-[node name="TotalStarsLabel" type="Label" parent="VBox"]
+[node name="StarsBadge" type="PanelContainer" parent="Margin/VBox/TopBar"]
+theme_type_variation = &"Pill"
+layout_mode = 2
+
+[node name="Row" type="HBoxContainer" parent="Margin/VBox/TopBar/StarsBadge"]
+layout_mode = 2
+
+[node name="StarIcon" type="TextureRect" parent="Margin/VBox/TopBar/StarsBadge/Row"]
+layout_mode = 2
+custom_minimum_size = Vector2(34, 34)
+size_flags_vertical = 4
+texture = ExtResource("3")
+expand_mode = 1
+stretch_mode = 5
+
+[node name="TotalStarsLabel" type="Label" parent="Margin/VBox/TopBar/StarsBadge/Row"]
+unique_name_in_owner = true
+theme_type_variation = &"Emphasis"
+layout_mode = 2
+
+[node name="CollectionButton" type="Button" parent="Margin/VBox/TopBar"]
 unique_name_in_owner = true
 layout_mode = 2
-horizontal_alignment = 1
+custom_minimum_size = Vector2(0, 52)
 
-[node name="MapArea" type="Control" parent="VBox"]
+[node name="MapArea" type="Control" parent="Margin/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_vertical = 3
 
-[node name="LevelToggleButton" type="Button" parent="VBox"]
-unique_name_in_owner = true
+[node name="BottomBar" type="HBoxContainer" parent="Margin/VBox"]
 layout_mode = 2
-custom_minimum_size = Vector2(0, 48)
+theme_override_constants/separation = 12
 
-[node name="CollectionButton" type="Button" parent="VBox"]
+[node name="Guide" type="Control" parent="Margin/VBox/BottomBar" instance=ExtResource("2")]
 unique_name_in_owner = true
 layout_mode = 2
-custom_minimum_size = Vector2(0, 48)
 
-[node name="ProfileButton" type="Button" parent="VBox"]
-unique_name_in_owner = true
-layout_mode = 2
-custom_minimum_size = Vector2(0, 48)
-
-[node name="Guide" type="Control" parent="VBox" instance=ExtResource("2")]
+[node name="LevelToggleButton" type="Button" parent="Margin/VBox/BottomBar"]
 unique_name_in_owner = true
+theme_type_variation = &"SecondaryButton"
 layout_mode = 2
+size_flags_vertical = 4
+custom_minimum_size = Vector2(0, 52)