:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{min-width:320px;min-height:100vh;margin:0}#root{min-height:100vh}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#17231c;background:#f7f8f5;margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,textarea,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.app{min-height:100vh}.header{justify-content:space-between;align-items:center;max-width:1180px;margin:auto;padding:24px;display:flex}.logo{letter-spacing:-.5px;align-items:center;gap:10px;font-size:21px;font-weight:750;display:flex}.logo-mark{color:#fff;background:#1d6b45;border-radius:10px;place-items:center;width:36px;height:36px;font-weight:800;display:grid;box-shadow:0 5px 14px #1d6b452e}.logo-mark.small{border-radius:8px;width:30px;height:30px;font-size:14px}.header-badge{color:#617067;align-items:center;gap:7px;font-size:13px;display:flex}.hero{text-align:center;max-width:850px;margin:75px auto 45px;padding:0 24px}.hero-tag{color:#236a46;letter-spacing:1px;background:#e7f2eb;border-radius:100px;align-items:center;gap:7px;padding:8px 13px;font-size:11px;font-weight:750;display:inline-flex}.hero h1{letter-spacing:-4px;margin:20px 0 16px;font-size:clamp(48px,7vw,78px);line-height:.98}.hero h1 span{color:#27764d}.hero p{color:#66736b;max-width:650px;margin:auto;font-size:17px;line-height:1.7}.analyzer-card{max-width:760px;margin:0 auto;padding:10px 24px 50px}.tabs{gap:8px;margin-bottom:12px;display:flex}.tab{color:#748078;cursor:pointer;background:0 0;border:0;border-radius:10px;align-items:center;gap:8px;padding:12px 18px;font-weight:650;transition:all .2s;display:flex}.tab:hover{background:#eef3ef}.tab.active{color:#216a45;background:#e5f0e9}.upload-area{cursor:pointer;background:#fff;border:2px dashed #c9d5cc;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;min-height:285px;transition:all .2s;display:flex}.upload-area:hover{background:#fbfdfb;border-color:#579473;transform:translateY(-1px)}.upload-area input{display:none}.upload-icon{color:#27764d;background:#e8f2ec;border-radius:16px;place-items:center;width:62px;height:62px;margin-bottom:15px;display:grid}.upload-area h3{margin:0 0 6px;font-size:18px}.upload-area p{color:#78847d;margin:0;font-size:14px}.file-types{color:#a0aaa4;letter-spacing:1px;margin-top:12px;font-size:11px}.text-area-wrapper{position:relative}textarea{resize:vertical;color:#243229;background:#fff;border:1px solid #d5ddd7;border-radius:18px;outline:none;width:100%;min-height:285px;padding:22px;line-height:1.6;transition:all .2s}textarea:focus{border-color:#579473;box-shadow:0 0 0 3px #e5f0e9}.character-count{color:#9aa39e;font-size:11px;position:absolute;bottom:12px;right:16px}.analyse-button{color:#fff;cursor:pointer;background:#1d6b45;border:0;border-radius:12px;justify-content:center;align-items:center;gap:10px;width:100%;margin-top:15px;padding:16px;font-weight:750;transition:all .2s;display:flex;box-shadow:0 8px 18px #1d6b4529}.analyse-button:hover{background:#165637;transform:translateY(-1px);box-shadow:0 10px 22px #1d6b4533}.analyse-button:disabled{opacity:.75;cursor:wait;transform:none}.privacy-note{text-align:center;color:#929b95;margin-top:12px;font-size:11px}.how-section,.grade-section{max-width:1180px;margin:90px auto;padding:0 24px}.section-heading span{color:#317750;letter-spacing:1.5px;font-size:11px;font-weight:800}.section-heading h2{letter-spacing:-1.5px;margin:8px 0;font-size:34px}.steps{grid-template-columns:repeat(3,1fr);gap:18px;margin-top:35px;display:grid}.step{background:#fff;border:1px solid #e2e8e3;border-radius:16px;padding:28px;transition:all .2s}.step:hover{transform:translateY(-3px);box-shadow:0 12px 30px #17231c0f}.step-number{color:#55916f;font-size:13px;font-weight:800}.step h3{margin:25px 0 8px}.step p,.grade-description{color:#707c74;font-size:14px;line-height:1.65}.grade-section{grid-template-columns:1fr 420px;align-items:center;gap:70px;display:grid}.grade-preview{color:#fff;background:#1d6b45;border-radius:20px;align-items:center;gap:20px;padding:28px;display:flex;box-shadow:0 14px 35px #1d6b4529}.grade-letter{color:#1d6b45;background:#fff;border-radius:18px;place-items:center;width:82px;height:82px;font-size:48px;font-weight:850;display:grid}.grade-preview strong{font-size:17px}.grade-preview p{opacity:.7;margin:5px 0 0;font-size:13px}.grade-preview svg{margin-left:auto}footer{border-top:1px solid #e1e7e2;justify-content:space-between;align-items:center;max-width:1180px;margin:100px auto 0;padding:25px 24px;display:flex}footer p{color:#87918b;margin:0;font-size:13px}.result-section{max-width:1000px;margin:65px auto 90px;padding:0 24px}.result-header{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px;display:flex}.result-header span,.card-title span,.insight-card>span{color:#317750;letter-spacing:1.5px;font-size:11px;font-weight:800}.result-header h2{letter-spacing:-1.7px;margin:7px 0 0;font-size:40px}.new-analysis{color:#276c48;cursor:pointer;white-space:nowrap;background:#fff;border:1px solid #cbd8cf;border-radius:10px;padding:11px 16px;font-weight:650;transition:all .2s}.new-analysis:hover{background:#edf5ef;border-color:#a9c2b1;transform:translateY(-1px)}.result-top{grid-template-columns:1.05fr .95fr;gap:18px;display:grid}.grade-card{border:1px solid #00000009;border-radius:22px;flex-direction:column;justify-content:center;min-height:290px;padding:34px;display:flex;position:relative;overflow:hidden}.grade-card:after{content:"";background:#ffffff47;border-radius:50%;width:150px;height:150px;position:absolute;top:-55px;right:-55px}.grade-label{letter-spacing:1.5px;z-index:1;font-size:11px;font-weight:800;position:relative}.big-grade{letter-spacing:-6px;z-index:1;margin:18px 0 15px;font-size:112px;font-weight:850;line-height:.9;position:relative}.grade-card p{z-index:1;max-width:420px;margin:0;font-size:14px;line-height:1.55;position:relative}.grade-A{color:#195d3a;background:#dcefe2}.grade-B{color:#4d6c2e;background:#e8f1df}.grade-C{color:#766221;background:#f4edd2}.grade-D{color:#8a432c;background:#f4dfd5}.grade-E{color:#812d2d;background:#f0d8d8}.summary-card{background:#fff;border:1px solid #e0e7e2;border-radius:22px;padding:30px;box-shadow:0 8px 25px #17231c09}.summary-card h3{letter-spacing:-.3px;margin:0 0 18px;font-size:20px}.summary-item{border-bottom:1px solid #edf0ed;justify-content:space-between;align-items:center;padding:17px 0;display:flex}.summary-item:last-child{border-bottom:0}.summary-item span{color:#68756d;font-size:14px}.summary-item strong{color:#1f2b24;font-size:20px}.ingredient-card{background:#fff;border:1px solid #e0e7e2;border-radius:22px;margin-top:18px;overflow:hidden;box-shadow:0 8px 25px #17231c09}.card-title{background:#fcfdfc;border-bottom:1px solid #e8ede9;padding:27px 30px}.card-title h3{letter-spacing:-.3px;margin:7px 0 0;font-size:21px}.ingredient-row{border-bottom:1px solid #edf1ee;justify-content:space-between;align-items:center;gap:20px;padding:19px 30px;transition:background .15s;display:flex}.ingredient-row:hover{background:#fbfcfb}.ingredient-row:last-child{border-bottom:0}.ingredient-name{flex-direction:column;gap:5px;min-width:0;display:flex}.ingredient-name strong{font-size:14px}.ingredient-name small{color:#7b867f;font-size:12px;line-height:1.45}.rating{border-radius:12px;flex-shrink:0;place-items:center;min-width:44px;height:44px;font-size:18px;font-weight:850;display:grid}.rating-A{color:#195d3a;background:#dcefe2}.rating-B{color:#4d6c2e;background:#e8f1df}.rating-C{color:#766221;background:#f4edd2}.rating-D{color:#8a432c;background:#f4dfd5}.rating-E{color:#812d2d;background:#f0d8d8}.insight-grid{grid-template-columns:1fr 1fr;gap:18px;margin-top:18px;display:grid}.insight-card{border:1px solid #0000;border-radius:20px;padding:27px}.insight-card h3{letter-spacing:-.3px;margin:8px 0 15px;font-size:20px}.insight-card ul{margin:0;padding-left:20px}.insight-card li{margin:9px 0;font-size:14px}.insight-card p{color:#68756d;font-size:14px}.insight-card.positive{color:#205d3c;background:#e7f2eb;border-color:#d2e7d9}.insight-card.concern{color:#80432f;background:#f5e7df;border-color:#ecd6ca}.result-disclaimer{color:#6c776f;text-align:center;background:#f0f3f0;border-radius:12px;margin-top:25px;padding:15px 18px;font-size:12px;line-height:1.6}.analyse-again-button{color:#fff;cursor:pointer;background:#1d6b45;border:0;border-radius:11px;margin:25px auto 0;padding:14px 24px;font-weight:700;transition:all .2s;display:block;box-shadow:0 7px 18px #1d6b4526}.analyse-again-button:hover{background:#165637;transform:translateY(-1px)}.nutrition-card{background:#fff;border:1px solid #e0e7e2;border-radius:20px;margin-top:18px;overflow:hidden}.nutrition-grid{grid-template-columns:repeat(3,1fr);display:grid}.nutrition-item{border-bottom:1px solid #edf1ee;border-right:1px solid #edf1ee;flex-direction:column;gap:8px;padding:22px 25px;display:flex}.nutrition-item:nth-child(3n){border-right:0}.nutrition-item span{color:#748078;font-size:12px}.nutrition-item strong{color:#1f2b24;font-size:19px}.analysis-status{text-align:center;color:#317750;margin-top:14px;font-size:13px;font-weight:650}@media (width<=900px){.grade-section{grid-template-columns:1fr 360px;gap:35px}.result-top{grid-template-columns:1fr}}@media (width<=750px){.header{padding:18px}.header-badge{display:none}.hero{margin-top:45px}.hero h1{letter-spacing:-2px}.steps{grid-template-columns:1fr}.grade-section{grid-template-columns:1fr;gap:30px}.grade-preview{width:100%}footer,.result-header{flex-direction:column;align-items:flex-start;gap:15px}.new-analysis{width:100%}.insight-grid{grid-template-columns:1fr}.big-grade{font-size:88px}.ingredient-row{padding:16px 18px}.ingredient-name small{max-width:230px}.nutrition-grid{grid-template-columns:1fr 1fr}.nutrition-item:nth-child(3n){border-right:1px solid #edf1ee}.nutrition-item:nth-child(2n){border-right:0}}@media (width<=480px){.hero{padding:0 18px}.hero h1{font-size:48px}.analyzer-card,.result-section,.how-section,.grade-section{padding-left:16px;padding-right:16px}.grade-card{min-height:245px;padding:26px}.big-grade{font-size:78px}.summary-card,.ingredient-card{border-radius:18px}.card-title{padding:22px}.ingredient-row{gap:12px}.rating{min-width:40px;height:40px}}