/* BloodMarker blog premium layer — Figma BLOGPOST design (Jul 22)
   Additive restyle ONLY. Loads after override.css; wins by cascade order.
   No HTML/content changes. Tokens from Figma export src/App.tsx. */

/* ---- base ---- */
body{background:#FBFAF6!important}
article{max-width:680px}
article p,.deep-risk,.deep-cause,.deep-action{
  font-family:Inter,system-ui,-apple-system,sans-serif!important;
  font-size:15px!important;color:#334155!important;line-height:1.75!important}
article p strong,article p b{color:#14211E}
article a:not(.chk-upload):not(.cta-btn){color:#15803d}

/* ---- headings ---- */
h1{font-family:Fraunces,Georgia,serif!important;font-size:38px!important;font-weight:800!important;
  color:#14211E!important;line-height:1.2!important;margin:0 0 18px!important}
article h2{font-family:Fraunces,Georgia,serif!important;font-size:22px!important;font-weight:700!important;
  color:#14211E!important;line-height:1.25!important;margin:40px 0 14px!important}
article h3{font-family:Fraunces,Georgia,serif!important;color:#14211E!important;font-weight:700!important}

/* ---- sticky header ---- */
nav{position:sticky!important;top:0!important;z-index:50!important;
  background:rgba(251,250,246,.95)!important;backdrop-filter:blur(8px)!important;
  border-bottom:1px solid rgba(0,0,0,.07)!important}
nav .cta-btn{background:#15803d!important;color:#fff!important;border-radius:8px!important;
  font-size:13px!important;font-weight:700!important;letter-spacing:.01em!important;
  box-shadow:0 2px 10px rgba(21,128,61,.28)!important;transition:background .18s ease}
nav .cta-btn:hover{background:#16a34a!important}

/* ---- breadcrumb ---- */
.breadcrumb{font-size:12px!important;color:#94a3b8!important;font-family:Inter,system-ui,sans-serif!important}
.breadcrumb a{color:#15803d!important;text-decoration:underline;
  text-decoration-color:rgba(21,128,61,.35);text-underline-offset:3px}

/* ---- bottom line (tldr): red alarm box -> calm white card w/ green accent ---- */
.tldr{background:#fff!important;border-left:3px solid #15803d!important;border-radius:0 12px 12px 0!important;
  box-shadow:0 1px 6px rgba(0,0,0,.04);padding:13px 16px!important;
  font-size:14.5px!important;color:#14211E!important;line-height:1.65!important}

/* ---- result card ---- */
.status-block{background:#fff!important;border:1px solid rgba(0,0,0,.07)!important;border-radius:16px!important;
  padding:20px 20px 18px!important;box-shadow:0 2px 12px rgba(0,0,0,.05)!important;color:#334155!important;
  transition:box-shadow .2s ease,transform .2s ease}
.status-block:hover{box-shadow:0 8px 32px rgba(21,128,61,.12)!important;transform:translateY(-1px)}
.status-block .status-label{font-size:9.5px!important;font-weight:700!important;letter-spacing:.13em!important;
  text-transform:uppercase;color:#94a3b8!important;margin-bottom:10px}
.status-block a{text-decoration:none!important}
.status-block .status-value{font-family:Fraunces,Georgia,serif!important;font-size:48px!important;
  font-weight:800!important;color:#14211E!important;line-height:1.05!important}
.status-block .status-verdict{display:inline-block;font-size:13px!important;font-weight:700!important;
  padding:4px 12px!important;border-radius:20px!important;margin-top:6px;
  background:color-mix(in srgb,currentColor 10%,#fff)!important}
.status-block .status-hook{color:#15803d!important;opacity:1!important;font-size:12.5px!important;
  font-weight:500!important;border-top:1px solid #f0ede8;padding-top:12px;margin-top:12px!important;
  font-family:Inter,system-ui,sans-serif!important}
.status-block .result-tap-hint{color:#15803d!important;font-size:13px!important;font-weight:700!important;
  font-family:Inter,system-ui,sans-serif!important}

/* ---- "your number, checked" card + gauge ---- */
.chk{background:#fff!important;border:1px solid rgba(0,0,0,.07)!important;border-radius:16px!important;
  box-shadow:0 2px 12px rgba(0,0,0,.05)!important}
.chk-k{color:#94a3b8!important;font-size:9.5px!important;font-weight:700!important;
  letter-spacing:.13em!important;text-transform:uppercase}
.chk-gauge{height:10px!important;border-radius:6px!important;
  background:linear-gradient(90deg,#15803d 0 40%,#84cc16 40% 55%,#f59e0b 55% 70%,#f97316 70% 85%,#ef4444 85% 100%)!important;
  opacity:.75}
.chk-ptr{width:18px!important;height:18px!important;border-radius:50%!important;
  background:#ef4444!important;border:3px solid #fff!important;
  box-shadow:0 0 0 2px #ef4444,0 2px 8px rgba(0,0,0,.2)!important}
.chk-lab span{font-size:9px!important;color:#94a3b8!important}
.chk-upload{background:#15803d!important;border-radius:12px!important;
  box-shadow:0 4px 20px rgba(21,128,61,.3)!important;transition:all .18s cubic-bezier(.4,0,.2,1)}
.chk-upload:hover{background:#16a34a!important;box-shadow:0 6px 28px rgba(21,128,61,.42)!important;
  transform:translateY(-1px)}
.chk-trust{color:#64748b!important;font-size:11.5px!important}

/* ---- reference table ---- */
.range-table{border:1px solid #f0ede8!important;border-radius:12px!important;overflow:hidden!important;
  font-family:Inter,system-ui,sans-serif!important}
.range-table th{background:#f8f9f7!important;font-size:9.5px!important;font-weight:700!important;
  letter-spacing:.1em!important;text-transform:uppercase!important;color:#64748b!important;
  padding:8px 14px!important;border-bottom:1px solid #f0ede8!important}
.range-table td{font-size:13px!important;color:#334155!important;padding:10px 14px!important;
  border-bottom:1px solid #f6f4f1!important}
.range-table .current-row{background:#fffbf5!important}
.range-table .current-row td{font-weight:700!important;color:#14211E!important}

/* ---- key-fact emphasis paragraphs ---- */
.ctx-hook{border-left:3px solid #15803d!important;background:#f0fdf4!important;
  border-radius:0 10px 10px 0!important;padding:12px 16px!important;
  font-size:14px!important;color:#14211E!important;font-weight:500!important;line-height:1.65!important}

/* ---- CTA cards (midhook / videos-cta / inline-analyzer) ---- */
.midhook{border:1px solid rgba(21,128,61,.15)!important;border-radius:14px!important;
  background:linear-gradient(135deg,#f0fdf4,#f7fef9)!important;box-shadow:none!important}
.videos-cta{border:1px solid rgba(21,128,61,.12)!important;border-radius:16px!important;
  background:#fff!important;box-shadow:0 2px 16px rgba(21,128,61,.07)!important}
.inline-analyzer{border:1px solid rgba(21,128,61,.12)!important;border-radius:16px!important;
  background:#fff!important;box-shadow:0 2px 16px rgba(21,128,61,.07)!important}
.videos-cta a,.inline-analyzer a.cta-btn{background:#15803d!important;color:#fff!important;
  border-radius:12px!important;font-weight:700!important;
  box-shadow:0 4px 20px rgba(21,128,61,.3)!important;transition:all .18s ease}
.videos-cta a:hover,.inline-analyzer a.cta-btn:hover{background:#16a34a!important;transform:translateY(-1px)}

/* ---- related value chips ---- */
.related-links a,.cross-marker-links .related-links a{font-size:13px!important;color:#15803d!important;
  background:#f0fdf4!important;border:1px solid rgba(21,128,61,.15)!important;border-radius:20px!important;
  padding:6px 14px!important;text-decoration:none!important;font-weight:500!important;
  transition:all .15s ease;box-shadow:none!important}
.related-links a:hover{background:#dcfce7!important}

/* ---- sources / citations / footer ---- */
.citations,.meta-sources{font-size:12px!important;color:#64748b!important;line-height:1.65!important;
  border-top:1px solid #f0ede8;padding-top:20px}
.citations a,.meta-sources a{color:#64748b!important;text-decoration:underline;
  text-decoration-color:rgba(100,116,139,.3)}
.footer{border-top:1px solid #f0ede8!important;color:#94a3b8!important;font-size:11.5px!important;
  background:transparent!important}

/* ---- sticky mobile bar ---- */
#stickyBar{background:rgba(255,255,255,.97)!important;border-top:1px solid rgba(0,0,0,.07)!important;
  box-shadow:0 -4px 16px rgba(0,0,0,.06)!important;backdrop-filter:blur(8px)}
#stickyBar a{background:#15803d!important;color:#fff!important;border-radius:10px!important;
  font-weight:700!important;box-shadow:0 3px 14px rgba(21,128,61,.3)!important}

/* ---- mobile ---- */
@media (max-width:600px){
  h1{font-size:30px!important}
  .status-block .status-value{font-size:40px!important}
  article h2{font-size:20px!important}
}