body {  font-family: 'Arial', sans-serif;  margin: 0;  padding: 0;  background: #f4f4f4;}#date-picker-area {  display: flex;  justify-content: center;  align-items: center;  background: #fff;  box-shadow: 0 2px 4px rgba(0,0,0,0.1);  padding: 10px;}#date-picker-area p {  margin: 0;  margin-right: 10px; /* 文本与日期选择器之间的间距 */}#date-picker {  padding: 5px;  font-size: 1rem;}.header, .playlet-item {  display: grid;  grid-template-columns: 50px 3fr 1fr;  background: #fff;  padding: 10px 5%;  align-items: center;}.header div:nth-child(1) {  margin-left: 10px; /* 单独为“剧名”标题设置左边距 */}.header div:nth-child(2) {  margin-left: 20px; /* 单独为“剧名”标题设置左边距 */}.header div:nth-child(3) {  padding-left: 10px; /* 单独为“关联”标题设置左边距 */}.header div:nth-child(4) {  margin-left: -10px; /* 单独为“热力”标题设置左边距 */}.header {  box-shadow: 0 2px 4px rgba(0,0,0,0.1);  font-weight: bold;  color: #333;}.container {  max-width: 100%;  margin: auto;  background: #fff;  box-shadow: 0 0 10px rgba(0,0,0,0.1);  margin-top: 10px;}.playlet-item {  border-bottom: 1px solid #eee;}.ranking {  font-size: 1.5em;  color: #FFA500;}.playlet-name {  padding-left: -10px;}.playlet-cover {  width: 100%;}.related-party {  text-align: center;}.consume-num {  font-weight: bold;  color: #E44D26;  text-align: right;  padding-right: 10px;}#loading, #end-of-content {  text-align: center;  padding: 10px 0;}