diff --git a/android/app/src/main/res/drawable/button_primary.xml b/android/app/src/main/res/drawable/button_primary.xml
index 465d5c3..921e383 100644
--- a/android/app/src/main/res/drawable/button_primary.xml
+++ b/android/app/src/main/res/drawable/button_primary.xml
@@ -3,7 +3,7 @@
     android:color="#2563EB">
     <item>
         <shape android:shape="rectangle">
-            <solid android:color="#3B82F6" />
+            <solid android:color="#e65c00" />
             <corners android:radius="8dp" />
         </shape>
     </item>
diff --git a/android/app/src/main/res/drawable/ic_remote_view.xml b/android/app/src/main/res/drawable/ic_remote_view.xml
index 692ce44..c3206b7 100644
--- a/android/app/src/main/res/drawable/ic_remote_view.xml
+++ b/android/app/src/main/res/drawable/ic_remote_view.xml
@@ -1,6 +1,6 @@
 <vector xmlns:android="http://schemas.android.com/apk/res/android"
     android:width="40dp" android:height="40dp" android:viewportWidth="24" android:viewportHeight="24">
-    <path android:fillColor="#3B82F6" android:pathData="M3,4h18a1,1 0,0 1,1 1v11a1,1 0,0 1,-1 1H3a1,1 0,0 1,-1 -1V5a1,1 0,0 1,1 -1zM3,6v9h18V6z" />
-    <path android:fillColor="#3B82F6" android:pathData="M8,20h8v2H8z" />
+    <path android:fillColor="#e65c00" android:pathData="M3,4h18a1,1 0,0 1,1 1v11a1,1 0,0 1,-1 1H3a1,1 0,0 1,-1 -1V5a1,1 0,0 1,1 -1zM3,6v9h18V6z" />
+    <path android:fillColor="#e65c00" android:pathData="M8,20h8v2H8z" />
     <path android:fillColor="#93C5FD" android:pathData="M12,10.5m-2.5,0a2.5,2.5 0,1 1,5 0a2.5,2.5 0,1 1,-5 0" />
 </vector>
diff --git a/android/app/src/main/res/layout/activity_main.xml b/android/app/src/main/res/layout/activity_main.xml
index 35c57a9..41bfca2 100644
--- a/android/app/src/main/res/layout/activity_main.xml
+++ b/android/app/src/main/res/layout/activity_main.xml
@@ -56,7 +56,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:text="RemoteDisplay"
-            android:textColor="#3B82F6"
+            android:textColor="#e65c00"
             android:textSize="28sp"
             android:textStyle="bold"
             android:layout_marginBottom="8dp" />
diff --git a/android/app/src/main/res/layout/activity_owner_accessibility.xml b/android/app/src/main/res/layout/activity_owner_accessibility.xml
index a45c8ef..68550cf 100644
--- a/android/app/src/main/res/layout/activity_owner_accessibility.xml
+++ b/android/app/src/main/res/layout/activity_owner_accessibility.xml
@@ -190,7 +190,7 @@
                     android:clickable="false"
                     android:focusable="false"
                     android:thumbTint="#FFFFFF"
-                    android:trackTint="#3B82F6" />
+                    android:trackTint="#e65c00" />
 
                 <Button
                     android:id="@+id/openA11yBtn"
diff --git a/android/app/src/main/res/layout/activity_provisioning.xml b/android/app/src/main/res/layout/activity_provisioning.xml
index cbb5b4d..55b3d85 100644
--- a/android/app/src/main/res/layout/activity_provisioning.xml
+++ b/android/app/src/main/res/layout/activity_provisioning.xml
@@ -23,7 +23,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:text="RemoteDisplay"
-            android:textColor="#3B82F6"
+            android:textColor="#e65c00"
             android:textSize="22sp"
             android:textStyle="bold"
             android:layout_marginBottom="4dp" />
@@ -111,7 +111,7 @@
                 android:layout_width="match_parent"
                 android:layout_height="96dp"
                 android:text="------"
-                android:textColor="#3B82F6"
+                android:textColor="#e65c00"
                 android:textStyle="bold"
                 android:fontFamily="monospace"
                 android:letterSpacing="0.3"
diff --git a/android/app/src/main/res/layout/activity_setup.xml b/android/app/src/main/res/layout/activity_setup.xml
index c65d28b..cd5e749 100644
--- a/android/app/src/main/res/layout/activity_setup.xml
+++ b/android/app/src/main/res/layout/activity_setup.xml
@@ -24,7 +24,7 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="RemoteDisplay Setup"
-        android:textColor="#3B82F6"
+        android:textColor="#e65c00"
         android:textSize="12sp"
         android:textStyle="bold"
         android:layout_marginBottom="3dp" />
diff --git a/android/app/src/main/res/values/colors.xml b/android/app/src/main/res/values/colors.xml
index c03baaa..ac6a74e 100644
--- a/android/app/src/main/res/values/colors.xml
+++ b/android/app/src/main/res/values/colors.xml
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <color name="ic_launcher_background">#111827</color>
-    <color name="ic_launcher_foreground">#3B82F6</color>
+    <color name="ic_launcher_foreground">#e65c00</color>
 </resources>
diff --git a/android/app/src/main/res/values/themes.xml b/android/app/src/main/res/values/themes.xml
index e9a50ae..6befeac 100644
--- a/android/app/src/main/res/values/themes.xml
+++ b/android/app/src/main/res/values/themes.xml
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <style name="Theme.RemoteDisplay" parent="Theme.MaterialComponents.DayNight.NoActionBar">
-        <item name="colorPrimary">#3B82F6</item>
+        <item name="colorPrimary">#e65c00</item>
         <item name="colorPrimaryVariant">#2563EB</item>
         <item name="colorSecondary">#1E293B</item>
         <item name="android:windowBackground">#111827</item>
diff --git a/fix_fonts_emojis.js b/fix_fonts_emojis.js
new file mode 100644
index 0000000..9b0efeb
--- /dev/null
+++ b/fix_fonts_emojis.js
@@ -0,0 +1,79 @@
+const fs = require('fs');
+const path = require('path');
+
+// 1. Fix reset.css
+let resetCss = fs.readFileSync('frontend/css/reset.css', 'utf-8');
+resetCss = resetCss.replace(
+  "font-family: 'Michroma', sans-serif;",
+  "font-family: 'Michroma', sans-serif;\n  font-weight: 400;"
+);
+resetCss = resetCss.replace(
+  "h1, h2, h3, h4, h5, h6 { font-family: 'Goldman', sans-serif; }",
+  "h1, h2, h3, h4, h5, h6 { font-family: 'Goldman', sans-serif; font-weight: 700; }"
+);
+fs.writeFileSync('frontend/css/reset.css', resetCss);
+
+// 2. Fix landing.html fonts and emojis
+let landing = fs.readFileSync('frontend/landing.html', 'utf-8');
+if (!landing.includes('font-awesome')) {
+  landing = landing.replace(
+    '</head>',
+    '  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">\n</head>'
+  );
+}
+// Add fonts
+if (!landing.includes('Michroma')) {
+  landing = landing.replace(
+    '</head>',
+    '  <link rel="preconnect" href="https://fonts.googleapis.com">\n  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>\n  <link href="https://fonts.googleapis.com/css2?family=Goldman:wght@700&family=Michroma:wght@400&display=swap" rel="stylesheet">\n</head>'
+  );
+}
+
+// Replace emojis with fontawesome icons manually based on the context
+const emojiMap = {
+  '&#128250;': '<i class="fa-solid fa-tv"></i>',
+  '&#127916;': '<i class="fa-solid fa-border-all"></i>',
+  '&#128421;': '<i class="fa-solid fa-desktop"></i>',
+  '&#128197;': '<i class="fa-regular fa-calendar"></i>',
+  '&#127926;': '<i class="fa-solid fa-list"></i>',
+  '&#127970;': '<i class="fa-solid fa-building"></i>',
+  '&#128295;': '<i class="fa-solid fa-wrench"></i>',
+  '&#128433;': '<i class="fa-solid fa-hand-pointer"></i>',
+  '&#128202;': '<i class="fa-solid fa-chart-line"></i>',
+  '&#128276;': '<i class="fa-solid fa-bell"></i>',
+  '&#128268;': '<i class="fa-solid fa-plug-circle-xmark"></i>',
+  '&#128241;': '<i class="fa-solid fa-mobile-screen"></i>',
+  '&#128274;': '<i class="fa-solid fa-server"></i>',
+  '&#127912;': '<i class="fa-solid fa-palette"></i>',
+  '&#128101;': '<i class="fa-solid fa-users"></i>',
+  '&#128260;': '<i class="fa-solid fa-arrows-rotate"></i>',
+  '&#128722;': '<i class="fa-solid fa-cart-shopping"></i>',
+  '&#127869;': '<i class="fa-solid fa-utensils"></i>',
+  '&#127979;': '<i class="fa-solid fa-graduation-cap"></i>',
+  '&#127973;': '<i class="fa-solid fa-notes-medical"></i>',
+  '&#9962;': '<i class="fa-solid fa-church"></i>',
+  '&#127947;': '<i class="fa-solid fa-dumbbell"></i>',
+  '&#129302;': '<i class="fa-brands fa-android"></i>',
+  '&#128293;': '<i class="fa-brands fa-amazon"></i>',
+  '&#129359;': '<i class="fa-brands fa-raspberry-pi"></i>',
+  '&#128187;': '<i class="fa-brands fa-windows"></i>',
+  '&#127760;': '<i class="fa-brands fa-chrome"></i>'
+};
+
+for (const [emoji, icon] of Object.entries(emojiMap)) {
+  landing = landing.split(emoji).join(icon);
+}
+
+// Add CSS to landing page for fonts
+landing = landing.replace(
+  '</style>',
+  `  body { font-family: 'Michroma', sans-serif; font-weight: 400; }
+  h1, h2, h3, h4, h5, h6, .brand { font-family: 'Goldman', sans-serif; font-weight: 700; }
+  .feature-icon { font-size: 32px; color: var(--accent); margin-bottom: 16px; }
+  .platform-item .icon { font-size: 32px; color: var(--accent); margin-bottom: 8px; }
+  </style>`
+);
+
+fs.writeFileSync('frontend/landing.html', landing);
+
+console.log('Fixed fonts and emojis');
diff --git a/fix_landing.js b/fix_landing.js
new file mode 100644
index 0000000..83c7de9
--- /dev/null
+++ b/fix_landing.js
@@ -0,0 +1,20 @@
+const fs = require('fs');
+
+let landing = fs.readFileSync('frontend/landing.html', 'utf-8');
+
+// Replace '$' with '€' in the specific lines
+landing = landing.replace('$1,188', '€1,188');
+landing = landing.replace('$1,440+', '€1,440+');
+landing = landing.replace('$3,600+', '€3,600+');
+landing = landing.replace('$1,800+', '€1,800+');
+landing = landing.replace("? '$' + p.price_monthly", "? '€' + p.price_monthly");
+landing = landing.replace('or $$', 'or €$'); // Actually it's or $${p.price_yearly}, so it becomes or €${p.price_yearly}
+
+// Remove "ScreenTinker" from the header
+landing = landing.replace(
+  '<span class="nav-logo-text" style="margin-left: 8px;">ScreenTinker</span>',
+  ''
+);
+
+fs.writeFileSync('frontend/landing.html', landing);
+console.log('Fixed landing.html');
diff --git a/frontend/css/main.css b/frontend/css/main.css
index 4d078f4..81f5bf1 100644
--- a/frontend/css/main.css
+++ b/frontend/css/main.css
@@ -3,15 +3,32 @@ body {
   display: flex;
   overflow: hidden;
   font-family: 'Michroma', sans-serif;
+  font-weight: 400;
 }
 
-h1, h2, h3, h4, h5, h6, .logo {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+.logo {
   font-family: 'Goldman', sans-serif;
+  font-weight: 700;
 }
 
 /* Responsiveness Utility Classes */
-@media (max-width: 767px) { .show-on-desktop { display: none !important; } }
-@media (min-width: 768px) { .show-on-mobile { display: none !important; } }
+@media (max-width: 767px) {
+  .show-on-desktop {
+    display: none !important;
+  }
+}
+
+@media (min-width: 768px) {
+  .show-on-mobile {
+    display: none !important;
+  }
+}
 
 .sidebar {
   width: var(--sidebar-width);
@@ -44,154 +61,347 @@ h1, h2, h3, h4, h5, h6, .logo {
 /* Workspace switcher (Phase 3 MVP). Sits in sidebar-header below the logo.
    Three render modes via JS: dropdown (>1 ws), static text (1 ws),
    muted empty state (0 ws). */
-.workspace-switcher { position: relative; margin-top: 12px; }
+.workspace-switcher {
+  position: relative;
+  margin-top: 12px;
+}
+
 .workspace-switcher-button {
-  display: flex; align-items: center; justify-content: space-between;
-  width: 100%; padding: 8px 10px;
-  background: var(--bg-card); border: 1px solid var(--border);
-  border-radius: var(--radius); color: var(--text-primary);
-  font-size: 13px; cursor: pointer; transition: all var(--transition);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  padding: 8px 10px;
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  color: var(--text-primary);
+  font-size: 13px;
+  cursor: pointer;
+  transition: all var(--transition);
 }
-.workspace-switcher-button:hover { border-color: var(--accent); }
+
+.workspace-switcher-button:hover {
+  border-color: var(--accent);
+}
+
 .workspace-switcher-static {
-  display: block; padding: 4px 2px;
-  color: var(--text-primary); font-size: 13px; font-weight: 500;
+  display: block;
+  padding: 4px 2px;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 500;
 }
+
 .workspace-switcher-static::before {
   content: 'Workspace';
   display: block;
-  font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px;
-  color: var(--text-muted); margin-bottom: 2px;
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-muted);
+  margin-bottom: 2px;
 }
+
 .workspace-switcher-empty {
-  display: block; padding: 8px 10px;
-  color: var(--text-muted); font-size: 12px; font-style: italic;
+  display: block;
+  padding: 8px 10px;
+  color: var(--text-muted);
+  font-size: 12px;
+  font-style: italic;
 }
+
 /* #19: single-workspace view - name + always-visible manage icons (no dropdown). */
-.workspace-switcher-single { display: flex; align-items: center; gap: 4px; }
-.workspace-switcher-single .workspace-switcher-static { flex: 1; min-width: 0; }
+.workspace-switcher-single {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.workspace-switcher-single .workspace-switcher-static {
+  flex: 1;
+  min-width: 0;
+}
+
 .workspace-switcher-single .workspace-switcher-members,
-.workspace-switcher-single .workspace-switcher-pencil { visibility: visible; align-self: end; }
+.workspace-switcher-single .workspace-switcher-pencil {
+  visibility: visible;
+  align-self: end;
+}
+
 .workspace-switcher-button .chev {
-  flex-shrink: 0; margin-left: 8px; color: var(--text-muted);
+  flex-shrink: 0;
+  margin-left: 8px;
+  color: var(--text-muted);
   transition: transform var(--transition);
 }
-.workspace-switcher.open .chev { transform: rotate(180deg); }
+
+.workspace-switcher.open .chev {
+  transform: rotate(180deg);
+}
+
 .workspace-switcher-menu {
   display: none;
   /* Width: detach from the narrow sidebar-header (188px content width). The
      sidebar is z-indexed and the dropdown is free to extend beyond the
      sidebar into the main content area. min/max bounds keep it readable
      for normal-length names without sprawling on extreme cases. */
-  position: absolute; top: calc(100% + 4px); left: 0;
-  min-width: 280px; max-width: 360px;
-  background: var(--bg-card); border: 1px solid var(--border);
-  border-radius: var(--radius); box-shadow: 0 4px 12px rgba(0,0,0,0.3);
-  max-height: 360px; padding: 4px 0; overflow-y: auto; z-index: 100;
+  position: absolute;
+  top: calc(100% + 4px);
+  left: 0;
+  min-width: 280px;
+  max-width: 360px;
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+  max-height: 360px;
+  padding: 4px 0;
+  overflow-y: auto;
+  z-index: 100;
 }
-.workspace-switcher.open .workspace-switcher-menu { display: block; }
+
+.workspace-switcher.open .workspace-switcher-menu {
+  display: block;
+}
+
 /* #16: sticky type-to-filter search header inside the (scrolling) menu. */
 .workspace-switcher-search {
-  position: sticky; top: 0; z-index: 1;
-  background: var(--bg-card); padding: 8px;
+  position: sticky;
+  top: 0;
+  z-index: 1;
+  background: var(--bg-card);
+  padding: 8px;
   border-bottom: 1px solid var(--border);
 }
+
 .workspace-switcher-search input {
-  width: 100%; box-sizing: border-box; padding: 6px 8px;
-  background: var(--bg-input); border: 1px solid var(--border);
-  border-radius: var(--radius); color: var(--text-primary); font-size: 13px;
+  width: 100%;
+  box-sizing: border-box;
+  padding: 6px 8px;
+  background: var(--bg-input);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  color: var(--text-primary);
+  font-size: 13px;
 }
-.workspace-switcher-search input:focus { outline: none; border-color: var(--accent); }
+
+.workspace-switcher-search input:focus {
+  outline: none;
+  border-color: var(--accent);
+}
+
 .workspace-switcher-noresults {
-  padding: 12px; color: var(--text-muted); font-size: 13px; text-align: center;
+  padding: 12px;
+  color: var(--text-muted);
+  font-size: 13px;
+  text-align: center;
 }
+
 .workspace-switcher-item {
-  display: flex; align-items: center; gap: 8px;
-  padding: 8px 12px; cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 12px;
+  cursor: pointer;
   border-bottom: 1px solid var(--border);
-  color: var(--text-primary); font-size: 13px;
+  color: var(--text-primary);
+  font-size: 13px;
 }
-.workspace-switcher-item:last-child { border-bottom: none; }
-.workspace-switcher-item:hover { background: var(--bg-input); }
+
+.workspace-switcher-item:last-child {
+  border-bottom: none;
+}
+
+.workspace-switcher-item:hover {
+  background: var(--bg-input);
+}
+
 /* keyboard-cursor highlight (arrow keys) - same surface as hover */
-.workspace-switcher-item.highlighted { background: var(--bg-input); }
-.workspace-switcher-item.current { font-weight: 600; }
+.workspace-switcher-item.highlighted {
+  background: var(--bg-input);
+}
+
+.workspace-switcher-item.current {
+  font-weight: 600;
+}
+
 .workspace-switcher-item .check {
-  flex-shrink: 0; color: var(--accent); width: 14px;
+  flex-shrink: 0;
+  color: var(--accent);
+  width: 14px;
 }
-.workspace-switcher-item .ws-meta { flex: 1; min-width: 0; }
+
+.workspace-switcher-item .ws-meta {
+  flex: 1;
+  min-width: 0;
+}
+
 .workspace-switcher-item .ws-name {
-  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
+
 .workspace-switcher-item .ws-org {
-  font-size: 11px; color: var(--text-muted); margin-top: 1px;
+  font-size: 11px;
+  color: var(--text-muted);
+  margin-top: 1px;
   /* nowrap + ellipsis: long "Org Name . N devices" lines truncate cleanly
      instead of wrapping onto a second line that doubles row height. */
-  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
+
 .workspace-switcher-pencil {
-  flex-shrink: 0; visibility: hidden;
-  background: none; border: none; padding: 4px;
-  color: var(--text-muted); cursor: pointer;
-  border-radius: 4px; transition: all var(--transition);
+  flex-shrink: 0;
+  visibility: hidden;
+  background: none;
+  border: none;
+  padding: 4px;
+  color: var(--text-muted);
+  cursor: pointer;
+  border-radius: 4px;
+  transition: all var(--transition);
 }
-.workspace-switcher-item:hover .workspace-switcher-pencil { visibility: visible; }
-.workspace-switcher-pencil:hover { color: var(--accent); background: var(--bg-input); }
+
+.workspace-switcher-item:hover .workspace-switcher-pencil {
+  visibility: visible;
+}
+
+.workspace-switcher-pencil:hover {
+  color: var(--accent);
+  background: var(--bg-input);
+}
+
 /* Members icon - same shape as the pencil; navigates to #/workspace/:id/members. */
 .workspace-switcher-members {
-  flex-shrink: 0; visibility: hidden;
-  background: none; border: none; padding: 4px;
-  color: var(--text-muted); cursor: pointer;
-  border-radius: 4px; transition: all var(--transition);
+  flex-shrink: 0;
+  visibility: hidden;
+  background: none;
+  border: none;
+  padding: 4px;
+  color: var(--text-muted);
+  cursor: pointer;
+  border-radius: 4px;
+  transition: all var(--transition);
+}
+
+.workspace-switcher-item:hover .workspace-switcher-members {
+  visibility: visible;
+}
+
+.workspace-switcher-members:hover {
+  color: var(--accent);
+  background: var(--bg-input);
 }
-.workspace-switcher-item:hover .workspace-switcher-members { visibility: visible; }
-.workspace-switcher-members:hover { color: var(--accent); background: var(--bg-input); }
 
 /* Workspace members page (Phase 2 user-mgmt, slice 2A read-only). Three
    sections render via JS: direct members, via_org access, pending invites.
    Row layout mirrors the sidebar user card's avatar pattern for visual
    continuity. via_org rows are opacity-reduced and invite rows use the
    input-bg shade so the three states are distinguishable at a glance. */
-.members-list { display: flex; flex-direction: column; gap: 4px; }
-.member-row {
-  display: flex; align-items: center; gap: 12px;
-  padding: 10px 12px; border: 1px solid var(--border);
-  border-radius: var(--radius); background: var(--bg-card);
+.members-list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
 }
-.member-row--via-org { opacity: 0.75; }
-.member-row--invited { background: var(--bg-input); }
+
+.member-row {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 10px 12px;
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  background: var(--bg-card);
+}
+
+.member-row--via-org {
+  opacity: 0.75;
+}
+
+.member-row--invited {
+  background: var(--bg-input);
+}
+
 .member-avatar {
   flex-shrink: 0;
-  width: 32px; height: 32px; border-radius: 50%;
-  background: var(--accent); color: white;
-  display: flex; align-items: center; justify-content: center;
-  font-size: 13px; font-weight: 600;
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  background: var(--accent);
+  color: white;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 13px;
+  font-weight: 600;
 }
-.member-avatar--muted { background: var(--text-muted); }
-.member-meta { flex: 1; min-width: 0; }
+
+.member-avatar--muted {
+  background: var(--text-muted);
+}
+
+.member-meta {
+  flex: 1;
+  min-width: 0;
+}
+
 .member-name {
-  font-size: 13px; font-weight: 500; color: var(--text-primary);
-  display: flex; align-items: center; gap: 8px;
-  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--text-primary);
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
+
 .member-email {
-  font-size: 11px; color: var(--text-muted); margin-top: 1px;
-  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  font-size: 11px;
+  color: var(--text-muted);
+  margin-top: 1px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
+
 .member-role {
-  flex-shrink: 0; font-size: 12px; color: var(--text-secondary);
-  padding: 4px 8px; background: var(--bg-input);
-  border-radius: 4px; min-width: 60px; text-align: center;
+  flex-shrink: 0;
+  font-size: 12px;
+  color: var(--text-secondary);
+  padding: 4px 8px;
+  background: var(--bg-input);
+  border-radius: 4px;
+  min-width: 60px;
+  text-align: center;
 }
+
 .member-detail {
-  flex-shrink: 0; font-size: 11px; color: var(--text-muted);
-  min-width: 110px; text-align: right;
+  flex-shrink: 0;
+  font-size: 11px;
+  color: var(--text-muted);
+  min-width: 110px;
+  text-align: right;
 }
-.member-via-org { font-style: italic; }
+
+.member-via-org {
+  font-style: italic;
+}
+
 .member-badge {
-  font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px;
-  padding: 2px 6px; background: var(--bg-input); color: var(--text-muted);
-  border-radius: 3px; font-weight: 600;
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  padding: 2px 6px;
+  background: var(--bg-input);
+  color: var(--text-muted);
+  border-radius: 3px;
+  font-weight: 600;
 }
 
 /* Slice 2B - mutation affordances. .member-actions is the cell that holds
@@ -199,24 +409,49 @@ h1, h2, h3, h4, h5, h6, .logo {
    rows). via_org rows omit the cell entirely. The role select replaces the
    .member-role div for admins on direct-member rows. */
 .member-role-select {
-  flex-shrink: 0; font-size: 12px;
-  background: var(--bg-input); color: var(--text-primary);
-  border: 1px solid var(--border); border-radius: 4px;
-  padding: 4px 8px; min-width: 90px; cursor: pointer;
+  flex-shrink: 0;
+  font-size: 12px;
+  background: var(--bg-input);
+  color: var(--text-primary);
+  border: 1px solid var(--border);
+  border-radius: 4px;
+  padding: 4px 8px;
+  min-width: 90px;
+  cursor: pointer;
 }
-.member-role-select:hover { border-color: var(--accent); }
+
+.member-role-select:hover {
+  border-color: var(--accent);
+}
+
 .member-actions {
-  flex-shrink: 0; display: flex; align-items: center; gap: 4px;
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  gap: 4px;
   margin-left: 4px;
 }
+
 .member-action-btn {
-  display: inline-flex; align-items: center; justify-content: center;
-  background: none; border: none; padding: 6px;
-  color: var(--text-muted); cursor: pointer;
-  border-radius: 4px; transition: all var(--transition);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: none;
+  border: none;
+  padding: 6px;
+  color: var(--text-muted);
+  cursor: pointer;
+  border-radius: 4px;
+  transition: all var(--transition);
+}
+
+.member-action-btn:hover {
+  background: var(--bg-input);
+}
+
+.member-action-btn--danger:hover {
+  color: var(--danger);
 }
-.member-action-btn:hover { background: var(--bg-input); }
-.member-action-btn--danger:hover { color: var(--danger); }
 
 .nav-links {
   flex: 1;
@@ -288,16 +523,42 @@ h1, h2, h3, h4, h5, h6, .logo {
   flex-shrink: 0;
 }
 
-.status-dot.online { background: var(--success); box-shadow: 0 0 6px var(--success); }
-.status-dot.offline { background: var(--danger); }
-.status-dot.provisioning { background: var(--warning); animation: pulse 2s infinite; }
+.status-dot.online {
+  background: var(--success);
+  box-shadow: 0 0 6px var(--success);
+}
+
+.status-dot.offline {
+  background: var(--danger);
+}
+
+.status-dot.provisioning {
+  background: var(--warning);
+  animation: pulse 2s infinite;
+}
+
 /* v4 liveness (server-derived): healthy=green, degraded=amber+pulse (reconnecting), offline=red (above) */
-.status-dot.healthy { background: var(--success); box-shadow: 0 0 6px var(--success); }
-.status-dot.degraded { background: var(--warning); box-shadow: 0 0 6px var(--warning); animation: pulse 2s infinite; }
+.status-dot.healthy {
+  background: var(--success);
+  box-shadow: 0 0 6px var(--success);
+}
+
+.status-dot.degraded {
+  background: var(--warning);
+  box-shadow: 0 0 6px var(--warning);
+  animation: pulse 2s infinite;
+}
 
 @keyframes pulse {
-  0%, 100% { opacity: 1; }
-  50% { opacity: 0.4; }
+
+  0%,
+  100% {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0.4;
+  }
 }
 
 .content {
@@ -349,6 +610,7 @@ h1, h2, h3, h4, h5, h6, .logo {
   align-items: center;
   gap: 6px;
 }
+
 .btn:active {
   transform: scale(0.98);
 }
@@ -456,13 +718,14 @@ h1, h2, h3, h4, h5, h6, .logo {
   display: flex;
   align-items: center;
   gap: 6px;
-  background: rgba(0,0,0,0.7);
+  background: rgba(0, 0, 0, 0.7);
   backdrop-filter: blur(4px);
   padding: 4px 10px;
   border-radius: 20px;
   font-size: 11px;
   font-weight: 500;
 }
+
 /* Device cards render the reused liveness pill (.device-status-badge from device-detail), which brings
    its own bg/padding/shape — so neutralize the dark wrapper for those. Wall cards keep the dark pill
    above for their "NxN wall" label (they share .device-card-status but have no .is-liveness). */
@@ -472,9 +735,10 @@ h1, h2, h3, h4, h5, h6, .logo {
   padding: 0;
   border-radius: 0;
 }
+
 /* Lift the list pill off the screenshot so it stays legible over any image. */
 .device-card-status.is-liveness .device-status-badge {
-  box-shadow: 0 1px 4px rgba(0,0,0,0.6);
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
 }
 
 .device-card-select {
@@ -482,7 +746,7 @@ h1, h2, h3, h4, h5, h6, .logo {
   top: 8px;
   left: 8px;
   z-index: 5;
-  background: rgba(0,0,0,0.6);
+  background: rgba(0, 0, 0, 0.6);
   border-radius: 4px;
   padding: 3px 5px;
   display: flex;
@@ -491,10 +755,21 @@ h1, h2, h3, h4, h5, h6, .logo {
   opacity: 0;
   transition: opacity 0.15s;
 }
+
 .device-card:hover .device-card-select,
-.device-card.selected .device-card-select { opacity: 1; }
-.device-card-select input { cursor: pointer; margin: 0; }
-.device-card.selected { outline: 2px solid var(--primary, #3B82F6); outline-offset: -2px; }
+.device-card.selected .device-card-select {
+  opacity: 1;
+}
+
+.device-card-select input {
+  cursor: pointer;
+  margin: 0;
+}
+
+.device-card.selected {
+  outline: 2px solid var(--primary, #e65c00);
+  outline-offset: -2px;
+}
 
 /* Wall editor — free-form pan/zoom canvas */
 .wall-viewport {
@@ -503,11 +778,15 @@ h1, h2, h3, h4, h5, h6, .logo {
   cursor: grab;
   user-select: none;
   background:
-    linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px) 0 0 / 40px 40px,
-    linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px) 0 0 / 40px 40px,
+    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0 0 / 40px 40px,
+    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0 0 / 40px 40px,
     var(--bg-primary);
 }
-.wall-viewport.panning { cursor: grabbing; }
+
+.wall-viewport.panning {
+  cursor: grabbing;
+}
+
 /* Inner canvas: a 0×0 anchor whose CSS transform supplies pan + zoom.
    All rect children are absolutely positioned in canvas-data coordinates
    and inherit the parent transform. transform-origin is the canvas's
@@ -521,11 +800,12 @@ h1, h2, h3, h4, h5, h6, .logo {
   transform-origin: 0 0;
   /* Disable transition so panning doesn't lag behind the cursor */
 }
+
 .wall-zoom-readout {
   position: absolute;
   bottom: 8px;
   right: 12px;
-  background: rgba(0,0,0,0.65);
+  background: rgba(0, 0, 0, 0.65);
   color: #fff;
   padding: 3px 8px;
   border-radius: 12px;
@@ -536,8 +816,8 @@ h1, h2, h3, h4, h5, h6, .logo {
 
 .wall-screen {
   position: absolute;
-  background: rgba(59,130,246,0.08);
-  border: 2px solid var(--primary, #3B82F6);
+  background: rgba(59, 130, 246, 0.08);
+  border: 2px solid var(--primary, #e65c00);
   border-radius: 4px;
   box-sizing: border-box;
   cursor: move;
@@ -545,13 +825,15 @@ h1, h2, h3, h4, h5, h6, .logo {
   touch-action: none;
   overflow: hidden;
 }
+
 .wall-screen-overlap {
   position: absolute;
-  background: rgba(96,165,250,0.35);
+  background: rgba(96, 165, 250, 0.35);
   pointer-events: none;
   display: none;
   z-index: 1;
 }
+
 .wall-screen-label {
   position: absolute;
   top: 4px;
@@ -560,23 +842,26 @@ h1, h2, h3, h4, h5, h6, .logo {
   pointer-events: none;
   z-index: 2;
 }
+
 .wall-screen-name {
   font-size: 12px;
   font-weight: 600;
   color: var(--text-primary, #fff);
-  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
 .wall-screen-meta {
   display: flex;
   align-items: center;
   gap: 6px;
   font-size: 10px;
   color: var(--text-muted);
-  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
 }
+
 .wall-screen-remove {
   position: absolute;
   top: 4px;
@@ -584,7 +869,7 @@ h1, h2, h3, h4, h5, h6, .logo {
   z-index: 3;
   width: 20px;
   height: 20px;
-  background: rgba(0,0,0,0.6);
+  background: rgba(0, 0, 0, 0.6);
   color: #fff;
   border: none;
   border-radius: 50%;
@@ -593,11 +878,14 @@ h1, h2, h3, h4, h5, h6, .logo {
   line-height: 1;
   padding: 0;
 }
-.wall-screen-remove:hover { background: var(--danger, #ef4444); }
+
+.wall-screen-remove:hover {
+  background: var(--danger, #ef4444);
+}
 
 .wall-player {
   position: absolute;
-  background: rgba(96,165,250,0.18);
+  background: rgba(96, 165, 250, 0.18);
   border: 2px dashed #60a5fa;
   border-radius: 4px;
   box-sizing: border-box;
@@ -605,15 +893,17 @@ h1, h2, h3, h4, h5, h6, .logo {
   user-select: none;
   touch-action: none;
   z-index: 5;
-  box-shadow: 0 0 0 9999px transparent; /* keeps stacking explicit */
+  box-shadow: 0 0 0 9999px transparent;
+  /* keeps stacking explicit */
 }
+
 .wall-player-label {
   position: absolute;
   top: 4px;
   left: 6px;
   pointer-events: none;
   color: #dbeafe;
-  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
   font-size: 11px;
   letter-spacing: 1px;
 }
@@ -634,12 +924,14 @@ h1, h2, h3, h4, h5, h6, .logo {
   align-items: center;
   font-size: 12px;
 }
+
 .wall-pos-grid label {
   font-size: 11px;
   color: var(--text-muted);
   text-transform: uppercase;
   letter-spacing: 0.5px;
 }
+
 .wall-pos-grid input {
   width: 100%;
   padding: 4px 6px;
@@ -650,7 +942,12 @@ h1, h2, h3, h4, h5, h6, .logo {
   font: inherit;
   font-variant-numeric: tabular-nums;
 }
-.wall-pos-grid input:focus { outline: 1px solid var(--primary); outline-offset: 0; border-color: var(--primary); }
+
+.wall-pos-grid input:focus {
+  outline: 1px solid var(--primary);
+  outline-offset: 0;
+  border-color: var(--primary);
+}
 
 /* Eight resize handles, used by both screens and the player */
 .wall-handle {
@@ -662,15 +959,62 @@ h1, h2, h3, h4, h5, h6, .logo {
   border-radius: 2px;
   z-index: 4;
 }
-.wall-player .wall-handle { border-color: #60a5fa; }
-.wall-handle-nw { top: -5px; left: -5px; cursor: nw-resize; }
-.wall-handle-n  { top: -5px; left: 50%; transform: translateX(-50%); cursor: n-resize; }
-.wall-handle-ne { top: -5px; right: -5px; cursor: ne-resize; }
-.wall-handle-e  { top: 50%; right: -5px; transform: translateY(-50%); cursor: e-resize; }
-.wall-handle-se { bottom: -5px; right: -5px; cursor: se-resize; }
-.wall-handle-s  { bottom: -5px; left: 50%; transform: translateX(-50%); cursor: s-resize; }
-.wall-handle-sw { bottom: -5px; left: -5px; cursor: sw-resize; }
-.wall-handle-w  { top: 50%; left: -5px; transform: translateY(-50%); cursor: w-resize; }
+
+.wall-player .wall-handle {
+  border-color: #60a5fa;
+}
+
+.wall-handle-nw {
+  top: -5px;
+  left: -5px;
+  cursor: nw-resize;
+}
+
+.wall-handle-n {
+  top: -5px;
+  left: 50%;
+  transform: translateX(-50%);
+  cursor: n-resize;
+}
+
+.wall-handle-ne {
+  top: -5px;
+  right: -5px;
+  cursor: ne-resize;
+}
+
+.wall-handle-e {
+  top: 50%;
+  right: -5px;
+  transform: translateY(-50%);
+  cursor: e-resize;
+}
+
+.wall-handle-se {
+  bottom: -5px;
+  right: -5px;
+  cursor: se-resize;
+}
+
+.wall-handle-s {
+  bottom: -5px;
+  left: 50%;
+  transform: translateX(-50%);
+  cursor: s-resize;
+}
+
+.wall-handle-sw {
+  bottom: -5px;
+  left: -5px;
+  cursor: sw-resize;
+}
+
+.wall-handle-w {
+  top: 50%;
+  left: -5px;
+  transform: translateY(-50%);
+  cursor: w-resize;
+}
 
 /* Wall editor — legacy cells (kept for migration; new editor uses wall-canvas) */
 .wall-cell {
@@ -686,17 +1030,28 @@ h1, h2, h3, h4, h5, h6, .logo {
   color: var(--text-secondary);
   user-select: none;
 }
+
 .wall-cell.occupied {
-  background: rgba(59,130,246,0.15);
-  border: 2px solid var(--primary, #3B82F6);
+  background: rgba(59, 130, 246, 0.15);
+  border: 2px solid var(--primary, #e65c00);
   cursor: grab;
 }
-.wall-cell.occupied:active { cursor: grabbing; }
+
+.wall-cell.occupied:active {
+  cursor: grabbing;
+}
+
 .wall-cell.drag-over {
   border-color: var(--success, #10b981);
-  box-shadow: 0 0 0 2px rgba(16,185,129,0.25) inset;
+  box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.25) inset;
 }
-.wall-cell-name { font-weight: 500; padding: 0 6px; text-align: center; }
+
+.wall-cell-name {
+  font-weight: 500;
+  padding: 0 6px;
+  text-align: center;
+}
+
 .wall-cell-pos {
   position: absolute;
   bottom: 4px;
@@ -704,27 +1059,34 @@ h1, h2, h3, h4, h5, h6, .logo {
   color: var(--text-muted);
   letter-spacing: 0.5px;
 }
+
 .wall-cell-remove {
   position: absolute;
-  top: 4px; right: 4px;
-  background: rgba(0,0,0,0.6);
+  top: 4px;
+  right: 4px;
+  background: rgba(0, 0, 0, 0.6);
   border: none;
   color: #fff;
   border-radius: 50%;
-  width: 20px; height: 20px;
+  width: 20px;
+  height: 20px;
   cursor: pointer;
   font-size: 14px;
   line-height: 1;
   padding: 0;
 }
-.wall-cell-remove:hover { background: var(--danger, #ef4444); }
+
+.wall-cell-remove:hover {
+  background: var(--danger, #ef4444);
+}
 
 .wall-card .wall-card-preview {
   display: flex;
   align-items: center;
   justify-content: center;
-  background: linear-gradient(135deg, rgba(139,92,246,0.15), rgba(59,130,246,0.1));
+  background: linear-gradient(135deg, rgba(139, 92, 246, 0.15), rgba(59, 130, 246, 0.1));
 }
+
 .wall-card-grid {
   display: grid;
   gap: 4px;
@@ -732,14 +1094,16 @@ h1, h2, h3, h4, h5, h6, .logo {
   aspect-ratio: 16/9;
   padding: 8px;
 }
+
 .wall-card-cell {
-  background: rgba(255,255,255,0.05);
-  border: 1px solid rgba(139,92,246,0.3);
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(139, 92, 246, 0.3);
   border-radius: 2px;
 }
+
 .wall-card-cell.filled {
-  background: rgba(139,92,246,0.5);
-  border-color: rgba(139,92,246,0.9);
+  background: rgba(139, 92, 246, 0.5);
+  border-color: rgba(139, 92, 246, 0.9);
 }
 
 .device-card-progress {
@@ -748,49 +1112,61 @@ h1, h2, h3, h4, h5, h6, .logo {
   right: 0;
   bottom: 0;
   padding: 6px 10px 8px;
-  background: linear-gradient(to top, rgba(0,0,0,0.85), rgba(0,0,0,0));
+  background: linear-gradient(to top, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0));
   color: #fff;
   font-size: 11px;
   pointer-events: none;
 }
+
 .device-card-progress-label {
   display: flex;
   justify-content: space-between;
   gap: 8px;
   margin-bottom: 4px;
   font-weight: 500;
-  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
 }
+
 .device-card-progress-label .dcp-name {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   flex: 1;
 }
+
 .device-card-progress-label .dcp-time {
   font-variant-numeric: tabular-nums;
   opacity: 0.85;
 }
+
 .device-card-progress-track {
   height: 3px;
-  background: rgba(255,255,255,0.2);
+  background: rgba(255, 255, 255, 0.2);
   border-radius: 2px;
   overflow: hidden;
 }
+
 .device-card-progress-fill {
   height: 100%;
   width: 0%;
-  background: var(--primary, #3B82F6);
+  background: var(--primary, #e65c00);
   transition: width 0.9s linear;
 }
+
 .device-card-progress-fill.indeterminate {
-  background: linear-gradient(90deg, transparent, var(--primary, #3B82F6), transparent);
+  background: linear-gradient(90deg, transparent, var(--primary, #e65c00), transparent);
   background-size: 50% 100%;
   animation: dcp-indeterminate 1.4s linear infinite;
 }
+
 @keyframes dcp-indeterminate {
-  0% { background-position: -50% 0; }
-  100% { background-position: 150% 0; }
+  0% {
+    background-position: -50% 0;
+  }
+
+  100% {
+    background-position: 150% 0;
+  }
 }
 
 .device-card-body {
@@ -832,7 +1208,9 @@ h1, h2, h3, h4, h5, h6, .logo {
   transition: color var(--transition);
 }
 
-.back-link:hover { color: var(--text-primary); }
+.back-link:hover {
+  color: var(--text-primary);
+}
 
 .device-header {
   display: flex;
@@ -858,12 +1236,31 @@ h1, h2, h3, h4, h5, h6, .logo {
   font-weight: 500;
 }
 
-.device-status-badge.online { background: var(--success-dim); color: var(--success); }
-.device-status-badge.offline { background: var(--danger-dim); color: #fca5a5; }
-.device-status-badge.provisioning { background: var(--warning-dim); color: var(--warning); }
+.device-status-badge.online {
+  background: var(--success-dim);
+  color: var(--success);
+}
+
+.device-status-badge.offline {
+  background: var(--danger-dim);
+  color: #fca5a5;
+}
+
+.device-status-badge.provisioning {
+  background: var(--warning-dim);
+  color: var(--warning);
+}
+
 /* v4 liveness (server-derived): healthy=green, degraded=amber (reconnecting), offline reuses .offline above */
-.device-status-badge.healthy { background: var(--success-dim); color: var(--success); }
-.device-status-badge.degraded { background: var(--warning-dim); color: var(--warning); }
+.device-status-badge.healthy {
+  background: var(--success-dim);
+  color: var(--success);
+}
+
+.device-status-badge.degraded {
+  background: var(--warning-dim);
+  color: var(--warning);
+}
 
 .tabs {
   display: flex;
@@ -882,11 +1279,22 @@ h1, h2, h3, h4, h5, h6, .logo {
   cursor: pointer;
 }
 
-.tab:hover { color: var(--text-primary); }
-.tab.active { color: var(--accent); border-bottom-color: var(--accent); }
+.tab:hover {
+  color: var(--text-primary);
+}
 
-.tab-content { display: none; }
-.tab-content.active { display: block; }
+.tab.active {
+  color: var(--accent);
+  border-bottom-color: var(--accent);
+}
+
+.tab-content {
+  display: none;
+}
+
+.tab-content.active {
+  display: block;
+}
 
 /* Screenshot Preview */
 .screenshot-container {
@@ -1049,9 +1457,17 @@ h1, h2, h3, h4, h5, h6, .logo {
   transition: width var(--transition);
 }
 
-.progress-bar-fill.success { background: var(--success); }
-.progress-bar-fill.warning { background: var(--warning); }
-.progress-bar-fill.danger { background: var(--danger); }
+.progress-bar-fill.success {
+  background: var(--success);
+}
+
+.progress-bar-fill.warning {
+  background: var(--warning);
+}
+
+.progress-bar-fill.danger {
+  background: var(--danger);
+}
 
 /* Content Library */
 .content-grid {
@@ -1285,13 +1701,28 @@ h1, h2, h3, h4, h5, h6, .logo {
   animation: slideIn 0.3s ease;
 }
 
-.toast.success { border-left: 3px solid var(--success); }
-.toast.error { border-left: 3px solid var(--danger); }
-.toast.info { border-left: 3px solid var(--accent); }
+.toast.success {
+  border-left: 3px solid var(--success);
+}
+
+.toast.error {
+  border-left: 3px solid var(--danger);
+}
+
+.toast.info {
+  border-left: 3px solid var(--accent);
+}
 
 @keyframes slideIn {
-  from { transform: translateX(100%); opacity: 0; }
-  to { transform: translateX(0); opacity: 1; }
+  from {
+    transform: translateX(100%);
+    opacity: 0;
+  }
+
+  to {
+    transform: translateX(0);
+    opacity: 1;
+  }
 }
 
 /* Empty State */
@@ -1476,60 +1907,139 @@ h1, h2, h3, h4, h5, h6, .logo {
 
 /* Responsive */
 @media (max-width: 768px) {
-  .mobile-menu-btn { display: flex; }
+  .mobile-menu-btn {
+    display: flex;
+  }
+
   .sidebar {
     transform: translateX(-100%);
     transition: transform 0.3s ease;
     z-index: 150;
   }
+
   .sidebar.open {
     transform: translateX(0);
   }
+
   .sidebar-backdrop {
     display: none;
     position: fixed;
     inset: 0;
-    background: rgba(0,0,0,0.5);
+    background: rgba(0, 0, 0, 0.5);
     z-index: 140;
   }
-  .sidebar-backdrop.open { display: block; }
-  .nav-link { min-height: 44px; padding: 10px 14px; }
-  .content { margin-left: 0; padding: 16px; padding-top: 68px; }
-  .page-header { flex-direction: column; gap: 12px; align-items: flex-start; }
-  .device-grid { grid-template-columns: 1fr; }
-  .content-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
-  .info-grid { grid-template-columns: 1fr; }
-  .remote-container { flex-direction: column; }
-  .remote-controls { width: 100%; flex-direction: row; flex-wrap: wrap; }
+
+  .sidebar-backdrop.open {
+    display: block;
+  }
+
+  .nav-link {
+    min-height: 44px;
+    padding: 10px 14px;
+  }
+
+  .content {
+    margin-left: 0;
+    padding: 16px;
+    padding-top: 68px;
+  }
+
+  .page-header {
+    flex-direction: column;
+    gap: 12px;
+    align-items: flex-start;
+  }
+
+  .device-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .content-grid {
+    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+  }
+
+  .info-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .remote-container {
+    flex-direction: column;
+  }
+
+  .remote-controls {
+    width: 100%;
+    flex-direction: row;
+    flex-wrap: wrap;
+  }
+
   /* max-height + scrolling body are now on the base .modal (pinned header/footer); just widen. */
-  .modal { width: 95vw; }
+  .modal {
+    width: 95vw;
+  }
+
   .tabs {
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
     mask-image: linear-gradient(to right, black calc(100% - 24px), transparent 100%);
     -webkit-mask-image: linear-gradient(to right, black calc(100% - 24px), transparent 100%);
   }
-  .tab { white-space: nowrap; flex-shrink: 0; }
-  .playlist-item { flex-wrap: wrap; }
+
+  .tab {
+    white-space: nowrap;
+    flex-shrink: 0;
+  }
+
+  .playlist-item {
+    flex-wrap: wrap;
+  }
 
   /* Dashboard stats stack to single column */
-  .dash-stats-row { flex-direction: column; }
-  .dash-stats-row .info-card { flex: none; }
+  .dash-stats-row {
+    flex-direction: column;
+  }
+
+  .dash-stats-row .info-card {
+    flex: none;
+  }
 
   /* Content-library 3-up toolbar stacks vertically */
-  .content-toolbar { flex-direction: column; }
-  .content-toolbar > div[style*="width:320px"] { width: auto !important; }
+  .content-toolbar {
+    flex-direction: column;
+  }
+
+  .content-toolbar>div[style*="width:320px"] {
+    width: auto !important;
+  }
 
   /* Schedule controls: allow wrap and widen select to full row */
-  .schedule-controls { gap: 8px; }
-  .schedule-controls > select { flex: 1 1 100%; }
-  .schedule-controls > button,
-  .schedule-controls > span { flex: 0 1 auto; }
+  .schedule-controls {
+    gap: 8px;
+  }
+
+  .schedule-controls>select {
+    flex: 1 1 100%;
+  }
+
+  .schedule-controls>button,
+  .schedule-controls>span {
+    flex: 0 1 auto;
+  }
 
   /* Tap targets: minimum 44px height for interactive elements */
-  .btn { min-height: 44px; padding: 10px 16px; }
-  .btn-sm { min-height: 36px; padding: 8px 12px; }
-  .btn-icon { min-width: 40px; min-height: 40px; }
+  .btn {
+    min-height: 44px;
+    padding: 10px 16px;
+  }
+
+  .btn-sm {
+    min-height: 36px;
+    padding: 8px 12px;
+  }
+
+  .btn-icon {
+    min-width: 40px;
+    min-height: 40px;
+  }
 
   /* Form inputs: 16px font to prevent iOS focus zoom; 44px tap target */
   .input,
@@ -1545,12 +2055,21 @@ h1, h2, h3, h4, h5, h6, .logo {
     font-size: 16px;
     min-height: 44px;
   }
-  .pairing-input { font-size: 24px; letter-spacing: 6px; }
+
+  .pairing-input {
+    font-size: 24px;
+    letter-spacing: 6px;
+  }
 
   /* Modals: adjust padding at 95vw so content doesn't touch edges */
   .modal-header,
-  .modal-footer { padding: 14px 16px; }
-  .modal-body { padding: 16px; }
+  .modal-footer {
+    padding: 14px 16px;
+  }
+
+  .modal-body {
+    padding: 16px;
+  }
 
   /* Toast container: full-width bar instead of 280px fixed to right */
   .toast-container {
@@ -1558,10 +2077,19 @@ h1, h2, h3, h4, h5, h6, .logo {
     right: 12px;
     bottom: 12px;
   }
-  .toast { min-width: 0; width: 100%; }
+
+  .toast {
+    min-width: 0;
+    width: 100%;
+  }
 }
 
 @media (max-width: 480px) {
-  .content-grid { grid-template-columns: 1fr; }
-  .assign-content-grid { grid-template-columns: 1fr 1fr; }
-}
+  .content-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .assign-content-grid {
+    grid-template-columns: 1fr 1fr;
+  }
+}
\ No newline at end of file
diff --git a/frontend/css/reset.css b/frontend/css/reset.css
index 063b212..ba8c75b 100644
--- a/frontend/css/reset.css
+++ b/frontend/css/reset.css
@@ -7,6 +7,7 @@
 html, body {
   height: 100%;
   font-family: 'Michroma', sans-serif;
+  font-weight: 400;
   font-size: 14px;
   line-height: 1.5;
   color: var(--text-primary);
@@ -14,7 +15,7 @@ html, body {
   -webkit-font-smoothing: antialiased;
 }
 
-h1, h2, h3, h4, h5, h6 { font-family: 'Goldman', sans-serif; }
+h1, h2, h3, h4, h5, h6 { font-family: 'Goldman', sans-serif; font-weight: 700; }
 
 a { color: inherit; text-decoration: none; }
 ul { list-style: none; }
diff --git a/frontend/css/seo-page.css b/frontend/css/seo-page.css
index 5fd23bb..9884f34 100644
--- a/frontend/css/seo-page.css
+++ b/frontend/css/seo-page.css
@@ -1,87 +1,409 @@
 /* Shared styles for SEO landing pages: comparison and guide pages.
    Matches the dark theme of landing.html. */
 
-* { margin: 0; padding: 0; box-sizing: border-box; }
-:root { --accent:#3b82f6; --bg:#111827; --card:#1e293b; --border:#334155; --text:#f1f5f9; --muted:#94a3b8; --dim:#64748b; }
-body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: var(--bg); color: var(--text); line-height: 1.65; }
-a { color: var(--accent); text-decoration: none; }
-a:hover { text-decoration: underline; }
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+:root {
+  --accent: #e65c00;
+  --bg: #111827;
+  --card: #1e293b;
+  --border: #334155;
+  --text: #f1f5f9;
+  --muted: #94a3b8;
+  --dim: #64748b;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  background: var(--bg);
+  color: var(--text);
+  line-height: 1.65;
+}
+
+a {
+  color: var(--accent);
+  text-decoration: none;
+}
+
+a:hover {
+  text-decoration: underline;
+}
 
 /* Nav (matches landing.html) */
-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(17,24,39,0.9); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); }
-.nav-inner { max-width: 1200px; margin: 0 auto; padding: 16px 24px; display: flex; align-items: center; justify-content: space-between; }
-.nav-logo { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 18px; color: var(--accent); flex-shrink: 0; }
-.nav-logo a { color: var(--accent); }
-.nav-links { display: flex; align-items: center; flex-wrap: nowrap; }
-.nav-links a { color: var(--muted); margin-left: 24px; font-size: 14px; transition: color 0.2s; }
-.nav-links a:hover { color: var(--text); text-decoration: none; }
-.btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; border-radius: 8px; font-weight: 600; font-size: 14px; transition: all 0.2s; border: none; cursor: pointer; }
-.btn-primary { background: var(--accent); color: white; }
-.btn-primary:hover { background: #2563eb; text-decoration: none; }
-.btn-outline { background: transparent; color: var(--accent); border: 1px solid var(--accent); }
-.btn-outline:hover { background: rgba(59,130,246,0.1); text-decoration: none; }
+nav {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 100;
+  background: rgba(17, 24, 39, 0.9);
+  backdrop-filter: blur(12px);
+  border-bottom: 1px solid var(--border);
+}
+
+.nav-inner {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 16px 24px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  font-weight: 700;
+  font-size: 18px;
+  color: var(--accent);
+  flex-shrink: 0;
+}
+
+.nav-logo a {
+  color: var(--accent);
+}
+
+.nav-links {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+}
+
+.nav-links a {
+  color: var(--muted);
+  margin-left: 24px;
+  font-size: 14px;
+  transition: color 0.2s;
+}
+
+.nav-links a:hover {
+  color: var(--text);
+  text-decoration: none;
+}
+
+.btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 10px 20px;
+  border-radius: 8px;
+  font-weight: 600;
+  font-size: 14px;
+  transition: all 0.2s;
+  border: none;
+  cursor: pointer;
+}
+
+.btn-primary {
+  background: var(--accent);
+  color: white;
+}
+
+.btn-primary:hover {
+  background: #2563eb;
+  text-decoration: none;
+}
+
+.btn-outline {
+  background: transparent;
+  color: var(--accent);
+  border: 1px solid var(--accent);
+}
+
+.btn-outline:hover {
+  background: rgba(59, 130, 246, 0.1);
+  text-decoration: none;
+}
 
 /* Article container */
-.article { max-width: 880px; margin: 0 auto; padding: 120px 24px 60px; }
-.breadcrumb { font-size: 13px; color: var(--muted); margin-bottom: 24px; }
-.breadcrumb a { color: var(--muted); }
-.breadcrumb a:hover { color: var(--text); }
-.breadcrumb span { margin: 0 8px; color: var(--dim); }
+.article {
+  max-width: 880px;
+  margin: 0 auto;
+  padding: 120px 24px 60px;
+}
 
-.article h1 { font-size: clamp(30px, 4vw, 44px); font-weight: 800; line-height: 1.2; margin-bottom: 16px; }
-.article .lead { font-size: 18px; color: var(--muted); margin-bottom: 32px; }
-.article h2 { font-size: 28px; font-weight: 700; margin: 48px 0 16px; line-height: 1.3; }
-.article h3 { font-size: 20px; font-weight: 600; margin: 28px 0 12px; }
-.article p { margin-bottom: 16px; color: var(--text); }
-.article ul, .article ol { margin: 0 0 16px 24px; color: var(--text); }
-.article li { margin-bottom: 8px; }
-.article strong { color: var(--text); font-weight: 600; }
-.article code { background: var(--card); border: 1px solid var(--border); padding: 2px 6px; border-radius: 4px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.9em; color: #e2e8f0; }
-.article pre { background: var(--card); border: 1px solid var(--border); padding: 16px; border-radius: 8px; overflow-x: auto; margin: 16px 0; }
-.article pre code { background: transparent; border: none; padding: 0; font-size: 13px; }
-.article blockquote { border-left: 3px solid var(--accent); padding: 8px 16px; margin: 16px 0; color: var(--muted); background: rgba(59,130,246,0.06); border-radius: 4px; }
+.breadcrumb {
+  font-size: 13px;
+  color: var(--muted);
+  margin-bottom: 24px;
+}
+
+.breadcrumb a {
+  color: var(--muted);
+}
+
+.breadcrumb a:hover {
+  color: var(--text);
+}
+
+.breadcrumb span {
+  margin: 0 8px;
+  color: var(--dim);
+}
+
+.article h1 {
+  font-size: clamp(30px, 4vw, 44px);
+  font-weight: 800;
+  line-height: 1.2;
+  margin-bottom: 16px;
+}
+
+.article .lead {
+  font-size: 18px;
+  color: var(--muted);
+  margin-bottom: 32px;
+}
+
+.article h2 {
+  font-size: 28px;
+  font-weight: 700;
+  margin: 48px 0 16px;
+  line-height: 1.3;
+}
+
+.article h3 {
+  font-size: 20px;
+  font-weight: 600;
+  margin: 28px 0 12px;
+}
+
+.article p {
+  margin-bottom: 16px;
+  color: var(--text);
+}
+
+.article ul,
+.article ol {
+  margin: 0 0 16px 24px;
+  color: var(--text);
+}
+
+.article li {
+  margin-bottom: 8px;
+}
+
+.article strong {
+  color: var(--text);
+  font-weight: 600;
+}
+
+.article code {
+  background: var(--card);
+  border: 1px solid var(--border);
+  padding: 2px 6px;
+  border-radius: 4px;
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 0.9em;
+  color: #e2e8f0;
+}
+
+.article pre {
+  background: var(--card);
+  border: 1px solid var(--border);
+  padding: 16px;
+  border-radius: 8px;
+  overflow-x: auto;
+  margin: 16px 0;
+}
+
+.article pre code {
+  background: transparent;
+  border: none;
+  padding: 0;
+  font-size: 13px;
+}
+
+.article blockquote {
+  border-left: 3px solid var(--accent);
+  padding: 8px 16px;
+  margin: 16px 0;
+  color: var(--muted);
+  background: rgba(59, 130, 246, 0.06);
+  border-radius: 4px;
+}
 
 /* Comparison table */
-.compare-table-wrap { width: 100%; overflow-x: auto; margin: 24px 0; -webkit-overflow-scrolling: touch; }
-.compare-table { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 640px; }
-.compare-table th, .compare-table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--border); }
-.compare-table th { color: var(--text); font-weight: 600; background: var(--card); }
-.compare-table td:first-child { color: var(--muted); }
-.compare-table .yes { color: #22c55e; font-weight: 600; }
-.compare-table .no { color: #ef4444; }
-.compare-table .partial { color: #f59e0b; }
-.compare-table tbody tr:hover { background: rgba(59,130,246,0.04); }
+.compare-table-wrap {
+  width: 100%;
+  overflow-x: auto;
+  margin: 24px 0;
+  -webkit-overflow-scrolling: touch;
+}
+
+.compare-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: 14px;
+  min-width: 640px;
+}
+
+.compare-table th,
+.compare-table td {
+  padding: 12px 16px;
+  text-align: left;
+  border-bottom: 1px solid var(--border);
+}
+
+.compare-table th {
+  color: var(--text);
+  font-weight: 600;
+  background: var(--card);
+}
+
+.compare-table td:first-child {
+  color: var(--muted);
+}
+
+.compare-table .yes {
+  color: #22c55e;
+  font-weight: 600;
+}
+
+.compare-table .no {
+  color: #ef4444;
+}
+
+.compare-table .partial {
+  color: #f59e0b;
+}
+
+.compare-table tbody tr:hover {
+  background: rgba(59, 130, 246, 0.04);
+}
 
 /* CTA */
-.cta { text-align: center; padding: 60px 24px; background: linear-gradient(135deg, rgba(59,130,246,0.1), rgba(139,92,246,0.1)); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin: 48px 0; border-radius: 12px; }
-.cta h2 { font-size: 28px; margin: 0 0 12px; }
-.cta p { color: var(--muted); margin-bottom: 20px; font-size: 17px; }
+.cta {
+  text-align: center;
+  padding: 60px 24px;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
+  border-top: 1px solid var(--border);
+  border-bottom: 1px solid var(--border);
+  margin: 48px 0;
+  border-radius: 12px;
+}
+
+.cta h2 {
+  font-size: 28px;
+  margin: 0 0 12px;
+}
+
+.cta p {
+  color: var(--muted);
+  margin-bottom: 20px;
+  font-size: 17px;
+}
 
 /* Related links / internal linking block */
-.related { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 24px; margin: 32px 0; }
-.related h2 { margin: 0 0 12px; font-size: 20px; }
-.related ul { margin: 0; list-style: none; }
-.related li { margin: 8px 0; padding-left: 0; }
-.related li::before { content: '> '; color: var(--accent); font-weight: 700; }
+.related {
+  background: var(--card);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  padding: 24px;
+  margin: 32px 0;
+}
+
+.related h2 {
+  margin: 0 0 12px;
+  font-size: 20px;
+}
+
+.related ul {
+  margin: 0;
+  list-style: none;
+}
+
+.related li {
+  margin: 8px 0;
+  padding-left: 0;
+}
+
+.related li::before {
+  content: '> ';
+  color: var(--accent);
+  font-weight: 700;
+}
 
 /* Footer (matches landing.html) */
-footer { max-width: 1200px; margin: 0 auto; padding: 40px 24px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; border-top: 1px solid var(--border); }
-footer .links a { color: var(--dim); margin-left: 16px; font-size: 13px; }
-footer .links a:hover { color: var(--text); text-decoration: none; }
+footer {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 40px 24px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 16px;
+  border-top: 1px solid var(--border);
+}
+
+footer .links a {
+  color: var(--dim);
+  margin-left: 16px;
+  font-size: 13px;
+}
+
+footer .links a:hover {
+  color: var(--text);
+  text-decoration: none;
+}
 
 /* Mobile */
 @media (max-width: 768px) {
-  .nav-links a:not(.btn) { display: none; }
-  .nav-inner { padding: 12px 14px; gap: 8px; }
-  .nav-links .btn { padding: 8px 12px; font-size: 13px; margin-left: 8px; flex-shrink: 0; min-height: 0; }
-  .btn { min-height: 44px; }
-  .article { padding: 100px 16px 40px; }
-  .cta { padding: 40px 16px; }
-  footer { flex-direction: column; text-align: center; }
-  footer .links a { margin: 4px 8px; }
-  .compare-table { font-size: 12px; }
-  .compare-table th, .compare-table td { padding: 8px; }
+  .nav-links a:not(.btn) {
+    display: none;
+  }
+
+  .nav-inner {
+    padding: 12px 14px;
+    gap: 8px;
+  }
+
+  .nav-links .btn {
+    padding: 8px 12px;
+    font-size: 13px;
+    margin-left: 8px;
+    flex-shrink: 0;
+    min-height: 0;
+  }
+
+  .btn {
+    min-height: 44px;
+  }
+
+  .article {
+    padding: 100px 16px 40px;
+  }
+
+  .cta {
+    padding: 40px 16px;
+  }
+
+  footer {
+    flex-direction: column;
+    text-align: center;
+  }
+
+  footer .links a {
+    margin: 4px 8px;
+  }
+
+  .compare-table {
+    font-size: 12px;
+  }
+
+  .compare-table th,
+  .compare-table td {
+    padding: 8px;
+  }
 }
+
 @media (max-width: 420px) {
-  .nav-logo-text { display: none; }
-}
+  .nav-logo-text {
+    display: none;
+  }
+}
\ No newline at end of file
diff --git a/frontend/index.html b/frontend/index.html
index 5ac60df..3d2bfe9 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html data-theme="dark" lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
@@ -10,28 +11,35 @@
   <link rel="manifest" href="/manifest.json">
   <link rel="icon" href="/assets/icon-192.png">
   <link rel="apple-touch-icon" href="/assets/icon-192.png">
-  <title>GoldenSignage</title>
-  
+  <title>SwiftDisplay</title>
+
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link href="https://fonts.googleapis.com/css2?family=Goldman:wght@400;700&family=Michroma&display=swap" rel="stylesheet">
-  
+  <link href="https://fonts.googleapis.com/css2?family=Goldman:wght@400;700&family=Michroma&display=swap"
+    rel="stylesheet">
+
   <link rel="stylesheet" href="/css/variables.css">
   <link rel="stylesheet" href="/css/reset.css">
   <link rel="stylesheet" href="/css/main.css">
   <script src="/socket.io/socket.io.js"></script>
   <!-- OAuth providers loaded on-demand by login.js when needed -->
 </head>
+
 <body>
-  <button class="mobile-menu-btn" id="mobileMenuBtn" aria-label="Toggle navigation menu" aria-expanded="false" aria-controls="sidebar">
-    <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
+  <button class="mobile-menu-btn" id="mobileMenuBtn" aria-label="Toggle navigation menu" aria-expanded="false"
+    aria-controls="sidebar">
+    <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+      <line x1="3" y1="6" x2="21" y2="6" />
+      <line x1="3" y1="12" x2="21" y2="12" />
+      <line x1="3" y1="18" x2="21" y2="18" />
+    </svg>
   </button>
   <div class="sidebar-backdrop" id="sidebarBackdrop"></div>
   <nav class="sidebar" id="sidebar">
     <div class="sidebar-header">
       <div class="logo">
         <img src="/assets/logowhiteswift.png" alt="Logo" style="height: 28px;">
-        <span id="brandName" style="margin-left: 8px;">GoldenSignage</span>
+        <span id="brandName" style="margin-left: 8px;">SwiftDisplay</span>
       </div>
       <!-- #38: apply cached white-label before first paint (no ScreenTinker flash) -->
       <script src="/js/brand-prime.js"></script>
@@ -39,114 +47,140 @@
     </div>
     <ul class="nav-links">
       <li><a href="#/" class="nav-link active" data-view="dashboard">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/>
-          <rect x="3" y="14" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/>
-        </svg>
-        <span>Displays</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="3" y="3" width="7" height="7" />
+            <rect x="14" y="3" width="7" height="7" />
+            <rect x="3" y="14" width="7" height="7" />
+            <rect x="14" y="14" width="7" height="7" />
+          </svg>
+          <span>Displays</span>
+        </a></li>
       <li><a href="#/content" class="nav-link" data-view="content">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"/>
-          <polyline points="13 2 13 9 20 9"/>
-        </svg>
-        <span>Content</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" />
+            <polyline points="13 2 13 9 20 9" />
+          </svg>
+          <span>Content</span>
+        </a></li>
       <li><a href="#/playlists" class="nav-link" data-view="playlists">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/>
-          <line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/>
-        </svg>
-        <span>Playlists</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <line x1="8" y1="6" x2="21" y2="6" />
+            <line x1="8" y1="12" x2="21" y2="12" />
+            <line x1="8" y1="18" x2="21" y2="18" />
+            <line x1="3" y1="6" x2="3.01" y2="6" />
+            <line x1="3" y1="12" x2="3.01" y2="12" />
+            <line x1="3" y1="18" x2="3.01" y2="18" />
+          </svg>
+          <span>Playlists</span>
+        </a></li>
       <li><a href="#/layouts" class="nav-link" data-view="layouts">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><line x1="3" y1="9" x2="21" y2="9"/><line x1="9" y1="21" x2="9" y2="9"/>
-        </svg>
-        <span>Layouts</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
+            <line x1="3" y1="9" x2="21" y2="9" />
+            <line x1="9" y1="21" x2="9" y2="9" />
+          </svg>
+          <span>Layouts</span>
+        </a></li>
       <li><a href="#/widgets" class="nav-link" data-view="widgets">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <rect x="2" y="2" width="8" height="8" rx="1"/><rect x="14" y="2" width="8" height="8" rx="1"/>
-          <rect x="2" y="14" width="8" height="8" rx="1"/><rect x="14" y="14" width="8" height="8" rx="1"/>
-        </svg>
-        <span>Widgets</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="2" y="2" width="8" height="8" rx="1" />
+            <rect x="14" y="2" width="8" height="8" rx="1" />
+            <rect x="2" y="14" width="8" height="8" rx="1" />
+            <rect x="14" y="14" width="8" height="8" rx="1" />
+          </svg>
+          <span>Widgets</span>
+        </a></li>
       <li><a href="#/schedule" class="nav-link" data-view="schedule">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/>
-        </svg>
-        <span>Schedule</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
+            <line x1="16" y1="2" x2="16" y2="6" />
+            <line x1="8" y1="2" x2="8" y2="6" />
+            <line x1="3" y1="10" x2="21" y2="10" />
+          </svg>
+          <span>Schedule</span>
+        </a></li>
       <li><a href="#/walls" class="nav-link" data-view="walls">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <rect x="2" y="3" width="9" height="8" rx="1"/><rect x="13" y="3" width="9" height="8" rx="1"/>
-          <rect x="2" y="13" width="9" height="8" rx="1"/><rect x="13" y="13" width="9" height="8" rx="1"/>
-        </svg>
-        <span>Video Walls</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="2" y="3" width="9" height="8" rx="1" />
+            <rect x="13" y="3" width="9" height="8" rx="1" />
+            <rect x="2" y="13" width="9" height="8" rx="1" />
+            <rect x="13" y="13" width="9" height="8" rx="1" />
+          </svg>
+          <span>Video Walls</span>
+        </a></li>
       <li><a href="#/reports" class="nav-link" data-view="reports">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/>
-        </svg>
-        <span>Reports</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <line x1="18" y1="20" x2="18" y2="10" />
+            <line x1="12" y1="20" x2="12" y2="4" />
+            <line x1="6" y1="20" x2="6" y2="14" />
+          </svg>
+          <span>Reports</span>
+        </a></li>
       <li><a href="#/kiosk" class="nav-link" data-view="kiosk">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <rect x="2" y="3" width="20" height="14" rx="2" ry="2"/><path d="M8 21h8"/><path d="M12 17v4"/>
-          <circle cx="12" cy="10" r="1"/>
-        </svg>
-        <span>Kiosk</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="2" y="3" width="20" height="14" rx="2" ry="2" />
+            <path d="M8 21h8" />
+            <path d="M12 17v4" />
+            <circle cx="12" cy="10" r="1" />
+          </svg>
+          <span>Kiosk</span>
+        </a></li>
       <li><a href="#/designer" class="nav-link" data-view="designer">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <path d="M12 19l7-7 3 3-7 7-3-3z"/><path d="M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z"/><path d="M2 2l7.586 7.586"/>
-          <circle cx="11" cy="11" r="2"/>
-        </svg>
-        <span>Designer</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M12 19l7-7 3 3-7 7-3-3z" />
+            <path d="M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z" />
+            <path d="M2 2l7.586 7.586" />
+            <circle cx="11" cy="11" r="2" />
+          </svg>
+          <span>Designer</span>
+        </a></li>
       <li><a href="#/activity" class="nav-link" data-view="activity">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/>
-        </svg>
-        <span>Activity</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <polyline points="22 12 18 12 15 21 9 3 6 12 2 12" />
+          </svg>
+          <span>Activity</span>
+        </a></li>
       <!-- Teams nav hidden while the feature is being redesigned as a user-grouping
            primitive within Workspaces. Route + view kept in place so any existing
            bookmark still loads (and shows the 503 from the API). -->
       <li style="display:none"><a href="#/teams" class="nav-link" data-view="teams">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/>
-          <path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/>
-        </svg>
-        <span>Teams</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
+            <circle cx="9" cy="7" r="4" />
+            <path d="M23 21v-2a4 4 0 0 0-3-3.87" />
+            <path d="M16 3.13a4 4 0 0 1 0 7.75" />
+          </svg>
+          <span>Teams</span>
+        </a></li>
       <li><a href="#/help" class="nav-link" data-view="help">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><line x1="12" y1="17" x2="12.01" y2="17"/>
-        </svg>
-        <span>Help</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <circle cx="12" cy="12" r="10" />
+            <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" />
+            <line x1="12" y1="17" x2="12.01" y2="17" />
+          </svg>
+          <span>Help</span>
+        </a></li>
       <li><a href="#/settings" class="nav-link" data-view="settings">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <circle cx="12" cy="12" r="3"/>
-          <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/>
-        </svg>
-        <span>Settings</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <circle cx="12" cy="12" r="3" />
+            <path
+              d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" />
+          </svg>
+          <span>Settings</span>
+        </a></li>
       <li id="billingNavItem"><a href="#/billing" class="nav-link" data-view="billing">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <rect x="1" y="4" width="22" height="16" rx="2" ry="2"/>
-          <line x1="1" y1="10" x2="23" y2="10"/>
-        </svg>
-        <span>Subscription</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="1" y="4" width="22" height="16" rx="2" ry="2" />
+            <line x1="1" y1="10" x2="23" y2="10" />
+          </svg>
+          <span>Subscription</span>
+        </a></li>
       <li id="adminNavItem" style="display:none"><a href="#/admin" class="nav-link" data-view="admin">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
-        </svg>
-        <span>Admin</span>
-      </a></li>
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
+          </svg>
+          <span>Admin</span>
+        </a></li>
     </ul>
     <div class="sidebar-footer">
       <div class="connection-status" id="connectionStatus">
@@ -171,41 +205,55 @@
         <h3 data-i18n="add_display.title">Add Display</h3>
         <button class="btn-icon" data-close-modal="addDeviceModal">
           <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-            <line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/>
+            <line x1="18" y1="6" x2="6" y2="18" />
+            <line x1="6" y1="6" x2="18" y2="18" />
           </svg>
         </button>
       </div>
       <div class="modal-body">
-        <p class="modal-description" style="margin-bottom:16px" data-i18n="add_display.intro">Enter the 6-digit pairing code shown on the display.</p>
+        <p class="modal-description" style="margin-bottom:16px" data-i18n="add_display.intro">Enter the 6-digit pairing
+          code shown on the display.</p>
         <div class="form-group">
           <label data-i18n="add_display.pairing_code">Pairing Code</label>
-          <input type="text" id="pairingCodeInput" maxlength="6" pattern="[0-9]{6}" placeholder="000000" class="pairing-input">
+          <input type="text" id="pairingCodeInput" maxlength="6" pattern="[0-9]{6}" placeholder="000000"
+            class="pairing-input">
         </div>
         <div class="form-group">
           <label data-i18n="add_display.display_name">Display Name (optional)</label>
-          <input type="text" id="deviceNameInput" data-i18n-placeholder="add_display.name_placeholder" placeholder="e.g., Lobby TV" class="input">
+          <input type="text" id="deviceNameInput" data-i18n-placeholder="add_display.name_placeholder"
+            placeholder="e.g., Lobby TV" class="input">
         </div>
         <div style="border-top:1px solid var(--border,#1e293b);margin-top:20px;padding-top:16px">
-          <p style="font-size:12px;color:var(--text-muted,#64748b);margin-bottom:10px;font-weight:500" data-i18n="add_display.need_player">Need a player app? Install one to get a pairing code:</p>
+          <p style="font-size:12px;color:var(--text-muted,#64748b);margin-bottom:10px;font-weight:500"
+            data-i18n="add_display.need_player">Need a player app? Install one to get a pairing code:</p>
           <div style="display:grid;grid-template-columns:1fr 1fr;gap:8px">
-            <a href="/download/apk" class="btn btn-secondary btn-sm" style="text-decoration:none;justify-content:center;font-size:12px">
+            <a href="/download/apk" class="btn btn-secondary btn-sm"
+              style="text-decoration:none;justify-content:center;font-size:12px">
               &#129302; <span data-i18n="add_display.android_apk">Android APK</span>
             </a>
-            <a href="/player" target="_blank" class="btn btn-secondary btn-sm" style="text-decoration:none;justify-content:center;font-size:12px">
+            <a href="/player" target="_blank" class="btn btn-secondary btn-sm"
+              style="text-decoration:none;justify-content:center;font-size:12px">
               &#127760; <span data-i18n="add_display.web_player">Web Player</span>
             </a>
-            <a href="/scripts/raspberry-pi-setup.sh" class="btn btn-secondary btn-sm" style="text-decoration:none;justify-content:center;font-size:12px">
+            <a href="/scripts/raspberry-pi-setup.sh" class="btn btn-secondary btn-sm"
+              style="text-decoration:none;justify-content:center;font-size:12px">
               &#129359; <span data-i18n="add_display.raspberry_pi">Raspberry Pi</span>
             </a>
-            <a href="/scripts/windows-setup.bat" class="btn btn-secondary btn-sm" style="text-decoration:none;justify-content:center;font-size:12px">
+            <a href="/scripts/windows-setup.bat" class="btn btn-secondary btn-sm"
+              style="text-decoration:none;justify-content:center;font-size:12px">
               &#128187; <span data-i18n="add_display.windows">Windows</span>
             </a>
           </div>
-          <p style="font-size:11px;color:var(--text-muted,#64748b);margin-top:8px" data-i18n-html="add_display.smart_tv_note">Smart TVs (LG/Samsung): open the built-in browser and navigate to <code style="background:var(--bg-input,#0f172a);padding:1px 4px;border-radius:3px">/player</code></p>
+          <p style="font-size:11px;color:var(--text-muted,#64748b);margin-top:8px"
+            data-i18n-html="add_display.smart_tv_note">Smart TVs (LG/Samsung): open the built-in browser and navigate to
+            <code style="background:var(--bg-input,#0f172a);padding:1px 4px;border-radius:3px">/player</code></p>
         </div>
         <div style="border-top:1px solid var(--border,#1e293b);margin-top:16px;padding-top:16px">
-          <p style="font-size:12px;color:var(--text-muted,#64748b);margin-bottom:10px;font-weight:500" data-i18n="add_display.owner_prompt">Provisioning a fresh / factory-reset Android panel? Enroll it as device owner for silent updates, reboot &amp; kiosk:</p>
-          <button type="button" class="btn btn-secondary btn-sm" id="deviceOwnerQrBtn" style="width:100%;justify-content:center;font-size:12px">
+          <p style="font-size:12px;color:var(--text-muted,#64748b);margin-bottom:10px;font-weight:500"
+            data-i18n="add_display.owner_prompt">Provisioning a fresh / factory-reset Android panel? Enroll it as device
+            owner for silent updates, reboot &amp; kiosk:</p>
+          <button type="button" class="btn btn-secondary btn-sm" id="deviceOwnerQrBtn"
+            style="width:100%;justify-content:center;font-size:12px">
             &#128242; <span data-i18n="add_display.owner_qr_btn">Show device-owner QR</span>
           </button>
         </div>
@@ -222,4 +270,5 @@
 
   <script type="module" src="/js/app.js"></script>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/frontend/js/views/admin-player-debug.js b/frontend/js/views/admin-player-debug.js
index 202e5cc..1f29a12 100644
--- a/frontend/js/views/admin-player-debug.js
+++ b/frontend/js/views/admin-player-debug.js
@@ -183,7 +183,7 @@ async function loadSummary() {
     if (!res.ok) throw new Error('HTTP ' + res.status);
     const data = await res.json();
     const families = [
-      ['Tizen', data.byFamily.tizen, '#3b82f6'],
+      ['Tizen', data.byFamily.tizen, '#e65c00'],
       ['WebOS', data.byFamily.webos, '#a3e635'],
       ['Fire TV', data.byFamily.fire_tv, '#f97316'],
       ['Bravia', data.byFamily.bravia, '#a855f7'],
diff --git a/frontend/js/views/admin.js b/frontend/js/views/admin.js
index d83cc57..796edc9 100644
--- a/frontend/js/views/admin.js
+++ b/frontend/js/views/admin.js
@@ -212,7 +212,7 @@ async function loadBranding() {
   el.innerHTML = `
     <div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:640px">
       <div class="form-group" style="grid-column:1/-1"><label>${t('admin.branding.brand_name')}</label><input type="text" id="brBrandName" class="input" placeholder="ScreenTinker" value="${v(b.brand_name)}"></div>
-      <div class="form-group"><label>${t('admin.branding.primary_color')}</label><input type="text" id="brPrimary" class="input" placeholder="#3B82F6" value="${v(b.primary_color)}"></div>
+      <div class="form-group"><label>${t('admin.branding.primary_color')}</label><input type="text" id="brPrimary" class="input" placeholder="#e65c00" value="${v(b.primary_color)}"></div>
       <div class="form-group"><label>${t('admin.branding.bg_color')}</label><input type="text" id="brBg" class="input" placeholder="#111827" value="${v(b.bg_color)}"></div>
       <div class="form-group" style="grid-column:1/-1"><label>${t('admin.branding.logo_url')}</label><input type="text" id="brLogo" class="input" placeholder="https://…/logo.png" value="${v(b.logo_url)}"></div>
       <div class="form-group" style="grid-column:1/-1"><label>${t('admin.branding.favicon_url')}</label><input type="text" id="brFavicon" class="input" placeholder="https://…/favicon.ico" value="${v(b.favicon_url)}"></div>
@@ -389,9 +389,9 @@ async function loadPlans() {
             <tr style="border-bottom:1px solid var(--border)">
               <td style="padding:8px;font-weight:500">${p.display_name}</td>
               <td style="padding:8px;text-align:right">${p.max_devices === -1 ? t('admin.unlimited') : p.max_devices}</td>
-              <td style="padding:8px;text-align:right">${p.max_storage_mb === -1 ? t('admin.unlimited') : p.max_storage_mb >= 1024 ? (p.max_storage_mb/1024)+'GB' : p.max_storage_mb+'MB'}</td>
-              <td style="padding:8px;text-align:right">${p.price_monthly > 0 ? '$'+p.price_monthly : t('admin.free')}</td>
-              <td style="padding:8px;text-align:right">${p.price_yearly > 0 ? '$'+p.price_yearly : '-'}</td>
+              <td style="padding:8px;text-align:right">${p.max_storage_mb === -1 ? t('admin.unlimited') : p.max_storage_mb >= 1024 ? (p.max_storage_mb / 1024) + 'GB' : p.max_storage_mb + 'MB'}</td>
+              <td style="padding:8px;text-align:right">${p.price_monthly > 0 ? '$' + p.price_monthly : t('admin.free')}</td>
+              <td style="padding:8px;text-align:right">${p.price_yearly > 0 ? '$' + p.price_yearly : '-'}</td>
             </tr>
           `).join('')}
         </tbody>
@@ -531,4 +531,4 @@ async function loadSystem() {
   } catch (err) { el.innerHTML = `<p style="color:var(--danger)">${esc(err.message)}</p>`; }
 }
 
-export function cleanup() {}
+export function cleanup() { }
diff --git a/frontend/js/views/dashboard.js b/frontend/js/views/dashboard.js
index 6ddb747..99c3009 100644
--- a/frontend/js/views/dashboard.js
+++ b/frontend/js/views/dashboard.js
@@ -91,8 +91,8 @@ function renderDeviceCard(device) {
       </label>
       <div class="device-card-preview" id="preview-${device.id}">
         ${screenshotUrl
-          ? `<img src="${screenshotUrl}" alt="Screenshot" loading="lazy">`
-          : `<div class="no-preview">
+      ? `<img src="${screenshotUrl}" alt="Screenshot" loading="lazy">`
+      : `<div class="no-preview">
               <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                 <rect x="2" y="3" width="20" height="14" rx="2" ry="2"/>
                 <line x1="8" y1="21" x2="16" y2="21"/>
@@ -100,7 +100,7 @@ function renderDeviceCard(device) {
               </svg>
               <span>${t('dashboard.no_preview')}</span>
             </div>`
-        }
+    }
         <div class="device-card-status is-liveness">
           ${(() => { const b = livenessBadge(device, { short: true }); return `<span class="device-status-badge ${b.state}" data-liveness="${b.state}" data-offline-reason="${esc(b.reason)}"${b.title ? ` title="${esc(b.title)}"` : ''}>${esc(b.label)}</span>`; })()}
         </div>
@@ -211,7 +211,7 @@ function renderGroupSection(group, devices, playlists) {
   const playlistLabel = getGroupPlaylistLabel(devices, playlists);
   return `
     <div class="group-section" data-group-id="${group.id}" style="margin-bottom:24px">
-      <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding:8px 12px;background:var(--bg-secondary);border-radius:8px;border-left:4px solid ${esc(group.color || '#3B82F6')}">
+      <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding:8px 12px;background:var(--bg-secondary);border-radius:8px;border-left:4px solid ${esc(group.color || '#e65c00')}">
         <div style="display:flex;align-items:center;gap:10px">
           <strong style="font-size:15px">${esc(group.name)}</strong>
           <span style="color:var(--text-muted);font-size:12px">${tn('dashboard.devices_count', devices.length)} &middot; ${t('dashboard.online_count', { n: onlineCount })}</span>
@@ -898,8 +898,8 @@ function attachGroupHandlers(groupsWithDevices, allDevices) {
           <p style="margin:0 0 16px;font-size:12px;color:var(--text-muted)">${t('dashboard.manage_group_subtitle')}</p>
           <div style="display:flex;flex-direction:column;gap:6px">
             ${allDevices.filter(d => d.status !== 'provisioning').map(d => {
-              const inOther = otherGroups.filter(g => g.memberIds.has(d.id)).map(g => g.name);
-              return `
+        const inOther = otherGroups.filter(g => g.memberIds.has(d.id)).map(g => g.name);
+        return `
                 <label style="display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;cursor:pointer;background:var(--bg-secondary)">
                   <input type="checkbox" data-device-id="${d.id}" data-in-groups="${inOther.join(',')}" ${memberIds.has(d.id) ? 'checked' : ''}>
                   <span class="status-dot ${d.status}" style="width:8px;height:8px"></span>
@@ -907,7 +907,7 @@ function attachGroupHandlers(groupsWithDevices, allDevices) {
                   ${inOther.length > 0 ? `<span style="font-size:10px;color:var(--text-muted);background:var(--bg-primary);padding:1px 6px;border-radius:8px">${esc(inOther.join(', '))}</span>` : ''}
                 </label>
               `;
-            }).join('')}
+      }).join('')}
           </div>
           <div style="display:flex;gap:8px;margin-top:16px;justify-content:flex-end">
             <button class="btn" id="manageGroupClose">${t('common.done')}</button>
@@ -951,8 +951,8 @@ export function cleanup() {
   if (screenshotHandler) off('screenshot-ready', screenshotHandler);
   if (playbackHandler) off('playback-progress', playbackHandler);
   if (wallChangedHandler) off('wall-changed', wallChangedHandler);
-  off('device-added', () => {});
-  off('device-removed', () => {});
+  off('device-added', () => { });
+  off('device-removed', () => { });
   if (refreshInterval) clearInterval(refreshInterval);
   if (progressTickInterval) clearInterval(progressTickInterval);
   statusHandler = null;
diff --git a/frontend/js/views/designer.js b/frontend/js/views/designer.js
index a8ba70a..b63549b 100644
--- a/frontend/js/views/designer.js
+++ b/frontend/js/views/designer.js
@@ -187,7 +187,7 @@ export function render(container, widgetId) {
     const url = prompt(t('designer.prompt.rss_url'), 'https://feeds.bbci.co.uk/news/rss.xml');
     if (url) addElement({ type: 'ticker', x: 0, y: 90, width: 100, height: 10, feedUrl: url, speed: 30, fontSize: 20, color: '#FFFFFF', bgColor: 'rgba(0,0,0,0.7)' });
   };
-  document.getElementById('addShape').onclick = () => addElement({ type: 'shape', x: 20, y: 20, width: 30, height: 20, color: '#3b82f6', opacity: 0.7, radius: 8, shape: 'rect' });
+  document.getElementById('addShape').onclick = () => addElement({ type: 'shape', x: 20, y: 20, width: 30, height: 20, color: '#e65c00', opacity: 0.7, radius: 8, shape: 'rect' });
   document.getElementById('addQR').onclick = () => {
     const data = prompt(t('designer.prompt.qr_url'), 'https://example.com');
     if (data) addElement({ type: 'qr', x: 80, y: 70, size: 15, data, fgColor: '#FFFFFF', bgColor: '#000000' });
@@ -538,7 +538,7 @@ function redraw() {
   // Elements
   elements.forEach((el, i) => {
     const selected = i === selectedIdx;
-    const border = selected ? 'outline:2px solid #3b82f6;outline-offset:2px;' : '';
+    const border = selected ? 'outline:2px solid #e65c00;outline-offset:2px;' : '';
     const cursor = 'cursor:move;';
 
     switch (el.type) {
@@ -813,4 +813,4 @@ function generateHTML() {
   return `<!DOCTYPE html><html><head><style>*{margin:0;padding:0;box-sizing:border-box}body{width:100vw;height:100vh;overflow:hidden;background:${bgImageDataUrl ? `url(${bgImageDataUrl}) center/cover` : bgValue}}</style></head><body>${generateInnerHTML()}</body></html>`;
 }
 
-export function cleanup() {}
+export function cleanup() { }
diff --git a/frontend/js/views/kiosk.js b/frontend/js/views/kiosk.js
index 6b6c684..e297114 100644
--- a/frontend/js/views/kiosk.js
+++ b/frontend/js/views/kiosk.js
@@ -117,7 +117,7 @@ async function renderEditor(container, pageId) {
             <option ${(config.style?.columns || 3) === 4 ? 'selected' : ''} value="4">4</option>
           </select></div>
           <div class="form-group"><label>${t('kiosk.button_color')}</label><input type="color" id="kBtnBg" value="${config.style?.buttonBg || '#1e293b'}" style="width:100%;height:28px;border:none;cursor:pointer"></div>
-          <div class="form-group"><label>${t('kiosk.button_hover')}</label><input type="color" id="kBtnHover" value="${config.style?.buttonHover || '#3b82f6'}" style="width:100%;height:28px;border:none;cursor:pointer"></div>
+          <div class="form-group"><label>${t('kiosk.button_hover')}</label><input type="color" id="kBtnHover" value="${config.style?.buttonHover || '#e65c00'}" style="width:100%;height:28px;border:none;cursor:pointer"></div>
         </div>
 
         <div style="background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:12px">
@@ -196,4 +196,4 @@ async function renderEditor(container, pageId) {
   renderButtons();
 }
 
-export function cleanup() {}
+export function cleanup() { }
diff --git a/frontend/js/views/schedule.js b/frontend/js/views/schedule.js
index dd3820d..cec6f51 100644
--- a/frontend/js/views/schedule.js
+++ b/frontend/js/views/schedule.js
@@ -105,7 +105,7 @@ export async function render(container) {
             </select>
           </div>
           <div class="form-group"><label>${t('schedule.priority')}</label><input type="number" id="schedPriority" class="input" value="0" min="0" max="100"></div>
-          <div class="form-group"><label>${t('schedule.color')}</label><input type="color" id="schedColor" value="#3B82F6" style="width:60px;height:32px;border:none;cursor:pointer"></div>
+          <div class="form-group"><label>${t('schedule.color')}</label><input type="color" id="schedColor" value="#e65c00" style="width:60px;height:32px;border:none;cursor:pointer"></div>
         </div>
         <div class="modal-footer" style="display:flex;justify-content:space-between;gap:8px">
           <button class="btn btn-danger" id="deleteScheduleBtn" style="display:none">${t('common.delete')}</button>
@@ -190,7 +190,7 @@ export async function render(container) {
       const block = document.createElement('div');
       const topOffset = (startHour - Math.floor(startHour)) * 28;
       block.style.cssText = `position:absolute;top:${topOffset}px;left:2px;right:2px;height:${Math.max(20, duration * 28)}px;
-        background:${ev.color || '#3B82F6'};border-radius:3px;padding:2px 4px;font-size:10px;color:white;overflow:hidden;cursor:pointer;z-index:1;opacity:0.85;
+        background:${ev.color || '#e65c00'};border-radius:3px;padding:2px 4px;font-size:10px;color:white;overflow:hidden;cursor:pointer;z-index:1;opacity:0.85;
         ${isGroupSchedule ? 'border:1.5px dashed rgba(255,255,255,0.6);' : ''}`;
 
       const label = ev.title || ev.playlist_name || ev.content_name || ev.widget_name || t('schedule.scheduled_label');
@@ -211,11 +211,11 @@ export async function render(container) {
     document.getElementById('schedTitle').value = ev.title || '';
     const start = new Date(ev.start_time);
     const end = new Date(ev.end_time);
-    document.getElementById('schedStart').value = `${String(start.getHours()).padStart(2,'0')}:${String(start.getMinutes()).padStart(2,'0')}`;
-    document.getElementById('schedEnd').value = `${String(end.getHours()).padStart(2,'0')}:${String(end.getMinutes()).padStart(2,'0')}`;
+    document.getElementById('schedStart').value = `${String(start.getHours()).padStart(2, '0')}:${String(start.getMinutes()).padStart(2, '0')}`;
+    document.getElementById('schedEnd').value = `${String(end.getHours()).padStart(2, '0')}:${String(end.getMinutes()).padStart(2, '0')}`;
     document.getElementById('schedRepeat').value = ev.recurrence || '';
     document.getElementById('schedPriority').value = ev.priority || 0;
-    document.getElementById('schedColor').value = ev.color || '#3B82F6';
+    document.getElementById('schedColor').value = ev.color || '#e65c00';
 
     if (ev.group_id) {
       groupRadio.checked = true;
@@ -311,4 +311,4 @@ export async function render(container) {
   loadCalendar();
 }
 
-export function cleanup() {}
+export function cleanup() { }
diff --git a/frontend/js/views/settings.js b/frontend/js/views/settings.js
index 5bff420..1536636 100644
--- a/frontend/js/views/settings.js
+++ b/frontend/js/views/settings.js
@@ -117,7 +117,7 @@ export async function render(container) {
         <div style="display:grid;grid-template-columns:1fr 1fr;gap:12px">
           <div class="form-group"><label>${t('settings.brand_name')}</label><input type="text" id="wlBrandName" class="input" placeholder="ScreenTinker"></div>
           <div class="form-group"><label>${t('settings.logo_url')}</label><input type="text" id="wlLogoUrl" class="input" placeholder="https://..."></div>
-          <div class="form-group"><label>${t('settings.primary_color')}</label><input type="color" id="wlPrimaryColor" value="#3B82F6" style="width:100%;height:36px;border:none;cursor:pointer;border-radius:var(--radius)"></div>
+          <div class="form-group"><label>${t('settings.primary_color')}</label><input type="color" id="wlPrimaryColor" value="#e65c00" style="width:100%;height:36px;border:none;cursor:pointer;border-radius:var(--radius)"></div>
           <div class="form-group"><label>${t('settings.bg_color')}</label><input type="color" id="wlBgColor" value="#111827" style="width:100%;height:36px;border:none;cursor:pointer;border-radius:var(--radius)"></div>
           <div class="form-group"><label>${t('settings.custom_domain')}</label><input type="text" id="wlDomain" class="input" placeholder="signage.yourcompany.com"></div>
           <div class="form-group"><label>${t('settings.favicon_url')}</label><input type="text" id="wlFavicon" class="input" placeholder="https://..."></div>
@@ -301,7 +301,7 @@ export async function render(container) {
           }
           const result = await res.json();
           if (res.ok) {
-            const imported = Object.entries(result.stats).filter(([k,v]) => v > 0 && k !== 'files_restored').map(([k,v]) => `${v} ${k}`).join(', ');
+            const imported = Object.entries(result.stats).filter(([k, v]) => v > 0 && k !== 'files_restored').map(([k, v]) => `${v} ${k}`).join(', ');
             statusEl.style.color = 'var(--success)';
             let html = t('settings.import.complete', { imported });
             if (result.device_pairings?.length) {
@@ -373,16 +373,15 @@ export async function render(container) {
             <tr style="border-bottom:1px solid var(--border)${tok.revoked_at ? ';opacity:0.55' : ''}">
               <td style="padding:10px 12px;font-family:monospace">${esc(tok.prefix)}&hellip;</td>
               <td style="padding:10px 12px">${esc(tok.name || '')}</td>
-              <td style="padding:10px 12px">${esc(scopeLabel(tok.scope))}${
-                tok.scope === 'agency' && Array.isArray(tok.targets)
-                  ? `<div style="font-size:11px;color:var(--text-muted);margin-top:2px">${t('apitoken.targets_label')} ${tok.targets.length ? tok.targets.map(p => esc(p.name)).join(', ') : '—'}${tok.auto_publish ? ' · ' + esc(t('apitoken.auto_publish_on')) : ''}</div><div style="font-size:11px;color:var(--text-muted);margin-top:2px">${t('apitoken.folder_label')} ${tok.upload_folder ? esc(tok.upload_folder) : esc(t('apitoken.folder_root'))}</div>`
-                  : ''}</td>
+              <td style="padding:10px 12px">${esc(scopeLabel(tok.scope))}${tok.scope === 'agency' && Array.isArray(tok.targets)
+        ? `<div style="font-size:11px;color:var(--text-muted);margin-top:2px">${t('apitoken.targets_label')} ${tok.targets.length ? tok.targets.map(p => esc(p.name)).join(', ') : '—'}${tok.auto_publish ? ' · ' + esc(t('apitoken.auto_publish_on')) : ''}</div><div style="font-size:11px;color:var(--text-muted);margin-top:2px">${t('apitoken.folder_label')} ${tok.upload_folder ? esc(tok.upload_folder) : esc(t('apitoken.folder_root'))}</div>`
+        : ''}</td>
               <td style="padding:10px 12px">${esc(fmtTokenDate(tok.created_at))}</td>
               <td style="padding:10px 12px">${tok.last_used_at ? esc(fmtTokenDate(tok.last_used_at)) : t('apitoken.never')}</td>
               <td style="padding:10px 12px;white-space:nowrap;text-align:right">
                 ${tok.revoked_at
-                  ? `<span style="color:var(--text-muted);font-size:12px">${t('apitoken.revoked')}</span>`
-                  : `${tok.scope === 'agency' ? `<button class="btn btn-secondary btn-sm edit-targets-btn" data-id="${esc(String(tok.id))}" data-targets="${esc((tok.targets || []).map(p => p.id).join(','))}">${t('apitoken.edit_targets')}</button> <button class="btn btn-secondary btn-sm edit-folder-btn" data-id="${esc(String(tok.id))}" data-folder="${esc(String(tok.upload_folder_id || ''))}">${t('apitoken.edit_folder')}</button> ` : ''}<button class="btn btn-secondary btn-sm revoke-token-btn" data-id="${esc(String(tok.id))}">${t('apitoken.revoke')}</button>`}
+        ? `<span style="color:var(--text-muted);font-size:12px">${t('apitoken.revoked')}</span>`
+        : `${tok.scope === 'agency' ? `<button class="btn btn-secondary btn-sm edit-targets-btn" data-id="${esc(String(tok.id))}" data-targets="${esc((tok.targets || []).map(p => p.id).join(','))}">${t('apitoken.edit_targets')}</button> <button class="btn btn-secondary btn-sm edit-folder-btn" data-id="${esc(String(tok.id))}" data-folder="${esc(String(tok.upload_folder_id || ''))}">${t('apitoken.edit_folder')}</button> ` : ''}<button class="btn btn-secondary btn-sm revoke-token-btn" data-id="${esc(String(tok.id))}">${t('apitoken.revoke')}</button>`}
               </td>
             </tr>
           `).join('')}
@@ -416,10 +415,10 @@ export async function render(container) {
           <h4 style="font-size:14px;margin-bottom:8px">${t('apitoken.edit_targets')}</h4>
           <div style="display:flex;flex-direction:column;gap:6px;max-height:200px;overflow:auto;margin-bottom:12px">
             ${pls.length
-              ? pls.map(p => p.zoned
-                  ? `<label style="display:flex;gap:8px;align-items:center;font-size:13px;opacity:.5"><input type="checkbox" disabled> ${esc(p.name)} <span style="font-size:11px;color:var(--text-muted)">— ${esc(t('apitoken.zoned_playlist_reason'))}</span></label>`
-                  : `<label style="display:flex;gap:8px;align-items:center;font-size:13px"><input type="checkbox" class="edit-pl" value="${esc(String(p.id))}"${current.has(String(p.id)) ? ' checked' : ''}> ${esc(p.name)}</label>`).join('')
-              : `<p style="color:var(--text-muted);font-size:12px">${t('apitoken.agency_no_playlists')}</p>`}
+          ? pls.map(p => p.zoned
+            ? `<label style="display:flex;gap:8px;align-items:center;font-size:13px;opacity:.5"><input type="checkbox" disabled> ${esc(p.name)} <span style="font-size:11px;color:var(--text-muted)">— ${esc(t('apitoken.zoned_playlist_reason'))}</span></label>`
+            : `<label style="display:flex;gap:8px;align-items:center;font-size:13px"><input type="checkbox" class="edit-pl" value="${esc(String(p.id))}"${current.has(String(p.id)) ? ' checked' : ''}> ${esc(p.name)}</label>`).join('')
+          : `<p style="color:var(--text-muted);font-size:12px">${t('apitoken.agency_no_playlists')}</p>`}
           </div>
           <button class="btn btn-primary btn-sm" id="saveTargetsBtn">${t('common.save')}</button>
           <button class="btn btn-secondary btn-sm" id="cancelTargetsBtn">${t('common.cancel')}</button>
@@ -482,8 +481,8 @@ export async function render(container) {
       const pls = await api.getPlaylists().catch(() => []);
       list.innerHTML = pls.length
         ? pls.map(p => p.zoned
-            ? `<label style="display:flex;gap:8px;align-items:center;font-size:13px;opacity:.5"><input type="checkbox" disabled> ${esc(p.name)} <span style="font-size:11px;color:var(--text-muted)">— ${esc(t('apitoken.zoned_playlist_reason'))}</span></label>`
-            : `<label style="display:flex;gap:8px;align-items:center;font-size:13px"><input type="checkbox" class="agency-pl" value="${esc(String(p.id))}"> ${esc(p.name)}</label>`).join('')
+          ? `<label style="display:flex;gap:8px;align-items:center;font-size:13px;opacity:.5"><input type="checkbox" disabled> ${esc(p.name)} <span style="font-size:11px;color:var(--text-muted)">— ${esc(t('apitoken.zoned_playlist_reason'))}</span></label>`
+          : `<label style="display:flex;gap:8px;align-items:center;font-size:13px"><input type="checkbox" class="agency-pl" value="${esc(String(p.id))}"> ${esc(p.name)}</label>`).join('')
         : `<p style="color:var(--text-muted);font-size:12px">${t('apitoken.agency_no_playlists')}</p>`;
       // #158: offer existing folders to bind, or leave on the auto-create default.
       const folders = await api.getFolders().catch(() => []);
@@ -628,7 +627,7 @@ async function loadWhiteLabel() {
     if (wl.favicon_url) document.getElementById('wlFavicon').value = wl.favicon_url;
     if (wl.custom_css) document.getElementById('wlCustomCss').value = wl.custom_css;
     if (wl.hide_branding) document.getElementById('wlHideBranding').checked = true;
-  } catch {}
+  } catch { }
 
   document.getElementById('saveWhiteLabelBtn')?.addEventListener('click', async () => {
     try {
@@ -779,4 +778,4 @@ async function loadUsers() {
   }
 }
 
-export function cleanup() {}
+export function cleanup() { }
diff --git a/frontend/landing.html b/frontend/landing.html
index 18df3e4..f619e9a 100644
--- a/frontend/landing.html
+++ b/frontend/landing.html
@@ -1,13 +1,16 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
   <!-- Primary SEO -->
   <title>Open-Source Digital Signage CMS — Self-Hosted &amp; Free | ScreenTinker</title>
-  <meta name="description" content="Open-source, self-hostable digital signage CMS. Manage TVs, video walls, kiosks &amp; schedules on Android, Raspberry Pi, Windows &amp; any browser. Free plan — start today.">
-  <meta name="keywords" content="digital signage, open source digital signage, self hosted signage, digital signage cms, free digital signage software, digital signage raspberry pi, digital signage android tv, video wall software, kiosk software, screen management">
+  <meta name="description"
+    content="Open-source, self-hostable digital signage CMS. Manage TVs, video walls, kiosks &amp; schedules on Android, Raspberry Pi, Windows &amp; any browser. Free plan — start today.">
+  <meta name="keywords"
+    content="digital signage, open source digital signage, self hosted signage, digital signage cms, free digital signage software, digital signage raspberry pi, digital signage android tv, video wall software, kiosk software, screen management">
   <meta name="author" content="ScreenTinker">
   <meta name="robots" content="index, follow">
   <link rel="canonical" href="https://screentinker.com/">
@@ -16,19 +19,23 @@
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://screentinker.com/">
   <meta property="og:title" content="ScreenTinker - Open-Source Digital Signage CMS">
-  <meta property="og:description" content="Open-source digital signage CMS. Free plan, self-host or cloud. Manage TVs, video walls, kiosks, and schedules across 9 platforms.">
+  <meta property="og:description"
+    content="Open-source digital signage CMS. Free plan, self-host or cloud. Manage TVs, video walls, kiosks, and schedules across 9 platforms.">
   <meta property="og:image" content="https://screentinker.com/assets/dashboard-preview.png">
   <meta property="og:image:width" content="2500">
   <meta property="og:image:height" content="1314">
-  <meta property="og:image:alt" content="ScreenTinker open-source digital signage dashboard showing four online displays with playlist assignments">
+  <meta property="og:image:alt"
+    content="ScreenTinker open-source digital signage dashboard showing four online displays with playlist assignments">
   <meta property="og:site_name" content="ScreenTinker">
 
   <!-- Twitter -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="ScreenTinker - Open-Source Digital Signage CMS">
-  <meta name="twitter:description" content="Open-source digital signage CMS. Free plan, self-host or cloud. Video walls, kiosks, scheduling, and live remote control across 9 platforms.">
+  <meta name="twitter:description"
+    content="Open-source digital signage CMS. Free plan, self-host or cloud. Video walls, kiosks, scheduling, and live remote control across 9 platforms.">
   <meta name="twitter:image" content="https://screentinker.com/assets/dashboard-preview.png">
-  <meta name="twitter:image:alt" content="ScreenTinker open-source digital signage dashboard showing four online displays with playlist assignments">
+  <meta name="twitter:image:alt"
+    content="ScreenTinker open-source digital signage dashboard showing four online displays with playlist assignments">
 
   <!-- Theme -->
   <meta name="theme-color" content="#111827">
@@ -36,151 +43,717 @@
   <link rel="icon" type="image/png" sizes="512x512" href="/assets/icon-512.png">
   <link rel="apple-touch-icon" href="/assets/icon-192.png">
   <style>
-    * { margin:0; padding:0; box-sizing:border-box; }
-    :root { --accent:#3b82f6; --bg:#111827; --card:#1e293b; --border:#334155; --text:#f1f5f9; --muted:#94a3b8; --dim:#64748b; }
-    body { font-family: 'Michroma', sans-serif; background:var(--bg); color:var(--text); line-height:1.6; }
-    h1, h2, h3, h4, h5, h6, .nav-logo { font-family: 'Goldman', sans-serif; font-weight: bold; }
-    a { color:var(--accent); text-decoration:none; }
+    * {
+      margin: 0;
+      padding: 0;
+      box-sizing: border-box;
+    }
+
+    :root {
+      --accent: #e65c00;
+      --bg: #111827;
+      --card: #1e293b;
+      --border: #334155;
+      --text: #f1f5f9;
+      --muted: #94a3b8;
+      --dim: #64748b;
+    }
+
+    body {
+      font-family: 'Michroma', sans-serif;
+      background: var(--bg);
+      color: var(--text);
+      line-height: 1.6;
+    }
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6,
+    .nav-logo {
+      font-family: 'Goldman', sans-serif;
+      font-weight: bold;
+    }
+
+    a {
+      color: var(--accent);
+      text-decoration: none;
+    }
 
     /* Nav */
-    nav { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(17,24,39,0.9); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
-    .nav-inner { max-width:1200px; margin:0 auto; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; }
-    .nav-logo { display:flex; align-items:center; gap:10px; font-weight:700; font-size:18px; color:var(--accent); flex-shrink:0; }
-    .nav-links a { color:var(--muted); margin-left:24px; font-size:14px; transition:color 0.2s; }
-    .nav-links a:hover { color:var(--text); }
-    .btn { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; border-radius:8px; font-weight:600; font-size:14px; transition:all 0.2s; border:none; cursor:pointer; }
-    .btn-primary { background:var(--accent); color:white; }
-    .btn-primary:hover { background:#2563eb; }
-    .btn-outline { background:transparent; color:var(--accent); border:1px solid var(--accent); }
-    .btn-outline:hover { background:rgba(59,130,246,0.1); }
+    nav {
+      position: fixed;
+      top: 0;
+      left: 0;
+      right: 0;
+      z-index: 100;
+      background: rgba(17, 24, 39, 0.9);
+      backdrop-filter: blur(12px);
+      border-bottom: 1px solid var(--border);
+    }
+
+    .nav-inner {
+      max-width: 1200px;
+      margin: 0 auto;
+      padding: 16px 24px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+
+    .nav-logo {
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      font-weight: 700;
+      font-size: 18px;
+      color: var(--accent);
+      flex-shrink: 0;
+    }
+
+    .nav-links a {
+      color: var(--muted);
+      margin-left: 24px;
+      font-size: 14px;
+      transition: color 0.2s;
+    }
+
+    .nav-links a:hover {
+      color: var(--text);
+    }
+
+    .btn {
+      display: inline-flex;
+      align-items: center;
+      gap: 8px;
+      padding: 10px 20px;
+      border-radius: 8px;
+      font-weight: 600;
+      font-size: 14px;
+      transition: all 0.2s;
+      border: none;
+      cursor: pointer;
+    }
+
+    .btn-primary {
+      background: var(--accent);
+      color: white;
+    }
+
+    .btn-primary:hover {
+      background: #2563eb;
+    }
+
+    .btn-outline {
+      background: transparent;
+      color: var(--accent);
+      border: 1px solid var(--accent);
+    }
+
+    .btn-outline:hover {
+      background: rgba(59, 130, 246, 0.1);
+    }
 
     /* Hero */
-    .hero { padding:140px 24px 80px; text-align:center; max-width:900px; margin:0 auto; }
-    .hero h1 { font-size:clamp(36px,5vw,64px); font-weight:800; line-height:1.1; margin-bottom:20px; }
-    .hero h1 span { background:linear-gradient(135deg,#3b82f6,#8b5cf6); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
-    .hero p { font-size:clamp(16px,2vw,20px); color:var(--muted); max-width:600px; margin:0 auto 32px; }
-    .hero-btns { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
-    .hero-badge { display:inline-block; background:var(--card); border:1px solid var(--border); border-radius:20px; padding:6px 16px; font-size:13px; color:var(--muted); margin-bottom:24px; }
+    .hero {
+      padding: 140px 24px 80px;
+      text-align: center;
+      max-width: 900px;
+      margin: 0 auto;
+    }
+
+    .hero h1 {
+      font-size: clamp(36px, 5vw, 64px);
+      font-weight: 800;
+      line-height: 1.1;
+      margin-bottom: 20px;
+    }
+
+    .hero h1 span {
+      background: linear-gradient(135deg, #e65c00, #8b5cf6);
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: transparent;
+    }
+
+    .hero p {
+      font-size: clamp(16px, 2vw, 20px);
+      color: var(--muted);
+      max-width: 600px;
+      margin: 0 auto 32px;
+    }
+
+    .hero-btns {
+      display: flex;
+      gap: 12px;
+      justify-content: center;
+      flex-wrap: wrap;
+    }
+
+    .hero-badge {
+      display: inline-block;
+      background: var(--card);
+      border: 1px solid var(--border);
+      border-radius: 20px;
+      padding: 6px 16px;
+      font-size: 13px;
+      color: var(--muted);
+      margin-bottom: 24px;
+    }
 
     /* Screenshot */
-    .screenshot { max-width:1100px; margin:0 auto 80px; padding:0 24px; }
-    .screenshot img, .screenshot .mock { width:100%; max-width:100%; height:auto; display:block; border-radius:12px; border:1px solid var(--border); box-shadow:0 20px 60px rgba(0,0,0,0.5); }
-    .mock { background:var(--card); aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; color:var(--dim); font-size:18px; }
+    .screenshot {
+      max-width: 1100px;
+      margin: 0 auto 80px;
+      padding: 0 24px;
+    }
+
+    .screenshot img,
+    .screenshot .mock {
+      width: 100%;
+      max-width: 100%;
+      height: auto;
+      display: block;
+      border-radius: 12px;
+      border: 1px solid var(--border);
+      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
+    }
+
+    .mock {
+      background: var(--card);
+      aspect-ratio: 16/9;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: var(--dim);
+      font-size: 18px;
+    }
 
     /* Features */
-    .features { max-width:1200px; margin:0 auto; padding:80px 24px; }
-    .features h2 { text-align:center; font-size:36px; margin-bottom:12px; }
-    .features .subtitle { text-align:center; color:var(--muted); margin-bottom:48px; font-size:18px; }
-    .feature-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }
-    .feature-card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:28px; transition:border-color 0.2s; }
-    .feature-card:hover { border-color:var(--accent); }
-    .feature-icon { font-size:32px; margin-bottom:12px; }
-    .feature-card h3 { font-size:18px; margin-bottom:8px; }
-    .feature-card p { color:var(--muted); font-size:14px; }
+    .features {
+      max-width: 1200px;
+      margin: 0 auto;
+      padding: 80px 24px;
+    }
+
+    .features h2 {
+      text-align: center;
+      font-size: 36px;
+      margin-bottom: 12px;
+    }
+
+    .features .subtitle {
+      text-align: center;
+      color: var(--muted);
+      margin-bottom: 48px;
+      font-size: 18px;
+    }
+
+    .feature-grid {
+      display: grid;
+      grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+      gap: 24px;
+    }
+
+    .feature-card {
+      background: var(--card);
+      border: 1px solid var(--border);
+      border-radius: 12px;
+      padding: 28px;
+      transition: border-color 0.2s;
+    }
+
+    .feature-card:hover {
+      border-color: var(--accent);
+    }
+
+    .feature-icon {
+      font-size: 32px;
+      margin-bottom: 12px;
+    }
+
+    .feature-card h3 {
+      font-size: 18px;
+      margin-bottom: 8px;
+    }
+
+    .feature-card p {
+      color: var(--muted);
+      font-size: 14px;
+    }
 
     /* Platforms */
-    .platforms { max-width:1200px; margin:0 auto; padding:80px 24px; text-align:center; }
-    .platforms h2 { font-size:36px; margin-bottom:12px; }
-    .platforms .subtitle { color:var(--muted); margin-bottom:40px; font-size:18px; }
-    .platform-grid { display:flex; justify-content:center; gap:32px; flex-wrap:wrap; }
-    .platform-item { text-align:center; width:100px; }
-    .platform-item .icon { font-size:40px; margin-bottom:8px; }
-    .platform-item .name { font-size:13px; color:var(--muted); }
+    .platforms {
+      max-width: 1200px;
+      margin: 0 auto;
+      padding: 80px 24px;
+      text-align: center;
+    }
+
+    .platforms h2 {
+      font-size: 36px;
+      margin-bottom: 12px;
+    }
+
+    .platforms .subtitle {
+      color: var(--muted);
+      margin-bottom: 40px;
+      font-size: 18px;
+    }
+
+    .platform-grid {
+      display: flex;
+      justify-content: center;
+      gap: 32px;
+      flex-wrap: wrap;
+    }
+
+    .platform-item {
+      text-align: center;
+      width: 100px;
+    }
+
+    .platform-item .icon {
+      font-size: 40px;
+      margin-bottom: 8px;
+    }
+
+    .platform-item .name {
+      font-size: 13px;
+      color: var(--muted);
+    }
 
     /* Modal (mirrors frontend/css/main.css conventions so screenshots look
        consistent across landing and dashboard; copied inline since
        landing.html doesn't import main.css). */
-    .modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.6); display:flex; align-items:center; justify-content:center; z-index:1000; padding:16px; }
-    .modal { background:var(--card); border:1px solid var(--border); border-radius:12px; width:100%; max-width:560px; max-height:90vh; overflow-y:auto; }
-    .modal-header { padding:20px 24px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; }
-    .modal-header h3 { font-size:18px; margin:0; }
-    .modal-close { background:none; border:none; color:var(--muted); font-size:24px; cursor:pointer; padding:0; line-height:1; }
-    .modal-body { padding:20px 24px; }
-    .modal-description { color:var(--muted); font-size:14px; margin-bottom:16px; }
-    .modal-footer { padding:16px 24px; border-top:1px solid var(--border); display:flex; gap:12px; justify-content:flex-end; }
-    .modal-body label { display:block; margin-bottom:12px; font-size:13px; color:var(--text); }
-    .modal-body input, .modal-body select, .modal-body textarea { width:100%; margin-top:4px; padding:8px 10px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:6px; font-size:14px; font-family:inherit; box-sizing:border-box; }
-    .modal-body input:focus, .modal-body select:focus, .modal-body textarea:focus { outline:none; border-color:var(--accent); }
-    .modal-body textarea { resize:vertical; }
-    .contact-status-success { color:#10b981; font-size:13px; }
-    .contact-status-error { color:#f87171; font-size:13px; }
+    .modal-overlay {
+      position: fixed;
+      inset: 0;
+      background: rgba(0, 0, 0, 0.6);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      z-index: 1000;
+      padding: 16px;
+    }
+
+    .modal {
+      background: var(--card);
+      border: 1px solid var(--border);
+      border-radius: 12px;
+      width: 100%;
+      max-width: 560px;
+      max-height: 90vh;
+      overflow-y: auto;
+    }
+
+    .modal-header {
+      padding: 20px 24px;
+      border-bottom: 1px solid var(--border);
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+
+    .modal-header h3 {
+      font-size: 18px;
+      margin: 0;
+    }
+
+    .modal-close {
+      background: none;
+      border: none;
+      color: var(--muted);
+      font-size: 24px;
+      cursor: pointer;
+      padding: 0;
+      line-height: 1;
+    }
+
+    .modal-body {
+      padding: 20px 24px;
+    }
+
+    .modal-description {
+      color: var(--muted);
+      font-size: 14px;
+      margin-bottom: 16px;
+    }
+
+    .modal-footer {
+      padding: 16px 24px;
+      border-top: 1px solid var(--border);
+      display: flex;
+      gap: 12px;
+      justify-content: flex-end;
+    }
+
+    .modal-body label {
+      display: block;
+      margin-bottom: 12px;
+      font-size: 13px;
+      color: var(--text);
+    }
+
+    .modal-body input,
+    .modal-body select,
+    .modal-body textarea {
+      width: 100%;
+      margin-top: 4px;
+      padding: 8px 10px;
+      background: var(--bg);
+      color: var(--text);
+      border: 1px solid var(--border);
+      border-radius: 6px;
+      font-size: 14px;
+      font-family: inherit;
+      box-sizing: border-box;
+    }
+
+    .modal-body input:focus,
+    .modal-body select:focus,
+    .modal-body textarea:focus {
+      outline: none;
+      border-color: var(--accent);
+    }
+
+    .modal-body textarea {
+      resize: vertical;
+    }
+
+    .contact-status-success {
+      color: #10b981;
+      font-size: 13px;
+    }
+
+    .contact-status-error {
+      color: #f87171;
+      font-size: 13px;
+    }
 
     /* Pricing */
-    .pricing { max-width:1200px; margin:0 auto; padding:80px 24px; }
-    .pricing h2 { text-align:center; font-size:36px; margin-bottom:12px; }
-    .pricing .subtitle { text-align:center; color:var(--muted); margin-bottom:48px; font-size:18px; }
-    .pricing-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
-    .price-card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:28px; position:relative; }
-    .price-card.featured { border-color:var(--accent); }
-    .price-card.featured::before { content:'Most Popular'; position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:var(--accent); color:white; padding:4px 16px; border-radius:12px; font-size:12px; font-weight:600; }
-    .price-card h3 { font-size:20px; margin-bottom:4px; }
-    .price-card .price { font-size:36px; font-weight:700; color:var(--accent); margin:12px 0; }
-    .price-card .price span { font-size:16px; color:var(--muted); font-weight:400; }
-    .price-card .yearly { font-size:12px; color:var(--dim); margin-bottom:16px; }
-    .price-card ul { list-style:none; margin-bottom:20px; }
-    .price-card li { font-size:14px; color:var(--muted); padding:4px 0; }
-    .price-card li::before { content:'✓ '; color:var(--accent); }
+    .pricing {
+      max-width: 1200px;
+      margin: 0 auto;
+      padding: 80px 24px;
+    }
+
+    .pricing h2 {
+      text-align: center;
+      font-size: 36px;
+      margin-bottom: 12px;
+    }
+
+    .pricing .subtitle {
+      text-align: center;
+      color: var(--muted);
+      margin-bottom: 48px;
+      font-size: 18px;
+    }
+
+    .pricing-grid {
+      display: grid;
+      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
+      gap: 20px;
+    }
+
+    .price-card {
+      background: var(--card);
+      border: 1px solid var(--border);
+      border-radius: 12px;
+      padding: 28px;
+      position: relative;
+    }
+
+    .price-card.featured {
+      border-color: var(--accent);
+    }
+
+    .price-card.featured::before {
+      content: 'Most Popular';
+      position: absolute;
+      top: -12px;
+      left: 50%;
+      transform: translateX(-50%);
+      background: var(--accent);
+      color: white;
+      padding: 4px 16px;
+      border-radius: 12px;
+      font-size: 12px;
+      font-weight: 600;
+    }
+
+    .price-card h3 {
+      font-size: 20px;
+      margin-bottom: 4px;
+    }
+
+    .price-card .price {
+      font-size: 36px;
+      font-weight: 700;
+      color: var(--accent);
+      margin: 12px 0;
+    }
+
+    .price-card .price span {
+      font-size: 16px;
+      color: var(--muted);
+      font-weight: 400;
+    }
+
+    .price-card .yearly {
+      font-size: 12px;
+      color: var(--dim);
+      margin-bottom: 16px;
+    }
+
+    .price-card ul {
+      list-style: none;
+      margin-bottom: 20px;
+    }
+
+    .price-card li {
+      font-size: 14px;
+      color: var(--muted);
+      padding: 4px 0;
+    }
+
+    .price-card li::before {
+      content: '✓ ';
+      color: var(--accent);
+    }
 
     /* Compare */
-    .compare { max-width:1000px; margin:0 auto; padding:80px 24px; }
-    .compare h2 { text-align:center; font-size:36px; margin-bottom:40px; }
-    .compare-table { width:100%; border-collapse:collapse; font-size:14px; }
-    .compare-table th, .compare-table td { padding:12px 16px; text-align:left; border-bottom:1px solid var(--border); }
-    .compare-table th { color:var(--dim); font-weight:500; }
-    .compare-table td:first-child { color:var(--muted); }
-    .compare-table .yes { color:#22c55e; }
-    .compare-table .no { color:#ef4444; }
-    .compare-table .paid { color:#f59e0b; }
-    .compare-table .partial { color:#f59e0b; }
+    .compare {
+      max-width: 1000px;
+      margin: 0 auto;
+      padding: 80px 24px;
+    }
+
+    .compare h2 {
+      text-align: center;
+      font-size: 36px;
+      margin-bottom: 40px;
+    }
+
+    .compare-table {
+      width: 100%;
+      border-collapse: collapse;
+      font-size: 14px;
+    }
+
+    .compare-table th,
+    .compare-table td {
+      padding: 12px 16px;
+      text-align: left;
+      border-bottom: 1px solid var(--border);
+    }
+
+    .compare-table th {
+      color: var(--dim);
+      font-weight: 500;
+    }
+
+    .compare-table td:first-child {
+      color: var(--muted);
+    }
+
+    .compare-table .yes {
+      color: #22c55e;
+    }
+
+    .compare-table .no {
+      color: #ef4444;
+    }
+
+    .compare-table .paid {
+      color: #f59e0b;
+    }
+
+    .compare-table .partial {
+      color: #f59e0b;
+    }
 
     /* CTA */
-    .cta { text-align:center; padding:80px 24px; background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(139,92,246,0.1)); border-top:1px solid var(--border); border-bottom:1px solid var(--border); margin:80px 0; }
-    .cta h2 { font-size:36px; margin-bottom:12px; }
-    .cta p { color:var(--muted); margin-bottom:24px; font-size:18px; }
+    .cta {
+      text-align: center;
+      padding: 80px 24px;
+      background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
+      border-top: 1px solid var(--border);
+      border-bottom: 1px solid var(--border);
+      margin: 80px 0;
+    }
+
+    .cta h2 {
+      font-size: 36px;
+      margin-bottom: 12px;
+    }
+
+    .cta p {
+      color: var(--muted);
+      margin-bottom: 24px;
+      font-size: 18px;
+    }
 
     /* Footer */
-    footer { max-width:1200px; margin:0 auto; padding:40px 24px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; border-top:1px solid var(--border); }
-    footer .links a { color:var(--dim); margin-left:16px; font-size:13px; }
+    footer {
+      max-width: 1200px;
+      margin: 0 auto;
+      padding: 40px 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      flex-wrap: wrap;
+      gap: 16px;
+      border-top: 1px solid var(--border);
+    }
+
+    footer .links a {
+      color: var(--dim);
+      margin-left: 16px;
+      font-size: 13px;
+    }
 
     /* Horizontal-scroll wrapper for wide tables on mobile */
-    .table-scroll { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
+    .table-scroll {
+      width: 100%;
+      overflow-x: auto;
+      -webkit-overflow-scrolling: touch;
+    }
+
+    .nav-links {
+      display: flex;
+      align-items: center;
+      flex-wrap: nowrap;
+    }
+
+    .btn-short {
+      display: none;
+    }
 
-    .nav-links { display:flex; align-items:center; flex-wrap:nowrap; }
-    .btn-short { display:none; }
     @media (max-width:768px) {
+
       /* Hide section anchor links on mobile; keep Try Free + Sign In */
-      .nav-links a:not(.btn) { display:none; }
-      .nav-inner { padding:12px 14px; gap:8px; }
-      .nav-links .btn { padding:8px 12px; font-size:13px; margin-left:8px !important; flex-shrink:0; min-height:0; }
-      .btn-full { display:none; }
-      .btn-short { display:inline; }
+      .nav-links a:not(.btn) {
+        display: none;
+      }
+
+      .nav-inner {
+        padding: 12px 14px;
+        gap: 8px;
+      }
+
+      .nav-links .btn {
+        padding: 8px 12px;
+        font-size: 13px;
+        margin-left: 8px !important;
+        flex-shrink: 0;
+        min-height: 0;
+      }
+
+      .btn-full {
+        display: none;
+      }
+
+      .btn-short {
+        display: inline;
+      }
     }
+
     @media (max-width:420px) {
-      .nav-logo-text { display:none; }
+      .nav-logo-text {
+        display: none;
+      }
     }
 
     @media (max-width:768px) {
-      .feature-grid { grid-template-columns:1fr; }
-      .pricing-grid { grid-template-columns:1fr; }
-      .compare-table { font-size:12px; min-width:560px; }
-      .compare-table th, .compare-table td { padding:8px; }
-      footer { flex-direction:column; text-align:center; }
+      .feature-grid {
+        grid-template-columns: 1fr;
+      }
+
+      .pricing-grid {
+        grid-template-columns: 1fr;
+      }
+
+      .compare-table {
+        font-size: 12px;
+        min-width: 560px;
+      }
+
+      .compare-table th,
+      .compare-table td {
+        padding: 8px;
+      }
+
+      footer {
+        flex-direction: column;
+        text-align: center;
+      }
 
       /* 44px tap targets for all buttons on mobile */
-      .btn { min-height:44px; }
-      .hero { padding:110px 16px 60px; }
-      .features, .platforms, .pricing, .compare { padding:60px 16px; }
-      .cta { padding:60px 16px; }
-      .screenshot { padding:0 16px; margin-bottom:60px; }
+      .btn {
+        min-height: 44px;
+      }
+
+      .hero {
+        padding: 110px 16px 60px;
+      }
+
+      .features,
+      .platforms,
+      .pricing,
+      .compare {
+        padding: 60px 16px;
+      }
+
+      .cta {
+        padding: 60px 16px;
+      }
+
+      .screenshot {
+        padding: 0 16px;
+        margin-bottom: 60px;
+      }
+    }
+
+    body {
+      font-family: 'Michroma', sans-serif;
+      font-weight: 400;
+    }
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6,
+    .brand {
+      font-family: 'Goldman', sans-serif;
+      font-weight: 700;
+    }
+
+    .feature-icon {
+      font-size: 32px;
+      color: var(--accent);
+      margin-bottom: 16px;
+    }
+
+    .platform-item .icon {
+      font-size: 32px;
+      color: var(--accent);
+      margin-bottom: 8px;
     }
   </style>
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
 </head>
+
 <body>
   <nav>
     <div class="nav-inner">
       <div class="nav-logo">
         <img src="/assets/logoswift.png" alt="Logo" style="height: 24px;">
-        <span class="nav-logo-text" style="margin-left: 8px;">ScreenTinker</span>
+
       </div>
       <div class="nav-links">
         <a href="#features">Features</a>
@@ -188,250 +761,582 @@
         <a href="#pricing">Pricing</a>
         <a href="#compare">Compare</a>
         <a href="/integrations/">Integrations</a>
-        <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener" aria-label="ScreenTinker on GitHub" class="nav-github" style="margin-left:16px;display:inline-flex;align-items:center;color:var(--muted)">
-          <svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 .3a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2c-3.3.7-4-1.6-4-1.6-.6-1.4-1.4-1.8-1.4-1.8-1.1-.7.1-.7.1-.7 1.2.1 1.9 1.3 1.9 1.3 1.1 1.9 2.9 1.4 3.6 1 .1-.8.4-1.4.8-1.7-2.7-.3-5.5-1.3-5.5-6 0-1.3.5-2.4 1.2-3.2-.1-.3-.5-1.5.1-3.2 0 0 1-.3 3.3 1.2a11 11 0 0 1 6 0c2.3-1.5 3.3-1.2 3.3-1.2.7 1.7.3 2.9.1 3.2.8.8 1.2 1.9 1.2 3.2 0 4.6-2.8 5.6-5.5 5.9.4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6A12 12 0 0 0 12 .3"/></svg>
+        <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener"
+          aria-label="ScreenTinker on GitHub" class="nav-github"
+          style="margin-left:16px;display:inline-flex;align-items:center;color:var(--muted)">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+            <path
+              d="M12 .3a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2c-3.3.7-4-1.6-4-1.6-.6-1.4-1.4-1.8-1.4-1.8-1.1-.7.1-.7.1-.7 1.2.1 1.9 1.3 1.9 1.3 1.1 1.9 2.9 1.4 3.6 1 .1-.8.4-1.4.8-1.7-2.7-.3-5.5-1.3-5.5-6 0-1.3.5-2.4 1.2-3.2-.1-.3-.5-1.5.1-3.2 0 0 1-.3 3.3 1.2a11 11 0 0 1 6 0c2.3-1.5 3.3-1.2 3.3-1.2.7 1.7.3 2.9.1 3.2.8.8 1.2 1.9 1.2 3.2 0 4.6-2.8 5.6-5.5 5.9.4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6A12 12 0 0 0 12 .3" />
+          </svg>
         </a>
         <a href="/app#/login" class="btn btn-outline" style="margin-left:16px">Sign In</a>
-        <a href="/app#/login" class="btn btn-primary" style="margin-left:8px"><span class="btn-full">Start Free Trial</span><span class="btn-short">Try Free</span></a>
+        <a href="/app#/login" class="btn btn-primary" style="margin-left:8px"><span class="btn-full">Start Free
+            Trial</span><span class="btn-short">Try Free</span></a>
       </div>
     </div>
   </nav>
 
   <main>
-  <!-- Hero -->
-  <section class="hero">
-    <div class="hero-badge">&#9889; Open source &middot; Free plan &middot; 14-day Pro trial, no credit card</div>
-    <h1>Open-Source Digital Signage<br>for <span>Any Screen</span></h1>
-    <p>Free, open-source <strong>digital signage software</strong> to manage TVs, video walls, and kiosks from anywhere. A complete <strong>digital signage CMS</strong> with remote control, scheduling, playlists, and analytics — <strong>self-host it</strong> on your own server or use our managed cloud.</p>
-    <div class="hero-btns">
-      <a href="/app#/login" class="btn btn-primary" style="padding:14px 28px;font-size:16px">Start Free Trial</a>
-      <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener" class="btn btn-outline" style="padding:14px 28px;font-size:16px">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" style="margin-right:2px"><path d="M12 .3a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2c-3.3.7-4-1.6-4-1.6-.6-1.4-1.4-1.8-1.4-1.8-1.1-.7.1-.7.1-.7 1.2.1 1.9 1.3 1.9 1.3 1.1 1.9 2.9 1.4 3.6 1 .1-.8.4-1.4.8-1.7-2.7-.3-5.5-1.3-5.5-6 0-1.3.5-2.4 1.2-3.2-.1-.3-.5-1.5.1-3.2 0 0 1-.3 3.3 1.2a11 11 0 0 1 6 0c2.3-1.5 3.3-1.2 3.3-1.2.7 1.7.3 2.9.1 3.2.8.8 1.2 1.9 1.2 3.2 0 4.6-2.8 5.6-5.5 5.9.4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6A12 12 0 0 0 12 .3"/></svg>
-        View on GitHub
-      </a>
-      <a href="#compare" class="btn btn-outline" style="padding:14px 28px;font-size:16px">See How We Compare</a>
+    <!-- Hero -->
+    <section class="hero">
+      <div class="hero-badge">&#9889; Open source &middot; Free plan &middot; 14-day Pro trial, no credit card</div>
+      <h1>Open-Source Digital Signage<br>for <span>Any Screen</span></h1>
+      <p>Free, open-source <strong>digital signage software</strong> to manage TVs, video walls, and kiosks from
+        anywhere. A complete <strong>digital signage CMS</strong> with remote control, scheduling, playlists, and
+        analytics — <strong>self-host it</strong> on your own server or use our managed cloud.</p>
+      <div class="hero-btns">
+        <a href="/app#/login" class="btn btn-primary" style="padding:14px 28px;font-size:16px">Start Free Trial</a>
+        <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener" class="btn btn-outline"
+          style="padding:14px 28px;font-size:16px">
+          <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
+            style="margin-right:2px">
+            <path
+              d="M12 .3a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2c-3.3.7-4-1.6-4-1.6-.6-1.4-1.4-1.8-1.4-1.8-1.1-.7.1-.7.1-.7 1.2.1 1.9 1.3 1.9 1.3 1.1 1.9 2.9 1.4 3.6 1 .1-.8.4-1.4.8-1.7-2.7-.3-5.5-1.3-5.5-6 0-1.3.5-2.4 1.2-3.2-.1-.3-.5-1.5.1-3.2 0 0 1-.3 3.3 1.2a11 11 0 0 1 6 0c2.3-1.5 3.3-1.2 3.3-1.2.7 1.7.3 2.9.1 3.2.8.8 1.2 1.9 1.2 3.2 0 4.6-2.8 5.6-5.5 5.9.4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6A12 12 0 0 0 12 .3" />
+          </svg>
+          View on GitHub
+        </a>
+        <a href="#compare" class="btn btn-outline" style="padding:14px 28px;font-size:16px">See How We Compare</a>
+      </div>
+    </section>
+
+    <!-- Intro video -->
+    <div style="max-width:800px;margin:32px auto;border-radius:12px;overflow:hidden;border:1px solid var(--border)">
+      <div style="position:relative;padding-bottom:56.25%;height:0">
+        <iframe src="https://www.youtube-nocookie.com/embed/Sq3RbnuDgKw?rel=0"
+          title="ScreenTinker - Open Source Digital Signage for Any Screen" loading="lazy" width="800" height="450"
+          frameborder="0"
+          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+          referrerpolicy="strict-origin-when-cross-origin" allowfullscreen
+          style="position:absolute;top:0;left:0;width:100%;height:100%"></iframe>
+      </div>
     </div>
-  </section>
 
-  <!-- Intro video -->
-  <div style="max-width:800px;margin:32px auto;border-radius:12px;overflow:hidden;border:1px solid var(--border)">
-    <div style="position:relative;padding-bottom:56.25%;height:0">
-      <iframe src="https://www.youtube-nocookie.com/embed/Sq3RbnuDgKw?rel=0" title="ScreenTinker - Open Source Digital Signage for Any Screen" loading="lazy" width="800" height="450" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="position:absolute;top:0;left:0;width:100%;height:100%"></iframe>
+    <!-- Dashboard preview -->
+    <div class="screenshot">
+      <img src="/assets/dashboard-preview.png"
+        alt="ScreenTinker open-source digital signage dashboard showing 4 online displays with playlist assignments"
+        loading="lazy" width="2500" height="1314">
     </div>
-  </div>
 
-  <!-- Dashboard preview -->
-  <div class="screenshot">
-    <img src="/assets/dashboard-preview.png" alt="ScreenTinker open-source digital signage dashboard showing 4 online displays with playlist assignments" loading="lazy" width="2500" height="1314">
-  </div>
+    <!-- Open Source callout -->
+    <section class="opensource" id="opensource"
+      style="max-width:900px;margin:0 auto;padding:40px 24px;text-align:center">
+      <h2 style="font-size:28px;margin-bottom:12px">Fully Open Source</h2>
+      <p style="color:var(--muted);font-size:16px;margin-bottom:20px">MIT licensed. Self-host on your own infrastructure
+        or use our managed cloud. Your data, your rules.</p>
+      <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener" class="btn btn-outline"
+        style="display:inline-flex;align-items:center;gap:8px">
+        <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+          <path
+            d="M12 .3a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2c-3.3.7-4-1.6-4-1.6-.6-1.4-1.4-1.8-1.4-1.8-1.1-.7.1-.7.1-.7 1.2.1 1.9 1.3 1.9 1.3 1.1 1.9 2.9 1.4 3.6 1 .1-.8.4-1.4.8-1.7-2.7-.3-5.5-1.3-5.5-6 0-1.3.5-2.4 1.2-3.2-.1-.3-.5-1.5.1-3.2 0 0 1-.3 3.3 1.2a11 11 0 0 1 6 0c2.3-1.5 3.3-1.2 3.3-1.2.7 1.7.3 2.9.1 3.2.8.8 1.2 1.9 1.2 3.2 0 4.6-2.8 5.6-5.5 5.9.4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6A12 12 0 0 0 12 .3" />
+        </svg>
+        github.com/screentinker/screentinker
+      </a>
+    </section>
 
-  <!-- Open Source callout -->
-  <section class="opensource" id="opensource" style="max-width:900px;margin:0 auto;padding:40px 24px;text-align:center">
-    <h2 style="font-size:28px;margin-bottom:12px">Fully Open Source</h2>
-    <p style="color:var(--muted);font-size:16px;margin-bottom:20px">MIT licensed. Self-host on your own infrastructure or use our managed cloud. Your data, your rules.</p>
-    <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener" class="btn btn-outline" style="display:inline-flex;align-items:center;gap:8px">
-      <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 .3a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2c-3.3.7-4-1.6-4-1.6-.6-1.4-1.4-1.8-1.4-1.8-1.1-.7.1-.7.1-.7 1.2.1 1.9 1.3 1.9 1.3 1.1 1.9 2.9 1.4 3.6 1 .1-.8.4-1.4.8-1.7-2.7-.3-5.5-1.3-5.5-6 0-1.3.5-2.4 1.2-3.2-.1-.3-.5-1.5.1-3.2 0 0 1-.3 3.3 1.2a11 11 0 0 1 6 0c2.3-1.5 3.3-1.2 3.3-1.2.7 1.7.3 2.9.1 3.2.8.8 1.2 1.9 1.2 3.2 0 4.6-2.8 5.6-5.5 5.9.4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6A12 12 0 0 0 12 .3"/></svg>
-      github.com/screentinker/screentinker
-    </a>
-  </section>
+    <!-- How it works -->
+    <section class="features" id="how-it-works">
+      <h2>Up and Running in Minutes</h2>
+      <p class="subtitle">No proprietary hardware, no complicated setup.</p>
+      <div class="feature-grid" style="grid-template-columns:repeat(auto-fill,minmax(280px,1fr))">
+        <div class="feature-card">
+          <div class="feature-icon">1&#65039;&#8419;</div>
+          <h3>Connect a screen</h3>
+          <p>Install the free player on an Android TV, Fire TV, Raspberry Pi, Windows PC, or open a browser tab — then
+            pair it with a code.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon">2&#65039;&#8419;</div>
+          <h3>Add your content</h3>
+          <p>Upload images and video, build playlists and multi-zone layouts, or design screens with built-in widgets.
+          </p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon">3&#65039;&#8419;</div>
+          <h3>Schedule and publish</h3>
+          <p>Assign content to displays or groups, set day/time schedules, and push live. Change it any time from your
+            phone.</p>
+        </div>
+      </div>
+    </section>
 
-  <!-- How it works -->
-  <section class="features" id="how-it-works">
-    <h2>Up and Running in Minutes</h2>
-    <p class="subtitle">No proprietary hardware, no complicated setup.</p>
-    <div class="feature-grid" style="grid-template-columns:repeat(auto-fill,minmax(280px,1fr))">
-      <div class="feature-card"><div class="feature-icon">1&#65039;&#8419;</div><h3>Connect a screen</h3><p>Install the free player on an Android TV, Fire TV, Raspberry Pi, Windows PC, or open a browser tab — then pair it with a code.</p></div>
-      <div class="feature-card"><div class="feature-icon">2&#65039;&#8419;</div><h3>Add your content</h3><p>Upload images and video, build playlists and multi-zone layouts, or design screens with built-in widgets.</p></div>
-      <div class="feature-card"><div class="feature-icon">3&#65039;&#8419;</div><h3>Schedule and publish</h3><p>Assign content to displays or groups, set day/time schedules, and push live. Change it any time from your phone.</p></div>
-    </div>
-  </section>
+    <!-- Features -->
+    <section class="features" id="features">
+      <h2>Everything You Need</h2>
+      <p class="subtitle">Every feature you'd expect from an enterprise <strong>digital signage CMS</strong> — video
+        walls, scheduling, proof-of-play, and remote monitoring — free and open source.</p>
+      <div class="feature-grid">
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-tv"></i></div>
+          <h3>Multi-Zone Layouts</h3>
+          <p>Split screens into zones with a drag-and-drop editor. 7 built-in templates or create your own.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-border-all"></i></div>
+          <h3>Video Wall</h3>
+          <p>Combine multiple displays into one giant screen. Automatic bezel compensation. Any grid size.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-desktop"></i></div>
+          <h3>Remote Control</h3>
+          <p>See what's on screen in real-time. Send key presses, navigate menus, power on/off remotely.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-regular fa-calendar"></i></div>
+          <h3>Scheduling</h3>
+          <p>Visual weekly calendar with recurrence rules. Schedule per device or for whole groups — device rules
+            override the group.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-list"></i></div>
+          <h3>Playlists</h3>
+          <p>Share one playlist across many displays. Draft changes, preview, then publish — or revert to the last
+            published version.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-building"></i></div>
+          <h3>Directory Board</h3>
+          <p>Scrolling lobby, building, and staff directories. Categories, dark &amp; light themes, anti-burn-in. Not
+            found in any other open-source CMS.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-wrench"></i></div>
+          <h3>Content Designer</h3>
+          <p>Built-in editor with live clocks, weather, RSS tickers, countdowns, QR codes, and more.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-hand-pointer"></i></div>
+          <h3>Kiosk Mode</h3>
+          <p>Create interactive touchscreen interfaces. Wayfinding, directories, check-in screens.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-chart-line"></i></div>
+          <h3>Proof-of-Play</h3>
+          <p>Track what played, when, and on which device. Export CSV reports for ad verification.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-bell"></i></div>
+          <h3>Alerts & Monitoring</h3>
+          <p>Email alerts when devices go offline. Full telemetry: battery, storage, WiFi, uptime.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-plug-circle-xmark"></i></div>
+          <h3>Offline Resilience</h3>
+          <p>Displays keep playing cached content when the internet or your server drops. They catch up automatically
+            when you're back.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-mobile-screen"></i></div>
+          <h3>Mobile Dashboard</h3>
+          <p>Manage everything from your phone. The full dashboard works on any mobile browser — no separate app needed.
+          </p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-server"></i></div>
+          <h3>Self-Hosted Option</h3>
+          <p>Deploy on your own infrastructure. Your data never leaves your network. Lock down signups with a single env
+            var.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-palette"></i></div>
+          <h3>White Label</h3>
+          <p>Custom branding, colors, logo, and domain. Resell under your own brand.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-users"></i></div>
+          <h3>Teams</h3>
+          <p>Multi-user accounts with owner, editor, and viewer roles. Invite by email.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-arrows-rotate"></i></div>
+          <h3>Auto-Update</h3>
+          <p>Devices automatically update when you push a new version. Zero manual intervention.</p>
+        </div>
+      </div>
+    </section>
 
-  <!-- Features -->
-  <section class="features" id="features">
-    <h2>Everything You Need</h2>
-    <p class="subtitle">Every feature you'd expect from an enterprise <strong>digital signage CMS</strong> — video walls, scheduling, proof-of-play, and remote monitoring — free and open source.</p>
-    <div class="feature-grid">
-      <div class="feature-card"><div class="feature-icon">&#128250;</div><h3>Multi-Zone Layouts</h3><p>Split screens into zones with a drag-and-drop editor. 7 built-in templates or create your own.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127916;</div><h3>Video Wall</h3><p>Combine multiple displays into one giant screen. Automatic bezel compensation. Any grid size.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128421;</div><h3>Remote Control</h3><p>See what's on screen in real-time. Send key presses, navigate menus, power on/off remotely.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128197;</div><h3>Scheduling</h3><p>Visual weekly calendar with recurrence rules. Schedule per device or for whole groups — device rules override the group.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127926;</div><h3>Playlists</h3><p>Share one playlist across many displays. Draft changes, preview, then publish — or revert to the last published version.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127970;</div><h3>Directory Board</h3><p>Scrolling lobby, building, and staff directories. Categories, dark &amp; light themes, anti-burn-in. Not found in any other open-source CMS.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128295;</div><h3>Content Designer</h3><p>Built-in editor with live clocks, weather, RSS tickers, countdowns, QR codes, and more.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128433;</div><h3>Kiosk Mode</h3><p>Create interactive touchscreen interfaces. Wayfinding, directories, check-in screens.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128202;</div><h3>Proof-of-Play</h3><p>Track what played, when, and on which device. Export CSV reports for ad verification.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128276;</div><h3>Alerts & Monitoring</h3><p>Email alerts when devices go offline. Full telemetry: battery, storage, WiFi, uptime.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128268;</div><h3>Offline Resilience</h3><p>Displays keep playing cached content when the internet or your server drops. They catch up automatically when you're back.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128241;</div><h3>Mobile Dashboard</h3><p>Manage everything from your phone. The full dashboard works on any mobile browser — no separate app needed.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128274;</div><h3>Self-Hosted Option</h3><p>Deploy on your own infrastructure. Your data never leaves your network. Lock down signups with a single env var.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127912;</div><h3>White Label</h3><p>Custom branding, colors, logo, and domain. Resell under your own brand.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128101;</div><h3>Teams</h3><p>Multi-user accounts with owner, editor, and viewer roles. Invite by email.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#128260;</div><h3>Auto-Update</h3><p>Devices automatically update when you push a new version. Zero manual intervention.</p></div>
-    </div>
-  </section>
+    <!-- Use cases / industries -->
+    <section class="features" id="use-cases">
+      <h2>Digital Signage for Any Space</h2>
+      <p class="subtitle">One platform, every use case.</p>
+      <div class="feature-grid">
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-cart-shopping"></i></div>
+          <h3>Retail &amp; QSR</h3>
+          <p>Menu boards, promotions, and price updates pushed to every location instantly.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-utensils"></i></div>
+          <h3>Restaurants &amp; Cafés</h3>
+          <p>Digital menu boards with dayparting — breakfast, lunch, and dinner menus that switch themselves on
+            schedule.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-building"></i></div>
+          <h3>Offices &amp; Corporate</h3>
+          <p>Lobby welcome screens, meeting-room signs, KPI dashboards, and internal comms.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-graduation-cap"></i></div>
+          <h3>Schools &amp; Universities</h3>
+          <p>Campus announcements, event calendars, and emergency alerts across every building.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-notes-medical"></i></div>
+          <h3>Healthcare &amp; Clinics</h3>
+          <p>Waiting-room info, wayfinding, and check-in kiosks that keep playing even offline.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-church"></i></div>
+          <h3>Churches &amp; Nonprofits</h3>
+          <p>Free, self-hostable signage for lobbies and sanctuaries with no recurring cost.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-dumbbell"></i></div>
+          <h3>Gyms &amp; Fitness</h3>
+          <p>Class schedules, promos, and live directories on any screen you already own.</p>
+        </div>
+        <div class="feature-card">
+          <div class="feature-icon"><i class="fa-solid fa-building"></i></div>
+          <h3>Building &amp; Staff Directories</h3>
+          <p>Scrolling lobby, tenant, and staff directories with categories and anti-burn-in.</p>
+        </div>
+      </div>
+    </section>
 
-  <!-- Use cases / industries -->
-  <section class="features" id="use-cases">
-    <h2>Digital Signage for Any Space</h2>
-    <p class="subtitle">One platform, every use case.</p>
-    <div class="feature-grid">
-      <div class="feature-card"><div class="feature-icon">&#128722;</div><h3>Retail &amp; QSR</h3><p>Menu boards, promotions, and price updates pushed to every location instantly.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127869;</div><h3>Restaurants &amp; Cafés</h3><p>Digital menu boards with dayparting — breakfast, lunch, and dinner menus that switch themselves on schedule.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127970;</div><h3>Offices &amp; Corporate</h3><p>Lobby welcome screens, meeting-room signs, KPI dashboards, and internal comms.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127979;</div><h3>Schools &amp; Universities</h3><p>Campus announcements, event calendars, and emergency alerts across every building.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127973;</div><h3>Healthcare &amp; Clinics</h3><p>Waiting-room info, wayfinding, and check-in kiosks that keep playing even offline.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#9962;</div><h3>Churches &amp; Nonprofits</h3><p>Free, self-hostable signage for lobbies and sanctuaries with no recurring cost.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127947;</div><h3>Gyms &amp; Fitness</h3><p>Class schedules, promos, and live directories on any screen you already own.</p></div>
-      <div class="feature-card"><div class="feature-icon">&#127970;</div><h3>Building &amp; Staff Directories</h3><p>Scrolling lobby, tenant, and staff directories with categories and anti-burn-in.</p></div>
-    </div>
-  </section>
+    <!-- Platforms -->
+    <section class="platforms" id="platforms">
+      <h2>Runs on Everything</h2>
+      <p class="subtitle">No hardware lock-in. Use any screen you already have.</p>
+      <div class="platform-grid">
+        <a class="platform-item" href="/guides/digital-signage-android-tv.html" style="color:inherit">
+          <div class="icon"><i class="fa-brands fa-android"></i></div>
+          <div class="name">Android TV</div>
+        </a>
+        <a class="platform-item" href="/guides/digital-signage-android-tv.html" style="color:inherit">
+          <div class="icon"><i class="fa-brands fa-amazon"></i></div>
+          <div class="name">Fire TV</div>
+        </a>
+        <a class="platform-item" href="/guides/raspberry-pi-digital-signage.html" style="color:inherit">
+          <div class="icon"><i class="fa-brands fa-raspberry-pi"></i></div>
+          <div class="name">Raspberry Pi</div>
+        </a>
+        <div class="platform-item">
+          <div class="icon"><i class="fa-brands fa-windows"></i></div>
+          <div class="name">Windows</div>
+        </div>
+        <div class="platform-item">
+          <div class="icon"><i class="fa-brands fa-chrome"></i></div>
+          <div class="name">ChromeOS</div>
+        </div>
+        <div class="platform-item">
+          <div class="icon"><i class="fa-solid fa-tv"></i></div>
+          <div class="name">LG webOS</div>
+        </div>
+        <div class="platform-item">
+          <div class="icon"><i class="fa-solid fa-tv"></i></div>
+          <div class="name">Samsung Tizen</div>
+        </div>
+        <div class="platform-item">
+          <div class="icon">&#127758;</div>
+          <div class="name">Any Browser</div>
+        </div>
+      </div>
+    </section>
 
-  <!-- Platforms -->
-  <section class="platforms" id="platforms">
-    <h2>Runs on Everything</h2>
-    <p class="subtitle">No hardware lock-in. Use any screen you already have.</p>
-    <div class="platform-grid">
-      <a class="platform-item" href="/guides/digital-signage-android-tv.html" style="color:inherit"><div class="icon">&#129302;</div><div class="name">Android TV</div></a>
-      <a class="platform-item" href="/guides/digital-signage-android-tv.html" style="color:inherit"><div class="icon">&#128293;</div><div class="name">Fire TV</div></a>
-      <a class="platform-item" href="/guides/raspberry-pi-digital-signage.html" style="color:inherit"><div class="icon">&#129359;</div><div class="name">Raspberry Pi</div></a>
-      <div class="platform-item"><div class="icon">&#128187;</div><div class="name">Windows</div></div>
-      <div class="platform-item"><div class="icon">&#127760;</div><div class="name">ChromeOS</div></div>
-      <div class="platform-item"><div class="icon">&#128250;</div><div class="name">LG webOS</div></div>
-      <div class="platform-item"><div class="icon">&#128250;</div><div class="name">Samsung Tizen</div></div>
-      <div class="platform-item"><div class="icon">&#127758;</div><div class="name">Any Browser</div></div>
-    </div>
-  </section>
+    <!-- Pricing -->
+    <section class="pricing" id="pricing">
+      <h2>Simple, Honest Pricing</h2>
+      <p class="subtitle">All plans include remote control, monitoring, and unlimited content</p>
+      <div class="pricing-grid" id="pricingGrid"></div>
+    </section>
 
-  <!-- Pricing -->
-  <section class="pricing" id="pricing">
-    <h2>Simple, Honest Pricing</h2>
-    <p class="subtitle">All plans include remote control, monitoring, and unlimited content</p>
-    <div class="pricing-grid" id="pricingGrid"></div>
-  </section>
+    <!-- Compare -->
+    <section class="compare" id="compare">
+      <h2>How We Compare</h2>
+      <div class="table-scroll">
+        <table class="compare-table">
+          <thead>
+            <tr>
+              <th></th>
+              <th style="color:var(--accent);font-weight:700">ScreenTinker</th>
+              <th>Yodeck</th>
+              <th>ScreenCloud</th>
+              <th>OptiSigns</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>Price (15 devices/yr)</td>
+              <td style="color:var(--accent);font-weight:600">€1,188</td>
+              <td>€1,440+</td>
+              <td>€3,600+</td>
+              <td>€1,800+</td>
+            </tr>
+            <tr>
+              <td>Free tier</td>
+              <td class="yes">&#10003; 1 device</td>
+              <td class="yes">&#10003;</td>
+              <td class="no">&#10007;</td>
+              <td class="yes">&#10003;</td>
+            </tr>
+            <tr>
+              <td>Video Wall</td>
+              <td class="yes">&#10003; Included</td>
+              <td class="partial">Basic</td>
+              <td class="partial">
+                Basic<!-- VERIFY: multi-screen confirmed; bezel-compensated video wall not confirmed --></td>
+              <td class="partial">Paid add-on</td>
+            </tr>
+            <tr>
+              <td>Live screen view + remote key presses*</td>
+              <td class="yes">&#10003; All plans</td>
+              <td class="partial">Limited</td>
+              <td class="partial">Limited</td>
+              <td class="partial">Limited</td>
+            </tr>
+            <tr>
+              <td>Kiosk/Touchscreen</td>
+              <td class="yes">&#10003; Included</td>
+              <td class="yes">&#10003;</td>
+              <td class="partial">Limited</td>
+              <td class="yes">&#10003;</td>
+            </tr>
+            <tr>
+              <td>Proof-of-Play</td>
+              <td class="yes">&#10003; All plans</td>
+              <td class="paid">Paid tier</td>
+              <td class="paid">Paid</td>
+              <td class="paid">Paid</td>
+            </tr>
+            <tr>
+              <td>Self-Hosted</td>
+              <td class="yes">&#10003; Only us</td>
+              <td class="no">&#10007;</td>
+              <td class="no">&#10007;</td>
+              <td class="no">&#10007;</td>
+            </tr>
+            <tr>
+              <td>White Label</td>
+              <td class="yes">&#10003; Included</td>
+              <td class="paid">Paid</td>
+              <td class="paid">Enterprise</td>
+              <td class="paid">Paid tier</td>
+            </tr>
+            <tr>
+              <td>Email Alerts</td>
+              <td class="yes">&#10003; All plans</td>
+              <td class="paid">Paid</td>
+              <td class="paid">Paid</td>
+              <td class="paid">Paid</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+      <p style="max-width:1000px;margin:16px auto 0;font-size:12px;color:var(--dim);line-height:1.6">
+        * Live screen view + remote key presses is Android only and requires granting the on-device accessibility
+        permission.<br>
+        Comparison as of June 2026, based on each vendor's publicly listed pricing and documentation. Spot an error? <a
+          href="https://github.com/screentinker/screentinker/issues" target="_blank" rel="noopener"
+          style="color:var(--accent)">Open an issue on GitHub</a> and we'll fix it.
+      </p>
+    </section>
 
-  <!-- Compare -->
-  <section class="compare" id="compare">
-    <h2>How We Compare</h2>
-    <div class="table-scroll">
-    <table class="compare-table">
-      <thead><tr><th></th><th style="color:var(--accent);font-weight:700">ScreenTinker</th><th>Yodeck</th><th>ScreenCloud</th><th>OptiSigns</th></tr></thead>
-      <tbody>
-        <tr><td>Price (15 devices/yr)</td><td style="color:var(--accent);font-weight:600">$1,188</td><td>$1,440+</td><td>$3,600+</td><td>$1,800+</td></tr>
-        <tr><td>Free tier</td><td class="yes">&#10003; 1 device</td><td class="yes">&#10003;</td><td class="no">&#10007;</td><td class="yes">&#10003;</td></tr>
-        <tr><td>Video Wall</td><td class="yes">&#10003; Included</td><td class="partial">Basic</td><td class="partial">Basic<!-- VERIFY: multi-screen confirmed; bezel-compensated video wall not confirmed --></td><td class="partial">Paid add-on</td></tr>
-        <tr><td>Live screen view + remote key presses*</td><td class="yes">&#10003; All plans</td><td class="partial">Limited</td><td class="partial">Limited</td><td class="partial">Limited</td></tr>
-        <tr><td>Kiosk/Touchscreen</td><td class="yes">&#10003; Included</td><td class="yes">&#10003;</td><td class="partial">Limited</td><td class="yes">&#10003;</td></tr>
-        <tr><td>Proof-of-Play</td><td class="yes">&#10003; All plans</td><td class="paid">Paid tier</td><td class="paid">Paid</td><td class="paid">Paid</td></tr>
-        <tr><td>Self-Hosted</td><td class="yes">&#10003; Only us</td><td class="no">&#10007;</td><td class="no">&#10007;</td><td class="no">&#10007;</td></tr>
-        <tr><td>White Label</td><td class="yes">&#10003; Included</td><td class="paid">Paid</td><td class="paid">Enterprise</td><td class="paid">Paid tier</td></tr>
-        <tr><td>Email Alerts</td><td class="yes">&#10003; All plans</td><td class="paid">Paid</td><td class="paid">Paid</td><td class="paid">Paid</td></tr>
-      </tbody>
-    </table>
-    </div>
-    <p style="max-width:1000px;margin:16px auto 0;font-size:12px;color:var(--dim);line-height:1.6">
-      * Live screen view + remote key presses is Android only and requires granting the on-device accessibility permission.<br>
-      Comparison as of June 2026, based on each vendor's publicly listed pricing and documentation. Spot an error? <a href="https://github.com/screentinker/screentinker/issues" target="_blank" rel="noopener" style="color:var(--accent)">Open an issue on GitHub</a> and we'll fix it.
-    </p>
-  </section>
+    <!-- Resources / internal linking for SEO -->
+    <section class="resources" id="resources" style="max-width:1000px;margin:0 auto;padding:60px 24px;">
+      <h2 style="text-align:center;font-size:32px;margin-bottom:8px">Resources</h2>
+      <p style="text-align:center;color:var(--muted);margin-bottom:32px">Setup guides and honest comparisons.</p>
+      <div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px">
+        <a href="/guides/raspberry-pi-digital-signage.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Guide</div>
+          <div style="font-weight:600;margin-bottom:4px">How to set up digital signage on Raspberry Pi</div>
+          <div style="font-size:13px;color:var(--muted)">Hardware, OS, install script, pairing.</div>
+        </a>
+        <a href="/guides/digital-signage-android-tv.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Guide</div>
+          <div style="font-weight:600;margin-bottom:4px">Free digital signage for Android TV &amp; Fire TV</div>
+          <div style="font-size:13px;color:var(--muted)">APK sideload, kiosk mode, hardware tips.</div>
+        </a>
+        <a href="/guides/self-hosted-digital-signage.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Guide</div>
+          <div style="font-weight:600;margin-bottom:4px">Self-hosted digital signage guide</div>
+          <div style="font-size:13px;color:var(--muted)">Sizing, deploy, TLS, backups.</div>
+        </a>
+        <a href="/compare/yodeck-alternative.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Compare</div>
+          <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs Yodeck</div>
+          <div style="font-size:13px;color:var(--muted)">Features, pricing, platform support.</div>
+        </a>
+        <a href="/compare/screencloud-alternative.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Compare</div>
+          <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs ScreenCloud</div>
+          <div style="font-size:13px;color:var(--muted)">Pricing breakdown at scale.</div>
+        </a>
+        <a href="/compare/optisigns-alternative.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Compare</div>
+          <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs OptiSigns</div>
+          <div style="font-size:13px;color:var(--muted)">Side by side feature and price comparison.</div>
+        </a>
+        <a href="/guides/open-source-digital-signage.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Guide</div>
+          <div style="font-weight:600;margin-bottom:4px">Open-source digital signage explained</div>
+          <div style="font-size:13px;color:var(--muted)">Why open source, and how ScreenTinker fits.</div>
+        </a>
+        <a href="/guides/what-is-digital-signage.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Guide</div>
+          <div style="font-weight:600;margin-bottom:4px">What is digital signage?</div>
+          <div style="font-size:13px;color:var(--muted)">Beginner's guide: how it works and what it costs.</div>
+        </a>
+        <a href="/compare/xibo-alternative.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Compare</div>
+          <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs Xibo</div>
+          <div style="font-size:13px;color:var(--muted)">Open source vs open source — and the paid players.</div>
+        </a>
+        <a href="/compare/anthias-alternative.html"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Compare</div>
+          <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs Anthias</div>
+          <div style="font-size:13px;color:var(--muted)">Beyond one Pi, one screen.</div>
+        </a>
+        <a href="/integrations/"
+          style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
+          <div
+            style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">
+            Integrations</div>
+          <div style="font-weight:600;margin-bottom:4px">Connect Google Slides, Canva, Power BI &amp; more</div>
+          <div style="font-size:13px;color:var(--muted)">Native widgets + embed any web app.</div>
+        </a>
+      </div>
+    </section>
 
-  <!-- Resources / internal linking for SEO -->
-  <section class="resources" id="resources" style="max-width:1000px;margin:0 auto;padding:60px 24px;">
-    <h2 style="text-align:center;font-size:32px;margin-bottom:8px">Resources</h2>
-    <p style="text-align:center;color:var(--muted);margin-bottom:32px">Setup guides and honest comparisons.</p>
-    <div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px">
-      <a href="/guides/raspberry-pi-digital-signage.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Guide</div>
-        <div style="font-weight:600;margin-bottom:4px">How to set up digital signage on Raspberry Pi</div>
-        <div style="font-size:13px;color:var(--muted)">Hardware, OS, install script, pairing.</div>
-      </a>
-      <a href="/guides/digital-signage-android-tv.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Guide</div>
-        <div style="font-weight:600;margin-bottom:4px">Free digital signage for Android TV &amp; Fire TV</div>
-        <div style="font-size:13px;color:var(--muted)">APK sideload, kiosk mode, hardware tips.</div>
-      </a>
-      <a href="/guides/self-hosted-digital-signage.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Guide</div>
-        <div style="font-weight:600;margin-bottom:4px">Self-hosted digital signage guide</div>
-        <div style="font-size:13px;color:var(--muted)">Sizing, deploy, TLS, backups.</div>
-      </a>
-      <a href="/compare/yodeck-alternative.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Compare</div>
-        <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs Yodeck</div>
-        <div style="font-size:13px;color:var(--muted)">Features, pricing, platform support.</div>
-      </a>
-      <a href="/compare/screencloud-alternative.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Compare</div>
-        <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs ScreenCloud</div>
-        <div style="font-size:13px;color:var(--muted)">Pricing breakdown at scale.</div>
-      </a>
-      <a href="/compare/optisigns-alternative.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Compare</div>
-        <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs OptiSigns</div>
-        <div style="font-size:13px;color:var(--muted)">Side by side feature and price comparison.</div>
-      </a>
-      <a href="/guides/open-source-digital-signage.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Guide</div>
-        <div style="font-weight:600;margin-bottom:4px">Open-source digital signage explained</div>
-        <div style="font-size:13px;color:var(--muted)">Why open source, and how ScreenTinker fits.</div>
-      </a>
-      <a href="/guides/what-is-digital-signage.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Guide</div>
-        <div style="font-weight:600;margin-bottom:4px">What is digital signage?</div>
-        <div style="font-size:13px;color:var(--muted)">Beginner's guide: how it works and what it costs.</div>
-      </a>
-      <a href="/compare/xibo-alternative.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Compare</div>
-        <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs Xibo</div>
-        <div style="font-size:13px;color:var(--muted)">Open source vs open source — and the paid players.</div>
-      </a>
-      <a href="/compare/anthias-alternative.html" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Compare</div>
-        <div style="font-weight:600;margin-bottom:4px">ScreenTinker vs Anthias</div>
-        <div style="font-size:13px;color:var(--muted)">Beyond one Pi, one screen.</div>
-      </a>
-      <a href="/integrations/" style="display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;color:var(--text);transition:border-color 0.2s">
-        <div style="font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px">Integrations</div>
-        <div style="font-weight:600;margin-bottom:4px">Connect Google Slides, Canva, Power BI &amp; more</div>
-        <div style="font-size:13px;color:var(--muted)">Native widgets + embed any web app.</div>
-      </a>
-    </div>
-  </section>
+    <!-- FAQ (visible copy mirrors the FAQPage JSON-LD below) -->
+    <section class="features" id="faq" style="max-width:820px">
+      <h2>Frequently Asked Questions</h2>
+      <p class="subtitle">Everything you need to know about running open-source digital signage.</p>
+      <div style="display:flex;flex-direction:column;gap:20px">
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">Is there free digital signage software?</h3>
+          <p style="color:var(--muted);font-size:15px">Yes. ScreenTinker is free and open source (MIT licensed). The
+            free cloud plan runs 1 display with 500 MB of storage, and if you self-host there's no per-screen fee at all
+            — run as many displays as your own server can handle. New accounts also get a 14-day Pro trial (15 displays)
+            with no credit card required.</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">Can I run digital signage on a Raspberry Pi?</h3>
+          <p style="color:var(--muted);font-size:15px">Yes. A Raspberry Pi 4 or newer makes an excellent low-cost
+            signage player. Our one-line installer sets up kiosk mode, auto-start, and pairing for you. See the full
+            walkthrough in our <a href="/guides/raspberry-pi-digital-signage.html">Raspberry Pi digital signage
+              guide</a>.</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">Does ScreenTinker work on Android TV and Fire TV?</h3>
+          <p style="color:var(--muted);font-size:15px">Yes. Install the free APK on any Android TV box or Amazon Fire TV
+            Stick to turn it into a managed signage display, complete with kiosk mode and live remote control.
+            Step-by-step instructions are in our <a href="/guides/digital-signage-android-tv.html">Android TV &amp; Fire
+              TV guide</a>. ScreenTinker also runs on Windows, ChromeOS, LG webOS, Samsung Tizen, and any web browser.
+          </p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">What's the difference between self-hosted and cloud digital
+            signage?</h3>
+          <p style="color:var(--muted);font-size:15px">With cloud, we host everything and you just sign in — the fastest
+            way to start. With self-hosting, you deploy ScreenTinker on your own server or VPS so your content and
+            device data never leave your network, with no recurring SaaS fees. You can switch later. Our <a
+              href="/guides/self-hosted-digital-signage.html">self-hosted digital signage guide</a> covers sizing,
+            deployment, TLS, and backups.</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">Is ScreenTinker really open source?</h3>
+          <p style="color:var(--muted);font-size:15px">Yes. The full platform is released under the permissive MIT
+            license on <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener">GitHub</a>.
+            You can read the code, self-host it, modify it, and even white-label it — no vendor lock-in and no
+            proprietary black box.</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">What can I put on my screens?</h3>
+          <p style="color:var(--muted);font-size:15px">Images, video, playlists, multi-zone layouts, and live widgets —
+            clocks, weather, RSS tickers, countdowns, QR codes, web pages, and scrolling lobby/staff directories. You
+            can schedule different content by day and time, per display or per group.</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">Do my displays keep playing if the internet goes down?</h3>
+          <p style="color:var(--muted);font-size:15px">Yes. ScreenTinker players cache their content locally and keep
+            playing during an internet or server outage, then sync automatically once the connection returns. No blank
+            screens.</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">Can I control my screens remotely?</h3>
+          <p style="color:var(--muted);font-size:15px">Yes, on every plan. See a live view of what's on each screen,
+            push content instantly, and send remote key presses or power commands. (Live view and key presses on Android
+            require the on-device accessibility permission.)</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">Is there a limit on how many screens I can manage?</h3>
+          <p style="color:var(--muted);font-size:15px">On cloud plans, your display count is set by your tier (1 free,
+            up to 15 on Pro, more on Enterprise). If you self-host, there is no built-in device cap — you're limited
+            only by your own hardware.</p>
+        </div>
+        <div>
+          <h3 style="font-size:18px;margin-bottom:6px">How does ScreenTinker compare to Yodeck, ScreenCloud, and
+            OptiSigns?</h3>
+          <p style="color:var(--muted);font-size:15px">ScreenTinker is typically a fraction of the price at scale and is
+            the only one of the four you can self-host. See the detailed breakdowns: <a
+              href="/compare/yodeck-alternative.html">vs Yodeck</a>, <a href="/compare/screencloud-alternative.html">vs
+              ScreenCloud</a>, and <a href="/compare/optisigns-alternative.html">vs OptiSigns</a>.</p>
+        </div>
+      </div>
+    </section>
 
-  <!-- FAQ (visible copy mirrors the FAQPage JSON-LD below) -->
-  <section class="features" id="faq" style="max-width:820px">
-    <h2>Frequently Asked Questions</h2>
-    <p class="subtitle">Everything you need to know about running open-source digital signage.</p>
-    <div style="display:flex;flex-direction:column;gap:20px">
-      <div><h3 style="font-size:18px;margin-bottom:6px">Is there free digital signage software?</h3><p style="color:var(--muted);font-size:15px">Yes. ScreenTinker is free and open source (MIT licensed). The free cloud plan runs 1 display with 500 MB of storage, and if you self-host there's no per-screen fee at all — run as many displays as your own server can handle. New accounts also get a 14-day Pro trial (15 displays) with no credit card required.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">Can I run digital signage on a Raspberry Pi?</h3><p style="color:var(--muted);font-size:15px">Yes. A Raspberry Pi 4 or newer makes an excellent low-cost signage player. Our one-line installer sets up kiosk mode, auto-start, and pairing for you. See the full walkthrough in our <a href="/guides/raspberry-pi-digital-signage.html">Raspberry Pi digital signage guide</a>.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">Does ScreenTinker work on Android TV and Fire TV?</h3><p style="color:var(--muted);font-size:15px">Yes. Install the free APK on any Android TV box or Amazon Fire TV Stick to turn it into a managed signage display, complete with kiosk mode and live remote control. Step-by-step instructions are in our <a href="/guides/digital-signage-android-tv.html">Android TV &amp; Fire TV guide</a>. ScreenTinker also runs on Windows, ChromeOS, LG webOS, Samsung Tizen, and any web browser.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">What's the difference between self-hosted and cloud digital signage?</h3><p style="color:var(--muted);font-size:15px">With cloud, we host everything and you just sign in — the fastest way to start. With self-hosting, you deploy ScreenTinker on your own server or VPS so your content and device data never leave your network, with no recurring SaaS fees. You can switch later. Our <a href="/guides/self-hosted-digital-signage.html">self-hosted digital signage guide</a> covers sizing, deployment, TLS, and backups.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">Is ScreenTinker really open source?</h3><p style="color:var(--muted);font-size:15px">Yes. The full platform is released under the permissive MIT license on <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener">GitHub</a>. You can read the code, self-host it, modify it, and even white-label it — no vendor lock-in and no proprietary black box.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">What can I put on my screens?</h3><p style="color:var(--muted);font-size:15px">Images, video, playlists, multi-zone layouts, and live widgets — clocks, weather, RSS tickers, countdowns, QR codes, web pages, and scrolling lobby/staff directories. You can schedule different content by day and time, per display or per group.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">Do my displays keep playing if the internet goes down?</h3><p style="color:var(--muted);font-size:15px">Yes. ScreenTinker players cache their content locally and keep playing during an internet or server outage, then sync automatically once the connection returns. No blank screens.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">Can I control my screens remotely?</h3><p style="color:var(--muted);font-size:15px">Yes, on every plan. See a live view of what's on each screen, push content instantly, and send remote key presses or power commands. (Live view and key presses on Android require the on-device accessibility permission.)</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">Is there a limit on how many screens I can manage?</h3><p style="color:var(--muted);font-size:15px">On cloud plans, your display count is set by your tier (1 free, up to 15 on Pro, more on Enterprise). If you self-host, there is no built-in device cap — you're limited only by your own hardware.</p></div>
-      <div><h3 style="font-size:18px;margin-bottom:6px">How does ScreenTinker compare to Yodeck, ScreenCloud, and OptiSigns?</h3><p style="color:var(--muted);font-size:15px">ScreenTinker is typically a fraction of the price at scale and is the only one of the four you can self-host. See the detailed breakdowns: <a href="/compare/yodeck-alternative.html">vs Yodeck</a>, <a href="/compare/screencloud-alternative.html">vs ScreenCloud</a>, and <a href="/compare/optisigns-alternative.html">vs OptiSigns</a>.</p></div>
-    </div>
-  </section>
-
-  <!-- CTA -->
-  <section class="cta">
-    <h2>Ready to Get Started?</h2>
-    <p>14-day free Pro trial. No credit card required. Set up in under 5 minutes.</p>
-    <a href="/app#/login" class="btn btn-primary" style="padding:14px 32px;font-size:16px">Start Free Trial</a>
-  </section>
+    <!-- CTA -->
+    <section class="cta">
+      <h2>Ready to Get Started?</h2>
+      <p>14-day free Pro trial. No credit card required. Set up in under 5 minutes.</p>
+      <a href="/app#/login" class="btn btn-primary" style="padding:14px 32px;font-size:16px">Start Free Trial</a>
+    </section>
   </main>
 
   <!-- Footer -->
   <footer style="border-top:1px solid var(--border);background:rgba(15,23,42,0.4)">
-    <div style="max-width:1200px;margin:0 auto;padding:48px 24px 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:32px">
+    <div
+      style="max-width:1200px;margin:0 auto;padding:48px 24px 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:32px">
       <div>
         <div style="font-weight:700;color:var(--accent);margin-bottom:12px">ScreenTinker</div>
-        <div style="font-size:13px;color:var(--muted);line-height:1.6">Open-source digital signage. Free plan, self-host or cloud. MIT licensed.</div>
+        <div style="font-size:13px;color:var(--muted);line-height:1.6">Open-source digital signage. Free plan, self-host
+          or cloud. MIT licensed.</div>
       </div>
       <div>
-        <div style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">Guides</div>
+        <div
+          style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">
+          Guides</div>
         <div style="display:flex;flex-direction:column;gap:6px;font-size:13px">
           <a href="/guides/raspberry-pi-digital-signage.html" style="color:var(--muted)">Raspberry Pi setup</a>
           <a href="/guides/digital-signage-android-tv.html" style="color:var(--muted)">Android TV &amp; Fire TV</a>
@@ -439,7 +1344,9 @@
         </div>
       </div>
       <div>
-        <div style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">Compare</div>
+        <div
+          style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">
+          Compare</div>
         <div style="display:flex;flex-direction:column;gap:6px;font-size:13px">
           <a href="/compare/yodeck-alternative.html" style="color:var(--muted)">vs Yodeck</a>
           <a href="/compare/screencloud-alternative.html" style="color:var(--muted)">vs ScreenCloud</a>
@@ -447,16 +1354,22 @@
         </div>
       </div>
       <div>
-        <div style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">Project</div>
+        <div
+          style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">
+          Project</div>
         <div style="display:flex;flex-direction:column;gap:6px;font-size:13px">
-          <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener" style="color:var(--muted)">GitHub</a>
+          <a href="https://github.com/screentinker/screentinker" target="_blank" rel="noopener"
+            style="color:var(--muted)">GitHub</a>
           <a href="https://discord.gg/utTdsrqq4Z" target="_blank" rel="noopener" style="color:var(--muted)">Discord</a>
-          <a href="https://www.youtube.com/@ScreenTinker" target="_blank" rel="noopener" style="color:var(--muted)">YouTube</a>
+          <a href="https://www.youtube.com/@ScreenTinker" target="_blank" rel="noopener"
+            style="color:var(--muted)">YouTube</a>
           <a href="/app#/login" style="color:var(--muted)">Sign in</a>
         </div>
       </div>
       <div>
-        <div style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">Legal</div>
+        <div
+          style="font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.5px">
+          Legal</div>
         <div style="display:flex;flex-direction:column;gap:6px;font-size:13px">
           <a href="/legal/terms.html" style="color:var(--muted)">Terms</a>
           <a href="/legal/privacy.html" style="color:var(--muted)">Privacy</a>
@@ -464,7 +1377,8 @@
         </div>
       </div>
     </div>
-    <div style="max-width:1200px;margin:0 auto;padding:16px 24px 32px;border-top:1px solid var(--border);color:var(--dim);font-size:13px;text-align:center">
+    <div
+      style="max-width:1200px;margin:0 auto;padding:16px 24px 32px;border-top:1px solid var(--border);color:var(--dim);font-size:13px;text-align:center">
       &copy; 2026 ScreenTinker. All rights reserved.
     </div>
   </footer>
@@ -479,11 +1393,13 @@
         <button type="button" class="modal-close" onclick="closeContactModal()" aria-label="Close">&times;</button>
       </div>
       <div class="modal-body">
-        <p class="modal-description">Tell us about your deployment and we'll get back to you within one business day.</p>
+        <p class="modal-description">Tell us about your deployment and we'll get back to you within one business day.
+        </p>
         <form id="contactForm" novalidate>
           <label>Name *<input name="name" type="text" required autocomplete="name" maxlength="200"></label>
           <label>Email *<input name="email" type="email" required autocomplete="email" maxlength="200"></label>
-          <label>Company / organization *<input name="company" type="text" required autocomplete="organization" maxlength="200"></label>
+          <label>Company / organization *<input name="company" type="text" required autocomplete="organization"
+              maxlength="200"></label>
           <label>Estimated number of screens *<input name="screens" type="number" min="1" max="100000" required></label>
           <label>Multi-tenant? *
             <select name="multi_tenant" required>
@@ -637,8 +1553,8 @@
       const planCardsHtml = publicPlans.map((p, i) => `
         <div class="price-card ${i === 2 ? 'featured' : ''}">
           <h3>${p.display_name}</h3>
-          <div class="price">${p.price_monthly > 0 ? '$' + p.price_monthly : 'Free'}<span>${p.price_monthly > 0 ? '/mo' : ''}</span></div>
-          ${p.price_yearly > 0 ? `<div class="yearly">or $${p.price_yearly}/year (save ${Math.round((1 - p.price_yearly / (p.price_monthly * 12)) * 100)}%)</div>` : '<div class="yearly">&nbsp;</div>'}
+          <div class="price">${p.price_monthly > 0 ? '€' + p.price_monthly : 'Free'}<span>${p.price_monthly > 0 ? '/mo' : ''}</span></div>
+          ${p.price_yearly > 0 ? `<div class="yearly">or €${p.price_yearly}/year (save ${Math.round((1 - p.price_yearly / (p.price_monthly * 12)) * 100)}%)</div>` : '<div class="yearly">&nbsp;</div>'}
           <ul>
             <li>${p.max_devices === -1 ? 'Unlimited' : p.max_devices} device${p.max_devices !== 1 ? 's' : ''}</li>
             <li>${p.max_storage_mb === -1 ? 'Unlimited' : p.max_storage_mb >= 1024 ? (p.max_storage_mb / 1024) + ' GB' : p.max_storage_mb + ' MB'} storage</li>
@@ -682,17 +1598,17 @@
     // Contact modal: open/close, submit, validation. Functions are attached
     // to window so the inline onclick handlers on the Contact Us button (in
     // the dynamically-rendered pricing card) can find them.
-    window.openContactModal = function() {
+    window.openContactModal = function () {
       document.getElementById('contactModal').style.display = 'flex';
       setTimeout(() => document.querySelector('#contactForm input[name="name"]')?.focus(), 50);
     };
-    window.closeContactModal = function() {
+    window.closeContactModal = function () {
       document.getElementById('contactModal').style.display = 'none';
       const status = document.getElementById('contactFormStatus');
       status.className = '';
       status.textContent = '';
     };
-    window.submitContactForm = async function() {
+    window.submitContactForm = async function () {
       const form = document.getElementById('contactForm');
       const status = document.getElementById('contactFormStatus');
       const btn = document.getElementById('contactSubmitBtn');
@@ -747,4 +1663,5 @@
     });
   </script>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/frontend/legal/privacy.html b/frontend/legal/privacy.html
index c82d217..57fc8ab 100644
--- a/frontend/legal/privacy.html
+++ b/frontend/legal/privacy.html
@@ -1,27 +1,105 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Privacy Policy - ScreenTinker</title>
   <style>
-    * { margin:0; padding:0; box-sizing:border-box; }
-    body { font-family:-apple-system,sans-serif; background:#111827; color:#e2e8f0; line-height:1.8; }
-    .container { max-width:800px; margin:0 auto; padding:40px 24px 80px; }
-    h1 { color:#3b82f6; font-size:32px; margin-bottom:8px; }
-    .updated { color:#64748b; font-size:14px; margin-bottom:40px; }
-    h2 { color:#f1f5f9; font-size:20px; margin:32px 0 12px; }
-    h3 { color:#cbd5e1; font-size:16px; margin:20px 0 8px; }
-    p, li { color:#94a3b8; font-size:15px; margin-bottom:12px; }
-    ul { padding-left:24px; }
-    a { color:#3b82f6; }
-    .back { display:inline-flex; align-items:center; gap:6px; color:#64748b; font-size:13px; margin-bottom:24px; text-decoration:none; }
-    .back:hover { color:#94a3b8; }
-    table { width:100%; border-collapse:collapse; margin:16px 0; }
-    th, td { padding:10px 12px; text-align:left; border-bottom:1px solid #1e293b; font-size:14px; color:#94a3b8; }
-    th { color:#cbd5e1; font-weight:600; }
+    * {
+      margin: 0;
+      padding: 0;
+      box-sizing: border-box;
+    }
+
+    body {
+      font-family: -apple-system, sans-serif;
+      background: #111827;
+      color: #e2e8f0;
+      line-height: 1.8;
+    }
+
+    .container {
+      max-width: 800px;
+      margin: 0 auto;
+      padding: 40px 24px 80px;
+    }
+
+    h1 {
+      color: #e65c00;
+      font-size: 32px;
+      margin-bottom: 8px;
+    }
+
+    .updated {
+      color: #64748b;
+      font-size: 14px;
+      margin-bottom: 40px;
+    }
+
+    h2 {
+      color: #f1f5f9;
+      font-size: 20px;
+      margin: 32px 0 12px;
+    }
+
+    h3 {
+      color: #cbd5e1;
+      font-size: 16px;
+      margin: 20px 0 8px;
+    }
+
+    p,
+    li {
+      color: #94a3b8;
+      font-size: 15px;
+      margin-bottom: 12px;
+    }
+
+    ul {
+      padding-left: 24px;
+    }
+
+    a {
+      color: #e65c00;
+    }
+
+    .back {
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+      color: #64748b;
+      font-size: 13px;
+      margin-bottom: 24px;
+      text-decoration: none;
+    }
+
+    .back:hover {
+      color: #94a3b8;
+    }
+
+    table {
+      width: 100%;
+      border-collapse: collapse;
+      margin: 16px 0;
+    }
+
+    th,
+    td {
+      padding: 10px 12px;
+      text-align: left;
+      border-bottom: 1px solid #1e293b;
+      font-size: 14px;
+      color: #94a3b8;
+    }
+
+    th {
+      color: #cbd5e1;
+      font-weight: 600;
+    }
   </style>
 </head>
+
 <body>
   <div class="container">
     <a href="/" class="back">&larr; Back to ScreenTinker</a>
@@ -29,65 +107,157 @@
     <p class="updated">Last updated: May 15, 2026</p>
 
     <h2>1. Overview</h2>
-    <p>ScreenTinker ("we", "us", "our") respects your privacy. This policy explains what data we collect, how we use it, and your rights regarding your information.</p>
+    <p>ScreenTinker ("we", "us", "our") respects your privacy. This policy explains what data we collect, how we use it,
+      and your rights regarding your information.</p>
 
     <h2>2. Information We Collect</h2>
 
     <h3>2.1 Account Information</h3>
     <table>
-      <tr><th>Data</th><th>Purpose</th><th>Retention</th></tr>
-      <tr><td>Email address</td><td>Authentication, notifications</td><td>Until account deletion</td></tr>
-      <tr><td>Name</td><td>Display in dashboard</td><td>Until account deletion</td></tr>
-      <tr><td>Password hash</td><td>Authentication (bcrypt, never stored in plain text)</td><td>Until account deletion</td></tr>
-      <tr><td>OAuth provider ID</td><td>Google/Microsoft sign-in</td><td>Until account deletion</td></tr>
+      <tr>
+        <th>Data</th>
+        <th>Purpose</th>
+        <th>Retention</th>
+      </tr>
+      <tr>
+        <td>Email address</td>
+        <td>Authentication, notifications</td>
+        <td>Until account deletion</td>
+      </tr>
+      <tr>
+        <td>Name</td>
+        <td>Display in dashboard</td>
+        <td>Until account deletion</td>
+      </tr>
+      <tr>
+        <td>Password hash</td>
+        <td>Authentication (bcrypt, never stored in plain text)</td>
+        <td>Until account deletion</td>
+      </tr>
+      <tr>
+        <td>OAuth provider ID</td>
+        <td>Google/Microsoft sign-in</td>
+        <td>Until account deletion</td>
+      </tr>
     </table>
 
     <h3>2.2 Device Information</h3>
     <table>
-      <tr><th>Data</th><th>Purpose</th><th>Retention</th></tr>
-      <tr><td>Device ID</td><td>Unique device identification</td><td>Until device removal</td></tr>
-      <tr><td>IP address</td><td>Network connectivity, security</td><td>Overwritten each connection</td></tr>
-      <tr><td>Android version, screen resolution</td><td>Compatibility, display optimization</td><td>Until device removal</td></tr>
-      <tr><td>Battery, storage, RAM, CPU, WiFi</td><td>Device health monitoring</td><td>90 days (rolling)</td></tr>
-      <tr><td>Device fingerprint (hardware hash)</td><td>Prevent trial abuse</td><td>Until device removal</td></tr>
+      <tr>
+        <th>Data</th>
+        <th>Purpose</th>
+        <th>Retention</th>
+      </tr>
+      <tr>
+        <td>Device ID</td>
+        <td>Unique device identification</td>
+        <td>Until device removal</td>
+      </tr>
+      <tr>
+        <td>IP address</td>
+        <td>Network connectivity, security</td>
+        <td>Overwritten each connection</td>
+      </tr>
+      <tr>
+        <td>Android version, screen resolution</td>
+        <td>Compatibility, display optimization</td>
+        <td>Until device removal</td>
+      </tr>
+      <tr>
+        <td>Battery, storage, RAM, CPU, WiFi</td>
+        <td>Device health monitoring</td>
+        <td>90 days (rolling)</td>
+      </tr>
+      <tr>
+        <td>Device fingerprint (hardware hash)</td>
+        <td>Prevent trial abuse</td>
+        <td>Until device removal</td>
+      </tr>
     </table>
 
     <h3>2.3 Usage Data</h3>
     <table>
-      <tr><th>Data</th><th>Purpose</th><th>Retention</th></tr>
-      <tr><td>Content play logs</td><td>Proof-of-play reporting</td><td>90 days</td></tr>
-      <tr><td>Activity log (API actions)</td><td>Audit trail, security</td><td>90 days</td></tr>
-      <tr><td>Screenshots (on-demand)</td><td>Remote monitoring</td><td>Latest only per device</td></tr>
+      <tr>
+        <th>Data</th>
+        <th>Purpose</th>
+        <th>Retention</th>
+      </tr>
+      <tr>
+        <td>Content play logs</td>
+        <td>Proof-of-play reporting</td>
+        <td>90 days</td>
+      </tr>
+      <tr>
+        <td>Activity log (API actions)</td>
+        <td>Audit trail, security</td>
+        <td>90 days</td>
+      </tr>
+      <tr>
+        <td>Screenshots (on-demand)</td>
+        <td>Remote monitoring</td>
+        <td>Latest only per device</td>
+      </tr>
     </table>
 
     <h3>2.4 Content</h3>
-    <p>Media files (images, videos) you upload are stored on our servers solely to deliver them to your devices. We do not analyze, sell, or share your content.</p>
+    <p>Media files (images, videos) you upload are stored on our servers solely to deliver them to your devices. We do
+      not analyze, sell, or share your content.</p>
 
     <h3>2.5 Error and Diagnostic Telemetry</h3>
-    <p>Player clients submit error reports automatically so we can fix issues on devices we cannot directly access (smart TVs, embedded signage browsers). Reports may be submitted before a device has paired; in that case only the network IP and user-agent are present, with no device ID.</p>
+    <p>Player clients submit error reports automatically so we can fix issues on devices we cannot directly access
+      (smart TVs, embedded signage browsers). Reports may be submitted before a device has paired; in that case only the
+      network IP and user-agent are present, with no device ID.</p>
     <table>
-      <tr><th>Data</th><th>Purpose</th><th>Retention</th></tr>
-      <tr><td>Browser user-agent string</td><td>Identifying which player platforms encounter errors</td><td>Rolling buffer (10,000 entries)</td></tr>
-      <tr><td>Error messages, stack traces, and source-file references</td><td>Diagnosing player issues we cannot reproduce in development</td><td>Rolling buffer (10,000 entries)</td></tr>
-      <tr><td>Recent player log entries (up to 50, including filenames of content being played)</td><td>Context for the error so we understand what the player was doing</td><td>Rolling buffer (10,000 entries)</td></tr>
-      <tr><td>Screen and viewport dimensions</td><td>Diagnosing layout and rendering issues at the device's actual size</td><td>Rolling buffer (10,000 entries)</td></tr>
-      <tr><td>Coarse player state (idle, playing, waiting)</td><td>Distinguishing errors during playback vs setup</td><td>Rolling buffer (10,000 entries)</td></tr>
+      <tr>
+        <th>Data</th>
+        <th>Purpose</th>
+        <th>Retention</th>
+      </tr>
+      <tr>
+        <td>Browser user-agent string</td>
+        <td>Identifying which player platforms encounter errors</td>
+        <td>Rolling buffer (10,000 entries)</td>
+      </tr>
+      <tr>
+        <td>Error messages, stack traces, and source-file references</td>
+        <td>Diagnosing player issues we cannot reproduce in development</td>
+        <td>Rolling buffer (10,000 entries)</td>
+      </tr>
+      <tr>
+        <td>Recent player log entries (up to 50, including filenames of content being played)</td>
+        <td>Context for the error so we understand what the player was doing</td>
+        <td>Rolling buffer (10,000 entries)</td>
+      </tr>
+      <tr>
+        <td>Screen and viewport dimensions</td>
+        <td>Diagnosing layout and rendering issues at the device's actual size</td>
+        <td>Rolling buffer (10,000 entries)</td>
+      </tr>
+      <tr>
+        <td>Coarse player state (idle, playing, waiting)</td>
+        <td>Distinguishing errors during playback vs setup</td>
+        <td>Rolling buffer (10,000 entries)</td>
+      </tr>
     </table>
-    <p>This telemetry can be disabled by self-hosters via the <code>PLAYER_DEBUG_REPORTING=off</code> environment variable. On screentinker.com it is on by default.</p>
+    <p>This telemetry can be disabled by self-hosters via the <code>PLAYER_DEBUG_REPORTING=off</code> environment
+      variable. On screentinker.com it is on by default.</p>
 
     <h2>3. How We Use Your Information</h2>
     <ul>
-      <li><strong>Provide the Service:</strong> Deliver content to devices, enable remote management, process subscriptions</li>
+      <li><strong>Provide the Service:</strong> Deliver content to devices, enable remote management, process
+        subscriptions</li>
       <li><strong>Security:</strong> Detect unauthorized access, prevent abuse, protect accounts</li>
       <li><strong>Communications:</strong> Send device offline alerts, subscription notifications, service updates</li>
-      <li><strong>Improvement:</strong> Analyze aggregate usage patterns to improve the Service (no individual tracking)</li>
+      <li><strong>Improvement:</strong> Analyze aggregate usage patterns to improve the Service (no individual tracking)
+      </li>
     </ul>
 
     <h2>4. Data Sharing</h2>
     <p>We do not sell your personal information. We share data only in these limited circumstances:</p>
     <ul>
       <li><strong>Service providers:</strong> Payment processing (Stripe), email delivery, hosting infrastructure</li>
-      <li><strong>Team members:</strong> If you belong to a team, other team members can see shared devices and content</li>
+      <li><strong>Team members:</strong> If you belong to a team, other team members can see shared devices and content
+      </li>
       <li><strong>Legal requirements:</strong> When required by law, subpoena, or court order</li>
       <li><strong>Business transfers:</strong> In the event of a merger, acquisition, or sale of assets</li>
     </ul>
@@ -97,7 +267,9 @@
     <ul>
       <li>All data stays on your servers. We have no access to it.</li>
       <li>You are the data controller and responsible for compliance with applicable privacy laws.</li>
-      <li>No telemetry or usage data is sent to us from self-hosted instances. The error and diagnostic telemetry described in Section 2.5 is collected by the self-hosted server itself, not transmitted externally, and can be disabled entirely with <code>PLAYER_DEBUG_REPORTING=off</code>.</li>
+      <li>No telemetry or usage data is sent to us from self-hosted instances. The error and diagnostic telemetry
+        described in Section 2.5 is collected by the self-hosted server itself, not transmitted externally, and can be
+        disabled entirely with <code>PLAYER_DEBUG_REPORTING=off</code>.</li>
     </ul>
 
     <h2>6. Data Security</h2>
@@ -129,10 +301,12 @@
     </ul>
 
     <h2>9. Children's Privacy</h2>
-    <p>The Service is not intended for use by children under 13. We do not knowingly collect information from children under 13.</p>
+    <p>The Service is not intended for use by children under 13. We do not knowingly collect information from children
+      under 13.</p>
 
     <h2>10. International Data Transfers</h2>
-    <p>If you access the Service from outside the United States, your data may be transferred to and processed in the United States. By using the Service, you consent to this transfer.</p>
+    <p>If you access the Service from outside the United States, your data may be transferred to and processed in the
+      United States. By using the Service, you consent to this transfer.</p>
 
     <h2>11. Data Retention</h2>
     <ul>
@@ -140,17 +314,20 @@
       <li>Device telemetry: 90 days (automatically pruned)</li>
       <li>Play logs: 90 days (automatically pruned)</li>
       <li>Activity logs: 90 days (automatically pruned)</li>
-      <li>Error and diagnostic telemetry: rolling buffer of the 10,000 most recent entries (oldest pruned on insert)</li>
+      <li>Error and diagnostic telemetry: rolling buffer of the 10,000 most recent entries (oldest pruned on insert)
+      </li>
       <li>Content: retained until you delete it or your account</li>
       <li>After account deletion: all data removed within 30 days</li>
     </ul>
 
     <h2>12. Changes to This Policy</h2>
-    <p>We may update this policy from time to time. We will notify registered users of material changes via email. The "Last updated" date will be revised accordingly.</p>
+    <p>We may update this policy from time to time. We will notify registered users of material changes via email. The
+      "Last updated" date will be revised accordingly.</p>
 
     <h2>13. Contact Us</h2>
     <p>For privacy-related questions or data requests, contact us at:</p>
     <p>Email: support@screentinker.com</p>
   </div>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/frontend/legal/terms.html b/frontend/legal/terms.html
index 8bd094f..dc8a283 100644
--- a/frontend/legal/terms.html
+++ b/frontend/legal/terms.html
@@ -1,23 +1,79 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Terms of Service - ScreenTinker</title>
   <style>
-    * { margin:0; padding:0; box-sizing:border-box; }
-    body { font-family:-apple-system,sans-serif; background:#111827; color:#e2e8f0; line-height:1.8; }
-    .container { max-width:800px; margin:0 auto; padding:40px 24px 80px; }
-    h1 { color:#3b82f6; font-size:32px; margin-bottom:8px; }
-    .updated { color:#64748b; font-size:14px; margin-bottom:40px; }
-    h2 { color:#f1f5f9; font-size:20px; margin:32px 0 12px; }
-    p, li { color:#94a3b8; font-size:15px; margin-bottom:12px; }
-    ul { padding-left:24px; }
-    a { color:#3b82f6; }
-    .back { display:inline-flex; align-items:center; gap:6px; color:#64748b; font-size:13px; margin-bottom:24px; text-decoration:none; }
-    .back:hover { color:#94a3b8; }
+    * {
+      margin: 0;
+      padding: 0;
+      box-sizing: border-box;
+    }
+
+    body {
+      font-family: -apple-system, sans-serif;
+      background: #111827;
+      color: #e2e8f0;
+      line-height: 1.8;
+    }
+
+    .container {
+      max-width: 800px;
+      margin: 0 auto;
+      padding: 40px 24px 80px;
+    }
+
+    h1 {
+      color: #e65c00;
+      font-size: 32px;
+      margin-bottom: 8px;
+    }
+
+    .updated {
+      color: #64748b;
+      font-size: 14px;
+      margin-bottom: 40px;
+    }
+
+    h2 {
+      color: #f1f5f9;
+      font-size: 20px;
+      margin: 32px 0 12px;
+    }
+
+    p,
+    li {
+      color: #94a3b8;
+      font-size: 15px;
+      margin-bottom: 12px;
+    }
+
+    ul {
+      padding-left: 24px;
+    }
+
+    a {
+      color: #e65c00;
+    }
+
+    .back {
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+      color: #64748b;
+      font-size: 13px;
+      margin-bottom: 24px;
+      text-decoration: none;
+    }
+
+    .back:hover {
+      color: #94a3b8;
+    }
   </style>
 </head>
+
 <body>
   <div class="container">
     <a href="/" class="back">&larr; Back to ScreenTinker</a>
@@ -25,13 +81,16 @@
     <p class="updated">Last updated: April 24, 2026</p>
 
     <h2>1. Acceptance of Terms</h2>
-    <p>By accessing or using ScreenTinker ("the Service"), you agree to be bound by these Terms of Service. If you do not agree, do not use the Service.</p>
+    <p>By accessing or using ScreenTinker ("the Service"), you agree to be bound by these Terms of Service. If you do
+      not agree, do not use the Service.</p>
 
     <h2>2. Description of Service</h2>
-    <p>ScreenTinker is a digital signage management platform that allows users to remotely manage content on display devices. The Service includes a web dashboard, API, Android application, web player, and related tools.</p>
+    <p>ScreenTinker is a digital signage management platform that allows users to remotely manage content on display
+      devices. The Service includes a web dashboard, API, Android application, web player, and related tools.</p>
 
     <h2>3. Accounts</h2>
-    <p>You must provide accurate information when creating an account. You are responsible for maintaining the security of your account credentials. You must notify us immediately of any unauthorized use of your account.</p>
+    <p>You must provide accurate information when creating an account. You are responsible for maintaining the security
+      of your account credentials. You must notify us immediately of any unauthorized use of your account.</p>
 
     <h2>4. Subscription Plans and Billing</h2>
     <ul>
@@ -56,13 +115,20 @@
     </ul>
 
     <h2>5.1 Prohibited Content - Zero Tolerance</h2>
-    <p>ScreenTinker maintains zero tolerance for child sexual abuse material (CSAM). Any account found to upload, display, transmit, or facilitate the distribution of such material will be immediately terminated and reported to the National Center for Missing and Exploited Children (NCMEC) and appropriate law enforcement agencies, as required under 18 U.S.C. 2258A.</p>
-    <p>All account data, upload records, IP logs, and device telemetry associated with such violations will be preserved and provided to law enforcement pursuant to lawful requests. This policy applies to all content uploaded, displayed, or transmitted through the Service, including content on connected devices, in the web player, and through the API.</p>
+    <p>ScreenTinker maintains zero tolerance for child sexual abuse material (CSAM). Any account found to upload,
+      display, transmit, or facilitate the distribution of such material will be immediately terminated and reported to
+      the National Center for Missing and Exploited Children (NCMEC) and appropriate law enforcement agencies, as
+      required under 18 U.S.C. 2258A.</p>
+    <p>All account data, upload records, IP logs, and device telemetry associated with such violations will be preserved
+      and provided to law enforcement pursuant to lawful requests. This policy applies to all content uploaded,
+      displayed, or transmitted through the Service, including content on connected devices, in the web player, and
+      through the API.</p>
 
     <h2>6. Content</h2>
     <ul>
       <li>You retain ownership of content you upload to the Service.</li>
-      <li>You grant us a limited license to store, transmit, and display your content as necessary to provide the Service.</li>
+      <li>You grant us a limited license to store, transmit, and display your content as necessary to provide the
+        Service.</li>
       <li>You are solely responsible for ensuring you have the rights to display any content you upload.</li>
       <li>We may remove content that violates these terms or applicable law.</li>
     </ul>
@@ -93,31 +159,49 @@
     </ul>
 
     <h2>11. Intellectual Property</h2>
-    <p>The ScreenTinker software, dashboard, APIs, and documentation are our intellectual property. Your subscription grants you a license to use the Service, not ownership of the software.</p>
-    <p>ScreenTinker incorporates open-source software components licensed under MIT and Apache 2.0 licenses. A complete list of third-party software and their licenses is available at our <a href="/legal/third-party.html">Third-Party Software Notices</a> page.</p>
+    <p>The ScreenTinker software, dashboard, APIs, and documentation are our intellectual property. Your subscription
+      grants you a license to use the Service, not ownership of the software.</p>
+    <p>ScreenTinker incorporates open-source software components licensed under MIT and Apache 2.0 licenses. A complete
+      list of third-party software and their licenses is available at our <a href="/legal/third-party.html">Third-Party
+        Software Notices</a> page.</p>
 
     <h2>12. Restrictions</h2>
-    <p>The core ScreenTinker software is open-source and available at <a href="https://github.com/screentinker/screentinker">github.com/screentinker/screentinker</a> under the MIT License. The restrictions in this section apply only to the hosted Service at screentinker.com and to proprietary components that are not published under the MIT License, including the license key generation and validation system, billing infrastructure, and internal deployment tooling.</p>
-    <p>In connection with your use of the hosted Service and those proprietary components, you agree not to, and will not permit others to:</p>
+    <p>The core ScreenTinker software is open-source and available at <a
+        href="https://github.com/screentinker/screentinker">github.com/screentinker/screentinker</a> under the MIT
+      License. The restrictions in this section apply only to the hosted Service at screentinker.com and to proprietary
+      components that are not published under the MIT License, including the license key generation and validation
+      system, billing infrastructure, and internal deployment tooling.</p>
+    <p>In connection with your use of the hosted Service and those proprietary components, you agree not to, and will
+      not permit others to:</p>
     <ul>
-      <li>Circumvent, bypass, disable, tamper with, or forge any license keys, authentication, or usage-tracking mechanisms</li>
+      <li>Circumvent, bypass, disable, tamper with, or forge any license keys, authentication, or usage-tracking
+        mechanisms</li>
       <li>Share, transfer, or assign your account credentials, license keys, or API tokens to unauthorized parties</li>
       <li>Overload, attack, or otherwise abuse the hosted platform or its infrastructure</li>
-      <li>Scrape, crawl, or programmatically extract data from the hosted Service beyond the provided API and documented rate limits</li>
+      <li>Scrape, crawl, or programmatically extract data from the hosted Service beyond the provided API and documented
+        rate limits</li>
       <li>Operate the hosted Service beyond the scope of your current subscription plan</li>
-      <li>Reverse engineer, decompile, or attempt to derive the source code of proprietary components not published under the MIT License</li>
+      <li>Reverse engineer, decompile, or attempt to derive the source code of proprietary components not published
+        under the MIT License</li>
     </ul>
-    <p>Violation of these restrictions may result in immediate termination of your account and may subject you to legal action. Nothing in this section limits, modifies, or overrides any rights granted to you by the MIT License covering the open-source portion of ScreenTinker, which governs that code exclusively.</p>
+    <p>Violation of these restrictions may result in immediate termination of your account and may subject you to legal
+      action. Nothing in this section limits, modifies, or overrides any rights granted to you by the MIT License
+      covering the open-source portion of ScreenTinker, which governs that code exclusively.</p>
 
     <h2>13. License Keys and Self-Hosted Deployments</h2>
     <ul>
       <li>Self-hosted Enterprise deployments require a valid license key issued by ScreenTinker.</li>
       <li>License keys are non-transferable and tied to a specific organization.</li>
-      <li>License keys are issued for a specific term (monthly or annual) and must be renewed to maintain functionality.</li>
-      <li>Upon expiration of a license key, the Software will enter a grace period of 14 days, during which functionality is preserved but a renewal notice is displayed.</li>
-      <li>After the grace period, the Software will operate in a limited mode equivalent to the Free plan until a valid license key is provided.</li>
-      <li>Tampering with, bypassing, or forging license keys is strictly prohibited and constitutes a material breach of these terms.</li>
-      <li>We reserve the right to remotely verify license key validity and disable functionality for invalid or expired keys.</li>
+      <li>License keys are issued for a specific term (monthly or annual) and must be renewed to maintain functionality.
+      </li>
+      <li>Upon expiration of a license key, the Software will enter a grace period of 14 days, during which
+        functionality is preserved but a renewal notice is displayed.</li>
+      <li>After the grace period, the Software will operate in a limited mode equivalent to the Free plan until a valid
+        license key is provided.</li>
+      <li>Tampering with, bypassing, or forging license keys is strictly prohibited and constitutes a material breach of
+        these terms.</li>
+      <li>We reserve the right to remotely verify license key validity and disable functionality for invalid or expired
+        keys.</li>
     </ul>
 
     <h2>14. Termination</h2>
@@ -128,18 +212,27 @@
     </ul>
 
     <h2>15. Limitation of Liability</h2>
-    <p>THE SERVICE IS PROVIDED "AS IS" WITHOUT WARRANTIES OF ANY KIND. IN NO EVENT SHALL WE BE LIABLE FOR ANY INDIRECT, INCIDENTAL, SPECIAL, CONSEQUENTIAL, OR PUNITIVE DAMAGES ARISING FROM YOUR USE OF THE SERVICE.</p>
+    <p>THE SERVICE IS PROVIDED "AS IS" WITHOUT WARRANTIES OF ANY KIND. IN NO EVENT SHALL WE BE LIABLE FOR ANY INDIRECT,
+      INCIDENTAL, SPECIAL, CONSEQUENTIAL, OR PUNITIVE DAMAGES ARISING FROM YOUR USE OF THE SERVICE.</p>
 
     <h2>16. Changes to Terms</h2>
-    <p>We may update these terms from time to time. We will notify registered users of material changes via email. Continued use of the Service after changes constitutes acceptance.</p>
+    <p>We may update these terms from time to time. We will notify registered users of material changes via email.
+      Continued use of the Service after changes constitutes acceptance.</p>
 
     <h2>17. Governing Law and Jurisdiction</h2>
-    <p>These Terms of Service are governed by and construed in accordance with the laws of the State of Wisconsin, United States, without regard to its conflict of law provisions. Any dispute arising out of or relating to these terms or the Service shall be resolved exclusively in the state or federal courts located in Kenosha County, Wisconsin, and you consent to the personal jurisdiction of those courts.</p>
-    <p>Users accessing the Service from outside the United States acknowledge that the Service is operated from and governed by the laws of the United States and the State of Wisconsin.</p>
-    <p>If any provision of these terms is held invalid or unenforceable by a court of competent jurisdiction, that provision shall be enforced to the maximum extent permissible and the remaining provisions shall remain in full force and effect.</p>
+    <p>These Terms of Service are governed by and construed in accordance with the laws of the State of Wisconsin,
+      United States, without regard to its conflict of law provisions. Any dispute arising out of or relating to these
+      terms or the Service shall be resolved exclusively in the state or federal courts located in Kenosha County,
+      Wisconsin, and you consent to the personal jurisdiction of those courts.</p>
+    <p>Users accessing the Service from outside the United States acknowledge that the Service is operated from and
+      governed by the laws of the United States and the State of Wisconsin.</p>
+    <p>If any provision of these terms is held invalid or unenforceable by a court of competent jurisdiction, that
+      provision shall be enforced to the maximum extent permissible and the remaining provisions shall remain in full
+      force and effect.</p>
 
     <h2>18. Contact</h2>
     <p>For questions about these terms, contact us at support@screentinker.com</p>
   </div>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/frontend/legal/third-party.html b/frontend/legal/third-party.html
index 1938491..09d3b0c 100644
--- a/frontend/legal/third-party.html
+++ b/frontend/legal/third-party.html
@@ -1,58 +1,227 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Third-Party Licenses - ScreenTinker</title>
   <style>
-    * { margin:0; padding:0; box-sizing:border-box; }
-    body { font-family:-apple-system,sans-serif; background:#111827; color:#e2e8f0; line-height:1.8; }
-    .container { max-width:800px; margin:0 auto; padding:40px 24px 80px; }
-    h1 { color:#3b82f6; font-size:32px; margin-bottom:8px; }
-    .updated { color:#64748b; font-size:14px; margin-bottom:40px; }
-    h2 { color:#f1f5f9; font-size:18px; margin:32px 0 8px; }
-    p, li { color:#94a3b8; font-size:14px; margin-bottom:8px; }
-    a { color:#3b82f6; }
-    .back { display:inline-flex; align-items:center; gap:6px; color:#64748b; font-size:13px; margin-bottom:24px; text-decoration:none; }
-    .back:hover { color:#94a3b8; }
-    .license-block { background:#0f172a; border:1px solid #1e293b; border-radius:8px; padding:16px; margin:12px 0 24px; font-size:12px; font-family:monospace; white-space:pre-wrap; color:#64748b; overflow-x:auto; }
-    table { width:100%; border-collapse:collapse; margin:16px 0 32px; }
-    th, td { padding:10px 12px; text-align:left; border-bottom:1px solid #1e293b; font-size:13px; color:#94a3b8; }
-    th { color:#cbd5e1; font-weight:600; }
+    * {
+      margin: 0;
+      padding: 0;
+      box-sizing: border-box;
+    }
+
+    body {
+      font-family: -apple-system, sans-serif;
+      background: #111827;
+      color: #e2e8f0;
+      line-height: 1.8;
+    }
+
+    .container {
+      max-width: 800px;
+      margin: 0 auto;
+      padding: 40px 24px 80px;
+    }
+
+    h1 {
+      color: #e65c00;
+      font-size: 32px;
+      margin-bottom: 8px;
+    }
+
+    .updated {
+      color: #64748b;
+      font-size: 14px;
+      margin-bottom: 40px;
+    }
+
+    h2 {
+      color: #f1f5f9;
+      font-size: 18px;
+      margin: 32px 0 8px;
+    }
+
+    p,
+    li {
+      color: #94a3b8;
+      font-size: 14px;
+      margin-bottom: 8px;
+    }
+
+    a {
+      color: #e65c00;
+    }
+
+    .back {
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+      color: #64748b;
+      font-size: 13px;
+      margin-bottom: 24px;
+      text-decoration: none;
+    }
+
+    .back:hover {
+      color: #94a3b8;
+    }
+
+    .license-block {
+      background: #0f172a;
+      border: 1px solid #1e293b;
+      border-radius: 8px;
+      padding: 16px;
+      margin: 12px 0 24px;
+      font-size: 12px;
+      font-family: monospace;
+      white-space: pre-wrap;
+      color: #64748b;
+      overflow-x: auto;
+    }
+
+    table {
+      width: 100%;
+      border-collapse: collapse;
+      margin: 16px 0 32px;
+    }
+
+    th,
+    td {
+      padding: 10px 12px;
+      text-align: left;
+      border-bottom: 1px solid #1e293b;
+      font-size: 13px;
+      color: #94a3b8;
+    }
+
+    th {
+      color: #cbd5e1;
+      font-weight: 600;
+    }
   </style>
 </head>
+
 <body>
   <div class="container">
     <a href="/" class="back">&larr; Back to ScreenTinker</a>
     <h1>Third-Party Software Notices</h1>
     <p class="updated">Last updated: March 24, 2026</p>
 
-    <p>ScreenTinker uses the following open-source software components. We gratefully acknowledge the contributions of these projects and their maintainers.</p>
+    <p>ScreenTinker uses the following open-source software components. We gratefully acknowledge the contributions of
+      these projects and their maintainers.</p>
 
     <h2>Summary</h2>
     <table>
-      <thead><tr><th>Package</th><th>License</th><th>Use</th></tr></thead>
+      <thead>
+        <tr>
+          <th>Package</th>
+          <th>License</th>
+          <th>Use</th>
+        </tr>
+      </thead>
       <tbody>
-        <tr><td>Express</td><td>MIT</td><td>Web server framework</td></tr>
-        <tr><td>Socket.IO</td><td>MIT</td><td>Real-time WebSocket communication</td></tr>
-        <tr><td>better-sqlite3</td><td>MIT</td><td>SQLite database driver</td></tr>
-        <tr><td>Multer</td><td>MIT</td><td>File upload handling</td></tr>
-        <tr><td>uuid</td><td>MIT</td><td>Unique ID generation</td></tr>
-        <tr><td>Sharp</td><td>Apache 2.0</td><td>Image processing and thumbnails</td></tr>
-        <tr><td>cors</td><td>MIT</td><td>Cross-origin resource sharing</td></tr>
-        <tr><td>bcryptjs</td><td>MIT</td><td>Password hashing</td></tr>
-        <tr><td>jsonwebtoken</td><td>MIT</td><td>JWT authentication tokens</td></tr>
-        <tr><td>Helmet</td><td>MIT</td><td>HTTP security headers</td></tr>
-        <tr><td>google-auth-library</td><td>Apache 2.0</td><td>Google OAuth verification</td></tr>
-        <tr><td>OkHttp</td><td>Apache 2.0</td><td>Android HTTP client</td></tr>
-        <tr><td>Gson</td><td>Apache 2.0</td><td>Android JSON parsing</td></tr>
-        <tr><td>AndroidX Media3 / ExoPlayer</td><td>Apache 2.0</td><td>Android video playback</td></tr>
-        <tr><td>AndroidX libraries</td><td>Apache 2.0</td><td>Android UI and lifecycle</td></tr>
-        <tr><td>Material Components for Android</td><td>Apache 2.0</td><td>Android UI components</td></tr>
-        <tr><td>Socket.IO Java Client</td><td>MIT</td><td>Android WebSocket client</td></tr>
-        <tr><td>Kotlin Coroutines</td><td>Apache 2.0</td><td>Android async operations</td></tr>
-        <tr><td>AndroidX Security Crypto</td><td>Apache 2.0</td><td>Encrypted SharedPreferences</td></tr>
-        <tr><td>AndroidX WorkManager</td><td>Apache 2.0</td><td>Background task management</td></tr>
+        <tr>
+          <td>Express</td>
+          <td>MIT</td>
+          <td>Web server framework</td>
+        </tr>
+        <tr>
+          <td>Socket.IO</td>
+          <td>MIT</td>
+          <td>Real-time WebSocket communication</td>
+        </tr>
+        <tr>
+          <td>better-sqlite3</td>
+          <td>MIT</td>
+          <td>SQLite database driver</td>
+        </tr>
+        <tr>
+          <td>Multer</td>
+          <td>MIT</td>
+          <td>File upload handling</td>
+        </tr>
+        <tr>
+          <td>uuid</td>
+          <td>MIT</td>
+          <td>Unique ID generation</td>
+        </tr>
+        <tr>
+          <td>Sharp</td>
+          <td>Apache 2.0</td>
+          <td>Image processing and thumbnails</td>
+        </tr>
+        <tr>
+          <td>cors</td>
+          <td>MIT</td>
+          <td>Cross-origin resource sharing</td>
+        </tr>
+        <tr>
+          <td>bcryptjs</td>
+          <td>MIT</td>
+          <td>Password hashing</td>
+        </tr>
+        <tr>
+          <td>jsonwebtoken</td>
+          <td>MIT</td>
+          <td>JWT authentication tokens</td>
+        </tr>
+        <tr>
+          <td>Helmet</td>
+          <td>MIT</td>
+          <td>HTTP security headers</td>
+        </tr>
+        <tr>
+          <td>google-auth-library</td>
+          <td>Apache 2.0</td>
+          <td>Google OAuth verification</td>
+        </tr>
+        <tr>
+          <td>OkHttp</td>
+          <td>Apache 2.0</td>
+          <td>Android HTTP client</td>
+        </tr>
+        <tr>
+          <td>Gson</td>
+          <td>Apache 2.0</td>
+          <td>Android JSON parsing</td>
+        </tr>
+        <tr>
+          <td>AndroidX Media3 / ExoPlayer</td>
+          <td>Apache 2.0</td>
+          <td>Android video playback</td>
+        </tr>
+        <tr>
+          <td>AndroidX libraries</td>
+          <td>Apache 2.0</td>
+          <td>Android UI and lifecycle</td>
+        </tr>
+        <tr>
+          <td>Material Components for Android</td>
+          <td>Apache 2.0</td>
+          <td>Android UI components</td>
+        </tr>
+        <tr>
+          <td>Socket.IO Java Client</td>
+          <td>MIT</td>
+          <td>Android WebSocket client</td>
+        </tr>
+        <tr>
+          <td>Kotlin Coroutines</td>
+          <td>Apache 2.0</td>
+          <td>Android async operations</td>
+        </tr>
+        <tr>
+          <td>AndroidX Security Crypto</td>
+          <td>Apache 2.0</td>
+          <td>Encrypted SharedPreferences</td>
+        </tr>
+        <tr>
+          <td>AndroidX WorkManager</td>
+          <td>Apache 2.0</td>
+          <td>Background task management</td>
+        </tr>
       </tbody>
     </table>
 
@@ -61,47 +230,50 @@
     <p>Express, Socket.IO, better-sqlite3, Multer, uuid, cors, bcryptjs, jsonwebtoken, Helmet, Socket.IO Java Client</p>
     <div class="license-block">MIT License
 
-Copyright (c) respective authors and contributors
+      Copyright (c) respective authors and contributors
 
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
+      Permission is hereby granted, free of charge, to any person obtaining a copy
+      of this software and associated documentation files (the "Software"), to deal
+      in the Software without restriction, including without limitation the rights
+      to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+      copies of the Software, and to permit persons to whom the Software is
+      furnished to do so, subject to the following conditions:
 
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
+      The above copyright notice and this permission notice shall be included in all
+      copies or substantial portions of the Software.
 
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.</div>
+      THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+      IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+      FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+      AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+      LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+      OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+      SOFTWARE.</div>
 
     <h2>Apache License 2.0</h2>
     <p>The following packages are licensed under the Apache License, Version 2.0:</p>
-    <p>Sharp, google-auth-library, OkHttp, Gson, AndroidX Media3/ExoPlayer, AndroidX libraries, Material Components for Android, Kotlin Coroutines, AndroidX Security Crypto, AndroidX WorkManager</p>
+    <p>Sharp, google-auth-library, OkHttp, Gson, AndroidX Media3/ExoPlayer, AndroidX libraries, Material Components for
+      Android, Kotlin Coroutines, AndroidX Security Crypto, AndroidX WorkManager</p>
     <div class="license-block">Apache License
-Version 2.0, January 2004
-http://www.apache.org/licenses/
+      Version 2.0, January 2004
+      http://www.apache.org/licenses/
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
+      Licensed under the Apache License, Version 2.0 (the "License");
+      you may not use this file except in compliance with the License.
+      You may obtain a copy of the License at
 
-    http://www.apache.org/licenses/LICENSE-2.0
+      http://www.apache.org/licenses/LICENSE-2.0
 
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.</div>
+      Unless required by applicable law or agreed to in writing, software
+      distributed under the License is distributed on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+      See the License for the specific language governing permissions and
+      limitations under the License.</div>
 
     <h2>Contact</h2>
-    <p>If you have questions about the licensing of any component used in ScreenTinker, please contact us at support@screentinker.com</p>
+    <p>If you have questions about the licensing of any component used in ScreenTinker, please contact us at
+      support@screentinker.com</p>
   </div>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/scripts/create_admin.js b/scripts/create_admin.js
new file mode 100644
index 0000000..9be3465
--- /dev/null
+++ b/scripts/create_admin.js
@@ -0,0 +1,36 @@
+const { db } = require('../server/db/database');
+const bcrypt = require('../server/node_modules/bcryptjs');
+const { v4: uuidv4 } = require('../server/node_modules/uuid');
+
+const email = 'ivandro.work@gmail.com';
+const password = '#whatever';
+const name = 'Ivandro Alves';
+const hash = bcrypt.hashSync(password, 10);
+const userId = uuidv4();
+
+try {
+  db.prepare('INSERT INTO users (id, email, password_hash, name, role) VALUES (?, ?, ?, ?, ?)').run(userId, email, hash, name, 'platform_admin');
+  
+  // also create an organization and workspace for them
+  const orgId = uuidv4();
+  const workspaceId = uuidv4();
+  
+  db.prepare('INSERT INTO organizations (id, name, owner_id) VALUES (?, ?, ?)').run(orgId, name + " Org", userId);
+  db.prepare('INSERT INTO workspaces (id, name, organization_id) VALUES (?, ?, ?)').run(workspaceId, 'Default Workspace', orgId);
+  db.prepare('INSERT INTO organization_members (organization_id, user_id, role) VALUES (?, ?, ?)').run(orgId, userId, 'admin');
+  db.prepare('INSERT INTO workspace_members (workspace_id, user_id, role) VALUES (?, ?, ?)').run(workspaceId, userId, 'admin');
+  
+  const d = require('../server/db/database').dbOptions;
+  if (d.syncUrl) db.sync();
+
+  console.log('Admin created successfully.');
+} catch (e) {
+  if (e.message.includes('UNIQUE constraint failed')) {
+     console.log('User already exists, updating password and role.');
+     db.prepare('UPDATE users SET password_hash = ?, role = ? WHERE email = ?').run(hash, 'platform_admin', email);
+     const d = require('../server/db/database').dbOptions;
+     if (d.syncUrl) db.sync();
+  } else {
+     console.error(e);
+  }
+}
diff --git a/server/create_admin.js b/server/create_admin.js
new file mode 100644
index 0000000..c3a4848
--- /dev/null
+++ b/server/create_admin.js
@@ -0,0 +1,36 @@
+const { db } = require('./db/database');
+const bcrypt = require('bcryptjs');
+const crypto = require('crypto');
+
+const email = 'ivandro.work@gmail.com';
+const password = '#whatever';
+const name = 'Ivandro Alves';
+const hash = bcrypt.hashSync(password, 10);
+const userId = crypto.randomUUID();
+
+try {
+  db.prepare('INSERT INTO users (id, email, password_hash, name, role) VALUES (?, ?, ?, ?, ?)').run(userId, email, hash, name, 'platform_admin');
+  
+  // also create an organization and workspace for them
+  const orgId = crypto.randomUUID();
+  const workspaceId = crypto.randomUUID();
+  
+  db.prepare('INSERT INTO organizations (id, name, owner_id) VALUES (?, ?, ?)').run(orgId, name + " Org", userId);
+  db.prepare('INSERT INTO workspaces (id, name, organization_id) VALUES (?, ?, ?)').run(workspaceId, 'Default Workspace', orgId);
+  db.prepare('INSERT INTO organization_members (organization_id, user_id, role) VALUES (?, ?, ?)').run(orgId, userId, 'admin');
+  db.prepare('INSERT INTO workspace_members (workspace_id, user_id, role) VALUES (?, ?, ?)').run(workspaceId, userId, 'admin');
+  
+  const d = require('./db/database').dbOptions;
+  if (d.syncUrl) db.sync();
+
+  console.log('Admin created successfully.');
+} catch (e) {
+  if (e.message.includes('UNIQUE constraint failed')) {
+     console.log('User already exists, updating password and role.');
+     db.prepare('UPDATE users SET password_hash = ?, role = ? WHERE email = ?').run(hash, 'platform_admin', email);
+     const d = require('./db/database').dbOptions;
+     if (d.syncUrl) db.sync();
+  } else {
+     console.error(e);
+  }
+}
diff --git a/server/create_admin2.js b/server/create_admin2.js
new file mode 100644
index 0000000..9673aa1
--- /dev/null
+++ b/server/create_admin2.js
@@ -0,0 +1,10 @@
+const { db } = require('./db/database');
+const bcrypt = require('bcryptjs');
+
+const email = 'ivandro.work@gmail.com';
+const password = '#whatever';
+const hash = bcrypt.hashSync(password, 10);
+
+db.prepare('UPDATE users SET password_hash = ?, role = ? WHERE email = ?').run(hash, 'platform_admin', email);
+if (typeof db.sync === 'function') db.sync();
+console.log('Password and role updated');
diff --git a/server/db/database.js b/server/db/database.js
index 1bb09b1..a8983c8 100644
--- a/server/db/database.js
+++ b/server/db/database.js
@@ -617,7 +617,7 @@ function migrateGroupSchedules() {
         recurrence_end  TEXT,
         priority        INTEGER NOT NULL DEFAULT 0,
         enabled         INTEGER NOT NULL DEFAULT 1,
-        color           TEXT DEFAULT '#3B82F6',
+        color           TEXT DEFAULT '#e65c00',
         created_at      INTEGER NOT NULL DEFAULT (strftime('%s','now')),
         updated_at      INTEGER NOT NULL DEFAULT (strftime('%s','now')),
         CHECK ((device_id IS NOT NULL AND group_id IS NULL) OR (device_id IS NULL AND group_id IS NOT NULL))
@@ -927,7 +927,7 @@ async function pruneStatusLog(opts = {}) {
     const delCap = cap > 0 ? db.prepare('DELETE FROM device_status_log WHERE rowid IN (SELECT rowid FROM device_status_log WHERE device_id = ? ORDER BY timestamp DESC, id DESC LIMIT ? OFFSET ?)') : null;
 
     let total = 0, lastDev = '';
-    for (;;) {
+    for (; ;) {
       const row = nextDevice.get(lastDev);            // O(log n) index seek to next distinct device_id
       if (!row) break;
       lastDev = row.device_id;
diff --git a/server/db/remote_display.db-client_wal_index b/server/db/remote_display.db-client_wal_index
index e3cc2a8..3fb2384 100644
Binary files a/server/db/remote_display.db-client_wal_index and b/server/db/remote_display.db-client_wal_index differ
diff --git a/server/db/schema.sql b/server/db/schema.sql
index 513758d..e830a54 100644
--- a/server/db/schema.sql
+++ b/server/db/schema.sql
@@ -229,7 +229,7 @@ CREATE TABLE IF NOT EXISTS schedules (
     recurrence_end  TEXT,
     priority        INTEGER NOT NULL DEFAULT 0,
     enabled         INTEGER NOT NULL DEFAULT 1,
-    color           TEXT DEFAULT '#3B82F6',
+    color           TEXT DEFAULT '#e65c00',
     created_at      INTEGER NOT NULL DEFAULT (strftime('%s','now')),
     updated_at      INTEGER NOT NULL DEFAULT (strftime('%s','now')),
     CHECK ((device_id IS NOT NULL AND group_id IS NULL) OR (device_id IS NULL AND group_id IS NOT NULL))
@@ -336,7 +336,7 @@ CREATE TABLE IF NOT EXISTS device_groups (
     id              TEXT PRIMARY KEY,
     user_id         TEXT NOT NULL REFERENCES users(id),
     name            TEXT NOT NULL,
-    color           TEXT DEFAULT '#3B82F6',
+    color           TEXT DEFAULT '#e65c00',
     playlist_id     TEXT REFERENCES playlists(id) ON DELETE SET NULL,
     created_at      INTEGER NOT NULL DEFAULT (strftime('%s','now'))
 );
@@ -419,7 +419,7 @@ CREATE TABLE IF NOT EXISTS white_labels (
     brand_name      TEXT NOT NULL DEFAULT 'ScreenTinker',
     logo_url        TEXT,
     favicon_url     TEXT,
-    primary_color   TEXT DEFAULT '#3B82F6',
+    primary_color   TEXT DEFAULT '#e65c00',
     secondary_color TEXT DEFAULT '#1E293B',
     bg_color        TEXT DEFAULT '#111827',
     custom_domain   TEXT,
diff --git a/server/db/wal-checkpointer.js b/server/db/wal-checkpointer.js
index d6a9c60..54d237f 100644
--- a/server/db/wal-checkpointer.js
+++ b/server/db/wal-checkpointer.js
@@ -93,7 +93,10 @@ function startWalCheckpointer(db, dbPath) {
   respawnAt.length = 0;
 
   // From now on the main thread NEVER inline-checkpoints (removes the loop-blocking fsync).
-  db.pragma('wal_autocheckpoint = 0');
+  try { db.pragma('wal_autocheckpoint = 0'); } catch (e) {
+    if (!e.message.includes('Sqlite3UnsupportedStatement')) throw e;
+  }
+
   // Hand the worker a clean WAL (one-time, at boot; explicit checkpoints are independent of
   // wal_autocheckpoint, so this still works at 0). Also reclaims any WAL a prior crash left.
   try { db.pragma('wal_checkpoint(TRUNCATE)'); } catch (_) { /* best-effort */ }
diff --git a/server/fix_branding.js b/server/fix_branding.js
new file mode 100644
index 0000000..f22b5ac
--- /dev/null
+++ b/server/fix_branding.js
@@ -0,0 +1,9 @@
+const { db } = require('./db/database');
+try {
+  db.prepare('DELETE FROM white_labels').run();
+  const d = require('./db/database').dbOptions;
+  if (d && typeof db.sync === 'function') db.sync();
+  console.log('Cleared old branding overrides, server will use the new HARDCODED_BRANDING.');
+} catch (e) {
+  console.error(e);
+}
diff --git a/server/lib/branding.js b/server/lib/branding.js
index 6400bf0..035e38e 100644
--- a/server/lib/branding.js
+++ b/server/lib/branding.js
@@ -21,10 +21,10 @@
 const PLATFORM_DEFAULT_ID = 'platform-default';
 
 const HARDCODED_BRANDING = {
-  brand_name: 'ScreenTinker',
-  logo_url: null,
-  favicon_url: null,
-  primary_color: '#3B82F6',
+  brand_name: 'GoldenSignage',
+  logo_url: '/assets/logoswift.png',
+  favicon_url: '/assets/pwa-icon.png',
+  primary_color: '#ff6b00',
   secondary_color: '#1E293B',
   bg_color: '#111827',
   custom_css: null,
diff --git a/server/package-lock.json b/server/package-lock.json
index 32bccae..c2898a2 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -11,7 +11,6 @@
         "@azure/msal-node": "^5.2.1",
         "archiver": "^7.0.1",
         "bcryptjs": "^3.0.3",
-        "better-sqlite3": "^11.1.2",
         "cors": "^2.8.5",
         "express": "^4.18.2",
         "express-rate-limit": "^8.3.1",
@@ -917,17 +916,6 @@
         "bcrypt": "bin/bcrypt"
       }
     },
-    "node_modules/better-sqlite3": {
-      "version": "11.10.0",
-      "resolved": "https://registry.npmjs.org/better-sqlite3/-/better-sqlite3-11.10.0.tgz",
-      "integrity": "sha512-EwhOpyXiOEL/lKzHz9AW1msWFNzGc/z+LzeB3/jnFJpxu+th2yqvzsSWas1v9jgs9+xiXJcD5A8CJxAG2TaghQ==",
-      "hasInstallScript": true,
-      "license": "MIT",
-      "dependencies": {
-        "bindings": "^1.5.0",
-        "prebuild-install": "^7.1.1"
-      }
-    },
     "node_modules/bignumber.js": {
       "version": "9.3.1",
       "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-9.3.1.tgz",
@@ -937,64 +925,6 @@
         "node": "*"
       }
     },
-    "node_modules/bindings": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
-      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
-      "license": "MIT",
-      "dependencies": {
-        "file-uri-to-path": "1.0.0"
-      }
-    },
-    "node_modules/bl": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz",
-      "integrity": "sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==",
-      "license": "MIT",
-      "dependencies": {
-        "buffer": "^5.5.0",
-        "inherits": "^2.0.4",
-        "readable-stream": "^3.4.0"
-      }
-    },
-    "node_modules/bl/node_modules/buffer": {
-      "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
-      "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
-        }
-      ],
-      "license": "MIT",
-      "dependencies": {
-        "base64-js": "^1.3.1",
-        "ieee754": "^1.1.13"
-      }
-    },
-    "node_modules/bl/node_modules/readable-stream": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
-      "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
-      "license": "MIT",
-      "dependencies": {
-        "inherits": "^2.0.3",
-        "string_decoder": "^1.1.1",
-        "util-deprecate": "^1.0.1"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/bluebird": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -1137,12 +1067,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/chownr": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.1.4.tgz",
-      "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==",
-      "license": "ISC"
-    },
     "node_modules/cliui": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
@@ -1451,30 +1375,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/decompress-response": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-6.0.0.tgz",
-      "integrity": "sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==",
-      "license": "MIT",
-      "dependencies": {
-        "mimic-response": "^3.1.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/deep-extend": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz",
-      "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=4.0.0"
-      }
-    },
     "node_modules/depd": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
@@ -1598,15 +1498,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/end-of-stream": {
-      "version": "1.4.5",
-      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.5.tgz",
-      "integrity": "sha512-ooEGc6HP26xXq/N+GCGOT0JKCLDGrq2bQUZrQ7gyrJiZANJ/8YDTxTpQBXGMn+WbIQXNVpyWymm7KYVICQnyOg==",
-      "license": "MIT",
-      "dependencies": {
-        "once": "^1.4.0"
-      }
-    },
     "node_modules/engine.io": {
       "version": "6.6.9",
       "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-6.6.9.tgz",
@@ -1771,15 +1662,6 @@
         "bare-events": "^2.7.0"
       }
     },
-    "node_modules/expand-template": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/expand-template/-/expand-template-2.0.3.tgz",
-      "integrity": "sha512-XYfuKMvj4O35f/pOXLObndIRvyQ+/+6AhODh+OKWj9S9498pHHn/IMszH+gt0fBCRWMNfk1ZSp5x3AifmnI2vg==",
-      "license": "(MIT OR WTFPL)",
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/express": {
       "version": "4.22.2",
       "resolved": "https://registry.npmjs.org/express/-/express-4.22.2.tgz",
@@ -1903,12 +1785,6 @@
         "node": "^12.20 || >= 14.13"
       }
     },
-    "node_modules/file-uri-to-path": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
-      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
-      "license": "MIT"
-    },
     "node_modules/finalhandler": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.3.2.tgz",
@@ -1986,12 +1862,6 @@
         "node": ">= 0.6"
       }
     },
-    "node_modules/fs-constants": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
-      "integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==",
-      "license": "MIT"
-    },
     "node_modules/fs-extra": {
       "version": "11.3.1",
       "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.1.tgz",
@@ -2089,12 +1959,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/github-from-package": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/github-from-package/-/github-from-package-0.0.0.tgz",
-      "integrity": "sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==",
-      "license": "MIT"
-    },
     "node_modules/glob": {
       "version": "10.5.0",
       "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
@@ -2290,12 +2154,6 @@
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
       "license": "ISC"
     },
-    "node_modules/ini": {
-      "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
-      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
-      "license": "ISC"
-    },
     "node_modules/ip-address": {
       "version": "10.2.0",
       "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.2.0.tgz",
@@ -2679,18 +2537,6 @@
         "node": ">= 0.6"
       }
     },
-    "node_modules/mimic-response": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-3.1.0.tgz",
-      "integrity": "sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/minimatch": {
       "version": "9.0.9",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
@@ -2736,12 +2582,6 @@
         "mkdirp": "bin/cmd.js"
       }
     },
-    "node_modules/mkdirp-classic": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz",
-      "integrity": "sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==",
-      "license": "MIT"
-    },
     "node_modules/ms": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
@@ -2767,12 +2607,6 @@
         "node": ">= 6.0.0"
       }
     },
-    "node_modules/napi-build-utils": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/napi-build-utils/-/napi-build-utils-2.0.0.tgz",
-      "integrity": "sha512-GEbrYkbfF7MoNaoh2iGG84Mnf/WZfB0GdGEsM8wz7Expx/LlWf5U8t9nvJKXSp3qr5IsEbK04cBGhol/KwOsWA==",
-      "license": "MIT"
-    },
     "node_modules/negotiator": {
       "version": "0.6.3",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
@@ -2782,18 +2616,6 @@
         "node": ">= 0.6"
       }
     },
-    "node_modules/node-abi": {
-      "version": "3.94.0",
-      "resolved": "https://registry.npmjs.org/node-abi/-/node-abi-3.94.0.tgz",
-      "integrity": "sha512-W5ZNO5KRPB5TkYmGVD9F6YqhsglXJzE6etpbmT+f6EQElhiX/UTG551cnsRGvLG3fyZEg9HwaDmNmj5nwJ4z9g==",
-      "license": "MIT",
-      "dependencies": {
-        "semver": "^7.3.5"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/node-domexception": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
@@ -2889,15 +2711,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/once": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
-      "license": "ISC",
-      "dependencies": {
-        "wrappy": "1"
-      }
-    },
     "node_modules/otplib": {
       "version": "12.0.1",
       "resolved": "https://registry.npmjs.org/otplib/-/otplib-12.0.1.tgz",
@@ -3009,33 +2822,6 @@
         "node": ">=10.13.0"
       }
     },
-    "node_modules/prebuild-install": {
-      "version": "7.1.3",
-      "resolved": "https://registry.npmjs.org/prebuild-install/-/prebuild-install-7.1.3.tgz",
-      "integrity": "sha512-8Mf2cbV7x1cXPUILADGI3wuhfqWvtiLA1iclTDbFRZkgRQS0NqsPZphna9V+HyTEadheuPmjaJMsbzKQFOzLug==",
-      "deprecated": "No longer maintained. Please contact the author of the relevant native addon; alternatives are available.",
-      "license": "MIT",
-      "dependencies": {
-        "detect-libc": "^2.0.0",
-        "expand-template": "^2.0.3",
-        "github-from-package": "0.0.0",
-        "minimist": "^1.2.3",
-        "mkdirp-classic": "^0.5.3",
-        "napi-build-utils": "^2.0.0",
-        "node-abi": "^3.3.0",
-        "pump": "^3.0.0",
-        "rc": "^1.2.7",
-        "simple-get": "^4.0.0",
-        "tar-fs": "^2.0.0",
-        "tunnel-agent": "^0.6.0"
-      },
-      "bin": {
-        "prebuild-install": "bin.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -3064,16 +2850,6 @@
         "node": ">= 0.10"
       }
     },
-    "node_modules/pump": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.4.tgz",
-      "integrity": "sha512-VS7sjc6KR7e1ukRFhQSY5LM2uBWAUPiOPa/A3mkKmiMwSmRFUITt0xuj+/lesgnCv+dPIEYlkzrcyXgquIHMcA==",
-      "license": "MIT",
-      "dependencies": {
-        "end-of-stream": "^1.1.0",
-        "once": "^1.3.1"
-      }
-    },
     "node_modules/qrcode": {
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.4.tgz",
@@ -3131,21 +2907,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/rc": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
-      "integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==",
-      "license": "(BSD-2-Clause OR MIT OR Apache-2.0)",
-      "dependencies": {
-        "deep-extend": "^0.6.0",
-        "ini": "~1.3.0",
-        "minimist": "^1.2.0",
-        "strip-json-comments": "~2.0.1"
-      },
-      "bin": {
-        "rc": "cli.js"
-      }
-    },
     "node_modules/readable-stream": {
       "version": "4.7.0",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-4.7.0.tgz",
@@ -3437,51 +3198,6 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/simple-concat": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz",
-      "integrity": "sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
-        }
-      ],
-      "license": "MIT"
-    },
-    "node_modules/simple-get": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/simple-get/-/simple-get-4.0.1.tgz",
-      "integrity": "sha512-brv7p5WgH0jmQJr1ZDDfKDOSeWWg+OVypG99A/5vYGPqJ6pxiaHLy8nxtFjBA7oMa01ebA9gfh1uMCFqOuXxvA==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
-        }
-      ],
-      "license": "MIT",
-      "dependencies": {
-        "decompress-response": "^6.0.0",
-        "once": "^1.3.1",
-        "simple-concat": "^1.0.0"
-      }
-    },
     "node_modules/simple-swizzle": {
       "version": "0.2.4",
       "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.4.tgz",
@@ -3775,15 +3491,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/strip-json-comments": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
-      "integrity": "sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/stripe": {
       "version": "20.4.1",
       "resolved": "https://registry.npmjs.org/stripe/-/stripe-20.4.1.tgz",
@@ -3801,48 +3508,6 @@
         }
       }
     },
-    "node_modules/tar-fs": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.5.tgz",
-      "integrity": "sha512-OboTd8mmMhZDNPV+UjQcK9yKAatXu2aJ+r1w4im1Otd4M4fl2hwvdoXUxIYHFTHWK/3y3FarBP70v3vwmGlOxw==",
-      "license": "MIT",
-      "dependencies": {
-        "chownr": "^1.1.1",
-        "mkdirp-classic": "^0.5.2",
-        "pump": "^3.0.0",
-        "tar-stream": "^2.1.4"
-      }
-    },
-    "node_modules/tar-fs/node_modules/readable-stream": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
-      "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
-      "license": "MIT",
-      "dependencies": {
-        "inherits": "^2.0.3",
-        "string_decoder": "^1.1.1",
-        "util-deprecate": "^1.0.1"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
-    "node_modules/tar-fs/node_modules/tar-stream": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz",
-      "integrity": "sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==",
-      "license": "MIT",
-      "dependencies": {
-        "bl": "^4.0.3",
-        "end-of-stream": "^1.4.1",
-        "fs-constants": "^1.0.0",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/tar-stream": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.2.0.tgz",
@@ -3897,18 +3562,6 @@
       "license": "0BSD",
       "optional": true
     },
-    "node_modules/tunnel-agent": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-      "integrity": "sha512-McnNiV1l8RYeY8tBgEpuodCC1mLUdbSN+CYBL7kJsJNInOP8UjDDEwdk6Mw60vdLLrr5NHKZhMAOSrR2NZuQ+w==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "safe-buffer": "^5.0.1"
-      },
-      "engines": {
-        "node": "*"
-      }
-    },
     "node_modules/type-is": {
       "version": "1.6.18",
       "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
@@ -4123,12 +3776,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/wrappy": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
-      "license": "ISC"
-    },
     "node_modules/ws": {
       "version": "8.21.1",
       "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.1.tgz",
diff --git a/server/package.json b/server/package.json
index 4b8ee66..8ed1209 100644
--- a/server/package.json
+++ b/server/package.json
@@ -12,7 +12,6 @@
     "@azure/msal-node": "^5.2.1",
     "archiver": "^7.0.1",
     "bcryptjs": "^3.0.3",
-    "better-sqlite3": "^11.1.2",
     "cors": "^2.8.5",
     "express": "^4.18.2",
     "express-rate-limit": "^8.3.1",
diff --git a/server/player/index.html b/server/player/index.html
index 5cec7dd..297ce4a 100644
--- a/server/player/index.html
+++ b/server/player/index.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
@@ -14,102 +15,102 @@
     player won't boot.
   -->
   <script>
-  (function () {
-    try {
-      if (!window.__debugLog) window.__debugLog = [];
-      var MAX_LOG = 200;
-      var INIT_T = (function () { try { return Date.now(); } catch (e) { return new Date().getTime(); } })();
-
-      function nowMs() {
-        try { return Date.now(); } catch (e) { return new Date().getTime(); }
-      }
-
-      function pushLog(entry) {
-        try {
-          entry.t = nowMs();
-          window.__debugLog.push(entry);
-          if (window.__debugLog.length > MAX_LOG) {
-            window.__debugLog.splice(0, window.__debugLog.length - MAX_LOG);
-          }
-        } catch (e) { /* we are the safety net; do not crash */ }
-      }
-      window.__debugLog_push = pushLog; // shared pusher for debug-overlay.js
-
-      pushLog({
-        type: 'init',
-        ua: (navigator && navigator.userAgent) || '',
-        url: location.href,
-        sw: typeof screen !== 'undefined' ? screen.width : null,
-        sh: typeof screen !== 'undefined' ? screen.height : null
-      });
-
-      // Uncaught script errors. Capture phase so we also see errors from
-      // <img>/<script>/<link> resource failures (ev.target.src on those).
-      window.addEventListener('error', function (ev) {
-        try {
-          var src = ev.filename || (ev.target && ev.target.src) || '';
-          pushLog({
-            type: 'error',
-            message: ev.message || (ev.error && String(ev.error)) || 'error',
-            source: src,
-            line: ev.lineno || 0,
-            col: ev.colno || 0,
-            stack: (ev.error && ev.error.stack) || ''
-          });
-        } catch (e) {}
-      }, true);
-
-      window.addEventListener('unhandledrejection', function (ev) {
-        try {
-          var reason = ev.reason;
-          pushLog({
-            type: 'rejection',
-            message: (reason && reason.message) || String(reason || 'rejection'),
-            stack: (reason && reason.stack) || ''
-          });
-        } catch (e) {}
-      });
-
-      // Wrap console methods. Original behavior preserved so devtools still
-      // sees the real call; we additionally append a sanitized text record.
-      var methods = ['log', 'warn', 'error'];
-      for (var i = 0; i < methods.length; i++) {
-        (function (m) {
-          var orig = console[m];
-          console[m] = function () {
-            try {
-              var args = Array.prototype.slice.call(arguments);
-              var msg = '';
-              for (var j = 0; j < args.length; j++) {
-                var part;
-                try {
-                  part = typeof args[j] === 'string' ? args[j] : JSON.stringify(args[j]);
-                } catch (e) {
-                  part = String(args[j]);
-                }
-                msg += (j > 0 ? ' ' : '') + part;
-              }
-              if (msg.length > 1000) msg = msg.slice(0, 1000) + '...[trunc]';
-              pushLog({ type: 'console.' + m, message: msg });
-            } catch (e) {}
-            try { return orig.apply(console, arguments); } catch (e) {}
-          };
-        })(methods[i]);
-      }
-
-      // Page-load timing relative to this script's execution.
+    (function () {
       try {
-        document.addEventListener('DOMContentLoaded', function () {
-          pushLog({ type: 'timing', event: 'DOMContentLoaded', sinceInit: nowMs() - INIT_T });
+        if (!window.__debugLog) window.__debugLog = [];
+        var MAX_LOG = 200;
+        var INIT_T = (function () { try { return Date.now(); } catch (e) { return new Date().getTime(); } })();
+
+        function nowMs() {
+          try { return Date.now(); } catch (e) { return new Date().getTime(); }
+        }
+
+        function pushLog(entry) {
+          try {
+            entry.t = nowMs();
+            window.__debugLog.push(entry);
+            if (window.__debugLog.length > MAX_LOG) {
+              window.__debugLog.splice(0, window.__debugLog.length - MAX_LOG);
+            }
+          } catch (e) { /* we are the safety net; do not crash */ }
+        }
+        window.__debugLog_push = pushLog; // shared pusher for debug-overlay.js
+
+        pushLog({
+          type: 'init',
+          ua: (navigator && navigator.userAgent) || '',
+          url: location.href,
+          sw: typeof screen !== 'undefined' ? screen.width : null,
+          sh: typeof screen !== 'undefined' ? screen.height : null
         });
-        window.addEventListener('load', function () {
-          pushLog({ type: 'timing', event: 'load', sinceInit: nowMs() - INIT_T });
+
+        // Uncaught script errors. Capture phase so we also see errors from
+        // <img>/<script>/<link> resource failures (ev.target.src on those).
+        window.addEventListener('error', function (ev) {
+          try {
+            var src = ev.filename || (ev.target && ev.target.src) || '';
+            pushLog({
+              type: 'error',
+              message: ev.message || (ev.error && String(ev.error)) || 'error',
+              source: src,
+              line: ev.lineno || 0,
+              col: ev.colno || 0,
+              stack: (ev.error && ev.error.stack) || ''
+            });
+          } catch (e) { }
+        }, true);
+
+        window.addEventListener('unhandledrejection', function (ev) {
+          try {
+            var reason = ev.reason;
+            pushLog({
+              type: 'rejection',
+              message: (reason && reason.message) || String(reason || 'rejection'),
+              stack: (reason && reason.stack) || ''
+            });
+          } catch (e) { }
         });
-      } catch (e) {}
-    } catch (outerErr) {
-      // If even init failed, the player must still boot. Do nothing.
-    }
-  })();
+
+        // Wrap console methods. Original behavior preserved so devtools still
+        // sees the real call; we additionally append a sanitized text record.
+        var methods = ['log', 'warn', 'error'];
+        for (var i = 0; i < methods.length; i++) {
+          (function (m) {
+            var orig = console[m];
+            console[m] = function () {
+              try {
+                var args = Array.prototype.slice.call(arguments);
+                var msg = '';
+                for (var j = 0; j < args.length; j++) {
+                  var part;
+                  try {
+                    part = typeof args[j] === 'string' ? args[j] : JSON.stringify(args[j]);
+                  } catch (e) {
+                    part = String(args[j]);
+                  }
+                  msg += (j > 0 ? ' ' : '') + part;
+                }
+                if (msg.length > 1000) msg = msg.slice(0, 1000) + '...[trunc]';
+                pushLog({ type: 'console.' + m, message: msg });
+              } catch (e) { }
+              try { return orig.apply(console, arguments); } catch (e) { }
+            };
+          })(methods[i]);
+        }
+
+        // Page-load timing relative to this script's execution.
+        try {
+          document.addEventListener('DOMContentLoaded', function () {
+            pushLog({ type: 'timing', event: 'DOMContentLoaded', sinceInit: nowMs() - INIT_T });
+          });
+          window.addEventListener('load', function () {
+            pushLog({ type: 'timing', event: 'load', sinceInit: nowMs() - INIT_T });
+          });
+        } catch (e) { }
+      } catch (outerErr) {
+        // If even init failed, the player must still boot. Do nothing.
+      }
+    })();
   </script>
   <!-- Debug overlay module (section 2). Defers so HTML parse doesn't block
        on the fetch. Auto-activation check fires after DOMContentLoaded;
@@ -118,50 +119,175 @@
   <script src="/player/debug-overlay.js" defer></script>
   <title>ScreenTinker Player</title>
   <style>
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-    html, body { width: 100%; height: 100%; overflow: hidden; background: #000; font-family: -apple-system, sans-serif; }
+    * {
+      margin: 0;
+      padding: 0;
+      box-sizing: border-box;
+    }
+
+    html,
+    body {
+      width: 100%;
+      height: 100%;
+      overflow: hidden;
+      background: #000;
+      font-family: -apple-system, sans-serif;
+    }
 
     /* Setup Screen */
     #setupScreen {
-      position: fixed; inset: 0; background: #111827; display: flex; flex-direction: column;
-      align-items: center; justify-content: center; z-index: 1000; color: #f1f5f9;
+      position: fixed;
+      inset: 0;
+      background: #111827;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      z-index: 1000;
+      color: #f1f5f9;
+    }
+
+    #setupScreen h1 {
+      font-size: 36px;
+      color: #e65c00;
+      margin-bottom: 8px;
+    }
+
+    #setupScreen .subtitle {
+      color: #94a3b8;
+      font-size: 16px;
+      margin-bottom: 48px;
+    }
+
+    #setupScreen .form {
+      width: 400px;
+      max-width: 90vw;
+    }
+
+    #setupScreen label {
+      display: block;
+      font-size: 14px;
+      color: #94a3b8;
+      margin-bottom: 8px;
+    }
+
+    #setupScreen input {
+      width: 100%;
+      padding: 12px;
+      background: #0f172a;
+      border: 1px solid #334155;
+      border-radius: 8px;
+      color: #f1f5f9;
+      font-size: 16px;
+      margin-bottom: 24px;
+      outline: none;
+    }
+
+    #setupScreen input:focus {
+      border-color: #e65c00;
+    }
+
+    #setupScreen button {
+      width: 100%;
+      padding: 12px;
+      background: #e65c00;
+      color: white;
+      border: none;
+      border-radius: 8px;
+      font-size: 16px;
+      font-weight: 600;
+      cursor: pointer;
+    }
+
+    #setupScreen button:hover {
+      background: #2563eb;
+    }
+
+    #setupScreen button:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    .pairing-code {
+      font-size: 72px;
+      font-weight: 700;
+      color: #e65c00;
+      font-family: monospace;
+      letter-spacing: 12px;
+      margin: 24px 0;
+    }
+
+    .pairing-hint {
+      color: #64748b;
+      font-size: 14px;
+    }
+
+    .status-msg {
+      color: #94a3b8;
+      font-size: 14px;
+      margin-top: 16px;
+    }
+
+    .spinner {
+      width: 40px;
+      height: 40px;
+      border: 3px solid #334155;
+      border-top-color: #e65c00;
+      border-radius: 50%;
+      animation: spin 1s linear infinite;
+      margin: 24px auto;
+    }
+
+    @keyframes spin {
+      to {
+        transform: rotate(360deg);
+      }
     }
-    #setupScreen h1 { font-size: 36px; color: #3b82f6; margin-bottom: 8px; }
-    #setupScreen .subtitle { color: #94a3b8; font-size: 16px; margin-bottom: 48px; }
-    #setupScreen .form { width: 400px; max-width: 90vw; }
-    #setupScreen label { display: block; font-size: 14px; color: #94a3b8; margin-bottom: 8px; }
-    #setupScreen input { width: 100%; padding: 12px; background: #0f172a; border: 1px solid #334155;
-      border-radius: 8px; color: #f1f5f9; font-size: 16px; margin-bottom: 24px; outline: none; }
-    #setupScreen input:focus { border-color: #3b82f6; }
-    #setupScreen button { width: 100%; padding: 12px; background: #3b82f6; color: white;
-      border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; }
-    #setupScreen button:hover { background: #2563eb; }
-    #setupScreen button:disabled { opacity: 0.5; cursor: not-allowed; }
-    .pairing-code { font-size: 72px; font-weight: 700; color: #3b82f6; font-family: monospace;
-      letter-spacing: 12px; margin: 24px 0; }
-    .pairing-hint { color: #64748b; font-size: 14px; }
-    .status-msg { color: #94a3b8; font-size: 14px; margin-top: 16px; }
-    .spinner { width: 40px; height: 40px; border: 3px solid #334155; border-top-color: #3b82f6;
-      border-radius: 50%; animation: spin 1s linear infinite; margin: 24px auto; }
-    @keyframes spin { to { transform: rotate(360deg); } }
 
     /* Player */
-    #playerContainer { position: fixed; inset: 0; background: #000; }
+    #playerContainer {
+      position: fixed;
+      inset: 0;
+      background: #000;
+    }
+
     /* Fullscreen single-zone playback: YouTube's IFrame API measures the placeholder
        at construction time. If that happens before layout settles, YT bakes in a
        300x150 fallback as inline pixel dimensions on the iframe, which our %-based
        rules can't override. Force fullscreen via absolute positioning + !important. */
-    #playerContainer > iframe,
-    #playerContainer > div > iframe {
+    #playerContainer>iframe,
+    #playerContainer>div>iframe {
       position: absolute !important;
-      top: 0 !important; left: 0 !important;
-      width: 100% !important; height: 100% !important;
-      border: none !important; display: block !important;
+      top: 0 !important;
+      left: 0 !important;
+      width: 100% !important;
+      height: 100% !important;
+      border: none !important;
+      display: block !important;
+    }
+
+    .zone {
+      position: absolute;
+      overflow: hidden;
+    }
+
+    .zone video {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+
+    .zone img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+
+    .zone iframe {
+      width: 100%;
+      height: 100%;
+      border: none;
     }
-    .zone { position: absolute; overflow: hidden; }
-    .zone video { width: 100%; height: 100%; object-fit: cover; }
-    .zone img { width: 100%; height: 100%; object-fit: cover; }
-    .zone iframe { width: 100%; height: 100%; border: none; }
 
     /* Video wall mode.
        wall-stage maps the wall's player_rect into this device's viewport
@@ -171,33 +297,95 @@
        which keeps vertical position identical between devices that share
        a viewport height — without that, cover-cropping on different stage
        aspects (different innerWidths) shifts content vertically. */
-    #playerContainer.wall-mode { overflow: hidden; background: #000; }
-    .wall-stage { position: absolute; }
-    .wall-stage > video,
-    .wall-stage > img { width: 100%; height: 100%; object-fit: fill; display: block; }
-    .wall-stage > iframe { width: 100%; height: 100%; border: none; display: block; }
-    .wall-mode #playerContainer > iframe,
-    .wall-mode #playerContainer > div > iframe { position: static !important; width: 100% !important; height: 100% !important; }
+    #playerContainer.wall-mode {
+      overflow: hidden;
+      background: #000;
+    }
+
+    .wall-stage {
+      position: absolute;
+    }
+
+    .wall-stage>video,
+    .wall-stage>img {
+      width: 100%;
+      height: 100%;
+      object-fit: fill;
+      display: block;
+    }
+
+    .wall-stage>iframe {
+      width: 100%;
+      height: 100%;
+      border: none;
+      display: block;
+    }
+
+    .wall-mode #playerContainer>iframe,
+    .wall-mode #playerContainer>div>iframe {
+      position: static !important;
+      width: 100% !important;
+      height: 100% !important;
+    }
 
     /* #109: PiP overlay layer — a fixed full-viewport layer ABOVE #playerContainer that
        the playlist never touches. The same orientation transform is applied to it as to
        #playerContainer, so corner positions track the visible content in every orientation.
        Pointer-transparent and empty (invisible) until an overlay is shown. */
-    #pipContainer { position: fixed; inset: 0; pointer-events: none; z-index: 9000; }
-    #pipContainer > .pip-box { position: absolute; overflow: hidden; box-sizing: border-box; box-shadow: 0 6px 28px rgba(0,0,0,0.55); }
-    #pipContainer > .pip-box > .pip-title { font: 600 16px sans-serif; padding: 6px 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-    #pipContainer > .pip-box > img,
-    #pipContainer > .pip-box > iframe { display: block; width: 100%; border: 0; }
+    #pipContainer {
+      position: fixed;
+      inset: 0;
+      pointer-events: none;
+      z-index: 9000;
+    }
+
+    #pipContainer>.pip-box {
+      position: absolute;
+      overflow: hidden;
+      box-sizing: border-box;
+      box-shadow: 0 6px 28px rgba(0, 0, 0, 0.55);
+    }
+
+    #pipContainer>.pip-box>.pip-title {
+      font: 600 16px sans-serif;
+      padding: 6px 10px;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    #pipContainer>.pip-box>img,
+    #pipContainer>.pip-box>iframe {
+      display: block;
+      width: 100%;
+      border: 0;
+    }
 
     /* Status overlay */
     #statusOverlay {
-      position: fixed; inset: 0; background: #000; display: flex; flex-direction: column;
-      align-items: center; justify-content: center; color: #94a3b8; z-index: 500;
+      position: fixed;
+      inset: 0;
+      background: #000;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      color: #94a3b8;
+      z-index: 500;
+    }
+
+    #statusOverlay h2 {
+      color: #e65c00;
+      font-size: 28px;
+      margin-bottom: 8px;
+    }
+
+    #statusOverlay p {
+      font-size: 16px;
     }
-    #statusOverlay h2 { color: #3b82f6; font-size: 28px; margin-bottom: 8px; }
-    #statusOverlay p { font-size: 16px; }
   </style>
 </head>
+
 <body>
   <!-- Setup Screen -->
   <div id="setupScreen">
@@ -327,7 +515,7 @@
     function saveConfig(cfg) { localStorage.setItem(STORAGE_KEY, JSON.stringify(cfg)); }
     const PLAYLIST_CACHE_KEY = 'rd_playlist_cache';
     function savePlaylistCache(items) {
-      try { localStorage.setItem(PLAYLIST_CACHE_KEY, JSON.stringify(items)); } catch {}
+      try { localStorage.setItem(PLAYLIST_CACHE_KEY, JSON.stringify(items)); } catch { }
     }
     function loadPlaylistCache() {
       try { return JSON.parse(localStorage.getItem(PLAYLIST_CACHE_KEY) || '[]'); } catch { return []; }
@@ -337,7 +525,7 @@
     // switching to zones once the server payload arrives.
     const LAYOUT_CACHE_KEY = 'rd_layout_cache';
     function saveLayoutCache(l) {
-      try { localStorage.setItem(LAYOUT_CACHE_KEY, JSON.stringify(l || null)); } catch {}
+      try { localStorage.setItem(LAYOUT_CACHE_KEY, JSON.stringify(l || null)); } catch { }
     }
     function loadLayoutCache() {
       try { return JSON.parse(localStorage.getItem(LAYOUT_CACHE_KEY) || 'null'); } catch { return null; }
@@ -360,7 +548,7 @@
         if (reason) m.reason = reason;
         if (detail) m.detail = detail;
         socket.emit('device:event', m);
-      } catch (e) {}
+      } catch (e) { }
     }
     let playlist = [];
     let currentIndex = -1;
@@ -388,11 +576,13 @@
         if (!config || !config.deviceId || !config.deviceToken) return;   // unpaired -> nothing to attribute
         __exitSent = true;
         const url = (config.serverUrl || window.location.origin) + '/api/device/exit';
-        const body = JSON.stringify({ device_id: config.deviceId, device_token: config.deviceToken,
-          reason, detail: (typeof detail === 'string' && detail) ? detail.slice(0, 200) : undefined });
+        const body = JSON.stringify({
+          device_id: config.deviceId, device_token: config.deviceToken,
+          reason, detail: (typeof detail === 'string' && detail) ? detail.slice(0, 200) : undefined
+        });
         const blob = new Blob([body], { type: 'application/json' });      // Content-Type so express.json parses it
         if (navigator.sendBeacon && navigator.sendBeacon(url, blob)) return;
-        fetch(url, { method: 'POST', body, headers: { 'Content-Type': 'application/json' }, keepalive: true }).catch(() => {});
+        fetch(url, { method: 'POST', body, headers: { 'Content-Type': 'application/json' }, keepalive: true }).catch(() => { });
       } catch (e) { /* a dying page must never throw */ }
     }
     window.addEventListener('error', (ev) => {
@@ -471,7 +661,7 @@
     // player that has synced even once stays aligned through an internet outage (RTC drift is tiny).
     let clockOffsetMs = 0;
     let clockRttMs = null;
-    try { const c = localStorage.getItem('st_clock_offset'); if (c != null && isFinite(Number(c))) clockOffsetMs = Number(c); } catch (e) {}
+    try { const c = localStorage.getItem('st_clock_offset'); if (c != null && isFinite(Number(c))) clockOffsetMs = Number(c); } catch (e) { }
     function syncedNow() { return Date.now() + clockOffsetMs; }
     function ingestClockSample(serverMs, clientMs) {
       if (!serverMs || !clientMs) return;
@@ -483,13 +673,13 @@
       if (clockRttMs === null || Math.abs(sample - clockOffsetMs) > 1000) clockOffsetMs = Math.round(sample);
       else clockOffsetMs = Math.round(clockOffsetMs * 0.8 + sample * 0.2);
       clockRttMs = Math.round(rtt);
-      try { localStorage.setItem('st_clock_offset', String(clockOffsetMs)); } catch (e) {}
+      try { localStorage.setItem('st_clock_offset', String(clockOffsetMs)); } catch (e) { }
     }
 
     // Stream a group-sync diagnostic to the dashboard live-log (tag 'sync') + the in-page overlay.
     function groupReport(level, msg) {
-      try { if (socket?.connected && config.deviceId) socket.emit('device:log', { device_id: config.deviceId, tag: 'sync', level, message: msg }); } catch (e) {}
-      try { window.__debugLog_push && window.__debugLog_push({ type: 'sync', level: level, msg: msg }); } catch (e) {}
+      try { if (socket?.connected && config.deviceId) socket.emit('device:log', { device_id: config.deviceId, tag: 'sync', level, message: msg }); } catch (e) { }
+      try { window.__debugLog_push && window.__debugLog_push({ type: 'sync', level: level, msg: msg }); } catch (e) { }
     }
     let lastWallSync = null;
     let currentVideoEl = null;
@@ -515,7 +705,7 @@
     function unlockAudioContext() {
       try {
         if (!_audioCtx) _audioCtx = new (window.AudioContext || window.webkitAudioContext)();
-        if (_audioCtx.state === 'suspended') _audioCtx.resume().catch(() => {});
+        if (_audioCtx.state === 'suspended') _audioCtx.resume().catch(() => { });
         // Play a 1-sample silent buffer to fully promote the context to running.
         const buf = _audioCtx.createBuffer(1, 1, 22050);
         const src = _audioCtx.createBufferSource();
@@ -543,7 +733,7 @@
       const p = video.play();
       if (p && typeof p.then === 'function') {
         p.then(() => {
-          if (isFinite(t)) { try { video.currentTime = t; } catch {} }
+          if (isFinite(t)) { try { video.currentTime = t; } catch { } }
           console.log('[wall/audio] unmuted play() ok muted=' + video.muted + ' volume=' + video.volume);
           hideEnableAudioPrompt();
         }).catch((err) => {
@@ -593,7 +783,7 @@
         tryUnmuteLeader();
         // Unmute YouTube player if active
         if (activeYtPlayer && typeof activeYtPlayer.unMute === 'function') {
-          try { activeYtPlayer.unMute(); activeYtPlayer.setVolume(100); console.log('Unmuted YouTube player'); } catch {}
+          try { activeYtPlayer.unMute(); activeYtPlayer.setVolume(100); console.log('Unmuted YouTube player'); } catch { }
         }
       }, { once: false });
     });
@@ -636,21 +826,21 @@
     // Function used by connect button and auto-connect
     let autoContinueTimer;
     function connectBtnFunc() {
-        if (autoContinueTimer) {
-          clearInterval(autoContinueTimer);
-          autoContinueTimer = null;
-          document.getElementById('connectBtn').textContent = _t('connect');
-        }
-        unlockAudio();
-        const url = document.getElementById('serverUrl').value.trim().replace(/\/$/, '');
-        if (!url) return;
-        config.serverUrl = url;
-        saveConfig(config);
-        document.getElementById('connectBtn').disabled = true;
-        document.getElementById('setupSpinner').style.display = 'block';
-        document.getElementById('setupStatus').textContent = 'Connecting...';
-        connect(url);
-      };
+      if (autoContinueTimer) {
+        clearInterval(autoContinueTimer);
+        autoContinueTimer = null;
+        document.getElementById('connectBtn').textContent = _t('connect');
+      }
+      unlockAudio();
+      const url = document.getElementById('serverUrl').value.trim().replace(/\/$/, '');
+      if (!url) return;
+      config.serverUrl = url;
+      saveConfig(config);
+      document.getElementById('connectBtn').disabled = true;
+      document.getElementById('setupSpinner').style.display = 'block';
+      document.getElementById('setupStatus').textContent = 'Connecting...';
+      connect(url);
+    };
 
     // #104: device-free dashboard preview. Render a draft playlist by id with NO
     // pairing and NO socket. Gated here, before the normal boot, so the unpaired
@@ -660,88 +850,88 @@
       bootPreview(_previewQS);
     } else {
 
-    // Auto-detect server URL from origin since player is served from the same server
-    if (!config.serverUrl) {
-      config.serverUrl = window.location.origin;
-      saveConfig(config);
-    }
-
-    if (config.serverUrl && config.deviceId && config.paired) {
-      // Restore cached playlist immediately so content plays even if offline —
-      // but ONLY if we also know the layout, else we'd guess fullscreen and flash
-      // before the payload arrives. Key presence (not value) is the test: an absent
-      // key means "layout unknown" (e.g. first run after this shipped, or cleared
-      // cache), while a stored `null` is a real fullscreen device. Both caches are
-      // written on every payload, so after the first connection this always renders
-      // immediately; only a genuinely-unknown layout waits (~1s) for the payload.
-      const cachedPlaylist = loadPlaylistCache();
-      const layoutKnown = localStorage.getItem(LAYOUT_CACHE_KEY) !== null;
-      if (cachedPlaylist.length > 0 && layoutKnown) {
-        console.log('Restored cached playlist:', cachedPlaylist.length, 'items');
-        playlist = cachedPlaylist;
-        layout = loadLayoutCache();
-        document.getElementById('setupScreen').style.display = 'none';
-        startPlaybackAt(0); // #74/#75: honour schedules from the first frame on cold-start
-        // #group-sync: if this device was in a sync group, resume the schedule immediately from the
-        // cached clock offset — so a reboot mid-outage comes back aligned WITHOUT waiting for a server.
-        try { const cg = localStorage.getItem('st_group_sync'); if (cg) applyGroupSync(JSON.parse(cg)); } catch (e) {}
+      // Auto-detect server URL from origin since player is served from the same server
+      if (!config.serverUrl) {
+        config.serverUrl = window.location.origin;
+        saveConfig(config);
       }
 
-      // Always show the tap overlay on cold load. Browser autoplay policy is
-      // per-document — a localStorage flag from a prior session does not grant
-      // audio autoplay to a fresh page. The overlay auto-dismisses after 5s and
-      // connects muted, so unattended kiosks still recover without a human tap.
-      {
-        const tapOverlay = document.createElement('div');
-        tapOverlay.style.cssText = 'position:fixed;inset:0;background:#111827;z-index:2000;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer';
-        tapOverlay.innerHTML = `
-          <h1 style="color:#3b82f6;font-size:36px;font-family:sans-serif;margin-bottom:12px">ScreenTinker</h1>
+      if (config.serverUrl && config.deviceId && config.paired) {
+        // Restore cached playlist immediately so content plays even if offline —
+        // but ONLY if we also know the layout, else we'd guess fullscreen and flash
+        // before the payload arrives. Key presence (not value) is the test: an absent
+        // key means "layout unknown" (e.g. first run after this shipped, or cleared
+        // cache), while a stored `null` is a real fullscreen device. Both caches are
+        // written on every payload, so after the first connection this always renders
+        // immediately; only a genuinely-unknown layout waits (~1s) for the payload.
+        const cachedPlaylist = loadPlaylistCache();
+        const layoutKnown = localStorage.getItem(LAYOUT_CACHE_KEY) !== null;
+        if (cachedPlaylist.length > 0 && layoutKnown) {
+          console.log('Restored cached playlist:', cachedPlaylist.length, 'items');
+          playlist = cachedPlaylist;
+          layout = loadLayoutCache();
+          document.getElementById('setupScreen').style.display = 'none';
+          startPlaybackAt(0); // #74/#75: honour schedules from the first frame on cold-start
+          // #group-sync: if this device was in a sync group, resume the schedule immediately from the
+          // cached clock offset — so a reboot mid-outage comes back aligned WITHOUT waiting for a server.
+          try { const cg = localStorage.getItem('st_group_sync'); if (cg) applyGroupSync(JSON.parse(cg)); } catch (e) { }
+        }
+
+        // Always show the tap overlay on cold load. Browser autoplay policy is
+        // per-document — a localStorage flag from a prior session does not grant
+        // audio autoplay to a fresh page. The overlay auto-dismisses after 5s and
+        // connects muted, so unattended kiosks still recover without a human tap.
+        {
+          const tapOverlay = document.createElement('div');
+          tapOverlay.style.cssText = 'position:fixed;inset:0;background:#111827;z-index:2000;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer';
+          tapOverlay.innerHTML = `
+          <h1 style="color:#e65c00;font-size:36px;font-family:sans-serif;margin-bottom:12px">ScreenTinker</h1>
           <p style="color:#94a3b8;font-size:18px;font-family:sans-serif">Tap anywhere to start</p>
           <p style="color:#64748b;font-size:13px;font-family:sans-serif;margin-top:24px">Audio requires user interaction</p>
         `;
-        tapOverlay.onclick = () => {
-          unlockAudio();
-          tapOverlay.remove();
-          if (!isPlaying) showStatus(_t('connecting'));
-          connect(config.serverUrl);
-        };
-        document.body.appendChild(tapOverlay);
-
-        // Auto-dismiss after 5 seconds if no interaction (plays muted)
-        setTimeout(() => {
-          if (tapOverlay.parentNode) {
+          tapOverlay.onclick = () => {
+            unlockAudio();
             tapOverlay.remove();
-            if (!isPlaying) showStatus(_t('connecting_muted'));
+            if (!isPlaying) showStatus(_t('connecting'));
             connect(config.serverUrl);
+          };
+          document.body.appendChild(tapOverlay);
+
+          // Auto-dismiss after 5 seconds if no interaction (plays muted)
+          setTimeout(() => {
+            if (tapOverlay.parentNode) {
+              tapOverlay.remove();
+              if (!isPlaying) showStatus(_t('connecting_muted'));
+              connect(config.serverUrl);
+            }
+          }, 5000);
+        }
+      } else {
+        // Auto-Continue after 5s if not configured. If user interacts with form (typing in the box), stop the timer.
+
+        let countdown = 5;
+        const connectBtn = document.getElementById('connectBtn');
+
+        connectBtn.textContent = `${_t('connect')} (${countdown})`;
+
+        autoContinueTimer = setInterval(() => {
+          countdown--;
+          if (countdown > 0) {
+            connectBtn.textContent = `${_t('connect')} (${countdown})`;
+          } else {
+            clearInterval(autoContinueTimer);
+            connectBtn.textContent = _t('connect');
+            connectBtnFunc()
           }
-        }, 5000);
+        }, 1000);
+
+        document.getElementById('serverUrl').addEventListener('input', () => {
+          if (countdown > 0) {
+            clearInterval(autoContinueTimer);
+            connectBtn.textContent = _t('connect');
+          }
+        });
       }
-    } else {
-      // Auto-Continue after 5s if not configured. If user interacts with form (typing in the box), stop the timer.
-      
-      let countdown = 5;
-      const connectBtn = document.getElementById('connectBtn');
-
-      connectBtn.textContent = `${_t('connect')} (${countdown})`;
-
-      autoContinueTimer = setInterval(() => {
-        countdown--;
-        if (countdown > 0) {
-          connectBtn.textContent = `${_t('connect')} (${countdown})`;
-        } else {
-          clearInterval(autoContinueTimer);
-          connectBtn.textContent = _t('connect');
-          connectBtnFunc()
-        }
-      }, 1000);
-
-      document.getElementById('serverUrl').addEventListener('input', () => {
-        if (countdown > 0) {
-          clearInterval(autoContinueTimer);
-          connectBtn.textContent = _t('connect');
-        }
-      });
-    }
     } // #104: end preview-mode gate (else branch wrapping the normal boot)
 
     // ==================== Setup UI ====================
@@ -762,7 +952,7 @@
         src.buffer = buf;
         src.connect(ctx.destination);
         src.start(0);
-      } catch(e) { console.warn('Audio unlock failed:', e); }
+      } catch (e) { console.warn('Audio unlock failed:', e); }
       // Wall followers must stay muted — leader is the only audio source.
       if (isWallFollower()) return;
       // Unmute any playing HTML5 video
@@ -855,7 +1045,7 @@
     // one, so we never guess; we just tell the truth. Preview-only (never on device).
     function addWebpageNote(container) {
       if (!PREVIEW_MODE || !container) return;
-      try { if (getComputedStyle(container).position === 'static') container.style.position = 'relative'; } catch (e) {}
+      try { if (getComputedStyle(container).position === 'static') container.style.position = 'relative'; } catch (e) { }
       const note = document.createElement('div');
       note.className = 'preview-webpage-note';
       note.textContent = _t('preview_webpage_blocked');
@@ -993,7 +1183,7 @@
               link_lost: linkLostDuringGap,
               cold_start: false,
             });
-          } catch (e) {}
+          } catch (e) { }
           disconnectedAt = 0; linkLostDuringGap = false;
         }
 
@@ -1085,15 +1275,15 @@
           const absDrift = Math.abs(drift);
           if (absDrift > 0.3 && isFinite(currentVideoEl.duration) && target < currentVideoEl.duration) {
             // Big drift: hard seek and reset rate.
-            try { currentVideoEl.currentTime = target; } catch (_) {}
-            try { currentVideoEl.playbackRate = 1.0; } catch (_) {}
+            try { currentVideoEl.currentTime = target; } catch (_) { }
+            try { currentVideoEl.playbackRate = 1.0; } catch (_) { }
           } else if (absDrift > 0.05) {
             // Small drift: nudge playbackRate to converge gently. ±3% is
             // imperceptible on most content but pulls in 50ms drift in <2s.
-            try { currentVideoEl.playbackRate = drift > 0 ? 0.97 : 1.03; } catch (_) {}
+            try { currentVideoEl.playbackRate = drift > 0 ? 0.97 : 1.03; } catch (_) { }
           } else if (currentVideoEl.playbackRate !== 1.0) {
             // In-window: ride at normal rate.
-            try { currentVideoEl.playbackRate = 1.0; } catch (_) {}
+            try { currentVideoEl.playbackRate = 1.0; } catch (_) { }
           }
         }
       });
@@ -1194,7 +1384,7 @@
       socket.on('device:mute-changed', (data) => {
         const item = playlist[currentIndex];
         if (data && item && data.content_id && item.content_id === data.content_id && currentVideoEl) {
-          try { currentVideoEl.muted = !!data.muted; } catch (_) {}
+          try { currentVideoEl.muted = !!data.muted; } catch (_) { }
         }
       });
 
@@ -1218,17 +1408,17 @@
     const pipColor = (c) => (typeof c === 'string' && /^#[0-9A-Fa-f]{6}$/.test(c)) ? c : null;
     const pipPx = (v, d) => { const n = Number(v); return (isFinite(n) && n > 0 ? n : d) + 'px'; };
     function pipReport(level, msg) {
-      try { if (socket?.connected && config.deviceId) socket.emit('device:log', { device_id: config.deviceId, tag: 'pip', level, message: msg }); } catch (e) {}
+      try { if (socket?.connected && config.deviceId) socket.emit('device:log', { device_id: config.deviceId, tag: 'pip', level, message: msg }); } catch (e) { }
     }
     // Zone diagnostics (orphaned zone_id fallback). Mirrors pipReport: stream to the
     // dashboard device-log (tag 'zone') AND the in-page debug overlay buffer.
     function zoneReport(level, msg) {
-      try { if (socket?.connected && config.deviceId) socket.emit('device:log', { device_id: config.deviceId, tag: 'zone', level, message: msg }); } catch (e) {}
-      try { window.__debugLog_push && window.__debugLog_push({ type: 'zone', level: level, msg: msg }); } catch (e) {}
-      try { console.warn('[zone] ' + msg); } catch (e) {}
+      try { if (socket?.connected && config.deviceId) socket.emit('device:log', { device_id: config.deviceId, tag: 'zone', level, message: msg }); } catch (e) { }
+      try { window.__debugLog_push && window.__debugLog_push({ type: 'zone', level: level, msg: msg }); } catch (e) { }
+      try { console.warn('[zone] ' + msg); } catch (e) { }
     }
     function pipTeardown() {
-      try { if (pipTimer) clearTimeout(pipTimer); } catch (e) {}
+      try { if (pipTimer) clearTimeout(pipTimer); } catch (e) { }
       pipTimer = null; pipCurrent = null;
       const c = document.getElementById('pipContainer'); if (c) c.innerHTML = '';
     }
@@ -1380,7 +1570,7 @@
       fetch(config.serverUrl + '/api/version').then(r => r.json()).then(data => {
         knownServerHash = data.hash;
         console.log('Server version:', data.version, 'hash:', data.hash);
-      }).catch(() => {});
+      }).catch(() => { });
       // Poll every 30s
       versionCheckTimer = setInterval(() => {
         fetch(config.serverUrl + '/api/version').then(r => r.json()).then(data => {
@@ -1388,7 +1578,7 @@
             console.log('Server code updated, reloading...', knownServerHash, '->', data.hash);
             location.reload();
           }
-        }).catch(() => {});
+        }).catch(() => { });
       }, 30000);
     }
 
@@ -1530,14 +1720,14 @@
         const ad = Math.abs(drift);
         if (currentIndex !== groupLastAlignedIndex) groupAlignPending = true;
         if (groupAlignPending) {
-          if (ad > 0.05) { try { currentVideoEl.currentTime = target; } catch (e) {} groupLastSeekAt = Date.now(); }
-          try { currentVideoEl.playbackRate = 1.0; } catch (e) {}
+          if (ad > 0.05) { try { currentVideoEl.currentTime = target; } catch (e) { } groupLastSeekAt = Date.now(); }
+          try { currentVideoEl.playbackRate = 1.0; } catch (e) { }
           groupAlignPending = false; groupLastAlignedIndex = currentIndex;
           action = 'align ' + drift.toFixed(2);
         }
-        else if (ad > 0.3 && Date.now() - groupLastSeekAt > 1200) { try { currentVideoEl.currentTime = target; } catch (e) {} try { currentVideoEl.playbackRate = 1.0; } catch (e) {} groupLastSeekAt = Date.now(); action = 'seek ' + drift.toFixed(2); }
-        else if (ad > 0.05) { try { currentVideoEl.playbackRate = drift > 0 ? 0.97 : 1.03; } catch (e) {} action = 'nudge ' + drift.toFixed(2); }
-        else if (currentVideoEl.playbackRate !== 1.0) { try { currentVideoEl.playbackRate = 1.0; } catch (e) {} }
+        else if (ad > 0.3 && Date.now() - groupLastSeekAt > 1200) { try { currentVideoEl.currentTime = target; } catch (e) { } try { currentVideoEl.playbackRate = 1.0; } catch (e) { } groupLastSeekAt = Date.now(); action = 'seek ' + drift.toFixed(2); }
+        else if (ad > 0.05) { try { currentVideoEl.playbackRate = drift > 0 ? 0.97 : 1.03; } catch (e) { } action = 'nudge ' + drift.toFixed(2); }
+        else if (currentVideoEl.playbackRate !== 1.0) { try { currentVideoEl.playbackRate = 1.0; } catch (e) { } }
       }
       // Log discrete corrections (jump/align/seek) immediately so the transition is visible; only the
       // routine steady-state line (hold/nudge) is throttled — else the one-tick "align" on load is
@@ -1559,7 +1749,7 @@
       if (!isVid) { groupPreloadIdx = idx; groupPreloadEl = null; return; }   // mark handled, nothing to warm
       const url = item.remote_url || (config.serverUrl + '/uploads/content/' + item.filepath);
       try {
-        if (groupPreloadEl) { try { groupPreloadEl.remove(); } catch (e) {} }
+        if (groupPreloadEl) { try { groupPreloadEl.remove(); } catch (e) { } }
         const v = document.createElement('video');
         v.src = url; v.muted = true; v.playsInline = true; v.preload = 'auto';
         v.style.cssText = 'position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;left:-9999px';
@@ -1580,10 +1770,10 @@
     // just start the schedule tick. Idempotent across refreshes/role churn (there is no role now).
     function applyGroupSync(cfg) {
       if (groupSyncTimer) { clearInterval(groupSyncTimer); groupSyncTimer = null; }
-      try { if (cfg) localStorage.setItem('st_group_sync', JSON.stringify(cfg)); else localStorage.removeItem('st_group_sync'); } catch (e) {}
+      try { if (cfg) localStorage.setItem('st_group_sync', JSON.stringify(cfg)); else localStorage.removeItem('st_group_sync'); } catch (e) { }
       if (!cfg) {
         if (groupSync) groupReport('info', 'group-sync exited'); groupSync = null; console.log('[group-sync] exited');
-        if (groupPreloadEl) { try { groupPreloadEl.remove(); } catch (e) {} groupPreloadEl = null; groupPreloadIdx = -1; }
+        if (groupPreloadEl) { try { groupPreloadEl.remove(); } catch (e) { } groupPreloadEl = null; groupPreloadIdx = -1; }
         reconcileAdvanceTimerForMode();   // #200: back to solo -> re-arm a surviving image/widget's timer
         return;
       }
@@ -1608,9 +1798,9 @@
       const s = wallConfig.screen_rect;
       const p = wallConfig.player_rect;
       if (!s.w || !s.h) return;
-      const left   = ((p.x - s.x) / s.w) * 100;
-      const top    = ((p.y - s.y) / s.h) * 100;
-      const width  = (p.w / s.w) * 100;
+      const left = ((p.x - s.x) / s.w) * 100;
+      const top = ((p.y - s.y) / s.h) * 100;
+      const width = (p.w / s.w) * 100;
       const height = (p.h / s.h) * 100;
       const dev = (config.deviceId || '?').slice(0, 8);
       console.log('[wall/render ' + dev + '] screen_rect: ' + JSON.stringify(s) + ' player_rect: ' + JSON.stringify(p));
@@ -1626,7 +1816,7 @@
     // No-op kept for callers that bind a resize listener (kept around in case
     // future zoom/orientation tweaks need it). vw/vh stage updates with the
     // viewport automatically, so explicit re-style isn't needed today.
-    function bindWallResizeOnce() {}
+    function bindWallResizeOnce() { }
 
     // ==================== Playlist ====================
     function handlePlaylistUpdate(data) {
@@ -1724,9 +1914,9 @@
           const item = playlist[currentIndex];
           const kind = !item ? 'other'
             : item.widget_id ? 'widget'
-            : item.mime_type === 'video/youtube' ? 'youtube'
-            : (typeof item.mime_type === 'string' && item.mime_type.startsWith('video/')) ? 'video'
-            : (typeof item.mime_type === 'string' && item.mime_type.startsWith('image/')) ? 'image' : 'other';
+              : item.mime_type === 'video/youtube' ? 'youtube'
+                : (typeof item.mime_type === 'string' && item.mime_type.startsWith('video/')) ? 'video'
+                  : (typeof item.mime_type === 'string' && item.mime_type.startsWith('image/')) ? 'image' : 'other';
           const container = document.getElementById('playerContainer');
           const state = {
             isPlaying: isPlaying,
@@ -1958,7 +2148,7 @@
       const myGeneration = ++ytGeneration;
 
       // Destroy old player without triggering side effects (callbacks check generation)
-      if (activeYtPlayer) { try { activeYtPlayer.destroy(); } catch {} activeYtPlayer = null; }
+      if (activeYtPlayer) { try { activeYtPlayer.destroy(); } catch { } activeYtPlayer = null; }
 
       // Vertical (Shorts) content is tagged st_aspect=vertical at ingest. Render it
       // in a centered 9:16 box so it fills a portrait screen and pillarboxes cleanly
@@ -2099,7 +2289,7 @@
         if (keep) {
           // Buffered widget swap: drop the outgoing content but keep the freshly-loaded
           // iframe we're swapping in.
-          Array.from(container.children).forEach(ch => { if (ch !== keep) { try { ch.remove(); } catch (e) {} } });
+          Array.from(container.children).forEach(ch => { if (ch !== keep) { try { ch.remove(); } catch (e) { } } });
         } else {
           container.innerHTML = '';
         }
@@ -2125,7 +2315,7 @@
     function discardPendingSwap() {
       if (!pendingWidgetSwap) return;
       clearTimeout(pendingWidgetSwap.timer);
-      try { pendingWidgetSwap.iframe.remove(); } catch (e) {}
+      try { pendingWidgetSwap.iframe.remove(); } catch (e) { }
       pendingWidgetSwap = null;
     }
 
@@ -2142,7 +2332,7 @@
       discardPendingSwap();
 
       const iframe = document.createElement('iframe');
-      iframe.src = `${config.serverUrl}/api/widgets/${item.widget_id}/render?device=${encodeURIComponent(config.deviceId||'')}`;
+      iframe.src = `${config.serverUrl}/api/widgets/${item.widget_id}/render?device=${encodeURIComponent(config.deviceId || '')}`;
       // Positioned + sized by the `#playerContainer > iframe` CSS rule. Hidden while it
       // loads so its black background never shows over the outgoing content.
       iframe.style.background = '#000';
@@ -2226,7 +2416,7 @@
       if (imgPreloadCache[src]) return;
       loadImageCors(src, proxySrcFor(it), (img) => {
         (img.decode ? img.decode() : Promise.resolve()).then(() => cacheImg(src, img)).catch(() => cacheImg(src, img));
-      }, () => {}); // preload best-effort; a failed warm just means renderImageBuffered loads it live
+      }, () => { }); // preload best-effort; a failed warm just means renderImageBuffered loads it live
     }
     // Plain hard-cut mount: tear down the outgoing frame, show the incoming image, arm the dwell.
     function mountImage(img, item) {
@@ -2415,7 +2605,7 @@
       const t = item.transition;
       const mySeq = renderSeq;
       const stale = () => renderSeq !== mySeq;          // a newer renderContent superseded this one
-      const abandon = () => { try { video.pause(); video.removeAttribute('src'); video.load(); } catch (e) {} };
+      const abandon = () => { try { video.pause(); video.removeAttribute('src'); video.load(); } catch (e) { } };
       const video = document.createElement('video');
       video.crossOrigin = 'anonymous';                  // texturable (CORS-clean) + matches the legacy branch
       video.playsInline = true;
@@ -2439,15 +2629,15 @@
         if (!video.muted) video.volume = 1.0;
         video.onended = () => { if (!video.loop) nextItem(); };
         video.onerror = (e) => { console.error('Video error:', src, e); advanceTimer = setTimeout(nextItem, 3000); };
-        video.play().catch(() => { video.muted = true; video.play().catch(() => {}); }); // autoplay-policy fallback
-        setTimeout(() => { if (video.paused) { video.muted = true; video.play().catch(() => {}); } }, 2000); // last-resort kick
+        video.play().catch(() => { video.muted = true; video.play().catch(() => { }); }); // autoplay-policy fallback
+        setTimeout(() => { if (video.paused) { video.muted = true; video.play().catch(() => { }); } }, 2000); // last-resort kick
       };
       // First PRESENTED frame reached (or watchdog): freeze it, snapshot, wipe if we have from+to+runtime.
       const onFirstFrame = () => {
         if (done) return; done = true;
         if (watchdog) clearTimeout(watchdog);
         if (stale()) { abandon(); return; }             // superseded before the wipe even started
-        try { video.pause(); } catch (e) {}             // hold at the snapshot frame; mountVideo resumes from here
+        try { video.pause(); } catch (e) { }             // hold at the snapshot frame; mountVideo resumes from here
         const canTexture = video.readyState >= 2 && video.videoWidth > 0 && isMediaReadable(video);
         let to = null;
         if (canTexture) {
@@ -2458,7 +2648,7 @@
         }
         if (from && to && t && Array.isArray(t.effects) && t.effects.length && transitionRuntimeReady()) {
           runGlWipe(from, to, t, t.durationMs + 200,     // video has no image-dwell; bound only keeps the full duration
-            () => {},                                    // onStart: video advance is driven by 'ended', not a dwell timer
+            () => { },                                    // onStart: video advance is driven by 'ended', not a dwell timer
             mountVideo, mountVideo);                      // mount AND hardCut both mount+resume the real video
         } else {
           mountVideo();                                  // no from-frame / un-texturable / no runtime -> hard cut
@@ -2585,9 +2775,9 @@
       //  - scheduleDriven:  who does NOT run a local advance timer. Wall followers (leader drives the
       //                     index) AND all group members (the clock/schedule tick drives the index).
       const isWallFollower_ = (!!wallConfig && !wallConfig.is_leader);
-      const scheduleDriven  = isWallFollower_ || !!groupSync;
-      const forceMuted      = isWallFollower_;
-      const isFollower      = scheduleDriven;   // keep the old name for the branches below (advance gating)
+      const scheduleDriven = isWallFollower_ || !!groupSync;
+      const forceMuted = isWallFollower_;
+      const isFollower = scheduleDriven;   // keep the old name for the branches below (advance gating)
 
       const isYoutube = item.mime_type === 'video/youtube';
       const isVideo = !isYoutube && item.mime_type?.startsWith('video/');
@@ -2661,7 +2851,7 @@
               .catch((e2) => console.error('[wall/audio] muted-fallback play() also failed: ' + (e2?.name || e2?.message || e2)));
           });
           // Fallback: force play if not started after 2s
-          setTimeout(() => { if (video.paused) { video.muted = true; video.play().catch(() => {}); } }, 2000);
+          setTimeout(() => { if (video.paused) { video.muted = true; video.play().catch(() => { }); } }, 2000);
         } else if (isImage) {
           const img = document.createElement('img');
           img.src = src;
@@ -2677,7 +2867,7 @@
           if (!isFollower) advanceTimer = setTimeout(nextItem, (item.duration_sec || 10) * 1000);
         } else if (item.widget_id) {
           const iframe = document.createElement('iframe');
-          iframe.src = `${serverUrl}/api/widgets/${item.widget_id}/render?device=${encodeURIComponent(config.deviceId||'')}`;
+          iframe.src = `${serverUrl}/api/widgets/${item.widget_id}/render?device=${encodeURIComponent(config.deviceId || '')}`;
           iframe.style.cssText = 'width:100%;height:100%;border:none;background:#000';
           iframe.allow = 'autoplay; fullscreen';
           // Sandbox into a unique origin so widget scripts can't read window.parent
@@ -2699,7 +2889,7 @@
       return -1;
     }
     function showZoneEmpty(zone, div, items) {
-      div.querySelectorAll('video').forEach(v => { try { v.pause(); } catch (e) {} });
+      div.querySelectorAll('video').forEach(v => { try { v.pause(); } catch (e) { } });
       div.innerHTML = '';
       zoneTimers[zone.id] = setTimeout(() => showZoneItem(zone, div, items, 0), 30000);
     }
@@ -2739,8 +2929,8 @@
       if (PREVIEW_MODE) {
         previewBannerParts.orphans = orphanNames.length
           ? orphanNames.length + ' item(s) assigned to a different layout: ' +
-            orphanNames.slice(0, 6).join(', ') + (orphanNames.length > 6 ? '…' : '') +
-            ' — showing in "' + ((fallbackZone && (fallbackZone.name || fallbackZone.id)) || '—') + '"'
+          orphanNames.slice(0, 6).join(', ') + (orphanNames.length > 6 ? '…' : '') +
+          ' — showing in "' + ((fallbackZone && (fallbackZone.name || fallbackZone.id)) || '—') + '"'
           : null;
         renderPreviewBanner();
       }
@@ -2777,7 +2967,7 @@
       const multi = items.length > 1 || items.some(it => it.schedules && it.schedules.length);
       const advance = () => showZoneItem(zone, div, items, index + 1);
       // Tear down any prior media in this zone before swapping.
-      div.querySelectorAll('video').forEach(v => { try { v.onended = null; v.pause(); v.removeAttribute('src'); v.load(); } catch (e) {} });
+      div.querySelectorAll('video').forEach(v => { try { v.onended = null; v.pause(); v.removeAttribute('src'); v.load(); } catch (e) { } });
       div.innerHTML = '';
 
       const isYoutube = a.mime_type === 'video/youtube';
@@ -2791,7 +2981,7 @@
       // Android player, which keys off the assignment's widget_type.
       if (a.widget_id) {
         const iframe = document.createElement('iframe');
-        iframe.src = `${config.serverUrl}/api/widgets/${a.widget_id}/render?device=${encodeURIComponent(config.deviceId||'')}`;
+        iframe.src = `${config.serverUrl}/api/widgets/${a.widget_id}/render?device=${encodeURIComponent(config.deviceId || '')}`;
         // Sandbox into a unique origin so widget scripts can't read window.parent
         // state (localStorage / JWT). allow-scripts keeps inline widget code running.
         iframe.setAttribute('sandbox', 'allow-scripts');
@@ -2902,9 +3092,9 @@
         const el = zd.querySelector('video, img, iframe');
         let drawn = false;
         if (el && el.tagName === 'IMG' && el.complete && el.naturalWidth > 0 && isMediaReadable(el)) {
-          try { drawMediaFit(ctx, el, el.naturalWidth, el.naturalHeight, dx, dy, dw, dh, getComputedStyle(el).objectFit); drawn = true; } catch (e) {}
+          try { drawMediaFit(ctx, el, el.naturalWidth, el.naturalHeight, dx, dy, dw, dh, getComputedStyle(el).objectFit); drawn = true; } catch (e) { }
         } else if (el && el.tagName === 'VIDEO' && el.readyState >= 2 && el.videoWidth > 0 && isMediaReadable(el)) {
-          try { drawMediaFit(ctx, el, el.videoWidth, el.videoHeight, dx, dy, dw, dh, getComputedStyle(el).objectFit); drawn = true; } catch (e) {}
+          try { drawMediaFit(ctx, el, el.videoWidth, el.videoHeight, dx, dy, dw, dh, getComputedStyle(el).objectFit); drawn = true; } catch (e) { }
         }
         if (!drawn) drawZonePlaceholder(ctx, dx, dy, dw, dh, zonePlaceholderLabel(el));
       });
@@ -2947,7 +3137,7 @@
         if (!captured) {
           ctx.fillStyle = '#111827';
           ctx.fillRect(0, 0, W, H);
-          ctx.fillStyle = '#3b82f6';
+          ctx.fillStyle = '#e65c00';
           ctx.font = 'bold 28px sans-serif';
           ctx.textAlign = 'center';
           ctx.fillText('ScreenTinker Web Player', W / 2, H / 2 - 40);
@@ -3023,7 +3213,7 @@
     infoDiv.id = 'infoOverlay';
     infoDiv.style.cssText = 'position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:800;display:none;flex-direction:column;align-items:center;justify-content:center;color:#f1f5f9;font-family:-apple-system,sans-serif';
     infoDiv.innerHTML = `
-      <h2 style="color:#3b82f6;margin-bottom:16px">${_t('info_title')}</h2>
+      <h2 style="color:#e65c00;margin-bottom:16px">${_t('info_title')}</h2>
       <div style="font-size:14px;line-height:2;text-align:center;color:#94a3b8" id="infoContent"></div>
       <p style="margin-top:24px;font-size:12px;color:#64748b">${_t('info_close_hint')}</p>
     `;
@@ -3032,7 +3222,7 @@
 
     // Escape user-controllable values before injecting into innerHTML — filenames,
     // device names, and server URLs are stored on the server and could contain HTML.
-    const escHtml = (s) => s == null ? '' : String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;').replace(/'/g,'&#39;');
+    const escHtml = (s) => s == null ? '' : String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
 
     // Update info overlay content periodically
     setInterval(() => {
@@ -3062,7 +3252,7 @@
       if (!e.isTrusted) return;
       if (!document.fullscreenElement && config.paired) {
         document.documentElement.requestFullscreen?.() ||
-        document.documentElement.webkitRequestFullscreen?.();
+          document.documentElement.webkitRequestFullscreen?.();
       }
     });
 
@@ -3074,7 +3264,7 @@
           wakeLock = await navigator.wakeLock.request('screen');
           wakeLock.addEventListener('release', () => { setTimeout(requestWakeLock, 1000); });
         }
-      } catch {}
+      } catch { }
     }
     requestWakeLock();
     // v4 browser half-open triggers: tab foreground / bfcache resume / network change all drive the
@@ -3144,4 +3334,5 @@
     });
   </script>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/server/routes/admin.js b/server/routes/admin.js
index d8b03ae..ab8f1c7 100644
--- a/server/routes/admin.js
+++ b/server/routes/admin.js
@@ -351,7 +351,7 @@ router.put('/branding', requirePlatformAdmin, (req, res) => {
       PLATFORM_DEFAULT_ID, req.user.id,
       req.body.brand_name || 'ScreenTinker',
       req.body.logo_url || null, req.body.favicon_url || null,
-      req.body.primary_color || '#3B82F6', req.body.secondary_color || '#1E293B', req.body.bg_color || '#111827',
+      req.body.primary_color || '#e65c00', req.body.secondary_color || '#1E293B', req.body.bg_color || '#111827',
       req.body.custom_css || null, req.body.hide_branding ? 1 : 0
     );
   }
diff --git a/server/routes/ai.js b/server/routes/ai.js
index d101e3b..19b5e66 100644
--- a/server/routes/ai.js
+++ b/server/routes/ai.js
@@ -110,7 +110,7 @@ function normalizeDesign(raw) {
         x: Math.min(clampN(e.x, 0, 100, 0), 100 - w),
         y: Math.min(clampN(e.y, 0, 100, 0), 100 - h),
         width: w, height: h,
-        color: hex(e.color, '#3b82f6'), opacity: clampN(e.opacity, 0, 1, 0.85), radius: 0,
+        color: hex(e.color, '#e65c00'), opacity: clampN(e.opacity, 0, 1, 0.85), radius: 0,
       });
     }
   }
diff --git a/server/routes/device-groups.js b/server/routes/device-groups.js
index 822f45b..52a0cca 100644
--- a/server/routes/device-groups.js
+++ b/server/routes/device-groups.js
@@ -72,7 +72,7 @@ router.post('/', (req, res) => {
   if (color && !VALID_COLOR.test(color)) return res.status(400).json({ error: 'invalid color format, use #RRGGBB' });
   const id = uuidv4();
   db.prepare('INSERT INTO device_groups (id, user_id, workspace_id, name, color) VALUES (?, ?, ?, ?, ?)')
-    .run(id, req.user.id, req.workspaceId, name, color || '#3B82F6');
+    .run(id, req.user.id, req.workspaceId, name, color || '#e65c00');
   res.status(201).json(db.prepare('SELECT * FROM device_groups WHERE id = ?').get(id));
 });
 
diff --git a/server/routes/kiosk.js b/server/routes/kiosk.js
index f26e1c2..945f7c9 100644
--- a/server/routes/kiosk.js
+++ b/server/routes/kiosk.js
@@ -103,7 +103,7 @@ router.get('/:id/render', (req, res) => {
     text-align:center; cursor:pointer; transition:all 0.2s ease; touch-action:manipulation;
     display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
   }
-  .kiosk-btn:hover, .kiosk-btn:active { background:${safeColor(style.buttonHover, '#3b82f6')}; border-color:${safeColor(style.buttonHover, '#3b82f6')}; transform:scale(1.02); }
+  .kiosk-btn:hover, .kiosk-btn:active { background:${safeColor(style.buttonHover, '#e65c00')}; border-color:${safeColor(style.buttonHover, '#e65c00')}; transform:scale(1.02); }
   .kiosk-btn .icon { font-size:${safeNumber(style.iconSize, 48)}px; }
   .kiosk-btn .label { font-size:${safeNumber(style.labelSize, 20)}px; font-weight:600; }
   .kiosk-btn .sublabel { font-size:${safeNumber(style.sublabelSize, 14)}px; opacity:0.6; }
@@ -245,7 +245,7 @@ function getDefaultKioskConfig() {
       columns: 3,
       buttonBg: '#1e293b',
       buttonBorder: '#334155',
-      buttonHover: '#3b82f6',
+      buttonHover: '#e65c00',
       buttonRadius: 16,
       buttonPadding: 32,
       gap: 24,
diff --git a/server/routes/schedules.js b/server/routes/schedules.js
index df16f0f..8bfec81 100644
--- a/server/routes/schedules.js
+++ b/server/routes/schedules.js
@@ -146,7 +146,7 @@ router.get('/week', (req, res) => {
 // playlist were accepted with NO ownership check at all.
 router.post('/', (req, res) => {
   const { device_id, group_id, zone_id, content_id, widget_id, layout_id, playlist_id, title, start_time, end_time,
-          timezone, recurrence, recurrence_end, priority, color } = req.body;
+    timezone, recurrence, recurrence_end, priority, color } = req.body;
 
   if (!start_time || !end_time) {
     return res.status(400).json({ error: 'start_time and end_time required' });
@@ -181,9 +181,9 @@ router.post('/', (req, res) => {
   // Payload refs must live in the same workspace. Platform templates
   // (workspace_id IS NULL) on content / widget / layout / playlist are allowed.
   const refChecks = [
-    ['content',   content_id,  true],
-    ['widgets',   widget_id,   true],
-    ['layouts',   layout_id,   true],
+    ['content', content_id, true],
+    ['widgets', widget_id, true],
+    ['layouts', layout_id, true],
     ['playlists', playlist_id, true],
   ];
   for (const [table, id, allowNull] of refChecks) {
@@ -199,7 +199,7 @@ router.post('/', (req, res) => {
     VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
   `).run(id, req.user.id, targetWorkspaceId, device_id || null, group_id || null, zone_id || null, content_id || null, widget_id || null,
     layout_id || null, playlist_id || null, title || '', start_time, end_time, timezone || 'UTC',
-    recurrence || null, recurrence_end || null, priority || 0, color || '#3B82F6');
+    recurrence || null, recurrence_end || null, priority || 0, color || '#e65c00');
 
   const schedule = db.prepare('SELECT * FROM schedules WHERE id = ?').get(id);
   res.status(201).json(schedule);
@@ -225,12 +225,12 @@ router.put('/:id', requireScheduleWrite, (req, res) => {
   // (no NULL workspace path); content / widget / layout / playlist may be
   // platform templates (NULL workspace_id).
   const ownershipChecks = [
-    ['devices',       req.body.device_id,   schedule.device_id,   false],
-    ['device_groups', req.body.group_id,    schedule.group_id,    false],
-    ['content',       req.body.content_id,  schedule.content_id,  true],
-    ['widgets',       req.body.widget_id,   schedule.widget_id,   true],
-    ['layouts',       req.body.layout_id,   schedule.layout_id,   true],
-    ['playlists',     req.body.playlist_id, schedule.playlist_id, true],
+    ['devices', req.body.device_id, schedule.device_id, false],
+    ['device_groups', req.body.group_id, schedule.group_id, false],
+    ['content', req.body.content_id, schedule.content_id, true],
+    ['widgets', req.body.widget_id, schedule.widget_id, true],
+    ['layouts', req.body.layout_id, schedule.layout_id, true],
+    ['playlists', req.body.playlist_id, schedule.playlist_id, true],
   ];
   for (const [table, newVal, oldVal, allowNull] of ownershipChecks) {
     if (newVal === undefined || newVal === oldVal || !newVal) continue;
diff --git a/server/routes/status.js b/server/routes/status.js
index eca3274..93134ce 100644
--- a/server/routes/status.js
+++ b/server/routes/status.js
@@ -292,7 +292,7 @@ router.post('/import', importUpload.single('file'), async (req, res) => {
       // Cleanup uploaded zip
       fs.unlinkSync(req.file.path);
     } catch (err) {
-      if (req.file?.path) try { fs.unlinkSync(req.file.path); } catch {}
+      if (req.file?.path) try { fs.unlinkSync(req.file.path); } catch { }
       return res.status(400).json({ error: 'Failed to extract ZIP: ' + err.message });
     }
   } else {
@@ -415,7 +415,7 @@ router.post('/import', importUpload.single('file'), async (req, res) => {
       if (!devId && !grpId) continue;
       const newId = uuid.v4();
       const playlistId = s.playlist_id ? (idMap.playlists[s.playlist_id] || null) : null;
-      db.prepare(`INSERT INTO schedules (id, user_id, device_id, group_id, zone_id, content_id, widget_id, layout_id, playlist_id, title, start_time, end_time, timezone, recurrence, recurrence_end, priority, enabled, color, created_at) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`).run(newId, userId, devId, grpId, s.zone_id ? (idMap.zones[s.zone_id] || null) : null, s.content_id ? (idMap.content[s.content_id] || null) : null, s.widget_id ? (idMap.widgets[s.widget_id] || null) : null, s.layout_id ? (idMap.layouts[s.layout_id] || null) : null, playlistId, s.title || '', s.start_time, s.end_time, s.timezone || 'UTC', s.recurrence || null, s.recurrence_end || null, s.priority || 0, s.enabled !== undefined ? s.enabled : 1, s.color || '#3B82F6', s.created_at || Math.floor(Date.now() / 1000));
+      db.prepare(`INSERT INTO schedules (id, user_id, device_id, group_id, zone_id, content_id, widget_id, layout_id, playlist_id, title, start_time, end_time, timezone, recurrence, recurrence_end, priority, enabled, color, created_at) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`).run(newId, userId, devId, grpId, s.zone_id ? (idMap.zones[s.zone_id] || null) : null, s.content_id ? (idMap.content[s.content_id] || null) : null, s.widget_id ? (idMap.widgets[s.widget_id] || null) : null, s.layout_id ? (idMap.layouts[s.layout_id] || null) : null, playlistId, s.title || '', s.start_time, s.end_time, s.timezone || 'UTC', s.recurrence || null, s.recurrence_end || null, s.priority || 0, s.enabled !== undefined ? s.enabled : 1, s.color || '#e65c00', s.created_at || Math.floor(Date.now() / 1000));
       stats.schedules++;
     }
 
@@ -446,7 +446,7 @@ router.post('/import', importUpload.single('file'), async (req, res) => {
     for (const g of (data.device_groups || [])) {
       const newId = uuid.v4();
       idMap.groups[g.id] = newId;
-      db.prepare(`INSERT INTO device_groups (id, user_id, workspace_id, name, color, created_at) VALUES (?, ?, ?, ?, ?, ?)`).run(newId, userId, workspaceId, g.name, g.color || '#3B82F6', g.created_at || Math.floor(Date.now() / 1000));
+      db.prepare(`INSERT INTO device_groups (id, user_id, workspace_id, name, color, created_at) VALUES (?, ?, ?, ?, ?, ?)`).run(newId, userId, workspaceId, g.name, g.color || '#e65c00', g.created_at || Math.floor(Date.now() / 1000));
       stats.device_groups++;
     }
     for (const gm of (data.device_group_members || [])) {
@@ -468,9 +468,9 @@ router.post('/import', importUpload.single('file'), async (req, res) => {
       const wl = data.white_label;
       const existing = db.prepare('SELECT id FROM white_labels WHERE workspace_id = ?').get(workspaceId);
       if (existing) {
-        db.prepare(`UPDATE white_labels SET brand_name=?, logo_url=?, favicon_url=?, primary_color=?, bg_color=?, custom_domain=?, custom_css=?, hide_branding=?, updated_at=strftime('%s','now') WHERE workspace_id=?`).run(wl.brand_name || 'ScreenTinker', wl.logo_url || null, wl.favicon_url || null, wl.primary_color || '#3B82F6', wl.bg_color || '#111827', wl.custom_domain || null, wl.custom_css || null, wl.hide_branding || 0, workspaceId);
+        db.prepare(`UPDATE white_labels SET brand_name=?, logo_url=?, favicon_url=?, primary_color=?, bg_color=?, custom_domain=?, custom_css=?, hide_branding=?, updated_at=strftime('%s','now') WHERE workspace_id=?`).run(wl.brand_name || 'ScreenTinker', wl.logo_url || null, wl.favicon_url || null, wl.primary_color || '#e65c00', wl.bg_color || '#111827', wl.custom_domain || null, wl.custom_css || null, wl.hide_branding || 0, workspaceId);
       } else {
-        db.prepare(`INSERT INTO white_labels (id, user_id, workspace_id, brand_name, logo_url, favicon_url, primary_color, bg_color, custom_domain, custom_css, hide_branding) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`).run(uuid.v4(), userId, workspaceId, wl.brand_name || 'ScreenTinker', wl.logo_url || null, wl.favicon_url || null, wl.primary_color || '#3B82F6', wl.bg_color || '#111827', wl.custom_domain || null, wl.custom_css || null, wl.hide_branding || 0);
+        db.prepare(`INSERT INTO white_labels (id, user_id, workspace_id, brand_name, logo_url, favicon_url, primary_color, bg_color, custom_domain, custom_css, hide_branding) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`).run(uuid.v4(), userId, workspaceId, wl.brand_name || 'ScreenTinker', wl.logo_url || null, wl.favicon_url || null, wl.primary_color || '#e65c00', wl.bg_color || '#111827', wl.custom_domain || null, wl.custom_css || null, wl.hide_branding || 0);
       }
     }
   });
diff --git a/server/routes/white-label.js b/server/routes/white-label.js
index dac14a1..93ed5a3 100644
--- a/server/routes/white-label.js
+++ b/server/routes/white-label.js
@@ -28,7 +28,7 @@ router.post('/', requireWorkspaceAdmin, (req, res) => {
   if (!req.workspaceId) return res.status(403).json({ error: 'No workspace context. Switch to a workspace before configuring branding.' });
 
   const { brand_name, logo_url, favicon_url, primary_color, secondary_color, bg_color,
-          custom_domain, custom_css, hide_branding } = req.body;
+    custom_domain, custom_css, hide_branding } = req.body;
 
   // Security (#3): custom_domain drives the PUBLIC, pre-auth branding resolver
   // (GET /api/branding) and custom_css is injected into the login page's <style>.
@@ -60,7 +60,7 @@ router.post('/', requireWorkspaceAdmin, (req, res) => {
     db.prepare(`INSERT INTO white_labels (id, user_id, workspace_id, brand_name, logo_url, favicon_url, primary_color, secondary_color, bg_color, custom_domain, custom_css, hide_branding)
       VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`).run(
       id, req.user.id, req.workspaceId, brand_name || 'ScreenTinker', logo_url || null, favicon_url || null,
-      primary_color || '#3B82F6', secondary_color || '#1E293B', bg_color || '#111827',
+      primary_color || '#e65c00', secondary_color || '#1E293B', bg_color || '#111827',
       custom_domain || null, custom_css || null, hide_branding ? 1 : 0);
   }
 
diff --git a/server/server.js b/server/server.js
index 31c4866..d60cd4c 100644
--- a/server/server.js
+++ b/server/server.js
@@ -249,13 +249,15 @@ app.get(['/integrations', '/integrations/'], (req, res) => {
 // Serve frontend static files
 // JS/CSS/HTML: no-cache (always revalidate, uses ETag/304)
 // Images/fonts/icons: long cache for Cloudflare + browser
-app.use(express.static(config.frontendDir, { index: false, etag: true, lastModified: true, setHeaders: (res, filePath) => {
-  if (filePath.endsWith('.js') || filePath.endsWith('.css') || filePath.endsWith('.html')) {
-    res.setHeader('Cache-Control', 'no-cache');
-  } else if (/\.(png|jpg|jpeg|gif|svg|ico|woff2?|ttf|eot|webp|mp4|webm)$/i.test(filePath)) {
-    res.setHeader('Cache-Control', 'public, max-age=2592000'); // 30 days
+app.use(express.static(config.frontendDir, {
+  index: false, etag: true, lastModified: true, setHeaders: (res, filePath) => {
+    if (filePath.endsWith('.js') || filePath.endsWith('.css') || filePath.endsWith('.html')) {
+      res.setHeader('Cache-Control', 'no-cache');
+    } else if (/\.(png|jpg|jpeg|gif|svg|ico|woff2?|ttf|eot|webp|mp4|webm)$/i.test(filePath)) {
+      res.setHeader('Cache-Control', 'public, max-age=2592000'); // 30 days
+    }
   }
-}}));
+}));
 
 // Player HTML: dynamic route. Injects a small inline window.__playerConfig
 // script before the debug-overlay.js tag so the client knows whether to send
@@ -312,11 +314,13 @@ app.get('/player/transitions.js', (req, res) => {
 // Serve web player at /player (same no-cache for JS/HTML). The index.html
 // route above intercepts the HTML requests; everything else still falls
 // through to this static handler (debug-overlay.js, sw.js, manifest, etc).
-app.use('/player', express.static(path.join(__dirname, 'player'), { etag: true, lastModified: true, setHeaders: (res, filePath) => {
-  if (filePath.endsWith('.js') || filePath.endsWith('.css') || filePath.endsWith('.html')) {
-    res.setHeader('Cache-Control', 'no-cache');
+app.use('/player', express.static(path.join(__dirname, 'player'), {
+  etag: true, lastModified: true, setHeaders: (res, filePath) => {
+    if (filePath.endsWith('.js') || filePath.endsWith('.css') || filePath.endsWith('.html')) {
+      res.setHeader('Cache-Control', 'no-cache');
+    }
   }
-}}));
+}));
 
 // Serve setup scripts
 app.use('/scripts', express.static(path.join(__dirname, '..', 'scripts')));
@@ -424,7 +428,7 @@ app.get('/api/devices/:id/screenshot', (req, res) => {
   const { db: sdb } = require('./db/database');
   const device = sdb.prepare('SELECT user_id FROM devices WHERE id = ?').get(req.params.id);
   if (!device) return res.status(404).json({ error: 'Device not found' });
-  if (!['admin','superadmin'].includes(user.role) && device.user_id && device.user_id !== user.id) return res.status(403).json({ error: 'Access denied' });
+  if (!['admin', 'superadmin'].includes(user.role) && device.user_id && device.user_id !== user.id) return res.status(403).json({ error: 'Access denied' });
   // Serve from memory if available (device online), otherwise from disk (offline snapshot)
   const deviceSocket = require('./ws/deviceSocket');
   const memScreenshot = deviceSocket.lastScreenshots?.[req.params.id];
@@ -606,12 +610,12 @@ function updateFrontendHash() {
       'js/views/layout-editor.js', 'js/views/schedule.js', 'js/views/widgets.js',
       'js/views/video-wall.js', 'js/views/reports.js', 'js/views/designer.js',
       'js/views/activity.js', 'js/views/kiosk.js'].map(f => {
-      try { return fs.readFileSync(path.join(config.frontendDir, f)); } catch { return ''; }
-    });
+        try { return fs.readFileSync(path.join(config.frontendDir, f)); } catch { return ''; }
+      });
     // Include player files in hash so web players detect code updates
-    try { files.push(fs.readFileSync(path.join(__dirname, 'player', 'index.html'))); } catch {}
-    try { files.push(fs.readFileSync(path.join(__dirname, 'player', 'sw.js'))); } catch {}
-    try { files.push(fs.readFileSync(path.join(__dirname, 'player', 'debug-overlay.js'))); } catch {}
+    try { files.push(fs.readFileSync(path.join(__dirname, 'player', 'index.html'))); } catch { }
+    try { files.push(fs.readFileSync(path.join(__dirname, 'player', 'sw.js'))); } catch { }
+    try { files.push(fs.readFileSync(path.join(__dirname, 'player', 'debug-overlay.js'))); } catch { }
     frontendHash = crypto.createHash('md5').update(Buffer.concat(files.map(f => Buffer.from(f)))).digest('hex').slice(0, 8);
   } catch { frontendHash = Date.now().toString(36); }
 }
@@ -803,9 +807,9 @@ let _shuttingDown = false;
 function gracefulShutdown(sig) {
   if (_shuttingDown) return; _shuttingDown = true;
   console.log(`[shutdown] ${sig} — stopping WAL checkpointer + closing DB`);
-  Promise.resolve(stopWalCheckpointer()).catch(() => {}).finally(() => {
-    try { require('./lib/status-log-writer').flush(); } catch (_) {}
-    try { require('./db/database').db.close(); } catch (_) {}
+  Promise.resolve(stopWalCheckpointer()).catch(() => { }).finally(() => {
+    try { require('./lib/status-log-writer').flush(); } catch (_) { }
+    try { require('./db/database').db.close(); } catch (_) { }
     process.exit(0);
   });
 }
@@ -939,7 +943,7 @@ const otaDownloadState = otaDownloadGuard.prodState();   // #146 P3.8: shared si
 app.get('/download/apk', (req, res) => {
   const apk = apkCache.get();
   if (!apk.exists) {
-    return res.status(404).send(`<!DOCTYPE html><html><head><title>APK Not Found</title><style>body{font-family:-apple-system,system-ui,sans-serif;display:flex;justify-content:center;align-items:center;min-height:100vh;margin:0;background:#0f172a;color:#e2e8f0}div{text-align:center;max-width:500px;padding:24px}h1{color:#f87171;font-size:24px}code{background:#1e293b;padding:2px 8px;border-radius:4px;font-size:14px}p{line-height:1.6;color:#94a3b8}</style></head><body><div><h1>APK Not Available</h1><p>The Android APK has not been compiled yet. In Docker, mount a built APK at <code>/data/ScreenTinker.apk</code>, or use the <a href="/player" style="color:#3b82f6">web player</a>.</p></div></body></html>`);
+    return res.status(404).send(`<!DOCTYPE html><html><head><title>APK Not Found</title><style>body{font-family:-apple-system,system-ui,sans-serif;display:flex;justify-content:center;align-items:center;min-height:100vh;margin:0;background:#0f172a;color:#e2e8f0}div{text-align:center;max-width:500px;padding:24px}h1{color:#f87171;font-size:24px}code{background:#1e293b;padding:2px 8px;border-radius:4px;font-size:14px}p{line-height:1.6;color:#94a3b8}</style></head><body><div><h1>APK Not Available</h1><p>The Android APK has not been compiled yet. In Docker, mount a built APK at <code>/data/ScreenTinker.apk</code>, or use the <a href="/player" style="color:#e65c00">web player</a>.</p></div></body></html>`);
   }
 
   const verdict = otaDownloadGuard.admit(otaDownloadState, getBand());
diff --git a/server/services/alerts.js b/server/services/alerts.js
index 4b48992..f7b834b 100644
--- a/server/services/alerts.js
+++ b/server/services/alerts.js
@@ -71,7 +71,7 @@ async function checkOfflineDevices(io) {
         db.prepare(
           'INSERT INTO activity_log (user_id, device_id, action, details, workspace_id) VALUES (?, ?, ?, ?, ?)'
         ).run(device.user_id, device.id, 'alert:device_offline', `${device.name} offline for ${offlineMinutes}m`, device.workspace_id || null);
-      } catch {}
+      } catch { }
     }
   }
 
@@ -86,7 +86,7 @@ async function checkOfflineDevices(io) {
 // previously inlined in the webhook payload at sendEmailAlert.
 function buildAlertHtml(recipientName, subject, body) {
   return `<div style="font-family:sans-serif;max-width:600px;margin:0 auto;padding:20px">
-    <h2 style="color:#3b82f6">ScreenTinker Alert</h2>
+    <h2 style="color:#e65c00">ScreenTinker Alert</h2>
     <p>Hi ${escapeHtml(recipientName || 'there')},</p>
     <div style="background:#f1f5f9;padding:16px;border-radius:8px;margin:16px 0">
       <strong>${escapeHtml(subject)}</strong><br><br>
@@ -98,7 +98,7 @@ function buildAlertHtml(recipientName, subject, body) {
 
 function escapeHtml(s) {
   return String(s ?? '').replace(/[&<>"']/g, c =>
-    ({ '&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;' }[c]));
+    ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c]));
 }
 
 // Legacy export name preserved - some other modules may still call this.
diff --git a/server/test/ai-design.test.js b/server/test/ai-design.test.js
index e645534..61c8995 100644
--- a/server/test/ai-design.test.js
+++ b/server/test/ai-design.test.js
@@ -14,16 +14,18 @@ process.env.SELF_HOSTED = 'false';
 
 const db = new Database(':memory:');
 const dbModulePath = require.resolve('../db/database');
-require.cache[dbModulePath] = { id: dbModulePath, filename: dbModulePath, loaded: true, exports: { db, pruneTelemetry() {}, pruneScreenshots() {} } };
+require.cache[dbModulePath] = { id: dbModulePath, filename: dbModulePath, loaded: true, exports: { db, pruneTelemetry() { }, pruneScreenshots() { } } };
 
 const ai = require('../routes/ai');
 const { normalizeDesign, endpointAllowed } = ai;
 
 test('normalizeDesign: keeps valid text+shape, sets background', () => {
-  const d = normalizeDesign({ background: '#102030', elements: [
-    { type: 'text', x: 5, y: 5, text: 'HELLO', fontSize: 90, color: '#ffffff', bold: true },
-    { type: 'shape', x: 0, y: 90, width: 100, height: 8, color: '#ff0000', opacity: 0.5 },
-  ]});
+  const d = normalizeDesign({
+    background: '#102030', elements: [
+      { type: 'text', x: 5, y: 5, text: 'HELLO', fontSize: 90, color: '#ffffff', bold: true },
+      { type: 'shape', x: 0, y: 90, width: 100, height: 8, color: '#ff0000', opacity: 0.5 },
+    ]
+  });
   assert.equal(d.background, '#102030');
   assert.equal(d.elements.length, 2);
   const txt = d.elements.find((e) => e.type === 'text');
@@ -32,25 +34,29 @@ test('normalizeDesign: keeps valid text+shape, sets background', () => {
 });
 
 test('normalizeDesign: converts pixel shape dims to %, clamps ranges', () => {
-  const d = normalizeDesign({ elements: [
-    { type: 'shape', x: -10, y: 200, width: 1920, height: 1080, color: 'red', opacity: 5 },
-  ]});
+  const d = normalizeDesign({
+    elements: [
+      { type: 'shape', x: -10, y: 200, width: 1920, height: 1080, color: 'red', opacity: 5 },
+    ]
+  });
   const s = d.elements[0];
   assert.equal(s.x, 0, 'x clamped so full-width shape fits');
   assert.equal(s.y, 0, 'y clamped so full-height shape fits (y+height<=100)');
   assert.ok(Math.abs(s.width - 100) < 0.01, '1920px -> 100%');
   assert.ok(Math.abs(s.height - 100) < 0.01, '1080px -> 100%');
-  assert.equal(s.color, '#3b82f6', 'non-hex color -> default');
+  assert.equal(s.color, '#e65c00', 'non-hex color -> default');
   assert.equal(s.opacity, 1, 'opacity clamped to 1');
 });
 
 test('normalizeDesign: strips HTML from text, drops empty/invalid', () => {
-  const d = normalizeDesign({ elements: [
-    { type: 'text', text: '<img src=x onerror=alert(1)>Sale</b>', fontSize: 9999 },
-    { type: 'text', text: '   ' },
-    { type: 'bogus', text: 'x' },
-    null,
-  ]});
+  const d = normalizeDesign({
+    elements: [
+      { type: 'text', text: '<img src=x onerror=alert(1)>Sale</b>', fontSize: 9999 },
+      { type: 'text', text: '   ' },
+      { type: 'bogus', text: 'x' },
+      null,
+    ]
+  });
   assert.equal(d.elements.length, 1, 'only the one real text survives');
   assert.equal(d.elements[0].text, 'Sale');
   assert.ok(!/[<>]/.test(d.elements[0].text), 'no angle brackets');
@@ -77,9 +83,11 @@ test('endpointAllowed: blocks private/internal when hosted, allows public https'
 });
 
 test('normalizeDesign: long/large text is shrunk + repositioned to fit canvas', () => {
-  const d = normalizeDesign({ elements: [
-    { type: 'text', x: 30, y: 95, text: 'GRAND OPENING THIS FRIDAY EVERYONE WELCOME', fontSize: 160, color: '#fff' },
-  ]});
+  const d = normalizeDesign({
+    elements: [
+      { type: 'text', x: 30, y: 95, text: 'GRAND OPENING THIS FRIDAY EVERYONE WELCOME', fontSize: 160, color: '#fff' },
+    ]
+  });
   const e = d.elements[0];
   const w = e.text.length * e.fontSize * 0.075;
   assert.ok(e.x + w <= 96.5, `fits horizontally (x=${e.x} w=${w.toFixed(1)})`);
@@ -89,11 +97,13 @@ test('normalizeDesign: long/large text is shrunk + repositioned to fit canvas',
 });
 
 test('normalizeDesign: separates overlapping text + orders shapes behind text', () => {
-  const d = normalizeDesign({ elements: [
-    { type: 'text', x: 5, y: 40, text: 'HEADLINE TEXT HERE', fontSize: 60, color: '#fff' },
-    { type: 'text', x: 5, y: 41, text: 'SUBTEXT OVERLAPPING IT', fontSize: 40, color: '#fff' },
-    { type: 'shape', x: 0, y: 0, width: 100, height: 100, color: '#000', opacity: 0.5 },
-  ]});
+  const d = normalizeDesign({
+    elements: [
+      { type: 'text', x: 5, y: 40, text: 'HEADLINE TEXT HERE', fontSize: 60, color: '#fff' },
+      { type: 'text', x: 5, y: 41, text: 'SUBTEXT OVERLAPPING IT', fontSize: 40, color: '#fff' },
+      { type: 'shape', x: 0, y: 0, width: 100, height: 100, color: '#000', opacity: 0.5 },
+    ]
+  });
   assert.equal(d.elements[0].type, 'shape', 'shape rendered behind (first in array)');
   const texts = d.elements.filter((e) => e.type === 'text');
   const hi = texts[0].y <= texts[1].y ? texts[0] : texts[1];
diff --git a/server/test/branding.test.js b/server/test/branding.test.js
index 0987135..6dd19da 100644
--- a/server/test/branding.test.js
+++ b/server/test/branding.test.js
@@ -21,7 +21,7 @@ db.exec(`
   );
   CREATE TABLE white_labels (
     id TEXT PRIMARY KEY, user_id TEXT, brand_name TEXT NOT NULL DEFAULT 'ScreenTinker',
-    logo_url TEXT, favicon_url TEXT, primary_color TEXT DEFAULT '#3B82F6',
+    logo_url TEXT, favicon_url TEXT, primary_color TEXT DEFAULT '#e65c00',
     secondary_color TEXT DEFAULT '#1E293B', bg_color TEXT DEFAULT '#111827',
     custom_domain TEXT, custom_css TEXT, hide_branding INTEGER DEFAULT 0,
     workspace_id TEXT, created_at INTEGER DEFAULT (strftime('%s','now')), updated_at INTEGER DEFAULT (strftime('%s','now'))
@@ -33,7 +33,7 @@ db.exec(`
 `);
 
 const dbModulePath = require.resolve('../db/database');
-require.cache[dbModulePath] = { id: dbModulePath, filename: dbModulePath, loaded: true, exports: { db, pruneTelemetry() {}, pruneScreenshots() {} } };
+require.cache[dbModulePath] = { id: dbModulePath, filename: dbModulePath, loaded: true, exports: { db, pruneTelemetry() { }, pruneScreenshots() { } } };
 
 const express = require('express');
 const { generateToken, requireAuth } = require('../middleware/auth');
diff --git a/server/test/widget-render-xss.test.js b/server/test/widget-render-xss.test.js
index 3a3d6b2..51fdcb6 100644
--- a/server/test/widget-render-xss.test.js
+++ b/server/test/widget-render-xss.test.js
@@ -38,7 +38,7 @@ test('clock widget: malicious background/color/font_size cannot break out of <st
 });
 
 test('rss widget: scroll_speed/max_items coerced to numbers (no injection)', async () => {
-  seed('rss1', 'rss', { scroll_speed: '30s}</style><script>y</script>', max_items: '10);evil(' , background: CSS_BREAKOUT });
+  seed('rss1', 'rss', { scroll_speed: '30s}</style><script>y</script>', max_items: '10);evil(', background: CSS_BREAKOUT });
   const html = await render('rss1');
   assert.ok(!html.includes('</style><script>y'), 'scroll_speed cannot inject');
   assert.ok(!html.includes('evil('), 'max_items cannot inject into the script');
@@ -54,8 +54,8 @@ test('text widget: raw HTML is isolated in a null-origin sandboxed iframe', asyn
 });
 
 test('valid color/gradient backgrounds are preserved', async () => {
-  seed('clock2', 'clock', { background: 'linear-gradient(45deg, #ff0000, #00ff00)', color: '#3B82F6' });
+  seed('clock2', 'clock', { background: 'linear-gradient(45deg, #ff0000, #00ff00)', color: '#e65c00' });
   const html = await render('clock2');
   assert.ok(html.includes('linear-gradient(45deg, #ff0000, #00ff00)'), 'legit gradient preserved');
-  assert.ok(html.includes('color:#3B82F6'), 'legit hex color preserved');
+  assert.ok(html.includes('color:#e65c00'), 'legit hex color preserved');
 });
diff --git a/tizen/css/style.css b/tizen/css/style.css
index 85c12e3..2301f05 100644
--- a/tizen/css/style.css
+++ b/tizen/css/style.css
@@ -1,19 +1,34 @@
-* { margin: 0; padding: 0; box-sizing: border-box; }
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
 
-html, body {
-    width: 100%; height: 100%;
-    background: #000; color: #f1f5f9;
+html,
+body {
+    width: 100%;
+    height: 100%;
+    background: #000;
+    color: #f1f5f9;
     font-family: "Samsung One", "Tizen Sans", Arial, sans-serif;
     overflow: hidden;
     cursor: none;
 }
 
 .screen {
-    position: absolute; top: 0; left: 0;
-    width: 100%; height: 100%;
-    display: flex; align-items: center; justify-content: center;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.hidden {
+    display: none !important;
 }
-.hidden { display: none !important; }
 
 /* Setup / pairing card */
 .card {
@@ -24,66 +39,161 @@ html, body {
     text-align: center;
     max-width: 760px;
 }
-.card h1 { color: #3b82f6; font-size: 44px; margin-bottom: 6px; }
-.sub { color: #94a3b8; font-size: 22px; margin-bottom: 36px; }
-.card label { display: block; text-align: left; color: #94a3b8; font-size: 18px; margin-bottom: 8px; }
+
+.card h1 {
+    color: #e65c00;
+    font-size: 44px;
+    margin-bottom: 6px;
+}
+
+.sub {
+    color: #94a3b8;
+    font-size: 22px;
+    margin-bottom: 36px;
+}
+
+.card label {
+    display: block;
+    text-align: left;
+    color: #94a3b8;
+    font-size: 18px;
+    margin-bottom: 8px;
+}
 
 #serverUrl {
-    width: 100%; font-size: 26px; padding: 16px 20px;
-    border-radius: 10px; border: 2px solid #334155;
-    background: #0b1220; color: #f1f5f9; margin-bottom: 24px;
+    width: 100%;
+    font-size: 26px;
+    padding: 16px 20px;
+    border-radius: 10px;
+    border: 2px solid #334155;
+    background: #0b1220;
+    color: #f1f5f9;
+    margin-bottom: 24px;
+}
+
+#serverUrl:focus {
+    outline: none;
+    border-color: #e65c00;
 }
-#serverUrl:focus { outline: none; border-color: #3b82f6; }
 
 button {
-    font-size: 24px; font-weight: bold; color: #fff;
-    background: #3b82f6; border: none; border-radius: 10px;
-    padding: 16px 40px; cursor: pointer;
+    font-size: 24px;
+    font-weight: bold;
+    color: #fff;
+    background: #e65c00;
+    border: none;
+    border-radius: 10px;
+    padding: 16px 40px;
+    cursor: pointer;
 }
-button:focus { outline: 3px solid #93c5fd; }
-button.ghost { background: transparent; color: #64748b; font-size: 18px; margin-top: 24px; padding: 8px; }
 
-.status { color: #64748b; font-size: 18px; margin-top: 20px; min-height: 24px; }
-.status.error { color: #ef4444; }
+button:focus {
+    outline: 3px solid #93c5fd;
+}
+
+button.ghost {
+    background: transparent;
+    color: #64748b;
+    font-size: 18px;
+    margin-top: 24px;
+    padding: 8px;
+}
+
+.status {
+    color: #64748b;
+    font-size: 18px;
+    margin-top: 20px;
+    min-height: 24px;
+}
+
+.status.error {
+    color: #ef4444;
+}
 
 /* Pairing code */
 .code {
-    font-size: 96px; font-weight: bold; letter-spacing: 16px;
-    color: #22c55e; margin: 24px 0; font-family: monospace;
+    font-size: 96px;
+    font-weight: bold;
+    letter-spacing: 16px;
+    color: #22c55e;
+    margin: 24px 0;
+    font-family: monospace;
+}
+
+.hint {
+    color: #94a3b8;
+    font-size: 20px;
+    line-height: 1.5;
 }
-.hint { color: #94a3b8; font-size: 20px; line-height: 1.5; }
 
 /* Playback stage */
-.stage { background: #000; }
-.stage img, .stage video, .stage iframe {
-    position: absolute; top: 0; left: 0;
-    width: 100%; height: 100%; border: 0;
+.stage {
+    background: #000;
+}
+
+.stage img,
+.stage video,
+.stage iframe {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border: 0;
+}
+
+.stage img.contain,
+.stage video.contain {
+    object-fit: contain;
+}
+
+.stage img.cover,
+.stage video.cover {
+    object-fit: cover;
+}
+
+.stage img.fill,
+.stage video.fill {
+    object-fit: fill;
 }
-.stage img.contain, .stage video.contain { object-fit: contain; }
-.stage img.cover,   .stage video.cover   { object-fit: cover; }
-.stage img.fill,    .stage video.fill    { object-fit: fill; }
 
 /* Video wall mode: the stage is positioned (in vw/vh) as this screen's slice of the
    wall's player rect; media stretches to fill (object-fit:fill) so a given source row
    lands on the same physical line across every screen that shares a viewport height. */
-.stage.wall-mode img, .stage.wall-mode video, .stage.wall-mode iframe { object-fit: fill; }
+.stage.wall-mode img,
+.stage.wall-mode video,
+.stage.wall-mode iframe {
+    object-fit: fill;
+}
 
 /* #109: PiP overlay layer. Sits above #stage and fills the same viewport box so a
    child positioned to a corner lands in the corner of the visible content. app.js
    applies the SAME orientation transform here as on #stage (portrait/flipped). It is
    pointer-transparent and empty (invisible) until PipOverlay renders into it. */
 #pip {
-    position: fixed; top: 0; left: 0;
-    width: 100vw; height: 100vh;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 100vh;
     pointer-events: none;
     z-index: 50;
 }
-#pip > div { box-shadow: 0 6px 28px rgba(0,0,0,0.55); }
+
+#pip>div {
+    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.55);
+}
 
 /* Toast */
 .toast {
-    position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
-    background: rgba(17,24,39,0.92); color: #f1f5f9;
-    padding: 12px 24px; border-radius: 10px; font-size: 18px;
+    position: absolute;
+    bottom: 24px;
+    left: 50%;
+    transform: translateX(-50%);
+    background: rgba(17, 24, 39, 0.92);
+    color: #f1f5f9;
+    padding: 12px 24px;
+    border-radius: 10px;
+    font-size: 18px;
     border: 1px solid #334155;
-}
+}
\ No newline at end of file
diff --git a/tizen/js/app.js b/tizen/js/app.js
index 4499a7a..b0a9953 100644
--- a/tizen/js/app.js
+++ b/tizen/js/app.js
@@ -20,7 +20,7 @@
     try {
       var v = tizen.application.getCurrentApplication().appInfo.version;
       if (v) return v;
-    } catch (e) {}
+    } catch (e) { }
     return APP_VERSION_FALLBACK;
   })();
   var HEARTBEAT_MS = 15000;
@@ -39,8 +39,8 @@
 
   // ---- persistent state ----
   function get(k) { try { return localStorage.getItem(k); } catch (e) { return null; } }
-  function set(k, v) { try { localStorage.setItem(k, v); } catch (e) {} }
-  function del(k) { try { localStorage.removeItem(k); } catch (e) {} }
+  function set(k, v) { try { localStorage.setItem(k, v); } catch (e) { } }
+  function del(k) { try { localStorage.removeItem(k); } catch (e) { } }
 
   function uuid() {
     return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
@@ -83,8 +83,8 @@
 
   // Keep the screen awake (best effort across Tizen APIs)
   function keepAwake() {
-    try { if (window.tizen && tizen.power) tizen.power.request('SCREEN', 'SCREEN_NORMAL'); } catch (e) {}
-    try { if (window.webapis && webapis.appcommon) webapis.appcommon.setScreenSaver(webapis.appcommon.AppCommonScreenSaverState.SCREEN_SAVER_OFF); } catch (e) {}
+    try { if (window.tizen && tizen.power) tizen.power.request('SCREEN', 'SCREEN_NORMAL'); } catch (e) { }
+    try { if (window.webapis && webapis.appcommon) webapis.appcommon.setScreenSaver(webapis.appcommon.AppCommonScreenSaverState.SCREEN_SAVER_OFF); } catch (e) { }
   }
 
   // A5 — MONOTONIC clock for lifecycle time deltas (watchdog silence, resume hidden-duration), so an
@@ -222,7 +222,7 @@
   }
   // Stream a group-sync diagnostic to the dashboard live-log (tag 'sync').
   function reportSync(level, msg) {
-    try { if (socket && socket.connected && deviceId) socket.emit('device:log', { device_id: deviceId, tag: 'sync', level: level, message: msg }); } catch (e) {}
+    try { if (socket && socket.connected && deviceId) socket.emit('device:log', { device_id: deviceId, tag: 'sync', level: level, message: msg }); } catch (e) { }
   }
 
   function deviceInfo() {
@@ -247,14 +247,14 @@
         t.battery_level = Math.round((b.level || 0) * 100);
         t.battery_charging = !!b.isCharging;
       });
-    } catch (e) {}
+    } catch (e) { }
     return t;
   }
 
   function connect() {
     if (!serverUrl) { show(elSetup); return; }
     keepAwake();
-    if (socket) { try { socket.disconnect(); } catch (e) {} socket = null; }
+    if (socket) { try { socket.disconnect(); } catch (e) { } socket = null; }
     if (registerTimer) { clearTimeout(registerTimer); registerTimer = null; } // H4: a fresh connect supersedes any pending re-register
 
     var base = serverUrl.replace(/\/+$/, '');
@@ -326,7 +326,7 @@
             link_lost: linkLostDuringGap,
             cold_start: false
           });
-        } catch (e) {}
+        } catch (e) { }
         disconnectedAtMono = 0; linkLostDuringGap = false;
       }
       startHeartbeat();
@@ -482,7 +482,7 @@
   function reportPip(level, msg) {
     try {
       if (socket && deviceId) socket.emit('device:log', { device_id: deviceId, tag: 'pip', level: level, message: msg });
-    } catch (e) {}
+    } catch (e) { }
   }
 
   // feat/offline-cause-log: typed incident feed (device:event) — server inserts a device_events row.
@@ -494,7 +494,7 @@
       if (reason) m.reason = reason;
       if (detail) m.detail = detail;
       socket.emit('device:event', m);
-    } catch (e) {}
+    } catch (e) { }
   }
 
   // #125: report a command outcome to the dashboard. device:log surfaces live as
@@ -507,7 +507,7 @@
         socket.emit('device:log', { device_id: deviceId, tag: 'command', level: level, message: message });
         socket.emit('device:command-result', { device_id: deviceId, type: type, level: level, message: msg });
       }
-    } catch (e) {}
+    } catch (e) { }
   }
 
   // #125: log the panel's control surface at startup so the dashboard shows whether
@@ -522,9 +522,9 @@
       // TV's firmware/signing path. Surface their presence to the dashboard log so Bold can VERIFY on real
       // hardware whether keep-awake is real (vs a silent no-op) — the load-bearing check for the flap fix.
       var ka = 'keep-awake: setScreenSaver=' + !!(window.webapis && webapis.appcommon)
-             + ' tizen.power=' + !!(window.tizen && tizen.power);
+        + ' tizen.power=' + !!(window.tizen && tizen.power);
       reportCmd('info', 'keepawake', ka);
-    } catch (e) {}
+    } catch (e) { }
   }
 
   // #120: best-effort dashboard preview. The Tizen TV runtime decodes <video> onto a
@@ -542,11 +542,11 @@
     try {
       var img = elStage.querySelector('img');
       if (img && img.complete && img.naturalWidth > 0) {
-        try { ctx.drawImage(img, 0, 0, 960, 540); captured = true; } catch (e) {}
+        try { ctx.drawImage(img, 0, 0, 960, 540); captured = true; } catch (e) { }
       }
       if (!captured) {
         ctx.fillStyle = '#111827'; ctx.fillRect(0, 0, 960, 540);
-        ctx.fillStyle = '#3b82f6'; ctx.font = 'bold 28px sans-serif'; ctx.textAlign = 'center';
+        ctx.fillStyle = '#e65c00'; ctx.font = 'bold 28px sans-serif'; ctx.textAlign = 'center';
         ctx.fillText('ScreenTinker (Tizen)', 480, 235);
         ctx.fillStyle = '#94a3b8'; ctx.font = '16px sans-serif';
         ctx.fillText('Live preview unavailable for video / YouTube on Tizen', 480, 280);
@@ -560,7 +560,7 @@
       if (base64 && base64.length > 100) {
         socket.emit('device:screenshot', { device_id: deviceId, image_b64: base64 });
       }
-    } catch (e) {}
+    } catch (e) { }
   }
   function startStreaming() { stopStreaming(); streamTimer = setInterval(captureAndSend, 1000); }
   function stopStreaming() { if (streamTimer) { clearInterval(streamTimer); streamTimer = null; } }
@@ -579,7 +579,7 @@
   function teardownSession() {
     stopHeartbeat();
     stopStreaming();
-    try { player.stop(); } catch (e) {}
+    try { player.stop(); } catch (e) { }
     stageOwner = ''; // #162: stage cleared — next playlist must repaint
     if (registerTimer) { clearTimeout(registerTimer); registerTimer = null; }
     authenticated = false;
@@ -620,7 +620,7 @@
     if (elPip) orientEl(elPip.style, o);
     // #170: the player needs the orientation so portrait/flipped VIDEO routes through AVPlay
     // (hardware-plane rotation) instead of the CSS-rotated <video> that Tizen blacks out.
-    try { if (player && player.setOrientation) player.setOrientation(o); } catch (e) {}
+    try { if (player && player.setOrientation) player.setOrientation(o); } catch (e) { }
   }
   function orientEl(s, o) {
     if (!o || o === 'landscape') {
@@ -655,7 +655,7 @@
     }
     // A2: cache the last RENDERABLE payload so a reboot / WS-outage with no connectivity replays it
     // instead of showing the idle card. Only non-suspended payloads are cached.
-    try { set(LS.payload, JSON.stringify(payload)); } catch (e) {}
+    try { set(LS.payload, JSON.stringify(payload)); } catch (e) { }
     // If we have content + we're paired, make sure we're on the stage.
     if (elPairing.classList.contains('hidden') === false) show(elStage);
     else if (elStage.classList.contains('hidden')) show(elStage);
@@ -725,7 +725,7 @@
   elReset.addEventListener('click', function () {
     del(LS.url); del(LS.id); del(LS.token); del(LS.code); del(LS.payload);
     deviceId = null; deviceToken = null; serverUrl = null;
-    if (socket) { try { socket.disconnect(); } catch (e) {} }
+    if (socket) { try { socket.disconnect(); } catch (e) { } }
     teardownSession(); // H4: stop heartbeat/stream/player-loop + pending register (no dangling timers on setup)
     show(elSetup);
   });
@@ -737,9 +737,9 @@
       if (!elSetup.classList.contains('hidden')) {
         stopKeepAwake(); stopWatchdog(); // FIX A/B: clear timers cleanly before the app exits
         sendExitSignal('clean_exit', 'back_key'); // exit-signal: operator BACK-key exit = confident clean_exit
-        try { tizen.application.getCurrentApplication().exit(); } catch (x) {}
+        try { tizen.application.getCurrentApplication().exit(); } catch (x) { }
       } else {
-        if (socket) { try { socket.disconnect(); } catch (x) {} }
+        if (socket) { try { socket.disconnect(); } catch (x) { } }
         teardownSession(); // H4: same clean teardown when BACK returns to setup
         elUrl.value = serverUrl || '';
         elSetupStatus.textContent = ''; elSetupStatus.className = 'status';
@@ -781,7 +781,7 @@
       if (!deviceId || !deviceToken || !serverUrl) return;              // unpaired -> nothing to attribute
       __exitSent = true;
       var d = (typeof detail === 'string' && detail) ? detail.slice(0, 200) : undefined;
-      if (socket && socket.connected) { try { socket.emit('device:exit', { device_id: deviceId, reason: reason, detail: d }); } catch (e) {} }
+      if (socket && socket.connected) { try { socket.emit('device:exit', { device_id: deviceId, reason: reason, detail: d }); } catch (e) { } }
       if (navigator.sendBeacon) {
         var body = JSON.stringify({ device_id: deviceId, device_token: deviceToken, reason: reason, detail: d });
         navigator.sendBeacon(serverUrl.replace(/\/+$/, '') + '/api/device/exit', new Blob([body], { type: 'application/json' }));
@@ -808,7 +808,7 @@
     // connects (or if it can't). The socket's fresh device:playlist-update replaces it on connect.
     show(elStage);
     var _cp = get(LS.payload);
-    if (_cp) { try { onPlaylist(JSON.parse(_cp)); } catch (e) {} }
+    if (_cp) { try { onPlaylist(JSON.parse(_cp)); } catch (e) { } }
     connect();                                      // paired — reconnect to playback
   } else if (serverUrl) {
     show(elSetup); elUrl.value = serverUrl;          // server known, not paired — confirm + connect