CHAPTER 02 · LESSON 2.1 · 3 OF 7
HEX PROGRESS — THREE STATES
Locked · Locked · Completed · Completed · Current · Locked · Locked
CARD ON DARK SURFACE
Worked example
Body text on charcoal. Helvetica Neue Regular. No drop shadow on dark mode — only a 1px border at #2A2D33.
TYPOGRAPHY
Bold heading — Helvetica Neue
Regular body. One idea per sentence. Operator voice, not consultant voice.
Secondary text in primary-grey (#4A4A4A) on dark.
FEEDBACK DOTS
Correct — success green #1F8A4C.
Caution red #C0392B — paired with the learning-reveal explanation. Never a red X.
PRIMARY CTA (≤10% OF SCREEN)
QuadCo Orange #FF681A. 12px radius. 56px minimum tap target.
QWERTY STUB BUTTON (FLOATING)
Final position: fixed bottom-6 right-6. Rendered below for visual check.