.fallday-wrap {
  max-width: 980px;
  margin: 0 auto;
  padding: 12px;
}

.fallday-preface {
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 14px;
}

.fallday-content-title {
  margin: 0 0 16px;
  font-size: 24px;
  line-height: 1.7;
}

.fallday-resources {
  margin: 24px 0 8px;
  padding: 18px 20px;
  background: #f8fafc;
  border: 1px solid #dce5ee;
  border-radius: 14px;
}

.fallday-resources-title {
  margin: 0 0 10px;
  font-size: 18px;
  line-height: 1.8;
}

.fallday-resources-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.fallday-resource-link {
  font-weight: 700;
  text-decoration: none;
}

.fallday-resource-link:hover {
  text-decoration: underline;
}

.fallday-resource-separator {
  color: #94a3b8;
}

.fallday-jump-title {
  margin: 18px 0 10px;
  font-size: 16px;
}

.fallday-month-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 8px;
  margin-bottom: 18px;
}

.fallday-month-table td {
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: 12px;
  padding: 10px 8px;
  text-align: center;
}

.fallday-month-table a {
  text-decoration: none;
  font-weight: 700;
  display: block;
}

.fallday-month-table a:hover {
  text-decoration: underline;
}

.fallday-month-section {
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 16px;
  padding: 16px;
  margin: 14px 0;
}

.fallday-month-title {
  margin-top: 0;
  font-size: 22px;
  line-height: 1.6;
}

.fallday-color-block,
.fallday-shape-block,
.fallday-advice-block {
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px dashed #e9e9e9;
}

.fallday-color-image img,
.fallday-shape-image img,
.fallday-fixed-image img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  border: 1px solid #eee;
}

.fallday-color-image,
.fallday-shape-image {
  margin: 10px 0;
  max-width: 260px;
}

.fallday-fixed-image {
  width: 45%;
  max-width: 460px;
  margin: 18px auto;
}

.fallday-fixed-image img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.fallday-wrap h3 {
  font-size: 16px;
  margin: 10px 0 6px;
}

.fallday-wrap p {
  line-height: 1.9;
  margin: 6px 0;
}

@media (max-width: 560px) {
  .fallday-content-title {
    font-size: 20px;
  }

  .fallday-resources {
    padding: 16px 14px;
  }

  .fallday-month-table {
    border-spacing: 6px;
  }
  .fallday-month-table td {
    padding: 8px 6px;
    font-size: 14px;
  }
  .fallday-month-title {
    font-size: 20px;
  }
}


/* Single fortune featured image */
.fallday-featured-image {
  width: calc(100% - 24px);
  max-width: 956px;
  margin: 0 auto 24px;
}

.fallday-featured-image__img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(25, 28, 33, 0.1);
}

@media (max-width: 560px) {
  .fallday-featured-image {
    margin-bottom: 18px;
  }

  .fallday-featured-image__img {
    border-radius: 12px;
  }
}


/* Candle color note card */
.fallday-color-block {
  margin: 22px 0;
  padding: 20px;
  background: #fffdf4;
  border: 1px solid #ffeebb;
  border-top: 1px solid #ffeebb;
  border-radius: 14px;
  text-align: center;
}

.fallday-color-heading {
  display: flex;
  justify-content: center;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 14px;
  font-size: 18px;
  line-height: 1.8;
}

.fallday-color-label,
.fallday-color-name {
  font-weight: 800;
}

.fallday-color-separator {
  color: #725d1d;
}

/* Legacy posts used a separate h3 and paragraph for the color name. */
.fallday-color-block > h3:not(.fallday-color-heading),
.fallday-color-block > h3:not(.fallday-color-heading) + p {
  display: inline;
  margin: 0;
  font-size: 18px;
  line-height: 1.8;
}

.fallday-color-block > h3:not(.fallday-color-heading)::after {
  content: " : ";
  color: #725d1d;
}

.fallday-color-image {
  width: min(100%, 300px);
  max-width: 300px;
  margin: 16px auto;
}

.fallday-color-image img {
  display: block;
  margin: 0 auto;
}

.fallday-color-description,
.fallday-color-block > .fallday-color-image ~ p {
  margin: 14px auto 0;
  max-width: 760px;
  color: #443b24;
  line-height: 2;
  text-align: center;
  font-weight: 700;
}

.fallday-color-white .fallday-color-name,
.fallday-color-white > h3 + p strong { color: #64748b; }

.fallday-color-blue .fallday-color-name,
.fallday-color-blue > h3 + p strong { color: #1976d2; }

.fallday-color-green .fallday-color-name,
.fallday-color-green > h3 + p strong { color: #198754; }

.fallday-color-orange .fallday-color-name,
.fallday-color-orange > h3 + p strong { color: #d85f00; }

.fallday-color-silver .fallday-color-name,
.fallday-color-silver > h3 + p strong { color: #6b7280; }

.fallday-color-gold .fallday-color-name,
.fallday-color-gold > h3 + p strong { color: #a66d00; }

.fallday-color-purple .fallday-color-name,
.fallday-color-purple > h3 + p strong { color: #7e22ce; }

.fallday-color-pink .fallday-color-name,
.fallday-color-pink > h3 + p strong { color: #d63384; }

.fallday-color-black .fallday-color-name,
.fallday-color-black > h3 + p strong { color: #111827; }

.fallday-color-brown .fallday-color-name,
.fallday-color-brown > h3 + p strong { color: #795548; }

.fallday-color-yellow .fallday-color-name,
.fallday-color-yellow > h3 + p strong { color: #9a6700; }

.fallday-color-red .fallday-color-name,
.fallday-color-red > h3 + p strong { color: #dc2626; }

@media (max-width: 560px) {
  .fallday-color-block {
    padding: 16px 12px;
    border-radius: 12px;
  }

  .fallday-color-heading,
  .fallday-color-block > h3:not(.fallday-color-heading),
  .fallday-color-block > h3:not(.fallday-color-heading) + p {
    font-size: 16px;
  }
}


/* Water-container shape card */
.fallday-shape-block {
  margin: 22px 0;
  padding: 20px;
  background: #f4fbff;
  border: 1px solid #c7e7f7;
  border-top: 1px solid #c7e7f7;
  border-radius: 14px;
  text-align: center;
}

.fallday-shape-block > h3 {
  margin: 0 0 14px;
  text-align: center;
}

.fallday-shape-image {
  width: min(100%, 300px);
  max-width: 300px;
  margin: 16px auto;
}

.fallday-shape-image img {
  display: block;
  margin: 0 auto;
}

.fallday-shape-block p {
  max-width: 760px;
  margin: 10px auto 0;
  text-align: center;
  font-weight: 700;
  line-height: 2;
}

@media (max-width: 560px) {
  .fallday-shape-block {
    padding: 16px 12px;
    border-radius: 12px;
  }
}


/* Single fortune title and breadcrumb */
.fallday-entry-header {
  width: calc(100% - 24px);
  max-width: 956px;
  margin: 0 auto 18px;
  box-sizing: border-box;
}

.fallday-entry-header .entry-title {
  margin: 0 0 10px;
}

.fallday-breadcrumb {
  color: #6b7280;
  font-size: 13px;
  line-height: 1.8;
}

.fallday-breadcrumb ol {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fallday-breadcrumb li {
  display: inline-flex;
  align-items: center;
}

.fallday-breadcrumb li + li::before {
  content: "/";
  margin: 0 8px;
  color: #a3a8b0;
}

.fallday-breadcrumb a {
  color: #2271b1;
  text-decoration: none;
}

.fallday-breadcrumb a:hover {
  text-decoration: underline;
}

.fallday-breadcrumb [aria-current="page"] {
  color: #4b5563;
}


/* Equal-size month navigation cells */
.fallday-month-table {
  table-layout: fixed;
}

.fallday-month-table td {
  width: 25%;
  height: 52px;
  padding: 0;
  vertical-align: middle;
}

.fallday-month-table a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 8px 6px;
  box-sizing: border-box;
  white-space: nowrap;
}

@media (max-width: 560px) {
  .fallday-month-table td {
    height: 48px;
    padding: 0;
    font-size: 13px;
  }

  .fallday-month-table a {
    min-height: 48px;
    padding: 4px 2px;
  }
}
.fallday-entry-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-top: 10px;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.8;
}

.fallday-entry-meta a {
    color: #4b5563;
    text-decoration: none;
}

.fallday-entry-meta a:hover {
    color: #005f9e;
    text-decoration: underline;
}

/* Keep the standalone fortune template inside narrow, real-device viewports. */
.fallday-single-wrap {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px;
  box-sizing: border-box;
}

.fallday-single-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}

.fallday-single-grid,
.fallday-content,
.fallday-content article,
.fallday-content .entry-content,
.fallday-wrap {
  min-width: 0;
}

.fallday-single-wrap *,
.fallday-wrap * {
  box-sizing: border-box;
}

/* Generated content can contain long unbroken text or uploaded media. */
.fallday-wrap p,
.fallday-wrap h1,
.fallday-wrap h2,
.fallday-wrap h3,
.fallday-wrap h4,
.fallday-wrap li,
.fallday-breadcrumb li {
  overflow-wrap: anywhere;
}

.fallday-wrap img,
.fallday-wrap video,
.fallday-wrap svg,
.fallday-wrap canvas,
.fallday-featured-image__img {
  max-width: 100%;
  height: auto;
}

.fallday-wrap iframe,
.fallday-wrap embed,
.fallday-wrap object {
  max-width: 100%;
}

@media (max-width: 560px) {
  .fallday-single-wrap {
    padding: 12px;
  }

  .fallday-single-grid {
    gap: 18px;
  }
}