Tweak loading component and rare goods text

css/components/loader.css

@@ -42,7 +42,7 @@
   z-index: 3000;
   pointer-events: none;
   text-align: center;
-  text-shadow: 0 0 .5rem #000;
+  text-shadow: 0 0 .5rem #000, 0 0 1rem #000;
   font-family: 'Jura';
   font-synthesis: weight;
   font-weight: bold;
@@ -61,7 +61,7 @@
   backdrop-filter: blur(.05rem);
   box-shadow: inset 0 0 10rem rgba(0,0,0,.5);
   border-radius: .2rem;
-  transition: .25s ease-in-out;
+  transition: .5s ease-in-out;
   pointer-events: none;
 }
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ardent-www",
-  "version": "0.45.4",
+  "version": "0.45.5",
   "description": "Ardent Industry",
   "main": "index.js",
   "scripts": {

pages/commodity/[commodity-name]/index.js

@@ -216,13 +216,9 @@ export default () => {
             Galactic prices and total supply/demand updated daily
           </p> */} 
           {commodity.rare && <>
-            <p style={{textAlign: 'center'}}>
-              <i className='icon icarus-terminal-info' />
-              Rare commodities can only be purchased at exclusive markets and in very limited quantities, but they can be sold almost anywhere.
-            </p>
-            <p style={{textAlign: 'center', marginBottom: '2rem'}}>
-              Their value rises the further they are traded, 
-              peaking in value when sold at locations 200 ly from the exporter.
+            <p style={{textAlign: 'center', position: 'relative', top: '-.5rem'}}>
+              <i className='icon icarus-terminal-info' style={{marginRight: '.25rem'}}/>
+              Rare goods are only available in limited quantities from exclusive locations but can be sold almost anywhere.
             </p>
           </>}
           {imports &&