/* FreshRateHub PHP pages (report, alerts, opt-out, market, learn, ...). Tokens from site.css only. */

.app-h{font-size:1.05rem;margin:0 0 14px}
.app-note{
  font-family:Archivo,sans-serif;font-size:13.5px;line-height:1.55;color:var(--ink-soft);
  background:var(--sunk);border:1px solid var(--rule);border-radius:3px;padding:12px 15px;
  max-width:70ch;margin-bottom:22px;
}
.app-msg{border-left:3px solid var(--positive);background:var(--positive-soft);padding:14px 17px;border-radius:0 3px 3px 0}
.app-msg p{margin:0;color:var(--ink);max-width:var(--measure)}
.app-msg--err{border-left-color:var(--notice);background:var(--notice-soft)}

/* report chart: server-rendered SVG from fr_chart() */
.chart{color:var(--accent)}
.chart svg{display:block;width:100%;height:auto}
.chart__grid{stroke:var(--rule-firm);stroke-width:1}
.chart__line{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart__dot{fill:currentColor;stroke:var(--surface);stroke-width:2}
.chart__lab{fill:var(--ink-faint);font:12px Archivo,"Helvetica Neue",Arial,sans-serif}
.app-details{margin-top:14px}
.app-details summary{cursor:pointer;font-family:Archivo,sans-serif;font-size:14px;color:var(--accent)}
.app-details .tablescroll{margin-top:12px}
.chart__table{border-collapse:collapse;width:100%;background:var(--surface)}
.chart__table th,.chart__table td{
  font-family:Archivo,sans-serif;font-size:13.5px;text-align:right;padding:8px 13px;
  border-bottom:1px solid var(--rule);font-variant-numeric:tabular-nums;
}
.chart__table th{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-faint);font-weight:600;background:var(--sunk)}
.chart__table th:first-child,.chart__table td:first-child{text-align:left}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* change pills: sign is always in the text, colour is secondary */
.delta{
  display:inline-block;font-family:Archivo,sans-serif;font-size:12.5px;font-weight:600;
  font-variant-numeric:tabular-nums;padding:2px 8px;border-radius:99px;white-space:nowrap;
  background:var(--sunk);color:var(--ink-soft);
}
.delta--up{background:var(--positive-soft);color:var(--positive)}
.delta--down{background:var(--notice-soft);color:var(--notice)}

.panel .result__figure{color:var(--ink)}
.page-head .hero__kicker{margin-bottom:10px}

/* ported content pages */
.cols--4{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.prose ol{padding-left:1.3em}
.prose ol li + li{margin-top:.4em}
.app-box{background:var(--surface);border:1px solid var(--rule);border-radius:4px;padding:16px 20px}
.app-box p + p{margin-top:.8em}
.app-p{font-family:Archivo,"Helvetica Neue",Arial,sans-serif;font-size:14.5px;line-height:1.55;color:var(--ink-soft)}
.app-card{display:block;text-decoration:none;color:inherit;transition:border-color .2s}
.app-card:hover{border-color:var(--accent)}
.app-card .app-h{color:var(--accent);margin-bottom:8px}
.app-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:2em!important}
.page-head .frh-hero-scope{margin-top:14px}
.page-head .updated + form,.page-head form + .updated{margin-top:14px}