SandObserver · SandObserver · Sep 24, 2026 · Sep 23, 2026 · Sep 24, 2026
diff --git a/ui/css/dashboard.css b/ui/css/dashboard.css
@@ -2,6 +2,8 @@
     :root {
       --glass-bg:         #1C1C1E;
       --glass-border:     rgba(255,255,255,.09);
+      --card-edge-hi:     rgba(255,255,255,.16);
+      --card-edge-lo:     rgba(255,255,255,.05);
       --glass-surface-bg:   rgba(51,51,51,.33);
       --glass-surface-blur: blur(12px) saturate(180%);
       --glass-rim-light:  rgba(255,255,255,.30);
@@ -149,6 +151,11 @@
       border:1px solid var(--glass-border); background:var(--glass-bg);
     }
     .widget iframe { display:block; border:0; width:100% }
+    .widget::after, .mob-widget-card::after {
+      content:''; position:absolute; inset:0; border-radius:inherit;
+      pointer-events:none; z-index:5; transform:translateZ(0);
+      box-shadow:inset 0 1px 0 var(--card-edge-hi), inset 0 -1px 0 var(--card-edge-lo);
+    }
 
     /* The mobile home screen builds its own card element with the same glass
        material. Its sizing stays inline. */
@@ -1054,6 +1061,8 @@ html[data-theme="light"] {
   --bg-base:           #E5E5EA;
   --glass-bg:          #FFFFFF;
   --glass-border:      rgba(0,0,0,.06);
+  --card-edge-hi:      rgba(255,255,255,.9);
+  --card-edge-lo:      rgba(0,0,0,.05);
   --glass-surface-bg:  rgba(153,153,153,.33);
   --glass-surface-blur: blur(24px) saturate(180%);
   --glass-rim-light:   rgba(255,255,255,1);
@@ -1115,6 +1124,7 @@ html[data-theme="light"] #dock.mdock { border-radius:calc(38px * var(--sc,1)); b
 html[data-theme="light"] .widget[data-appearance="dark"],
 html[data-theme="light"] .mob-widget-card[data-appearance="dark"] {
   --glass-bg:var(--card-fixed-dark); --glass-border:rgba(255,255,255,.09); --card-dark:var(--card-fixed-dark);
+  --card-edge-hi:rgba(255,255,255,.16); --card-edge-lo:rgba(255,255,255,.05);
 }
 html[data-theme="light"] .widget[data-appearance="dark"][data-card="translucent"],
 html[data-theme="light"] .mob-widget-card[data-appearance="dark"][data-card="translucent"] { background:var(--card-fixed-dark) }

diff --git a/ui/index.html b/ui/index.html
@@ -26,7 +26,7 @@
   <script src="/js/admin-theme.js?v=66565254"></script>
   <title>Stackyard</title>
   <link rel="stylesheet" href="/css/tokens.css?v=0f4ba0b8">
-  <link rel="stylesheet" href="/css/dashboard.css?v=ba41a1bb">
+  <link rel="stylesheet" href="/css/dashboard.css?v=982a82c8">
 </head>
 <body>
 <header class="visually-hidden"><h1>Stackyard</h1></header>

diff --git a/ui/test/theme.test.mjs b/ui/test/theme.test.mjs
@@ -113,3 +113,12 @@ test('the light palette carries an increased-contrast partner for every hue', ()
   assert.ok(hues.length >= 18, `expected the twelve hues and six greys, found ${hues.length}`);
   for (const h of hues) assert.match(light, new RegExp(`--sy-${h}-hi:\\s*#`), `--sy-${h} has no -hi partner`);
 });
+
+test('a widget held dark in the light theme keeps the dark edge light', () => {
+  const css = read('../css/dashboard.css');
+  const at = css.indexOf('html[data-theme="light"] .mob-widget-card[data-appearance="dark"] {');
+  assert.ok(at > -1, 'the forced-dark block is gone');
+  const block = css.slice(at, css.indexOf('}', at));
+  assert.match(block, /--card-edge-hi:rgba\(255,255,255,\.16\)/);
+  assert.match(block, /--card-edge-lo:rgba\(255,255,255,\.05\)/);
+});
diff --git a/ui/widgets/books/i18n/de.json b/ui/widgets/books/i18n/de.json
@@ -28,9 +28,9 @@
   "listId.hint": "Oben URL und Schlüssel eingeben, dann Abrufen klicken, um Sammlungen und Leselisten zu laden.",
   "href.label": "Klick-URL (optional)",
   "href.placeholder": "https://…",
-  "ui.reading": "LESE GERADE",
-  "ui.srcRecently": "ZULETZT HINZUGEFÜGT",
-  "ui.srcUnread": "WEITERLESEN",
+  "ui.reading": "Lese gerade",
+  "ui.srcRecently": "Zuletzt hinzugefügt",
+  "ui.srcUnread": "Weiterlesen",
   "ui.finished": "Gelesen",
   "ui.unread": "Ungelesen",
   "ui.percentRead": "{pct} % gelesen",

diff --git a/ui/widgets/books/i18n/en.json b/ui/widgets/books/i18n/en.json
@@ -28,9 +28,9 @@
   "listId.hint": "Enter the URL + key above, then click Fetch to load your collections / reading lists.",
   "href.label": "Click URL (optional)",
   "href.placeholder": "https://…",
-  "ui.reading": "READING",
-  "ui.srcRecently": "RECENTLY ADDED",
-  "ui.srcUnread": "ON DECK",
+  "ui.reading": "Reading",
+  "ui.srcRecently": "Recently Added",
+  "ui.srcUnread": "On Deck",
   "ui.finished": "Finished",
   "ui.unread": "Unread",
   "ui.percentRead": "{pct}% read",

diff --git a/ui/widgets/books/i18n/es.json b/ui/widgets/books/i18n/es.json
@@ -28,9 +28,9 @@
   "listId.hint": "Introduce arriba la URL y la clave, y pulsa Obtener para cargar tus colecciones y listas de lectura.",
   "href.label": "URL de clic (opcional)",
   "href.placeholder": "https://…",
-  "ui.reading": "LEYENDO",
-  "ui.srcRecently": "AÑADIDOS RECIENTEMENTE",
-  "ui.srcUnread": "EN CURSO",
+  "ui.reading": "Leyendo",
+  "ui.srcRecently": "Añadidos recientemente",
+  "ui.srcUnread": "En curso",
   "ui.finished": "Terminado",
   "ui.unread": "Sin leer",
   "ui.percentRead": "{pct} % leído",

diff --git a/ui/widgets/books/i18n/fr.json b/ui/widgets/books/i18n/fr.json
@@ -28,9 +28,9 @@
   "listId.hint": "Saisissez l’URL et la clé ci-dessus, puis cliquez sur Récupérer pour charger vos collections et listes de lecture.",
   "href.label": "URL de clic (facultatif)",
   "href.placeholder": "https://…",
-  "ui.reading": "EN COURS",
-  "ui.srcRecently": "AJOUTS RÉCENTS",
-  "ui.srcUnread": "À POURSUIVRE",
+  "ui.reading": "En cours",
+  "ui.srcRecently": "Ajouts récents",
+  "ui.srcUnread": "À poursuivre",
   "ui.finished": "Terminé",
   "ui.unread": "Non lu",
   "ui.percentRead": "{pct} % lu",

diff --git a/ui/widgets/books/index.html b/ui/widgets/books/index.html
@@ -15,14 +15,14 @@
   .card.clickable{cursor:pointer}
   .card.clickable:focus-visible{outline:2px solid #00D2E0;outline-offset:-3px}
 
-  .head{flex:none;font-size:11px;font-weight:500;color:#8E8E93;letter-spacing:.05em;
+  .head{flex:none;font-size:13px;font-weight:600;color:#8E8E93;
     white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 
   .shelves{flex:1;display:flex;flex-direction:column;gap:8px;min-height:0;margin-top:6px}
   .size-large .shelves{margin-top:10px}
   .shelf-wrap{flex:1;display:flex;flex-direction:column;min-height:0}
-  .shelf-lbl{flex:none;font-size:10px;font-weight:600;color:#8E8E93;letter-spacing:.06em;margin-bottom:4px;
-    text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+  .shelf-lbl{flex:none;font-size:11px;font-weight:600;color:#8E8E93;margin-bottom:4px;
+    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
   .shelf-lbl[hidden]{display:none}
   .shelf{flex:1;position:relative;min-height:0;border-bottom:1px solid rgba(235,235,245,.5)}
   .shelf::after{content:"";position:absolute;left:5%;right:5%;bottom:-1px;height:10px;pointer-events:none;
@@ -101,7 +101,7 @@
 <script type="module">
   import { poll, openUrl, loadStrings, wt, formatNumber, errorState } from '/js/widget-toolbox.js?v=22640314';
   await loadStrings();
-  document.getElementById('lbl').textContent = wt('ui.reading', 'READING');
+  document.getElementById('lbl').textContent = wt('ui.reading', 'Reading');
   document.getElementById('card').setAttribute('aria-label', wt('widget.label', 'Books'));
   const API='/api';
   const params=new URLSearchParams(location.search);
@@ -111,7 +111,7 @@
   const {shelves:SHELVES,show:SHOW}=SIZES[size];
   const POLL_MS=300000;
   const PALETTE=['#E7E0D2','#3D5A80','#A8483E','#C9BBA0','#5C6B57','#8D99A6','#2E3340','#B58B52','#7B5E57','#4E6E6A'];
-  const SRC={recently:['ui.srcRecently','RECENTLY ADDED'],unread:['ui.srcUnread','ON DECK'],list:['ui.reading','READING']};
+  const SRC={recently:['ui.srcRecently','Recently Added'],unread:['ui.srcUnread','On Deck'],list:['ui.reading','Reading']};
   /* The reader's own name for the shelf, then the service's, then the generic
      word for what the shelf holds. */
   function shelfName(sh){

diff --git a/ui/widgets/connections/connections-vpn.html b/ui/widgets/connections/connections-vpn.html
@@ -20,7 +20,7 @@
   .pad{flex:1;display:flex;align-items:center;gap:8px;padding:18px 20px;min-width:0;}
   .info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;}
   .eyebrow{display:flex;align-items:center;gap:8px;margin-bottom:9px;line-height:1;}
-  .vpn-tag{font-size:11px;font-weight:700;letter-spacing:.13em;color:var(--fg2);}
+  .vpn-tag{font-size:13px;font-weight:600;color:var(--fg2);}
   .state{font-size:12px;font-weight:600;display:flex;align-items:center;gap:5px;white-space:nowrap;}
   .state .dot{width:7px;height:7px;border-radius:50%;background:var(--grey);}
   .state.on{color:var(--accentink,var(--accent))} .state.on .dot{background:var(--accent);box-shadow:0 0 7px var(--accentglow)}
@@ -48,7 +48,7 @@
   body.size-small .geo{width:100%;height:86px;order:-1;}
   body.size-small .info{align-items:center;}
   body.size-small .eyebrow{flex-direction:column;gap:3px;margin-bottom:2px;line-height:1.1;}
-  body.size-small .vpn-tag{display:block;font-size:9.5px;letter-spacing:.11em;}
+  body.size-small .vpn-tag{display:block;font-size:11px;}
   body.size-small .state{font-size:12px;}
   body.size-small .hero{display:block;margin-bottom:0;}
   body.size-small .flag{display:inline;font-size:15px;vertical-align:-1px;margin-inline-end:5px;}

diff --git a/ui/widgets/dns/index.html b/ui/widgets/dns/index.html
@@ -21,7 +21,7 @@
 
   .hero { display:flex; flex-direction:column; gap:2px; flex-shrink:0; }
   .pct  { font-size:clamp(26px,9cqw,36px); font-weight:700; color:#FF4245; line-height:1; letter-spacing:-0.02em; transition: color 0.15s ease; }
-  .sub  { font-size:clamp(9px,3cqw,11px); font-weight:600; letter-spacing:0.09em; color:rgba(255,255,255,0.5); text-transform:uppercase; }
+  .sub  { font-size:clamp(11px,3.6cqw,13px); font-weight:600; color:rgba(235,235,245,0.6); }
 
   .flow { flex:1; min-height:0; margin-top:13px; position:relative; touch-action:pan-y; }
   .flow svg { width:100%; height:100%; display:block; overflow:visible; }