Polish workbench shell density

frontend/src/App.tsx

@@ -452,6 +452,9 @@ function App(): JSX.Element {
 
   return (
     <div className="app-shell workbench-shell">
+      <a className="skip-link" href="#workspace-main">
+        Skip to workspace
+      </a>
       <header className="workbench-topbar">
         <div className="brand-block">
           <p className="eyebrow">GeoAI Workbench</p>
@@ -481,7 +484,7 @@ function App(): JSX.Element {
 
       <div className="workbench-layout">
         <aside className="workbench-sidebar" aria-label="Workbench navigation">
-          <nav>
+          <nav aria-label="Primary workspaces">
             {workspaceNavItems.map((item) => (
               <button
                 key={item.key}
@@ -499,7 +502,7 @@ function App(): JSX.Element {
           </nav>
         </aside>
 
-        <main className="workbench-main">
+        <main className="workbench-main" id="workspace-main" tabIndex={-1}>
           <div className="workspace-heading">
             <div>
               <p className="eyebrow">Workspace</p>

frontend/src/styles/app.css

@@ -48,6 +48,31 @@ body {
   overflow-x: clip;
 }
 
+.skip-link {
+  position: fixed;
+  top: 0.45rem;
+  left: 0.75rem;
+  z-index: 100;
+  transform: translateY(-150%);
+  border: 1px solid var(--accent);
+  border-radius: 6px;
+  padding: 0.48rem 0.7rem;
+  background: #ffffff;
+  color: var(--accent-strong);
+  font-size: 0.84rem;
+  font-weight: 800;
+  text-decoration: none;
+  box-shadow: var(--shadow-soft);
+  transition: transform 120ms ease;
+}
+
+.skip-link:focus-visible {
+  transform: translateY(0);
+  outline: 3px solid var(--focus-ring);
+  outline-offset: 2px;
+  box-shadow: 0 0 0 5px var(--focus-ring-soft);
+}
+
 button,
 input,
 select,
@@ -671,6 +696,7 @@ section li strong + div {
   min-height: 0;
   max-width: 100%;
   overflow: auto;
+  scroll-margin-top: 8.5rem;
   padding: 0.9rem 1.05rem 1.15rem;
 }
 
@@ -2325,11 +2351,36 @@ button.entity-card {
   }
 
   .workbench-sidebar nav,
-  .context-bar,
   .quick-action-grid {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 
+  .context-bar {
+    display: grid;
+    grid-template-columns: repeat(4, minmax(6.75rem, 1fr));
+    max-width: 100%;
+    overflow-x: auto;
+    overscroll-behavior-x: contain;
+    scroll-snap-type: x proximity;
+    padding-bottom: 0.1rem;
+  }
+
+  .context-bar > div {
+    min-height: 2.62rem;
+    padding: 0.36rem 0.48rem;
+    scroll-snap-align: start;
+  }
+
+  .context-bar span,
+  .context-bar strong {
+    white-space: nowrap;
+  }
+
+  .context-bar strong {
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
   .nav-item {
     min-height: 3.45rem;
   }
@@ -2390,6 +2441,18 @@ button.entity-card {
     grid-template-columns: 1fr;
   }
 
+  .workbench-topbar {
+    gap: 0.55rem;
+  }
+
+  .brand-block h1 {
+    font-size: 1.05rem;
+  }
+
+  .brand-block .eyebrow {
+    font-size: 0.62rem;
+  }
+
   .inspector-tabs {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
@@ -2414,11 +2477,19 @@ button.entity-card {
     max-width: 100%;
     overflow-x: auto;
     overscroll-behavior-x: contain;
+    scroll-snap-type: x proximity;
     padding-bottom: 0.2rem;
   }
 
   .workbench-sidebar .nav-item {
-    min-width: 8.75rem;
+    min-width: 9.5rem;
+    min-height: 3.2rem;
+    scroll-snap-align: start;
+  }
+
+  .nav-item small {
+    font-size: 0.72rem;
+    line-height: 1.18;
   }
 
   .workspace-nav-cluster {
@@ -2427,11 +2498,13 @@ button.entity-card {
     max-width: 100%;
     overflow-x: auto;
     overscroll-behavior-x: contain;
+    scroll-snap-type: x proximity;
     padding-bottom: 0.1rem;
   }
 
   .command-chip {
     min-width: 6.75rem;
+    scroll-snap-align: start;
   }
 
   .status-strip-grid {