All 15 lockup families. All tokens. A4 clinical print. Forbidden wall. Decision inbox. One file — copy directly into production.
HEALTHCARE (10 chars) and INSPIRON (8 chars) must occupy identical pixel widths using display:flex; justify-content:space-between on a fixed-width container. Never letter-spacing.
/* LAW OF EQUALITY — copy this pattern */
.hi-wordmark {
display: flex;
flex-direction: column;
gap: calc(var(--x) * 0.45);
width: 170px; /* fixed — same for both rows */
}
.hi-row {
display: flex;
justify-content: space-between; /* ← KEY: never letter-spacing */
text-transform: uppercase;
line-height: 1;
}
.hi-desc { font-weight: 300; font-size: 10px; color: rgba(255,255,255,.65); }
.hi-brand { font-weight: 700; font-size: 26px; color: var(--teal); }Patient CBC results loaded. 2 values outside reference range.
/* GLASS CARD — canonical values */
.card-glass {{
background: var(--surface-glass); /* rgba(255,255,255,.05) */
border: 1px solid var(--border-glass); /* rgba(255,255,255,.12) */
border-radius: 16px;
padding: calc(var(--x) * 3); /* 36px = 3X */
backdrop-filter: blur(15px); /* locked blur value */
}}
/* NAV — canonical values */
nav.hi-nav {{
position: fixed; top: 0; left: 0; right: 0;
height: 70px;
background: rgba(1,4,9,.9);
backdrop-filter: blur(15px);
border-bottom: 1px solid var(--border-glass);
}}| Test | Result | Units | Reference Range | Flag | Method |
|---|---|---|---|---|---|
| Haemoglobin (Hb) | 13.8 | g/dL | 13.5 – 17.5 | Normal | Colorimetric |
| WBC Count | 5.4 | ×10³/µL | 4.5 – 11.0 | Normal | Impedance |
| Platelet Count | 88 | ×10³/µL | 150 – 400 | ↓ LOW | Impedance |
| Random Blood Glucose | 6.1 | mmol/L | 3.9 – 7.8 | Normal | Enzymatic |
| Serum Creatinine | 1.42 | mg/dL | 0.74 – 1.35 | ↑ HIGH | Jaffe |
| TSH | 2.1 | mIU/L | 0.4 – 4.0 | Normal | CLIA |
@media print {{
nav, .no-print {{ display: none !important; }}
body {{ background: #FFFFFF; color: #1A2B2A; }}
.card-glass {{ backdrop-filter: none; background: #F6F8FA; border: 1px solid #D0D7DE; }}
/* Swap to print palette */
:root {{
--teal: #0D9488; /* --teal-pr */
--amber: #D97706; /* --amber-pr */
--bg: #FFFFFF;
--text: #1A2B2A;
}}
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}}Any use of red (--danger #F85149) as a brand colour, CTA, or decorative element. --danger is ONLY for data flags in clinical tables.
✓ DO: Use --teal for CTAs, --amber for highlights.
Any pink, lavender, or pastel palette. Violates forensic MedTech positioning.
✓ DO: Stick to teal/amber/dark token set.
INSPIRON TECH parent tokens bleeding into HEALTHCARE INSPIRON surfaces. Two different brand systems.
✓ DO: V14 is REFERENCE ONLY. Never render parent tokens in HI UI.
No gradient fills on SVG paths or wordmark characters. Flat tone only — CMYK-safe, print-safe, legible at all sizes.
✓ DO: Use solid fills from token set.
letter-spacing distorts the Law of Equality. Character widths become unequal. HEALTHCARE and INSPIRON rows diverge at any non-zero tracking value.
✓ DO: span-flex justify-content:space-between only.
Italic type on the descriptor row violates the precision/clinical tone. Forensic systems do not italicise.
✓ DO: font-weight:300 upright only.
Inter, Helvetica, system-ui as wordmark font. Neo Sans Pro must be loaded from CDN. If it fails, show fallback gracefully — never lock to Inter.
✓ DO: Load NeoSansPro-*.woff from https://inspiron.tech/fonts/
Redrawing the icon from scratch, altering path d-values, or scaling non-proportionally. The SVG viewBox (0 0 358.846 350.3) and exact paths are locked.
✓ DO: Copy the canonical d= values verbatim. Never modify.
Creating any lockup not listed in V1–V15. If a design need doesn't fit the matrix, escalate to COMMANDER.
✓ DO: Pick the nearest matrix variant and adapt within its spec.
Glow effects on the wordmark in standard product UI. Glow treatment is PENDING COMMANDER approval and is NOT active by default.
✓ DO: No box-shadow or text-shadow on wordmark. Glass containers may use blur.
Any padding/margin value not derived from integer multiples of --x (12px): e.g., 7px, 15px, 23px. Breaks the 8px grid.
✓ DO: Use calc(var(--x)*N) or 8px grid snap values.
Glassmorphism, backdrop-filter blur, box-shadow, or gradient fills in @media print or PDF contexts. Printers flatten these to grey smears.
✓ DO: All print contexts: solid fills, --teal-pr, --amber-pr, no blur.
Standard cards use 16px, nav uses none, print uses 4px. What radius (if any) applies to modal dialogs and full-page overlays?
A teal glow (box-shadow: 0 0 32px rgba(45,212,191,.12)) exists in the components library as a focus/interactive state. Is it approved for general hover and focus states or restricted to interactive focus rings only?
No animation doctrine is defined. Logo may be used in loading screens and transitions. What motion is approved?
The current minimum icon size is 26px (V1/V10 Navbar). For formal medical device UI submissions (MDR, FDA), a Snellen-informed minimum may need to be higher. Is 26px accepted or must it be 32px minimum?