Show handicap separately from handicap bonus

Adapt to Goban change in online-go/goban#146 and show
the actual handicap stones for black separately from the handicap bonus.

To make it clear that this handicap field is not part of the score:

- Use a `<hr/>` to separate it
- Add `+` in front of scores that are supposed to sum together.

Also move white's handicap bonus to the end, after komi.
- This means that there's always a `+` in front of it, even at the beginning of
  the game, so it's implicitly clear that there's a bonus.
- I considered changing the text to `Handicap Bonus` but that wrapped.

Relates to online-go#1469

src/views/Game/PlayerCards.tsx

@@ -479,36 +479,59 @@ function ScorePopup({ show, goban, color }: ScorePopupProps) {
     const scores = goban.engine.computeScore(false);
     const { stones, prisoners, handicap, komi, territory } = scores[color];
 
+    let first_points = 0;
     return (
         <div className="score_breakdown">
+            {color === "black" && !!goban.engine.handicap && (
+                <div>
+                    <span>{_("Handicap")}</span>
+                    <div>{goban.engine.handicap}</div>
+                    <hr />
+                </div>
+            )}
             {!!stones && (
                 <div>
                     <span>{_("Stones")}</span>
-                    <div>{stones}</div>
+                    <div>
+                        {first_points++ ? "+" : ""}
+                        {stones}
+                    </div>
                 </div>
             )}
             {!!territory && (
                 <div>
                     <span>{_("Territory")}</span>
-                    <div>{territory}</div>
+                    <div>
+                        {first_points++ ? "+" : ""}
+                        {territory}
+                    </div>
                 </div>
             )}
             {!!prisoners && (
                 <div>
                     <span>{_("Prisoners")}</span>
-                    <div>{prisoners}</div>
+                    <div>
+                        {first_points++ ? "+" : ""}
+                        {prisoners}
+                    </div>
                 </div>
             )}
-            {!!handicap && (
+            {!!komi && (
                 <div>
-                    <span>{_("Handicap")}</span>
-                    <div>{handicap}</div>
+                    <span>{_("Komi")}</span>
+                    <div>
+                        {first_points++ ? "+" : ""}
+                        {komi}
+                    </div>
                 </div>
             )}
-            {!!komi && (
+            {!!handicap && (
                 <div>
-                    <span>{_("Komi")}</span>
-                    <div>{komi}</div>
+                    <span>{_("Handicap")}</span>
+                    <div>
+                        {first_points++ ? "+" : ""}
+                        {handicap}
+                    </div>
                 </div>
             )}
             {!stones && !territory && !handicap && !komi && (