/* AgAu.ai RC17.8 final-polish layer.
   Content and presentation only: no engine, API or data schema changes. */

.rc178-explainer{
  margin-top:clamp(28px,4vw,48px);
  padding:clamp(22px,3vw,34px);
  border:1px solid rgba(255,255,255,.09);
  border-radius:24px;
  background:
    radial-gradient(circle at 100% 0,rgba(225,171,60,.08),transparent 36%),
    linear-gradient(150deg,rgba(19,24,29,.96),rgba(8,11,14,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 18px 44px rgba(0,0,0,.18);
}
.rc178-explainer__head{max-width:860px;margin-bottom:22px}
.rc178-explainer__eyebrow{
  display:block;margin:0 0 9px;color:#d9aa4b;
  font:750 11px/1.2 Montserrat,Arial,sans-serif;
  letter-spacing:.12em;text-transform:uppercase;
}
.rc178-explainer h2{
  margin:0 0 10px;color:#f7f3ea;
  font:750 clamp(24px,3vw,36px)/1.12 Montserrat,Arial,sans-serif;
  letter-spacing:-.025em;
}
.rc178-explainer__head>p,.rc178-explainer>p{
  margin:0;color:#aeb9c5;font:400 15px/1.7 "Open Sans",Arial,sans-serif;
}
.rc178-explainer-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;
}
.rc178-explainer-card{
  min-width:0;padding:18px;border:1px solid rgba(255,255,255,.075);
  border-radius:17px;background:rgba(255,255,255,.027);
}
.rc178-explainer-card[data-tone="positive"]{border-color:rgba(57,199,126,.25);background:rgba(57,199,126,.055)}
.rc178-explainer-card[data-tone="amber"]{border-color:rgba(230,176,64,.26);background:rgba(230,176,64,.055)}
.rc178-explainer-card[data-tone="negative"]{border-color:rgba(225,82,82,.24);background:rgba(225,82,82,.05)}
.rc178-explainer-card[data-tone="blue"]{border-color:rgba(92,157,225,.24);background:rgba(92,157,225,.05)}
.rc178-explainer-card span{
  display:block;margin-bottom:8px;color:#8290a0;
  font:700 10px/1.2 Montserrat,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;
}
.rc178-explainer-card h3{
  margin:0 0 8px;color:#f4f0e7;font:700 17px/1.3 Montserrat,Arial,sans-serif;
}
.rc178-explainer-card p{
  margin:0;color:#aab5c1;font:400 14px/1.62 "Open Sans",Arial,sans-serif;
}
.rc178-explainer-card strong{color:#f5cf72}
.rc178-reading-guide{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);gap:18px;
  margin-top:16px;padding:18px;border:1px solid rgba(224,175,70,.18);
  border-radius:18px;background:rgba(224,175,70,.04);
}
.rc178-reading-guide h3{margin:0 0 8px;color:#f5cf72;font:700 18px/1.3 Montserrat,Arial,sans-serif}
.rc178-reading-guide p{margin:0;color:#aeb9c5;font:400 14px/1.65 "Open Sans",Arial,sans-serif}
.rc178-reading-guide ul{margin:0;padding-left:20px;color:#c7d0da;font:400 14px/1.65 "Open Sans",Arial,sans-serif}
.rc178-reading-guide li+li{margin-top:5px}
.rc178-inline-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.rc178-inline-links a{
  display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:11px;
  border:1px solid rgba(224,175,70,.26);color:#efcb73;background:rgba(224,175,70,.055);
  font:700 12px/1 Montserrat,Arial,sans-serif;text-decoration:none;
}
.rc178-inline-links a:hover,.rc178-inline-links a:focus-visible{border-color:rgba(239,203,115,.65);background:rgba(224,175,70,.1)}

/* Improve useful fallback copy while the live JSON is loading. */
.live-panel .empty-state{color:#93a0ad!important;line-height:1.55!important}

/* Make the homepage's spot-vs-market status explicit but restrained. */
.portal-market-card[data-quote-source="spot"] .portal-market-card__head b::before{
  content:"LIVE SPOT · ";color:#42ce8b;font-size:.82em;
}
.portal-market-card[data-quote-source="last-good"] .portal-market-card__head b::before{
  content:"LAST GOOD · ";color:#e2ad49;font-size:.82em;
}
.portal-market-card[data-quote-source="market"] .portal-market-card__head b::before{
  content:"MARKET · ";color:#6fa8e8;font-size:.82em;
}

@media(max-width:900px){
  .rc178-explainer-grid{grid-template-columns:1fr 1fr}
  .rc178-reading-guide{grid-template-columns:1fr}
}
@media(max-width:620px){
  .rc178-explainer{padding:19px;border-radius:19px}
  .rc178-explainer-grid{grid-template-columns:1fr;gap:10px}
  .rc178-explainer-card{padding:16px}
  .rc178-explainer__head>p,.rc178-explainer>p{font-size:14px;line-height:1.65}
  .rc178-inline-links{display:grid;grid-template-columns:1fr}
  .rc178-inline-links a{justify-content:center}
}