@ash-qw/dsh-theme-prts 0.1.91

package/src/client/sidebar-control-adapter.js

@@ -0,0 +1,317 @@
+import { ensureFacilityGraphic, ensureFacilityTextureDefs, renderFacilityGraphic } from './facility-vector.js'
+
+const OWNED_ATTRIBUTES = [
+  'data-prts-row-title',
+  'data-prts-workspace-disclosure',
+  'data-prts-workspace-icon',
+  'data-prts-row-menu-open',
+  'data-prts-workspace-row',
+  'data-prts-workspace-actions',
+  'data-prts-workspace-menu-anchor',
+  'data-prts-workspace-menu',
+  'data-prts-workspace-create',
+  'data-prts-session-row',
+  'data-prts-session-actions',
+  'data-prts-session-menu-anchor',
+  'data-prts-session-menu',
+  'data-prts-session-time',
+  'data-prts-session-index',
+  'data-prts-facility-face',
+  'data-prts-facility-spine',
+  'data-prts-facility-vector',
+  'data-prts-facility-size',
+  'data-prts-facility-texture',
+  'data-prts-spine-vector',
+]
+
+function markSidebarNode(node, attribute, next) {
+  if (!node) return
+  node.setAttribute(attribute, '')
+  next.add(node)
+}
+
+function resolveRowControls(row, kind) {
+  const menu = row.querySelector(':scope > span > span > button[type="button"]')
+  const anchor = menu?.parentElement
+  const actions = anchor?.parentElement
+  if (!menu || !anchor || actions?.parentElement !== row) return {}
+  const create = kind === 'workspace'
+    ? actions.querySelector(':scope > button[type="button"]')
+    : undefined
+  return { actions, anchor, create, menu }
+}
+
+function resolveRowTitle(row, kind, actions) {
+  const candidates = Array.from(row.querySelectorAll(':scope > span')).filter(node => (
+    node !== actions
+    && !node.hasAttribute('data-prts-row-projection')
+    && node.getAttribute('aria-hidden') !== 'true'
+    && !node.querySelector('button')
+    && node.textContent.trim()
+  ))
+  if (kind === 'session') return candidates.find(node => node.matches('[class*="title"], [data-session-title]')) ?? candidates.at(-1)
+  return candidates.find(node => node.matches('[class*="project"], [class*="workspace"], [data-workspace-title]')) ?? candidates.at(-1)
+}
+
+function resolveWorkspaceIcon(row, title, actions) {
+  return Array.from(row.children).find(node => (
+    node.tagName === 'SPAN'
+    && node !== title
+    && node !== actions
+    && !node.hasAttribute('data-prts-facility-face')
+    && !node.hasAttribute('data-prts-facility-spine')
+    && !node.hasAttribute('data-prts-row-projection')
+  ))
+}
+
+function resolveWorkspaceDisclosure(row, title, actions, icon) {
+  return Array.from(row.children).find(node => (
+    node.tagName === 'SPAN'
+    && node !== title
+    && node !== actions
+    && node !== icon
+    && !node.hasAttribute('data-prts-facility-face')
+    && !node.hasAttribute('data-prts-facility-spine')
+    && !node.hasAttribute('data-prts-row-projection')
+    && !node.querySelector('button')
+  ))
+}
+
+function resolveSessionTime(row, title, actions) {
+  const candidates = Array.from(row.querySelectorAll(':scope > span')).filter(node => (
+    node !== title
+    && node !== actions
+    && !node.hasAttribute('data-prts-facility-face')
+    && !node.hasAttribute('data-prts-row-projection')
+    && node.getAttribute('aria-hidden') !== 'true'
+    && !node.querySelector('button')
+    && node.textContent.trim()
+  ))
+  return candidates.find(node => node.matches('[class*="time" i], time, [data-session-time]')) ?? candidates.at(-1)
+}
+
+function ensureFacilityFace(document, row, kind, next) {
+  let face = row.querySelector(':scope > [data-prts-facility-face]')
+  if (!face) {
+    face = document.createElement('span')
+    face.setAttribute('data-prts-owned-facility', '')
+    row.insertBefore(face, row.firstChild)
+  }
+  face.setAttribute('data-prts-facility-face', kind)
+  face.setAttribute('data-prts-facility-texture', kind === 'workspace' ? 'silhouette' : 'pickup')
+  face.setAttribute('aria-hidden', 'true')
+  next.add(face)
+  return face
+}
+
+function ensureFacilitySpine(document, row, kind, next) {
+  let spine = row.querySelector(':scope > [data-prts-facility-spine]')
+  if (!spine) {
+    spine = document.createElement('span')
+    spine.setAttribute('data-prts-owned-facility-spine', '')
+    row.insertBefore(spine, row.firstChild)
+  }
+  spine.setAttribute('data-prts-facility-spine', kind)
+  spine.setAttribute('aria-hidden', 'true')
+  next.add(spine)
+  return spine
+}
+
+
+export function createSidebarControlAdapter({ document, window }) {
+  let observer
+  let resizeObserver
+  let resizeFrame
+  let resizeTimer
+  let scanFrame
+  let owned = new Set()
+  let vectorOwners = new Set()
+  const dirtyVectors = new Map()
+  const vectorSizes = new WeakMap()
+
+  function scheduleVectors() {
+    if (resizeFrame !== undefined) return
+    const requestFrame = window?.requestAnimationFrame?.bind(window) ?? (callback => window?.setTimeout?.(callback, 0))
+    resizeFrame = requestFrame?.(flushVectors)
+  }
+
+  function flushVectors() {
+    resizeFrame = undefined
+    const measurements = []
+    for (const [owner, observedSize] of dirtyVectors) {
+      if (!vectorOwners.has(owner) || !owner.isConnected) continue
+      let size = observedSize
+      if (!size) {
+        const box = owner.getBoundingClientRect?.()
+        size = {
+          width: owner.clientWidth || owner.offsetWidth || box?.width || 0,
+          height: owner.clientHeight || owner.offsetHeight || box?.height || 0,
+        }
+      }
+      const previous = vectorSizes.get(owner)
+      if (previous?.width === size.width && previous?.height === size.height) continue
+      vectorSizes.set(owner, size)
+      measurements.push([owner, size])
+    }
+    dirtyVectors.clear()
+    for (const [owner, size] of measurements) renderFacilityGraphic(owner, size)
+  }
+
+  function registerVector(owner, options, next, nextVectorOwners) {
+    if (!owner) return
+    const graphic = ensureFacilityGraphic(document, owner, options)
+    if (!graphic) return
+    next.add(graphic)
+    nextVectorOwners.add(owner)
+    if (!vectorOwners.has(owner)) resizeObserver?.observe(owner)
+    if (!vectorSizes.has(owner)) dirtyVectors.set(owner, undefined)
+  }
+
+  function syncVectorOwners(next) {
+    for (const owner of vectorOwners) {
+      if (next.has(owner)) continue
+      resizeObserver?.unobserve?.(owner)
+      dirtyVectors.delete(owner)
+    }
+    vectorOwners = next
+    scheduleVectors()
+  }
+
+
+  function queueScan() {
+    if (scanFrame !== undefined) return
+    const requestFrame = window?.requestAnimationFrame?.bind(window) ?? (callback => window?.setTimeout?.(callback, 0))
+    scanFrame = requestFrame(() => {
+      scanFrame = undefined
+      scan()
+    })
+  }
+
+  function scan() {
+    const root = document?.querySelector?.('[data-prts-region="sessions"] [data-slot="sidebar.workspaces"]')
+    const next = new Set()
+    const nextVectorOwners = new Set()
+    if (root) {
+      for (const projection of root.querySelectorAll('[data-prts-owned-projection]')) projection.remove()
+      for (const row of root.querySelectorAll('div[role="treeitem"][aria-expanded]')) {
+        const controls = resolveRowControls(row, 'workspace')
+        const face = ensureFacilityFace(document, row, 'workspace', next)
+        const spine = ensureFacilitySpine(document, row, 'workspace', next)
+        registerVector(face, { kind: 'face', topNotch: true, texture: 'silhouette' }, next, nextVectorOwners)
+        registerVector(spine, { kind: 'spine' }, next, nextVectorOwners)
+        markSidebarNode(row, 'data-prts-workspace-row', next)
+        const title = resolveRowTitle(row, 'workspace', controls.actions)
+        markSidebarNode(title, 'data-prts-row-title', next)
+        const icon = resolveWorkspaceIcon(row, title, controls.actions)
+        markSidebarNode(icon, 'data-prts-workspace-icon', next)
+        markSidebarNode(resolveWorkspaceDisclosure(row, title, controls.actions, icon), 'data-prts-workspace-disclosure', next)
+        row.toggleAttribute('data-prts-row-menu-open', controls.menu?.getAttribute('aria-expanded') === 'true'
+          || row.classList.contains('menuOpen'))
+        markSidebarNode(controls.actions, 'data-prts-workspace-actions', next)
+        markSidebarNode(controls.anchor, 'data-prts-workspace-menu-anchor', next)
+        markSidebarNode(controls.menu, 'data-prts-workspace-menu', next)
+        markSidebarNode(controls.create, 'data-prts-workspace-create', next)
+        registerVector(controls.menu, { kind: 'button' }, next, nextVectorOwners)
+        registerVector(controls.create, { kind: 'button' }, next, nextVectorOwners)
+      }
+      let sessionOrdinal = 0
+      for (const row of root.querySelectorAll('div[role="treeitem"][aria-selected]')) {
+        const sessionIndex = String(++sessionOrdinal).padStart(2, '0')
+        const controls = resolveRowControls(row, 'session')
+        const face = ensureFacilityFace(document, row, 'session', next)
+        const spine = ensureFacilitySpine(document, row, 'session', next)
+        registerVector(face, { kind: 'face', topNotch: true, texture: 'pickup' }, next, nextVectorOwners)
+        registerVector(spine, { kind: 'spine' }, next, nextVectorOwners)
+        markSidebarNode(row, 'data-prts-session-row', next)
+        row.dataset.prtsSessionIndex = sessionIndex
+        const title = resolveRowTitle(row, 'session', controls.actions)
+        markSidebarNode(title, 'data-prts-row-title', next)
+        markSidebarNode(resolveSessionTime(row, title, controls.actions), 'data-prts-session-time', next)
+        if (title) title.dataset.prtsSessionIndex = sessionIndex
+        row.toggleAttribute('data-prts-row-menu-open', controls.menu?.getAttribute('aria-expanded') === 'true'
+          || row.classList.contains('menuOpen'))
+        markSidebarNode(controls.actions, 'data-prts-session-actions', next)
+        markSidebarNode(controls.anchor, 'data-prts-session-menu-anchor', next)
+        markSidebarNode(controls.menu, 'data-prts-session-menu', next)
+        registerVector(controls.menu, { kind: 'button' }, next, nextVectorOwners)
+      }
+    }
+    for (const node of owned) {
+      if (next.has(node)) continue
+      if (node.hasAttribute?.('data-prts-owned-projection')
+        || node.hasAttribute?.('data-prts-owned-facility')
+        || node.hasAttribute?.('data-prts-owned-facility-spine')
+        || node.hasAttribute?.('data-prts-owned-facility-vector')) {
+        node.remove()
+        continue
+      }
+      for (const attribute of OWNED_ATTRIBUTES) node.removeAttribute?.(attribute)
+    }
+    syncVectorOwners(nextVectorOwners)
+    owned = next
+  }
+
+  function clear() {
+    for (const node of document?.querySelectorAll?.('[data-prts-owned-projection], [data-prts-owned-facility], [data-prts-owned-facility-spine], [data-prts-owned-facility-vector], [data-prts-owned-facility-defs]') ?? []) node.remove()
+    for (const node of owned) {
+      for (const attribute of OWNED_ATTRIBUTES) node.removeAttribute?.(attribute)
+    }
+    for (const attribute of OWNED_ATTRIBUTES) {
+      for (const node of document?.querySelectorAll?.(`[${attribute}]`) ?? []) node.removeAttribute(attribute)
+    }
+    vectorOwners.clear()
+    dirtyVectors.clear()
+    owned.clear()
+  }
+
+  return {
+    start() {
+      if (!document) return
+      ensureFacilityTextureDefs(document)
+      const ResizeObserver = window?.ResizeObserver
+      if (!resizeObserver && typeof ResizeObserver === 'function') {
+        resizeObserver = new ResizeObserver(entries => {
+          for (const entry of entries) {
+            const rect = entry.contentRect
+            dirtyVectors.set(entry.target, rect ? { width: rect.width, height: rect.height } : undefined)
+          }
+          if (resizeTimer !== undefined) window?.clearTimeout?.(resizeTimer)
+          resizeTimer = window?.setTimeout?.(() => {
+            resizeTimer = undefined
+            scheduleVectors()
+          }, 160)
+        })
+      }
+      scan()
+      if (observer || !window?.MutationObserver) return
+      const observationRoot = document.querySelector('[data-prts-region="sessions"]')
+      if (!observationRoot) return
+      observer = new window.MutationObserver(queueScan)
+      observer.observe(observationRoot, {
+        subtree: true,
+        childList: true,
+        attributes: true,
+        attributeFilter: ['aria-expanded', 'aria-selected', 'class'],
+      })
+    },
+    dispose() {
+      observer?.disconnect()
+      observer = undefined
+      if (scanFrame !== undefined) {
+        if (window?.cancelAnimationFrame) window.cancelAnimationFrame(scanFrame)
+        else window?.clearTimeout?.(scanFrame)
+      }
+      scanFrame = undefined
+      resizeObserver?.disconnect()
+      resizeObserver = undefined
+      if (resizeFrame !== undefined) {
+        if (window?.cancelAnimationFrame) window.cancelAnimationFrame(resizeFrame)
+        else window?.clearTimeout?.(resizeFrame)
+      }
+      resizeFrame = undefined
+      if (resizeTimer !== undefined) window?.clearTimeout?.(resizeTimer)
+      resizeTimer = undefined
+      clear()
+    },
+  }
+}

package/src/client/startup-sequence.js

@@ -0,0 +1,366 @@
+export const PRTS_STARTUP_TIMINGS = Object.freeze({
+  enter: 20,
+  minimum: 1350,
+  intro: 560,
+  approach: 2400,
+  finish: 260,
+  copyFade: 90,
+  readyHold: 280,
+  exitLead: 120,
+  exit: 470,
+  completePadding: 40,
+  reducedExit: 160,
+  timeout: 20000,
+  timeoutHold: 700,
+  watchdog: 22000,
+})
+
+const STARTUP_STAGES = Object.freeze({
+  linking: Object.freeze({ label: 'LINKING', detail: '神经链路接入' }),
+  authenticating: Object.freeze({ label: 'AUTHENTICATING', detail: '博士身份校验' }),
+  visualOnline: Object.freeze({ label: 'VISUAL LAYER ONLINE', detail: '视觉层已上线' }),
+  ready: Object.freeze({ label: 'P.R.T.S. READY', detail: '终端接管完成' }),
+})
+
+function startupMarkup(prtsEmblem = '', rhodesEmblem = '') {
+  const ticks = Array.from({ length: 21 }, (_, index) => `<i${index % 5 === 0 ? ' data-major' : ''}></i>`).join('')
+  return `<section data-prts-startup data-stage="boot" popover="manual" role="status" aria-live="assertive" aria-label="P.R.T.S. 启动序列" tabindex="-1">
+    <div data-prts-startup-grid aria-hidden="true"></div>
+    <div data-prts-startup-scan aria-hidden="true"></div>
+    <div data-prts-startup-cut="left" aria-hidden="true"></div>
+    <div data-prts-startup-cut="right" aria-hidden="true"></div>
+    <header data-prts-startup-header aria-hidden="true">
+      <span>P.R.T.S. // RHODES ISLAND</span>
+      <small>NEURAL TERMINAL CONNECTION</small>
+    </header>
+    <aside data-prts-startup-telemetry aria-hidden="true">
+      <span>ORIGIN // RI-001</span>
+      <span>PROTOCOL // TACTICAL</span>
+      <span>LINK // ENCRYPTED</span>
+    </aside>
+    <main data-prts-startup-core>
+      <div data-prts-startup-frame aria-hidden="true">
+        <span data-prts-startup-frame-outer></span>
+        <span data-prts-startup-frame-inner></span>
+        <span data-prts-startup-reticle></span>
+        <img data-prts-startup-emblem src="${prtsEmblem}" alt="">
+      </div>
+      <div data-prts-startup-signature aria-hidden="true">
+        <span>${rhodesEmblem}</span>
+        <small>RHODES ISLAND<br>RI-001</small>
+      </div>
+      <div data-prts-startup-state>
+        <strong data-prts-startup-label>INITIALIZING</strong>
+        <span data-prts-startup-detail>启动序列初始化</span>
+      </div>
+    </main>
+    <footer data-prts-startup-progress>
+      <output aria-hidden="true">BOOT SEQUENCE // <span data-prts-startup-percent>000%</span></output>
+      <div data-prts-startup-track aria-hidden="true">
+        <b data-prts-startup-fill></b>
+        <span data-prts-startup-ticks>${ticks}</span>
+      </div>
+    </footer>
+    <div data-prts-startup-coordinate aria-hidden="true">X 061.38&nbsp;&nbsp;Y 109.42</div>
+  </section>`
+}
+
+function clamp01(value) {
+  return Math.max(0, Math.min(1, value))
+}
+
+function easeOutCubic(value) {
+  return 1 - Math.pow(1 - clamp01(value), 3)
+}
+
+export function findNativeHarnessLoader(document) {
+  return document?.querySelector?.('[data-dsh-boot]') ?? null
+}
+
+export function createPrtsStartupSequence({
+  document,
+  window,
+  prtsEmblem = '',
+  rhodesEmblem = '',
+  timings = PRTS_STARTUP_TIMINGS,
+} = {}) {
+  const schedule = { ...PRTS_STARTUP_TIMINGS, ...timings }
+  let overlay
+  let frame
+  let inertRecords = []
+  let previousFocus
+  let startedAt
+  let waitForReady = false
+  let readyWhen
+  let hostReady = false
+  let finishStartedAt
+  let finishStartedProgress = 0
+  let readyStartedAt
+  let exitStartedAt
+  let timeoutStartedAt
+  let currentStage = 'boot'
+  let pendingStage
+  let copyTransitionStartedAt
+  let lastProgress = -1
+  let useReducedMotion = false
+
+  const now = () => window?.performance?.now?.() ?? Date.now()
+  const requestFrame = callback => window?.requestAnimationFrame?.(callback)
+    ?? window?.setTimeout?.(() => callback(now()), 16)
+  const cancelFrame = id => {
+    if (id === undefined) return
+    if (window?.cancelAnimationFrame) window.cancelAnimationFrame(id)
+    else window?.clearTimeout?.(id)
+  }
+
+  function restoreInteractivity() {
+    for (const record of inertRecords) {
+      if (!record.node?.isConnected) continue
+      record.node.inert = record.inert
+      if (record.hadAttribute) record.node.setAttribute('inert', '')
+      else record.node.removeAttribute('inert')
+    }
+    inertRecords = []
+  }
+
+  function cleanup({ restoreFocus = true } = {}) {
+    cancelFrame(frame)
+    frame = undefined
+    document?.removeEventListener?.('visibilitychange', onVisibilityChange)
+    document?.documentElement?.removeAttribute?.('data-prts-startup-active')
+    try {
+      overlay?.hidePopover?.()
+    } catch {
+      // The overlay may already have left the top layer during page teardown.
+    }
+    overlay?.remove?.()
+    overlay = undefined
+    restoreInteractivity()
+    if (restoreFocus && previousFocus?.isConnected) previousFocus.focus?.()
+    previousFocus = undefined
+  }
+
+  function updateProgress(progress) {
+    if (!overlay) return
+    const safeProgress = Math.max(0, Math.min(100, progress))
+    if (Math.abs(safeProgress - lastProgress) < .01) return
+    lastProgress = safeProgress
+    overlay.style.setProperty('--prts-startup-progress', (safeProgress / 100).toFixed(4))
+    const percent = overlay.querySelector('[data-prts-startup-percent]')
+    if (percent) percent.textContent = `${String(Math.round(safeProgress)).padStart(3, '0')}%`
+  }
+
+  function applyStage(name) {
+    if (!overlay) return
+    const stage = STARTUP_STAGES[name]
+    if (!stage) return
+    currentStage = name
+    overlay.dataset.stage = name
+    const label = overlay.querySelector('[data-prts-startup-label]')
+    const detail = overlay.querySelector('[data-prts-startup-detail]')
+    if (label) label.textContent = stage.label
+    if (detail) detail.textContent = stage.detail
+    overlay.setAttribute('aria-label', `P.R.T.S. 启动序列：${stage.detail}`)
+  }
+
+  function requestStage(name, elapsed) {
+    if (!overlay || name === currentStage && !pendingStage) return
+    if (!pendingStage) {
+      copyTransitionStartedAt = elapsed
+      overlay.setAttribute('data-copy-transition', '')
+    }
+    pendingStage = name
+  }
+
+  function advanceStageTransition(elapsed) {
+    if (!pendingStage || copyTransitionStartedAt === undefined) return
+    if (elapsed - copyTransitionStartedAt < schedule.copyFade) return
+    const next = pendingStage
+    pendingStage = undefined
+    copyTransitionStartedAt = undefined
+    applyStage(next)
+    overlay?.removeAttribute('data-copy-transition')
+    if (next === 'ready') readyStartedAt = elapsed
+  }
+
+  function stageForProgress(progress) {
+    if (progress >= 68) return 'visualOnline'
+    if (progress >= 32) return 'authenticating'
+    return 'linking'
+  }
+
+  function beginExit(elapsed, { failOpen = false } = {}) {
+    if (!overlay || exitStartedAt !== undefined) return
+    exitStartedAt = elapsed
+    overlay.toggleAttribute('data-fail-open', failOpen)
+    overlay.setAttribute('data-exit-content', '')
+    if (useReducedMotion) overlay.setAttribute('data-exiting', '')
+  }
+
+  function onVisibilityChange() {
+    if (document?.visibilityState === 'hidden') cleanup({ restoreFocus: false })
+  }
+
+  function reducedMotionRequested(forceReduced) {
+    if (typeof forceReduced === 'boolean') return forceReduced
+    return document?.documentElement?.dataset?.prtsMotion === 'reduced'
+      || window?.matchMedia?.('(prefers-reduced-motion: reduce)')?.matches === true
+  }
+
+  function lockSiblings() {
+    inertRecords = [...(document?.body?.children ?? [])]
+      .filter(node => node !== overlay)
+      .map(node => ({ node, hadAttribute: node.hasAttribute('inert'), inert: Boolean(node.inert) }))
+    for (const record of inertRecords) {
+      record.node.inert = true
+      record.node.setAttribute('inert', '')
+    }
+  }
+
+  function promoteToTopLayer() {
+    if (typeof overlay?.showPopover !== 'function') return
+    try {
+      overlay.showPopover()
+    } catch {
+      // A recognized but unavailable Popover API must not hide the fixed fallback.
+      overlay.removeAttribute('popover')
+    }
+  }
+
+  function checkHostReady() {
+    if (hostReady) return true
+    if (!waitForReady) return (hostReady = true)
+    try {
+      if (readyWhen?.() === true) hostReady = true
+    } catch {
+      // A transient Host DOM read must not break the fail-open timeline.
+    }
+    return hostReady
+  }
+
+  function tick(timestamp) {
+    if (!overlay) return
+    const time = Number.isFinite(timestamp) ? timestamp : now()
+    startedAt ??= time
+    const elapsed = Math.max(0, time - startedAt)
+    checkHostReady()
+
+    if (!overlay.hasAttribute('data-visible') && elapsed >= schedule.enter) {
+      overlay.setAttribute('data-visible', '')
+    }
+
+    if (useReducedMotion) {
+      if (!hostReady && timeoutStartedAt === undefined && elapsed >= schedule.timeout) {
+        timeoutStartedAt = elapsed
+      }
+      if (timeoutStartedAt !== undefined && elapsed - timeoutStartedAt >= schedule.timeoutHold) {
+        beginExit(elapsed, { failOpen: true })
+      } else if (hostReady) {
+        beginExit(elapsed)
+      }
+      if (exitStartedAt !== undefined && elapsed - exitStartedAt >= schedule.reducedExit + schedule.completePadding) {
+        cleanup()
+        return
+      }
+    } else if (timeoutStartedAt !== undefined) {
+      updateProgress(90)
+      if (elapsed - timeoutStartedAt >= schedule.timeoutHold) beginExit(elapsed, { failOpen: true })
+    } else {
+      const approachProgress = 90 * easeOutCubic(elapsed / schedule.approach)
+      let progress = Math.min(90, approachProgress)
+
+      if (!hostReady && elapsed >= schedule.timeout) {
+        timeoutStartedAt = elapsed
+      } else if (hostReady && elapsed >= schedule.intro) {
+        if (finishStartedAt === undefined) {
+          finishStartedAt = elapsed
+          finishStartedProgress = progress
+        }
+        progress = finishStartedProgress
+          + (100 - finishStartedProgress) * easeOutCubic((elapsed - finishStartedAt) / schedule.finish)
+        if (elapsed - finishStartedAt >= schedule.finish) {
+          progress = 100
+          requestStage('ready', elapsed)
+        } else {
+          requestStage(stageForProgress(progress), elapsed)
+        }
+      } else {
+        requestStage(stageForProgress(progress), elapsed)
+      }
+
+      updateProgress(progress)
+      if (readyStartedAt !== undefined) {
+        const earliestExit = Math.max(
+          readyStartedAt + schedule.readyHold,
+          schedule.minimum - schedule.exit - schedule.completePadding,
+        )
+        if (elapsed >= earliestExit) beginExit(elapsed)
+      }
+    }
+
+    advanceStageTransition(elapsed)
+
+    if (exitStartedAt !== undefined) {
+      if (!useReducedMotion && elapsed - exitStartedAt >= schedule.exitLead) {
+        overlay?.setAttribute('data-exiting', '')
+      }
+      const exitDuration = useReducedMotion ? schedule.reducedExit : schedule.exit
+      if (elapsed - exitStartedAt >= exitDuration + schedule.completePadding) {
+        cleanup()
+        return
+      }
+    }
+    if (elapsed >= schedule.watchdog) {
+      cleanup()
+      return
+    }
+    frame = requestFrame(tick)
+  }
+
+  function play({ reduced, waitForReady: shouldWait = false, readyWhen: isReady } = {}) {
+    if (overlay?.isConnected || !document?.body) return false
+    const template = document.createElement('template')
+    template.innerHTML = startupMarkup(prtsEmblem, rhodesEmblem).trim()
+    overlay = template.content.firstElementChild
+    if (!overlay) return false
+
+    startedAt = undefined
+    waitForReady = Boolean(shouldWait)
+    readyWhen = typeof isReady === 'function' ? isReady : undefined
+    hostReady = !waitForReady
+    finishStartedAt = undefined
+    readyStartedAt = undefined
+    exitStartedAt = undefined
+    timeoutStartedAt = undefined
+    currentStage = 'boot'
+    pendingStage = undefined
+    copyTransitionStartedAt = undefined
+    lastProgress = -1
+    useReducedMotion = reducedMotionRequested(reduced)
+
+    previousFocus = document.activeElement
+    document.body.appendChild(overlay)
+    promoteToTopLayer()
+    document.documentElement.setAttribute('data-prts-startup-active', '')
+    lockSiblings()
+    overlay.focus?.({ preventScroll: true })
+    document.addEventListener('visibilitychange', onVisibilityChange)
+
+    if (useReducedMotion) {
+      overlay.setAttribute('data-reduced-motion', '')
+      overlay.setAttribute('data-visible', '')
+      applyStage('visualOnline')
+      updateProgress(90)
+    }
+    frame = requestFrame(tick)
+    return true
+  }
+
+  return {
+    play,
+    ready() { hostReady = true },
+    stop: cleanup,
+    dispose: cleanup,
+    isActive: () => Boolean(overlay?.isConnected),
+  }
+}