/* Revision 35: original exhibition layouts, sized to the available viewport.
   Load after editorial.css. Photo registration and real UI stay untouched. */

/* The chair retains its vertical title/poem and the original mineral surface. */
#overview.ordinary-chapter {
  position:relative;
  isolation:isolate;
  margin-top:0;
  padding-top:58px;
  padding-bottom:30px;
  --chair-image-width:min(48vw,510px,calc((100svh - 240px)*.75));
  --ink:#26372d;
  --muted:#45533f;
  --line:#52634840;
}
#overview::before {
  content:'';
  position:absolute;
  z-index:-1;
  inset:0 auto 0 50%;
  width:100vw;
  transform:translateX(-50%);
  background:linear-gradient(125deg,#c3c8bb,#aeb8a6);
}
#overview>.chair-eyebrow { top:22px; color:#45533f; }
#overview .chair-chapter h2 { color:#2e4034; }
#overview .chair-chapter>.chair-memory { color:#43513e; }
#overview .chapter-label>.signal-ring { border-color:#9b513d; }
#overview .depth-capture-stage { box-shadow:0 18px 50px #34433022; }
#overview .depth-capture-caption {
  min-height:44px;
  padding-top:6px;
  border-color:#52634840;
}
#overview #depth-capture-help {
  padding:7px 0;
  background:transparent;
  color:#42513d;
}
#overview .depth-capture-caption button { min-width:0; color:#3d4f36; }
#overview .depth-capture-caption button:hover { color:#1f3526; }

@media(orientation:portrait) {
  #overview.ordinary-chapter {
    width:min(580px,calc(100% - 40px),calc((100svh - 300px)*.75 + 42px));
    grid-template-columns:28px minmax(0,1fr);
    column-gap:14px;
    padding-top:30px;
    padding-bottom:24px;
  }
  #overview .chair-chapter,
  #overview .depth-capture-figure { display:contents; }
  #overview>.chair-eyebrow { position:static; margin:0 0 18px; }
  #overview .chair-chapter h2 { margin-top:18px; font-size:27px; }
  #overview .depth-capture-stage { width:100%; margin:0; }
  #overview .chair-chapter>.chair-memory {
    margin-top:14px;
    font-size:clamp(11px,3.33vw,14px);
    line-height:1.9;
  }
  #overview .depth-capture-caption {
    margin-top:12px;
    padding-top:6px;
    flex-wrap:nowrap;
    gap:6px;
  }
  #overview #depth-capture-help,
  #overview .depth-capture-caption button { font-size:10px; }
}
@media(max-height:600px) and (orientation:landscape) {
  #overview.ordinary-chapter {
    --chair-image-width:min(300px,max(130px,calc((100svh - 210px)*.75)));
    padding-top:40px;
    padding-bottom:20px;
  }
  #overview>.chair-eyebrow { top:12px; }
  #overview .depth-capture-caption { padding-top:0; }
}

/* The original device-left / controls-right demonstration sits on light paper.
   The stage's aspect ratio includes the entire rear photograph and its screen. */
#possibilities.possibilities-story {
  background:#f5f5f3;
  color:#252d27;
  --ink:#252d27;
  --muted:#646c64;
  --line:#d4d8d0;
  --shader-columns:minmax(0,1.4fr) minmax(0,.75fr);
  --shader-column-gap:8%;
}
#possibilities .possibilities-heading {
  padding-top:28px;
  padding-bottom:14px;
  border:0;
  align-items:start;
}
#possibilities .possibilities-heading>.eyebrow {
  margin:0 0 12px;
  color:#626c62;
}
#possibilities .shader-definition {
  max-width:42em;
  font-size:13px;
  line-height:1.75;
  color:#616a61;
}
#possibilities .shader-definition h2 {
  margin:0 0 8px;
  font-size:clamp(32px,3vw,42px);
  line-height:1.22;
  color:#252d27;
}
#possibilities .possibilities-workspace {
  padding-top:0;
  padding-bottom:20px;
  row-gap:8px;
}
#possibilities .rear-camera-stage {
  width:min(100%,max(280px,calc((100svh - 350px)*1.26875)));
  aspect-ratio:4060/3200;
  height:auto;
  justify-self:start;
  background:transparent;
  overflow:hidden;
}
#possibilities .rear-product-photo { filter:none; }
#possibilities .screen-controls-label {
  margin:0 0 12px;
  font-size:11px;
  line-height:1.7;
  color:#687166;
}
#possibilities .screen-style-switches button {
  min-height:48px;
  padding:13px 12px;
  gap:16px;
  border:0;
  border-bottom:1px solid #d4d8d0;
  background:transparent;
  font-size:13px;
  color:#566252;
}
#possibilities .screen-style-switches button:first-child { border-top:1px solid #d4d8d0; }
#possibilities .screen-style-switches button span { color:#7b8478; }
#possibilities .screen-style-switches button[aria-pressed=true] {
  background:#e9ece5;
  box-shadow:inset 2px 0 #a55741;
  color:#253c27;
}
#possibilities .screen-style-switches button[aria-pressed=true] span { color:#96523e; }
#possibilities .screen-style-switches button:hover { background:#ecefe8; color:#253c27; }
#possibilities #screen-style-caption {
  min-height:3.6em;
  margin-top:12px;
  font-size:12px;
  line-height:1.8;
  color:#626d5e;
}
#possibilities .toolkit-entry { margin:0; }
#possibilities .toolkit-link {
  height:auto;
  min-height:44px;
  padding:0;
  font-size:11px;
  line-height:1.6;
  border-color:#c9d0c3;
  color:#3b5035;
}
#possibilities .possibilities-reading { padding-top:12px; padding-bottom:48px; }
#possibilities .essay-entry { border-color:#d4d8d0; }
#possibilities .essay-title,
#possibilities .essay-text p { color:#657060; }
#possibilities .essay-details summary { color:#35482f; }
#possibilities .essay-details summary span { color:#a55741; }

@media(min-width:761px) {
  #possibilities .handheld-figure,
  #possibilities .screen-expressions { display:contents; }
  #possibilities .screen-controls { align-self:center; }
}
/* Reserve space for the heading, controls and closed preface at every desktop height. */
@media(min-width:761px) {
  #possibilities .possibilities-heading { padding-top:16px; }
  #possibilities .possibilities-workspace { padding-bottom:12px; }
  #possibilities .rear-camera-stage {
    width:min(100%,max(280px,calc((100svh - 365px)*1.26875)));
  }
  #possibilities .possibilities-reading { padding-top:8px; padding-bottom:16px; }
  #possibilities .essay-entry { padding-top:8px; }
}
@media(max-width:760px) {
  #possibilities .possibilities-heading { padding-top:28px; padding-bottom:14px; }
  #possibilities .shader-definition { max-width:none; font-size:12px; line-height:1.8; }
  #possibilities .shader-definition h2 { font-size:32px; }
  #possibilities .possibilities-workspace { display:block; padding-bottom:20px; }
  #possibilities .handheld-figure { display:block; width:100%; max-width:none; margin:0; }
  #possibilities .rear-camera-stage {
    width:min(100%,max(200px,calc((100svh - 445px)*1.26875)));
    margin:0 auto;
  }
  #possibilities .screen-expressions {
    display:block;
    max-width:none;
    margin:14px 0 0;
    padding:0;
  }
  #possibilities .screen-controls-label { margin-bottom:10px; }
  #possibilities .screen-style-switches {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
  }
  #possibilities .screen-style-switches button {
    justify-content:center;
    min-height:44px;
    padding:11px 3px;
    gap:6px;
    border-top:1px solid #d4d8d0;
    font-size:11px;
  }
  #possibilities .screen-style-switches button[aria-pressed=true] {
    box-shadow:inset 0 -2px #a55741;
  }
  #possibilities #screen-style-caption { min-height:3.6em; font-size:11px; }
  #possibilities .toolkit-entry { margin-top:10px; }
  #possibilities .toolkit-link { display:flex; justify-content:space-between; width:100%; }
  #possibilities .possibilities-reading { padding-top:0; padding-bottom:24px; }
  #possibilities .essay-entry { padding-top:12px; gap:8px; }
}