/* Latest owner-selected ending, integrated with the current homepage tokens.
   Copy and media are imported from scroll-over/selected.html without rewriting. */
#selected-ending#selected-ending#selected-ending#selected-ending{background:#071515;--ending-dark:#071515}
#selected-ending#selected-ending#selected-ending#selected-ending .ending-shell{position:relative;background:var(--ending-dark)}
#selected-ending#selected-ending#selected-ending#selected-ending #close{background:var(--ending-dark);border-radius:0;min-height:min(72svh,630px)}
#selected-ending#selected-ending#selected-ending#selected-ending #close .close-inner{padding-bottom:36px}
#selected-ending#selected-ending#selected-ending#selected-ending #site-footer{background:var(--ending-dark);padding-top:30px;margin-top:-1px}
#selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-title{font-size:var(--oh-head)}
#selected-ending#selected-ending#selected-ending#selected-ending #site-footer [data-send]:disabled{opacity:.45;cursor:default}
#selected-ending#selected-ending#selected-ending#selected-ending #close .close-toggle{width:44px;height:44px}
@media(min-width:760px){#selected-ending#selected-ending#selected-ending#selected-ending #close{min-height:620px}#selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-title{font-size:var(--oh-head)}}
@media(min-width:760px) and (max-width:1099px){
 #selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-grid{grid-template-columns:1fr}
 #selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-actions{display:flex;flex-wrap:wrap}
 #selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-rows{margin-top:28px}
 #selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-base{grid-template-columns:1fr;gap:14px;margin-top:36px}
 #selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-sign{grid-column:1;grid-row:1}
 #selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-base nav{grid-column:1;grid-row:2;justify-self:start;flex-wrap:wrap}
 #selected-ending#selected-ending#selected-ending#selected-ending #site-footer .b-copyright{grid-column:1;grid-row:3;justify-self:start;text-align:left}
}

/* A's layout and copy remain the reference. Motion is enabled only when requested by the device. */
#selected-ending#selected-ending#selected-ending#selected-ending{--ending-dark:#071515}
#selected-ending#selected-ending#selected-ending#selected-ending .ending-shell,#selected-ending#selected-ending#selected-ending#selected-ending #close,#selected-ending#selected-ending#selected-ending#selected-ending #site-footer{background-color:var(--ending-dark)}
#selected-ending#selected-ending#selected-ending#selected-ending .scroll-scene{position:relative;overflow:visible}
#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over .scroll-scene{height:calc(var(--scene-height) + var(--hold-distance));}
#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over #close{position:sticky;top:0;min-height:var(--scene-height);height:var(--scene-height);z-index:0}
#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over #close .close-inner{transform:translateY(calc(-1 * var(--copy-travel,0px)))}
#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over #site-footer{position:relative;margin-top:calc(-1 * var(--hold-distance) - 1px);background:var(--ending-dark)}
@media(prefers-reduced-motion:reduce){#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over #close{position:relative;top:auto}#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over .scroll-scene{height:auto}#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over #close .close-inner{transform:none}#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over #site-footer{margin-top:-1px}}
/* A longer, eased dissolve into near-black with the original teal undertone.
   Its low edge follows the words during the short hold, so the footer stays seamless. */
#selected-ending#selected-ending#selected-ending#selected-ending #close::before{
 --fade-travel:0px;
 background:linear-gradient(to bottom,
  rgba(7,21,21,0) 0%,
  rgba(7,21,21,.05) calc(30% - var(--fade-travel)),
  rgba(7,21,21,.18) calc(46% - var(--fade-travel)),
  rgba(7,21,21,.40) calc(61% - var(--fade-travel)),
  rgba(7,21,21,.66) calc(73% - var(--fade-travel)),
  rgba(7,21,21,.88) calc(84% - var(--fade-travel)),
  rgba(7,21,21,.98) calc(92% - var(--fade-travel)),
  var(--ending-dark) calc(98% - var(--fade-travel)),
  var(--ending-dark) 100%);
}
#selected-ending#selected-ending#selected-ending#selected-ending.has-scroll-over #close::before{--fade-travel:var(--scroll-travel,0px)}

/* A small spacing test only. Total ending height and motion remain the same. */
#selected-ending#selected-ending#selected-ending#selected-ending #site-footer{padding-top:14px;padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}
@media(min-width:760px){#selected-ending#selected-ending#selected-ending#selected-ending #site-footer{padding-top:16px;padding-bottom:44px}}

/* Keep the lime CTA over visible canopy, with room for the final dissolve beneath it. */
#selected-ending#selected-ending#selected-ending#selected-ending #close .close-inner{padding-bottom:68px}
#selected-ending#selected-ending#selected-ending#selected-ending #close::before{
 background:linear-gradient(to bottom,
  rgba(7,21,21,0) 0%,
  rgba(7,21,21,.05) calc(30% - var(--fade-travel)),
  rgba(7,21,21,.18) calc(46% - var(--fade-travel)),
  rgba(7,21,21,.40) calc(61% - var(--fade-travel)),
  rgba(7,21,21,.52) calc(73% - var(--fade-travel)),
  rgba(7,21,21,.64) calc(84% - var(--fade-travel)),
  rgba(7,21,21,.78) calc(92% - var(--fade-travel)),
  rgba(7,21,21,.94) calc(97% - var(--fade-travel)),
  var(--ending-dark) calc(99.5% - var(--fade-travel)),
  var(--ending-dark) 100%);
}
@media(min-width:760px){#selected-ending#selected-ending#selected-ending#selected-ending #close .close-inner{padding-bottom:76px}}