@bongos/core 1.19.726 → 1.19.728

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (227) hide show
  1. package/.bongos-core.json +177 -492
  2. package/.devcontainer/Dockerfile +1 -1
  3. package/.devcontainer/devcontainer.json +2 -2
  4. package/.devcontainer/healthcheck.sh +1 -1
  5. package/.devcontainer/init-firewall.sh +1 -1
  6. package/.devcontainer/post-create.sh +2 -2
  7. package/.env.local.example +1 -1
  8. package/Dockerfile +1 -1
  9. package/docs/copy-inventory.md +1 -1
  10. package/docs/copy-registry.json +9 -9
  11. package/docs/module-api-changelog.md +4 -0
  12. package/docs/recipes/devbox-app-release.md +4 -4
  13. package/modules/dev-box/app/scripts/dmgbuild-settings.py +5 -5
  14. package/modules/dev-box/app/scripts/gen-brand.js +1 -1
  15. package/modules/dev-box/app/src/brand.js +1 -1
  16. package/modules/dev-box/app/test/unit.mjs +16 -16
  17. package/modules/dev-box/box-access.js +1 -1
  18. package/modules/dev-box/routes/box.js +1 -1
  19. package/modules/discord/discord-approvals.js +1 -1
  20. package/modules/grading/grader-model.js +1 -1
  21. package/modules/grading/grader-prompt.js +1 -1
  22. package/modules/grading/grader-workers/quality.js +1 -1
  23. package/modules/hall-ui/module.json +1 -1
  24. package/modules/hall-ui/public/brand-apply.js +1 -1
  25. package/modules/hall-ui/public/shell.js +1 -1
  26. package/modules/hall-ui/public/work.js +1 -1
  27. package/modules/lifecycle/conflict-resolve.js +1 -1
  28. package/modules/lifecycle/db-analytics.js +1 -1
  29. package/modules/lifecycle/routes/analytics.js +1 -1
  30. package/modules/onboarding/approval-broadcast.js +1 -1
  31. package/modules/onboarding/onboarding.js +1 -1
  32. package/modules/provisioning/tests/liveness.mjs +1 -1
  33. package/modules/public-landing/public/index.html +1 -1
  34. package/modules/public-landing/public/projects-floor.states.json +2 -2
  35. package/modules/public-landing/public/projects.probes.json +4 -4
  36. package/modules/public-landing/public/projects.states.json +2 -2
  37. package/modules/status-ui/module.json +1 -1
  38. package/modules/status-ui/public/status.js +4 -4
  39. package/modules/status-ui/public/style.css +1 -1
  40. package/modules/ui-design/kit/fixtures/cost-summary.json +1 -1
  41. package/modules/ui-design/kit/fixtures/featured-hub.json +1 -1
  42. package/modules/ui-design/kit/fixtures/featured.json +1 -1
  43. package/modules/ui-design/kit/fixtures/leaderboard.json +1 -1
  44. package/modules/ui-design/kit/fixtures/my-projects.json +1 -1
  45. package/modules/ui-design/kit/fixtures/progress.json +1 -1
  46. package/modules/ui-design/kit/fixtures/recent-shipped.json +1 -1
  47. package/package-lock.json +2 -2
  48. package/package.json +1 -1
  49. package/scripts/cron/style_guide_audit.sh +1 -1
  50. package/scripts/discord/lib.js +1 -1
  51. package/scripts/discord/post.js +1 -1
  52. package/scripts/gds/audit-authorship.sh +1 -1
  53. package/scripts/gds/audit-replay.sh +29 -2
  54. package/scripts/gds/audit-ships.js +1 -1
  55. package/scripts/gds/backfill-sessions.js +2 -2
  56. package/scripts/gds/cf-tunnel.js +4 -4
  57. package/scripts/gds/claude-materialize.js +2 -2
  58. package/scripts/gds/cli-lib.js +6 -6
  59. package/scripts/gds/cutover-codemod.js +1 -1
  60. package/scripts/gds/dev-lib.js +2 -2
  61. package/scripts/gds/diagnose-achievements.js +2 -2
  62. package/scripts/gds/fitness-checks-identity.js +6 -4
  63. package/scripts/gds/gen-diagrams.js +1 -1
  64. package/scripts/gds/leak-scan-allowlist.js +293 -0
  65. package/scripts/gds/learning-capture.js +1 -1
  66. package/scripts/gds/linkify-refs.js +2 -2
  67. package/scripts/gds/local-preview-lib.js +1 -1
  68. package/scripts/gds/mirror-lineage-check.js +1 -1
  69. package/scripts/gds/mirror-redact.js +17 -2
  70. package/scripts/gds/newcomer-floor.templates.json +1 -1
  71. package/scripts/gds/package-core.js +18 -1
  72. package/scripts/gds/paste-token.js +1 -1
  73. package/scripts/gds/provision-units.js +2 -2
  74. package/scripts/gds/publish-manifest.js +15 -0
  75. package/scripts/gds/repo-metrics.js +1 -1
  76. package/scripts/gds/sandbox-stage.js +1 -1
  77. package/scripts/gds/seed-bongos-coreB-tranche1-tasks.js +1 -1
  78. package/scripts/gds/seed-bongos-coreB-tranche2-tasks.js +1 -1
  79. package/scripts/gds/seed-bongos-goal-hierarchy-tasks.js +1 -1
  80. package/scripts/gds/seed-bongos-tasks.js +2 -2
  81. package/scripts/gds/seed-gds-v4-tasks.js +1 -1
  82. package/scripts/gds/seed-medusa-tasks.js +10 -10
  83. package/scripts/gds/seed-module-upstreaming.js +1 -1
  84. package/scripts/gds/seed-productization-tasks.js +6 -6
  85. package/scripts/gds/seed-provisioning-tasks.js +2 -2
  86. package/scripts/gds/seed-staging.sh +19 -6
  87. package/scripts/gds/ship-deploy-target.js +1 -1
  88. package/scripts/gds/ship-flow.js +1 -1
  89. package/scripts/gds/smoke-gds.js +1 -1
  90. package/scripts/status-probe.mjs +2 -2
  91. package/src/bongos/auth-discord.js +2 -2
  92. package/src/bongos/live-channel.js +1 -1
  93. package/src/bongos/pool.js +1 -1
  94. package/src/bongos/routes/auth.js +11 -11
  95. package/src/bongos/routes/security.js +1 -1
  96. package/src/bongos/routes.js +1 -1
  97. package/src/branding.js +1 -1
  98. package/src/devbox-downloads.js +1 -1
  99. package/src/instance-config.js +2 -2
  100. package/src/module-api.js +1 -1
  101. package/src/module-loader/provenance.js +2 -2
  102. package/tests/art_stage.mjs +2 -2
  103. package/tests/auth_anthropic_identity.mjs +1 -1
  104. package/tests/auth_duplicate_cookie.mjs +1 -1
  105. package/tests/auth_error_brand.mjs +1 -1
  106. package/tests/auth_inactive_builder.mjs +1 -1
  107. package/tests/backup_cli.mjs +4 -4
  108. package/tests/bongos_box_connect.mjs +2 -2
  109. package/tests/bongos_downloads.mjs +2 -2
  110. package/tests/bongos_login.mjs +5 -5
  111. package/tests/box_connect_e2e.mjs +2 -2
  112. package/tests/box_dns_repoint.mjs +10 -10
  113. package/tests/box_host_keys.mjs +1 -1
  114. package/tests/box_onboard.mjs +9 -9
  115. package/tests/box_scope_session.mjs +1 -1
  116. package/tests/box_terminal_ssrf.mjs +7 -7
  117. package/tests/boxes.mjs +9 -9
  118. package/tests/branding.mjs +2 -2
  119. package/tests/bump_version.mjs +2 -2
  120. package/tests/cf_tunnel.mjs +40 -40
  121. package/tests/cli_package.mjs +40 -1
  122. package/tests/cli_token_reissue.mjs +7 -7
  123. package/tests/cloud_bongos_pack.mjs +1 -1
  124. package/tests/currency_label.mjs +8 -8
  125. package/tests/dev_lib.mjs +4 -4
  126. package/tests/devbox_dmg_backdrop.mjs +1 -1
  127. package/tests/devbox_downloads.mjs +2 -2
  128. package/tests/devbox_icons.mjs +1 -1
  129. package/tests/discord_approvals.mjs +1 -1
  130. package/tests/discord_oauth.mjs +2 -2
  131. package/tests/executed_closure.mjs +6 -1
  132. package/tests/first_admin_bootstrap.mjs +1 -1
  133. package/tests/gate_approvals.mjs +5 -5
  134. package/tests/grade_aggregates_unavailable.mjs +1 -1
  135. package/tests/hook_user_agents.mjs +2 -2
  136. package/tests/init.mjs +6 -6
  137. package/tests/instance_config.mjs +1 -1
  138. package/tests/instance_manifest.mjs +5 -5
  139. package/tests/instance_mismatch_guard.mjs +13 -13
  140. package/tests/leak_scan_allowlist.mjs +94 -0
  141. package/tests/migrate_root_resolution.mjs +4 -4
  142. package/tests/mirror_redact.mjs +28 -4
  143. package/tests/module_catalog.mjs +5 -5
  144. package/tests/module_submissions.mjs +3 -3
  145. package/tests/package_core.mjs +1 -1
  146. package/tests/parallel-load.mjs +6 -6
  147. package/tests/projects_hub.mjs +2 -2
  148. package/tests/provision.mjs +50 -50
  149. package/tests/provisioning_github_app_routes.mjs +1 -1
  150. package/tests/provisioning_onboard_mode.mjs +2 -2
  151. package/tests/publish_reconciler.mjs +4 -4
  152. package/tests/sandbox_stage.mjs +1 -1
  153. package/tests/scrubber_corpus.mjs +3 -3
  154. package/tests/search_isolation.mjs +1 -1
  155. package/tests/session_records.mjs +1 -1
  156. package/tests/ship_card.mjs +6 -6
  157. package/tests/ship_ci_deploy.mjs +1 -1
  158. package/tests/single_host_hall.mjs +9 -9
  159. package/tests/smoke_preflight.mjs +1 -1
  160. package/tests/smoke_target.mjs +1 -1
  161. package/tests/status-probe.mjs +1 -1
  162. package/tests/status_mirror_sync.mjs +1 -1
  163. package/docs/adr/0004-amazonprimea-name-and-trademark-acceptance.md +0 -45
  164. package/docs/design/mocks/_schemes.css +0 -604
  165. package/docs/design/mocks/component-sheet.html +0 -428
  166. package/docs/design/mocks/hall/_tokens.css +0 -370
  167. package/docs/design/mocks/hall/board/v1.html +0 -846
  168. package/docs/design/mocks/hall/board/v2.html +0 -858
  169. package/docs/design/mocks/hall/board/v3.html +0 -884
  170. package/docs/design/mocks/hall/goals/v1.html +0 -1212
  171. package/docs/design/mocks/hall/goals/v2.html +0 -1192
  172. package/docs/design/mocks/hall/goals/v3.html +0 -1205
  173. package/docs/design/mocks/hall/hall-sheet.html +0 -244
  174. package/docs/design/mocks/hall/reading/v1.html +0 -1125
  175. package/docs/design/mocks/hall/reading/v2.html +0 -1177
  176. package/docs/design/mocks/hall/reading/v3.html +0 -1150
  177. package/docs/design/mocks/hall/settings/v1.html +0 -1238
  178. package/docs/design/mocks/hall/settings/v2.html +0 -1235
  179. package/docs/design/mocks/hall/settings/v3.html +0 -1299
  180. package/docs/design/mocks/hall/task/v1.html +0 -633
  181. package/docs/design/mocks/hall/task/v2.html +0 -646
  182. package/docs/design/mocks/hall/task/v3.html +0 -647
  183. package/docs/design/mocks/hub/assets/r3-space-deepfield-half.jpg +0 -0
  184. package/docs/design/mocks/hub/assets/r3-space-deepfield-half.jpg.json +0 -13
  185. package/docs/design/mocks/hub/assets/r3-space-dust-half.jpg +0 -0
  186. package/docs/design/mocks/hub/assets/r3-space-dust-half.jpg.json +0 -13
  187. package/docs/design/mocks/hub/assets/r3-space-nebula-half.jpg +0 -0
  188. package/docs/design/mocks/hub/assets/r3-space-nebula-half.jpg.json +0 -13
  189. package/docs/design/mocks/hub/assets/r3-space-starfield-half.jpg +0 -0
  190. package/docs/design/mocks/hub/assets/r3-space-starfield-half.jpg.json +0 -13
  191. package/docs/design/mocks/hub/hub-sheet.html +0 -192
  192. package/docs/design/mocks/hub/mine.html +0 -465
  193. package/docs/design/mocks/hub/picker.html +0 -421
  194. package/docs/design/mocks/hub/planets.html +0 -356
  195. package/docs/design/mocks/hub/v1.html +0 -1209
  196. package/docs/design/mocks/hub/v2.html +0 -1257
  197. package/docs/design/mocks/hub/v3.html +0 -1496
  198. package/docs/design/mocks/hub/wizard.html +0 -421
  199. package/docs/design/mocks/landing/landing-sheet.html +0 -131
  200. package/docs/design/mocks/landing/v1.html +0 -956
  201. package/docs/design/mocks/landing/v2.html +0 -708
  202. package/docs/design/mocks/landing/v3.html +0 -911
  203. package/docs/design/mocks/landing-page-mock.html +0 -687
  204. package/docs/design/mocks/landing-palettes.html +0 -103
  205. package/docs/design/mocks/projects-hub-mock.html +0 -991
  206. package/docs/design/mocks/projects-hub-variants.html +0 -146
  207. package/docs/design/mocks/projects-page-mock.html +0 -167
  208. package/docs/design/mocks/world/blue-hud/_tokens.css +0 -246
  209. package/docs/design/mocks/world/blue-hud/hall.html +0 -595
  210. package/docs/design/mocks/world/blue-hud/landing.html +0 -424
  211. package/docs/design/mocks/world/blue-hud/status.html +0 -410
  212. package/docs/design/mocks/world/chrome-blobs/_tokens.css +0 -479
  213. package/docs/design/mocks/world/chrome-blobs/hall.html +0 -553
  214. package/docs/design/mocks/world/chrome-blobs/landing-b.html +0 -581
  215. package/docs/design/mocks/world/chrome-blobs/landing.html +0 -328
  216. package/docs/design/mocks/world/chrome-blobs/status.html +0 -416
  217. package/docs/design/mocks/world/natgeo-editorial/_tokens.css +0 -377
  218. package/docs/design/mocks/world/natgeo-editorial/hall.html +0 -649
  219. package/docs/design/mocks/world/natgeo-editorial/landing-b.html +0 -743
  220. package/docs/design/mocks/world/natgeo-editorial/landing.html +0 -475
  221. package/docs/design/mocks/world/natgeo-editorial/status.html +0 -437
  222. package/docs/design/mocks/world/organic-cards/_tokens.css +0 -462
  223. package/docs/design/mocks/world/organic-cards/hall.html +0 -625
  224. package/docs/design/mocks/world/organic-cards/landing-b.html +0 -736
  225. package/docs/design/mocks/world/organic-cards/landing.html +0 -420
  226. package/docs/design/mocks/world/organic-cards/status.html +0 -458
  227. package/docs/design/mocks/world/world-sheet.html +0 -156
package/docs/design/mocks/hall/goals/v3.html DELETED
@@ -1,1205 +0,0 @@
1
- <!doctype html>
2
- <html lang="en" data-mode="dark" data-theme="dark">
3
- <head>
4
- <meta charset="utf-8">
5
- <meta name="viewport" content="width=device-width,initial-scale=1">
6
- <title>Goals: the hall in the world, v3 "the glass hall" (task 1003302)</title>
7
- <link rel="icon" href="data:,">
8
- <link rel="preconnect" href="https://fonts.googleapis.com">
9
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10
- <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400&family=Manrope:wght@300;400;500;600&display=swap">
11
- <link rel="stylesheet" href="../_tokens.css">
12
- <style>
13
- body{
14
- /* the composition tokens for THIS version live here, on body, never on :root.
15
- The rail is the sidebar's resting width at EVERY breakpoint; --open-w is what hover
16
- or focus-within reaches, and it overlays the content instead of pushing it. */
17
- --rail-w:64px;
18
- --open-w:248px;
19
- --rail-pad:24px;
20
- --gutter:26px;
21
- --pane-pad:32px;
22
- --row-pad:22px;
23
- --group-gap:40px;
24
- --figure:clamp(30px,3.6vw,48px);
25
- --title:clamp(24px,2.4vw,32px);
26
- --display:clamp(34px,5vw,64px);
27
- --ring:46px;
28
-
29
- margin:0;
30
- background:var(--bg);
31
- color:var(--ink);
32
- font-family:var(--font-body);
33
- font-size:15px;
34
- line-height:1.55;
35
- -webkit-font-smoothing:antialiased;
36
- }
37
- *{box-sizing:border-box}
38
-
39
- /* ---------- the ground: ONE rendered plate behind the whole shell, in dark only.
40
- --plate is `none` until the hall's own plate is shot, so this composes to the flat void,
41
- which is the honest fallback and exactly what light shows anyway. ---------- */
42
- .plate{position:fixed;inset:0;z-index:0;pointer-events:none;
43
- background-image:var(--plate);background-size:cover;background-position:center;mix-blend-mode:var(--plate-blend)}
44
- .plate-veil{position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--plate-veil)}
45
-
46
- /* ---------- the type voices ---------- */
47
- .lab{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
48
- .mono{font-family:var(--font-mono);font-size:12.5px;font-variant-numeric:tabular-nums}
49
- .num{font-variant-numeric:tabular-nums}
50
-
51
- /* ---------- focus: the world's two tone ring. ?state=focus paints the same treatment on four real
52
- controls that already carry .is-focus in the markup, so nothing is constructed and .focus() is never called ---------- */
53
- :focus-visible,body[data-state="focus"] .is-focus{outline:2px solid var(--focus);outline-offset:3px;box-shadow:0 0 0 8px var(--bg);border-radius:var(--radius-sm)}
54
- .skip{position:fixed;top:10px;left:10px;z-index:200;transform:translateY(-300%);background:var(--bg-card);color:var(--ink);
55
- border:var(--line) solid var(--rule);border-radius:var(--radius-pill);padding:11px 18px;text-decoration:none;transition:transform 200ms cubic-bezier(.2,.7,.3,1)}
56
- .skip:focus{transform:none}
57
-
58
- /* ---------- the shell: glass over the plate. The sidebar rests at the rail at EVERY width ---------- */
59
- .app-sidebar{position:fixed;inset:0 auto 0 0;width:var(--rail-w);display:flex;flex-direction:column;overflow:hidden;
60
- white-space:nowrap;z-index:var(--z-sidebar);
61
- background:var(--glass);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));
62
- border-right:var(--line) solid var(--glass-edge);
63
- transition:width 260ms cubic-bezier(.2,.7,.3,1)}
64
- .app-sidebar:hover,.app-sidebar:focus-within{width:var(--open-w)}
65
- .app-sidebar .nav-item__label,.app-sidebar .nav-group__head-label,.app-sidebar .nav-group__chevron,
66
- .app-sidebar .brand-mark__name,.app-sidebar .shell-user__meta{opacity:0;transition:opacity 200ms cubic-bezier(.2,.7,.3,1)}
67
- .app-sidebar:hover .nav-item__label,.app-sidebar:hover .nav-group__head-label,.app-sidebar:hover .nav-group__chevron,
68
- .app-sidebar:hover .brand-mark__name,.app-sidebar:hover .shell-user__meta,
69
- .app-sidebar:focus-within .nav-item__label,.app-sidebar:focus-within .nav-group__head-label,
70
- .app-sidebar:focus-within .nav-group__chevron,.app-sidebar:focus-within .brand-mark__name,
71
- .app-sidebar:focus-within .shell-user__meta{opacity:1}
72
- .app-sidebar__brand{height:var(--topbar-h);display:flex;align-items:center;flex:none;border-bottom:var(--line) solid var(--glass-edge)}
73
- .brand-mark{display:inline-flex;align-items:center;min-height:24px;color:var(--ink);text-decoration:none}
74
- .brand-mark__dot{width:14px;height:14px;margin:0 25px;border-radius:50%;border:1.5px solid var(--ink);flex:none}
75
- .brand-mark__name{font-weight:500;font-size:15px;letter-spacing:-.015em}
76
- .app-sidebar__nav{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:16px 0 22px}
77
- .nav-group+.nav-group{margin-top:14px;padding-top:14px;border-top:var(--line) solid var(--glass-edge)}
78
- .nav-group__head{display:flex;align-items:center;gap:8px;width:100%;min-height:26px;padding:0 var(--rail-pad);margin:0 0 5px;
79
- background:none;border:0;cursor:pointer;text-align:left;
80
- font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
81
- .nav-group__chevron{width:10px;height:6px;stroke:currentColor;fill:none;stroke-width:1.4;flex:none}
82
- .nav-item{text-transform:lowercase;display:flex;align-items:center;min-height:40px;color:var(--ink-soft);text-decoration:none;font-size:14.5px;
83
- border-left:2px solid transparent}
84
- .nav-item:hover{color:var(--ink)}
85
- .nav-item--active{color:var(--ink);background:var(--glass-strong);border-left-color:var(--accent)}
86
- .nav-icon{width:16px;height:16px;margin:0 var(--rail-pad) 0 calc(var(--rail-pad) - 2px);flex:none;
87
- stroke:currentColor;fill:none;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;color:var(--ink-faint)}
88
- .nav-item--active .nav-icon{color:var(--ink)}
89
- .app-sidebar__foot{flex:none;display:flex;flex-wrap:wrap;align-items:center;padding:12px 0;
90
- border-top:var(--line) solid var(--glass-edge)}
91
- .shell-user{display:flex;align-items:center;width:100%;min-height:40px;color:var(--ink);text-decoration:none}
92
- .shell-user__avatar{width:26px;height:26px;margin:0 19px;border-radius:50%;border:var(--line) solid var(--rule);background:var(--void-glass-strong);flex:none}
93
- .shell-user__meta{display:flex;flex-direction:column;min-width:0}
94
- .shell-user__name{font-size:13.5px;font-weight:500}
95
- .shell-user__rank{font-family:var(--label-face);font-size:10.5px;letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
96
- .shell-home,.shell-signout{display:inline-flex;align-items:center;justify-content:center;width:var(--rail-w);height:34px;color:var(--ink-faint)}
97
- .shell-home:hover,.shell-signout:hover{color:var(--ink)}
98
- .shell-home svg,.shell-signout svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
99
-
100
- .app-topbar{position:fixed;top:0;left:var(--rail-w);right:0;height:var(--topbar-h);z-index:var(--z-topbar);
101
- display:flex;align-items:center;gap:14px;padding:0 var(--gutter);
102
- background:var(--glass);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));
103
- border-bottom:var(--line) solid var(--glass-edge)}
104
- .topbar-menu{display:none;align-items:center;justify-content:center;width:34px;height:34px;background:none;border:0;color:var(--ink);cursor:pointer}
105
- .topbar-menu svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round}
106
- .topbar-title{margin:0;font-family:var(--font-display);font-weight:300;font-size:19px;letter-spacing:-.03em;text-transform:lowercase;color:var(--ink)}
107
- .topbar-side{margin-left:auto;display:flex;align-items:center;gap:12px}
108
- .topbar-note{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint);white-space:nowrap}
109
- .topbar-jump{display:inline-flex;align-items:center;gap:9px;height:34px;padding:0 14px;cursor:pointer;
110
- background:var(--glass);border:var(--line) solid var(--glass-edge);border-radius:var(--radius-pill);color:var(--ink-soft);font:inherit;font-size:13px}
111
- .topbar-jump:hover{color:var(--ink);border-color:var(--rule)}
112
- .topbar-jump__kbd{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-faint)}
113
- .zoom-toggle,.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;
114
- background:none;border:0;color:var(--ink-soft);cursor:pointer}
115
- .zoom-toggle:hover,.theme-toggle:hover{color:var(--ink)}
116
- .zoom-toggle svg,.theme-toggle svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
117
-
118
- .app-scrim{display:none;position:fixed;inset:0;background:rgba(0,0,0,.62);z-index:var(--z-scrim)}
119
- .app-content{position:relative;z-index:1;margin-left:var(--rail-w);padding:calc(var(--topbar-h) + 40px) var(--gutter) 110px;
120
- max-width:calc(var(--content-max) + var(--rail-w) + var(--gutter) * 2)}
121
-
122
- /* ---------- the content panels: bg-card at the full radius, on the glass ground ---------- */
123
- .pane{background:var(--bg-card);border:var(--line) solid var(--rule-soft);border-radius:var(--radius);padding:var(--pane-pad)}
124
-
125
- /* ---------- the head of the page, written straight on the ground above the first panel ---------- */
126
- .page-head{display:flex;align-items:baseline;gap:24px;flex-wrap:wrap;margin:0 0 12px}
127
- h1{margin:0;font-family:var(--font-display);font-weight:300;font-size:var(--display);letter-spacing:-.042em;text-transform:lowercase;line-height:.94;
128
- text-shadow:var(--type-halo)}
129
- .greeting{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
130
- .page-lede{margin:0 0 26px;color:var(--ink-soft);font-size:15.5px;max-width:62ch}
131
-
132
- /* ---------- the filter bar, inside the panel, bare fields under one hairline ---------- */
133
- .filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px 22px;padding:0 0 18px;border-bottom:var(--line) solid var(--rule-soft)}
134
- .field{display:flex;flex-direction:column;gap:6px;min-width:0}
135
- .field__lab{font-family:var(--label-face);font-size:10.5px;letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
136
- .field input,.field select{appearance:none;background:none;border:0;border-bottom:var(--line) solid var(--rule);
137
- color:var(--ink);font:inherit;font-size:14.5px;height:32px;padding:0 18px 0 0;min-width:110px;cursor:pointer}
138
- .field input{cursor:text;min-width:172px}
139
- .field input::placeholder{color:var(--ink-faint)}
140
- .field select:hover,.field input:hover{border-bottom-color:var(--ink-faint)}
141
- .viewtoggle{display:inline-flex;align-items:center;gap:3px;margin-left:auto;padding:3px;
142
- border:var(--line) solid var(--rule-soft);border-radius:var(--radius-pill)}
143
- .viewtoggle__btn{background:none;border:0;padding:0 18px;cursor:pointer;color:var(--ink-faint);font:inherit;font-size:13.5px;
144
- text-transform:lowercase;min-height:30px;min-width:60px;border-radius:var(--radius-pill)}
145
- .viewtoggle__btn:hover{color:var(--ink-soft)}
146
- .viewtoggle__btn[aria-pressed="true"]{color:var(--accent-on);background:var(--accent)}
147
-
148
- /* ---------- the readiness figures, on the panel, hairline separated ---------- */
149
- .count-line{margin:22px 0 0;font-family:var(--font-mono);font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}
150
- .argue{margin:10px 0 0;max-width:74ch;font-size:13.5px;color:var(--ink-soft)}
151
- .argue b{color:var(--ink);font-weight:600}
152
- .readiness{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:24px 0 0;padding:22px 0 0;border-top:var(--line) solid var(--rule-soft)}
153
- .stat{padding:0 24px 0 0}
154
- .stat+.stat{padding-left:24px;border-left:var(--line) solid var(--rule-soft)}
155
- .stat__lab{display:flex;align-items:center;gap:8px;font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
156
- .stat__mark{width:7px;height:7px;border-radius:50%;flex:none}
157
- .stat__fig{margin:12px 0 0;font-family:var(--font-display);font-weight:300;font-size:var(--figure);letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink)}
158
- .stat__foot{margin:8px 0 0;font-size:12.5px;color:var(--ink-faint)}
159
-
160
- /* ---------- the groups ---------- */
161
- .group{margin:var(--group-gap) 0 0}
162
- .group__head{display:flex;align-items:center;gap:12px;padding:0 0 10px;border-bottom:var(--line) solid var(--rule)}
163
- .group__name{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink)}
164
- .group__n{font-family:var(--font-mono);font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}
165
-
166
- /* ---------- v3 argues for ROWS. Loosest of the three: air, not edges ---------- */
167
- .goal{display:grid;grid-template-columns:var(--ring) minmax(0,1fr) auto;gap:24px;align-items:start;
168
- padding:var(--row-pad) 0;border-top:var(--line) solid var(--rule-soft)}
169
- .goal:first-of-type{border-top:0}
170
- .ring{width:var(--ring);height:var(--ring);display:block}
171
- .ring__track{fill:none;stroke:var(--rule);stroke-width:3}
172
- .ring__arc{fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round}
173
- .ring__txt{fill:var(--ink-soft);font-family:var(--font-mono);font-size:11px}
174
- .goal__title{display:inline-block;color:var(--ink);text-decoration:none;font-size:17px;font-weight:500;letter-spacing:-.014em;line-height:1.3;padding:1px 0;min-height:24px}
175
- .goal__title:hover{color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px}
176
- .goal__id{font-family:var(--font-mono);font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink-faint);margin-right:9px}
177
- .goal__sub{margin:5px 0 0;color:var(--ink-soft);font-size:14px;line-height:1.5;max-width:70ch}
178
- .goal__facts{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:12px 0 0}
179
- .chip{display:inline-flex;align-items:center;height:26px;padding:0 10px;border:var(--line) solid var(--rule-soft);border-radius:var(--radius-sm);
180
- font-family:var(--font-mono);font-size:11px;color:var(--ink-faint);white-space:nowrap}
181
- .chip--more{border-style:dashed}
182
- .status{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:var(--radius-pill);
183
- border:var(--line) solid currentColor;font-family:var(--label-face);font-size:10.5px;letter-spacing:var(--label-space);text-transform:var(--label-case)}
184
- .status--open{color:var(--info)}
185
- .status--blocked{color:var(--warn)}
186
- .status--achieved{color:var(--ok)}
187
- .status--archived{color:var(--ink-faint)}
188
- .roll{display:flex;flex-wrap:wrap;gap:8px 18px;margin:12px 0 0}
189
- .roll__d{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink-soft);font-variant-numeric:tabular-nums}
190
- .roll__d i{width:7px;height:7px;border-radius:50%;flex:none}
191
- .roll__d b{color:var(--ink);font-weight:600}
192
- .dot--ready{background:var(--ok)}
193
- .dot--active{background:var(--info)}
194
- .dot--blocked{background:var(--warn)}
195
- .dot--backlog{background:var(--ink-faint)}
196
- .goal__right{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right;max-width:244px}
197
- .goal__next{font-size:13px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:244px}
198
- .btn-accent{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 20px;border-radius:var(--radius-pill);
199
- border:0;background:var(--accent);color:var(--accent-on);font:inherit;font-size:13.5px;font-weight:500;text-transform:lowercase;text-decoration:none;cursor:pointer;
200
- transition:background 200ms cubic-bezier(.2,.7,.3,1)}
201
- .btn-accent:hover{background:var(--accent-lift)}
202
- .btn-ghost{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 18px;border-radius:var(--radius-pill);
203
- border:var(--line) solid var(--rule);background:none;color:var(--ink-soft);font:inherit;font-size:13.5px;text-transform:lowercase;cursor:pointer;
204
- transition:color 200ms cubic-bezier(.2,.7,.3,1)}
205
- .btn-ghost:hover{color:var(--ink);border-color:var(--ink-faint)}
206
- .tlink{display:inline-block;padding:3px 0;min-height:24px;color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px}
207
- .quiet{font-size:13px;color:var(--ink-faint)}
208
-
209
- /* ---------- achieved + archived render as compact pills in BOTH views ---------- */
210
- .pills{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0 0}
211
- .pill{display:inline-flex;align-items:center;gap:10px;min-height:34px;padding:0 15px;border-radius:var(--radius-pill);
212
- border:var(--line) solid var(--rule);color:var(--ink-soft);text-decoration:none;font-size:13px}
213
- .pill:hover{border-color:var(--ink-faint);color:var(--ink)}
214
- .pill b{color:var(--ink);font-weight:500}
215
- .pill__mark{width:16px;height:16px;flex:none;stroke:var(--ok);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
216
- .pills--muted .pill{color:var(--ink-faint)}
217
- .pills--muted .pill b{color:var(--ink-soft)}
218
- .pills--muted .pill__mark{stroke:var(--ink-faint)}
219
- .pill__id{font-family:var(--font-mono);font-size:11.5px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}
220
-
221
- /* ---------- the world's hairline between the two surfaces, drawn on the glass ground ---------- */
222
- .seam{margin:var(--sp-xl) 0 0;border:0;border-top:var(--line) solid var(--rule);height:0}
223
- .seam-lab{margin:14px 0 20px;font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
224
-
225
- /* ---------- the detail ---------- */
226
- .detail__head{display:flex;align-items:flex-start;gap:24px;flex-wrap:wrap}
227
- .detail__headmain{flex:1;min-width:280px}
228
- .detail__title{margin:0;font-family:var(--font-display);font-weight:300;font-size:var(--title);letter-spacing:-.03em;line-height:1.16;color:var(--ink)}
229
- .detail__title .goal__id{font-size:.5em;vertical-align:.36em}
230
- .detail__sub{margin:9px 0 0;color:var(--ink-soft);font-size:14.5px;line-height:1.55;max-width:72ch}
231
- .detail__actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
232
- .disclosure{margin:18px 0 0;max-width:72ch;border-top:var(--line) solid var(--rule-soft);padding-top:12px}
233
- .disclosure__btn{display:inline-flex;align-items:center;gap:8px;min-height:26px;background:none;border:0;padding:0;cursor:pointer;
234
- color:var(--ink-faint);font:inherit;font-size:12.5px;text-align:left}
235
- .disclosure__btn:hover{color:var(--ink-soft)}
236
- .disclosure__chev{width:9px;height:9px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform 200ms cubic-bezier(.2,.7,.3,1)}
237
- .disclosure__btn[aria-expanded="true"] .disclosure__chev{transform:rotate(90deg)}
238
- .disclosure__body{margin:12px 0 0;padding:0 0 0 16px;border-left:var(--line) solid var(--rule-soft);color:var(--ink-soft);font-size:13.5px;line-height:1.6}
239
- .disclosure__btn[aria-expanded="false"]+.disclosure__body{display:none}
240
- .detail__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:18px 0 0;font-size:13px;color:var(--ink-faint)}
241
-
242
- /* ---------- the three column band ---------- */
243
- .band{display:grid;grid-template-columns:1fr;margin:var(--sp-lg) 0 0;padding:var(--sp-lg) 0 0;border-top:var(--line) solid var(--rule)}
244
- .band__col{padding:0 0 26px;min-width:0}
245
- .band__col+.band__col{padding-top:26px;border-top:var(--line) solid var(--rule-soft)}
246
- @media (min-width:960px){
247
- .band{grid-template-columns:repeat(3,minmax(0,1fr))}
248
- .band__col{padding:0 26px 0}
249
- .band__col:first-child{padding-left:0}
250
- .band__col:last-child{padding-right:0}
251
- .band__col+.band__col{padding-top:0;border-top:0;border-left:var(--line) solid var(--rule-soft)}
252
- }
253
- .col__head{display:flex;align-items:center;gap:10px;margin:0 0 5px}
254
- .col__h{margin:0;font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink);font-weight:400}
255
- .count-pill{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:var(--radius-pill);
256
- border:var(--line) solid var(--rule);font-family:var(--font-mono);font-size:11px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}
257
- .col__lede{margin:7px 0 0;color:var(--ink-faint);font-size:12.5px;line-height:1.5}
258
- .col__foot{margin:14px 0 0}
259
-
260
- .crits{list-style:none;margin:16px 0 0;padding:0}
261
- .crit{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;padding:11px 0;border-top:var(--line) solid var(--rule-soft);font-size:13px}
262
- .crit:first-child{border-top:0;padding-top:0}
263
- .crit__mark{width:16px;height:16px;margin-top:2px;border-radius:50%;border:1.5px solid var(--rule);display:block}
264
- .crit--done .crit__mark{border-color:var(--ok);background:var(--ok)}
265
- .crit--pending .crit__mark{border-color:var(--warn)}
266
- .crit__key{font-family:var(--font-mono);font-size:12px;color:var(--ink)}
267
- .crit__detail{margin:5px 0 0;font-size:12.5px;color:var(--ink-faint);line-height:1.5}
268
-
269
- .invite{margin:16px 0 0}
270
- .invite__form{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:12px 0 0}
271
- .invite__form select{appearance:none;background:none;border:0;border-bottom:var(--line) solid var(--rule);color:var(--ink);font:inherit;font-size:13.5px;height:32px;flex:1;min-width:150px}
272
- .pending{margin:18px 0 0}
273
- .pending__h{display:flex;align-items:center;gap:8px;margin:0 0 4px;font-family:var(--label-face);font-size:10.5px;letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
274
- .pending__row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 0;border-top:var(--line) solid var(--rule-soft);font-size:13px}
275
- .pending__who{font-weight:500;color:var(--ink)}
276
- .pending__note{color:var(--ink-faint);font-size:12.5px;flex:1;min-width:80px}
277
- .pending__acts{display:flex;gap:8px}
278
- .btn-xs{display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:0 12px;border-radius:var(--radius-pill);
279
- border:var(--line) solid var(--rule);background:none;color:var(--ink-soft);font:inherit;font-size:12px;cursor:pointer}
280
- .btn-xs:hover{color:var(--ink);border-color:var(--ink-faint)}
281
- .members{list-style:none;margin:16px 0 0;padding:0}
282
- .member{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:var(--line) solid var(--rule-soft);font-size:13.5px}
283
- .member:first-child{border-top:0}
284
- .member__avatar{width:26px;height:26px;border-radius:50%;border:var(--line) solid var(--rule);background:var(--void-glass-strong);flex:none}
285
- .member__name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
286
- .member__name small{color:var(--ink-faint)}
287
- .member__pill{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--radius-pill);
288
- border:var(--line) solid var(--rule);font-family:var(--label-face);font-size:10px;letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
289
-
290
- .conflict{padding:14px 0;border-top:var(--line) solid var(--rule-soft);font-size:13px}
291
- .conflict:first-of-type{border-top:0;margin-top:14px}
292
- .conflict__pair{font-weight:500;color:var(--ink)}
293
- .conflict__sev{display:inline-flex;align-items:center;height:22px;padding:0 9px;margin-left:9px;border-radius:var(--radius-pill);
294
- border:var(--line) solid currentColor;font-family:var(--label-face);font-size:10px;letter-spacing:var(--label-space);text-transform:var(--label-case)}
295
- .conflict__sev--high{color:var(--danger)}
296
- .conflict__sev--medium{color:var(--warn)}
297
- .conflict__paths{margin:6px 0 0;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-faint);word-break:break-all;line-height:1.6}
298
-
299
- /* ---------- the tasks ---------- */
300
- .tasks{margin:var(--sp-lg) 0 0;padding:var(--sp-lg) 0 0;border-top:var(--line) solid var(--rule)}
301
- .tasks__head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
302
- .tabs{display:inline-flex;gap:3px;padding:3px;border:var(--line) solid var(--rule-soft);border-radius:var(--radius-pill)}
303
- .tab{background:none;border:0;padding:0 18px;cursor:pointer;color:var(--ink-faint);font:inherit;font-size:13.5px;
304
- text-transform:lowercase;min-height:30px;min-width:60px;border-radius:var(--radius-pill)}
305
- .tab:hover{color:var(--ink-soft)}
306
- .tab[aria-selected="true"]{color:var(--accent-on);background:var(--accent)}
307
- .tasks__bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px 24px;margin:20px 0 0;padding:0 0 16px;border-bottom:var(--line) solid var(--rule-soft)}
308
- .task{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:18px;align-items:start;padding:var(--row-pad) 0;border-top:var(--line) solid var(--rule-soft)}
309
- .task:first-of-type{border-top:0}
310
- .task__pick{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;margin-top:2px}
311
- .task__pick input{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin:0;cursor:pointer;position:relative;
312
- border:1.5px solid var(--rule);border-radius:6px;background:none}
313
- .task__pick input:checked{background:var(--accent);border-color:var(--accent)}
314
- .task__pick input:checked::after{content:"";position:absolute;left:8px;top:4px;width:5px;height:10px;
315
- border:solid var(--accent-on);border-width:0 2px 2px 0;transform:rotate(45deg)}
316
- .task__pick input:disabled{opacity:.42;cursor:not-allowed}
317
- .bulk button[disabled]{opacity:.42;pointer-events:none}
318
- .task__id{font-family:var(--font-mono);font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}
319
- .task__title{display:inline-block;padding:1px 0;min-height:24px;color:var(--ink);text-decoration:none;font-size:15.5px;font-weight:500;line-height:1.35}
320
- .task__title:hover{color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px}
321
- .task__tags{display:flex;flex-wrap:wrap;gap:8px 10px;margin:10px 0 0;align-items:center}
322
- .task__figs{display:flex;flex-wrap:wrap;gap:8px 20px;margin:10px 0 0;font-family:var(--font-mono);font-size:11.5px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}
323
- .task__figs b{color:var(--ink-soft);font-weight:400}
324
- .task__right{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right}
325
- .pri{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:var(--radius-sm);
326
- border:var(--line) solid currentColor;font-family:var(--font-mono);font-size:11px}
327
- .pri--p1{color:var(--danger)}
328
- .pri--p2{color:var(--warn)}
329
- .pri--p3{color:var(--ink-faint)}
330
-
331
- .ledger{width:100%;border-collapse:collapse;margin:20px 0 0;font-size:13.5px}
332
- .ledger th{text-align:left;padding:0 14px 10px 0;border-bottom:var(--line) solid var(--rule);
333
- font-family:var(--label-face);font-size:10.5px;font-weight:400;letter-spacing:var(--label-space);text-transform:var(--label-case);color:var(--ink-faint)}
334
- .ledger th button{display:inline-flex;align-items:center;gap:6px;min-height:24px;background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit}
335
- .ledger th button:hover{color:var(--ink)}
336
- .ledger td{padding:15px 14px 15px 0;border-bottom:var(--line) solid var(--rule-soft);color:var(--ink-soft)}
337
- .ledger td:first-child{font-family:var(--font-mono);font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}
338
- .ledger .num{color:var(--ink)}
339
-
340
- .bulk{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:22px 0 0;padding:14px 22px;
341
- background:var(--glass-strong);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));
342
- border:var(--line) solid var(--glass-edge);border-radius:var(--radius-pill)}
343
- .bulk__count{font-family:var(--font-mono);font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--ink-soft)}
344
- .bulk__acts{display:flex;gap:10px;margin-left:auto}
345
-
346
- /* ---------- the states ---------- */
347
- .s-loading,.s-empty,.s-error{display:none}
348
- body[data-state="loading"] .s-live,body[data-state="empty"] .s-live,body[data-state="error"] .s-live{display:none}
349
- body[data-state="loading"] .s-loading{display:block}
350
- body[data-state="empty"] .s-empty{display:block}
351
- body[data-state="error"] .s-error{display:block}
352
- .skel{background:var(--rule-soft);border-radius:3px;height:11px}
353
- .skel--fig{height:var(--figure);border-radius:5px}
354
- .skel--ring{width:var(--ring);height:var(--ring);border-radius:50%}
355
- .skel--title{height:16px}
356
- .notice{padding:34px 0 10px}
357
- .notice__h{margin:0;font-family:var(--font-display);font-weight:300;font-size:24px;letter-spacing:-.03em;color:var(--ink)}
358
- .notice__p{margin:10px 0 0;color:var(--ink-soft);font-size:14.5px;max-width:56ch}
359
- .notice__acts{margin:18px 0 0;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
360
- .notice--error .notice__h{color:var(--danger)}
361
-
362
- /* ---------- rail + drawer. The rail is already the resting state at every width, so ?state=rail is
363
- the page as it opens; ?state=drawer is where the expanded panel is shown standing still ---------- */
364
- body[data-state="rail"] .app-sidebar:hover,
365
- body[data-state="rail"] .app-sidebar:focus-within{width:var(--rail-w)}
366
- body[data-state="drawer"] .app-sidebar .nav-item__label,body[data-state="drawer"] .app-sidebar .nav-group__head-label,
367
- body[data-state="drawer"] .app-sidebar .nav-group__chevron,body[data-state="drawer"] .app-sidebar .brand-mark__name,
368
- body[data-state="drawer"] .app-sidebar .shell-user__meta{opacity:1}
369
- body[data-state="drawer"] .app-scrim{display:block}
370
- body[data-state="drawer"] .app-sidebar{width:var(--open-w);z-index:var(--z-drawer);
371
- background:var(--bg-card);backdrop-filter:none;-webkit-backdrop-filter:none;border-right-color:var(--rule-soft)}
372
-
373
- @media (max-width:1024px){
374
- .app-sidebar{transform:translateX(-100%)}
375
- .app-topbar{left:0}
376
- .app-content{margin-left:0}
377
- .topbar-menu{display:inline-flex}
378
- body[data-state="drawer"] .app-sidebar,
379
- body[data-state="rail"] .app-sidebar{transform:none}
380
- body[data-state="rail"] .app-topbar,
381
- body[data-state="rail"] .app-content{left:var(--rail-w)}
382
- body[data-state="rail"] .app-content{margin-left:var(--rail-w)}
383
- }
384
- @media (max-width:900px){
385
- body{--gutter:18px;--pane-pad:20px;--row-pad:18px}
386
- .readiness{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:24px}
387
- .stat:nth-child(3){padding-left:0;border-left:0}
388
- .goal{grid-template-columns:36px minmax(0,1fr);row-gap:14px;--ring:36px}
389
- .goal__right{grid-column:1/-1;align-items:flex-start;text-align:left;max-width:100%}
390
- .goal__next{max-width:100%}
391
- .task{grid-template-columns:24px minmax(0,1fr);row-gap:14px}
392
- .task__right{grid-column:2/-1;align-items:flex-start;text-align:left}
393
- .topbar-note,.topbar-jump__label{display:none}
394
- .viewtoggle{margin-left:0}
395
- }
396
- </style>
397
- <script>
398
- (function(){try{var q=new URLSearchParams(location.search||location.hash.slice(1)||'').get('mode');
399
- var m=(q==='light'||q==='dark')?q:'dark';
400
- document.documentElement.setAttribute('data-mode',m);
401
- document.documentElement.setAttribute('data-theme',m);}catch(e){}})();
402
- </script>
403
- </head>
404
- <body class="mock" data-state="populated">
405
- <!--
406
- Goals in the chrome world, v3 "the glass hall" (task 1003302, goal 1000081).
407
- THESIS the hall gets a ground: one rendered plate under the whole shell in dark, glass chrome over it, content on
408
- bg-card panels at the full radius, and a 64px rail instead of a sidebar at every width.
409
- COMPOSITION the first viewport is the rail, the glass bar, then the h1 and its greeting written straight on the ground,
410
- and one rounded panel holding the filter row, four readiness figures and Active as ROWS. The detail follows
411
- in a second panel below the world's seam, so the glass ground shows between them.
412
- LIGHT no plate and no veil: light is the same room on paper, the glass falls back to a 5 percent ink tint with
413
- zero blur, and the panels read as near white sheets. A black panel never appears on a light page.
414
- RISK a photographic ground under 27 dense pages costs legibility and adds a per page cost the other two do not
415
- have, and the rail trades discoverability for calm: a newcomer cannot read the IA without hovering.
416
- ?state=populated the page with real data
417
- ?state=loading skeletons in the SHAPE of the final content
418
- ?state=empty nothing to show yet
419
- ?state=error the feed failed
420
- ?state=rail the sidebar collapsed to its 64px rail (already the resting width here, so the hover expansion is pinned shut)
421
- ?state=drawer the mobile drawer open (the expanded panel, held still, over the scrim)
422
- ?state=focus keyboard focus rings on the page's real controls
423
- -->
424
-
425
- <div class="plate" aria-hidden="true"></div>
426
- <div class="plate-veil" aria-hidden="true"></div>
427
- <a class="skip" href="#main">Skip to content</a>
428
-
429
- <div class="app-sidebar" id="app-sidebar">
430
- <div class="app-sidebar__brand">
431
- <a class="brand-mark" href="/" id="brand-mark">
432
- <span class="brand-mark__dot"></span><span class="brand-mark__name">Cloud Bongos</span></a>
433
- </div>
434
- <nav class="app-sidebar__nav" aria-label="Primary">
435
- <div class="nav-group">
436
- <a class="nav-item" id="nav-home" href="/" data-gate="always">
437
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M2.5 7.2 8 2.6l5.5 4.6V13H2.5z"/></svg>
438
- <span class="nav-item__label">Home</span></a>
439
- <a class="nav-item" id="nav-roadmap" href="/roadmap" data-gate="always">
440
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M2.5 12.5l3.5-4 3 2.6 4.5-6"/></svg>
441
- <span class="nav-item__label">Roadmap</span></a>
442
- <a class="nav-item nav-item--active is-focus" id="nav-goals" href="/goals" data-gate="always" aria-current="page">
443
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="5.5"/><circle cx="8" cy="8" r="1.6"/></svg>
444
- <span class="nav-item__label">Goals</span></a>
445
- <a class="nav-item" id="nav-work" href="/work" data-gate="always">
446
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="2.5" y="3.5" width="11" height="9"/><path d="M2.5 6.5h11"/></svg>
447
- <span class="nav-item__label">Tasks</span></a>
448
- <a class="nav-item" id="nav-ideas" href="/ideas" data-gate="always">
449
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M8 2.2a4 4 0 0 1 2.4 7.2v1.4h-4.8V9.4A4 4 0 0 1 8 2.2z"/><path d="M6.6 13.3h2.8"/></svg>
450
- <span class="nav-item__label">Ideas</span></a>
451
- <a class="nav-item" id="nav-copy-desk" href="/copy-desk" data-gate="always">
452
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M4 2.5h5l3 3v8H4z"/><path d="M9 2.5v3h3"/></svg>
453
- <span class="nav-item__label">Copy desk</span></a>
454
- </div>
455
- <div class="nav-group nav-group--collapsible" data-group="you">
456
- <button class="nav-group__head" data-gate="signed" data-group="you" aria-expanded="true" aria-controls="nav-items-you">
457
- <span class="nav-group__head-label">You</span>
458
- <svg class="nav-group__chevron" viewBox="0 0 10 6" aria-hidden="true"><path d="M1 1.4 5 4.8 9 1.4"/></svg></button>
459
- <div id="nav-items-you">
460
- <a class="nav-item" id="nav-standing" href="/#standing" data-gate="signed">
461
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M3.5 13V9M8 13V4M12.5 13V7"/></svg>
462
- <span class="nav-item__label">Standing</span></a>
463
- <a class="nav-item" id="nav-profile" href="/profile" data-gate="signed">
464
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="5.6" r="2.5"/><path d="M3.2 13.4c0-2.7 2.2-4 4.8-4s4.8 1.3 4.8 4"/></svg>
465
- <span class="nav-item__label">Profile</span></a>
466
- </div>
467
- </div>
468
- <div class="nav-group nav-group--collapsible" data-group="community">
469
- <button class="nav-group__head" data-gate="signed" data-group="community" aria-expanded="true" aria-controls="nav-items-community">
470
- <span class="nav-group__head-label">Community</span>
471
- <svg class="nav-group__chevron" viewBox="0 0 10 6" aria-hidden="true"><path d="M1 1.4 5 4.8 9 1.4"/></svg></button>
472
- <div id="nav-items-community">
473
- <a class="nav-item" id="nav-collab" href="/collab" data-gate="signed">
474
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="6.2" cy="8" r="3.4"/><circle cx="9.8" cy="8" r="3.4"/></svg>
475
- <span class="nav-item__label">Collab</span></a>
476
- <a class="nav-item" id="nav-leaderboard" href="/#leaderboard" data-gate="signed">
477
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M5.6 13.4V7h4.8v6.4M2.4 13.4v-3.2h3.2M10.4 13.4V4.6h3.2v8.8"/></svg>
478
- <span class="nav-item__label">Leaderboard</span></a>
479
- <a class="nav-item" id="nav-people" href="/people" data-gate="signed">
480
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="6" cy="6" r="2.3"/><path d="M2.4 13c0-2.2 1.6-3.5 3.6-3.5S9.6 10.8 9.6 13"/><path d="M11 6.4a1.8 1.8 0 1 1 .9 3.3c1 .4 1.7 1.4 1.7 3.3"/></svg>
481
- <span class="nav-item__label">People</span></a>
482
- </div>
483
- </div>
484
- <div class="nav-group nav-group--collapsible" data-group="docs">
485
- <button class="nav-group__head" data-gate="always" data-group="docs" aria-expanded="true" aria-controls="nav-items-docs">
486
- <span class="nav-group__head-label">Docs</span>
487
- <svg class="nav-group__chevron" viewBox="0 0 10 6" aria-hidden="true"><path d="M1 1.4 5 4.8 9 1.4"/></svg></button>
488
- <div id="nav-items-docs">
489
- <a class="nav-item" id="nav-primer" href="/primer" data-gate="always">
490
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M8 4.5C6.8 3.4 4.9 3.2 2.6 3.6v8c2.3-.4 4.2-.2 5.4.9 1.2-1.1 3.1-1.3 5.4-.9v-8c-2.3-.4-4.2-.2-5.4.9zM8 4.5v8"/></svg>
491
- <span class="nav-item__label">Primer</span></a>
492
- <a class="nav-item" id="nav-ranks" href="/ranks" data-gate="always">
493
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M4 6.6 8 3.2l4 3.4M4 11.6 8 8.2l4 3.4"/></svg>
494
- <span class="nav-item__label">Ranks</span></a>
495
- <a class="nav-item" id="nav-economy" href="/drachmae" data-gate="always">
496
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="5.5"/><path d="M8 4.8v6.4M6.3 6.4h3.4M6.3 9.4h3.4"/></svg>
497
- <span class="nav-item__label">Economy</span></a>
498
- <a class="nav-item" id="nav-diagrams" href="/diagrams" data-gate="always">
499
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="2.4" y="2.6" width="4.6" height="4"/><rect x="9" y="9.4" width="4.6" height="4"/><path d="M4.7 6.6v4.8h4.3"/></svg>
500
- <span class="nav-item__label">Diagrams</span></a>
501
- <a class="nav-item" id="nav-atlas" href="/atlas" data-gate="always">
502
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="5.5"/><path d="M2.5 8h11M8 2.5c1.9 2.2 1.9 8.8 0 11M8 2.5c-1.9 2.2-1.9 8.8 0 11"/></svg>
503
- <span class="nav-item__label">Repo Atlas</span></a>
504
- <a class="nav-item" id="nav-modules" href="/modules" data-gate="always">
505
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="2.4" y="2.4" width="5" height="5"/><rect x="8.6" y="2.4" width="5" height="5"/><rect x="2.4" y="8.6" width="5" height="5"/><rect x="8.6" y="8.6" width="5" height="5"/></svg>
506
- <span class="nav-item__label">Modules</span></a>
507
- <a class="nav-item" id="nav-apidocs" href="/docs" data-gate="always">
508
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M6 3.4 3 8l3 4.6M10 3.4 13 8l-3 4.6"/></svg>
509
- <span class="nav-item__label">API docs</span></a>
510
- </div>
511
- </div>
512
- <div class="nav-group nav-group--collapsible" data-group="government">
513
- <button class="nav-group__head" data-gate="signed" data-group="government" aria-expanded="true" aria-controls="nav-items-government">
514
- <span class="nav-group__head-label">Government</span>
515
- <svg class="nav-group__chevron" viewBox="0 0 10 6" aria-hidden="true"><path d="M1 1.4 5 4.8 9 1.4"/></svg></button>
516
- <div id="nav-items-government">
517
- <a class="nav-item" id="nav-watch" href="/watch" data-gate="signed">
518
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M1.8 8S4.2 4.2 8 4.2 14.2 8 14.2 8 11.8 11.8 8 11.8 1.8 8 1.8 8z"/><circle cx="8" cy="8" r="1.8"/></svg>
519
- <span class="nav-item__label">Watch</span></a>
520
- <a class="nav-item" id="nav-harbor" href="/harbor" data-gate="signed">
521
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="3.4" r="1.4"/><path d="M8 5v8.2M4.6 7h6.8M2.9 10c.6 2.2 2.6 3.4 5.1 3.4s4.5-1.2 5.1-3.4"/></svg>
522
- <span class="nav-item__label">Harbor</span></a>
523
- <a class="nav-item" id="nav-gate" href="/gate" data-gate="signed">
524
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M2.6 13.4V5L8 2.4 13.4 5v8.4M6 13.4V8.6h4v4.8"/></svg>
525
- <span class="nav-item__label">Gate</span></a>
526
- <a class="nav-item" id="nav-sessions" href="/sessions" data-gate="signed">
527
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="5.5"/><path d="M8 4.8V8l2.4 1.6"/></svg>
528
- <span class="nav-item__label">Sessions</span></a>
529
- <a class="nav-item" id="nav-government" href="/government" data-gate="signed">
530
- <svg class="nav-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M8 2.2 13.2 4.2v3.9c0 3.2-2.5 5-5.2 5.7-2.7-.7-5.2-2.5-5.2-5.7V4.2z"/></svg>
531
- <span class="nav-item__label">Permissions</span></a>
532
- </div>
533
- </div>
534
- </nav>
535
- <div class="app-sidebar__foot">
536
- <a class="shell-user" id="shell-user" href="/settings" title="Settings">
537
- <span class="shell-user__avatar"></span>
538
- <span class="shell-user__meta">
539
- <span class="shell-user__name">Percy Jackson</span>
540
- <span class="shell-user__rank">Owner</span></span></a>
541
- <a class="shell-home" href="/" title="Back to Cloud Bongos">
542
- <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M2.5 7.2 8 2.6l5.5 4.6V13H2.5z"/></svg></a>
543
- <a class="shell-signout" href="/api/bongos/auth/logout" title="Sign out">
544
- <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M6.4 2.6H3.2v10.8h3.2M9.6 5.4 12.4 8l-2.8 2.6M12.4 8H6.6"/></svg></a>
545
- </div>
546
- </div>
547
-
548
- <div class="app-scrim" id="app-scrim"></div>
549
-
550
- <header class="app-topbar" id="app-topbar">
551
- <button class="topbar-menu" id="topbar-menu" aria-label="Open navigation" aria-expanded="false" aria-controls="app-sidebar">
552
- <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M2.5 4.5h11M2.5 8h11M2.5 11.5h11"/></svg></button>
553
- <h2 class="topbar-title">Goals</h2>
554
- <div class="topbar-side">
555
- <span class="topbar-note">BONGOS-V1 · 1176 of 1612 shipped</span>
556
- <button class="topbar-jump" id="topbar-jump" aria-label="Jump to a page or record">
557
- <span class="topbar-jump__label">Jump to</span><kbd class="topbar-jump__kbd">Ctrl K</kbd></button>
558
- <button class="zoom-toggle" aria-label="Text size">
559
- <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M2 12.5 5.6 3.5l3.6 9M3.2 9.6h4.8M10.6 12.5l2.4-6 2.4 6M11.4 10.6h3.2"/></svg></button>
560
- <button class="theme-toggle" aria-label="Switch theme">
561
- <svg viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="3.4"/><path d="M8 1.4v1.6M8 13v1.6M1.4 8H3M13 8h1.6M3.4 3.4l1.1 1.1M11.5 11.5l1.1 1.1M12.6 3.4l-1.1 1.1M4.5 11.5l-1.1 1.1"/></svg></button>
562
- </div>
563
- </header>
564
-
565
- <main class="app-content" id="main">
566
-
567
- <div class="page-head">
568
- <h1>goals</h1>
569
- <span class="greeting">Good morning, Percy</span>
570
- </div>
571
- <p class="page-lede">Every shared goal on this instance, grouped by whether it can move. A goal is the module scoped
572
- workspace between a version and its criteria: the wall that bounds where its tasks may write.</p>
573
-
574
- <!-- ============ THE LIST ============ -->
575
- <section class="pane" aria-labelledby="list-h">
576
- <h2 id="list-h" class="lab" style="margin:0 0 16px">All goals</h2>
577
-
578
- <div class="filters">
579
- <div class="field">
580
- <label class="field__lab" for="f-goals-search">Search</label>
581
- <input class="is-focus" id="f-goals-search" type="search" placeholder="goal # or name" value="">
582
- </div>
583
- <div class="field">
584
- <label class="field__lab" for="f-goal-version">Version</label>
585
- <select id="f-goal-version"><option>any</option><option>BONGOS-V1</option><option>CB-V1</option></select>
586
- </div>
587
- <div class="field">
588
- <label class="field__lab" for="f-goal-status">Status</label>
589
- <select id="f-goal-status"><option>any</option><option>open</option><option>achieved</option><option>archived</option></select>
590
- </div>
591
- <div class="field">
592
- <label class="field__lab" for="f-goal-mine">Membership</label>
593
- <select id="f-goal-mine"><option>All goals</option><option>My goals</option></select>
594
- </div>
595
- <div class="field">
596
- <label class="field__lab" for="f-goal-owner">Owner</label>
597
- <select id="f-goal-owner"><option>any</option><option>lars589</option><option>Percy Jackson</option><option>IAMMASTERQUA</option></select>
598
- </div>
599
- <div class="field">
600
- <label class="field__lab" for="f-goal-order">Sort</label>
601
- <select id="f-goal-order"><option>priority</option><option>recently active</option><option>newest first</option><option>stalest first</option></select>
602
- </div>
603
- <div class="viewtoggle" role="group" aria-label="View">
604
- <button type="button" class="viewtoggle__btn" id="f-goal-view-rows" aria-pressed="true">rows</button>
605
- <button type="button" class="viewtoggle__btn is-focus" id="f-goal-view-cards" aria-pressed="false">cards</button>
606
- </div>
607
- </div>
608
-
609
- <!-- populated ------------------------------------------------------ -->
610
- <div class="s-live">
611
- <p class="count-line" aria-live="polite">12 goals · 8 open · 3 achieved · 1 archived</p>
612
- <p class="argue"><b>This version argues for rows, and opens on them.</b> A goal carries seven facts,
613
- id, name, subtitle, scope, version, status and a criteria roll-up, and then a counter line of up to four
614
- readiness buckets. A 292px card drops two of them and still wraps the name onto three lines. The toggle stays,
615
- because a card wall is the better read when someone is scanning for a name rather than for what can move, but
616
- both views draw from one fact source, so nothing a card shows is missing from a row.</p>
617
-
618
- <div class="readiness">
619
- <div class="stat">
620
- <span class="stat__lab"><span class="stat__mark dot--ready"></span>Ready to claim</span>
621
- <p class="stat__fig">23</p>
622
- <p class="stat__foot">across 6 active goals</p>
623
- </div>
624
- <div class="stat">
625
- <span class="stat__lab"><span class="stat__mark dot--active"></span>In progress</span>
626
- <p class="stat__fig">6</p>
627
- <p class="stat__foot">held by 4 builders</p>
628
- </div>
629
- <div class="stat">
630
- <span class="stat__lab"><span class="stat__mark dot--blocked"></span>Blocked</span>
631
- <p class="stat__fig">16</p>
632
- <p class="stat__foot">waiting on upstream tasks</p>
633
- </div>
634
- <div class="stat">
635
- <span class="stat__lab">Criteria satisfied</span>
636
- <p class="stat__fig">12 / 35</p>
637
- <p class="stat__foot">on the 8 open goals</p>
638
- </div>
639
- </div>
640
-
641
- <!-- Active -->
642
- <div class="group">
643
- <div class="group__head"><span class="group__name">Active</span><span class="group__n">6</span></div>
644
-
645
- <div class="goal">
646
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="0 of 3 criteria satisfied">
647
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
648
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="0 100.5" transform="rotate(-90 21 21)"></circle>
649
- <text class="ring__txt" x="21" y="25" text-anchor="middle">0/3</text></svg>
650
- <div>
651
- <a class="goal__title is-focus" href="#/goal/1000081"><span class="goal__id">#1000081</span>Builders' hall in the world</a>
652
- <p class="goal__sub">The 27-page hall adopts the apex world: five archetype mocks, one shell, every page family re-skinned.</p>
653
- <div class="goal__facts">
654
- <span class="status status--open">open</span><span class="chip">hall-ui</span><span class="chip">BONGOS-V1</span>
655
- </div>
656
- <div class="roll">
657
- <span class="roll__d"><i class="dot--active"></i><b>1</b> in progress</span>
658
- <span class="roll__d"><i class="dot--backlog"></i><b>7</b> backlog</span>
659
- </div>
660
- </div>
661
- <div class="goal__right">
662
- <span class="goal__next">Nothing claimable yet</span>
663
- <a class="tlink" href="#/goal/1000081">See all 8 tasks</a>
664
- </div>
665
- </div>
666
-
667
- <div class="goal">
668
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="2 of 4 criteria satisfied">
669
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
670
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="50.3 50.3" transform="rotate(-90 21 21)"></circle>
671
- <text class="ring__txt" x="21" y="25" text-anchor="middle">2/4</text></svg>
672
- <div>
673
- <a class="goal__title" href="#/goal/1000063"><span class="goal__id">#1000063</span>The front door</a>
674
- <p class="goal__sub">The apex landing and the project hub, in the chrome world, on one token tier.</p>
675
- <div class="goal__facts">
676
- <span class="status status--open">open</span><span class="chip">public-landing</span><span class="chip">BONGOS-V1</span>
677
- </div>
678
- <div class="roll">
679
- <span class="roll__d"><i class="dot--ready"></i><b>3</b> ready</span>
680
- <span class="roll__d"><i class="dot--active"></i><b>2</b> in progress</span>
681
- <span class="roll__d"><i class="dot--backlog"></i><b>4</b> backlog</span>
682
- </div>
683
- </div>
684
- <div class="goal__right">
685
- <span class="goal__next">Project settings: the card's backdrop</span>
686
- <a class="btn-accent" href="#/task/1003352">claim next</a>
687
- </div>
688
- </div>
689
-
690
- <div class="goal">
691
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="4 of 9 criteria satisfied">
692
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
693
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="44.7 55.9" transform="rotate(-90 21 21)"></circle>
694
- <text class="ring__txt" x="21" y="25" text-anchor="middle">4/9</text></svg>
695
- <div>
696
- <a class="goal__title" href="#/goal/1000075"><span class="goal__id">#1000075</span>Collaboration &amp; the social hall</a>
697
- <p class="goal__sub">Goals, membership, invitations and the people surfaces that let two builders share one wall.</p>
698
- <div class="goal__facts">
699
- <span class="status status--open">open</span><span class="chip">builder-settings</span><span class="chip">hall-ui</span><span class="chip">kernel</span><span class="chip chip--more">+3</span>
700
- </div>
701
- <div class="roll">
702
- <span class="roll__d"><i class="dot--ready"></i><b>6</b> ready</span>
703
- <span class="roll__d"><i class="dot--active"></i><b>2</b> in progress</span>
704
- <span class="roll__d"><i class="dot--blocked"></i><b>3</b> blocked</span>
705
- </div>
706
- </div>
707
- <div class="goal__right">
708
- <span class="goal__next">Goal invitations: the pending inbox</span>
709
- <a class="btn-accent" href="#/task/1002971">claim next</a>
710
- </div>
711
- </div>
712
-
713
- <div class="goal">
714
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="0 of 2 criteria satisfied">
715
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
716
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="0 100.5" transform="rotate(-90 21 21)"></circle>
717
- <text class="ring__txt" x="21" y="25" text-anchor="middle">0/2</text></svg>
718
- <div>
719
- <a class="goal__title" href="#/goal/1000064"><span class="goal__id">#1000064</span>The hall as the room</a>
720
- <p class="goal__sub">The hall stops being a dashboard and becomes the place the build happens, with Discord as its mirror.</p>
721
- <div class="goal__facts">
722
- <span class="status status--open">open</span><span class="chip">hall-ui</span><span class="chip">discord</span><span class="chip">BONGOS-V1</span>
723
- </div>
724
- <div class="roll">
725
- <span class="roll__d"><i class="dot--ready"></i><b>4</b> ready</span>
726
- <span class="roll__d"><i class="dot--blocked"></i><b>1</b> blocked</span>
727
- </div>
728
- </div>
729
- <div class="goal__right">
730
- <span class="goal__next">The hall's own plate: shoot it</span>
731
- <span class="goal__next">Nothing claimable yet</span>
732
- </div>
733
- </div>
734
-
735
- <div class="goal">
736
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="1 of 3 criteria satisfied">
737
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
738
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="33.5 67" transform="rotate(-90 21 21)"></circle>
739
- <text class="ring__txt" x="21" y="25" text-anchor="middle">1/3</text></svg>
740
- <div>
741
- <a class="goal__title" href="#/goal/1000083"><span class="goal__id">#1000083</span>The ui-design module</a>
742
- <p class="goal__sub">The mock kit, the check, the render and the probe, carved into a module any instance can adopt.</p>
743
- <div class="goal__facts">
744
- <span class="status status--open">open</span><span class="chip">ui-design</span><span class="chip">BONGOS-V1</span>
745
- </div>
746
- <div class="roll">
747
- <span class="roll__d"><i class="dot--ready"></i><b>3</b> ready</span>
748
- <span class="roll__d"><i class="dot--active"></i><b>1</b> in progress</span>
749
- </div>
750
- </div>
751
- <div class="goal__right">
752
- <span class="goal__next">check-mock: the contrast pass</span>
753
- <a class="btn-accent" href="#/task/1003321">claim next</a>
754
- </div>
755
- </div>
756
-
757
- <div class="goal">
758
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="0 of 2 criteria satisfied">
759
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
760
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="0 100.5" transform="rotate(-90 21 21)"></circle>
761
- <text class="ring__txt" x="21" y="25" text-anchor="middle">0/2</text></svg>
762
- <div>
763
- <a class="goal__title" href="#/goal/1000082"><span class="goal__id">#1000082</span>Status ledger in the world</a>
764
- <p class="goal__sub">The public status dashboard adopts the same token tier, so the outside view and the hall are one room.</p>
765
- <div class="goal__facts">
766
- <span class="status status--open">open</span><span class="chip">status-ui</span><span class="chip">BONGOS-V1</span>
767
- </div>
768
- <div class="roll">
769
- <span class="roll__d"><i class="dot--ready"></i><b>2</b> ready</span>
770
- </div>
771
- </div>
772
- <div class="goal__right">
773
- <span class="goal__next">The pillars, re-cut as hairlines</span>
774
- <a class="btn-accent" href="#/task/1003330">claim next</a>
775
- </div>
776
- </div>
777
- </div>
778
-
779
- <!-- Blocked -->
780
- <div class="group">
781
- <div class="group__head"><span class="group__name">Blocked</span><span class="group__n">2</span></div>
782
-
783
- <div class="goal">
784
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="0 of 6 criteria satisfied">
785
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
786
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="0 100.5" transform="rotate(-90 21 21)"></circle>
787
- <text class="ring__txt" x="21" y="25" text-anchor="middle">0/6</text></svg>
788
- <div>
789
- <a class="goal__title" href="#/goal/1000084"><span class="goal__id">#1000084</span>Execution integrity and tenant isolation</a>
790
- <p class="goal__sub">One instance may never read or write another's rows, files or secrets, and the pipeline must prove it did not.</p>
791
- <div class="goal__facts">
792
- <span class="status status--blocked">blocked</span><span class="chip">kernel</span><span class="chip">sessions</span><span class="chip">lifecycle</span><span class="chip">provisioning</span><span class="chip chip--more">+6</span>
793
- </div>
794
- <div class="roll">
795
- <span class="roll__d"><i class="dot--blocked"></i><b>9</b> blocked</span>
796
- </div>
797
- </div>
798
- <div class="goal__right">
799
- <a class="tlink" href="#/goal/1000084">See what is blocking</a>
800
- </div>
801
- </div>
802
-
803
- <div class="goal">
804
- <svg class="ring" viewBox="0 0 42 42" role="img" aria-label="5 of 6 criteria satisfied">
805
- <circle class="ring__track" cx="21" cy="21" r="16"></circle>
806
- <circle class="ring__arc" cx="21" cy="21" r="16" stroke-dasharray="83.8 16.7" transform="rotate(-90 21 21)"></circle>
807
- <text class="ring__txt" x="21" y="25" text-anchor="middle">5/6</text></svg>
808
- <div>
809
- <a class="goal__title" href="#/goal/1000045"><span class="goal__id">#1000045</span>Public builder profiles</a>
810
- <p class="goal__sub">A builder's own page: standing, shipped work and the consent that puts any of it in public.</p>
811
- <div class="goal__facts">
812
- <span class="status status--blocked">blocked</span><span class="chip">builder-settings</span><span class="chip">hall-ui</span><span class="chip">kernel</span><span class="chip chip--more">+2</span>
813
- </div>
814
- <div class="roll">
815
- <span class="roll__d"><i class="dot--blocked"></i><b>2</b> blocked</span>
816
- </div>
817
- </div>
818
- <div class="goal__right">
819
- <a class="tlink" href="#/goal/1000045">See what is blocking</a>
820
- </div>
821
- </div>
822
- </div>
823
-
824
- <!-- Achieved -->
825
- <div class="group">
826
- <div class="group__head"><span class="group__name">Achieved</span><span class="group__n">3</span></div>
827
- <div class="pills">
828
- <a class="pill" href="#/goal/1000080">
829
- <svg class="pill__mark" viewBox="0 0 16 16" aria-hidden="true"><path d="M3.4 8.4 6.6 11.5 12.6 4.9"/></svg>
830
- <b>Apex UI pass 2</b><span class="pill__id">#1000080</span></a>
831
- <a class="pill" href="#/goal/1000079">
832
- <svg class="pill__mark" viewBox="0 0 16 16" aria-hidden="true"><path d="M3.4 8.4 6.6 11.5 12.6 4.9"/></svg>
833
- <b>Code quality: pay down the frozen debt and make enforcement durable</b><span class="pill__id">#1000079</span></a>
834
- <a class="pill" href="#/goal/1000061">
835
- <svg class="pill__mark" viewBox="0 0 16 16" aria-hidden="true"><path d="M3.4 8.4 6.6 11.5 12.6 4.9"/></svg>
836
- <b>Apex UI pass, the front door and the project hub</b><span class="pill__id">#1000061</span></a>
837
- </div>
838
- </div>
839
-
840
- <!-- Archived -->
841
- <div class="group">
842
- <div class="group__head"><span class="group__name">Archived</span><span class="group__n">1</span></div>
843
- <div class="pills pills--muted">
844
- <a class="pill" href="#/goal/1000026">
845
- <svg class="pill__mark" viewBox="0 0 16 16" aria-hidden="true"><path d="M3.4 8.4 6.6 11.5 12.6 4.9"/></svg>
846
- <b>Cloud Bongos productization and self-host</b><span class="pill__id">#1000026</span></a>
847
- </div>
848
- </div>
849
- </div>
850
-
851
- <!-- loading -------------------------------------------------------- -->
852
- <div class="s-loading" aria-hidden="true">
853
- <p class="count-line"><span class="skel" style="display:inline-block;width:132px"></span></p>
854
- <div class="readiness">
855
- <div class="stat"><span class="skel" style="display:block;width:88px"></span><p class="stat__fig"><span class="skel skel--fig" style="display:block;width:66px"></span></p><p class="stat__foot"><span class="skel" style="display:block;width:112px"></span></p></div>
856
- <div class="stat"><span class="skel" style="display:block;width:76px"></span><p class="stat__fig"><span class="skel skel--fig" style="display:block;width:54px"></span></p><p class="stat__foot"><span class="skel" style="display:block;width:96px"></span></p></div>
857
- <div class="stat"><span class="skel" style="display:block;width:60px"></span><p class="stat__fig"><span class="skel skel--fig" style="display:block;width:54px"></span></p><p class="stat__foot"><span class="skel" style="display:block;width:124px"></span></p></div>
858
- <div class="stat"><span class="skel" style="display:block;width:96px"></span><p class="stat__fig"><span class="skel skel--fig" style="display:block;width:84px"></span></p><p class="stat__foot"><span class="skel" style="display:block;width:88px"></span></p></div>
859
- </div>
860
- <div class="group">
861
- <div class="group__head"><span class="group__name">Active</span><span class="skel" style="width:18px"></span></div>
862
- <div class="goal"><span class="skel skel--ring"></span><div>
863
- <span class="skel skel--title" style="display:block;width:56%"></span>
864
- <span class="skel" style="display:block;width:78%;margin-top:11px"></span>
865
- <span class="skel" style="display:block;width:36%;margin-top:12px"></span></div>
866
- <div class="goal__right"><span class="skel" style="display:block;width:130px"></span></div></div>
867
- <div class="goal"><span class="skel skel--ring"></span><div>
868
- <span class="skel skel--title" style="display:block;width:42%"></span>
869
- <span class="skel" style="display:block;width:70%;margin-top:11px"></span>
870
- <span class="skel" style="display:block;width:30%;margin-top:12px"></span></div>
871
- <div class="goal__right"><span class="skel" style="display:block;width:130px"></span></div></div>
872
- <div class="goal"><span class="skel skel--ring"></span><div>
873
- <span class="skel skel--title" style="display:block;width:50%"></span>
874
- <span class="skel" style="display:block;width:74%;margin-top:11px"></span>
875
- <span class="skel" style="display:block;width:33%;margin-top:12px"></span></div>
876
- <div class="goal__right"><span class="skel" style="display:block;width:130px"></span></div></div>
877
- </div>
878
- <div class="group">
879
- <div class="group__head"><span class="group__name">Blocked</span><span class="skel" style="width:18px"></span></div>
880
- <div class="goal"><span class="skel skel--ring"></span><div>
881
- <span class="skel skel--title" style="display:block;width:47%"></span>
882
- <span class="skel" style="display:block;width:66%;margin-top:11px"></span></div>
883
- <div class="goal__right"><span class="skel" style="display:block;width:130px"></span></div></div>
884
- </div>
885
- <div class="group">
886
- <div class="group__head"><span class="group__name">Achieved</span><span class="skel" style="width:18px"></span></div>
887
- <div class="pills">
888
- <span class="skel" style="width:200px;height:34px;border-radius:999px"></span>
889
- <span class="skel" style="width:252px;height:34px;border-radius:999px"></span>
890
- <span class="skel" style="width:176px;height:34px;border-radius:999px"></span>
891
- </div>
892
- </div>
893
- </div>
894
-
895
- <!-- empty ---------------------------------------------------------- -->
896
- <div class="s-empty">
897
- <div class="notice">
898
- <h3 class="notice__h">No goals match these filters.</h3>
899
- <p class="notice__p">Twelve goals exist on this instance. None of them is open, scoped to hall-ui and owned by
900
- IAMMASTERQUA at once. Widen one filter, or clear them all.</p>
901
- <div class="notice__acts">
902
- <button type="button" class="btn-ghost">clear filters</button>
903
- <a class="tlink" href="/goals">See all 12 goals</a>
904
- </div>
905
- </div>
906
- </div>
907
-
908
- <!-- error ---------------------------------------------------------- -->
909
- <div class="s-error">
910
- <div class="notice notice--error">
911
- <h3 class="notice__h">The goals feed did not answer.</h3>
912
- <p class="notice__p">GET /api/bongos/goals returned 503 after two retries. Nothing here is stale data dressed up
913
- as fresh: the page is showing you the failure instead of the last thing it happened to hold.</p>
914
- <div class="notice__acts">
915
- <button type="button" class="btn-accent">retry</button>
916
- <a class="tlink" href="/watch">Open the Watch page</a>
917
- </div>
918
- </div>
919
- </div>
920
- </section>
921
-
922
- <!-- ============ THE SEAM ============ -->
923
- <hr class="seam">
924
- <p class="seam-lab">Goal detail · #1000081</p>
925
-
926
- <!-- ============ THE DETAIL ============ -->
927
- <section class="pane" aria-labelledby="detail-h">
928
- <div class="detail__head">
929
- <div class="detail__headmain">
930
- <h2 class="detail__title" id="detail-h"><span class="goal__id">#1000081</span>Builders' hall in the world</h2>
931
- <p class="detail__sub">The 27-page hall adopts the apex world: five archetype mocks, one shell, every page family re-skinned.</p>
932
- <div class="disclosure">
933
- <button type="button" class="disclosure__btn" id="claude-notes-btn" aria-expanded="false" aria-controls="claude-notes-body">
934
- <svg class="disclosure__chev" viewBox="0 0 10 10" aria-hidden="true"><path d="M3.4 1.6 6.8 5 3.4 8.4"/></svg>
935
- Claude's notes on this goal</button>
936
- <div class="disclosure__body" id="claude-notes-body">
937
- <p style="margin:0">The hall is 27 pages built over two years by a dozen sessions, and it shows: three
938
- competing card treatments, four grey ramps, page-local colour in nine stylesheets. The round settles the
939
- composition first, on five archetypes that cover every page family, so the re-skin is a port and not
940
- twenty-seven arguments. The shell lands second, once a composition is picked.</p>
941
- </div>
942
- </div>
943
- <div class="detail__meta">
944
- <span class="chip">BONGOS-V1</span>
945
- <span class="status status--open">open</span>
946
- <span>scope</span>
947
- <span class="chip">hall-ui</span>
948
- <span>·</span>
949
- <span>opened by Percy Jackson</span>
950
- <span>·</span>
951
- <span class="num">last work 2026-08-30</span>
952
- </div>
953
- </div>
954
- <div class="detail__actions" id="goal-detail-actions">
955
- <button type="button" class="btn-ghost">make private</button>
956
- <button type="button" class="btn-accent">join goal</button>
957
- </div>
958
- </div>
959
-
960
- <div class="band">
961
- <div class="band__col">
962
- <div class="col__head"><h3 class="col__h">Completion</h3><span class="count-pill">0 / 3</span></div>
963
- <p class="col__lede">The done-when criteria. A goal is achieved when every one is confirmed, never before.</p>
964
- <ul class="crits">
965
- <li class="crit">
966
- <span class="crit__mark"></span>
967
- <div><span class="crit__key">hall-archetypes-approved</span>
968
- <p class="crit__detail">Five archetype mocks, three versions each, and the owner has picked one composition per archetype.</p></div>
969
- </li>
970
- <li class="crit">
971
- <span class="crit__mark"></span>
972
- <div><span class="crit__key">hall-shell-in-world</span>
973
- <p class="crit__detail">One shell: sidebar, topbar, rail and drawer, on the hall's own token tier.</p></div>
974
- </li>
975
- <li class="crit">
976
- <span class="crit__mark"></span>
977
- <div><span class="crit__key">hall-pages-reskinned</span>
978
- <p class="crit__detail">All 27 hall pages render on that shell with no page-local colour left anywhere.</p></div>
979
- </li>
980
- </ul>
981
- <div class="col__foot"><a class="tlink" href="#/goal/1000081/completion">View all 3</a></div>
982
- </div>
983
-
984
- <div class="band__col">
985
- <div class="col__head"><h3 class="col__h">Members</h3><span class="count-pill">3</span></div>
986
- <p class="col__lede">Who is on this goal, and what they have contributed to it.</p>
987
- <div class="invite" id="goal-invite">
988
- <button type="button" class="disclosure__btn" id="invite-btn" aria-expanded="true" aria-controls="invite-body">
989
- <svg class="disclosure__chev" viewBox="0 0 10 10" aria-hidden="true"><path d="M3.4 1.6 6.8 5 3.4 8.4"/></svg>
990
- Invite a builder</button>
991
- <div class="invite__form" id="invite-body">
992
- <label class="field__lab" for="goal-invite-builder" style="position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)">Builder</label>
993
- <select id="goal-invite-builder"><option>Choose a builder</option><option>scootermack</option><option>lars589</option></select>
994
- <button type="button" class="btn-xs">send</button>
995
- </div>
996
- </div>
997
- <div class="pending" id="goal-pending">
998
- <p class="pending__h">Invitations <span class="count-pill">1</span></p>
999
- <div class="pending__row">
1000
- <span class="pending__who">scootermack</span>
1001
- <span class="pending__note">invited by Percy Jackson, 2 days ago</span>
1002
- <span class="pending__acts"><button type="button" class="btn-xs">revoke</button></span>
1003
- </div>
1004
- <p class="pending__h" style="margin-top:14px">Join requests <span class="count-pill">1</span></p>
1005
- <div class="pending__row">
1006
- <span class="pending__who">IAMMASTERQUA</span>
1007
- <span class="pending__note">"I can take the reading pages"</span>
1008
- <span class="pending__acts">
1009
- <button type="button" class="btn-xs">decline</button>
1010
- <button type="button" class="btn-xs">admit</button></span>
1011
- </div>
1012
- </div>
1013
- <ul class="members" id="goal-members">
1014
- <li class="member"><span class="member__avatar"></span>
1015
- <span class="member__name">Percy Jackson <small>@jaxri</small></span>
1016
- <span class="member__pill">lead</span></li>
1017
- <li class="member"><span class="member__avatar"></span>
1018
- <span class="member__name">lars589 <small>Owner</small></span>
1019
- <span class="member__pill">member</span></li>
1020
- <li class="member"><span class="member__avatar"></span>
1021
- <span class="member__name">scootermack <small>Owner</small></span>
1022
- <span class="member__pill">member</span></li>
1023
- </ul>
1024
- <div class="col__foot"><a class="tlink" href="#/goal/1000081/members">View all 3</a></div>
1025
- </div>
1026
-
1027
- <div class="band__col" id="goal-conflicts-card">
1028
- <div class="col__head"><h3 class="col__h">Conflicts</h3><span class="count-pill">2</span></div>
1029
- <p class="col__lede">Open tasks whose declared files overlap. Sequence these before two builders collide.</p>
1030
- <div class="conflict">
1031
- <span class="conflict__pair">1003303 and 1003304</span>
1032
- <span class="conflict__sev conflict__sev--high">high</span>
1033
- <p class="conflict__paths">modules/hall-ui/public/style.css<br>modules/hall-ui/public/shell.js</p>
1034
- </div>
1035
- <div class="conflict">
1036
- <span class="conflict__pair">1003305 and 1003307</span>
1037
- <span class="conflict__sev conflict__sev--medium">medium</span>
1038
- <p class="conflict__paths">modules/hall-ui/public/work.css</p>
1039
- </div>
1040
- <div class="col__foot"><a class="tlink" href="#/goal/1000081/conflicts">View all 2</a></div>
1041
- </div>
1042
- </div>
1043
-
1044
- <div class="tasks">
1045
- <div class="tasks__head">
1046
- <h3 class="col__h">Tasks</h3>
1047
- <div class="tabs" role="tablist" aria-label="Goal tasks">
1048
- <button type="button" class="tab" id="tab-todo" role="tab" aria-selected="true" aria-controls="pane-todo">to do</button>
1049
- <button type="button" class="tab" id="tab-done" role="tab" aria-selected="false" aria-controls="pane-done">completed</button>
1050
- </div>
1051
- </div>
1052
-
1053
- <div id="pane-todo" role="tabpanel" aria-labelledby="tab-todo">
1054
- <div class="tasks__bar">
1055
- <div class="field">
1056
- <label class="field__lab" for="f-goal-search">Search</label>
1057
- <input id="f-goal-search" type="search" placeholder="task # or title">
1058
- </div>
1059
- <div class="field">
1060
- <label class="field__lab" for="f-goal-sort">Sort</label>
1061
- <select id="f-goal-sort"><option>credits / minute</option><option>credits</option><option>minutes</option><option>priority</option></select>
1062
- </div>
1063
- <div class="field">
1064
- <label class="field__lab" for="f-goal-kind">Kind</label>
1065
- <select id="f-goal-kind"><option>any</option><option>ui</option><option>engineer</option><option>infra</option></select>
1066
- </div>
1067
- </div>
1068
- <p class="count-line">8 tasks to do · 0 claimable now</p>
1069
-
1070
- <div class="task">
1071
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003302" disabled></span>
1072
- <div>
1073
- <a class="task__title" href="#/task/1003302"><span class="task__id">1003302</span> Hall composition round: five archetype mocks, three versions each</a>
1074
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span></div>
1075
- <div class="task__figs"><span><b>90</b> credits</span><span><b>240</b>m</span><span><b>0.38</b> credits/min</span><span><b>15</b> files</span></div>
1076
- </div>
1077
- <div class="task__right">
1078
- <span class="pri pri--p1">P1</span>
1079
- <span class="quiet">claimed by Percy Jackson</span>
1080
- </div>
1081
- </div>
1082
-
1083
- <div class="task">
1084
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003303" disabled></span>
1085
- <div>
1086
- <a class="task__title" href="#/task/1003303"><span class="task__id">1003303</span> Hall shell in the world: sidebar, topbar, style.css token tier and the hall-kit primitives</a>
1087
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span><span class="chip">newcomer</span></div>
1088
- <div class="task__figs"><span><b>80</b> credits</span><span><b>180</b>m</span><span><b>0.44</b> credits/min</span><span><b>6</b> files</span></div>
1089
- </div>
1090
- <div class="task__right">
1091
- <span class="pri pri--p1">P1</span>
1092
- <span class="quiet">backlog</span>
1093
- </div>
1094
- </div>
1095
-
1096
- <div class="task">
1097
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003304" disabled></span>
1098
- <div>
1099
- <a class="task__title" href="#/task/1003304"><span class="task__id">1003304</span> Hall pages in the world: work board and home</a>
1100
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span></div>
1101
- <div class="task__figs"><span><b>60</b> credits</span><span><b>150</b>m</span><span><b>0.40</b> credits/min</span><span><b>4</b> files</span></div>
1102
- </div>
1103
- <div class="task__right">
1104
- <span class="pri pri--p2">P2</span>
1105
- <span class="quiet">backlog</span>
1106
- </div>
1107
- </div>
1108
-
1109
- <div class="task">
1110
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003305" disabled></span>
1111
- <div>
1112
- <a class="task__title" href="#/task/1003305"><span class="task__id">1003305</span> Hall pages in the world: task detail, idea and ideas</a>
1113
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span></div>
1114
- <div class="task__figs"><span><b>60</b> credits</span><span><b>140</b>m</span><span><b>0.43</b> credits/min</span><span><b>5</b> files</span></div>
1115
- </div>
1116
- <div class="task__right">
1117
- <span class="pri pri--p2">P2</span>
1118
- <span class="quiet">backlog</span>
1119
- </div>
1120
- </div>
1121
-
1122
- <div class="task">
1123
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003306" disabled></span>
1124
- <div>
1125
- <a class="task__title" href="#/task/1003306"><span class="task__id">1003306</span> Hall pages in the world: reading rooms - primer, diagrams, roadmap, ranks</a>
1126
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span><span class="chip">newcomer</span></div>
1127
- <div class="task__figs"><span><b>55</b> credits</span><span><b>120</b>m</span><span><b>0.46</b> credits/min</span><span><b>9</b> files</span></div>
1128
- </div>
1129
- <div class="task__right">
1130
- <span class="pri pri--p2">P2</span>
1131
- <span class="quiet">backlog</span>
1132
- </div>
1133
- </div>
1134
-
1135
- <div class="task">
1136
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003307" disabled></span>
1137
- <div>
1138
- <a class="task__title" href="#/task/1003307"><span class="task__id">1003307</span> Hall pages in the world: governance and lists - goals, government, modules, drachmae, watch, harbor, gate, sessions, people, scouting, collab, copy desk, atlas</a>
1139
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span></div>
1140
- <div class="task__figs"><span><b>120</b> credits</span><span><b>300</b>m</span><span><b>0.40</b> credits/min</span><span><b>22</b> files</span></div>
1141
- </div>
1142
- <div class="task__right">
1143
- <span class="pri pri--p2">P2</span>
1144
- <span class="quiet">backlog</span>
1145
- </div>
1146
- </div>
1147
-
1148
- <div class="task">
1149
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003308" disabled></span>
1150
- <div>
1151
- <a class="task__title" href="#/task/1003308"><span class="task__id">1003308</span> Hall pages in the world: settings, profile, pair, my-projects, not-ready</a>
1152
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span></div>
1153
- <div class="task__figs"><span><b>40</b> credits</span><span><b>90</b>m</span><span><b>0.44</b> credits/min</span><span><b>11</b> files</span></div>
1154
- </div>
1155
- <div class="task__right">
1156
- <span class="pri pri--p3">P3</span>
1157
- <span class="quiet">backlog</span>
1158
- </div>
1159
- </div>
1160
-
1161
- <div class="task">
1162
- <span class="task__pick"><input type="checkbox" aria-label="Select task 1003309" disabled></span>
1163
- <div>
1164
- <a class="task__title" href="#/task/1003309"><span class="task__id">1003309</span> Verify the hall in the world: both modes, every page, gates, keyboard and tests</a>
1165
- <div class="task__tags"><span class="chip">ui</span><span class="chip">hall-ui</span></div>
1166
- <div class="task__figs"><span><b>50</b> credits</span><span><b>120</b>m</span><span><b>0.42</b> credits/min</span><span><b>8</b> files</span></div>
1167
- </div>
1168
- <div class="task__right">
1169
- <span class="pri pri--p3">P3</span>
1170
- <span class="quiet">backlog</span>
1171
- </div>
1172
- </div>
1173
- </div>
1174
-
1175
- <div id="pane-done" role="tabpanel" aria-labelledby="tab-done" hidden>
1176
- <div class="notice">
1177
- <h3 class="notice__h">Nothing has shipped on this goal yet.</h3>
1178
- <p class="notice__p">All eight tasks are still to do. The first one to ship lands here with its kind, its
1179
- credits and the date it went out.</p>
1180
- </div>
1181
- </div>
1182
-
1183
- <div class="bulk" role="region" aria-label="Bulk actions">
1184
- <span class="bulk__count">0 tasks selected · every task in this goal is backlog</span>
1185
- <div class="bulk__acts">
1186
- <button type="button" class="btn-ghost" disabled>clear</button>
1187
- <button type="button" class="btn-accent" disabled>bulk claim</button>
1188
- </div>
1189
- </div>
1190
- </div>
1191
- </section>
1192
-
1193
- </main>
1194
-
1195
- <script>
1196
- /* the mock's state contract: read ?state= once and apply it. Nothing is built here, and no motion. */
1197
- (function () {
1198
- var ok = ['populated', 'loading', 'empty', 'error', 'rail', 'drawer', 'focus'];
1199
- var s = new URLSearchParams(location.search || location.hash.slice(1) || '').get('state') || 'populated';
1200
- if (ok.indexOf(s) === -1) s = 'populated';
1201
- document.body.setAttribute('data-state', s);
1202
- })();
1203
- </script>
1204
- </body>
1205
- </html>