.post-stage-build { --post-stage: #a5b4fc; --post-stage-tint: rgba(99, 102, 241, 0.16); }
.post-stage-predeploy { --post-stage: #fbbf24; --post-stage-tint: rgba(245, 158, 11, 0.14); }
.post-stage-rollout { --post-stage: #4ade80; --post-stage-tint: rgba(34, 197, 94, 0.14); }
.post-stage-sec { padding-left: 1.5rem; border-left: 2px solid var(--post-stage, #fbbf24); }
.post-stage-sec-env { border-image: linear-gradient(180deg, #fbbf24, #4ade80) 1; }
.post-stages { display: flex; flex-wrap: wrap; gap: 1.1rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.post-stages > li { position: relative; padding: 0.2rem 0.75rem; border: 1px solid var(--post-line); border-radius: 2rem; color: rgba(255, 255, 255, 0.4); font-size: 0.78rem; font-weight: 700; line-height: 1.5; }
.post-stages > li:not(:last-child)::after { content: "\203A"; position: absolute; top: 50%; right: -0.85rem; color: rgba(255, 255, 255, 0.35); transform: translateY(-50%); }
.post-stages > li.is-on, .post-stage-chip { border: 1px solid var(--post-stage); background: var(--post-stage-tint); color: var(--post-stage); }
.post-stage-chip { align-self: flex-start; margin-bottom: 0.75rem; padding: 0.1rem 0.65rem; border-radius: 2rem; font-size: 0.75rem; font-weight: 700; line-height: 1.5; }
.post-stage-mark { border-bottom: 2px solid var(--post-stage); color: var(--post-strong); }
.post-settings p code, .post-settings li code, .post-stage-sec .post-tile code { overflow-wrap: anywhere; }
.post-settings h3:first-child { margin-top: 0; }
.post-dodont { align-items: stretch; }
.post-dodont > .post-panel { margin: 0; }
.post-dodont i { display: block; margin-bottom: 0.5rem; font-size: 1.6rem; line-height: 1; }
.post-dodont .post-compare-good i { color: #4ade80; }
.post-dodont .post-compare-bad i { color: #f87171; }
@media (min-width: 1200px) {
    .post-settings { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
    .blog-content .post-settings pre code { white-space: pre-wrap; overflow-wrap: anywhere; }
}
@media (max-width: 1199.98px) {
    .post-settings { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
    .post-stage-sec { padding-left: 0.85rem; }
}