@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap";:root{color:#ebe9dc;font-synthesis:none;--muted:#9eafa4;--accent:#e5ac79;--line:#ffffff16;background:#0d211c;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.45}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button{background:0 0;border:0}button:hover,a:hover{color:var(--accent)}.masthead{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:88px;padding:0 4.2%;display:flex}.wordmark{letter-spacing:2px;align-items:center;gap:8px;font-size:15px;font-weight:700;display:flex}.wordmark .thin{color:#b6c2b8;font-weight:400}.bowl-icon{color:var(--accent);margin-top:-14px;margin-right:9px;font-size:43px;line-height:24px}.edition{letter-spacing:2px;color:var(--muted);font-size:10px}.edition span{color:var(--accent);margin-left:26px}.live{letter-spacing:1.7px;align-items:center;gap:8px;font-size:9px;display:flex}.live i{background:#b6c8a7;border-radius:50%;width:5px;height:5px;box-shadow:0 0 10px #b6c8a733}.layout{grid-template-columns:370px minmax(0,1fr);max-width:1800px;min-height:820px;margin:0 auto;padding:0 3.2% 0 4.2%;display:grid}.editorial{padding:43px 32px 25px 0}.eyebrow{letter-spacing:1.65px;color:var(--muted);font-size:9px}.eyebrow span{color:var(--accent);padding:0 7px}h1{letter-spacing:-2px;margin:25px 0 21px;font-family:Playfair Display,Georgia,serif;font-size:65px;font-weight:500;line-height:1.04}h1 em{color:var(--accent);font-weight:500}.intro{color:#a6b8aa;margin:0 0 32px;font-size:13px;line-height:1.7}.section-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}h2{margin:0;font-size:13px;font-weight:500}.section-heading>span{color:#879b8d;letter-spacing:1.1px;font-size:8px}.ingredient{border-bottom:1px solid var(--line);border-radius:4px;align-items:center;height:42px;transition:background .2s;display:flex}.ingredient.selected{background:#ffffff0a}.ingredient.hidden-row{opacity:.42}.select-ingredient{text-align:left;flex:1;align-items:center;gap:13px;height:100%;padding:0 4px;display:flex}.ingredient-number{color:#849789;font-variant-numeric:tabular-nums;font-size:9px}.ingredient-dot{border-radius:50%;width:6px;height:6px}.ingredient-name{font-size:12px}.ingredient-local{color:#92a596;margin-left:auto;font-size:10px}.eye-button{color:#9aad9e;place-items:center;width:36px;height:36px;display:grid}.eye-button svg{width:15px;height:15px}.selected .ingredient-name{color:var(--accent)}.detail{min-height:135px;margin-top:24px}.detail-kicker{letter-spacing:1.3px;color:var(--accent);font-size:8px}.detail h3{margin:10px 0;font:500 22px Playfair Display,Georgia,serif}.detail p{color:#a4b4a7;margin:0;font-size:12px;line-height:1.7}.text-button{color:var(--accent);margin-right:15px;padding:10px 0 0;font-size:11px}.text-button span{margin-left:7px}.editorial-foot{letter-spacing:1.4px;color:#82988a;margin-top:20px;font-size:8px}.editorial-foot span{color:var(--accent);padding:0 7px}.viewer{border-left:1px solid var(--line);background:radial-gradient(at 48% 40%,#29433377 0,#10282144 45%,#10282100 72%);min-height:820px;position:relative;overflow:hidden}#canvas-host{position:absolute;inset:78px 0 192px}canvas{touch-action:none;width:100%;height:100%;display:block}.viewer-top{z-index:3;justify-content:space-between;align-items:center;display:flex;position:absolute;top:35px;left:32px;right:12px}.small-label{letter-spacing:1.8px;color:#90a392;font-size:8px}#view-name{margin-top:7px;font-family:Playfair Display,Georgia,serif;font-size:21px}.icon-button{border:1px solid #ffffff24;border-radius:20px;align-items:center;gap:8px;padding:7px 12px;font-size:18px;display:flex}.icon-button span{color:#b9c5b7;font-size:10px}.controls{z-index:4;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#10271ee6;border:1px solid #ffffff20;border-radius:13px;width:min(520px,100% - 60px);padding:14px 18px 9px;position:absolute;bottom:48px;left:50%;transform:translate(-50%);box-shadow:0 15px 50px #0002}.mode-row{justify-content:space-between;align-items:center;gap:10px;display:flex}.mode-switch{background:#071c16;border:1px solid #ffffff09;border-radius:6px;padding:3px;display:flex}.mode-switch button{color:#b5c1b1;border-radius:4px;padding:8px 17px;font-size:11px}.mode-switch button.active{color:#1b3024;background:#e6b184}.rotate-button{color:var(--muted);align-items:center;gap:6px;font-size:18px;display:flex}.rotate-button span{font-size:10px}.rotate-button[aria-pressed=true]{color:var(--accent)}.slider-row{color:#bec9b8;align-items:center;gap:17px;margin:17px 0;font-size:10px;display:flex}.slider-row label{min-width:57px}.slider-row output{text-align:right;font-variant-numeric:tabular-nums;min-width:31px;color:var(--accent)}input[type=range]{min-width:0;accent-color:var(--accent);cursor:pointer;flex:1;height:3px}.camera-row{border-top:1px solid var(--line);align-items:center;gap:15px;padding-top:10px;display:flex}.camera-row>span{letter-spacing:1.1px;color:#82978a;margin-right:4px;font-size:8px}.camera-row button{color:#9bae9d;padding:3px 0;font-size:10px}.camera-row button.active{color:var(--accent)}#labels-toggle{margin-left:auto}#labels-toggle span{color:var(--accent);margin-left:5px;font-size:7px}#labels-toggle[aria-pressed=false] span{color:#61786a}.gesture-hint{text-align:center;letter-spacing:1.2px;color:#a0b19f;pointer-events:none;font-size:8px;position:absolute;bottom:226px;left:0;right:0}.gesture-hint>span{vertical-align:-2px;margin-right:8px;font-size:17px}.gesture-hint i{color:#697f6f;margin:0 10px;font-style:normal}.viewer-bottom{letter-spacing:1px;color:#8ba18f;justify-content:space-between;font-size:8px;display:flex;position:absolute;bottom:15px;left:32px;right:12px}.viewer-bottom i{color:#cfa77c;margin:0 10px;font-style:normal}.viewer-bottom a{letter-spacing:.4px;font-size:9px}#loading{z-index:5;background:#102820ed;flex-direction:column;justify-content:center;align-items:center;gap:14px;display:flex;position:absolute;inset:90px 0 195px}#loading[hidden]{display:none}#loading strong{font:500 24px Playfair Display,Georgia,serif}#load-progress{color:var(--muted);text-align:center;max-width:280px;font-size:12px;line-height:1.7}.loader-bowl{color:var(--accent);font-size:80px;animation:1.5s infinite breathe}.load-error .loader-bowl{animation:none}.retry{border:1px solid var(--accent);border-radius:20px;padding:8px 18px;font-size:12px}.model-label{pointer-events:none;color:#cfdbc8;white-space:nowrap;background:#10271ee6;border:1px solid #fff2;border-radius:4px;padding:5px 8px;font-size:9px;transition:opacity .15s;position:absolute;top:0;left:0}.model-label:before{content:"";background:#d7b28c66;width:20px;height:1px;position:absolute;top:50%;left:-21px}#labels{pointer-events:none;position:absolute;inset:0}.model-label.selected{color:var(--accent);border-color:#e5ac7977}footer{border-top:1px solid var(--line);color:#849a89;letter-spacing:.2px;justify-content:space-between;gap:20px;padding:21px 4.2%;font-size:9px;display:flex}.no-js{color:var(--accent);padding:30px}@keyframes breathe{50%{opacity:.4;transform:translateY(-5px)}}@media (width>=1600px){.layout{grid-template-columns:420px minmax(0,1fr)}.editorial{padding-right:60px}h1{font-size:77px}.viewer,.layout{min-height:900px}}@media (width<=1050px){.layout{grid-template-columns:310px minmax(0,1fr);padding-left:3%}.editorial{padding-right:22px}h1{font-size:58px}.edition{display:none}.viewer-top{left:20px}.controls{width:calc(100% - 28px);padding:12px}.gesture-hint{letter-spacing:.5px;font-size:7px}.camera-row{gap:11px}.ingredient-local{display:none}.section-heading>span{font-size:7px}}@media (width<=720px){.masthead{height:66px;padding:0 22px}.wordmark{letter-spacing:1.4px;font-size:12px}.live{letter-spacing:1px;font-size:7px}.layout{flex-direction:column;padding:0;display:flex}.editorial{padding:28px 24px 20px;display:contents}.eyebrow{order:0;padding:26px 24px 0}h1{order:1;margin:14px 24px;font-size:52px}h1 br{display:none}h1 em{white-space:nowrap}.intro{order:2;margin:0 24px 22px;font-size:12px}.intro br{display:none}.viewer{border-left:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);order:3;min-height:610px}.viewer-top{top:20px;left:24px;right:24px}.small-label{font-size:7px}#view-name{font-size:19px}#canvas-host{inset:72px 0 190px}.gesture-hint{font-size:6px;bottom:203px}.gesture-hint i{margin:0 5px}.controls{width:calc(100% - 40px);padding:12px 14px 8px;bottom:42px}.mode-switch button{padding:8px 16px}.viewer-bottom{font-size:7px;left:24px;right:24px}.viewer-bottom a{font-size:8px}.section-heading{order:4;margin:28px 24px 0}.ingredients{order:5;margin:0 24px}.ingredient{height:46px}.ingredient-local{display:block}.detail{order:6;min-height:0;margin:22px 24px 0}.editorial-foot{order:7;margin:22px 24px 28px}.ingredient-name{font-size:13px}.detail p{max-width:450px}.detail h3{font-size:24px}footer{flex-wrap:wrap;gap:10px;padding:20px 24px;line-height:1.6}footer>span:last-child{display:none}.model-label{padding:4px 6px;font-size:8px}.camera-row{gap:13px}#loading{inset:70px 0 185px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.header-actions{align-items:center;gap:24px;display:flex}.language-switch{border:1px solid var(--line);border-radius:7px;align-items:center;gap:2px;padding:3px;display:flex}.language-switch button{white-space:nowrap;color:var(--muted);border-radius:4px;padding:7px 10px;font-size:11px}.language-switch button[aria-pressed=true]{color:#1b3024;background:#e6b184}html[lang=vi] .ingredient-local{display:none}html[lang=vi] .gesture-hint{letter-spacing:.5px}html[lang=vi] .camera-row{gap:12px}html[lang=vi] .controls{width:min(570px,100% - 28px)}@media (width<=900px){.header-actions{gap:12px}.header-actions .live{display:none}}@media (width<=720px){.language-switch button{padding:7px 8px;font-size:10px}html[lang=vi] .controls{width:calc(100% - 24px)}html[lang=vi] .camera-row{gap:10px}html[lang=vi] .camera-row>span{font-size:7px}html[lang=vi] .camera-row button{font-size:9px}.masthead{gap:8px}}.game-banner{text-align:center;color:#183b2c;background:#e6b184;padding:14px 20px;font-size:12px;font-weight:600;text-decoration:none;display:block}.game-banner:hover{background:#f1c59f}