:root{--ink: #0f172a;--ink-soft: #64748b;--mist: #f1f5f9;--line: #e2e8f0;--tag: #ffd93d}html{background: #fff}body{color: var(--ink)}.page{box-sizing: border-box;width: 100%;max-width: 1360px;margin: 0 auto;padding: 3rem 2rem 4rem}.brand{display: block;margin: 0;font-size: var(--lumo-font-size-m);font-weight: 800;letter-spacing: -0.01em}.headline{margin: 1.5rem 0 1.5rem;font-size: clamp(2.2rem,5vw,3.8rem);font-weight: 800;line-height: 1.05;letter-spacing: -0.035em}.search{display: flex;flex-wrap: wrap;align-items: center;gap: 0.5rem;box-sizing: border-box;width: 100%;padding: 0.5rem;border: 1px solid var(--line);border-radius: 18px;background: #fff;box-shadow: 0 1px 2px rgba(15,23,42,0.04),0 8px 24px rgba(15,23,42,0.06)}.search vaadin-text-field{flex: 1 1 22rem;padding: 0}.search vaadin-date-picker{flex: 0 1 14rem;padding: 0}.search vaadin-text-field::part(input-field),.search vaadin-date-picker::part(input-field){min-height: 3.4rem;border-radius: 12px;background: var(--mist);font-size: var(--lumo-font-size-l)}.search vaadin-text-field::part(input-field)::after,.search vaadin-date-picker::part(input-field)::after{display: none}.search vaadin-button{flex: 0 0 auto;height: 3.4rem;margin: 0;padding: 0 2rem;border-radius: 12px;background: var(--ink);color: #fff;font-size: var(--lumo-font-size-l);font-weight: 700}.result-info{margin: 2rem 0 0.5rem;color: var(--ink-soft);font-size: var(--lumo-font-size-s);font-weight: 500}.offers{border-top: 2px solid var(--ink)}.offer{display: grid;grid-template-columns: 6rem minmax(0,1fr) 10rem 11rem 2.75rem;align-items: center;column-gap: 1.5rem;padding: 1.1rem 0.5rem;border-bottom: 1px solid var(--line);transition: background 0.12s}.offer:hover{background: var(--mist)}.offer-name{font-size: 1.15rem;font-weight: 600;line-height: 1.3;overflow-wrap: anywhere}.offer-meta{display: block;margin-top: 0.2rem;color: var(--ink-soft);font-size: var(--lumo-font-size-s);font-weight: 400}.offer-unit{color: var(--ink-soft);font-size: var(--lumo-font-size-s);font-variant-numeric: tabular-nums}.offer-price{justify-self: end;padding: 0.2rem 0.7rem;border-radius: 8px;background: var(--tag);font-size: 1.5rem;font-weight: 800;font-variant-numeric: tabular-nums;letter-spacing: -0.02em;white-space: nowrap}.store-badge{justify-self: start;padding: 0.2em 0.65em;border-radius: 6px;background: var(--ink-soft);color: #fff;font-size: var(--lumo-font-size-s);font-weight: 700}.store-logo{display: block;justify-self: start;width: auto;height: 2.25rem;max-width: 5.5rem;object-fit: contain;border-radius: 6px}.cart-store-head .store-logo{height: 2.5rem;max-width: 8rem}.store-lidl{background: #0050aa}.store-aldi{background: #00a0e4}.store-penny{background: #cd1719}.imported{margin-top: 3rem;color: var(--ink-soft)}@media (max-width: 760px){.page{padding: 1.5rem 1rem 3rem}.offer{grid-template-columns: minmax(0,1fr) auto;row-gap: 0.4rem}.offer-name{grid-column: 1 / -1}.offer-unit{grid-column: 1}.store-badge,.store-logo{grid-row: 1}.offer-price{grid-column: 2;grid-row: 3}.add-btn{grid-column: 2;grid-row: 1;justify-self: end}}.offer{position: relative}.offer-thumb{display: none;position: absolute;top: 50%;right: 27rem;z-index: 20;max-width: 22rem;max-height: 22rem;transform: translateY(-50%);border-radius: 12px;background: #fff;box-shadow: 0 0 0 1px var(--line),0 18px 40px rgba(15,23,42,0.25);pointer-events: none}.offer:hover .offer-thumb{display: block}@media (hover: none) and (min-width: 761px){.offer:hover .offer-thumb{display: none}}@media (max-width: 760px){.search vaadin-text-field,.search vaadin-date-picker,.search vaadin-button{flex: 1 1 100%;width: 100%}.offer{grid-template-columns: minmax(0,1fr) auto;grid-template-areas: "shop add" "name name" "unit price"}.offer.has-image{grid-template-columns: 5rem minmax(0,1fr) auto;grid-template-areas: "shop shop add" "thumb name name" "thumb unit price";column-gap: 0.9rem}.offer>.store-badge,.offer>.store-logo{grid-area: shop}.offer>.offer-name{grid-area: name}.offer>.offer-unit{grid-area: unit}.offer>.offer-price{grid-area: price}.offer>.add-btn{grid-area: add}.offer .offer-thumb,.offer:hover .offer-thumb{display: block;position: static;grid-area: thumb;align-self: start;width: 5rem;height: 5rem;max-width: none;max-height: none;object-fit: contain;transform: none;border-radius: 10px;box-shadow: 0 0 0 1px var(--line)}}.upload{margin-top: 1rem;border-radius: 14px}.upload-results{margin-top: 1.5rem;border-top: 2px solid var(--ink)}.upload-result{display: flex;flex-wrap: wrap;gap: 0.25rem 1.5rem;padding: 0.9rem 0.5rem;border-bottom: 1px solid var(--line)}.upload-result span:first-child{font-weight: 700}.upload-result span:last-child{color: var(--ink-soft)}.upload-ok span:first-child{color: #15803d}.upload-error span:first-child{color: #b91c1c}.topbar{display: flex;align-items: center;justify-content: space-between}.cart-link{display: inline-flex;align-items: center;gap: 0.5rem;padding: 0.55rem 1rem;border: 1.5px solid var(--ink);border-radius: 999px;color: var(--ink);font-weight: 700;text-decoration: none}.cart-link:hover{background: var(--ink);color: #fff}.cart-link vaadin-icon{width: 1.1rem;height: 1.1rem}.cart-count{min-width: 1.5rem;padding: 0 0.4rem;border-radius: 999px;background: var(--tag);color: var(--ink);font-size: var(--lumo-font-size-s);font-weight: 800;text-align: center}.add-btn{position: relative;width: 2.5rem;min-width: 0;height: 2.5rem;margin: 0;padding: 0;border-radius: 50%;background: #fff;box-shadow: inset 0 0 0 1.5px var(--ink);color: var(--ink);cursor: pointer}.add-btn:hover{background: var(--ink);color: #fff}.add-btn[data-qty]{background: var(--tag);box-shadow: inset 0 0 0 1.5px var(--ink)}.add-btn[data-qty]::after{content: attr(data-qty);position: absolute;top: -0.4rem;right: -0.4rem;min-width: 1.2rem;height: 1.2rem;padding: 0 0.15rem;box-sizing: border-box;border-radius: 999px;background: var(--ink);color: #fff;font-size: 0.7rem;font-weight: 700;line-height: 1.2rem;text-align: center}.cart-store{margin-top: 2.5rem}.cart-store-head{display: flex;align-items: center;gap: 1rem;padding-bottom: 0.7rem;border-bottom: 2px solid var(--ink)}.cart-subtotal{margin-left: auto;font-size: 1.25rem;font-weight: 800;font-variant-numeric: tabular-nums}.cart-line{display: grid;grid-template-columns: 9rem minmax(0,1fr) 9rem 9rem;align-items: center;column-gap: 1.5rem;padding: 0.9rem 0.5rem;border-bottom: 1px solid var(--line)}.cart-line-total{justify-self: end;font-weight: 700;font-variant-numeric: tabular-nums}.stepper{display: inline-flex;align-items: center;justify-self: start;gap: 0.25rem;padding: 0.15rem;border: 1px solid var(--line);border-radius: 999px}.stepper-quantity{min-width: 2rem;font-weight: 700;font-variant-numeric: tabular-nums;text-align: center}.step-btn{width: 2rem;min-width: 0;height: 2rem;margin: 0;padding: 0;border-radius: 50%;background: var(--mist);color: var(--ink)}.step-btn:hover{background: var(--ink);color: #fff}.cart-total{display: flex;align-items: center;justify-content: space-between;margin: 2.5rem 0 2rem;padding: 1.25rem 0.5rem;border-top: 2px solid var(--ink);font-size: 1.25rem;font-weight: 700}.cart-total .offer-price{font-size: 2rem}@media (max-width: 760px){.cart-line{grid-template-columns: minmax(0,1fr) auto;row-gap: 0.5rem}.cart-line .offer-name{grid-column: 1 / -1;grid-row: 1}.cart-line .stepper{grid-row: 2}.cart-line .offer-unit{display: none}.cart-line .cart-line-total{grid-row: 2}}