Box model

Content → padding → border → margin. Always box-sizing: border-box (set in base.css).

Flexbox

One-dimensional layout with gap. The brand's default for rows of controls.

CSS Grid

Two-dimensional layout. Track sizing with fr, plus named areas.

Position

absolute children anchor to a relative parent — the basis of badges & captions.

Transitions

Hover the block — transition eases transform + shadow. Easing var(--ease).

Transforms

rotate · skew · scale · translate.

Keyframe animation

Declared with @keyframes; gated by prefers-reduced-motion.

Gradients

Linear, radial, conic — brand colours only (no synthetic purple meshes).

Filters & blend modes

Tone photos to brand: grayscale, warm sepia, and a gold mix-blend-mode: overlay wash.

none

grayscale

gold overlay

Typography & columns

Multi-column flow, text-wrap: pretty, and the brand line-height.

Our map is hand-terraformed after the fields south of the city — rolling wheat, evergreen windbreaks, and the towers just visible through the trees at golden hour. Land claims, towns, and a player-run economy keep it alive; the web map and Discord presence keep it connected.

Pseudo-classes & ::before

:first-child, :nth-child(even), and generated content.

• First — accented
• Second
• Third
• Fourth

Generated quote mark via ::before

clip-path

Polygon clipping for voxel/arrow shapes.