/* The brand story is one server-rendered page with a side-mounted chapter wheel. */
body:has(.zen-story-page) { background: #f7f7f4; }
/* About owns its chapter backgrounds instead of the shared mountain wallpaper. */
body.zen-image-bg-mountains:has(.zen-story-page)::before { content: none; }
.zen-story-page.zen-and-tao-about .zen-story-background { display: block; }
.zen-story-page {
  --story-font: "Jost", "Noto Sans SC", "PingFang SC", Arial, sans-serif;
  --story-ink: #172027;
  --story-body: #4f585b;
  --story-muted: #7f8787;
  --story-paper: #f7f7f4;
  --story-blue: #2d4b5f;
  --story-blue-deep: #1c3342;
  --story-line: rgba(23,32,39,.2);
  --story-background-wash: rgba(247,247,244,.8);
  --story-header-height: 104px;
  --story-radius: min(clamp(144px,20vw,304px),calc((100svh - var(--story-header-height) - 80px) / 2));
  --story-link-width: 204px;
  --story-navigation-width: calc(var(--story-radius) + var(--story-link-width) + 24px);
  --story-step: 45deg;
  --story-rotation: 0deg;
  --story-motion: 400ms;
  --story-ease: cubic-bezier(.22,1,.36,1);
  --story-title-size: clamp(30px,3.2vw,44px);
  --story-content-inset: 24px;
  --story-content-end-inset: clamp(40px,5vw,80px);
  position: relative;
  isolation: isolate;
  min-width: 0;
  color: var(--story-ink);
  font-family: var(--story-font);
  font-size: 17px;
  line-height: 1.78;
}
/* Chapter palettes also apply to the text-only fallback when JavaScript is unavailable. */
.zen-story-page[data-story-theme="origins"], #story-origins {
  --story-paper: #f2ede3;
  --story-ink: #494438;
  --story-blue: #494438;
  --story-body: #575348;
  --story-line: rgb(73 68 56 / 24%);
  --story-background-wash: rgb(242 237 227 / 90%);
}
.zen-story-page[data-story-theme="philosophy"], #story-philosophy {
  --story-paper: #dee7dd;
  --story-ink: #2f493b;
  --story-blue: #2f493b;
  --story-body: #46574b;
  --story-line: rgb(47 73 59 / 24%);
  --story-background-wash: rgb(222 231 221 / 90%);
}
.zen-story-page[data-story-theme="elements"], #story-elements {
  --story-paper: #1c3342;
  --story-ink: #fff8ea;
  --story-blue: #fff8ea;
  --story-body: #e5ebed;
  --story-line: rgb(255 248 234 / 28%);
  --story-background-wash: rgb(28 51 66 / 84%);
}
.zen-story-page[data-story-theme="materials"], #story-materials {
  --story-paper: #594735;
  --story-ink: #fff1d8;
  --story-blue: #fff1d8;
  --story-body: #ece2d2;
  --story-line: rgb(255 241 216 / 28%);
  --story-background-wash: rgb(89 71 53 / 88%);
}
.zen-story-page[data-story-theme="closing"], #story-closing {
  --story-paper: #eadcc8;
  --story-ink: #594534;
  --story-blue: #594534;
  --story-body: #625448;
  --story-line: rgb(89 69 52 / 24%);
  --story-background-wash: rgb(234 220 200 / 92%);
}
.zen-story-background { position: fixed; inset: 0; z-index: -1; pointer-events: none; }
.zen-story-background img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.zen-story-background::after { content: ""; position: absolute; inset: 0; background: var(--story-background-wash); transition: background-color var(--story-motion) var(--story-ease); }
.zen-story-overview { display: grid; min-height: calc(100svh - var(--story-header-height)); place-items: center; padding: 32px; scroll-margin-top: var(--story-header-height); }
.zen-story-overview__box { width: 100%; max-width: 760px; background: rgba(255,255,255,.7); text-align: center; }
.zen-story-overview__artwork { display: block; width: 100%; height: auto; margin: 0; }
.zen-story-overview__content { padding: 48px 64px; }
.zen-story-overview h1 { margin: 0 0 32px; color: var(--story-blue); font-family: var(--story-font); font-size: var(--story-title-size); font-weight: 400; line-height: 1.2; text-wrap: balance; }
.zen-story-overview__copy { display: grid; gap: 20px; color: var(--story-body); }
.zen-story-overview__copy p { margin: 0; }
.zen-story-overview__link { margin-top: 32px; }
.zen-story-overview__link.zen-home-collection-button { font-family: "Jost", Arial, sans-serif; }
.zen-story-overview[hidden], .zen-story-shell[hidden] { display: none !important; }
.zen-story-shell { position: relative; min-width: 0; }
.zen-story :where(h2,h3,p,figure,figcaption) { margin: 0; }
.zen-story :where(h2,h3) { color: var(--story-ink); font-family: var(--story-font); font-weight: 400; line-height: 1.2; text-wrap: balance; }
.zen-story h3 { font-size: 24px; }
.zen-story p { color: var(--story-body); overflow-wrap: anywhere; }
.zen-story-label { width: 100%; margin-bottom: 32px !important; color: var(--story-blue) !important; font-size: var(--story-title-size); letter-spacing: 0; text-align: center; }
.zen-story-prose { display: grid; gap: 20px; }
.zen-story-actions { display: flex; justify-content: center; margin-top: 32px; }
.zen-story, .zen-story-box, .zen-story-prose { min-width: 0; }
.zen-story-box { position: relative; isolation: isolate; max-width: 900px; margin-inline: auto; padding: 80px 32px; scroll-margin-top: calc(var(--story-header-height) + 24px); }
.zen-story-chapter-artwork { position: absolute; inset: 0; z-index: -2; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; pointer-events: none; }
.zen-story-box::before { position: absolute; inset: 0; z-index: -1; content: ""; background: var(--story-background-wash); pointer-events: none; }
/* Beginnings keeps its two reserved images in an unequal four-cell layout. */
.zen-story-beginnings { --beginning-grid-gap: 24px; }
.zen-story-beginnings__grid { gap: var(--beginning-grid-gap); }
.zen-story-beginnings__row { display: grid; min-width: 0; gap: var(--beginning-grid-gap); align-items: center; }
.zen-story-beginnings__row--opening { grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); }
.zen-story-beginnings__row--reflection { grid-template-columns: minmax(0,1fr) minmax(0,1.65fr); }
.zen-story-beginnings__image { display: block; width: 100%; min-width: 0; border: 1px solid var(--story-line); background: rgba(45,75,95,.06); object-position: center; }
.zen-story-beginnings__image--upper { min-height: 260px; height: 100%; border: 0; background: transparent; }
.zen-story-beginnings__image--lower { min-height: 200px; height: 100%; }
.zen-story-beginnings__image--upper { object-fit: contain; }
.zen-story-beginnings__image--lower { object-fit: cover; }
/* Titles join the prose wrap around each chapter's reserved image space. */
:is(.zen-story-philosophy, .zen-story-materials) .zen-story-prose { display: flow-root; }
.zen-story-philosophy__portrait {
  float: left;
  display: block;
  width: min(32%, 260px);
  height: auto;
  aspect-ratio: 3 / 5;
  object-fit: cover;
  object-position: 65% center;
  margin: 0 28px 20px 0;
}
.zen-story-materials__image-space {
  float: right;
  display: block;
  width: min(40%, 320px);
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center;
  margin: 0 0 20px 28px;
}
:is(.zen-story-philosophy, .zen-story-materials) .zen-story-label { width: auto; }
:is(.zen-story-philosophy, .zen-story-materials) .zen-story-prose p + p { margin-top: 20px; }
@media (min-width: 768px) {
  .zen-story-philosophy__portrait { aspect-ratio: 1 / 2; }
}
/* The enhanced chapter browser shares the fixed background across both columns. */
.is-enhanced .zen-story-chapter-artwork { display: none; }
.is-enhanced .zen-story-box::before { content: none; }
.zen-story-navigation { padding: 40px 24px 16px; }
.zen-story-navigation__wheel { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.zen-story-navigation__artwork { display: none; }
.zen-story-navigation__link { color: var(--story-body); text-decoration: none; }
.zen-story-navigation__link[aria-current] { color: var(--story-ink); }

/* Enhancement changes presentation only; every chapter stays in the HTML. */
.zen-story-shell.is-enhanced { display: grid; height: calc(100svh - var(--story-header-height)); min-height: 560px; grid-template-columns: var(--story-navigation-width) minmax(0,1fr); grid-template-rows: minmax(0,1fr); }
.is-enhanced .zen-story-navigation { position: relative; min-width: 0; grid-row: 1; grid-column: 1; padding: 0; }
.is-enhanced .zen-story-navigation__frame { position: relative; height: 100%; overflow: hidden; }
.is-enhanced .zen-story-navigation__wheel { position: absolute; top: 50%; left: 0; display: block; width: calc(2 * var(--story-radius)); height: calc(2 * var(--story-radius)); transform: translate(-50%,-50%); }
.is-enhanced .zen-story-navigation__artwork { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; transform: rotate(var(--story-rotation)); transition: transform var(--story-motion) var(--story-ease); }
.is-enhanced .zen-story-navigation__spoke { --story-angle: calc(var(--story-slot) * var(--story-step)); position: absolute; z-index: 1; top: 50%; left: 50%; width: var(--story-radius); height: 1px; transform-origin: left center; transform: rotate(var(--story-angle)); transition: transform var(--story-motion) var(--story-ease); }
.is-enhanced .zen-story-navigation__spoke.is-wrapping { transition: none; animation: story-wrap var(--story-motion) ease; }
.is-enhanced .zen-story-navigation__spoke[hidden] { display: none; }
.is-enhanced .zen-story-navigation__link { position: absolute; top: 0; left: 100%; display: flex; width: var(--story-link-width); min-height: 48px; align-items: center; padding: 8px 8px 8px 14px; color: var(--story-body); font-family: var(--story-font); font-size: clamp(21px,2vw,28px); line-height: 1.3; white-space: nowrap; transform-origin: left center; transform: translateY(-50%) rotate(calc(-1 * var(--story-angle))); transition: transform var(--story-motion) var(--story-ease), color 120ms ease; }
.is-enhanced .zen-story-navigation__link[aria-current] { color: var(--story-ink); }
.is-enhanced .is-wrapping .zen-story-navigation__link { transition: color 120ms ease; }
.is-enhanced .zen-story { grid-column: 2; grid-row: 1; height: 100%; overflow-y: auto; overflow-x: hidden; overscroll-behavior-y: contain; scrollbar-width: thin; scrollbar-color: var(--story-line) transparent; }
.is-enhanced .zen-story-box { display: flex; width: 100%; min-height: 100%; max-width: 1120px; margin-inline: 0; flex-direction: column; justify-content: center; gap: 0; padding: 40px var(--story-content-end-inset) 40px var(--story-content-inset); }
.is-enhanced .zen-story-beginnings { justify-content: flex-start; }
.zen-story-box[hidden] { display: none !important; }
.zen-story-page :where(a,[data-story-reader]):focus-visible { outline: 2px solid var(--story-blue); outline-offset: 5px; }
@media (hover: hover) and (pointer: fine) {
  .zen-story-navigation__link:hover { color: var(--story-ink); }
}
@keyframes story-wrap { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 1100px) {
  .zen-story-page { --story-link-width: 180px; }
  .is-enhanced .zen-story-navigation__link { font-size: 22px; gap: 16px; }
  .zen-story-beginnings { --beginning-grid-gap: 16px; }
  .zen-story-beginnings__row { align-items: start; }
  .zen-story-beginnings__row--opening { grid-template-columns: minmax(0,2.2fr) minmax(0,1fr); }
  .zen-story-beginnings__row--reflection { grid-template-columns: minmax(0,1fr) minmax(0,2.65fr); }
  .zen-story-beginnings__image--upper { min-height: 0; height: clamp(160px,24vw,240px); }
  .zen-story-beginnings__image--lower { min-height: 0; height: clamp(128px,20vw,200px); }
}
@media (max-width: 767px) {
  .zen-story-page { --story-radius: min(34vw,136px); --story-link-width: min(28vw,116px); --story-side-label-gap: 24px; --story-side-label-drop: 16px; --story-navigation-height: calc(var(--story-radius) + 72px); --story-content-inset: 24px; --story-content-end-inset: 24px; --story-title-size: 28px; --story-header-height: 84px; --story-mobile-gap: 24px; font-size: 16px; }
  .zen-story-overview { padding: 32px 24px; }
  .zen-story-overview__content { padding: 40px 24px; }
  .zen-story-overview h1 { margin-bottom: 24px; }
  .zen-story-overview__copy { gap: 18px; }
  :is(.zen-story-overview__link, .zen-story-actions > a).zen-home-collection-button { width: min(232px, 100%); min-height: 48px; padding: 12px 24px; font-size: 16px; }
  .zen-story-box { padding: 48px 24px; }
  .zen-story-shell.is-enhanced { height: calc(100dvh - var(--story-header-height)); min-height: 480px; grid-template-columns: minmax(0,1fr); grid-template-rows: var(--story-navigation-height) minmax(0,1fr); }
  .is-enhanced .zen-story-navigation { grid-column: 1; grid-row: 1; }
  /* The desktop side wheel becomes a downward-facing half wheel below the header. */
  .is-enhanced .zen-story-navigation__wheel { top: 0; left: 50%; }
  .is-enhanced .zen-story-navigation__artwork { transform: rotate(calc(90deg + var(--story-rotation))); }
  .is-enhanced .zen-story-navigation__spoke { --story-angle: calc(90deg + var(--story-slot) * var(--story-step)); }
  .is-enhanced .zen-story-navigation__link { width: var(--story-link-width); min-height: 48px; justify-content: center; align-items: flex-start; padding: 8px 4px; font-size: 17px; line-height: 1.25; text-align: center; white-space: normal; transform-origin: top left; transform: rotate(calc(-1 * var(--story-angle))) translateX(-50%); }
  .is-enhanced .zen-story-navigation__link[aria-current] { padding-top: 16px; }
  /* Move neighbouring labels outward and below the curved artwork edge. */
  .is-enhanced .zen-story-navigation__link:not([aria-current]) { transform: rotate(calc(-1 * var(--story-angle))) translate(calc(-50% - var(--story-slot) * var(--story-side-label-gap)), var(--story-side-label-drop)); }
  .is-enhanced .zen-story { grid-column: 1; grid-row: 2; }
  .is-enhanced .zen-story-box { justify-content: flex-start; padding-block: 16px 32px; }
  .zen-story-label { margin-bottom: var(--story-mobile-gap) !important; }
  .zen-story-prose { gap: var(--story-mobile-gap); }
  /* On phones the editorial grids and floats become a single reading column. */
  .zen-story-beginnings__row { grid-template-columns: minmax(0,1fr); gap: var(--story-mobile-gap); }
  .zen-story-beginnings__row--reflection p { grid-row: 1; }
  .zen-story-beginnings__image--upper { width: 100%; height: auto; min-height: 0; aspect-ratio: 1600 / 1195; }
  .zen-story-beginnings__image--lower { width: 100%; height: auto; min-height: 0; aspect-ratio: 4 / 3; }
  :is(.zen-story-philosophy, .zen-story-materials) .zen-story-prose { display: grid; grid-template-columns: minmax(0,1fr); }
  :is(.zen-story-philosophy, .zen-story-materials) .zen-story-label { grid-row: 1; margin-bottom: 0 !important; }
  :is(.zen-story-philosophy__portrait, .zen-story-materials__image-space) { float: none; grid-row: 2; width: 100%; margin: 0; }
  .zen-story-philosophy__portrait { width: min(100%,260px); aspect-ratio: 3 / 4; justify-self: center; }
  .zen-story-materials__image-space { aspect-ratio: 16 / 9; }
  :is(.zen-story-philosophy, .zen-story-materials) .zen-story-prose p + p { margin-top: 0; }
}
@media (max-height: 560px) and (min-width: 768px) {
  .zen-story-page { --story-radius: 176px; }
  .zen-story-shell.is-enhanced { min-height: 380px; }
}
@media (prefers-reduced-motion: reduce) {
  .zen-story-background::after,
  .is-enhanced .zen-story-navigation__spoke,
  .is-enhanced .zen-story-navigation__spoke.is-wrapping,
  .is-enhanced .zen-story-navigation__artwork,
  .is-enhanced .zen-story-navigation__link { transition: none; animation: none; }
}
