.skip {
    position: absolute;
    left: var(--space-3);
    top: var(--space-3);
    transform: translateY(-150%);
    background: var(--surface);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius);
    z-index: 5;
}
.skip:focus { transform: none; }

.card-head h1 {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: 600;
}
.alert .error,
.alert .notice {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
}

.content > h1,
.content h1:not(.h1) {
    font-size: var(--text-2xl);
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-bottom: var(--space-4);
}
.content .card:not(:has(.card-head)) {
    padding: var(--space-5);
    margin-bottom: var(--space-4);
}
.content form label {
    display: block;
    margin: var(--space-3) 0 var(--space-2);
    font-size: var(--text-sm);
    font-weight: 550;
    color: var(--text-muted);
}
.content form input:not([type="hidden"]):not([type="checkbox"]),
.content form select {
    width: 100%;
    height: 38px;
    padding: 0 var(--space-3);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius);
    background: var(--surface);
}
.content form button:not(.btn):not(.menu-item):not(.icon-btn) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    margin-top: var(--space-4);
    padding: 0 var(--space-4);
    border: 1px solid var(--accent);
    border-radius: var(--radius);
    background: var(--accent);
    color: var(--accent-contrast);
    font-weight: 550;
    cursor: pointer;
}
.occupancy-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin: 0.75rem 0 0;
    padding: 0;
    list-style: none;
}
.occupancy-legend li {
    display: flex;
    align-items: center;
    min-height: 2rem;
}
.occupancy-pill {
    display: inline-block;
    font-weight: 700;
    font-size: 0.85rem;
    padding: 0.15rem 0.45rem;
    border-radius: 0.25rem;
    border: 1px solid currentColor;
    margin: 0 0.25rem 0.25rem 0;
}
.occupancy-pill.occupied {
    color: #991b1b;
    background: #fecaca;
}
.occupancy-pill.ending {
    color: #b45309;
    background: #fde68a;
}
.occupancy-pill.incoming {
    color: #1d4ed8;
    background: #dbeafe;
}
.occupancy-pill.available {
    color: #166534;
    background: #dcfce7;
}
.occupancy-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 1rem 0;
}
.occupancy-summary .occupancy-pill {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}
.occupancy-summary [aria-current="page"] {
    outline: 2px solid currentColor;
}
.map-floor-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0.75rem 0;
}
.map-floor-tab {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0.2rem 0.7rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}
.map-floor-tab.current {
    border-color: var(--accent);
    font-weight: 700;
}
.map-floor-actions { margin-bottom: 0.75rem; }
.map-legend { margin: 0.75rem 0; }
.map-legend-status {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.map-legend-status li {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.map-swatch {
    width: 1.1rem;
    height: 1.1rem;
    border: 2px solid var(--text);
    border-radius: 0.2rem;
}
.map-swatch.available, .booth-cell.available, .map-chip.available { background: #dcfce7; border-color: #166534; }
.map-swatch.occupied, .booth-cell.occupied, .map-chip.occupied { background: #fecaca; border-color: #991b1b; }
.map-swatch.ending, .booth-cell.ending, .map-chip.ending { background: #fde68a; border-color: #b45309; }
.map-swatch.incoming, .booth-cell.incoming, .map-chip.incoming { background: #dbeafe; border-color: #1d4ed8; }
.booth-cell.available, .map-chip.available { color: #166534; }
.booth-cell.occupied, .map-chip.occupied { color: #991b1b; }
.booth-cell.ending, .map-chip.ending { color: #b45309; }
.booth-cell.incoming, .map-chip.incoming { color: #1d4ed8; }
.map-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    align-items: center;
    margin-bottom: 0.75rem;
}
.map-toolbar label { min-height: 44px; }
.map-unplaced {
    border: 2px solid var(--border);
    border-radius: var(--radius);
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
    background: var(--surface);
}
.map-unplaced-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: flex-end;
}
.map-chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--border);
    border-radius: var(--radius);
    font-weight: 700;
    font-size: 0.75rem;
    cursor: grab;
    touch-action: none;
}
.map-stage,
.map-scroll {
    min-width: 0;
    max-width: 100%;
}
.map-scroll {
    overflow: auto;
    max-height: 70vh;
}
#map-editor {
    min-width: 0;
    max-width: 100%;
}

.content a:not(.btn):not(.stat):not(.stat-link):not(.seg-btn):not(.occupancy-pill):not(.booth-cell):not(.map-floor-tab),
a.mailto,
a.text-link {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.content a:not(.btn):not(.stat):not(.stat-link):not(.seg-btn):not(.occupancy-pill):not(.booth-cell):not(.map-floor-tab):hover,
a.mailto:hover,
a.text-link:hover {
    color: var(--accent-hover);
}

.modal[data-lock] {
    z-index: 80;
}

#void-ticket {
    z-index: 90;
}

#register-count {
    z-index: 100;
}

.modal-panel:has(.close-sheet) {
    max-width: 40rem;
}

.close-sheet {
    width: 100%;
    border-collapse: collapse;
}

.close-sheet th,
.close-sheet td {
    text-align: left;
    padding: var(--space-2) var(--space-2) var(--space-2) 0;
    vertical-align: top;
}

.close-sheet .input {
    max-width: 8rem;
}

.diff-even { color: #166534; }
.diff-over { color: #1d4ed8; }
.diff-short { color: #991b1b; }

.prior-register {
    max-width: 30rem;
    width: calc(100% - 2rem);
    border: none;
    border-radius: var(--radius-lg);
    padding: 0;
    background: var(--surface);
    color: var(--text);
    box-shadow: var(--shadow-lg);
}

.prior-register::backdrop {
    background: var(--overlay);
}

.prior-register-panel {
    padding: var(--space-6);
}

.prior-register-panel h2 {
    margin: 0 0 var(--space-3);
}

.prior-register-panel ul {
    margin: var(--space-3) 0 0;
    padding-left: 1.1rem;
}

.form-sheet {
    width: 100%;
    max-width: 36rem;
}
.stack {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
.content .form-sheet .field > label {
    margin: 0;
}

a.stat-link {
    display: block;
    color: inherit;
}
a.stat-action .stat-label {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}
a.stat-link[aria-current="page"] {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent);
}

.row-form {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}
.content .row-form input[type="date"] {
    width: 9.5rem;
    min-width: 0;
    max-width: 11rem;
    flex: 0 0 auto;
}
.row-form .btn {
    margin-top: 0;
    flex: 0 0 auto;
}

.content table:not(.table) {
    width: 100%;
    border-collapse: collapse;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
}
.content table:not(.table) th,
.content table:not(.table) td {
    text-align: left;
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--border);
    vertical-align: top;
}

.caption, .legend { color: var(--text-muted); }
.pill { display: inline-block; border-radius: var(--radius-full); padding: 0.15rem 0.5rem; margin-right: 0.35rem; }
.pill-available { background: var(--success-soft); color: var(--success); }
.pill-occupied { background: var(--danger-soft); color: var(--danger); }
.pill-ending { background: var(--warning-soft); color: var(--warning); }
.pill-incoming { background: var(--info-soft); color: var(--info); }
.map-layout { display: block; }
.map-keys { list-style: none; margin: var(--space-3) 0 0; padding: 0; }
.map-keys a { display: flex; justify-content: space-between; min-height: 44px; align-items: center; }
.inspector {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    margin-top: var(--space-4);
}
canvas { width: 100%; height: auto; background: #e7e2d6; border: 1px solid #cfc6b8; }

.login-wrap {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: var(--space-6);
    background: var(--bg);
}
.login-wrap .panel { width: 100%; max-width: 420px; }

.keep-lines { white-space: pre-wrap; }

.vendor-pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin: var(--space-3) 0 0;
    padding: 0;
    list-style: none;
}
.vendor-bench {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-top: var(--space-4);
}
.vendor-work,
.vendor-identity { min-width: 0; }
.vendor-figures {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    align-items: stretch;
    margin-top: var(--space-4);
}
.vendor-figures .stat {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
}
.vendor-figures .stat-label { min-height: 2.5em; }
.vendor-figures .stat-value {
    font-size: var(--text-2xl);
    overflow-wrap: anywhere;
}
.vendor-figures .stat-delta { margin-top: auto; }
.payout-figures {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    align-items: stretch;
    margin-top: var(--space-4);
}
.payout-figures .stat {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
}
.payout-figures .stat-label { min-height: 2.5em; }
.payout-figures .payout-check .stat-value { color: var(--accent); }
.vendor-work,
.vendor-stays { display: flex; flex-direction: column; gap: var(--space-4); }
.vendor-stays { margin-top: var(--space-4); }
.record-cards { display: grid; gap: var(--space-3); }
.record-dl { margin: 0; }
.record-row {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    gap: 0.2rem 0.75rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid var(--border);
}
.record-row:last-child { border-bottom: 0; padding-bottom: 0; }
.record-row:first-child { padding-top: 0; }
.record-row dt {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--text-sm);
    font-weight: 600;
}
.record-row dd { margin: 0; }
.combo { position: relative; }
.suggest {
    position: absolute;
    z-index: 5;
    left: 0;
    right: 0;
    top: 100%;
    margin: 0;
    padding: 0.25rem 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.suggest[hidden],
.badge[hidden],
.row[hidden] { display: none; }
.suggest-item {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: 0;
    padding: 0.45rem 0.75rem;
    cursor: pointer;
    color: inherit;
    font: inherit;
}
.suggest-item:hover,
.suggest-item:focus { background: var(--surface-2); }
.field-error { color: var(--danger); margin: 0; }
.field-error[hidden] { display: none; }
.record-span { grid-column: 1 / -1; }
@media (min-width: 56rem) {
    .vendor-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(20rem, 24rem);
        column-gap: var(--space-3);
        row-gap: var(--space-4);
        align-items: start;
        margin-top: var(--space-4);
    }
    .vendor-figures,
    .vendor-bench { display: contents; }
    .vendor-fig-share { grid-column: 1; grid-row: 1; align-self: stretch; }
    .vendor-fig-rent { grid-column: 2; grid-row: 1; align-self: stretch; }
    .vendor-fig-pay { grid-column: 3; grid-row: 1; align-self: stretch; }
    .vendor-identity { grid-column: 1 / 3; grid-row: 2; }
    .vendor-work { grid-column: 3; grid-row: 2; }
    .record-cards { grid-template-columns: 1fr 1fr; }
    .payout-figures { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 48rem) {
    .map-layout { display: grid; grid-template-columns: 1fr 18.75rem; gap: var(--space-4); }
    .inspector { margin-top: 0; }
}
.register {
    display: grid;
    gap: var(--space-4);
    align-items: start;
}
.register-scan-field { flex: 1; }
.ticket-line {
    display: flex;
    justify-content: space-between;
    gap: var(--space-3);
    padding-top: var(--space-3);
    border-top: 1px solid var(--border);
}
.ticket-line-end { text-align: right; }
.ticket-meta { color: var(--text-muted); font-size: var(--text-sm); }
.ticket-foot { display: flex; flex-direction: column; gap: var(--space-2); }
.register-due { font-size: 1.75rem; font-weight: 650; }
.pay-choice { display: grid; grid-template-columns: 1fr; gap: var(--space-2); }
@media (min-width: 40rem) {
    .pay-choice { grid-template-columns: 1fr 1fr; }
}
.pay-choice .btn, .register-complete { width: 100%; min-height: 3rem; }
@media (min-width: 64rem) {
    .register { grid-template-columns: minmax(0, 1fr) 22rem; }
    .register-pay { position: sticky; top: var(--space-4); }
}
.pos-main { padding: var(--space-4); }
@media (min-width: 40rem) {
    .pos-main { padding: var(--space-6); }
}
.modal-panel.register-finished {
    max-width: 40rem;
    max-height: calc(100dvh - 1.5rem);
}
.register > .card { min-width: 0; }
.register-nav {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
    max-width: 100%;
    justify-content: flex-end;
}
.register-tools {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
    margin-top: var(--space-4);
}
.register-tools form { margin: 0; }
.register-lock {
    border: 0;
    margin: 0;
    padding: 0;
    min-width: 0;
}
.register-scan { align-items: flex-end; }
.register-summary {
    display: flex;
    justify-content: space-between;
    gap: var(--space-3);
}
.register > .card > .card-head { position: relative; }
.register-status {
    position: absolute;
    top: 50%;
    right: var(--space-5);
    max-width: calc(100% - 11rem);
    margin: 0;
    transform: translateY(-50%);
}
.register-status .alert {
    margin: 0;
    align-items: center;
    padding: var(--space-1) var(--space-3);
}
.register-status .alert p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.register-cart { table-layout: auto; }
.register-cart .register-item { width: 99%; }
.register-cart .register-qty-col,
.register-cart .register-price-col { width: 1%; white-space: nowrap; }
.register-qty {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    width: max-content;
}
.content td.register-qty-col form input.register-qty-input {
    width: 4ch;
    min-width: 4ch;
    flex: 0 0 4ch;
    box-sizing: content-box;
    text-align: center;
    padding: 0;
}
.register-qty .btn { width: 2.25rem; padding: 0; }
.content td.register-price-col form input.register-price {
    width: 8ch;
    min-width: 8ch;
    box-sizing: content-box;
    padding: 0 0.45rem;
}
.segmented .seg-btn { position: relative; }
.register-line {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
}
.register-line .input,
.register-line .select { width: 5.5rem; }
#instant-form .register-line {
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
}
@media (min-width: 40rem) {
    #instant-form .register-line {
        flex-wrap: nowrap;
        width: calc((100% - var(--space-5)) / 2);
    }
}
.content form .register-line #instant_discount_kind { width: auto; flex: 1 1 auto; min-width: 0; }
.content form .register-line #instant_discount_value { width: 4.75rem; flex: 0 0 4.75rem; }
.modal-panel.register-pay-modal {
    max-width: 52rem;
    max-height: calc(100dvh - 1.5rem);
}
.content .register-pay-modal form label { margin: 0; }
.pay-split { display: grid; }
.pay-split > .card-body { container-type: inline-size; min-width: 0; }
.pay-quick {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}
.pay-quick .btn { flex: 1 1 100%; min-height: 2.75rem; }
.pay-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
}
.pay-note { margin: 0; font-weight: 650; }
.pay-note[data-kind="short"] { color: var(--danger); }
.pay-note[data-kind="change"] { color: var(--success); }
.pay-sales {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-2);
    align-items: stretch;
}
@container (min-width: 26rem) {
    .pay-quick .btn { flex: 1 1 0; }
    .pay-grid { grid-template-columns: 1fr 1fr; }
    .pay-sales { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
}
@media (min-width: 48rem) {
    .pay-split { grid-template-columns: minmax(0, 1fr) 21rem; }
}
#customer.modal { overflow: hidden; }
.modal-panel.register-customer { overflow: visible; max-height: none; }
.modal-panel.register-customer .card-body { min-height: 16rem; }
#customer .suggest { max-height: 12rem; overflow: auto; }
.pay-rail {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    padding: var(--space-4);
    border-top: 1px solid var(--border);
    background: var(--surface-2, var(--surface));
    font-size: 1.3125rem;
    line-height: 1.3;
}
.pay-math, .pay-collected {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}
.pay-collected { margin-top: var(--space-5); }
.pay-rail .register-summary { flex-wrap: nowrap; }
.pay-rail .register-summary span,
.pay-rail .register-summary strong {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.pay-rail .btn {
    min-height: 3.5rem;
    height: auto;
    font-size: 1.3125rem;
}
@media (min-width: 48rem) {
    .pay-rail {
        padding: var(--space-5);
        border-top: 0;
        border-left: 1px solid var(--border);
    }
}
.modal-panel.register-instant { max-width: 36rem; max-height: calc(100vh - 4rem); overflow: auto; }
.register-grid {
    display: grid;
    gap: var(--space-4);
}
@media (min-width: 48rem) {
    .register-grid { grid-template-columns: 1fr 1fr; }
}
.count-panel {
    max-width: 44rem;
}

.count-columns {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}
@media (min-width: 45rem) {
    .count-columns { grid-template-columns: 1fr 1fr; }
}

.count-card {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--surface);
}

.count-card h3 {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    background: var(--accent);
    color: var(--accent-contrast);
    font-size: var(--text-sm);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-align: center;
    text-transform: uppercase;
}

.count-card-body {
    padding: var(--space-3);
    background: var(--surface-2);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.count-row {
    display: grid;
    grid-template-columns: 3.5rem 5rem 1fr;
    gap: var(--space-2);
    align-items: center;
}

.count-row label {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    background: var(--surface-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-weight: 700;
}

.count-row [data-count-line] {
    text-align: right;
    font-weight: 700;
    color: var(--success);
}

.count-total {
    font-size: var(--text-lg);
    font-weight: 700;
}

.slip-page { display: flex; flex-direction: column; gap: var(--space-4); align-items: center; }
.slip-page > .no-print,
.slip-page > .card,
.slip-page > .modal { align-self: stretch; }
.slip {
    width: min(100%, 22rem);
    margin: 0 auto;
    padding: var(--space-5) var(--space-4);
    background: #fff;
    color: #1a2230;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", monospace;
    font-size: 0.8125rem;
    line-height: 1.45;
}
.slip-center { text-align: center; margin-bottom: var(--space-4); }
.slip-store { margin: 0; font-size: 1.05rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.slip-kicker { margin: var(--space-1) 0 0; letter-spacing: 0.14em; text-transform: uppercase; }
.slip-void {
    margin: 0 0 var(--space-3);
    padding: var(--space-2);
    border: 2px solid #1a2230;
    text-align: center;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.slip-row { display: flex; justify-content: space-between; gap: var(--space-3); margin: 0.2rem 0; }
.slip-row span:last-child { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.slip-item { margin: var(--space-2) 0; }
.slip-meta { margin: 0; color: #5c6775; font-size: 0.75rem; }
.slip-rule { border: 0; border-top: 1px dashed #1a2230; margin: var(--space-3) 0; }
.slip-total { font-weight: 700; font-size: 1rem; margin-top: var(--space-2); }
.slip-number {
    margin: var(--space-3) 0;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}
.slip-thanks { margin: var(--space-5) 0 0; text-align: center; letter-spacing: 0.08em; text-transform: uppercase; }
.print-only { display: none; }
.z-tape { max-width: 28rem; }
@media print {
    .sidebar, .topbar, .sidebar-scrim, .no-print { display: none !important; }
    .print-only { display: block; }
    .app, .main, .content { display: block; background: #fff; }
    .slip-page { display: block; }
    .slip {
        width: 72mm;
        max-width: none;
        margin: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }
    .content:has(.sticker-page) { padding: 0; }
    .sticker-desk { background: transparent; padding: 0; margin: 0; }
    .sticker-page {
        margin: 0;
        box-shadow: none;
        break-after: page;
        page-break-after: always;
    }
    .sticker-page:last-child {
        break-after: auto;
        page-break-after: auto;
    }
}
.sticker-page {
    position: relative;
    background: #fff;
    overflow: hidden;
}
@media screen {
    .sticker-desk { background: #e8eaed; padding: 1rem; }
    .sticker-page { margin: 0 auto 1rem; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); }
}
.sticker {
    position: absolute;
    box-sizing: border-box;
    overflow: hidden;
    color: #111;
    font-family: Arial, Helvetica, sans-serif;
}
.sticker-line,
.sticker-code {
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.sticker-price { font-weight: 700; }
.sticker-code { text-align: center; }
.sticker-bars {
    display: block;
    width: 100%;
    object-fit: fill;
    image-rendering: pixelated;
}