@antoneeo/mkt-agentic-sdlc-skill 0.18.0 → 0.20.0

package/skills/mkt-agentic-sdlc/docs_site/index.html

@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src 'self' file:; style-src 'self' file:; img-src 'self' data:; connect-src 'none'; font-src 'none'; frame-src 'none'; object-src 'none'; base-uri 'none'; form-action 'none'">
+<meta name="referrer" content="no-referrer">
+<title></title>
+<link rel="stylesheet" href="style.css">
+</head>
+<body>
+<div id="app"></div>
+<script src="strings.js"></script>
+<script src="data/core.js"></script>
+<script src="app.js"></script>
+</body>
+</html>

package/skills/mkt-agentic-sdlc/docs_site/strings.js

@@ -0,0 +1,323 @@
+// Every word the docs site shows. The page and the generator carry no wording of
+// their own: the generator writes codes, the page looks them up here.
+window.DOCS_SITE_STRINGS = {
+  site_name: "Project docs",
+  loading: "Loading…",
+  loading_documents: "Loading documents…",
+  loading_knowledge: "Loading what is known…",
+  incomplete: "This site's data is incomplete — run the generator again.",
+  not_found: "Not found — it may have changed since this site was generated.",
+  back_home: "Back to the home page",
+  stamp_git: "Generated {date} from commit {commit}",
+  stamp_changed_one: ", plus 1 changed file not yet committed",
+  stamp_changed_many: ", plus {n} changed files not yet committed",
+  stamp_no_git: "Generated {date} — not a git repository",
+
+  nav_home: "Home",
+  nav_chronology: "Chronology",
+  nav_work: "Open work",
+  nav_features: "Features",
+  nav_courses: "Courses",
+  nav_rules: "Rules",
+  nav_guides: "Guides",
+  nav_documents: "Documents",
+  nav_map: "Map",
+  nav_sources: "Source documents",
+  nav_search: "Search",
+  search_hint: "Ctrl+K",
+
+  home_project: "This project",
+  home_project_why: "What the project is, from its own reading guide and Vision.",
+  home_lately: "Lately",
+  home_lately_why: "The most recent dated events in the project's documents.",
+  home_open: "Open now",
+  home_open_why: "Work in progress, as each one declares it, with its next step.",
+  home_known: "What is known",
+  home_known_why: "The areas of the knowledge base and their topics.",
+  home_vision: "Vision",
+  home_vision_status: "Status: {status}",
+  home_vision_none: "This project has no Vision document yet.",
+  home_readme: "Read the reading guide",
+  home_manifest: "The list of the project's main documents",
+  home_router: "Which guide to read before which task",
+  home_register: "The register of open work",
+  home_rules: "The project's rules",
+  home_notes: "Project notes",
+  home_all_chronology: "The whole chronology",
+  home_all_work: "All open work",
+  home_map: "Open the map",
+  home_no_title: "This project's reading guide has no title.",
+  home_known_none: "No knowledge base yet: topics and facts appear here once the project records them.",
+
+  chronology_title: "Chronology",
+  chronology_why: "Dated events the project's documents record, most recent first. Not the history of commits.",
+  chronology_empty: "Nothing dated yet. Events appear here as the project's documents record them with a date.",
+  event_diary: "analysis diary",
+  event_request: "request record",
+  event_note: "note",
+  event_source: "source document received",
+  event_review: "review",
+  event_decision: "decision record",
+  event_project_note: "project note",
+  event_spike: "exploration outcome",
+
+  work_title: "Open work",
+  work_why: "Each piece of open work, as its own resume notes declare it. Nothing here is computed.",
+  work_empty: "No open work is declared. Each piece of work in progress appears here, with its next step, once it has resume notes.",
+  work_status: "Status",
+  work_level: "Size",
+  work_since: "Since",
+  work_updated: "Last updated",
+  work_branch: "Branch",
+  work_next: "Next step",
+  work_resume: "Read the resume notes",
+  work_notes: "Project notes",
+  work_notes_why: "Notes true for the whole project, as written.",
+  work_register: "Read the register of open work",
+
+  units_features: "Features",
+  units_courses: "Courses",
+  units_why: "One entry per analysis, as each declares itself, sorted by its id.",
+  units_empty: "No analyses yet. Each significant change gets one, and it appears here.",
+  units_columns: "Columns by status",
+  units_list: "Single list",
+  units_lens: "Kind of work",
+  units_lens_all: "All kinds",
+  units_id: "Id",
+  units_name: "Name",
+  units_dates: "Dates",
+
+  group_1: "blocked",
+  group_2: "planned",
+  group_3: "in progress",
+  group_4: "paused",
+  group_5: "completed",
+  group_6: "cancelled",
+  group_7: "archived",
+  group_8: "other status",
+
+  level_L1: "trivial",
+  level_L2: "small",
+  level_L3: "significant change",
+  level_Spike: "time-boxed exploration",
+
+  lens_code: "software",
+  lens_knowledge: "knowledge",
+  lens_marketing: "marketing",
+  lens_course: "course",
+
+  rules_title: "Rules",
+  rules_why: "What the project has decided: its Vision, its principles and its decisions.",
+  rules_vision: "Vision",
+  rules_decisions: "Decisions",
+  rules_decisions_why: "Why a structural choice was made, and what was rejected.",
+  rules_manifest: "The list of the project's main documents",
+  rules_empty: "Nothing yet. The Vision and the decision records appear here once written.",
+  rules_see_guides: "How work is done here: the guides",
+  rules_when: "Read when: {when}",
+
+  guides_title: "Guides",
+  guides_why: "How work is done in this project, and how its complex parts work. The agent reads the matching guide before the task it covers.",
+  guides_router: "Which guide to read before which task",
+  guides_router_why: "The map the agent consults before starting a piece of work.",
+  guides_operative: "How work is done",
+  guides_operative_why: "Instructions to follow for a kind of task, written from what the project's people indicated.",
+  guides_comprehension: "How it works",
+  guides_comprehension_why: "Maps of complex parts of the system, written from its code so the next session does not have to rebuild them.",
+  guides_empty: "No guides yet. A guide appears here when a way of working is written down, or when a complex part of the system is mapped.",
+
+  documents_title: "Documents",
+  documents_why: "The project's documents, by folder.",
+  documents_empty: "No documents yet.",
+  doc_about: "About this document",
+
+  chain_title: "How this change was worked through",
+  chain_step_vision: "Vision",
+  chain_step_vision_why: "Why: the benefit it serves",
+  chain_step_use_cases: "Use cases",
+  chain_step_use_cases_why: "Who needs what, and why",
+  chain_step_flows: "Flows and interfaces",
+  chain_step_flows_why: "What happens, and through which surfaces",
+  chain_step_risks: "Risks",
+  chain_step_risks_why: "What can go wrong, and how it is prevented",
+  chain_step_solution: "Solution study",
+  chain_step_solution_why: "What the system already has, and what changes",
+  chain_step_design: "Design and tests",
+  chain_step_design_why: "The steps of the work, and how it is tested",
+  chain_step_merge_tests: "Merge and tests",
+  chain_step_merge_tests_why: "What to check before merging, and what to test after",
+  chain_step_diary: "Diary",
+  chain_step_diary_why: "What happened, dated",
+  chain_absent: "Not in this analysis",
+  chain_request: "The requester's own words",
+  chain_north_star: "The project's North Star",
+  chain_merge: "Merge review",
+  chain_e2e: "End-to-end test script",
+  home_north_star_why: "What everything in this project is measured against, as the Vision states it.",
+
+  folder_: "Top level",
+  folder_vision: "Vision",
+  folder_vision_features: "Feature visions",
+  folder_reference: "Guides",
+  folder_architecture: "Decisions",
+  folder_functional: "How the system works",
+  folder_strategic: "Architecture and features",
+  folder_solutions: "Analyses",
+  folder_research: "Research",
+  folder_strategy: "Strategy",
+  folder_tactics: "Tactics",
+  folder_deliverables: "Deliverables",
+  folder_spikes: "Explorations",
+  folder_topics: "Topics",
+  folder_corpus_notes: "Notes",
+  folder_memory: "Catalog",
+
+  map_title: "Map",
+  map_why: "Topics, sized by how many facts each holds and coloured by area.",
+  map_view_topics: "Topics",
+  map_view_close: "One topic up close",
+  map_view_every: "Everything",
+  map_legend: "Legend",
+  map_kinds: "Kinds",
+  map_lines: "Lines",
+  map_edge_part: "part of",
+  map_edge_related: "related",
+  map_edge_shared: "share source documents (computed)",
+  map_edge_based: "based on",
+  map_edge_newer: "newer version of",
+  map_edge_replaced: "replaced by",
+  map_edge_conflict: "in conflict with",
+  map_kind_topic: "topic",
+  map_kind_fact: "fact",
+  map_kind_source: "source document",
+  map_kind_note: "note",
+  map_no_area: "no area",
+  map_hint: "Drag to move, scroll or use + and − to zoom: more names appear as you zoom in. Click a topic to see it up close.",
+  map_empty: "No topics yet.",
+  map_fit: "Fit",
+  map_zoom_in: "+",
+  map_zoom_in_why: "Zoom in",
+  map_zoom_out: "−",
+  map_zoom_out_why: "Zoom out",
+  map_why_close: "One topic at the centre, its facts around it coloured by origin, and the documents and notes they come from on the outer ring.",
+  map_why_every: "Every topic, fact and source document at once: an overview of how much is known and where. Names and facts appear wherever there is room to read them: zoom in to see more. Click a topic to see it up close.",
+  map_hint_close: "Click a fact, a document or a note to open it; click the centre to open the topic.",
+  map_open_topic: "Open the page of {name}",
+
+  topic_area: "Area",
+  topic_no_area: "no area",
+  topic_aka: "Also known as",
+  topic_gaps: "Known gaps",
+  topic_related: "Related topics",
+  topic_children: "Sub-topics",
+  topic_parents: "Part of",
+  topic_facts: "Facts",
+  topic_facts_count: "{n} facts",
+  topic_facts_one: "1 fact",
+  topic_filter: "Filter by words",
+  topic_origin: "Origin",
+  topic_origin_all: "All origins",
+  topic_no_facts: "No facts recorded in this topic yet.",
+  topic_merged: "This topic was merged into another one.",
+  topic_on_map: "See it on the map",
+
+  origin_given: "from a document",
+  origin_given_why: "The passage can be re-read in the document it comes from.",
+  origin_elicited: "stated by a person",
+  origin_elicited_why: "Said and recorded on the day, not found in a document and maybe never: treat it as that person's statement.",
+  origin_derived: "inferred",
+  origin_derived_why: "Reasoned from other facts, shown with what it rests on.",
+  origin_ruling: "decision",
+  origin_ruling_why: "Taken to settle a conflict.",
+  origin_imported: "from another knowledge base",
+  origin_imported_why: "Brought in from another knowledge base, where its own sources are.",
+  origin_other: "origin as written: {v}",
+  origin_other_why: "An origin this site does not know.",
+
+  state_ok: "current",
+  state_superseded: "replaced",
+  state_superseded_why: "A newer fact takes its place.",
+  state_contested: "in conflict",
+  state_contested_why: "Facts that disagree, not yet settled.",
+
+  statement_mark: "statement",
+  statement_prefix: "[statement] {text}",
+  statement_notice: "Not found in a document. Treat it as a statement, not as documented evidence.",
+
+  fact_title: "Fact",
+  fact_close: "Close",
+  fact_origin: "Origin",
+  fact_valid: "Holds when",
+  fact_qty: "Value",
+  fact_about: "Also concerns",
+  fact_topic: "Topic",
+  fact_replaced_by: "Replaced by",
+  fact_current_at_end: "Current fact at the end of each chain",
+  fact_in_conflict_with: "In conflict with",
+  fact_rests_on: "What it rests on",
+  fact_untraced: "This part could not be traced.",
+  fact_sources: "Sources",
+  fact_page: "page {n}",
+  fact_lines: "lines {a}–{b}",
+  fact_line: "line {a}",
+  fact_open_source: "Open the source document",
+  fact_open_note: "Open the note",
+  fact_open_doc: "Open the document",
+  fact_unknown: "This fact is not in this knowledge base.",
+
+  ground_document: "a document",
+  ground_statement: "a person's statement",
+  ground_decision: "a decision",
+  ground_kb: "another knowledge base",
+  ground_untraceable: "could not be traced",
+  ground_class_statement: "Rests, at least in part, on a person's statement.",
+  ground_class_untraceable: "Part of what it rests on could not be traced.",
+  ground_class_imported: "Rests on another knowledge base.",
+  ground_class_documents: "Rests on documents or decisions only.",
+
+  chain_loop: "The chain of replacements loops back to {id}: it stops here.",
+  chain_missing: "The chain names {id}, which is not in this knowledge base: it stops here.",
+
+  reason_no_file: "The source document is not in the knowledge base.",
+  reason_no_extraction: "No stored text of this document to show the passage from.",
+  reason_no_span: "The passage it points to is not in the stored text.",
+  reason_cell: "Spreadsheet cell {cell}: the cell itself is not shown here.",
+  reason_unknown_form: "The position of the passage is written in a form this site cannot read.",
+  reason_no_locator: "The fact does not say where in the document it comes from.",
+  reason_outside: "Points outside the project's documents: not followed.",
+  reason_unreadable: "The file could not be read.",
+
+  sources_title: "Source documents",
+  sources_why: "The documents the knowledge base was built from.",
+  sources_empty: "No source documents yet.",
+  source_name: "Name",
+  source_kind: "Kind",
+  source_date: "Date",
+  source_facts: "Facts taken",
+  source_topics: "Topics using it",
+  source_read: "How far it was read",
+  source_newer: "Newer version",
+  source_older: "Older version",
+  source_facts_list: "Facts taken from it",
+  source_record: "Its record",
+  read_complete: "read in full",
+  read_page: "read up to page {n}",
+  read_page_of: "read up to page {n} of {m}",
+  read_line: "read up to line {n}",
+  read_line_of: "read up to line {n} of {m}",
+  read_unrecorded: "reading not recorded",
+  read_unreadable: "not readable",
+
+  search_title: "Search",
+  search_placeholder: "Search facts, topics and documents",
+  search_placeholder_docs: "Search the documents",
+  search_none_kb: "Nothing found among facts, topics and documents. The full text of source documents is not searched here — not finding something does not mean the sources are silent on it.",
+  search_none_docs: "Nothing found in the documents.",
+  search_group_facts: "Facts",
+  search_group_topics: "Topics",
+  search_group_documents: "Documents",
+  search_more: "and {n} more — add a word to narrow it",
+  search_keys: "Enter opens · arrows move · Esc closes",
+
+  not_fact_id: "Not a fact id in this knowledge base"
+};

package/skills/mkt-agentic-sdlc/docs_site/style.css

@@ -0,0 +1,288 @@
+/* Docs site — a dark reading room. No remote font, image or import: the page
+   opens from disk with the network off. */
+:root {
+  --ink: #0f1216;
+  --ink-2: #151a20;
+  --ink-3: #1c232b;
+  --rule: #2a333d;
+  --rule-2: #38434f;
+  --paper: #e8e2d4;
+  --paper-2: #b9b2a3;
+  --paper-3: #847e72;
+  --accent: #d9a441;
+  --accent-ink: #2b2110;
+  --link: #8fc1d4;
+  /* the five origins */
+  --o-given: #6fb7a8;
+  --o-elicited: #e0a24a;
+  --o-derived: #a99be0;
+  --o-ruling: #7fa7e6;
+  --o-imported: #9cc96b;
+  --conflict: #e0605a;
+  --display: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Charter, Georgia, serif;
+  --body: "Segoe UI Variable Text", "Avenir Next", Avenir, "Gill Sans Nova", "Gill Sans", "Trebuchet MS", sans-serif;
+  --mono: "Cascadia Mono", "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
+}
+* { box-sizing: border-box; }
+html, body { margin: 0; height: 100%; }
+body {
+  background: var(--ink);
+  background-image:
+    radial-gradient(1200px 600px at 85% -10%, rgba(217, 164, 65, 0.07), transparent 60%),
+    radial-gradient(900px 500px at -10% 110%, rgba(111, 183, 168, 0.05), transparent 60%);
+  color: var(--paper);
+  font: 15px/1.6 var(--body);
+  min-width: 1024px;
+}
+a { color: var(--link); text-decoration: none; }
+a:hover { text-decoration: underline; text-underline-offset: 3px; }
+code, pre { font-family: var(--mono); font-size: 0.88em; }
+code { background: var(--ink-3); padding: 1px 5px; border-radius: 3px; }
+pre { background: var(--ink-2); border: 1px solid var(--rule); padding: 12px 14px; overflow: auto; border-radius: 4px; }
+pre code { background: none; padding: 0; }
+button, select, input { font: inherit; color: inherit; }
+
+#app { display: grid; grid-template-columns: 232px 1fr; min-height: 100vh; }
+
+/* ------- rail */
+.rail {
+  position: sticky; top: 0; height: 100vh; overflow: auto;
+  border-right: 1px solid var(--rule); background: rgba(15, 18, 22, 0.85);
+  padding: 22px 0 18px; display: flex; flex-direction: column;
+}
+.brand { padding: 0 22px 18px; border-bottom: 1px solid var(--rule); margin-bottom: 10px; }
+.brand .name { font-family: var(--display); font-size: 21px; line-height: 1.2; color: var(--paper); }
+.brand .kicker { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--paper-3); margin-bottom: 6px; }
+.rail nav a {
+  display: block; padding: 7px 22px; color: var(--paper-2); border-left: 2px solid transparent;
+}
+.rail nav a:hover { color: var(--paper); background: var(--ink-2); text-decoration: none; }
+.rail nav a.on { color: var(--paper); border-left-color: var(--accent); background: var(--ink-2); }
+.rail .searchbtn {
+  gap: 10px;
+  margin: 14px 18px 0; padding: 8px 12px; background: var(--ink-3); border: 1px solid var(--rule-2);
+  border-radius: 6px; text-align: left; cursor: pointer; color: var(--paper-2); display: flex; justify-content: space-between;
+}
+.rail .searchbtn:hover { border-color: var(--accent); color: var(--paper); }
+.rail .searchbtn kbd { font-family: var(--mono); font-size: 11px; color: var(--paper-3); }
+.rail .stamp { margin-top: auto; padding: 16px 22px 0; font-size: 11.5px; color: var(--paper-3); line-height: 1.5; border-top: 1px solid var(--rule); }
+
+/* ------- main */
+main { padding: 34px 48px 80px; max-width: 1180px; width: 100%; }
+main.wide { max-width: none; }
+h1, h2, h3 { font-family: var(--display); font-weight: 600; letter-spacing: 0.005em; color: var(--paper); }
+h1 { font-size: 32px; line-height: 1.15; margin: 0 0 6px; }
+h2 { font-size: 22px; margin: 34px 0 10px; }
+h3 { font-size: 17px; margin: 24px 0 8px; }
+.why { color: var(--paper-3); margin: 0 0 22px; font-size: 14px; }
+.muted { color: var(--paper-3); }
+.empty { color: var(--paper-2); border: 1px dashed var(--rule-2); padding: 14px 16px; border-radius: 6px; background: var(--ink-2); }
+.notice { color: var(--accent); }
+
+/* ------- home */
+.home-head { display: grid; grid-template-columns: 1fr; gap: 6px; margin-bottom: 26px; }
+.home-head .intro { font-size: 17px; color: var(--paper-2); max-width: 760px; }
+.quad { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
+.block {
+  background: linear-gradient(180deg, var(--ink-2), rgba(21, 26, 32, 0.6));
+  border: 1px solid var(--rule); border-radius: 8px; padding: 18px 20px 16px; position: relative;
+}
+.block h2 { margin: 0 0 2px; font-size: 19px; }
+.block h2 a { color: var(--paper); }
+.block .why { margin-bottom: 12px; font-size: 13px; }
+.block .more { display: inline-block; margin-top: 10px; font-size: 13.5px; }
+.block ul { list-style: none; margin: 0; padding: 0; }
+.block li { padding: 6px 0; border-top: 1px solid var(--rule); }
+.block li:first-child { border-top: none; }
+.vision-box { border-left: 2px solid var(--accent); padding: 2px 0 2px 12px; margin: 10px 0; }
+.vision-box .status { font-size: 12.5px; color: var(--accent); letter-spacing: 0.02em; }
+.links { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13.5px; margin-top: 8px; }
+.area-row { padding: 6px 0; }
+.area-row .area { font-family: var(--display); font-size: 16px; }
+.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
+.chip { font-size: 12.5px; padding: 1px 9px; border-radius: 999px; border: 1px solid var(--rule-2); color: var(--paper-2); }
+a.chip:hover { border-color: var(--link); text-decoration: none; color: var(--paper); }
+
+/* ------- events */
+.events { list-style: none; padding: 0; margin: 0; }
+.event { display: grid; grid-template-columns: 104px 1fr; gap: 14px; padding: 8px 0; border-top: 1px solid var(--rule); }
+.event .date { font-family: var(--mono); font-size: 12.5px; color: var(--accent); padding-top: 2px; }
+.event .kind { font-size: 11.5px; color: var(--paper-3); text-transform: uppercase; letter-spacing: 0.08em; }
+.block .event { grid-template-columns: 92px 1fr; }
+
+/* ------- work */
+.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 14px; }
+.card { background: var(--ink-2); border: 1px solid var(--rule); border-radius: 8px; padding: 14px 16px; }
+.card h3 { margin: 0 0 8px; font-size: 17px; }
+.card dl { display: grid; grid-template-columns: 110px 1fr; gap: 3px 10px; margin: 0 0 10px; font-size: 13.5px; }
+.card dt { color: var(--paper-3); }
+.card dd { margin: 0; }
+.card .next { border-top: 1px solid var(--rule); padding-top: 8px; margin-top: 4px; white-space: pre-wrap; }
+.card .next b { display: block; font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--paper-3); font-weight: 600; }
+.pill { display: inline-block; font-size: 12px; padding: 0 8px; border-radius: 999px; border: 1px solid var(--rule-2); color: var(--paper-2); }
+.pill.g1 { border-color: var(--conflict); color: var(--conflict); }
+.pill.g3 { border-color: var(--accent); color: var(--accent); }
+.pill.g5 { border-color: var(--o-given); color: var(--o-given); }
+.prose-box { background: var(--ink-2); border: 1px solid var(--rule); border-radius: 8px; padding: 6px 20px; }
+
+/* ------- units */
+.toolbar { display: flex; gap: 10px; align-items: center; margin-bottom: 16px; flex-wrap: wrap; }
+.seg { display: inline-flex; border: 1px solid var(--rule-2); border-radius: 6px; overflow: hidden; }
+.seg button { background: none; border: none; padding: 5px 12px; cursor: pointer; color: var(--paper-2); }
+.seg button.on { background: var(--accent); color: var(--accent-ink); }
+select, input[type=search], input[type=text] {
+  background: var(--ink-2); border: 1px solid var(--rule-2); border-radius: 6px; padding: 5px 10px;
+}
+.columns { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 14px; overflow-x: auto; }
+.column h3 { margin: 0 0 8px; font-family: var(--body); font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--paper-3); }
+.unit { background: var(--ink-2); border: 1px solid var(--rule); border-radius: 6px; padding: 9px 12px; margin-bottom: 8px; font-size: 13.5px; }
+.unit .id { font-family: var(--mono); font-size: 12px; color: var(--paper-3); }
+.unit .name { display: block; color: var(--paper); margin: 2px 0; }
+table.list { width: 100%; border-collapse: collapse; font-size: 13.5px; }
+table.list th { text-align: left; font-weight: 600; color: var(--paper-3); font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; padding: 6px 10px; border-bottom: 1px solid var(--rule-2); }
+table.list td { padding: 7px 10px; border-bottom: 1px solid var(--rule); vertical-align: top; }
+
+/* ------- documents */
+.tree details { border-top: 1px solid var(--rule); padding: 6px 0; }
+.tree summary { cursor: pointer; font-family: var(--display); font-size: 17px; padding: 4px 0; }
+.tree summary .muted { font-family: var(--body); font-size: 12px; margin-left: 8px; }
+.tree ul { list-style: none; margin: 4px 0 8px; padding-left: 16px; }
+.tree li { padding: 2px 0; }
+.doc-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 20px; }
+.doc-meta .label { font-size: 12px; border: 1px solid var(--rule-2); border-radius: 4px; padding: 1px 8px; color: var(--paper-2); max-width: 100%; }
+.doc-meta .label b { color: var(--paper-3); font-weight: 600; margin-right: 6px; }
+.prose { max-width: 820px; }
+.prose table { border-collapse: collapse; margin: 14px 0; font-size: 13.5px; display: block; overflow-x: auto; }
+.prose th, .prose td { border: 1px solid var(--rule); padding: 5px 9px; vertical-align: top; }
+.prose th { background: var(--ink-3); text-align: left; }
+.prose blockquote { margin: 12px 0; padding: 2px 16px; border-left: 2px solid var(--rule-2); color: var(--paper-2); }
+.prose hr { border: none; border-top: 1px solid var(--rule); margin: 24px 0; }
+.prose h1 { font-size: 28px; }
+.prose li { margin: 2px 0; }
+code.notfact { text-decoration: underline dotted var(--conflict); text-underline-offset: 3px; cursor: help; }
+a.factid code { color: var(--link); }
+
+/* ------- facts */
+.facts { list-style: none; padding: 0; margin: 0; }
+.fact { display: grid; grid-template-columns: 10px 1fr; gap: 12px; padding: 9px 0; border-top: 1px solid var(--rule); cursor: pointer; }
+.fact:hover .text { color: #fff; }
+.fact .dot { width: 10px; height: 10px; border-radius: 50%; margin-top: 7px; }
+.fact .marks { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 3px; }
+.fact.replaced { opacity: 0.5; }
+.fact.replaced .text { text-decoration: line-through; text-decoration-color: var(--paper-3); }
+.tag { font-size: 11.5px; padding: 0 7px; border-radius: 4px; border: 1px solid currentColor; }
+.tag.conflict { color: var(--conflict); }
+.tag.replaced { color: var(--paper-3); }
+.tag.statement { color: var(--o-elicited); font-weight: 600; letter-spacing: 0.02em; }
+.o-given { color: var(--o-given); } .bg-given { background: var(--o-given); }
+.o-elicited { color: var(--o-elicited); } .bg-elicited { background: var(--o-elicited); }
+.o-derived { color: var(--o-derived); } .bg-derived { background: var(--o-derived); }
+.o-ruling { color: var(--o-ruling); } .bg-ruling { background: var(--o-ruling); }
+.o-imported { color: var(--o-imported); } .bg-imported { background: var(--o-imported); }
+.o-other { color: var(--paper-3); } .bg-other { background: var(--paper-3); }
+
+.panel {
+  position: fixed; top: 0; right: 0; bottom: 0; width: min(560px, 46vw); background: var(--ink-2);
+  border-left: 1px solid var(--rule-2); box-shadow: -24px 0 48px rgba(0, 0, 0, 0.45); overflow: auto;
+  padding: 24px 26px 60px; z-index: 20;
+}
+.panel .close { position: absolute; top: 14px; right: 16px; background: none; border: 1px solid var(--rule-2); border-radius: 6px; padding: 2px 10px; cursor: pointer; color: var(--paper-2); }
+.panel .ftext { font-family: var(--display); font-size: 21px; line-height: 1.35; margin: 18px 0 10px; }
+.panel dl { display: grid; grid-template-columns: 130px 1fr; gap: 6px 12px; font-size: 14px; }
+.panel dt { color: var(--paper-3); }
+.panel dd { margin: 0; }
+.panel .why-line { color: var(--paper-3); font-size: 12.5px; display: block; }
+.statement-notice { border: 1px solid var(--o-elicited); color: var(--o-elicited); background: rgba(224, 162, 74, 0.08); padding: 9px 12px; border-radius: 6px; margin: 10px 0; font-size: 14px; }
+.passage { background: var(--ink); border: 1px solid var(--rule); border-radius: 6px; padding: 10px 12px; font-family: var(--mono); font-size: 12.5px; white-space: pre-wrap; word-break: break-word; color: var(--paper-3); margin: 6px 0 4px; }
+.passage mark { background: rgba(217, 164, 65, 0.22); color: var(--paper); border-bottom: 1px solid var(--accent); padding: 0 1px; }
+.src { padding: 10px 0; border-top: 1px solid var(--rule); }
+.src .head { font-size: 13.5px; display: flex; gap: 10px; flex-wrap: wrap; align-items: baseline; }
+.reason { color: var(--paper-2); font-size: 13.5px; font-style: italic; }
+
+/* ------- map */
+.mapwrap { position: relative; height: calc(100vh - 210px); min-height: 460px; border: 1px solid var(--rule); border-radius: 8px; background: radial-gradient(circle at 50% 50%, #141a20, #0c0f13); overflow: hidden; }
+/* system cursors only: the bitmap grab hand renders blurred under Windows display scaling */
+.mapwrap canvas { display: block; width: 100%; height: 100%; cursor: default; }
+.mapwrap canvas.drag { cursor: move; }
+.legend { position: absolute; left: 12px; bottom: 12px; background: rgba(15, 18, 22, 0.88); border: 1px solid var(--rule-2); border-radius: 6px; padding: 9px 12px; font-size: 12.5px; max-width: 330px; }
+.legend label { display: flex; gap: 7px; align-items: center; cursor: pointer; padding: 1px 0; }
+.legend .sw { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
+.legend .sw.sq { border-radius: 1px; }
+.legend .sw.ring { background: none; border: 1.5px dashed var(--o-elicited); }
+.legend summary { cursor: pointer; font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--paper-2); }
+.legend[open] summary { margin-bottom: 4px; }
+.legend { max-height: calc(100% - 24px); overflow: auto; }
+.legend .ln { width: 18px; height: 0; border-top: 2px solid var(--paper-3); display: inline-block; }
+.legend .ln.dash { border-top-style: dashed; }
+.legend .ln.thin { border-top-width: 1px; border-top-color: #5b6672; }
+.legend .ln.based { border-top-color: var(--o-derived); }
+.legend .ln.newer { border-top-color: var(--o-given); border-top-style: dotted; }
+.legend .ln.conflict { border-top-color: var(--conflict); }
+.legend h4 { margin: 6px 0 3px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--paper-3); font-weight: 600; }
+.legend h4:first-child { margin-top: 0; }
+.maphint { position: absolute; right: 12px; top: 10px; font-size: 12px; color: var(--paper-3); }
+.tip { position: absolute; pointer-events: none; background: var(--ink-3); border: 1px solid var(--rule-2); border-radius: 5px; padding: 4px 8px; font-size: 12.5px; max-width: 320px; display: none; }
+
+/* ------- search */
+.overlay { position: fixed; inset: 0; background: rgba(5, 7, 9, 0.66); z-index: 40; display: flex; justify-content: center; padding-top: 12vh; }
+.searchbox { width: min(720px, 90vw); background: var(--ink-2); border: 1px solid var(--rule-2); border-radius: 10px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); display: flex; flex-direction: column; max-height: 72vh; }
+.searchbox input { border: none; border-bottom: 1px solid var(--rule); border-radius: 10px 10px 0 0; padding: 16px 18px; font-size: 17px; background: transparent; outline: none; }
+.searchbox .results { overflow: auto; padding: 6px 0; }
+.searchbox .grp { padding: 8px 18px 2px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--paper-3); }
+.searchbox .res { display: block; padding: 6px 18px; color: var(--paper-2); }
+.searchbox .res.sel, .searchbox .res:hover { background: var(--ink-3); color: var(--paper); text-decoration: none; }
+.searchbox .res small { color: var(--paper-3); margin-left: 8px; font-family: var(--mono); font-size: 11px; }
+.searchbox .none { padding: 16px 18px; color: var(--paper-2); }
+.searchbox .keys { border-top: 1px solid var(--rule); padding: 7px 18px; font-size: 11.5px; color: var(--paper-3); }
+
+/* ------- narrow windows (a side pane, a small laptop): the rail becomes a bar */
+@media (max-width: 1000px) {
+  body { min-width: 0; font-size: 14px; }
+  #app { grid-template-columns: 1fr; }
+  .rail { position: sticky; top: 0; z-index: 10; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 8px 12px; gap: 4px 10px; }
+  .brand { border: none; padding: 0 8px 0 0; margin: 0; }
+  .brand .kicker { display: none; }
+  .brand .name { font-size: 16px; }
+  .rail nav { display: flex; flex-wrap: wrap; }
+  .rail nav a { padding: 4px 8px; border-left: none; border-bottom: 2px solid transparent; }
+  .rail nav a.on { border-bottom-color: var(--accent); }
+  .rail .searchbtn { margin: 0; padding: 4px 10px; }
+  .rail .stamp { flex-basis: 100%; margin: 0; padding: 4px 0 0; border: none; font-size: 11px; }
+  main { padding: 18px 16px 60px; }
+  .quad { grid-template-columns: 1fr; }
+  .mapwrap { height: calc(100vh - 230px); min-height: 360px; }
+  .legend { max-width: 60%; font-size: 11.5px; }
+  .panel { width: 100vw; }
+}
+
+/* ------- an analysis read as its chain (R24) */
+.chain { border: 1px solid var(--rule); border-radius: 8px; background: var(--ink-2); padding: 14px 18px 8px; margin: 4px 0 26px; max-width: 900px; }
+.chain h2 { margin: 0 0 8px; font-size: 16px; }
+.chain ol { list-style: none; margin: 0; padding: 0; counter-reset: step; }
+.chain li { display: grid; grid-template-columns: 250px 1fr; gap: 12px; padding: 7px 0; border-top: 1px solid var(--rule); counter-increment: step; }
+.chain li:first-child { border-top: none; }
+.chain .step b { font-weight: 600; }
+.chain .step b::before { content: counter(step) "  "; color: var(--accent); font-family: var(--mono); font-size: 12px; }
+.chain .step .why-line { color: var(--paper-3); font-size: 12.5px; display: block; }
+.chain .links { display: flex; flex-wrap: wrap; gap: 4px 14px; align-content: flex-start; }
+.chain li.absent .step b { color: var(--paper-2); }
+@media (max-width: 1000px) { .chain li { grid-template-columns: 1fr; gap: 2px; } }
+
+/* ------- the Vision's North Star, in view on the home page (R25) */
+.north-star { border: 1px solid rgba(217, 164, 65, 0.45); border-left: 4px solid var(--accent); border-radius: 8px; padding: 16px 22px 12px; margin: 0 0 22px; background: linear-gradient(90deg, rgba(217, 164, 65, 0.09), rgba(21, 26, 32, 0.4)); max-width: 1000px; }
+.north-star h2 { margin: 0 0 2px; font-size: 22px; color: var(--accent); }
+.north-star .why { margin-bottom: 8px; font-size: 13px; }
+.north-star .prose { font-family: var(--display); font-size: 17px; line-height: 1.55; max-width: none; }
+.north-star .links { align-items: baseline; }
+.north-star .status { font-size: 12.5px; color: var(--paper-3); }
+
+/* a grid item may shrink below its widest content (long code lines, wide tables scroll inside) */
+main { min-width: 0; }
+.prose pre, .prose table { max-width: 100%; }
+
+/* ------- guides (R26) */
+.router { border: 1px solid var(--rule); border-left: 3px solid var(--o-ruling); border-radius: 6px; padding: 10px 14px; background: var(--ink-2); max-width: 900px; }
+.router .why-line { display: block; color: var(--paper-3); font-size: 12.5px; }
+ul.guides { list-style: none; padding: 0; margin: 0; max-width: 900px; }
+ul.guides li { padding: 8px 0; border-top: 1px solid var(--rule); }
+ul.guides li:first-child { border-top: none; }