Condense character card content and add bottom filler space

FAQ.md

@@ -99,6 +99,10 @@ The character column now prioritizes vertical density. Roll history is represent
 
 The picker was intentionally compressed into a single compact row to minimize vertical real estate in the Play layout. When many characters exist, it scrolls horizontally instead of growing taller.
 
+## Why is there empty space below skills in the character panel?
+
+The panel now keeps card content condensed at the top and lets any remaining height expand below the skills list. This avoids stretched card sections while preserving full-height column behavior.
+
 ## Why is auth form state kept in `AuthSection` instead of `Home`?
 
 Auth inputs, validation, and submit workflows are transient UI concerns, so they now live in `AuthSection`. `Home` keeps shared session/workspace state and cross-control refresh/orchestration only.

FRONTEND_PROGRESS.md

@@ -17,6 +17,7 @@ Tracking against `UX.md` tasks and decisions.
 - Skill interactions are now row-local chip actions (edit/roll) with an inline dummy `+` row for create-skill.
 - Character picker was reduced to a compact single-row horizontal scroller to minimize vertical footprint.
 - The standalone "Last Roll" panel was removed; campaign log entries are the roll history surface.
+- Card layout now uses condensed flex stacking (instead of stretching grid tracks), with remaining character-panel height absorbed by a post-skills spacer.
 - Campaign log now auto-scrolls to the newest entry when new entries arrive.
 
 ## UX Checklist

RpgRoller/Components/Pages/HomeControls/CharacterPanel.razor

@@ -95,12 +95,9 @@
                         <span>Add skill</span>
                     </button>
                 </div>
-                @if (SelectedCharacterSkills.Count > 0)
-                {
-                    <p class="muted">Use skill chips to edit or roll directly.</p>
-                }
             </article>
         }
+        <div class="character-panel-fill" aria-hidden="true"></div>
     }
 </section>
 

RpgRoller/wwwroot/styles.css

@@ -132,7 +132,9 @@ h3 {
     border: 1px solid var(--card-border);
     border-radius: 0.8rem;
     padding: 0.7rem;
-    display: grid;
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
     gap: 0.75rem;
 }
 
@@ -298,15 +300,22 @@ select:focus-visible {
     border: 1px dashed #a89066;
     border-radius: 0.65rem;
     padding: 0.55rem;
-    display: grid;
+    display: flex;
+    flex-direction: column;
     gap: 0.45rem;
 }
 
 .app-play .character-panel {
+    min-height: 0;
     overflow-y: auto;
     overscroll-behavior: contain;
 }
 
+.character-panel-fill {
+    flex: 1 1 auto;
+    min-height: 0.1rem;
+}
+
 .log-panel {
     min-height: 0;
 }