feat(ui): implement tie & trump menu, fixed some critical bugs (#52)

Co-authored-by: LQ63 <lkhermann@web.de>
Reviewed-on: #52
Co-authored-by: Janis <janis.e.20@gmx.de>
Co-committed-by: Janis <janis.e.20@gmx.de>

knockoutwhistweb/app/assets/stylesheets/main.less

@@ -33,6 +33,10 @@
     width: 100%;
     height: 100vh;
 }
+.lobby-background {
+    background-color: @background-color;
+
+}
 
 .navbar-header{
     text-align:center;
@@ -78,6 +82,10 @@ body {
     overflow: auto;
 }
 
+.navbar-drop-shadow {
+    box-shadow: 0 1px 15px 0 #000000
+}
+
 #sessions {
     display: flex;
     flex-direction: column;
@@ -228,4 +236,36 @@ body {
 }
 .score-row {
     color: #000000;
-}
+}
+
+/* In-game centered stage and blurred sides overlay */
+.ingame-stage {
+  min-height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 2rem 1rem;
+}
+
+/* Wrapper that adds a backdrop blur to the background outside the centered card */
+.blur-sides {
+  position: relative;
+}
+
+/* Create an overlay that blurs everything behind it, except the central content area */
+.blur-sides::before {
+  content: "";
+  position: fixed;
+  inset: 0;
+  pointer-events: none;
+  /* fallback: subtle vignette if backdrop-filter unsupported */
+  background: radial-gradient(ellipse at center, rgba(0,0,0,0) 30%, rgba(0,0,0,0.35) 100%);
+}
+
+@supports ((-webkit-backdrop-filter: blur(8px)) or (backdrop-filter: blur(8px))) {
+  .blur-sides::before {
+    background: rgba(0,0,0,0.08);
+    -webkit-backdrop-filter: blur(10px) saturate(110%);
+    backdrop-filter: blur(10px) saturate(110%);
+  }
+}