Foundations — the row is everything

Live tvOS artboard rendered with the shipping tv-shell.css stylesheet — same surface materials, same row anatomy, same focus halo as the production app. Lift values from tv-shell.css; never reinvent them here.

put.io

Files

History

Account

kai

Your Files

Refresh

Name

__tears_of_steel__

544.89 MB

Movies

38 items · 412 GB

The.Wire.S03E04.Hamsterdam.1080p.BluRay.x264-DEMAND.mkv

3.42 GB

season-3-notes.txt

1.11 KB

Row anatomy · lifted from tv-shell.css

Padding

18px 26px

vertical · horizontal

Radius

18px

soft glass pill

Title

22px · 500 · −0.005em

GT America

Sub

16px · mono · tnum

var(--text-2)

Icon

30×30 · #fdce45

folders only · files muted

Focused bg

rgba(255,255,255,0.10)

soft glass · no backdrop-filter on row

Focused halo

1px · #fdce45 · 18% alpha

brand accent · subtle

Focused shadow

0 14px 30px / 0.45

lifts off the dark surface

Content rules · put.io ships no metadata

Filenames are the title. Never parse 1080p / HEVC / WEB-DL into pretty pills. Never invent a poster. Watched videos show the muted eye icon trailing — that's it.

Rule

tvOS

Android TV

Roku

Smart-TV web

Filenames

raw, never parsed

Folder icon

#fdce45 stroke 1.5

Watched state

trailing eye · 55% alpha

Quality / codec pills

never

Posters / artwork

never · Continue Watching is list rows + a progress bar

never · same

never · flat tiles