.daily-quote[hidden] {
  display: none;
}
.daily-quote {
  display: grid;
  gap: 14px;
  margin: 24px 0;
  padding: 24px 28px;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: color-mix(in srgb, var(--paper) 55%, transparent);
  box-shadow: 3px 3px 0 color-mix(in srgb, var(--line) 18%, transparent);
}
.daily-quote h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: var(--muted);
  font: 600 12px/1.8 var(--reading-font, system-ui);
  letter-spacing: 2px;
}
.daily-quote h2::before {
  content: "";
  width: 5px;
  height: 5px;
  background: var(--red);
  flex: none;
}
.daily-quote blockquote {
  margin: 0;
  min-width: 0;
}
.daily-quote [data-quote-ja] {
  margin: 0;
  color: var(--ink);
  font: 400 19px/1.85 var(--serif);
  overflow-wrap: anywhere;
}
.daily-quote [data-quote-meaning] {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.85;
}
@media (max-width: 600px) {
  .daily-quote {
    margin: 18px 0 24px;
    padding: 20px;
    gap: 10px;
  }
  .daily-quote [data-quote-ja] {
    font-size: 17px;
  }
}