:root{--navy:#0b1f3b;--navy-light:#16294a;--jade:#00a878;--jade-dark:#00835e;--bg:#fff;--surface:#f6f8fb;--text:#16213e;--muted:#5b6b82;--border:#e1e6ed;--danger:#c23b3b;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}.app-header{color:var(--navy);text-align:center;border-bottom:2px solid var(--jade);background:#fff;padding:28px 20px 24px}.logo-img{width:220px;max-width:100%;height:auto;margin:0 auto;display:block}.tagline{color:var(--navy);margin:10px 0 0;font-size:.95rem;font-weight:600}@media (width>=560px){.logo-img{width:300px}}@media (width>=900px){.logo-img{width:340px}}.container{max-width:760px;margin:0 auto;padding:20px 16px 48px}.intro{text-align:center;margin:0 0 18px}.intro h2{color:var(--navy);margin:0 0 8px;font-size:1.25rem;line-height:1.3}.intro p{color:var(--muted);margin:0;font-size:.92rem;line-height:1.45}.intro-benefit{font-weight:700;color:var(--jade-dark)!important;margin-top:8px!important;font-size:.88rem!important}.intro-animation{justify-content:center;align-items:flex-end;height:92px;margin:0 auto 8px;display:flex;overflow:hidden}.intro-animation .shopper-svg{width:auto;height:92px;display:block}.shopper-group{transform-origin:bottom;animation:4.5s ease-in-out infinite alternate shopper-roll}.cart-wheels circle{transform-origin:50%;transform-box:fill-box;animation:1.1s linear infinite wheel-spin}.leg-back,.leg-front{transform-origin:top;transform-box:fill-box;animation:.9s ease-in-out infinite alternate leg-sway}.leg-front{animation-delay:.45s}@keyframes shopper-roll{0%{transform:translate(-14px)}to{transform:translate(14px)}}@keyframes wheel-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes leg-sway{0%{transform:rotate(-6deg)}to{transform:rotate(6deg)}}@media (prefers-reduced-motion:reduce){.shopper-group,.cart-wheels circle,.leg-back,.leg-front{animation:none!important;transform:none!important}}@media (width<=380px){.intro-animation{height:72px;margin-bottom:4px}.intro-animation .shopper-svg{height:72px}}.example-row{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:18px;display:flex}.example-label{color:var(--muted);margin-right:2px;font-size:.85rem;font-weight:600}.example-btn{background:var(--surface);color:var(--navy);border:1px solid var(--border);cursor:pointer;border-radius:999px;min-height:40px;padding:10px 16px;font-size:.85rem;font-weight:600}.example-btn:hover{background:#ecf1f7}.product-grid{flex-direction:column;gap:16px;display:flex}@media (width>=700px){.product-grid{grid-template-columns:1fr 1fr;display:grid}}.card{border:1px solid var(--border);background:#fff;border-radius:16px;padding:18px;box-shadow:0 1px 3px #0b1f3b0f}.product-card-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.product-label{color:var(--navy);font-size:1.05rem;font-weight:700}.remove-btn{color:var(--danger);cursor:pointer;background:0 0;border:none;min-height:40px;padding:8px;font-size:.85rem;font-weight:600}.scan-row{align-items:center;gap:10px;margin-bottom:14px;display:flex}.scan-btn{border:1.5px solid var(--jade);min-height:44px;color:var(--jade-dark);cursor:pointer;background:#effaf5;border-radius:12px;padding:8px 16px;font-size:.9rem;font-weight:700}.scan-btn:hover{background:#e1f5ec}.scan-btn:disabled{opacity:.6;cursor:default}.scan-status{color:var(--muted);font-size:.85rem;font-weight:600}.scan-notice{color:#8a5300;background:#fff4e0;border-radius:10px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;padding:10px 14px;font-size:.85rem;display:flex}.scan-modal-backdrop{z-index:100;background:#0b1f3b8c;justify-content:center;align-items:flex-end;padding:0;display:flex;position:fixed;inset:0}@media (width>=560px){.scan-modal-backdrop{align-items:center;padding:20px}}.scan-modal{border-radius:18px 18px 0 0;width:100%;max-width:480px;max-height:92vh;padding:22px;overflow-y:auto}@media (width>=560px){.scan-modal{border-radius:18px}}.scan-modal h3{color:var(--navy);margin:0 0 6px}.scan-modal-sub{color:var(--muted);margin:0 0 16px;font-size:.88rem}.scan-field{flex-direction:column;gap:6px;margin-bottom:14px;display:flex}.scan-field-uncertain input,.scan-field-uncertain select{background:#fffbf0;border-color:#e0a32b}.scan-field-note{color:#8a5300;margin:0;font-size:.8rem}.scan-conflict{background:var(--surface);color:var(--text);border-radius:10px;padding:8px 10px;font-size:.82rem}.scan-conflict-actions{gap:8px;margin-top:6px;display:flex}.scan-chip{border:1.5px solid var(--border);color:var(--navy);cursor:pointer;background:#fff;border-radius:999px;min-height:32px;padding:6px 12px;font-size:.78rem;font-weight:700}.scan-chip:hover{background:var(--surface)}.scan-price-choice{background:var(--surface);border-radius:10px;margin-bottom:14px;padding:10px 12px}.scan-radio-option{align-items:center;gap:8px;padding:6px 0;font-size:.9rem;display:flex}.scan-modal-actions{gap:12px;margin-top:18px;display:flex}.scan-modal-actions .action-btn{flex:1}.field{flex-direction:column;flex:1;gap:6px;margin-bottom:12px;display:flex}.field-label{color:var(--muted);font-size:.8rem;font-weight:600}.field-row{gap:12px;display:flex}.field-grow{flex:1.3}input,select{border:1.5px solid var(--border);min-height:48px;color:var(--text);background:#fff;border-radius:10px;width:100%;padding:10px 12px;font-size:1rem}input:focus,select:focus{outline:2px solid var(--jade);border-color:var(--jade)}.field-errors{color:var(--danger);margin:4px 0 0;padding-left:18px;font-size:.82rem}.add-btn{border:2px dashed var(--jade);width:100%;min-height:52px;color:var(--jade-dark);cursor:pointer;background:#effaf5;border-radius:14px;margin:18px 0 24px;font-size:1rem;font-weight:700}.add-btn:hover{background:#e1f5ec}.compare-btn{background:var(--navy);color:#fff;cursor:pointer;border:none;border-radius:14px;width:100%;min-height:52px;margin:0 0 24px;font-size:1rem;font-weight:700}.compare-btn:hover{background:var(--navy-light)}.results-panel{margin-top:8px}.results-panel h2{color:var(--navy);margin:0 0 4px}.category-tag{color:var(--muted);margin:0 0 16px;font-size:.85rem}.tie-banner{color:#6b5300;background:#fff8e5;border:1px solid #f0d98a;border-radius:10px;margin-bottom:16px;padding:12px 14px;font-size:.9rem}.ranked-list{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.ranked-item{border:1.5px solid var(--border);border-radius:14px;align-items:flex-start;gap:12px;padding:14px;display:flex}.ranked-item-best{border-color:var(--jade);background:#f3fbf8;border-width:2px}.ranked-rank{background:var(--surface);width:32px;height:32px;color:var(--navy);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:700;display:flex}.ranked-item-best .ranked-rank{background:var(--jade);color:#fff}.ranked-body{flex:1}.ranked-name-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.ranked-name{color:var(--navy);font-weight:700}.best-badge{background:var(--jade);color:#fff;letter-spacing:.4px;border-radius:999px;padding:4px 10px;font-size:.72rem;font-weight:800}.ranked-price{color:var(--text);margin-top:4px;font-size:1.05rem;font-weight:700}.best-explainer{color:var(--jade-dark);margin-top:4px;font-size:.85rem;font-weight:600}.ranked-savings{color:var(--muted);margin-top:2px;font-size:.85rem}.shelf-ref{color:var(--muted);margin-top:4px;font-size:.78rem;font-style:italic}.result-actions{flex-direction:column;gap:12px;margin-top:20px;display:flex}@media (width>=560px){.result-actions{flex-flow:wrap}.result-actions .action-btn{flex:1;min-width:160px}}.action-btn{cursor:pointer;border:2px solid #0000;border-radius:14px;min-height:52px;padding:12px 18px;font-size:.98rem;font-weight:700}.action-btn-primary{background:var(--jade);color:#fff}.action-btn-primary:hover{background:var(--jade-dark)}.action-btn-secondary{color:var(--navy);border-color:var(--navy);background:#fff}.action-btn-secondary:hover{background:var(--surface)}.info-note{color:var(--navy);margin:0;font-weight:600}.info-note.warning{color:#8a5300;background:#fff4e0;border-radius:10px;margin-bottom:14px;padding:10px 14px}.disclaimer{color:var(--muted);border-top:1px solid var(--border);margin-top:18px;padding-top:14px;font-size:.82rem}
