/* App Shell — shared layout (K10). Single source of truth for the base
 * page background/font and the content width used by the header row (and
 * by any page-owned bar, like a workspace sub-bar, that wants to align
 * with it). Colors are consumed via var(--bg)/var(--text) from
 * shared/theme.css — never redefined here.
 *
 * --app-header-height starts at 0 and is set by shared/layout.js once the
 * injected header has been measured. Every page's own header-clearing
 * offset (a `main`/`.studio-main` top padding, or a `.subbar`'s
 * margin-top/sticky top) references this ONE variable instead of a
 * hardcoded pixel value — that's what makes "changing layout spacing in
 * one place changes every page" true instead of aspirational.
 */
:root {
  --app-header-height: 0px;
}

html, body {
  background: var(--bg);
  color: var(--text);
  font-family: "Plus Jakarta Sans", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  min-height: 100%;
  -webkit-font-smoothing: antialiased;
}

/* Reused by the header's own inner row (via header.js's injected markup)
 * and by any page-owned bar that needs to align with it (e.g. a
 * workspace .subbar). Not applied to each page's own main content
 * wrapper, which keeps its own page-specific max-width. */
.wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }