/* Composition derived from the supplied GT7 museum stills and 33.56 s reference video. */
:root{--museum-ease:cubic-bezier(.22,.7,.18,1)}
body{background:#020303}.museum{height:100svh;min-height:620px;overflow:hidden;background:#030404;isolation:isolate}.ambient{z-index:-2;background:#050606}.ambient img{position:absolute;inset:0;filter:grayscale(.52) blur(1.5px);opacity:1;transform:scale(1.06);object-position:center}.ambient #ambient-next{opacity:0}.ambient:after{background:radial-gradient(ellipse at 50% 44%,#05070699 0%,#010302d9 73%,#010202f7 100%),linear-gradient(#0008,transparent 25%,#0007 74%,#000b);z-index:2}.mast{position:absolute;inset:0 0 auto;height:0;padding:0;z-index:12}.brand{position:absolute;left:3.4vw;top:6.4svh;gap:8px;opacity:.9}.brand svg{width:32px}.brand>span{font-size:21px;letter-spacing:-.8px}.brand small{font-size:7px;letter-spacing:2px;margin-top:5px}.utilities{position:absolute;right:3.5vw;top:5.5svh;gap:16px}.utilities button{opacity:.65;transition:opacity .2s}.utilities button:hover{opacity:1}.utilities button:first-child{font-size:10px}.utilities button:first-child span{margin-left:6px}.utilities button:not(:first-child){font-size:20px;width:24px;height:30px}
.gallery{inset:0 0 26.5%;min-height:0;outline:none;touch-action:pan-y}.selected-heading{top:7.7%;left:25%;width:50%}.selected-heading time{font-size:clamp(30px,4.1vw,64px);line-height:1.1;letter-spacing:-.04em;font-family:var(--museum-font-sans);font-weight:400}.selected-heading h1{font-size:clamp(12px,1.23vw,19px);font-weight:400;letter-spacing:0;margin:2.2svh 0 0;line-height:1.65}.date-orbit{width:21vw;height:21vw;top:calc(-21vw + 14svh);border-color:#ffffff0d}.main-axis{position:absolute;left:0;right:0;top:57%;height:1px;background:repeating-linear-gradient(to right,#ffffff32 0 1px,transparent 1px 5px);opacity:.55}.main-rail{position:absolute;inset:0;pointer-events:none}.museum-card{position:absolute;left:calc(50% + var(--slot)*30vw);top:57%;width:var(--gallery-side-width);height:23.7svh;padding:0;transform:translate(-50%,-50%);pointer-events:auto;transition:left 720ms var(--museum-ease),width 720ms var(--museum-ease),height 720ms var(--museum-ease),opacity 600ms,filter 600ms;opacity:.64;z-index:2;will-change:left,width,height;touch-action:pan-y}.museum-card[data-distance="0"]{width:var(--gallery-selected-width);height:44.4svh;opacity:1;z-index:4}.museum-card[data-distance="2"]{left:calc(50% + var(--slot)*26.3vw);opacity:.4}.museum-card[data-distance="3"],.museum-card[data-distance="4"]{opacity:0;pointer-events:none}.museum-card>time{position:absolute;top:-4.5svh;left:-40%;right:-40%;font:clamp(12px,1.45vw,23px) var(--museum-font-sans);color:#e0ded6a3;text-align:center;white-space:nowrap;transition:opacity .4s}.museum-card[data-distance="0"]>time{opacity:0}.museum-card-media{display:flex;width:100%;height:100%;align-items:center;justify-content:center;position:relative}.museum-card img{width:100%;height:100%;object-fit:cover;filter:saturate(.73);transition:filter .5s}.museum-card[data-distance="0"] img{object-fit:contain;filter:saturate(.87)}.museum-card[data-distance="0"]:hover img,.museum-card[data-distance="0"]:focus-visible img{filter:saturate(1)}.museum-card[data-distance="1"]:hover{opacity:1}.card-open-hint{position:absolute;bottom:-29px;left:0;right:0;font-size:10px;letter-spacing:.09em;color:#d8d6cf;opacity:0;transform:translateY(-3px);transition:opacity .25s,transform .25s}.card-open-hint span{margin-left:13px}.museum-card[data-distance="0"]:hover .card-open-hint,.museum-card[data-distance="0"]:focus-visible .card-open-hint{opacity:.85;transform:none}.gallery-arrow{top:54%;font-size:30px;opacity:0;transition:opacity .25s;z-index:8;width:44px;height:64px}.gallery:hover .gallery-arrow,.gallery:focus-within .gallery-arrow{opacity:.55}.gallery-arrow:hover{opacity:1!important}.gallery-arrow.left{left:29%}.gallery-arrow.right{right:29%}.photo-credit{bottom:2%;right:3.7%;font-size:8px;opacity:.35;transition:opacity .2s}.photo-credit:hover{opacity:1}.era-circle{display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px solid #ffffff16;width:11vw;height:11vw;border-radius:50%;flex-shrink:0}.era-circle>span{font:clamp(20px,3.2vw,51px) var(--museum-font-sans);letter-spacing:-.04em}.era-circle small{font-size:12px;margin-top:6px}.is-era[data-distance="0"]{width:var(--gallery-era-width);height:var(--gallery-era-height)}.era-copy b{position:absolute;top:4%;font:clamp(38px,5vw,80px) var(--museum-font-sans);font-weight:400;opacity:.12;pointer-events:none}.era-copy>span{display:block;position:relative}
.timeline{bottom:3.1%;height:24.2%;z-index:9;--thumb:4.2vw;--active:6.25vw}.rail-heading{position:absolute;left:3.5%;right:3.5%;top:-3px;padding:0;font-size:8px;letter-spacing:.1em;opacity:0;transition:opacity .3s;pointer-events:none}.timeline:hover .rail-heading,.timeline:focus-within .rail-heading{opacity:.48}.world-date{position:absolute;left:30%;right:30%;top:0;text-align:center;font:clamp(19px,2.4vw,38px) var(--museum-font-sans);letter-spacing:-.02em;pointer-events:none;z-index:2}.filmstrip{position:absolute;left:0;right:0;top:19%;height:47%;align-items:flex-end;gap:2vw;padding:12px calc(50% - var(--active)/2) 7px;scroll-padding:0;scroll-snap-type:none;overflow-y:visible;mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent);touch-action:pan-x}.event-card{flex:0 0 var(--thumb);width:var(--thumb);height:var(--thumb);opacity:.65;position:relative;transform:none;transition:opacity 300ms,width 500ms var(--museum-ease),flex-basis 500ms var(--museum-ease),height 500ms var(--museum-ease);scroll-snap-align:none}.event-card>time{position:absolute;bottom:calc(100% + 10px);left:-120%;right:-120%;height:auto;font:clamp(11px,1.45vw,23px) var(--museum-font-sans);color:#d8d6d28c;pointer-events:none;white-space:nowrap}.event-card .thumb{height:100%;border:0}.event-card img{object-fit:cover;filter:saturate(.6);background:#17191b;transition:filter .25s}.event-card[aria-current=true]{transform:none;flex-basis:var(--active);width:var(--active);height:var(--active);opacity:1;z-index:3}.event-card[aria-current=true] time{opacity:0}.event-card:hover img,.event-card:focus-visible img{filter:saturate(1)}.selected-caption{position:absolute;left:10%;right:10%;top:74%;padding:0;text-align:center}.selected-caption button{padding:0;max-width:100%;font-size:clamp(11px,1.15vw,18px);line-height:1.6;letter-spacing:0}.selected-caption small{display:block;font-size:clamp(9px,.9vw,14px);color:#c4c2bd;margin-top:7px;opacity:.9}.world-arrow{position:absolute;bottom:12%;width:35px;height:45px;font:25px var(--museum-font-sans);opacity:0;transition:opacity .25s}.timeline:hover .world-arrow,.timeline:focus-within .world-arrow{opacity:.6}.world-left{left:4%}.world-right{right:4%}footer{bottom:9px;left:2.5%;right:2.5%;font-size:7px;letter-spacing:.02em;color:#8f918e55;align-items:center}footer button{padding:0;font-size:8px;color:#b8b9b666}footer button:hover{color:#fff}.key-hint{font-size:10px}
.exhibit-dialog{width:100vw;max-width:none;height:100svh;max-height:none;margin:0;border:0;background:#333;color:#f5f4ef;box-shadow:none;overflow:auto;isolation:isolate}.exhibit-dialog::backdrop{background:#000}.detail-ambient{position:fixed;inset:-30px;z-index:-2;pointer-events:none;background:#222}.detail-ambient img{width:100%;height:100%;object-fit:cover;filter:blur(18px) grayscale(.25);transform:scale(1.08);opacity:.55}.detail-ambient:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#393b3a50,#3e41417d),#10141326}.exhibit-dialog .dialog-close{position:fixed;right:3.5%;top:3%;padding:8px;font-size:25px;background:none;margin:0;opacity:.6}.exhibit-dialog .dialog-close:hover{opacity:1}.detail-layout{display:grid;grid-template-columns:53% 47%;align-items:center;min-height:100svh;padding:13svh 10.5vw 17svh;gap:3vw}.detail-visual{background:transparent;min-width:0;padding:0;display:flex;justify-content:center;align-items:center}.detail-image{max-height:60svh;max-width:100%;width:auto;object-fit:contain}.detail-body{padding:0;min-width:0}.detail-year-line{display:flex;align-items:baseline;justify-content:space-between;gap:15px;border-bottom:1px solid #eeedea66;padding-bottom:5px}.detail-year-line time{font:clamp(35px,5.5vw,88px)/1.1 var(--museum-font-sans);letter-spacing:-.055em;white-space:normal}.detail-year-line>span{font-size:12px;white-space:nowrap}.detail-body h2{font-size:clamp(18px,1.55vw,25px);line-height:1.6;margin:20px 0 17px;font-weight:400;letter-spacing:0}.detail-body>p{font-size:clamp(12px,1.12vw,17px);line-height:1.9;color:#eeece8;margin:0 0 16px}.detail-body .learning-note{font-size:11px;color:#f1efeaaf;border-left:1px solid #f1efea55;padding-left:12px;line-height:1.8;margin-top:20px}.detail-evidence,.detail-body .related-copy{font-size:10px;line-height:1.8;margin-top:20px;color:#e8e6dfb3}.detail-body details summary{cursor:pointer;list-style:revert}.detail-evidence .detail-caption{color:#e9e7e0aa!important;font-size:9px!important}.detail-body details p{font-size:11px;color:#deded8;line-height:1.9}.detail-body .related-copy{padding-top:13px;margin-top:18px;border-color:#ffffff30}.detail-body .sources{font-size:10px;gap:8px;margin-top:16px}.detail-transport{position:fixed;bottom:3.4%;left:0;right:0;display:flex;justify-content:center;gap:28px;font-size:12px;z-index:8}.detail-transport button{padding:8px 5px;opacity:.8;transition:opacity .2s}.detail-transport button:hover{opacity:1}.detail-transport button:disabled{opacity:.2}.index-dialog,.credits-dialog{background:#151717ed;backdrop-filter:blur(24px);border-color:#ffffff24;box-shadow:0 30px 150px #000a}.index-row{transition:padding-left .2s,background .2s}.index-row:hover{padding-left:8px}.index-tabs{gap:22px}.index-tabs button{font-size:11px}.selection-list{margin-top:20px}#credits-content>ol{padding-left:19px}#credits-content>ol li{padding-left:7px}
@media(min-aspect-ratio:2/1){.gallery-arrow.left{left:32%}.gallery-arrow.right{right:32%}.selected-heading time{font-size:6svh}.detail-layout{padding-top:10svh;padding-bottom:13svh}}
@media(max-width:900px){.brand>span{font-size:17px}.brand svg{width:26px}.brand small{font-size:6px}.utilities{gap:12px}.utilities button:first-child{font-size:9px}.selected-heading{left:20%;width:60%}.museum-card[data-distance="1"]{left:calc(50% + var(--slot)*35vw)}.gallery-arrow.left{left:22%}.gallery-arrow.right{right:22%}.timeline{--thumb:6.4vw;--active:8.5vw}.filmstrip{gap:2.8vw}.detail-layout{padding:12svh 6vw 15svh;grid-template-columns:52% 48%;gap:3vw}.detail-year-line time{font-size:6vw}.detail-year-line>span{font-size:10px}.detail-body h2{font-size:18px}.detail-body>p{font-size:12px}}
@media(max-width:600px){.museum{min-height:650px}.mast{height:0;padding:0;align-items:normal}.brand{top:26px;left:20px}.brand>span{font-size:17px}.brand svg{width:25px}.brand small{font-size:6px;letter-spacing:1px}.utilities{top:21px;right:18px;gap:10px;padding:0}.utilities button:not(:first-child){font-size:20px;height:30px;width:20px}.utilities button:first-child{font-size:9px}.gallery{top:0;bottom:28.5%;min-height:0}.selected-heading{top:22%;left:8%;width:84%}.selected-heading time{font-size:31px!important;line-height:1.15;white-space:normal;letter-spacing:-.035em}.selected-heading h1{font-size:12px;line-height:1.7;margin-top:12px}.date-orbit{width:210px;height:210px;top:-90px}.museum-card{top:65%;height:20svh;left:calc(50% + var(--slot)*62vw)}.museum-card[data-distance="0"]{height:35svh}.museum-card[data-distance="1"]{left:calc(50% + var(--slot)*62vw);opacity:.4}.museum-card[data-distance="2"]{left:calc(50% + var(--slot)*62vw)}.museum-card>time{font-size:12px;top:-31px;left:-50%;right:-50%}.main-axis{top:65%}.card-open-hint{font-size:9px;bottom:-25px}.museum-card[data-distance="0"] .card-open-hint{opacity:.6;transform:none}.gallery-arrow{top:58%;height:50px;font-size:27px;opacity:.65!important}.gallery-arrow.left{left:0}.gallery-arrow.right{right:0}.photo-credit{right:19px;bottom:0;font-size:7px}.timeline{bottom:4%;height:23.5%;--thumb:40px;--active:60px}.world-date{top:0;left:15%;right:15%;font-size:24px}.filmstrip{top:19%;height:51%;gap:19px;padding-top:20px;padding-bottom:8px}.event-card>time{font-size:12px;bottom:calc(100% + 9px);left:-100%;right:-100%}.selected-caption{top:77%;left:9%;right:9%}.selected-caption button{font-size:10px;line-height:1.6}.selected-caption small{font-size:9px;margin-top:4px}.rail-heading{display:none}.world-arrow{bottom:-2%;width:26px;height:42px;font-size:23px;opacity:.45}.world-left{left:8px}.world-right{right:8px}footer{bottom:8px;left:18px;right:18px;font-size:6px}footer>span:nth-child(1){display:none}footer>span:nth-child(2){display:block;font-size:6px}footer button{font-size:7px}.era-circle{width:23vw;height:23vw}.era-circle>span{font-size:25px}.era-circle small{font-size:9px}.era-copy b{font-size:40px;top:-8%}.exhibit-dialog .dialog-close{top:14px;right:16px}.detail-layout{display:flex;flex-direction:column;align-items:stretch;justify-content:center;min-height:100svh;padding:60px 26px 95px;gap:25px}.detail-visual{min-height:0;padding:0}.detail-image{max-height:35svh;max-width:100%;width:auto}.detail-body{padding:0}.detail-year-line time{font-size:43px}.detail-year-line>span{font-size:10px}.detail-body h2{font-size:18px;margin:16px 0 12px;line-height:1.6}.detail-body>p{font-size:12px;line-height:1.9}.detail-body .learning-note{font-size:10px;margin-top:16px}.detail-body details{font-size:9px;margin-top:17px}.detail-transport{bottom:0;background:linear-gradient(transparent,#333e 35%);padding:18px 0 15px;gap:28px;font-size:11px}.detail-transport button{padding:10px 8px}.detail-ambient img{filter:blur(14px) grayscale(.3)}.index-dialog,.credits-dialog{max-height:90svh}.index-tabs{gap:17px}.index-tabs button{font-size:10px}.index-row{grid-template-columns:95px 1fr 12px}.formation-shell .formation-heading{padding-top:0}}
@media(max-height:700px) and (min-width:601px){.museum{min-height:560px}.selected-heading h1{margin-top:12px}.museum-card[data-distance="0"]{height:43svh}.timeline{height:23%}.detail-body>p{font-size:12px}.detail-body h2{font-size:19px}.detail-body .learning-note{font-size:10px}.detail-body details{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.museum-card,.event-card{transition:none!important}.ambient img{transform:none}*{scroll-behavior:auto!important}}

/* Set the text width independently of the card as it moves and resizes. */
.gallery{
  --gallery-side-width:13.4vw;
  --gallery-selected-width:37.5vw;
  --gallery-era-width:40vw;
  --gallery-era-height:30svh;
  --gallery-era-font-size:14px;
  --gallery-era-line-height:2.1;
}
@media(min-aspect-ratio:2/1){.gallery{--gallery-selected-width:30vw}}
@media(max-width:900px){
  .gallery{--gallery-selected-width:43vw;--gallery-era-width:48vw;--gallery-era-font-size:12px}
}
@media(max-width:600px){
  .gallery{
    --gallery-side-width:24vw;
    --gallery-selected-width:76vw;
    --gallery-era-width:73vw;
    --gallery-era-height:27svh;
    --gallery-era-line-height:2;
  }
}
@media(max-height:700px) and (min-width:601px){.gallery{--gallery-era-height:43svh}}
.era-copy{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:var(--gallery-era-width);
  height:var(--gallery-era-height);
  font-size:var(--gallery-era-font-size);
  line-height:var(--gallery-era-line-height);
  text-align:left;
  overflow-wrap:anywhere;
}
.museum-card :is(.era-circle,.era-copy,.atlas-text-exhibit > span){
  pointer-events:none;
  opacity:0;
  visibility:hidden;
  transition:opacity 140ms ease-out,visibility 0s 140ms;
}
.museum-card[data-distance="0"] :is(.era-copy,.atlas-text-exhibit > span:last-child),
.museum-card:not([data-distance="0"]) :is(.era-circle,.atlas-text-exhibit > span:first-child){
  opacity:1;
  visibility:visible;
  transition:opacity 260ms var(--museum-ease) 220ms;
}
@media(prefers-reduced-motion:reduce){
  .museum-card :is(.era-circle,.era-copy,.atlas-text-exhibit > span){transition:none!important}
}

/* Keep thumbnail centers stable while the selected image grows. */
.filmstrip{padding-left:calc(50% - var(--thumb)/2);padding-right:calc(50% - var(--thumb)/2)}
.event-card[aria-current=true]{flex-basis:var(--thumb);width:var(--thumb);height:var(--thumb);transform:scale(1.46);transform-origin:50% 100%}
.exhibit-dialog[data-theme=light]{color:#1d1d1b;background:#c3c1bc}
.exhibit-dialog[data-theme=light] .detail-ambient{background:#c3c1bc}
.exhibit-dialog[data-theme=light] .detail-ambient img{opacity:.44}
.exhibit-dialog[data-theme=light] .detail-ambient:after{background:#d7d3cd66}
.exhibit-dialog[data-theme=light] .detail-year-line{border-color:#292b2855}
.exhibit-dialog[data-theme=light] .detail-body>p{color:#242521}
.exhibit-dialog[data-theme=light] .detail-body .learning-note{color:#32342cbb;border-color:#393d3266}
.exhibit-dialog[data-theme=light] .detail-evidence,.exhibit-dialog[data-theme=light] .related-copy,.exhibit-dialog[data-theme=light] .detail-body details p{color:#34362f}
.exhibit-dialog[data-theme=light] .detail-evidence .detail-caption{color:#34362faa!important}
.exhibit-dialog[data-theme=light] .detail-body .sources{color:#272b26}
.exhibit-dialog[data-theme=light] .detail-body .related-copy{border-color:#35372c44}
@media(max-width:600px){.exhibit-dialog[data-theme=light] .detail-transport{background:linear-gradient(transparent,#c3c1bcee 35%)}}

.selected-heading time,.world-date,.museum-card>time,.era-circle>span,.era-copy b,.detail-year-line time{font-family:var(--museum-font-sans)}
.selected-heading time.long-date{font-size:clamp(25px,3.2vw,50px)}
.event-card,.event-card[aria-current=true]{transition:opacity .3s,transform .5s var(--museum-ease)}
.detail-year-line .date-wide{font-size:clamp(27px,4vw,64px);letter-spacing:-.04em}
.detail-exact-date{font-size:10px;opacity:.65;display:block;margin-top:9px}
.event-card>time{font-family:var(--museum-font-sans)}
@media(max-width:600px){.detail-year-line .date-wide{font-size:31px}.selected-heading time.long-date{font-size:25px!important}}
/* The scroll viewport also contains the small year labels above the images. */
.filmstrip{top:0;height:66%;padding-top:35px}
@media(max-width:600px){.filmstrip{top:0;height:70%;padding-top:28px}}
/* Match the reference: the chosen history thumbnail grows around its center. */
.event-card[aria-current=true]{transform-origin:50% 50%}
.selected-heading time{font-size:clamp(30px,3.2vw,56px)}
/* Dense history: years are groups, not repeated labels on individual cards. */
.timeline{--thumb:4.1vw;--event-gap:1.65vw;--year-gap:2.1vw}
.filmstrip{gap:var(--year-gap);overflow-anchor:none}
.year-group{display:flex;flex:0 0 auto;align-items:center;gap:var(--event-gap);height:var(--thumb);position:relative}
.year-group-label{position:absolute;left:50%;bottom:calc(100% + 12px);transform:translateX(-50%);white-space:nowrap;font:clamp(12px,1.45vw,23px) var(--museum-font-sans);color:#d8d6d28c;transition:opacity .35s;pointer-events:none}
.year-group[data-active=true]>.year-group-label{opacity:.15}
.event-card{flex:0 0 var(--thumb);width:var(--thumb);height:var(--thumb)}

.museum-card{transition:left 720ms var(--museum-ease),width 720ms var(--museum-ease),height 720ms var(--museum-ease),opacity 600ms,filter 600ms,visibility 0s}
.museum-card[data-distance="3"],.museum-card[data-distance="4"]{visibility:hidden;transition:left 720ms var(--museum-ease),width 720ms var(--museum-ease),height 720ms var(--museum-ease),opacity 600ms,visibility 0s 720ms}
@media(max-width:900px){.timeline{--thumb:6.1vw;--event-gap:2.3vw;--year-gap:3vw}}
@media(max-width:600px){.timeline{--thumb:40px;--event-gap:15px;--year-gap:20px}.year-group-label{font-size:12px;bottom:calc(100% + 12px)}}
/* Borderless selection: scale and captions carry selection, never a white box. */
button:focus-visible,a:focus-visible,input:focus-visible{outline:none!important}
button:focus-visible,a:focus-visible{text-decoration:underline;text-decoration-color:#cfbfa4;text-underline-offset:6px}
input:focus-visible{border-bottom-color:#cfbfa4}
.museum-card,.museum-card img,.museum-card:hover img,.museum-card:focus-visible img{outline:none!important}
.event-card .thumb,.event-card[aria-current=true] .thumb,.event-card:focus-visible .thumb{outline:none!important;border:0;box-shadow:none}
.event-card:focus-visible:after{content:'';position:absolute;left:50%;bottom:-9px;width:4px;height:4px;border-radius:50%;background:#c7ad87;transform:translateX(-50%)}
/* The flying photograph belongs to the dialog top layer, above its scenery. */
.exhibit-dialog.is-shared{background:transparent}
.exhibit-dialog.is-shared::backdrop{background:transparent;backdrop-filter:none}
.shared-photograph{position:fixed;left:0;top:0;display:block;max-width:none;margin:0;object-fit:fill;transform-origin:0 0;z-index:20;pointer-events:none;box-shadow:none;will-change:transform,clip-path;backface-visibility:hidden}
.exhibit-dialog[data-shared-phase=opening] .detail-ambient,.exhibit-dialog[data-shared-phase=closing] .detail-ambient{will-change:opacity}
.exhibit-dialog[data-shared-phase=opening] .detail-body,.exhibit-dialog[data-shared-phase=closing] .detail-body{will-change:transform,opacity}
/* Focus must not scroll a clipped composition or the filmstrip vertically. */
.museum{overflow:clip}
.filmstrip{height:calc(66% + 9px);padding-bottom:16px}
.event-card:focus-visible:after{bottom:4px;width:3px;height:3px;box-shadow:0 0 3px #0009}
@media(max-width:600px){.filmstrip{height:calc(70% + 8px);padding-bottom:16px}}

/* Selection and focus use brightness only, without yellow lines or markers. */
button:focus-visible,a:focus-visible{text-decoration:none}
input:focus-visible{border-bottom-color:#ffffff50}
.event-card:focus-visible:after{display:none}
.detail-body .learning-note,.exhibit-dialog[data-theme=light] .detail-body .learning-note{border-left:0;padding-left:0}
.image-context,.formation-copy .process{border-left:0}
@media(max-width:600px){.exhibit-dialog[data-kind=event] .detail-image{max-height:39svh}}

/* Each photograph and its text keep their own palette while two exhibits overlap. */
.exhibit-dialog .detail-layout[data-theme=dark]{--detail-ink:#f5f4ef;--detail-copy:#eeece8;--detail-muted:#e8e6dfb3;--detail-caption:#e9e7e0aa;--detail-rule:#eeedea66;--detail-note:#f1efeaaf;color:var(--detail-ink)}
.exhibit-dialog .detail-layout[data-theme=light]{--detail-ink:#1d1d1b;--detail-copy:#242521;--detail-muted:#34362f;--detail-caption:#34362faa;--detail-rule:#292b2855;--detail-note:#32342cbb;color:var(--detail-ink)}
.exhibit-dialog .detail-layout[data-theme] .detail-year-line{border-color:var(--detail-rule)}
.exhibit-dialog .detail-layout[data-theme] .detail-body>p,.exhibit-dialog .detail-layout[data-theme] .detail-body details p{color:var(--detail-copy)}
.exhibit-dialog .detail-layout[data-theme] .detail-body .learning-note{color:var(--detail-note)}
.exhibit-dialog .detail-layout[data-theme] .detail-evidence,.exhibit-dialog .detail-layout[data-theme] .related-copy,.exhibit-dialog .detail-layout[data-theme] .sources{color:var(--detail-muted);border-color:var(--detail-rule)}
.exhibit-dialog .detail-layout[data-theme] .detail-caption{color:var(--detail-caption)!important}
.exhibit-dialog .detail-ambient[data-theme=dark]{background:#222}
.exhibit-dialog .detail-ambient[data-theme=dark] img{opacity:.55}
.exhibit-dialog .detail-ambient[data-theme=dark]:after{background:linear-gradient(90deg,#393b3a50,#3e41417d),#10141326}
.exhibit-dialog .detail-ambient[data-theme=light]{background:#c3c1bc}
.exhibit-dialog .detail-ambient[data-theme=light] img{opacity:.44}
.exhibit-dialog .detail-ambient[data-theme=light]:after{background:#d7d3cd66}
.detail-page-ambient{z-index:-1}
.detail-page-incoming{position:relative;z-index:1}
.exhibit-dialog[data-page-phase=animating] .detail-image,.exhibit-dialog[data-page-phase=animating] .detail-body,.exhibit-dialog[data-page-phase=animating] .detail-year-line,.detail-page-ambient{will-change:transform,opacity}
.exhibit-dialog .detail-transport,.exhibit-dialog .dialog-close{transition:color 560ms cubic-bezier(.22,.7,.18,1)}
.exhibit-dialog[data-page-close-pending] #detail-prev,.exhibit-dialog[data-page-close-pending] #detail-next{pointer-events:none;opacity:.25}
@media(prefers-reduced-motion:reduce){.exhibit-dialog .detail-transport,.exhibit-dialog .dialog-close{transition:none}}

/* Horizontal manipulation follows the pointer; native vertical scroll/pinch remain. */
#detail-content{touch-action:pan-y pinch-zoom}
.detail-visual,.detail-image{cursor:grab;-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
.exhibit-dialog[data-gesture-phase=dragging],.exhibit-dialog[data-gesture-phase=dragging] .detail-image{cursor:grabbing;user-select:none;-webkit-user-select:none}
.exhibit-dialog[data-gesture-phase] .detail-image,.exhibit-dialog[data-gesture-phase] .detail-body,.exhibit-dialog[data-gesture-phase] .detail-ambient{will-change:transform,opacity}
.detail-page-outgoing,.detail-page-incoming{touch-action:pan-y pinch-zoom}
.exhibit-dialog{overflow-x:hidden;overscroll-behavior-x:none}

/* One foreground photograph, even through rapid paging. Neutral scenery during motion
   prevents either the ambient image or the museum beneath the modal reading as a copy. */
.detail-page-photo{position:fixed;display:block;max-width:none;max-height:none;margin:0;object-fit:contain;z-index:3;pointer-events:none;will-change:transform,opacity}
.detail-photo-placeholder{display:block;visibility:hidden;pointer-events:none}
.exhibit-dialog[data-photo-motion] .detail-ambient img{visibility:hidden}
.exhibit-dialog[data-photo-motion] .detail-ambient:after{background:radial-gradient(ellipse at 30% 36%,#73797744,transparent 72%),linear-gradient(115deg,#242a2933,#10141344)}
.exhibit-dialog[data-photo-motion] .detail-ambient[data-theme=light]:after{background:radial-gradient(ellipse at 30% 36%,#e3e0d455,transparent 72%),linear-gradient(115deg,#ddd9d333,#a3aaa333)}
.exhibit-dialog .detail-page-photo{max-width:none!important;max-height:none!important}
.detail-ambient img{transition:opacity 320ms cubic-bezier(.22,.7,.18,1)}
.exhibit-dialog[data-photo-motion] .detail-ambient img{opacity:0!important}
@media(prefers-reduced-motion:reduce){.detail-ambient img{transition:none}}

/* Keep the first and last exhibits visibly at the end of their timeline. */
.gallery-arrow:disabled,.world-arrow:disabled{opacity:.2!important}

/* Keep history navigation reachable when the exhibit is taller than the viewport. */
@media(max-width:600px) and (max-height:649px){
  .world-arrow{top:12%;bottom:auto}
}
@media(min-width:601px) and (max-height:559px){
  .museum{min-height:0}
  .timeline{height:32%}
}
@media(hover:none) and (min-width:601px){
  .world-arrow{opacity:.6}
}
