:root{color-scheme:light;--bg: #f8faf7;--surface: #ffffff;--surface-strong: #f3f7f0;--text: #17231f;--muted: #68756f;--border: #e3e8df;--primary: #0f766e;--primary-dark: #0b5d56;--primary-soft: #e6f4f1;--secondary: #f0f7f5;--danger: #a33a2f;--danger-bg: #fff0ed;--warning: #b86b00;--warning-bg: #fff4d6;--warning-soft: #fff9eb;--unknown: #315f9d;--unknown-bg: #eef5ff;--success: #146c43;--success-bg: #e8f7ef;--shadow: 0 12px 34px rgba(35, 50, 43, .08);font-family:Nunito Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 15% 0%,rgba(15,118,110,.08),transparent 24rem),radial-gradient(circle at 92% 8%,rgba(245,158,11,.1),transparent 18rem),linear-gradient(180deg,#fbfdf9,#f8faf7 42%,#f6f7f1),var(--bg);color:var(--text);font-size:15px}button,input,textarea{font:inherit}button{border:0}button:disabled{cursor:wait;opacity:.7}input,textarea{width:100%;border:1px solid var(--border);border-radius:12px;background:#fffdf9;color:var(--text);padding:.78rem .9rem;outline:none}input:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 4px #0f766e1f}.container{width:min(100% - 1.5rem,860px);margin:0 auto}.hero{background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.28),transparent 24rem),radial-gradient(circle at 12% 20%,rgba(245,214,142,.2),transparent 18rem),linear-gradient(135deg,#123c35,#0f766e 56%,#2d9b78);color:#fff;padding:2rem 0 4rem}.hero-inner{max-width:720px}.hero h1{margin:0;font-size:clamp(1.9rem,7vw,3.4rem);line-height:1.02;letter-spacing:-.045em}.hero-copy{max-width:32rem;margin:.9rem 0 0;color:#ffffffd6;font-size:1rem}.eyebrow,.section-kicker{margin:0 0 .45rem;color:var(--primary);font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.hero .eyebrow{color:#f5d68e}.app-main{display:grid;gap:.8rem;margin-top:-2.25rem;padding-bottom:2rem}.app-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;padding:.35rem;border:1px solid rgba(227,232,223,.9);border-radius:999px;background:#ffffffc7;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.app-tabs button{min-height:2.55rem;border-radius:999px;background:transparent;color:var(--muted);font-weight:800;cursor:pointer}.app-tabs button.active{background:var(--primary);color:#fff;box-shadow:0 8px 22px #0f766e33}.scan-card,.manual-card,.ecode-card,.history-card,.result-card{background:var(--surface);border:1px solid rgba(233,226,212,.82);border-radius:12px;box-shadow:var(--shadow);padding:clamp(.9rem,3vw,1.2rem)}.scan-card h2,.manual-card h2,.ecode-card h2,.history-card h2,.result-card h2{margin:0;font-size:clamp(1.2rem,3vw,1.55rem);letter-spacing:-.03em}.muted{margin:.4rem 0 0;color:var(--muted)}.barcode-form{display:grid;gap:.65rem;margin-top:1rem}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.primary-button,.secondary-button,.icon-button{cursor:pointer;border-radius:999px;font-weight:750;transition:transform .16s ease,background .16s ease}.primary-button:hover,.secondary-button:hover,.icon-button:hover{transform:translateY(-1px)}.primary-button,.secondary-button{min-height:2.75rem;padding:.72rem .9rem}.primary-button{background:var(--primary);color:#fff}.primary-button:hover{background:var(--primary-dark)}.secondary-button{background:var(--secondary);color:var(--primary-dark);box-shadow:inset 0 0 0 1px #0f766e14}.alert{border-radius:14px;background:var(--unknown-bg);color:var(--unknown);padding:.75rem .9rem;font-weight:700}.alert-error{background:var(--danger-bg);color:var(--danger)}.product-heading{display:flex;align-items:center;gap:.8rem}.product-image{width:56px;height:56px;border-radius:14px;object-fit:contain;background:var(--surface-strong);border:1px solid var(--border)}.product-meta{display:flex;flex-wrap:wrap;gap:.4rem .75rem;margin-top:.35rem;color:var(--muted);font-size:.86rem}.result-kicker-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.result-kicker-row .section-kicker{margin-bottom:0}.last-searched{color:var(--muted);font-size:.76rem;font-weight:700;white-space:nowrap}.verdict-banner{display:grid;gap:.25rem;margin-top:1rem;border-radius:16px;padding:.85rem}.verdict-banner span{font-size:clamp(1.45rem,6vw,2.2rem);font-weight:900;letter-spacing:-.04em}.verdict-banner small{font-size:.92rem;line-height:1.4}.verdict-halal .verdict-banner{background:var(--success-bg);color:var(--success)}.verdict-doubtful .verdict-banner{background:linear-gradient(135deg,var(--warning-bg),var(--warning-soft));color:var(--warning)}.verdict-haram .verdict-banner{background:var(--danger-bg);color:var(--danger)}.verdict-unknown .verdict-banner{background:var(--unknown-bg);color:var(--unknown)}.match-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem;margin:.8rem 0}.match-summary span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.12rem;border:1px solid #eee5d5;border-radius:14px;padding:.65rem;color:var(--muted);text-align:center;background:#fffdf8}.match-summary strong{display:block;color:var(--text);font-size:1.1rem}.matches-list,.ecode-list{display:grid;gap:.55rem;margin-top:.8rem}.match-card,.ecode-item,.ingredient-row,.empty-state,.ingredients-box{border:1px solid var(--border);border-radius:12px;padding:.8rem;background:#fffdf9}.match-card summary,.ecode-item div,.ingredient-row summary{display:grid;grid-template-columns:minmax(0,1fr) 6.5rem 1.2rem;align-items:center;column-gap:.65rem;cursor:pointer;list-style:none}.match-card summary::-webkit-details-marker,.ingredient-row summary::-webkit-details-marker{display:none}.match-card summary small,.ingredient-row summary small{display:inline-grid;place-items:center;justify-self:end;width:1.2rem;height:1.2rem;border-radius:999px;background:transparent;color:currentColor;font-size:1.2rem;font-weight:800;text-align:right;line-height:1}.match-card summary span,.ingredient-row summary span{text-align:left;white-space:nowrap}.match-card[open] summary small,.ingredient-row[open] summary small{transform:rotate(180deg)}.match-card span,.ecode-item span,.ingredient-row span,.match-card small,.ecode-item small{color:var(--muted)}.match-card p,.ecode-item p,.ingredient-row p,.ingredients-box p{margin:.35rem 0 0;color:var(--muted)}.match-card>small{display:block;margin-top:.25rem}.ingredient-confidence{display:block;margin-top:.45rem;color:var(--muted);font-size:.8rem;font-weight:700}.ingredient-verify{margin:.35rem 0 0;font-size:.86rem;color:var(--text);line-height:1.45}.match-haram,.ecode-haram{border:0;background:var(--danger-bg);color:var(--danger)}.match-doubtful,.ecode-doubtful{border:0;background:linear-gradient(135deg,var(--warning-bg),var(--warning-soft));color:var(--warning)}.ecode-halal{border:0;background:var(--success-bg);color:var(--success)}.ecode-unknown{border:0;background:var(--unknown-bg);color:var(--unknown)}.ecode-item span,.ecode-item p,.ecode-item small{color:currentColor}.ecode-item{box-shadow:inset 0 0 0 1px #17231f0f}.ingredient-breakdown{display:grid;gap:.55rem;margin-top:.8rem}.ingredient-row span{border-radius:999px;padding:0;font-size:.72rem;font-weight:800;text-align:center}.ingredient-row{border:0;box-shadow:inset 0 0 0 1px #17231f0f}.ingredient-halal span{background:transparent;color:var(--success)}.ingredient-halal{background:var(--success-bg);color:var(--success)}.ingredient-doubtful{background:linear-gradient(135deg,var(--warning-bg),var(--warning-soft));color:var(--warning)}.ingredient-doubtful span{background:transparent;color:var(--warning)}.ingredient-haram{background:var(--danger-bg);color:var(--danger)}.ingredient-haram span{background:transparent;color:var(--danger)}.ingredient-unknown{background:var(--unknown-bg);color:var(--unknown)}.ingredient-unknown span{background:transparent;color:var(--unknown)}.ingredient-row p,.ingredient-confidence{color:color-mix(in srgb,currentColor 72%,#17231f)}.ingredients-box{margin-top:.8rem;background:#fffdf9}.ingredients-box summary{cursor:pointer;font-weight:800}.manual-card,.ecode-card,.history-card{display:grid;gap:.75rem}.history-list{display:grid;gap:.55rem}.history-item{display:grid;grid-template-columns:48px minmax(0,1fr) auto auto;align-items:center;gap:.75rem;padding:.75rem;border:0;border-radius:14px;background:#fffdf9;box-shadow:inset 0 0 0 1px #17231f0f}.history-halal{background:var(--success-bg);color:var(--success)}.history-doubtful{background:linear-gradient(135deg,var(--warning-bg),var(--warning-soft));color:var(--warning)}.history-haram{background:var(--danger-bg);color:var(--danger)}.history-unknown{background:var(--unknown-bg);color:var(--unknown)}.history-image{width:48px;height:48px;border-radius:12px;object-fit:contain;background:var(--surface-strong);border:1px solid var(--border)}.history-content{display:grid;gap:.15rem;min-width:0}.history-content strong,.history-content span,.history-content small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-content span,.history-content small{color:color-mix(in srgb,currentColor 72%,#17231f)}.history-verdict{border-radius:999px;padding:.18rem .5rem;background:#ffffff9e;font-size:.72rem;font-weight:900;white-space:nowrap}.history-button{min-height:2.25rem;padding:.45rem .8rem;border-radius:999px;background:var(--secondary);color:var(--primary-dark);font-weight:800;cursor:pointer}.app-footer{display:grid;gap:.35rem;justify-items:center;color:var(--muted);font-size:.84rem;text-align:center}.app-footer a{color:var(--primary-dark);font-weight:800;text-decoration:underline;text-underline-offset:.18em}.disclaimer{margin:0;color:var(--muted)}.scanner-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;background:#0b201cc7;padding:1rem}.scanner-panel{width:min(100%,520px);overflow:hidden;border-radius:12px;background:var(--surface);box-shadow:var(--shadow)}.scanner-header{display:flex;align-items:center;justify-content:space-between;padding:.85rem}.scanner-header h2{margin:0}.icon-button{width:2.2rem;height:2.2rem;background:var(--secondary);color:var(--primary-dark);font-size:1.3rem}.scanner-target{min-height:280px;background:#0b0f0c}.scanner-target video,.scanner-target canvas{width:100%;max-width:100%}.scanner-help{margin:0;padding:.85rem;color:var(--muted);text-align:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width: 640px){.container{width:min(100% - .9rem,860px)}.hero{padding:1.6rem 0 3.6rem}.button-row{grid-template-columns:1fr}.match-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem}.match-summary span{gap:.08rem;padding:.55rem .35rem;font-size:.78rem}.match-summary strong{font-size:.95rem}.app-tabs{gap:.25rem;padding:.25rem}.app-tabs button{min-height:2.35rem;font-size:.84rem}.product-heading{align-items:flex-start}.match-card summary,.ecode-item div,.ingredient-row summary{grid-template-columns:minmax(0,1fr) 5.8rem 1.2rem;column-gap:.5rem}.match-card summary strong,.ingredient-row summary strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.match-card summary span,.ingredient-row summary span{font-size:.8rem}.match-card summary small,.ingredient-row summary small{font-size:.9rem}.history-item{grid-template-columns:42px minmax(0,1fr) auto}.history-button{grid-column:1 / -1}}
