/* Moonlit bathhouse: midnight indigo water, a full moon, lantern gold.
   Cormorant Garamond for display, Nunito Sans for reading. One motion: the
   ripples under the moon grow and fade at six breaths a minute. */

@font-face { font-family: "Cormorant Garamond"; src: url("/static/fonts/CormorantGaramond-Regular.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("/static/fonts/CormorantGaramond-Italic.woff") format("woff"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("/static/fonts/CormorantGaramond-SemiBold.woff") format("woff"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Nunito Sans"; src: url("/static/fonts/NunitoSans-Regular.woff") format("woff"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Nunito Sans"; src: url("/static/fonts/NunitoSans-Bold.woff") format("woff"); font-weight: 700; font-display: swap; }

:root {
  --paper: #0e1430;
  --paper-2: #18224b;
  --ink: #eef0f9;
  --ink-2: #aab3d6;
  --forest: #e8c27a;      /* lantern gold */
  --moss: #f5d999;
  --sage: #34457f;        /* mist */
  --honey: #f0a868;       /* lantern flame */
  --honey-ink: #2a1606;
  --on-accent: #111836;
  --line: rgba(190, 202, 255, .17);
  --shadow: 0 26px 70px -26px rgba(0, 0, 0, .85);
  --display: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --text: "Nunito Sans", "Segoe UI", system-ui, sans-serif;
  --ui: "Nunito Sans", "Segoe UI", system-ui, sans-serif;
  --display-weight: 600;
  --display-tracking: 0;
  --body-size: clamp(1.05rem, 1rem + .25vw, 1.18rem);
  --body-leading: 1.72;
  --r-img: 16px;
  --r-img-lg: 22px;
  --arch: 50% 50% 16px 16px / 34% 34% 16px 16px;   /* moon-window arch (framed images) */
  --r-box: 18px;
  --r-note: 26px;
  --r-btn: 999px;
  --tint: grayscale(1) sepia(.3) hue-rotate(188deg) saturate(2.4) brightness(.82) contrast(1.08);
  --shade: 14, 20, 48;
  --scrim: linear-gradient(180deg, rgba(var(--shade), .06) 18%, rgba(var(--shade), .5) 50%, rgba(var(--shade), .92) 100%);
  color-scheme: dark;
}

body {
  background:
    radial-gradient(1100px 640px at 84% -14%, rgba(232, 194, 122, .16), transparent 62%),
    radial-gradient(900px 700px at 0% 108%, rgba(68, 86, 170, .3), transparent 62%),
    linear-gradient(180deg, #0e1430 0%, #0f1736 55%, #0b1029 100%) fixed;
  font-variant-numeric: lining-nums proportional-nums;
}
h1, h2, h3 { color: #f6f2e6; }
.hero-title, .focus-title, .show-title, .p-title, .post-title { font-weight: 400; font-style: italic; letter-spacing: -.005em; }
.brand { font-weight: 600; letter-spacing: .01em; }
.mark { stroke: var(--forest); stroke-width: 1.3; }
.mark .fill { fill: var(--forest); }
.site-nav a[aria-current="page"], .site-nav a:hover { border-bottom-color: var(--forest); color: #fff; }
a:hover { color: var(--moss); }

/* the moon */
.moon .sky { fill: #111a42; }
.moon .star { fill: #fff8e4; }
.moon .star.s1 { opacity: .55; }
.moon .star.s2 { opacity: .3; }
.moon .crater { fill: #c9ad6c; opacity: .22; }
.moon .horizon { stroke: rgba(232, 194, 122, .45); stroke-width: 1; }
.moon .refl rect { fill: #f2dc9f; opacity: .55; }
.moon .ripple { fill: none; stroke: #e8c27a; stroke-width: 1.6; opacity: 0; transform-origin: 200px 304px; transform-box: view-box; animation: ripple var(--breath) cubic-bezier(.25, .6, .3, 1) infinite; }
.moon .ripple:nth-child(2) { animation-delay: calc(var(--breath) / -4); }
.moon .ripple:nth-child(3) { animation-delay: calc(var(--breath) / -2); }
.moon .ripple:nth-child(4) { animation-delay: calc(var(--breath) * -.75); }
.moon .rim { fill: none; stroke: rgba(232, 194, 122, .55); stroke-width: 1.5; }
.moon .rim2 { fill: none; stroke: rgba(232, 194, 122, .2); stroke-width: 1; }
@keyframes ripple {
  0% { transform: scale(.08, .18); opacity: 0; }
  12% { opacity: .9; }
  100% { transform: scale(1, 1); opacity: 0; }
}
.hero-art { filter: drop-shadow(0 30px 60px rgba(232, 194, 122, .12)); }
.hero-art figcaption { color: var(--ink-2); font-family: var(--display); font-size: 1.15rem; }

/* home formats */
.show-frame { border-radius: 28px; box-shadow: 0 0 0 1px rgba(232, 194, 122, .25), var(--shadow); }
.show-art { width: clamp(5.5rem, 13vw, 9rem); }
.show-tag { color: var(--forest); font-family: var(--display); font-size: 1.3rem; font-style: italic; }
.focus-art { --focus-art: .55; }
.focus::after { content: ""; position: absolute; inset: auto 0 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(232, 194, 122, .5), transparent); }

/* lists */
.row { border-top-color: var(--line); }
.row-date, .lead-date, .post-meta, .p-facts dt { font-style: normal; letter-spacing: .02em; }
.row-title a { background-image: linear-gradient(rgba(232, 194, 122, .35), rgba(232, 194, 122, .35)); }
.row-title, .card-title, .lead-title { font-weight: 600; }
.season-label { color: var(--forest); font-style: italic; font-weight: 400; }
.card-img, .row-img { box-shadow: 0 0 0 1px rgba(232, 194, 122, .18); }

/* posts */
.post-tags { color: var(--forest); }
.post-tags li + li::before { color: var(--sage); }
.prose blockquote { border-left: 0; padding-left: 0; text-align: center; font-style: italic; font-weight: 400; font-size: 1.55rem; color: #f3e6c6; }
.prose blockquote::before { content: ""; display: block; width: 2.2rem; height: 2.2rem; margin: 0 auto .8rem; border-radius: 50%; box-shadow: inset -.6rem .25rem 0 0 var(--forest); }
.prose hr { width: 120px; height: 14px; background: radial-gradient(circle at 50% 50%, var(--forest) 3px, transparent 4px) 50% 50% / 14px 14px no-repeat, linear-gradient(90deg, transparent, rgba(232, 194, 122, .5), transparent) 50% 50% / 100% 1px no-repeat; }
.prose ul li::marker { content: "☾  "; color: var(--forest); }
.toc { background: rgba(255, 255, 255, .03); }
.book-note { background: linear-gradient(160deg, rgba(232, 194, 122, .12), rgba(52, 69, 127, .35)); box-shadow: inset 0 0 0 1px rgba(232, 194, 122, .25); }
.book-note::after { width: 2.4rem; height: 2.4rem; opacity: .9; box-shadow: inset -.7rem .3rem 0 0 var(--forest); }
.book-lead { font-style: italic; font-weight: 400; font-size: 1.45rem; }
.post-care, .care-box { background: rgba(255, 255, 255, .03); }
.progress span { background: linear-gradient(90deg, var(--sage), var(--forest)); }

/* buttons */
.btn { letter-spacing: .02em; }
.btn.s-solid, .btn-read { background: linear-gradient(180deg, #f2d28f, #e3b867); color: var(--on-accent); box-shadow: 0 10px 30px -12px rgba(232, 194, 122, .7); }
.btn.s-solid:hover, .btn-read:hover { background: linear-gradient(180deg, #f8dea5, #ecc579); color: var(--on-accent); box-shadow: 0 0 0 6px rgba(232, 194, 122, .14), 0 14px 34px -12px rgba(232, 194, 122, .8); }
.btn.s-leaf { background: var(--forest); color: var(--on-accent); }
.btn.s-forest { background: #eef0f9; color: #121a3e; }
.btn.s-forest:hover { background: #fff; color: #121a3e; }
.p-cta .btn { box-shadow: 0 16px 40px -14px rgba(232, 194, 122, .6); }

/* image styles */
.img-framed .lead-img, .img-framed .cover-media, .img-framed .p-img, .img-framed .p-split-img {
  border-radius: var(--arch); overflow: hidden;
  box-shadow: 0 0 0 1px rgba(232, 194, 122, .7), 0 0 0 9px var(--paper), 0 0 0 10px rgba(232, 194, 122, .35), 0 40px 90px -40px rgba(232, 194, 122, .45);
}
.img-framed .row-img, .img-framed .card-img { box-shadow: 0 0 0 1px rgba(232, 194, 122, .6), 0 0 0 5px var(--paper), 0 0 0 6px rgba(232, 194, 122, .25); }
.img-framed .p-img.leaf-lg { margin-top: 1rem; }

/* partner page */
.k-partners { background: radial-gradient(1000px 620px at 50% -10%, rgba(232, 194, 122, .2), transparent 62%), linear-gradient(180deg, #0e1430, #0b1029) fixed; }
.p-kicker { color: var(--forest); font-family: var(--display); font-size: 1.25rem; }
.p-points li::before { width: 1.2rem; height: 1.2rem; border-radius: 50%; box-shadow: inset -.42rem .18rem 0 0 var(--forest); }
.p-cover-card { background: rgba(14, 20, 48, .78); box-shadow: 0 0 0 1px rgba(232, 194, 122, .35), var(--shadow); backdrop-filter: blur(10px); }
.p-sticky, .sticky-book { background: rgba(17, 25, 60, .92); backdrop-filter: blur(10px); }
.p-foot { border-top-color: var(--line); }

/* chat */
.chat-fab { background: linear-gradient(180deg, #f2d28f, #e3b867); color: var(--on-accent); }
.chat-head { background: linear-gradient(120deg, #1b2760, #2a3a80); color: #f6f2e6; }
.chat-close { color: #f6f2e6; }
.msg.visitor { background: var(--forest); color: var(--on-accent); }
.chat-panel { background: #121a3e; }
.chat-log { background: #0e1430; }
.chat-form, .chat-foot, .chat-gate-card { background: #121a3e; }

@media (prefers-reduced-motion: reduce) { .moon .ripple { animation: none; opacity: .5; transform: none; } .moon .ripple:nth-child(n+2) { display: none; } }