Akte

# Akte

## Philosophy

Akte is the night-shift archive desk where a stamped case files itself. The record is one heavy white case card pulled up out of drawer 7 onto a carbon desk: nine numbered fields, printed form ink separated from the carbon values the machine typed, and a verdict box that says where the stamp goes. Stamping the verdict presses a rubber date stamp into field 08; the card drops back into its row, the records table and counts update, and the next card is pulled up with its tab in the position of its volume letter. Two inks and one exception: the record is set in carbon, phosphor lights only when the machine speaks, vermilion marks only a verdict changed at audit, and a black bar is exactly as long as what it withholds.

### Values

- The case card is the interface: one heavy card per volume, its tab position set by its volume letter.
- Printed form and typed answer are two inks: grey labels and rules ask, carbon Martian Mono answers.
- Phosphor green is the machine's voice only: the prompt, the one action, the highlighter behind 'awaiting stamp'.
- Vermilion only for a verdict changed at audit; black bars only for what an order withholds, exactly as long as it.
- Every fact is a labelled field, with a line saying what the value means.

### Anti-Values

- Scanline textures, phosphor bloom and a green command prompt as the first thing the eye lands on.
- Tractor-feed sprocket rails or fanfold paper without a form behind them.
- A redaction bar over a word everyone can read, or bars used for effect.
- Bordered pill badges, stat bands and decorative rotated stamps over text.
- Aging, coffee stains, torn edges or grunge distress on the record.

### Visual Character

- Carbon desk #12120E with bone text #EDE8D6 and muted #8E866E; wells in #1C1B15.
- A heavy white case card #FFFFFF standing in drawer 7, its file tab in the position of its volume letter and its foot held by the drawer front.
- Nine numbered fields with printed grey labels and rules, the case number as the one large word in Sofia Sans Extra Condensed 800.
- Typed values in Martian Mono at 87.5% width; chrome and prose in Sofia Sans.
- Rubber stamps with a 3px frame at -7deg: carbon for approval, vermilion for an audit exception.
- Black redaction bars exactly as long as the characters they withhold, with the count beside them.
- Phosphor #46F08A only on the one button, the machine's prompt and a misregistered highlighter on the card.

### Lineage

> In-place revision of Akte from arni's range-sorter take akte-d (2026-09-29). It keeps the night-shift archive concept, the carbon desk, bone text, phosphor for the machine, vermilion for audit exception and black for redaction, the Verdikt world and the Overprint pairing, and replaces the one dark continuous surface, the scanlines, sprocket rails and phosphor-first prompt with two materials: the carbon desk and a white case card that files itself.

## Tokens

### Colors

| Name | Value |
|------|-------|
| bg | `#12120E` |
| surface | `#FFFFFF` |
| text | `#EDE8D6` |
| text_2 | `#C9C3AE` |
| muted | `#8E866E` |
| border | `#2F2E28` |
| accent | `#46F08A` |
| on_accent | `#0B0B08` |
| success | `#46F08A` |
| warning | `#E8A33B` |
| error | `#E8541E` |
| info | `#5FB6C4` |
| stamp | `#E8541E` |
| redaction | `#000000` |
| well | `#1C1B15` |

### Derived

- **Card Ink**: var(--bg) on the white card: the typed values and the case number
- **Form Ink**: color-mix(in srgb, var(--bg) 62%, var(--surface)): the card's printed labels, notes and captions
- **Rule**: color-mix(in srgb, var(--bg) 20%, var(--surface)): the card's printed rules, drawn as inset 1px box-shadows
- **Audit Stamp On Card**: color-mix(in srgb, var(--stamp) 82%, var(--bg)): vermilion on the white card, about 4.9:1
- **Highlighter**: var(--accent) behind 'awaiting stamp' with a 2px 1px offset shadow of color-mix(in srgb, var(--accent) 55%, var(--surface)), the misregistered second ink

### Typography

- **Heading Font**: Sofia Sans Extra Condensed
- **Body Font**: Sofia Sans
- **Mono Font**: Martian Mono
- **Heading Weight**: 800
- **Body Weight**: 400
- **Button Weight**: 700
- **Mono Weight**: 400 and 500 at font-stretch 87.5%
- **Heading Transform**: uppercase
- **Letter Spacing**: -0.02em on display; 0.08em on the printed uppercase form labels; 0 on Martian Mono
- **Base Size**: 17px
- **Line Height**: 1.5
- **Scale**: ["12px","14px","15px","17px","22px","28px","40px","64px","136px"]
- **Card Print**: sizes follow the card: 1px is 100cqi/1280 of the page, so the case card keeps its proportions at every width; phones use 100cqi/390 capped at 1.35px
- **Google Fonts Url**: https://fonts.googleapis.com/css2?family=Sofia+Sans+Extra+Condensed:wght@700;800&family=Sofia+Sans:wght@400;500;600;700&family=Martian+Mono:wdth,wght@75..112.5,300..600&display=swap

### Radii

- **None**: 0px
- **Md**: 0px
- **Lg**: 0px
- **Full**: 0px

### Shadows

- **None**: the desk is flat: no drop shadows anywhere
- **Printed Rule**: inset 0 1px 0 rule (or border on the desk): ledger and form rules are printed lines inside the paper, never card edges
- **Stamp Frame**: inset 0 0 0 3px currentColor: the rubber stamp's own frame, part of the impression

### Spacing

- **Base**: 8px
- **Scale**: ["4px","8px","12px","16px","24px","32px","48px","64px","104px"]

### Surfaces

- **Treatment**: two-materials-carbon-desk-and-white-card
- **Material**: Two materials only. The carbon desk #12120E carries the terminal, the controls and the records table. The heavy white case card #FFFFFF carries the record: printed form ink (grey labels and rules) and typed carbon values in Martian Mono. The card stands in drawer 7, its foot held by a #1C1B15 drawer front with a white label.
- **Card Style**: One heavy card per volume, with a file tab whose position is its volume letter (A in position 1, E in position 5). No other cards: lists, tables and forms sit on the desk, parted by printed rules and space.
- **Wells**: #1C1B15 wells on the desk for radio rows, inputs, the chosen filter and hovered rows.
- **Bg Pattern**: none; no scanlines, bloom or sprocket rails

### Borders

- **Default Width**: 0
- **Style**: none; printed rules only
- **Character**: No card edges or accent lines. The ruled record needs rules, so rows and card fields are separated by 1px printed rules drawn as inset box-shadows: #2F2E28 on the desk, the rule mix on the card. The stamp's 3px frame is part of the impression.

### Motion

- **Duration**: 160ms
- **Easing**: steps(2, end)
- **Press**: 200ms cubic-bezier(.2,.9,.3,1.3): the stamp lands at -7deg from scale 1.45 to .96 to 1
- **File**: 560ms cubic-bezier(.55,0,.85,.4): the card drops into its drawer row
- **Pull**: 680ms cubic-bezier(.16,.84,.28,1.06): the next card is pulled up in its place
- **Print**: 120ms steps(2, end): a new terminal line types in
- **Philosophy**: Procedural, not expressive: the stamp presses, the card files itself and the next is pulled. The settled page is the default with no JavaScript, and prefers-reduced-motion drops every animation and transition.

### Controls

- **Height**: 56px primary, 52px option rows, 40px filter tabs
- **Radius**: 0px
- **Well Height**: 52px

## Rules

### Composition

- Put the record on the card and everything else on the desk: the case card on the left, the terminal and verdict controls on the right, the records table and exhibits below.
- Show the whole standing case card once per page, tab up and foot in the drawer front; later views use a part of it (a stamp, a field, a priors card).
- Every fact is a numbered field: a printed label, a typed value, and a line saying what the value means.
- Lists and tables sit on the desk, parted by printed rules; the only filled surfaces are the white card, exhibits and #1C1B15 wells.

### Hierarchy

- One large word per view: the case number on the card in Sofia Sans Extra Condensed 800 at 136px (66px on phones); section titles at 64px (44px on phones), uppercase, -0.02em.
- Prose in Sofia Sans 400 at 17px in two tones: bone for the fact, #C9C3AE for the explanation.
- Martian Mono only for typed values: ids, times, accessions and the terminal.
- Disposition is a plain word: vermilion only for Withheld, phosphor only while the row files, bone otherwise.

### Density

Records density on a calm desk: 104px between sections on desktop and 72px on phones, 14px table row padding, one primary action per view, prose held to about 60 characters.

### Signature Patterns

- The standing case card: a heavy white card pulled up from drawer 7, with a file tab whose position is its volume letter (A to E, positions 1 to 5) and a drawer front holding its foot.
- Two inks on the card: printed grey form labels and rules, typed carbon Martian Mono values.
- The stamp and file: stamping presses a dated rubber stamp into field 08, the card drops into its drawer row, the records table and filter counts update, and the next card is pulled up.
- The exact bar: a black redaction bar exactly as long as what it withholds, with the character count beside it.
- The machine's voice: phosphor only on the terminal prompt, the one action and a misregistered highlighter behind 'awaiting stamp'.

## Layout

### Grid

- **Type**: desk and card: the record on a standing case card beside the terminal
- **Max Width**: the landing scales with the viewport (1px = 100cqi/1280) so the card keeps its proportions; the embodiment caps content at 1240px and centres it
- **Gutter**: 48px desktop, 32px tablet, 16px phone
- **Column Behavior**: The desk is a 9.5in card column (798px at 1280) plus minmax(0,1fr) for the terminal; the exhibits are a 5in card column plus minmax(0,1fr); every grid child has min-width:0.

### Whitespace

- **Section Gap**: 104px desktop, 72px phone
- **Card Gap**: one card per volume; fields sit 18 to 20px apart inside it, parted by printed rules
- **Content Padding**: the card pads 0.3in to 0.4in; desk content aligns to the gutter
- **Approach**: The desk is dark and quiet so the white card reads as the record. Printed rules separate fields and rows; space separates groups.

### Density

- **Default**: comfortable
- **Comfortable**: {"button_height":"56px","input_height":"52px","row_height":"48 to 52px table rows"}

### Responsive

Phones (390px) stack the card above the terminal, drop the drawer's second label and the table's handler, case, pulled and priors columns, set the fields in two columns and let the audit lines wrap. Tablets (768 to 1100px) keep the card and terminal side by side at the scaled size. From 1800px the landing scales up whole; the embodiment caps and centres.

### Breakpoints

- **Mobile**: 390px
- **Phone Max**: 600px
- **Tablet**: 834px
- **Desktop**: 1280px
- **Wide**: 1800px
- **Ultrawide**: 2560px

## Guidance

### Do

- Start from the carbon desk and put the record on one white case card.
- Set the card's tab in the position of its volume letter and name the drawer and row it lives in.
- Separate printed form ink (grey labels, rules) from typed carbon values in Martian Mono.
- Make every redaction bar exactly as long as what it withholds and print the count beside it.
- Keep phosphor for the machine: the prompt, the one action and the awaiting-stamp highlighter.
- Use vermilion only for a verdict changed at audit, as a word or a stamp.
- Style every control explicitly: square #1C1B15 wells, a 2px phosphor inset focus ring.

### Don't

- Don't add scanlines, bloom, sprocket rails or fanfold paper.
- Don't put a black bar over a word that is not withheld, or make it longer than what it covers.
- Don't use pill badges, stat bands or decorative stamps over text; dispositions are plain words.
- Don't show more than one standing case card per page, or nest cards.
- Don't age or distress the paper; the record is clean.
- Don't round corners, add glow or glass, or put emoji on buttons.

### Accessibility

Bone #EDE8D6 on carbon is 15.3:1, #C9C3AE is 10.6:1 and muted #8E866E is 5.2:1 (4.75:1 on a well). On the white card, carbon values are 18.8:1 and form ink #6C6C6A is 5.3:1. Phosphor #46F08A carries dark #0B0B08 labels (13.2:1) and is never small text on white. The audit stamp mixes vermilion 82% with carbon on the card (#C1481B, 5.0:1) and uses #E8541E as is on carbon (5.1:1). Focus is a 2px phosphor inset ring. Reduced motion removes the press, the filing and the pull; the stamp still lands and the table still updates.

### Usage Context

Case management, audit and review queues, records and compliance tools, archives, moderation desks and any product where a human stamps a machine's recommendation.

## Imagery Direction

### Pairs With

overprint

### Art Style Id

en-019ef5c3-822d-7970-bfea-69bbe3073a55

### Summary

Overprint risograph plates: dense black-ink linework, halftone and engraved hatching with one misregistered phosphor-green layer, on white paper levelled to the card's #FFFFFF so the plate sits on the case card as a printed plate.

### Subjects

- looking down into drawer 7 with the empty slot where the card stood
- rows of upright dossier folders with their tab edges
- steel drawer fronts and label holders
- a single case card standing in its drawer

### Usage

One plate on the landing: the drawer seen from above, painted with var(--hero-image) on the case card at 1760:560, captioned with what it shows. The embodiment carries no illustration; the card and stamp are the objects.

### Avoid

Text or numbers in the plate, people, a green wash over the whole picture, scanlines, photographic rendering and anything placed under copy.

---
version: "alpha"
name: "Akte"
description: "Akte is the night-shift archive desk where a stamped case files itself. The record is one heavy white case card pulled up out of drawer 7 onto a carbon desk: nine numbered fields, printed form ink separated from the carbon values the mac..."
colors:
  bg: "#12120E"
  surface: "#FFFFFF"
  text: "#EDE8D6"
  text_2: "#C9C3AE"
  muted: "#8E866E"
  border: "#2F2E28"
  accent: "#46F08A"
  on_accent: "#0B0B08"
  success: "#46F08A"
  warning: "#E8A33B"
  error: "#E8541E"
  info: "#5FB6C4"
  stamp: "#E8541E"
  redaction: "#000000"
  well: "#1C1B15"
typography:
  headline-lg:
    fontFamily: "Sofia Sans Extra Condensed"
    fontSize: "2.075rem"
    fontWeight: 700
    lineHeight: 1.1
    letterSpacing: "-0.02em"
  headline-md:
    fontFamily: "Sofia Sans Extra Condensed"
    fontSize: "1.66rem"
    fontWeight: 600
    lineHeight: 1.15
    letterSpacing: "-0.02em"
  body-md:
    fontFamily: "Sofia Sans"
    fontSize: "17px"
    fontWeight: 400
    lineHeight: 1.5
    letterSpacing: "-0.02em"
  label-md:
    fontFamily: "Martian Mono"
    fontSize: "0.75rem"
    fontWeight: 600
    lineHeight: 1
    letterSpacing: "0.08em"
rounded:
  none: "0px"
  md: "0px"
  lg: "0px"
  full: "0px"
spacing:
  base: "8px"
  xs: "4px"
  sm: "8px"
  md: "12px"
  lg: "16px"
  xl: "24px"
  2xl: "32px"
  3xl: "48px"
  4xl: "64px"
  step-8: "104px"
components:
  color-reference-bg:
    backgroundColor: "{colors.bg}"
  color-reference-surface:
    backgroundColor: "{colors.surface}"
  color-reference-text:
    backgroundColor: "{colors.text}"
  color-reference-text_2:
    backgroundColor: "{colors.text_2}"
  color-reference-muted:
    backgroundColor: "{colors.muted}"
  color-reference-border:
    backgroundColor: "{colors.border}"
  color-reference-accent:
    backgroundColor: "{colors.accent}"
  color-reference-on_accent:
    backgroundColor: "{colors.on_accent}"
  color-reference-success:
    backgroundColor: "{colors.success}"
  color-reference-warning:
    backgroundColor: "{colors.warning}"
  color-reference-error:
    backgroundColor: "{colors.error}"
  color-reference-info:
    backgroundColor: "{colors.info}"
  color-reference-stamp:
    backgroundColor: "{colors.stamp}"
  color-reference-redaction:
    backgroundColor: "{colors.redaction}"
  color-reference-well:
    backgroundColor: "{colors.well}"
  button-primary:
    backgroundColor: "{colors.accent}"
    textColor: "{colors.on_accent}"
    typography: "{typography.label-md}"
    rounded: "{rounded.md}"
    padding: "{spacing.md}"
  card-surface:
    backgroundColor: "{colors.surface}"
    textColor: "{colors.text}"
    rounded: "{rounded.md}"
    padding: "{spacing.md}"
  input-default:
    backgroundColor: "{colors.surface}"
    textColor: "{colors.text}"
    rounded: "{rounded.md}"
    height: "44px"
---

# Akte

## Overview

Akte is the night-shift archive desk where a stamped case files itself. The record is one heavy white case card pulled up out of drawer 7 onto a carbon desk: nine numbered fields, printed form ink separated from the carbon values the machine typed, and a verdict box that says where the stamp goes. Stamping the verdict presses a rubber date stamp into field 08; the card drops back into its row, the records table and counts update, and the next card is pulled up with its tab in the position of its volume letter. Two inks and one exception: the record is set in carbon, phosphor lights only when the machine speaks, vermilion marks only a verdict changed at audit, and a black bar is exactly as long as what it withholds.

### Values

- The case card is the interface: one heavy card per volume, its tab position set by its volume letter.
- Printed form and typed answer are two inks: grey labels and rules ask, carbon Martian Mono answers.
- Phosphor green is the machine's voice only: the prompt, the one action, the highlighter behind 'awaiting stamp'.
- Vermilion only for a verdict changed at audit; black bars only for what an order withholds, exactly as long as it.
- Every fact is a labelled field, with a line saying what the value means.

### Anti-Values

- Scanline textures, phosphor bloom and a green command prompt as the first thing the eye lands on.
- Tractor-feed sprocket rails or fanfold paper without a form behind them.
- A redaction bar over a word everyone can read, or bars used for effect.
- Bordered pill badges, stat bands and decorative rotated stamps over text.
- Aging, coffee stains, torn edges or grunge distress on the record.

### Visual Character

- Carbon desk #12120E with bone text #EDE8D6 and muted #8E866E; wells in #1C1B15.
- A heavy white case card #FFFFFF standing in drawer 7, its file tab in the position of its volume letter and its foot held by the drawer front.
- Nine numbered fields with printed grey labels and rules, the case number as the one large word in Sofia Sans Extra Condensed 800.
- Typed values in Martian Mono at 87.5% width; chrome and prose in Sofia Sans.
- Rubber stamps with a 3px frame at -7deg: carbon for approval, vermilion for an audit exception.
- Black redaction bars exactly as long as the characters they withhold, with the count beside them.
- Phosphor #46F08A only on the one button, the machine's prompt and a misregistered highlighter on the card.

### Lineage

> In-place revision of Akte from arni's range-sorter take akte-d (2026-09-29). It keeps the night-shift archive concept, the carbon desk, bone text, phosphor for the machine, vermilion for audit exception and black for redaction, the Verdikt world and the Overprint pairing, and replaces the one dark continuous surface, the scanlines, sprocket rails and phosphor-first prompt with two materials: the carbon desk and a white case card that files itself.

## Colors

Use the YAML color tokens as the normative palette. The prose below names the roles agents should preserve when generating UI.

| Token | Value |
|-------|-------|
| bg | `#12120E` |
| surface | `#FFFFFF` |
| text | `#EDE8D6` |
| text_2 | `#C9C3AE` |
| muted | `#8E866E` |
| border | `#2F2E28` |
| accent | `#46F08A` |
| on_accent | `#0B0B08` |
| success | `#46F08A` |
| warning | `#E8A33B` |
| error | `#E8541E` |
| info | `#5FB6C4` |
| stamp | `#E8541E` |
| redaction | `#000000` |
| well | `#1C1B15` |

## Typography

Load the fonts from Google Fonts: https://fonts.googleapis.com/css2?family=Sofia+Sans+Extra+Condensed:wght@700;800&family=Sofia+Sans:wght@400;500;600;700&family=Martian+Mono:wdth,wght@75..112.5,300..600&display=swap

- **Headline-Lg**: Sofia Sans Extra Condensed, 2.075rem, weight 700, line-height 1.1.
- **Headline-Md**: Sofia Sans Extra Condensed, 1.66rem, weight 600, line-height 1.15.
- **Body-Md**: Sofia Sans, 17px, weight 400, line-height 1.5.
- **Label-Md**: Martian Mono, 0.75rem, weight 600, line-height 1.

## Layout

### Spacing Tokens

- **Base**: `8px`
- **Xs**: `4px`
- **Sm**: `8px`
- **Md**: `12px`
- **Lg**: `16px`
- **Xl**: `24px`
- **2xl**: `32px`
- **3xl**: `48px`
- **4xl**: `64px`
- **Step-8**: `104px`

### Grid

- **Type**: desk and card: the record on a standing case card beside the terminal
- **Max Width**: the landing scales with the viewport (1px = 100cqi/1280) so the card keeps its proportions; the embodiment caps content at 1240px and centres it
- **Gutter**: 48px desktop, 32px tablet, 16px phone
- **Column Behavior**: The desk is a 9.5in card column (798px at 1280) plus minmax(0,1fr) for the terminal; the exhibits are a 5in card column plus minmax(0,1fr); every grid child has min-width:0.

### Whitespace

- **Section Gap**: 104px desktop, 72px phone
- **Card Gap**: one card per volume; fields sit 18 to 20px apart inside it, parted by printed rules
- **Content Padding**: the card pads 0.3in to 0.4in; desk content aligns to the gutter
- **Approach**: The desk is dark and quiet so the white card reads as the record. Printed rules separate fields and rows; space separates groups.

### Density

- **Default**: comfortable
- **Comfortable**: {"button_height":"56px","input_height":"52px","row_height":"48 to 52px table rows"}

### Responsive

Phones (390px) stack the card above the terminal, drop the drawer's second label and the table's handler, case, pulled and priors columns, set the fields in two columns and let the audit lines wrap. Tablets (768 to 1100px) keep the card and terminal side by side at the scaled size. From 1800px the landing scales up whole; the embodiment caps and centres.

### Breakpoints

- **Mobile**: 390px
- **Phone Max**: 600px
- **Tablet**: 834px
- **Desktop**: 1280px
- **Wide**: 1800px
- **Ultrawide**: 2560px

## Elevation & Depth

### Shadows

- **None**: the desk is flat: no drop shadows anywhere
- **Printed Rule**: inset 0 1px 0 rule (or border on the desk): ledger and form rules are printed lines inside the paper, never card edges
- **Stamp Frame**: inset 0 0 0 3px currentColor: the rubber stamp's own frame, part of the impression

## Shapes

### Rounded

- **None**: `0px`
- **Md**: `0px`
- **Lg**: `0px`
- **Full**: `0px`

### Surfaces

- **Treatment**: two-materials-carbon-desk-and-white-card
- **Material**: Two materials only. The carbon desk #12120E carries the terminal, the controls and the records table. The heavy white case card #FFFFFF carries the record: printed form ink (grey labels and rules) and typed carbon values in Martian Mono. The card stands in drawer 7, its foot held by a #1C1B15 drawer front with a white label.
- **Card Style**: One heavy card per volume, with a file tab whose position is its volume letter (A in position 1, E in position 5). No other cards: lists, tables and forms sit on the desk, parted by printed rules and space.
- **Wells**: #1C1B15 wells on the desk for radio rows, inputs, the chosen filter and hovered rows.
- **Bg Pattern**: none; no scanlines, bloom or sprocket rails

### Borders

- **Default Width**: 0
- **Style**: none; printed rules only
- **Character**: No card edges or accent lines. The ruled record needs rules, so rows and card fields are separated by 1px printed rules drawn as inset box-shadows: #2F2E28 on the desk, the rule mix on the card. The stamp's 3px frame is part of the impression.

## Components

### Composition

- Put the record on the card and everything else on the desk: the case card on the left, the terminal and verdict controls on the right, the records table and exhibits below.
- Show the whole standing case card once per page, tab up and foot in the drawer front; later views use a part of it (a stamp, a field, a priors card).
- Every fact is a numbered field: a printed label, a typed value, and a line saying what the value means.
- Lists and tables sit on the desk, parted by printed rules; the only filled surfaces are the white card, exhibits and #1C1B15 wells.

### Hierarchy

- One large word per view: the case number on the card in Sofia Sans Extra Condensed 800 at 136px (66px on phones); section titles at 64px (44px on phones), uppercase, -0.02em.
- Prose in Sofia Sans 400 at 17px in two tones: bone for the fact, #C9C3AE for the explanation.
- Martian Mono only for typed values: ids, times, accessions and the terminal.
- Disposition is a plain word: vermilion only for Withheld, phosphor only while the row files, bone otherwise.

### Density

Records density on a calm desk: 104px between sections on desktop and 72px on phones, 14px table row padding, one primary action per view, prose held to about 60 characters.

### Signature Patterns

- The standing case card: a heavy white card pulled up from drawer 7, with a file tab whose position is its volume letter (A to E, positions 1 to 5) and a drawer front holding its foot.
- Two inks on the card: printed grey form labels and rules, typed carbon Martian Mono values.
- The stamp and file: stamping presses a dated rubber stamp into field 08, the card drops into its drawer row, the records table and filter counts update, and the next card is pulled up.
- The exact bar: a black redaction bar exactly as long as what it withholds, with the character count beside it.
- The machine's voice: phosphor only on the terminal prompt, the one action and a misregistered highlighter behind 'awaiting stamp'.

## shadcn/ui Usage

When the target app uses shadcn/ui, copy DESIGN.md with shadcn instead of the plain DESIGN.md. It contains the same Katagami design-language source plus the shadcn/ui primitives, imports, theme variables, component recipes, and preview-shot guidance.

DESIGN.md with shadcn: `/language/en-01a0ee82-2941-7441-a26d-2624182253b0/DESIGN.with-shadcn.md`.

Machine-readable companions for automation: `/language/en-01a0ee82-2941-7441-a26d-2624182253b0/shadcn.json` (registry theme), `/language/en-01a0ee82-2941-7441-a26d-2624182253b0/shadcn-components.md` (component recipes) and `/language/en-01a0ee82-2941-7441-a26d-2624182253b0/shadcn-shots.json` (preview shots). The human-facing handoff is still DESIGN.md with shadcn.

Install recommended primitives with `npx shadcn@latest add button card input textarea select dialog sheet tabs badge separator checkbox switch slider tooltip dropdown-menu table`.

Use these primitives in shadcn apps:
- button
- card
- input
- textarea
- select
- dialog
- sheet
- tabs
- badge
- separator
- checkbox
- switch
- slider
- tooltip
- dropdown-menu
- table

Implementation rule for agents: import shadcn primitives from `@/components/ui/*`, apply the generated CSS variables first, then compose the language-specific recipes from the companion MD. Katagami remains the source of truth; shadcn names are the implementation surface.

## Do's and Don'ts

- Do Start from the carbon desk and put the record on one white case card.
- Do Set the card's tab in the position of its volume letter and name the drawer and row it lives in.
- Do Separate printed form ink (grey labels, rules) from typed carbon values in Martian Mono.
- Do Make every redaction bar exactly as long as what it withholds and print the count beside it.
- Do Keep phosphor for the machine: the prompt, the one action and the awaiting-stamp highlighter.
- Do Use vermilion only for a verdict changed at audit, as a word or a stamp.
- Do Style every control explicitly: square #1C1B15 wells, a 2px phosphor inset focus ring.
- Don't Don't add scanlines, bloom, sprocket rails or fanfold paper.
- Don't Don't put a black bar over a word that is not withheld, or make it longer than what it covers.
- Don't Don't use pill badges, stat bands or decorative stamps over text; dispositions are plain words.
- Don't Don't show more than one standing case card per page, or nest cards.
- Don't Don't age or distress the paper; the record is clean.
- Don't Don't round corners, add glow or glass, or put emoji on buttons.

### Accessibility

Bone #EDE8D6 on carbon is 15.3:1, #C9C3AE is 10.6:1 and muted #8E866E is 5.2:1 (4.75:1 on a well). On the white card, carbon values are 18.8:1 and form ink #6C6C6A is 5.3:1. Phosphor #46F08A carries dark #0B0B08 labels (13.2:1) and is never small text on white. The audit stamp mixes vermilion 82% with carbon on the card (#C1481B, 5.0:1) and uses #E8541E as is on carbon (5.1:1). Focus is a 2px phosphor inset ring. Reduced motion removes the press, the filing and the pull; the stamp still lands and the table still updates.

### Usage Context

Case management, audit and review queues, records and compliance tools, archives, moderation desks and any product where a human stamps a machine's recommendation.

## Imagery Direction

### Pairs With

overprint

### Art Style Id

en-019ef5c3-822d-7970-bfea-69bbe3073a55

### Summary

Overprint risograph plates: dense black-ink linework, halftone and engraved hatching with one misregistered phosphor-green layer, on white paper levelled to the card's #FFFFFF so the plate sits on the case card as a printed plate.

### Subjects

- looking down into drawer 7 with the empty slot where the card stood
- rows of upright dossier folders with their tab edges
- steel drawer fronts and label holders
- a single case card standing in its drawer

### Usage

One plate on the landing: the drawer seen from above, painted with var(--hero-image) on the case card at 1760:560, captioned with what it shows. The embodiment carries no illustration; the card and stamp are the objects.

### Avoid

Text or numbers in the plate, people, a green wash over the whole picture, scanlines, photographic rendering and anything placed under copy.

```json
{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "akte",
  "type": "registry:theme",
  "title": "Akte shadcn Theme",
  "cssVars": {
    "theme": {},
    "light": {
      "background": "#12120E",
      "foreground": "#EDE8D6",
      "card": "#FFFFFF",
      "card-foreground": "#EDE8D6",
      "popover": "#FFFFFF",
      "popover-foreground": "#EDE8D6",
      "primary": "#EDE8D6",
      "primary-foreground": "#111111",
      "secondary": "#f4f4f5",
      "secondary-foreground": "#111111",
      "muted": "#8E866E",
      "muted-foreground": "#EDE8D6",
      "accent": "#46F08A",
      "accent-foreground": "#111111",
      "destructive": "#E8541E",
      "border": "#2F2E28",
      "input": "#2F2E28",
      "ring": "#46F08A",
      "chart-1": "#EDE8D6",
      "chart-2": "#f4f4f5",
      "chart-3": "#46F08A",
      "chart-4": "#46F08A",
      "chart-5": "#E8A33B",
      "sidebar": "#FFFFFF",
      "sidebar-foreground": "#EDE8D6",
      "sidebar-primary": "#EDE8D6",
      "sidebar-primary-foreground": "#111111",
      "sidebar-accent": "#5FB6C4",
      "sidebar-accent-foreground": "#ffffff",
      "sidebar-border": "#2F2E28",
      "sidebar-ring": "#46F08A",
      "radius": "0px"
    },
    "dark": {
      "background": "#0f1115",
      "foreground": "#f8fafc",
      "card": "#181b22",
      "card-foreground": "#f8fafc",
      "popover": "#181b22",
      "popover-foreground": "#f8fafc",
      "primary": "#EDE8D6",
      "primary-foreground": "#111111",
      "secondary": "#252a33",
      "secondary-foreground": "#f8fafc",
      "muted": "#252a33",
      "muted-foreground": "#a1a1aa",
      "accent": "#46F08A",
      "accent-foreground": "#111111",
      "destructive": "#E8541E",
      "border": "#303642",
      "input": "#303642",
      "ring": "#46F08A",
      "chart-1": "#EDE8D6",
      "chart-2": "#f4f4f5",
      "chart-3": "#46F08A",
      "chart-4": "#46F08A",
      "chart-5": "#E8A33B",
      "sidebar": "#181b22",
      "sidebar-foreground": "#f8fafc",
      "sidebar-primary": "#EDE8D6",
      "sidebar-primary-foreground": "#111111",
      "sidebar-accent": "#46F08A",
      "sidebar-accent-foreground": "#111111",
      "sidebar-border": "#303642",
      "sidebar-ring": "#46F08A",
      "radius": "0px"
    }
  },
  "meta": {
    "source": "katagami",
    "languageId": "en-01a0ee82-2941-7441-a26d-2624182253b0",
    "slug": "akte",
    "componentManifest": [
      "button",
      "card",
      "input",
      "textarea",
      "select",
      "dialog",
      "sheet",
      "tabs",
      "badge",
      "separator",
      "checkbox",
      "switch",
      "slider",
      "tooltip",
      "dropdown-menu",
      "table"
    ],
    "installCommand": "npx shadcn@latest add button card input textarea select dialog sheet tabs badge separator checkbox switch slider tooltip dropdown-menu table",
    "nativeTokenNames": {
      "colors": [
        "accent",
        "bg",
        "border",
        "error",
        "info",
        "muted",
        "on_accent",
        "redaction",
        "stamp",
        "success",
        "surface",
        "text",
        "text_2",
        "warning",
        "well"
      ],
      "derived": [
        "audit_stamp_on_card",
        "card_ink",
        "form_ink",
        "highlighter",
        "rule"
      ],
      "typography": [
        "base_size",
        "body_font",
        "body_weight",
        "button_weight",
        "card_print",
        "google_fonts_url",
        "heading_font",
        "heading_transform",
        "heading_weight",
        "letter_spacing",
        "line_height",
        "mono_font",
        "mono_weight",
        "scale"
      ],
      "radii": [
        "full",
        "lg",
        "md",
        "none"
      ],
      "shadows": [
        "none",
        "printed_rule",
        "stamp_frame"
      ],
      "spacing": [
        "base",
        "scale"
      ],
      "surfaces": [
        "bg_pattern",
        "card_style",
        "material",
        "treatment",
        "wells"
      ],
      "borders": [
        "character",
        "default_width",
        "style"
      ],
      "motion": [
        "duration",
        "easing",
        "file",
        "philosophy",
        "press",
        "print",
        "pull"
      ],
      "controls": [
        "height",
        "radius",
        "well_height"
      ]
    }
  }
}
```