/* Compose preflight landing page (tools/docker-compose-production-preflight only) */
.tpd-demo{display:grid}
.tpd-demo .mt-demo-head strong{font-size:1.15rem;line-height:1.3}
.tpd-body{display:grid;gap:14px;min-width:0;padding:18px 22px 22px}
.tpd-label{margin:0;color:#52647b;font-size:.74rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}

/* Example source files with line numbers */
.tpd-files{display:grid;gap:10px;min-width:0}
.tpd-file{min-width:0;border-radius:14px;background:#0b213d;color:#e8f0fb;overflow:hidden}
.tpd-file-name{margin:0;padding:8px 14px;border-bottom:1px solid #26446d;font:700 .8rem/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;color:#b9cbe4}
.tpd-code{margin:0;padding:8px 0;list-style:none;counter-reset:tpdline;overflow-x:auto;font:500 .84rem/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}
.tpd-code li{counter-increment:tpdline;display:grid;grid-template-columns:2.9em minmax(0,1fr) auto;align-items:center;column-gap:10px;padding:0 14px 0 0}
.tpd-code li::before{content:counter(tpdline);align-self:start;text-align:right;color:#8ea6c6}
.tpd-code code{min-width:0;font:inherit;white-space:pre-wrap;overflow-wrap:anywhere;color:inherit}
.tpd-code .tpd-hit{background:#5b1d1d;box-shadow:inset 3px 0 0 #ff8a80}
.tpd-code .tpd-hit::before{color:#ffd1cc}
.tpd-code .tpd-skip{background:#12395c;box-shadow:inset 3px 0 0 #7fb3ff}
.tpd-tag{justify-self:end;padding:1px 8px;border-radius:999px;font:800 .7rem/1.5 Manrope,system-ui,sans-serif;letter-spacing:.02em;white-space:nowrap}
.tpd-hit .tpd-tag{background:#ffd1cc;color:#5b1111}
.tpd-skip .tpd-tag{background:#d6e6ff;color:#0b2d5c}

/* Findings as they come back */
.tpd-findings{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.tpd-findings li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;align-items:baseline;padding:10px 12px;border:1px solid #f1c4bf;border-left:4px solid #c62f25;border-radius:10px;background:#fff6f5;color:#071b35;font-size:.9rem;line-height:1.45}
.tpd-sev{padding:1px 8px;border-radius:999px;background:#c62f25;color:#fff;font-size:.72rem;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
.tpd-findings code{font:700 .82rem/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.tpd-findings span:last-child{grid-column:1/-1;overflow-wrap:anywhere}
.tpd-note{margin:0;padding:10px 12px;border-radius:10px;background:#edf4ff;color:#16345f;font-size:.88rem;line-height:1.5}
.tpd-note code,.tpd-copy code{font:700 .84em ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.tpd-out{margin:0;color:#52647b;font-size:.86rem;line-height:1.55}
.tpd-out strong{color:#071b35}

/* Rule list in the editorial section */
.tpd-rules{display:grid;gap:10px;margin:14px 0 22px;padding:0;list-style:none}
.tpd-rules li{padding:12px 14px;border:1px solid #d7e1ee;border-radius:12px;background:#fff;line-height:1.55}
.tpd-rules strong{display:block;margin-bottom:2px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92rem}
.tpd-copy code{background:#edf4ff;padding:0 4px;border-radius:4px}

.tpd-links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:14px}
.tpd-links a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;text-underline-offset:3px}
.tpd-demo a:focus-visible,.tpd-links a:focus-visible{outline:3px solid #1f5cf0;outline-offset:3px}

@media (max-width:520px){
  .tpd-body{padding:14px 14px 18px}
  .tpd-demo .mt-demo-head{padding:16px 14px}
  .tpd-code{font-size:.76rem}
  .tpd-code li{grid-template-columns:2.4em minmax(0,1fr);column-gap:8px;padding-right:8px}
  .tpd-tag{grid-column:2;margin:1px 0 3px}
  .tpd-findings li{font-size:.86rem}
}
@media (prefers-reduced-motion:reduce){.tpd-demo *{transition:none}}
