initial commit

_bmad-output/implementation-artifacts/2-3-css-and-screen-units.md

@@ -0,0 +1,42 @@
+---
+epic: 2
+story: 2.3
+title: "CSS & Screen Units"
+status: draft
+---
+
+## Epic 2 — Unit Conversion System
+**Goal:** Support 200+ units across all major categories with SI prefix support.
+
+### Story 2.3: CSS & Screen Units
+
+As a web designer or developer using CalcPad,
+I want to convert between CSS units (px, pt, em, rem) using configurable PPI and base font size,
+So that I can quickly calculate screen measurements for my designs.
+
+**Acceptance Criteria:**
+
+**Given** the default configuration (PPI=96, em=16px)
+**When** the expression `12pt in px` is evaluated
+**Then** the result is `16 px` (12pt * 96/72 = 16px)
+
+**Given** the default configuration (PPI=96, em=16px)
+**When** the expression `2em in px` is evaluated
+**Then** the result is `32 px`
+
+**Given** the user sets `ppi = 326` (Retina display)
+**When** the expression `12pt in px` is evaluated
+**Then** the result uses the custom PPI: `12 * 326/72 = 54.333... px`
+
+**Given** the user sets `em = 20px`
+**When** the expression `2em in px` is evaluated
+**Then** the result is `40 px`
+
+**Given** the expression `1rem in px` with default configuration
+**When** the engine evaluates it
+**Then** it treats `rem` as root em with the same base font size as `em` (16px by default)
+**And** the result is `16 px`
+
+**Given** a conversion from `px` to `pt`
+**When** the expression `96px in pt` is evaluated at default PPI
+**Then** the result is `72 pt`