/* The home page's example review (Figma 260:2457 desktop, 260:2537 phone,
   frame 235:7361): a MergeSafe review as it looks on a GitHub pull request,
   in GitHub's dark palette. One card; the phone layout stacks the verdict and
   puts the finding's tags above its title. */
.ghm{display:flex;flex-direction:column;gap:12px;padding:16px;background:#0d1117;border:1px solid #3d444d;border-radius:14px;font:400 14px/22px var(--font-sans);color:rgba(240,246,252,.95)}
.ghm p{margin:0}
.ghm code{font:400 1em var(--font-mono)}
.gm-verdict{display:flex;align-items:center;justify-content:space-between;gap:10px}
.gm-v{display:flex;align-items:center;gap:8px;white-space:nowrap}
.gm-v b{font:600 15px/22px var(--font-sans);color:#f0f6fc}.gm-v span{font:400 13.5px/22px var(--font-sans);color:#9198a1}
.gm-score{display:flex;gap:6px;padding:3px 10px;border:1px solid #3d444d;border-radius:12px;font:400 12px/18px var(--font-sans);color:#9198a1;white-space:nowrap}
.gm-score b{font-weight:600;color:#d29922}
.gm-file{border:1px solid #3d444d;border-radius:8px;overflow:hidden}
.gm-fhead{padding:8px 14px;background:#151b23}
.gm-fhead code{font:400 12.5px/20px var(--font-mono);color:#f0f6fc}
.gm-diff{display:flex;background:rgba(46,160,67,.15)}
.gm-diff .gh-ln{flex:none;width:64px;padding:3px 12px;text-align:right;background:rgba(46,160,67,.22);font:400 12.5px/20px var(--font-mono);color:#f0f6fc}
.gm-diff code{display:flex;gap:14px;padding:3px 12px;white-space:pre;font:400 12.5px/20px var(--font-mono);color:#f0f6fc}
.gm-diff i{font-style:normal}.gm-diff .k{color:#ff7b72}.gm-diff .f{color:#d2a8ff}.gm-diff .v{color:#79c0ff}
.gm-conv{display:flex;flex-direction:column;gap:10px;padding:14px;border-top:1px solid #3d444d}
.gm-head{display:flex;align-items:center;gap:8px}
.gm-head .gh-av{display:grid;place-items:center;width:26px;height:26px;flex:none;border:.8px solid #3d444d;border-radius:6.5px;background:#10231b}
.gm-head .gh-av.gh-you{border-radius:13px;background:#f6f8fa}
.gm-head b{font:600 14px/20px var(--font-sans);color:#f0f6fc}
.gm-head u{font:400 13px/20px var(--font-sans);color:#9198a1;text-decoration:none}
.gh-pill{padding:1px 7px;border:1px solid #3d444d;border-radius:10px;font:400 11.5px/17px var(--font-sans);color:#9198a1}
.gh-sp{flex:1}
.gm-body,.gm-text{padding-left:34px}
.gm-body{display:flex;flex-direction:column;gap:8px}
.gm-ftitle{display:flex;align-items:center;gap:8px}
.gm-ftitle strong{flex:1;font:600 14.5px/22px var(--font-sans);color:#f0f6fc}
.gh-sev{display:flex;flex:none;border-radius:5px;overflow:hidden}
.gh-sev b{padding:2px 8px;font:600 12px/18px var(--font-sans)}
.gh-sev b:nth-child(1){background:#f0883e;color:#1c1206}.gh-sev b:nth-child(2){background:#2a313c;color:#9198a1}
.gm-ok{flex:none;padding:1px 7px;border:1px solid #3fb950;border-radius:10px;font:400 11.5px/17px var(--font-sans);color:#3fb950}
.gm-body p b{font-weight:600}
.gm-det{font:400 13.5px/20px var(--font-sans);color:#9198a1}
.gm-again{gap:4px}
.gm-status{display:flex;align-items:center;gap:7px;font-weight:600;color:#f0f6fc}.gm-status i{font-style:normal;color:#d29922}
/* the Figma's rgba(145,152,161,.7) is ~3.7:1 on the card; solid #9198a1 is ~6.4:1 (WCAG AA) */
.gh-note{font:400 10px/14px var(--font-mono);text-transform:uppercase;color:#9198a1}
@media (max-width:899px){
  .ghm{padding:12px}
  .gm-verdict{flex-direction:column;align-items:flex-start;gap:6px}
  .gm-fhead{padding:8px 12px}
  .gm-diff .gh-ln{width:36px;padding:3px 8px;font-size:11px}
  .gm-diff code{gap:8px;padding:3px 8px;font-size:11px}
  .gm-conv{padding:12px}
  .gm-body,.gm-text{padding-left:0}
  .gm-ftitle{flex-wrap:wrap}
  .gm-ftitle strong{order:3;flex-basis:100%}
}
