/* Beyond Nutrition visual theme. The configurator and rendering code are unchanged. */
@font-face{font-family:Inter;src:url('assets/inter.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{--paper:#fff;--panel:#fff;--stage:#f4f5f1;--ink:#101210;--muted:#777;--line:#e6e9e0;--accent:#90c136;--accent-soft:#f1f8e3;--radius:18px;--sans:Inter,Arial,Helvetica,sans-serif;--beyond-deep:#4d7019;--beyond-hover:#7ba82d}
body{background:linear-gradient(180deg,#fff 0%,#fff 65%,#f8fbf2 100%);border-top:4px solid var(--accent)}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #90c13685;outline-offset:4px}
.site-header{max-width:none;width:100%;height:110px;background:#fff;border-bottom:1px solid #e8ecdf;padding:0 max(4.2%,calc((100% - 1466px)/2));gap:34px}
.beyond-wordmark{letter-spacing:normal;line-height:0;display:block;flex-shrink:0}
.beyond-logo{display:block;width:177px;height:auto;object-fit:contain}
.header-descriptor{font-size:9px;line-height:1.7;letter-spacing:1.8px;padding-left:28px;border-left:1px solid #dfe5d5;color:#7b8274;font-weight:500}
.header-descriptor strong{font-size:10px;font-weight:700;color:#3a4035;letter-spacing:2.2px}
.header-right{gap:27px}
.local-badge{font-size:11px;color:#6c7365}
.local-badge>span{width:7px;height:7px;background:var(--accent);box-shadow:0 0 0 4px #f1f8e3}
.button{border-radius:7px;font-weight:700;font-size:12px;padding:14px 21px;letter-spacing:-.15px}
.button-dark,.button-accent{background:var(--accent);color:#182407;border-color:var(--accent);box-shadow:0 3px 10px #6e95101a}
.button-dark:hover,.button-accent:hover{background:var(--beyond-hover);border-color:var(--beyond-hover);color:#101907;box-shadow:0 4px 14px #6e951028}
main{max-width:1600px}
.intro{padding-top:35px;padding-bottom:33px;position:relative;gap:24px}
.eyebrow{font-size:9px;font-weight:700;letter-spacing:2.15px;color:#687650;margin-bottom:13px}
.eyebrow>span{background:var(--accent);width:6px;height:6px;border-radius:1px}
h1{font-size:clamp(34px,3.4vw,52px);font-weight:750;letter-spacing:-1.9px;line-height:1.15;color:#101210}
h1 em{font-family:var(--sans);font-style:normal;font-weight:750;color:#6e9720;letter-spacing:-1.9px}
.intro-copy{font-size:12px;color:#68715e;margin-top:13px;line-height:1.6}
.steps{gap:18px;font-size:10px;color:#68755b;margin-bottom:4px}
.steps li{gap:7px}
.steps li>span{background:#fff;color:#7a856b;border:1px solid #d8e1cb;width:26px;height:26px;font-size:9px;font-weight:600}
.steps li:last-child>span{background:#f1f8e3;color:#567522;border-color:#c4dca0}
.steps li:last-child{color:#4f641e;font-weight:600}
.steps .icon{color:#79a32b}
.studio{gap:25px}
.stage{border:1px solid #dfe5d4;border-radius:18px;box-shadow:0 4px 22px #23320a06;background:radial-gradient(ellipse at 50% 40%,#fbfcf8 0%,#eef2e7 82%)}
.stage:after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#90c136 0%,#b1d670 58%,#edf5e1 100%);z-index:1;pointer-events:none}
.live-pill{color:#6b795a;letter-spacing:1.25px;font-size:8px}
.live-pill>span:first-child{background:var(--accent);box-shadow:0 0 0 3px #90c13615}
.segmented{background:#e8ecdf;border-color:#dbe2d1;border-radius:7px}
.segmented button{color:#818977;border-radius:5px;font-weight:600}
.segmented button.active{color:#55781c;background:#fff;box-shadow:0 1px 5px #23320a0b}
.stage-side-label{color:#949e85;font-size:8px;letter-spacing:2.4px}
.example-pill{color:#6c795a;border-color:#dce4d0;background:#ffffffd9;border-radius:6px;font-size:9px}
.example-pill .icon{color:#6b9627}
.camera-tools{border-color:#dae3cc;background:#fff;border-radius:7px;box-shadow:0 2px 7px #24300905}
.camera-tools>span{background:#e6ecd8}
.icon-button:hover{background:#f1f8e3;color:#52751b}
.stage-bottom>p{color:#69745c}
.view-presets{background:#fff;border-color:#dce5cd;border-radius:7px}
.view-presets button{color:#7c886a;font-weight:500}
.view-presets button.active,.view-presets button:hover{background:#f1f8e3;color:#526f23}
.view-presets #auto-rotate[aria-pressed=true]{background:#eaf5d9;color:#4b711b}
.view-presets #auto-rotate{border-color:#e1e9d7}
.product-caption{padding-top:22px}
.product-caption h2{font-size:16px;font-weight:700;letter-spacing:-.4px}
.product-caption p{color:#69755a;font-size:10px}
.caption-index{color:#799251;border-color:#dce5ce;font-size:9px;font-weight:600}
.text-button{color:#535f46;font-weight:600}
.text-button .icon{color:#7eab2c}
.text-button:hover{color:#5b821c}
.preview-note p{color:#69745c}
.preview-note .icon{color:#819367}
.controls{background:#fff;border:1px solid #e1e6d9;border-radius:18px;box-shadow:0 5px 28px #293b0d08}
.control-section{border-color:#e8eddf}
.section-title h2{font-size:12px;font-weight:700;letter-spacing:-.2px;color:#171c11}
.section-title h2>span:not(.color-dot){font-weight:700;color:#78a12a;background:#f1f8e3;display:inline-grid;place-items:center;min-width:22px;height:22px;border-radius:5px;font-size:9px;letter-spacing:0}
.section-title h2{gap:8px}
.section-meta{color:#6d785e;font-size:8px}
.product-card{background:#f8faf5;border:1px solid #e1e6d9;border-radius:8px}
.product-card:hover{background:#f1f8e3;border-color:#bbd68c}
.product-card.active{background:#f1f8e3;border-color:#90c136;box-shadow:inset 0 0 0 .5px #90c136}
.product-card>span:nth-child(2){font-size:9px;font-weight:600;color:#5e694f}
.product-card.active>span:nth-child(2){color:#466a16}
.selected-check{background:#90c136;color:#173207;width:14px;height:14px;right:6px;top:6px}
.selected-check .icon{stroke-width:2.6}
.subtle-button{color:#83936f;font-size:9px}
.subtle-button:hover{color:#50751c}
.upload-area{background:#f9fcf4;border-color:#bbcf99;border-radius:8px;padding-top:18px;padding-bottom:18px}
.upload-area:hover,.upload-area.dragover{background:#f1f8e3;border-color:#90c136}
.upload-area.dragover{box-shadow:inset 0 0 0 1px #90c136}
.upload-icon{background:#ecf5df;color:#6a9227;border-radius:7px}
.upload-area strong{font-weight:650;color:#39472b}
.upload-area small{color:#687858}
.upload-plus{color:#7da32f}
.upload-details{color:#69775a}
.field-row{color:#566248}
.field-row select{background:#fafcf7;border-color:#dce5ce;color:#536547;border-radius:5px}
.checkbox-row{color:#606b51}
.checkbox-row input{accent-color:#78a42b}
.color-dot{background:var(--accent)}
.swatches button.selected:after{border-color:#6f9829;border-width:2px}
.custom-color{border-color:#a8bd88;color:#6c8d35}
.hex-row{color:#6e7c5c}
.hex-row>span{background:#fbfdf8;border-color:#dfe8d1;color:#92a17d}
.hex-row input{color:#62784b}
.slider-field>div{color:#525f45;font-size:10px}
.slider-field output{color:#64784a;font-weight:500}
.slider-field input[type=range]{background:linear-gradient(to right,#90c136 0%,#90c136 var(--progress),#e7eddd var(--progress),#e7eddd 100%)}
.slider-field input[type=range]::-webkit-slider-thumb{border-color:#85b22f;background:#fff;box-shadow:0 1px 4px #50720d1a}
.slider-field input[type=range]::-moz-range-thumb{border-color:#85b22f;background:#fff;box-shadow:0 1px 4px #50720d1a}
.more-controls>summary{color:#768d53}
.controls-footer{background:#f5f9ed;color:#657b4a;border-top:1px solid #eef3e7}
.controls-footer .icon{color:#79a12d}
.controls-footer p{font-size:8px}
.loading{background:#f6f9f0ed;color:#748657}
.loading-spinner{border-color:#dce8ca;border-top-color:#90c136}
.site-footer{border-top:1px solid #dfe7d2;padding:24px 0 28px;margin-top:33px;color:#677751;font-size:8px;letter-spacing:1.6px}
.site-footer>span:first-child{color:#75964a;font-weight:650}
.site-footer p{color:#67745b}
.footer-brand{font-size:17px;font-weight:850;letter-spacing:-.8px;line-height:1.05;color:#101210;display:flex;flex-direction:column;align-items:center;gap:4px}
.footer-brand small{font-size:5.5px;font-weight:500;letter-spacing:1.4px;color:#8a957c}
dialog{border-color:#dce7cc;background:#fff;box-shadow:0 25px 90px #1e310c2b}
dialog::backdrop{background:#18200f70;backdrop-filter:blur(5px)}
.dialog-header .eyebrow{color:#7c9b4e}
.dialog-header h2{font-family:var(--sans);font-weight:750;letter-spacing:-1.2px;font-size:30px;color:#171c10}
.dialog-note{color:#839174}
.reference-image{background:#f5f8ee}
.export-option{background:#f2f8e8;border:1px solid #e4edd7}
.export-option>.icon{color:#81ab32}
.export-option>span{border-color:#c8dda5;color:#6b902a;background:#fff}
.export-option strong{color:#41582a}
.export-option small{color:#82966a}
.export-footnote{color:#93a17e}
.toast{background:#304b16;color:#fff;border:1px solid #729e3040;border-radius:8px;box-shadow:0 6px 24px #18320b22}
.toast.error{background:#a83e28}
@media(min-width:1500px){.beyond-logo{width:190px}.site-header{height:118px}.intro{padding-top:41px;padding-bottom:36px}.section-title h2{font-size:13px}}
@media(max-width:1150px){.site-header{gap:24px;padding-left:4.2%;padding-right:4.2%}.beyond-logo{width:163px}.header-descriptor{padding-left:23px;font-size:8px}.header-descriptor strong{font-size:9px}.local-badge{display:none}.intro{gap:18px}h1{font-size:39px;letter-spacing:-1.5px}h1 em{letter-spacing:-1.5px}.steps{gap:12px}.steps li>span{width:23px;height:23px;font-size:8px}.steps li{font-size:9px}.studio{gap:20px}}
@media(max-width:900px){.site-header{height:99px;gap:20px}.beyond-logo{width:153px}.header-descriptor{padding-left:20px}.intro{padding-top:29px;padding-bottom:26px}h1{font-size:35px}.studio{gap:18px}.section-title h2{font-size:11px}.section-meta{font-size:7px}.section-title h2>span:not(.color-dot){min-width:20px;height:20px;font-size:8px}.upload-area strong{font-size:10px}.product-caption h2{font-size:14px}.product-caption p{font-size:8px}}
@media(max-width:740px){body{border-top-width:3px}.site-header{height:91px;padding:0 20px;gap:0}.beyond-logo{width:142px}.header-descriptor{display:none}.header-right .button{padding:12px 13px;border-radius:6px;font-size:10px;gap:6px}.header-right .button .icon{width:14px;height:14px}.intro{padding:27px 0 25px}.intro .eyebrow{font-size:8px;letter-spacing:1.7px;margin-bottom:13px}h1{font-size:35px;letter-spacing:-1.55px;line-height:1.14;max-width:370px}h1 em{letter-spacing:-1.55px}.intro-copy{font-size:11px;line-height:1.7;max-width:310px;margin-top:13px}.studio{gap:23px}.stage{border-radius:14px}.controls{border-radius:14px}.section-title h2{font-size:13px}.section-title h2>span:not(.color-dot){min-width:23px;height:23px;font-size:9px}.section-meta{font-size:9px}.product-card>span:nth-child(2){font-size:11px}.upload-area strong{font-size:12px}.upload-area small{font-size:9px}.upload-details{font-size:9px}.field-row{font-size:11px}.field-row select{font-size:11px}.slider-field>div{font-size:12px}.slider-field output{font-size:10px}.subtle-button{font-size:10px}.controls-footer p{font-size:9px}.product-caption h2{font-size:16px}.product-caption p{font-size:10px}.site-footer{padding:22px 0;margin-top:29px}.site-footer>span:first-child{font-size:7px;letter-spacing:1.15px}.footer-brand{font-size:16px}.footer-brand small{font-size:5px;letter-spacing:1.1px}.dialog-header h2{font-size:28px}}
@media(max-width:380px){.site-header{padding:0 14px;height:87px}.beyond-logo{width:130px}.header-right .button{font-size:9px;padding:10px 11px}.intro{padding-top:25px}h1{font-size:32px;letter-spacing:-1.3px}h1 em{letter-spacing:-1.3px}.product-caption p{font-size:8px}}