/* One spacing rhythm; the established artwork, colour and typefaces stay intact. */
:root {
  --page-gutter: clamp(20px, 2vw, 32px);
  --gutter: var(--page-gutter);
  --space-copy: 20px;
  --space-heading: 24px;
  --space-group: clamp(32px, 4vw, 56px);
  --space-section: clamp(56px, 6vw, 96px);
}
.wheel-preview #remaining-content > .section,
.mm-release #remaining-content > .section {
  width: auto;
  max-width: none;
  margin: 0;
  padding: var(--space-section) var(--page-gutter);
}
.wheel-preview #remaining-content .section-top { margin: 0 0 var(--space-heading); }
.wheel-preview #remaining-content .section-top > .muted { display: none; }
.wheel-preview #remaining-content :is(.blood-intro, .split-heading, .accord-layout) {
  display: block;
  margin: 0;
}
.wheel-preview #remaining-content :is(.blood-intro, .accord-intro) { padding: 0; }
.wheel-preview #remaining-content h2 {
  margin: 0;
  font-size: clamp(42px, 6vw, 88px);
  line-height: 1.12;
  max-width: 24ch;
}
/* Only authored second lines are offset; inline emphasis stays inline. */
.wheel-preview #remaining-content h2 br + em {
  display: inline-block;
  padding-inline-start: clamp(12px, 1.75vw, 25px);
  max-width: 100%;
}
.wheel-preview #remaining-content :is(.blood-intro, .accord-intro) > p,
.wheel-preview #remaining-content .split-heading > div > h2 + p {
  width: auto;
  max-width: 60ch;
  margin: 16px 0 0;
  font-size: 1rem;
  line-height: 1.75;
  color: #b7c2ba;
}
.wheel-preview #remaining-content :is(.blood-grid, .path-list, .accord-index, .join-steps) {
  margin-top: var(--space-group);
}
.wheel-preview #remaining-content :is(.path-list, .join-steps) { max-width: 960px; }
.wheel-preview #remaining-content .accord-index {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 48px;
  max-width: 1120px;
}
.wheel-preview #remaining-content .accord-open { margin-top: 18px; }
.wheel-preview #remaining-content .join-section p.editorial-note {
  margin: var(--space-copy) 0;
  max-width: 68ch;
}
.wheel-preview #remaining-content .blood-copy { max-width: 540px; }
.wheel-preview #remaining-content .blood-copy h3 { margin-block: 16px var(--space-heading); }
.wheel-preview #remaining-content .blood-card ul { margin-block: var(--space-copy); }
.wheel-preview #remaining-content .path-list > a { padding-block: var(--space-heading); }

/* The year, its bounds and all homepage headings share one left edge. */
/* The arc follows the same inset as the year. Keep a clear reading gap.
   Do not shrink the approved year typography to compensate for a fixed arc. */
.wheel-station { grid-template-columns: max(clamp(310px,24vw,340px),calc(var(--page-gutter) + 268px)) minmax(0,1fr); }
.history-wheel > svg { transform: translateX(calc(var(--page-gutter) - 122px)); }
.wheel-readout { left: var(--page-gutter); width: 174px; }
.wheel-year {
  font-size: calc(72px / var(--year-units, 1));
  line-height: 1.15;
  padding: 0;
  letter-spacing: -.035em;
  font-variant-numeric: tabular-nums;
}
.wheel-year-caption { margin-left: 0; }
.wheel-bound { left: var(--page-gutter); }
.wheel-preview #w-archive { padding-right: var(--page-gutter); }
.wheel-preview p.editorial-note, .mm-release p.editorial-note { font-size: .9375rem; }
@media (min-width:701px) and (max-width:1000px) {
  .wheel-station { grid-template-columns: calc(var(--page-gutter) + 258px) minmax(0,1fr); }
  .history-wheel > svg { transform: translateX(calc(var(--page-gutter) - 89px)); }
  .wheel-year { font-size: calc(64px / var(--year-units, 1)); }
  .wheel-readout { width: 154px; }
}
@media (max-width:700px) {
  .wheel-preview #w-archive { padding-inline: 0; }
  .history-wheel { height: 260px; }
  .history-wheel > svg { width: 325px; height: 303px; transform: translate(-20px,-50%); }
  .wheel-readout { width: 146px; }
  .wheel-year { font-size: calc(60px / var(--year-units, 1)); }
  .wheel-bound-start { top: 18px; }
  .wheel-bound-end { bottom: 18px; }
  .wheel-story { padding: var(--space-heading) var(--page-gutter) 0; }
  .wheel-preview #remaining-content .accord-index { grid-template-columns: minmax(0,1fr); gap: 0; }
  .wheel-preview #remaining-content h2 { font-size: clamp(36px, 8.6vw, 56px); }
}

/* Shared interior-page margins and reading rhythm. */
.mm-release .mm-wrap,
.path-layout,
.path-siblings {
  width: min(1200px, calc(100% - var(--page-gutter) * 2));
  margin-inline: auto;
}
.cohesion-path .inner-hero, .line-page .inner-hero { padding-inline: var(--page-gutter); }
.rich-copy p, .guide-copy p, .mm-release .mm-prose p { margin-block: 0 var(--space-copy); }
.guide-copy section { margin-bottom: var(--space-section); }
.guide-copy h2 { margin-bottom: var(--space-heading); }
.rich-copy li + li, .mm-release .mm-prose li + li { margin-top: 8px; }
.path-siblings { padding-block: var(--space-copy); margin-bottom: var(--space-group); }
.path-next { padding: var(--panel-inset); }
.mm-release .mm-shop-grid { gap: var(--space-heading); }
.mm-release .mm-shop-card { padding: var(--space-heading); }
.mm-release .mm-ap :is(input, select, textarea) { font-size: 1rem; line-height: 1.6; }

/* A quiet reading room above the wheel, never a new tab. */
dialog.chronicle-dialog {
  width: min(820px, calc(100vw - var(--page-gutter) * 2));
  max-width: none;
  max-height: min(820px, calc(100dvh - var(--page-gutter) * 2));
  padding: 0;
  border: 1px solid #b9a3f035;
  background: #0b0e0f;
  color: #dde2da;
  box-shadow: 0 24px 90px #0009;
  overscroll-behavior: contain;
}
dialog.chronicle-dialog::backdrop { background: #010303d9; backdrop-filter: blur(8px); }
.chronicle-dialog .chronicle-dialog-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 12px var(--page-gutter);
  position: sticky;
  top: 0;
  z-index: 1;
  background: #0b0e0ff5;
}
.chronicle-dialog .chronicle-dialog-bar .eyebrow { margin: 0; font-size: .75rem; }
.chronicle-dialog [data-entry-close] { min-height: 44px; padding: 8px 0 8px 16px; font-size: 1rem; }
.chronicle-dialog .chronicle-dialog-content { padding: 12px var(--page-gutter) var(--space-group); }
.chronicle-dialog .entry-date { color: #b7c2ba; font-size: 1rem; margin: 0 0 16px; }
.chronicle-dialog h2 { font: 400 clamp(32px,5vw,52px)/1.15 var(--serif); margin: 0 0 28px; }
.chronicle-dialog .entry-paragraph { display: block; margin-bottom: 20px; font: inherit; }
.chronicle-dialog :is(.entry-body, .entry-status, .entry-error) { font-size: var(--reading-body); line-height: 1.8; color: var(--reading-ink); }
.chronicle-dialog .entry-body > :last-child { margin-bottom: 0; }
.chronicle-dialog .entry-error button { margin-top: 16px; min-height: 44px; }
.chronicle-dialog :focus-visible { outline: 2px solid #b9a3f0; outline-offset: 4px; }
html:has(.chronicle-dialog[open]) { overflow: hidden; }
html { scrollbar-gutter: stable; }
@media (max-width:480px) {
  dialog.chronicle-dialog { width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
}

/* Release rc.9: a shared inset and a complete clock, at every viewport. */
:root{--page-gutter:clamp(24px,4.5vw,88px);--panel-inset:clamp(24px,3vw,44px);--hero-space:clamp(24px,3svh,48px);--hero-header:96px;--hero-admin:0px}
body.admin-bar{--hero-admin:32px}
.wheel-preview #remaining-content > .section{padding-inline:var(--page-gutter)}
.wheel-preview #remaining-content #w-kindred .blood-copy{width:min(100%,540px);justify-self:center;padding-inline:clamp(0px,2vw,36px);box-sizing:border-box}
.wheel-preview .site-header{height:auto;min-height:96px;padding-block:24px;box-sizing:border-box}
/* The clock shares equal space with the header above and caption below.
   Its square is bounded by both the column and viewport; artwork fills it. */
.wheel-preview .hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;column-gap:32px;row-gap:var(--hero-space);min-height:0;height:auto;padding:var(--hero-space) var(--page-gutter);overflow:hidden}
.wheel-preview .hero-top{display:none}
.wheel-preview .hero-art{position:relative;inset:auto;transform:none;grid-column:2;grid-row:1;width:min(100%,max(320px,calc(100svh - var(--hero-header) - var(--hero-admin) - var(--hero-space)*3 - 24px)));height:auto;aspect-ratio:1;z-index:0;max-width:none;justify-self:center;translate:none;mix-blend-mode:lighten}
.wheel-preview .hero-art>img{position:absolute;inset:7.25% auto auto 6%;width:88%;height:88%;object-fit:cover;object-position:center;mix-blend-mode:normal;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.wheel-preview .orbital{inset:8%;width:auto;aspect-ratio:1;transform:none}
.wheel-preview .orbital:before{inset:-3%}
.wheel-preview .orbit-marker{top:-3%;transform:translate(-50%,-50%);font-size:clamp(12px,1vw,16px);line-height:1}
.wheel-preview .hero-copy{grid-column:1;grid-row:1;width:100%;padding:0;position:relative;z-index:1}
.wheel-preview .hero-copy .hero-slogan{font-size:clamp(54px,6.6vw,112px)}
.wheel-preview .hero-join{display:inline-flex;align-items:center;gap:20px;min-height:48px;margin-top:32px;font-size:18px}
.wheel-preview .hero-bottom{position:static;display:block;grid-column:1/-1;padding:0;margin:0;min-height:24px;text-align:center}
.wheel-preview .hero-thread{display:block;font-size:14px;line-height:24px}
.site-footer .footer-brand{display:flex;align-items:center;gap:clamp(12px,3vw,48px);min-width:0}
.site-footer .footer-brand img{width:clamp(50px,11vw,160px);flex-shrink:0}
.site-footer .footer-brand h2{font-size:clamp(22px,6vw,94px);white-space:nowrap;line-height:1.15;margin:0}
.site-footer .footer-info nav{gap:12px 28px}
.site-footer .footer-info nav a{font-size:18px;line-height:1.5;min-height:48px;display:inline-flex;align-items:center}
@media(max-width:800px){
 :root{--hero-header:80px}
 body.admin-bar{--hero-admin:46px}
 .wheel-preview .site-header{min-height:80px;padding-block:18px}
 .wheel-preview .hero{grid-template-columns:minmax(0,1fr);gap:var(--hero-space);padding-block:var(--hero-space)}
 .wheel-preview .hero-art{grid-column:1;grid-row:1;width:min(100%,560px);opacity:1}
 .wheel-preview .hero-copy{grid-column:1;grid-row:2}
 .wheel-preview .hero-copy .hero-slogan{font-size:clamp(48px,10vw,74px)}
 .wheel-preview .hero-bottom{grid-row:3;font-size:14px}
 .wheel-preview #remaining-content #w-kindred .blood-copy{padding-inline:0}
 .site-footer .footer-info nav a{font-size:17px}
}
@media(min-width:701px){.wheel-readout{width:154px}.wheel-year{font-size:calc(62px / var(--year-units,1))}}

@media(max-width:700px){.wheel-readout{width:140px}.wheel-year{font-size:calc(57px / var(--year-units,1))}}
/* RC47: the wheel takes the room the screen gives it (owner, 23 October 2026). --wheel-box is the frame's
   height less its padding, the hint and the note, at most 44% of the width (58% on tablets). The arc is
   drawn at --wheel-h, never under its approved size, so a short screen crops the arc rather than shrink
   the year. The year, the bounds and the story grow with it; the drag maths reads the drawn size, so the
   script is unchanged. Phones keep their band. */
@media (min-width:701px) {
  .wheel-preview #w-archive {
    --wheel-box: clamp(330px, min(calc(var(--home-frame-height, calc(100dvh - 140px)) - 2 * var(--frame-pad, 24px) - 136px), 44vw), 1000px);
    --wheel-h: max(440px, var(--wheel-box));
    --wheel-shift: .2773; --wheel-reach: .609;
    --wheel-col: calc(var(--page-gutter) + var(--wheel-h) * var(--wheel-reach));
    --wheel-gap: max(clamp(24px, 4vw, 72px), min(calc(var(--wheel-h) * .1), 96px));
  }
  .wheel-station { grid-template-columns: var(--wheel-col) minmax(0,1fr); gap: var(--wheel-gap); min-height: var(--wheel-box); }
  .history-wheel { height: var(--wheel-box); }
  .history-wheel > svg { position: relative; top: calc((var(--wheel-box) - var(--wheel-h)) / 2); width: calc(var(--wheel-h) * 1.0727); height: var(--wheel-h); transform: translateX(calc(var(--page-gutter) - var(--wheel-h) * var(--wheel-shift))); }
  .wheel-readout { width: max(154px, calc(var(--wheel-h) * .35)); }
  .wheel-year { font-size: calc(max(62px, var(--wheel-h) * .141) / var(--year-units, 1)); }
  .wheel-year-caption { font-size: clamp(10px, calc(var(--wheel-h) * .0185), 14px); }
  .wheel-bound { font-size: clamp(22px, calc(var(--wheel-h) * .05), 44px); }
  .wheel-bound-start { top: calc(var(--wheel-box) * .052); }
  .wheel-bound-end { bottom: calc(var(--wheel-box) * .052); }
  .wheel-story { max-width: clamp(840px, calc(var(--wheel-h) * 1.35), 1080px); }
  .wheel-title { font-size: max(clamp(35px, 3.6vw, 58px), min(calc(var(--wheel-h) * .1), 84px)); }
  .wheel-summary { font-size: clamp(17px, calc(var(--wheel-h) * .029), 21px); }
  .wheel-story > .button { font-size: clamp(14px, calc(var(--wheel-h) * .022), 17px); padding: .7em 1.35em; }
  .wheel-preview #w-archive > .chronicle-evolving { margin-left: calc(var(--wheel-col) + var(--wheel-gap)); }
}
@media (min-width:701px) and (max-width:1000px) {
  .wheel-preview #w-archive {
    --wheel-box: clamp(330px, min(calc(var(--home-frame-height, calc(100dvh - 140px)) - 2 * var(--frame-pad, 24px) - 160px), 58vw), 600px);
    --wheel-h: max(390px, var(--wheel-box));
    --wheel-shift: .2282; --wheel-reach: .6615; --wheel-gap: 24px;
  }
  .wheel-title { font-size: max(35px, min(calc(var(--wheel-h) * .085), 46px)); }
  .wheel-summary { font-size: clamp(16px, calc(var(--wheel-h) * .029), 19px); }
}