*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif;background:#eef2f5;color:#0d1720}main{max-width:560px;margin:48px auto;padding:0 16px}header{display:flex;align-items:center;justify-content:space-between}h1{margin:0}.badge{font-size:12px;padding:4px 10px;border-radius:999px}.badge.ok{background:#dcfce7;color:#166534}.badge.down{background:#fee2e2;color:#991b1b}form{display:flex;gap:8px;margin:24px 0}input{flex:1;padding:10px 12px;border:1px solid #cbd5e1;border-radius:8px;font:inherit}button{padding:10px 16px;border:0;border-radius:8px;background:#2447e0;color:#fff;font:inherit;cursor:pointer}ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}li{background:#fff;border-radius:10px;padding:12px 14px}li p{margin:0 0 4px}time{font-size:12px;color:#64748b}