.demo-section-head{border-bottom:1px solid var(--ink-200);align-items:last baseline;column-gap:var(--grid-gutter-sm);margin-bottom:var(--space-head-content);padding-bottom:var(--space-7);row-gap:var(--space-5);grid-template-columns:repeat(12,minmax(0,1fr));display:grid}.demo-section-head>:first-child{grid-column:1/span 7;min-width:0}.demo-section-head>:last-child{grid-column:8/span 5;min-width:0}@media (min-width:768px){.demo-section-head{column-gap:var(--grid-gutter-md)}}@media (min-width:1024px){.demo-section-head{column-gap:var(--grid-gutter-lg)}}@media (max-width:767px){.demo-section-head>:first-child,.demo-section-head>:last-child{grid-column:1/-1}}.demo-heading{text-wrap:balance;max-width:22ch}.demo-summary{color:var(--ink-600);font-size:var(--text-body-sm);text-wrap:pretty;max-width:40ch}.demo-canvas{background:var(--white);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);align-items:stretch;column-gap:var(--space-9);grid-template-columns:minmax(280px,1.05fr) auto minmax(0,2fr);width:100%;max-width:1120px;margin-inline:auto;padding:clamp(1.5rem,1rem + 1.5vw,2.75rem);display:grid;position:relative}@media (max-width:1023px){.demo-canvas{column-gap:var(--space-7);row-gap:var(--space-10);grid-template-columns:1fr}}.demo-canvas-label{color:var(--ink-500);font-family:var(--font-mono);font-size:var(--text-caption);font-weight:var(--font-medium);align-items:center;gap:var(--space-3);letter-spacing:var(--text-eyebrow-ls);margin:0 0 var(--space-7);text-transform:uppercase;display:inline-flex}.demo-canvas-label>.iconify-icon{color:var(--ink-600);font-size:12px}.demo-canvas-label-center{text-align:center;justify-content:center;width:100%}.demo-canvas-left,.demo-canvas-right{flex-direction:column;min-width:0;display:flex}.demo-canvas-control{align-self:center;align-items:center;gap:var(--space-7);text-align:center;flex-direction:column;min-width:180px;display:flex}@media (max-width:1023px){.demo-canvas-control{width:100%}}.demo-chip-cluster{align-items:stretch;gap:var(--space-3);grid-template-columns:1fr;width:100%;display:grid}.demo-chip{min-height:72px;padding:var(--space-5) var(--space-7);transition:background-color var(--motion-fast) var(--ease-out-soft), border-color var(--motion-fast) var(--ease-out-soft), box-shadow var(--motion-fast) var(--ease-out-soft), transform var(--motion-xfast) var(--ease-in);flex-direction:column;justify-content:center;gap:2px;position:relative}.demo-chip-num{font-family:var(--font-display);letter-spacing:-.025em;font-size:1.6rem;font-weight:700;line-height:1}.demo-chip-label{font-family:var(--font-mono);font-size:var(--text-caption);font-weight:var(--font-medium);letter-spacing:var(--text-eyebrow-ls);opacity:.7;text-transform:uppercase}.demo-chip[data-selected=true]{background-color:var(--brand-tint-50);border:1px solid var(--tash-300);color:var(--brand-fg-on-tint);box-shadow:inset 0 1px #ffffffd9,inset 0 -1px #b8064114,0 1px 2px #5908200a}.demo-chip[data-selected=true] .demo-chip-num{color:var(--brand-fg-on-tint)}.demo-chip[data-selected=false]:hover{background-color:var(--ink-50)}@media (prefers-reduced-motion:no-preference){.demo-chip:active{transform:scale(.98)}}.demo-chip-caption{color:var(--ink-600);font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:var(--text-caption-ls);text-align:center;margin:0}.demo-chip-caption-dot{color:var(--ink-300)}.demo-receipt{background: repeating-linear-gradient(180deg, transparent 0, transparent calc(var(--demo-receipt-line,22px) - 1px), #19010705 calc(var(--demo-receipt-line,22px) - 1px), #19010705 var(--demo-receipt-line,22px)), #fefcfb;border-radius:var(--radius-md) var(--radius-md) 0 0;color:var(--ink-900);font-family:var(--font-sans);gap:var(--space-5);padding:var(--space-8) var(--space-8) var(--space-9);transform-origin:top;transition:box-shadow var(--motion-medium) var(--ease-out-soft), transform var(--motion-medium) var(--ease-out-soft);flex-direction:column;width:100%;display:flex;position:relative;box-shadow:inset 0 1px #ffffffe6,0 1px 2px #0000000a,0 12px 28px #0000000f,0 28px 60px #0000000d}.demo-receipt[data-size=lg]{gap:var(--space-7);padding:var(--space-9) var(--space-9) var(--space-10)}.demo-receipt-head{gap:var(--space-3);display:grid}.demo-receipt-eyebrow{color:var(--ink-500);font-family:var(--font-mono);font-size:var(--text-caption);font-weight:var(--font-medium);letter-spacing:var(--text-eyebrow-ls);text-transform:uppercase;margin:0}.demo-receipt-client{color:var(--ink-header);font-family:var(--font-display);font-size:var(--text-h3);font-weight:var(--font-semibold);letter-spacing:-.01em;margin:0}.demo-receipt-schedule{color:var(--ink-600);font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:var(--text-caption-ls);margin:0}.demo-receipt-lines{border-top:1px dashed var(--ink-200);border-bottom:1px dashed var(--ink-200);gap:var(--space-3);padding:var(--space-5) 0;margin:0;list-style:none;display:grid}.demo-receipt-line{align-items:baseline;gap:var(--space-5);grid-template-columns:1fr auto;display:grid}.demo-receipt-line-label{color:var(--ink-700);font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:0}.demo-receipt-line-amount{color:var(--ink-800);font-family:var(--font-mono);font-size:var(--text-caption);font-weight:var(--font-medium)}.demo-receipt-total{align-items:baseline;gap:var(--space-3);grid-template-columns:auto 1fr;display:grid}.demo-receipt-total-label{color:var(--ink-500);font-family:var(--font-mono);font-size:var(--text-caption);font-weight:var(--font-medium);letter-spacing:var(--text-eyebrow-ls);text-transform:uppercase}.demo-receipt-total-amount{color:var(--ink-header);font-family:var(--font-display);letter-spacing:-.025em;text-shadow:var(--text-letterpress);justify-self:end;font-size:clamp(2rem,1rem + 2.5vw,3rem);font-weight:700;line-height:1}.demo-receipt[data-size=sm] .demo-receipt-total-amount{font-size:clamp(1.5rem,.8rem + 2vw,2.25rem)}.demo-receipt-due{color:var(--ink-600);font-family:var(--font-mono);font-size:var(--text-caption);align-items:center;gap:var(--space-3);letter-spacing:var(--text-caption-ls);margin:0;display:inline-flex}.demo-receipt-due>.iconify-icon{font-size:12px}.demo-receipt-tear{width:100%;height:14px;display:block;position:absolute;bottom:-2px;left:0}.demo-receipt-tear-edge{fill:#19010712}.demo-receipt-stamp{pointer-events:none;right:calc(-1 * var(--space-5));top:var(--space-7);z-index:2;justify-content:center;align-items:center;display:flex;position:absolute;transform:rotate(8deg)}.demo-receipt-stamp-inner{background-color:var(--tash-500);background-image:var(--wax-sheen), var(--wax-gradient);border-radius:var(--radius-sm);box-shadow:var(--leather-burnish), var(--shadow-wax-seal);color:var(--wax-label);font-family:var(--font-mono);font-size:10px;font-weight:var(--font-semibold);letter-spacing:.15em;padding:var(--space-3) var(--space-5);text-transform:uppercase;opacity:0;transition:opacity var(--motion-medium) var(--ease-out-soft) .38s, transform var(--motion-medium) var(--ease-out-soft) .38s;align-items:center;gap:4px;display:inline-flex;transform:scale(.85)}.demo-receipt-stamp-inner>.iconify-icon{font-size:11px}.demo-canvas[data-played=true] .demo-receipt-stamp-inner{opacity:1;transform:scale(1)}.demo-receipt-frame{isolation:isolate;position:relative}.demo-tear-line{pointer-events:none;opacity:0;height:100%;stroke:var(--tash-500);stroke-dashoffset:110px;transition:opacity var(--motion-fast) var(--ease-out-soft), stroke-dashoffset var(--motion-slow) var(--ease-out);z-index:3;width:100%;position:absolute;inset:0}.demo-canvas[data-played=true] .demo-tear-line{opacity:.85;stroke-dashoffset:0;transition-delay:60ms,60ms}.demo-receipt-frame-parent .demo-receipt{transition:opacity var(--motion-medium) var(--ease-out-soft) .28s, transform var(--motion-medium) var(--ease-out-soft) .28s, box-shadow var(--motion-medium) var(--ease-out-soft) .28s}.demo-canvas[data-played=true] .demo-receipt-frame-parent .demo-receipt{opacity:.94}.demo-cascade{gap:0;display:grid;position:relative}.demo-cascade-slot{margin-top:calc(-1 * var(--space-13));z-index:calc(1 + var(--i,0));opacity:0;transition:opacity var(--motion-medium) var(--ease-out-soft), transform var(--motion-medium) var(--ease-out-soft);transition-delay:calc(var(--i,0) * 80ms + .48s);position:relative;transform:translateY(14px)}.demo-cascade-slot:first-child{margin-top:0}.demo-canvas[data-played=true] .demo-cascade-slot{opacity:1;transform:translateY(0)}.demo-cascade[data-count="2"] .demo-cascade-slot{margin-top:calc(-1 * var(--space-11))}.demo-cascade[data-count="3"] .demo-cascade-slot{margin-top:calc(-1 * var(--space-12))}.demo-cascade[data-count="4"] .demo-cascade-slot{margin-top:calc(-1 * var(--space-13))}.demo-cascade .demo-cascade-slot:first-child{margin-top:0}.demo-caption-strip{color:var(--ink-600);font-family:var(--font-mono);font-size:var(--text-caption);align-items:center;gap:var(--space-3);letter-spacing:var(--text-caption-ls);margin-block:var(--space-9) var(--space-7);flex-wrap:wrap;justify-content:center;display:flex}.demo-caption{align-items:center;gap:var(--space-3);display:inline-flex}.demo-caption-dot{color:var(--ink-300)}.demo-footer{margin-top:var(--space-7);justify-content:center;align-items:center;display:flex}.demo-canvas[data-reduced=true] .demo-tear-line{opacity:.85;stroke-dashoffset:0;transition:none}.demo-canvas[data-reduced=true] .demo-cascade-slot{opacity:1;transition:none;transform:none}.demo-canvas[data-reduced=true] .demo-receipt-stamp-inner{opacity:1;transition:none;transform:scale(1)}@media (prefers-reduced-motion:reduce){.demo-tear-line,.demo-cascade-slot,.demo-receipt,.demo-receipt-stamp-inner{transition:none!important}}@media (max-width:1023px){.demo-receipt-frame-parent,.demo-cascade{max-width:480px;margin-inline:auto}.demo-chip-cluster{grid-template-columns:repeat(3,1fr);max-width:380px}.demo-chip{min-height:64px}}@media (max-width:640px){.demo-canvas{border-radius:var(--radius-lg);padding:var(--space-7);row-gap:var(--space-9)}.demo-receipt[data-size=lg]{gap:var(--space-5);padding:var(--space-7)}.demo-receipt[data-size=sm]{padding:var(--space-7)}.demo-receipt-client{font-size:var(--text-subheading)}.demo-receipt-total-amount{font-size:2rem}.demo-receipt[data-size=sm] .demo-receipt-total-amount{font-size:1.625rem}.demo-cascade[data-count="2"] .demo-cascade-slot,.demo-cascade[data-count="3"] .demo-cascade-slot,.demo-cascade[data-count="4"] .demo-cascade-slot{margin-top:calc(-1 * var(--space-10))}.demo-cascade .demo-cascade-slot:first-child{margin-top:0}.demo-receipt-stamp{right:var(--space-5);top:var(--space-5)}}
