/* Busywork receipt section. Site color tokens for the page; the receipt itself is always paper. */
.rc-grid{display:grid;gap:3rem;align-items:start}
@media (min-width:960px){.rc-grid{grid-template-columns:1fr 1fr;gap:4.5rem}}
.rc-lead{max-width:34rem}

.rc-controls{margin-top:2.25rem;display:grid;gap:1.35rem}
.rc-row-top{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.rc-label{font-weight:500;color:var(--color-paper);font-size:.9875rem}
.rc-out{font-variant-numeric:tabular-nums;font-weight:600;color:var(--color-link);font-size:.9375rem;white-space:nowrap}
.rc-row-rate{margin-top:.5rem;padding-top:1.35rem;border-top:1px solid var(--color-line)}

.rc-range{--rc-fill:0%;-webkit-appearance:none;appearance:none;display:block;width:100%;height:28px;margin-top:6px;background:transparent;cursor:pointer}
.rc-range:focus{outline:none}
.rc-range::-webkit-slider-runnable-track{height:8px;border-radius:9999px;background:linear-gradient(90deg,#2b61df 0,#3b7fe3 var(--rc-fill),var(--color-ink-3) var(--rc-fill))}
.rc-range::-moz-range-track{height:8px;border-radius:9999px;background:var(--color-ink-3)}
.rc-range::-moz-range-progress{height:8px;border-radius:9999px;background:#2b61df}
.rc-range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:-8px;border-radius:9999px;background:#fff;border:2px solid #2b61df;box-shadow:0 2px 6px #0f1f3e40;transition:transform .1s}
.rc-range::-moz-range-thumb{width:20px;height:20px;border-radius:9999px;background:#fff;border:2px solid #2b61df;box-shadow:0 2px 6px #0f1f3e40}
.rc-range:active::-webkit-slider-thumb{transform:scale(1.15)}
.rc-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px #2b61df40}
.rc-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 5px #2b61df40}

/* The paper receipt */
.rc-right{position:relative}
@media (min-width:960px){.rc-right{position:sticky;top:96px}}
.rc-shadow{filter:drop-shadow(0 22px 30px #0f1f3e33) drop-shadow(0 2px 3px #0f1f3e1a);transform:rotate(-1.2deg);transition:transform .3s}
.rc-shadow:hover{transform:rotate(0)}
.rc-paper{--z:12px;position:relative;padding:calc(var(--z) + 26px) 28px calc(var(--z) + 28px);background:#fdfcf7;color:#1d2433;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13.5px;line-height:1.5;
  -webkit-mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--z)) 51% repeat-x,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--z)) 51% repeat-x;
  mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--z)) 51% repeat-x,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--z)) 51% repeat-x}
:root[data-theme=dark] .rc-paper{background:#f3f1ea}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .rc-paper{background:#f3f1ea}}
.rc-phead{text-align:center;padding-bottom:14px;border-bottom:2px dashed #1d243333}
.rc-shop{font-weight:700;letter-spacing:.18em;font-size:15px}
.rc-meta{margin-top:2px;font-size:12px;color:#5b6474}
.rc-lines{list-style:none;margin:0;padding:14px 0;display:grid;gap:12px;border-bottom:2px dashed #1d243333}
.rc-line{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;column-gap:8px}
.rc-name{font-weight:600}
.rc-dots{border-bottom:2px dotted #1d243340;transform:translateY(-4px)}
.rc-amt{font-weight:700;font-variant-numeric:tabular-nums}
.rc-sub{grid-column:1/-1;font-size:12px;color:#5b6474}
.rc-zero{opacity:.38}
.rc-total{padding-top:14px}
.rc-total-h{display:flex;justify-content:space-between;align-items:baseline;font-weight:800;font-size:clamp(20px,2.4vw,26px);letter-spacing:.02em}
.rc-total-v{font-variant-numeric:tabular-nums}
.rc-total-s{margin-top:6px;font-size:13px;color:#3b4456}
.rc-stamp{display:table;margin:18px auto 0;padding:4px 10px;border:2.5px solid #9b241c;border-radius:6px;color:#9b241c;font-weight:800;font-size:11px;letter-spacing:.12em;transform:rotate(-9deg);pointer-events:none}
.rc-empty .rc-stamp{display:none}

.rc-cta{margin-top:2rem;display:grid;gap:.75rem;justify-items:start}
.rc-go{min-height:52px;padding-left:1.75rem;padding-right:1.75rem;font-size:1rem}
.rc-note{font-size:.875rem;color:var(--color-mute);max-width:30rem}

/* Phones: the receipt sits below the sliders, so keep a running total in view */
.rc-mini{position:sticky;top:72px;z-index:5;justify-self:start;padding:.5rem .9rem;border-radius:9999px;background:var(--color-navy);color:#fff;font-weight:600;font-size:.875rem;font-variant-numeric:tabular-nums;box-shadow:0 8px 20px -8px #0f1f3e66}
@media (min-width:960px){.rc-mini{display:none}}
@media (max-width:640px){
  .rc-paper{padding-left:18px;padding-right:18px;font-size:12.5px}
  .rc-go{width:100%}
}
@media (prefers-reduced-motion:reduce){.rc-shadow{transform:none;transition:none}}

.rc-example{margin-bottom:6px;font-weight:700;letter-spacing:.16em;font-size:11px;color:#9b241c;text-transform:uppercase}
.rc-example[hidden]{display:none}
.rc-live{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.rc-go{display:inline-flex;align-items:center;gap:.5rem}
.rc-mini{z-index:5}

/* Cookie banner is z-index 60 at the bottom; the running total sticks under the header, not the banner. */
body:has(#consent:not([hidden])) .rc-mini{top:72px}

/* Keep focused sliders clear of the sticky running total on phones. */
@media (max-width:959px){
  .rc-row{scroll-margin-top:132px}
}


@media (prefers-reduced-motion:reduce){
  .rc-range::-webkit-slider-thumb{transition:none}
  .rc-range:active::-webkit-slider-thumb{transform:none}
  .rc-stamp{transform:none}
}