/* Variant: Receipt — a shop receipt itemising the work. Light, warm. */
:root {
  --bg: #fdf1e7; --surface: #ffffff; --muted: #f8e6d8; --ink: #2b1d17; --ink-2: #6e5a50; --line: #eedccd;
  --accent: #e4572e; --accent-ink: #ffffff; --accent-soft: #ffe3d6; --green-soft: #ffe3d6; --amber-soft: #fff0cf;
  --night: #2b1d17; --night-2: #3b2a22; --mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  color-scheme: light;
}
.rc { justify-self: center; width: min(100%, 24rem); rotate: 3deg; filter: drop-shadow(0 30px 30px rgba(43, 29, 23, 0.22)); }
@media (prefers-reduced-motion: no-preference) { .rc { animation: rc-print 1.2s cubic-bezier(0.2, 0.7, 0.2, 1) both; } @keyframes rc-print { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 -10% 0); } } }
.rc-paper {
  padding: 28px 26px 34px; background: #ffffff; font-family: var(--mono); font-size: 0.875rem; color: #2b1d17;
  -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 16px 51% repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 8px) no-repeat;
  mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 16px 51% repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 8px) no-repeat;
}
.rc-shop { text-align: center; font-size: 1.375rem; font-weight: 700; letter-spacing: 0.2em; line-height: 1.3; }
.rc-shop small { display: block; margin-top: 0.4rem; font-size: 0.6875rem; font-weight: 400; letter-spacing: 0; color: #6e5a50; }
.rc-items { margin: 1.25rem 0 0; padding: 1rem 0 0; list-style: none; border-top: 2px dashed #d8c6b8; }
.rc-items li { display: flex; justify-content: space-between; gap: 1rem; padding-block: 0.3rem; }
.rc-items li span:first-child { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; }
.rc-items li span:first-child::after { content: " ................................................"; color: #c4b1a4; }
.rc-items li span:last-child { flex: none; }
.rc-total { display: grid; gap: 0.2rem; margin-top: 1rem; padding-top: 1rem; border-top: 2px dashed #d8c6b8; }
.rc-total b { font-size: 1.125rem; color: var(--accent); }
.rc-note { margin-top: 0.9rem; font-size: 0.75rem; text-align: center; color: #6e5a50; }
.rc-code { display: block; height: 3.25rem; margin-top: 1rem; background: repeating-linear-gradient(90deg, #2b1d17 0 2px, transparent 2px 4px, #2b1d17 4px 7px, transparent 7px 9px, #2b1d17 9px 10px, transparent 10px 13px); }
.tile--dark .focus strong { color: #ffb08f; }
.product__visual--water { background: #ffe3d6; } .product__visual--jobs { background: #e9e4ff; } .product__visual--food { background: #fff0cf; }