/* Baseline for new web surfaces. Existing Pi workspaces retain their layout CSS.
   Keep colors, type sizes and spacing in theme.css; controls in components.css. */
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: var(--font-body); }
a { color: var(--accent); }
button, a.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--control-border);
  background: var(--desk-raised);
  color: var(--text);
  font: inherit;
  text-decoration: none;
  cursor: pointer;
}
button:hover:not(:disabled), a.button:hover { background: var(--hover); }
.muted { color: var(--muted); }
.skip-link { position: absolute; left: 16px; top: -100px; z-index: 100; }
.skip-link:focus { top: 16px; background: var(--panel); padding: 12px; }
