docs: document tactical dossier UI style and usage protocol

Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent)

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>

AGENTS.md

@@ -356,6 +356,33 @@ shadcn/ui components live in `src/components/ui/`. Use `bunx shadcn@latest add <
 
 **Rule**: always prefer shadcn/ui components (Dialog, Button, Input, Textarea, Select, etc.) over raw HTML elements or custom-built alternatives. Only build new components when no existing shadcn component fits the need. Do not override shadcn's default dark theme classes with custom `bg-*` `border-*` overrides — the admin panel's theme handles styling.
 
+### Tactical "dossier" style (Battlefield-style UI)
+
+An approved militaristic/intel-interface style for feature surfaces. The user (Jason) likes it a lot. Reference implementation: the official campaign cards (v0.2.27):
+
+- Component: `src/components/frontend/intelligence/CampaignCard.tsx` (official variant, `size="lg"`; community cards keep the conventional style for contrast)
+- Effects CSS: `src/app/(frontend)/styles.css` (`.glitch-hover`, `.glitch-ghost`, `.glitch-shard-a/b/c`, `.glitch-soft`, `.glitch-soft-late`, `.glitch-ghost-img-a/b` + their keyframes; trust the file for current values, the list here describes intent)
+
+The recipe (each piece is separable; use subsets, do not feel obliged to use all):
+
+1. **Classification strip**: full-width top bar (`bg-black/50 backdrop-blur-sm border-b border-white/15`), 9px `font-mono uppercase tracking-widest text-white/60` labels at both ends (e.g. `OFFICIAL // UNIT COMMAND` left, a deterministic `REF ###` derived from the record id right).
+2. **Corner brackets**: four 1px `white/25` L-marks inset from the edges (`inset-2`, `size-3`, per-corner border sides), brightening to `white/60` on hover. `pointer-events-none` + `aria-hidden`.
+3. **Squared corners**: `rounded-none` on the tactical surface only; sibling/secondary surfaces keep `rounded-lg`. The contrast is deliberate.
+4. **Military status language**: squared pill (`rounded-sm`) or plain colored text, uppercase relabels (e.g. Concept → Planning, In Progress → Active Deployment, Completed → Concluded). The status color renders as **text** (`text-blue-400` / `text-emerald-400` / `text-muted-foreground`); do not duplicate status in two places on one card.
+5. **Readout footer**: a permanent (not hover-only) single-line bar (`border-t border-white/15 bg-black/60 py-1.5 backdrop-blur-sm`), cells `flex-1` separated by hairline `border-r border-white/15`, each cell a `font-mono text-xs tabular-nums text-white/80` value plus a 9px uppercase `text-white/50` label (e.g. `3 MSNS`, `4h 0m DURATION`). No owner/DIR cell unless the user wants it.
+6. **Darkened cover imagery**: image at `opacity-15` (hover 25) under a heavy gradient (`from-black/85 via-black/60 to-black/25`) so text stays readable.
+7. **Faint grid texture**: 1px white grid lines, 28px cells, `opacity-[0.04]` (hover 0.07), `motion-reduce` honored.
+8. **One-shot glitch hover** (only with explicit user opt-in; it is extra motion): every layer fires instantly at 0% then decays; steps-based chaos only in the first ~15-20% of the animation; title/soft text restore to readable within ~25-35%; chromatic aberration via paired cyan/rose `text-shadow`; title shards are duplicated absolutely-positioned `aria-hidden` spans clipped by slanted `clip-path` polygons (cyan `#22d3ee`, rose `#f43f5e`, white); image tears use two ghost `<img>` copies clipped to horizontal bands so pieces shift but nothing ever disappears (never animate `opacity: inherit` on an image, it flashes to full brightness). Image band decay may run longer (2s) than text (1s). Everything is one-shot (no `infinite`) and fully disabled under `prefers-reduced-motion`.
+
+Where it fits: large feature/hero cards, section headers, showcase surfaces. Where it does not: dense data UI, tables, forms, dialogs, buttons, or anything shadcn-styled (the shadcn rule above still governs those). Consistency rule: within one page, secondary surfaces stay conventional so the tactical surface stands out.
+
+#### Protocol: offer, demo, or default (MANDATORY)
+
+Whenever creating a new component or refactoring an existing component's styling, **ask the user** whether they want to try applying the tactical dossier style to it. Concretely:
+
+- **Yes**: demo similar styling on that component first (same approach as the campaign cards: build it, let the user eyeball it, iterate on tuning). 
+- **No, or no answer**: stick with the existing styling conventions (shadcn + the site's dark theme conventions). Do not apply tactical styling unasked, and do not nag: ask once, then proceed either way.
+
 ## Environment
 
 - `.env` — local dev (PostgreSQL connection string + PAYLOAD_SECRET)