Alexey Guzey — Recent-posts panel

---
version: alpha
name: Alexey Guzey — Recent-posts panel
colors:
  canvas: '#FFFFFF'
  primary: '#121212'
  body-ink: '#121212'
typography:
  heading:
    fontFamily: '"Encode Sans", sans-serif'
    fontSize: 15.2px
    fontWeight: 400
    lineHeight: 20px
  body:
    fontFamily: '"Encode Sans", sans-serif'
    fontSize: 15.2px
    fontWeight: 400
    lineHeight: 20px
---

## Overview
A pink-bordered reading panel with a bold Recent label and a compact sequence of dated, underlined article links. Isolated component selected with `.right_float:first-of-type`; the screenshot contains its measured bounds, not the entire page. Inspected 2026-10-05.

## Colors
Use white surfaces, near-black text and pale pink rules. Reserve the brighter pink for small accents; retain link underlines. Tokens are sampled computed colors; descriptive accent colors are visual observations, not measured hex values.

## Typography
Measured heading/label sample: "Encode Sans", sans-serif, 15.2px, weight 400, leading 20px. Supporting sample: "Encode Sans", sans-serif, 15.2px, leading 20px. These are local computed samples, not a universal type scale. Artwork and child spans may differ from their parent styles.

## Layout
The panel floats on the desktop right side beside the opening reading list; it becomes a near-full-width block on mobile. Long titles wrap naturally within the border. Desktop screenshot: 412 × 226px at a 1440px viewport. Mobile evidence: 361 × 218px at a 390px viewport. Breakpoint thresholds are not inferred from two observations.

## Elevation & Depth
Flat document layout with no card grid. Only the recent panel and newsletter embed have restrained borders and subtle depth.

## Shapes
Small-radius side panels contrast with plain rectangular text regions and a delicate repeating cross divider.

## Components
Bold label, five dated links and a lightly rounded container. Keep dates inline and avoid ellipsis on long article titles.

## Do’s and Don’ts
Preserve the reference-specific hierarchy, wrapping and spacing described above. Use original copy and assets when adapting. Keep links keyboard-accessible with visible focus. Do not infer animations, hover states or hidden menus from this static capture. No full accessibility audit was performed.