/* mirrormeet -- brings the two older, self-styled pages (testing/ and pro/report/) in line with the new look.
   Loaded AFTER each page's own <style>, so these rules win. Same tokens as mm-styles.css. */

@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 200 800; font-display: swap; src: url('fonts/PlusJakartaSans-latin-var.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: italic; font-weight: 200 800; font-display: swap; src: url('fonts/PlusJakartaSans-latin-italic-var.woff2') format('woff2'); }

:root {
  --bg: #0b0b0c;
  --panel: #141416;
  --panel-light: #1b1b1e;
  --panel-border: #29292d;
  --text-primary: #f2f0ea;
  --text-muted: #aaa8a0;
  --green: #34d391;
  --yellow: #f2a65a;
  --red: #e5594f;
  --mm-gold: #d2b787;
  --mm-gold-line: rgba(210,183,135,0.34);
  --mm-font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mm-ease: cubic-bezier(.22,.61,.36,1);
}
html { scroll-behavior: smooth; }
body {
  background:
    radial-gradient(1200px 600px at 50% -120px, rgba(210,183,135,0.07), transparent 70%),
    radial-gradient(900px 500px at 90% 30%, rgba(52,211,145,0.04), transparent 70%),
    var(--bg) !important;
  background-attachment: fixed !important;
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
/* one typeface everywhere on these pages (their own rules asked for Inter / JetBrains Mono) */
body, body *:not(svg):not(svg *) { font-family: var(--mm-font) !important; }
svg text { font-family: var(--mm-font) !important; }
.eyebrow, .back-link, .mm-user-btn, .spec-name, .meta-label, .mm-footer, footer { letter-spacing: 0.14em; text-transform: uppercase; font-size: 11px; }
.back-link { color: var(--text-muted); transition: color .25s var(--mm-ease); }
.back-link:hover { color: var(--mm-gold); }
header { border-bottom-color: rgba(205,178,124,0.15) !important; }

h1 { font-weight: 500 !important; letter-spacing: -0.008em !important; }
h2, h3 { font-weight: 500; letter-spacing: -0.012em; }
.spec-name { color: var(--mm-gold) !important; }
.spec-item.soon .spec-name { color: var(--yellow) !important; }

/* cards + grids: softer corners, a gold hairline on hover */
.spec-grid, .meta-grid > *, .chart-card, .score-card, .card { border-radius: 14px; }
.spec-grid { border-color: rgba(205,178,124,0.16); }
.spec-item { transition: background .3s var(--mm-ease); }
.spec-item:hover { background: var(--panel-light); }

/* gentle entrance, matching the rest of the site */
.mm-reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--mm-ease), transform .9s var(--mm-ease); transition-delay: var(--d, 0s); }
.mm-reveal.in { opacity: 1; transform: none; }

@media (max-width: 600px) {
  .meta-grid { grid-template-columns: 1fr 1fr !important; }
  .charts-grid { grid-template-columns: 1fr !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .mm-reveal { opacity: 1; transform: none; transition: none; }
}