rvlib-shipkit 1.1.1 → 1.3.0

package/src/shipkit-files.ts

@@ -0,0 +1,130 @@
+// THE `<name>.shipkit.ts` file: a repo drops one anywhere and default-exports
+// what it declares, and the kind says who reads it.
+//
+//   check({...})          a gate check, read by discovery like a `.check.ts`
+//   globalProcess({...})  a long running process for the whole machine: pm
+//                         supervises it, the home page switches it
+//   widget({...})         html the daemon renders every few seconds, mounted
+//                         on the home page
+//
+// the one constraint a reader breaks first: every kind is IMPORTED by the
+// process that reads it (discovery, pm's config child, the daemon), so a file
+// keeps its top level cheap and puts heavy work inside a function.
+import { check, type CheckDef } from './check.ts'
+
+export { check }
+
+/** one button beside a global process: a command, or a function of the file */
+export type ProcessAction = {
+    /** the words on the button */
+    label: string
+    /** argv, run from the repo root, output appended to the process log */
+    cmd?: string[]
+    /** a function run in its own bun process that imports this file, from
+     *  the repo root. Its output lands in the process log too */
+    run?: () => void | Promise<void>
+}
+
+export type GlobalProcessDef = {
+    /** kebab-case, unique on the machine: what a repo names in `serve.uses` */
+    id: string
+    /** the name on the switch (default the id) */
+    label?: string
+    /** one line: what it is for */
+    description?: string
+    /** the machine it runs on, as a hint beside the switch */
+    where?: string
+    /** argv, run from the repo root (or `cwd`). Without `down` it IS the
+     *  service: pm keeps it running, restarts it on a crash, signals it on
+     *  stop. With `down` it is a bring-up that exits once the service answers */
+    cmd: string[]
+    /** argv that takes a bring-up down again. Absent: `cmd` is the service */
+    down?: string[]
+    /** where both run, repo-relative (default the repo root) */
+    cwd?: string
+    /** the url it serves: shown as a link, probed when `probe` is absent */
+    url?: string
+    /** an http url that answers 2xx while it is up (default `url`). A
+     *  bring-up needs one of the two: its probe is the only truth */
+    probe?: string
+    /** a button each beside the switch, by key */
+    actions?: Record<string, ProcessAction>
+    /** what its card wears: an emoji, or a repo-relative image path
+     *  (png, svg, ico, jpg, webp). Absent: the declaring repo's own icon */
+    icon?: string
+}
+
+export type WidgetDef = {
+    /** kebab-case, unique in its repo */
+    id: string
+    /** the heading over it (default the id) */
+    title?: string
+    /** how often the daemon renders it again (default 5000, at least 1000) */
+    everyMs?: number
+    /** the html it shows, rendered in the daemon. A throw shows as its error */
+    render: () => string | Promise<string>
+}
+
+export type GlobalProcessUnit = GlobalProcessDef & { kind: 'globalProcess' }
+export type WidgetUnit = WidgetDef & { kind: 'widget' }
+
+export const UNIT_KINDS = ['globalProcess', 'widget'] as const
+
+const KEBAB = /^[a-z0-9][a-z0-9-]*$/
+const words = (v: unknown): boolean => Array.isArray(v) && v.length > 0 && v.every((w) => typeof w === 'string')
+const httpUrl = (v: unknown): boolean => typeof v === 'string' && /^https?:\/\//.test(v)
+
+/** the image types an icon file can be, by extension */
+export const ICON_IMAGE_TYPES: Record<string, string> = { png: 'image/png', svg: 'image/svg+xml', ico: 'image/x-icon', jpg: 'image/jpeg', jpeg: 'image/jpeg', webp: 'image/webp' }
+
+/** the image an icon names (its extension), or null when it is text */
+export const iconImageType = (icon: string): string | null => ICON_IMAGE_TYPES[/\.([a-z]+)$/i.exec(icon)?.[1]?.toLowerCase() ?? ''] ?? null
+
+function iconProblem(icon: unknown): string | null {
+    if (typeof icon !== 'string' || icon.trim() === '') return 'icon is an emoji or a repo relative image path'
+    if (iconImageType(icon) != null) return icon.startsWith('/') || icon.split(/[\\/]/).includes('..') ? `icon '${icon}' must be a repo relative path` : null
+    if (/[\\/.]/.test(icon) || [...icon].length > 8) return `icon '${icon}' is neither an emoji nor an image path (${Object.keys(ICON_IMAGE_TYPES).join(', ')})`
+    return null
+}
+
+/** why a global process declaration cannot run, or null */
+export function globalProcessProblem(d: GlobalProcessDef): string | null {
+    const at = `globalProcess '${String(d.id)}'`
+    if (!KEBAB.test(d.id ?? '')) return `${at}: id must be kebab-case`
+    if (!words(d.cmd)) return `${at}: cmd is a list of words`
+    if (d.down != null && !words(d.down)) return `${at}: down is a list of words`
+    if (d.url != null && !httpUrl(d.url)) return `${at}: url must be an http url`
+    if (d.probe != null && !httpUrl(d.probe)) return `${at}: probe must be an http url`
+    if (d.down != null && d.probe == null && d.url == null) return `${at}: a bring-up (one with down) needs probe or url, the only truth of whether it is up`
+    if (d.icon !== undefined) {
+        const why = iconProblem(d.icon)
+        if (why != null) return `${at}: ${why}`
+    }
+    for (const [k, a] of Object.entries(d.actions ?? {})) {
+        if (!KEBAB.test(k)) return `${at}: action '${k}' must be kebab-case`
+        if ((a.cmd != null) === (a.run != null)) return `${at}: action '${k}' declares exactly one of cmd or run`
+        if (a.cmd != null && !words(a.cmd)) return `${at}: action '${k}'.cmd is a list of words`
+    }
+    return null
+}
+
+export function globalProcess(d: GlobalProcessDef): GlobalProcessUnit {
+    const why = globalProcessProblem(d)
+    if (why != null) throw new Error(why)
+    return { ...d, kind: 'globalProcess' }
+}
+
+export function widget(d: WidgetDef): WidgetUnit {
+    if (!KEBAB.test(d.id ?? '')) throw new Error(`widget '${String(d.id)}': id must be kebab-case`)
+    if (typeof d.render !== 'function') throw new Error(`widget '${d.id}': render is a function returning html`)
+    if (d.everyMs != null && !(d.everyMs >= 1000)) throw new Error(`widget '${d.id}': everyMs is at least 1000`)
+    return { ...d, kind: 'widget' }
+}
+
+/** the kind a default export says it is: a unit, else a check */
+export function unitKind(d: unknown): 'globalProcess' | 'widget' | 'check' {
+    const k = (d as { kind?: unknown } | null)?.kind
+    return k === 'globalProcess' || k === 'widget' ? k : 'check'
+}
+
+export type { CheckDef }

package/src/shipkit.ts

@@ -15,7 +15,8 @@ export { contractsConfigFrom, activeContracts, applyContractsResult } from './co
 export { serveHub, hubTools } from './serve/serve-hub.ts'
 export type { Hub, HubDeps, HubTool } from './serve/serve-hub.ts'
 export type { GraphMount } from './wiki/graph-mount.ts'
-export { runServe, resolveHubDeps, defaultHubPort, baseWikiRoot } from './serve/run-serve.ts'
+export { runServe } from './serve/run-serve.ts'
+export { resolveHubDeps, defaultHubPort, baseWikiRoot, loadHub } from './serve/hub-runtime.ts'
 export { projectNeeds, redCount } from './collections/collection-types.ts'
 export type { Collection, Instance, NeedItem, NeedSeverity, CurationVerb } from './collections/collection-types.ts'
 export { buildCollections } from './collections/providers.ts'

package/src/suite/kept-timings.ts

@@ -15,7 +15,7 @@
 import { copyFileSync, mkdirSync, readFileSync } from 'fs'
 import { dirname, join } from 'path'
 import { atomicWrite } from '../core/locked-write.ts'
-import { shipkitRoot } from '../ledger/store.ts'
+import { shipkitRoot } from '../ledger/db.ts'
 
 /** where a unit's durations live, beside everything else the repo remembers */
 export const timingsHome = (root: string, unit: string): string => join(shipkitRoot(root), 'suite-timings', `${unit === '' ? 'root' : unit}.json`)

package/src/wiki/graph-positions.ts

@@ -4,7 +4,7 @@
 import { mkdirSync, readFileSync } from 'fs'
 import { dirname, join } from 'path'
 import { atomicWrite } from '../core/locked-write.ts'
-import { shipkitRoot } from '../ledger/store.ts'
+import { shipkitRoot } from '../ledger/db.ts'
 import type { MdGraph } from './md-graph.ts'
 
 export type Positions = Record<string, [number, number]>

package/src/checks/contracts.check.ts

@@ -1,20 +0,0 @@
-// the contracts check — `.shipkit/*` release-contract fulfillness. It shares ONE
-// evaluation with check SK002 (the `contractsResult` scan), and it tags with
-// that id, because the invariant has one owner and two surfaces report it. A
-// venue deploy step deps on it BY NAME, which needs nothing from this end.
-import { applyContractsResult, contractsResult } from '../contracts/apply-contracts.ts'
-import { check } from '../check.ts'
-import { contractsFulfillness } from './SK002-contracts-fulfillness.check.ts'
-
-export const contractsCheck = check({
-    id: 'contracts',
-    title: 'contracts',
-    description: 'every declared venue has the `.shipkit/*` release contract it demands',
-    owner: 'meta/contracts.md',
-    blocking: true,
-    run: async (c) => {
-        applyContractsResult(c, await c.use(contractsResult), contractsFulfillness)
-    },
-})
-
-export default contractsCheck

package/src/serve/health-schedule.ts

@@ -1,102 +0,0 @@
-// THE HEALTH PASS TIMER. While the hub serves, the whole health pass runs once
-// a day, and once at startup when the last whole pass on record is older than
-// that. One timer for the repo, no per check schedule: a check's own `ttl` is
-// its cadence, and this pass is only the heartbeat that replays an answer
-// still fresh and re-measures one that expired.
-//
-// The run is the hub's own in process runner, the same path as the button, so
-// its rows land in the same run record. "When was the last pass" is read off
-// that record, which is what makes a `shipkit check` in a terminal count too.
-
-/** how often the health pass runs while the hub serves */
-export const HEALTH_EVERY_MS = 24 * 60 * 60 * 1000
-
-/** how often the timer looks. The pass itself is daily, this only bounds how
- *  late after its due time it starts */
-export const SCHEDULE_LOOK_MS = 5 * 60 * 1000
-
-export type ScheduleState = {
-    everyMs: number
-    /** when the last whole health pass on record started, null = none */
-    lastPassAt: number | null
-    /** when the next one starts: now when it is overdue */
-    nextAt: number
-    /** the timer's own pass is running right now */
-    running: boolean
-}
-
-export type ScheduleDeps = {
-    now: () => number
-    /** the last whole health pass on record, whoever ran it */
-    lastPassAt: () => number | null
-    /** another run in this process is going: the timer never stacks on it */
-    busy: () => boolean
-    /** the pass itself */
-    run: () => Promise<void>
-    everyMs?: number
-}
-
-export type TickResult = 'ran' | 'fresh' | 'busy'
-
-export class HealthSchedule {
-    readonly everyMs: number
-    running = false
-    /** when this timer last STARTED a pass. A pass that dies before it writes
-     *  a record would otherwise be due again at the very next look */
-    private attemptedAt: number | null = null
-    private timer: ReturnType<typeof setInterval> | null = null
-
-    constructor(private readonly d: ScheduleDeps) {
-        this.everyMs = d.everyMs ?? HEALTH_EVERY_MS
-    }
-
-    /** the newest of the record and this timer's own last attempt */
-    private lastAt(): number | null {
-        const rec = this.d.lastPassAt()
-        if (rec == null) return this.attemptedAt
-        return this.attemptedAt == null ? rec : Math.max(rec, this.attemptedAt)
-    }
-
-    due(): boolean {
-        const last = this.lastAt()
-        return last == null || this.d.now() - last >= this.everyMs
-    }
-
-    state(): ScheduleState {
-        const now = this.d.now()
-        const last = this.lastAt()
-        return {
-            everyMs: this.everyMs,
-            lastPassAt: this.d.lastPassAt(),
-            nextAt: last == null ? now : Math.max(now, last + this.everyMs),
-            running: this.running,
-        }
-    }
-
-    /** one look: run the pass when it is due and nothing else is running */
-    async tick(): Promise<TickResult> {
-        if (this.running || this.d.busy()) return 'busy'
-        if (!this.due()) return 'fresh'
-        this.running = true
-        this.attemptedAt = this.d.now()
-        try {
-            await this.d.run()
-        } finally {
-            this.running = false
-        }
-        return 'ran'
-    }
-
-    /** look now, then every SCHEDULE_LOOK_MS. A second start is a no-op */
-    start(onError: (e: Error) => void, lookMs = SCHEDULE_LOOK_MS): void {
-        if (this.timer != null) return
-        const look = (): void => void this.tick().catch((e: Error) => onError(e))
-        look()
-        this.timer = setInterval(look, lookMs)
-    }
-
-    stop(): void {
-        if (this.timer != null) clearInterval(this.timer)
-        this.timer = null
-    }
-}

package/src/serve/hub-app/hub-st.ts

@@ -1,250 +0,0 @@
-// HubSt — the ONE root store (build/app-state-tree: one central tree,
-// instantiated once at boot, services with backrefs, exposed as
-// window.app). Owns cross-service state: selection, the severity filter
-// (an ADDRESS: /?f=needs · /?f=red), and the hash router: every page and
-// every tab is a selection, every selection has an address (hash-route.ts),
-// and setSel is the one place both move together.
-import { RUNS_ID } from '../../collections/collection-types.ts'
-import { makeAutoObservable } from 'mobx'
-import { ClockSvc } from './clock-svc.ts'
-import { ColsSvc } from './cols-svc.ts'
-import { canonicalSel, currentHash, hashFor, parseHash, selOf, type HashSel } from './hash-route.ts'
-import { ComfySvc } from './comfy-svc.ts'
-import { HealthSvc } from './health-svc.ts'
-import { LiveSvc } from './live-svc.ts'
-import { MediaSvc } from './media-svc.ts'
-import { TimelineSvc } from './timeline-svc.ts'
-import { TreeSvc } from './tree-svc.ts'
-import { ChecksSvc } from './checks-svc.ts'
-import { ProjectsSvc } from './projects-svc.ts'
-import { TestsSvc } from './tests-svc.ts'
-import type { Resource } from './hub-types.ts'
-
-export type Sel = HashSel | null
-
-/** one cmd+j target — run() fires the SAME action clicking would */
-export type Jump = { id: string; label: string; section: string; run: () => void }
-
-/** all · needs (yellow+red) · red — one severity ladder for every section */
-export type Filter = 'all' | 'needs' | 'red'
-const parseFilter = (search: string): Filter => {
-    const f = new URLSearchParams(search).get('f')
-    return f === 'needs' || f === 'red' ? f : 'all'
-}
-
-export class HubSt {
-    name = ''
-    /** where this repo sits on disk, from /hub.json: what makes a source
-     *  path on a page a link that opens his editor */
-    root = ''
-    /** the one second tick every age on the page reads (clock-svc.ts) */
-    clock = new ClockSvc()
-    media = new MediaSvc(this)
-    cols = new ColsSvc(this)
-    tree = new TreeSvc(this)
-    health = new HealthSvc(this)
-    checks = new ChecksSvc(this)
-    comfy = new ComfySvc(this)
-    timeline = new TimelineSvc(this)
-    /** the runs in flight, whoever started them (live-svc.ts) */
-    live = new LiveSvc(this)
-    projects = new ProjectsSvc(this)
-    /** the pages behind the test groups of the tree (tests-svc.ts) */
-    tests = new TestsSvc(this)
-    sel: Sel = null
-    filter: Filter = parseFilter(location.search)
-    /** sidebar search — live substring filter over asset + collection rows */
-    query = ''
-    palOpen = false
-    palQuery = ''
-    palIdx = 0
-    private booted = false
-
-    constructor() {
-        makeAutoObservable<this, 'booted'>(this, { media: false, cols: false, tree: false, health: false, checks: false, comfy: false, timeline: false, live: false, projects: false, tests: false, booted: false })
-    }
-
-    boot(): void {
-        void fetch('/hub.json')
-            .then((r) => r.json() as Promise<{ name: string; root?: string }>)
-            .then((h) => { this.setHub(h.name, h.root ?? '') })
-            .catch(() => {})
-        this.clock.start()
-        this.media.start()
-        this.cols.start()
-        this.live.start()
-        void this.checks.loadGate()
-        void this.health.load()
-        // back, forward, a pasted link and a hand edited hash all arrive
-        // here; applyHash is idempotent, so the two events firing together
-        // for one move cost nothing
-        window.addEventListener('hashchange', () => this.applyHash())
-        window.addEventListener('popstate', () => this.applyHash())
-        this.applyHash()
-    }
-    private setHub(n: string, root: string): void {
-        this.name = n
-        this.root = root
-        document.title = `${n} · hub`
-    }
-
-    setFilter(v: Filter): void {
-        this.filter = v
-        const u = new URL(location.href)
-        v === 'all' ? u.searchParams.delete('f') : u.searchParams.set('f', v)
-        history.replaceState(null, '', u)
-    }
-    setQuery(v: string): void {
-        this.query = v
-    }
-
-    // ── cmd+j palette ─────────────────────────────────────────────────────
-    palToggle(): void {
-        this.palOpen = !this.palOpen
-        this.palQuery = ''
-        this.palIdx = 0
-    }
-    palClose(): void {
-        this.palOpen = false
-    }
-    setPalQuery(v: string): void {
-        this.palQuery = v
-        this.palIdx = 0
-    }
-    setPalIdx(n: number): void {
-        this.palIdx = n
-    }
-    palMove(d: number): void {
-        const n = this.palResults.length
-        if (n > 0) this.palIdx = (this.palIdx + d + n) % n
-    }
-    palRun(): void {
-        const j = this.palResults[this.palIdx]
-        if (j == null) return
-        this.palOpen = false
-        j.run()
-    }
-    /** every jump target: section titles, media assets, collection instances */
-    get jumps(): Jump[] {
-        const out: Jump[] = []
-        for (const cat of new Set(this.media.assets.map((a) => a.cat)))
-            out.push({ id: `cat:${cat}`, label: cat, section: 'media', run: () => this.showCat(cat) })
-        for (const a of this.media.assets)
-            out.push({ id: `asset:${a.id}`, label: a.label, section: a.cat, run: () => this.selectAsset(a.id) })
-        // the runs page is a page, not a resource, so no collection lists it
-        out.push({ id: 'page:runs', label: 'runs', section: 'page', run: () => this.cols.select('runs', RUNS_ID) })
-        for (const col of this.cols.sidebarCols) {
-            out.push({ id: `col:${col.id}`, label: col.title, section: 'section', run: () => this.showCol(col.id) })
-            for (const i of col.instances)
-                out.push({ id: `item:${i.id}`, label: i.text, section: col.title, run: () => this.cols.select(col.id, i.id) })
-        }
-        return out
-    }
-    /** ranked: prefix matches first, then substring; capped at 12 */
-    get palResults(): Jump[] {
-        const q = this.palQuery.trim().toLowerCase()
-        if (q === '') return this.jumps.slice(0, 12)
-        const pre: Jump[] = []
-        const sub: Jump[] = []
-        for (const j of this.jumps) {
-            const l = j.label.toLowerCase()
-            if (l.startsWith(q)) pre.push(j)
-            else if (l.includes(q)) sub.push(j)
-        }
-        return [...pre, ...sub].slice(0, 12)
-    }
-
-    // ── selection + hash deep-links ───────────────────────────────────────
-    selectAsset(id: string): void {
-        this.setSel({ t: 'asset', id })
-        void this.media.select(id)
-    }
-    showCat(cat: string): void {
-        this.setSel({ t: 'cat', cat })
-        this.media.openCats.add(cat)
-        void this.media.fillCat()
-    }
-    showStatus(): void {
-        this.setSel({ t: 'status' })
-        void this.health.load()
-    }
-    /** where the test checks' time goes: the `tests` group (null) or one test
-     *  check's group. Fetched as the page opens, never on the poll */
-    showTests(check: string | null): void {
-        this.setSel({ t: 'tests', check })
-        void this.tests.load(check)
-    }
-
-    /** the ONE place a selection is written, so the url always describes what
-     *  is on screen. A new page is a history entry, so back returns to the
-     *  page before it. The same address is never pushed twice: applyHash
-     *  lands here too, with the hash already naming this selection */
-    setSel(sel: Sel): void {
-        this.sel = sel
-        const h = hashFor(sel)
-        if (h == null) return
-        const cur = parseHash(currentHash())
-        const next = parseHash(h)
-        // the tool set rides after the asset id (media-svc syncHash), so an
-        // address is the same page whatever tools it carries
-        if (cur.kind === next.kind && cur.col === next.col && cur.id === next.id) return
-        history.pushState(null, '', `#${h}`)
-    }
-    /** one tree row, opened: an asset goes to the atelier, everything else to
-     *  its own item card. A gate check has a page of its own now, so nothing
-     *  lands on the raw wall of text unless it is asked for by name */
-    openResource(r: Resource): void {
-        const assetId = r.id.replace(/^media:/, '')
-        if (r.collection === 'media' && this.media.assets.some((a) => a.id === assetId)) {
-            this.selectAsset(assetId)
-            return
-        }
-        this.cols.select(r.collection, r.id)
-    }
-
-    /** collection view — one card per instance */
-    showCol(id: string): void {
-        this.setSel({ t: 'col', id })
-    }
-    /** open whatever a selection names, through the same calls a click makes */
-    go(sel: HashSel): void {
-        switch (sel.t) {
-            case 'asset': return this.selectAsset(sel.id)
-            case 'cat': return this.showCat(sel.cat)
-            case 'col': return this.showCol(sel.id)
-            case 'item': return this.cols.select(sel.col, sel.id)
-            case 'status': return this.showStatus()
-            case 'tests': return this.showTests(sel.check)
-        }
-    }
-    /** the url decides the page: a reload, back, forward and a pasted link
-     *  all land here, and only a hash naming something else moves the view */
-    applyHash(): void {
-        const p = parseHash(currentHash())
-        const named = selOf(p)
-        if (named == null) return
-        // an address naming what this build opens under another address is
-        // rewritten in place: a replace, so back never lands on the stale one
-        const sel = canonicalSel(named)
-        if (sel !== named) history.replaceState(null, '', `#${hashFor(sel)}`)
-        // media addresses resolve only once the first heartbeat listed the
-        // assets (afterFirstBeat calls back)
-        if (sel.t === 'asset' && !this.media.assets.some((a) => a.id === sel.id)) return
-        if (sel.t === 'cat' && !this.media.assets.some((a) => a.cat === sel.cat)) return
-        if (sel.t === 'asset' && this.media.curId === sel.id) {
-            // same asset, new tool set (a pasted share link): apply NOW, a
-            // parked pendingTools would hijack the next selection instead
-            if (p.tools != null) this.media.applyTab(p.tools)
-            return
-        }
-        if (hashFor(sel) === hashFor(this.sel)) return
-        if (sel.t === 'asset') this.media.pendingTools = p.tools
-        this.go(sel)
-    }
-    /** first heartbeat has the asset list — only then can a hash resolve */
-    afterFirstBeat(): void {
-        if (this.booted) return
-        this.booted = true
-        this.applyHash()
-    }
-}

package/src/serve/hub-app/project-gutter.css

@@ -1,65 +0,0 @@
-/* the project gutter. It is FIXED to the left edge, so it takes no cell of
-   the .app grid, and the page makes room for it by padding, whatever the
-   grid holds. Colours are hub.css tokens only, spacing is its scale:
-   tests/hub-css-invariants.test.ts reads this sheet too. */
-.app:has(> .pgut){--gut:44px;padding-left:var(--gut)}
-.pgut{position:fixed;left:0;top:0;bottom:0;width:var(--gut,44px);z-index:5;display:flex;flex-direction:column;align-items:center;
- gap:var(--s1);padding:var(--s2) 0;background:var(--bg);border-right:1px solid var(--line);overflow-y:auto;scrollbar-width:none}
-.pgt{position:relative;flex:none;width:32px;height:32px;display:flex;align-items:center;justify-content:center;padding:0;
- background:transparent;border:0;border-radius:6px;cursor:pointer}
-.pgt:hover{background:var(--panel2)}
-.pgt.cur{background:var(--sel)}
-.pgt img{width:24px;height:24px;border-radius:5px;object-fit:cover;pointer-events:none}
-/* the initial on a hue hashed from the name (projects-svc hueOf) */
-.pgi{width:24px;height:24px;border-radius:5px;display:flex;align-items:center;justify-content:center;
- font-size:12px;font-weight:600;user-select:none;color:var(--c);background:color-mix(in srgb,var(--c) 22%,var(--panel2))}
-.pgi.h1{--c:var(--k1)}
-.pgi.h2{--c:var(--k2)}
-.pgi.h3{--c:var(--k3)}
-.pgi.h4{--c:var(--k4)}
-.pgi.h5{--c:var(--k5)}
-.pgi.h6{--c:var(--k6)}
-/* the face says three things and no more (projects-svc faceOf) */
-/* closed in VS Code: the icon dims, the badge does not */
-.pgt.dim img,.pgt.dim .pgi{opacity:.45}
-/* the one badge: open asks, top right */
-.pga{position:absolute;top:0;right:0;min-width:14px;height:14px;padding:0 var(--s0);border-radius:7px;
- font-size:9px;font-weight:700;line-height:14px;text-align:center;color:var(--bg);background:var(--warn)}
-/* Claude sessions running: a thin edge on the left that breathes */
-.pgs{position:absolute;left:0;top:6px;bottom:6px;width:2px;border-radius:1px;background:var(--accent);pointer-events:none;animation:pgpulse 2.4s ease-in-out infinite}
-@keyframes pgpulse{0%,100%{opacity:1}50%{opacity:.25}}
-@media (prefers-reduced-motion:reduce){.pgs{animation:none}}
-/* the hover card: right of the rail, one at a time, never interactive.
-   Header, then what needs a human, then the label and value rows of the
-   check page (.wfact .wk .wv from hub.css) */
-.pgcard{position:fixed;left:calc(var(--gut,44px) + var(--s2));z-index:20;width:300px;padding:var(--s3);pointer-events:none;
- background:var(--panel);border:1px solid var(--line);border-radius:4px;box-shadow:0 6px 20px var(--shadow);font-size:12px;line-height:1.45;color:var(--ink)}
-.pgch{display:flex;align-items:center;gap:var(--s2);min-width:0}
-.pgcface{flex:none;display:flex}
-.pgcface img,.pgcface .pgi{width:20px;height:20px;border-radius:4px;font-size:11px}
-.pgcname{flex:1;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-.pgcthis{font-weight:400;font-size:11px;color:var(--dim)}
-.pgcver{flex:none;color:var(--dim);font-size:11px;font-variant-numeric:tabular-nums}
-.pgcline{margin-top:var(--s1);color:var(--dim);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-.pgcdesc{margin-top:var(--s1);color:var(--dim);font-size:11px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
-/* NEEDS YOU: a warn toned bullet, set apart from the facts */
-.pgcneeds{margin-top:var(--s2);padding:var(--s1) var(--s2);border-left:2px solid var(--warn);background:var(--panel2);border-radius:0 3px 3px 0}
-.pgcneed{display:flex;gap:var(--s1);min-width:0;color:var(--warn)}
-.pgcneed.red{color:var(--red);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-.pgcask{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-.pgcmore{flex:none}
-.pgcfacts{margin-top:var(--s2)}
-.pgcfacts .wk{flex-basis:64px;white-space:nowrap}
-.pgcfacts .wv{text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;word-break:normal}
-.pgcfacts .wv.warn{color:var(--warn)}
-.pgerr{font-size:12px;font-weight:700;color:var(--red);cursor:help}
-/* the one time sort by last activity, above the icons */
-.pgsort{flex:none;width:32px;height:20px;padding:0;background:transparent;border:1px solid var(--line);border-radius:3px;
- color:var(--dim);font-size:12px;line-height:18px;cursor:pointer}
-.pgsort:hover{color:var(--ink);border-color:var(--accent)}
-/* a drag: the tile being moved fades, and the gap it would land in is a line
-   drawn on a tile edge, centred in the gap between two tiles */
-.pgt.dragging{opacity:.4}
-.pgt.dropb::before,.pgt.dropa::after{content:'';position:absolute;left:2px;right:2px;height:2px;border-radius:1px;background:var(--accent);pointer-events:none}
-.pgt.dropb::before{top:-3px}
-.pgt.dropa::after{bottom:-3px}