# SCC Encrypted Vault — Blueprint Layout

## TOP BAR (full width, fixed)

| Position | Category |
|----------|----------|
| Top-Left | [BRAND-LOGO] |
| Top-Left (beside logo) | [BRAND-NAME] |
| Top-Left (sub-logo) | [BRAND-TAGLINE] |
| Top-Center | [NAV-TABS] |
| Top-Center (active) | [NAV-TAB-ACTIVE] |
| Top-Right | [USER-IDENTITY] |
| Top-Right (below user) | [SESSION-ID] |
| Top-Right (below session) | [CLEARANCE-LEVEL] |
| Top-Right (icon) | [AUTH-LOCK-ICON] |

---

## MAIN CONTENT (3-column layout)

### LEFT COLUMN

#### Panel 1 — Top-Left
| Position | Category |
|----------|----------|
| Panel Header | [VAULT-STATUS-TITLE] |
| Center Graphic | [VAULT-STATUS-GRAPHIC] |
| Graphic Description | Circular shield/lock emblem with concentric rings — represents vault seal state. Animated rotation or glow when vault is active/healthy. |
| Below Graphic | [VAULT-PRODUCT-NAME] |
| Below Name | [VAULT-PROTECTION-LABEL] |
| Below Label | [VAULT-PROTECTION-SUBLABEL] |
| Row 1 (icon + label + value) | [VAULT-INTEGRITY-METRIC] |
| Row 2 (icon + label + value) | [ENCRYPTION-LAYER-COUNT] |
| Row 3 (icon + label + value) | [KEY-ROTATION-STATUS] |
| Row 4 (icon + label + value) | [ACCESS-CONTROL-STATUS] |
| Row 5 (icon + label + value) | [AUDIT-LOGGING-STATUS] |
| Bottom | [LAST-CHECK-TIMESTAMP] |

#### Panel 2 — Mid-Left
| Position | Category |
|----------|----------|
| Panel Header | [ENCRYPTION-OVERVIEW-TITLE] |
| Row 1 | [ALGORITHM-TYPE] |
| Row 2 | [KEY-SIZE] |
| Row 3 | [HASH-ALGORITHM] |
| Row 4 | [KEY-DERIVATION-METHOD] |
| Row 5 | [VAULT-SALT] |
| Row 6 | [HMAC-STATUS] |
| Row 7 | [QUANTUM-RESISTANT-STATUS] |

#### Panel 3 — Bottom-Left
| Position | Category |
|----------|----------|
| Panel Header | [STORAGE-UTILIZATION-TITLE] |
| Graphic | [STORAGE-BAR-CHART] |
| Value | [STORAGE-USED-VS-TOTAL] |
| Sub-value | [STORAGE-PERCENTAGE] |
| Legend Row 1 | [USED-INDICATOR] |
| Legend Row 2 | [AVAILABLE-INDICATOR] |
| Legend Row 3 | [RESERVED-INDICATOR] |

---

### CENTER COLUMN

#### Panel 4 — Top-Center
| Position | Category |
|----------|----------|
| Panel Header | [VAULT-CONTENTS-TITLE] |
| Stat Box 1 | [DOCUMENT-COUNT] |
| Stat Box 2 | [CREDENTIAL-COUNT] |
| Stat Box 3 | [KEYS-CERTS-COUNT] |
| Stat Box 4 | [CONFIGURATION-COUNT] |
| Stat Box 5 | [INTEL-PACKET-COUNT] |
| Stat Box 6 | [BACKUP-SET-COUNT] |

#### Panel 5 — Mid-Center (file browser)
| Position | Category |
|----------|----------|
| Breadcrumb | [FILE-PATH-BREADCRUMB] |
| Toolbar | [FILE-ACTION-BUTTONS] |
| Toolbar Right | [SEARCH-INPUT] |
| Table Header Col 1 | [FILE-NAME-HEADER] |
| Table Header Col 2 | [FILE-TYPE-HEADER] |
| Table Header Col 3 | [FILE-SIZE-HEADER] |
| Table Header Col 4 | [LAST-MODIFIED-HEADER] |
| Table Header Col 5 | [CLASSIFICATION-HEADER] |
| Table Header Col 6 | [OWNER-HEADER] |
| Table Rows | [FILE-LIST-ROWS] |

#### Panel 6 — Mid-Center (below file browser)
| Position | Category |
|----------|----------|
| Panel Header | [DATA-FLOW-TITLE] |
| Step 1 (icon + label) | [FLOW-STEP-AUTH] |
| Arrow | [FLOW-CONNECTOR] |
| Step 2 (icon + label) | [FLOW-STEP-ZERO-TRUST] |
| Arrow | [FLOW-CONNECTOR] |
| Step 3 (icon + label) | [FLOW-STEP-ENCRYPTION] |
| Arrow | [FLOW-CONNECTOR] |
| Step 4 (icon + label) | [FLOW-STEP-STORAGE] |
| Arrow | [FLOW-CONNECTOR] |
| Step 5 (icon + label) | [FLOW-STEP-INTEGRITY] |
| Arrow | [FLOW-CONNECTOR] |
| Step 6 (icon + label) | [FLOW-STEP-AUDIT] |

#### Panel 7 — Bottom-Center
| Position | Category |
|----------|----------|
| Panel Header | [ACTIVITY-LOG-TITLE] |
| Row Format | [TIMESTAMP] [EVENT-TYPE] [EVENT-DESCRIPTION] [ACTION-TAG] |
| Row Types | [SYSTEM-EVENT] / [READ-EVENT] / [WRITE-EVENT] / [BLOCKED-EVENT] |

---

### RIGHT COLUMN

#### Panel 8 — Top-Right
| Position | Category |
|----------|----------|
| Panel Header | [KEY-MANAGEMENT-TITLE] |
| Sub-header | [PRIMARY-KEY-LABEL] |
| Icon | [KEY-STATUS-ICON] |
| Row 1 | [KEY-ID] |
| Row 2 | [KEY-CREATED-DATE] |
| Row 3 | [KEY-EXPIRY-DATE] |
| Action Button | [ROTATE-KEYS-BUTTON] |
| Sub-section Header | [RECENT-ROTATIONS-TITLE] |
| Rotation Row Format | [ROTATION-DATE] [KEY-VERSION] [ROTATION-STATUS] |
| Action Link | [VIEW-KEY-HISTORY-LINK] |

#### Panel 9 — Mid-Right
| Position | Category |
|----------|----------|
| Panel Header | [ACCESS-CONTROL-TITLE] |
| Stat | [ACTIVE-SESSION-COUNT] |
| Session Row Format | [USERNAME] [LOGIN-TIMESTAMP] [STATUS-INDICATOR] |
| Action Link | [VIEW-ACCESS-LOG-LINK] |

#### Panel 10 — Bottom-Right
| Position | Category |
|----------|----------|
| Panel Header | [INTEGRITY-MONITOR-TITLE] |
| Graphic | [INTEGRITY-MONITOR-GRAPHIC] |
| Graphic Description | 3D isometric cube/server block with layered horizontal scan lines — represents the physical storage cluster being scanned. Animated scan sweep when integrity check is running. |
| Primary Metric Label | [INTEGRITY-SCORE-LABEL] |
| Primary Metric Value | [INTEGRITY-SCORE-VALUE] |
| Primary Metric Max | [INTEGRITY-SCORE-MAX] |
| Primary Metric Status Word | [INTEGRITY-STATUS-WORD] |
| Row 1 Label | [REDUNDANCY-LABEL] |
| Row 1 Value | [REDUNDANCY-TYPE] |
| Row 2 Label | [GEOGRAPHIC-REPLICAS-LABEL] |
| Row 2 Value | [GEOGRAPHIC-REPLICA-COUNT] |
| Row 2 Status | [GEOGRAPHIC-REPLICA-STATUS] |
| Row 3 Label | [LAST-SCAN-LABEL] |
| Row 3 Value | [LAST-SCAN-TIMESTAMP] |

---

## BOTTOM BAR (full width, fixed)

| Position | Category |
|----------|----------|
| Bottom-Left | [SYSTEM-TIMESTAMP] |
| Bottom-Center-Left | [CONNECTION-STATUS-INDICATOR] |
| Bottom-Center | [UPTIME-COUNTER] |
| Bottom-Right | [SYSTEM-HEALTH-BAR] |
| Bottom-Far-Right | [HEALTH-PERCENTAGE] |

---

## LAYOUT GRID SUMMARY

```
┌──────────────────────────────────────────────────────────────────────┐
│ [BRAND-LOGO] [BRAND-NAME]   [NAV-TABS...]        [USER] [SESSION]    │
├────────────┬─────────────────────────────────────┬───────────────────┤
│            │ [VAULT-CONTENTS-STAT-BOXES]         │                   │
│ [VAULT-    ├─────────────────────────────────────┤ [KEY-MANAGEMENT]  │
│  STATUS]   │ [FILE-BROWSER-TABLE]                │                   │
│            │                                     │                   │
├────────────┤                                     ├───────────────────┤
│ [ENCRYPT-  ├─────────────────────────────────────┤ [ACCESS-CONTROL]  │
│  OVERVIEW] │ [DATA-FLOW-PIPELINE]                │                   │
│            ├─────────────────────────────────────┤                   │
├────────────┤ [ACTIVITY-LOG]                      ├───────────────────┤
│ [STORAGE-  │                                     │ [INTEGRITY-       │
│  UTIL]     │                                     │  MONITOR]         │
├────────────┴─────────────────────────────────────┴───────────────────┤
│ [TIMESTAMP]   [CONNECTION]   [UPTIME]        [SYSTEM-HEALTH-BAR]     │
└──────────────────────────────────────────────────────────────────────┘
```
