diff --git a/apps/observer/workspace.html b/apps/observer/workspace.html
index 08890a250..9a96e9a5a 100644
--- a/apps/observer/workspace.html
+++ b/apps/observer/workspace.html
@@ -234,7 +234,8 @@
color: #d4d4d4;
padding: 1em;
border-radius: 4px;
- font-family: monospace;
+ font-family: 'SF Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', monospace;
+ letter-spacing: 0.02em;
font-size: 0.9em;
overflow-x: auto;
margin: 1em 0;
@@ -275,7 +276,9 @@
right: 60px;
}
.credential-label {
- font-weight: bold;
+ font-weight: 600;
+ text-transform: uppercase;
+ letter-spacing: 0.04em;
font-size: 0.85em;
color: #333;
margin-bottom: 0.25em;
@@ -315,22 +318,22 @@
.no-observers {
text-align: center;
- padding: 3rem 1rem;
+ padding: 3em 1em;
color: #666;
}
.no-observers-icon {
- font-size: 3rem;
- margin-bottom: 1rem;
+ font-size: 3em;
+ margin-bottom: 1em;
opacity: 0.5;
}
.no-observers-text {
- font-size: 1.1rem;
- margin-bottom: 0.5rem;
+ font-size: 1.1em;
+ margin-bottom: 0.5em;
}
.no-observers-hint {
- font-size: 0.9rem;
+ font-size: 0.85em;
color: #999;
- margin-bottom: 1.5rem;
+ margin-bottom: 1.5em;
}
.no-observers-action {
display: inline-flex;
@@ -343,7 +346,7 @@
border: none;
border-radius: 4px;
cursor: pointer;
- font-size: 0.95rem;
+ font-size: 0.9em;
}
.no-observers-action:hover {
background: color-mix(in srgb, var(--facet-color, #b06a1a) 85%, black);
@@ -391,7 +394,7 @@
background: color-mix(in srgb, var(--facet-color, #b06a1a) 70%, black);
}
.add-observer-toggle .toggle-indicator {
- font-size: 0.75em;
+ font-size: 0.85em;
}
/* Collapsed state for add-observer section */
@@ -476,6 +479,13 @@
.ws-error-retry:hover {
background: #6d5303;
}
+.ws-error-retry:focus-visible {
+ outline: 2px solid #856404;
+ outline-offset: 2px;
+}
+.ws-error-retry:active {
+ background: #554303;
+}
.ws-error-dismiss {
background: transparent;
border: 1px solid #856404;
@@ -489,8 +499,15 @@
.ws-error-dismiss:hover {
background: rgba(133, 100, 4, 0.1);
}
+.ws-error-dismiss:focus-visible {
+ outline: 2px solid #856404;
+ outline-offset: 2px;
+}
+.ws-error-dismiss:active {
+ background: rgba(133, 100, 4, 0.15);
+}
.ws-error-countdown {
- color: #997a1e;
+ color: #6d5303;
font-size: 0.85em;
}