html{scroll-snap-type:y mandatory;scroll-behavior:smooth;scroll-padding:0}
.chapter{height:100dvh!important;min-height:0!important;scroll-snap-align:start;scroll-snap-stop:always;overflow-anchor:none}
.chapter>.scene{height:100dvh!important;min-height:0!important;position:relative!important}
#triassic .jurassic-scene[data-species="plateosaurus"] .jurassic-backdrop{object-position:center 18%}
.bird-comparison{height:310px!important;min-height:0!important;max-height:310px}
@media(max-width:760px){#triassic .jurassic-scene[data-species="plateosaurus"] .jurassic-backdrop{top:200px}#present .jurassic-backdrop{top:210px}.bird-comparison{height:230px!important}.species-chapter .story-body{overflow:auto;overscroll-behavior:contain}}
@media(max-width:760px) and (max-height:760px){
.masthead{height:66px}.jurassic-heading,:is(#triassic,#early-cretaceous,#cretaceous,#present) .jurassic-heading{top:76px!important}
.jurassic-heading h2,:is(#triassic,#early-cretaceous,#cretaceous,#present) .jurassic-heading h1,:is(#triassic,#early-cretaceous,#cretaceous,#present) .jurassic-heading h2{font-size:27px!important;line-height:1.05!important}
.jurassic-species,:is(#triassic,#early-cretaceous,#cretaceous,#present) .jurassic-species{top:151px!important;bottom:auto!important}
.jurassic-story,:is(#triassic,#early-cretaceous,#cretaceous,#present) .jurassic-story{bottom:190px!important}
.story-tabs,:is(#triassic,#early-cretaceous,#cretaceous,#present) .story-tabs{min-height:34px!important}.story-tabs button{padding:9px 5px!important;font-size:10px!important}
.story-body,:is(#triassic,#early-cretaceous,#cretaceous,#present) .story-body{padding:10px 14px!important;max-height:178px;overflow:auto;overscroll-behavior:contain}
.story-body h3,:is(#triassic,#early-cretaceous,#cretaceous,#present) .story-body h3{font-size:19px!important}.story-body>p:last-child,:is(#triassic,#early-cretaceous,#cretaceous,#present) .story-body>p:last-child{font-size:12px!important;line-height:1.5!important}
.species-nav,:is(#triassic,#early-cretaceous,#cretaceous,#present) .species-nav{bottom:135px!important}.chapter-continue,:is(#triassic,#early-cretaceous,#cretaceous,#present) .chapter-continue{bottom:104px!important}
.time-rail{bottom:81px!important}.branch-dock{height:70px!important}.branch-caption{display:none!important}
.jurassic-backdrop,:is(#triassic,#early-cretaceous,#cretaceous,#present) .jurassic-backdrop{top:180px!important}#cretaceous [data-species="ankylosaurus"] .jurassic-backdrop{top:100px!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.chapter.is-current :is(.jurassic-heading,.jurassic-story,.species-nav,.jurassic-species){animation:none}}

#present .jurassic-backdrop{object-position:center top}
@media(max-width:760px){#present .jurassic-species{left:6%;right:auto}}
/* Five stops retain the same full-screen rhythm and room for labels. */
@media(min-width:761px){.time-rail{top:26%;gap:34px}.time-rail a>div{max-width:108px}}
.scientific-name{margin-top:-15px!important;color:#d7c399;font-size:15px!important}
#early-cretaceous .jurassic-backdrop{object-position:center 25%}
@media(max-width:760px){.time-rail{gap:0}.time-rail a{flex:1;min-width:0}.time-rail a>div{font-size:8px;line-height:11px;text-align:center;letter-spacing:.15px;padding:0 2px;max-width:70px}.time-rail .rail-line{left:10%;right:10%}#early-cretaceous .jurassic-backdrop{top:230px}}

@media(max-width:760px) and (max-height:760px){#early-cretaceous .jurassic-backdrop{top:170px!important}#early-cretaceous [data-species="yutyrannus"] .jurassic-backdrop{top:210px!important}}
