.demo{--d-accent:#3e5c76;--d-ink:#16181a;--d-head:#1f2326;--d-band:#5c6469;--d-cmp:#eceef0;--d-cmp-line:#d7dade;--d-typed:#fff;--d-rule:#c9ced3;--d-neg:#a3242b;--d-pos:#1f6b41;--d-mute:#6d757c;color:var(--d-ink);font:15px/1.55 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.demo p{max-width:78ch;margin:0 0 12px}.demo .note{color:var(--d-mute);max-width:78ch;font-size:13.5px}.demo h2.dh2{letter-spacing:-.01em;margin:0 0 4px;font-size:20px}.demo h3.dh{text-transform:uppercase;letter-spacing:.09em;color:var(--d-band);margin:26px 0 8px;font-size:13px;font-weight:600}.demo h4{margin:0}.demo .legend{border:1px solid var(--d-rule);background:#fff;border-radius:4px;flex-wrap:wrap;align-items:center;gap:8px 22px;margin:0 0 26px;padding:12px 14px;font-size:13.5px;display:flex}.demo .legend b{font-weight:600}.demo .swatch{border:1px solid var(--d-rule);vertical-align:-2px;width:22px;height:14px;margin-right:7px;display:inline-block}.demo .sw-typed{background:var(--d-typed)}.demo .sw-cmp{background:var(--d-cmp)}.demo .sw-hatch{background:var(--d-cmp);background-image:repeating-linear-gradient(45deg,#0000 0 3px,#c2c7cc 3px 4px)}.demo .sw-est{background:var(--d-cmp);border-bottom:2px dotted var(--d-band)}.demo .settings{border:1px solid var(--d-rule);background:#fff;border-radius:4px;margin:0 0 8px;padding:14px 16px}.demo .settings .row{flex-wrap:wrap;align-items:flex-end;gap:18px;display:flex}.demo .settings label{text-transform:uppercase;letter-spacing:.07em;color:var(--d-band);margin-bottom:4px;font-size:12px;display:block}.demo .settings input{border:1px solid var(--d-rule);width:96px;font:inherit;text-align:right;background:var(--d-typed);border-radius:3px;padding:5px 7px}.demo .panel{border:1px solid var(--d-rule);background:#fff;border-radius:4px;margin:0 0 40px;overflow:hidden}.demo .panel>header{border-bottom:1px solid var(--d-rule);padding:18px 20px 14px}.demo .panel>header .price{background:var(--d-accent);color:#fff;letter-spacing:.06em;vertical-align:3px;border-radius:2px;margin-left:10px;padding:3px 9px;font-size:12px;font-weight:600;display:inline-block}.demo .panel>.body{padding:18px 20px 22px}.demo .strip{border:1px solid var(--d-rule);border-radius:3px;grid-template-columns:repeat(6,1fr);margin:0 0 16px;display:grid;overflow:hidden}.demo .strip div{background:var(--d-cmp);border-right:1px solid var(--d-cmp-line);padding:10px 12px}.demo .strip div:last-child{border-right:0}.demo .strip span{text-transform:uppercase;letter-spacing:.07em;color:var(--d-band);font-size:11px;display:block}.demo .strip strong{font-variant-numeric:tabular-nums;margin-top:2px;font-size:19px;font-weight:600;display:block}.demo .scroll{border:1px solid var(--d-rule);border-radius:3px;overflow-x:auto}.demo table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:13.5px}.demo thead th{background:var(--d-head);color:#fff;text-align:right;white-space:nowrap;text-transform:uppercase;letter-spacing:.05em;padding:9px 10px;font-size:11.5px;font-weight:600}.demo thead th.l{text-align:left}.demo thead th.grp{background:var(--d-band);letter-spacing:.09em;text-align:center;border-left:1px solid #7d858a;font-size:10.5px}.demo tbody td{border-top:1px solid var(--d-cmp-line);border-right:1px solid var(--d-cmp-line);text-align:right;white-space:nowrap;padding:0}.demo tbody td:last-child{border-right:0}.demo tbody td.t{background:var(--d-typed)}.demo tbody td.c{background:var(--d-cmp)}.demo tbody td .v{padding:7px 10px;display:block}.demo tbody td.est .v{border-bottom:2px dotted var(--d-band);width:auto;margin:0 10px 5px 0;padding:7px 0 0;display:inline-block}.demo tbody td.na{background-image:repeating-linear-gradient(45deg,#0000 0 4px,#c2c7cc 4px 5px)}.demo tbody td.na .v{color:#0000;user-select:none}.demo tbody input{width:100%;font:inherit;font-variant-numeric:tabular-nums;text-align:right;color:inherit;background:0 0;border:0;padding:7px 10px}.demo tbody input:focus{outline:2px solid var(--d-accent);outline-offset:-2px;background:#fbfcfd}.demo tbody input.txt{text-align:left}.demo tbody input[type=checkbox]{width:auto;accent-color:var(--d-accent);margin:8px 10px}.demo tr.refunded td.t,.demo tr.refunded input,.demo .neg{color:var(--d-neg)}.demo .pos{color:var(--d-pos)}.demo td.profit .v{font-weight:600}.demo tfoot td{background:var(--d-cmp);border-top:2px solid var(--d-band);text-align:right;padding:7px 10px;font-weight:600}.demo .ba{grid-template-columns:1fr 1fr;gap:18px;display:grid}.demo .ba>div{border:1px solid var(--d-rule);border-radius:3px;overflow:hidden}.demo .ba h4{text-transform:uppercase;letter-spacing:.07em;background:var(--d-head);color:#fff;margin:0;padding:9px 12px;font-size:11.5px;font-weight:600}.demo .ba>div.hl h4{background:var(--d-accent)}.demo .ba ul{margin:0;padding:12px 12px 12px 28px;font-size:13.5px}.demo .ba li{margin:0 0 5px}.demo .ba li.add{color:var(--d-pos);font-weight:500}.demo .ba li.gone{color:var(--d-mute);text-decoration:line-through}.demo .bignum{font-variant-numeric:tabular-nums;font-size:34px;font-weight:600}.demo .tabstrip{flex-wrap:wrap;gap:4px;padding:12px;display:flex}.demo .tabstrip span{border:1px solid var(--d-rule);background:var(--d-cmp);border-radius:2px;padding:4px 9px;font-size:12px}.demo .tabstrip span.new{background:var(--d-accent);color:#fff;border-color:var(--d-accent)}@media (width<=760px){.demo .strip{grid-template-columns:repeat(3,1fr)}.demo .strip div:nth-child(-n+3){border-bottom:1px solid var(--d-cmp-line)}.demo .ba{grid-template-columns:1fr}.demo .stackable thead{display:none}.demo .stackable .scroll{border:0;overflow:visible}.demo .stackable table,.demo .stackable tbody,.demo .stackable tr,.demo .stackable td{width:100%;display:block}.demo .stackable tbody tr{border:1px solid var(--d-rule);border-radius:3px;margin:0 0 12px;overflow:hidden}.demo .stackable tbody td{border-right:0;border-top:1px solid var(--d-cmp-line);white-space:normal;justify-content:space-between;align-items:center;display:flex}.demo .stackable tbody tr td:first-child{border-top:0}.demo .stackable tbody td:before{content:attr(data-l);text-transform:uppercase;letter-spacing:.06em;color:var(--d-band);flex:none;padding:7px 10px;font-size:11px;font-weight:600}.demo .stackable tbody td .v,.demo .stackable tbody input{flex:auto;width:auto}.demo .stackable tbody td.est .v{margin:0 10px 5px 0}.demo .stackable tfoot{display:none}}