*{margin:0;padding:0;box-sizing:border-box}body{font-family:Courier New,monospace;background:#fff;color:#000;line-height:1.4;font-size:16px}header{border-bottom:4px solid #000000;padding:20px;background:#fff}header h1{font-size:32px;font-weight:700;letter-spacing:2px}header p{font-size:14px;margin:5px 0 15px;font-weight:700}button{background:#000;color:#fff;border:none;padding:8px 16px;font-family:Courier New,monospace;font-size:14px;font-weight:700;cursor:pointer;text-transform:uppercase}button:hover{background:#333}button:active{background:#666}main{padding:20px;max-width:900px}#status{border:2px solid #000000;padding:10px;margin-bottom:20px;font-weight:700;display:none}#status.loading{display:block;background:#f0f0f0}#status.error{display:block;background:#fcc;border-color:#c00}#articles-list{list-style:none;counter-reset:article-counter}.article{border:3px solid #000000;margin-bottom:15px;padding:15px;counter-increment:article-counter}.article:before{content:counter(article-counter,decimal-leading-zero) ". ";font-weight:700;font-size:18px}.article-title{font-size:18px;font-weight:700;margin-bottom:8px;text-decoration:none;color:#000;display:block}.article-title:hover{background:#000;color:#fff}.article-meta{font-size:12px;margin-bottom:8px;font-weight:700;text-transform:uppercase}.article-subtitle{font-size:14px;margin-bottom:10px;line-height:1.3}.article-source{background:#000;color:#fff;padding:2px 6px;font-size:10px;font-weight:700;text-transform:uppercase;display:inline-block;margin-right:10px}.article-time{font-size:12px}.article-readtime{font-size:12px;margin-left:10px}@media (max-width: 600px){header,main{padding:15px}header h1{font-size:24px}.article{padding:12px}.article-title{font-size:16px}}