/* 顶部信息条 */
hd {
  display: block;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  padding: 12px 16px;
  border-radius: 8px 8px 0 0;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 0;
  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
}

hd .time-icon, hd .loc-icon, hd .weather-icon, hd .ppl-icon {
  margin: 0 4px 0 12px;
}

hd .time-icon:first-child {
  margin-left: 0;
}

/* 正文区域 */
article {
  display: block;
  background: white;
  padding: 20px;
  line-height: 1.8;
  font-size: 15px;
  color: #333;
  border-radius: 0 0 8px 8px;
  margin-bottom: 16px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

article p {
  margin: 0 0 16px 0;
  text-indent: 2em;
}

article p:last-child {
  margin-bottom: 0;
}

/* 状态卡片通用样式 */
details {
  background: white;
  border-radius: 8px;
  margin-bottom: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  transition: all 0.3s ease;
}

details:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}

details summary {
  padding: 14px 16px;
  cursor: pointer;
  font-weight: 600;
  font-size: 15px;
  user-select: none;
  transition: background 0.2s;
  border-left: 4px solid transparent;
}

details summary:hover {
  background: rgba(0, 0, 0, 0.02);
}

/* 世界状态卡片 */
.world-status summary {
  background: linear-gradient(135deg, #7950f2 0%, #5f3dc4 100%);
  color: white;
  border-left-color: #5028c8;
}

.world-content {
  padding: 16px;
  background: #f3f0ff;
}

.world-row {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}

.world-row:last-child {
  margin-bottom: 0;
}

.world-row .label {
  display: inline-block;
  color: #7950f2;
  font-weight: 600;
  min-width: 80px;
  margin-right: 8px;
}

/* 当前事件卡片 */
.event-status summary {
  background: linear-gradient(135deg, #ff922b 0%, #fd7e14 100%);
  color: white;
  border-left-color: #e8590c;
}

.event-content {
  padding: 16px;
  background: #fff4e6;
}

.event-row {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}

.event-row:last-child {
  margin-bottom: 0;
}

.event-row .label {
  display: inline-block;
  color: #ff922b;
  font-weight: 600;
  margin-right: 8px;
}

.event-row .status-未锁定 {
  color: #868e96;
}

.event-row .status-已锁定 {
  color: #ff6b6b;
  font-weight: 600;
}

.event-row .status-locked {
  color: #ff6b6b;
  font-weight: 600;
}

.event-row .status-active {
  color: #ff922b;
  font-weight: 600;
  animation: pulse 1.5s infinite;
}

.event-row .status-done {
  color: #51cf66;
  font-weight: 600;
}

/* 谣言档案 */
.rumor-card summary {
  background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
  color: white;
  border-left-color: #c92a2a;
}

.rumor-content {
  padding: 16px;
  background: #fff5f5;
}

.rumor-row {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}

.rumor-row:last-child {
  margin-bottom: 0;
}

.rumor-row .label {
  display: inline-block;
  background: #ff6b6b;
  color: white;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  margin-right: 8px;
}

.rumor-row .status-未锁定 {
  color: #868e96;
}

.rumor-row .status-已锁定 {
  color: #ff6b6b;
  font-weight: 600;
}

.rumor-row .status-具现化中 {
  color: #ff922b;
  font-weight: 600;
  animation: pulse 1.5s infinite;
}

.rumor-row .status-已完成 {
  color: #51cf66;
  font-weight: 600;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* 角色卡片 */
.char-card summary {
  background: linear-gradient(135deg, #4c6ef5 0%, #5f3dc4 100%);
  color: white;
  border-left-color: #364fc7;
}

.char-content {
  padding: 16px;
  background: #f8f9ff;
}

.char-meta {
  margin-bottom: 12px;
  font-size: 14px;
  color: #495057;
}

.badge-role {
  background: #4c6ef5;
  color: white;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 600;
}

.char-row {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}

.char-row:last-child {
  margin-bottom: 0;
}

.char-row .label {
  display: inline-block;
  color: #4c6ef5;
  font-weight: 600;
  min-width: 50px;
  margin-right: 8px;
}

.char-row .tag {
  display: inline-block;
  background: #e7f5ff;
  color: #1971c2;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 6px;
}

.progress-bar {
  display: inline-block;
  width: 120px;
  height: 8px;
  background: #e9ecef;
  border-radius: 4px;
  vertical-align: middle;
  margin: 0 8px;
  overflow: hidden;
}

.progress-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #4c6ef5 0%, #5f3dc4 100%);
  border-radius: 4px;
  transition: width 0.5s ease;
}

/* 身体状态卡片 */
.body-card summary {
  background: linear-gradient(135deg, #ff6b9d 0%, #c92a6f 100%);
  color: white;
  border-left-color: #a61e4d;
}

.body-content {
  padding: 16px;
  background: #fff0f6;
}

.body-row {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}

.body-row:last-child {
  margin-bottom: 0;
}

.body-row .label {
  display: inline-block;
  color: #c92a6f;
  font-weight: 600;
  min-width: 60px;
  margin-right: 8px;
}

.body-row .status-正常 {
  color: #51cf66;
  font-weight: 600;
}

.body-row .status-惩罚中 {
  color: #ff6b6b;
  font-weight: 600;
  animation: blink 1s infinite;
}

.body-row .status-后遗症 {
  color: #ff922b;
  font-weight: 600;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

.shame-bar {
  display: inline-block;
  width: 120px;
  height: 8px;
  background: #ffe0eb;
  border-radius: 4px;
  vertical-align: middle;
  margin: 0 8px;
  overflow: hidden;
}

.shame-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #ff6b9d 0%, #c92a6f 100%);
  border-radius: 4px;
  transition: width 0.5s ease;
}

/* 社交媒体卡片 */
.social-card summary {
  background: linear-gradient(135deg, #1da1f2 0%, #0c8bd9 100%);
  color: white;
  border-left-color: #0a7fcc;
}

.social-content {
  padding: 16px;
  background: #f0f8ff;
}

.hot-search, .comments, .messages {
  margin-bottom: 16px;
}

.hot-search:last-child, .comments:last-child, .messages:last-child {
  margin-bottom: 0;
}

.search-title, .comment-title, .msg-title {
  font-weight: 600;
  font-size: 14px;
  color: #0c8bd9;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 2px solid #bde0fe;
}

.search-item {
  padding: 6px 10px;
  margin-bottom: 6px;
  background: white;
  border-radius: 6px;
  font-size: 13px;
  color: #495057;
  transition: transform 0.2s;
}

.search-item:hover {
  transform: translateX(4px);
  background: #e7f5ff;
}

.search-item .heat {
  float: right;
  color: #ff6b6b;
  font-weight: 600;
}

.comment-item {
  padding: 8px 10px;
  margin-bottom: 8px;
  background: white;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.6;
  color: #495057;
}

.comment-item .username {
  color: #1da1f2;
  font-weight: 600;
}

.comment-item .likes {
  float: right;
  color: #868e96;
  font-size: 12px;
}

.msg-item {
  padding: 8px 10px;
  background: #fff3bf;
  border-left: 3px solid #ffd43b;
  border-radius: 4px;
  font-size: 13px;
  color: #495057;
}

/* 行动推荐卡片 */
.action-card summary {
  background: linear-gradient(135deg, #fab005 0%, #f59f00 100%);
  color: white;
  border-left-color: #e67700;
}

.action-content {
  padding: 16px;
  background: #fff9db;
}

.situation {
  background: white;
  padding: 12px;
  border-radius: 6px;
  border-left: 4px solid #fab005;
  margin-bottom: 12px;
  font-size: 14px;
  color: #495057;
  font-weight: 500;
}

.action-btn {
  padding: 12px 16px;
  margin-bottom: 10px;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.3s;
  border: 2px solid transparent;
  line-height: 1.6;
}

.action-btn:hover {
  transform: translateX(6px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.action-btn.red {
  background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
  color: white;
  border-color: #c92a2a;
}

.action-btn.yellow {
  background: linear-gradient(135deg, #ffd43b 0%, #fab005 100%);
  color: #5f3c0a;
  border-color: #f08c00;
}

.action-btn.green {
  background: linear-gradient(135deg, #51cf66 0%, #37b24d 100%);
  color: white;
  border-color: #2b8a3e;
}

.action-btn.blue {
  background: linear-gradient(135deg, #4c6ef5 0%, #3b5bdb 100%);
  color: white;
  border-color: #364fc7;
}

.action-btn.white {
  background: white;
  color: #495057;
  border-color: #ced4da;
}

.action-btn .risk {
  float: right;
  font-size: 12px;
  opacity: 0.9;
}

.warning {
  background: #ff8787;
  color: white;
  padding: 10px 12px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  margin-top: 12px;
  border-left: 4px solid #c92a2a;
}

/* 剧情线索卡片 */
.clue-card summary {
  background: linear-gradient(135deg, #20c997 0%, #12b886 100%);
  color: white;
  border-left-color: #0ca678;
}

.clue-content {
  padding: 16px;
  background: #e6fcf5;
}

.clue-row {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}

.clue-row:last-child {
  margin-bottom: 0;
}

.clue-row .label {
  display: inline-block;
  color: #12b886;
  font-weight: 600;
  min-width: 70px;
  margin-right: 8px;
}

/* 记忆区卡片 */
.memory-card summary {
  background: linear-gradient(135deg, #868e96 0%, #495057 100%);
  color: white;
  border-left-color: #343a40;
}

.memory-content {
  padding: 16px;
  background: #f8f9fa;
}

.memory-section {
  margin-bottom: 16px;
}

.memory-section:last-child {
  margin-bottom: 0;
}

.memory-title {
  font-weight: 600;
  font-size: 13px;
  color: #495057;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 2px solid #dee2e6;
}

.memory-item {
  padding: 6px 10px;
  margin-bottom: 6px;
  background: white;
  border-left: 3px solid #adb5bd;
  border-radius: 4px;
  font-size: 13px;
  color: #495057;
}

.memory-item:last-child {
  margin-bottom: 0;
}

.memory-archive {
  padding: 6px 10px;
  margin-bottom: 6px;
  background: #e9ecef;
  border-radius: 4px;
  font-size: 12px;
  color: #6c757d;
  font-style: italic;
}

.memory-archive:last-child {
  margin-bottom: 0;
}

/* 移动端适配 */
@media (max-width: 768px) {
  hd {
    font-size: 12px;
    padding: 10px 12px;
  }
  
  article {
    padding: 16px;
    font-size: 14px;
  }
  
  details summary {
    font-size: 14px;
    padding: 12px 14px;
  }
  
  .action-btn .risk {
    float: none;
    display: block;
    margin-top: 4px;
  }
  
  .progress-bar, .shame-bar {
    width: 100px;
  }
}