/* Receipt teaching visual only; shared Byte components remain unchanged. */
.dl-page .dl-pipeline{display:grid;grid-template-columns:1fr 1.3fr .9fr;gap:16px;align-items:stretch}
.dl-page .dl-receipt,.dl-page .dl-transform,.dl-page .dl-output{padding:16px;border:1px solid var(--byte-blue);border-radius:8px;min-width:0;font-size:14px;line-height:1.5}
.dl-page .dl-receipt dl{display:grid;grid-template-columns:1fr auto;gap:12px 8px;font:12px/1.6 'IBM Plex Mono',monospace;margin:20px 0}
.dl-page .dl-receipt dd{margin:0;text-align:right}.dl-page .dl-total{background:var(--byte-yellow);font-weight:700}
.dl-page .dl-transform{background:var(--byte-light)}.dl-page .dl-transform p{margin-bottom:0}
.dl-page .dl-pixel{max-width:120px;margin:16px auto 6px;border:1px dashed var(--byte-blue);padding:8px;color:var(--byte-navy);background:white}
.dl-page .dl-pixel svg{display:block;width:100%;height:auto}
.dl-page .dl-output{display:flex;flex-direction:column;justify-content:center;gap:10px}.dl-page .dl-output b{font-size:32px;color:var(--byte-navy)}
.dl-page .dl-anchor{display:block;height:0}.dl-page .byte-wonders .byte-question{margin-bottom:0}
@media(max-width:700px){.dl-page .dl-pipeline{grid-template-columns:1fr}.dl-page .dl-receipt dl{font-size:14px}.dl-page .dl-output{align-items:flex-start}}
@media print{.dl-page .dl-pipeline{grid-template-columns:1fr 1.3fr .9fr}}
