fix(frontend): restore Ref document and control contracts

Ref's `.bg0/.bg1/.bg2` set only a background image and `html, body` centre the
texture with vertical tiling, so the extra background colours and the default
tiling are removed. Two ranking views declared unscoped `body` rules that leaked
a 500px min-width and a 21px line-height onto every screen; each page now owns
its own contract. Controls that Ref renders with the Bootstrap/Lumen family get
the shared modifier so the bottom edge moves on hover and while pressed.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

app/game-frontend/src/views/NationSecretView.vue

@@ -196,12 +196,16 @@ th,
     text-align: center;
     font-weight: 400;
 }
+/* Ref Lumen primary: no top border, 1px sides, 4px bottom that shortens. */
 .close-button {
     height: 35.5px;
     padding: 5.25px 10.5px;
-    border: 1px solid transparent;
-    border-radius: 3.5px;
+    border-color: #325172;
+    border-style: solid;
+    border-width: 0 1px 4px;
+    border-radius: 5.25px;
     background: rgb(55, 90, 127);
+    vertical-align: middle;
     color: #fff;
     font-weight: 700;
     line-height: 21px;
@@ -212,6 +216,16 @@ th,
         border-color 0.15s,
         box-shadow 0.15s;
 }
+.close-button:not(:disabled):hover {
+    margin-top: 1px;
+    border-bottom-width: 3px;
+}
+
+.close-button:not(:disabled):active {
+    margin-top: 2px;
+    border-bottom-width: 2px;
+}
+
 input[type='submit'] {
     cursor: pointer;
     padding: 1px 6px;