.california-residence {
  --surface: var(--color-ivory-50);
  --link: var(--color-ink-900);
  background: var(--surface);
}
.cr-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.cr-opening { position: relative; }
.cr-opening-title {
  position: absolute;
  z-index: 1;
  inset: var(--space-5) 0 auto;
  pointer-events: none;
}
.cr-opening-title h1 { font-size: 5.4rem; max-width: 10ch; }
.cr-opening-title .meta-row { margin-top: var(--space-3); color: var(--color-ink-900); }
.cr-opening-media { width: min(100%, 1680px); margin: 0 auto; }
.cr-figure { margin: 0; min-width: 0; }
.cr-figure img { width: 100%; height: auto; }
.cr-foreword {
  padding-top: var(--space-5);
  padding-bottom: var(--space-6);
  border-bottom: 1px solid var(--line);
}
.cr-foreword .lead { max-width: 58ch; }
.cr-section { padding: var(--section-space) 0 0; }
.cr-section h2 { font-size: 3.8rem; max-width: 16ch; line-height: 1.05; }
.cr-heading { margin-bottom: var(--space-5); }
.cr-introduction,
.cr-split,
.cr-bath-intro,
.cr-closing-caption {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: var(--space-7);
  align-items: start;
}
.cr-introduction .stack { padding-top: var(--space-4); }
.cr-text-section .stack { max-width: 820px; margin: 0 auto; }
.cr-facts { padding-top: var(--space-7); }
.cr-facts dl {
  display: grid;
  grid-template-columns: 1fr 1fr 2fr;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  margin: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.cr-facts dt { color: var(--label); font-size: var(--fs-micro); text-transform: uppercase; }
.cr-facts dd { margin: var(--space-2) 0 0; color: var(--body); font-size: var(--fs-small); }
.cr-wide { width: min(100%, 1440px); margin: 0 auto; }
.cr-offset { width: min(86%, 1180px); margin-left: auto; }
.cr-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6); align-items: start; }
.cr-powder-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: var(--space-6);
  align-items: start;
}
.cr-powder-side { display: grid; gap: var(--space-6); }
.cr-editorial-note {
  width: min(820px, 100%);
  margin: var(--space-7) auto 0;
  padding: var(--space-6) 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.cr-editorial-note h2 { font-size: 3rem; max-width: 18ch; }
.cr-development { padding-bottom: var(--section-space); }
.cr-development-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-6);
}
.cr-technical { position: relative; margin: 0; min-width: 0; }
.cr-technical-scroll { overflow-x: auto; overscroll-behavior-x: contain; }
.cr-technical-link { display: block; cursor: zoom-in; }
.cr-technical img { display: block; width: 100%; height: auto; }
.cr-technical figcaption {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: baseline;
  gap: var(--space-2);
  padding-top: var(--space-2);
  color: var(--label);
  font-size: var(--fs-micro);
  line-height: 1.5;
}
.cr-technical figcaption > :first-child { font-family: var(--font-display); font-size: 1.45rem; color: var(--body); }
.cr-technical figcaption > :last-child { text-align: right; }
.cr-technical-expand {
  position: absolute;
  top: var(--space-2);
  right: var(--space-2);
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  color: var(--body);
  background: var(--surface);
}
.cr-technical-expand svg,
.cr-viewer-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cr-technical-tooltip {
  position: absolute;
  top: 60px;
  right: var(--space-2);
  z-index: 1;
  max-width: calc(100% - 32px);
  padding: var(--space-1) var(--space-2);
  background: var(--color-ink-900);
  color: var(--surface);
  font-size: var(--fs-micro);
  line-height: 1.5;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--duration-ui) ease;
  pointer-events: none;
}
.cr-technical-link:hover .cr-technical-tooltip,
.cr-technical-link:focus-visible .cr-technical-tooltip { opacity: 1; visibility: visible; }
.cr-technical-plan { width: min(96%, 980px); margin: var(--space-6) auto 0; }
.cr-technical-wide { width: min(94%, 1280px); margin: var(--space-6) 0 0 auto; }
.cr-technical-full { width: min(96%, 1360px); margin: var(--space-6) auto 0; }
.cr-technical-portrait { width: min(100%, 760px); margin: var(--space-6) auto 0; }
.cr-pair .cr-technical-portrait { margin-top: 0; }
.cr-closing { padding-bottom: var(--space-6); }
.cr-closing-caption { align-items: center; padding-top: var(--space-5); }
.cr-closing-caption h2 { font-size: 3.4rem; }
.cr-next {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--space-1);
  color: var(--color-ink-900);
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--line);
}
.cr-next span { font-size: var(--fs-micro); color: var(--label); }
.cr-next strong { display: flex; gap: var(--space-4); align-items: center; font-family: var(--font-display); font-size: 2.4rem; font-weight: 400; line-height: 1.15; }
.cr-next strong span { color: inherit; font-size: inherit; transition: transform var(--duration-ui) ease; }
.cr-next:hover strong span { transform: translateX(4px); }
.cr-drawing-open { overflow: hidden; }
.cr-drawing-viewer {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100dvh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: var(--surface);
  color: var(--body);
  overflow: hidden;
}
.cr-drawing-viewer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.cr-viewer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  min-height: 80px;
  padding: var(--space-2) var(--space-4);
  border-bottom: 1px solid var(--line);
}
.cr-viewer-header p { margin: 0; min-width: 0; font-family: var(--font-display); font-size: 1.6rem; line-height: 1.1; }
.cr-viewer-controls { display: flex; gap: var(--space-1); flex: 0 0 auto; }
.cr-viewer-button {
  position: relative;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--body);
}
.cr-viewer-button:hover,
.cr-viewer-button[aria-pressed="true"] { background: var(--color-ivory-100); }
.cr-viewer-button .cr-technical-tooltip { top: 48px; right: 0; max-width: none; white-space: nowrap; }
.cr-viewer-button:hover .cr-technical-tooltip,
.cr-viewer-button:focus-visible .cr-technical-tooltip { opacity: 1; visibility: visible; }
.cr-viewer-stage { display: grid; place-items: center; height: 100%; min-height: 0; padding: var(--space-4); overflow: auto; }
.cr-viewer-image { width: auto; height: auto; max-width: 100%; max-height: calc(100dvh - 80px - var(--space-4) - var(--space-4)); object-fit: contain; }
.cr-drawing-viewer.is-actual-size .cr-viewer-stage { display: block; }
.cr-drawing-viewer.is-actual-size .cr-viewer-image { max-width: none; max-height: none; margin: 0 auto; }

@media (max-width: 1200px) {
  .cr-opening-title h1 { font-size: 4.4rem; }
  .cr-section h2 { font-size: 3.25rem; }
  .cr-introduction, .cr-split, .cr-bath-intro, .cr-closing-caption { gap: var(--space-5); }
}
@media (max-width: 980px) {
  .cr-opening-title { inset-block-start: var(--space-4); }
  .cr-opening-title h1 { font-size: 3.5rem; }
  .cr-introduction, .cr-split, .cr-bath-intro, .cr-closing-caption, .cr-development-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .cr-facts dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cr-pair, .cr-powder-grid { grid-template-columns: minmax(0, 1fr); }
  .cr-offset, .cr-technical-wide, .cr-technical-full { width: 100%; }
}
@media (max-width: 680px) {
  .cr-opening-title { position: static; padding-top: var(--space-4); padding-bottom: var(--space-3); }
  .cr-opening-title h1 { font-size: 3.4rem; max-width: none; }
  .cr-opening-title .meta-row { margin-top: var(--space-2); }
  .cr-foreword { padding-top: var(--space-4); padding-bottom: var(--space-5); }
  .cr-section h2 { font-size: 2.65rem; }
  .cr-heading { margin-bottom: var(--space-4); }
  .cr-facts { padding-top: var(--space-5); }
  .cr-facts dl { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
  .cr-pair, .cr-powder-side { gap: var(--space-4); }
  .cr-editorial-note { margin-top: var(--space-5); padding: var(--space-4) 0; }
  .cr-editorial-note h2 { font-size: 2.45rem; }
  .cr-technical-link { min-width: 0; }
  .cr-technical figcaption { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
  .cr-technical figcaption > :last-child { text-align: left; }
  .cr-technical-expand { top: var(--space-1); right: var(--space-1); }
  .cr-closing { padding-bottom: var(--space-5); }
  .cr-closing-caption { padding-top: var(--space-4); }
  .cr-closing-caption h2 { font-size: 2.65rem; }
  .cr-next { align-items: flex-start; width: 100%; }
  .cr-next strong { width: 100%; justify-content: space-between; font-size: 2rem; }
}
@media (max-width: 400px) {
  .cr-opening-title h1 { font-size: 3rem; }
  .cr-section h2 { font-size: 2.4rem; }
}