Set hard-coded rooms order in config file

static/panel.css

@@ -47,13 +47,13 @@
 @media (prefers-color-scheme: dark) {
   :root {
     --bg: #0a0d14;
-    --card: #151a25;
+    --card: #202736;
     --edge: #232b3b;
     --ink: #eef2f9;
     --muted: #98a3b8;
     --outline: #5f6b87;
     --playing: #1f4a42;
-    --raised: #29334a;
+    --raised: #34405b;
     --scrim: rgba(4, 6, 11, .6);
     --shadow: rgba(0, 0, 0, .45);
     --shade: rgba(255, 255, 255, .05);
@@ -135,7 +135,7 @@ svg { width: 22px; height: 22px; fill: currentColor; }
 .ghost { background: transparent; border: 1px solid var(--outline); color: var(--muted); box-shadow: none; }   /* nothing to lift */
 
 @keyframes spin { to { transform: rotate(360deg); } }
-@keyframes rise { from { transform: translateY(14%); opacity: .4; } }
+@keyframes rise { from { transform: translateY(100%); opacity: .4; } }
 
 /* Header */
 
@@ -148,15 +148,6 @@ header .logo { height: 44px; width: auto; display: block; margin: var(--space-xs
 
 /* Card */
 
-/* A playing card goes to the top. order does not transition, so the swap
-   rides on a view transition instead -- see placeCards() in app.js. */
-.app > .on-top { order: -1; }
-
-::view-transition-group(*) {
-  animation-duration: .4s;
-  animation-timing-function: cubic-bezier(.22, 1, .36, 1);
-}
-
 .card {
   background: var(--card);
   border-radius: var(--radius-xl);