/* Breeding by the Moon & the Signs: tonight's moon and sign on a night panel,
   the phase lore, the twelve signs, timing helpers and a two-month calendar. Loaded on that page only. */

.moon-page { display: grid; gap: clamp(1.2rem, 3vw, 2rem); max-width: 1080px; margin: 0 auto; color: rgb(var(--c-ink)); font-family: var(--lh-sans); min-width: 0; }
.moon-page :is(h1, h2, h3) { font-family: var(--lh-serif); font-weight: 600; line-height: 1.15; margin: 0; }
.mp-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* tonight */
.mp-tonight {
  display: grid;
  grid-template-columns: minmax(180px, 300px) minmax(0, 1fr);
  gap: clamp(1.2rem, 4vw, 2.8rem);
  align-items: center;
  padding: clamp(1.2rem, 3.4vw, 2.4rem);
  border-radius: 16px;
  color: rgb(var(--c-surface-soft));
  background: radial-gradient(90% 120% at 18% 30%, rgb(var(--c-deep) / .6), transparent 62%), rgb(var(--c-night));
  border: 1px solid rgb(var(--c-neon) / .45);
  box-shadow: 0 0 0 4px rgb(var(--c-bg-2)), 0 0 28px rgb(var(--c-neon) / .22), 0 18px 40px rgb(var(--c-black) / .35);
}
.mp-moon-figure { margin: 0; min-width: 0; }
.mp-moon { display: block; width: 100%; max-width: 300px; height: auto; margin: 0 auto; overflow: visible; }
.mp-halo-core { stop-color: rgb(var(--c-moonlight)); stop-opacity: .28; }
.mp-halo-edge { stop-color: rgb(var(--c-neon)); stop-opacity: 0; }
.mp-halo { animation: mp-breathe 7s ease-in-out infinite; transform-origin: 100px 100px; }
.mp-surface-light { stop-color: rgb(var(--c-moonlight)); }
.mp-surface-edge { stop-color: rgb(var(--c-glass)); }
.mp-maria { fill: rgb(var(--c-moon-shade) / .16); }
.mp-shade { fill: rgb(var(--c-bg-2) / .9); }
.mp-rim { fill: none; stroke: rgb(var(--c-moonlight) / .25); stroke-width: 1; }
@keyframes mp-breathe { 0%, 100% { opacity: .8; transform: scale(1); } 50% { opacity: 1; transform: scale(1.04); } }

.mp-kicker { margin: 0 0 .4rem; color: rgb(var(--c-violet-100)); font: 700 .74rem/1.4 var(--lh-sans); letter-spacing: .16em; text-transform: uppercase; }
.mp-title { font-size: clamp(2rem, 4.6vw, 3.2rem); color: rgb(var(--c-white)); letter-spacing: -.01em; text-wrap: balance; }
.mp-lit { margin: .5rem 0 0; font: 600 1.25rem/1.3 var(--lh-serif); color: rgb(var(--c-candle-core)); }
.mp-lead { margin: .9rem 0 0; max-width: 34rem; line-height: 1.65; color: rgb(var(--c-surface-soft)); }
.mp-next { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.1rem 0 0; padding: 0; list-style: none; }
.mp-next li { padding: .4rem .75rem; border-radius: 999px; background: rgb(var(--c-white) / .07); border: 1px solid rgb(var(--c-glass) / .35); font-size: .88rem; color: rgb(var(--c-surface-soft)); }
.mp-next-name { font-weight: 700; color: rgb(var(--c-white)); }

/* sections */
.mp-section { min-width: 0; }
.mp-h2 { font-size: clamp(1.6rem, 3.2vw, 2.2rem); color: rgb(var(--c-deep)); }
.mp-h3 { font-size: 1.35rem; color: rgb(var(--c-deep)); }
.mp-sub { margin: .35rem 0 1rem; color: rgb(var(--c-muted)); line-height: 1.55; }

.mp-lore { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: .9rem; }
.mp-lore-card, .mp-helper {
  display: flex;
  gap: .85rem;
  align-items: flex-start;
  min-width: 0;
  padding: 1rem 1.1rem;
  border-radius: 12px;
  background: rgb(var(--c-surface-soft));
  border: 1px solid rgb(var(--c-border) / .45);
  box-shadow: inset 0 0 0 3px rgb(var(--c-surface-soft)), inset 0 0 0 4px rgb(var(--c-glass) / .7), 0 6px 16px rgb(var(--c-deep) / .08);
}
.mp-icon { flex: 0 0 auto; width: 44px; height: 44px; filter: drop-shadow(0 0 6px rgb(var(--c-neon) / .45)); }
.mp-icon-disc { fill: rgb(var(--c-moonlight)); stroke: rgb(var(--c-deep) / .35); stroke-width: .8; }
.mp-icon-shade { fill: rgb(var(--c-deep)); }
.mp-lore-when { margin: .1rem 0 .4rem; font: 700 .72rem/1.3 var(--lh-sans); letter-spacing: .12em; text-transform: uppercase; color: rgb(var(--c-accent)); }
.mp-lore-text { margin: 0; line-height: 1.55; font-size: .95rem; }

.mp-helpers { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: .9rem; }
.mp-helper { display: block; }
.mp-helper p { margin: .4rem 0 0; line-height: 1.6; }
.mp-helper strong { color: rgb(var(--c-deep)); white-space: nowrap; }

/* the signs */
.mp-glyph { font-family: 'Segoe UI Symbol', 'Noto Sans Symbols', 'Apple Symbols', 'DejaVu Sans', sans-serif; font-variant-emoji: text; line-height: 1; }
.mp-sign-tonight { display: flex; gap: .6rem; align-items: center; margin: .8rem 0 0; padding: .55rem .8rem; max-width: 34rem; border-radius: 12px; background: rgb(var(--c-white) / .06); border: 1px solid rgb(var(--c-glass) / .3); line-height: 1.45; }
.mp-sign-tonight .mp-glyph { flex: 0 0 auto; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; font-size: 1.35rem; color: rgb(var(--c-candle-core)); background: rgb(var(--c-deep) / .7); box-shadow: 0 0 12px rgb(var(--c-neon) / .35); }
.mp-sign-tonight strong { color: rgb(var(--c-white)); }
/* Today's verdicts: good / okay / wait for each farm job. */
.mp-guide { margin: .9rem 0 0; max-width: 34rem; }
.mp-guide-title { margin: 0 0 .45rem; font: 700 .7rem/1.3 var(--lh-sans); letter-spacing: .14em; text-transform: uppercase; color: rgb(var(--c-glass)); }
.mp-guide-list { display: grid; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.mp-guide-item { display: grid; grid-template-columns: 7.2rem 1fr; gap: .7rem; align-items: start; padding: .5rem .7rem; border-radius: 10px; background: rgb(var(--c-white) / .05); border: 1px solid rgb(var(--c-glass) / .22); line-height: 1.4; }
.mp-guide-verdict { justify-self: start; padding: .15rem .55rem; border-radius: 999px; font: 700 .72rem/1.5 var(--lh-sans); white-space: nowrap; }
.mp-guide-body { display: grid; gap: .1rem; font-size: .88rem; color: rgb(var(--c-surface-soft)); }
.mp-guide-activity { color: rgb(var(--c-white)); font-size: .95rem; }
.mp-guide-next { font-size: .8rem; color: rgb(var(--c-candle-core)); }
.mp-guide-good { border-color: rgb(var(--c-ivy) / .7); box-shadow: inset 3px 0 0 rgb(var(--c-ivy)); }
.mp-guide-good .mp-guide-verdict { background: rgb(var(--c-ivy)); color: rgb(var(--c-white)); }
.mp-guide-okay .mp-guide-verdict { background: rgb(var(--c-candle) / .2); color: rgb(var(--c-candle-core)); border: 1px solid rgb(var(--c-candle) / .45); }
.mp-guide-wait .mp-guide-verdict { background: rgb(var(--c-white) / .08); color: rgb(var(--c-surface-soft)); border: 1px solid rgb(var(--c-glass) / .35); }
@media (max-width: 480px) { .mp-guide-item { grid-template-columns: 1fr; gap: .3rem; } }
.mp-sign-tonight.is-fruitful .mp-glyph { color: rgb(var(--c-ivy-vein)); box-shadow: 0 0 14px rgb(var(--c-ivy) / .6); }

.mp-signs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: .55rem; margin: 0; padding: 0; list-style: none; }
.mp-sign {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "glyph name" "glyph body" "tier tier";
  column-gap: .6rem;
  row-gap: .1rem;
  align-items: center;
  padding: .7rem .8rem;
  border-radius: 12px;
  background: rgb(var(--c-surface-soft));
  border: 1px solid rgb(var(--c-border) / .45);
  box-shadow: 0 4px 12px rgb(var(--c-deep) / .06);
  transition: transform .25s ease, box-shadow .25s ease;
}
.mp-sign:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgb(var(--c-deep) / .12); }
.mp-sign .mp-glyph { grid-area: glyph; font-size: 1.7rem; color: rgb(var(--c-accent)); }
.mp-sign-name { grid-area: name; font: 600 1.15rem/1.1 var(--lh-serif); color: rgb(var(--c-deep)); }
.mp-sign-body { grid-area: body; font-size: .8rem; color: rgb(var(--c-muted)); }
.mp-sign-tier { grid-area: tier; justify-self: start; margin-top: .35rem; padding: .12rem .5rem; border-radius: 999px; font: 700 .64rem/1.4 var(--lh-sans); letter-spacing: .1em; text-transform: uppercase; background: rgb(var(--c-deep) / .08); color: rgb(var(--c-muted)); }
.mp-sign-fruitful { border-color: rgb(var(--c-ivy) / .7); box-shadow: inset 4px 0 0 rgb(var(--c-ivy)), 0 4px 12px rgb(var(--c-ivy) / .15); }
.mp-sign-fruitful .mp-glyph { color: rgb(var(--c-ivy)); }
.mp-sign-fruitful .mp-sign-tier { background: rgb(var(--c-ivy)); color: rgb(var(--c-white)); }
.mp-sign-productive .mp-sign-tier, .mp-sign-semi-fruitful .mp-sign-tier { background: rgb(var(--c-ivy) / .16); color: rgb(var(--c-ivy-deep)); }
.mp-sign.is-tonight { outline: 2px solid rgb(var(--c-candle)); outline-offset: 2px; box-shadow: 0 0 16px rgb(var(--c-candle) / .35); }
.mp-sign-now { position: absolute; top: .45rem; right: .5rem; font: 700 .6rem/1 var(--lh-sans); letter-spacing: .1em; text-transform: uppercase; color: rgb(var(--c-amber-600)); }

.mp-rules { margin-top: 1rem; padding: 1rem 1.2rem; border-radius: 12px; background: rgb(var(--c-surface-soft)); border: 1px solid rgb(var(--c-border) / .45); box-shadow: inset 0 0 0 3px rgb(var(--c-surface-soft)), inset 0 0 0 4px rgb(var(--c-glass) / .7); }
.mp-rules ul { margin: .5rem 0 0; padding-left: 1.2rem; display: grid; gap: .45rem; line-height: 1.55; }
.mp-rules strong { color: rgb(var(--c-deep)); }

.mp-helper-tag { display: inline-block; margin-right: .3rem; padding: .08rem .45rem; border-radius: 999px; font: 700 .62rem/1.5 var(--lh-sans); letter-spacing: .1em; text-transform: uppercase; vertical-align: .1em; background: rgb(var(--c-deep) / .1); color: rgb(var(--c-deep)); }
.mp-helper-signs .mp-helper-tag { background: rgb(var(--c-ivy)); color: rgb(var(--c-white)); }

.mp-day { position: relative; }
.mp-day-sign { position: absolute; top: .3rem; right: .35rem; font-size: .72rem; line-height: 1; color: rgb(var(--c-glass) / .8); }
.mp-day-sign .mp-glyph, .mp-day-sign > span[aria-hidden] { font-family: 'Segoe UI Symbol', 'Noto Sans Symbols', 'Apple Symbols', 'DejaVu Sans', sans-serif; }
.mp-day-fruitful .mp-day-sign { color: rgb(var(--c-ivy-vein)); }
.mp-key-fruitful { padding: 0 .35rem; border-radius: 4px; color: rgb(var(--c-white)); background: rgb(var(--c-ivy)); }

.mp-sources { width: 100%; max-width: 40rem; margin-top: .4rem; text-align: left; font-size: .88rem; }
.mp-sources summary { cursor: pointer; text-align: center; font-weight: 600; color: rgb(var(--c-deep)); }
.mp-sources ul { margin: .6rem 0 0; padding-left: 1.2rem; display: grid; gap: .3rem; }
.mp-sources a { color: rgb(var(--c-accent)); }

/* calendar */
.mp-cal { display: grid; gap: .35rem; min-width: 0; }
.mp-cal-row { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .35rem; }
.mp-cal-dow { text-align: center; font: 700 .75rem/1.2 var(--lh-sans); letter-spacing: .1em; color: rgb(var(--c-accent)); padding-bottom: .15rem; }
.mp-cal-dow abbr { text-decoration: none; }
.mp-day {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: .2rem;
  min-width: 0;
  min-height: 5.2rem;
  padding: .45rem .2rem .5rem;
  border-radius: 10px;
  background: rgb(var(--c-night) / .92);
  border: 1px solid rgb(var(--c-glass) / .18);
  color: rgb(var(--c-surface-soft));
  text-align: center;
}
.mp-day-empty { background: transparent; border-color: transparent; }
.mp-day-date { font: 600 .82rem/1.2 var(--lh-sans); color: rgb(var(--c-surface-soft)); }
.mp-day-month { color: rgb(var(--c-violet-100)); text-transform: uppercase; font-size: .68rem; letter-spacing: .08em; }
.mp-day-moon { width: 26px; height: 26px; }
.mp-day .mp-icon-disc { fill: rgb(var(--c-moonlight)); stroke: none; }
.mp-day .mp-icon-shade { fill: rgb(var(--c-bg-2)); stroke: rgb(var(--c-moon-shade) / .7); stroke-width: .6; }
.mp-day-label { font-size: .7rem; line-height: 1.2; color: rgb(var(--c-glass)); overflow-wrap: anywhere; }
.mp-day.mp-day-fruitful { background: radial-gradient(circle at 50% 120%, rgb(var(--c-ivy) / .85), rgb(var(--c-night) / .95) 72%); border-color: rgb(var(--c-ivy) / .6); }
.mp-day-event { border-color: rgb(var(--c-neon) / .75); box-shadow: 0 0 12px rgb(var(--c-neon) / .3); background: radial-gradient(circle at 50% 40%, rgb(var(--c-deep) / .75), rgb(var(--c-night)) 75%); }
.mp-day-event .mp-day-label { color: rgb(var(--c-white)); font-weight: 700; }
.mp-day-full { border-color: rgb(var(--c-candle) / .8); box-shadow: 0 0 14px rgb(var(--c-candle) / .35); }
.mp-day-full .mp-day-moon { filter: drop-shadow(0 0 5px rgb(var(--c-candle-core))); }
.mp-day-today { outline: 2px solid rgb(var(--c-candle)); outline-offset: 1px; }

/* the gentle note */
.mp-folklore {
  display: grid;
  justify-items: center;
  gap: .6rem;
  padding: clamp(1.1rem, 3vw, 1.8rem);
  border-radius: 14px;
  text-align: center;
  background: linear-gradient(135deg, rgb(var(--c-white)), rgb(var(--c-violet-100)));
  border: 1px solid rgb(var(--c-accent) / .45);
}
.mp-folklore p { margin: 0; max-width: 36rem; line-height: 1.6; font-size: 1.05rem; }
.mp-cta { margin-top: .3rem; }

@media (max-width: 760px) {
  .mp-tonight { grid-template-columns: 1fr; text-align: center; }
  .mp-moon { max-width: 200px; }
  .mp-lead { margin-inline: auto; }
  .mp-next { justify-content: center; }
  .mp-cal, .mp-cal-row { gap: .2rem; }
  .mp-day { min-height: 4.4rem; padding: .35rem .1rem; border-radius: 7px; }
  .mp-day-moon { width: 20px; height: 20px; }
  .mp-day-label { font-size: .6rem; }
  .mp-day-month { font-size: .58rem; }
  .mp-helper strong { white-space: normal; }
  .mp-sign-tonight { text-align: left; margin-inline: auto; }
  .mp-guide { text-align: left; margin-inline: auto; }
  .mp-signs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mp-day-sign { position: static; order: 3; font-size: .62rem; }
  .mp-day { display: flex; flex-direction: column; align-items: center; }
}

html[data-sparkles='off'] .mp-halo { animation: none; }
@media (prefers-reduced-motion: reduce) { html:not([data-sparkles='on']) .mp-halo { animation: none; } }
@media print {
  .mp-tonight, .mp-day { background: none; color: rgb(var(--c-black)); box-shadow: none; }
}