* { box-sizing: border-box; }
body { margin: 0; background: #111; color: #ddd; font: 15px/1.5 "Helvetica Neue", Arial, sans-serif; }
a { color: #9cc4ff; }
.wrap { max-width: 1280px; margin: 0 auto; padding: 24px 18px 60px; }
header { margin-bottom: 26px; max-width: 760px; }
.name { font-size: 30px; color: #fff; text-decoration: none; letter-spacing: .5px; }
header p { color: #aaa; margin: 10px 0 0; }
.upd { font-size: 13px; color: #777 !important; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; }
figure { margin: 0; }
figure img { width: 100%; height: 220px; object-fit: cover; display: block; background: #222; }
figcaption { font-size: 13px; color: #bbb; padding-top: 6px; }
figcaption b { color: #eee; font-weight: normal; margin-right: 4px; }
figcaption span { color: #777; font-size: 12px; }
footer { margin-top: 50px; font-size: 12px; color: #666; max-width: 760px; }