/* Two distinct experiences: a shared story, then a cue you choose. */
.ambient-chapter{background:#e9e3d8;color:#29251f;padding-top:100px;padding-bottom:90px}
.chapter-heading{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:end;margin-bottom:44px;position:relative}
.chapter-heading h2{font-size:clamp(48px,6vw,88px);font-weight:400;line-height:1.04;letter-spacing:-.055em;margin:0}
.chapter-heading>p{font-size:20px;line-height:1.6;max-width:500px;color:#766b60;margin:0 0 4px}
.ambient-cinema{position:relative;margin:0;overflow:hidden;background:#332c25;isolation:isolate}
.ambient-cinema video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain}
.ambient-cinema:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#181410bd);pointer-events:none;z-index:1}
.cinema-caption{position:absolute;bottom:8%;left:6%;right:6%;z-index:2;color:#fff5e9;pointer-events:none}
.cinema-caption span{display:block;font-size:14px;color:#f1dbbf;margin-bottom:9px}
.cinema-caption p{font-size:clamp(23px,3vw,43px);letter-spacing:-.035em;line-height:1.18;max-width:690px;margin:0;text-wrap:balance}
.cinema-controls{position:absolute;z-index:3;top:20px;right:20px;display:flex;gap:8px}
.cinema-controls button{font-size:14px;background:#272019a8;border:1px solid #ffffff40;border-radius:99px;color:#fff2df;padding:10px 17px;backdrop-filter:blur(10px);min-height:40px}
.cinema-progress{position:absolute;z-index:3;height:2px;bottom:0;left:0;right:0;background:#ffffff20}
.cinema-progress i{display:block;height:100%;background:#f1d4a6;transform-origin:left;transform:scaleX(0)}
.ambient-film-picker{display:grid;grid-template-columns:1fr 1fr;margin-top:26px;gap:35px}
.ambient-film-picker button{background:none;color:#897b6c;text-align:left;border:0;border-top:2px solid #bfb1a64d;padding:18px 0 6px;position:relative}
.ambient-film-picker button[aria-selected=true]{color:#3a2a1d;border-color:#987951}
.ambient-film-picker span{font-size:23px;line-height:1.3;letter-spacing:-.025em;display:block}
.ambient-film-picker small{font-size:15px;line-height:1.5;display:block;margin-top:7px;color:#897b6c}
.ambient-caption{font-size:17px;line-height:1.6;color:#655c50;max-width:820px;margin:22px 0 0}
.demo-footnote{font-size:13px;line-height:1.5;color:#8a7f70;margin:15px 0 0}
.cue-chapter{background:#211c26;color:#f5e9db;padding-top:100px;padding-bottom:72px}
.cue-chapter .chapter-heading>p{color:#bdb0ba}
.cue-selector{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 1px;gap:1px;background:#67526455;border:1px solid #67526455}
.cue-selector button{position:relative;background:#29222e;color:#c4b5c3;border:0;min-height:66px;padding:16px 18px;display:flex;align-items:center;gap:13px;text-align:left;font-size:16px;line-height:1.25;transition:background .22s,color .22s}
.cue-selector button span{font-size:12px;letter-spacing:.06em;color:#877486}
.cue-selector button:hover{background:#39303d;color:#fff0dd}
.cue-selector button[aria-selected=true]{background:#e3c6a3;color:#33271f}
.cue-selector button[aria-selected=true] span{color:#937755}
.cue-demonstration{--cue-color:#f2c98a;position:relative;min-height:510px;display:grid;grid-template-columns:1fr 1.05fr 1fr;grid-template-rows:1fr auto;gap:20px;padding:36px 36px 22px;background:radial-gradient(ellipse at 51% 45%,#5a39464a,transparent 63%),#18151d;border:1px solid #67526455;isolation:isolate}
.cue-intention,.cue-result{align-self:center;z-index:2;min-width:0}
.cue-label{font-size:14px;color:#a38e9e;display:block;line-height:1.4;margin-bottom:18px}
.cue-intention blockquote{font-size:clamp(22px,2.3vw,32px);font-weight:400;line-height:1.25;letter-spacing:-.025em;margin:0;color:#eadbcc;max-width:315px}
.cue-intention>p{font-size:14px;color:#968593;line-height:1.6;margin-top:24px;max-width:260px}
.cue-object{height:410px;min-width:0;position:relative;align-self:center;grid-column:2;grid-row:1;isolation:isolate}
.cue-object .cue-sizing{width:100%;height:100%;display:block;object-fit:contain;opacity:0}
.cue-object .exact-chandelier{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.cue-object-glow{position:absolute;inset:12% -8% 7%;border-radius:50%;background:radial-gradient(ellipse,var(--cue-color),transparent 69%);filter:blur(30px);opacity:.08;transition:opacity 1s,background 1s;z-index:0}
.cue-demonstration.is-responding .cue-object-glow{opacity:.19}
.cue-result{min-height:275px;display:flex;flex-direction:column;justify-content:center}
.cue-moment{font-size:18px;line-height:1.5;color:#b6a9b4;margin:0 0 18px}
.cue-answer>p:first-child{font-size:clamp(21px,2.05vw,29px);letter-spacing:-.035em;line-height:1.3;color:var(--cue-color);margin:0}
.cue-art-response{font-size:14px;line-height:1.55;color:#a393a5;margin:16px 0 0}
.cue-answer{opacity:.28;transition:opacity .8s}
.cue-demonstration.is-responding .cue-answer,.cue-demonstration.is-finished .cue-answer{opacity:1}
.cue-playback{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid #6850664d;padding-top:18px;z-index:2}
.cue-timeline{display:flex;align-items:center;gap:12px;font-size:12px;line-height:1.4;color:#826f83}
.cue-timeline i{width:25px;height:1px;background:#584551}
.cue-timeline .is-current{color:#edd7be}
.cue-controls{display:flex;gap:17px;align-items:center}
.cue-controls button{font-size:13px;color:#beafba;background:none;border:0;padding:10px 0;min-height:40px}
.cue-controls button:hover{color:#ffe3bf}
.cue-afterword{display:grid;grid-template-columns:1fr 1fr;gap:8vw;margin-top:32px}
.cue-afterword>p{font-size:17px;line-height:1.6;color:#c0adbb;margin:0}
.cue-afterword details{border-top:0;margin:0;padding:0;color:#b5a4b2;font-size:15px;line-height:1.6}
.cue-afterword summary{font-size:16px;cursor:pointer;color:#dac5d3;padding:0 0 13px}
.cue-afterword details p{font-size:14px;color:#a48f9f;margin:12px 0}
.ambient-chapter button:focus-visible,.cue-chapter button:focus-visible,.cue-chapter summary:focus-visible{outline:2px solid #d2ae7b;outline-offset:4px;z-index:4}
@media(max-width:1000px){.cue-demonstration{padding:25px 23px 17px;gap:15px}.cue-selector button{font-size:14px;padding:14px 12px;gap:9px}.cue-object{height:340px}.cue-intention blockquote{font-size:23px}.cue-moment{font-size:16px}.cue-answer>p:first-child{font-size:22px}}
@media(max-width:700px){
 .ambient-chapter,.cue-chapter{padding-top:64px;padding-bottom:58px}
 .chapter-heading{grid-template-columns:1fr;gap:22px;margin-bottom:29px}.chapter-heading h2{font-size:49px}.chapter-heading>p{font-size:18px;line-height:1.55}
 .ambient-cinema{margin-left:-7vw;margin-right:-7vw}.cinema-caption{bottom:9%;left:7%;right:6%}.cinema-caption span{font-size:12px;margin-bottom:7px}.cinema-caption p{font-size:24px;max-width:320px}.cinema-controls{top:12px;right:13px;gap:6px}.cinema-controls button{padding:7px 11px;min-height:33px;font-size:12px}
 .ambient-film-picker{gap:20px;margin-top:20px}.ambient-film-picker span{font-size:20px}.ambient-film-picker small{font-size:14px}.ambient-caption{font-size:16px;margin-top:20px}
 .cue-selector{grid-template-columns:repeat(2,minmax(0,1fr))}.cue-selector button{font-size:15px;min-height:55px;padding:11px 12px}.cue-selector button span{font-size:11px}
 .cue-demonstration{grid-template-columns:minmax(0,1fr) minmax(110px,.8fr);grid-template-rows:auto auto auto;padding:28px 20px 15px;gap:20px 14px;min-height:0}
 .cue-intention{grid-column:1;grid-row:1;align-self:center}.cue-intention blockquote{font-size:22px}.cue-intention>p{font-size:13px;margin-top:17px}.cue-label{font-size:13px;margin-bottom:13px}
 .cue-object{grid-column:2;grid-row:1;height:285px}.cue-result{grid-column:1/-1;grid-row:2;min-height:0;padding-top:10px;border-top:1px solid #6850664d}.cue-moment{font-size:16px}.cue-answer>p:first-child{font-size:25px;max-width:440px}.cue-art-response{font-size:14px;margin-top:12px}.cue-result .cue-label{margin-bottom:9px}
 .cue-playback{grid-row:3;flex-direction:column;gap:4px;align-items:stretch;padding-top:15px}.cue-timeline{justify-content:space-between;font-size:11px;gap:6px}.cue-timeline i{width:15px}.cue-controls{justify-content:space-between;gap:16px}.cue-controls button{font-size:14px}
 .cue-afterword{grid-template-columns:1fr;gap:24px;margin-top:26px}.cue-afterword>p{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.cue-answer,.cue-object-glow,.cue-selector button{transition:none}}
/* Keep the choices beside the result while browsing the gallery. */
.cue-selector{position:sticky;top:80px;z-index:5;scroll-margin-top:96px}
.cue-selector button{min-height:56px}
.cue-demonstration{min-height:455px;padding-top:24px;padding-bottom:17px}
.cue-object{height:365px}
.cue-answer{opacity:.48}
@media(max-width:700px){.cue-selector{display:flex;overflow-x:auto;top:70px;scroll-margin-top:84px;scrollbar-width:thin;scrollbar-color:#b99b80 #29222e}.cue-selector button{flex:0 0 auto;min-width:157px;min-height:54px;white-space:nowrap}.cue-demonstration{padding-top:24px;min-height:0}.cue-object{height:270px}}
.cue-browser{scroll-margin-top:10px}
.cue-illustration-note{font-size:13px;color:#988596;line-height:1.5;margin:14px 0 0}
@media(max-width:700px){.cue-browser{scroll-margin-top:0}.cue-illustration-note{font-size:12px}}
