natus wheel: element tooltips — Space/Air-Capacitor subtitle; score badge under square

- Add .tt-element-type italic subtitle below element title (classical name + "-Capacitor")
- Wrap element square in .tt-el-badge-col (float right, flex col) w. score beneath
- Remove inline .tt-el-body-line score from all three element branches (classic/Time/Space)
- .tt-element-type shares .tt-sign-type / .tt-house-type italic dim style

Code architected by Disco DeDisco <discodedisco@outlook.com>
Git commit message Co-Authored-By:
Claude Sonnet 4.6 <noreply@anthropic.com>

src/apps/gameboard/static/apps/gameboard/natus-wheel.js

@@ -706,8 +706,7 @@ const NatusWheel = (() => {
 
     if (CLASSIC_ELEMENTS.has(item.key)) {
       const contribs = elData.contributors || [];
-      bodyHtml = `<div class="tt-el-body-line">${vecImg} +${count} (${pct}%)</div>`;
-      bodyHtml += `<div class="tt-el-formation-header"><span class="tt-el-formation-label">Planets</span> +${contribs.length}</div>`;
+      bodyHtml = `<div class="tt-el-formation-header"><span class="tt-el-formation-label">Planets</span> +${contribs.length}</div>`;
       if (contribs.length) {
         bodyHtml += '<div class="tt-el-contribs">';
         contribs.forEach(c => {
@@ -720,7 +719,6 @@ const NatusWheel = (() => {
 
     } else if (item.key === 'Time') {
       const stellia = elData.stellia || [];
-      bodyHtml = `<div class="tt-el-body-line">${vecImg} +${count} (${pct}%)</div>`;
       if (stellia.length) {
         const isTie = stellia.length > 1;
         bodyHtml += '<div class="tt-el-contribs">';
@@ -745,7 +743,6 @@ const NatusWheel = (() => {
 
     } else if (item.key === 'Space') {
       const parades = elData.parades || [];
-      bodyHtml = `<div class="tt-el-body-line">${vecImg} +${count} (${pct}%)</div>`;
       if (parades.length) {
         bodyHtml += '<div class="tt-el-contribs">';
         parades.forEach(pd => {
@@ -778,9 +775,13 @@ const NatusWheel = (() => {
     if (_ttBody) {
       _ttBody.innerHTML =
         `<div class="tt-el-header">` +
+          `<div class="tt-el-badge-col">` +
             squareImg +
+            `<div class="tt-el-score">+${count} (${pct}%)</div>` +
+          `</div>` +
           `<span class="tt-title tt-title--el-${elKey}">${info.name}</span>` +
         `</div>` +
+        `<span class="tt-element-type">${item.key}-Capacitor</span>` +
         bodyHtml;
     }
     _positionTooltipAtItem('elements', idx);

src/static_src/scss/_natus.scss

@@ -619,6 +619,7 @@ body[class*="-light"] {
         opacity: 1;
         flex-shrink: 0;
     }
+    .tt-element-type,
     .tt-house-type,
     .tt-sign-type {
         display: block;
@@ -710,12 +711,24 @@ body[class*="-light"] {
         margin-bottom: 0.3rem;
     }
 
-    .tt-el-square {
+    .tt-el-badge-col {
         float: right;
-        display: block;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 0.2rem;
         margin-left: 0.5rem;
     }
 
+    .tt-el-square {
+        display: block;
+    }
+
+    .tt-el-score {
+        font-size: 0.7rem;
+        text-align: center;
+    }
+
     .tt-el-vec {
         display: inline;
         vertical-align: middle;