feat(specification): update clock-in process with time-window enforcement and location verification details

.claude/skills/krow-paper-design/SKILL.md

@@ -190,10 +190,22 @@ All chips: border 1.5px, text Manrope 14px/600, gap 8px for icon+text
 - Active (filled): bg `#0A39DF`, radius 8px, padding 6px/12px
   - Text Manrope 12px/600 `#FFFFFF`
 
-**Status Badges:**
+**XSmall (Status Chips):**
+- For inline status indicators on list rows, section overviews, and cards
+- Height: ~20px, padding: 3px/8px, no border
+- Text: Manrope 11px/700, uppercase, letter-spacing 0.03-0.04em
+- Variants:
+  - Required/Pending: bg `#FEF9EE`, text `#D97706`, radius 6px
+  - Active/Complete: bg `#ECFDF5`, text `#059669`, radius 6px
+  - Confirmed/Info: bg `#E9F0FF`, text `#0A39DF`, radius 6px
+  - Error/Rejected: bg `#FEF2F2`, text `#F04444`, radius 6px
+  - Neutral/Disabled: bg `#F1F3F5`, text `#94A3B8`, radius 6px
+
+**Status Badges (legacy):**
 - Radius: 8px, padding: 4px/8px
 - Text: Manrope 11px/600-700, uppercase, letter-spacing 0.04em
 - Colors follow semantic badge table above
+- Prefer XSmall Chips for new designs
 
 ### Text Inputs
 
@@ -247,6 +259,24 @@ All chips: border 1.5px, text Manrope 14px/600, gap 8px for icon+text
 - Value: Inter Tight 20px/700 `#121826`
 - Layout: flex row, equal width columns, gap 8px
 
+### Notice Banners
+
+Contextual banners for alerts, warnings, and informational notices. Used in forms, review screens, and detail pages.
+
+- Container: radius 10px, padding 14px, gap 6px, flex column
+- Icon + Title row: flex row, gap 8-10px, align center
+- Icon: 18×18 SVG, same color as text
+- Title: Manrope 14px/600, line-height 18px
+- Body: Manrope 12px/400, line-height 18px
+
+**Variants:**
+| Variant | Background | Color | Title Weight | Icon |
+|---------|-----------|-------|-------------|------|
+| Error | `#FEF2F2` | `#F04444` | 600 | ⊗ (circle-x) |
+| Warning | `#FEF9EE` | `#E6A817` | 600 | △ (triangle-alert) |
+| Info/Notice | `#E9F0FF` | `#0A39DF` | 600 | ⓘ (circle-info) |
+| Success | `#ECFDF5` | `#059669` | 600 | ✓ (circle-check) |
+
 ### Contact/Info Rows
 
 - Container: radius 12px, border 0.5px `#D1D5DB`, background `#FFFFFF`, overflow clip