feat(rules)!: retire rulebook subscriptions and per-project suppressions (#4052)

A rule's home is its scope now: a rule in a rulebook topic is global, a rule on
a project applies to that project, and retrieval reads that directly (#4074).
A subscription had stopped changing anything a session received; a suppression
muted rules from a subscription. Operator, 2026-09-15: "we have global and
project scoped rules, we don't need the subscriptions now."

What goes, whole (rule 22):
- Migration 0101 drops project_rulebook_subscriptions, project_rule_suppressions
  and project_topic_suppressions, and strips subscribe_rulebooks (and 394's
  leftover exclude_always_on_rulebooks) from stored inception choices.
- Service, MCP and REST: subscribe/unsubscribe and the four suppress/unsuppress
  operations. The Subscribers checklist, the subscribe chips, the skip buttons
  and the Suppressed section in the rules UI.
- Inception asks two questions (design system, seed Systems). create_project and
  decide_project_inception lose subscribe_rulebooks.
- Backup v15 stops exporting the three sections; older archives still restore,
  the keys simply unread. Trash no longer hard-deletes suppression rows.

What changes meaning:
- get_applicable_rules is a project's LISTING: its own rules, plus the global
  rules tagged to an area it works in. Untagged global rules apply everywhere
  and arrive by retrieval, so they are not listed. A co_surfaces partner on a
  different project is not dragged in.
- list_rules(project_id) lists that project's own rules.
- rules_payload drops subscribed_rulebooks and suppressed_*; the handshake's
  brief form is project_rules alone.
- using-scribe's "Where a new rule goes" and inception sections, tool
  docstrings and docs say global vs project. Plugin 2026.09.15.1620.

Milestone 414 step 2.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01821k5B3Ysecp9fNYs92Kuy

frontend/src/components/rules/ProjectRulesTab.vue

@@ -3,24 +3,26 @@ import { ref, onMounted, watch } from "vue";
 import { useRouter } from "vue-router";
 import {
   getProjectApplicableRules,
-  subscribeProject,
-  unsubscribeProject,
-  listRulebooks,
   getRule,
   createProjectRule,
   deleteRule,
-  suppressRuleForProject,
-  unsuppressRuleForProject,
-  suppressTopicForProject,
-  unsuppressTopicForProject,
 } from "@/api/rulebooks";
-import type { ApplicableRules, Rulebook } from "@/api/rulebooks";
+import type { ApplicableRules } from "@/api/rulebooks";
 
+/**
+ * A project's view of its rules (milestone 414). A rule's home is its reach:
+ * the project's own rules apply here and nowhere else, and every global rule
+ * (one in a rulebook) applies here too. There is no subscribing this project
+ * to a rulebook and no skipping a global rule for it — a project that departs
+ * from one writes its own rule and links it with an `overrides` relation.
+ *
+ * The second list is the global rules TAGGED to an area this project works in,
+ * not every global rule: those arrive by retrieval when the work matches them,
+ * and listing them all under every project would say nothing.
+ */
 const props = defineProps<{ projectId: number }>();
 const router = useRouter();
 const applicable = ref<ApplicableRules | null>(null);
-const allRulebooks = ref<Rulebook[]>([]);
-const showPicker = ref(false);
 const expandedRuleIds = ref<Set<number>>(new Set());
 
 const ruleDetails = ref<Record<number, {
@@ -38,22 +40,6 @@ async function load() {
   applicable.value = await getProjectApplicableRules(props.projectId);
 }
 
-async function loadAllRulebooks() {
-  allRulebooks.value = await listRulebooks();
-}
-
-async function subscribe(rulebookId: number) {
-  await subscribeProject(props.projectId, rulebookId);
-  showPicker.value = false;
-  await load();
-}
-
-async function unsubscribe(rulebookId: number) {
-  if (!confirm("Unsubscribe from this rulebook for this project?")) return;
-  await unsubscribeProject(props.projectId, rulebookId);
-  await load();
-}
-
 async function toggleRuleExpand(ruleId: number) {
   if (expandedRuleIds.value.has(ruleId)) {
     expandedRuleIds.value.delete(ruleId);
@@ -143,66 +129,13 @@ async function removeProjectRule(ruleId: number) {
   await load();
 }
 
-const showSuppressed = ref(false);
-
-async function suppressRule(ruleId: number) {
-  await suppressRuleForProject(props.projectId, ruleId);
-  await load();
-}
-
-async function unsuppressRule(ruleId: number) {
-  await unsuppressRuleForProject(props.projectId, ruleId);
-  await load();
-}
-
-async function suppressTopic(topicId: number) {
-  await suppressTopicForProject(props.projectId, topicId);
-  await load();
-}
-
-async function unsuppressTopic(topicId: number) {
-  await unsuppressTopicForProject(props.projectId, topicId);
-  await load();
-}
-
-onMounted(async () => {
-  await load();
-  await loadAllRulebooks();
-});
+onMounted(load);
 
 watch(() => props.projectId, load);
 </script>
 
 <template>
   <div class="rules-tab" v-if="applicable">
-    <section class="subscribed">
-      <h3>Subscribed rulebooks</h3>
-      <div class="chips">
-        <span
-          v-for="rb in applicable.subscribed_rulebooks"
-          :key="rb.id"
-          class="chip"
-        >
-          <a @click="openInRulesView(rb.id)">{{ rb.title }}</a>
-          <button class="chip-remove" @click="unsubscribe(rb.id)" aria-label="Unsubscribe">×</button>
-        </span>
-        <button v-if="!showPicker" class="add" @click="showPicker = true">+ Subscribe</button>
-        <select
-          v-else
-          @change="subscribe(Number(($event.target as HTMLSelectElement).value))"
-        >
-          <option value="">Choose a rulebook…</option>
-          <option
-            v-for="rb in allRulebooks.filter((rb) => !applicable!.subscribed_rulebooks.some((s) => s.id === rb.id))"
-            :key="rb.id"
-            :value="rb.id"
-          >
-            {{ rb.title }}
-          </option>
-        </select>
-      </div>
-    </section>
-
     <section class="project-rules">
       <div class="section-head">
         <h3>Project rules</h3>
@@ -286,9 +219,13 @@ watch(() => props.projectId, load);
     </section>
 
     <section class="applicable">
-      <h3>Applicable rules</h3>
+      <h3>Global rules for this project's areas</h3>
+      <p class="applicable-note">
+        Every global rule applies to this project and arrives when the work matches it.
+        These are the ones tagged to an area this project works in.
+      </p>
       <p v-if="applicable.rules.length === 0" class="empty">
-        No rules yet — subscribe to a rulebook above, or create one at
+        None tagged to this project's areas. Global rules live in
         <a @click="router.push('/rules')">Rulebooks</a>.
       </p>
       <div
@@ -298,26 +235,12 @@ watch(() => props.projectId, load);
       >
         <h4>{{ rb.rulebook_title }}</h4>
         <div v-for="topic in rb.topics" :key="topic.topic_id" class="topic-group">
-          <h5>
-            <span>{{ topic.topic_title }}</span>
-            <button
-              class="skip-btn"
-              :title="`Skip the entire ${topic.topic_title} topic for this project`"
-              @click="suppressTopic(topic.topic_id)"
-            >× skip topic</button>
-          </h5>
+          <h5>{{ topic.topic_title }}</h5>
           <ul>
             <li v-for="r in topic.rules" :key="r.id" class="rule">
-              <div class="rule-head">
-                <div class="rule-head-text" @click="toggleRuleExpand(r.id)">
-                  <span class="rule-title">{{ r.title }}</span>
-                  <span class="rule-statement">{{ r.statement }}</span>
-                </div>
-                <button
-                  class="skip-btn"
-                  title="Skip this rule for this project"
-                  @click.stop="suppressRule(r.id)"
-                >× skip</button>
+              <div class="rule-head" @click="toggleRuleExpand(r.id)">
+                <span class="rule-title">{{ r.title }}</span>
+                <span class="rule-statement">{{ r.statement }}</span>
               </div>
               <div v-if="expandedRuleIds.has(r.id) && ruleDetails[r.id]" class="rule-detail">
                 <div v-if="ruleDetails[r.id].why">
@@ -349,64 +272,25 @@ watch(() => props.projectId, load);
       </p>
     </section>
 
-    <section
-      v-if="applicable.suppressed_rules.length + applicable.suppressed_topics.length > 0"
-      class="suppressed"
-    >
-      <button class="suppressed-toggle" @click="showSuppressed = !showSuppressed">
-        <span>Suppressed ({{ applicable.suppressed_rules.length + applicable.suppressed_topics.length }})</span>
-        <span class="caret">{{ showSuppressed ? "▾" : "▸" }}</span>
-      </button>
-      <div v-if="showSuppressed" class="suppressed-body">
-        <ul v-if="applicable.suppressed_topics.length > 0" class="suppressed-list">
-          <li v-for="t in applicable.suppressed_topics" :key="`topic-${t.id}`">
-            <span class="suppressed-kind">topic</span>
-            <span class="suppressed-path">{{ t.rulebook_title }} → {{ t.title }}</span>
-            <button class="reenable-btn" @click="unsuppressTopic(t.id)">↻ re-enable</button>
-          </li>
-        </ul>
-        <ul v-if="applicable.suppressed_rules.length > 0" class="suppressed-list">
-          <li v-for="r in applicable.suppressed_rules" :key="`rule-${r.id}`">
-            <span class="suppressed-kind">rule</span>
-            <span class="suppressed-path">{{ r.rulebook_title }} → {{ r.topic_title }} → {{ r.title }}</span>
-            <button class="reenable-btn" @click="unsuppressRule(r.id)">↻ re-enable</button>
-          </li>
-        </ul>
-      </div>
-    </section>
   </div>
 </template>
 
 <style scoped>
 .trigger-hint { flex: 1; min-width: 12rem; font-size: 0.75rem; color: var(--fs-text-tertiary); }
 
-.excluded-note { margin: 0 0 0.5rem; color: var(--fs-text-tertiary); font-size: 0.85rem; }
 .rules-tab { padding: 1rem; }
 h3 {
   font-size: 0.9em; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.05em;
   margin-top: 0;
 }
-.chips { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
-.chip {
-  display: inline-flex; align-items: center; gap: 0.25rem;
-  background: var(--fs-accent-soft);
-  padding: 0.25rem 0.5rem; border-radius: 999px;
-}
-.chip a { cursor: pointer; }
-.chip-remove { background: none; border: none; cursor: pointer; opacity: 0.5; font-size: 1.1em; }
-.chip-remove:hover { opacity: 1; }
 .add {
   background: none;
   border: 1px dashed var(--fs-border-color);
   padding: 0.25rem 0.75rem; border-radius: 999px; cursor: pointer;
   color: inherit;
 }
-select {
-  background: var(--fs-surface-page); color: inherit;
-  border: 1px solid var(--fs-border-color); border-radius: 6px;
-  padding: 0.25rem 0.5rem;
-}
 .applicable { margin-top: 2rem; }
+.applicable-note { margin: 0 0 0.75rem; color: var(--fs-text-tertiary); font-size: 0.85rem; }
 .rb-group { margin-bottom: 1.5rem; }
 .rb-group h4 { font-family: Fraunces, serif; font-style: italic; margin-bottom: 0.5rem; }
 /* `.topic-group` is deliberately bare — a namespace for the two h5 rules (this
@@ -441,7 +325,7 @@ ul { list-style: none; padding: 0; margin: 0; }
 }
 .empty, .truncated { opacity: 0.7; font-style: italic; }
 .empty a { cursor: pointer; text-decoration: underline; }
-.project-rules { margin-top: 1.5rem; }
+.project-rules { margin-top: 0; }
 .section-head { display: flex; justify-content: space-between; align-items: center; }
 .new-rule-form {
   display: flex; flex-direction: column; gap: 0.5rem;
@@ -459,49 +343,4 @@ ul { list-style: none; padding: 0; margin: 0; }
   background: none; border: none; cursor: pointer;
   color: var(--fs-destructive); padding: 0.5rem 0 0 0;
 }
-/* Per-rule / per-topic suppress affordance — quiet by default, reveal on hover */
-.topic-group h5 {
-  display: flex; justify-content: space-between; align-items: center; gap: 0.5rem;
-}
-.rule-head {
-  display: flex; justify-content: space-between; align-items: flex-start; gap: 0.5rem;
-}
-.rule-head-text { flex: 1; cursor: pointer; }
-.skip-btn {
-  background: none; border: none; cursor: pointer;
-  color: var(--fs-text-tertiary); font-size: 0.75rem;
-  padding: 0.1rem 0.4rem; opacity: 0; transition: opacity 0.15s;
-  white-space: nowrap;
-}
-.topic-group h5:hover .skip-btn,
-.rule:hover .skip-btn,
-.skip-btn:focus { opacity: 1; }
-.skip-btn:hover { color: var(--fs-destructive); }
-/* Suppressed section */
-.suppressed { margin-top: 1.5rem; }
-.suppressed-toggle {
-  display: flex; align-items: center; gap: 0.4rem;
-  background: none; border: none; cursor: pointer;
-  font-size: 0.85rem; opacity: 0.7; padding: 0.25rem 0; color: inherit;
-}
-.suppressed-toggle:hover { opacity: 1; }
-.suppressed-toggle .caret { font-size: 0.7em; }
-.suppressed-body { margin-top: 0.5rem; }
-.suppressed-list { padding-left: 0; }
-.suppressed-list li {
-  display: flex; align-items: center; gap: 0.5rem;
-  padding: 0.25rem 0; opacity: 0.75;
-}
-.suppressed-kind {
-  font-size: 0.7em; text-transform: uppercase; letter-spacing: 0.05em;
-  padding: 0.1rem 0.4rem; border-radius: 3px;
-  background: var(--fs-surface-page);
-  border: 1px solid var(--fs-border-color);
-}
-.suppressed-path { flex: 1; }
-.reenable-btn {
-  background: none; border: none; cursor: pointer;
-  color: var(--fs-accent); font-size: 0.85em;
-}
-.reenable-btn:hover { text-decoration: underline; }
 </style>