@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{font-family:'DM Sans',Arial,sans-serif;color:#050b0b;background:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;font-optical-sizing:auto;font-weight:400;--green:#00c4bd;--muted:#454f4e;--cream:#fff;--turquoise:#00c4bd;--black:#050b0b;--white:#fff}
*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}.app-shell{max-width:1120px;margin:0 auto;padding:0 44px}.topbar{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8e5dc}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#263a31;font-family:Manrope,sans-serif;font-weight:800;font-size:17px}.brand-mark{width:31px;height:31px;border-radius:10px 10px 10px 3px;display:grid;place-items:center;background:#356d54;color:#fff;font-size:17px}.topbar-note{font-size:13px;color:#7c8881}.welcome{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:64px;padding:79px 0 70px}.eyebrow{margin:0 0 14px;color:#63816f;font-size:11px;font-weight:700;letter-spacing:.14em}.welcome h1{font-family:Manrope,sans-serif;font-size:clamp(37px,5vw,56px);line-height:1.13;letter-spacing:-.045em;margin:0 0 20px;color:#263b31}.intro{max-width:440px;margin:0;color:#697770;font-size:16px;line-height:1.75}.scan-button{display:flex;align-items:center;justify-content:center;gap:13px;width:min(100%,370px);min-height:68px;margin-top:31px;padding:15px 22px;border:0;border-radius:14px;background:#286149;color:white;font:700 17px 'DM Sans',sans-serif;cursor:pointer;box-shadow:0 6px 0 #1c4c37,0 12px 22px #234d371f;transition:transform .15s,background .15s}.scan-button:hover{background:#1f543e;transform:translateY(-1px)}.scan-button:active{transform:translateY(3px);box-shadow:0 3px 0 #1c4c37}.scan-button svg,.camera-symbol svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.privacy-note{display:flex;align-items:center;gap:8px;margin:19px 0 0;font-size:12px;color:#7c8982}.privacy-note span{font-size:8px;color:#78a186}.visual-card{height:345px;position:relative;display:grid;place-items:center;overflow:hidden;border-radius:25px;background:#e9eee5}.product-illustration{position:relative;width:218px;height:253px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:13px;filter:drop-shadow(0 18px 12px #34554019);z-index:1}.jar-lid{height:28px;width:135px;border-radius:7px 7px 4px 4px;background:repeating-linear-gradient(90deg,#e4c486 0 7px,#ebd39e 7px 10px);border:3px solid #d5bc82;z-index:2}.jar{width:172px;height:178px;border:4px solid #fff9eb;border-radius:25px 25px 37px 37px;background:linear-gradient(90deg,#e9cb83,#f3dfab 25%,#f2dda4 75%,#ddbe77);display:grid;place-items:center}.jar-label{width:124px;height:89px;border-radius:8px;background:#fffaf0;display:flex;align-items:center;flex-direction:column;justify-content:center;color:#46704f}.jar-label span{font:800 17px Manrope,sans-serif;letter-spacing:.05em}.jar-label i{width:60px;height:2px;background:#d6be8b;margin:7px 0}.jar-label small{font-size:9px;color:#83927e}.barcode-art{display:flex;align-items:flex-end;gap:3px;width:104px;height:28px;position:absolute;bottom:5px;left:60px}.barcode-art b{height:100%;width:3px;background:#24352e}.barcode-art b:nth-child(2n){height:78%;width:2px}.barcode-art b:nth-child(4n){width:5px}.visual-caption{position:absolute;right:25px;bottom:25px;display:flex;align-items:center;gap:9px;color:#5e6f63;font-size:12px;line-height:1.5}.caption-icon{height:22px;width:22px;display:grid;place-items:center;background:#fff;border-radius:50%;color:#397253;font-weight:700}.decor{position:absolute;border-radius:50%;background:#dce7d8}.decor-one{height:185px;width:185px;top:-72px;left:-60px}.decor-two{height:120px;width:120px;right:-38px;top:54px;background:#f3e8cd}.steps{border-top:1px solid #e5e2da;border-bottom:1px solid #e5e2da;padding:25px 0;display:flex;align-items:center;justify-content:space-between;gap:16px}.step-card{display:flex;align-items:center;gap:12px}.step-number{width:34px;height:34px;display:grid;place-items:center;border:1px solid #d9e2d8;border-radius:50%;color:#477558;font-weight:700;font-size:13px}.step-card h2{margin:0 0 4px;font-size:13px;font-weight:700}.step-card p{margin:0;color:#87918b;font-size:11px}.step-arrow{color:#b7c0b7}footer{padding:24px 0 32px;color:#87918b;text-align:center;font-size:11px}
.scanner{position:fixed;inset:0;z-index:10;display:none;place-items:center;padding:20px;background:#18231edb;backdrop-filter:blur(5px)}.scanner.is-open{display:grid}.scanner-panel{width:min(100%,540px);padding:25px;border-radius:22px;background:#f9f8f4;box-shadow:0 24px 80px #0005}.scanner-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.scanner-header .eyebrow{margin-bottom:5px}.scanner-header h2{margin:0;font:700 23px Manrope,sans-serif;color:#293c32}.close-button{width:43px;height:43px;border:0;border-radius:50%;background:#e9eee7;color:#355a43;font-size:31px;line-height:1;cursor:pointer}.camera-frame{position:relative;overflow:hidden;display:grid;place-items:center;width:100%;aspect-ratio:4/3;border-radius:15px;background:#17211c}.camera-frame video{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.camera-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;color:#e8eee8;background:linear-gradient(135deg,#263a30,#15211b);text-align:center;padding:24px}.camera-placeholder p{max-width:330px;margin:0;font-size:14px;line-height:1.5}.camera-symbol{display:grid;place-items:center;width:59px;height:59px;border:1px solid #ffffff45;border-radius:17px;color:#dce9dd}.camera-symbol svg{width:29px;height:29px}.scan-window{position:absolute;inset:28% 12%;border:2px solid #c3ef91;border-radius:14px;box-shadow:0 0 0 999px #0002;display:none}.camera-frame.is-active .scan-window{display:block}.scan-line{position:absolute;left:8px;right:8px;top:50%;height:2px;background:#c3ef91;box-shadow:0 0 12px #c3ef91;animation:scan 2s ease-in-out infinite alternate}@keyframes scan{from{transform:translateY(-40px)}to{transform:translateY(40px)}}.scanner-hint{margin:17px 0 0;text-align:center;color:#65736d;font-size:14px;line-height:1.5}.scanner-hint.error{color:#a24d40}.scanner-hint.success{color:#286149;font-weight:700}.switch-camera{display:block;margin:14px auto 0;border:1px solid #d9e2d8;border-radius:10px;background:white;color:#345843;padding:10px 14px;font:600 13px 'DM Sans',sans-serif;cursor:pointer}.switch-camera[hidden]{display:none}
@media(max-width:760px){.app-shell{padding:0 24px}.welcome{grid-template-columns:1fr;gap:32px;padding:53px 0 43px}.welcome h1{font-size:43px}.visual-card{height:270px}.product-illustration{transform:scale(.8)}.steps{align-items:flex-start;flex-wrap:wrap;justify-content:center;gap:18px}.step-card{min-width:40%}.step-arrow{display:none}}
@media(max-width:430px){.app-shell{padding:0 18px}.topbar{height:70px}.topbar-note{font-size:11px}.brand{font-size:14px}.welcome{padding-top:42px}.welcome h1{font-size:38px}.intro{font-size:15px}.scan-button{font-size:15px;min-height:62px}.steps{justify-content:flex-start}.step-card{min-width:100%}.scanner{padding:12px}.scanner-panel{padding:18px}.scanner-header h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
.camera-frame video{z-index:0;display:block;object-fit:contain;background:#111}.camera-frame.is-active .camera-placeholder{display:none}.scan-window{inset:8% 5%;z-index:1;pointer-events:none;border-color:#c3ef91aa;box-shadow:0 0 0 999px #0000000d}.scan-line{opacity:.4}.camera-frame video::-webkit-media-controls{display:none!important}.camera-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.camera-action{margin:8px 0;border:1px solid #d9e2d8;border-radius:12px;background:#fff;color:#345843;padding:14px 18px;font:700 16px 'DM Sans',sans-serif;cursor:pointer}.camera-action[aria-pressed="true"]{background:#e7efdf;border-color:#97b68c}.camera-action[hidden]{display:none}
.scanner{padding:10px}.scanner-panel{width:min(100%,760px);padding:clamp(18px,4vw,32px)}.camera-frame{aspect-ratio:1/1;max-height:calc(100dvh - 230px);min-height:300px}.scan-window{inset:3% 2%;border-width:4px;border-radius:22px}.scan-line{height:3px;opacity:.25}.scanner-hint{font-size:clamp(17px,3vw,21px);font-weight:600}.product-view[hidden],.scan-view[hidden]{display:none}.product-view{max-height:calc(100dvh - 20px);overflow:auto}.product-result{font-size:18px;line-height:1.6}.product-result h3{font-size:clamp(25px,5vw,34px)}.product-details,.product-warning,.product-result details{font-size:18px}.product-photo{max-width:120px;max-height:160px}.product-loading,.empty-result p{font-size:19px;line-height:1.6;color:#526259}.scan-again{width:100%;min-height:64px;margin-top:18px;border:0;border-radius:14px;background:#286149;color:#fff;font:700 18px 'DM Sans',sans-serif;cursor:pointer}
@media(max-width:600px){.scanner{padding:0}.scanner-panel{width:100%;min-height:100dvh;border-radius:0;padding:calc(16px + env(safe-area-inset-top)) 16px calc(20px + env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:flex-start}.camera-frame{width:100%;aspect-ratio:1/1;max-height:calc(100dvh - 205px);min-height:0;flex:1}.scanner-header h2{font-size:22px}.scanner-hint{margin:16px 0}.switch-camera{font-size:16px;padding:14px 20px}.product-view{overflow-y:auto}.product-content{flex:1}}
.product-result{margin-top:18px;padding:18px;border:1px solid #e2e8df;border-radius:14px;background:#fff}.product-result h3{margin:0;color:#293c32;font:700 21px Manrope,sans-serif}.product-details{margin:7px 0 14px;color:#68766d;font-size:14px}.product-photo{float:right;max-width:86px;max-height:112px;object-fit:contain;margin:0 0 10px 14px}.product-warning{clear:both;padding:12px;border-radius:9px;background:#fff3df;color:#795220;font-size:14px;line-height:1.5}.product-result details{clear:both;margin-top:12px;color:#47574e;font-size:14px;line-height:1.55}.product-result details summary{cursor:pointer;font-weight:700;color:#315b43}.product-score,.product-barcode{font-size:12px;color:#748178}.product-score{font-weight:700;color:#286149}
.product-info-section{clear:both;margin:14px 0;padding:15px 16px;border-radius:12px;background:#f2f5ef}.product-info-section h4{margin:0 0 7px;color:#315b43;font:700 19px Manrope,sans-serif}.product-info-section p{margin:0;color:#425149;font-size:17px;line-height:1.55;white-space:pre-wrap}.product-info-section.product-warning{background:#fff0dd;color:#754816}.product-info-section.product-caution{background:#f1f0e9}.allergen-section h4{color:#754816}
:root{color-scheme:light}body,.app-shell{background:#fff;color:#050b0b}.topbar{border-color:#e7eeee}.brand,.welcome h1,.scanner-header h2,.product-result h3{color:#050b0b}.brand-mark{background:#00c4bd;color:#050b0b}.topbar-note,.intro,.privacy-note,.step-card p,footer{color:#515b5a}.eyebrow{color:#008f8a}.welcome h1{letter-spacing:-.035em}.scan-button,.scan-again{background:#00c4bd;color:#050b0b;box-shadow:0 5px 0 #009a95,0 12px 22px #00a9a333}.scan-button:hover,.scan-again:hover{background:#00b5af}.scan-button:active{box-shadow:0 2px 0 #009a95}.visual-card{background:#e7fbfa}.decor-one,.decor-two{background:#bdf3f0}.decor-two{background:#fff}.caption-icon,.step-number{color:#007e79}.step-number{border-color:#9ee7e2}.steps{border-color:#e4eeee}.scanner{background:#050b0be0}.scanner-panel,.product-result{background:#fff;border-color:#dcebea}.close-button{background:#e4fbf9;color:#050b0b}.camera-action{color:#050b0b;border-color:#8adfda}.camera-action[aria-pressed="true"]{background:#00c4bd;color:#050b0b}.scanner-hint.success,.product-score{color:#007f7a}.product-info-section{background:#effcfb}.product-info-section h4,.product-result details summary{color:#007e79}.product-info-section p{color:#182221}.product-info-section.product-warning,.product-warning{background:#fff1dc;color:#704600}.product-info-section.product-caution{background:#f1f5f5}.product-warning h4,.allergen-section h4{color:#704600}.scan-window{border-color:#00e3da;box-shadow:0 0 0 999px #00000012}.scan-line{background:#00e3da;box-shadow:0 0 12px #00e3da}.camera-action:focus-visible,.scan-button:focus-visible,.scan-again:focus-visible,.close-button:focus-visible{outline:3px solid #050b0b;outline-offset:3px}