/* Feature: 流星群カレンダー — only styles for this feature, nothing global */
.meteor-controls { display: flex; flex-wrap: wrap; gap: 12px; margin: 12px 0; align-items: center; }
.meteor-controls label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; }
.meteor-controls select { background: #1a1d2c; color: #eee; border: 1px solid #2a2d3c; border-radius: 6px; padding: 6px 8px; min-width: 180px; }

.meteor-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin: 16px 0; }

.meteor-card {
  background: #14172a; border: 1px solid #232539; border-radius: 10px;
  padding: 14px; cursor: pointer; transition: transform .12s, border-color .12s;
}
.meteor-card:hover { border-color: #3b4070; transform: translateY(-1px); }
.meteor-card .mc-title { font-weight: 700; font-size: 16px; margin-bottom: 4px; }
.meteor-card .mc-en { color: #888; font-size: 11px; }
.meteor-card .mc-row { display: flex; justify-content: space-between; font-size: 12px; margin-top: 8px; color: #bbb; }
.meteor-card .mc-score-bar {
  margin-top: 10px; height: 8px; background: #1a1d2c; border-radius: 4px; overflow: hidden;
}
.meteor-card .mc-score-fill {
  height: 100%;
  background: linear-gradient(90deg, #4a5060 0%, #f6c34a 50%, #ff6464 100%);
  transition: width .3s;
}
.meteor-card .mc-score-num {
  font-size: 24px; font-weight: 700; color: #f6c34a; margin-top: 8px;
}
.meteor-card.is-poor .mc-score-num { color: #6c7080; }
.meteor-card.is-good .mc-score-num { color: #f6c34a; }
.meteor-card.is-great .mc-score-num { color: #ff8080; }

#meteor-detail { background: #0e1020; border: 1px solid #232539; border-radius: 10px; padding: 16px; margin-top: 18px; }
#meteor-detail.hidden { display: none; }
#md-canvas { background: #0a0b16; border-radius: 6px; max-width: 100%; height: auto; display: block; margin-top: 8px; }
#md-tonight { display: flex; gap: 14px; flex-wrap: wrap; margin: 8px 0 12px; font-size: 13px; }
#md-tonight .kv { display: flex; gap: 4px; }
#md-tonight .kv .k { color: #888; }