/* HourlyVPS blog content (owner: blog-components). Loaded by hvps-core/shortcodes.php on single posts and on pages
   whose content uses a blog shortcode or a .hvps-callout group. Styles core blocks inside .prose and the shortcode
   components (.hvps-price/-cost/-cost-table/-plan-card/-deploy/-deploy-box). Theme tokens only; yellow is a fill with an ink edge. */
:root{--code-bg:#0F1215;--code-ink:#E9ECEF;--code-bar:#1E2328;--code-mut:#A9B2BA;--code-edge:#0F1215;--shade:rgba(15,18,21,.16);--shade-x:rgba(15,18,21,.3)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--code-bg:#16191C;--code-ink:#ECEFF1;--code-bar:#1F2428;--code-mut:#A3ADB7;--code-edge:#2A3036;--shade:rgba(236,239,241,.16);--shade-x:rgba(236,239,241,.3)}}
:root[data-theme=dark]{--code-bg:#16191C;--code-ink:#ECEFF1;--code-bar:#1F2428;--code-mut:#A3ADB7;--code-edge:#2A3036;--shade:rgba(236,239,241,.16);--shade-x:rgba(236,239,241,.3)}

/* Headings: a hairline with a short ruler under it; the heading you jumped to gets a tape piece */
.prose>h2.wp-block-heading{position:relative;padding-top:1.375rem;border-top:1px solid var(--rule)}
.prose>h2.wp-block-heading::before{content:"";position:absolute;top:-1px;left:0;width:4.5rem;height:7px;background:repeating-linear-gradient(90deg,var(--notch) 0 1px,transparent 1px .75rem)}
.prose>h2.wp-block-heading:target::before{background:var(--tape);box-shadow:inset 0 0 0 1px var(--tape-edge)}
.prose :is(h2,h3)[id]{scroll-margin-top:1rem}

/* Lists */
.prose ol.wp-block-list>li::marker{font:600 .875em var(--mono);color:var(--muted)}
.prose ul.wp-block-list>li::marker{color:var(--notch)}
.prose .wp-block-list>li{padding-left:.25em}

/* Quote: short official quotations with attribution */
.prose .wp-block-quote{padding:.375rem 0 .375rem 1.5rem;font-size:1.125rem;line-height:1.55}
.prose .wp-block-quote>p+p{margin-top:.75em}
.prose .wp-block-quote cite{margin-top:.625rem;font:400 .8125rem/1.5 var(--mono)}
.prose .wp-block-quote cite::before{content:"— "}

/* Details */
.prose .wp-block-details{padding:0 1rem;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface)}
.prose .wp-block-details>summary{display:flex;align-items:center;gap:.75rem;min-height:48px;margin:0;padding-block:.625rem;font-weight:650;list-style:none;cursor:pointer}
.prose .wp-block-details>summary::-webkit-details-marker{display:none}
.prose .wp-block-details>summary::before{content:"";flex:none;width:.5rem;height:.5rem;margin-inline:.125rem .25rem;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(-45deg);transition:transform .15s ease}
.prose .wp-block-details[open]{padding-bottom:1rem;border-color:var(--notch)}
.prose .wp-block-details[open]>summary{margin-bottom:.25rem}
.prose .wp-block-details[open]>summary::before{transform:rotate(45deg)}

/* Callout groups (BLOG-SPEC §4) */
.prose .hvps-callout{--c:var(--ink);--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='square'%3E%3Cpath d='M4 4h16v16H4zM12 11v6M12 7.5v.5'/%3E%3C/svg%3E");--tbl:var(--surface);position:relative;padding:1rem 1.125rem 1rem 3rem;border:1px solid var(--rule);border-left:4px solid var(--c);border-radius:var(--r);background:var(--surface)}
.prose .hvps-callout::before{content:"";position:absolute;left:.875rem;top:1.125rem;width:1.375rem;height:1.375rem;background:var(--c);-webkit-mask:var(--i) 50%/contain no-repeat;mask:var(--i) 50%/contain no-repeat}
.prose .hvps-callout>*+*{margin-top:.75em}
.prose .hvps-callout--tip{--c:var(--cap);--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='square'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E")}
.prose .hvps-callout--warning{--c:var(--error);--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='square'%3E%3Cpath d='M12 3.5l9.5 17h-19zM12 10v5M12 17.5v.5'/%3E%3C/svg%3E")}
.prose .hvps-callout--cost{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='square'%3E%3Cpath d='M3 8h15v8H3zM18 11h3v2h-3M6.5 11v2M10 11v2M13.5 11v2'/%3E%3C/svg%3E");border-left:1.5px solid var(--tape-edge);box-shadow:inset 6px 0 0 var(--tape);padding-left:3.25rem}
.prose .hvps-callout--cost::before{left:1.125rem}

/* Code blocks: ink panel; with JS a bar (language + Copy) sits in the reserved top band, so nothing moves */
.prose pre.wp-block-code{margin-bottom:0;padding:1rem 1.125rem;border:1px solid var(--code-edge);border-radius:6px;background:linear-gradient(90deg,var(--code-bg) 30%,transparent) 0 0/2rem 100% no-repeat local,linear-gradient(270deg,var(--code-bg) 30%,transparent) 100% 0/2rem 100% no-repeat local,linear-gradient(90deg,rgba(236,239,241,.2),transparent) 0 0/.625rem 100% no-repeat scroll,linear-gradient(270deg,rgba(236,239,241,.2),transparent) 100% 0/.625rem 100% no-repeat scroll,var(--code-bg);color:var(--code-ink);font:400 .875rem/1.65 var(--mono);overflow-x:auto;tab-size:2}
.prose pre.wp-block-code code{display:block;color:inherit;white-space:pre;overflow-wrap:normal}
.js .prose pre.wp-block-code{border-top:2.375rem solid var(--code-bar)}
.hvps-code{position:relative}
.prose .hvps-code>pre.wp-block-code{margin:0}
.hvps-code__bar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:1rem;height:2.375rem;padding:0 .375rem 0 1.125rem;--focus:#8FB3FF}
.hvps-code__lang{display:inline-flex;align-items:center;gap:.5rem;font:400 .75rem/1 var(--mono);color:var(--code-mut)}
.hvps-code__lang::before{content:"";width:2px;height:.9em;background:var(--tape)}
.hvps-code__copy{margin-left:auto;min-width:4.5rem;min-height:30px;padding:0 .625rem;border:1px solid var(--code-mut);border-radius:3px;background:transparent;color:var(--code-ink);font:600 .8125rem/1 var(--sans)}
.hvps-code__copy:hover{border-color:var(--tape);background:var(--tape);color:#0F1215}

/* Wide tables scroll inside their figure; shades show there is more to the side. Inline code in cells may break anywhere,
   so a long path or flag no longer sets a column's minimum width. JS marks tables that still overflow (.is-scrollable):
   a stronger, wider edge shade and a sticky "Swipe for all columns" hint (data-hint, from hvpsBC) above the table. */
.prose .wp-block-table,.hvps-cost-table__scroll{--tbl:var(--bg);--shw:.625rem;overflow-x:auto;background:linear-gradient(90deg,var(--tbl) 30%,transparent) 0 0/2rem 100% no-repeat local,linear-gradient(270deg,var(--tbl) 30%,transparent) 100% 0/2rem 100% no-repeat local,linear-gradient(90deg,var(--shade),transparent) 0 0/var(--shw) 100% no-repeat scroll,linear-gradient(270deg,var(--shade),transparent) 100% 0/var(--shw) 100% no-repeat scroll}
.prose .hvps-callout .wp-block-table{--tbl:var(--surface)}
.prose .wp-block-table table{width:100%}
.prose :is(td,th) code{overflow-wrap:anywhere}
:is(.prose .wp-block-table,.hvps-cost-table__scroll).is-scrollable{--shade:var(--shade-x);--shw:1rem}
.is-scrollable[data-hint]::before{content:attr(data-hint) " \2192";content:attr(data-hint) " \2192"/"";position:sticky;left:0;display:block;width:max-content;max-width:100%;margin-bottom:.5rem;font:400 .75rem/1.4 var(--mono);color:var(--muted)}
/* 5+ columns: compact type so rows stay short in the 720px column */
.prose .wp-block-table table:has(tr>:nth-child(5)){font-size:.8125rem;line-height:1.5}
.prose .wp-block-table table:has(tr>:nth-child(5)) :is(th,td){padding:.5rem}
.prose .wp-block-table table:has(tr>:nth-child(5)) :is(th,td):first-child{padding-left:0}
@media (max-width:719px){
.prose .wp-block-table table:not(:has(tr>:nth-child(4))) :is(th,td):has(code){min-width:6rem}
.prose .wp-block-table table:has(tr>:nth-child(4)):not(:has(tr>:nth-child(5))) :is(th,td){min-width:7.5rem}
.prose .wp-block-table table:has(tr>:nth-child(5)){min-width:46rem}
.prose .wp-block-table table:has(tr>:nth-child(4)) :is(th,td):first-child{position:sticky;left:0;z-index:1;min-width:0;max-width:8.5rem;padding-right:.625rem;background:var(--tbl);box-shadow:inset -1px 0 0 var(--rule)}
}

/* Diagrams (wp:html inline SVG, currentColor) */
.prose .hvps-diagram{margin-inline:0}
.prose :is(.hvps-diagram,.wp-block-html) svg,.prose>svg{display:block;max-width:100%;height:auto;color:var(--ink)}
.prose>svg{margin-inline:auto}

/* Shortcodes: inline prices and totals */
.hvps-price,.hvps-cost{font-variant-numeric:tabular-nums;white-space:nowrap}
.hvps-deploy{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}
:where(p,li,td)>.hvps-deploy{margin-top:.875rem}
.prose>:is(.hvps-cost-table,.hvps-plan-card,.hvps-deploy-box),.prose>:is(.hvps-cost-table,.hvps-plan-card,.hvps-deploy-box)+:not(h2,h3){margin-top:2rem}

/* Cost table */
.hvps-cost-table{--vp:.3125rem;margin-inline:0}
.hvps-cost-table table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.hvps-cost-table caption{padding-bottom:.75rem;caption-side:top;text-align:left;font-size:1rem;font-weight:650;line-height:1.4}
.hvps-cost-table :is(th,td){padding:.625rem .5rem;border:0;border-bottom:1px solid var(--rule);text-align:right;vertical-align:top}
.hvps-cost-table :is(th,td):first-child{padding-left:0;text-align:left}
.hvps-cost-table :is(th,td):last-child{padding-right:var(--vp)}
.hvps-cost-table thead th{border-bottom:1.5px solid var(--ink);font-size:.9375rem;font-weight:650;line-height:1.3;vertical-align:bottom}
.hvps-cost-table__unit{display:block;margin-top:.125rem;font:400 .75rem/1.4 var(--mono);color:var(--muted)}
.hvps-cost-table tbody th{font-weight:600}
.hvps-cost-table td{font:400 .875rem/1.5 var(--mono)}
.hvps-cost-table__v{display:inline-block;padding:0 var(--vp);margin-right:calc(-1 * var(--vp));border-radius:2px}
.hvps-cost-table td.is-cheapest .hvps-cost-table__v{background:var(--tape);color:var(--on-tape);box-shadow:inset 0 0 0 1px var(--tape-edge);font-weight:600}
.hvps-cost-table__tag{display:block;margin-top:.25rem;font:650 .6875rem/1.2 var(--sans);letter-spacing:.01em}
.hvps-cost-table__note{margin-top:.75rem;font-size:.875rem;color:var(--muted)}
.hvps-cost-table__note .ph-flag{display:table;margin-top:.5rem}
@media (max-width:479px){.hvps-cost-table :is(th,td){padding-inline:.375rem}.hvps-cost-table thead th{font-size:.875rem}.hvps-cost-table td{font-size:.8125rem}.hvps-cost-table__unit{font-size:.6875rem}.hvps-cost-table{--vp:.25rem}}

/* Plan card */
.hvps-plan-card,.hvps-deploy-box{display:grid;gap:1rem;border-radius:6px;background:var(--surface)}
.hvps-plan-card{padding:1.375rem clamp(1rem,4vw,1.5rem) 1.25rem;border:1px solid var(--rule);box-shadow:inset 0 4px 0 var(--tape),inset 0 5.5px 0 var(--tape-edge)}
.hvps-plan-card>*,.hvps-deploy-box>*,.hvps-plan-card dd{margin:0}
.hvps-plan-card__name{font-size:1.375rem;font-weight:700;line-height:1.2;letter-spacing:-.01em}
.hvps-plan-card__code{margin-left:.125rem;padding:0 .375rem;border:1px solid var(--ink);border-radius:2px;font:600 .9375rem/1.4 var(--mono);vertical-align:.125em}
.hvps-plan-card__sub,.hvps-deploy-box__spec{margin-top:.25rem;font:400 .8125rem/1.5 var(--mono);color:var(--muted)}
.hvps-plan-card__spec{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem 1rem;padding-top:.875rem;border-top:1px solid var(--rule)}
.hvps-plan-card__spec>div:nth-child(4){grid-column:1/-1}
.hvps-plan-card dt{font-size:.8125rem;color:var(--muted)}
.hvps-plan-card dd{font:600 .9375rem/1.45 var(--mono)}
.hvps-plan-card dd span{display:block;font-weight:400}
.hvps-plan-card__prices,.hvps-deploy-box__prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin:0;padding:0;list-style:none}
.hvps-plan-card__prices li,.hvps-deploy-box__prices li{display:grid;align-content:start;gap:.125rem;margin:0;padding:.625rem .75rem;border:1px solid var(--rule);border-radius:var(--r);background:var(--bg)}
:is(.hvps-plan-card__prices,.hvps-deploy-box__prices) li.is-selected{border-color:var(--ink);box-shadow:inset 0 4px 0 var(--tape)}
.hvps-plan-card__mode,.hvps-deploy-box__mode{font-size:.8125rem;font-weight:600;color:var(--muted)}
.hvps-plan-card__price,.hvps-deploy-box__price{font-size:.8125rem;color:var(--muted);font-variant-numeric:tabular-nums}
.hvps-amount{display:block;color:var(--ink);font-size:1.125rem;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.hvps-plan-card__go,.hvps-deploy-box__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}
.hvps-plan-card .ph-flag,.hvps-deploy-box .ph-flag{justify-self:start;margin:0}
.hvps-plan-card__na,.hvps-deploy-box__na{font-size:.9375rem;color:var(--muted)}

/* Deploy box: the closing "Deploy this setup" ticket, a tape strip across the top */
.hvps-deploy-box{position:relative;gap:.875rem;padding:2.125rem clamp(1rem,4vw,1.75rem) 1.375rem;border:1.5px solid var(--ink);overflow:hidden}
.hvps-deploy-box::before{content:"";position:absolute;top:0;left:0;right:0;height:14px;border-bottom:1.5px solid var(--tape-edge);background:repeating-linear-gradient(90deg,var(--on-tape) 0 1px,transparent 1px 12px) 0 0/100% 5px no-repeat,repeating-linear-gradient(90deg,var(--on-tape) 0 1.5px,transparent 1.5px 72px) 0 0/100% 9px no-repeat,var(--tape)}
.hvps-deploy-box__kicker{display:inline-flex;align-items:center;gap:.5rem;font:400 .8125rem/1.4 var(--mono);color:var(--muted)}
.hvps-deploy-box__kicker::before{content:"";width:2px;height:.9em;background:var(--tape-edge)}
.hvps-deploy-box>.hvps-deploy-box__job{margin-top:-.5rem;font-size:clamp(1.375rem,2.6vw,1.75rem);font-weight:700;line-height:1.2;letter-spacing:-.015em;text-wrap:balance}
.hvps-deploy-box>.hvps-deploy-box__spec{margin-top:-.375rem}
.hvps-deploy-box__tag{justify-self:start;margin-top:.25rem;padding:0 .4375rem;border:1px solid var(--tape-edge);border-radius:2px;background:var(--tape);color:var(--on-tape);font-size:.6875rem;font-weight:650;line-height:1.6}
.hvps-deploy-box__actions{margin-top:.25rem}
.hvps-deploy-box__alt{margin:0;font-size:.9375rem;color:var(--muted)}
.hvps-deploy-box__alt a{font-weight:600}
.hvps-deploy-box__rule{padding-top:.875rem;border-top:1px dashed var(--notch);font-size:.875rem;color:var(--muted)}
@media (max-width:419px){.hvps-plan-card__prices li,.hvps-deploy-box__prices li{padding:.5rem .5rem .5625rem}.hvps-amount{font-size:1rem}}

@media (forced-colors:active){
.hvps-cost-table td.is-cheapest .hvps-cost-table__v,:is(.hvps-plan-card__prices,.hvps-deploy-box__prices) li.is-selected{outline:2px solid CanvasText;outline-offset:1px}
.prose .hvps-callout::before,.hvps-code__lang::before{forced-color-adjust:none;background:CanvasText}
}
@media print{.hvps-code__bar{display:none}.js .prose pre.wp-block-code{border-top-width:1px}.prose pre.wp-block-code{white-space:pre-wrap}.hvps-deploy-box__actions,.hvps-plan-card__go{display:none}}