Counsel states the objective. Preceda prepares the matter.

Paper, ink, binding.

The palette behaves like a law report, not a dashboard. Surface differences are close and structural; oxblood marks action and obligation; gilt is used sparingly for edition detail.

The record sets the rhythm.

Newsreader carries thought and argument. Inter handles navigation and controls. JetBrains Mono isolates citations, identifiers, and machine-readable detail.

One clear next act.

Primary actions are compact and binding. Secondary choices keep the paper visible; fields use rules and labels instead of decorative containers.

Chrome yields to the draft.

Tabs orient without becoming navigation furniture. Sheets use rules, spacing, and typographic contrast to hold dense legal work.

Ask precisely. Return counsel to the work.

A dialogue contains one bounded question, enough context to answer it, and an explicit way back to the prior place in the draft.

In this edition.

Each page is rendered from the package’s own CSS and components. Every entry states its principle, anatomy, variants and states in Paper and Lamp, its behaviour at 390 px, and how to use it.

1. 01Overview

   What the package owns, how to install it, and how the six tiers complete it.

2. 02Foundations

   Colour, type roles, space, layers and breakpoints: the values every contract is built from.

3. 03Status & tone

   Five tone roles and the ten verification statuses, in margin and superscript form.

4. 04Icons

   Printed-rule line drawings on a 24 grid: the set at 16, 20 and 24, and how to use it.

5. 05Marks

   The sealed P, the PRECEDA wordmark and the lockup, drawn as Newsreader outlines in currentColor, the icons generated from them, and the head and preview card every page ships.

6. 06Controls

   The acts and fields counsel touches: buttons in five weights, text, search, choices, the combobox, attaching files, correcting a fact in place, and the Paper · Lamp switch.

7. 07Navigation

   How counsel moves: links in four forms, the masthead and its phone counterparts, the breadcrumb, desk and utility tabs, and the foot of a long register.

8. 08Feedback

   Work in progress, known quantities, arriving type, notes to counsel, confirmations, empty desks and error pages. Words carry the meaning; oxblood marks it; nothing spins.

9. 09Overlays

   Dialogs, confirms, menus, popovers, tooltips, the mobile sheet and its dock, the tour’s coachmark. Native top layer, focus in and back, Esc everywhere, and the desk never lost.

10. 10Record

    Ledger, table, register, disclosure, timeline, status label and figure: the record of a matter, set on printed rules.

11. 11Legal

    Citations, authorities, verification marks, margin notes, the numbered document sheet, the toolbar, the filing checklist, the case head, the statute and the bench record.

12. 12Correspondence

    Letters, working notes, the fact request, next steps, the memo pointer and the composer: the left column of the matter.

13. 13Letters

    Letters from Chambers: the email letterhead and every letter Preceda posts, each rendered as a mail client shows it, in Paper and Lamp, beside its plain-text twin.

14. 14Marketing

    The front page of the reporter as CSS contracts for preceda.ai: masthead, section head, hero, edition card, admission, footer and colophon. Paper by default; Lamp by tokens.

15. 150.1 primitives

    The 0.1 classes, kept so existing markup keeps working. Each is superseded by a 0.2 contract (Button, Link, Field, Tabs, Dialog, DocumentSheet, Citation); use those for new work.

16. 16Compositions

    Full screens assembled only from package components. Built in the integration pass after every tier lands.