/* VMSP Toolkit 2.0 post styles.
   Scoped entirely to .vmsp-post, so nothing leaks into the rest of the site.
   Loaded by the vmsp-post-style mu-plugin.

   This version styles NATIVE GUTENBERG OUTPUT (wp:paragraph, wp:heading,
   wp:image, wp:list, wp:code) rather than a hand-built section/wrap structure,
   so the prose stays editable in the WordPress editor.

   Measure is set once, on .vmsp-post itself. Every block inherits it, so a
   child can no longer end up wider than its neighbours. */

.vmsp-post{
  --ink:#0b1020; --panel:#111731; --panel2:#151d3a; --line:#1f2a4a;
  --text:#e8ecf8; --mut:#8e9ab8; --accent:#3b82f6; --accent-dim:#1d4ed8;
  --evaluated:#6fd3a2; --unknown:#ded494;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;

  max-width:820px;
  margin-left:auto; margin-right:auto;
  color:var(--text);
  font-size:17px;
  line-height:1.7;
}
.vmsp-post *{box-sizing:border-box}

/* ---------------------------------------------------------------- prose --- */
.vmsp-post h2{
  font-family:var(--mono) !important;
  font-size:1.32rem !important;
  font-weight:700 !important;
  letter-spacing:-.02em;
  color:var(--text) !important;
  margin:56px 0 16px !important;
}
.vmsp-post p{
  margin:0 0 18px !important;
  line-height:1.7 !important;
  color:var(--text);
}
.vmsp-post a{
  color:var(--accent) !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(59,130,246,.35);
}
.vmsp-post a:hover{border-bottom-color:var(--accent)}
.vmsp-post strong,.vmsp-post b{font-weight:600}

.vmsp-post code{
  font-family:var(--mono);
  font-size:.88em;
  color:var(--unknown);
  background:var(--panel) !important;
  padding:2px 6px;
  border-radius:4px;
}
.vmsp-post pre.wp-block-code{
  background:var(--ink) !important;
  border:1px solid var(--line) !important;
  border-radius:8px !important;
  padding:13px 16px !important;
  margin:0 0 18px !important;
  overflow-x:auto;
}
.vmsp-post pre.wp-block-code code{
  background:none !important;
  padding:0 !important;
  color:var(--mut);
  font-size:.8rem;
}

.vmsp-post ul{
  list-style:none !important;
  padding-left:0 !important;
  margin:0 0 18px !important;
}
.vmsp-post ul li{
  list-style:none !important;
  position:relative;
  padding-left:22px !important;
  margin-bottom:11px;
}
.vmsp-post ul li::before{
  content:"\2014";
  position:absolute; left:0; top:0;
  font-family:var(--mono);
  color:var(--accent-dim);
}

.vmsp-post hr.wp-block-separator{
  border:0 !important;
  border-top:1px solid var(--line) !important;
  margin:44px 0 24px !important;
  opacity:1 !important;
}

/* ------------------------------------------------------- custom pieces --- */
.vmsp-post p.pull{
  margin:34px 0 !important;
  padding:18px 22px;
  border-left:2px solid var(--accent);
  background:var(--panel);
  border-radius:0 8px 8px 0;
  font-size:1.04rem;
}
.vmsp-post p.disclaimer{
  font-size:.86rem !important;
  color:var(--mut) !important;
  line-height:1.6 !important;
}

.vmsp-post figure.wp-block-image{margin:30px 0 !important}
.vmsp-post figure.wp-block-image img{
  display:block; width:100%; height:auto;
  border:1px solid var(--line) !important;
  border-radius:10px !important;
  background:var(--panel);
  box-shadow:none !important;
  padding:0 !important;
}
.vmsp-post figure.wp-block-image figcaption{
  font-family:var(--mono);
  font-size:11.5px !important;
  line-height:1.6 !important;
  color:var(--mut) !important;
  margin-top:11px !important;
  text-align:left !important;
}

/* -------------------------------------------------------------- ledger --- */
.vmsp-post .ledger{
  margin:0 0 8px;
  padding:26px 26px 22px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:12px;
}
.vmsp-post .ledger-head{
  font-family:var(--mono);
  font-size:12px !important;
  color:var(--mut) !important;
  margin:0 0 18px !important;
}
.vmsp-post .bar{
  display:flex; height:14px; border-radius:3px;
  overflow:hidden; background:var(--panel2);
}
.vmsp-post .bar span{display:block; height:100%}
.vmsp-post .legend{display:flex; flex-wrap:wrap; gap:26px; margin:18px 0 0}
.vmsp-post .leg{display:flex; gap:11px; align-items:baseline}
.vmsp-post .dot{
  width:9px; height:9px; border-radius:2px;
  flex:0 0 auto; margin-top:9px;
}
.vmsp-post .num{
  font-family:var(--mono);
  font-size:1.85rem; font-weight:700;
  line-height:1; letter-spacing:-.02em;
}
.vmsp-post .lab{
  font-family:var(--mono);
  font-size:11.5px; color:var(--mut);
  display:block; margin-top:7px;
}
.vmsp-post .ledger-note{
  margin:22px 0 0 !important;
  padding-top:18px;
  border-top:1px solid var(--line);
  font-size:.95rem !important;
  color:var(--mut) !important;
}
.vmsp-post .ledger-note b{color:var(--text); font-weight:600}

.vmsp-post .ledger + h2{margin-top:36px !important}

@media (max-width:560px){
  .vmsp-post{font-size:16px}
  .vmsp-post .ledger{padding:20px}
  .vmsp-post .legend{gap:18px}
  .vmsp-post .num{font-size:1.5rem}
  .vmsp-post h2{margin-top:40px !important}
}