*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#121316;color:#e8e6e1;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;line-height:1.65;
     -webkit-text-size-adjust:100%}
a{color:#d8a657}
header,main,footer{max-width:44rem;margin:0 auto;padding:0 1.25rem}
header{padding-top:3rem}
.brand{font-size:1.6rem;font-weight:700;text-decoration:none;color:#e8e6e1;display:inline-block}
.tag{color:#8d8a84;margin:.35rem 0 1.25rem}
nav{display:flex;gap:1.1rem;flex-wrap:wrap;padding-bottom:1rem;border-bottom:1px solid #8d8a8433}
nav a{text-decoration:none;color:#8d8a84;font-size:.95rem}
nav a.on,nav a:hover{color:#d8a657}
article{padding:1.75rem 0;border-bottom:1px solid #8d8a8422}
article h2{margin:0 0 .3rem;font-size:1.3rem;line-height:1.3}
article h2 a{text-decoration:none;color:#e8e6e1}
article h2 a:hover{color:#d8a657}
time{color:#8d8a84;font-size:.85rem}
footer{color:#8d8a84;font-size:.85rem;padding-top:2rem;padding-bottom:3rem}
footer a{color:#8d8a84}
@media (max-width:30rem){header{padding-top:2rem}.brand{font-size:1.35rem}}
body{letter-spacing:.01em}
nav{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem}
article{border-bottom-color:#2a2c31}
.frame{aspect-ratio:3/2;background:linear-gradient(135deg,#1d1f24,#2b2e35);border:1px solid #33363d;margin:.9rem 0}